velox-grid 0.11.0

package/dist/velox-grid.esm.js

@@ -0,0 +1,3387 @@
+function f(d, t, e) {
+  const i = document.createElement(d);
+  return t && (i.className = t), e && Object.entries(e).forEach(([s, n]) => {
+    i.setAttribute(s, n);
+  }), i;
+}
+function y(d, ...t) {
+  d.classList.add(...t);
+}
+function b(d, ...t) {
+  d.classList.remove(...t);
+}
+function ct(d, t, e) {
+  d.classList.toggle(t, e);
+}
+function ht(d, t) {
+  return d.classList.contains(t);
+}
+function ut(d, t) {
+  Object.assign(d.style, t);
+}
+function V(d, t) {
+  let e = !1;
+  return function(...i) {
+    e || (d.apply(this, i), e = !0, setTimeout(() => e = !1, t));
+  };
+}
+function ft(d, t) {
+  let e = null;
+  return function(...i) {
+    e && clearTimeout(e), e = setTimeout(() => d.apply(this, i), t);
+  };
+}
+function P(d) {
+  if (d === null || typeof d != "object")
+    return d;
+  if (d instanceof Date)
+    return new Date(d.getTime());
+  if (Array.isArray(d))
+    return d.map((e) => P(e));
+  const t = {};
+  for (const e in d)
+    Object.prototype.hasOwnProperty.call(d, e) && (t[e] = P(d[e]));
+  return t;
+}
+function _(d = "velox") {
+  return `${d}-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`;
+}
+function k(d, t = "text") {
+  if (d == null)
+    return "";
+  switch (t) {
+    case "number":
+      return typeof d == "number" ? d.toLocaleString() : String(d);
+    case "boolean":
+      return d ? "Yes" : "No";
+    case "date":
+      return d instanceof Date ? d.toLocaleDateString() : String(d);
+    case "datetime":
+      return d instanceof Date ? d.toLocaleString() : String(d);
+    case "text":
+    default:
+      return String(d);
+  }
+}
+function pt(d, t) {
+  if (d === "" || d === null || d === void 0)
+    return null;
+  switch (t) {
+    case "number":
+      const e = parseFloat(d.replace(/,/g, ""));
+      return isNaN(e) ? null : e;
+    case "boolean":
+      return d.toLowerCase() === "true" || d === "1" || d.toLowerCase() === "yes";
+    case "date":
+    case "datetime":
+      const i = new Date(d);
+      return isNaN(i.getTime()) ? null : i;
+    case "text":
+    default:
+      return d;
+  }
+}
+function z(d, t, e = "text") {
+  if (d == null) return t == null ? 0 : -1;
+  if (t == null) return 1;
+  switch (e) {
+    case "number":
+      return d - t;
+    case "boolean":
+      return d === t ? 0 : d ? 1 : -1;
+    case "date":
+    case "datetime":
+      const i = d instanceof Date ? d : new Date(d), s = t instanceof Date ? t : new Date(t);
+      return i.getTime() - s.getTime();
+    case "text":
+    default:
+      return String(d).localeCompare(String(t));
+  }
+}
+function L(d, t, e) {
+  return t.length ? [...d].sort((i, s) => {
+    for (const { field: n, direction: o } of t) {
+      if (!o) continue;
+      const l = e[n] || "text", a = z(i[n], s[n], l);
+      if (a !== 0)
+        return o === "asc" ? a : -a;
+    }
+    return 0;
+  }) : d;
+}
+function W(d, t) {
+  const { operator: e, value: i, value2: s } = t;
+  if (e === "isEmpty")
+    return d == null || d === "";
+  if (e === "isNotEmpty")
+    return d != null && d !== "";
+  const n = String(d ?? "").toLowerCase(), o = String(i ?? "").toLowerCase();
+  switch (e) {
+    case "equals":
+      return n === o;
+    case "notEquals":
+      return n !== o;
+    case "contains":
+      return n.includes(o);
+    case "notContains":
+      return !n.includes(o);
+    case "startsWith":
+      return n.startsWith(o);
+    case "endsWith":
+      return n.endsWith(o);
+    case "greaterThan":
+      return Number(d) > Number(i);
+    case "lessThan":
+      return Number(d) < Number(i);
+    case "greaterThanOrEqual":
+      return Number(d) >= Number(i);
+    case "lessThanOrEqual":
+      return Number(d) <= Number(i);
+    case "between":
+      const l = Number(d);
+      return l >= Number(i) && l <= Number(s);
+    default:
+      return !0;
+  }
+}
+function T(d, t) {
+  if (!t || !t.conditions.length)
+    return d;
+  const { conditions: e, logic: i } = t;
+  return d.filter((s) => {
+    const n = e.map(
+      (o) => W(s[o.field], o)
+    );
+    return i === "and" ? n.every(Boolean) : n.some(Boolean);
+  });
+}
+function gt(d) {
+  const t = document.createElement("div");
+  return t.textContent = d, t.innerHTML;
+}
+function O(d) {
+  const { data: t, displayData: e, columns: i, selectedRows: s, options: n } = d, o = n.columns ? i.filter((r) => n.columns.includes(r.field) && r.visible !== !1) : i.filter((r) => r.visible !== !1);
+  let l;
+  if (n.selectedOnly && s.length > 0) {
+    const r = n.filteredOnly ? e : t;
+    l = s.map((h) => r[h]).filter(Boolean);
+  } else n.filteredOnly ? l = e : l = t;
+  const a = [];
+  if (n.includeHeader !== !1) {
+    const r = o.map((h) => F(h.header));
+    a.push(r.join(","));
+  }
+  return l.forEach((r) => {
+    const h = o.map((p) => {
+      const c = r[p.field];
+      return F(X(c, p.type));
+    });
+    a.push(h.join(","));
+  }), a.join(`\r
+`);
+}
+function F(d) {
+  if (d == null) return "";
+  const t = String(d);
+  return t.includes(",") || t.includes('"') || t.includes(`
+`) || t.includes("\r") ? `"${t.replace(/"/g, '""')}"` : t;
+}
+function A(d) {
+  const { data: t, displayData: e, columns: i, selectedRows: s, options: n } = d, o = n.columns ? i.filter((r) => n.columns.includes(r.field) && r.visible !== !1) : i.filter((r) => r.visible !== !1);
+  let l;
+  if (n.selectedOnly && s.length > 0) {
+    const r = n.filteredOnly ? e : t;
+    l = s.map((h) => r[h]).filter(Boolean);
+  } else n.filteredOnly ? l = e : l = t;
+  const a = l.map((r) => {
+    const h = {};
+    return o.forEach((p) => {
+      h[p.field] = r[p.field];
+    }), h;
+  });
+  return JSON.stringify(a, null, 2);
+}
+function B() {
+  return typeof window.XLSX < "u";
+}
+function I() {
+  const d = window.XLSX;
+  if (!d)
+    throw new Error(
+      'SheetJS (xlsx) library is not loaded. Please include it via CDN: <script src="https://cdn.sheetjs.com/xlsx-0.20.1/package/dist/xlsx.full.min.js"><\/script>'
+    );
+  return d;
+}
+function K(d) {
+  const t = I(), { data: e, displayData: i, columns: s, selectedRows: n, options: o } = d, l = o.columns ? s.filter((m) => o.columns.includes(m.field) && m.visible !== !1) : s.filter((m) => m.visible !== !1);
+  let a;
+  if (o.selectedOnly && n.length > 0) {
+    const m = o.filteredOnly ? i : e;
+    a = n.map((C) => m[C]).filter(Boolean);
+  } else o.filteredOnly ? a = i : a = e;
+  const r = [];
+  o.includeHeader !== !1 && r.push(l.map((m) => m.header)), a.forEach((m) => {
+    const C = l.map((x) => {
+      const v = m[x.field];
+      return q(v, x.type);
+    });
+    r.push(C);
+  });
+  const h = t.utils.aoa_to_sheet(r), p = l.map((m) => ({
+    wch: Math.max(
+      m.header.length,
+      ...a.slice(0, 100).map((C) => {
+        const x = C[m.field];
+        return String(x ?? "").length;
+      })
+    ) + 2
+  }));
+  h["!cols"] = p;
+  const c = t.utils.book_new(), u = o.sheetName || "Sheet1";
+  t.utils.book_append_sheet(c, h, u);
+  const g = (o.filename || "export") + ".xlsx";
+  t.writeFile(c, g);
+}
+function q(d, t) {
+  if (d == null) return "";
+  switch (t) {
+    case "number":
+      return typeof d == "number" ? d : parseFloat(String(d)) || 0;
+    case "boolean":
+      return !!d;
+    case "date":
+    case "datetime":
+      if (d instanceof Date) return d;
+      if (typeof d == "string" || typeof d == "number") {
+        const e = new Date(d);
+        return isNaN(e.getTime()) ? String(d) : e;
+      }
+      return String(d);
+    default:
+      return String(d);
+  }
+}
+function X(d, t) {
+  if (d == null) return "";
+  switch (t) {
+    case "date":
+      return d instanceof Date ? d.toISOString().split("T")[0] : String(d);
+    case "datetime":
+      return d instanceof Date ? d.toISOString() : String(d);
+    default:
+      return String(d);
+  }
+}
+function j(d, t = !0) {
+  var i;
+  const e = {
+    data: [],
+    headers: [],
+    errors: []
+  };
+  try {
+    const s = U(d);
+    if (s.length === 0)
+      return e.errors.push("CSV file is empty"), e;
+    let n = 0;
+    if (t)
+      e.headers = s[0], n = 1;
+    else {
+      const o = ((i = s[0]) == null ? void 0 : i.length) || 0;
+      e.headers = Array.from({ length: o }, (l, a) => `Column${a + 1}`);
+    }
+    for (let o = n; o < s.length; o++) {
+      const l = s[o], a = {};
+      e.headers.forEach((r, h) => {
+        a[r] = l[h] ?? "";
+      }), e.data.push(a);
+    }
+  } catch (s) {
+    e.errors.push(`CSV parsing error: ${s instanceof Error ? s.message : "Unknown error"}`);
+  }
+  return e;
+}
+function U(d) {
+  const t = [];
+  let e = [], i = "", s = !1;
+  for (let n = 0; n < d.length; n++) {
+    const o = d[n], l = d[n + 1];
+    if (s)
+      o === '"' ? l === '"' ? (i += '"', n++) : s = !1 : i += o;
+    else if (o === '"')
+      s = !0;
+    else if (o === ",")
+      e.push(i), i = "";
+    else {
+      if (o === "\r")
+        continue;
+      o === `
+` ? (e.push(i), e.some((a) => a.trim() !== "") && t.push(e), e = [], i = "") : i += o;
+    }
+  }
+  return (i !== "" || e.length > 0) && (e.push(i), e.some((n) => n.trim() !== "") && t.push(e)), t;
+}
+function G(d, t = 0) {
+  return new Promise((e) => {
+    const i = {
+      data: [],
+      headers: [],
+      errors: []
+    };
+    if (!B()) {
+      i.errors.push(
+        'SheetJS (xlsx) library is not loaded. Please include it via CDN: <script src="https://cdn.sheetjs.com/xlsx-0.20.1/package/dist/xlsx.full.min.js"><\/script>'
+      ), e(i);
+      return;
+    }
+    const s = I(), n = new FileReader();
+    n.onload = (o) => {
+      var l;
+      try {
+        const a = (l = o.target) == null ? void 0 : l.result, r = s.read(a, { type: "array" }), h = r.SheetNames;
+        if (t >= h.length) {
+          i.errors.push(`Sheet index ${t} not found. Available sheets: ${h.join(", ")}`), e(i);
+          return;
+        }
+        const p = h[t], c = r.Sheets[p], u = s.utils.sheet_to_json(c, { header: 1 });
+        if (u.length === 0) {
+          i.errors.push("Excel sheet is empty"), e(i);
+          return;
+        }
+        i.headers = u[0].map((g) => String(g ?? ""));
+        for (let g = 1; g < u.length; g++) {
+          const m = {}, C = u[g];
+          i.headers.forEach((x, v) => {
+            const w = C[v];
+            m[x] = w ?? "";
+          }), Object.values(m).some((x) => x !== "") && i.data.push(m);
+        }
+        e(i);
+      } catch (a) {
+        i.errors.push(`Excel parsing error: ${a instanceof Error ? a.message : "Unknown error"}`), e(i);
+      }
+    }, n.onerror = () => {
+      i.errors.push("Failed to read file"), e(i);
+    }, n.readAsArrayBuffer(d);
+  });
+}
+function mt(d, t) {
+  return new Promise((e) => {
+    const i = {
+      data: [],
+      headers: [],
+      errors: []
+    };
+    if (!B()) {
+      i.errors.push("SheetJS (xlsx) library is not loaded."), e(i);
+      return;
+    }
+    const s = I(), n = new FileReader();
+    n.onload = (o) => {
+      var l;
+      try {
+        const a = (l = o.target) == null ? void 0 : l.result, r = s.read(a, { type: "array" });
+        if (!r.SheetNames.includes(t)) {
+          i.errors.push(`Sheet "${t}" not found. Available sheets: ${r.SheetNames.join(", ")}`), e(i);
+          return;
+        }
+        const h = r.Sheets[t], p = s.utils.sheet_to_json(h, { header: 1 });
+        if (p.length === 0) {
+          i.errors.push("Excel sheet is empty"), e(i);
+          return;
+        }
+        i.headers = p[0].map((c) => String(c ?? ""));
+        for (let c = 1; c < p.length; c++) {
+          const u = {}, g = p[c];
+          i.headers.forEach((m, C) => {
+            u[m] = g[C] ?? "";
+          }), Object.values(u).some((m) => m !== "") && i.data.push(u);
+        }
+        e(i);
+      } catch (a) {
+        i.errors.push(`Excel parsing error: ${a instanceof Error ? a.message : "Unknown error"}`), e(i);
+      }
+    }, n.onerror = () => {
+      i.errors.push("Failed to read file"), e(i);
+    }, n.readAsArrayBuffer(d);
+  });
+}
+function N(d, t, e = "text/plain") {
+  const i = d instanceof Blob ? d : new Blob([d], { type: e }), s = URL.createObjectURL(i), n = document.createElement("a");
+  n.href = s, n.download = t, n.style.display = "none", document.body.appendChild(n), n.click(), document.body.removeChild(n), URL.revokeObjectURL(s);
+}
+function Y(d) {
+  const t = O(d), e = (d.options.filename || "export") + ".csv";
+  N(t, e, "text/csv;charset=utf-8");
+}
+function J(d) {
+  const t = A(d), e = (d.options.filename || "export") + ".json";
+  N(t, e, "application/json");
+}
+const Q = {
+  enabled: !0,
+  maxSize: 50
+};
+class Z {
+  constructor(t = {}) {
+    this.undoStack = [], this.redoStack = [], this.options = { ...Q, ...t };
+  }
+  /**
+   * Check if history tracking is enabled
+   */
+  isEnabled() {
+    return this.options.enabled;
+  }
+  /**
+   * Set enabled state
+   */
+  setEnabled(t) {
+    this.options.enabled = t;
+  }
+  /**
+   * Set maximum stack size
+   */
+  setMaxSize(t) {
+    this.options.maxSize = t, this.trimStack();
+  }
+  /**
+   * Push an action to the undo stack
+   */
+  push(t) {
+    this.options.enabled && (this.undoStack.push(t), this.trimStack(), this.redoStack = []);
+  }
+  /**
+   * Create and push a cell edit action
+   */
+  pushCellEdit(t, e, i, s) {
+    this.push({
+      type: "cell_edit",
+      timestamp: Date.now(),
+      data: { rowIndex: t, field: e, oldValue: i, newValue: s }
+    });
+  }
+  /**
+   * Create and push a bulk edit action (paste, cut, delete)
+   */
+  pushBulkEdit(t, e) {
+    e.length !== 0 && this.push({
+      type: t,
+      timestamp: Date.now(),
+      data: { changes: e }
+    });
+  }
+  /**
+   * Create and push a row add action
+   */
+  pushRowAdd(t, e) {
+    this.push({
+      type: "row_add",
+      timestamp: Date.now(),
+      data: { row: { ...t }, index: e }
+    });
+  }
+  /**
+   * Create and push a row remove action
+   */
+  pushRowRemove(t, e) {
+    this.push({
+      type: "row_remove",
+      timestamp: Date.now(),
+      data: { row: { ...t }, index: e }
+    });
+  }
+  /**
+   * Pop from undo stack and push to redo stack
+   * Returns the action to be undone
+   */
+  popUndo() {
+    if (!this.options.enabled || this.undoStack.length === 0)
+      return null;
+    const t = this.undoStack.pop();
+    return this.redoStack.push(t), t;
+  }
+  /**
+   * Pop from redo stack and push to undo stack
+   * Returns the action to be redone
+   */
+  popRedo() {
+    if (!this.options.enabled || this.redoStack.length === 0)
+      return null;
+    const t = this.redoStack.pop();
+    return this.undoStack.push(t), t;
+  }
+  /**
+   * Check if undo is available
+   */
+  canUndo() {
+    return this.options.enabled && this.undoStack.length > 0;
+  }
+  /**
+   * Check if redo is available
+   */
+  canRedo() {
+    return this.options.enabled && this.redoStack.length > 0;
+  }
+  /**
+   * Get undo stack size
+   */
+  getUndoCount() {
+    return this.undoStack.length;
+  }
+  /**
+   * Get redo stack size
+   */
+  getRedoCount() {
+    return this.redoStack.length;
+  }
+  /**
+   * Clear all history
+   */
+  clear() {
+    this.undoStack = [], this.redoStack = [];
+  }
+  /**
+   * Trim undo stack to max size
+   */
+  trimStack() {
+    for (; this.undoStack.length > this.options.maxSize; )
+      this.undoStack.shift();
+  }
+}
+class tt {
+  /**
+   * 단일 값에 대한 유효성 검사
+   * @param value - 검사할 값
+   * @param rules - 유효성 규칙 배열
+   * @param row - 전체 행 데이터 (custom validator용)
+   * @returns 검사 결과
+   */
+  static validate(t, e, i) {
+    const s = [];
+    for (const n of e) {
+      const o = this.validateRule(t, n, i);
+      o && s.push({ field: "", message: o });
+    }
+    return {
+      valid: s.length === 0,
+      errors: s
+    };
+  }
+  /**
+   * 단일 규칙 검사
+   * @param value - 검사할 값
+   * @param rule - 유효성 규칙
+   * @param row - 전체 행 데이터
+   * @returns 에러 메시지 또는 null
+   */
+  static validateRule(t, e, i) {
+    switch (e.type) {
+      case "required":
+        return this.validateRequired(t) ? null : e.message;
+      case "min":
+        return this.validateMin(t, e.value) ? null : e.message;
+      case "max":
+        return this.validateMax(t, e.value) ? null : e.message;
+      case "minLength":
+        return this.validateMinLength(t, e.value) ? null : e.message;
+      case "maxLength":
+        return this.validateMaxLength(t, e.value) ? null : e.message;
+      case "pattern":
+        return this.validatePattern(t, e.value) ? null : e.message;
+      case "custom":
+        if (e.validator) {
+          const s = e.validator(t, i || {});
+          return typeof s == "boolean" ? s ? null : e.message : s || null;
+        }
+        return null;
+      default:
+        return null;
+    }
+  }
+  /**
+   * Required 검사 - null, undefined, 빈 문자열 체크
+   */
+  static validateRequired(t) {
+    return !(t == null || typeof t == "string" && t.trim() === "");
+  }
+  /**
+   * Min 검사 - 숫자 최소값
+   */
+  static validateMin(t, e) {
+    if (t == null)
+      return !0;
+    const i = typeof t == "number" ? t : parseFloat(String(t));
+    return !isNaN(i) && i >= e;
+  }
+  /**
+   * Max 검사 - 숫자 최대값
+   */
+  static validateMax(t, e) {
+    if (t == null)
+      return !0;
+    const i = typeof t == "number" ? t : parseFloat(String(t));
+    return !isNaN(i) && i <= e;
+  }
+  /**
+   * MinLength 검사 - 문자열 최소 길이
+   */
+  static validateMinLength(t, e) {
+    return t == null ? !0 : String(t).length >= e;
+  }
+  /**
+   * MaxLength 검사 - 문자열 최대 길이
+   */
+  static validateMaxLength(t, e) {
+    return t == null ? !0 : String(t).length <= e;
+  }
+  /**
+   * Pattern 검사 - 정규식 매칭
+   */
+  static validatePattern(t, e) {
+    return t == null ? !0 : (typeof e == "string" ? new RegExp(e) : e).test(String(t));
+  }
+  /**
+   * 전체 행 유효성 검사
+   * @param row - 검사할 행 데이터
+   * @param columns - 컬럼 정의 (validation 규칙 포함)
+   * @returns 검사 결과
+   */
+  static validateRow(t, e) {
+    const i = [];
+    for (const s of e)
+      if (s.validation && s.validation.length > 0) {
+        const n = t[s.field], o = this.validate(n, s.validation, t);
+        if (!o.valid)
+          for (const l of o.errors)
+            i.push({
+              field: s.field,
+              message: l.message
+            });
+      }
+    return {
+      valid: i.length === 0,
+      errors: i
+    };
+  }
+  /**
+   * 전체 데이터 유효성 검사
+   * @param data - 검사할 데이터 배열
+   * @param columns - 컬럼 정의
+   * @returns 행별 검사 결과 배열
+   */
+  static validateAll(t, e) {
+    return t.map((i) => this.validateRow(i, e));
+  }
+}
+class et {
+  /**
+   * Create an editor element based on type
+   */
+  static createEditor(t, e, i, s, n) {
+    const { type: o } = e;
+    switch (o) {
+      case "text":
+      case "number":
+        return this.createTextEditor(t, e, i, s, n);
+      case "select":
+        return this.createSelectEditor(t, e, i, s, n);
+      case "date":
+        return this.createDateEditor(t, e, i, s, n);
+      case "checkbox":
+        return this.createCheckboxEditor(t, e, i, s, n);
+      case "custom":
+        return this.createCustomEditor(t, e, i, s, n);
+      default:
+        return this.createTextEditor(t, e, i, s, n);
+    }
+  }
+  /**
+   * Create text/number input editor
+   */
+  static createTextEditor(t, e, i, s, n) {
+    const o = document.createElement("input");
+    return o.className = "velox-edit-input", o.type = e.type === "number" ? "number" : "text", o.value = t != null ? String(t) : "", e.placeholder && (o.placeholder = e.placeholder), e.type === "number" && (e.min !== void 0 && (o.min = String(e.min)), e.max !== void 0 && (o.max = String(e.max)), e.step !== void 0 && (o.step = String(e.step))), o.addEventListener("blur", () => {
+      const l = e.type === "number" ? parseFloat(o.value) : o.value;
+      i(l);
+    }), o.addEventListener("keydown", (l) => {
+      if (l.key === "Enter") {
+        l.preventDefault(), l.stopPropagation();
+        const a = e.type === "number" ? parseFloat(o.value) : o.value;
+        i(a), n && n(l.shiftKey ? "up" : "down");
+      } else if (l.key === "Tab") {
+        l.preventDefault(), l.stopPropagation();
+        const a = e.type === "number" ? parseFloat(o.value) : o.value;
+        i(a), n && n(l.shiftKey ? "left" : "right");
+      } else l.key === "Escape" && (l.preventDefault(), l.stopPropagation(), s());
+    }), o;
+  }
+  /**
+   * Create select dropdown editor
+   */
+  static createSelectEditor(t, e, i, s, n) {
+    const o = document.createElement("select");
+    return o.className = "velox-edit-select", e.options && e.options.length > 0 && e.options.forEach((l) => {
+      const a = document.createElement("option");
+      a.value = String(l.value ?? ""), a.textContent = l.label, l.value === t && (a.selected = !0), o.appendChild(a);
+    }), o.addEventListener("change", () => {
+      console.log("📦 Select change event", o.value), i(o.value);
+    }), o.addEventListener("keydown", (l) => {
+      l.key === "Enter" ? (l.preventDefault(), l.stopPropagation(), i(o.value), n && n(l.shiftKey ? "up" : "down")) : l.key === "Tab" ? (l.preventDefault(), l.stopPropagation(), i(o.value), n && n(l.shiftKey ? "left" : "right")) : l.key === "Escape" && (l.preventDefault(), l.stopPropagation(), s());
+    }), o;
+  }
+  /**
+   * Create date input editor
+   */
+  static createDateEditor(t, e, i, s, n) {
+    const o = document.createElement("input");
+    if (o.className = "velox-edit-input velox-edit-date", o.type = "date", t instanceof Date)
+      o.value = t.toISOString().split("T")[0];
+    else if (typeof t == "string" && t) {
+      const l = new Date(t);
+      isNaN(l.getTime()) || (o.value = l.toISOString().split("T")[0]);
+    }
+    return o.addEventListener("blur", () => {
+      i(o.value ? new Date(o.value) : null);
+    }), o.addEventListener("keydown", (l) => {
+      l.key === "Enter" ? (l.preventDefault(), l.stopPropagation(), i(o.value ? new Date(o.value) : null), n && n(l.shiftKey ? "up" : "down")) : l.key === "Tab" ? (l.preventDefault(), l.stopPropagation(), i(o.value ? new Date(o.value) : null), n && n(l.shiftKey ? "left" : "right")) : l.key === "Escape" && (l.preventDefault(), l.stopPropagation(), s());
+    }), o;
+  }
+  /**
+   * Create checkbox editor
+   */
+  static createCheckboxEditor(t, e, i, s, n) {
+    const o = document.createElement("div");
+    o.className = "velox-edit-checkbox-container";
+    const l = document.createElement("input");
+    return l.className = "velox-edit-checkbox", l.type = "checkbox", l.checked = !!t, o.appendChild(l), l.addEventListener("change", () => {
+      console.log("📦 Checkbox change event", l.checked), i(l.checked);
+    }), l.addEventListener("keydown", (a) => {
+      a.key === "Enter" || a.key === " " ? (a.preventDefault(), a.stopPropagation(), l.checked = !l.checked, i(l.checked), a.key === "Enter" && n && n(a.shiftKey ? "up" : "down")) : a.key === "Tab" ? (a.preventDefault(), a.stopPropagation(), i(l.checked), n && n(a.shiftKey ? "left" : "right")) : a.key === "Escape" && (a.preventDefault(), a.stopPropagation(), s());
+    }), o;
+  }
+  /**
+   * Create custom editor using renderer function
+   */
+  static createCustomEditor(t, e, i, s, n) {
+    const o = document.createElement("div");
+    if (o.className = "velox-edit-custom", e.renderer)
+      e.renderer(o, t, i, s);
+    else
+      return this.createTextEditor(t, { type: "text" }, i, s, n);
+    return o;
+  }
+}
+class it {
+  // ms
+  constructor(t) {
+    this.container = t, this.tooltip = null, this.currentCell = null, this.hideTimeout = null, this.HIDE_DELAY = 100, this.createTooltipElement();
+  }
+  /**
+   * Create tooltip element
+   */
+  createTooltipElement() {
+    this.tooltip = document.createElement("div"), this.tooltip.className = "velox-tooltip", this.tooltip.style.display = "none", this.tooltip.style.position = "absolute", this.tooltip.style.pointerEvents = "none", this.container.appendChild(this.tooltip);
+  }
+  /**
+   * Show tooltip for a cell
+   */
+  show(t, e, i, s) {
+    this.hideTimeout && (clearTimeout(this.hideTimeout), this.hideTimeout = null), this.currentCell = t;
+    let n = null;
+    if (s.tooltip === !0 ? n = this.getAutoTooltipContent(t, e) : typeof s.tooltip == "function" && (n = s.tooltip(e, i)), !n || !this.tooltip) {
+      this.hide();
+      return;
+    }
+    this.tooltip.textContent = n, this.tooltip.style.display = "block", this.positionTooltip(t);
+  }
+  /**
+   * Get auto tooltip content for truncated text
+   */
+  getAutoTooltipContent(t, e) {
+    const i = t.querySelector(".velox-cell-content");
+    return i && (i.scrollWidth > i.clientWidth || i.scrollHeight > i.clientHeight) ? String(e ?? "") : null;
+  }
+  /**
+   * Position tooltip relative to cell
+   */
+  positionTooltip(t) {
+    if (!this.tooltip) return;
+    const e = t.getBoundingClientRect(), i = this.container.getBoundingClientRect(), s = this.tooltip.getBoundingClientRect();
+    let n = e.bottom - i.top + 5, o = e.left - i.left;
+    const l = window.innerWidth, a = window.innerHeight;
+    e.left + s.width > l && (o = e.right - i.left - s.width), e.bottom + s.height + 5 > a && (n = e.top - i.top - s.height - 5), this.tooltip.style.top = `${n}px`, this.tooltip.style.left = `${o}px`;
+  }
+  /**
+   * Hide tooltip
+   */
+  hide() {
+    this.hideTimeout && clearTimeout(this.hideTimeout), this.hideTimeout = window.setTimeout(() => {
+      this.tooltip && (this.tooltip.style.display = "none", this.tooltip.textContent = ""), this.currentCell = null, this.hideTimeout = null;
+    }, this.HIDE_DELAY);
+  }
+  /**
+   * Update tooltip position (for scroll events)
+   */
+  update() {
+    this.currentCell && this.tooltip && this.tooltip.style.display !== "none" && this.positionTooltip(this.currentCell);
+  }
+  /**
+   * Destroy tooltip
+   */
+  destroy() {
+    this.hideTimeout && clearTimeout(this.hideTimeout), this.tooltip && (this.tooltip.remove(), this.tooltip = null), this.currentCell = null;
+  }
+}
+class st {
+  constructor(t) {
+    this.ctx = t;
+  }
+  /**
+   * 전체 그리드 렌더링
+   */
+  render() {
+    const t = this.ctx.getState();
+    console.log("🎨 GridRenderer.render() called", { editing: t.edit.editing }), this.renderHeader(), this.renderBody(), this.renderFooter(), this.updateLoadingState(), console.log("🎨 GridRenderer.render() completed", { editing: t.edit.editing });
+  }
+  /**
+   * 헤더 렌더링 (Phase 14: Fixed Right 지원)
+   */
+  renderHeader() {
+    const t = this.ctx;
+    if (t.fixedLeftHeader) {
+      t.fixedLeftHeader.innerHTML = "";
+      const i = f("div", "velox-header-row");
+      t.getFixedLeftColumns().forEach((s) => {
+        if (s.field === "__drag") {
+          const n = f("div", "velox-row-drag-handle");
+          n.style.visibility = "hidden", i.appendChild(n);
+        } else if (s.field === "__checkbox")
+          i.appendChild(this.createHeaderCheckbarCell());
+        else if (s.field === "__rownum") {
+          const n = f("div", "velox-header-cell velox-rownumber-cell");
+          n.textContent = "#", i.appendChild(n);
+        } else
+          i.appendChild(this.createHeaderCell(s));
+      }), t.fixedLeftHeader.appendChild(i);
+    }
+    const e = f("div", "velox-header-row");
+    if (t.getScrollableColumns().forEach((i) => {
+      if (i.field === "__drag") {
+        const s = f("div", "velox-row-drag-handle");
+        s.style.visibility = "hidden", e.appendChild(s);
+      } else if (i.field === "__checkbox")
+        e.appendChild(this.createHeaderCheckbarCell());
+      else if (i.field === "__rownum") {
+        const s = f("div", "velox-header-cell velox-rownumber-cell");
+        s.textContent = "#", e.appendChild(s);
+      } else
+        e.appendChild(this.createHeaderCell(i));
+    }), t.headerElement.innerHTML = "", t.headerElement.appendChild(e), t.fixedRightHeader) {
+      t.fixedRightHeader.innerHTML = "";
+      const i = f("div", "velox-header-row");
+      t.getFixedRightColumns().forEach(
+        (s) => i.appendChild(this.createHeaderCell(s))
+      ), t.fixedRightHeader.appendChild(i), this.updateFixedRightWidth();
+    }
+  }
+  /**
+   * CheckBar 헤더 셀 생성
+   */
+  createHeaderCheckbarCell() {
+    const t = this.ctx, e = t.getOptions(), i = t.getState(), s = f("div", "velox-header-cell velox-checkbox-cell"), n = e.checkBar;
+    if (n.showAll && !n.exclusive) {
+      const o = f("input", "velox-checkbox");
+      o.type = "checkbox";
+      const l = i.checkBar.checkableRows.size, a = i.checkBar.checkedRows.size, r = l > 0 && a === l, h = a > 0 && !r;
+      o.checked = r, o.indeterminate = h, o.addEventListener("change", () => t.checkAll(o.checked)), s.appendChild(o);
+    } else if (n.exclusive) {
+      const o = f("span", "velox-checkbox-label");
+      o.textContent = "선택", s.appendChild(o);
+    }
+    return s;
+  }
+  /**
+   * 헤더 셀 생성
+   */
+  createHeaderCell(t) {
+    var p;
+    const e = this.ctx, i = e.getOptions(), s = e.getState(), n = f("div", "velox-header-cell");
+    n.dataset.field = t.field;
+    const o = t.headerAlign || t.align || "left";
+    if (y(n, `velox-header-cell--align-${o}`), t.width ? (n.style.width = `${t.width}px`, n.style.minWidth = `${t.minWidth || t.width}px`, n.style.maxWidth = `${t.width}px`, n.style.flexShrink = "0") : (n.style.flex = "1", n.style.minWidth = `${t.minWidth || 100}px`), t.headerClass && y(n, t.headerClass), i.sortable && t.sortable !== !1) {
+      y(n, "velox-header-cell--sortable");
+      const c = s.sort.find((u) => u.field === t.field);
+      c != null && c.direction && y(n, "velox-header-cell--sorted");
+    }
+    const l = f("div", "velox-header-content"), a = f("span", "velox-column-drag-handle");
+    a.innerHTML = "⋮⋮", a.title = "드래그하여 컬럼 순서 변경", a.addEventListener("mousedown", (c) => e.startColumnDrag(c, t)), l.appendChild(a);
+    const r = f("span", "velox-header-text");
+    if (r.textContent = t.header, l.appendChild(r), n.appendChild(l), i.sortable && t.sortable !== !1) {
+      const c = f("button", "velox-sort-btn"), u = s.sort.find((g) => g.field === t.field);
+      (u == null ? void 0 : u.direction) === "asc" ? (y(c, "velox-sort-btn--asc"), c.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M3 4.5h14.25M3 9h9.75M3 13.5h5.25m5.25-.75L17.25 9m0 0L21 12.75M17.25 9v12" /></svg>') : ((u == null ? void 0 : u.direction) === "desc" && y(c, "velox-sort-btn--desc"), c.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M3 4.5h14.25M3 9h9.75M3 13.5h9.75m4.5-4.5v12m0 0-3.75-3.75M17.25 21 21 17.25" /></svg>'), u != null && u.direction && y(c, "velox-sort-btn--active"), c.title = "정렬", c.addEventListener("click", (g) => {
+        g.stopPropagation(), e.handleSort(t.field);
+      }), n.appendChild(c);
+    }
+    if (i.filterable && t.filterable !== !1) {
+      const c = f("button", "velox-filter-btn");
+      c.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M12 3c2.755 0 5.455.232 8.083.678.533.09.917.556.917 1.096v1.044a2.25 2.25 0 0 1-.659 1.591l-5.432 5.432a2.25 2.25 0 0 0-.659 1.591v2.927a2.25 2.25 0 0 1-1.244 2.013L9.75 21v-6.568a2.25 2.25 0 0 0-.659-1.591L3.659 7.409A2.25 2.25 0 0 1 3 5.818V4.774c0-.54.384-1.006.917-1.096A48.32 48.32 0 0 1 12 3Z" /></svg>', ((p = s.filter) == null ? void 0 : p.conditions.some((g) => g.field === t.field)) && y(c, "velox-filter-btn--active"), c.addEventListener("click", (g) => {
+        g.stopPropagation(), e.showFilterPopup(t, c);
+      }), n.appendChild(c);
+    }
+    const h = f("button", "velox-column-menu-btn");
+    if (h.innerHTML = "⋯", h.title = "컬럼 메뉴", h.addEventListener("click", (c) => {
+      c.stopPropagation(), e.showColumnMenu(t, h);
+    }), n.appendChild(h), i.resizable && t.resizable !== !1) {
+      const c = f("div", "velox-resize-handle");
+      c.addEventListener("mousedown", (u) => e.startResize(u, t)), n.appendChild(c);
+    }
+    return n;
+  }
+  /**
+   * 바디 렌더링 (Phase 14: Fixed Right 지원)
+   */
+  renderBody() {
+    const t = this.ctx, e = t.getOptions(), i = t.getVisibleRows(), s = t.getVirtualState(), n = e.rowHeight || 40;
+    if (t.fixedLeftBodyInner && (t.fixedLeftBodyInner.innerHTML = "", e.virtualScroll ? (t.fixedLeftBodyInner.style.height = `${s.totalHeight}px`, t.fixedLeftBodyInner.style.position = "relative") : (t.fixedLeftBodyInner.style.height = "", t.fixedLeftBodyInner.style.position = ""), i.forEach(({ data: o, index: l }) => {
+      const a = this.createRowBase(o, l, "fixedLeft");
+      e.virtualScroll && (a.style.position = "absolute", a.style.top = `${l * n}px`, a.style.left = "0", a.style.right = "0"), t.fixedLeftBodyInner.appendChild(a);
+    })), t.bodyInner.innerHTML = "", e.virtualScroll ? (t.bodyInner.style.height = `${s.totalHeight}px`, t.bodyInner.style.position = "relative") : (t.bodyInner.style.height = "", t.bodyInner.style.position = ""), i.length === 0) {
+      const o = f("div", "velox-empty");
+      o.textContent = e.emptyMessage || "데이터가 없습니다.", t.bodyInner.appendChild(o);
+      return;
+    }
+    i.forEach(({ data: o, index: l }) => {
+      const a = this.createRowBase(o, l, "scrollable");
+      e.virtualScroll && (a.style.position = "absolute", a.style.top = `${l * n}px`, a.style.left = "0", a.style.right = "0"), t.bodyInner.appendChild(a);
+    }), t.fixedRightBodyInner && (t.fixedRightBodyInner.innerHTML = "", e.virtualScroll ? (t.fixedRightBodyInner.style.height = `${s.totalHeight}px`, t.fixedRightBodyInner.style.position = "relative") : (t.fixedRightBodyInner.style.height = "", t.fixedRightBodyInner.style.position = ""), i.forEach(({ data: o, index: l }) => {
+      const a = this.createRowBase(o, l, "fixedRight");
+      e.virtualScroll && (a.style.position = "absolute", a.style.top = `${l * n}px`, a.style.left = "0", a.style.right = "0"), t.fixedRightBodyInner.appendChild(a);
+    }), this.updateFixedRightWidth());
+  }
+  /**
+   * Update Fixed Right container width based on columns
+   * Phase 14: Ensure header and body alignment
+   */
+  updateFixedRightWidth() {
+    const t = this.ctx;
+    if (!t.fixedRightContainer) return;
+    const e = t.getFixedRightColumns();
+    if (e.length === 0) return;
+    let i = 0;
+    e.forEach((n) => {
+      i += n.width || n.minWidth || 100;
+    });
+    const s = this.getScrollbarWidth(t.fixedRightBody);
+    t.fixedRightContainer.style.width = `${i + s}px`, t.fixedRightContainer.style.minWidth = `${i + s}px`, t.fixedRightContainer.style.maxWidth = `${i + s}px`, t.fixedRightHeader && s > 0 && (t.fixedRightHeader.style.paddingRight = `${s}px`), t.fixedRightFooter && s > 0 && (t.fixedRightFooter.style.paddingRight = `${s}px`);
+  }
+  /**
+   * Get scrollbar width of an element
+   * Phase 14: For Fixed Right alignment
+   */
+  getScrollbarWidth(t) {
+    return t ? t.offsetWidth - t.clientWidth : 0;
+  }
+  /**
+   * Row 생성 (통합 메서드)
+   * @param area - 'fixedLeft' | 'scrollable' | 'fixedRight' (Phase 14)
+   */
+  createRowBase(t, e, i) {
+    const s = this.ctx, n = s.getOptions(), o = s.getState(), l = f("div", "velox-row");
+    return l.dataset.rowIndex = String(e), e % 2 === 1 && y(l, "velox-row--alt"), n.selectionStyle === "row" && o.selection.selectedRows.has(e) && y(l, "velox-row--selected"), i === "fixedLeft" && o.checkBar.checkedRows.has(e) && y(l, "velox-row--checked"), l.addEventListener("click", (a) => {
+      const r = a.target;
+      r.classList.contains("velox-checkbox") || r.classList.contains("velox-row-drag-handle") || s.handleRowClick(e, a);
+    }), i !== "fixedLeft" && l.addEventListener("dblclick", (a) => s.handleRowDoubleClick(e, a)), i === "fixedLeft" ? s.getFixedLeftColumns().forEach((a) => {
+      if (a.field === "__drag") {
+        const r = f("div", "velox-row-drag-handle");
+        r.innerHTML = "☰", r.title = "드래그하여 행 순서 변경", r.addEventListener("mousedown", (h) => s.startRowDrag(h, e, l)), l.appendChild(r);
+      } else if (a.field === "__checkbox")
+        l.appendChild(this.createCheckbarCell(e));
+      else if (a.field === "__rownum") {
+        const r = f("div", "velox-cell velox-rownumber-cell");
+        r.textContent = String(e + 1), l.appendChild(r);
+      } else
+        l.appendChild(this.createCell(t, e, a));
+    }) : i === "scrollable" ? s.getScrollableColumns().forEach((a) => {
+      if (a.field === "__drag") {
+        const r = f("div", "velox-row-drag-handle");
+        r.innerHTML = "☰", r.title = "드래그하여 행 순서 변경", r.addEventListener("mousedown", (h) => s.startRowDrag(h, e, l)), l.appendChild(r);
+      } else if (a.field === "__checkbox")
+        l.appendChild(this.createCheckbarCell(e));
+      else if (a.field === "__rownum") {
+        const r = f("div", "velox-cell velox-rownumber-cell");
+        r.textContent = String(e + 1), l.appendChild(r);
+      } else
+        l.appendChild(this.createCell(t, e, a));
+    }) : i === "fixedRight" && s.getFixedRightColumns().forEach(
+      (a) => l.appendChild(this.createCell(t, e, a))
+    ), l;
+  }
+  /**
+   * CheckBar 셀 생성
+   */
+  createCheckbarCell(t) {
+    const e = this.ctx, i = e.getOptions(), s = e.getState(), n = f("div", "velox-cell velox-checkbox-cell"), o = i.checkBar, l = s.checkBar.checkableRows.has(t), a = s.checkBar.checkedRows.has(t), r = f("input", "velox-checkbox");
+    return r.type = o.exclusive ? "radio" : "checkbox", r.name = o.exclusive ? `${e.getGridId()}-check` : "", r.checked = a, r.disabled = !l, l || y(n, "velox-checkbox-cell--disabled"), r.addEventListener("click", (h) => {
+      console.log("✅ Checkbox clicked", { rowIndex: t, checked: r.checked }), h.stopPropagation();
+    }), r.addEventListener("change", () => {
+      if (console.log("🔄 Checkbox changed", { rowIndex: t, checked: r.checked }), o.exclusive) {
+        const h = { ...e.getState().edit };
+        s.checkBar.checkedRows.clear(), r.checked && s.checkBar.checkedRows.add(t), this.render(), h.editing && h.rowIndex !== null && h.field !== null && (e.getState().edit = h, e.renderEditCell(h.rowIndex, h.field, h.originalValue)), e.emitEvent("onCheckChange", t, r.checked);
+      } else
+        e.checkItem(t, r.checked);
+    }), n.appendChild(r), n;
+  }
+  /**
+   * Cell 생성
+   */
+  createCell(t, e, i) {
+    const s = this.ctx, n = s.getOptions(), o = s.getState(), l = f("div", "velox-cell");
+    l.dataset.field = i.field, l.dataset.rowIndex = String(e);
+    const a = i.align || "left";
+    if (y(l, `velox-cell--align-${a}`), i.width ? (l.style.width = `${i.width}px`, l.style.minWidth = `${i.minWidth || i.width}px`, l.style.maxWidth = `${i.width}px`, l.style.flexShrink = "0") : (l.style.flex = "1", l.style.minWidth = `${i.minWidth || 100}px`), i.cellClass) {
+      const u = typeof i.cellClass == "function" ? i.cellClass(t[i.field], t) : i.cellClass;
+      u && y(l, u);
+    }
+    const r = `${e}:${i.field}`;
+    o.selection.selectedCells.has(r) && y(l, "velox-cell--selected");
+    const h = o.selection.focusedCell;
+    h && h.rowIndex === e && h.field === i.field && y(l, "velox-cell--focused"), n.editable && i.editable !== !1 && (y(l, "velox-cell--editable"), l.addEventListener("dblclick", (u) => {
+      if (l.classList.contains("velox-cell--editing")) {
+        console.log("🚫 Double click ignored - already editing"), u.stopPropagation(), u.preventDefault();
+        return;
+      }
+      console.log("🖱️🖱️ Double click detected", { rowIndex: e, field: i.field }), u.stopPropagation(), s.startEdit(e, i.field);
+    }));
+    const p = t[i.field], c = f("span", "velox-cell-content");
+    return i.renderer ? c.innerHTML = i.renderer(p, t, i) : i.formatter ? c.textContent = i.formatter(p, t, i) : c.textContent = k(p, i.type), l.appendChild(c), l.addEventListener("click", (u) => {
+      if (l.classList.contains("velox-cell--editing")) {
+        const g = u.target;
+        if (g.tagName === "INPUT" || g.tagName === "SELECT" || g.tagName === "BUTTON" || g.tagName === "TEXTAREA") {
+          console.log("✅ Interactive element click allowed during edit"), u.stopPropagation();
+          return;
+        }
+        console.log("🚫 Cell click ignored - editing mode (cell background)"), u.stopPropagation(), u.preventDefault();
+        return;
+      }
+      s.handleCellClick(e, i.field, p, u);
+    }), l.addEventListener("mousedown", (u) => {
+      if (l.classList.contains("velox-cell--editing")) {
+        console.log("🔒 Cell mousedown - editing mode (ignored in renderer)");
+        return;
+      }
+      n.selectionStyle === "block" && u.button === 0 && s.startBlockSelection(e, i.field);
+    }), l.addEventListener("mouseenter", () => {
+      s.isBlockSelecting() && s.updateBlockSelection(e, i.field);
+    }), i.tooltip && (y(l, "velox-cell--has-tooltip"), l.addEventListener("mouseenter", () => s.showTooltip(l, p, t, i)), l.addEventListener("mouseleave", () => s.hideTooltip())), l;
+  }
+  /**
+   * Footer Summary 렌더링 (Phase 13, Phase 14: Fixed Right 지원)
+   */
+  renderFooter() {
+    var i, s;
+    const t = this.ctx, e = t.getOptions();
+    if ((i = e.footerSummary) != null && i.visible) {
+      if (t.fixedLeftFooter) {
+        t.fixedLeftFooter.innerHTML = "";
+        const n = f("div", "velox-footer-row");
+        if (e.rowDraggable) {
+          const o = f("div", "velox-row-drag-handle");
+          o.style.visibility = "hidden", n.appendChild(o);
+        }
+        if ((s = e.checkBar) != null && s.visible) {
+          const o = f("div", "velox-footer-cell velox-checkbox-cell");
+          n.appendChild(o);
+        }
+        t.getFixedLeftColumns().forEach(
+          (o) => n.appendChild(this.createFooterCell(o))
+        ), t.fixedLeftFooter.appendChild(n);
+      }
+      if (t.footerElement) {
+        t.footerElement.innerHTML = "";
+        const n = f("div", "velox-footer-row");
+        if (e.showRowNumbers) {
+          const o = f("div", "velox-footer-cell velox-rownumber-cell");
+          n.appendChild(o);
+        }
+        t.getScrollableColumns().forEach(
+          (o) => n.appendChild(this.createFooterCell(o))
+        ), t.footerElement.appendChild(n);
+      }
+      if (t.fixedRightFooter) {
+        t.fixedRightFooter.innerHTML = "";
+        const n = f("div", "velox-footer-row");
+        t.getFixedRightColumns().forEach(
+          (o) => n.appendChild(this.createFooterCell(o))
+        ), t.fixedRightFooter.appendChild(n);
+      }
+    }
+  }
+  /**
+   * Footer 셀 생성 (Phase 13)
+   */
+  createFooterCell(t) {
+    var l, a;
+    const e = this.ctx, i = e.getOptions(), s = f("div", "velox-footer-cell");
+    s.dataset.field = t.field;
+    const n = t.align || "left";
+    y(s, `velox-footer-cell--align-${n}`), t.width ? (s.style.width = `${t.width}px`, s.style.minWidth = `${t.minWidth || t.width}px`) : (s.style.flex = "1", s.style.minWidth = `${t.minWidth || 100}px`);
+    const o = ((a = (l = i.footerSummary) == null ? void 0 : l.columns) == null ? void 0 : a[t.field]) || t.summary;
+    if (o) {
+      const r = e.getSummaryValue(t.field), h = f("span", "velox-footer-content");
+      if (o.label) {
+        const c = f("span", "velox-footer-label");
+        c.textContent = o.label, h.appendChild(c);
+      }
+      const p = f("span", "velox-footer-value");
+      o.formatter ? p.textContent = o.formatter(r) : p.textContent = k(r, t.type), h.appendChild(p), s.appendChild(h), o.className && y(s, o.className);
+    }
+    return s;
+  }
+  /**
+   * Loading 상태 업데이트
+   */
+  updateLoadingState() {
+    const t = this.ctx, e = t.getOptions();
+    t.loadingOverlay && (t.loadingOverlay.style.display = e.loading ? "flex" : "none");
+  }
+  /**
+   * Row validation 상태 업데이트
+   */
+  updateRowValidationState(t) {
+    const e = this.ctx, i = e.getState(), s = e.rootElement.querySelector(`[data-row-index="${t}"]`);
+    if (!s) return;
+    s.querySelectorAll(".velox-cell").forEach((o) => {
+      const a = o.dataset.field;
+      if (!a) return;
+      const r = i.columns.find((h) => h.field === a);
+      r != null && r.validation;
+    });
+  }
+}
+class nt {
+  constructor(t) {
+    this.ctx = t, this.filterPopup = null, this.boundHandleOutsideClick = this.handleOutsideClick.bind(this);
+  }
+  /**
+   * Filter 팝업 표시
+   */
+  showFilterPopup(t, e) {
+    var C;
+    this.closeFilterPopup();
+    const i = this.ctx, s = i.getState(), n = f("div", "velox-filter-popup"), o = e.getBoundingClientRect(), l = i.rootElement.getBoundingClientRect();
+    n.style.top = `${o.bottom - l.top + 5}px`, n.style.left = `${Math.max(0, o.left - l.left - 100)}px`;
+    const a = [...new Set(s.data.map((x) => x[t.field]))].filter((x) => x != null).sort(), r = (C = s.filter) == null ? void 0 : C.conditions.find((x) => x.field === t.field), h = f("select", "velox-filter-operator");
+    [
+      { value: "contains", label: "포함" },
+      { value: "equals", label: "같음" },
+      { value: "notEquals", label: "같지 않음" },
+      { value: "startsWith", label: "시작" },
+      { value: "endsWith", label: "끝" },
+      { value: "greaterThan", label: ">" },
+      { value: "lessThan", label: "<" },
+      { value: "greaterThanOrEqual", label: ">=" },
+      { value: "lessThanOrEqual", label: "<=" },
+      { value: "isEmpty", label: "비어있음" },
+      { value: "isNotEmpty", label: "비어있지 않음" }
+    ].forEach((x) => {
+      const v = f("option");
+      v.value = x.value, v.textContent = x.label, (r == null ? void 0 : r.operator) === x.value && (v.selected = !0), h.appendChild(v);
+    }), n.appendChild(h);
+    const c = f("input", "velox-filter-input");
+    if (c.type = t.type === "number" ? "number" : "text", c.placeholder = "값 입력...", (r == null ? void 0 : r.value) !== void 0 && (c.value = String(r.value)), n.appendChild(c), a.length > 0 && a.length <= 15) {
+      const x = f("div", "velox-filter-list"), v = f("div", "velox-filter-list-label");
+      v.textContent = "빠른 선택:", x.appendChild(v), a.slice(0, 10).forEach((w) => {
+        const S = f("div", "velox-filter-list-item");
+        S.textContent = k(w, t.type), S.addEventListener("click", () => {
+          this.applyColumnFilter(t.field, "equals", w), this.closeFilterPopup();
+        }), x.appendChild(S);
+      }), n.appendChild(x);
+    }
+    const u = f("div", "velox-filter-buttons"), g = f("button", "velox-filter-apply");
+    g.textContent = "적용", g.addEventListener("click", () => {
+      const x = h.value, v = t.type === "number" ? parseFloat(c.value) : c.value;
+      this.applyColumnFilter(t.field, x, v), this.closeFilterPopup();
+    }), u.appendChild(g);
+    const m = f("button", "velox-filter-clear");
+    m.textContent = "해제", m.addEventListener("click", () => {
+      this.removeColumnFilter(t.field), this.closeFilterPopup();
+    }), u.appendChild(m), n.appendChild(u), this.filterPopup = n, i.rootElement.appendChild(n), setTimeout(() => document.addEventListener("click", this.boundHandleOutsideClick), 0), c.focus();
+  }
+  /**
+   * Filter 팝업 닫기
+   */
+  closeFilterPopup() {
+    this.filterPopup && (this.filterPopup.remove(), this.filterPopup = null, document.removeEventListener("click", this.boundHandleOutsideClick));
+  }
+  /**
+   * 외부 클릭 핸들러
+   */
+  handleOutsideClick(t) {
+    this.filterPopup && !this.filterPopup.contains(t.target) && this.closeFilterPopup();
+  }
+  /**
+   * Column filter 적용
+   */
+  applyColumnFilter(t, e, i) {
+    const s = this.ctx, n = s.getState(), o = { field: t, operator: e, value: i };
+    if (n.filter) {
+      const l = n.filter.conditions.filter((a) => a.field !== t);
+      l.push(o), n.filter = { conditions: l, logic: "and" };
+    } else
+      n.filter = { conditions: [o], logic: "and" };
+    s.clearSelectionState(), s.applyDataTransformations(), s.render(), s.emitEvent("onFilter", n.filter);
+  }
+  /**
+   * Column filter 제거
+   */
+  removeColumnFilter(t) {
+    const e = this.ctx, i = e.getState();
+    if (i.filter) {
+      const s = i.filter.conditions.filter((n) => n.field !== t);
+      i.filter = s.length === 0 ? null : { conditions: s, logic: "and" }, e.clearSelectionState(), e.applyDataTransformations(), e.render(), i.filter && e.emitEvent("onFilter", i.filter);
+    }
+  }
+  /**
+   * Filter 팝업이 열려있는지 확인
+   */
+  isOpen() {
+    return this.filterPopup !== null;
+  }
+}
+class ot {
+  constructor(t) {
+    this.ctx = t, this.columnMenuPopup = null, this.boundHandleOutsideClick = this.handleOutsideClick.bind(this);
+  }
+  /**
+   * Column 메뉴 표시
+   */
+  showColumnMenu(t, e) {
+    this.closeColumnMenu();
+    const i = this.ctx, s = i.getOptions(), n = f("div", "velox-column-menu"), o = e.getBoundingClientRect(), l = i.rootElement.getBoundingClientRect();
+    n.style.top = `${o.bottom - l.top + 5}px`, n.style.left = `${o.left - l.left}px`;
+    const a = {
+      field: t.field,
+      column: t,
+      selectedRows: i.getSelectedRows(),
+      selectedCells: i.getSelectedCells(),
+      grid: i
+    }, r = s.contextMenu, h = (r == null ? void 0 : r.showDefaultItems) !== !1, p = (r == null ? void 0 : r.headerItems) || [], c = [
+      {
+        id: "sort-asc",
+        label: "오름차순 정렬",
+        icon: "↑",
+        action: () => i.sort(t.field, "asc")
+      },
+      {
+        id: "sort-desc",
+        label: "내림차순 정렬",
+        icon: "↓",
+        action: () => i.sort(t.field, "desc")
+      },
+      {
+        id: "sort-clear",
+        label: "정렬 해제",
+        icon: "✕",
+        action: () => i.clearSort()
+      },
+      { type: "separator" },
+      {
+        id: "hide",
+        label: "컬럼 숨기기",
+        icon: "👁",
+        action: () => i.hideColumn(t.field)
+      },
+      {
+        id: "autofit",
+        label: "컬럼 너비 자동",
+        icon: "↔",
+        action: () => i.autoFitColumn(t.field)
+      },
+      {
+        id: "autofit-all",
+        label: "모든 컬럼 자동",
+        icon: "⇔",
+        action: () => i.autoFitAllColumns()
+      },
+      { type: "separator" },
+      {
+        id: "fix-left",
+        label: "왼쪽에 고정",
+        icon: "◀",
+        action: () => i.fixColumn(t.field, "left")
+      },
+      {
+        id: "unfix",
+        label: "고정 해제",
+        icon: "◇",
+        action: () => i.fixColumn(t.field, !1)
+      }
+    ];
+    let u = [];
+    h ? (u = [...c], p.length > 0 && (u.push({ type: "separator" }), u.push(...p))) : u = p, u.forEach((g) => {
+      if (typeof g.visible == "function" ? g.visible(a) : g.visible !== !1)
+        if (g.type === "separator") {
+          const C = f("div", "velox-column-menu-separator");
+          n.appendChild(C);
+        } else {
+          const C = f("div", "velox-column-menu-item");
+          g.className && y(C, g.className);
+          const x = typeof g.disabled == "function" ? g.disabled(a) : g.disabled === !0;
+          x && y(C, "velox-column-menu-item--disabled");
+          let v = "";
+          g.icon && (v += `<span class="velox-column-menu-icon">${g.icon}</span>`), v += `<span class="velox-column-menu-label">${g.label || ""}</span>`, g.shortcut && (v += `<span class="velox-column-menu-shortcut">${g.shortcut}</span>`), C.innerHTML = v, x || C.addEventListener("click", () => {
+            var w;
+            (w = g.action) == null || w.call(g, a), this.closeColumnMenu();
+          }), n.appendChild(C);
+        }
+    }), this.columnMenuPopup = n, i.rootElement.appendChild(n), setTimeout(() => document.addEventListener("click", this.boundHandleOutsideClick), 0);
+  }
+  /**
+   * Column 메뉴 닫기
+   */
+  closeColumnMenu() {
+    this.columnMenuPopup && (this.columnMenuPopup.remove(), this.columnMenuPopup = null, document.removeEventListener("click", this.boundHandleOutsideClick));
+  }
+  /**
+   * 외부 클릭 핸들러
+   */
+  handleOutsideClick(t) {
+    this.columnMenuPopup && !this.columnMenuPopup.contains(t.target) && this.closeColumnMenu();
+  }
+  /**
+   * Column 메뉴가 열려있는지 확인
+   */
+  isOpen() {
+    return this.columnMenuPopup !== null;
+  }
+}
+class lt {
+  constructor(t) {
+    this.ctx = t, this.columnDragging = null, this.rowDragging = null, this.resizing = null, this.boundHandleColumnDragMove = this.handleColumnDragMove.bind(this), this.boundHandleColumnDragEnd = this.handleColumnDragEnd.bind(this), this.boundHandleRowDragMove = this.handleRowDragMove.bind(this), this.boundHandleRowDragEnd = this.handleRowDragEnd.bind(this), this.boundHandleResizeMove = this.handleResizeMove.bind(this), this.boundHandleResizeEnd = this.handleResizeEnd.bind(this);
+  }
+  // ============================================
+  // Column Drag & Drop
+  // ============================================
+  /**
+   * Column 드래그 시작
+   */
+  startColumnDrag(t, e) {
+    t.preventDefault(), t.stopPropagation(), this.columnDragging = {
+      field: e.field,
+      startX: t.clientX,
+      element: null
+    };
+    const i = f("div", "velox-column-drag-indicator");
+    i.textContent = e.header, i.style.position = "fixed", i.style.left = `${t.clientX}px`, i.style.top = `${t.clientY}px`, document.body.appendChild(i), this.columnDragging.element = i, document.addEventListener("mousemove", this.boundHandleColumnDragMove), document.addEventListener("mouseup", this.boundHandleColumnDragEnd), y(document.body, "velox-no-select");
+  }
+  /**
+   * Column 드래그 이동
+   */
+  handleColumnDragMove(t) {
+    var n;
+    const e = this.ctx;
+    if (!((n = this.columnDragging) != null && n.element)) return;
+    this.columnDragging.element.style.left = `${t.clientX + 10}px`, this.columnDragging.element.style.top = `${t.clientY + 10}px`;
+    const i = document.elementFromPoint(t.clientX, t.clientY), s = i == null ? void 0 : i.closest(".velox-header-cell");
+    e.headerElement.querySelectorAll(".velox-header-cell--drop-target").forEach((o) => {
+      b(o, "velox-header-cell--drop-target");
+    }), s && s.dataset.field !== this.columnDragging.field && y(s, "velox-header-cell--drop-target");
+  }
+  /**
+   * Column 드래그 종료
+   */
+  handleColumnDragEnd(t) {
+    const e = this.ctx;
+    if (!this.columnDragging) return;
+    const i = this.columnDragging.field, s = document.elementFromPoint(t.clientX, t.clientY), n = s == null ? void 0 : s.closest(".velox-header-cell"), o = n == null ? void 0 : n.dataset.field;
+    this.columnDragging.element && this.columnDragging.element.remove(), e.headerElement.querySelectorAll(".velox-header-cell--drop-target").forEach((l) => {
+      b(l, "velox-header-cell--drop-target");
+    }), document.removeEventListener("mousemove", this.boundHandleColumnDragMove), document.removeEventListener("mouseup", this.boundHandleColumnDragEnd), b(document.body, "velox-no-select"), o && o !== i && e.reorderColumn(i, o), this.columnDragging = null;
+  }
+  /**
+   * Column 드래그 중인지 확인
+   */
+  isColumnDragging() {
+    return this.columnDragging !== null;
+  }
+  // ============================================
+  // Row Drag & Drop
+  // ============================================
+  /**
+   * Row 드래그 시작
+   */
+  startRowDrag(t, e, i) {
+    t.preventDefault(), t.stopPropagation(), this.rowDragging = {
+      index: e,
+      startY: t.clientY,
+      element: null
+    };
+    const s = f("div", "velox-row-drag-indicator");
+    s.textContent = `행 ${e + 1}`, s.style.position = "fixed", s.style.left = `${t.clientX}px`, s.style.top = `${t.clientY}px`, document.body.appendChild(s), this.rowDragging.element = s, y(i, "velox-row--dragging"), document.addEventListener("mousemove", this.boundHandleRowDragMove), document.addEventListener("mouseup", this.boundHandleRowDragEnd), y(document.body, "velox-no-select");
+  }
+  /**
+   * Row 드래그 이동
+   */
+  handleRowDragMove(t) {
+    var n, o;
+    const e = this.ctx;
+    if (!((n = this.rowDragging) != null && n.element)) return;
+    this.rowDragging.element.style.left = `${t.clientX + 10}px`, this.rowDragging.element.style.top = `${t.clientY + 10}px`;
+    const i = document.elementFromPoint(t.clientX, t.clientY), s = i == null ? void 0 : i.closest(".velox-row");
+    if (e.bodyInner.querySelectorAll(".velox-row--drop-target").forEach((l) => {
+      b(l, "velox-row--drop-target");
+    }), (o = e.fixedLeftBodyInner) == null || o.querySelectorAll(".velox-row--drop-target").forEach((l) => {
+      b(l, "velox-row--drop-target");
+    }), s) {
+      const l = parseInt(s.dataset.rowIndex || "-1", 10);
+      l !== -1 && l !== this.rowDragging.index && y(s, "velox-row--drop-target");
+    }
+  }
+  /**
+   * Row 드래그 종료
+   */
+  handleRowDragEnd(t) {
+    var l;
+    const e = this.ctx;
+    if (!this.rowDragging) return;
+    const i = this.rowDragging.index, s = document.elementFromPoint(t.clientX, t.clientY), n = s == null ? void 0 : s.closest(".velox-row"), o = n ? parseInt(n.dataset.rowIndex || "-1", 10) : -1;
+    this.rowDragging.element && this.rowDragging.element.remove(), e.bodyInner.querySelectorAll(".velox-row--dragging, .velox-row--drop-target").forEach((a) => {
+      b(a, "velox-row--dragging"), b(a, "velox-row--drop-target");
+    }), (l = e.fixedLeftBodyInner) == null || l.querySelectorAll(".velox-row--dragging, .velox-row--drop-target").forEach((a) => {
+      b(a, "velox-row--dragging"), b(a, "velox-row--drop-target");
+    }), document.removeEventListener("mousemove", this.boundHandleRowDragMove), document.removeEventListener("mouseup", this.boundHandleRowDragEnd), b(document.body, "velox-no-select"), o !== -1 && o !== i && e.moveRow(i, o), this.rowDragging = null;
+  }
+  /**
+   * Row 드래그 중인지 확인
+   */
+  isRowDragging() {
+    return this.rowDragging !== null;
+  }
+  // ============================================
+  // Column Resize
+  // ============================================
+  /**
+   * Column 리사이즈 시작
+   */
+  startResize(t, e) {
+    const i = this.ctx;
+    t.preventDefault(), t.stopPropagation();
+    const s = i.headerElement.querySelector(`[data-field="${e.field}"]`);
+    s && (this.resizing = {
+      column: e,
+      startX: t.clientX,
+      startWidth: s.offsetWidth
+    }, document.addEventListener("mousemove", this.boundHandleResizeMove), document.addEventListener("mouseup", this.boundHandleResizeEnd), y(document.body, "velox-no-select"));
+  }
+  /**
+   * Column 리사이즈 이동
+   */
+  handleResizeMove(t) {
+    const e = this.ctx;
+    if (!this.resizing) return;
+    const i = t.clientX - this.resizing.startX, s = Math.max(50, this.resizing.startWidth + i);
+    this.resizing.column.width = s, e.invalidateColumnCache(), e.render();
+  }
+  /**
+   * Column 리사이즈 종료
+   */
+  handleResizeEnd() {
+    const t = this.ctx;
+    this.resizing && (document.removeEventListener("mousemove", this.boundHandleResizeMove), document.removeEventListener("mouseup", this.boundHandleResizeEnd), b(document.body, "velox-no-select"), t.emitEvent("onColumnResize", this.resizing.column.field, this.resizing.column.width || 0), this.resizing = null);
+  }
+  /**
+   * 리사이즈 중인지 확인
+   */
+  isResizing() {
+    return this.resizing !== null;
+  }
+  /**
+   * 모든 드래그 상태 초기화
+   */
+  cleanup() {
+    this.columnDragging && (this.columnDragging.element && this.columnDragging.element.remove(), document.removeEventListener("mousemove", this.boundHandleColumnDragMove), document.removeEventListener("mouseup", this.boundHandleColumnDragEnd), this.columnDragging = null), this.rowDragging && (this.rowDragging.element && this.rowDragging.element.remove(), document.removeEventListener("mousemove", this.boundHandleRowDragMove), document.removeEventListener("mouseup", this.boundHandleRowDragEnd), this.rowDragging = null), this.resizing && (document.removeEventListener("mousemove", this.boundHandleResizeMove), document.removeEventListener("mouseup", this.boundHandleResizeEnd), this.resizing = null), b(document.body, "velox-no-select");
+  }
+  /**
+   * 리소스 정리 (destroy 별칭)
+   */
+  destroy() {
+    this.cleanup();
+  }
+}
+class at {
+  constructor(t) {
+    this.context = t, this.summaryCache = /* @__PURE__ */ new Map();
+  }
+  /**
+   * Footer Summary 값 계산
+   * @param field 컬럼 필드명
+   * @returns 계산된 집계 값
+   */
+  calculateFooterSummary(t) {
+    var p, c;
+    const e = this.context.getOptions(), i = this.context.getState().columns.find((u) => u.field === t);
+    if (!i) return null;
+    const s = i.summary || ((c = (p = e.footerSummary) == null ? void 0 : p.columns) == null ? void 0 : c[t]);
+    if (!s) return null;
+    const n = `footer:${t}`;
+    if (this.summaryCache.has(n))
+      return this.summaryCache.get(n);
+    const o = this.context.getDisplayData(), l = o.map((u) => u[t]), a = this.executeAggregation(s, l, o), r = this.formatSummaryValue(a, s, i), h = {
+      field: t,
+      function: s.function,
+      value: a,
+      formattedValue: r
+    };
+    return this.summaryCache.set(n, h), h;
+  }
+  /**
+   * 모든 Footer Summary 값 계산
+   * @returns field -> SummaryResult 맵
+   */
+  calculateAllFooterSummaries() {
+    var s;
+    const t = this.context.getOptions(), e = /* @__PURE__ */ new Map();
+    return (s = t.footerSummary) != null && s.visible && this.context.getVisibleColumns().forEach((n) => {
+      const o = this.calculateFooterSummary(n.field);
+      o && e.set(n.field, o);
+    }), e;
+  }
+  /**
+   * Group Summary 값 계산
+   * @param field 컬럼 필드명
+   * @param _groupValue 그룹 값 (reserved for future use)
+   * @param groupData 그룹 데이터
+   * @returns 계산된 집계 값
+   */
+  calculateGroupSummary(t, e, i) {
+    var h, p;
+    const s = this.context.getOptions(), n = this.context.getState().columns.find((c) => c.field === t);
+    if (!n || !((h = s.groupSummary) != null && h.enabled)) return null;
+    const o = (p = s.groupSummary.columns) == null ? void 0 : p[t];
+    if (!o) return null;
+    const l = i.map((c) => c[t]), a = this.executeAggregation(o, l, i), r = this.formatSummaryValue(a, o, n);
+    return {
+      field: t,
+      function: o.function,
+      value: a,
+      formattedValue: r
+    };
+  }
+  /**
+   * 집계 함수 실행
+   * @param config Summary 설정
+   * @param values 값 배열
+   * @param data 원본 데이터 배열
+   * @returns 집계된 값
+   */
+  executeAggregation(t, e, i) {
+    const s = e.filter((n) => n != null);
+    switch (t.function) {
+      case "sum":
+        return this.calculateSum(s);
+      case "avg":
+        return this.calculateAverage(s);
+      case "count":
+        return this.calculateCount(s);
+      case "min":
+        return this.calculateMin(s);
+      case "max":
+        return this.calculateMax(s);
+      case "custom":
+        return t.customFunction ? t.customFunction(e, i) : null;
+      default:
+        return null;
+    }
+  }
+  /**
+   * 합계 계산
+   */
+  calculateSum(t) {
+    return t.reduce((e, i) => {
+      const s = this.toNumber(i);
+      return e + (s !== null ? s : 0);
+    }, 0);
+  }
+  /**
+   * 평균 계산
+   */
+  calculateAverage(t) {
+    if (t.length === 0) return null;
+    const e = this.calculateSum(t), i = t.filter((s) => this.toNumber(s) !== null).length;
+    return i > 0 ? e / i : null;
+  }
+  /**
+   * 개수 계산
+   */
+  calculateCount(t) {
+    return t.length;
+  }
+  /**
+   * 최소값 계산
+   */
+  calculateMin(t) {
+    const e = t.map((i) => this.toNumber(i)).filter((i) => i !== null);
+    return e.length > 0 ? Math.min(...e) : null;
+  }
+  /**
+   * 최대값 계산
+   */
+  calculateMax(t) {
+    const e = t.map((i) => this.toNumber(i)).filter((i) => i !== null);
+    return e.length > 0 ? Math.max(...e) : null;
+  }
+  /**
+   * CellValue를 숫자로 변환
+   */
+  toNumber(t) {
+    if (typeof t == "number") return t;
+    if (typeof t == "string") {
+      const e = t.replace(/,/g, ""), i = parseFloat(e);
+      return isNaN(i) ? null : i;
+    }
+    return typeof t == "boolean" ? t ? 1 : 0 : null;
+  }
+  /**
+   * Summary 값 포맷팅
+   */
+  formatSummaryValue(t, e, i) {
+    return e.formatter ? e.formatter(t) : i.formatter ? i.formatter(t, {}, i) : t == null ? "" : typeof t == "number" ? e.format ? this.applyNumberFormat(t, e.format) : this.formatNumber(t) : String(t);
+  }
+  /**
+   * 숫자 포맷 적용
+   * @param value 숫자 값
+   * @param format 포맷 문자열 (예: '0,0.00')
+   */
+  applyNumberFormat(t, e) {
+    const i = e.includes(","), s = e.match(/\.(\d+)/), n = s ? s[1].length : 0;
+    let o = t.toFixed(n);
+    if (i) {
+      const l = o.split(".");
+      l[0] = l[0].replace(/\B(?=(\d{3})+(?!\d))/g, ","), o = l.join(".");
+    }
+    return o;
+  }
+  /**
+   * 기본 숫자 포맷팅
+   */
+  formatNumber(t) {
+    return Number.isInteger(t) ? t.toLocaleString("en-US") : t.toLocaleString("en-US", {
+      minimumFractionDigits: 0,
+      maximumFractionDigits: 2
+    });
+  }
+  /**
+   * 캐시 무효화
+   */
+  invalidateCache() {
+    this.summaryCache.clear();
+  }
+  /**
+   * 특정 필드의 캐시만 무효화
+   */
+  invalidateFieldCache(t) {
+    this.summaryCache.delete(`footer:${t}`);
+  }
+  /**
+   * Summary 값 가져오기 (캐시 우선)
+   */
+  getSummaryValue(t) {
+    const e = this.calculateFooterSummary(t);
+    return (e == null ? void 0 : e.value) ?? null;
+  }
+  /**
+   * 모든 Summary 값 가져오기
+   */
+  getAllSummaryValues() {
+    const t = this.calculateAllFooterSummaries(), e = {};
+    return t.forEach((i, s) => {
+      e[s] = i.value;
+    }), e;
+  }
+}
+const rt = {
+  rowHeight: 40,
+  headerHeight: 44,
+  showRowNumbers: !1,
+  rowDraggable: !1,
+  selectable: !0,
+  selectionMode: "multiple",
+  selectionStyle: "row",
+  showCheckbox: !1,
+  sortable: !0,
+  filterable: !1,
+  editable: !1,
+  resizable: !0,
+  virtualScroll: !1,
+  bufferSize: 5,
+  theme: "default",
+  locale: "ko-KR",
+  emptyMessage: "데이터가 없습니다.",
+  loading: !1,
+  loadingMessage: "로딩 중...",
+  undoable: !0,
+  undoStackSize: 50
+}, M = {
+  visible: !1,
+  exclusive: !1,
+  showAll: !0
+};
+class xt {
+  constructor(t, e, i = {}) {
+    var s, n, o, l, a;
+    if (this.footerElement = null, this.fixedLeftFooter = null, this.loadingOverlay = null, this.fixedLeftContainer = null, this.fixedLeftHeader = null, this.fixedLeftBody = null, this.fixedLeftBodyInner = null, this.fixedRightContainer = null, this.fixedRightHeader = null, this.fixedRightBody = null, this.fixedRightBodyInner = null, this.fixedRightFooter = null, this.paginationContainer = null, this.infiniteScrollLoading = !1, this.infiniteScrollAllLoaded = !1, this.blockSelecting = null, this.measureCanvas = null, this.measureContext = null, this.virtualState = {
+      startIndex: 0,
+      endIndex: 0,
+      visibleCount: 0,
+      totalHeight: 0
+    }, this.dataIndexMap = /* @__PURE__ */ new Map(), this.columnCache = {
+      visible: null,
+      fixedLeft: null,
+      scrollable: null,
+      fixedRight: null,
+      // Phase 14: Columns fixed to right
+      dirty: !0
+    }, this.tooltip = null, this.editModeCleanup = null, this.scrollHandlers = [], this.wheelHandler = null, typeof t == "string") {
+      const r = document.querySelector(t);
+      if (!r) throw new Error(`Container not found: ${t}`);
+      this.container = r;
+    } else
+      this.container = t;
+    this.options = { ...rt, ...e }, this.options.checkBar ? this.options.checkBar = { ...M, ...this.options.checkBar } : this.options.showCheckbox && (this.options.checkBar = { ...M, visible: !0 }), this.events = i, this.gridId = _("velox-grid"), this.boundHandleBlockSelectionEnd = this.handleBlockSelectionEnd.bind(this), this.boundHandleKeyDown = this.handleKeyDown.bind(this), this.history = new Z({
+      enabled: this.options.undoable ?? !0,
+      maxSize: this.options.undoStackSize ?? 50
+    }), this.renderer = new st(this), this.filterPopupManager = new nt(this), this.columnMenuManager = new ot(this), this.dragManager = new lt(this), this.summary = new at(this), this.state = {
+      data: [],
+      displayData: [],
+      columns: this.options.columns.map((r) => ({ ...r })),
+      selection: {
+        selectedRows: /* @__PURE__ */ new Set(),
+        selectedCells: /* @__PURE__ */ new Set(),
+        focusedCell: null,
+        selections: [],
+        lastSelectedRow: null
+      },
+      checkBar: {
+        checkedRows: /* @__PURE__ */ new Set(),
+        checkableRows: /* @__PURE__ */ new Set()
+      },
+      rowStates: /* @__PURE__ */ new Map(),
+      // Phase 15: Row state tracking
+      sort: [],
+      filter: null,
+      edit: {
+        editing: !1,
+        rowIndex: null,
+        field: null,
+        originalValue: null
+      },
+      pagination: {
+        currentPage: 1,
+        pageSize: ((s = this.options.pagination) == null ? void 0 : s.pageSize) || 20,
+        totalCount: ((n = this.options.dataSource) == null ? void 0 : n.totalCount) || 0,
+        totalPages: 0,
+        loading: !1
+      },
+      scroll: { top: 0, left: 0 }
+    }, this.options.data && (this.state.data = this.options.data.map((r) => ({ ...r })), this.rebuildDataIndexMap(), this.state.displayData = [...this.state.data], this.initCheckableRows(), this.state.data.forEach((r) => {
+      this.state.rowStates.set(r, "none");
+    })), this.build(), this.tooltip = new it(this.rootElement), (o = this.options.pagination) != null && o.enabled ? this.isRemoteDataSource() ? (this.render(), this.fetchData()) : (this.state.pagination.totalCount = this.state.data.length, this.updateTotalPages(), this.options.pagination.mode === "infinite" ? this.applyLocalInfiniteScroll() : this.applyLocalPagination(), this.render()) : this.render(), this.attachEvents(), (a = (l = this.events).onReady) == null || a.call(l, this);
+  }
+  // GridContext: Data index methods (public for module access)
+  rebuildDataIndexMap() {
+    this.dataIndexMap.clear(), this.state.data.forEach((t, e) => {
+      this.dataIndexMap.set(t, e);
+    });
+  }
+  initCheckableRows() {
+    this.state.checkBar.checkableRows.clear();
+    const t = this.options.checkBar;
+    this.state.displayData.forEach((e, i) => {
+      t != null && t.checkableCallback ? t.checkableCallback(e, i) && this.state.checkBar.checkableRows.add(i) : this.state.checkBar.checkableRows.add(i);
+    });
+  }
+  // GridContext: Column cache methods (public for module access)
+  invalidateColumnCache() {
+    this.columnCache.dirty = !0, this.columnCache.visible = null, this.columnCache.fixedLeft = null, this.columnCache.scrollable = null, this.columnCache.fixedRight = null;
+  }
+  /**
+   * Get special columns with displayOrder
+   * Phase 14.1: Helper method to generate special columns sorted by displayOrder
+   */
+  getSpecialColumnsWithOrder() {
+    var e;
+    const t = [];
+    if (typeof this.options.rowDraggable == "object" && this.options.rowDraggable.enabled) {
+      const i = this.options.rowDraggable.displayOrder ?? 0;
+      t.push({
+        col: { field: "__drag", header: "", width: 44, visible: !0 },
+        order: i
+      });
+    } else this.options.rowDraggable === !0 && t.push({
+      col: { field: "__drag", header: "", width: 44, visible: !0 },
+      order: 0
+      // default order
+    });
+    if ((e = this.options.checkBar) != null && e.visible) {
+      const i = this.options.checkBar.displayOrder ?? 10;
+      t.push({
+        col: { field: "__checkbox", header: "", width: 44, visible: !0 },
+        order: i
+      });
+    }
+    if (typeof this.options.showRowNumbers == "object" && this.options.showRowNumbers.visible) {
+      const i = this.options.showRowNumbers.displayOrder ?? 20;
+      t.push({
+        col: { field: "__rownum", header: "#", width: 50, visible: !0 },
+        order: i
+      });
+    } else this.options.showRowNumbers === !0 && t.push({
+      col: { field: "__rownum", header: "#", width: 50, visible: !0 },
+      order: 20
+      // default order
+    });
+    return t.sort((i, s) => i.order - s.order), t.map((i) => i.col);
+  }
+  /**
+   * Get fixed left columns
+   * Phase 14: Only include special columns when fixedOptions.colCount > 0
+   * Phase 14.1: Sort special columns by displayOrder
+   * 
+   * Logic:
+   * - If colCount = 0: Fixed left is empty (special columns go to scrollable)
+   * - If colCount > 0: Fixed left = special columns (sorted by displayOrder) + first N data columns
+   */
+  getFixedLeftColumns() {
+    if (this.columnCache.dirty || !this.columnCache.fixedLeft) {
+      const { colCount: t = 0 } = this.options.fixedOptions || {};
+      if (t > 0) {
+        const e = this.getSpecialColumnsWithOrder(), s = this.getDataColumns().slice(0, t);
+        this.columnCache.fixedLeft = [...e, ...s];
+      } else
+        this.columnCache.fixedLeft = [];
+    }
+    return this.columnCache.fixedLeft;
+  }
+  /**
+   * Get columns fixed to right (based on fixedOptions.rightCount)
+   * Phase 14: New method for right fixed columns
+   */
+  getFixedRightColumns() {
+    if (this.columnCache.dirty || !this.columnCache.fixedRight) {
+      const { rightCount: t = 0 } = this.options.fixedOptions || {}, e = this.getDataColumns(), i = e.length;
+      this.columnCache.fixedRight = t > 0 ? e.slice(i - t) : [];
+    }
+    return this.columnCache.fixedRight;
+  }
+  /**
+   * Get scrollable columns (middle area between fixed left and fixed right)
+   * Phase 14: Include special columns when colCount = 0
+   * Phase 14.1: Sort special columns by displayOrder
+   * 
+   * Logic:
+   * - If colCount = 0: Scrollable = special columns (sorted by displayOrder) + all data columns (except fixed right)
+   * - If colCount > 0: Scrollable = middle data columns only (between fixed left and fixed right)
+   */
+  getScrollableColumns() {
+    if (this.columnCache.dirty || !this.columnCache.scrollable) {
+      const { colCount: t = 0, rightCount: e = 0 } = this.options.fixedOptions || {}, i = this.getDataColumns(), s = i.length;
+      if (t === 0) {
+        const n = this.getSpecialColumnsWithOrder(), o = s - e, l = o > 0 ? i.slice(0, o) : [];
+        this.columnCache.scrollable = [...n, ...l];
+      } else {
+        const n = t, o = s - e;
+        this.columnCache.scrollable = n < o ? i.slice(n, o) : [];
+      }
+      this.columnCache.dirty = !1;
+    }
+    return this.columnCache.scrollable;
+  }
+  /**
+   * Get data columns (exclude special columns)
+   * Phase 14: Helper method to filter out special columns
+   */
+  getDataColumns() {
+    return this.state.columns.filter(
+      (t) => t.visible !== !1 && !this.isSpecialColumn(t)
+    );
+  }
+  /**
+   * Check if column is special (CheckBar, RowNumbers, DragHandle)
+   * Phase 14: Helper method to identify special columns
+   */
+  isSpecialColumn(t) {
+    return t.field === "__checkbox" || t.field === "__rownum" || t.field === "__drag";
+  }
+  getVisibleColumns() {
+    return (this.columnCache.dirty || !this.columnCache.visible) && (this.columnCache.visible = this.state.columns.filter((t) => t.visible !== !1)), this.columnCache.visible;
+  }
+  /**
+   * Check if grid has fixed left columns
+   * Phase 14: Only true when fixedOptions.colCount > 0
+   */
+  hasFixedLeft() {
+    const { colCount: t = 0 } = this.options.fixedOptions || {};
+    return t > 0;
+  }
+  /**
+   * Check if grid has fixed right columns
+   * Phase 14: New method for hasFixedRight
+   */
+  hasFixedRight() {
+    const { rightCount: t = 0 } = this.options.fixedOptions || {};
+    return t > 0;
+  }
+  build() {
+    var i, s, n, o;
+    this.rootElement = f("div", "velox-grid"), this.rootElement.id = this.gridId, this.rootElement.tabIndex = 0, this.options.className && y(this.rootElement, this.options.className), this.hasFixedRight() && y(this.rootElement, "has-fixed-right"), this.options.width && (this.rootElement.style.width = typeof this.options.width == "number" ? `${this.options.width}px` : this.options.width), this.options.height && (this.rootElement.style.height = typeof this.options.height == "number" ? `${this.options.height}px` : this.options.height);
+    const t = f("div", "velox-wrapper");
+    this.hasFixedLeft() && (this.fixedLeftContainer = f("div", "velox-fixed-left"), this.fixedLeftHeader = f("div", "velox-header velox-header--fixed"), this.fixedLeftBody = f("div", "velox-body--fixed"), this.fixedLeftBodyInner = f("div", "velox-body-inner"), this.fixedLeftBody.appendChild(this.fixedLeftBodyInner), this.fixedLeftContainer.appendChild(this.fixedLeftHeader), this.fixedLeftContainer.appendChild(this.fixedLeftBody), (i = this.options.footerSummary) != null && i.visible && (this.fixedLeftFooter = f("div", "velox-footer velox-footer--fixed"), this.fixedLeftContainer.appendChild(this.fixedLeftFooter)), t.appendChild(this.fixedLeftContainer));
+    const e = f("div", "velox-main");
+    this.headerElement = f("div", "velox-header"), this.bodyElement = f("div", "velox-body"), this.bodyInner = f("div", "velox-body-inner"), this.bodyElement.appendChild(this.bodyInner), e.appendChild(this.headerElement), e.appendChild(this.bodyElement), (s = this.options.footerSummary) != null && s.visible && (this.footerElement = f("div", "velox-footer"), e.appendChild(this.footerElement)), t.appendChild(e), this.hasFixedRight() && (this.fixedRightContainer = f("div", "velox-fixed-right"), this.fixedRightHeader = f("div", "velox-header velox-header--fixed-right"), this.fixedRightBody = f("div", "velox-body--fixed"), this.fixedRightBodyInner = f("div", "velox-body-inner"), this.fixedRightBody.appendChild(this.fixedRightBodyInner), this.fixedRightContainer.appendChild(this.fixedRightHeader), this.fixedRightContainer.appendChild(this.fixedRightBody), (n = this.options.footerSummary) != null && n.visible && (this.fixedRightFooter = f("div", "velox-footer velox-footer--fixed-right"), this.fixedRightContainer.appendChild(this.fixedRightFooter)), t.appendChild(this.fixedRightContainer)), this.rootElement.appendChild(t), (o = this.options.pagination) != null && o.enabled && (this.paginationContainer = f("div", "velox-pagination"), this.rootElement.appendChild(this.paginationContainer)), this.container.innerHTML = "", this.container.appendChild(this.rootElement), this.buildLoadingOverlay();
+  }
+  buildLoadingOverlay() {
+    this.loadingOverlay = f("div", "velox-loading-overlay"), this.loadingOverlay.style.display = "none";
+    const t = f("div", "velox-loading-spinner"), e = f("div", "velox-loading-message");
+    e.textContent = this.options.loadingMessage || "로딩 중...", this.loadingOverlay.appendChild(t), this.loadingOverlay.appendChild(e), this.rootElement.appendChild(this.loadingOverlay);
+  }
+  // GridContext: Virtual scroll methods (public for module access)
+  calculateVirtualState() {
+    if (!this.options.virtualScroll) return;
+    const t = this.options.rowHeight || 40, e = this.bodyElement.clientHeight, i = this.bodyElement.scrollTop, s = this.options.bufferSize || 5;
+    this.virtualState.visibleCount = Math.ceil(e / t), this.virtualState.startIndex = Math.max(0, Math.floor(i / t) - s), this.virtualState.endIndex = Math.min(
+      this.state.displayData.length,
+      this.virtualState.startIndex + this.virtualState.visibleCount + s * 2
+    ), this.virtualState.totalHeight = this.state.displayData.length * t;
+  }
+  getVisibleRows() {
+    if (!this.options.virtualScroll)
+      return this.state.displayData.map((e, i) => ({ data: e, index: i }));
+    this.calculateVirtualState();
+    const t = [];
+    for (let e = this.virtualState.startIndex; e < this.virtualState.endIndex; e++)
+      this.state.displayData[e] && t.push({ data: this.state.displayData[e], index: e });
+    return t;
+  }
+  // GridContext: Rendering methods - delegated to GridRenderer
+  render() {
+    console.log("🔄 render() called", { editing: this.state.edit.editing, rowIndex: this.state.edit.rowIndex, field: this.state.edit.field }), this.renderer.render(), this.paginationContainer && this.renderPagination();
+  }
+  renderHeader() {
+    this.renderer.renderHeader();
+  }
+  renderBody() {
+    this.renderer.renderBody();
+  }
+  updateLoadingState() {
+    this.renderer.updateLoadingState();
+  }
+  // GridContext: Filter popup methods - delegated to GridFilterPopup
+  showFilterPopup(t, e) {
+    this.filterPopupManager.showFilterPopup(t, e);
+  }
+  closeFilterPopup() {
+    this.filterPopupManager.closeFilterPopup();
+  }
+  applyColumnFilter(t, e, i) {
+    this.filterPopupManager.applyColumnFilter(t, e, i);
+  }
+  removeColumnFilter(t) {
+    this.filterPopupManager.removeColumnFilter(t);
+  }
+  detachEvents() {
+    this.scrollHandlers.forEach((t) => {
+      this.bodyElement.removeEventListener("scroll", t), this.fixedRightBody && this.fixedRightBody.removeEventListener("scroll", t);
+    }), this.scrollHandlers = [], this.wheelHandler && (this.bodyElement.removeEventListener("wheel", this.wheelHandler), this.wheelHandler = null);
+  }
+  attachEvents() {
+    this.detachEvents();
+    let t = !1, e = null;
+    const i = (n) => {
+      var a, r;
+      if (t || e !== null) return;
+      e = window.setTimeout(() => {
+        e = null;
+      }, 16), t = !0;
+      const o = n === "fixedRight" && this.fixedRightBody ? this.fixedRightBody.scrollTop : this.bodyElement.scrollTop, l = this.bodyElement.scrollLeft;
+      this.state.scroll.top = o, this.state.scroll.left = l, this.fixedLeftBody && this.fixedLeftBody.scrollTop !== o && (this.fixedLeftBody.scrollTop = o), n !== "fixedRight" && this.fixedRightBody && this.fixedRightBody.scrollTop !== o && (this.fixedRightBody.scrollTop = o), n !== "body" && this.bodyElement.scrollTop !== o && (this.bodyElement.scrollTop = o), this.headerElement.scrollLeft !== l && (this.headerElement.scrollLeft = l), this.footerElement && this.footerElement.scrollLeft !== l && (this.footerElement.scrollLeft = l), this.options.virtualScroll && this.renderBody(), (r = (a = this.events).onScroll) == null || r.call(a, this.state.scroll.top, this.state.scroll.left), (n === "body" || n === "fixedRight") && this.checkInfiniteScroll(), t = !1;
+    }, s = V(() => {
+      const n = this.headerElement.scrollLeft;
+      this.bodyElement.scrollLeft = n, this.footerElement && (this.footerElement.scrollLeft = n);
+    }, 16);
+    if (this.hasFixedRight()) {
+      this.wheelHandler = (l) => {
+        l.preventDefault(), this.fixedRightBody && (this.fixedRightBody.scrollTop += l.deltaY);
+      }, this.bodyElement.addEventListener("wheel", this.wheelHandler, { passive: !1 });
+      const n = () => i("fixedRight");
+      this.fixedRightBody.addEventListener("scroll", n), this.scrollHandlers.push(n);
+      const o = () => i("body");
+      this.bodyElement.addEventListener("scroll", o), this.scrollHandlers.push(o);
+    } else {
+      const n = () => i("body");
+      this.bodyElement.addEventListener("scroll", n), this.scrollHandlers.push(n);
+    }
+    this.headerElement.addEventListener("scroll", s), this.scrollHandlers.push(s), document.addEventListener("mouseup", this.boundHandleBlockSelectionEnd), this.rootElement.addEventListener("keydown", this.boundHandleKeyDown);
+  }
+  handleSort(t) {
+    var s, n, o;
+    const e = this.state.sort.findIndex((l) => l.field === t);
+    let i = "asc";
+    if (e >= 0) {
+      const l = this.state.sort[e].direction;
+      l === "asc" ? i = "desc" : l === "desc" && (i = null);
+    }
+    this.state.sort = i ? [{ field: t, direction: i }] : [], this.clearSelectionState(), this.applyDataTransformations(), (!this.isRemoteDataSource() || !((s = this.options.pagination) != null && s.enabled)) && this.render(), (o = (n = this.events).onSort) == null || o.call(n, this.state.sort);
+  }
+  // GridContext: Event handlers (public for module access)
+  handleRowClick(t, e) {
+    var s, n;
+    if (!this.options.selectable) return;
+    (this.options.selectionStyle || "row") === "row" && this.handleRowSelection(t, e), (n = (s = this.events).onRowClick) == null || n.call(s, t, this.state.displayData[t]);
+  }
+  handleRowSelection(t, e) {
+    var s, n;
+    const i = this.options.selectionMode || "multiple";
+    if (i !== "none")
+      if (i === "multiple" && (e.ctrlKey || e.metaKey)) {
+        const o = this.state.selection.selectedRows.has(t);
+        this.selectRow(t, !o);
+      } else if (i === "multiple" && e.shiftKey) {
+        const o = Array.from(this.state.selection.selectedRows);
+        if (o.length > 0) {
+          const l = o[o.length - 1], a = Math.min(l, t), r = Math.max(l, t);
+          for (let h = a; h <= r; h++) this.state.selection.selectedRows.add(h);
+          this.render(), (n = (s = this.events).onSelectionChange) == null || n.call(s, this.getSelectedRows());
+        } else
+          this.selectRow(t, !0);
+      } else if (i === "extended" && (e.ctrlKey || e.metaKey)) {
+        const o = this.state.selection.selectedRows.has(t);
+        this.selectRow(t, !o);
+      } else
+        this.state.selection.selectedRows.clear(), this.selectRow(t, !0);
+  }
+  handleCellClick(t, e, i, s) {
+    var o, l;
+    if (console.log("🔍 handleCellClick", { rowIndex: t, field: e, editing: this.state.edit.editing, editRow: this.state.edit.rowIndex, editField: this.state.edit.field }), this.state.edit.editing && this.state.edit.rowIndex === t && this.state.edit.field === e) {
+      console.log("✅ Same cell clicked - maintaining edit mode");
+      return;
+    }
+    const n = this.options.selectionStyle || "row";
+    n === "cell" || n === "block" ? this.handleCellSelection(t, e, s) : n === "row" && (this.state.selection.focusedCell = { rowIndex: t, field: e }), (l = (o = this.events).onCellClick) == null || l.call(o, t, e, i);
+  }
+  handleCellSelection(t, e, i) {
+    var o, l;
+    const s = this.options.selectionMode || "multiple", n = `${t}:${e}`;
+    if (s !== "none") {
+      if (this.state.selection.focusedCell = { rowIndex: t, field: e }, s === "multiple" && (i.ctrlKey || i.metaKey))
+        this.state.selection.selectedCells.has(n) ? this.state.selection.selectedCells.delete(n) : this.state.selection.selectedCells.add(n);
+      else if (s === "multiple" && i.shiftKey) {
+        const a = this.state.selection.focusedCell;
+        a && this.selectCellRange(a.rowIndex, a.field, t, e);
+      } else
+        this.state.selection.selectedCells.clear(), this.state.selection.selectedCells.add(n);
+      this.render(), (l = (o = this.events).onCellSelectionChange) == null || l.call(o, this.getSelectedCells());
+    }
+  }
+  selectCellRange(t, e, i, s) {
+    const n = this.getVisibleColumns(), o = n.findIndex((c) => c.field === e), l = n.findIndex((c) => c.field === s), a = Math.min(t, i), r = Math.max(t, i), h = Math.min(o, l), p = Math.max(o, l);
+    this.state.selection.selectedCells.clear();
+    for (let c = a; c <= r; c++)
+      for (let u = h; u <= p; u++) {
+        const g = n[u].field;
+        this.state.selection.selectedCells.add(`${c}:${g}`);
+      }
+  }
+  // GridContext: Block selection methods (public for module access)
+  startBlockSelection(t, e) {
+    this.options.selectionStyle === "block" && (this.blockSelecting = { startRow: t, startField: e }, this.state.selection.focusedCell = { rowIndex: t, field: e }, this.state.selection.selectedCells.clear(), this.state.selection.selectedCells.add(`${t}:${e}`), this.render());
+  }
+  updateBlockSelection(t, e) {
+    this.blockSelecting && (this.selectCellRange(
+      this.blockSelecting.startRow,
+      this.blockSelecting.startField,
+      t,
+      e
+    ), this.render());
+  }
+  handleBlockSelectionEnd() {
+    var t, e;
+    this.blockSelecting && (this.blockSelecting = null, (e = (t = this.events).onCellSelectionChange) == null || e.call(t, this.getSelectedCells()));
+  }
+  handleRowDoubleClick(t, e) {
+    var i, s;
+    (s = (i = this.events).onRowDoubleClick) == null || s.call(i, t, this.state.displayData[t]);
+  }
+  handleKeyDown(t) {
+    var a, r, h, p;
+    if (this.state.edit.editing) {
+      t.key === "Escape" ? this.cancelEdit() : t.key === "Enter" ? (t.preventDefault(), this.endEditAndMove(t.shiftKey ? "up" : "down")) : t.key === "Tab" && (t.preventDefault(), this.endEditAndMove(t.shiftKey ? "left" : "right"));
+      return;
+    }
+    if ((t.ctrlKey || t.metaKey) && t.key === "z") {
+      t.preventDefault(), this.undo();
+      return;
+    }
+    if ((t.ctrlKey || t.metaKey) && t.key === "y") {
+      t.preventDefault(), this.redo();
+      return;
+    }
+    if ((t.ctrlKey || t.metaKey) && t.key === "c") {
+      t.preventDefault(), this.copy();
+      return;
+    }
+    if ((t.ctrlKey || t.metaKey) && t.key === "v") {
+      t.preventDefault(), this.paste();
+      return;
+    }
+    if ((t.ctrlKey || t.metaKey) && t.key === "x") {
+      t.preventDefault(), this.cut();
+      return;
+    }
+    if ((t.key === "Delete" || t.key === "Backspace") && this.options.editable) {
+      t.preventDefault(), this.deleteSelectedCells();
+      return;
+    }
+    const e = this.state.selection.focusedCell;
+    if (!this.state.edit.editing && this.options.editable && e) {
+      const c = this.state.columns.find((u) => u.field === e.field);
+      if ((c == null ? void 0 : c.editable) !== !1 && t.key.length === 1 && !t.ctrlKey && !t.metaKey && !t.altKey) {
+        t.preventDefault(), this.startEdit(e.rowIndex, e.field), setTimeout(() => {
+          const u = document.querySelector(".velox-edit-input");
+          u && (u.value = t.key, u.setSelectionRange(1, 1));
+        }, 0);
+        return;
+      }
+    }
+    if ((r = (a = this.events).onKeyDown) == null || r.call(a, t, e), !e) return;
+    const i = this.getVisibleColumns(), s = i.findIndex((c) => c.field === e.field);
+    let n = e.rowIndex, o = s, l = !1;
+    switch (t.key) {
+      case "ArrowUp":
+        n > 0 && (n--, l = !0);
+        break;
+      case "ArrowDown":
+        n < this.state.displayData.length - 1 && (n++, l = !0);
+        break;
+      case "ArrowLeft":
+        o > 0 && (o--, l = !0);
+        break;
+      case "ArrowRight":
+        o < i.length - 1 && (o++, l = !0);
+        break;
+      case "Tab":
+        t.shiftKey ? o > 0 ? o-- : n > 0 && (n--, o = i.length - 1) : o < i.length - 1 ? o++ : n < this.state.displayData.length - 1 && (n++, o = 0), l = !0;
+        break;
+      case "Home":
+        t.ctrlKey && (n = 0), o = 0, l = !0;
+        break;
+      case "End":
+        t.ctrlKey && (n = this.state.displayData.length - 1), o = i.length - 1, l = !0;
+        break;
+      case "PageUp":
+        n = Math.max(0, n - this.virtualState.visibleCount), l = !0;
+        break;
+      case "PageDown":
+        n = Math.min(this.state.displayData.length - 1, n + this.virtualState.visibleCount), l = !0;
+        break;
+      case "Enter":
+      case "F2":
+        this.options.editable && (this.startEdit(e.rowIndex, e.field), l = !0);
+        break;
+      case " ":
+        (h = this.options.checkBar) != null && h.visible && (this.checkItem(e.rowIndex, !this.isItemChecked(e.rowIndex)), l = !0);
+        break;
+      case "a":
+      case "A":
+        (t.ctrlKey || t.metaKey) && (this.selectAllCells(), l = !0);
+        break;
+    }
+    if (l) {
+      t.preventDefault();
+      const c = (p = i[o]) == null ? void 0 : p.field;
+      c && (n !== e.rowIndex || c !== e.field) && (this.setFocusedCell(n, c), t.shiftKey && (this.options.selectionStyle === "cell" || this.options.selectionStyle === "block") ? this.selectCellRange(e.rowIndex, e.field, n, c) : !t.shiftKey && !t.ctrlKey && (this.state.selection.selectedCells.clear(), this.state.selection.selectedCells.add(`${n}:${c}`), this.options.selectionStyle === "row" && (this.state.selection.selectedRows.clear(), this.state.selection.selectedRows.add(n))), this.render(), this.scrollToCell(n, c));
+    }
+  }
+  selectAllCells() {
+    var e, i;
+    const t = this.getVisibleColumns();
+    this.state.selection.selectedCells.clear();
+    for (let s = 0; s < this.state.displayData.length; s++)
+      for (const n of t)
+        this.state.selection.selectedCells.add(`${s}:${n.field}`);
+    this.render(), (i = (e = this.events).onCellSelectionChange) == null || i.call(e, this.getSelectedCells());
+  }
+  // GridContext: Resize methods - delegated to GridDragManager
+  startResize(t, e) {
+    this.dragManager.startResize(t, e);
+  }
+  // GridContext: Data transformation (public for module access)
+  applyDataTransformations() {
+    var e;
+    if ((e = this.options.pagination) != null && e.enabled)
+      if (this.infiniteScrollLoading = !1, this.infiniteScrollAllLoaded = !1, this.state.pagination.currentPage = 1, this.isRemoteDataSource()) {
+        this.options.pagination.mode === "infinite" && (this.state.data = [], this.state.displayData = []), this.fetchData();
+        return;
+      } else {
+        this.options.pagination.mode === "infinite" ? this.applyLocalInfiniteScroll() : this.applyLocalPagination();
+        return;
+      }
+    let t = [...this.state.data];
+    if (this.state.filter && (t = T(t, this.state.filter)), this.state.sort.length > 0) {
+      const i = {};
+      this.state.columns.forEach((s) => {
+        i[s.field] = s.type || "text";
+      }), t = L(t, this.state.sort, i);
+    }
+    this.state.displayData = t, this.initCheckableRows();
+  }
+  /**
+   * Clear all selection state (rows, cells, focused cell)
+   * Extracted to reduce code duplication
+   */
+  // GridContext: Selection state clearing (public for module access)
+  clearSelectionState() {
+    this.state.selection.selectedRows.clear(), this.state.selection.selectedCells.clear(), this.state.selection.focusedCell = null;
+  }
+  // --- Public API: Data Methods ---
+  getData() {
+    return this.state.data.map((t) => ({ ...t }));
+  }
+  setData(t) {
+    var e, i, s;
+    this.state.data = t.map((n) => ({ ...n })), this.rebuildDataIndexMap(), this.clearSelectionState(), this.state.checkBar.checkedRows.clear(), this.state.rowStates.clear(), this.state.data.forEach((n) => {
+      this.state.rowStates.set(n, "none");
+    }), (e = this.options.pagination) != null && e.enabled && !this.isRemoteDataSource() && (this.state.pagination.totalCount = this.state.data.length, this.state.pagination.currentPage = 1, this.updateTotalPages()), this.summary.invalidateCache(), this.applyDataTransformations(), this.render(), (s = (i = this.events).onDataChange) == null || s.call(i, this.state.data);
+  }
+  getRow(t) {
+    return this.state.displayData[t] ? { ...this.state.displayData[t] } : null;
+  }
+  getRowCount() {
+    return this.state.data.length;
+  }
+  getVisibleRowCount() {
+    return this.state.displayData.length;
+  }
+  addRow(t, e) {
+    var n, o, l, a;
+    const i = { ...t }, s = e !== void 0 ? e : this.state.data.length;
+    this.state.data.splice(s, 0, i), this.rebuildDataIndexMap(), this.state.rowStates.set(i, "created"), this.summary.invalidateCache(), this.applyDataTransformations(), this.render(), (o = (n = this.events).onRowAdd) == null || o.call(n, i, s), (a = (l = this.events).onDataChange) == null || a.call(l, this.state.data);
+  }
+  updateRow(t, e) {
+    var n, o, l, a;
+    const i = this.state.displayData[t];
+    if (!i) return;
+    const s = this.state.data.indexOf(i);
+    s >= 0 && (Object.assign(this.state.data[s], e), (this.state.rowStates.get(this.state.data[s]) || "none") === "none" && this.state.rowStates.set(this.state.data[s], "updated"), this.summary.invalidateCache(), this.applyDataTransformations(), this.render(), (o = (n = this.events).onRowUpdate) == null || o.call(n, this.state.data[s], t, e), (a = (l = this.events).onDataChange) == null || a.call(l, this.state.data));
+  }
+  removeRow(t) {
+    var s, n, o, l;
+    const e = this.state.displayData[t];
+    if (!e) return;
+    const i = this.state.data.indexOf(e);
+    if (i >= 0) {
+      const a = this.state.data[i];
+      (this.state.rowStates.get(a) || "none") === "created" ? this.state.rowStates.set(a, "createAndDeleted") : this.state.rowStates.set(a, "deleted"), this.state.data.splice(i, 1), this.rebuildDataIndexMap(), this.state.selection.selectedRows.delete(t);
+      const h = /* @__PURE__ */ new Set();
+      this.state.selection.selectedRows.forEach((c) => {
+        c > t ? h.add(c - 1) : c < t && h.add(c);
+      }), this.state.selection.selectedRows = h, this.state.checkBar.checkedRows.delete(t);
+      const p = /* @__PURE__ */ new Set();
+      this.state.checkBar.checkedRows.forEach((c) => {
+        c > t ? p.add(c - 1) : c < t && p.add(c);
+      }), this.state.checkBar.checkedRows = p, this.summary.invalidateCache(), this.applyDataTransformations(), this.render(), (n = (s = this.events).onRowRemove) == null || n.call(s, a, t), (l = (o = this.events).onDataChange) == null || l.call(o, this.state.data);
+    }
+  }
+  clearData() {
+    var t, e;
+    this.state.data = [], this.state.displayData = [], this.dataIndexMap.clear(), this.state.selection.selectedRows.clear(), this.state.selection.selectedCells.clear(), this.state.selection.focusedCell = null, this.state.checkBar.checkedRows.clear(), this.state.checkBar.checkableRows.clear(), this.summary.invalidateCache(), this.render(), (e = (t = this.events).onDataChange) == null || e.call(t, []);
+  }
+  // --- Public API: Row Selection ---
+  getSelectedRows() {
+    return Array.from(this.state.selection.selectedRows).sort((t, e) => t - e);
+  }
+  getSelectedData() {
+    return this.getSelectedRows().map((t) => this.state.displayData[t]).filter(Boolean).map((t) => ({ ...t }));
+  }
+  selectRow(t, e = !0) {
+    var i, s, n, o;
+    e ? (this.options.selectionMode === "single" && this.state.selection.selectedRows.clear(), this.state.selection.selectedRows.add(t)) : this.state.selection.selectedRows.delete(t), this.render(), (s = (i = this.events).onRowSelect) == null || s.call(i, t, e), (o = (n = this.events).onSelectionChange) == null || o.call(n, this.getSelectedRows());
+  }
+  selectAll(t = !0) {
+    var e, i, s, n;
+    if (t)
+      for (let o = 0; o < this.state.displayData.length; o++)
+        this.state.selection.selectedRows.add(o);
+    else
+      this.state.selection.selectedRows.clear();
+    this.render(), (i = (e = this.events).onAllSelect) == null || i.call(e, t), (n = (s = this.events).onSelectionChange) == null || n.call(s, this.getSelectedRows());
+  }
+  clearSelection() {
+    var t, e, i, s;
+    this.clearSelectionState(), this.render(), (e = (t = this.events).onSelectionChange) == null || e.call(t, []), (s = (i = this.events).onCellSelectionChange) == null || s.call(i, []);
+  }
+  isRowSelected(t) {
+    return this.state.selection.selectedRows.has(t);
+  }
+  // --- Public API: Cell Selection ---
+  selectCell(t, e, i = !0) {
+    var n, o, l, a;
+    const s = `${t}:${e}`;
+    i ? this.state.selection.selectedCells.add(s) : this.state.selection.selectedCells.delete(s), this.render(), (o = (n = this.events).onCellSelect) == null || o.call(n, { rowIndex: t, field: e }, i), (a = (l = this.events).onCellSelectionChange) == null || a.call(l, this.getSelectedCells());
+  }
+  getSelectedCells() {
+    return Array.from(this.state.selection.selectedCells).map((t) => {
+      const [e, i] = t.split(":");
+      return { rowIndex: parseInt(e, 10), field: i };
+    });
+  }
+  setFocusedCell(t, e) {
+    this.state.selection.focusedCell = { rowIndex: t, field: e }, this.render();
+  }
+  getFocusedCell() {
+    return this.state.selection.focusedCell;
+  }
+  setSelection(t) {
+    if (this.state.selection.selectedCells.clear(), this.state.selection.selectedRows.clear(), t.style === "row")
+      for (let e = t.startRow; e <= t.endRow; e++)
+        this.state.selection.selectedRows.add(e);
+    else (t.style === "cell" || t.style === "block") && t.startColumn && t.endColumn && this.selectCellRange(t.startRow, t.startColumn, t.endRow, t.endColumn);
+    this.state.selection.selections = [t], this.render();
+  }
+  getSelection() {
+    const t = this.state.selection.selections;
+    return t.length > 0 ? t[0] : null;
+  }
+  getSelectionData() {
+    const t = this.getSelectedCells();
+    if (t.length === 0) return [];
+    const e = [...new Set(t.map((l) => l.rowIndex))].sort((l, a) => l - a), i = [...new Set(t.map((l) => l.field))], n = this.getVisibleColumns().filter((l) => i.includes(l.field)).map((l) => l.field), o = [];
+    for (const l of e) {
+      const a = this.state.displayData[l];
+      if (a) {
+        const r = n.map((h) => a[h]);
+        o.push(r);
+      }
+    }
+    return o;
+  }
+  // --- Public API: CheckBar ---
+  checkItem(t, e = !0) {
+    var n, o;
+    if (console.log("🔵 checkItem START", { index: t, checked: e, currentEditState: this.state.edit }), !this.state.checkBar.checkableRows.has(t)) return;
+    const i = this.options.checkBar;
+    i != null && i.exclusive && e && this.state.checkBar.checkedRows.clear(), e ? this.state.checkBar.checkedRows.add(t) : this.state.checkBar.checkedRows.delete(t);
+    const s = { ...this.state.edit };
+    console.log("💾 Saved edit state before render", s), this.render(), console.log("🔄 Render complete, edit state after render", this.state.edit), s.editing && s.rowIndex !== null && s.field !== null && (console.log("♻️ Restoring edit state", s), this.state.edit = s, this.renderEditCell(s.rowIndex, s.field, s.originalValue)), (o = (n = this.events).onCheckChange) == null || o.call(n, t, e), console.log("🔵 checkItem END");
+  }
+  checkItems(t, e = !0) {
+    t.forEach((i) => {
+      this.state.checkBar.checkableRows.has(i) && (e ? this.state.checkBar.checkedRows.add(i) : this.state.checkBar.checkedRows.delete(i));
+    }), this.render();
+  }
+  checkAll(t = !0) {
+    var e, i, s;
+    (e = this.options.checkBar) != null && e.exclusive || (t ? this.state.checkBar.checkableRows.forEach((n) => {
+      this.state.checkBar.checkedRows.add(n);
+    }) : this.state.checkBar.checkedRows.clear(), this.render(), (s = (i = this.events).onCheckAllChange) == null || s.call(i, t));
+  }
+  uncheckAll() {
+    this.checkAll(!1);
+  }
+  getCheckedItems() {
+    return Array.from(this.state.checkBar.checkedRows).sort((t, e) => t - e);
+  }
+  getCheckedData() {
+    return this.getCheckedItems().map((t) => this.state.displayData[t]).filter(Boolean).map((t) => ({ ...t }));
+  }
+  isItemChecked(t) {
+    return this.state.checkBar.checkedRows.has(t);
+  }
+  isItemCheckable(t) {
+    return this.state.checkBar.checkableRows.has(t);
+  }
+  checkRow(t, e = !0) {
+    this.checkItem(t, e);
+  }
+  getCheckedRows() {
+    return this.getCheckedItems();
+  }
+  // --- Public API: Sort ---
+  sort(t, e = "asc") {
+    var i, s;
+    this.state.sort = e ? [{ field: t, direction: e }] : [], this.clearSelectionState(), this.applyDataTransformations(), this.render(), (s = (i = this.events).onSort) == null || s.call(i, this.state.sort);
+  }
+  clearSort() {
+    var t, e;
+    this.state.sort = [], this.applyDataTransformations(), this.render(), (e = (t = this.events).onSort) == null || e.call(t, []);
+  }
+  getSortState() {
+    return [...this.state.sort];
+  }
+  // --- Public API: Filter ---
+  filter(t) {
+    var i, s;
+    const e = Array.isArray(t) ? t : [t];
+    this.state.filter = { conditions: e, logic: "and" }, this.clearSelectionState(), this.applyDataTransformations(), this.render(), (s = (i = this.events).onFilter) == null || s.call(i, this.state.filter);
+  }
+  clearFilter() {
+    this.state.filter = null, this.clearSelectionState(), this.applyDataTransformations(), this.render();
+  }
+  getFilterState() {
+    return this.state.filter ? { ...this.state.filter } : null;
+  }
+  // --- Public API: Edit ---
+  startEdit(t, e) {
+    var n, o, l;
+    if (console.log("🎬 startEdit called", { rowIndex: t, field: e, editable: this.options.editable }), !this.options.editable) return;
+    if (this.state.edit.editing && this.state.edit.rowIndex === t && this.state.edit.field === e) {
+      console.log("⚠️ Already editing this cell - ignoring startEdit");
+      return;
+    }
+    const i = this.state.columns.find((a) => a.field === e);
+    if (console.log("📋 Column found", { column: i == null ? void 0 : i.field, editable: i == null ? void 0 : i.editable }), !i || i.editable === !1) return;
+    this.state.edit.editing && this.endEdit(!0);
+    const s = (n = this.state.displayData[t]) == null ? void 0 : n[e];
+    this.state.edit = { editing: !0, rowIndex: t, field: e, originalValue: s }, console.log("✅ Edit state updated", this.state.edit), (l = (o = this.events).onCellEditStart) == null || l.call(o, t, e, s), this.renderEditCell(t, e, s);
+  }
+  renderEditCell(t, e, i) {
+    console.log("🎨 renderEditCell START", { rowIndex: t, field: e, value: i, currentEditState: this.state.edit }), this.editModeCleanup && (console.log("🧹 Cleaning up previous edit mode listener"), this.editModeCleanup(), this.editModeCleanup = null);
+    const s = this.bodyInner.querySelector(`[data-row-index="${t}"]`), n = s == null ? void 0 : s.querySelector(`[data-field="${e}"]`);
+    if (console.log("🔍 Cell element found", { cell: !!n, hasClass: n == null ? void 0 : n.classList.contains("velox-cell--editing") }), !n) return;
+    const o = this.state.columns.find((a) => a.field === e);
+    if (!o) return;
+    y(n, "velox-cell--editing"), console.log("✅ Added velox-cell--editing class", { classList: Array.from(n.classList) });
+    const l = (a) => {
+      const r = a.target;
+      n.contains(r) ? console.log("📦 Inside cell click - maintaining edit mode") : (console.log("🌍 Outside click detected - ending edit"), this.editModeCleanup = null, document.removeEventListener("mousedown", l), this.endEdit(!0));
+    };
+    if (this.editModeCleanup = () => {
+      document.removeEventListener("mousedown", l);
+    }, setTimeout(() => {
+      document.addEventListener("mousedown", l);
+    }, 0), o.editor) {
+      const a = et.createEditor(
+        i,
+        o.editor,
+        (r) => {
+          var p;
+          if (console.log("💾 Editor save callback", { newValue: r, editing: this.state.edit.editing }), this.setCellValue(t, e, r), ((p = o.editor) == null ? void 0 : p.type) === "checkbox") {
+            console.log("✅ Checkbox editor - maintaining edit mode, new value:", r), this.state.edit.originalValue = r;
+            const c = { ...this.state.edit };
+            c.editing && (this.state.edit = c, this.renderEditCell(c.rowIndex, c.field, r));
+          } else
+            console.log("🛑 Other editor - ending edit mode"), this.state.edit.editing = !1, this.applyDataTransformations(), this.render();
+          const h = this.events;
+          h.onCellEditEnd && h.onCellEditEnd({
+            rowIndex: t,
+            field: e,
+            oldValue: i,
+            newValue: r,
+            row: this.state.displayData[t]
+          });
+        },
+        () => {
+          this.cancelEdit();
+        },
+        (r) => {
+          this.endEditAndMove(r);
+        }
+      );
+      n.innerHTML = "", n.appendChild(a), a.addEventListener("mousedown", () => {
+        console.log("🖱️ Editor mousedown");
+      }), setTimeout(() => {
+        (a instanceof HTMLInputElement || a instanceof HTMLSelectElement) && (a.focus(), a instanceof HTMLInputElement && a.type === "text" && a.select());
+      }, 0);
+    } else {
+      const a = f("input", "velox-edit-input");
+      a.type = o.type === "number" ? "number" : "text", a.value = i != null ? String(i) : "", n.innerHTML = "", n.appendChild(a), a.focus(), a.select(), a.addEventListener("mousedown", () => {
+        console.log("🖱️ Input mousedown");
+      }), a.addEventListener("keydown", (r) => {
+        console.log("⌨️ Input keydown:", r.key, { shiftKey: r.shiftKey }), r.key === "Enter" ? (r.preventDefault(), r.stopPropagation(), console.log("✅ Enter detected - calling endEditAndMove"), this.endEditAndMove(r.shiftKey ? "up" : "down")) : r.key === "Tab" ? (r.preventDefault(), r.stopPropagation(), console.log("✅ Tab detected - calling endEditAndMove"), this.endEditAndMove(r.shiftKey ? "left" : "right")) : r.key === "Escape" && (r.preventDefault(), r.stopPropagation(), console.log("✅ Escape detected - calling cancelEdit"), this.cancelEdit());
+      });
+    }
+  }
+  endEdit(t = !0) {
+    var l, a, r, h, p, c;
+    if (console.log("🛑 endEdit called", { save: t, editing: this.state.edit.editing }), this.editModeCleanup && (console.log("🧹 Cleaning up edit mode listener on endEdit"), this.editModeCleanup(), this.editModeCleanup = null), !this.state.edit.editing) return;
+    const { rowIndex: e, field: i, originalValue: s } = this.state.edit;
+    if (e === null || i === null) return;
+    const n = this.bodyInner.querySelector(`[data-row-index="${e}"]`), o = n == null ? void 0 : n.querySelector(`[data-field="${i}"]`);
+    if (t && o) {
+      const u = this.state.columns.find((E) => E.field === i), g = this.state.displayData[e];
+      let m = s;
+      const C = o.querySelector(".velox-edit-input"), x = o.querySelector(".velox-editor--select"), v = o.querySelector('.velox-editor--checkbox input[type="checkbox"]'), w = o.querySelector(".velox-editor--date"), S = o.querySelector(".velox-editor--number");
+      if (v ? m = v.checked : x ? x.multiple ? m = Array.from(x.selectedOptions).map((E) => E.value) : m = x.value : w ? m = w.value : S ? m = S.value === "" ? null : Number(S.value) : C && (m = C.value), JSON.stringify(m) !== JSON.stringify(s)) {
+        if (u != null && u.validation && u.validation.length > 0) {
+          const H = u.type === "number" && typeof m == "string" ? parseFloat(m) : m, R = tt.validate(H, u.validation, g);
+          if (!R.valid) {
+            if (o) {
+              y(o, "velox-cell--invalid");
+              const D = R.errors.map(($) => $.message).join(", ");
+              o.title = D;
+            }
+            (a = (l = this.events).onValidationError) == null || a.call(l, {
+              rowIndex: e,
+              field: i,
+              value: H,
+              errors: R.errors.map((D) => D.message)
+            }), C ? C.focus() : x ? x.focus() : w ? w.focus() : S && S.focus();
+            return;
+          }
+        }
+        const E = (u == null ? void 0 : u.type) === "number" && typeof m == "string" ? parseFloat(m) : m;
+        this.setCellValue(e, i, E), (h = (r = this.events).onCellEditEnd) == null || h.call(r, {
+          rowIndex: e,
+          field: i,
+          oldValue: s,
+          newValue: E,
+          row: this.state.displayData[e]
+        });
+      }
+    } else
+      (c = (p = this.events).onCellEditCancel) == null || c.call(p, e, i);
+    this.state.edit = { editing: !1, rowIndex: null, field: null, originalValue: null }, this.applyDataTransformations(), this.render();
+  }
+  cancelEdit() {
+    this.endEdit(!1);
+  }
+  isEditing() {
+    return this.state.edit.editing;
+  }
+  /**
+   * End edit and move to adjacent cell (Phase 9)
+   */
+  endEditAndMove(t) {
+    var r;
+    const { rowIndex: e, field: i } = this.state.edit;
+    if (e === null || i === null) return;
+    this.endEdit(!0);
+    const s = this.getVisibleColumns(), n = s.findIndex((h) => h.field === i);
+    let o = e, l = n;
+    switch (t) {
+      case "up":
+        o > 0 && o--;
+        break;
+      case "down":
+        o < this.state.displayData.length - 1 && o++;
+        break;
+      case "left":
+        l > 0 ? l-- : o > 0 && (o--, l = s.length - 1);
+        break;
+      case "right":
+        l < s.length - 1 ? l++ : o < this.state.displayData.length - 1 && (o++, l = 0);
+        break;
+    }
+    const a = (r = s[l]) == null ? void 0 : r.field;
+    a && (this.setFocusedCell(o, a), this.state.selection.selectedCells.clear(), this.state.selection.selectedCells.add(`${o}:${a}`), this.scrollToCell(o, a), this.render(), this.rootElement.focus());
+  }
+  // --- Public API: Column ---
+  getColumn(t) {
+    return this.state.columns.find((e) => e.field === t) || null;
+  }
+  setColumnWidth(t, e) {
+    var s, n;
+    const i = this.state.columns.find((o) => o.field === t);
+    i && (i.width = e, this.invalidateColumnCache(), this.render(), (n = (s = this.events).onColumnResize) == null || n.call(s, t, e));
+  }
+  showColumn(t) {
+    const e = this.state.columns.find((i) => i.field === t);
+    e && (e.visible = !0, this.invalidateColumnCache(), this.render());
+  }
+  hideColumn(t) {
+    const e = this.state.columns.find((i) => i.field === t);
+    e && (e.visible = !1, this.invalidateColumnCache(), this.render());
+  }
+  setColumns(t) {
+    this.state.columns = t.map((e) => ({ ...e })), this.invalidateColumnCache(), this.render();
+  }
+  autoFitColumn(t) {
+    var n, o;
+    const e = this.state.columns.find((l) => l.field === t);
+    if (!e) return;
+    let i = 100;
+    const s = e.header || "";
+    i = Math.max(i, this.measureTextWidth(s) + 40), this.state.displayData.forEach((l) => {
+      const a = l[e.field], r = k(a, e.type), h = this.measureTextWidth(r) + 20;
+      i = Math.max(i, h);
+    }), e.width = Math.min(i, 500), this.invalidateColumnCache(), this.render(), (o = (n = this.events).onColumnResize) == null || o.call(n, t, e.width);
+  }
+  autoFitAllColumns() {
+    this.getVisibleColumns().forEach((t) => this.autoFitColumn(t.field));
+  }
+  // GridContext: Text measurement (public for module access)
+  measureTextWidth(t, e) {
+    return this.measureCanvas || (this.measureCanvas = document.createElement("canvas"), this.measureContext = this.measureCanvas.getContext("2d")), this.measureContext ? (this.measureContext.font = e || "14px sans-serif", this.measureContext.measureText(t).width) : 100;
+  }
+  // --- Public API: Scroll ---
+  scrollToRow(t) {
+    const e = this.options.rowHeight || 40;
+    this.bodyElement.scrollTop = t * e, this.fixedLeftBody && (this.fixedLeftBody.scrollTop = t * e);
+  }
+  scrollToTop() {
+    this.bodyElement.scrollTop = 0, this.fixedLeftBody && (this.fixedLeftBody.scrollTop = 0);
+  }
+  scrollToBottom() {
+    this.bodyElement.scrollTop = this.bodyElement.scrollHeight, this.fixedLeftBody && (this.fixedLeftBody.scrollTop = this.fixedLeftBody.scrollHeight);
+  }
+  scrollToCell(t, e) {
+    const i = this.options.rowHeight || 40, s = this.bodyElement.clientHeight, n = this.bodyElement.scrollTop, o = t * i, l = o + i;
+    o < n ? this.bodyElement.scrollTop = o : l > n + s && (this.bodyElement.scrollTop = l - s), this.fixedLeftBody && (this.fixedLeftBody.scrollTop = this.bodyElement.scrollTop);
+    const a = this.bodyInner.querySelector(`[data-field="${e}"]`);
+    if (a) {
+      const r = a.offsetLeft, h = r + a.offsetWidth, p = this.bodyElement.clientWidth, c = this.bodyElement.scrollLeft;
+      r < c ? this.bodyElement.scrollLeft = r : h > c + p && (this.bodyElement.scrollLeft = h - p);
+    }
+  }
+  // --- Public API: Clipboard ---
+  copy() {
+    const t = this.getSelectionData();
+    if (t.length === 0) return;
+    const e = t.map((i) => i.join("	")).join(`
+`);
+    navigator.clipboard.writeText(e).then(() => {
+      var i, s;
+      (s = (i = this.events).onCopy) == null || s.call(i, t.map((n) => n.map((o) => String(o ?? ""))));
+    });
+  }
+  paste() {
+    const t = this.state.selection.focusedCell;
+    t && navigator.clipboard.readText().then((e) => {
+      var o, l, a, r;
+      const i = e.split(`
+`).map((h) => h.split("	"));
+      (l = (o = this.events).onPaste) == null || l.call(o, i, t);
+      const s = this.getVisibleColumns(), n = s.findIndex((h) => h.field === t.field);
+      i.forEach((h, p) => {
+        const c = t.rowIndex + p;
+        c >= this.state.displayData.length || h.forEach((u, g) => {
+          const m = n + g;
+          if (m >= s.length) return;
+          const C = s[m].field, x = s[m];
+          if (x.editable !== !1) {
+            const v = this.state.displayData[c], w = this.state.data.indexOf(v);
+            w >= 0 && (this.state.data[w][C] = x.type === "number" ? parseFloat(u) : u);
+          }
+        });
+      }), this.summary.invalidateCache(), this.applyDataTransformations(), this.render(), (r = (a = this.events).onDataChange) == null || r.call(a, this.state.data);
+    });
+  }
+  cut() {
+    var s, n, o, l;
+    const t = this.getSelectionData();
+    if (t.length === 0) return;
+    this.copy();
+    const e = [];
+    this.getSelectedCells().forEach((a) => {
+      const r = this.state.columns.find((h) => h.field === a.field);
+      if ((r == null ? void 0 : r.editable) !== !1) {
+        const h = this.state.displayData[a.rowIndex], p = this.state.data.indexOf(h);
+        if (p >= 0) {
+          const c = this.state.data[p][a.field];
+          e.push({
+            rowIndex: a.rowIndex,
+            field: a.field,
+            oldValue: c,
+            newValue: ""
+          }), this.state.data[p][a.field] = "";
+        }
+      }
+    }), e.length > 0 && this.pushUndo({ type: "cut", timestamp: Date.now(), data: { changes: e } }), this.summary.invalidateCache(), this.applyDataTransformations(), this.render(), (n = (s = this.events).onCut) == null || n.call(s, t.map((a) => a.map((r) => String(r ?? "")))), (l = (o = this.events).onDataChange) == null || l.call(o, this.state.data);
+  }
+  // --- Public API: Undo/Redo ---
+  pushUndo(t) {
+    this.history.push(t);
+  }
+  undo() {
+    var e, i, s, n;
+    const t = this.history.popUndo();
+    if (!t) return !1;
+    switch (t.type) {
+      case "cell_edit": {
+        const o = t.data, l = this.state.displayData[o.rowIndex], a = this.state.data.indexOf(l);
+        a >= 0 && (this.state.data[a][o.field] = o.oldValue);
+        break;
+      }
+      case "bulk_edit":
+      case "paste":
+      case "cut":
+      case "delete": {
+        t.data.changes.forEach((l) => {
+          const a = this.state.displayData[l.rowIndex], r = this.state.data.indexOf(a);
+          r >= 0 && (this.state.data[r][l.field] = l.oldValue);
+        });
+        break;
+      }
+      case "row_add": {
+        const o = t.data;
+        this.state.data.splice(o.index, 1), this.rebuildDataIndexMap();
+        break;
+      }
+      case "row_remove": {
+        const o = t.data;
+        this.state.data.splice(o.index, 0, { ...o.row }), this.rebuildDataIndexMap();
+        break;
+      }
+    }
+    return this.summary.invalidateCache(), this.applyDataTransformations(), this.render(), (i = (e = this.events).onUndo) == null || i.call(e, t), (n = (s = this.events).onDataChange) == null || n.call(s, this.state.data), !0;
+  }
+  redo() {
+    var e, i, s, n;
+    const t = this.history.popRedo();
+    if (!t) return !1;
+    switch (t.type) {
+      case "cell_edit": {
+        const o = t.data, l = this.state.displayData[o.rowIndex], a = this.state.data.indexOf(l);
+        a >= 0 && (this.state.data[a][o.field] = o.newValue);
+        break;
+      }
+      case "bulk_edit":
+      case "paste":
+      case "cut":
+      case "delete": {
+        t.data.changes.forEach((l) => {
+          const a = this.state.displayData[l.rowIndex], r = this.state.data.indexOf(a);
+          r >= 0 && (this.state.data[r][l.field] = l.newValue);
+        });
+        break;
+      }
+      case "row_add": {
+        const o = t.data;
+        this.state.data.splice(o.index, 0, { ...o.row }), this.rebuildDataIndexMap();
+        break;
+      }
+      case "row_remove": {
+        const o = t.data;
+        this.state.data.splice(o.index, 1), this.rebuildDataIndexMap();
+        break;
+      }
+    }
+    return this.summary.invalidateCache(), this.applyDataTransformations(), this.render(), (i = (e = this.events).onRedo) == null || i.call(e, t), (n = (s = this.events).onDataChange) == null || n.call(s, this.state.data), !0;
+  }
+  canUndo() {
+    return this.history.canUndo();
+  }
+  canRedo() {
+    return this.history.canRedo();
+  }
+  clearHistory() {
+    this.history.clear();
+  }
+  // --- Public API: Delete ---
+  deleteSelectedCells() {
+    var i, s;
+    if (!this.options.editable) return;
+    const t = this.getSelectedCells();
+    if (t.length === 0) return;
+    const e = [];
+    t.forEach((n) => {
+      const o = this.state.columns.find((l) => l.field === n.field);
+      if ((o == null ? void 0 : o.editable) !== !1) {
+        const l = this.state.displayData[n.rowIndex], a = this.state.data.indexOf(l);
+        if (a >= 0) {
+          const r = this.state.data[a][n.field];
+          r !== "" && r !== null && r !== void 0 && (e.push({
+            rowIndex: n.rowIndex,
+            field: n.field,
+            oldValue: r,
+            newValue: ""
+          }), this.state.data[a][n.field] = "");
+        }
+      }
+    }), e.length > 0 && (this.pushUndo({ type: "delete", timestamp: Date.now(), data: { changes: e } }), this.applyDataTransformations(), this.summary.invalidateCache(), this.render(), (s = (i = this.events).onDataChange) == null || s.call(i, this.state.data));
+  }
+  deleteSelectedRows() {
+    const t = this.getSelectedRows();
+    if (t.length === 0) return;
+    [...t].sort((i, s) => s - i).forEach((i) => {
+      this.removeRow(i);
+    });
+  }
+  // --- Public API: Export/Import ---
+  createExportContext(t = {}) {
+    return {
+      data: this.state.data,
+      displayData: this.state.displayData,
+      columns: this.state.columns,
+      selectedRows: this.getSelectedRows(),
+      options: t
+    };
+  }
+  /**
+   * Export grid data to Excel (.xlsx) file
+   * Requires SheetJS library to be loaded via CDN:
+   * <script src="https://cdn.sheetjs.com/xlsx-0.20.1/package/dist/xlsx.full.min.js"><\/script>
+   */
+  exportToExcel(t = {}) {
+    const e = this.createExportContext(t);
+    K(e);
+  }
+  /**
+   * Export grid data to CSV format
+   * @returns CSV string
+   */
+  exportToCSV(t = {}) {
+    const e = this.createExportContext(t);
+    return O(e);
+  }
+  /**
+   * Export grid data to JSON format
+   * @returns JSON string
+   */
+  exportToJSON(t = {}) {
+    const e = this.createExportContext(t);
+    return A(e);
+  }
+  /**
+   * Download grid data as CSV file
+   */
+  downloadCSV(t = {}) {
+    const e = this.createExportContext(t);
+    Y(e);
+  }
+  /**
+   * Download grid data as JSON file
+   */
+  downloadJSON(t = {}) {
+    const e = this.createExportContext(t);
+    J(e);
+  }
+  /**
+   * Import data from CSV string
+   * @param csvString CSV content
+   * @param hasHeader Whether first row is header (default: true)
+   */
+  importFromCSV(t, e = !0) {
+    const i = j(t, e);
+    return i.errors.length === 0 && i.data.length > 0 && this.setData(i.data), i;
+  }
+  /**
+   * Import data from Excel file
+   * Requires SheetJS library to be loaded via CDN
+   * @param file Excel file (File object)
+   * @param sheetIndex Sheet index to import (default: 0)
+   */
+  async importFromExcel(t, e = 0) {
+    const i = await G(t, e);
+    return i.errors.length === 0 && i.data.length > 0 && this.setData(i.data), i;
+  }
+  /**
+   * Check if SheetJS library is available for Excel operations
+   */
+  static isExcelSupported() {
+    return B();
+  }
+  // ============================================
+  // Public API - Utility Methods
+  // ============================================
+  getCellValue(t, e) {
+    var i;
+    return (i = this.state.displayData[t]) == null ? void 0 : i[e];
+  }
+  setCellValue(t, e, i) {
+    var o, l;
+    const s = this.state.displayData[t];
+    if (!s) return;
+    const n = this.state.data.indexOf(s);
+    n >= 0 && (this.state.data[n][e] = i, (this.state.rowStates.get(this.state.data[n]) || "none") === "none" && this.state.rowStates.set(this.state.data[n], "updated"), this.summary.invalidateCache(), this.applyDataTransformations(), this.render(), (l = (o = this.events).onDataChange) == null || l.call(o, this.state.data));
+  }
+  // ============================================
+  // Phase 13: Summary Methods
+  // ============================================
+  /**
+   * Get summary value for a specific field
+   * @param field Column field name
+   * @returns Calculated summary value
+   */
+  getSummaryValue(t) {
+    return this.summary.getSummaryValue(t);
+  }
+  /**
+   * Get all summary values
+   * @returns Object with field names as keys and summary values
+   */
+  getSummaryValues() {
+    return this.summary.getAllSummaryValues();
+  }
+  /**
+   * Refresh summary calculations (clear cache)
+   */
+  refreshSummary() {
+    this.summary.invalidateCache(), this.render();
+  }
+  setOptions(t) {
+    this.options = { ...this.options, ...t }, t.checkBar && (this.options.checkBar = { ...M, ...t.checkBar }), t.columns && (this.state.columns = t.columns.map((e) => ({ ...e }))), t.loading !== void 0 && this.updateLoadingState(), this.render();
+  }
+  getOptions() {
+    return { ...this.options };
+  }
+  setLoading(t) {
+    this.options.loading = t, this.updateLoadingState();
+  }
+  refresh() {
+    this.applyDataTransformations(), this.render();
+  }
+  // ============================================
+  // Phase 10: Column Reorder & Menu
+  // ============================================
+  /**
+   * Fix/unfix column to a position
+   */
+  fixColumn(t, e) {
+    const i = this.state.columns.find((s) => s.field === t);
+    i && (i.fixed = e, this.invalidateColumnCache(), this.render());
+  }
+  /**
+   * Reorder column to new position
+   */
+  reorderColumn(t, e) {
+    var o, l;
+    const i = this.state.columns.findIndex((a) => a.field === t), s = this.state.columns.findIndex((a) => a.field === e);
+    if (i === -1 || s === -1) return;
+    const [n] = this.state.columns.splice(i, 1);
+    this.state.columns.splice(s, 0, n), this.invalidateColumnCache(), this.render(), (l = (o = this.events).onColumnReorder) == null || l.call(o, t, i, s);
+  }
+  // GridContext: Column menu methods - delegated to GridColumnMenu
+  showColumnMenu(t, e) {
+    this.closeFilterPopup(), this.columnMenuManager.showColumnMenu(t, e);
+  }
+  closeColumnMenu() {
+    this.columnMenuManager.closeColumnMenu();
+  }
+  // GridContext: Column drag methods - delegated to GridDragManager
+  startColumnDrag(t, e) {
+    this.dragManager.startColumnDrag(t, e);
+  }
+  // ============================================
+  // Phase 11: Row Drag & Drop
+  // ============================================
+  /**
+   * Move row to new position
+   */
+  moveRow(t, e) {
+    var r, h;
+    const i = this.state.displayData[t];
+    if (!i) return;
+    const s = this.state.data.indexOf(i);
+    if (s === -1) return;
+    const n = this.state.displayData[e], o = n ? this.state.data.indexOf(n) : this.state.data.length, [l] = this.state.data.splice(s, 1), a = o > s ? o - 1 : o;
+    this.state.data.splice(a, 0, l), this.rebuildDataIndexMap(), this.applyDataTransformations(), this.render(), (h = (r = this.events).onDataChange) == null || h.call(r, this.state.data);
+  }
+  // GridContext: Row drag methods - delegated to GridDragManager
+  startRowDrag(t, e, i) {
+    this.dragManager.startRowDrag(t, e, i);
+  }
+  // ============================================
+  // GridContext Implementation
+  // ============================================
+  /** GridContext: 그리드 상태 반환 */
+  getState() {
+    return this.state;
+  }
+  /** GridContext: 이벤트 핸들러 반환 */
+  getEvents() {
+    return this.events;
+  }
+  /** GridContext: 그리드 고유 ID 반환 */
+  getGridId() {
+    return this.gridId;
+  }
+  /** GridContext: 표시 데이터 반환 */
+  getDisplayData() {
+    return this.state.displayData;
+  }
+  /** GridContext: 가상 스크롤 상태 반환 */
+  getVirtualState() {
+    return this.virtualState;
+  }
+  /** GridContext: 이벤트 발행 헬퍼 */
+  emitEvent(t, ...e) {
+    const i = this.events[t];
+    i && i(...e);
+  }
+  // ============================================
+  // GridContext: Internal Handlers
+  // ============================================
+  /** GridContext: Block selection 상태 확인 */
+  isBlockSelecting() {
+    return this.blockSelecting !== null;
+  }
+  /** GridContext: Tooltip 표시 */
+  showTooltip(t, e, i, s) {
+    this.tooltip && this.tooltip.show(t, e, i, s);
+  }
+  /** GridContext: Tooltip 숨기기 */
+  hideTooltip() {
+    this.tooltip && this.tooltip.hide();
+  }
+  // ============================================
+  // Phase 14: Fixed Columns
+  // ============================================
+  /**
+   * Set fixed columns options
+   * @param options - Fixed options (colCount, rightCount)
+   */
+  setFixedOptions(t) {
+    var n, o;
+    const e = this.options.fixedOptions || { colCount: 0, rightCount: 0 }, i = {
+      colCount: t.colCount ?? ((n = this.options.fixedOptions) == null ? void 0 : n.colCount) ?? 0,
+      rightCount: t.rightCount ?? ((o = this.options.fixedOptions) == null ? void 0 : o.rightCount) ?? 0
+    }, s = (
+      // Left fixed changes
+      (e.colCount || 0) === 0 && i.colCount > 0 || // Left 추가
+      (e.colCount || 0) > 0 && i.colCount === 0 || // Left 제거
+      // Right fixed changes
+      (e.rightCount || 0) === 0 && i.rightCount > 0 || // Right 추가
+      (e.rightCount || 0) > 0 && i.rightCount === 0
+    );
+    this.options.fixedOptions = i, this.invalidateColumnCache(), s && this.rebuildDOM(), this.render();
+  }
+  /**
+   * Rebuild DOM structure and re-attach events
+   * Phase 14: For dynamic fixed columns
+   */
+  rebuildDOM() {
+    var i, s;
+    const t = ((i = this.bodyElement) == null ? void 0 : i.scrollTop) || 0, e = ((s = this.bodyElement) == null ? void 0 : s.scrollLeft) || 0;
+    this.detachEvents(), this.build(), this.attachEvents(), this.bodyElement && (this.bodyElement.scrollTop = t, this.bodyElement.scrollLeft = e), this.fixedRightBody && (this.fixedRightBody.scrollTop = t);
+  }
+  /**
+   * Get current fixed columns options
+   * @returns Fixed options
+   */
+  getFixedOptions() {
+    return this.options.fixedOptions || { colCount: 0, rightCount: 0 };
+  }
+  // ============================================
+  // Phase 15: Row State Management
+  // ============================================
+  /**
+   * Get row state by display index
+   * @param index - Display index (in displayData array)
+   * @returns Row state type
+   */
+  getRowState(t) {
+    const e = this.state.displayData[t];
+    return e && this.state.rowStates.get(e) || "none";
+  }
+  /**
+   * Get row state by row data object
+   * @param row - Row data object
+   * @returns Row state type
+   */
+  getRowStateByData(t) {
+    return this.state.rowStates.get(t) || "none";
+  }
+  /**
+   * Set row state manually
+   * @param index - Display index
+   * @param state - New state
+   */
+  setRowState(t, e) {
+    const i = this.state.displayData[t];
+    i && (this.state.rowStates.set(i, e), this.render());
+  }
+  /**
+   * Get all changes (created, updated, deleted rows)
+   * @returns Changes result with separated arrays
+   */
+  getChanges() {
+    const t = [], e = [], i = [];
+    return this.state.rowStates.forEach((s, n) => {
+      s === "created" ? t.push(n) : s === "updated" ? e.push(n) : s === "deleted" && i.push(n);
+    }), { created: t, updated: e, deleted: i };
+  }
+  /**
+   * Get newly created rows
+   * @returns Array of created rows
+   */
+  getCreatedRows() {
+    const t = [];
+    return this.state.rowStates.forEach((e, i) => {
+      e === "created" && t.push(i);
+    }), t;
+  }
+  /**
+   * Get updated rows
+   * @returns Array of updated rows
+   */
+  getUpdatedRows() {
+    const t = [];
+    return this.state.rowStates.forEach((e, i) => {
+      e === "updated" && t.push(i);
+    }), t;
+  }
+  /**
+   * Get deleted rows (marked for deletion)
+   * @returns Array of deleted rows
+   */
+  getDeletedRows() {
+    const t = [];
+    return this.state.rowStates.forEach((e, i) => {
+      e === "deleted" && t.push(i);
+    }), t;
+  }
+  /**
+   * Clear all row states (reset to 'none')
+   */
+  clearRowStates() {
+    this.state.rowStates.clear(), this.state.data.forEach((t) => {
+      this.state.rowStates.set(t, "none");
+    }), this.render();
+  }
+  /**
+   * Commit changes (mark all rows as 'none')
+   * This is typically called after successfully saving changes to server
+   */
+  commit() {
+    const t = [];
+    this.state.rowStates.forEach((e, i) => {
+      e === "createAndDeleted" && t.push(i);
+    }), t.forEach((e) => {
+      const i = this.state.data.indexOf(e);
+      i >= 0 && this.state.data.splice(i, 1);
+    }), this.state.rowStates.clear(), this.state.data.forEach((e) => {
+      this.state.rowStates.set(e, "none");
+    }), this.rebuildDataIndexMap(), this.applyDataTransformations(), this.render();
+  }
+  // ============================================
+  // Phase 18: Data Source & Pagination
+  // ============================================
+  /**
+   * Remote 데이터 소스 여부 확인
+   */
+  isRemoteDataSource() {
+    var t;
+    return ((t = this.options.dataSource) == null ? void 0 : t.type) === "remote";
+  }
+  /**
+   * 페이지네이션 상태 조회
+   */
+  getPaginationState() {
+    return { ...this.state.pagination };
+  }
+  /**
+   * 특정 페이지로 이동
+   * @param page - 이동할 페이지 번호 (1-based)
+   */
+  goToPage(t) {
+    var s, n;
+    const { totalPages: e } = this.state.pagination, i = Math.max(1, Math.min(t, e || 1));
+    i === this.state.pagination.currentPage && this.state.displayData.length > 0 || (this.state.pagination.currentPage = i, this.isRemoteDataSource() ? this.fetchData() : (this.applyLocalPagination(), this.render()), (n = (s = this.events).onPageChange) == null || n.call(s, i, this.state.pagination.pageSize));
+  }
+  /**
+   * 페이지 크기 변경
+   * @param pageSize - 새 페이지 크기
+   */
+  setPageSize(t) {
+    var e, i;
+    t < 1 || t === this.state.pagination.pageSize || (this.state.pagination.pageSize = t, this.state.pagination.currentPage = 1, this.updateTotalPages(), this.isRemoteDataSource() ? this.fetchData() : (this.applyLocalPagination(), this.render()), (i = (e = this.events).onPageSizeChange) == null || i.call(e, t));
+  }
+  /**
+   * 서버에서 데이터 가져오기 (remote 모드)
+   */
+  async fetchData() {
+    const t = this.options.dataSource;
+    if (!(t != null && t.fetch)) return;
+    const e = {
+      page: this.state.pagination.currentPage,
+      pageSize: this.state.pagination.pageSize,
+      sort: this.state.sort.length > 0 ? this.state.sort : void 0,
+      filter: this.state.filter
+    };
+    this.state.pagination.loading = !0, this.setLoading(!0);
+    try {
+      const i = await t.fetch(e);
+      this.state.data = i.data.map((s) => ({ ...s })), this.state.displayData = this.state.data, this.state.pagination.totalCount = i.totalCount, this.updateTotalPages(), this.state.rowStates.clear(), this.state.data.forEach((s) => {
+        this.state.rowStates.set(s, "none");
+      }), this.rebuildDataIndexMap(), this.summary.invalidateCache(), this.clearSelectionState();
+    } catch (i) {
+      console.error("VeloxGrid: fetchData error", i);
+    } finally {
+      this.state.pagination.loading = !1, this.setLoading(!1), this.render();
+    }
+  }
+  /**
+   * 전체 페이지 수 재계산
+   */
+  updateTotalPages() {
+    const { pageSize: t, totalCount: e } = this.state.pagination;
+    this.state.pagination.totalPages = Math.max(1, Math.ceil(e / t));
+  }
+  /**
+   * 로컬 데이터에 페이지네이션 적용
+   * sort/filter 적용 후 현재 페이지 데이터만 displayData에 설정
+   */
+  applyLocalPagination() {
+    let t = [...this.state.data];
+    if (this.state.filter && (t = T(t, this.state.filter)), this.state.sort.length > 0) {
+      const n = {};
+      this.state.columns.forEach((o) => {
+        n[o.field] = o.type || "text";
+      }), t = L(t, this.state.sort, n);
+    }
+    this.state.pagination.totalCount = t.length, this.updateTotalPages();
+    const { currentPage: e, pageSize: i } = this.state.pagination, s = (e - 1) * i;
+    this.state.displayData = t.slice(s, s + i), this.initCheckableRows();
+  }
+  /**
+   * Infinite Scroll: 스크롤 바닥 감지 (Phase 18)
+   */
+  checkInfiniteScroll() {
+    const t = this.options.pagination;
+    if (!(t != null && t.enabled) || t.mode !== "infinite" || this.infiniteScrollLoading || this.infiniteScrollAllLoaded) return;
+    const e = t.infiniteScrollThreshold || 100, { scrollTop: i, scrollHeight: s, clientHeight: n } = this.bodyElement;
+    s - i - n <= e && this.loadNextPage();
+  }
+  /**
+   * Infinite Scroll: 다음 페이지 로드 (Phase 18)
+   */
+  async loadNextPage() {
+    const { currentPage: t, totalPages: e } = this.state.pagination;
+    if (t >= e) {
+      this.infiniteScrollAllLoaded = !0, this.renderInfiniteScrollStatus();
+      return;
+    }
+    if (this.infiniteScrollLoading = !0, this.state.pagination.currentPage++, this.renderInfiniteScrollStatus(), this.isRemoteDataSource()) {
+      const i = this.options.dataSource;
+      if (!(i != null && i.fetch)) return;
+      const s = {
+        page: this.state.pagination.currentPage,
+        pageSize: this.state.pagination.pageSize,
+        sort: this.state.sort.length > 0 ? this.state.sort : void 0,
+        filter: this.state.filter
+      };
+      try {
+        const n = await i.fetch(s), o = n.data.map((l) => ({ ...l }));
+        this.state.data.push(...o), this.state.displayData = [...this.state.data], this.state.pagination.totalCount = n.totalCount, this.updateTotalPages(), o.forEach((l) => this.state.rowStates.set(l, "none")), this.rebuildDataIndexMap(), this.summary.invalidateCache(), this.state.pagination.currentPage >= this.state.pagination.totalPages && (this.infiniteScrollAllLoaded = !0);
+      } catch (n) {
+        console.error("VeloxGrid: infinite scroll fetch error", n), this.state.pagination.currentPage--;
+      }
+    } else
+      this.applyLocalInfiniteScroll();
+    this.infiniteScrollLoading = !1, this.render();
+  }
+  /**
+   * Local Infinite Scroll: 다음 페이지 데이터 추가 (Phase 18)
+   */
+  applyLocalInfiniteScroll() {
+    let t = [...this.state.data];
+    if (this.state.filter && (t = T(t, this.state.filter)), this.state.sort.length > 0) {
+      const n = {};
+      this.state.columns.forEach((o) => {
+        n[o.field] = o.type || "text";
+      }), t = L(t, this.state.sort, n);
+    }
+    const { currentPage: e, pageSize: i } = this.state.pagination, s = e * i;
+    this.state.displayData = t.slice(0, s), s >= t.length && (this.infiniteScrollAllLoaded = !0), this.initCheckableRows();
+  }
+  /**
+   * Infinite Scroll 상태 표시 렌더링 (Phase 18)
+   */
+  renderInfiniteScrollStatus() {
+    if (this.paginationContainer) {
+      if (this.paginationContainer.innerHTML = "", this.infiniteScrollLoading) {
+        const t = f("div", "velox-infinite-status");
+        t.textContent = "Loading...", this.paginationContainer.appendChild(t);
+      } else if (this.infiniteScrollAllLoaded) {
+        const t = f("div", "velox-infinite-status velox-infinite-status--done"), { totalCount: e } = this.state.pagination;
+        t.textContent = `All ${e.toLocaleString()} items loaded`, this.paginationContainer.appendChild(t);
+      }
+    }
+  }
+  /**
+   * Pagination UI 렌더링 (Phase 18)
+   */
+  renderPagination() {
+    var p;
+    if (!this.paginationContainer) return;
+    if (((p = this.options.pagination) == null ? void 0 : p.mode) === "infinite") {
+      this.renderInfiniteScrollStatus();
+      return;
+    }
+    const { currentPage: t, totalPages: e, totalCount: i, pageSize: s } = this.state.pagination, n = this.options.pagination, o = (n == null ? void 0 : n.maxPageButtons) || 5;
+    if (this.paginationContainer.innerHTML = "", (n == null ? void 0 : n.showInfo) !== !1) {
+      const c = f("div", "velox-pagination-info"), u = (t - 1) * s + 1, g = Math.min(t * s, i);
+      c.textContent = i > 0 ? `${u}-${g} / ${i.toLocaleString()}` : "0 items", this.paginationContainer.appendChild(c);
+    }
+    const l = f("div", "velox-pagination-nav");
+    l.appendChild(this.createPageButton("«", 1, t === 1)), l.appendChild(this.createPageButton("‹", t - 1, t === 1));
+    const a = Math.floor(o / 2);
+    let r = Math.max(1, t - a);
+    const h = Math.min(e, r + o - 1);
+    if (h - r + 1 < o && (r = Math.max(1, h - o + 1)), r > 1 && (l.appendChild(this.createPageButton("1", 1, !1)), r > 2)) {
+      const c = f("span", "velox-pagination-ellipsis");
+      c.textContent = "…", l.appendChild(c);
+    }
+    for (let c = r; c <= h; c++) {
+      const u = this.createPageButton(String(c), c, !1);
+      c === t && y(u, "velox-pagination-btn--active"), l.appendChild(u);
+    }
+    if (h < e) {
+      if (h < e - 1) {
+        const c = f("span", "velox-pagination-ellipsis");
+        c.textContent = "…", l.appendChild(c);
+      }
+      l.appendChild(this.createPageButton(String(e), e, !1));
+    }
+    if (l.appendChild(this.createPageButton("›", t + 1, t === e)), l.appendChild(this.createPageButton("»", e, t === e)), this.paginationContainer.appendChild(l), n != null && n.showSizeChanger) {
+      const c = f("div", "velox-pagination-sizer"), u = document.createElement("select");
+      u.className = "velox-pagination-select", (n.pageSizeOptions || [10, 20, 50, 100]).forEach((m) => {
+        const C = document.createElement("option");
+        C.value = String(m), C.textContent = `${m} / page`, m === s && (C.selected = !0), u.appendChild(C);
+      }), u.addEventListener("change", () => {
+        this.setPageSize(Number(u.value));
+      }), c.appendChild(u), this.paginationContainer.appendChild(c);
+    }
+  }
+  /**
+   * 페이지 버튼 생성 헬퍼 (Phase 18)
+   */
+  createPageButton(t, e, i) {
+    const s = f("button", "velox-pagination-btn");
+    return s.textContent = t, i ? (s.setAttribute("disabled", "true"), y(s, "velox-pagination-btn--disabled")) : s.addEventListener("click", () => this.goToPage(e)), s;
+  }
+  destroy() {
+    var t, e;
+    this.dragManager.destroy(), this.detachEvents(), document.removeEventListener("mouseup", this.boundHandleBlockSelectionEnd), this.closeFilterPopup(), this.closeColumnMenu(), this.rootElement.removeEventListener("keydown", this.boundHandleKeyDown), this.measureCanvas = null, this.measureContext = null, this.tooltip && (this.tooltip.destroy(), this.tooltip = null), this.container.innerHTML = "", (e = (t = this.events).onDestroy) == null || e.call(t);
+  }
+}
+/**
+ * VeloxGrid
+ * A fast, lightweight, and framework-agnostic data grid library
+ * 
+ * @author bumki
+ * @license MIT
+ * @version 0.9.1
+ */
+const yt = "0.11.0";
+export {
+  yt as VERSION,
+  xt as VeloxGrid,
+  y as addClass,
+  z as compareValues,
+  f as createElement,
+  ft as debounce,
+  P as deepClone,
+  Y as downloadCSV,
+  N as downloadFile,
+  J as downloadJSON,
+  gt as escapeHtml,
+  O as exportToCSV,
+  K as exportToExcel,
+  A as exportToJSON,
+  T as filterData,
+  k as formatValue,
+  _ as generateId,
+  ht as hasClass,
+  G as importFromExcel,
+  mt as importFromExcelBySheetName,
+  B as isSheetJSAvailable,
+  j as parseCSV,
+  pt as parseValue,
+  b as removeClass,
+  ut as setStyles,
+  L as sortData,
+  V as throttle,
+  ct as toggleClass
+};
+//# sourceMappingURL=velox-grid.esm.js.map