Class SplitButton

packages/main/src/SplitButton.ts:92–502

* @class * * ### Overview * * `ui5-split-button` enables users to trigger actions. It is constructed of two separate actions - * default action and arrow action that can be activated by clicking or tapping, or by * pressing certain keyboard keys - `Space` or `Enter` for default action, * and

 * @since 1.1.0
 */
@customElement({
	tag: "ui5-split-button",
	renderer: jsxRenderer,
	styles: SplitButtonCss,
	template: SplitButtonTemplate,
})
/**
 * Fired when the user clicks on the default action.
 * @public
 */
@event("click", {
	bubbles: true,
})

/**
 * Fired when the user clicks on the arrow action.
 * @public
 */
@event("arrow-click", {
	bubbles: true,
})
class SplitButton extends UI5Element {
	eventDetails!: {
		click: void;
		"arrow-click": void;
	}
	/**
	 * Defines the icon to be displayed as graphical element within the component.
	 * The SAP-icons font provides numerous options.
	 *
	 * Example:
	 *
	 * See all available icons in the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).
	 * @default undefined
	 * @public
	 */
	@property()
	icon?: string;

	/**
	 * Defines whether the arrow button should have the active state styles or not.
	 * @default false
	 * @public
	 * @since 1.21.0
	 */
	@property({ type: Boolean })
	activeArrowButton = false;

	/**
	 * Defines the component design.
	 * @default "Default"
	 * @public
	 */
	@property()
	design: `${ButtonDesign}` = "Default";

	/**
	 * Defines whether the component is disabled.