Fixed #4729 - SplitButton: new buttoncontent and item slots

components/lib/splitbutton/SplitButton.d.ts

@@ -12,7 +12,7 @@ import { ComponentHooks } from '../basecomponent';
 import { ButtonPassThroughOptions } from '../button';
 import { MenuItem } from '../menuitem';
 import { PassThroughOptions } from '../passthrough';
-import { TieredMenuPassThroughOptions } from '../tieredmenu';
+import { TieredMenuPassThroughOptions, TieredMenuRouterBindProps } from '../tieredmenu';
 import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
 
 export declare type SplitButtonPassThroughOptionType = SplitButtonPassThroughAttributes | ((options: SplitButtonPassThroughMethodOptions) => SplitButtonPassThroughAttributes | string) | string | null | undefined;
@@ -205,7 +205,11 @@ export interface SplitButtonSlots {
      */
     default(): VNode[];
     /**
-     * Custom menu button icon template.
+     * Command button part of the content can easily be customized with the button content slot.
+     */
+    buttoncontent(): VNode[];
+    /**
+     * Custom button icon template.
      * @param {Object} scope - icon slot's params.
      */
     icon(scope: {
@@ -238,6 +242,28 @@ export interface SplitButtonSlots {
          */
         class: any;
     }): VNode[];
+    /**
+     * Custom content for each menu item.
+     * @param {Object} scope - item slot's params.
+     */
+    item(scope: {
+        /**
+         * Menuitem instance
+         */
+        item: MenuItem;
+        /**
+         * Label property of the menuitem
+         */
+        label: string | ((...args: any) => string) | undefined;
+        /**
+         * Binding properties of the menuitem
+         */
+        props: TieredMenuRouterBindProps;
+        /**
+         * Whether or not there is a submenu
+         */
+        hasSubmenu: boolean;
+    }): VNode[];
 }
 
 /**

components/lib/splitbutton/SplitButton.vue

@@ -22,6 +22,9 @@
                         <span :class="[icon, slotProps.class]" v-bind="ptm('button')['icon']" data-pc-section="buttonicon" />
                     </slot>
                 </template>
+                <template #default>
+                    <slot name="buttoncontent"></slot>
+                </template>
             </PVSButton>
         </slot>
         <PVSButton
@@ -53,6 +56,9 @@
             <template v-if="$slots.menuitemicon" #itemicon="slotProps">
                 <slot name="menuitemicon" :item="slotProps.item" :class="slotProps.class" />
             </template>
+            <template v-if="$slots.item" #item="slotProps">
+                <slot name="item" :item="slotProps.item" :hasSubmenu="slotProps.hasSubmenu" :label="slotProps.label" :props="slotProps.props"></slot>
+            </template>
         </PVSMenu>
     </div>
 </template>