diff --git a/components/lib/accordion/Accordion.d.ts b/components/lib/accordion/Accordion.d.ts
index 9d4c0ee16..da230dc17 100755
--- a/components/lib/accordion/Accordion.d.ts
+++ b/components/lib/accordion/Accordion.d.ts
@@ -9,6 +9,7 @@
  */
 import { VNode } from 'vue';
 import { AccordionTabPassThroughOptionType } from '../accordiontab';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type AccordionPassThroughOptionType = AccordionPassThroughAttributes | ((options: AccordionPassThroughMethodOptions) => AccordionPassThroughAttributes) | null | undefined;
@@ -63,6 +64,11 @@ export interface AccordionPassThroughOptions {
      * Uses to pass attributes to AccordionTab helper components.
      */
     tab?: AccordionTabPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/autocomplete/AutoComplete.d.ts b/components/lib/autocomplete/AutoComplete.d.ts
index 0a1bb7145..b6a3e4e9c 100755
--- a/components/lib/autocomplete/AutoComplete.d.ts
+++ b/components/lib/autocomplete/AutoComplete.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { HTMLAttributes, InputHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ButtonPassThroughOptionType } from '../button';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 import { VirtualScrollerItemOptions, VirtualScrollerPassThroughOptionType, VirtualScrollerProps } from '../virtualscroller';
@@ -164,6 +165,11 @@ export interface AutoCompletePassThroughOptions {
      * Uses to pass attributes to the selected message's DOM element.
      */
     selectedMessage?: AutoCompletePassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/avatar/Avatar.d.ts b/components/lib/avatar/Avatar.d.ts
index 334fd6b20..50d9d1a25 100644
--- a/components/lib/avatar/Avatar.d.ts
+++ b/components/lib/avatar/Avatar.d.ts
@@ -8,6 +8,7 @@
  */
 import { VNode } from 'vue';
 import { AvatarGroupPassThroughOptions } from '../avatargroup';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type AvatarPassThroughOptionType = AvatarPassThroughAttributes | ((options: AvatarPassThroughMethodOptions) => AvatarPassThroughAttributes) | null | undefined;
@@ -48,6 +49,11 @@ export interface AvatarPassThroughOptions {
      * Uses to pass attributes to the image's DOM element.
      */
     image?: AvatarPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/avatargroup/AvatarGroup.d.ts b/components/lib/avatargroup/AvatarGroup.d.ts
index b04349575..defda0d64 100644
--- a/components/lib/avatargroup/AvatarGroup.d.ts
+++ b/components/lib/avatargroup/AvatarGroup.d.ts
@@ -7,6 +7,7 @@
  * @module avatargroup
  *
  */
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type AvatarGroupPassThroughOptionType = AvatarGroupPassThroughAttributes | null | undefined;
@@ -27,6 +28,11 @@ export interface AvatarGroupPassThroughOptions {
      * Uses to pass attributes to the root's DOM element.
      */
     root?: AvatarGroupPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/badge/Badge.d.ts b/components/lib/badge/Badge.d.ts
index 54cf91c44..7e1ab0631 100644
--- a/components/lib/badge/Badge.d.ts
+++ b/components/lib/badge/Badge.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type BadgePassThroughOptionType = BadgePassThroughAttributes | ((options: BadgePassThroughMethodOptions) => BadgePassThroughAttributes) | null | undefined;
@@ -35,6 +36,11 @@ export interface BadgePassThroughOptions {
      * Uses to pass attributes to the root's DOM element.
      */
     root?: BadgePassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/badgedirective/BadgeDirective.d.ts b/components/lib/badgedirective/BadgeDirective.d.ts
index f17146eb2..518e3144a 100644
--- a/components/lib/badgedirective/BadgeDirective.d.ts
+++ b/components/lib/badgedirective/BadgeDirective.d.ts
@@ -7,6 +7,9 @@
  * @module badgedirective
  */
 import { DirectiveBinding, ObjectDirective } from 'vue';
+import { DirectiveHooks } from '../basedirective';
+
+export declare type BadgeDirectivePassThroughOptionType = BadgeDirectivePassThroughAttributes | null | undefined;
 
 /**
  * Defines options of Badge.
@@ -31,73 +34,20 @@ export interface BadgeDirectiveOptions {
 export interface BadgeDirectivePassThroughOptions {
     /**
      * Uses to pass attributes to the root's DOM element.
-     *  @see {@link BadgeDirectivePassThroughDirectiveOptions}
      */
-    root?: BadgeDirectivePassThroughDirectiveOptions;
+    root?: BadgeDirectivePassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseDirective.DirectiveHooks}
+     */
+    hooks?: DirectiveHooks;
 }
 
 /**
- * Custom passthrough(pt) directive options.
+ * Custom passthrough attributes for each DOM elements
  */
-export interface BadgeDirectivePassThroughDirectiveOptions {
-    /**
-     * Uses to pass attributes to the life cycle hooks.
-     * @see {@link BadgeDirectivePassThroughHooksOptions}
-     */
-    hooks?: BadgeDirectivePassThroughHooksOptions;
-    /**
-     * Uses to pass attributes to the styles.
-     *  @see {@link BadgeDirectivePassThroughCSSOptions}
-     */
-    css?: BadgeDirectivePassThroughCSSOptions;
-}
-
-/**
- * Custom passthrough(pt) hooks options.
- */
-export interface BadgeDirectivePassThroughHooksOptions {
-    /**
-     * Called before bound element's attributes or event listeners are applied.
-     */
-    created?: DirectiveBinding;
-    /**
-     * Called right before the element is inserted into the DOM.
-     */
-    beforeMount?: DirectiveBinding;
-    /**
-     * Called when the bound element's parent component and all its children are mounted.
-     */
-    mounted?: DirectiveBinding;
-    /**
-     * Called before the parent component is updated.
-     */
-    beforeUpdate?: DirectiveBinding;
-    /**
-     * Called after the parent component and all of its children have updated all of its children have updated.
-     */
-    updated?: DirectiveBinding;
-    /**
-     * Called before the parent component is unmounted.
-     */
-    beforeUnmount?: DirectiveBinding;
-    /**
-     * Called when the parent component is unmounted.
-     */
-    unmounted?: DirectiveBinding;
-}
-
-/**
- * Custom passthrough(pt) css options.
- */
-export interface BadgeDirectivePassThroughCSSOptions {
-    /**
-     * Style class of the element.
-     */
-    class?: any;
-    /**
-     * Inline style of the element.
-     */
-    style?: any;
+export interface BadgeDirectivePassThroughAttributes {
+    [key: string]: any;
 }
 
 /**
diff --git a/components/lib/basecomponent/BaseComponent.d.ts b/components/lib/basecomponent/BaseComponent.d.ts
new file mode 100644
index 000000000..f0ac7d992
--- /dev/null
+++ b/components/lib/basecomponent/BaseComponent.d.ts
@@ -0,0 +1,14 @@
+export interface ComponentHooks {
+    beforeCreate?(): void;
+    created?(): void;
+    beforeMount?(): void;
+    mounted?(): void;
+    beforeUpdate?(): void;
+    updated?(): void;
+    beforeUnmount?(): void;
+    unmounted?(): void;
+}
+
+export interface BaseComponentPassThroughOptions {
+    hooks?: ComponentHooks;
+}
diff --git a/components/lib/basecomponent/package.json b/components/lib/basecomponent/package.json
index 1133b654f..a44fa6ca0 100644
--- a/components/lib/basecomponent/package.json
+++ b/components/lib/basecomponent/package.json
@@ -2,6 +2,7 @@
   "main": "./basecomponent.cjs.js",
   "module": "./basecomponent.esm.js",
   "unpkg": "./basecomponent.min.js",
+  "types": "./BaseComponent.d.ts",
   "browser": {
     "./sfc": "./BaseComponent.vue"
   }
diff --git a/components/lib/basedirective/BaseDirective.d.ts b/components/lib/basedirective/BaseDirective.d.ts
new file mode 100644
index 000000000..ca18d91fa
--- /dev/null
+++ b/components/lib/basedirective/BaseDirective.d.ts
@@ -0,0 +1,7 @@
+import { ObjectDirective } from 'vue';
+
+export interface DirectiveHooks extends Omit<ObjectDirective, 'getSSRProps' | 'deep'> {}
+
+export interface BaseDirectivePassThroughOptions {
+    hooks?: DirectiveHooks;
+}
diff --git a/components/lib/basedirective/package.json b/components/lib/basedirective/package.json
index 2888b0f19..c1773766f 100644
--- a/components/lib/basedirective/package.json
+++ b/components/lib/basedirective/package.json
@@ -1,5 +1,6 @@
 {
     "main": "./basedirective.cjs.js",
     "module": "./basedirective.esm.js",
-    "unpkg": "./basedirective.min.js"
+    "unpkg": "./basedirective.min.js",
+    "types": "./BaseDirective.d.ts"
 }
diff --git a/components/lib/blockui/BlockUI.d.ts b/components/lib/blockui/BlockUI.d.ts
index b90473ef5..391ed7a77 100755
--- a/components/lib/blockui/BlockUI.d.ts
+++ b/components/lib/blockui/BlockUI.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type BlockUIPassThroughOptionType = BlockUIPassThroughAttributes | ((options: BlockUIPassThroughMethodOptions) => BlockUIPassThroughAttributes) | null | undefined;
@@ -29,6 +30,11 @@ export interface BlockUIPassThroughOptions {
      * Uses to pass attributes to the root's DOM element.
      */
     root?: BlockUIPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/breadcrumb/Breadcrumb.d.ts b/components/lib/breadcrumb/Breadcrumb.d.ts
index e9bf5f9f6..1d98b7fae 100755
--- a/components/lib/breadcrumb/Breadcrumb.d.ts
+++ b/components/lib/breadcrumb/Breadcrumb.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { MenuItem } from '../menuitem';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -57,6 +58,11 @@ export interface BreadcrumbPassThroughOptions {
      * Uses to pass attributes to the separator icon's DOM element.
      */
     separatorIcon?: BreadcrumbPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/button/Button.d.ts b/components/lib/button/Button.d.ts
index 1920665ee..ecced97d5 100755
--- a/components/lib/button/Button.d.ts
+++ b/components/lib/button/Button.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { ButtonHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type ButtonPassThroughOptionType = ButtonPassThroughAttributes | ((options: ButtonPassThroughMethodOptions) => ButtonPassThroughAttributes) | null | undefined;
@@ -45,6 +46,11 @@ export interface ButtonPassThroughOptions {
      * Uses to pass attributes to the badge's DOM element.
      */
     badge?: ButtonPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/calendar/Calendar.d.ts b/components/lib/calendar/Calendar.d.ts
index 8b44c4f2b..2c63fa70d 100755
--- a/components/lib/calendar/Calendar.d.ts
+++ b/components/lib/calendar/Calendar.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { HTMLAttributes, InputHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ButtonPassThroughOptionType } from '../button';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -282,6 +283,11 @@ export interface CalendarPassThroughOptions {
      * @see {@link ButtonPassThroughOptionType}
      */
     clearButton?: ButtonPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/card/Card.d.ts b/components/lib/card/Card.d.ts
index 88161677c..1d971c18b 100755
--- a/components/lib/card/Card.d.ts
+++ b/components/lib/card/Card.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type CardPassThroughOptionType = CardPassThroughAttributes | null | undefined;
@@ -45,6 +46,11 @@ export interface CardPassThroughOptions {
      * Uses to pass attributes to the footer's DOM element.
      */
     footer?: CardPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/carousel/Carousel.d.ts b/components/lib/carousel/Carousel.d.ts
index c87ba68ad..c4b8f9eaf 100755
--- a/components/lib/carousel/Carousel.d.ts
+++ b/components/lib/carousel/Carousel.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { ButtonHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type CarouselPassThroughOptionType = CarouselPassThroughAttributes | ((options: CarouselPassThroughMethodOptions) => CarouselPassThroughAttributes) | null | undefined;
@@ -89,6 +90,11 @@ export interface CarouselPassThroughOptions {
      * Uses to pass attributes to the footer's DOM element.
      */
     footer?: CarouselPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/cascadeselect/CascadeSelect.d.ts b/components/lib/cascadeselect/CascadeSelect.d.ts
index 860dfc461..4dd272dde 100644
--- a/components/lib/cascadeselect/CascadeSelect.d.ts
+++ b/components/lib/cascadeselect/CascadeSelect.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { HTMLAttributes, InputHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type CascadeSelectPassThroughOptionType = CascadeSelectPassThroughAttributes | ((options: CascadeSelectPassThroughMethodOptions) => CascadeSelectPassThroughAttributes) | null | undefined;
@@ -102,6 +103,11 @@ export interface CascadeSelectPassThroughOptions {
      * Uses to pass attributes to the search result message text aria's DOM element.
      */
     hiddenSearchResult?: CascadeSelectPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/chart/Chart.d.ts b/components/lib/chart/Chart.d.ts
index 93b72ae75..425b69ce3 100755
--- a/components/lib/chart/Chart.d.ts
+++ b/components/lib/chart/Chart.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { CanvasHTMLAttributes } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type ChartPassThroughOptionType = ChartPassThroughAttributes | ((options: ChartPassThroughMethodOptions) => ChartPassThroughAttributes) | null | undefined;
@@ -32,6 +33,11 @@ export interface ChartPassThroughOptions {
      * Uses to pass attributes to the canvas's DOM element.
      */
     canvas?: ChartPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/checkbox/Checkbox.d.ts b/components/lib/checkbox/Checkbox.d.ts
index 611fe7bd7..2f7d6ba65 100755
--- a/components/lib/checkbox/Checkbox.d.ts
+++ b/components/lib/checkbox/Checkbox.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { InputHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type CheckboxPassThroughOptionType = CheckboxPassThroughAttributes | ((options: CheckboxPassThroughMethodOptions) => CheckboxPassThroughAttributes) | null | undefined;
@@ -46,6 +47,11 @@ export interface CheckboxPassThroughOptions {
      * Uses to pass attributes to the hidden input's DOM element.
      */
     hiddenInput?: CheckboxPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/chip/Chip.d.ts b/components/lib/chip/Chip.d.ts
index 14874484c..f9170049d 100644
--- a/components/lib/chip/Chip.d.ts
+++ b/components/lib/chip/Chip.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type ChipPassThroughOptionType = ChipPassThroughAttributes | ((options: ChipPassThroughMethodOptions) => ChipPassThroughAttributes) | null | undefined;
@@ -45,6 +46,11 @@ export interface ChipPassThroughOptions {
      * Uses to pass attributes to the removeIcon's DOM element.
      */
     removeIcon?: ChipPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/chips/Chips.d.ts b/components/lib/chips/Chips.d.ts
index 6e3492b77..36c1b04dc 100755
--- a/components/lib/chips/Chips.d.ts
+++ b/components/lib/chips/Chips.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { InputHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type ChipsPassThroughOptionType = ChipsPassThroughAttributes | ((options: ChipsPassThroughMethodOptions) => ChipsPassThroughAttributes) | null | undefined;
@@ -75,6 +76,11 @@ export interface ChipsPassThroughOptions {
      * Uses to pass attributes to the input's DOM element.
      */
     input?: ChipsPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/colorpicker/ColorPicker.d.ts b/components/lib/colorpicker/ColorPicker.d.ts
index d4ebb031f..33df547f3 100755
--- a/components/lib/colorpicker/ColorPicker.d.ts
+++ b/components/lib/colorpicker/ColorPicker.d.ts
@@ -7,6 +7,7 @@
  * @module colorpicker
  *
  */
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type ColorPickerPassThroughOptionType = ColorPickerPassThroughAttributes | ((options: ColorPickerPassThroughMethodOptions) => ColorPickerPassThroughAttributes) | null | undefined;
@@ -75,6 +76,11 @@ export interface ColorPickerPassThroughOptions {
      * Uses to pass attributes to the hue handler's DOM element.
      */
     hueHandle: ColorPickerPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/column/Column.d.ts b/components/lib/column/Column.d.ts
index b2332bbd9..93f5bdedd 100755
--- a/components/lib/column/Column.d.ts
+++ b/components/lib/column/Column.d.ts
@@ -10,6 +10,7 @@
  */
 
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ButtonPassThroughOptionType } from '../button';
 import { DataTablePassThroughOptions } from '../datatable';
 import { DropdownPassThroughOptionType } from '../dropdown';
@@ -313,6 +314,11 @@ export interface ColumnPassThroughOptions {
      * Uses to pass attributes to the hidden input's DOM element.
      */
     hiddenInput?: ColumnPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/columngroup/ColumnGroup.d.ts b/components/lib/columngroup/ColumnGroup.d.ts
index 65360f7cf..f0f25e1b5 100755
--- a/components/lib/columngroup/ColumnGroup.d.ts
+++ b/components/lib/columngroup/ColumnGroup.d.ts
@@ -5,6 +5,7 @@
  * [Live Demo](https://www.primevue.org/datatable/)
  * @module columngroup
  */
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { DataTablePassThroughOptions } from '../datatable';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -28,6 +29,11 @@ export interface ColumnGroupPassThroughOptions {
      * Uses to pass attributes to the root's DOM element.
      */
     root?: ColumnGroupPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/config/PrimeVue.d.ts b/components/lib/config/PrimeVue.d.ts
index c951a3540..f8d8ee470 100644
--- a/components/lib/config/PrimeVue.d.ts
+++ b/components/lib/config/PrimeVue.d.ts
@@ -81,7 +81,7 @@ import { TieredMenuPassThroughOptions } from '../tieredmenu';
 import { TimelinePassThroughOptions } from '../timeline';
 import { ToastPassThroughOptions } from '../toast';
 import { ToolbarPassThroughOptions } from '../toolbar';
-import { TooltipPassThroughOptions } from '../tooltip';
+import { TooltipDirectivePassThroughOptions } from '../tooltip';
 import { TreePassThroughOptions } from '../tree';
 import { TreeSelectPassThroughOptions } from '../treeselect';
 import { TreeTablePassThroughOptions } from '../treetable';
@@ -111,7 +111,6 @@ interface PrimeVuePTOptions {
     autocomplete?: DefaultPTOptions<AutoCompletePassThroughOptions>;
     avatar?: DefaultPTOptions<AvatarPassThroughOptions>;
     badge?: DefaultPTOptions<BadgePassThroughOptions>;
-    badgedirective?: DefaultPTOptions<BadgeDirectivePassThroughOptions>;
     blockui?: DefaultPTOptions<BlockUIPassThroughOptions>;
     breadcrumb?: DefaultPTOptions<BreadcrumbPassThroughOptions>;
     button?: DefaultPTOptions<ButtonPassThroughOptions>;
@@ -140,7 +139,6 @@ interface PrimeVuePTOptions {
     editor?: DefaultPTOptions<EditorPassThroughOptions>;
     fieldset?: DefaultPTOptions<FieldsetPassThroughOptions>;
     fileupload?: DefaultPTOptions<FileUploadPassThroughOptions>;
-    focustrap?: DefaultPTOptions<FocusTrapDirectivePassThroughOptions>;
     galleria?: DefaultPTOptions<GalleriaPassThroughOptions>;
     image?: DefaultPTOptions<ImagePassThroughOptions>;
     inlinemessage?: DefaultPTOptions<InlineMessagePassThroughOptions>;
@@ -167,7 +165,6 @@ interface PrimeVuePTOptions {
     progressbar?: DefaultPTOptions<ProgressBarPassThroughOptions>;
     progressspinner?: DefaultPTOptions<ProgressSpinnerPassThroughOptions>;
     radiobutton?: DefaultPTOptions<RadioButtonPassThroughOptions>;
-    ripple?: DefaultPTOptions<RippleDirectivePassThroughOptions>;
     row?: DefaultPTOptions<RowPassThroughOptions>;
     scrollpanel?: DefaultPTOptions<ScrollPanelPassThroughOptions>;
     scrolltop?: DefaultPTOptions<ScrollTopPassThroughOptions>;
@@ -178,7 +175,6 @@ interface PrimeVuePTOptions {
     splitbutton?: DefaultPTOptions<SplitButtonPassThroughOptions>;
     splitter?: DefaultPTOptions<SplitterPassThroughOptions>;
     steps?: DefaultPTOptions<StepsPassThroughOptions>;
-    styleclass?: DefaultPTOptions<StyleClassDirectivePassThroughOptions>;
     tabmenu?: DefaultPTOptions<TabMenuPassThroughOptions>;
     tabpanel?: DefaultPTOptions<TabPanelPassThroughOptions>;
     tabview?: DefaultPTOptions<TabViewPassThroughOptions>;
@@ -189,11 +185,17 @@ interface PrimeVuePTOptions {
     timeline?: DefaultPTOptions<TimelinePassThroughOptions>;
     toast?: DefaultPTOptions<ToastPassThroughOptions>;
     toolbar?: DefaultPTOptions<ToolbarPassThroughOptions>;
-    tooltip?: DefaultPTOptions<TooltipPassThroughOptions>;
     tree?: DefaultPTOptions<TreePassThroughOptions>;
     treeselect?: DefaultPTOptions<TreeSelectPassThroughOptions>;
     treetable?: DefaultPTOptions<TreeTablePassThroughOptions>;
     virtualscroller?: DefaultPTOptions<VirtualScrollerPassThroughOptions>;
+    directives?: {
+        badge?: BadgeDirectivePassThroughOptions;
+        tooltip?: TooltipDirectivePassThroughOptions;
+        styleclass?: StyleClassDirectivePassThroughOptions;
+        focustrap?: FocusTrapDirectivePassThroughOptions;
+        ripple?: RippleDirectivePassThroughOptions;
+    };
 }
 
 interface PrimeVueLocaleAriaOptions {
diff --git a/components/lib/confirmdialog/ConfirmDialog.d.ts b/components/lib/confirmdialog/ConfirmDialog.d.ts
index be7c0ef41..0cfbd9151 100644
--- a/components/lib/confirmdialog/ConfirmDialog.d.ts
+++ b/components/lib/confirmdialog/ConfirmDialog.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ButtonPassThroughOptions } from '../button';
 import { ConfirmationOptions } from '../confirmationoptions';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
@@ -77,6 +78,11 @@ export interface ConfirmDialogPassThroughOptions {
      * @see {@link ButtonPassThroughOptions}
      */
     acceptButton?: ButtonPassThroughOptions;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/confirmpopup/ConfirmPopup.d.ts b/components/lib/confirmpopup/ConfirmPopup.d.ts
index ae38ecd83..c1fd05df2 100644
--- a/components/lib/confirmpopup/ConfirmPopup.d.ts
+++ b/components/lib/confirmpopup/ConfirmPopup.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ButtonPassThroughOptions } from '../button';
 import { ConfirmationOptions } from '../confirmationoptions';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
@@ -57,6 +58,11 @@ export interface ConfirmPopupPassThroughOptions {
      * @see {@link ButtonPassThroughOptions}
      */
     acceptButton?: ButtonPassThroughOptions;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/contextmenu/ContextMenu.d.ts b/components/lib/contextmenu/ContextMenu.d.ts
index cb1d57443..49de6acb9 100755
--- a/components/lib/contextmenu/ContextMenu.d.ts
+++ b/components/lib/contextmenu/ContextMenu.d.ts
@@ -9,6 +9,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { MenuItem } from '../menuitem';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -68,6 +69,11 @@ export interface ContextMenuPassThroughOptions {
      * Uses to pass attributes to the submenu's DOM element.
      */
     submenu?: ContextMenuPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/datatable/DataTable.d.ts b/components/lib/datatable/DataTable.d.ts
index 53fdcd3d2..e8915c375 100755
--- a/components/lib/datatable/DataTable.d.ts
+++ b/components/lib/datatable/DataTable.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { InputHTMLAttributes, TableHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ColumnPassThroughOptionType } from '../column';
 import { ColumnGroupPassThroughOptionType } from '../columngroup';
 import { PaginatorPassThroughOptionType } from '../paginator';
@@ -646,6 +647,11 @@ export interface DataTablePassThroughOptions {
      * Uses to pass attributes to the Column helper components.
      */
     column?: ColumnPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/dataview/DataView.d.ts b/components/lib/dataview/DataView.d.ts
index 84145ab87..7c5862f16 100755
--- a/components/lib/dataview/DataView.d.ts
+++ b/components/lib/dataview/DataView.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { PaginatorPassThroughOptionType } from '../paginator';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -81,6 +82,11 @@ export interface DataViewPassThroughOptions {
      * Uses to pass attributes to the footer's DOM element.
      */
     footer?: DataViewPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/dataviewlayoutoptions/DataViewLayoutOptions.d.ts b/components/lib/dataviewlayoutoptions/DataViewLayoutOptions.d.ts
index 2e8a3b498..39fcabf3a 100755
--- a/components/lib/dataviewlayoutoptions/DataViewLayoutOptions.d.ts
+++ b/components/lib/dataviewlayoutoptions/DataViewLayoutOptions.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type DataViewLayoutOptionsPassThroughOptionType = DataViewLayoutOptionsPassThroughAttributes | ((options: DataViewLayoutOptionsPassThroughMethodOptions) => DataViewLayoutOptionsPassThroughAttributes) | null | undefined;
@@ -45,6 +46,11 @@ export interface DataViewLayoutOptionsPassThroughOptions {
      * Uses to pass attributes to the grid icon's DOM element.
      */
     gridIcon?: DataViewLayoutOptionsPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/deferredcontent/DeferredContent.d.ts b/components/lib/deferredcontent/DeferredContent.d.ts
index 441bf4f4d..675300d11 100755
--- a/components/lib/deferredcontent/DeferredContent.d.ts
+++ b/components/lib/deferredcontent/DeferredContent.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type DeferredContentPassThroughOptionType = DeferredContentPassThroughAttributes | ((options: DeferredContentPassThroughMethodOptions) => DeferredContentPassThroughAttributes) | null | undefined;
@@ -29,6 +30,11 @@ export interface DeferredContentPassThroughOptions {
      * Uses to pass attributes to the root's DOM element.
      */
     root?: DeferredContentPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/dialog/Dialog.d.ts b/components/lib/dialog/Dialog.d.ts
index 6837af440..e4629c6b8 100755
--- a/components/lib/dialog/Dialog.d.ts
+++ b/components/lib/dialog/Dialog.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { HTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type DialogPassThroughOptionType = DialogPassThroughAttributes | ((options: DialogPassThroughMethodOptions) => DialogPassThroughAttributes) | null | undefined;
@@ -69,6 +70,11 @@ export interface DialogPassThroughOptions {
      * Uses to pass attributes to the mask's DOM element.
      */
     mask?: DialogPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/divider/Divider.d.ts b/components/lib/divider/Divider.d.ts
index 62573494b..90acbc4c4 100644
--- a/components/lib/divider/Divider.d.ts
+++ b/components/lib/divider/Divider.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type DividerPassThroughOptionType = DividerPassThroughAttributes | ((options: DividerPassThroughMethodOptions) => DividerPassThroughAttributes) | null | undefined;
@@ -32,6 +33,11 @@ export interface DividerPassThroughOptions {
      * Uses to pass attributes to the content's DOM element.
      */
     content?: DividerPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/dock/Dock.d.ts b/components/lib/dock/Dock.d.ts
index c380e3023..2f20e3469 100644
--- a/components/lib/dock/Dock.d.ts
+++ b/components/lib/dock/Dock.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { MenuItem } from '../menuitem';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -55,6 +56,11 @@ export interface DockPassThroughOptions {
      * Uses to pass attributes to the icon's DOM element.
      */
     icon?: DockPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/dropdown/Dropdown.d.ts b/components/lib/dropdown/Dropdown.d.ts
index 0d96ef3cc..eb0d9f023 100755
--- a/components/lib/dropdown/Dropdown.d.ts
+++ b/components/lib/dropdown/Dropdown.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { HTMLAttributes, InputHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 import { VirtualScrollerItemOptions, VirtualScrollerPassThroughOptionType, VirtualScrollerProps } from '../virtualscroller';
 
@@ -142,6 +143,11 @@ export interface DropdownPassThroughOptions {
      * Uses to pass attributes to the hidden last focusable element's DOM element.
      */
     hiddenLastFocusableEl?: DropdownPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/editor/Editor.d.ts b/components/lib/editor/Editor.d.ts
index a664e9963..65f46c17b 100755
--- a/components/lib/editor/Editor.d.ts
+++ b/components/lib/editor/Editor.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 export declare type EditorPassThroughOptionType = EditorPassThroughAttributes | ((options: EditorPassThroughMethodOptions) => EditorPassThroughAttributes) | null | undefined;
 
@@ -159,6 +160,11 @@ export interface EditorPassThroughOptions {
      * Uses to pass attributes to the content's DOM element.
      */
     content?: EditorPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/fieldset/Fieldset.d.ts b/components/lib/fieldset/Fieldset.d.ts
index 44f8fe5e9..5ae1faa19 100755
--- a/components/lib/fieldset/Fieldset.d.ts
+++ b/components/lib/fieldset/Fieldset.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { AnchorHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type FieldsetPassThroughOptionType = FieldsetPassThroughAttributes | ((options: FieldsetPassThroughMethodOptions) => FieldsetPassThroughAttributes) | null | undefined;
@@ -68,6 +69,11 @@ export interface FieldsetPassThroughOptions {
      * Uses to pass attributes to the content's DOM element.
      */
     content?: FieldsetPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/fileupload/FileUpload.d.ts b/components/lib/fileupload/FileUpload.d.ts
index b9126e34d..3e455d46b 100755
--- a/components/lib/fileupload/FileUpload.d.ts
+++ b/components/lib/fileupload/FileUpload.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ButtonPassThroughOptions } from '../button';
 import { MessagePassThroughOptions } from '../message';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
@@ -247,6 +248,11 @@ export interface FileUploadPassThroughOptions {
      * Uses to pass attributes to the upload icon's DOM element.
      */
     uploadIcon?: FileUploadPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/focustrap/FocusTrap.d.ts b/components/lib/focustrap/FocusTrap.d.ts
index e22366bf1..2616efc61 100644
--- a/components/lib/focustrap/FocusTrap.d.ts
+++ b/components/lib/focustrap/FocusTrap.d.ts
@@ -7,6 +7,9 @@
  * @module focustrap
  */
 import { DirectiveBinding, ObjectDirective } from 'vue';
+import { DirectiveHooks } from '../basedirective';
+
+export declare type FocusTrapDirectivePassThroughOptionType = FocusTrapDirectivePassThroughAttributes | null | undefined;
 
 /**
  * Defines options of FocusTrap.
@@ -36,83 +39,28 @@ export interface FocusTrapOptions {
 export interface FocusTrapDirectivePassThroughOptions {
     /**
      * Uses to pass attributes to the root's DOM element.
-     *  @see {@link FocusTrapDirectivePassThroughDirectiveOptions}
      */
-    root?: FocusTrapDirectivePassThroughDirectiveOptions;
+    root?: FocusTrapDirectivePassThroughOptionType;
     /**
      * Uses to pass attributes to the first focusable element's DOM element.
-     *  @see {@link FocusTrapDirectivePassThroughDirectiveOptions}
      */
-    firstFocusableElement?: FocusTrapDirectivePassThroughDirectiveOptions;
+    firstFocusableElement?: FocusTrapDirectivePassThroughOptionType;
     /**
      * Uses to pass attributes to the last focusable element's DOM element.
-     *  @see {@link FocusTrapDirectivePassThroughDirectiveOptions}
      */
-    lastFocusableElement?: FocusTrapDirectivePassThroughDirectiveOptions;
+    lastFocusableElement?: FocusTrapDirectivePassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseDirective.DirectiveHooks}
+     */
+    hooks?: DirectiveHooks;
 }
 
 /**
- * Custom passthrough(pt) directive options.
+ * Custom passthrough attributes for each DOM elements
  */
-export interface FocusTrapDirectivePassThroughDirectiveOptions {
-    /**
-     * Uses to pass attributes to the life cycle hooks.
-     * @see {@link FocusTrapDirectivePassThroughHooksOptions}
-     */
-    hooks?: FocusTrapDirectivePassThroughHooksOptions;
-    /**
-     * Uses to pass attributes to the styles.
-     *  @see {@link FocusTrapDirectivePassThroughCSSOptions}
-     */
-    css?: FocusTrapDirectivePassThroughCSSOptions;
-}
-
-/**
- * Custom passthrough(pt) hooks options.
- */
-export interface FocusTrapDirectivePassThroughHooksOptions {
-    /**
-     * Called before bound element's attributes or event listeners are applied.
-     */
-    created?: DirectiveBinding;
-    /**
-     * Called right before the element is inserted into the DOM.
-     */
-    beforeMount?: DirectiveBinding;
-    /**
-     * Called when the bound element's parent component and all its children are mounted.
-     */
-    mounted?: DirectiveBinding;
-    /**
-     * Called before the parent component is updated.
-     */
-    beforeUpdate?: DirectiveBinding;
-    /**
-     * Called after the parent component and all of its children have updated all of its children have updated.
-     */
-    updated?: DirectiveBinding;
-    /**
-     * Called before the parent component is unmounted.
-     */
-    beforeUnmount?: DirectiveBinding;
-    /**
-     * Called when the parent component is unmounted.
-     */
-    unmounted?: DirectiveBinding;
-}
-
-/**
- * Custom passthrough(pt) css options.
- */
-export interface FocusTrapDirectivePassThroughCSSOptions {
-    /**
-     * Style class of the element.
-     */
-    class?: any;
-    /**
-     * Inline style of the element.
-     */
-    style?: any;
+export interface FocusTrapDirectivePassThroughAttributes {
+    [key: string]: any;
 }
 
 /**
diff --git a/components/lib/galleria/Galleria.d.ts b/components/lib/galleria/Galleria.d.ts
index 09dcff0bc..f0b0214b8 100755
--- a/components/lib/galleria/Galleria.d.ts
+++ b/components/lib/galleria/Galleria.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { ButtonHTMLAttributes, HTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 export declare type GalleriaPassThroughOptionType = GalleriaPassThroughAttributes | ((options: GalleriaPassThroughMethodOptions) => GalleriaPassThroughAttributes) | null | undefined;
 
@@ -143,6 +144,11 @@ export interface GalleriaPassThroughOptions {
      * Uses to pass attributes to the mask's DOM element.
      */
     mask?: GalleriaPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/image/Image.d.ts b/components/lib/image/Image.d.ts
index 12ad0d707..c80c810c6 100644
--- a/components/lib/image/Image.d.ts
+++ b/components/lib/image/Image.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 export declare type ImagePassThroughOptionType = ImagePassThroughAttributes | ((options: ImagePassThroughMethodOptions) => ImagePassThroughAttributes) | null | undefined;
 
@@ -96,6 +97,11 @@ export interface ImagePassThroughOptions {
      * Uses to pass attributes to the preview's DOM element.
      */
     preview?: ImagePassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/inlinemessage/InlineMessage.d.ts b/components/lib/inlinemessage/InlineMessage.d.ts
index a65c91a72..9ee1bc645 100755
--- a/components/lib/inlinemessage/InlineMessage.d.ts
+++ b/components/lib/inlinemessage/InlineMessage.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type InlineMessagePassThroughOptionType = InlineMessagePassThroughAttributes | ((options: InlineMessagePassThroughMethodOptions) => InlineMessagePassThroughAttributes) | null | undefined;
@@ -37,6 +38,11 @@ export interface InlineMessagePassThroughOptions {
      * Uses to pass attributes to the text's DOM element.
      */
     text?: InlineMessagePassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/inplace/Inplace.d.ts b/components/lib/inplace/Inplace.d.ts
index 1de356221..28c2daf57 100755
--- a/components/lib/inplace/Inplace.d.ts
+++ b/components/lib/inplace/Inplace.d.ts
@@ -9,6 +9,7 @@
  */
 
 import { ButtonHTMLAttributes, HTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ButtonPassThroughOptions } from '../button';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -44,6 +45,11 @@ export interface InplacePassThroughOptions {
      * @see {@link ButtonPassThroughOptions}
      */
     closeButton?: ButtonPassThroughOptions;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/inputmask/InputMask.d.ts b/components/lib/inputmask/InputMask.d.ts
index c95e8ad0f..19f1d6271 100755
--- a/components/lib/inputmask/InputMask.d.ts
+++ b/components/lib/inputmask/InputMask.d.ts
@@ -7,6 +7,7 @@
  * @module inputmask
  *
  */
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type InputMaskPassThroughOptionType = InputMaskPassThroughAttributes | null | undefined;
@@ -20,6 +21,11 @@ export interface InputMaskPassThroughOptions {
      * Uses to pass attributes to the root's DOM element.
      */
     root?: InputMaskPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/inputnumber/InputNumber.d.ts b/components/lib/inputnumber/InputNumber.d.ts
index 5ce199869..c33ba5add 100755
--- a/components/lib/inputnumber/InputNumber.d.ts
+++ b/components/lib/inputnumber/InputNumber.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { ButtonHTMLAttributes, InputHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ButtonPassThroughOptionType } from '../button';
 import { InputTextPassThroughOptionType } from '../inputtext';
 import { ClassComponent, GlobalComponentConstructor, Nullable } from '../ts-helpers';
@@ -80,6 +81,11 @@ export interface InputNumberPassThroughOptions {
      * @see {@link ButtonPassThroughOptions}
      */
     decrementButton?: ButtonPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/inputswitch/InputSwitch.d.ts b/components/lib/inputswitch/InputSwitch.d.ts
index 3eb9a44c8..30c4ab296 100755
--- a/components/lib/inputswitch/InputSwitch.d.ts
+++ b/components/lib/inputswitch/InputSwitch.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { InputHTMLAttributes } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type InputSwitchPassThroughOptionType = InputSwitchPassThroughAttributes | ((options: InputSwitchPassThroughMethodOptions) => InputSwitchPassThroughAttributes) | null | undefined;
@@ -41,6 +42,11 @@ export interface InputSwitchPassThroughOptions {
      * Uses to pass attributes to the hidden input's DOM element.
      */
     hiddenInput?: InputSwitchPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/inputtext/InputText.d.ts b/components/lib/inputtext/InputText.d.ts
index b4a8bd2df..fb5f9d0ad 100755
--- a/components/lib/inputtext/InputText.d.ts
+++ b/components/lib/inputtext/InputText.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { InputHTMLAttributes } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor, Nullable } from '../ts-helpers';
 
 export declare type InputTextPassThroughOptionType = InputTextPassThroughAttributes | null | undefined;
@@ -21,6 +22,11 @@ export interface InputTextPassThroughOptions {
      * Uses to pass attributes to the root's DOM element.
      */
     root?: InputTextPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/knob/Knob.d.ts b/components/lib/knob/Knob.d.ts
index 72257fb2c..68daed534 100644
--- a/components/lib/knob/Knob.d.ts
+++ b/components/lib/knob/Knob.d.ts
@@ -7,6 +7,7 @@
  * @module knob
  *
  */
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type KnobPassThroughOptionType = KnobPassThroughAttributes | ((options: KnobPassThroughMethodOptions) => KnobPassThroughAttributes) | null | undefined;
@@ -44,6 +45,11 @@ export interface KnobPassThroughOptions {
      * Uses to pass attributes to the label's DOM element.
      */
     label?: KnobPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/listbox/Listbox.d.ts b/components/lib/listbox/Listbox.d.ts
index affa0a404..47404c952 100755
--- a/components/lib/listbox/Listbox.d.ts
+++ b/components/lib/listbox/Listbox.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { InputHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 import { VirtualScrollerItemOptions, VirtualScrollerPassThroughOptionType, VirtualScrollerProps } from '../virtualscroller';
 
@@ -118,6 +119,11 @@ export interface ListboxPassThroughOptions {
      * Uses to pass attributes to the hidden last focusable element's DOM element.
      */
     hiddenLastFocusableEl?: ListboxPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/megamenu/MegaMenu.d.ts b/components/lib/megamenu/MegaMenu.d.ts
index fba3a49ea..34c276de9 100755
--- a/components/lib/megamenu/MegaMenu.d.ts
+++ b/components/lib/megamenu/MegaMenu.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { MenuItem } from '../menuitem';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -91,6 +92,11 @@ export interface MegaMenuPassThroughOptions {
      * Uses to pass attributes to the end of the component.
      */
     end?: MegaMenuPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/menu/Menu.d.ts b/components/lib/menu/Menu.d.ts
index f76570a5c..0b776192e 100755
--- a/components/lib/menu/Menu.d.ts
+++ b/components/lib/menu/Menu.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { MenuItem } from '../menuitem';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -71,6 +72,11 @@ export interface MenuPassThroughOptions {
      * Uses to pass attributes to the end of the component.
      */
     end?: MenuPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/menubar/Menubar.d.ts b/components/lib/menubar/Menubar.d.ts
index 6e113f0bf..5f73a232b 100755
--- a/components/lib/menubar/Menubar.d.ts
+++ b/components/lib/menubar/Menubar.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { ButtonHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { MenuItem } from '../menuitem';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -83,6 +84,11 @@ export interface MenubarPassThroughOptions {
      * Uses to pass attributes to the end of the component.
      */
     end?: MenubarPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/message/Message.d.ts b/components/lib/message/Message.d.ts
index 1f3e59038..5589a02ee 100755
--- a/components/lib/message/Message.d.ts
+++ b/components/lib/message/Message.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { ButtonHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type MessagePassThroughOptionType = MessagePassThroughAttributes | ((options: MessagePassThroughMethodOptions) => MessagePassThroughAttributes) | null | undefined;
@@ -49,6 +50,11 @@ export interface MessagePassThroughOptions {
      * Uses to pass attributes to the button icon's DOM element.
      */
     buttonIcon?: MessagePassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/multiselect/MultiSelect.d.ts b/components/lib/multiselect/MultiSelect.d.ts
index 7137483d7..9b66444cc 100755
--- a/components/lib/multiselect/MultiSelect.d.ts
+++ b/components/lib/multiselect/MultiSelect.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { ButtonHTMLAttributes, HTMLAttributes, InputHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 import { VirtualScrollerItemOptions, VirtualScrollerPassThroughOptionType, VirtualScrollerProps } from '../virtualscroller';
 
@@ -213,6 +214,11 @@ export interface MultiSelectPassThroughOptions {
      * Uses to pass attributes to the hidden last focusable element's DOM element.
      */
     hiddenLastFocusableEl?: MultiSelectPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/orderlist/OrderList.d.ts b/components/lib/orderlist/OrderList.d.ts
index b09fa54d6..df4592e7e 100755
--- a/components/lib/orderlist/OrderList.d.ts
+++ b/components/lib/orderlist/OrderList.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { ButtonHTMLAttributes, HTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ButtonPassThroughOptionType } from '../button';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -100,6 +101,11 @@ export interface OrderListPassThroughOptions {
      * Uses to pass attributes to the item's DOM element.
      */
     item?: OrderListPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/organizationchart/OrganizationChart.d.ts b/components/lib/organizationchart/OrganizationChart.d.ts
index b07d26e92..0748227bd 100755
--- a/components/lib/organizationchart/OrganizationChart.d.ts
+++ b/components/lib/organizationchart/OrganizationChart.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type OrganizationChartPassThroughOptionType = OrganizationChartPassThroughAttributes | ((options: OrganizationChartPassThroughMethodOptions) => OrganizationChartPassThroughAttributes) | null | undefined;
@@ -132,6 +133,11 @@ export interface OrganizationChartPassThroughOptions {
      * Uses to pass attributes to the nodeCell's DOM element.
      */
     nodeCell?: OrganizationChartPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/overlaypanel/OverlayPanel.d.ts b/components/lib/overlaypanel/OverlayPanel.d.ts
index 82d7bf452..7f75297bc 100755
--- a/components/lib/overlaypanel/OverlayPanel.d.ts
+++ b/components/lib/overlaypanel/OverlayPanel.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type OverlayPanelPassThroughOptionType = OverlayPanelPassThroughAttributes | ((options: OverlayPanelPassThroughMethodOptions) => OverlayPanelPassThroughAttributes) | null | undefined;
@@ -41,6 +42,11 @@ export interface OverlayPanelPassThroughOptions {
      * Uses to pass attributes to the close icon's DOM element.
      */
     closeIcon?: OverlayPanelPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/paginator/Paginator.d.ts b/components/lib/paginator/Paginator.d.ts
index 5d5e6c211..e115ccb05 100755
--- a/components/lib/paginator/Paginator.d.ts
+++ b/components/lib/paginator/Paginator.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { DropdownPassThroughOptionType } from '../dropdown';
 import { InputNumberPassThroughOptionType } from '../inputnumber';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
@@ -128,6 +129,11 @@ export interface PaginatorPassThroughOptions {
      * Uses to pass attributes to the end's DOM element.
      */
     end?: PaginatorPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/panel/Panel.d.ts b/components/lib/panel/Panel.d.ts
index 33ae5d903..660ddf9f6 100755
--- a/components/lib/panel/Panel.d.ts
+++ b/components/lib/panel/Panel.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { ButtonHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type PanelPassThroughOptionType = PanelPassThroughAttributes | ((options: PanelPassThroughMethodOptions) => PanelPassThroughAttributes) | null | undefined;
@@ -76,6 +77,11 @@ export interface PanelPassThroughOptions {
      * Uses to pass attributes to the footer's DOM element.
      */
     footer?: PanelPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/panelmenu/PanelMenu.d.ts b/components/lib/panelmenu/PanelMenu.d.ts
index db7dfba81..67e6657bd 100755
--- a/components/lib/panelmenu/PanelMenu.d.ts
+++ b/components/lib/panelmenu/PanelMenu.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { MenuItem } from '../menuitem';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -99,6 +100,11 @@ export interface PanelMenuPassThroughOptions {
      * Uses to pass attributes to the separator's DOM element.
      */
     separator?: PanelMenuPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/password/Password.d.ts b/components/lib/password/Password.d.ts
index d2b223f28..36d4894d1 100755
--- a/components/lib/password/Password.d.ts
+++ b/components/lib/password/Password.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { HTMLAttributes, InputHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { InputTextPassThroughOptionType } from '../inputtext';
 import { ClassComponent, GlobalComponentConstructor, Nullable } from '../ts-helpers';
 
@@ -63,6 +64,11 @@ export interface PasswordPassThroughOptions {
      * Uses to pass attributes to the hidden accessible DOM element.
      */
     hiddenAccesible?: PasswordPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/picklist/PickList.d.ts b/components/lib/picklist/PickList.d.ts
index f864882a1..ba1fa02a7 100755
--- a/components/lib/picklist/PickList.d.ts
+++ b/components/lib/picklist/PickList.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { ButtonHTMLAttributes, HTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ButtonPassThroughOptionType } from '../button';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -188,6 +189,11 @@ export interface PickListPassThroughOptions {
      * Uses to pass attributes to the Button component.
      */
     targetMoveBottomButton?: ButtonPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/progressbar/ProgressBar.d.ts b/components/lib/progressbar/ProgressBar.d.ts
index 8da5d0885..46dfa2911 100755
--- a/components/lib/progressbar/ProgressBar.d.ts
+++ b/components/lib/progressbar/ProgressBar.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type ProgressBarPassThroughOptionType = ProgressBarPassThroughAttributes | ((options: ProgressBarPassThroughMethodOptions) => ProgressBarPassThroughAttributes) | null | undefined;
@@ -36,6 +37,11 @@ export interface ProgressBarPassThroughOptions {
      * Uses to pass attributes to the label's DOM element.
      */
     label?: ProgressBarPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/progressspinner/ProgressSpinner.d.ts b/components/lib/progressspinner/ProgressSpinner.d.ts
index 2deea45cb..3a15ce024 100755
--- a/components/lib/progressspinner/ProgressSpinner.d.ts
+++ b/components/lib/progressspinner/ProgressSpinner.d.ts
@@ -7,6 +7,7 @@
  * @module progressspinner
  *
  */
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type ProgressSpinnerPassThroughOptionType = ProgressSpinnerPassThroughAttributes | ((options: ProgressSpinnerPassThroughMethodOptions) => ProgressSpinnerPassThroughAttributes) | null | undefined;
@@ -35,6 +36,11 @@ export interface ProgressSpinnerPassThroughOptions {
      * Uses to pass attributes to the circle's DOM element.
      */
     circle?: ProgressSpinnerPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/radiobutton/RadioButton.d.ts b/components/lib/radiobutton/RadioButton.d.ts
index 591f5462f..02f82984e 100755
--- a/components/lib/radiobutton/RadioButton.d.ts
+++ b/components/lib/radiobutton/RadioButton.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { InputHTMLAttributes } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type RadioButtonPassThroughOptionType = RadioButtonPassThroughAttributes | ((options: RadioButtonPassThroughMethodOptions) => RadioButtonPassThroughAttributes) | null | undefined;
@@ -45,6 +46,11 @@ export interface RadioButtonPassThroughOptions {
      * Uses to pass attributes to the hidden accessible DOM element.
      */
     hiddenInput?: RadioButtonPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/rating/Rating.d.ts b/components/lib/rating/Rating.d.ts
index 7c34a1b1e..ad849f421 100755
--- a/components/lib/rating/Rating.d.ts
+++ b/components/lib/rating/Rating.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type RatingPassThroughOptionType = RatingPassThroughAttributes | ((options: RatingPassThroughMethodOptions) => RatingPassThroughAttributes) | null | undefined;
@@ -66,6 +67,11 @@ export interface RatingPassThroughOptions {
      * Uses to pass attributes to the hidden item input's DOM element.
      */
     hiddenItemInput?: RatingPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/ripple/Ripple.d.ts b/components/lib/ripple/Ripple.d.ts
index 5d338a7ee..bf48b8a04 100644
--- a/components/lib/ripple/Ripple.d.ts
+++ b/components/lib/ripple/Ripple.d.ts
@@ -7,6 +7,9 @@
  * @module ripple
  */
 import { DirectiveBinding, ObjectDirective } from 'vue';
+import { DirectiveHooks } from '../basedirective';
+
+export declare type RippleDirectivePassThroughOptionType = RippleDirectivePassThroughAttributes | null | undefined;
 
 /**
  * Defines options of Ripple.
@@ -31,73 +34,20 @@ export interface RippleOptions {
 export interface RippleDirectivePassThroughOptions {
     /**
      * Uses to pass attributes to the root's DOM element.
-     *  @see {@link RippleDirectivePassThroughOptions}
      */
-    root?: RippleDirectivePassThroughOptions;
+    root?: RippleDirectivePassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseDirective.DirectiveHooks}
+     */
+    hooks?: DirectiveHooks;
 }
 
 /**
- * Custom passthrough(pt) directive options.
+ * Custom passthrough attributes for each DOM elements
  */
-export interface RippleDirectivePassThroughOptions {
-    /**
-     * Uses to pass attributes to the life cycle hooks.
-     * @see {@link RippleDirectivePassThroughHooksOptions}
-     */
-    hooks?: RippleDirectivePassThroughHooksOptions;
-    /**
-     * Uses to pass attributes to the styles.
-     *  @see {@link RippleDirectivePassThroughCSSOptions}
-     */
-    css?: RippleDirectivePassThroughCSSOptions;
-}
-
-/**
- * Custom passthrough(pt) hooks options.
- */
-export interface RippleDirectivePassThroughHooksOptions {
-    /**
-     * Called before bound element's attributes or event listeners are applied.
-     */
-    created?: DirectiveBinding;
-    /**
-     * Called right before the element is inserted into the DOM.
-     */
-    beforeMount?: DirectiveBinding;
-    /**
-     * Called when the bound element's parent component and all its children are mounted.
-     */
-    mounted?: DirectiveBinding;
-    /**
-     * Called before the parent component is updated.
-     */
-    beforeUpdate?: DirectiveBinding;
-    /**
-     * Called after the parent component and all of its children have updated all of its children have updated.
-     */
-    updated?: DirectiveBinding;
-    /**
-     * Called before the parent component is unmounted.
-     */
-    beforeUnmount?: DirectiveBinding;
-    /**
-     * Called when the parent component is unmounted.
-     */
-    unmounted?: DirectiveBinding;
-}
-
-/**
- * Custom passthrough(pt) css options.
- */
-export interface RippleDirectivePassThroughCSSOptions {
-    /**
-     * Style class of the element.
-     */
-    class?: any;
-    /**
-     * Inline style of the element.
-     */
-    style?: any;
+export interface RippleDirectivePassThroughAttributes {
+    [key: string]: any;
 }
 
 /**
diff --git a/components/lib/row/Row.d.ts b/components/lib/row/Row.d.ts
index 93e0b73a1..4a4c8b17d 100755
--- a/components/lib/row/Row.d.ts
+++ b/components/lib/row/Row.d.ts
@@ -5,6 +5,7 @@
  *
  * @module row
  */
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ColumnGroupPassThroughOptions } from '../columngroup';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -28,6 +29,11 @@ export interface RowPassThroughOptions {
      * Uses to pass attributes to the root's DOM element.
      */
     root?: RowPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/scrollpanel/ScrollPanel.d.ts b/components/lib/scrollpanel/ScrollPanel.d.ts
index 6ff746acd..9daeefb4a 100644
--- a/components/lib/scrollpanel/ScrollPanel.d.ts
+++ b/components/lib/scrollpanel/ScrollPanel.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type ScrollPanelPassThroughOptionType = ScrollPanelPassThroughAttributes | ((options: ScrollPanelPassThroughMethodOptions) => ScrollPanelPassThroughAttributes) | null | undefined;
@@ -45,6 +46,11 @@ export interface ScrollPanelPassThroughOptions {
      * Uses to pass attributes to the vertical panel's DOM element.
      */
     barY?: ScrollPanelPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/scrolltop/ScrollTop.d.ts b/components/lib/scrolltop/ScrollTop.d.ts
index 873753955..9d55788e3 100644
--- a/components/lib/scrolltop/ScrollTop.d.ts
+++ b/components/lib/scrolltop/ScrollTop.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type ScrollTopPassThroughOptionType = ScrollTopPassThroughAttributes | ((options: ScrollTopPassThroughMethodOptions) => ScrollTopPassThroughAttributes) | null | undefined;
@@ -33,6 +34,11 @@ export interface ScrollTopPassThroughOptions {
      * Uses to pass attributes to the icon's DOM element.
      */
     icon?: ScrollTopPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/selectbutton/SelectButton.d.ts b/components/lib/selectbutton/SelectButton.d.ts
index ea3058fb4..4129c3173 100755
--- a/components/lib/selectbutton/SelectButton.d.ts
+++ b/components/lib/selectbutton/SelectButton.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type SelectButtonPassThroughOptionType = SelectButtonPassThroughAttributes | ((options: SelectButtonPassThroughMethodOptions) => SelectButtonPassThroughAttributes) | null | undefined;
@@ -38,6 +39,11 @@ export interface SelectButtonPassThroughOptions {
      * Uses to pass attributes to the label's DOM element.
      */
     label?: SelectButtonPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/sidebar/Sidebar.d.ts b/components/lib/sidebar/Sidebar.d.ts
index b42899ac6..8c9b3f07b 100755
--- a/components/lib/sidebar/Sidebar.d.ts
+++ b/components/lib/sidebar/Sidebar.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type SidebarPassThroughOptionType = SidebarPassThroughAttributes | ((options: SidebarPassThroughMethodOptions) => SidebarPassThroughAttributes) | null | undefined;
@@ -53,6 +54,11 @@ export interface SidebarPassThroughOptions {
      * Uses to pass attributes to the mask's DOM element.
      */
     mask?: SidebarPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/skeleton/Skeleton.d.ts b/components/lib/skeleton/Skeleton.d.ts
index 1710cf1c7..167a1b9e1 100644
--- a/components/lib/skeleton/Skeleton.d.ts
+++ b/components/lib/skeleton/Skeleton.d.ts
@@ -7,6 +7,7 @@
  * @module skeleton
  *
  */
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type SkeletonPassThroughOptionType = SkeletonPassThroughAttributes | ((options: SkeletonPassThroughMethodOptions) => SkeletonPassThroughAttributes) | null | undefined;
@@ -27,6 +28,11 @@ export interface SkeletonPassThroughOptions {
      * Uses to pass attributes to the root's DOM element.
      */
     root?: SkeletonPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/slider/Slider.d.ts b/components/lib/slider/Slider.d.ts
index 50b7f3d33..a26c2adde 100755
--- a/components/lib/slider/Slider.d.ts
+++ b/components/lib/slider/Slider.d.ts
@@ -7,6 +7,7 @@
  * @module slider
  *
  */
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type SliderPassThroughOptionType = SliderPassThroughAttributes | ((options: SliderPassThroughMethodOptions) => SliderPassThroughAttributes) | null | undefined;
@@ -43,6 +44,11 @@ export interface SliderPassThroughOptions {
      * Uses to pass attributes to the end handler's DOM element.
      */
     endHandler?: SliderPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/speeddial/SpeedDial.d.ts b/components/lib/speeddial/SpeedDial.d.ts
index 3ee37cc55..161692342 100644
--- a/components/lib/speeddial/SpeedDial.d.ts
+++ b/components/lib/speeddial/SpeedDial.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ButtonPassThroughOptions } from '../button';
 import { MenuItem } from '../menuitem';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
@@ -57,6 +58,11 @@ export interface SpeedDialPassThroughOptions {
      * Uses to pass attributes to the mask's DOM element.
      */
     mask?: SpeedDialPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/splitbutton/SplitButton.d.ts b/components/lib/splitbutton/SplitButton.d.ts
index af1f82ba8..e8a92ab9b 100755
--- a/components/lib/splitbutton/SplitButton.d.ts
+++ b/components/lib/splitbutton/SplitButton.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { ButtonHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ButtonPassThroughOptions } from '../button';
 import { MenuItem } from '../menuitem';
 import { TieredMenuPassThroughOptions } from '../tieredmenu';
@@ -46,6 +47,11 @@ export interface SplitButtonPassThroughOptions {
      * @see {@link TieredMenuPassThroughOptions}
      */
     menu?: TieredMenuPassThroughOptions;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/splitter/Splitter.d.ts b/components/lib/splitter/Splitter.d.ts
index 6bcb4dbdf..2074a28ce 100644
--- a/components/lib/splitter/Splitter.d.ts
+++ b/components/lib/splitter/Splitter.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type SplitterPassThroughOptionType = SplitterPassThroughAttributes | ((options: SplitterPassThroughMethodOptions) => SplitterPassThroughAttributes) | null | undefined;
@@ -67,6 +68,11 @@ export interface SplitterPassThroughOptions {
      * Uses to pass attributes to the gutter handler's DOM element.
      */
     gutterHandler?: SplitterPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/splitterpanel/SplitterPanel.d.ts b/components/lib/splitterpanel/SplitterPanel.d.ts
index d34980301..5e2b7a94b 100644
--- a/components/lib/splitterpanel/SplitterPanel.d.ts
+++ b/components/lib/splitterpanel/SplitterPanel.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type SplitterPanelPassThroughOptionType = SplitterPanelPassThroughAttributes | ((options: SplitterPanelPassThroughMethodOptions) => SplitterPanelPassThroughAttributes) | null | undefined;
@@ -28,6 +29,11 @@ export interface SplitterPanelPassThroughOptions {
      * Uses to pass attributes to the root's DOM element.
      */
     root?: SplitterPanelPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/steps/Steps.d.ts b/components/lib/steps/Steps.d.ts
index 9225fd930..0b3340d8f 100755
--- a/components/lib/steps/Steps.d.ts
+++ b/components/lib/steps/Steps.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { MenuItem } from '../menuitem';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -49,6 +50,11 @@ export interface StepsPassThroughOptions {
      * Uses to pass attributes to the label's DOM element.
      */
     label?: StepsPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/styleclass/StyleClass.d.ts b/components/lib/styleclass/StyleClass.d.ts
index 8f7096f50..782092b6f 100644
--- a/components/lib/styleclass/StyleClass.d.ts
+++ b/components/lib/styleclass/StyleClass.d.ts
@@ -7,6 +7,7 @@
  * @module styleclass
  */
 import { DirectiveBinding, ObjectDirective } from 'vue';
+import { DirectiveHooks } from '../basedirective';
 
 /**
  * Defines options of StyleClass.
@@ -61,44 +62,10 @@ export interface StyleClassOptions {
  */
 export interface StyleClassDirectivePassThroughOptions {
     /**
-     * Uses to pass attributes to the life cycle hooks.
-     * @see {@link StyleClassDirectivePassThroughHooksOptions}
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseDirective.DirectiveHooks}
      */
-    hooks?: StyleClassDirectivePassThroughHooksOptions;
-}
-
-/**
- * Custom passthrough(pt) hooks options.
- */
-export interface StyleClassDirectivePassThroughHooksOptions {
-    /**
-     * Called before bound element's attributes or event listeners are applied.
-     */
-    created?: DirectiveBinding;
-    /**
-     * Called right before the element is inserted into the DOM.
-     */
-    beforeMount?: DirectiveBinding;
-    /**
-     * Called when the bound element's parent component and all its children are mounted.
-     */
-    mounted?: DirectiveBinding;
-    /**
-     * Called before the parent component is updated.
-     */
-    beforeUpdate?: DirectiveBinding;
-    /**
-     * Called after the parent component and all of its children have updated all of its children have updated.
-     */
-    updated?: DirectiveBinding;
-    /**
-     * Called before the parent component is unmounted.
-     */
-    beforeUnmount?: DirectiveBinding;
-    /**
-     * Called when the parent component is unmounted.
-     */
-    unmounted?: DirectiveBinding;
+    hooks?: DirectiveHooks;
 }
 
 /**
diff --git a/components/lib/tabmenu/TabMenu.d.ts b/components/lib/tabmenu/TabMenu.d.ts
index 8cb760cb0..30b49b8cc 100755
--- a/components/lib/tabmenu/TabMenu.d.ts
+++ b/components/lib/tabmenu/TabMenu.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { MenuItem } from '../menuitem';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -55,6 +56,11 @@ export interface TabMenuPassThroughOptions {
      * Uses to pass attributes to the inkbar's DOM element.
      */
     inkbar?: TabMenuPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/tabpanel/TabPanel.d.ts b/components/lib/tabpanel/TabPanel.d.ts
index 37db9ab66..857f951c7 100755
--- a/components/lib/tabpanel/TabPanel.d.ts
+++ b/components/lib/tabpanel/TabPanel.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { AnchorHTMLAttributes, HTMLAttributes, LiHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { TabViewPassThroughOptions } from '../tabview';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -47,6 +48,11 @@ export interface TabPanelPassThroughOptions {
      * Uses to pass attributes to the list's DOM element.
      */
     content?: TabPanelPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 export interface TabPanelPassThroughAttributes {
diff --git a/components/lib/tabview/TabView.d.ts b/components/lib/tabview/TabView.d.ts
index b630e831b..507cc9021 100755
--- a/components/lib/tabview/TabView.d.ts
+++ b/components/lib/tabview/TabView.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { ButtonHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { TabPanelPassThroughOptionType } from '../tabpanel';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -84,6 +85,11 @@ export interface TabViewPassThroughOptions {
      * Uses to pass attributes to TabPanel helper components.
      */
     tab?: TabPanelPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/tag/Tag.d.ts b/components/lib/tag/Tag.d.ts
index 7c1b7578d..5c5156ea8 100644
--- a/components/lib/tag/Tag.d.ts
+++ b/components/lib/tag/Tag.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type TagPassThroughOptionType = TagPassThroughAttributes | ((options: TagPassThroughMethodOptions) => TagPassThroughAttributes) | null | undefined;
@@ -36,6 +37,11 @@ export interface TagPassThroughOptions {
      * Uses to pass attributes to the value's DOM element.
      */
     value?: TagPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/terminal/Terminal.d.ts b/components/lib/terminal/Terminal.d.ts
index ff3384c21..b213487f7 100755
--- a/components/lib/terminal/Terminal.d.ts
+++ b/components/lib/terminal/Terminal.d.ts
@@ -7,6 +7,7 @@
  * @module terminal
  *
  */
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type TerminalPassThroughOptionType = TerminalPassThroughAttributes | ((options: TerminalPassThroughMethodOptions) => TerminalPassThroughAttributes) | null | undefined;
@@ -60,6 +61,11 @@ export interface TerminalPassThroughOptions {
      * Uses to pass attributes to the command text's DOM element.
      */
     commandText?: TerminalPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/textarea/Textarea.d.ts b/components/lib/textarea/Textarea.d.ts
index 7e402bec3..16e359691 100755
--- a/components/lib/textarea/Textarea.d.ts
+++ b/components/lib/textarea/Textarea.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { TextareaHTMLAttributes } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type TextareaPassThroughOptionType = TextareaPassThroughAttributes | ((options: TextareaPassThroughMethodOptions) => TextareaPassThroughAttributes) | null | undefined;
@@ -28,6 +29,11 @@ export interface TextareaPassThroughOptions {
      * Uses to pass attributes to the root's DOM element.
      */
     root?: TextareaPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/tieredmenu/TieredMenu.d.ts b/components/lib/tieredmenu/TieredMenu.d.ts
index ee98a1bd7..bdbeb5989 100755
--- a/components/lib/tieredmenu/TieredMenu.d.ts
+++ b/components/lib/tieredmenu/TieredMenu.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { MenuItem } from '../menuitem';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -67,6 +68,11 @@ export interface TieredMenuPassThroughOptions {
      * Uses to pass attributes to the submenu's DOM element.
      */
     submenu?: TieredMenuPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/timeline/Timeline.d.ts b/components/lib/timeline/Timeline.d.ts
index b5b8da24d..637f21dea 100644
--- a/components/lib/timeline/Timeline.d.ts
+++ b/components/lib/timeline/Timeline.d.ts
@@ -7,6 +7,7 @@
  * @module timeline
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type TimelinePassThroughOptionType = TimelinePassThroughAttributes | null | undefined;
@@ -44,6 +45,11 @@ export interface TimelinePassThroughOptions {
      * Uses to pass attributes to the content's DOM element.
      */
     content?: TimelinePassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/toast/Toast.d.ts b/components/lib/toast/Toast.d.ts
index 1eaa2d100..830bab20c 100755
--- a/components/lib/toast/Toast.d.ts
+++ b/components/lib/toast/Toast.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { ButtonHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type ToastPassThroughOptionType = ToastPassThroughAttributes | ((options: ToastPassThroughMethodOptions) => ToastPassThroughAttributes) | null | undefined;
@@ -69,6 +70,11 @@ export interface ToastPassThroughOptions {
      * Uses to pass attributes to the button icon's DOM element.
      */
     buttonIcon?: ToastPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/togglebutton/ToggleButton.d.ts b/components/lib/togglebutton/ToggleButton.d.ts
index 0cc5965ff..973631c7b 100755
--- a/components/lib/togglebutton/ToggleButton.d.ts
+++ b/components/lib/togglebutton/ToggleButton.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { InputHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type ToggleButtonPassThroughOptionType = ToggleButtonPassThroughAttributes | ((options: ToggleButtonPassThroughMethodOptions) => ToggleButtonPassThroughAttributes) | null | undefined;
@@ -45,6 +46,11 @@ export interface ToggleButtonPassThroughOptions {
      * Uses to pass attributes to the hidden input's DOM element.
      */
     hiddenInput?: ToggleButtonPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/toolbar/Toolbar.d.ts b/components/lib/toolbar/Toolbar.d.ts
index 8f50f5064..81790f2f4 100755
--- a/components/lib/toolbar/Toolbar.d.ts
+++ b/components/lib/toolbar/Toolbar.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type ToolbarPassThroughOptionType = ToolbarPassThroughAttributes | ((options: ToolbarPassThroughMethodOptions) => ToolbarPassThroughAttributes) | null | undefined;
@@ -40,6 +41,11 @@ export interface ToolbarPassThroughOptions {
      * Uses to pass attributes to the right's DOM element.
      */
     end?: ToolbarPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/tooltip/Tooltip.d.ts b/components/lib/tooltip/Tooltip.d.ts
index e88dfaa7c..59a591838 100755
--- a/components/lib/tooltip/Tooltip.d.ts
+++ b/components/lib/tooltip/Tooltip.d.ts
@@ -8,6 +8,9 @@
  *
  */
 import { DirectiveBinding, ObjectDirective } from 'vue';
+import { DirectiveHooks } from '../basedirective';
+
+export declare type TooltipDirectivePassThroughOptionType = TooltipDirectivePassThroughAttributes | null | undefined;
 
 /**
  * Defines options of Tooltip.
@@ -52,9 +55,9 @@ export interface TooltipOptions {
     hideDelay?: number | undefined;
     /**
      * Uses to pass attributes to DOM elements inside the component.
-     * @type {TooltipPassThroughOptions}
+     * @type {TooltipDirectivePassThroughOptions}
      */
-    pt?: TooltipPassThroughOptions;
+    pt?: TooltipDirectivePassThroughOptions;
     /**
      * When enabled, it removes component related styles in the core.
      * @defaultValue false
@@ -62,6 +65,37 @@ export interface TooltipOptions {
     unstyled?: boolean;
 }
 
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link TooltipOptions.pt}
+ */
+export interface TooltipDirectivePassThroughOptions {
+    /**
+     * Uses to pass attributes to the root's DOM element.
+     */
+    root?: TooltipDirectivePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the text's DOM element.
+     */
+    text?: TooltipDirectivePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the arrow's DOM element.
+     */
+    arrow?: TooltipDirectivePassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseDirective.DirectiveHooks}
+     */
+    hooks?: DirectiveHooks;
+}
+
+/**
+ * Custom passthrough attributes for each DOM elements
+ */
+export interface TooltipDirectivePassThroughAttributes {
+    [key: string]: any;
+}
+
 /**
  * Defines modifiers of Tooltip.
  */
@@ -93,92 +127,6 @@ export interface TooltipDirectiveModifiers {
     focus?: boolean | undefined;
 }
 
-/**
- * Custom passthrough(pt) options.
- * @see {@link TooltipOptions.pt}
- */
-export interface TooltipPassThroughOptions {
-    /**
-     * Uses to pass attributes to the root's DOM element.
-     *  @see {@link TooltipPassThroughDirectiveOptions}
-     */
-    root?: TooltipPassThroughDirectiveOptions;
-    /**
-     * Uses to pass attributes to the text's DOM element.
-     *  @see {@link TooltipPassThroughDirectiveOptions}
-     */
-    text?: TooltipPassThroughDirectiveOptions;
-    /**
-     * Uses to pass attributes to the arrow's DOM element.
-     *  @see {@link TooltipPassThroughDirectiveOptions}
-     */
-    arrow?: TooltipPassThroughDirectiveOptions;
-}
-
-/**
- * Custom passthrough(pt) directive options.
- */
-export interface TooltipPassThroughDirectiveOptions {
-    /**
-     * Uses to pass attributes to the life cycle hooks.
-     * @see {@link TooltipPassThroughHooksOptions}
-     */
-    hooks?: TooltipPassThroughHooksOptions;
-    /**
-     * Uses to pass attributes to the styles.
-     *  @see {@link TooltipPassThroughCSSOptions}
-     */
-    css?: TooltipPassThroughCSSOptions;
-}
-
-/**
- * Custom passthrough(pt) hooks options.
- */
-export interface TooltipPassThroughHooksOptions {
-    /**
-     * Called before bound element's attributes or event listeners are applied.
-     */
-    created?: DirectiveBinding;
-    /**
-     * Called right before the element is inserted into the DOM.
-     */
-    beforeMount?: DirectiveBinding;
-    /**
-     * Called when the bound element's parent component and all its children are mounted.
-     */
-    mounted?: DirectiveBinding;
-    /**
-     * Called before the parent component is updated.
-     */
-    beforeUpdate?: DirectiveBinding;
-    /**
-     * Called after the parent component and all of its children have updated all of its children have updated.
-     */
-    updated?: DirectiveBinding;
-    /**
-     * Called before the parent component is unmounted.
-     */
-    beforeUnmount?: DirectiveBinding;
-    /**
-     * Called when the parent component is unmounted.
-     */
-    unmounted?: DirectiveBinding;
-}
-
-/**
- * Custom passthrough(pt) css options.
- */
-export interface TooltipPassThroughCSSOptions {
-    /**
-     * Style class of the element.
-     */
-    class?: any;
-    /**
-     * Inline style of the element.
-     */
-    style?: any;
-}
-
 /**
  * Binding of Tooltip directive.
  */
diff --git a/components/lib/tree/Tree.d.ts b/components/lib/tree/Tree.d.ts
index 271ceda10..38e8f6f3e 100755
--- a/components/lib/tree/Tree.d.ts
+++ b/components/lib/tree/Tree.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type TreePassThroughOptionType = TreePassThroughAttributes | ((options: TreePassThroughMethodOptions) => TreePassThroughAttributes) | null | undefined;
@@ -178,6 +179,11 @@ export interface TreePassThroughOptions {
      * Uses to pass attributes to the loading icon's DOM element.
      */
     loadingIcon?: TreePassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/treeselect/TreeSelect.d.ts b/components/lib/treeselect/TreeSelect.d.ts
index 7736e7a60..92421f9f1 100644
--- a/components/lib/treeselect/TreeSelect.d.ts
+++ b/components/lib/treeselect/TreeSelect.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { InputHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { TreeExpandedKeys, TreeNode, TreePassThroughOptionType } from '../tree';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -79,6 +80,11 @@ export interface TreeSelectPassThroughOptions {
      * Uses to pass attributes to the hidden input's DOM element.
      */
     hiddenInput?: TreeSelectPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/treetable/TreeTable.d.ts b/components/lib/treetable/TreeTable.d.ts
index 2d2f0701b..7af586c18 100755
--- a/components/lib/treetable/TreeTable.d.ts
+++ b/components/lib/treetable/TreeTable.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ColumnPassThroughOptionType } from '../column';
 import { PaginatorPassThroughOptionType } from '../paginator';
 import { TreeNode } from '../tree';
@@ -255,6 +256,11 @@ export interface TreeTablePassThroughOptions {
      * Uses to pass attributes to the Column helper components.
      */
     column?: ColumnPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/tristatecheckbox/TriStateCheckbox.d.ts b/components/lib/tristatecheckbox/TriStateCheckbox.d.ts
index 40259af55..5ce0dc79a 100755
--- a/components/lib/tristatecheckbox/TriStateCheckbox.d.ts
+++ b/components/lib/tristatecheckbox/TriStateCheckbox.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { InputHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor, Nullable } from '../ts-helpers';
 
 export declare type TriStateCheckboxPassThroughOptionType = TriStateCheckboxPassThroughAttributes | ((options: TriStateCheckboxPassThroughMethodOptions) => TriStateCheckboxPassThroughAttributes) | null | undefined;
@@ -58,6 +59,11 @@ export interface TriStateCheckboxPassThroughOptions {
      * Uses to pass attributes to the hidden value label's DOM element.
      */
     hiddenValueLabel?: TriStateCheckboxPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
diff --git a/components/lib/virtualscroller/VirtualScroller.d.ts b/components/lib/virtualscroller/VirtualScroller.d.ts
index 8cfdffff9..4b693bc64 100644
--- a/components/lib/virtualscroller/VirtualScroller.d.ts
+++ b/components/lib/virtualscroller/VirtualScroller.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent/BaseComponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type VirtualScrollerPassThroughOptionType = VirtualScrollerPassThroughAttributes | ((options: VirtualScrollerPassThroughMethodOptions) => VirtualScrollerPassThroughAttributes) | null | undefined;
@@ -127,6 +128,11 @@ export interface VirtualScrollerPassThroughOptions {
      * Uses to pass attributes to the spacer's DOM element.
      */
     spacer?: VirtualScrollerPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**