@progress/kendo-angular-toolbar 5.0.4 → 6.0.0-dev.202204190531

package/dist/es/toolbar.component.js

@@ -1,648 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* 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, ViewChildren, HostListener, Output, EventEmitter, ViewContainerRef, NgZone, Renderer2, ChangeDetectorRef } from '@angular/core';
-import { PopupService } from '@progress/kendo-angular-popup';
-import { ResizeSensorComponent } from '@progress/kendo-angular-common';
-import { LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
-import { validatePackage } from '@progress/kendo-licensing';
-import { packageMetadata } from './package-metadata';
-import { RefreshService } from './refresh.service';
-import { NavigationService } from './navigation.service';
-import { ToolBarToolComponent } from './tools/toolbar-tool.component';
-import { outerWidth, innerWidth, closest, isPresent } from './util';
-import { Keys } from '@progress/kendo-angular-common';
-import { PreventableEvent } from './common/preventable-event';
-import { Subscription, fromEvent, Subject, merge } from 'rxjs';
-import { takeUntil } from 'rxjs/operators';
-import { filter } from 'rxjs/operators';
-import { isDocumentAvailable } from '@progress/kendo-angular-common';
-import { defaultPopupWidth } from './common/constants';
-var getInitialPopupSettings = function (isRtl) { return ({
-    animate: true,
-    anchorAlign: { horizontal: isRtl ? 'left' : 'right', vertical: 'bottom' },
-    popupAlign: { horizontal: isRtl ? 'left' : 'right', vertical: 'top' }
-}); };
-var ɵ0 = getInitialPopupSettings;
-/**
- * Represents the [Kendo UI ToolBar component for Angular]({% slug overview_toolbar %}).
- */
-var ToolBarComponent = /** @class */ (function () {
-    function ToolBarComponent(localization, popupService, refreshService, navigationService, element, zone, renderer, _cdr) {
-        this.localization = localization;
-        this.popupService = popupService;
-        this.refreshService = refreshService;
-        this.navigationService = navigationService;
-        this.element = element;
-        this.zone = zone;
-        this.renderer = renderer;
-        this._cdr = _cdr;
-        /**
-         * Hides the overflowing tools in a popup.
-         */
-        this.overflow = false;
-        /**
-         * Specifies the [`tabindex`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) of the ToolBar.
-         */
-        this.tabindex = 0;
-        /**
-         * Fires when the overflow popup of the ToolBar is opened.
-         */
-        this.open = new EventEmitter();
-        /**
-         * Fires when the overflow popup of the ToolBar is closed.
-         */
-        this.close = new EventEmitter();
-        this.hostClasses = true;
-        this.cancelRenderedToolsSubscription$ = new Subject();
-        this.subscriptions = new Subscription();
-        validatePackage(packageMetadata);
-        this.direction = localization.rtl ? 'rtl' : 'ltr';
-    }
-    Object.defineProperty(ToolBarComponent.prototype, "resizable", {
-        get: function () {
-            return this.overflow;
-        },
-        /**
-         * @hidden
-         */
-        set: function (value) {
-            this.overflow = value;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ToolBarComponent.prototype, "popupSettings", {
-        get: function () {
-            return this._popupSettings || getInitialPopupSettings(this.localization.rtl);
-        },
-        /**
-         * Configures the popup of the ToolBar drop-down list.
-         *
-         * The available options are:
-         * - `animate: Boolean`—Controls the popup animation. By default, the open and close animations are enabled.
-         * - `popupClass: String`—Specifies a list of CSS classes that are used to style the popup.
-         */
-        set: function (settings) {
-            this._popupSettings = Object.assign({}, getInitialPopupSettings(this.localization.rtl), settings);
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ToolBarComponent.prototype, "tabIndex", {
-        get: function () {
-            return this.tabindex;
-        },
-        /**
-         * @hidden
-         */
-        set: function (tabIndex) {
-            this.tabindex = tabIndex;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ToolBarComponent.prototype, "appendTo", {
-        get: function () {
-            var appendTo = this.popupSettings.appendTo;
-            if (!appendTo || appendTo === 'root') {
-                return undefined;
-            }
-            return appendTo === 'component' ? this.container : appendTo;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ToolBarComponent.prototype, "popupOpen", {
-        get: function () {
-            return this._open;
-        },
-        set: function (open) {
-            if (this.popupOpen === open) {
-                return;
-            }
-            var eventArgs = new PreventableEvent();
-            if (open) {
-                this.open.emit(eventArgs);
-            }
-            else {
-                this.close.emit(eventArgs);
-            }
-            if (eventArgs.isDefaultPrevented()) {
-                return;
-            }
-            this.toggle(open);
-        },
-        enumerable: true,
-        configurable: true
-    });
-    /**
-     * @hidden
-     */
-    ToolBarComponent.prototype.onFocus = function (ev) {
-        this.navigationService.resetNavigation();
-        this.navigationService.focusFirst(ev);
-        // prevents ExpressionChangedAfterItHasBeenCheckedError when tools with popup are opened/closed asynchronously
-        this.element.nativeElement.setAttribute('tabindex', '-1');
-    };
-    /**
-     * @hidden
-     */
-    ToolBarComponent.prototype.onFocusOut = function (event) {
-        var _this = this;
-        // prevents ExpressionChangedAfterItHasBeenCheckedError when tools with popup are opened/closed asynchronously
-        if (closest(event.relatedTarget, function (el) { return el === _this.element.nativeElement; })) {
-            this.element.nativeElement.setAttribute('tabindex', '-1');
-            return;
-        }
-        this.element.nativeElement.setAttribute('tabindex', this.tabindex.toString());
-    };
-    Object.defineProperty(ToolBarComponent.prototype, "getRole", {
-        get: function () {
-            return 'toolbar';
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ToolBarComponent.prototype, "getDir", {
-        get: function () {
-            return this.direction;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ToolBarComponent.prototype, "resizableClass", {
-        get: function () {
-            return this.overflow;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    ToolBarComponent.prototype.ngAfterViewInit = function () {
-        var _this = this;
-        var element = this.element.nativeElement;
-        if (!element.getAttribute('tabindex')) {
-            this.element.nativeElement.setAttribute('tabindex', '0');
-        }
-        this.zone.runOutsideAngular(function () {
-            _this.toolbarKeydownListener = _this.renderer.listen(_this.element.nativeElement, 'keydown', function (ev) {
-                switch (ev.keyCode) {
-                    case Keys.ArrowLeft:
-                        _this.zone.run(function () {
-                            ev.preventDefault();
-                            _this.direction === 'ltr' ? _this.navigationService.focusPrev(ev) : _this.navigationService.focusNext(ev);
-                            // prevents ExpressionChangedAfterItHasBeenCheckedError when tools with popup are opened/closed asynchronously
-                            _this.element.nativeElement.setAttribute('tabindex', '-1');
-                        });
-                        break;
-                    case Keys.ArrowRight:
-                        _this.zone.run(function () {
-                            ev.preventDefault();
-                            _this.direction === 'ltr' ? _this.navigationService.focusNext(ev) : _this.navigationService.focusPrev(ev);
-                            // prevents ExpressionChangedAfterItHasBeenCheckedError when tools with popup are opened/closed asynchronously
-                            _this.element.nativeElement.setAttribute('tabindex', '-1');
-                        });
-                        break;
-                    case Keys.Tab:
-                        _this.zone.run(function () { return _this.navigationService.resetNavigation(); });
-                        break;
-                    case Keys.Escape:
-                        _this.zone.run(function () { return _this.toggle(false); });
-                        break;
-                    default:
-                        break;
-                }
-            });
-        });
-        if (this.overflow) {
-            this.subscriptions.add(merge(this.resizeSensor.resize, this.renderedTools.changes).subscribe(function () { _this.onResize(); }));
-            // because of https://github.com/telerik/kendo-angular-buttons/pull/276
-            // calling onResize twice is the trade-off for removing the manual ChangeDetection
-            // triggering altogether - it ensures correct layout and calculations
-            // when some tools need overflow on initial rendering
-            this.zone.runOutsideAngular(function () { return setTimeout(function () { _this.onResize(); _this.onResize(); }); });
-            this.navigationService.overflowButton = this.overflowButton;
-        }
-        this.navigationService.setRenderedTools(this.renderedTools.toArray());
-        this.subscriptions.add(this.renderedTools.changes.subscribe(function (rts) {
-            return _this.navigationService.setRenderedTools(rts.toArray());
-        }));
-    };
-    ToolBarComponent.prototype.ngOnInit = function () {
-        var _this = this;
-        this.subscriptions.add(this.localization.changes.subscribe(function (_a) {
-            var rtl = _a.rtl;
-            return (_this.direction = rtl ? 'rtl' : 'ltr');
-        }));
-        if (isDocumentAvailable()) {
-            this.zone.runOutsideAngular(function () {
-                return _this.subscriptions.add(fromEvent(document, 'click')
-                    .pipe(filter(function () { return !!_this.popupRef; }), filter(function (ev) { return !_this.popupRef.popup.instance.container.nativeElement.contains(ev.target); }), filter(function (ev) { return !_this.overflowButton.nativeElement.contains(ev.target); }))
-                    .subscribe(function () {
-                    _this.zone.run(function () {
-                        _this.popupOpen = false;
-                    });
-                }));
-            });
-        }
-    };
-    ToolBarComponent.prototype.ngOnChanges = function (changes) {
-        if (changes.tabindex) {
-            // prevents ExpressionChangedAfterItHasBeenCheckedError when tools with popup are opened/closed asynchronously
-            this.element.nativeElement.setAttribute('tabindex', changes.tabindex.currentValue.toString());
-        }
-    };
-    ToolBarComponent.prototype.ngOnDestroy = function () {
-        if (this.popupRef) {
-            this.popupRef.close();
-        }
-        if (this.toolbarKeydownListener) {
-            this.toolbarKeydownListener();
-        }
-        this.cancelRenderedToolsSubscription$.next();
-        this.subscriptions.unsubscribe();
-    };
-    Object.defineProperty(ToolBarComponent.prototype, "moreToolsTitle", {
-        /**
-         * @hidden
-         */
-        get: function () {
-            return this.localization.get('moreToolsTitle');
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ToolBarComponent.prototype, "cdr", {
-        /**
-         * @hidden
-         */
-        get: function () {
-            return this._cdr;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    /**
-     * @hidden
-     */
-    ToolBarComponent.prototype.onRendererClick = function (data) {
-        this.navigationService.click(data);
-        this.element.nativeElement.setAttribute('tabindex', '-1');
-    };
-    /**
-     * @hidden
-     */
-    ToolBarComponent.prototype.showPopup = function () {
-        this.popupOpen = !this.popupOpen;
-        this.navigationService.click({ context: undefined, event: undefined });
-    };
-    /**
-     * Toggles the visibility of the overflow popup.
-     */
-    ToolBarComponent.prototype.toggle = function (popupOpen) {
-        this._open = popupOpen !== undefined ? popupOpen : !this.popupOpen;
-        if (this.popupRef) {
-            this.popupRef.close();
-            this.popupRef = null;
-        }
-        if (this.popupOpen) {
-            this.popupRef = this.popupService.open({
-                anchor: this.overflowButton,
-                anchorAlign: this.popupSettings.anchorAlign,
-                popupAlign: this.popupSettings.popupAlign,
-                content: this.popupTemplate,
-                appendTo: this.appendTo,
-                animate: this.popupSettings.animate,
-                popupClass: this.popupSettings.popupClass,
-                positionMode: 'absolute'
-            });
-            this.setPopupContentDimensions();
-            this.popupRef.popupOpen.subscribe(this.onPopupOpen.bind(this));
-            this.popupRef.popupClose.subscribe(this.onPopupClose.bind(this));
-        }
-    };
-    /**
-     * @hidden
-     */
-    ToolBarComponent.prototype.onResize = function () {
-        if (isDocumentAvailable()) {
-            var containerWidth = innerWidth(this.element.nativeElement) - this.overflowAnchorWidth;
-            this.shrink(containerWidth, this.childrenWidth);
-            this.stretch(containerWidth, this.childrenWidth);
-            this.displayAnchor();
-            this.resizeSensor.acceptSize();
-        }
-    };
-    /**
-     * @hidden
-     */
-    ToolBarComponent.prototype.onPopupOpen = function () {
-        var _this = this;
-        this.zone.runOutsideAngular(function () {
-            _this.overflowKeydownListener = _this.renderer.listen(_this.popupRef.popupElement, 'keydown', function (ev) {
-                switch (ev.keyCode) {
-                    case Keys.ArrowUp:
-                        _this.zone.run(function () {
-                            ev.preventDefault();
-                            _this.navigationService.focusPrev(ev);
-                        });
-                        break;
-                    case Keys.ArrowDown:
-                        _this.zone.run(function () {
-                            ev.preventDefault();
-                            _this.navigationService.focusNext(ev);
-                        });
-                        break;
-                    case Keys.Escape:
-                        _this.zone.run(function () { return _this.toggle(false); });
-                        break;
-                    case Keys.Tab:
-                        _this.zone.run(function () {
-                            _this.toggle(false);
-                            _this.navigationService.resetNavigation();
-                        });
-                        break;
-                    default:
-                        break;
-                }
-            });
-        });
-        this.cancelRenderedToolsSubscription$.next();
-        this.navigationService.moveFocusToPopup();
-        this.navigationService.setRenderedTools(this.overflowRenderedTools.toArray());
-        this.overflowRenderedTools.changes
-            .pipe(takeUntil(this.cancelRenderedToolsSubscription$))
-            .subscribe(function (rts) { return _this.navigationService.setRenderedTools(rts.toArray()); });
-    };
-    /**
-     * @hidden
-     */
-    ToolBarComponent.prototype.onPopupClose = function () {
-        var _this = this;
-        this.cancelRenderedToolsSubscription$.next();
-        this.navigationService.setRenderedTools(this.renderedTools.toArray());
-        this.renderedTools.changes
-            .pipe(takeUntil(this.cancelRenderedToolsSubscription$))
-            .subscribe(function (rts) { return _this.navigationService.setRenderedTools(rts.toArray()); });
-        this.navigationService.moveFocusToToolBar();
-        if (this.overflowKeydownListener) {
-            this.overflowKeydownListener();
-        }
-    };
-    ToolBarComponent.prototype.displayAnchor = function () {
-        var visibility = this.allTools.filter(function (t) { return t.overflows && t.responsive; }).length > 0 ? 'visible' : 'hidden';
-        this.renderer.setStyle(this.overflowButton.nativeElement, 'visibility', visibility);
-    };
-    Object.defineProperty(ToolBarComponent.prototype, "popupWidth", {
-        get: function () {
-            if (!this.popupSettings || !this.popupSettings.width) {
-                return defaultPopupWidth;
-            }
-            return isNaN(this.popupSettings.width) ? this.popupSettings.width : this.popupSettings.width + "px";
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ToolBarComponent.prototype, "popupHeight", {
-        get: function () {
-            if (!this.popupSettings || !this.popupSettings.height) {
-                return;
-            }
-            return isNaN(this.popupSettings.height) ? this.popupSettings.height : this.popupSettings.height + "px";
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ToolBarComponent.prototype, "overflowAnchorWidth", {
-        get: function () {
-            if (!this.overflow) {
-                return 0;
-            }
-            if (!this.cachedOverflowAnchorWidth) {
-                this.cachedOverflowAnchorWidth = outerWidth(this.overflowButton.nativeElement);
-            }
-            return this.cachedOverflowAnchorWidth;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ToolBarComponent.prototype, "gap", {
-        get: function () {
-            if (isPresent(this.cachedGap)) {
-                return this.cachedGap;
-            }
-            var computedGap = getComputedStyle(this.element.nativeElement).gap;
-            this.cachedGap = isPresent(computedGap) ? parseInt(computedGap, 10) : 0;
-            return this.cachedGap;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ToolBarComponent.prototype, "childrenWidth", {
-        get: function () {
-            var _this = this;
-            var width = this.renderedTools.reduce(function (totalWidth, tool) { return tool.width + totalWidth + (tool.isDisplayed() ? _this.gap : 0); }, 0);
-            return Math.ceil(width);
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ToolBarComponent.prototype, "visibleTools", {
-        get: function () {
-            return this.allTools.filter(function (tool) {
-                return tool.overflows === false;
-            });
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ToolBarComponent.prototype, "overflowTools", {
-        get: function () {
-            return this.allTools.filter(function (tool) {
-                return tool.overflows === true;
-            });
-        },
-        enumerable: true,
-        configurable: true
-    });
-    ToolBarComponent.prototype.shrink = function (containerWidth, childrenWidth) {
-        var width;
-        if (containerWidth < childrenWidth) {
-            for (var i = this.visibleTools.length - 1; i >= 0; i--) {
-                if (containerWidth > childrenWidth) {
-                    break;
-                }
-                else {
-                    width = this.hideLastVisibleTool();
-                    childrenWidth -= width;
-                }
-            }
-        }
-    };
-    ToolBarComponent.prototype.stretch = function (containerWidth, childrenWidth) {
-        var width;
-        if (containerWidth > childrenWidth) {
-            for (var i = this.overflowTools.length - 1; i >= 0; i--) {
-                width = this.showFirstHiddenTool(containerWidth, childrenWidth);
-                if (width) {
-                    childrenWidth += width;
-                }
-                else {
-                    break;
-                }
-            }
-        }
-    };
-    ToolBarComponent.prototype.hideLastVisibleTool = function () {
-        var tool = this.visibleTools[this.visibleTools.length - 1];
-        var renderedElement = this.renderedTools.find(function (r) {
-            return r.tool === tool;
-        });
-        var width = renderedElement.width;
-        tool.overflows = true;
-        this.refreshService.refresh(tool);
-        return width;
-    };
-    ToolBarComponent.prototype.showFirstHiddenTool = function (containerWidth, childrenWidth) {
-        var tool = this.overflowTools[0];
-        var renderedElement = this.renderedTools.find(function (r) { return r.tool === tool; });
-        tool.overflows = false;
-        tool.visibility = 'hidden';
-        this.refreshService.refresh(tool);
-        if (containerWidth > childrenWidth + renderedElement.width) {
-            tool.visibility = 'visible';
-            this.refreshService.refresh(tool);
-        }
-        else {
-            tool.overflows = true;
-            this.refreshService.refresh(tool);
-        }
-        return renderedElement.width; // returns 0 if `overflows` is true
-    };
-    ToolBarComponent.prototype.setPopupContentDimensions = function () {
-        var popupContentContainer = this.popupRef.popup.instance.contentContainer.nativeElement;
-        popupContentContainer.style.width = this.popupWidth;
-        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: "\n        <ng-container kendoToolbarLocalizedMessages\n        i18n-moreToolsTitle=\"kendo.toolbar.moreToolsTitle|The title of the **more tools** button in a responsive ToolBar\"\n        moreToolsTitle=\"More tools\"\n        >\n        </ng-container>\n        <ng-container *ngFor=\"let tool of allTools; let index = index\">\n            <kendo-toolbar-renderer\n                #toolbarRenderer\n                (rendererClick)=\"onRendererClick($event)\"\n                [location]=\"'toolbar'\"\n                [resizable]=\"overflow\"\n                [tool]=\"tool\"\n            ></kendo-toolbar-renderer>\n        </ng-container>\n        <button\n            #overflowButton\n            type=\"button\"\n            tabindex=\"-1\"\n            [title]=\"moreToolsTitle\"\n            [attr.aria-label]=\"moreToolsTitle\"\n            *ngIf=\"overflow\"\n            [style.visibility]=\"'hidden'\"\n            class=\"k-overflow-anchor k-button\"\n            (click)=\"showPopup()\"\n        >\n            <span class=\"k-icon k-i-more-vertical\"></span>\n        </button>\n        <ng-template #popupTemplate>\n            <ul class=\"k-overflow-container k-list-container k-reset\">\n                <ng-container *ngFor=\"let tool of allTools; let index = index\">\n                    <li class=\"k-item\">\n                        <kendo-toolbar-renderer\n                            #overflowRenderer\n                            (rendererClick)=\"onRendererClick($event)\"\n                            [location]=\"'overflow'\"\n                            [resizable]=\"overflow\"\n                            [tool]=\"tool\"\n                        ></kendo-toolbar-renderer>\n                    </li>\n                </ng-container>\n            </ul>\n        </ng-template>\n        <ng-container #container></ng-container>\n        <kendo-resize-sensor *ngIf=\"overflow\" #resizeSensor></kendo-resize-sensor>\n    "
-        }),
-        tslib_1.__metadata("design:paramtypes", [LocalizationService,
-            PopupService,
-            RefreshService,
-            NavigationService,
-            ElementRef,
-            NgZone,
-            Renderer2,
-            ChangeDetectorRef])
-    ], ToolBarComponent);
-    return ToolBarComponent;
-}());
-export { ToolBarComponent };
-export { ɵ0 };