@progress/kendo-angular-toolbar 5.0.1 → 6.0.0-next.202203091208

package/{dist/es2015 → esm2015}/toolbar.component.js

@@ -2,10 +2,7 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import * as tslib_1 from "tslib";
-import { Component, HostBinding, ViewChild, TemplateRef, ElementRef, QueryList, ContentChildren, Input, ChangeDetectorRef, ViewChildren, HostListener, Output, EventEmitter, ViewContainerRef, NgZone, Renderer2 } from '@angular/core';
-import { PopupService } from '@progress/kendo-angular-popup';
-import { ResizeSensorComponent } from '@progress/kendo-angular-common';
+import { Component, HostBinding, ViewChild, ContentChildren, Input, ViewChildren, HostListener, Output, EventEmitter, ViewContainerRef } from '@angular/core';
 import { LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
 import { validatePackage } from '@progress/kendo-licensing';
 import { packageMetadata } from './package-metadata';
@@ -20,16 +17,24 @@ import { takeUntil } from 'rxjs/operators';
 import { filter } from 'rxjs/operators';
 import { isDocumentAvailable } from '@progress/kendo-angular-common';
 import { defaultPopupWidth } from './common/constants';
+import * as i0 from "@angular/core";
+import * as i1 from "@progress/kendo-angular-l10n";
+import * as i2 from "@progress/kendo-angular-popup";
+import * as i3 from "./refresh.service";
+import * as i4 from "./navigation.service";
+import * as i5 from "./renderer.component";
+import * as i6 from "@progress/kendo-angular-common";
+import * as i7 from "./localization/localized-toolbar-messages.directive";
+import * as i8 from "@angular/common";
 const getInitialPopupSettings = (isRtl) => ({
     animate: true,
     anchorAlign: { horizontal: isRtl ? 'left' : 'right', vertical: 'bottom' },
     popupAlign: { horizontal: isRtl ? 'left' : 'right', vertical: 'top' }
 });
-const ɵ0 = getInitialPopupSettings;
 /**
  * Represents the [Kendo UI ToolBar component for Angular]({% slug overview_toolbar %}).
  */
-let ToolBarComponent = class ToolBarComponent {
+export class ToolBarComponent {
     constructor(localization, popupService, refreshService, navigationService, element, cdr, zone, renderer) {
         this.localization = localization;
         this.popupService = popupService;
@@ -428,112 +433,77 @@ let ToolBarComponent = class ToolBarComponent {
         popupContentContainer.style.height = this.popupHeight;
         popupContentContainer.style.overflow = 'auto';
     }
-};
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Boolean)
-], ToolBarComponent.prototype, "overflow", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Boolean),
-    tslib_1.__metadata("design:paramtypes", [Boolean])
-], ToolBarComponent.prototype, "resizable", null);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Object),
-    tslib_1.__metadata("design:paramtypes", [Object])
-], ToolBarComponent.prototype, "popupSettings", null);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Number)
-], ToolBarComponent.prototype, "tabindex", void 0);
-tslib_1.__decorate([
-    Input('tabIndex'),
-    tslib_1.__metadata("design:type", Number),
-    tslib_1.__metadata("design:paramtypes", [Number])
-], ToolBarComponent.prototype, "tabIndex", null);
-tslib_1.__decorate([
-    Output(),
-    tslib_1.__metadata("design:type", EventEmitter)
-], ToolBarComponent.prototype, "open", void 0);
-tslib_1.__decorate([
-    Output(),
-    tslib_1.__metadata("design:type", EventEmitter)
-], ToolBarComponent.prototype, "close", void 0);
-tslib_1.__decorate([
-    ContentChildren(ToolBarToolComponent),
-    tslib_1.__metadata("design:type", QueryList)
-], ToolBarComponent.prototype, "allTools", void 0);
-tslib_1.__decorate([
-    ViewChild('overflowButton', { static: false }),
-    tslib_1.__metadata("design:type", ElementRef)
-], ToolBarComponent.prototype, "overflowButton", void 0);
-tslib_1.__decorate([
-    ViewChild('popupTemplate', { static: true }),
-    tslib_1.__metadata("design:type", TemplateRef)
-], ToolBarComponent.prototype, "popupTemplate", void 0);
-tslib_1.__decorate([
-    ViewChild('resizeSensor', { static: false }),
-    tslib_1.__metadata("design:type", ResizeSensorComponent)
-], ToolBarComponent.prototype, "resizeSensor", void 0);
-tslib_1.__decorate([
-    ViewChild('container', { read: ViewContainerRef, static: true }),
-    tslib_1.__metadata("design:type", ViewContainerRef)
-], ToolBarComponent.prototype, "container", void 0);
-tslib_1.__decorate([
-    ViewChildren('toolbarRenderer'),
-    tslib_1.__metadata("design:type", QueryList)
-], ToolBarComponent.prototype, "renderedTools", void 0);
-tslib_1.__decorate([
-    ViewChildren('overflowRenderer'),
-    tslib_1.__metadata("design:type", QueryList)
-], ToolBarComponent.prototype, "overflowRenderedTools", void 0);
-tslib_1.__decorate([
-    HostBinding('class.k-widget'),
-    HostBinding('class.k-toolbar'),
-    tslib_1.__metadata("design:type", Boolean)
-], ToolBarComponent.prototype, "hostClasses", void 0);
-tslib_1.__decorate([
-    HostListener('focus', ['$event']),
-    tslib_1.__metadata("design:type", Function),
-    tslib_1.__metadata("design:paramtypes", [Object]),
-    tslib_1.__metadata("design:returntype", void 0)
-], ToolBarComponent.prototype, "onFocus", null);
-tslib_1.__decorate([
-    HostListener('focusout', ['$event']),
-    tslib_1.__metadata("design:type", Function),
-    tslib_1.__metadata("design:paramtypes", [Object]),
-    tslib_1.__metadata("design:returntype", void 0)
-], ToolBarComponent.prototype, "onFocusOut", null);
-tslib_1.__decorate([
-    HostBinding('attr.role'),
-    tslib_1.__metadata("design:type", String),
-    tslib_1.__metadata("design:paramtypes", [])
-], ToolBarComponent.prototype, "getRole", null);
-tslib_1.__decorate([
-    HostBinding('attr.dir'),
-    tslib_1.__metadata("design:type", String),
-    tslib_1.__metadata("design:paramtypes", [])
-], ToolBarComponent.prototype, "getDir", null);
-tslib_1.__decorate([
-    HostBinding('class.k-toolbar-resizable'),
-    tslib_1.__metadata("design:type", Boolean),
-    tslib_1.__metadata("design:paramtypes", [])
-], ToolBarComponent.prototype, "resizableClass", null);
-ToolBarComponent = tslib_1.__decorate([
-    Component({
-        exportAs: 'kendoToolBar',
-        providers: [
-            RefreshService,
-            NavigationService,
-            LocalizationService,
-            {
-                provide: L10N_PREFIX,
-                useValue: 'kendo.toolbar'
-            }
-        ],
-        selector: 'kendo-toolbar',
-        template: `
+}
+ToolBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ToolBarComponent, deps: [{ token: i1.LocalizationService }, { token: i2.PopupService }, { token: i3.RefreshService }, { token: i4.NavigationService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+ToolBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ToolBarComponent, selector: "kendo-toolbar", inputs: { overflow: "overflow", resizable: "resizable", popupSettings: "popupSettings", tabindex: "tabindex", tabIndex: "tabIndex" }, outputs: { open: "open", close: "close" }, host: { listeners: { "focus": "onFocus($event)", "focusout": "onFocusOut($event)" }, properties: { "class.k-widget": "this.hostClasses", "class.k-toolbar": "this.hostClasses", "attr.role": "this.getRole", "attr.dir": "this.getDir", "class.k-toolbar-resizable": "this.resizableClass" } }, providers: [
+        RefreshService,
+        NavigationService,
+        LocalizationService,
+        {
+            provide: L10N_PREFIX,
+            useValue: 'kendo.toolbar'
+        }
+    ], queries: [{ propertyName: "allTools", predicate: ToolBarToolComponent }], viewQueries: [{ propertyName: "overflowButton", first: true, predicate: ["overflowButton"], descendants: true }, { propertyName: "popupTemplate", first: true, predicate: ["popupTemplate"], descendants: true, static: true }, { propertyName: "resizeSensor", first: true, predicate: ["resizeSensor"], descendants: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "renderedTools", predicate: ["toolbarRenderer"], descendants: true }, { propertyName: "overflowRenderedTools", predicate: ["overflowRenderer"], descendants: true }], exportAs: ["kendoToolBar"], usesOnChanges: true, ngImport: i0, template: `
+        <ng-container kendoToolbarLocalizedMessages
+        i18n-moreToolsTitle="kendo.toolbar.moreToolsTitle|The title of the **more tools** button in a responsive ToolBar"
+        moreToolsTitle="More tools"
+        >
+        </ng-container>
+        <ng-container *ngFor="let tool of allTools; let index = index">
+            <kendo-toolbar-renderer
+                #toolbarRenderer
+                (rendererClick)="onRendererClick($event)"
+                [location]="'toolbar'"
+                [resizable]="overflow"
+                [tool]="tool"
+            ></kendo-toolbar-renderer>
+        </ng-container>
+        <button
+            #overflowButton
+            type="button"
+            tabindex="-1"
+            [title]="moreToolsTitle"
+            [attr.aria-label]="moreToolsTitle"
+            *ngIf="overflow"
+            [style.visibility]="displayAnchor"
+            class="k-overflow-anchor k-button"
+            (click)="showPopup()"
+        >
+            <span class="k-icon k-i-more-vertical"></span>
+        </button>
+        <ng-template #popupTemplate>
+            <ul class="k-overflow-container k-list-container k-reset">
+                <ng-container *ngFor="let tool of allTools; let index = index">
+                    <li class="k-item">
+                        <kendo-toolbar-renderer
+                            #overflowRenderer
+                            (rendererClick)="onRendererClick($event)"
+                            [location]="'overflow'"
+                            [resizable]="overflow"
+                            [tool]="tool"
+                        ></kendo-toolbar-renderer>
+                    </li>
+                </ng-container>
+            </ul>
+        </ng-template>
+        <ng-container #container></ng-container>
+        <kendo-resize-sensor *ngIf="overflow" [rateLimit]="1000" #resizeSensor></kendo-resize-sensor>
+    `, isInline: true, components: [{ type: i5.ToolBarRendererComponent, selector: "kendo-toolbar-renderer", inputs: ["tool", "location", "resizable"], outputs: ["rendererClick"], exportAs: ["kendoToolBarRenderer"] }, { type: i6.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }], directives: [{ type: i7.LocalizedToolbarMessagesDirective, selector: "[kendoToolbarLocalizedMessages]" }, { type: i8.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ToolBarComponent, decorators: [{
+            type: Component,
+            args: [{
+                    exportAs: 'kendoToolBar',
+                    providers: [
+                        RefreshService,
+                        NavigationService,
+                        LocalizationService,
+                        {
+                            provide: L10N_PREFIX,
+                            useValue: 'kendo.toolbar'
+                        }
+                    ],
+                    selector: 'kendo-toolbar',
+                    template: `
         <ng-container kendoToolbarLocalizedMessages
         i18n-moreToolsTitle="kendo.toolbar.moreToolsTitle|The title of the **more tools** button in a responsive ToolBar"
         moreToolsTitle="More tools"
@@ -579,15 +549,62 @@ ToolBarComponent = tslib_1.__decorate([
         <ng-container #container></ng-container>
         <kendo-resize-sensor *ngIf="overflow" [rateLimit]="1000" #resizeSensor></kendo-resize-sensor>
     `
-    }),
-    tslib_1.__metadata("design:paramtypes", [LocalizationService,
-        PopupService,
-        RefreshService,
-        NavigationService,
-        ElementRef,
-        ChangeDetectorRef,
-        NgZone,
-        Renderer2])
-], ToolBarComponent);
-export { ToolBarComponent };
-export { ɵ0 };
+                }]
+        }], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i2.PopupService }, { type: i3.RefreshService }, { type: i4.NavigationService }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i0.Renderer2 }]; }, propDecorators: { overflow: [{
+                type: Input
+            }], resizable: [{
+                type: Input
+            }], popupSettings: [{
+                type: Input
+            }], tabindex: [{
+                type: Input
+            }], tabIndex: [{
+                type: Input,
+                args: ['tabIndex']
+            }], open: [{
+                type: Output
+            }], close: [{
+                type: Output
+            }], allTools: [{
+                type: ContentChildren,
+                args: [ToolBarToolComponent]
+            }], overflowButton: [{
+                type: ViewChild,
+                args: ['overflowButton', { static: false }]
+            }], popupTemplate: [{
+                type: ViewChild,
+                args: ['popupTemplate', { static: true }]
+            }], resizeSensor: [{
+                type: ViewChild,
+                args: ['resizeSensor', { static: false }]
+            }], container: [{
+                type: ViewChild,
+                args: ['container', { read: ViewContainerRef, static: true }]
+            }], renderedTools: [{
+                type: ViewChildren,
+                args: ['toolbarRenderer']
+            }], overflowRenderedTools: [{
+                type: ViewChildren,
+                args: ['overflowRenderer']
+            }], hostClasses: [{
+                type: HostBinding,
+                args: ['class.k-widget']
+            }, {
+                type: HostBinding,
+                args: ['class.k-toolbar']
+            }], onFocus: [{
+                type: HostListener,
+                args: ['focus', ['$event']]
+            }], onFocusOut: [{
+                type: HostListener,
+                args: ['focusout', ['$event']]
+            }], getRole: [{
+                type: HostBinding,
+                args: ['attr.role']
+            }], getDir: [{
+                type: HostBinding,
+                args: ['attr.dir']
+            }], resizableClass: [{
+                type: HostBinding,
+                args: ['class.k-toolbar-resizable']
+            }] } });

package/{dist/es2015 → esm2015}/toolbar.module.js

@@ -2,7 +2,6 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import * as tslib_1 from "tslib";
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { ButtonsModule } from '@progress/kendo-angular-buttons';
@@ -19,6 +18,7 @@ import { ToolBarRendererComponent } from './renderer.component';
 import { ToolBarButtonListComponent } from './tools/toolbar-buttonlist.component';
 import { LocalizedToolbarMessagesDirective } from './localization/localized-toolbar-messages.directive';
 import { ToolbarCustomMessagesComponent } from './localization/custom-messages.component';
+import * as i0 from "@angular/core";
 const TOOLBAR_TOOLS = [
     ToolBarToolComponent,
     ToolBarButtonComponent,
@@ -45,13 +45,29 @@ const TOOLBAR_COMMON = [
  * - `ToolBarSplitButtonComponent`—The SplitButton Tool component class.
  * - `ToolBarSeparatorComponent`—The Separator Tool component class.
  */
-let ToolBarModule = class ToolBarModule {
-};
-ToolBarModule = tslib_1.__decorate([
-    NgModule({
-        declarations: [ToolBarComponent, TOOLBAR_TOOLS, TOOLBAR_COMMON],
-        exports: [ToolBarComponent, TOOLBAR_TOOLS, ToolbarCustomMessagesComponent, LocalizedToolbarMessagesDirective],
-        imports: [CommonModule, ButtonsModule, PopupModule, ResizeSensorModule]
-    })
-], ToolBarModule);
-export { ToolBarModule };
+export class ToolBarModule {
+}
+ToolBarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ToolBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ToolBarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ToolBarModule, declarations: [ToolBarComponent, ToolBarToolComponent,
+        ToolBarButtonComponent,
+        ToolBarButtonGroupComponent,
+        ToolBarDropDownButtonComponent,
+        ToolBarSplitButtonComponent,
+        ToolBarSeparatorComponent, ToolBarRendererComponent,
+        ToolBarButtonListComponent,
+        ToolbarCustomMessagesComponent,
+        LocalizedToolbarMessagesDirective], imports: [CommonModule, ButtonsModule, PopupModule, ResizeSensorModule], exports: [ToolBarComponent, ToolBarToolComponent,
+        ToolBarButtonComponent,
+        ToolBarButtonGroupComponent,
+        ToolBarDropDownButtonComponent,
+        ToolBarSplitButtonComponent,
+        ToolBarSeparatorComponent, ToolbarCustomMessagesComponent, LocalizedToolbarMessagesDirective] });
+ToolBarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ToolBarModule, imports: [[CommonModule, ButtonsModule, PopupModule, ResizeSensorModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ToolBarModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [ToolBarComponent, TOOLBAR_TOOLS, TOOLBAR_COMMON],
+                    exports: [ToolBarComponent, TOOLBAR_TOOLS, ToolbarCustomMessagesComponent, LocalizedToolbarMessagesDirective],
+                    imports: [CommonModule, ButtonsModule, PopupModule, ResizeSensorModule]
+                }]
+        }] });

package/{dist/es2015 → esm2015}/tools/toolbar-button.component.js

@@ -2,15 +2,16 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import * as tslib_1 from "tslib";
-var ToolBarButtonComponent_1;
-import { Component, TemplateRef, forwardRef, ViewChild, Input, Output, EventEmitter, ElementRef } from '@angular/core';
+import { Component, forwardRef, ViewChild, Input, Output, EventEmitter, ElementRef } from '@angular/core';
 import { ToolBarToolComponent } from './toolbar-tool.component';
 import { getValueForLocation } from '../util';
+import * as i0 from "@angular/core";
+import * as i1 from "@progress/kendo-angular-buttons";
+import * as i2 from "@angular/common";
 /**
  * Represents the [Kendo UI ToolBar Button tool for Angular]({% slug controltypes_toolbar %}#toc-buttons).
  */
-let ToolBarButtonComponent = ToolBarButtonComponent_1 = class ToolBarButtonComponent extends ToolBarToolComponent {
+export class ToolBarButtonComponent extends ToolBarToolComponent {
     constructor() {
         super();
         // showText and showIcon showIcon should be declared first
@@ -170,112 +171,67 @@ let ToolBarButtonComponent = ToolBarButtonComponent_1 = class ToolBarButtonCompo
     getButton() {
         return (this.overflows ? this.overflowButtonElement : this.toolbarButtonElement).nativeElement;
     }
-};
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", String)
-], ToolBarButtonComponent.prototype, "showText", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", String)
-], ToolBarButtonComponent.prototype, "showIcon", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", String),
-    tslib_1.__metadata("design:paramtypes", [String])
-], ToolBarButtonComponent.prototype, "text", null);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Object)
-], ToolBarButtonComponent.prototype, "style", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Object)
-], ToolBarButtonComponent.prototype, "className", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", String)
-], ToolBarButtonComponent.prototype, "title", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Boolean)
-], ToolBarButtonComponent.prototype, "disabled", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Boolean)
-], ToolBarButtonComponent.prototype, "toggleable", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", String),
-    tslib_1.__metadata("design:paramtypes", [String])
-], ToolBarButtonComponent.prototype, "look", null);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Boolean),
-    tslib_1.__metadata("design:paramtypes", [Boolean])
-], ToolBarButtonComponent.prototype, "togglable", null);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Boolean)
-], ToolBarButtonComponent.prototype, "selected", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", String)
-], ToolBarButtonComponent.prototype, "fillMode", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", String)
-], ToolBarButtonComponent.prototype, "themeColor", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", String),
-    tslib_1.__metadata("design:paramtypes", [String])
-], ToolBarButtonComponent.prototype, "icon", null);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", String),
-    tslib_1.__metadata("design:paramtypes", [String])
-], ToolBarButtonComponent.prototype, "iconClass", null);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", String),
-    tslib_1.__metadata("design:paramtypes", [String])
-], ToolBarButtonComponent.prototype, "imageUrl", null);
-tslib_1.__decorate([
-    Output(),
-    tslib_1.__metadata("design:type", EventEmitter)
-], ToolBarButtonComponent.prototype, "click", void 0);
-tslib_1.__decorate([
-    Output(),
-    tslib_1.__metadata("design:type", EventEmitter)
-], ToolBarButtonComponent.prototype, "pointerdown", void 0);
-tslib_1.__decorate([
-    Output(),
-    tslib_1.__metadata("design:type", EventEmitter)
-], ToolBarButtonComponent.prototype, "selectedChange", void 0);
-tslib_1.__decorate([
-    ViewChild('toolbarTemplate', { static: true }),
-    tslib_1.__metadata("design:type", TemplateRef)
-], ToolBarButtonComponent.prototype, "toolbarTemplate", void 0);
-tslib_1.__decorate([
-    ViewChild('popupTemplate', { static: true }),
-    tslib_1.__metadata("design:type", TemplateRef)
-], ToolBarButtonComponent.prototype, "popupTemplate", void 0);
-tslib_1.__decorate([
-    ViewChild('toolbarButton', { read: ElementRef, static: false }),
-    tslib_1.__metadata("design:type", ElementRef)
-], ToolBarButtonComponent.prototype, "toolbarButtonElement", void 0);
-tslib_1.__decorate([
-    ViewChild('overflowButton', { read: ElementRef, static: false }),
-    tslib_1.__metadata("design:type", ElementRef)
-], ToolBarButtonComponent.prototype, "overflowButtonElement", void 0);
-ToolBarButtonComponent = ToolBarButtonComponent_1 = tslib_1.__decorate([
-    Component({
-        exportAs: 'kendoToolBarButton',
-        // tslint:disable-next-line:no-forward-ref
-        providers: [{ provide: ToolBarToolComponent, useExisting: forwardRef(() => ToolBarButtonComponent_1) }],
-        selector: 'kendo-toolbar-button',
-        template: `
+}
+ToolBarButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ToolBarButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ToolBarButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ToolBarButtonComponent, selector: "kendo-toolbar-button", inputs: { showText: "showText", showIcon: "showIcon", text: "text", style: "style", className: "className", title: "title", disabled: "disabled", toggleable: "toggleable", look: "look", togglable: "togglable", selected: "selected", fillMode: "fillMode", themeColor: "themeColor", icon: "icon", iconClass: "iconClass", imageUrl: "imageUrl" }, outputs: { click: "click", pointerdown: "pointerdown", selectedChange: "selectedChange" }, providers: [{ provide: ToolBarToolComponent, useExisting: forwardRef(() => ToolBarButtonComponent) }], viewQueries: [{ propertyName: "toolbarTemplate", first: true, predicate: ["toolbarTemplate"], descendants: true, static: true }, { propertyName: "popupTemplate", first: true, predicate: ["popupTemplate"], descendants: true, static: true }, { propertyName: "toolbarButtonElement", first: true, predicate: ["toolbarButton"], descendants: true, read: ElementRef }, { propertyName: "overflowButtonElement", first: true, predicate: ["overflowButton"], descendants: true, read: ElementRef }], exportAs: ["kendoToolBarButton"], usesInheritance: true, ngImport: i0, template: `
+        <ng-template #toolbarTemplate>
+            <button
+                #toolbarButton
+                [tabindex]="tabIndex"
+                type="button"
+                kendoButton
+                [ngStyle]="style"
+                [ngClass]="className"
+                [attr.title]="title"
+                [disabled]="disabled"
+                [toggleable]="toggleable"
+                [fillMode]="fillMode"
+                [themeColor]="fillMode ? themeColor : null"
+                [selected]="selected"
+                [icon]="toolbarOptions.icon"
+                [iconClass]="toolbarOptions.iconClass"
+                [imageUrl]="toolbarOptions.imageUrl"
+                (click)="click.emit($event)"
+                (pointerdown)="pointerdown.emit($event)"
+                (selectedChange)="selectedChange.emit($event)"
+                (blur)="onBlur()"
+            >
+                {{ toolbarOptions.text }}
+            </button>
+        </ng-template>
+        <ng-template #popupTemplate>
+            <button
+                #overflowButton
+                tabindex="-1"
+                type="button"
+                kendoButton
+                class="k-overflow-button"
+                [ngStyle]="style"
+                [ngClass]="className"
+                [attr.title]="title"
+                [disabled]="disabled"
+                [toggleable]="toggleable"
+                [fillMode]="fillMode"
+                [themeColor]="fillMode ? themeColor : null"
+                [selected]="selected"
+                [icon]="overflowOptions.icon"
+                [iconClass]="overflowOptions.iconClass"
+                [imageUrl]="overflowOptions.imageUrl"
+                (click)="click.emit($event)"
+                (selectedChange)="selectedChange.emit($event)"
+            >
+                {{ overflowOptions.text }}
+            </button>
+        </ng-template>
+    `, isInline: true, directives: [{ type: i1.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "shape", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ToolBarButtonComponent, decorators: [{
+            type: Component,
+            args: [{
+                    exportAs: 'kendoToolBarButton',
+                    // eslint-disable-next-line no-forward-ref
+                    providers: [{ provide: ToolBarToolComponent, useExisting: forwardRef(() => ToolBarButtonComponent) }],
+                    selector: 'kendo-toolbar-button',
+                    template: `
         <ng-template #toolbarTemplate>
             <button
                 #toolbarButton
@@ -326,7 +282,55 @@ ToolBarButtonComponent = ToolBarButtonComponent_1 = tslib_1.__decorate([
             </button>
         </ng-template>
     `
-    }),
-    tslib_1.__metadata("design:paramtypes", [])
-], ToolBarButtonComponent);
-export { ToolBarButtonComponent };
+                }]
+        }], ctorParameters: function () { return []; }, propDecorators: { showText: [{
+                type: Input
+            }], showIcon: [{
+                type: Input
+            }], text: [{
+                type: Input
+            }], style: [{
+                type: Input
+            }], className: [{
+                type: Input
+            }], title: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], toggleable: [{
+                type: Input
+            }], look: [{
+                type: Input
+            }], togglable: [{
+                type: Input
+            }], selected: [{
+                type: Input
+            }], fillMode: [{
+                type: Input
+            }], themeColor: [{
+                type: Input
+            }], icon: [{
+                type: Input
+            }], iconClass: [{
+                type: Input
+            }], imageUrl: [{
+                type: Input
+            }], click: [{
+                type: Output
+            }], pointerdown: [{
+                type: Output
+            }], selectedChange: [{
+                type: Output
+            }], toolbarTemplate: [{
+                type: ViewChild,
+                args: ['toolbarTemplate', { static: true }]
+            }], popupTemplate: [{
+                type: ViewChild,
+                args: ['popupTemplate', { static: true }]
+            }], toolbarButtonElement: [{
+                type: ViewChild,
+                args: ['toolbarButton', { read: ElementRef, static: false }]
+            }], overflowButtonElement: [{
+                type: ViewChild,
+                args: ['overflowButton', { read: ElementRef, static: false }]
+            }] } });