@toolbox-web/grid 1.15.0 → 1.16.1

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 (56) hide show
  1. package/all.js +45 -23
  2. package/all.js.map +1 -1
  3. package/index.js +883 -865
  4. package/index.js.map +1 -1
  5. package/lib/core/internal/columns.d.ts +0 -5
  6. package/lib/core/internal/columns.d.ts.map +1 -1
  7. package/lib/core/internal/event-delegation.d.ts.map +1 -1
  8. package/lib/core/internal/rows.d.ts.map +1 -1
  9. package/lib/core/types.d.ts +12 -0
  10. package/lib/core/types.d.ts.map +1 -1
  11. package/lib/plugins/clipboard/ClipboardPlugin.d.ts.map +1 -1
  12. package/lib/plugins/clipboard/copy.d.ts.map +1 -1
  13. package/lib/plugins/clipboard/index.js +55 -55
  14. package/lib/plugins/clipboard/index.js.map +1 -1
  15. package/lib/plugins/column-virtualization/index.js.map +1 -1
  16. package/lib/plugins/context-menu/index.js +59 -49
  17. package/lib/plugins/context-menu/index.js.map +1 -1
  18. package/lib/plugins/context-menu/menu.d.ts.map +1 -1
  19. package/lib/plugins/context-menu/types.d.ts +4 -4
  20. package/lib/plugins/context-menu/types.d.ts.map +1 -1
  21. package/lib/plugins/editing/EditingPlugin.d.ts.map +1 -1
  22. package/lib/plugins/editing/index.js +228 -216
  23. package/lib/plugins/editing/index.js.map +1 -1
  24. package/lib/plugins/export/index.js.map +1 -1
  25. package/lib/plugins/filtering/filter-model.d.ts.map +1 -1
  26. package/lib/plugins/filtering/index.js +4 -5
  27. package/lib/plugins/filtering/index.js.map +1 -1
  28. package/lib/plugins/grouping-columns/index.js.map +1 -1
  29. package/lib/plugins/grouping-rows/index.js.map +1 -1
  30. package/lib/plugins/master-detail/index.js.map +1 -1
  31. package/lib/plugins/multi-sort/index.js.map +1 -1
  32. package/lib/plugins/pinned-columns/index.js.map +1 -1
  33. package/lib/plugins/pinned-rows/index.js.map +1 -1
  34. package/lib/plugins/pivot/index.js.map +1 -1
  35. package/lib/plugins/print/index.js.map +1 -1
  36. package/lib/plugins/reorder/index.js.map +1 -1
  37. package/lib/plugins/responsive/index.js.map +1 -1
  38. package/lib/plugins/row-reorder/index.js.map +1 -1
  39. package/lib/plugins/selection/index.js.map +1 -1
  40. package/lib/plugins/server-side/index.js.map +1 -1
  41. package/lib/plugins/tree/index.js.map +1 -1
  42. package/lib/plugins/undo-redo/index.js.map +1 -1
  43. package/lib/plugins/visibility/index.js.map +1 -1
  44. package/package.json +1 -1
  45. package/umd/grid.all.umd.js +26 -26
  46. package/umd/grid.all.umd.js.map +1 -1
  47. package/umd/grid.umd.js +21 -21
  48. package/umd/grid.umd.js.map +1 -1
  49. package/umd/plugins/clipboard.umd.js +4 -4
  50. package/umd/plugins/clipboard.umd.js.map +1 -1
  51. package/umd/plugins/context-menu.umd.js +1 -1
  52. package/umd/plugins/context-menu.umd.js.map +1 -1
  53. package/umd/plugins/editing.umd.js +1 -1
  54. package/umd/plugins/editing.umd.js.map +1 -1
  55. package/umd/plugins/filtering.umd.js +1 -1
  56. package/umd/plugins/filtering.umd.js.map +1 -1
@@ -1,27 +1,27 @@
1
- function P(o) {
1
+ function M(o) {
2
2
  o && o.querySelectorAll(".cell-focus").forEach((e) => e.classList.remove("cell-focus"));
3
3
  }
4
- const w = 'input,select,textarea,[contenteditable="true"],[contenteditable=""],[tabindex]:not([tabindex="-1"])', M = document.createElement("template");
5
- M.innerHTML = '<div class="cell" role="gridcell" part="cell"></div>';
6
- const H = document.createElement("template");
7
- H.innerHTML = '<div class="data-grid-row" role="row" part="row"></div>';
4
+ const v = 'input,select,textarea,[contenteditable="true"],[contenteditable=""],[tabindex]:not([tabindex="-1"])', P = document.createElement("template");
5
+ P.innerHTML = '<div class="cell" role="gridcell" part="cell"></div>';
6
+ const D = document.createElement("template");
7
+ D.innerHTML = '<div class="data-grid-row" role="row" part="row"></div>';
8
8
  function L(o, e) {
9
9
  if (o._virtualization?.enabled) {
10
- const { rowHeight: r, container: l, viewportEl: c } = o._virtualization, a = l, d = c?.clientHeight ?? a?.clientHeight ?? 0;
10
+ const { rowHeight: n, container: l, viewportEl: c } = o._virtualization, a = l, d = c?.clientHeight ?? a?.clientHeight ?? 0;
11
11
  if (a && d > 0) {
12
- const g = o._focusRow * r;
13
- g < a.scrollTop ? a.scrollTop = g : g + r > a.scrollTop + d && (a.scrollTop = g - d + r);
12
+ const g = o._focusRow * n;
13
+ g < a.scrollTop ? a.scrollTop = g : g + n > a.scrollTop + d && (a.scrollTop = g - d + n);
14
14
  }
15
15
  }
16
16
  const t = o._activeEditRows !== void 0 && o._activeEditRows !== -1;
17
- t || o.refreshVirtualWindow(!1), P(o._bodyEl), Array.from(o._bodyEl.querySelectorAll('[aria-selected="true"]')).forEach((r) => {
18
- r.setAttribute("aria-selected", "false");
17
+ t || o.refreshVirtualWindow(!1), M(o._bodyEl), Array.from(o._bodyEl.querySelectorAll('[aria-selected="true"]')).forEach((n) => {
18
+ n.setAttribute("aria-selected", "false");
19
19
  });
20
- const i = o._focusRow, n = o._virtualization.start ?? 0, s = o._virtualization.end ?? o._rows.length;
21
- if (i >= n && i < s) {
22
- const r = o._bodyEl.querySelectorAll(".data-grid-row")[i - n];
23
- let l = r?.children[o._focusCol];
24
- if ((!l || !l.classList?.contains("cell")) && (l = r?.querySelector(`.cell[data-col="${o._focusCol}"]`) ?? r?.querySelector(".cell[data-col]")), l) {
20
+ const i = o._focusRow, r = o._virtualization.start ?? 0, s = o._virtualization.end ?? o._rows.length;
21
+ if (i >= r && i < s) {
22
+ const n = o._bodyEl.querySelectorAll(".data-grid-row")[i - r];
23
+ let l = n?.children[o._focusCol];
24
+ if ((!l || !l.classList?.contains("cell")) && (l = n?.querySelector(`.cell[data-col="${o._focusCol}"]`) ?? n?.querySelector(".cell[data-col]")), l) {
25
25
  l.classList.add("cell-focus"), l.setAttribute("aria-selected", "true");
26
26
  const c = o.querySelector(".tbw-scroll-area");
27
27
  if (c && l && (!t || e?.forceHorizontalScroll))
@@ -30,14 +30,14 @@ function L(o, e) {
30
30
  else if (e?.forceScrollRight)
31
31
  c.scrollLeft = c.scrollWidth - c.clientWidth;
32
32
  else {
33
- const a = o._getHorizontalScrollOffsets?.(r ?? void 0, l) ?? { left: 0, right: 0 };
33
+ const a = o._getHorizontalScrollOffsets?.(n ?? void 0, l) ?? { left: 0, right: 0 };
34
34
  if (!a.skipScroll) {
35
35
  const d = l.getBoundingClientRect(), g = c.getBoundingClientRect(), f = d.left - g.left + c.scrollLeft, E = f + d.width, p = c.scrollLeft + a.left, m = c.scrollLeft + c.clientWidth - a.right;
36
36
  f < p ? c.scrollLeft = f - a.left : E > m && (c.scrollLeft = E - c.clientWidth + a.right);
37
37
  }
38
38
  }
39
39
  if (o._activeEditRows !== void 0 && o._activeEditRows !== -1 && l.classList.contains("editing")) {
40
- const a = l.querySelector(w);
40
+ const a = l.querySelector(v);
41
41
  if (a && document.activeElement !== a)
42
42
  try {
43
43
  a.focus({ preventScroll: !0 });
@@ -53,7 +53,7 @@ function L(o, e) {
53
53
  }
54
54
  }
55
55
  }
56
- const I = '<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentColor" d="M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/></svg>', O = {
56
+ const I = '<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentColor" d="M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/></svg>', H = {
57
57
  expand: "▶",
58
58
  collapse: "▼",
59
59
  sortAsc: "▲",
@@ -66,7 +66,7 @@ const I = '<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentCo
66
66
  filterActive: I,
67
67
  print: "🖨️"
68
68
  };
69
- class D {
69
+ class O {
70
70
  /**
71
71
  * Plugin dependencies - declare other plugins this one requires.
72
72
  *
@@ -356,7 +356,7 @@ class D {
356
356
  */
357
357
  get gridIcons() {
358
358
  const e = this.grid?.gridConfig?.icons ?? {};
359
- return { ...O, ...e };
359
+ return { ...H, ...e };
360
360
  }
361
361
  // #region Animation Helpers
362
362
  /**
@@ -432,8 +432,8 @@ class D {
432
432
  }
433
433
  // #endregion
434
434
  }
435
- const x = "@layer tbw-plugins{tbw-grid{--tbw-editing-bg: var(--tbw-color-selection);--tbw-editing-row-bg: var(--tbw-editing-bg);--tbw-editing-border: var(--tbw-border-input, 1px solid var(--tbw-color-border-strong));--tbw-padding-editing-input: var(--tbw-cell-padding-input, 2px 6px);--tbw-font-size-editor: inherit;--tbw-editing-row-outline-color: var(--tbw-color-accent);--tbw-editing-row-outline-width: 1px;--tbw-invalid-bg: light-dark(#fef2f2, #450a0a);--tbw-invalid-border-color: light-dark(#ef4444, #f87171)}tbw-grid:not(.tbw-grid-mode) .data-grid-row:has(.editing){background:var(--tbw-editing-row-bg);outline:var(--tbw-editing-row-outline-width) solid var(--tbw-editing-row-outline-color);outline-offset:calc(-1 * var(--tbw-editing-row-outline-width))}tbw-grid .data-grid-row>.cell.editing{overflow:hidden;padding:0;display:flex;min-height:calc(var(--tbw-row-height) + 2px);align-items:center;justify-content:center}tbw-grid .data-grid-row>.cell.editing input:not([type=checkbox]),tbw-grid .data-grid-row>.cell.editing select,tbw-grid .data-grid-row>.cell.editing textarea{width:100%;height:100%;flex:1 1 auto;min-width:0;border:var(--tbw-editing-border);padding:var(--tbw-padding-editing-input);font-size:var(--tbw-font-size-editor)}tbw-grid .tbw-editor-host{display:contents}tbw-grid .data-grid-row>.cell[data-invalid=true]{background:var(--tbw-invalid-bg);outline:1px solid var(--tbw-invalid-border-color);outline-offset:-1px}}";
436
- function B(o) {
435
+ const B = "@layer tbw-plugins{tbw-grid{--tbw-editing-bg: var(--tbw-color-selection);--tbw-editing-row-bg: var(--tbw-editing-bg);--tbw-editing-border: var(--tbw-border-input, 1px solid var(--tbw-color-border-strong));--tbw-padding-editing-input: var(--tbw-cell-padding-input, 2px 6px);--tbw-font-size-editor: inherit;--tbw-editing-row-outline-color: var(--tbw-color-accent);--tbw-editing-row-outline-width: 1px;--tbw-invalid-bg: light-dark(#fef2f2, #450a0a);--tbw-invalid-border-color: light-dark(#ef4444, #f87171)}tbw-grid:not(.tbw-grid-mode) .data-grid-row:has(.editing){background:var(--tbw-editing-row-bg);outline:var(--tbw-editing-row-outline-width) solid var(--tbw-editing-row-outline-color);outline-offset:calc(-1 * var(--tbw-editing-row-outline-width))}tbw-grid .data-grid-row>.cell.editing{overflow:hidden;padding:0;display:flex;min-height:calc(var(--tbw-row-height) + 2px);align-items:center;justify-content:center}tbw-grid .data-grid-row>.cell.editing input:not([type=checkbox]),tbw-grid .data-grid-row>.cell.editing select,tbw-grid .data-grid-row>.cell.editing textarea{width:100%;height:100%;flex:1 1 auto;min-width:0;border:var(--tbw-editing-border);padding:var(--tbw-padding-editing-input);font-size:var(--tbw-font-size-editor)}tbw-grid .tbw-editor-host{display:contents}tbw-grid .data-grid-row>.cell[data-invalid=true]{background:var(--tbw-invalid-bg);outline:1px solid var(--tbw-invalid-border-color);outline-offset:-1px}}";
436
+ function x(o) {
437
437
  const e = o.options;
438
438
  return e ? typeof e == "function" ? e() : e : [];
439
439
  }
@@ -441,9 +441,9 @@ function N(o) {
441
441
  return (e) => {
442
442
  const t = o.editorParams, i = document.createElement("input");
443
443
  i.type = "number", i.value = e.value != null ? String(e.value) : "", t?.min !== void 0 && (i.min = String(t.min)), t?.max !== void 0 && (i.max = String(t.max)), t?.step !== void 0 && (i.step = String(t.step)), t?.placeholder && (i.placeholder = t.placeholder);
444
- const n = () => e.commit(i.value === "" ? null : Number(i.value));
445
- return i.addEventListener("blur", n), i.addEventListener("keydown", (s) => {
446
- s.key === "Enter" && n(), s.key === "Escape" && e.cancel();
444
+ const r = () => e.commit(i.value === "" ? null : Number(i.value));
445
+ return i.addEventListener("blur", r), i.addEventListener("keydown", (s) => {
446
+ s.key === "Enter" && r(), s.key === "Escape" && e.cancel();
447
447
  }), i;
448
448
  };
449
449
  }
@@ -453,38 +453,38 @@ function $() {
453
453
  return e.type = "checkbox", e.checked = !!o.value, e.addEventListener("change", () => o.commit(e.checked)), e;
454
454
  };
455
455
  }
456
- function z(o) {
456
+ function G(o) {
457
457
  return (e) => {
458
458
  const t = o.editorParams, i = document.createElement("input");
459
459
  i.type = "date", e.value instanceof Date ? i.valueAsDate = e.value : typeof e.value == "string" && e.value && (i.value = e.value.split("T")[0]), t?.min && (i.min = t.min), t?.max && (i.max = t.max), t?.placeholder && (i.placeholder = t.placeholder);
460
- const n = () => {
460
+ const r = () => {
461
461
  typeof e.value == "string" ? e.commit(i.value) : e.commit(i.valueAsDate);
462
462
  };
463
- return i.addEventListener("change", n), i.addEventListener("keydown", (s) => {
463
+ return i.addEventListener("change", r), i.addEventListener("keydown", (s) => {
464
464
  s.key === "Escape" && e.cancel();
465
465
  }), i;
466
466
  };
467
467
  }
468
- function G(o) {
468
+ function z(o) {
469
469
  return (e) => {
470
470
  const t = o.editorParams, i = document.createElement("select");
471
471
  if (o.multi && (i.multiple = !0), t?.includeEmpty) {
472
- const r = document.createElement("option");
473
- r.value = "", r.textContent = t.emptyLabel ?? "", i.appendChild(r);
472
+ const n = document.createElement("option");
473
+ n.value = "", n.textContent = t.emptyLabel ?? "", i.appendChild(n);
474
474
  }
475
- B(o).forEach((r) => {
475
+ x(o).forEach((n) => {
476
476
  const l = document.createElement("option");
477
- l.value = String(r.value), l.textContent = r.label, (o.multi && Array.isArray(e.value) && e.value.includes(r.value) || !o.multi && e.value === r.value) && (l.selected = !0), i.appendChild(l);
477
+ l.value = String(n.value), l.textContent = n.label, (o.multi && Array.isArray(e.value) && e.value.includes(n.value) || !o.multi && e.value === n.value) && (l.selected = !0), i.appendChild(l);
478
478
  });
479
479
  const s = () => {
480
480
  if (o.multi) {
481
- const r = Array.from(i.selectedOptions).map((l) => l.value);
482
- e.commit(r);
481
+ const n = Array.from(i.selectedOptions).map((l) => l.value);
482
+ e.commit(n);
483
483
  } else
484
484
  e.commit(i.value);
485
485
  };
486
- return i.addEventListener("change", s), i.addEventListener("blur", s), i.addEventListener("keydown", (r) => {
487
- r.key === "Escape" && e.cancel();
486
+ return i.addEventListener("change", s), i.addEventListener("blur", s), i.addEventListener("keydown", (n) => {
487
+ n.key === "Escape" && e.cancel();
488
488
  }), i;
489
489
  };
490
490
  }
@@ -492,39 +492,39 @@ function F(o) {
492
492
  return (e) => {
493
493
  const t = o.editorParams, i = document.createElement("input");
494
494
  i.type = "text", i.value = e.value != null ? String(e.value) : "", t?.maxLength !== void 0 && (i.maxLength = t.maxLength), t?.pattern && (i.pattern = t.pattern), t?.placeholder && (i.placeholder = t.placeholder);
495
- const n = () => {
495
+ const r = () => {
496
496
  const s = i.value;
497
497
  (e.value === null || e.value === void 0) && s === "" || typeof e.value == "string" && s === e.value.replace(/[\n\r]/g, "") || (typeof e.value == "number" && s !== "" ? e.commit(Number(s)) : e.commit(s));
498
498
  };
499
- return i.addEventListener("blur", n), i.addEventListener("keydown", (s) => {
500
- s.key === "Enter" && n(), s.key === "Escape" && e.cancel();
499
+ return i.addEventListener("blur", r), i.addEventListener("keydown", (s) => {
500
+ s.key === "Enter" && r(), s.key === "Escape" && e.cancel();
501
501
  }), i;
502
502
  };
503
503
  }
504
- function j(o) {
504
+ function K(o) {
505
505
  switch (o.type) {
506
506
  case "number":
507
507
  return N(o);
508
508
  case "boolean":
509
509
  return $();
510
510
  case "date":
511
- return z(o);
512
- case "select":
513
511
  return G(o);
512
+ case "select":
513
+ return z(o);
514
514
  default:
515
515
  return F(o);
516
516
  }
517
517
  }
518
- function W(o, e) {
518
+ function j(o, e) {
519
519
  if (e.editor) return e.editor;
520
520
  if (e.__editorTemplate) return "template";
521
521
  if (!e.type) return;
522
522
  const i = o.effectiveConfig?.typeDefaults;
523
523
  if (i?.[e.type]?.editor)
524
524
  return i[e.type].editor;
525
- const n = o.__frameworkAdapter;
526
- if (n?.getTypeDefault) {
527
- const s = n.getTypeDefault(e.type);
525
+ const r = o.__frameworkAdapter;
526
+ if (r?.getTypeDefault) {
527
+ const s = r.getTypeDefault(e.type);
528
528
  if (s?.editor)
529
529
  return s.editor;
530
530
  }
@@ -532,7 +532,7 @@ function W(o, e) {
532
532
  function S(o) {
533
533
  return !(typeof o != "string" || o === "__proto__" || o === "constructor" || o === "prototype");
534
534
  }
535
- function K(o) {
535
+ function W(o) {
536
536
  const e = (o.__editingCellCount ?? 0) + 1;
537
537
  o.__editingCellCount = e, o.setAttribute("data-has-editing", "");
538
538
  }
@@ -545,12 +545,12 @@ function _(o, e, t) {
545
545
  function T(o) {
546
546
  }
547
547
  function Q(o, e, t, i) {
548
- const n = o.querySelector("input,textarea,select");
549
- n && (n.addEventListener("blur", () => {
550
- t(_(n, e, i));
551
- }), n instanceof HTMLInputElement && n.type === "checkbox" ? n.addEventListener("change", () => t(n.checked)) : n instanceof HTMLSelectElement && n.addEventListener("change", () => t(_(n, e, i))));
548
+ const r = o.querySelector("input,textarea,select");
549
+ r && (r.addEventListener("blur", () => {
550
+ t(_(r, e, i));
551
+ }), r instanceof HTMLInputElement && r.type === "checkbox" ? r.addEventListener("change", () => t(r.checked)) : r instanceof HTMLSelectElement && r.addEventListener("change", () => t(_(r, e, i))));
552
552
  }
553
- class X extends D {
553
+ class X extends O {
554
554
  /**
555
555
  * Plugin manifest - declares owned properties for configuration validation.
556
556
  * @internal
@@ -590,7 +590,7 @@ class X extends D {
590
590
  /** @internal */
591
591
  name = "editing";
592
592
  /** @internal */
593
- styles = x;
593
+ styles = B;
594
594
  /** @internal */
595
595
  get defaultConfig() {
596
596
  return {
@@ -612,7 +612,7 @@ class X extends D {
612
612
  /** Snapshots of row data before editing started */
613
613
  #l = /* @__PURE__ */ new Map();
614
614
  /** Set of row IDs that have been modified (ID-based for stability) */
615
- #n = /* @__PURE__ */ new Set();
615
+ #r = /* @__PURE__ */ new Set();
616
616
  /** Set of cells currently in edit mode: "rowIndex:colIndex" */
617
617
  #o = /* @__PURE__ */ new Set();
618
618
  /**
@@ -636,7 +636,7 @@ class X extends D {
636
636
  * When false: arrow keys navigate between cells (navigation mode).
637
637
  * Escape switches to navigation mode, Enter switches to edit mode.
638
638
  */
639
- #r = !1;
639
+ #n = !1;
640
640
  /**
641
641
  * In grid mode, when true, prevents inputs from auto-focusing.
642
642
  * This is set when Escape is pressed (navigation mode) and cleared
@@ -660,13 +660,13 @@ class X extends D {
660
660
  }), Object.defineProperty(e, "changedRowIds", {
661
661
  get: () => this.changedRowIds,
662
662
  configurable: !0
663
- }), e.resetChangedRows = (n) => this.resetChangedRows(n), e.beginBulkEdit = (n, s) => {
664
- s && this.beginCellEdit(n, s);
663
+ }), e.resetChangedRows = (r) => this.resetChangedRows(r), e.beginBulkEdit = (r, s) => {
664
+ s && this.beginCellEdit(r, s);
665
665
  }, document.addEventListener(
666
666
  "keydown",
667
- (n) => {
668
- if (!this.#t && n.key === "Escape" && this.#e !== -1) {
669
- if (this.config.onBeforeEditClose && this.config.onBeforeEditClose(n) === !1)
667
+ (r) => {
668
+ if (!this.#t && r.key === "Escape" && this.#e !== -1) {
669
+ if (this.config.onBeforeEditClose && this.config.onBeforeEditClose(r) === !1)
670
670
  return;
671
671
  this.#s(this.#e, !0);
672
672
  }
@@ -674,63 +674,66 @@ class X extends D {
674
674
  { capture: !0, signal: t }
675
675
  ), document.addEventListener(
676
676
  "mousedown",
677
- (n) => {
677
+ (r) => {
678
678
  if (this.#t || this.#e === -1) return;
679
679
  const s = i.findRenderedRowElement?.(this.#e);
680
- !s || (n.composedPath && n.composedPath() || []).includes(s) || this.config.onBeforeEditClose && this.config.onBeforeEditClose(n) === !1 || queueMicrotask(() => {
680
+ !s || (r.composedPath && r.composedPath() || []).includes(s) || this.config.onBeforeEditClose && this.config.onBeforeEditClose(r) === !1 || queueMicrotask(() => {
681
681
  this.#e !== -1 && this.#s(this.#e, !1);
682
682
  });
683
683
  },
684
684
  { signal: t }
685
685
  ), this.gridElement.addEventListener(
686
686
  "cell-change",
687
- (n) => {
688
- const s = n.detail;
687
+ (r) => {
688
+ const s = r.detail;
689
689
  if (s.source === "user") return;
690
- const r = `${s.rowIndex}:${s.field}`, l = this.#c.get(r);
690
+ const n = `${s.rowIndex}:${s.field}`, l = this.#c.get(n);
691
691
  l && l(s.newValue);
692
692
  },
693
693
  { signal: t }
694
- ), this.#t && (this.gridElement.classList.add("tbw-grid-mode"), this.requestRender(), this.gridElement.addEventListener(
694
+ ), this.#t && (i._isGridEditMode = !0, this.gridElement.classList.add("tbw-grid-mode"), this.requestRender(), this.gridElement.addEventListener(
695
695
  "focusin",
696
- (n) => {
697
- const s = n.target;
698
- if (s.matches(w)) {
696
+ (r) => {
697
+ const s = r.target;
698
+ if (s.matches(v)) {
699
699
  if (this.#a) {
700
700
  s.blur(), this.gridElement.focus();
701
701
  return;
702
702
  }
703
- this.#r = !0;
703
+ this.#n = !0;
704
704
  }
705
705
  },
706
706
  { signal: t }
707
707
  ), this.gridElement.addEventListener(
708
708
  "focusout",
709
- (n) => {
710
- const s = n.relatedTarget;
711
- (!s || !this.gridElement.contains(s) || !s.matches(w)) && (this.#r = !1);
709
+ (r) => {
710
+ const s = r.relatedTarget;
711
+ (!s || !this.gridElement.contains(s) || !s.matches(v)) && (this.#n = !1);
712
712
  },
713
713
  { signal: t }
714
714
  ), this.gridElement.addEventListener(
715
715
  "keydown",
716
- (n) => {
717
- if (n.key === "Escape" && this.#r) {
716
+ (r) => {
717
+ if (r.key === "Escape" && this.#n) {
718
+ if (this.config.onBeforeEditClose && this.config.onBeforeEditClose(r) === !1)
719
+ return;
718
720
  const s = document.activeElement;
719
- s && this.gridElement.contains(s) && (s.blur(), this.gridElement.focus()), this.#r = !1, this.#a = !0, n.preventDefault(), n.stopPropagation();
721
+ s && this.gridElement.contains(s) && (s.blur(), this.gridElement.focus()), this.#n = !1, this.#a = !0, r.preventDefault(), r.stopPropagation();
720
722
  }
721
723
  },
722
724
  { capture: !0, signal: t }
723
725
  ), this.gridElement.addEventListener(
724
726
  "mousedown",
725
- (n) => {
726
- n.target.matches(w) && (this.#a = !1);
727
+ (r) => {
728
+ r.target.matches(v) && (this.#a = !1);
727
729
  },
728
730
  { signal: t }
729
731
  ));
730
732
  }
731
733
  /** @internal */
732
734
  detach() {
733
- this.gridElement.classList.remove("tbw-grid-mode"), this.#e = -1, this.#u = -1, this.#l.clear(), this.#n.clear(), this.#o.clear(), this.#c.clear(), this.#r = !1, this.#a = !1, this.#d = !1, super.detach();
735
+ const e = this.gridElement;
736
+ e._isGridEditMode = !1, this.gridElement.classList.remove("tbw-grid-mode"), this.#e = -1, this.#u = -1, this.#l.clear(), this.#r.clear(), this.#o.clear(), this.#c.clear(), this.#n = !1, this.#a = !1, this.#d = !1, super.detach();
734
737
  }
735
738
  /**
736
739
  * Handle plugin queries.
@@ -752,8 +755,8 @@ class X extends D {
752
755
  if (this.#t) return !1;
753
756
  const t = this.grid, i = this.config.editOn ?? t.effectiveConfig?.editOn;
754
757
  if (i === !1 || i === "manual" || i !== "click" && i !== "dblclick") return !1;
755
- const n = e.originalEvent.type === "dblclick";
756
- if (i === "click" && n || i === "dblclick" && !n) return !1;
758
+ const r = e.originalEvent.type === "dblclick";
759
+ if (i === "click" && r || i === "dblclick" && !r) return !1;
757
760
  const { rowIndex: s } = e;
758
761
  return t._columns?.some((l) => l.editable) ? (e.originalEvent.stopPropagation(), this.beginBulkEdit(s), !0) : !1;
759
762
  }
@@ -764,20 +767,24 @@ class X extends D {
764
767
  onKeyDown(e) {
765
768
  const t = this.grid;
766
769
  if (e.key === "Escape") {
767
- if (this.#t && this.#r) {
770
+ if (this.#t && this.#n) {
771
+ if (this.config.onBeforeEditClose && this.config.onBeforeEditClose(e) === !1)
772
+ return !0;
768
773
  const i = document.activeElement;
769
- return i && this.gridElement.contains(i) && i.blur(), this.#r = !1, this.requestAfterRender(), !0;
774
+ return i && this.gridElement.contains(i) && i.blur(), this.#n = !1, this.requestAfterRender(), !0;
770
775
  }
771
776
  if (this.#e !== -1 && !this.#t)
772
777
  return this.config.onBeforeEditClose && this.config.onBeforeEditClose(e) === !1 || this.#s(this.#e, !0), !0;
773
778
  }
774
- if (this.#t && !this.#r && (e.key === "ArrowUp" || e.key === "ArrowDown" || e.key === "ArrowLeft" || e.key === "ArrowRight"))
779
+ if (this.#t && !this.#n && (e.key === "ArrowUp" || e.key === "ArrowDown" || e.key === "ArrowLeft" || e.key === "ArrowRight"))
775
780
  return !1;
781
+ if (this.#t && this.#n && (e.key === "ArrowUp" || e.key === "ArrowDown"))
782
+ return !0;
776
783
  if ((e.key === "ArrowUp" || e.key === "ArrowDown") && this.#e !== -1 && !this.#t) {
777
784
  if (this.config.onBeforeEditClose && this.config.onBeforeEditClose(e) === !1)
778
785
  return !0;
779
- const i = t._rows.length - 1, n = this.#e;
780
- return this.#s(n, !1), e.key === "ArrowDown" ? t._focusRow = Math.min(i, t._focusRow + 1) : t._focusRow = Math.max(0, t._focusRow - 1), e.preventDefault(), L(t), this.requestAfterRender(), !0;
786
+ const i = t._rows.length - 1, r = this.#e;
787
+ return this.#s(r, !1), e.key === "ArrowDown" ? t._focusRow = Math.min(i, t._focusRow + 1) : t._focusRow = Math.max(0, t._focusRow - 1), e.preventDefault(), L(t), this.requestAfterRender(), !0;
781
788
  }
782
789
  if (e.key === "Tab" && (this.#e !== -1 || this.#t)) {
783
790
  if (e.preventDefault(), this.#d)
@@ -788,33 +795,33 @@ class X extends D {
788
795
  if (e.key === " " || e.key === "Spacebar") {
789
796
  if (this.#e !== -1)
790
797
  return !1;
791
- const i = t._focusRow, n = t._focusCol;
792
- if (i >= 0 && n >= 0) {
793
- const s = t._visibleColumns[n], r = t._rows[i];
794
- if (s?.editable && s.type === "boolean" && r) {
798
+ const i = t._focusRow, r = t._focusCol;
799
+ if (i >= 0 && r >= 0) {
800
+ const s = t._visibleColumns[r], n = t._rows[i];
801
+ if (s?.editable && s.type === "boolean" && n) {
795
802
  const l = s.field;
796
803
  if (S(l)) {
797
- const a = !r[l];
798
- return this.#E(i, s, a, r), e.preventDefault(), this.requestRender(), !0;
804
+ const a = !n[l];
805
+ return this.#E(i, s, a, n), e.preventDefault(), this.requestRender(), !0;
799
806
  }
800
807
  }
801
808
  }
802
809
  return !1;
803
810
  }
804
- if (e.key === "Enter" && !e.shiftKey) {
805
- if (this.#t && !this.#r)
811
+ if (e.key === "Enter" && !e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey) {
812
+ if (this.#t && !this.#n)
806
813
  return this.#y(), !0;
807
814
  if (this.#e !== -1)
808
815
  return !!(this.config.onBeforeEditClose && this.config.onBeforeEditClose(e) === !1);
809
816
  const i = this.config.editOn ?? t.effectiveConfig?.editOn;
810
817
  if (i === !1 || i === "manual") return !1;
811
- const n = t._focusRow, s = t._focusCol;
812
- if (n >= 0 && t._columns?.some((l) => l.editable)) {
813
- const l = t._visibleColumns[s], c = t._rows[n], a = l?.field ?? "", d = a && c ? c[a] : void 0, g = this.gridElement.querySelector(`[data-row="${n}"][data-col="${s}"]`), f = new CustomEvent("cell-activate", {
818
+ const r = t._focusRow, s = t._focusCol;
819
+ if (r >= 0 && t._columns?.some((l) => l.editable)) {
820
+ const l = t._visibleColumns[s], c = t._rows[r], a = l?.field ?? "", d = a && c ? c[a] : void 0, g = this.gridElement.querySelector(`[data-row="${r}"][data-col="${s}"]`), f = new CustomEvent("cell-activate", {
814
821
  cancelable: !0,
815
822
  bubbles: !0,
816
823
  detail: {
817
- rowIndex: n,
824
+ rowIndex: r,
818
825
  colIndex: s,
819
826
  field: a,
820
827
  value: d,
@@ -828,19 +835,19 @@ class X extends D {
828
835
  const E = new CustomEvent("activate-cell", {
829
836
  cancelable: !0,
830
837
  bubbles: !0,
831
- detail: { row: n, col: s }
838
+ detail: { row: r, col: s }
832
839
  });
833
- return this.gridElement.dispatchEvent(E), f.defaultPrevented || E.defaultPrevented ? (e.preventDefault(), !0) : (this.beginBulkEdit(n), !0);
840
+ return this.gridElement.dispatchEvent(E), f.defaultPrevented || E.defaultPrevented ? (e.preventDefault(), !0) : (this.beginBulkEdit(r), !0);
834
841
  }
835
842
  return !1;
836
843
  }
837
844
  if (e.key === "F2") {
838
845
  if (this.#e !== -1 || this.#t || (this.config.editOn ?? t.effectiveConfig?.editOn) === !1) return !1;
839
- const n = t._focusRow, s = t._focusCol;
840
- if (n >= 0 && s >= 0) {
841
- const r = t._visibleColumns[s];
842
- if (r?.editable && r.field)
843
- return e.preventDefault(), this.beginCellEdit(n, r.field), !0;
846
+ const r = t._focusRow, s = t._focusCol;
847
+ if (r >= 0 && s >= 0) {
848
+ const n = t._visibleColumns[s];
849
+ if (n?.editable && n.field)
850
+ return e.preventDefault(), this.beginCellEdit(r, n.field), !0;
844
851
  }
845
852
  return !1;
846
853
  }
@@ -854,17 +861,17 @@ class X extends D {
854
861
  * @internal
855
862
  */
856
863
  processColumns(e) {
857
- const t = this.grid, i = t.effectiveConfig?.typeDefaults, n = t.__frameworkAdapter;
858
- return !i && !n?.getTypeDefault ? e : e.map((s) => {
864
+ const t = this.grid, i = t.effectiveConfig?.typeDefaults, r = t.__frameworkAdapter;
865
+ return !i && !r?.getTypeDefault ? e : e.map((s) => {
859
866
  if (!s.type) return s;
860
- let r;
861
- if (i?.[s.type]?.editorParams && (r = i[s.type].editorParams), !r && n?.getTypeDefault) {
862
- const l = n.getTypeDefault(s.type);
863
- l?.editorParams && (r = l.editorParams);
867
+ let n;
868
+ if (i?.[s.type]?.editorParams && (n = i[s.type].editorParams), !n && r?.getTypeDefault) {
869
+ const l = r.getTypeDefault(s.type);
870
+ l?.editorParams && (n = l.editorParams);
864
871
  }
865
- return r ? {
872
+ return n ? {
866
873
  ...s,
867
- editorParams: { ...r, ...s.editorParams }
874
+ editorParams: { ...n, ...s.editorParams }
868
875
  } : s;
869
876
  });
870
877
  }
@@ -876,18 +883,18 @@ class X extends D {
876
883
  */
877
884
  afterRender() {
878
885
  const e = this.grid;
879
- if (this.#f && (this.#f = !1, this.#w(e)), this.#h !== -1) {
886
+ if (this.#f && (this.#f = !1, this.#v(e)), this.#h !== -1) {
880
887
  const t = this.#h;
881
888
  this.#h = -1, e.animateRow?.(t, "change");
882
889
  }
883
890
  if (!this.#t && this.#o.size !== 0)
884
891
  for (const t of this.#o) {
885
- const [i, n] = t.split(":"), s = parseInt(i, 10), r = parseInt(n, 10), l = e.findRenderedRowElement?.(s);
892
+ const [i, r] = t.split(":"), s = parseInt(i, 10), n = parseInt(r, 10), l = e.findRenderedRowElement?.(s);
886
893
  if (!l) continue;
887
- const c = l.querySelector(`.cell[data-col="${r}"]`);
894
+ const c = l.querySelector(`.cell[data-col="${n}"]`);
888
895
  if (!c || c.classList.contains("editing")) continue;
889
- const a = e._rows[s], d = e._visibleColumns[r];
890
- a && d && this.#m(a, s, d, r, c, !0);
896
+ const a = e._rows[s], d = e._visibleColumns[n];
897
+ a && d && this.#m(a, s, d, n, c, !0);
891
898
  }
892
899
  }
893
900
  /**
@@ -897,8 +904,8 @@ class X extends D {
897
904
  */
898
905
  afterCellRender(e) {
899
906
  if (!this.#t) return;
900
- const { row: t, rowIndex: i, column: n, colIndex: s, cellElement: r } = e;
901
- n.editable && (r.classList.contains("editing") || this.#m(t, i, n, s, r, !0));
907
+ const { row: t, rowIndex: i, column: r, colIndex: s, cellElement: n } = e;
908
+ r.editable && (n.classList.contains("editing") || this.#m(t, i, r, s, n, !0));
902
909
  }
903
910
  /**
904
911
  * On scroll render, reapply editors to recycled cells.
@@ -915,7 +922,7 @@ class X extends D {
915
922
  */
916
923
  get changedRows() {
917
924
  const e = [];
918
- for (const t of this.#n) {
925
+ for (const t of this.#r) {
919
926
  const i = this.grid.getRow(t);
920
927
  i && e.push(i);
921
928
  }
@@ -925,7 +932,7 @@ class X extends D {
925
932
  * Get IDs of all modified rows.
926
933
  */
927
934
  get changedRowIds() {
928
- return Array.from(this.#n);
935
+ return Array.from(this.#r);
929
936
  }
930
937
  /**
931
938
  * Get the currently active edit row index, or -1 if not editing.
@@ -959,8 +966,8 @@ class X extends D {
959
966
  const t = this.grid, i = t._rows[e];
960
967
  if (!i) return !1;
961
968
  try {
962
- const n = t.getRowId?.(i);
963
- return n ? this.#n.has(n) : !1;
969
+ const r = t.getRowId?.(i);
970
+ return r ? this.#r.has(r) : !1;
964
971
  } catch {
965
972
  return !1;
966
973
  }
@@ -970,7 +977,7 @@ class X extends D {
970
977
  * @param rowId - Row ID to check
971
978
  */
972
979
  isRowChangedById(e) {
973
- return this.#n.has(e);
980
+ return this.#r.has(e);
974
981
  }
975
982
  // #region Cell Validation
976
983
  /**
@@ -995,8 +1002,8 @@ class X extends D {
995
1002
  * ```
996
1003
  */
997
1004
  setInvalid(e, t, i = "") {
998
- let n = this.#i.get(e);
999
- n || (n = /* @__PURE__ */ new Map(), this.#i.set(e, n)), n.set(t, i), this.#g(e, t, !0);
1005
+ let r = this.#i.get(e);
1006
+ r || (r = /* @__PURE__ */ new Map(), this.#i.set(e, r)), r.set(t, i), this.#g(e, t, !0);
1000
1007
  }
1001
1008
  /**
1002
1009
  * Clear the invalid state for a specific cell.
@@ -1017,7 +1024,7 @@ class X extends D {
1017
1024
  const t = this.#i.get(e);
1018
1025
  if (t) {
1019
1026
  const i = Array.from(t.keys());
1020
- this.#i.delete(e), i.forEach((n) => this.#g(e, n, !1));
1027
+ this.#i.delete(e), i.forEach((r) => this.#g(e, r, !1));
1021
1028
  }
1022
1029
  }
1023
1030
  /**
@@ -1026,7 +1033,7 @@ class X extends D {
1026
1033
  clearAllInvalid() {
1027
1034
  const e = Array.from(this.#i.entries());
1028
1035
  this.#i.clear(), e.forEach(([t, i]) => {
1029
- i.forEach((n, s) => this.#g(t, s, !1));
1036
+ i.forEach((r, s) => this.#g(t, s, !1));
1030
1037
  });
1031
1038
  }
1032
1039
  /**
@@ -1072,17 +1079,17 @@ class X extends D {
1072
1079
  * Sync the data-invalid attribute on a cell element.
1073
1080
  */
1074
1081
  #g(e, t, i) {
1075
- const n = this.grid, s = n._visibleColumns?.findIndex((d) => d.field === t);
1082
+ const r = this.grid, s = r._visibleColumns?.findIndex((d) => d.field === t);
1076
1083
  if (s === -1 || s === void 0) return;
1077
- const l = n._rows?.findIndex((d) => {
1084
+ const l = r._rows?.findIndex((d) => {
1078
1085
  try {
1079
- return n.getRowId?.(d) === e;
1086
+ return r.getRowId?.(d) === e;
1080
1087
  } catch {
1081
1088
  return !1;
1082
1089
  }
1083
1090
  });
1084
1091
  if (l === -1 || l === void 0) return;
1085
- const a = n.findRenderedRowElement?.(l)?.querySelector(`.cell[data-col="${s}"]`);
1092
+ const a = r.findRenderedRowElement?.(l)?.querySelector(`.cell[data-col="${s}"]`);
1086
1093
  if (a)
1087
1094
  if (i) {
1088
1095
  a.setAttribute("data-invalid", "true");
@@ -1099,7 +1106,7 @@ class X extends D {
1099
1106
  */
1100
1107
  resetChangedRows(e) {
1101
1108
  const t = this.changedRows, i = this.changedRowIds;
1102
- this.#n.clear(), this.#p(), e || this.emit("changed-rows-reset", { rows: t, ids: i }), this.grid._rowPool?.forEach((s) => s.classList.remove("changed"));
1109
+ this.#r.clear(), this.#p(), e || this.emit("changed-rows-reset", { rows: t, ids: i }), this.grid._rowPool?.forEach((s) => s.classList.remove("changed"));
1103
1110
  }
1104
1111
  /**
1105
1112
  * Programmatically begin editing a cell.
@@ -1108,10 +1115,10 @@ class X extends D {
1108
1115
  * @fires cell-commit - Emitted when the cell value is committed (on blur or Enter)
1109
1116
  */
1110
1117
  beginCellEdit(e, t) {
1111
- const i = this.grid, n = i._visibleColumns.findIndex((c) => c.field === t);
1112
- if (n === -1 || !i._visibleColumns[n]?.editable) return;
1113
- const l = i.findRenderedRowElement?.(e)?.querySelector(`.cell[data-col="${n}"]`);
1114
- l && (this.#d = !0, this.#b(e, n, l));
1118
+ const i = this.grid, r = i._visibleColumns.findIndex((c) => c.field === t);
1119
+ if (r === -1 || !i._visibleColumns[r]?.editable) return;
1120
+ const l = i.findRenderedRowElement?.(e)?.querySelector(`.cell[data-col="${r}"]`);
1121
+ l && (this.#d = !0, this.#b(e, r, l));
1115
1122
  }
1116
1123
  /**
1117
1124
  * Programmatically begin editing all editable cells in a row.
@@ -1125,17 +1132,17 @@ class X extends D {
1125
1132
  const s = t.findRenderedRowElement?.(e);
1126
1133
  if (!s) return;
1127
1134
  this.#d = !1;
1128
- const r = t._rows[e];
1129
- this.#v(e, r), Array.from(s.children).forEach((l, c) => {
1135
+ const n = t._rows[e];
1136
+ this.#w(e, n), Array.from(s.children).forEach((l, c) => {
1130
1137
  const a = t._visibleColumns[c];
1131
1138
  if (a?.editable) {
1132
1139
  const d = l;
1133
- d.classList.contains("editing") || this.#m(r, e, a, c, d, !0);
1140
+ d.classList.contains("editing") || this.#m(n, e, a, c, d, !0);
1134
1141
  }
1135
1142
  }), setTimeout(() => {
1136
1143
  let l = s.querySelector(`.cell[data-col="${t._focusCol}"]`);
1137
1144
  if (l?.classList.contains("editing") || (l = s.querySelector(".cell.editing")), l?.classList.contains("editing")) {
1138
- const c = l.querySelector(w);
1145
+ const c = l.querySelector(v);
1139
1146
  try {
1140
1147
  c?.focus({ preventScroll: !0 });
1141
1148
  } catch {
@@ -1162,8 +1169,8 @@ class X extends D {
1162
1169
  * Begin editing a single cell.
1163
1170
  */
1164
1171
  #b(e, t, i) {
1165
- const n = this.grid, s = n._rows[e], r = n._visibleColumns[t];
1166
- !s || !r?.editable || i.classList.contains("editing") || (this.#e !== e && this.#v(e, s), this.#u = t, this.#m(s, e, r, t, i, !1));
1172
+ const r = this.grid, s = r._rows[e], n = r._visibleColumns[t];
1173
+ !s || !n?.editable || i.classList.contains("editing") || (this.#e !== e && this.#w(e, s), this.#u = t, this.#m(s, e, n, t, i, !1));
1167
1174
  }
1168
1175
  /**
1169
1176
  * Focus the editor input in the currently focused cell (grid mode only).
@@ -1174,8 +1181,8 @@ class X extends D {
1174
1181
  if (t < 0 || i < 0) return;
1175
1182
  const s = e.findRenderedRowElement?.(t)?.querySelector(`.cell[data-col="${i}"]`);
1176
1183
  if (s?.classList.contains("editing")) {
1177
- const r = s.querySelector(w);
1178
- r && (this.#a = !1, r.focus(), this.#r = !0, r instanceof HTMLInputElement && (r.type === "text" || r.type === "number") && r.select());
1184
+ const n = s.querySelector(v);
1185
+ n && (this.#a = !1, n.focus(), this.#n = !0, n instanceof HTMLInputElement && (n.type === "text" || n.type === "number") && n.select());
1179
1186
  }
1180
1187
  }
1181
1188
  /**
@@ -1184,20 +1191,20 @@ class X extends D {
1184
1191
  * Wraps to next/previous row when reaching row boundaries.
1185
1192
  */
1186
1193
  #C(e) {
1187
- const t = this.grid, i = t._rows, n = this.#t ? t._focusRow : this.#e, s = t._visibleColumns.map((a, d) => a.editable ? d : -1).filter((a) => a >= 0);
1194
+ const t = this.grid, i = t._rows, r = this.#t ? t._focusRow : this.#e, s = t._visibleColumns.map((a, d) => a.editable ? d : -1).filter((a) => a >= 0);
1188
1195
  if (s.length === 0) return;
1189
1196
  const l = s.indexOf(t._focusCol) + (e ? 1 : -1);
1190
1197
  if (l >= 0 && l < s.length) {
1191
1198
  t._focusCol = s[l];
1192
- const d = t.findRenderedRowElement?.(n)?.querySelector(`.cell[data-col="${s[l]}"]`);
1193
- d?.classList.contains("editing") && d.querySelector(w)?.focus({ preventScroll: !0 }), L(t, { forceHorizontalScroll: !0 });
1199
+ const d = t.findRenderedRowElement?.(r)?.querySelector(`.cell[data-col="${s[l]}"]`);
1200
+ d?.classList.contains("editing") && d.querySelector(v)?.focus({ preventScroll: !0 }), L(t, { forceHorizontalScroll: !0 });
1194
1201
  return;
1195
1202
  }
1196
- const c = n + (e ? 1 : -1);
1203
+ const c = r + (e ? 1 : -1);
1197
1204
  c >= 0 && c < i.length && (this.#t ? (t._focusRow = c, t._focusCol = e ? s[0] : s[s.length - 1], L(t, { forceHorizontalScroll: !0 }), this.requestAfterRender(), setTimeout(() => {
1198
1205
  const d = t.findRenderedRowElement?.(c)?.querySelector(`.cell[data-col="${t._focusCol}"]`);
1199
- d?.classList.contains("editing") && d.querySelector(w)?.focus({ preventScroll: !0 });
1200
- }, 0)) : (this.#s(n, !1), t._focusRow = c, t._focusCol = e ? s[0] : s[s.length - 1], this.beginBulkEdit(c), L(t, { forceHorizontalScroll: !0 })));
1206
+ d?.classList.contains("editing") && d.querySelector(v)?.focus({ preventScroll: !0 });
1207
+ }, 0)) : (this.#s(r, !1), t._focusRow = c, t._focusCol = e ? s[0] : s[s.length - 1], this.beginBulkEdit(c), L(t, { forceHorizontalScroll: !0 })));
1201
1208
  }
1202
1209
  /**
1203
1210
  * Sync the internal grid state with the plugin's editing state.
@@ -1209,17 +1216,17 @@ class X extends D {
1209
1216
  /**
1210
1217
  * Snapshot original row data and mark as editing.
1211
1218
  */
1212
- #v(e, t) {
1219
+ #w(e, t) {
1213
1220
  if (this.#e !== e && (this.#l.set(e, { ...t }), this.#e = e, this.#p(), !this.#t)) {
1214
1221
  const i = this.grid;
1215
- let n = "";
1222
+ let r = "";
1216
1223
  try {
1217
- n = i.getRowId?.(t) ?? "";
1224
+ r = i.getRowId?.(t) ?? "";
1218
1225
  } catch {
1219
1226
  }
1220
1227
  this.emit("edit-open", {
1221
1228
  rowIndex: e,
1222
- rowId: n,
1229
+ rowId: r,
1223
1230
  row: t
1224
1231
  });
1225
1232
  }
@@ -1229,14 +1236,14 @@ class X extends D {
1229
1236
  */
1230
1237
  #s(e, t) {
1231
1238
  if (this.#e !== e) return;
1232
- const i = this.grid, n = this.#l.get(e), s = i._rows[e], r = i.findRenderedRowElement?.(e);
1239
+ const i = this.grid, r = this.#l.get(e), s = i._rows[e], n = i.findRenderedRowElement?.(e);
1233
1240
  let l;
1234
1241
  if (s)
1235
1242
  try {
1236
1243
  l = i.getRowId?.(s);
1237
1244
  } catch {
1238
1245
  }
1239
- if (!t && r && s && r.querySelectorAll(".cell.editing").forEach((a) => {
1246
+ if (!t && n && s && n.querySelectorAll(".cell.editing").forEach((a) => {
1240
1247
  const d = Number(a.getAttribute("data-col"));
1241
1248
  if (isNaN(d)) return;
1242
1249
  const g = i._visibleColumns[d];
@@ -1247,33 +1254,33 @@ class X extends D {
1247
1254
  const E = g.field, p = s[E], m = _(f, g, p);
1248
1255
  p !== m && this.#E(e, g, m, s);
1249
1256
  }
1250
- }), t && n && s)
1251
- Object.keys(n).forEach((c) => {
1252
- s[c] = n[c];
1253
- }), l && (this.#n.delete(l), this.clearRowInvalid(l));
1257
+ }), t && r && s)
1258
+ Object.keys(r).forEach((c) => {
1259
+ s[c] = r[c];
1260
+ }), l && (this.#r.delete(l), this.clearRowInvalid(l));
1254
1261
  else if (!t && s) {
1255
- const c = this.#_(n, s), a = l ? this.#n.has(l) : c, d = this.emitCancelable("row-commit", {
1262
+ const c = this.#_(r, s), a = l ? this.#r.has(l) : c, d = this.emitCancelable("row-commit", {
1256
1263
  rowIndex: e,
1257
1264
  rowId: l ?? "",
1258
1265
  row: s,
1259
- oldValue: n,
1266
+ oldValue: r,
1260
1267
  newValue: s,
1261
1268
  changed: a,
1262
1269
  changedRows: this.changedRows,
1263
1270
  changedRowIds: this.changedRowIds
1264
1271
  });
1265
- d && n ? (Object.keys(n).forEach((g) => {
1266
- s[g] = n[g];
1267
- }), l && (this.#n.delete(l), this.clearRowInvalid(l))) : !d && c && this.isAnimationEnabled && (this.#h = e);
1272
+ d && r ? (Object.keys(r).forEach((g) => {
1273
+ s[g] = r[g];
1274
+ }), l && (this.#r.delete(l), this.clearRowInvalid(l))) : !d && c && this.isAnimationEnabled && (this.#h = e);
1268
1275
  }
1269
1276
  this.#l.delete(e), this.#e = -1, this.#u = -1, this.#d = !1, this.#p();
1270
1277
  for (const c of this.#o)
1271
1278
  c.startsWith(`${e}:`) && this.#o.delete(c);
1272
1279
  for (const c of this.#c.keys())
1273
1280
  c.startsWith(`${e}:`) && this.#c.delete(c);
1274
- r && (r.querySelectorAll(".cell.editing").forEach((c) => {
1281
+ n && (n.querySelectorAll(".cell.editing").forEach((c) => {
1275
1282
  c.classList.remove("editing"), U(c.parentElement);
1276
- }), this.requestRender()), this.#f = !0, r || (this.#w(i), this.#f = !1), !this.#t && s && this.emit("edit-close", {
1283
+ }), this.requestRender()), this.#f = !0, n || (this.#v(i), this.#f = !1), !this.#t && s && this.emit("edit-close", {
1277
1284
  rowIndex: e,
1278
1285
  rowId: l ?? "",
1279
1286
  row: s,
@@ -1284,28 +1291,28 @@ class X extends D {
1284
1291
  * Commit a single cell value change.
1285
1292
  * Uses ID-based change tracking for stability when rows are reordered.
1286
1293
  */
1287
- #E(e, t, i, n) {
1294
+ #E(e, t, i, r) {
1288
1295
  const s = t.field;
1289
1296
  if (!S(s)) return;
1290
- const r = n[s];
1291
- if (r === i) return;
1297
+ const n = r[s];
1298
+ if (n === i) return;
1292
1299
  const l = this.grid;
1293
1300
  let c;
1294
1301
  try {
1295
- c = this.grid.getRowId(n);
1302
+ c = this.grid.getRowId(r);
1296
1303
  } catch {
1297
1304
  }
1298
- const a = c ? !this.#n.has(c) : !0, d = c ? (m) => this.grid.updateRow(c, m, "cascade") : T;
1305
+ const a = c ? !this.#r.has(c) : !0, d = c ? (m) => this.grid.updateRow(c, m, "cascade") : T;
1299
1306
  let g = !1;
1300
1307
  const f = c ? (m) => {
1301
1308
  g = !0, this.setInvalid(c, s, m ?? "");
1302
1309
  } : () => {
1303
1310
  };
1304
1311
  if (this.emitCancelable("cell-commit", {
1305
- row: n,
1312
+ row: r,
1306
1313
  rowId: c ?? "",
1307
1314
  field: s,
1308
- oldValue: r,
1315
+ oldValue: n,
1309
1316
  value: i,
1310
1317
  rowIndex: e,
1311
1318
  changedRows: this.changedRows,
@@ -1314,10 +1321,10 @@ class X extends D {
1314
1321
  updateRow: d,
1315
1322
  setInvalid: f
1316
1323
  })) return;
1317
- c && !g && this.isCellInvalid(c, s) && this.clearInvalid(c, s), n[s] = i, c && this.#n.add(c), this.#p(), this.emitPluginEvent("cell-edit-committed", {
1324
+ c && !g && this.isCellInvalid(c, s) && this.clearInvalid(c, s), r[s] = i, c && this.#r.add(c), this.#p(), this.emitPluginEvent("cell-edit-committed", {
1318
1325
  rowIndex: e,
1319
1326
  field: s,
1320
- oldValue: r,
1327
+ oldValue: n,
1321
1328
  newValue: i
1322
1329
  });
1323
1330
  const p = l.findRenderedRowElement?.(e);
@@ -1326,7 +1333,7 @@ class X extends D {
1326
1333
  /**
1327
1334
  * Inject an editor into a cell.
1328
1335
  */
1329
- #m(e, t, i, n, s, r) {
1336
+ #m(e, t, i, r, s, n) {
1330
1337
  if (!i.editable || s.classList.contains("editing")) return;
1331
1338
  let l;
1332
1339
  try {
@@ -1334,14 +1341,19 @@ class X extends D {
1334
1341
  } catch {
1335
1342
  }
1336
1343
  const c = l ? (u) => this.grid.updateRow(l, u, "cascade") : T, a = S(i.field) ? e[i.field] : void 0;
1337
- s.classList.add("editing"), this.#o.add(`${t}:${n}`);
1344
+ s.classList.add("editing"), this.#o.add(`${t}:${r}`);
1338
1345
  const d = s.parentElement;
1339
- d && K(d);
1346
+ d && W(d);
1340
1347
  let g = !1;
1341
1348
  const f = (u) => {
1342
- g || !this.#t && this.#e === -1 || this.#E(t, i, u, e);
1349
+ if (g || !this.#t && this.#e === -1) return;
1350
+ const h = this.grid._rows[t] ?? e;
1351
+ this.#E(t, i, u, h);
1343
1352
  }, E = () => {
1344
- g = !0, S(i.field) && (e[i.field] = a);
1353
+ if (g = !0, S(i.field)) {
1354
+ const u = this.grid._rows[t] ?? e;
1355
+ u[i.field] = a;
1356
+ }
1345
1357
  }, p = document.createElement("div");
1346
1358
  p.className = "tbw-editor-host", s.innerHTML = "", s.appendChild(p), p.addEventListener("keydown", (u) => {
1347
1359
  if (u.key === "Enter") {
@@ -1365,28 +1377,28 @@ class X extends D {
1365
1377
  u.stopPropagation(), u.preventDefault(), E(), this.#s(t, !0);
1366
1378
  }
1367
1379
  });
1368
- const m = i, y = m.__editorTemplate, v = W(this.grid, m) ?? j(i), k = a, q = `${t}:${i.field}`, A = [];
1380
+ const m = i, y = m.__editorTemplate, w = j(this.grid, m) ?? K(i), k = a, q = `${t}:${i.field}`, A = [];
1369
1381
  this.#c.set(q, (u) => {
1370
1382
  for (const h of A) h(u);
1371
1383
  });
1372
1384
  const C = (u) => {
1373
1385
  A.push(u);
1374
1386
  };
1375
- if (v === "template" && y)
1376
- this.#R(p, m, e, a, f, E, r, t), C((u) => {
1387
+ if (w === "template" && y)
1388
+ this.#R(p, m, e, a, f, E, n, t), C((u) => {
1377
1389
  const h = p.querySelector(
1378
1390
  "input,textarea,select"
1379
1391
  );
1380
1392
  h && (h instanceof HTMLInputElement && h.type === "checkbox" ? h.checked = !!u : h.value = String(u ?? ""));
1381
1393
  });
1382
- else if (typeof v == "string") {
1383
- const u = document.createElement(v);
1394
+ else if (typeof w == "string") {
1395
+ const u = document.createElement(w);
1384
1396
  u.value = k, u.addEventListener("change", () => f(u.value)), C((h) => {
1385
1397
  u.value = h;
1386
- }), p.appendChild(u), r || queueMicrotask(() => {
1387
- p.querySelector(w)?.focus({ preventScroll: !0 });
1398
+ }), p.appendChild(u), n || queueMicrotask(() => {
1399
+ p.querySelector(v)?.focus({ preventScroll: !0 });
1388
1400
  });
1389
- } else if (typeof v == "function") {
1401
+ } else if (typeof w == "function") {
1390
1402
  const u = {
1391
1403
  row: e,
1392
1404
  rowId: l ?? "",
@@ -1397,7 +1409,7 @@ class X extends D {
1397
1409
  cancel: E,
1398
1410
  updateRow: c,
1399
1411
  onValueChange: C
1400
- }, h = v(u);
1412
+ }, h = w(u);
1401
1413
  typeof h == "string" ? (p.innerHTML = h, Q(p, i, f, a), C((R) => {
1402
1414
  const b = p.querySelector(
1403
1415
  "input,textarea,select"
@@ -1405,10 +1417,10 @@ class X extends D {
1405
1417
  b && (b instanceof HTMLInputElement && b.type === "checkbox" ? b.checked = !!R : b.value = String(R ?? ""));
1406
1418
  })) : h instanceof Node && (p.appendChild(h), h instanceof HTMLInputElement || h instanceof HTMLSelectElement || h instanceof HTMLTextAreaElement ? C((b) => {
1407
1419
  h instanceof HTMLInputElement && h.type === "checkbox" ? h.checked = !!b : h.value = String(b ?? "");
1408
- }) : s.setAttribute("data-editor-managed", "")), r || queueMicrotask(() => {
1409
- p.querySelector(w)?.focus({ preventScroll: !0 });
1420
+ }) : s.setAttribute("data-editor-managed", "")), n || queueMicrotask(() => {
1421
+ p.querySelector(v)?.focus({ preventScroll: !0 });
1410
1422
  });
1411
- } else if (v && typeof v == "object") {
1423
+ } else if (w && typeof w == "object") {
1412
1424
  const u = document.createElement("div");
1413
1425
  u.setAttribute("data-external-editor", ""), u.setAttribute("data-field", i.field), p.appendChild(u), s.setAttribute("data-editor-managed", "");
1414
1426
  const h = {
@@ -1422,34 +1434,34 @@ class X extends D {
1422
1434
  updateRow: c,
1423
1435
  onValueChange: C
1424
1436
  };
1425
- if (v.mount)
1437
+ if (w.mount)
1426
1438
  try {
1427
- v.mount({ placeholder: u, context: h, spec: v });
1439
+ w.mount({ placeholder: u, context: h, spec: w });
1428
1440
  } catch (R) {
1429
1441
  console.warn(`[tbw-grid] External editor mount error for column '${i.field}':`, R);
1430
1442
  }
1431
1443
  else
1432
1444
  this.grid.dispatchEvent(
1433
- new CustomEvent("mount-external-editor", { detail: { placeholder: u, spec: v, context: h } })
1445
+ new CustomEvent("mount-external-editor", { detail: { placeholder: u, spec: w, context: h } })
1434
1446
  );
1435
1447
  }
1436
1448
  }
1437
1449
  /**
1438
1450
  * Render a template-based editor.
1439
1451
  */
1440
- #R(e, t, i, n, s, r, l, c) {
1452
+ #R(e, t, i, r, s, n, l, c) {
1441
1453
  const a = t.__editorTemplate;
1442
1454
  if (!a) return;
1443
1455
  const d = a.cloneNode(!0), g = t.__compiledEditor;
1444
1456
  g ? d.innerHTML = g({
1445
1457
  row: i,
1446
- value: n,
1458
+ value: r,
1447
1459
  field: t.field,
1448
1460
  column: t,
1449
1461
  commit: s,
1450
- cancel: r
1462
+ cancel: n
1451
1463
  }) : d.querySelectorAll("*").forEach((E) => {
1452
- E.childNodes.length === 1 && E.firstChild?.nodeType === Node.TEXT_NODE && (E.textContent = E.textContent?.replace(/{{\s*value\s*}}/g, n == null ? "" : String(n)).replace(/{{\s*row\.([a-zA-Z0-9_]+)\s*}}/g, (p, m) => {
1464
+ E.childNodes.length === 1 && E.firstChild?.nodeType === Node.TEXT_NODE && (E.textContent = E.textContent?.replace(/{{\s*value\s*}}/g, r == null ? "" : String(r)).replace(/{{\s*row\.([a-zA-Z0-9_]+)\s*}}/g, (p, m) => {
1453
1465
  if (!S(m)) return "";
1454
1466
  const y = i[m];
1455
1467
  return y == null ? "" : String(y);
@@ -1459,21 +1471,21 @@ class X extends D {
1459
1471
  "input,textarea,select"
1460
1472
  );
1461
1473
  if (f) {
1462
- f instanceof HTMLInputElement && f.type === "checkbox" ? f.checked = !!n : f.value = String(n ?? "");
1474
+ f instanceof HTMLInputElement && f.type === "checkbox" ? f.checked = !!r : f.value = String(r ?? "");
1463
1475
  let E = !1;
1464
1476
  f.addEventListener("blur", () => {
1465
- E || s(_(f, t, n));
1477
+ E || s(_(f, t, r));
1466
1478
  }), f.addEventListener("keydown", (p) => {
1467
1479
  const m = p;
1468
1480
  if (m.key === "Enter") {
1469
1481
  if (this.config.onBeforeEditClose && this.config.onBeforeEditClose(m) === !1)
1470
1482
  return;
1471
- m.stopPropagation(), m.preventDefault(), E = !0, s(_(f, t, n)), this.#s(c, !1);
1483
+ m.stopPropagation(), m.preventDefault(), E = !0, s(_(f, t, r)), this.#s(c, !1);
1472
1484
  }
1473
1485
  if (m.key === "Escape") {
1474
1486
  if (this.config.onBeforeEditClose && this.config.onBeforeEditClose(m) === !1)
1475
1487
  return;
1476
- m.stopPropagation(), m.preventDefault(), r(), this.#s(c, !0);
1488
+ m.stopPropagation(), m.preventDefault(), n(), this.#s(c, !0);
1477
1489
  }
1478
1490
  }), f instanceof HTMLInputElement && f.type === "checkbox" && f.addEventListener("change", () => s(f.checked)), l || setTimeout(() => f.focus({ preventScroll: !0 }), 0);
1479
1491
  }
@@ -1485,24 +1497,24 @@ class X extends D {
1485
1497
  */
1486
1498
  #_(e, t) {
1487
1499
  if (!e) return !1;
1488
- const i = e, n = t, s = /* @__PURE__ */ new Set([...Object.keys(i), ...Object.keys(n)]);
1489
- for (const r of s)
1490
- if (i[r] !== n[r])
1500
+ const i = e, r = t, s = /* @__PURE__ */ new Set([...Object.keys(i), ...Object.keys(r)]);
1501
+ for (const n of s)
1502
+ if (i[n] !== r[n])
1491
1503
  return !0;
1492
1504
  return !1;
1493
1505
  }
1494
1506
  /**
1495
1507
  * Restore focus to cell after exiting edit mode.
1496
1508
  */
1497
- #w(e) {
1509
+ #v(e) {
1498
1510
  queueMicrotask(() => {
1499
1511
  try {
1500
- const t = e._focusRow, i = e._focusCol, n = e.findRenderedRowElement?.(t);
1501
- if (n) {
1512
+ const t = e._focusRow, i = e._focusCol, r = e.findRenderedRowElement?.(t);
1513
+ if (r) {
1502
1514
  Array.from(e._bodyEl.querySelectorAll(".cell-focus")).forEach(
1503
- (r) => r.classList.remove("cell-focus")
1515
+ (n) => n.classList.remove("cell-focus")
1504
1516
  );
1505
- const s = n.querySelector(`.cell[data-row="${t}"][data-col="${i}"]`);
1517
+ const s = r.querySelector(`.cell[data-row="${t}"][data-col="${i}"]`);
1506
1518
  s && (s.classList.add("cell-focus"), s.setAttribute("aria-selected", "true"), s.hasAttribute("tabindex") || s.setAttribute("tabindex", "-1"), s.focus({ preventScroll: !0 }));
1507
1519
  }
1508
1520
  } catch {
@@ -1513,6 +1525,6 @@ class X extends D {
1513
1525
  }
1514
1526
  export {
1515
1527
  X as EditingPlugin,
1516
- j as defaultEditorFor
1528
+ K as defaultEditorFor
1517
1529
  };
1518
1530
  //# sourceMappingURL=index.js.map