@progress/kendo-vue-grid 3.0.4-dev.202202010701 → 3.0.5-dev.202202081314

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 (34) hide show
  1. package/dist/cdn/js/kendo-vue-grid.js +1 -1
  2. package/dist/es/Grid.d.ts +4 -2
  3. package/dist/es/Grid.js +95 -23
  4. package/dist/es/VirtualScroll.d.ts +1 -1
  5. package/dist/es/VirtualScroll.js +2 -2
  6. package/dist/es/cells/GridGroupCell.js +2 -0
  7. package/dist/es/interfaces/GridCellProps.d.ts +6 -6
  8. package/dist/es/interfaces/GridColumnMenuExtendedFilterProps.d.ts +1 -1
  9. package/dist/es/interfaces/GridColumnMenuFilterProps.d.ts +1 -1
  10. package/dist/es/interfaces/GridColumnMenuFilterUIProps.d.ts +1 -1
  11. package/dist/es/interfaces/GridProps.d.ts +41 -23
  12. package/dist/es/interfaces/events.d.ts +4 -0
  13. package/dist/es/main.d.ts +1 -0
  14. package/dist/es/main.js +1 -0
  15. package/dist/es/package-metadata.js +1 -1
  16. package/dist/es/utils/index.d.ts +8 -0
  17. package/dist/es/utils/index.js +36 -0
  18. package/dist/npm/Grid.d.ts +4 -2
  19. package/dist/npm/Grid.js +95 -23
  20. package/dist/npm/VirtualScroll.d.ts +1 -1
  21. package/dist/npm/VirtualScroll.js +2 -2
  22. package/dist/npm/cells/GridGroupCell.js +2 -0
  23. package/dist/npm/interfaces/GridCellProps.d.ts +6 -6
  24. package/dist/npm/interfaces/GridColumnMenuExtendedFilterProps.d.ts +1 -1
  25. package/dist/npm/interfaces/GridColumnMenuFilterProps.d.ts +1 -1
  26. package/dist/npm/interfaces/GridColumnMenuFilterUIProps.d.ts +1 -1
  27. package/dist/npm/interfaces/GridProps.d.ts +41 -23
  28. package/dist/npm/interfaces/events.d.ts +4 -0
  29. package/dist/npm/main.d.ts +1 -0
  30. package/dist/npm/main.js +11 -0
  31. package/dist/npm/package-metadata.js +1 -1
  32. package/dist/npm/utils/index.d.ts +8 -0
  33. package/dist/npm/utils/index.js +39 -1
  34. package/package.json +13 -13
@@ -10,7 +10,7 @@ import { VirtualScroll } from './VirtualScroll';
10
10
  import { ColumnResize } from './drag/ColumnResize';
11
11
  import { CommonDragLogic } from './drag/CommonDragLogic';
12
12
  import { DataItemWrapper } from './utils/index';
13
- import { GridProps, GridEmits } from './interfaces/GridProps';
13
+ import { GridProps } from './interfaces/GridProps';
14
14
  import { GridColumnProps } from './interfaces/GridColumnProps';
15
15
  /**
16
16
  * Represents the [native Vue Grid component by Kendo UI]({% slug overview_grid_native %}).
@@ -131,6 +131,8 @@ export interface GridState {
131
131
  export interface GridComputed {
132
132
  [key: string]: any;
133
133
  getCorrectHeight: any;
134
+ currentGroupable: boolean;
135
+ computedCollapsed: any[][];
134
136
  }
135
137
  /**
136
138
  * @hidden
@@ -141,5 +143,5 @@ export interface GridAll extends GridMethods, GridData, GridState, GridComputed,
141
143
  * Represents the default `Grid` component.
142
144
  */
143
145
  declare let GridVue2: ComponentOptions<Vue2type, DefaultData<GridData>, DefaultMethods<GridAll>, GridComputed, RecordPropsDefinition<GridProps>>;
144
- declare const Grid: DefineComponent<GridProps, any, GridData, GridComputed, GridMethods, {}, {}, GridEmits, string, GridProps, GridProps, {}>;
146
+ declare const Grid: DefineComponent<GridProps, any, GridData, GridComputed, GridMethods, {}, {}, {}, string, GridProps, GridProps, {}>;
145
147
  export { Grid, GridVue2 };
package/dist/npm/Grid.js CHANGED
@@ -97,18 +97,15 @@ var DragClue_1 = require("./drag/DragClue");
97
97
 
98
98
  var DropClue_1 = require("./drag/DropClue");
99
99
 
100
- var index_1 = require("./utils/index"); // import { GridCellProps } from './interfaces/GridCellProps';
101
-
102
-
103
- var GridCell_1 = require("./cells/GridCell"); // import { GridToolbar } from './GridToolbar';
100
+ var index_1 = require("./utils/index");
104
101
 
102
+ var GridCell_1 = require("./cells/GridCell");
105
103
 
106
104
  var GridGroupCell_1 = require("./cells/GridGroupCell");
107
105
 
108
106
  var GridRow_1 = require("./rows/GridRow");
109
107
 
110
- var GridHeaderSelectionCell_1 = require("./header/GridHeaderSelectionCell"); // import { ScrollMode } from './ScrollMode';
111
-
108
+ var GridHeaderSelectionCell_1 = require("./header/GridHeaderSelectionCell");
112
109
 
113
110
  var GridNoRecords_1 = require("./GridNoRecords");
114
111
 
@@ -123,6 +120,19 @@ var messages_1 = require("./messages");
123
120
  var GridVue2 = {
124
121
  name: 'KendoGrid',
125
122
  props: {
123
+ topCacheCount: {
124
+ type: Number,
125
+ default: 0
126
+ },
127
+ collapsedGroups: {
128
+ type: Array,
129
+ default: function _default() {
130
+ return [];
131
+ }
132
+ },
133
+ uniqueField: String,
134
+ totalGroupedHeight: Number,
135
+ allGroupedItems: Object,
126
136
  alternatePerGroup: Boolean,
127
137
  columns: Array,
128
138
  columnVirtualization: Boolean,
@@ -193,8 +203,8 @@ var GridVue2 = {
193
203
  kendo_vue_common_1.validatePackage(package_metadata_1.packageMetadata);
194
204
  this.initialHeight = null;
195
205
  this._columns = [];
196
- var groupable = this.$props.groupable === true || _typeof(this.$props.groupable) === 'object' && this.$props.groupable.enabled !== false;
197
- this.vs = new VirtualScroll_1.VirtualScroll(groupable || this.$props.rowHeight === undefined || this.$props.rowHeight === 0);
206
+ var groupable = this.currentGroupable;
207
+ this.vs = new VirtualScroll_1.VirtualScroll(groupable || this.$props.rowHeight === undefined || this.$props.rowHeight === 0, this.$props.topCacheCount);
198
208
  this.dragLogic = new CommonDragLogic_1.CommonDragLogic(this.columnReorder.bind(this), this.groupReorder.bind(this), this.columnToGroup.bind(this));
199
209
  this.columnResize = new ColumnResize_1.ColumnResize(this.onResize.bind(this));
200
210
  this._columnsMap = [[]];
@@ -231,6 +241,24 @@ var GridVue2 = {
231
241
  return null;
232
242
  }
233
243
  }
244
+ },
245
+ currentGroupable: function currentGroupable() {
246
+ return this.$props.groupable === true && this.$props.group && this.$props.group.length || _typeof(this.$props.groupable) === 'object' && this.$props.groupable.enabled !== false;
247
+ },
248
+ computedCollapsed: function computedCollapsed() {
249
+ var newCollapsed = [];
250
+
251
+ if (this.$props.group) {
252
+ for (var i = 0; i < this.$props.group.length; i++) {
253
+ if (this.$props.collapsedGroups[i]) {
254
+ newCollapsed.push(this.$props.collapsedGroups[i]);
255
+ } else {
256
+ newCollapsed.push([]);
257
+ }
258
+ }
259
+ }
260
+
261
+ return newCollapsed;
234
262
  }
235
263
  },
236
264
  methods: {
@@ -324,16 +352,16 @@ var GridVue2 = {
324
352
  }
325
353
  },
326
354
  onTotalChanged: function onTotalChanged(_value, _oldValue) {
327
- var groupable = this.$props.groupable === true || _typeof(this.$props.groupable) === 'object' && this.$props.groupable.enabled !== false;
355
+ var groupable = this.currentGroupable;
328
356
  this.vs.reset();
329
- this.vs = new VirtualScroll_1.VirtualScroll(groupable || this.$props.rowHeight === undefined || this.$props.rowHeight === 0);
357
+ this.vs = new VirtualScroll_1.VirtualScroll(groupable || this.$props.rowHeight === undefined || this.$props.rowHeight === 0, this.$props.topCacheCount);
330
358
  this.resetVirtual();
331
359
  this.setRefs();
332
360
  },
333
361
  onRowHeightChanged: function onRowHeightChanged(_value, _oldValue) {
334
- var groupable = this.$props.groupable === true || _typeof(this.$props.groupable) === 'object' && this.$props.groupable.enabled !== false;
362
+ var groupable = this.currentGroupable;
335
363
  this.vs.reset();
336
- this.vs = new VirtualScroll_1.VirtualScroll(groupable || this.$props.rowHeight === undefined || this.$props.rowHeight === 0);
364
+ this.vs = new VirtualScroll_1.VirtualScroll(groupable || this.$props.rowHeight === undefined || this.$props.rowHeight === 0, this.$props.topCacheCount);
337
365
  this.resetVirtual();
338
366
  this.setRefs();
339
367
  },
@@ -376,6 +404,31 @@ var GridVue2 = {
376
404
  }, this.getArguments(e)));
377
405
  }
378
406
  },
407
+ updateGroupCollapsed: function updateGroupCollapsed(event) {
408
+ var collapsed = this.computedCollapsed;
409
+ var collapsedLevel = collapsed[event.level];
410
+ var uniqueItemValue = index_1.groupedFirstItemValue(event.dataItem, this.$props.uniqueField);
411
+
412
+ if (event.value) {
413
+ if (collapsedLevel && collapsedLevel.length) {
414
+ var expandedIndex = collapsedLevel.indexOf(uniqueItemValue);
415
+
416
+ if (expandedIndex > -1) {
417
+ collapsedLevel.splice(expandedIndex, 1);
418
+ }
419
+ }
420
+ } else {
421
+ if (collapsedLevel) {
422
+ if (!collapsedLevel.includes(uniqueItemValue)) {
423
+ collapsedLevel.push(uniqueItemValue);
424
+ }
425
+ } else {
426
+ collapsedLevel = [uniqueItemValue];
427
+ }
428
+ }
429
+
430
+ return collapsed;
431
+ },
379
432
  itemChange: function itemChange(event) {
380
433
  var itemChange = kendo_vue_common_1.hasListener.call(this, 'itemchange');
381
434
 
@@ -384,6 +437,7 @@ var GridVue2 = {
384
437
 
385
438
  if (expandChange) {
386
439
  this.$emit('expandchange', __assign(__assign({}, this.getArguments(event.event)), {
440
+ collapsedGroups: this.updateGroupCollapsed(event),
387
441
  dataItem: event.dataItem,
388
442
  value: event.value
389
443
  }));
@@ -750,6 +804,10 @@ var GridVue2 = {
750
804
  if (item.expanded !== false && item.items) {
751
805
  allRowsCount = _this.addSubItems(item.items, allRowsCount);
752
806
  }
807
+
808
+ if (_this.$props.groupable.footer === 'always' || item.expanded !== false && _this.$props.groupable.footer === 'visible') {
809
+ allRowsCount++;
810
+ }
753
811
  });
754
812
  return allRowsCount;
755
813
  }
@@ -796,7 +854,7 @@ var GridVue2 = {
796
854
  if (Array.isArray(this.$props.dataItems)) {
797
855
  gridData = this.$props.dataItems;
798
856
  } else if (this.$props.dataItems) {
799
- gridData = this.$props.dataItems.data;
857
+ gridData = index_1.applyExpandedState(this.$props.dataItems, this.computedCollapsed, this.$props.uniqueField).data;
800
858
  total = total || this.$props.dataItems.total;
801
859
  }
802
860
 
@@ -807,10 +865,17 @@ var GridVue2 = {
807
865
  this.resetVirtual();
808
866
  this.vs.total = total;
809
867
 
810
- if (this.$props.rowHeight !== undefined && this.$props.rowHeight > 0 && !groupable) {
868
+ if (this.$props.rowHeight !== undefined && this.$props.rowHeight > 0 && !this.currentGroupable) {
811
869
  this.vs.containerHeight = Math.min(1533915, this.$props.rowHeight * (total || 0));
812
870
  } else {
813
- this.vs.containerHeight = 1533915; // this.vs.containerHeight = Math.min(1533915, this.$props.rowHeight * this.totalGroupedRows(gridData));
871
+ if (this.$props.totalGroupedHeight) {
872
+ this.vs.containerHeight = Math.min(1533915, this.$props.totalGroupedHeight);
873
+ } else if (this.$props.allGroupedItems) {
874
+ var allGroupedItems = this.totalGroupedRows(index_1.applyExpandedState(this.$props.allGroupedItems, this.computedCollapsed, this.$props.uniqueField).data);
875
+ this.vs.containerHeight = Math.min(1533915, this.$props.rowHeight * allGroupedItems);
876
+ } else {
877
+ this.vs.containerHeight = 1533915;
878
+ }
814
879
  }
815
880
 
816
881
  var children = defaultSlot || [];
@@ -1209,6 +1274,11 @@ var GridVue2 = {
1209
1274
  columnCellRenderFunction = kendo_vue_common_1.templateRendering.call(this, column.cell, kendo_vue_common_1.getListeners.call(this));
1210
1275
  }
1211
1276
 
1277
+ var isCollapsed = this.computedCollapsed && this.computedCollapsed[item.level] && this.computedCollapsed[item.level].some(function (c) {
1278
+ return c === index_1.groupedFirstItemValue(item.dataItem, _this.$props.uniqueField);
1279
+ });
1280
+ var isExpanded = isCollapsed ? !isCollapsed : item.expanded;
1281
+
1212
1282
  if (column.internalCell) {
1213
1283
  return h(column.internalCell, {
1214
1284
  key: index,
@@ -1229,7 +1299,7 @@ var GridVue2 = {
1229
1299
  }).length,
1230
1300
  rowType: item.rowType,
1231
1301
  level: item.level,
1232
- expanded: item.expanded,
1302
+ expanded: isExpanded,
1233
1303
  dataIndex: item.dataIndex,
1234
1304
  ariaColumnIndex: column.ariaColumnIndex,
1235
1305
  isSelected: Array.isArray(selectedValue) && selectedValue.indexOf(index) > -1
@@ -1268,7 +1338,7 @@ var GridVue2 = {
1268
1338
  }).length,
1269
1339
  rowType: item.rowType,
1270
1340
  level: item.level,
1271
- expanded: item.expanded,
1341
+ expanded: isExpanded,
1272
1342
  dataIndex: item.dataIndex,
1273
1343
  style: style,
1274
1344
  ariaColumnIndex: column.ariaColumnIndex,
@@ -1297,7 +1367,7 @@ var GridVue2 = {
1297
1367
  }).length,
1298
1368
  rowType: item.rowType,
1299
1369
  level: item.level,
1300
- expanded: item.expanded,
1370
+ expanded: isExpanded,
1301
1371
  dataIndex: item.dataIndex
1302
1372
  },
1303
1373
  key: index,
@@ -1327,7 +1397,7 @@ var GridVue2 = {
1327
1397
  }).length,
1328
1398
  rowType: item.rowType,
1329
1399
  level: item.level,
1330
- expanded: item.expanded,
1400
+ expanded: isExpanded,
1331
1401
  dataIndex: item.dataIndex,
1332
1402
  style: style
1333
1403
  });
@@ -1354,7 +1424,7 @@ var GridVue2 = {
1354
1424
  }).length,
1355
1425
  rowType: item.rowType,
1356
1426
  level: item.level,
1357
- expanded: item.expanded,
1427
+ expanded: isExpanded,
1358
1428
  dataIndex: item.dataIndex
1359
1429
  },
1360
1430
  colSpan: colSpans[index],
@@ -1403,7 +1473,7 @@ var GridVue2 = {
1403
1473
  }).length,
1404
1474
  rowType: item.rowType,
1405
1475
  level: item.level,
1406
- expanded: item.expanded,
1476
+ expanded: isExpanded,
1407
1477
  dataIndex: item.dataIndex,
1408
1478
  style: style
1409
1479
  });
@@ -1416,8 +1486,10 @@ var GridVue2 = {
1416
1486
 
1417
1487
  var hiddenRows = 0;
1418
1488
 
1419
- if (this.$props.scrollable === 'virtual') {
1420
- for (var i = 0; i < this.vs.topCacheCount + this.vs.attendedSkip - (this.$props.skip || 0); i++) {
1489
+ if (this.$props.scrollable === 'virtual' && this.totalGroupedRows(this.currentData) / 2 > this.$props.take) {
1490
+ var topIndex = this.vs.topCacheCount + this.vs.attendedSkip - (this.$props.skip || 0);
1491
+
1492
+ for (var i = 0; i < topIndex; i++) {
1421
1493
  var item = this.currentData.shift();
1422
1494
 
1423
1495
  if (item) {
@@ -22,7 +22,7 @@ export declare class VirtualScroll {
22
22
  private syncTimeout;
23
23
  private tableTranslate;
24
24
  private scrollSyncing;
25
- constructor(cached: boolean);
25
+ constructor(cached: boolean, topCacheCount: number);
26
26
  /**
27
27
  * @return - The row heights in an array.
28
28
  */
@@ -5,7 +5,7 @@ exports.VirtualScroll = void 0;
5
5
  * @hidden
6
6
  */
7
7
  var VirtualScroll = /** @class */ (function () {
8
- function VirtualScroll(cached) {
8
+ function VirtualScroll(cached, topCacheCount) {
9
9
  this.containerHeight = 0;
10
10
  this.topCacheCount = 0; // 4;
11
11
  this.attendedSkip = 0; // -4;
@@ -21,7 +21,7 @@ var VirtualScroll = /** @class */ (function () {
21
21
  this.tableTranslate = 0;
22
22
  this.scrollSyncing = false;
23
23
  if (cached) {
24
- this.topCacheCount = 4;
24
+ this.topCacheCount = topCacheCount;
25
25
  this.attendedSkip = -this.topCacheCount;
26
26
  }
27
27
  this.scrollHandler = this.scrollHandler.bind(this);
@@ -71,6 +71,7 @@ var GridGroupCellVue2 = {
71
71
  dataItem: this.$props.dataItem,
72
72
  dataIndex: this.$props.dataIndex,
73
73
  event: event,
74
+ level: this.$props.level,
74
75
  field: undefined,
75
76
  value: !expanded
76
77
  });
@@ -82,6 +83,7 @@ var GridGroupCellVue2 = {
82
83
  dataItem: dataItem,
83
84
  dataIndex: this.$props.dataIndex,
84
85
  event: e,
86
+ level: this.$props.level,
85
87
  field: undefined,
86
88
  value: !expanded
87
89
  });
@@ -84,7 +84,7 @@ export interface GridCellProps {
84
84
  /**
85
85
  * The event that is fired when the cell value is changed.
86
86
  */
87
- change?: (event: {
87
+ onChange?: (event: {
88
88
  dataItem: any;
89
89
  event: any;
90
90
  field?: string;
@@ -93,7 +93,7 @@ export interface GridCellProps {
93
93
  /**
94
94
  * The event that is fired when the keydown event of the cell is triggered.
95
95
  */
96
- cellkeydown?: (event: {
96
+ onCellkeydown?: (event: {
97
97
  event: any;
98
98
  dataItem: any;
99
99
  field: string;
@@ -101,20 +101,20 @@ export interface GridCellProps {
101
101
  /**
102
102
  * The event that is fired when the cell is clicked.
103
103
  */
104
- cellclick?: (event: {
104
+ onCellclick?: (event: {
105
105
  dataItem: any;
106
106
  field: string;
107
107
  }) => void;
108
108
  /**
109
109
  * The event that is fired when the cell is about to be added.
110
110
  */
111
- add?: (event: {
111
+ onAdd?: (event: {
112
112
  dataItem: any;
113
113
  }) => void;
114
114
  /**
115
115
  * The event that is fired when the cell is about to be edited.
116
116
  */
117
- edit?: (event: {
117
+ onEdit?: (event: {
118
118
  dataItem: any;
119
119
  }) => void;
120
120
  /**
@@ -132,7 +132,7 @@ export interface GridCellProps {
132
132
  /**
133
133
  * The event that is fired when the cell is about to be canceled.
134
134
  */
135
- cancel?: (event: {
135
+ onCancel?: (event: {
136
136
  dataItem: any;
137
137
  }) => void;
138
138
  /**
@@ -10,7 +10,7 @@ export interface GridColumnMenuExtendedFilterProps extends GridColumnMenuFilterP
10
10
  /**
11
11
  * Triggered on each subsequent expand state of the filter component.
12
12
  */
13
- onExpandChange?: (nextExpandState: boolean) => void;
13
+ onExpandchange?: (nextExpandState: boolean) => void;
14
14
  /**
15
15
  * If set to `false`, the second filter operator and the input will be hidden.
16
16
  */
@@ -23,5 +23,5 @@ export interface GridColumnMenuFilterProps {
23
23
  /**
24
24
  * The method that will be called to notify the parent Grid about a filter change.
25
25
  */
26
- onFilterChange?: (filter: CompositeFilterDescriptor | null, event: any) => any;
26
+ onFilterchange?: (filter: CompositeFilterDescriptor | null, event: any) => any;
27
27
  }
@@ -28,7 +28,7 @@ export interface GridColumnMenuFilterUIProps {
28
28
  /**
29
29
  * The method that will be called to notify the parent about a change in the filter logic.
30
30
  */
31
- onLogicChange?: (e: any) => void;
31
+ onLogicchange?: (e: any) => void;
32
32
  /**
33
33
  * The method that will be called to notify the parent about a change in the filter.
34
34
  */
@@ -43,7 +43,7 @@ export interface GridProps {
43
43
  * Fires when the sorting of the Grid is changed ([see example]({% slug sorting_grid_native %})).
44
44
  * You have to handle the event yourself and sort the data.
45
45
  */
46
- sortchange?: (event: GridSortChangeEvent) => void;
46
+ onSortchange?: (event: GridSortChangeEvent) => void;
47
47
  /**
48
48
  * The descriptors by which the data is sorted.
49
49
  * Applies the sorting styles and buttons to the affected columns.
@@ -69,7 +69,7 @@ export interface GridProps {
69
69
  * ([more information and examples]({% slug filtering_grid_native %})).
70
70
  * You have to handle the event yourself and filter the data.
71
71
  */
72
- filterchange?: (event: GridFilterChangeEvent) => void;
72
+ onFilterchange?: (event: GridFilterChangeEvent) => void;
73
73
  /**
74
74
  * Defines if the column menu will be shown for the column.
75
75
  * Accepts Boolean, a Vue component, a `render` function, or a slot name
@@ -88,7 +88,7 @@ export interface GridProps {
88
88
  * Fires when the grouping of the Grid is changed. You have to handle the event yourself and group the data
89
89
  * ([more information and examples]({% slug groupingbasics_grid_native %})).
90
90
  */
91
- groupchange?: (event: GridGroupChangeEvent) => void;
91
+ onGroupchange?: (event: GridGroupChangeEvent) => void;
92
92
  /**
93
93
  * Configures the pager of the Grid ([see example]({% slug paging_grid_native %})).
94
94
  *
@@ -114,7 +114,7 @@ export interface GridProps {
114
114
  * Fires when the page of the Grid is changed ([see example]({% slug paging_grid_native %})).
115
115
  * You have to handle the event yourself and page the data.
116
116
  */
117
- pagechange?: (event: GridPageChangeEvent) => void;
117
+ onPagechange?: (event: GridPageChangeEvent) => void;
118
118
  /**
119
119
  * Defines the total number of data items in all pages
120
120
  * ([see example]({% slug paging_grid_native %})). Required by the paging functionality.
@@ -128,7 +128,7 @@ export interface GridProps {
128
128
  /**
129
129
  * Fires when the user tries to expand or collapse a row.
130
130
  */
131
- expandchange?: (event: GridExpandChangeEvent) => void;
131
+ onExpandchange?: (event: GridExpandChangeEvent) => void;
132
132
  /**
133
133
  * Specifies the name of the field which will provide a Boolean representation
134
134
  * of the expanded state of the item ([see example]({% slug detailrow_grid_native %}).
@@ -143,50 +143,50 @@ export interface GridProps {
143
143
  * Fires when the user tries to select or deselect a row
144
144
  * ([see example]({% slug selection_grid_native %})).
145
145
  */
146
- selectionchange?: (event: GridSelectionChangeEvent) => void;
146
+ onSelectionchange?: (event: GridSelectionChangeEvent) => void;
147
147
  /**
148
148
  * Fires when the user clicks the checkbox of a column header whose `field` matches `selectedField`.
149
149
  * ([see example]({% slug selection_grid_native %})).
150
150
  */
151
- headerselectionchange?: (event: GridHeaderSelectionChangeEvent) => void;
151
+ onHeaderselectionchange?: (event: GridHeaderSelectionChangeEvent) => void;
152
152
  /**
153
153
  * Fires when the user clicks a row.
154
154
  */
155
- rowclick?: (event: GridRowClickEvent) => void;
155
+ onRowclick?: (event: GridRowClickEvent) => void;
156
156
  /**
157
157
  * Fires when the user double clicks a row.
158
158
  */
159
- rowdblclick?: (event: GridRowClickEvent) => void;
159
+ onRowdblclick?: (event: GridRowClickEvent) => void;
160
160
  /**
161
161
  * Fires when the user clicks a cell.
162
162
  */
163
- cellclick?: (event: any) => void;
163
+ onCellclick?: (event: any) => void;
164
164
  /**
165
165
  * Fires when Grid is scrolled.
166
166
  */
167
- scroll?: (event: any) => void;
167
+ onScroll?: (event: any) => void;
168
168
  /**
169
169
  * Fires when the user triggers an edit operation from a cell.
170
170
  */
171
- edit?: (event: GridEditEvent) => void;
171
+ onEdit?: (event: GridEditEvent) => void;
172
172
  /**
173
173
  * Fires when the user triggers a removal operation from a cell.
174
174
  */
175
- remove?: (event: GridRemoveEvent) => void;
175
+ onRemove?: (event: GridRemoveEvent) => void;
176
176
  /**
177
177
  * Fires when the user triggers a saving operation from a cell.
178
178
  */
179
- save?: (event: GridSaveEvent) => void;
179
+ onSave?: (event: GridSaveEvent) => void;
180
180
  /**
181
181
  * Fires when the user triggers a canceling operation from a cell.
182
182
  */
183
- cancel?: (event: GridCancelEvent) => void;
183
+ onCancel?: (event: GridCancelEvent) => void;
184
184
  /**
185
185
  * Fires when the user changes the values of the item.
186
186
  * The event is not debounced and fires on every `onChange` event of the input in the current `EditCell`.
187
187
  * ([more information and examples]({% slug editing_inline_grid_native %})).
188
188
  */
189
- itemchange?: (event: GridItemChangeEvent) => void;
189
+ onItemchange?: (event: GridItemChangeEvent) => void;
190
190
  /**
191
191
  * Specifies the name of the field which will provide a Boolean representation of the edit state of the current
192
192
  * item ([more information and examples]({% slug editing_inline_grid_native %})).
@@ -221,7 +221,7 @@ export interface GridProps {
221
221
  /**
222
222
  * Fires when the data state of the Grid is changed.
223
223
  */
224
- datastatechange?: (event: GridDataStateChangeEvent) => void;
224
+ onDatastatechange?: (event: GridDataStateChangeEvent) => void;
225
225
  /**
226
226
  * If set to `true`, the user can resize columns by dragging the edges (resize handles) of their
227
227
  * header cells ([see example]({% slug resizing_columns_grid_native %}).
@@ -240,11 +240,11 @@ export interface GridProps {
240
240
  /**
241
241
  * Fires when a column is resized
242
242
  */
243
- columnresize?: (event: GridColumnResizeEvent) => void;
243
+ onColumnresize?: (event: GridColumnResizeEvent) => void;
244
244
  /**
245
245
  * Fires when columns are reordered.
246
246
  */
247
- columnreorder?: (event: GridColumnReorderEvent) => void;
247
+ onColumnreorder?: (event: GridColumnReorderEvent) => void;
248
248
  /**
249
249
  * Defines the custom rendering of the row. Accepts a Vue component, a `render` function, or a slot name.
250
250
  */
@@ -276,14 +276,32 @@ export interface GridProps {
276
276
  * By default, navigation is disabled and the Grid content is accessible in the normal tab sequence.
277
277
  */
278
278
  navigatable?: boolean;
279
- }
280
- export interface GridEmits {
279
+ /**
280
+ * Passes the number of cached top items needed for the grouping virtualization scenario. Defaults to 4.
281
+ */
282
+ topCacheCount?: Number;
283
+ /**
284
+ * Passes the calculated height of all the items in the Grid grouped hierarchy.
285
+ */
286
+ totalGroupedHeight?: Number;
287
+ /**
288
+ * Passes the collection of all grouped items that is needed for the virtualization scenario.
289
+ */
290
+ allGroupedItems?: any[];
291
+ /**
292
+ * Passes the collection of all collapsed groups for every grouped level.
293
+ */
294
+ collapsedGroups?: any[][];
295
+ /**
296
+ * Specifies the name of the field which will provide a unique for every item identifier.
297
+ */
298
+ uniqueField?: string;
281
299
  /**
282
300
  * Fires when Grid keyboard navigation position is changed.
283
301
  */
284
- navigationaction?: (event: GridNavigationActionEvent) => void;
302
+ onNavigationaction?: (event: GridNavigationActionEvent) => void;
285
303
  /**
286
304
  * Fires when the user press keyboard key.
287
305
  */
288
- keydown?: (event: GridKeyDownEvent) => void;
306
+ onKeydown?: (event: GridKeyDownEvent) => void;
289
307
  }
@@ -62,6 +62,10 @@ export interface GridGroupChangeEvent extends GridEvent {
62
62
  * Represents the object of the `onExpandChange` event.
63
63
  */
64
64
  export interface GridExpandChangeEvent extends GridEvent {
65
+ /**
66
+ * The array with collapsed groups.
67
+ */
68
+ collapsed?: string[];
65
69
  /**
66
70
  * The data item that is expanded or collapsed.
67
71
  */
@@ -34,4 +34,5 @@ import { GridGroupableSettings } from './interfaces/GridGroupableSettings';
34
34
  import { GridColumnMenuItem, GridColumnMenuItemVue2 } from './columnMenu/GridColumnMenuItem';
35
35
  import { GridColumnMenuItemContent, GridColumnMenuItemContentVue2 } from './columnMenu/GridColumnMenuItemContent';
36
36
  import { GridColumnMenuItemGroup, GridColumnMenuItemGroupVue2 } from './columnMenu/GridColumnMenuItemGroup';
37
+ export * from './utils/index';
37
38
  export { Grid, GridVue2, GridProps, GridColumnProps, GridCellProps, GridCell, GridCellVue2, GridEditCell, GridEditCellVue2, GridGroupCell, GridHierarchyCell, GridGroupCellVue2, GridHierarchyCellVue2, GridDetailRow, GridDetailRowVue2, GridDetailRowProps, GridRow, GridRowVue2, GridRowProps, GridFilterCell, GridFilterCellVue2, GridFilterCellProps, GridHeaderCell, GridHeaderCellVue2, GridHeaderCellProps, Footer, FooterRow, FooterVue2, FooterRowVue2, GridFooterCellProps, GridColumnMenuProps, GridColumnMenuSort, GridColumnMenuSortVue2, sortGroupByField, GridColumnMenuFilter, GridColumnMenuFilterVue2, filterGroupByField, GridColumnMenuItem, GridColumnMenuItemVue2, GridColumnMenuItemContent, GridColumnMenuItemContentVue2, GridColumnMenuItemGroup, GridColumnMenuItemGroupVue2, GridColumnMenuFilterUI, GridColumnMenuFilterUIVue2, GridColumnMenuFilterCell, GridColumnMenuFilterCellVue2, GridColumnMenuCheckboxFilter, GridColumnMenuCheckboxFilterVue2, GridColumnMenuCheckboxFilterProps, GridToolbar, GridToolbarVue2, GridToolbarProps, GridNoRecords, GridNoRecordsVue2, GridNoRecordsProps, GridSortSettings, GridPagerSettings, GridGroupableSettings, GridPageChangeEvent, GridDataStateChangeEvent, GridFilterChangeEvent, GridSortChangeEvent, GridExpandChangeEvent, GridSelectionChangeEvent, GridItemChangeEvent, GridHeaderSelectionChangeEvent, GridRowClickEvent, GridColumnResizeEvent, GridColumnReorderEvent, GridGroupChangeEvent };
package/dist/npm/main.js CHANGED
@@ -1,4 +1,14 @@
1
1
  "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
5
+ }) : (function(o, m, k, k2) {
6
+ if (k2 === undefined) k2 = k;
7
+ o[k2] = m[k];
8
+ }));
9
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
10
+ for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
11
+ };
2
12
  Object.defineProperty(exports, "__esModule", { value: true });
3
13
  exports.GridNoRecordsVue2 = exports.GridNoRecords = exports.GridToolbarVue2 = exports.GridToolbar = exports.GridColumnMenuCheckboxFilterVue2 = exports.GridColumnMenuCheckboxFilter = exports.GridColumnMenuFilterCellVue2 = exports.GridColumnMenuFilterCell = exports.GridColumnMenuFilterUIVue2 = exports.GridColumnMenuFilterUI = exports.GridColumnMenuItemGroupVue2 = exports.GridColumnMenuItemGroup = exports.GridColumnMenuItemContentVue2 = exports.GridColumnMenuItemContent = exports.GridColumnMenuItemVue2 = exports.GridColumnMenuItem = exports.filterGroupByField = exports.GridColumnMenuFilterVue2 = exports.GridColumnMenuFilter = exports.sortGroupByField = exports.GridColumnMenuSortVue2 = exports.GridColumnMenuSort = exports.FooterRowVue2 = exports.FooterVue2 = exports.FooterRow = exports.Footer = exports.GridHeaderCellVue2 = exports.GridHeaderCell = exports.GridFilterCellVue2 = exports.GridFilterCell = exports.GridRowVue2 = exports.GridRow = exports.GridDetailRowVue2 = exports.GridDetailRow = exports.GridHierarchyCellVue2 = exports.GridGroupCellVue2 = exports.GridHierarchyCell = exports.GridGroupCell = exports.GridEditCellVue2 = exports.GridEditCell = exports.GridCellVue2 = exports.GridCell = exports.GridVue2 = exports.Grid = void 0;
4
14
  var Grid_1 = require("./Grid");
@@ -66,6 +76,7 @@ Object.defineProperty(exports, "GridColumnMenuItemContentVue2", { enumerable: tr
66
76
  var GridColumnMenuItemGroup_1 = require("./columnMenu/GridColumnMenuItemGroup");
67
77
  Object.defineProperty(exports, "GridColumnMenuItemGroup", { enumerable: true, get: function () { return GridColumnMenuItemGroup_1.GridColumnMenuItemGroup; } });
68
78
  Object.defineProperty(exports, "GridColumnMenuItemGroupVue2", { enumerable: true, get: function () { return GridColumnMenuItemGroup_1.GridColumnMenuItemGroupVue2; } });
79
+ __exportStar(require("./utils/index"), exports);
69
80
  // Automatic installation if Vue has been added to the global scope.
70
81
  var vue = 'Vue';
71
82
  if (typeof window !== 'undefined' && window[vue] && window[vue].component) {
@@ -8,7 +8,7 @@ exports.packageMetadata = {
8
8
  name: '@progress/kendo-vue-grid',
9
9
  productName: 'Kendo UI for Vue',
10
10
  productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
11
- publishDate: 1643698567,
11
+ publishDate: 1644325857,
12
12
  version: '',
13
13
  licensingDocsUrl: 'https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning'
14
14
  };
@@ -81,3 +81,11 @@ export declare const parsers: {
81
81
  string: (value: any) => any;
82
82
  default: (value: any) => any;
83
83
  };
84
+ /**
85
+ * @hidden
86
+ */
87
+ export declare function applyExpandedState(sdata: DataResult, collapsed: any[], uniqueField: string): DataResult;
88
+ /**
89
+ * @hidden
90
+ */
91
+ export declare function groupedFirstItemValue(item: any, field: string): any;