@progress/kendo-angular-grid 21.1.1-develop.2 → 21.2.0-develop.10

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.
Files changed (58) hide show
  1. package/codemods/utils.js +805 -394
  2. package/codemods/v20/grid-kendogridgroupbinding.js +8 -11
  3. package/esm2022/adaptiveness/adaptive-renderer.component.mjs +850 -756
  4. package/esm2022/aggregates/status-bar.component.mjs +13 -11
  5. package/esm2022/column-menu/column-chooser-content.component.mjs +133 -123
  6. package/esm2022/column-menu/column-list.component.mjs +64 -61
  7. package/esm2022/column-menu/column-menu-autosize-all.component.mjs +12 -11
  8. package/esm2022/column-menu/column-menu-autosize.component.mjs +12 -11
  9. package/esm2022/column-menu/column-menu-item.component.mjs +221 -85
  10. package/esm2022/column-menu/column-menu-position.component.mjs +46 -43
  11. package/esm2022/column-menu/column-menu.component.mjs +401 -315
  12. package/esm2022/databinding.directive.mjs +1 -0
  13. package/esm2022/editing/add-command.directive.mjs +27 -17
  14. package/esm2022/editing/cancel-command.directive.mjs +27 -17
  15. package/esm2022/editing/edit-command.directive.mjs +27 -17
  16. package/esm2022/editing/form/form-formfield.component.mjs +97 -70
  17. package/esm2022/editing/form/form.component.mjs +77 -61
  18. package/esm2022/editing/remove-command.directive.mjs +27 -17
  19. package/esm2022/editing/save-command.directive.mjs +27 -17
  20. package/esm2022/excel/excel-command.directive.mjs +27 -17
  21. package/esm2022/filtering/cell/filter-cell-operators.component.mjs +20 -17
  22. package/esm2022/filtering/cell/filter-cell.component.mjs +35 -33
  23. package/esm2022/filtering/filter-row.component.mjs +37 -29
  24. package/esm2022/filtering/menu/boolean-filter-menu.component.mjs +34 -31
  25. package/esm2022/filtering/menu/date-filter-menu-input.component.mjs +8 -7
  26. package/esm2022/filtering/menu/date-filter-menu.component.mjs +52 -49
  27. package/esm2022/filtering/menu/filter-menu-container.component.mjs +115 -92
  28. package/esm2022/filtering/menu/numeric-filter-menu.component.mjs +50 -47
  29. package/esm2022/filtering/menu/string-filter-menu.component.mjs +36 -33
  30. package/esm2022/filtering/multicheckbox-filter.component.mjs +54 -43
  31. package/esm2022/grid.component.mjs +1579 -1483
  32. package/esm2022/grouping/group-header.component.mjs +113 -89
  33. package/esm2022/grouping/group-panel.component.mjs +84 -77
  34. package/esm2022/index.mjs +1 -0
  35. package/esm2022/navigation/navigation.service.mjs +4 -4
  36. package/esm2022/package-metadata.mjs +2 -2
  37. package/esm2022/pdf/pdf-command.directive.mjs +27 -17
  38. package/esm2022/rendering/cell.component.mjs +411 -365
  39. package/esm2022/rendering/common/col-group.component.mjs +25 -15
  40. package/esm2022/rendering/common/loading.component.mjs +23 -19
  41. package/esm2022/rendering/details/detail-template.directive.mjs +6 -4
  42. package/esm2022/rendering/footer/footer.component.mjs +128 -112
  43. package/esm2022/rendering/header/header.component.mjs +414 -353
  44. package/esm2022/rendering/list.component.mjs +227 -204
  45. package/esm2022/rendering/table-body.component.mjs +553 -493
  46. package/esm2022/rendering/toolbar/toolbar.component.mjs +13 -11
  47. package/esm2022/rendering/toolbar/tools/ai-assistant/ai-assistant.component.mjs +86 -79
  48. package/esm2022/rendering/toolbar/tools/filter-toolbar-tool.component.mjs +54 -51
  49. package/esm2022/rendering/toolbar/tools/group-toolbar-tool.component.mjs +141 -118
  50. package/esm2022/rendering/toolbar/tools/sort-toolbar-tool.component.mjs +72 -65
  51. package/fesm2022/progress-kendo-angular-grid.mjs +6462 -5545
  52. package/filtering/menu/date-filter-menu-input.component.d.ts +1 -2
  53. package/filtering/menu/filter-menu-container.component.d.ts +2 -2
  54. package/index.d.ts +1 -0
  55. package/package.json +25 -26
  56. package/rendering/details/detail-template.directive.d.ts +6 -4
  57. package/schematics/ngAdd/index.js +7 -7
  58. package/codemods/template-transformer/index.js +0 -93
package/esm2022/filtering/multicheckbox-filter.component.mjs CHANGED
@@ -4,7 +4,6 @@
4
4
  *-------------------------------------------------------------------------------------------*/
5
5
  import { Component, Input, EventEmitter, Output, ViewChild } from '@angular/core';
6
6
  import { filterBy } from '@progress/kendo-data-query';
7
- import { NgFor, NgIf } from '@angular/common';
8
7
  import { CheckBoxComponent, TextBoxComponent, TextBoxPrefixTemplateDirective } from '@progress/kendo-angular-inputs';
9
8
  import { IconWrapperComponent } from '@progress/kendo-angular-icons';
10
9
  import { searchIcon } from '@progress/kendo-svg-icons';
@@ -233,75 +232,87 @@ export class MultiCheckboxFilterComponent {
233
232
  }
234
233
  }
235
234
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MultiCheckboxFilterComponent, deps: [{ token: i1.ContextService }, { token: i2.LocalDataChangesService }], target: i0.ɵɵFactoryTarget.Component });
236
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: MultiCheckboxFilterComponent, isStandalone: true, selector: "kendo-grid-multicheckbox-filter", inputs: { column: "column" }, outputs: { filterChange: "filterChange" }, viewQueries: [{ propertyName: "filterInput", first: true, predicate: FilterInputDirective, descendants: true }], ngImport: i0, template: `
237
- <kendo-textbox *ngIf="normalizedFilterVariant.search"
235
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: MultiCheckboxFilterComponent, isStandalone: true, selector: "kendo-grid-multicheckbox-filter", inputs: { column: "column" }, outputs: { filterChange: "filterChange" }, viewQueries: [{ propertyName: "filterInput", first: true, predicate: FilterInputDirective, descendants: true }], ngImport: i0, template: `
236
+ @if (normalizedFilterVariant.search) {
237
+ <kendo-textbox
238
238
  kendoFilterInput
239
239
  class="k-searchbox"
240
240
  [placeholder]="messageFor('multiCheckboxFilterSearchPlaceholder')">
241
241
  <ng-template kendoTextBoxPrefixTemplate>
242
- <kendo-icon-wrapper innerCssClass="k-input-icon" name="search" [svgIcon]="searchIcon"></kendo-icon-wrapper>
242
+ <kendo-icon-wrapper innerCssClass="k-input-icon" name="search" [svgIcon]="searchIcon"></kendo-icon-wrapper>
243
243
  </ng-template>
244
- </kendo-textbox>
244
+ </kendo-textbox>
245
+ }
245
246
  <ul class="k-reset k-multicheck-wrap">
246
- <li class="k-item k-check-all-wrap" *ngIf="showSelectAll">
247
- <label class="k-label k-checkbox-label" role="option">
248
- <kendo-checkbox
249
- [checkedState]="selectAllChecked"
250
- (checkedStateChange)="handleCheckBoxChange($event, null, true)">
251
- </kendo-checkbox>
252
- <span>{{ messageFor('multiCheckboxFilterSelectAllLabel') }}</span>
253
- </label>
247
+ @if (showSelectAll) {
248
+ <li class="k-item k-check-all-wrap">
249
+ <label class="k-label k-checkbox-label" role="option">
250
+ <kendo-checkbox
251
+ [checkedState]="selectAllChecked"
252
+ (checkedStateChange)="handleCheckBoxChange($event, null, true)">
253
+ </kendo-checkbox>
254
+ <span>{{ messageFor('multiCheckboxFilterSelectAllLabel') }}</span>
255
+ </label>
254
256
  </li>
255
- <li class="k-item" *ngFor="let item of listData">
256
- <label class="k-label k-checkbox-label" role="option">
257
- <kendo-checkbox
258
- [checkedState]="isItemSelected(item)"
259
- (checkedStateChange)="handleCheckBoxChange($event, item)">
260
- </kendo-checkbox>
261
- <span>{{ item | format: column.format }}</span>
262
- </label>
257
+ }
258
+ @for (item of listData; track item) {
259
+ <li class="k-item">
260
+ <label class="k-label k-checkbox-label" role="option">
261
+ <kendo-checkbox
262
+ [checkedState]="isItemSelected(item)"
263
+ (checkedStateChange)="handleCheckBoxChange($event, item)">
264
+ </kendo-checkbox>
265
+ <span>{{ item | format: column.format }}</span>
266
+ </label>
263
267
  </li>
268
+ }
264
269
  </ul>
265
270
  <div class="k-filter-selected-items">{{selectedItemsMessage}}</div>
266
- `, isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CheckBoxComponent, selector: "kendo-checkbox", inputs: ["checkedState", "rounded"], outputs: ["checkedStateChange"], exportAs: ["kendoCheckBox"] }, { kind: "component", type: TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "directive", type: TextBoxPrefixTemplateDirective, selector: "[kendoTextBoxPrefixTemplate]", inputs: ["showSeparator"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "pipe", type: FormatPipe, name: "format" }, { kind: "directive", type: FilterInputDirective, selector: "[kendoFilterInput]", inputs: ["filterDelay", "columnLabel", "value"] }] });
271
+ `, isInline: true, dependencies: [{ kind: "component", type: CheckBoxComponent, selector: "kendo-checkbox", inputs: ["checkedState", "rounded"], outputs: ["checkedStateChange"], exportAs: ["kendoCheckBox"] }, { kind: "component", type: TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "directive", type: TextBoxPrefixTemplateDirective, selector: "[kendoTextBoxPrefixTemplate]", inputs: ["showSeparator"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "pipe", type: FormatPipe, name: "format" }, { kind: "directive", type: FilterInputDirective, selector: "[kendoFilterInput]", inputs: ["filterDelay", "columnLabel", "value"] }] });
267
272
  }
268
273
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MultiCheckboxFilterComponent, decorators: [{
269
274
  type: Component,
270
275
  args: [{
271
276
  selector: 'kendo-grid-multicheckbox-filter',
272
277
  template: `
273
- <kendo-textbox *ngIf="normalizedFilterVariant.search"
278
+ @if (normalizedFilterVariant.search) {
279
+ <kendo-textbox
274
280
  kendoFilterInput
275
281
  class="k-searchbox"
276
282
  [placeholder]="messageFor('multiCheckboxFilterSearchPlaceholder')">
277
283
  <ng-template kendoTextBoxPrefixTemplate>
278
- <kendo-icon-wrapper innerCssClass="k-input-icon" name="search" [svgIcon]="searchIcon"></kendo-icon-wrapper>
284
+ <kendo-icon-wrapper innerCssClass="k-input-icon" name="search" [svgIcon]="searchIcon"></kendo-icon-wrapper>
279
285
  </ng-template>
280
- </kendo-textbox>
286
+ </kendo-textbox>
287
+ }
281
288
  <ul class="k-reset k-multicheck-wrap">
282
- <li class="k-item k-check-all-wrap" *ngIf="showSelectAll">
283
- <label class="k-label k-checkbox-label" role="option">
284
- <kendo-checkbox
285
- [checkedState]="selectAllChecked"
286
- (checkedStateChange)="handleCheckBoxChange($event, null, true)">
287
- </kendo-checkbox>
288
- <span>{{ messageFor('multiCheckboxFilterSelectAllLabel') }}</span>
289
- </label>
289
+ @if (showSelectAll) {
290
+ <li class="k-item k-check-all-wrap">
291
+ <label class="k-label k-checkbox-label" role="option">
292
+ <kendo-checkbox
293
+ [checkedState]="selectAllChecked"
294
+ (checkedStateChange)="handleCheckBoxChange($event, null, true)">
295
+ </kendo-checkbox>
296
+ <span>{{ messageFor('multiCheckboxFilterSelectAllLabel') }}</span>
297
+ </label>
290
298
  </li>
291
- <li class="k-item" *ngFor="let item of listData">
292
- <label class="k-label k-checkbox-label" role="option">
293
- <kendo-checkbox
294
- [checkedState]="isItemSelected(item)"
295
- (checkedStateChange)="handleCheckBoxChange($event, item)">
296
- </kendo-checkbox>
297
- <span>{{ item | format: column.format }}</span>
298
- </label>
299
+ }
300
+ @for (item of listData; track item) {
301
+ <li class="k-item">
302
+ <label class="k-label k-checkbox-label" role="option">
303
+ <kendo-checkbox
304
+ [checkedState]="isItemSelected(item)"
305
+ (checkedStateChange)="handleCheckBoxChange($event, item)">
306
+ </kendo-checkbox>
307
+ <span>{{ item | format: column.format }}</span>
308
+ </label>
299
309
  </li>
310
+ }
300
311
  </ul>
301
312
  <div class="k-filter-selected-items">{{selectedItemsMessage}}</div>
302
- `,
313
+ `,
303
314
  standalone: true,
304
- imports: [NgFor, NgIf, CheckBoxComponent, TextBoxComponent, TextBoxPrefixTemplateDirective, IconWrapperComponent, FormatPipe, FilterInputDirective]
315
+ imports: [CheckBoxComponent, TextBoxComponent, TextBoxPrefixTemplateDirective, IconWrapperComponent, FormatPipe, FilterInputDirective]
305
316
  }]
306
317
  }], ctorParameters: () => [{ type: i1.ContextService }, { type: i2.LocalDataChangesService }], propDecorators: { column: [{
307
318
  type: Input