@progress/kendo-angular-spreadsheet 14.2.0 → 14.3.0-develop.1

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.
@@ -8,7 +8,7 @@ import { validatePackage } from '@progress/kendo-licensing';
8
8
  import { SpreadsheetWidget } from '@progress/kendo-spreadsheet-common';
9
9
  import * as i1$4 from '@progress/kendo-angular-intl';
10
10
  import { localeData, IntlModule } from '@progress/kendo-angular-intl';
11
- import { formulaFxIcon, trashIcon, copyIcon, pencilIcon, arrowRightIcon, arrowLeftIcon, alignCenterIcon, alignJustifyIcon, alignLeftIcon, alignRightIcon, alignTopIcon, alignMiddleIcon, alignBottomIcon, dropletIcon, boldIcon, foregroundColorIcon, italicIcon, arrowRotateCwIcon, underlineIcon, arrowRotateCcwIcon, textWrapIcon, tableColumnInsertLeftIcon, tableColumnInsertRightIcon, tableRowInsertAboveIcon, tableRowInsertBelowIcon, tableRowDeleteIcon, tableColumnDeleteIcon, bordersNoneIcon, folderOpenIcon, downloadIcon, customFormatIcon, fontSizeIcon, fontFamilyIcon, cellsMergeIcon, cellsMergeHorizontallyIcon, cellsMergeVerticallyIcon, tableUnmergeIcon, linkIcon, fontGrowIcon, fontShrinkIcon, decimalDecreaseIcon, decimalIncreaseIcon, plusIcon, menuIcon, caretAltDownIcon, caretAltLeftIcon, caretAltRightIcon, eyeIcon } from '@progress/kendo-svg-icons';
11
+ import { formulaFxIcon, trashIcon, copyIcon, pencilIcon, arrowRightIcon, arrowLeftIcon, alignCenterIcon, alignJustifyIcon, alignLeftIcon, alignRightIcon, alignTopIcon, alignMiddleIcon, alignBottomIcon, dropletIcon, boldIcon, foregroundColorIcon, italicIcon, arrowRotateCwIcon, underlineIcon, arrowRotateCcwIcon, textWrapIcon, tableColumnInsertLeftIcon, tableColumnInsertRightIcon, tableRowInsertAboveIcon, tableRowInsertBelowIcon, tableRowDeleteIcon, tableColumnDeleteIcon, bordersNoneIcon, folderOpenIcon, downloadIcon, customFormatIcon, fontSizeIcon, fontFamilyIcon, cellsMergeIcon, cellsMergeHorizontallyIcon, cellsMergeVerticallyIcon, tableUnmergeIcon, linkIcon, fontGrowIcon, fontShrinkIcon, decimalDecreaseIcon, decimalIncreaseIcon, cutIcon, clipboardIcon, eyeSlashIcon, eyeIcon, plusIcon, menuIcon, caretAltDownIcon, caretAltLeftIcon, caretAltRightIcon } from '@progress/kendo-svg-icons';
12
12
  import * as i2 from '@progress/kendo-angular-l10n';
13
13
  import { LocalizationService, L10N_PREFIX, RTL, ComponentMessages } from '@progress/kendo-angular-l10n';
14
14
  import * as i3 from '@progress/kendo-angular-common';
@@ -23,18 +23,18 @@ import { CommonModule } from '@angular/common';
23
23
  import { take, map } from 'rxjs/operators';
24
24
  import * as i1$1 from '@progress/kendo-angular-dialog';
25
25
  import { DialogContentBase, DialogModule } from '@progress/kendo-angular-dialog';
26
- import * as i6$1 from '@progress/kendo-angular-menu';
27
- import { MenuModule } from '@progress/kendo-angular-menu';
26
+ import * as i2$1 from '@progress/kendo-angular-label';
27
+ import { LabelModule } from '@progress/kendo-angular-label';
28
+ import * as i5 from '@progress/kendo-angular-inputs';
29
+ import { InputsModule } from '@progress/kendo-angular-inputs';
30
+ import * as i7$1 from '@progress/kendo-angular-menu';
31
+ import { MenusModule } from '@progress/kendo-angular-menu';
28
32
  import * as i1$2 from '@progress/kendo-angular-toolbar';
29
33
  import { ToolBarToolComponent, ToolBarComponent, ToolBarModule } from '@progress/kendo-angular-toolbar';
30
34
  import * as i4 from '@progress/kendo-angular-buttons';
31
35
  import { ButtonsModule } from '@progress/kendo-angular-buttons';
32
36
  import * as i1$3 from '@progress/kendo-angular-dropdowns';
33
37
  import { DropDownListComponent, ComboBoxModule, DropDownListModule } from '@progress/kendo-angular-dropdowns';
34
- import * as i5 from '@progress/kendo-angular-inputs';
35
- import { InputsModule } from '@progress/kendo-angular-inputs';
36
- import * as i2$1 from '@progress/kendo-angular-label';
37
- import { LabelModule } from '@progress/kendo-angular-label';
38
38
  import * as i5$1 from '@progress/kendo-angular-layout';
39
39
  import { TabStripModule } from '@progress/kendo-angular-layout';
40
40
  import { saveAs } from '@progress/kendo-file-saver';
@@ -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: 1701270719,
51
- version: '14.2.0',
50
+ publishDate: 1701695065,
51
+ version: '14.3.0-develop.1',
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
 
@@ -264,11 +264,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
264
264
  * @hidden
265
265
  */
266
266
  class FormulaInputDirective {
267
- constructor(element, popupService, spreadsheetService) {
267
+ constructor(element, popupService, spreadsheetService, localization) {
268
268
  this.element = element;
269
269
  this.popupService = popupService;
270
270
  this.spreadsheetService = spreadsheetService;
271
+ this.localization = localization;
271
272
  this.hostClasses = true;
273
+ this.role = 'combobox';
272
274
  this.ariaHasPopup = 'menu';
273
275
  this.ariaExpanded = 'false';
274
276
  this.focusedItem = () => { var _a; return (_a = this.list) === null || _a === void 0 ? void 0 : _a.element.nativeElement.querySelector('.k-focus'); };
@@ -297,6 +299,9 @@ class FormulaInputDirective {
297
299
  }
298
300
  };
299
301
  }
302
+ get title() {
303
+ return this.localization.get('formulaInput');
304
+ }
300
305
  get ariaControls() {
301
306
  return this.ariaExpanded === 'true' ? this.spreadsheetService.formulaListId : null;
302
307
  }
@@ -375,16 +380,22 @@ class FormulaInputDirective {
375
380
  };
376
381
  }
377
382
  }
378
- 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 }], 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.aria-haspopup": "this.ariaHasPopup", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-controls": "this.ariaControls" } }, ngImport: i0 });
383
+ 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 });
384
+ 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 });
380
385
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormulaInputDirective, decorators: [{
381
386
  type: Directive,
382
387
  args: [{
383
388
  selector: '[kendoSpreadsheetFormulaInput]',
384
389
  }]
385
- }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.PopupService }, { type: SpreadsheetService }]; }, propDecorators: { hostClasses: [{
390
+ }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.PopupService }, { type: SpreadsheetService }, { type: SpreadsheetLocalizationService }]; }, propDecorators: { hostClasses: [{
386
391
  type: HostBinding,
387
392
  args: ['class.k-spreadsheet-formula-input']
393
+ }], title: [{
394
+ type: HostBinding,
395
+ args: ['attr.title']
396
+ }], role: [{
397
+ type: HostBinding,
398
+ args: ['attr.role']
388
399
  }], ariaHasPopup: [{
389
400
  type: HostBinding,
390
401
  args: ['attr.aria-haspopup']
@@ -543,7 +554,14 @@ const commandIcons = {
543
554
  increaseFontSize: 'font-grow',
544
555
  decreaseFontSize: 'font-shrink',
545
556
  increaseDecimal: 'decimal-increase',
546
- decreaseDecimal: 'decimal-decrease'
557
+ decreaseDecimal: 'decimal-decrease',
558
+ copy: 'copy',
559
+ cut: 'cut',
560
+ paste: 'clipboard',
561
+ hideRow: 'eye-slash',
562
+ unhideRow: 'eye',
563
+ hideColumn: 'eye-slash',
564
+ unhideColumn: 'eye'
547
565
  };
548
566
  /**
549
567
  * @hidden
@@ -588,9 +606,56 @@ const commandSVGIcons = {
588
606
  increaseFontSize: fontGrowIcon,
589
607
  decreaseFontSize: fontShrinkIcon,
590
608
  decreaseDecimal: decimalDecreaseIcon,
591
- increaseDecimal: decimalIncreaseIcon
609
+ increaseDecimal: decimalIncreaseIcon,
610
+ copy: copyIcon,
611
+ cut: cutIcon,
612
+ paste: clipboardIcon,
613
+ hideRow: eyeSlashIcon,
614
+ unhideRow: eyeIcon,
615
+ hideColumn: eyeSlashIcon,
616
+ unhideColumn: eyeIcon
592
617
  };
593
618
 
619
+ /**
620
+ * @hidden
621
+ */
622
+ class InsertLinkDialogComponent extends DialogContentBase {
623
+ constructor(dialog) {
624
+ super(dialog);
625
+ this.dialog = dialog;
626
+ this.urlLink = '';
627
+ }
628
+ setData(args) {
629
+ this.urlLink = args.link;
630
+ }
631
+ }
632
+ InsertLinkDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: InsertLinkDialogComponent, deps: [{ token: i1$1.DialogRef }], target: i0.ɵɵFactoryTarget.Component });
633
+ InsertLinkDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: InsertLinkDialogComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `
634
+ <form class="k-form k-form-md" method="dialog">
635
+ <div class="k-form-field">
636
+ <kendo-label [for]="textbox" text="URL"></kendo-label>
637
+ <kendo-textbox #textbox
638
+ [(value)]="urlLink">
639
+ </kendo-textbox>
640
+ </div>
641
+ </form>
642
+ `, isInline: true, components: [{ type: i2$1.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }, { type: i5.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }] });
643
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: InsertLinkDialogComponent, decorators: [{
644
+ type: Component,
645
+ args: [{
646
+ template: `
647
+ <form class="k-form k-form-md" method="dialog">
648
+ <div class="k-form-field">
649
+ <kendo-label [for]="textbox" text="URL"></kendo-label>
650
+ <kendo-textbox #textbox
651
+ [(value)]="urlLink">
652
+ </kendo-textbox>
653
+ </div>
654
+ </form>
655
+ `
656
+ }]
657
+ }], ctorParameters: function () { return [{ type: i1$1.DialogRef }]; } });
658
+
594
659
  /**
595
660
  * @hidden
596
661
  */
@@ -1416,7 +1481,7 @@ SpreadsheetForeColorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "1
1416
1481
  [tabindex]="tabindex"
1417
1482
  role="menuitem"
1418
1483
  class="k-item k-menu-item"
1419
- (click)="openDialog();">
1484
+ (click)="openDialog()">
1420
1485
  <span
1421
1486
  class="k-link k-menu-link">
1422
1487
  <kendo-icon-wrapper [name]="icon" [svgIcon]="svgIcon"></kendo-icon-wrapper>
@@ -1450,7 +1515,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
1450
1515
  [tabindex]="tabindex"
1451
1516
  role="menuitem"
1452
1517
  class="k-item k-menu-item"
1453
- (click)="openDialog();">
1518
+ (click)="openDialog()">
1454
1519
  <span
1455
1520
  class="k-link k-menu-link">
1456
1521
  <kendo-icon-wrapper [name]="icon" [svgIcon]="svgIcon"></kendo-icon-wrapper>
@@ -1497,7 +1562,7 @@ SpreadsheetBackColorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "1
1497
1562
  [tabindex]="tabindex"
1498
1563
  role="menuitem"
1499
1564
  class="k-item k-menu-item"
1500
- (click)="openDialog();">
1565
+ (click)="openDialog()">
1501
1566
  <span
1502
1567
  class="k-link k-menu-link">
1503
1568
  <kendo-icon-wrapper [name]="icon" [svgIcon]="svgIcon"></kendo-icon-wrapper>
@@ -1531,7 +1596,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
1531
1596
  [tabindex]="tabindex"
1532
1597
  role="menuitem"
1533
1598
  class="k-item k-menu-item"
1534
- (click)="openDialog();">
1599
+ (click)="openDialog()">
1535
1600
  <span
1536
1601
  class="k-link k-menu-link">
1537
1602
  <kendo-icon-wrapper [name]="icon" [svgIcon]="svgIcon"></kendo-icon-wrapper>
@@ -1552,20 +1617,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
1552
1617
  * @hidden
1553
1618
  */
1554
1619
  class NameBoxComponent {
1555
- constructor(ngZone, host, localization) {
1620
+ constructor(ngZone, host, localization, renderer) {
1556
1621
  this.ngZone = ngZone;
1557
1622
  this.host = host;
1558
1623
  this.localization = localization;
1624
+ this.renderer = renderer;
1559
1625
  this.hostClass = true;
1560
1626
  this.valueNormalizer = (text) => text.pipe(map((content) => ({ name: content })));
1561
1627
  }
1562
1628
  keyDownHandler() {
1563
1629
  const editor = this.spreadsheetWidget.view.nameEditor;
1564
1630
  if (editor) {
1565
- const name = this.host.nativeElement.querySelector('.k-input-inner').value;
1631
+ const name = this.inputElement.value;
1566
1632
  editor.trigger('enter', { value: name });
1567
1633
  }
1568
1634
  }
1635
+ ngAfterViewInit() {
1636
+ this.renderer.setAttribute(this.inputElement, 'title', this.title);
1637
+ this.renderer.setAttribute(this.inputElement, 'aria-label', this.title);
1638
+ }
1639
+ get inputElement() {
1640
+ return this.host.nativeElement.querySelector('.k-input-inner');
1641
+ }
1569
1642
  get current() {
1570
1643
  return {
1571
1644
  value: (val) => {
@@ -1602,7 +1675,7 @@ class NameBoxComponent {
1602
1675
  }
1603
1676
  ;
1604
1677
  }
1605
- NameBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: NameBoxComponent, deps: [{ token: i0.NgZone }, { token: i0.ElementRef }, { token: SpreadsheetLocalizationService }], target: i0.ɵɵFactoryTarget.Component });
1678
+ NameBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: NameBoxComponent, deps: [{ token: i0.NgZone }, { token: i0.ElementRef }, { token: SpreadsheetLocalizationService }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
1606
1679
  NameBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: NameBoxComponent, selector: "[kendoSpreadsheetNameBox]", inputs: { data: "data", spreadsheetWidget: "spreadsheetWidget" }, host: { listeners: { "keydown.enter": "keyDownHandler()" }, properties: { "class.k-spreadsheet-name-editor": "this.hostClass" } }, viewQueries: [{ propertyName: "combobox", first: true, predicate: ["combobox"], descendants: true }], ngImport: i0, template: `
1607
1680
  <kendo-combobox #combobox
1608
1681
  [popupSettings]="{popupClass: 'k-spreadsheet-names-popup'}"
@@ -1640,7 +1713,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
1640
1713
  ></kendo-combobox>
1641
1714
  `
1642
1715
  }]
1643
- }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i0.ElementRef }, { type: SpreadsheetLocalizationService }]; }, propDecorators: { hostClass: [{
1716
+ }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i0.ElementRef }, { type: SpreadsheetLocalizationService }, { type: i0.Renderer2 }]; }, propDecorators: { hostClass: [{
1644
1717
  type: HostBinding,
1645
1718
  args: ['class.k-spreadsheet-name-editor']
1646
1719
  }], keyDownHandler: [{
@@ -2027,7 +2100,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
2027
2100
  class MessagesDirective extends ComponentMessages {
2028
2101
  }
2029
2102
  MessagesDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: MessagesDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
2030
- MessagesDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: MessagesDirective, selector: "[kendoSpreadsheetMessages]", inputs: { home: "home", file: "file", insert: "insert", formatTab: "formatTab", saveFile: "saveFile", loadFile: "loadFile", bold: "bold", italic: "italic", underline: "underline", format: "format", fontFamily: "fontFamily", fontSize: "fontSize", undo: "undo", redo: "redo", background: "background", color: "color", gridLines: "gridLines", addColumnLeft: "addColumnLeft", addColumnRight: "addColumnRight", addRowBelow: "addRowBelow", addRowAbove: "addRowAbove", deleteColumn: "deleteColumn", deleteRow: "deleteRow", wrap: "wrap", align: "align", alignHorizontal: "alignHorizontal", alignVertical: "alignVertical", alignLeft: "alignLeft", alignCenter: "alignCenter", alignRight: "alignRight", alignJustify: "alignJustify", alignTop: "alignTop", alignMiddle: "alignMiddle", alignBottom: "alignBottom", dialogApply: "dialogApply", dialogCancel: "dialogCancel", dialogDelete: "dialogDelete", dialogRename: "dialogRename", dialogInsert: "dialogInsert", dialogRemoveLink: "dialogRemoveLink", delete: "delete", rename: "rename", nameBox: "nameBox", addSheet: "addSheet", sheetsMenu: "sheetsMenu", view: "view", merge: "merge", mergeHorizontally: "mergeHorizontally", mergeVertically: "mergeVertically", mergeAll: "mergeAll", unmerge: "unmerge", insertLink: "insertLink", increaseDecimal: "increaseDecimal", decreaseDecimal: "decreaseDecimal", increaseFontSize: "increaseFontSize", decreaseFontSize: "decreaseFontSize", openUnsupported: "openUnsupported", modifyMerged: "modifyMerged", cannotModifyDisabled: "cannotModifyDisabled", dialogOk: "dialogOk", dialogError: "dialogError", duplicateSheetName: "duplicateSheetName" }, usesInheritance: true, ngImport: i0 });
2103
+ MessagesDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: MessagesDirective, selector: "[kendoSpreadsheetMessages]", inputs: { home: "home", file: "file", insert: "insert", formatTab: "formatTab", saveFile: "saveFile", loadFile: "loadFile", bold: "bold", italic: "italic", underline: "underline", format: "format", fontFamily: "fontFamily", fontSize: "fontSize", undo: "undo", redo: "redo", background: "background", color: "color", gridLines: "gridLines", addColumnLeft: "addColumnLeft", addColumnRight: "addColumnRight", addRowBelow: "addRowBelow", addRowAbove: "addRowAbove", deleteColumn: "deleteColumn", deleteRow: "deleteRow", wrap: "wrap", align: "align", alignHorizontal: "alignHorizontal", alignVertical: "alignVertical", alignLeft: "alignLeft", alignCenter: "alignCenter", alignRight: "alignRight", alignJustify: "alignJustify", alignTop: "alignTop", alignMiddle: "alignMiddle", alignBottom: "alignBottom", dialogApply: "dialogApply", dialogCancel: "dialogCancel", dialogDelete: "dialogDelete", dialogRename: "dialogRename", dialogInsert: "dialogInsert", dialogRemoveLink: "dialogRemoveLink", delete: "delete", rename: "rename", nameBox: "nameBox", formulaInput: "formulaInput", addSheet: "addSheet", sheetsMenu: "sheetsMenu", view: "view", merge: "merge", mergeHorizontally: "mergeHorizontally", mergeVertically: "mergeVertically", mergeAll: "mergeAll", unmerge: "unmerge", insertLink: "insertLink", increaseDecimal: "increaseDecimal", decreaseDecimal: "decreaseDecimal", increaseFontSize: "increaseFontSize", decreaseFontSize: "decreaseFontSize", openUnsupported: "openUnsupported", modifyMerged: "modifyMerged", cannotModifyDisabled: "cannotModifyDisabled", dialogOk: "dialogOk", dialogError: "dialogError", duplicateSheetName: "duplicateSheetName", copy: "copy", cut: "cut", paste: "paste", hideRow: "hideRow", unhideRow: "unhideRow", hideColumn: "hideColumn", unhideColumn: "unhideColumn" }, usesInheritance: true, ngImport: i0 });
2031
2104
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: MessagesDirective, decorators: [{
2032
2105
  type: Directive,
2033
2106
  args: [{
@@ -2119,6 +2192,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
2119
2192
  type: Input
2120
2193
  }], nameBox: [{
2121
2194
  type: Input
2195
+ }], formulaInput: [{
2196
+ type: Input
2122
2197
  }], addSheet: [{
2123
2198
  type: Input
2124
2199
  }], sheetsMenu: [{
@@ -2157,6 +2232,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
2157
2232
  type: Input
2158
2233
  }], duplicateSheetName: [{
2159
2234
  type: Input
2235
+ }], copy: [{
2236
+ type: Input
2237
+ }], cut: [{
2238
+ type: Input
2239
+ }], paste: [{
2240
+ type: Input
2241
+ }], hideRow: [{
2242
+ type: Input
2243
+ }], unhideRow: [{
2244
+ type: Input
2245
+ }], hideColumn: [{
2246
+ type: Input
2247
+ }], unhideColumn: [{
2248
+ type: Input
2160
2249
  }] } });
2161
2250
 
2162
2251
  /**
@@ -2657,46 +2746,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
2657
2746
  }]
2658
2747
  }], ctorParameters: function () { return [{ type: i1$2.ToolBarDropDownButtonComponent }, { type: SpreadsheetLocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }]; } });
2659
2748
 
2660
- /**
2661
- * @hidden
2662
- */
2663
- class InsertLinkDialogComponent extends DialogContentBase {
2664
- constructor(dialog) {
2665
- super(dialog);
2666
- this.dialog = dialog;
2667
- this.urlLink = '';
2668
- }
2669
- setData(args) {
2670
- this.urlLink = args.link;
2671
- }
2672
- }
2673
- InsertLinkDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: InsertLinkDialogComponent, deps: [{ token: i1$1.DialogRef }], target: i0.ɵɵFactoryTarget.Component });
2674
- InsertLinkDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: InsertLinkDialogComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `
2675
- <form class="k-form k-form-md" method="dialog">
2676
- <div class="k-form-field">
2677
- <kendo-label [for]="textbox" text="URL"></kendo-label>
2678
- <kendo-textbox #textbox
2679
- [(value)]="urlLink">
2680
- </kendo-textbox>
2681
- </div>
2682
- </form>
2683
- `, isInline: true, components: [{ type: i2$1.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }, { type: i5.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }] });
2684
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: InsertLinkDialogComponent, decorators: [{
2685
- type: Component,
2686
- args: [{
2687
- template: `
2688
- <form class="k-form k-form-md" method="dialog">
2689
- <div class="k-form-field">
2690
- <kendo-label [for]="textbox" text="URL"></kendo-label>
2691
- <kendo-textbox #textbox
2692
- [(value)]="urlLink">
2693
- </kendo-textbox>
2694
- </div>
2695
- </form>
2696
- `
2697
- }]
2698
- }], ctorParameters: function () { return [{ type: i1$1.DialogRef }]; } });
2699
-
2700
2749
  /**
2701
2750
  * @hidden
2702
2751
  */
@@ -2706,7 +2755,10 @@ class SpreadsheetInsertLinkDirective extends SpreadsheetCommandButton {
2706
2755
  command: 'HyperlinkCommand'
2707
2756
  });
2708
2757
  this.dialogService = dialogService;
2709
- spreadsheetService.selectionChanged.subscribe(range => this.currentRange = range);
2758
+ this.subs.add(spreadsheetService.selectionChanged.subscribe(range => this.currentRange = range));
2759
+ }
2760
+ ngOnDestroy() {
2761
+ this.subs.unsubscribe();
2710
2762
  }
2711
2763
  clickHandler() {
2712
2764
  const sheet = this.spreadsheetService.spreadsheet.activeSheet();
@@ -3040,7 +3092,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
3040
3092
  * Represents the [Kendo UI Spreadsheet component for Angular]({% slug overview_spreadsheet %}).
3041
3093
  */
3042
3094
  class SpreadsheetComponent {
3043
- constructor(ngZone, intl, host, localization, spreadsheetService, toolsService, errorService) {
3095
+ constructor(ngZone, intl, host, localization, spreadsheetService, toolsService, errorService, dialogService) {
3044
3096
  this.ngZone = ngZone;
3045
3097
  this.intl = intl;
3046
3098
  this.host = host;
@@ -3048,6 +3100,7 @@ class SpreadsheetComponent {
3048
3100
  this.spreadsheetService = spreadsheetService;
3049
3101
  this.toolsService = toolsService;
3050
3102
  this.errorService = errorService;
3103
+ this.dialogService = dialogService;
3051
3104
  this.hostClass = true;
3052
3105
  this.role = 'application';
3053
3106
  /**
@@ -3123,10 +3176,9 @@ class SpreadsheetComponent {
3123
3176
  this.formulaFxIcon = formulaFxIcon;
3124
3177
  this.folderOpenIcon = folderOpenIcon;
3125
3178
  this.downloadIcon = downloadIcon;
3126
- /**
3127
- * @hidden
3128
- */
3129
3179
  this.showLicenseWatermark = false;
3180
+ this.contextMenuItems = [];
3181
+ this.subs = new Subscription();
3130
3182
  this.onChange = (e) => {
3131
3183
  hasObservers(this.change) && this.change.emit(e);
3132
3184
  this.spreadsheetService.selectionChanged.next(e.range);
@@ -3193,7 +3245,7 @@ class SpreadsheetComponent {
3193
3245
  this.ngZone.onStable.pipe(take(1)).subscribe(() => {
3194
3246
  const normalizedItems = items.map(item => ({
3195
3247
  active: item.active,
3196
- text: this.messageFor(item.id),
3248
+ text: item.id === 'format' ? this.messageFor('formatTab') : this.messageFor(item.id),
3197
3249
  cssClass: item.active ? 'k-active' : null,
3198
3250
  id: item.id
3199
3251
  }));
@@ -3245,6 +3297,7 @@ class SpreadsheetComponent {
3245
3297
  spreadsheet.bind('excelExport', this.onExcelExport);
3246
3298
  spreadsheet.view.bind('update', this.updateState);
3247
3299
  spreadsheet.view.bind('message', this.onMessage);
3300
+ spreadsheet.bind('contextmenu', this.onContextMenu.bind(this));
3248
3301
  const sheet = spreadsheet.activeSheet();
3249
3302
  if (sheet) {
3250
3303
  this.updateState({ range: sheet.range(sheet.activeCell()) });
@@ -3257,8 +3310,9 @@ class SpreadsheetComponent {
3257
3310
  });
3258
3311
  }
3259
3312
  });
3260
- this.spreadsheetService.sheetsChanged.subscribe(this.onSheetsChanged.bind(this));
3261
- this.spreadsheetService.activeSheetChanged.subscribe(this.onActiveSheetChanged.bind(this));
3313
+ this.subs.add(this.spreadsheetService.sheetsChanged.subscribe(this.onSheetsChanged.bind(this)));
3314
+ this.subs.add(this.spreadsheetService.activeSheetChanged.subscribe(this.onActiveSheetChanged.bind(this)));
3315
+ this.subs.add(this.spreadsheetService.selectionChanged.subscribe(range => this.currentRange = range));
3262
3316
  this.spreadsheetService.dialogContainer = this.dialogContainer;
3263
3317
  });
3264
3318
  }
@@ -3282,6 +3336,85 @@ class SpreadsheetComponent {
3282
3336
  this.spreadsheetWidget.fromJSON(newOptions);
3283
3337
  }
3284
3338
  }
3339
+ ngOnDestroy() {
3340
+ this.subs.unsubscribe();
3341
+ }
3342
+ /**
3343
+ * @hidden
3344
+ */
3345
+ onContextMenu(e) {
3346
+ if (e.targetType === 'topcorner') {
3347
+ return;
3348
+ }
3349
+ const selection = this.spreadsheetWidget.activeSheet().select();
3350
+ const { topLeft, bottomRight } = selection;
3351
+ const isRange = e.targetType === 'cell' && (topLeft.row !== bottomRight.row || topLeft.col !== bottomRight.col);
3352
+ const targetType = isRange ? 'range' : e.targetType;
3353
+ this.contextMenuItems = this.contextMenuItemsForTarget(targetType, e.showUnhide, e.showUnmerge);
3354
+ this.contextMenu.show({ top: e.originalEvent.pageY, left: e.originalEvent.pageX });
3355
+ }
3356
+ /**
3357
+ * @hidden
3358
+ */
3359
+ onContextMenuSelect(e) {
3360
+ let command;
3361
+ switch (e.item.id) {
3362
+ case 'cut':
3363
+ command = { command: 'ToolbarCutCommand', options: { workbook: this.spreadsheetWidget.workbook } };
3364
+ break;
3365
+ case 'copy':
3366
+ command = { command: 'ToolbarCopyCommand', options: { workbook: this.spreadsheetWidget.workbook } };
3367
+ break;
3368
+ case 'unmerge':
3369
+ command = { command: 'MergeCellCommand', options: { value: 'unmerge' } };
3370
+ break;
3371
+ case 'mergeAll':
3372
+ command = { command: 'MergeCellCommand', options: { value: 'cells' } };
3373
+ break;
3374
+ case 'mergeHorizontally':
3375
+ command = { command: 'MergeCellCommand', options: { value: 'horizontally' } };
3376
+ break;
3377
+ case 'mergeVertically':
3378
+ command = { command: 'MergeCellCommand', options: { value: 'vertically' } };
3379
+ break;
3380
+ case 'hideRow':
3381
+ command = { command: 'HideLineCommand', options: { axis: 'row' } };
3382
+ break;
3383
+ case 'hideColumn':
3384
+ command = { command: 'HideLineCommand', options: { axis: 'column' } };
3385
+ break;
3386
+ case 'unhideRow':
3387
+ command = { command: 'UnHideLineCommand', options: { axis: 'row' } };
3388
+ break;
3389
+ case 'unhideColumn':
3390
+ command = { command: 'UnHideLineCommand', options: { axis: 'column' } };
3391
+ break;
3392
+ case 'deleteRow':
3393
+ command = { command: 'DeleteRowCommand' };
3394
+ break;
3395
+ case 'deleteColumn':
3396
+ command = { command: 'DeleteColumnCommand' };
3397
+ break;
3398
+ case 'insertLink':
3399
+ this.openLinkDialog();
3400
+ break;
3401
+ case 'addRowAbove':
3402
+ command = { command: 'AddRowCommand', options: { value: 'above' } };
3403
+ break;
3404
+ case 'addRowBelow':
3405
+ command = { command: 'AddRowCommand', options: { value: 'below' } };
3406
+ break;
3407
+ case 'addColumnLeft':
3408
+ command = { command: 'AddColumnCommand', options: { value: 'left' } };
3409
+ break;
3410
+ case 'addColumnRight':
3411
+ command = { command: 'AddColumnCommand', options: { value: 'right' } };
3412
+ break;
3413
+ }
3414
+ if (command) {
3415
+ this.spreadsheetWidget.executeCommand(command);
3416
+ }
3417
+ }
3285
3418
  /**
3286
3419
  * @hidden
3287
3420
  */
@@ -3322,8 +3455,163 @@ class SpreadsheetComponent {
3322
3455
  }
3323
3456
  }), { columns: this.columns, columnWidth: this.columnWidth, defaultCellStyle: this.defaultCellStyle, excel: this.excel, headerHeight: this.headerHeight, headerWidth: this.headerWidth, images: this.images, rowHeight: this.rowHeight, rows: this.rows, formulaBarInputRef: { current: this.formulaBarInputRef.current }, formulaCellInputRef: { current: this.formulaCellInputRef.current }, nameBoxRef: { current: this.nameBoxRef.current } });
3324
3457
  }
3458
+ contextMenuItemsForTarget(target, unhide, unmerge) {
3459
+ const commonItems = [{
3460
+ text: this.messageFor('copy'),
3461
+ icon: commandIcons.copy,
3462
+ svgIcon: commandSVGIcons.copy,
3463
+ id: 'copy'
3464
+ }, {
3465
+ text: this.messageFor('cut'),
3466
+ icon: commandIcons.cut,
3467
+ svgIcon: commandSVGIcons.cut,
3468
+ id: 'cut'
3469
+ }, {
3470
+ text: this.messageFor('paste'),
3471
+ icon: commandIcons.paste,
3472
+ svgIcon: commandSVGIcons.paste,
3473
+ id: 'paste',
3474
+ disabled: true
3475
+ }, {
3476
+ separator: true
3477
+ }, {
3478
+ text: this.messageFor('mergeAll'),
3479
+ icon: commandIcons.mergeAll,
3480
+ svgIcon: commandSVGIcons.mergeAll,
3481
+ id: 'mergeAll',
3482
+ }, {
3483
+ text: this.messageFor('mergeHorizontally'),
3484
+ icon: commandIcons.mergeHorizontally,
3485
+ svgIcon: commandSVGIcons.mergeHorizontally,
3486
+ id: 'mergeHorizontally',
3487
+ }, {
3488
+ text: this.messageFor('mergeVertically'),
3489
+ icon: commandIcons.mergeVertically,
3490
+ svgIcon: commandSVGIcons.mergeVertically,
3491
+ id: 'mergeVertically',
3492
+ }, {
3493
+ text: this.messageFor('unmerge'),
3494
+ icon: commandIcons.unmerge,
3495
+ svgIcon: commandSVGIcons.unmerge,
3496
+ id: 'unmerge',
3497
+ disabled: !unmerge
3498
+ }, {
3499
+ separator: true
3500
+ }, {
3501
+ text: this.messageFor('insertLink'),
3502
+ icon: commandIcons.insertLink,
3503
+ svgIcon: commandSVGIcons.insertLink,
3504
+ id: 'insertLink'
3505
+ }];
3506
+ if (target === 'rowheader') {
3507
+ commonItems.push({
3508
+ separator: true
3509
+ }, {
3510
+ text: this.messageFor('addRowAbove'),
3511
+ icon: commandIcons.addRowAbove,
3512
+ svgIcon: commandSVGIcons.addRowAbove,
3513
+ id: 'addRowAbove',
3514
+ }, {
3515
+ text: this.messageFor('addRowBelow'),
3516
+ icon: commandIcons.addRowBelow,
3517
+ svgIcon: commandSVGIcons.addRowBelow,
3518
+ id: 'addRowBelow',
3519
+ }, {
3520
+ text: this.messageFor('deleteRow'),
3521
+ icon: commandIcons.deleteRow,
3522
+ svgIcon: commandSVGIcons.deleteRow,
3523
+ id: 'deleteRow',
3524
+ }, {
3525
+ text: this.messageFor('hideRow'),
3526
+ icon: commandIcons.hideRow,
3527
+ svgIcon: commandSVGIcons.hideRow,
3528
+ id: 'hideRow',
3529
+ }, {
3530
+ text: this.messageFor('unhideRow'),
3531
+ icon: commandIcons.unhideRow,
3532
+ svgIcon: commandSVGIcons.unhideRow,
3533
+ id: 'unhideRow',
3534
+ disabled: !unhide
3535
+ });
3536
+ }
3537
+ if (target === 'columnheader') {
3538
+ commonItems.push({
3539
+ separator: true
3540
+ }, {
3541
+ text: this.messageFor('addColumnLeft'),
3542
+ icon: commandIcons.addColumnLeft,
3543
+ svgIcon: commandSVGIcons.addColumnLeft,
3544
+ id: 'addColumnLeft',
3545
+ }, {
3546
+ text: this.messageFor('addColumnRight'),
3547
+ icon: commandIcons.addColumnRight,
3548
+ svgIcon: commandSVGIcons.addColumnRight,
3549
+ id: 'addColumnRight',
3550
+ }, {
3551
+ text: this.messageFor('deleteColumn'),
3552
+ icon: commandIcons.deleteColumn,
3553
+ svgIcon: commandSVGIcons.deleteColumn,
3554
+ id: 'deleteColumn',
3555
+ }, {
3556
+ text: this.messageFor('hideColumn'),
3557
+ icon: commandIcons.hideColumn,
3558
+ svgIcon: commandSVGIcons.hideColumn,
3559
+ id: 'hideColumn',
3560
+ }, {
3561
+ text: this.messageFor('unhideColumn'),
3562
+ icon: commandIcons.unhideColumn,
3563
+ svgIcon: commandSVGIcons.unhideColumn,
3564
+ id: 'unhideColumn',
3565
+ disabled: !unhide
3566
+ });
3567
+ }
3568
+ return commonItems;
3569
+ }
3570
+ openLinkDialog() {
3571
+ var _a, _b;
3572
+ const hasLink = isPresent((_a = this.currentRange) === null || _a === void 0 ? void 0 : _a.link());
3573
+ const dialogSettings = {
3574
+ appendTo: this.spreadsheetService.dialogContainer,
3575
+ title: this.localization.get('insertLink'),
3576
+ content: InsertLinkDialogComponent,
3577
+ actions: [{
3578
+ text: this.localization.get('dialogInsert'),
3579
+ themeColor: 'primary'
3580
+ }, {
3581
+ text: this.localization.get('dialogCancel')
3582
+ },
3583
+ 'spacer', {
3584
+ text: this.localization.get('dialogRemoveLink'),
3585
+ themeColor: 'primary',
3586
+ fillMode: 'clear',
3587
+ cssClass: hasLink ? '' : 'k-disabled'
3588
+ }],
3589
+ actionsLayout: 'start',
3590
+ width: 400,
3591
+ autoFocusedElement: '.k-textbox > .k-input-inner'
3592
+ };
3593
+ const dialog = this.dialogService.open(dialogSettings);
3594
+ const dialogInstance = dialog.dialog.instance;
3595
+ const dialogContent = dialog.content.instance;
3596
+ if (hasLink) {
3597
+ dialogContent.setData({ link: (_b = this.currentRange) === null || _b === void 0 ? void 0 : _b.link() });
3598
+ }
3599
+ dialogInstance.action.pipe(take(1)).subscribe((event) => {
3600
+ if (event.text === this.localization.get('dialogCancel')) {
3601
+ return;
3602
+ }
3603
+ let link = null;
3604
+ if (event.text === this.localization.get('dialogInsert')) {
3605
+ link = dialogContent.urlLink || null;
3606
+ }
3607
+ this.spreadsheetService.spreadsheet.executeCommand({
3608
+ command: 'HyperlinkCommand',
3609
+ options: { link }
3610
+ });
3611
+ });
3612
+ }
3325
3613
  }
3326
- 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 }], target: i0.ɵɵFactoryTarget.Component });
3614
+ 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 });
3327
3615
  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: [
3328
3616
  SpreadsheetLocalizationService,
3329
3617
  {
@@ -3337,7 +3625,7 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
3337
3625
  SpreadsheetToolsService,
3338
3626
  PopupService,
3339
3627
  ErrorHandlingService
3340
- ], viewQueries: [{ propertyName: "formulaBarInputRef", first: true, predicate: ["formulaBar"], descendants: true, read: FormulaInputDirective }, { propertyName: "formulaCellInputRef", first: true, predicate: ["formulaCell"], descendants: true, read: FormulaInputDirective }, { propertyName: "nameBoxRef", first: true, predicate: ["nameBox"], descendants: true }, { propertyName: "dialogContainer", first: true, predicate: ["dialogContainer"], descendants: true, read: ViewContainerRef }], exportAs: ["kendo-spreadsheet"], usesOnChanges: true, ngImport: i0, template: `
3628
+ ], viewQueries: [{ propertyName: "formulaBarInputRef", first: true, predicate: ["formulaBar"], descendants: true, read: FormulaInputDirective }, { propertyName: "formulaCellInputRef", first: true, predicate: ["formulaCell"], descendants: true, read: FormulaInputDirective }, { propertyName: "nameBoxRef", first: true, predicate: ["nameBox"], descendants: true }, { propertyName: "dialogContainer", first: true, predicate: ["dialogContainer"], descendants: true, read: ViewContainerRef }, { propertyName: "contextMenu", first: true, predicate: ["contextMenu"], descendants: true }], exportAs: ["kendo-spreadsheet"], usesOnChanges: true, ngImport: i0, template: `
3341
3629
  <ng-container
3342
3630
  kendoSpreadsheetLocalizedMessages
3343
3631
  i18n-background="kendo.spreadsheet.background|The title of the tool that changes the text background color."
@@ -3448,6 +3736,8 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
3448
3736
  delete="Delete Sheet"
3449
3737
  i18n-nameBox="kendo.spreadsheet.nameBox|The title of the Name Box input."
3450
3738
  nameBox="Name Box"
3739
+ i18n-formulaInput="kendo.spreadsheet.formulaInput|The title of the Formula input."
3740
+ formulaInput="Formula Input"
3451
3741
  i18n-addSheet="kendo.spreadsheet.addSheet|The title of the Add new sheet button."
3452
3742
  addSheet="Add New Sheet"
3453
3743
  i18n-sheetsMenu="kendo.spreadsheet.sheetsMenu|The title of the Sheets menu button."
@@ -3464,7 +3754,20 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
3464
3754
  dialogError="Error"
3465
3755
  i18n-duplicateSheetName="kendo.spreadsheet.duplicateSheetName|The content of the dialog that warns about duplicated sheet name."
3466
3756
  duplicateSheetName="There is an existing sheet with this name. Please enter another name."
3467
- >
3757
+ i18n-copy="kendo.spreadsheet.copy|The Copy command text."
3758
+ copy="Copy"
3759
+ i18n-cut="kendo.spreadsheet.cut|The Cut command text."
3760
+ cut="Cut"
3761
+ i18n-paste="kendo.spreadsheet.paste|The Paste command text."
3762
+ paste="Paste (use Ctrl/⌘ + V)"
3763
+ i18n-hideRow="kendo.spreadsheet.hideRow|The Hide row command text."
3764
+ hideRow="Hide"
3765
+ i18n-unhideRow="kendo.spreadsheet.unhideRow|The Unhide row command text."
3766
+ unhideRow="Unhide"
3767
+ i18n-hideColumn="kendo.spreadsheet.hideColumn|The Hide column command text."
3768
+ hideColumn="Hide"
3769
+ i18n-unhideColumn="kendo.spreadsheet.unhideColumn|The Unhide column command text."
3770
+ unhideColumn="Unhide">
3468
3771
  </ng-container>
3469
3772
  <div class="k-spreadsheet-header">
3470
3773
  <kendo-menu kendoSpreadsheetMenu (select)="onMenuItemSelect($event)">
@@ -3563,8 +3866,13 @@ SpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
3563
3866
  </div>
3564
3867
  <ng-container #dialogContainer></ng-container>
3565
3868
 
3869
+ <kendo-contextmenu
3870
+ #contextMenu
3871
+ [items]="contextMenuItems"
3872
+ (select)="onContextMenuSelect($event)"></kendo-contextmenu>
3873
+
3566
3874
  <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
3567
- `, isInline: true, components: [{ type: i6$1.MenuComponent, selector: "kendo-menu", inputs: ["menuItemTemplate", "ariaRole", "menuItemLinkTemplate"], outputs: ["select", "open", "close"], exportAs: ["kendoMenu"] }, { type: i6$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: 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]" }] });
3875
+ `, 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]" }] });
3568
3876
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: SpreadsheetComponent, decorators: [{
3569
3877
  type: Component,
3570
3878
  args: [{
@@ -3695,6 +4003,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
3695
4003
  delete="Delete Sheet"
3696
4004
  i18n-nameBox="kendo.spreadsheet.nameBox|The title of the Name Box input."
3697
4005
  nameBox="Name Box"
4006
+ i18n-formulaInput="kendo.spreadsheet.formulaInput|The title of the Formula input."
4007
+ formulaInput="Formula Input"
3698
4008
  i18n-addSheet="kendo.spreadsheet.addSheet|The title of the Add new sheet button."
3699
4009
  addSheet="Add New Sheet"
3700
4010
  i18n-sheetsMenu="kendo.spreadsheet.sheetsMenu|The title of the Sheets menu button."
@@ -3711,7 +4021,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
3711
4021
  dialogError="Error"
3712
4022
  i18n-duplicateSheetName="kendo.spreadsheet.duplicateSheetName|The content of the dialog that warns about duplicated sheet name."
3713
4023
  duplicateSheetName="There is an existing sheet with this name. Please enter another name."
3714
- >
4024
+ i18n-copy="kendo.spreadsheet.copy|The Copy command text."
4025
+ copy="Copy"
4026
+ i18n-cut="kendo.spreadsheet.cut|The Cut command text."
4027
+ cut="Cut"
4028
+ i18n-paste="kendo.spreadsheet.paste|The Paste command text."
4029
+ paste="Paste (use Ctrl/⌘ + V)"
4030
+ i18n-hideRow="kendo.spreadsheet.hideRow|The Hide row command text."
4031
+ hideRow="Hide"
4032
+ i18n-unhideRow="kendo.spreadsheet.unhideRow|The Unhide row command text."
4033
+ unhideRow="Unhide"
4034
+ i18n-hideColumn="kendo.spreadsheet.hideColumn|The Hide column command text."
4035
+ hideColumn="Hide"
4036
+ i18n-unhideColumn="kendo.spreadsheet.unhideColumn|The Unhide column command text."
4037
+ unhideColumn="Unhide">
3715
4038
  </ng-container>
3716
4039
  <div class="k-spreadsheet-header">
3717
4040
  <kendo-menu kendoSpreadsheetMenu (select)="onMenuItemSelect($event)">
@@ -3810,10 +4133,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
3810
4133
  </div>
3811
4134
  <ng-container #dialogContainer></ng-container>
3812
4135
 
4136
+ <kendo-contextmenu
4137
+ #contextMenu
4138
+ [items]="contextMenuItems"
4139
+ (select)="onContextMenuSelect($event)"></kendo-contextmenu>
4140
+
3813
4141
  <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
3814
4142
  `,
3815
4143
  }]
3816
- }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i1$4.IntlService }, { type: i0.ElementRef }, { type: i2.LocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }, { type: ErrorHandlingService }]; }, propDecorators: { formulaBarInputRef: [{
4144
+ }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i1$4.IntlService }, { type: i0.ElementRef }, { type: i2.LocalizationService }, { type: SpreadsheetService }, { type: SpreadsheetToolsService }, { type: ErrorHandlingService }, { type: i1$1.DialogService }]; }, propDecorators: { formulaBarInputRef: [{
3817
4145
  type: ViewChild,
3818
4146
  args: ['formulaBar', { read: FormulaInputDirective }]
3819
4147
  }], formulaCellInputRef: [{
@@ -3825,6 +4153,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
3825
4153
  }], dialogContainer: [{
3826
4154
  type: ViewChild,
3827
4155
  args: ['dialogContainer', { read: ViewContainerRef }]
4156
+ }], contextMenu: [{
4157
+ type: ViewChild,
4158
+ args: ['contextMenu']
3828
4159
  }], hostClass: [{
3829
4160
  type: HostBinding,
3830
4161
  args: ['class.k-spreadsheet']
@@ -4082,7 +4413,7 @@ SpreadsheetModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", versi
4082
4413
  EventsModule,
4083
4414
  IconsModule,
4084
4415
  IntlModule,
4085
- MenuModule,
4416
+ MenusModule,
4086
4417
  PopupModule,
4087
4418
  TabStripModule,
4088
4419
  ToolBarModule,
@@ -4128,7 +4459,7 @@ SpreadsheetModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", versi
4128
4459
  EventsModule,
4129
4460
  IconsModule,
4130
4461
  IntlModule,
4131
- MenuModule,
4462
+ MenusModule,
4132
4463
  PopupModule,
4133
4464
  TabStripModule,
4134
4465
  ToolBarModule,
@@ -4150,7 +4481,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
4150
4481
  EventsModule,
4151
4482
  IconsModule,
4152
4483
  IntlModule,
4153
- MenuModule,
4484
+ MenusModule,
4154
4485
  PopupModule,
4155
4486
  TabStripModule,
4156
4487
  ToolBarModule,