@revolist/revogrid 4.23.12 → 4.23.14
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/{cell-renderer-DfUCisis.js → cell-renderer-Dcz022q7.js} +5 -23
- package/dist/cjs/{column.drag.plugin-BRraLvz3.js → column.drag.plugin-BGLbi1zS.js} +8 -37
- package/dist/cjs/{column.service-BNWNiJW3.js → column.service-C1Qvcf5l.js} +23 -62
- package/dist/cjs/{header-cell-renderer-DyjOxArm.js → header-cell-renderer-vVr4IWNV.js} +1 -1
- package/dist/cjs/index.cjs.js +4 -5
- package/dist/cjs/revo-grid.cjs.entry.js +5 -5
- package/dist/cjs/revogr-attribution_7.cjs.entry.js +4 -40
- package/dist/cjs/revogr-data_4.cjs.entry.js +5 -13
- package/dist/cjs/revogr-filter-panel.cjs.entry.js +67 -32
- package/dist/collection/components/data/column.service.js +23 -62
- package/dist/collection/components/data/row-renderer.js +2 -15
- package/dist/collection/components/overlay/revogr-overlay-selection.js +7 -27
- package/dist/collection/components/revoGrid/revo-grid.js +7 -14
- package/dist/collection/components/scroll/revogr-viewport-scroll.js +2 -10
- package/dist/collection/plugins/filter/filter.panel.js +66 -31
- package/dist/collection/plugins/filter/filter.plugin.js +4 -4
- package/dist/collection/plugins/filter/filter.style.css +18 -34
- package/dist/collection/plugins/groupingRow/grouping.row.renderer.js +2 -7
- package/dist/collection/plugins/moveColumn/column.drag.plugin.js +2 -30
- package/dist/collection/serve/controller.js +0 -1
- package/dist/esm/{cell-renderer-CLTRlCa5.js → cell-renderer-BtN-NGCk.js} +5 -23
- package/dist/esm/{column.drag.plugin-V9DDE3mU.js → column.drag.plugin-4Ixr4ijU.js} +9 -37
- package/dist/esm/{column.service-C6hByxPy.js → column.service-CC_SD8W3.js} +23 -62
- package/dist/esm/{header-cell-renderer-BMmXRsd_.js → header-cell-renderer-B-LX2sgu.js} +1 -1
- package/dist/esm/index.js +5 -5
- package/dist/esm/revo-grid.entry.js +5 -5
- package/dist/esm/revogr-attribution_7.entry.js +4 -40
- package/dist/esm/revogr-data_4.entry.js +5 -13
- package/dist/esm/revogr-filter-panel.entry.js +67 -32
- package/dist/revo-grid/{cell-renderer-CLTRlCa5.js → cell-renderer-BtN-NGCk.js} +5 -23
- package/dist/revo-grid/{column.drag.plugin-V9DDE3mU.js → column.drag.plugin-4Ixr4ijU.js} +9 -37
- package/dist/revo-grid/{column.service-C6hByxPy.js → column.service-CC_SD8W3.js} +23 -62
- package/dist/revo-grid/{header-cell-renderer-BMmXRsd_.js → header-cell-renderer-B-LX2sgu.js} +1 -1
- package/dist/revo-grid/index.esm.js +5 -5
- package/dist/revo-grid/revo-grid.entry.js +5 -5
- package/dist/revo-grid/revogr-attribution_7.entry.js +4 -40
- package/dist/revo-grid/revogr-data_4.entry.js +5 -13
- package/dist/revo-grid/revogr-filter-panel.entry.js +67 -32
- package/dist/types/components/data/column.service.d.ts +1 -10
- package/dist/types/components/data/row-renderer.d.ts +1 -1
- package/dist/types/components/overlay/revogr-overlay-selection.d.ts +3 -4
- package/dist/types/components/revoGrid/revo-grid.d.ts +4 -4
- package/dist/types/components.d.ts +14 -14
- package/dist/types/plugins/filter/filter.panel.d.ts +4 -0
- package/dist/types/plugins/filter/filter.plugin.d.ts +0 -1
- package/dist/types/plugins/filter/filter.types.d.ts +0 -1
- package/dist/types/plugins/moveColumn/column.drag.plugin.d.ts +0 -4
- package/dist/types/types/interfaces.d.ts +0 -8
- package/hydrate/index.js +107 -201
- package/hydrate/index.mjs +107 -201
- package/package.json +1 -1
- package/readme.md +1 -20
- package/standalone/column.service.js +1 -1
- package/standalone/index.js +1 -1
- package/standalone/revo-grid.js +1 -1
- package/standalone/revogr-data2.js +1 -1
- package/standalone/revogr-filter-panel.js +1 -1
- package/standalone/revogr-overlay-selection2.js +1 -1
- package/standalone/revogr-viewport-scroll2.js +1 -1
- package/dist/collection/components/overlay/clipboard.utils.js +0 -26
- package/dist/types/components/overlay/clipboard.utils.d.ts +0 -3
|
@@ -26,7 +26,7 @@ var filter_button = require('./filter.button-w6LWnyhi.js');
|
|
|
26
26
|
}
|
|
27
27
|
})();
|
|
28
28
|
|
|
29
|
-
const filterStyleCss = () => `.revo-button{position:relative;overflow:hidden;color:#fff;background-color:#4545ff;height:32px;line-height:32px;padding:0 15px;outline:0;border:0;border-radius:7px;box-sizing:border-box;cursor:pointer}.revo-button.green{background-color:#009037}.revo-button.red{background-color:#E0662E}.revo-button:disabled,.revo-button[disabled]{cursor:not-allowed !important;filter:opacity(0.35) !important}.revo-button.outline{border:1px solid #dbdbdb;line-height:30px;background:none;color:#000;box-shadow:none}revo-grid[theme^=dark] .revo-button.outline{border:1px solid #404040;color:#d8d8d8}revogr-filter-panel{
|
|
29
|
+
const filterStyleCss = () => `.revo-button{position:relative;overflow:hidden;color:#fff;background-color:#4545ff;height:32px;line-height:32px;padding:0 15px;outline:0;border:0;border-radius:7px;box-sizing:border-box;cursor:pointer}.revo-button.green{background-color:#009037}.revo-button.red{background-color:#E0662E}.revo-button:disabled,.revo-button[disabled]{cursor:not-allowed !important;filter:opacity(0.35) !important}.revo-button.outline{border:1px solid #dbdbdb;line-height:30px;background:none;color:#000;box-shadow:none}revo-grid[theme^=dark] .revo-button.outline{border:1px solid #404040;color:#d8d8d8}revogr-filter-panel{display:block}revogr-filter-panel .filter-panel-dialog{position:fixed;top:0;left:0;z-index:100;max-height:calc(100vh - 16px);overflow:auto;opacity:1;transform:none;background-color:var(--revo-grid-filter-panel-bg, #fff);border:1px solid var(--revo-grid-filter-panel-border, #cecece);transform-origin:62px 0px;box-shadow:0 5px 18px -2px var(--revo-grid-filter-panel-shadow, rgba(0, 0, 0, 0.15));padding:10px;border-radius:8px;margin:0;min-width:220px;text-align:left;animation:revogr-filter-panel-open 140ms cubic-bezier(0.2, 0, 0, 1)}revogr-filter-panel .filter-panel-dialog::backdrop{background:transparent}revogr-filter-panel .filter-panel-dialog .filter-holder>div{display:flex;flex-direction:column}revogr-filter-panel .filter-panel-dialog label{font-size:13px;display:block;padding:8px 0}revogr-filter-panel .filter-panel-dialog select{width:100%}revogr-filter-panel .filter-panel-dialog input[type=text]{border:0;min-height:34px;margin:5px 0;background:var(--revo-grid-filter-panel-input-bg, #f3f3f3);border-radius:5px;padding:0 10px;box-sizing:border-box;width:100%}revogr-filter-panel .filter-panel-dialog .filter-actions{text-align:right;margin-right:-5px}revogr-filter-panel .filter-panel-dialog .filter-actions button{margin-top:10px;margin-right:5px}@keyframes revogr-filter-panel-open{from{opacity:0;transform:translateY(-4px) scale(0.98)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){revogr-filter-panel .filter-panel-dialog{animation:none}}.rgHeaderCell:hover .rv-filter{transition:opacity 267ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, transform 178ms cubic-bezier(0.4, 0, 0.2, 1) 0ms}.rgHeaderCell:hover .rv-filter,.rgHeaderCell .rv-filter.active{opacity:1}.rgHeaderCell .rv-filter{height:24px;width:24px;background:none;border:0;opacity:0;visibility:visible;cursor:pointer;border-radius:4px}.rgHeaderCell .rv-filter.active{color:#10224a}.rgHeaderCell .rv-filter .filter-img{color:gray;width:11px}.select-css{display:block;font-family:sans-serif;line-height:1.3;padding:0.6em 1.4em 0.5em 0.8em;width:100%;max-width:100%;box-sizing:border-box;margin:0;border:1px solid var(--revo-grid-filter-panel-select-border, #d9d9d9);box-shadow:transparent;border-radius:0.5em;appearance:none;background-color:var(--revo-grid-filter-panel-input-bg, #f3f3f3);background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E");background-repeat:no-repeat, repeat;background-position:right 0.7em top 50%, 0 0;background-size:0.65em auto, 100%;}.select-css::-ms-expand{display:none}.select-css:hover{border-color:var(--revo-grid-filter-panel-select-border, #d9d9d9)}.select-css:focus{border-color:var(--revo-grid-filter-panel-select-border-hover, #d9d9d9);box-shadow:0 0 1px 3px rgba(59, 153, 252, 0.7);box-shadow:0 0 0 3px -moz-mac-focusring;outline:none}.select-css option{font-weight:normal}.select-css:disabled,.select-css[aria-disabled=true]{color:gray;background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22graytext%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E"), linear-gradient(to bottom, #ffffff 0%, #ffffff 100%)}.select-css:disabled:hover,.select-css[aria-disabled=true]{border-color:var(--revo-grid-filter-panel-select-border, #d9d9d9)}.multi-filter-list{margin-top:5px;margin-bottom:5px}.multi-filter-list div{white-space:nowrap}.multi-filter-list .multi-filter-list-action{display:flex;justify-content:space-between;align-items:center}.multi-filter-list .and-or-button{margin:0 0 0 10px;min-width:58px;cursor:pointer}.multi-filter-list .trash-button{margin:0 0 -2px 6px;cursor:pointer;width:22px;height:100%;font-size:16px}.multi-filter-list .trash-button .trash-img{width:1em}.add-filter-divider{display:block;margin:0 -10px 10px -10px;border-bottom:1px solid var(--revo-grid-filter-panel-divider, #d9d9d9);height:10px}.select-input{display:flex;justify-content:space-between;align-items:center}`;
|
|
30
30
|
|
|
31
31
|
const defaultType = 'none';
|
|
32
32
|
const FILTER_LIST_CLASS = 'multi-filter-list';
|
|
@@ -131,24 +131,56 @@ const FilterPanel = class {
|
|
|
131
131
|
if (index$1 !== this.filterItems[prop].length - 1) {
|
|
132
132
|
andOrButton = (index.h("div", { onClick: () => this.toggleFilterAndOr(filter.id) }, index.h(filter_button.AndOrButton, { text: filter.relation === 'and' ? capts.and : capts.or })));
|
|
133
133
|
}
|
|
134
|
-
|
|
135
|
-
return (index.h("div", { key: filter.id, class: FILTER_LIST_CLASS }, index.h("div", { class: "multi-filter-list-row" }, index.h("div", { class: { 'select-input': true } }, index.h("select", { class: "select-css select-filter", onChange: e => this.onFilterTypeChange(e, prop, index$1) }, this.renderSelectOptions(this.filterItems[prop][index$1].type, true)), extra ? index.h("div", { class: "filter-extra" }, extra) : ''), index.h("div", { class: FILTER_LIST_CLASS_ACTION }, andOrButton, index.h("div", { onClick: () => this.onRemoveFilter(filter.id) }, index.h(filter_button.TrashButton, null))))));
|
|
134
|
+
return (index.h("div", { key: filter.id, class: FILTER_LIST_CLASS }, index.h("div", { class: { 'select-input': true } }, index.h("select", { class: "select-css select-filter", onChange: e => this.onFilterTypeChange(e, prop, index$1) }, this.renderSelectOptions(this.filterItems[prop][index$1].type, true)), index.h("div", { class: FILTER_LIST_CLASS_ACTION }, andOrButton), index.h("div", { onClick: () => this.onRemoveFilter(filter.id) }, index.h(filter_button.TrashButton, null))), index.h("div", null, this.renderExtra(prop, index$1))));
|
|
136
135
|
}), propFilters.filter(f => !f.hidden).length > 0 ? index.h("div", { class: "add-filter-divider" }) : ''));
|
|
137
136
|
}
|
|
137
|
+
componentDidRender() {
|
|
138
|
+
this.syncDialog();
|
|
139
|
+
}
|
|
140
|
+
syncDialog() {
|
|
141
|
+
if (!this.dialog) {
|
|
142
|
+
return;
|
|
143
|
+
}
|
|
144
|
+
if (!this.changes) {
|
|
145
|
+
if (this.dialog.open) {
|
|
146
|
+
this.dialog.close();
|
|
147
|
+
}
|
|
148
|
+
return;
|
|
149
|
+
}
|
|
150
|
+
if (!this.dialog.open) {
|
|
151
|
+
this.dialog.show();
|
|
152
|
+
}
|
|
153
|
+
if (this.changes.autoCorrect !== false) {
|
|
154
|
+
requestAnimationFrame(() => this.autoCorrect(this.dialog));
|
|
155
|
+
}
|
|
156
|
+
}
|
|
138
157
|
autoCorrect(el) {
|
|
139
|
-
var _a, _b;
|
|
140
158
|
if (!el) {
|
|
141
159
|
return;
|
|
142
160
|
}
|
|
143
|
-
const
|
|
144
|
-
|
|
161
|
+
const pos = el.getBoundingClientRect();
|
|
162
|
+
const maxLeft = Math.max(0, window.innerWidth - pos.width);
|
|
163
|
+
const maxTop = Math.max(0, window.innerHeight - pos.height);
|
|
164
|
+
if (pos.left > maxLeft) {
|
|
165
|
+
el.style.left = `${maxLeft}px`;
|
|
166
|
+
}
|
|
167
|
+
if (pos.top > maxTop) {
|
|
168
|
+
el.style.top = `${maxTop}px`;
|
|
169
|
+
}
|
|
170
|
+
}
|
|
171
|
+
onDialogMouseDown(e) {
|
|
172
|
+
if (!this.closeOnOutsideClick ||
|
|
173
|
+
e.target !== this.dialog ||
|
|
174
|
+
!this.dialog) {
|
|
145
175
|
return;
|
|
146
176
|
}
|
|
147
|
-
const
|
|
148
|
-
const
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
177
|
+
const rect = this.dialog.getBoundingClientRect();
|
|
178
|
+
const isInside = e.clientX >= rect.left &&
|
|
179
|
+
e.clientX <= rect.right &&
|
|
180
|
+
e.clientY >= rect.top &&
|
|
181
|
+
e.clientY <= rect.bottom;
|
|
182
|
+
if (!isInside) {
|
|
183
|
+
this.onCancel();
|
|
152
184
|
}
|
|
153
185
|
}
|
|
154
186
|
onFilterTypeChange(e, prop, index) {
|
|
@@ -349,30 +381,33 @@ const FilterPanel = class {
|
|
|
349
381
|
} }));
|
|
350
382
|
}
|
|
351
383
|
render() {
|
|
352
|
-
var _a, _b, _c, _d, _e;
|
|
353
|
-
if (!this.changes) {
|
|
354
|
-
return index.h(index.Host, { style: { display: 'none' } });
|
|
355
|
-
}
|
|
384
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
356
385
|
const style = {
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
top: `${this.changes.y}px`,
|
|
386
|
+
left: `${(_b = (_a = this.changes) === null || _a === void 0 ? void 0 : _a.x) !== null && _b !== void 0 ? _b : 0}px`,
|
|
387
|
+
top: `${(_d = (_c = this.changes) === null || _c === void 0 ? void 0 : _c.y) !== null && _d !== void 0 ? _d : 0}px`,
|
|
360
388
|
};
|
|
361
389
|
const capts = Object.assign(this.filterCaptionsInternal, this.filterCaptions);
|
|
362
|
-
return (index.h(index.Host, { style: style, ref: el => {
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
}
|
|
366
|
-
index.h("
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
index.h("
|
|
374
|
-
index.h("
|
|
375
|
-
|
|
390
|
+
return (index.h(index.Host, { key: '9fb424017d080876ff7796237917b4f41f617fe0' }, index.h("dialog", { key: '37b9f870b95f6fe1bd7be359dd7b77ef196e896e', class: "filter-panel-dialog", style: style, ref: el => (this.dialog = el), onCancel: e => {
|
|
391
|
+
e.preventDefault();
|
|
392
|
+
this.onCancel();
|
|
393
|
+
}, onMouseDown: e => this.onDialogMouseDown(e) }, this.changes && [
|
|
394
|
+
index.h("slot", { key: '76ec505a92d0a7c1ae0bbb5f4cac63555f3416be', slot: "header" }),
|
|
395
|
+
((_f = (_e = this.changes).extraContent) === null || _f === void 0 ? void 0 : _f.call(_e, this.changes)) || '',
|
|
396
|
+
((_g = this.changes) === null || _g === void 0 ? void 0 : _g.hideDefaultFilters) !== true && [
|
|
397
|
+
index.h("label", { key: 'c6fd82c95f6005f286c7bc90de34956128a83246' }, capts.title),
|
|
398
|
+
index.h("div", { key: '5e7dac36ad79ba1b6072a0053b30aa384ade0dde', class: "filter-holder" }, this.getFilterItemsList()),
|
|
399
|
+
index.h("div", { key: 'd9b6103edbd138d4db845745686ee4c847310a66', class: "add-filter" }, index.h("select", { key: 'c1b321f2d19458f95ab3f9188d83d94bebdb688e', id: FILTER_ID, class: "select-css", onChange: e => this.onAddNewFilter(e) }, this.renderSelectOptions(this.currentFilterType))),
|
|
400
|
+
],
|
|
401
|
+
index.h("slot", { key: '1571dcbc5c57651deb42a4046272ff60fa74f5a7' }),
|
|
402
|
+
index.h("div", { key: '4aa7dee532336b084542df0209291b4c60378b49', class: "filter-actions" }, this.disableDynamicFiltering && [
|
|
403
|
+
index.h("button", { key: '4c1b3054cd1bb7f46877592f00f6634d0f7ecafa', id: "revo-button-save", "aria-label": "save", class: "revo-button green", onClick: () => this.onSave() }, capts.save),
|
|
404
|
+
index.h("button", { key: 'f31a568c89be18b1a854cdd7d4726e01db24e338', id: "revo-button-ok", "aria-label": "ok", class: "revo-button green", onClick: () => this.onCancel() }, capts.cancel),
|
|
405
|
+
], !this.disableDynamicFiltering && [
|
|
406
|
+
index.h("button", { key: '5d40e8b1f13f94cff4f5a2e2aefeee8861104a9d', id: "revo-button-ok", "aria-label": "ok", class: "revo-button green", onClick: () => this.onCancel() }, capts.ok),
|
|
407
|
+
index.h("button", { key: '67eac3abd16f6f6e2ed7089dcfb0d05524ddb7df', id: "revo-button-reset", "aria-label": "reset", class: "revo-button outline", onClick: () => this.onReset() }, capts.reset),
|
|
408
|
+
]),
|
|
409
|
+
index.h("slot", { key: 'b27a9bb3ef814e1e09dca14eda3e332ff34c654c', slot: "footer" }),
|
|
410
|
+
])));
|
|
376
411
|
}
|
|
377
412
|
get element() { return index.getElement(this); }
|
|
378
413
|
};
|
|
@@ -144,82 +144,43 @@ export default class ColumnService {
|
|
|
144
144
|
mapping,
|
|
145
145
|
};
|
|
146
146
|
}
|
|
147
|
-
getTransformedDataToApply(
|
|
147
|
+
getTransformedDataToApply(start, data) {
|
|
148
148
|
const changed = {};
|
|
149
149
|
const copyRowLength = data.length;
|
|
150
|
-
if (!copyRowLength) {
|
|
151
|
-
return {
|
|
152
|
-
changed,
|
|
153
|
-
range: null,
|
|
154
|
-
};
|
|
155
|
-
}
|
|
156
150
|
const colLength = this.columns.length;
|
|
157
151
|
const rowLength = this.dataStore.get('items').length;
|
|
158
|
-
const bounds = this.getDataApplyBounds(start, targetRange, copyRowLength, rowLength, colLength);
|
|
159
|
-
if (!bounds) {
|
|
160
|
-
return {
|
|
161
|
-
changed,
|
|
162
|
-
range: null,
|
|
163
|
-
};
|
|
164
|
-
}
|
|
165
|
-
const { startRow, startCol, endRow } = bounds;
|
|
166
|
-
let maxCol = startCol - 1;
|
|
167
|
-
let lastRow = startRow - 1;
|
|
168
152
|
// rows
|
|
169
|
-
|
|
153
|
+
let rowIndex = start.y;
|
|
154
|
+
let maxCol = 0;
|
|
155
|
+
for (let i = 0; rowIndex < rowLength && i < copyRowLength; rowIndex++, i++) {
|
|
170
156
|
// copy original data link
|
|
171
157
|
const copyRow = data[i % copyRowLength];
|
|
172
158
|
const copyColLength = (copyRow === null || copyRow === void 0 ? void 0 : copyRow.length) || 0;
|
|
173
|
-
|
|
174
|
-
|
|
159
|
+
// columns
|
|
160
|
+
let colIndex = start.x;
|
|
161
|
+
for (let j = 0; colIndex < colLength && j < copyColLength; colIndex++, j++) {
|
|
162
|
+
const p = this.columns[colIndex].prop;
|
|
163
|
+
const currentCol = j % colLength;
|
|
164
|
+
/** if can write */
|
|
165
|
+
if (!this.isReadOnly(rowIndex, colIndex)) {
|
|
166
|
+
/** to show before save */
|
|
167
|
+
if (!changed[rowIndex]) {
|
|
168
|
+
changed[rowIndex] = {};
|
|
169
|
+
}
|
|
170
|
+
changed[rowIndex][p] = copyRow[currentCol];
|
|
171
|
+
}
|
|
175
172
|
}
|
|
176
|
-
maxCol = Math.max(maxCol,
|
|
177
|
-
bounds,
|
|
178
|
-
copyColLength,
|
|
179
|
-
copyRow,
|
|
180
|
-
rowIndex,
|
|
181
|
-
start,
|
|
182
|
-
targetRange,
|
|
183
|
-
}));
|
|
184
|
-
lastRow = rowIndex;
|
|
173
|
+
maxCol = Math.max(maxCol, colIndex - 1);
|
|
185
174
|
}
|
|
175
|
+
const range = getRange(start, {
|
|
176
|
+
y: rowIndex - 1,
|
|
177
|
+
x: maxCol,
|
|
178
|
+
});
|
|
186
179
|
return {
|
|
187
180
|
changed,
|
|
188
|
-
range
|
|
181
|
+
range,
|
|
189
182
|
};
|
|
190
183
|
}
|
|
191
|
-
getDataApplyBounds(start, targetRange, copyRowLength, rowLength, colLength) {
|
|
192
|
-
var _a, _b, _c;
|
|
193
|
-
const startRow = (_a = targetRange === null || targetRange === void 0 ? void 0 : targetRange.y) !== null && _a !== void 0 ? _a : start.y;
|
|
194
|
-
const startCol = (_b = targetRange === null || targetRange === void 0 ? void 0 : targetRange.x) !== null && _b !== void 0 ? _b : start.x;
|
|
195
|
-
const endRow = Math.min(rowLength - 1, (_c = targetRange === null || targetRange === void 0 ? void 0 : targetRange.y1) !== null && _c !== void 0 ? _c : start.y + copyRowLength - 1);
|
|
196
|
-
if (endRow < startRow || startCol >= colLength) {
|
|
197
|
-
return null;
|
|
198
|
-
}
|
|
199
|
-
return { startRow, startCol, endRow, colLength };
|
|
200
|
-
}
|
|
201
|
-
applyClipboardRow(changed, { bounds, copyColLength, copyRow, rowIndex, start, targetRange, }) {
|
|
202
|
-
var _a;
|
|
203
|
-
const endCol = Math.min(bounds.colLength - 1, (_a = targetRange === null || targetRange === void 0 ? void 0 : targetRange.x1) !== null && _a !== void 0 ? _a : start.x + copyColLength - 1);
|
|
204
|
-
for (let colIndex = bounds.startCol, j = 0; colIndex <= endCol; colIndex++, j++) {
|
|
205
|
-
if (this.isReadOnly(rowIndex, colIndex)) {
|
|
206
|
-
continue;
|
|
207
|
-
}
|
|
208
|
-
const prop = this.columns[colIndex].prop;
|
|
209
|
-
changed[rowIndex] = changed[rowIndex] || {};
|
|
210
|
-
changed[rowIndex][prop] = copyRow[j % copyColLength];
|
|
211
|
-
}
|
|
212
|
-
return endCol;
|
|
213
|
-
}
|
|
214
|
-
getAppliedRange({ startRow, startCol }, lastRow, maxCol) {
|
|
215
|
-
if (lastRow < startRow || maxCol < startCol) {
|
|
216
|
-
return null;
|
|
217
|
-
}
|
|
218
|
-
return getRange({ x: startCol, y: startRow }, {
|
|
219
|
-
y: lastRow,
|
|
220
|
-
x: maxCol,
|
|
221
|
-
});
|
|
222
|
-
}
|
|
223
184
|
getRangeStaticData(d, value) {
|
|
224
185
|
const changed = {};
|
|
225
186
|
// rows
|
|
@@ -1,24 +1,11 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Built by Revolist OU ❤️
|
|
3
3
|
*/
|
|
4
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
5
|
-
var t = {};
|
|
6
|
-
for (var p in s)
|
|
7
|
-
if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
8
|
-
t[p] = s[p];
|
|
9
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
10
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
11
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
12
|
-
t[p[i]] = s[p[i]];
|
|
13
|
-
}
|
|
14
|
-
return t;
|
|
15
|
-
};
|
|
16
4
|
import { h } from "@stencil/core";
|
|
17
5
|
import { DATA_ROW } from "../../utils/consts";
|
|
18
6
|
export const PADDING_DEPTH = 10;
|
|
19
|
-
const RowRenderer = (
|
|
20
|
-
|
|
21
|
-
const props = Object.assign(Object.assign(Object.assign({}, attrs), { [DATA_ROW]: index }), (typeof groupingLevel === 'number'
|
|
7
|
+
const RowRenderer = ({ rowClass, index, size, start, depth, groupingLevel }, cells) => {
|
|
8
|
+
const props = Object.assign({ [DATA_ROW]: index }, (typeof groupingLevel === 'number'
|
|
22
9
|
? { 'data-level': groupingLevel }
|
|
23
10
|
: {}));
|
|
24
11
|
return (h("div", Object.assign({}, props, { class: `rgRow ${rowClass || ''}`, style: {
|
|
@@ -10,7 +10,6 @@ import { collectModelsOfRange, getCell, getFocusCellBasedOnEvent, styleByCellPro
|
|
|
10
10
|
import { isEditInput } from "../editors/edit.utils";
|
|
11
11
|
import { KeyboardService } from "./keyboard.service";
|
|
12
12
|
import { AutoFillService } from "./autofill.service";
|
|
13
|
-
import { getRangeFillClipboardData } from "./clipboard.utils";
|
|
14
13
|
import { verifyTouchTarget } from "../../utils/events";
|
|
15
14
|
import { getCellData } from "../../utils";
|
|
16
15
|
/**
|
|
@@ -234,9 +233,9 @@ export class OverlaySelection {
|
|
|
234
233
|
nodes.push(h("revogr-order-editor", { ref: e => (this.orderEditor = e), dataStore: this.dataStore, dimensionRow: this.dimensionRow, dimensionCol: this.dimensionCol, parent: this.element, rowType: this.types.rowType, onRowdragstartinit: e => this.rowDragStart(e) }));
|
|
235
234
|
}
|
|
236
235
|
}
|
|
237
|
-
return (h(Host, { key: '
|
|
236
|
+
return (h(Host, { key: 'd936e8452e84c7a25ecd6502e929f1a5af69467f', class: { mobile: this.isMobileDevice }, onDblClick: (e) => this.onElementDblClick(e), onMouseDown: (e) => this.onElementMouseDown(e), onTouchStart: (e) => this.onElementMouseDown(e, true), onCloseedit: (e) => this.closeEdit(e),
|
|
238
237
|
// it's done to be able to throw events from different levels, not just from editor
|
|
239
|
-
onCelledit: (e) => this.onEditCell(e) }, nodes, h("slot", { key: '
|
|
238
|
+
onCelledit: (e) => this.onEditCell(e) }, nodes, h("slot", { key: 'cd3525d404aa44fd8d06e7fc459777acb8a9d585', name: "data" })));
|
|
240
239
|
}
|
|
241
240
|
/**
|
|
242
241
|
* Executes the focus operation on the specified range of cells.
|
|
@@ -401,25 +400,13 @@ export class OverlaySelection {
|
|
|
401
400
|
if (!focus || isEditing) {
|
|
402
401
|
return;
|
|
403
402
|
}
|
|
404
|
-
|
|
405
|
-
const targetRange = rangeFillData
|
|
406
|
-
? this.getClipboardPasteTargetRange()
|
|
407
|
-
: null;
|
|
408
|
-
let { changed, range } = this.columnService.getTransformedDataToApply({
|
|
409
|
-
start: focus,
|
|
410
|
-
data: rangeFillData || data,
|
|
411
|
-
targetRange,
|
|
412
|
-
});
|
|
403
|
+
let { changed, range } = this.columnService.getTransformedDataToApply(focus, data);
|
|
413
404
|
const { defaultPrevented: canPaste } = this.rangeClipboardPaste.emit(Object.assign({ data: changed, models: collectModelsOfRange(changed, this.dataStore), range }, this.types));
|
|
414
405
|
if (canPaste) {
|
|
415
406
|
return;
|
|
416
407
|
}
|
|
417
408
|
(_a = this.autoFillService) === null || _a === void 0 ? void 0 : _a.onRangeApply(changed, range, range);
|
|
418
409
|
}
|
|
419
|
-
getClipboardPasteTargetRange() {
|
|
420
|
-
const range = this.selectionStore.get('range');
|
|
421
|
-
return range && !isRangeSingleCell(range) ? range : null;
|
|
422
|
-
}
|
|
423
410
|
async focusNext() {
|
|
424
411
|
var _a;
|
|
425
412
|
const canFocus = await ((_a = this.keyboardService) === null || _a === void 0 ? void 0 : _a.keyChangeSelection(new KeyboardEvent('keydown', {
|
|
@@ -578,22 +565,15 @@ export class OverlaySelection {
|
|
|
578
565
|
"type": "boolean",
|
|
579
566
|
"mutable": false,
|
|
580
567
|
"complexType": {
|
|
581
|
-
"original": "boolean
|
|
582
|
-
"resolved": "
|
|
583
|
-
"references": {
|
|
584
|
-
"ClipboardConfig": {
|
|
585
|
-
"location": "import",
|
|
586
|
-
"path": "@type",
|
|
587
|
-
"id": "src/types/index.ts::ClipboardConfig",
|
|
588
|
-
"referenceLocation": "ClipboardConfig"
|
|
589
|
-
}
|
|
590
|
-
}
|
|
568
|
+
"original": "boolean",
|
|
569
|
+
"resolved": "boolean",
|
|
570
|
+
"references": {}
|
|
591
571
|
},
|
|
592
572
|
"required": false,
|
|
593
573
|
"optional": false,
|
|
594
574
|
"docs": {
|
|
595
575
|
"tags": [],
|
|
596
|
-
"text": "Enable revogr-clipboard component (read more in revogr-clipboard component).\nAllows copy/paste.
|
|
576
|
+
"text": "Enable revogr-clipboard component (read more in revogr-clipboard component).\nAllows copy/paste."
|
|
597
577
|
},
|
|
598
578
|
"getter": false,
|
|
599
579
|
"setter": false,
|
|
@@ -64,7 +64,7 @@ export class RevoGridComponent {
|
|
|
64
64
|
this.rowSize = 0;
|
|
65
65
|
/** Indicates default column size. */
|
|
66
66
|
this.colSize = 100;
|
|
67
|
-
/** When true, user can
|
|
67
|
+
/** When true, user can range selection. */
|
|
68
68
|
this.range = false;
|
|
69
69
|
/** When true, grid in read only mode. */
|
|
70
70
|
this.readonly = false;
|
|
@@ -76,7 +76,7 @@ export class RevoGridComponent {
|
|
|
76
76
|
this.noHorizontalScrollTransfer = false;
|
|
77
77
|
/** When true cell focus appear. */
|
|
78
78
|
this.canFocus = true;
|
|
79
|
-
/** When true enable clipboard.
|
|
79
|
+
/** When true enable clipboard. */
|
|
80
80
|
this.useClipboard = true;
|
|
81
81
|
/**
|
|
82
82
|
* Columns - defines an array of grid columns.
|
|
@@ -1202,7 +1202,7 @@ export class RevoGridComponent {
|
|
|
1202
1202
|
"optional": false,
|
|
1203
1203
|
"docs": {
|
|
1204
1204
|
"tags": [],
|
|
1205
|
-
"text": "When true, user can
|
|
1205
|
+
"text": "When true, user can range selection."
|
|
1206
1206
|
},
|
|
1207
1207
|
"getter": false,
|
|
1208
1208
|
"setter": false,
|
|
@@ -1294,22 +1294,15 @@ export class RevoGridComponent {
|
|
|
1294
1294
|
"type": "boolean",
|
|
1295
1295
|
"mutable": false,
|
|
1296
1296
|
"complexType": {
|
|
1297
|
-
"original": "boolean
|
|
1298
|
-
"resolved": "
|
|
1299
|
-
"references": {
|
|
1300
|
-
"ClipboardConfig": {
|
|
1301
|
-
"location": "import",
|
|
1302
|
-
"path": "@type",
|
|
1303
|
-
"id": "src/types/index.ts::ClipboardConfig",
|
|
1304
|
-
"referenceLocation": "ClipboardConfig"
|
|
1305
|
-
}
|
|
1306
|
-
}
|
|
1297
|
+
"original": "boolean",
|
|
1298
|
+
"resolved": "boolean",
|
|
1299
|
+
"references": {}
|
|
1307
1300
|
},
|
|
1308
1301
|
"required": false,
|
|
1309
1302
|
"optional": false,
|
|
1310
1303
|
"docs": {
|
|
1311
1304
|
"tags": [],
|
|
1312
|
-
"text": "When true enable clipboard.
|
|
1305
|
+
"text": "When true enable clipboard."
|
|
1313
1306
|
},
|
|
1314
1307
|
"getter": false,
|
|
1315
1308
|
"setter": false,
|
|
@@ -219,17 +219,9 @@ export class RevogrViewportScroll {
|
|
|
219
219
|
}
|
|
220
220
|
render() {
|
|
221
221
|
var _a, _b;
|
|
222
|
-
const
|
|
223
|
-
// When content fits in the viewport (no scroll needed), don't inflate content-wrapper
|
|
224
|
-
// to clientHeight — that would prevent inner-content-table from shrinking and push
|
|
225
|
-
// rowPinEnd (footer) to the bottom instead of letting it follow the data rows.
|
|
226
|
-
// For large/compressed grids (content > clientHeight), physicalContentHeight handles
|
|
227
|
-
// the browser scroll-size compression correctly.
|
|
228
|
-
const physicalContentHeight = this.contentHeight < clientHeight
|
|
229
|
-
? Math.max(this.contentHeight, 0)
|
|
230
|
-
: getContentSize(this.contentHeight, clientHeight);
|
|
222
|
+
const physicalContentHeight = getContentSize(this.contentHeight, (_b = (_a = this.verticalScroll) === null || _a === void 0 ? void 0 : _a.clientHeight) !== null && _b !== void 0 ? _b : 0);
|
|
231
223
|
const physicalContentWidth = getContentSize(this.contentWidth, 0);
|
|
232
|
-
return (h(Host, { key: '
|
|
224
|
+
return (h(Host, { key: 'ec8d907976c1d50f7aab3c263be3f0249a274df6', onWheel: this.horizontalMouseWheel, onScroll: (e) => this.applyScroll('rgCol', e) }, h("div", { key: 'e35696a7993ac94261426b45c28d488cdc42b7f0', class: "inner-content-table", style: { width: `${physicalContentWidth}px` } }, h("div", { key: 'a6997451e01eacda1d27d4efa1d74e1748626218', class: "header-wrapper", ref: e => (this.header = e) }, h("slot", { key: '1d401e87d32d5b1531c2211723b552bbc894f22c', name: HEADER_SLOT })), h("div", { key: 'ceab6f9e812d6ca9a0aa376afcd2562a17f505e0', class: "vertical-inner", ref: el => (this.verticalScroll = el), onWheel: this.verticalMouseWheel, onScroll: (e) => this.applyScroll('rgRow', e) }, h("div", { key: 'a9556578a23d6efddec2e982e863aec064042154', class: "content-wrapper", style: { height: `${physicalContentHeight}px` } }, h("slot", { key: '0ae01f9736b9740612e75261f6e3abebda533377', name: CONTENT_SLOT }))), h("div", { key: '09c2565d4ed449a43820f92d97b6558fca3758e7', class: "footer-wrapper", ref: e => (this.footer = e) }, h("slot", { key: '1ffb08ff8138a560cc09d82e3fe22a53e502aafe', name: FOOTER_SLOT })))));
|
|
233
225
|
}
|
|
234
226
|
/**
|
|
235
227
|
* Extra layer for scroll event monitoring, where MouseWheel event is not passing
|
|
@@ -112,24 +112,56 @@ export class FilterPanel {
|
|
|
112
112
|
if (index !== this.filterItems[prop].length - 1) {
|
|
113
113
|
andOrButton = (h("div", { onClick: () => this.toggleFilterAndOr(filter.id) }, h(AndOrButton, { text: filter.relation === 'and' ? capts.and : capts.or })));
|
|
114
114
|
}
|
|
115
|
-
|
|
116
|
-
return (h("div", { key: filter.id, class: FILTER_LIST_CLASS }, h("div", { class: "multi-filter-list-row" }, 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("div", { onClick: () => this.onRemoveFilter(filter.id) }, h(TrashButton, null))))));
|
|
115
|
+
return (h("div", { key: filter.id, class: FILTER_LIST_CLASS }, 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)), h("div", { class: FILTER_LIST_CLASS_ACTION }, andOrButton), h("div", { onClick: () => this.onRemoveFilter(filter.id) }, h(TrashButton, null))), h("div", null, this.renderExtra(prop, index))));
|
|
117
116
|
}), propFilters.filter(f => !f.hidden).length > 0 ? h("div", { class: "add-filter-divider" }) : ''));
|
|
118
117
|
}
|
|
118
|
+
componentDidRender() {
|
|
119
|
+
this.syncDialog();
|
|
120
|
+
}
|
|
121
|
+
syncDialog() {
|
|
122
|
+
if (!this.dialog) {
|
|
123
|
+
return;
|
|
124
|
+
}
|
|
125
|
+
if (!this.changes) {
|
|
126
|
+
if (this.dialog.open) {
|
|
127
|
+
this.dialog.close();
|
|
128
|
+
}
|
|
129
|
+
return;
|
|
130
|
+
}
|
|
131
|
+
if (!this.dialog.open) {
|
|
132
|
+
this.dialog.show();
|
|
133
|
+
}
|
|
134
|
+
if (this.changes.autoCorrect !== false) {
|
|
135
|
+
requestAnimationFrame(() => this.autoCorrect(this.dialog));
|
|
136
|
+
}
|
|
137
|
+
}
|
|
119
138
|
autoCorrect(el) {
|
|
120
|
-
var _a, _b;
|
|
121
139
|
if (!el) {
|
|
122
140
|
return;
|
|
123
141
|
}
|
|
124
|
-
const
|
|
125
|
-
|
|
142
|
+
const pos = el.getBoundingClientRect();
|
|
143
|
+
const maxLeft = Math.max(0, window.innerWidth - pos.width);
|
|
144
|
+
const maxTop = Math.max(0, window.innerHeight - pos.height);
|
|
145
|
+
if (pos.left > maxLeft) {
|
|
146
|
+
el.style.left = `${maxLeft}px`;
|
|
147
|
+
}
|
|
148
|
+
if (pos.top > maxTop) {
|
|
149
|
+
el.style.top = `${maxTop}px`;
|
|
150
|
+
}
|
|
151
|
+
}
|
|
152
|
+
onDialogMouseDown(e) {
|
|
153
|
+
if (!this.closeOnOutsideClick ||
|
|
154
|
+
e.target !== this.dialog ||
|
|
155
|
+
!this.dialog) {
|
|
126
156
|
return;
|
|
127
157
|
}
|
|
128
|
-
const
|
|
129
|
-
const
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
158
|
+
const rect = this.dialog.getBoundingClientRect();
|
|
159
|
+
const isInside = e.clientX >= rect.left &&
|
|
160
|
+
e.clientX <= rect.right &&
|
|
161
|
+
e.clientY >= rect.top &&
|
|
162
|
+
e.clientY <= rect.bottom;
|
|
163
|
+
if (!isInside) {
|
|
164
|
+
this.onCancel();
|
|
133
165
|
}
|
|
134
166
|
}
|
|
135
167
|
onFilterTypeChange(e, prop, index) {
|
|
@@ -330,30 +362,33 @@ export class FilterPanel {
|
|
|
330
362
|
} }));
|
|
331
363
|
}
|
|
332
364
|
render() {
|
|
333
|
-
var _a, _b, _c, _d, _e;
|
|
334
|
-
if (!this.changes) {
|
|
335
|
-
return h(Host, { style: { display: 'none' } });
|
|
336
|
-
}
|
|
365
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
337
366
|
const style = {
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
top: `${this.changes.y}px`,
|
|
367
|
+
left: `${(_b = (_a = this.changes) === null || _a === void 0 ? void 0 : _a.x) !== null && _b !== void 0 ? _b : 0}px`,
|
|
368
|
+
top: `${(_d = (_c = this.changes) === null || _c === void 0 ? void 0 : _c.y) !== null && _d !== void 0 ? _d : 0}px`,
|
|
341
369
|
};
|
|
342
370
|
const capts = Object.assign(this.filterCaptionsInternal, this.filterCaptions);
|
|
343
|
-
return (h(Host, { style: style, ref: el => {
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
}
|
|
347
|
-
h("
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
h("
|
|
355
|
-
h("
|
|
356
|
-
|
|
371
|
+
return (h(Host, { key: '9fb424017d080876ff7796237917b4f41f617fe0' }, h("dialog", { key: '37b9f870b95f6fe1bd7be359dd7b77ef196e896e', class: "filter-panel-dialog", style: style, ref: el => (this.dialog = el), onCancel: e => {
|
|
372
|
+
e.preventDefault();
|
|
373
|
+
this.onCancel();
|
|
374
|
+
}, onMouseDown: e => this.onDialogMouseDown(e) }, this.changes && [
|
|
375
|
+
h("slot", { key: '76ec505a92d0a7c1ae0bbb5f4cac63555f3416be', slot: "header" }),
|
|
376
|
+
((_f = (_e = this.changes).extraContent) === null || _f === void 0 ? void 0 : _f.call(_e, this.changes)) || '',
|
|
377
|
+
((_g = this.changes) === null || _g === void 0 ? void 0 : _g.hideDefaultFilters) !== true && [
|
|
378
|
+
h("label", { key: 'c6fd82c95f6005f286c7bc90de34956128a83246' }, capts.title),
|
|
379
|
+
h("div", { key: '5e7dac36ad79ba1b6072a0053b30aa384ade0dde', class: "filter-holder" }, this.getFilterItemsList()),
|
|
380
|
+
h("div", { key: 'd9b6103edbd138d4db845745686ee4c847310a66', class: "add-filter" }, h("select", { key: 'c1b321f2d19458f95ab3f9188d83d94bebdb688e', id: FILTER_ID, class: "select-css", onChange: e => this.onAddNewFilter(e) }, this.renderSelectOptions(this.currentFilterType))),
|
|
381
|
+
],
|
|
382
|
+
h("slot", { key: '1571dcbc5c57651deb42a4046272ff60fa74f5a7' }),
|
|
383
|
+
h("div", { key: '4aa7dee532336b084542df0209291b4c60378b49', class: "filter-actions" }, this.disableDynamicFiltering && [
|
|
384
|
+
h("button", { key: '4c1b3054cd1bb7f46877592f00f6634d0f7ecafa', id: "revo-button-save", "aria-label": "save", class: "revo-button green", onClick: () => this.onSave() }, capts.save),
|
|
385
|
+
h("button", { key: 'f31a568c89be18b1a854cdd7d4726e01db24e338', id: "revo-button-ok", "aria-label": "ok", class: "revo-button green", onClick: () => this.onCancel() }, capts.cancel),
|
|
386
|
+
], !this.disableDynamicFiltering && [
|
|
387
|
+
h("button", { key: '5d40e8b1f13f94cff4f5a2e2aefeee8861104a9d', id: "revo-button-ok", "aria-label": "ok", class: "revo-button green", onClick: () => this.onCancel() }, capts.ok),
|
|
388
|
+
h("button", { key: '67eac3abd16f6f6e2ed7089dcfb0d05524ddb7df', id: "revo-button-reset", "aria-label": "reset", class: "revo-button outline", onClick: () => this.onReset() }, capts.reset),
|
|
389
|
+
]),
|
|
390
|
+
h("slot", { key: 'b27a9bb3ef814e1e09dca14eda3e332ff34c654c', slot: "footer" }),
|
|
391
|
+
])));
|
|
357
392
|
}
|
|
358
393
|
static get is() { return "revogr-filter-panel"; }
|
|
359
394
|
static get originalStyleUrls() {
|
|
@@ -178,7 +178,8 @@ export class FilterPlugin extends BasePlugin {
|
|
|
178
178
|
async headerclick(e) {
|
|
179
179
|
var _a, _b;
|
|
180
180
|
const el = (_a = e.detail.originalEvent) === null || _a === void 0 ? void 0 : _a.target;
|
|
181
|
-
|
|
181
|
+
const filterButton = isFilterBtn(el);
|
|
182
|
+
if (!filterButton) {
|
|
182
183
|
return;
|
|
183
184
|
}
|
|
184
185
|
e.preventDefault();
|
|
@@ -192,9 +193,8 @@ export class FilterPlugin extends BasePlugin {
|
|
|
192
193
|
return;
|
|
193
194
|
}
|
|
194
195
|
// filter button clicked, open filter dialog
|
|
195
|
-
const
|
|
196
|
-
const
|
|
197
|
-
const data = Object.assign(Object.assign(Object.assign({}, e.detail), this.filterCollection[prop]), { x: buttonPos.x - gridPos.x, y: buttonPos.y - gridPos.y + buttonPos.height, autoCorrect: true, filterTypes: this.getColumnFilter(e.detail.filter), filterItems: this.multiFilterItems, extraContent: this.extraHyperContent, extraBottomContent: this.extraBottomHyperContent });
|
|
196
|
+
const buttonPos = (filterButton instanceof HTMLElement ? filterButton : el).getBoundingClientRect();
|
|
197
|
+
const data = Object.assign(Object.assign(Object.assign({}, e.detail), this.filterCollection[prop]), { x: buttonPos.x, y: buttonPos.y + buttonPos.height, autoCorrect: true, filterTypes: this.getColumnFilter(e.detail.filter), filterItems: this.multiFilterItems, extraContent: this.extraHyperContent });
|
|
198
198
|
(_b = this.beforeshow) === null || _b === void 0 ? void 0 : _b.call(this, data);
|
|
199
199
|
this.pop.show(data);
|
|
200
200
|
}
|