From 0732a6c19238dfc58654867af39840349d9bc0b7 Mon Sep 17 00:00:00 2001
From: betavs <betavs@qq.com>
Date: Thu, 9 Nov 2023 10:30:48 +0800
Subject: [PATCH 01/69] fix(split-button): outlined split button right border
 duplication on hover

---
 components/lib/splitbutton/style/SplitButtonStyle.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/components/lib/splitbutton/style/SplitButtonStyle.js b/components/lib/splitbutton/style/SplitButtonStyle.js
index 920a91ee5..8f28b3c86 100644
--- a/components/lib/splitbutton/style/SplitButtonStyle.js
+++ b/components/lib/splitbutton/style/SplitButtonStyle.js
@@ -9,7 +9,8 @@ const css = `
 
     .p-splitbutton .p-splitbutton-defaultbutton,
     .p-splitbutton.p-button-rounded > .p-splitbutton-defaultbutton.p-button,
-    .p-splitbutton.p-button-outlined > .p-splitbutton-defaultbutton.p-button {
+    .p-splitbutton.p-button-outlined > .p-splitbutton-defaultbutton.p-button,
+    .p-splitbutton.p-button-outlined > .p-splitbutton-defaultbutton.p-button-outlined.p-button:hover {
         flex: 1 1 auto;
         border-top-right-radius: 0;
         border-bottom-right-radius: 0;

From 2603b7a1405d42283e78a54333e7a0e3bf3b3d43 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Maximilian=20Ro=CC=88ttgen?= <maximilian.roettgen@adesso.de>
Date: Thu, 23 Nov 2023 16:48:14 +0100
Subject: [PATCH 02/69] Add 'filter'-event to Tree.vue

---
 components/lib/tree/Tree.d.ts    | 22 +++++++++++++++++++++-
 components/lib/tree/Tree.spec.js | 16 ++++++++++++++--
 components/lib/tree/Tree.vue     |  4 +++-
 3 files changed, 38 insertions(+), 4 deletions(-)

diff --git a/components/lib/tree/Tree.d.ts b/components/lib/tree/Tree.d.ts
index e10178ff2..f25ade0e6 100755
--- a/components/lib/tree/Tree.d.ts
+++ b/components/lib/tree/Tree.d.ts
@@ -120,6 +120,21 @@ export interface TreeSelectionKeys {
     [key: string]: any;
 }
 
+/**
+ * Custom filter event.
+ * @see {@link TreeEmits.filter}
+ */
+export interface TreeFilterEvent {
+    /**
+     * Original event
+     */
+    originalEvent: Event;
+    /**
+     * Filter value
+     */
+    value: string;
+}
+
 /**
  * Custom passthrough(pt) options.
  * @see {@link TreeProps.pt}
@@ -424,7 +439,7 @@ export interface TreeEmits {
      * Emitted when the selection keys change.
      * @param {TreeSelectionKeys} value - New selection keys.
      */
-    'update:selectionKeys'(event: TreeSelectionKeys): void;
+    'update:selectionKeys'(value: TreeSelectionKeys): void;
     /**
      * Callback to invoke when a node is selected.
      * @param {TreeNode} node - Node instance.
@@ -445,6 +460,11 @@ export interface TreeEmits {
      * @param {TreeNode} node - Node instance.
      */
     'node-collapse'(node: TreeNode): void;
+    /**
+     * Callback to invoke on filter input.
+     * @param {TreeFilterEvent} event - Custom filter event.
+     */
+    'filter'(event: TreeFilterEvent): void;
 }
 
 /**
diff --git a/components/lib/tree/Tree.spec.js b/components/lib/tree/Tree.spec.js
index dbeeec934..cb43cf553 100644
--- a/components/lib/tree/Tree.spec.js
+++ b/components/lib/tree/Tree.spec.js
@@ -1,6 +1,4 @@
 import { mount } from '@vue/test-utils';
-import PrimeVue from 'primevue/config';
-import { nextTick } from 'vue';
 import Tree from './Tree.vue';
 
 describe('Tree.vue', () => {
@@ -42,4 +40,18 @@ describe('Tree.vue', () => {
 
         expect(wrapper.emitted('keydown')).toBeFalsy();
     });
+
+    it('emits update:filterValue on filter input', async () => {
+        wrapper = mount(Tree, {
+            props: {
+                filter: true,
+            },
+        });
+
+        let searchField = wrapper.find('input.p-tree-filter');
+
+        await searchField.trigger('keydown.space');
+
+        expect(wrapper.emitted('filter')).toBeTruthy();
+    })
 });
diff --git a/components/lib/tree/Tree.vue b/components/lib/tree/Tree.vue
index 4d061c7b7..78ea7445f 100755
--- a/components/lib/tree/Tree.vue
+++ b/components/lib/tree/Tree.vue
@@ -47,7 +47,7 @@ import TreeNode from './TreeNode.vue';
 export default {
     name: 'Tree',
     extends: BaseTree,
-    emits: ['node-expand', 'node-collapse', 'update:expandedKeys', 'update:selectionKeys', 'node-select', 'node-unselect'],
+    emits: ['node-expand', 'node-collapse', 'update:expandedKeys', 'update:selectionKeys', 'node-select', 'node-unselect', 'filter'],
     data() {
         return {
             d_expandedKeys: this.expandedKeys || {},
@@ -166,6 +166,8 @@ export default {
             if (event.code === 'Enter') {
                 event.preventDefault();
             }
+
+            this.$emit('filter', { originalEvent: event, value: event.target.value });
         },
         findFilteredNodes(node, paramsWithoutNode) {
             if (node) {

From f299fdaf01900b6e476b45a17745faf998dcaf70 Mon Sep 17 00:00:00 2001
From: wiebken-n <126778886+wiebken-n@users.noreply.github.com>
Date: Sun, 26 Nov 2023 20:04:48 +0100
Subject: [PATCH 03/69] Fixed typo on doc for using images for custom icons
 (#4879)

Corrected "any time of image" to "any type of image"
---
 doc/customicons/ImageDoc.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/doc/customicons/ImageDoc.vue b/doc/customicons/ImageDoc.vue
index a6dae3e0c..388f21f8e 100644
--- a/doc/customicons/ImageDoc.vue
+++ b/doc/customicons/ImageDoc.vue
@@ -1,6 +1,6 @@
 <template>
     <DocSectionText v-bind="$attrs">
-        <p>Any time of image can be used as an icon.</p>
+        <p>Any type of image can be used as an icon.</p>
     </DocSectionText>
     <DocSectionCode :code="code" hideToggleCode hideCodeSandbox hideStackBlitz />
 </template>

From 21a88a3d32e8514b7e74371255e1f81a63199b40 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Mon, 27 Nov 2023 09:46:31 +0300
Subject: [PATCH 04/69] Update FilterSortEditDoc.vue

---
 doc/datatable/edit/FilterSortEditDoc.vue | 43 ++++++++++++++++++++++++
 1 file changed, 43 insertions(+)

diff --git a/doc/datatable/edit/FilterSortEditDoc.vue b/doc/datatable/edit/FilterSortEditDoc.vue
index c098779b8..3297687ba 100644
--- a/doc/datatable/edit/FilterSortEditDoc.vue
+++ b/doc/datatable/edit/FilterSortEditDoc.vue
@@ -141,6 +141,20 @@ export default {
                         event.preventDefault();
                 break;
             }
+        },
+        isPositiveInteger(val) {
+            let str = String(val);
+
+            str = str.trim();
+
+            if (!str) {
+                return false;
+            }
+
+            str = str.replace(/^0+/, '') || '0';
+            var n = Math.floor(Number(str));
+
+            return n !== Infinity && String(n) === str && n >= 0;
         }
     }
 };
@@ -215,6 +229,21 @@ const onCellEditComplete = (event) => {
     }
 };
 
+const  isPositiveInteger = (val) => {
+    let str = String(val);
+
+    str = str.trim();
+
+    if (!str) {
+        return false;
+    }
+
+    str = str.replace(/^0+/, '') || '0';
+    var n = Math.floor(Number(str));
+
+    return n !== Infinity && String(n) === str && n >= 0;
+};
+
 <\/script>
 `,
                 data: `
@@ -261,6 +290,20 @@ const onCellEditComplete = (event) => {
                     else event.preventDefault();
                     break;
             }
+        },
+        isPositiveInteger(val) {
+            let str = String(val);
+
+            str = str.trim();
+
+            if (!str) {
+                return false;
+            }
+
+            str = str.replace(/^0+/, '') || '0';
+            var n = Math.floor(Number(str));
+
+            return n !== Infinity && String(n) === str && n >= 0;
         }
     }
 };

From 5cb90afcdbf629450ee5720d4e3faa71af58ea2c Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Mon, 27 Nov 2023 13:58:45 +0300
Subject: [PATCH 05/69] Fixed #4880 - Improve InlineMessage Implementation for
 Accessibility

---
 components/lib/inlinemessage/InlineMessage.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/components/lib/inlinemessage/InlineMessage.vue b/components/lib/inlinemessage/InlineMessage.vue
index feeb4b3ca..14350d90a 100755
--- a/components/lib/inlinemessage/InlineMessage.vue
+++ b/components/lib/inlinemessage/InlineMessage.vue
@@ -1,5 +1,5 @@
 <template>
-    <div aria-live="polite" :class="cx('root')" v-bind="ptm('root')">
+    <div role="alert" aria-live="assertive" aria-atomic="true" :class="cx('root')" v-bind="ptm('root')">
         <slot name="icon">
             <component :is="icon ? 'span' : iconComponent" :class="cx('icon')" v-bind="ptm('icon')"></component>
         </slot>
@@ -10,11 +10,11 @@
 </template>
 
 <script>
-import BaseInlineMessage from './BaseInlineMessage.vue';
 import CheckIcon from 'primevue/icons/check';
 import ExclamationTriangleIcon from 'primevue/icons/exclamationtriangle';
 import InfoCircleIcon from 'primevue/icons/infocircle';
 import TimesCircleIcon from 'primevue/icons/timescircle';
+import BaseInlineMessage from './BaseInlineMessage.vue';
 
 export default {
     name: 'InlineMessage',

From 10d2988085576eb0898e6ff68aa3e3415e01fc30 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Mon, 27 Nov 2023 13:59:53 +0300
Subject: [PATCH 06/69] Accessibility doc updated

---
 doc/inlinemessage/AccessibilityDoc.vue | 71 +-------------------------
 doc/message/AccessibilityDoc.vue       | 40 +--------------
 2 files changed, 2 insertions(+), 109 deletions(-)

diff --git a/doc/inlinemessage/AccessibilityDoc.vue b/doc/inlinemessage/AccessibilityDoc.vue
index 21882ba72..e795b71a0 100644
--- a/doc/inlinemessage/AccessibilityDoc.vue
+++ b/doc/inlinemessage/AccessibilityDoc.vue
@@ -2,77 +2,8 @@
     <DocSectionText id="accessibility" label="Accessibility" v-bind="$attrs">
         <h3>Screen Reader</h3>
         <p>
-            Message components use <i>alert</i> role that implicitly defines <i>aria-live</i> as "assertive" and <i>aria-atomic</i> as "true". Since any attribute is passed to the root element, attributes like <i>aria-labelledby</i> and
+            InlineMessage component uses <i>alert</i> role that implicitly defines <i>aria-live</i> as "assertive" and <i>aria-atomic</i> as "true". Since any attribute is passed to the root element, attributes like <i>aria-labelledby</i> and
             <i>aria-label</i> can optionally be used as well.
         </p>
-
-        <p>
-            Close element is a <i>button</i> with an <i>aria-label</i> that refers to the <i>aria.close</i> property of the <NuxtLink to="/configuration/#locale">locale</NuxtLink> API by default, you may use <i>closeButtonProps</i> to customize the
-            element and override the default <i>aria-label</i>.
-        </p>
-
-        <h3>Close Button Keyboard Support</h3>
-        <div class="doc-tablewrapper">
-            <table class="doc-table">
-                <thead>
-                    <tr>
-                        <th>Key</th>
-                        <th>Function</th>
-                    </tr>
-                </thead>
-                <tbody>
-                    <tr>
-                        <td>
-                            <i>enter</i>
-                        </td>
-                        <td>Closes the message.</td>
-                    </tr>
-                    <tr>
-                        <td>
-                            <i>space</i>
-                        </td>
-                        <td>Closes the message.</td>
-                    </tr>
-                </tbody>
-            </table>
-        </div>
     </DocSectionText>
 </template>
-
-<script>
-export default {
-    data() {
-        return {
-            code1: {
-                basic: `
-<ConfirmDialog id="confirm" />
-
-<Button @click="openDialog()" label="Confirm" :aria-expanded="visible" :aria-controls="visible ? 'confirm' : null"></Button>
-
-`
-            },
-            code2: {
-                basic: `
-<script setup>
-const confirm = useConfirm();
-const isVisible = ref(false);
-
-const openDialog = () => {
-    confirm.require({
-        message: 'Are you sure you want to proceed?',
-        header: 'Confirmation',
-        onShow: () => {
-            isVisible.value = true;
-        },
-        onHide: () => {
-            isVisible.value = false;
-        }
-    });
-};
-<\/script>
-`
-            }
-        };
-    }
-};
-</script>
diff --git a/doc/message/AccessibilityDoc.vue b/doc/message/AccessibilityDoc.vue
index 21882ba72..6dfb74fc7 100644
--- a/doc/message/AccessibilityDoc.vue
+++ b/doc/message/AccessibilityDoc.vue
@@ -2,7 +2,7 @@
     <DocSectionText id="accessibility" label="Accessibility" v-bind="$attrs">
         <h3>Screen Reader</h3>
         <p>
-            Message components use <i>alert</i> role that implicitly defines <i>aria-live</i> as "assertive" and <i>aria-atomic</i> as "true". Since any attribute is passed to the root element, attributes like <i>aria-labelledby</i> and
+            Message component uses <i>alert</i> role that implicitly defines <i>aria-live</i> as "assertive" and <i>aria-atomic</i> as "true". Since any attribute is passed to the root element, attributes like <i>aria-labelledby</i> and
             <i>aria-label</i> can optionally be used as well.
         </p>
 
@@ -38,41 +38,3 @@
         </div>
     </DocSectionText>
 </template>
-
-<script>
-export default {
-    data() {
-        return {
-            code1: {
-                basic: `
-<ConfirmDialog id="confirm" />
-
-<Button @click="openDialog()" label="Confirm" :aria-expanded="visible" :aria-controls="visible ? 'confirm' : null"></Button>
-
-`
-            },
-            code2: {
-                basic: `
-<script setup>
-const confirm = useConfirm();
-const isVisible = ref(false);
-
-const openDialog = () => {
-    confirm.require({
-        message: 'Are you sure you want to proceed?',
-        header: 'Confirmation',
-        onShow: () => {
-            isVisible.value = true;
-        },
-        onHide: () => {
-            isVisible.value = false;
-        }
-    });
-};
-<\/script>
-`
-            }
-        };
-    }
-};
-</script>

From 46c5857512787f1f8576cbca34ad754911e4848f Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Mon, 27 Nov 2023 14:06:02 +0300
Subject: [PATCH 07/69] Update AccessibilityDoc.vue

---
 doc/inlinemessage/AccessibilityDoc.vue | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/doc/inlinemessage/AccessibilityDoc.vue b/doc/inlinemessage/AccessibilityDoc.vue
index e795b71a0..0e6a9b042 100644
--- a/doc/inlinemessage/AccessibilityDoc.vue
+++ b/doc/inlinemessage/AccessibilityDoc.vue
@@ -5,5 +5,7 @@
             InlineMessage component uses <i>alert</i> role that implicitly defines <i>aria-live</i> as "assertive" and <i>aria-atomic</i> as "true". Since any attribute is passed to the root element, attributes like <i>aria-labelledby</i> and
             <i>aria-label</i> can optionally be used as well.
         </p>
+        <h3>Keyboard Support</h3>
+        <p>Component does not include any interactive elements.</p>
     </DocSectionText>
 </template>

From 89b77cceca4ef5f902145d415fe65a37c93c53bf Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Mon, 27 Nov 2023 15:21:56 +0300
Subject: [PATCH 08/69] Fixed #4662 - DataTable: Type definition doesn't match
 document

---
 components/lib/datatable/DataTable.d.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/lib/datatable/DataTable.d.ts b/components/lib/datatable/DataTable.d.ts
index b14382868..6df41b87e 100755
--- a/components/lib/datatable/DataTable.d.ts
+++ b/components/lib/datatable/DataTable.d.ts
@@ -378,7 +378,7 @@ export interface DataTableRowExpandEvent {
     /**
      * Expanded row data
      */
-    data: any[];
+    data: any;
 }
 
 /**

From 75fb031fb4c38791d864395dc818b6f8e2cebb47 Mon Sep 17 00:00:00 2001
From: GitHub Actions Bot <>
Date: Mon, 27 Nov 2023 12:25:08 +0000
Subject: [PATCH 09/69] Update API doc

---
 doc/common/apidoc/index.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/doc/common/apidoc/index.json b/doc/common/apidoc/index.json
index e2127ee3f..5c49eb761 100644
--- a/doc/common/apidoc/index.json
+++ b/doc/common/apidoc/index.json
@@ -18113,7 +18113,7 @@
                             "name": "data",
                             "optional": false,
                             "readonly": false,
-                            "type": "any[]",
+                            "type": "any",
                             "default": "",
                             "description": "Expanded row data"
                         }
@@ -18137,7 +18137,7 @@
                             "name": "data",
                             "optional": false,
                             "readonly": false,
-                            "type": "any[]",
+                            "type": "any",
                             "default": "",
                             "description": "Expanded row data"
                         }

From 098c7a5128c534bea627e3c355e966b4588e1dbb Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Mon, 27 Nov 2023 17:56:27 +0300
Subject: [PATCH 10/69] Fixed #4881 - Listbox: select-on-focus causes a crash

---
 components/lib/listbox/Listbox.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/components/lib/listbox/Listbox.vue b/components/lib/listbox/Listbox.vue
index 4155b716b..6cbc89035 100755
--- a/components/lib/listbox/Listbox.vue
+++ b/components/lib/listbox/Listbox.vue
@@ -228,6 +228,7 @@ export default {
         onListFocus(event) {
             this.focused = true;
             this.focusedOptionIndex = this.focusedOptionIndex !== -1 ? this.focusedOptionIndex : this.autoOptionFocus ? this.findFirstFocusedOptionIndex() : -1;
+            this.autoUpdateModel();
             this.$emit('focus', event);
         },
         onListBlur(event) {
@@ -327,7 +328,7 @@ export default {
             let metaSelection = this.optionTouched ? false : this.metaKeySelection;
 
             if (metaSelection) {
-                let metaKey = event.metaKey || event.ctrlKey;
+                let metaKey = event && (event.metaKey || event.ctrlKey);
 
                 if (selected) {
                     if (metaKey) {
@@ -632,7 +633,7 @@ export default {
             }
         },
         autoUpdateModel() {
-            if (this.selectOnFocus && this.autoOptionFocus && !this.hasSelectedOption && !this.multiple) {
+            if (this.selectOnFocus && this.autoOptionFocus && !this.hasSelectedOption && !this.multiple && this.focused) {
                 this.focusedOptionIndex = this.findFirstFocusedOptionIndex();
                 this.onOptionSelect(null, this.visibleOptions[this.focusedOptionIndex]);
             }

From b2ad40adccd9c0e841db4e7d3d53f2ffb4e03d34 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 28 Nov 2023 11:46:39 +0300
Subject: [PATCH 11/69] Fixed #4886 - Tree / TreeTable: new loadingMode
 property

---
 components/lib/tree/BaseTree.vue           |  4 ++++
 components/lib/tree/Tree.d.ts              |  5 +++++
 components/lib/tree/Tree.vue               |  3 ++-
 components/lib/tree/TreeNode.vue           | 25 +++++++++++++++-------
 components/lib/tree/style/TreeStyle.js     |  1 +
 components/lib/treetable/BaseTreeTable.vue |  4 ++++
 components/lib/treetable/BodyCell.vue      | 20 +++++++++++++----
 components/lib/treetable/TreeTable.d.ts    |  5 +++++
 components/lib/treetable/TreeTable.vue     |  3 ++-
 components/lib/treetable/TreeTableRow.vue  |  5 +++++
 10 files changed, 61 insertions(+), 14 deletions(-)

diff --git a/components/lib/tree/BaseTree.vue b/components/lib/tree/BaseTree.vue
index c91824417..1dc3e07c5 100644
--- a/components/lib/tree/BaseTree.vue
+++ b/components/lib/tree/BaseTree.vue
@@ -34,6 +34,10 @@ export default {
             type: String,
             default: undefined
         },
+        loadingMode: {
+            type: String,
+            default: 'mask'
+        },
         filter: {
             type: Boolean,
             default: false
diff --git a/components/lib/tree/Tree.d.ts b/components/lib/tree/Tree.d.ts
index a45c13807..4636d3cd3 100755
--- a/components/lib/tree/Tree.d.ts
+++ b/components/lib/tree/Tree.d.ts
@@ -232,6 +232,11 @@ export interface TreeProps {
      * @deprecated since v3.27.0. Use 'loadingicon' slot.
      */
     loadingIcon?: string | undefined;
+    /**
+     * Loading mode display.
+     * @defaultValue mask
+     */
+    loadingMode?: 'mask' | 'icon' | undefined;
     /**
      * When specified, displays an input field to filter the items.
      * @defaultValue false
diff --git a/components/lib/tree/Tree.vue b/components/lib/tree/Tree.vue
index 4d061c7b7..f4da4945b 100755
--- a/components/lib/tree/Tree.vue
+++ b/components/lib/tree/Tree.vue
@@ -1,6 +1,6 @@
 <template>
     <div :class="cx('root')" v-bind="ptm('root')" data-pc-name="tree">
-        <template v-if="loading">
+        <template v-if="loading && loadingMode === 'mask'">
             <div :class="cx('loadingOverlay')" v-bind="ptm('loadingOverlay')">
                 <slot name="loadingicon" :class="cx('loadingIcon')">
                     <i v-if="loadingIcon" :class="[cx('loadingIcon'), 'pi-spin', loadingIcon]" v-bind="ptm('loadingIcon')" />
@@ -29,6 +29,7 @@
                     :selectionMode="selectionMode"
                     :selectionKeys="selectionKeys"
                     @checkbox-change="onCheckboxChange"
+                    :loadingMode="loadingMode"
                     :pt="pt"
                     :unstyled="unstyled"
                 ></TreeNode>
diff --git a/components/lib/tree/TreeNode.vue b/components/lib/tree/TreeNode.vue
index 89d6835dd..916ea8795 100755
--- a/components/lib/tree/TreeNode.vue
+++ b/components/lib/tree/TreeNode.vue
@@ -16,9 +16,15 @@
     >
         <div :class="cx('content')" @click="onClick" @touchend="onTouchEnd" :style="node.style" v-bind="getPTOptions('content')" :data-p-highlight="checkboxMode ? checked : selected" :data-p-selectable="selectable">
             <button v-ripple type="button" :class="cx('toggler')" @click="toggle" tabindex="-1" aria-hidden="true" v-bind="getPTOptions('toggler')">
-                <component v-if="templates['togglericon']" :is="templates['togglericon']" :node="node" :expanded="expanded" :class="cx('togglerIcon')" />
-                <component v-else-if="expanded" :is="node.expandedIcon ? 'span' : 'ChevronDownIcon'" :class="cx('togglerIcon')" v-bind="getPTOptions('togglerIcon')" />
-                <component v-else :is="node.collapsedIcon ? 'span' : 'ChevronRightIcon'" :class="cx('togglerIcon')" v-bind="getPTOptions('togglerIcon')" />
+                <template v-if="node.loading && loadingMode === 'icon'">
+                    <component v-if="templates['nodetogglericon']" :is="templates['nodetogglericon']" :class="cx('nodetogglericon')" />
+                    <SpinnerIcon v-else spin :class="cx('nodetogglericon')" v-bind="ptm('nodetogglericon')" />
+                </template>
+                <template v-else>
+                    <component v-if="templates['togglericon']" :is="templates['togglericon']" :node="node" :expanded="expanded" :class="cx('togglerIcon')" />
+                    <component v-else-if="expanded" :is="node.expandedIcon ? 'span' : 'ChevronDownIcon'" :class="cx('togglerIcon')" v-bind="getPTOptions('togglerIcon')" />
+                    <component v-else :is="node.collapsedIcon ? 'span' : 'ChevronRightIcon'" :class="cx('togglerIcon')" v-bind="getPTOptions('togglerIcon')" />
+                </template>
             </button>
             <div v-if="checkboxMode" :class="cx('checkboxContainer')" aria-hidden="true" v-bind="getPTOptions('checkboxContainer')">
                 <div :class="cx('checkbox')" role="checkbox" v-bind="getPTOptions('checkbox')" :data-p-checked="checked" :data-p-partialchecked="partialChecked">
@@ -57,6 +63,7 @@ import CheckIcon from 'primevue/icons/check';
 import ChevronDownIcon from 'primevue/icons/chevrondown';
 import ChevronRightIcon from 'primevue/icons/chevronright';
 import MinusIcon from 'primevue/icons/minus';
+import SpinnerIcon from 'primevue/icons/spinner';
 import Ripple from 'primevue/ripple';
 import { DomHandler } from 'primevue/utils';
 
@@ -74,6 +81,10 @@ export default {
             type: null,
             default: null
         },
+        loadingMode: {
+            type: String,
+            default: 'mask'
+        },
         selectionKeys: {
             type: null,
             default: null
@@ -90,10 +101,7 @@ export default {
             type: Number,
             default: null
         },
-        index: {
-            type: Number,
-            default: null
-        }
+        index: null
     },
     nodeTouched: false,
     toggleClicked: false,
@@ -435,7 +443,8 @@ export default {
         ChevronDownIcon: ChevronDownIcon,
         ChevronRightIcon: ChevronRightIcon,
         CheckIcon: CheckIcon,
-        MinusIcon: MinusIcon
+        MinusIcon: MinusIcon,
+        SpinnerIcon: SpinnerIcon
     },
     directives: {
         ripple: Ripple
diff --git a/components/lib/tree/style/TreeStyle.js b/components/lib/tree/style/TreeStyle.js
index a6296c837..9bc6bc3fd 100644
--- a/components/lib/tree/style/TreeStyle.js
+++ b/components/lib/tree/style/TreeStyle.js
@@ -113,6 +113,7 @@ const classes = {
     ],
     toggler: 'p-tree-toggler p-link',
     togglerIcon: 'p-tree-toggler-icon',
+    nodeTogglerIcon: 'p-tree-node-toggler-icon',
     checkboxContainer: 'p-checkbox p-component',
     checkbox: ({ instance }) => [
         'p-checkbox-box',
diff --git a/components/lib/treetable/BaseTreeTable.vue b/components/lib/treetable/BaseTreeTable.vue
index eb48f424a..0dcfb80d8 100644
--- a/components/lib/treetable/BaseTreeTable.vue
+++ b/components/lib/treetable/BaseTreeTable.vue
@@ -78,6 +78,10 @@ export default {
             type: String,
             default: undefined
         },
+        loadingMode: {
+            type: String,
+            default: 'mask'
+        },
         rowHover: {
             type: Boolean,
             default: false
diff --git a/components/lib/treetable/BodyCell.vue b/components/lib/treetable/BodyCell.vue
index 0bd6ad941..28adb3aab 100644
--- a/components/lib/treetable/BodyCell.vue
+++ b/components/lib/treetable/BodyCell.vue
@@ -1,9 +1,15 @@
 <template>
     <td :style="containerStyle" :class="containerClass" role="cell" v-bind="{ ...getColumnPT('root'), ...getColumnPT('bodyCell') }" :data-p-frozen-column="columnProp('frozen')">
         <button v-if="columnProp('expander')" v-ripple type="button" :class="cx('rowToggler')" @click="toggle" :style="togglerStyle" tabindex="-1" v-bind="getColumnPT('rowToggler')" data-pc-group-section="rowactionbutton">
-            <component v-if="column.children && column.children.rowtogglericon" :is="column.children && column.children.rowtogglericon" :node="node" :expanded="expanded" :class="cx('rowTogglerIcon')" />
-            <component v-else-if="expanded" :is="node.expandedIcon ? 'span' : 'ChevronDownIcon'" :class="cx('rowTogglerIcon')" v-bind="getColumnPT('rowTogglerIcon')" />
-            <component v-else :is="node.collapsedIcon ? 'span' : 'ChevronRightIcon'" :class="cx('rowTogglerIcon')" v-bind="getColumnPT('rowTogglerIcon')" />
+            <template v-if="node.loading && loadingMode === 'icon'">
+                <component v-if="templates['nodetogglericon']" :is="templates['nodetogglericon']" :class="cx('nodetogglericon')" />
+                <SpinnerIcon v-else spin :class="cx('nodetogglericon')" v-bind="ptm('nodetogglericon')" />
+            </template>
+            <template v-else>
+                <component v-if="column.children && column.children.rowtogglericon" :is="column.children && column.children.rowtogglericon" :node="node" :expanded="expanded" :class="cx('rowTogglerIcon')" />
+                <component v-else-if="expanded" :is="node.expandedIcon ? 'span' : 'ChevronDownIcon'" :class="cx('rowTogglerIcon')" v-bind="getColumnPT('rowTogglerIcon')" />
+                <component v-else :is="node.collapsedIcon ? 'span' : 'ChevronRightIcon'" :class="cx('rowTogglerIcon')" v-bind="getColumnPT('rowTogglerIcon')" />
+            </template>
         </button>
         <div v-if="checkboxSelectionMode && columnProp('expander')" :class="cx('checkboxWrapper')" @click="toggleCheckbox" v-bind="getColumnCheckboxPT('checkboxWrapper')">
             <div class="p-hidden-accessible" v-bind="getColumnPT('hiddenInputWrapper')" :data-p-hidden-accessible="true">
@@ -28,6 +34,7 @@ import ChevronDownIcon from 'primevue/icons/chevrondown';
 import ChevronRightIcon from 'primevue/icons/chevronright';
 import MinusIcon from 'primevue/icons/minus';
 import Ripple from 'primevue/ripple';
+import SpinnerIcon from 'primevue/icons/spinner';
 import { DomHandler, ObjectUtils } from 'primevue/utils';
 import { mergeProps } from 'vue';
 
@@ -80,6 +87,10 @@ export default {
         index: {
             type: Number,
             default: null
+        },
+        loadingMode: {
+            type: String,
+            default: 'mask'
         }
     },
     data() {
@@ -208,7 +219,8 @@ export default {
         ChevronRightIcon: ChevronRightIcon,
         ChevronDownIcon: ChevronDownIcon,
         CheckIcon: CheckIcon,
-        MinusIcon: MinusIcon
+        MinusIcon: MinusIcon,
+        SpinnerIcon: SpinnerIcon
     },
     directives: {
         ripple: Ripple
diff --git a/components/lib/treetable/TreeTable.d.ts b/components/lib/treetable/TreeTable.d.ts
index 5c2fe43eb..c0cafe1fd 100755
--- a/components/lib/treetable/TreeTable.d.ts
+++ b/components/lib/treetable/TreeTable.d.ts
@@ -474,6 +474,11 @@ export interface TreeTableProps {
      * @deprecated since v3.27.0. Use 'loadingicon' slot.
      */
     loadingIcon?: string | undefined;
+    /**
+     * Loading mode display.
+     * @defaultValue mask
+     */
+    loadingMode?: 'mask' | 'icon' | undefined;
     /**
      * When enabled, background of the rows change on hover.
      * @defaultValue false
diff --git a/components/lib/treetable/TreeTable.vue b/components/lib/treetable/TreeTable.vue
index 28f03c5c7..bd0796d9d 100755
--- a/components/lib/treetable/TreeTable.vue
+++ b/components/lib/treetable/TreeTable.vue
@@ -1,6 +1,6 @@
 <template>
     <div :class="cx('root')" data-scrollselectors=".p-treetable-scrollable-body" role="table" v-bind="ptm('root')" data-pc-name="treetable">
-        <div v-if="loading" :class="cx('loadingWrapper')" v-bind="ptm('loadingWrapper')">
+        <div v-if="loading && loadingMode === 'mask'" :class="cx('loadingWrapper')" v-bind="ptm('loadingWrapper')">
             <div :class="cx('loadingOverlay')" v-bind="ptm('loadingOverlay')">
                 <slot name="loadingicon" :class="cx('loadingIcon')">
                     <component :is="loadingIcon ? 'span' : 'SpinnerIcon'" spin :class="[cx('loadingIcon'), loadingIcon]" v-bind="ptm('loadingIcon')" />
@@ -94,6 +94,7 @@
                             :ariaSetSize="dataToRender.length"
                             :ariaPosInset="index + 1"
                             :tabindex="setTabindex(node, index)"
+                            :loadingMode="loadingMode"
                             :templates="$slots"
                             @node-toggle="onNodeToggle"
                             @node-click="onNodeClick"
diff --git a/components/lib/treetable/TreeTableRow.vue b/components/lib/treetable/TreeTableRow.vue
index d3dd669be..f92ff88e2 100755
--- a/components/lib/treetable/TreeTableRow.vue
+++ b/components/lib/treetable/TreeTableRow.vue
@@ -33,6 +33,7 @@
                 @node-toggle="$emit('node-toggle', $event)"
                 @checkbox-toggle="toggleCheckbox"
                 :index="i"
+                :loadingMode="loadingMode"
                 :pt="pt"
             ></TTBodyCell>
         </template>
@@ -115,6 +116,10 @@ export default {
             type: Number,
             default: null
         },
+        loadingMode: {
+            type: String,
+            default: 'mask'
+        },
         templates: {
             type: Object,
             default: null

From c552a6d965f42a75c2c3e629690aeaae5b85e99f Mon Sep 17 00:00:00 2001
From: GitHub Actions Bot <>
Date: Tue, 28 Nov 2023 08:47:40 +0000
Subject: [PATCH 12/69] Update API doc

---
 doc/common/apidoc/index.json | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/doc/common/apidoc/index.json b/doc/common/apidoc/index.json
index 5c49eb761..41c7117e6 100644
--- a/doc/common/apidoc/index.json
+++ b/doc/common/apidoc/index.json
@@ -52363,6 +52363,14 @@
                             "description": "Icon to display when tree is loading.",
                             "deprecated": "since v3.27.0. Use 'loadingicon' slot."
                         },
+                        {
+                            "name": "loadingMode",
+                            "optional": true,
+                            "readonly": false,
+                            "type": "\"mask\" | \"icon\"",
+                            "default": "mask",
+                            "description": "Loading mode display."
+                        },
                         {
                             "name": "filter",
                             "optional": true,
@@ -54379,6 +54387,14 @@
                             "description": "The icon to show while indicating data load is in progress.",
                             "deprecated": "since v3.27.0. Use 'loadingicon' slot."
                         },
+                        {
+                            "name": "loadingMode",
+                            "optional": true,
+                            "readonly": false,
+                            "type": "\"mask\" | \"icon\"",
+                            "default": "mask",
+                            "description": "Loading mode display."
+                        },
                         {
                             "name": "rowHover",
                             "optional": true,

From 5b47783f8120fb9d49359f094d8475c2e1adf62c Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 28 Nov 2023 12:15:37 +0300
Subject: [PATCH 13/69] Update TreeNode.d.ts

---
 components/lib/treenode/TreeNode.d.ts | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/components/lib/treenode/TreeNode.d.ts b/components/lib/treenode/TreeNode.d.ts
index 54940ab55..4fad17535 100644
--- a/components/lib/treenode/TreeNode.d.ts
+++ b/components/lib/treenode/TreeNode.d.ts
@@ -53,9 +53,9 @@ export interface TreeNode {
      */
     leaf?: boolean;
     /**
-     * Optional
+     * Specifies the node loading. Used in Tree and TreeTable.
      */
-    [key: string]: any;
+    loading?: boolean;
     /**
      * Icon to use in expanded state.
      */
@@ -64,4 +64,8 @@ export interface TreeNode {
      * Icon to use in collapsed state.
      */
     collapsedIcon?: string;
+    /**
+     * Optional
+     */
+    [key: string]: any;
 }

From e6b80b2456386ae1fc813b54f4110e9fd6b87b09 Mon Sep 17 00:00:00 2001
From: GitHub Actions Bot <>
Date: Tue, 28 Nov 2023 09:16:38 +0000
Subject: [PATCH 14/69] Update API doc

---
 doc/common/apidoc/index.json | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/doc/common/apidoc/index.json b/doc/common/apidoc/index.json
index 41c7117e6..f26aef307 100644
--- a/doc/common/apidoc/index.json
+++ b/doc/common/apidoc/index.json
@@ -52786,6 +52786,14 @@
                             "default": "false",
                             "description": "Specifies if the node has children. Used in lazy loading."
                         },
+                        {
+                            "name": "loading",
+                            "optional": true,
+                            "readonly": false,
+                            "type": "boolean",
+                            "default": "",
+                            "description": "Specifies the node loading. Used in Tree and TreeTable."
+                        },
                         {
                             "name": "expandedIcon",
                             "optional": true,

From 00925f65b32b8d251efbaa0e75da95937f5926dc Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 28 Nov 2023 12:23:46 +0300
Subject: [PATCH 15/69] Tree demo updates

---
 doc/tree/selection/CheckboxDoc.vue | 29 +++++++++++++++++++++++++++-
 doc/tree/selection/MultipleDoc.vue | 31 ++++++++++++++++++++++++++++--
 doc/tree/selection/SingleDoc.vue   | 29 +++++++++++++++++++++++++++-
 3 files changed, 85 insertions(+), 4 deletions(-)

diff --git a/doc/tree/selection/CheckboxDoc.vue b/doc/tree/selection/CheckboxDoc.vue
index 3fc46fed2..bfe357017 100644
--- a/doc/tree/selection/CheckboxDoc.vue
+++ b/doc/tree/selection/CheckboxDoc.vue
@@ -84,7 +84,34 @@ const onNodeUnselect = (node) => {
     toast.add({ severity: 'success', summary: 'Node Unselected', detail: node.label, life: 3000 });
 };
 <\/script>
-`
+`,
+                data: `
+{
+    key: '0',
+    label: 'Documents',
+    data: 'Documents Folder',
+    icon: 'pi pi-fw pi-inbox',
+    children: [
+        {
+            key: '0-0',
+            label: 'Work',
+            data: 'Work Folder',
+            icon: 'pi pi-fw pi-cog',
+            children: [
+                { key: '0-0-0', label: 'Expenses.doc', icon: 'pi pi-fw pi-file', data: 'Expenses Document' },
+                { key: '0-0-1', label: 'Resume.doc', icon: 'pi pi-fw pi-file', data: 'Resume Document' }
+            ]
+        },
+        {
+            key: '0-1',
+            label: 'Home',
+            data: 'Home Folder',
+            icon: 'pi pi-fw pi-home',
+            children: [{ key: '0-1-0', label: 'Invoices.txt', icon: 'pi pi-fw pi-file', data: 'Invoices for this month' }]
+        }
+    ]
+},
+...`
             }
         };
     },
diff --git a/doc/tree/selection/MultipleDoc.vue b/doc/tree/selection/MultipleDoc.vue
index 9db11419a..81796b79e 100644
--- a/doc/tree/selection/MultipleDoc.vue
+++ b/doc/tree/selection/MultipleDoc.vue
@@ -27,7 +27,7 @@ export default {
             selectedKey: null,
             code: {
                 basic: `
-<Tree v-model:selectionKeys="selectedKey" :value="nodes" class="w-full md:w-30rem" 
+<Tree v-model:selectionKeys="selectedKey" :value="nodes" class="w-full md:w-30rem"
     selectionMode="multiple" :metaKeySelection="checked"></Tree>
 `,
                 options: `
@@ -81,7 +81,34 @@ onMounted(() => {
     NodeService.getTreeNodes().then((data) => (nodes.value = data));
 });
 <\/script>
-`
+`,
+                data: `
+{
+    key: '0',
+    label: 'Documents',
+    data: 'Documents Folder',
+    icon: 'pi pi-fw pi-inbox',
+    children: [
+        {
+            key: '0-0',
+            label: 'Work',
+            data: 'Work Folder',
+            icon: 'pi pi-fw pi-cog',
+            children: [
+                { key: '0-0-0', label: 'Expenses.doc', icon: 'pi pi-fw pi-file', data: 'Expenses Document' },
+                { key: '0-0-1', label: 'Resume.doc', icon: 'pi pi-fw pi-file', data: 'Resume Document' }
+            ]
+        },
+        {
+            key: '0-1',
+            label: 'Home',
+            data: 'Home Folder',
+            icon: 'pi pi-fw pi-home',
+            children: [{ key: '0-1-0', label: 'Invoices.txt', icon: 'pi pi-fw pi-file', data: 'Invoices for this month' }]
+        }
+    ]
+},
+...`
             }
         };
     },
diff --git a/doc/tree/selection/SingleDoc.vue b/doc/tree/selection/SingleDoc.vue
index ea6882236..8e40069f1 100644
--- a/doc/tree/selection/SingleDoc.vue
+++ b/doc/tree/selection/SingleDoc.vue
@@ -79,7 +79,34 @@ const onNodeUnselect = (node) => {
     toast.add({ severity: 'success', summary: 'Node Unselected', detail: node.label, life: 3000 });
 };
 <\/script>
-`
+`,
+                data: `
+{
+    key: '0',
+    label: 'Documents',
+    data: 'Documents Folder',
+    icon: 'pi pi-fw pi-inbox',
+    children: [
+        {
+            key: '0-0',
+            label: 'Work',
+            data: 'Work Folder',
+            icon: 'pi pi-fw pi-cog',
+            children: [
+                { key: '0-0-0', label: 'Expenses.doc', icon: 'pi pi-fw pi-file', data: 'Expenses Document' },
+                { key: '0-0-1', label: 'Resume.doc', icon: 'pi pi-fw pi-file', data: 'Resume Document' }
+            ]
+        },
+        {
+            key: '0-1',
+            label: 'Home',
+            data: 'Home Folder',
+            icon: 'pi pi-fw pi-home',
+            children: [{ key: '0-1-0', label: 'Invoices.txt', icon: 'pi pi-fw pi-file', data: 'Invoices for this month' }]
+        }
+    ]
+},
+...`
             }
         };
     },

From 3018da2fa40346e5f02160100c01e0770faae653 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 28 Nov 2023 12:24:01 +0300
Subject: [PATCH 16/69] Tree Lazy demo added

---
 doc/tree/LazyDoc.vue | 188 +++++++++++++++++++++++++++++++++++++++++--
 1 file changed, 181 insertions(+), 7 deletions(-)

diff --git a/doc/tree/LazyDoc.vue b/doc/tree/LazyDoc.vue
index 8b56c15ce..41fd65a39 100644
--- a/doc/tree/LazyDoc.vue
+++ b/doc/tree/LazyDoc.vue
@@ -1,9 +1,19 @@
 <template>
     <DocSectionText v-bind="$attrs">
-        <p>Lazy loading is useful when dealing with huge datasets, in this example nodes are dynamically loaded on demand using <i>loading</i> property and <i>node-expand</i> method.</p>
+        <p>
+            Lazy loading is useful when dealing with huge datasets, in this example nodes are dynamically loaded on demand using <i>loading</i> property and <i>node-expand</i> method. Default value of <i>loadingMode</i> is <i>mask</i> and also
+            <i>icon</i> is available.
+        </p>
     </DocSectionText>
-    <div class="card flex justify-content-center">
-        <Tree :value="nodes" @node-expand="onNodeExpand" :loading="loading" class="w-full md:w-30rem"></Tree>
+    <div class="card flex flex-wrap p-fluid gap-3">
+        <div class="flex-auto md:flex md:justify-content-start md:align-items-center flex-column">
+            <label for="mask" class="font-bold block mb-2">Mask Mode</label>
+            <Tree :value="nodes" @node-expand="onNodeExpand" :loading="loading" class="w-full md:w-30rem"></Tree>
+        </div>
+        <div class="flex-auto md:flex md:justify-content-start md:align-items-center flex-column">
+            <label for="mask" class="font-bold block mb-2">Icon Mode</label>
+            <Tree :value="nodes2" @node-expand="onNodeExpand2" loadingMode="icon" class="w-full md:w-30rem"></Tree>
+        </div>
     </div>
     <DocSectionCode :code="code" />
 </template>
@@ -13,15 +23,24 @@ export default {
     data() {
         return {
             nodes: null,
+            nodes2: null,
             loading: false,
             code: {
                 basic: `
 <Tree :value="nodes" @node-expand="onNodeExpand" :loading="loading" class="w-full md:w-30rem"></Tree>
+<Tree :value="nodes2" @node-expand="onNodeExpand2" loadingMode="icon" class="w-full md:w-30rem"></Tree>
 `,
                 options: `
 <template>
-    <div class="card flex justify-content-center">
-        <Tree :value="nodes" @node-expand="onNodeExpand" :loading="loading" class="w-full md:w-30rem"></Tree>
+    <div class="card flex flex-wrap p-fluid gap-3">
+        <div class="flex-auto md:flex md:justify-content-start md:align-items-center flex-column">
+            <label for="mask" class="font-bold block mb-2">Mask Mode</label>
+            <Tree :value="nodes" @node-expand="onNodeExpand" :loading="loading" class="w-full md:w-30rem"></Tree>
+        </div>
+        <div class="flex-auto md:flex md:justify-content-start md:align-items-center flex-column">
+            <label for="mask" class="font-bold block mb-2">Icon Mode</label>
+            <Tree :value="nodes2" @node-expand="onNodeExpand2" loadingMode="icon" class="w-full md:w-30rem"></Tree>
+        </div>
     </div>
 </template>
 
@@ -30,15 +49,18 @@ export default {
     data() {
         return {
             nodes: null,
+            nodes2: null,
             loading: false
         };
     },
     mounted() {
         this.loading = true;
+        this.nodes2 = this.initateNodes2();
 
         setTimeout(() => {
             this.nodes = this.initateNodes();
             this.loading = false;
+            this.nodes2.map((node) => (node.loading = false));
         }, 2000);
     },
     methods: {
@@ -66,6 +88,30 @@ export default {
                 }, 500);
             }
         },
+        onNodeExpand2(node) {
+            if (!node.children) {
+                node.loading = true;
+
+                setTimeout(() => {
+                    let _node = { ...node };
+
+                    _node.children = [];
+
+                    for (let i = 0; i < 3; i++) {
+                        _node.children.push({
+                            key: node.key + '-' + i,
+                            label: 'Lazy ' + node.label + '-' + i
+                        });
+                    }
+
+                    let _nodes = { ...this.nodes2 };
+
+                    _nodes[parseInt(node.key, 10)] = { ..._node, loading: false };
+
+                    this.nodes2 = _nodes;
+                }, 500);
+            }
+        },
         initateNodes() {
             return [
                 {
@@ -84,6 +130,28 @@ export default {
                     leaf: false
                 }
             ];
+        },
+        initateNodes2() {
+            return [
+                {
+                    key: '0',
+                    label: 'Node 0',
+                    leaf: false,
+                    loading: true
+                },
+                {
+                    key: '1',
+                    label: 'Node 1',
+                    leaf: false,
+                    loading: true
+                },
+                {
+                    key: '2',
+                    label: 'Node 2',
+                    leaf: false,
+                    loading: true
+                }
+            ];
         }
     }
 }
@@ -91,8 +159,15 @@ export default {
 `,
                 composition: `
 <template>
-    <div class="card flex justify-content-center">
-        <Tree :value="nodes" @node-expand="onNodeExpand" :loading="loading" class="w-full md:w-30rem"></Tree>
+    <div class="card flex flex-wrap p-fluid gap-3">
+        <div class="flex-auto md:flex md:justify-content-start md:align-items-center flex-column">
+            <label for="mask" class="font-bold block mb-2">Mask Mode</label>
+            <Tree :value="nodes" @node-expand="onNodeExpand" :loading="loading" class="w-full md:w-30rem"></Tree>
+        </div>
+        <div class="flex-auto md:flex md:justify-content-start md:align-items-center flex-column">
+            <label for="mask" class="font-bold block mb-2">Icon Mode</label>
+            <Tree :value="nodes2" @node-expand="onNodeExpand2" loadingMode="icon" class="w-full md:w-30rem"></Tree>
+        </div>
     </div>
 </template>
 
@@ -100,14 +175,17 @@ export default {
 import { ref, onMounted } from 'vue';
 
 const nodes = ref(null);
+const nodes2 = ref(null);
 const loading = ref(false);
 
 onMounted(() => {
     loading.value = true;
+    nodes2.value = initiateNodes2();
 
     setTimeout(() => {
         nodes.value = initateNodes();
         loading.value = false;
+        nodes2.value.map((node) => (node.loading = false));
     }, 2000);
 });
 
@@ -136,6 +214,31 @@ const onNodeExpand = (node) => {
     }
 };
 
+const onNodeExpand2 = (node) => {
+    if (!node.children) {
+        node.loading = true;
+
+        setTimeout(() => {
+            let _node = { ...node };
+
+            _node.children = [];
+
+            for (let i = 0; i < 3; i++) {
+                _node.children.push({
+                    key: node.key + '-' + i,
+                    label: 'Lazy ' + node.label + '-' + i
+                });
+            }
+
+            let _nodes = { ...nodes2.value };
+
+            _nodes[parseInt(node.key, 10)] = { ..._node, loading: false };
+
+            nodes2.value = _nodes;
+        }, 500);
+    }
+};
+
 const initateNodes = () => {
     return [
         {
@@ -155,6 +258,29 @@ const initateNodes = () => {
         }
     ];
 };
+
+const initateNodes2 = () => {
+    return [
+        {
+            key: '0',
+            label: 'Node 0',
+            leaf: false,
+            loading: true
+        },
+        {
+            key: '1',
+            label: 'Node 1',
+            leaf: false,
+            loading: true
+        },
+        {
+            key: '2',
+            label: 'Node 2',
+            leaf: false,
+            loading: true
+        }
+    ];
+};
 <\/script>
 `,
                 data: `
@@ -189,10 +315,12 @@ const initateNodes = () => {
     },
     mounted() {
         this.loading = true;
+        this.nodes2 = this.initateNodes2();
 
         setTimeout(() => {
             this.nodes = this.initateNodes();
             this.loading = false;
+            this.nodes2.map((node) => (node.loading = false));
         }, 2000);
     },
     methods: {
@@ -221,6 +349,30 @@ const initateNodes = () => {
                 }, 500);
             }
         },
+        onNodeExpand2(node) {
+            if (!node.children) {
+                node.loading = true;
+
+                setTimeout(() => {
+                    let _node = { ...node };
+
+                    _node.children = [];
+
+                    for (let i = 0; i < 3; i++) {
+                        _node.children.push({
+                            key: node.key + '-' + i,
+                            label: 'Lazy ' + node.label + '-' + i
+                        });
+                    }
+
+                    let _nodes = { ...this.nodes2 };
+
+                    _nodes[parseInt(node.key, 10)] = { ..._node, loading: false };
+
+                    this.nodes2 = _nodes;
+                }, 500);
+            }
+        },
         initateNodes() {
             return [
                 {
@@ -239,6 +391,28 @@ const initateNodes = () => {
                     leaf: false
                 }
             ];
+        },
+        initateNodes2() {
+            return [
+                {
+                    key: '0',
+                    label: 'Node 0',
+                    leaf: false,
+                    loading: true
+                },
+                {
+                    key: '1',
+                    label: 'Node 1',
+                    leaf: false,
+                    loading: true
+                },
+                {
+                    key: '2',
+                    label: 'Node 2',
+                    leaf: false,
+                    loading: true
+                }
+            ];
         }
     }
 };

From 54919b1355f73c771c9baa34b5c385d0ac467fb2 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 28 Nov 2023 12:56:21 +0300
Subject: [PATCH 17/69] Update IconDoc.vue

---
 doc/calendar/IconDoc.vue | 79 ++++++++++++++++++++++++++++++++++------
 1 file changed, 68 insertions(+), 11 deletions(-)

diff --git a/doc/calendar/IconDoc.vue b/doc/calendar/IconDoc.vue
index ad37b1a03..3bd1692dc 100644
--- a/doc/calendar/IconDoc.vue
+++ b/doc/calendar/IconDoc.vue
@@ -1,9 +1,24 @@
 <template>
     <DocSectionText v-bind="$attrs">
-        <p>An additional icon is displayed next to the input field when <i>showIcon</i> is present.</p>
+        <p>An additional button is displayed next to the input field when <i>showIcon</i> is present. Also adding <i>iconDisplay</i> as <i>input</i> an icon will be displayed.</p>
     </DocSectionText>
-    <div class="card flex justify-content-center">
-        <Calendar v-model="date" showIcon />
+    <div class="card flex flex-wrap gap-3 p-fluid">
+        <div class="flex-auto">
+            <label for="buttondisplay" class="font-bold block mb-2"> Button Display </label>
+            <Calendar v-model="buttondisplay" showIcon inputId="buttondisplay" />
+        </div>
+        <div class="flex-auto">
+            <label for="icondisplay" class="font-bold block mb-2"> Icon Display </label>
+            <Calendar v-model="icondisplay" showIcon iconDisplay="input" inputId="icondisplay" />
+        </div>
+        <div class="flex-auto">
+            <label for="templatedisplay" class="font-bold block mb-2"> Icon Template </label>
+            <Calendar v-model="templatedisplay" showIcon iconDisplay="input" timeOnly inputId="templatedisplay">
+                <template #inputicon="{ clickCallback }">
+                    <i class="pi pi-clock" @click="clickCallback" />
+                </template>
+            </Calendar>
+        </div>
     </div>
     <DocSectionCode :code="code" />
 </template>
@@ -12,15 +27,38 @@
 export default {
     data() {
         return {
-            date: null,
+            buttondisplay: null,
+            icondisplay: null,
+            templatedisplay: null,
             code: {
                 basic: `
-<Calendar v-model="date" showIcon />
+<Calendar v-model="buttondisplay" showIcon />
+<Calendar v-model="icondisplay" showIcon iconDisplay="input" />
+<Calendar v-model="templatedisplay" showIcon iconDisplay="input" timeOnly>
+    <template #inputicon="{ clickCallback }">
+        <i class="pi pi-clock" @click="clickCallback" />
+    </template>
+</Calendar>
 `,
                 options: `
 <template>
-    <div class="card flex justify-content-center">
-        <Calendar v-model="date" showIcon />
+    <div class="card flex flex-wrap gap-3 p-fluid">
+        <div class="flex-auto">
+            <label for="buttondisplay" class="font-bold block mb-2"> Button Display </label>
+            <Calendar v-model="buttondisplay" showIcon inputId="buttondisplay" />
+        </div>
+        <div class="flex-auto">
+            <label for="icondisplay" class="font-bold block mb-2"> Icon Display </label>
+            <Calendar v-model="icondisplay" showIcon iconDisplay="input" inputId="icondisplay" />
+        </div>
+        <div class="flex-auto">
+            <label for="templatedisplay" class="font-bold block mb-2"> Icon Template </label>
+            <Calendar v-model="templatedisplay" showIcon iconDisplay="input" timeOnly inputId="templatedisplay">
+                <template #inputicon="{ clickCallback }">
+                    <i class="pi pi-clock" @click="clickCallback" />
+                </template>
+            </Calendar>
+        </div>
     </div>
 </template>
 
@@ -28,7 +66,9 @@ export default {
 export default {
     data() {
         return {
-            date: null
+            buttondisplay: null,
+            icondisplay: null,
+            templatedisplay: null,
         };
     }
 };
@@ -36,15 +76,32 @@ export default {
 `,
                 composition: `
 <template>
-    <div class="card flex justify-content-center">
-        <Calendar v-model="date" showIcon />
+    <div class="card flex flex-wrap gap-3 p-fluid">
+        <div class="flex-auto">
+            <label for="buttondisplay" class="font-bold block mb-2"> Button Display </label>
+            <Calendar v-model="buttondisplay" showIcon inputId="buttondisplay" />
+        </div>
+        <div class="flex-auto">
+            <label for="icondisplay" class="font-bold block mb-2"> Icon Display </label>
+            <Calendar v-model="icondisplay" showIcon iconDisplay="input" inputId="icondisplay" />
+        </div>
+        <div class="flex-auto">
+            <label for="templatedisplay" class="font-bold block mb-2"> Icon Template </label>
+            <Calendar v-model="templatedisplay" showIcon iconDisplay="input" timeOnly inputId="templatedisplay">
+                <template #inputicon="{ clickCallback }">
+                    <i class="pi pi-clock" @click="clickCallback" />
+                </template>
+            </Calendar>
+        </div>
     </div>
 </template>
 
 <script setup>
 import { ref } from "vue";
 
-const date = ref();
+const buttondisplay = ref();
+const icondisplay = ref();
+const templatedisplay = ref();
 <\/script>
 `
             }

From 803e3362a8b0a7161c78ae32362678b8c53128dd Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 28 Nov 2023 12:58:15 +0300
Subject: [PATCH 18/69] Refactor #4871

---
 components/lib/calendar/Calendar.d.ts | 4 ++++
 components/lib/calendar/Calendar.vue  | 2 +-
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/components/lib/calendar/Calendar.d.ts b/components/lib/calendar/Calendar.d.ts
index f2c5e06dd..1ad87ee10 100755
--- a/components/lib/calendar/Calendar.d.ts
+++ b/components/lib/calendar/Calendar.d.ts
@@ -798,6 +798,10 @@ export interface CalendarSlots {
          * Style class of the input icon
          */
         class: any;
+        /**
+         * Click callback
+         */
+        clickCallback: () => void;
     }): VNode[];
     /**
      * Custom previous icon template.
diff --git a/components/lib/calendar/Calendar.vue b/components/lib/calendar/Calendar.vue
index 9adf5717a..b65804051 100755
--- a/components/lib/calendar/Calendar.vue
+++ b/components/lib/calendar/Calendar.vue
@@ -48,7 +48,7 @@
             </template>
         </CalendarButton>
         <template v-else-if="showIcon && iconDisplay === 'input'">
-            <slot name="inputicon" :class="cx('inputIcon')">
+            <slot name="inputicon" :class="cx('inputIcon')" :clickCallback="onButtonClick">
                 <component :is="icon ? 'i' : 'CalendarIcon'" :class="[icon, cx('inputIcon')]" @click="onButtonClick" v-bind="ptm('inputicon')" />
             </slot>
         </template>

From 9ec137453404f0c59439073f09971d222172de61 Mon Sep 17 00:00:00 2001
From: GitHub Actions Bot <>
Date: Tue, 28 Nov 2023 09:59:15 +0000
Subject: [PATCH 19/69] Update API doc

---
 doc/common/apidoc/index.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/doc/common/apidoc/index.json b/doc/common/apidoc/index.json
index f26aef307..7de5dcd7d 100644
--- a/doc/common/apidoc/index.json
+++ b/doc/common/apidoc/index.json
@@ -8107,7 +8107,7 @@
                                 {
                                     "name": "scope",
                                     "optional": false,
-                                    "type": "{\n  \t <span class=\"ml-3 text-primary-700\">class</span>: <span class=\"text-primary-500\">any</span>, <span class=\"text-primary-300\">// Style class of the input icon</span>\n }",
+                                    "type": "{\n  \t <span class=\"ml-3 text-primary-700\">class</span>: <span class=\"text-primary-500\">any</span>, <span class=\"text-primary-300\">// Style class of the input icon</span>\n \t <span class=\"ml-3 text-primary-700\">clickCallback</span>: <span class=\"text-primary-500\">() &rArr; void</span>, <span class=\"text-primary-300\">// Click callback</span>\n}",
                                     "description": "input icon slot's params."
                                 }
                             ],

From 47c4cad9c5d5506138fa587cc9eb04fe5af49349 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 28 Nov 2023 16:06:32 +0300
Subject: [PATCH 20/69] Update MaskDoc.vue

---
 doc/inputmask/MaskDoc.vue | 34 +++++++++++++++++-----------------
 1 file changed, 17 insertions(+), 17 deletions(-)

diff --git a/doc/inputmask/MaskDoc.vue b/doc/inputmask/MaskDoc.vue
index be3422989..b03427290 100644
--- a/doc/inputmask/MaskDoc.vue
+++ b/doc/inputmask/MaskDoc.vue
@@ -7,17 +7,17 @@
     </DocSectionText>
     <div class="card p-fluid flex flex-wrap gap-3">
         <div class="flex-auto">
-            <label for="ssn">SSN</label>
+            <label for="ssn" class="font-bold block mb-2">SSN</label>
             <InputMask id="ssn" v-model="value1" mask="999-99-9999" placeholder="999-99-9999" />
         </div>
 
         <div class="flex-auto">
-            <label for="phone">Phone</label>
+            <label for="phone" class="font-bold block mb-2">Phone</label>
             <InputMask id="phone" v-model="value2" mask="(999) 999-9999" placeholder="(999) 999-9999" />
         </div>
 
         <div class="flex-auto">
-            <label for="serial">Serial</label>
+            <label for="serial" class="font-bold block mb-2">Serial</label>
             <InputMask id="serial" v-model="value3" mask="a*-999-a999" placeholder="a*-999-a999" />
         </div>
     </div>
@@ -34,17 +34,17 @@ export default {
             code: {
                 basic: `
 <div class="flex-auto">
-    <label for="ssn">SSN</label>
+    <label for="ssn" class="font-bold block mb-2">SSN</label>
     <InputMask id="ssn" v-model="value1" mask="999-99-9999" placeholder="999-99-9999" />
 </div>
 
 <div class="flex-auto">
-    <label for="phone">Phone</label>
-    <InputMask v-model="value2" date="phone" mask="(999) 999-9999" placeholder="(999) 999-9999" />
+    <label for="phone" class="font-bold block mb-2">Phone</label>
+    <InputMask id="phone" v-model="value2" mask="(999) 999-9999" placeholder="(999) 999-9999" />
 </div>
 
 <div class="flex-auto">
-    <label for="serial">Serial</label>
+    <label for="serial" class="font-bold block mb-2">Serial</label>
     <InputMask id="serial" v-model="value3" mask="a*-999-a999" placeholder="a*-999-a999" />
 </div>
 `,
@@ -52,18 +52,18 @@ export default {
 <template>
     <div class="card p-fluid flex flex-wrap gap-3">
         <div class="flex-auto">
-            <label for="ssn">SSN</label>
+            <label for="ssn" class="font-bold block mb-2">SSN</label>
             <InputMask id="ssn" v-model="value1" mask="999-99-9999" placeholder="999-99-9999" />
         </div>
 
         <div class="flex-auto">
-            <label for="phone">Phone</label>
-            <InputMask v-model="value2" date="phone" mask="(999) 999-9999" placeholder="(999) 999-9999" />
+            <label for="phone" class="font-bold block mb-2">Phone</label>
+            <InputMask id="phone" v-model="value2" mask="(999) 999-9999" placeholder="(999) 999-9999" />
         </div>
 
         <div class="flex-auto">
-            <label for="serial">Serial</label>
-            <InputMask id="serial" v-model="value2" mask="a*-999-a999" placeholder="a*-999-a999" />
+            <label for="serial" class="font-bold block mb-2">Serial</label>
+            <InputMask id="serial" v-model="value3" mask="a*-999-a999" placeholder="a*-999-a999" />
         </div>
     </div>
 </template>
@@ -79,23 +79,23 @@ export default {
     }
 }
 <\/script>
-        
+
 `,
                 composition: `
 <template>
     <div class="card p-fluid flex flex-wrap gap-3">
         <div class="flex-auto">
-            <label for="ssn">SSN</label>
+            <label for="ssn" class="font-bold block mb-2">SSN</label>
             <InputMask id="ssn" v-model="value1" mask="999-99-9999" placeholder="999-99-9999" />
         </div>
 
         <div class="flex-auto">
-            <label for="phone">Phone</label>
-            <InputMask v-model="value2" date="phone" mask="(999) 999-9999" placeholder="(999) 999-9999" />
+            <label for="phone" class="font-bold block mb-2">Phone</label>
+            <InputMask id="phone" v-model="value2" mask="(999) 999-9999" placeholder="(999) 999-9999" />
         </div>
 
         <div class="flex-auto">
-            <label for="serial">Serial</label>
+            <label for="serial" class="font-bold block mb-2">Serial</label>
             <InputMask id="serial" v-model="value3" mask="a*-999-a999" placeholder="a*-999-a999" />
         </div>
     </div>

From 3d3fbf69edb10d7f0986b09b0f66e8d18ebbc0a2 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 28 Nov 2023 16:22:27 +0300
Subject: [PATCH 21/69] Fixed #4889 - Splitter: aria-valuenow calculation
 defect

---
 components/lib/splitter/Splitter.vue | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/components/lib/splitter/Splitter.vue b/components/lib/splitter/Splitter.vue
index 0175a4157..f9416d5ec 100644
--- a/components/lib/splitter/Splitter.vue
+++ b/components/lib/splitter/Splitter.vue
@@ -133,13 +133,12 @@ export default {
                 newNextPanelSize = this.nextPanelSize - newPos;
             }
 
-            this.prevSize = parseFloat(newPrevPanelSize).toFixed(4);
-
             if (this.validateResize(newPrevPanelSize, newNextPanelSize)) {
                 this.prevPanelElement.style.flexBasis = 'calc(' + newPrevPanelSize + '% - ' + (this.panels.length - 1) * this.gutterSize + 'px)';
                 this.nextPanelElement.style.flexBasis = 'calc(' + newNextPanelSize + '% - ' + (this.panels.length - 1) * this.gutterSize + 'px)';
                 this.panelSizes[this.prevPanelIndex] = newPrevPanelSize;
                 this.panelSizes[this.prevPanelIndex + 1] = newNextPanelSize;
+                this.prevSize = parseFloat(newPrevPanelSize).toFixed(4);
             }
 
             this.$emit('resize', { originalEvent: event, sizes: this.panelSizes });

From b9fd835fe2a0bffbc7c583731eb46c43e63d1267 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 28 Nov 2023 17:50:34 +0300
Subject: [PATCH 22/69] Set new version

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index fed82c712..265cd803a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
     "name": "primevue",
-    "version": "3.41.1",
+    "version": "3.42.0",
     "lockfileVersion": 2,
     "requires": true,
     "packages": {
         "": {
             "name": "primevue",
-            "version": "3.41.1",
+            "version": "3.42.0",
             "hasInstallScript": true,
             "license": "MIT",
             "dependencies": {
diff --git a/package.json b/package.json
index 69019c5e7..ca9289762 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "primevue",
-    "version": "3.41.1",
+    "version": "3.42.0",
     "homepage": "https://primevue.org/",
     "repository": {
         "type": "git",

From 8e7f749423d29ec69bad03f25c0e919c1d433c31 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 28 Nov 2023 17:50:37 +0300
Subject: [PATCH 23/69] Update CHANGELOG.md

---
 CHANGELOG.md | 49 ++++++++++++++++++++++++++++++++++++-------------
 1 file changed, 36 insertions(+), 13 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 365f8fd52..299b8bd60 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,25 +1,48 @@
 # Changelog
 
+## [3.42.0](https://github.com/primefaces/primevue/tree/3.42.0) (2023-11-28)
+
+[Full Changelog](https://github.com/primefaces/primevue/compare/3.41.1...3.42.0)
+
+**Breaking Changes:**
+
+-   Menu components: width changed as min-width [\#4870](https://github.com/primefaces/primevue/issues/4870)
+
+**Fixed bugs:**
+
+-   Splitter: aria-valuenow calculation defect [\#4889](https://github.com/primefaces/primevue/issues/4889)
+-   Listbox: select-on-focus causes a crash [\#4881](https://github.com/primefaces/primevue/issues/4881)
+-   Listbox: Tab key support defect when filter mode is on [\#4875](https://github.com/primefaces/primevue/issues/4875)
+-   Editor: Readonly prop does not react to any change [\#4872](https://github.com/primefaces/primevue/issues/4872)
+-   DataTable: Type definition doesn't match document [\#4662](https://github.com/primefaces/primevue/issues/4662)
+-   Wrong types issue with aria-label and aria-labelledby Props [\#4511](https://github.com/primefaces/primevue/issues/4511)
+
+**Implemented New Features and Enhancements:**
+
+-   Tree / TreeTable: new loadingMode property [\#4886](https://github.com/primefaces/primevue/issues/4886)
+-   Improve InlineMessage Implementation for Accessibility [\#4880](https://github.com/primefaces/primevue/issues/4880)
+-   Calendar: new iconDisplay property [\#4871](https://github.com/primefaces/primevue/issues/4871)
+
 ## [3.41.1](https://github.com/primefaces/primevue/tree/3.41.1) (2023-11-22)
 
 [Full Changelog](https://github.com/primefaces/primevue/compare/3.41.0...3.41.1)
 
 **Breaking Changes:**
 
--  StyleClass: deprecate enterClass/leaveClass use enterFromClass/leaveFromClass  [\#4866](https://github.com/primefaces/primevue/issues/486&)
--  Listbox: metaKeySelection default changed as true  [\#4865](https://github.com/primefaces/primevue/issues/4865)
+-   StyleClass: deprecate enterClass/leaveClass use enterFromClass/leaveFromClass [\#4866](https://github.com/primefaces/primevue/issues/486&)
+-   Listbox: metaKeySelection default changed as true [\#4865](https://github.com/primefaces/primevue/issues/4865)
 
 **Fixed bugs:**
 
--  DataTable: restore state defect   [\#4855](https://github.com/primefaces/primevue/issues/4855)
--  PanelMenu: Menu items with no sub-items toggling border radius  [\#4816](https://github.com/primefaces/primevue/issues/4816)
--  Column: Missing typing for sorticon  [\#4423](https://github.com/primefaces/primevue/issues/4423)
+-   DataTable: restore state defect [\#4855](https://github.com/primefaces/primevue/issues/4855)
+-   PanelMenu: Menu items with no sub-items toggling border radius [\#4816](https://github.com/primefaces/primevue/issues/4816)
+-   Column: Missing typing for sorticon [\#4423](https://github.com/primefaces/primevue/issues/4423)
 
 **Implemented New Features and Enhancements:**
 
--  Button: new badgeSeverity property   [\#4863](https://github.com/primefaces/primevue/issues/4863)
--  MegaMenu / Menubar: menubutton templating  [\#4862](https://github.com/primefaces/primevue/issues/4862)
--  Calendar: Week Number customization  [\#4669](https://github.com/primefaces/primevue/issues/4669)
+-   Button: new badgeSeverity property [\#4863](https://github.com/primefaces/primevue/issues/4863)
+-   MegaMenu / Menubar: menubutton templating [\#4862](https://github.com/primefaces/primevue/issues/4862)
+-   Calendar: Week Number customization [\#4669](https://github.com/primefaces/primevue/issues/4669)
 
 ## [3.41.0](https://github.com/primefaces/primevue/tree/3.41.0) (2023-11-20)
 
@@ -2221,14 +2244,14 @@
 
 **Implemented New Features and Enhancements:**
 
-- v2 DataTable: Frozen column improvements [\#4795](https://github.com/primefaces/primevue/issues/4795)
-- TreeTable: Add custom header for column [\#2941](https://github.com/primefaces/primevue/issues/2941)
+-   v2 DataTable: Frozen column improvements [\#4795](https://github.com/primefaces/primevue/issues/4795)
+-   TreeTable: Add custom header for column [\#2941](https://github.com/primefaces/primevue/issues/2941)
 
 **Fixed bugs:**
 
-- OrderList: order of selection reversed when moving multiple items to top or bottom [\#4700](https://github.com/primefaces/primevue/issues/4700)
-- Calendar: Crashes when Tab pressed and calendar overlay is not showing [\#4586](https://github.com/primefaces/primevue/issues/4586)
-- Calendar: Months are not highlighted with selection-mode="multiple" [\#3988](https://github.com/primefaces/primevue/issues/3988)
+-   OrderList: order of selection reversed when moving multiple items to top or bottom [\#4700](https://github.com/primefaces/primevue/issues/4700)
+-   Calendar: Crashes when Tab pressed and calendar overlay is not showing [\#4586](https://github.com/primefaces/primevue/issues/4586)
+-   Calendar: Months are not highlighted with selection-mode="multiple" [\#3988](https://github.com/primefaces/primevue/issues/3988)
 
 ## [2.10.2](https://github.com/primefaces/primevue/tree/2.10.2) (2023-08-16)
 

From c42948530e16f6b29089f5375de5c70d19ff326e Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Wed, 29 Nov 2023 15:00:56 +0300
Subject: [PATCH 24/69] Demo fixes

---
 doc/fileupload/BasicDoc.vue   |  6 +++---
 doc/inputmask/SlotCharDoc.vue | 16 ++++++++--------
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/doc/fileupload/BasicDoc.vue b/doc/fileupload/BasicDoc.vue
index 7ff32cdca..cc323b20f 100644
--- a/doc/fileupload/BasicDoc.vue
+++ b/doc/fileupload/BasicDoc.vue
@@ -14,13 +14,13 @@ export default {
         return {
             code: {
                 basic: `
-<FileUpload mode="basic" name="demo[]" url="/api/upload"accept="image/*" :maxFileSize="1000000" @upload="onUpload" />
+<FileUpload mode="basic" name="demo[]" url="/api/upload" accept="image/*" :maxFileSize="1000000" @upload="onUpload" />
 `,
                 options: `
 <template>
     <div class="card flex justify-content-center">
         <Toast />
-        <FileUpload mode="basic" name="demo[]" url="/api/upload"accept="image/*" :maxFileSize="1000000" @upload="onUpload" />
+        <FileUpload mode="basic" name="demo[]" url="/api/upload" accept="image/*" :maxFileSize="1000000" @upload="onUpload" />
     </div>
 </template>
 
@@ -38,7 +38,7 @@ export default {
 <template>
     <div class="card flex justify-content-center">
         <Toast />
-        <FileUpload mode="basic" name="demo[]" url="/api/upload"accept="image/*" :maxFileSize="1000000" @upload="onUpload" />
+        <FileUpload mode="basic" name="demo[]" url="/api/upload" accept="image/*" :maxFileSize="1000000" @upload="onUpload" />
     </div>
 </template>
 
diff --git a/doc/inputmask/SlotCharDoc.vue b/doc/inputmask/SlotCharDoc.vue
index e89f582f8..27906864d 100644
--- a/doc/inputmask/SlotCharDoc.vue
+++ b/doc/inputmask/SlotCharDoc.vue
@@ -15,29 +15,29 @@ export default {
             value: '',
             code: {
                 basic: `
-<InputMask id="basic" v-model="value" placeholder="99/99/9999" slotChar="mm/dd/yyyy" />
+<InputMask id="basic" v-model="value" placeholder="99/99/9999" mask="99/99/9999" slotChar="mm/dd/yyyy" />
 `,
                 options: `
 <template>
     <div class="card flex justify-content-center">
-        <InputMask id="basic" v-model="value" placeholder="99/99/9999" slotChar="mm/dd/yyyy" />
+        <InputMask id="basic" v-model="value" placeholder="99/99/9999" mask="99/99/9999" slotChar="mm/dd/yyyy" />
     </div>
 </template>
 
 <script>
 export default {
-  data() {
-      return {
-          value: ''
-      }
-  }
+    data() {
+        return {
+            value: ''
+        }
+    }
 }
 <\/script>
 `,
                 composition: `
 <template>
     <div class="card flex justify-content-center">
-        <InputMask id="basic" v-model="value" placeholder="99/99/9999" slotChar="mm/dd/yyyy" />
+        <InputMask id="basic" v-model="value" placeholder="99/99/9999" mask="99/99/9999" slotChar="mm/dd/yyyy" />
     </div>
 </template>
 

From 3a911d1fb6af9b747867a11371483fe0a6b02fc3 Mon Sep 17 00:00:00 2001
From: Ryan Stainsby <30803531+rstainsby@users.noreply.github.com>
Date: Thu, 30 Nov 2023 19:43:59 +1000
Subject: [PATCH 25/69] parse date when in time-only mode

---
 components/lib/calendar/Calendar.vue | 27 +++++++++------------------
 1 file changed, 9 insertions(+), 18 deletions(-)

diff --git a/components/lib/calendar/Calendar.vue b/components/lib/calendar/Calendar.vue
index b65804051..80043b4e5 100755
--- a/components/lib/calendar/Calendar.vue
+++ b/components/lib/calendar/Calendar.vue
@@ -1272,14 +1272,10 @@ export default {
             let formattedValue = null;
 
             if (date) {
-                if (this.timeOnly) {
-                    formattedValue = this.formatTime(date);
-                } else {
-                    formattedValue = this.formatDate(date, this.datePattern);
+               formattedValue = this.formatDate(date, this.datePattern);
 
-                    if (this.showTime) {
-                        formattedValue += ' ' + this.formatTime(date);
-                    }
+                if (this.showTime || this.timeOnly) {
+                   formattedValue += ' ' + this.formatTime(date);
                 }
             }
 
@@ -1798,18 +1794,13 @@ export default {
             let date;
             let parts = text.split(' ');
 
-            if (this.timeOnly) {
-                date = new Date();
-                this.populateTime(date, parts[0], parts[1]);
-            } else {
-                const dateFormat = this.datePattern;
+            const dateFormat = this.datePattern;
 
-                if (this.showTime) {
-                    date = this.parseDate(parts[0], dateFormat);
-                    this.populateTime(date, parts[1], parts[2]);
-                } else {
-                    date = this.parseDate(text, dateFormat);
-                }
+            if (this.showTime || this.timeOnly) {
+                date = this.parseDate(parts[0], dateFormat);
+                this.populateTime(date, parts[1], parts[2]);
+            } else {
+                date = this.parseDate(text, dateFormat);
             }
 
             return date;

From 2a1ecba00b8be4c26978bcb8ddfb1028bd914b04 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Thu, 30 Nov 2023 14:32:15 +0300
Subject: [PATCH 26/69] Fixed #4897 - Some icons are not displaying from
 PrimeIcons.js Api file

---
 components/lib/api/PrimeIcons.js | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/components/lib/api/PrimeIcons.js b/components/lib/api/PrimeIcons.js
index 6ac54c4a8..118cbab4a 100644
--- a/components/lib/api/PrimeIcons.js
+++ b/components/lib/api/PrimeIcons.js
@@ -193,20 +193,20 @@ const PrimeIcons = {
     SLIDERS_V: 'pi pi-sliders-v',
     SORT: 'pi pi-sort',
     SORT_ALPHA_DOWN: 'pi pi-sort-alpha-down',
-    SORT_ALPHA_ALT_DOWN: 'pi pi-sort-alpha-alt-down',
+    SORT_ALPHA_ALT_DOWN: 'pi pi-sort-alpha-down-alt',
     SORT_ALPHA_UP: 'pi pi-sort-alpha-up',
-    SORT_ALPHA_ALT_UP: 'pi pi-sort-alpha-alt-up',
+    SORT_ALPHA_ALT_UP: 'pi pi-sort-alpha-up-alt',
     SORT_ALT: 'pi pi-sort-alt',
-    SORT_ALT_SLASH: 'pi pi-sort-slash',
+    SORT_ALT_SLASH: 'pi pi-sort-alt-slash',
     SORT_AMOUNT_DOWN: 'pi pi-sort-amount-down',
     SORT_AMOUNT_DOWN_ALT: 'pi pi-sort-amount-down-alt',
     SORT_AMOUNT_UP: 'pi pi-sort-amount-up',
     SORT_AMOUNT_UP_ALT: 'pi pi-sort-amount-up-alt',
     SORT_DOWN: 'pi pi-sort-down',
     SORT_NUMERIC_DOWN: 'pi pi-sort-numeric-down',
-    SORT_NUMERIC_ALT_DOWN: 'pi pi-sort-numeric-alt-down',
+    SORT_NUMERIC_ALT_DOWN: 'pi pi-sort-numeric-down-alt',
     SORT_NUMERIC_UP: 'pi pi-sort-numeric-up',
-    SORT_NUMERIC_ALT_UP: 'pi pi-sort-numeric-alt-up',
+    SORT_NUMERIC_ALT_UP: 'pi pi-sort-numeric-up-alt',
     SORT_UP: 'pi pi-sort-up',
     SPINNER: 'pi pi-spinner',
     STAR: 'pi pi-star',
@@ -216,7 +216,7 @@ const PrimeIcons = {
     STEP_FORWARD: 'pi pi-step-forward',
     STEP_FORWARD_ALT: 'pi pi-step-forward-alt',
     STOP: 'pi pi-stop',
-    STOPWATCH: 'pi pi-stop-watch',
+    STOPWATCH: 'pi pi-stopwatch',
     STOP_CIRCLE: 'pi pi-stop-circle',
     SUN: 'pi pi-sun',
     SYNC: 'pi pi-sync',

From 7469bc2308a2684123404d3f91e867075cded252 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Thu, 30 Nov 2023 16:46:00 +0300
Subject: [PATCH 27/69] Fixed #4441 - Component Name: Treetable lazy load plus
 pagination toggler icon remain as open

---
 components/lib/treetable/TreeTable.vue | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/components/lib/treetable/TreeTable.vue b/components/lib/treetable/TreeTable.vue
index bd0796d9d..592567565 100755
--- a/components/lib/treetable/TreeTable.vue
+++ b/components/lib/treetable/TreeTable.vue
@@ -353,6 +353,8 @@ export default {
             pageEvent.pageCount = event.pageCount;
             pageEvent.page = event.page;
 
+            this.d_expandedKeys = {};
+            this.$emit('update:expandedKeys', this.d_expandedKeys);
             this.$emit('update:first', this.d_first);
             this.$emit('update:rows', this.d_rows);
             this.$emit('page', pageEvent);

From fd6799bbe00ad8fc3f686469aa1114e873bd1e5f Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Thu, 30 Nov 2023 16:57:55 +0300
Subject: [PATCH 28/69] Image: zoomImage aria-label added

---
 components/lib/image/Image.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/components/lib/image/Image.vue b/components/lib/image/Image.vue
index e63e935e7..678b54e6c 100644
--- a/components/lib/image/Image.vue
+++ b/components/lib/image/Image.vue
@@ -3,7 +3,7 @@
         <slot name="image" :onError="onError" :errorCallback="onError">
             <img :style="imageStyle" :class="[cx('image'), imageClass]" @error="onError" v-bind="{ ...$attrs, ...ptm('image') }" />
         </slot>
-        <button v-if="preview" ref="previewButton" type="button" :class="cx('button')" @click="onImageClick" v-bind="{ ...previewButtonProps, ...ptm('button') }">
+        <button v-if="preview" ref="previewButton" :aria-label="zoomImageAriaLabel" type="button" :class="cx('button')" @click="onImageClick" v-bind="{ ...previewButtonProps, ...ptm('button') }">
             <slot name="indicatoricon">
                 <component :is="indicatorIcon ? 'i' : 'EyeIcon'" :class="cx('icon')" v-bind="ptm('icon')" />
             </slot>
@@ -212,6 +212,9 @@ export default {
         zoomOutAriaLabel() {
             return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.zoomOut : undefined;
         },
+        zoomImageAriaLabel() {
+            return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.zoomImage : undefined;
+        },
         closeAriaLabel() {
             return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.close : undefined;
         }

From a59fb53535d31f3019291c457832eee7ff85bc9c Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Thu, 30 Nov 2023 23:06:40 +0300
Subject: [PATCH 29/69] Refactor #4908 - For Galleria

---
 components/lib/config/PrimeVue.js           |  2 +-
 components/lib/galleria/BaseGalleria.vue    |  8 ++++++++
 components/lib/galleria/Galleria.d.ts       |  8 ++++++++
 components/lib/galleria/Galleria.vue        |  2 +-
 components/lib/galleria/GalleriaContent.vue | 12 +++++++++++-
 doc/configuration/locale/LocaleApiDoc.vue   |  2 +-
 6 files changed, 30 insertions(+), 4 deletions(-)

diff --git a/components/lib/config/PrimeVue.js b/components/lib/config/PrimeVue.js
index de1f40376..d0daa7d23 100644
--- a/components/lib/config/PrimeVue.js
+++ b/components/lib/config/PrimeVue.js
@@ -92,7 +92,7 @@ export const defaultOptions = {
             moveToSource: 'Move to Source',
             moveAllToTarget: 'Move All to Target',
             moveAllToSource: 'Move All to Source',
-            pageLabel: '{page}',
+            pageLabel: 'Page {page}',
             firstPageLabel: 'First Page',
             lastPageLabel: 'Last Page',
             nextPageLabel: 'Next Page',
diff --git a/components/lib/galleria/BaseGalleria.vue b/components/lib/galleria/BaseGalleria.vue
index 983445518..51aade029 100644
--- a/components/lib/galleria/BaseGalleria.vue
+++ b/components/lib/galleria/BaseGalleria.vue
@@ -113,6 +113,14 @@ export default {
         nextButtonProps: {
             type: null,
             default: null
+        },
+        ariaLabel: {
+            type: String,
+            default: null
+        },
+        ariaRoledescription: {
+            type: String,
+            default: null
         }
     },
     style: GalleriaStyle,
diff --git a/components/lib/galleria/Galleria.d.ts b/components/lib/galleria/Galleria.d.ts
index 9bf4a532c..08b2a70c3 100755
--- a/components/lib/galleria/Galleria.d.ts
+++ b/components/lib/galleria/Galleria.d.ts
@@ -390,6 +390,14 @@ export interface GalleriaProps {
      * Used to pass all properties of the HTMLButtonElement to the next navigation button.
      */
     nextButtonProps?: ButtonHTMLAttributes | undefined;
+    /**
+     * Defines a string value that labels an interactive element.
+     */
+    ariaLabel?: string | undefined;
+    /**
+     * Defines a string value that description for the role of the component.
+     */
+    ariaRoledescription?: string | undefined;
     /**
      * Used to pass attributes to DOM elements inside the component.
      * @type {GalleriaPassThroughOptions}
diff --git a/components/lib/galleria/Galleria.vue b/components/lib/galleria/Galleria.vue
index 39c39c5d4..b04839093 100755
--- a/components/lib/galleria/Galleria.vue
+++ b/components/lib/galleria/Galleria.vue
@@ -1,6 +1,6 @@
 <template>
     <Portal v-if="fullScreen">
-        <div v-if="containerVisible" :ref="maskRef" :class="[cx('mask'), maskClass]" :role="fullScreen ? 'dialog' : 'region'" :aria-modal="fullScreen ? 'true' : undefined" v-bind="ptm('mask')">
+        <div v-if="containerVisible" :ref="maskRef" :class="[cx('mask'), maskClass]" role="dialog" :aria-modal="fullScreen ? 'true' : undefined" v-bind="ptm('mask')">
             <transition name="p-galleria" @before-enter="onBeforeEnter" @enter="onEnter" @before-leave="onBeforeLeave" @after-leave="onAfterLeave" appear v-bind="ptm('transition')">
                 <GalleriaContent v-if="visible" :ref="containerRef" v-focustrap @mask-hide="maskHide" :templates="$slots" @activeitem-change="onActiveItemChange" :pt="pt" :unstyled="unstyled" v-bind="$props" />
             </transition>
diff --git a/components/lib/galleria/GalleriaContent.vue b/components/lib/galleria/GalleriaContent.vue
index ac460a3a0..f089885f5 100755
--- a/components/lib/galleria/GalleriaContent.vue
+++ b/components/lib/galleria/GalleriaContent.vue
@@ -1,5 +1,15 @@
 <template>
-    <div v-if="$attrs.value && $attrs.value.length > 0" :id="id" :class="[cx('root'), $attrs.containerClass]" :style="$attrs.containerStyle" v-bind="{ ...$attrs.containerProps, ...getPTOptions('root') }" data-pc-name="galleria">
+    <div
+        v-if="$attrs.value && $attrs.value.length > 0"
+        :id="id"
+        role="region"
+        :class="[cx('root'), $attrs.containerClass]"
+        :style="$attrs.containerStyle"
+        :aria-label="$attrs.ariaLabel"
+        :aria-roledescription="$attrs.ariaRoledescription"
+        v-bind="{ ...$attrs.containerProps, ...getPTOptions('root') }"
+        data-pc-name="galleria"
+    >
         <button v-if="$attrs.fullScreen" v-ripple autofocus type="button" :class="cx('closeButton')" :aria-label="closeAriaLabel" @click="$emit('mask-hide')" v-bind="getPTOptions('closeButton')">
             <component :is="$attrs.templates['closeicon'] || 'TimesIcon'" :class="cx('closeIcon')" v-bind="getPTOptions('closeIcon')" />
         </button>
diff --git a/doc/configuration/locale/LocaleApiDoc.vue b/doc/configuration/locale/LocaleApiDoc.vue
index 414d25878..7469c5296 100644
--- a/doc/configuration/locale/LocaleApiDoc.vue
+++ b/doc/configuration/locale/LocaleApiDoc.vue
@@ -358,7 +358,7 @@
                     </tr>
                     <tr>
                         <td>aria.pageLabel</td>
-                        <td>{page}</td>
+                        <td>Page {page}</td>
                     </tr>
                     <tr>
                         <td>aria.firstPageLabel</td>

From fb60c57af22fb8a8b2af7bac4ea1f5294bd2a252 Mon Sep 17 00:00:00 2001
From: GitHub Actions Bot <>
Date: Thu, 30 Nov 2023 20:07:44 +0000
Subject: [PATCH 30/69] Update API doc

---
 doc/common/apidoc/index.json | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/doc/common/apidoc/index.json b/doc/common/apidoc/index.json
index 7de5dcd7d..9486feb63 100644
--- a/doc/common/apidoc/index.json
+++ b/doc/common/apidoc/index.json
@@ -27046,6 +27046,22 @@
                             "default": "",
                             "description": "Used to pass all properties of the HTMLButtonElement to the next navigation button."
                         },
+                        {
+                            "name": "ariaLabel",
+                            "optional": true,
+                            "readonly": false,
+                            "type": "string",
+                            "default": "",
+                            "description": "Defines a string value that labels an interactive element."
+                        },
+                        {
+                            "name": "ariaRoledescription",
+                            "optional": true,
+                            "readonly": false,
+                            "type": "string",
+                            "default": "",
+                            "description": "Defines a string value that description for the role of the component."
+                        },
                         {
                             "name": "pt",
                             "optional": true,

From 5b72a7732f7908c24b0977217577f648d53680a3 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Thu, 30 Nov 2023 23:08:56 +0300
Subject: [PATCH 31/69] aria-label enhancements

---
 components/lib/button/Button.vue     | 2 +-
 components/lib/fieldset/Fieldset.vue | 2 +-
 components/lib/panel/Panel.vue       | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/components/lib/button/Button.vue b/components/lib/button/Button.vue
index 9c820d0ef..b36c52f3e 100755
--- a/components/lib/button/Button.vue
+++ b/components/lib/button/Button.vue
@@ -41,7 +41,7 @@ export default {
             return this.$attrs.disabled || this.$attrs.disabled === '' || this.loading;
         },
         defaultAriaLabel() {
-            return this.label ? this.label + (this.badge ? ' ' + this.badge : '') : this.$attrs['aria-label'];
+            return this.label ? this.label + (this.badge ? ' ' + this.badge : '') : this.$attrs.ariaLabel;
         },
         hasIcon() {
             return this.icon || this.$slots.icon;
diff --git a/components/lib/fieldset/Fieldset.vue b/components/lib/fieldset/Fieldset.vue
index 18a94fefa..45d20cc09 100755
--- a/components/lib/fieldset/Fieldset.vue
+++ b/components/lib/fieldset/Fieldset.vue
@@ -77,7 +77,7 @@ export default {
             return UniqueComponentId();
         },
         buttonAriaLabel() {
-            return this.toggleButtonProps && this.toggleButtonProps['aria-label'] ? this.toggleButtonProps['aria-label'] : this.legend;
+            return this.toggleButtonProps && this.toggleButtonProps.ariaLabel ? this.toggleButtonProps.ariaLabel : this.legend;
         }
     },
     directives: {
diff --git a/components/lib/panel/Panel.vue b/components/lib/panel/Panel.vue
index 38e9ad3ed..8f4ad4fd1 100755
--- a/components/lib/panel/Panel.vue
+++ b/components/lib/panel/Panel.vue
@@ -81,7 +81,7 @@ export default {
             return UniqueComponentId();
         },
         buttonAriaLabel() {
-            return this.toggleButtonProps && this.toggleButtonProps['aria-label'] ? this.toggleButtonProps['aria-label'] : this.header;
+            return this.toggleButtonProps && this.toggleButtonProps.ariaLabel ? this.toggleButtonProps.ariaLabel : this.header;
         }
     },
     components: {

From d8143f212e98aea70177546bed40e01063aaea54 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Fri, 1 Dec 2023 10:03:58 +0300
Subject: [PATCH 32/69] Fixed #4908 - For Carousel

---
 components/lib/carousel/Carousel.vue | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/components/lib/carousel/Carousel.vue b/components/lib/carousel/Carousel.vue
index 0a8f782c5..cc3d974cb 100755
--- a/components/lib/carousel/Carousel.vue
+++ b/components/lib/carousel/Carousel.vue
@@ -101,7 +101,7 @@ import ChevronLeftIcon from 'primevue/icons/chevronleft';
 import ChevronRightIcon from 'primevue/icons/chevronright';
 import ChevronUpIcon from 'primevue/icons/chevronup';
 import Ripple from 'primevue/ripple';
-import { DomHandler, UniqueComponentId, ObjectUtils } from 'primevue/utils';
+import { DomHandler, ObjectUtils, UniqueComponentId } from 'primevue/utils';
 import BaseCarousel from './BaseCarousel.vue';
 
 export default {
@@ -453,6 +453,8 @@ export default {
 
                 case 'ArrowUp':
                 case 'ArrowDown':
+                case 'PageUp':
+                case 'PageDown':
                     event.preventDefault();
                     break;
 
@@ -481,7 +483,7 @@ export default {
             this.changedFocusedIndicator(activeIndex, 0);
         },
         onEndKey() {
-            const indicators = [...DomHandler.find(this.$refs.indicatorContent, '[data-pc-section="indicator"]r')];
+            const indicators = [...DomHandler.find(this.$refs.indicatorContent, '[data-pc-section="indicator"]')];
             const activeIndex = this.findFocusedIndicatorIndex();
 
             this.changedFocusedIndicator(activeIndex, indicators.length - 1);

From 7834cfbecf581f35fb5e13b8e9b6ba21342e0ea9 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Fri, 1 Dec 2023 11:14:00 +0300
Subject: [PATCH 33/69] Update VerticalDoc.vue

---
 doc/carousel/VerticalDoc.vue | 13 +++++--------
 1 file changed, 5 insertions(+), 8 deletions(-)

diff --git a/doc/carousel/VerticalDoc.vue b/doc/carousel/VerticalDoc.vue
index 6c63f4274..674299d86 100644
--- a/doc/carousel/VerticalDoc.vue
+++ b/doc/carousel/VerticalDoc.vue
@@ -4,7 +4,7 @@
     </DocSectionText>
 
     <div class="card">
-        <Carousel :value="products" :numVisible="1" :numScroll="1" orientation="vertical" verticalViewPortHeight="360px" containerStyle="max-width: 30rem" contentClass="flex align-items-center">
+        <Carousel :value="products" :numVisible="1" :numScroll="1" orientation="vertical" verticalViewPortHeight="360px" contentClass="flex align-items-center">
             <template #item="slotProps">
                 <div class="border-1 surface-border border-round m-2 text-center py-5 px-3">
                     <div class="mb-3">
@@ -35,8 +35,7 @@ export default {
             products: null,
             code: {
                 basic: `
-<Carousel :value="products" :numVisible="1" :numScroll="1" orientation="vertical" verticalViewPortHeight="360px" 
-    containerStyle="max-width: 30rem" contentClass="flex align-items-center">
+<Carousel :value="products" :numVisible="1" :numScroll="1" orientation="vertical" verticalViewPortHeight="360px" contentClass="flex align-items-center">
     <template #item="slotProps">
         <div class="border-1 surface-border border-round m-2 text-center py-5 px-3">
             <div class="mb-3">
@@ -58,8 +57,7 @@ export default {
                 options: `
 <template>
     <div class="card">
-        <Carousel :value="products" :numVisible="1" :numScroll="1" orientation="vertical" verticalViewPortHeight="360px"
-            containerStyle="max-width: 30rem" contentClass="flex align-items-center">
+        <Carousel :value="products" :numVisible="1" :numScroll="1" orientation="vertical" verticalViewPortHeight="360px" contentClass="flex align-items-center">
             <template #item="slotProps">
                 <div class="border-1 surface-border border-round m-2 text-center py-5 px-3">
                     <div class="mb-3">
@@ -115,8 +113,7 @@ export default {
                 composition: `
 <template>
     <div class="card">
-        <Carousel :value="products" :numVisible="1" :numScroll="1" orientation="vertical" verticalViewPortHeight="360px" 
-            containerStyle="max-width: 30rem" contentClass="flex align-items-center">
+        <Carousel :value="products" :numVisible="1" :numScroll="1" orientation="vertical" verticalViewPortHeight="360px" contentClass="flex align-items-center">
             <template #item="slotProps">
                 <div class="border-1 surface-border border-round m-2 text-center py-5 px-3">
                     <div class="mb-3">
@@ -167,7 +164,7 @@ const getSeverity = (status) => {
 <\/script>
 `,
                 data: `
-/* ProductService */        
+/* ProductService */
 {
     id: '1000',
     code: 'f230fh0g3',

From 278a0d2fb7b5cb11d0d6a3e00df3ea3585903d33 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Fri, 1 Dec 2023 11:32:26 +0300
Subject: [PATCH 34/69] Listbox multiple doc updates

---
 doc/listbox/MultipleDoc.vue | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/doc/listbox/MultipleDoc.vue b/doc/listbox/MultipleDoc.vue
index 704ef7c62..2e4337ac6 100644
--- a/doc/listbox/MultipleDoc.vue
+++ b/doc/listbox/MultipleDoc.vue
@@ -6,7 +6,7 @@
         </p>
     </DocSectionText>
     <div class="card flex justify-content-center">
-        <Listbox v-model="selectedCity" :options="cities" multiple optionLabel="name" class="w-full md:w-14rem" />
+        <Listbox v-model="selectedCity" :options="cities" multiple metaKeySelection optionLabel="name" class="w-full md:w-14rem" />
     </div>
     <DocSectionCode :code="code" />
 </template>
@@ -25,12 +25,12 @@ export default {
             ],
             code: {
                 basic: `
-<Listbox v-model="selectedCity" :options="cities" multiple optionLabel="name" class="w-full md:w-14rem" />
+<Listbox v-model="selectedCity" :options="cities" multiple metaKeySelection optionLabel="name" class="w-full md:w-14rem" />
 `,
                 options: `
 <template>
     <div class="card flex justify-content-center">
-        <Listbox v-model="selectedCity" :options="cities" multiple optionLabel="name" class="w-full md:w-14rem" />
+        <Listbox v-model="selectedCity" :options="cities" multiple metaKeySelection optionLabel="name" class="w-full md:w-14rem" />
     </div>
 </template>
 
@@ -54,7 +54,7 @@ export default {
                 composition: `
 <template>
     <div class="card flex justify-content-center">
-        <Listbox v-model="selectedCity" :options="cities" multiple optionLabel="name" class="w-full md:w-14rem" />
+        <Listbox v-model="selectedCity" :options="cities" multiple metaKeySelection optionLabel="name" class="w-full md:w-14rem" />
     </div>
 </template>
 

From 43708d48ce674c412ee4fde8452b76a0e6104801 Mon Sep 17 00:00:00 2001
From: GitHub Actions Bot <>
Date: Fri, 1 Dec 2023 08:58:28 +0000
Subject: [PATCH 35/69] Code Format

---
 components/lib/calendar/Calendar.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/components/lib/calendar/Calendar.vue b/components/lib/calendar/Calendar.vue
index 80043b4e5..db87418de 100755
--- a/components/lib/calendar/Calendar.vue
+++ b/components/lib/calendar/Calendar.vue
@@ -1272,10 +1272,10 @@ export default {
             let formattedValue = null;
 
             if (date) {
-               formattedValue = this.formatDate(date, this.datePattern);
+                formattedValue = this.formatDate(date, this.datePattern);
 
                 if (this.showTime || this.timeOnly) {
-                   formattedValue += ' ' + this.formatTime(date);
+                    formattedValue += ' ' + this.formatTime(date);
                 }
             }
 

From 1443de90e7d1bdef15cd897f81e9f791d14cb7f5 Mon Sep 17 00:00:00 2001
From: GitHub Actions Bot <>
Date: Fri, 1 Dec 2023 09:04:05 +0000
Subject: [PATCH 36/69] Update API doc

---
 components/lib/tree/Tree.spec.js |  6 ++---
 doc/common/apidoc/index.json     | 41 ++++++++++++++++++++++++++++++--
 2 files changed, 42 insertions(+), 5 deletions(-)

diff --git a/components/lib/tree/Tree.spec.js b/components/lib/tree/Tree.spec.js
index cb43cf553..702ecd6ad 100644
--- a/components/lib/tree/Tree.spec.js
+++ b/components/lib/tree/Tree.spec.js
@@ -44,8 +44,8 @@ describe('Tree.vue', () => {
     it('emits update:filterValue on filter input', async () => {
         wrapper = mount(Tree, {
             props: {
-                filter: true,
-            },
+                filter: true
+            }
         });
 
         let searchField = wrapper.find('input.p-tree-filter');
@@ -53,5 +53,5 @@ describe('Tree.vue', () => {
         await searchField.trigger('keydown.space');
 
         expect(wrapper.emitted('filter')).toBeTruthy();
-    })
+    });
 });
diff --git a/doc/common/apidoc/index.json b/doc/common/apidoc/index.json
index 9486feb63..3e6917ead 100644
--- a/doc/common/apidoc/index.json
+++ b/doc/common/apidoc/index.json
@@ -52076,6 +52076,29 @@
                     ],
                     "methods": []
                 },
+                "TreeFilterEvent": {
+                    "description": "Custom filter event.",
+                    "relatedProp": "TreeEmits.filter",
+                    "props": [
+                        {
+                            "name": "originalEvent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "Event",
+                            "default": "",
+                            "description": "Original event"
+                        },
+                        {
+                            "name": "value",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "string",
+                            "default": "",
+                            "description": "Filter value"
+                        }
+                    ],
+                    "methods": []
+                },
                 "TreePassThroughOptions": {
                     "description": "Custom passthrough(pt) options.",
                     "relatedProp": "TreeProps.pt",
@@ -52578,9 +52601,10 @@
                             "name": "update:selectionKeys",
                             "parameters": [
                                 {
-                                    "name": "event",
+                                    "name": "value",
                                     "optional": false,
-                                    "type": "TreeSelectionKeys"
+                                    "type": "TreeSelectionKeys",
+                                    "description": "New selection keys."
                                 }
                             ],
                             "returnType": "void",
@@ -52637,6 +52661,19 @@
                             ],
                             "returnType": "void",
                             "description": "Callback to invoke when a node is collapsed."
+                        },
+                        {
+                            "name": "filter",
+                            "parameters": [
+                                {
+                                    "name": "event",
+                                    "optional": false,
+                                    "type": "TreeFilterEvent",
+                                    "description": "Custom filter event."
+                                }
+                            ],
+                            "returnType": "void",
+                            "description": "Callback to invoke on filter input."
                         }
                     ]
                 }

From bdb697fed64f2067fc11d8e5621a76e7236802a4 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Sat, 2 Dec 2023 10:02:01 +0300
Subject: [PATCH 37/69] Galleria: keyboard support correction for quick
 navigation elements

---
 components/lib/galleria/GalleriaItem.vue | 75 +++++++++++++++++++++++-
 1 file changed, 72 insertions(+), 3 deletions(-)

diff --git a/components/lib/galleria/GalleriaItem.vue b/components/lib/galleria/GalleriaItem.vue
index 0ae843fc4..6c4aa09e1 100755
--- a/components/lib/galleria/GalleriaItem.vue
+++ b/components/lib/galleria/GalleriaItem.vue
@@ -14,12 +14,11 @@
                 <component v-if="templates.caption" :is="templates.caption" :item="activeItem" />
             </div>
         </div>
-        <ul v-if="showIndicators" :class="cx('indicators')" v-bind="ptm('indicators')">
+        <ul v-if="showIndicators" ref="indicatorContent" :class="cx('indicators')" v-bind="ptm('indicators')">
             <li
                 v-for="(item, index) of value"
                 :key="`p-galleria-indicator-${index}`"
                 :class="cx('indicator', { index })"
-                tabindex="0"
                 :aria-label="ariaPageLabel(index + 1)"
                 :aria-selected="activeIndex === index"
                 :aria-controls="id + '_item_' + index"
@@ -29,7 +28,7 @@
                 v-bind="ptm('indicator', getIndicatorPTOptions(index))"
                 :data-p-highlight="isIndicatorItemActive(index)"
             >
-                <button v-if="!templates['indicator']" type="button" tabindex="-1" :class="cx('indicatorButton')" v-bind="ptm('indicatorButton', getIndicatorPTOptions(index))"></button>
+                <button v-if="!templates['indicator']" type="button" :tabindex="activeIndex === index ? '0' : '-1'" :class="cx('indicatorButton')" v-bind="ptm('indicatorButton', getIndicatorPTOptions(index))"></button>
                 <component v-if="templates.indicator" :is="templates.indicator" :index="index" />
             </li>
         </ul>
@@ -41,6 +40,7 @@ import BaseComponent from 'primevue/basecomponent';
 import ChevronLeftIcon from 'primevue/icons/chevronleft';
 import ChevronRightIcon from 'primevue/icons/chevronright';
 import Ripple from 'primevue/ripple';
+import { DomHandler } from 'primevue/utils';
 
 export default {
     name: 'GalleriaItem',
@@ -156,8 +156,32 @@ export default {
                     event.preventDefault();
                     break;
 
+                case 'ArrowRight':
+                    this.onRightKey();
+                    break;
+
+                case 'ArrowLeft':
+                    this.onLeftKey();
+                    break;
+
+                case 'Home':
+                    this.onHomeKey();
+                    event.preventDefault();
+                    break;
+
+                case 'End':
+                    this.onEndKey();
+                    event.preventDefault();
+                    break;
+
+                case 'Tab':
+                    this.onTabKey();
+                    break;
+
                 case 'ArrowDown':
                 case 'ArrowUp':
+                case 'PageUp':
+                case 'PageDown':
                     event.preventDefault();
                     break;
 
@@ -165,6 +189,51 @@ export default {
                     break;
             }
         },
+        onRightKey() {
+            const indicators = [...DomHandler.find(this.$refs.indicatorContent, '[data-pc-section="indicator"]')];
+            const activeIndex = this.findFocusedIndicatorIndex();
+
+            this.changedFocusedIndicator(activeIndex, activeIndex + 1 === indicators.length ? indicators.length - 1 : activeIndex + 1);
+        },
+        onLeftKey() {
+            const activeIndex = this.findFocusedIndicatorIndex();
+
+            this.changedFocusedIndicator(activeIndex, activeIndex - 1 <= 0 ? 0 : activeIndex - 1);
+        },
+        onHomeKey() {
+            const activeIndex = this.findFocusedIndicatorIndex();
+
+            this.changedFocusedIndicator(activeIndex, 0);
+        },
+        onEndKey() {
+            const indicators = [...DomHandler.find(this.$refs.indicatorContent, '[data-pc-section="indicator"]')];
+            const activeIndex = this.findFocusedIndicatorIndex();
+
+            this.changedFocusedIndicator(activeIndex, indicators.length - 1);
+        },
+        onTabKey() {
+            const indicators = [...DomHandler.find(this.$refs.indicatorContent, '[data-pc-section="indicator"]')];
+            const highlightedIndex = indicators.findIndex((ind) => DomHandler.getAttribute(ind, 'data-p-highlight') === true);
+
+            const activeIndicator = DomHandler.findSingle(this.$refs.indicatorContent, '[data-pc-section="indicator"] > button[tabindex="0"]');
+            const activeIndex = indicators.findIndex((ind) => ind === activeIndicator.parentElement);
+
+            indicators[activeIndex].children[0].tabIndex = '-1';
+            indicators[highlightedIndex].children[0].tabIndex = '0';
+        },
+        findFocusedIndicatorIndex() {
+            const indicators = [...DomHandler.find(this.$refs.indicatorContent, '[data-pc-section="indicator"]')];
+            const activeIndicator = DomHandler.findSingle(this.$refs.indicatorContent, '[data-pc-section="indicator"] > button[tabindex="0"]');
+
+            return indicators.findIndex((ind) => ind === activeIndicator.parentElement);
+        },
+        changedFocusedIndicator(prevInd, nextInd) {
+            const indicators = [...DomHandler.find(this.$refs.indicatorContent, '[data-pc-section="indicator"]')];
+
+            indicators[prevInd].children[0].tabIndex = '-1';
+            indicators[nextInd].children[0].tabIndex = '0';
+            indicators[nextInd].children[0].focus();
+        },
         isIndicatorItemActive(index) {
             return this.activeIndex === index;
         },

From 780b88ee47f826eb3f7b852ca98b6f22683a3492 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Mon, 4 Dec 2023 11:42:19 +0300
Subject: [PATCH 38/69] Update TreeTable.vue

---
 components/lib/treetable/TreeTable.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/lib/treetable/TreeTable.vue b/components/lib/treetable/TreeTable.vue
index 592567565..76b68b014 100755
--- a/components/lib/treetable/TreeTable.vue
+++ b/components/lib/treetable/TreeTable.vue
@@ -130,7 +130,7 @@
             @page="onPage($event)"
             :alwaysShow="alwaysShowPaginator"
             :unstyled="unstyled"
-            :pt="pt"
+            :pt="ptm('paginator')"
             data-pc-section="paginator"
         >
             <template v-if="$slots.paginatorstart" #start>

From a366e63a8cfb2239cf45dba1c030a382866719a7 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Mon, 4 Dec 2023 11:42:33 +0300
Subject: [PATCH 39/69] Fixed #4921 - Binding and ordering pt options defect

---
 components/lib/inputnumber/InputNumber.vue | 15 ++++--
 components/lib/orderlist/OrderList.vue     |  8 +--
 components/lib/password/Password.vue       |  3 +-
 components/lib/picklist/PickList.vue       | 60 +++++++++++++++++-----
 components/lib/splitbutton/SplitButton.vue |  4 +-
 5 files changed, 66 insertions(+), 24 deletions(-)

diff --git a/components/lib/inputnumber/InputNumber.vue b/components/lib/inputnumber/InputNumber.vue
index 0b3682953..fddd1628e 100755
--- a/components/lib/inputnumber/InputNumber.vue
+++ b/components/lib/inputnumber/InputNumber.vue
@@ -22,7 +22,8 @@
             @click="onInputClick"
             @focus="onInputFocus"
             @blur="onInputBlur"
-            v-bind="{ ...inputProps, ...ptm('input') }"
+            v-bind="inputProps"
+            :pt="ptm('input')"
             :unstyled="unstyled"
             data-pc-section="input"
         />
@@ -33,7 +34,8 @@
                 :disabled="disabled"
                 :tabindex="-1"
                 aria-hidden="true"
-                v-bind="{ ...incrementButtonProps, ...ptm('incrementButton') }"
+                v-bind="incrementButtonProps"
+                :pt="ptm('incrementButton')"
                 :unstyled="unstyled"
                 data-pc-section="incrementbutton"
             >
@@ -49,7 +51,8 @@
                 :disabled="disabled"
                 :tabindex="-1"
                 aria-hidden="true"
-                v-bind="{ ...decrementButtonProps, ...ptm('decrementButton') }"
+                v-bind="decrementButtonProps"
+                :pt="ptm('decrementButton')"
                 :unstyled="unstyled"
                 data-pc-section="decrementbutton"
             >
@@ -67,7 +70,8 @@
             :disabled="disabled"
             :tabindex="-1"
             aria-hidden="true"
-            v-bind="{ ...incrementButtonProps, ...ptm('incrementButton') }"
+            v-bind="incrementButtonProps"
+            :pt="ptm('incrementButton')"
             :unstyled="unstyled"
             data-pc-section="incrementbutton"
         >
@@ -84,7 +88,8 @@
             :disabled="disabled"
             :tabindex="-1"
             aria-hidden="true"
-            v-bind="{ ...decrementButtonProps, ...ptm('decrementButton') }"
+            v-bind="decrementButtonProps"
+            :pt="ptm('decrementButton')"
             :unstyled="unstyled"
             data-pc-section="decrementbutton"
         >
diff --git a/components/lib/orderlist/OrderList.vue b/components/lib/orderlist/OrderList.vue
index 8f6f0bd9f..f3526fe3d 100755
--- a/components/lib/orderlist/OrderList.vue
+++ b/components/lib/orderlist/OrderList.vue
@@ -2,28 +2,28 @@
     <div :class="cx('root')" v-bind="ptm('root')">
         <div :class="cx('controls')" v-bind="ptm('controls')">
             <slot name="controlsstart"></slot>
-            <OLButton type="button" @click="moveUp" :aria-label="moveUpAriaLabel" :disabled="moveDisabled()" :pt="ptm('moveUpButton')" v-bind="moveUpButtonProps" data-pc-section="moveupbutton" :unstyled="unstyled">
+            <OLButton type="button" @click="moveUp" :aria-label="moveUpAriaLabel" :disabled="moveDisabled()" v-bind="moveUpButtonProps" :pt="ptm('moveUpButton')" :unstyled="unstyled" data-pc-section="moveupbutton">
                 <template #icon>
                     <slot name="moveupicon">
                         <AngleUpIcon v-bind="ptm('moveUpButton')['icon']" data-pc-section="moveupicon" />
                     </slot>
                 </template>
             </OLButton>
-            <OLButton type="button" @click="moveTop" :aria-label="moveTopAriaLabel" :disabled="moveDisabled()" :pt="ptm('moveTopButton')" v-bind="moveTopButtonProps" data-pc-section="movetopbutton" :unstyled="unstyled">
+            <OLButton type="button" @click="moveTop" :aria-label="moveTopAriaLabel" :disabled="moveDisabled()" v-bind="moveTopButtonProps" :pt="ptm('moveTopButton')" :unstyled="unstyled" data-pc-section="movetopbutton">
                 <template #icon>
                     <slot name="movetopicon">
                         <AngleDoubleUpIcon v-bind="ptm('moveTopButton')['icon']" data-pc-section="movetopicon" />
                     </slot>
                 </template>
             </OLButton>
-            <OLButton type="button" @click="moveDown" :aria-label="moveDownAriaLabel" :disabled="moveDisabled()" :pt="ptm('moveDownButton')" v-bind="moveDownButtonProps" data-pc-section="movedownbutton" :unstyled="unstyled">
+            <OLButton type="button" @click="moveDown" :aria-label="moveDownAriaLabel" :disabled="moveDisabled()" v-bind="moveDownButtonProps" :pt="ptm('moveDownButton')" :unstyled="unstyled" data-pc-section="movedownbutton">
                 <template #icon>
                     <slot name="movedownicon">
                         <AngleDownIcon v-bind="ptm('moveDownButton')['icon']" data-pc-section="movedownicon" />
                     </slot>
                 </template>
             </OLButton>
-            <OLButton type="button" @click="moveBottom" :aria-label="moveBottomAriaLabel" :disabled="moveDisabled()" :pt="ptm('moveBottomButton')" v-bind="moveBottomButtonProps" data-pc-section="movebottombutton" :unstyled="unstyled">
+            <OLButton type="button" @click="moveBottom" :aria-label="moveBottomAriaLabel" :disabled="moveDisabled()" v-bind="moveBottomButtonProps" :pt="ptm('moveBottomButton')" :unstyled="unstyled" data-pc-section="movebottombutton">
                 <template #icon>
                     <slot name="movebottomicon">
                         <AngleDoubleDownIcon v-bind="ptm('moveBottomButton')['icon']" data-pc-section="movebottomicon" />
diff --git a/components/lib/password/Password.vue b/components/lib/password/Password.vue
index 116e40f6f..d41074933 100755
--- a/components/lib/password/Password.vue
+++ b/components/lib/password/Password.vue
@@ -20,7 +20,8 @@
             @blur="onBlur"
             @keyup="onKeyUp"
             @invalid="onInvalid"
-            v-bind="{ ...inputProps, ...ptm('input') }"
+            v-bind="inputProps"
+            :pt="ptm('input')"
             :unstyled="unstyled"
         />
         <slot v-if="toggleMask && unmasked" name="hideicon" :onClick="onMaskToggle" :toggleCallback="onMaskToggle">
diff --git a/components/lib/picklist/PickList.vue b/components/lib/picklist/PickList.vue
index 7e68725d0..583b8c173 100755
--- a/components/lib/picklist/PickList.vue
+++ b/components/lib/picklist/PickList.vue
@@ -2,28 +2,37 @@
     <div :class="cx('root')" v-bind="ptm('root')">
         <div v-if="showSourceControls" :class="cx('sourceControls')" v-bind="ptm('sourceControls')" data-pc-group-section="controls">
             <slot name="sourcecontrolsstart"></slot>
-            <PLButton :aria-label="moveUpAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveUp($event, 0)" :pt="ptm('sourceMoveUpButton')" v-bind="moveUpButtonProps" :unstyled="unstyled">
+            <PLButton :aria-label="moveUpAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveUp($event, 0)" v-bind="moveUpButtonProps" :pt="ptm('sourceMoveUpButton')" :unstyled="unstyled" data-pc-section="sourcemoveupbutton">
                 <template #icon>
                     <slot name="moveupicon">
                         <AngleUpIcon v-bind="ptm('sourceMoveUpButton')['icon']" data-pc-section="moveupicon" />
                     </slot>
                 </template>
             </PLButton>
-            <PLButton :aria-label="moveTopAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveTop($event, 0)" :pt="ptm('sourceMoveTopButton')" v-bind="moveTopButtonProps" :unstyled="unstyled">
+            <PLButton :aria-label="moveTopAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveTop($event, 0)" v-bind="moveTopButtonProps" :pt="ptm('sourceMoveTopButton')" :unstyled="unstyled" data-pc-section="sourcemovetopbutton">
                 <template #icon>
                     <slot name="movetopicon">
                         <AngleDoubleUpIcon v-bind="ptm('sourceMoveTopButton')['icon']" data-pc-section="movetopicon" />
                     </slot>
                 </template>
             </PLButton>
-            <PLButton :aria-label="moveDownAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveDown($event, 0)" :pt="ptm('sourceMoveDownButton')" v-bind="moveDownButtonProps" :unstyled="unstyled">
+            <PLButton :aria-label="moveDownAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveDown($event, 0)" v-bind="moveDownButtonProps" :pt="ptm('sourceMoveDownButton')" :unstyled="unstyled" data-pc-section="sourcemovedownbutton">
                 <template #icon>
                     <slot name="movedownicon">
                         <AngleDownIcon v-bind="ptm('sourceMoveDownButton')['icon']" data-pc-section="movedownicon" />
                     </slot>
                 </template>
             </PLButton>
-            <PLButton :aria-label="moveBottomAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveBottom($event, 0)" :pt="ptm('sourceMoveBottomButton')" v-bind="moveBottomButtonProps" :unstyled="unstyled">
+            <PLButton
+                :aria-label="moveBottomAriaLabel"
+                :disabled="moveDisabled(0)"
+                type="button"
+                @click="moveBottom($event, 0)"
+                v-bind="moveBottomButtonProps"
+                :pt="ptm('sourceMoveBottomButton')"
+                :unstyled="unstyled"
+                data-pc-section="sourcemovebottombutton"
+            >
                 <template #icon>
                     <slot name="movebottomicon">
                         <AngleDoubleDownIcon v-bind="ptm('sourceMoveBottomButton')['icon']" data-pc-section="movebottomicon" />
@@ -75,28 +84,46 @@
         </div>
         <div :class="cx('buttons')" v-bind="ptm('buttons')" data-pc-group-section="controls">
             <slot name="movecontrolsstart"></slot>
-            <PLButton :aria-label="moveToTargetAriaLabel" type="button" @click="moveToTarget" :disabled="moveDisabled(0)" :pt="ptm('moveToTargetButton')" v-bind="moveToTargetProps" :unstyled="unstyled">
+            <PLButton :aria-label="moveToTargetAriaLabel" type="button" @click="moveToTarget" :disabled="moveDisabled(0)" v-bind="moveToTargetProps" :pt="ptm('moveToTargetButton')" :unstyled="unstyled" data-pc-section="movetotargetbuton">
                 <template #icon>
                     <slot name="movetotargeticon" :viewChanged="viewChanged">
                         <component :is="viewChanged ? 'AngleDownIcon' : 'AngleRightIcon'" v-bind="ptm('moveToTargetButton')['icon']" data-pc-section="movetotargeticon" />
                     </slot>
                 </template>
             </PLButton>
-            <PLButton :aria-label="moveAllToTargetAriaLabel" type="button" @click="moveAllToTarget" :disabled="moveAllDisabled('sourceList')" :pt="ptm('moveAllToTargetButton')" v-bind="moveAllToTargetProps" :unstyled="unstyled">
+            <PLButton
+                :aria-label="moveAllToTargetAriaLabel"
+                type="button"
+                @click="moveAllToTarget"
+                :disabled="moveAllDisabled('sourceList')"
+                v-bind="moveAllToTargetProps"
+                :pt="ptm('moveAllToTargetButton')"
+                :unstyled="unstyled"
+                data-pc-section="movealltotargetbuton"
+            >
                 <template #icon>
                     <slot name="movealltotargeticon" :viewChanged="viewChanged">
                         <component :is="viewChanged ? 'AngleDoubleDownIcon' : 'AngleDoubleRightIcon'" v-bind="ptm('moveAllToTargetButton')['icon']" data-pc-section="movealltotargeticon" />
                     </slot>
                 </template>
             </PLButton>
-            <PLButton :aria-label="moveToSourceAriaLabel" type="button" @click="moveToSource" :disabled="moveDisabled(1)" :pt="ptm('moveToSourceButton')" v-bind="moveToSourceProps" :unstyled="unstyled">
+            <PLButton :aria-label="moveToSourceAriaLabel" type="button" @click="moveToSource" :disabled="moveDisabled(1)" v-bind="moveToSourceProps" :pt="ptm('moveToSourceButton')" :unstyled="unstyled" data-pc-section="movetosourcebuton">
                 <template #icon>
                     <slot name="movetosourceicon" :viewChanged="viewChanged">
                         <component :is="viewChanged ? 'AngleUpIcon' : 'AngleLeftIcon'" v-bind="ptm('moveToSourceButton')['icon']" data-pc-section="movetosourceicon" />
                     </slot>
                 </template>
             </PLButton>
-            <PLButton :aria-label="moveAllToSourceAriaLabel" type="button" @click="moveAllToSource" :disabled="moveAllDisabled('targetList')" :pt="ptm('moveAllToSourceButton')" v-bind="moveAllToSourceProps" :unstyled="unstyled">
+            <PLButton
+                :aria-label="moveAllToSourceAriaLabel"
+                type="button"
+                @click="moveAllToSource"
+                :disabled="moveAllDisabled('targetList')"
+                v-bind="moveAllToSourceProps"
+                :pt="ptm('moveAllToSourceButton')"
+                data-pc-section="movealltosourcebuton"
+                :unstyled="unstyled"
+            >
                 <template #icon>
                     <slot name="movealltosourceicon" :viewChanged="viewChanged">
                         <component :is="viewChanged ? 'AngleDoubleUpIcon' : 'AngleDoubleLeftIcon'" v-bind="ptm('moveAllToSourceButton')['icon']" data-pc-section="movealltosourceicon" />
@@ -149,28 +176,37 @@
         </div>
         <div v-if="showTargetControls" :class="cx('targetControls')" v-bind="ptm('targetControls')" data-pc-group-section="controls">
             <slot name="targetcontrolsstart"></slot>
-            <PLButton :aria-label="moveUpAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveUp($event, 1)" :pt="ptm('targetMoveUpButton')" v-bind="moveUpButtonProps" :unstyled="unstyled">
+            <PLButton :aria-label="moveUpAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveUp($event, 1)" v-bind="moveUpButtonProps" :pt="ptm('targetMoveUpButton')" :unstyled="unstyled" data-pc-section="targetmoveupbutton">
                 <template #icon>
                     <slot name="moveupicon">
                         <AngleUpIcon v-bind="ptm('targetMoveUpButton')['icon']" data-pc-section="moveupicon" />
                     </slot>
                 </template>
             </PLButton>
-            <PLButton :aria-label="moveTopAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveTop($event, 1)" :pt="ptm('targetMoveTopButton')" v-bind="moveTopButtonProps" :unstyled="unstyled">
+            <PLButton :aria-label="moveTopAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveTop($event, 1)" v-bind="moveTopButtonProps" :pt="ptm('targetMoveTopButton')" :unstyled="unstyled" data-pc-section="targetmovetopbutton">
                 <template #icon>
                     <slot name="movetopicon">
                         <AngleDoubleUpIcon v-bind="ptm('targetMoveTopButton')['icon']" data-pc-section="movetopicon" />
                     </slot>
                 </template>
             </PLButton>
-            <PLButton :aria-label="moveDownAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveDown($event, 1)" :pt="ptm('targetMoveDownButton')" v-bind="moveDownButtonProps" :unstyled="unstyled">
+            <PLButton :aria-label="moveDownAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveDown($event, 1)" v-bind="moveDownButtonProps" :pt="ptm('targetMoveDownButton')" :unstyled="unstyled" data-pc-section="targetmovedownbutton">
                 <template #icon>
                     <slot name="movedownicon">
                         <AngleDownIcon v-bind="ptm('targetMoveDownButton')['icon']" data-pc-section="movedownicon" />
                     </slot>
                 </template>
             </PLButton>
-            <PLButton :aria-label="moveBottomAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveBottom($event, 1)" :pt="ptm('targetMoveBottomButton')" v-bind="moveBottomButtonProps" :unstyled="unstyled">
+            <PLButton
+                :aria-label="moveBottomAriaLabel"
+                :disabled="moveDisabled(1)"
+                type="button"
+                @click="moveBottom($event, 1)"
+                v-bind="moveBottomButtonProps"
+                :pt="ptm('targetMoveBottomButton')"
+                :unstyled="unstyled"
+                data-pc-section="targetmovebottombutton"
+            >
                 <template #icon>
                     <slot name="movebottomicon">
                         <AngleDoubleDownIcon v-bind="ptm('targetMoveBottomButton')['icon']" data-pc-section="movebottomicon" />
diff --git a/components/lib/splitbutton/SplitButton.vue b/components/lib/splitbutton/SplitButton.vue
index 61fea7460..a712fe05a 100755
--- a/components/lib/splitbutton/SplitButton.vue
+++ b/components/lib/splitbutton/SplitButton.vue
@@ -12,8 +12,8 @@
                 :size="size"
                 :aria-label="label"
                 @click="onDefaultButtonClick"
-                :pt="ptm('button')"
                 v-bind="buttonProps"
+                :pt="ptm('button')"
                 :unstyled="unstyled"
                 data-pc-section="button"
             >
@@ -37,12 +37,12 @@
             :aria-controls="ariaId + '_overlay'"
             @click="onDropdownButtonClick"
             @keydown="onDropdownKeydown"
-            :pt="ptm('menuButton')"
             :severity="severity"
             :text="text"
             :outlined="outlined"
             :size="size"
             v-bind="menuButtonProps"
+            :pt="ptm('menuButton')"
             :unstyled="unstyled"
             data-pc-section="menubutton"
         >

From 5fdb960eded98c9c1095a3db8445b69982ce3dff Mon Sep 17 00:00:00 2001
From: Cagatay Civici <cagatay.civici@gmail.com>
Date: Mon, 4 Dec 2023 16:40:33 +0300
Subject: [PATCH 40/69] Update pricing

---
 assets/data/news.json | 8 ++++----
 pages/uikit/index.vue | 6 ++----
 2 files changed, 6 insertions(+), 8 deletions(-)

diff --git a/assets/data/news.json b/assets/data/news.json
index 42f9ada36..d659a76a2 100644
--- a/assets/data/news.json
+++ b/assets/data/news.json
@@ -1,8 +1,8 @@
 {
-    "id": 45,
-    "content": "🎉 Black Friday Sale! Up to 50% Off",
-    "linkText": "Buy Now",
-    "linkHref": "https://www.primefaces.org/store",
+    "id": 46,
+    "content": "Sakai Free Admin Template",
+    "linkText": "View Demo",
+    "linkHref": "https://sakai.primefaces.org",
     "backgroundStyle": "background-color:var(--primary-color)",
     "textStyle": "color:var(--primary-color-text);font-weight:500",
     "linkStyle": "color:var(--primary-color-text);font-weight:700;text-decoration: underline;"
diff --git a/pages/uikit/index.vue b/pages/uikit/index.vue
index d3779141a..49ede178f 100644
--- a/pages/uikit/index.vue
+++ b/pages/uikit/index.vue
@@ -157,8 +157,7 @@
                                 <div class="text-600 font-medium">For individual designers</div>
                                 <hr class="my-3 mx-0 border-top-1 border-none surface-border" />
                                 <div class="flex flex-wrap gap-3">
-                                    <span class="text-2xl font-medium text-500 line-through">$99</span>
-                                    <span class="text-2xl font-bold text-900">$49</span>
+                                    <span class="text-2xl font-bold text-900">$99</span>
                                 </div>
                                 <hr class="my-3 mx-0 border-top-1 border-none surface-border" />
                                 <ul class="list-none p-0 m-0 flex-grow-1 text-lg">
@@ -202,8 +201,7 @@
                                 <div class="text-600 font-medium">For small teams</div>
                                 <hr class="my-3 mx-0 border-top-1 border-none surface-border" />
                                 <div class="flex flex-wrap gap-3">
-                                    <span class="text-2xl font-medium text-500 line-through">$249</span>
-                                    <span class="text-2xl font-bold text-900">$149</span>
+                                    <span class="text-2xl font-bold text-900">$249</span>
                                 </div>
                                 <hr class="my-3 mx-0 border-top-1 border-none surface-border" />
                                 <ul class="list-none p-0 m-0 flex-grow-1 text-lg">

From 8eea973282d1f7286ea5dc2c95bdfa2c71830e86 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 10:06:55 +0300
Subject: [PATCH 41/69] parent updates for .d.ts files and apidoc

---
 components/doc/DocApiTable.vue                |   6 +-
 components/doc/helpers/PTHelper.js            |  13 +-
 components/lib/autocomplete/AutoComplete.d.ts |  19 +-
 components/lib/badge/Badge.d.ts               |  12 +-
 components/lib/button/Button.d.ts             |  20 +-
 components/lib/calendar/Calendar.d.ts         |  36 +-
 components/lib/column/Column.d.ts             |  36 +-
 .../lib/confirmdialog/ConfirmDialog.d.ts      |  18 +-
 components/lib/confirmpopup/ConfirmPopup.d.ts |  18 +-
 components/lib/datatable/DataTable.d.ts       |  16 +-
 components/lib/dataview/DataView.d.ts         |  17 +-
 components/lib/dialog/Dialog.d.ts             |  36 +-
 components/lib/dropdown/Dropdown.d.ts         |  52 +-
 components/lib/fileupload/FileUpload.d.ts     |  28 +-
 components/lib/inplace/Inplace.d.ts           |  16 +-
 components/lib/inputnumber/InputNumber.d.ts   |  42 +-
 components/lib/inputtext/InputText.d.ts       |  12 +-
 components/lib/message/Message.d.ts           |  30 +-
 components/lib/orderlist/OrderList.d.ts       |  24 +-
 components/lib/paginator/Paginator.d.ts       |  70 +-
 components/lib/password/Password.d.ts         |  20 +-
 components/lib/picklist/PickList.d.ts         |  40 +-
 components/lib/progressbar/ProgressBar.d.ts   |  16 +-
 components/lib/speeddial/SpeedDial.d.ts       |  16 +-
 components/lib/splitbutton/SplitButton.d.ts   |  18 +-
 components/lib/tieredmenu/TieredMenu.d.ts     |  32 +-
 components/lib/tree/Tree.d.ts                 |  46 +-
 components/lib/treeselect/TreeSelect.d.ts     |  16 +-
 components/lib/treetable/TreeTable.d.ts       |  16 +-
 doc/common/apidoc/index.json                  | 823 ++++++++++++++----
 30 files changed, 1171 insertions(+), 393 deletions(-)

diff --git a/components/doc/DocApiTable.vue b/components/doc/DocApiTable.vue
index f9b99f517..bbc12dd22 100644
--- a/components/doc/DocApiTable.vue
+++ b/components/doc/DocApiTable.vue
@@ -29,14 +29,14 @@
                                 <template v-for="(value, i) in getType(v)" :key="value">
                                     <span v-if="i !== 0" class="doc-option-type">{{ ' | ' }}</span>
                                     <NuxtLink v-if="isLinkType(value)" :to="setLinkPath(value)" class="doc-option-type doc-option-link">{{ value }}</NuxtLink
-                                    ><span v-else class="doc-option-type">{{ value }}</span>
+                                    ><span v-else class="doc-option-type">{{ value ==='T'? 'any': value }}</span>
                                 </template>
                             </template>
 
                             <template v-else-if="k === 'options'">
                                 <template v-for="val in v" :key="val.name">
                                     <div class="doc-option-type-options-container">
-                                        {{ val.name }}: <span class="doc-option-type-options doc-option-type">{{ val.type }}</span>
+                                        {{ val.name }}: <span class="doc-option-type-options doc-option-type">{{ (val.type === 'T' || val.type.includes('<T>')) ? 'any' : val.type }}</span>
                                     </div>
                                 </template>
                             </template>
@@ -111,7 +111,7 @@ export default {
             });
         },
         isLinkType(value) {
-            if (this.label === 'Slots') return false;
+            if (this.label === 'Slots' || value.includes('SharedPassThroughOption') || value.includes('PassThrough<')) return false;
             const validValues = ['confirmationoptions', 'toastmessageoptions'];
 
             return value.toLowerCase().includes(this.id.split('.')[1]) || validValues.includes(value.toLowerCase());
diff --git a/components/doc/helpers/PTHelper.js b/components/doc/helpers/PTHelper.js
index 76675d28f..b6c79714e 100644
--- a/components/doc/helpers/PTHelper.js
+++ b/components/doc/helpers/PTHelper.js
@@ -7,10 +7,21 @@ export const getPTOption = (name) => {
 
     for (const [i, prop] of props.entries()) {
         if (options) {
+            let subCompName, subOptions;
+            let hasSubComp = prop.name !== 'hooks' && prop.type.indexOf('TransitionType') === -1 && prop.type.indexOf('<') > -1 && name.toLowerCase() !== prop.type.slice(0, prop.type.indexOf('<')).toLowerCase();
+
+            if (hasSubComp) {
+                subCompName = prop.type.slice(0, prop.type.indexOf('<')).replace('PassThroughOptions', '').replace('PassThroughOptionType', '');
+                subOptions = APIDocs[subCompName.toLowerCase()].interfaces.values[`${subCompName}PassThroughMethodOptions`];
+                const objToReplace = subOptions.props.find((opt) => opt.name === 'parent');
+
+                objToReplace.type = prop.type;
+            }
+
             data.push({
                 value: i + 1,
                 label: prop.name,
-                options: options?.props,
+                options: hasSubComp ? subOptions?.props : options?.props,
                 description: prop.description
             });
         } else {
diff --git a/components/lib/autocomplete/AutoComplete.d.ts b/components/lib/autocomplete/AutoComplete.d.ts
index f808f8f35..5266f582d 100755
--- a/components/lib/autocomplete/AutoComplete.d.ts
+++ b/components/lib/autocomplete/AutoComplete.d.ts
@@ -9,7 +9,7 @@
  */
 import { HTMLAttributes, InputHTMLAttributes, TransitionProps, VNode } from 'vue';
 import { ComponentHooks } from '../basecomponent';
-import { ButtonPassThroughOptionType } from '../button';
+import { ButtonPassThroughOptions } from '../button';
 import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 import { VirtualScrollerItemOptions, VirtualScrollerPassThroughOptionType, VirtualScrollerProps } from '../virtualscroller';
@@ -44,6 +44,20 @@ export interface AutoCompletePassThroughMethodOptions {
     global: object | undefined;
 }
 
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface AutoCompleteSharedPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: AutoCompleteProps;
+    /**
+     * Defines current inline state.
+     */
+    state: AutoCompleteState;
+}
+
 /**
  * Custom change event.
  * @see {@link AutoCompleteEmits.change}
@@ -150,8 +164,9 @@ export interface AutoCompletePassThroughOptions {
     loadingIcon?: AutoCompletePassThroughOptionType;
     /**
      * Used to pass attributes to the Button component.
+     * @see {@link ButtonPassThroughOptions}
      */
-    dropdownButton?: ButtonPassThroughOptionType;
+    dropdownButton?: ButtonPassThroughOptions<AutoCompleteSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the panel's DOM element.
      */
diff --git a/components/lib/badge/Badge.d.ts b/components/lib/badge/Badge.d.ts
index b91687a8b..6002e5770 100644
--- a/components/lib/badge/Badge.d.ts
+++ b/components/lib/badge/Badge.d.ts
@@ -12,12 +12,12 @@ import { ComponentHooks } from '../basecomponent';
 import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 
-export declare type BadgePassThroughOptionType = BadgePassThroughAttributes | ((options: BadgePassThroughMethodOptions) => BadgePassThroughAttributes | string) | string | null | undefined;
+export declare type BadgePassThroughOptionType<T = any> = BadgePassThroughAttributes | ((options: BadgePassThroughMethodOptions<T>) => BadgePassThroughAttributes | string) | string | null | undefined;
 
 /**
  * Custom passthrough(pt) option method.
  */
-export interface BadgePassThroughMethodOptions {
+export interface BadgePassThroughMethodOptions<T> {
     /**
      * Defines instance.
      */
@@ -30,6 +30,10 @@ export interface BadgePassThroughMethodOptions {
      * Defines passthrough(pt) options in global config.
      */
     global: object | undefined;
+    /**
+     * Defines parent instance.
+     */
+    parent: T;
 }
 
 /**
@@ -43,11 +47,11 @@ export interface BadgePassThroughAttributes {
  * Custom passthrough(pt) options.
  * @see {@link BadgeProps.pt}
  */
-export interface BadgePassThroughOptions {
+export interface BadgePassThroughOptions<T = any> {
     /**
      * Used to pass attributes to the root's DOM element.
      */
-    root?: BadgePassThroughOptionType;
+    root?: BadgePassThroughOptionType<T>;
     /**
      * Used to manage all lifecycle hooks.
      * @see {@link BaseComponent.ComponentHooks}
diff --git a/components/lib/button/Button.d.ts b/components/lib/button/Button.d.ts
index bbda85ea1..768e3ff28 100755
--- a/components/lib/button/Button.d.ts
+++ b/components/lib/button/Button.d.ts
@@ -12,12 +12,12 @@ import { ComponentHooks } from '../basecomponent';
 import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 
-export declare type ButtonPassThroughOptionType = ButtonPassThroughAttributes | ((options: ButtonPassThroughMethodOptions) => ButtonPassThroughAttributes | string) | string | null | undefined;
+export declare type ButtonPassThroughOptionType<T = any> = ButtonPassThroughAttributes | ((options: ButtonPassThroughMethodOptions<T>) => ButtonPassThroughAttributes | string) | string | null | undefined;
 
 /**
  * Custom passthrough(pt) option method.
  */
-export interface ButtonPassThroughMethodOptions {
+export interface ButtonPassThroughMethodOptions<T> {
     /**
      * Defines instance.
      */
@@ -33,7 +33,7 @@ export interface ButtonPassThroughMethodOptions {
     /**
      * Defines parent instance.
      */
-    parent: any;
+    parent: T;
     /**
      * Defines passthrough(pt) options in global config.
      */
@@ -44,27 +44,27 @@ export interface ButtonPassThroughMethodOptions {
  * Custom passthrough(pt) options.
  * @see {@link ButtonProps.pt}
  */
-export interface ButtonPassThroughOptions {
+export interface ButtonPassThroughOptions<T = any> {
     /**
      * Used to pass attributes to the root's DOM element.
      */
-    root?: ButtonPassThroughOptionType;
+    root?: ButtonPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the loading icon's DOM element.
      */
-    loadingIcon?: ButtonPassThroughOptionType;
+    loadingIcon?: ButtonPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the icon's DOM element.
      */
-    icon?: ButtonPassThroughOptionType;
+    icon?: ButtonPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the label's DOM element.
      */
-    label?: ButtonPassThroughOptionType;
+    label?: ButtonPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the badge's DOM element.
      */
-    badge?: ButtonPassThroughOptionType;
+    badge?: ButtonPassThroughOptionType<T>;
     /**
      * Used to manage all lifecycle hooks.
      * @see {@link BaseComponent.ComponentHooks}
@@ -171,7 +171,7 @@ export interface ButtonProps extends ButtonHTMLAttributes {
      * Used to pass attributes to DOM elements inside the component.
      * @type {ButtonPassThroughOptions}
      */
-    pt?: PassThrough<ButtonPassThroughOptions>;
+    pt?: PassThrough<ButtonPassThroughOptions<any>>;
     /**
      * Used to configure passthrough(pt) options of the component.
      * @type {PassThroughOptions}
diff --git a/components/lib/calendar/Calendar.d.ts b/components/lib/calendar/Calendar.d.ts
index 1ad87ee10..b399e31d4 100755
--- a/components/lib/calendar/Calendar.d.ts
+++ b/components/lib/calendar/Calendar.d.ts
@@ -9,7 +9,7 @@
  */
 import { HTMLAttributes, InputHTMLAttributes, TransitionProps, VNode } from 'vue';
 import { ComponentHooks } from '../basecomponent';
-import { ButtonPassThroughOptionType } from '../button';
+import { ButtonPassThroughOptions } from '../button';
 import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 
@@ -43,6 +43,20 @@ export interface CalendarPassThroughMethodOptions {
     global: object | undefined;
 }
 
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface CalendarSharedPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: CalendarProps;
+    /**
+     * Defines current inline state.
+     */
+    state: CalendarState;
+}
+
 /**
  * Custom Calendar responsive options metadata.
  */
@@ -117,9 +131,9 @@ export interface CalendarPassThroughOptions {
     input?: CalendarPassThroughOptionType;
     /**
      * Used to pass attributes to the Button component.
-     * @see {@link ButtonPassThroughOptionType}
+     * @see {@link ButtonPassThroughOptions}
      */
-    dropdownButton?: ButtonPassThroughOptionType;
+    dropdownButton?: ButtonPassThroughOptions<CalendarSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the panel's DOM element.
      */
@@ -138,9 +152,9 @@ export interface CalendarPassThroughOptions {
     header?: CalendarPassThroughOptionType;
     /**
      * Used to pass attributes to the Button component.
-     * @see {@link ButtonPassThroughOptionType}
+     * @see {@link ButtonPassThroughOptions}
      */
-    previousButton?: ButtonPassThroughOptionType;
+    previousButton?: ButtonPassThroughOptions<CalendarSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the title's DOM element.
      */
@@ -159,9 +173,9 @@ export interface CalendarPassThroughOptions {
     decadeTitle?: CalendarPassThroughOptionType;
     /**
      * Used to pass attributes to the Button component.
-     * @see {@link ButtonPassThroughOptionType}
+     * @see {@link ButtonPassThroughOptions}
      */
-    nextButton?: ButtonPassThroughOptionType;
+    nextButton?: ButtonPassThroughOptions<CalendarSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the container's DOM element.
      */
@@ -288,14 +302,14 @@ export interface CalendarPassThroughOptions {
     buttonbar?: CalendarPassThroughOptionType;
     /**
      * Used to pass attributes to the Button component.
-     * @see {@link ButtonPassThroughOptionType}
+     * @see {@link ButtonPassThroughOptions}
      */
-    todayButton?: ButtonPassThroughOptionType;
+    todayButton?: ButtonPassThroughOptions<CalendarSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Button component.
-     * @see {@link ButtonPassThroughOptionType}
+     * @see {@link ButtonPassThroughOptions}
      */
-    clearButton?: ButtonPassThroughOptionType;
+    clearButton?: ButtonPassThroughOptions<CalendarSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the aria selected day's DOM element.
      */
diff --git a/components/lib/column/Column.d.ts b/components/lib/column/Column.d.ts
index 093b17694..b9400f2f6 100755
--- a/components/lib/column/Column.d.ts
+++ b/components/lib/column/Column.d.ts
@@ -11,7 +11,7 @@
 
 import { VNode } from 'vue';
 import { ComponentHooks } from '../basecomponent';
-import { ButtonPassThroughOptionType } from '../button';
+import { ButtonPassThroughOptions } from '../button';
 import { DataTablePassThroughOptions } from '../datatable';
 import { DropdownPassThroughOptionType } from '../dropdown';
 import { PassThroughOptions } from '../passthrough';
@@ -46,6 +46,20 @@ export interface ColumnPassThroughMethodOptions {
     global: object | undefined;
 }
 
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface ColumnSharedPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: ColumnProps;
+    /**
+     * Defines parent instance.
+     */
+    parent: DataTablePassThroughOptions;
+}
+
 /**
  * Filter model metadata.
  */
@@ -194,7 +208,7 @@ export interface ColumnPassThroughOptions {
      * Used to pass attributes to the Dropdown component.
      * @see {@link DropdownPassThroughOptionType}
      */
-    filterOperatorDropdown?: DropdownPassThroughOptionType;
+    filterOperatorDropdown?: DropdownPassThroughOptionType<ColumnSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the filter constraints' DOM element.
      */
@@ -207,39 +221,39 @@ export interface ColumnPassThroughOptions {
      * Used to pass attributes to the Dropdown component.
      * @see {@link DropdownPassThroughOptionType}
      */
-    filterMatchModeDropdown?: DropdownPassThroughOptionType;
+    filterMatchModeDropdown?: DropdownPassThroughOptionType<ColumnSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the filter remove button container's DOM element.
      */
     filterRemove?: ColumnPassThroughOptionType;
     /**
      * Used to pass attributes to the Button component.
-     * @see {@link ButtonPassThroughOptionType}
+     * @see {@link ButtonPassThroughOptions}
      */
-    filterRemoveButton?: ButtonPassThroughOptionType;
+    filterRemoveButton?: ButtonPassThroughOptions<ColumnSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the filter add rule's DOM element.
      */
     filterAddRule?: ColumnPassThroughOptionType;
     /**
      * Used to pass attributes to the Button component.
-     * @see {@link ButtonPassThroughOptionType}
+     * @see {@link ButtonPassThroughOptions}
      */
-    filterAddRuleButton?: ButtonPassThroughOptionType;
+    filterAddRuleButton?: ButtonPassThroughOptions<ColumnSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the filter buttonbar's DOM element.
      */
     filterButtonbar?: ColumnPassThroughOptionType;
     /**
      * Used to pass attributes to the Button component.
-     * @see {@link ButtonPassThroughOptionType}
+     * @see {@link ButtonPassThroughOptions}
      */
-    filterClearButton?: ButtonPassThroughOptionType;
+    filterClearButton?: ButtonPassThroughOptions<ColumnSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Button component.
-     * @see {@link ButtonPassThroughOptionType}
+     * @see {@link ButtonPassThroughOptions}
      */
-    filterApplyButton?: ButtonPassThroughOptionType;
+    filterApplyButton?: ButtonPassThroughOptions<ColumnSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the body cell's DOM element.
      */
diff --git a/components/lib/confirmdialog/ConfirmDialog.d.ts b/components/lib/confirmdialog/ConfirmDialog.d.ts
index 20639a966..9597497e4 100644
--- a/components/lib/confirmdialog/ConfirmDialog.d.ts
+++ b/components/lib/confirmdialog/ConfirmDialog.d.ts
@@ -38,6 +38,20 @@ export interface ConfirmDialogPassThroughMethodOptions {
     global: object | undefined;
 }
 
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface ConfirmDialogSharedPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: ConfirmDialogProps;
+    /**
+     * Defines current inline state.
+     */
+    state: ConfirmDialogState;
+}
+
 /**
  * Custom passthrough(pt) options.
  * @see {@link ConfirmDialogProps.pt}
@@ -87,12 +101,12 @@ export interface ConfirmDialogPassThroughOptions {
      * Used to pass attributes to the Button component.
      * @see {@link ButtonPassThroughOptions}
      */
-    rejectButton?: ButtonPassThroughOptions;
+    rejectButton?: ButtonPassThroughOptions<ConfirmDialogSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Button component.
      * @see {@link ButtonPassThroughOptions}
      */
-    acceptButton?: ButtonPassThroughOptions;
+    acceptButton?: ButtonPassThroughOptions<ConfirmDialogSharedPassThroughMethodOptions>;
     /**
      * Used to manage all lifecycle hooks.
      * @see {@link BaseComponent.ComponentHooks}
diff --git a/components/lib/confirmpopup/ConfirmPopup.d.ts b/components/lib/confirmpopup/ConfirmPopup.d.ts
index a87c77c75..4bf168c86 100644
--- a/components/lib/confirmpopup/ConfirmPopup.d.ts
+++ b/components/lib/confirmpopup/ConfirmPopup.d.ts
@@ -40,6 +40,20 @@ export interface ConfirmPopupPassThroughMethodOptions {
     global: object | undefined;
 }
 
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface ConfirmPopupSharedPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: ConfirmPopupProps;
+    /**
+     * Defines current inline state.
+     */
+    state: ConfirmPopupState;
+}
+
 /**
  * Custom passthrough(pt) options.
  * @see {@link ConfirmPopupProps.pt}
@@ -69,12 +83,12 @@ export interface ConfirmPopupPassThroughOptions {
      * Used to pass attributes to the Button component.
      * @see {@link ButtonPassThroughOptions}
      */
-    rejectButton?: ButtonPassThroughOptions;
+    rejectButton?: ButtonPassThroughOptions<ConfirmPopupSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Button component.
      * @see {@link ButtonPassThroughOptions}
      */
-    acceptButton?: ButtonPassThroughOptions;
+    acceptButton?: ButtonPassThroughOptions<ConfirmPopupSharedPassThroughMethodOptions>;
     /**
      * Used to manage all lifecycle hooks.
      * @see {@link BaseComponent.ComponentHooks}
diff --git a/components/lib/datatable/DataTable.d.ts b/components/lib/datatable/DataTable.d.ts
index 6df41b87e..ee7e08888 100755
--- a/components/lib/datatable/DataTable.d.ts
+++ b/components/lib/datatable/DataTable.d.ts
@@ -47,6 +47,20 @@ export interface DataTablePassThroughMethodOptions {
     global: object | undefined;
 }
 
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface DataTableSharedPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: DataTableProps;
+    /**
+     * Defines current inline state.
+     */
+    state: DataTableState;
+}
+
 /**
  * Custom datatable export metadata.
  */
@@ -582,7 +596,7 @@ export interface DataTablePassThroughOptions {
      * Used to pass attributes to the Paginator component.
      * @see {@link PaginatorPassThroughOptionType}
      */
-    paginator?: PaginatorPassThroughOptionType;
+    paginator?: PaginatorPassThroughOptionType<DataTableSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the wrapper's DOM element.
      */
diff --git a/components/lib/dataview/DataView.d.ts b/components/lib/dataview/DataView.d.ts
index 64afb3291..d533a097e 100755
--- a/components/lib/dataview/DataView.d.ts
+++ b/components/lib/dataview/DataView.d.ts
@@ -36,6 +36,21 @@ export interface DataViewPassThroughMethodOptions {
      */
     global: object | undefined;
 }
+
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface DataViewSharedPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: DataViewProps;
+    /**
+     * Defines current inline state.
+     */
+    state: DataViewState;
+}
+
 /**
  * Custom page event.
  * @see {@link DataViewEmits.page}
@@ -76,7 +91,7 @@ export interface DataViewPassThroughOptions {
      * Used to pass attributes to the Paginator component.
      * @see {@link PaginatorPassThroughOptionType}
      */
-    paginator?: PaginatorPassThroughOptionType;
+    paginator?: PaginatorPassThroughOptionType<DataViewSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the content's DOM element.
      */
diff --git a/components/lib/dialog/Dialog.d.ts b/components/lib/dialog/Dialog.d.ts
index 55ff6e8ea..5cf3c5b19 100755
--- a/components/lib/dialog/Dialog.d.ts
+++ b/components/lib/dialog/Dialog.d.ts
@@ -12,14 +12,14 @@ import { ComponentHooks } from '../basecomponent';
 import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 
-export declare type DialogPassThroughOptionType = DialogPassThroughAttributes | ((options: DialogPassThroughMethodOptions) => DialogPassThroughAttributes | string) | string | null | undefined;
+export declare type DialogPassThroughOptionType<T = any> = DialogPassThroughAttributes | ((options: DialogPassThroughMethodOptions<T>) => DialogPassThroughAttributes | string) | string | null | undefined;
 
-export declare type DialogPassThroughTransitionType = TransitionProps | ((options: DialogPassThroughMethodOptions) => TransitionProps) | undefined;
+export declare type DialogPassThroughTransitionType<T = any> = TransitionProps | ((options: DialogPassThroughMethodOptions<T>) => TransitionProps) | undefined;
 
 /**
  * Custom passthrough(pt) option method.
  */
-export interface DialogPassThroughMethodOptions {
+export interface DialogPassThroughMethodOptions<T> {
     /**
      * Defines instance.
      */
@@ -32,6 +32,10 @@ export interface DialogPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: DialogState;
+    /**
+     * Defines parent instance.
+     */
+    parent: T;
     /**
      * Defines passthrough(pt) options in global config.
      */
@@ -42,51 +46,51 @@ export interface DialogPassThroughMethodOptions {
  * Custom passthrough(pt) options.
  * @see {@link DialogProps.pt}
  */
-export interface DialogPassThroughOptions {
+export interface DialogPassThroughOptions<T = any> {
     /**
      * Used to pass attributes to the root's DOM element.
      */
-    root?: DialogPassThroughOptionType;
+    root?: DialogPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the header's DOM element.
      */
-    header?: DialogPassThroughOptionType;
+    header?: DialogPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the header title's DOM element.
      */
-    title?: DialogPassThroughOptionType;
+    title?: DialogPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the header icons' DOM element.
      */
-    icons?: DialogPassThroughOptionType;
+    icons?: DialogPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the maximizable button's DOM element.
      */
-    maximizableButton?: DialogPassThroughOptionType;
+    maximizableButton?: DialogPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the maximizable icon's DOM element.
      */
-    maximizableIcon?: DialogPassThroughOptionType;
+    maximizableIcon?: DialogPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the close button's component.
      */
-    closeButton?: DialogPassThroughOptionType;
+    closeButton?: DialogPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the close button icon's component.
      */
-    closeButtonIcon?: DialogPassThroughOptionType;
+    closeButtonIcon?: DialogPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the content's DOM element.
      */
-    content?: DialogPassThroughOptionType;
+    content?: DialogPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the footer's DOM element.
      */
-    footer?: DialogPassThroughOptionType;
+    footer?: DialogPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the mask's DOM element.
      */
-    mask?: DialogPassThroughOptionType;
+    mask?: DialogPassThroughOptionType<T>;
     /**
      * Used to manage all lifecycle hooks.
      * @see {@link BaseComponent.ComponentHooks}
@@ -95,7 +99,7 @@ export interface DialogPassThroughOptions {
     /**
      * Used to control Vue Transition API.
      */
-    transition?: DialogPassThroughTransitionType;
+    transition?: DialogPassThroughTransitionType<T>;
 }
 
 /**
diff --git a/components/lib/dropdown/Dropdown.d.ts b/components/lib/dropdown/Dropdown.d.ts
index dee0b76d2..3e86a0347 100755
--- a/components/lib/dropdown/Dropdown.d.ts
+++ b/components/lib/dropdown/Dropdown.d.ts
@@ -13,14 +13,14 @@ import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 import { VirtualScrollerItemOptions, VirtualScrollerPassThroughOptionType, VirtualScrollerProps } from '../virtualscroller';
 
-export declare type DropdownPassThroughOptionType = DropdownPassThroughAttributes | ((options: DropdownPassThroughMethodOptions) => DropdownPassThroughAttributes | string) | string | null | undefined;
+export declare type DropdownPassThroughOptionType<T = any> = DropdownPassThroughAttributes | ((options: DropdownPassThroughMethodOptions<T>) => DropdownPassThroughAttributes | string) | string | null | undefined;
 
-export declare type DropdownPassThroughTransitionType = TransitionProps | ((options: DropdownPassThroughMethodOptions) => TransitionProps) | undefined;
+export declare type DropdownPassThroughTransitionType<T = any> = TransitionProps | ((options: DropdownPassThroughMethodOptions<T>) => TransitionProps) | undefined;
 
 /**
  * Custom passthrough(pt) option method.
  */
-export interface DropdownPassThroughMethodOptions {
+export interface DropdownPassThroughMethodOptions<T> {
     /**
      * Defines instance.
      */
@@ -33,6 +33,10 @@ export interface DropdownPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: DropdownState;
+    /**
+     * Defines parent instance.
+     */
+    parent: T | any;
     /**
      * Defines current options.
      */
@@ -77,51 +81,51 @@ export interface DropdownFilterEvent {
  * Custom passthrough(pt) options.
  * @see {@link DropdownProps.pt}
  */
-export interface DropdownPassThroughOptions {
+export interface DropdownPassThroughOptions<T = any> {
     /**
      * Used to pass attributes to the root's DOM element.
      */
-    root?: DropdownPassThroughOptionType;
+    root?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the input's DOM element.
      */
-    input?: DropdownPassThroughOptionType;
+    input?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the clear icon's DOM element.
      */
-    clearIcon?: DropdownPassThroughOptionType;
+    clearIcon?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the trigger' DOM element.
      */
-    trigger?: DropdownPassThroughOptionType;
+    trigger?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the loading icon's DOM element.
      */
-    loadingIcon?: DropdownPassThroughOptionType;
+    loadingIcon?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the panel's DOM element.
      */
-    panel?: DropdownPassThroughOptionType;
+    panel?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the header's DOM element.
      */
-    header?: DropdownPassThroughOptionType;
+    header?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the filter container's DOM element.
      */
-    filterContainer?: DropdownPassThroughOptionType;
+    filterContainer?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the filter input's DOM element.
      */
-    filterInput?: DropdownPassThroughOptionType;
+    filterInput?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the filter icon's DOM element.
      */
-    filterIcon?: DropdownPassThroughOptionType;
+    filterIcon?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the wrapper's DOM element.
      */
-    wrapper?: DropdownPassThroughOptionType;
+    wrapper?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the VirtualScroller component.
      * @see {@link VirtualScrollerPassThroughOptionType}
@@ -130,39 +134,39 @@ export interface DropdownPassThroughOptions {
     /**
      * Used to pass attributes to the list's DOM element.
      */
-    list?: DropdownPassThroughOptionType;
+    list?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the item group's DOM element.
      */
-    itemGroup?: DropdownPassThroughOptionType;
+    itemGroup?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the item's DOM element.
      */
-    item?: DropdownPassThroughOptionType;
+    item?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the empty message's DOM element.
      */
-    emptyMessage?: DropdownPassThroughOptionType;
+    emptyMessage?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the hidden first focusable element's DOM element.
      */
-    hiddenFirstFocusableEl?: DropdownPassThroughOptionType;
+    hiddenFirstFocusableEl?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the hidden filter result's DOM element.
      */
-    hiddenFilterResult?: DropdownPassThroughOptionType;
+    hiddenFilterResult?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the hidden empty message's DOM element.
      */
-    hiddenEmptyMessage?: DropdownPassThroughOptionType;
+    hiddenEmptyMessage?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the hidden selected message's DOM element.
      */
-    hiddenSelectedMessage?: DropdownPassThroughOptionType;
+    hiddenSelectedMessage?: DropdownPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the hidden last focusable element's DOM element.
      */
-    hiddenLastFocusableEl?: DropdownPassThroughOptionType;
+    hiddenLastFocusableEl?: DropdownPassThroughOptionType<T>;
     /**
      * Used to manage all lifecycle hooks.
      * @see {@link BaseComponent.ComponentHooks}
diff --git a/components/lib/fileupload/FileUpload.d.ts b/components/lib/fileupload/FileUpload.d.ts
index 53727f0f1..eb4b84044 100755
--- a/components/lib/fileupload/FileUpload.d.ts
+++ b/components/lib/fileupload/FileUpload.d.ts
@@ -8,6 +8,7 @@
  *
  */
 import { VNode } from 'vue';
+import { BadgePassThroughOptions } from '../badge';
 import { ComponentHooks } from '../basecomponent';
 import { ButtonPassThroughOptions } from '../button';
 import { MessagePassThroughOptions } from '../message';
@@ -38,6 +39,20 @@ export interface FileUploadPassThroughMethodOptions {
     global: object | undefined;
 }
 
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface FileUploadPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: FileUploadProps;
+    /**
+     * Defines current inline state.
+     */
+    state: FileUploadState;
+}
+
 /**
  * Custom select event.
  * @see {@link FileUploadEmits.select}
@@ -199,12 +214,12 @@ export interface FileUploadPassThroughOptions {
      * Used to pass attributes to the upload button's DOM element.
      * @see {@link ButtonPassThroughOptions}
      */
-    uploadButton?: ButtonPassThroughOptions;
+    uploadButton?: ButtonPassThroughOptions<FileUploadPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the cancel button's DOM element.
      * @see {@link ButtonPassThroughOptions}
      */
-    cancelButton?: ButtonPassThroughOptions;
+    cancelButton?: ButtonPassThroughOptions<FileUploadPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the content's DOM element.
      */
@@ -217,7 +232,7 @@ export interface FileUploadPassThroughOptions {
      * Used to pass attributes to the messages' DOM element.
      * @see {@link MessagePassThroughOptions}
      */
-    message?: MessagePassThroughOptions;
+    message?: MessagePassThroughOptions<FileUploadPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the file's DOM element.
      */
@@ -239,9 +254,10 @@ export interface FileUploadPassThroughOptions {
      */
     fileSize?: FileUploadPassThroughOptionType;
     /**
-     * Used to pass attributes to the badge's DOM element.
+     * Used to pass attributes to the Badge component.
+     * @see {@link BadgePassThroughOptions}
      */
-    badge?: FileUploadPassThroughOptionType;
+    badge?: BadgePassThroughOptions<FileUploadPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the actions's DOM element.
      */
@@ -250,7 +266,7 @@ export interface FileUploadPassThroughOptions {
      * Used to pass attributes to the remove button's DOM element.
      * @see {@link ButtonPassThroughOptions}
      */
-    removeButton?: ButtonPassThroughOptions;
+    removeButton?: ButtonPassThroughOptions<FileUploadPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the empty's DOM element.
      */
diff --git a/components/lib/inplace/Inplace.d.ts b/components/lib/inplace/Inplace.d.ts
index bcf74acb2..09989eebb 100755
--- a/components/lib/inplace/Inplace.d.ts
+++ b/components/lib/inplace/Inplace.d.ts
@@ -38,6 +38,20 @@ export interface InplacePassThroughMethodOptions {
     global: object | undefined;
 }
 
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface InplaceSharedPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: InplaceProps;
+    /**
+     * Defines current inline state.
+     */
+    state: InplaceState;
+}
+
 /**
  * Custom passthrough(pt) options.
  * @see {@link InplaceProps.pt}
@@ -59,7 +73,7 @@ export interface InplacePassThroughOptions {
      * Used to pass attributes to the Button component.
      * @see {@link ButtonPassThroughOptions}
      */
-    closeButton?: ButtonPassThroughOptions;
+    closeButton?: ButtonPassThroughOptions<InplaceSharedPassThroughMethodOptions>;
     /**
      * Used to manage all lifecycle hooks.
      * @see {@link BaseComponent.ComponentHooks}
diff --git a/components/lib/inputnumber/InputNumber.d.ts b/components/lib/inputnumber/InputNumber.d.ts
index 0f19ff419..7a15b9d95 100755
--- a/components/lib/inputnumber/InputNumber.d.ts
+++ b/components/lib/inputnumber/InputNumber.d.ts
@@ -9,17 +9,17 @@
  */
 import { ButtonHTMLAttributes, InputHTMLAttributes, VNode } from 'vue';
 import { ComponentHooks } from '../basecomponent';
-import { ButtonPassThroughOptionType } from '../button';
-import { InputTextPassThroughOptionType } from '../inputtext';
+import { ButtonPassThroughOptions } from '../button';
+import { InputTextPassThroughOptions } from '../inputtext';
 import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, Nullable, PassThrough } from '../ts-helpers';
 
-export declare type InputNumberPassThroughOptionType = InputNumberPassThroughAttributes | ((options: InputNumberPassThroughMethodOptions) => InputNumberPassThroughAttributes | string) | string | null | undefined;
+export declare type InputNumberPassThroughOptionType<T = any> = InputNumberPassThroughAttributes | ((options: InputNumberPassThroughMethodOptions<T>) => InputNumberPassThroughAttributes | string) | string | null | undefined;
 
 /**
  * Custom passthrough(pt) option method.
  */
-export interface InputNumberPassThroughMethodOptions {
+export interface InputNumberPassThroughMethodOptions<T> {
     /**
      * Defines instance.
      */
@@ -32,12 +32,30 @@ export interface InputNumberPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: InputNumberState;
+    /**
+     * Defines parent instance.
+     */
+    parent: T;
     /**
      * Defines passthrough(pt) options in global config.
      */
     global: object | undefined;
 }
 
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface InputNumberSharedPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: InputNumberProps;
+    /**
+     * Defines current inline state.
+     */
+    state: InputNumberState;
+}
+
 /**
  * Custom input event.
  * @see {@link InputNumberEmits.input}
@@ -72,30 +90,30 @@ export interface InputNumberBlurEvent {
  * Custom passthrough(pt) options.
  * @see {@link InputNumberProps.pt}
  */
-export interface InputNumberPassThroughOptions {
+export interface InputNumberPassThroughOptions<T = any> {
     /**
      * Used to pass attributes to the root's DOM element.
      */
-    root?: InputNumberPassThroughOptionType;
+    root?: InputNumberPassThroughOptionType<T>;
     /**
-     * Used to pass attributes to the Input component.
-     * @see {@link InputTextPassThroughOptionType}
+     * Used to pass attributes to the InputText component.
+     * @see {@link InputTextPassThroughOptions}
      */
-    input?: InputTextPassThroughOptionType;
+    input?: InputTextPassThroughOptions<InputNumberSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the button group's DOM element.
      */
-    buttonGroup?: InputNumberPassThroughOptionType;
+    buttonGroup?: InputNumberPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the Button component.
      * @see {@link ButtonPassThroughOptions}
      */
-    incrementButton?: ButtonPassThroughOptionType;
+    incrementButton?: ButtonPassThroughOptions<InputNumberSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Button component.
      * @see {@link ButtonPassThroughOptions}
      */
-    decrementButton?: ButtonPassThroughOptionType;
+    decrementButton?: ButtonPassThroughOptions<InputNumberSharedPassThroughMethodOptions>;
     /**
      * Used to manage all lifecycle hooks.
      * @see {@link BaseComponent.ComponentHooks}
diff --git a/components/lib/inputtext/InputText.d.ts b/components/lib/inputtext/InputText.d.ts
index c51245881..bbd729cbf 100755
--- a/components/lib/inputtext/InputText.d.ts
+++ b/components/lib/inputtext/InputText.d.ts
@@ -12,12 +12,12 @@ import { ComponentHooks } from '../basecomponent';
 import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, Nullable, PassThrough } from '../ts-helpers';
 
-export declare type InputTextPassThroughOptionType = InputTextPassThroughAttributes | ((options: InputTextPassThroughMethodOptions) => InputTextPassThroughAttributes | string) | string | null | undefined;
+export declare type InputTextPassThroughOptionType<T = any> = InputTextPassThroughAttributes | ((options: InputTextPassThroughMethodOptions<T>) => InputTextPassThroughAttributes | string) | string | null | undefined;
 
 /**
  * Custom passthrough(pt) option method.
  */
-export interface InputTextPassThroughMethodOptions {
+export interface InputTextPassThroughMethodOptions<T = any> {
     /**
      * Defines instance.
      */
@@ -30,6 +30,10 @@ export interface InputTextPassThroughMethodOptions {
      * Defines current options.
      */
     context: InputTextContext;
+    /**
+     * Defines parent instance.
+     */
+    parent: T;
     /**
      * Defines passthrough(pt) options in global config.
      */
@@ -40,11 +44,11 @@ export interface InputTextPassThroughMethodOptions {
  * Custom passthrough(pt) options.
  * @see {@link InputTextProps.pt}
  */
-export interface InputTextPassThroughOptions {
+export interface InputTextPassThroughOptions<T = any> {
     /**
      * Used to pass attributes to the root's DOM element.
      */
-    root?: InputTextPassThroughOptionType;
+    root?: InputTextPassThroughOptionType<T>;
     /**
      * Used to manage all lifecycle hooks.
      * @see {@link BaseComponent.ComponentHooks}
diff --git a/components/lib/message/Message.d.ts b/components/lib/message/Message.d.ts
index a304216d4..52474fdff 100755
--- a/components/lib/message/Message.d.ts
+++ b/components/lib/message/Message.d.ts
@@ -12,14 +12,14 @@ import { ComponentHooks } from '../basecomponent';
 import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 
-export declare type MessagePassThroughOptionType = MessagePassThroughAttributes | ((options: MessagePassThroughMethodOptions) => MessagePassThroughAttributes | string) | string | null | undefined;
+export declare type MessagePassThroughOptionType<T = any> = MessagePassThroughAttributes | ((options: MessagePassThroughMethodOptions<T>) => MessagePassThroughAttributes | string) | string | null | undefined;
 
-export declare type MessagePassThroughTransitionType = TransitionProps | ((options: MessagePassThroughMethodOptions) => TransitionProps) | undefined;
+export declare type MessagePassThroughTransitionType<T = any> = TransitionProps | ((options: MessagePassThroughMethodOptions<T>) => TransitionProps) | undefined;
 
 /**
  * Custom passthrough(pt) option method.
  */
-export interface MessagePassThroughMethodOptions {
+export interface MessagePassThroughMethodOptions<T = any> {
     /**
      * Defines instance.
      */
@@ -32,6 +32,10 @@ export interface MessagePassThroughMethodOptions {
      * Defines current inline state.
      */
     state: MessageState;
+    /**
+     * Defines parent instance.
+     */
+    parent: T;
     /**
      * Defines passthrough(pt) options in global config.
      */
@@ -42,41 +46,41 @@ export interface MessagePassThroughMethodOptions {
  * Custom passthrough(pt) options.
  * @see {@link MessageProps.pt}
  */
-export interface MessagePassThroughOptions {
+export interface MessagePassThroughOptions<T = any> {
     /**
      * Used to pass attributes to the root's DOM element.
      */
-    root?: MessagePassThroughOptionType;
+    root?: MessagePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the wrapper's DOM element.
      */
-    wrapper?: MessagePassThroughOptionType;
+    wrapper?: MessagePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the icon's DOM element.
      */
-    icon?: MessagePassThroughOptionType;
+    icon?: MessagePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the text's DOM element.
      */
-    text?: MessagePassThroughOptionType;
+    text?: MessagePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the button's DOM element.
      * @deprecated since v3.30.2. Use 'closeButton' option.
      */
-    button?: MessagePassThroughOptionType;
+    button?: MessagePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the button's DOM element.
      */
-    closeButton?: MessagePassThroughOptionType;
+    closeButton?: MessagePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the button icon's DOM element.
      * @deprecated since v3.30.2. Use 'closeIcon' option.
      */
-    buttonIcon?: MessagePassThroughOptionType;
+    buttonIcon?: MessagePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the button icon's DOM element.
      */
-    closeIcon?: MessagePassThroughOptionType;
+    closeIcon?: MessagePassThroughOptionType<T>;
     /**
      * Used to manage all lifecycle hooks.
      * @see {@link BaseComponent.ComponentHooks}
@@ -85,7 +89,7 @@ export interface MessagePassThroughOptions {
     /**
      * Used to control Vue Transition API.
      */
-    transition?: MessagePassThroughTransitionType;
+    transition?: MessagePassThroughTransitionType<T>;
 }
 
 /**
diff --git a/components/lib/orderlist/OrderList.d.ts b/components/lib/orderlist/OrderList.d.ts
index e49eadc50..89d26b4c6 100755
--- a/components/lib/orderlist/OrderList.d.ts
+++ b/components/lib/orderlist/OrderList.d.ts
@@ -9,7 +9,7 @@
  */
 import { ButtonHTMLAttributes, HTMLAttributes, TransitionProps, VNode } from 'vue';
 import { ComponentHooks } from '../basecomponent';
-import { ButtonPassThroughOptionType } from '../button';
+import { ButtonPassThroughOptions } from '../button';
 import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 
@@ -43,6 +43,20 @@ export interface OrderListPassThroughMethodOptions {
     global: object | undefined;
 }
 
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface OrderListSharedPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: OrderListProps;
+    /**
+     * Defines current inline state.
+     */
+    state: OrderListState;
+}
+
 /**
  * Custom reorder event
  * @see {@link OrderListEmits.reorder}
@@ -93,19 +107,19 @@ export interface OrderListPassThroughOptions {
     /**
      * Used to pass attributes to the Button component.
      */
-    moveUpButton?: ButtonPassThroughOptionType;
+    moveUpButton?: ButtonPassThroughOptions<OrderListSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Button component.
      */
-    moveTopButton?: ButtonPassThroughOptionType;
+    moveTopButton?: ButtonPassThroughOptions<OrderListSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Button component.
      */
-    moveDownButton?: ButtonPassThroughOptionType;
+    moveDownButton?: ButtonPassThroughOptions<OrderListSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Button component.
      */
-    moveBottomButton?: ButtonPassThroughOptionType;
+    moveBottomButton?: ButtonPassThroughOptions<OrderListSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the container's DOM element.
      */
diff --git a/components/lib/paginator/Paginator.d.ts b/components/lib/paginator/Paginator.d.ts
index 584c37030..966a2b185 100755
--- a/components/lib/paginator/Paginator.d.ts
+++ b/components/lib/paginator/Paginator.d.ts
@@ -9,17 +9,17 @@
  */
 import { VNode } from 'vue';
 import { ComponentHooks } from '../basecomponent';
-import { DropdownPassThroughOptionType } from '../dropdown';
-import { InputNumberPassThroughOptionType } from '../inputnumber';
+import { DropdownPassThroughOptions } from '../dropdown';
+import { InputNumberPassThroughOptions } from '../inputnumber';
 import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 
-export declare type PaginatorPassThroughOptionType = PaginatorPassThroughAttributes | ((options: PaginatorPassThroughMethodOptions) => PaginatorPassThroughAttributes | string) | string | null | undefined;
+export declare type PaginatorPassThroughOptionType<T = any> = PaginatorPassThroughAttributes | ((options: PaginatorPassThroughMethodOptions<T>) => PaginatorPassThroughAttributes | string) | string | null | undefined;
 
 /**
  * Custom passthrough(pt) option method.
  */
-export interface PaginatorPassThroughMethodOptions {
+export interface PaginatorPassThroughMethodOptions<T> {
     /**
      * Defines instance.
      */
@@ -32,6 +32,10 @@ export interface PaginatorPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: PaginatorState;
+    /**
+     * Defines parent instance.
+     */
+    parent: T;
     /**
      * Defines current options.
      */
@@ -42,86 +46,100 @@ export interface PaginatorPassThroughMethodOptions {
     global: object | undefined;
 }
 
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface PaginatorSharedPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: PaginatorProps;
+    /**
+     * Defines current inline state.
+     */
+    state: PaginatorState;
+}
+
 /**
  * Custom passthrough(pt) options.
  * @see {@link PaginatorProps.pt}
  */
-export interface PaginatorPassThroughOptions {
+export interface PaginatorPassThroughOptions<T = any> {
     /**
      * Used to pass attributes to the paginator wrapper's DOM element.
      */
-    paginatorWrapper?: PaginatorPassThroughOptionType;
+    paginatorWrapper?: PaginatorPassThroughOptionType<T> | any;
     /**
      * Used to pass attributes to the root's DOM element.
      */
-    root?: PaginatorPassThroughOptionType;
+    root?: PaginatorPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the start's DOM element.
      */
-    start?: PaginatorPassThroughOptionType;
+    start?: PaginatorPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the first page button's DOM element.
      */
-    firstPageButton?: PaginatorPassThroughOptionType;
+    firstPageButton?: PaginatorPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the first page icon's DOM element.
      */
-    firstPageIcon?: PaginatorPassThroughOptionType;
+    firstPageIcon?: PaginatorPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the prev page button's DOM element.
      */
-    previousPageButton?: PaginatorPassThroughOptionType;
+    previousPageButton?: PaginatorPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the prev page icon's DOM element.
      */
-    previousPageIcon?: PaginatorPassThroughOptionType;
+    previousPageIcon?: PaginatorPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the next page button's DOM element.
      */
-    nextPageButton?: PaginatorPassThroughOptionType;
+    nextPageButton?: PaginatorPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the next page icon's DOM element.
      */
-    nextPageIcon?: PaginatorPassThroughOptionType;
+    nextPageIcon?: PaginatorPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the last page button's DOM element.
      */
-    lastPageButton?: PaginatorPassThroughOptionType;
+    lastPageButton?: PaginatorPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the last page icon's DOM element.
      */
-    lastPageIcon?: PaginatorPassThroughOptionType;
+    lastPageIcon?: PaginatorPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the pages's DOM element.
      */
-    pages?: PaginatorPassThroughOptionType;
+    pages?: PaginatorPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the page button's DOM element.
      */
-    pageButton?: PaginatorPassThroughOptionType;
+    pageButton?: PaginatorPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the current's DOM element.
      */
-    current?: PaginatorPassThroughOptionType;
+    current?: PaginatorPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the Dropdown component.
-     * @see {@link DropdownPassThroughOptionType}
+     * @see {@link DropdownPassThroughOptions}
      */
-    rowPerPageDropdown?: DropdownPassThroughOptionType;
+    rowPerPageDropdown?: DropdownPassThroughOptions<PaginatorSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Dropdown component.
-     * @see {@link DropdownPassThroughOptionType}
+     * @see {@link DropdownPassThroughOptions}
      */
-    jumpToPageDropdown?: DropdownPassThroughOptionType;
+    jumpToPageDropdown?: DropdownPassThroughOptions<PaginatorSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Dropdown component.
-     * @see {@link InputNumberPassThroughOptionType}
+     * @see {@link InputNumberPassThroughOptions}
      */
-    jumpToPageInput?: InputNumberPassThroughOptionType;
+    jumpToPageInput?: InputNumberPassThroughOptions<PaginatorSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the end's DOM element.
      */
-    end?: PaginatorPassThroughOptionType;
+    end?: PaginatorPassThroughOptionType<T>;
     /**
      * Used to manage all lifecycle hooks.
      * @see {@link BaseComponent.ComponentHooks}
diff --git a/components/lib/password/Password.d.ts b/components/lib/password/Password.d.ts
index 44e10c433..e40689ca7 100755
--- a/components/lib/password/Password.d.ts
+++ b/components/lib/password/Password.d.ts
@@ -9,7 +9,7 @@
  */
 import { HTMLAttributes, InputHTMLAttributes, TransitionProps, VNode } from 'vue';
 import { ComponentHooks } from '../basecomponent';
-import { InputTextPassThroughOptionType } from '../inputtext';
+import { InputTextPassThroughOptions } from '../inputtext';
 import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, Nullable, PassThrough } from '../ts-helpers';
 
@@ -39,6 +39,20 @@ export interface PasswordPassThroughMethodOptions {
     global: object | undefined;
 }
 
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface PasswordSharedPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: PasswordProps;
+    /**
+     * Defines current inline state.
+     */
+    state: PasswordState;
+}
+
 /**
  * Custom passthrough(pt) options.
  * @see {@link PasswordProps.pt}
@@ -50,9 +64,9 @@ export interface PasswordPassThroughOptions {
     root?: PasswordPassThroughOptionType;
     /**
      * Used to pass attributes to the InputText component.
-     * @see {@link InputTextPassThroughOptionType}
+     * @see {@link InputTextPassThroughOptions}
      */
-    input?: PasswordPassThroughOptionType;
+    input?: InputTextPassThroughOptions<PasswordSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the hide icon's DOM element.
      */
diff --git a/components/lib/picklist/PickList.d.ts b/components/lib/picklist/PickList.d.ts
index 687930770..d0f4ac77a 100755
--- a/components/lib/picklist/PickList.d.ts
+++ b/components/lib/picklist/PickList.d.ts
@@ -9,7 +9,7 @@
  */
 import { ButtonHTMLAttributes, HTMLAttributes, TransitionProps, VNode } from 'vue';
 import { ComponentHooks } from '../basecomponent';
-import { ButtonPassThroughOptionType } from '../button';
+import { ButtonPassThroughOptions } from '../button';
 import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 
@@ -43,6 +43,20 @@ export interface PickListPassThroughMethodOptions {
     global: object | undefined;
 }
 
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface PickListSharedPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: PickListProps;
+    /**
+     * Defines current inline state.
+     */
+    state: PickListState;
+}
+
 /**
  * Custom reorder event.
  * @see {@link PickListEmits.reorder}
@@ -133,19 +147,19 @@ export interface PickListPassThroughOptions {
     /**
      * Used to pass attributes to the Button component.
      */
-    sourceMoveUpButton?: ButtonPassThroughOptionType;
+    sourceMoveUpButton?: ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Button component.
      */
-    sourceMoveTopButton?: ButtonPassThroughOptionType;
+    sourceMoveTopButton?: ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Button component.
      */
-    sourceMoveDownButton?: ButtonPassThroughOptionType;
+    sourceMoveDownButton?: ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Button component.
      */
-    sourceMoveBottomButton?: ButtonPassThroughOptionType;
+    sourceMoveBottomButton?: ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the source wrapper's DOM element.
      */
@@ -165,19 +179,19 @@ export interface PickListPassThroughOptions {
     /**
      * Used to pass attributes to the Button component.
      */
-    moveToTargetButton?: ButtonPassThroughOptionType;
+    moveToTargetButton?: ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Button component.
      */
-    moveAllToTargetButton?: ButtonPassThroughOptionType;
+    moveAllToTargetButton?: ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Button component.
      */
-    moveToSourceButton?: ButtonPassThroughOptionType;
+    moveToSourceButton?: ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Button component.
      */
-    moveAllToSourceButton?: ButtonPassThroughOptionType;
+    moveAllToSourceButton?: ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the target wrapper's DOM element.
      */
@@ -201,19 +215,19 @@ export interface PickListPassThroughOptions {
     /**
      * Used to pass attributes to the Button component.
      */
-    targetMoveUpButton?: ButtonPassThroughOptionType;
+    targetMoveUpButton?: ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Button component.
      */
-    targetMoveTopButton?: ButtonPassThroughOptionType;
+    targetMoveTopButton?: ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Button component.
      */
-    targetMoveDownButton?: ButtonPassThroughOptionType;
+    targetMoveDownButton?: ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the Button component.
      */
-    targetMoveBottomButton?: ButtonPassThroughOptionType;
+    targetMoveBottomButton?: ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>;
     /**
      * Used to manage all lifecycle hooks.
      * @see {@link BaseComponent.ComponentHooks}
diff --git a/components/lib/progressbar/ProgressBar.d.ts b/components/lib/progressbar/ProgressBar.d.ts
index 26bb57454..9c72cd266 100755
--- a/components/lib/progressbar/ProgressBar.d.ts
+++ b/components/lib/progressbar/ProgressBar.d.ts
@@ -12,12 +12,12 @@ import { ComponentHooks } from '../basecomponent';
 import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 
-export declare type ProgressBarPassThroughOptionType = ProgressBarPassThroughAttributes | ((options: ProgressBarPassThroughMethodOptions) => ProgressBarPassThroughAttributes | string) | string | null | undefined;
+export declare type ProgressBarPassThroughOptionType<T = any> = ProgressBarPassThroughAttributes | ((options: ProgressBarPassThroughMethodOptions<T>) => ProgressBarPassThroughAttributes | string) | string | null | undefined;
 
 /**
  * Custom passthrough(pt) option method.
  */
-export interface ProgressBarPassThroughMethodOptions {
+export interface ProgressBarPassThroughMethodOptions<T> {
     /**
      * Defines instance.
      */
@@ -30,25 +30,29 @@ export interface ProgressBarPassThroughMethodOptions {
      * Defines passthrough(pt) options in global config.
      */
     global: object | undefined;
+    /**
+     * Defines parent instance.
+     */
+    parent: T;
 }
 
 /**
  * Custom passthrough(pt) options.
  * @see {@link ProgressBarProps.pt}
  */
-export interface ProgressBarPassThroughOptions {
+export interface ProgressBarPassThroughOptions<T = any> {
     /**
      * Used to pass attributes to the root's DOM element.
      */
-    root?: ProgressBarPassThroughOptionType;
+    root?: ProgressBarPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the value's DOM element.
      */
-    value?: ProgressBarPassThroughOptionType;
+    value?: ProgressBarPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the label's DOM element.
      */
-    label?: ProgressBarPassThroughOptionType;
+    label?: ProgressBarPassThroughOptionType<T>;
     /**
      * Used to manage all lifecycle hooks.
      * @see {@link BaseComponent.ComponentHooks}
diff --git a/components/lib/speeddial/SpeedDial.d.ts b/components/lib/speeddial/SpeedDial.d.ts
index e62b485ea..4b3058c62 100644
--- a/components/lib/speeddial/SpeedDial.d.ts
+++ b/components/lib/speeddial/SpeedDial.d.ts
@@ -42,6 +42,20 @@ export interface SpeedDialPassThroughMethodOptions {
     global: object | undefined;
 }
 
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface SpeedDialSharedPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: SpeedDialProps;
+    /**
+     * Defines current inline state.
+     */
+    state: SpeedDialState;
+}
+
 /**
  * Custom passthrough(pt) options.
  * @see {@link SpeedDialProps.pt}
@@ -55,7 +69,7 @@ export interface SpeedDialPassThroughOptions {
      * Used to pass attributes to the Button component.
      *  @see {@link ButtonPassThroughOptions}
      */
-    button?: ButtonPassThroughOptions;
+    button?: ButtonPassThroughOptions<SpeedDialSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the menu's DOM element.
      */
diff --git a/components/lib/splitbutton/SplitButton.d.ts b/components/lib/splitbutton/SplitButton.d.ts
index 8f36dde20..d6e11bc52 100755
--- a/components/lib/splitbutton/SplitButton.d.ts
+++ b/components/lib/splitbutton/SplitButton.d.ts
@@ -39,6 +39,20 @@ export interface SplitButtonPassThroughMethodOptions {
     global: object | undefined;
 }
 
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface SplitButtonSharedPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: SplitButtonProps;
+    /**
+     * Defines current inline state.
+     */
+    state: SplitButtonState;
+}
+
 /**
  * Custom passthrough(pt) options.
  * @see {@link SplitButtonProps.pt}
@@ -56,12 +70,12 @@ export interface SplitButtonPassThroughOptions {
      * Used to pass attributes to the Button component.
      * @see {@link ButtonPassThroughOptions}
      */
-    menuButton?: ButtonPassThroughOptions;
+    menuButton?: ButtonPassThroughOptions<SplitButtonSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the TieredMenu component.
      * @see {@link TieredMenuPassThroughOptions}
      */
-    menu?: TieredMenuPassThroughOptions;
+    menu?: TieredMenuPassThroughOptions<SplitButtonSharedPassThroughMethodOptions>;
     /**
      * Used to manage all lifecycle hooks.
      * @see {@link BaseComponent.ComponentHooks}
diff --git a/components/lib/tieredmenu/TieredMenu.d.ts b/components/lib/tieredmenu/TieredMenu.d.ts
index f48a55ac5..af09de81b 100755
--- a/components/lib/tieredmenu/TieredMenu.d.ts
+++ b/components/lib/tieredmenu/TieredMenu.d.ts
@@ -13,14 +13,14 @@ import { MenuItem } from '../menuitem';
 import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 
-export declare type TieredMenuPassThroughOptionType = TieredMenuPassThroughAttributes | ((options: TieredMenuPassThroughMethodOptions) => TieredMenuPassThroughAttributes | string) | string | null | undefined;
+export declare type TieredMenuPassThroughOptionType<T = any> = TieredMenuPassThroughAttributes | ((options: TieredMenuPassThroughMethodOptions<T>) => TieredMenuPassThroughAttributes | string) | string | null | undefined;
 
-export declare type TieredMenuPassThroughTransitionType = TransitionProps | ((options: TieredMenuPassThroughMethodOptions) => TransitionProps) | undefined;
+export declare type TieredMenuPassThroughTransitionType<T = any> = TransitionProps | ((options: TieredMenuPassThroughMethodOptions<T>) => TransitionProps) | undefined;
 
 /**
  * Custom passthrough(pt) option method.
  */
-export interface TieredMenuPassThroughMethodOptions {
+export interface TieredMenuPassThroughMethodOptions<T> {
     /**
      * Defines instance.
      */
@@ -33,6 +33,10 @@ export interface TieredMenuPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: TieredMenuState;
+    /**
+     * Defines parent instance.
+     */
+    parent: T;
     /**
      * Defines current options.
      */
@@ -47,47 +51,47 @@ export interface TieredMenuPassThroughMethodOptions {
  * Custom passthrough(pt) options.
  * @see {@link TieredMenuProps.pt}
  */
-export interface TieredMenuPassThroughOptions {
+export interface TieredMenuPassThroughOptions<T = any> {
     /**
      * Used to pass attributes to the root's DOM element.
      */
-    root?: TieredMenuPassThroughOptionType;
+    root?: TieredMenuPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the list's DOM element.
      */
-    menu?: TieredMenuPassThroughOptionType;
+    menu?: TieredMenuPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the list item's DOM element.
      */
-    menuitem?: TieredMenuPassThroughOptionType;
+    menuitem?: TieredMenuPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the content's DOM element.
      */
-    content?: TieredMenuPassThroughOptionType;
+    content?: TieredMenuPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the action's DOM element.
      */
-    action?: TieredMenuPassThroughOptionType;
+    action?: TieredMenuPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the icon's DOM element.
      */
-    icon?: TieredMenuPassThroughOptionType;
+    icon?: TieredMenuPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the label's DOM element.
      */
-    label?: TieredMenuPassThroughOptionType;
+    label?: TieredMenuPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the submenu icon's DOM element.
      */
-    submenuIcon?: TieredMenuPassThroughOptionType;
+    submenuIcon?: TieredMenuPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the separator's DOM element.
      */
-    separator?: TieredMenuPassThroughOptionType;
+    separator?: TieredMenuPassThroughOptionType<T>;
     /**
      * Used to pass attributes to the submenu's DOM element.
      */
-    submenu?: TieredMenuPassThroughOptionType;
+    submenu?: TieredMenuPassThroughOptionType<T>;
     /**
      * Used to manage all lifecycle hooks.
      * @see {@link BaseComponent.ComponentHooks}
diff --git a/components/lib/tree/Tree.d.ts b/components/lib/tree/Tree.d.ts
index d5162fe0f..41a46c852 100755
--- a/components/lib/tree/Tree.d.ts
+++ b/components/lib/tree/Tree.d.ts
@@ -13,12 +13,12 @@ import { PassThroughOptions } from '../passthrough';
 import { TreeNode } from '../treenode';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 
-export declare type TreePassThroughOptionType = TreePassThroughAttributes | ((options: TreePassThroughMethodOptions) => TreePassThroughAttributes | string) | string | null | undefined;
+export declare type TreePassThroughOptionType<T = any> = TreePassThroughAttributes | ((options: TreePassThroughMethodOptions<T>) => TreePassThroughAttributes | string) | string | null | undefined;
 
 /**
  * Custom passthrough(pt) option method.
  */
-export interface TreePassThroughMethodOptions {
+export interface TreePassThroughMethodOptions<T = any> {
     /**
      * Defines instance.
      */
@@ -31,6 +31,10 @@ export interface TreePassThroughMethodOptions {
      * Defines current inline state.
      */
     state: TreeState;
+    /**
+     * Defines parent instance.
+     */
+    parent: T;
     /**
      * Defines current options.
      */
@@ -80,79 +84,79 @@ export interface TreeFilterEvent {
  * Custom passthrough(pt) options.
  * @see {@link TreeProps.pt}
  */
-export interface TreePassThroughOptions {
+export interface TreePassThroughOptions<T = any> {
     /**
      * Used to pass attributes to the root's DOM element.
      */
-    root?: TreePassThroughOptionType;
+    root?: TreePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the filter container's DOM element.
      */
-    filterContainer?: TreePassThroughOptionType;
+    filterContainer?: TreePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the input's DOM element.
      */
-    input?: TreePassThroughOptionType;
+    input?: TreePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the search icon's DOM element.
      */
-    searchIcon?: TreePassThroughOptionType;
+    searchIcon?: TreePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the wrapper's DOM element.
      */
-    wrapper?: TreePassThroughOptionType;
+    wrapper?: TreePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the container's DOM element.
      */
-    container?: TreePassThroughOptionType;
+    container?: TreePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the node's DOM element.
      */
-    node?: TreePassThroughOptionType;
+    node?: TreePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the content's DOM element.
      */
-    content?: TreePassThroughOptionType;
+    content?: TreePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the toggler's DOM element.
      */
-    toggler?: TreePassThroughOptionType;
+    toggler?: TreePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the toggler icon's DOM element.
      */
-    togglerIcon?: TreePassThroughOptionType;
+    togglerIcon?: TreePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the checkbox container's DOM element.
      */
-    checkboxContainer?: TreePassThroughOptionType;
+    checkboxContainer?: TreePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the checkbox's DOM element.
      */
-    checkbox?: TreePassThroughOptionType;
+    checkbox?: TreePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the checkbox icon's DOM element.
      */
-    checkboxIcon?: TreePassThroughOptionType;
+    checkboxIcon?: TreePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the node icon's DOM element.
      */
-    nodeIcon?: TreePassThroughOptionType;
+    nodeIcon?: TreePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the label's DOM element.
      */
-    label?: TreePassThroughOptionType;
+    label?: TreePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the subgroup's DOM element.
      */
-    subgroup?: TreePassThroughOptionType;
+    subgroup?: TreePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the loading overlay's DOM element.
      */
-    loadingOverlay?: TreePassThroughOptionType;
+    loadingOverlay?: TreePassThroughOptionType<T>;
     /**
      * Used to pass attributes to the loading icon's DOM element.
      */
-    loadingIcon?: TreePassThroughOptionType;
+    loadingIcon?: TreePassThroughOptionType<T>;
     /**
      * Used to manage all lifecycle hooks.
      * @see {@link BaseComponent.ComponentHooks}
diff --git a/components/lib/treeselect/TreeSelect.d.ts b/components/lib/treeselect/TreeSelect.d.ts
index 91a427a63..b9069b70c 100644
--- a/components/lib/treeselect/TreeSelect.d.ts
+++ b/components/lib/treeselect/TreeSelect.d.ts
@@ -40,6 +40,20 @@ export interface TreeSelectPassThroughMethodOptions {
     global: object | undefined;
 }
 
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface TreeSelectSharedPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: TreeSelectProps;
+    /**
+     * Defines current inline state.
+     */
+    state: TreeSelectState;
+}
+
 /**
  * Custom passthrough(pt) options.
  * @see {@link TreeSelectProps.pt}
@@ -85,7 +99,7 @@ export interface TreeSelectPassThroughOptions {
      * Used to pass attributes to Tree component.
      * @see {@link TreePassThroughOptionType}
      */
-    tree?: TreePassThroughOptionType;
+    tree?: TreePassThroughOptionType<TreeSelectSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the empty message's DOM element.
      */
diff --git a/components/lib/treetable/TreeTable.d.ts b/components/lib/treetable/TreeTable.d.ts
index c0cafe1fd..46f0075e5 100755
--- a/components/lib/treetable/TreeTable.d.ts
+++ b/components/lib/treetable/TreeTable.d.ts
@@ -43,6 +43,20 @@ export interface TreeTablePassThroughMethodOptions {
     global: object | undefined;
 }
 
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface TreeTableSharedPassThroughMethodOptions {
+    /**
+     * Defines valid properties.
+     */
+    props: TreeTableProps;
+    /**
+     * Defines current inline state.
+     */
+    state: TreeTableState;
+}
+
 /**
  * Custom treetable filter metadata.
  */
@@ -214,7 +228,7 @@ export interface TreeTablePassThroughOptions {
      * Used to pass attributes to the Paginator component.
      * @see {@link PaginatorPassThroughOptionType}
      */
-    paginator?: PaginatorPassThroughOptionType;
+    paginator?: PaginatorPassThroughOptionType<TreeTableSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the wrapper's DOM element.
      */
diff --git a/doc/common/apidoc/index.json b/doc/common/apidoc/index.json
index 3e6917ead..91c163da9 100644
--- a/doc/common/apidoc/index.json
+++ b/doc/common/apidoc/index.json
@@ -3077,6 +3077,29 @@
                     ],
                     "methods": []
                 },
+                "AutoCompleteSharedPassThroughMethodOptions": {
+                    "description": "Custom shared passthrough(pt) option method.",
+                    "relatedProp": "",
+                    "props": [
+                        {
+                            "name": "props",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "AutoCompleteProps",
+                            "default": "",
+                            "description": "Defines valid properties."
+                        },
+                        {
+                            "name": "state",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "AutoCompleteState",
+                            "default": "",
+                            "description": "Defines current inline state."
+                        }
+                    ],
+                    "methods": []
+                },
                 "AutoCompleteChangeEvent": {
                     "description": "Custom change event.",
                     "relatedProp": "AutoCompleteEmits.change",
@@ -3266,7 +3289,7 @@
                             "name": "dropdownButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<AutoCompleteSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -4722,6 +4745,14 @@
                             "type": "undefined | object",
                             "default": "",
                             "description": "Defines passthrough(pt) options in global config."
+                        },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "T",
+                            "default": "",
+                            "description": "Defines parent instance."
                         }
                     ],
                     "methods": []
@@ -4747,7 +4778,7 @@
                             "name": "root",
                             "optional": true,
                             "readonly": false,
-                            "type": "BadgePassThroughOptionType",
+                            "type": "BadgePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the root's DOM element."
                         },
@@ -4794,7 +4825,7 @@
                             "name": "pt",
                             "optional": true,
                             "readonly": false,
-                            "type": "PassThrough<BadgePassThroughOptions>",
+                            "type": "PassThrough<BadgePassThroughOptions<any>>",
                             "default": "",
                             "description": "Used to pass attributes to DOM elements inside the component."
                         },
@@ -6356,7 +6387,7 @@
                             "name": "parent",
                             "optional": false,
                             "readonly": false,
-                            "type": "any",
+                            "type": "T",
                             "default": "",
                             "description": "Defines parent instance."
                         },
@@ -6379,7 +6410,7 @@
                             "name": "root",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the root's DOM element."
                         },
@@ -6387,7 +6418,7 @@
                             "name": "loadingIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the loading icon's DOM element."
                         },
@@ -6395,7 +6426,7 @@
                             "name": "icon",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the icon's DOM element."
                         },
@@ -6403,7 +6434,7 @@
                             "name": "label",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the label's DOM element."
                         },
@@ -6411,7 +6442,7 @@
                             "name": "badge",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the badge's DOM element."
                         },
@@ -6599,7 +6630,7 @@
                             "name": "pt",
                             "optional": true,
                             "readonly": false,
-                            "type": "PassThrough<ButtonPassThroughOptions>",
+                            "type": "PassThrough<ButtonPassThroughOptions<any>>",
                             "default": "",
                             "description": "Used to pass attributes to DOM elements inside the component."
                         },
@@ -6817,6 +6848,29 @@
                     ],
                     "methods": []
                 },
+                "CalendarSharedPassThroughMethodOptions": {
+                    "description": "Custom shared passthrough(pt) option method.",
+                    "relatedProp": "",
+                    "props": [
+                        {
+                            "name": "props",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "CalendarProps",
+                            "default": "",
+                            "description": "Defines valid properties."
+                        },
+                        {
+                            "name": "state",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "CalendarState",
+                            "default": "",
+                            "description": "Defines current inline state."
+                        }
+                    ],
+                    "methods": []
+                },
                 "CalendarResponsiveOptions": {
                     "description": "Custom Calendar responsive options metadata.",
                     "relatedProp": "",
@@ -6933,7 +6987,7 @@
                             "name": "dropdownButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<CalendarSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -6973,7 +7027,7 @@
                             "name": "previousButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<CalendarSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -7013,7 +7067,7 @@
                             "name": "nextButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<CalendarSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -7269,7 +7323,7 @@
                             "name": "todayButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<CalendarSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -7277,7 +7331,7 @@
                             "name": "clearButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<CalendarSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -12339,6 +12393,29 @@
                     ],
                     "methods": []
                 },
+                "ColumnSharedPassThroughMethodOptions": {
+                    "description": "Custom shared passthrough(pt) option method.",
+                    "relatedProp": "",
+                    "props": [
+                        {
+                            "name": "props",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "ColumnProps",
+                            "default": "",
+                            "description": "Defines valid properties."
+                        },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "DataTablePassThroughOptions",
+                            "default": "",
+                            "description": "Defines parent instance."
+                        }
+                    ],
+                    "methods": []
+                },
                 "ColumnFilterModelType": {
                     "description": "Filter model metadata.",
                     "relatedProp": "",
@@ -12663,7 +12740,7 @@
                             "name": "filterOperatorDropdown",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<ColumnSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Dropdown component."
                         },
@@ -12687,7 +12764,7 @@
                             "name": "filterMatchModeDropdown",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<ColumnSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Dropdown component."
                         },
@@ -12703,7 +12780,7 @@
                             "name": "filterRemoveButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<ColumnSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -12719,7 +12796,7 @@
                             "name": "filterAddRuleButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<ColumnSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -12735,7 +12812,7 @@
                             "name": "filterClearButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<ColumnSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -12743,7 +12820,7 @@
                             "name": "filterApplyButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<ColumnSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -14254,7 +14331,7 @@
                             "name": "badge",
                             "optional": true,
                             "readonly": false,
-                            "type": "DefaultPassThrough<BadgePassThroughOptions>",
+                            "type": "DefaultPassThrough<BadgePassThroughOptions<any>>",
                             "default": ""
                         },
                         {
@@ -14275,7 +14352,7 @@
                             "name": "button",
                             "optional": true,
                             "readonly": false,
-                            "type": "DefaultPassThrough<ButtonPassThroughOptions>",
+                            "type": "DefaultPassThrough<ButtonPassThroughOptions<any>>",
                             "default": ""
                         },
                         {
@@ -14415,7 +14492,7 @@
                             "name": "dialog",
                             "optional": true,
                             "readonly": false,
-                            "type": "DefaultPassThrough<DialogPassThroughOptions>",
+                            "type": "DefaultPassThrough<DialogPassThroughOptions<any>>",
                             "default": ""
                         },
                         {
@@ -14429,14 +14506,14 @@
                             "name": "dropdown",
                             "optional": true,
                             "readonly": false,
-                            "type": "DefaultPassThrough<DropdownPassThroughOptions>",
+                            "type": "DefaultPassThrough<DropdownPassThroughOptions<any>>",
                             "default": ""
                         },
                         {
                             "name": "dynamicdialog",
                             "optional": true,
                             "readonly": false,
-                            "type": "DefaultPassThrough<DialogPassThroughOptions>",
+                            "type": "DefaultPassThrough<DialogPassThroughOptions<any>>",
                             "default": ""
                         },
                         {
@@ -14499,7 +14576,7 @@
                             "name": "inputnumber",
                             "optional": true,
                             "readonly": false,
-                            "type": "DefaultPassThrough<InputNumberPassThroughOptions>",
+                            "type": "DefaultPassThrough<InputNumberPassThroughOptions<any>>",
                             "default": ""
                         },
                         {
@@ -14513,7 +14590,7 @@
                             "name": "inputtext",
                             "optional": true,
                             "readonly": false,
-                            "type": "DefaultPassThrough<InputTextPassThroughOptions>",
+                            "type": "DefaultPassThrough<InputTextPassThroughOptions<any>>",
                             "default": ""
                         },
                         {
@@ -14555,7 +14632,7 @@
                             "name": "message",
                             "optional": true,
                             "readonly": false,
-                            "type": "DefaultPassThrough<MessagePassThroughOptions>",
+                            "type": "DefaultPassThrough<MessagePassThroughOptions<any>>",
                             "default": ""
                         },
                         {
@@ -14590,7 +14667,7 @@
                             "name": "paginator",
                             "optional": true,
                             "readonly": false,
-                            "type": "DefaultPassThrough<PaginatorPassThroughOptions>",
+                            "type": "DefaultPassThrough<PaginatorPassThroughOptions<any>>",
                             "default": ""
                         },
                         {
@@ -14625,7 +14702,7 @@
                             "name": "progressbar",
                             "optional": true,
                             "readonly": false,
-                            "type": "DefaultPassThrough<ProgressBarPassThroughOptions>",
+                            "type": "DefaultPassThrough<ProgressBarPassThroughOptions<any>>",
                             "default": ""
                         },
                         {
@@ -14779,7 +14856,7 @@
                             "name": "tieredmenu",
                             "optional": true,
                             "readonly": false,
-                            "type": "DefaultPassThrough<TieredMenuPassThroughOptions>",
+                            "type": "DefaultPassThrough<TieredMenuPassThroughOptions<any>>",
                             "default": ""
                         },
                         {
@@ -14814,7 +14891,7 @@
                             "name": "tree",
                             "optional": true,
                             "readonly": false,
-                            "type": "DefaultPassThrough<TreePassThroughOptions>",
+                            "type": "DefaultPassThrough<TreePassThroughOptions<any>>",
                             "default": ""
                         },
                         {
@@ -15940,6 +16017,29 @@
                     ],
                     "methods": []
                 },
+                "ConfirmDialogSharedPassThroughMethodOptions": {
+                    "description": "Custom shared passthrough(pt) option method.",
+                    "relatedProp": "",
+                    "props": [
+                        {
+                            "name": "props",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "ConfirmDialogProps",
+                            "default": "",
+                            "description": "Defines valid properties."
+                        },
+                        {
+                            "name": "state",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "ConfirmDialogState",
+                            "default": "",
+                            "description": "Defines current inline state."
+                        }
+                    ],
+                    "methods": []
+                },
                 "ConfirmDialogPassThroughOptions": {
                     "description": "Custom passthrough(pt) options.",
                     "relatedProp": "ConfirmDialogProps.pt",
@@ -16028,7 +16128,7 @@
                             "name": "rejectButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptions",
+                            "type": "ButtonPassThroughOptions<ConfirmDialogSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -16036,7 +16136,7 @@
                             "name": "acceptButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptions",
+                            "type": "ButtonPassThroughOptions<ConfirmDialogSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -16345,6 +16445,29 @@
                     ],
                     "methods": []
                 },
+                "ConfirmPopupSharedPassThroughMethodOptions": {
+                    "description": "Custom shared passthrough(pt) option method.",
+                    "relatedProp": "",
+                    "props": [
+                        {
+                            "name": "props",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "ConfirmPopupProps",
+                            "default": "",
+                            "description": "Defines valid properties."
+                        },
+                        {
+                            "name": "state",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "ConfirmPopupState",
+                            "default": "",
+                            "description": "Defines current inline state."
+                        }
+                    ],
+                    "methods": []
+                },
                 "ConfirmPopupPassThroughOptions": {
                     "description": "Custom passthrough(pt) options.",
                     "relatedProp": "ConfirmPopupProps.pt",
@@ -16393,7 +16516,7 @@
                             "name": "rejectButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptions",
+                            "type": "ButtonPassThroughOptions<ConfirmPopupSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -16401,7 +16524,7 @@
                             "name": "acceptButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptions",
+                            "type": "ButtonPassThroughOptions<ConfirmPopupSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -17381,6 +17504,29 @@
                     ],
                     "methods": []
                 },
+                "DataTableSharedPassThroughMethodOptions": {
+                    "description": "Custom shared passthrough(pt) option method.",
+                    "relatedProp": "",
+                    "props": [
+                        {
+                            "name": "props",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "DataTableProps",
+                            "default": "",
+                            "description": "Defines valid properties."
+                        },
+                        {
+                            "name": "state",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "DataTableState",
+                            "default": "",
+                            "description": "Defines current inline state."
+                        }
+                    ],
+                    "methods": []
+                },
                 "DataTableExportFunctionOptions": {
                     "description": "Custom datatable export metadata.",
                     "relatedProp": "",
@@ -18591,7 +18737,7 @@
                             "name": "paginator",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "PaginatorPassThroughOptionType<DataTableSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Paginator component."
                         },
@@ -20344,6 +20490,29 @@
                     ],
                     "methods": []
                 },
+                "DataViewSharedPassThroughMethodOptions": {
+                    "description": "Custom shared passthrough(pt) option method.",
+                    "relatedProp": "",
+                    "props": [
+                        {
+                            "name": "props",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "DataViewProps",
+                            "default": "",
+                            "description": "Defines valid properties."
+                        },
+                        {
+                            "name": "state",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "DataViewState",
+                            "default": "",
+                            "description": "Defines current inline state."
+                        }
+                    ],
+                    "methods": []
+                },
                 "DataViewPageEvent": {
                     "description": "Custom page event.",
                     "relatedProp": "DataViewEmits.page",
@@ -20407,7 +20576,7 @@
                             "name": "paginator",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "PaginatorPassThroughOptionType<DataViewSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Paginator component."
                         },
@@ -21401,6 +21570,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "T",
+                            "default": "",
+                            "description": "Defines parent instance."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -21420,7 +21597,7 @@
                             "name": "root",
                             "optional": true,
                             "readonly": false,
-                            "type": "DialogPassThroughOptionType",
+                            "type": "DialogPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the root's DOM element."
                         },
@@ -21428,7 +21605,7 @@
                             "name": "header",
                             "optional": true,
                             "readonly": false,
-                            "type": "DialogPassThroughOptionType",
+                            "type": "DialogPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the header's DOM element."
                         },
@@ -21436,7 +21613,7 @@
                             "name": "title",
                             "optional": true,
                             "readonly": false,
-                            "type": "DialogPassThroughOptionType",
+                            "type": "DialogPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the header title's DOM element."
                         },
@@ -21444,7 +21621,7 @@
                             "name": "icons",
                             "optional": true,
                             "readonly": false,
-                            "type": "DialogPassThroughOptionType",
+                            "type": "DialogPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the header icons' DOM element."
                         },
@@ -21452,7 +21629,7 @@
                             "name": "maximizableButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "DialogPassThroughOptionType",
+                            "type": "DialogPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the maximizable button's DOM element."
                         },
@@ -21460,7 +21637,7 @@
                             "name": "maximizableIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "DialogPassThroughOptionType",
+                            "type": "DialogPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the maximizable icon's DOM element."
                         },
@@ -21468,7 +21645,7 @@
                             "name": "closeButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "DialogPassThroughOptionType",
+                            "type": "DialogPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the close button's component."
                         },
@@ -21476,7 +21653,7 @@
                             "name": "closeButtonIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "DialogPassThroughOptionType",
+                            "type": "DialogPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the close button icon's component."
                         },
@@ -21484,7 +21661,7 @@
                             "name": "content",
                             "optional": true,
                             "readonly": false,
-                            "type": "DialogPassThroughOptionType",
+                            "type": "DialogPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the content's DOM element."
                         },
@@ -21492,7 +21669,7 @@
                             "name": "footer",
                             "optional": true,
                             "readonly": false,
-                            "type": "DialogPassThroughOptionType",
+                            "type": "DialogPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the footer's DOM element."
                         },
@@ -21500,7 +21677,7 @@
                             "name": "mask",
                             "optional": true,
                             "readonly": false,
-                            "type": "DialogPassThroughOptionType",
+                            "type": "DialogPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the mask's DOM element."
                         },
@@ -21516,7 +21693,7 @@
                             "name": "transition",
                             "optional": true,
                             "readonly": false,
-                            "type": "DialogPassThroughTransitionType",
+                            "type": "DialogPassThroughTransitionType<T>",
                             "default": "",
                             "description": "Used to control Vue Transition API."
                         }
@@ -21799,7 +21976,7 @@
                             "name": "pt",
                             "optional": true,
                             "readonly": false,
-                            "type": "PassThrough<DialogPassThroughOptions>",
+                            "type": "PassThrough<DialogPassThroughOptions<any>>",
                             "default": "",
                             "description": "Used to pass attributes to DOM elements inside the component."
                         },
@@ -22878,6 +23055,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent instance."
+                        },
                         {
                             "name": "context",
                             "optional": false,
@@ -22951,7 +23136,7 @@
                             "name": "root",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the root's DOM element."
                         },
@@ -22959,7 +23144,7 @@
                             "name": "input",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the input's DOM element."
                         },
@@ -22967,7 +23152,7 @@
                             "name": "clearIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the clear icon's DOM element."
                         },
@@ -22975,7 +23160,7 @@
                             "name": "trigger",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the trigger' DOM element."
                         },
@@ -22983,7 +23168,7 @@
                             "name": "loadingIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the loading icon's DOM element."
                         },
@@ -22991,7 +23176,7 @@
                             "name": "panel",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the panel's DOM element."
                         },
@@ -22999,7 +23184,7 @@
                             "name": "header",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the header's DOM element."
                         },
@@ -23007,7 +23192,7 @@
                             "name": "filterContainer",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the filter container's DOM element."
                         },
@@ -23015,7 +23200,7 @@
                             "name": "filterInput",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the filter input's DOM element."
                         },
@@ -23023,7 +23208,7 @@
                             "name": "filterIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the filter icon's DOM element."
                         },
@@ -23031,7 +23216,7 @@
                             "name": "wrapper",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the wrapper's DOM element."
                         },
@@ -23047,7 +23232,7 @@
                             "name": "list",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the list's DOM element."
                         },
@@ -23055,7 +23240,7 @@
                             "name": "itemGroup",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the item group's DOM element."
                         },
@@ -23063,7 +23248,7 @@
                             "name": "item",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the item's DOM element."
                         },
@@ -23071,7 +23256,7 @@
                             "name": "emptyMessage",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the empty message's DOM element."
                         },
@@ -23079,7 +23264,7 @@
                             "name": "hiddenFirstFocusableEl",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the hidden first focusable element's DOM element."
                         },
@@ -23087,7 +23272,7 @@
                             "name": "hiddenFilterResult",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the hidden filter result's DOM element."
                         },
@@ -23095,7 +23280,7 @@
                             "name": "hiddenEmptyMessage",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the hidden empty message's DOM element."
                         },
@@ -23103,7 +23288,7 @@
                             "name": "hiddenSelectedMessage",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the hidden selected message's DOM element."
                         },
@@ -23111,7 +23296,7 @@
                             "name": "hiddenLastFocusableEl",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the hidden last focusable element's DOM element."
                         },
@@ -23127,7 +23312,7 @@
                             "name": "transition",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughTransitionType",
+                            "type": "DropdownPassThroughTransitionType<any>",
                             "default": "",
                             "description": "Used to control Vue Transition API."
                         }
@@ -23606,7 +23791,7 @@
                             "name": "pt",
                             "optional": true,
                             "readonly": false,
-                            "type": "PassThrough<DropdownPassThroughOptions>",
+                            "type": "PassThrough<DropdownPassThroughOptions<any>>",
                             "default": "",
                             "description": "Used to pass attributes to DOM elements inside the component."
                         },
@@ -25487,7 +25672,7 @@
                             "name": "uploadButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptions",
+                            "type": "ButtonPassThroughOptions<FileUploadPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the upload button's DOM element."
                         },
@@ -25495,7 +25680,7 @@
                             "name": "cancelButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptions",
+                            "type": "ButtonPassThroughOptions<FileUploadPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the cancel button's DOM element."
                         },
@@ -25519,7 +25704,7 @@
                             "name": "message",
                             "optional": true,
                             "readonly": false,
-                            "type": "MessagePassThroughOptions",
+                            "type": "MessagePassThroughOptions<FileUploadPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the messages' DOM element."
                         },
@@ -25567,9 +25752,9 @@
                             "name": "badge",
                             "optional": true,
                             "readonly": false,
-                            "type": "FileUploadPassThroughOptionType",
+                            "type": "BadgePassThroughOptions<FileUploadPassThroughMethodOptions>",
                             "default": "",
-                            "description": "Used to pass attributes to the badge's DOM element."
+                            "description": "Used to pass attributes to the Badge component."
                         },
                         {
                             "name": "actions",
@@ -25583,7 +25768,7 @@
                             "name": "removeButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptions",
+                            "type": "ButtonPassThroughOptions<FileUploadPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the remove button's DOM element."
                         },
@@ -28223,6 +28408,29 @@
                     ],
                     "methods": []
                 },
+                "InplaceSharedPassThroughMethodOptions": {
+                    "description": "Custom shared passthrough(pt) option method.",
+                    "relatedProp": "",
+                    "props": [
+                        {
+                            "name": "props",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "InplaceProps",
+                            "default": "",
+                            "description": "Defines valid properties."
+                        },
+                        {
+                            "name": "state",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "InplaceState",
+                            "default": "",
+                            "description": "Defines current inline state."
+                        }
+                    ],
+                    "methods": []
+                },
                 "InplacePassThroughOptions": {
                     "description": "Custom passthrough(pt) options.",
                     "relatedProp": "InplaceProps.pt",
@@ -28255,7 +28463,7 @@
                             "name": "closeButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptions",
+                            "type": "ButtonPassThroughOptions<InplaceSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -29318,6 +29526,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "T",
+                            "default": "",
+                            "description": "Defines parent instance."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -29329,6 +29545,29 @@
                     ],
                     "methods": []
                 },
+                "InputNumberSharedPassThroughMethodOptions": {
+                    "description": "Custom shared passthrough(pt) option method.",
+                    "relatedProp": "",
+                    "props": [
+                        {
+                            "name": "props",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "InputNumberProps",
+                            "default": "",
+                            "description": "Defines valid properties."
+                        },
+                        {
+                            "name": "state",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "InputNumberState",
+                            "default": "",
+                            "description": "Defines current inline state."
+                        }
+                    ],
+                    "methods": []
+                },
                 "InputNumberInputEvent": {
                     "description": "Custom input event.",
                     "relatedProp": "InputNumberEmits.input",
@@ -29383,7 +29622,7 @@
                             "name": "root",
                             "optional": true,
                             "readonly": false,
-                            "type": "InputNumberPassThroughOptionType",
+                            "type": "InputNumberPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the root's DOM element."
                         },
@@ -29391,15 +29630,15 @@
                             "name": "input",
                             "optional": true,
                             "readonly": false,
-                            "type": "InputTextPassThroughOptionType",
+                            "type": "InputTextPassThroughOptions<InputNumberSharedPassThroughMethodOptions>",
                             "default": "",
-                            "description": "Used to pass attributes to the Input component."
+                            "description": "Used to pass attributes to the InputText component."
                         },
                         {
                             "name": "buttonGroup",
                             "optional": true,
                             "readonly": false,
-                            "type": "InputNumberPassThroughOptionType",
+                            "type": "InputNumberPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the button group's DOM element."
                         },
@@ -29407,7 +29646,7 @@
                             "name": "incrementButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<InputNumberSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -29415,7 +29654,7 @@
                             "name": "decrementButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<InputNumberSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -29748,7 +29987,7 @@
                             "name": "pt",
                             "optional": true,
                             "readonly": false,
-                            "type": "PassThrough<InputNumberPassThroughOptions>",
+                            "type": "PassThrough<InputNumberPassThroughOptions<any>>",
                             "default": "",
                             "description": "Used to pass attributes to DOM elements inside the component."
                         },
@@ -30340,6 +30579,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "T",
+                            "default": "",
+                            "description": "Defines parent instance."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -30359,7 +30606,7 @@
                             "name": "root",
                             "optional": true,
                             "readonly": false,
-                            "type": "InputTextPassThroughOptionType",
+                            "type": "InputTextPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the root's DOM element."
                         },
@@ -30434,7 +30681,7 @@
                             "name": "pt",
                             "optional": true,
                             "readonly": false,
-                            "type": "PassThrough<InputTextPassThroughOptions>",
+                            "type": "PassThrough<InputTextPassThroughOptions<any>>",
                             "default": "",
                             "description": "Used to pass attributes to DOM elements inside the component."
                         },
@@ -33929,6 +34176,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "T",
+                            "default": "",
+                            "description": "Defines parent instance."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -33948,7 +34203,7 @@
                             "name": "root",
                             "optional": true,
                             "readonly": false,
-                            "type": "MessagePassThroughOptionType",
+                            "type": "MessagePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the root's DOM element."
                         },
@@ -33956,7 +34211,7 @@
                             "name": "wrapper",
                             "optional": true,
                             "readonly": false,
-                            "type": "MessagePassThroughOptionType",
+                            "type": "MessagePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the wrapper's DOM element."
                         },
@@ -33964,7 +34219,7 @@
                             "name": "icon",
                             "optional": true,
                             "readonly": false,
-                            "type": "MessagePassThroughOptionType",
+                            "type": "MessagePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the icon's DOM element."
                         },
@@ -33972,7 +34227,7 @@
                             "name": "text",
                             "optional": true,
                             "readonly": false,
-                            "type": "MessagePassThroughOptionType",
+                            "type": "MessagePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the text's DOM element."
                         },
@@ -33980,7 +34235,7 @@
                             "name": "button",
                             "optional": true,
                             "readonly": false,
-                            "type": "MessagePassThroughOptionType",
+                            "type": "MessagePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the button's DOM element.",
                             "deprecated": "since v3.30.2. Use 'closeButton' option."
@@ -33989,7 +34244,7 @@
                             "name": "closeButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "MessagePassThroughOptionType",
+                            "type": "MessagePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the button's DOM element."
                         },
@@ -33997,7 +34252,7 @@
                             "name": "buttonIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "MessagePassThroughOptionType",
+                            "type": "MessagePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the button icon's DOM element.",
                             "deprecated": "since v3.30.2. Use 'closeIcon' option."
@@ -34006,7 +34261,7 @@
                             "name": "closeIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "MessagePassThroughOptionType",
+                            "type": "MessagePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the button icon's DOM element."
                         },
@@ -34022,7 +34277,7 @@
                             "name": "transition",
                             "optional": true,
                             "readonly": false,
-                            "type": "MessagePassThroughTransitionType",
+                            "type": "MessagePassThroughTransitionType<T>",
                             "default": "",
                             "description": "Used to control Vue Transition API."
                         }
@@ -34122,7 +34377,7 @@
                             "name": "pt",
                             "optional": true,
                             "readonly": false,
-                            "type": "PassThrough<MessagePassThroughOptions>",
+                            "type": "PassThrough<MessagePassThroughOptions<any>>",
                             "default": "",
                             "description": "Used to pass attributes to DOM elements inside the component."
                         },
@@ -35730,6 +35985,29 @@
                     ],
                     "methods": []
                 },
+                "OrderListSharedPassThroughMethodOptions": {
+                    "description": "Custom shared passthrough(pt) option method.",
+                    "relatedProp": "",
+                    "props": [
+                        {
+                            "name": "props",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "OrderListProps",
+                            "default": "",
+                            "description": "Defines valid properties."
+                        },
+                        {
+                            "name": "state",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "OrderListState",
+                            "default": "",
+                            "description": "Defines current inline state."
+                        }
+                    ],
+                    "methods": []
+                },
                 "OrderListReorderEvent": {
                     "description": "Custom reorder event",
                     "relatedProp": "OrderListEmits.reorder",
@@ -35808,7 +36086,7 @@
                             "name": "moveUpButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<OrderListSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -35816,7 +36094,7 @@
                             "name": "moveTopButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<OrderListSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -35824,7 +36102,7 @@
                             "name": "moveDownButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<OrderListSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -35832,7 +36110,7 @@
                             "name": "moveBottomButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<OrderListSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -37397,6 +37675,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "T",
+                            "default": "",
+                            "description": "Defines parent instance."
+                        },
                         {
                             "name": "context",
                             "optional": false,
@@ -37416,6 +37702,29 @@
                     ],
                     "methods": []
                 },
+                "PaginatorSharedPassThroughMethodOptions": {
+                    "description": "Custom shared passthrough(pt) option method.",
+                    "relatedProp": "",
+                    "props": [
+                        {
+                            "name": "props",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "PaginatorProps",
+                            "default": "",
+                            "description": "Defines valid properties."
+                        },
+                        {
+                            "name": "state",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "PaginatorState",
+                            "default": "",
+                            "description": "Defines current inline state."
+                        }
+                    ],
+                    "methods": []
+                },
                 "PaginatorPassThroughOptions": {
                     "description": "Custom passthrough(pt) options.",
                     "relatedProp": "PaginatorProps.pt",
@@ -37424,7 +37733,7 @@
                             "name": "paginatorWrapper",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "any",
                             "default": "",
                             "description": "Used to pass attributes to the paginator wrapper's DOM element."
                         },
@@ -37432,7 +37741,7 @@
                             "name": "root",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "PaginatorPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the root's DOM element."
                         },
@@ -37440,7 +37749,7 @@
                             "name": "start",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "PaginatorPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the start's DOM element."
                         },
@@ -37448,7 +37757,7 @@
                             "name": "firstPageButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "PaginatorPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the first page button's DOM element."
                         },
@@ -37456,7 +37765,7 @@
                             "name": "firstPageIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "PaginatorPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the first page icon's DOM element."
                         },
@@ -37464,7 +37773,7 @@
                             "name": "previousPageButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "PaginatorPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the prev page button's DOM element."
                         },
@@ -37472,7 +37781,7 @@
                             "name": "previousPageIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "PaginatorPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the prev page icon's DOM element."
                         },
@@ -37480,7 +37789,7 @@
                             "name": "nextPageButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "PaginatorPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the next page button's DOM element."
                         },
@@ -37488,7 +37797,7 @@
                             "name": "nextPageIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "PaginatorPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the next page icon's DOM element."
                         },
@@ -37496,7 +37805,7 @@
                             "name": "lastPageButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "PaginatorPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the last page button's DOM element."
                         },
@@ -37504,7 +37813,7 @@
                             "name": "lastPageIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "PaginatorPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the last page icon's DOM element."
                         },
@@ -37512,7 +37821,7 @@
                             "name": "pages",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "PaginatorPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the pages's DOM element."
                         },
@@ -37520,7 +37829,7 @@
                             "name": "pageButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "PaginatorPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the page button's DOM element."
                         },
@@ -37528,7 +37837,7 @@
                             "name": "current",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "PaginatorPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the current's DOM element."
                         },
@@ -37536,7 +37845,7 @@
                             "name": "rowPerPageDropdown",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptions<PaginatorSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Dropdown component."
                         },
@@ -37544,7 +37853,7 @@
                             "name": "jumpToPageDropdown",
                             "optional": true,
                             "readonly": false,
-                            "type": "DropdownPassThroughOptionType",
+                            "type": "DropdownPassThroughOptions<PaginatorSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Dropdown component."
                         },
@@ -37552,7 +37861,7 @@
                             "name": "jumpToPageInput",
                             "optional": true,
                             "readonly": false,
-                            "type": "InputNumberPassThroughOptionType",
+                            "type": "InputNumberPassThroughOptions<PaginatorSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Dropdown component."
                         },
@@ -37560,7 +37869,7 @@
                             "name": "end",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "PaginatorPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the end's DOM element."
                         },
@@ -37745,7 +38054,7 @@
                             "name": "pt",
                             "optional": true,
                             "readonly": false,
-                            "type": "PassThrough<PaginatorPassThroughOptions>",
+                            "type": "PassThrough<PaginatorPassThroughOptions<any>>",
                             "default": "",
                             "description": "Used to pass attributes to DOM elements inside the component."
                         },
@@ -39172,6 +39481,29 @@
                     ],
                     "methods": []
                 },
+                "PasswordSharedPassThroughMethodOptions": {
+                    "description": "Custom shared passthrough(pt) option method.",
+                    "relatedProp": "",
+                    "props": [
+                        {
+                            "name": "props",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "PasswordProps",
+                            "default": "",
+                            "description": "Defines valid properties."
+                        },
+                        {
+                            "name": "state",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "PasswordState",
+                            "default": "",
+                            "description": "Defines current inline state."
+                        }
+                    ],
+                    "methods": []
+                },
                 "PasswordPassThroughOptions": {
                     "description": "Custom passthrough(pt) options.",
                     "relatedProp": "PasswordProps.pt",
@@ -39188,7 +39520,7 @@
                             "name": "input",
                             "optional": true,
                             "readonly": false,
-                            "type": "PasswordPassThroughOptionType",
+                            "type": "InputTextPassThroughOptions<PasswordSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the InputText component."
                         },
@@ -39804,6 +40136,29 @@
                     ],
                     "methods": []
                 },
+                "PickListSharedPassThroughMethodOptions": {
+                    "description": "Custom shared passthrough(pt) option method.",
+                    "relatedProp": "",
+                    "props": [
+                        {
+                            "name": "props",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "PickListProps",
+                            "default": "",
+                            "description": "Defines valid properties."
+                        },
+                        {
+                            "name": "state",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "PickListState",
+                            "default": "",
+                            "description": "Defines current inline state."
+                        }
+                    ],
+                    "methods": []
+                },
                 "PickListReorderEvent": {
                     "description": "Custom reorder event.",
                     "relatedProp": "PickListEmits.reorder",
@@ -39986,7 +40341,7 @@
                             "name": "sourceMoveUpButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -39994,7 +40349,7 @@
                             "name": "sourceMoveTopButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -40002,7 +40357,7 @@
                             "name": "sourceMoveDownButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -40010,7 +40365,7 @@
                             "name": "sourceMoveBottomButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -40050,7 +40405,7 @@
                             "name": "moveToTargetButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -40058,7 +40413,7 @@
                             "name": "moveAllToTargetButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -40066,7 +40421,7 @@
                             "name": "moveToSourceButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -40074,7 +40429,7 @@
                             "name": "moveAllToSourceButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -40122,7 +40477,7 @@
                             "name": "targetMoveUpButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -40130,7 +40485,7 @@
                             "name": "targetMoveTopButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -40138,7 +40493,7 @@
                             "name": "targetMoveDownButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -40146,7 +40501,7 @@
                             "name": "targetMoveBottomButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptionType",
+                            "type": "ButtonPassThroughOptions<PickListSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -40963,6 +41318,14 @@
                             "type": "undefined | object",
                             "default": "",
                             "description": "Defines passthrough(pt) options in global config."
+                        },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "T",
+                            "default": "",
+                            "description": "Defines parent instance."
                         }
                     ],
                     "methods": []
@@ -40975,7 +41338,7 @@
                             "name": "root",
                             "optional": true,
                             "readonly": false,
-                            "type": "ProgressBarPassThroughOptionType",
+                            "type": "ProgressBarPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the root's DOM element."
                         },
@@ -40983,7 +41346,7 @@
                             "name": "value",
                             "optional": true,
                             "readonly": false,
-                            "type": "ProgressBarPassThroughOptionType",
+                            "type": "ProgressBarPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the value's DOM element."
                         },
@@ -40991,7 +41354,7 @@
                             "name": "label",
                             "optional": true,
                             "readonly": false,
-                            "type": "ProgressBarPassThroughOptionType",
+                            "type": "ProgressBarPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the label's DOM element."
                         },
@@ -41051,7 +41414,7 @@
                             "name": "pt",
                             "optional": true,
                             "readonly": false,
-                            "type": "PassThrough<ProgressBarPassThroughOptions>",
+                            "type": "PassThrough<ProgressBarPassThroughOptions<any>>",
                             "default": "",
                             "description": "Used to pass attributes to DOM elements inside the component."
                         },
@@ -44802,6 +45165,29 @@
                     ],
                     "methods": []
                 },
+                "SpeedDialSharedPassThroughMethodOptions": {
+                    "description": "Custom shared passthrough(pt) option method.",
+                    "relatedProp": "",
+                    "props": [
+                        {
+                            "name": "props",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "SpeedDialProps",
+                            "default": "",
+                            "description": "Defines valid properties."
+                        },
+                        {
+                            "name": "state",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "SpeedDialState",
+                            "default": "",
+                            "description": "Defines current inline state."
+                        }
+                    ],
+                    "methods": []
+                },
                 "SpeedDialPassThroughOptions": {
                     "description": "Custom passthrough(pt) options.",
                     "relatedProp": "SpeedDialProps.pt",
@@ -44818,7 +45204,7 @@
                             "name": "button",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptions",
+                            "type": "ButtonPassThroughOptions<SpeedDialSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -45408,6 +45794,29 @@
                     ],
                     "methods": []
                 },
+                "SplitButtonSharedPassThroughMethodOptions": {
+                    "description": "Custom shared passthrough(pt) option method.",
+                    "relatedProp": "",
+                    "props": [
+                        {
+                            "name": "props",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "SplitButtonProps",
+                            "default": "",
+                            "description": "Defines valid properties."
+                        },
+                        {
+                            "name": "state",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "SplitButtonState",
+                            "default": "",
+                            "description": "Defines current inline state."
+                        }
+                    ],
+                    "methods": []
+                },
                 "SplitButtonPassThroughOptions": {
                     "description": "Custom passthrough(pt) options.",
                     "relatedProp": "SplitButtonProps.pt",
@@ -45432,7 +45841,7 @@
                             "name": "menuButton",
                             "optional": true,
                             "readonly": false,
-                            "type": "ButtonPassThroughOptions",
+                            "type": "ButtonPassThroughOptions<SplitButtonSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Button component."
                         },
@@ -45440,7 +45849,7 @@
                             "name": "menu",
                             "optional": true,
                             "readonly": false,
-                            "type": "TieredMenuPassThroughOptions",
+                            "type": "TieredMenuPassThroughOptions<SplitButtonSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the TieredMenu component."
                         },
@@ -49293,6 +49702,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "T",
+                            "default": "",
+                            "description": "Defines parent instance."
+                        },
                         {
                             "name": "context",
                             "optional": false,
@@ -49320,7 +49737,7 @@
                             "name": "root",
                             "optional": true,
                             "readonly": false,
-                            "type": "TieredMenuPassThroughOptionType",
+                            "type": "TieredMenuPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the root's DOM element."
                         },
@@ -49328,7 +49745,7 @@
                             "name": "menu",
                             "optional": true,
                             "readonly": false,
-                            "type": "TieredMenuPassThroughOptionType",
+                            "type": "TieredMenuPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the list's DOM element."
                         },
@@ -49336,7 +49753,7 @@
                             "name": "menuitem",
                             "optional": true,
                             "readonly": false,
-                            "type": "TieredMenuPassThroughOptionType",
+                            "type": "TieredMenuPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the list item's DOM element."
                         },
@@ -49344,7 +49761,7 @@
                             "name": "content",
                             "optional": true,
                             "readonly": false,
-                            "type": "TieredMenuPassThroughOptionType",
+                            "type": "TieredMenuPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the content's DOM element."
                         },
@@ -49352,7 +49769,7 @@
                             "name": "action",
                             "optional": true,
                             "readonly": false,
-                            "type": "TieredMenuPassThroughOptionType",
+                            "type": "TieredMenuPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the action's DOM element."
                         },
@@ -49360,7 +49777,7 @@
                             "name": "icon",
                             "optional": true,
                             "readonly": false,
-                            "type": "TieredMenuPassThroughOptionType",
+                            "type": "TieredMenuPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the icon's DOM element."
                         },
@@ -49368,7 +49785,7 @@
                             "name": "label",
                             "optional": true,
                             "readonly": false,
-                            "type": "TieredMenuPassThroughOptionType",
+                            "type": "TieredMenuPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the label's DOM element."
                         },
@@ -49376,7 +49793,7 @@
                             "name": "submenuIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "TieredMenuPassThroughOptionType",
+                            "type": "TieredMenuPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the submenu icon's DOM element."
                         },
@@ -49384,7 +49801,7 @@
                             "name": "separator",
                             "optional": true,
                             "readonly": false,
-                            "type": "TieredMenuPassThroughOptionType",
+                            "type": "TieredMenuPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the separator's DOM element."
                         },
@@ -49392,7 +49809,7 @@
                             "name": "submenu",
                             "optional": true,
                             "readonly": false,
-                            "type": "TieredMenuPassThroughOptionType",
+                            "type": "TieredMenuPassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the submenu's DOM element."
                         },
@@ -49408,7 +49825,7 @@
                             "name": "transition",
                             "optional": true,
                             "readonly": false,
-                            "type": "TieredMenuPassThroughTransitionType",
+                            "type": "TieredMenuPassThroughTransitionType<any>",
                             "default": "",
                             "description": "Used to control Vue Transition API."
                         }
@@ -49681,7 +50098,7 @@
                             "name": "pt",
                             "optional": true,
                             "readonly": false,
-                            "type": "PassThrough<TieredMenuPassThroughOptions>",
+                            "type": "PassThrough<TieredMenuPassThroughOptions<any>>",
                             "default": "",
                             "description": "Used to pass attributes to DOM elements inside the component."
                         },
@@ -52031,6 +52448,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "T",
+                            "default": "",
+                            "description": "Defines parent instance."
+                        },
                         {
                             "name": "context",
                             "optional": false,
@@ -52107,7 +52532,7 @@
                             "name": "root",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the root's DOM element."
                         },
@@ -52115,7 +52540,7 @@
                             "name": "filterContainer",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the filter container's DOM element."
                         },
@@ -52123,7 +52548,7 @@
                             "name": "input",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the input's DOM element."
                         },
@@ -52131,7 +52556,7 @@
                             "name": "searchIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the search icon's DOM element."
                         },
@@ -52139,7 +52564,7 @@
                             "name": "wrapper",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the wrapper's DOM element."
                         },
@@ -52147,7 +52572,7 @@
                             "name": "container",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the container's DOM element."
                         },
@@ -52155,7 +52580,7 @@
                             "name": "node",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the node's DOM element."
                         },
@@ -52163,7 +52588,7 @@
                             "name": "content",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the content's DOM element."
                         },
@@ -52171,7 +52596,7 @@
                             "name": "toggler",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the toggler's DOM element."
                         },
@@ -52179,7 +52604,7 @@
                             "name": "togglerIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the toggler icon's DOM element."
                         },
@@ -52187,7 +52612,7 @@
                             "name": "checkboxContainer",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the checkbox container's DOM element."
                         },
@@ -52195,7 +52620,7 @@
                             "name": "checkbox",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the checkbox's DOM element."
                         },
@@ -52203,7 +52628,7 @@
                             "name": "checkboxIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the checkbox icon's DOM element."
                         },
@@ -52211,7 +52636,7 @@
                             "name": "nodeIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the node icon's DOM element."
                         },
@@ -52219,7 +52644,7 @@
                             "name": "label",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the label's DOM element."
                         },
@@ -52227,7 +52652,7 @@
                             "name": "subgroup",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the subgroup's DOM element."
                         },
@@ -52235,7 +52660,7 @@
                             "name": "loadingOverlay",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the loading overlay's DOM element."
                         },
@@ -52243,7 +52668,7 @@
                             "name": "loadingIcon",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<T>",
                             "default": "",
                             "description": "Used to pass attributes to the loading icon's DOM element."
                         },
@@ -52478,7 +52903,7 @@
                             "name": "pt",
                             "optional": true,
                             "readonly": false,
-                            "type": "PassThrough<TreePassThroughOptions>",
+                            "type": "PassThrough<TreePassThroughOptions<any>>",
                             "default": "",
                             "description": "Used to pass attributes to DOM elements inside the component."
                         },
@@ -52931,6 +53356,29 @@
                     ],
                     "methods": []
                 },
+                "TreeSelectSharedPassThroughMethodOptions": {
+                    "description": "Custom shared passthrough(pt) option method.",
+                    "relatedProp": "",
+                    "props": [
+                        {
+                            "name": "props",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "TreeSelectProps",
+                            "default": "",
+                            "description": "Defines valid properties."
+                        },
+                        {
+                            "name": "state",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "TreeSelectState",
+                            "default": "",
+                            "description": "Defines current inline state."
+                        }
+                    ],
+                    "methods": []
+                },
                 "TreeSelectPassThroughOptions": {
                     "description": "Custom passthrough(pt) options.",
                     "relatedProp": "TreeSelectProps.pt",
@@ -53011,7 +53459,7 @@
                             "name": "tree",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType",
+                            "type": "TreePassThroughOptionType<TreeSelectSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to Tree component."
                         },
@@ -53621,6 +54069,29 @@
                     ],
                     "methods": []
                 },
+                "TreeTableSharedPassThroughMethodOptions": {
+                    "description": "Custom shared passthrough(pt) option method.",
+                    "relatedProp": "",
+                    "props": [
+                        {
+                            "name": "props",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "TreeTableProps",
+                            "default": "",
+                            "description": "Defines valid properties."
+                        },
+                        {
+                            "name": "state",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "TreeTableState",
+                            "default": "",
+                            "description": "Defines current inline state."
+                        }
+                    ],
+                    "methods": []
+                },
                 "TreeTableFilterMetaData": {
                     "description": "Custom treetable filter metadata.",
                     "relatedProp": "",
@@ -54017,7 +54488,7 @@
                             "name": "paginator",
                             "optional": true,
                             "readonly": false,
-                            "type": "PaginatorPassThroughOptionType",
+                            "type": "PaginatorPassThroughOptionType<TreeTableSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to the Paginator component."
                         },

From d9e162b1dc5eb410c167a27c8f0416c97d1badc5 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 10:15:12 +0300
Subject: [PATCH 42/69] Format fixes

---
 components/doc/DocApiTable.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/components/doc/DocApiTable.vue b/components/doc/DocApiTable.vue
index bbc12dd22..1275252e9 100644
--- a/components/doc/DocApiTable.vue
+++ b/components/doc/DocApiTable.vue
@@ -29,14 +29,14 @@
                                 <template v-for="(value, i) in getType(v)" :key="value">
                                     <span v-if="i !== 0" class="doc-option-type">{{ ' | ' }}</span>
                                     <NuxtLink v-if="isLinkType(value)" :to="setLinkPath(value)" class="doc-option-type doc-option-link">{{ value }}</NuxtLink
-                                    ><span v-else class="doc-option-type">{{ value ==='T'? 'any': value }}</span>
+                                    ><span v-else class="doc-option-type">{{ value === 'T' ? 'any' : value }}</span>
                                 </template>
                             </template>
 
                             <template v-else-if="k === 'options'">
                                 <template v-for="val in v" :key="val.name">
                                     <div class="doc-option-type-options-container">
-                                        {{ val.name }}: <span class="doc-option-type-options doc-option-type">{{ (val.type === 'T' || val.type.includes('<T>')) ? 'any' : val.type }}</span>
+                                        {{ val.name }}: <span class="doc-option-type-options doc-option-type">{{ val.type === 'T' || val.type.includes('<T') ? 'any' : val.type }}</span>
                                     </div>
                                 </template>
                             </template>

From 2838404b31391d2ce39d3c2de6d36973775dd11a Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 11:50:21 +0300
Subject: [PATCH 43/69] Update Tailwind passthrough

---
 components/lib/passthrough/tailwind/index.js | 298 +++++++++++++++----
 1 file changed, 240 insertions(+), 58 deletions(-)

diff --git a/components/lib/passthrough/tailwind/index.js b/components/lib/passthrough/tailwind/index.js
index 73db125e8..5109e60fd 100644
--- a/components/lib/passthrough/tailwind/index.js
+++ b/components/lib/passthrough/tailwind/index.js
@@ -838,16 +838,24 @@ export default {
             class: 'absolute flex'
         },
         button: {
-            root: ({ parent }) => ({
-                class: [
-                    'w-16 !h-16 !rounded-full justify-center z-10',
-                    {
-                        'rotate-45': parent.state.d_visible
-                    }
-                ]
-            }),
-            label: {
-                class: 'hidden'
+            root: ({ parent }) => {
+                return {
+                    class: [
+                        'text-white dark:text-gray-900 bg-blue-500 dark:bg-blue-400 border border-blue-500 dark:border-blue-400 hover:bg-blue-600 dark:hover:bg-blue-500 hover:border-blue-600 dark:hover:border-blue-500 focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(157,193,251,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(147,197,253,0.7),0_1px_2px_0_rgba(0,0,0,0)]',
+                        'flex items-center justify-center',
+                        'transition duration-200 ease-in-out',
+                        'focus:outline-none focus:outline-offset-0',
+                        'w-16 !h-16 !rounded-full justify-center z-10',
+                        {
+                            'rotate-45': parent.state.d_visible
+                        }
+                    ]
+                };
+            },
+            label: () => {
+                return {
+                    class: 'hidden'
+                };
             }
         },
         menu: {
@@ -884,19 +892,155 @@ export default {
             class: ['inline-flex relative', 'rounded-md', { 'shadow-lg': props.raised }]
         }),
         button: {
-            root: ({ parent }) => ({
-                class: ['rounded-r-none border-r-0', { 'rounded-l-full': parent.props.rounded }]
-            }),
-            icon: {
-                class: 'mr-2'
+            root: ({ props, parent }) => {
+                return {
+                    class: [
+                        'rounded-r-none border-r-0',
+                        { 'rounded-l-full': parent.props.rounded },
+                        {
+                            'text-white dark:text-gray-900 bg-blue-500 dark:bg-blue-400 border border-blue-500 dark:border-blue-400 hover:bg-blue-600 dark:hover:bg-blue-500 hover:border-blue-600 dark:hover:border-blue-500 focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(157,193,251,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(147,197,253,0.7),0_1px_2px_0_rgba(0,0,0,0)]':
+                                !parent.props.link && parent.props.severity === null && !parent.props.text && !parent.props.outlined && !parent.props.plain,
+                            'text-blue-600 bg-transparent border-transparent focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(157,193,251,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(147,197,253,0.7),0_1px_2px_0_rgba(0,0,0,0)]':
+                                parent.props.link
+                        },
+                        {
+                            'focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(176,185,198,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(203,213,225,0.7),0_1px_2px_0_rgba(0,0,0,0)]':
+                                props.severity === 'secondary',
+                            'focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(136,234,172,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(134,239,172,0.7),0_1px_2px_0_rgba(0,0,0,0)]':
+                                props.severity === 'success',
+                            'focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(157,193,251,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(147,197,253,0.7),0_1px_2px_0_rgba(0,0,0,0)]':
+                                props.severity === 'info',
+                            'focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(250,207,133,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(252,211,77,0.7),0_1px_2px_0_rgba(0,0,0,0)]':
+                                props.severity === 'warning',
+                            'focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(212,170,251,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(216,180,254,0.7),0_1px_2px_0_rgba(0,0,0,0)]':
+                                props.severity === 'help',
+                            'focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(247,162,162,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(252,165,165,0.7),0_1px_2px_0_rgba(0,0,0,0)]':
+                                props.severity === 'danger'
+                        },
+                        {
+                            'text-white dark:text-gray-900 bg-gray-500 dark:bg-gray-400 border border-gray-500 dark:border-gray-400 hover:bg-gray-600 dark:hover:bg-gray-500 hover:border-gray-600 dark:hover:border-gray-500':
+                                props.severity === 'secondary' && !props.text && !props.outlined && !props.plain,
+                            'text-white dark:text-gray-900 bg-green-500 dark:bg-green-400 border border-green-500 dark:border-green-400 hover:bg-green-600 dark:hover:bg-green-500 hover:border-green-600 dark:hover:border-green-500':
+                                props.severity === 'success' && !props.text && !props.outlined && !props.plain,
+                            'text-white dark:text-gray-900 dark:bg-blue-400 bg-blue-500 dark:bg-blue-400 border border-blue-500 dark:border-blue-400 hover:bg-blue-600 hover:border-blue-600 dark:hover:bg-blue-500 dark:hover:border-blue-500':
+                                props.severity === 'info' && !props.text && !props.outlined && !props.plain,
+                            'text-white dark:text-gray-900 bg-orange-500 dark:bg-orange-400 border border-orange-500 dark:border-orange-400 hover:bg-orange-600 dark:hover:bg-orange-500 hover:border-orange-600 dark:hover:border-orange-500':
+                                props.severity === 'warning' && !props.text && !props.outlined && !props.plain,
+                            'text-white dark:text-gray-900 bg-purple-500 dark:bg-purple-400 border border-purple-500 dark:border-purple-400 hover:bg-purple-600 dark:hover:bg-purple-500 hover:border-purple-600 dark:hover:border-purple-500':
+                                props.severity === 'help' && !props.text && !props.outlined && !props.plain,
+                            'text-white dark:text-gray-900 bg-red-500 dark:bg-red-400 border border-red-500 dark:border-red-400 hover:bg-red-600 dark:hover:bg-red-500 hover:border-red-600 dark:hover:border-red-500':
+                                props.severity === 'danger' && !props.text && !props.outlined && !props.plain
+                        },
+                        { 'shadow-lg': props.raised },
+                        { 'rounded-md': !props.rounded, 'rounded-full': props.rounded },
+                        {
+                            'bg-transparent border-transparent': props.text && !props.plain,
+                            'text-blue-500 dark:text-blue-400 hover:bg-blue-300/20': props.text && (props.severity === null || props.severity === 'info') && !props.plain,
+                            'text-gray-500 dark:text-gray-400 hover:bg-gray-300/20': props.text && props.severity === 'secondary' && !props.plain,
+                            'text-green-500 dark:text-green-400 hover:bg-green-300/20': props.text && props.severity === 'success' && !props.plain,
+                            'text-orange-500 dark:text-orange-400 hover:bg-orange-300/20': props.text && props.severity === 'warning' && !props.plain,
+                            'text-purple-500 dark:text-purple-400 hover:bg-purple-300/20': props.text && props.severity === 'help' && !props.plain,
+                            'text-red-500 dark:text-red-400 hover:bg-red-300/20': props.text && props.severity === 'danger' && !props.plain
+                        },
+                        { 'shadow-lg': props.raised && props.text },
+                        {
+                            'text-gray-500 hover:bg-gray-300/20': props.plain && props.text,
+                            'text-gray-500 border border-gray-500 hover:bg-gray-300/20': props.plain && props.outlined,
+                            'text-white bg-gray-500 border border-gray-500 hover:bg-gray-600 hover:border-gray-600': props.plain && !props.outlined && !props.text
+                        },
+                        {
+                            'bg-transparent border': props.outlined && !props.plain,
+                            'text-blue-500 dark:text-blue-400 border border-blue-500 dark:border-blue-400 hover:bg-blue-300/20': props.outlined && (props.severity === null || props.severity === 'info') && !props.plain,
+                            'text-gray-500 dark:text-gray-400 border border-gray-500 dark:border-gray-400 hover:bg-gray-300/20': props.outlined && props.severity === 'secondary' && !props.plain,
+                            'text-green-500 dark:text-green-400 border border-green-500 dark:border-green-400 hover:bg-green-300/20': props.outlined && props.severity === 'success' && !props.plain,
+                            'text-orange-500 dark:text-orange-400 border border-orange-500 dark:border-orange-400 hover:bg-orange-300/20': props.outlined && props.severity === 'warning' && !props.plain,
+                            'text-purple-500 dark:text-purple-400 border border-purple-500 dark:border-purple-400 hover:bg-purple-300/20': props.outlined && props.severity === 'help' && !props.plain,
+                            'text-red-500 dark:text-red-400 border border-red-500 dark:border-red-400 hover:bg-red-300/20': props.outlined && props.severity === 'danger' && !props.plain
+                        },
+                        { 'px-4 py-3 text-base': props.size === null, 'text-xs py-2 px-3': props.size === 'small', 'text-xl py-3 px-4': props.size === 'large' }
+                    ]
+                };
+            },
+            icon: () => {
+                return {
+                    class: 'mr-2'
+                };
             }
         },
         menubutton: {
-            root: ({ parent }) => ({
-                class: ['rounded-l-none', { 'rounded-r-full': parent.props.rounded }]
-            }),
-            label: {
-                class: 'hidden'
+            root: ({ props, parent }) => {
+                return {
+                    class: [
+                        'rounded-l-none',
+                        { 'rounded-r-full': parent.props.rounded },
+                        {
+                            'text-white dark:text-gray-900 bg-blue-500 dark:bg-blue-400 border border-blue-500 dark:border-blue-400 hover:bg-blue-600 dark:hover:bg-blue-500 hover:border-blue-600 dark:hover:border-blue-500 focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(157,193,251,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(147,197,253,0.7),0_1px_2px_0_rgba(0,0,0,0)]':
+                                !parent.props.link && parent.props.severity === null && !parent.props.text && !parent.props.outlined && !parent.props.plain,
+                            'text-blue-600 bg-transparent border-transparent focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(157,193,251,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(147,197,253,0.7),0_1px_2px_0_rgba(0,0,0,0)]':
+                                parent.props.link
+                        },
+                        {
+                            'focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(176,185,198,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(203,213,225,0.7),0_1px_2px_0_rgba(0,0,0,0)]':
+                                props.severity === 'secondary',
+                            'focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(136,234,172,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(134,239,172,0.7),0_1px_2px_0_rgba(0,0,0,0)]':
+                                props.severity === 'success',
+                            'focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(157,193,251,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(147,197,253,0.7),0_1px_2px_0_rgba(0,0,0,0)]':
+                                props.severity === 'info',
+                            'focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(250,207,133,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(252,211,77,0.7),0_1px_2px_0_rgba(0,0,0,0)]':
+                                props.severity === 'warning',
+                            'focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(212,170,251,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(216,180,254,0.7),0_1px_2px_0_rgba(0,0,0,0)]':
+                                props.severity === 'help',
+                            'focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(247,162,162,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(252,165,165,0.7),0_1px_2px_0_rgba(0,0,0,0)]':
+                                props.severity === 'danger'
+                        },
+                        {
+                            'text-white dark:text-gray-900 bg-gray-500 dark:bg-gray-400 border border-gray-500 dark:border-gray-400 hover:bg-gray-600 dark:hover:bg-gray-500 hover:border-gray-600 dark:hover:border-gray-500':
+                                props.severity === 'secondary' && !props.text && !props.outlined && !props.plain,
+                            'text-white dark:text-gray-900 bg-green-500 dark:bg-green-400 border border-green-500 dark:border-green-400 hover:bg-green-600 dark:hover:bg-green-500 hover:border-green-600 dark:hover:border-green-500':
+                                props.severity === 'success' && !props.text && !props.outlined && !props.plain,
+                            'text-white dark:text-gray-900 dark:bg-blue-400 bg-blue-500 dark:bg-blue-400 border border-blue-500 dark:border-blue-400 hover:bg-blue-600 hover:border-blue-600 dark:hover:bg-blue-500 dark:hover:border-blue-500':
+                                props.severity === 'info' && !props.text && !props.outlined && !props.plain,
+                            'text-white dark:text-gray-900 bg-orange-500 dark:bg-orange-400 border border-orange-500 dark:border-orange-400 hover:bg-orange-600 dark:hover:bg-orange-500 hover:border-orange-600 dark:hover:border-orange-500':
+                                props.severity === 'warning' && !props.text && !props.outlined && !props.plain,
+                            'text-white dark:text-gray-900 bg-purple-500 dark:bg-purple-400 border border-purple-500 dark:border-purple-400 hover:bg-purple-600 dark:hover:bg-purple-500 hover:border-purple-600 dark:hover:border-purple-500':
+                                props.severity === 'help' && !props.text && !props.outlined && !props.plain,
+                            'text-white dark:text-gray-900 bg-red-500 dark:bg-red-400 border border-red-500 dark:border-red-400 hover:bg-red-600 dark:hover:bg-red-500 hover:border-red-600 dark:hover:border-red-500':
+                                props.severity === 'danger' && !props.text && !props.outlined && !props.plain
+                        },
+                        { 'shadow-lg': props.raised },
+                        { 'rounded-md': !props.rounded, 'rounded-full': props.rounded },
+                        {
+                            'bg-transparent border-transparent': props.text && !props.plain,
+                            'text-blue-500 dark:text-blue-400 hover:bg-blue-300/20': props.text && (props.severity === null || props.severity === 'info') && !props.plain,
+                            'text-gray-500 dark:text-gray-400 hover:bg-gray-300/20': props.text && props.severity === 'secondary' && !props.plain,
+                            'text-green-500 dark:text-green-400 hover:bg-green-300/20': props.text && props.severity === 'success' && !props.plain,
+                            'text-orange-500 dark:text-orange-400 hover:bg-orange-300/20': props.text && props.severity === 'warning' && !props.plain,
+                            'text-purple-500 dark:text-purple-400 hover:bg-purple-300/20': props.text && props.severity === 'help' && !props.plain,
+                            'text-red-500 dark:text-red-400 hover:bg-red-300/20': props.text && props.severity === 'danger' && !props.plain
+                        },
+                        { 'shadow-lg': props.raised && props.text },
+                        {
+                            'text-gray-500 hover:bg-gray-300/20': props.plain && props.text,
+                            'text-gray-500 border border-gray-500 hover:bg-gray-300/20': props.plain && props.outlined,
+                            'text-white bg-gray-500 border border-gray-500 hover:bg-gray-600 hover:border-gray-600': props.plain && !props.outlined && !props.text
+                        },
+                        {
+                            'bg-transparent border': props.outlined && !props.plain,
+                            'text-blue-500 dark:text-blue-400 border border-blue-500 dark:border-blue-400 hover:bg-blue-300/20': props.outlined && (props.severity === null || props.severity === 'info') && !props.plain,
+                            'text-gray-500 dark:text-gray-400 border border-gray-500 dark:border-gray-400 hover:bg-gray-300/20': props.outlined && props.severity === 'secondary' && !props.plain,
+                            'text-green-500 dark:text-green-400 border border-green-500 dark:border-green-400 hover:bg-green-300/20': props.outlined && props.severity === 'success' && !props.plain,
+                            'text-orange-500 dark:text-orange-400 border border-orange-500 dark:border-orange-400 hover:bg-orange-300/20': props.outlined && props.severity === 'warning' && !props.plain,
+                            'text-purple-500 dark:text-purple-400 border border-purple-500 dark:border-purple-400 hover:bg-purple-300/20': props.outlined && props.severity === 'help' && !props.plain,
+                            'text-red-500 dark:text-red-400 border border-red-500 dark:border-red-400 hover:bg-red-300/20': props.outlined && props.severity === 'danger' && !props.plain
+                        },
+                        { 'px-4 py-3 text-base': props.size === null, 'text-xs py-2 px-3': props.size === 'small', 'text-xl py-3 px-4': props.size === 'large' }
+                    ]
+                };
+            },
+            label: () => {
+                return {
+                    class: 'hidden'
+                };
             }
         }
     },
@@ -922,44 +1066,73 @@ export default {
         root: {
             class: 'w-full inline-flex'
         },
-        input: ({ props }) => ({
-            class: [
-                {
-                    'rounded-tr-none rounded-br-none': props.showButtons && props.buttonLayout == 'stacked'
-                },
-                {
-                    'order-2': props.buttonLayout == 'horizontal'
-                }
-            ]
-        }),
+        input: {
+            root: ({ parent }) => {
+                return {
+                    class: [
+                        // { test: parent }
+                        'm-0',
+                        'font-sans text-gray-600 dark:text-white/80 bg-white dark:bg-gray-900 border border-gray-300 dark:border-blue-900/40 transition-colors duration-200 appearance-none rounded-lg',
+                        'p-3 text-base',
+                        {
+                            'rounded-tr-none rounded-br-none': parent.props.showButtons && parent.props.buttonLayout == 'stacked'
+                        },
+                        {
+                            'order-2': parent.props.buttonLayout == 'horizontal'
+                        }
+                    ]
+                };
+            }
+        },
         buttongroup: ({ props }) => ({
             class: [{ 'flex flex-col': props.showButtons && props.buttonLayout == 'stacked' }]
         }),
-        incrementbutton: ({ props }) => ({
-            class: [
-                'flex !items-center !justify-center',
-                {
-                    'rounded-br-none rounded-bl-none rounded-bl-none !p-0 flex-1 w-[3rem]': props.showButtons && props.buttonLayout == 'stacked'
-                },
-                {
-                    'order-3': props.buttonLayout == 'horizontal'
-                }
-            ]
-        }),
-        label: {
-            class: 'hidden'
+        incrementbutton: {
+            root: ({ parent }) => {
+                return {
+                    class: [
+                        'text-white dark:text-gray-900 bg-blue-500 dark:bg-blue-400 border border-blue-500 dark:border-blue-400 hover:bg-blue-600 dark:hover:bg-blue-500 hover:border-blue-600 dark:hover:border-blue-500 focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(157,193,251,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(147,197,253,0.7),0_1px_2px_0_rgba(0,0,0,0)]',
+                        'flex items-center justify-center',
+                        'transition duration-200 ease-in-out',
+                        'focus:outline-none focus:outline-offset-0',
+                        {
+                            'rounded-md rounded-br-none rounded-bl-none rounded-bl-none !p-0 flex-1 w-[3rem]': parent.props.showButtons && parent.props.buttonLayout == 'stacked'
+                        },
+                        {
+                            'order-3 px-4 py-3 text-base rounded-md': parent.props.buttonLayout == 'horizontal'
+                        }
+                    ]
+                };
+            },
+            label: () => {
+                return {
+                    class: 'hidden'
+                };
+            }
         },
-        decrementbutton: ({ props }) => ({
-            class: [
-                'flex !items-center !justify-center',
-                {
-                    'rounded-tr-none rounded-tl-none rounded-tl-none !p-0 flex-1 w-[3rem]': props.showButtons && props.buttonLayout == 'stacked'
-                },
-                {
-                    'order-1': props.buttonLayout == 'horizontal'
-                }
-            ]
-        })
+        decrementbutton: {
+            root: ({ parent }) => {
+                return {
+                    class: [
+                        'text-white dark:text-gray-900 bg-blue-500 dark:bg-blue-400 border border-blue-500 dark:border-blue-400 hover:bg-blue-600 dark:hover:bg-blue-500 hover:border-blue-600 dark:hover:border-blue-500 focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(157,193,251,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(147,197,253,0.7),0_1px_2px_0_rgba(0,0,0,0)]',
+                        'flex items-center justify-center',
+                        'transition duration-200 ease-in-out',
+                        'focus:outline-none focus:outline-offset-0',
+                        {
+                            'rounded-md rounded-tr-none rounded-tl-none rounded-tl-none !p-0 flex-1 w-[3rem]': parent.props.showButtons && parent.props.buttonLayout == 'stacked'
+                        },
+                        {
+                            'order-1 px-4 py-3 text-base rounded-md': parent.props.buttonLayout == 'horizontal'
+                        }
+                    ]
+                };
+            },
+            label: () => {
+                return {
+                    class: 'hidden'
+                };
+            }
+        }
     },
     knob: {
         root: ({ props }) => ({
@@ -1382,11 +1555,20 @@ export default {
                 { 'rounded-lg': !props.showIcon, 'border-r-0 rounded-l-lg': props.showIcon }
             ]
         }),
-        dropdownbutton: ({ props }) => ({
-            root: {
-                class: [{ 'rounded-l-none': props.showIcon }]
+        dropdownbutton: {
+            root: ({ parent }) => {
+                return {
+                    class: [
+                        'text-white dark:text-gray-900 bg-blue-500 dark:bg-blue-400 border border-blue-500 dark:border-blue-400 hover:bg-blue-600 dark:hover:bg-blue-500 hover:border-blue-600 dark:hover:border-blue-500 focus:shadow-[0_0_0_2px_rgba(255,255,255,1),0_0_0_4px_rgba(157,193,251,1),0_1px_2px_0_rgba(0,0,0,1)] dark:focus:shadow-[0_0_0_2px_rgba(28,33,39,1),0_0_0_4px_rgba(147,197,253,0.7),0_1px_2px_0_rgba(0,0,0,0)]',
+                        'flex items-center justify-center',
+                        'transition duration-200 ease-in-out',
+                        'focus:outline-none focus:outline-offset-0',
+                        'px-4 py-3 text-base rounded-md',
+                        { 'rounded-l-none': parent.props.showIcon }
+                    ]
+                };
             }
-        }),
+        },
         panel: ({ props }) => ({
             class: [
                 'bg-white dark:bg-gray-900',

From 8d2a4f061728200baa334356c4bc674ef09063f4 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 12:40:47 +0300
Subject: [PATCH 44/69] Update DocApiTable.vue

---
 components/doc/DocApiTable.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/doc/DocApiTable.vue b/components/doc/DocApiTable.vue
index 1275252e9..4879213ca 100644
--- a/components/doc/DocApiTable.vue
+++ b/components/doc/DocApiTable.vue
@@ -36,7 +36,7 @@
                             <template v-else-if="k === 'options'">
                                 <template v-for="val in v" :key="val.name">
                                     <div class="doc-option-type-options-container">
-                                        {{ val.name }}: <span class="doc-option-type-options doc-option-type">{{ val.type === 'T' || val.type.includes('<T') ? 'any' : val.type }}</span>
+                                        {{ val.name }}: <span class="doc-option-type-options doc-option-type">{{ val.type === 'T' || val.type.includes(`"<T>"`) ? 'any' : val.type }}</span>
                                     </div>
                                 </template>
                             </template>

From e82dd774e542cfcb444e749d0ff3b5143604eb4c Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 12:41:04 +0300
Subject: [PATCH 45/69] Update TreeSelect.d.ts

---
 components/lib/treeselect/TreeSelect.d.ts | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/components/lib/treeselect/TreeSelect.d.ts b/components/lib/treeselect/TreeSelect.d.ts
index b9069b70c..5a7367789 100644
--- a/components/lib/treeselect/TreeSelect.d.ts
+++ b/components/lib/treeselect/TreeSelect.d.ts
@@ -10,7 +10,7 @@
 import { InputHTMLAttributes, TransitionProps, VNode } from 'vue';
 import { ComponentHooks } from '../basecomponent';
 import { PassThroughOptions } from '../passthrough';
-import { TreeExpandedKeys, TreePassThroughOptionType } from '../tree';
+import { TreeExpandedKeys, TreePassThroughOptions } from '../tree';
 import { TreeNode } from '../treenode';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 
@@ -97,9 +97,9 @@ export interface TreeSelectPassThroughOptions {
     wrapper?: TreeSelectPassThroughOptionType;
     /**
      * Used to pass attributes to Tree component.
-     * @see {@link TreePassThroughOptionType}
+     * @see {@link TreePassThroughOptions}
      */
-    tree?: TreePassThroughOptionType<TreeSelectSharedPassThroughMethodOptions>;
+    tree?: TreePassThroughOptions<TreeSelectSharedPassThroughMethodOptions>;
     /**
      * Used to pass attributes to the empty message's DOM element.
      */

From 65f6191ad488cadb6f6923dbad20bf8761edc412 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 12:49:14 +0300
Subject: [PATCH 46/69] Format fixes

---
 components/doc/DocApiTable.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/doc/DocApiTable.vue b/components/doc/DocApiTable.vue
index 4879213ca..b0e7d61f9 100644
--- a/components/doc/DocApiTable.vue
+++ b/components/doc/DocApiTable.vue
@@ -36,7 +36,7 @@
                             <template v-else-if="k === 'options'">
                                 <template v-for="val in v" :key="val.name">
                                     <div class="doc-option-type-options-container">
-                                        {{ val.name }}: <span class="doc-option-type-options doc-option-type">{{ val.type === 'T' || val.type.includes(`"<T>"`) ? 'any' : val.type }}</span>
+                                        {{ val.name }}: <span class="doc-option-type-options doc-option-type">{{ val.type === 'T' || (val.type.includes('<T') && !val.type.includes('<Tr')) ? 'any' : val.type }}</span>
                                     </div>
                                 </template>
                             </template>

From d382e6c960d033b216710ca7bfa669acf7482882 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 12:49:37 +0300
Subject: [PATCH 47/69] paret parameter added

---
 components/lib/badge/Badge.vue             | 14 ++++-
 components/lib/dropdown/Dropdown.vue       | 73 ++++++++++++++--------
 components/lib/inputtext/InputText.vue     |  4 ++
 components/lib/message/Message.vue         | 24 ++++---
 components/lib/progressbar/ProgressBar.vue | 20 ++++--
 components/lib/tree/Tree.vue               | 26 +++++---
 6 files changed, 110 insertions(+), 51 deletions(-)

diff --git a/components/lib/badge/Badge.vue b/components/lib/badge/Badge.vue
index e6dbe943a..4aab24f64 100644
--- a/components/lib/badge/Badge.vue
+++ b/components/lib/badge/Badge.vue
@@ -1,5 +1,5 @@
 <template>
-    <span :class="cx('root')" v-bind="ptm('root')" data-pc-name="badge">
+    <span :class="cx('root')" v-bind="getPTOptions('root')" data-pc-name="badge">
         <slot>{{ value }}</slot>
     </span>
 </template>
@@ -9,6 +9,16 @@ import BaseBadge from './BaseBadge.vue';
 
 export default {
     name: 'Badge',
-    extends: BaseBadge
+    extends: BaseBadge,
+    methods: {
+        getPTOptions(key) {
+            return this.ptm(key, {
+                parent: {
+                    props: this.$parent?.$props,
+                    state: this.$parent?.$data
+                }
+            });
+        }
+    }
 };
 </script>
diff --git a/components/lib/dropdown/Dropdown.vue b/components/lib/dropdown/Dropdown.vue
index a97f59e47..e5e76af99 100755
--- a/components/lib/dropdown/Dropdown.vue
+++ b/components/lib/dropdown/Dropdown.vue
@@ -1,5 +1,5 @@
 <template>
-    <div ref="container" :id="id" :class="cx('root')" @click="onContainerClick" v-bind="ptm('root')" data-pc-name="dropdown">
+    <div ref="container" :id="id" :class="cx('root')" @click="onContainerClick" v-bind="getPTOptions('root')" data-pc-name="dropdown">
         <input
             v-if="editable"
             ref="focusInput"
@@ -23,7 +23,7 @@
             @blur="onBlur"
             @keydown="onKeyDown"
             @input="onEditableInput"
-            v-bind="{ ...inputProps, ...ptm('input') }"
+            v-bind="{ ...inputProps, ...getPTOptions('input') }"
         />
         <span
             v-else
@@ -43,25 +43,25 @@
             @focus="onFocus"
             @blur="onBlur"
             @keydown="onKeyDown"
-            v-bind="{ ...inputProps, ...ptm('input') }"
+            v-bind="{ ...inputProps, ...getPTOptions('input') }"
         >
             <slot name="value" :value="modelValue" :placeholder="placeholder">{{ label === 'p-emptylabel' ? '&nbsp;' : label || 'empty' }}</slot>
         </span>
         <slot v-if="showClear && modelValue != null" name="clearicon" :class="cx('clearIcon')" :onClick="onClearClick" :clearCallback="onClearClick">
-            <component :is="clearIcon ? 'i' : 'TimesIcon'" ref="clearIcon" :class="[cx('clearIcon'), clearIcon]" @click="onClearClick" v-bind="{ ...clearIconProps, ...ptm('clearIcon') }" data-pc-section="clearicon" />
+            <component :is="clearIcon ? 'i' : 'TimesIcon'" ref="clearIcon" :class="[cx('clearIcon'), clearIcon]" @click="onClearClick" v-bind="{ ...clearIconProps, ...getPTOptions('clearIcon') }" data-pc-section="clearicon" />
         </slot>
-        <div :class="cx('trigger')" v-bind="ptm('trigger')">
+        <div :class="cx('trigger')" v-bind="getPTOptions('trigger')">
             <slot v-if="loading" name="loadingicon" :class="cx('loadingIcon')">
-                <span v-if="loadingIcon" :class="[cx('loadingIcon'), 'pi-spin', loadingIcon]" aria-hidden="true" v-bind="ptm('loadingIcon')" />
-                <SpinnerIcon v-else :class="cx('loadingIcon')" spin aria-hidden="true" v-bind="ptm('loadingIcon')" />
+                <span v-if="loadingIcon" :class="[cx('loadingIcon'), 'pi-spin', loadingIcon]" aria-hidden="true" v-bind="getPTOptions('loadingIcon')" />
+                <SpinnerIcon v-else :class="cx('loadingIcon')" spin aria-hidden="true" v-bind="getPTOptions('loadingIcon')" />
             </slot>
             <slot v-else name="dropdownicon" :class="cx('dropdownIcon')">
-                <component :is="dropdownIcon ? 'span' : 'ChevronDownIcon'" :class="[cx('dropdownIcon'), dropdownIcon]" aria-hidden="true" v-bind="ptm('dropdownIcon')" />
+                <component :is="dropdownIcon ? 'span' : 'ChevronDownIcon'" :class="[cx('dropdownIcon'), dropdownIcon]" aria-hidden="true" v-bind="getPTOptions('dropdownIcon')" />
             </slot>
         </div>
         <Portal :appendTo="appendTo">
-            <transition name="p-connected-overlay" @enter="onOverlayEnter" @after-enter="onOverlayAfterEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave" v-bind="ptm('transition')">
-                <div v-if="overlayVisible" :ref="overlayRef" :class="[cx('panel'), panelClass]" :style="panelStyle" @click="onOverlayClick" @keydown="onOverlayKeyDown" v-bind="{ ...panelProps, ...ptm('panel') }">
+            <transition name="p-connected-overlay" @enter="onOverlayEnter" @after-enter="onOverlayAfterEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave" v-bind="getPTOptions('transition')">
+                <div v-if="overlayVisible" :ref="overlayRef" :class="[cx('panel'), panelClass]" :style="panelStyle" @click="onOverlayClick" @keydown="onOverlayKeyDown" v-bind="{ ...panelProps, ...getPTOptions('panel') }">
                     <span
                         ref="firstHiddenFocusableElementOnOverlay"
                         role="presentation"
@@ -69,13 +69,13 @@
                         class="p-hidden-accessible p-hidden-focusable"
                         :tabindex="0"
                         @focus="onFirstHiddenFocus"
-                        v-bind="ptm('hiddenFirstFocusableEl')"
+                        v-bind="getPTOptions('hiddenFirstFocusableEl')"
                         :data-p-hidden-accessible="true"
                         :data-p-hidden-focusable="true"
                     ></span>
                     <slot name="header" :value="modelValue" :options="visibleOptions"></slot>
-                    <div v-if="filter" :class="cx('header')" v-bind="ptm('header')">
-                        <div :class="cx('filterContainer')" v-bind="ptm('filterContainer')">
+                    <div v-if="filter" :class="cx('header')" v-bind="getPTOptions('header')">
+                        <div :class="cx('filterContainer')" v-bind="getPTOptions('filterContainer')">
                             <input
                                 ref="filterInput"
                                 type="text"
@@ -90,22 +90,29 @@
                                 @keydown="onFilterKeyDown"
                                 @blur="onFilterBlur"
                                 @input="onFilterChange"
-                                v-bind="{ ...filterInputProps, ...ptm('filterInput') }"
+                                v-bind="{ ...filterInputProps, ...getPTOptions('filterInput') }"
                             />
                             <slot name="filtericon" :class="cx('filterIcon')">
-                                <component :is="filterIcon ? 'span' : 'FilterIcon'" :class="[cx('filterIcon'), filterIcon]" v-bind="ptm('filterIcon')" />
+                                <component :is="filterIcon ? 'span' : 'FilterIcon'" :class="[cx('filterIcon'), filterIcon]" v-bind="getPTOptions('filterIcon')" />
                             </slot>
                         </div>
-                        <span role="status" aria-live="polite" class="p-hidden-accessible" v-bind="ptm('hiddenFilterResult')" :data-p-hidden-accessible="true">
+                        <span role="status" aria-live="polite" class="p-hidden-accessible" v-bind="getPTOptions('hiddenFilterResult')" :data-p-hidden-accessible="true">
                             {{ filterResultMessageText }}
                         </span>
                     </div>
-                    <div :class="cx('wrapper')" :style="{ 'max-height': virtualScrollerDisabled ? scrollHeight : '' }" v-bind="ptm('wrapper')">
-                        <VirtualScroller :ref="virtualScrollerRef" v-bind="virtualScrollerOptions" :items="visibleOptions" :style="{ height: scrollHeight }" :tabindex="-1" :disabled="virtualScrollerDisabled" :pt="ptm('virtualScroller')">
+                    <div :class="cx('wrapper')" :style="{ 'max-height': virtualScrollerDisabled ? scrollHeight : '' }" v-bind="getPTOptions('wrapper')">
+                        <VirtualScroller :ref="virtualScrollerRef" v-bind="virtualScrollerOptions" :items="visibleOptions" :style="{ height: scrollHeight }" :tabindex="-1" :disabled="virtualScrollerDisabled" :pt="getPTOptions('virtualScroller')">
                             <template v-slot:content="{ styleClass, contentRef, items, getItemOptions, contentStyle, itemSize }">
-                                <ul :ref="(el) => listRef(el, contentRef)" :id="id + '_list'" :class="[cx('list'), styleClass]" :style="contentStyle" role="listbox" v-bind="ptm('list')">
+                                <ul :ref="(el) => listRef(el, contentRef)" :id="id + '_list'" :class="[cx('list'), styleClass]" :style="contentStyle" role="listbox" v-bind="getPTOptions('list')">
                                     <template v-for="(option, i) of items" :key="getOptionRenderKey(option, getOptionIndex(i, getItemOptions))">
-                                        <li v-if="isOptionGroup(option)" :id="id + '_' + getOptionIndex(i, getItemOptions)" :style="{ height: itemSize ? itemSize + 'px' : undefined }" :class="cx('itemGroup')" role="option" v-bind="ptm('itemGroup')">
+                                        <li
+                                            v-if="isOptionGroup(option)"
+                                            :id="id + '_' + getOptionIndex(i, getItemOptions)"
+                                            :style="{ height: itemSize ? itemSize + 'px' : undefined }"
+                                            :class="cx('itemGroup')"
+                                            role="option"
+                                            v-bind="getPTOptions('itemGroup')"
+                                        >
                                             <slot name="optiongroup" :option="option.optionGroup" :index="getOptionIndex(i, getItemOptions)">{{ getOptionGroupLabel(option.optionGroup) }}</slot>
                                         </li>
                                         <li
@@ -125,15 +132,15 @@
                                             :data-p-highlight="isSelected(option)"
                                             :data-p-focused="focusedOptionIndex === getOptionIndex(i, getItemOptions)"
                                             :data-p-disabled="isOptionDisabled(option)"
-                                            v-bind="getPTOptions(option, getItemOptions, i, 'item')"
+                                            v-bind="getPTItemOptions(option, getItemOptions, i, 'item')"
                                         >
                                             <slot name="option" :option="option" :index="getOptionIndex(i, getItemOptions)">{{ getOptionLabel(option) }}</slot>
                                         </li>
                                     </template>
-                                    <li v-if="filterValue && (!items || (items && items.length === 0))" :class="cx('emptyMessage')" role="option" v-bind="ptm('emptyMessage')" :data-p-hidden-accessible="true">
+                                    <li v-if="filterValue && (!items || (items && items.length === 0))" :class="cx('emptyMessage')" role="option" v-bind="getPTOptions('emptyMessage')" :data-p-hidden-accessible="true">
                                         <slot name="emptyfilter">{{ emptyFilterMessageText }}</slot>
                                     </li>
-                                    <li v-else-if="!options || (options && options.length === 0)" :class="cx('emptyMessage')" role="option" v-bind="ptm('emptyMessage')" :data-p-hidden-accessible="true">
+                                    <li v-else-if="!options || (options && options.length === 0)" :class="cx('emptyMessage')" role="option" v-bind="getPTOptions('emptyMessage')" :data-p-hidden-accessible="true">
                                         <slot name="empty">{{ emptyMessageText }}</slot>
                                     </li>
                                 </ul>
@@ -144,10 +151,10 @@
                         </VirtualScroller>
                     </div>
                     <slot name="footer" :value="modelValue" :options="visibleOptions"></slot>
-                    <span v-if="!options || (options && options.length === 0)" role="status" aria-live="polite" class="p-hidden-accessible" v-bind="ptm('hiddenEmptyMessage')" :data-p-hidden-accessible="true">
+                    <span v-if="!options || (options && options.length === 0)" role="status" aria-live="polite" class="p-hidden-accessible" v-bind="getPTOptions('hiddenEmptyMessage')" :data-p-hidden-accessible="true">
                         {{ emptyMessageText }}
                     </span>
-                    <span role="status" aria-live="polite" class="p-hidden-accessible" v-bind="ptm('hiddenSelectedMessage')" :data-p-hidden-accessible="true">
+                    <span role="status" aria-live="polite" class="p-hidden-accessible" v-bind="getPTOptions('hiddenSelectedMessage')" :data-p-hidden-accessible="true">
                         {{ selectedMessageText }}
                     </span>
                     <span
@@ -157,7 +164,7 @@
                         class="p-hidden-accessible p-hidden-focusable"
                         :tabindex="0"
                         @focus="onLastHiddenFocus"
-                        v-bind="ptm('hiddenLastFocusableEl')"
+                        v-bind="getPTOptions('hiddenLastFocusableEl')"
                         :data-p-hidden-accessible="true"
                         :data-p-hidden-focusable="true"
                     ></span>
@@ -253,8 +260,20 @@ export default {
         getOptionRenderKey(option, index) {
             return (this.dataKey ? ObjectUtils.resolveFieldData(option, this.dataKey) : this.getOptionLabel(option)) + '_' + index;
         },
-        getPTOptions(option, itemOptions, index, key) {
+        getPTOptions(key) {
             return this.ptm(key, {
+                parent: {
+                    props: this.$parent?.$props,
+                    state: this.$parent?.$data
+                }
+            });
+        },
+        getPTItemOptions(option, itemOptions, index, key) {
+            return this.ptm(key, {
+                parent: {
+                    props: this.$parent?.$props,
+                    state: this.$parent?.$data
+                },
                 context: {
                     selected: this.isSelected(option),
                     focused: this.focusedOptionIndex === this.getOptionIndex(index, itemOptions),
diff --git a/components/lib/inputtext/InputText.vue b/components/lib/inputtext/InputText.vue
index 1f2077a9d..646f87091 100755
--- a/components/lib/inputtext/InputText.vue
+++ b/components/lib/inputtext/InputText.vue
@@ -20,6 +20,10 @@ export default {
         },
         ptmParams() {
             return {
+                parent: {
+                    props: this.$parent?.$props,
+                    state: this.$parent?.$data
+                },
                 context: {
                     filled: this.filled,
                     disabled: this.$attrs.disabled || this.$attrs.disabled === ''
diff --git a/components/lib/message/Message.vue b/components/lib/message/Message.vue
index e698a2201..cec69e2a9 100755
--- a/components/lib/message/Message.vue
+++ b/components/lib/message/Message.vue
@@ -1,18 +1,18 @@
 <template>
-    <transition name="p-message" appear v-bind="ptm('transition')">
-        <div v-show="visible" :class="cx('root')" role="alert" aria-live="assertive" aria-atomic="true" v-bind="ptm('root')" data-pc-name="message">
+    <transition name="p-message" appear v-bind="getPTOptions('transition')">
+        <div v-show="visible" :class="cx('root')" role="alert" aria-live="assertive" aria-atomic="true" v-bind="getPTOptions('root')" data-pc-name="message">
             <slot v-if="$slots.container" name="container" :onClose="close" :closeCallback="close"></slot>
-            <div v-else :class="cx('wrapper')" v-bind="ptm('wrapper')">
+            <div v-else :class="cx('wrapper')" v-bind="getPTOptions('wrapper')">
                 <slot name="messageicon" class="p-message-icon">
-                    <component :is="icon ? 'span' : iconComponent" :class="[cx('icon'), icon]" v-bind="ptm('icon')"></component>
+                    <component :is="icon ? 'span' : iconComponent" :class="[cx('icon'), icon]" v-bind="getPTOptions('icon')"></component>
                 </slot>
-                <div class="p-message-text" :class="cx('text')" v-bind="ptm('text')">
+                <div class="p-message-text" :class="cx('text')" v-bind="getPTOptions('text')">
                     <slot></slot>
                 </div>
-                <button v-if="closable" v-ripple :class="cx('closeButton')" :aria-label="closeAriaLabel" type="button" @click="close($event)" v-bind="{ ...closeButtonProps, ...ptm('button'), ...ptm('closeButton') }">
+                <button v-if="closable" v-ripple :class="cx('closeButton')" :aria-label="closeAriaLabel" type="button" @click="close($event)" v-bind="{ ...closeButtonProps, ...getPTOptions('button'), ...getPTOptions('closeButton') }">
                     <slot name="closeicon">
-                        <i v-if="closeIcon" :class="[cx('closeIcon'), closeIcon]" v-bind="{ ...ptm('buttonIcon'), ...ptm('closeIcon') }" />
-                        <TimesIcon v-else :class="[cx('closeIcon'), closeIcon]" v-bind="{ ...ptm('buttonIcon'), ...ptm('closeIcon') }" />
+                        <i v-if="closeIcon" :class="[cx('closeIcon'), closeIcon]" v-bind="{ ...getPTOptions('buttonIcon'), ...getPTOptions('closeIcon') }" />
+                        <TimesIcon v-else :class="[cx('closeIcon'), closeIcon]" v-bind="{ ...getPTOptions('buttonIcon'), ...getPTOptions('closeIcon') }" />
                     </slot>
                 </button>
             </div>
@@ -52,6 +52,14 @@ export default {
         }
     },
     methods: {
+        getPTOptions(key) {
+            return this.ptm(key, {
+                parent: {
+                    props: this.$parent?.$props,
+                    state: this.$parent?.$data
+                }
+            });
+        },
         close(event) {
             this.visible = false;
             this.$emit('close', event);
diff --git a/components/lib/progressbar/ProgressBar.vue b/components/lib/progressbar/ProgressBar.vue
index e1342e73c..80dd89cb4 100755
--- a/components/lib/progressbar/ProgressBar.vue
+++ b/components/lib/progressbar/ProgressBar.vue
@@ -1,12 +1,12 @@
 <template>
-    <div role="progressbar" :class="cx('root')" aria-valuemin="0" :aria-valuenow="value" aria-valuemax="100" v-bind="ptm('root')">
-        <div v-if="determinate" :class="cx('value')" :style="progressStyle" v-bind="ptm('value')">
-            <div v-if="value != null && value !== 0 && showValue" :class="cx('label')" v-bind="ptm('label')">
+    <div role="progressbar" :class="cx('root')" aria-valuemin="0" :aria-valuenow="value" aria-valuemax="100" v-bind="getPTOptions('root')">
+        <div v-if="determinate" :class="cx('value')" :style="progressStyle" v-bind="getPTOptions('value')">
+            <div v-if="value != null && value !== 0 && showValue" :class="cx('label')" v-bind="getPTOptions('label')">
                 <slot>{{ value + '%' }}</slot>
             </div>
         </div>
-        <div v-if="indeterminate" :class="cx('container')" v-bind="ptm('container')">
-            <div :class="cx('value')" v-bind="ptm('value')"></div>
+        <div v-if="indeterminate" :class="cx('container')" v-bind="getPTOptions('container')">
+            <div :class="cx('value')" v-bind="getPTOptions('value')"></div>
         </div>
     </div>
 </template>
@@ -17,6 +17,16 @@ import BaseProgressBar from './BaseProgressBar.vue';
 export default {
     name: 'ProgressBar',
     extends: BaseProgressBar,
+    methods: {
+        getPTOptions(key) {
+            return this.ptm(key, {
+                parent: {
+                    props: this.$parent?.$props,
+                    state: this.$parent?.$data
+                }
+            });
+        }
+    },
     computed: {
         progressStyle() {
             return {
diff --git a/components/lib/tree/Tree.vue b/components/lib/tree/Tree.vue
index 2316798d8..89fc3d1e1 100755
--- a/components/lib/tree/Tree.vue
+++ b/components/lib/tree/Tree.vue
@@ -1,21 +1,21 @@
 <template>
-    <div :class="cx('root')" v-bind="ptm('root')" data-pc-name="tree">
+    <div :class="cx('root')" v-bind="getPTOptions('root')" data-pc-name="tree">
         <template v-if="loading && loadingMode === 'mask'">
-            <div :class="cx('loadingOverlay')" v-bind="ptm('loadingOverlay')">
+            <div :class="cx('loadingOverlay')" v-bind="getPTOptions('loadingOverlay')">
                 <slot name="loadingicon" :class="cx('loadingIcon')">
-                    <i v-if="loadingIcon" :class="[cx('loadingIcon'), 'pi-spin', loadingIcon]" v-bind="ptm('loadingIcon')" />
-                    <SpinnerIcon v-else spin :class="cx('loadingIcon')" v-bind="ptm('loadingIcon')" />
+                    <i v-if="loadingIcon" :class="[cx('loadingIcon'), 'pi-spin', loadingIcon]" v-bind="getPTOptions('loadingIcon')" />
+                    <SpinnerIcon v-else spin :class="cx('loadingIcon')" v-bind="getPTOptions('loadingIcon')" />
                 </slot>
             </div>
         </template>
-        <div v-if="filter" :class="cx('filterContainer')" v-bind="ptm('filterContainer')">
-            <input v-model="filterValue" type="text" autocomplete="off" :class="cx('input')" :placeholder="filterPlaceholder" @keydown="onFilterKeydown" v-bind="ptm('input')" />
+        <div v-if="filter" :class="cx('filterContainer')" v-bind="getPTOptions('filterContainer')">
+            <input v-model="filterValue" type="text" autocomplete="off" :class="cx('input')" :placeholder="filterPlaceholder" @keydown="onFilterKeydown" v-bind="getPTOptions('input')" />
             <slot name="searchicon" :class="cx('searchIcon')">
-                <SearchIcon :class="cx('searchIcon')" v-bind="ptm('searchIcon')" />
+                <SearchIcon :class="cx('searchIcon')" v-bind="getPTOptions('searchIcon')" />
             </slot>
         </div>
-        <div :class="cx('wrapper')" :style="{ maxHeight: scrollHeight }" v-bind="ptm('wrapper')">
-            <ul :class="cx('container')" role="tree" :aria-labelledby="ariaLabelledby" :aria-label="ariaLabel" v-bind="ptm('container')">
+        <div :class="cx('wrapper')" :style="{ maxHeight: scrollHeight }" v-bind="getPTOptions('wrapper')">
+            <ul :class="cx('container')" role="tree" :aria-labelledby="ariaLabelledby" :aria-label="ariaLabel" v-bind="getPTOptions('container')">
                 <TreeNode
                     v-for="(node, index) of valueToRender"
                     :key="node.key"
@@ -61,6 +61,14 @@ export default {
         }
     },
     methods: {
+        getPTOptions(key) {
+            return this.ptm(key, {
+                parent: {
+                    props: this.$parent?.$props,
+                    state: this.$parent?.$data
+                }
+            });
+        },
         onNodeToggle(node) {
             const key = node.key;
 

From 1de2720aed49ed74fa4524e00c7177842a0102eb Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 12:50:48 +0300
Subject: [PATCH 48/69] OrderList & PickList updates

---
 components/lib/passthrough/tailwind/index.js | 448 ++++++++++---------
 1 file changed, 240 insertions(+), 208 deletions(-)

diff --git a/components/lib/passthrough/tailwind/index.js b/components/lib/passthrough/tailwind/index.js
index 5109e60fd..3a8d3cd8b 100644
--- a/components/lib/passthrough/tailwind/index.js
+++ b/components/lib/passthrough/tailwind/index.js
@@ -3147,73 +3147,81 @@ export default {
             class: 'flex flex-col justify-center p-5'
         },
         moveupbutton: {
-            root: ({ context }) => ({
-                class: [
-                    'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
-                    'text-white bg-blue-500 border border-blue-500 rounded-md',
-                    'transition duration-200 ease-in-out',
-                    'justify-center px-0 py-3', // icon only
-                    'mb-2 w-12', // orderlist button
-                    'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
-                    {
-                        'cursor-default pointer-events-none opacity-60': context.disabled
-                    }
-                ]
-            }),
+            root: ({ context }) => {
+                return {
+                    class: [
+                        'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
+                        'text-white bg-blue-500 border border-blue-500 rounded-md',
+                        'transition duration-200 ease-in-out',
+                        'justify-center px-0 py-3', // icon only
+                        'mb-2 w-12', // orderlist button
+                        'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
+                        {
+                            'cursor-default pointer-events-none opacity-60': context.disabled
+                        }
+                    ]
+                };
+            },
             label: {
                 class: 'flex-initial w-0'
             }
         },
         movetopbutton: {
-            root: ({ context }) => ({
-                class: [
-                    'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
-                    'text-white bg-blue-500 border border-blue-500 rounded-md',
-                    'transition duration-200 ease-in-out',
-                    'justify-center px-0 py-3', // icon only
-                    'mb-2 w-12', // orderlist button
-                    'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
-                    {
-                        'cursor-default pointer-events-none opacity-60': context.disabled
-                    }
-                ]
-            }),
+            root: ({ context }) => {
+                return {
+                    class: [
+                        'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
+                        'text-white bg-blue-500 border border-blue-500 rounded-md',
+                        'transition duration-200 ease-in-out',
+                        'justify-center px-0 py-3', // icon only
+                        'mb-2 w-12', // orderlist button
+                        'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
+                        {
+                            'cursor-default pointer-events-none opacity-60': context.disabled
+                        }
+                    ]
+                };
+            },
             label: {
                 class: 'flex-initial w-0'
             }
         },
         movedownbutton: {
-            root: ({ context }) => ({
-                class: [
-                    'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
-                    'text-white bg-blue-500 border border-blue-500 rounded-md',
-                    'transition duration-200 ease-in-out',
-                    'justify-center px-0 py-3', // icon only
-                    'mb-2 w-12', // orderlist button
-                    'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
-                    {
-                        'cursor-default pointer-events-none opacity-60': context.disabled
-                    }
-                ]
-            }),
+            root: ({ context }) => {
+                return {
+                    class: [
+                        'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
+                        'text-white bg-blue-500 border border-blue-500 rounded-md',
+                        'transition duration-200 ease-in-out',
+                        'justify-center px-0 py-3', // icon only
+                        'mb-2 w-12', // orderlist button
+                        'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
+                        {
+                            'cursor-default pointer-events-none opacity-60': context.disabled
+                        }
+                    ]
+                };
+            },
             label: {
                 class: 'flex-initial w-0'
             }
         },
         movebottombutton: {
-            root: ({ context }) => ({
-                class: [
-                    'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
-                    'text-white bg-blue-500 border border-blue-500 rounded-md',
-                    'transition duration-200 ease-in-out',
-                    'justify-center px-0 py-3', // icon only
-                    'mb-2 w-12', // orderlist button
-                    'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
-                    {
-                        'cursor-default pointer-events-none opacity-60': context.disabled
-                    }
-                ]
-            }),
+            root: ({ context }) => {
+                return {
+                    class: [
+                        'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
+                        'text-white bg-blue-500 border border-blue-500 rounded-md',
+                        'transition duration-200 ease-in-out',
+                        'justify-center px-0 py-3', // icon only
+                        'mb-2 w-12', // orderlist button
+                        'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
+                        {
+                            'cursor-default pointer-events-none opacity-60': context.disabled
+                        }
+                    ]
+                };
+            },
             label: {
                 class: 'flex-initial w-0'
             }
@@ -3255,73 +3263,81 @@ export default {
             class: 'flex flex-col justify-center p-5'
         },
         sourcemoveupbutton: {
-            root: ({ context }) => ({
-                class: [
-                    'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
-                    'text-white bg-blue-500 border border-blue-500 rounded-md',
-                    'transition duration-200 ease-in-out',
-                    'justify-center px-0 py-3', // icon only
-                    'mb-2 w-12', // orderlist button
-                    'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
-                    {
-                        'cursor-default pointer-events-none opacity-60': context.disabled
-                    }
-                ]
-            }),
+            root: ({ context }) => {
+                return {
+                    class: [
+                        'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
+                        'text-white bg-blue-500 border border-blue-500 rounded-md',
+                        'transition duration-200 ease-in-out',
+                        'justify-center px-0 py-3', // icon only
+                        'mb-2 w-12', // orderlist button
+                        'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
+                        {
+                            'cursor-default pointer-events-none opacity-60': context.disabled
+                        }
+                    ]
+                };
+            },
             label: {
                 class: 'flex-initial w-0'
             }
         },
         sourcemovetopbutton: {
-            root: ({ context }) => ({
-                class: [
-                    'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
-                    'text-white bg-blue-500 border border-blue-500 rounded-md',
-                    'transition duration-200 ease-in-out',
-                    'justify-center px-0 py-3', // icon only
-                    'mb-2 w-12', // orderlist button
-                    'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
-                    {
-                        'cursor-default pointer-events-none opacity-60': context.disabled
-                    }
-                ]
-            }),
+            root: ({ context }) => {
+                return {
+                    class: [
+                        'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
+                        'text-white bg-blue-500 border border-blue-500 rounded-md',
+                        'transition duration-200 ease-in-out',
+                        'justify-center px-0 py-3', // icon only
+                        'mb-2 w-12', // orderlist button
+                        'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
+                        {
+                            'cursor-default pointer-events-none opacity-60': context.disabled
+                        }
+                    ]
+                };
+            },
             label: {
                 class: 'flex-initial w-0'
             }
         },
         sourcemovedownbutton: {
-            root: ({ context }) => ({
-                class: [
-                    'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
-                    'text-white bg-blue-500 border border-blue-500 rounded-md',
-                    'transition duration-200 ease-in-out',
-                    'justify-center px-0 py-3', // icon only
-                    'mb-2 w-12', // orderlist button
-                    'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
-                    {
-                        'cursor-default pointer-events-none opacity-60': context.disabled
-                    }
-                ]
-            }),
+            root: ({ context }) => {
+                return {
+                    class: [
+                        'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
+                        'text-white bg-blue-500 border border-blue-500 rounded-md',
+                        'transition duration-200 ease-in-out',
+                        'justify-center px-0 py-3', // icon only
+                        'mb-2 w-12', // orderlist button
+                        'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
+                        {
+                            'cursor-default pointer-events-none opacity-60': context.disabled
+                        }
+                    ]
+                };
+            },
             label: {
                 class: 'flex-initial w-0'
             }
         },
         sourcemovebottombutton: {
-            root: ({ context }) => ({
-                class: [
-                    'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
-                    'text-white bg-blue-500 border border-blue-500 rounded-md',
-                    'transition duration-200 ease-in-out',
-                    'justify-center px-0 py-3', // icon only
-                    'mb-2 w-12', // orderlist button
-                    'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
-                    {
-                        'cursor-default pointer-events-none opacity-60': context.disabled
-                    }
-                ]
-            }),
+            root: ({ context }) => {
+                return {
+                    class: [
+                        'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
+                        'text-white bg-blue-500 border border-blue-500 rounded-md',
+                        'transition duration-200 ease-in-out',
+                        'justify-center px-0 py-3', // icon only
+                        'mb-2 w-12', // orderlist button
+                        'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
+                        {
+                            'cursor-default pointer-events-none opacity-60': context.disabled
+                        }
+                    ]
+                };
+            },
             label: {
                 class: 'flex-initial w-0'
             }
@@ -3358,73 +3374,81 @@ export default {
             class: 'flex flex-col justify-center p-5'
         },
         movetotargetbutton: {
-            root: ({ context }) => ({
-                class: [
-                    'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
-                    'text-white bg-blue-500 border border-blue-500 rounded-md',
-                    'transition duration-200 ease-in-out',
-                    'justify-center px-0 py-3', // icon only
-                    'mb-2 w-12', // orderlist button
-                    'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
-                    {
-                        'cursor-default pointer-events-none opacity-60': context.disabled
-                    }
-                ]
-            }),
+            root: ({ context }) => {
+                return {
+                    class: [
+                        'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
+                        'text-white bg-blue-500 border border-blue-500 rounded-md',
+                        'transition duration-200 ease-in-out',
+                        'justify-center px-0 py-3', // icon only
+                        'mb-2 w-12', // orderlist button
+                        'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
+                        {
+                            'cursor-default pointer-events-none opacity-60': context.disabled
+                        }
+                    ]
+                };
+            },
             label: {
                 class: 'flex-initial w-0'
             }
         },
         movealltotargetbutton: {
-            root: ({ context }) => ({
-                class: [
-                    'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
-                    'text-white bg-blue-500 border border-blue-500 rounded-md',
-                    'transition duration-200 ease-in-out',
-                    'justify-center px-0 py-3', // icon only
-                    'mb-2 w-12', // orderlist button
-                    'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
-                    {
-                        'cursor-default pointer-events-none opacity-60': context.disabled
-                    }
-                ]
-            }),
+            root: ({ context }) => {
+                return {
+                    class: [
+                        'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
+                        'text-white bg-blue-500 border border-blue-500 rounded-md',
+                        'transition duration-200 ease-in-out',
+                        'justify-center px-0 py-3', // icon only
+                        'mb-2 w-12', // orderlist button
+                        'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
+                        {
+                            'cursor-default pointer-events-none opacity-60': context.disabled
+                        }
+                    ]
+                };
+            },
             label: {
                 class: 'flex-initial w-0'
             }
         },
         movetosourcebutton: {
-            root: ({ context }) => ({
-                class: [
-                    'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
-                    'text-white bg-blue-500 border border-blue-500 rounded-md',
-                    'transition duration-200 ease-in-out',
-                    'justify-center px-0 py-3', // icon only
-                    'mb-2 w-12', // orderlist button
-                    'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
-                    {
-                        'cursor-default pointer-events-none opacity-60': context.disabled
-                    }
-                ]
-            }),
+            root: ({ context }) => {
+                return {
+                    class: [
+                        'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
+                        'text-white bg-blue-500 border border-blue-500 rounded-md',
+                        'transition duration-200 ease-in-out',
+                        'justify-center px-0 py-3', // icon only
+                        'mb-2 w-12', // orderlist button
+                        'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
+                        {
+                            'cursor-default pointer-events-none opacity-60': context.disabled
+                        }
+                    ]
+                };
+            },
             label: {
                 class: 'flex-initial w-0'
             }
         },
         movealltosourcebutton: {
-            root: ({ context }) => ({
-                class: [
-                    'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
-                    'text-white bg-blue-500 border border-blue-500 rounded-md',
-                    'transition duration-200 ease-in-out',
-                    'justify-center px-0 py-3', // icon only
-                    'mb-2 w-12', // orderlist button
-                    'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
-                    {
-                        'cursor-default pointer-events-none opacity-60': context.disabled
-                    }
-                ]
-            }),
+            root: ({ context }) => {
+                return {
+                    class: [
+                        'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
+                        'text-white bg-blue-500 border border-blue-500 rounded-md',
+                        'transition duration-200 ease-in-out',
+                        'justify-center px-0 py-3', // icon only
+                        'mb-2 w-12', // orderlist button
+                        'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
+                        {
+                            'cursor-default pointer-events-none opacity-60': context.disabled
+                        }
+                    ]
+                };
+            },
             label: {
                 class: 'flex-initial w-0'
             }
@@ -3433,73 +3457,81 @@ export default {
             class: 'flex flex-col justify-center p-5'
         },
         targetmoveupbutton: {
-            root: ({ context }) => ({
-                class: [
-                    'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
-                    'text-white bg-blue-500 border border-blue-500 rounded-md',
-                    'transition duration-200 ease-in-out',
-                    'justify-center px-0 py-3', // icon only
-                    'mb-2 w-12', // orderlist button
-                    'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
-                    {
-                        'cursor-default pointer-events-none opacity-60': context.disabled
-                    }
-                ]
-            }),
+            root: ({ context }) => {
+                return {
+                    class: [
+                        'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
+                        'text-white bg-blue-500 border border-blue-500 rounded-md',
+                        'transition duration-200 ease-in-out',
+                        'justify-center px-0 py-3', // icon only
+                        'mb-2 w-12', // orderlist button
+                        'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
+                        {
+                            'cursor-default pointer-events-none opacity-60': context.disabled
+                        }
+                    ]
+                };
+            },
             label: {
                 class: 'flex-initial w-0'
             }
         },
         targetmovetopbutton: {
-            root: ({ context }) => ({
-                class: [
-                    'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
-                    'text-white bg-blue-500 border border-blue-500 rounded-md',
-                    'transition duration-200 ease-in-out',
-                    'justify-center px-0 py-3', // icon only
-                    'mb-2 w-12', // orderlist button
-                    'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
-                    {
-                        'cursor-default pointer-events-none opacity-60': context.disabled
-                    }
-                ]
-            }),
+            root: ({ context }) => {
+                return {
+                    class: [
+                        'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
+                        'text-white bg-blue-500 border border-blue-500 rounded-md',
+                        'transition duration-200 ease-in-out',
+                        'justify-center px-0 py-3', // icon only
+                        'mb-2 w-12', // orderlist button
+                        'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
+                        {
+                            'cursor-default pointer-events-none opacity-60': context.disabled
+                        }
+                    ]
+                };
+            },
             label: {
                 class: 'flex-initial w-0'
             }
         },
         targetmovedownbutton: {
-            root: ({ context }) => ({
-                class: [
-                    'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
-                    'text-white bg-blue-500 border border-blue-500 rounded-md',
-                    'transition duration-200 ease-in-out',
-                    'justify-center px-0 py-3', // icon only
-                    'mb-2 w-12', // orderlist button
-                    'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
-                    {
-                        'cursor-default pointer-events-none opacity-60': context.disabled
-                    }
-                ]
-            }),
+            root: ({ context }) => {
+                return {
+                    class: [
+                        'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
+                        'text-white bg-blue-500 border border-blue-500 rounded-md',
+                        'transition duration-200 ease-in-out',
+                        'justify-center px-0 py-3', // icon only
+                        'mb-2 w-12', // orderlist button
+                        'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
+                        {
+                            'cursor-default pointer-events-none opacity-60': context.disabled
+                        }
+                    ]
+                };
+            },
             label: {
                 class: 'flex-initial w-0'
             }
         },
         targetmovebottombutton: {
-            root: ({ context }) => ({
-                class: [
-                    'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
-                    'text-white bg-blue-500 border border-blue-500 rounded-md',
-                    'transition duration-200 ease-in-out',
-                    'justify-center px-0 py-3', // icon only
-                    'mb-2 w-12', // orderlist button
-                    'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
-                    {
-                        'cursor-default pointer-events-none opacity-60': context.disabled
-                    }
-                ]
-            }),
+            root: ({ context }) => {
+                return {
+                    class: [
+                        'relative inline-flex cursor-pointer select-none items-center align-bottom text-center overflow-hidden m-0', // button component
+                        'text-white bg-blue-500 border border-blue-500 rounded-md',
+                        'transition duration-200 ease-in-out',
+                        'justify-center px-0 py-3', // icon only
+                        'mb-2 w-12', // orderlist button
+                        'dark:bg-sky-300 dark:border-sky-300 dark:text-gray-900', //Dark Mode
+                        {
+                            'cursor-default pointer-events-none opacity-60': context.disabled
+                        }
+                    ]
+                };
+            },
             label: {
                 class: 'flex-initial w-0'
             }

From de6ad7a58cea4da1dc4ba76cdb84c8fa9a1b39bb Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 12:50:56 +0300
Subject: [PATCH 49/69] Update index.json

---
 doc/common/apidoc/index.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/doc/common/apidoc/index.json b/doc/common/apidoc/index.json
index 91c163da9..0f11e7919 100644
--- a/doc/common/apidoc/index.json
+++ b/doc/common/apidoc/index.json
@@ -53459,7 +53459,7 @@
                             "name": "tree",
                             "optional": true,
                             "readonly": false,
-                            "type": "TreePassThroughOptionType<TreeSelectSharedPassThroughMethodOptions>",
+                            "type": "TreePassThroughOptions<TreeSelectSharedPassThroughMethodOptions>",
                             "default": "",
                             "description": "Used to pass attributes to Tree component."
                         },

From 2c9a39654de0ca857b2394ed1465a111f174f666 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 12:56:30 +0300
Subject: [PATCH 50/69] Chart styled and unstyled mode updates

---
 components/lib/chart/Chart.vue               |  2 +-
 components/lib/chart/style/ChartStyle.js     | 12 ++++--------
 components/lib/passthrough/tailwind/index.js |  6 ------
 3 files changed, 5 insertions(+), 15 deletions(-)

diff --git a/components/lib/chart/Chart.vue b/components/lib/chart/Chart.vue
index f2c5f55de..4c326e593 100755
--- a/components/lib/chart/Chart.vue
+++ b/components/lib/chart/Chart.vue
@@ -1,5 +1,5 @@
 <template>
-    <div :class="cx('root')" v-bind="ptm('root')" data-pc-name="chart">
+    <div :class="cx('root')" :style="sx('root')" v-bind="ptm('root')" data-pc-name="chart">
         <canvas ref="canvas" :width="width" :height="height" @click="onCanvasClick($event)" v-bind="{ ...canvasProps, ...ptm('canvas') }"></canvas>
     </div>
 </template>
diff --git a/components/lib/chart/style/ChartStyle.js b/components/lib/chart/style/ChartStyle.js
index caec2009a..8fa6b3480 100644
--- a/components/lib/chart/style/ChartStyle.js
+++ b/components/lib/chart/style/ChartStyle.js
@@ -1,12 +1,8 @@
 import BaseStyle from 'primevue/base/style';
 
-const css = `
-@layer primevue {
-    .p-chart {
-        position: relative;
-    }
-}
-`;
+const inlineStyles = {
+    root: { position: 'relative' }
+};
 
 const classes = {
     root: 'p-chart'
@@ -14,6 +10,6 @@ const classes = {
 
 export default BaseStyle.extend({
     name: 'chart',
-    css,
+    inlineStyles,
     classes
 });
diff --git a/components/lib/passthrough/tailwind/index.js b/components/lib/passthrough/tailwind/index.js
index 3a8d3cd8b..bc5a853c4 100644
--- a/components/lib/passthrough/tailwind/index.js
+++ b/components/lib/passthrough/tailwind/index.js
@@ -4249,11 +4249,5 @@ export default {
         resizehelper: {
             class: 'absolute hidden w-px z-10 bg-blue-500 dark:bg-blue-300'
         }
-    },
-    // CHART
-    chart: {
-        root: {
-            class: 'relative'
-        }
     }
 };

From c1bcb257de3c07d40d96ebd8106b4a821d81401f Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 13:08:25 +0300
Subject: [PATCH 51/69] parent parameter added

---
 components/lib/inputnumber/InputNumber.vue | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/components/lib/inputnumber/InputNumber.vue b/components/lib/inputnumber/InputNumber.vue
index fddd1628e..d6c531a35 100755
--- a/components/lib/inputnumber/InputNumber.vue
+++ b/components/lib/inputnumber/InputNumber.vue
@@ -1,5 +1,5 @@
 <template>
-    <span :class="cx('root')" v-bind="ptm('root')" data-pc-name="inputnumber">
+    <span :class="cx('root')" v-bind="getPTOptions('root')" data-pc-name="inputnumber">
         <INInputText
             ref="input"
             :id="inputId"
@@ -27,7 +27,7 @@
             :unstyled="unstyled"
             data-pc-section="input"
         />
-        <span v-if="showButtons && buttonLayout === 'stacked'" :class="cx('buttonGroup')" v-bind="ptm('buttonGroup')">
+        <span v-if="showButtons && buttonLayout === 'stacked'" :class="cx('buttonGroup')" v-bind="getPTOptions('buttonGroup')">
             <INButton
                 :class="[cx('incrementButton'), incrementButtonClass]"
                 v-on="upButtonListeners"
@@ -173,6 +173,14 @@ export default {
         this.constructParser();
     },
     methods: {
+        getPTOptions(key) {
+            return this.ptm(key, {
+                parent: {
+                    props: this.$parent?.$props,
+                    state: this.$parent?.$data
+                }
+            });
+        },
         getOptions() {
             return {
                 localeMatcher: this.localeMatcher,

From 1a4bba81073b8111c7fb47db2fe9df27cdccd155 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 13:14:27 +0300
Subject: [PATCH 52/69] Chart unstyled code section deleted

---
 doc/chart/theming/TailwindDoc.vue | 14 ++------------
 1 file changed, 2 insertions(+), 12 deletions(-)

diff --git a/doc/chart/theming/TailwindDoc.vue b/doc/chart/theming/TailwindDoc.vue
index 3fa45d933..ddca97b5c 100644
--- a/doc/chart/theming/TailwindDoc.vue
+++ b/doc/chart/theming/TailwindDoc.vue
@@ -4,9 +4,8 @@
             PrimeVue offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the
             <PrimeVueNuxtLink to="/tailwind">Tailwind Customization</PrimeVueNuxtLink> section for an example.
         </p>
-        <DocSectionCode :code="code1" hideToggleCode importCode hideCodeSandbox hideStackBlitz scrollable />
         <p class="mt-4">A playground sample with the pre-built Tailwind theme.</p>
-        <DocSectionCode :code="code2" :dependencies="{ 'chart.js': '3.3.2' }" component="Chart" embedded />
+        <DocSectionCode :code="code" :dependencies="{ 'chart.js': '3.3.2' }" component="Chart" embedded />
     </DocSectionText>
 </template>
 
@@ -14,16 +13,7 @@
 export default {
     data() {
         return {
-            code1: {
-                basic: `
-export default {
-    chart: {
-        root: 'relative'
-    }
-}
-`
-            },
-            code2: {
+            code: {
                 composition: `
 <template>
     <div class="card">

From eb00b8ee23b839015c93742a8dc99a45eb6fecdf Mon Sep 17 00:00:00 2001
From: mertsincan <sincan.mert@gmail.com>
Date: Tue, 5 Dec 2023 11:06:32 +0000
Subject: [PATCH 53/69] Fixed #4929 - Add parent param to all pt method options

---
 components/lib/accordion/Accordion.d.ts       |  4 ++
 components/lib/accordion/Accordion.vue        |  1 +
 components/lib/accordiontab/AccordionTab.d.ts |  5 +-
 components/lib/autocomplete/AutoComplete.d.ts |  4 ++
 components/lib/avatar/Avatar.d.ts             |  5 +-
 components/lib/avatar/Avatar.vue              | 15 ++--
 components/lib/badge/Badge.vue                | 14 +---
 .../lib/badgedirective/BadgeDirective.d.ts    |  4 ++
 .../lib/basecomponent/BaseComponent.vue       | 15 +++-
 components/lib/blockui/BlockUI.d.ts           |  4 ++
 components/lib/breadcrumb/Breadcrumb.d.ts     |  4 ++
 components/lib/button/Button.vue              |  4 --
 components/lib/calendar/Calendar.d.ts         |  4 ++
 components/lib/carousel/Carousel.d.ts         |  4 ++
 .../lib/cascadeselect/CascadeSelect.d.ts      |  4 ++
 components/lib/chart/Chart.d.ts               |  4 ++
 components/lib/checkbox/Checkbox.d.ts         |  4 ++
 components/lib/chip/Chip.d.ts                 |  4 ++
 components/lib/chips/Chips.d.ts               |  4 ++
 components/lib/colorpicker/ColorPicker.d.ts   |  4 ++
 components/lib/column/Column.d.ts             |  4 +-
 components/lib/columngroup/ColumnGroup.d.ts   |  5 +-
 .../lib/confirmdialog/ConfirmDialog.d.ts      |  4 ++
 components/lib/confirmpopup/ConfirmPopup.d.ts |  4 ++
 components/lib/contextmenu/ContextMenu.d.ts   |  4 ++
 components/lib/datatable/BodyCell.vue         |  1 +
 components/lib/datatable/ColumnFilter.vue     |  1 +
 components/lib/datatable/DataTable.d.ts       |  4 ++
 components/lib/datatable/FooterCell.vue       |  1 +
 components/lib/datatable/HeaderCell.vue       |  1 +
 components/lib/datatable/HeaderCheckbox.vue   |  1 +
 components/lib/datatable/RowCheckbox.vue      |  1 +
 components/lib/datatable/RowRadioButton.vue   |  1 +
 components/lib/datatable/TableBody.vue        |  1 +
 components/lib/datatable/TableFooter.vue      |  2 +
 components/lib/datatable/TableHeader.vue      |  3 +
 components/lib/dataview/DataView.d.ts         |  4 ++
 .../DataViewLayoutOptions.d.ts                |  4 ++
 .../lib/deferredcontent/DeferredContent.d.ts  |  4 ++
 components/lib/divider/Divider.d.ts           |  4 ++
 components/lib/dock/Dock.d.ts                 |  4 ++
 components/lib/dropdown/Dropdown.vue          | 69 +++++++------------
 components/lib/editor/Editor.d.ts             |  4 ++
 components/lib/fieldset/Fieldset.d.ts         |  4 ++
 components/lib/fileupload/FileUpload.d.ts     |  4 ++
 components/lib/galleria/Galleria.d.ts         |  4 ++
 components/lib/image/Image.d.ts               |  4 ++
 .../lib/inlinemessage/InlineMessage.d.ts      |  4 ++
 components/lib/inplace/Inplace.d.ts           |  4 ++
 components/lib/inputgroup/InputGroup.d.ts     |  4 ++
 .../lib/inputgroupaddon/InputGroupAddon.d.ts  |  4 ++
 components/lib/inputmask/InputMask.d.ts       |  4 ++
 components/lib/inputnumber/InputNumber.vue    | 12 +---
 components/lib/inputswitch/InputSwitch.d.ts   |  4 ++
 components/lib/inputtext/InputText.vue        | 12 ++--
 components/lib/knob/Knob.d.ts                 |  4 ++
 components/lib/listbox/Listbox.d.ts           |  4 ++
 components/lib/megamenu/MegaMenu.d.ts         |  4 ++
 components/lib/menu/Menu.d.ts                 |  4 ++
 components/lib/menubar/Menubar.d.ts           |  4 ++
 components/lib/message/Message.vue            | 24 +++----
 components/lib/multiselect/MultiSelect.d.ts   |  4 ++
 components/lib/orderlist/OrderList.d.ts       |  4 ++
 .../organizationchart/OrganizationChart.d.ts  |  4 ++
 components/lib/overlaypanel/OverlayPanel.d.ts |  4 ++
 components/lib/panel/Panel.d.ts               |  4 ++
 components/lib/panelmenu/PanelMenu.d.ts       |  4 ++
 components/lib/password/Password.d.ts         |  4 ++
 components/lib/picklist/PickList.d.ts         |  4 ++
 components/lib/progressbar/ProgressBar.vue    | 20 ++----
 .../lib/progressspinner/ProgressSpinner.d.ts  |  4 ++
 components/lib/radiobutton/RadioButton.d.ts   |  4 ++
 components/lib/rating/Rating.d.ts             |  4 ++
 components/lib/row/Row.d.ts                   |  5 +-
 components/lib/scrollpanel/ScrollPanel.d.ts   |  4 ++
 components/lib/scrolltop/ScrollTop.d.ts       |  4 ++
 components/lib/selectbutton/SelectButton.d.ts |  4 ++
 components/lib/sidebar/Sidebar.d.ts           |  4 ++
 components/lib/skeleton/Skeleton.d.ts         |  4 ++
 components/lib/slider/Slider.d.ts             |  4 ++
 components/lib/speeddial/SpeedDial.d.ts       |  4 ++
 components/lib/splitbutton/SplitButton.d.ts   |  4 ++
 components/lib/splitter/Splitter.d.ts         |  4 ++
 .../lib/splitterpanel/SplitterPanel.d.ts      |  4 ++
 components/lib/steps/Steps.d.ts               |  4 ++
 components/lib/tabmenu/TabMenu.d.ts           |  4 ++
 components/lib/tabpanel/TabPanel.d.ts         |  9 ++-
 components/lib/tabview/TabView.vue            |  1 +
 components/lib/tag/Tag.d.ts                   |  4 ++
 components/lib/terminal/Terminal.d.ts         |  4 ++
 components/lib/textarea/Textarea.d.ts         |  4 ++
 components/lib/timeline/Timeline.d.ts         |  4 ++
 components/lib/toast/Toast.d.ts               |  4 ++
 components/lib/togglebutton/ToggleButton.d.ts |  4 ++
 components/lib/toolbar/Toolbar.d.ts           |  4 ++
 components/lib/tooltip/Tooltip.d.ts           |  4 ++
 components/lib/tree/Tree.vue                  | 26 +++----
 components/lib/treeselect/TreeSelect.d.ts     |  4 ++
 components/lib/treetable/BodyCell.vue         |  4 +-
 components/lib/treetable/FooterCell.vue       |  1 +
 components/lib/treetable/HeaderCell.vue       |  1 +
 components/lib/treetable/TreeTable.d.ts       |  4 ++
 .../tristatecheckbox/TriStateCheckbox.d.ts    |  4 ++
 .../lib/virtualscroller/VirtualScroller.d.ts  |  4 ++
 104 files changed, 399 insertions(+), 158 deletions(-)

diff --git a/components/lib/accordion/Accordion.d.ts b/components/lib/accordion/Accordion.d.ts
index b3f3fece9..fdb67e367 100755
--- a/components/lib/accordion/Accordion.d.ts
+++ b/components/lib/accordion/Accordion.d.ts
@@ -31,6 +31,10 @@ export interface AccordionPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: AccordionState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/accordion/Accordion.vue b/components/lib/accordion/Accordion.vue
index 601382f12..2814f52dd 100755
--- a/components/lib/accordion/Accordion.vue
+++ b/components/lib/accordion/Accordion.vue
@@ -106,6 +106,7 @@ export default {
             const tabMetaData = {
                 props: tab.props || {},
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
diff --git a/components/lib/accordiontab/AccordionTab.d.ts b/components/lib/accordiontab/AccordionTab.d.ts
index e7c54415a..41ca49c03 100755
--- a/components/lib/accordiontab/AccordionTab.d.ts
+++ b/components/lib/accordiontab/AccordionTab.d.ts
@@ -8,7 +8,6 @@
  *
  */
 import { AnchorHTMLAttributes, HTMLAttributes, TransitionProps, VNode } from 'vue';
-import { AccordionPassThroughOptions } from '../accordion';
 import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 
@@ -29,9 +28,9 @@ export interface AccordionTabPassThroughMethodOptions {
      */
     props: AccordionTabProps;
     /**
-     * Defines parent instance.
+     * Defines parent options.
      */
-    parent: AccordionPassThroughOptions;
+    parent: any;
     /**
      * Defines current options.
      */
diff --git a/components/lib/autocomplete/AutoComplete.d.ts b/components/lib/autocomplete/AutoComplete.d.ts
index 5266f582d..0d0cb7183 100755
--- a/components/lib/autocomplete/AutoComplete.d.ts
+++ b/components/lib/autocomplete/AutoComplete.d.ts
@@ -38,6 +38,10 @@ export interface AutoCompletePassThroughMethodOptions {
      * Defines current options.
      */
     context: AutoCompleteContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/avatar/Avatar.d.ts b/components/lib/avatar/Avatar.d.ts
index c2a23cb0f..94b3e9fe7 100644
--- a/components/lib/avatar/Avatar.d.ts
+++ b/components/lib/avatar/Avatar.d.ts
@@ -7,7 +7,6 @@
  * @module avatar
  */
 import { VNode } from 'vue';
-import { AvatarGroupPassThroughOptions } from '../avatargroup';
 import { ComponentHooks } from '../basecomponent';
 import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
@@ -27,9 +26,9 @@ export interface AvatarPassThroughMethodOptions {
      */
     props: AvatarProps;
     /**
-     * Defines parent instance.
+     * Defines parent options.
      */
-    parent: AvatarGroupPassThroughOptions;
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/avatar/Avatar.vue b/components/lib/avatar/Avatar.vue
index 892e6fa58..4f772d63b 100644
--- a/components/lib/avatar/Avatar.vue
+++ b/components/lib/avatar/Avatar.vue
@@ -1,10 +1,10 @@
 <template>
-    <div :class="cx('root')" :aria-labelledby="ariaLabelledby" :aria-label="ariaLabel" v-bind="getPTOptions('root')" data-pc-name="avatar">
+    <div :class="cx('root')" :aria-labelledby="ariaLabelledby" :aria-label="ariaLabel" v-bind="ptm('root')" data-pc-name="avatar">
         <slot>
-            <span v-if="label" :class="cx('label')" v-bind="getPTOptions('label')">{{ label }}</span>
+            <span v-if="label" :class="cx('label')" v-bind="ptm('label')">{{ label }}</span>
             <component v-else-if="$slots.icon" :is="$slots.icon" :class="cx('icon')" />
-            <span v-else-if="icon" :class="[cx('icon'), icon]" v-bind="getPTOptions('icon')" />
-            <img v-else-if="image" :src="image" :alt="ariaLabel" @error="onError" v-bind="getPTOptions('image')" />
+            <span v-else-if="icon" :class="[cx('icon'), icon]" v-bind="ptm('icon')" />
+            <img v-else-if="image" :src="image" :alt="ariaLabel" @error="onError" v-bind="ptm('image')" />
         </slot>
     </div>
 </template>
@@ -19,13 +19,6 @@ export default {
     methods: {
         onError(event) {
             this.$emit('error', event);
-        },
-        getPTOptions(key) {
-            return this.ptm(key, {
-                parent: {
-                    instance: this.$parent
-                }
-            });
         }
     }
 };
diff --git a/components/lib/badge/Badge.vue b/components/lib/badge/Badge.vue
index 4aab24f64..e6dbe943a 100644
--- a/components/lib/badge/Badge.vue
+++ b/components/lib/badge/Badge.vue
@@ -1,5 +1,5 @@
 <template>
-    <span :class="cx('root')" v-bind="getPTOptions('root')" data-pc-name="badge">
+    <span :class="cx('root')" v-bind="ptm('root')" data-pc-name="badge">
         <slot>{{ value }}</slot>
     </span>
 </template>
@@ -9,16 +9,6 @@ import BaseBadge from './BaseBadge.vue';
 
 export default {
     name: 'Badge',
-    extends: BaseBadge,
-    methods: {
-        getPTOptions(key) {
-            return this.ptm(key, {
-                parent: {
-                    props: this.$parent?.$props,
-                    state: this.$parent?.$data
-                }
-            });
-        }
-    }
+    extends: BaseBadge
 };
 </script>
diff --git a/components/lib/badgedirective/BadgeDirective.d.ts b/components/lib/badgedirective/BadgeDirective.d.ts
index 6fd22400c..37a04266e 100644
--- a/components/lib/badgedirective/BadgeDirective.d.ts
+++ b/components/lib/badgedirective/BadgeDirective.d.ts
@@ -18,6 +18,10 @@ export declare type BadgeDirectivePassThroughOptionType = BadgeDirectivePassThro
  */
 export interface BadgePassThroughMethodOptions {
     context: BadgeContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/basecomponent/BaseComponent.vue b/components/lib/basecomponent/BaseComponent.vue
index 5b1d13831..e0df910e1 100644
--- a/components/lib/basecomponent/BaseComponent.vue
+++ b/components/lib/basecomponent/BaseComponent.vue
@@ -202,7 +202,20 @@ export default {
             return this.unstyled !== undefined ? this.unstyled : this.$config?.unstyled;
         },
         $params() {
-            return { instance: this, props: this.$props, state: this.$data, parentInstance: this.$parentInstance };
+            const parentInstance = this.$parentInstance || this.$parent;
+
+            return {
+                instance: this,
+                props: this.$props,
+                state: this.$data,
+                parent: {
+                    instance: parentInstance,
+                    props: parentInstance?.$props,
+                    state: parentInstance?.$data
+                },
+                /* @deprecated since v3.43.0. Use the `parent.instance` instead of the `parentInstance`.*/
+                parentInstance
+            };
         },
         $style() {
             return { classes: undefined, inlineStyles: undefined, loadStyle: () => {}, loadCustomStyle: () => {}, ...(this._getHostInstance(this) || {}).$style, ...this.$options.style };
diff --git a/components/lib/blockui/BlockUI.d.ts b/components/lib/blockui/BlockUI.d.ts
index e8819a7fb..8df41b3f4 100755
--- a/components/lib/blockui/BlockUI.d.ts
+++ b/components/lib/blockui/BlockUI.d.ts
@@ -30,6 +30,10 @@ export interface BlockUIPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: BlockUIState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/breadcrumb/Breadcrumb.d.ts b/components/lib/breadcrumb/Breadcrumb.d.ts
index add4421ad..1156bd2ea 100755
--- a/components/lib/breadcrumb/Breadcrumb.d.ts
+++ b/components/lib/breadcrumb/Breadcrumb.d.ts
@@ -31,6 +31,10 @@ export interface BreadcrumbPassThroughMethodOptions {
      * Defines current options.
      */
     context: BreadcrumbContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/button/Button.vue b/components/lib/button/Button.vue
index b36c52f3e..59bed7278 100755
--- a/components/lib/button/Button.vue
+++ b/components/lib/button/Button.vue
@@ -26,10 +26,6 @@ export default {
     methods: {
         getPTOptions(key) {
             return this.ptm(key, {
-                parent: {
-                    props: this.$parent?.$props,
-                    state: this.$parent?.$data
-                },
                 context: {
                     disabled: this.disabled
                 }
diff --git a/components/lib/calendar/Calendar.d.ts b/components/lib/calendar/Calendar.d.ts
index b399e31d4..59d067f00 100755
--- a/components/lib/calendar/Calendar.d.ts
+++ b/components/lib/calendar/Calendar.d.ts
@@ -37,6 +37,10 @@ export interface CalendarPassThroughMethodOptions {
      * Defines current options.
      */
     context: CalendarContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/carousel/Carousel.d.ts b/components/lib/carousel/Carousel.d.ts
index cbc767c69..92b95b798 100755
--- a/components/lib/carousel/Carousel.d.ts
+++ b/components/lib/carousel/Carousel.d.ts
@@ -34,6 +34,10 @@ export interface CarouselPassThroughMethodOptions {
      * Defines current options.
      */
     context: CarouselContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/cascadeselect/CascadeSelect.d.ts b/components/lib/cascadeselect/CascadeSelect.d.ts
index 79a1d3230..d0da2ba0a 100644
--- a/components/lib/cascadeselect/CascadeSelect.d.ts
+++ b/components/lib/cascadeselect/CascadeSelect.d.ts
@@ -32,6 +32,10 @@ export interface CascadeSelectPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: CascadeSelectState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/chart/Chart.d.ts b/components/lib/chart/Chart.d.ts
index 59454648a..2fde1c2e7 100755
--- a/components/lib/chart/Chart.d.ts
+++ b/components/lib/chart/Chart.d.ts
@@ -26,6 +26,10 @@ export interface ChartPassThroughMethodOptions {
      * Defines valid properties.
      */
     props: ChartProps;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/checkbox/Checkbox.d.ts b/components/lib/checkbox/Checkbox.d.ts
index ee522b93c..80153ce83 100755
--- a/components/lib/checkbox/Checkbox.d.ts
+++ b/components/lib/checkbox/Checkbox.d.ts
@@ -34,6 +34,10 @@ export interface CheckboxPassThroughMethodOptions {
      * Defines current options.
      */
     context: CheckboxContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/chip/Chip.d.ts b/components/lib/chip/Chip.d.ts
index c3529aa15..12836555b 100644
--- a/components/lib/chip/Chip.d.ts
+++ b/components/lib/chip/Chip.d.ts
@@ -30,6 +30,10 @@ export interface ChipPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: ChipState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/chips/Chips.d.ts b/components/lib/chips/Chips.d.ts
index c70d56d77..28b3fbd54 100755
--- a/components/lib/chips/Chips.d.ts
+++ b/components/lib/chips/Chips.d.ts
@@ -30,6 +30,10 @@ export interface ChipsPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: ChipsState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/colorpicker/ColorPicker.d.ts b/components/lib/colorpicker/ColorPicker.d.ts
index e9ad7f3ee..daf106952 100755
--- a/components/lib/colorpicker/ColorPicker.d.ts
+++ b/components/lib/colorpicker/ColorPicker.d.ts
@@ -32,6 +32,10 @@ export interface ColorPickerPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: ColorPickerState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/column/Column.d.ts b/components/lib/column/Column.d.ts
index b9400f2f6..817307610 100755
--- a/components/lib/column/Column.d.ts
+++ b/components/lib/column/Column.d.ts
@@ -33,9 +33,9 @@ export interface ColumnPassThroughMethodOptions {
      */
     props: ColumnProps;
     /**
-     * Defines parent instance.
+     * Defines parent options.
      */
-    parent: DataTablePassThroughOptions;
+    parent: any;
     /**
      * Defines current options.
      */
diff --git a/components/lib/columngroup/ColumnGroup.d.ts b/components/lib/columngroup/ColumnGroup.d.ts
index 40d836217..b1819839f 100755
--- a/components/lib/columngroup/ColumnGroup.d.ts
+++ b/components/lib/columngroup/ColumnGroup.d.ts
@@ -6,7 +6,6 @@
  * @module columngroup
  */
 import { ComponentHooks } from '../basecomponent';
-import { DataTablePassThroughOptions } from '../datatable';
 import { PassThroughOptions } from '../passthrough';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 
@@ -25,9 +24,9 @@ export interface ColumnGroupPassThroughMethodOptions {
      */
     props: ColumnGroupProps;
     /**
-     * Defines parent instance.
+     * Defines parent options.
      */
-    parent: DataTablePassThroughOptions;
+    parent: any;
     /**
      * Defines current options.
      */
diff --git a/components/lib/confirmdialog/ConfirmDialog.d.ts b/components/lib/confirmdialog/ConfirmDialog.d.ts
index 9597497e4..a0c6f7afc 100644
--- a/components/lib/confirmdialog/ConfirmDialog.d.ts
+++ b/components/lib/confirmdialog/ConfirmDialog.d.ts
@@ -32,6 +32,10 @@ export interface ConfirmDialogPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: ConfirmDialogState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/confirmpopup/ConfirmPopup.d.ts b/components/lib/confirmpopup/ConfirmPopup.d.ts
index 4bf168c86..e2232ac0c 100644
--- a/components/lib/confirmpopup/ConfirmPopup.d.ts
+++ b/components/lib/confirmpopup/ConfirmPopup.d.ts
@@ -34,6 +34,10 @@ export interface ConfirmPopupPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: ConfirmPopupState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/contextmenu/ContextMenu.d.ts b/components/lib/contextmenu/ContextMenu.d.ts
index 8ebc0b531..f1cc9f52a 100755
--- a/components/lib/contextmenu/ContextMenu.d.ts
+++ b/components/lib/contextmenu/ContextMenu.d.ts
@@ -38,6 +38,10 @@ export interface ContextMenuPassThroughMethodOptions {
      * Defines current options.
      */
     context: ContextMenuContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/datatable/BodyCell.vue b/components/lib/datatable/BodyCell.vue
index ff3cf5499..89c99e78a 100755
--- a/components/lib/datatable/BodyCell.vue
+++ b/components/lib/datatable/BodyCell.vue
@@ -222,6 +222,7 @@ export default {
             const columnMetaData = {
                 props: this.column.props,
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
diff --git a/components/lib/datatable/ColumnFilter.vue b/components/lib/datatable/ColumnFilter.vue
index 9f94d6a64..fb3ca3883 100644
--- a/components/lib/datatable/ColumnFilter.vue
+++ b/components/lib/datatable/ColumnFilter.vue
@@ -330,6 +330,7 @@ export default {
             const columnMetaData = {
                 props: this.column.props,
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
diff --git a/components/lib/datatable/DataTable.d.ts b/components/lib/datatable/DataTable.d.ts
index ee7e08888..ba1eb3abd 100755
--- a/components/lib/datatable/DataTable.d.ts
+++ b/components/lib/datatable/DataTable.d.ts
@@ -41,6 +41,10 @@ export interface DataTablePassThroughMethodOptions {
      * Defines current options.
      */
     context: DataTableContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/datatable/FooterCell.vue b/components/lib/datatable/FooterCell.vue
index 89efacdd9..3b60cd467 100644
--- a/components/lib/datatable/FooterCell.vue
+++ b/components/lib/datatable/FooterCell.vue
@@ -47,6 +47,7 @@ export default {
             const columnMetaData = {
                 props: this.column.props,
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
diff --git a/components/lib/datatable/HeaderCell.vue b/components/lib/datatable/HeaderCell.vue
index b47ab2e48..b1050b389 100644
--- a/components/lib/datatable/HeaderCell.vue
+++ b/components/lib/datatable/HeaderCell.vue
@@ -206,6 +206,7 @@ export default {
             const columnMetaData = {
                 props: this.column.props,
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
diff --git a/components/lib/datatable/HeaderCheckbox.vue b/components/lib/datatable/HeaderCheckbox.vue
index ee5322b74..f92202611 100755
--- a/components/lib/datatable/HeaderCheckbox.vue
+++ b/components/lib/datatable/HeaderCheckbox.vue
@@ -50,6 +50,7 @@ export default {
             const columnMetaData = {
                 props: this.column.props,
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
diff --git a/components/lib/datatable/RowCheckbox.vue b/components/lib/datatable/RowCheckbox.vue
index 45f92008c..d3faec8a0 100755
--- a/components/lib/datatable/RowCheckbox.vue
+++ b/components/lib/datatable/RowCheckbox.vue
@@ -55,6 +55,7 @@ export default {
             const columnMetaData = {
                 props: this.column.props,
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
diff --git a/components/lib/datatable/RowRadioButton.vue b/components/lib/datatable/RowRadioButton.vue
index 437cbefd9..409b5a42e 100755
--- a/components/lib/datatable/RowRadioButton.vue
+++ b/components/lib/datatable/RowRadioButton.vue
@@ -40,6 +40,7 @@ export default {
             const columnMetaData = {
                 props: this.column.props,
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
diff --git a/components/lib/datatable/TableBody.vue b/components/lib/datatable/TableBody.vue
index 764dc7daa..72383249b 100755
--- a/components/lib/datatable/TableBody.vue
+++ b/components/lib/datatable/TableBody.vue
@@ -310,6 +310,7 @@ export default {
         getColumnPT(key) {
             const columnMetaData = {
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 }
diff --git a/components/lib/datatable/TableFooter.vue b/components/lib/datatable/TableFooter.vue
index 016d2e719..e915644ec 100755
--- a/components/lib/datatable/TableFooter.vue
+++ b/components/lib/datatable/TableFooter.vue
@@ -43,6 +43,7 @@ export default {
             const columnGroupMetaData = {
                 props: this.getColumnGroupProps(),
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
@@ -61,6 +62,7 @@ export default {
             const rowMetaData = {
                 props: row.props,
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
diff --git a/components/lib/datatable/TableHeader.vue b/components/lib/datatable/TableHeader.vue
index 11f049b5f..87c15cce2 100755
--- a/components/lib/datatable/TableHeader.vue
+++ b/components/lib/datatable/TableHeader.vue
@@ -234,6 +234,7 @@ export default {
             const columnGroupMetaData = {
                 props: this.getColumnGroupProps(),
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
@@ -252,6 +253,7 @@ export default {
             const rowMetaData = {
                 props: row.props,
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
@@ -269,6 +271,7 @@ export default {
             const columnMetaData = {
                 props: column.props,
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
diff --git a/components/lib/dataview/DataView.d.ts b/components/lib/dataview/DataView.d.ts
index d533a097e..9cb36756b 100755
--- a/components/lib/dataview/DataView.d.ts
+++ b/components/lib/dataview/DataView.d.ts
@@ -31,6 +31,10 @@ export interface DataViewPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: DataViewState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/dataviewlayoutoptions/DataViewLayoutOptions.d.ts b/components/lib/dataviewlayoutoptions/DataViewLayoutOptions.d.ts
index 922d5bdc8..69079c819 100755
--- a/components/lib/dataviewlayoutoptions/DataViewLayoutOptions.d.ts
+++ b/components/lib/dataviewlayoutoptions/DataViewLayoutOptions.d.ts
@@ -35,6 +35,10 @@ export interface DataViewLayoutOptionsPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: DataViewLayoutOptionsState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/deferredcontent/DeferredContent.d.ts b/components/lib/deferredcontent/DeferredContent.d.ts
index fe0ee670a..c2b10b093 100755
--- a/components/lib/deferredcontent/DeferredContent.d.ts
+++ b/components/lib/deferredcontent/DeferredContent.d.ts
@@ -30,6 +30,10 @@ export interface DeferredContentPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: DeferredContentState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/divider/Divider.d.ts b/components/lib/divider/Divider.d.ts
index e3a9052cc..3d640f15b 100644
--- a/components/lib/divider/Divider.d.ts
+++ b/components/lib/divider/Divider.d.ts
@@ -26,6 +26,10 @@ export interface DividerPassThroughMethodOptions {
      * Defines valid properties.
      */
     props: DividerProps;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/dock/Dock.d.ts b/components/lib/dock/Dock.d.ts
index b7304c1a5..3ad0e8c92 100644
--- a/components/lib/dock/Dock.d.ts
+++ b/components/lib/dock/Dock.d.ts
@@ -35,6 +35,10 @@ export interface DockPassThroughMethodOptions {
      * Defines current options.
      */
     context: DockContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/dropdown/Dropdown.vue b/components/lib/dropdown/Dropdown.vue
index e5e76af99..0f6e6de60 100755
--- a/components/lib/dropdown/Dropdown.vue
+++ b/components/lib/dropdown/Dropdown.vue
@@ -1,5 +1,5 @@
 <template>
-    <div ref="container" :id="id" :class="cx('root')" @click="onContainerClick" v-bind="getPTOptions('root')" data-pc-name="dropdown">
+    <div ref="container" :id="id" :class="cx('root')" @click="onContainerClick" v-bind="ptm('root')" data-pc-name="dropdown">
         <input
             v-if="editable"
             ref="focusInput"
@@ -23,7 +23,7 @@
             @blur="onBlur"
             @keydown="onKeyDown"
             @input="onEditableInput"
-            v-bind="{ ...inputProps, ...getPTOptions('input') }"
+            v-bind="{ ...inputProps, ...ptm('input') }"
         />
         <span
             v-else
@@ -43,25 +43,25 @@
             @focus="onFocus"
             @blur="onBlur"
             @keydown="onKeyDown"
-            v-bind="{ ...inputProps, ...getPTOptions('input') }"
+            v-bind="{ ...inputProps, ...ptm('input') }"
         >
             <slot name="value" :value="modelValue" :placeholder="placeholder">{{ label === 'p-emptylabel' ? '&nbsp;' : label || 'empty' }}</slot>
         </span>
         <slot v-if="showClear && modelValue != null" name="clearicon" :class="cx('clearIcon')" :onClick="onClearClick" :clearCallback="onClearClick">
-            <component :is="clearIcon ? 'i' : 'TimesIcon'" ref="clearIcon" :class="[cx('clearIcon'), clearIcon]" @click="onClearClick" v-bind="{ ...clearIconProps, ...getPTOptions('clearIcon') }" data-pc-section="clearicon" />
+            <component :is="clearIcon ? 'i' : 'TimesIcon'" ref="clearIcon" :class="[cx('clearIcon'), clearIcon]" @click="onClearClick" v-bind="{ ...clearIconProps, ...ptm('clearIcon') }" data-pc-section="clearicon" />
         </slot>
-        <div :class="cx('trigger')" v-bind="getPTOptions('trigger')">
+        <div :class="cx('trigger')" v-bind="ptm('trigger')">
             <slot v-if="loading" name="loadingicon" :class="cx('loadingIcon')">
-                <span v-if="loadingIcon" :class="[cx('loadingIcon'), 'pi-spin', loadingIcon]" aria-hidden="true" v-bind="getPTOptions('loadingIcon')" />
-                <SpinnerIcon v-else :class="cx('loadingIcon')" spin aria-hidden="true" v-bind="getPTOptions('loadingIcon')" />
+                <span v-if="loadingIcon" :class="[cx('loadingIcon'), 'pi-spin', loadingIcon]" aria-hidden="true" v-bind="ptm('loadingIcon')" />
+                <SpinnerIcon v-else :class="cx('loadingIcon')" spin aria-hidden="true" v-bind="ptm('loadingIcon')" />
             </slot>
             <slot v-else name="dropdownicon" :class="cx('dropdownIcon')">
-                <component :is="dropdownIcon ? 'span' : 'ChevronDownIcon'" :class="[cx('dropdownIcon'), dropdownIcon]" aria-hidden="true" v-bind="getPTOptions('dropdownIcon')" />
+                <component :is="dropdownIcon ? 'span' : 'ChevronDownIcon'" :class="[cx('dropdownIcon'), dropdownIcon]" aria-hidden="true" v-bind="ptm('dropdownIcon')" />
             </slot>
         </div>
         <Portal :appendTo="appendTo">
-            <transition name="p-connected-overlay" @enter="onOverlayEnter" @after-enter="onOverlayAfterEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave" v-bind="getPTOptions('transition')">
-                <div v-if="overlayVisible" :ref="overlayRef" :class="[cx('panel'), panelClass]" :style="panelStyle" @click="onOverlayClick" @keydown="onOverlayKeyDown" v-bind="{ ...panelProps, ...getPTOptions('panel') }">
+            <transition name="p-connected-overlay" @enter="onOverlayEnter" @after-enter="onOverlayAfterEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave" v-bind="ptm('transition')">
+                <div v-if="overlayVisible" :ref="overlayRef" :class="[cx('panel'), panelClass]" :style="panelStyle" @click="onOverlayClick" @keydown="onOverlayKeyDown" v-bind="{ ...panelProps, ...ptm('panel') }">
                     <span
                         ref="firstHiddenFocusableElementOnOverlay"
                         role="presentation"
@@ -69,13 +69,13 @@
                         class="p-hidden-accessible p-hidden-focusable"
                         :tabindex="0"
                         @focus="onFirstHiddenFocus"
-                        v-bind="getPTOptions('hiddenFirstFocusableEl')"
+                        v-bind="ptm('hiddenFirstFocusableEl')"
                         :data-p-hidden-accessible="true"
                         :data-p-hidden-focusable="true"
                     ></span>
                     <slot name="header" :value="modelValue" :options="visibleOptions"></slot>
-                    <div v-if="filter" :class="cx('header')" v-bind="getPTOptions('header')">
-                        <div :class="cx('filterContainer')" v-bind="getPTOptions('filterContainer')">
+                    <div v-if="filter" :class="cx('header')" v-bind="ptm('header')">
+                        <div :class="cx('filterContainer')" v-bind="ptm('filterContainer')">
                             <input
                                 ref="filterInput"
                                 type="text"
@@ -90,29 +90,22 @@
                                 @keydown="onFilterKeyDown"
                                 @blur="onFilterBlur"
                                 @input="onFilterChange"
-                                v-bind="{ ...filterInputProps, ...getPTOptions('filterInput') }"
+                                v-bind="{ ...filterInputProps, ...ptm('filterInput') }"
                             />
                             <slot name="filtericon" :class="cx('filterIcon')">
-                                <component :is="filterIcon ? 'span' : 'FilterIcon'" :class="[cx('filterIcon'), filterIcon]" v-bind="getPTOptions('filterIcon')" />
+                                <component :is="filterIcon ? 'span' : 'FilterIcon'" :class="[cx('filterIcon'), filterIcon]" v-bind="ptm('filterIcon')" />
                             </slot>
                         </div>
-                        <span role="status" aria-live="polite" class="p-hidden-accessible" v-bind="getPTOptions('hiddenFilterResult')" :data-p-hidden-accessible="true">
+                        <span role="status" aria-live="polite" class="p-hidden-accessible" v-bind="ptm('hiddenFilterResult')" :data-p-hidden-accessible="true">
                             {{ filterResultMessageText }}
                         </span>
                     </div>
-                    <div :class="cx('wrapper')" :style="{ 'max-height': virtualScrollerDisabled ? scrollHeight : '' }" v-bind="getPTOptions('wrapper')">
-                        <VirtualScroller :ref="virtualScrollerRef" v-bind="virtualScrollerOptions" :items="visibleOptions" :style="{ height: scrollHeight }" :tabindex="-1" :disabled="virtualScrollerDisabled" :pt="getPTOptions('virtualScroller')">
+                    <div :class="cx('wrapper')" :style="{ 'max-height': virtualScrollerDisabled ? scrollHeight : '' }" v-bind="ptm('wrapper')">
+                        <VirtualScroller :ref="virtualScrollerRef" v-bind="virtualScrollerOptions" :items="visibleOptions" :style="{ height: scrollHeight }" :tabindex="-1" :disabled="virtualScrollerDisabled" :pt="ptm('virtualScroller')">
                             <template v-slot:content="{ styleClass, contentRef, items, getItemOptions, contentStyle, itemSize }">
-                                <ul :ref="(el) => listRef(el, contentRef)" :id="id + '_list'" :class="[cx('list'), styleClass]" :style="contentStyle" role="listbox" v-bind="getPTOptions('list')">
+                                <ul :ref="(el) => listRef(el, contentRef)" :id="id + '_list'" :class="[cx('list'), styleClass]" :style="contentStyle" role="listbox" v-bind="ptm('list')">
                                     <template v-for="(option, i) of items" :key="getOptionRenderKey(option, getOptionIndex(i, getItemOptions))">
-                                        <li
-                                            v-if="isOptionGroup(option)"
-                                            :id="id + '_' + getOptionIndex(i, getItemOptions)"
-                                            :style="{ height: itemSize ? itemSize + 'px' : undefined }"
-                                            :class="cx('itemGroup')"
-                                            role="option"
-                                            v-bind="getPTOptions('itemGroup')"
-                                        >
+                                        <li v-if="isOptionGroup(option)" :id="id + '_' + getOptionIndex(i, getItemOptions)" :style="{ height: itemSize ? itemSize + 'px' : undefined }" :class="cx('itemGroup')" role="option" v-bind="ptm('itemGroup')">
                                             <slot name="optiongroup" :option="option.optionGroup" :index="getOptionIndex(i, getItemOptions)">{{ getOptionGroupLabel(option.optionGroup) }}</slot>
                                         </li>
                                         <li
@@ -137,10 +130,10 @@
                                             <slot name="option" :option="option" :index="getOptionIndex(i, getItemOptions)">{{ getOptionLabel(option) }}</slot>
                                         </li>
                                     </template>
-                                    <li v-if="filterValue && (!items || (items && items.length === 0))" :class="cx('emptyMessage')" role="option" v-bind="getPTOptions('emptyMessage')" :data-p-hidden-accessible="true">
+                                    <li v-if="filterValue && (!items || (items && items.length === 0))" :class="cx('emptyMessage')" role="option" v-bind="ptm('emptyMessage')" :data-p-hidden-accessible="true">
                                         <slot name="emptyfilter">{{ emptyFilterMessageText }}</slot>
                                     </li>
-                                    <li v-else-if="!options || (options && options.length === 0)" :class="cx('emptyMessage')" role="option" v-bind="getPTOptions('emptyMessage')" :data-p-hidden-accessible="true">
+                                    <li v-else-if="!options || (options && options.length === 0)" :class="cx('emptyMessage')" role="option" v-bind="ptm('emptyMessage')" :data-p-hidden-accessible="true">
                                         <slot name="empty">{{ emptyMessageText }}</slot>
                                     </li>
                                 </ul>
@@ -151,10 +144,10 @@
                         </VirtualScroller>
                     </div>
                     <slot name="footer" :value="modelValue" :options="visibleOptions"></slot>
-                    <span v-if="!options || (options && options.length === 0)" role="status" aria-live="polite" class="p-hidden-accessible" v-bind="getPTOptions('hiddenEmptyMessage')" :data-p-hidden-accessible="true">
+                    <span v-if="!options || (options && options.length === 0)" role="status" aria-live="polite" class="p-hidden-accessible" v-bind="ptm('hiddenEmptyMessage')" :data-p-hidden-accessible="true">
                         {{ emptyMessageText }}
                     </span>
-                    <span role="status" aria-live="polite" class="p-hidden-accessible" v-bind="getPTOptions('hiddenSelectedMessage')" :data-p-hidden-accessible="true">
+                    <span role="status" aria-live="polite" class="p-hidden-accessible" v-bind="ptm('hiddenSelectedMessage')" :data-p-hidden-accessible="true">
                         {{ selectedMessageText }}
                     </span>
                     <span
@@ -164,7 +157,7 @@
                         class="p-hidden-accessible p-hidden-focusable"
                         :tabindex="0"
                         @focus="onLastHiddenFocus"
-                        v-bind="getPTOptions('hiddenLastFocusableEl')"
+                        v-bind="ptm('hiddenLastFocusableEl')"
                         :data-p-hidden-accessible="true"
                         :data-p-hidden-focusable="true"
                     ></span>
@@ -260,20 +253,8 @@ export default {
         getOptionRenderKey(option, index) {
             return (this.dataKey ? ObjectUtils.resolveFieldData(option, this.dataKey) : this.getOptionLabel(option)) + '_' + index;
         },
-        getPTOptions(key) {
-            return this.ptm(key, {
-                parent: {
-                    props: this.$parent?.$props,
-                    state: this.$parent?.$data
-                }
-            });
-        },
         getPTItemOptions(option, itemOptions, index, key) {
             return this.ptm(key, {
-                parent: {
-                    props: this.$parent?.$props,
-                    state: this.$parent?.$data
-                },
                 context: {
                     selected: this.isSelected(option),
                     focused: this.focusedOptionIndex === this.getOptionIndex(index, itemOptions),
diff --git a/components/lib/editor/Editor.d.ts b/components/lib/editor/Editor.d.ts
index 2c5fa3819..db7d13d45 100755
--- a/components/lib/editor/Editor.d.ts
+++ b/components/lib/editor/Editor.d.ts
@@ -30,6 +30,10 @@ export interface EditorPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: EditorState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/fieldset/Fieldset.d.ts b/components/lib/fieldset/Fieldset.d.ts
index 773222420..6d97de738 100755
--- a/components/lib/fieldset/Fieldset.d.ts
+++ b/components/lib/fieldset/Fieldset.d.ts
@@ -32,6 +32,10 @@ export interface FieldsetPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: FieldsetState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/fileupload/FileUpload.d.ts b/components/lib/fileupload/FileUpload.d.ts
index eb4b84044..d626031a7 100755
--- a/components/lib/fileupload/FileUpload.d.ts
+++ b/components/lib/fileupload/FileUpload.d.ts
@@ -33,6 +33,10 @@ export interface FileUploadPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: FileUploadState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/galleria/Galleria.d.ts b/components/lib/galleria/Galleria.d.ts
index 08b2a70c3..0d9e62fbd 100755
--- a/components/lib/galleria/Galleria.d.ts
+++ b/components/lib/galleria/Galleria.d.ts
@@ -36,6 +36,10 @@ export interface GalleriaPassThroughMethodOptions {
      * Defines current options.
      */
     context: GalleriaContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/image/Image.d.ts b/components/lib/image/Image.d.ts
index 2a2337c0b..0d54800b0 100644
--- a/components/lib/image/Image.d.ts
+++ b/components/lib/image/Image.d.ts
@@ -32,6 +32,10 @@ export interface ImagePassThroughMethodOptions {
      * Defines current inline state.
      */
     state: ImageState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/inlinemessage/InlineMessage.d.ts b/components/lib/inlinemessage/InlineMessage.d.ts
index c444cec15..3870a089c 100755
--- a/components/lib/inlinemessage/InlineMessage.d.ts
+++ b/components/lib/inlinemessage/InlineMessage.d.ts
@@ -30,6 +30,10 @@ export interface InlineMessagePassThroughMethodOptions {
      * Defines current inline state.
      */
     state: InlineMessageState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/inplace/Inplace.d.ts b/components/lib/inplace/Inplace.d.ts
index 09989eebb..1b6add945 100755
--- a/components/lib/inplace/Inplace.d.ts
+++ b/components/lib/inplace/Inplace.d.ts
@@ -32,6 +32,10 @@ export interface InplacePassThroughMethodOptions {
      * Defines current inline state.
      */
     state: InplaceState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/inputgroup/InputGroup.d.ts b/components/lib/inputgroup/InputGroup.d.ts
index 511dcc8cf..cc8d4f111 100644
--- a/components/lib/inputgroup/InputGroup.d.ts
+++ b/components/lib/inputgroup/InputGroup.d.ts
@@ -22,6 +22,10 @@ export interface InputGroupPassThroughMethodOptions {
      * Defines instance.
      */
     instance: any;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/inputgroupaddon/InputGroupAddon.d.ts b/components/lib/inputgroupaddon/InputGroupAddon.d.ts
index 6e367b3b3..c018e0c41 100644
--- a/components/lib/inputgroupaddon/InputGroupAddon.d.ts
+++ b/components/lib/inputgroupaddon/InputGroupAddon.d.ts
@@ -22,6 +22,10 @@ export interface InputGroupAddonPassThroughMethodOptions {
      * Defines instance.
      */
     instance: any;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/inputmask/InputMask.d.ts b/components/lib/inputmask/InputMask.d.ts
index e47446fe1..89055071e 100755
--- a/components/lib/inputmask/InputMask.d.ts
+++ b/components/lib/inputmask/InputMask.d.ts
@@ -29,6 +29,10 @@ export interface InputMaskPassThroughMethodOptions {
      * Defines current options.
      */
     context: InputMaskContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/inputnumber/InputNumber.vue b/components/lib/inputnumber/InputNumber.vue
index d6c531a35..fddd1628e 100755
--- a/components/lib/inputnumber/InputNumber.vue
+++ b/components/lib/inputnumber/InputNumber.vue
@@ -1,5 +1,5 @@
 <template>
-    <span :class="cx('root')" v-bind="getPTOptions('root')" data-pc-name="inputnumber">
+    <span :class="cx('root')" v-bind="ptm('root')" data-pc-name="inputnumber">
         <INInputText
             ref="input"
             :id="inputId"
@@ -27,7 +27,7 @@
             :unstyled="unstyled"
             data-pc-section="input"
         />
-        <span v-if="showButtons && buttonLayout === 'stacked'" :class="cx('buttonGroup')" v-bind="getPTOptions('buttonGroup')">
+        <span v-if="showButtons && buttonLayout === 'stacked'" :class="cx('buttonGroup')" v-bind="ptm('buttonGroup')">
             <INButton
                 :class="[cx('incrementButton'), incrementButtonClass]"
                 v-on="upButtonListeners"
@@ -173,14 +173,6 @@ export default {
         this.constructParser();
     },
     methods: {
-        getPTOptions(key) {
-            return this.ptm(key, {
-                parent: {
-                    props: this.$parent?.$props,
-                    state: this.$parent?.$data
-                }
-            });
-        },
         getOptions() {
             return {
                 localeMatcher: this.localeMatcher,
diff --git a/components/lib/inputswitch/InputSwitch.d.ts b/components/lib/inputswitch/InputSwitch.d.ts
index c62b36d59..617cf68fe 100755
--- a/components/lib/inputswitch/InputSwitch.d.ts
+++ b/components/lib/inputswitch/InputSwitch.d.ts
@@ -30,6 +30,10 @@ export interface InputSwitchPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: InputSwitchState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/inputtext/InputText.vue b/components/lib/inputtext/InputText.vue
index 646f87091..397cb71d2 100755
--- a/components/lib/inputtext/InputText.vue
+++ b/components/lib/inputtext/InputText.vue
@@ -1,5 +1,5 @@
 <template>
-    <input :class="cx('root')" :value="modelValue" @input="onInput" v-bind="ptm('root', ptmParams)" data-pc-name="inputtext" />
+    <input :class="cx('root')" :value="modelValue" @input="onInput" v-bind="getPTOptions('root')" data-pc-name="inputtext" />
 </template>
 
 <script>
@@ -18,17 +18,13 @@ export default {
         filled() {
             return this.modelValue != null && this.modelValue.toString().length > 0;
         },
-        ptmParams() {
-            return {
-                parent: {
-                    props: this.$parent?.$props,
-                    state: this.$parent?.$data
-                },
+        getPTOptions(key) {
+            return this.ptm(key, {
                 context: {
                     filled: this.filled,
                     disabled: this.$attrs.disabled || this.$attrs.disabled === ''
                 }
-            };
+            });
         }
     }
 };
diff --git a/components/lib/knob/Knob.d.ts b/components/lib/knob/Knob.d.ts
index f38d24312..947399a0a 100644
--- a/components/lib/knob/Knob.d.ts
+++ b/components/lib/knob/Knob.d.ts
@@ -29,6 +29,10 @@ export interface KnobPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: KnobState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/listbox/Listbox.d.ts b/components/lib/listbox/Listbox.d.ts
index 2760cbd1a..d29e402b1 100755
--- a/components/lib/listbox/Listbox.d.ts
+++ b/components/lib/listbox/Listbox.d.ts
@@ -35,6 +35,10 @@ export interface ListboxPassThroughMethodOptions {
      * Defines current options.
      */
     context: ListboxContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/megamenu/MegaMenu.d.ts b/components/lib/megamenu/MegaMenu.d.ts
index f46dacd92..f0111f260 100755
--- a/components/lib/megamenu/MegaMenu.d.ts
+++ b/components/lib/megamenu/MegaMenu.d.ts
@@ -35,6 +35,10 @@ export interface MegaMenuPassThroughMethodOptions {
      * Defines current options.
      */
     context: MegaMenuContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/menu/Menu.d.ts b/components/lib/menu/Menu.d.ts
index bb2e887ab..ce876a842 100755
--- a/components/lib/menu/Menu.d.ts
+++ b/components/lib/menu/Menu.d.ts
@@ -37,6 +37,10 @@ export interface MenuPassThroughMethodOptions {
      * Defines current options.
      */
     context: MenuContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/menubar/Menubar.d.ts b/components/lib/menubar/Menubar.d.ts
index ceb32fb3a..a1d4e6514 100755
--- a/components/lib/menubar/Menubar.d.ts
+++ b/components/lib/menubar/Menubar.d.ts
@@ -35,6 +35,10 @@ export interface MenubarPassThroughMethodOptions {
      * Defines current options.
      */
     context: MenubarContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/message/Message.vue b/components/lib/message/Message.vue
index cec69e2a9..e698a2201 100755
--- a/components/lib/message/Message.vue
+++ b/components/lib/message/Message.vue
@@ -1,18 +1,18 @@
 <template>
-    <transition name="p-message" appear v-bind="getPTOptions('transition')">
-        <div v-show="visible" :class="cx('root')" role="alert" aria-live="assertive" aria-atomic="true" v-bind="getPTOptions('root')" data-pc-name="message">
+    <transition name="p-message" appear v-bind="ptm('transition')">
+        <div v-show="visible" :class="cx('root')" role="alert" aria-live="assertive" aria-atomic="true" v-bind="ptm('root')" data-pc-name="message">
             <slot v-if="$slots.container" name="container" :onClose="close" :closeCallback="close"></slot>
-            <div v-else :class="cx('wrapper')" v-bind="getPTOptions('wrapper')">
+            <div v-else :class="cx('wrapper')" v-bind="ptm('wrapper')">
                 <slot name="messageicon" class="p-message-icon">
-                    <component :is="icon ? 'span' : iconComponent" :class="[cx('icon'), icon]" v-bind="getPTOptions('icon')"></component>
+                    <component :is="icon ? 'span' : iconComponent" :class="[cx('icon'), icon]" v-bind="ptm('icon')"></component>
                 </slot>
-                <div class="p-message-text" :class="cx('text')" v-bind="getPTOptions('text')">
+                <div class="p-message-text" :class="cx('text')" v-bind="ptm('text')">
                     <slot></slot>
                 </div>
-                <button v-if="closable" v-ripple :class="cx('closeButton')" :aria-label="closeAriaLabel" type="button" @click="close($event)" v-bind="{ ...closeButtonProps, ...getPTOptions('button'), ...getPTOptions('closeButton') }">
+                <button v-if="closable" v-ripple :class="cx('closeButton')" :aria-label="closeAriaLabel" type="button" @click="close($event)" v-bind="{ ...closeButtonProps, ...ptm('button'), ...ptm('closeButton') }">
                     <slot name="closeicon">
-                        <i v-if="closeIcon" :class="[cx('closeIcon'), closeIcon]" v-bind="{ ...getPTOptions('buttonIcon'), ...getPTOptions('closeIcon') }" />
-                        <TimesIcon v-else :class="[cx('closeIcon'), closeIcon]" v-bind="{ ...getPTOptions('buttonIcon'), ...getPTOptions('closeIcon') }" />
+                        <i v-if="closeIcon" :class="[cx('closeIcon'), closeIcon]" v-bind="{ ...ptm('buttonIcon'), ...ptm('closeIcon') }" />
+                        <TimesIcon v-else :class="[cx('closeIcon'), closeIcon]" v-bind="{ ...ptm('buttonIcon'), ...ptm('closeIcon') }" />
                     </slot>
                 </button>
             </div>
@@ -52,14 +52,6 @@ export default {
         }
     },
     methods: {
-        getPTOptions(key) {
-            return this.ptm(key, {
-                parent: {
-                    props: this.$parent?.$props,
-                    state: this.$parent?.$data
-                }
-            });
-        },
         close(event) {
             this.visible = false;
             this.$emit('close', event);
diff --git a/components/lib/multiselect/MultiSelect.d.ts b/components/lib/multiselect/MultiSelect.d.ts
index 4cc40ab23..4517d3fb7 100755
--- a/components/lib/multiselect/MultiSelect.d.ts
+++ b/components/lib/multiselect/MultiSelect.d.ts
@@ -37,6 +37,10 @@ export interface MultiSelectPassThroughMethodOptions {
      * Defines current options.
      */
     context: MultiSelectContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/orderlist/OrderList.d.ts b/components/lib/orderlist/OrderList.d.ts
index 89d26b4c6..9810ee0eb 100755
--- a/components/lib/orderlist/OrderList.d.ts
+++ b/components/lib/orderlist/OrderList.d.ts
@@ -37,6 +37,10 @@ export interface OrderListPassThroughMethodOptions {
      * Defines current options.
      */
     context: OrderListContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/organizationchart/OrganizationChart.d.ts b/components/lib/organizationchart/OrganizationChart.d.ts
index 6b95333d9..075d78ecf 100755
--- a/components/lib/organizationchart/OrganizationChart.d.ts
+++ b/components/lib/organizationchart/OrganizationChart.d.ts
@@ -34,6 +34,10 @@ export interface OrganizationChartPassThroughMethodOptions {
      * Defines current options.
      */
     context: OrganizationChartContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/overlaypanel/OverlayPanel.d.ts b/components/lib/overlaypanel/OverlayPanel.d.ts
index d74f7ae2d..39e26abb3 100755
--- a/components/lib/overlaypanel/OverlayPanel.d.ts
+++ b/components/lib/overlaypanel/OverlayPanel.d.ts
@@ -32,6 +32,10 @@ export interface OverlayPanelPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: OverlayPanelState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/panel/Panel.d.ts b/components/lib/panel/Panel.d.ts
index 723371ffd..9ae0c75c4 100755
--- a/components/lib/panel/Panel.d.ts
+++ b/components/lib/panel/Panel.d.ts
@@ -32,6 +32,10 @@ export interface PanelPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: PanelState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/panelmenu/PanelMenu.d.ts b/components/lib/panelmenu/PanelMenu.d.ts
index a50d02442..31564e7b2 100755
--- a/components/lib/panelmenu/PanelMenu.d.ts
+++ b/components/lib/panelmenu/PanelMenu.d.ts
@@ -37,6 +37,10 @@ export interface PanelMenuPassThroughMethodOptions {
      * Defines current options.
      */
     context: PanelMenuContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/password/Password.d.ts b/components/lib/password/Password.d.ts
index e40689ca7..6a9ca1791 100755
--- a/components/lib/password/Password.d.ts
+++ b/components/lib/password/Password.d.ts
@@ -33,6 +33,10 @@ export interface PasswordPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: PasswordState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/picklist/PickList.d.ts b/components/lib/picklist/PickList.d.ts
index d0f4ac77a..946ef2135 100755
--- a/components/lib/picklist/PickList.d.ts
+++ b/components/lib/picklist/PickList.d.ts
@@ -37,6 +37,10 @@ export interface PickListPassThroughMethodOptions {
      * Defines current options.
      */
     context: PickListContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/progressbar/ProgressBar.vue b/components/lib/progressbar/ProgressBar.vue
index 80dd89cb4..e1342e73c 100755
--- a/components/lib/progressbar/ProgressBar.vue
+++ b/components/lib/progressbar/ProgressBar.vue
@@ -1,12 +1,12 @@
 <template>
-    <div role="progressbar" :class="cx('root')" aria-valuemin="0" :aria-valuenow="value" aria-valuemax="100" v-bind="getPTOptions('root')">
-        <div v-if="determinate" :class="cx('value')" :style="progressStyle" v-bind="getPTOptions('value')">
-            <div v-if="value != null && value !== 0 && showValue" :class="cx('label')" v-bind="getPTOptions('label')">
+    <div role="progressbar" :class="cx('root')" aria-valuemin="0" :aria-valuenow="value" aria-valuemax="100" v-bind="ptm('root')">
+        <div v-if="determinate" :class="cx('value')" :style="progressStyle" v-bind="ptm('value')">
+            <div v-if="value != null && value !== 0 && showValue" :class="cx('label')" v-bind="ptm('label')">
                 <slot>{{ value + '%' }}</slot>
             </div>
         </div>
-        <div v-if="indeterminate" :class="cx('container')" v-bind="getPTOptions('container')">
-            <div :class="cx('value')" v-bind="getPTOptions('value')"></div>
+        <div v-if="indeterminate" :class="cx('container')" v-bind="ptm('container')">
+            <div :class="cx('value')" v-bind="ptm('value')"></div>
         </div>
     </div>
 </template>
@@ -17,16 +17,6 @@ import BaseProgressBar from './BaseProgressBar.vue';
 export default {
     name: 'ProgressBar',
     extends: BaseProgressBar,
-    methods: {
-        getPTOptions(key) {
-            return this.ptm(key, {
-                parent: {
-                    props: this.$parent?.$props,
-                    state: this.$parent?.$data
-                }
-            });
-        }
-    },
     computed: {
         progressStyle() {
             return {
diff --git a/components/lib/progressspinner/ProgressSpinner.d.ts b/components/lib/progressspinner/ProgressSpinner.d.ts
index 4956eacfa..0291bf6e3 100755
--- a/components/lib/progressspinner/ProgressSpinner.d.ts
+++ b/components/lib/progressspinner/ProgressSpinner.d.ts
@@ -25,6 +25,10 @@ export interface ProgressSpinnerPassThroughMethodOptions {
      * Defines valid properties.
      */
     props: ProgressSpinnerProps;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/radiobutton/RadioButton.d.ts b/components/lib/radiobutton/RadioButton.d.ts
index 73fcd22c0..4a7dd6cce 100755
--- a/components/lib/radiobutton/RadioButton.d.ts
+++ b/components/lib/radiobutton/RadioButton.d.ts
@@ -30,6 +30,10 @@ export interface RadioButtonPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: RadioButtonState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/rating/Rating.d.ts b/components/lib/rating/Rating.d.ts
index 656285c20..3c84aba23 100755
--- a/components/lib/rating/Rating.d.ts
+++ b/components/lib/rating/Rating.d.ts
@@ -34,6 +34,10 @@ export interface RatingPassThroughMethodOptions {
      * Defines current options.
      */
     context: RatingContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/row/Row.d.ts b/components/lib/row/Row.d.ts
index 980bb2bfe..c9b616c54 100755
--- a/components/lib/row/Row.d.ts
+++ b/components/lib/row/Row.d.ts
@@ -6,7 +6,6 @@
  * @module row
  */
 import { ComponentHooks } from '../basecomponent';
-import { ColumnGroupPassThroughOptions } from '../columngroup';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type RowPassThroughOptionType = RowPassThroughAttributes | ((options: RowPassThroughMethodOptions) => RowPassThroughAttributes | string) | string | null | undefined;
@@ -24,9 +23,9 @@ export interface RowPassThroughMethodOptions {
      */
     props: RowProps;
     /**
-     * Defines parent instance.
+     * Defines parent options.
      */
-    parent: ColumnGroupPassThroughOptions;
+    parent: any;
     /**
      * Defines current options.
      */
diff --git a/components/lib/scrollpanel/ScrollPanel.d.ts b/components/lib/scrollpanel/ScrollPanel.d.ts
index cc6b59237..28f88ec96 100644
--- a/components/lib/scrollpanel/ScrollPanel.d.ts
+++ b/components/lib/scrollpanel/ScrollPanel.d.ts
@@ -30,6 +30,10 @@ export interface ScrollPanelPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: ScrollPanelState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/scrolltop/ScrollTop.d.ts b/components/lib/scrolltop/ScrollTop.d.ts
index b68cd4abd..4afcb33c5 100644
--- a/components/lib/scrolltop/ScrollTop.d.ts
+++ b/components/lib/scrolltop/ScrollTop.d.ts
@@ -32,6 +32,10 @@ export interface ScrollTopPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: ScrollTopState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/selectbutton/SelectButton.d.ts b/components/lib/selectbutton/SelectButton.d.ts
index 9af837062..f24fd3921 100755
--- a/components/lib/selectbutton/SelectButton.d.ts
+++ b/components/lib/selectbutton/SelectButton.d.ts
@@ -34,6 +34,10 @@ export interface SelectButtonPassThroughMethodOptions {
      * Defines current options.
      */
     context: SelectButtonContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/sidebar/Sidebar.d.ts b/components/lib/sidebar/Sidebar.d.ts
index 03ff072de..2f0dc708b 100755
--- a/components/lib/sidebar/Sidebar.d.ts
+++ b/components/lib/sidebar/Sidebar.d.ts
@@ -32,6 +32,10 @@ export interface SidebarPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: SidebarState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/skeleton/Skeleton.d.ts b/components/lib/skeleton/Skeleton.d.ts
index f04027da9..8835a68ef 100644
--- a/components/lib/skeleton/Skeleton.d.ts
+++ b/components/lib/skeleton/Skeleton.d.ts
@@ -25,6 +25,10 @@ export interface SkeletonPassThroughMethodOptions {
      * Defines valid properties.
      */
     props: SkeletonProps;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/slider/Slider.d.ts b/components/lib/slider/Slider.d.ts
index 596acd22d..7ad5eb11e 100755
--- a/components/lib/slider/Slider.d.ts
+++ b/components/lib/slider/Slider.d.ts
@@ -25,6 +25,10 @@ export interface SliderPassThroughMethodOptions {
      * Defines valid properties.
      */
     props: SliderProps;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/speeddial/SpeedDial.d.ts b/components/lib/speeddial/SpeedDial.d.ts
index 4b3058c62..efcd67c11 100644
--- a/components/lib/speeddial/SpeedDial.d.ts
+++ b/components/lib/speeddial/SpeedDial.d.ts
@@ -36,6 +36,10 @@ export interface SpeedDialPassThroughMethodOptions {
      * Defines current options.
      */
     context: SpeedDialContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/splitbutton/SplitButton.d.ts b/components/lib/splitbutton/SplitButton.d.ts
index d6e11bc52..fcbfe889b 100755
--- a/components/lib/splitbutton/SplitButton.d.ts
+++ b/components/lib/splitbutton/SplitButton.d.ts
@@ -33,6 +33,10 @@ export interface SplitButtonPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: SplitButtonState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/splitter/Splitter.d.ts b/components/lib/splitter/Splitter.d.ts
index d89cc424e..a126f77fb 100644
--- a/components/lib/splitter/Splitter.d.ts
+++ b/components/lib/splitter/Splitter.d.ts
@@ -34,6 +34,10 @@ export interface SplitterPassThroughMethodOptions {
      * Defines current options.
      */
     context: SplitterContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/splitterpanel/SplitterPanel.d.ts b/components/lib/splitterpanel/SplitterPanel.d.ts
index 891f3ab75..f2aa5aaca 100644
--- a/components/lib/splitterpanel/SplitterPanel.d.ts
+++ b/components/lib/splitterpanel/SplitterPanel.d.ts
@@ -30,6 +30,10 @@ export interface SplitterPanelPassThroughMethodOptions {
      * Defines current options.
      */
     context: SplitterPanelContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/steps/Steps.d.ts b/components/lib/steps/Steps.d.ts
index efbc1792f..c57577ca2 100755
--- a/components/lib/steps/Steps.d.ts
+++ b/components/lib/steps/Steps.d.ts
@@ -31,6 +31,10 @@ export interface StepsPassThroughMethodOptions {
      * Defines current options.
      */
     context: StepsContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/tabmenu/TabMenu.d.ts b/components/lib/tabmenu/TabMenu.d.ts
index 2df237603..213d80353 100755
--- a/components/lib/tabmenu/TabMenu.d.ts
+++ b/components/lib/tabmenu/TabMenu.d.ts
@@ -35,6 +35,10 @@ export interface TabMenuPassThroughMethodOptions {
      * Defines current options.
      */
     context: TabMenuContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/tabpanel/TabPanel.d.ts b/components/lib/tabpanel/TabPanel.d.ts
index d23351941..3780eb6ff 100755
--- a/components/lib/tabpanel/TabPanel.d.ts
+++ b/components/lib/tabpanel/TabPanel.d.ts
@@ -10,7 +10,6 @@
 import { AnchorHTMLAttributes, HTMLAttributes, LiHTMLAttributes, VNode } from 'vue';
 import { ComponentHooks } from '../basecomponent';
 import { PassThroughOptions } from '../passthrough';
-import { TabViewPassThroughOptions } from '../tabview';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 
 export declare type TabPanelPassThroughOptionType = TabPanelPassThroughAttributes | ((options: TabPanelPassThroughMethodOptions) => TabPanelPassThroughAttributes | string) | string | null | undefined;
@@ -27,14 +26,14 @@ export interface TabPanelPassThroughMethodOptions {
      * Defines valid properties.
      */
     props: TabPanelProps;
-    /**
-     * Defines parent instance.
-     */
-    parent: TabViewPassThroughOptions;
     /**
      * Defines current options.
      */
     context: TabPanelContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/tabview/TabView.vue b/components/lib/tabview/TabView.vue
index d07ee0e7e..2633b5228 100755
--- a/components/lib/tabview/TabView.vue
+++ b/components/lib/tabview/TabView.vue
@@ -154,6 +154,7 @@ export default {
             const tabMetaData = {
                 props: tab.props,
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
diff --git a/components/lib/tag/Tag.d.ts b/components/lib/tag/Tag.d.ts
index 93845ce3b..e324b0746 100644
--- a/components/lib/tag/Tag.d.ts
+++ b/components/lib/tag/Tag.d.ts
@@ -26,6 +26,10 @@ export interface TagPassThroughMethodOptions {
      * Defines valid properties.
      */
     props: TagProps;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/terminal/Terminal.d.ts b/components/lib/terminal/Terminal.d.ts
index f18533fc7..f75c55836 100755
--- a/components/lib/terminal/Terminal.d.ts
+++ b/components/lib/terminal/Terminal.d.ts
@@ -29,6 +29,10 @@ export interface TerminalPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: TerminalState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/textarea/Textarea.d.ts b/components/lib/textarea/Textarea.d.ts
index c962d2dba..84f8face7 100755
--- a/components/lib/textarea/Textarea.d.ts
+++ b/components/lib/textarea/Textarea.d.ts
@@ -30,6 +30,10 @@ export interface TextareaPassThroughMethodOptions {
      * Defines current options.
      */
     context: TextareaContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/timeline/Timeline.d.ts b/components/lib/timeline/Timeline.d.ts
index faa3371bf..0860ad05d 100644
--- a/components/lib/timeline/Timeline.d.ts
+++ b/components/lib/timeline/Timeline.d.ts
@@ -29,6 +29,10 @@ export interface TimelinePassThroughMethodOptions {
      * Defines current options.
      */
     context: TimelineContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/toast/Toast.d.ts b/components/lib/toast/Toast.d.ts
index a8050bced..3176c66a4 100755
--- a/components/lib/toast/Toast.d.ts
+++ b/components/lib/toast/Toast.d.ts
@@ -32,6 +32,10 @@ export interface ToastPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: ToastState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/togglebutton/ToggleButton.d.ts b/components/lib/togglebutton/ToggleButton.d.ts
index 40de1b34c..da1a81ba7 100755
--- a/components/lib/togglebutton/ToggleButton.d.ts
+++ b/components/lib/togglebutton/ToggleButton.d.ts
@@ -34,6 +34,10 @@ export interface ToggleButtonPassThroughMethodOptions {
      * Defines current options.
      */
     context: ToggleButtonContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/toolbar/Toolbar.d.ts b/components/lib/toolbar/Toolbar.d.ts
index 3ea9e0811..277d4afeb 100755
--- a/components/lib/toolbar/Toolbar.d.ts
+++ b/components/lib/toolbar/Toolbar.d.ts
@@ -26,6 +26,10 @@ export interface ToolbarPassThroughMethodOptions {
      * Defines valid properties.
      */
     props: ToolbarProps;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/tooltip/Tooltip.d.ts b/components/lib/tooltip/Tooltip.d.ts
index eeb40fc00..ccfccee5b 100755
--- a/components/lib/tooltip/Tooltip.d.ts
+++ b/components/lib/tooltip/Tooltip.d.ts
@@ -19,6 +19,10 @@ export declare type TooltipDirectivePassThroughOptionType = TooltipDirectivePass
  */
 export interface TooltipPassThroughMethodOptions {
     context: TooltipContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/tree/Tree.vue b/components/lib/tree/Tree.vue
index 89fc3d1e1..2316798d8 100755
--- a/components/lib/tree/Tree.vue
+++ b/components/lib/tree/Tree.vue
@@ -1,21 +1,21 @@
 <template>
-    <div :class="cx('root')" v-bind="getPTOptions('root')" data-pc-name="tree">
+    <div :class="cx('root')" v-bind="ptm('root')" data-pc-name="tree">
         <template v-if="loading && loadingMode === 'mask'">
-            <div :class="cx('loadingOverlay')" v-bind="getPTOptions('loadingOverlay')">
+            <div :class="cx('loadingOverlay')" v-bind="ptm('loadingOverlay')">
                 <slot name="loadingicon" :class="cx('loadingIcon')">
-                    <i v-if="loadingIcon" :class="[cx('loadingIcon'), 'pi-spin', loadingIcon]" v-bind="getPTOptions('loadingIcon')" />
-                    <SpinnerIcon v-else spin :class="cx('loadingIcon')" v-bind="getPTOptions('loadingIcon')" />
+                    <i v-if="loadingIcon" :class="[cx('loadingIcon'), 'pi-spin', loadingIcon]" v-bind="ptm('loadingIcon')" />
+                    <SpinnerIcon v-else spin :class="cx('loadingIcon')" v-bind="ptm('loadingIcon')" />
                 </slot>
             </div>
         </template>
-        <div v-if="filter" :class="cx('filterContainer')" v-bind="getPTOptions('filterContainer')">
-            <input v-model="filterValue" type="text" autocomplete="off" :class="cx('input')" :placeholder="filterPlaceholder" @keydown="onFilterKeydown" v-bind="getPTOptions('input')" />
+        <div v-if="filter" :class="cx('filterContainer')" v-bind="ptm('filterContainer')">
+            <input v-model="filterValue" type="text" autocomplete="off" :class="cx('input')" :placeholder="filterPlaceholder" @keydown="onFilterKeydown" v-bind="ptm('input')" />
             <slot name="searchicon" :class="cx('searchIcon')">
-                <SearchIcon :class="cx('searchIcon')" v-bind="getPTOptions('searchIcon')" />
+                <SearchIcon :class="cx('searchIcon')" v-bind="ptm('searchIcon')" />
             </slot>
         </div>
-        <div :class="cx('wrapper')" :style="{ maxHeight: scrollHeight }" v-bind="getPTOptions('wrapper')">
-            <ul :class="cx('container')" role="tree" :aria-labelledby="ariaLabelledby" :aria-label="ariaLabel" v-bind="getPTOptions('container')">
+        <div :class="cx('wrapper')" :style="{ maxHeight: scrollHeight }" v-bind="ptm('wrapper')">
+            <ul :class="cx('container')" role="tree" :aria-labelledby="ariaLabelledby" :aria-label="ariaLabel" v-bind="ptm('container')">
                 <TreeNode
                     v-for="(node, index) of valueToRender"
                     :key="node.key"
@@ -61,14 +61,6 @@ export default {
         }
     },
     methods: {
-        getPTOptions(key) {
-            return this.ptm(key, {
-                parent: {
-                    props: this.$parent?.$props,
-                    state: this.$parent?.$data
-                }
-            });
-        },
         onNodeToggle(node) {
             const key = node.key;
 
diff --git a/components/lib/treeselect/TreeSelect.d.ts b/components/lib/treeselect/TreeSelect.d.ts
index 5a7367789..52102b7bd 100644
--- a/components/lib/treeselect/TreeSelect.d.ts
+++ b/components/lib/treeselect/TreeSelect.d.ts
@@ -34,6 +34,10 @@ export interface TreeSelectPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: TreeSelectState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/treetable/BodyCell.vue b/components/lib/treetable/BodyCell.vue
index 28adb3aab..d5ba3da44 100644
--- a/components/lib/treetable/BodyCell.vue
+++ b/components/lib/treetable/BodyCell.vue
@@ -33,8 +33,8 @@ import CheckIcon from 'primevue/icons/check';
 import ChevronDownIcon from 'primevue/icons/chevrondown';
 import ChevronRightIcon from 'primevue/icons/chevronright';
 import MinusIcon from 'primevue/icons/minus';
-import Ripple from 'primevue/ripple';
 import SpinnerIcon from 'primevue/icons/spinner';
+import Ripple from 'primevue/ripple';
 import { DomHandler, ObjectUtils } from 'primevue/utils';
 import { mergeProps } from 'vue';
 
@@ -120,6 +120,7 @@ export default {
             const columnMetaData = {
                 props: this.column.props,
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
@@ -145,6 +146,7 @@ export default {
             const columnMetaData = {
                 props: this.column.props,
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
diff --git a/components/lib/treetable/FooterCell.vue b/components/lib/treetable/FooterCell.vue
index 35123574b..824ab4376 100644
--- a/components/lib/treetable/FooterCell.vue
+++ b/components/lib/treetable/FooterCell.vue
@@ -47,6 +47,7 @@ export default {
             const columnMetaData = {
                 props: this.column.props,
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
diff --git a/components/lib/treetable/HeaderCell.vue b/components/lib/treetable/HeaderCell.vue
index 9eb1e4058..3a6b012ba 100644
--- a/components/lib/treetable/HeaderCell.vue
+++ b/components/lib/treetable/HeaderCell.vue
@@ -89,6 +89,7 @@ export default {
             const columnMetaData = {
                 props: this.column.props,
                 parent: {
+                    instance: this,
                     props: this.$props,
                     state: this.$data
                 },
diff --git a/components/lib/treetable/TreeTable.d.ts b/components/lib/treetable/TreeTable.d.ts
index 46f0075e5..04a8ceab4 100755
--- a/components/lib/treetable/TreeTable.d.ts
+++ b/components/lib/treetable/TreeTable.d.ts
@@ -37,6 +37,10 @@ export interface TreeTablePassThroughMethodOptions {
      * Defines current options.
      */
     context: TreeTableContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/tristatecheckbox/TriStateCheckbox.d.ts b/components/lib/tristatecheckbox/TriStateCheckbox.d.ts
index 82e4a89a3..1bb47f81c 100755
--- a/components/lib/tristatecheckbox/TriStateCheckbox.d.ts
+++ b/components/lib/tristatecheckbox/TriStateCheckbox.d.ts
@@ -34,6 +34,10 @@ export interface TriStateCheckboxPassThroughMethodOptions {
      * Defines current options.
      */
     context: TriStateCheckboxContext;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */
diff --git a/components/lib/virtualscroller/VirtualScroller.d.ts b/components/lib/virtualscroller/VirtualScroller.d.ts
index 25e7b5eb3..567d78f9b 100644
--- a/components/lib/virtualscroller/VirtualScroller.d.ts
+++ b/components/lib/virtualscroller/VirtualScroller.d.ts
@@ -30,6 +30,10 @@ export interface VirtualScrollerPassThroughMethodOptions {
      * Defines current inline state.
      */
     state: VirtualScrollerState;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
     /**
      * Defines passthrough(pt) options in global config.
      */

From 8ffcdf2e33862740dc94c8fd72680b9acaacc0ef Mon Sep 17 00:00:00 2001
From: GitHub Actions Bot <>
Date: Tue, 5 Dec 2023 11:07:36 +0000
Subject: [PATCH 54/69] Update API doc

---
 doc/common/apidoc/index.json | 620 ++++++++++++++++++++++++++++++++++-
 1 file changed, 602 insertions(+), 18 deletions(-)

diff --git a/doc/common/apidoc/index.json b/doc/common/apidoc/index.json
index 0f11e7919..72b3001be 100644
--- a/doc/common/apidoc/index.json
+++ b/doc/common/apidoc/index.json
@@ -44,6 +44,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -485,9 +493,9 @@
                             "name": "parent",
                             "optional": false,
                             "readonly": false,
-                            "type": "AccordionPassThroughOptions",
+                            "type": "any",
                             "default": "",
-                            "description": "Defines parent instance."
+                            "description": "Defines parent options."
                         },
                         {
                             "name": "context",
@@ -3066,6 +3074,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -4264,9 +4280,9 @@
                             "name": "parent",
                             "optional": false,
                             "readonly": false,
-                            "type": "AvatarGroupPassThroughOptions",
+                            "type": "any",
                             "default": "",
-                            "description": "Defines parent instance."
+                            "description": "Defines parent options."
                         },
                         {
                             "name": "global",
@@ -4956,6 +4972,14 @@
                             "type": "BadgeContext",
                             "default": ""
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -5714,6 +5738,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -5994,6 +6026,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -6837,6 +6877,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -8741,6 +8789,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -9386,6 +9442,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -10271,6 +10335,14 @@
                             "default": "",
                             "description": "Defines valid properties."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -10605,6 +10677,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -11083,6 +11163,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -11417,6 +11505,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -11938,6 +12034,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -12370,9 +12474,9 @@
                             "name": "parent",
                             "optional": false,
                             "readonly": false,
-                            "type": "DataTablePassThroughOptions",
+                            "type": "any",
                             "default": "",
-                            "description": "Defines parent instance."
+                            "description": "Defines parent options."
                         },
                         {
                             "name": "context",
@@ -13953,9 +14057,9 @@
                             "name": "parent",
                             "optional": false,
                             "readonly": false,
-                            "type": "DataTablePassThroughOptions",
+                            "type": "any",
                             "default": "",
-                            "description": "Defines parent instance."
+                            "description": "Defines parent options."
                         },
                         {
                             "name": "context",
@@ -16006,6 +16110,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -16434,6 +16546,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -16843,6 +16963,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -17493,6 +17621,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -20479,6 +20615,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -21041,6 +21185,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -21336,6 +21488,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -22286,6 +22446,14 @@
                             "default": "",
                             "description": "Defines valid properties."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -22537,6 +22705,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -24448,6 +24624,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -25022,6 +25206,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -25406,6 +25598,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -26608,6 +26808,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -27630,6 +27838,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -28132,6 +28348,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -28397,6 +28621,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -28756,6 +28988,14 @@
                             "default": "",
                             "description": "Defines instance."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -28959,6 +29199,14 @@
                             "default": "",
                             "description": "Defines instance."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -29178,6 +29426,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -30203,6 +30459,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -30837,6 +31101,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -31282,6 +31554,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -32134,6 +32414,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -32838,6 +33126,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -33411,6 +33707,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -34623,6 +34927,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -35974,6 +36286,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -36646,6 +36966,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -37303,6 +37631,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -38313,6 +38649,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -38744,6 +39088,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -39470,6 +39822,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -40125,6 +40485,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -41563,6 +41931,14 @@
                             "default": "",
                             "description": "Defines valid properties."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -41808,6 +42184,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -42187,6 +42571,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -42858,9 +43250,9 @@
                             "name": "parent",
                             "optional": false,
                             "readonly": false,
-                            "type": "ColumnGroupPassThroughOptions",
+                            "type": "any",
                             "default": "",
-                            "description": "Defines parent instance."
+                            "description": "Defines parent options."
                         },
                         {
                             "name": "context",
@@ -43074,6 +43466,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -43365,6 +43765,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -43652,6 +44060,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -44097,6 +44513,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -44521,6 +44945,14 @@
                             "default": "",
                             "description": "Defines valid properties."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -44766,6 +45198,14 @@
                             "default": "",
                             "description": "Defines valid properties."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -45154,6 +45594,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -45783,6 +46231,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -46291,6 +46747,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -46698,6 +47162,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -46941,6 +47413,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -47533,6 +48013,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -47952,14 +48440,6 @@
                             "default": "",
                             "description": "Defines valid properties."
                         },
-                        {
-                            "name": "parent",
-                            "optional": false,
-                            "readonly": false,
-                            "type": "TabViewPassThroughOptions",
-                            "default": "",
-                            "description": "Defines parent instance."
-                        },
                         {
                             "name": "context",
                             "optional": false,
@@ -47968,6 +48448,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -48799,6 +49287,14 @@
                             "default": "",
                             "description": "Defines valid properties."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -49066,6 +49562,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -49442,6 +49946,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -50354,6 +50866,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -50706,6 +51226,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -51371,6 +51899,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -51827,6 +52363,14 @@
                             "default": "",
                             "description": "Defines valid properties."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -52057,6 +52601,14 @@
                             "type": "TooltipContext",
                             "default": ""
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -53345,6 +53897,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -54058,6 +54618,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -55569,6 +56137,14 @@
                             "default": "",
                             "description": "Defines current options."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,
@@ -56277,6 +56853,14 @@
                             "default": "",
                             "description": "Defines current inline state."
                         },
+                        {
+                            "name": "parent",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "any",
+                            "default": "",
+                            "description": "Defines parent options."
+                        },
                         {
                             "name": "global",
                             "optional": false,

From 6f0002e1a66e9e23667904d425b73bcc0f78b9ba Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 15:36:59 +0300
Subject: [PATCH 55/69] Update InputText.vue

---
 components/lib/inputtext/InputText.vue | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/components/lib/inputtext/InputText.vue b/components/lib/inputtext/InputText.vue
index 397cb71d2..368a66ee4 100755
--- a/components/lib/inputtext/InputText.vue
+++ b/components/lib/inputtext/InputText.vue
@@ -10,14 +10,6 @@ export default {
     extends: BaseInputText,
     emits: ['update:modelValue'],
     methods: {
-        onInput(event) {
-            this.$emit('update:modelValue', event.target.value);
-        }
-    },
-    computed: {
-        filled() {
-            return this.modelValue != null && this.modelValue.toString().length > 0;
-        },
         getPTOptions(key) {
             return this.ptm(key, {
                 context: {
@@ -25,6 +17,14 @@ export default {
                     disabled: this.$attrs.disabled || this.$attrs.disabled === ''
                 }
             });
+        },
+        onInput(event) {
+            this.$emit('update:modelValue', event.target.value);
+        }
+    },
+    computed: {
+        filled() {
+            return this.modelValue != null && this.modelValue.toString().length > 0;
         }
     }
 };

From 9f2321358727aad1e45999eafec2b77988f976d9 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 15:42:00 +0300
Subject: [PATCH 56/69] Update CHANGELOG.md

---
 CHANGELOG.md | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 299b8bd60..8d791d457 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,22 @@
 # Changelog
 
+## [3.43.0](https://github.com/primefaces/primevue/tree/3.43.0) (2023-12-05)
+
+[Full Changelog](https://github.com/primefaces/primevue/compare/3.42.0...3.43.0)
+
+**Fixed bugs:**
+
+-   Calendar: Overwrites date when in time-only mode [\#4901](https://github.com/primefaces/primevue/issues/4901)
+-   Binding and ordering pt options defect [\#4921](https://github.com/primefaces/primevue/issues/4921)
+-   Some icons are not displaying from PrimeIcons.js Api file [\#4897](https://github.com/primefaces/primevue/issues/4897)
+-   Treetable lazy load plus pagination toggler icon remain as open [\#4441](https://github.com/primefaces/primevue/issues/4441)
+
+**Implemented New Features and Enhancements:**
+
+-   Add parent param to all pt method options [\#4929](https://github.com/primefaces/primevue/issues/4929)
+-   Media components Accessibility Improvements [\#4908](https://github.com/primefaces/primevue/issues/4908)
+-   Tree: Missing 'filter' event on search [\#4876](https://github.com/primefaces/primevue/issues/4876)
+
 ## [3.42.0](https://github.com/primefaces/primevue/tree/3.42.0) (2023-11-28)
 
 [Full Changelog](https://github.com/primefaces/primevue/compare/3.41.1...3.42.0)

From e3b53d966e70330b06c5c5cd560873ab9ad57fa0 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 15:42:07 +0300
Subject: [PATCH 57/69] Set new version

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 265cd803a..e2790fecf 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
     "name": "primevue",
-    "version": "3.42.0",
+    "version": "3.43.0",
     "lockfileVersion": 2,
     "requires": true,
     "packages": {
         "": {
             "name": "primevue",
-            "version": "3.42.0",
+            "version": "3.43.0",
             "hasInstallScript": true,
             "license": "MIT",
             "dependencies": {
diff --git a/package.json b/package.json
index ca9289762..ca842dac7 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "primevue",
-    "version": "3.42.0",
+    "version": "3.43.0",
     "homepage": "https://primevue.org/",
     "repository": {
         "type": "git",

From 2333de99ea9791ecb840c3ea83312869f6aa5edd Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 16:15:27 +0300
Subject: [PATCH 58/69] PrimeVue version updates for demo

---
 components/doc/codeeditor/templates.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/components/doc/codeeditor/templates.js b/components/doc/codeeditor/templates.js
index b857d2685..8ba1b306c 100644
--- a/components/doc/codeeditor/templates.js
+++ b/components/doc/codeeditor/templates.js
@@ -2,7 +2,7 @@ import pkg from '../../../package.json';
 import { services } from './services';
 
 const PrimeVue = {
-    version: '^3.40.0',
+    version: '^3.43.0',
     description:
         'PrimeVue is an open source UI library for Vue featuring a rich set of 80+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBlock, which has 400+ ready to use UI blocks to build spectacular applications in no time.'
 };
@@ -60,7 +60,7 @@ const getVueApp = (props = {}, sourceType) => {
 
     if (embedded) {
         // main.js
-        unstyled += `, unstyled: true, pt: Tailwind, ptOptions: { mergeProps: true }`;
+        unstyled += `, unstyled: true, pt: Tailwind`;
         imports += `import Tailwind from 'primevue/passthrough/tailwind';
 import ThemeSwitcher from './components/ThemeSwitcher.vue';`;
         element += `app.component('ThemeSwitcher', ThemeSwitcher);`;

From 67b49e80bb08906ecfac8bf00b82a7c14e9c82ac Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 16:17:22 +0300
Subject: [PATCH 59/69] Update PTDoc.vue

---
 doc/inputnumber/pt/PTDoc.vue | 64 +++++++++++++++++++++++++++++++-----
 1 file changed, 56 insertions(+), 8 deletions(-)

diff --git a/doc/inputnumber/pt/PTDoc.vue b/doc/inputnumber/pt/PTDoc.vue
index c346f6bd8..cde885f3f 100644
--- a/doc/inputnumber/pt/PTDoc.vue
+++ b/doc/inputnumber/pt/PTDoc.vue
@@ -11,8 +11,20 @@
             mode="currency"
             currency="EUR"
             :pt="{
-                incrementButton: { class: 'bg-teal-500 border-teal-500' },
-                decrementButton: { class: 'bg-orange-500 border-orange-500' }
+                decrementButton: {
+                    root: () => {
+                        return {
+                            class: 'bg-orange-500 border-orange-500'
+                        };
+                    }
+                },
+                incrementButton: {
+                    root: () => {
+                        return {
+                            class: 'bg-teal-500 border-teal-500'
+                        };
+                    }
+                }
             }"
         />
     </div>
@@ -36,8 +48,20 @@ export default {
     mode="currency"
     currency="EUR"
     :pt="{
-        incrementButton: { class: 'bg-teal-500 border-teal-500' },
-        decrementButton: { class: 'bg-orange-500 border-orange-500' }
+        decrementButton: {
+            root: () => {
+                return {
+                    class: 'bg-orange-500 border-orange-500'
+                };
+            }
+        },
+        incrementButton: {
+            root: () => {
+                return {
+                    class: 'bg-teal-500 border-teal-500'
+                };
+            }
+        }
     }"
 />
 `,
@@ -54,8 +78,20 @@ export default {
             mode="currency"
             currency="EUR"
             :pt="{
-                incrementButton: { class: 'bg-teal-500 border-teal-500' },
-                decrementButton: { class: 'bg-orange-500 border-orange-500' }
+                decrementButton: {
+                    root: () => {
+                        return {
+                            class: 'bg-orange-500 border-orange-500'
+                        };
+                    }
+                },
+                incrementButton: {
+                    root: () => {
+                        return {
+                            class: 'bg-teal-500 border-teal-500'
+                        };
+                    }
+                }
             }"
         />
     </div>
@@ -84,8 +120,20 @@ export default {
             mode="currency"
             currency="EUR"
             :pt="{
-                incrementButton: { class: 'bg-teal-500 border-teal-500' },
-                decrementButton: { class: 'bg-orange-500 border-orange-500' }
+                decrementButton: {
+                    root: () => {
+                        return {
+                            class: 'bg-orange-500 border-orange-500'
+                        };
+                    }
+                },
+                incrementButton: {
+                    root: () => {
+                        return {
+                            class: 'bg-teal-500 border-teal-500'
+                        };
+                    }
+                }
             }"
         />
     </div>

From f50eaabef8ceeb8ffb8969ea8ddbcd5015e1e641 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 16:17:25 +0300
Subject: [PATCH 60/69] Update TailwindDoc.vue

---
 doc/splitbutton/theming/TailwindDoc.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/doc/splitbutton/theming/TailwindDoc.vue b/doc/splitbutton/theming/TailwindDoc.vue
index 484755123..5233e17c7 100644
--- a/doc/splitbutton/theming/TailwindDoc.vue
+++ b/doc/splitbutton/theming/TailwindDoc.vue
@@ -160,7 +160,7 @@ export default {
             code2: {
                 composition: `
 <template>
-    <div class="card flex justify-center flex-wrap">
+    <div class="card flex justify-center flex-wrap gap-2">
         <Toast />
         <SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" class="mb-2"></SplitButton>
         <SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" severity="secondary" class="mb-2"></SplitButton>

From aac63b398f7197f87c977cef6c7a2f11cb379ede Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 16:26:04 +0300
Subject: [PATCH 61/69] InputNumber pt demo updated

---
 doc/inputnumber/pt/PTDoc.vue | 48 ++++++++++++------------------------
 1 file changed, 16 insertions(+), 32 deletions(-)

diff --git a/doc/inputnumber/pt/PTDoc.vue b/doc/inputnumber/pt/PTDoc.vue
index cde885f3f..b96d0fb99 100644
--- a/doc/inputnumber/pt/PTDoc.vue
+++ b/doc/inputnumber/pt/PTDoc.vue
@@ -12,17 +12,13 @@
             currency="EUR"
             :pt="{
                 decrementButton: {
-                    root: () => {
-                        return {
-                            class: 'bg-orange-500 border-orange-500'
-                        };
+                    root: {
+                        class: 'bg-orange-500 border-orange-500'
                     }
                 },
                 incrementButton: {
-                    root: () => {
-                        return {
-                            class: 'bg-teal-500 border-teal-500'
-                        };
+                    root: {
+                        class: 'bg-teal-500 border-teal-500'
                     }
                 }
             }"
@@ -49,17 +45,13 @@ export default {
     currency="EUR"
     :pt="{
         decrementButton: {
-            root: () => {
-                return {
-                    class: 'bg-orange-500 border-orange-500'
-                };
+            root: {
+                class: 'bg-orange-500 border-orange-500'
             }
         },
         incrementButton: {
-            root: () => {
-                return {
-                    class: 'bg-teal-500 border-teal-500'
-                };
+            root: {
+                class: 'bg-teal-500 border-teal-500'
             }
         }
     }"
@@ -79,17 +71,13 @@ export default {
             currency="EUR"
             :pt="{
                 decrementButton: {
-                    root: () => {
-                        return {
-                            class: 'bg-orange-500 border-orange-500'
-                        };
+                    root: {
+                        class: 'bg-orange-500 border-orange-500'
                     }
                 },
                 incrementButton: {
-                    root: () => {
-                        return {
-                            class: 'bg-teal-500 border-teal-500'
-                        };
+                    root: {
+                        class: 'bg-teal-500 border-teal-500'
                     }
                 }
             }"
@@ -121,17 +109,13 @@ export default {
             currency="EUR"
             :pt="{
                 decrementButton: {
-                    root: () => {
-                        return {
-                            class: 'bg-orange-500 border-orange-500'
-                        };
+                    root: {
+                        class: 'bg-orange-500 border-orange-500'
                     }
                 },
                 incrementButton: {
-                    root: () => {
-                        return {
-                            class: 'bg-teal-500 border-teal-500'
-                        };
+                    root: {
+                        class: 'bg-teal-500 border-teal-500'
                     }
                 }
             }"

From 495324439ae0ff9e2d2c41c616aeffc75f74d65d Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 16:28:33 +0300
Subject: [PATCH 62/69] New dev iteration

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index ca842dac7..fe972a576 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "primevue",
-    "version": "3.43.0",
+    "version": "3.44.0-SNAPSHOT",
     "homepage": "https://primevue.org/",
     "repository": {
         "type": "git",

From 62978fd52a3c8a6edcac3e531463c29553e4e146 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 5 Dec 2023 17:52:22 +0300
Subject: [PATCH 63/69] Update TemplateDoc.vue

---
 doc/tree/TemplateDoc.vue | 35 +++++++++++++++--------------------
 1 file changed, 15 insertions(+), 20 deletions(-)

diff --git a/doc/tree/TemplateDoc.vue b/doc/tree/TemplateDoc.vue
index 938b5ee77..cfba2e0ec 100644
--- a/doc/tree/TemplateDoc.vue
+++ b/doc/tree/TemplateDoc.vue
@@ -141,27 +141,22 @@ const nodes = ref([
                 data: `
 {
     key: '0',
-    label: 'Documents',
-    data: 'Documents Folder',
-    icon: 'pi pi-fw pi-inbox',
+    label: 'Introduction',
     children: [
-        {
-            key: '0-0',
-            label: 'Work',
-            data: 'Work Folder',
-            icon: 'pi pi-fw pi-cog',
-            children: [
-                { key: '0-0-0', label: 'Expenses.doc', icon: 'pi pi-fw pi-file', data: 'Expenses Document' },
-                { key: '0-0-1', label: 'Resume.doc', icon: 'pi pi-fw pi-file', data: 'Resume Document' }
-            ]
-        },
-        {
-            key: '0-1',
-            label: 'Home',
-            data: 'Home Folder',
-            icon: 'pi pi-fw pi-home',
-            children: [{ key: '0-1-0', label: 'Invoices.txt', icon: 'pi pi-fw pi-file', data: 'Invoices for this month' }]
-        }
+        { key: '0-0', label: 'What is Vue.js?', data: 'https://vuejs.org/guide/introduction.html#what-is-vue', type: 'url' },
+        { key: '0-1', label: 'Quick Start', data: 'https://vuejs.org/guide/quick-start.html#quick-start', type: 'url' },
+        { key: '0-2', label: 'Creating a Vue Application', data: 'https://vuejs.org/guide/essentials/application.html#creating-a-vue-application', type: 'url' },
+        { key: '0-3', label: 'Conditional Rendering', data: 'https://vuejs.org/guide/essentials/conditional.html#conditional-rendering', type: 'url' }
+    ]
+},
+{
+    key: '1',
+    label: 'Components In-Depth',
+    children: [
+        { key: '1-0', label: 'Component Registration', data: 'https://vuejs.org/guide/components/registration.html#component-registration', type: 'url' },
+        { key: '1-1', label: 'Props', data: 'https://vuejs.org/guide/components/props.html#props', type: 'url' },
+        { key: '1-2', label: 'Components Events', data: 'https://vuejs.org/guide/components/events.html#component-events', type: 'url' },
+        { key: '1-3', label: 'Slots', data: 'https://vuejs.org/guide/components/slots.html#slots', type: 'url' }
     ]
 },
 ...`

From dd357ca38cf8c37831a8d009fd4bbc06c7c8af2b Mon Sep 17 00:00:00 2001
From: Cagatay Civici <cagatay.civici@gmail.com>
Date: Wed, 6 Dec 2023 14:37:37 +0300
Subject: [PATCH 64/69] Add Taner

---
 pages/team/index.vue | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/pages/team/index.vue b/pages/team/index.vue
index 21bc54509..2ba952890 100644
--- a/pages/team/index.vue
+++ b/pages/team/index.vue
@@ -88,6 +88,11 @@
                     <span class="mb-2 text-xl font-bold">Burak Sağlam</span>
                     <span>Front-End Developer</span>
                 </div>
+                <div class="flex flex-column align-items-center flex-auto">
+                    <img src="https://primefaces.org/cdn/primevue/images/team/taner.jpg" class="border-circle mb-4" alt="Taner Engin" />
+                    <span class="mb-2 text-xl font-bold">Taner Engin</span>
+                    <span>Front-End Developer</span>
+                </div>
             </div>
         </div>
     </div>

From 170f4c3dc5847b51635e7e3addd19a8eb99fbd6a Mon Sep 17 00:00:00 2001
From: Cagatay Civici <cagatay.civici@gmail.com>
Date: Wed, 6 Dec 2023 18:02:11 +0300
Subject: [PATCH 65/69] Update text

---
 pages/support/index.vue | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

diff --git a/pages/support/index.vue b/pages/support/index.vue
index 47dca900e..719652eeb 100755
--- a/pages/support/index.vue
+++ b/pages/support/index.vue
@@ -80,10 +80,6 @@
                         <i class="pi pi-check-circle mr-3 text-green-500"></i>
                         <span class="line-height-3">Figma to Theme Generator (Soon)</span>
                     </li>
-                    <li class="flex align-items-center mb-3">
-                        <i class="pi pi-check-circle mr-3 text-green-500"></i>
-                        <span class="line-height-3">PrimeIcons PRO - (Soon)</span>
-                    </li>
                 </ul>
             </div>
         </div>
@@ -91,8 +87,9 @@
         <div class="card mb-5">
             <div class="text-2xl text-900 font-semibold mb-3">Enhancement Credits</div>
             <p class="m-0 line-height-3 mb-5 text-secondary text-lg text-800">
-                New features and enhancement requests are not available in core services and provided via a credit based model instead named PrimeCredit. When you have a feature request, we offer an initial estimate in terms of credits and once this
-                estimate is confirmed by you then implementation will be delivered by our team within an estimated timeframe.
+                New features and enhancement requests are not available in core services and provided via a credit based model instead named PrimeCredit. When you have an enhancement request, initially our team will review your requirement to verify
+                if it is suitable to be included in the open source core library. We cannot guarantee that all requests can be accepted depending on the project roadmap, workload at the time and type of the requirement. After successful verification,
+                we prepare an initial estimate in terms of credits and once this estimate is confirmed by you, implementation will be delivered by our team within an estimated timeframe.
             </p>
 
             <div class="flex flex-column md:flex-row gap-5">
@@ -131,7 +128,7 @@
                     <div class="text-xl text-900 line-height-3 mb-2 font-medium">Are all of our requests guaranteed to be implemented with PrimeCredits?</div>
                     <p class="mt-0 mb-5 p-0 line-height-3 text-800">No, PrimeTek does not guarantee the implementation so it is suggested to confirm with us before purchasing credits.</p>
 
-                    <div class="text-900 line-height-3 mb-2 font-medium">Can we get PrimeCredits without PRO support?</div>
+                    <div class="text-xl text-900 line-height-3 mb-2 font-medium">Can we get PrimeCredits without PRO support?</div>
                     <p class="mt-0 p-0 line-height-3 text-800">No, feature development is exclusive to PRO members.</p>
                 </div>
                 <div class="w-full lg:w-4 p-5">

From d9372fdd73dc5920ca5b39e50d33b2231c6228e5 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Thu, 7 Dec 2023 09:49:59 +0300
Subject: [PATCH 66/69] ScrollPanel 'aria-controls' attr added

---
 components/lib/scrollpanel/ScrollPanel.vue | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/components/lib/scrollpanel/ScrollPanel.vue b/components/lib/scrollpanel/ScrollPanel.vue
index 710bb1666..3023ca487 100644
--- a/components/lib/scrollpanel/ScrollPanel.vue
+++ b/components/lib/scrollpanel/ScrollPanel.vue
@@ -1,7 +1,7 @@
 <template>
     <div :class="cx('root')" v-bind="ptm('root')" data-pc-name="scrollpanel">
         <div :class="cx('wrapper')" v-bind="ptm('wrapper')">
-            <div ref="content" :class="cx('content')" @scroll="onScroll" @mouseenter="moveBar" v-bind="ptm('content')">
+            <div ref="content" :id="contentId" :class="cx('content')" @scroll="onScroll" @mouseenter="moveBar" v-bind="ptm('content')">
                 <slot></slot>
             </div>
         </div>
@@ -11,6 +11,7 @@
             tabindex="0"
             role="scrollbar"
             aria-orientation="horizontal"
+            :aria-controls="contentId"
             :aria-valuenow="lastScrollLeft"
             @mousedown="onXBarMouseDown"
             @keydown="onKeyDown($event)"
@@ -26,6 +27,7 @@
             tabindex="0"
             role="scrollbar"
             aria-orientation="vertical"
+            :aria-controls="contentId"
             :aria-valuenow="lastScrollTop"
             @mousedown="onYBarMouseDown"
             @keydown="onKeyDown($event)"
@@ -357,6 +359,11 @@ export default {
                 this.documentResizeListener = null;
             }
         }
+    },
+    computed: {
+        contentId() {
+            return UniqueComponentId() + '_content';
+        }
     }
 };
 </script>

From 65348840d22eb1f8cdbaf67e480c757d379f82c6 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Thu, 7 Dec 2023 09:50:02 +0300
Subject: [PATCH 67/69] Update AccessibilityDoc.vue

---
 doc/scrollpanel/AccessibilityDoc.vue | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/doc/scrollpanel/AccessibilityDoc.vue b/doc/scrollpanel/AccessibilityDoc.vue
index 6c71fb2b7..1ab4e5a06 100644
--- a/doc/scrollpanel/AccessibilityDoc.vue
+++ b/doc/scrollpanel/AccessibilityDoc.vue
@@ -13,6 +13,10 @@
                     </tr>
                 </thead>
                 <tbody>
+                    <tr>
+                        <td><i>tab</i></td>
+                        <td>Moves focus through the bar.</td>
+                    </tr>
                     <tr>
                         <td><i>down arrow</i></td>
                         <td>Scrolls content down when vertical scrolling is available.</td>

From da1a98ebc3382c65e3603f5ac42d070a56d1e2ba Mon Sep 17 00:00:00 2001
From: Cagatay Civici <cagatay.civici@gmail.com>
Date: Thu, 7 Dec 2023 11:50:44 +0300
Subject: [PATCH 68/69] Remove visual design in favor of the new upcoming one.

---
 assets/menu/menu.json           |  4 ----
 doc/installation/PluginDoc.vue  |  5 ++++-
 doc/theming/CustomThemeDoc.vue  | 15 ++-------------
 pages/landing/FooterSection.vue | 25 +++++++++++--------------
 pages/landing/ThemeSection.vue  |  1 -
 5 files changed, 17 insertions(+), 33 deletions(-)

diff --git a/assets/menu/menu.json b/assets/menu/menu.json
index e4021cf7a..d754d176c 100644
--- a/assets/menu/menu.json
+++ b/assets/menu/menu.json
@@ -448,10 +448,6 @@
                             "name": "Overview",
                             "to": "/theming"
                         },
-                        {
-                            "name": "Visual Editor",
-                            "href": "https://designer.primevue.org"
-                        },
                         {
                             "name": "Colors",
                             "to": "/colors"
diff --git a/doc/installation/PluginDoc.vue b/doc/installation/PluginDoc.vue
index 91b343ef9..038c128e1 100644
--- a/doc/installation/PluginDoc.vue
+++ b/doc/installation/PluginDoc.vue
@@ -1,6 +1,9 @@
 <template>
     <DocSectionText v-bind="$attrs">
-        <p>PrimeVue plugin is required to be installed with the <i>use</i> function to set up the default <NuxtLink to="/theming">configuration</NuxtLink>.</p>
+        <p>
+            PrimeVue plugin is required to be installed with the <i>use</i> function to set up the default <NuxtLink to="/theming">configuration</NuxtLink>. If you are using <NuxtLink to="/theming">Nuxt</NuxtLink>, this step is not required as our
+            nuxt module handles it.
+        </p>
     </DocSectionText>
     <DocSectionCode :code="code" hideToggleCode importCode hideCodeSandbox hideStackBlitz />
 </template>
diff --git a/doc/theming/CustomThemeDoc.vue b/doc/theming/CustomThemeDoc.vue
index 0f5fecf13..705a95afa 100644
--- a/doc/theming/CustomThemeDoc.vue
+++ b/doc/theming/CustomThemeDoc.vue
@@ -5,19 +5,8 @@
             of the built-in themes so that you may customize an existing theme or create your own. The scss variables used in a theme are available at the <a href="https://www.primefaces.org/designer/api/primevue/3.9.0">SASS API</a> documentation.
         </p>
         <p>
-            There are 3 alternatives to create your own theme. First option is using the Visual Editor, second one is compiling a theme with command line sass and final alternative is embedding scss files within your project to let your build
-            environment do the compilation. In all cases, the generated theme file should be imported to your project. We've created a video tutorial that demonstrates all three options.
-        </p>
-
-        <div class="video-container">
-            <iframe width="560" height="315" src="https://www.youtube.com/embed/iZp_l0Yl3Zw" frameborder="0" allowfullscreen></iframe>
-        </div>
-
-        <h3>Visual Editor</h3>
-        <p>
-            <a href="https://designer.primevue.org">Visual Editor</a> is an easy way to quickly customize an existing theme without dealing with the details of the SASS API. The editor allows changing common settings like primary color for built-in
-            themes. Once you have completed the design, click the download button to access the generated <i>theme.css</i> file and import it to your project as an asset. In near future, an advanced UI Designer will be available with the ability to
-            edit all variables and components where you'll also be able to save your themes when accessed with an account.
+            There are 2 alternatives to create your own theme. First option is compiling a theme with command line sass whereas second option is embedding scss files within your project to let your build environment do the compilation. In all cases,
+            the generated theme file should be imported to your project.
         </p>
 
         <h3>Theme SCSS</h3>
diff --git a/pages/landing/FooterSection.vue b/pages/landing/FooterSection.vue
index 086126244..ce7c65245 100644
--- a/pages/landing/FooterSection.vue
+++ b/pages/landing/FooterSection.vue
@@ -27,6 +27,17 @@
                         </li>
                     </ul>
                 </div>
+                <div class="w-6 lg:w-3 flex">
+                    <ul class="list-none p-0 m-0">
+                        <li class="font-bold mt-5 lg:mt-0 mb-5">Theming</li>
+                        <li class="mb-4">
+                            <router-link to="/theming" class="text-secondary font-medium hover:text-primary border-round transition-all transition-duration-300">Styled Mode</router-link>
+                        </li>
+                        <li class="mb-4">
+                            <router-link to="/unstyled" class="text-secondary font-medium hover:text-primary border-round transition-all transition-duration-300">Unstyled Mode</router-link>
+                        </li>
+                    </ul>
+                </div>
                 <div class="w-6 lg:w-3 flex">
                     <ul class="list-none p-0 m-0">
                         <li class="font-bold mt-5 lg:mt-0 mb-5">Resources</li>
@@ -55,20 +66,6 @@
                         </li>
                     </ul>
                 </div>
-                <div class="w-6 lg:w-3 flex">
-                    <ul class="list-none p-0 m-0">
-                        <li class="font-bold mt-5 lg:mt-0 mb-5">Theming</li>
-                        <li class="mb-4">
-                            <router-link to="/theming" class="text-secondary font-medium hover:text-primary border-round transition-all transition-duration-300">Guide</router-link>
-                        </li>
-                        <li class="mb-4">
-                            <a href="https://designer.primevue.org" class="text-secondary font-medium hover:text-primary border-round transition-all transition-duration-300">Designer</a>
-                        </li>
-                        <li class="mb-4">
-                            <router-link to="/colors" class="text-secondary font-medium hover:text-primary border-round transition-all transition-duration-300">Colors</router-link>
-                        </li>
-                    </ul>
-                </div>
             </div>
 
             <hr class="section-divider mt-8" />
diff --git a/pages/landing/ThemeSection.vue b/pages/landing/ThemeSection.vue
index e149b0c9e..282836aa2 100644
--- a/pages/landing/ThemeSection.vue
+++ b/pages/landing/ThemeSection.vue
@@ -6,7 +6,6 @@
             <button type="button" :class="['font-medium linkbox mr-3 mt-4', { active: theme && theme.startsWith('lara') }]" @click="changeTheme('lara', 'green')">PrimeOne</button>
             <button type="button" :class="['font-medium linkbox mr-3 mt-4', { active: theme && theme.startsWith('md') }]" @click="changeTheme('md', 'indigo')">Material</button>
             <button type="button" :class="['font-medium linkbox mr-3 mt-4', { active: theme && theme.startsWith('bootstrap4') }]" @click="changeTheme('bootstrap4', 'blue')">Bootstrap</button>
-            <a type="button" class="font-medium px-link linkbox mt-4" href="https://designer.primevue.org">more...</a>
         </div>
         <div
             class="themes-main flex mt-7 justify-content-center px-5 lg:px-8"

From d77809017db519ba1979d0db60cc2d8e167d7219 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Thu, 7 Dec 2023 14:09:01 +0300
Subject: [PATCH 69/69] Fixed #4923 - Dropdown: Overlapping Clear Icon while
 disabled

---
 components/lib/dropdown/style/DropdownStyle.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/lib/dropdown/style/DropdownStyle.js b/components/lib/dropdown/style/DropdownStyle.js
index 9ddb31966..079838082 100644
--- a/components/lib/dropdown/style/DropdownStyle.js
+++ b/components/lib/dropdown/style/DropdownStyle.js
@@ -102,7 +102,7 @@ const classes = {
         'p-dropdown p-component p-inputwrapper',
         {
             'p-disabled': props.disabled,
-            'p-dropdown-clearable': props.showClear && !props.disabled,
+            'p-dropdown-clearable': props.showClear,
             'p-focus': state.focused,
             'p-inputwrapper-filled': instance.hasSelectedOption,
             'p-inputwrapper-focus': state.focused || state.overlayVisible,