@revolist/revogrid 4.27.4 → 4.27.5
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/dist/cjs/index.cjs.js +1 -2
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/revo-grid.cjs.entry.js +1 -1
- package/dist/cjs/revo-grid.cjs.js +1 -1
- package/dist/cjs/revogr-filter-panel.cjs.entry.js +31 -140
- package/dist/cjs/{row-resize.plugin-C4YOF1lN.js → row-resize.plugin-jaZje3kL.js} +4 -53
- package/dist/collection/plugins/filter/filter.indexed.js +0 -5
- package/dist/collection/plugins/filter/filter.panel.js +31 -141
- package/dist/collection/plugins/filter/filter.plugin.js +5 -48
- package/dist/esm/index.js +2 -2
- package/dist/esm/loader.js +1 -1
- package/dist/esm/revo-grid.entry.js +1 -1
- package/dist/esm/revo-grid.js +1 -1
- package/dist/esm/revogr-filter-panel.entry.js +31 -140
- package/dist/esm/{row-resize.plugin-Beu0pMds.js → row-resize.plugin-Dzn9bTOr.js} +5 -53
- package/dist/revo-grid/index.esm.js +2 -2
- package/dist/revo-grid/revo-grid.entry.js +1 -1
- package/dist/revo-grid/revo-grid.esm.js +1 -1
- package/dist/revo-grid/revogr-filter-panel.entry.js +31 -140
- package/dist/revo-grid/{row-resize.plugin-Beu0pMds.js → row-resize.plugin-Dzn9bTOr.js} +5 -53
- package/dist/types/plugins/filter/filter.indexed.d.ts +0 -2
- package/dist/types/plugins/filter/filter.panel.d.ts +2 -9
- package/dist/types/plugins/filter/filter.plugin.d.ts +1 -8
- package/dist/types/plugins/filter/filter.types.d.ts +0 -8
- package/dist/types/types/interfaces.d.ts +1 -13
- package/hydrate/index.js +35 -193
- package/hydrate/index.mjs +35 -193
- package/package.json +1 -1
- package/standalone/index.js +1 -1
- package/standalone/revo-grid.js +1 -1
- package/standalone/revogr-filter-panel.js +1 -1
|
@@ -78,7 +78,6 @@ const FilterPanel = class {
|
|
|
78
78
|
registerInstance(this, hostRef);
|
|
79
79
|
this.filterChange = createEvent(this, "filterChange", 7);
|
|
80
80
|
this.resetChange = createEvent(this, "resetChange", 7);
|
|
81
|
-
this.hasChanges = false;
|
|
82
81
|
this.filterCaptionsInternal = {
|
|
83
82
|
title: 'Filter by',
|
|
84
83
|
ok: 'Close',
|
|
@@ -114,7 +113,7 @@ const FilterPanel = class {
|
|
|
114
113
|
*/
|
|
115
114
|
this.allowDuplicateOperators = true;
|
|
116
115
|
this.debouncedApplyFilter = debounce(() => {
|
|
117
|
-
this.
|
|
116
|
+
this.filterChange.emit(this.filterItems);
|
|
118
117
|
}, 400);
|
|
119
118
|
}
|
|
120
119
|
onMouseDown(e) {
|
|
@@ -144,28 +143,10 @@ const FilterPanel = class {
|
|
|
144
143
|
}
|
|
145
144
|
}
|
|
146
145
|
async show(newEntity) {
|
|
147
|
-
this.debouncedApplyFilter.flush();
|
|
148
|
-
this.hasChanges = false;
|
|
149
146
|
this.changes = newEntity;
|
|
150
|
-
this.filterItems =
|
|
151
|
-
this.draftFilter = undefined;
|
|
147
|
+
this.filterItems = (newEntity === null || newEntity === void 0 ? void 0 : newEntity.filterItems) || {};
|
|
152
148
|
if (this.changes) {
|
|
153
149
|
this.changes.type = this.changes.type || defaultType;
|
|
154
|
-
const prop = this.changes.prop;
|
|
155
|
-
const propFilters = prop === undefined ? undefined : this.filterItems[prop];
|
|
156
|
-
if (!(propFilters === null || propFilters === void 0 ? void 0 : propFilters.length) &&
|
|
157
|
-
this.changes.showDefaultFilter !== false &&
|
|
158
|
-
this.changes.hideDefaultFilters !== true) {
|
|
159
|
-
const type = this.resolveDraftFilterType(this.changes.defaultFilterType);
|
|
160
|
-
if (type) {
|
|
161
|
-
this.draftFilter = {
|
|
162
|
-
id: ++this.filterId,
|
|
163
|
-
type,
|
|
164
|
-
value: '',
|
|
165
|
-
relation: 'and',
|
|
166
|
-
};
|
|
167
|
-
}
|
|
168
|
-
}
|
|
169
150
|
}
|
|
170
151
|
}
|
|
171
152
|
async getChanges() {
|
|
@@ -186,42 +167,29 @@ const FilterPanel = class {
|
|
|
186
167
|
const prop = (_a = this.changes) === null || _a === void 0 ? void 0 : _a.prop;
|
|
187
168
|
if (prop === undefined)
|
|
188
169
|
return '';
|
|
189
|
-
const propFilters = (
|
|
190
|
-
|
|
191
|
-
index,
|
|
192
|
-
isDraft: false,
|
|
193
|
-
}));
|
|
194
|
-
if (this.draftFilter) {
|
|
195
|
-
propFilters.push({
|
|
196
|
-
filter: this.draftFilter,
|
|
197
|
-
index: propFilters.length,
|
|
198
|
-
isDraft: true,
|
|
199
|
-
});
|
|
200
|
-
}
|
|
201
|
-
const visibleFilters = propFilters.filter(({ filter }) => !filter.hidden);
|
|
202
|
-
const visibleFilterCount = visibleFilters.length;
|
|
170
|
+
const propFilters = (_b = this.filterItems[prop]) !== null && _b !== void 0 ? _b : [];
|
|
171
|
+
const visibleFilterCount = propFilters.filter(filter => !filter.hidden).length;
|
|
203
172
|
const capts = Object.assign(Object.assign({}, this.filterCaptionsInternal), this.filterCaptions);
|
|
204
|
-
return (h("div", { key: this.filterId }, h("ul", { class: "multi-filter-list-container" }, propFilters.map((
|
|
205
|
-
var _a;
|
|
173
|
+
return (h("div", { key: this.filterId }, h("ul", { class: "multi-filter-list-container" }, propFilters.map((filter, index) => {
|
|
206
174
|
let andOrButton;
|
|
207
175
|
if (filter.hidden) {
|
|
208
176
|
return;
|
|
209
177
|
}
|
|
210
178
|
// hide toggle button if there is only one filter and the last one
|
|
211
|
-
if (
|
|
179
|
+
if (index !== this.filterItems[prop].length - 1) {
|
|
212
180
|
andOrButton = (h(AndOrButton, { text: filter.relation === 'and' ? capts.and : capts.or, onClick: () => this.toggleFilterAndOr(filter.id) }));
|
|
213
181
|
}
|
|
214
|
-
const extra = this.renderExtra(prop, index
|
|
182
|
+
const extra = this.renderExtra(prop, index);
|
|
215
183
|
const isDragging = this.draggedFilterId === filter.id;
|
|
216
184
|
const isDragOver = this.dragOverFilterId === filter.id && !isDragging;
|
|
217
|
-
const canReorder = visibleFilterCount > 1
|
|
185
|
+
const canReorder = visibleFilterCount > 1;
|
|
218
186
|
return (h("li", { key: filter.id, class: FILTER_LIST_CLASS, "aria-label": `${capts.filterCondition} ${index + 1}` }, h("div", { class: {
|
|
219
187
|
'multi-filter-list-row': true,
|
|
220
188
|
'filter-row-drop-active': this.draggedFilterId !== undefined && !isDragging,
|
|
221
189
|
'filter-row-dragging': isDragging,
|
|
222
190
|
'filter-row-drag-over': isDragOver,
|
|
223
|
-
} }, canReorder ? (h("button", { type: "button", class: "filter-row-drop-target", tabIndex: -1, "aria-label": `${capts.filterCondition} ${index + 1}`, onDragOver: e => this.onFilterDragOver(e, filter.id), onDragLeave: () => this.onFilterDragLeave(filter.id), onDrop: e => this.onFilterDrop(e, prop, filter.id) })) : '', canReorder ? (h(ReorderButton, { ariaLabel: capts.reorderFilter, dragging: isDragging, dragOver: isDragOver, onDragStart: e => this.onFilterDragStart(e, filter.id), onDragEnd: () => this.onFilterDragEnd(), onKeyDown: e => this.onFilterReorderKeyDown(e, prop, filter.id) })) : '', h("div", { class: { 'select-input': true } }, h("select", { class: "select-css select-filter", onChange: e => this.onFilterTypeChange(e, prop, index
|
|
224
|
-
})),
|
|
191
|
+
} }, canReorder ? (h("button", { type: "button", class: "filter-row-drop-target", tabIndex: -1, "aria-label": `${capts.filterCondition} ${index + 1}`, onDragOver: e => this.onFilterDragOver(e, filter.id), onDragLeave: () => this.onFilterDragLeave(filter.id), onDrop: e => this.onFilterDrop(e, prop, filter.id) })) : '', canReorder ? (h(ReorderButton, { ariaLabel: capts.reorderFilter, dragging: isDragging, dragOver: isDragOver, onDragStart: e => this.onFilterDragStart(e, filter.id), onDragEnd: () => this.onFilterDragEnd(), onKeyDown: e => this.onFilterReorderKeyDown(e, prop, filter.id) })) : '', h("div", { class: { 'select-input': true } }, h("select", { class: "select-css select-filter", onChange: e => this.onFilterTypeChange(e, prop, index) }, this.renderSelectOptions(this.filterItems[prop][index].type, true)), extra ? h("div", { class: "filter-extra" }, extra) : ''), h("div", { class: FILTER_LIST_CLASS_ACTION }, andOrButton, h(TrashButton, { ariaLabel: capts.removeFilter, onClick: () => this.onRemoveFilter(filter.id) })))));
|
|
192
|
+
})), propFilters.some(f => !f.hidden) ? h("div", { class: "add-filter-divider" }) : ''));
|
|
225
193
|
}
|
|
226
194
|
componentDidRender() {
|
|
227
195
|
this.syncDialog();
|
|
@@ -270,24 +238,16 @@ const FilterPanel = class {
|
|
|
270
238
|
el.style.left = `${left}px`;
|
|
271
239
|
el.style.top = `${top}px`;
|
|
272
240
|
}
|
|
273
|
-
onFilterTypeChange(e, prop, index
|
|
241
|
+
onFilterTypeChange(e, prop, index) {
|
|
274
242
|
if (!(e.target instanceof HTMLSelectElement)) {
|
|
275
243
|
return;
|
|
276
244
|
}
|
|
277
|
-
|
|
278
|
-
const filter = isDraft
|
|
279
|
-
? this.promoteDraft(prop, type)
|
|
280
|
-
: this.filterItems[prop][index];
|
|
281
|
-
if (!filter) {
|
|
282
|
-
return;
|
|
283
|
-
}
|
|
284
|
-
filter.type = type;
|
|
285
|
-
this.hasChanges = true;
|
|
245
|
+
this.filterItems[prop][index].type = e.target.value;
|
|
286
246
|
// this re-renders the input to know if we need extra input
|
|
287
247
|
this.filterId++;
|
|
288
248
|
// adding setTimeout will wait for the next tick DOM update then focus on input
|
|
289
249
|
setTimeout(() => {
|
|
290
|
-
const input = document.getElementById('filter-input-' +
|
|
250
|
+
const input = document.getElementById('filter-input-' + this.filterItems[prop][index].id);
|
|
291
251
|
if (input instanceof HTMLInputElement) {
|
|
292
252
|
input.focus();
|
|
293
253
|
}
|
|
@@ -322,20 +282,12 @@ const FilterPanel = class {
|
|
|
322
282
|
return;
|
|
323
283
|
this.filterId++;
|
|
324
284
|
this.currentFilterId = this.filterId;
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
this.filterItems[prop].push({
|
|
332
|
-
id: this.currentFilterId,
|
|
333
|
-
type: this.currentFilterType,
|
|
334
|
-
value: '',
|
|
335
|
-
relation: 'and',
|
|
336
|
-
});
|
|
337
|
-
this.hasChanges = true;
|
|
338
|
-
}
|
|
285
|
+
this.filterItems[prop].push({
|
|
286
|
+
id: this.currentFilterId,
|
|
287
|
+
type: this.currentFilterType,
|
|
288
|
+
value: '',
|
|
289
|
+
relation: 'and',
|
|
290
|
+
});
|
|
339
291
|
// adding setTimeout will wait for the next tick DOM update then focus on input
|
|
340
292
|
setTimeout(() => {
|
|
341
293
|
const input = document.getElementById('filter-input-' + this.currentFilterId);
|
|
@@ -344,9 +296,7 @@ const FilterPanel = class {
|
|
|
344
296
|
}, 0);
|
|
345
297
|
}
|
|
346
298
|
onSave() {
|
|
347
|
-
|
|
348
|
-
this.emitFilterChange();
|
|
349
|
-
}
|
|
299
|
+
this.filterChange.emit(this.filterItems);
|
|
350
300
|
}
|
|
351
301
|
onCancel() {
|
|
352
302
|
this.changes = undefined;
|
|
@@ -354,25 +304,16 @@ const FilterPanel = class {
|
|
|
354
304
|
onReset() {
|
|
355
305
|
var _a;
|
|
356
306
|
this.assertChanges();
|
|
357
|
-
this.
|
|
358
|
-
const prop = (_a = this.changes) === null || _a === void 0 ? void 0 : _a.prop;
|
|
359
|
-
if (prop !== undefined) {
|
|
360
|
-
delete this.filterItems[prop];
|
|
361
|
-
}
|
|
362
|
-
this.resetChange.emit(prop);
|
|
307
|
+
this.resetChange.emit((_a = this.changes) === null || _a === void 0 ? void 0 : _a.prop);
|
|
363
308
|
// this updates the DOM which is used by getFilterItemsList() key
|
|
364
309
|
this.filterId++;
|
|
365
310
|
}
|
|
366
311
|
onRemoveFilter(id) {
|
|
367
|
-
var _a
|
|
312
|
+
var _a;
|
|
368
313
|
this.assertChanges();
|
|
369
314
|
// this is for reactivity issues for getFilterItemsList()
|
|
370
315
|
this.filterId++;
|
|
371
316
|
const prop = (_a = this.changes) === null || _a === void 0 ? void 0 : _a.prop;
|
|
372
|
-
if (((_b = this.draftFilter) === null || _b === void 0 ? void 0 : _b.id) === id) {
|
|
373
|
-
this.draftFilter = undefined;
|
|
374
|
-
return;
|
|
375
|
-
}
|
|
376
317
|
const items = this.filterItems[prop !== null && prop !== void 0 ? prop : ''];
|
|
377
318
|
if (!items)
|
|
378
319
|
return;
|
|
@@ -380,7 +321,6 @@ const FilterPanel = class {
|
|
|
380
321
|
if (index === -1)
|
|
381
322
|
return;
|
|
382
323
|
items.splice(index, 1);
|
|
383
|
-
this.hasChanges = true;
|
|
384
324
|
// let's remove the prop if no more filters so the filter icon will be removed
|
|
385
325
|
if (items.length === 0)
|
|
386
326
|
delete this.filterItems[prop !== null && prop !== void 0 ? prop : ''];
|
|
@@ -422,7 +362,6 @@ const FilterPanel = class {
|
|
|
422
362
|
if (!moveFilterItem(items, sourceId, targetId)) {
|
|
423
363
|
return;
|
|
424
364
|
}
|
|
425
|
-
this.hasChanges = true;
|
|
426
365
|
this.filterId++;
|
|
427
366
|
if (!this.disableDynamicFiltering) {
|
|
428
367
|
this.debouncedApplyFilter();
|
|
@@ -458,7 +397,6 @@ const FilterPanel = class {
|
|
|
458
397
|
if (!target || !moveFilterItem(items, sourceId, target.id)) {
|
|
459
398
|
return;
|
|
460
399
|
}
|
|
461
|
-
this.hasChanges = true;
|
|
462
400
|
this.filterId++;
|
|
463
401
|
if (!this.disableDynamicFiltering) {
|
|
464
402
|
this.debouncedApplyFilter();
|
|
@@ -477,7 +415,6 @@ const FilterPanel = class {
|
|
|
477
415
|
if (index === -1)
|
|
478
416
|
return;
|
|
479
417
|
items[index].relation = items[index].relation === 'and' ? 'or' : 'and';
|
|
480
|
-
this.hasChanges = true;
|
|
481
418
|
if (!this.disableDynamicFiltering) {
|
|
482
419
|
this.debouncedApplyFilter();
|
|
483
420
|
}
|
|
@@ -526,22 +463,12 @@ const FilterPanel = class {
|
|
|
526
463
|
}
|
|
527
464
|
return options;
|
|
528
465
|
}
|
|
529
|
-
renderExtra(prop, index
|
|
530
|
-
|
|
531
|
-
const currentFilter = isDraft
|
|
532
|
-
? this.draftFilter
|
|
533
|
-
: (_a = this.filterItems[prop]) === null || _a === void 0 ? void 0 : _a[index];
|
|
466
|
+
renderExtra(prop, index) {
|
|
467
|
+
const currentFilter = this.filterItems[prop];
|
|
534
468
|
if (!currentFilter)
|
|
535
469
|
return '';
|
|
536
470
|
const applyFilter = (value) => {
|
|
537
|
-
|
|
538
|
-
if (isDraft && !this.isMeaningfulDraftValue(value)) {
|
|
539
|
-
return;
|
|
540
|
-
}
|
|
541
|
-
if (isDraft && !this.promoteDraft(prop)) {
|
|
542
|
-
return;
|
|
543
|
-
}
|
|
544
|
-
this.hasChanges = true;
|
|
471
|
+
this.filterItems[prop][index].value = value;
|
|
545
472
|
if (!this.disableDynamicFiltering) {
|
|
546
473
|
this.debouncedApplyFilter();
|
|
547
474
|
}
|
|
@@ -556,11 +483,11 @@ const FilterPanel = class {
|
|
|
556
483
|
}
|
|
557
484
|
};
|
|
558
485
|
const capts = Object.assign(Object.assign({}, this.filterCaptionsInternal), this.filterCaptions);
|
|
559
|
-
const extra =
|
|
486
|
+
const extra = this.filterEntities[currentFilter[index].type].extra;
|
|
560
487
|
if (typeof extra === 'function') {
|
|
561
488
|
return extra(h, {
|
|
562
|
-
value: currentFilter.value,
|
|
563
|
-
filter: currentFilter,
|
|
489
|
+
value: currentFilter[index].value,
|
|
490
|
+
filter: currentFilter[index],
|
|
564
491
|
prop,
|
|
565
492
|
index,
|
|
566
493
|
placeholder: capts.placeholder,
|
|
@@ -575,7 +502,7 @@ const FilterPanel = class {
|
|
|
575
502
|
if (extra !== 'input' && extra !== 'datepicker') {
|
|
576
503
|
return '';
|
|
577
504
|
}
|
|
578
|
-
return (h("input", { id: `filter-input-${currentFilter.id}`, placeholder: capts.placeholder, type: extra === 'datepicker' ? 'date' : 'text', value: currentFilter.value, onInput: (e) => {
|
|
505
|
+
return (h("input", { id: `filter-input-${currentFilter[index].id}`, placeholder: capts.placeholder, type: extra === 'datepicker' ? 'date' : 'text', value: currentFilter[index].value, onInput: (e) => {
|
|
579
506
|
if (e.target instanceof HTMLInputElement) {
|
|
580
507
|
applyFilter(e.target.value);
|
|
581
508
|
}
|
|
@@ -591,42 +518,6 @@ const FilterPanel = class {
|
|
|
591
518
|
e.stopPropagation();
|
|
592
519
|
} }));
|
|
593
520
|
}
|
|
594
|
-
resolveDraftFilterType(preferred) {
|
|
595
|
-
var _a, _b;
|
|
596
|
-
const available = Object.values((_b = (_a = this.changes) === null || _a === void 0 ? void 0 : _a.filterTypes) !== null && _b !== void 0 ? _b : {}).flat();
|
|
597
|
-
const type = preferred && available.includes(preferred)
|
|
598
|
-
? preferred
|
|
599
|
-
: available[0];
|
|
600
|
-
return type;
|
|
601
|
-
}
|
|
602
|
-
promoteDraft(prop, type) {
|
|
603
|
-
if (!this.draftFilter) {
|
|
604
|
-
return;
|
|
605
|
-
}
|
|
606
|
-
if (!this.filterItems[prop]) {
|
|
607
|
-
this.filterItems[prop] = [];
|
|
608
|
-
}
|
|
609
|
-
if (type) {
|
|
610
|
-
this.draftFilter.type = type;
|
|
611
|
-
}
|
|
612
|
-
const filter = this.draftFilter;
|
|
613
|
-
this.filterItems[prop].push(filter);
|
|
614
|
-
this.draftFilter = undefined;
|
|
615
|
-
this.hasChanges = true;
|
|
616
|
-
return filter;
|
|
617
|
-
}
|
|
618
|
-
isMeaningfulDraftValue(value) {
|
|
619
|
-
return value !== '' && value !== undefined && value !== null;
|
|
620
|
-
}
|
|
621
|
-
emitFilterChange() {
|
|
622
|
-
this.filterChange.emit(this.cloneFilterItems(this.filterItems));
|
|
623
|
-
}
|
|
624
|
-
cloneFilterItems(filterItems) {
|
|
625
|
-
return Object.fromEntries(Object.entries(filterItems).map(([prop, filters]) => [
|
|
626
|
-
prop,
|
|
627
|
-
filters.map(filter => (Object.assign({}, filter))),
|
|
628
|
-
]));
|
|
629
|
-
}
|
|
630
521
|
getAddFilterSelect() {
|
|
631
522
|
return this.element.querySelector(`#${FILTER_ID}`);
|
|
632
523
|
}
|
|
@@ -659,7 +550,7 @@ const FilterPanel = class {
|
|
|
659
550
|
top: `${(_d = (_c = this.changes) === null || _c === void 0 ? void 0 : _c.y) !== null && _d !== void 0 ? _d : 0}px`,
|
|
660
551
|
};
|
|
661
552
|
const capts = Object.assign(Object.assign({}, this.filterCaptionsInternal), this.filterCaptions);
|
|
662
|
-
return (h(Host, { key: '
|
|
553
|
+
return (h(Host, { key: 'd0e4ebb408750b11b3965da6a25e581733c968e3' }, h("dialog", { key: '3df36777c931ec1063e8574169ca880a99dbfe41', class: "filter-panel-dialog", style: style, ref: el => (this.dialog = el), onCancel: e => {
|
|
663
554
|
e.preventDefault();
|
|
664
555
|
this.onCancel();
|
|
665
556
|
} }, this.changes && [
|
|
@@ -668,7 +559,7 @@ const FilterPanel = class {
|
|
|
668
559
|
((_g = this.changes) === null || _g === void 0 ? void 0 : _g.hideDefaultFilters) !== true && [
|
|
669
560
|
h("label", { key: "filter-title" }, capts.title),
|
|
670
561
|
h("div", { key: "filter-holder", class: "filter-holder" }, this.getFilterItemsList()),
|
|
671
|
-
h("div", { key: "add-filter", class: "add-filter" }, h("select", { key: '
|
|
562
|
+
h("div", { key: "add-filter", class: "add-filter" }, h("select", { key: 'e2a8bd29f2090d3e6c933795427b71ca190b82aa', id: FILTER_ID, class: "select-css", onChange: e => this.onAddNewFilter(e) }, this.renderSelectOptions(this.currentFilterType))),
|
|
672
563
|
],
|
|
673
564
|
h("slot", { key: "default-slot" }),
|
|
674
565
|
((_j = (_h = this.changes).extraBottomContent) === null || _j === void 0 ? void 0 : _j.call(_h, this.changes)) || '',
|
|
@@ -1361,11 +1361,6 @@ const filterTypes = {
|
|
|
1361
1361
|
boolean: ['notEmpty', 'empty'],
|
|
1362
1362
|
array: ['notEmpty', 'empty'],
|
|
1363
1363
|
};
|
|
1364
|
-
/** Preferred initial operator for built-in filter families. */
|
|
1365
|
-
const filterTypeDefaults = {
|
|
1366
|
-
string: 'contains',
|
|
1367
|
-
number: 'eqN',
|
|
1368
|
-
};
|
|
1369
1364
|
const filterNames = {
|
|
1370
1365
|
none: 'None',
|
|
1371
1366
|
empty: 'Is blank',
|
|
@@ -1408,8 +1403,6 @@ const FILTE_PANEL = 'revogr-filter-panel';
|
|
|
1408
1403
|
*
|
|
1409
1404
|
* @property {FilterLocalization|undefined} localization - translation for filter popup captions.
|
|
1410
1405
|
*
|
|
1411
|
-
* @property {boolean|undefined} defaultFilter - creates a draft condition when an empty filter panel opens. Defaults to true.
|
|
1412
|
-
*
|
|
1413
1406
|
* @property {boolean|undefined} disableDynamicFiltering - disables dynamic filtering. A way to apply filters on Save only.
|
|
1414
1407
|
*/
|
|
1415
1408
|
/**
|
|
@@ -1431,7 +1424,7 @@ class FilterPlugin extends BasePlugin {
|
|
|
1431
1424
|
* number: ['eqN', 'neqN', 'gt']
|
|
1432
1425
|
* }
|
|
1433
1426
|
*/
|
|
1434
|
-
this.filterByType = Object.
|
|
1427
|
+
this.filterByType = Object.assign({}, filterTypes);
|
|
1435
1428
|
this.filterNameIndexByType = Object.assign({}, filterNames);
|
|
1436
1429
|
this.filterFunctionsIndexedByType = Object.assign({}, filterCoreFunctionsIndexedByType);
|
|
1437
1430
|
this.filterProp = FILTER_PROP;
|
|
@@ -1515,16 +1508,11 @@ class FilterPlugin extends BasePlugin {
|
|
|
1515
1508
|
return null;
|
|
1516
1509
|
}
|
|
1517
1510
|
initConfig(config) {
|
|
1518
|
-
var _a
|
|
1511
|
+
var _a;
|
|
1519
1512
|
this.config = config;
|
|
1520
1513
|
this.allowDuplicateOperators = (_a = config.allowDuplicateOperators) !== null && _a !== void 0 ? _a : true;
|
|
1521
1514
|
if (this.pop) {
|
|
1522
1515
|
this.pop.allowDuplicateOperators = this.allowDuplicateOperators;
|
|
1523
|
-
this.pop.disableDynamicFiltering =
|
|
1524
|
-
(_b = config.disableDynamicFiltering) !== null && _b !== void 0 ? _b : false;
|
|
1525
|
-
this.pop.closeOnOutsideClick =
|
|
1526
|
-
(_c = config.closeFilterPanelOnOutsideClick) !== null && _c !== void 0 ? _c : true;
|
|
1527
|
-
this.pop.filterCaptions = (_d = config.localization) === null || _d === void 0 ? void 0 : _d.captions;
|
|
1528
1516
|
}
|
|
1529
1517
|
if (config.multiFilterItems) {
|
|
1530
1518
|
this.multiFilterItems = Object.assign({}, config.multiFilterItems);
|
|
@@ -1613,12 +1601,11 @@ class FilterPlugin extends BasePlugin {
|
|
|
1613
1601
|
}
|
|
1614
1602
|
// filter button clicked, open filter dialog
|
|
1615
1603
|
const buttonPos = (filterButton instanceof HTMLElement ? filterButton : el).getBoundingClientRect();
|
|
1616
|
-
const data = Object.assign(Object.assign(Object.assign({}, e.detail), this.filterCollection[prop]), { x: buttonPos.x, y: buttonPos.y + buttonPos.height, anchorY: buttonPos.y, autoCorrect: true, filterTypes: this.getColumnFilter(e.detail.filter),
|
|
1604
|
+
const data = Object.assign(Object.assign(Object.assign({}, e.detail), this.filterCollection[prop]), { x: buttonPos.x, y: buttonPos.y + buttonPos.height, anchorY: buttonPos.y, autoCorrect: true, filterTypes: this.getColumnFilter(e.detail.filter), filterItems: this.multiFilterItems, extraContent: this.extraHyperContent, extraBottomContent: this.extraBottomHyperContent });
|
|
1617
1605
|
(_b = this.beforeshow) === null || _b === void 0 ? void 0 : _b.call(this, data);
|
|
1618
1606
|
this.pop.show(data);
|
|
1619
1607
|
}
|
|
1620
|
-
getColumnFilter(
|
|
1621
|
-
const type = this.isColumnFilterOption(config) ? config.type : config;
|
|
1608
|
+
getColumnFilter(type) {
|
|
1622
1609
|
let filterType = 'string';
|
|
1623
1610
|
if (!type) {
|
|
1624
1611
|
return { [filterType]: this.filterByType[filterType] };
|
|
@@ -1638,41 +1625,6 @@ class FilterPlugin extends BasePlugin {
|
|
|
1638
1625
|
}
|
|
1639
1626
|
return { [filterType]: this.filterByType[filterType] };
|
|
1640
1627
|
}
|
|
1641
|
-
/** Resolve the preferred operator against the column's available filters. */
|
|
1642
|
-
getDefaultFilter(config) {
|
|
1643
|
-
var _a;
|
|
1644
|
-
const filters = this.getColumnFilter(config);
|
|
1645
|
-
const availableFilters = Object.values(filters).flat();
|
|
1646
|
-
const columnDefault = this.isColumnFilterOption(config)
|
|
1647
|
-
? config.default
|
|
1648
|
-
: undefined;
|
|
1649
|
-
if (typeof columnDefault === 'string' &&
|
|
1650
|
-
availableFilters.includes(columnDefault)) {
|
|
1651
|
-
return columnDefault;
|
|
1652
|
-
}
|
|
1653
|
-
const firstFamily = Object.keys(filters)[0];
|
|
1654
|
-
const familyDefault = filterTypeDefaults[firstFamily];
|
|
1655
|
-
if (familyDefault && ((_a = filters[firstFamily]) === null || _a === void 0 ? void 0 : _a.includes(familyDefault))) {
|
|
1656
|
-
return familyDefault;
|
|
1657
|
-
}
|
|
1658
|
-
return availableFilters[0];
|
|
1659
|
-
}
|
|
1660
|
-
/** Resolve grid and column-level draft opt-outs. */
|
|
1661
|
-
shouldShowDefaultFilter(config) {
|
|
1662
|
-
var _a;
|
|
1663
|
-
if (this.isColumnFilterOption(config)) {
|
|
1664
|
-
if (config.default === false) {
|
|
1665
|
-
return false;
|
|
1666
|
-
}
|
|
1667
|
-
if (typeof config.default === 'string') {
|
|
1668
|
-
return true;
|
|
1669
|
-
}
|
|
1670
|
-
}
|
|
1671
|
-
return ((_a = this.config) === null || _a === void 0 ? void 0 : _a.defaultFilter) !== false;
|
|
1672
|
-
}
|
|
1673
|
-
isColumnFilterOption(value) {
|
|
1674
|
-
return !!value && typeof value === 'object' && !Array.isArray(value);
|
|
1675
|
-
}
|
|
1676
1628
|
isValidType(type) {
|
|
1677
1629
|
return !!(typeof type === 'string' && this.filterByType[type]);
|
|
1678
1630
|
}
|
|
@@ -3757,4 +3709,4 @@ class RowResizePlugin extends BasePlugin {
|
|
|
3757
3709
|
}
|
|
3758
3710
|
}
|
|
3759
3711
|
|
|
3760
|
-
export { AutoSizeColumnPlugin as A, BasePlugin as B, ColumnAutoSizeMode as C, DimensionStore as D, ExportFilePlugin as E, FILTER_TRIMMED_TYPE as F, GroupingRowPlugin as G,
|
|
3712
|
+
export { AutoSizeColumnPlugin as A, BasePlugin as B, ColumnAutoSizeMode as C, DimensionStore as D, ExportFilePlugin as E, FILTER_TRIMMED_TYPE as F, GroupingRowPlugin as G, ROW_RESIZE_CANCEL_EVENT as H, RowResizePlugin as I, DEFAULT_MIN_ROW_HEIGHT as J, resolveRowResizeConfig as K, clampRowResizeHeight as L, getRowResizeIndexes as M, createRowResizePatch as N, mergeRowResizeDefinitions as O, SortingPlugin as P, hasActiveSorting as Q, ROW_RESIZE_HANDLE_CLASS as R, SelectionStore as S, getSortingIndex as T, sortIndexByItems as U, defaultCellCompare as V, descCellCompare as W, getNextOrder as X, getComparer as Y, StretchColumn as a, ExportCsv as b, FILTER_CONFIG_CHANGED_EVENT as c, defineTheme as d, FILTE_PANEL as e, FilterPlugin as f, filterCoreFunctionsIndexedByType as g, filterTypes as h, isStretchPlugin as i, filterNames as j, DEFAULT_BLANK_SEMANTICS as k, isBlankValue as l, doCollapse as m, doExpand as n, COLUMN_DRAG_MOVE_EVENT as o, COLUMN_DRAG_END_EVENT as p, BEFORE_COLUMN_DRAG_END_EVENT as q, resolveBlankSemantics as r, COLUMN_DRAG_START_EVENT as s, themeTokenCssVariables as t, ColumnMovePlugin as u, getLeftRelative as v, getColumnDragPosition as w, BEFORE_ROW_RESIZE_EVENT as x, ROW_RESIZE_EVENT as y, AFTER_ROW_RESIZE_EVENT as z };
|
|
@@ -1,8 +1,6 @@
|
|
|
1
1
|
import { LogicFunction } from './filter.types';
|
|
2
2
|
export declare const filterCoreFunctionsIndexedByType: Record<FilterType, LogicFunction>;
|
|
3
3
|
export declare const filterTypes: Record<string, FilterType[]>;
|
|
4
|
-
/** Preferred initial operator for built-in filter families. */
|
|
5
|
-
export declare const filterTypeDefaults: Partial<Record<string, FilterType>>;
|
|
6
4
|
export declare const filterNames: {
|
|
7
5
|
none: string;
|
|
8
6
|
empty: string;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { EventEmitter, type VNode } from '../../stencil-public-runtime';
|
|
2
2
|
import '../../utils/closest.polifill';
|
|
3
|
-
import { FilterCaptions,
|
|
3
|
+
import { FilterCaptions, LogicFunction, MultiFilterItem, ShowData } from './filter.types';
|
|
4
4
|
import type { ColumnProp } from "../../types/index";
|
|
5
5
|
import { FilterType } from './filter.indexed';
|
|
6
6
|
/**
|
|
@@ -11,7 +11,6 @@ import { FilterType } from './filter.indexed';
|
|
|
11
11
|
*/
|
|
12
12
|
export declare class FilterPanel {
|
|
13
13
|
private dialog?;
|
|
14
|
-
private hasChanges;
|
|
15
14
|
private filterCaptionsInternal;
|
|
16
15
|
element: HTMLElement;
|
|
17
16
|
isFilterIdSet: boolean;
|
|
@@ -20,7 +19,6 @@ export declare class FilterPanel {
|
|
|
20
19
|
currentFilterType: FilterType;
|
|
21
20
|
changes: ShowData | undefined;
|
|
22
21
|
filterItems: MultiFilterItem;
|
|
23
|
-
draftFilter: FilterData | undefined;
|
|
24
22
|
draggedFilterId: number | undefined;
|
|
25
23
|
dragOverFilterId: number | undefined;
|
|
26
24
|
filterNames: Record<string, string>;
|
|
@@ -65,12 +63,7 @@ export declare class FilterPanel {
|
|
|
65
63
|
private toggleFilterAndOr;
|
|
66
64
|
private assertChanges;
|
|
67
65
|
renderSelectOptions(type: FilterType, isDefaultTypeRemoved?: boolean): VNode[] | undefined;
|
|
68
|
-
renderExtra(prop: ColumnProp, index: number
|
|
69
|
-
private resolveDraftFilterType;
|
|
70
|
-
private promoteDraft;
|
|
71
|
-
private isMeaningfulDraftValue;
|
|
72
|
-
private emitFilterChange;
|
|
73
|
-
private cloneFilterItems;
|
|
66
|
+
renderExtra(prop: ColumnProp, index: number): any;
|
|
74
67
|
private getAddFilterSelect;
|
|
75
68
|
private isOwnFilterButton;
|
|
76
69
|
private getOwningGrid;
|
|
@@ -24,8 +24,6 @@ export declare const FILTE_PANEL = "revogr-filter-panel";
|
|
|
24
24
|
*
|
|
25
25
|
* @property {FilterLocalization|undefined} localization - translation for filter popup captions.
|
|
26
26
|
*
|
|
27
|
-
* @property {boolean|undefined} defaultFilter - creates a draft condition when an empty filter panel opens. Defaults to true.
|
|
28
|
-
*
|
|
29
27
|
* @property {boolean|undefined} disableDynamicFiltering - disables dynamic filtering. A way to apply filters on Save only.
|
|
30
28
|
*/
|
|
31
29
|
/**
|
|
@@ -58,12 +56,7 @@ export declare class FilterPlugin extends BasePlugin {
|
|
|
58
56
|
extraContent(): any;
|
|
59
57
|
initConfig(config: ColumnFilterConfig): void;
|
|
60
58
|
headerclick(e: CustomEvent<ColumnRegular>): Promise<void>;
|
|
61
|
-
getColumnFilter(
|
|
62
|
-
/** Resolve the preferred operator against the column's available filters. */
|
|
63
|
-
getDefaultFilter(config?: ColumnRegular['filter']): string | undefined;
|
|
64
|
-
/** Resolve grid and column-level draft opt-outs. */
|
|
65
|
-
shouldShowDefaultFilter(config?: ColumnRegular['filter']): boolean;
|
|
66
|
-
private isColumnFilterOption;
|
|
59
|
+
getColumnFilter(type?: boolean | string | string[]): Record<string, string[]>;
|
|
67
60
|
isValidType(type: any): type is string;
|
|
68
61
|
/**
|
|
69
62
|
* Called on internal component change
|
|
@@ -83,10 +83,6 @@ export interface FilterLocalization {
|
|
|
83
83
|
export interface ColumnFilterConfig {
|
|
84
84
|
/** Grid-level blank policy. Individual columns can override fields. */
|
|
85
85
|
blankSemantics?: BlankSemantics;
|
|
86
|
-
/**
|
|
87
|
-
* Whether empty filter panels start with a draft condition. Defaults to true.
|
|
88
|
-
*/
|
|
89
|
-
defaultFilter?: boolean;
|
|
90
86
|
/**
|
|
91
87
|
* The collection of filters to be applied to the column.
|
|
92
88
|
*/
|
|
@@ -169,10 +165,6 @@ export interface ShowData extends FilterItem, Omit<ColumnRegular, 'filter'> {
|
|
|
169
165
|
*/
|
|
170
166
|
autoCorrect?: boolean;
|
|
171
167
|
filterTypes?: Record<string, string[]>;
|
|
172
|
-
/** Preferred operator for an empty panel. */
|
|
173
|
-
defaultFilterType?: string;
|
|
174
|
-
/** Whether an empty panel should create a draft condition. */
|
|
175
|
-
showDefaultFilter?: boolean;
|
|
176
168
|
filterItems?: MultiFilterItem;
|
|
177
169
|
hideDefaultFilters?: boolean;
|
|
178
170
|
extraContent?: (data: ShowData) => any;
|
|
@@ -165,18 +165,6 @@ export interface ColumnType<TModel extends DataType = DataType> extends ColumnPr
|
|
|
165
165
|
cellParser?: (model: TModel, column: ColumnRegular<ColumnProp, TModel>) => any;
|
|
166
166
|
}
|
|
167
167
|
export type Order = 'asc' | 'desc' | undefined;
|
|
168
|
-
/**
|
|
169
|
-
* Structured filter configuration for an individual column.
|
|
170
|
-
*/
|
|
171
|
-
export interface ColumnFilterOption {
|
|
172
|
-
/** Filter family, or ordered filter families, available to the column. */
|
|
173
|
-
type: string | string[];
|
|
174
|
-
/**
|
|
175
|
-
* Preferred operator shown when the column has no filter conditions, or false
|
|
176
|
-
* to disable the draft.
|
|
177
|
-
*/
|
|
178
|
-
default?: string | false;
|
|
179
|
-
}
|
|
180
168
|
/**
|
|
181
169
|
* Interface for regular column definition.
|
|
182
170
|
* Regular column can be any column that is not a grouping column.
|
|
@@ -206,7 +194,7 @@ export interface ColumnRegular<P extends ColumnProp = ColumnProp, TModel extends
|
|
|
206
194
|
/**
|
|
207
195
|
* Filter. Require filter plugin to be installed and activated through grid config filter.
|
|
208
196
|
*/
|
|
209
|
-
filter?: boolean | string | string[]
|
|
197
|
+
filter?: boolean | string | string[];
|
|
210
198
|
/** Partial column override for the grid-level blank filtering policy. */
|
|
211
199
|
blankSemantics?: BlankSemantics;
|
|
212
200
|
/**
|