UNPKG

@progress/kendo-angular-toolbar

Version:

Kendo UI Angular Toolbar component - a single UI element that organizes buttons and other navigation elements

286 lines (285 loc) 9.54 kB
/**----------------------------------------------------------------------------------------- * Copyright © 2025 Progress Software Corporation. All rights reserved. * Licensed under commercial license. See LICENSE.md in the project root for more information *-------------------------------------------------------------------------------------------*/ import { TemplateRef, ElementRef, QueryList, EventEmitter, ViewContainerRef, NgZone, Renderer2, SimpleChanges, ChangeDetectorRef } from '@angular/core'; import { PopupService, PopupRef } from '@progress/kendo-angular-popup'; import { ResizeSensorComponent } from '@progress/kendo-angular-common'; import { LocalizationService } from '@progress/kendo-angular-l10n'; import { RefreshService } from './refresh.service'; import { NavigationService } from './navigation.service'; import { PopupSettings } from './popup-settings'; import { ToolBarToolComponent } from './tools/toolbar-tool.component'; import { ToolbarSize } from './common/size'; import { PreventableEvent } from './common/preventable-event'; import { Direction } from './direction'; import { RendererClickPayload } from './common/renderer-click'; import { SVGIcon } from '@progress/kendo-svg-icons'; import { ToolbarToolsService } from './tools/tools.service'; import { ToolbarFillMode } from './common/fillmode'; import { OverflowMode } from './common/overflow-mode'; import { ToolbarOverflowSettings } from './common/overflow-settings'; import { ToolbarScrollButtonsPosition } from './common/scroll-buttons'; import { ScrollService } from './scroll.service'; import { DisplayMode } from './display-mode'; import * as i0 from "@angular/core"; /** * Represents the [Kendo UI ToolBar component for Angular]({% slug overview_toolbar %}). */ export declare class ToolBarComponent { localization: LocalizationService; private popupService; refreshService: RefreshService; private navigationService; element: ElementRef; private zone; private renderer; private _cdr; private toolsService; private scrollService; get overflowClass(): string; /** * Configures the overflow mode. Used to specify how tools will be rendered when the total size of all tools is greater than the size of the Toolbar container. * @default false */ set overflow(overflow: boolean | OverflowMode | ToolbarOverflowSettings); get overflow(): boolean | OverflowMode | ToolbarOverflowSettings; get showScrollButtons(): boolean; /** * @hidden */ set resizable(value: boolean); get resizable(): boolean; /** * @hidden */ get hasScrollButtons(): { visible: boolean; position: ToolbarScrollButtonsPosition; }; /** * @hidden */ get isScrollMode(): boolean; /** * @hidden */ get showMenu(): boolean; /** * @hidden */ get overflowEnabled(): boolean; /** * Configures the popup of the ToolBar overflow button ([see example](slug:responsive_toolbar#customizing-the-popup)). * * The available options are: * - `animate: Boolean`&mdash;Controls the popup animation. By default, the open and close animations are enabled. * - `popupClass: String`&mdash;Specifies a list of CSS classes that are used to style the popup. */ set popupSettings(settings: PopupSettings); get popupSettings(): PopupSettings; /** * The fillMode property specifies the background and border styles of the Toolbar * ([see example](slug:appearance_toolbar#toc-fill-mode)). * * @default 'solid' */ set fillMode(fillMode: ToolbarFillMode); get fillMode(): ToolbarFillMode; /** * Specifies the [`tabindex`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) of the ToolBar. */ tabindex: number; /** * Specifies the padding of all Toolbar elements. * * The possible values are: * * `small` * * `medium` (default) * * `large` * * `none` */ set size(size: ToolbarSize); get size(): ToolbarSize; /** * @hidden */ set tabIndex(tabIndex: number); get tabIndex(): number; /** * Specifies the icons visibility for all tools in the ToolBar. * This can be overridden by the `showIcon` property of each tool. */ set showIcon(value: DisplayMode | boolean); /** * Specifies the text visibility for all tools in the ToolBar. * This can be overridden by the `showText` property of each tool. */ set showText(value: DisplayMode | boolean); /** * Fires when the overflow popup of the ToolBar is opened. */ open: EventEmitter<PreventableEvent>; /** * Fires when the overflow popup of the ToolBar is closed. */ close: EventEmitter<PreventableEvent>; allTools: QueryList<ToolBarToolComponent>; overflowButton: ElementRef; popupTemplate: TemplateRef<any>; popupSectionTemplate: TemplateRef<any>; scrollContainer: ElementRef; resizeSensor: ResizeSensorComponent; container: ViewContainerRef; prevScrollButton: ElementRef; nextScrollButton: ElementRef; startButtonGroup: ElementRef; endButtonGroup: ElementRef; scrollSeparator: ElementRef; popupRef: PopupRef; direction: Direction; get appendTo(): ViewContainerRef; set popupOpen(open: boolean); get popupOpen(): boolean; /** * @hidden */ prevButtonIcon: SVGIcon; /** * @hidden */ nextButtonIcon: SVGIcon; /** * @hidden */ propertyChange: EventEmitter<{ property: string; value: any; }>; hostClass: boolean; get scrollableClass(): boolean; get sectionClass(): boolean; private _overflow; private _popupSettings; private cachedOverflowAnchorWidth; private _open; private toolbarKeydownListener; private overflowKeydownListener; private sectionKeydownListener; private cancelRenderedToolsSubscription$; private cachedGap; private _size; private _fillMode; private _showText; private _showIcon; private overflowButtonClickedTime; private showAutoButtons; private scrollButtonStateChangeSub; private scrollContainerScrollSub; /** * @hidden */ get normalizedOverflow(): ToolbarOverflowSettings; private subscriptions; private popupSubs; private focusedByPointer; /** * @hidden */ onFocus(ev: any): void; /** * @hidden */ onFocusOut(event: any): void; role: string; get getDir(): string; get resizableClass(): boolean; constructor(localization: LocalizationService, popupService: PopupService, refreshService: RefreshService, navigationService: NavigationService, element: ElementRef, zone: NgZone, renderer: Renderer2, _cdr: ChangeDetectorRef, toolsService: ToolbarToolsService, scrollService: ScrollService); ngAfterContentInit(): void; ngAfterViewInit(): void; ngOnInit(): void; ngOnChanges(changes: SimpleChanges): void; ngOnDestroy(): void; /** * @hidden */ showOverflowSeparator: boolean; /** * @hidden */ get moreToolsTitle(): string; /** * @hidden */ get cdr(): ChangeDetectorRef; /** * @hidden */ get sectionSizeClass(): string; /** * @hidden */ getScrollButtonTitle(buttonType: string): string; /** * @hidden */ scrollTools(dir: string): void; /** * @hidden */ onRendererClick(data: RendererClickPayload): void; /** * @hidden */ overflowButtonIcon(iconType: string): any; /** * @hidden */ showPopup(): void; /** * Toggles the visibility of the overflow popup. */ toggle(popupOpen?: boolean): void; /** * @hidden */ onResize(): void; /** * @hidden */ onPopupOpen(): void; /** * @hidden */ onPopupClose(): void; /** * @hidden */ overflowBtnId: string; /** * @hidden */ popupId: string; private displayAnchor; private get popupWidth(); private get popupHeight(); private get overflowAnchorWidth(); private get gap(); private get childrenWidth(); get visibleTools(): ToolBarToolComponent[]; get overflowTools(): ToolBarToolComponent[]; private shrink; private stretch; private hideLastVisibleTool; private showFirstHiddenTool; private setPopupContentDimensions; private destroyPopup; private handleClasses; private normalizePopupClasses; private setScrollableOverlayClasses; private handleScrollModeUpdates; private removeSubscriptions; private normalizeDisplayValue; static ɵfac: i0.ɵɵFactoryDeclaration<ToolBarComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<ToolBarComponent, "kendo-toolbar", ["kendoToolBar"], { "overflow": { "alias": "overflow"; "required": false; }; "resizable": { "alias": "resizable"; "required": false; }; "popupSettings": { "alias": "popupSettings"; "required": false; }; "fillMode": { "alias": "fillMode"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "size": { "alias": "size"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "showIcon": { "alias": "showIcon"; "required": false; }; "showText": { "alias": "showText"; "required": false; }; }, { "open": "open"; "close": "close"; }, ["allTools"], never, true, never>; }