@revolist/revogrid 4.23.14 → 4.23.15

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 (81) hide show
  1. package/dist/cjs/{cell-renderer-Dcz022q7.js → cell-renderer-DfUCisis.js} +23 -5
  2. package/dist/cjs/{column.drag.plugin-BGLbi1zS.js → column.drag.plugin-ByDJ7Rk3.js} +35 -6
  3. package/dist/cjs/{column.service-C1Qvcf5l.js → column.service-BNWNiJW3.js} +62 -23
  4. package/dist/cjs/{filter.button-w6LWnyhi.js → filter.button-C4xpvyyE.js} +14 -4
  5. package/dist/cjs/{header-cell-renderer-vVr4IWNV.js → header-cell-renderer-DyjOxArm.js} +1 -1
  6. package/dist/cjs/index.cjs.js +8 -5
  7. package/dist/cjs/loader.cjs.js +1 -1
  8. package/dist/cjs/revo-grid.cjs.entry.js +6 -6
  9. package/dist/cjs/revo-grid.cjs.js +1 -1
  10. package/dist/cjs/revogr-attribution_7.cjs.entry.js +40 -4
  11. package/dist/cjs/revogr-clipboard_3.cjs.entry.js +1 -1
  12. package/dist/cjs/revogr-data_4.cjs.entry.js +14 -6
  13. package/dist/cjs/revogr-filter-panel.cjs.entry.js +177 -48
  14. package/dist/collection/components/clipboard/revogr-clipboard.js +1 -1
  15. package/dist/collection/components/data/column.service.js +62 -23
  16. package/dist/collection/components/data/row-renderer.js +15 -2
  17. package/dist/collection/components/overlay/clipboard.utils.js +26 -0
  18. package/dist/collection/components/overlay/revogr-overlay-selection.js +27 -7
  19. package/dist/collection/components/revoGrid/revo-grid.js +14 -7
  20. package/dist/collection/components/scroll/revogr-viewport-scroll.js +10 -2
  21. package/dist/collection/plugins/filter/filter.button.js +12 -4
  22. package/dist/collection/plugins/filter/filter.panel.js +138 -48
  23. package/dist/collection/plugins/filter/filter.plugin.js +1 -1
  24. package/dist/collection/plugins/filter/filter.reorder.js +44 -0
  25. package/dist/collection/plugins/filter/filter.style.css +96 -6
  26. package/dist/collection/plugins/groupingRow/grouping.row.renderer.js +7 -2
  27. package/dist/collection/plugins/moveColumn/column.drag.plugin.js +30 -2
  28. package/dist/collection/serve/controller.js +1 -0
  29. package/dist/esm/{cell-renderer-BtN-NGCk.js → cell-renderer-CLTRlCa5.js} +23 -5
  30. package/dist/esm/{column.drag.plugin-4Ixr4ijU.js → column.drag.plugin-BZacA8n_.js} +35 -7
  31. package/dist/esm/{column.service-CC_SD8W3.js → column.service-C6hByxPy.js} +62 -23
  32. package/dist/esm/filter.button-B-RBiF67.js +38 -0
  33. package/dist/esm/{header-cell-renderer-B-LX2sgu.js → header-cell-renderer-BMmXRsd_.js} +1 -1
  34. package/dist/esm/index.js +6 -6
  35. package/dist/esm/loader.js +1 -1
  36. package/dist/esm/revo-grid.entry.js +6 -6
  37. package/dist/esm/revo-grid.js +1 -1
  38. package/dist/esm/revogr-attribution_7.entry.js +40 -4
  39. package/dist/esm/revogr-clipboard_3.entry.js +1 -1
  40. package/dist/esm/revogr-data_4.entry.js +14 -6
  41. package/dist/esm/revogr-filter-panel.entry.js +177 -48
  42. package/dist/revo-grid/{cell-renderer-BtN-NGCk.js → cell-renderer-CLTRlCa5.js} +23 -5
  43. package/dist/revo-grid/{column.drag.plugin-4Ixr4ijU.js → column.drag.plugin-BZacA8n_.js} +35 -7
  44. package/dist/revo-grid/{column.service-CC_SD8W3.js → column.service-C6hByxPy.js} +62 -23
  45. package/dist/revo-grid/filter.button-B-RBiF67.js +38 -0
  46. package/dist/revo-grid/{header-cell-renderer-B-LX2sgu.js → header-cell-renderer-BMmXRsd_.js} +1 -1
  47. package/dist/revo-grid/index.esm.js +6 -6
  48. package/dist/revo-grid/revo-grid.entry.js +6 -6
  49. package/dist/revo-grid/revo-grid.esm.js +1 -1
  50. package/dist/revo-grid/revogr-attribution_7.entry.js +40 -4
  51. package/dist/revo-grid/revogr-clipboard_3.entry.js +1 -1
  52. package/dist/revo-grid/revogr-data_4.entry.js +14 -6
  53. package/dist/revo-grid/revogr-filter-panel.entry.js +177 -48
  54. package/dist/types/components/data/column.service.d.ts +10 -1
  55. package/dist/types/components/data/row-renderer.d.ts +1 -1
  56. package/dist/types/components/overlay/clipboard.utils.d.ts +3 -0
  57. package/dist/types/components/overlay/revogr-overlay-selection.d.ts +4 -3
  58. package/dist/types/components/revoGrid/revo-grid.d.ts +4 -4
  59. package/dist/types/components.d.ts +14 -14
  60. package/dist/types/plugins/filter/filter.button.d.ts +23 -2
  61. package/dist/types/plugins/filter/filter.panel.d.ts +8 -1
  62. package/dist/types/plugins/filter/filter.plugin.d.ts +1 -0
  63. package/dist/types/plugins/filter/filter.reorder.d.ts +4 -0
  64. package/dist/types/plugins/filter/filter.types.d.ts +8 -0
  65. package/dist/types/plugins/moveColumn/column.drag.plugin.d.ts +4 -0
  66. package/dist/types/types/interfaces.d.ts +8 -0
  67. package/hydrate/index.js +358 -90
  68. package/hydrate/index.mjs +358 -90
  69. package/package.json +1 -1
  70. package/readme.md +20 -1
  71. package/standalone/column.service.js +1 -1
  72. package/standalone/filter.button.js +1 -1
  73. package/standalone/index.js +1 -1
  74. package/standalone/revo-grid.js +1 -1
  75. package/standalone/revogr-clipboard2.js +1 -1
  76. package/standalone/revogr-data2.js +1 -1
  77. package/standalone/revogr-filter-panel.js +1 -1
  78. package/standalone/revogr-overlay-selection2.js +1 -1
  79. package/standalone/revogr-viewport-scroll2.js +1 -1
  80. package/dist/esm/filter.button-C8XTWPU2.js +0 -30
  81. package/dist/revo-grid/filter.button-C8XTWPU2.js +0 -30
@@ -4,7 +4,7 @@
4
4
  import { r as registerInstance, h, e as Host, d as createEvent, g as getElement } from './index-Chp_81rd.js';
5
5
  import { k as getItemByIndex, b as getSourceItem, j as getItemByPosition, F as FOCUS_CLASS, I as codesLetter, R as RESIZE_INTERVAL, y as MOBILE_CLASS, z as CELL_HANDLER_CLASS, S as SELECTION_BORDER_CLASS, D as DataStore, q as ROW_HEADER_TYPE, T as TMP_SELECTION_BG_CLASS } from './dimension.helpers-CGKwSvw6.js';
6
6
  import { g as getPropertyFromEvent, v as verifyTouchTarget } from './events-BvSmBueA.js';
7
- import { g as getRange, M as ColumnService, z as getCellData, N as getCellEditor, b as isRangeSingleCell } from './column.service-CC_SD8W3.js';
7
+ import { g as getRange, M as ColumnService, z as getCellData, N as getCellEditor, b as isRangeSingleCell } from './column.service-C6hByxPy.js';
8
8
  import { l as isShortcutModifier, m as isEditInput, c as isClear, d as isTab, f as isEnterKeyValue, h as isCopy, g as isCut, j as isPaste, k as isAll } from './edit.utils-Dnnbd0xG.js';
9
9
  import { t as timeout, g as getScrollbarSize } from './index-Db3qZoW5.js';
10
10
  import { d as debounce } from './debounce-PCRWZliA.js';
@@ -649,6 +649,30 @@ class AutoFillService {
649
649
  }
650
650
  }
651
651
 
652
+ function getRangeFillClipboardData(data, useClipboard) {
653
+ var _a;
654
+ if (!isClipboardRangeFillEnabled(useClipboard)) {
655
+ return null;
656
+ }
657
+ const normalized = trimTrailingEmptyClipboardRows(data);
658
+ return normalized.length === 1 && ((_a = normalized[0]) === null || _a === void 0 ? void 0 : _a.length) === 1
659
+ ? normalized
660
+ : null;
661
+ }
662
+ function isClipboardRangeFillEnabled(useClipboard) {
663
+ return (typeof useClipboard === 'object' && useClipboard.rangeFill === true);
664
+ }
665
+ function trimTrailingEmptyClipboardRows(data) {
666
+ const rows = [...data];
667
+ while (rows.length > 1 && isEmptyClipboardRow(rows[rows.length - 1])) {
668
+ rows.pop();
669
+ }
670
+ return rows;
671
+ }
672
+ function isEmptyClipboardRow(row) {
673
+ return !row || row.every(cell => cell === '');
674
+ }
675
+
652
676
  const revogrOverlayStyleCss = () => `revogr-overlay-selection{display:block;position:relative;width:100%}revogr-overlay-selection .autofill-handle{position:absolute;width:14px;height:14px;margin-left:-13px;margin-top:-13px;z-index:10;cursor:crosshair}revogr-overlay-selection .autofill-handle::before{content:"";position:absolute;right:0;bottom:0;width:10px;height:10px;background:#0d63e8;border:1px solid white;box-sizing:border-box}revogr-overlay-selection.mobile .autofill-handle{position:absolute;width:30px;height:30px;margin-left:-29px;margin-top:-29px;z-index:10;cursor:crosshair}revogr-overlay-selection.mobile .autofill-handle::before{content:"";position:absolute;right:0;bottom:0;width:12px;height:12px;background:#0d63e8;border:1px solid white;box-sizing:border-box}revogr-overlay-selection .selection-border-range{position:absolute;pointer-events:none;z-index:9;box-shadow:-1px 0 0 #0d63e8 inset, 1px 0 0 #0d63e8 inset, 0 -1px 0 #0d63e8 inset, 0 1px 0 #0d63e8 inset}revogr-overlay-selection .selection-border-range .range-handlers{height:100%;background-color:transparent;width:75%;max-width:50px;min-width:20px;left:50%;transform:translateX(-50%);position:absolute}revogr-overlay-selection .selection-border-range .range-handlers>span{pointer-events:auto;height:20px;width:20px;position:absolute;left:50%;transform:translateX(-50%)}revogr-overlay-selection .selection-border-range .range-handlers>span:before,revogr-overlay-selection .selection-border-range .range-handlers>span:after{position:absolute;border-radius:5px;width:15px;height:5px;left:50%;transform:translateX(-50%);background-color:rgba(0, 0, 0, 0.2)}revogr-overlay-selection .selection-border-range .range-handlers>span:first-child{top:-7px}revogr-overlay-selection .selection-border-range .range-handlers>span:first-child:before{content:"";top:0}revogr-overlay-selection .selection-border-range .range-handlers>span:last-child{bottom:-7px}revogr-overlay-selection .selection-border-range .range-handlers>span:last-child:after{content:"";bottom:0}revogr-overlay-selection revogr-edit{z-index:10}`;
653
677
 
654
678
  const OverlaySelection = class {
@@ -896,9 +920,9 @@ const OverlaySelection = class {
896
920
  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) }));
897
921
  }
898
922
  }
899
- 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),
923
+ return (h(Host, { key: 'ff303c39d59e4ef217421fa11b9a80de07311b07', 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),
900
924
  // it's done to be able to throw events from different levels, not just from editor
901
- onCelledit: (e) => this.onEditCell(e) }, nodes, h("slot", { key: 'cd3525d404aa44fd8d06e7fc459777acb8a9d585', name: "data" })));
925
+ onCelledit: (e) => this.onEditCell(e) }, nodes, h("slot", { key: '3cbe4c3ad7d447f779e9e20f73eec2e3107275e0', name: "data" })));
902
926
  }
903
927
  /**
904
928
  * Executes the focus operation on the specified range of cells.
@@ -1063,13 +1087,25 @@ const OverlaySelection = class {
1063
1087
  if (!focus || isEditing) {
1064
1088
  return;
1065
1089
  }
1066
- let { changed, range } = this.columnService.getTransformedDataToApply(focus, data);
1090
+ const rangeFillData = getRangeFillClipboardData(data, this.useClipboard);
1091
+ const targetRange = rangeFillData
1092
+ ? this.getClipboardPasteTargetRange()
1093
+ : null;
1094
+ let { changed, range } = this.columnService.getTransformedDataToApply({
1095
+ start: focus,
1096
+ data: rangeFillData || data,
1097
+ targetRange,
1098
+ });
1067
1099
  const { defaultPrevented: canPaste } = this.rangeClipboardPaste.emit(Object.assign({ data: changed, models: collectModelsOfRange(changed, this.dataStore), range }, this.types));
1068
1100
  if (canPaste) {
1069
1101
  return;
1070
1102
  }
1071
1103
  (_a = this.autoFillService) === null || _a === void 0 ? void 0 : _a.onRangeApply(changed, range, range);
1072
1104
  }
1105
+ getClipboardPasteTargetRange() {
1106
+ const range = this.selectionStore.get('range');
1107
+ return range && !isRangeSingleCell(range) ? range : null;
1108
+ }
1073
1109
  async focusNext() {
1074
1110
  var _a;
1075
1111
  const canFocus = await ((_a = this.keyboardService) === null || _a === void 0 ? void 0 : _a.keyChangeSelection(new KeyboardEvent('keydown', {
@@ -143,7 +143,7 @@ const Clipboard = class {
143
143
  }
144
144
  getData(e) {
145
145
  return (e.clipboardData ||
146
- (window === null || window === void 0 ? void 0 : window.clipboardData));
146
+ (globalThis === null || globalThis === void 0 ? void 0 : globalThis.clipboardData));
147
147
  }
148
148
  };
149
149
 
@@ -2,11 +2,11 @@
2
2
  * Built by Revolist OU ❤️
3
3
  */
4
4
  import { r as registerInstance, d as createEvent, h, e as Host, g as getElement } from './index-Chp_81rd.js';
5
- import { M as ColumnService, u as isGrouping } from './column.service-CC_SD8W3.js';
5
+ import { M as ColumnService, u as isGrouping } from './column.service-C6hByxPy.js';
6
6
  import { B as ROW_FOCUSED_CLASS, b as getSourceItem, n as DATA_ROW, m as DATA_COL, M as MIN_COL_SIZE, r as HEADER_SORTABLE_CLASS, H as HEADER_CLASS, F as FOCUS_CLASS, k as getItemByIndex, u as HEADER_ROW_CLASS, v as HEADER_ACTUAL_ROW_CLASS } from './dimension.helpers-CGKwSvw6.js';
7
- import { G as GroupingRowRenderer, C as CellRenderer, R as RowRenderer, P as PADDING_DEPTH, S as SortingSign } from './cell-renderer-BtN-NGCk.js';
8
- import { c as FilterButton } from './filter.button-C8XTWPU2.js';
9
- import { H as HeaderCellRenderer } from './header-cell-renderer-B-LX2sgu.js';
7
+ import { G as GroupingRowRenderer, C as CellRenderer, R as RowRenderer, P as PADDING_DEPTH, S as SortingSign } from './cell-renderer-CLTRlCa5.js';
8
+ import { c as FilterButton } from './filter.button-B-RBiF67.js';
9
+ import { H as HeaderCellRenderer } from './header-cell-renderer-BMmXRsd_.js';
10
10
  import { t as throttle, L as LocalScrollTimer, a as LocalScrollService, g as getContentSize } from './throttle-CaUDyxyU.js';
11
11
  import { H as HEADER_SLOT, C as CONTENT_SLOT, F as FOOTER_SLOT } from './viewport.helpers-CoCAvmZs.js';
12
12
  import './debounce-PCRWZliA.js';
@@ -828,9 +828,17 @@ const RevogrViewportScroll = class {
828
828
  }
829
829
  render() {
830
830
  var _a, _b;
831
- const physicalContentHeight = getContentSize(this.contentHeight, (_b = (_a = this.verticalScroll) === null || _a === void 0 ? void 0 : _a.clientHeight) !== null && _b !== void 0 ? _b : 0);
831
+ const clientHeight = (_b = (_a = this.verticalScroll) === null || _a === void 0 ? void 0 : _a.clientHeight) !== null && _b !== void 0 ? _b : 0;
832
+ // When content fits in the viewport (no scroll needed), don't inflate content-wrapper
833
+ // to clientHeight — that would prevent inner-content-table from shrinking and push
834
+ // rowPinEnd (footer) to the bottom instead of letting it follow the data rows.
835
+ // For large/compressed grids (content > clientHeight), physicalContentHeight handles
836
+ // the browser scroll-size compression correctly.
837
+ const physicalContentHeight = this.contentHeight < clientHeight
838
+ ? Math.max(this.contentHeight, 0)
839
+ : getContentSize(this.contentHeight, clientHeight);
832
840
  const physicalContentWidth = getContentSize(this.contentWidth, 0);
833
- 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 })))));
841
+ return (h(Host, { key: '3dd9d29cf26743d7aa4995f51180d56008526e54', onWheel: this.horizontalMouseWheel, onScroll: (e) => this.applyScroll('rgCol', e) }, h("div", { key: 'af75428e845044c33eba2fecd1ec04a9177b9b5c', class: "inner-content-table", style: { width: `${physicalContentWidth}px` } }, h("div", { key: 'a0149f597588371e1fafe69efc3bd4411379a017', class: "header-wrapper", ref: e => (this.header = e) }, h("slot", { key: 'e5d2570bf93897cd97ef702141c83bb8c0e13ee2', name: HEADER_SLOT })), h("div", { key: 'd1388ff0d721dd8ce925b934bb2128fddc1ac17b', class: "vertical-inner", ref: el => (this.verticalScroll = el), onWheel: this.verticalMouseWheel, onScroll: (e) => this.applyScroll('rgRow', e) }, h("div", { key: 'a306ff56f62279402e2a881a081e3224341d5bdf', class: "content-wrapper", style: { height: `${physicalContentHeight}px` } }, h("slot", { key: '898bda8e9429da06c9ff2bd41626ac27f3cde3cc', name: CONTENT_SLOT }))), h("div", { key: '5e9eba1edd5fca07a964971054a7900e4dd84099', class: "footer-wrapper", ref: e => (this.footer = e) }, h("slot", { key: 'f233ad1c23b3f692c45e1db235cfef4704a80726', name: FOOTER_SLOT })))));
834
842
  }
835
843
  /**
836
844
  * Extra layer for scroll event monitoring, where MouseWheel event is not passing
@@ -3,7 +3,7 @@
3
3
  */
4
4
  import { r as registerInstance, d as createEvent, h, e as Host, g as getElement } from './index-Chp_81rd.js';
5
5
  import { d as debounce } from './debounce-PCRWZliA.js';
6
- import { i as isFilterBtn, e as AndOrButton, d as TrashButton } from './filter.button-C8XTWPU2.js';
6
+ import { i as isFilterBtn, e as AndOrButton, f as ReorderButton, d as TrashButton } from './filter.button-B-RBiF67.js';
7
7
 
8
8
  (function closest() {
9
9
  if (!Element.prototype.matches) {
@@ -24,12 +24,55 @@ import { i as isFilterBtn, e as AndOrButton, d as TrashButton } from './filter.b
24
24
  }
25
25
  })();
26
26
 
27
- 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}`;
27
+ const FILTER_REORDER_MIME = 'text/revogrid-filter-id';
28
+ function setFilterReorderData(dataTransfer, id) {
29
+ if (!dataTransfer) {
30
+ return;
31
+ }
32
+ dataTransfer.effectAllowed = 'move';
33
+ dataTransfer.setData(FILTER_REORDER_MIME, String(id));
34
+ dataTransfer.setData('text/plain', String(id));
35
+ }
36
+ function getFilterReorderId(dataTransfer) {
37
+ if (!dataTransfer) {
38
+ return;
39
+ }
40
+ const rawId = dataTransfer.getData(FILTER_REORDER_MIME) || dataTransfer.getData('text/plain');
41
+ const normalizedId = rawId.trim();
42
+ if (!normalizedId) {
43
+ return;
44
+ }
45
+ const id = Number(normalizedId);
46
+ return Number.isFinite(id) ? id : undefined;
47
+ }
48
+ function moveFilterItem(items, sourceId, targetId) {
49
+ if (sourceId === targetId) {
50
+ return false;
51
+ }
52
+ const sourceIndex = items.findIndex(item => item.id === sourceId);
53
+ const targetIndex = items.findIndex(item => item.id === targetId);
54
+ if (sourceIndex === -1 || targetIndex === -1 || sourceIndex === targetIndex) {
55
+ return false;
56
+ }
57
+ const relationsByPosition = items.map(item => { var _a; return (_a = item.relation) !== null && _a !== void 0 ? _a : 'and'; });
58
+ const [movedItem] = items.splice(sourceIndex, 1);
59
+ items.splice(targetIndex, 0, movedItem);
60
+ items.forEach((item, index) => {
61
+ var _a;
62
+ item.relation = index === items.length - 1
63
+ ? 'and'
64
+ : (_a = relationsByPosition[index]) !== null && _a !== void 0 ? _a : 'and';
65
+ });
66
+ return true;
67
+ }
68
+
69
+ 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));box-sizing:border-box;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 .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{position:sticky;right:0;bottom:-10px;left:0;z-index:1;text-align:right;margin:10px -10px -10px;padding:0 5px 10px 10px;background:var(--revo-grid-filter-panel-bg, #fff);border-top:1px solid var(--revo-grid-filter-panel-divider, #d9d9d9)}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-row{display:flex;align-items:center;gap:6px;position:relative}.multi-filter-list .multi-filter-list-row.filter-row-dragging{opacity:0.65}.multi-filter-list .multi-filter-list-row.filter-row-drag-over::before{content:"";position:absolute;top:-4px;right:0;left:0;z-index:2;height:2px;background:var(--revo-grid-filter-panel-reorder-accent, #007cb2);border-radius:999px;box-shadow:0 0 0 2px var(--revo-grid-filter-panel-bg, #fff)}.multi-filter-list .multi-filter-list-row.filter-row-drop-active .filter-row-drop-target{pointer-events:auto}.multi-filter-list .filter-row-drop-target{position:absolute;inset:0;z-index:1;padding:0;pointer-events:none;background:transparent;border:0}.multi-filter-list .multi-filter-list-action{display:flex;align-self:stretch;flex:0 0 auto;justify-content:flex-end;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;padding:0;border:0;background:transparent;color:inherit;cursor:pointer;width:22px;height:100%;font-size:16px}.multi-filter-list .trash-button .trash-img{width:1em}.multi-filter-list .reorder-button{border:0;background:transparent;color:var(--revo-grid-filter-panel-reorder-color, #6b7280);cursor:grab;font-family:monospace;font-size:12px;letter-spacing:0;line-height:1;padding:6px 2px;transform:scaleX(0.8);width:16px}.multi-filter-list .reorder-button.filter-row-drag-over{color:var(--revo-grid-filter-panel-reorder-accent, #007cb2)}.multi-filter-list .reorder-button:active{cursor:grabbing}.multi-filter-list-container{padding:0;margin:0;list-style:none}.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;align-items:center;flex:1 1 auto;gap:6px;min-width:0}.select-input .select-filter,.select-input .filter-extra{flex:1 1 0;min-width:0}.select-input .select-filter{width:auto}.select-input .filter-extra{display:flex}.select-input .filter-extra>*{width:100%}.select-input input[type=text],.select-input input[type=date]{margin:0}`;
28
70
 
29
71
  const defaultType = 'none';
30
72
  const FILTER_LIST_CLASS = 'multi-filter-list';
31
73
  const FILTER_LIST_CLASS_ACTION = 'multi-filter-list-action';
32
74
  const FILTER_ID = 'add-filter';
75
+ const VIEWPORT_PADDING = 8;
33
76
  const FilterPanel = class {
34
77
  constructor(hostRef) {
35
78
  registerInstance(this, hostRef);
@@ -46,6 +89,9 @@ const FilterPanel = class {
46
89
  placeholder: 'Enter value...',
47
90
  and: 'and',
48
91
  or: 'or',
92
+ filterCondition: 'Filter condition',
93
+ removeFilter: 'Remove filter',
94
+ reorderFilter: 'Reorder filter',
49
95
  };
50
96
  this.isFilterIdSet = false;
51
97
  this.filterId = 0;
@@ -119,18 +165,28 @@ const FilterPanel = class {
119
165
  if (typeof prop === 'undefined')
120
166
  return '';
121
167
  const propFilters = (_b = this.filterItems[prop]) !== null && _b !== void 0 ? _b : [];
122
- const capts = Object.assign(this.filterCaptionsInternal, this.filterCaptions);
123
- return (h("div", { key: this.filterId }, propFilters.map((filter, index) => {
168
+ const visibleFilterCount = propFilters.filter(filter => !filter.hidden).length;
169
+ const capts = Object.assign(Object.assign({}, this.filterCaptionsInternal), this.filterCaptions);
170
+ return (h("div", { key: this.filterId }, h("ul", { class: "multi-filter-list-container" }, propFilters.map((filter, index) => {
124
171
  let andOrButton;
125
172
  if (filter.hidden) {
126
173
  return;
127
174
  }
128
175
  // hide toggle button if there is only one filter and the last one
129
176
  if (index !== this.filterItems[prop].length - 1) {
130
- andOrButton = (h("div", { onClick: () => this.toggleFilterAndOr(filter.id) }, h(AndOrButton, { text: filter.relation === 'and' ? capts.and : capts.or })));
177
+ andOrButton = (h(AndOrButton, { text: filter.relation === 'and' ? capts.and : capts.or, onClick: () => this.toggleFilterAndOr(filter.id) }));
131
178
  }
132
- 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))));
133
- }), propFilters.filter(f => !f.hidden).length > 0 ? h("div", { class: "add-filter-divider" }) : ''));
179
+ const extra = this.renderExtra(prop, index);
180
+ const isDragging = this.draggedFilterId === filter.id;
181
+ const isDragOver = this.dragOverFilterId === filter.id && !isDragging;
182
+ const canReorder = visibleFilterCount > 1;
183
+ return (h("li", { key: filter.id, class: FILTER_LIST_CLASS, "aria-label": `${capts.filterCondition} ${index + 1}` }, h("div", { class: {
184
+ 'multi-filter-list-row': true,
185
+ 'filter-row-drop-active': this.draggedFilterId !== undefined && !isDragging,
186
+ 'filter-row-dragging': isDragging,
187
+ 'filter-row-drag-over': isDragOver,
188
+ } }, 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) })))));
189
+ })), propFilters.filter(f => !f.hidden).length > 0 ? h("div", { class: "add-filter-divider" }) : ''));
134
190
  }
135
191
  componentDidRender() {
136
192
  this.syncDialog();
@@ -149,37 +205,35 @@ const FilterPanel = class {
149
205
  this.dialog.show();
150
206
  }
151
207
  if (this.changes.autoCorrect !== false) {
208
+ this.autoCorrect(this.dialog);
152
209
  requestAnimationFrame(() => this.autoCorrect(this.dialog));
153
210
  }
154
211
  }
155
212
  autoCorrect(el) {
156
- if (!el) {
213
+ var _a;
214
+ if (!el || !this.changes) {
157
215
  return;
158
216
  }
217
+ el.style.maxHeight = '';
218
+ el.style.left = `${this.changes.x}px`;
219
+ el.style.top = `${this.changes.y}px`;
159
220
  const pos = el.getBoundingClientRect();
160
- const maxLeft = Math.max(0, window.innerWidth - pos.width);
161
- const maxTop = Math.max(0, window.innerHeight - pos.height);
162
- if (pos.left > maxLeft) {
163
- el.style.left = `${maxLeft}px`;
164
- }
165
- if (pos.top > maxTop) {
166
- el.style.top = `${maxTop}px`;
167
- }
168
- }
169
- onDialogMouseDown(e) {
170
- if (!this.closeOnOutsideClick ||
171
- e.target !== this.dialog ||
172
- !this.dialog) {
173
- return;
174
- }
175
- const rect = this.dialog.getBoundingClientRect();
176
- const isInside = e.clientX >= rect.left &&
177
- e.clientX <= rect.right &&
178
- e.clientY >= rect.top &&
179
- e.clientY <= rect.bottom;
180
- if (!isInside) {
181
- this.onCancel();
182
- }
221
+ const anchorTop = (_a = this.changes.anchorY) !== null && _a !== void 0 ? _a : this.changes.y;
222
+ const anchorBottom = this.changes.y;
223
+ const spaceAbove = Math.max(0, anchorTop - VIEWPORT_PADDING);
224
+ const spaceBelow = Math.max(0, window.innerHeight - anchorBottom - VIEWPORT_PADDING);
225
+ const openAbove = pos.height > spaceBelow && spaceAbove > spaceBelow;
226
+ const availableHeight = Math.max(VIEWPORT_PADDING, openAbove ? spaceAbove : spaceBelow);
227
+ el.style.maxHeight = `${availableHeight}px`;
228
+ const adjustedPos = el.getBoundingClientRect();
229
+ const maxLeft = Math.max(VIEWPORT_PADDING, window.innerWidth - adjustedPos.width - VIEWPORT_PADDING);
230
+ const maxTop = Math.max(VIEWPORT_PADDING, window.innerHeight - adjustedPos.height - VIEWPORT_PADDING);
231
+ const left = Math.min(Math.max(VIEWPORT_PADDING, this.changes.x), maxLeft);
232
+ const top = openAbove
233
+ ? Math.min(Math.max(VIEWPORT_PADDING, anchorTop - adjustedPos.height), maxTop)
234
+ : Math.min(Math.max(VIEWPORT_PADDING, anchorBottom), maxTop);
235
+ el.style.left = `${left}px`;
236
+ el.style.top = `${top}px`;
183
237
  }
184
238
  onFilterTypeChange(e, prop, index) {
185
239
  if (!(e.target instanceof HTMLSelectElement)) {
@@ -271,6 +325,80 @@ const FilterPanel = class {
271
325
  this.debouncedApplyFilter();
272
326
  }
273
327
  }
328
+ onFilterDragStart(e, id) {
329
+ this.draggedFilterId = id;
330
+ setFilterReorderData(e.dataTransfer, id);
331
+ }
332
+ onFilterDragOver(e, id) {
333
+ if (this.draggedFilterId === undefined || this.draggedFilterId === id) {
334
+ return;
335
+ }
336
+ e.preventDefault();
337
+ if (e.dataTransfer) {
338
+ e.dataTransfer.dropEffect = 'move';
339
+ }
340
+ this.dragOverFilterId = id;
341
+ }
342
+ onFilterDragLeave(id) {
343
+ if (this.dragOverFilterId === id) {
344
+ this.dragOverFilterId = undefined;
345
+ }
346
+ }
347
+ onFilterDrop(e, prop, targetId) {
348
+ var _a;
349
+ e.preventDefault();
350
+ const sourceId = (_a = this.draggedFilterId) !== null && _a !== void 0 ? _a : getFilterReorderId(e.dataTransfer);
351
+ this.onFilterDragEnd();
352
+ if (sourceId === undefined) {
353
+ return;
354
+ }
355
+ const items = this.filterItems[prop];
356
+ if (!items) {
357
+ return;
358
+ }
359
+ if (!moveFilterItem(items, sourceId, targetId)) {
360
+ return;
361
+ }
362
+ this.filterId++;
363
+ if (!this.disableDynamicFiltering) {
364
+ this.debouncedApplyFilter();
365
+ }
366
+ }
367
+ onFilterDragEnd() {
368
+ this.draggedFilterId = undefined;
369
+ this.dragOverFilterId = undefined;
370
+ }
371
+ onFilterReorderKeyDown(e, prop, sourceId) {
372
+ let direction = 0;
373
+ if (e.key === 'ArrowUp') {
374
+ direction = -1;
375
+ }
376
+ else if (e.key === 'ArrowDown') {
377
+ direction = 1;
378
+ }
379
+ else {
380
+ return;
381
+ }
382
+ const items = this.filterItems[prop];
383
+ if (!items) {
384
+ return;
385
+ }
386
+ const visibleItems = items.filter(item => !item.hidden);
387
+ const sourceIndex = visibleItems.findIndex(item => item.id === sourceId);
388
+ if (sourceIndex === -1) {
389
+ return;
390
+ }
391
+ e.preventDefault();
392
+ e.stopPropagation();
393
+ const target = visibleItems[sourceIndex + direction];
394
+ if (!target || !moveFilterItem(items, sourceId, target.id)) {
395
+ return;
396
+ }
397
+ this.filterId++;
398
+ if (!this.disableDynamicFiltering) {
399
+ this.debouncedApplyFilter();
400
+ }
401
+ }
274
402
  toggleFilterAndOr(id) {
275
403
  var _a;
276
404
  this.assertChanges();
@@ -309,7 +437,7 @@ const FilterPanel = class {
309
437
  });
310
438
  });
311
439
  if (!isDefaultTypeRemoved) {
312
- const capts = Object.assign(this.filterCaptionsInternal, this.filterCaptions);
440
+ const capts = Object.assign(Object.assign({}, this.filterCaptionsInternal), this.filterCaptions);
313
441
  options.push(h("option", { selected: this.currentFilterType === defaultType, value: defaultType }, prop && this.filterItems[prop] && this.filterItems[prop].length > 0
314
442
  ? capts.add
315
443
  : this.filterNames[defaultType]));
@@ -342,7 +470,7 @@ const FilterPanel = class {
342
470
  select.focus();
343
471
  }
344
472
  };
345
- const capts = Object.assign(this.filterCaptionsInternal, this.filterCaptions);
473
+ const capts = Object.assign(Object.assign({}, this.filterCaptionsInternal), this.filterCaptions);
346
474
  const extra = this.filterEntities[currentFilter[index].type].extra;
347
475
  if (typeof extra === 'function') {
348
476
  return extra(h, {
@@ -379,32 +507,33 @@ const FilterPanel = class {
379
507
  } }));
380
508
  }
381
509
  render() {
382
- var _a, _b, _c, _d, _e, _f, _g;
510
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j;
383
511
  const style = {
384
512
  left: `${(_b = (_a = this.changes) === null || _a === void 0 ? void 0 : _a.x) !== null && _b !== void 0 ? _b : 0}px`,
385
513
  top: `${(_d = (_c = this.changes) === null || _c === void 0 ? void 0 : _c.y) !== null && _d !== void 0 ? _d : 0}px`,
386
514
  };
387
- const capts = Object.assign(this.filterCaptionsInternal, this.filterCaptions);
388
- return (h(Host, { key: '9fb424017d080876ff7796237917b4f41f617fe0' }, h("dialog", { key: '37b9f870b95f6fe1bd7be359dd7b77ef196e896e', class: "filter-panel-dialog", style: style, ref: el => (this.dialog = el), onCancel: e => {
515
+ const capts = Object.assign(Object.assign({}, this.filterCaptionsInternal), this.filterCaptions);
516
+ return (h(Host, { key: '4e969f8b7033363c885c94b1f7770917786669f2' }, h("dialog", { key: '79b2713724684fa99f56621fe43645a0b0ad54bf', class: "filter-panel-dialog", style: style, ref: el => (this.dialog = el), onCancel: e => {
389
517
  e.preventDefault();
390
518
  this.onCancel();
391
- }, onMouseDown: e => this.onDialogMouseDown(e) }, this.changes && [
392
- h("slot", { key: '76ec505a92d0a7c1ae0bbb5f4cac63555f3416be', slot: "header" }),
519
+ } }, this.changes && [
520
+ h("slot", { key: "header-slot", slot: "header" }),
393
521
  ((_f = (_e = this.changes).extraContent) === null || _f === void 0 ? void 0 : _f.call(_e, this.changes)) || '',
394
522
  ((_g = this.changes) === null || _g === void 0 ? void 0 : _g.hideDefaultFilters) !== true && [
395
- h("label", { key: 'c6fd82c95f6005f286c7bc90de34956128a83246' }, capts.title),
396
- h("div", { key: '5e7dac36ad79ba1b6072a0053b30aa384ade0dde', class: "filter-holder" }, this.getFilterItemsList()),
397
- 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))),
523
+ h("label", { key: "filter-title" }, capts.title),
524
+ h("div", { key: "filter-holder", class: "filter-holder" }, this.getFilterItemsList()),
525
+ h("div", { key: "add-filter", class: "add-filter" }, h("select", { key: 'fc894bdfae1ff35d5c49adc7646dd3182b7bd49e', id: FILTER_ID, class: "select-css", onChange: e => this.onAddNewFilter(e) }, this.renderSelectOptions(this.currentFilterType))),
398
526
  ],
399
- h("slot", { key: '1571dcbc5c57651deb42a4046272ff60fa74f5a7' }),
400
- h("div", { key: '4aa7dee532336b084542df0209291b4c60378b49', class: "filter-actions" }, this.disableDynamicFiltering && [
401
- h("button", { key: '4c1b3054cd1bb7f46877592f00f6634d0f7ecafa', id: "revo-button-save", "aria-label": "save", class: "revo-button green", onClick: () => this.onSave() }, capts.save),
402
- h("button", { key: 'f31a568c89be18b1a854cdd7d4726e01db24e338', id: "revo-button-ok", "aria-label": "ok", class: "revo-button green", onClick: () => this.onCancel() }, capts.cancel),
527
+ h("slot", { key: "default-slot" }),
528
+ ((_j = (_h = this.changes).extraBottomContent) === null || _j === void 0 ? void 0 : _j.call(_h, this.changes)) || '',
529
+ h("div", { key: "filter-actions", class: "filter-actions" }, this.disableDynamicFiltering && [
530
+ h("button", { key: "save", id: "revo-button-save", "aria-label": "save", class: "revo-button green", onClick: () => this.onSave() }, capts.save),
531
+ h("button", { key: "cancel", id: "revo-button-ok", "aria-label": "ok", class: "revo-button green", onClick: () => this.onCancel() }, capts.cancel),
403
532
  ], !this.disableDynamicFiltering && [
404
- h("button", { key: '5d40e8b1f13f94cff4f5a2e2aefeee8861104a9d', id: "revo-button-ok", "aria-label": "ok", class: "revo-button green", onClick: () => this.onCancel() }, capts.ok),
405
- h("button", { key: '67eac3abd16f6f6e2ed7089dcfb0d05524ddb7df', id: "revo-button-reset", "aria-label": "reset", class: "revo-button outline", onClick: () => this.onReset() }, capts.reset),
533
+ h("button", { key: "ok", id: "revo-button-ok", "aria-label": "ok", class: "revo-button green", onClick: () => this.onCancel() }, capts.ok),
534
+ h("button", { key: "reset", id: "revo-button-reset", "aria-label": "reset", class: "revo-button outline", onClick: () => this.onReset() }, capts.reset),
406
535
  ]),
407
- h("slot", { key: 'b27a9bb3ef814e1e09dca14eda3e332ff34c654c', slot: "footer" }),
536
+ h("slot", { key: "footer-slot", slot: "footer" }),
408
537
  ])));
409
538
  }
410
539
  get element() { return getElement(this); }
@@ -3,7 +3,7 @@
3
3
  */
4
4
  import { h, f as Build } from './index-Chp_81rd.js';
5
5
  import { n as DATA_ROW, w as DRAG_ICON_CLASS, x as DRAGGABLE_CLASS } from './dimension.helpers-CGKwSvw6.js';
6
- import { l as GROUP_EXPAND_BTN, m as GROUP_EXPAND_EVENT, G as GROUP_DEPTH, h as GROUP_EXPANDED, P as PSEUDO_GROUP_ITEM, O as isRowDragService, B as getCellDataParsed } from './column.service-CC_SD8W3.js';
6
+ import { l as GROUP_EXPAND_BTN, m as GROUP_EXPAND_EVENT, G as GROUP_DEPTH, h as GROUP_EXPANDED, P as PSEUDO_GROUP_ITEM, O as isRowDragService, B as getCellDataParsed } from './column.service-C6hByxPy.js';
7
7
 
8
8
  /**
9
9
  * Renders sorting direction and optional additive sorting rank.
@@ -16,9 +16,22 @@ const SortingSign = ({ column }) => {
16
16
  return (h("span", Object.assign({}, indicatorAttrs), h("i", Object.assign({}, iconAttrs)), (column === null || column === void 0 ? void 0 : column.sortIndex) ? (h("sup", Object.assign({}, orderIndexAttrs), column.sortIndex)) : null));
17
17
  };
18
18
 
19
+ var __rest = (undefined && undefined.__rest) || function (s, e) {
20
+ var t = {};
21
+ for (var p in s)
22
+ if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
23
+ t[p] = s[p];
24
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
25
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
26
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
27
+ t[p[i]] = s[p[i]];
28
+ }
29
+ return t;
30
+ };
19
31
  const PADDING_DEPTH = 10;
20
- const RowRenderer = ({ rowClass, index, size, start, depth, groupingLevel }, cells) => {
21
- const props = Object.assign({ [DATA_ROW]: index }, (typeof groupingLevel === 'number'
32
+ const RowRenderer = (_a, cells) => {
33
+ var { rowClass, index, size, start, depth, groupingLevel } = _a, attrs = __rest(_a, ["rowClass", "index", "size", "start", "depth", "groupingLevel"]);
34
+ const props = Object.assign(Object.assign(Object.assign({}, attrs), { [DATA_ROW]: index }), (typeof groupingLevel === 'number'
22
35
  ? { 'data-level': groupingLevel }
23
36
  : {}));
24
37
  return (h("div", Object.assign({}, props, { class: `rgRow ${rowClass || ''}`, style: {
@@ -45,12 +58,17 @@ const GroupingRowRenderer = (props) => {
45
58
  const name = model[PSEUDO_GROUP_ITEM];
46
59
  const expanded = model[GROUP_EXPANDED];
47
60
  const depth = parseInt(model[GROUP_DEPTH], 10) || 0;
61
+ const groupRowAttrs = {
62
+ rowClass: 'groupingRow',
63
+ depth,
64
+ expanded,
65
+ };
48
66
  if (groupingCustomRenderer) {
49
- return (h(RowRenderer, Object.assign({}, props, { rowClass: "groupingRow", depth: depth }), h("div", { onClick: e => expandEvent(e, model, itemIndex) }, groupingCustomRenderer(h, Object.assign(Object.assign({}, props), { colType: props.providers.colType, name,
67
+ return (h(RowRenderer, Object.assign({}, props, groupRowAttrs), h("div", { onClick: e => expandEvent(e, model, itemIndex) }, groupingCustomRenderer(h, Object.assign(Object.assign({}, props), { colType: props.providers.colType, name,
50
68
  expanded,
51
69
  depth })))));
52
70
  }
53
- return (h(RowRenderer, Object.assign({}, props, { rowClass: "groupingRow", depth: depth }), hasExpand && [
71
+ return (h(RowRenderer, Object.assign({}, props, groupRowAttrs), hasExpand && [
54
72
  h("button", { class: { [GROUP_EXPAND_BTN]: true }, onClick: e => expandEvent(e, model, itemIndex) }, expandSvgIconVNode(expanded)),
55
73
  name,
56
74
  ]));