@progress/kendo-angular-buttons
Version:
Buttons Package for Angular
95 lines (94 loc) • 4.53 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 { ButtonComponent } from '../button/button.component';
import { EventEmitter, QueryList, OnInit, OnDestroy, AfterContentChecked, AfterViewChecked, AfterContentInit, ElementRef, SimpleChanges, Renderer2 } from '@angular/core';
import { LocalizationService } from '@progress/kendo-angular-l10n';
import { ButtonGroupSelection } from '../button/selection-settings';
import { KendoButtonService } from '../button/button.service';
import { PreventableEvent } from '../preventable-event';
import * as i0 from "@angular/core";
/**
* Represents the Kendo UI ButtonGroup component for Angular.
*/
export declare class ButtonGroupComponent implements OnInit, OnDestroy, AfterContentChecked, AfterViewChecked, AfterContentInit {
private service;
private renderer;
private element;
/**
* By default, the ButtonGroup is enabled.
* To disable the whole group of buttons, set its `disabled` attribute to `true`.
*
* To disable a specific button, set its own `disabled` attribute to `true`
* and leave the `disabled` attribute of the ButtonGroup undefined.
* If you define the `disabled` attribute of the ButtonGroup, it will take
* precedence over the `disabled` attributes of the underlying buttons and they will be ignored.
*
* For more information on how to configure the Button, refer to
* its [API documentation]({% slug api_buttons_buttoncomponent %}).
*/
disabled: boolean;
/**
* The selection mode of the ButtonGroup.
* @default 'multiple'
*/
selection: ButtonGroupSelection;
/**
* Sets the width of the ButtonGroup.
* If the width of the ButtonGroup is set:
* - The buttons resize automatically to fill the full width of the group wrapper.
* - The buttons acquire the same width.
*/
width: string;
/**
* Specifies the [`tabIndex`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) of the component.
*/
set tabIndex(value: number);
get tabIndex(): number;
/**
* When this option is set to `true` (default), the component is a single tab-stop,
* and focus is moved through the inner buttons via the arrow keys.
*
* When the option is set to `false`, the inner buttons are part of the natural tab sequence of the page.
*
* @default true
*/
navigable: boolean;
/**
* Fires every time keyboard navigation occurs.
*/
navigate: EventEmitter<PreventableEvent>;
buttons: QueryList<ButtonComponent>;
private _tabIndex;
private currentTabIndex;
private lastFocusedIndex;
private direction;
private subs;
wrapperClasses: boolean;
get disabledClass(): boolean;
get stretchedClass(): boolean;
role: string;
get dir(): string;
get ariaDisabled(): boolean;
get wrapperWidth(): string;
get wrapperTabIndex(): number;
constructor(service: KendoButtonService, localization: LocalizationService, renderer: Renderer2, element: ElementRef);
ngOnInit(): void;
ngOnChanges(changes: SimpleChanges): void;
ngAfterContentInit(): void;
ngAfterViewChecked(): void;
ngOnDestroy(): void;
ngAfterContentChecked(): void;
protected navigateFocus(event: any): void;
protected deactivate(buttons: Array<ButtonComponent>): void;
protected activate(buttons: Array<ButtonComponent>): void;
protected defocus(buttons: Array<ButtonComponent>): void;
protected focus(buttons: Array<ButtonComponent>): void;
private verifySettings;
private isSelectionSingle;
private handleSubs;
private focusHandler;
static ɵfac: i0.ɵɵFactoryDeclaration<ButtonGroupComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<ButtonGroupComponent, "kendo-buttongroup", ["kendoButtonGroup"], { "disabled": { "alias": "disabled"; "required": false; }; "selection": { "alias": "selection"; "required": false; }; "width": { "alias": "width"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "navigable": { "alias": "navigable"; "required": false; }; }, { "navigate": "navigate"; }, ["buttons"], ["[kendoButton]"], true, never>;
}