@progress/kendo-angular-spreadsheet 14.3.0-develop.5 → 14.3.0-develop.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -22,6 +22,7 @@ export declare class FormulaInputDirective {
22
22
  ariaHasPopup: string;
23
23
  ariaExpanded: string;
24
24
  get ariaControls(): string;
25
+ formulaListMaxHeight: string;
25
26
  list: FormulaListComponent;
26
27
  data: any[];
27
28
  constructor(element: ElementRef, popupService: PopupService, spreadsheetService: SpreadsheetService, localization: SpreadsheetLocalizationService);
@@ -33,5 +34,5 @@ export declare class FormulaInputDirective {
33
34
  private unfocus;
34
35
  private focusNext;
35
36
  static ɵfac: i0.ɵɵFactoryDeclaration<FormulaInputDirective, never>;
36
- static ɵdir: i0.ɵɵDirectiveDeclaration<FormulaInputDirective, "[kendoSpreadsheetFormulaInput]", never, {}, {}, never>;
37
+ static ɵdir: i0.ɵɵDirectiveDeclaration<FormulaInputDirective, "[kendoSpreadsheetFormulaInput]", never, { "formulaListMaxHeight": "formulaListMaxHeight"; }, {}, never>;
37
38
  }
@@ -13,11 +13,12 @@ export declare class FormulaListComponent {
13
13
  element: ElementRef;
14
14
  private spreadsheetService;
15
15
  id: string;
16
+ maxHeight: string;
16
17
  data: any[];
17
18
  itemClick: (value: any) => void;
18
19
  formulaFxIcon: SVGIcon;
19
20
  constructor(element: ElementRef, spreadsheetService: SpreadsheetService);
20
21
  handleMouseDown: (ev: MouseEvent) => void;
21
22
  static ɵfac: i0.ɵɵFactoryDeclaration<FormulaListComponent, never>;
22
- static ɵcmp: i0.ɵɵComponentDeclaration<FormulaListComponent, "kendo-spreadsheet-formula-list", never, { "data": "data"; "itemClick": "itemClick"; }, {}, never, never>;
23
+ static ɵcmp: i0.ɵɵComponentDeclaration<FormulaListComponent, "kendo-spreadsheet-formula-list", never, { "maxHeight": "maxHeight"; "data": "data"; "itemClick": "itemClick"; }, {}, never, never>;
23
24
  }
@@ -2,7 +2,7 @@
2
2
  * Copyright © 2023 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- import { Directive, ElementRef, HostBinding } from '@angular/core';
5
+ import { Directive, ElementRef, HostBinding, Input } from '@angular/core';
6
6
  import { FormulaListComponent } from './list.component';
7
7
  import { PopupService } from '@progress/kendo-angular-popup';
8
8
  import { SpreadsheetService } from '../common/spreadsheet.service';
@@ -46,6 +46,23 @@ export class FormulaInputDirective {
46
46
  }
47
47
  if (next) {
48
48
  next.classList.add('k-focus');
49
+ const { offsetTop, offsetHeight, parentElement } = next;
50
+ if (dir > 0) {
51
+ if (offsetTop + offsetHeight >= parentElement.offsetHeight + parentElement.scrollTop) {
52
+ parentElement.scrollTop = Math.min(parentElement.scrollTop + offsetHeight, parentElement.scrollHeight - parentElement.offsetHeight);
53
+ }
54
+ if (next === items[0]) {
55
+ next.scrollIntoView();
56
+ }
57
+ }
58
+ else {
59
+ if (offsetTop <= parentElement.scrollTop) {
60
+ parentElement.scrollTop = Math.max(parentElement.scrollTop - offsetHeight, 0);
61
+ }
62
+ if (next === items[items.length - 1]) {
63
+ next.scrollIntoView();
64
+ }
65
+ }
49
66
  }
50
67
  };
51
68
  }
@@ -110,6 +127,7 @@ export class FormulaInputDirective {
110
127
  this.list = list;
111
128
  list.data = this.data;
112
129
  list.itemClick = this.handler;
130
+ list.maxHeight = this.formulaListMaxHeight;
113
131
  this.ariaExpanded = 'true';
114
132
  },
115
133
  close: () => {
@@ -128,7 +146,7 @@ export class FormulaInputDirective {
128
146
  }
129
147
  }
130
148
  FormulaInputDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormulaInputDirective, deps: [{ token: i0.ElementRef }, { token: i1.PopupService }, { token: i2.SpreadsheetService }, { token: i3.SpreadsheetLocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
131
- FormulaInputDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: FormulaInputDirective, selector: "[kendoSpreadsheetFormulaInput]", host: { properties: { "class.k-spreadsheet-formula-input": "this.hostClasses", "attr.title": "this.title", "attr.role": "this.role", "attr.aria-haspopup": "this.ariaHasPopup", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-controls": "this.ariaControls" } }, ngImport: i0 });
149
+ FormulaInputDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: FormulaInputDirective, selector: "[kendoSpreadsheetFormulaInput]", inputs: { formulaListMaxHeight: "formulaListMaxHeight" }, host: { properties: { "class.k-spreadsheet-formula-input": "this.hostClasses", "attr.title": "this.title", "attr.role": "this.role", "attr.aria-haspopup": "this.ariaHasPopup", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-controls": "this.ariaControls" } }, ngImport: i0 });
132
150
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormulaInputDirective, decorators: [{
133
151
  type: Directive,
134
152
  args: [{
@@ -152,4 +170,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
152
170
  }], ariaControls: [{
153
171
  type: HostBinding,
154
172
  args: ['attr.aria-controls']
173
+ }], formulaListMaxHeight: [{
174
+ type: Input
155
175
  }] } });
@@ -26,10 +26,12 @@ export class FormulaListComponent {
26
26
  }
27
27
  }
28
28
  FormulaListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormulaListComponent, deps: [{ token: i0.ElementRef }, { token: i1.SpreadsheetService }], target: i0.ɵɵFactoryTarget.Component });
29
- FormulaListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: FormulaListComponent, selector: "kendo-spreadsheet-formula-list", inputs: { data: "data", itemClick: "itemClick" }, host: { properties: { "attr.id": "this.id" } }, ngImport: i0, template: `
29
+ FormulaListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: FormulaListComponent, selector: "kendo-spreadsheet-formula-list", inputs: { maxHeight: "maxHeight", data: "data", itemClick: "itemClick" }, host: { properties: { "attr.id": "this.id" } }, ngImport: i0, template: `
30
30
  <ul #ulRef
31
31
  class="k-spreadsheet-formula-list k-list-ul k-list-md k-group k-reset"
32
32
  role="menu"
33
+ [style.overflowY]="'auto'"
34
+ [style.maxHeight]="maxHeight"
33
35
  [kendoEventsOutsideAngular]="{mousedown: handleMouseDown}">
34
36
  <li *ngFor="let item of data"
35
37
  (click)="itemClick(item.text)"
@@ -51,6 +53,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
51
53
  <ul #ulRef
52
54
  class="k-spreadsheet-formula-list k-list-ul k-list-md k-group k-reset"
53
55
  role="menu"
56
+ [style.overflowY]="'auto'"
57
+ [style.maxHeight]="maxHeight"
54
58
  [kendoEventsOutsideAngular]="{mousedown: handleMouseDown}">
55
59
  <li *ngFor="let item of data"
56
60
  (click)="itemClick(item.text)"
@@ -68,6 +72,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
68
72
  }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.SpreadsheetService }]; }, propDecorators: { id: [{
69
73
  type: HostBinding,
70
74
  args: ['attr.id']
75
+ }], maxHeight: [{
76
+ type: Input
71
77
  }], data: [{
72
78
  type: Input
73
79
  }], itemClick: [{
@@ -9,7 +9,7 @@ export const packageMetadata = {
9
9
  name: '@progress/kendo-angular-spreadsheet',
10
10
  productName: 'Kendo UI for Angular',
11
11
  productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
12
- publishDate: 1701781986,
13
- version: '14.3.0-develop.5',
12
+ publishDate: 1701794125,
13
+ version: '14.3.0-develop.7',
14
14
  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',
15
15
  };
@@ -77,23 +77,24 @@ export class SheetsBarComponent {
77
77
  const isMoveRight = itemKey === 'sheetMoveRight';
78
78
  let oldIndex = -1;
79
79
  let newIndex = -1;
80
+ const sheets = this.spreadsheetService.spreadsheet.sheets();
80
81
  if (isMoveRight) {
81
- for (let i = 0; i < this.sheets.length; i++) {
82
- if (this.sheets[i].text === sheetInfo.text) {
82
+ for (let i = 0; i < sheets.length; i++) {
83
+ if (sheets[i].name() === sheetInfo.text) {
83
84
  oldIndex = i;
84
85
  }
85
- if (oldIndex > -1 && i > oldIndex && this.sheets[i].state === 'visible') {
86
+ if (oldIndex > -1 && i > oldIndex && sheets[i]._state() === 'visible') {
86
87
  newIndex = i;
87
88
  break;
88
89
  }
89
90
  }
90
91
  }
91
92
  else {
92
- for (let i = this.sheets.length - 1; i >= 0; i--) {
93
- if (this.sheets[i].text === sheetInfo.text) {
93
+ for (let i = sheets.length - 1; i >= 0; i--) {
94
+ if (sheets[i].name() === sheetInfo.text) {
94
95
  oldIndex = i;
95
96
  }
96
- if (oldIndex > -1 && i < oldIndex && this.sheets[i].state === 'visible') {
97
+ if (oldIndex > -1 && (i < oldIndex) && sheets[i]._state() === 'visible') {
97
98
  newIndex = i;
98
99
  break;
99
100
  }
@@ -101,6 +102,7 @@ export class SheetsBarComponent {
101
102
  }
102
103
  const sheetsBar = this.spreadsheetService.spreadsheet.view.sheetsbar;
103
104
  sheetsBar.onSheetReorderEnd({ oldIndex, newIndex });
105
+ this.selectSheet(sheetInfo.text);
104
106
  this.notifySheetsChange();
105
107
  },
106
108
  hide: (sheet) => {
@@ -257,7 +259,6 @@ export class SheetsBarComponent {
257
259
  this.sheets = sheetDesc
258
260
  .flatMap((item, index, items) => item.state === 'visible' ? [{
259
261
  ...item,
260
- state: item.state || 'visible',
261
262
  inEdit: false,
262
263
  first: index === 0,
263
264
  last: index === items.length - 1,
@@ -89,6 +89,13 @@ export class SpreadsheetComponent {
89
89
  * @default false
90
90
  */
91
91
  this.overflow = false;
92
+ /**
93
+ * Sets the height of the formula list container.
94
+ * Accepts same values as the CSS [`style.height`](https://developer.mozilla.org/en-US/docs/Web/CSS/height) property.
95
+ *
96
+ * @default '300px'
97
+ */
98
+ this.formulaListMaxHeight = '300px';
92
99
  /**
93
100
  * The number of columns in the document.
94
101
  *
@@ -629,7 +636,7 @@ export class SpreadsheetComponent {
629
636
  }
630
637
  }
631
638
  SpreadsheetComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: SpreadsheetComponent, deps: [{ token: i0.NgZone }, { token: i1.IntlService }, { token: i0.ElementRef }, { token: i2.LocalizationService }, { token: i3.SpreadsheetService }, { token: i4.SpreadsheetToolsService }, { token: i5.ErrorHandlingService }, { token: i6.DialogService }], target: i0.ɵɵFactoryTarget.Component });
632
- SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: SpreadsheetComponent, selector: "kendo-spreadsheet", inputs: { menuItems: "menuItems", overflow: "overflow", activeSheet: "activeSheet", sheets: "sheets", columns: "columns", columnWidth: "columnWidth", defaultCellStyle: "defaultCellStyle", headerHeight: "headerHeight", headerWidth: "headerWidth", rowHeight: "rowHeight", rows: "rows", images: "images", excel: "excel" }, outputs: { change: "change", formatChange: "formatChange", selectionChange: "selectionChange", excelExport: "excelExport", excelImport: "excelImport", activeSheetChange: "activeSheetChange" }, host: { properties: { "class.k-spreadsheet": "this.hostClass", "attr.role": "this.role" } }, providers: [
639
+ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: SpreadsheetComponent, selector: "kendo-spreadsheet", inputs: { menuItems: "menuItems", overflow: "overflow", formulaListMaxHeight: "formulaListMaxHeight", activeSheet: "activeSheet", sheets: "sheets", columns: "columns", columnWidth: "columnWidth", defaultCellStyle: "defaultCellStyle", headerHeight: "headerHeight", headerWidth: "headerWidth", rowHeight: "rowHeight", rows: "rows", images: "images", excel: "excel" }, outputs: { change: "change", formatChange: "formatChange", selectionChange: "selectionChange", excelExport: "excelExport", excelImport: "excelImport", activeSheetChange: "activeSheetChange" }, host: { properties: { "class.k-spreadsheet": "this.hostClass", "attr.role": "this.role" } }, providers: [
633
640
  SpreadsheetLocalizationService,
634
641
  {
635
642
  provide: LocalizationService,
@@ -877,7 +884,11 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
877
884
  [svgIcon]="formulaFxIcon">
878
885
  </kendo-icon-wrapper>
879
886
  <span class="k-separator k-separator-vertical"></span>
880
- <div #formulaBar kendoSpreadsheetFormulaInput class="k-textbox k-input k-input-md k-input-flat k-rounded-md"></div>
887
+ <div
888
+ #formulaBar
889
+ kendoSpreadsheetFormulaInput
890
+ [formulaListMaxHeight]="formulaListMaxHeight"
891
+ class="k-textbox k-input k-input-md k-input-flat k-rounded-md"></div>
881
892
  </div>
882
893
  </div>
883
894
  <div class="k-spreadsheet-view">
@@ -901,7 +912,7 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
901
912
  (select)="onContextMenuSelect($event)"></kendo-contextmenu>
902
913
 
903
914
  <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
904
- `, isInline: true, components: [{ type: i7.MenuComponent, selector: "kendo-menu", inputs: ["menuItemTemplate", "ariaRole", "menuItemLinkTemplate"], outputs: ["select", "open", "close"], exportAs: ["kendoMenu"] }, { type: i7.MenuItemComponent, selector: "kendo-menu-item", inputs: ["text", "url", "disabled", "cssClass", "cssStyle", "icon", "svgIcon", "data", "separator"] }, { type: i8.ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "tabindex", "size", "tabIndex"], outputs: ["open", "close"], exportAs: ["kendoToolBar"] }, { type: i9.SpreadsheetLoadFileComponent, selector: "kendo-spreadsheet-load-file-tool" }, { type: i8.ToolBarButtonComponent, selector: "kendo-toolbar-button", inputs: ["showText", "showIcon", "text", "style", "className", "title", "disabled", "toggleable", "look", "togglable", "selected", "fillMode", "themeColor", "icon", "iconClass", "svgIcon", "imageUrl"], outputs: ["click", "pointerdown", "selectedChange"], exportAs: ["kendoToolBarButton"] }, { type: i8.ToolBarButtonGroupComponent, selector: "kendo-toolbar-buttongroup", inputs: ["disabled", "selection", "width", "look"], exportAs: ["kendoToolBarButtonGroup"] }, { type: i8.ToolBarSeparatorComponent, selector: "kendo-toolbar-separator", exportAs: ["kendoToolBarSeparator"] }, { type: i10.SpreadsheetFontFamilyComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontFamily]" }, { type: i11.SpreadsheetFontSizeComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontSize]" }, { type: i12.SpreadsheetForeColorComponent, selector: "kendo-spreadsheet-forecolor-tool" }, { type: i13.SpreadsheetBackColorComponent, selector: "kendo-spreadsheet-backcolor-tool" }, { type: i8.ToolBarDropDownButtonComponent, selector: "kendo-toolbar-dropdownbutton", inputs: ["arrowIcon", "title", "showText", "showIcon", "text", "icon", "svgIcon", "iconClass", "imageUrl", "popupSettings", "look", "primary", "fillMode", "themeColor", "buttonClass", "textField", "disabled", "data"], outputs: ["itemClick", "open", "close"], exportAs: ["kendoToolBarDropDownButton"] }, { type: i14.NameBoxComponent, selector: "[kendoSpreadsheetNameBox]", inputs: ["data", "spreadsheetWidget"] }, { type: i15.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { type: i16.SheetsBarComponent, selector: "[kendoSpreadsheetSheetsBar]", inputs: ["sheets", "sheetDescriptors"] }, { type: i7.ContextMenuComponent, selector: "kendo-contextmenu", inputs: ["showOn", "target", "filter", "alignToAnchor", "vertical", "popupAnimate", "popupAlign", "anchorAlign", "collision", "appendTo", "ariaLabel"], outputs: ["popupOpen", "popupClose", "select", "open", "close"], exportAs: ["kendoContextMenu"] }, { type: i17.WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }], directives: [{ type: i18.LocalizedMessagesDirective, selector: "[kendoSpreadsheetLocalizedMessages]" }, { type: i19.MainMenuDirective, selector: "[kendoSpreadsheetMenu]" }, { type: i20.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i20.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i21.SpreadsheetSaveFileDirective, selector: "[kendoSpreadsheetSaveFile]" }, { type: i22.SpreadsheetUndoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUndo]" }, { type: i23.SpreadsheetRedoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetRedo]" }, { type: i24.SpreadsheetIncreaseFontSizeDirective, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseFontSize]" }, { type: i25.SpreadsheetDecreaseFontSizeDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseFontSize]" }, { type: i26.SpreadsheetBoldDirective, selector: "kendo-toolbar-button[kendoSpreadsheetBold]" }, { type: i27.SpreadsheetItalicDirective, selector: "kendo-toolbar-button[kendoSpreadsheetItalic]" }, { type: i28.SpreadsheetUnderlineDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUnderline]" }, { type: i29.SpreadsheetHorizontalTextAlignDirective, selector: "[kendoSpreadsheetHorizontalTextAlign]" }, { type: i30.SpreadsheetVerticalTextAlignDirective, selector: "[kendoSpreadsheetVerticalTextAlign]" }, { type: i31.SpreadsheetTextWrapDirective, selector: "kendo-toolbar-button[kendoSpreadsheetTextWrap]" }, { type: i32.SpreadsheetFormatDirective, selector: "[kendoSpreadsheetFormat]" }, { type: i33.SpreadsheetInsertLinkDirective, selector: "kendo-toolbar-button[kendoSpreadsheetInsertLink]" }, { type: i34.SpreadsheetAddColumnLeftButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnLeftButton]" }, { type: i35.SpreadsheetAddColumnRightButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnRightButton]" }, { type: i36.SpreadsheetAddRowBelowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowBelowButton]" }, { type: i37.SpreadsheetAddRowAboveButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowAboveButton]" }, { type: i38.SpreadsheetDeleteColumnButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteColumnButton]" }, { type: i39.SpreadsheetDeleteRowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteRowButton]" }, { type: i40.SpreadsheetDecreaseDecimalDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseDecimal]" }, { type: i41.SpreadsheetIncreaseDecimalDirective, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseDecimal]" }, { type: i42.SpreadsheetMergeDirective, selector: "[kendoSpreadsheetMerge]" }, { type: i43.SpreadsheetGridLinesDirective, selector: "kendo-toolbar-button[kendoSpreadsheetGridLines]" }, { type: i44.FormulaInputDirective, selector: "[kendoSpreadsheetFormulaInput]" }] });
915
+ `, isInline: true, components: [{ type: i7.MenuComponent, selector: "kendo-menu", inputs: ["menuItemTemplate", "ariaRole", "menuItemLinkTemplate"], outputs: ["select", "open", "close"], exportAs: ["kendoMenu"] }, { type: i7.MenuItemComponent, selector: "kendo-menu-item", inputs: ["text", "url", "disabled", "cssClass", "cssStyle", "icon", "svgIcon", "data", "separator"] }, { type: i8.ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "tabindex", "size", "tabIndex"], outputs: ["open", "close"], exportAs: ["kendoToolBar"] }, { type: i9.SpreadsheetLoadFileComponent, selector: "kendo-spreadsheet-load-file-tool" }, { type: i8.ToolBarButtonComponent, selector: "kendo-toolbar-button", inputs: ["showText", "showIcon", "text", "style", "className", "title", "disabled", "toggleable", "look", "togglable", "selected", "fillMode", "themeColor", "icon", "iconClass", "svgIcon", "imageUrl"], outputs: ["click", "pointerdown", "selectedChange"], exportAs: ["kendoToolBarButton"] }, { type: i8.ToolBarButtonGroupComponent, selector: "kendo-toolbar-buttongroup", inputs: ["disabled", "selection", "width", "look"], exportAs: ["kendoToolBarButtonGroup"] }, { type: i8.ToolBarSeparatorComponent, selector: "kendo-toolbar-separator", exportAs: ["kendoToolBarSeparator"] }, { type: i10.SpreadsheetFontFamilyComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontFamily]" }, { type: i11.SpreadsheetFontSizeComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontSize]" }, { type: i12.SpreadsheetForeColorComponent, selector: "kendo-spreadsheet-forecolor-tool" }, { type: i13.SpreadsheetBackColorComponent, selector: "kendo-spreadsheet-backcolor-tool" }, { type: i8.ToolBarDropDownButtonComponent, selector: "kendo-toolbar-dropdownbutton", inputs: ["arrowIcon", "title", "showText", "showIcon", "text", "icon", "svgIcon", "iconClass", "imageUrl", "popupSettings", "look", "primary", "fillMode", "themeColor", "buttonClass", "textField", "disabled", "data"], outputs: ["itemClick", "open", "close"], exportAs: ["kendoToolBarDropDownButton"] }, { type: i14.NameBoxComponent, selector: "[kendoSpreadsheetNameBox]", inputs: ["data", "spreadsheetWidget"] }, { type: i15.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { type: i16.SheetsBarComponent, selector: "[kendoSpreadsheetSheetsBar]", inputs: ["sheets", "sheetDescriptors"] }, { type: i7.ContextMenuComponent, selector: "kendo-contextmenu", inputs: ["showOn", "target", "filter", "alignToAnchor", "vertical", "popupAnimate", "popupAlign", "anchorAlign", "collision", "appendTo", "ariaLabel"], outputs: ["popupOpen", "popupClose", "select", "open", "close"], exportAs: ["kendoContextMenu"] }, { type: i17.WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }], directives: [{ type: i18.LocalizedMessagesDirective, selector: "[kendoSpreadsheetLocalizedMessages]" }, { type: i19.MainMenuDirective, selector: "[kendoSpreadsheetMenu]" }, { type: i20.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i20.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i21.SpreadsheetSaveFileDirective, selector: "[kendoSpreadsheetSaveFile]" }, { type: i22.SpreadsheetUndoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUndo]" }, { type: i23.SpreadsheetRedoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetRedo]" }, { type: i24.SpreadsheetIncreaseFontSizeDirective, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseFontSize]" }, { type: i25.SpreadsheetDecreaseFontSizeDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseFontSize]" }, { type: i26.SpreadsheetBoldDirective, selector: "kendo-toolbar-button[kendoSpreadsheetBold]" }, { type: i27.SpreadsheetItalicDirective, selector: "kendo-toolbar-button[kendoSpreadsheetItalic]" }, { type: i28.SpreadsheetUnderlineDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUnderline]" }, { type: i29.SpreadsheetHorizontalTextAlignDirective, selector: "[kendoSpreadsheetHorizontalTextAlign]" }, { type: i30.SpreadsheetVerticalTextAlignDirective, selector: "[kendoSpreadsheetVerticalTextAlign]" }, { type: i31.SpreadsheetTextWrapDirective, selector: "kendo-toolbar-button[kendoSpreadsheetTextWrap]" }, { type: i32.SpreadsheetFormatDirective, selector: "[kendoSpreadsheetFormat]" }, { type: i33.SpreadsheetInsertLinkDirective, selector: "kendo-toolbar-button[kendoSpreadsheetInsertLink]" }, { type: i34.SpreadsheetAddColumnLeftButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnLeftButton]" }, { type: i35.SpreadsheetAddColumnRightButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnRightButton]" }, { type: i36.SpreadsheetAddRowBelowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowBelowButton]" }, { type: i37.SpreadsheetAddRowAboveButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowAboveButton]" }, { type: i38.SpreadsheetDeleteColumnButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteColumnButton]" }, { type: i39.SpreadsheetDeleteRowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteRowButton]" }, { type: i40.SpreadsheetDecreaseDecimalDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseDecimal]" }, { type: i41.SpreadsheetIncreaseDecimalDirective, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseDecimal]" }, { type: i42.SpreadsheetMergeDirective, selector: "[kendoSpreadsheetMerge]" }, { type: i43.SpreadsheetGridLinesDirective, selector: "kendo-toolbar-button[kendoSpreadsheetGridLines]" }, { type: i44.FormulaInputDirective, selector: "[kendoSpreadsheetFormulaInput]", inputs: ["formulaListMaxHeight"] }] });
905
916
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: SpreadsheetComponent, decorators: [{
906
917
  type: Component,
907
918
  args: [{
@@ -1156,7 +1167,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
1156
1167
  [svgIcon]="formulaFxIcon">
1157
1168
  </kendo-icon-wrapper>
1158
1169
  <span class="k-separator k-separator-vertical"></span>
1159
- <div #formulaBar kendoSpreadsheetFormulaInput class="k-textbox k-input k-input-md k-input-flat k-rounded-md"></div>
1170
+ <div
1171
+ #formulaBar
1172
+ kendoSpreadsheetFormulaInput
1173
+ [formulaListMaxHeight]="formulaListMaxHeight"
1174
+ class="k-textbox k-input k-input-md k-input-flat k-rounded-md"></div>
1160
1175
  </div>
1161
1176
  </div>
1162
1177
  <div class="k-spreadsheet-view">
@@ -1207,6 +1222,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
1207
1222
  type: Input
1208
1223
  }], overflow: [{
1209
1224
  type: Input
1225
+ }], formulaListMaxHeight: [{
1226
+ type: Input
1210
1227
  }], activeSheet: [{
1211
1228
  type: Input
1212
1229
  }], sheets: [{
@@ -47,8 +47,8 @@ const packageMetadata = {
47
47
  name: '@progress/kendo-angular-spreadsheet',
48
48
  productName: 'Kendo UI for Angular',
49
49
  productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
50
- publishDate: 1701781986,
51
- version: '14.3.0-develop.5',
50
+ publishDate: 1701794125,
51
+ version: '14.3.0-develop.7',
52
52
  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',
53
53
  };
54
54
 
@@ -214,10 +214,12 @@ class FormulaListComponent {
214
214
  }
215
215
  }
216
216
  FormulaListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormulaListComponent, deps: [{ token: i0.ElementRef }, { token: SpreadsheetService }], target: i0.ɵɵFactoryTarget.Component });
217
- FormulaListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: FormulaListComponent, selector: "kendo-spreadsheet-formula-list", inputs: { data: "data", itemClick: "itemClick" }, host: { properties: { "attr.id": "this.id" } }, ngImport: i0, template: `
217
+ FormulaListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: FormulaListComponent, selector: "kendo-spreadsheet-formula-list", inputs: { maxHeight: "maxHeight", data: "data", itemClick: "itemClick" }, host: { properties: { "attr.id": "this.id" } }, ngImport: i0, template: `
218
218
  <ul #ulRef
219
219
  class="k-spreadsheet-formula-list k-list-ul k-list-md k-group k-reset"
220
220
  role="menu"
221
+ [style.overflowY]="'auto'"
222
+ [style.maxHeight]="maxHeight"
221
223
  [kendoEventsOutsideAngular]="{mousedown: handleMouseDown}">
222
224
  <li *ngFor="let item of data"
223
225
  (click)="itemClick(item.text)"
@@ -239,6 +241,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
239
241
  <ul #ulRef
240
242
  class="k-spreadsheet-formula-list k-list-ul k-list-md k-group k-reset"
241
243
  role="menu"
244
+ [style.overflowY]="'auto'"
245
+ [style.maxHeight]="maxHeight"
242
246
  [kendoEventsOutsideAngular]="{mousedown: handleMouseDown}">
243
247
  <li *ngFor="let item of data"
244
248
  (click)="itemClick(item.text)"
@@ -256,6 +260,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
256
260
  }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: SpreadsheetService }]; }, propDecorators: { id: [{
257
261
  type: HostBinding,
258
262
  args: ['attr.id']
263
+ }], maxHeight: [{
264
+ type: Input
259
265
  }], data: [{
260
266
  type: Input
261
267
  }], itemClick: [{
@@ -298,6 +304,23 @@ class FormulaInputDirective {
298
304
  }
299
305
  if (next) {
300
306
  next.classList.add('k-focus');
307
+ const { offsetTop, offsetHeight, parentElement } = next;
308
+ if (dir > 0) {
309
+ if (offsetTop + offsetHeight >= parentElement.offsetHeight + parentElement.scrollTop) {
310
+ parentElement.scrollTop = Math.min(parentElement.scrollTop + offsetHeight, parentElement.scrollHeight - parentElement.offsetHeight);
311
+ }
312
+ if (next === items[0]) {
313
+ next.scrollIntoView();
314
+ }
315
+ }
316
+ else {
317
+ if (offsetTop <= parentElement.scrollTop) {
318
+ parentElement.scrollTop = Math.max(parentElement.scrollTop - offsetHeight, 0);
319
+ }
320
+ if (next === items[items.length - 1]) {
321
+ next.scrollIntoView();
322
+ }
323
+ }
301
324
  }
302
325
  };
303
326
  }
@@ -365,6 +388,7 @@ class FormulaInputDirective {
365
388
  this.list = list;
366
389
  list.data = this.data;
367
390
  list.itemClick = this.handler;
391
+ list.maxHeight = this.formulaListMaxHeight;
368
392
  this.ariaExpanded = 'true';
369
393
  },
370
394
  close: () => {
@@ -383,7 +407,7 @@ class FormulaInputDirective {
383
407
  }
384
408
  }
385
409
  FormulaInputDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormulaInputDirective, deps: [{ token: i0.ElementRef }, { token: i1.PopupService }, { token: SpreadsheetService }, { token: SpreadsheetLocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
386
- FormulaInputDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: FormulaInputDirective, selector: "[kendoSpreadsheetFormulaInput]", host: { properties: { "class.k-spreadsheet-formula-input": "this.hostClasses", "attr.title": "this.title", "attr.role": "this.role", "attr.aria-haspopup": "this.ariaHasPopup", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-controls": "this.ariaControls" } }, ngImport: i0 });
410
+ FormulaInputDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: FormulaInputDirective, selector: "[kendoSpreadsheetFormulaInput]", inputs: { formulaListMaxHeight: "formulaListMaxHeight" }, host: { properties: { "class.k-spreadsheet-formula-input": "this.hostClasses", "attr.title": "this.title", "attr.role": "this.role", "attr.aria-haspopup": "this.ariaHasPopup", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-controls": "this.ariaControls" } }, ngImport: i0 });
387
411
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormulaInputDirective, decorators: [{
388
412
  type: Directive,
389
413
  args: [{
@@ -407,6 +431,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
407
431
  }], ariaControls: [{
408
432
  type: HostBinding,
409
433
  args: ['attr.aria-controls']
434
+ }], formulaListMaxHeight: [{
435
+ type: Input
410
436
  }] } });
411
437
 
412
438
  /**
@@ -1847,23 +1873,24 @@ class SheetsBarComponent {
1847
1873
  const isMoveRight = itemKey === 'sheetMoveRight';
1848
1874
  let oldIndex = -1;
1849
1875
  let newIndex = -1;
1876
+ const sheets = this.spreadsheetService.spreadsheet.sheets();
1850
1877
  if (isMoveRight) {
1851
- for (let i = 0; i < this.sheets.length; i++) {
1852
- if (this.sheets[i].text === sheetInfo.text) {
1878
+ for (let i = 0; i < sheets.length; i++) {
1879
+ if (sheets[i].name() === sheetInfo.text) {
1853
1880
  oldIndex = i;
1854
1881
  }
1855
- if (oldIndex > -1 && i > oldIndex && this.sheets[i].state === 'visible') {
1882
+ if (oldIndex > -1 && i > oldIndex && sheets[i]._state() === 'visible') {
1856
1883
  newIndex = i;
1857
1884
  break;
1858
1885
  }
1859
1886
  }
1860
1887
  }
1861
1888
  else {
1862
- for (let i = this.sheets.length - 1; i >= 0; i--) {
1863
- if (this.sheets[i].text === sheetInfo.text) {
1889
+ for (let i = sheets.length - 1; i >= 0; i--) {
1890
+ if (sheets[i].name() === sheetInfo.text) {
1864
1891
  oldIndex = i;
1865
1892
  }
1866
- if (oldIndex > -1 && i < oldIndex && this.sheets[i].state === 'visible') {
1893
+ if (oldIndex > -1 && (i < oldIndex) && sheets[i]._state() === 'visible') {
1867
1894
  newIndex = i;
1868
1895
  break;
1869
1896
  }
@@ -1871,6 +1898,7 @@ class SheetsBarComponent {
1871
1898
  }
1872
1899
  const sheetsBar = this.spreadsheetService.spreadsheet.view.sheetsbar;
1873
1900
  sheetsBar.onSheetReorderEnd({ oldIndex, newIndex });
1901
+ this.selectSheet(sheetInfo.text);
1874
1902
  this.notifySheetsChange();
1875
1903
  },
1876
1904
  hide: (sheet) => {
@@ -2025,7 +2053,7 @@ class SheetsBarComponent {
2025
2053
  const newSheets = this.spreadsheetService.spreadsheet.sheets();
2026
2054
  const sheetDesc = mapToSheetDescriptor(newSheets);
2027
2055
  this.sheets = sheetDesc
2028
- .flatMap((item, index, items) => item.state === 'visible' ? [Object.assign(Object.assign({}, item), { state: item.state || 'visible', inEdit: false, first: index === 0, last: index === items.length - 1, text: item.name, active: (item.name === this.activeSheet) || items.length === 1, index, sheetActions: getSheetActions(items, item)
2056
+ .flatMap((item, index, items) => item.state === 'visible' ? [Object.assign(Object.assign({}, item), { inEdit: false, first: index === 0, last: index === items.length - 1, text: item.name, active: (item.name === this.activeSheet) || items.length === 1, index, sheetActions: getSheetActions(items, item)
2029
2057
  .map(item => (Object.assign(Object.assign({}, item), { text: this.messageFor(item.messageKey) }))) })] : []);
2030
2058
  this.sheetsMenuList = (_a = this.sheets) === null || _a === void 0 ? void 0 : _a.map(sheet => ({
2031
2059
  text: sheet.text,
@@ -3192,6 +3220,13 @@ class SpreadsheetComponent {
3192
3220
  * @default false
3193
3221
  */
3194
3222
  this.overflow = false;
3223
+ /**
3224
+ * Sets the height of the formula list container.
3225
+ * Accepts same values as the CSS [`style.height`](https://developer.mozilla.org/en-US/docs/Web/CSS/height) property.
3226
+ *
3227
+ * @default '300px'
3228
+ */
3229
+ this.formulaListMaxHeight = '300px';
3195
3230
  /**
3196
3231
  * The number of columns in the document.
3197
3232
  *
@@ -3707,7 +3742,7 @@ class SpreadsheetComponent {
3707
3742
  }
3708
3743
  }
3709
3744
  SpreadsheetComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: SpreadsheetComponent, deps: [{ token: i0.NgZone }, { token: i1$4.IntlService }, { token: i0.ElementRef }, { token: i2.LocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }, { token: ErrorHandlingService }, { token: i1$1.DialogService }], target: i0.ɵɵFactoryTarget.Component });
3710
- SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: SpreadsheetComponent, selector: "kendo-spreadsheet", inputs: { menuItems: "menuItems", overflow: "overflow", activeSheet: "activeSheet", sheets: "sheets", columns: "columns", columnWidth: "columnWidth", defaultCellStyle: "defaultCellStyle", headerHeight: "headerHeight", headerWidth: "headerWidth", rowHeight: "rowHeight", rows: "rows", images: "images", excel: "excel" }, outputs: { change: "change", formatChange: "formatChange", selectionChange: "selectionChange", excelExport: "excelExport", excelImport: "excelImport", activeSheetChange: "activeSheetChange" }, host: { properties: { "class.k-spreadsheet": "this.hostClass", "attr.role": "this.role" } }, providers: [
3745
+ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: SpreadsheetComponent, selector: "kendo-spreadsheet", inputs: { menuItems: "menuItems", overflow: "overflow", formulaListMaxHeight: "formulaListMaxHeight", activeSheet: "activeSheet", sheets: "sheets", columns: "columns", columnWidth: "columnWidth", defaultCellStyle: "defaultCellStyle", headerHeight: "headerHeight", headerWidth: "headerWidth", rowHeight: "rowHeight", rows: "rows", images: "images", excel: "excel" }, outputs: { change: "change", formatChange: "formatChange", selectionChange: "selectionChange", excelExport: "excelExport", excelImport: "excelImport", activeSheetChange: "activeSheetChange" }, host: { properties: { "class.k-spreadsheet": "this.hostClass", "attr.role": "this.role" } }, providers: [
3711
3746
  SpreadsheetLocalizationService,
3712
3747
  {
3713
3748
  provide: LocalizationService,
@@ -3955,7 +3990,11 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
3955
3990
  [svgIcon]="formulaFxIcon">
3956
3991
  </kendo-icon-wrapper>
3957
3992
  <span class="k-separator k-separator-vertical"></span>
3958
- <div #formulaBar kendoSpreadsheetFormulaInput class="k-textbox k-input k-input-md k-input-flat k-rounded-md"></div>
3993
+ <div
3994
+ #formulaBar
3995
+ kendoSpreadsheetFormulaInput
3996
+ [formulaListMaxHeight]="formulaListMaxHeight"
3997
+ class="k-textbox k-input k-input-md k-input-flat k-rounded-md"></div>
3959
3998
  </div>
3960
3999
  </div>
3961
4000
  <div class="k-spreadsheet-view">
@@ -3979,7 +4018,7 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
3979
4018
  (select)="onContextMenuSelect($event)"></kendo-contextmenu>
3980
4019
 
3981
4020
  <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
3982
- `, isInline: true, components: [{ type: i7$1.MenuComponent, selector: "kendo-menu", inputs: ["menuItemTemplate", "ariaRole", "menuItemLinkTemplate"], outputs: ["select", "open", "close"], exportAs: ["kendoMenu"] }, { type: i7$1.MenuItemComponent, selector: "kendo-menu-item", inputs: ["text", "url", "disabled", "cssClass", "cssStyle", "icon", "svgIcon", "data", "separator"] }, { type: i1$2.ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "tabindex", "size", "tabIndex"], outputs: ["open", "close"], exportAs: ["kendoToolBar"] }, { type: SpreadsheetLoadFileComponent, selector: "kendo-spreadsheet-load-file-tool" }, { type: i1$2.ToolBarButtonComponent, selector: "kendo-toolbar-button", inputs: ["showText", "showIcon", "text", "style", "className", "title", "disabled", "toggleable", "look", "togglable", "selected", "fillMode", "themeColor", "icon", "iconClass", "svgIcon", "imageUrl"], outputs: ["click", "pointerdown", "selectedChange"], exportAs: ["kendoToolBarButton"] }, { type: i1$2.ToolBarButtonGroupComponent, selector: "kendo-toolbar-buttongroup", inputs: ["disabled", "selection", "width", "look"], exportAs: ["kendoToolBarButtonGroup"] }, { type: i1$2.ToolBarSeparatorComponent, selector: "kendo-toolbar-separator", exportAs: ["kendoToolBarSeparator"] }, { type: SpreadsheetFontFamilyComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontFamily]" }, { type: SpreadsheetFontSizeComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontSize]" }, { type: SpreadsheetForeColorComponent, selector: "kendo-spreadsheet-forecolor-tool" }, { type: SpreadsheetBackColorComponent, selector: "kendo-spreadsheet-backcolor-tool" }, { type: i1$2.ToolBarDropDownButtonComponent, selector: "kendo-toolbar-dropdownbutton", inputs: ["arrowIcon", "title", "showText", "showIcon", "text", "icon", "svgIcon", "iconClass", "imageUrl", "popupSettings", "look", "primary", "fillMode", "themeColor", "buttonClass", "textField", "disabled", "data"], outputs: ["itemClick", "open", "close"], exportAs: ["kendoToolBarDropDownButton"] }, { type: NameBoxComponent, selector: "[kendoSpreadsheetNameBox]", inputs: ["data", "spreadsheetWidget"] }, { type: i6.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { type: SheetsBarComponent, selector: "[kendoSpreadsheetSheetsBar]", inputs: ["sheets", "sheetDescriptors"] }, { type: i7$1.ContextMenuComponent, selector: "kendo-contextmenu", inputs: ["showOn", "target", "filter", "alignToAnchor", "vertical", "popupAnimate", "popupAlign", "anchorAlign", "collision", "appendTo", "ariaLabel"], outputs: ["popupOpen", "popupClose", "select", "open", "close"], exportAs: ["kendoContextMenu"] }, { type: i3.WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }], directives: [{ type: LocalizedMessagesDirective, selector: "[kendoSpreadsheetLocalizedMessages]" }, { type: MainMenuDirective, selector: "[kendoSpreadsheetMenu]" }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: SpreadsheetSaveFileDirective, selector: "[kendoSpreadsheetSaveFile]" }, { type: SpreadsheetUndoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUndo]" }, { type: SpreadsheetRedoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetRedo]" }, { type: SpreadsheetIncreaseFontSizeDirective, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseFontSize]" }, { type: SpreadsheetDecreaseFontSizeDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseFontSize]" }, { type: SpreadsheetBoldDirective, selector: "kendo-toolbar-button[kendoSpreadsheetBold]" }, { type: SpreadsheetItalicDirective, selector: "kendo-toolbar-button[kendoSpreadsheetItalic]" }, { type: SpreadsheetUnderlineDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUnderline]" }, { type: SpreadsheetHorizontalTextAlignDirective, selector: "[kendoSpreadsheetHorizontalTextAlign]" }, { type: SpreadsheetVerticalTextAlignDirective, selector: "[kendoSpreadsheetVerticalTextAlign]" }, { type: SpreadsheetTextWrapDirective, selector: "kendo-toolbar-button[kendoSpreadsheetTextWrap]" }, { type: SpreadsheetFormatDirective, selector: "[kendoSpreadsheetFormat]" }, { type: SpreadsheetInsertLinkDirective, selector: "kendo-toolbar-button[kendoSpreadsheetInsertLink]" }, { type: SpreadsheetAddColumnLeftButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnLeftButton]" }, { type: SpreadsheetAddColumnRightButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnRightButton]" }, { type: SpreadsheetAddRowBelowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowBelowButton]" }, { type: SpreadsheetAddRowAboveButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowAboveButton]" }, { type: SpreadsheetDeleteColumnButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteColumnButton]" }, { type: SpreadsheetDeleteRowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteRowButton]" }, { type: SpreadsheetDecreaseDecimalDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseDecimal]" }, { type: SpreadsheetIncreaseDecimalDirective, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseDecimal]" }, { type: SpreadsheetMergeDirective, selector: "[kendoSpreadsheetMerge]" }, { type: SpreadsheetGridLinesDirective, selector: "kendo-toolbar-button[kendoSpreadsheetGridLines]" }, { type: FormulaInputDirective, selector: "[kendoSpreadsheetFormulaInput]" }] });
4021
+ `, isInline: true, components: [{ type: i7$1.MenuComponent, selector: "kendo-menu", inputs: ["menuItemTemplate", "ariaRole", "menuItemLinkTemplate"], outputs: ["select", "open", "close"], exportAs: ["kendoMenu"] }, { type: i7$1.MenuItemComponent, selector: "kendo-menu-item", inputs: ["text", "url", "disabled", "cssClass", "cssStyle", "icon", "svgIcon", "data", "separator"] }, { type: i1$2.ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "tabindex", "size", "tabIndex"], outputs: ["open", "close"], exportAs: ["kendoToolBar"] }, { type: SpreadsheetLoadFileComponent, selector: "kendo-spreadsheet-load-file-tool" }, { type: i1$2.ToolBarButtonComponent, selector: "kendo-toolbar-button", inputs: ["showText", "showIcon", "text", "style", "className", "title", "disabled", "toggleable", "look", "togglable", "selected", "fillMode", "themeColor", "icon", "iconClass", "svgIcon", "imageUrl"], outputs: ["click", "pointerdown", "selectedChange"], exportAs: ["kendoToolBarButton"] }, { type: i1$2.ToolBarButtonGroupComponent, selector: "kendo-toolbar-buttongroup", inputs: ["disabled", "selection", "width", "look"], exportAs: ["kendoToolBarButtonGroup"] }, { type: i1$2.ToolBarSeparatorComponent, selector: "kendo-toolbar-separator", exportAs: ["kendoToolBarSeparator"] }, { type: SpreadsheetFontFamilyComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontFamily]" }, { type: SpreadsheetFontSizeComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontSize]" }, { type: SpreadsheetForeColorComponent, selector: "kendo-spreadsheet-forecolor-tool" }, { type: SpreadsheetBackColorComponent, selector: "kendo-spreadsheet-backcolor-tool" }, { type: i1$2.ToolBarDropDownButtonComponent, selector: "kendo-toolbar-dropdownbutton", inputs: ["arrowIcon", "title", "showText", "showIcon", "text", "icon", "svgIcon", "iconClass", "imageUrl", "popupSettings", "look", "primary", "fillMode", "themeColor", "buttonClass", "textField", "disabled", "data"], outputs: ["itemClick", "open", "close"], exportAs: ["kendoToolBarDropDownButton"] }, { type: NameBoxComponent, selector: "[kendoSpreadsheetNameBox]", inputs: ["data", "spreadsheetWidget"] }, { type: i6.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { type: SheetsBarComponent, selector: "[kendoSpreadsheetSheetsBar]", inputs: ["sheets", "sheetDescriptors"] }, { type: i7$1.ContextMenuComponent, selector: "kendo-contextmenu", inputs: ["showOn", "target", "filter", "alignToAnchor", "vertical", "popupAnimate", "popupAlign", "anchorAlign", "collision", "appendTo", "ariaLabel"], outputs: ["popupOpen", "popupClose", "select", "open", "close"], exportAs: ["kendoContextMenu"] }, { type: i3.WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }], directives: [{ type: LocalizedMessagesDirective, selector: "[kendoSpreadsheetLocalizedMessages]" }, { type: MainMenuDirective, selector: "[kendoSpreadsheetMenu]" }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: SpreadsheetSaveFileDirective, selector: "[kendoSpreadsheetSaveFile]" }, { type: SpreadsheetUndoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUndo]" }, { type: SpreadsheetRedoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetRedo]" }, { type: SpreadsheetIncreaseFontSizeDirective, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseFontSize]" }, { type: SpreadsheetDecreaseFontSizeDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseFontSize]" }, { type: SpreadsheetBoldDirective, selector: "kendo-toolbar-button[kendoSpreadsheetBold]" }, { type: SpreadsheetItalicDirective, selector: "kendo-toolbar-button[kendoSpreadsheetItalic]" }, { type: SpreadsheetUnderlineDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUnderline]" }, { type: SpreadsheetHorizontalTextAlignDirective, selector: "[kendoSpreadsheetHorizontalTextAlign]" }, { type: SpreadsheetVerticalTextAlignDirective, selector: "[kendoSpreadsheetVerticalTextAlign]" }, { type: SpreadsheetTextWrapDirective, selector: "kendo-toolbar-button[kendoSpreadsheetTextWrap]" }, { type: SpreadsheetFormatDirective, selector: "[kendoSpreadsheetFormat]" }, { type: SpreadsheetInsertLinkDirective, selector: "kendo-toolbar-button[kendoSpreadsheetInsertLink]" }, { type: SpreadsheetAddColumnLeftButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnLeftButton]" }, { type: SpreadsheetAddColumnRightButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnRightButton]" }, { type: SpreadsheetAddRowBelowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowBelowButton]" }, { type: SpreadsheetAddRowAboveButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowAboveButton]" }, { type: SpreadsheetDeleteColumnButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteColumnButton]" }, { type: SpreadsheetDeleteRowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteRowButton]" }, { type: SpreadsheetDecreaseDecimalDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseDecimal]" }, { type: SpreadsheetIncreaseDecimalDirective, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseDecimal]" }, { type: SpreadsheetMergeDirective, selector: "[kendoSpreadsheetMerge]" }, { type: SpreadsheetGridLinesDirective, selector: "kendo-toolbar-button[kendoSpreadsheetGridLines]" }, { type: FormulaInputDirective, selector: "[kendoSpreadsheetFormulaInput]", inputs: ["formulaListMaxHeight"] }] });
3983
4022
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: SpreadsheetComponent, decorators: [{
3984
4023
  type: Component,
3985
4024
  args: [{
@@ -4234,7 +4273,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
4234
4273
  [svgIcon]="formulaFxIcon">
4235
4274
  </kendo-icon-wrapper>
4236
4275
  <span class="k-separator k-separator-vertical"></span>
4237
- <div #formulaBar kendoSpreadsheetFormulaInput class="k-textbox k-input k-input-md k-input-flat k-rounded-md"></div>
4276
+ <div
4277
+ #formulaBar
4278
+ kendoSpreadsheetFormulaInput
4279
+ [formulaListMaxHeight]="formulaListMaxHeight"
4280
+ class="k-textbox k-input k-input-md k-input-flat k-rounded-md"></div>
4238
4281
  </div>
4239
4282
  </div>
4240
4283
  <div class="k-spreadsheet-view">
@@ -4285,6 +4328,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
4285
4328
  type: Input
4286
4329
  }], overflow: [{
4287
4330
  type: Input
4331
+ }], formulaListMaxHeight: [{
4332
+ type: Input
4288
4333
  }], activeSheet: [{
4289
4334
  type: Input
4290
4335
  }], sheets: [{
@@ -47,8 +47,8 @@ const packageMetadata = {
47
47
  name: '@progress/kendo-angular-spreadsheet',
48
48
  productName: 'Kendo UI for Angular',
49
49
  productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
50
- publishDate: 1701781986,
51
- version: '14.3.0-develop.5',
50
+ publishDate: 1701794125,
51
+ version: '14.3.0-develop.7',
52
52
  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',
53
53
  };
54
54
 
@@ -211,10 +211,12 @@ class FormulaListComponent {
211
211
  }
212
212
  }
213
213
  FormulaListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormulaListComponent, deps: [{ token: i0.ElementRef }, { token: SpreadsheetService }], target: i0.ɵɵFactoryTarget.Component });
214
- FormulaListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: FormulaListComponent, selector: "kendo-spreadsheet-formula-list", inputs: { data: "data", itemClick: "itemClick" }, host: { properties: { "attr.id": "this.id" } }, ngImport: i0, template: `
214
+ FormulaListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: FormulaListComponent, selector: "kendo-spreadsheet-formula-list", inputs: { maxHeight: "maxHeight", data: "data", itemClick: "itemClick" }, host: { properties: { "attr.id": "this.id" } }, ngImport: i0, template: `
215
215
  <ul #ulRef
216
216
  class="k-spreadsheet-formula-list k-list-ul k-list-md k-group k-reset"
217
217
  role="menu"
218
+ [style.overflowY]="'auto'"
219
+ [style.maxHeight]="maxHeight"
218
220
  [kendoEventsOutsideAngular]="{mousedown: handleMouseDown}">
219
221
  <li *ngFor="let item of data"
220
222
  (click)="itemClick(item.text)"
@@ -236,6 +238,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
236
238
  <ul #ulRef
237
239
  class="k-spreadsheet-formula-list k-list-ul k-list-md k-group k-reset"
238
240
  role="menu"
241
+ [style.overflowY]="'auto'"
242
+ [style.maxHeight]="maxHeight"
239
243
  [kendoEventsOutsideAngular]="{mousedown: handleMouseDown}">
240
244
  <li *ngFor="let item of data"
241
245
  (click)="itemClick(item.text)"
@@ -253,6 +257,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
253
257
  }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: SpreadsheetService }]; }, propDecorators: { id: [{
254
258
  type: HostBinding,
255
259
  args: ['attr.id']
260
+ }], maxHeight: [{
261
+ type: Input
256
262
  }], data: [{
257
263
  type: Input
258
264
  }], itemClick: [{
@@ -294,6 +300,23 @@ class FormulaInputDirective {
294
300
  }
295
301
  if (next) {
296
302
  next.classList.add('k-focus');
303
+ const { offsetTop, offsetHeight, parentElement } = next;
304
+ if (dir > 0) {
305
+ if (offsetTop + offsetHeight >= parentElement.offsetHeight + parentElement.scrollTop) {
306
+ parentElement.scrollTop = Math.min(parentElement.scrollTop + offsetHeight, parentElement.scrollHeight - parentElement.offsetHeight);
307
+ }
308
+ if (next === items[0]) {
309
+ next.scrollIntoView();
310
+ }
311
+ }
312
+ else {
313
+ if (offsetTop <= parentElement.scrollTop) {
314
+ parentElement.scrollTop = Math.max(parentElement.scrollTop - offsetHeight, 0);
315
+ }
316
+ if (next === items[items.length - 1]) {
317
+ next.scrollIntoView();
318
+ }
319
+ }
297
320
  }
298
321
  };
299
322
  }
@@ -358,6 +381,7 @@ class FormulaInputDirective {
358
381
  this.list = list;
359
382
  list.data = this.data;
360
383
  list.itemClick = this.handler;
384
+ list.maxHeight = this.formulaListMaxHeight;
361
385
  this.ariaExpanded = 'true';
362
386
  },
363
387
  close: () => {
@@ -376,7 +400,7 @@ class FormulaInputDirective {
376
400
  }
377
401
  }
378
402
  FormulaInputDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormulaInputDirective, deps: [{ token: i0.ElementRef }, { token: i1.PopupService }, { token: SpreadsheetService }, { token: SpreadsheetLocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
379
- FormulaInputDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: FormulaInputDirective, selector: "[kendoSpreadsheetFormulaInput]", host: { properties: { "class.k-spreadsheet-formula-input": "this.hostClasses", "attr.title": "this.title", "attr.role": "this.role", "attr.aria-haspopup": "this.ariaHasPopup", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-controls": "this.ariaControls" } }, ngImport: i0 });
403
+ FormulaInputDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: FormulaInputDirective, selector: "[kendoSpreadsheetFormulaInput]", inputs: { formulaListMaxHeight: "formulaListMaxHeight" }, host: { properties: { "class.k-spreadsheet-formula-input": "this.hostClasses", "attr.title": "this.title", "attr.role": "this.role", "attr.aria-haspopup": "this.ariaHasPopup", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-controls": "this.ariaControls" } }, ngImport: i0 });
380
404
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormulaInputDirective, decorators: [{
381
405
  type: Directive,
382
406
  args: [{
@@ -400,6 +424,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
400
424
  }], ariaControls: [{
401
425
  type: HostBinding,
402
426
  args: ['attr.aria-controls']
427
+ }], formulaListMaxHeight: [{
428
+ type: Input
403
429
  }] } });
404
430
 
405
431
  /**
@@ -1826,23 +1852,24 @@ class SheetsBarComponent {
1826
1852
  const isMoveRight = itemKey === 'sheetMoveRight';
1827
1853
  let oldIndex = -1;
1828
1854
  let newIndex = -1;
1855
+ const sheets = this.spreadsheetService.spreadsheet.sheets();
1829
1856
  if (isMoveRight) {
1830
- for (let i = 0; i < this.sheets.length; i++) {
1831
- if (this.sheets[i].text === sheetInfo.text) {
1857
+ for (let i = 0; i < sheets.length; i++) {
1858
+ if (sheets[i].name() === sheetInfo.text) {
1832
1859
  oldIndex = i;
1833
1860
  }
1834
- if (oldIndex > -1 && i > oldIndex && this.sheets[i].state === 'visible') {
1861
+ if (oldIndex > -1 && i > oldIndex && sheets[i]._state() === 'visible') {
1835
1862
  newIndex = i;
1836
1863
  break;
1837
1864
  }
1838
1865
  }
1839
1866
  }
1840
1867
  else {
1841
- for (let i = this.sheets.length - 1; i >= 0; i--) {
1842
- if (this.sheets[i].text === sheetInfo.text) {
1868
+ for (let i = sheets.length - 1; i >= 0; i--) {
1869
+ if (sheets[i].name() === sheetInfo.text) {
1843
1870
  oldIndex = i;
1844
1871
  }
1845
- if (oldIndex > -1 && i < oldIndex && this.sheets[i].state === 'visible') {
1872
+ if (oldIndex > -1 && (i < oldIndex) && sheets[i]._state() === 'visible') {
1846
1873
  newIndex = i;
1847
1874
  break;
1848
1875
  }
@@ -1850,6 +1877,7 @@ class SheetsBarComponent {
1850
1877
  }
1851
1878
  const sheetsBar = this.spreadsheetService.spreadsheet.view.sheetsbar;
1852
1879
  sheetsBar.onSheetReorderEnd({ oldIndex, newIndex });
1880
+ this.selectSheet(sheetInfo.text);
1853
1881
  this.notifySheetsChange();
1854
1882
  },
1855
1883
  hide: (sheet) => {
@@ -2006,7 +2034,6 @@ class SheetsBarComponent {
2006
2034
  this.sheets = sheetDesc
2007
2035
  .flatMap((item, index, items) => item.state === 'visible' ? [{
2008
2036
  ...item,
2009
- state: item.state || 'visible',
2010
2037
  inEdit: false,
2011
2038
  first: index === 0,
2012
2039
  last: index === items.length - 1,
@@ -3181,6 +3208,13 @@ class SpreadsheetComponent {
3181
3208
  * @default false
3182
3209
  */
3183
3210
  this.overflow = false;
3211
+ /**
3212
+ * Sets the height of the formula list container.
3213
+ * Accepts same values as the CSS [`style.height`](https://developer.mozilla.org/en-US/docs/Web/CSS/height) property.
3214
+ *
3215
+ * @default '300px'
3216
+ */
3217
+ this.formulaListMaxHeight = '300px';
3184
3218
  /**
3185
3219
  * The number of columns in the document.
3186
3220
  *
@@ -3721,7 +3755,7 @@ class SpreadsheetComponent {
3721
3755
  }
3722
3756
  }
3723
3757
  SpreadsheetComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: SpreadsheetComponent, deps: [{ token: i0.NgZone }, { token: i1$4.IntlService }, { token: i0.ElementRef }, { token: i2.LocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }, { token: ErrorHandlingService }, { token: i1$1.DialogService }], target: i0.ɵɵFactoryTarget.Component });
3724
- SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: SpreadsheetComponent, selector: "kendo-spreadsheet", inputs: { menuItems: "menuItems", overflow: "overflow", activeSheet: "activeSheet", sheets: "sheets", columns: "columns", columnWidth: "columnWidth", defaultCellStyle: "defaultCellStyle", headerHeight: "headerHeight", headerWidth: "headerWidth", rowHeight: "rowHeight", rows: "rows", images: "images", excel: "excel" }, outputs: { change: "change", formatChange: "formatChange", selectionChange: "selectionChange", excelExport: "excelExport", excelImport: "excelImport", activeSheetChange: "activeSheetChange" }, host: { properties: { "class.k-spreadsheet": "this.hostClass", "attr.role": "this.role" } }, providers: [
3758
+ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: SpreadsheetComponent, selector: "kendo-spreadsheet", inputs: { menuItems: "menuItems", overflow: "overflow", formulaListMaxHeight: "formulaListMaxHeight", activeSheet: "activeSheet", sheets: "sheets", columns: "columns", columnWidth: "columnWidth", defaultCellStyle: "defaultCellStyle", headerHeight: "headerHeight", headerWidth: "headerWidth", rowHeight: "rowHeight", rows: "rows", images: "images", excel: "excel" }, outputs: { change: "change", formatChange: "formatChange", selectionChange: "selectionChange", excelExport: "excelExport", excelImport: "excelImport", activeSheetChange: "activeSheetChange" }, host: { properties: { "class.k-spreadsheet": "this.hostClass", "attr.role": "this.role" } }, providers: [
3725
3759
  SpreadsheetLocalizationService,
3726
3760
  {
3727
3761
  provide: LocalizationService,
@@ -3969,7 +4003,11 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
3969
4003
  [svgIcon]="formulaFxIcon">
3970
4004
  </kendo-icon-wrapper>
3971
4005
  <span class="k-separator k-separator-vertical"></span>
3972
- <div #formulaBar kendoSpreadsheetFormulaInput class="k-textbox k-input k-input-md k-input-flat k-rounded-md"></div>
4006
+ <div
4007
+ #formulaBar
4008
+ kendoSpreadsheetFormulaInput
4009
+ [formulaListMaxHeight]="formulaListMaxHeight"
4010
+ class="k-textbox k-input k-input-md k-input-flat k-rounded-md"></div>
3973
4011
  </div>
3974
4012
  </div>
3975
4013
  <div class="k-spreadsheet-view">
@@ -3993,7 +4031,7 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
3993
4031
  (select)="onContextMenuSelect($event)"></kendo-contextmenu>
3994
4032
 
3995
4033
  <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
3996
- `, isInline: true, components: [{ type: i7$1.MenuComponent, selector: "kendo-menu", inputs: ["menuItemTemplate", "ariaRole", "menuItemLinkTemplate"], outputs: ["select", "open", "close"], exportAs: ["kendoMenu"] }, { type: i7$1.MenuItemComponent, selector: "kendo-menu-item", inputs: ["text", "url", "disabled", "cssClass", "cssStyle", "icon", "svgIcon", "data", "separator"] }, { type: i1$2.ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "tabindex", "size", "tabIndex"], outputs: ["open", "close"], exportAs: ["kendoToolBar"] }, { type: SpreadsheetLoadFileComponent, selector: "kendo-spreadsheet-load-file-tool" }, { type: i1$2.ToolBarButtonComponent, selector: "kendo-toolbar-button", inputs: ["showText", "showIcon", "text", "style", "className", "title", "disabled", "toggleable", "look", "togglable", "selected", "fillMode", "themeColor", "icon", "iconClass", "svgIcon", "imageUrl"], outputs: ["click", "pointerdown", "selectedChange"], exportAs: ["kendoToolBarButton"] }, { type: i1$2.ToolBarButtonGroupComponent, selector: "kendo-toolbar-buttongroup", inputs: ["disabled", "selection", "width", "look"], exportAs: ["kendoToolBarButtonGroup"] }, { type: i1$2.ToolBarSeparatorComponent, selector: "kendo-toolbar-separator", exportAs: ["kendoToolBarSeparator"] }, { type: SpreadsheetFontFamilyComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontFamily]" }, { type: SpreadsheetFontSizeComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontSize]" }, { type: SpreadsheetForeColorComponent, selector: "kendo-spreadsheet-forecolor-tool" }, { type: SpreadsheetBackColorComponent, selector: "kendo-spreadsheet-backcolor-tool" }, { type: i1$2.ToolBarDropDownButtonComponent, selector: "kendo-toolbar-dropdownbutton", inputs: ["arrowIcon", "title", "showText", "showIcon", "text", "icon", "svgIcon", "iconClass", "imageUrl", "popupSettings", "look", "primary", "fillMode", "themeColor", "buttonClass", "textField", "disabled", "data"], outputs: ["itemClick", "open", "close"], exportAs: ["kendoToolBarDropDownButton"] }, { type: NameBoxComponent, selector: "[kendoSpreadsheetNameBox]", inputs: ["data", "spreadsheetWidget"] }, { type: i6.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { type: SheetsBarComponent, selector: "[kendoSpreadsheetSheetsBar]", inputs: ["sheets", "sheetDescriptors"] }, { type: i7$1.ContextMenuComponent, selector: "kendo-contextmenu", inputs: ["showOn", "target", "filter", "alignToAnchor", "vertical", "popupAnimate", "popupAlign", "anchorAlign", "collision", "appendTo", "ariaLabel"], outputs: ["popupOpen", "popupClose", "select", "open", "close"], exportAs: ["kendoContextMenu"] }, { type: i3.WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }], directives: [{ type: LocalizedMessagesDirective, selector: "[kendoSpreadsheetLocalizedMessages]" }, { type: MainMenuDirective, selector: "[kendoSpreadsheetMenu]" }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: SpreadsheetSaveFileDirective, selector: "[kendoSpreadsheetSaveFile]" }, { type: SpreadsheetUndoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUndo]" }, { type: SpreadsheetRedoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetRedo]" }, { type: SpreadsheetIncreaseFontSizeDirective, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseFontSize]" }, { type: SpreadsheetDecreaseFontSizeDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseFontSize]" }, { type: SpreadsheetBoldDirective, selector: "kendo-toolbar-button[kendoSpreadsheetBold]" }, { type: SpreadsheetItalicDirective, selector: "kendo-toolbar-button[kendoSpreadsheetItalic]" }, { type: SpreadsheetUnderlineDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUnderline]" }, { type: SpreadsheetHorizontalTextAlignDirective, selector: "[kendoSpreadsheetHorizontalTextAlign]" }, { type: SpreadsheetVerticalTextAlignDirective, selector: "[kendoSpreadsheetVerticalTextAlign]" }, { type: SpreadsheetTextWrapDirective, selector: "kendo-toolbar-button[kendoSpreadsheetTextWrap]" }, { type: SpreadsheetFormatDirective, selector: "[kendoSpreadsheetFormat]" }, { type: SpreadsheetInsertLinkDirective, selector: "kendo-toolbar-button[kendoSpreadsheetInsertLink]" }, { type: SpreadsheetAddColumnLeftButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnLeftButton]" }, { type: SpreadsheetAddColumnRightButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnRightButton]" }, { type: SpreadsheetAddRowBelowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowBelowButton]" }, { type: SpreadsheetAddRowAboveButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowAboveButton]" }, { type: SpreadsheetDeleteColumnButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteColumnButton]" }, { type: SpreadsheetDeleteRowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteRowButton]" }, { type: SpreadsheetDecreaseDecimalDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseDecimal]" }, { type: SpreadsheetIncreaseDecimalDirective, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseDecimal]" }, { type: SpreadsheetMergeDirective, selector: "[kendoSpreadsheetMerge]" }, { type: SpreadsheetGridLinesDirective, selector: "kendo-toolbar-button[kendoSpreadsheetGridLines]" }, { type: FormulaInputDirective, selector: "[kendoSpreadsheetFormulaInput]" }] });
4034
+ `, isInline: true, components: [{ type: i7$1.MenuComponent, selector: "kendo-menu", inputs: ["menuItemTemplate", "ariaRole", "menuItemLinkTemplate"], outputs: ["select", "open", "close"], exportAs: ["kendoMenu"] }, { type: i7$1.MenuItemComponent, selector: "kendo-menu-item", inputs: ["text", "url", "disabled", "cssClass", "cssStyle", "icon", "svgIcon", "data", "separator"] }, { type: i1$2.ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "tabindex", "size", "tabIndex"], outputs: ["open", "close"], exportAs: ["kendoToolBar"] }, { type: SpreadsheetLoadFileComponent, selector: "kendo-spreadsheet-load-file-tool" }, { type: i1$2.ToolBarButtonComponent, selector: "kendo-toolbar-button", inputs: ["showText", "showIcon", "text", "style", "className", "title", "disabled", "toggleable", "look", "togglable", "selected", "fillMode", "themeColor", "icon", "iconClass", "svgIcon", "imageUrl"], outputs: ["click", "pointerdown", "selectedChange"], exportAs: ["kendoToolBarButton"] }, { type: i1$2.ToolBarButtonGroupComponent, selector: "kendo-toolbar-buttongroup", inputs: ["disabled", "selection", "width", "look"], exportAs: ["kendoToolBarButtonGroup"] }, { type: i1$2.ToolBarSeparatorComponent, selector: "kendo-toolbar-separator", exportAs: ["kendoToolBarSeparator"] }, { type: SpreadsheetFontFamilyComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontFamily]" }, { type: SpreadsheetFontSizeComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontSize]" }, { type: SpreadsheetForeColorComponent, selector: "kendo-spreadsheet-forecolor-tool" }, { type: SpreadsheetBackColorComponent, selector: "kendo-spreadsheet-backcolor-tool" }, { type: i1$2.ToolBarDropDownButtonComponent, selector: "kendo-toolbar-dropdownbutton", inputs: ["arrowIcon", "title", "showText", "showIcon", "text", "icon", "svgIcon", "iconClass", "imageUrl", "popupSettings", "look", "primary", "fillMode", "themeColor", "buttonClass", "textField", "disabled", "data"], outputs: ["itemClick", "open", "close"], exportAs: ["kendoToolBarDropDownButton"] }, { type: NameBoxComponent, selector: "[kendoSpreadsheetNameBox]", inputs: ["data", "spreadsheetWidget"] }, { type: i6.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { type: SheetsBarComponent, selector: "[kendoSpreadsheetSheetsBar]", inputs: ["sheets", "sheetDescriptors"] }, { type: i7$1.ContextMenuComponent, selector: "kendo-contextmenu", inputs: ["showOn", "target", "filter", "alignToAnchor", "vertical", "popupAnimate", "popupAlign", "anchorAlign", "collision", "appendTo", "ariaLabel"], outputs: ["popupOpen", "popupClose", "select", "open", "close"], exportAs: ["kendoContextMenu"] }, { type: i3.WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }], directives: [{ type: LocalizedMessagesDirective, selector: "[kendoSpreadsheetLocalizedMessages]" }, { type: MainMenuDirective, selector: "[kendoSpreadsheetMenu]" }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: SpreadsheetSaveFileDirective, selector: "[kendoSpreadsheetSaveFile]" }, { type: SpreadsheetUndoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUndo]" }, { type: SpreadsheetRedoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetRedo]" }, { type: SpreadsheetIncreaseFontSizeDirective, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseFontSize]" }, { type: SpreadsheetDecreaseFontSizeDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseFontSize]" }, { type: SpreadsheetBoldDirective, selector: "kendo-toolbar-button[kendoSpreadsheetBold]" }, { type: SpreadsheetItalicDirective, selector: "kendo-toolbar-button[kendoSpreadsheetItalic]" }, { type: SpreadsheetUnderlineDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUnderline]" }, { type: SpreadsheetHorizontalTextAlignDirective, selector: "[kendoSpreadsheetHorizontalTextAlign]" }, { type: SpreadsheetVerticalTextAlignDirective, selector: "[kendoSpreadsheetVerticalTextAlign]" }, { type: SpreadsheetTextWrapDirective, selector: "kendo-toolbar-button[kendoSpreadsheetTextWrap]" }, { type: SpreadsheetFormatDirective, selector: "[kendoSpreadsheetFormat]" }, { type: SpreadsheetInsertLinkDirective, selector: "kendo-toolbar-button[kendoSpreadsheetInsertLink]" }, { type: SpreadsheetAddColumnLeftButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnLeftButton]" }, { type: SpreadsheetAddColumnRightButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnRightButton]" }, { type: SpreadsheetAddRowBelowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowBelowButton]" }, { type: SpreadsheetAddRowAboveButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowAboveButton]" }, { type: SpreadsheetDeleteColumnButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteColumnButton]" }, { type: SpreadsheetDeleteRowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteRowButton]" }, { type: SpreadsheetDecreaseDecimalDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseDecimal]" }, { type: SpreadsheetIncreaseDecimalDirective, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseDecimal]" }, { type: SpreadsheetMergeDirective, selector: "[kendoSpreadsheetMerge]" }, { type: SpreadsheetGridLinesDirective, selector: "kendo-toolbar-button[kendoSpreadsheetGridLines]" }, { type: FormulaInputDirective, selector: "[kendoSpreadsheetFormulaInput]", inputs: ["formulaListMaxHeight"] }] });
3997
4035
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: SpreadsheetComponent, decorators: [{
3998
4036
  type: Component,
3999
4037
  args: [{
@@ -4248,7 +4286,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
4248
4286
  [svgIcon]="formulaFxIcon">
4249
4287
  </kendo-icon-wrapper>
4250
4288
  <span class="k-separator k-separator-vertical"></span>
4251
- <div #formulaBar kendoSpreadsheetFormulaInput class="k-textbox k-input k-input-md k-input-flat k-rounded-md"></div>
4289
+ <div
4290
+ #formulaBar
4291
+ kendoSpreadsheetFormulaInput
4292
+ [formulaListMaxHeight]="formulaListMaxHeight"
4293
+ class="k-textbox k-input k-input-md k-input-flat k-rounded-md"></div>
4252
4294
  </div>
4253
4295
  </div>
4254
4296
  <div class="k-spreadsheet-view">
@@ -4299,6 +4341,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
4299
4341
  type: Input
4300
4342
  }], overflow: [{
4301
4343
  type: Input
4344
+ }], formulaListMaxHeight: [{
4345
+ type: Input
4302
4346
  }], activeSheet: [{
4303
4347
  type: Input
4304
4348
  }], sheets: [{
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-angular-spreadsheet",
3
- "version": "14.3.0-develop.5",
3
+ "version": "14.3.0-develop.7",
4
4
  "description": "A Spreadsheet Component for Angular",
5
5
  "license": "SEE LICENSE IN LICENSE.md",
6
6
  "author": "Progress",
@@ -23,22 +23,22 @@
23
23
  "@angular/core": "13 - 17",
24
24
  "@angular/platform-browser": "13 - 17",
25
25
  "@progress/kendo-licensing": "^1.0.2",
26
- "@progress/kendo-angular-buttons": "14.3.0-develop.5",
27
- "@progress/kendo-angular-common": "14.3.0-develop.5",
28
- "@progress/kendo-angular-dialog": "14.3.0-develop.5",
29
- "@progress/kendo-angular-dropdowns": "14.3.0-develop.5",
30
- "@progress/kendo-angular-icons": "14.3.0-develop.5",
31
- "@progress/kendo-angular-l10n": "14.3.0-develop.5",
32
- "@progress/kendo-angular-layout": "14.3.0-develop.5",
33
- "@progress/kendo-angular-menu": "14.3.0-develop.5",
34
- "@progress/kendo-angular-popup": "14.3.0-develop.5",
35
- "@progress/kendo-angular-toolbar": "14.3.0-develop.5",
36
- "@progress/kendo-angular-intl": "14.3.0-develop.5",
26
+ "@progress/kendo-angular-buttons": "14.3.0-develop.7",
27
+ "@progress/kendo-angular-common": "14.3.0-develop.7",
28
+ "@progress/kendo-angular-dialog": "14.3.0-develop.7",
29
+ "@progress/kendo-angular-dropdowns": "14.3.0-develop.7",
30
+ "@progress/kendo-angular-icons": "14.3.0-develop.7",
31
+ "@progress/kendo-angular-l10n": "14.3.0-develop.7",
32
+ "@progress/kendo-angular-layout": "14.3.0-develop.7",
33
+ "@progress/kendo-angular-menu": "14.3.0-develop.7",
34
+ "@progress/kendo-angular-popup": "14.3.0-develop.7",
35
+ "@progress/kendo-angular-toolbar": "14.3.0-develop.7",
36
+ "@progress/kendo-angular-intl": "14.3.0-develop.7",
37
37
  "rxjs": "^6.5.3 || ^7.0.0"
38
38
  },
39
39
  "dependencies": {
40
40
  "tslib": "^2.3.1",
41
- "@progress/kendo-angular-schematics": "14.3.0-develop.5",
41
+ "@progress/kendo-angular-schematics": "14.3.0-develop.7",
42
42
  "@progress/jszip-esm": "^1.0.3",
43
43
  "@progress/kendo-common": "^0.2.2",
44
44
  "@progress/kendo-date-math": "^1.5.10",
@@ -6,7 +6,7 @@ function default_1(options) {
6
6
  // Peer dependency of icons
7
7
  '@progress/kendo-svg-icons': '^2.0.0',
8
8
  // peer dep of the dropdowns
9
- '@progress/kendo-angular-treeview': '14.3.0-develop.5'
9
+ '@progress/kendo-angular-treeview': '14.3.0-develop.7'
10
10
  } });
11
11
  return (0, schematics_1.externalSchematic)('@progress/kendo-angular-schematics', 'ng-add', finalOptions);
12
12
  }
@@ -43,6 +43,13 @@ export declare class SpreadsheetComponent implements AfterViewInit, OnChanges {
43
43
  * @default false
44
44
  */
45
45
  overflow: boolean;
46
+ /**
47
+ * Sets the height of the formula list container.
48
+ * Accepts same values as the CSS [`style.height`](https://developer.mozilla.org/en-US/docs/Web/CSS/height) property.
49
+ *
50
+ * @default '300px'
51
+ */
52
+ formulaListMaxHeight: string;
46
53
  /**
47
54
  * The name of the currently active sheet. Must match one of the sheet names.
48
55
  */
@@ -184,5 +191,5 @@ export declare class SpreadsheetComponent implements AfterViewInit, OnChanges {
184
191
  private contextMenuItemsForTarget;
185
192
  private openLinkDialog;
186
193
  static ɵfac: i0.ɵɵFactoryDeclaration<SpreadsheetComponent, never>;
187
- static ɵcmp: i0.ɵɵComponentDeclaration<SpreadsheetComponent, "kendo-spreadsheet", ["kendo-spreadsheet"], { "menuItems": "menuItems"; "overflow": "overflow"; "activeSheet": "activeSheet"; "sheets": "sheets"; "columns": "columns"; "columnWidth": "columnWidth"; "defaultCellStyle": "defaultCellStyle"; "headerHeight": "headerHeight"; "headerWidth": "headerWidth"; "rowHeight": "rowHeight"; "rows": "rows"; "images": "images"; "excel": "excel"; }, { "change": "change"; "formatChange": "formatChange"; "selectionChange": "selectionChange"; "excelExport": "excelExport"; "excelImport": "excelImport"; "activeSheetChange": "activeSheetChange"; }, never, never>;
194
+ static ɵcmp: i0.ɵɵComponentDeclaration<SpreadsheetComponent, "kendo-spreadsheet", ["kendo-spreadsheet"], { "menuItems": "menuItems"; "overflow": "overflow"; "formulaListMaxHeight": "formulaListMaxHeight"; "activeSheet": "activeSheet"; "sheets": "sheets"; "columns": "columns"; "columnWidth": "columnWidth"; "defaultCellStyle": "defaultCellStyle"; "headerHeight": "headerHeight"; "headerWidth": "headerWidth"; "rowHeight": "rowHeight"; "rows": "rows"; "images": "images"; "excel": "excel"; }, { "change": "change"; "formatChange": "formatChange"; "selectionChange": "selectionChange"; "excelExport": "excelExport"; "excelImport": "excelImport"; "activeSheetChange": "activeSheetChange"; }, never, never>;
188
195
  }