@progress/kendo-angular-spreadsheet 14.0.0-develop.1 → 14.0.0-develop.11

package/esm2020/spreadsheet.component.mjs

@@ -2,7 +2,7 @@
 * Copyright © 2023 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { Component, ElementRef, EventEmitter, HostBinding, Input, NgZone, Output, Renderer2, ViewChild, ViewContainerRef } from '@angular/core';
+import { Component, ElementRef, EventEmitter, HostBinding, Input, NgZone, Output, ViewChild, ViewContainerRef } from '@angular/core';
 import { validatePackage } from '@progress/kendo-licensing';
 import { packageMetadata } from './package-metadata';
 import { SpreadsheetWidget } from '@progress/kendo-spreadsheet-common';
@@ -31,7 +31,7 @@ import * as i9 from "./tools/font-size/spreadsheet-fontsize-tool.component";
 import * as i10 from "./tools/colorpicker/spreadsheet-forecolor.component";
 import * as i11 from "./tools/colorpicker/spreadsheet-backcolor.component";
 import * as i12 from "./action-bar/namebox.component";
-import * as i13 from "@progress/kendo-angular-buttons";
+import * as i13 from "@progress/kendo-angular-icons";
 import * as i14 from "./sheets-bar/sheets-bar.component";
 import * as i15 from "@progress/kendo-angular-common";
 import * as i16 from "./localization/localized-messages.directive";
@@ -58,14 +58,13 @@ import * as i35 from "./action-bar/formula-input.directive";
  * Represents the [Kendo UI Spreadsheet component for Angular]({% slug overview_spreadsheet %}).
  */
 export class SpreadsheetComponent {
-    constructor(ngZone, intl, host, localization, spreadsheetService, toolsService, renderer) {
+    constructor(ngZone, intl, host, localization, spreadsheetService, toolsService) {
         this.ngZone = ngZone;
         this.intl = intl;
         this.host = host;
         this.localization = localization;
         this.spreadsheetService = spreadsheetService;
         this.toolsService = toolsService;
-        this.renderer = renderer;
         this.hostClass = true;
         this.role = 'application';
         /**
@@ -82,13 +81,13 @@ export class SpreadsheetComponent {
         /**
          * The initial column width in pixels.
          *
-         * @default 64
+         * @default 100
          */
         this.columnWidth = 100;
         /**
          * The height of the header row in pixels.
          *
-         * @default 20
+         * @default 30
          */
         this.headerHeight = 30;
         /**
@@ -96,11 +95,11 @@ export class SpreadsheetComponent {
          *
          * @default 32
          */
-        this.headerWidth = 100;
+        this.headerWidth = 32;
         /**
          * The initial row height in pixels.
          *
-         * @default 20
+         * @default 30
          */
         this.rowHeight = 30;
         /**
@@ -306,7 +305,6 @@ export class SpreadsheetComponent {
         this.ngZone.run(() => this.spreadsheetService.currentActiveSheet = name);
     }
     onSheetsChanged(e) {
-        console.log(e, 'sheet ch');
         this.ngZone.run(() => {
             this.sheets = mapToSheetDescriptor(e.sheets);
             this.updateActiveSheet(this.spreadsheetService.activeSheet);
@@ -329,9 +327,8 @@ export class SpreadsheetComponent {
             defaultCellStyle: this.defaultCellStyle,
             excel: this.excel,
             headerHeight: this.headerHeight,
-            headerWidth: this.headerHeight,
+            headerWidth: this.headerWidth,
             images: this.images,
-            names: this.names,
             rowHeight: this.rowHeight,
             rows: this.rows,
             formulaBarInputRef: { current: this.formulaBarInputRef.current },
@@ -340,8 +337,8 @@ export class SpreadsheetComponent {
         };
     }
 }
-SpreadsheetComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: SpreadsheetComponent, deps: [{ token: i0.NgZone }, { token: i1.IntlService }, { token: i0.ElementRef }, { token: i2.LocalizationService }, { token: i3.SpreadsheetService }, { token: i4.SpreadsheetToolsService }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: SpreadsheetComponent, selector: "kendo-spreadsheet", inputs: { menuItems: "menuItems", overflow: "overflow", activeSheet: "activeSheet", sheets: "sheets", columns: "columns", columnWidth: "columnWidth", defaultCellStyle: "defaultCellStyle", headerHeight: "headerHeight", headerWidth: "headerWidth", rowHeight: "rowHeight", rows: "rows", names: "names", 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: [
+SpreadsheetComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: SpreadsheetComponent, deps: [{ token: i0.NgZone }, { token: i1.IntlService }, { token: i0.ElementRef }, { token: i2.LocalizationService }, { token: i3.SpreadsheetService }, { token: i4.SpreadsheetToolsService }], target: i0.ɵɵFactoryTarget.Component });
+SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: SpreadsheetComponent, selector: "kendo-spreadsheet", inputs: { menuItems: "menuItems", overflow: "overflow", 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,
         {
             provide: LocalizationService,
@@ -415,7 +412,13 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
             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">
+            delete="Delete Sheet"
+            i18n-nameBox="kendo.spreadsheet.nameBox|The title of the Name Box input."
+            nameBox="Name Box"
+            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">
         </ng-container>
         <div class="k-spreadsheet-header">
             <kendo-menu kendoSpreadsheetMenu (select)="onMenuItemSelect($event)">
@@ -472,14 +475,12 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
             <div #nameBox kendoSpreadsheetNameBox [spreadsheetWidget]="spreadsheetWidget"></div>
             <div class="k-spreadsheet-formula-bar">
                 <span class="k-separator k-separator-vertical"></span>
-                <button kendoButton
-                    icon="formula-fx"
-                    [svgIcon]="formulaFxIcon"
-                    [fillMode]="'flat'">
-                </button>
+                <kendo-icon-wrapper
+                    name="formula-fx"
+                    [svgIcon]="formulaFxIcon">
+                </kendo-icon-wrapper>
                 <span class="k-separator k-separator-vertical"></span>
                 <div #formulaBar kendoSpreadsheetFormulaInput class="k-textbox k-input k-input-md k-input-flat k-rounded-md"></div>
-                <div class="k-widget k-tooltip" style="position: absolute; display: none;">A1</div>
             </div>
         </div>
         <div class="k-spreadsheet-view">
@@ -498,7 +499,7 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
         <ng-container #dialogContainer></ng-container>
 
         <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
-    `, isInline: true, components: [{ type: i5.MenuComponent, selector: "kendo-menu", inputs: ["menuItemTemplate", "ariaRole", "menuItemLinkTemplate"], outputs: ["select", "open", "close"], exportAs: ["kendoMenu"] }, { type: i5.MenuItemComponent, selector: "kendo-menu-item", inputs: ["text", "url", "disabled", "cssClass", "cssStyle", "icon", "svgIcon", "data", "separator"] }, { type: i6.ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "tabindex", "size", "tabIndex"], outputs: ["open", "close"], exportAs: ["kendoToolBar"] }, { type: i7.SpreadsheetLoadFileComponent, selector: "kendo-spreadsheet-load-file-tool" }, { type: i6.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"] }, { type: i6.ToolBarButtonGroupComponent, selector: "kendo-toolbar-buttongroup", inputs: ["disabled", "selection", "width", "look"], exportAs: ["kendoToolBarButtonGroup"] }, { type: i6.ToolBarSeparatorComponent, selector: "kendo-toolbar-separator", exportAs: ["kendoToolBarSeparator"] }, { type: i8.SpreadsheetFontFamilyComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontFamily]" }, { type: i9.SpreadsheetFontSizeComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontSize]" }, { type: i10.SpreadsheetForeColorComponent, selector: "kendo-spreadsheet-forecolor-tool" }, { type: i11.SpreadsheetBackColorComponent, selector: "kendo-spreadsheet-backcolor-tool" }, { type: i6.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"] }, { type: i12.NameBoxComponent, selector: "[kendoSpreadsheetNameBox]", inputs: ["data", "spreadsheetWidget"] }, { type: i13.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"] }, { type: i14.SheetsBarComponent, selector: "[kendoSpreadsheetSheetsBar]", inputs: ["sheets", "sheetDescriptors"] }, { type: i15.WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }], directives: [{ type: i16.LocalizedMessagesDirective, selector: "[kendoSpreadsheetLocalizedMessages]" }, { type: i17.MainMenuDirective, selector: "[kendoSpreadsheetMenu]" }, { type: i18.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i18.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i19.SpreadsheetSaveFileDirective, selector: "[kendoSpreadsheetSaveFile]" }, { type: i20.SpreadsheetUndoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUndo]" }, { type: i21.SpreadsheetRedoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetRedo]" }, { type: i22.SpreadsheetBoldDirective, selector: "kendo-toolbar-button[kendoSpreadsheetBold]" }, { type: i23.SpreadsheetItalicDirective, selector: "kendo-toolbar-button[kendoSpreadsheetItalic]" }, { type: i24.SpreadsheetUnderlineDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUnderline]" }, { type: i25.SpreadsheetTextAlignDirective, selector: "[kendoSpreadsheetTextAlign]" }, { type: i26.SpreadsheetTextWrapDirective, selector: "kendo-toolbar-button[kendoSpreadsheetTextWrap]" }, { type: i27.SpreadsheetFormatDirective, selector: "[kendoSpreadsheetFormat]" }, { type: i28.SpreadsheetGridLinesDirective, selector: "kendo-toolbar-button[kendoSpreadsheetGridLines]" }, { type: i29.SpreadsheetAddColumnLeftButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnLeftButton]" }, { type: i30.SpreadsheetAddColumnRightButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnRightButton]" }, { type: i31.SpreadsheetAddRowBelowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowBelowButton]" }, { type: i32.SpreadsheetAddRowAboveButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowAboveButton]" }, { type: i33.SpreadsheetDeleteColumnButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteColumnButton]" }, { type: i34.SpreadsheetDeleteRowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteRowButton]" }, { type: i35.FormulaInputDirective, selector: "[kendoSpreadsheetFormulaInput]" }] });
+    `, isInline: true, components: [{ type: i5.MenuComponent, selector: "kendo-menu", inputs: ["menuItemTemplate", "ariaRole", "menuItemLinkTemplate"], outputs: ["select", "open", "close"], exportAs: ["kendoMenu"] }, { type: i5.MenuItemComponent, selector: "kendo-menu-item", inputs: ["text", "url", "disabled", "cssClass", "cssStyle", "icon", "svgIcon", "data", "separator"] }, { type: i6.ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "tabindex", "size", "tabIndex"], outputs: ["open", "close"], exportAs: ["kendoToolBar"] }, { type: i7.SpreadsheetLoadFileComponent, selector: "kendo-spreadsheet-load-file-tool" }, { type: i6.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"] }, { type: i6.ToolBarButtonGroupComponent, selector: "kendo-toolbar-buttongroup", inputs: ["disabled", "selection", "width", "look"], exportAs: ["kendoToolBarButtonGroup"] }, { type: i6.ToolBarSeparatorComponent, selector: "kendo-toolbar-separator", exportAs: ["kendoToolBarSeparator"] }, { type: i8.SpreadsheetFontFamilyComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontFamily]" }, { type: i9.SpreadsheetFontSizeComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontSize]" }, { type: i10.SpreadsheetForeColorComponent, selector: "kendo-spreadsheet-forecolor-tool" }, { type: i11.SpreadsheetBackColorComponent, selector: "kendo-spreadsheet-backcolor-tool" }, { type: i6.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"] }, { type: i12.NameBoxComponent, selector: "[kendoSpreadsheetNameBox]", inputs: ["data", "spreadsheetWidget"] }, { type: i13.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { type: i14.SheetsBarComponent, selector: "[kendoSpreadsheetSheetsBar]", inputs: ["sheets", "sheetDescriptors"] }, { type: i15.WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }], directives: [{ type: i16.LocalizedMessagesDirective, selector: "[kendoSpreadsheetLocalizedMessages]" }, { type: i17.MainMenuDirective, selector: "[kendoSpreadsheetMenu]" }, { type: i18.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i18.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i19.SpreadsheetSaveFileDirective, selector: "[kendoSpreadsheetSaveFile]" }, { type: i20.SpreadsheetUndoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUndo]" }, { type: i21.SpreadsheetRedoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetRedo]" }, { type: i22.SpreadsheetBoldDirective, selector: "kendo-toolbar-button[kendoSpreadsheetBold]" }, { type: i23.SpreadsheetItalicDirective, selector: "kendo-toolbar-button[kendoSpreadsheetItalic]" }, { type: i24.SpreadsheetUnderlineDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUnderline]" }, { type: i25.SpreadsheetTextAlignDirective, selector: "[kendoSpreadsheetTextAlign]" }, { type: i26.SpreadsheetTextWrapDirective, selector: "kendo-toolbar-button[kendoSpreadsheetTextWrap]" }, { type: i27.SpreadsheetFormatDirective, selector: "[kendoSpreadsheetFormat]" }, { type: i28.SpreadsheetGridLinesDirective, selector: "kendo-toolbar-button[kendoSpreadsheetGridLines]" }, { type: i29.SpreadsheetAddColumnLeftButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnLeftButton]" }, { type: i30.SpreadsheetAddColumnRightButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnRightButton]" }, { type: i31.SpreadsheetAddRowBelowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowBelowButton]" }, { type: i32.SpreadsheetAddRowAboveButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowAboveButton]" }, { type: i33.SpreadsheetDeleteColumnButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteColumnButton]" }, { type: i34.SpreadsheetDeleteRowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteRowButton]" }, { type: i35.FormulaInputDirective, selector: "[kendoSpreadsheetFormulaInput]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: SpreadsheetComponent, decorators: [{
             type: Component,
             args: [{
@@ -579,7 +580,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             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">
+            delete="Delete Sheet"
+            i18n-nameBox="kendo.spreadsheet.nameBox|The title of the Name Box input."
+            nameBox="Name Box"
+            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">
         </ng-container>
         <div class="k-spreadsheet-header">
             <kendo-menu kendoSpreadsheetMenu (select)="onMenuItemSelect($event)">
@@ -636,14 +643,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             <div #nameBox kendoSpreadsheetNameBox [spreadsheetWidget]="spreadsheetWidget"></div>
             <div class="k-spreadsheet-formula-bar">
                 <span class="k-separator k-separator-vertical"></span>
-                <button kendoButton
-                    icon="formula-fx"
-                    [svgIcon]="formulaFxIcon"
-                    [fillMode]="'flat'">
-                </button>
+                <kendo-icon-wrapper
+                    name="formula-fx"
+                    [svgIcon]="formulaFxIcon">
+                </kendo-icon-wrapper>
                 <span class="k-separator k-separator-vertical"></span>
                 <div #formulaBar kendoSpreadsheetFormulaInput class="k-textbox k-input k-input-md k-input-flat k-rounded-md"></div>
-                <div class="k-widget k-tooltip" style="position: absolute; display: none;">A1</div>
             </div>
         </div>
         <div class="k-spreadsheet-view">
@@ -664,7 +669,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
     `,
                 }]
-        }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i1.IntlService }, { type: i0.ElementRef }, { type: i2.LocalizationService }, { type: i3.SpreadsheetService }, { type: i4.SpreadsheetToolsService }, { type: i0.Renderer2 }]; }, propDecorators: { formulaBarInputRef: [{
+        }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i1.IntlService }, { type: i0.ElementRef }, { type: i2.LocalizationService }, { type: i3.SpreadsheetService }, { type: i4.SpreadsheetToolsService }]; }, propDecorators: { formulaBarInputRef: [{
                 type: ViewChild,
                 args: ['formulaBar', { read: FormulaInputDirective }]
             }], formulaCellInputRef: [{
@@ -704,8 +709,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 type: Input
             }], rows: [{
                 type: Input
-            }], names: [{
-                type: Input
             }], images: [{
                 type: Input
             }], excel: [{

package/esm2020/spreadsheet.module.mjs

@@ -50,7 +50,6 @@ import { DialogContentComponent } from './tools/shared/dialog-content.component'
 import { MenuModule } from '@progress/kendo-angular-menu';
 import { MainMenuDirective } from './common/main-menu.directive';
 import { ActionDialogComponent } from './sheets-bar/action-dialog.component';
-import { RemoveDirective } from './sheets-bar/remove.directive';
 import * as i0 from "@angular/core";
 const DIRECTIVES = [
     SpreadsheetComponent,
@@ -86,8 +85,7 @@ const DIRECTIVES = [
     FontSizeDropDownListComponent,
     DialogContentComponent,
     MainMenuDirective,
-    ActionDialogComponent,
-    RemoveDirective
+    ActionDialogComponent
 ];
 const EXPORTS = [
     SpreadsheetComponent,
@@ -154,8 +152,7 @@ SpreadsheetModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", versi
         FontSizeDropDownListComponent,
         DialogContentComponent,
         MainMenuDirective,
-        ActionDialogComponent,
-        RemoveDirective], imports: [CommonModule,
+        ActionDialogComponent], imports: [CommonModule,
         ButtonsModule,
         ComboBoxModule,
         DropDownListModule,

package/esm2020/tools/font-family/font-family-dropdownlist.component.mjs

@@ -30,7 +30,7 @@ FontFamilyDropDownListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
                 </span>
             </ng-template>
         </kendo-dropdownlist>
-    `, isInline: true, components: [{ type: i1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "iconClass", "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"] }], directives: [{ type: i1.ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+    `, isInline: true, components: [{ type: i1.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"] }], directives: [{ type: i1.ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FontFamilyDropDownListComponent, decorators: [{
             type: Component,
             args: [{

package/esm2020/tools/font-size/font-size-dropdownlist.component.mjs

@@ -22,7 +22,7 @@ FontSizeDropDownListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "1
             (valueChange)="onValueChange($event)"
             [leftRightArrowsNavigation]="false"
             [fillMode]="fillMode"></kendo-dropdownlist>
-    `, isInline: true, components: [{ type: i1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "iconClass", "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"] }] });
+    `, isInline: true, components: [{ type: i1.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: "13.3.12", ngImport: i0, type: FontSizeDropDownListComponent, decorators: [{
             type: Component,
             args: [{

package/esm2020/tools/index.mjs

@@ -11,7 +11,7 @@ export { SpreadsheetUndoDirective } from './history/undo-tool';
 export { SpreadsheetBoldDirective } from './typographical-emphasis/bold-tool.directive';
 export { SpreadsheetItalicDirective } from './typographical-emphasis/italic-tool.directive';
 export { SpreadsheetUnderlineDirective } from './typographical-emphasis/underline-tool.directive';
-export { SpreadsheetTextAlignDirective as SpreadsheetTextAlignComponent } from './align-tool.directive';
+export { SpreadsheetTextAlignDirective } from './align-tool.directive';
 export { SpreadsheetFormatDirective } from './format-tool.directive';
 export { SpreadsheetGridLinesDirective } from './gridlines-tool.directive';
 export { SpreadsheetLoadFileComponent } from './load-file.component';

package/esm2020/tools/load-file.component.mjs

@@ -14,6 +14,9 @@ import * as i2 from "../common/spreadsheet.service";
 import * as i3 from "@progress/kendo-angular-buttons";
 import * as i4 from "@progress/kendo-angular-icons";
 import * as i5 from "@progress/kendo-angular-toolbar";
+/**
+ * @hidden
+ */
 export class SpreadsheetLoadFileComponent extends ToolBarToolComponent {
     constructor(localization, spreadsheetService, toolbar) {
         super();

package/esm2020/tools/shared/spreadsheet-command-base.mjs

@@ -27,8 +27,6 @@ export class SpreadsheetCommandBaseDirective {
         this.spreadsheetService = spreadsheetService;
         this.toolsService = toolsService;
         this.subs = new Subscription();
-        // this.toolsService.zone.runOutsideAngular(() => {
-        // setTimeout(() => {
         const text = this.localization.get(this.command);
         if (text) {
             this.button.showText = 'overflow';
@@ -46,11 +44,6 @@ export class SpreadsheetCommandBaseDirective {
         this.subs.add(this.toolsService.stateChange.subscribe(state => {
             this.toolsService.ngZone.onStable.pipe(take(1)).subscribe(() => this.button.selected = state[command]);
         }));
-        // this.toolsService.zone.run(() => {
-        //     this.toolsService.needsCheck.next();
-        // });
-        // });
-        //});
     }
     ngOnInit() {
         this.subs.add(this.button.click.subscribe((this.clickHandler.bind(this))));