ToolBarSplitButtonComponent

Represents the Kendo UI ToolBar SplitButton for Angular.

Use the ToolBar SplitButton to create a split button with a main button and a drop-down list of actions in the ToolBar.

html

<kendo-toolbar>
     <kendo-toolbar-splitbutton text="Paste" [data]="data">
     </kendo-toolbar-splitbutton>
</kendo-toolbar>

Selector

kendo-toolbar-splitbutton

Export Name

Accessible in templates as #kendoToolBarSplitButtonInstance="kendoToolBarSplitButton"

Inputs

Name	Type	Default	Description
arrowButtonClass	any		Sets the CSS classes for the arrow button that opens the popup. Accepts values supported by ngClass.
arrowButtonIcon	string		Sets the name of the font icon for the arrow button.
arrowButtonSvgIcon	SVGIcon		Sets the SVGIcon for the arrow button.
buttonClass	string		Sets the CSS classes for the main button. Accepts values supported by ngClass.
data	any[]		Sets the data of the SplitButton (see example). Provide the data as an array-like list.
disabled	boolean		When true, disables a SplitButton item.
fillMode	ButtonFillMode	'solid'	Sets the fill mode for the button. The fill mode represents the background and border styles.
icon	string		Sets the icon rendered next to the button text (see example).
iconClass	string		Sets a custom CSS class icon rendered next to the button text.
imageUrl	string		Sets a URL for the image displayed next to the button text.
popupSettings	PopupSettings		Configures the popup of the SplitButton. Accepts a PopupSettings object that allows you to customize the popup behavior and appearance.
showIcon	DisplayMode	'always'	Controls the button icon visibility.
showText	DisplayMode	'always'	Controls the button text visibility.
svgIcon	SVGIcon		Sets the SVGIcon rendered in the main button. Accepts an existing Kendo SVG icon or a custom one.
text	string		Sets the text of the SplitButton (see example).
textField	string	'text'	Sets the text field for the button-list popup.
themeColor	ButtonThemeColor	'base'	Sets the predefined theme color for the button. The theme color applies to the background, border, and text.

Events

Name	Type	Description
buttonClick	EventEmitter<any>	Fires when the user clicks the main button.
close	EventEmitter<PreventableEvent>	Fires when the popup is about to close. This event is preventable. If you cancel the event, the popup stays open.
itemClick	EventEmitter<any>	Fires when the user clicks a drop-down list item. The event data contains the clicked item's data.
open	EventEmitter<PreventableEvent>	Fires when the popup is about to open. This event is preventable. If you cancel the event, the popup stays closed.