@progress/kendo-angular-spreadsheet 17.0.0-develop.4 → 17.0.0-develop.41

package/{esm2020 → esm2022}/tools/insert/insert-link-dialog.component.mjs

@@ -12,17 +12,18 @@ import * as i1 from "@progress/kendo-angular-dialog";
  * @hidden
  */
 export class InsertLinkDialogComponent extends DialogContentBase {
+    dialog;
+    urlLink = '';
+    title;
     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.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: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: InsertLinkDialogComponent, deps: [{ token: i1.DialogRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", 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>
@@ -32,7 +33,8 @@ InsertLinkDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.
         </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: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: InsertLinkDialogComponent, decorators: [{
             type: Component,
             args: [{
                     template: `

package/{esm2020 → esm2022}/tools/insert/insert-link-tool.directive.mjs

@@ -22,6 +22,8 @@ import * as i5 from "@progress/kendo-angular-dialog";
  * @hidden
  */
 export class SpreadsheetInsertLinkDirective extends SpreadsheetCommandButton {
+    dialogService;
+    currentRange;
     constructor(button, localization, spreadsheetService, toolsService, dialogService) {
         super('insertLink', button, localization, spreadsheetService, toolsService, {
             command: 'HyperlinkCommand'
@@ -83,10 +85,10 @@ export class SpreadsheetInsertLinkDirective extends SpreadsheetCommandButton {
             });
         });
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetInsertLinkDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.SpreadsheetToolsService }, { token: i5.DialogService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SpreadsheetInsertLinkDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetInsertLink]", usesInheritance: true, ngImport: i0 });
 }
-SpreadsheetInsertLinkDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetInsertLinkDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.SpreadsheetToolsService }, { token: i5.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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetInsertLinkDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'kendo-toolbar-button[kendoSpreadsheetInsertLink]',

package/{esm2020 → esm2022}/tools/load-file.component.mjs

@@ -2,7 +2,7 @@
 * Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { Component, ElementRef, Inject, TemplateRef, ViewChild, forwardRef } from '@angular/core';
+import { Component, ElementRef, Inject, ViewChild, forwardRef } from '@angular/core';
 import { ToolBarComponent, ToolBarToolComponent } from '@progress/kendo-angular-toolbar';
 import { IconWrapperComponent } from '@progress/kendo-angular-icons';
 import { ButtonComponent } from '@progress/kendo-angular-buttons';
@@ -17,21 +17,19 @@ import * as i3 from "@progress/kendo-angular-toolbar";
  * @hidden
  */
 export class SpreadsheetLoadFileComponent extends ToolBarToolComponent {
+    localization;
+    spreadsheetService;
+    toolbar;
+    overflowButtonElement;
+    button;
+    icon = commandIcons['folderOpen'];
+    svgIcon = commandSVGIcons['folderOpen'];
+    tabindex = -1;
     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;
     }
     /**
@@ -40,6 +38,13 @@ export class SpreadsheetLoadFileComponent extends ToolBarToolComponent {
     messageFor(key) {
         return this.localization.get(key);
     }
+    onFileSelect = (e) => {
+        const file = e.target.files[0];
+        if (file) {
+            this.spreadsheetService.spreadsheet.executeCommand({ command: 'OpenCommand', options: { file } });
+            e.target.value = null;
+        }
+    };
     /**
      * @hidden
      */
@@ -65,14 +70,13 @@ export class SpreadsheetLoadFileComponent extends ToolBarToolComponent {
         this.tabindex = -1;
         return false;
     }
-}
-SpreadsheetLoadFileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetLoadFileComponent, deps: [{ token: i1.SpreadsheetLocalizationService }, { token: i2.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: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetLoadFileComponent, deps: [{ token: i1.SpreadsheetLocalizationService }, { token: i2.SpreadsheetService }, { token: ToolBarComponent }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SpreadsheetLoadFileComponent, isStandalone: true, selector: "kendo-spreadsheet-load-file-tool", providers: [
+            {
+                provide: ToolBarToolComponent,
+                useExisting: forwardRef(() => SpreadsheetLoadFileComponent),
+            },
+        ], viewQueries: [{ 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
@@ -115,8 +119,9 @@ SpreadsheetLoadFileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14
                     accept=".xlsx,.XLSX" />
             </div>
         </ng-template>
-    `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "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: [{
+    `, 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: "16.2.12", ngImport: i0, type: SpreadsheetLoadFileComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kendo-spreadsheet-load-file-tool',
@@ -176,13 +181,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
         }], ctorParameters: function () { return [{ type: i1.SpreadsheetLocalizationService }, { type: i2.SpreadsheetService }, { type: i3.ToolBarComponent, decorators: [{
                     type: Inject,
                     args: [ToolBarComponent]
-                }] }]; }, propDecorators: { toolbarTemplate: [{
-                type: ViewChild,
-                args: ['toolbarTemplate', { static: true }]
-            }], popupTemplate: [{
-                type: ViewChild,
-                args: ['popupTemplate', { static: true }]
-            }], overflowButtonElement: [{
+                }] }]; }, propDecorators: { overflowButtonElement: [{
                 type: ViewChild,
                 args: ['overflowButton', { read: ElementRef, static: false }]
             }], button: [{

package/{esm2020 → esm2022}/tools/save-file-tool.directive.mjs

@@ -18,11 +18,14 @@ import * as i3 from "../common/spreadsheet.service";
  * @hidden
  */
 export class SpreadsheetSaveFileDirective {
+    button;
+    localization;
+    spreadsheetService;
+    subs = new Subscription();
     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');
@@ -43,10 +46,10 @@ export class SpreadsheetSaveFileDirective {
     ngOnDestroy() {
         this.subs.unsubscribe();
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetSaveFileDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SpreadsheetSaveFileDirective, isStandalone: true, selector: "[kendoSpreadsheetSaveFile]", ngImport: i0 });
 }
-SpreadsheetSaveFileDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetSaveFileDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetSaveFileDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoSpreadsheetSaveFile]',

package/{esm2020 → esm2022}/tools/shared/dialog-content.component.mjs

@@ -14,10 +14,15 @@ import * as i1 from "@progress/kendo-angular-dialog";
  * @hidden
  */
 export class DialogContentComponent extends DialogContentBase {
+    dialog;
+    data = [];
+    value;
+    tabindex;
+    componentType;
+    title;
     constructor(dialog) {
         super(dialog);
         this.dialog = dialog;
-        this.data = [];
     }
     setData(args) {
         this.data = args.data;
@@ -25,9 +30,8 @@ export class DialogContentComponent extends DialogContentBase {
         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.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: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogContentComponent, deps: [{ token: i1.DialogRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", 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">
@@ -67,7 +71,8 @@ DialogContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
             ></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: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogContentComponent, decorators: [{
             type: Component,
             args: [{
                     template: `

package/{esm2020 → esm2022}/tools/shared/spreadsheet-command-base.mjs

@@ -20,13 +20,18 @@ import * as i4 from "../tools.service";
  * @hidden
  */
 export class SpreadsheetCommandBaseDirective {
+    command;
+    button;
+    localization;
+    spreadsheetService;
+    toolsService;
+    subs = new Subscription();
     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';
@@ -54,10 +59,10 @@ export class SpreadsheetCommandBaseDirective {
     }
     clickHandler() { }
     pointerdownHandler(_event) { }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetCommandBaseDirective, deps: [{ token: MY_TOKEN }, { token: i1.ToolBarButtonComponent }, { token: i2.LocalizationService }, { token: i3.SpreadsheetService }, { token: i4.SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SpreadsheetCommandBaseDirective, selector: "[kendoSpreadsheetCommandBase]", ngImport: i0 });
 }
-SpreadsheetCommandBaseDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetCommandBaseDirective, deps: [{ token: MY_TOKEN }, { token: i1.ToolBarButtonComponent }, { token: i2.LocalizationService }, { token: i3.SpreadsheetService }, { token: i4.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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetCommandBaseDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoSpreadsheetCommandBase]'

package/{esm2020 → esm2022}/tools/shared/spreadsheet-command-button.mjs

@@ -7,6 +7,12 @@ import { SpreadsheetCommandBaseDirective } from './spreadsheet-command-base';
  * @hidden
  */
 export class SpreadsheetCommandButton extends SpreadsheetCommandBaseDirective {
+    command;
+    button;
+    localization;
+    spreadsheetService;
+    toolsService;
+    commandOptions;
     constructor(command, button, localization, spreadsheetService, toolsService, commandOptions) {
         super(command, button, localization, spreadsheetService, toolsService);
         this.command = command;

package/{esm2020 → esm2022}/tools/shared/spreadsheet-dropdown-tools-base.mjs

@@ -2,7 +2,7 @@
 * Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { Component, ElementRef, EventEmitter, Inject, Output, TemplateRef, ViewChild } from "@angular/core";
+import { Component, ElementRef, EventEmitter, Inject, Output, ViewChild } from "@angular/core";
 import { ToolBarComponent, ToolBarToolComponent } from "@progress/kendo-angular-toolbar";
 import { SpreadsheetService } from "../../common/spreadsheet.service";
 import { SpreadsheetLocalizationService } from "../../localization/spreadsheet-localization.service";
@@ -24,6 +24,16 @@ import * as i5 from "@progress/kendo-angular-toolbar";
  * @hidden
  */
 export class SpreadsheetDropDownToolBase extends ToolBarToolComponent {
+    command;
+    dialogService;
+    localization;
+    spreadsheetService;
+    toolsService;
+    toolbar;
+    element;
+    dropDownListRef;
+    popupButton;
+    data;
     constructor(command, dialogService, localization, spreadsheetService, toolsService, toolbar) {
         super();
         this.command = command;
@@ -32,17 +42,20 @@ export class SpreadsheetDropDownToolBase extends ToolBarToolComponent {
         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;
     }
+    /**
+     * Fires when the user updates the value of the drop-down list.
+     */
+    valueChange = new EventEmitter();
+    value;
+    tabindex = -1;
+    itemDisabled;
+    svgIcon = commandSVGIcons[this.command];
+    icon = commandIcons[this.command];
+    subs;
     ngOnInit() {
         this.value = this.toolsService.toolsState[this.command];
         this.subs = this.toolsService.stateChange.subscribe(state => {
@@ -154,10 +167,10 @@ export class SpreadsheetDropDownToolBase extends ToolBarToolComponent {
         this.tabindex = -1;
         return false;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetDropDownToolBase, deps: [{ token: MY_TOKEN }, { token: i1.DialogService }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.SpreadsheetToolsService }, { token: i5.ToolBarComponent }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SpreadsheetDropDownToolBase, selector: "ng-component", outputs: { valueChange: "valueChange" }, viewQueries: [{ 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 });
 }
-SpreadsheetDropDownToolBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetDropDownToolBase, deps: [{ token: MY_TOKEN }, { token: i1.DialogService }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.SpreadsheetToolsService }, { token: i5.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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetDropDownToolBase, decorators: [{
             type: Component,
             args: [{
                     template: ``
@@ -165,13 +178,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [MY_TOKEN]
-                }] }, { type: i1.DialogService }, { type: i2.SpreadsheetLocalizationService }, { type: i3.SpreadsheetService }, { type: i4.SpreadsheetToolsService }, { type: i5.ToolBarComponent }]; }, propDecorators: { toolbarTemplate: [{
-                type: ViewChild,
-                args: ['toolbarTemplate', { static: true }]
-            }], popupTemplate: [{
-                type: ViewChild,
-                args: ['popupTemplate', { static: true }]
-            }], element: [{
+                }] }, { type: i1.DialogService }, { type: i2.SpreadsheetLocalizationService }, { type: i3.SpreadsheetService }, { type: i4.SpreadsheetToolsService }, { type: i5.ToolBarComponent }]; }, propDecorators: { element: [{
                 type: ViewChild,
                 args: ['element', { read: ElementRef }]
             }], dropDownListRef: [{

package/{esm2020 → esm2022}/tools/shared/spreadsheet-dropdownlist.base.mjs

@@ -9,21 +9,25 @@ import * as i0 from "@angular/core";
  * @hidden
  */
 export class DropDownListBase {
-    constructor() {
-        this.display = 'inline-flex';
-        this.fillMode = 'flat';
-        this.valueChange = new EventEmitter();
-    }
+    display = 'inline-flex';
+    data;
+    value;
+    title;
+    tabindex;
+    fillMode = 'flat';
+    valueChange = new EventEmitter();
+    element;
+    dropDownList;
     onValueChange(value) {
         this.valueChange.emit(value);
     }
     focus() {
         this.dropDownList.focus();
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DropDownListBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", 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 });
 }
-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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DropDownListBase, decorators: [{
             type: Directive,
             args: [{
                     selector: 'kendo-spreadsheet-dropdownlist-base'

package/{esm2020 → esm2022}/tools/tables/add-column-left-button.directive.mjs

@@ -25,10 +25,10 @@ export class SpreadsheetAddColumnLeftButtonDirective extends SpreadsheetCommandB
             }
         });
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetAddColumnLeftButtonDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SpreadsheetAddColumnLeftButtonDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnLeftButton]", usesInheritance: true, ngImport: i0 });
 }
-SpreadsheetAddColumnLeftButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetAddColumnLeftButtonDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetAddColumnLeftButtonDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'kendo-toolbar-button[kendoSpreadsheetAddColumnLeftButton]',

package/{esm2020 → esm2022}/tools/tables/add-column-right-button.directive.mjs

@@ -25,10 +25,10 @@ export class SpreadsheetAddColumnRightButtonDirective extends SpreadsheetCommand
             }
         });
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetAddColumnRightButtonDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SpreadsheetAddColumnRightButtonDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnRightButton]", usesInheritance: true, ngImport: i0 });
 }
-SpreadsheetAddColumnRightButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetAddColumnRightButtonDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetAddColumnRightButtonDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'kendo-toolbar-button[kendoSpreadsheetAddColumnRightButton]',

package/{esm2020 → esm2022}/tools/tables/add-row-above-button.directive.mjs

@@ -25,10 +25,10 @@ export class SpreadsheetAddRowAboveButtonDirective extends SpreadsheetCommandBut
             }
         });
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetAddRowAboveButtonDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SpreadsheetAddRowAboveButtonDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowAboveButton]", usesInheritance: true, ngImport: i0 });
 }
-SpreadsheetAddRowAboveButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetAddRowAboveButtonDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetAddRowAboveButtonDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'kendo-toolbar-button[kendoSpreadsheetAddRowAboveButton]',

package/{esm2020 → esm2022}/tools/tables/add-row-below-button.directive.mjs

@@ -25,10 +25,10 @@ export class SpreadsheetAddRowBelowButtonDirective extends SpreadsheetCommandBut
             }
         });
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetAddRowBelowButtonDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SpreadsheetAddRowBelowButtonDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowBelowButton]", usesInheritance: true, ngImport: i0 });
 }
-SpreadsheetAddRowBelowButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetAddRowBelowButtonDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetAddRowBelowButtonDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'kendo-toolbar-button[kendoSpreadsheetAddRowBelowButton]',

package/{esm2020 → esm2022}/tools/tables/delete-column-button.directive.mjs

@@ -23,10 +23,10 @@ export class SpreadsheetDeleteColumnButtonDirective extends SpreadsheetCommandBu
             options: { property: 'deleteColumn' }
         });
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetDeleteColumnButtonDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SpreadsheetDeleteColumnButtonDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteColumnButton]", usesInheritance: true, ngImport: i0 });
 }
-SpreadsheetDeleteColumnButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetDeleteColumnButtonDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetDeleteColumnButtonDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'kendo-toolbar-button[kendoSpreadsheetDeleteColumnButton]',

package/{esm2020 → esm2022}/tools/tables/delete-row-button.directive.mjs

@@ -23,10 +23,10 @@ export class SpreadsheetDeleteRowButtonDirective extends SpreadsheetCommandButto
             options: { property: 'deleteRow' }
         });
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetDeleteRowButtonDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SpreadsheetDeleteRowButtonDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteRowButton]", usesInheritance: true, ngImport: i0 });
 }
-SpreadsheetDeleteRowButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetDeleteRowButtonDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetDeleteRowButtonDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'kendo-toolbar-button[kendoSpreadsheetDeleteRowButton]',

package/{esm2020 → esm2022}/tools/tables/merge-tool.directive.mjs

@@ -17,11 +17,14 @@ import * as i3 from "../../common/spreadsheet.service";
  * @hidden
  */
 export class SpreadsheetMergeDirective {
+    host;
+    spreadsheetService;
+    commandName = 'merge';
+    subs = new Subscription();
+    selectedRange;
     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;
@@ -57,10 +60,10 @@ export class SpreadsheetMergeDirective {
         const range = sheet._ref(this.selectedRange);
         return sheet._getMergedCells(range).hasMerged;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetMergeDirective, deps: [{ token: i1.ToolBarDropDownButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SpreadsheetMergeDirective, isStandalone: true, selector: "[kendoSpreadsheetMerge]", ngImport: i0 });
 }
-SpreadsheetMergeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetMergeDirective, deps: [{ token: i1.ToolBarDropDownButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetMergeDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoSpreadsheetMerge]',

package/{esm2020 → esm2022}/tools/text-wrap-tool.directive.mjs

@@ -36,10 +36,10 @@ export class SpreadsheetTextWrapDirective extends SpreadsheetCommandButton {
             this.spreadsheetService.spreadsheet.executeCommand(options);
         }
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetTextWrapDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SpreadsheetTextWrapDirective, isStandalone: true, selector: "kendo-toolbar-button[kendoSpreadsheetTextWrap]", usesInheritance: true, ngImport: i0 });
 }
-SpreadsheetTextWrapDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetTextWrapDirective, deps: [{ token: i1.ToolBarButtonComponent }, { token: i2.SpreadsheetLocalizationService }, { token: i3.SpreadsheetService }, { token: i4.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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetTextWrapDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'kendo-toolbar-button[kendoSpreadsheetTextWrap]',

package/esm2022/tools/tools.service.mjs

@@ -0,0 +1,61 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { EventEmitter, Injectable, NgZone, Output } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * @hidden
+ */
+export class SpreadsheetToolsService {
+    ngZone;
+    stateChange = new EventEmitter();
+    set toolsState(state) {
+        this._toolsState = state;
+    }
+    get toolsState() {
+        return this._toolsState;
+    }
+    toolsFunctions = [
+        'bold',
+        'italic',
+        'underline',
+        'fontFamily',
+        'fontSize',
+        'color',
+        'background',
+        'textAlign',
+        'verticalAlign',
+        'wrap',
+        'gridLines',
+        'format'
+    ];
+    _toolsState = {};
+    constructor(ngZone) {
+        this.ngZone = ngZone;
+    }
+    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);
+            }
+        });
+    };
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetToolsService, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetToolsService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpreadsheetToolsService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i0.NgZone }]; }, propDecorators: { stateChange: [{
+                type: Output
+            }] } });