@progress/kendo-angular-buttons

/**----------------------------------------------------------------------------------------- * Copyright © 2025 Progress Software Corporation. All rights reserved. * Licensed under commercial license. See LICENSE.md in the project root for more information *-------------------------------------------------------------------------------------------*/ import { SimpleChanges, ElementRef, EventEmitter, Renderer2, OnDestroy, NgZone, AfterViewInit } from '@angular/core'; import { KendoButtonService } from './button.service'; import { LocalizationService } from '@progress/kendo-angular-l10n'; import { ButtonFillMode, ButtonRounded, ButtonSize, ButtonThemeColor } from '../common/models'; import { SVGIcon } from '@progress/kendo-svg-icons'; import { ArrowIconSettings } from '../common/models/arrow-settings'; import * as i0 from "@angular/core"; /** * Represents the Kendo UI Button component for Angular. * * As of package v17, the `span[kendoButton]` and `kendo-button` selectors are removed. * Please use the `button[kendoButton]` selector only. */ export declare class ButtonComponent implements OnDestroy, AfterViewInit { renderer: Renderer2; private service; private ngZone; /** * @hidden * @default false * required for DropDownButton arrow icon. */ arrowIcon: boolean | ArrowIconSettings; /** * Provides visual styling that indicates if the Button is active. * * @default false */ toggleable: boolean; /** * Backwards-compatible alias * * @hidden */ get togglable(): boolean; /** * @hidden */ set togglable(value: boolean); /** * Sets the selected state of the Button. * * @default false */ get selected(): boolean; set selected(value: boolean); /** * @hidden */ set tabIndex(index: number); get tabIndex(): number; /** * Defines a URL which is used for an `img` element inside the Button. * The URL can be relative or absolute. If relative, it is evaluated with relation to the web page URL. */ imageUrl: string; /** * Defines a CSS class—or multiple classes separated by spaces— * which are applied to a `span` element inside the Button. Allows the usage of custom icons. */ set iconClass(value: string); get iconClass(): string; /** * Defines the name for an existing font icon in the Kendo UI theme. */ set icon(name: string); get icon(): string; /** * If set to `true`, it disables the Button. * * @default false */ set disabled(disabled: boolean); get disabled(): boolean; /** * The size property specifies the padding of the Button * ([see example]({% slug appearance_button %}#toc-size)). * * @default 'medium' */ set size(size: ButtonSize); get size(): ButtonSize; /** * The rounded property specifies the border radius of the Button * ([see example](slug:appearance_button#toc-roundness)). * * @default 'medium' */ set rounded(rounded: ButtonRounded); get rounded(): ButtonRounded; /** * The fillMode property specifies the background and border styles of the Button * ([see example](slug:appearance_button#toc-fill-mode)). * * @default 'solid' */ set fillMode(fillMode: ButtonFillMode); get fillMode(): ButtonFillMode; /** * The Button allows you to specify predefined theme colors. * The theme color will be applied as a background and border color while also amending the text color accordingly * ([see example](slug:appearance_button#toc-theme-colors)). * * @default 'base' */ set themeColor(themeColor: ButtonThemeColor); get themeColor(): ButtonThemeColor; /** * Defines an SVGIcon to be rendered within the button. */ set svgIcon(icon: SVGIcon); get svgIcon(): SVGIcon; /** * Fires each time the selected state of a toggleable button is changed. * * The event argument is the new selected state (boolean). */ selectedChange: EventEmitter<any>; /** * Fires each time the user clicks the button. */ click: EventEmitter<any>; element: HTMLElement; isDisabled: boolean; caretAltDownIcon: SVGIcon; private _size; private _rounded; private _fillMode; private _themeColor; private _focused; private direction; private _selected; private subs; private _iconClass; private _icon; private _svgIcon; set isFocused(isFocused: boolean); get isFocused(): boolean; get classButton(): boolean; get isToggleable(): boolean; get iconButtonClass(): boolean; get classDisabled(): boolean; get classActive(): boolean; get getDirection(): string; /** * @hidden */ onFocus(): void; /** * @hidden */ onBlur(): void; /** * @hidden */ set primary(value: boolean); /** * @hidden */ set look(value: 'flat' | 'outline' | 'clear' | 'default'); /** * Alias for ElementRef.nativeElement to workaround * ViewChild() selectors that used to return the host element before v11. * * @hidden */ get nativeElement(): any; constructor(element: ElementRef, renderer: Renderer2, service: KendoButtonService, localization: LocalizationService, ngZone: NgZone); ngOnInit(): void; ngOnChanges(change: SimpleChanges): void; ngAfterViewInit(): void; ngOnDestroy(): void; /** * @hidden */ get hasText(): boolean; /** * Focuses the Button component. */ focus(): void; /** * Blurs the Button component. */ blur(): void; /** * @hidden */ setAttribute(attribute: string, value: string): void; /** * @hidden */ removeAttribute(attribute: string): void; /** * @hidden * * Internal setter that triggers selectedChange */ setSelected(value: boolean): void; private toggleAriaPressed; private toggleClass; private _onButtonClick; private handleClasses; private handleThemeColor; static ɵfac: i0.ɵɵFactoryDeclaration<ButtonComponent, [null, null, { optional: true; }, null, null]>; static ɵcmp: i0.ɵɵComponentDeclaration<ButtonComponent, "button[kendoButton]", ["kendoButton"], { "arrowIcon": { "alias": "arrowIcon"; "required": false; }; "toggleable": { "alias": "toggleable"; "required": false; }; "togglable": { "alias": "togglable"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "imageUrl": { "alias": "imageUrl"; "required": false; }; "iconClass": { "alias": "iconClass"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "size": { "alias": "size"; "required": false; }; "rounded": { "alias": "rounded"; "required": false; }; "fillMode": { "alias": "fillMode"; "required": false; }; "themeColor": { "alias": "themeColor"; "required": false; }; "svgIcon": { "alias": "svgIcon"; "required": false; }; "primary": { "alias": "primary"; "required": false; }; "look": { "alias": "look"; "required": false; }; }, { "selectedChange": "selectedChange"; "click": "click"; }, never, ["*"], true, never>; }