@iyulab/flex-table 0.10.0

package/dist/flex-table-C0CCHc1F.js

@@ -0,0 +1,2137 @@
+import { css as W, html as u, LitElement as T, nothing as k } from "lit";
+import { property as w, state as C, customElement as M } from "lit/decorators.js";
+const K = W`
+  /* --- Theme Variables (Light defaults) --- */
+  :host {
+    --ft-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+    --ft-font-size: 14px;
+    --ft-border-color: #e0e0e0;
+    --ft-bg: #fff;
+    --ft-text-color: #202124;
+    --ft-header-bg: #f8f9fa;
+    --ft-header-hover-bg: #e8eaed;
+    --ft-header-text-color: #202124;
+    --ft-row-even-bg: #fff;
+    --ft-row-odd-bg: #fafafa;
+    --ft-row-hover-bg: #f0f4ff;
+    --ft-active-color: #1a73e8;
+    --ft-selection-bg: #e8f0fe;
+    --ft-bool-color: #2196f3;
+    --ft-sort-indicator-color: #5f6368;
+    --ft-editor-bg: #fff;
+    --ft-empty-color: #999;
+  }
+
+  /* --- Dark Theme (auto via prefers-color-scheme) --- */
+  @media (prefers-color-scheme: dark) {
+    :host(:not([theme="light"])) {
+      --ft-border-color: #3c4043;
+      --ft-bg: #1e1e1e;
+      --ft-text-color: #e8eaed;
+      --ft-header-bg: #292a2d;
+      --ft-header-hover-bg: #3c4043;
+      --ft-header-text-color: #e8eaed;
+      --ft-row-even-bg: #1e1e1e;
+      --ft-row-odd-bg: #252526;
+      --ft-row-hover-bg: #2a2d2e;
+      --ft-active-color: #4da3ff;
+      --ft-selection-bg: #264f78;
+      --ft-bool-color: #64b5f6;
+      --ft-sort-indicator-color: #9aa0a6;
+      --ft-editor-bg: #2d2d2d;
+      --ft-empty-color: #9aa0a6;
+    }
+  }
+
+  /* --- Force dark via attribute --- */
+  :host([theme="dark"]) {
+    --ft-border-color: #3c4043;
+    --ft-bg: #1e1e1e;
+    --ft-text-color: #e8eaed;
+    --ft-header-bg: #292a2d;
+    --ft-header-hover-bg: #3c4043;
+    --ft-header-text-color: #e8eaed;
+    --ft-row-even-bg: #1e1e1e;
+    --ft-row-odd-bg: #252526;
+    --ft-row-hover-bg: #2a2d2e;
+    --ft-active-color: #4da3ff;
+    --ft-selection-bg: #264f78;
+    --ft-bool-color: #64b5f6;
+    --ft-sort-indicator-color: #9aa0a6;
+    --ft-editor-bg: #2d2d2d;
+    --ft-empty-color: #9aa0a6;
+  }
+
+  /* --- Layout --- */
+  :host {
+    display: block;
+    position: relative;
+    overflow: auto;
+    font-family: var(--ft-font-family);
+    font-size: var(--ft-font-size);
+    color: var(--ft-text-color);
+    background: var(--ft-bg);
+    border: 1px solid var(--ft-border-color);
+    outline: none;
+  }
+
+  .ft-header {
+    display: block;
+    position: sticky;
+    top: 0;
+    z-index: 3;
+  }
+
+  .ft-header-cell {
+    position: absolute;
+    top: 0;
+    padding: 8px 12px;
+    background: var(--ft-header-bg);
+    color: var(--ft-header-text-color);
+    font-weight: 600;
+    user-select: none;
+    border-bottom: 2px solid var(--ft-border-color);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    box-sizing: border-box;
+    display: flex;
+    align-items: center;
+    gap: 4px;
+  }
+
+  .ft-header-cell.ft-sortable { cursor: pointer; }
+  .ft-header-cell.ft-sortable:hover { background: var(--ft-header-hover-bg); }
+
+  .ft-resize-handle {
+    position: absolute;
+    right: 0; top: 0; bottom: 0;
+    width: 6px;
+    cursor: col-resize;
+    z-index: 3;
+  }
+
+  .ft-resize-handle:hover,
+  .ft-resize-handle.ft-resizing {
+    background: var(--ft-active-color);
+    opacity: 0.3;
+  }
+
+  .ft-sort-indicator {
+    flex-shrink: 0;
+    font-size: 12px;
+    color: var(--ft-sort-indicator-color);
+  }
+
+  .ft-sort-order {
+    font-size: 10px;
+    color: var(--ft-sort-indicator-color);
+  }
+
+  .ft-body { position: relative; }
+
+  .ft-row {
+    display: block;
+    position: absolute;
+    left: 0;
+  }
+
+  .ft-cell {
+    position: absolute;
+    top: 0;
+    padding: 6px 12px;
+    border-bottom: 1px solid var(--ft-border-color);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    box-sizing: border-box;
+    cursor: default;
+  }
+
+  .ft-row-even .ft-cell { background: var(--ft-row-even-bg); }
+  .ft-row-odd .ft-cell { background: var(--ft-row-odd-bg); }
+  .ft-row:hover .ft-cell { background: var(--ft-row-hover-bg); }
+
+  .ft-cell.ft-active {
+    outline: 2px solid var(--ft-active-color);
+    outline-offset: -2px;
+    z-index: 1;
+  }
+
+  .ft-cell.ft-selected {
+    background: var(--ft-selection-bg) !important;
+  }
+
+  .ft-cell.ft-invalid {
+    outline: 2px solid #d93025;
+    outline-offset: -2px;
+    background: rgba(217, 48, 37, 0.08);
+  }
+
+  .ft-cell.ft-editing { padding: 0; overflow: visible; }
+
+  .ft-editor {
+    width: 100%; height: 100%;
+    border: none; outline: none;
+    padding: 6px 12px;
+    font: inherit;
+    color: var(--ft-text-color);
+    background: var(--ft-editor-bg);
+    box-sizing: border-box;
+  }
+  .ft-editor:focus {
+    outline: 2px solid var(--ft-active-color);
+    outline-offset: -2px;
+  }
+
+  .ft-editor-number { text-align: right; }
+
+  .ft-cell.ft-type-number {
+    text-align: right;
+    font-variant-numeric: tabular-nums;
+  }
+
+  .ft-cell.ft-type-boolean { text-align: center; }
+  .ft-bool { color: var(--ft-bool-color); }
+
+  .ft-empty {
+    padding: 24px;
+    text-align: center;
+    color: var(--ft-empty-color);
+  }
+
+  .ft-row-num-header,
+  .ft-row-num {
+    position: absolute;
+    top: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: var(--ft-sort-indicator-color);
+    font-size: 12px;
+    padding: 6px 4px;
+    box-sizing: border-box;
+    user-select: none;
+  }
+
+  .ft-row-num-header {
+    background: var(--ft-header-bg);
+    font-weight: 600;
+    border-bottom: 2px solid var(--ft-border-color);
+    padding: 8px 4px;
+  }
+
+  .ft-row-num {
+    border-bottom: 1px solid var(--ft-border-color);
+    cursor: pointer;
+    background: var(--ft-row-even-bg);
+  }
+
+  .ft-row-odd .ft-row-num { background: var(--ft-row-odd-bg); }
+  .ft-row:hover .ft-row-num { background: var(--ft-row-hover-bg); }
+
+  .ft-row-num:hover {
+    background: var(--ft-header-hover-bg);
+  }
+
+  /* --- Pinned Columns --- */
+
+  .ft-pinned {
+    background: var(--ft-bg);
+  }
+
+  .ft-header-cell.ft-pinned {
+    background: var(--ft-header-bg);
+  }
+
+  .ft-row-even .ft-cell.ft-pinned { background: var(--ft-row-even-bg); }
+  .ft-row-odd .ft-cell.ft-pinned { background: var(--ft-row-odd-bg); }
+  .ft-row:hover .ft-cell.ft-pinned { background: var(--ft-row-hover-bg); }
+  .ft-cell.ft-pinned.ft-selected { background: var(--ft-selection-bg) !important; }
+
+  /* --- Filter UI --- */
+
+  .ft-filter-btn {
+    all: unset;
+    cursor: pointer;
+    font-size: 10px;
+    color: var(--ft-sort-indicator-color);
+    padding: 0 2px;
+    margin-left: auto;
+    opacity: 0.7;
+    flex-shrink: 0;
+  }
+
+  .ft-filter-btn:hover { opacity: 1; }
+
+  .ft-filter-btn.ft-filter-active {
+    color: var(--ft-active-color);
+    opacity: 1;
+  }
+
+  .ft-filter-dropdown {
+    position: absolute;
+    top: 100%;
+    left: 0;
+    min-width: 160px;
+    background: var(--ft-bg);
+    border: 1px solid var(--ft-border-color);
+    border-radius: 4px;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+    padding: 8px;
+    z-index: 10;
+    box-sizing: border-box;
+  }
+
+  .ft-filter-input {
+    width: 100%;
+    padding: 4px 8px;
+    font: inherit;
+    font-size: 13px;
+    border: 1px solid var(--ft-border-color);
+    border-radius: 3px;
+    color: var(--ft-text-color);
+    background: var(--ft-editor-bg);
+    box-sizing: border-box;
+  }
+
+  .ft-filter-input:focus {
+    outline: 1px solid var(--ft-active-color);
+  }
+
+  .ft-filter-range {
+    display: flex;
+    gap: 4px;
+  }
+
+  .ft-filter-range .ft-filter-input {
+    width: 50%;
+  }
+
+  .ft-filter-actions {
+    margin-top: 6px;
+    text-align: right;
+  }
+
+  .ft-filter-clear {
+    all: unset;
+    cursor: pointer;
+    font-size: 12px;
+    color: var(--ft-sort-indicator-color);
+    padding: 2px 8px;
+    border-radius: 3px;
+  }
+
+  .ft-filter-clear:hover {
+    background: var(--ft-header-hover-bg);
+    color: var(--ft-text-color);
+  }
+
+  /* --- Row Selection (Checkbox) --- */
+
+  .ft-checkbox-header,
+  .ft-checkbox-cell {
+    position: absolute;
+    top: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 0 4px;
+    box-sizing: border-box;
+    user-select: none;
+  }
+
+  .ft-checkbox-header {
+    background: var(--ft-header-bg);
+    border-bottom: 2px solid var(--ft-border-color);
+  }
+
+  .ft-checkbox-cell {
+    border-bottom: 1px solid var(--ft-border-color);
+    background: var(--ft-row-even-bg);
+  }
+
+  .ft-row-odd .ft-checkbox-cell { background: var(--ft-row-odd-bg); }
+  .ft-row:hover .ft-checkbox-cell { background: var(--ft-row-hover-bg); }
+  .ft-row-selected .ft-checkbox-cell { background: var(--ft-selection-bg); }
+  .ft-row-selected .ft-cell { background: var(--ft-selection-bg) !important; }
+  .ft-row-selected .ft-row-num { background: var(--ft-selection-bg); }
+
+  .ft-checkbox-header input[type="checkbox"],
+  .ft-checkbox-cell input[type="checkbox"] {
+    width: 16px;
+    height: 16px;
+    cursor: pointer;
+    accent-color: var(--ft-active-color);
+  }
+
+  /* --- Footer Row --- */
+
+  .ft-footer {
+    display: block;
+    position: sticky;
+    bottom: 0;
+    z-index: 2;
+    background: var(--ft-header-bg);
+    border-top: 2px solid var(--ft-border-color);
+  }
+
+  .ft-footer-cell {
+    position: absolute;
+    top: 0;
+    padding: 6px 12px;
+    font-weight: 600;
+    font-size: 13px;
+    color: var(--ft-header-text-color);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    box-sizing: border-box;
+  }
+`;
+function H(t, e, i) {
+  return i.renderer ? i.renderer(t, e, i) : q(t, i);
+}
+function q(t, e) {
+  if (t == null) return "";
+  switch (e.type) {
+    case "number":
+      return I(t);
+    case "boolean":
+      return u`<span class="ft-bool">${t ? "✔" : ""}</span>`;
+    case "date":
+      return P(t);
+    case "datetime":
+      return V(t);
+    default:
+      return String(t);
+  }
+}
+function I(t) {
+  return typeof t == "number" ? Number.isInteger(t) ? t.toLocaleString() : t.toLocaleString(void 0, { minimumFractionDigits: 1 }) : String(t);
+}
+function P(t) {
+  if (t instanceof Date) return t.toLocaleDateString();
+  if (typeof t == "string") {
+    const e = new Date(t);
+    return isNaN(e.getTime()) ? t : e.toLocaleDateString();
+  }
+  return String(t);
+}
+function V(t) {
+  if (t instanceof Date) return t.toLocaleString();
+  if (typeof t == "string") {
+    const e = new Date(t);
+    return isNaN(e.getTime()) ? t : e.toLocaleString();
+  }
+  return String(t);
+}
+function O(t) {
+  return {
+    startRow: Math.min(t.startRow, t.endRow),
+    startCol: Math.min(t.startCol, t.endCol),
+    endRow: Math.max(t.startRow, t.endRow),
+    endCol: Math.max(t.startCol, t.endCol)
+  };
+}
+class j {
+  constructor() {
+    this.activeCell = null, this.rangeAnchor = null, this.range = null, this._rowCount = 0, this._colCount = 0;
+  }
+  setDimensions(e, i) {
+    this._rowCount = e, this._colCount = i;
+  }
+  setActive(e, i) {
+    return e < 0 || e >= this._rowCount || i < 0 || i >= this._colCount ? this.activeCell : (this.activeCell = { row: e, col: i }, this.rangeAnchor = null, this.range = null, this.activeCell);
+  }
+  /** Set active cell and extend range from anchor */
+  setActiveWithRange(e, i) {
+    return e < 0 || e >= this._rowCount || i < 0 || i >= this._colCount ? this.activeCell : (!this.rangeAnchor && this.activeCell && (this.rangeAnchor = { ...this.activeCell }), this.activeCell = { row: e, col: i }, this.rangeAnchor && (this.range = O({
+      startRow: this.rangeAnchor.row,
+      startCol: this.rangeAnchor.col,
+      endRow: e,
+      endCol: i
+    })), this.activeCell);
+  }
+  /** Check if a cell is within the current selection range */
+  isInRange(e, i) {
+    if (!this.range) return !1;
+    const s = this.range;
+    return e >= s.startRow && e <= s.endRow && i >= s.startCol && i <= s.endCol;
+  }
+  /** Get the effective range: either the explicit range or just the active cell */
+  getEffectiveRange() {
+    return this.range ? this.range : this.activeCell ? {
+      startRow: this.activeCell.row,
+      startCol: this.activeCell.col,
+      endRow: this.activeCell.row,
+      endCol: this.activeCell.col
+    } : null;
+  }
+  clear() {
+    this.activeCell = null, this.rangeAnchor = null, this.range = null;
+  }
+  moveUp() {
+    return this.activeCell ? this.setActive(this.activeCell.row - 1, this.activeCell.col) : null;
+  }
+  moveDown() {
+    return this.activeCell ? this.setActive(this.activeCell.row + 1, this.activeCell.col) : null;
+  }
+  moveLeft() {
+    return this.activeCell ? this.setActive(this.activeCell.row, this.activeCell.col - 1) : null;
+  }
+  moveRight() {
+    return this.activeCell ? this.setActive(this.activeCell.row, this.activeCell.col + 1) : null;
+  }
+  moveNext() {
+    if (!this.activeCell) return null;
+    let { row: e, col: i } = this.activeCell;
+    return i++, i >= this._colCount && (i = 0, e++), e >= this._rowCount ? this.activeCell : this.setActive(e, i);
+  }
+  movePrev() {
+    if (!this.activeCell) return null;
+    let { row: e, col: i } = this.activeCell;
+    return i--, i < 0 && (i = this._colCount - 1, e--), e < 0 ? this.activeCell : this.setActive(e, i);
+  }
+  moveToStart() {
+    return this.setActive(0, 0);
+  }
+  moveToEnd() {
+    return this.setActive(this._rowCount - 1, this._colCount - 1);
+  }
+  moveToRowStart() {
+    return this.activeCell ? this.setActive(this.activeCell.row, 0) : null;
+  }
+  moveToRowEnd() {
+    return this.activeCell ? this.setActive(this.activeCell.row, this._colCount - 1) : null;
+  }
+  // Shift variants for range selection
+  shiftMoveUp() {
+    return this.activeCell ? this.setActiveWithRange(this.activeCell.row - 1, this.activeCell.col) : null;
+  }
+  shiftMoveDown() {
+    return this.activeCell ? this.setActiveWithRange(this.activeCell.row + 1, this.activeCell.col) : null;
+  }
+  shiftMoveLeft() {
+    return this.activeCell ? this.setActiveWithRange(this.activeCell.row, this.activeCell.col - 1) : null;
+  }
+  shiftMoveRight() {
+    return this.activeCell ? this.setActiveWithRange(this.activeCell.row, this.activeCell.col + 1) : null;
+  }
+}
+class B {
+  constructor() {
+    this.current = null;
+  }
+  start(e, i) {
+    this.current = { position: e, originalValue: i };
+  }
+  isEditing(e, i) {
+    return this.current !== null && this.current.position.row === e && this.current.position.col === i;
+  }
+  cancel() {
+    const e = this.current;
+    return this.current = null, e;
+  }
+  commit() {
+    const e = this.current;
+    return this.current = null, e;
+  }
+}
+class X {
+  constructor() {
+    this._selected = /* @__PURE__ */ new Set(), this._mode = "multi", this._rowCount = 0;
+  }
+  get mode() {
+    return this._mode;
+  }
+  set mode(e) {
+    if (this._mode = e, e === "single" && this._selected.size > 1) {
+      const i = this._selected.values().next().value;
+      this._selected.clear(), i !== void 0 && this._selected.add(i);
+    }
+  }
+  setRowCount(e) {
+    this._rowCount = e;
+    for (const i of this._selected)
+      i >= e && this._selected.delete(i);
+  }
+  get selectedIndices() {
+    return [...this._selected].sort((e, i) => e - i);
+  }
+  get selectedCount() {
+    return this._selected.size;
+  }
+  get isAllSelected() {
+    return this._rowCount > 0 && this._selected.size === this._rowCount;
+  }
+  get isSomeSelected() {
+    return this._selected.size > 0 && this._selected.size < this._rowCount;
+  }
+  isSelected(e) {
+    return this._selected.has(e);
+  }
+  toggle(e) {
+    this._mode === "single" ? this._selected.has(e) ? this._selected.clear() : (this._selected.clear(), this._selected.add(e)) : this._selected.has(e) ? this._selected.delete(e) : this._selected.add(e);
+  }
+  select(e) {
+    this._mode === "single" && this._selected.clear(), this._selected.add(e);
+  }
+  deselect(e) {
+    this._selected.delete(e);
+  }
+  selectAll() {
+    if (this._mode !== "single") {
+      this._selected.clear();
+      for (let e = 0; e < this._rowCount; e++)
+        this._selected.add(e);
+    }
+  }
+  deselectAll() {
+    this._selected.clear();
+  }
+}
+function Y(t, e, i) {
+  const s = Array.from({ length: t.length }, (r, n) => n);
+  if (e.length === 0) return s;
+  const o = /* @__PURE__ */ new Map();
+  for (const r of i)
+    o.set(r.key, r.type ?? "text");
+  return s.sort((r, n) => {
+    for (const { key: l, direction: a } of e) {
+      const d = t[r][l], f = t[n][l], h = d == null, g = f == null;
+      if (h && g) continue;
+      if (h) return 1;
+      if (g) return -1;
+      const p = J(d, f, o.get(l) ?? "text");
+      if (p !== 0)
+        return a === "asc" ? p : -p;
+    }
+    return r - n;
+  }), s;
+}
+function J(t, e, i) {
+  switch (i) {
+    case "number": {
+      const s = Number(t), o = Number(e);
+      return isNaN(s) && isNaN(o) ? 0 : isNaN(s) ? 1 : isNaN(o) ? -1 : s - o;
+    }
+    case "boolean":
+      return (t ? 1 : 0) - (e ? 1 : 0);
+    case "date":
+    case "datetime": {
+      const s = new Date(t).getTime(), o = new Date(e).getTime();
+      return (isNaN(s) ? 0 : s) - (isNaN(o) ? 0 : o);
+    }
+    default:
+      return String(t).localeCompare(String(e));
+  }
+}
+function G(t, e, i) {
+  const s = t.find((o) => o.key === e);
+  return i ? s ? s.direction === "asc" ? t.map((o) => o.key === e ? { ...o, direction: "desc" } : o) : t.filter((o) => o.key !== e) : [...t, { key: e, direction: "asc" }] : s ? s.direction === "asc" ? [{ key: e, direction: "desc" }] : [] : [{ key: e, direction: "asc" }];
+}
+function Q(t, e, i) {
+  if (e.length === 0)
+    return Array.from({ length: t.length }, (o, r) => r);
+  const s = [];
+  for (let o = 0; o < t.length; o++) {
+    const r = t[o];
+    let n = !0;
+    for (const l of e)
+      try {
+        if (!l.predicate(r[l.key], r)) {
+          n = !1;
+          break;
+        }
+      } catch (a) {
+        console.warn('Filter predicate error for key "%s":', l.key, a), i && i(a, r, l);
+      }
+    n && s.push(o);
+  }
+  return s;
+}
+const Z = 100;
+class tt {
+  constructor() {
+    this._undoStack = [], this._redoStack = [], this._maxSize = Z;
+  }
+  /** Get/set the maximum number of undo actions stored. */
+  get maxSize() {
+    return this._maxSize;
+  }
+  set maxSize(e) {
+    for (this._maxSize = Math.max(1, e); this._undoStack.length > this._maxSize; )
+      this._undoStack.shift();
+  }
+  get canUndo() {
+    return this._undoStack.length > 0;
+  }
+  get canRedo() {
+    return this._redoStack.length > 0;
+  }
+  get undoCount() {
+    return this._undoStack.length;
+  }
+  get redoCount() {
+    return this._redoStack.length;
+  }
+  /**
+   * Push a new action onto the undo stack.
+   * Clears the redo stack (new action invalidates redo history).
+   */
+  push(e) {
+    this._undoStack.push(e), this._undoStack.length > this._maxSize && this._undoStack.shift(), this._redoStack.length = 0;
+  }
+  /**
+   * Undo the most recent action.
+   * Returns the action label, or null if nothing to undo.
+   */
+  undo() {
+    const e = this._undoStack.pop();
+    return e ? (e.undo(), this._redoStack.push(e), e.label) : null;
+  }
+  /**
+   * Redo the most recently undone action.
+   * Returns the action label, or null if nothing to redo.
+   */
+  redo() {
+    const e = this._redoStack.pop();
+    return e ? (e.redo(), this._undoStack.push(e), e.label) : null;
+  }
+  /**
+   * Clear all undo/redo history.
+   */
+  clear() {
+    this._undoStack.length = 0, this._redoStack.length = 0;
+  }
+}
+function et(t, e, i) {
+  const s = [];
+  for (let o = i.startRow; o <= i.endRow; o++) {
+    const r = t[o], n = [];
+    for (let l = i.startCol; l <= i.endCol; l++) {
+      const a = e[l], d = r[a.key];
+      n.push(d == null ? "" : String(d));
+    }
+    s.push(n.join("	"));
+  }
+  return s.join(`
+`);
+}
+function it(t) {
+  const e = t.replace(/\r\n/g, `
+`).replace(/\r/g, `
+`), i = [];
+  let s = [], o = 0;
+  const r = e.length;
+  for (; o <= r; ) {
+    if (o === r) {
+      (s.length > 0 || i.length > 0) && i.push(s);
+      break;
+    }
+    if (e[o] === '"') {
+      let l = "";
+      for (o++; o < r; )
+        if (e[o] === '"')
+          if (o + 1 < r && e[o + 1] === '"')
+            l += '"', o += 2;
+          else {
+            o++;
+            break;
+          }
+        else
+          l += e[o], o++;
+      s.push(l), o < r && e[o] === "	" ? o++ : o < r && e[o] === `
+` && (i.push(s), s = [], o++);
+    } else {
+      let l = "";
+      for (; o < r && e[o] !== "	" && e[o] !== `
+`; )
+        l += e[o], o++;
+      s.push(l), o < r && e[o] === "	" ? o++ : o < r && e[o] === `
+` && (i.push(s), s = [], o++);
+    }
+  }
+  for (; i.length > 0; ) {
+    const n = i[i.length - 1];
+    if (n.length === 0 || n.length === 1 && n[0] === "")
+      i.pop();
+    else
+      break;
+  }
+  return i;
+}
+function A(t, e) {
+  if (t === "") return null;
+  switch (e.type) {
+    case "number": {
+      const i = Number(t);
+      return isNaN(i) ? t : i;
+    }
+    case "boolean":
+      return t.toLowerCase() === "true" || t === "1";
+    default:
+      return t;
+  }
+}
+function z(t, e, i) {
+  switch (i) {
+    case "csv":
+      return U(t, e, ",");
+    case "tsv":
+      return U(t, e, "	");
+    case "json":
+      return ot(t, e);
+  }
+}
+function st(t, e) {
+  return t == null ? "" : (e.type === "date" || e.type === "datetime") && t instanceof Date ? t.toISOString() : String(t);
+}
+function U(t, e, i) {
+  const s = e.map((r) => L(r.header, i)).join(i), o = t.map(
+    (r) => e.map((n) => {
+      const l = st(r[n.key], n);
+      return L(l, i);
+    }).join(i)
+  );
+  return [s, ...o].join(`
+`);
+}
+function L(t, e) {
+  return t.includes(e) || t.includes('"') || t.includes(`
+`) || t.includes("\r") ? '"' + t.replace(/"/g, '""') + '"' : t;
+}
+function ot(t, e) {
+  const i = t.map((s) => {
+    const o = {};
+    for (const r of e) {
+      const n = s[r.key];
+      (r.type === "date" || r.type === "datetime") && n instanceof Date ? o[r.key] = n.toISOString() : o[r.key] = n ?? null;
+    }
+    return o;
+  });
+  return JSON.stringify(i, null, 2);
+}
+function rt(t, e, i) {
+  const s = new Blob([t], { type: i }), o = URL.createObjectURL(s), r = document.createElement("a");
+  r.href = o, r.download = e, r.style.display = "none", document.body.appendChild(r), r.click(), document.body.removeChild(r), setTimeout(() => URL.revokeObjectURL(o), 100);
+}
+const nt = {
+  csv: "text/csv;charset=utf-8",
+  tsv: "text/tab-separated-values;charset=utf-8",
+  json: "application/json;charset=utf-8"
+}, lt = {
+  csv: ".csv",
+  tsv: ".tsv",
+  json: ".json"
+};
+function at(t) {
+  return nt[t];
+}
+function ct(t) {
+  return lt[t];
+}
+var ht = Object.defineProperty, dt = Object.getOwnPropertyDescriptor, v = (t, e, i, s) => {
+  for (var o = s > 1 ? void 0 : s ? dt(e, i) : e, r = t.length - 1, n; r >= 0; r--)
+    (n = t[r]) && (o = (s ? n(e, i, o) : n(o)) || o);
+  return s && o && ht(e, i, o), o;
+};
+const S = 120, E = 40, ut = 32, $ = 5;
+let _ = class extends T {
+  constructor() {
+    super(...arguments), this.columns = [], this.data = [], this.rowHeight = ut, this.showRowNumbers = !1, this.theme = void 0, this.maxRows = 0, this.editable = !0, this.showFilters = !1, this.selectable = !1, this.dataMode = "client", this.footerData = null, this._scrollTop = 0, this._scrollLeft = 0, this._viewportHeight = 0, this._viewportWidth = 0, this._colLeftOffsets = [], this._totalRowWidth = 0, this._activeCell = null, this._editingCell = null, this._sortCriteria = [], this._selection = new j(), this._editing = new B(), this._rowSelection = new X(), this._undo = new tt(), this._filters = [], this._filteredIndices = [], this._sortedIndices = [], this._openFilterKey = null, this._rowSelectionVersion = 0, this._viewDirty = !0, this._resizing = null, this._resizeCleanup = null, this._columnWidths = /* @__PURE__ */ new Map(), this._invalidCells = /* @__PURE__ */ new Map(), this._textFilterState = /* @__PURE__ */ new Map(), this._numberFilterState = /* @__PURE__ */ new Map(), this._dateFilterState = /* @__PURE__ */ new Map();
+  }
+  set selectionMode(t) {
+    this._rowSelection.mode = t, this.requestUpdate();
+  }
+  get selectionMode() {
+    return this._rowSelection.mode;
+  }
+  set maxUndoSize(t) {
+    this._undo.maxSize = t;
+  }
+  get maxUndoSize() {
+    return this._undo.maxSize;
+  }
+  get visibleColumns() {
+    return this.columns.filter((t) => !t.hidden);
+  }
+  get _prefixWidth() {
+    let t = 0;
+    return this.selectable && (t += 36), this.showRowNumbers && (t += 48), t;
+  }
+  /** Whether an undo operation is available. */
+  get canUndo() {
+    return this._undo.canUndo;
+  }
+  /** Whether a redo operation is available. */
+  get canRedo() {
+    return this._undo.canRedo;
+  }
+  get activeCell() {
+    return this._activeCell;
+  }
+  get editingCell() {
+    return this._editingCell;
+  }
+  get sortCriteria() {
+    return [...this._sortCriteria];
+  }
+  /** Number of rows after filtering (before pagination). */
+  get filteredRowCount() {
+    return this._filteredIndices.length;
+  }
+  // --- Public API: Row Selection ---
+  /** Get data indices of currently selected rows. */
+  getSelectedRows() {
+    const t = this._rowSelection.selectedIndices.map((e) => this._toDataIndex(e)).filter((e) => e >= 0 && e < this.data.length);
+    return {
+      selectedIndices: t,
+      selectedRows: t.map((e) => this.data[e])
+    };
+  }
+  /** Select all visible rows (multi mode only). */
+  selectAll() {
+    this.selectable && (this._rowSelection.selectAll(), this._rowSelectionVersion++, this._dispatchRowSelectionEvent());
+  }
+  /** Deselect all rows. */
+  deselectAll() {
+    this.selectable && (this._rowSelection.deselectAll(), this._rowSelectionVersion++, this._dispatchRowSelectionEvent());
+  }
+  _dispatchRowSelectionEvent() {
+    const { selectedIndices: t, selectedRows: e } = this.getSelectedRows();
+    this.dispatchEvent(new CustomEvent("selection-change", {
+      detail: { selectedIndices: t, selectedRows: e },
+      bubbles: !0,
+      composed: !0
+    }));
+  }
+  // --- Public API: Filtering ---
+  /**
+   * Set a filter for a column. Replaces any existing filter on the same key.
+   */
+  setFilter(t, e) {
+    this._filters = this._filters.filter((i) => i.key !== t), this._filters.push({ key: t, predicate: e }), this._recomputeView(), this.requestUpdate(), this._dispatchFilterEvent();
+  }
+  /**
+   * Remove the filter for a column.
+   */
+  removeFilter(t) {
+    const e = this._filters.length;
+    this._filters = this._filters.filter((i) => i.key !== t), this._filters.length !== e && (this._recomputeView(), this.requestUpdate(), this._dispatchFilterEvent());
+  }
+  /**
+   * Remove all filters.
+   */
+  clearFilters() {
+    this._filters.length !== 0 && (this._filters = [], this._recomputeView(), this.requestUpdate(), this._dispatchFilterEvent());
+  }
+  /**
+   * Get current active filter keys.
+   */
+  get filterKeys() {
+    return this._filters.map((t) => t.key);
+  }
+  /**
+   * Explicitly request a re-render after external data mutations.
+   * Useful when `data` array contents are mutated in-place without reassignment.
+   */
+  refreshData() {
+    this.requestUpdate("data");
+  }
+  _dispatchUndoStateEvent() {
+    this.dispatchEvent(new CustomEvent("undo-state-change", {
+      detail: { canUndo: this.canUndo, canRedo: this.canRedo },
+      bubbles: !0,
+      composed: !0
+    }));
+  }
+  _dispatchFilterEvent() {
+    this.dispatchEvent(new CustomEvent("filter-change", {
+      detail: { keys: this.filterKeys, filteredCount: this.filteredRowCount },
+      bubbles: !0,
+      composed: !0
+    }));
+  }
+  // --- Public API: Column Operations ---
+  /**
+   * Add a column at the specified index (default: end).
+   * Returns the added column definition.
+   */
+  addColumn(t, e) {
+    const i = e ?? this.columns.length;
+    return this.columns = [
+      ...this.columns.slice(0, i),
+      t,
+      ...this.columns.slice(i)
+    ], this._undo.push({
+      label: "column-add",
+      undo: () => {
+        this.columns = this.columns.filter((s) => s !== t), this.requestUpdate();
+      },
+      redo: () => {
+        this.columns = [
+          ...this.columns.slice(0, i),
+          t,
+          ...this.columns.slice(i)
+        ], this.requestUpdate();
+      }
+    }), this.requestUpdate(), this.dispatchEvent(new CustomEvent("column-add", {
+      detail: { column: t, index: i },
+      bubbles: !0,
+      composed: !0
+    })), this._dispatchUndoStateEvent(), t;
+  }
+  /**
+   * Delete a column by its key.
+   * Removes related filters, sort criteria, and column width overrides.
+   */
+  deleteColumn(t) {
+    const e = this.columns.findIndex((n) => n.key === t);
+    if (e === -1) return;
+    const i = this.columns[e], s = this._filters.find((n) => n.key === t), o = this._sortCriteria.find((n) => n.key === t), r = this._columnWidths.get(t);
+    this._filters = this._filters.filter((n) => n.key !== t), this._sortCriteria = this._sortCriteria.filter((n) => n.key !== t), this._columnWidths.delete(t), this.columns = this.columns.filter((n) => n.key !== t), this._undo.push({
+      label: "column-delete",
+      undo: () => {
+        this.columns = [
+          ...this.columns.slice(0, e),
+          i,
+          ...this.columns.slice(e)
+        ], s && this._filters.push(s), o && (this._sortCriteria = [...this._sortCriteria, o]), r !== void 0 && this._columnWidths.set(t, r), this.requestUpdate();
+      },
+      redo: () => {
+        this._filters = this._filters.filter((n) => n.key !== t), this._sortCriteria = this._sortCriteria.filter((n) => n.key !== t), this._columnWidths.delete(t), this.columns = this.columns.filter((n) => n.key !== t), this.requestUpdate();
+      }
+    }), this._activeCell && this._activeCell.col >= this.visibleColumns.length && (this._selection.clear(), this._activeCell = null), this.requestUpdate(), this.dispatchEvent(new CustomEvent("column-delete", {
+      detail: { column: i, key: t, index: e },
+      bubbles: !0,
+      composed: !0
+    })), this._dispatchUndoStateEvent();
+  }
+  /**
+   * Move a column to a new position.
+   * @param key Column key to move.
+   * @param newIndex Target index in the columns array.
+   */
+  moveColumn(t, e) {
+    const i = this.columns.findIndex((n) => n.key === t);
+    if (i === -1) return;
+    const s = Math.max(0, Math.min(this.columns.length - 1, e));
+    if (i === s) return;
+    const o = this.columns[i], r = [...this.columns];
+    r.splice(i, 1), r.splice(s, 0, o), this.columns = r, this._undo.push({
+      label: "column-reorder",
+      undo: () => {
+        const n = [...this.columns];
+        n.splice(s, 1), n.splice(i, 0, o), this.columns = n, this.requestUpdate();
+      },
+      redo: () => {
+        const n = [...this.columns];
+        n.splice(i, 1), n.splice(s, 0, o), this.columns = n, this.requestUpdate();
+      }
+    }), this.requestUpdate(), this.dispatchEvent(new CustomEvent("column-reorder", {
+      detail: { key: t, oldIndex: i, newIndex: s },
+      bubbles: !0,
+      composed: !0
+    })), this._dispatchUndoStateEvent();
+  }
+  // --- Public API: Row Operations ---
+  /**
+   * Add a row at the specified index (default: end).
+   * Returns the new row.
+   */
+  addRow(t, e) {
+    if (this.maxRows > 0 && this.data.length >= this.maxRows) return null;
+    const i = t ?? this._createEmptyRow(), s = e ?? this.data.length;
+    return this.data.splice(s, 0, i), this._undo.push({
+      label: "row-add",
+      undo: () => {
+        this.data.splice(s, 1), this.requestUpdate();
+      },
+      redo: () => {
+        this.data.splice(s, 0, i), this.requestUpdate();
+      }
+    }), this.requestUpdate(), this.dispatchEvent(new CustomEvent("row-add", {
+      detail: { row: i, index: s },
+      bubbles: !0,
+      composed: !0
+    })), this._dispatchUndoStateEvent(), i;
+  }
+  /**
+   * Delete rows at the specified data indices.
+   * If no indices provided, deletes the currently selected rows.
+   */
+  deleteRows(t) {
+    const e = t ?? this._getSelectedDataRows();
+    if (e.length === 0) return;
+    const i = [...e].sort((o, r) => r - o), s = [];
+    for (const o of i)
+      o >= 0 && o < this.data.length && (s.push({ index: o, row: this.data[o] }), this.data.splice(o, 1));
+    if (s.length !== 0) {
+      if (s.reverse(), this._undo.push({
+        label: "row-delete",
+        undo: () => {
+          for (const { index: o, row: r } of s)
+            this.data.splice(o, 0, r);
+          this.requestUpdate();
+        },
+        redo: () => {
+          const o = [...s].reverse();
+          for (const { index: r } of o)
+            this.data.splice(r, 1);
+          this.requestUpdate();
+        }
+      }), this._activeCell) {
+        const o = this._toDataIndex(this._activeCell.row);
+        e.includes(o) && (this._selection.clear(), this._activeCell = null);
+      }
+      this.requestUpdate(), this.dispatchEvent(new CustomEvent("row-delete", {
+        detail: { indices: s.map((o) => o.index), rows: s.map((o) => o.row) },
+        bubbles: !0,
+        composed: !0
+      })), this._dispatchUndoStateEvent();
+    }
+  }
+  /**
+   * Apply multiple cell changes as a single undo-able operation.
+   * @param changes Array of { row (data index), key, value } objects.
+   */
+  updateRows(t) {
+    if (t.length === 0) return;
+    const e = [];
+    for (const i of t) {
+      if (i.row < 0 || i.row >= this.data.length) continue;
+      const s = this.data[i.row][i.key];
+      this.data[i.row][i.key] = i.value, e.push({ row: i.row, key: i.key, oldValue: s, newValue: i.value });
+    }
+    e.length !== 0 && (this._undo.push({
+      label: "batch-update",
+      undo: () => {
+        for (const i of e)
+          this.data[i.row][i.key] = i.oldValue;
+        this.requestUpdate();
+      },
+      redo: () => {
+        for (const i of e)
+          this.data[i.row][i.key] = i.newValue;
+        this.requestUpdate();
+      }
+    }), this.requestUpdate(), this.dispatchEvent(new CustomEvent("batch-update", {
+      detail: { changes: e },
+      bubbles: !0,
+      composed: !0
+    })), this._dispatchUndoStateEvent());
+  }
+  _createEmptyRow() {
+    const t = {};
+    for (const e of this.columns)
+      switch (e.type) {
+        case "number":
+          t[e.key] = 0;
+          break;
+        case "boolean":
+          t[e.key] = !1;
+          break;
+        default:
+          t[e.key] = "";
+      }
+    return t;
+  }
+  // --- Public API: Export ---
+  /**
+   * Export table data to string in the specified format.
+   * @param options.selectionOnly - Export only the currently selected range
+   */
+  exportToString(t, e) {
+    if (e != null && e.selectionOnly) {
+      const s = this._selection.getEffectiveRange();
+      if (!s) return "";
+      const o = this.visibleColumns.slice(s.startCol, s.endCol + 1), r = [];
+      for (let n = s.startRow; n <= s.endRow; n++)
+        r.push(this.data[this._toDataIndex(n)]);
+      return z(r, o, t);
+    }
+    const i = this._sortedIndices.map((s) => this.data[s]);
+    return z(i, this.visibleColumns, t);
+  }
+  /**
+   * Export table data and trigger file download.
+   */
+  exportToFile(t, e) {
+    const i = this.exportToString(t), s = e ?? `export${ct(t)}`;
+    rt(i, s, at(t));
+  }
+  _getSelectedDataRows() {
+    const t = this._selection.getEffectiveRange();
+    if (!t) return [];
+    const e = [];
+    for (let i = t.startRow; i <= t.endRow; i++)
+      e.push(this._toDataIndex(i));
+    return e;
+  }
+  /**
+   * Get the effective width for a column, checking internal overrides first.
+   */
+  getColumnWidth(t) {
+    return this._columnWidths.get(t);
+  }
+  _getColWidth(t) {
+    const e = this._columnWidths.get(t.key) ?? t.width ?? S;
+    return Math.max(e, t.minWidth ?? E);
+  }
+  get headerHeight() {
+    return this.rowHeight + 8;
+  }
+  /** Number of rows visible after filter + sort. */
+  get _visibleRowCount() {
+    return this._sortedIndices.length;
+  }
+  get totalBodyHeight() {
+    return this._visibleRowCount * this.rowHeight;
+  }
+  get visibleRange() {
+    const t = Math.max(0, this._scrollTop - this.headerHeight), e = Math.max(0, Math.floor(t / this.rowHeight) - $), i = Math.ceil(this._viewportHeight / this.rowHeight), s = Math.min(this._visibleRowCount, Math.floor(t / this.rowHeight) + i + $);
+    return { start: e, end: s };
+  }
+  connectedCallback() {
+    super.connectedCallback(), this._onScroll = this._onScroll.bind(this), this._onKeyDown = this._onKeyDown.bind(this), this._onDocumentClick = this._onDocumentClick.bind(this), this._onContextMenu = this._onContextMenu.bind(this), this.addEventListener("scroll", this._onScroll, { passive: !0 }), this.addEventListener("keydown", this._onKeyDown), this.addEventListener("contextmenu", this._onContextMenu), this.hasAttribute("tabindex") || this.setAttribute("tabindex", "0"), this.setAttribute("role", "grid");
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this.removeEventListener("scroll", this._onScroll), this.removeEventListener("keydown", this._onKeyDown), this.removeEventListener("contextmenu", this._onContextMenu), document.removeEventListener("click", this._onDocumentClick), this._resizeCleanup && (this._resizeCleanup(), this._resizeCleanup = null);
+  }
+  firstUpdated() {
+    this._measureViewport();
+  }
+  _updateColOffsets() {
+    const t = this.visibleColumns, e = [];
+    let i = this._prefixWidth;
+    for (const s of t)
+      e.push(i), i += this._getColWidth(s);
+    this._colLeftOffsets = e, this._totalRowWidth = i;
+  }
+  get visibleColRange() {
+    const t = this.visibleColumns;
+    if (t.length === 0) return { start: 0, end: 0 };
+    const e = this._colLeftOffsets;
+    if (e.length === 0) return { start: 0, end: t.length };
+    const i = this._scrollLeft, s = i + this._viewportWidth;
+    let o = t.length;
+    for (let n = 0; n < e.length; n++)
+      if (e[n] + this._getColWidth(t[n]) > i) {
+        o = n;
+        break;
+      }
+    o = Math.max(0, o - $);
+    let r = t.length;
+    for (let n = o; n < e.length; n++)
+      if (e[n] > s) {
+        r = n;
+        break;
+      }
+    return r = Math.min(t.length, r + $), { start: o, end: r };
+  }
+  willUpdate(t) {
+    (!(t.size <= 2 && !t.has("data") && !t.has("columns") && !t.has("_openFilterKey") && !t.has("_editingCell") && !t.has("_activeCell") && (t.has("_scrollTop") || t.has("_scrollLeft"))) || this._viewDirty) && (this._recomputeView(), this._viewDirty = !1), this._updateColOffsets(), this._selection.setDimensions(this._visibleRowCount, this.visibleColumns.length), this._rowSelection.setRowCount(this._visibleRowCount);
+  }
+  updated() {
+    this._measureViewport(), this._focusEditor(), this._adjustFilterDropdown(), this.setAttribute("aria-rowcount", String(this._visibleRowCount)), this.setAttribute("aria-colcount", String(this.visibleColumns.length));
+  }
+  /** Recompute filter → sort pipeline. */
+  _recomputeView() {
+    if (this.dataMode === "server") {
+      this._filteredIndices = Array.from({ length: this.data.length }, (t, e) => e), this._sortedIndices = this._filteredIndices;
+      return;
+    }
+    if (this._filteredIndices = Q(this.data, this._filters, (t, e, i) => {
+      this.dispatchEvent(new CustomEvent("filter-error", {
+        detail: { error: t, row: e, filterKey: i.key },
+        bubbles: !0,
+        composed: !0
+      }));
+    }), this._filters.length === 0 && this._sortCriteria.length === 0)
+      this._sortedIndices = Array.from({ length: this.data.length }, (t, e) => e);
+    else if (this._sortCriteria.length === 0)
+      this._sortedIndices = [...this._filteredIndices];
+    else {
+      const t = this._filteredIndices.map((i) => this.data[i]), e = Y(t, this._sortCriteria, this.visibleColumns);
+      this._sortedIndices = e.map((i) => this._filteredIndices[i]);
+    }
+  }
+  /** Map visual row index to data row index */
+  _toDataIndex(t) {
+    return this._sortedIndices[t] ?? t;
+  }
+  _focusEditor() {
+    var e;
+    if (!this._editingCell) return;
+    const t = (e = this.shadowRoot) == null ? void 0 : e.querySelector(".ft-editor");
+    t && document.activeElement !== t && (t.focus(), (t.type === "text" || t.type === "number") && t.select());
+  }
+  _measureViewport() {
+    const t = this.clientHeight, e = this.clientWidth;
+    t !== this._viewportHeight && (this._viewportHeight = t), e !== this._viewportWidth && (this._viewportWidth = e);
+  }
+  _onScroll() {
+    this._scrollTop = this.scrollTop, this._scrollLeft = this.scrollLeft;
+  }
+  _onDocumentClick() {
+    this._openFilterKey && (this._openFilterKey = null);
+  }
+  _onContextMenu(t) {
+    var f;
+    const i = t.composedPath().find(
+      (h) => h instanceof HTMLElement && h.classList.contains("ft-cell")
+    );
+    if (!i) return;
+    const s = i.parentElement;
+    if (!s || !s.classList.contains("ft-row")) return;
+    const o = parseInt(i.dataset.colIndex ?? "-1", 10), r = s.style.top, n = parseInt(r, 10), l = Math.round(n / this.rowHeight);
+    if (o < 0 || l < 0) return;
+    const a = this._toDataIndex(l), d = this.visibleColumns[o];
+    d && this.dispatchEvent(new CustomEvent("context-menu", {
+      detail: {
+        x: t.clientX,
+        y: t.clientY,
+        row: a,
+        col: o,
+        key: d.key,
+        value: (f = this.data[a]) == null ? void 0 : f[d.key],
+        rowData: this.data[a]
+      },
+      bubbles: !0,
+      composed: !0
+    }));
+  }
+  _onCellClickEvent(t, e, i) {
+    this._editing.current && this._commitEdit(), t.shiftKey ? this._selection.setActiveWithRange(e, i) : this._selection.setActive(e, i), this._activeCell = this._selection.activeCell ? { ...this._selection.activeCell } : null, this._dispatchSelectionEvent(), this.requestUpdate();
+  }
+  _onRowNumberClick(t) {
+    this._editing.current && this._commitEdit();
+    const e = this.visibleColumns.length - 1;
+    this._selection.setActive(t, 0), this._selection.setActiveWithRange(t, e), this._activeCell = this._selection.activeCell ? { ...this._selection.activeCell } : null, this._dispatchSelectionEvent(), this.requestUpdate();
+  }
+  _onCellDblClick(t, e) {
+    this._editing.current && this._commitEdit(), this._selection.setActive(t, e), this._activeCell = this._selection.activeCell ? { ...this._selection.activeCell } : null, this._dispatchSelectionEvent(), this._startEdit();
+  }
+  // --- Editing ---
+  /** Check if a column is editable based on global + per-column settings */
+  _isCellEditable(t) {
+    return !(!this.editable || t.editable === !1);
+  }
+  _startEdit() {
+    if (!this._activeCell) return;
+    const e = this.visibleColumns[this._activeCell.col];
+    if (!e || !this._isCellEditable(e)) return;
+    if (e.type === "boolean") {
+      const r = this.data[this._toDataIndex(this._activeCell.row)][e.key];
+      this._applyEdit(!r);
+      return;
+    }
+    const i = this._toDataIndex(this._activeCell.row), s = this.data[i];
+    this._editing.start(this._activeCell, s[e.key]), this._editingCell = { ...this._activeCell }, this.dispatchEvent(new CustomEvent("cell-edit-start", {
+      detail: { row: i, col: this._activeCell.col, key: e.key, value: s[e.key] },
+      bubbles: !0,
+      composed: !0
+    }));
+  }
+  _commitEdit() {
+    var e;
+    if (!this._editing.current) return;
+    const t = (e = this.shadowRoot) == null ? void 0 : e.querySelector(".ft-editor");
+    if (t) {
+      const i = this.visibleColumns[this._editing.current.position.col], s = A(t.value, i);
+      this._applyEdit(s);
+    } else
+      this._cancelEdit();
+  }
+  _applyEdit(t) {
+    const e = this._editing.commit();
+    if (this._editingCell = null, !e) return;
+    const { row: i, col: s } = e.position, o = this._toDataIndex(i), r = this.visibleColumns[s], n = e.originalValue;
+    if (r.validator) {
+      const l = r.validator(t, this.data[o], r);
+      if (l) {
+        this._markCellInvalid(i, s, l), this.dispatchEvent(new CustomEvent("validation-error", {
+          detail: { row: o, col: s, key: r.key, value: t, error: l },
+          bubbles: !0,
+          composed: !0
+        }));
+        return;
+      }
+    }
+    this.data[o][r.key] = t, this._undo.push({
+      label: "cell-edit",
+      undo: () => {
+        this.data[o][r.key] = n, this.requestUpdate();
+      },
+      redo: () => {
+        this.data[o][r.key] = t, this.requestUpdate();
+      }
+    }), this.requestUpdate(), this.dispatchEvent(new CustomEvent("cell-edit-commit", {
+      detail: { row: o, col: s, key: r.key, oldValue: n, newValue: t },
+      bubbles: !0,
+      composed: !0
+    })), this._dispatchUndoStateEvent();
+  }
+  _cancelEdit() {
+    const t = this._editing.cancel();
+    this._editingCell = null, t && this.dispatchEvent(new CustomEvent("cell-edit-cancel", {
+      detail: { row: t.position.row, col: t.position.col },
+      bubbles: !0,
+      composed: !0
+    }));
+  }
+  _onEditorKeyDown(t) {
+    t.key === "Enter" ? (t.preventDefault(), t.stopPropagation(), this._commitEdit(), this._selection.moveDown(), this._syncActiveCell()) : t.key === "Tab" ? (t.preventDefault(), t.stopPropagation(), this._commitEdit(), t.shiftKey ? this._selection.movePrev() : this._selection.moveNext(), this._syncActiveCell()) : t.key === "Escape" && (t.preventDefault(), t.stopPropagation(), this._cancelEdit());
+  }
+  _syncActiveCell() {
+    this._activeCell = this._selection.activeCell ? { ...this._selection.activeCell } : null, this._scrollToActiveCell(), this._dispatchSelectionEvent();
+  }
+  // --- Navigation ---
+  _onKeyDown(t) {
+    if (this._editing.current) return;
+    const e = this.visibleColumns;
+    if (e.length === 0 || this._visibleRowCount === 0) return;
+    if ((t.key === "Enter" || t.key === "F2") && this._activeCell) {
+      t.preventDefault(), this._startEdit();
+      return;
+    }
+    if (!this._selection.activeCell) {
+      if (["ArrowDown", "ArrowUp", "ArrowLeft", "ArrowRight", "Tab", "Home", "End"].includes(t.key)) {
+        this._selection.setActive(0, 0), this._syncActiveCell(), t.preventDefault();
+        return;
+      }
+      return;
+    }
+    if (this._handleCtrlKey(t) || this._handleAltKey(t, e)) return;
+    if (this._activeCell && t.key.length === 1 && !t.ctrlKey && !t.metaKey && !t.altKey) {
+      const s = e[this._activeCell.col];
+      s && this._isCellEditable(s) && this._startEdit();
+      return;
+    }
+    this._handleNavigation(t) && (t.preventDefault(), this._syncActiveCell());
+  }
+  _handleCtrlKey(t) {
+    if (!(t.ctrlKey || t.metaKey) || t.altKey) return !1;
+    switch (t.key.toLowerCase()) {
+      case "z":
+        return t.preventDefault(), t.shiftKey ? this._undo.redo() : this._undo.undo(), this.requestUpdate(), this._dispatchUndoStateEvent(), !0;
+      case "y":
+        return t.preventDefault(), this._undo.redo(), this.requestUpdate(), this._dispatchUndoStateEvent(), !0;
+      case "c":
+        return t.preventDefault(), this._handleCopy(!1), !0;
+      case "x":
+        return t.preventDefault(), this._handleCopy(this.editable), !0;
+      case "v":
+        return t.preventDefault(), this.editable && this._handlePaste(), !0;
+      default:
+        return !1;
+    }
+  }
+  _handleAltKey(t, e) {
+    if (!t.altKey || !this._activeCell || t.key !== "ArrowLeft" && t.key !== "ArrowRight") return !1;
+    t.preventDefault();
+    const i = e[this._activeCell.col];
+    if (!i) return !0;
+    const s = this._columnWidths.get(i.key) ?? i.width ?? S, o = t.key === "ArrowRight" ? 20 : -20, r = i.minWidth ?? E, n = Math.max(r, s + o);
+    return this._columnWidths.set(i.key, n), this.requestUpdate(), this.dispatchEvent(new CustomEvent("column-resize", {
+      detail: { key: i.key, width: n, colIndex: this._activeCell.col },
+      bubbles: !0,
+      composed: !0
+    })), !0;
+  }
+  _handleNavigation(t) {
+    switch (t.key) {
+      case "ArrowUp":
+        return t.shiftKey ? this._selection.shiftMoveUp() : this._selection.moveUp(), !0;
+      case "ArrowDown":
+        return t.shiftKey ? this._selection.shiftMoveDown() : this._selection.moveDown(), !0;
+      case "ArrowLeft":
+        return t.shiftKey ? this._selection.shiftMoveLeft() : this._selection.moveLeft(), !0;
+      case "ArrowRight":
+        return t.shiftKey ? this._selection.shiftMoveRight() : this._selection.moveRight(), !0;
+      case "Tab":
+        return t.shiftKey ? this._selection.movePrev() : this._selection.moveNext(), !0;
+      case "Home":
+        return t.ctrlKey ? this._selection.moveToStart() : this._selection.moveToRowStart(), !0;
+      case "End":
+        return t.ctrlKey ? this._selection.moveToEnd() : this._selection.moveToRowEnd(), !0;
+      case "Escape":
+        return this._selection.clear(), !0;
+      case "Delete":
+      case "Backspace":
+        return this.editable && this._handleDelete(), !0;
+      default:
+        return !1;
+    }
+  }
+  // --- Clipboard ---
+  async _handleCopy(t) {
+    const e = this._selection.getEffectiveRange();
+    if (!e) return;
+    const i = this.visibleColumns, s = this._sortedIndices.map((r) => this.data[r]), o = et(s, i, e);
+    try {
+      await navigator.clipboard.writeText(o);
+    } catch (r) {
+      this.dispatchEvent(new CustomEvent("clipboard-error", {
+        detail: { action: "copy", error: r },
+        bubbles: !0,
+        composed: !0
+      }));
+    }
+    t && this._clearRange(e), this.dispatchEvent(new CustomEvent(t ? "clipboard-cut" : "clipboard-copy", {
+      detail: { range: e, text: o },
+      bubbles: !0,
+      composed: !0
+    }));
+  }
+  async _handlePaste() {
+    if (!this._activeCell) return;
+    const t = await this._readClipboardText();
+    if (t == null) return;
+    const e = it(t);
+    if (e.length === 0) return;
+    const i = this._expandRowsForPaste(this._activeCell.row, e.length), s = this._applyPasteData(this._activeCell, e);
+    if (s.length > 0 || i.length > 0) {
+      const o = i.length;
+      this._undo.push({
+        label: "paste",
+        undo: () => {
+          for (const r of s)
+            this.data[r.row][r.key] = r.oldValue;
+          o > 0 && this.data.splice(this.data.length - o, o), this.requestUpdate();
+        },
+        redo: () => {
+          if (o > 0)
+            for (let r = 0; r < o; r++)
+              this.data.push(this._createEmptyRow());
+          for (const r of s)
+            this.data[r.row][r.key] = r.newValue;
+          this.requestUpdate();
+        }
+      }), this._dispatchUndoStateEvent();
+    }
+    this.requestUpdate(), this.dispatchEvent(new CustomEvent("clipboard-paste", {
+      detail: { changes: s, addedRows: i.length },
+      bubbles: !0,
+      composed: !0
+    }));
+  }
+  async _readClipboardText() {
+    try {
+      return await navigator.clipboard.readText();
+    } catch (t) {
+      return this.dispatchEvent(new CustomEvent("clipboard-error", {
+        detail: { action: "paste", error: t },
+        bubbles: !0,
+        composed: !0
+      })), null;
+    }
+  }
+  _expandRowsForPaste(t, e) {
+    const i = [], s = t + e, o = this.maxRows > 0 ? this.maxRows : 1 / 0;
+    for (; this.data.length < s && this.data.length < o; ) {
+      const r = this.data.length;
+      this.data.push(this._createEmptyRow()), i.push(r);
+    }
+    return i.length > 0 && this._recomputeView(), i;
+  }
+  _applyPasteData(t, e) {
+    const i = this.visibleColumns, s = [];
+    for (let o = 0; o < e.length; o++) {
+      const r = t.row + o;
+      if (r >= this._visibleRowCount) break;
+      const n = this._toDataIndex(r);
+      for (let l = 0; l < e[o].length; l++) {
+        const a = t.col + l;
+        if (a >= i.length) break;
+        const d = i[a], f = this.data[n][d.key], h = A(e[o][l], d);
+        this.data[n][d.key] = h, s.push({ row: n, col: a, key: d.key, oldValue: f, newValue: h });
+      }
+    }
+    return s;
+  }
+  _handleDelete() {
+    const t = this._selection.getEffectiveRange();
+    t && this._clearRange(t);
+  }
+  _clearRange(t) {
+    const e = this.visibleColumns, i = [];
+    for (let s = t.startRow; s <= t.endRow; s++) {
+      const o = this._toDataIndex(s);
+      for (let r = t.startCol; r <= t.endCol; r++) {
+        const n = e[r], l = this.data[o][n.key], a = n.type === "boolean" ? !1 : n.type === "number" ? 0 : "";
+        this.data[o][n.key] = a, i.push({ dataRow: o, key: n.key, oldValue: l, clearValue: a });
+      }
+    }
+    i.length > 0 && (this._undo.push({
+      label: "clear",
+      undo: () => {
+        for (const s of i)
+          this.data[s.dataRow][s.key] = s.oldValue;
+        this.requestUpdate();
+      },
+      redo: () => {
+        for (const s of i)
+          this.data[s.dataRow][s.key] = s.clearValue;
+        this.requestUpdate();
+      }
+    }), this._dispatchUndoStateEvent()), this.requestUpdate();
+  }
+  _scrollToActiveCell() {
+    if (!this._activeCell) return;
+    const t = this._activeCell.row * this.rowHeight + this.headerHeight, e = t + this.rowHeight;
+    t < this.scrollTop + this.headerHeight ? this.scrollTop = t - this.headerHeight : e > this.scrollTop + this.clientHeight && (this.scrollTop = e - this.clientHeight);
+    const i = this.visibleColumns, s = this._activeCell.col, o = this._colLeftOffsets[s] ?? 0, r = this._getColWidth(i[s]), n = o + r;
+    o < this.scrollLeft ? this.scrollLeft = o : n > this.scrollLeft + this.clientWidth && (this.scrollLeft = n - this.clientWidth);
+  }
+  _dispatchSelectionEvent() {
+    this.dispatchEvent(new CustomEvent("cell-select", {
+      detail: this._activeCell ? { ...this._activeCell } : null,
+      bubbles: !0,
+      composed: !0
+    }));
+  }
+  // --- Sorting ---
+  _onHeaderClick(t, e) {
+    const i = this.visibleColumns.indexOf(e);
+    if (t.ctrlKey || t.metaKey) {
+      this._selectColumn(i);
+      return;
+    }
+    e.sortable !== !1 && (this._sortCriteria = G(this._sortCriteria, e.key, t.shiftKey), this.dataMode !== "server" && this._recomputeView(), this.requestUpdate(), this.dispatchEvent(new CustomEvent("sort-change", {
+      detail: { criteria: [...this._sortCriteria] },
+      bubbles: !0,
+      composed: !0
+    })));
+  }
+  _selectColumn(t) {
+    var i;
+    const e = this._visibleRowCount;
+    e === 0 || t < 0 || (this._selection.setActive(0, t), this._selection.setActiveWithRange(e - 1, t), this._activeCell = { row: 0, col: t }, this.requestUpdate(), this.dispatchEvent(new CustomEvent("column-select", {
+      detail: {
+        colIndex: t,
+        key: (i = this.visibleColumns[t]) == null ? void 0 : i.key,
+        rowCount: e
+      },
+      bubbles: !0,
+      composed: !0
+    })));
+  }
+  /** Public API: select an entire column by index. */
+  selectColumn(t) {
+    this._selectColumn(t);
+  }
+  /** Calculate cumulative left offset for a left-pinned column */
+  _getPinnedLeft(t) {
+    const e = this.visibleColumns;
+    let i = 0;
+    this.selectable && (i += 36), this.showRowNumbers && (i += 48);
+    for (let s = 0; s < t; s++)
+      e[s].pinned === "left" && (i += this._getColWidth(e[s]));
+    return i;
+  }
+  /** Calculate cumulative right offset for a right-pinned column */
+  _getPinnedRight(t) {
+    const e = this.visibleColumns;
+    let i = 0;
+    for (let s = e.length - 1; s > t; s--)
+      e[s].pinned === "right" && (i += this._getColWidth(e[s]));
+    return i;
+  }
+  _renderHeaderCell(t, e) {
+    const i = t.sortable !== !1, s = this._sortCriteria.find((m) => m.key === t.key), o = this._sortCriteria.length > 1 ? this._sortCriteria.findIndex((m) => m.key === t.key) : -1, r = this._filters.some((m) => m.key === t.key), n = t.pinned === "left", l = t.pinned === "right", d = [
+      "ft-header-cell",
+      i ? "ft-sortable" : "",
+      n || l ? "ft-pinned" : ""
+    ].filter(Boolean).join(" "), f = i ? s ? s.direction === "asc" ? "ascending" : "descending" : "none" : void 0, h = this._getColWidth(t), g = this.headerHeight, p = this._colLeftOffsets[e] ?? 0;
+    let c;
+    return n ? c = `position: absolute; top: 0; left: ${this._scrollLeft + this._getPinnedLeft(e)}px; width: ${h}px; height: ${g}px; z-index: 4;` : l ? c = `position: absolute; top: 0; right: ${-this._scrollLeft + this._getPinnedRight(e)}px; width: ${h}px; height: ${g}px; z-index: 4;` : c = `left: ${p}px; width: ${h}px; height: ${g}px;`, u`
+      <div class=${d}
+        role="columnheader"
+        data-col-index=${e}
+        style=${c}
+        aria-sort=${f ?? k}
+        @click=${i ? (m) => this._onHeaderClick(m, t) : void 0}>
+        <span>${t.header}</span>
+        ${s ? u`<span class="ft-sort-indicator">${s.direction === "asc" ? "▲" : "▼"}</span>` : ""}
+        ${o >= 0 ? u`<span class="ft-sort-order">${o + 1}</span>` : ""}
+        ${this.showFilters ? u`
+          <button class="ft-filter-btn ${r ? "ft-filter-active" : ""}"
+            title="Filter"
+            aria-label=${`Filter ${t.header}`}
+            aria-expanded=${this._openFilterKey === t.key ? "true" : "false"}
+            @click=${(m) => this._onFilterBtnClick(m, t)}>
+            \u25BD
+          </button>
+        ` : ""}
+        <div class="ft-resize-handle"
+          @mousedown=${(m) => this._onResizeStart(m, e)}
+          @dblclick=${(m) => this._onResizeAutoFit(m, e)}></div>
+      </div>
+      ${this._openFilterKey === t.key ? this._renderFilterDropdown(t) : ""}
+    `;
+  }
+  // --- Filter UI ---
+  _adjustFilterDropdown() {
+    var s;
+    if (!this._openFilterKey) return;
+    const t = (s = this.shadowRoot) == null ? void 0 : s.querySelector(".ft-filter-dropdown");
+    if (!t) return;
+    t.style.top = "", t.style.bottom = "";
+    const e = t.getBoundingClientRect(), i = window.innerHeight;
+    e.bottom > i && (t.style.top = "auto", t.style.bottom = "100%");
+  }
+  _onFilterBtnClick(t, e) {
+    t.preventDefault(), t.stopPropagation();
+    const i = this._openFilterKey === e.key ? null : e.key;
+    this._openFilterKey = i, i && requestAnimationFrame(() => {
+      document.addEventListener("click", this._onDocumentClick, { once: !0 });
+    });
+  }
+  _renderFilterDropdown(t) {
+    const e = t.type ?? "text";
+    return u`
+      <div class="ft-filter-dropdown" @click=${(i) => i.stopPropagation()}>
+        ${e === "boolean" ? this._renderBooleanFilter(t) : e === "number" ? this._renderNumberFilter(t) : e === "date" || e === "datetime" ? this._renderDateFilter(t) : this._renderTextFilter(t)}
+        <div class="ft-filter-actions">
+          <button class="ft-filter-clear" @click=${() => this._clearColumnFilter(t.key)}>Clear</button>
+        </div>
+      </div>
+    `;
+  }
+  _renderTextFilter(t) {
+    return u`
+      <input class="ft-filter-input" type="text" placeholder="Search..."
+        .value=${this._textFilterState.get(t.key) ?? ""}
+        @input=${(e) => {
+      const i = e.target.value;
+      this._textFilterState.set(t.key, i), i ? this.setFilter(t.key, (s) => String(s ?? "").toLowerCase().includes(i.toLowerCase())) : this.removeFilter(t.key);
+    }}
+        @keydown=${(e) => {
+      e.key === "Escape" && (this._openFilterKey = null), e.stopPropagation();
+    }}>
+    `;
+  }
+  _renderNumberFilter(t) {
+    const e = this._numberFilterState.get(t.key) ?? {};
+    return u`
+      <div class="ft-filter-range">
+        <input class="ft-filter-input" type="number" placeholder="Min"
+          .value=${e.min != null ? String(e.min) : ""}
+          @input=${(i) => this._applyNumberFilter(t.key, i, "min")}
+          @keydown=${(i) => {
+      i.key === "Escape" && (this._openFilterKey = null), i.stopPropagation();
+    }}>
+        <input class="ft-filter-input" type="number" placeholder="Max"
+          .value=${e.max != null ? String(e.max) : ""}
+          @input=${(i) => this._applyNumberFilter(t.key, i, "max")}
+          @keydown=${(i) => {
+      i.key === "Escape" && (this._openFilterKey = null), i.stopPropagation();
+    }}>
+      </div>
+    `;
+  }
+  _cellKey(t, e) {
+    return `${t}:${e}`;
+  }
+  _markCellInvalid(t, e, i) {
+    const s = this._cellKey(t, e), o = this._invalidCells.get(s);
+    o && clearTimeout(o.timer);
+    const r = setTimeout(() => {
+      this._invalidCells.delete(s), this.requestUpdate();
+    }, 3e3);
+    this._invalidCells.set(s, { error: i, timer: r }), this.requestUpdate();
+  }
+  _isCellInvalid(t, e) {
+    const i = this._invalidCells.get(this._cellKey(t, e));
+    return i ? i.error : null;
+  }
+  _applyNumberFilter(t, e, i) {
+    const s = e.target.value, o = this._numberFilterState.get(t) ?? {};
+    s === "" ? delete o[i] : o[i] = Number(s), this._numberFilterState.set(t, o), o.min == null && o.max == null ? this.removeFilter(t) : this.setFilter(t, (r) => {
+      const n = Number(r);
+      return !(isNaN(n) || o.min != null && n < o.min || o.max != null && n > o.max);
+    });
+  }
+  _renderDateFilter(t) {
+    const e = t.type === "datetime" ? "datetime-local" : "date", i = this._dateFilterState.get(t.key) ?? {};
+    return u`
+      <div class="ft-filter-range">
+        <input class="ft-filter-input" type=${e} placeholder="From"
+          .value=${i.from ?? ""}
+          @input=${(s) => this._applyDateFilter(t.key, s, "from")}
+          @keydown=${(s) => {
+      s.key === "Escape" && (this._openFilterKey = null), s.stopPropagation();
+    }}>
+        <input class="ft-filter-input" type=${e} placeholder="To"
+          .value=${i.to ?? ""}
+          @input=${(s) => this._applyDateFilter(t.key, s, "to")}
+          @keydown=${(s) => {
+      s.key === "Escape" && (this._openFilterKey = null), s.stopPropagation();
+    }}>
+      </div>
+    `;
+  }
+  _applyDateFilter(t, e, i) {
+    const s = e.target.value, o = this._dateFilterState.get(t) ?? {};
+    s === "" ? delete o[i] : o[i] = s, this._dateFilterState.set(t, o), o.from == null && o.to == null ? this.removeFilter(t) : this.setFilter(t, (r) => {
+      if (r == null || r === "") return !1;
+      const n = r instanceof Date ? r : new Date(String(r));
+      if (isNaN(n.getTime())) return !1;
+      if (o.from) {
+        const l = new Date(o.from);
+        if (n < l) return !1;
+      }
+      if (o.to) {
+        const l = new Date(o.to);
+        if (o.to.length === 10 && l.setHours(23, 59, 59, 999), n > l) return !1;
+      }
+      return !0;
+    });
+  }
+  _renderBooleanFilter(t) {
+    return u`
+      <select class="ft-filter-input"
+        @change=${(e) => {
+      const i = e.target.value;
+      i === "all" ? this.removeFilter(t.key) : this.setFilter(t.key, (s) => !!s == (i === "true"));
+    }}
+        @keydown=${(e) => {
+      e.key === "Escape" && (this._openFilterKey = null), e.stopPropagation();
+    }}>
+        <option value="all">All</option>
+        <option value="true">\u2714 True</option>
+        <option value="false">\u2718 False</option>
+      </select>
+    `;
+  }
+  _clearColumnFilter(t) {
+    this.removeFilter(t), this._textFilterState.delete(t), this._numberFilterState.delete(t), this._dateFilterState.delete(t), this._openFilterKey = null;
+  }
+  // --- Column Resize ---
+  _onResizeAutoFit(t, e) {
+    var a, d;
+    t.preventDefault(), t.stopPropagation();
+    const i = this.visibleColumns[e];
+    if (!i) return;
+    const s = (a = this.shadowRoot) == null ? void 0 : a.querySelectorAll(`.ft-cell[data-col-index="${e}"]`);
+    let o = 0;
+    const r = (d = this.shadowRoot) == null ? void 0 : d.querySelector(`.ft-header-cell[data-col-index="${e}"]`);
+    if (r && (o = Math.max(o, r.scrollWidth)), s)
+      for (const f of s)
+        o = Math.max(o, f.scrollWidth);
+    const n = i.minWidth ?? E, l = Math.max(n, o + 8);
+    this._columnWidths.set(i.key, l), this.requestUpdate(), this.dispatchEvent(new CustomEvent("column-resize", {
+      detail: { key: i.key, width: l, colIndex: e },
+      bubbles: !0,
+      composed: !0
+    }));
+  }
+  _onResizeStart(t, e) {
+    t.preventDefault(), t.stopPropagation();
+    const i = this.visibleColumns[e], s = this._columnWidths.get(i.key) ?? i.width ?? S;
+    this._resizing = { colIndex: e, startX: t.clientX, startWidth: s };
+    const o = (l) => {
+      if (!this._resizing) return;
+      const a = l.clientX - this._resizing.startX, d = i.minWidth ?? E, f = Math.max(d, this._resizing.startWidth + a);
+      this._columnWidths.set(i.key, f), this.requestUpdate();
+    }, r = () => {
+      document.removeEventListener("mousemove", o), document.removeEventListener("mouseup", n), this._resizeCleanup = null;
+    }, n = () => {
+      if (r(), this._resizing) {
+        const l = this._columnWidths.get(i.key) ?? S;
+        this.dispatchEvent(new CustomEvent("column-resize", {
+          detail: { key: i.key, width: l, colIndex: e },
+          bubbles: !0,
+          composed: !0
+        })), this._resizing = null;
+      }
+    };
+    document.addEventListener("mousemove", o), document.addEventListener("mouseup", n), this._resizeCleanup = r;
+  }
+  // --- Rendering ---
+  render() {
+    const t = this.visibleColumns;
+    if (t.length === 0)
+      return u`<div class="ft-empty">No columns defined</div>`;
+    const e = this.headerHeight, i = this._totalRowWidth, { start: s, end: o } = this.visibleColRange, r = [];
+    for (let c = 0; c < t.length; c++)
+      (t[c].pinned === "left" || t[c].pinned === "right") && (c < s || c >= o) && r.push(c);
+    let n = 0;
+    const l = this._scrollLeft, a = this.selectable ? u`<div class="ft-checkbox-header"
+            style="position: absolute; top: 0; left: ${l + n}px; width: 36px; height: ${e}px; z-index: 4;">
+          ${this._rowSelection.mode === "multi" ? u`
+            <input type="checkbox"
+              .checked=${this._rowSelection.isAllSelected}
+              .indeterminate=${this._rowSelection.isSomeSelected}
+              @change=${this._onSelectAllChange}>
+          ` : ""}
+        </div>` : "";
+    this.selectable && (n += 36);
+    const d = this.showRowNumbers ? u`<div class="ft-row-num-header"
+            style="position: absolute; top: 0; left: ${l + n}px; width: 48px; height: ${e}px; z-index: 4;">#</div>` : "", f = [];
+    for (const c of r)
+      f.push(this._renderHeaderCell(t[c], c));
+    for (let c = s; c < o; c++)
+      f.push(this._renderHeaderCell(t[c], c));
+    if (this.data.length === 0 || this._visibleRowCount === 0) {
+      const c = this.data.length === 0 ? "No data" : "No matching data";
+      return u`
+        <div class="ft-header" role="row" style="width: ${i}px; height: ${e}px;">
+          ${a}${d}
+          ${f}
+        </div>
+        <div class="ft-empty">${c}</div>
+      `;
+    }
+    const { start: h, end: g } = this.visibleRange, p = [];
+    for (let c = h; c < g; c++)
+      p.push(this._renderRow(c, s, o, r));
+    return u`
+      <div class="ft-header" role="row" style="width: ${i}px; height: ${e}px;">
+        ${a}${d}
+        ${f}
+      </div>
+      <div class="ft-body" style="height: ${this.totalBodyHeight}px; width: ${i}px;">
+        ${p}
+      </div>
+      ${this.footerData ? this._renderFooter(s, o, r) : ""}
+    `;
+  }
+  _onSelectAllChange(t) {
+    t.target.checked ? this._rowSelection.selectAll() : this._rowSelection.deselectAll(), this._rowSelectionVersion++, this._dispatchRowSelectionEvent();
+  }
+  _onRowCheckboxChange(t, e) {
+    t.stopPropagation(), this._rowSelection.toggle(e), this._rowSelectionVersion++, this._dispatchRowSelectionEvent();
+  }
+  _renderFooter(t, e, i) {
+    if (!this.footerData) return "";
+    const s = this.visibleColumns, o = this.rowHeight, r = this._totalRowWidth, n = this._scrollLeft;
+    let l = 0;
+    const a = this.selectable ? u`<div class="ft-footer-cell ft-checkbox-cell"
+            style="position: absolute; top: 0; left: ${n + l}px; width: 36px; height: ${o}px; z-index: 2;"></div>` : "";
+    this.selectable && (l += 36);
+    const d = this.showRowNumbers ? u`<div class="ft-footer-cell ft-row-num"
+            style="position: absolute; top: 0; left: ${n + l}px; width: 48px; height: ${o}px; z-index: 2;"></div>` : "", f = [];
+    for (const h of i) {
+      const g = s[h], p = this._getColWidth(g), c = g.pinned === "right" ? `position: absolute; top: 0; right: ${-n + this._getPinnedRight(h)}px; width: ${p}px; height: ${o}px; z-index: 2;` : `position: absolute; top: 0; left: ${n + this._getPinnedLeft(h)}px; width: ${p}px; height: ${o}px; z-index: 2;`;
+      f.push(u`
+        <div class="ft-footer-cell ft-pinned" style=${c}>
+          ${this.footerData[g.key] ?? ""}</div>
+      `);
+    }
+    for (let h = t; h < e; h++) {
+      const g = s[h], p = this._getColWidth(g), c = this._colLeftOffsets[h] ?? 0, m = g.pinned === "left", y = g.pinned === "right", b = m || y;
+      let x;
+      m ? x = `position: absolute; top: 0; left: ${n + this._getPinnedLeft(h)}px; width: ${p}px; height: ${o}px; z-index: 2;` : y ? x = `position: absolute; top: 0; right: ${-n + this._getPinnedRight(h)}px; width: ${p}px; height: ${o}px; z-index: 2;` : x = `left: ${c}px; width: ${p}px; height: ${o}px;`, f.push(u`
+        <div class="ft-footer-cell ${b ? "ft-pinned" : ""}" style=${x}>
+          ${this.footerData[g.key] ?? ""}</div>
+      `);
+    }
+    return u`
+      <div class="ft-footer" role="row" style="width: ${r}px; height: ${o}px;">
+        ${a}${d}
+        ${f}
+      </div>
+    `;
+  }
+  _renderRow(t, e, i, s) {
+    const o = this.visibleColumns, r = this._toDataIndex(t), n = this.data[r], l = t * this.rowHeight, a = this.rowHeight, d = this._totalRowWidth, f = t % 2 === 0 ? "ft-row-even" : "ft-row-odd", h = this.selectable && this._rowSelection.isSelected(t), g = this._scrollLeft;
+    let p = 0;
+    const c = this.selectable ? u`
+      <div class="ft-checkbox-cell"
+        style="position: absolute; top: 0; left: ${g + p}px; width: 36px; height: ${a}px; z-index: 2;">
+        <input type="checkbox"
+          .checked=${h}
+          @change=${(b) => this._onRowCheckboxChange(b, t)}>
+      </div>
+    ` : "";
+    this.selectable && (p += 36);
+    const m = this.showRowNumbers ? u`
+      <div class="ft-row-num"
+        style="position: absolute; top: 0; left: ${g + p}px; width: 48px; height: ${a}px; z-index: 2;"
+        @click=${() => this._onRowNumberClick(t)}>${r + 1}</div>
+    ` : "", y = [];
+    for (const b of s)
+      y.push(this._renderCell(n, o[b], t, b));
+    for (let b = e; b < i; b++)
+      y.push(this._renderCell(n, o[b], t, b));
+    return u`
+      <div class="ft-row ${f} ${h ? "ft-row-selected" : ""}" role="row"
+        style="top: ${l}px; height: ${a}px; width: ${d}px;">
+        ${c}${m}
+        ${y}
+      </div>
+    `;
+  }
+  _renderCell(t, e, i, s) {
+    var x, R, D, F;
+    const o = ((x = this._activeCell) == null ? void 0 : x.row) === i && ((R = this._activeCell) == null ? void 0 : R.col) === s, r = ((D = this._editingCell) == null ? void 0 : D.row) === i && ((F = this._editingCell) == null ? void 0 : F.col) === s, n = this._selection.isInRange(i, s), l = e.pinned === "left", a = e.pinned === "right", d = l || a, f = this._getColWidth(e), h = this.rowHeight, g = this._colLeftOffsets[s] ?? 0;
+    let p;
+    l ? p = `position: absolute; top: 0; left: ${this._scrollLeft + this._getPinnedLeft(s)}px; width: ${f}px; height: ${h}px; z-index: 2;` : a ? p = `position: absolute; top: 0; right: ${-this._scrollLeft + this._getPinnedRight(s)}px; width: ${f}px; height: ${h}px; z-index: 2;` : p = `left: ${g}px; width: ${f}px; height: ${h}px;`;
+    const c = !this._isCellEditable(e);
+    if (r)
+      return u`
+        <div class="ft-cell ft-editing ft-active ${d ? "ft-pinned" : ""}" role="gridcell"
+          data-col-index=${s}
+          aria-selected="true"
+          aria-readonly=${c ? "true" : k}
+          style=${p}>
+          ${this._renderEditor(t, e)}
+        </div>
+      `;
+    const m = o || n, y = this._isCellInvalid(i, s), b = [
+      "ft-cell",
+      `ft-type-${e.type ?? "text"}`,
+      o ? "ft-active" : "",
+      n ? "ft-selected" : "",
+      d ? "ft-pinned" : "",
+      y ? "ft-invalid" : ""
+    ].filter(Boolean).join(" ");
+    return u`
+      <div class=${b}
+        role="gridcell"
+        data-col-index=${s}
+        aria-selected=${m ? "true" : "false"}
+        aria-readonly=${c ? "true" : k}
+        aria-invalid=${y ? "true" : k}
+        title=${y ?? k}
+        style=${p}
+        @click=${(N) => this._onCellClickEvent(N, i, s)}
+        @dblclick=${() => this._onCellDblClick(i, s)}>
+        ${H(t[e.key], t, e)}
+      </div>
+    `;
+  }
+  _renderEditor(t, e) {
+    if (e.editor)
+      return e.editor(t[e.key], t, e);
+    const i = t[e.key], s = i == null ? "" : String(i);
+    if (e.type === "number")
+      return u`
+        <input class="ft-editor ft-editor-number" type="number"
+          .value=${s}
+          @keydown=${this._onEditorKeyDown}
+          @blur=${() => this._commitEdit()}>
+      `;
+    if (e.type === "date") {
+      const o = this._toDateInputValue(i);
+      return u`
+        <input class="ft-editor" type="date"
+          .value=${o}
+          @keydown=${this._onEditorKeyDown}
+          @blur=${() => this._commitEdit()}>
+      `;
+    }
+    if (e.type === "datetime") {
+      const o = this._toDateTimeInputValue(i);
+      return u`
+        <input class="ft-editor" type="datetime-local"
+          .value=${o}
+          @keydown=${this._onEditorKeyDown}
+          @blur=${() => this._commitEdit()}>
+      `;
+    }
+    return u`
+      <input class="ft-editor" type="text"
+        .value=${s}
+        @keydown=${this._onEditorKeyDown}
+        @blur=${() => this._commitEdit()}>
+    `;
+  }
+  /** Convert value to YYYY-MM-DD for date input (local timezone) */
+  _toDateInputValue(t) {
+    if (!t) return "";
+    const e = t instanceof Date ? t : new Date(String(t));
+    if (isNaN(e.getTime())) return "";
+    const i = e.getFullYear(), s = String(e.getMonth() + 1).padStart(2, "0"), o = String(e.getDate()).padStart(2, "0");
+    return `${i}-${s}-${o}`;
+  }
+  /** Convert value to YYYY-MM-DDTHH:mm for datetime-local input (local timezone) */
+  _toDateTimeInputValue(t) {
+    if (!t) return "";
+    const e = t instanceof Date ? t : new Date(String(t));
+    if (isNaN(e.getTime())) return "";
+    const i = e.getFullYear(), s = String(e.getMonth() + 1).padStart(2, "0"), o = String(e.getDate()).padStart(2, "0"), r = String(e.getHours()).padStart(2, "0"), n = String(e.getMinutes()).padStart(2, "0");
+    return `${i}-${s}-${o}T${r}:${n}`;
+  }
+};
+_.styles = K;
+v([
+  w({ type: Array })
+], _.prototype, "columns", 2);
+v([
+  w({ type: Array, hasChanged: () => !0 })
+], _.prototype, "data", 2);
+v([
+  w({ type: Number, attribute: "row-height" })
+], _.prototype, "rowHeight", 2);
+v([
+  w({ type: Boolean, attribute: "show-row-numbers" })
+], _.prototype, "showRowNumbers", 2);
+v([
+  w({ type: String, reflect: !0 })
+], _.prototype, "theme", 2);
+v([
+  w({ type: Number, attribute: "max-rows" })
+], _.prototype, "maxRows", 2);
+v([
+  w({ type: Boolean })
+], _.prototype, "editable", 2);
+v([
+  w({ type: Boolean, attribute: "show-filters" })
+], _.prototype, "showFilters", 2);
+v([
+  w({ type: Boolean })
+], _.prototype, "selectable", 2);
+v([
+  w({ type: String, attribute: "selection-mode" })
+], _.prototype, "selectionMode", 1);
+v([
+  w({ type: String, attribute: "data-mode" })
+], _.prototype, "dataMode", 2);
+v([
+  w({ type: Object, attribute: "footer-data" })
+], _.prototype, "footerData", 2);
+v([
+  w({ type: Number, attribute: "max-undo-size" })
+], _.prototype, "maxUndoSize", 1);
+v([
+  C()
+], _.prototype, "_scrollTop", 2);
+v([
+  C()
+], _.prototype, "_scrollLeft", 2);
+v([
+  C()
+], _.prototype, "_viewportHeight", 2);
+v([
+  C()
+], _.prototype, "_viewportWidth", 2);
+v([
+  C()
+], _.prototype, "_activeCell", 2);
+v([
+  C()
+], _.prototype, "_editingCell", 2);
+v([
+  C()
+], _.prototype, "_sortCriteria", 2);
+v([
+  C()
+], _.prototype, "_openFilterKey", 2);
+v([
+  C()
+], _.prototype, "_rowSelectionVersion", 2);
+_ = v([
+  M("flex-table")
+], _);
+export {
+  _ as F,
+  X as R,
+  tt as U,
+  z as e,
+  H as r
+};