@progress/kendo-angular-buttons
Version:
Buttons Package for Angular
85 lines (84 loc) • 2.42 kB
TypeScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { SVGIcon } from "@progress/kendo-svg-icons";
/**
* Represents the item models of the Kendo UI DropDownButton and SplitButton components. These are the interface fields that the items use.
*
* @example
*
* ```ts-preview
* _@Component({
* selector: 'my-app',
* template: `
* <kendo-splitbutton [data]="listItems">SplitButton</kendo-splitbutton>
* `
* })
* class AppComponent {
* public listItems: ListItemModel[] = [{
* text: 'item1',
* icon: 'arrow-rotate-cw',
* click: (dataItem: any) => {
* //action
* }
* }, {
* text: 'item2',
* iconClass: 'test icon class',
* click: (dataItem: any) => {
* //action
* }
* }, {
* text: 'item3',
* imageUrl: 'https://demos.telerik.com/kendo-ui/content/web/toolbar/upload.png',
* click: (dataItem: any) => {
* //action
* }
* }, {
* text: 'item4',
* disabled: true,
* click: (dataItem: any) => {
* //action
* }
* }]
* }
* ```
*/
export interface ListItemModel {
/**
* Sets the text of the item.
*/
text?: string;
/**
* Defines an icon to be rendered next to the title.
*/
icon?: string;
/**
* Defines an [SVGIcon](slug:api_icons_svgicon) to be rendered next to the title.
*/
svgIcon?: SVGIcon;
/**
* Defines an icon with a custom CSS class to be rendered next to the title.
*/
iconClass?: string;
/**
* Defines the location of an image to be displayed next to the title.
*/
imageUrl?: string;
/**
* Defines the value of the image element `alt` attribute.
*/
imageAlt?: string;
/**
* When set to `true`, disables a button list item.
*/
disabled?: boolean;
/**
* The CSS classes that will be rendered on the item element. Supports the type of values that are supported by ngClass.
*/
cssClass?: any;
/**
* An event handler that is emitted when an item is clicked.
*/
click?: (dataItem?: any) => void;
}