@vaadin/grid 22.0.13 → 22.0.16
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.
- package/package.json +9 -9
- package/src/vaadin-grid-a11y-mixin.js +5 -5
- package/src/vaadin-grid-active-item-mixin.d.ts +1 -1
- package/src/vaadin-grid-active-item-mixin.js +7 -7
- package/src/vaadin-grid-array-data-provider-mixin.d.ts +1 -1
- package/src/vaadin-grid-array-data-provider-mixin.js +4 -4
- package/src/vaadin-grid-column-group.js +41 -38
- package/src/vaadin-grid-column-reordering-mixin.d.ts +1 -1
- package/src/vaadin-grid-column-reordering-mixin.js +10 -10
- package/src/vaadin-grid-column-resizing-mixin.js +4 -4
- package/src/vaadin-grid-column.d.ts +2 -2
- package/src/vaadin-grid-column.js +19 -19
- package/src/vaadin-grid-data-provider-mixin.d.ts +2 -2
- package/src/vaadin-grid-data-provider-mixin.js +14 -14
- package/src/vaadin-grid-drag-and-drop-mixin.d.ts +1 -1
- package/src/vaadin-grid-drag-and-drop-mixin.js +9 -9
- package/src/vaadin-grid-dynamic-columns-mixin.js +3 -3
- package/src/vaadin-grid-event-context-mixin.d.ts +1 -1
- package/src/vaadin-grid-event-context-mixin.js +1 -1
- package/src/vaadin-grid-filter-column.js +1 -1
- package/src/vaadin-grid-filter-mixin.js +3 -3
- package/src/vaadin-grid-filter.d.ts +2 -2
- package/src/vaadin-grid-filter.js +2 -2
- package/src/vaadin-grid-keyboard-navigation-mixin.js +21 -16
- package/src/vaadin-grid-row-details-mixin.d.ts +2 -2
- package/src/vaadin-grid-row-details-mixin.js +4 -4
- package/src/vaadin-grid-scroll-mixin.js +3 -3
- package/src/vaadin-grid-selection-column.d.ts +2 -2
- package/src/vaadin-grid-selection-column.js +7 -7
- package/src/vaadin-grid-selection-mixin.d.ts +1 -1
- package/src/vaadin-grid-selection-mixin.js +21 -7
- package/src/vaadin-grid-sort-column.d.ts +2 -2
- package/src/vaadin-grid-sort-column.js +2 -2
- package/src/vaadin-grid-sort-mixin.js +5 -5
- package/src/vaadin-grid-sorter.d.ts +2 -2
- package/src/vaadin-grid-sorter.js +4 -4
- package/src/vaadin-grid-styles.js +1 -1
- package/src/vaadin-grid-styling-mixin.d.ts +1 -1
- package/src/vaadin-grid-styling-mixin.js +1 -1
- package/src/vaadin-grid-tree-column.js +2 -2
- package/src/vaadin-grid-tree-toggle.d.ts +2 -2
- package/src/vaadin-grid-tree-toggle.js +4 -4
- package/src/vaadin-grid.d.ts +5 -5
- package/src/vaadin-grid.js +35 -34
- package/theme/lumo/vaadin-grid-sorter-styles.js +1 -1
- package/theme/lumo/vaadin-grid-styles.js +2 -2
- package/theme/lumo/vaadin-grid-tree-toggle-styles.js +1 -1
- package/theme/material/vaadin-grid-sorter-styles.js +1 -1
- package/theme/material/vaadin-grid-styles.js +1 -1
- package/theme/material/vaadin-grid-tree-toggle-styles.js +1 -1
|
@@ -18,7 +18,7 @@ export const SortMixin = (superClass) =>
|
|
|
18
18
|
*/
|
|
19
19
|
multiSort: {
|
|
20
20
|
type: Boolean,
|
|
21
|
-
value: false
|
|
21
|
+
value: false,
|
|
22
22
|
},
|
|
23
23
|
|
|
24
24
|
/**
|
|
@@ -29,7 +29,7 @@ export const SortMixin = (superClass) =>
|
|
|
29
29
|
type: Array,
|
|
30
30
|
value: function () {
|
|
31
31
|
return [];
|
|
32
|
-
}
|
|
32
|
+
},
|
|
33
33
|
},
|
|
34
34
|
|
|
35
35
|
/** @private */
|
|
@@ -37,8 +37,8 @@ export const SortMixin = (superClass) =>
|
|
|
37
37
|
type: Array,
|
|
38
38
|
value: function () {
|
|
39
39
|
return [];
|
|
40
|
-
}
|
|
41
|
-
}
|
|
40
|
+
},
|
|
41
|
+
},
|
|
42
42
|
};
|
|
43
43
|
}
|
|
44
44
|
|
|
@@ -124,7 +124,7 @@ export const SortMixin = (superClass) =>
|
|
|
124
124
|
return this._sorters.map((sorter) => {
|
|
125
125
|
return {
|
|
126
126
|
path: sorter.path,
|
|
127
|
-
direction: sorter.direction
|
|
127
|
+
direction: sorter.direction,
|
|
128
128
|
};
|
|
129
129
|
});
|
|
130
130
|
}
|
|
@@ -76,13 +76,13 @@ declare class GridSorter extends ThemableMixin(DirMixin(HTMLElement)) {
|
|
|
76
76
|
addEventListener<K extends keyof GridSorterEventMap>(
|
|
77
77
|
type: K,
|
|
78
78
|
listener: (this: GridSorter, ev: GridSorterEventMap[K]) => void,
|
|
79
|
-
options?: boolean | AddEventListenerOptions
|
|
79
|
+
options?: boolean | AddEventListenerOptions,
|
|
80
80
|
): void;
|
|
81
81
|
|
|
82
82
|
removeEventListener<K extends keyof GridSorterEventMap>(
|
|
83
83
|
type: K,
|
|
84
84
|
listener: (this: GridSorter, ev: GridSorterEventMap[K]) => void,
|
|
85
|
-
options?: boolean | EventListenerOptions
|
|
85
|
+
options?: boolean | EventListenerOptions,
|
|
86
86
|
): void;
|
|
87
87
|
}
|
|
88
88
|
|
|
@@ -136,7 +136,7 @@ class GridSorter extends ThemableMixin(DirMixin(PolymerElement)) {
|
|
|
136
136
|
type: String,
|
|
137
137
|
reflectToAttribute: true,
|
|
138
138
|
notify: true,
|
|
139
|
-
value: null
|
|
139
|
+
value: null,
|
|
140
140
|
},
|
|
141
141
|
|
|
142
142
|
/**
|
|
@@ -145,14 +145,14 @@ class GridSorter extends ThemableMixin(DirMixin(PolymerElement)) {
|
|
|
145
145
|
*/
|
|
146
146
|
_order: {
|
|
147
147
|
type: Number,
|
|
148
|
-
value: null
|
|
148
|
+
value: null,
|
|
149
149
|
},
|
|
150
150
|
|
|
151
151
|
/** @private */
|
|
152
152
|
_isConnected: {
|
|
153
153
|
type: Boolean,
|
|
154
|
-
observer: '__isConnectedChanged'
|
|
155
|
-
}
|
|
154
|
+
observer: '__isConnectedChanged',
|
|
155
|
+
},
|
|
156
156
|
};
|
|
157
157
|
}
|
|
158
158
|
|
|
@@ -10,7 +10,7 @@ import { GridColumn } from './vaadin-grid-column.js';
|
|
|
10
10
|
export type GridCellClassNameGenerator<TItem> = (column: GridColumn<TItem>, model: GridItemModel<TItem>) => string;
|
|
11
11
|
|
|
12
12
|
export declare function StylingMixin<TItem, T extends Constructor<HTMLElement>>(
|
|
13
|
-
base: T
|
|
13
|
+
base: T,
|
|
14
14
|
): T & Constructor<StylingMixinClass<TItem>>;
|
|
15
15
|
|
|
16
16
|
export declare class StylingMixinClass<TItem> {
|
|
@@ -85,13 +85,13 @@ declare class GridTreeToggle extends ThemableMixin(DirMixin(HTMLElement)) {
|
|
|
85
85
|
addEventListener<K extends keyof GridTreeToggleEventMap>(
|
|
86
86
|
type: K,
|
|
87
87
|
listener: (this: GridTreeToggle, ev: GridTreeToggleEventMap[K]) => void,
|
|
88
|
-
options?: boolean | AddEventListenerOptions
|
|
88
|
+
options?: boolean | AddEventListenerOptions,
|
|
89
89
|
): void;
|
|
90
90
|
|
|
91
91
|
removeEventListener<K extends keyof GridTreeToggleEventMap>(
|
|
92
92
|
type: K,
|
|
93
93
|
listener: (this: GridTreeToggle, ev: GridTreeToggleEventMap[K]) => void,
|
|
94
|
-
options?: boolean | EventListenerOptions
|
|
94
|
+
options?: boolean | EventListenerOptions,
|
|
95
95
|
): void;
|
|
96
96
|
}
|
|
97
97
|
|
|
@@ -147,7 +147,7 @@ class GridTreeToggle extends ThemableMixin(DirMixin(PolymerElement)) {
|
|
|
147
147
|
level: {
|
|
148
148
|
type: Number,
|
|
149
149
|
value: 0,
|
|
150
|
-
observer: '_levelChanged'
|
|
150
|
+
observer: '_levelChanged',
|
|
151
151
|
},
|
|
152
152
|
|
|
153
153
|
/**
|
|
@@ -157,7 +157,7 @@ class GridTreeToggle extends ThemableMixin(DirMixin(PolymerElement)) {
|
|
|
157
157
|
leaf: {
|
|
158
158
|
type: Boolean,
|
|
159
159
|
value: false,
|
|
160
|
-
reflectToAttribute: true
|
|
160
|
+
reflectToAttribute: true,
|
|
161
161
|
},
|
|
162
162
|
|
|
163
163
|
/**
|
|
@@ -168,8 +168,8 @@ class GridTreeToggle extends ThemableMixin(DirMixin(PolymerElement)) {
|
|
|
168
168
|
type: Boolean,
|
|
169
169
|
value: false,
|
|
170
170
|
reflectToAttribute: true,
|
|
171
|
-
notify: true
|
|
172
|
-
}
|
|
171
|
+
notify: true,
|
|
172
|
+
},
|
|
173
173
|
};
|
|
174
174
|
}
|
|
175
175
|
|
package/src/vaadin-grid.d.ts
CHANGED
|
@@ -16,13 +16,13 @@ import {
|
|
|
16
16
|
GridDataProviderParams,
|
|
17
17
|
GridFilterDefinition,
|
|
18
18
|
GridSorterDefinition,
|
|
19
|
-
GridSorterDirection
|
|
19
|
+
GridSorterDirection,
|
|
20
20
|
} from './vaadin-grid-data-provider-mixin.js';
|
|
21
21
|
import {
|
|
22
22
|
DragAndDropMixinClass,
|
|
23
23
|
GridDragAndDropFilter,
|
|
24
24
|
GridDropLocation,
|
|
25
|
-
GridDropMode
|
|
25
|
+
GridDropMode,
|
|
26
26
|
} from './vaadin-grid-drag-and-drop-mixin.js';
|
|
27
27
|
import { EventContextMixinClass, GridEventContext } from './vaadin-grid-event-context-mixin.js';
|
|
28
28
|
import { GridRowDetailsRenderer, RowDetailsMixinClass } from './vaadin-grid-row-details-mixin.js';
|
|
@@ -45,7 +45,7 @@ export {
|
|
|
45
45
|
GridHeaderFooterRenderer,
|
|
46
46
|
GridRowDetailsRenderer,
|
|
47
47
|
GridSorterDefinition,
|
|
48
|
-
GridSorterDirection
|
|
48
|
+
GridSorterDirection,
|
|
49
49
|
};
|
|
50
50
|
|
|
51
51
|
export type GridDefaultItem = any;
|
|
@@ -378,13 +378,13 @@ declare class Grid<TItem = GridDefaultItem> extends HTMLElement {
|
|
|
378
378
|
addEventListener<K extends keyof GridEventMap<TItem>>(
|
|
379
379
|
type: K,
|
|
380
380
|
listener: (this: Grid<TItem>, ev: GridEventMap<TItem>[K]) => void,
|
|
381
|
-
options?: boolean | AddEventListenerOptions
|
|
381
|
+
options?: boolean | AddEventListenerOptions,
|
|
382
382
|
): void;
|
|
383
383
|
|
|
384
384
|
removeEventListener<K extends keyof GridEventMap<TItem>>(
|
|
385
385
|
type: K,
|
|
386
386
|
listener: (this: Grid<TItem>, ev: GridEventMap<TItem>[K]) => void,
|
|
387
|
-
options?: boolean | EventListenerOptions
|
|
387
|
+
options?: boolean | EventListenerOptions,
|
|
388
388
|
): void;
|
|
389
389
|
}
|
|
390
390
|
|
package/src/vaadin-grid.js
CHANGED
|
@@ -256,20 +256,20 @@ class Grid extends ElementMixin(
|
|
|
256
256
|
A11yMixin(
|
|
257
257
|
FilterMixin(
|
|
258
258
|
ColumnReorderingMixin(
|
|
259
|
-
ColumnResizingMixin(EventContextMixin(DragAndDropMixin(StylingMixin(PolymerElement))))
|
|
260
|
-
)
|
|
261
|
-
)
|
|
262
|
-
)
|
|
263
|
-
)
|
|
264
|
-
)
|
|
265
|
-
)
|
|
266
|
-
)
|
|
267
|
-
)
|
|
268
|
-
)
|
|
269
|
-
)
|
|
270
|
-
)
|
|
271
|
-
)
|
|
272
|
-
)
|
|
259
|
+
ColumnResizingMixin(EventContextMixin(DragAndDropMixin(StylingMixin(PolymerElement)))),
|
|
260
|
+
),
|
|
261
|
+
),
|
|
262
|
+
),
|
|
263
|
+
),
|
|
264
|
+
),
|
|
265
|
+
),
|
|
266
|
+
),
|
|
267
|
+
),
|
|
268
|
+
),
|
|
269
|
+
),
|
|
270
|
+
),
|
|
271
|
+
),
|
|
272
|
+
),
|
|
273
273
|
) {
|
|
274
274
|
static get template() {
|
|
275
275
|
return html`
|
|
@@ -301,7 +301,7 @@ class Grid extends ElementMixin(
|
|
|
301
301
|
static get observers() {
|
|
302
302
|
return [
|
|
303
303
|
'_columnTreeChanged(_columnTree, _columnTree.*)',
|
|
304
|
-
'_effectiveSizeChanged(_effectiveSize, __virtualizer, _hasData, _columnTree)'
|
|
304
|
+
'_effectiveSizeChanged(_effectiveSize, __virtualizer, _hasData, _columnTree)',
|
|
305
305
|
];
|
|
306
306
|
}
|
|
307
307
|
|
|
@@ -310,31 +310,31 @@ class Grid extends ElementMixin(
|
|
|
310
310
|
/** @private */
|
|
311
311
|
_safari: {
|
|
312
312
|
type: Boolean,
|
|
313
|
-
value: isSafari
|
|
313
|
+
value: isSafari,
|
|
314
314
|
},
|
|
315
315
|
|
|
316
316
|
/** @private */
|
|
317
317
|
_ios: {
|
|
318
318
|
type: Boolean,
|
|
319
|
-
value: isIOS
|
|
319
|
+
value: isIOS,
|
|
320
320
|
},
|
|
321
321
|
|
|
322
322
|
/** @private */
|
|
323
323
|
_firefox: {
|
|
324
324
|
type: Boolean,
|
|
325
|
-
value: isFirefox
|
|
325
|
+
value: isFirefox,
|
|
326
326
|
},
|
|
327
327
|
|
|
328
328
|
/** @private */
|
|
329
329
|
_android: {
|
|
330
330
|
type: Boolean,
|
|
331
|
-
value: isAndroid
|
|
331
|
+
value: isAndroid,
|
|
332
332
|
},
|
|
333
333
|
|
|
334
334
|
/** @private */
|
|
335
335
|
_touchDevice: {
|
|
336
336
|
type: Boolean,
|
|
337
|
-
value: isTouch
|
|
337
|
+
value: isTouch,
|
|
338
338
|
},
|
|
339
339
|
|
|
340
340
|
/**
|
|
@@ -348,18 +348,18 @@ class Grid extends ElementMixin(
|
|
|
348
348
|
allRowsVisible: {
|
|
349
349
|
type: Boolean,
|
|
350
350
|
value: false,
|
|
351
|
-
reflectToAttribute: true
|
|
351
|
+
reflectToAttribute: true,
|
|
352
352
|
},
|
|
353
353
|
|
|
354
354
|
/** @private */
|
|
355
355
|
_recalculateColumnWidthOnceLoadingFinished: {
|
|
356
356
|
type: Boolean,
|
|
357
|
-
value: true
|
|
357
|
+
value: true,
|
|
358
358
|
},
|
|
359
359
|
|
|
360
360
|
/** @private */
|
|
361
361
|
isAttached: {
|
|
362
|
-
value: false
|
|
362
|
+
value: false,
|
|
363
363
|
},
|
|
364
364
|
|
|
365
365
|
/**
|
|
@@ -370,8 +370,8 @@ class Grid extends ElementMixin(
|
|
|
370
370
|
*/
|
|
371
371
|
__gridElement: {
|
|
372
372
|
type: Boolean,
|
|
373
|
-
value: true
|
|
374
|
-
}
|
|
373
|
+
value: true,
|
|
374
|
+
},
|
|
375
375
|
};
|
|
376
376
|
}
|
|
377
377
|
|
|
@@ -444,7 +444,7 @@ class Grid extends ElementMixin(
|
|
|
444
444
|
updateElement: this._updateScrollerItem.bind(this),
|
|
445
445
|
scrollContainer: this.$.items,
|
|
446
446
|
scrollTarget: this.$.table,
|
|
447
|
-
reorderElements: true
|
|
447
|
+
reorderElements: true,
|
|
448
448
|
});
|
|
449
449
|
|
|
450
450
|
new ResizeObserver(() => setTimeout(() => this.__updateFooterPositioning())).observe(this.$.footer);
|
|
@@ -470,7 +470,7 @@ class Grid extends ElementMixin(
|
|
|
470
470
|
if (this.$.items.contains(cell) && cell.localName === 'td') {
|
|
471
471
|
return {
|
|
472
472
|
item: cell.parentElement._item,
|
|
473
|
-
column: cell._column
|
|
473
|
+
column: cell._column,
|
|
474
474
|
};
|
|
475
475
|
}
|
|
476
476
|
}
|
|
@@ -621,7 +621,7 @@ class Grid extends ElementMixin(
|
|
|
621
621
|
|
|
622
622
|
if (this._columnTree) {
|
|
623
623
|
this._columnTree[this._columnTree.length - 1].forEach(
|
|
624
|
-
(c) => c.isConnected && c.notifyPath && c.notifyPath('_cells.*', c._cells)
|
|
624
|
+
(c) => c.isConnected && c.notifyPath && c.notifyPath('_cells.*', c._cells),
|
|
625
625
|
);
|
|
626
626
|
}
|
|
627
627
|
|
|
@@ -845,7 +845,7 @@ class Grid extends ElementMixin(
|
|
|
845
845
|
*/
|
|
846
846
|
_renderColumnTree(columnTree) {
|
|
847
847
|
Array.from(this.$.items.children).forEach((row) =>
|
|
848
|
-
this._updateRow(row, columnTree[columnTree.length - 1], null, false, true)
|
|
848
|
+
this._updateRow(row, columnTree[columnTree.length - 1], null, false, true),
|
|
849
849
|
);
|
|
850
850
|
|
|
851
851
|
while (this.$.header.children.length < columnTree.length) {
|
|
@@ -867,11 +867,11 @@ class Grid extends ElementMixin(
|
|
|
867
867
|
}
|
|
868
868
|
|
|
869
869
|
Array.from(this.$.header.children).forEach((headerRow, index) =>
|
|
870
|
-
this._updateRow(headerRow, columnTree[index], 'header', index === columnTree.length - 1)
|
|
870
|
+
this._updateRow(headerRow, columnTree[index], 'header', index === columnTree.length - 1),
|
|
871
871
|
);
|
|
872
872
|
|
|
873
873
|
Array.from(this.$.footer.children).forEach((footerRow, index) =>
|
|
874
|
-
this._updateRow(footerRow, columnTree[columnTree.length - 1 - index], 'footer', index === 0)
|
|
874
|
+
this._updateRow(footerRow, columnTree[columnTree.length - 1 - index], 'footer', index === 0),
|
|
875
875
|
);
|
|
876
876
|
|
|
877
877
|
// Sizer rows
|
|
@@ -888,7 +888,8 @@ class Grid extends ElementMixin(
|
|
|
888
888
|
}
|
|
889
889
|
|
|
890
890
|
__updateFooterPositioning() {
|
|
891
|
-
|
|
891
|
+
// TODO: fixed in Firefox 99, remove when we can drop Firefox ESR 91 support
|
|
892
|
+
if (this._firefox && parseFloat(navigator.userAgent.match(/Firefox\/(\d{2,3}.\d)/)[1]) < 99) {
|
|
892
893
|
// Sticky (or translated) footer in a flexbox host doesn't get included in
|
|
893
894
|
// the scroll height calculation on FF. This is a workaround for the issue.
|
|
894
895
|
this.$.items.style.paddingBottom = 0;
|
|
@@ -964,7 +965,7 @@ class Grid extends ElementMixin(
|
|
|
964
965
|
level: this._getIndexLevel(row.index),
|
|
965
966
|
expanded: this._isExpanded(row._item),
|
|
966
967
|
selected: this._isSelected(row._item),
|
|
967
|
-
detailsOpened: !!this.rowDetailsRenderer && this._isDetailsOpened(row._item)
|
|
968
|
+
detailsOpened: !!this.rowDetailsRenderer && this._isDetailsOpened(row._item),
|
|
968
969
|
};
|
|
969
970
|
}
|
|
970
971
|
|
|
@@ -1009,7 +1010,7 @@ class Grid extends ElementMixin(
|
|
|
1009
1010
|
*/
|
|
1010
1011
|
notifyResize() {
|
|
1011
1012
|
console.warn(
|
|
1012
|
-
`WARNING: Since Vaadin 22, notifyResize() is deprecated. The component uses a ResizeObserver internally and doesn't need to be explicitly notified of resizes
|
|
1013
|
+
`WARNING: Since Vaadin 22, notifyResize() is deprecated. The component uses a ResizeObserver internally and doesn't need to be explicitly notified of resizes.`,
|
|
1013
1014
|
);
|
|
1014
1015
|
}
|
|
1015
1016
|
}
|
|
@@ -372,7 +372,7 @@ registerStyles(
|
|
|
372
372
|
border-left-color: var(--_lumo-grid-border-color);
|
|
373
373
|
}
|
|
374
374
|
`,
|
|
375
|
-
{ moduleId: 'lumo-grid' }
|
|
375
|
+
{ moduleId: 'lumo-grid' },
|
|
376
376
|
);
|
|
377
377
|
|
|
378
378
|
registerStyles(
|
|
@@ -382,5 +382,5 @@ registerStyles(
|
|
|
382
382
|
font-size: var(--lumo-font-size-m);
|
|
383
383
|
}
|
|
384
384
|
`,
|
|
385
|
-
{ moduleId: 'vaadin-grid-select-all-checkbox-lumo' }
|
|
385
|
+
{ moduleId: 'vaadin-grid-select-all-checkbox-lumo' },
|
|
386
386
|
);
|