@progress/kendo-angular-spreadsheet 17.0.0-develop.21 → 17.0.0-develop.22

package/fesm2015/progress-kendo-angular-spreadsheet.mjs

@@ -1,4610 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2024 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import * as i0 from '@angular/core';
-import { Injectable, EventEmitter, Output, Inject, Optional, Component, HostBinding, Input, Directive, ElementRef, ViewChild, ViewChildren, HostListener, InjectionToken, forwardRef, ViewContainerRef, NgModule } from '@angular/core';
-import { NgFor, NgIf, NgStyle, NgSwitch, NgSwitchCase } from '@angular/common';
-import { Subject, Subscription } from 'rxjs';
-import { take, map } from 'rxjs/operators';
-import { validatePackage } from '@progress/kendo-licensing';
-import { SpreadsheetWidget } from '@progress/kendo-spreadsheet-common';
-import * as i1$3 from '@progress/kendo-angular-intl';
-import { localeData } from '@progress/kendo-angular-intl';
-import { formulaFxIcon, trashIcon, copyIcon, pencilIcon, eyeSlashIcon, arrowRightIcon, arrowLeftIcon, alignCenterIcon, alignJustifyIcon, alignLeftIcon, alignRightIcon, alignTopIcon, alignMiddleIcon, alignBottomIcon, dropletIcon, boldIcon, foregroundColorIcon, italicIcon, arrowRotateCwIcon, underlineIcon, arrowRotateCcwIcon, textWrapIcon, tableColumnInsertLeftIcon, tableColumnInsertRightIcon, tableRowInsertAboveIcon, tableRowInsertBelowIcon, tableRowDeleteIcon, tableColumnDeleteIcon, bordersNoneIcon, folderOpenIcon, downloadIcon, customFormatIcon, fontSizeIcon, fontFamilyIcon, cellsMergeIcon, cellsMergeHorizontallyIcon, cellsMergeVerticallyIcon, tableUnmergeIcon, linkIcon, fontGrowIcon, fontShrinkIcon, decimalDecreaseIcon, decimalIncreaseIcon, cutIcon, clipboardIcon, eyeIcon, plusIcon, menuIcon, caretAltDownIcon, caretAltLeftIcon, caretAltRightIcon } from '@progress/kendo-svg-icons';
-import * as i2 from '@progress/kendo-angular-l10n';
-import { LocalizationService, L10N_PREFIX, RTL, ComponentMessages } from '@progress/kendo-angular-l10n';
-import * as i1 from '@progress/kendo-angular-popup';
-import { PopupService } from '@progress/kendo-angular-popup';
-import { MenuComponent, MenuItemComponent, ContextMenuComponent } from '@progress/kendo-angular-menu';
-import { EventsOutsideAngularDirective, isDocumentAvailable, isPresent, Keys, hasObservers, shouldShowValidationUI, WatermarkOverlayComponent, ResizeBatchService } from '@progress/kendo-angular-common';
-import { IconWrapperComponent, IconsService } from '@progress/kendo-angular-icons';
-import * as i1$2 from '@progress/kendo-angular-toolbar';
-import { ToolBarToolComponent, ToolBarComponent, ToolBarButtonComponent, ToolBarButtonGroupComponent, ToolBarSeparatorComponent, ToolBarDropDownButtonComponent } from '@progress/kendo-angular-toolbar';
-import * as i1$1 from '@progress/kendo-angular-dialog';
-import { DialogContentBase, DialogContainerService, DialogService, WindowService, WindowContainerService } from '@progress/kendo-angular-dialog';
-import { TextBoxComponent, ColorPickerComponent } from '@progress/kendo-angular-inputs';
-import { LabelComponent } from '@progress/kendo-angular-label';
-import { ButtonComponent, DropDownButtonComponent } from '@progress/kendo-angular-buttons';
-import { TabStripComponent, TabStripTabComponent, TabTemplateDirective } from '@progress/kendo-angular-layout';
-import { ComboBoxComponent, DropDownListComponent, ItemTemplateDirective } from '@progress/kendo-angular-dropdowns';
-import { saveAs } from '@progress/kendo-file-saver';
-import { Workbook } from '@progress/kendo-ooxml';
-
-/**
- * @hidden
- */
-const packageMetadata = {
-    name: '@progress/kendo-angular-spreadsheet',
-    productName: 'Kendo UI for Angular',
-    productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1729874289,
-    version: '17.0.0-develop.21',
-    licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning',
-};
-
-let spreadsheetCounter = 0;
-/**
- * @hidden
- */
-class SpreadsheetService {
-    constructor() {
-        this.sheetsChanged = new Subject();
-        this.onSheetsBarFocus = new Subject();
-        this.activeSheetChanged = new Subject();
-        this.selectionChanged = new Subject();
-        spreadsheetCounter++;
-    }
-    set currentActiveSheet(value) {
-        this._currentActiveSheet = value;
-    }
-    get currentActiveSheet() {
-        return this._currentActiveSheet;
-    }
-    get activeSheet() {
-        var _a;
-        return (_a = this.spreadsheet.activeSheet()) === null || _a === void 0 ? void 0 : _a.name();
-    }
-    get formulaListId() {
-        return `k-spreadsheet-${spreadsheetCounter}-formula-list`;
-    }
-    get tablistId() {
-        return `k-spreadsheet-${spreadsheetCounter}-tablist`;
-    }
-    notifySheetsChange(actionType, sheetInfo) {
-        const sheets = this.spreadsheet.sheets();
-        this.sheetsChanged.next({ sheets, sheet: sheetInfo, actionType });
-    }
-}
-SpreadsheetService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-SpreadsheetService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return []; } });
-
-/**
- * @hidden
- */
-class SpreadsheetToolsService {
-    constructor(ngZone) {
-        this.ngZone = ngZone;
-        this.stateChange = new EventEmitter();
-        this.toolsFunctions = [
-            'bold',
-            'italic',
-            'underline',
-            'fontFamily',
-            'fontSize',
-            'color',
-            'background',
-            'textAlign',
-            'verticalAlign',
-            'wrap',
-            'gridLines',
-            'format'
-        ];
-        this._toolsState = {};
-        this.updateTools = (e) => {
-            this.ngZone.run(() => {
-                const state = {};
-                this.toolsFunctions.forEach(tool => {
-                    if (typeof e.range[tool] === 'function') {
-                        state[tool] = e.range[tool]();
-                    }
-                    else if (tool === 'gridLines') {
-                        state[tool] = e.range.sheet().showGridLines();
-                    }
-                });
-                if (this.toolsFunctions.some(k => state[k] !== this.toolsState[k])) {
-                    this.toolsState = state;
-                    this.stateChange.emit(state);
-                }
-            });
-        };
-    }
-    set toolsState(state) {
-        this._toolsState = state;
-    }
-    get toolsState() {
-        return this._toolsState;
-    }
-}
-SpreadsheetToolsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetToolsService, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
-SpreadsheetToolsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetToolsService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetToolsService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: i0.NgZone }]; }, propDecorators: { stateChange: [{
-                type: Output
-            }] } });
-
-/**
- * @hidden
- */
-class SpreadsheetLocalizationService extends LocalizationService {
-    constructor(prefix, messageService, _rtl) {
-        super(prefix, messageService, _rtl);
-    }
-}
-SpreadsheetLocalizationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetLocalizationService, deps: [{ token: L10N_PREFIX }, { token: i2.MessageService, optional: true }, { token: RTL, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-SpreadsheetLocalizationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetLocalizationService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetLocalizationService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () {
-        return [{ type: undefined, decorators: [{
-                        type: Inject,
-                        args: [L10N_PREFIX]
-                    }] }, { type: i2.MessageService, decorators: [{
-                        type: Optional
-                    }] }, { type: undefined, decorators: [{
-                        type: Optional
-                    }, {
-                        type: Inject,
-                        args: [RTL]
-                    }] }];
-    } });
-
-/**
- * @hidden
- */
-const mapToSheetDescriptor = (sheetsArray) => {
-    return sheetsArray.map((sheet) => {
-        return {
-            activeCell: sheet.activeCell(),
-            columns: sheet._columns,
-            defaultCellStyle: sheet._defaultCellStyle,
-            drawings: sheet._drawings,
-            frozenColumns: sheet.frozenColumns,
-            frozenRows: sheet.frozenRows,
-            hyperlinks: sheet._hyperlinks,
-            mergedCells: sheet.mergedCells,
-            name: sheet.name(),
-            rows: sheet._rows,
-            selection: sheet.selection(),
-            showGridLines: sheet.showGridLines,
-            state: sheet.state()
-        };
-    });
-};
-/**
- * @hidden
- */
-const replaceMessagePlaceholder = (message, name, value) => message.replace(new RegExp(`\{\\s*${name}\\s*\}`, 'g'), value);
-
-/**
- * @hidden
- */
-class FormulaListComponent {
-    constructor(element, spreadsheetService) {
-        this.element = element;
-        this.spreadsheetService = spreadsheetService;
-        this.id = this.spreadsheetService.formulaListId;
-        this.data = [];
-        this.formulaFxIcon = formulaFxIcon;
-        this.handleMouseDown = (ev) => {
-            ev.preventDefault();
-        };
-    }
-}
-FormulaListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FormulaListComponent, deps: [{ token: i0.ElementRef }, { token: SpreadsheetService }], target: i0.ɵɵFactoryTarget.Component });
-FormulaListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: FormulaListComponent, isStandalone: true, selector: "kendo-spreadsheet-formula-list", inputs: { maxHeight: "maxHeight", data: "data", itemClick: "itemClick" }, host: { properties: { "attr.id": "this.id" } }, ngImport: i0, template: `
-        <ul #ulRef
-            class="k-spreadsheet-formula-list k-list-ul k-list-md k-group k-reset"
-            role="menu"
-            [style.overflowY]="'auto'"
-            [style.maxHeight]="maxHeight"
-            [kendoEventsOutsideAngular]="{mousedown: handleMouseDown}">
-                <li *ngFor="let item of data"
-                    (click)="itemClick(item.text)"
-                    class="k-list-item"
-                    role="menuitem">
-                    <kendo-icon-wrapper
-                        [svgIcon]="formulaFxIcon"
-                        name="formula-fx"
-                    ></kendo-icon-wrapper>
-                    <span className="k-list-item-text">{{item.text}}</span>
-                </li>
-        </ul>
-    `, isInline: true, dependencies: [{ kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FormulaListComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'kendo-spreadsheet-formula-list',
-                    template: `
-        <ul #ulRef
-            class="k-spreadsheet-formula-list k-list-ul k-list-md k-group k-reset"
-            role="menu"
-            [style.overflowY]="'auto'"
-            [style.maxHeight]="maxHeight"
-            [kendoEventsOutsideAngular]="{mousedown: handleMouseDown}">
-                <li *ngFor="let item of data"
-                    (click)="itemClick(item.text)"
-                    class="k-list-item"
-                    role="menuitem">
-                    <kendo-icon-wrapper
-                        [svgIcon]="formulaFxIcon"
-                        name="formula-fx"
-                    ></kendo-icon-wrapper>
-                    <span className="k-list-item-text">{{item.text}}</span>
-                </li>
-        </ul>
-    `,
-                    standalone: true,
-                    imports: [EventsOutsideAngularDirective, NgFor, IconWrapperComponent]
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: SpreadsheetService }]; }, propDecorators: { id: [{
-                type: HostBinding,
-                args: ['attr.id']
-            }], maxHeight: [{
-                type: Input
-            }], data: [{
-                type: Input
-            }], itemClick: [{
-                type: Input
-            }] } });
-
-/**
- * @hidden
- */
-class FormulaInputDirective {
-    constructor(element, popupService, spreadsheetService, localization) {
-        this.element = element;
-        this.popupService = popupService;
-        this.spreadsheetService = spreadsheetService;
-        this.localization = localization;
-        this.hostClasses = true;
-        this.role = 'combobox';
-        this.ariaHasPopup = 'menu';
-        this.ariaExpanded = 'false';
-        this.focusedItem = () => { var _a; return (_a = this.list) === null || _a === void 0 ? void 0 : _a.element.nativeElement.querySelector('.k-focus'); };
-        this.unfocus = () => {
-            const focused = this.focusedItem();
-            if (focused) {
-                focused.classList.remove('k-focus');
-            }
-        };
-        this.focusNext = (dir) => {
-            var _a;
-            const element = (_a = this.list) === null || _a === void 0 ? void 0 : _a.element.nativeElement.firstElementChild;
-            const items = Array.from((element && element.children) || []);
-            const focused = this.focusedItem();
-            let next;
-            if (focused) {
-                const index = items.indexOf(focused);
-                focused.classList.remove('k-focus');
-                next = items[index + dir] ? items[index + dir] : (dir === 1 ? items[0] : items[items.length - 1]);
-            }
-            else {
-                next = (dir === 1 ? items[0] : items[items.length - 1]);
-            }
-            if (next) {
-                next.classList.add('k-focus');
-                const { offsetTop, offsetHeight, parentElement } = next;
-                if (dir > 0) {
-                    if (offsetTop + offsetHeight >= parentElement.offsetHeight + parentElement.scrollTop) {
-                        parentElement.scrollTop = Math.min(parentElement.scrollTop + offsetHeight, parentElement.scrollHeight - parentElement.offsetHeight);
-                    }
-                    if (next === items[0]) {
-                        next.scrollIntoView();
-                    }
-                }
-                else {
-                    if (offsetTop <= parentElement.scrollTop) {
-                        parentElement.scrollTop = Math.max(parentElement.scrollTop - offsetHeight, 0);
-                    }
-                    if (next === items[items.length - 1]) {
-                        next.scrollIntoView();
-                    }
-                }
-            }
-        };
-    }
-    get title() {
-        return this.localization.get('formulaInput');
-    }
-    get ariaControls() {
-        return this.ariaExpanded === 'true' ? this.spreadsheetService.formulaListId : null;
-    }
-    get listElement() {
-        var _a;
-        return (_a = this.list) === null || _a === void 0 ? void 0 : _a.element.nativeElement.firstElementChild;
-    }
-    get current() {
-        var _a;
-        return {
-            element: this.element.nativeElement,
-            list: {
-                element: (_a = this.list) === null || _a === void 0 ? void 0 : _a.element.nativeElement,
-                data: (d) => {
-                    if (d) {
-                        this.data = d;
-                        this.list && (this.list.data = d);
-                    }
-                    else {
-                        return this.data;
-                    }
-                },
-                itemClick: (handler) => {
-                    this.handler = handler;
-                },
-                value: () => { return {}; },
-                focus: () => {
-                    var _a;
-                    const items = Array.from(((_a = this.listElement) === null || _a === void 0 ? void 0 : _a.children) || []);
-                    return items.indexOf(this.focusedItem());
-                },
-                focusNext: () => this.focusNext(1),
-                focusPrev: () => this.focusNext(-1),
-                focusFirst: () => {
-                    const list = this.listElement;
-                    if (list && list.children.item(0)) {
-                        this.unfocus();
-                        list.children.item(0).classList.add('k-focus');
-                    }
-                },
-                focusLast: () => {
-                    const list = this.listElement;
-                    if (list && list.children.length) {
-                        this.unfocus();
-                        list.children.item(list.children.length - 1).classList.add('k-focus');
-                    }
-                },
-            },
-            popup: {
-                open: () => {
-                    this.popupRef && this.popupRef.close();
-                    this.popupRef = null;
-                    this.popupRef = this.popupService.open({
-                        anchor: this.element,
-                        content: FormulaListComponent,
-                        animate: { direction: 'down', duration: 100 }
-                    });
-                    const list = this.popupRef.content.instance;
-                    this.list = list;
-                    list.data = this.data;
-                    list.itemClick = this.handler;
-                    list.maxHeight = this.formulaListMaxHeight;
-                    this.ariaExpanded = 'true';
-                },
-                close: () => {
-                    this.popupRef && this.popupRef.close();
-                    this.popupRef = null;
-                    this.ariaExpanded = 'false';
-                },
-                position: () => {
-                    // contentKey++;
-                },
-                visible: () => {
-                    return this.popupRef;
-                }
-            }
-        };
-    }
-}
-FormulaInputDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FormulaInputDirective, deps: [{ token: i0.ElementRef }, { token: i1.PopupService }, { token: SpreadsheetService }, { token: SpreadsheetLocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
-FormulaInputDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: FormulaInputDirective, isStandalone: true, selector: "[kendoSpreadsheetFormulaInput]", inputs: { formulaListMaxHeight: "formulaListMaxHeight" }, host: { properties: { "class.k-spreadsheet-formula-input": "this.hostClasses", "attr.title": "this.title", "attr.role": "this.role", "attr.aria-haspopup": "this.ariaHasPopup", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-controls": "this.ariaControls" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FormulaInputDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoSpreadsheetFormulaInput]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.PopupService }, { type: SpreadsheetService }, { type: SpreadsheetLocalizationService }]; }, propDecorators: { hostClasses: [{
-                type: HostBinding,
-                args: ['class.k-spreadsheet-formula-input']
-            }], title: [{
-                type: HostBinding,
-                args: ['attr.title']
-            }], role: [{
-                type: HostBinding,
-                args: ['attr.role']
-            }], ariaHasPopup: [{
-                type: HostBinding,
-                args: ['attr.aria-haspopup']
-            }], ariaExpanded: [{
-                type: HostBinding,
-                args: ['attr.aria-expanded']
-            }], ariaControls: [{
-                type: HostBinding,
-                args: ['attr.aria-controls']
-            }], formulaListMaxHeight: [{
-                type: Input
-            }] } });
-
-/**
- * @hidden
- */
-const getSheetActions = (items, item) => {
-    const visibleItems = items.filter(item => item.state === 'visible');
-    const itemIndex = item ? visibleItems.findIndex(i => i === item) : 0;
-    return [{
-            messageKey: 'sheetDelete',
-            icon: 'trash',
-            svgIcon: trashIcon,
-            commandName: 'delete',
-            dialogButton: 'dialogDelete',
-            disabled: visibleItems.length === 1
-        }, {
-            messageKey: 'sheetDuplicate',
-            icon: 'copy',
-            svgIcon: copyIcon,
-            commandName: 'copy'
-        }, {
-            messageKey: 'sheetRename',
-            icon: 'pencil',
-            svgIcon: pencilIcon,
-            commandName: 'rename',
-            dialogButton: 'dialogRename'
-        }, {
-            messageKey: 'sheetHide',
-            icon: 'eye-slash',
-            svgIcon: eyeSlashIcon,
-            commandName: 'hide',
-            disabled: visibleItems.length === 1
-        }, {
-            messageKey: 'sheetMoveRight',
-            icon: 'arrow-right',
-            svgIcon: arrowRightIcon,
-            commandName: 'move',
-            disabled: visibleItems.length === 1 || itemIndex === visibleItems.length - 1
-        }, {
-            messageKey: 'sheetMoveLeft',
-            icon: 'arrow-left',
-            svgIcon: arrowLeftIcon,
-            commandName: 'move',
-            disabled: visibleItems.length === 1 || itemIndex === 0
-        }];
-};
-
-/**
- * @hidden
- */
-class ErrorHandlingService {
-    constructor(spreadsheetService, localization, dialogService) {
-        this.spreadsheetService = spreadsheetService;
-        this.localization = localization;
-        this.dialogService = dialogService;
-        this.sheetsChanged = new Subject();
-        this.activeSheetChanged = new Subject();
-        this.selectionChanged = new Subject();
-    }
-    set currentActiveSheet(value) {
-        this._currentActiveSheet = value;
-    }
-    get currentActiveSheet() {
-        return this._currentActiveSheet;
-    }
-    get activeSheet() {
-        var _a;
-        return (_a = this.spreadsheet.activeSheet()) === null || _a === void 0 ? void 0 : _a.name();
-    }
-    notifySheetsChange(actionType, sheetInfo) {
-        const sheets = this.spreadsheet.sheets();
-        this.sheetsChanged.next({ sheets, sheet: sheetInfo, actionType });
-    }
-    handleErrorMessage(messageData) {
-        this.openDialog(messageData);
-    }
-    openDialog(messageData) {
-        var _a;
-        let dialogContent;
-        if (messageData.name === 'message') {
-            const localizationMsg = this.messageFor('invalidNameError');
-            let inputValue = messageData.text.split(' ').pop();
-            if (messageData.text.startsWith('Parse')) {
-                inputValue = inputValue.substring(0, inputValue.length - 1);
-            }
-            dialogContent = replaceMessagePlaceholder(localizationMsg, 'inputValue', inputValue);
-        }
-        else {
-            dialogContent = this.messageFor(messageData.name);
-        }
-        const dialogSettings = {
-            appendTo: this.spreadsheetService.dialogContainer,
-            title: this.messageFor('dialogError'),
-            content: dialogContent,
-            actions: [{
-                    text: this.messageFor('dialogOk'),
-                    themeColor: 'primary'
-                }],
-            width: 400,
-            actionsLayout: 'start'
-        };
-        const dialog = this.dialogService.open(dialogSettings);
-        const dialogInstance = (_a = dialog.dialog) === null || _a === void 0 ? void 0 : _a.instance;
-        dialogInstance.action.pipe(take(1)).subscribe((event) => {
-            if (event.text === this.messageFor('dialogOk')) {
-                messageData.close();
-            }
-        });
-        dialogInstance.close.pipe(take(1)).subscribe(() => {
-            messageData.close();
-        });
-    }
-    messageFor(text) {
-        return this.localization.get(text);
-    }
-}
-ErrorHandlingService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ErrorHandlingService, deps: [{ token: SpreadsheetService }, { token: i2.LocalizationService }, { token: i1$1.DialogService }], target: i0.ɵɵFactoryTarget.Injectable });
-ErrorHandlingService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ErrorHandlingService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ErrorHandlingService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: SpreadsheetService }, { type: i2.LocalizationService }, { type: i1$1.DialogService }]; } });
-
-/**
- * @hidden
- */
-const commandIcons = {
-    alignCenter: 'align-center',
-    alignJustify: 'align-justify',
-    alignLeft: 'align-left',
-    alignRight: 'align-right',
-    alignTop: 'align-top',
-    alignMiddle: 'align-middle',
-    alignBottom: 'align-bottom',
-    align: 'align-left',
-    alignHorizontal: 'align-left',
-    alignVertical: 'align-middle',
-    background: 'droplet',
-    bold: 'bold',
-    color: 'foreground-color',
-    italic: 'italic',
-    redo: 'arrow-rotate-cw',
-    underline: 'underline',
-    undo: 'arrow-rotate-ccw',
-    wrap: 'text-wrap',
-    addColumnLeft: 'table-column-insert-left',
-    addColumnRight: 'table-column-insert-right',
-    addRowAbove: 'table-row-insert-above',
-    addRowBelow: 'table-row-insert-below',
-    deleteRow: 'table-row-delete',
-    deleteColumn: 'table-column-delete',
-    gridLines: 'borders-none',
-    folderOpen: 'folder-open',
-    download: 'download',
-    format: 'custom-format',
-    fontSize: 'font-size',
-    fontFamily: 'font-family',
-    merge: 'cells-merge',
-    mergeAll: 'cells-merge',
-    mergeHorizontally: 'cells-merge-horizontally',
-    mergeVertically: 'cells-merge-vertically',
-    unmerge: 'table-unmerge',
-    insertLink: 'hyperlink',
-    increaseFontSize: 'font-grow',
-    decreaseFontSize: 'font-shrink',
-    increaseDecimal: 'decimal-increase',
-    decreaseDecimal: 'decimal-decrease',
-    copy: 'copy',
-    cut: 'cut',
-    paste: 'clipboard',
-    hideRow: 'eye-slash',
-    unhideRow: 'eye',
-    hideColumn: 'eye-slash',
-    unhideColumn: 'eye'
-};
-/**
- * @hidden
- */
-const commandSVGIcons = {
-    alignCenter: alignCenterIcon,
-    alignJustify: alignJustifyIcon,
-    alignLeft: alignLeftIcon,
-    alignRight: alignRightIcon,
-    alignTop: alignTopIcon,
-    alignMiddle: alignMiddleIcon,
-    alignBottom: alignBottomIcon,
-    align: alignLeftIcon,
-    alignHorizontal: alignLeftIcon,
-    alignVertical: alignMiddleIcon,
-    background: dropletIcon,
-    bold: boldIcon,
-    color: foregroundColorIcon,
-    italic: italicIcon,
-    redo: arrowRotateCwIcon,
-    underline: underlineIcon,
-    undo: arrowRotateCcwIcon,
-    wrap: textWrapIcon,
-    addColumnLeft: tableColumnInsertLeftIcon,
-    addColumnRight: tableColumnInsertRightIcon,
-    addRowAbove: tableRowInsertAboveIcon,
-    addRowBelow: tableRowInsertBelowIcon,
-    deleteRow: tableRowDeleteIcon,
-    deleteColumn: tableColumnDeleteIcon,
-    gridLines: bordersNoneIcon,
-    folderOpen: folderOpenIcon,
-    download: downloadIcon,
-    format: customFormatIcon,
-    fontSize: fontSizeIcon,
-    fontFamily: fontFamilyIcon,
-    merge: cellsMergeIcon,
-    mergeAll: cellsMergeIcon,
-    mergeHorizontally: cellsMergeHorizontallyIcon,
-    mergeVertically: cellsMergeVerticallyIcon,
-    unmerge: tableUnmergeIcon,
-    insertLink: linkIcon,
-    increaseFontSize: fontGrowIcon,
-    decreaseFontSize: fontShrinkIcon,
-    decreaseDecimal: decimalDecreaseIcon,
-    increaseDecimal: decimalIncreaseIcon,
-    copy: copyIcon,
-    cut: cutIcon,
-    paste: clipboardIcon,
-    hideRow: eyeSlashIcon,
-    unhideRow: eyeIcon,
-    hideColumn: eyeSlashIcon,
-    unhideColumn: eyeIcon
-};
-
-/**
- * @hidden
- */
-class InsertLinkDialogComponent extends DialogContentBase {
-    constructor(dialog) {
-        super(dialog);
-        this.dialog = dialog;
-        this.urlLink = '';
-    }
-    setData(args) {
-        this.urlLink = args.link;
-    }
-}
-InsertLinkDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: InsertLinkDialogComponent, deps: [{ token: i1$1.DialogRef }], target: i0.ɵɵFactoryTarget.Component });
-InsertLinkDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: InsertLinkDialogComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `
-    <form class="k-form k-form-md" method="dialog">
-        <div class="k-form-field">
-            <kendo-label [for]="textbox" text="URL"></kendo-label>
-                <kendo-textbox #textbox
-                    [(value)]="urlLink">
-                </kendo-textbox>
-        </div>
-    </form>
-    `, isInline: true, dependencies: [{ kind: "component", type: LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }, { kind: "component", type: TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: InsertLinkDialogComponent, decorators: [{
-            type: Component,
-            args: [{
-                    template: `
-    <form class="k-form k-form-md" method="dialog">
-        <div class="k-form-field">
-            <kendo-label [for]="textbox" text="URL"></kendo-label>
-                <kendo-textbox #textbox
-                    [(value)]="urlLink">
-                </kendo-textbox>
-        </div>
-    </form>
-    `,
-                    standalone: true,
-                    imports: [LabelComponent, TextBoxComponent]
-                }]
-        }], ctorParameters: function () { return [{ type: i1$1.DialogRef }]; } });
-
-/**
- * @hidden
- */
-class ActionDialogComponent extends DialogContentBase {
-    constructor(dialog) {
-        super(dialog);
-        this.dialog = dialog;
-    }
-    setData(args) {
-        this.value = args.value;
-        this.tabindex = args.tabindex;
-        this.commandName = args.commandName;
-    }
-}
-ActionDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ActionDialogComponent, deps: [{ token: i1$1.DialogRef }], target: i0.ɵɵFactoryTarget.Component });
-ActionDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ActionDialogComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `
-        <ng-container *ngIf="commandName === 'delete'">
-            <p>The deleted sheet data will be lost.</p>
-            <p>Are you sure you want to proceed?</p>
-        </ng-container>
-
-        <form class="k-form k-form-md" *ngIf="commandName === 'rename'" method="dialog">
-            <div class="k-form-field">
-                <kendo-label [for]="textbox" text="Rename sheet"></kendo-label>
-                <div class="k-form-field-wrap">
-                    <kendo-textbox #textbox
-                        autocomplete="off"
-                        placeholder="Sheet name"
-                        [(value)]="value">
-                    </kendo-textbox>
-                </div>
-            </div>
-        </form>
-    `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }, { kind: "component", type: TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ActionDialogComponent, decorators: [{
-            type: Component,
-            args: [{
-                    template: `
-        <ng-container *ngIf="commandName === 'delete'">
-            <p>The deleted sheet data will be lost.</p>
-            <p>Are you sure you want to proceed?</p>
-        </ng-container>
-
-        <form class="k-form k-form-md" *ngIf="commandName === 'rename'" method="dialog">
-            <div class="k-form-field">
-                <kendo-label [for]="textbox" text="Rename sheet"></kendo-label>
-                <div class="k-form-field-wrap">
-                    <kendo-textbox #textbox
-                        autocomplete="off"
-                        placeholder="Sheet name"
-                        [(value)]="value">
-                    </kendo-textbox>
-                </div>
-            </div>
-        </form>
-    `,
-                    standalone: true,
-                    imports: [NgIf, LabelComponent, TextBoxComponent]
-                }]
-        }], ctorParameters: function () { return [{ type: i1$1.DialogRef }]; } });
-
-/**
- * @hidden
- */
-class SheetsBarComponent {
-    constructor(spreadsheetService, element, renderer, localization, dialogService, ngZone) {
-        this.spreadsheetService = spreadsheetService;
-        this.element = element;
-        this.renderer = renderer;
-        this.localization = localization;
-        this.dialogService = dialogService;
-        this.ngZone = ngZone;
-        this.hostClasses = true;
-        this.subs = new Subscription();
-        this.plusIcon = plusIcon;
-        this.menuIcon = menuIcon;
-        this.caretAltDownIcon = caretAltDownIcon;
-        this.caretAltLeftIcon = caretAltLeftIcon;
-        this.caretAltRightIcon = caretAltRightIcon;
-        this.selected = false;
-        this.sheetsMenuList = [];
-        this.openedDdb = null;
-        this.hiddenStateIcons = {
-            hidden: 'eye-slash',
-            visible: 'eye'
-        };
-        this.hiddenStateSVGIcons = {
-            hidden: eyeSlashIcon,
-            visible: eyeIcon
-        };
-        this.onAddClick = () => {
-            if (this.spreadsheetService.spreadsheet) {
-                this.spreadsheetService.spreadsheet.view.sheetsbar.onAddSelect();
-                this.notifySheetsChange();
-            }
-        };
-        this.actionsCallback = {
-            copy: (sheetInfo) => {
-                let copies = 0;
-                const regex = this.getCopyRegex(sheetInfo.text);
-                this.sheets.forEach(sheet => {
-                    const isPresent = regex.test(sheet.text);
-                    if (isPresent) {
-                        copies += 1;
-                    }
-                });
-                const sheetToCopy = this.spreadsheetService.spreadsheet.sheets().find(s => s.name() === sheetInfo.text);
-                const newName = `${sheetInfo.text} (${copies + 1})`;
-                this.spreadsheetService.spreadsheet.insertSheet({ data: Object.assign(Object.assign({}, sheetToCopy.toJSON()), { name: newName }), index: sheetInfo.index + 1 });
-                this.selectSheet(newName);
-            },
-            move: (sheetInfo, itemKey) => {
-                const isMoveRight = itemKey === 'sheetMoveRight';
-                let oldIndex = -1;
-                let newIndex = -1;
-                const sheets = this.spreadsheetService.spreadsheet.sheets();
-                if (isMoveRight) {
-                    for (let i = 0; i < sheets.length; i++) {
-                        if (sheets[i].name() === sheetInfo.text) {
-                            oldIndex = i;
-                        }
-                        if (oldIndex > -1 && i > oldIndex && sheets[i]._state() === 'visible') {
-                            newIndex = i;
-                            break;
-                        }
-                    }
-                }
-                else {
-                    for (let i = sheets.length - 1; i >= 0; i--) {
-                        if (sheets[i].name() === sheetInfo.text) {
-                            oldIndex = i;
-                        }
-                        if (oldIndex > -1 && (i < oldIndex) && sheets[i]._state() === 'visible') {
-                            newIndex = i;
-                            break;
-                        }
-                    }
-                }
-                const sheetsBar = this.spreadsheetService.spreadsheet.view.sheetsbar;
-                sheetsBar.onSheetReorderEnd({ oldIndex, newIndex });
-                this.selectSheet(sheetInfo.text);
-                this.notifySheetsChange();
-            },
-            hide: (sheet) => {
-                sheet.state = 'hidden';
-                const sheets = this.spreadsheetService.spreadsheet.sheets();
-                const sheetIndex = sheets.findIndex(s => s.name() === sheet.text);
-                sheets[sheetIndex]._state('hidden');
-                const newSelectedIndex = sheetIndex < sheets.length - 1 ? sheetIndex + 1 : 0;
-                const sheetToSelect = sheets[newSelectedIndex].name();
-                this.selectSheet(sheetToSelect);
-                this.notifySheetsChange();
-            }
-        };
-        this.subs.add(spreadsheetService.onSheetsBarFocus.subscribe(() => ngZone.run(() => this.tabstrip.selectTab(this.sheets.findIndex(sh => sh.text === spreadsheetService.currentActiveSheet)))));
-    }
-    get activeSheet() {
-        var _a, _b;
-        return (_b = (_a = this.spreadsheetService.spreadsheet) === null || _a === void 0 ? void 0 : _a.activeSheet()) === null || _b === void 0 ? void 0 : _b.name();
-    }
-    get tablistId() {
-        return this.spreadsheetService.tablistId;
-    }
-    ngAfterViewInit() {
-        if (!isDocumentAvailable() || !this.element.nativeElement) {
-            return;
-        }
-        const prevBtn = this.element.nativeElement.querySelector('.k-tabstrip-prev');
-        const nextBtn = this.element.nativeElement.querySelector('.k-tabstrip-next');
-        const tablist = this.element.nativeElement.querySelector('.k-tabstrip-items');
-        this.renderer.addClass(prevBtn, 'k-order-1');
-        this.renderer.addClass(nextBtn, 'k-order-2');
-        this.renderer.setAttribute(tablist, 'id', this.tablistId);
-        this.tabListSub = this.renderer.listen(tablist, 'keydown', this.onTabListKeyDown.bind(this));
-    }
-    ngOnChanges(changes) {
-        var _a, _b;
-        if (changes['sheets']) {
-            this.sheetsMenuList = (_a = this.sheets) === null || _a === void 0 ? void 0 : _a.map(sheet => ({
-                text: sheet.text,
-                icon: this.hiddenStateIcons[sheet.state],
-                svgIcon: this.hiddenStateSVGIcons[sheet.state]
-            }));
-            this.sheets = (_b = changes['sheets'].currentValue) === null || _b === void 0 ? void 0 : _b.map((sheet, _, items) => (Object.assign(Object.assign({}, sheet), { sheetActions: getSheetActions(items, sheet)
-                    .map(item => (Object.assign(Object.assign({}, item), { text: this.messageFor(item.messageKey) }))) })));
-        }
-    }
-    ngOnDestroy() {
-        if (this.tabListSub) {
-            this.tabListSub();
-        }
-        this.subs.unsubscribe();
-    }
-    onTabSelect(ev) {
-        if (ev.title !== this.activeSheet) {
-            this.selectSheet(ev.title);
-        }
-    }
-    onOpen(ddb) {
-        if (isPresent(this.openedDdb) && this.openedDdb !== ddb) {
-            this.openedDdb.toggle(false);
-        }
-        this.openedDdb = ddb;
-    }
-    onClose() {
-        this.openedDdb = null;
-        const activeTabIdx = this.sheets.findIndex(sheet => sheet.active);
-        this.tabstrip.selectTab(activeTabIdx);
-    }
-    onActionClick(dataItem, sheet) {
-        if (dataItem.disabled) {
-            return;
-        }
-        if (dataItem.commandName === 'delete' || dataItem.commandName === 'rename') {
-            this.openDialog(dataItem, sheet);
-        }
-        else {
-            this.actionsCallback[dataItem.commandName](sheet, dataItem.messageKey);
-        }
-    }
-    onMenuItemClick(item) {
-        const sheet = this.sheets.find(s => s.text === item.text);
-        sheet.state = 'visible';
-        this.spreadsheetService.spreadsheet.sheets().find(sh => sh.name() === sheet.text)._state('visible');
-        this.selectSheet(sheet.text);
-    }
-    messageFor(key) {
-        return this.localization.get(key);
-    }
-    openDialog(dataItem, sheet) {
-        const dialogSettings = {
-            appendTo: this.spreadsheetService.dialogContainer,
-            title: this.messageFor(dataItem.commandName),
-            content: ActionDialogComponent,
-            actions: [{
-                    text: this.messageFor(dataItem.dialogButton),
-                    themeColor: 'primary'
-                }, {
-                    text: this.messageFor('dialogCancel')
-                }],
-            actionsLayout: 'stretched',
-            autoFocusedElement: '.k-textbox .k-input-inner, .k-button-solid-primary'
-        };
-        const dialog = this.dialogService.open(dialogSettings);
-        const dialogInstance = dialog.dialog.instance;
-        const dialogContent = dialog.content.instance;
-        dialogInstance.action.pipe(take(1)).subscribe((event) => {
-            if (event.text === this.messageFor(dataItem.dialogButton)) {
-                const sheetsBar = this.spreadsheetService.spreadsheet.view.sheetsbar;
-                if (sheetsBar) {
-                    const allSheets = this.spreadsheetService.spreadsheet.sheets();
-                    const sheetIndex = allSheets.findIndex(s => s.name() === sheet.text);
-                    dataItem.commandName === 'delete' ? sheetsBar.onSheetRemove(sheet.text) : sheetsBar.onSheetRename(dialogContent.value, sheetIndex);
-                    this.notifySheetsChange();
-                }
-            }
-        });
-        dialogContent.setData({
-            value: sheet.text,
-            tabindex: -1,
-            commandName: dataItem.commandName
-        });
-    }
-    getCopyRegex(sheetName) {
-        const newName = sheetName.replaceAll('(', '\\(').replaceAll(')', '\\)');
-        const st = `(${newName})\\s?\\(`;
-        return new RegExp(st, 's');
-    }
-    selectSheet(sheetName) {
-        const spreadsheetSheet = this.spreadsheetService.spreadsheet.sheets().find(s => s.name() === sheetName);
-        this.spreadsheetService.spreadsheet.activeSheet(spreadsheetSheet);
-        this.spreadsheetService.currentActiveSheet = sheetName;
-        this.spreadsheetService.activeSheetChanged.next(spreadsheetSheet);
-        this.notifySheetsChange();
-    }
-    onTabListKeyDown(ev) {
-        const buttonEl = ev.target.querySelector('kendo-dropdownbutton');
-        const index = Array.from(this.actionDdbRefs).findIndex(el => el.nativeElement === buttonEl);
-        const ddb = Array.from(this.actionDdbs)[index];
-        if (!ddb) {
-            return;
-        }
-        const altKey = ev.altKey;
-        const arrowDown = ev.keyCode === Keys.ArrowDown;
-        const shouldOpenDdb = altKey && arrowDown && !ddb.isOpen;
-        if (shouldOpenDdb) {
-            ev.preventDefault();
-            ddb.togglePopupVisibility();
-        }
-    }
-    notifySheetsChange() {
-        this.ngZone.run(() => {
-            var _a;
-            const newSheets = this.spreadsheetService.spreadsheet.sheets();
-            const sheetDesc = mapToSheetDescriptor(newSheets);
-            this.sheets = sheetDesc
-                .flatMap((item, index, items) => item.state === 'visible' ? [Object.assign(Object.assign({}, item), { inEdit: false, first: index === 0, last: index === items.length - 1, text: item.name, active: (item.name === this.activeSheet) || items.length === 1, index, sheetActions: getSheetActions(items, item)
-                        .map(item => (Object.assign(Object.assign({}, item), { text: this.messageFor(item.messageKey) }))) })] : []);
-            this.sheetsMenuList = (_a = this.sheets) === null || _a === void 0 ? void 0 : _a.map(sheet => ({
-                text: sheet.text,
-                icon: this.hiddenStateIcons[sheet.state],
-                svgIcon: this.hiddenStateSVGIcons[sheet.state]
-            }));
-        });
-        this.ngZone.onStable.pipe(take(1)).subscribe(() => this.spreadsheetService.spreadsheet.view.clipboard.focus());
-    }
-}
-SheetsBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SheetsBarComponent, deps: [{ token: SpreadsheetService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: SpreadsheetLocalizationService }, { token: i1$1.DialogService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-SheetsBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SheetsBarComponent, isStandalone: true, selector: "[kendoSpreadsheetSheetsBar]", inputs: { sheets: "sheets", sheetDescriptors: "sheetDescriptors" }, host: { properties: { "class.k-spreadsheet-sheets-bar": "this.hostClasses" } }, viewQueries: [{ propertyName: "addButton", first: true, predicate: ["addButton"], descendants: true }, { propertyName: "menuButton", first: true, predicate: ["menuButton"], descendants: true }, { propertyName: "tabstrip", first: true, predicate: ["tabstrip"], descendants: true }, { propertyName: "actionDdbs", predicate: ["sheetDdb"], descendants: true }, { propertyName: "actionDdbRefs", predicate: ["sheetDdb"], descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: `
-        <button kendoButton #addButton
-            [title]="messageFor('addSheet')"
-            type="button"
-            fillMode="flat"
-            class="k-spreadsheet-sheet-add"
-            icon="plus"
-            [svgIcon]="plusIcon"
-            [kendoEventsOutsideAngular]="{click: onAddClick}"
-            [attr.aria-controls]="tablistId">
-        </button>
-        <kendo-dropdownbutton #menuButton
-            fillMode="flat"
-            buttonClass="k-spreadsheet-sheets-menu"
-            icon="menu"
-            [svgIcon]="menuIcon"
-            [data]="sheetsMenuList"
-            (itemClick)="onMenuItemClick($event)"
-            (open)="onOpen(menuButton)"
-            [buttonAttributes]="{title: messageFor('sheetsMenu')}"
-            [attr.aria-controls]="tablistId">
-        </kendo-dropdownbutton>
-        <kendo-tabstrip #tabstrip
-            [tabPosition]="'bottom'"
-            [showContentArea]="false"
-            [scrollable]="{prevButtonIcon: 'caret-alt-left', prevSVGButtonIcon: caretAltLeftIcon, nextButtonIcon: 'caret-alt-right', nextSVGButtonIcon: caretAltRightIcon}"
-            class="k-spreadsheet-sheets"
-            (tabSelect)="onTabSelect($event)">
-            <ng-container *ngFor="let sheet of sheets">
-                <kendo-tabstrip-tab
-                    *ngIf="sheet.state === 'visible'"
-                    [title]="sheet.text"
-                    [selected]="sheet.text === activeSheet">
-                    <ng-template kendoTabTemplate>
-                        <span class="k-link">
-                            <span class="k-link-text">{{sheet.text}}</span>
-                        </span>
-                        <span class="k-item-actions">
-                            <kendo-dropdownbutton #sheetDdb
-                                fillMode="flat"
-                                icon="caret-alt-down"
-                                [svgIcon]="caretAltDownIcon"
-                                buttonClass="k-menu-button"
-                                [data]="sheet.sheetActions"
-                                [buttonAttributes]="{'aria-hidden': 'true', 'tabindex': '-1', role: 'presentation'}"
-                                (open)="onOpen(sheetDdb)"
-                                (close)="onClose()"
-                                (click)="$event.stopPropagation()"
-                                (itemClick)="onActionClick($event, sheet)">
-                            </kendo-dropdownbutton>
-                        </span>
-                    </ng-template>
-                </kendo-tabstrip-tab>
-            </ng-container>
-        </kendo-tabstrip>
-    `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: DropDownButtonComponent, selector: "kendo-dropdownbutton", inputs: ["arrowIcon", "icon", "svgIcon", "iconClass", "imageUrl", "textField", "data", "size", "rounded", "fillMode", "themeColor", "buttonAttributes"], outputs: ["itemClick", "focus", "blur"], exportAs: ["kendoDropDownButton"] }, { kind: "component", type: TabStripComponent, selector: "kendo-tabstrip", inputs: ["height", "animate", "tabAlignment", "tabPosition", "keepTabContent", "closable", "scrollable", "closeIcon", "closeIconClass", "closeSVGIcon", "showContentArea"], outputs: ["tabSelect", "tabClose", "tabScroll"], exportAs: ["kendoTabStrip"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TabStripTabComponent, selector: "kendo-tabstrip-tab", inputs: ["title", "disabled", "cssClass", "cssStyle", "selected", "closable", "closeIcon", "closeIconClass", "closeSVGIcon"], exportAs: ["kendoTabStripTab"] }, { kind: "directive", type: TabTemplateDirective, selector: "[kendoTabTemplate]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SheetsBarComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: '[kendoSpreadsheetSheetsBar]',
-                    template: `
-        <button kendoButton #addButton
-            [title]="messageFor('addSheet')"
-            type="button"
-            fillMode="flat"
-            class="k-spreadsheet-sheet-add"
-            icon="plus"
-            [svgIcon]="plusIcon"
-            [kendoEventsOutsideAngular]="{click: onAddClick}"
-            [attr.aria-controls]="tablistId">
-        </button>
-        <kendo-dropdownbutton #menuButton
-            fillMode="flat"
-            buttonClass="k-spreadsheet-sheets-menu"
-            icon="menu"
-            [svgIcon]="menuIcon"
-            [data]="sheetsMenuList"
-            (itemClick)="onMenuItemClick($event)"
-            (open)="onOpen(menuButton)"
-            [buttonAttributes]="{title: messageFor('sheetsMenu')}"
-            [attr.aria-controls]="tablistId">
-        </kendo-dropdownbutton>
-        <kendo-tabstrip #tabstrip
-            [tabPosition]="'bottom'"
-            [showContentArea]="false"
-            [scrollable]="{prevButtonIcon: 'caret-alt-left', prevSVGButtonIcon: caretAltLeftIcon, nextButtonIcon: 'caret-alt-right', nextSVGButtonIcon: caretAltRightIcon}"
-            class="k-spreadsheet-sheets"
-            (tabSelect)="onTabSelect($event)">
-            <ng-container *ngFor="let sheet of sheets">
-                <kendo-tabstrip-tab
-                    *ngIf="sheet.state === 'visible'"
-                    [title]="sheet.text"
-                    [selected]="sheet.text === activeSheet">
-                    <ng-template kendoTabTemplate>
-                        <span class="k-link">
-                            <span class="k-link-text">{{sheet.text}}</span>
-                        </span>
-                        <span class="k-item-actions">
-                            <kendo-dropdownbutton #sheetDdb
-                                fillMode="flat"
-                                icon="caret-alt-down"
-                                [svgIcon]="caretAltDownIcon"
-                                buttonClass="k-menu-button"
-                                [data]="sheet.sheetActions"
-                                [buttonAttributes]="{'aria-hidden': 'true', 'tabindex': '-1', role: 'presentation'}"
-                                (open)="onOpen(sheetDdb)"
-                                (close)="onClose()"
-                                (click)="$event.stopPropagation()"
-                                (itemClick)="onActionClick($event, sheet)">
-                            </kendo-dropdownbutton>
-                        </span>
-                    </ng-template>
-                </kendo-tabstrip-tab>
-            </ng-container>
-        </kendo-tabstrip>
-    `,
-                    standalone: true,
-                    imports: [ButtonComponent, EventsOutsideAngularDirective, DropDownButtonComponent, TabStripComponent, NgFor, NgIf, TabStripTabComponent, TabTemplateDirective]
-                }]
-        }], ctorParameters: function () { return [{ type: SpreadsheetService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: SpreadsheetLocalizationService }, { type: i1$1.DialogService }, { type: i0.NgZone }]; }, propDecorators: { hostClasses: [{
-                type: HostBinding,
-                args: ['class.k-spreadsheet-sheets-bar']
-            }], sheets: [{
-                type: Input
-            }], sheetDescriptors: [{
-                type: Input
-            }], addButton: [{
-                type: ViewChild,
-                args: ['addButton']
-            }], menuButton: [{
-                type: ViewChild,
-                args: ['menuButton']
-            }], tabstrip: [{
-                type: ViewChild,
-                args: ['tabstrip']
-            }], actionDdbs: [{
-                type: ViewChildren,
-                args: ['sheetDdb']
-            }], actionDdbRefs: [{
-                type: ViewChildren,
-                args: ['sheetDdb', { read: ElementRef }]
-            }] } });
-
-/**
- * @hidden
- */
-class NameBoxComponent {
-    constructor(ngZone, host, localization, renderer) {
-        this.ngZone = ngZone;
-        this.host = host;
-        this.localization = localization;
-        this.renderer = renderer;
-        this.hostClass = true;
-        this.valueNormalizer = (text) => text.pipe(map((content) => ({ name: content })));
-    }
-    keyDownHandler() {
-        const editor = this.spreadsheetWidget.view.nameEditor;
-        if (editor) {
-            const name = this.inputElement.value;
-            editor.trigger('enter', { value: name });
-        }
-    }
-    ngAfterViewInit() {
-        this.renderer.setAttribute(this.inputElement, 'title', this.title);
-        this.renderer.setAttribute(this.inputElement, 'aria-label', this.title);
-    }
-    get inputElement() {
-        return this.host.nativeElement.querySelector('.k-input-inner');
-    }
-    get current() {
-        return {
-            value: (val) => {
-                if (val === undefined) {
-                    const item = this.combobox && this.combobox.value;
-                    return item ? (item.name || item) : item;
-                }
-                else {
-                    this.ngZone.run(() => {
-                        this.value = { name: val } || null;
-                    });
-                }
-            }
-        };
-    }
-    get title() {
-        return this.localization.get('nameBox');
-    }
-    onSelectionChange(value) {
-        const editor = this.spreadsheetWidget.view.nameEditor;
-        if (editor && value) {
-            const name = value.name;
-            if (name !== this.value.name) {
-                editor.trigger('select', { name });
-                this.value = { name };
-            }
-        }
-    }
-    onOpen() {
-        const editor = this.spreadsheetWidget.view.nameEditor;
-        if (editor) {
-            this.data = editor.readData();
-        }
-    }
-}
-NameBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NameBoxComponent, deps: [{ token: i0.NgZone }, { token: i0.ElementRef }, { token: SpreadsheetLocalizationService }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-NameBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: NameBoxComponent, isStandalone: true, selector: "[kendoSpreadsheetNameBox]", inputs: { data: "data", spreadsheetWidget: "spreadsheetWidget" }, host: { listeners: { "keydown.enter": "keyDownHandler()" }, properties: { "class.k-spreadsheet-name-editor": "this.hostClass" } }, viewQueries: [{ propertyName: "combobox", first: true, predicate: ["combobox"], descendants: true }], ngImport: i0, template: `
-        <kendo-combobox #combobox
-            [popupSettings]="{popupClass: 'k-spreadsheet-names-popup'}"
-            fillMode="flat"
-            [clearButton]="false"
-            textField="name"
-            valueField="name"
-            [data]="data"
-            [allowCustom]="true"
-            (selectionChange)="onSelectionChange($event)"
-            [value]="value"
-            (open)="onOpen()"
-            [valueNormalizer]="valueNormalizer"
-            [attr.title]="title"
-        ></kendo-combobox>
-    `, isInline: true, dependencies: [{ kind: "component", type: ComboBoxComponent, selector: "kendo-combobox", inputs: ["icon", "svgIcon", "inputAttributes", "showStickyHeader", "focusableId", "allowCustom", "data", "value", "textField", "valueField", "valuePrimitive", "valueNormalizer", "placeholder", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "loading", "suggest", "clearButton", "disabled", "itemDisabled", "readonly", "tabindex", "tabIndex", "filterable", "virtual", "size", "rounded", "fillMode"], outputs: ["valueChange", "selectionChange", "filterChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur", "escape"], exportAs: ["kendoComboBox"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NameBoxComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: '[kendoSpreadsheetNameBox]',
-                    template: `
-        <kendo-combobox #combobox
-            [popupSettings]="{popupClass: 'k-spreadsheet-names-popup'}"
-            fillMode="flat"
-            [clearButton]="false"
-            textField="name"
-            valueField="name"
-            [data]="data"
-            [allowCustom]="true"
-            (selectionChange)="onSelectionChange($event)"
-            [value]="value"
-            (open)="onOpen()"
-            [valueNormalizer]="valueNormalizer"
-            [attr.title]="title"
-        ></kendo-combobox>
-    `,
-                    standalone: true,
-                    imports: [ComboBoxComponent]
-                }]
-        }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i0.ElementRef }, { type: SpreadsheetLocalizationService }, { type: i0.Renderer2 }]; }, propDecorators: { hostClass: [{
-                type: HostBinding,
-                args: ['class.k-spreadsheet-name-editor']
-            }], keyDownHandler: [{
-                type: HostListener,
-                args: ['keydown.enter']
-            }], combobox: [{
-                type: ViewChild,
-                args: ['combobox']
-            }], data: [{
-                type: Input
-            }], spreadsheetWidget: [{
-                type: Input
-            }] } });
-
-const DEFAULT_FONT_FAMILY = 'Arial';
-const DEFAULT_FONT_SIZE = 12;
-/**
- * @hidden
- */
-const DEFAULT_FONT_VALUES = {
-    fontSize: DEFAULT_FONT_SIZE,
-    fontFamily: DEFAULT_FONT_FAMILY
-};
-/**
- * @hidden
- */
-const FONT_FAMILIES = ['Arial', 'Courier New', 'Georgia', 'Times New Roman', 'Trebuchet MS', 'Verdana'];
-/**
- * @hidden
- */
-const FONT_SIZES = [8, 9, 10, 11, 12, 13, 14, 16, 18, 20, 22, 24, 26, 28, 36, 48, 72];
-/**
- * @hidden
- */
-const FONT_DATA = {
-    fontFamily: FONT_FAMILIES,
-    fontSize: FONT_SIZES
-};
-/**
- * @hidden
- */
-const FORMATS = [
-    { text: 'Automatic', value: null },
-    { text: 'Text', value: '@' },
-    { text: 'Number', value: '#,0.00' },
-    { text: 'Percent', value: '0.00%' },
-    { text: 'Financial', value: '_("$"* #,##0.00_);_("$"* (#,##0.00);_("$"* "-"??_);_(@_)' },
-    { text: 'Currency', value: '$#,##0.00;[Red]$#,##0.00' },
-    { text: 'Date', value: 'm/d/yyyy' },
-    { text: 'Time', value: 'h:mm:ss AM/PM' },
-    { text: 'Date time', value: 'm/d/yyyy h:mm' },
-    { text: 'Duration', value: '[h]:mm:ss' }
-];
-/**
- * @hidden
- */
-const ALIGNS = [
-    { icon: commandIcons.alignLeft, svgIcon: commandSVGIcons.alignLeft, textKey: 'Align Left', commandName: 'textAlign', value: 'left', cssClass: '', commandId: 'alignLeft' },
-    { icon: commandIcons.alignCenter, svgIcon: commandSVGIcons.alignCenter, textKey: 'Align Center', commandName: 'textAlign', value: 'center', cssClass: '', commandId: 'alignCenter' },
-    { icon: commandIcons.alignRight, svgIcon: commandSVGIcons.alignRight, textKey: 'Align Right', commandName: 'textAlign', value: 'right', cssClass: '', commandId: 'alignRight' },
-    { icon: commandIcons.alignJustify, svgIcon: commandSVGIcons.alignJustify, textKey: 'Align Justify', commandName: 'textAlign', value: 'justify', cssClass: '', commandId: 'alignJustify' },
-    { icon: commandIcons.alignTop, svgIcon: commandSVGIcons.alignTop, textKey: 'Align Top', commandName: 'verticalAlign', value: 'top', cssClass: '', commandId: 'alignTop' },
-    { icon: commandIcons.alignMiddle, svgIcon: commandSVGIcons.alignMiddle, textKey: 'Align Middle', commandName: 'verticalAlign', value: 'center', cssClass: '', commandId: 'alignMiddle' },
-    { icon: commandIcons.alignBottom, svgIcon: commandSVGIcons.alignBottom, textKey: 'Align Bottom', commandName: 'verticalAlign', value: 'bottom', cssClass: '', commandId: 'alignBottom' }
-];
-/**
- * @hidden
- */
-const MERGE = [
-    { icon: commandIcons.mergeAll, svgIcon: commandSVGIcons.mergeAll, textKey: 'Merge all', commandName: 'cells', value: 'cells', disabled: false, commandId: 'mergeAll' },
-    { icon: commandIcons.mergeHorizontally, svgIcon: commandSVGIcons.mergeHorizontally, textKey: 'Merge horizontally', commandName: 'horizontally', value: 'horizontally', disabled: false, commandId: 'mergeHorizontally' },
-    { icon: commandIcons.mergeVertically, svgIcon: commandSVGIcons.mergeVertically, textKey: 'Merge vertically', commandName: 'vertically', value: 'vertically', disabled: false, commandId: 'mergeVertically' },
-    { icon: commandIcons.unmerge, svgIcon: commandSVGIcons.unmerge, textKey: 'Unmerge', commandName: 'unmerge', value: 'unmerge', disabled: false, commandId: 'unmerge' }
-];
-/**
- * @hidden
- */
-const MY_TOKEN = new InjectionToken('COMMAND_TOKEN');
-
-/**
- * @hidden
- */
-class SpreadsheetCommandBaseDirective {
-    constructor(command, button, localization, spreadsheetService, toolsService) {
-        this.command = command;
-        this.button = button;
-        this.localization = localization;
-        this.spreadsheetService = spreadsheetService;
-        this.toolsService = toolsService;
-        this.subs = new Subscription();
-        const text = this.localization.get(this.command);
-        if (text) {
-            this.button.showText = 'overflow';
-            this.button.showIcon = 'both';
-            this.button.text = text;
-        }
-        if (!this.button.toolbarOptions.icon) {
-            this.button.icon = commandIcons[this.command];
-        }
-        if (!this.button.toolbarOptions.svgIcon) {
-            this.button.svgIcon = commandSVGIcons[this.command];
-        }
-        this.button.title = text;
-        this.button.fillMode = 'flat';
-        this.subs.add(this.toolsService.stateChange.subscribe(state => {
-            this.toolsService.ngZone.onStable.pipe(take(1)).subscribe(() => this.button.selected = state[command]);
-        }));
-    }
-    ngOnInit() {
-        this.subs.add(this.button.click.subscribe((this.clickHandler.bind(this))));
-        this.subs.add(this.button.pointerdown.subscribe((this.pointerdownHandler.bind(this))));
-    }
-    ngOnDestroy() {
-        this.subs.unsubscribe();
-    }
-    clickHandler() { }
-    pointerdownHandler(_event) { }
-}
-SpreadsheetCommandBaseDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetCommandBaseDirective, deps: [{ token: MY_TOKEN }, { token: i1$2.ToolBarButtonComponent }, { token: i2.LocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetCommandBaseDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetCommandBaseDirective, selector: "[kendoSpreadsheetCommandBase]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetCommandBaseDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoSpreadsheetCommandBase]'
-                }]
-        }], ctorParameters: function () {
-        return [{ type: undefined, decorators: [{
-                        type: Inject,
-                        args: [MY_TOKEN]
-                    }] }, { type: i1$2.ToolBarButtonComponent }, { type: i2.LocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }];
-    } });
-
-/**
- * @hidden
- */
-class SpreadsheetCommandButton extends SpreadsheetCommandBaseDirective {
-    constructor(command, button, localization, spreadsheetService, toolsService, commandOptions) {
-        super(command, button, localization, spreadsheetService, toolsService);
-        this.command = command;
-        this.button = button;
-        this.localization = localization;
-        this.spreadsheetService = spreadsheetService;
-        this.toolsService = toolsService;
-        this.commandOptions = commandOptions;
-    }
-    clickHandler() {
-        if (this.commandOptions.command === 'PropertyChangeCommand') {
-            this.commandOptions.options.value = !this.toolsService.toolsState[this.command];
-        }
-        this.spreadsheetService.spreadsheet.executeCommand(this.commandOptions);
-    }
-}
-
-/**
- * @hidden
- */
-class SpreadsheetGridLinesDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService) {
-        super('gridLines', button, localization, spreadsheetService, toolsService, {
-            command: 'GridLinesChangeCommand',
-            options: { property: 'gridLines',
-                value: !button.selected
-            }
-        });
-    }
-    clickHandler() {
-        const sheet = this.spreadsheetService.spreadsheet.activeSheet();
-        if (sheet) {
-            const value = !sheet.showGridLines();
-            const options = {
-                command: 'GridLinesChangeCommand', options: { property: 'gridLines', value }
-            };
-            this.spreadsheetService.spreadsheet.executeCommand(options);
-        }
-    }
-}
-SpreadsheetGridLinesDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetGridLinesDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetGridLinesDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetGridLinesDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetGridLines]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetGridLinesDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetGridLines]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetMergeDirective {
-    constructor(host, localization, spreadsheetService) {
-        this.host = host;
-        this.spreadsheetService = spreadsheetService;
-        this.commandName = 'merge';
-        this.subs = new Subscription();
-        host.svgIcon = commandSVGIcons[this.commandName];
-        host.icon = commandIcons[this.commandName];
-        host.arrowIcon = true;
-        host.fillMode = 'flat';
-        host.data = MERGE.map(item => (Object.assign(Object.assign({}, item), { textKey: localization.get(item.commandId) })));
-        this.subs.add(host.itemClick.subscribe((e) => this.onItemClick(e)));
-        host.title = localization.get(this.commandName);
-        host.textField = 'textKey';
-    }
-    ngOnInit() {
-        this.subs.add(this.host.open.subscribe(() => {
-            const sheet = this.spreadsheetService.spreadsheet.activeSheet();
-            const isMergedCellWithinRange = this.hasMergedCells(sheet);
-            const unmergeItem = this.host.data.find(i => i.commandName === 'unmerge');
-            unmergeItem.disabled = !isMergedCellWithinRange;
-        }));
-        this.subs.add(this.spreadsheetService.selectionChanged.subscribe(range => this.selectedRange = range));
-    }
-    ngOnDestroy() {
-        this.subs.unsubscribe();
-    }
-    onItemClick(item) {
-        if (item.disabled) {
-            return;
-        }
-        const value = item.value || null;
-        const options = {
-            command: 'MergeCellCommand', options: { property: item.commandName, value }
-        };
-        this.spreadsheetService.spreadsheet.executeCommand(options);
-    }
-    hasMergedCells(sheet) {
-        const range = sheet._ref(this.selectedRange);
-        return sheet._getMergedCells(range).hasMerged;
-    }
-}
-SpreadsheetMergeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetMergeDirective, deps: [{ token: i1$2.ToolBarDropDownButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetMergeDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetMergeDirective, isStandalone: true, selector: "[kendoSpreadsheetMerge]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetMergeDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoSpreadsheetMerge]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarDropDownButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetIncreaseDecimalDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService) {
-        super('increaseDecimal', button, localization, spreadsheetService, toolsService, {
-            command: 'AdjustDecimalsCommand'
-        });
-    }
-    clickHandler() {
-        const options = {
-            command: 'AdjustDecimalsCommand',
-            options: { value: 1 }
-        };
-        this.spreadsheetService.spreadsheet.executeCommand(options);
-    }
-}
-SpreadsheetIncreaseDecimalDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetIncreaseDecimalDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetIncreaseDecimalDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetIncreaseDecimalDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseDecimal]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetIncreaseDecimalDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetIncreaseDecimal]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetDecreaseDecimalDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService) {
-        super('decreaseDecimal', button, localization, spreadsheetService, toolsService, {
-            command: 'AdjustDecimalsCommand'
-        });
-    }
-    clickHandler() {
-        const options = {
-            command: 'AdjustDecimalsCommand',
-            options: { value: -1 }
-        };
-        this.spreadsheetService.spreadsheet.executeCommand(options);
-    }
-}
-SpreadsheetDecreaseDecimalDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetDecreaseDecimalDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetDecreaseDecimalDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetDecreaseDecimalDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseDecimal]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetDecreaseDecimalDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetDecreaseDecimal]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetDeleteRowButtonDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService) {
-        super('deleteRow', button, localization, spreadsheetService, toolsService, {
-            command: 'DeleteRowCommand',
-            options: { property: 'deleteRow' }
-        });
-    }
-}
-SpreadsheetDeleteRowButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetDeleteRowButtonDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetDeleteRowButtonDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetDeleteRowButtonDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteRowButton]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetDeleteRowButtonDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetDeleteRowButton]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetDeleteColumnButtonDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService) {
-        super('deleteColumn', button, localization, spreadsheetService, toolsService, {
-            command: 'DeleteColumnCommand',
-            options: { property: 'deleteColumn' }
-        });
-    }
-}
-SpreadsheetDeleteColumnButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetDeleteColumnButtonDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetDeleteColumnButtonDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetDeleteColumnButtonDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteColumnButton]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetDeleteColumnButtonDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetDeleteColumnButton]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetAddRowAboveButtonDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService) {
-        super('addRowAbove', button, localization, spreadsheetService, toolsService, {
-            command: 'AddRowCommand',
-            options: { property: 'addRowAbove',
-                value: 'above'
-            }
-        });
-    }
-}
-SpreadsheetAddRowAboveButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetAddRowAboveButtonDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetAddRowAboveButtonDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetAddRowAboveButtonDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowAboveButton]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetAddRowAboveButtonDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetAddRowAboveButton]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetAddRowBelowButtonDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService) {
-        super('addRowBelow', button, localization, spreadsheetService, toolsService, {
-            command: 'AddRowCommand',
-            options: { property: 'addRowBelow',
-                value: 'below'
-            }
-        });
-    }
-}
-SpreadsheetAddRowBelowButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetAddRowBelowButtonDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetAddRowBelowButtonDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetAddRowBelowButtonDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowBelowButton]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetAddRowBelowButtonDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetAddRowBelowButton]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetAddColumnRightButtonDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService) {
-        super('addColumnRight', button, localization, spreadsheetService, toolsService, {
-            command: 'AddColumnCommand',
-            options: { property: 'addColumnRight',
-                value: 'right'
-            }
-        });
-    }
-}
-SpreadsheetAddColumnRightButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetAddColumnRightButtonDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetAddColumnRightButtonDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetAddColumnRightButtonDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnRightButton]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetAddColumnRightButtonDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetAddColumnRightButton]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetAddColumnLeftButtonDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService) {
-        super('addColumnLeft', button, localization, spreadsheetService, toolsService, {
-            command: 'AddColumnCommand',
-            options: { property: 'addColumnLeft',
-                value: 'left'
-            }
-        });
-    }
-}
-SpreadsheetAddColumnLeftButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetAddColumnLeftButtonDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetAddColumnLeftButtonDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetAddColumnLeftButtonDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnLeftButton]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetAddColumnLeftButtonDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetAddColumnLeftButton]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetInsertLinkDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService, dialogService) {
-        super('insertLink', button, localization, spreadsheetService, toolsService, {
-            command: 'HyperlinkCommand'
-        });
-        this.dialogService = dialogService;
-        this.subs.add(spreadsheetService.selectionChanged.subscribe(range => this.currentRange = range));
-    }
-    ngOnDestroy() {
-        this.subs.unsubscribe();
-    }
-    clickHandler() {
-        const sheet = this.spreadsheetService.spreadsheet.activeSheet();
-        if (sheet) {
-            this.openDialog();
-        }
-    }
-    /**
-     * @hidden
-     */
-    openDialog() {
-        var _a, _b;
-        const hasLink = isPresent((_a = this.currentRange) === null || _a === void 0 ? void 0 : _a.link());
-        const dialogSettings = {
-            appendTo: this.spreadsheetService.dialogContainer,
-            title: this.localization.get(this.command),
-            content: InsertLinkDialogComponent,
-            actions: [{
-                    text: this.localization.get('dialogInsert'),
-                    themeColor: 'primary'
-                }, {
-                    text: this.localization.get('dialogCancel')
-                },
-                'spacer', {
-                    text: this.localization.get('dialogRemoveLink'),
-                    themeColor: 'primary',
-                    fillMode: 'clear',
-                    cssClass: hasLink ? '' : 'k-disabled'
-                }],
-            actionsLayout: 'start',
-            width: 400,
-            autoFocusedElement: '.k-textbox > .k-input-inner'
-        };
-        const dialog = this.dialogService.open(dialogSettings);
-        const dialogInstance = dialog.dialog.instance;
-        const dialogContent = dialog.content.instance;
-        if (hasLink) {
-            dialogContent.setData({ link: (_b = this.currentRange) === null || _b === void 0 ? void 0 : _b.link() });
-        }
-        dialogInstance.action.pipe(take(1)).subscribe((event) => {
-            if (event.text === this.localization.get('dialogCancel')) {
-                return;
-            }
-            let link = null;
-            if (event.text === this.localization.get('dialogInsert')) {
-                link = dialogContent.urlLink || null;
-            }
-            this.spreadsheetService.spreadsheet.executeCommand({
-                command: 'HyperlinkCommand',
-                options: { link }
-            });
-        });
-    }
-}
-SpreadsheetInsertLinkDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetInsertLinkDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }, { token: i1$1.DialogService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetInsertLinkDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetInsertLinkDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetInsertLink]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetInsertLinkDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetInsertLink]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }, { type: i1$1.DialogService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetFormatDirective {
-    constructor(host, localization, spreadsheetService, toolsService) {
-        this.host = host;
-        this.spreadsheetService = spreadsheetService;
-        this.toolsService = toolsService;
-        this.data = FORMATS;
-        this.commandName = 'format';
-        this.subs = new Subscription();
-        /**
-         * @hidden
-         */
-        this.onItemClick = (item) => {
-            const value = item.value || null;
-            const options = {
-                command: 'PropertyChangeCommand', options: { property: this.commandName, value }
-            };
-            this.spreadsheetService.spreadsheet.executeCommand(options);
-        };
-        host.svgIcon = commandSVGIcons[this.commandName];
-        host.icon = commandIcons[this.commandName];
-        host.arrowIcon = true;
-        host.fillMode = 'flat';
-        host.data = this.data;
-        this.subs.add(host.itemClick.subscribe((e) => this.onItemClick(e)));
-        host.title = localization.get(this.commandName);
-    }
-    ngOnInit() {
-        this.subs.add(this.toolsService.stateChange.subscribe(state => this.host.data.forEach(i => i.cssClass = i.value === state[this.commandName] ? 'k-selected' : '')));
-    }
-    ngOnDestroy() {
-        this.subs.unsubscribe();
-    }
-}
-SpreadsheetFormatDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetFormatDirective, deps: [{ token: i1$2.ToolBarDropDownButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetFormatDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetFormatDirective, isStandalone: true, selector: "[kendoSpreadsheetFormat]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetFormatDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoSpreadsheetFormat]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarDropDownButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetTextWrapDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService) {
-        super('wrap', button, localization, spreadsheetService, toolsService, {
-            command: 'TextWrapCommand',
-            options: { property: 'wrap',
-                value: !button.selected
-            }
-        });
-    }
-    clickHandler() {
-        const sheet = this.spreadsheetService.spreadsheet.activeSheet();
-        if (sheet) {
-            const range = sheet.range(sheet.activeCell());
-            const value = !range.wrap();
-            const options = {
-                command: 'TextWrapCommand', options: { property: 'wrap', value }
-            };
-            this.spreadsheetService.spreadsheet.executeCommand(options);
-        }
-    }
-}
-SpreadsheetTextWrapDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetTextWrapDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetTextWrapDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetTextWrapDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetTextWrap]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetTextWrapDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetTextWrap]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetVerticalTextAlignDirective {
-    constructor(host, localization, spreadsheetService, toolsService) {
-        this.host = host;
-        this.spreadsheetService = spreadsheetService;
-        this.toolsService = toolsService;
-        this.commandName = 'alignVertical';
-        this.subs = new Subscription();
-        host.svgIcon = commandSVGIcons[this.commandName];
-        host.icon = commandIcons[this.commandName];
-        host.arrowIcon = true;
-        host.fillMode = 'flat';
-        host.data = ALIGNS.flatMap(item => item.commandName === 'verticalAlign' ? [Object.assign(Object.assign({}, item), { textKey: localization.get(item.commandId) })] : []);
-        this.subs.add(host.itemClick.subscribe((e) => this.onItemClick(e)));
-        host.title = localization.get(this.commandName);
-        host.textField = 'textKey';
-    }
-    ngOnInit() {
-        this.subs.add(this.toolsService.stateChange.subscribe(state => this.host.data.forEach(i => i.cssClass = i.value === state[i.commandName] ? 'k-selected' : '')));
-    }
-    ngOnDestroy() {
-        this.subs.unsubscribe();
-    }
-    onItemClick(item) {
-        const value = item.value || null;
-        const options = {
-            command: 'PropertyChangeCommand', options: { property: item.commandName, value }
-        };
-        this.spreadsheetService.spreadsheet.executeCommand(options);
-    }
-}
-SpreadsheetVerticalTextAlignDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetVerticalTextAlignDirective, deps: [{ token: i1$2.ToolBarDropDownButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetVerticalTextAlignDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetVerticalTextAlignDirective, isStandalone: true, selector: "[kendoSpreadsheetVerticalTextAlign]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetVerticalTextAlignDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoSpreadsheetVerticalTextAlign]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarDropDownButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetHorizontalTextAlignDirective {
-    constructor(host, localization, spreadsheetService, toolsService) {
-        this.host = host;
-        this.spreadsheetService = spreadsheetService;
-        this.toolsService = toolsService;
-        this.commandName = 'alignHorizontal';
-        this.subs = new Subscription();
-        host.svgIcon = commandSVGIcons[this.commandName];
-        host.icon = commandIcons[this.commandName];
-        host.arrowIcon = true;
-        host.fillMode = 'flat';
-        host.data = ALIGNS.flatMap(item => item.commandName === 'textAlign' ? [Object.assign(Object.assign({}, item), { textKey: localization.get(item.commandId) })] : []);
-        this.subs.add(host.itemClick.subscribe((e) => this.onItemClick(e)));
-        host.title = localization.get(this.commandName);
-        host.textField = 'textKey';
-    }
-    ngOnInit() {
-        this.subs.add(this.toolsService.stateChange.subscribe(state => this.host.data.forEach(i => i.cssClass = i.value === state[i.commandName] ? 'k-selected' : '')));
-    }
-    ngOnDestroy() {
-        this.subs.unsubscribe();
-    }
-    onItemClick(item) {
-        const value = item.value || null;
-        const options = {
-            command: 'PropertyChangeCommand', options: { property: item.commandName, value }
-        };
-        this.spreadsheetService.spreadsheet.executeCommand(options);
-    }
-}
-SpreadsheetHorizontalTextAlignDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetHorizontalTextAlignDirective, deps: [{ token: i1$2.ToolBarDropDownButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetHorizontalTextAlignDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetHorizontalTextAlignDirective, isStandalone: true, selector: "[kendoSpreadsheetHorizontalTextAlign]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetHorizontalTextAlignDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoSpreadsheetHorizontalTextAlign]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarDropDownButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-function outerWidth(element) {
-    let width = element.offsetWidth;
-    const style = getComputedStyle(element);
-    width += parseFloat(style.marginLeft) || 0 + parseFloat(style.marginRight) || 0;
-    return width;
-}
-
-/**
- * @hidden
- */
-class DropDownListBase {
-    constructor() {
-        this.display = 'inline-flex';
-        this.fillMode = 'flat';
-        this.valueChange = new EventEmitter();
-    }
-    onValueChange(value) {
-        this.valueChange.emit(value);
-    }
-    focus() {
-        this.dropDownList.focus();
-    }
-}
-DropDownListBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DropDownListBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-DropDownListBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: DropDownListBase, selector: "kendo-spreadsheet-dropdownlist-base", inputs: { data: "data", value: "value", title: "title", tabindex: "tabindex" }, outputs: { valueChange: "valueChange" }, host: { properties: { "style.display": "this.display" } }, viewQueries: [{ propertyName: "element", first: true, predicate: ["element"], descendants: true, static: true }, { propertyName: "dropDownList", first: true, predicate: ["element"], descendants: true, read: DropDownListComponent, static: true }], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DropDownListBase, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-spreadsheet-dropdownlist-base'
-                }]
-        }], propDecorators: { display: [{
-                type: HostBinding,
-                args: ['style.display']
-            }], data: [{
-                type: Input
-            }], value: [{
-                type: Input
-            }], title: [{
-                type: Input
-            }], tabindex: [{
-                type: Input
-            }], valueChange: [{
-                type: Output
-            }], element: [{
-                type: ViewChild,
-                args: ['element', { static: true }]
-            }], dropDownList: [{
-                type: ViewChild,
-                args: ['element', { read: DropDownListComponent, static: true }]
-            }] } });
-
-/**
- * @hidden
- */
-class FontSizeDropDownListComponent extends DropDownListBase {
-}
-FontSizeDropDownListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FontSizeDropDownListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-FontSizeDropDownListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: FontSizeDropDownListComponent, isStandalone: true, selector: "kendo-spreadsheet-fontsize-dropdownlist", usesInheritance: true, ngImport: i0, template: `
-        <kendo-dropdownlist
-            #element
-            class="k-toolbar-dropdownlist"
-            [data]="data"
-            [(value)]="value"
-            [attr.title]="title"
-            [tabindex]="tabindex"
-            (valueChange)="onValueChange($event)"
-            [leftRightArrowsNavigation]="false"
-            [fillMode]="fillMode"></kendo-dropdownlist>
-    `, isInline: true, dependencies: [{ kind: "component", type: DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FontSizeDropDownListComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'kendo-spreadsheet-fontsize-dropdownlist',
-                    template: `
-        <kendo-dropdownlist
-            #element
-            class="k-toolbar-dropdownlist"
-            [data]="data"
-            [(value)]="value"
-            [attr.title]="title"
-            [tabindex]="tabindex"
-            (valueChange)="onValueChange($event)"
-            [leftRightArrowsNavigation]="false"
-            [fillMode]="fillMode"></kendo-dropdownlist>
-    `,
-                    standalone: true,
-                    imports: [DropDownListComponent]
-                }]
-        }] });
-
-/**
- * @hidden
- */
-class FontFamilyDropDownListComponent extends DropDownListBase {
-}
-FontFamilyDropDownListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FontFamilyDropDownListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-FontFamilyDropDownListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: FontFamilyDropDownListComponent, isStandalone: true, selector: "kendo-spreadsheet-fontfamily-dropdownlist", usesInheritance: true, ngImport: i0, template: `
-        <kendo-dropdownlist
-            #element
-            class="k-toolbar-dropdownlist"
-            [data]="data"
-            [(value)]="value"
-            [tabindex]="tabindex"
-            (valueChange)="onValueChange($event)"
-            [leftRightArrowsNavigation]="false"
-            [fillMode]="fillMode"
-            [attr.title]="title">
-            <ng-template kendoDropDownListItemTemplate let-dataItem>
-                <span [ngStyle]="{ 'font-family': dataItem }">
-                    {{ dataItem }}
-                </span>
-            </ng-template>
-        </kendo-dropdownlist>
-    `, isInline: true, dependencies: [{ kind: "component", type: DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { kind: "directive", type: ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FontFamilyDropDownListComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'kendo-spreadsheet-fontfamily-dropdownlist',
-                    template: `
-        <kendo-dropdownlist
-            #element
-            class="k-toolbar-dropdownlist"
-            [data]="data"
-            [(value)]="value"
-            [tabindex]="tabindex"
-            (valueChange)="onValueChange($event)"
-            [leftRightArrowsNavigation]="false"
-            [fillMode]="fillMode"
-            [attr.title]="title">
-            <ng-template kendoDropDownListItemTemplate let-dataItem>
-                <span [ngStyle]="{ 'font-family': dataItem }">
-                    {{ dataItem }}
-                </span>
-            </ng-template>
-        </kendo-dropdownlist>
-    `,
-                    standalone: true,
-                    imports: [DropDownListComponent, ItemTemplateDirective, NgStyle]
-                }]
-        }] });
-
-/**
- * @hidden
- */
-class DialogContentComponent extends DialogContentBase {
-    constructor(dialog) {
-        super(dialog);
-        this.dialog = dialog;
-        this.data = [];
-    }
-    setData(args) {
-        this.data = args.data;
-        this.value = args.value;
-        this.tabindex = args.tabindex;
-        this.componentType = args.componentType;
-    }
-}
-DialogContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogContentComponent, deps: [{ token: i1$1.DialogRef }], target: i0.ɵɵFactoryTarget.Component });
-DialogContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: DialogContentComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `
-        <div 
-            [ngSwitch]="componentType"
-            class="k-d-flex k-align-items-center k-justify-content-center">
-            <kendo-spreadsheet-fontfamily-dropdownlist
-                *ngSwitchCase="'fontFamily'"
-                [data]="data"
-                [(value)]="value"
-                [attr.title]="title"
-                [tabindex]="tabindex"
-                [style.width.em]="13"
-                ></kendo-spreadsheet-fontfamily-dropdownlist>
-            <kendo-spreadsheet-fontsize-dropdownlist
-                *ngSwitchCase="'fontSize'"
-                [data]="data"
-                [(value)]="value"
-                [attr.title]="title"
-                [tabindex]="tabindex"
-                [style.width.em]="13"
-                ></kendo-spreadsheet-fontsize-dropdownlist>
-            <kendo-colorpicker
-                *ngSwitchCase="'color'"
-                [attr.title]="title"
-                [format]="'hex'"
-                [(value)]="value"
-                [tabindex]="tabindex"
-                [clearButton]="false"
-                fillMode="flat"
-            ></kendo-colorpicker>
-            <kendo-colorpicker
-                *ngSwitchCase="'background'"
-                [attr.title]="title"
-                [format]="'hex'"
-                [(value)]="value"
-                [tabindex]="tabindex"
-                [clearButton]="false"
-                fillMode="flat"
-            ></kendo-colorpicker>
-        </div>
-    `, isInline: true, dependencies: [{ kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: FontFamilyDropDownListComponent, selector: "kendo-spreadsheet-fontfamily-dropdownlist" }, { kind: "component", type: FontSizeDropDownListComponent, selector: "kendo-spreadsheet-fontsize-dropdownlist" }, { kind: "component", type: ColorPickerComponent, selector: "kendo-colorpicker", inputs: ["views", "view", "activeView", "readonly", "disabled", "format", "value", "popupSettings", "paletteSettings", "gradientSettings", "icon", "iconClass", "svgIcon", "clearButton", "tabindex", "preview", "actionsLayout", "size", "rounded", "fillMode"], outputs: ["valueChange", "open", "close", "focus", "blur", "cancel", "activeColorClick", "clearButtonClick", "activeViewChange"], exportAs: ["kendoColorPicker"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogContentComponent, decorators: [{
-            type: Component,
-            args: [{
-                    template: `
-        <div 
-            [ngSwitch]="componentType"
-            class="k-d-flex k-align-items-center k-justify-content-center">
-            <kendo-spreadsheet-fontfamily-dropdownlist
-                *ngSwitchCase="'fontFamily'"
-                [data]="data"
-                [(value)]="value"
-                [attr.title]="title"
-                [tabindex]="tabindex"
-                [style.width.em]="13"
-                ></kendo-spreadsheet-fontfamily-dropdownlist>
-            <kendo-spreadsheet-fontsize-dropdownlist
-                *ngSwitchCase="'fontSize'"
-                [data]="data"
-                [(value)]="value"
-                [attr.title]="title"
-                [tabindex]="tabindex"
-                [style.width.em]="13"
-                ></kendo-spreadsheet-fontsize-dropdownlist>
-            <kendo-colorpicker
-                *ngSwitchCase="'color'"
-                [attr.title]="title"
-                [format]="'hex'"
-                [(value)]="value"
-                [tabindex]="tabindex"
-                [clearButton]="false"
-                fillMode="flat"
-            ></kendo-colorpicker>
-            <kendo-colorpicker
-                *ngSwitchCase="'background'"
-                [attr.title]="title"
-                [format]="'hex'"
-                [(value)]="value"
-                [tabindex]="tabindex"
-                [clearButton]="false"
-                fillMode="flat"
-            ></kendo-colorpicker>
-        </div>
-    `,
-                    standalone: true,
-                    imports: [NgSwitch, NgSwitchCase, FontFamilyDropDownListComponent, FontSizeDropDownListComponent, ColorPickerComponent]
-                }]
-        }], ctorParameters: function () { return [{ type: i1$1.DialogRef }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetDropDownToolBase extends ToolBarToolComponent {
-    constructor(command, dialogService, localization, spreadsheetService, toolsService, toolbar) {
-        super();
-        this.command = command;
-        this.dialogService = dialogService;
-        this.localization = localization;
-        this.spreadsheetService = spreadsheetService;
-        this.toolsService = toolsService;
-        this.toolbar = toolbar;
-        /**
-         * Fires when the user updates the value of the drop-down list.
-         */
-        this.valueChange = new EventEmitter();
-        this.tabindex = -1;
-        this.svgIcon = commandSVGIcons[this.command];
-        this.icon = commandIcons[this.command];
-        this.value = DEFAULT_FONT_VALUES[this.command];
-        this.data = FONT_DATA[this.command];
-        this.isBuiltInTool = true;
-    }
-    ngOnInit() {
-        this.value = this.toolsService.toolsState[this.command];
-        this.subs = this.toolsService.stateChange.subscribe(state => {
-            this.value = state[this.command];
-        });
-    }
-    ngOnDestroy() {
-        if (this.subs) {
-            this.subs.unsubscribe();
-        }
-    }
-    /**
-     * @hidden
-     */
-    messageFor(key) {
-        return this.localization.get(key);
-    }
-    /**
-     * @hidden
-     */
-    onValueChange(ev) {
-        if (isPresent(ev)) {
-            if (hasObservers(this.valueChange)) {
-                this.valueChange.emit(ev);
-            }
-            const options = {
-                command: 'PropertyChangeCommand',
-                options: { property: this.command, value: ev || null }
-            };
-            this.spreadsheetService.spreadsheet.executeCommand(options);
-        }
-    }
-    /**
-     * @hidden
-     */
-    get outerWidth() {
-        if (this.element) {
-            return outerWidth(this.element.nativeElement);
-        }
-    }
-    /**
-     * @hidden
-     */
-    openDialog() {
-        const dialogSettings = {
-            appendTo: this.spreadsheetService.dialogContainer,
-            title: this.messageFor(this.command),
-            content: DialogContentComponent,
-            actions: [{
-                    text: this.messageFor('dialogApply'),
-                    themeColor: 'primary'
-                }, {
-                    text: this.messageFor('dialogCancel')
-                }],
-            actionsLayout: 'start',
-            width: 400,
-            autoFocusedElement: '.k-picker'
-        };
-        this.toolbar.toggle(false);
-        const dialog = this.dialogService.open(dialogSettings);
-        const dialogInstance = dialog.dialog.instance;
-        const dialogContent = dialog.content.instance;
-        dialogInstance.action.pipe(take(1)).subscribe((event) => {
-            if (event.text === this.messageFor('dialogApply')) {
-                const options = {
-                    command: 'PropertyChangeCommand',
-                    options: { property: this.command, value: dialogContent.value || null }
-                };
-                this.spreadsheetService.spreadsheet.executeCommand(options);
-            }
-            this.toolbar.toggle();
-        });
-        dialogInstance.close.pipe(take(1)).subscribe(() => {
-            this.toolbar.toggle();
-        });
-        dialogContent.setData({
-            data: this.data,
-            value: this.value,
-            tabindex: this.tabindex,
-            componentType: this.command,
-            title: this.localization.get(this.command)
-        });
-    }
-    /**
-     * @hidden
-     */
-    focus(e) {
-        this.tabindex = 0;
-        if (e instanceof PointerEvent) {
-            return;
-        }
-        if (this.overflows) {
-            this.popupButton.nativeElement.focus();
-        }
-        else {
-            this.dropDownListRef.focus();
-        }
-    }
-    /**
-     * @hidden
-     */
-    canFocus() {
-        return true;
-    }
-    /**
-     * @hidden
-     */
-    handleKey() {
-        this.tabindex = -1;
-        return false;
-    }
-}
-SpreadsheetDropDownToolBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetDropDownToolBase, deps: [{ token: MY_TOKEN }, { token: i1$1.DialogService }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }, { token: i1$2.ToolBarComponent }], target: i0.ɵɵFactoryTarget.Component });
-SpreadsheetDropDownToolBase.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetDropDownToolBase, selector: "ng-component", outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "toolbarTemplate", first: true, predicate: ["toolbarTemplate"], descendants: true, static: true }, { propertyName: "popupTemplate", first: true, predicate: ["popupTemplate"], descendants: true, static: true }, { propertyName: "element", first: true, predicate: ["element"], descendants: true, read: ElementRef }, { propertyName: "dropDownListRef", first: true, predicate: ["element"], descendants: true }, { propertyName: "popupButton", first: true, predicate: ["popupButton"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: ``, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetDropDownToolBase, decorators: [{
-            type: Component,
-            args: [{
-                    template: ``
-                }]
-        }], ctorParameters: function () {
-        return [{ type: undefined, decorators: [{
-                        type: Inject,
-                        args: [MY_TOKEN]
-                    }] }, { type: i1$1.DialogService }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }, { type: i1$2.ToolBarComponent }];
-    }, propDecorators: { toolbarTemplate: [{
-                type: ViewChild,
-                args: ['toolbarTemplate', { static: true }]
-            }], popupTemplate: [{
-                type: ViewChild,
-                args: ['popupTemplate', { static: true }]
-            }], element: [{
-                type: ViewChild,
-                args: ['element', { read: ElementRef }]
-            }], dropDownListRef: [{
-                type: ViewChild,
-                args: ['element']
-            }], popupButton: [{
-                type: ViewChild,
-                args: ['popupButton', { read: ElementRef }]
-            }], valueChange: [{
-                type: Output
-            }] } });
-
-/**
- * A component which changes the background color of the text ([more information](ToDo).
- * @hidden
- */
-class SpreadsheetBackColorComponent extends SpreadsheetDropDownToolBase {
-    constructor(dialogService, localization, spreadsheetService, toolsService, toolbar) {
-        super('background', dialogService, localization, spreadsheetService, toolsService, toolbar);
-    }
-}
-SpreadsheetBackColorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetBackColorComponent, deps: [{ token: i1$1.DialogService }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }, { token: ToolBarComponent }], target: i0.ɵɵFactoryTarget.Component });
-SpreadsheetBackColorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetBackColorComponent, isStandalone: true, selector: "kendo-spreadsheet-backcolor-tool", providers: [{ provide: ToolBarToolComponent, useExisting: forwardRef(() => SpreadsheetBackColorComponent) }], usesInheritance: true, ngImport: i0, template: `
-        <ng-template #toolbarTemplate>
-            <div class="k-toolbar-item">
-                <kendo-colorpicker
-                    #element
-                    [attr.title]="messageFor(command)"
-                    [format]="'hex'"
-                    [(value)]="value"
-                    [tabindex]="tabindex"
-                    (valueChange)="onValueChange($event)"
-                    [clearButton]="false"
-                    fillMode="flat"
-                    [icon]="icon"
-                    [preview]="true"
-                    [svgIcon]="svgIcon"></kendo-colorpicker>
-            </div>
-        </ng-template>
-        <ng-template #popupTemplate>
-            <div #popupButton
-                [tabindex]="tabindex"
-                role="menuitem"
-                class="k-item k-menu-item"
-                (click)="openDialog()">
-                <span
-                    class="k-link k-menu-link">
-                    <kendo-icon-wrapper [name]="icon" [svgIcon]="svgIcon"></kendo-icon-wrapper>
-                    <span *ngIf="messageFor(command)" class="k-menu-link-text">{{messageFor(command)}}</span>
-                </span>
-            </div>
-        </ng-template>
-    `, isInline: true, dependencies: [{ kind: "component", type: ColorPickerComponent, selector: "kendo-colorpicker", inputs: ["views", "view", "activeView", "readonly", "disabled", "format", "value", "popupSettings", "paletteSettings", "gradientSettings", "icon", "iconClass", "svgIcon", "clearButton", "tabindex", "preview", "actionsLayout", "size", "rounded", "fillMode"], outputs: ["valueChange", "open", "close", "focus", "blur", "cancel", "activeColorClick", "clearButtonClick", "activeViewChange"], exportAs: ["kendoColorPicker"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetBackColorComponent, decorators: [{
-            type: Component,
-            args: [{
-                    providers: [{ provide: ToolBarToolComponent, useExisting: forwardRef(() => SpreadsheetBackColorComponent) }],
-                    selector: 'kendo-spreadsheet-backcolor-tool',
-                    template: `
-        <ng-template #toolbarTemplate>
-            <div class="k-toolbar-item">
-                <kendo-colorpicker
-                    #element
-                    [attr.title]="messageFor(command)"
-                    [format]="'hex'"
-                    [(value)]="value"
-                    [tabindex]="tabindex"
-                    (valueChange)="onValueChange($event)"
-                    [clearButton]="false"
-                    fillMode="flat"
-                    [icon]="icon"
-                    [preview]="true"
-                    [svgIcon]="svgIcon"></kendo-colorpicker>
-            </div>
-        </ng-template>
-        <ng-template #popupTemplate>
-            <div #popupButton
-                [tabindex]="tabindex"
-                role="menuitem"
-                class="k-item k-menu-item"
-                (click)="openDialog()">
-                <span
-                    class="k-link k-menu-link">
-                    <kendo-icon-wrapper [name]="icon" [svgIcon]="svgIcon"></kendo-icon-wrapper>
-                    <span *ngIf="messageFor(command)" class="k-menu-link-text">{{messageFor(command)}}</span>
-                </span>
-            </div>
-        </ng-template>
-    `,
-                    standalone: true,
-                    imports: [ColorPickerComponent, IconWrapperComponent, NgIf]
-                }]
-        }], ctorParameters: function () {
-        return [{ type: i1$1.DialogService }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }, { type: i1$2.ToolBarComponent, decorators: [{
-                        type: Inject,
-                        args: [ToolBarComponent]
-                    }] }];
-    } });
-
-/**
- * A component which changes the color of the text ([more information](ToDo).
- * @hidden
- */
-class SpreadsheetForeColorComponent extends SpreadsheetDropDownToolBase {
-    constructor(dialogService, localization, spreadsheetService, toolsService, toolbar) {
-        super('color', dialogService, localization, spreadsheetService, toolsService, toolbar);
-    }
-}
-SpreadsheetForeColorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetForeColorComponent, deps: [{ token: i1$1.DialogService }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }, { token: ToolBarComponent }], target: i0.ɵɵFactoryTarget.Component });
-SpreadsheetForeColorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetForeColorComponent, isStandalone: true, selector: "kendo-spreadsheet-forecolor-tool", providers: [{ provide: ToolBarToolComponent, useExisting: forwardRef(() => SpreadsheetForeColorComponent) }], usesInheritance: true, ngImport: i0, template: `
-        <ng-template #toolbarTemplate>
-            <div class="k-toolbar-item">
-                <kendo-colorpicker
-                    #element
-                    [attr.title]="messageFor(command)"
-                    [format]="'hex'"
-                    [(value)]="value"
-                    [tabindex]="tabindex"
-                    (valueChange)="onValueChange($event)"
-                    [clearButton]="false"
-                    fillMode="flat"
-                    [icon]="icon"
-                    [svgIcon]="svgIcon"
-                    [preview]="true"></kendo-colorpicker>
-            </div>
-        </ng-template>
-        <ng-template #popupTemplate>
-            <div #popupButton
-                [tabindex]="tabindex"
-                role="menuitem"
-                class="k-item k-menu-item"
-                (click)="openDialog()">
-                <span
-                    class="k-link k-menu-link">
-                    <kendo-icon-wrapper [name]="icon" [svgIcon]="svgIcon"></kendo-icon-wrapper>
-                    <span *ngIf="messageFor(command)" class="k-menu-link-text">{{messageFor(command)}}</span>
-                </span>
-            </div>
-        </ng-template>
-    `, isInline: true, dependencies: [{ kind: "component", type: ColorPickerComponent, selector: "kendo-colorpicker", inputs: ["views", "view", "activeView", "readonly", "disabled", "format", "value", "popupSettings", "paletteSettings", "gradientSettings", "icon", "iconClass", "svgIcon", "clearButton", "tabindex", "preview", "actionsLayout", "size", "rounded", "fillMode"], outputs: ["valueChange", "open", "close", "focus", "blur", "cancel", "activeColorClick", "clearButtonClick", "activeViewChange"], exportAs: ["kendoColorPicker"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetForeColorComponent, decorators: [{
-            type: Component,
-            args: [{
-                    providers: [{ provide: ToolBarToolComponent, useExisting: forwardRef(() => SpreadsheetForeColorComponent) }],
-                    selector: 'kendo-spreadsheet-forecolor-tool',
-                    template: `
-        <ng-template #toolbarTemplate>
-            <div class="k-toolbar-item">
-                <kendo-colorpicker
-                    #element
-                    [attr.title]="messageFor(command)"
-                    [format]="'hex'"
-                    [(value)]="value"
-                    [tabindex]="tabindex"
-                    (valueChange)="onValueChange($event)"
-                    [clearButton]="false"
-                    fillMode="flat"
-                    [icon]="icon"
-                    [svgIcon]="svgIcon"
-                    [preview]="true"></kendo-colorpicker>
-            </div>
-        </ng-template>
-        <ng-template #popupTemplate>
-            <div #popupButton
-                [tabindex]="tabindex"
-                role="menuitem"
-                class="k-item k-menu-item"
-                (click)="openDialog()">
-                <span
-                    class="k-link k-menu-link">
-                    <kendo-icon-wrapper [name]="icon" [svgIcon]="svgIcon"></kendo-icon-wrapper>
-                    <span *ngIf="messageFor(command)" class="k-menu-link-text">{{messageFor(command)}}</span>
-                </span>
-            </div>
-        </ng-template>
-    `,
-                    standalone: true,
-                    imports: [ColorPickerComponent, IconWrapperComponent, NgIf]
-                }]
-        }], ctorParameters: function () {
-        return [{ type: i1$1.DialogService }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }, { type: i1$2.ToolBarComponent, decorators: [{
-                        type: Inject,
-                        args: [ToolBarComponent]
-                    }] }];
-    } });
-
-/**
- * @hidden
- */
-class SpreadsheetUnderlineDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService) {
-        super('underline', button, localization, spreadsheetService, toolsService, {
-            command: 'PropertyChangeCommand',
-            options: { property: 'underline',
-                value: !button.selected
-            }
-        });
-    }
-}
-SpreadsheetUnderlineDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetUnderlineDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetUnderlineDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetUnderlineDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetUnderline]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetUnderlineDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetUnderline]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetItalicDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService) {
-        super('italic', button, localization, spreadsheetService, toolsService, {
-            command: 'PropertyChangeCommand',
-            options: { property: 'italic',
-                value: !button.selected
-            }
-        });
-    }
-}
-SpreadsheetItalicDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetItalicDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetItalicDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetItalicDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetItalic]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetItalicDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetItalic]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetBoldDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService) {
-        super('bold', button, localization, spreadsheetService, toolsService, {
-            command: 'PropertyChangeCommand',
-            options: { property: 'bold',
-                value: !button.selected
-            }
-        });
-    }
-}
-SpreadsheetBoldDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetBoldDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetBoldDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetBoldDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetBold]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetBoldDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetBold]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetDecreaseFontSizeDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService) {
-        super('decreaseFontSize', button, localization, spreadsheetService, toolsService, {
-            command: 'PropertyChangeCommand',
-            options: { property: 'fontSize' }
-        });
-        this.value = DEFAULT_FONT_VALUES.fontSize;
-    }
-    clickHandler() {
-        const newValue = this.value - 1;
-        const options = {
-            command: 'PropertyChangeCommand',
-            options: { property: 'fontSize', value: newValue || null }
-        };
-        this.spreadsheetService.spreadsheet.executeCommand(options);
-    }
-    ngAfterViewInit() {
-        this.value = this.toolsService.toolsState['fontSize'];
-        this.subs.add(this.toolsService.stateChange.subscribe(state => {
-            this.value = state['fontSize'];
-        }));
-    }
-}
-SpreadsheetDecreaseFontSizeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetDecreaseFontSizeDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetDecreaseFontSizeDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetDecreaseFontSizeDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseFontSize]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetDecreaseFontSizeDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetDecreaseFontSize]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetIncreaseFontSizeDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService) {
-        super('increaseFontSize', button, localization, spreadsheetService, toolsService, {
-            command: 'PropertyChangeCommand',
-            options: { property: 'fontSize' }
-        });
-        this.value = DEFAULT_FONT_VALUES.fontSize;
-    }
-    clickHandler() {
-        const newValue = this.value + 1;
-        const options = {
-            command: 'PropertyChangeCommand',
-            options: { property: 'fontSize', value: newValue || null }
-        };
-        this.spreadsheetService.spreadsheet.executeCommand(options);
-    }
-    ngAfterViewInit() {
-        this.value = this.toolsService.toolsState['fontSize'];
-        this.subs.add(this.toolsService.stateChange.subscribe(state => {
-            this.value = state['fontSize'];
-        }));
-    }
-}
-SpreadsheetIncreaseFontSizeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetIncreaseFontSizeDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetIncreaseFontSizeDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetIncreaseFontSizeDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseFontSize]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetIncreaseFontSizeDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetIncreaseFontSize]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * A component which configures an existing `DropDownListComponent` as a Spreadsheet tool
- * ([see example](ToDo).
- * The component associates a `kendo-toolbar-dropdownlist` with a Spreadsheet command that changes the font size of a content block and
- * automatically defines the options of the drop-down list and sets its values ([see example](ToDo).
- *
- * @hidden
- */
-class SpreadsheetFontSizeComponent extends SpreadsheetDropDownToolBase {
-    constructor(dialogService, localization, spreadsheetService, toolsService, toolbar) {
-        super('fontSize', dialogService, localization, spreadsheetService, toolsService, toolbar);
-    }
-}
-SpreadsheetFontSizeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetFontSizeComponent, deps: [{ token: i1$1.DialogService }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }, { token: ToolBarComponent }], target: i0.ɵɵFactoryTarget.Component });
-SpreadsheetFontSizeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetFontSizeComponent, isStandalone: true, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontSize]", providers: [{ provide: ToolBarToolComponent, useExisting: forwardRef(() => SpreadsheetFontSizeComponent) }], usesInheritance: true, ngImport: i0, template: `
-        <ng-template #toolbarTemplate>
-            <kendo-spreadsheet-fontsize-dropdownlist
-                #element
-                [data]="data"
-                [(value)]="value"
-                [title]="messageFor(command)"
-                [tabindex]="tabindex"
-                (valueChange)="onValueChange($event)"></kendo-spreadsheet-fontsize-dropdownlist>
-        </ng-template>
-        <ng-template #popupTemplate>
-            <div #popupButton
-                [tabindex]="tabindex"
-                role="menuitem"
-                class="k-item k-menu-item"
-                (click)="openDialog()">
-                <span
-                    class="k-link k-menu-link">
-                    <kendo-icon-wrapper [name]="icon" [svgIcon]="svgIcon"></kendo-icon-wrapper>
-                    <span *ngIf="messageFor(command)" class="k-menu-link-text">{{messageFor(command)}}</span>
-                </span>
-            </div>
-        </ng-template>
-    `, isInline: true, dependencies: [{ kind: "component", type: FontSizeDropDownListComponent, selector: "kendo-spreadsheet-fontsize-dropdownlist" }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetFontSizeComponent, decorators: [{
-            type: Component,
-            args: [{
-                    providers: [{ provide: ToolBarToolComponent, useExisting: forwardRef(() => SpreadsheetFontSizeComponent) }],
-                    selector: 'kendo-toolbar-dropdownlist[kendoSpreadsheetFontSize]',
-                    template: `
-        <ng-template #toolbarTemplate>
-            <kendo-spreadsheet-fontsize-dropdownlist
-                #element
-                [data]="data"
-                [(value)]="value"
-                [title]="messageFor(command)"
-                [tabindex]="tabindex"
-                (valueChange)="onValueChange($event)"></kendo-spreadsheet-fontsize-dropdownlist>
-        </ng-template>
-        <ng-template #popupTemplate>
-            <div #popupButton
-                [tabindex]="tabindex"
-                role="menuitem"
-                class="k-item k-menu-item"
-                (click)="openDialog()">
-                <span
-                    class="k-link k-menu-link">
-                    <kendo-icon-wrapper [name]="icon" [svgIcon]="svgIcon"></kendo-icon-wrapper>
-                    <span *ngIf="messageFor(command)" class="k-menu-link-text">{{messageFor(command)}}</span>
-                </span>
-            </div>
-        </ng-template>
-    `,
-                    standalone: true,
-                    imports: [FontSizeDropDownListComponent, IconWrapperComponent, NgIf]
-                }]
-        }], ctorParameters: function () {
-        return [{ type: i1$1.DialogService }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }, { type: i1$2.ToolBarComponent, decorators: [{
-                        type: Inject,
-                        args: [ToolBarComponent]
-                    }] }];
-    } });
-
-/**
- * A component which configures an existing `DropDownListComponent` as a Spreadsheet tool
- * ([see example](ToDo).
- * The component associates a `kendo-toolbar-dropdownlist` with a Spreadsheet command that changes the font family of a content block and
- * automatically defines the options of the drop-down list and sets its values ([see example](ToDo).
- *
- * @hidden
- */
-class SpreadsheetFontFamilyComponent extends SpreadsheetDropDownToolBase {
-    constructor(dialogService, localization, spreadsheetService, toolsService, toolbar) {
-        super('fontFamily', dialogService, localization, spreadsheetService, toolsService, toolbar);
-    }
-}
-SpreadsheetFontFamilyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetFontFamilyComponent, deps: [{ token: i1$1.DialogService }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }, { token: ToolBarComponent }], target: i0.ɵɵFactoryTarget.Component });
-SpreadsheetFontFamilyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetFontFamilyComponent, isStandalone: true, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontFamily]", providers: [{ provide: ToolBarToolComponent, useExisting: forwardRef(() => SpreadsheetFontFamilyComponent) }], usesInheritance: true, ngImport: i0, template: `
-        <ng-template #toolbarTemplate>
-            <kendo-spreadsheet-fontfamily-dropdownlist
-                #element
-                [data]="data"
-                [(value)]="value"
-                [title]="messageFor(command)"
-                [tabindex]="tabindex"
-                (valueChange)="onValueChange($event)"></kendo-spreadsheet-fontfamily-dropdownlist>
-        </ng-template>
-        <ng-template #popupTemplate>
-            <div #popupButton
-                [tabindex]="tabindex"
-                role="menuitem"
-                class="k-item k-menu-item"
-                (click)="openDialog()">
-                <span
-                    class="k-link k-menu-link">
-                    <kendo-icon-wrapper [name]="icon" [svgIcon]="svgIcon"></kendo-icon-wrapper>
-                    <span *ngIf="messageFor(command)" class="k-menu-link-text">{{messageFor(command)}}</span>
-                </span>
-            </div>
-        </ng-template>
-    `, isInline: true, dependencies: [{ kind: "component", type: FontFamilyDropDownListComponent, selector: "kendo-spreadsheet-fontfamily-dropdownlist" }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetFontFamilyComponent, decorators: [{
-            type: Component,
-            args: [{
-                    providers: [{ provide: ToolBarToolComponent, useExisting: forwardRef(() => SpreadsheetFontFamilyComponent) }],
-                    selector: 'kendo-toolbar-dropdownlist[kendoSpreadsheetFontFamily]',
-                    template: `
-        <ng-template #toolbarTemplate>
-            <kendo-spreadsheet-fontfamily-dropdownlist
-                #element
-                [data]="data"
-                [(value)]="value"
-                [title]="messageFor(command)"
-                [tabindex]="tabindex"
-                (valueChange)="onValueChange($event)"></kendo-spreadsheet-fontfamily-dropdownlist>
-        </ng-template>
-        <ng-template #popupTemplate>
-            <div #popupButton
-                [tabindex]="tabindex"
-                role="menuitem"
-                class="k-item k-menu-item"
-                (click)="openDialog()">
-                <span
-                    class="k-link k-menu-link">
-                    <kendo-icon-wrapper [name]="icon" [svgIcon]="svgIcon"></kendo-icon-wrapper>
-                    <span *ngIf="messageFor(command)" class="k-menu-link-text">{{messageFor(command)}}</span>
-                </span>
-            </div>
-        </ng-template>
-    `,
-                    standalone: true,
-                    imports: [FontFamilyDropDownListComponent, IconWrapperComponent, NgIf]
-                }]
-        }], ctorParameters: function () {
-        return [{ type: i1$1.DialogService }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }, { type: i1$2.ToolBarComponent, decorators: [{
-                        type: Inject,
-                        args: [ToolBarComponent]
-                    }] }];
-    } });
-
-/**
- * @hidden
- */
-class SpreadsheetRedoDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService) {
-        super('redo', button, localization, spreadsheetService, toolsService, {
-            options: { property: 'redo' }
-        });
-    }
-    clickHandler() {
-        this.spreadsheetService.spreadsheet.workbook.undoRedoStack['redo']();
-    }
-}
-SpreadsheetRedoDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetRedoDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetRedoDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetRedoDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetRedo]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetRedoDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetRedo]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetUndoDirective extends SpreadsheetCommandButton {
-    constructor(button, localization, spreadsheetService, toolsService) {
-        super('undo', button, localization, spreadsheetService, toolsService, {
-            options: { property: 'undo' }
-        });
-    }
-    clickHandler() {
-        this.spreadsheetService.spreadsheet.workbook.undoRedoStack['undo']();
-    }
-}
-SpreadsheetUndoDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetUndoDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetUndoDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetUndoDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetUndo]", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetUndoDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'kendo-toolbar-button[kendoSpreadsheetUndo]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetSaveFileDirective {
-    constructor(button, localization, spreadsheetService) {
-        this.button = button;
-        this.localization = localization;
-        this.spreadsheetService = spreadsheetService;
-        this.subs = new Subscription();
-    }
-    ngOnInit() {
-        this.button.title = this.localization.get('saveFile');
-        this.button.icon = commandIcons['download'];
-        this.button.svgIcon = commandSVGIcons['download'];
-        this.button.fillMode = 'flat';
-        this.subs.add(this.button.click.subscribe(() => {
-            const spreadsheet = this.spreadsheetService.spreadsheet;
-            if (spreadsheet) {
-                spreadsheet.saveAsExcel(Object.assign(Object.assign({}, spreadsheet.options.excel), { saveAs,
-                    Workbook }));
-            }
-        }));
-    }
-    ngOnDestroy() {
-        this.subs.unsubscribe();
-    }
-}
-SpreadsheetSaveFileDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetSaveFileDirective, deps: [{ token: i1$2.ToolBarButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetSaveFileDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetSaveFileDirective, isStandalone: true, selector: "[kendoSpreadsheetSaveFile]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetSaveFileDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoSpreadsheetSaveFile]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetLoadFileComponent extends ToolBarToolComponent {
-    constructor(localization, spreadsheetService, toolbar) {
-        super();
-        this.localization = localization;
-        this.spreadsheetService = spreadsheetService;
-        this.toolbar = toolbar;
-        this.icon = commandIcons['folderOpen'];
-        this.svgIcon = commandSVGIcons['folderOpen'];
-        this.tabindex = -1;
-        this.onFileSelect = (e) => {
-            const file = e.target.files[0];
-            if (file) {
-                this.spreadsheetService.spreadsheet.executeCommand({ command: 'OpenCommand', options: { file } });
-                e.target.value = null;
-            }
-        };
-        this.isBuiltInTool = true;
-    }
-    /**
-     * @hidden
-     */
-    messageFor(key) {
-        return this.localization.get(key);
-    }
-    /**
-     * @hidden
-     */
-    canFocus() {
-        return true;
-    }
-    /**
-     * @hidden
-     */
-    focus() {
-        this.tabindex = 0;
-        if (this.overflows) {
-            this.overflowButtonElement.nativeElement.focus();
-        }
-        else {
-            this.button.focus();
-        }
-    }
-    /**
-     * @hidden
-     */
-    handleKey() {
-        this.tabindex = -1;
-        return false;
-    }
-}
-SpreadsheetLoadFileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetLoadFileComponent, deps: [{ token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: ToolBarComponent }], target: i0.ɵɵFactoryTarget.Component });
-SpreadsheetLoadFileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetLoadFileComponent, isStandalone: true, selector: "kendo-spreadsheet-load-file-tool", providers: [
-        {
-            provide: ToolBarToolComponent,
-            useExisting: forwardRef(() => SpreadsheetLoadFileComponent),
-        },
-    ], viewQueries: [{ propertyName: "toolbarTemplate", first: true, predicate: ["toolbarTemplate"], descendants: true, static: true }, { propertyName: "popupTemplate", first: true, predicate: ["popupTemplate"], descendants: true, static: true }, { propertyName: "overflowButtonElement", first: true, predicate: ["overflowButton"], descendants: true, read: ElementRef }, { propertyName: "button", first: true, predicate: ["button"], descendants: true }], usesInheritance: true, ngImport: i0, template: `
-        <ng-template #toolbarTemplate>
-            <button
-                #button
-                type="button"
-                kendoButton
-                [title]="messageFor('loadFile')"
-                fillMode="flat"
-                [icon]="icon"
-                [svgIcon]="svgIcon"
-                (click)="fileSelectEl.click()"></button>
-            <input
-                #fileSelectEl
-                type="file"
-                (change)="onFileSelect($event)"
-                [style.display]="'none'"
-                aria-hidden="true"
-                accept=".xlsx,.XLSX" />
-        </ng-template>
-        <ng-template #popupTemplate>
-            <div
-                #overflowButton
-                tabindex="-1"
-                role="menuitem"
-                class="k-item k-menu-item"
-                (click)="toolbar.toggle(false); popupFileSelectEl.click()">
-                <span
-                    class="k-link k-menu-link">
-                    <kendo-icon-wrapper
-                        [name]="icon"
-                        [svgIcon]="svgIcon"
-                    ></kendo-icon-wrapper>
-                    <span class="k-menu-link-text">{{messageFor('loadFile')}}</span>
-                </span>
-                <input
-                    #popupFileSelectEl
-                    type="file"
-                    (change)="onFileSelect($event)"
-                    [style.display]="'none'"
-                    aria-hidden="true"
-                    accept=".xlsx,.XLSX" />
-            </div>
-        </ng-template>
-    `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetLoadFileComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'kendo-spreadsheet-load-file-tool',
-                    providers: [
-                        {
-                            provide: ToolBarToolComponent,
-                            useExisting: forwardRef(() => SpreadsheetLoadFileComponent),
-                        },
-                    ],
-                    template: `
-        <ng-template #toolbarTemplate>
-            <button
-                #button
-                type="button"
-                kendoButton
-                [title]="messageFor('loadFile')"
-                fillMode="flat"
-                [icon]="icon"
-                [svgIcon]="svgIcon"
-                (click)="fileSelectEl.click()"></button>
-            <input
-                #fileSelectEl
-                type="file"
-                (change)="onFileSelect($event)"
-                [style.display]="'none'"
-                aria-hidden="true"
-                accept=".xlsx,.XLSX" />
-        </ng-template>
-        <ng-template #popupTemplate>
-            <div
-                #overflowButton
-                tabindex="-1"
-                role="menuitem"
-                class="k-item k-menu-item"
-                (click)="toolbar.toggle(false); popupFileSelectEl.click()">
-                <span
-                    class="k-link k-menu-link">
-                    <kendo-icon-wrapper
-                        [name]="icon"
-                        [svgIcon]="svgIcon"
-                    ></kendo-icon-wrapper>
-                    <span class="k-menu-link-text">{{messageFor('loadFile')}}</span>
-                </span>
-                <input
-                    #popupFileSelectEl
-                    type="file"
-                    (change)="onFileSelect($event)"
-                    [style.display]="'none'"
-                    aria-hidden="true"
-                    accept=".xlsx,.XLSX" />
-            </div>
-        </ng-template>
-    `,
-                    standalone: true,
-                    imports: [ButtonComponent, IconWrapperComponent]
-                }]
-        }], ctorParameters: function () {
-        return [{ type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: i1$2.ToolBarComponent, decorators: [{
-                        type: Inject,
-                        args: [ToolBarComponent]
-                    }] }];
-    }, propDecorators: { toolbarTemplate: [{
-                type: ViewChild,
-                args: ['toolbarTemplate', { static: true }]
-            }], popupTemplate: [{
-                type: ViewChild,
-                args: ['popupTemplate', { static: true }]
-            }], overflowButtonElement: [{
-                type: ViewChild,
-                args: ['overflowButton', { read: ElementRef, static: false }]
-            }], button: [{
-                type: ViewChild,
-                args: ['button']
-            }] } });
-
-/**
- * @hidden
- */
-class MainMenuDirective {
-    constructor(host, renderer) {
-        this.host = host;
-        this.renderer = renderer;
-    }
-    ngAfterViewInit() {
-        isDocumentAvailable() && this.renderer.addClass(this.host.nativeElement.firstElementChild, 'k-spreadsheet-menu');
-    }
-}
-MainMenuDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MainMenuDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
-MainMenuDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: MainMenuDirective, isStandalone: true, selector: "[kendoSpreadsheetMenu]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MainMenuDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoSpreadsheetMenu]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }]; } });
-
-/**
- * @hidden
- */
-class MessagesDirective extends ComponentMessages {
-}
-MessagesDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MessagesDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-MessagesDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: MessagesDirective, isStandalone: true, selector: "[kendoSpreadsheetMessages]", inputs: { home: "home", file: "file", insert: "insert", formatTab: "formatTab", saveFile: "saveFile", loadFile: "loadFile", bold: "bold", italic: "italic", underline: "underline", format: "format", fontFamily: "fontFamily", fontSize: "fontSize", undo: "undo", redo: "redo", background: "background", color: "color", gridLines: "gridLines", addColumnLeft: "addColumnLeft", addColumnRight: "addColumnRight", addRowBelow: "addRowBelow", addRowAbove: "addRowAbove", deleteColumn: "deleteColumn", deleteRow: "deleteRow", wrap: "wrap", align: "align", alignHorizontal: "alignHorizontal", alignVertical: "alignVertical", alignLeft: "alignLeft", alignCenter: "alignCenter", alignRight: "alignRight", alignJustify: "alignJustify", alignTop: "alignTop", alignMiddle: "alignMiddle", alignBottom: "alignBottom", dialogApply: "dialogApply", dialogCancel: "dialogCancel", dialogDelete: "dialogDelete", dialogRename: "dialogRename", dialogInsert: "dialogInsert", dialogRemoveLink: "dialogRemoveLink", delete: "delete", rename: "rename", nameBox: "nameBox", formulaInput: "formulaInput", addSheet: "addSheet", sheetsMenu: "sheetsMenu", view: "view", merge: "merge", mergeHorizontally: "mergeHorizontally", mergeVertically: "mergeVertically", mergeAll: "mergeAll", unmerge: "unmerge", insertLink: "insertLink", increaseDecimal: "increaseDecimal", decreaseDecimal: "decreaseDecimal", increaseFontSize: "increaseFontSize", decreaseFontSize: "decreaseFontSize", openUnsupported: "openUnsupported", modifyMerged: "modifyMerged", cannotModifyDisabled: "cannotModifyDisabled", dialogOk: "dialogOk", dialogError: "dialogError", duplicateSheetName: "duplicateSheetName", copy: "copy", cut: "cut", paste: "paste", hideRow: "hideRow", unhideRow: "unhideRow", hideColumn: "hideColumn", unhideColumn: "unhideColumn", sheetDelete: "sheetDelete", sheetRename: "sheetRename", sheetHide: "sheetHide", sheetDuplicate: "sheetDuplicate", sheetMoveLeft: "sheetMoveLeft", sheetMoveRight: "sheetMoveRight", invalidNameError: "invalidNameError" }, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MessagesDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoSpreadsheetMessages]',
-                    standalone: true
-                }]
-        }], propDecorators: { home: [{
-                type: Input
-            }], file: [{
-                type: Input
-            }], insert: [{
-                type: Input
-            }], formatTab: [{
-                type: Input
-            }], saveFile: [{
-                type: Input
-            }], loadFile: [{
-                type: Input
-            }], bold: [{
-                type: Input
-            }], italic: [{
-                type: Input
-            }], underline: [{
-                type: Input
-            }], format: [{
-                type: Input
-            }], fontFamily: [{
-                type: Input
-            }], fontSize: [{
-                type: Input
-            }], undo: [{
-                type: Input
-            }], redo: [{
-                type: Input
-            }], background: [{
-                type: Input
-            }], color: [{
-                type: Input
-            }], gridLines: [{
-                type: Input
-            }], addColumnLeft: [{
-                type: Input
-            }], addColumnRight: [{
-                type: Input
-            }], addRowBelow: [{
-                type: Input
-            }], addRowAbove: [{
-                type: Input
-            }], deleteColumn: [{
-                type: Input
-            }], deleteRow: [{
-                type: Input
-            }], wrap: [{
-                type: Input
-            }], align: [{
-                type: Input
-            }], alignHorizontal: [{
-                type: Input
-            }], alignVertical: [{
-                type: Input
-            }], alignLeft: [{
-                type: Input
-            }], alignCenter: [{
-                type: Input
-            }], alignRight: [{
-                type: Input
-            }], alignJustify: [{
-                type: Input
-            }], alignTop: [{
-                type: Input
-            }], alignMiddle: [{
-                type: Input
-            }], alignBottom: [{
-                type: Input
-            }], dialogApply: [{
-                type: Input
-            }], dialogCancel: [{
-                type: Input
-            }], dialogDelete: [{
-                type: Input
-            }], dialogRename: [{
-                type: Input
-            }], dialogInsert: [{
-                type: Input
-            }], dialogRemoveLink: [{
-                type: Input
-            }], delete: [{
-                type: Input
-            }], rename: [{
-                type: Input
-            }], nameBox: [{
-                type: Input
-            }], formulaInput: [{
-                type: Input
-            }], addSheet: [{
-                type: Input
-            }], sheetsMenu: [{
-                type: Input
-            }], view: [{
-                type: Input
-            }], merge: [{
-                type: Input
-            }], mergeHorizontally: [{
-                type: Input
-            }], mergeVertically: [{
-                type: Input
-            }], mergeAll: [{
-                type: Input
-            }], unmerge: [{
-                type: Input
-            }], insertLink: [{
-                type: Input
-            }], increaseDecimal: [{
-                type: Input
-            }], decreaseDecimal: [{
-                type: Input
-            }], increaseFontSize: [{
-                type: Input
-            }], decreaseFontSize: [{
-                type: Input
-            }], openUnsupported: [{
-                type: Input
-            }], modifyMerged: [{
-                type: Input
-            }], cannotModifyDisabled: [{
-                type: Input
-            }], dialogOk: [{
-                type: Input
-            }], dialogError: [{
-                type: Input
-            }], duplicateSheetName: [{
-                type: Input
-            }], copy: [{
-                type: Input
-            }], cut: [{
-                type: Input
-            }], paste: [{
-                type: Input
-            }], hideRow: [{
-                type: Input
-            }], unhideRow: [{
-                type: Input
-            }], hideColumn: [{
-                type: Input
-            }], unhideColumn: [{
-                type: Input
-            }], sheetDelete: [{
-                type: Input
-            }], sheetRename: [{
-                type: Input
-            }], sheetHide: [{
-                type: Input
-            }], sheetDuplicate: [{
-                type: Input
-            }], sheetMoveLeft: [{
-                type: Input
-            }], sheetMoveRight: [{
-                type: Input
-            }], invalidNameError: [{
-                type: Input
-            }] } });
-
-/**
- * @hidden
- */
-class LocalizedMessagesDirective extends MessagesDirective {
-    constructor(service) {
-        super();
-        this.service = service;
-    }
-}
-LocalizedMessagesDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LocalizedMessagesDirective, deps: [{ token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
-LocalizedMessagesDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: LocalizedMessagesDirective, isStandalone: true, selector: "[kendoSpreadsheetLocalizedMessages]", providers: [{
-            provide: MessagesDirective,
-            useExisting: forwardRef(() => LocalizedMessagesDirective)
-        }], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LocalizedMessagesDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    providers: [{
-                            provide: MessagesDirective,
-                            useExisting: forwardRef(() => LocalizedMessagesDirective)
-                        }],
-                    selector: '[kendoSpreadsheetLocalizedMessages]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i2.LocalizationService }]; } });
-
-/**
- * Represents the [Kendo UI Spreadsheet component for Angular]({% slug overview_spreadsheet %}).
- */
-class SpreadsheetComponent {
-    constructor(ngZone, intl, host, localization, spreadsheetService, toolsService, errorService, dialogService) {
-        this.ngZone = ngZone;
-        this.intl = intl;
-        this.host = host;
-        this.localization = localization;
-        this.spreadsheetService = spreadsheetService;
-        this.toolsService = toolsService;
-        this.errorService = errorService;
-        this.dialogService = dialogService;
-        this.hostClass = true;
-        this.role = 'application';
-        /**
-         * Sets the overflow option of the built-in Toolbar components.
-         * @default false
-         */
-        this.overflow = false;
-        /**
-         * Sets the height of the formula list container.
-         * Accepts same values as the CSS [`style.height`](https://developer.mozilla.org/en-US/docs/Web/CSS/height) property.
-         *
-         * @default '300px'
-         */
-        this.formulaListMaxHeight = '300px';
-        /**
-         * The number of columns in the document.
-         *
-         * @default 50
-         */
-        this.columns = 50;
-        /**
-         * The initial column width in pixels.
-         *
-         * @default 100
-         */
-        this.columnWidth = 100;
-        /**
-         * The height of the header row in pixels.
-         *
-         * @default 30
-         */
-        this.headerHeight = 30;
-        /**
-         * The width of the header column in pixels.
-         *
-         * @default 32
-         */
-        this.headerWidth = 32;
-        /**
-         * The initial row height in pixels.
-         *
-         * @default 30
-         */
-        this.rowHeight = 30;
-        /**
-         * The number of rows in the document.
-         *
-         * @default 200
-         */
-        this.rows = 200;
-        /**
-         * Fired when a value in the Spreadsheet is changed. Exposes the `SpreadsheetWidget` instance and the selected `Range` as event data.
-         */
-        this.change = new EventEmitter();
-        /**
-         * Fired when the selected range format is changed from the UI. Exposes the `SpreadsheetWidget` instance and the selected `Range` as event data.
-         */
-        this.formatChange = new EventEmitter();
-        /**
-         * Fired when the selection is changed by the end user. Exposes the `SpreadsheetWidget` instance and the selected `Range` as event data.
-         */
-        this.selectionChange = new EventEmitter();
-        /**
-         * Fired when the end user clicks the Export to Excel toolbar button.
-         * The event is preventable and exposes the `Workbook` object, a `preventDefault` method
-         * (if invoked, the generated file will not be saved), and the SpreadsheetWidget instance.
-         */
-        this.excelExport = new EventEmitter();
-        /**
-         * Fired when the end user clicks the Open toolbar button.
-         * The event is preventable and exposes the selected `File` or `Blob`, a `preventDefault` method
-         * (if invoked, the selected file will not be loaded), and the SpreadsheetWidget instance.
-         */
-        this.excelImport = new EventEmitter();
-        /**
-         * Fired when the active sheet is about to change.
-         * The event exposes the new active `Sheet` and the SpreadsheetWidget instance.
-         */
-        this.activeSheetChange = new EventEmitter();
-        this.formulaFxIcon = formulaFxIcon;
-        this.folderOpenIcon = folderOpenIcon;
-        this.downloadIcon = downloadIcon;
-        this.showLicenseWatermark = false;
-        this.contextMenuItems = [];
-        this.subs = new Subscription();
-        /**
-         * @hidden
-         */
-        this.onKeyDown = (e) => {
-            const isCtrl = e.ctrlKey || e.metaKey;
-            const shift = e.shiftKey;
-            if (isCtrl && shift && e.keyCode === Keys.KeyS) {
-                this.spreadsheetService.onSheetsBarFocus.next();
-            }
-        };
-        this.onChange = (e) => {
-            hasObservers(this.change) && this.change.emit(e);
-            this.spreadsheetService.selectionChanged.next(e.range);
-        };
-        this.onSelectionChange = (e) => {
-            hasObservers(this.selectionChange) && this.selectionChange.emit(e);
-            this.spreadsheetService.selectionChanged.next(e.range);
-        };
-        this.onChangeFormat = (e) => {
-            hasObservers(this.formatChange) && this.formatChange.emit(e);
-            this.spreadsheetService.selectionChanged.next(e.range);
-        };
-        this.onExcelExport = (e) => hasObservers(this.excelExport) && this.excelExport.emit(e);
-        this.onExcelImport = (e) => hasObservers(this.excelImport) && this.excelImport.emit(e);
-        this.onActiveSheetChanged = (sheet) => {
-            const eventArgs = { sender: this.spreadsheetService.spreadsheet, sheet };
-            hasObservers(this.activeSheetChange) && this.activeSheetChange.emit(eventArgs);
-            const range = sheet.range(sheet.activeCell());
-            this.spreadsheetService.selectionChanged.next(range);
-        };
-        this.updateState = (e) => {
-            var _a;
-            this.toolsService.updateTools(e);
-            if ((_a = e.reason) === null || _a === void 0 ? void 0 : _a.sheetSelection) {
-                this.sheets = mapToSheetDescriptor(this.spreadsheetService.spreadsheet.sheets());
-            }
-        };
-        this.onMessage = (e) => {
-            this.ngZone.run(() => {
-                this.errorService.handleErrorMessage(e);
-            });
-        };
-        const isValid = validatePackage(packageMetadata);
-        this.showLicenseWatermark = shouldShowValidationUI(isValid);
-        ngZone.onStable.pipe(take(1)).subscribe(() => {
-            if (!this.menuItems) {
-                this._menuItems = [{
-                        id: 'file',
-                        text: this.messageFor('file')
-                    }, {
-                        id: 'home',
-                        text: this.messageFor('home'),
-                        active: true,
-                        cssClass: 'k-active'
-                    }, {
-                        id: 'insert',
-                        text: this.messageFor('insert')
-                    }, {
-                        id: 'format',
-                        text: this.messageFor('formatTab')
-                    }, {
-                        id: 'view',
-                        text: this.messageFor('view')
-                    }];
-            }
-            this.selectedMenuItem = this.menuItems[1];
-        });
-    }
-    /**
-     * The menu items configuration.
-     */
-    set menuItems(items) {
-        this._menuItems = [];
-        this.ngZone.onStable.pipe(take(1)).subscribe(() => {
-            const normalizedItems = items.map(item => ({
-                active: item.active,
-                text: item.id === 'format' ? this.messageFor('formatTab') : this.messageFor(item.id),
-                cssClass: item.active ? 'k-active' : null,
-                id: item.id
-            }));
-            this._menuItems = normalizedItems;
-            const activeItemIndex = this.menuItems.findIndex(item => item.active);
-            this.selectedMenuItem = this.menuItems[activeItemIndex > -1 ? activeItemIndex : 0];
-        });
-    }
-    get menuItems() {
-        return this._menuItems;
-    }
-    /**
-     * The name of the currently active sheet. Must match one of the sheet names.
-     */
-    set activeSheet(value) {
-        var _a, _b;
-        this._activeSheet = value;
-        (_b = (_a = this.spreadsheetService.spreadsheet) === null || _a === void 0 ? void 0 : _a.view) === null || _b === void 0 ? void 0 : _b.sheetsbar.onSheetSelect(this.activeSheet);
-    }
-    get activeSheet() {
-        var _a, _b;
-        return this._activeSheet || ((_b = (_a = this.spreadsheetService.spreadsheet) === null || _a === void 0 ? void 0 : _a.activeSheet()) === null || _b === void 0 ? void 0 : _b.name());
-    }
-    /**
-     * An array which defines the document sheets and their content.
-     */
-    set sheets(value) {
-        const items = value.map((item, index, items) => (Object.assign(Object.assign({}, item), { state: item.state || 'visible', inEdit: false, first: index === 0, last: index === items.length - 1, text: item.name, active: (item.name === this.activeSheet) || items.length === 1, index })));
-        this._sheetsInfo = items;
-    }
-    get sheetsInfo() {
-        return this._sheetsInfo;
-    }
-    get spreadsheetWidget() {
-        return this.spreadsheetService.spreadsheet;
-    }
-    ngAfterViewInit() {
-        if (!isDocumentAvailable()) {
-            return;
-        }
-        this.ngZone.runOutsideAngular(() => {
-            setTimeout(() => {
-                var _a;
-                const spreadsheet = this.spreadsheetService.spreadsheet = new SpreadsheetWidget(this.host.nativeElement, this.options);
-                spreadsheet.bind('select', this.onSelectionChange);
-                spreadsheet.bind('change', this.onChange);
-                spreadsheet.bind('changeFormat', this.onChangeFormat);
-                spreadsheet.bind('excelImport', this.onExcelImport);
-                spreadsheet.bind('excelExport', this.onExcelExport);
-                spreadsheet.bind('keydown', this.onKeyDown);
-                spreadsheet.view.bind('update', this.updateState);
-                spreadsheet.view.bind('message', this.onMessage);
-                spreadsheet.bind('contextmenu', this.onContextMenu.bind(this));
-                const sheet = spreadsheet.activeSheet();
-                if (sheet) {
-                    this.updateState({ range: sheet.range(sheet.activeCell()) });
-                }
-                this.updateActiveSheet(this.activeSheet || ((_a = spreadsheet === null || spreadsheet === void 0 ? void 0 : spreadsheet.activeSheet()) === null || _a === void 0 ? void 0 : _a.name()));
-                if (!this.sheetsInfo) {
-                    this.ngZone.run(() => {
-                        const defaultSheetDescriptors = mapToSheetDescriptor([spreadsheet === null || spreadsheet === void 0 ? void 0 : spreadsheet.activeSheet()]);
-                        this._sheetsInfo = [Object.assign(Object.assign({ text: this.spreadsheetService.currentActiveSheet, first: true, last: true, state: 'visible' }, defaultSheetDescriptors), { sheetActions: getSheetActions(defaultSheetDescriptors).map(item => (Object.assign(Object.assign({}, item), { text: this.messageFor(item.messageKey) }))) })];
-                    });
-                }
-            });
-            this.subs.add(this.spreadsheetService.sheetsChanged.subscribe(this.onSheetsChanged.bind(this)));
-            this.subs.add(this.spreadsheetService.activeSheetChanged.subscribe(this.onActiveSheetChanged.bind(this)));
-            this.subs.add(this.spreadsheetService.selectionChanged.subscribe(range => this.currentRange = range));
-            this.spreadsheetService.dialogContainer = this.dialogContainer;
-        });
-    }
-    ngOnChanges(changes) {
-        const dynamicOptions = [
-            'columns',
-            'columnWidth',
-            'defaultCellStyle',
-            'excel',
-            'headerHeight',
-            'headerWidth',
-            'images',
-            'names',
-            'rowHeight',
-            'rows'
-        ];
-        const changedDynamicOptions = dynamicOptions.filter(o => isPresent(changes[o] && !changes[o].firstChange));
-        if (this.spreadsheetWidget && changedDynamicOptions.length) {
-            const newOptions = this.spreadsheetWidget.toJSON();
-            changedDynamicOptions.forEach(o => newOptions[o] = changes[o].currentValue);
-            this.spreadsheetWidget.fromJSON(newOptions);
-        }
-    }
-    ngOnDestroy() {
-        this.subs.unsubscribe();
-    }
-    /**
-     * @hidden
-     */
-    onContextMenu(e) {
-        if (e.targetType === 'topcorner') {
-            return;
-        }
-        const selection = this.spreadsheetWidget.activeSheet().select();
-        const { topLeft, bottomRight } = selection;
-        const isRange = e.targetType === 'cell' && (topLeft.row !== bottomRight.row || topLeft.col !== bottomRight.col);
-        const targetType = isRange ? 'range' : e.targetType;
-        this.contextMenuItems = this.contextMenuItemsForTarget(targetType, e.showUnhide, e.showUnmerge);
-        this.contextMenu.show({ top: e.originalEvent.pageY, left: e.originalEvent.pageX });
-    }
-    /**
-     * @hidden
-     */
-    onContextMenuSelect(e) {
-        let command;
-        switch (e.item.id) {
-            case 'cut':
-                command = { command: 'ToolbarCutCommand', options: { workbook: this.spreadsheetWidget.workbook } };
-                break;
-            case 'copy':
-                command = { command: 'ToolbarCopyCommand', options: { workbook: this.spreadsheetWidget.workbook } };
-                break;
-            case 'unmerge':
-                command = { command: 'MergeCellCommand', options: { value: 'unmerge' } };
-                break;
-            case 'mergeAll':
-                command = { command: 'MergeCellCommand', options: { value: 'cells' } };
-                break;
-            case 'mergeHorizontally':
-                command = { command: 'MergeCellCommand', options: { value: 'horizontally' } };
-                break;
-            case 'mergeVertically':
-                command = { command: 'MergeCellCommand', options: { value: 'vertically' } };
-                break;
-            case 'hideRow':
-                command = { command: 'HideLineCommand', options: { axis: 'row' } };
-                break;
-            case 'hideColumn':
-                command = { command: 'HideLineCommand', options: { axis: 'column' } };
-                break;
-            case 'unhideRow':
-                command = { command: 'UnHideLineCommand', options: { axis: 'row' } };
-                break;
-            case 'unhideColumn':
-                command = { command: 'UnHideLineCommand', options: { axis: 'column' } };
-                break;
-            case 'deleteRow':
-                command = { command: 'DeleteRowCommand' };
-                break;
-            case 'deleteColumn':
-                command = { command: 'DeleteColumnCommand' };
-                break;
-            case 'insertLink':
-                this.openLinkDialog();
-                break;
-            case 'addRowAbove':
-                command = { command: 'AddRowCommand', options: { value: 'above' } };
-                break;
-            case 'addRowBelow':
-                command = { command: 'AddRowCommand', options: { value: 'below' } };
-                break;
-            case 'addColumnLeft':
-                command = { command: 'AddColumnCommand', options: { value: 'left' } };
-                break;
-            case 'addColumnRight':
-                command = { command: 'AddColumnCommand', options: { value: 'right' } };
-                break;
-        }
-        if (command) {
-            this.spreadsheetWidget.executeCommand(command);
-        }
-    }
-    /**
-     * @hidden
-     */
-    messageFor(key) {
-        return this.localization.get(key);
-    }
-    /**
-     * @hidden
-     */
-    onMenuItemSelect(e) {
-        const selectedMenuItem = this.menuItems.find(item => item.text === e.item.text);
-        const previousSelectedItem = this.menuItems.find(item => item.active);
-        if (selectedMenuItem !== previousSelectedItem) {
-            this._menuItems.forEach((item, idx) => {
-                item.active = idx === +e.index;
-                item.cssClass = idx === +e.index ? 'k-active' : null;
-            });
-            this.selectedMenuItem = this.menuItems.find(item => item.active);
-        }
-    }
-    updateActiveSheet(name) {
-        this.ngZone.run(() => this.spreadsheetService.currentActiveSheet = name);
-    }
-    onSheetsChanged(e) {
-        this.ngZone.run(() => {
-            this.sheets = mapToSheetDescriptor(e.sheets);
-            this.updateActiveSheet(this.spreadsheetService.activeSheet);
-        });
-    }
-    get options() {
-        return Object.assign(Object.assign({ activeSheet: this.activeSheet }, {
-            sheets: this.sheetsInfo && JSON.parse(JSON.stringify(this.sheetsInfo)),
-            intl: {
-                localeInfo: () => localeData(this.intl.localeId),
-                parseDate: (value, fmt) => this.intl.parseDate(value, fmt),
-                toString: (value, fmt) => this.intl.toString(value, fmt),
-                format: (fmt, ...values) => this.intl.format(fmt, ...values)
-            }
-        }), { columns: this.columns, columnWidth: this.columnWidth, defaultCellStyle: this.defaultCellStyle, excel: this.excel, headerHeight: this.headerHeight, headerWidth: this.headerWidth, images: this.images, rowHeight: this.rowHeight, rows: this.rows, formulaBarInputRef: { current: this.formulaBarInputRef.current }, formulaCellInputRef: { current: this.formulaCellInputRef.current }, nameBoxRef: { current: this.nameBoxRef.current } });
-    }
-    contextMenuItemsForTarget(target, unhide, unmerge) {
-        const commonItems = [{
-                text: this.messageFor('copy'),
-                icon: commandIcons.copy,
-                svgIcon: commandSVGIcons.copy,
-                id: 'copy'
-            }, {
-                text: this.messageFor('cut'),
-                icon: commandIcons.cut,
-                svgIcon: commandSVGIcons.cut,
-                id: 'cut'
-            }, {
-                text: this.messageFor('paste'),
-                icon: commandIcons.paste,
-                svgIcon: commandSVGIcons.paste,
-                id: 'paste',
-                disabled: true
-            }, {
-                separator: true
-            }, {
-                text: this.messageFor('mergeAll'),
-                icon: commandIcons.mergeAll,
-                svgIcon: commandSVGIcons.mergeAll,
-                id: 'mergeAll',
-            }, {
-                text: this.messageFor('mergeHorizontally'),
-                icon: commandIcons.mergeHorizontally,
-                svgIcon: commandSVGIcons.mergeHorizontally,
-                id: 'mergeHorizontally',
-            }, {
-                text: this.messageFor('mergeVertically'),
-                icon: commandIcons.mergeVertically,
-                svgIcon: commandSVGIcons.mergeVertically,
-                id: 'mergeVertically',
-            }, {
-                text: this.messageFor('unmerge'),
-                icon: commandIcons.unmerge,
-                svgIcon: commandSVGIcons.unmerge,
-                id: 'unmerge',
-                disabled: !unmerge
-            }, {
-                separator: true
-            }, {
-                text: this.messageFor('insertLink'),
-                icon: commandIcons.insertLink,
-                svgIcon: commandSVGIcons.insertLink,
-                id: 'insertLink'
-            }];
-        if (target === 'rowheader') {
-            commonItems.push({
-                separator: true
-            }, {
-                text: this.messageFor('addRowAbove'),
-                icon: commandIcons.addRowAbove,
-                svgIcon: commandSVGIcons.addRowAbove,
-                id: 'addRowAbove',
-            }, {
-                text: this.messageFor('addRowBelow'),
-                icon: commandIcons.addRowBelow,
-                svgIcon: commandSVGIcons.addRowBelow,
-                id: 'addRowBelow',
-            }, {
-                text: this.messageFor('deleteRow'),
-                icon: commandIcons.deleteRow,
-                svgIcon: commandSVGIcons.deleteRow,
-                id: 'deleteRow',
-            }, {
-                text: this.messageFor('hideRow'),
-                icon: commandIcons.hideRow,
-                svgIcon: commandSVGIcons.hideRow,
-                id: 'hideRow',
-            }, {
-                text: this.messageFor('unhideRow'),
-                icon: commandIcons.unhideRow,
-                svgIcon: commandSVGIcons.unhideRow,
-                id: 'unhideRow',
-                disabled: !unhide
-            });
-        }
-        if (target === 'columnheader') {
-            commonItems.push({
-                separator: true
-            }, {
-                text: this.messageFor('addColumnLeft'),
-                icon: commandIcons.addColumnLeft,
-                svgIcon: commandSVGIcons.addColumnLeft,
-                id: 'addColumnLeft',
-            }, {
-                text: this.messageFor('addColumnRight'),
-                icon: commandIcons.addColumnRight,
-                svgIcon: commandSVGIcons.addColumnRight,
-                id: 'addColumnRight',
-            }, {
-                text: this.messageFor('deleteColumn'),
-                icon: commandIcons.deleteColumn,
-                svgIcon: commandSVGIcons.deleteColumn,
-                id: 'deleteColumn',
-            }, {
-                text: this.messageFor('hideColumn'),
-                icon: commandIcons.hideColumn,
-                svgIcon: commandSVGIcons.hideColumn,
-                id: 'hideColumn',
-            }, {
-                text: this.messageFor('unhideColumn'),
-                icon: commandIcons.unhideColumn,
-                svgIcon: commandSVGIcons.unhideColumn,
-                id: 'unhideColumn',
-                disabled: !unhide
-            });
-        }
-        return commonItems;
-    }
-    openLinkDialog() {
-        var _a, _b;
-        const hasLink = isPresent((_a = this.currentRange) === null || _a === void 0 ? void 0 : _a.link());
-        const dialogSettings = {
-            appendTo: this.spreadsheetService.dialogContainer,
-            title: this.localization.get('insertLink'),
-            content: InsertLinkDialogComponent,
-            actions: [{
-                    text: this.localization.get('dialogInsert'),
-                    themeColor: 'primary'
-                }, {
-                    text: this.localization.get('dialogCancel')
-                },
-                'spacer', {
-                    text: this.localization.get('dialogRemoveLink'),
-                    themeColor: 'primary',
-                    fillMode: 'clear',
-                    cssClass: hasLink ? '' : 'k-disabled'
-                }],
-            actionsLayout: 'start',
-            width: 400,
-            autoFocusedElement: '.k-textbox > .k-input-inner'
-        };
-        const dialog = this.dialogService.open(dialogSettings);
-        const dialogInstance = dialog.dialog.instance;
-        const dialogContent = dialog.content.instance;
-        if (hasLink) {
-            dialogContent.setData({ link: (_b = this.currentRange) === null || _b === void 0 ? void 0 : _b.link() });
-        }
-        dialogInstance.action.pipe(take(1)).subscribe((event) => {
-            if (event.text === this.localization.get('dialogCancel')) {
-                return;
-            }
-            let link = null;
-            if (event.text === this.localization.get('dialogInsert')) {
-                link = dialogContent.urlLink || null;
-            }
-            this.spreadsheetService.spreadsheet.executeCommand({
-                command: 'HyperlinkCommand',
-                options: { link }
-            });
-        });
-    }
-}
-SpreadsheetComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetComponent, deps: [{ token: i0.NgZone }, { token: i1$3.IntlService }, { token: i0.ElementRef }, { token: i2.LocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }, { token: ErrorHandlingService }, { token: i1$1.DialogService }], target: i0.ɵɵFactoryTarget.Component });
-SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetComponent, isStandalone: true, selector: "kendo-spreadsheet", inputs: { menuItems: "menuItems", overflow: "overflow", formulaListMaxHeight: "formulaListMaxHeight", activeSheet: "activeSheet", sheets: "sheets", columns: "columns", columnWidth: "columnWidth", defaultCellStyle: "defaultCellStyle", headerHeight: "headerHeight", headerWidth: "headerWidth", rowHeight: "rowHeight", rows: "rows", images: "images", excel: "excel" }, outputs: { change: "change", formatChange: "formatChange", selectionChange: "selectionChange", excelExport: "excelExport", excelImport: "excelImport", activeSheetChange: "activeSheetChange" }, host: { properties: { "class.k-spreadsheet": "this.hostClass", "attr.role": "this.role" } }, providers: [
-        SpreadsheetLocalizationService,
-        SpreadsheetService,
-        {
-            provide: LocalizationService,
-            useExisting: SpreadsheetLocalizationService
-        },
-        {
-            provide: L10N_PREFIX,
-            useValue: 'kendo.spreadsheet'
-        },
-        SpreadsheetToolsService,
-        PopupService,
-        ErrorHandlingService
-    ], viewQueries: [{ propertyName: "formulaBarInputRef", first: true, predicate: ["formulaBar"], descendants: true, read: FormulaInputDirective }, { propertyName: "formulaCellInputRef", first: true, predicate: ["formulaCell"], descendants: true, read: FormulaInputDirective }, { propertyName: "nameBoxRef", first: true, predicate: ["nameBox"], descendants: true }, { propertyName: "dialogContainer", first: true, predicate: ["dialogContainer"], descendants: true, read: ViewContainerRef }, { propertyName: "contextMenu", first: true, predicate: ["contextMenu"], descendants: true }], exportAs: ["kendo-spreadsheet"], usesOnChanges: true, ngImport: i0, template: `
-        <ng-container
-            kendoSpreadsheetLocalizedMessages
-            i18n-background="kendo.spreadsheet.background|The title of the tool that changes the text background color."
-            background="Background color"
-            i18n-color="kendo.spreadsheet.color|The title of the tool that changes the text font color."
-            color="Font color"
-            i18n-bold="kendo.spreadsheet.bold|The title of the Bold tool."
-            bold="Bold"
-            i18n-italic="kendo.spreadsheet.italic|The title of the Italic tool."
-            italic="Italic"
-            i18n-underline="kendo.spreadsheet.underline|The title of the Underline tool."
-            underline="Underline"
-            i18n-loadFile="kendo.spreadsheet.loadFile|The title of the Load File tool."
-            loadFile="Open..."
-            i18n-saveFile="kendo.spreadsheet.saveFile|The title of the Save File tool."
-            saveFile="Export..."
-            i18n-format="kendo.spreadsheet.format|The text of the Format tool."
-            format="Custom format..."
-            i18n-fontFamily="kendo.spreadsheet.fontFamily|The text of the Font Family tool."
-            fontFamily="Font"
-            i18n-fontSize="kendo.spreadsheet.fontSize|The text of the Font Size tool."
-            fontSize="Font size"
-            i18n-home="kendo.spreadsheet.home|The text of the Home toolbar tab."
-            home="Home"
-            i18n-file="kendo.spreadsheet.file|The text of the File toolbar tab."
-            file="File"
-            i18n-insert="kendo.spreadsheet.insert|The text of the Insert toolbar tab."
-            insert="Insert"
-            i18n-formatTab="kendo.spreadsheet.formatTab|The text of the Format toolbar tab."
-            formatTab="Format"
-            i18n-view="kendo.spreadsheet.view|The text of the View toolbar tab."
-            view="View"
-            i18n-undo="kendo.spreadsheet.undo|The title of the Undo tool."
-            undo="Undo"
-            i18n-redo="kendo.spreadsheet.redo|The title of the Redo tool."
-            redo="Redo"
-            i18n-gridLines="kendo.spreadsheet.gridLines|The title of the Grid Lines tool."
-            gridLines="Toggle grid lines"
-            i18n-addColumnLeft="kendo.spreadsheet.addColumnLeft|The title of the tool that adds new column before currently selected column."
-            addColumnLeft="Add column left"
-            i18n-addColumnRight="kendo.spreadsheet.addColumnRight|The title of the tool that adds new column after currently selected column."
-            addColumnRight="Add column right"
-            i18n-addRowBelow="kendo.spreadsheet.addRowBelow|The title of the tool that adds new row below currently selected row."
-            addRowBelow="Add row below"
-            i18n-addRowAbove="kendo.spreadsheet.addRowAbove|The title of the tool that adds new row above currently selected row."
-            addRowAbove="Add row above"
-            i18n-deleteColumn="kendo.spreadsheet.deleteColumn|The title of the tool that deletes a column."
-            deleteColumn="Delete column"
-            i18n-deleteRow="kendo.spreadsheet.deleteRow|The title of the tool that deletes a row."
-            deleteRow="Delete row"
-            i18n-wrap="kendo.spreadsheet.wrap|The title of the Text Wrap tool."
-            wrap="Text wrap"
-            i18n-align="kendo.spreadsheet.align|The title of the Text Align tool."
-            align="Align"
-            i18n-alignHorizontal="kendo.spreadsheet.alignHorizontal|The title of the Text Align Horizontal tool."
-            alignHorizontal="Align horizontally"
-            i18n-alignVertical="kendo.spreadsheet.alignVertical|The title of the Text Align Vertical tool."
-            alignVertical="Align vertically"
-            i18n-alignLeft="kendo.spreadsheet.alignLeft|The title of the Text Align Left tool."
-            alignLeft="Align Left"
-            i18n-alignCenter="kendo.spreadsheet.alignCenter|The title of the Text Align Center tool."
-            alignCenter="Align Center"
-            i18n-alignRight="kendo.spreadsheet.alignRight|The title of the Text Align Right tool."
-            alignRight="Align Right"
-            i18n-alignJustify="kendo.spreadsheet.alignJustify|The title of the Text Align Justify tool."
-            alignJustify="Align Justify"
-            i18n-alignTop="kendo.spreadsheet.alignTop|The title of the Text Align Top tool."
-            alignTop="Align Top"
-            i18n-alignMiddle="kendo.spreadsheet.alignMiddle|The title of the Text Align Middle tool."
-            alignMiddle="Align Middle"
-            i18n-alignBottom="kendo.spreadsheet.alignBottom|The title of the Text Align Bottom tool."
-            alignBottom="Align Bottom"
-            i18n-merge="kendo.spreadsheet.merge|The title of the Cells Merge tool."
-            merge="Merge"
-            i18n-mergeAll="kendo.spreadsheet.mergeAll|The title of the Merge all tool."
-            mergeAll="Merge all"
-            i18n-mergeHorizontally="kendo.spreadsheet.mergeHorizontally|The title of the Merge horizontally tool."
-            mergeHorizontally="Merge horizontally"
-            i18n-mergeVertically="kendo.spreadsheet.mergeVertically|The title of the Merge vertically tool."
-            mergeVertically="Merge vertically"
-            i18n-unmerge="kendo.spreadsheet.unmerge|The title of the Unmerge tool."
-            unmerge="Unmerge"
-            i18n-insertLink="kendo.spreadsheet.insertLink|The title of the tool that inserts a link."
-            insertLink="Insert link"
-            i18n-decreaseDecimal="kendo.spreadsheet.decreaseDecimal|The title of the tool that decreases decimals."
-            decreaseDecimal="Decrease decimal"
-            i18n-increaseDecimal="kendo.spreadsheet.increaseDecimal|The title of the tool that increases decimals."
-            increaseDecimal="Increase decimal"
-            i18n-increaseFontSize="kendo.spreadsheet.increaseFontSize|The title of the tool that increases the cell font size."
-            increaseFontSize="Increase font size"
-            i18n-decreaseFontSize="kendo.spreadsheet.decreaseFontSize|The title of the tool that decreases the cell font size."
-            decreaseFontSize="Decrease font size"
-            i18n-dialogApply="kendo.spreadsheet.dialogApply|The text of the **Apply** button in all Spreadsheet dialogs."
-            dialogApply="Apply"
-            i18n-dialogCancel="kendo.spreadsheet.dialogCancel|The text of the **Cancel** button in all Spreadsheet dialogs."
-            dialogCancel="Cancel"
-            i18n-dialogDelete="kendo.spreadsheet.dialogDelete|The text of the **Delete** button in the Delete sheet dialog."
-            dialogDelete="Delete"
-            i18n-dialogRename="kendo.spreadsheet.dialogRename|The text of the **Rename** button in the Rename sheet dialog."
-            dialogRename="Rename"
-            i18n-dialogInsert="kendo.spreadsheet.dialogInsert|The text of the **Insert** button in all Spreadsheet dialogs."
-            dialogInsert="Insert"
-            i18n-dialogRemoveLink="kendo.spreadsheet.dialogRemoveLink|The text of the **Remove link** button in the Link tool dialog."
-            dialogRemoveLink="Remove link"
-            i18n-rename="kendo.spreadsheet.rename|The title of the Rename sheet dialog."
-            rename="Rename Sheet"
-            i18n-delete="kendo.spreadsheet.delete|The title of the Delete sheet dialog."
-            delete="Delete Sheet"
-            i18n-nameBox="kendo.spreadsheet.nameBox|The title of the Name Box input."
-            nameBox="Name Box"
-            i18n-formulaInput="kendo.spreadsheet.formulaInput|The title of the Formula input."
-            formulaInput="Formula Input"
-            i18n-addSheet="kendo.spreadsheet.addSheet|The title of the Add new sheet button."
-            addSheet="Add New Sheet"
-            i18n-sheetsMenu="kendo.spreadsheet.sheetsMenu|The title of the Sheets menu button."
-            sheetsMenu="All Sheets"
-            i18n-openUnsupported="kendo.spreadsheet.openUnsupported|The content of the dialog that warns about an unsupported file type."
-            openUnsupported="Unsupported format. Please select an .xlsx file."
-            i18n-modifyMerged="kendo.spreadsheet.modifyMerged|The content of the dialog that warns about modifying a merged cell."
-            modifyMerged="Cannot change part of a merged cell."
-            i18n-cannotModifyDisabled="kendo.spreadsheet.cannotModifyDisabled|The content of the dialog that warns about modifying a disabled cell."
-            cannotModifyDisabled="Cannot modify disabled cells."
-            i18n-dialogOk="kendo.spreadsheet.dialogOk|The text of the **OK** dialog button."
-            dialogOk="OK"
-            i18n-dialogError="kendo.spreadsheet.dialogError|The title of an error dialog."
-            dialogError="Error"
-            i18n-duplicateSheetName="kendo.spreadsheet.duplicateSheetName|The content of the dialog that warns about duplicated sheet name."
-            duplicateSheetName="There is an existing sheet with this name. Please enter another name."
-            i18n-copy="kendo.spreadsheet.copy|The Copy command text."
-            copy="Copy"
-            i18n-cut="kendo.spreadsheet.cut|The Cut command text."
-            cut="Cut"
-            i18n-paste="kendo.spreadsheet.paste|The Paste command text."
-            paste="Paste (use Ctrl/⌘ + V)"
-            i18n-hideRow="kendo.spreadsheet.hideRow|The Hide row command text."
-            hideRow="Hide"
-            i18n-unhideRow="kendo.spreadsheet.unhideRow|The Unhide row command text."
-            unhideRow="Unhide"
-            i18n-hideColumn="kendo.spreadsheet.hideColumn|The Hide column command text."
-            hideColumn="Hide"
-            i18n-unhideColumn="kendo.spreadsheet.unhideColumn|The Unhide column command text."
-            unhideColumn="Unhide"
-            i18n-sheetDelete="kendo.spreadsheet.sheetDelete|The text of the Sheet menu Delete option."
-            sheetDelete="Delete"
-            i18n-sheetRename="kendo.spreadsheet.sheetRename|The text of the Sheet menu Rename option."
-            sheetRename="Rename"
-            i18n-sheetDuplicate="kendo.spreadsheet.sheetDuplicate|The text of the Sheet menu Duplicate option."
-            sheetDuplicate="Duplicate"
-            i18n-sheetHide="kendo.spreadsheet.sheetHide|The text of the Sheet menu Hide option."
-            sheetHide="Hide"
-            i18n-sheetMoveLeft="kendo.spreadsheet.sheetMoveLeft|The text of the Sheet menu Move Left option."
-            sheetMoveLeft="Move Left"
-            i18n-sheetMoveRight="kendo.spreadsheet.sheetMoveRight|The text of the Sheet menu Move Right option."
-            sheetMoveRight="Move Right"
-            i18n-invalidNameError="kendo.spreadsheet.invalidNameError|The content of the dialog that warns about invalid name input."
-            invalidNameError="{{ 'Invalid name: {inputValue}' }}">
-        </ng-container>
-        <div class="k-spreadsheet-header">
-            <kendo-menu kendoSpreadsheetMenu (select)="onMenuItemSelect($event)">
-                <kendo-menu-item *ngFor="let item of menuItems" [text]="item.text" [cssClass]="item.cssClass"></kendo-menu-item>
-            </kendo-menu>
-            <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'file'"
-                [attr.aria-label]="messageFor('file')"
-                fillMode="flat"
-                class="k-spreadsheet-toolbar"
-                [overflow]="overflow">
-                <kendo-spreadsheet-load-file-tool></kendo-spreadsheet-load-file-tool>
-                <kendo-toolbar-button kendoSpreadsheetSaveFile></kendo-toolbar-button>
-            </kendo-toolbar>
-            <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'home'"
-                [attr.aria-label]="messageFor('home')"
-                class="k-spreadsheet-toolbar"
-                fillMode="flat"
-                [overflow]="overflow">
-                <kendo-toolbar-button kendoSpreadsheetUndo></kendo-toolbar-button>
-                <kendo-toolbar-button kendoSpreadsheetRedo></kendo-toolbar-button>
-                <kendo-toolbar-separator></kendo-toolbar-separator>
-                <kendo-toolbar-dropdownlist kendoSpreadsheetFontFamily></kendo-toolbar-dropdownlist>
-                <kendo-toolbar-dropdownlist kendoSpreadsheetFontSize></kendo-toolbar-dropdownlist>
-                <kendo-toolbar-buttongroup fillMode="flat">
-                    <kendo-toolbar-button kendoSpreadsheetIncreaseFontSize></kendo-toolbar-button>
-                    <kendo-toolbar-button kendoSpreadsheetDecreaseFontSize></kendo-toolbar-button>
-                </kendo-toolbar-buttongroup>
-                <kendo-toolbar-separator></kendo-toolbar-separator>
-                <kendo-toolbar-buttongroup fillMode="flat">
-                    <kendo-toolbar-button kendoSpreadsheetBold></kendo-toolbar-button>
-                    <kendo-toolbar-button kendoSpreadsheetItalic></kendo-toolbar-button>
-                    <kendo-toolbar-button kendoSpreadsheetUnderline></kendo-toolbar-button>
-                </kendo-toolbar-buttongroup>
-                <kendo-spreadsheet-forecolor-tool></kendo-spreadsheet-forecolor-tool>
-                <kendo-toolbar-separator></kendo-toolbar-separator>
-                <kendo-spreadsheet-backcolor-tool></kendo-spreadsheet-backcolor-tool>
-                <kendo-toolbar-separator></kendo-toolbar-separator>
-                <kendo-toolbar-dropdownbutton kendoSpreadsheetHorizontalTextAlign></kendo-toolbar-dropdownbutton>
-                <kendo-toolbar-dropdownbutton kendoSpreadsheetVerticalTextAlign></kendo-toolbar-dropdownbutton>
-                <kendo-toolbar-button kendoSpreadsheetTextWrap></kendo-toolbar-button>
-                <kendo-toolbar-separator></kendo-toolbar-separator>
-                <kendo-toolbar-dropdownbutton kendoSpreadsheetFormat></kendo-toolbar-dropdownbutton>
-            </kendo-toolbar>
-            <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'insert'"
-                [attr.aria-label]="messageFor('insert')"
-                fillMode="flat"
-                class="k-spreadsheet-toolbar"
-                [overflow]="overflow">
-                <kendo-toolbar-button kendoSpreadsheetInsertLink></kendo-toolbar-button>
-                <kendo-toolbar-separator></kendo-toolbar-separator>
-                <kendo-toolbar-button kendoSpreadsheetAddColumnLeftButton></kendo-toolbar-button>
-                <kendo-toolbar-button kendoSpreadsheetAddColumnRightButton></kendo-toolbar-button>
-                <kendo-toolbar-button kendoSpreadsheetAddRowBelowButton></kendo-toolbar-button>
-                <kendo-toolbar-button kendoSpreadsheetAddRowAboveButton></kendo-toolbar-button>
-                <kendo-toolbar-separator></kendo-toolbar-separator>
-                <kendo-toolbar-button kendoSpreadsheetDeleteColumnButton></kendo-toolbar-button>
-                <kendo-toolbar-button kendoSpreadsheetDeleteRowButton></kendo-toolbar-button>
-            </kendo-toolbar>
-            <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'format'"
-                [attr.aria-label]="messageFor('formatTab')"
-                fillMode="flat"
-                class="k-spreadsheet-toolbar"
-                [overflow]="overflow">
-                <kendo-toolbar-button kendoSpreadsheetDecreaseDecimal></kendo-toolbar-button>
-                <kendo-toolbar-button kendoSpreadsheetIncreaseDecimal></kendo-toolbar-button>
-            </kendo-toolbar>
-            <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'view'"
-                [attr.aria-label]="messageFor('view')"
-                fillMode="flat"
-                class="k-spreadsheet-toolbar"
-                [overflow]="overflow">
-                <kendo-toolbar-dropdownbutton kendoSpreadsheetMerge></kendo-toolbar-dropdownbutton>
-                <kendo-toolbar-separator></kendo-toolbar-separator>
-                <kendo-toolbar-button kendoSpreadsheetGridLines></kendo-toolbar-button>
-            </kendo-toolbar>
-        </div>
-        <div class="k-spreadsheet-action-bar">
-            <div #nameBox kendoSpreadsheetNameBox [spreadsheetWidget]="spreadsheetWidget"></div>
-            <div class="k-spreadsheet-formula-bar">
-                <span class="k-separator k-separator-vertical"></span>
-                <kendo-icon-wrapper
-                    name="formula-fx"
-                    [svgIcon]="formulaFxIcon">
-                </kendo-icon-wrapper>
-                <span class="k-separator k-separator-vertical"></span>
-                <div
-                    #formulaBar
-                    kendoSpreadsheetFormulaInput
-                    [formulaListMaxHeight]="formulaListMaxHeight"
-                    class="k-textbox k-input k-input-md k-input-flat k-rounded-md"></div>
-            </div>
-        </div>
-        <div class="k-spreadsheet-view">
-            <div class="k-spreadsheet-fixed-container"></div>
-                <div class="k-spreadsheet-scroller">
-                    <div class="k-spreadsheet-view-size"></div>
-                </div>
-            <div tabIndex="0" class="k-spreadsheet-clipboard" contentEditable="true"></div>
-            <div #formulaCell kendoSpreadsheetFormulaInput class="k-spreadsheet-cell-editor" data-role="formulainput"></div>
-        </div>
-        <div class="k-spreadsheet-sheets-bar"
-            kendoSpreadsheetSheetsBar
-            [sheets]="sheetsInfo"
-            [sheetDescriptors]="sheets">
-        </div>
-        <ng-container #dialogContainer></ng-container>
-
-        <kendo-contextmenu
-            #contextMenu
-            [items]="contextMenuItems"
-            (select)="onContextMenuSelect($event)"></kendo-contextmenu>
-
-        <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
-    `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoSpreadsheetLocalizedMessages]" }, { kind: "component", type: MenuComponent, selector: "kendo-menu", inputs: ["appendTo", "menuItemTemplate", "ariaRole", "menuItemLinkTemplate"], outputs: ["select", "open", "close"], exportAs: ["kendoMenu"] }, { kind: "directive", type: MainMenuDirective, selector: "[kendoSpreadsheetMenu]" }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MenuItemComponent, selector: "kendo-menu-item", inputs: ["text", "url", "disabled", "cssClass", "cssStyle", "icon", "svgIcon", "data", "separator"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "fillMode", "tabindex", "size", "tabIndex"], outputs: ["open", "close"], exportAs: ["kendoToolBar"] }, { kind: "component", type: SpreadsheetLoadFileComponent, selector: "kendo-spreadsheet-load-file-tool" }, { kind: "component", type: ToolBarButtonComponent, selector: "kendo-toolbar-button", inputs: ["showText", "showIcon", "text", "style", "className", "title", "disabled", "toggleable", "look", "togglable", "selected", "fillMode", "themeColor", "icon", "iconClass", "svgIcon", "imageUrl"], outputs: ["click", "pointerdown", "selectedChange"], exportAs: ["kendoToolBarButton"] }, { kind: "directive", type: SpreadsheetSaveFileDirective, selector: "[kendoSpreadsheetSaveFile]" }, { kind: "component", type: ToolBarButtonGroupComponent, selector: "kendo-toolbar-buttongroup", inputs: ["disabled", "fillMode", "selection", "width", "look"], exportAs: ["kendoToolBarButtonGroup"] }, { kind: "directive", type: SpreadsheetUndoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUndo]" }, { kind: "directive", type: SpreadsheetRedoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetRedo]" }, { kind: "component", type: ToolBarSeparatorComponent, selector: "kendo-toolbar-separator", exportAs: ["kendoToolBarSeparator"] }, { kind: "component", type: SpreadsheetFontFamilyComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontFamily]" }, { kind: "component", type: SpreadsheetFontSizeComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontSize]" }, { kind: "directive", type: SpreadsheetIncreaseFontSizeDirective, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseFontSize]" }, { kind: "directive", type: SpreadsheetDecreaseFontSizeDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseFontSize]" }, { kind: "directive", type: SpreadsheetBoldDirective, selector: "kendo-toolbar-button[kendoSpreadsheetBold]" }, { kind: "directive", type: SpreadsheetItalicDirective, selector: "kendo-toolbar-button[kendoSpreadsheetItalic]" }, { kind: "directive", type: SpreadsheetUnderlineDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUnderline]" }, { kind: "component", type: SpreadsheetForeColorComponent, selector: "kendo-spreadsheet-forecolor-tool" }, { kind: "component", type: SpreadsheetBackColorComponent, selector: "kendo-spreadsheet-backcolor-tool" }, { kind: "component", type: ToolBarDropDownButtonComponent, selector: "kendo-toolbar-dropdownbutton", inputs: ["arrowIcon", "title", "showText", "showIcon", "text", "icon", "svgIcon", "iconClass", "imageUrl", "popupSettings", "look", "primary", "fillMode", "themeColor", "buttonClass", "textField", "disabled", "data"], outputs: ["itemClick", "open", "close"], exportAs: ["kendoToolBarDropDownButton"] }, { kind: "directive", type: SpreadsheetHorizontalTextAlignDirective, selector: "[kendoSpreadsheetHorizontalTextAlign]" }, { kind: "directive", type: SpreadsheetVerticalTextAlignDirective, selector: "[kendoSpreadsheetVerticalTextAlign]" }, { kind: "directive", type: SpreadsheetTextWrapDirective, selector: "kendo-toolbar-button[kendoSpreadsheetTextWrap]" }, { kind: "directive", type: SpreadsheetFormatDirective, selector: "[kendoSpreadsheetFormat]" }, { kind: "directive", type: SpreadsheetInsertLinkDirective, selector: "kendo-toolbar-button[kendoSpreadsheetInsertLink]" }, { kind: "directive", type: SpreadsheetAddColumnLeftButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnLeftButton]" }, { kind: "directive", type: SpreadsheetAddColumnRightButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnRightButton]" }, { kind: "directive", type: SpreadsheetAddRowBelowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowBelowButton]" }, { kind: "directive", type: SpreadsheetAddRowAboveButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowAboveButton]" }, { kind: "directive", type: SpreadsheetDeleteColumnButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteColumnButton]" }, { kind: "directive", type: SpreadsheetDeleteRowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteRowButton]" }, { kind: "directive", type: SpreadsheetDecreaseDecimalDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseDecimal]" }, { kind: "directive", type: SpreadsheetIncreaseDecimalDirective, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseDecimal]" }, { kind: "directive", type: SpreadsheetMergeDirective, selector: "[kendoSpreadsheetMerge]" }, { kind: "directive", type: SpreadsheetGridLinesDirective, selector: "kendo-toolbar-button[kendoSpreadsheetGridLines]" }, { kind: "component", type: NameBoxComponent, selector: "[kendoSpreadsheetNameBox]", inputs: ["data", "spreadsheetWidget"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: FormulaInputDirective, selector: "[kendoSpreadsheetFormulaInput]", inputs: ["formulaListMaxHeight"] }, { kind: "component", type: SheetsBarComponent, selector: "[kendoSpreadsheetSheetsBar]", inputs: ["sheets", "sheetDescriptors"] }, { kind: "component", type: ContextMenuComponent, selector: "kendo-contextmenu", inputs: ["showOn", "target", "filter", "alignToAnchor", "vertical", "popupAnimate", "popupAlign", "anchorAlign", "collision", "appendTo", "ariaLabel"], outputs: ["popupOpen", "popupClose", "select", "open", "close"], exportAs: ["kendoContextMenu"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetComponent, decorators: [{
-            type: Component,
-            args: [{
-                    exportAs: 'kendo-spreadsheet',
-                    selector: 'kendo-spreadsheet',
-                    providers: [
-                        SpreadsheetLocalizationService,
-                        SpreadsheetService,
-                        {
-                            provide: LocalizationService,
-                            useExisting: SpreadsheetLocalizationService
-                        },
-                        {
-                            provide: L10N_PREFIX,
-                            useValue: 'kendo.spreadsheet'
-                        },
-                        SpreadsheetToolsService,
-                        PopupService,
-                        ErrorHandlingService
-                    ],
-                    template: `
-        <ng-container
-            kendoSpreadsheetLocalizedMessages
-            i18n-background="kendo.spreadsheet.background|The title of the tool that changes the text background color."
-            background="Background color"
-            i18n-color="kendo.spreadsheet.color|The title of the tool that changes the text font color."
-            color="Font color"
-            i18n-bold="kendo.spreadsheet.bold|The title of the Bold tool."
-            bold="Bold"
-            i18n-italic="kendo.spreadsheet.italic|The title of the Italic tool."
-            italic="Italic"
-            i18n-underline="kendo.spreadsheet.underline|The title of the Underline tool."
-            underline="Underline"
-            i18n-loadFile="kendo.spreadsheet.loadFile|The title of the Load File tool."
-            loadFile="Open..."
-            i18n-saveFile="kendo.spreadsheet.saveFile|The title of the Save File tool."
-            saveFile="Export..."
-            i18n-format="kendo.spreadsheet.format|The text of the Format tool."
-            format="Custom format..."
-            i18n-fontFamily="kendo.spreadsheet.fontFamily|The text of the Font Family tool."
-            fontFamily="Font"
-            i18n-fontSize="kendo.spreadsheet.fontSize|The text of the Font Size tool."
-            fontSize="Font size"
-            i18n-home="kendo.spreadsheet.home|The text of the Home toolbar tab."
-            home="Home"
-            i18n-file="kendo.spreadsheet.file|The text of the File toolbar tab."
-            file="File"
-            i18n-insert="kendo.spreadsheet.insert|The text of the Insert toolbar tab."
-            insert="Insert"
-            i18n-formatTab="kendo.spreadsheet.formatTab|The text of the Format toolbar tab."
-            formatTab="Format"
-            i18n-view="kendo.spreadsheet.view|The text of the View toolbar tab."
-            view="View"
-            i18n-undo="kendo.spreadsheet.undo|The title of the Undo tool."
-            undo="Undo"
-            i18n-redo="kendo.spreadsheet.redo|The title of the Redo tool."
-            redo="Redo"
-            i18n-gridLines="kendo.spreadsheet.gridLines|The title of the Grid Lines tool."
-            gridLines="Toggle grid lines"
-            i18n-addColumnLeft="kendo.spreadsheet.addColumnLeft|The title of the tool that adds new column before currently selected column."
-            addColumnLeft="Add column left"
-            i18n-addColumnRight="kendo.spreadsheet.addColumnRight|The title of the tool that adds new column after currently selected column."
-            addColumnRight="Add column right"
-            i18n-addRowBelow="kendo.spreadsheet.addRowBelow|The title of the tool that adds new row below currently selected row."
-            addRowBelow="Add row below"
-            i18n-addRowAbove="kendo.spreadsheet.addRowAbove|The title of the tool that adds new row above currently selected row."
-            addRowAbove="Add row above"
-            i18n-deleteColumn="kendo.spreadsheet.deleteColumn|The title of the tool that deletes a column."
-            deleteColumn="Delete column"
-            i18n-deleteRow="kendo.spreadsheet.deleteRow|The title of the tool that deletes a row."
-            deleteRow="Delete row"
-            i18n-wrap="kendo.spreadsheet.wrap|The title of the Text Wrap tool."
-            wrap="Text wrap"
-            i18n-align="kendo.spreadsheet.align|The title of the Text Align tool."
-            align="Align"
-            i18n-alignHorizontal="kendo.spreadsheet.alignHorizontal|The title of the Text Align Horizontal tool."
-            alignHorizontal="Align horizontally"
-            i18n-alignVertical="kendo.spreadsheet.alignVertical|The title of the Text Align Vertical tool."
-            alignVertical="Align vertically"
-            i18n-alignLeft="kendo.spreadsheet.alignLeft|The title of the Text Align Left tool."
-            alignLeft="Align Left"
-            i18n-alignCenter="kendo.spreadsheet.alignCenter|The title of the Text Align Center tool."
-            alignCenter="Align Center"
-            i18n-alignRight="kendo.spreadsheet.alignRight|The title of the Text Align Right tool."
-            alignRight="Align Right"
-            i18n-alignJustify="kendo.spreadsheet.alignJustify|The title of the Text Align Justify tool."
-            alignJustify="Align Justify"
-            i18n-alignTop="kendo.spreadsheet.alignTop|The title of the Text Align Top tool."
-            alignTop="Align Top"
-            i18n-alignMiddle="kendo.spreadsheet.alignMiddle|The title of the Text Align Middle tool."
-            alignMiddle="Align Middle"
-            i18n-alignBottom="kendo.spreadsheet.alignBottom|The title of the Text Align Bottom tool."
-            alignBottom="Align Bottom"
-            i18n-merge="kendo.spreadsheet.merge|The title of the Cells Merge tool."
-            merge="Merge"
-            i18n-mergeAll="kendo.spreadsheet.mergeAll|The title of the Merge all tool."
-            mergeAll="Merge all"
-            i18n-mergeHorizontally="kendo.spreadsheet.mergeHorizontally|The title of the Merge horizontally tool."
-            mergeHorizontally="Merge horizontally"
-            i18n-mergeVertically="kendo.spreadsheet.mergeVertically|The title of the Merge vertically tool."
-            mergeVertically="Merge vertically"
-            i18n-unmerge="kendo.spreadsheet.unmerge|The title of the Unmerge tool."
-            unmerge="Unmerge"
-            i18n-insertLink="kendo.spreadsheet.insertLink|The title of the tool that inserts a link."
-            insertLink="Insert link"
-            i18n-decreaseDecimal="kendo.spreadsheet.decreaseDecimal|The title of the tool that decreases decimals."
-            decreaseDecimal="Decrease decimal"
-            i18n-increaseDecimal="kendo.spreadsheet.increaseDecimal|The title of the tool that increases decimals."
-            increaseDecimal="Increase decimal"
-            i18n-increaseFontSize="kendo.spreadsheet.increaseFontSize|The title of the tool that increases the cell font size."
-            increaseFontSize="Increase font size"
-            i18n-decreaseFontSize="kendo.spreadsheet.decreaseFontSize|The title of the tool that decreases the cell font size."
-            decreaseFontSize="Decrease font size"
-            i18n-dialogApply="kendo.spreadsheet.dialogApply|The text of the **Apply** button in all Spreadsheet dialogs."
-            dialogApply="Apply"
-            i18n-dialogCancel="kendo.spreadsheet.dialogCancel|The text of the **Cancel** button in all Spreadsheet dialogs."
-            dialogCancel="Cancel"
-            i18n-dialogDelete="kendo.spreadsheet.dialogDelete|The text of the **Delete** button in the Delete sheet dialog."
-            dialogDelete="Delete"
-            i18n-dialogRename="kendo.spreadsheet.dialogRename|The text of the **Rename** button in the Rename sheet dialog."
-            dialogRename="Rename"
-            i18n-dialogInsert="kendo.spreadsheet.dialogInsert|The text of the **Insert** button in all Spreadsheet dialogs."
-            dialogInsert="Insert"
-            i18n-dialogRemoveLink="kendo.spreadsheet.dialogRemoveLink|The text of the **Remove link** button in the Link tool dialog."
-            dialogRemoveLink="Remove link"
-            i18n-rename="kendo.spreadsheet.rename|The title of the Rename sheet dialog."
-            rename="Rename Sheet"
-            i18n-delete="kendo.spreadsheet.delete|The title of the Delete sheet dialog."
-            delete="Delete Sheet"
-            i18n-nameBox="kendo.spreadsheet.nameBox|The title of the Name Box input."
-            nameBox="Name Box"
-            i18n-formulaInput="kendo.spreadsheet.formulaInput|The title of the Formula input."
-            formulaInput="Formula Input"
-            i18n-addSheet="kendo.spreadsheet.addSheet|The title of the Add new sheet button."
-            addSheet="Add New Sheet"
-            i18n-sheetsMenu="kendo.spreadsheet.sheetsMenu|The title of the Sheets menu button."
-            sheetsMenu="All Sheets"
-            i18n-openUnsupported="kendo.spreadsheet.openUnsupported|The content of the dialog that warns about an unsupported file type."
-            openUnsupported="Unsupported format. Please select an .xlsx file."
-            i18n-modifyMerged="kendo.spreadsheet.modifyMerged|The content of the dialog that warns about modifying a merged cell."
-            modifyMerged="Cannot change part of a merged cell."
-            i18n-cannotModifyDisabled="kendo.spreadsheet.cannotModifyDisabled|The content of the dialog that warns about modifying a disabled cell."
-            cannotModifyDisabled="Cannot modify disabled cells."
-            i18n-dialogOk="kendo.spreadsheet.dialogOk|The text of the **OK** dialog button."
-            dialogOk="OK"
-            i18n-dialogError="kendo.spreadsheet.dialogError|The title of an error dialog."
-            dialogError="Error"
-            i18n-duplicateSheetName="kendo.spreadsheet.duplicateSheetName|The content of the dialog that warns about duplicated sheet name."
-            duplicateSheetName="There is an existing sheet with this name. Please enter another name."
-            i18n-copy="kendo.spreadsheet.copy|The Copy command text."
-            copy="Copy"
-            i18n-cut="kendo.spreadsheet.cut|The Cut command text."
-            cut="Cut"
-            i18n-paste="kendo.spreadsheet.paste|The Paste command text."
-            paste="Paste (use Ctrl/⌘ + V)"
-            i18n-hideRow="kendo.spreadsheet.hideRow|The Hide row command text."
-            hideRow="Hide"
-            i18n-unhideRow="kendo.spreadsheet.unhideRow|The Unhide row command text."
-            unhideRow="Unhide"
-            i18n-hideColumn="kendo.spreadsheet.hideColumn|The Hide column command text."
-            hideColumn="Hide"
-            i18n-unhideColumn="kendo.spreadsheet.unhideColumn|The Unhide column command text."
-            unhideColumn="Unhide"
-            i18n-sheetDelete="kendo.spreadsheet.sheetDelete|The text of the Sheet menu Delete option."
-            sheetDelete="Delete"
-            i18n-sheetRename="kendo.spreadsheet.sheetRename|The text of the Sheet menu Rename option."
-            sheetRename="Rename"
-            i18n-sheetDuplicate="kendo.spreadsheet.sheetDuplicate|The text of the Sheet menu Duplicate option."
-            sheetDuplicate="Duplicate"
-            i18n-sheetHide="kendo.spreadsheet.sheetHide|The text of the Sheet menu Hide option."
-            sheetHide="Hide"
-            i18n-sheetMoveLeft="kendo.spreadsheet.sheetMoveLeft|The text of the Sheet menu Move Left option."
-            sheetMoveLeft="Move Left"
-            i18n-sheetMoveRight="kendo.spreadsheet.sheetMoveRight|The text of the Sheet menu Move Right option."
-            sheetMoveRight="Move Right"
-            i18n-invalidNameError="kendo.spreadsheet.invalidNameError|The content of the dialog that warns about invalid name input."
-            invalidNameError="{{ 'Invalid name: {inputValue}' }}">
-        </ng-container>
-        <div class="k-spreadsheet-header">
-            <kendo-menu kendoSpreadsheetMenu (select)="onMenuItemSelect($event)">
-                <kendo-menu-item *ngFor="let item of menuItems" [text]="item.text" [cssClass]="item.cssClass"></kendo-menu-item>
-            </kendo-menu>
-            <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'file'"
-                [attr.aria-label]="messageFor('file')"
-                fillMode="flat"
-                class="k-spreadsheet-toolbar"
-                [overflow]="overflow">
-                <kendo-spreadsheet-load-file-tool></kendo-spreadsheet-load-file-tool>
-                <kendo-toolbar-button kendoSpreadsheetSaveFile></kendo-toolbar-button>
-            </kendo-toolbar>
-            <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'home'"
-                [attr.aria-label]="messageFor('home')"
-                class="k-spreadsheet-toolbar"
-                fillMode="flat"
-                [overflow]="overflow">
-                <kendo-toolbar-button kendoSpreadsheetUndo></kendo-toolbar-button>
-                <kendo-toolbar-button kendoSpreadsheetRedo></kendo-toolbar-button>
-                <kendo-toolbar-separator></kendo-toolbar-separator>
-                <kendo-toolbar-dropdownlist kendoSpreadsheetFontFamily></kendo-toolbar-dropdownlist>
-                <kendo-toolbar-dropdownlist kendoSpreadsheetFontSize></kendo-toolbar-dropdownlist>
-                <kendo-toolbar-buttongroup fillMode="flat">
-                    <kendo-toolbar-button kendoSpreadsheetIncreaseFontSize></kendo-toolbar-button>
-                    <kendo-toolbar-button kendoSpreadsheetDecreaseFontSize></kendo-toolbar-button>
-                </kendo-toolbar-buttongroup>
-                <kendo-toolbar-separator></kendo-toolbar-separator>
-                <kendo-toolbar-buttongroup fillMode="flat">
-                    <kendo-toolbar-button kendoSpreadsheetBold></kendo-toolbar-button>
-                    <kendo-toolbar-button kendoSpreadsheetItalic></kendo-toolbar-button>
-                    <kendo-toolbar-button kendoSpreadsheetUnderline></kendo-toolbar-button>
-                </kendo-toolbar-buttongroup>
-                <kendo-spreadsheet-forecolor-tool></kendo-spreadsheet-forecolor-tool>
-                <kendo-toolbar-separator></kendo-toolbar-separator>
-                <kendo-spreadsheet-backcolor-tool></kendo-spreadsheet-backcolor-tool>
-                <kendo-toolbar-separator></kendo-toolbar-separator>
-                <kendo-toolbar-dropdownbutton kendoSpreadsheetHorizontalTextAlign></kendo-toolbar-dropdownbutton>
-                <kendo-toolbar-dropdownbutton kendoSpreadsheetVerticalTextAlign></kendo-toolbar-dropdownbutton>
-                <kendo-toolbar-button kendoSpreadsheetTextWrap></kendo-toolbar-button>
-                <kendo-toolbar-separator></kendo-toolbar-separator>
-                <kendo-toolbar-dropdownbutton kendoSpreadsheetFormat></kendo-toolbar-dropdownbutton>
-            </kendo-toolbar>
-            <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'insert'"
-                [attr.aria-label]="messageFor('insert')"
-                fillMode="flat"
-                class="k-spreadsheet-toolbar"
-                [overflow]="overflow">
-                <kendo-toolbar-button kendoSpreadsheetInsertLink></kendo-toolbar-button>
-                <kendo-toolbar-separator></kendo-toolbar-separator>
-                <kendo-toolbar-button kendoSpreadsheetAddColumnLeftButton></kendo-toolbar-button>
-                <kendo-toolbar-button kendoSpreadsheetAddColumnRightButton></kendo-toolbar-button>
-                <kendo-toolbar-button kendoSpreadsheetAddRowBelowButton></kendo-toolbar-button>
-                <kendo-toolbar-button kendoSpreadsheetAddRowAboveButton></kendo-toolbar-button>
-                <kendo-toolbar-separator></kendo-toolbar-separator>
-                <kendo-toolbar-button kendoSpreadsheetDeleteColumnButton></kendo-toolbar-button>
-                <kendo-toolbar-button kendoSpreadsheetDeleteRowButton></kendo-toolbar-button>
-            </kendo-toolbar>
-            <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'format'"
-                [attr.aria-label]="messageFor('formatTab')"
-                fillMode="flat"
-                class="k-spreadsheet-toolbar"
-                [overflow]="overflow">
-                <kendo-toolbar-button kendoSpreadsheetDecreaseDecimal></kendo-toolbar-button>
-                <kendo-toolbar-button kendoSpreadsheetIncreaseDecimal></kendo-toolbar-button>
-            </kendo-toolbar>
-            <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'view'"
-                [attr.aria-label]="messageFor('view')"
-                fillMode="flat"
-                class="k-spreadsheet-toolbar"
-                [overflow]="overflow">
-                <kendo-toolbar-dropdownbutton kendoSpreadsheetMerge></kendo-toolbar-dropdownbutton>
-                <kendo-toolbar-separator></kendo-toolbar-separator>
-                <kendo-toolbar-button kendoSpreadsheetGridLines></kendo-toolbar-button>
-            </kendo-toolbar>
-        </div>
-        <div class="k-spreadsheet-action-bar">
-            <div #nameBox kendoSpreadsheetNameBox [spreadsheetWidget]="spreadsheetWidget"></div>
-            <div class="k-spreadsheet-formula-bar">
-                <span class="k-separator k-separator-vertical"></span>
-                <kendo-icon-wrapper
-                    name="formula-fx"
-                    [svgIcon]="formulaFxIcon">
-                </kendo-icon-wrapper>
-                <span class="k-separator k-separator-vertical"></span>
-                <div
-                    #formulaBar
-                    kendoSpreadsheetFormulaInput
-                    [formulaListMaxHeight]="formulaListMaxHeight"
-                    class="k-textbox k-input k-input-md k-input-flat k-rounded-md"></div>
-            </div>
-        </div>
-        <div class="k-spreadsheet-view">
-            <div class="k-spreadsheet-fixed-container"></div>
-                <div class="k-spreadsheet-scroller">
-                    <div class="k-spreadsheet-view-size"></div>
-                </div>
-            <div tabIndex="0" class="k-spreadsheet-clipboard" contentEditable="true"></div>
-            <div #formulaCell kendoSpreadsheetFormulaInput class="k-spreadsheet-cell-editor" data-role="formulainput"></div>
-        </div>
-        <div class="k-spreadsheet-sheets-bar"
-            kendoSpreadsheetSheetsBar
-            [sheets]="sheetsInfo"
-            [sheetDescriptors]="sheets">
-        </div>
-        <ng-container #dialogContainer></ng-container>
-
-        <kendo-contextmenu
-            #contextMenu
-            [items]="contextMenuItems"
-            (select)="onContextMenuSelect($event)"></kendo-contextmenu>
-
-        <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
-    `,
-                    standalone: true,
-                    imports: [LocalizedMessagesDirective, MenuComponent, MainMenuDirective, NgFor, MenuItemComponent, NgIf, ToolBarComponent, SpreadsheetLoadFileComponent, ToolBarButtonComponent, SpreadsheetSaveFileDirective, ToolBarButtonGroupComponent, SpreadsheetUndoDirective, SpreadsheetRedoDirective, ToolBarSeparatorComponent, SpreadsheetFontFamilyComponent, SpreadsheetFontSizeComponent, SpreadsheetIncreaseFontSizeDirective, SpreadsheetDecreaseFontSizeDirective, SpreadsheetBoldDirective, SpreadsheetItalicDirective, SpreadsheetUnderlineDirective, SpreadsheetForeColorComponent, SpreadsheetBackColorComponent, ToolBarDropDownButtonComponent, SpreadsheetHorizontalTextAlignDirective, SpreadsheetVerticalTextAlignDirective, SpreadsheetTextWrapDirective, SpreadsheetFormatDirective, SpreadsheetInsertLinkDirective, SpreadsheetAddColumnLeftButtonDirective, SpreadsheetAddColumnRightButtonDirective, SpreadsheetAddRowBelowButtonDirective, SpreadsheetAddRowAboveButtonDirective, SpreadsheetDeleteColumnButtonDirective, SpreadsheetDeleteRowButtonDirective, SpreadsheetDecreaseDecimalDirective, SpreadsheetIncreaseDecimalDirective, SpreadsheetMergeDirective, SpreadsheetGridLinesDirective, NameBoxComponent, IconWrapperComponent, FormulaInputDirective, SheetsBarComponent, ContextMenuComponent, WatermarkOverlayComponent]
-                }]
-        }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i1$3.IntlService }, { type: i0.ElementRef }, { type: i2.LocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }, { type: ErrorHandlingService }, { type: i1$1.DialogService }]; }, propDecorators: { formulaBarInputRef: [{
-                type: ViewChild,
-                args: ['formulaBar', { read: FormulaInputDirective }]
-            }], formulaCellInputRef: [{
-                type: ViewChild,
-                args: ['formulaCell', { read: FormulaInputDirective }]
-            }], nameBoxRef: [{
-                type: ViewChild,
-                args: ['nameBox']
-            }], dialogContainer: [{
-                type: ViewChild,
-                args: ['dialogContainer', { read: ViewContainerRef }]
-            }], contextMenu: [{
-                type: ViewChild,
-                args: ['contextMenu']
-            }], hostClass: [{
-                type: HostBinding,
-                args: ['class.k-spreadsheet']
-            }], role: [{
-                type: HostBinding,
-                args: ['attr.role']
-            }], menuItems: [{
-                type: Input
-            }], overflow: [{
-                type: Input
-            }], formulaListMaxHeight: [{
-                type: Input
-            }], activeSheet: [{
-                type: Input
-            }], sheets: [{
-                type: Input
-            }], columns: [{
-                type: Input
-            }], columnWidth: [{
-                type: Input
-            }], defaultCellStyle: [{
-                type: Input
-            }], headerHeight: [{
-                type: Input
-            }], headerWidth: [{
-                type: Input
-            }], rowHeight: [{
-                type: Input
-            }], rows: [{
-                type: Input
-            }], images: [{
-                type: Input
-            }], excel: [{
-                type: Input
-            }], change: [{
-                type: Output
-            }], formatChange: [{
-                type: Output
-            }], selectionChange: [{
-                type: Output
-            }], excelExport: [{
-                type: Output
-            }], excelImport: [{
-                type: Output
-            }], activeSheetChange: [{
-                type: Output
-            }] } });
-
-/**
- * Custom component messages override default component messages.
- */
-class CustomMessagesComponent extends MessagesDirective {
-    constructor(service) {
-        super();
-        this.service = service;
-    }
-    get override() {
-        return true;
-    }
-}
-CustomMessagesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CustomMessagesComponent, deps: [{ token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
-CustomMessagesComponent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: CustomMessagesComponent, isStandalone: true, selector: "kendo-spreadsheet-messages", providers: [
-        {
-            provide: MessagesDirective,
-            useExisting: forwardRef(() => CustomMessagesComponent)
-        }
-    ], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CustomMessagesComponent, decorators: [{
-            type: Directive,
-            args: [{
-                    providers: [
-                        {
-                            provide: MessagesDirective,
-                            useExisting: forwardRef(() => CustomMessagesComponent)
-                        }
-                    ],
-                    // eslint-disable-next-line @angular-eslint/directive-selector
-                    selector: 'kendo-spreadsheet-messages',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i2.LocalizationService }]; } });
-
-/**
- * @hidden
- */
-class SpreadsheetTextAlignDirective {
-    constructor(host, localization, spreadsheetService, toolsService) {
-        this.host = host;
-        this.spreadsheetService = spreadsheetService;
-        this.toolsService = toolsService;
-        this.commandName = 'align';
-        this.subs = new Subscription();
-        host.svgIcon = commandSVGIcons[this.commandName];
-        host.icon = commandIcons[this.commandName];
-        host.arrowIcon = true;
-        host.fillMode = 'flat';
-        host.data = ALIGNS.map(item => (Object.assign(Object.assign({}, item), { textKey: localization.get(item.commandId) })));
-        this.subs.add(host.itemClick.subscribe((e) => this.onItemClick(e)));
-        host.title = localization.get(this.commandName);
-        host.textField = 'textKey';
-    }
-    ngOnInit() {
-        this.subs.add(this.toolsService.stateChange.subscribe(state => this.host.data.forEach(i => i.cssClass = i.value === state[i.commandName] ? 'k-selected' : '')));
-    }
-    ngOnDestroy() {
-        this.subs.unsubscribe();
-    }
-    onItemClick(item) {
-        const value = item.value || null;
-        const options = {
-            command: 'PropertyChangeCommand', options: { property: item.commandName, value }
-        };
-        this.spreadsheetService.spreadsheet.executeCommand(options);
-    }
-}
-SpreadsheetTextAlignDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetTextAlignDirective, deps: [{ token: i1$2.ToolBarDropDownButtonComponent }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
-SpreadsheetTextAlignDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetTextAlignDirective, isStandalone: true, selector: "[kendoSpreadsheetTextAlign]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetTextAlignDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoSpreadsheetTextAlign]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.ToolBarDropDownButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
-
-/**
-* Utility array that contains all `@progress/kendo-angular-spreadsheet` related components and directives.
-*/
-const KENDO_SPREADSHEET = [
-    SpreadsheetComponent,
-    CustomMessagesComponent,
-    SpreadsheetBoldDirective,
-    SpreadsheetItalicDirective,
-    SpreadsheetUnderlineDirective,
-    SpreadsheetLoadFileComponent,
-    SpreadsheetSaveFileDirective,
-    SpreadsheetFormatDirective,
-    SpreadsheetUndoDirective,
-    SpreadsheetRedoDirective,
-    SpreadsheetFontFamilyComponent,
-    SpreadsheetFontSizeComponent,
-    SpreadsheetBackColorComponent,
-    SpreadsheetForeColorComponent,
-    SpreadsheetGridLinesDirective,
-    SpreadsheetAddColumnLeftButtonDirective,
-    SpreadsheetAddColumnRightButtonDirective,
-    SpreadsheetAddRowAboveButtonDirective,
-    SpreadsheetAddRowBelowButtonDirective,
-    SpreadsheetDeleteColumnButtonDirective,
-    SpreadsheetDeleteRowButtonDirective,
-    SpreadsheetTextAlignDirective,
-    SpreadsheetTextWrapDirective,
-    SpreadsheetMergeDirective,
-    SpreadsheetInsertLinkDirective,
-    SpreadsheetIncreaseFontSizeDirective,
-    SpreadsheetDecreaseFontSizeDirective,
-    SpreadsheetIncreaseDecimalDirective,
-    SpreadsheetDecreaseDecimalDirective,
-    SpreadsheetHorizontalTextAlignDirective,
-    SpreadsheetVerticalTextAlignDirective
-];
-
-// IMPORTANT: NgModule export kept for backwards compatibility
-/**
- * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
- * definition for the Spreadsheet component.
- */
-class SpreadsheetModule {
-}
-SpreadsheetModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-SpreadsheetModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetModule, imports: [SpreadsheetComponent, CustomMessagesComponent, SpreadsheetBoldDirective, SpreadsheetItalicDirective, SpreadsheetUnderlineDirective, SpreadsheetLoadFileComponent, SpreadsheetSaveFileDirective, SpreadsheetFormatDirective, SpreadsheetUndoDirective, SpreadsheetRedoDirective, SpreadsheetFontFamilyComponent, SpreadsheetFontSizeComponent, SpreadsheetBackColorComponent, SpreadsheetForeColorComponent, SpreadsheetGridLinesDirective, SpreadsheetAddColumnLeftButtonDirective, SpreadsheetAddColumnRightButtonDirective, SpreadsheetAddRowAboveButtonDirective, SpreadsheetAddRowBelowButtonDirective, SpreadsheetDeleteColumnButtonDirective, SpreadsheetDeleteRowButtonDirective, SpreadsheetTextAlignDirective, SpreadsheetTextWrapDirective, SpreadsheetMergeDirective, SpreadsheetInsertLinkDirective, SpreadsheetIncreaseFontSizeDirective, SpreadsheetDecreaseFontSizeDirective, SpreadsheetIncreaseDecimalDirective, SpreadsheetDecreaseDecimalDirective, SpreadsheetHorizontalTextAlignDirective, SpreadsheetVerticalTextAlignDirective], exports: [SpreadsheetComponent, CustomMessagesComponent, SpreadsheetBoldDirective, SpreadsheetItalicDirective, SpreadsheetUnderlineDirective, SpreadsheetLoadFileComponent, SpreadsheetSaveFileDirective, SpreadsheetFormatDirective, SpreadsheetUndoDirective, SpreadsheetRedoDirective, SpreadsheetFontFamilyComponent, SpreadsheetFontSizeComponent, SpreadsheetBackColorComponent, SpreadsheetForeColorComponent, SpreadsheetGridLinesDirective, SpreadsheetAddColumnLeftButtonDirective, SpreadsheetAddColumnRightButtonDirective, SpreadsheetAddRowAboveButtonDirective, SpreadsheetAddRowBelowButtonDirective, SpreadsheetDeleteColumnButtonDirective, SpreadsheetDeleteRowButtonDirective, SpreadsheetTextAlignDirective, SpreadsheetTextWrapDirective, SpreadsheetMergeDirective, SpreadsheetInsertLinkDirective, SpreadsheetIncreaseFontSizeDirective, SpreadsheetDecreaseFontSizeDirective, SpreadsheetIncreaseDecimalDirective, SpreadsheetDecreaseDecimalDirective, SpreadsheetHorizontalTextAlignDirective, SpreadsheetVerticalTextAlignDirective] });
-SpreadsheetModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetModule, providers: [IconsService, PopupService, ResizeBatchService, DialogContainerService, DialogService, WindowService, WindowContainerService], imports: [SpreadsheetComponent, SpreadsheetLoadFileComponent, SpreadsheetFontFamilyComponent, SpreadsheetFontSizeComponent, SpreadsheetBackColorComponent, SpreadsheetForeColorComponent] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    exports: [...KENDO_SPREADSHEET],
-                    imports: [...KENDO_SPREADSHEET],
-                    providers: [IconsService, PopupService, ResizeBatchService, DialogContainerService, DialogService, WindowService, WindowContainerService]
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { CustomMessagesComponent, FormulaInputDirective, FormulaListComponent, KENDO_SPREADSHEET, NameBoxComponent, SheetsBarComponent, SpreadsheetAddColumnLeftButtonDirective, SpreadsheetAddColumnRightButtonDirective, SpreadsheetAddRowAboveButtonDirective, SpreadsheetAddRowBelowButtonDirective, SpreadsheetBackColorComponent, SpreadsheetBoldDirective, SpreadsheetComponent, SpreadsheetDecreaseDecimalDirective, SpreadsheetDecreaseFontSizeDirective, SpreadsheetDeleteColumnButtonDirective, SpreadsheetDeleteRowButtonDirective, SpreadsheetFontFamilyComponent, SpreadsheetFontSizeComponent, SpreadsheetForeColorComponent, SpreadsheetFormatDirective, SpreadsheetGridLinesDirective, SpreadsheetHorizontalTextAlignDirective, SpreadsheetIncreaseDecimalDirective, SpreadsheetIncreaseFontSizeDirective, SpreadsheetInsertLinkDirective, SpreadsheetItalicDirective, SpreadsheetLoadFileComponent, SpreadsheetMergeDirective, SpreadsheetModule, SpreadsheetRedoDirective, SpreadsheetSaveFileDirective, SpreadsheetTextAlignDirective, SpreadsheetTextWrapDirective, SpreadsheetUnderlineDirective, SpreadsheetUndoDirective, SpreadsheetVerticalTextAlignDirective };
-