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

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.
@@ -38,8 +38,8 @@ const packageMetadata = {
38
38
  name: '@progress/kendo-angular-spreadsheet',
39
39
  productName: 'Kendo UI for Angular',
40
40
  productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
41
- publishDate: 1728914527,
42
- version: '17.0.0-develop.2',
41
+ publishDate: 1729874289,
42
+ version: '17.0.0-develop.21',
43
43
  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',
44
44
  };
45
45
 
@@ -973,7 +973,7 @@ class SheetsBarComponent {
973
973
  this.notifySheetsChange();
974
974
  }
975
975
  onTabListKeyDown(ev) {
976
- const buttonEl = ev.target.querySelector('.k-dropdown-button');
976
+ const buttonEl = ev.target.querySelector('kendo-dropdownbutton');
977
977
  const index = Array.from(this.actionDdbRefs).findIndex(el => el.nativeElement === buttonEl);
978
978
  const ddb = Array.from(this.actionDdbs)[index];
979
979
  if (!ddb) {
@@ -1031,7 +1031,7 @@ SheetsBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ver
1031
1031
  [tabPosition]="'bottom'"
1032
1032
  [showContentArea]="false"
1033
1033
  [scrollable]="{prevButtonIcon: 'caret-alt-left', prevSVGButtonIcon: caretAltLeftIcon, nextButtonIcon: 'caret-alt-right', nextSVGButtonIcon: caretAltRightIcon}"
1034
- class="k-spreadsheet-sheets k-overflow-hidden"
1034
+ class="k-spreadsheet-sheets"
1035
1035
  (tabSelect)="onTabSelect($event)">
1036
1036
  <ng-container *ngFor="let sheet of sheets">
1037
1037
  <kendo-tabstrip-tab
@@ -1039,24 +1039,28 @@ SheetsBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ver
1039
1039
  [title]="sheet.text"
1040
1040
  [selected]="sheet.text === activeSheet">
1041
1041
  <ng-template kendoTabTemplate>
1042
- <span class="k-link">{{sheet.text}}</span>
1043
- <kendo-dropdownbutton #sheetDdb
1044
- fillMode="flat"
1045
- icon="caret-alt-down"
1046
- [svgIcon]="caretAltDownIcon"
1047
- buttonClass="k-menu-button"
1048
- [data]="sheet.sheetActions"
1049
- [buttonAttributes]="{'aria-hidden': 'true', 'tabindex': '-1', role: 'presentation'}"
1050
- (open)="onOpen(sheetDdb)"
1051
- (close)="onClose()"
1052
- (click)="$event.stopPropagation()"
1053
- (itemClick)="onActionClick($event, sheet)">
1054
- </kendo-dropdownbutton>
1042
+ <span class="k-link">
1043
+ <span class="k-link-text">{{sheet.text}}</span>
1044
+ </span>
1045
+ <span class="k-item-actions">
1046
+ <kendo-dropdownbutton #sheetDdb
1047
+ fillMode="flat"
1048
+ icon="caret-alt-down"
1049
+ [svgIcon]="caretAltDownIcon"
1050
+ buttonClass="k-menu-button"
1051
+ [data]="sheet.sheetActions"
1052
+ [buttonAttributes]="{'aria-hidden': 'true', 'tabindex': '-1', role: 'presentation'}"
1053
+ (open)="onOpen(sheetDdb)"
1054
+ (close)="onClose()"
1055
+ (click)="$event.stopPropagation()"
1056
+ (itemClick)="onActionClick($event, sheet)">
1057
+ </kendo-dropdownbutton>
1058
+ </span>
1055
1059
  </ng-template>
1056
1060
  </kendo-tabstrip-tab>
1057
1061
  </ng-container>
1058
1062
  </kendo-tabstrip>
1059
- `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: DropDownButtonComponent, selector: "kendo-dropdownbutton", inputs: ["arrowIcon", "icon", "svgIcon", "iconClass", "imageUrl", "textField", "data", "size", "rounded", "fillMode", "themeColor", "buttonAttributes"], outputs: ["itemClick", "focus", "blur"], exportAs: ["kendoDropDownButton"] }, { kind: "component", type: TabStripComponent, selector: "kendo-tabstrip", inputs: ["height", "animate", "tabAlignment", "tabPosition", "keepTabContent", "closable", "scrollable", "closeIcon", "closeIconClass", "closeSVGIcon", "showContentArea"], outputs: ["tabSelect", "tabClose", "tabScroll"], exportAs: ["kendoTabStrip"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TabStripTabComponent, selector: "kendo-tabstrip-tab", inputs: ["title", "disabled", "cssClass", "cssStyle", "selected", "closable", "closeIcon", "closeIconClass", "closeSVGIcon"], exportAs: ["kendoTabStripTab"] }, { kind: "directive", type: TabTemplateDirective, selector: "[kendoTabTemplate]" }] });
1063
+ `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: DropDownButtonComponent, selector: "kendo-dropdownbutton", inputs: ["arrowIcon", "icon", "svgIcon", "iconClass", "imageUrl", "textField", "data", "size", "rounded", "fillMode", "themeColor", "buttonAttributes"], outputs: ["itemClick", "focus", "blur"], exportAs: ["kendoDropDownButton"] }, { kind: "component", type: TabStripComponent, selector: "kendo-tabstrip", inputs: ["height", "animate", "tabAlignment", "tabPosition", "keepTabContent", "closable", "scrollable", "closeIcon", "closeIconClass", "closeSVGIcon", "showContentArea"], outputs: ["tabSelect", "tabClose", "tabScroll"], exportAs: ["kendoTabStrip"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TabStripTabComponent, selector: "kendo-tabstrip-tab", inputs: ["title", "disabled", "cssClass", "cssStyle", "selected", "closable", "closeIcon", "closeIconClass", "closeSVGIcon"], exportAs: ["kendoTabStripTab"] }, { kind: "directive", type: TabTemplateDirective, selector: "[kendoTabTemplate]" }] });
1060
1064
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SheetsBarComponent, decorators: [{
1061
1065
  type: Component,
1062
1066
  args: [{
@@ -1087,7 +1091,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
1087
1091
  [tabPosition]="'bottom'"
1088
1092
  [showContentArea]="false"
1089
1093
  [scrollable]="{prevButtonIcon: 'caret-alt-left', prevSVGButtonIcon: caretAltLeftIcon, nextButtonIcon: 'caret-alt-right', nextSVGButtonIcon: caretAltRightIcon}"
1090
- class="k-spreadsheet-sheets k-overflow-hidden"
1094
+ class="k-spreadsheet-sheets"
1091
1095
  (tabSelect)="onTabSelect($event)">
1092
1096
  <ng-container *ngFor="let sheet of sheets">
1093
1097
  <kendo-tabstrip-tab
@@ -1095,19 +1099,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
1095
1099
  [title]="sheet.text"
1096
1100
  [selected]="sheet.text === activeSheet">
1097
1101
  <ng-template kendoTabTemplate>
1098
- <span class="k-link">{{sheet.text}}</span>
1099
- <kendo-dropdownbutton #sheetDdb
1100
- fillMode="flat"
1101
- icon="caret-alt-down"
1102
- [svgIcon]="caretAltDownIcon"
1103
- buttonClass="k-menu-button"
1104
- [data]="sheet.sheetActions"
1105
- [buttonAttributes]="{'aria-hidden': 'true', 'tabindex': '-1', role: 'presentation'}"
1106
- (open)="onOpen(sheetDdb)"
1107
- (close)="onClose()"
1108
- (click)="$event.stopPropagation()"
1109
- (itemClick)="onActionClick($event, sheet)">
1110
- </kendo-dropdownbutton>
1102
+ <span class="k-link">
1103
+ <span class="k-link-text">{{sheet.text}}</span>
1104
+ </span>
1105
+ <span class="k-item-actions">
1106
+ <kendo-dropdownbutton #sheetDdb
1107
+ fillMode="flat"
1108
+ icon="caret-alt-down"
1109
+ [svgIcon]="caretAltDownIcon"
1110
+ buttonClass="k-menu-button"
1111
+ [data]="sheet.sheetActions"
1112
+ [buttonAttributes]="{'aria-hidden': 'true', 'tabindex': '-1', role: 'presentation'}"
1113
+ (open)="onOpen(sheetDdb)"
1114
+ (close)="onClose()"
1115
+ (click)="$event.stopPropagation()"
1116
+ (itemClick)="onActionClick($event, sheet)">
1117
+ </kendo-dropdownbutton>
1118
+ </span>
1111
1119
  </ng-template>
1112
1120
  </kendo-tabstrip-tab>
1113
1121
  </ng-container>
@@ -1977,6 +1985,7 @@ FontSizeDropDownListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.
1977
1985
  FontSizeDropDownListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: FontSizeDropDownListComponent, isStandalone: true, selector: "kendo-spreadsheet-fontsize-dropdownlist", usesInheritance: true, ngImport: i0, template: `
1978
1986
  <kendo-dropdownlist
1979
1987
  #element
1988
+ class="k-toolbar-dropdownlist"
1980
1989
  [data]="data"
1981
1990
  [(value)]="value"
1982
1991
  [attr.title]="title"
@@ -1992,6 +2001,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
1992
2001
  template: `
1993
2002
  <kendo-dropdownlist
1994
2003
  #element
2004
+ class="k-toolbar-dropdownlist"
1995
2005
  [data]="data"
1996
2006
  [(value)]="value"
1997
2007
  [attr.title]="title"
@@ -2014,6 +2024,7 @@ FontFamilyDropDownListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "1
2014
2024
  FontFamilyDropDownListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: FontFamilyDropDownListComponent, isStandalone: true, selector: "kendo-spreadsheet-fontfamily-dropdownlist", usesInheritance: true, ngImport: i0, template: `
2015
2025
  <kendo-dropdownlist
2016
2026
  #element
2027
+ class="k-toolbar-dropdownlist"
2017
2028
  [data]="data"
2018
2029
  [(value)]="value"
2019
2030
  [tabindex]="tabindex"
@@ -2035,6 +2046,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
2035
2046
  template: `
2036
2047
  <kendo-dropdownlist
2037
2048
  #element
2049
+ class="k-toolbar-dropdownlist"
2038
2050
  [data]="data"
2039
2051
  [(value)]="value"
2040
2052
  [tabindex]="tabindex"
@@ -2337,18 +2349,20 @@ class SpreadsheetBackColorComponent extends SpreadsheetDropDownToolBase {
2337
2349
  SpreadsheetBackColorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetBackColorComponent, deps: [{ token: i1$1.DialogService }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }, { token: ToolBarComponent }], target: i0.ɵɵFactoryTarget.Component });
2338
2350
  SpreadsheetBackColorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetBackColorComponent, isStandalone: true, selector: "kendo-spreadsheet-backcolor-tool", providers: [{ provide: ToolBarToolComponent, useExisting: forwardRef(() => SpreadsheetBackColorComponent) }], usesInheritance: true, ngImport: i0, template: `
2339
2351
  <ng-template #toolbarTemplate>
2340
- <kendo-colorpicker
2341
- #element
2342
- [attr.title]="messageFor(command)"
2343
- [format]="'hex'"
2344
- [(value)]="value"
2345
- [tabindex]="tabindex"
2346
- (valueChange)="onValueChange($event)"
2347
- [clearButton]="false"
2348
- fillMode="flat"
2349
- [icon]="icon"
2350
- [preview]="true"
2351
- [svgIcon]="svgIcon"></kendo-colorpicker>
2352
+ <div class="k-toolbar-item">
2353
+ <kendo-colorpicker
2354
+ #element
2355
+ [attr.title]="messageFor(command)"
2356
+ [format]="'hex'"
2357
+ [(value)]="value"
2358
+ [tabindex]="tabindex"
2359
+ (valueChange)="onValueChange($event)"
2360
+ [clearButton]="false"
2361
+ fillMode="flat"
2362
+ [icon]="icon"
2363
+ [preview]="true"
2364
+ [svgIcon]="svgIcon"></kendo-colorpicker>
2365
+ </div>
2352
2366
  </ng-template>
2353
2367
  <ng-template #popupTemplate>
2354
2368
  <div #popupButton
@@ -2371,18 +2385,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
2371
2385
  selector: 'kendo-spreadsheet-backcolor-tool',
2372
2386
  template: `
2373
2387
  <ng-template #toolbarTemplate>
2374
- <kendo-colorpicker
2375
- #element
2376
- [attr.title]="messageFor(command)"
2377
- [format]="'hex'"
2378
- [(value)]="value"
2379
- [tabindex]="tabindex"
2380
- (valueChange)="onValueChange($event)"
2381
- [clearButton]="false"
2382
- fillMode="flat"
2383
- [icon]="icon"
2384
- [preview]="true"
2385
- [svgIcon]="svgIcon"></kendo-colorpicker>
2388
+ <div class="k-toolbar-item">
2389
+ <kendo-colorpicker
2390
+ #element
2391
+ [attr.title]="messageFor(command)"
2392
+ [format]="'hex'"
2393
+ [(value)]="value"
2394
+ [tabindex]="tabindex"
2395
+ (valueChange)="onValueChange($event)"
2396
+ [clearButton]="false"
2397
+ fillMode="flat"
2398
+ [icon]="icon"
2399
+ [preview]="true"
2400
+ [svgIcon]="svgIcon"></kendo-colorpicker>
2401
+ </div>
2386
2402
  </ng-template>
2387
2403
  <ng-template #popupTemplate>
2388
2404
  <div #popupButton
@@ -2420,18 +2436,20 @@ class SpreadsheetForeColorComponent extends SpreadsheetDropDownToolBase {
2420
2436
  SpreadsheetForeColorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetForeColorComponent, deps: [{ token: i1$1.DialogService }, { token: SpreadsheetLocalizationService }, { token: SpreadsheetService }, { token: SpreadsheetToolsService }, { token: ToolBarComponent }], target: i0.ɵɵFactoryTarget.Component });
2421
2437
  SpreadsheetForeColorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SpreadsheetForeColorComponent, isStandalone: true, selector: "kendo-spreadsheet-forecolor-tool", providers: [{ provide: ToolBarToolComponent, useExisting: forwardRef(() => SpreadsheetForeColorComponent) }], usesInheritance: true, ngImport: i0, template: `
2422
2438
  <ng-template #toolbarTemplate>
2423
- <kendo-colorpicker
2424
- #element
2425
- [attr.title]="messageFor(command)"
2426
- [format]="'hex'"
2427
- [(value)]="value"
2428
- [tabindex]="tabindex"
2429
- (valueChange)="onValueChange($event)"
2430
- [clearButton]="false"
2431
- fillMode="flat"
2432
- [icon]="icon"
2433
- [svgIcon]="svgIcon"
2434
- [preview]="true"></kendo-colorpicker>
2439
+ <div class="k-toolbar-item">
2440
+ <kendo-colorpicker
2441
+ #element
2442
+ [attr.title]="messageFor(command)"
2443
+ [format]="'hex'"
2444
+ [(value)]="value"
2445
+ [tabindex]="tabindex"
2446
+ (valueChange)="onValueChange($event)"
2447
+ [clearButton]="false"
2448
+ fillMode="flat"
2449
+ [icon]="icon"
2450
+ [svgIcon]="svgIcon"
2451
+ [preview]="true"></kendo-colorpicker>
2452
+ </div>
2435
2453
  </ng-template>
2436
2454
  <ng-template #popupTemplate>
2437
2455
  <div #popupButton
@@ -2454,18 +2472,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
2454
2472
  selector: 'kendo-spreadsheet-forecolor-tool',
2455
2473
  template: `
2456
2474
  <ng-template #toolbarTemplate>
2457
- <kendo-colorpicker
2458
- #element
2459
- [attr.title]="messageFor(command)"
2460
- [format]="'hex'"
2461
- [(value)]="value"
2462
- [tabindex]="tabindex"
2463
- (valueChange)="onValueChange($event)"
2464
- [clearButton]="false"
2465
- fillMode="flat"
2466
- [icon]="icon"
2467
- [svgIcon]="svgIcon"
2468
- [preview]="true"></kendo-colorpicker>
2475
+ <div class="k-toolbar-item">
2476
+ <kendo-colorpicker
2477
+ #element
2478
+ [attr.title]="messageFor(command)"
2479
+ [format]="'hex'"
2480
+ [(value)]="value"
2481
+ [tabindex]="tabindex"
2482
+ (valueChange)="onValueChange($event)"
2483
+ [clearButton]="false"
2484
+ fillMode="flat"
2485
+ [icon]="icon"
2486
+ [svgIcon]="svgIcon"
2487
+ [preview]="true"></kendo-colorpicker>
2488
+ </div>
2469
2489
  </ng-template>
2470
2490
  <ng-template #popupTemplate>
2471
2491
  <div #popupButton
@@ -2971,7 +2991,7 @@ SpreadsheetLoadFileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14
2971
2991
  accept=".xlsx,.XLSX" />
2972
2992
  </div>
2973
2993
  </ng-template>
2974
- `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }] });
2994
+ `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }] });
2975
2995
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetLoadFileComponent, decorators: [{
2976
2996
  type: Component,
2977
2997
  args: [{
@@ -3985,6 +4005,7 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
3985
4005
  </kendo-menu>
3986
4006
  <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'file'"
3987
4007
  [attr.aria-label]="messageFor('file')"
4008
+ fillMode="flat"
3988
4009
  class="k-spreadsheet-toolbar"
3989
4010
  [overflow]="overflow">
3990
4011
  <kendo-spreadsheet-load-file-tool></kendo-spreadsheet-load-file-tool>
@@ -3993,18 +4014,19 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
3993
4014
  <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'home'"
3994
4015
  [attr.aria-label]="messageFor('home')"
3995
4016
  class="k-spreadsheet-toolbar"
4017
+ fillMode="flat"
3996
4018
  [overflow]="overflow">
3997
- <kendo-toolbar-buttongroup>
3998
- <kendo-toolbar-button kendoSpreadsheetUndo></kendo-toolbar-button>
3999
- <kendo-toolbar-button kendoSpreadsheetRedo></kendo-toolbar-button>
4000
- </kendo-toolbar-buttongroup>
4019
+ <kendo-toolbar-button kendoSpreadsheetUndo></kendo-toolbar-button>
4020
+ <kendo-toolbar-button kendoSpreadsheetRedo></kendo-toolbar-button>
4001
4021
  <kendo-toolbar-separator></kendo-toolbar-separator>
4002
4022
  <kendo-toolbar-dropdownlist kendoSpreadsheetFontFamily></kendo-toolbar-dropdownlist>
4003
4023
  <kendo-toolbar-dropdownlist kendoSpreadsheetFontSize></kendo-toolbar-dropdownlist>
4004
- <kendo-toolbar-button kendoSpreadsheetIncreaseFontSize></kendo-toolbar-button>
4005
- <kendo-toolbar-button kendoSpreadsheetDecreaseFontSize></kendo-toolbar-button>
4024
+ <kendo-toolbar-buttongroup fillMode="flat">
4025
+ <kendo-toolbar-button kendoSpreadsheetIncreaseFontSize></kendo-toolbar-button>
4026
+ <kendo-toolbar-button kendoSpreadsheetDecreaseFontSize></kendo-toolbar-button>
4027
+ </kendo-toolbar-buttongroup>
4006
4028
  <kendo-toolbar-separator></kendo-toolbar-separator>
4007
- <kendo-toolbar-buttongroup>
4029
+ <kendo-toolbar-buttongroup fillMode="flat">
4008
4030
  <kendo-toolbar-button kendoSpreadsheetBold></kendo-toolbar-button>
4009
4031
  <kendo-toolbar-button kendoSpreadsheetItalic></kendo-toolbar-button>
4010
4032
  <kendo-toolbar-button kendoSpreadsheetUnderline></kendo-toolbar-button>
@@ -4021,6 +4043,7 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
4021
4043
  </kendo-toolbar>
4022
4044
  <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'insert'"
4023
4045
  [attr.aria-label]="messageFor('insert')"
4046
+ fillMode="flat"
4024
4047
  class="k-spreadsheet-toolbar"
4025
4048
  [overflow]="overflow">
4026
4049
  <kendo-toolbar-button kendoSpreadsheetInsertLink></kendo-toolbar-button>
@@ -4035,6 +4058,7 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
4035
4058
  </kendo-toolbar>
4036
4059
  <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'format'"
4037
4060
  [attr.aria-label]="messageFor('formatTab')"
4061
+ fillMode="flat"
4038
4062
  class="k-spreadsheet-toolbar"
4039
4063
  [overflow]="overflow">
4040
4064
  <kendo-toolbar-button kendoSpreadsheetDecreaseDecimal></kendo-toolbar-button>
@@ -4042,6 +4066,7 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
4042
4066
  </kendo-toolbar>
4043
4067
  <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'view'"
4044
4068
  [attr.aria-label]="messageFor('view')"
4069
+ fillMode="flat"
4045
4070
  class="k-spreadsheet-toolbar"
4046
4071
  [overflow]="overflow">
4047
4072
  <kendo-toolbar-dropdownbutton kendoSpreadsheetMerge></kendo-toolbar-dropdownbutton>
@@ -4086,7 +4111,7 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
4086
4111
  (select)="onContextMenuSelect($event)"></kendo-contextmenu>
4087
4112
 
4088
4113
  <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
4089
- `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoSpreadsheetLocalizedMessages]" }, { kind: "component", type: MenuComponent, selector: "kendo-menu", inputs: ["appendTo", "menuItemTemplate", "ariaRole", "menuItemLinkTemplate"], outputs: ["select", "open", "close"], exportAs: ["kendoMenu"] }, { kind: "directive", type: MainMenuDirective, selector: "[kendoSpreadsheetMenu]" }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MenuItemComponent, selector: "kendo-menu-item", inputs: ["text", "url", "disabled", "cssClass", "cssStyle", "icon", "svgIcon", "data", "separator"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "tabindex", "size", "tabIndex"], outputs: ["open", "close"], exportAs: ["kendoToolBar"] }, { kind: "component", type: SpreadsheetLoadFileComponent, selector: "kendo-spreadsheet-load-file-tool" }, { kind: "component", type: ToolBarButtonComponent, selector: "kendo-toolbar-button", inputs: ["showText", "showIcon", "text", "style", "className", "title", "disabled", "toggleable", "look", "togglable", "selected", "fillMode", "themeColor", "icon", "iconClass", "svgIcon", "imageUrl"], outputs: ["click", "pointerdown", "selectedChange"], exportAs: ["kendoToolBarButton"] }, { kind: "directive", type: SpreadsheetSaveFileDirective, selector: "[kendoSpreadsheetSaveFile]" }, { kind: "component", type: ToolBarButtonGroupComponent, selector: "kendo-toolbar-buttongroup", inputs: ["disabled", "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]" }] });
4114
+ `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoSpreadsheetLocalizedMessages]" }, { kind: "component", type: MenuComponent, selector: "kendo-menu", inputs: ["appendTo", "menuItemTemplate", "ariaRole", "menuItemLinkTemplate"], outputs: ["select", "open", "close"], exportAs: ["kendoMenu"] }, { kind: "directive", type: MainMenuDirective, selector: "[kendoSpreadsheetMenu]" }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MenuItemComponent, selector: "kendo-menu-item", inputs: ["text", "url", "disabled", "cssClass", "cssStyle", "icon", "svgIcon", "data", "separator"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "fillMode", "tabindex", "size", "tabIndex"], outputs: ["open", "close"], exportAs: ["kendoToolBar"] }, { kind: "component", type: SpreadsheetLoadFileComponent, selector: "kendo-spreadsheet-load-file-tool" }, { kind: "component", type: ToolBarButtonComponent, selector: "kendo-toolbar-button", inputs: ["showText", "showIcon", "text", "style", "className", "title", "disabled", "toggleable", "look", "togglable", "selected", "fillMode", "themeColor", "icon", "iconClass", "svgIcon", "imageUrl"], outputs: ["click", "pointerdown", "selectedChange"], exportAs: ["kendoToolBarButton"] }, { kind: "directive", type: SpreadsheetSaveFileDirective, selector: "[kendoSpreadsheetSaveFile]" }, { kind: "component", type: ToolBarButtonGroupComponent, selector: "kendo-toolbar-buttongroup", inputs: ["disabled", "fillMode", "selection", "width", "look"], exportAs: ["kendoToolBarButtonGroup"] }, { kind: "directive", type: SpreadsheetUndoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUndo]" }, { kind: "directive", type: SpreadsheetRedoDirective, selector: "kendo-toolbar-button[kendoSpreadsheetRedo]" }, { kind: "component", type: ToolBarSeparatorComponent, selector: "kendo-toolbar-separator", exportAs: ["kendoToolBarSeparator"] }, { kind: "component", type: SpreadsheetFontFamilyComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontFamily]" }, { kind: "component", type: SpreadsheetFontSizeComponent, selector: "kendo-toolbar-dropdownlist[kendoSpreadsheetFontSize]" }, { kind: "directive", type: SpreadsheetIncreaseFontSizeDirective, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseFontSize]" }, { kind: "directive", type: SpreadsheetDecreaseFontSizeDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseFontSize]" }, { kind: "directive", type: SpreadsheetBoldDirective, selector: "kendo-toolbar-button[kendoSpreadsheetBold]" }, { kind: "directive", type: SpreadsheetItalicDirective, selector: "kendo-toolbar-button[kendoSpreadsheetItalic]" }, { kind: "directive", type: SpreadsheetUnderlineDirective, selector: "kendo-toolbar-button[kendoSpreadsheetUnderline]" }, { kind: "component", type: SpreadsheetForeColorComponent, selector: "kendo-spreadsheet-forecolor-tool" }, { kind: "component", type: SpreadsheetBackColorComponent, selector: "kendo-spreadsheet-backcolor-tool" }, { kind: "component", type: ToolBarDropDownButtonComponent, selector: "kendo-toolbar-dropdownbutton", inputs: ["arrowIcon", "title", "showText", "showIcon", "text", "icon", "svgIcon", "iconClass", "imageUrl", "popupSettings", "look", "primary", "fillMode", "themeColor", "buttonClass", "textField", "disabled", "data"], outputs: ["itemClick", "open", "close"], exportAs: ["kendoToolBarDropDownButton"] }, { kind: "directive", type: SpreadsheetHorizontalTextAlignDirective, selector: "[kendoSpreadsheetHorizontalTextAlign]" }, { kind: "directive", type: SpreadsheetVerticalTextAlignDirective, selector: "[kendoSpreadsheetVerticalTextAlign]" }, { kind: "directive", type: SpreadsheetTextWrapDirective, selector: "kendo-toolbar-button[kendoSpreadsheetTextWrap]" }, { kind: "directive", type: SpreadsheetFormatDirective, selector: "[kendoSpreadsheetFormat]" }, { kind: "directive", type: SpreadsheetInsertLinkDirective, selector: "kendo-toolbar-button[kendoSpreadsheetInsertLink]" }, { kind: "directive", type: SpreadsheetAddColumnLeftButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnLeftButton]" }, { kind: "directive", type: SpreadsheetAddColumnRightButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddColumnRightButton]" }, { kind: "directive", type: SpreadsheetAddRowBelowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowBelowButton]" }, { kind: "directive", type: SpreadsheetAddRowAboveButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetAddRowAboveButton]" }, { kind: "directive", type: SpreadsheetDeleteColumnButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteColumnButton]" }, { kind: "directive", type: SpreadsheetDeleteRowButtonDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDeleteRowButton]" }, { kind: "directive", type: SpreadsheetDecreaseDecimalDirective, selector: "kendo-toolbar-button[kendoSpreadsheetDecreaseDecimal]" }, { kind: "directive", type: SpreadsheetIncreaseDecimalDirective, selector: "kendo-toolbar-button[kendoSpreadsheetIncreaseDecimal]" }, { kind: "directive", type: SpreadsheetMergeDirective, selector: "[kendoSpreadsheetMerge]" }, { kind: "directive", type: SpreadsheetGridLinesDirective, selector: "kendo-toolbar-button[kendoSpreadsheetGridLines]" }, { kind: "component", type: NameBoxComponent, selector: "[kendoSpreadsheetNameBox]", inputs: ["data", "spreadsheetWidget"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: FormulaInputDirective, selector: "[kendoSpreadsheetFormulaInput]", inputs: ["formulaListMaxHeight"] }, { kind: "component", type: SheetsBarComponent, selector: "[kendoSpreadsheetSheetsBar]", inputs: ["sheets", "sheetDescriptors"] }, { kind: "component", type: ContextMenuComponent, selector: "kendo-contextmenu", inputs: ["showOn", "target", "filter", "alignToAnchor", "vertical", "popupAnimate", "popupAlign", "anchorAlign", "collision", "appendTo", "ariaLabel"], outputs: ["popupOpen", "popupClose", "select", "open", "close"], exportAs: ["kendoContextMenu"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }] });
4090
4115
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SpreadsheetComponent, decorators: [{
4091
4116
  type: Component,
4092
4117
  args: [{
@@ -4271,6 +4296,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
4271
4296
  </kendo-menu>
4272
4297
  <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'file'"
4273
4298
  [attr.aria-label]="messageFor('file')"
4299
+ fillMode="flat"
4274
4300
  class="k-spreadsheet-toolbar"
4275
4301
  [overflow]="overflow">
4276
4302
  <kendo-spreadsheet-load-file-tool></kendo-spreadsheet-load-file-tool>
@@ -4279,18 +4305,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
4279
4305
  <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'home'"
4280
4306
  [attr.aria-label]="messageFor('home')"
4281
4307
  class="k-spreadsheet-toolbar"
4308
+ fillMode="flat"
4282
4309
  [overflow]="overflow">
4283
- <kendo-toolbar-buttongroup>
4284
- <kendo-toolbar-button kendoSpreadsheetUndo></kendo-toolbar-button>
4285
- <kendo-toolbar-button kendoSpreadsheetRedo></kendo-toolbar-button>
4286
- </kendo-toolbar-buttongroup>
4310
+ <kendo-toolbar-button kendoSpreadsheetUndo></kendo-toolbar-button>
4311
+ <kendo-toolbar-button kendoSpreadsheetRedo></kendo-toolbar-button>
4287
4312
  <kendo-toolbar-separator></kendo-toolbar-separator>
4288
4313
  <kendo-toolbar-dropdownlist kendoSpreadsheetFontFamily></kendo-toolbar-dropdownlist>
4289
4314
  <kendo-toolbar-dropdownlist kendoSpreadsheetFontSize></kendo-toolbar-dropdownlist>
4290
- <kendo-toolbar-button kendoSpreadsheetIncreaseFontSize></kendo-toolbar-button>
4291
- <kendo-toolbar-button kendoSpreadsheetDecreaseFontSize></kendo-toolbar-button>
4315
+ <kendo-toolbar-buttongroup fillMode="flat">
4316
+ <kendo-toolbar-button kendoSpreadsheetIncreaseFontSize></kendo-toolbar-button>
4317
+ <kendo-toolbar-button kendoSpreadsheetDecreaseFontSize></kendo-toolbar-button>
4318
+ </kendo-toolbar-buttongroup>
4292
4319
  <kendo-toolbar-separator></kendo-toolbar-separator>
4293
- <kendo-toolbar-buttongroup>
4320
+ <kendo-toolbar-buttongroup fillMode="flat">
4294
4321
  <kendo-toolbar-button kendoSpreadsheetBold></kendo-toolbar-button>
4295
4322
  <kendo-toolbar-button kendoSpreadsheetItalic></kendo-toolbar-button>
4296
4323
  <kendo-toolbar-button kendoSpreadsheetUnderline></kendo-toolbar-button>
@@ -4307,6 +4334,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
4307
4334
  </kendo-toolbar>
4308
4335
  <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'insert'"
4309
4336
  [attr.aria-label]="messageFor('insert')"
4337
+ fillMode="flat"
4310
4338
  class="k-spreadsheet-toolbar"
4311
4339
  [overflow]="overflow">
4312
4340
  <kendo-toolbar-button kendoSpreadsheetInsertLink></kendo-toolbar-button>
@@ -4321,6 +4349,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
4321
4349
  </kendo-toolbar>
4322
4350
  <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'format'"
4323
4351
  [attr.aria-label]="messageFor('formatTab')"
4352
+ fillMode="flat"
4324
4353
  class="k-spreadsheet-toolbar"
4325
4354
  [overflow]="overflow">
4326
4355
  <kendo-toolbar-button kendoSpreadsheetDecreaseDecimal></kendo-toolbar-button>
@@ -4328,6 +4357,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
4328
4357
  </kendo-toolbar>
4329
4358
  <kendo-toolbar *ngIf="selectedMenuItem?.active && selectedMenuItem.id === 'view'"
4330
4359
  [attr.aria-label]="messageFor('view')"
4360
+ fillMode="flat"
4331
4361
  class="k-spreadsheet-toolbar"
4332
4362
  [overflow]="overflow">
4333
4363
  <kendo-toolbar-dropdownbutton kendoSpreadsheetMerge></kendo-toolbar-dropdownbutton>