@ninebone/table 0.0.303 → 0.0.305

package/dist/nine-table.js

@@ -21,30 +21,30 @@ const Vt = class Vt extends re.constructor {
   }
 };
 a(Vt, "Trace");
-let _t = Vt;
-const _ = new _t();
-var C, $, y, D, P, B, dt, N, ft;
+let $t = Vt;
+const H = new $t();
+var M, _, y, D, P, B, dt, N, ft;
 const Xt = class Xt extends HTMLElement {
   constructor() {
     super();
-    d(this, C);
-    d(this, $, !1);
+    d(this, M);
+    d(this, _, !1);
     d(this, y);
     d(this, D);
     d(this, P);
     d(this, B);
     d(this, dt, /* @__PURE__ */ a(() => {
-      if (!t(this, C)) return;
-      const e = t(this, C).querySelector(".ng-container-body");
+      if (!t(this, M)) return;
+      const e = t(this, M).querySelector(".ng-container-body");
       e && (b(this, B, new ResizeObserver(() => {
         this.refresh();
       })), t(this, B).observe(e));
     }, "#observeResize"));
     S(this, "refresh", /* @__PURE__ */ a(() => {
-      if (!t(this, C) || !t(this, y) || t(this, $)) return;
+      if (!t(this, M) || !t(this, y) || t(this, _)) return;
       const e = t(this, y).container, s = e.querySelector("table");
       if (!s) return;
-      const n = t(this, y).track, o = t(this, y).thumb, r = t(this, C).querySelector(".ng-container-bottom"), l = e.clientWidth, c = s.scrollWidth;
+      const n = t(this, y).track, o = t(this, y).thumb, r = t(this, M).querySelector(".ng-container-bottom"), l = e.clientWidth, c = s.scrollWidth;
       if (l !== 0 && c > l)
         r && (r.style.display = "flex");
       else {
@@ -59,7 +59,7 @@ const Xt = class Xt extends HTMLElement {
       let p = 0;
       g > 0 && (p = parseInt(f / g * (h - u), 10)), p < 0 && (p = 0);
       const w = h - u;
-      p > w && (p = w), o.style.left = `${p}px`, _.log(p), t(this, y).left.disabled = p === 0, t(this, y).right.disabled = p >= w - 1;
+      p > w && (p = w), o.style.left = `${p}px`, H.log(p), t(this, y).left.disabled = p === 0, t(this, y).right.disabled = p >= w - 1;
     }, "refresh"));
     d(this, N, /* @__PURE__ */ a((e) => {
       if (!t(this, y)) return !1;
@@ -99,20 +99,20 @@ const Xt = class Xt extends HTMLElement {
         t(this, N).call(this, n.clientX - o.left - r / 2);
       }), t(this, y).thumb.addEventListener("mousedown", (n) => {
         if (n.button !== 0) return;
-        n.stopPropagation(), n.preventDefault(), b(this, $, !0), this.shiftX = n.clientX - t(this, y).thumb.getBoundingClientRect().left;
+        n.stopPropagation(), n.preventDefault(), b(this, _, !0), this.shiftX = n.clientX - t(this, y).thumb.getBoundingClientRect().left;
         const o = /* @__PURE__ */ a((l) => {
-          if (!t(this, $)) return;
+          if (!t(this, _)) return;
           const c = t(this, y).track.getBoundingClientRect();
           t(this, N).call(this, l.clientX - c.left - this.shiftX);
         }, "onMouseMove"), r = /* @__PURE__ */ a(() => {
-          b(this, $, !1), s(), document.removeEventListener("mousemove", o), document.removeEventListener("mouseup", r), this.refresh();
+          b(this, _, !1), s(), document.removeEventListener("mousemove", o), document.removeEventListener("mouseup", r), this.refresh();
         }, "onMouseUp");
         document.addEventListener("mousemove", o), document.addEventListener("mouseup", r);
       });
     }, "#init"));
   }
   connectedCallback() {
-    if (b(this, C, this.closest("nine-table-sheet") || this.getRootNode().host), !t(this, C)) return;
+    if (b(this, M, this.closest("nine-table-sheet") || this.getRootNode().host), !t(this, M)) return;
     this.innerHTML = `
             <style>
                 nine-table-hscrollbar {
@@ -177,7 +177,7 @@ const Xt = class Xt extends HTMLElement {
             <button class='ng-scroll-right' disabled><div class='ng-scroll-icon'></div></button>
         `;
     const e = /* @__PURE__ */ a(() => {
-      const s = t(this, C).querySelector(".ng-container-body");
+      const s = t(this, M).querySelector(".ng-container-body");
       if (!s) {
         setTimeout(e, 10);
         return;
@@ -189,7 +189,7 @@ const Xt = class Xt extends HTMLElement {
         left: this.querySelector(".ng-scroll-left"),
         right: this.querySelector(".ng-scroll-right")
       }), s.addEventListener("scroll", () => {
-        t(this, $) || this.refresh();
+        t(this, _) || this.refresh();
       }), t(this, ft).call(this), t(this, dt).call(this), this.refresh();
     }, "initWhenReady");
     e();
@@ -198,9 +198,9 @@ const Xt = class Xt extends HTMLElement {
     t(this, B) && t(this, B).disconnect();
   }
 };
-C = new WeakMap(), $ = new WeakMap(), y = new WeakMap(), D = new WeakMap(), P = new WeakMap(), B = new WeakMap(), dt = new WeakMap(), N = new WeakMap(), ft = new WeakMap(), a(Xt, "NineTableHScrollBar");
-let $t = Xt;
-customElements.get("nine-table-hscrollbar") || customElements.define("nine-table-hscrollbar", $t);
+M = new WeakMap(), _ = new WeakMap(), y = new WeakMap(), D = new WeakMap(), P = new WeakMap(), B = new WeakMap(), dt = new WeakMap(), N = new WeakMap(), ft = new WeakMap(), a(Xt, "NineTableHScrollBar");
+let _t = Xt;
+customElements.get("nine-table-hscrollbar") || customElements.define("nine-table-hscrollbar", _t);
 var Y, I, E, it, st, ut;
 const Ut = class Ut extends HTMLElement {
   constructor() {
@@ -353,12 +353,12 @@ Y = new WeakMap(), I = new WeakMap(), E = new WeakMap(), it = new WeakMap(), st
 let It = Ut;
 customElements.get("nine-table-vscrollbar") || customElements.define("nine-table-vscrollbar", It);
 var gt, j;
-const H = class H {
+const C = class C {
   /**
    * 🎯 레이아웃 내의 여러 rawTables 배열을 일괄로 받아 단일 마스터 템플릿으로 사전 컴파일합니다.
    */
   static compileAll(i) {
-    return Array.isArray(i) ? i.map((e) => H.compile(e)) : [];
+    return Array.isArray(i) ? i.map((e) => C.compile(e)) : [];
   }
   /**
    * 🎯 단일 원본 테이블을 받아 기본 구조 보정 및 2차원 격자 인덱스 사전 부여 완료된 마스터 테이블 반환
@@ -367,7 +367,7 @@ const H = class H {
     var n, o, r, l;
     if (!i) return null;
     const e = i.cloneNode(!0);
-    return t(n = H, gt).call(n, e), t(o = H, j).call(o, e, "thead"), t(r = H, j).call(r, e, "tbody"), t(l = H, j).call(l, e, "tfoot"), Array.from(e.querySelectorAll("colgroup col")).forEach((c, h) => {
+    return t(n = C, gt).call(n, e), t(o = C, j).call(o, e, "thead"), t(r = C, j).call(r, e, "tbody"), t(l = C, j).call(l, e, "tfoot"), Array.from(e.querySelectorAll("colgroup col")).forEach((c, h) => {
       const u = c.getAttribute("fixed");
       u && e.querySelectorAll(`thead [data-col="${h}"], tbody [data-col="${h}"], tfoot [data-col="${h}"]`).forEach((f) => {
         f.setAttribute("fixed", u);
@@ -375,7 +375,7 @@ const H = class H {
     }), e;
   }
 };
-gt = new WeakMap(), j = new WeakMap(), a(H, "TableCompiler"), d(H, gt, /* @__PURE__ */ a((i) => {
+gt = new WeakMap(), j = new WeakMap(), a(C, "TableCompiler"), d(C, gt, /* @__PURE__ */ a((i) => {
   if (!i.querySelector("colgroup")) {
     const e = i.querySelector("tbody tr") || i.querySelector("tr"), s = e ? e.querySelectorAll("th, td").length : 1, n = document.createElement("colgroup"), o = Math.max(Math.floor(i.clientWidth / s), 100);
     for (let r = 0; r < s; r++) {
@@ -389,7 +389,7 @@ gt = new WeakMap(), j = new WeakMap(), a(H, "TableCompiler"), d(H, gt, /* @__PUR
     s ? s.after(e) : i.prepend(e);
   }
   i.classList.add("nine-table-element"), i.style.display = "table";
-}, "#ensureTableStructure")), d(H, j, /* @__PURE__ */ a((i, e) => {
+}, "#ensureTableStructure")), d(C, j, /* @__PURE__ */ a((i, e) => {
   const s = Array.from(i.querySelectorAll(e + " tr")), n = Array.from(i.querySelectorAll(e + " th," + e + " td")), o = s.length;
   if (o === 0 || n.length === 0) return;
   let r = 0;
@@ -422,12 +422,12 @@ gt = new WeakMap(), j = new WeakMap(), a(H, "TableCompiler"), d(H, gt, /* @__PUR
     });
   });
 }, "#resetColIndex"));
-let Wt = H;
-var m, M, R, W, V, X, bt, pt, nt, ot, yt, mt, rt, F, xt;
+let Wt = C;
+var m, $, R, W, V, X, bt, pt, nt, ot, yt, mt, rt, F, xt;
 const Kt = class Kt {
   constructor(i) {
     d(this, m);
-    d(this, M, /* @__PURE__ */ new Map());
+    d(this, $, /* @__PURE__ */ new Map());
     // 각 컨테이너별 독립된 템플릿 TR 관리
     d(this, R, null);
     d(this, W, null);
@@ -446,7 +446,7 @@ const Kt = class Kt {
      */
     // [RowManager.js 수정 내용 발췌]
     S(this, "initialize", /* @__PURE__ */ a(() => {
-      b(this, R, null), t(this, M).clear(), [".ng-container-body", ".ng-container-left", ".ng-container-right"].forEach((e) => {
+      b(this, R, null), t(this, $).clear(), [".ng-container-body", ".ng-container-left", ".ng-container-right"].forEach((e) => {
         const s = t(this, m).querySelector(e);
         if (!s) return;
         const n = s.querySelector("table");
@@ -454,7 +454,7 @@ const Kt = class Kt {
         const o = n.querySelector("tbody");
         if (!o) return;
         const l = Array.from(o.querySelectorAll("tr")).map((c) => c.cloneNode(!0));
-        t(this, M).set(e, l);
+        t(this, $).set(e, l);
       });
       const i = t(this, m).querySelector(".ng-container-body");
       if (i) {
@@ -463,12 +463,12 @@ const Kt = class Kt {
         i.addEventListener("scroll", () => {
           var n;
           const s = i.scrollTop;
-          _.log(e, s), e !== s && (e = s, t(this, F).call(this, s)), (n = t(this, m).querySelector("nine-table-vscrollbar")) == null || n.refresh();
+          H.log(e, s), e !== s && (e = s, t(this, F).call(this, s)), (n = t(this, m).querySelector("nine-table-vscrollbar")) == null || n.refresh();
         });
       }
     }, "initialize"));
     d(this, bt, /* @__PURE__ */ a((i, e) => {
-      const s = t(this, M).get(e);
+      const s = t(this, $).get(e);
       if (!s || s.length === 0) return;
       const n = i.querySelector("tbody");
       if (!n) return;
@@ -486,7 +486,7 @@ const Kt = class Kt {
     d(this, pt, /* @__PURE__ */ a((i) => {
       if (t(this, R) !== null && t(this, R) > 0)
         return t(this, R);
-      const e = t(this, M).get(".ng-container-body");
+      const e = t(this, $).get(".ng-container-body");
       if (!e || e.length === 0) return 24;
       const s = i.querySelector("tbody");
       if (!s) return 24;
@@ -501,7 +501,7 @@ const Kt = class Kt {
       const f = s.querySelectorAll("tr:not(.nodata)");
       return f.forEach((g) => {
         u += g.offsetHeight || g.getBoundingClientRect().height;
-      }), f.forEach((g) => g.remove()), r.style.display = l, r.style.visibility = c, r.style.position = h, b(this, R, u > 0 ? u : 24), t(this, ot).call(this), _.log(`[RowManager] Height Cached: ${t(this, R)}px | RowCount: ${t(this, X)}`), t(this, R);
+      }), f.forEach((g) => g.remove()), r.style.display = l, r.style.visibility = c, r.style.position = h, b(this, R, u > 0 ? u : 24), t(this, ot).call(this), H.log(`[RowManager] Height Cached: ${t(this, R)}px | RowCount: ${t(this, X)}`), t(this, R);
     }, "#measureAndCacheHeight"));
     /**
      * 🎯 전체 데이터 개수 기반으로 가상 스크롤 높이 설정
@@ -513,9 +513,9 @@ const Kt = class Kt {
       var o, r, l, c;
       if (!t(this, m).querySelector(".ng-container-body")) return;
       const e = (typeof ((o = t(this, m).data) == null ? void 0 : o.count) == "function" ? t(this, m).data.count() : null) ?? ((l = (r = t(this, m).dataManager) == null ? void 0 : r.rawRecords) == null ? void 0 : l.length) ?? ((c = t(this, m).data) == null ? void 0 : c.length) ?? 0, s = t(this, R) || 24, n = e * s;
-      _.log(`[RowManager] TotalCount: ${e} | RowHeight: ${s}px | TotalVirtualHeight: ${n}px`), [".ng-container-body", ".ng-container-left", ".ng-container-right"].forEach((h) => {
+      H.log(`[RowManager] TotalCount: ${e} | RowHeight: ${s}px | TotalVirtualHeight: ${n}px`), [".ng-container-body", ".ng-container-left", ".ng-container-right"].forEach((h) => {
         const u = t(this, m).querySelector(h), f = u == null ? void 0 : u.querySelector("table");
-        f ? (f.style.height = `${n}px`, _.log(`[RowManager] Applied height to ${h} table:`, f.style.height)) : _.log(`[RowManager] Table not found for selector: ${h}`);
+        f ? (f.style.height = `${n}px`, H.log(`[RowManager] Applied height to ${h} table:`, f.style.height)) : H.log(`[RowManager] Table not found for selector: ${h}`);
       });
     }, "#updateVirtualScrollHeight"));
     d(this, ot, /* @__PURE__ */ a(() => {
@@ -573,17 +573,28 @@ const Kt = class Kt {
     /**
      * 🎯 스크롤 위치에 따른 데이터 바인딩 및 tbody 미세 픽셀 이동(translateY) 갱신
      */
+    /**
+     * 🎯 스크롤 위치에 따른 데이터 바인딩 및 tbody 미세 픽셀 이동(translateY) 갱신
+     */
     d(this, F, /* @__PURE__ */ a((i) => {
       var r;
       const e = t(this, R);
-      if (!e || e <= 0) return;
-      const s = Math.max(0, Math.floor(i / e)), n = i % e, o = ((r = t(this, M).get(".ng-container-body")) == null ? void 0 : r.length) || 1;
+      if (!e || e <= 0) {
+        H.log("[RowManager] #handleScroll Aborted: rowHeight is invalid", e);
+        return;
+      }
+      const s = Math.max(0, Math.floor(i / e)), n = i % e;
+      H.log(`[RowManager] ScrollTop: ${i} | StartIndex: ${s} | OffsetY: ${n}px`);
+      const o = ((r = t(this, $).get(".ng-container-body")) == null ? void 0 : r.length) || 1;
       [".ng-container-body", ".ng-container-left", ".ng-container-right"].forEach((l) => {
         const c = t(this, m).querySelector(l);
         if (!c) return;
         const h = c.querySelector("tbody");
-        if (!h) return;
-        h.style.transform = `translateY(-${n}px)`, h.style.willChange = "transform", Array.from(h.querySelectorAll("tr:not(.nodata)")).forEach((f, g) => {
+        if (!h) {
+          H.log(`[RowManager] tbody not found for selector: ${l}`);
+          return;
+        }
+        window.getComputedStyle(h).position === "static" && (h.style.position = "relative"), h.style.transform = `translateY(-${n}px)`, h.style.willChange = "transform", Array.from(h.querySelectorAll("tr:not(.nodata)")).forEach((f, g) => {
           var k, tt, Qt, te;
           const p = s + Math.floor(g / o), w = (typeof t(this, m).getData == "function" ? t(this, m).getData(p) : null) ?? (typeof ((k = t(this, m).data) == null ? void 0 : k.get) == "function" ? t(this, m).data.get(p) : null) ?? ((Qt = (tt = t(this, m).dataManager) == null ? void 0 : tt.rawRecords) == null ? void 0 : Qt[p]) ?? ((te = t(this, m).data) == null ? void 0 : te[p]) ?? null;
           w ? (f.style.display = "", t(this, xt).call(this, f, w, p)) : f.style.display = "none";
@@ -609,10 +620,10 @@ const Kt = class Kt {
   }
   templateLength(i = ".ng-container-body") {
     var e;
-    return ((e = t(this, M).get(i)) == null ? void 0 : e.length) || 1;
+    return ((e = t(this, $).get(i)) == null ? void 0 : e.length) || 1;
   }
 };
-m = new WeakMap(), M = new WeakMap(), R = new WeakMap(), W = new WeakMap(), V = new WeakMap(), X = new WeakMap(), bt = new WeakMap(), pt = new WeakMap(), nt = new WeakMap(), ot = new WeakMap(), yt = new WeakMap(), mt = new WeakMap(), rt = new WeakMap(), F = new WeakMap(), xt = new WeakMap(), a(Kt, "RowManager");
+m = new WeakMap(), $ = new WeakMap(), R = new WeakMap(), W = new WeakMap(), V = new WeakMap(), X = new WeakMap(), bt = new WeakMap(), pt = new WeakMap(), nt = new WeakMap(), ot = new WeakMap(), yt = new WeakMap(), mt = new WeakMap(), rt = new WeakMap(), F = new WeakMap(), xt = new WeakMap(), a(Kt, "RowManager");
 let Ot = Kt;
 var Z, G, vt, wt, St, Et, Rt;
 const et = class et extends HTMLElement {
@@ -817,7 +828,7 @@ const et = class et extends HTMLElement {
     t(this, Et).call(this);
   }
   disconnectedCallback() {
-    this.innerHTML = "", _.log("NineTableSheet destroyed.");
+    this.innerHTML = "", H.log("NineTableSheet destroyed.");
   }
 };
 Z = new WeakMap(), G = new WeakMap(), vt = new WeakMap(), wt = new WeakMap(), St = new WeakMap(), Et = new WeakMap(), Rt = new WeakMap(), a(et, "NineTableSheet"), S(et, "SCROLLBAR_SIZE", 16);
@@ -1206,10 +1217,10 @@ const Jt = class Jt extends HTMLElement {
     this.attachShadow({ mode: "open" }), b(this, K, new Nt(this));
   }
   connectedCallback() {
-    b(this, Mt, new Dt(this)), _.log("NineTable connected."), this.dispatchEvent(new CustomEvent("load", { bubbles: !0, detail: { target: this } }));
+    b(this, Mt, new Dt(this)), H.log("NineTable connected."), this.dispatchEvent(new CustomEvent("load", { bubbles: !0, detail: { target: this } }));
   }
   disconnectedCallback() {
-    _.log("NineTable disconnected.");
+    H.log("NineTable disconnected.");
   }
   // 🎯 외부에서 grid.data.set(...) 형태로 접근할 수 있도록 데이터 매니저 오픈
   get data() {