From f93e2be93dc78da3de0bb0f40a60721733b3c1de Mon Sep 17 00:00:00 2001
From: mertsincan <sincan.mert@gmail.com>
Date: Tue, 18 Apr 2023 13:50:13 +0300
Subject: [PATCH 1/4] Refactor #3832 Refactor #3833 - Update icons

---
 components/lib/megamenu/MegaMenuSub.vue               | 11 ++++++++---
 components/lib/menu/Menuitem.vue                      |  6 ++++--
 components/lib/menubar/Menubar.d.ts                   |  4 ++--
 components/lib/menubar/Menubar.vue                    |  4 ++--
 components/lib/menubar/MenubarSub.vue                 | 11 ++++++++---
 .../lib/organizationchart/OrganizationChartNode.vue   |  3 ++-
 components/lib/panelmenu/PanelMenu.vue                |  6 ++++--
 components/lib/panelmenu/PanelMenuSub.vue             | 11 ++++++++---
 components/lib/speeddial/SpeedDial.vue                |  6 ++++--
 components/lib/splitbutton/SplitButton.vue            |  8 +++++++-
 components/lib/tabmenu/TabMenu.vue                    |  6 ++++--
 components/lib/tag/Tag.vue                            |  3 ++-
 components/lib/tieredmenu/TieredMenuSub.vue           | 11 ++++++++---
 components/lib/togglebutton/ToggleButton.vue          |  6 ++++--
 components/lib/tree/Tree.vue                          |  3 ++-
 components/lib/tree/TreeNode.vue                      |  7 +++++--
 components/lib/treetable/BodyCell.vue                 |  7 +++++--
 17 files changed, 79 insertions(+), 34 deletions(-)

diff --git a/components/lib/megamenu/MegaMenuSub.vue b/components/lib/megamenu/MegaMenuSub.vue
index 2c7fbc615..143b0a571 100644
--- a/components/lib/megamenu/MegaMenuSub.vue
+++ b/components/lib/megamenu/MegaMenuSub.vue
@@ -20,14 +20,19 @@
                     <template v-if="!templates.item">
                         <router-link v-if="getItemProp(processedItem, 'to') && !isItemDisabled(processedItem)" v-slot="{ navigate, href, isActive, isExactActive }" :to="getItemProp(processedItem, 'to')" custom>
                             <a v-ripple :href="href" :class="getItemActionClass(processedItem, { isActive, isExactActive })" tabindex="-1" aria-hidden="true" @click="onItemActionClick($event, navigate)">
-                                <component :is="templates.itemicon || (getItemProp(processedItem, 'icon') ? 'span' : undefined)" :item="processedItem.item" :class="getItemIconClass(processedItem)" />
+                                <component v-if="templates.itemicon" :is="templates.itemicon" :item="processedItem.item" :class="getItemIconClass(processedItem)" />
+                                <span v-else-if="getItemProp(processedItem, 'icon')" :class="getItemIconClass(processedItem)" />
                                 <span class="p-menuitem-text">{{ getItemLabel(processedItem) }}</span>
                             </a>
                         </router-link>
                         <a v-else v-ripple :href="getItemProp(processedItem, 'url')" :class="getItemActionClass(processedItem)" :target="getItemProp(processedItem, 'target')" tabindex="-1" aria-hidden="true">
-                            <component :is="templates.itemicon || (getItemProp(processedItem, 'icon') ? 'span' : undefined)" :item="processedItem.item" :class="getItemIconClass(processedItem)" />
+                            <component v-if="templates.itemicon" :is="templates.itemicon" :item="processedItem.item" :class="getItemIconClass(processedItem)" />
+                            <span v-else-if="getItemProp(processedItem, 'icon')" :class="getItemIconClass(processedItem)" />
                             <span class="p-menuitem-text">{{ getItemLabel(processedItem) }}</span>
-                            <component v-if="isItemGroup(processedItem)" :is="templates.submenuicon || (horizontal ? 'AngleDownIcon' : 'AngleRightIcon')" :active="isItemActive(processedItem)" class="p-submenu-icon" />
+                            <template v-if="isItemGroup(processedItem)">
+                                <component v-if="templates.submenuicon" :is="templates.submenuicon" :active="isItemActive(processedItem)" class="p-submenu-icon" />
+                                <component v-else :is="horizontal ? 'AngleDownIcon' : 'AngleRightIcon'" class="p-submenu-icon" />
+                            </template>
                         </a>
                     </template>
                     <component v-else :is="templates.item" :item="processedItem.item"></component>
diff --git a/components/lib/menu/Menuitem.vue b/components/lib/menu/Menuitem.vue
index 6ab38c739..b6f3cbac9 100644
--- a/components/lib/menu/Menuitem.vue
+++ b/components/lib/menu/Menuitem.vue
@@ -4,12 +4,14 @@
             <template v-if="!templates.item">
                 <router-link v-if="item.to && !disabled()" v-slot="{ navigate, href, isActive, isExactActive }" :to="item.to" custom>
                     <a v-ripple :href="href" :class="linkClass({ isActive, isExactActive })" tabindex="-1" aria-hidden="true" @click="onItemActionClick($event, navigate)">
-                        <component :is="templates.itemicon || (item.icon ? 'span' : undefined)" :item="item" :class="iconClass" />
+                        <component v-if="templates.itemicon" :is="templates.itemicon" :item="item" :class="iconClass" />
+                        <span v-else-if="item.icon" :class="iconClass" />
                         <span class="p-menuitem-text">{{ label() }}</span>
                     </a>
                 </router-link>
                 <a v-else v-ripple :href="item.url" :class="linkClass()" :target="item.target" tabindex="-1" aria-hidden="true">
-                    <component :is="templates.itemicon || (item.icon ? 'span' : undefined)" :item="item" :class="iconClass" />
+                    <component v-if="templates.itemicon" :is="templates.itemicon" :item="item" :class="iconClass" />
+                    <span v-else-if="item.icon" :class="iconClass" />
                     <span class="p-menuitem-text">{{ label() }}</span>
                 </a>
             </template>
diff --git a/components/lib/menubar/Menubar.d.ts b/components/lib/menubar/Menubar.d.ts
index e2a33e07d..bd1e688c3 100755
--- a/components/lib/menubar/Menubar.d.ts
+++ b/components/lib/menubar/Menubar.d.ts
@@ -61,9 +61,9 @@ export interface MenubarSlots {
         item: MenuItem;
     }): VNode[];
     /**
-     * Custom bar icon template.
+     * Custom popup icon template on responsive mode.
      */
-    baricon(): VNode[];
+    popupicon(): VNode[];
     /**
      * Custom submenu icon template.
      */
diff --git a/components/lib/menubar/Menubar.vue b/components/lib/menubar/Menubar.vue
index d2ac8e8bd..09466c067 100755
--- a/components/lib/menubar/Menubar.vue
+++ b/components/lib/menubar/Menubar.vue
@@ -17,8 +17,8 @@
             @keydown="menuButtonKeydown($event)"
             v-bind="buttonProps"
         >
-            <slot name="baricon">
-                <component :is="'BarsIcon'" />
+            <slot name="popupicon">
+                <BarsIcon />
             </slot>
         </a>
         <MenubarSub
diff --git a/components/lib/menubar/MenubarSub.vue b/components/lib/menubar/MenubarSub.vue
index b2958965f..451e14469 100755
--- a/components/lib/menubar/MenubarSub.vue
+++ b/components/lib/menubar/MenubarSub.vue
@@ -19,14 +19,19 @@
                     <template v-if="!templates.item">
                         <router-link v-if="getItemProp(processedItem, 'to') && !isItemDisabled(processedItem)" v-slot="{ navigate, href, isActive, isExactActive }" :to="getItemProp(processedItem, 'to')" custom>
                             <a v-ripple :href="href" :class="getItemActionClass(processedItem, { isActive, isExactActive })" tabindex="-1" aria-hidden="true" @click="onItemActionClick($event, navigate)">
-                                <component :is="templates.itemicon || (getItemProp(processedItem, 'icon') ? 'span' : undefined)" :item="processedItem.item" :class="getItemIconClass(processedItem)" />
+                                <component v-if="templates.itemicon" :is="templates.itemicon" :item="processedItem.item" :class="getItemIconClass(processedItem)" />
+                                <span v-else-if="getItemProp(processedItem, 'icon')" :class="getItemIconClass(processedItem)" />
                                 <span class="p-menuitem-text">{{ getItemLabel(processedItem) }}</span>
                             </a>
                         </router-link>
                         <a v-else v-ripple :href="getItemProp(processedItem, 'url')" :class="getItemActionClass(processedItem)" :target="getItemProp(processedItem, 'target')" tabindex="-1" aria-hidden="true">
-                            <component :is="templates.itemicon || (getItemProp(processedItem, 'icon') ? 'span' : undefined)" :item="processedItem.item" :class="getItemIconClass(processedItem)" />
+                            <component v-if="templates.itemicon" :is="templates.itemicon" :item="processedItem.item" :class="getItemIconClass(processedItem)" />
+                            <span v-else-if="getItemProp(processedItem, 'icon')" :class="getItemIconClass(processedItem)" />
                             <span class="p-menuitem-text">{{ getItemLabel(processedItem) }}</span>
-                            <component v-if="getItemProp(processedItem, 'items')" :is="templates.submenuicon || (root ? 'AngleDownIcon' : 'AngleRightIcon')" :root="root" :active="isItemActive(processedItem)" class="p-submenu-icon" />
+                            <template v-if="getItemProp(processedItem, 'items')">
+                                <component v-if="templates.submenuicon" :is="templates.submenuicon" :root="root" :active="isItemActive(processedItem)" class="p-submenu-icon" />
+                                <component v-else :is="root ? 'AngleDownIcon' : 'AngleRightIcon'" class="p-submenu-icon" />
+                            </template>
                         </a>
                     </template>
                     <component v-else :is="templates.item" :item="processedItem.item"></component>
diff --git a/components/lib/organizationchart/OrganizationChartNode.vue b/components/lib/organizationchart/OrganizationChartNode.vue
index 0cc1b7fac..b7b1ef0ff 100755
--- a/components/lib/organizationchart/OrganizationChartNode.vue
+++ b/components/lib/organizationchart/OrganizationChartNode.vue
@@ -6,7 +6,8 @@
                     <div :class="nodeContentClass" @click="onNodeClick">
                         <component :is="templates[node.type] || templates['default']" :node="node" />
                         <a v-if="toggleable" tabindex="0" class="p-node-toggler" @click="toggleNode" @keydown="onKeydown">
-                            <component :is="templates.togglericon || (expanded ? 'ChevronDownIcon' : 'ChevronUpIcon')" :expanded="expanded" class="p-node-toggler-icon" />
+                            <component v-if="templates.togglericon" :is="templates.togglericon" :expanded="expanded" class="p-node-toggler-icon" />
+                            <component v-else :is="expanded ? 'ChevronDownIcon' : 'ChevronUpIcon'" class="p-node-toggler-icon" />
                         </a>
                     </div>
                 </td>
diff --git a/components/lib/panelmenu/PanelMenu.vue b/components/lib/panelmenu/PanelMenu.vue
index 547c9ea5a..615fb8ee9 100644
--- a/components/lib/panelmenu/PanelMenu.vue
+++ b/components/lib/panelmenu/PanelMenu.vue
@@ -18,7 +18,8 @@
                         <template v-if="!$slots.item">
                             <router-link v-if="getItemProp(item, 'to') && !isItemDisabled(item)" v-slot="{ navigate, href, isActive, isExactActive }" :to="getItemProp(item, 'to')" custom>
                                 <a :href="href" :class="getHeaderActionClass(item, { isActive, isExactActive })" :tabindex="-1" @click="onHeaderActionClick($event, navigate)">
-                                    <component :is="$slots.headericon || (getItemProp(item, 'icon') ? 'span' : undefined)" :item="item" :class="getHeaderIconClass(item)" />
+                                    <component v-if="$slots.headericon" :is="$slots.headericon" :item="item" :class="getHeaderIconClass(item)" />
+                                    <span v-else-if="getItemProp(item, 'icon')" :class="getHeaderIconClass(item)" />
                                     <span class="p-menuitem-text">{{ getItemLabel(item) }}</span>
                                 </a>
                             </router-link>
@@ -26,7 +27,8 @@
                                 <slot v-if="getItemProp(item, 'items')" name="submenuicon" :active="isItemActive(item)">
                                     <component :is="isItemActive(item) ? 'ChevronDownIcon' : 'ChevronRightIcon'" class="p-submenu-icon" />
                                 </slot>
-                                <component :is="$slots.headericon || (getItemProp(item, 'icon') ? 'span' : undefined)" :item="item" :class="getHeaderIconClass(item)" />
+                                <component v-if="$slots.headericon" :is="$slots.headericon" :item="item" :class="getHeaderIconClass(item)" />
+                                <span v-else-if="getItemProp(item, 'icon')" :class="getHeaderIconClass(item)" />
                                 <span class="p-menuitem-text">{{ getItemLabel(item) }}</span>
                             </a>
                         </template>
diff --git a/components/lib/panelmenu/PanelMenuSub.vue b/components/lib/panelmenu/PanelMenuSub.vue
index 277110132..3c84b2bbc 100755
--- a/components/lib/panelmenu/PanelMenuSub.vue
+++ b/components/lib/panelmenu/PanelMenuSub.vue
@@ -17,13 +17,18 @@
                     <template v-if="!templates.item">
                         <router-link v-if="getItemProp(processedItem, 'to') && !isItemDisabled(processedItem)" v-slot="{ navigate, href, isActive, isExactActive }" :to="getItemProp(processedItem, 'to')" custom>
                             <a v-ripple :href="href" :class="getItemActionClass(processedItem, { isActive, isExactActive })" tabindex="-1" aria-hidden="true" @click="onItemActionClick($event, navigate)">
-                                <component :is="templates.itemicon || (getItemProp(processedItem, 'icon') ? 'span' : undefined)" :item="processedItem.item" :class="getItemIconClass(processedItem)" />
+                                <component v-if="templates.itemicon" :is="templates.itemicon" :item="processedItem.item" :class="getItemIconClass(processedItem)" />
+                                <span v-else-if="getItemProp(processedItem, 'icon')" :class="getItemIconClass(processedItem)" />
                                 <span class="p-menuitem-text">{{ getItemLabel(processedItem) }}</span>
                             </a>
                         </router-link>
                         <a v-else v-ripple :href="getItemProp(processedItem, 'url')" :class="getItemActionClass(processedItem)" :target="getItemProp(processedItem, 'target')" tabindex="-1" aria-hidden="true">
-                            <component v-if="isItemGroup(processedItem)" :is="templates.submenuicon || (isItemActive(processedItem) ? 'ChevronDownIcon' : 'ChevronRightIcon')" class="p-submenu-icon" :active="isItemActive(processedItem)" />
-                            <component :is="templates.itemicon || (getItemProp(processedItem, 'icon') ? 'span' : undefined)" :item="processedItem.item" :class="getItemIconClass(processedItem)" />
+                            <template v-if="isItemGroup(processedItem)">
+                                <component v-if="templates.submenuicon" :is="templates.submenuicon" class="p-submenu-icon" :active="isItemActive(processedItem)" />
+                                <component v-else :is="isItemActive(processedItem) ? 'ChevronDownIcon' : 'ChevronRightIcon'" class="p-submenu-icon" />
+                            </template>
+                            <component v-if="templates.itemicon" :is="templates.itemicon" :item="processedItem.item" :class="getItemIconClass(processedItem)" />
+                            <span v-else-if="getItemProp(processedItem, 'icon')" :class="getItemIconClass(processedItem)" />
                             <span class="p-menuitem-text">{{ getItemLabel(processedItem) }}</span>
                         </a>
                     </template>
diff --git a/components/lib/speeddial/SpeedDial.vue b/components/lib/speeddial/SpeedDial.vue
index a2920299c..8de4d2c1d 100644
--- a/components/lib/speeddial/SpeedDial.vue
+++ b/components/lib/speeddial/SpeedDial.vue
@@ -14,8 +14,10 @@
                 :aria-labelledby="ariaLabelledby"
             >
                 <template #icon>
-                    <component v-if="d_visible && !!hideIcon" :is="hideIcon ? 'span' : 'PlusIcon'" :class="hideIcon" />
-                    <component v-else :is="showIcon ? 'span' : 'PlusIcon'" :class="showIcon" />
+                    <slot name="icon" :visible="d_visible">
+                        <component v-if="d_visible && !!hideIcon" :is="hideIcon ? 'span' : 'PlusIcon'" :class="hideIcon" />
+                        <component v-else :is="showIcon ? 'span' : 'PlusIcon'" :class="showIcon" />
+                    </slot>
                 </template>
             </SDButton>
         </slot>
diff --git a/components/lib/splitbutton/SplitButton.vue b/components/lib/splitbutton/SplitButton.vue
index 0e0a8eae3..e01248055 100755
--- a/components/lib/splitbutton/SplitButton.vue
+++ b/components/lib/splitbutton/SplitButton.vue
@@ -1,7 +1,13 @@
 <template>
     <div :class="containerClass" :style="style">
         <slot>
-            <PVSButton type="button" class="p-splitbutton-defaultbutton" :icon="icon" :label="label" :disabled="disabled" :aria-label="label" @click="onDefaultButtonClick" v-bind="buttonProps" />
+            <PVSButton type="button" class="p-splitbutton-defaultbutton" :label="label" :disabled="disabled" :aria-label="label" @click="onDefaultButtonClick" v-bind="buttonProps">
+                <template #icon>
+                    <slot name="icon">
+                        <span :class="icon" />
+                    </slot>
+                </template>
+            </PVSButton>
         </slot>
         <PVSButton
             ref="button"
diff --git a/components/lib/tabmenu/TabMenu.vue b/components/lib/tabmenu/TabMenu.vue
index 8e7945b7c..3d43ab68a 100755
--- a/components/lib/tabmenu/TabMenu.vue
+++ b/components/lib/tabmenu/TabMenu.vue
@@ -17,7 +17,8 @@
                                 @click="onItemClick($event, item, i, navigate)"
                                 @keydown="onKeydownItem($event, item, i, navigate)"
                             >
-                                <component :is="$slots.itemicon || (item.icon ? 'span' : undefined)" :item="item" :class="getItemIcon(item)" />
+                                <component v-if="$slots.itemicon" :is="$slots.itemicon" :item="item" :class="getItemIcon(item)" />
+                                <span v-else-if="item.icon" :class="getItemIcon(item)" />
                                 <span class="p-menuitem-text">{{ label(item) }}</span>
                             </a>
                         </template>
@@ -27,7 +28,8 @@
                 <li v-else-if="visible(item)" ref="tab" :class="getItemClass(item, i)" role="presentation" @click="onItemClick($event, item, i)" @keydown="onKeydownItem($event, item, i)">
                     <template v-if="!$slots.item">
                         <a ref="tabLink" v-ripple role="menuitem" :href="item.url" class="p-menuitem-link" :target="item.target" :aria-label="label(item)" :aria-disabled="disabled(item)" :tabindex="setTabIndex(i)">
-                            <component :is="$slots.itemicon || (item.icon ? 'span' : undefined)" :item="item" :class="getItemIcon(item)" />
+                            <component v-if="$slots.itemicon" :is="$slots.itemicon" :item="item" :class="getItemIcon(item)" />
+                            <span v-else-if="item.icon" :class="getItemIcon(item)" />
                             <span class="p-menuitem-text">{{ label(item) }}</span>
                         </a>
                     </template>
diff --git a/components/lib/tag/Tag.vue b/components/lib/tag/Tag.vue
index 39304c312..259288a81 100644
--- a/components/lib/tag/Tag.vue
+++ b/components/lib/tag/Tag.vue
@@ -1,6 +1,7 @@
 <template>
     <span :class="containerClass">
-        <span v-if="icon" :class="iconClass"></span>
+        <component v-if="$slots.icon" :is="$slots.icon" class="p-tag-icon" />
+        <span v-else-if="icon" :class="iconClass"></span>
         <slot>
             <span class="p-tag-value">{{ value }}</span>
         </slot>
diff --git a/components/lib/tieredmenu/TieredMenuSub.vue b/components/lib/tieredmenu/TieredMenuSub.vue
index 82cf151c4..8d51ef64a 100755
--- a/components/lib/tieredmenu/TieredMenuSub.vue
+++ b/components/lib/tieredmenu/TieredMenuSub.vue
@@ -19,14 +19,19 @@
                     <template v-if="!templates.item">
                         <router-link v-if="getItemProp(processedItem, 'to') && !isItemDisabled(processedItem)" v-slot="{ navigate, href, isActive, isExactActive }" :to="getItemProp(processedItem, 'to')" custom>
                             <a v-ripple :href="href" :class="getItemActionClass(processedItem, { isActive, isExactActive })" tabindex="-1" aria-hidden="true" @click="onItemActionClick($event, navigate)">
-                                <span v-if="getItemProp(processedItem, 'icon')" :class="getItemIconClass(processedItem)"></span>
+                                <component v-if="templates.itemicon" :is="templates.itemicon" :item="processedItem.item" :class="getItemIconClass(processedItem)" />
+                                <span v-else-if="getItemProp(processedItem, 'icon')" :class="getItemIconClass(processedItem)" />
                                 <span class="p-menuitem-text">{{ getItemLabel(processedItem) }}</span>
                             </a>
                         </router-link>
                         <a v-else v-ripple :href="getItemProp(processedItem, 'url')" :class="getItemActionClass(processedItem)" :target="getItemProp(processedItem, 'target')" tabindex="-1" aria-hidden="true">
-                            <span v-if="getItemProp(processedItem, 'icon')" :class="getItemIconClass(processedItem)"></span>
+                            <component v-if="templates.itemicon" :is="templates.itemicon" :item="processedItem.item" :class="getItemIconClass(processedItem)" />
+                            <span v-else-if="getItemProp(processedItem, 'icon')" :class="getItemIconClass(processedItem)" />
                             <span class="p-menuitem-text">{{ getItemLabel(processedItem) }}</span>
-                            <component v-if="getItemProp(processedItem, 'items')" :is="templates.submenuicon || 'AngleRightIcon'" class="p-submenu-icon" :active="isItemActive(processedItem)" />
+                            <template v-if="getItemProp(processedItem, 'items')">
+                                <component v-if="templates.submenuicon" :is="templates.submenuicon" class="p-submenu-icon" :active="isItemActive(processedItem)" />
+                                <AngleRightIcon v-else class="p-submenu-icon" />
+                            </template>
                         </a>
                     </template>
                     <component v-else :is="templates.item" :item="processedItem.item"></component>
diff --git a/components/lib/togglebutton/ToggleButton.vue b/components/lib/togglebutton/ToggleButton.vue
index 0005908d8..5954950ec 100755
--- a/components/lib/togglebutton/ToggleButton.vue
+++ b/components/lib/togglebutton/ToggleButton.vue
@@ -16,7 +16,9 @@
                 v-bind="inputProps"
             />
         </span>
-        <span v-if="hasIcon" :class="iconClass"></span>
+        <slot name="icon" :value="modelValue" :class="iconClass">
+            <span v-if="onIcon || offIcon" :class="iconClass" />
+        </slot>
         <span class="p-button-label">{{ label }}</span>
     </div>
 </template>
@@ -149,7 +151,7 @@ export default {
             return this.onLabel && this.onLabel.length > 0 && this.offLabel && this.offLabel.length > 0;
         },
         hasIcon() {
-            return this.onIcon && this.onIcon.length > 0 && this.offIcon && this.offIcon.length > 0;
+            return this.$slots.icon || (this.onIcon && this.offIcon);
         },
         label() {
             return this.hasLabel ? (this.modelValue ? this.onLabel : this.offLabel) : '&nbsp;';
diff --git a/components/lib/tree/Tree.vue b/components/lib/tree/Tree.vue
index 74b74823a..5b350a9bb 100755
--- a/components/lib/tree/Tree.vue
+++ b/components/lib/tree/Tree.vue
@@ -3,7 +3,8 @@
         <template v-if="loading">
             <div class="p-tree-loading-overlay p-component-overlay">
                 <slot name="loadingicon">
-                    <component :is="loadingIcon ? 'i' : 'SpinnerIcon'" spin :class="['p-tree-loading-icon', loadingIcon]" />
+                    <i v-if="loadingIcon" :class="['p-tree-loading-icon pi-spin', loadingIcon]" />
+                    <SpinnerIcon v-else spin class="p-tree-loading-icon" />
                 </slot>
             </div>
         </template>
diff --git a/components/lib/tree/TreeNode.vue b/components/lib/tree/TreeNode.vue
index 13b71afb8..cc3cf81fc 100755
--- a/components/lib/tree/TreeNode.vue
+++ b/components/lib/tree/TreeNode.vue
@@ -15,11 +15,14 @@
     >
         <div :class="contentClass" @click="onClick" @touchend="onTouchEnd" :style="node.style">
             <button v-ripple type="button" class="p-tree-toggler p-link" @click="toggle" tabindex="-1" aria-hidden="true">
-                <component :is="templates['togglericon'] ? templates['togglericon'] : expanded ? node.expandedIcon || 'ChevronDownIcon' : node.collapsedIcon || 'ChevronRightIcon'" :node="node" :expanded="expanded" class="p-tree-toggler-icon" />
+                <component v-if="templates['togglericon']" :is="templates['togglericon']" :node="node" :expanded="expanded" class="p-tree-toggler-icon" />
+                <component v-else-if="expanded" :is="node.expandedIcon ? 'span' : 'ChevronDownIcon'" class="p-tree-toggler-icon" />
+                <component v-else :is="node.collapsedIcon ? 'span' : 'ChevronRightIcon'" class="p-tree-toggler-icon" />
             </button>
             <div v-if="checkboxMode" class="p-checkbox p-component" aria-hidden="true">
                 <div :class="checkboxClass" role="checkbox">
-                    <component :is="templates['checkboxicon'] ? templates['checkboxicon'] : checked ? 'CheckIcon' : partialChecked ? 'MinusIcon' : null" :checked="checked" :partialChecked="partialChecked" class="p-checkbox-icon" />
+                    <component v-if="templates['checkboxicon']" :is="templates['checkboxicon']" :checked="checked" :partialChecked="partialChecked" class="p-checkbox-icon" />
+                    <component v-else :is="checked ? 'CheckIcon' : partialChecked ? 'MinusIcon' : null" class="p-checkbox-icon" />
                 </div>
             </div>
             <span :class="icon"></span>
diff --git a/components/lib/treetable/BodyCell.vue b/components/lib/treetable/BodyCell.vue
index 7f14530fd..37292c518 100644
--- a/components/lib/treetable/BodyCell.vue
+++ b/components/lib/treetable/BodyCell.vue
@@ -1,14 +1,17 @@
 <template>
     <td :style="containerStyle" :class="containerClass" role="cell">
         <button v-if="columnProp('expander')" v-ripple type="button" class="p-treetable-toggler p-link" @click="toggle" :style="togglerStyle" tabindex="-1">
-            <component :is="templates['togglericon'] ? templates['togglericon'] : expanded ? 'ChevronDownIcon' : 'ChevronRightIcon'" :expanded="expanded" class="p-treetable-toggler-icon" />
+            <component v-if="templates['togglericon']" :is="templates['togglericon']" :node="node" :expanded="expanded" class="p-tree-toggler-icon" />
+            <component v-else-if="expanded" :is="node.expandedIcon ? 'span' : 'ChevronDownIcon'" class="p-tree-toggler-icon" />
+            <component v-else :is="node.collapsedIcon ? 'span' : 'ChevronRightIcon'" class="p-tree-toggler-icon" />
         </button>
         <div v-if="checkboxSelectionMode && columnProp('expander')" :class="['p-checkbox p-treetable-checkbox p-component', { 'p-checkbox-focused': checkboxFocused }]" @click="toggleCheckbox">
             <div class="p-hidden-accessible">
                 <input type="checkbox" @focus="onCheckboxFocus" @blur="onCheckboxBlur" tabindex="-1" />
             </div>
             <div ref="checkboxEl" :class="checkboxClass">
-                <component :is="templates['checkboxicon'] ? templates['checkboxicon'] : checked ? 'CheckIcon' : partialChecked ? 'MinusIcon' : null" :checked="checked" :partialChecked="partialChecked" class="p-checkbox-icon" />
+                <component v-if="templates['checkboxicon']" :is="templates['checkboxicon']" :checked="checked" :partialChecked="partialChecked" class="p-checkbox-icon" />
+                <component v-else :is="checked ? 'CheckIcon' : partialChecked ? 'MinusIcon' : null" class="p-checkbox-icon" />
             </div>
         </div>
         <component v-if="column.children && column.children.body" :is="column.children.body" :node="node" :column="column" />

From fafa285c6f2bfaf8f5a1cddbe1b3d890eb664e4a Mon Sep 17 00:00:00 2001
From: GitHub Actions Bot <>
Date: Tue, 18 Apr 2023 10:50:54 +0000
Subject: [PATCH 2/4] Update API doc

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

diff --git a/doc/common/apidoc/index.json b/doc/common/apidoc/index.json
index 4a12d4d18..385025920 100644
--- a/doc/common/apidoc/index.json
+++ b/doc/common/apidoc/index.json
@@ -14114,7 +14114,7 @@
                             "description": "Custom close icon template."
                         },
                         {
-                            "name": "previtemicon",
+                            "name": "previousitemicon",
                             "parameters": [],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom navigator previous item icon template."
@@ -14126,7 +14126,7 @@
                             "description": "Custom navigator next item icon template."
                         },
                         {
-                            "name": "prevthumbnailicon",
+                            "name": "previousthumbnailicon",
                             "parameters": [],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom thumbnail previous icon template."
@@ -14438,7 +14438,7 @@
                             "description": "Default custom slot."
                         },
                         {
-                            "name": "messageicon",
+                            "name": "icon",
                             "parameters": [],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom message icon template."
@@ -16551,10 +16551,10 @@
                             "description": "Custom item template."
                         },
                         {
-                            "name": "baricon",
+                            "name": "popupicon",
                             "parameters": [],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
-                            "description": "Custom bar icon template."
+                            "description": "Custom popup icon template on responsive mode."
                         },
                         {
                             "name": "submenuicon",

From cd7ef5231905e09e4d65aa65b51f6f7c0824880f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?=
 <tugcekucukoglu.860@gmail.com>
Date: Tue, 18 Apr 2023 13:51:10 +0300
Subject: [PATCH 3/4] Refactor #3832 Refactor #3833 - icon & .d.ts. updates

---
 components/lib/datatable/BodyCell.vue         |  8 ++-
 components/lib/datatable/HeaderCheckbox.vue   |  3 +-
 components/lib/datatable/TableBody.vue        |  8 ++-
 components/lib/dialog/Dialog.d.ts             |  9 ++-
 components/lib/dropdown/Dropdown.d.ts         | 39 ++++++++++++
 components/lib/fileupload/FileUpload.d.ts     |  6 +-
 components/lib/image/Image.d.ts               |  1 +
 .../lib/inlinemessage/InlineMessage.d.ts      |  2 +-
 components/lib/inplace/Inplace.d.ts           |  5 ++
 components/lib/inputnumber/InputNumber.d.ts   |  2 +
 components/lib/listbox/Listbox.d.ts           |  2 +-
 components/lib/message/Message.d.ts           | 16 ++++-
 components/lib/message/Message.vue            |  7 ++-
 components/lib/multiselect/MultiSelect.d.ts   | 59 ++++++++++++++++++-
 components/lib/multiselect/MultiSelect.vue    | 27 +++++----
 components/lib/overlaypanel/OverlayPanel.d.ts |  1 +
 components/lib/password/Password.d.ts         | 16 ++++-
 components/lib/password/Password.vue          |  4 +-
 components/lib/rating/Rating.d.ts             |  3 +
 components/lib/scrolltop/ScrollTop.d.ts       |  1 +
 components/lib/sidebar/Sidebar.d.ts           |  1 +
 components/lib/speeddial/SpeedDial.d.ts       | 12 ++++
 components/lib/splitbutton/SplitButton.d.ts   |  6 ++
 components/lib/tabview/TabView.d.ts           |  6 +-
 components/lib/tag/Tag.d.ts                   |  5 ++
 components/lib/toast/Toast.d.ts               |  6 ++
 components/lib/togglebutton/ToggleButton.d.ts | 20 ++++++-
 components/lib/tree/Tree.d.ts                 |  1 +
 components/lib/treeselect/TreeSelect.d.ts     |  8 ---
 components/lib/treeselect/TreeSelect.vue      |  6 --
 components/lib/treetable/TreeTable.d.ts       |  1 +
 .../tristatecheckbox/TriStateCheckbox.d.ts    |  1 +
 32 files changed, 239 insertions(+), 53 deletions(-)

diff --git a/components/lib/datatable/BodyCell.vue b/components/lib/datatable/BodyCell.vue
index b2b89e128..4c942dbea 100755
--- a/components/lib/datatable/BodyCell.vue
+++ b/components/lib/datatable/BodyCell.vue
@@ -34,8 +34,12 @@
         <template v-else-if="columnProp('expander')">
             <button v-ripple class="p-row-toggler p-link" type="button" :aria-expanded="isRowExpanded" :aria-controls="ariaControls" :aria-label="expandButtonAriaLabel" @click="toggleRow">
                 <component v-if="column.children && column.children.rowtogglericon" :is="column.children.rowtogglericon" :rowExpanded="isRowExpanded" />
-                <component v-else-if="column.children && !column.children.rowtogglericon && isRowExpanded" :is="expandedRowIcon ? 'span' : 'ChevronDownIcon'" class="p-row-toggler-icon" />
-                <component v-else-if="column.children && !column.children.rowtogglericon && !isRowExpanded" :is="collapsedRowIcon ? 'span' : 'ChevronRightIcon'" class="p-row-toggler-icon" />
+                <template v-else>
+                    <span v-if="isRowExpanded && expandedRowIcon" :class="['p-row-toggler-icon', expandedRowIcon]" />
+                    <ChevronDownIcon v-else-if="isRowExpanded && !expandedRowIcon" class="p-row-toggler-icon" />
+                    <span v-else-if="!isRowExpanded && collapsedRowIcon" :class="['p-row-toggler-icon', collapsedRowIcon]" />
+                    <ChevronRightIcon v-else-if="!isRowExpanded && !collapsedRowIcon" class="p-row-toggler-icon" />
+                </template>
             </button>
         </template>
         <template v-else-if="editMode === 'row' && columnProp('rowEditor')">
diff --git a/components/lib/datatable/HeaderCheckbox.vue b/components/lib/datatable/HeaderCheckbox.vue
index 071a11581..2e0994f0d 100755
--- a/components/lib/datatable/HeaderCheckbox.vue
+++ b/components/lib/datatable/HeaderCheckbox.vue
@@ -4,7 +4,8 @@
             <input ref="input" type="checkbox" :checked="checked" :disabled="disabled" :tabindex="disabled ? null : '0'" :aria-label="headerCheckboxAriaLabel" @focus="onFocus($event)" @blur="onBlur($event)" />
         </div>
         <div ref="box" :class="['p-checkbox-box p-component', { 'p-highlight': checked, 'p-disabled': disabled, 'p-focus': focused }]">
-            <component :is="headerCheckboxIconTemplate || 'CheckIcon'" :checked="checked" class="p-checkbox-icon" />
+            <component v-if="headerCheckboxIconTemplate" :is="headerCheckboxIconTemplate" :checked="checked" class="p-checkbox-icon" />
+            <CheckIcon v-else class="p-checkbox-icon" />
         </div>
     </div>
 </template>
diff --git a/components/lib/datatable/TableBody.vue b/components/lib/datatable/TableBody.vue
index baa6a57db..5a3bf5f47 100755
--- a/components/lib/datatable/TableBody.vue
+++ b/components/lib/datatable/TableBody.vue
@@ -12,8 +12,12 @@
                     <td :colspan="columnsLength - 1">
                         <button v-if="expandableRowGroups" class="p-row-toggler p-link" @click="onRowGroupToggle($event, rowData)" type="button">
                             <component v-if="templates['rowgrouptogglericon']" :is="templates['rowgrouptogglericon']" :expanded="isRowGroupExpanded(rowData)" />
-                            <component v-else-if="!templates['rowgrouptogglericon'] && isRowGroupExpanded(rowData)" :is="expandedRowIcon ? 'span' : 'ChevronDownIcon'" class="p-row-toggler-icon" />
-                            <component v-else-if="!templates['rowgrouptogglericon'] && !isRowGroupExpanded(rowData)" :is="collapsedRowIcon ? 'span' : 'ChevronRightIcon'" class="p-row-toggler-icon" />
+                            <template v-else>
+                                <span v-if="isRowGroupExpanded(rowData) && expandedRowIcon" :class="['p-row-toggler-icon', expandedRowIcon]" />
+                                <ChevronDownIcon v-else-if="isRowGroupExpanded(rowData) && !expandedRowIcon" class="p-row-toggler-icon" />
+                                <span v-else-if="!isRowGroupExpanded(rowData) && collapsedRowIcon" :class="['p-row-toggler-icon', collapsedRowIcon]" />
+                                <ChevronRightIcon v-else-if="!isRowGroupExpanded(rowData) && !collapsedRowIcon" class="p-row-toggler-icon" />
+                            </template>
                         </button>
                         <component :is="templates['groupheader']" :data="rowData" :index="getRowIndex(index)" />
                     </td>
diff --git a/components/lib/dialog/Dialog.d.ts b/components/lib/dialog/Dialog.d.ts
index 019d301ee..5623c3cbe 100755
--- a/components/lib/dialog/Dialog.d.ts
+++ b/components/lib/dialog/Dialog.d.ts
@@ -146,14 +146,17 @@ export interface DialogProps {
     style?: any;
     /**
      * Icon to display in the dialog close button.
+     * @deprecated since v3.27.0. Use 'closeicon' slot.
      */
     closeIcon?: string | undefined;
     /**
      * Icon to display in the dialog maximize button when dialog is not maximized.
+     * @deprecated since v3.27.0. Use 'maximizeicon' slot.
      */
     maximizeIcon?: string | undefined;
     /**
-     * Icon to display in the dialog maximize button when dialog is maximized.
+     * Icon to display in the dialog maximize button when dialog is minimized.
+     * @deprecated since v3.27.0. Use 'minimizeicon' slot.
      */
     minimizeIcon?: string | undefined;
 }
@@ -179,8 +182,8 @@ export interface DialogSlots {
      */
     closeicon(): VNode[];
     /**
-     * Custom maximizeicon icon template of dialog.
-     * @param {Object} scope - maximizeicon icon slot's params.
+     * Custom maximize icon template of dialog.
+     * @param {Object} scope - maximize icon slot's params.
      */
     maximizeicon(scope: {
         /**
diff --git a/components/lib/dropdown/Dropdown.d.ts b/components/lib/dropdown/Dropdown.d.ts
index ea1319774..66158e6be 100755
--- a/components/lib/dropdown/Dropdown.d.ts
+++ b/components/lib/dropdown/Dropdown.d.ts
@@ -157,6 +157,7 @@ export interface DropdownProps {
     filterInputProps?: InputHTMLAttributes | undefined;
     /**
      * Uses to pass all properties of the HTMLElement to the clear icon inside the component.
+     * @deprecated since v3.26.0. Use 'pt' peroperty.
      */
     clearIconProps?: HTMLAttributes | undefined;
     /**
@@ -171,18 +172,22 @@ export interface DropdownProps {
     loading?: boolean | undefined;
     /**
      * Icon to display in clear button.
+     * @deprecated since v3.27.0. Use 'clearicon' slot.
      */
     clearIcon?: string | undefined;
     /**
      * Icon to display in the dropdown.
+     * @deprecated since v3.27.0. Use 'dropdownicon' slot.
      */
     dropdownIcon?: string | undefined;
     /**
      * Icon to display in filter input.
+     * @deprecated since v3.27.0. Use 'filtericon' slot.
      */
     filterIcon?: string | undefined;
     /**
      * Icon to display in loading state.
+     * @deprecated since v3.27.0. Use 'loadingicon' slot.
      */
     loadingIcon?: string | undefined;
     /**
@@ -369,6 +374,40 @@ export interface DropdownSlots {
          */
         options: any[];
     }): VNode[];
+    /**
+     * Custom clear icon template.
+     * @param {Object} scope - clear icon slot's params.
+     */
+    clearicon(scope: {
+        /**
+         * Clear icon click function.
+         */
+        onClick: void;
+    }): VNode[];
+    /**
+     * Custom dropdown icon template.
+     * @param {Object} scope - dropdown icon slot's params.
+     */
+    dropdownicon(scope: {
+        /**
+         * Style class of the component
+         */
+        class: any;
+    }): VNode[];
+    /**
+     * Custom loading icon template.
+     * @param {Object} scope - loading icon slot's params.
+     */
+    loadingicon(scope: {
+        /**
+         * Style class of the component
+         */
+        class: any;
+    }): VNode[];
+    /**
+     * Custom filter icon template.
+     */
+    filtericon(): VNode[];
 }
 
 /**
diff --git a/components/lib/fileupload/FileUpload.d.ts b/components/lib/fileupload/FileUpload.d.ts
index cfe4e4fa6..fa4d95756 100755
--- a/components/lib/fileupload/FileUpload.d.ts
+++ b/components/lib/fileupload/FileUpload.d.ts
@@ -236,17 +236,17 @@ export interface FileUploadProps {
     showCancelButton?: boolean | undefined;
     /**
      * Icon of the choose button.
-     * @todo
+     * @deprecated since v3.27.0. Use 'chooseicon' slot.
      */
     chooseIcon?: string | undefined;
     /**
      * Icon of the upload button.
-     * @todo
+     * @deprecated since v3.27.0. Use 'updateicon' slot.
      */
     uploadIcon?: string | undefined;
     /**
      * Icon of the cancel button.
-     * @todo
+     * @deprecated since v3.27.0. Use 'cancelicon' slot.
      */
     cancelIcon?: string | undefined;
     /**
diff --git a/components/lib/image/Image.d.ts b/components/lib/image/Image.d.ts
index ae0605860..b20a3e0b5 100644
--- a/components/lib/image/Image.d.ts
+++ b/components/lib/image/Image.d.ts
@@ -29,6 +29,7 @@ export interface ImageProps {
     imageClass?: any;
     /**
      * Custom indicator icon.
+     * @deprecated since v3.27.0. Use 'indicator' slot.
      */
     indicatorIcon?: string;
 }
diff --git a/components/lib/inlinemessage/InlineMessage.d.ts b/components/lib/inlinemessage/InlineMessage.d.ts
index 97e9b0b99..357c90817 100755
--- a/components/lib/inlinemessage/InlineMessage.d.ts
+++ b/components/lib/inlinemessage/InlineMessage.d.ts
@@ -21,7 +21,7 @@ export interface InlineMessageProps {
     severity?: 'success' | 'info' | 'warn' | 'error' | string | undefined;
     /**
      * Display a custom icon for the message.
-     * @todo
+     * @deprecated since v3.27.0. Use 'icon' slot.
      */
     icon?: string | undefined;
 }
diff --git a/components/lib/inplace/Inplace.d.ts b/components/lib/inplace/Inplace.d.ts
index dd3b92568..bfa5a7d10 100755
--- a/components/lib/inplace/Inplace.d.ts
+++ b/components/lib/inplace/Inplace.d.ts
@@ -31,6 +31,7 @@ export interface InplaceProps {
     disabled?: boolean | undefined;
     /**
      * Icon to display in the close button.
+     * @deprecated since v3.27.0. Use 'closeicon' slot.
      */
     closeIcon?: string | undefined;
     /**
@@ -55,6 +56,10 @@ export interface InplaceSlots {
      * Custom content template.
      */
     content(): VNode[];
+    /**
+     * Custom close icon template.
+     */
+    closeicon(): VNode[];
 }
 
 /**
diff --git a/components/lib/inputnumber/InputNumber.d.ts b/components/lib/inputnumber/InputNumber.d.ts
index 193f838fb..47ab67606 100755
--- a/components/lib/inputnumber/InputNumber.d.ts
+++ b/components/lib/inputnumber/InputNumber.d.ts
@@ -73,10 +73,12 @@ export interface InputNumberProps {
     decrementButtonClass?: string | undefined;
     /**
      * Style class of the increment button.
+     * @deprecated since v3.27.0. Use 'incrementbuttonicon' slot.
      */
     incrementButtonIcon?: string | undefined;
     /**
      * Style class of the decrement button.
+     * @deprecated since v3.27.0. Use 'decrementbuttonicon' slot.
      */
     decrementButtonIcon?: string | undefined;
     /**
diff --git a/components/lib/listbox/Listbox.d.ts b/components/lib/listbox/Listbox.d.ts
index 2ec226744..4f9b86d16 100755
--- a/components/lib/listbox/Listbox.d.ts
+++ b/components/lib/listbox/Listbox.d.ts
@@ -169,7 +169,7 @@ export interface ListboxProps {
     tabindex?: number | string | undefined;
     /**
      * Icon to display in filter input.
-     * @defaultValue ß
+     * @deprecated since v3.27.0. Use 'filtericon' slot.
      */
     filterIcon?: string | undefined;
     /**
diff --git a/components/lib/message/Message.d.ts b/components/lib/message/Message.d.ts
index cf4febf11..49d7cae0b 100755
--- a/components/lib/message/Message.d.ts
+++ b/components/lib/message/Message.d.ts
@@ -40,10 +40,12 @@ export interface MessageProps {
     icon?: string | undefined;
     /**
      * Icon to display in the message close button.
+     * @deprecated since v3.27.0. Use 'closeicon' slot.
      */
     closeIcon?: string | undefined;
     /**
      * Uses to pass all properties of the HTMLButtonElement to the close button.
+     * @deprecated since v3.26.0. Use 'pt' property.
      */
     closeButtonProps?: ButtonHTMLAttributes | undefined;
 }
@@ -59,11 +61,21 @@ export interface MessageSlots {
     /**
      * Custom message icon template.
      */
-    messageicon(): VNode[];
+    messageicon(scope: {
+        /**
+         * Style class of the item icon element.
+         */
+        class: any;
+    }): VNode[];
     /**
      * Custom close icon template.
      */
-    closeicon(): VNode[];
+    closeicon(scope: {
+        /**
+         * Style class of the item icon element.
+         */
+        class: any;
+    }): VNode[];
 }
 
 /**
diff --git a/components/lib/message/Message.vue b/components/lib/message/Message.vue
index f31295a00..ed1e77338 100755
--- a/components/lib/message/Message.vue
+++ b/components/lib/message/Message.vue
@@ -2,15 +2,16 @@
     <transition name="p-message" appear>
         <div v-show="visible" :class="containerClass" role="alert" aria-live="assertive" aria-atomic="true">
             <div class="p-message-wrapper">
-                <slot name="messageicon">
+                <slot name="messageicon" class="p-message-icon">
                     <component :is="icon ? 'span' : iconComponent" :class="['p-message-icon', icon]"></component>
                 </slot>
                 <div class="p-message-text">
                     <slot></slot>
                 </div>
                 <button v-if="closable" v-ripple class="p-message-close p-link" :aria-label="closeAriaLabel" type="button" @click="close($event)" v-bind="closeButtonProps">
-                    <slot name="closeicon">
-                        <component :is="closeIcon ? 'i' : 'TimesIcon'" :class="['p-message-close-icon', closeIcon]"></component>
+                    <slot name="closeicon" class="p-message-close-icon">
+                        <i v-if="closeIcon" :class="['p-message-close-icon', closeIcon]" />
+                        <TimesIcon v-else class="p-message-close-icon" />
                     </slot>
                 </button>
             </div>
diff --git a/components/lib/multiselect/MultiSelect.d.ts b/components/lib/multiselect/MultiSelect.d.ts
index 38c46e635..5ae98fc41 100755
--- a/components/lib/multiselect/MultiSelect.d.ts
+++ b/components/lib/multiselect/MultiSelect.d.ts
@@ -191,26 +191,32 @@ export interface MultiSelectProps {
     loading?: boolean | undefined;
     /**
      * Icon to display in the checkboxes.
+     * @deprecated since v3.27.0. Use 'checkboxicon' slot.
      */
     checkboxIcon?: string | undefined;
     /**
      * Icon to display in the dropdown close button.
+     * @deprecated since v3.27.0. Use 'closeicon' slot.
      */
     closeIcon?: string | undefined;
     /**
      * Icon to display in the dropdown.
+     * @deprecated since v3.27.0. Use 'dropdownicon' slot.
      */
     dropdownIcon?: string | undefined;
     /**
      * Icon to display in filter input.
+     * @deprecated since v3.27.0. Use 'filtericon' slot.
      */
     filterIcon?: string | undefined;
     /**
      * Icon to display in loading state.
+     * @deprecated since v3.27.0. Use 'loadingicon' slot.
      */
     loadingIcon?: string | undefined;
     /**
      * Icon to display in chip remove action.
+     * @deprecated since v3.27.0. Use 'removetokenicon' slot.
      */
     removeTokenIcon?: string | undefined;
     /**
@@ -307,6 +313,7 @@ export interface MultiSelectSlots {
     }): VNode[];
     /**
      * Custom indicator template.
+     * @deprecated since v3.27.0. Use 'loadingicon and dropdownicon' slot.
      */
     indicator(): VNode[];
     /**
@@ -411,7 +418,16 @@ export interface MultiSelectSlots {
     /**
      * Custom remove token icon template.
      */
-    removetokenicon(): VNode[];
+    removetokenicon(scope: {
+        /**
+         * Style class of the loading icon.
+         */
+        class: string;
+        /**
+         * Remove token icon function.
+         */
+        onClick: string;
+    }): VNode[];
     /**
      * Custom header checkbox icon template.
      * @param {Object} scope - header checkbox icon slot's params.
@@ -421,15 +437,29 @@ export interface MultiSelectSlots {
          * Options of the loader items for virtualscroller
          */
         allSelected: boolean;
+        /**
+         * Style class of the loading icon.
+         */
+        class: string;
     }): VNode[];
     /**
      * Custom filter icon template.
      */
-    filtericon(): VNode[];
+    filtericon(scope: {
+        /**
+         * Style class of the loading icon.
+         */
+        class: string;
+    }): VNode[];
     /**
      * Custom close icon template.
      */
-    closeicon(): VNode[];
+    closeicon(scope: {
+        /**
+         * Style class of the loading icon.
+         */
+        class: string;
+    }): VNode[];
     /**
      * Custom item checkbox icon template.
      * @param {Object} scope - header checkbox icon slot's params.
@@ -439,6 +469,29 @@ export interface MultiSelectSlots {
          * Options of the loader items for virtualscroller
          */
         selected: boolean;
+        /**
+         * Style class of the loading icon.
+         */
+        class: string;
+    }): VNode[];
+    /**
+     * Custom loading icon template.
+     * @param {Object} scope - loading icon slot's params.
+     */
+    loadingicon(scope: {
+        /**
+         * Style class of the loading icon.
+         */
+        class: string;
+    }): VNode[];
+    /**
+     * Custom dropdown icon template.
+     */
+    dropdownicon(scope: {
+        /**
+         * Style class of the loading icon.
+         */
+        class: string;
     }): VNode[];
 }
 
diff --git a/components/lib/multiselect/MultiSelect.vue b/components/lib/multiselect/MultiSelect.vue
index 8128d6f9e..9b42a6a02 100755
--- a/components/lib/multiselect/MultiSelect.vue
+++ b/components/lib/multiselect/MultiSelect.vue
@@ -33,8 +33,9 @@
                             <slot name="chip" :value="item">
                                 <span class="p-multiselect-token-label">{{ getLabelByValue(item) }}</span>
                             </slot>
-                            <slot v-if="!disabled" name="removetokenicon">
-                                <component :is="removeTokenIcon ? 'span' : 'TimesCircleIcon'" :class="['p-multiselect-token-icon', removeTokenIcon]" @click.stop="removeOption($event, item)" />
+                            <slot v-if="!disabled" name="removetokenicon" class="p-multiselect-token-icon" :onClick="(event) => removeOption(event, item)">
+                                <span v-if="removeTokenIcon" :class="['p-multiselect-token-icon', removeTokenIcon]" @click.stop="removeOption($event, item)" />
+                                <TimesCircleIcon v-else class="p-multiselect-token-icon" @click.stop="removeOption($event, item)" />
                             </slot>
                         </div>
                         <template v-if="!modelValue || modelValue.length === 0">{{ placeholder || 'empty' }}</template>
@@ -43,10 +44,16 @@
             </div>
         </div>
         <div class="p-multiselect-trigger">
-            <slot name="indicator">
-                <component v-if="loading" :is="loadingIcon ? 'span' : 'SpinnerIcon'" spin :class="['p-multiselect-trigger-icon', loadingIcon]" aria-hidden="true" />
-                <component v-else :is="dropdownIcon ? 'span' : 'ChevronDownIcon'" :class="['p-multiselect-trigger-icon', dropdownIcon]" aria-hidden="true" />
-            </slot>
+            <slot v-if="$slots.indicator" name="indicator"></slot>
+            <template v-else>
+                <slot v-if="loading" name="loadingicon" class="p-multiselect-trigger-icon">
+                    <span v-if="loadingIcon" :class="['p-multiselect-trigger-icon pi-spin', loadingIcon]" aria-hidden="true" />
+                    <SpinnerIcon v-else class="p-multiselect-trigger-icon" spin aria-hidden="true" />
+                </slot>
+                <slot v-else name="dropdownicon" class="p-multiselect-trigger-icon">
+                    <component :is="dropdownIcon ? 'span' : 'ChevronDownIcon'" :class="['p-multiselect-trigger-icon', dropdownIcon]" aria-hidden="true" />
+                </slot>
+            </template>
         </div>
         <Portal :appendTo="appendTo">
             <transition name="p-connected-overlay" @enter="onOverlayEnter" @after-enter="onOverlayAfterEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave">
@@ -59,7 +66,7 @@
                                 <input type="checkbox" readonly :checked="allSelected" :aria-label="toggleAllAriaLabel" @focus="onHeaderCheckboxFocus" @blur="onHeaderCheckboxBlur" />
                             </div>
                             <div :class="['p-checkbox-box', { 'p-highlight': allSelected, 'p-focus': headerCheckboxFocused }]">
-                                <slot name="headercheckboxicon" :allSelected="allSelected">
+                                <slot name="headercheckboxicon" :allSelected="allSelected" class="p-checkbox-icon">
                                     <component :is="checkboxIcon ? 'span' : 'CheckIcon'" :class="['p-checkbox-icon', { [checkboxIcon]: allSelected }]" />
                                 </slot>
                             </div>
@@ -81,7 +88,7 @@
                                 @input="onFilterChange"
                                 v-bind="filterInputProps"
                             />
-                            <slot name="filtericon">
+                            <slot name="filtericon" class="p-multiselect-filter-icon">
                                 <component :is="filterIcon ? 'span' : 'SearchIcon'" :class="['p-multiselect-filter-icon', filterIcon]" />
                             </slot>
                         </div>
@@ -89,7 +96,7 @@
                             {{ filterResultMessageText }}
                         </span>
                         <button v-ripple class="p-multiselect-close p-link" :aria-label="closeAriaLabel" @click="onCloseClick" type="button" v-bind="closeButtonProps">
-                            <slot name="closeicon">
+                            <slot name="closeicon" class="p-multiselect-close-icon">
                                 <component :is="closeIcon ? 'span' : 'TimesIcon'" :class="['p-multiselect-close-icon', closeIcon]" />
                             </slot>
                         </button>
@@ -119,7 +126,7 @@
                                         >
                                             <div class="p-checkbox p-component">
                                                 <div :class="['p-checkbox-box', { 'p-highlight': isSelected(option) }]">
-                                                    <slot name="itemcheckboxicon" :selected="isSelected(option)">
+                                                    <slot name="itemcheckboxicon" :selected="isSelected(option)" class="p-checkbox-icon">
                                                         <component :is="checkboxIcon ? 'span' : 'CheckIcon'" :class="['p-checkbox-icon', { [checkboxIcon]: isSelected(option) }]" />
                                                     </slot>
                                                 </div>
diff --git a/components/lib/overlaypanel/OverlayPanel.d.ts b/components/lib/overlaypanel/OverlayPanel.d.ts
index 333888ac1..247bdf775 100755
--- a/components/lib/overlaypanel/OverlayPanel.d.ts
+++ b/components/lib/overlaypanel/OverlayPanel.d.ts
@@ -67,6 +67,7 @@ export interface OverlayPanelProps {
     breakpoints?: OverlayPanelBreakpoints;
     /**
      * Icon to display in the overlaypanel close button.
+     * @deprecated since v3.27.0. Use 'closeicon' slot.
      */
     closeIcon?: string | undefined;
 }
diff --git a/components/lib/password/Password.d.ts b/components/lib/password/Password.d.ts
index 5e7045a17..3f744faea 100755
--- a/components/lib/password/Password.d.ts
+++ b/components/lib/password/Password.d.ts
@@ -61,10 +61,12 @@ export interface PasswordProps extends InputHTMLAttributes {
     toggleMask?: boolean | undefined;
     /**
      * Icon to hide displaying the password as plain text.
+     * @deprecated since v3.27.0. Use 'hideicon' slot.
      */
     hideIcon?: string | undefined;
     /**
      * Icon to show displaying the password as plain text.
+     * @deprecated since v3.27.0. Use 'showicon' slot.
      */
     showIcon?: string | undefined;
     /**
@@ -142,11 +144,21 @@ export interface PasswordSlots {
     /**
      * Custom hide icon template.
      */
-    hideicon(): VNode[];
+    hideicon(scope: {
+        /**
+         * Hide icon click event
+         */
+        onClick(): void;
+    }): VNode[];
     /**
      * Custom show icon template.
      */
-    showicon(): VNode[];
+    showicon(scope: {
+        /**
+         * Show icon click event
+         */
+        onClick(): void;
+    }): VNode[];
 }
 
 /**
diff --git a/components/lib/password/Password.vue b/components/lib/password/Password.vue
index c7be8a1bc..bdf0ee63d 100755
--- a/components/lib/password/Password.vue
+++ b/components/lib/password/Password.vue
@@ -21,10 +21,10 @@
             @invalid="onInvalid"
             v-bind="inputProps"
         />
-        <slot v-if="toggleMask && unmasked" name="hideicon">
+        <slot v-if="toggleMask && unmasked" name="hideicon" :onClick="() => onMaskToggle">
             <component :is="hideIcon ? 'i' : 'EyeSlashIcon'" :class="hideIcon" @click="onMaskToggle" />
         </slot>
-        <slot v-if="toggleMask && !unmasked" name="showicon">
+        <slot v-if="toggleMask && !unmasked" name="showicon" :onClick="() => onMaskToggle">
             <component :is="showIcon ? 'i' : 'EyeIcon'" :class="showIcon" @click="onMaskToggle" />
         </slot>
         <span class="p-hidden-accessible" aria-live="polite">
diff --git a/components/lib/rating/Rating.d.ts b/components/lib/rating/Rating.d.ts
index 45bb5aa32..4dd2eb5c9 100755
--- a/components/lib/rating/Rating.d.ts
+++ b/components/lib/rating/Rating.d.ts
@@ -59,14 +59,17 @@ export interface RatingProps {
     cancel?: boolean | undefined;
     /**
      * Icon for the on state.
+     * @deprecated since v3.27.0. Use 'onicon' slot.
      */
     onIcon?: string | undefined;
     /**
      * Icon for the off state.
+     * @deprecated since v3.27.0. Use 'officon' slot.
      */
     offIcon?: string | undefined;
     /**
      * Icon for the cancelable state.
+     * @deprecated since v3.27.0. Use 'cancelicon' slot.
      */
     cancelIcon?: string | undefined;
 }
diff --git a/components/lib/scrolltop/ScrollTop.d.ts b/components/lib/scrolltop/ScrollTop.d.ts
index a6e6595ad..fcad676cd 100644
--- a/components/lib/scrolltop/ScrollTop.d.ts
+++ b/components/lib/scrolltop/ScrollTop.d.ts
@@ -41,6 +41,7 @@ export interface ScrollTopProps {
 export interface ScrollTopSlots {
     /**
      * Custom scrolltop icon template.
+     * @deprecated since v3.27.0. Use 'icon' slot.
      */
     icon(): VNode[];
 }
diff --git a/components/lib/sidebar/Sidebar.d.ts b/components/lib/sidebar/Sidebar.d.ts
index 6dc071c69..137dbe0e9 100755
--- a/components/lib/sidebar/Sidebar.d.ts
+++ b/components/lib/sidebar/Sidebar.d.ts
@@ -46,6 +46,7 @@ export interface SidebarProps {
     showCloseIcon?: boolean | undefined;
     /**
      * Icon to display in the sidebar close button.
+     * @deprecated since v3.27.0. Use 'closeicon' slot.
      */
     closeIcon?: string | undefined;
     /**
diff --git a/components/lib/speeddial/SpeedDial.d.ts b/components/lib/speeddial/SpeedDial.d.ts
index ec6037bb5..ca2250df6 100644
--- a/components/lib/speeddial/SpeedDial.d.ts
+++ b/components/lib/speeddial/SpeedDial.d.ts
@@ -93,10 +93,12 @@ export interface SpeedDialProps {
     maskClass?: string | undefined;
     /**
      * Show icon of the button element.
+     * @deprecated since v3.27.0. Use 'showicon' slot.
      */
     showIcon?: string | undefined;
     /**
      * Hide icon of the button element.
+     * @deprecated since v3.27.0. Use 'hideicon' slot.
      */
     hideIcon?: string | undefined;
     /**
@@ -152,6 +154,16 @@ export interface SpeedDialSlots {
          */
         toggle(): void;
     }): VNode[];
+    /**
+     * Custom icon template.
+     * @param {Object} scope - icon slot's params.
+     */
+    icon(scope: {
+        /**
+         *
+         */
+        visible: boolean;
+    }): VNode[];
 }
 
 /**
diff --git a/components/lib/splitbutton/SplitButton.d.ts b/components/lib/splitbutton/SplitButton.d.ts
index 06c8e409f..ed13e8cbd 100755
--- a/components/lib/splitbutton/SplitButton.d.ts
+++ b/components/lib/splitbutton/SplitButton.d.ts
@@ -21,6 +21,7 @@ export interface SplitButtonProps {
     label?: string | undefined;
     /**
      * Name of the icon.
+     * @deprecated since v3.27.0. Use 'icon' slot.
      */
     icon?: string | undefined;
     /**
@@ -66,6 +67,7 @@ export interface SplitButtonProps {
     menuButtonProps?: ButtonHTMLAttributes | undefined;
     /**
      * Name of the menu button icon.
+     * @deprecated since v3.27.0. Use 'menubuttonicon' slot.
      */
     menuButtonIcon?: string | undefined;
     /**
@@ -111,6 +113,10 @@ export interface SplitButtonSlots {
      * Button part of the content can easily be customized with the default slot instead of using the built-in modes.
      */
     default(): VNode[];
+    /**
+     * Custom menu button icon template.
+     */
+    icon(): VNode[];
     /**
      * Custom menu button icon template.
      */
diff --git a/components/lib/tabview/TabView.d.ts b/components/lib/tabview/TabView.d.ts
index 9e2bfc7c3..45ace0333 100755
--- a/components/lib/tabview/TabView.d.ts
+++ b/components/lib/tabview/TabView.d.ts
@@ -152,11 +152,13 @@ export interface TabViewProps {
      */
     nextButtonProps?: ButtonHTMLAttributes | undefined;
     /**
-     * Prev icon of the scrollable tabview.
+     * Previous icon of the scrollable tabview.
+     * @deprecated since v3.27.0. Use 'previousicon' slot.
      */
     prevIcon?: string | undefined;
     /**
      * Next icon of the scrollable tabview.
+     * @deprecated since v3.27.0. Use 'next' slot.
      */
     nextIcon?: string | undefined;
     /**
@@ -177,7 +179,7 @@ export interface TabViewSlots {
     /**
      * Previous button icon template for the scrollable component.
      */
-    previcon(): VNode[];
+    previousicon(): VNode[];
     /**
      * Next button icon template for the scrollable component.
      */
diff --git a/components/lib/tag/Tag.d.ts b/components/lib/tag/Tag.d.ts
index 161f1c033..2a8613243 100644
--- a/components/lib/tag/Tag.d.ts
+++ b/components/lib/tag/Tag.d.ts
@@ -29,6 +29,7 @@ export interface TagProps {
     rounded?: boolean | undefined;
     /**
      * Icon of the tag to display next to the value.
+     * @deprecated since v3.27.0. Use 'icon' slot.
      */
     icon?: string | undefined;
 }
@@ -41,6 +42,10 @@ export interface TagSlots {
      * Custom content template
      */
     default(): VNode[];
+    /**
+     * Custom icon template
+     */
+    icon(): VNode[];
 }
 
 /**
diff --git a/components/lib/toast/Toast.d.ts b/components/lib/toast/Toast.d.ts
index 22da8f6ae..6642b0bf2 100755
--- a/components/lib/toast/Toast.d.ts
+++ b/components/lib/toast/Toast.d.ts
@@ -95,26 +95,32 @@ export interface ToastProps {
     breakpoints?: ToastBreakpointsType;
     /**
      * Icon to display in the toast close button.
+     * @deprecated since v3.27.0. Use 'closeicon' slot.
      */
     closeIcon?: string | undefined;
     /**
      * Icon to display in the toast with info severity.
+     * @deprecated since v3.27.0. Use 'icon' slot.
      */
     infoIcon?: string | undefined;
     /**
      * Icon to display in the toast with warn severity.
+     * @deprecated since v3.27.0. Use 'icon' slot.
      */
     warnIcon?: string | undefined;
     /**
      * Icon to display in the toast with error severity.
+     * @deprecated since v3.27.0. Use 'icon' slot.
      */
     errorIcon?: string | undefined;
     /**
      * Icon to display in the toast with success severity.
+     * @deprecated since v3.27.0. Use 'icon' slot.
      */
     successIcon?: string | undefined;
     /**
      * Uses to pass all properties of the HTMLButtonElement to the close button.
+     * @deprecated since v3.26.0. Use 'pt' property.
      */
     closeButtonProps?: ButtonHTMLAttributes | undefined;
 }
diff --git a/components/lib/togglebutton/ToggleButton.d.ts b/components/lib/togglebutton/ToggleButton.d.ts
index 25cec1276..57b997061 100755
--- a/components/lib/togglebutton/ToggleButton.d.ts
+++ b/components/lib/togglebutton/ToggleButton.d.ts
@@ -7,7 +7,7 @@
  * @module togglebutton
  *
  */
-import { InputHTMLAttributes } from 'vue';
+import { InputHTMLAttributes, VNode } from 'vue';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 /**
@@ -21,10 +21,12 @@ export interface ToggleButtonProps {
     modelValue?: boolean | undefined;
     /**
      * Icon for the on state.
+     * @deprecated since v3.27.0. Use 'icon' slot.
      */
     onIcon?: string | undefined;
     /**
      * Icon for the off state.
+     * @deprecated since v3.27.0. Use 'icon' slot.
      */
     offIcon?: string | undefined;
     /**
@@ -80,7 +82,21 @@ export interface ToggleButtonProps {
 /**
  * Defines valid slots in ToggleButton component.
  */
-export interface ToggleButtonSlots {}
+export interface ToggleButtonSlots {
+    /**
+     * Custom icon template.
+     */
+    icon(scope: {
+        /**
+         * Current value
+         */
+        value: any;
+        /**
+         * Icon style class
+         */
+        class: any;
+    }): VNode[];
+}
 
 /**
  * Defines valid emits in ToggleButton component.
diff --git a/components/lib/tree/Tree.d.ts b/components/lib/tree/Tree.d.ts
index c8ab88264..621d1b6a1 100755
--- a/components/lib/tree/Tree.d.ts
+++ b/components/lib/tree/Tree.d.ts
@@ -123,6 +123,7 @@ export interface TreeProps {
     loading?: boolean | undefined;
     /**
      * Icon to display when tree is loading.
+     * @deprecated since v3.27.0. Use 'loadingicon' slot.
      */
     loadingIcon?: string | undefined;
     /**
diff --git a/components/lib/treeselect/TreeSelect.d.ts b/components/lib/treeselect/TreeSelect.d.ts
index b770b0c3c..ab0719ba2 100644
--- a/components/lib/treeselect/TreeSelect.d.ts
+++ b/components/lib/treeselect/TreeSelect.d.ts
@@ -150,14 +150,6 @@ export interface TreeSelectSlots {
      * Custom indicator template.
      */
     indicator(): VNode[];
-    /**
-     * Custom loading icon template.
-     */
-    loadingicon(): VNode[];
-    /**
-     * Custom search icon template.
-     */
-    searchicon(): VNode[];
     /**
      * Custom item toggler icon template.
      * @param {Object} scope - item toggler icon slot's params.
diff --git a/components/lib/treeselect/TreeSelect.vue b/components/lib/treeselect/TreeSelect.vue
index 727e11e62..83eb4ae46 100644
--- a/components/lib/treeselect/TreeSelect.vue
+++ b/components/lib/treeselect/TreeSelect.vue
@@ -69,12 +69,6 @@
                             <template v-if="$slots.itemcheckboxicon" #checkboxicon="iconProps">
                                 <slot name="itemcheckboxicon" :checked="iconProps.checked" :partialChecked="iconProps.partialChecked" :class="iconProps.class" />
                             </template>
-                            <template v-if="$slots.loadingicon" #loadingicon>
-                                <slot name="loadingicon" />
-                            </template>
-                            <template v-if="$slots.searchicon" #searchicon>
-                                <slot name="searchicon" />
-                            </template>
                         </TSTree>
                         <div v-if="emptyOptions" class="p-treeselect-empty-message">
                             <slot name="empty">{{ emptyMessageText }}</slot>
diff --git a/components/lib/treetable/TreeTable.d.ts b/components/lib/treetable/TreeTable.d.ts
index a84041ede..20f6dadb5 100755
--- a/components/lib/treetable/TreeTable.d.ts
+++ b/components/lib/treetable/TreeTable.d.ts
@@ -259,6 +259,7 @@ export interface TreeTableProps {
     loading?: boolean | undefined;
     /**
      * The icon to show while indicating data load is in progress.
+     * @deprecated since v3.27.0. Use 'loadingicon' slot.
      */
     loadingIcon?: string | undefined;
     /**
diff --git a/components/lib/tristatecheckbox/TriStateCheckbox.d.ts b/components/lib/tristatecheckbox/TriStateCheckbox.d.ts
index 538d8b046..a6f23b0e6 100755
--- a/components/lib/tristatecheckbox/TriStateCheckbox.d.ts
+++ b/components/lib/tristatecheckbox/TriStateCheckbox.d.ts
@@ -34,6 +34,7 @@ export interface TriStateCheckboxProps {
     inputId?: string | undefined;
     /**
      * Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.
+     * @deprecated since v3.26.0. Use 'pt' property.
      */
     inputProps?: InputHTMLAttributes | undefined;
     /**

From 96da5fbbcb88daa302e6fe4bb908eb503ecef50b Mon Sep 17 00:00:00 2001
From: GitHub Actions Bot <>
Date: Tue, 18 Apr 2023 10:52:00 +0000
Subject: [PATCH 4/4] Update API doc

---
 doc/common/apidoc/index.json | 352 +++++++++++++++++++++++++++--------
 1 file changed, 274 insertions(+), 78 deletions(-)

diff --git a/doc/common/apidoc/index.json b/doc/common/apidoc/index.json
index 385025920..341560dc3 100644
--- a/doc/common/apidoc/index.json
+++ b/doc/common/apidoc/index.json
@@ -11221,7 +11221,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in the dialog close button."
+                            "description": "Icon to display in the dialog close button.",
+                            "deprecated": "since v3.27.0. Use 'closeicon' slot."
                         },
                         {
                             "name": "maximizeIcon",
@@ -11229,7 +11230,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in the dialog maximize button when dialog is not maximized."
+                            "description": "Icon to display in the dialog maximize button when dialog is not maximized.",
+                            "deprecated": "since v3.27.0. Use 'maximizeicon' slot."
                         },
                         {
                             "name": "minimizeIcon",
@@ -11237,7 +11239,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in the dialog maximize button when dialog is maximized."
+                            "description": "Icon to display in the dialog maximize button when dialog is minimized.",
+                            "deprecated": "since v3.27.0. Use 'minimizeicon' slot."
                         }
                     ],
                     "methods": []
@@ -11278,11 +11281,11 @@
                                     "name": "scope",
                                     "optional": false,
                                     "type": "{\n  \t <b>maximized</b>: boolean, // Maximized state as a boolean\n  }",
-                                    "description": "maximizeicon icon slot's params."
+                                    "description": "maximize icon slot's params."
                                 }
                             ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
-                            "description": "Custom maximizeicon icon template of dialog."
+                            "description": "Custom maximize icon template of dialog."
                         }
                     ]
                 },
@@ -12020,7 +12023,8 @@
                             "readonly": false,
                             "type": "HTMLAttributes",
                             "default": "",
-                            "description": "Uses to pass all properties of the HTMLElement to the clear icon inside the component."
+                            "description": "Uses to pass all properties of the HTMLElement to the clear icon inside the component.",
+                            "deprecated": "since v3.26.0. Use 'pt' peroperty."
                         },
                         {
                             "name": "appendTo",
@@ -12044,7 +12048,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in clear button."
+                            "description": "Icon to display in clear button.",
+                            "deprecated": "since v3.27.0. Use 'clearicon' slot."
                         },
                         {
                             "name": "dropdownIcon",
@@ -12052,7 +12057,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in the dropdown."
+                            "description": "Icon to display in the dropdown.",
+                            "deprecated": "since v3.27.0. Use 'dropdownicon' slot."
                         },
                         {
                             "name": "filterIcon",
@@ -12060,7 +12066,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in filter input."
+                            "description": "Icon to display in filter input.",
+                            "deprecated": "since v3.27.0. Use 'filtericon' slot."
                         },
                         {
                             "name": "loadingIcon",
@@ -12068,7 +12075,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in loading state."
+                            "description": "Icon to display in loading state.",
+                            "deprecated": "since v3.27.0. Use 'loadingicon' slot."
                         },
                         {
                             "name": "resetFilterOnHide",
@@ -12290,6 +12298,51 @@
                             ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom loader template."
+                        },
+                        {
+                            "name": "clearicon",
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <b>onClick</b>: void, // Clear icon click function.\n  }",
+                                    "description": "clear icon slot's params."
+                                }
+                            ],
+                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
+                            "description": "Custom clear icon template."
+                        },
+                        {
+                            "name": "dropdownicon",
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <b>class</b>: any, // Style class of the component\n  }",
+                                    "description": "dropdown icon slot's params."
+                                }
+                            ],
+                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
+                            "description": "Custom dropdown icon template."
+                        },
+                        {
+                            "name": "loadingicon",
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <b>class</b>: any, // Style class of the component\n  }",
+                                    "description": "loading icon slot's params."
+                                }
+                            ],
+                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
+                            "description": "Custom loading icon template."
+                        },
+                        {
+                            "name": "filtericon",
+                            "parameters": [],
+                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
+                            "description": "Custom filter icon template."
                         }
                     ]
                 },
@@ -13498,7 +13551,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon of the choose button."
+                            "description": "Icon of the choose button.",
+                            "deprecated": "since v3.27.0. Use 'chooseicon' slot."
                         },
                         {
                             "name": "uploadIcon",
@@ -13506,7 +13560,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon of the upload button."
+                            "description": "Icon of the upload button.",
+                            "deprecated": "since v3.27.0. Use 'updateicon' slot."
                         },
                         {
                             "name": "cancelIcon",
@@ -13514,7 +13569,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon of the cancel button."
+                            "description": "Icon of the cancel button.",
+                            "deprecated": "since v3.27.0. Use 'cancelicon' slot."
                         },
                         {
                             "name": "style",
@@ -14330,7 +14386,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Custom indicator icon."
+                            "description": "Custom indicator icon.",
+                            "deprecated": "since v3.27.0. Use 'indicator' slot."
                         }
                     ],
                     "methods": []
@@ -14421,7 +14478,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Display a custom icon for the message."
+                            "description": "Display a custom icon for the message.",
+                            "deprecated": "since v3.27.0. Use 'icon' slot."
                         }
                     ],
                     "methods": []
@@ -14504,7 +14562,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in the close button."
+                            "description": "Icon to display in the close button.",
+                            "deprecated": "since v3.27.0. Use 'closeicon' slot."
                         },
                         {
                             "name": "displayProps",
@@ -14541,6 +14600,12 @@
                             "parameters": [],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom content template."
+                        },
+                        {
+                            "name": "closeicon",
+                            "parameters": [],
+                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
+                            "description": "Custom close icon template."
                         }
                     ]
                 },
@@ -14872,7 +14937,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Style class of the increment button."
+                            "description": "Style class of the increment button.",
+                            "deprecated": "since v3.27.0. Use 'incrementbuttonicon' slot."
                         },
                         {
                             "name": "decrementButtonIcon",
@@ -14880,7 +14946,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Style class of the decrement button."
+                            "description": "Style class of the decrement button.",
+                            "deprecated": "since v3.27.0. Use 'decrementbuttonicon' slot."
                         },
                         {
                             "name": "locale",
@@ -15870,8 +15937,9 @@
                             "optional": true,
                             "readonly": false,
                             "type": "string",
-                            "default": "ß",
-                            "description": "Icon to display in filter input."
+                            "default": "",
+                            "description": "Icon to display in filter input.",
+                            "deprecated": "since v3.27.0. Use 'filtericon' slot."
                         },
                         {
                             "name": "aria-label",
@@ -16815,7 +16883,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in the message close button."
+                            "description": "Icon to display in the message close button.",
+                            "deprecated": "since v3.27.0. Use 'closeicon' slot."
                         },
                         {
                             "name": "closeButtonProps",
@@ -16823,7 +16892,8 @@
                             "readonly": false,
                             "type": "ButtonHTMLAttributes",
                             "default": "",
-                            "description": "Uses to pass all properties of the HTMLButtonElement to the close button."
+                            "description": "Uses to pass all properties of the HTMLButtonElement to the close button.",
+                            "deprecated": "since v3.26.0. Use 'pt' property."
                         }
                     ],
                     "methods": []
@@ -16841,13 +16911,25 @@
                         },
                         {
                             "name": "messageicon",
-                            "parameters": [],
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <b>class</b>: any, // Style class of the item icon element.\n  }"
+                                }
+                            ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom message icon template."
                         },
                         {
                             "name": "closeicon",
-                            "parameters": [],
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <b>class</b>: any, // Style class of the item icon element.\n  }"
+                                }
+                            ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom close icon template."
                         }
@@ -17237,7 +17319,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in the checkboxes."
+                            "description": "Icon to display in the checkboxes.",
+                            "deprecated": "since v3.27.0. Use 'checkboxicon' slot."
                         },
                         {
                             "name": "closeIcon",
@@ -17245,7 +17328,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in the dropdown close button."
+                            "description": "Icon to display in the dropdown close button.",
+                            "deprecated": "since v3.27.0. Use 'closeicon' slot."
                         },
                         {
                             "name": "dropdownIcon",
@@ -17253,7 +17337,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in the dropdown."
+                            "description": "Icon to display in the dropdown.",
+                            "deprecated": "since v3.27.0. Use 'dropdownicon' slot."
                         },
                         {
                             "name": "filterIcon",
@@ -17261,7 +17346,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in filter input."
+                            "description": "Icon to display in filter input.",
+                            "deprecated": "since v3.27.0. Use 'filtericon' slot."
                         },
                         {
                             "name": "loadingIcon",
@@ -17269,7 +17355,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in loading state."
+                            "description": "Icon to display in loading state.",
+                            "deprecated": "since v3.27.0. Use 'loadingicon' slot."
                         },
                         {
                             "name": "removeTokenIcon",
@@ -17277,7 +17364,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in chip remove action."
+                            "description": "Icon to display in chip remove action.",
+                            "deprecated": "since v3.27.0. Use 'removetokenicon' slot."
                         },
                         {
                             "name": "selectAll",
@@ -17421,7 +17509,8 @@
                             "name": "indicator",
                             "parameters": [],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
-                            "description": "Custom indicator template."
+                            "description": "Custom indicator template.",
+                            "deprecated": "since v3.27.0. Use 'loadingicon and dropdownicon' slot."
                         },
                         {
                             "name": "header",
@@ -17515,7 +17604,13 @@
                         },
                         {
                             "name": "removetokenicon",
-                            "parameters": [],
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <b>class</b>: string, // Style class of the loading icon.\n  \t <b>onClick</b>: string, // Remove token icon function.\n  }"
+                                }
+                            ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom remove token icon template."
                         },
@@ -17525,7 +17620,7 @@
                                 {
                                     "name": "scope",
                                     "optional": false,
-                                    "type": "{\n  \t <b>allSelected</b>: boolean, // Options of the loader items for virtualscroller\n  }",
+                                    "type": "{\n  \t <b>allSelected</b>: boolean, // Options of the loader items for virtualscroller\n  \t <b>class</b>: string, // Style class of the loading icon.\n  }",
                                     "description": "header checkbox icon slot's params."
                                 }
                             ],
@@ -17534,13 +17629,25 @@
                         },
                         {
                             "name": "filtericon",
-                            "parameters": [],
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <b>class</b>: string, // Style class of the loading icon.\n  }"
+                                }
+                            ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom filter icon template."
                         },
                         {
                             "name": "closeicon",
-                            "parameters": [],
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <b>class</b>: string, // Style class of the loading icon.\n  }"
+                                }
+                            ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom close icon template."
                         },
@@ -17550,12 +17657,37 @@
                                 {
                                     "name": "scope",
                                     "optional": false,
-                                    "type": "{\n  \t <b>selected</b>: boolean, // Options of the loader items for virtualscroller\n  }",
+                                    "type": "{\n  \t <b>selected</b>: boolean, // Options of the loader items for virtualscroller\n  \t <b>class</b>: string, // Style class of the loading icon.\n  }",
                                     "description": "header checkbox icon slot's params."
                                 }
                             ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom item checkbox icon template."
+                        },
+                        {
+                            "name": "loadingicon",
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <b>class</b>: string, // Style class of the loading icon.\n  }",
+                                    "description": "loading icon slot's params."
+                                }
+                            ],
+                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
+                            "description": "Custom loading icon template."
+                        },
+                        {
+                            "name": "dropdownicon",
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <b>class</b>: string, // Style class of the loading icon.\n  }"
+                                }
+                            ],
+                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
+                            "description": "Custom dropdown icon template."
                         }
                     ]
                 },
@@ -18414,7 +18546,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in the overlaypanel close button."
+                            "description": "Icon to display in the overlaypanel close button.",
+                            "deprecated": "since v3.27.0. Use 'closeicon' slot."
                         }
                     ],
                     "methods": []
@@ -19328,7 +19461,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to hide displaying the password as plain text."
+                            "description": "Icon to hide displaying the password as plain text.",
+                            "deprecated": "since v3.27.0. Use 'hideicon' slot."
                         },
                         {
                             "name": "showIcon",
@@ -19336,7 +19470,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to show displaying the password as plain text."
+                            "description": "Icon to show displaying the password as plain text.",
+                            "deprecated": "since v3.27.0. Use 'showicon' slot."
                         },
                         {
                             "name": "disabled",
@@ -19471,13 +19606,25 @@
                         },
                         {
                             "name": "hideicon",
-                            "parameters": [],
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <b>onClick()</b>: void, // Hide icon click event\n  }"
+                                }
+                            ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom hide icon template."
                         },
                         {
                             "name": "showicon",
-                            "parameters": [],
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <b>onClick()</b>: void, // Show icon click event\n  }"
+                                }
+                            ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom show icon template."
                         }
@@ -20534,7 +20681,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon for the on state."
+                            "description": "Icon for the on state.",
+                            "deprecated": "since v3.27.0. Use 'onicon' slot."
                         },
                         {
                             "name": "offIcon",
@@ -20542,7 +20690,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon for the off state."
+                            "description": "Icon for the off state.",
+                            "deprecated": "since v3.27.0. Use 'officon' slot."
                         },
                         {
                             "name": "cancelIcon",
@@ -20550,7 +20699,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon for the cancelable state."
+                            "description": "Icon for the cancelable state.",
+                            "deprecated": "since v3.27.0. Use 'cancelicon' slot."
                         }
                     ],
                     "methods": []
@@ -20967,7 +21117,8 @@
                             "name": "icon",
                             "parameters": [],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
-                            "description": "Custom scrolltop icon template."
+                            "description": "Custom scrolltop icon template.",
+                            "deprecated": "since v3.27.0. Use 'icon' slot."
                         }
                     ]
                 },
@@ -21263,7 +21414,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in the sidebar close button."
+                            "description": "Icon to display in the sidebar close button.",
+                            "deprecated": "since v3.27.0. Use 'closeicon' slot."
                         },
                         {
                             "name": "modal",
@@ -21765,7 +21917,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Show icon of the button element."
+                            "description": "Show icon of the button element.",
+                            "deprecated": "since v3.27.0. Use 'showicon' slot."
                         },
                         {
                             "name": "hideIcon",
@@ -21773,7 +21926,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Hide icon of the button element."
+                            "description": "Hide icon of the button element.",
+                            "deprecated": "since v3.27.0. Use 'hideicon' slot."
                         },
                         {
                             "name": "rotateAnimation",
@@ -21856,6 +22010,19 @@
                             ],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom button template."
+                        },
+                        {
+                            "name": "icon",
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <b>visible</b>: boolean, // undefined\n  }",
+                                    "description": "icon slot's params."
+                                }
+                            ],
+                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
+                            "description": "Custom icon template."
                         }
                     ]
                 },
@@ -21955,7 +22122,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Name of the icon."
+                            "description": "Name of the icon.",
+                            "deprecated": "since v3.27.0. Use 'icon' slot."
                         },
                         {
                             "name": "model",
@@ -22035,7 +22203,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Name of the menu button icon."
+                            "description": "Name of the menu button icon.",
+                            "deprecated": "since v3.27.0. Use 'menubuttonicon' slot."
                         },
                         {
                             "name": "severity",
@@ -22107,6 +22276,12 @@
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Button part of the content can easily be customized with the default slot instead of using the built-in modes."
                         },
+                        {
+                            "name": "icon",
+                            "parameters": [],
+                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
+                            "description": "Custom menu button icon template."
+                        },
                         {
                             "name": "menubuttonicon",
                             "parameters": [],
@@ -23341,7 +23516,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Prev icon of the scrollable tabview."
+                            "description": "Previous icon of the scrollable tabview.",
+                            "deprecated": "since v3.27.0. Use 'previousicon' slot."
                         },
                         {
                             "name": "nextIcon",
@@ -23349,7 +23525,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Next icon of the scrollable tabview."
+                            "description": "Next icon of the scrollable tabview.",
+                            "deprecated": "since v3.27.0. Use 'next' slot."
                         },
                         {
                             "name": "pt",
@@ -23374,7 +23551,7 @@
                             "description": "Default slot to detect TabPanel components."
                         },
                         {
-                            "name": "previcon",
+                            "name": "previousicon",
                             "parameters": [],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Previous button icon template for the scrollable component."
@@ -23495,7 +23672,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon of the tag to display next to the value."
+                            "description": "Icon of the tag to display next to the value.",
+                            "deprecated": "since v3.27.0. Use 'icon' slot."
                         }
                     ],
                     "methods": []
@@ -23510,6 +23688,12 @@
                             "parameters": [],
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom content template"
+                        },
+                        {
+                            "name": "icon",
+                            "parameters": [],
+                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
+                            "description": "Custom icon template"
                         }
                     ]
                 },
@@ -24199,7 +24383,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in the toast close button."
+                            "description": "Icon to display in the toast close button.",
+                            "deprecated": "since v3.27.0. Use 'closeicon' slot."
                         },
                         {
                             "name": "infoIcon",
@@ -24207,7 +24392,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in the toast with info severity."
+                            "description": "Icon to display in the toast with info severity.",
+                            "deprecated": "since v3.27.0. Use 'icon' slot."
                         },
                         {
                             "name": "warnIcon",
@@ -24215,7 +24401,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in the toast with warn severity."
+                            "description": "Icon to display in the toast with warn severity.",
+                            "deprecated": "since v3.27.0. Use 'icon' slot."
                         },
                         {
                             "name": "errorIcon",
@@ -24223,7 +24410,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in the toast with error severity."
+                            "description": "Icon to display in the toast with error severity.",
+                            "deprecated": "since v3.27.0. Use 'icon' slot."
                         },
                         {
                             "name": "successIcon",
@@ -24231,7 +24419,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display in the toast with success severity."
+                            "description": "Icon to display in the toast with success severity.",
+                            "deprecated": "since v3.27.0. Use 'icon' slot."
                         },
                         {
                             "name": "closeButtonProps",
@@ -24239,7 +24428,8 @@
                             "readonly": false,
                             "type": "ButtonHTMLAttributes",
                             "default": "",
-                            "description": "Uses to pass all properties of the HTMLButtonElement to the close button."
+                            "description": "Uses to pass all properties of the HTMLButtonElement to the close button.",
+                            "deprecated": "since v3.26.0. Use 'pt' property."
                         }
                     ],
                     "methods": []
@@ -24396,7 +24586,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon for the on state."
+                            "description": "Icon for the on state.",
+                            "deprecated": "since v3.27.0. Use 'icon' slot."
                         },
                         {
                             "name": "offIcon",
@@ -24404,7 +24595,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon for the off state."
+                            "description": "Icon for the off state.",
+                            "deprecated": "since v3.27.0. Use 'icon' slot."
                         },
                         {
                             "name": "onLabel",
@@ -24501,7 +24693,20 @@
                     "description": "Defines valid slots in ToggleButton component.",
                     "relatedProp": "",
                     "props": [],
-                    "methods": []
+                    "methods": [
+                        {
+                            "name": "icon",
+                            "parameters": [
+                                {
+                                    "name": "scope",
+                                    "optional": false,
+                                    "type": "{\n  \t <b>value</b>: any, // Current value\n  \t <b>class</b>: any, // Icon style class\n  }"
+                                }
+                            ],
+                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
+                            "description": "Custom icon template."
+                        }
+                    ]
                 },
                 "ToggleButtonEmits": {
                     "description": "Defines valid emits in ToggleButton component.",
@@ -25060,7 +25265,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "Icon to display when tree is loading."
+                            "description": "Icon to display when tree is loading.",
+                            "deprecated": "since v3.27.0. Use 'loadingicon' slot."
                         },
                         {
                             "name": "filter",
@@ -25490,18 +25696,6 @@
                             "returnType": "VNode<RendererNode, RendererElement, Object>[]",
                             "description": "Custom indicator template."
                         },
-                        {
-                            "name": "loadingicon",
-                            "parameters": [],
-                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
-                            "description": "Custom loading icon template."
-                        },
-                        {
-                            "name": "searchicon",
-                            "parameters": [],
-                            "returnType": "VNode<RendererNode, RendererElement, Object>[]",
-                            "description": "Custom search icon template."
-                        },
                         {
                             "name": "itemtogglericon",
                             "parameters": [
@@ -26153,7 +26347,8 @@
                             "readonly": false,
                             "type": "string",
                             "default": "",
-                            "description": "The icon to show while indicating data load is in progress."
+                            "description": "The icon to show while indicating data load is in progress.",
+                            "deprecated": "since v3.27.0. Use 'loadingicon' slot."
                         },
                         {
                             "name": "rowHover",
@@ -26672,7 +26867,8 @@
                             "readonly": false,
                             "type": "InputHTMLAttributes",
                             "default": "",
-                            "description": "Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component."
+                            "description": "Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.",
+                            "deprecated": "since v3.26.0. Use 'pt' property."
                         },
                         {
                             "name": "aria-labelledby",