Merge pull request #4339 from primefaces/issue-4200

SplitButton: Slot icon updates

api-generator/components/splitbutton.js

@@ -137,6 +137,10 @@ const SplitButtonSlots = [
     {
         name: 'menubuttonicon',
         description: 'Custom menu button icon template.'
+    },
+    {
+        name: 'menuitemicon',
+        description: 'Custom menu item icon template.'
     }
 ];
 

components/lib/splitbutton/SplitButton.d.ts

@@ -205,6 +205,20 @@ export interface SplitButtonSlots {
          */
         class: string;
     }): VNode[];
+    /**
+     * Custom menu item icon template.
+     * @param {Object} scope - menubuttonicon slot's params.
+     */
+    menuitemicon(scope: {
+        /**
+         * Menuitem instance
+         */
+        item: MenuItem;
+        /**
+         * Style class of the item icon element.
+         */
+        class: any;
+    }): VNode[];
 }
 
 /**

components/lib/splitbutton/SplitButton.vue

@@ -17,7 +17,7 @@
                 :unstyled="unstyled"
                 data-pc-section="button"
             >
-                <template v-if="icon" #icon="slotProps">
+                <template #icon="slotProps">
                     <slot name="icon" :class="slotProps.class">
                         <span :class="[icon, slotProps.class]" v-bind="ptm('button')['icon']" data-pc-section="buttonicon" />
                     </slot>
@@ -49,7 +49,11 @@
                 </slot>
             </template>
         </PVSButton>
-        <PVSMenu ref="menu" :id="ariaId + '_overlay'" :model="model" :popup="true" :autoZIndex="autoZIndex" :baseZIndex="baseZIndex" :appendTo="appendTo" :unstyled="unstyled" :pt="ptm('menu')" />
+        <PVSMenu ref="menu" :id="ariaId + '_overlay'" :model="model" :popup="true" :autoZIndex="autoZIndex" :baseZIndex="baseZIndex" :appendTo="appendTo" :unstyled="unstyled" :pt="ptm('menu')">
+            <template v-if="$slots.menuitemicon" #itemicon="slotProps">
+                <slot name="menuitemicon" :item="slotProps.item" :class="slotProps.class" />
+            </template>
+        </PVSMenu>
     </div>
 </template>