diff --git a/components/lib/autocomplete/AutoComplete.vue b/components/lib/autocomplete/AutoComplete.vue
index 96530978eb9..f88f43699c1 100755
--- a/components/lib/autocomplete/AutoComplete.vue
+++ b/components/lib/autocomplete/AutoComplete.vue
@@ -106,7 +106,7 @@
         >
             <template #icon>
                 <slot name="dropdownicon" :class="dropdownIcon">
-                    <component :is="dropdownIcon ? 'span' : 'ChevronDownIcon'" :class="dropdownIcon" v-bind="ptm('dropdownButton')['icon']" />
+                    <component :is="dropdownIcon ? 'span' : 'ChevronDownIcon'" :class="dropdownIcon" v-bind="ptm('dropdownButton')['icon']" data-pc-section="dropdownicon" />
                 </slot>
             </template>
         </Button>
diff --git a/components/lib/breadcrumb/Breadcrumb.vue b/components/lib/breadcrumb/Breadcrumb.vue
index 9d1cde00a40..1b1158f579e 100755
--- a/components/lib/breadcrumb/Breadcrumb.vue
+++ b/components/lib/breadcrumb/Breadcrumb.vue
@@ -2,7 +2,7 @@
     <nav :class="cx('root')" v-bind="ptm('root')" data-pc-name="breadcrumb">
         <ol :class="cx('menu')" v-bind="ptm('menu')">
             <BreadcrumbItem v-if="home" :item="home" :class="cx('home')" :templates="$slots" :exact="exact" :pt="pt" :unstyled="unstyled" v-bind="ptm('home')" />
-            <template v-for="(item, i) of model" :key="item.label">
+            <template v-for="(item, i) of model" :key="item.label + '_' + i">
                 <li v-if="home || i !== 0" :class="cx('separator')" v-bind="ptm('separator')">
                     <slot name="separator">
                         <ChevronRightIcon aria-hidden="true" v-bind="ptm('separatorIcon')" />
diff --git a/components/lib/calendar/Calendar.d.ts b/components/lib/calendar/Calendar.d.ts
index 38969148ed4..68629b3e387 100755
--- a/components/lib/calendar/Calendar.d.ts
+++ b/components/lib/calendar/Calendar.d.ts
@@ -753,15 +753,21 @@ export interface CalendarSlots {
     }): VNode[];
     /**
      * Custom dropdown icon template.
+     * @param {Object} scope - dropdown icon slot's params.
      */
-    dropdownicon(): VNode[];
+    dropdownicon(scope: {
+        /**
+         * Style class of the dropdown icon
+         */
+        class: any;
+    }): VNode[];
     /**
      * Custom previous icon template.
      * @param {Object} scope - previous icon slot's params.
      */
     previousicon(scope: {
         /**
-         * Style class of the dropdown icon
+         * Style class of the previous icon
          */
         class: any;
     }): VNode[];
@@ -771,7 +777,7 @@ export interface CalendarSlots {
      */
     nexticon(scope: {
         /**
-         * Style class of the dropdown icon
+         * Style class of the next icon
          */
         class: any;
     }): VNode[];
@@ -781,7 +787,7 @@ export interface CalendarSlots {
      */
     incrementicon(scope: {
         /**
-         * Style class of the dropdown icon
+         * Style class of the increment icon
          */
         class: any;
     }): VNode[];
@@ -791,7 +797,7 @@ export interface CalendarSlots {
      */
     decrementicon(scope: {
         /**
-         * Style class of the dropdown icon
+         * Style class of the decrement icon
          */
         class: any;
     }): VNode[];
diff --git a/components/lib/calendar/Calendar.vue b/components/lib/calendar/Calendar.vue
index b5f701cb223..7f73dfd0b1f 100755
--- a/components/lib/calendar/Calendar.vue
+++ b/components/lib/calendar/Calendar.vue
@@ -42,8 +42,8 @@
             data-pc-section="dropdownbutton"
         >
             <template #icon>
-                <slot name="dropdownicon">
-                    <component :is="icon ? 'span' : 'CalendarIcon'" :class="icon" v-bind="ptm('dropdownButton')['icon']" data-pc-section="icon" />
+                <slot name="dropdownicon" :class="icon">
+                    <component :is="icon ? 'span' : 'CalendarIcon'" :class="icon" v-bind="ptm('dropdownButton')['icon']" data-pc-section="dropdownicon" />
                 </slot>
             </template>
         </CalendarButton>
@@ -86,32 +86,62 @@
                                         </slot>
                                     </button>
                                     <div :class="cx('title')" v-bind="ptm('title')">
-                                        <button
-                                            v-if="currentView === 'date'"
-                                            type="button"
-                                            @click="switchToMonthView"
-                                            @keydown="onContainerButtonKeydown"
-                                            :class="cx('monthTitle')"
-                                            :disabled="switchViewButtonDisabled"
-                                            :aria-label="$primevue.config.locale.chooseMonth"
-                                            v-bind="ptm('monthTitle')"
-                                            data-pc-group-section="view"
-                                        >
-                                            {{ getMonthName(month.month) }}
-                                        </button>
-                                        <button
-                                            v-if="currentView !== 'year'"
-                                            type="button"
-                                            @click="switchToYearView"
-                                            @keydown="onContainerButtonKeydown"
-                                            :class="cx('yearTitle')"
-                                            :disabled="switchViewButtonDisabled"
-                                            :aria-label="$primevue.config.locale.chooseYear"
-                                            v-bind="ptm('yearTitle')"
-                                            data-pc-group-section="view"
-                                        >
-                                            {{ getYear(month) }}
-                                        </button>
+                                        <template v-if="$primevue.config.locale.showMonthAfterYear">
+                                            <button
+                                                v-if="currentView !== 'year'"
+                                                type="button"
+                                                @click="switchToYearView"
+                                                @keydown="onContainerButtonKeydown"
+                                                :class="cx('yearTitle')"
+                                                :disabled="switchViewButtonDisabled"
+                                                :aria-label="$primevue.config.locale.chooseYear"
+                                                v-bind="ptm('yearTitle')"
+                                                data-pc-group-section="view"
+                                            >
+                                                {{ getYear(month) }}
+                                            </button>
+                                            <button
+                                                v-if="currentView === 'date'"
+                                                type="button"
+                                                @click="switchToMonthView"
+                                                @keydown="onContainerButtonKeydown"
+                                                :class="cx('monthTitle')"
+                                                :disabled="switchViewButtonDisabled"
+                                                :aria-label="$primevue.config.locale.chooseMonth"
+                                                v-bind="ptm('monthTitle')"
+                                                data-pc-group-section="view"
+                                            >
+                                                {{ getMonthName(month.month) }}
+                                            </button>
+                                        </template>
+                                        <template v-else>
+                                            <button
+                                                v-if="currentView === 'date'"
+                                                type="button"
+                                                @click="switchToMonthView"
+                                                @keydown="onContainerButtonKeydown"
+                                                :class="cx('monthTitle')"
+                                                :disabled="switchViewButtonDisabled"
+                                                :aria-label="$primevue.config.locale.chooseMonth"
+                                                v-bind="ptm('monthTitle')"
+                                                data-pc-group-section="view"
+                                            >
+                                                {{ getMonthName(month.month) }}
+                                            </button>
+                                            <button
+                                                v-if="currentView !== 'year'"
+                                                type="button"
+                                                @click="switchToYearView"
+                                                @keydown="onContainerButtonKeydown"
+                                                :class="cx('yearTitle')"
+                                                :disabled="switchViewButtonDisabled"
+                                                :aria-label="$primevue.config.locale.chooseYear"
+                                                v-bind="ptm('yearTitle')"
+                                                data-pc-group-section="view"
+                                            >
+                                                {{ getYear(month) }}
+                                            </button>
+                                        </template>
                                         <span v-if="currentView === 'year'" :class="cx('decadeTitle')" v-bind="ptm('decadeTitle')">
                                             <slot name="decade" :years="yearPickerValues"> {{ yearPickerValues[0].value }} - {{ yearPickerValues[yearPickerValues.length - 1].value }} </slot>
                                         </span>
diff --git a/components/lib/column/Column.d.ts b/components/lib/column/Column.d.ts
index b851eac433b..f2ed27f296f 100755
--- a/components/lib/column/Column.d.ts
+++ b/components/lib/column/Column.d.ts
@@ -892,6 +892,10 @@ export interface ColumnSlots {
      * @param {Object} scope - row toggler icon slot's params.
      */
     rowtogglericon(scope: {
+        /**
+         * Style class of the row toggler icon.
+         */
+        class: string;
         /**
          * Current row expanded state.
          */
diff --git a/components/lib/config/PrimeVue.d.ts b/components/lib/config/PrimeVue.d.ts
index 9d53ae5f5a4..59dafff04f0 100644
--- a/components/lib/config/PrimeVue.d.ts
+++ b/components/lib/config/PrimeVue.d.ts
@@ -326,6 +326,7 @@ export interface PrimeVueLocaleOptions {
     today?: string;
     weekHeader?: string;
     firstDayOfWeek?: number;
+    showMonthAfterYear?: boolean;
     dateFormat?: string;
     weak?: string;
     medium?: string;
diff --git a/components/lib/config/PrimeVue.js b/components/lib/config/PrimeVue.js
index 48cba06953c..04c8ba57645 100644
--- a/components/lib/config/PrimeVue.js
+++ b/components/lib/config/PrimeVue.js
@@ -59,6 +59,7 @@ export const defaultOptions = {
         today: 'Today',
         weekHeader: 'Wk',
         firstDayOfWeek: 0,
+        showMonthAfterYear: false,
         dateFormat: 'mm/dd/yy',
         weak: 'Weak',
         medium: 'Medium',
diff --git a/components/lib/datatable/BodyCell.vue b/components/lib/datatable/BodyCell.vue
index ba1a924e803..362da1760e9 100755
--- a/components/lib/datatable/BodyCell.vue
+++ b/components/lib/datatable/BodyCell.vue
@@ -63,7 +63,7 @@
                 v-bind="getColumnPT('rowToggler')"
                 data-pc-group-section="rowactionbutton"
             >
-                <component v-if="column.children && column.children.rowtogglericon" :is="column.children.rowtogglericon" :rowExpanded="isRowExpanded" />
+                <component v-if="column.children && column.children.rowtogglericon" :is="column.children.rowtogglericon" :class="cx('rowTogglerIcon')" :rowExpanded="isRowExpanded" />
                 <template v-else>
                     <span v-if="isRowExpanded && expandedRowIcon" :class="[cx('rowTogglerIcon'), expandedRowIcon]" />
                     <ChevronDownIcon v-else-if="isRowExpanded && !expandedRowIcon" :class="cx('rowTogglerIcon')" v-bind="getColumnPT('rowTogglerIcon')" />
diff --git a/components/lib/datatable/ColumnFilter.vue b/components/lib/datatable/ColumnFilter.vue
index bca39893839..9f94d6a648c 100644
--- a/components/lib/datatable/ColumnFilter.vue
+++ b/components/lib/datatable/ColumnFilter.vue
@@ -87,7 +87,7 @@
                                     :pt="getColumnPT('filterMatchModeDropdown')"
                                     data-pc-section="filtermatchmodedropdown"
                                 ></CFDropdown>
-                                <component v-if="display === 'menu'" :is="filterElement" :field="field" :filterModel="fieldConstraint" :filterCallback="filterCallback" />
+                                <component v-if="display === 'menu'" :is="filterElement" :field="field" :filterModel="fieldConstraint" :filterCallback="filterCallback" :applyFilter="applyFilter" />
                                 <div v-bind="getColumnPT('filterRemove')">
                                     <CFButton
                                         v-if="showRemoveIcon"
diff --git a/components/lib/datatable/DataTable.d.ts b/components/lib/datatable/DataTable.d.ts
index 1e67b6c955f..61275bdb547 100755
--- a/components/lib/datatable/DataTable.d.ts
+++ b/components/lib/datatable/DataTable.d.ts
@@ -1211,19 +1211,63 @@ export interface DataTableSlots {
     /**
      * Custom paginator first page link icon template.
      */
-    paginatorfirstpagelinkicon(): VNode[];
+    paginatorfirstpagelinkicon(scope: {
+        /**
+         * Style class of the paginator first page link icon.
+         * @param {Object} scope - paginatorfirstpagelinkicon's params.
+         */
+        class: string;
+    }): VNode[];
     /**
      * Custom paginator previous page link icon template.
      */
-    paginatorprevpagelinkicon(): VNode[];
+    paginatorprevpagelinkicon(scope: {
+        /**
+         * Style class of the paginator prev page link icon.
+         * @param {Object} scope - paginatorprevpagelinkicon's params.
+         */
+        class: string;
+    }): VNode[];
     /**
      * Custom paginator next page link icon template.
      */
-    paginatornextpagelinkicon(): VNode[];
+    paginatornextpagelinkicon(scope: {
+        /**
+         * Style class of the paginator next page link icon.
+         * @param {Object} scope - paginatornextpagelinkicon's params.
+         */
+        class: string;
+    }): VNode[];
     /**
      * Custom paginator last page link icon template.
      */
-    paginatorlastpagelinkicon(): VNode[];
+    paginatorlastpagelinkicon(scope: {
+        /**
+         * Style class of the paginator last page link icon.
+         * @param {Object} scope - paginatorlastpagelinkicon's params.
+         */
+        class: string;
+    }): VNode[];
+    /**
+     * Custom paginatorrowsperpagedropdownicon template.
+     * @param {Object} scope - paginatorrowsperpagedropdownicon's params.
+     */
+    paginatorrowsperpagedropdownicon(scope: {
+        /**
+         * Style class of the paginator rows per page dropdown icon.
+         */
+        class: string;
+    }): VNode[];
+    /**
+     * Custom paginatorjumptopagedropdownicon template.
+     * @param {Object} scope - paginatorjumptopagedropdownicon's params.
+     */
+    paginatorjumptopagedropdownicon(scope: {
+        /**
+         * Style class of the paginator jump to page dropdown icon.
+         */
+        class: string;
+    }): VNode[];
 }
 /**
  * Defines valid emits in Datatable component.
diff --git a/components/lib/datatable/DataTable.vue b/components/lib/datatable/DataTable.vue
index dbe2b225174..ff68d7e29b5 100755
--- a/components/lib/datatable/DataTable.vue
+++ b/components/lib/datatable/DataTable.vue
@@ -33,17 +33,23 @@
             <template v-if="$slots.paginatorend" #end>
                 <slot name="paginatorend"></slot>
             </template>
-            <template v-if="$slots.paginatorfirstpagelinkicon" #firstpagelinkicon>
-                <slot name="paginatorfirstpagelinkicon"></slot>
+            <template v-if="$slots.paginatorfirstpagelinkicon" #firstpagelinkicon="slotProps">
+                <slot name="paginatorfirstpagelinkicon" :class="slotProps.class"></slot>
             </template>
-            <template v-if="$slots.paginatorprevpagelinkicon" #prevpagelinkicon>
-                <slot name="paginatorprevpagelinkicon"></slot>
+            <template v-if="$slots.paginatorprevpagelinkicon" #prevpagelinkicon="slotProps">
+                <slot name="paginatorprevpagelinkicon" :class="slotProps.class"></slot>
             </template>
-            <template v-if="$slots.paginatornextpagelinkicon" #nextpagelinkicon>
-                <slot name="paginatornextpagelinkicon"></slot>
+            <template v-if="$slots.paginatornextpagelinkicon" #nextpagelinkicon="slotProps">
+                <slot name="paginatornextpagelinkicon" :class="slotProps.class"></slot>
             </template>
-            <template v-if="$slots.paginatorlastpagelinkicon" #lastpagelinkicon>
-                <slot name="paginatorlastpagelinkicon"></slot>
+            <template v-if="$slots.paginatorlastpagelinkicon" #lastpagelinkicon="slotProps">
+                <slot name="paginatorlastpagelinkicon" :class="slotProps.class"></slot>
+            </template>
+            <template v-if="$slots.paginatorjumptopagedropdownicon" #jumptopagedropdownicon="slotProps">
+                <slot name="paginatorjumptopagedropdownicon" :class="slotProps.class"></slot>
+            </template>
+            <template v-if="$slots.paginatorrowsperpagedropdownicon" #rowsperpagedropdownicon="slotProps">
+                <slot name="paginatorrowsperpagedropdownicon" :class="slotProps.class"></slot>
             </template>
         </DTPaginator>
         <div :class="cx('wrapper')" :style="[sx('wrapper'), { maxHeight: virtualScrollerDisabled ? scrollHeight : '' }]" v-bind="ptm('wrapper')">
@@ -245,17 +251,23 @@
             <template v-if="$slots.paginatorend" #end>
                 <slot name="paginatorend"></slot>
             </template>
-            <template v-if="$slots.paginatorfirstpagelinkicon" #firstpagelinkicon>
-                <slot name="paginatorfirstpagelinkicon"></slot>
+            <template v-if="$slots.paginatorfirstpagelinkicon" #firstpagelinkicon="slotProps">
+                <slot name="paginatorfirstpagelinkicon" :class="slotProps.class"></slot>
+            </template>
+            <template v-if="$slots.paginatorprevpagelinkicon" #prevpagelinkicon="slotProps">
+                <slot name="paginatorprevpagelinkicon" :class="slotProps.class"></slot>
             </template>
-            <template v-if="$slots.paginatorprevpagelinkicon" #prevpagelinkicon>
-                <slot name="paginatorprevpagelinkicon"></slot>
+            <template v-if="$slots.paginatornextpagelinkicon" #nextpagelinkicon="slotProps">
+                <slot name="paginatornextpagelinkicon" :class="slotProps.class"></slot>
             </template>
-            <template v-if="$slots.paginatornextpagelinkicon" #nextpagelinkicon>
-                <slot name="paginatornextpagelinkicon"></slot>
+            <template v-if="$slots.paginatorlastpagelinkicon" #lastpagelinkicon="slotProps">
+                <slot name="paginatorlastpagelinkicon" :class="slotProps.class"></slot>
             </template>
-            <template v-if="$slots.paginatorlastpagelinkicon" #lastpagelinkicon>
-                <slot name="paginatorlastpagelinkicon"></slot>
+            <template v-if="$slots.paginatorjumptopagedropdownicon" #jumptopagedropdownicon="slotProps">
+                <slot name="paginatorjumptopagedropdownicon" :class="slotProps.class"></slot>
+            </template>
+            <template v-if="$slots.paginatorrowsperpagedropdownicon" #rowsperpagedropdownicon="slotProps">
+                <slot name="paginatorrowsperpagedropdownicon" :class="slotProps.class"></slot>
             </template>
         </DTPaginator>
         <div ref="resizeHelper" :class="cx('resizeHelper')" style="display: none" v-bind="ptm('resizeHelper')"></div>
@@ -710,7 +722,6 @@ export default {
         },
         onRowClick(e) {
             const event = e.originalEvent;
-            const index = e.index;
             const body = this.$refs.bodyRef && this.$refs.bodyRef.$el;
             const focusedItem = DomHandler.findSingle(body, 'tr[data-p-selectable-row="true"][tabindex="0"]');
 
@@ -791,8 +802,10 @@ export default {
             this.rowTouched = false;
 
             if (focusedItem) {
+                const targetRow = e.originalEvent.target.closest('tr[data-p-selectable-row="true"]');
+
                 focusedItem.tabIndex = '-1';
-                DomHandler.find(body, 'tr[data-p-selectable-row="true"]')[index].tabIndex = '0';
+                targetRow.tabIndex = '0';
             }
         },
         onRowDblClick(e) {
diff --git a/components/lib/datatable/TableBody.vue b/components/lib/datatable/TableBody.vue
index 89a0316e5e5..764dc7daa73 100755
--- a/components/lib/datatable/TableBody.vue
+++ b/components/lib/datatable/TableBody.vue
@@ -190,7 +190,7 @@ export default {
             default: 0
         },
         dataKey: {
-            type: String,
+            type: [String, Function],
             default: null
         },
         expandedRowIcon: {
diff --git a/components/lib/image/Image.vue b/components/lib/image/Image.vue
index 038f261c56d..50816b8a9bd 100644
--- a/components/lib/image/Image.vue
+++ b/components/lib/image/Image.vue
@@ -163,6 +163,7 @@ export default {
             !this.isUnstyled && DomHandler.addClass(this.mask, 'p-component-overlay-leave');
         },
         onLeave() {
+            DomHandler.removeClass(document.body, 'p-overflow-hidden');
             this.$emit('hide');
         },
         onAfterLeave(el) {
diff --git a/components/lib/inplace/Inplace.vue b/components/lib/inplace/Inplace.vue
index 0284fef53ac..52d21ce8cdf 100755
--- a/components/lib/inplace/Inplace.vue
+++ b/components/lib/inplace/Inplace.vue
@@ -8,7 +8,7 @@
             <IPButton v-if="closable" :aria-label="closeAriaLabel" @click="close" :unstyled="unstyled" :pt="ptm('closeButton')" v-bind="closeButtonProps">
                 <template #icon>
                     <slot name="closeicon">
-                        <component :is="closeIcon ? 'span' : 'TimesIcon'" :class="closeIcon" v-bind="ptm('closeButton')['icon']"></component>
+                        <component :is="closeIcon ? 'span' : 'TimesIcon'" :class="closeIcon" v-bind="ptm('closeButton')['icon']" data-pc-section="closebuttonicon"></component>
                     </slot>
                 </template>
             </IPButton>
diff --git a/components/lib/inputnumber/InputNumber.vue b/components/lib/inputnumber/InputNumber.vue
index 29af7e3ae66..0b3682953ca 100755
--- a/components/lib/inputnumber/InputNumber.vue
+++ b/components/lib/inputnumber/InputNumber.vue
@@ -39,7 +39,7 @@
             >
                 <template #icon>
                     <slot name="incrementbuttonicon">
-                        <component :is="incrementButtonIcon ? 'span' : 'AngleUpIcon'" :class="incrementButtonIcon" v-bind="ptm('incrementButton')['icon']" />
+                        <component :is="incrementButtonIcon ? 'span' : 'AngleUpIcon'" :class="incrementButtonIcon" v-bind="ptm('incrementButton')['icon']" data-pc-section="incrementbuttonicon" />
                     </slot>
                 </template>
             </INButton>
@@ -55,7 +55,7 @@
             >
                 <template #icon>
                     <slot name="decrementbuttonicon">
-                        <component :is="decrementButtonIcon ? 'span' : 'AngleDownIcon'" :class="decrementButtonIcon" v-bind="ptm('decrementButton')['icon']" />
+                        <component :is="decrementButtonIcon ? 'span' : 'AngleDownIcon'" :class="decrementButtonIcon" v-bind="ptm('decrementButton')['icon']" data-pc-section="decrementbuttonicon" />
                     </slot>
                 </template>
             </INButton>
@@ -73,7 +73,7 @@
         >
             <template #icon>
                 <slot name="incrementbuttonicon">
-                    <component :is="incrementButtonIcon ? 'span' : 'AngleUpIcon'" :class="incrementButtonIcon" v-bind="ptm('incrementButton')['icon']" />
+                    <component :is="incrementButtonIcon ? 'span' : 'AngleUpIcon'" :class="incrementButtonIcon" v-bind="ptm('incrementButton')['icon']" data-pc-section="incrementbuttonicon" />
                 </slot>
             </template>
         </INButton>
@@ -90,7 +90,7 @@
         >
             <template #icon>
                 <slot name="decrementbuttonicon">
-                    <component :is="decrementButtonIcon ? 'span' : 'AngleDownIcon'" :class="decrementButtonIcon" v-bind="ptm('decrementButton')['icon']" />
+                    <component :is="decrementButtonIcon ? 'span' : 'AngleDownIcon'" :class="decrementButtonIcon" v-bind="ptm('decrementButton')['icon']" data-pc-section="decrementbuttonicon" />
                 </slot>
             </template>
         </INButton>
diff --git a/components/lib/orderlist/OrderList.vue b/components/lib/orderlist/OrderList.vue
index a3681b7030b..ffc153a1525 100755
--- a/components/lib/orderlist/OrderList.vue
+++ b/components/lib/orderlist/OrderList.vue
@@ -5,28 +5,28 @@
             <OLButton type="button" @click="moveUp" :aria-label="moveUpAriaLabel" :disabled="moveDisabled()" :pt="ptm('moveUpButton')" v-bind="moveUpButtonProps" :unstyled="unstyled">
                 <template #icon>
                     <slot name="moveupicon">
-                        <AngleUpIcon v-bind="ptm('moveUpButton')['icon']" />
+                        <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="ptm('moveTopButton')" :unstyled="unstyled">
                 <template #icon>
                     <slot name="movetopicon">
-                        <AngleDoubleUpIcon v-bind="ptm('moveTopButton')['icon']" />
+                        <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" :unstyled="unstyled">
                 <template #icon>
                     <slot name="movedownicon">
-                        <AngleDownIcon v-bind="ptm('moveDownButton')['icon']" />
+                        <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" :unstyled="unstyled">
                 <template #icon>
                     <slot name="movebottomicon">
-                        <AngleDoubleDownIcon v-bind="ptm('moveBottomButton')['icon']" />
+                        <AngleDoubleDownIcon v-bind="ptm('moveBottomButton')['icon']" data-pc-section="movebottomicon" />
                     </slot>
                 </template>
             </OLButton>
diff --git a/components/lib/paginator/JumpToPageDropdown.vue b/components/lib/paginator/JumpToPageDropdown.vue
index cdaf0f6e54c..9fa40a0e0fd 100644
--- a/components/lib/paginator/JumpToPageDropdown.vue
+++ b/components/lib/paginator/JumpToPageDropdown.vue
@@ -11,7 +11,11 @@
         :pt="ptm('jumpToPageDropdown')"
         data-pc-section="jumptopagedropdown"
         data-pc-group-section="pagedropdown"
-    ></JTPDropdown>
+    >
+        <template v-if="templates['jumptopagedropdownicon']" #dropdownicon="slotProps">
+            <component :is="templates['jumptopagedropdownicon']" :class="slotProps.class" />
+        </template>
+    </JTPDropdown>
 </template>
 
 <script>
@@ -26,7 +30,8 @@ export default {
     props: {
         page: Number,
         pageCount: Number,
-        disabled: Boolean
+        disabled: Boolean,
+        templates: null
     },
     methods: {
         onChange(value) {
diff --git a/components/lib/paginator/Paginator.d.ts b/components/lib/paginator/Paginator.d.ts
index ae0c33bb954..10503bd8cd8 100755
--- a/components/lib/paginator/Paginator.d.ts
+++ b/components/lib/paginator/Paginator.d.ts
@@ -302,6 +302,26 @@ export interface PaginatorSlots {
      * Custom last page link icon template.
      */
     lastpagelinkicon(): VNode[];
+    /**
+     * Custom rowsperpagedropdownicon template.
+     * @param {Object} scope - rowsperpagedropdownicon's params.
+     */
+    rowsperpagedropdownicon(scope: {
+        /**
+         * Style class of the rowsperpagedropdown icon.
+         */
+        class: string;
+    }): VNode[];
+    /**
+     * Custom jumptopagedropdownicon template.
+     * @param {Object} scope - jumptopagedropdownicon's params.
+     */
+    jumptopagedropdownicon(scope: {
+        /**
+         * Style class of the jumptopagedropdown icon.
+         */
+        class: string;
+    }): VNode[];
 }
 
 /**
diff --git a/components/lib/paginator/Paginator.vue b/components/lib/paginator/Paginator.vue
index 9a38490d6a8..43e4789eb19 100755
--- a/components/lib/paginator/Paginator.vue
+++ b/components/lib/paginator/Paginator.vue
@@ -5,10 +5,10 @@
                 <slot name="start" :state="currentState"></slot>
             </div>
             <template v-for="item in value" :key="item">
-                <FirstPageLink v-if="item === 'FirstPageLink'" :aria-label="getAriaLabel('firstPageLabel')" :template="$slots.firstpagelinkicon" @click="changePageToFirst($event)" :disabled="isFirstPage || empty" :pt="pt" />
-                <PrevPageLink v-else-if="item === 'PrevPageLink'" :aria-label="getAriaLabel('prevPageLabel')" :template="$slots.prevpagelinkicon" @click="changePageToPrev($event)" :disabled="isFirstPage || empty" :pt="pt" />
-                <NextPageLink v-else-if="item === 'NextPageLink'" :aria-label="getAriaLabel('nextPageLabel')" :template="$slots.nextpagelinkicon" @click="changePageToNext($event)" :disabled="isLastPage || empty" :pt="pt" />
-                <LastPageLink v-else-if="item === 'LastPageLink'" :aria-label="getAriaLabel('lastPageLabel')" :template="$slots.lastpagelinkicon" @click="changePageToLast($event)" :disabled="isLastPage || empty" :pt="pt" />
+                <FirstPageLink v-if="item === 'FirstPageLink'" :aria-label="getAriaLabel('firstPageLabel')" :template="$slots.firstpagelinkicon" @click="changePageToFirst($event)" :disabled="isFirstPage || empty" :unstyled="unstyled" :pt="pt" />
+                <PrevPageLink v-else-if="item === 'PrevPageLink'" :aria-label="getAriaLabel('prevPageLabel')" :template="$slots.prevpagelinkicon" @click="changePageToPrev($event)" :disabled="isFirstPage || empty" :unstyled="unstyled" :pt="pt" />
+                <NextPageLink v-else-if="item === 'NextPageLink'" :aria-label="getAriaLabel('nextPageLabel')" :template="$slots.nextpagelinkicon" @click="changePageToNext($event)" :disabled="isLastPage || empty" :unstyled="unstyled" :pt="pt" />
+                <LastPageLink v-else-if="item === 'LastPageLink'" :aria-label="getAriaLabel('lastPageLabel')" :template="$slots.lastpagelinkicon" @click="changePageToLast($event)" :disabled="isLastPage || empty" :unstyled="unstyled" :pt="pt" />
                 <PageLinks v-else-if="item === 'PageLinks'" :aria-label="getAriaLabel('pageLabel')" :value="pageLinks" :page="page" @click="changePageLink($event)" :pt="pt" />
                 <CurrentPageReport
                     v-else-if="item === 'CurrentPageReport'"
@@ -20,6 +20,7 @@
                     :first="d_first"
                     :rows="d_rows"
                     :totalRecords="totalRecords"
+                    :unstyled="unstyled"
                     :pt="pt"
                 />
                 <RowsPerPageDropdown
@@ -29,6 +30,7 @@
                     :options="rowsPerPageOptions"
                     @rows-change="onRowChange($event)"
                     :disabled="empty"
+                    :templates="$slots"
                     :unstyled="unstyled"
                     :pt="pt"
                 />
@@ -39,6 +41,7 @@
                     :pageCount="pageCount"
                     @page-change="changePage($event)"
                     :disabled="empty"
+                    :templates="$slots"
                     :unstyled="unstyled"
                     :pt="pt"
                 />
diff --git a/components/lib/paginator/RowsPerPageDropdown.vue b/components/lib/paginator/RowsPerPageDropdown.vue
index 02f9b90e15c..7e8bec5c498 100755
--- a/components/lib/paginator/RowsPerPageDropdown.vue
+++ b/components/lib/paginator/RowsPerPageDropdown.vue
@@ -11,7 +11,11 @@
         :pt="ptm('rowPerPageDropdown')"
         data-pc-section="rowperpagedropdown"
         data-pc-group-section="pagedropdown"
-    ></RPPDropdown>
+    >
+        <template v-if="templates['rowsperpagedropdownicon']" #dropdownicon="slotProps">
+            <component :is="templates['rowsperpagedropdownicon']" :class="slotProps.class" />
+        </template>
+    </RPPDropdown>
 </template>
 
 <script>
@@ -26,7 +30,8 @@ export default {
     props: {
         options: Array,
         rows: Number,
-        disabled: Boolean
+        disabled: Boolean,
+        templates: null
     },
     methods: {
         onChange(value) {
diff --git a/components/lib/passthrough/tailwind/index.js b/components/lib/passthrough/tailwind/index.js
index 29c2ebb51c9..5566631cb5d 100644
--- a/components/lib/passthrough/tailwind/index.js
+++ b/components/lib/passthrough/tailwind/index.js
@@ -3966,7 +3966,7 @@ export default {
         bodyrow: ({ context }) => ({
             class: [
                 context.selected ? 'bg-blue-50 text-blue-700 dark:bg-blue-300' : 'bg-white text-gray-600 dark:bg-gray-900',
-                context.stripedRows ? (context.index % 2 === 0 ? 'bg-white text-gray-600 dark:bg-gray-900' : 'bg-blue-50/50 text-gray-600 dark:bg-gray-950') : '',
+                context.stripedRows ? (context.index % 2 === 0 ? 'bg-white text-gray-600 dark:bg-gray-900' : 'bg-blue-100/50 text-gray-600 dark:bg-gray-950') : '',
                 'transition duration-200',
                 'focus:outline focus:outline-[0.15rem] focus:outline-blue-200 focus:outline-offset-[-0.15rem]', // Focus
                 'dark:text-white/80 dark:focus:outline dark:focus:outline-[0.15rem] dark:focus:outline-blue-300 dark:focus:outline-offset-[-0.15rem]', // Dark Mode
diff --git a/components/lib/picklist/PickList.vue b/components/lib/picklist/PickList.vue
index d44834f48ed..8efebd2e2d5 100755
--- a/components/lib/picklist/PickList.vue
+++ b/components/lib/picklist/PickList.vue
@@ -5,28 +5,28 @@
             <PLButton :aria-label="moveUpAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveUp($event, 0)" :pt="ptm('sourceMoveUpButton')" v-bind="moveUpButtonProps" :unstyled="unstyled">
                 <template #icon>
                     <slot name="moveupicon">
-                        <AngleUpIcon v-bind="ptm('sourceMoveUpButton')['icon']" />
+                        <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">
                 <template #icon>
                     <slot name="movetopicon">
-                        <AngleDoubleUpIcon v-bind="ptm('sourceMoveTopButton')['icon']" />
+                        <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">
                 <template #icon>
                     <slot name="movedownicon">
-                        <AngleDownIcon v-bind="ptm('sourceMoveDownButton')['icon']" />
+                        <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">
                 <template #icon>
                     <slot name="movebottomicon">
-                        <AngleDoubleDownIcon v-bind="ptm('sourceMoveBottomButton')['icon']" />
+                        <AngleDoubleDownIcon v-bind="ptm('sourceMoveBottomButton')['icon']" data-pc-section="movebottomicon" />
                     </slot>
                 </template>
             </PLButton>
@@ -78,28 +78,28 @@
             <PLButton :aria-label="moveToTargetAriaLabel" type="button" @click="moveToTarget" :disabled="moveDisabled(0)" :pt="ptm('moveToTargetButton')" v-bind="moveToTargetProps" :unstyled="unstyled">
                 <template #icon>
                     <slot name="movetotargeticon" :viewChanged="viewChanged">
-                        <component :is="viewChanged ? 'AngleDownIcon' : 'AngleRightIcon'" v-bind="ptm('moveToTargetButton')['icon']" />
+                        <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">
                 <template #icon>
                     <slot name="movealltotargeticon" :viewChanged="viewChanged">
-                        <component :is="viewChanged ? 'AngleDoubleDownIcon' : 'AngleDoubleRightIcon'" v-bind="ptm('moveAllToTargetButton')['icon']" />
+                        <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">
                 <template #icon>
                     <slot name="movetosourceicon" :viewChanged="viewChanged">
-                        <component :is="viewChanged ? 'AngleUpIcon' : 'AngleLeftIcon'" v-bind="ptm('moveToSourceButton')['icon']" />
+                        <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="moveSourceDisabled('targetList')" :pt="ptm('moveAllToSourceButton')" v-bind="moveAllToSourceProps" :unstyled="unstyled">
                 <template #icon>
                     <slot name="movealltosourceicon" :viewChanged="viewChanged">
-                        <component :is="viewChanged ? 'AngleDoubleUpIcon' : 'AngleDoubleLeftIcon'" v-bind="ptm('moveAllToSourceButton')['icon']" />
+                        <component :is="viewChanged ? 'AngleDoubleUpIcon' : 'AngleDoubleLeftIcon'" v-bind="ptm('moveAllToSourceButton')['icon']" data-pc-section="movealltosourceicon" />
                     </slot>
                 </template>
             </PLButton>
@@ -152,28 +152,28 @@
             <PLButton :aria-label="moveUpAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveUp($event, 1)" :pt="ptm('targetMoveUpButton')" v-bind="moveUpButtonProps" :unstyled="unstyled">
                 <template #icon>
                     <slot name="moveupicon">
-                        <AngleUpIcon v-bind="ptm('targetMoveUpButton')['icon']" />
+                        <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">
                 <template #icon>
                     <slot name="movetopicon">
-                        <AngleDoubleUpIcon v-bind="ptm('targetMoveTopButton')['icon']" />
+                        <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">
                 <template #icon>
                     <slot name="movedownicon">
-                        <AngleDownIcon v-bind="ptm('targetMoveDownButton')['icon']" />
+                        <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">
                 <template #icon>
                     <slot name="movebottomicon">
-                        <AngleDoubleDownIcon v-bind="ptm('targetMoveBottomButton')['icon']" />
+                        <AngleDoubleDownIcon v-bind="ptm('targetMoveBottomButton')['icon']" data-pc-section="movebottomicon" />
                     </slot>
                 </template>
             </PLButton>
diff --git a/components/lib/speeddial/SpeedDial.vue b/components/lib/speeddial/SpeedDial.vue
index 2de51aad563..f9b13ae5d7f 100644
--- a/components/lib/speeddial/SpeedDial.vue
+++ b/components/lib/speeddial/SpeedDial.vue
@@ -17,8 +17,8 @@
             >
                 <template #icon>
                     <slot name="icon" :visible="d_visible">
-                        <component v-if="d_visible && !!hideIcon" :is="hideIcon ? 'span' : 'PlusIcon'" :class="cx('buttonIcon')" v-bind="ptm('button')['icon']" />
-                        <component v-else :is="showIcon ? 'span' : 'PlusIcon'" :class="d_visible && !!hideIcon ? hideIcon : showIcon" v-bind="ptm('button')['icon']" />
+                        <component v-if="d_visible && !!hideIcon" :is="hideIcon ? 'span' : 'PlusIcon'" :class="cx('buttonIcon')" v-bind="ptm('button')['icon']" data-pc-section="icon" />
+                        <component v-else :is="showIcon ? 'span' : 'PlusIcon'" :class="d_visible && !!hideIcon ? hideIcon : showIcon" v-bind="ptm('button')['icon']" data-pc-section="icon" />
                     </slot>
                 </template>
             </SDButton>
diff --git a/components/lib/treetable/BodyCell.vue b/components/lib/treetable/BodyCell.vue
index f96fe564c33..9571898f81c 100644
--- a/components/lib/treetable/BodyCell.vue
+++ b/components/lib/treetable/BodyCell.vue
@@ -1,7 +1,7 @@
 <template>
     <td :style="containerStyle" :class="containerClass" role="cell" v-bind="{ ...getColumnPT('root'), ...getColumnPT('bodyCell') }">
         <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="templates['togglericon']" :is="templates['togglericon']" :node="node" :expanded="expanded" :class="cx('rowTogglerIcon')" />
+            <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')" />
         </button>
diff --git a/components/lib/treetable/TreeTable.d.ts b/components/lib/treetable/TreeTable.d.ts
index 028e0749811..247156af7f6 100755
--- a/components/lib/treetable/TreeTable.d.ts
+++ b/components/lib/treetable/TreeTable.d.ts
@@ -642,19 +642,63 @@ export interface TreeTableSlots {
     /**
      * Custom paginator first page link icon template.
      */
-    paginatorfirstpagelinkicon(): VNode[];
+    paginatorfirstpagelinkicon(scope: {
+        /**
+         * Style class of the paginator first page link icon.
+         * @param {Object} scope - paginatorfirstpagelinkicon's params.
+         */
+        class: string;
+    }): VNode[];
     /**
      * Custom paginator previous page link icon template.
      */
-    paginatorprevpagelinkicon(): VNode[];
+    paginatorprevpagelinkicon(scope: {
+        /**
+         * Style class of the paginator prev page link icon.
+         * @param {Object} scope - paginatorprevpagelinkicon's params.
+         */
+        class: string;
+    }): VNode[];
     /**
      * Custom paginator next page link icon template.
      */
-    paginatornextpagelinkicon(): VNode[];
+    paginatornextpagelinkicon(scope: {
+        /**
+         * Style class of the paginator next page link icon.
+         * @param {Object} scope - paginatornextpagelinkicon's params.
+         */
+        class: string;
+    }): VNode[];
     /**
      * Custom paginator last page link icon template.
      */
-    paginatorlastpagelinkicon(): VNode[];
+    paginatorlastpagelinkicon(scope: {
+        /**
+         * Style class of the paginator last page link icon.
+         * @param {Object} scope - paginatorlastpagelinkicon's params.
+         */
+        class: string;
+    }): VNode[];
+    /**
+     * Custom paginatorrowsperpagedropdownicon template.
+     * @param {Object} scope - paginatorrowsperpagedropdownicon's params.
+     */
+    paginatorrowsperpagedropdownicon(scope: {
+        /**
+         * Style class of the paginator rows per page dropdown icon.
+         */
+        class: string;
+    }): VNode[];
+    /**
+     * Custom paginatorjumptopagedropdownicon template.
+     * @param {Object} scope - paginatorjumptopagedropdownicon's params.
+     */
+    paginatorjumptopagedropdownicon(scope: {
+        /**
+         * Style class of the paginator jump to page dropdown icon.
+         */
+        class: string;
+    }): VNode[];
 }
 
 /**
diff --git a/components/lib/treetable/TreeTable.vue b/components/lib/treetable/TreeTable.vue
index 53caa185f90..ca0dda4484b 100755
--- a/components/lib/treetable/TreeTable.vue
+++ b/components/lib/treetable/TreeTable.vue
@@ -32,17 +32,23 @@
             <template v-if="$slots.paginatorend" #end>
                 <slot name="paginatorend"></slot>
             </template>
-            <template v-if="$slots.paginatorfirstpagelinkicon" #firstpagelinkicon>
-                <slot name="paginatorfirstpagelinkicon"></slot>
+            <template v-if="$slots.paginatorfirstpagelinkicon" #firstpagelinkicon="slotProps">
+                <slot name="paginatorfirstpagelinkicon" :class="slotProps.class"></slot>
             </template>
-            <template v-if="$slots.paginatorprevpagelinkicon" #prevpagelinkicon>
-                <slot name="paginatorprevpagelinkicon"></slot>
+            <template v-if="$slots.paginatorprevpagelinkicon" #prevpagelinkicon="slotProps">
+                <slot name="paginatorprevpagelinkicon" :class="slotProps.class"></slot>
             </template>
-            <template v-if="$slots.paginatornextpagelinkicon" #nextpagelinkicon>
-                <slot name="paginatornextpagelinkicon"></slot>
+            <template v-if="$slots.paginatornextpagelinkicon" #nextpagelinkicon="slotProps">
+                <slot name="paginatornextpagelinkicon" :class="slotProps.class"></slot>
             </template>
-            <template v-if="$slots.paginatorlastpagelinkicon" #lastpagelinkicon>
-                <slot name="paginatorlastpagelinkicon"></slot>
+            <template v-if="$slots.paginatorlastpagelinkicon" #lastpagelinkicon="slotProps">
+                <slot name="paginatorlastpagelinkicon" :class="slotProps.class"></slot>
+            </template>
+            <template v-if="$slots.paginatorjumptopagedropdownicon" #jumptopagedropdownicon="slotProps">
+                <slot name="paginatorjumptopagedropdownicon" :class="slotProps.class"></slot>
+            </template>
+            <template v-if="$slots.paginatorrowsperpagedropdownicon" #rowsperpagedropdownicon="slotProps">
+                <slot name="paginatorrowsperpagedropdownicon" :class="slotProps.class"></slot>
             </template>
         </TTPaginator>
         <div :class="cx('wrapper')" :style="{ maxHeight: scrollHeight }" v-bind="ptm('wrapper')">
@@ -132,17 +138,23 @@
             <template v-if="$slots.paginatorend" #end>
                 <slot name="paginatorend"></slot>
             </template>
-            <template v-if="$slots.paginatorfirstpagelinkicon" #firstpagelinkicon>
-                <slot name="paginatorfirstpagelinkicon"></slot>
+            <template v-if="$slots.paginatorfirstpagelinkicon" #firstpagelinkicon="slotProps">
+                <slot name="paginatorfirstpagelinkicon" :class="slotProps.class"></slot>
+            </template>
+            <template v-if="$slots.paginatorprevpagelinkicon" #prevpagelinkicon="slotProps">
+                <slot name="paginatorprevpagelinkicon" :class="slotProps.class"></slot>
+            </template>
+            <template v-if="$slots.paginatornextpagelinkicon" #nextpagelinkicon="slotProps">
+                <slot name="paginatornextpagelinkicon" :class="slotProps.class"></slot>
             </template>
-            <template v-if="$slots.paginatorprevpagelinkicon" #prevpagelinkicon>
-                <slot name="paginatorprevpagelinkicon"></slot>
+            <template v-if="$slots.paginatorlastpagelinkicon" #lastpagelinkicon="slotProps">
+                <slot name="paginatorlastpagelinkicon" :class="slotProps.class"></slot>
             </template>
-            <template v-if="$slots.paginatornextpagelinkicon" #nextpagelinkicon>
-                <slot name="paginatornextpagelinkicon"></slot>
+            <template v-if="$slots.paginatorjumptopagedropdownicon" #jumptopagedropdownicon="slotProps">
+                <slot name="paginatorjumptopagedropdownicon" :class="slotProps.class"></slot>
             </template>
-            <template v-if="$slots.paginatorlastpagelinkicon" #lastpagelinkicon>
-                <slot name="paginatorlastpagelinkicon"></slot>
+            <template v-if="$slots.paginatorrowsperpagedropdownicon" #rowsperpagedropdownicon="slotProps">
+                <slot name="paginatorrowsperpagedropdownicon" :class="slotProps.class"></slot>
             </template>
         </TTPaginator>
         <div v-if="$slots.footer" :class="cx('footer')" v-bind="ptm('footer')">
diff --git a/doc/common/apidoc/index.json b/doc/common/apidoc/index.json
index 451fd676412..72a18fe6917 100644
--- a/doc/common/apidoc/index.json
+++ b/doc/common/apidoc/index.json
@@ -7088,7 +7088,14 @@
                         },
                         {
                             "name": "dropdownicon",
-                            "parameters": [],
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: any, // Style class of the dropdown icon\n }",
+                                    "description": "dropdown icon slot's params."
+                                }
+                            ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom dropdown icon template."
                         },
@@ -7098,7 +7105,7 @@
                                 {
                                     "name": "scope",
                                     "optional": false,
-                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: any, // Style class of the dropdown icon\n }",
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: any, // Style class of the previous icon\n }",
                                     "description": "previous icon slot's params."
                                 }
                             ],
@@ -7111,7 +7118,7 @@
                                 {
                                     "name": "scope",
                                     "optional": false,
-                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: any, // Style class of the dropdown icon\n }",
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: any, // Style class of the next icon\n }",
                                     "description": "next icon slot's params."
                                 }
                             ],
@@ -7124,7 +7131,7 @@
                                 {
                                     "name": "scope",
                                     "optional": false,
-                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: any, // Style class of the dropdown icon\n }",
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: any, // Style class of the increment icon\n }",
                                     "description": "increment icon slot's params."
                                 }
                             ],
@@ -7137,7 +7144,7 @@
                                 {
                                     "name": "scope",
                                     "optional": false,
-                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: any, // Style class of the dropdown icon\n }",
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: any, // Style class of the decrement icon\n }",
                                     "description": "decrement icon slot's params."
                                 }
                             ],
@@ -12108,7 +12115,7 @@
                                 {
                                     "name": "scope",
                                     "optional": false,
-                                    "type": "{\n  \t <span class=\"font-medium\">rowExpanded</span>: boolean, // Current row expanded state.\n }",
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: string, // Style class of the row toggler icon.\n  \t <span class=\"font-medium\">rowExpanded</span>: boolean, // Current row expanded state.\n }",
                                     "description": "row toggler icon slot's params."
                                 }
                             ],
@@ -13904,6 +13911,13 @@
                             "type": "number",
                             "default": ""
                         },
+                        {
+                            "name": "showMonthAfterYear",
+                            "optional": true,
+                            "readonly": false,
+                            "type": "boolean",
+                            "default": ""
+                        },
                         {
                             "name": "dateFormat",
                             "optional": true,
@@ -17726,27 +17740,77 @@
                         },
                         {
                             "name": "paginatorfirstpagelinkicon",
-                            "parameters": [],
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: string, // Style class of the paginator first page link icon.\n }"
+                                }
+                            ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom paginator first page link icon template."
                         },
                         {
                             "name": "paginatorprevpagelinkicon",
-                            "parameters": [],
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: string, // Style class of the paginator prev page link icon.\n }"
+                                }
+                            ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom paginator previous page link icon template."
                         },
                         {
                             "name": "paginatornextpagelinkicon",
-                            "parameters": [],
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: string, // Style class of the paginator next page link icon.\n }"
+                                }
+                            ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom paginator next page link icon template."
                         },
                         {
                             "name": "paginatorlastpagelinkicon",
-                            "parameters": [],
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: string, // Style class of the paginator last page link icon.\n }"
+                                }
+                            ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom paginator last page link icon template."
+                        },
+                        {
+                            "name": "paginatorrowsperpagedropdownicon",
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: string, // Style class of the paginator rows per page dropdown icon.\n }",
+                                    "description": "paginatorrowsperpagedropdownicon's params."
+                                }
+                            ],
+                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
+                            "description": "Custom paginatorrowsperpagedropdownicon template."
+                        },
+                        {
+                            "name": "paginatorjumptopagedropdownicon",
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: string, // Style class of the paginator jump to page dropdown icon.\n }",
+                                    "description": "paginatorjumptopagedropdownicon's params."
+                                }
+                            ],
+                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
+                            "description": "Custom paginatorjumptopagedropdownicon template."
                         }
                     ]
                 },
@@ -33437,6 +33501,32 @@
                             "parameters": [],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom last page link icon template."
+                        },
+                        {
+                            "name": "rowsperpagedropdownicon",
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: string, // Style class of the rowsperpagedropdown icon.\n }",
+                                    "description": "rowsperpagedropdownicon's params."
+                                }
+                            ],
+                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
+                            "description": "Custom rowsperpagedropdownicon template."
+                        },
+                        {
+                            "name": "jumptopagedropdownicon",
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: string, // Style class of the jumptopagedropdown icon.\n }",
+                                    "description": "jumptopagedropdownicon's params."
+                                }
+                            ],
+                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
+                            "description": "Custom jumptopagedropdownicon template."
                         }
                     ]
                 },
@@ -47774,27 +47864,77 @@
                         },
                         {
                             "name": "paginatorfirstpagelinkicon",
-                            "parameters": [],
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: string, // Style class of the paginator first page link icon.\n }"
+                                }
+                            ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom paginator first page link icon template."
                         },
                         {
                             "name": "paginatorprevpagelinkicon",
-                            "parameters": [],
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: string, // Style class of the paginator prev page link icon.\n }"
+                                }
+                            ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom paginator previous page link icon template."
                         },
                         {
                             "name": "paginatornextpagelinkicon",
-                            "parameters": [],
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: string, // Style class of the paginator next page link icon.\n }"
+                                }
+                            ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom paginator next page link icon template."
                         },
                         {
                             "name": "paginatorlastpagelinkicon",
-                            "parameters": [],
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: string, // Style class of the paginator last page link icon.\n }"
+                                }
+                            ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom paginator last page link icon template."
+                        },
+                        {
+                            "name": "paginatorrowsperpagedropdownicon",
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: string, // Style class of the paginator rows per page dropdown icon.\n }",
+                                    "description": "paginatorrowsperpagedropdownicon's params."
+                                }
+                            ],
+                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
+                            "description": "Custom paginatorrowsperpagedropdownicon template."
+                        },
+                        {
+                            "name": "paginatorjumptopagedropdownicon",
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <span class=\"font-medium\">class</span>: string, // Style class of the paginator jump to page dropdown icon.\n }",
+                                    "description": "paginatorjumptopagedropdownicon's params."
+                                }
+                            ],
+                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
+                            "description": "Custom paginatorjumptopagedropdownicon template."
                         }
                     ]
                 },
diff --git a/doc/configuration/locale/LocaleApiDoc.vue b/doc/configuration/locale/LocaleApiDoc.vue
index d18ecec756b..414d25878e1 100644
--- a/doc/configuration/locale/LocaleApiDoc.vue
+++ b/doc/configuration/locale/LocaleApiDoc.vue
@@ -228,6 +228,10 @@
                         <td>firstDayOfWeek</td>
                         <td>0</td>
                     </tr>
+                    <tr>
+                        <td>showMonthAfterYear</td>
+                        <td>false</td>
+                    </tr>
                     <tr>
                         <td>dateFormat</td>
                         <td>mm/dd/yy</td>
diff --git a/doc/confirmdialog/BasicDoc.vue b/doc/confirmdialog/BasicDoc.vue
index 7515b5f80ee..334df0f9701 100644
--- a/doc/confirmdialog/BasicDoc.vue
+++ b/doc/confirmdialog/BasicDoc.vue
@@ -15,7 +15,7 @@ export default {
     data() {
         return {
             code: {
-                basic: `<ConfirmDialog></ConfirmDialog>>
+                basic: `<ConfirmDialog></ConfirmDialog>
 <Button @click="confirm1()" icon="pi pi-check" label="Confirm"></Button>
 <Button @click="confirm2()" icon="pi pi-times" label="Delete"></Button>`,
                 options: `<template>
diff --git a/doc/datatable/colresize/ExpandModeDoc.vue b/doc/datatable/colresize/ExpandModeDoc.vue
index 1356fd05624..e1f61531486 100644
--- a/doc/datatable/colresize/ExpandModeDoc.vue
+++ b/doc/datatable/colresize/ExpandModeDoc.vue
@@ -68,7 +68,7 @@ import { ref, onMounted } from 'vue';
 import { ProductService } from '@/service/ProductService';
 
 onMounted(() => {
-    productService.value.getProductsMini().then(data => products.value = data);
+    ProductService.getProductsMini().then(data => products.value = data);
 });
 
 const products = ref();
diff --git a/doc/datatable/colresize/FitModeDoc.vue b/doc/datatable/colresize/FitModeDoc.vue
index 85e090e163c..0e3af94c956 100644
--- a/doc/datatable/colresize/FitModeDoc.vue
+++ b/doc/datatable/colresize/FitModeDoc.vue
@@ -71,7 +71,7 @@ import { ref, onMounted } from 'vue';
 import { ProductService } from '@/service/ProductService';
 
 onMounted(() => {
-    productService.value.getProductsMini().then(data => products.value = data);
+    ProductService.getProductsMini().then(data => products.value = data);
 });
 
 const products = ref();
diff --git a/package-build.json b/package-build.json
index eeca3d6ed94..a15ee31bda8 100644
--- a/package-build.json
+++ b/package-build.json
@@ -1,6 +1,6 @@
 {
     "name": "primevue",
-    "version": "3.34.0",
+    "version": "3.34.1-SNAPSHOT",
     "homepage": "https://primevue.org/",
     "repository": {
         "type": "git",
diff --git a/package-lock.json b/package-lock.json
index edcb42ee027..839cc989a8d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
     "name": "primevue",
-    "version": "3.34.0",
+    "version": "3.34.1-SNAPSHOT",
     "lockfileVersion": 2,
     "requires": true,
     "packages": {
         "": {
             "name": "primevue",
-            "version": "3.34.0",
+            "version": "3.34.1-SNAPSHOT",
             "hasInstallScript": true,
             "license": "MIT",
             "dependencies": {
diff --git a/package.json b/package.json
index fe49cdd52d4..f5603c242f1 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "primevue",
-    "version": "3.34.0",
+    "version": "3.34.1-SNAPSHOT",
     "homepage": "https://primevue.org/",
     "repository": {
         "type": "git",