@iyulab/flex-table 0.10.1 → 0.10.2

package/dist/{flex-table-C0CCHc1F.js → flex-table-DNBCgorV.js}

@@ -762,7 +762,7 @@ function it(t) {
   }
   return i;
 }
-function A(t, e) {
+function z(t, e) {
   if (t === "") return null;
   switch (e.type) {
     case "number": {
@@ -775,7 +775,7 @@ function A(t, e) {
       return t;
   }
 }
-function z(t, e, i) {
+function A(t, e, i) {
   switch (i) {
     case "csv":
       return U(t, e, ",");
@@ -837,10 +837,10 @@ var ht = Object.defineProperty, dt = Object.getOwnPropertyDescriptor, v = (t, e,
     (n = t[r]) && (o = (s ? n(e, i, o) : n(o)) || o);
   return s && o && ht(e, i, o), o;
 };
-const S = 120, E = 40, ut = 32, $ = 5;
+const S = 120, E = 40, ut = 32, R = 5;
 let _ = class extends T {
   constructor() {
-    super(...arguments), this.columns = [], this.data = [], this.rowHeight = ut, this.showRowNumbers = !1, this.theme = void 0, this.maxRows = 0, this.editable = !0, this.showFilters = !1, this.selectable = !1, this.dataMode = "client", this.footerData = null, this._scrollTop = 0, this._scrollLeft = 0, this._viewportHeight = 0, this._viewportWidth = 0, this._colLeftOffsets = [], this._totalRowWidth = 0, this._activeCell = null, this._editingCell = null, this._sortCriteria = [], this._selection = new j(), this._editing = new B(), this._rowSelection = new X(), this._undo = new tt(), this._filters = [], this._filteredIndices = [], this._sortedIndices = [], this._openFilterKey = null, this._rowSelectionVersion = 0, this._viewDirty = !0, this._resizing = null, this._resizeCleanup = null, this._columnWidths = /* @__PURE__ */ new Map(), this._invalidCells = /* @__PURE__ */ new Map(), this._textFilterState = /* @__PURE__ */ new Map(), this._numberFilterState = /* @__PURE__ */ new Map(), this._dateFilterState = /* @__PURE__ */ new Map();
+    super(...arguments), this.columns = [], this.data = [], this.rowHeight = ut, this.showRowNumbers = !1, this.theme = void 0, this.maxRows = 0, this.editable = !0, this.showFilters = !1, this.selectable = !1, this.dataMode = "client", this.footerData = null, this._scrollTop = 0, this._scrollLeft = 0, this._viewportHeight = 0, this._viewportWidth = 0, this._colLeftOffsets = [], this._totalRowWidth = 0, this._activeCell = null, this._editingCell = null, this._sortCriteria = [], this._selection = new j(), this._editing = new B(), this._rowSelection = new X(), this._undo = new tt(), this._filters = [], this._filteredIndices = [], this._sortedIndices = [], this._openFilterKey = null, this._rowSelectionVersion = 0, this._viewDirty = !0, this._resizing = null, this._resizeCleanup = null, this._columnWidths = /* @__PURE__ */ new Map(), this._hostResizeObserver = null, this._invalidCells = /* @__PURE__ */ new Map(), this._textFilterState = /* @__PURE__ */ new Map(), this._numberFilterState = /* @__PURE__ */ new Map(), this._dateFilterState = /* @__PURE__ */ new Map();
   }
   set selectionMode(t) {
     this._rowSelection.mode = t, this.requestUpdate();
@@ -1150,10 +1150,10 @@ let _ = class extends T {
       const o = this.visibleColumns.slice(s.startCol, s.endCol + 1), r = [];
       for (let n = s.startRow; n <= s.endRow; n++)
         r.push(this.data[this._toDataIndex(n)]);
-      return z(r, o, t);
+      return A(r, o, t);
     }
     const i = this._sortedIndices.map((s) => this.data[s]);
-    return z(i, this.visibleColumns, t);
+    return A(i, this.visibleColumns, t);
   }
   /**
    * Export table data and trigger file download.
@@ -1191,14 +1191,14 @@ let _ = class extends T {
     return this._visibleRowCount * this.rowHeight;
   }
   get visibleRange() {
-    const t = Math.max(0, this._scrollTop - this.headerHeight), e = Math.max(0, Math.floor(t / this.rowHeight) - $), i = Math.ceil(this._viewportHeight / this.rowHeight), s = Math.min(this._visibleRowCount, Math.floor(t / this.rowHeight) + i + $);
+    const t = Math.max(0, this._scrollTop - this.headerHeight), e = Math.max(0, Math.floor(t / this.rowHeight) - R), i = Math.ceil(this._viewportHeight / this.rowHeight), s = Math.min(this._visibleRowCount, Math.floor(t / this.rowHeight) + i + R);
     return { start: e, end: s };
   }
   connectedCallback() {
-    super.connectedCallback(), this._onScroll = this._onScroll.bind(this), this._onKeyDown = this._onKeyDown.bind(this), this._onDocumentClick = this._onDocumentClick.bind(this), this._onContextMenu = this._onContextMenu.bind(this), this.addEventListener("scroll", this._onScroll, { passive: !0 }), this.addEventListener("keydown", this._onKeyDown), this.addEventListener("contextmenu", this._onContextMenu), this.hasAttribute("tabindex") || this.setAttribute("tabindex", "0"), this.setAttribute("role", "grid");
+    super.connectedCallback(), this._onScroll = this._onScroll.bind(this), this._onKeyDown = this._onKeyDown.bind(this), this._onDocumentClick = this._onDocumentClick.bind(this), this._onContextMenu = this._onContextMenu.bind(this), this.addEventListener("scroll", this._onScroll, { passive: !0 }), this.addEventListener("keydown", this._onKeyDown), this.addEventListener("contextmenu", this._onContextMenu), this.hasAttribute("tabindex") || this.setAttribute("tabindex", "0"), this.setAttribute("role", "grid"), typeof ResizeObserver < "u" && (this._hostResizeObserver = new ResizeObserver(() => this._measureViewport()), this._hostResizeObserver.observe(this));
   }
   disconnectedCallback() {
-    super.disconnectedCallback(), this.removeEventListener("scroll", this._onScroll), this.removeEventListener("keydown", this._onKeyDown), this.removeEventListener("contextmenu", this._onContextMenu), document.removeEventListener("click", this._onDocumentClick), this._resizeCleanup && (this._resizeCleanup(), this._resizeCleanup = null);
+    super.disconnectedCallback(), this.removeEventListener("scroll", this._onScroll), this.removeEventListener("keydown", this._onKeyDown), this.removeEventListener("contextmenu", this._onContextMenu), document.removeEventListener("click", this._onDocumentClick), this._resizeCleanup && (this._resizeCleanup(), this._resizeCleanup = null), this._hostResizeObserver && (this._hostResizeObserver.disconnect(), this._hostResizeObserver = null);
   }
   firstUpdated() {
     this._measureViewport();
@@ -1222,20 +1222,20 @@ let _ = class extends T {
         o = n;
         break;
       }
-    o = Math.max(0, o - $);
+    o = Math.max(0, o - R);
     let r = t.length;
     for (let n = o; n < e.length; n++)
       if (e[n] > s) {
         r = n;
         break;
       }
-    return r = Math.min(t.length, r + $), { start: o, end: r };
+    return r = Math.min(t.length, r + R), { start: o, end: r };
   }
   willUpdate(t) {
     (!(t.size <= 2 && !t.has("data") && !t.has("columns") && !t.has("_openFilterKey") && !t.has("_editingCell") && !t.has("_activeCell") && (t.has("_scrollTop") || t.has("_scrollLeft"))) || this._viewDirty) && (this._recomputeView(), this._viewDirty = !1), this._updateColOffsets(), this._selection.setDimensions(this._visibleRowCount, this.visibleColumns.length), this._rowSelection.setRowCount(this._visibleRowCount);
   }
   updated() {
-    this._measureViewport(), this._focusEditor(), this._adjustFilterDropdown(), this.setAttribute("aria-rowcount", String(this._visibleRowCount)), this.setAttribute("aria-colcount", String(this.visibleColumns.length));
+    this._focusEditor(), this._adjustFilterDropdown(), this.setAttribute("aria-rowcount", String(this._visibleRowCount)), this.setAttribute("aria-colcount", String(this.visibleColumns.length));
   }
   /** Recompute filter → sort pipeline. */
   _recomputeView() {
@@ -1340,7 +1340,7 @@ let _ = class extends T {
     if (!this._editing.current) return;
     const t = (e = this.shadowRoot) == null ? void 0 : e.querySelector(".ft-editor");
     if (t) {
-      const i = this.visibleColumns[this._editing.current.position.col], s = A(t.value, i);
+      const i = this.visibleColumns[this._editing.current.position.col], s = z(t.value, i);
       this._applyEdit(s);
     } else
       this._cancelEdit();
@@ -1546,7 +1546,7 @@ let _ = class extends T {
       for (let l = 0; l < e[o].length; l++) {
         const a = t.col + l;
         if (a >= i.length) break;
-        const d = i[a], f = this.data[n][d.key], h = A(e[o][l], d);
+        const d = i[a], f = this.data[n][d.key], h = z(e[o][l], d);
         this.data[n][d.key] = h, s.push({ row: n, col: a, key: d.key, oldValue: f, newValue: h });
       }
     }
@@ -1967,8 +1967,8 @@ let _ = class extends T {
     `;
   }
   _renderCell(t, e, i, s) {
-    var x, R, D, F;
-    const o = ((x = this._activeCell) == null ? void 0 : x.row) === i && ((R = this._activeCell) == null ? void 0 : R.col) === s, r = ((D = this._editingCell) == null ? void 0 : D.row) === i && ((F = this._editingCell) == null ? void 0 : F.col) === s, n = this._selection.isInRange(i, s), l = e.pinned === "left", a = e.pinned === "right", d = l || a, f = this._getColWidth(e), h = this.rowHeight, g = this._colLeftOffsets[s] ?? 0;
+    var x, $, D, F;
+    const o = ((x = this._activeCell) == null ? void 0 : x.row) === i && (($ = this._activeCell) == null ? void 0 : $.col) === s, r = ((D = this._editingCell) == null ? void 0 : D.row) === i && ((F = this._editingCell) == null ? void 0 : F.col) === s, n = this._selection.isInRange(i, s), l = e.pinned === "left", a = e.pinned === "right", d = l || a, f = this._getColWidth(e), h = this.rowHeight, g = this._colLeftOffsets[s] ?? 0;
     let p;
     l ? p = `position: absolute; top: 0; left: ${this._scrollLeft + this._getPinnedLeft(s)}px; width: ${f}px; height: ${h}px; z-index: 2;` : a ? p = `position: absolute; top: 0; right: ${-this._scrollLeft + this._getPinnedRight(s)}px; width: ${f}px; height: ${h}px; z-index: 2;` : p = `left: ${g}px; width: ${f}px; height: ${h}px;`;
     const c = !this._isCellEditable(e);
@@ -2132,6 +2132,6 @@ export {
   _ as F,
   X as R,
   tt as U,
-  z as e,
+  A as e,
   H as r
 };

package/dist/flex-table.d.ts

@@ -48,6 +48,7 @@ export declare class FlexTable extends LitElement {
     private _resizing;
     private _resizeCleanup;
     private _columnWidths;
+    private _hostResizeObserver;
     get visibleColumns(): ColumnDefinition[];
     private get _prefixWidth();
     /** Whether an undo operation is available. */

package/dist/flex-table.js

@@ -1,4 +1,4 @@
-import { F as t, R as o, U as r, e as l, r as s } from "./flex-table-C0CCHc1F.js";
+import { F as t, R as o, U as r, e as l, r as s } from "./flex-table-DNBCgorV.js";
 export {
   t as FlexTable,
   o as RowSelectionState,

package/dist/odata/index.js

@@ -1,38 +1,38 @@
-import { useState as r, useRef as J, useCallback as y, useEffect as N } from "react";
+import { useState as r, useRef as z, useCallback as m, useEffect as K } from "react";
 import Q from "odata-query";
-function I(i, f = {}) {
-  const { pageSize: a = 20, defaultOrderBy: o, fixedFilter: d } = f, [x, S] = r([]), [B, b] = r(0), [E, C] = r(!1), [O, g] = r(null), [h, p] = r(0), [l, R] = r(() => o ? U(o) : []), [u, T] = r(""), [q, A] = r(0), k = J(null), D = y(() => {
-    A((e) => e + 1);
-  }, []), L = y((e) => {
-    T(e), p(0);
-  }, []), P = y((e) => {
-    var n;
-    const c = (n = e.detail) == null ? void 0 : n.criteria;
-    c && (R(c), p(0));
+function I(c, d = {}) {
+  const { pageSize: a = 20, defaultOrderBy: n, fixedFilter: l } = d, x = l ? JSON.stringify(l) : "", [O, S] = r([]), [B, b] = r(0), [E, C] = r(!1), [R, g] = r(null), [h, p] = r(0), [u, T] = r(() => n ? U(n) : []), [f, q] = r(""), [A, D] = r(0), k = z(null), F = m(() => {
+    D((e) => e + 1);
+  }, []), J = m((e) => {
+    q(e), p(0);
+  }, []), L = m((e) => {
+    var o;
+    const i = (o = e.detail) == null ? void 0 : o.criteria;
+    i && (T(i), p(0));
   }, []);
-  return N(() => {
+  return K(() => {
     var w;
     (w = k.current) == null || w.abort();
     const e = new AbortController();
     k.current = e, C(!0), g(null);
-    const c = l.length > 0 ? l.map((t) => `${t.key} ${t.direction}`).join(", ") : o, n = {
+    const i = u.length > 0 ? u.map((t) => `${t.key} ${t.direction}`).join(", ") : n, o = {
       top: a,
       skip: h * a,
       count: !0
     };
-    c && (n.orderBy = c), d && (n.filter = d), u && (n.search = u);
-    const v = Q(n), z = `${window.location.origin}${i}${v}`;
-    return fetch(z, { signal: e.signal }).then(async (t) => {
+    i && (o.orderBy = i), l && (o.filter = l), f && (o.search = f);
+    const N = Q(o), P = `${window.location.origin}${c}${N}`;
+    return fetch(P, { signal: e.signal }).then(async (t) => {
       var $;
       if (!t.ok) {
-        const F = await t.text().catch(() => "");
-        let m = `요청 실패 (${t.status})`;
+        const v = await t.text().catch(() => "");
+        let y = `요청 실패 (${t.status})`;
         try {
-          const s = JSON.parse(F);
-          m = (($ = s == null ? void 0 : s.error) == null ? void 0 : $.message) ?? (s == null ? void 0 : s.message) ?? m;
+          const s = JSON.parse(v);
+          y = (($ = s == null ? void 0 : s.error) == null ? void 0 : $.message) ?? (s == null ? void 0 : s.message) ?? y;
         } catch {
         }
-        throw new Error(m);
+        throw new Error(y);
       }
       return t.json();
     }).then((t) => {
@@ -42,27 +42,27 @@ function I(i, f = {}) {
     }).finally(() => {
       e.signal.aborted || C(!1);
     }), () => e.abort();
-  }, [i, h, a, l, u, d, o, q]), {
-    data: x,
+  }, [c, h, a, u, f, x, n, A]), {
+    data: O,
     totalCount: B,
     loading: E,
-    error: O,
+    error: R,
     page: h,
     setPage: p,
-    sortCriteria: l,
-    onSortChange: P,
-    search: u,
-    setSearch: L,
-    refresh: D
+    sortCriteria: u,
+    onSortChange: L,
+    search: f,
+    setSearch: J,
+    refresh: F
   };
 }
-function U(i) {
-  return i.split(",").map((f) => {
-    var o;
-    const a = f.trim().split(/\s+/);
+function U(c) {
+  return c.split(",").map((d) => {
+    var n;
+    const a = d.trim().split(/\s+/);
     return {
       key: a[0],
-      direction: ((o = a[1]) == null ? void 0 : o.toLowerCase()) === "desc" ? "desc" : "asc"
+      direction: ((n = a[1]) == null ? void 0 : n.toLowerCase()) === "desc" ? "desc" : "asc"
     };
   });
 }

package/dist/react.js

@@ -1,6 +1,6 @@
 import e from "react";
 import { createComponent as o } from "@lit/react";
-import { F as l } from "./flex-table-C0CCHc1F.js";
+import { F as l } from "./flex-table-DNBCgorV.js";
 const a = o({
   tagName: "flex-table",
   elementClass: l,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iyulab/flex-table",
-  "version": "0.10.1",
+  "version": "0.10.2",
   "description": "A minimalist, input-centric data grid web component",
   "type": "module",
   "main": "./dist/flex-table.js",