@progress/kendo-angular-spreadsheet 25.0.0-develop.3 → 25.0.0-develop.5

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

@@ -48,8 +48,8 @@ const packageMetadata = {
     productName: 'Kendo UI for Angular',
     productCode: 'KENDOUIANGULAR',
     productCodes: ['KENDOUIANGULAR'],
-    publishDate: 1783692575,
-    version: '25.0.0-develop.3',
+    publishDate: 1784008805,
+    version: '25.0.0-develop.5',
     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',
 };
 
@@ -886,23 +886,26 @@ class SheetsBarComponent {
     localization;
     dialogService;
     ngZone;
+    popupService;
     hostClasses = true;
     trackByItemKey = (index, item) => this.hiding ? item : index;
     sheets;
     sheetDescriptors;
     subs = new Subscription();
     hiding = false;
-    constructor(spreadsheetService, element, renderer, localization, dialogService, ngZone) {
+    constructor(spreadsheetService, element, renderer, localization, dialogService, ngZone, popupService) {
         this.spreadsheetService = spreadsheetService;
         this.element = element;
         this.renderer = renderer;
         this.localization = localization;
         this.dialogService = dialogService;
         this.ngZone = ngZone;
+        this.popupService = popupService;
         this.subs.add(spreadsheetService.onSheetsBarFocus.subscribe(() => ngZone.run(() => this.tabstrip.selectTab(this.sheets.findIndex(sh => sh.text === spreadsheetService.currentActiveSheet)))));
     }
     addButton;
     menuButton;
+    sheetsMenuPopupTemplate;
     tabstrip;
     actionDdbs;
     actionDdbRefs;
@@ -915,6 +918,8 @@ class SheetsBarComponent {
     selected = false;
     sheetsMenuList = [];
     openedDdb = null;
+    menuPopupRef = null;
+    documentClickSub;
     tabListSub;
     hiddenStateIcons = {
         hidden: 'eye-slash',
@@ -950,6 +955,7 @@ class SheetsBarComponent {
         }
     }
     ngOnDestroy() {
+        this.closeSheetsMenuPopup();
         if (this.tabListSub) {
             this.tabListSub();
         }
@@ -967,11 +973,53 @@ class SheetsBarComponent {
         }
     }
     onOpen(ddb) {
+        this.closeSheetsMenuPopup();
         if (isPresent(this.openedDdb) && this.openedDdb !== ddb) {
             this.openedDdb.toggle(false);
         }
         this.openedDdb = ddb;
     }
+    toggleSheetsMenuPopup() {
+        if (this.menuPopupRef) {
+            this.closeSheetsMenuPopup();
+        }
+        else {
+            this.openSheetsMenuPopup();
+        }
+    }
+    closeSheetsMenuPopup() {
+        if (this.menuPopupRef) {
+            this.menuPopupRef.close();
+            this.menuPopupRef = null;
+        }
+        if (this.documentClickSub) {
+            this.documentClickSub();
+            this.documentClickSub = null;
+        }
+    }
+    openSheetsMenuPopup() {
+        if (isPresent(this.openedDdb)) {
+            this.openedDdb.toggle(false);
+            this.openedDdb = null;
+        }
+        this.menuPopupRef = this.popupService.open({
+            anchor: this.menuButton,
+            content: this.sheetsMenuPopupTemplate,
+            popupClass: 'k-menu-popup',
+            anchorAlign: { horizontal: 'left', vertical: 'bottom' },
+            popupAlign: { horizontal: 'left', vertical: 'top' }
+        });
+        this.ngZone.runOutsideAngular(() => {
+            this.documentClickSub = this.renderer.listen('document', 'click', (e) => {
+                const target = e.target;
+                const insideButton = this.menuButton?.nativeElement?.contains(target);
+                const insidePopup = this.menuPopupRef?.popup?.location?.nativeElement?.contains(target);
+                if (!insideButton && !insidePopup) {
+                    this.ngZone.run(() => this.closeSheetsMenuPopup());
+                }
+            });
+        });
+    }
     onClose() {
         this.openedDdb = null;
         const activeTabIdx = this.sheets.findIndex(sheet => sheet.active);
@@ -1142,10 +1190,11 @@ class SheetsBarComponent {
         });
         this.ngZone.onStable.pipe(take(1)).subscribe(() => { this.spreadsheetService.spreadsheet.view.clipboard.focus(); this.hiding = false; });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SheetsBarComponent, deps: [{ token: SpreadsheetService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: SpreadsheetLocalizationService }, { token: i1$2.DialogService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", 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: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SheetsBarComponent, deps: [{ token: SpreadsheetService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: SpreadsheetLocalizationService }, { token: i1$2.DialogService }, { token: i0.NgZone }, { token: i1$1.PopupService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", 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: "sheetsMenuPopupTemplate", first: true, predicate: ["sheetsMenuPopupTemplate"], 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')"
+          [attr.aria-label]="messageFor('addSheet')"
           type="button"
           fillMode="flat"
           size="small"
@@ -1155,22 +1204,35 @@ class SheetsBarComponent {
           [kendoEventsOutsideAngular]="{click: onAddClick}"
           [attr.aria-controls]="tablistId">
         </button>
-        <kendo-dropdownbutton #menuButton
+        <button kendoButton #menuButton
+          type="button"
           fillMode="flat"
-          buttonClass="k-spreadsheet-sheets-menu"
-          icon="menu"
           size="small"
           [svgIcon]="menuIcon"
-          [data]="sheetsMenuList"
-          (itemClick)="onMenuItemClick($event)"
-          (open)="onOpen(menuButton)"
-          [buttonAttributes]="{title: messageFor('sheetsMenu')}"
-          [attr.aria-controls]="tablistId">
-        </kendo-dropdownbutton>
+          icon="menu"
+          class="k-spreadsheet-sheets-menu"
+          [attr.title]="messageFor('sheetsMenu')"
+          [attr.aria-label]="messageFor('sheetsMenu')"
+          [attr.aria-controls]="tablistId"
+          (click)="toggleSheetsMenuPopup()">
+        </button>
+        <ng-template #sheetsMenuPopupTemplate>
+          <ul class="k-menu-group" role="list">
+            @for (item of sheetsMenuList; track item.text) {
+              <li class="k-item k-menu-item" role="listitem"
+                (click)="onMenuItemClick(item); closeSheetsMenuPopup()">
+                <span class="k-link k-menu-link">
+                  <kendo-icon-wrapper [svgIcon]="item.svgIcon" [name]="item.icon"></kendo-icon-wrapper>
+                  <span class="k-menu-link-text">{{ item.text }}</span>
+                </span>
+              </li>
+            }
+          </ul>
+        </ng-template>
         <kendo-tabstrip #tabstrip
           [tabPosition]="'bottom'"
           [showContentArea]="false"
-          [scrollable]="{ scrollButtonsPosition: 'end', mouseScroll: false }"
+          [scrollable]="{ scrollButtonsPosition: 'end', mouseScroll: false, scrollButtons: 'visible' }"
           class="k-spreadsheet-sheets"
           (tabSelect)="onTabSelect($event)">
           @for (sheet of sheets; track trackByItemKey($index, sheet)) {
@@ -1202,7 +1264,7 @@ class SheetsBarComponent {
             }
           }
         </kendo-tabstrip>
-        `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], 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", "size", "closeIcon", "closeIconClass", "closeSVGIcon", "showContentArea"], outputs: ["tabSelect", "tabClose", "tabScroll"], exportAs: ["kendoTabStrip"] }, { 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]" }] });
+        `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], 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", "size", "closeIcon", "closeIconClass", "closeSVGIcon", "showContentArea"], outputs: ["tabSelect", "tabClose", "tabScroll"], exportAs: ["kendoTabStrip"] }, { 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]" }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SheetsBarComponent, decorators: [{
             type: Component,
@@ -1211,6 +1273,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                     template: `
         <button kendoButton #addButton
           [title]="messageFor('addSheet')"
+          [attr.aria-label]="messageFor('addSheet')"
           type="button"
           fillMode="flat"
           size="small"
@@ -1220,22 +1283,35 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
           [kendoEventsOutsideAngular]="{click: onAddClick}"
           [attr.aria-controls]="tablistId">
         </button>
-        <kendo-dropdownbutton #menuButton
+        <button kendoButton #menuButton
+          type="button"
           fillMode="flat"
-          buttonClass="k-spreadsheet-sheets-menu"
-          icon="menu"
           size="small"
           [svgIcon]="menuIcon"
-          [data]="sheetsMenuList"
-          (itemClick)="onMenuItemClick($event)"
-          (open)="onOpen(menuButton)"
-          [buttonAttributes]="{title: messageFor('sheetsMenu')}"
-          [attr.aria-controls]="tablistId">
-        </kendo-dropdownbutton>
+          icon="menu"
+          class="k-spreadsheet-sheets-menu"
+          [attr.title]="messageFor('sheetsMenu')"
+          [attr.aria-label]="messageFor('sheetsMenu')"
+          [attr.aria-controls]="tablistId"
+          (click)="toggleSheetsMenuPopup()">
+        </button>
+        <ng-template #sheetsMenuPopupTemplate>
+          <ul class="k-menu-group" role="list">
+            @for (item of sheetsMenuList; track item.text) {
+              <li class="k-item k-menu-item" role="listitem"
+                (click)="onMenuItemClick(item); closeSheetsMenuPopup()">
+                <span class="k-link k-menu-link">
+                  <kendo-icon-wrapper [svgIcon]="item.svgIcon" [name]="item.icon"></kendo-icon-wrapper>
+                  <span class="k-menu-link-text">{{ item.text }}</span>
+                </span>
+              </li>
+            }
+          </ul>
+        </ng-template>
         <kendo-tabstrip #tabstrip
           [tabPosition]="'bottom'"
           [showContentArea]="false"
-          [scrollable]="{ scrollButtonsPosition: 'end', mouseScroll: false }"
+          [scrollable]="{ scrollButtonsPosition: 'end', mouseScroll: false, scrollButtons: 'visible' }"
           class="k-spreadsheet-sheets"
           (tabSelect)="onTabSelect($event)">
           @for (sheet of sheets; track trackByItemKey($index, sheet)) {
@@ -1269,9 +1345,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
         </kendo-tabstrip>
         `,
                     standalone: true,
-                    imports: [ButtonComponent, EventsOutsideAngularDirective, DropDownButtonComponent, TabStripComponent, TabStripTabComponent, TabTemplateDirective]
+                    imports: [ButtonComponent, EventsOutsideAngularDirective, DropDownButtonComponent, TabStripComponent, TabStripTabComponent, TabTemplateDirective, IconWrapperComponent]
                 }]
-        }], ctorParameters: () => [{ type: SpreadsheetService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: SpreadsheetLocalizationService }, { type: i1$2.DialogService }, { type: i0.NgZone }], propDecorators: { hostClasses: [{
+        }], ctorParameters: () => [{ type: SpreadsheetService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: SpreadsheetLocalizationService }, { type: i1$2.DialogService }, { type: i0.NgZone }, { type: i1$1.PopupService }], propDecorators: { hostClasses: [{
                 type: HostBinding,
                 args: ['class.k-spreadsheet-sheets-bar']
             }], sheets: [{
@@ -1284,6 +1360,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
             }], menuButton: [{
                 type: ViewChild,
                 args: ['menuButton']
+            }], sheetsMenuPopupTemplate: [{
+                type: ViewChild,
+                args: ['sheetsMenuPopupTemplate']
             }], tabstrip: [{
                 type: ViewChild,
                 args: ['tabstrip']
@@ -2684,7 +2763,7 @@ class SpreadsheetBackColorComponent extends SpreadsheetDropDownToolBase {
               fillMode="flat"
               [icon]="icon"
               [preview]="true"
-            [svgIcon]="svgIcon"></kendo-colorpicker>
+              [svgIcon]="svgIcon"></kendo-colorpicker>
           </div>
         </ng-template>
         <ng-template #popupTemplate>
@@ -2739,7 +2818,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
               fillMode="flat"
               [icon]="icon"
               [preview]="true"
-            [svgIcon]="svgIcon"></kendo-colorpicker>
+              [svgIcon]="svgIcon"></kendo-colorpicker>
           </div>
         </ng-template>
         <ng-template #popupTemplate>
@@ -4196,8 +4275,12 @@ class MessagesDirective extends ComponentMessages {
      * The content of the dialog that warns about sorting multiple range selection.
      */
     cantSortMultipleSelection;
+    /**
+     * The label for the formula bar button.
+     */
+    formulaButton;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MessagesDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: MessagesDirective, isStandalone: true, selector: "[kendoSpreadsheetMessages]", inputs: { home: "home", file: "file", insert: "insert", formatTab: "formatTab", dataTab: "dataTab", saveFile: "saveFile", pdfExport: "pdfExport", loadFile: "loadFile", bold: "bold", dataValidation: "dataValidation", filter: "filter", validationCellRange: "validationCellRange", validationCriteria: "validationCriteria", validationComparer: "validationComparer", validationMinValue: "validationMinValue", validationMaxValue: "validationMaxValue", validationStartValue: "validationStartValue", validationEndValue: "validationEndValue", validationValue: "validationValue", validationShowListButtonCheckbox: "validationShowListButtonCheckbox", validationShowDateButtonCheckbox: "validationShowDateButtonCheckbox", validationIgnoreBlankCheckbox: "validationIgnoreBlankCheckbox", validationOnInvalidData: "validationOnInvalidData", validationRejectInput: "validationRejectInput", validationShowWarning: "validationShowWarning", validationShowHint: "validationShowHint", anyValueValidationCriteria: "anyValueValidationCriteria", numberValidationCriteria: "numberValidationCriteria", textValidationCriteria: "textValidationCriteria", dateValidationCriteria: "dateValidationCriteria", customFormulaValidationCriteria: "customFormulaValidationCriteria", listValidationCriteria: "listValidationCriteria", greaterThanValidationComparer: "greaterThanValidationComparer", lessThanValidationComparer: "lessThanValidationComparer", betweenValidationComparer: "betweenValidationComparer", notBetweenValidationComparer: "notBetweenValidationComparer", equalToValidationComparer: "equalToValidationComparer", notEqualToValidationComparer: "notEqualToValidationComparer", greaterThanOrEqualToValidationComparer: "greaterThanOrEqualToValidationComparer", lessThanOrEqualToValidationComparer: "lessThanOrEqualToValidationComparer", validationHintMessage: "validationHintMessage", validationHintTitle: "validationHintTitle", 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", dialogRemove: "dialogRemove", 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", rangeDisabled: "rangeDisabled", 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", cantSortMixedCells: "cantSortMixedCells", filterApply: "filterApply", filterClear: "filterClear", filterMenuAll: "filterMenuAll", blankValues: "blankValues", filterContainsOperator: "filterContainsOperator", filterNotContainsOperator: "filterNotContainsOperator", filterStartsWithOperator: "filterStartsWithOperator", filterEndsWithOperator: "filterEndsWithOperator", filterMatchesOperator: "filterMatchesOperator", filterNotMatchesOperator: "filterNotMatchesOperator", filterDateEqOperator: "filterDateEqOperator", filterDateNotEqOperator: "filterDateNotEqOperator", filterBeforeOperator: "filterBeforeOperator", filterAfterOperator: "filterAfterOperator", filterEqOperator: "filterEqOperator", filterNotEqOperator: "filterNotEqOperator", filterGteOperator: "filterGteOperator", filterGtOperator: "filterGtOperator", filterLteOperator: "filterLteOperator", filterLtOperator: "filterLtOperator", filterNoneOperator: "filterNoneOperator", filterMenuConditionItem: "filterMenuConditionItem", filterMenuValueItem: "filterMenuValueItem", sort: "sort", sortAsc: "sortAsc", sortDesc: "sortDesc", unsort: "unsort", cantSortNullRef: "cantSortNullRef", cantSortMultipleSelection: "cantSortMultipleSelection" }, usesInheritance: true, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: MessagesDirective, isStandalone: true, selector: "[kendoSpreadsheetMessages]", inputs: { home: "home", file: "file", insert: "insert", formatTab: "formatTab", dataTab: "dataTab", saveFile: "saveFile", pdfExport: "pdfExport", loadFile: "loadFile", bold: "bold", dataValidation: "dataValidation", filter: "filter", validationCellRange: "validationCellRange", validationCriteria: "validationCriteria", validationComparer: "validationComparer", validationMinValue: "validationMinValue", validationMaxValue: "validationMaxValue", validationStartValue: "validationStartValue", validationEndValue: "validationEndValue", validationValue: "validationValue", validationShowListButtonCheckbox: "validationShowListButtonCheckbox", validationShowDateButtonCheckbox: "validationShowDateButtonCheckbox", validationIgnoreBlankCheckbox: "validationIgnoreBlankCheckbox", validationOnInvalidData: "validationOnInvalidData", validationRejectInput: "validationRejectInput", validationShowWarning: "validationShowWarning", validationShowHint: "validationShowHint", anyValueValidationCriteria: "anyValueValidationCriteria", numberValidationCriteria: "numberValidationCriteria", textValidationCriteria: "textValidationCriteria", dateValidationCriteria: "dateValidationCriteria", customFormulaValidationCriteria: "customFormulaValidationCriteria", listValidationCriteria: "listValidationCriteria", greaterThanValidationComparer: "greaterThanValidationComparer", lessThanValidationComparer: "lessThanValidationComparer", betweenValidationComparer: "betweenValidationComparer", notBetweenValidationComparer: "notBetweenValidationComparer", equalToValidationComparer: "equalToValidationComparer", notEqualToValidationComparer: "notEqualToValidationComparer", greaterThanOrEqualToValidationComparer: "greaterThanOrEqualToValidationComparer", lessThanOrEqualToValidationComparer: "lessThanOrEqualToValidationComparer", validationHintMessage: "validationHintMessage", validationHintTitle: "validationHintTitle", 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", dialogRemove: "dialogRemove", 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", rangeDisabled: "rangeDisabled", 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", cantSortMixedCells: "cantSortMixedCells", filterApply: "filterApply", filterClear: "filterClear", filterMenuAll: "filterMenuAll", blankValues: "blankValues", filterContainsOperator: "filterContainsOperator", filterNotContainsOperator: "filterNotContainsOperator", filterStartsWithOperator: "filterStartsWithOperator", filterEndsWithOperator: "filterEndsWithOperator", filterMatchesOperator: "filterMatchesOperator", filterNotMatchesOperator: "filterNotMatchesOperator", filterDateEqOperator: "filterDateEqOperator", filterDateNotEqOperator: "filterDateNotEqOperator", filterBeforeOperator: "filterBeforeOperator", filterAfterOperator: "filterAfterOperator", filterEqOperator: "filterEqOperator", filterNotEqOperator: "filterNotEqOperator", filterGteOperator: "filterGteOperator", filterGtOperator: "filterGtOperator", filterLteOperator: "filterLteOperator", filterLtOperator: "filterLtOperator", filterNoneOperator: "filterNoneOperator", filterMenuConditionItem: "filterMenuConditionItem", filterMenuValueItem: "filterMenuValueItem", sort: "sort", sortAsc: "sortAsc", sortDesc: "sortDesc", unsort: "unsort", cantSortNullRef: "cantSortNullRef", cantSortMultipleSelection: "cantSortMultipleSelection", formulaButton: "formulaButton" }, usesInheritance: true, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MessagesDirective, decorators: [{
             type: Directive,
@@ -4493,6 +4576,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                 type: Input
             }], cantSortMultipleSelection: [{
                 type: Input
+            }], formulaButton: [{
+                type: Input
             }] } });
 
 /**
@@ -7260,7 +7345,9 @@ class SpreadsheetComponent {
           i18n-sortDesc="kendo.spreadsheet.sortDesc|The text of the **Sort range Z to A** option."
           sortDesc="Sort range Z to A"
           i18n-unsort="kendo.spreadsheet.unsort|The text of the **Unsort** option."
-          unsort="Unsort">
+          unsort="Unsort"
+          i18n-formulaButton="kendo.spreadsheet.formulaButton|The label for the formula bar button."
+          formulaButton="Formula">
         </ng-container>
         <div class="k-spreadsheet-header">
           <kendo-menu kendoSpreadsheetMenu (select)="onMenuItemSelect($event)">
@@ -7273,7 +7360,8 @@ class SpreadsheetComponent {
               [attr.aria-label]="messageFor('file')"
               fillMode="flat"
               class="k-spreadsheet-toolbar"
-              [overflow]="overflow">
+              [overflow]="overflow"
+              [resizable]="true">
               <kendo-spreadsheet-load-file-tool></kendo-spreadsheet-load-file-tool>
               <kendo-toolbar-button kendoSpreadsheetSaveFile></kendo-toolbar-button>
               <kendo-toolbar-button kendoSpreadsheetPDFExport></kendo-toolbar-button>
@@ -7284,12 +7372,14 @@ class SpreadsheetComponent {
               [attr.aria-label]="messageFor('home')"
               class="k-spreadsheet-toolbar"
               fillMode="flat"
-              [overflow]="overflow">
+              [overflow]="overflow"
+              [resizable]="true">
               <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-separator></kendo-toolbar-separator>
               <kendo-toolbar-buttongroup fillMode="flat">
                 <kendo-toolbar-button kendoSpreadsheetIncreaseFontSize></kendo-toolbar-button>
                 <kendo-toolbar-button kendoSpreadsheetDecreaseFontSize></kendo-toolbar-button>
@@ -7306,9 +7396,8 @@ class SpreadsheetComponent {
               <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-button kendoSpreadsheetTextWrap></kendo-toolbar-button>
             </kendo-toolbar>
           }
           @if (selectedMenuItem?.active && selectedMenuItem.id === 'insert') {
@@ -7316,7 +7405,8 @@ class SpreadsheetComponent {
               [attr.aria-label]="messageFor('insert')"
               fillMode="flat"
               class="k-spreadsheet-toolbar"
-              [overflow]="overflow">
+              [overflow]="overflow"
+              [resizable]="true">
               <kendo-toolbar-button kendoSpreadsheetInsertLink></kendo-toolbar-button>
               <kendo-toolbar-separator></kendo-toolbar-separator>
               <kendo-toolbar-button kendoSpreadsheetAddColumnLeftButton></kendo-toolbar-button>
@@ -7333,7 +7423,9 @@ class SpreadsheetComponent {
               [attr.aria-label]="messageFor('formatTab')"
               fillMode="flat"
               class="k-spreadsheet-toolbar"
-              [overflow]="overflow">
+              [overflow]="overflow"
+              [resizable]="true">
+              <kendo-toolbar-dropdownbutton kendoSpreadsheetFormat></kendo-toolbar-dropdownbutton>
               <kendo-toolbar-button kendoSpreadsheetDecreaseDecimal></kendo-toolbar-button>
               <kendo-toolbar-button kendoSpreadsheetIncreaseDecimal></kendo-toolbar-button>
             </kendo-toolbar>
@@ -7343,7 +7435,8 @@ class SpreadsheetComponent {
               [attr.aria-label]="messageFor('view')"
               fillMode="flat"
               class="k-spreadsheet-toolbar"
-              [overflow]="overflow">
+              [overflow]="overflow"
+              [resizable]="true">
               <kendo-toolbar-dropdownbutton kendoSpreadsheetMerge></kendo-toolbar-dropdownbutton>
               <kendo-toolbar-separator></kendo-toolbar-separator>
               <kendo-toolbar-button kendoSpreadsheetGridLines></kendo-toolbar-button>
@@ -7354,7 +7447,8 @@ class SpreadsheetComponent {
               [attr.aria-label]="messageFor('dataTab')"
               fillMode="flat"
               class="k-spreadsheet-toolbar"
-              [overflow]="overflow">
+              [overflow]="overflow"
+              [resizable]="true">
               <kendo-toolbar-button kendoSpreadsheetDataValidation></kendo-toolbar-button>
               <kendo-toolbar-separator></kendo-toolbar-separator>
               <kendo-toolbar-button kendoSpreadsheetFilter></kendo-toolbar-button>
@@ -7367,16 +7461,19 @@ class SpreadsheetComponent {
           <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>
+            <button kendoButton
+              icon="formula-fx"
+              [svgIcon]="formulaFxIcon"
+              fillMode="flat"
+              [attr.aria-label]="messageFor('formulaButton')">
+            </button>
             <span class="k-separator k-separator-vertical"></span>
             <div
               #formulaBar
               kendoSpreadsheetFormulaInput
               [formulaListMaxHeight]="formulaListMaxHeight"
-            class="k-textbox k-input k-input-flat"></div>
+              class="k-textbox k-input k-input-flat">
+            </div>
           </div>
         </div>
         <div class="k-spreadsheet-view">
@@ -7484,7 +7581,7 @@ class SpreadsheetComponent {
         @if (showLicenseWatermark) {
           <div kendoWatermarkOverlay [licenseMessage]="licenseMessage"></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: "component", type: MenuItemComponent, selector: "kendo-menu-item", inputs: ["text", "url", "disabled", "cssClass", "cssStyle", "icon", "svgIcon", "data", "separator"] }, { kind: "component", type: ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "fillMode", "tabindex", "size", "tabIndex", "showIcon", "showText"], 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", "rounded", "themeColor", "icon", "iconClass", "svgIcon", "imageUrl"], outputs: ["click", "pointerdown", "selectedChange"], exportAs: ["kendoToolBarButton"] }, { kind: "directive", type: SpreadsheetPDFExportDirective, selector: "[kendoSpreadsheetPDFExport]" }, { 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], kendo-watermark-overlay", inputs: ["licenseMessage"] }, { kind: "directive", type: SpreadsheetDataValidationDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDataValidation]" }, { kind: "directive", type: SpreadsheetFilterDirective, selector: "kendo-toolbar-button[kendoSpreadsheetFilter]" }, { kind: "component", type: SpreadsheetFilterMenuItemComponent, selector: "kendo-spreadsheet-filtermenu-item", inputs: ["text", "innerMenuItems", "icon", "expanderClass", "expandable", "svgIcon", "expanded"], outputs: ["itemClick", "expand", "collapse"] }, { kind: "directive", type: FilterMenuItemContentTemplateDirective, selector: "[kendoSpreadsheetFilterMenuItemContentTemplate]" }, { kind: "component", type: i8.TreeViewComponent, selector: "kendo-treeview", inputs: ["filterInputPlaceholder", "expandDisabledNodes", "animate", "nodeTemplate", "loadMoreButtonTemplate", "trackBy", "nodes", "textField", "hasChildren", "isChecked", "isDisabled", "hasCheckbox", "isExpanded", "isSelected", "isVisible", "navigable", "children", "loadOnDemand", "filterable", "filter", "size", "disableParentNodesOnly"], outputs: ["childrenLoaded", "blur", "focus", "expand", "collapse", "nodeDragStart", "nodeDrag", "filterStateChange", "nodeDrop", "nodeDragEnd", "addItem", "removeItem", "checkedChange", "selectionChange", "filterChange", "nodeClick", "nodeDblClick"], exportAs: ["kendoTreeView"] }, { kind: "directive", type: i8.CheckDirective, selector: "[kendoTreeViewCheckable]", inputs: ["isChecked", "checkBy", "checkedKeys", "kendoTreeViewCheckable"], outputs: ["checkedKeysChange"] }, { kind: "directive", type: i8.ExpandDirective, selector: "[kendoTreeViewExpandable]", inputs: ["isExpanded", "expandBy", "expandOnFilter", "expandedKeys"], outputs: ["expandedKeysChange"] }, { kind: "directive", type: i8.HierarchyBindingDirective, selector: "[kendoTreeViewHierarchyBinding]", inputs: ["childrenField", "nodes", "isVisible", "loadOnDemand"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "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: "ngmodule", type: InputsModule }, { kind: "component", type: i9.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"] }, { kind: "component", type: i9.NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoNumericTextBox"] }, { kind: "component", type: DatePickerComponent, selector: "kendo-datepicker", inputs: ["focusableId", "cellTemplate", "clearButton", "inputAttributes", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "headerTemplate", "footerTemplate", "footer", "navigationItemTemplate", "weekDaysFormat", "showOtherMonthDays", "activeView", "bottomView", "topView", "calendarType", "animateCalendarNavigation", "disabled", "readonly", "readOnlyInput", "popupSettings", "navigation", "min", "max", "incompleteDateValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "enableMouseWheel", "allowCaretMode", "autoFill", "focusedDate", "value", "format", "twoDigitYearMax", "formatPlaceholder", "placeholder", "tabindex", "tabIndex", "disabledDates", "adaptiveTitle", "adaptiveSubtitle", "rangeValidation", "disabledDatesValidation", "weekNumber", "size", "rounded", "fillMode", "adaptiveMode"], outputs: ["valueChange", "focus", "blur", "open", "close", "escape"], exportAs: ["kendo-datepicker"] }, { kind: "directive", type: SpreadsheetSortDirective, selector: "[kendoSpreadsheetSort]" }] });
+        `, 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: "component", type: MenuItemComponent, selector: "kendo-menu-item", inputs: ["text", "url", "disabled", "cssClass", "cssStyle", "icon", "svgIcon", "data", "separator"] }, { kind: "component", type: ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "fillMode", "tabindex", "size", "tabIndex", "showIcon", "showText"], 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", "rounded", "themeColor", "icon", "iconClass", "svgIcon", "imageUrl"], outputs: ["click", "pointerdown", "selectedChange"], exportAs: ["kendoToolBarButton"] }, { kind: "directive", type: SpreadsheetPDFExportDirective, selector: "[kendoSpreadsheetPDFExport]" }, { 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: "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], kendo-watermark-overlay", inputs: ["licenseMessage"] }, { kind: "directive", type: SpreadsheetDataValidationDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDataValidation]" }, { kind: "directive", type: SpreadsheetFilterDirective, selector: "kendo-toolbar-button[kendoSpreadsheetFilter]" }, { kind: "component", type: SpreadsheetFilterMenuItemComponent, selector: "kendo-spreadsheet-filtermenu-item", inputs: ["text", "innerMenuItems", "icon", "expanderClass", "expandable", "svgIcon", "expanded"], outputs: ["itemClick", "expand", "collapse"] }, { kind: "directive", type: FilterMenuItemContentTemplateDirective, selector: "[kendoSpreadsheetFilterMenuItemContentTemplate]" }, { kind: "component", type: i8.TreeViewComponent, selector: "kendo-treeview", inputs: ["filterInputPlaceholder", "expandDisabledNodes", "animate", "nodeTemplate", "loadMoreButtonTemplate", "trackBy", "nodes", "textField", "hasChildren", "isChecked", "isDisabled", "hasCheckbox", "isExpanded", "isSelected", "isVisible", "navigable", "children", "loadOnDemand", "filterable", "filter", "size", "disableParentNodesOnly"], outputs: ["childrenLoaded", "blur", "focus", "expand", "collapse", "nodeDragStart", "nodeDrag", "filterStateChange", "nodeDrop", "nodeDragEnd", "addItem", "removeItem", "checkedChange", "selectionChange", "filterChange", "nodeClick", "nodeDblClick"], exportAs: ["kendoTreeView"] }, { kind: "directive", type: i8.CheckDirective, selector: "[kendoTreeViewCheckable]", inputs: ["isChecked", "checkBy", "checkedKeys", "kendoTreeViewCheckable"], outputs: ["checkedKeysChange"] }, { kind: "directive", type: i8.ExpandDirective, selector: "[kendoTreeViewExpandable]", inputs: ["isExpanded", "expandBy", "expandOnFilter", "expandedKeys"], outputs: ["expandedKeysChange"] }, { kind: "directive", type: i8.HierarchyBindingDirective, selector: "[kendoTreeViewHierarchyBinding]", inputs: ["childrenField", "nodes", "isVisible", "loadOnDemand"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "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: "ngmodule", type: InputsModule }, { kind: "component", type: i9.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"] }, { kind: "component", type: i9.NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoNumericTextBox"] }, { kind: "component", type: DatePickerComponent, selector: "kendo-datepicker", inputs: ["focusableId", "cellTemplate", "clearButton", "inputAttributes", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "headerTemplate", "footerTemplate", "footer", "navigationItemTemplate", "weekDaysFormat", "showOtherMonthDays", "activeView", "bottomView", "topView", "calendarType", "animateCalendarNavigation", "disabled", "readonly", "readOnlyInput", "popupSettings", "navigation", "min", "max", "incompleteDateValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "enableMouseWheel", "allowCaretMode", "autoFill", "focusedDate", "value", "format", "twoDigitYearMax", "formatPlaceholder", "placeholder", "tabindex", "tabIndex", "disabledDates", "adaptiveTitle", "adaptiveSubtitle", "rangeValidation", "disabledDatesValidation", "weekNumber", "size", "rounded", "fillMode", "adaptiveMode"], outputs: ["valueChange", "focus", "blur", "open", "close", "escape"], exportAs: ["kendo-datepicker"] }, { kind: "directive", type: SpreadsheetSortDirective, selector: "[kendoSpreadsheetSort]" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SpreadsheetComponent, decorators: [{
             type: Component,
@@ -7800,7 +7897,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
           i18n-sortDesc="kendo.spreadsheet.sortDesc|The text of the **Sort range Z to A** option."
           sortDesc="Sort range Z to A"
           i18n-unsort="kendo.spreadsheet.unsort|The text of the **Unsort** option."
-          unsort="Unsort">
+          unsort="Unsort"
+          i18n-formulaButton="kendo.spreadsheet.formulaButton|The label for the formula bar button."
+          formulaButton="Formula">
         </ng-container>
         <div class="k-spreadsheet-header">
           <kendo-menu kendoSpreadsheetMenu (select)="onMenuItemSelect($event)">
@@ -7813,7 +7912,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
               [attr.aria-label]="messageFor('file')"
               fillMode="flat"
               class="k-spreadsheet-toolbar"
-              [overflow]="overflow">
+              [overflow]="overflow"
+              [resizable]="true">
               <kendo-spreadsheet-load-file-tool></kendo-spreadsheet-load-file-tool>
               <kendo-toolbar-button kendoSpreadsheetSaveFile></kendo-toolbar-button>
               <kendo-toolbar-button kendoSpreadsheetPDFExport></kendo-toolbar-button>
@@ -7824,12 +7924,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
               [attr.aria-label]="messageFor('home')"
               class="k-spreadsheet-toolbar"
               fillMode="flat"
-              [overflow]="overflow">
+              [overflow]="overflow"
+              [resizable]="true">
               <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-separator></kendo-toolbar-separator>
               <kendo-toolbar-buttongroup fillMode="flat">
                 <kendo-toolbar-button kendoSpreadsheetIncreaseFontSize></kendo-toolbar-button>
                 <kendo-toolbar-button kendoSpreadsheetDecreaseFontSize></kendo-toolbar-button>
@@ -7846,9 +7948,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
               <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-button kendoSpreadsheetTextWrap></kendo-toolbar-button>
             </kendo-toolbar>
           }
           @if (selectedMenuItem?.active && selectedMenuItem.id === 'insert') {
@@ -7856,7 +7957,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
               [attr.aria-label]="messageFor('insert')"
               fillMode="flat"
               class="k-spreadsheet-toolbar"
-              [overflow]="overflow">
+              [overflow]="overflow"
+              [resizable]="true">
               <kendo-toolbar-button kendoSpreadsheetInsertLink></kendo-toolbar-button>
               <kendo-toolbar-separator></kendo-toolbar-separator>
               <kendo-toolbar-button kendoSpreadsheetAddColumnLeftButton></kendo-toolbar-button>
@@ -7873,7 +7975,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
               [attr.aria-label]="messageFor('formatTab')"
               fillMode="flat"
               class="k-spreadsheet-toolbar"
-              [overflow]="overflow">
+              [overflow]="overflow"
+              [resizable]="true">
+              <kendo-toolbar-dropdownbutton kendoSpreadsheetFormat></kendo-toolbar-dropdownbutton>
               <kendo-toolbar-button kendoSpreadsheetDecreaseDecimal></kendo-toolbar-button>
               <kendo-toolbar-button kendoSpreadsheetIncreaseDecimal></kendo-toolbar-button>
             </kendo-toolbar>
@@ -7883,7 +7987,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
               [attr.aria-label]="messageFor('view')"
               fillMode="flat"
               class="k-spreadsheet-toolbar"
-              [overflow]="overflow">
+              [overflow]="overflow"
+              [resizable]="true">
               <kendo-toolbar-dropdownbutton kendoSpreadsheetMerge></kendo-toolbar-dropdownbutton>
               <kendo-toolbar-separator></kendo-toolbar-separator>
               <kendo-toolbar-button kendoSpreadsheetGridLines></kendo-toolbar-button>
@@ -7894,7 +7999,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
               [attr.aria-label]="messageFor('dataTab')"
               fillMode="flat"
               class="k-spreadsheet-toolbar"
-              [overflow]="overflow">
+              [overflow]="overflow"
+              [resizable]="true">
               <kendo-toolbar-button kendoSpreadsheetDataValidation></kendo-toolbar-button>
               <kendo-toolbar-separator></kendo-toolbar-separator>
               <kendo-toolbar-button kendoSpreadsheetFilter></kendo-toolbar-button>
@@ -7907,16 +8013,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
           <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>
+            <button kendoButton
+              icon="formula-fx"
+              [svgIcon]="formulaFxIcon"
+              fillMode="flat"
+              [attr.aria-label]="messageFor('formulaButton')">
+            </button>
             <span class="k-separator k-separator-vertical"></span>
             <div
               #formulaBar
               kendoSpreadsheetFormulaInput
               [formulaListMaxHeight]="formulaListMaxHeight"
-            class="k-textbox k-input k-input-flat"></div>
+              class="k-textbox k-input k-input-flat">
+            </div>
           </div>
         </div>
         <div class="k-spreadsheet-view">
@@ -8026,7 +8135,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
         }
         `,
                     standalone: true,
-                    imports: [LocalizedMessagesDirective, MenuComponent, MainMenuDirective, MenuItemComponent, ToolBarComponent, SpreadsheetLoadFileComponent, ToolBarButtonComponent, SpreadsheetPDFExportDirective, 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, SpreadsheetDataValidationDirective, SpreadsheetFilterDirective, SpreadsheetFilterMenuItemComponent, FilterMenuItemContentTemplateDirective, KENDO_TREEVIEW, ButtonComponent, DropDownListComponent, InputsModule, DatePickerComponent, SpreadsheetSortDirective]
+                    imports: [LocalizedMessagesDirective, MenuComponent, MainMenuDirective, MenuItemComponent, ToolBarComponent, SpreadsheetLoadFileComponent, ToolBarButtonComponent, SpreadsheetPDFExportDirective, 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, FormulaInputDirective, SheetsBarComponent, ContextMenuComponent, WatermarkOverlayComponent, SpreadsheetDataValidationDirective, SpreadsheetFilterDirective, SpreadsheetFilterMenuItemComponent, FilterMenuItemContentTemplateDirective, KENDO_TREEVIEW, ButtonComponent, DropDownListComponent, InputsModule, DatePickerComponent, SpreadsheetSortDirective]
                 }]
         }], ctorParameters: () => [{ type: i0.NgZone }, { type: i1$4.IntlService }, { type: i0.ElementRef }, { type: i1.LocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }, { type: ErrorHandlingService }, { type: i1$2.DialogService }, { type: i1$1.PopupService }, { type: i0.ViewContainerRef }, { type: i0.ChangeDetectorRef }], propDecorators: { formulaBarInputRef: [{
                 type: ViewChild,

package/index.d.ts

@@ -1436,8 +1436,12 @@ declare class MessagesDirective extends ComponentMessages {
      * The content of the dialog that warns about sorting multiple range selection.
      */
     cantSortMultipleSelection: string;
+    /**
+     * The label for the formula bar button.
+     */
+    formulaButton: string;
     static ɵfac: i0.ɵɵFactoryDeclaration<MessagesDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MessagesDirective, "[kendoSpreadsheetMessages]", never, { "home": { "alias": "home"; "required": false; }; "file": { "alias": "file"; "required": false; }; "insert": { "alias": "insert"; "required": false; }; "formatTab": { "alias": "formatTab"; "required": false; }; "dataTab": { "alias": "dataTab"; "required": false; }; "saveFile": { "alias": "saveFile"; "required": false; }; "pdfExport": { "alias": "pdfExport"; "required": false; }; "loadFile": { "alias": "loadFile"; "required": false; }; "bold": { "alias": "bold"; "required": false; }; "dataValidation": { "alias": "dataValidation"; "required": false; }; "filter": { "alias": "filter"; "required": false; }; "validationCellRange": { "alias": "validationCellRange"; "required": false; }; "validationCriteria": { "alias": "validationCriteria"; "required": false; }; "validationComparer": { "alias": "validationComparer"; "required": false; }; "validationMinValue": { "alias": "validationMinValue"; "required": false; }; "validationMaxValue": { "alias": "validationMaxValue"; "required": false; }; "validationStartValue": { "alias": "validationStartValue"; "required": false; }; "validationEndValue": { "alias": "validationEndValue"; "required": false; }; "validationValue": { "alias": "validationValue"; "required": false; }; "validationShowListButtonCheckbox": { "alias": "validationShowListButtonCheckbox"; "required": false; }; "validationShowDateButtonCheckbox": { "alias": "validationShowDateButtonCheckbox"; "required": false; }; "validationIgnoreBlankCheckbox": { "alias": "validationIgnoreBlankCheckbox"; "required": false; }; "validationOnInvalidData": { "alias": "validationOnInvalidData"; "required": false; }; "validationRejectInput": { "alias": "validationRejectInput"; "required": false; }; "validationShowWarning": { "alias": "validationShowWarning"; "required": false; }; "validationShowHint": { "alias": "validationShowHint"; "required": false; }; "anyValueValidationCriteria": { "alias": "anyValueValidationCriteria"; "required": false; }; "numberValidationCriteria": { "alias": "numberValidationCriteria"; "required": false; }; "textValidationCriteria": { "alias": "textValidationCriteria"; "required": false; }; "dateValidationCriteria": { "alias": "dateValidationCriteria"; "required": false; }; "customFormulaValidationCriteria": { "alias": "customFormulaValidationCriteria"; "required": false; }; "listValidationCriteria": { "alias": "listValidationCriteria"; "required": false; }; "greaterThanValidationComparer": { "alias": "greaterThanValidationComparer"; "required": false; }; "lessThanValidationComparer": { "alias": "lessThanValidationComparer"; "required": false; }; "betweenValidationComparer": { "alias": "betweenValidationComparer"; "required": false; }; "notBetweenValidationComparer": { "alias": "notBetweenValidationComparer"; "required": false; }; "equalToValidationComparer": { "alias": "equalToValidationComparer"; "required": false; }; "notEqualToValidationComparer": { "alias": "notEqualToValidationComparer"; "required": false; }; "greaterThanOrEqualToValidationComparer": { "alias": "greaterThanOrEqualToValidationComparer"; "required": false; }; "lessThanOrEqualToValidationComparer": { "alias": "lessThanOrEqualToValidationComparer"; "required": false; }; "validationHintMessage": { "alias": "validationHintMessage"; "required": false; }; "validationHintTitle": { "alias": "validationHintTitle"; "required": false; }; "italic": { "alias": "italic"; "required": false; }; "underline": { "alias": "underline"; "required": false; }; "format": { "alias": "format"; "required": false; }; "fontFamily": { "alias": "fontFamily"; "required": false; }; "fontSize": { "alias": "fontSize"; "required": false; }; "undo": { "alias": "undo"; "required": false; }; "redo": { "alias": "redo"; "required": false; }; "background": { "alias": "background"; "required": false; }; "color": { "alias": "color"; "required": false; }; "gridLines": { "alias": "gridLines"; "required": false; }; "addColumnLeft": { "alias": "addColumnLeft"; "required": false; }; "addColumnRight": { "alias": "addColumnRight"; "required": false; }; "addRowBelow": { "alias": "addRowBelow"; "required": false; }; "addRowAbove": { "alias": "addRowAbove"; "required": false; }; "deleteColumn": { "alias": "deleteColumn"; "required": false; }; "deleteRow": { "alias": "deleteRow"; "required": false; }; "wrap": { "alias": "wrap"; "required": false; }; "align": { "alias": "align"; "required": false; }; "alignHorizontal": { "alias": "alignHorizontal"; "required": false; }; "alignVertical": { "alias": "alignVertical"; "required": false; }; "alignLeft": { "alias": "alignLeft"; "required": false; }; "alignCenter": { "alias": "alignCenter"; "required": false; }; "alignRight": { "alias": "alignRight"; "required": false; }; "alignJustify": { "alias": "alignJustify"; "required": false; }; "alignTop": { "alias": "alignTop"; "required": false; }; "alignMiddle": { "alias": "alignMiddle"; "required": false; }; "alignBottom": { "alias": "alignBottom"; "required": false; }; "dialogApply": { "alias": "dialogApply"; "required": false; }; "dialogCancel": { "alias": "dialogCancel"; "required": false; }; "dialogDelete": { "alias": "dialogDelete"; "required": false; }; "dialogRename": { "alias": "dialogRename"; "required": false; }; "dialogInsert": { "alias": "dialogInsert"; "required": false; }; "dialogRemove": { "alias": "dialogRemove"; "required": false; }; "dialogRemoveLink": { "alias": "dialogRemoveLink"; "required": false; }; "delete": { "alias": "delete"; "required": false; }; "rename": { "alias": "rename"; "required": false; }; "nameBox": { "alias": "nameBox"; "required": false; }; "formulaInput": { "alias": "formulaInput"; "required": false; }; "addSheet": { "alias": "addSheet"; "required": false; }; "sheetsMenu": { "alias": "sheetsMenu"; "required": false; }; "view": { "alias": "view"; "required": false; }; "merge": { "alias": "merge"; "required": false; }; "mergeHorizontally": { "alias": "mergeHorizontally"; "required": false; }; "mergeVertically": { "alias": "mergeVertically"; "required": false; }; "mergeAll": { "alias": "mergeAll"; "required": false; }; "unmerge": { "alias": "unmerge"; "required": false; }; "insertLink": { "alias": "insertLink"; "required": false; }; "increaseDecimal": { "alias": "increaseDecimal"; "required": false; }; "decreaseDecimal": { "alias": "decreaseDecimal"; "required": false; }; "increaseFontSize": { "alias": "increaseFontSize"; "required": false; }; "decreaseFontSize": { "alias": "decreaseFontSize"; "required": false; }; "openUnsupported": { "alias": "openUnsupported"; "required": false; }; "modifyMerged": { "alias": "modifyMerged"; "required": false; }; "cannotModifyDisabled": { "alias": "cannotModifyDisabled"; "required": false; }; "rangeDisabled": { "alias": "rangeDisabled"; "required": false; }; "dialogOk": { "alias": "dialogOk"; "required": false; }; "dialogError": { "alias": "dialogError"; "required": false; }; "duplicateSheetName": { "alias": "duplicateSheetName"; "required": false; }; "copy": { "alias": "copy"; "required": false; }; "cut": { "alias": "cut"; "required": false; }; "paste": { "alias": "paste"; "required": false; }; "hideRow": { "alias": "hideRow"; "required": false; }; "unhideRow": { "alias": "unhideRow"; "required": false; }; "hideColumn": { "alias": "hideColumn"; "required": false; }; "unhideColumn": { "alias": "unhideColumn"; "required": false; }; "sheetDelete": { "alias": "sheetDelete"; "required": false; }; "sheetRename": { "alias": "sheetRename"; "required": false; }; "sheetHide": { "alias": "sheetHide"; "required": false; }; "sheetDuplicate": { "alias": "sheetDuplicate"; "required": false; }; "sheetMoveLeft": { "alias": "sheetMoveLeft"; "required": false; }; "sheetMoveRight": { "alias": "sheetMoveRight"; "required": false; }; "invalidNameError": { "alias": "invalidNameError"; "required": false; }; "cantSortMixedCells": { "alias": "cantSortMixedCells"; "required": false; }; "filterApply": { "alias": "filterApply"; "required": false; }; "filterClear": { "alias": "filterClear"; "required": false; }; "filterMenuAll": { "alias": "filterMenuAll"; "required": false; }; "blankValues": { "alias": "blankValues"; "required": false; }; "filterContainsOperator": { "alias": "filterContainsOperator"; "required": false; }; "filterNotContainsOperator": { "alias": "filterNotContainsOperator"; "required": false; }; "filterStartsWithOperator": { "alias": "filterStartsWithOperator"; "required": false; }; "filterEndsWithOperator": { "alias": "filterEndsWithOperator"; "required": false; }; "filterMatchesOperator": { "alias": "filterMatchesOperator"; "required": false; }; "filterNotMatchesOperator": { "alias": "filterNotMatchesOperator"; "required": false; }; "filterDateEqOperator": { "alias": "filterDateEqOperator"; "required": false; }; "filterDateNotEqOperator": { "alias": "filterDateNotEqOperator"; "required": false; }; "filterBeforeOperator": { "alias": "filterBeforeOperator"; "required": false; }; "filterAfterOperator": { "alias": "filterAfterOperator"; "required": false; }; "filterEqOperator": { "alias": "filterEqOperator"; "required": false; }; "filterNotEqOperator": { "alias": "filterNotEqOperator"; "required": false; }; "filterGteOperator": { "alias": "filterGteOperator"; "required": false; }; "filterGtOperator": { "alias": "filterGtOperator"; "required": false; }; "filterLteOperator": { "alias": "filterLteOperator"; "required": false; }; "filterLtOperator": { "alias": "filterLtOperator"; "required": false; }; "filterNoneOperator": { "alias": "filterNoneOperator"; "required": false; }; "filterMenuConditionItem": { "alias": "filterMenuConditionItem"; "required": false; }; "filterMenuValueItem": { "alias": "filterMenuValueItem"; "required": false; }; "sort": { "alias": "sort"; "required": false; }; "sortAsc": { "alias": "sortAsc"; "required": false; }; "sortDesc": { "alias": "sortDesc"; "required": false; }; "unsort": { "alias": "unsort"; "required": false; }; "cantSortNullRef": { "alias": "cantSortNullRef"; "required": false; }; "cantSortMultipleSelection": { "alias": "cantSortMultipleSelection"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MessagesDirective, "[kendoSpreadsheetMessages]", never, { "home": { "alias": "home"; "required": false; }; "file": { "alias": "file"; "required": false; }; "insert": { "alias": "insert"; "required": false; }; "formatTab": { "alias": "formatTab"; "required": false; }; "dataTab": { "alias": "dataTab"; "required": false; }; "saveFile": { "alias": "saveFile"; "required": false; }; "pdfExport": { "alias": "pdfExport"; "required": false; }; "loadFile": { "alias": "loadFile"; "required": false; }; "bold": { "alias": "bold"; "required": false; }; "dataValidation": { "alias": "dataValidation"; "required": false; }; "filter": { "alias": "filter"; "required": false; }; "validationCellRange": { "alias": "validationCellRange"; "required": false; }; "validationCriteria": { "alias": "validationCriteria"; "required": false; }; "validationComparer": { "alias": "validationComparer"; "required": false; }; "validationMinValue": { "alias": "validationMinValue"; "required": false; }; "validationMaxValue": { "alias": "validationMaxValue"; "required": false; }; "validationStartValue": { "alias": "validationStartValue"; "required": false; }; "validationEndValue": { "alias": "validationEndValue"; "required": false; }; "validationValue": { "alias": "validationValue"; "required": false; }; "validationShowListButtonCheckbox": { "alias": "validationShowListButtonCheckbox"; "required": false; }; "validationShowDateButtonCheckbox": { "alias": "validationShowDateButtonCheckbox"; "required": false; }; "validationIgnoreBlankCheckbox": { "alias": "validationIgnoreBlankCheckbox"; "required": false; }; "validationOnInvalidData": { "alias": "validationOnInvalidData"; "required": false; }; "validationRejectInput": { "alias": "validationRejectInput"; "required": false; }; "validationShowWarning": { "alias": "validationShowWarning"; "required": false; }; "validationShowHint": { "alias": "validationShowHint"; "required": false; }; "anyValueValidationCriteria": { "alias": "anyValueValidationCriteria"; "required": false; }; "numberValidationCriteria": { "alias": "numberValidationCriteria"; "required": false; }; "textValidationCriteria": { "alias": "textValidationCriteria"; "required": false; }; "dateValidationCriteria": { "alias": "dateValidationCriteria"; "required": false; }; "customFormulaValidationCriteria": { "alias": "customFormulaValidationCriteria"; "required": false; }; "listValidationCriteria": { "alias": "listValidationCriteria"; "required": false; }; "greaterThanValidationComparer": { "alias": "greaterThanValidationComparer"; "required": false; }; "lessThanValidationComparer": { "alias": "lessThanValidationComparer"; "required": false; }; "betweenValidationComparer": { "alias": "betweenValidationComparer"; "required": false; }; "notBetweenValidationComparer": { "alias": "notBetweenValidationComparer"; "required": false; }; "equalToValidationComparer": { "alias": "equalToValidationComparer"; "required": false; }; "notEqualToValidationComparer": { "alias": "notEqualToValidationComparer"; "required": false; }; "greaterThanOrEqualToValidationComparer": { "alias": "greaterThanOrEqualToValidationComparer"; "required": false; }; "lessThanOrEqualToValidationComparer": { "alias": "lessThanOrEqualToValidationComparer"; "required": false; }; "validationHintMessage": { "alias": "validationHintMessage"; "required": false; }; "validationHintTitle": { "alias": "validationHintTitle"; "required": false; }; "italic": { "alias": "italic"; "required": false; }; "underline": { "alias": "underline"; "required": false; }; "format": { "alias": "format"; "required": false; }; "fontFamily": { "alias": "fontFamily"; "required": false; }; "fontSize": { "alias": "fontSize"; "required": false; }; "undo": { "alias": "undo"; "required": false; }; "redo": { "alias": "redo"; "required": false; }; "background": { "alias": "background"; "required": false; }; "color": { "alias": "color"; "required": false; }; "gridLines": { "alias": "gridLines"; "required": false; }; "addColumnLeft": { "alias": "addColumnLeft"; "required": false; }; "addColumnRight": { "alias": "addColumnRight"; "required": false; }; "addRowBelow": { "alias": "addRowBelow"; "required": false; }; "addRowAbove": { "alias": "addRowAbove"; "required": false; }; "deleteColumn": { "alias": "deleteColumn"; "required": false; }; "deleteRow": { "alias": "deleteRow"; "required": false; }; "wrap": { "alias": "wrap"; "required": false; }; "align": { "alias": "align"; "required": false; }; "alignHorizontal": { "alias": "alignHorizontal"; "required": false; }; "alignVertical": { "alias": "alignVertical"; "required": false; }; "alignLeft": { "alias": "alignLeft"; "required": false; }; "alignCenter": { "alias": "alignCenter"; "required": false; }; "alignRight": { "alias": "alignRight"; "required": false; }; "alignJustify": { "alias": "alignJustify"; "required": false; }; "alignTop": { "alias": "alignTop"; "required": false; }; "alignMiddle": { "alias": "alignMiddle"; "required": false; }; "alignBottom": { "alias": "alignBottom"; "required": false; }; "dialogApply": { "alias": "dialogApply"; "required": false; }; "dialogCancel": { "alias": "dialogCancel"; "required": false; }; "dialogDelete": { "alias": "dialogDelete"; "required": false; }; "dialogRename": { "alias": "dialogRename"; "required": false; }; "dialogInsert": { "alias": "dialogInsert"; "required": false; }; "dialogRemove": { "alias": "dialogRemove"; "required": false; }; "dialogRemoveLink": { "alias": "dialogRemoveLink"; "required": false; }; "delete": { "alias": "delete"; "required": false; }; "rename": { "alias": "rename"; "required": false; }; "nameBox": { "alias": "nameBox"; "required": false; }; "formulaInput": { "alias": "formulaInput"; "required": false; }; "addSheet": { "alias": "addSheet"; "required": false; }; "sheetsMenu": { "alias": "sheetsMenu"; "required": false; }; "view": { "alias": "view"; "required": false; }; "merge": { "alias": "merge"; "required": false; }; "mergeHorizontally": { "alias": "mergeHorizontally"; "required": false; }; "mergeVertically": { "alias": "mergeVertically"; "required": false; }; "mergeAll": { "alias": "mergeAll"; "required": false; }; "unmerge": { "alias": "unmerge"; "required": false; }; "insertLink": { "alias": "insertLink"; "required": false; }; "increaseDecimal": { "alias": "increaseDecimal"; "required": false; }; "decreaseDecimal": { "alias": "decreaseDecimal"; "required": false; }; "increaseFontSize": { "alias": "increaseFontSize"; "required": false; }; "decreaseFontSize": { "alias": "decreaseFontSize"; "required": false; }; "openUnsupported": { "alias": "openUnsupported"; "required": false; }; "modifyMerged": { "alias": "modifyMerged"; "required": false; }; "cannotModifyDisabled": { "alias": "cannotModifyDisabled"; "required": false; }; "rangeDisabled": { "alias": "rangeDisabled"; "required": false; }; "dialogOk": { "alias": "dialogOk"; "required": false; }; "dialogError": { "alias": "dialogError"; "required": false; }; "duplicateSheetName": { "alias": "duplicateSheetName"; "required": false; }; "copy": { "alias": "copy"; "required": false; }; "cut": { "alias": "cut"; "required": false; }; "paste": { "alias": "paste"; "required": false; }; "hideRow": { "alias": "hideRow"; "required": false; }; "unhideRow": { "alias": "unhideRow"; "required": false; }; "hideColumn": { "alias": "hideColumn"; "required": false; }; "unhideColumn": { "alias": "unhideColumn"; "required": false; }; "sheetDelete": { "alias": "sheetDelete"; "required": false; }; "sheetRename": { "alias": "sheetRename"; "required": false; }; "sheetHide": { "alias": "sheetHide"; "required": false; }; "sheetDuplicate": { "alias": "sheetDuplicate"; "required": false; }; "sheetMoveLeft": { "alias": "sheetMoveLeft"; "required": false; }; "sheetMoveRight": { "alias": "sheetMoveRight"; "required": false; }; "invalidNameError": { "alias": "invalidNameError"; "required": false; }; "cantSortMixedCells": { "alias": "cantSortMixedCells"; "required": false; }; "filterApply": { "alias": "filterApply"; "required": false; }; "filterClear": { "alias": "filterClear"; "required": false; }; "filterMenuAll": { "alias": "filterMenuAll"; "required": false; }; "blankValues": { "alias": "blankValues"; "required": false; }; "filterContainsOperator": { "alias": "filterContainsOperator"; "required": false; }; "filterNotContainsOperator": { "alias": "filterNotContainsOperator"; "required": false; }; "filterStartsWithOperator": { "alias": "filterStartsWithOperator"; "required": false; }; "filterEndsWithOperator": { "alias": "filterEndsWithOperator"; "required": false; }; "filterMatchesOperator": { "alias": "filterMatchesOperator"; "required": false; }; "filterNotMatchesOperator": { "alias": "filterNotMatchesOperator"; "required": false; }; "filterDateEqOperator": { "alias": "filterDateEqOperator"; "required": false; }; "filterDateNotEqOperator": { "alias": "filterDateNotEqOperator"; "required": false; }; "filterBeforeOperator": { "alias": "filterBeforeOperator"; "required": false; }; "filterAfterOperator": { "alias": "filterAfterOperator"; "required": false; }; "filterEqOperator": { "alias": "filterEqOperator"; "required": false; }; "filterNotEqOperator": { "alias": "filterNotEqOperator"; "required": false; }; "filterGteOperator": { "alias": "filterGteOperator"; "required": false; }; "filterGtOperator": { "alias": "filterGtOperator"; "required": false; }; "filterLteOperator": { "alias": "filterLteOperator"; "required": false; }; "filterLtOperator": { "alias": "filterLtOperator"; "required": false; }; "filterNoneOperator": { "alias": "filterNoneOperator"; "required": false; }; "filterMenuConditionItem": { "alias": "filterMenuConditionItem"; "required": false; }; "filterMenuValueItem": { "alias": "filterMenuValueItem"; "required": false; }; "sort": { "alias": "sort"; "required": false; }; "sortAsc": { "alias": "sortAsc"; "required": false; }; "sortDesc": { "alias": "sortDesc"; "required": false; }; "unsort": { "alias": "unsort"; "required": false; }; "cantSortNullRef": { "alias": "cantSortNullRef"; "required": false; }; "cantSortMultipleSelection": { "alias": "cantSortMultipleSelection"; "required": false; }; "formulaButton": { "alias": "formulaButton"; "required": false; }; }, {}, never, never, true, never>;
 }
 
 /**
@@ -2132,15 +2136,17 @@ declare class SheetsBarComponent implements AfterViewInit, OnDestroy {
     private localization;
     private dialogService;
     private ngZone;
+    private popupService;
     hostClasses: boolean;
     trackByItemKey: (index: number, item: SheetInfo) => any;
     sheets: SheetInfo[];
     sheetDescriptors: SheetDescriptor[];
     private subs;
     private hiding;
-    constructor(spreadsheetService: SpreadsheetService, element: ElementRef, renderer: Renderer2, localization: SpreadsheetLocalizationService, dialogService: DialogService, ngZone: NgZone);
+    constructor(spreadsheetService: SpreadsheetService, element: ElementRef, renderer: Renderer2, localization: SpreadsheetLocalizationService, dialogService: DialogService, ngZone: NgZone, popupService: PopupService);
     addButton: ButtonComponent;
-    menuButton: DropDownButtonComponent;
+    menuButton: ElementRef;
+    private sheetsMenuPopupTemplate;
     tabstrip: TabStripComponent;
     actionDdbs: QueryList<DropDownButtonComponent>;
     actionDdbRefs: QueryList<ElementRef>;
@@ -2151,6 +2157,8 @@ declare class SheetsBarComponent implements AfterViewInit, OnDestroy {
     selected: boolean;
     sheetsMenuList: any[];
     private openedDdb;
+    private menuPopupRef;
+    private documentClickSub;
     private tabListSub;
     private hiddenStateIcons;
     private hiddenStateSVGIcons;
@@ -2161,6 +2169,9 @@ declare class SheetsBarComponent implements AfterViewInit, OnDestroy {
     onAddClick: () => void;
     onTabSelect(ev: SelectEvent): void;
     onOpen(ddb: DropDownButtonComponent): void;
+    toggleSheetsMenuPopup(): void;
+    closeSheetsMenuPopup(): void;
+    private openSheetsMenuPopup;
     onClose(): void;
     onActionClick(dataItem: SheetAction, sheet: SheetInfo): void;
     onMenuItemClick(item: any): void;

package/package-metadata.mjs

@@ -7,7 +7,7 @@ export const packageMetadata = {
   "productCodes": [
     "KENDOUIANGULAR"
   ],
-  "publishDate": 1783692575,
-  "version": "25.0.0-develop.3",
+  "publishDate": 1784008805,
+  "version": "25.0.0-develop.5",
   "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"
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-spreadsheet",
-  "version": "25.0.0-develop.3",
+  "version": "25.0.0-develop.5",
   "description": "A Spreadsheet Component for Angular",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -40,7 +40,7 @@
     "package": {
       "productName": "Kendo UI for Angular",
       "productCode": "KENDOUIANGULAR",
-      "publishDate": 1783692575,
+      "publishDate": 1784008805,
       "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"
     }
   },
@@ -50,26 +50,26 @@
     "@angular/core": "20 - 22",
     "@angular/platform-browser": "20 - 22",
     "@progress/kendo-licensing": "^1.11.0",
-    "@progress/kendo-angular-buttons": "25.0.0-develop.3",
-    "@progress/kendo-angular-common": "25.0.0-develop.3",
-    "@progress/kendo-angular-dialog": "25.0.0-develop.3",
-    "@progress/kendo-angular-dropdowns": "25.0.0-develop.3",
-    "@progress/kendo-angular-icons": "25.0.0-develop.3",
-    "@progress/kendo-angular-inputs": "25.0.0-develop.3",
-    "@progress/kendo-angular-treeview": "25.0.0-develop.3",
-    "@progress/kendo-angular-dateinputs": "25.0.0-develop.3",
-    "@progress/kendo-angular-intl": "25.0.0-develop.3",
-    "@progress/kendo-angular-l10n": "25.0.0-develop.3",
-    "@progress/kendo-angular-label": "25.0.0-develop.3",
-    "@progress/kendo-angular-layout": "25.0.0-develop.3",
-    "@progress/kendo-angular-menu": "25.0.0-develop.3",
-    "@progress/kendo-angular-popup": "25.0.0-develop.3",
-    "@progress/kendo-angular-toolbar": "25.0.0-develop.3",
+    "@progress/kendo-angular-buttons": "25.0.0-develop.5",
+    "@progress/kendo-angular-common": "25.0.0-develop.5",
+    "@progress/kendo-angular-dialog": "25.0.0-develop.5",
+    "@progress/kendo-angular-dropdowns": "25.0.0-develop.5",
+    "@progress/kendo-angular-icons": "25.0.0-develop.5",
+    "@progress/kendo-angular-inputs": "25.0.0-develop.5",
+    "@progress/kendo-angular-treeview": "25.0.0-develop.5",
+    "@progress/kendo-angular-dateinputs": "25.0.0-develop.5",
+    "@progress/kendo-angular-intl": "25.0.0-develop.5",
+    "@progress/kendo-angular-l10n": "25.0.0-develop.5",
+    "@progress/kendo-angular-label": "25.0.0-develop.5",
+    "@progress/kendo-angular-layout": "25.0.0-develop.5",
+    "@progress/kendo-angular-menu": "25.0.0-develop.5",
+    "@progress/kendo-angular-popup": "25.0.0-develop.5",
+    "@progress/kendo-angular-toolbar": "25.0.0-develop.5",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "25.0.0-develop.3",
+    "@progress/kendo-angular-schematics": "25.0.0-develop.5",
     "@progress/jszip-esm": "^1.0.3",
     "@progress/kendo-common": "^1.0.1",
     "@progress/kendo-date-math": "^1.5.10",

package/schematics/ngAdd/index.js

@@ -11,8 +11,8 @@ function default_1(options) {
             // Peer dependency of icons
             '@progress/kendo-svg-icons': '^4.0.0',
             // peer deps of the dropdowns
-            '@progress/kendo-angular-navigation': '25.0.0-develop.3',
-            '@progress/kendo-angular-treeview': '25.0.0-develop.3'
+            '@progress/kendo-angular-navigation': '25.0.0-develop.5',
+            '@progress/kendo-angular-treeview': '25.0.0-develop.5'
         } });
     return (0, schematics_1.externalSchematic)('@progress/kendo-angular-schematics', 'ng-add', finalOptions);
 }