@ninebone/table 0.0.252 → 0.0.253

package/dist/nine-table.js

@@ -22,29 +22,29 @@ const qe = class qe extends Pe.constructor {
 };
 h(qe, "Trace");
 let me = qe;
-const _ = new me();
-var C, B, p, D, N, P, ie, V, se;
+const L = new me();
+var _, B, p, D, N, P, ie, V, se;
 const ke = class ke extends HTMLElement {
   constructor() {
     super();
-    u(this, C);
+    u(this, _);
     u(this, B, !1);
     u(this, p);
     u(this, D);
     u(this, N);
     u(this, P);
     u(this, ie, /* @__PURE__ */ h(() => {
-      if (!e(this, C)) return;
-      const t = e(this, C).querySelector(".ng-container-body");
+      if (!e(this, _)) return;
+      const t = e(this, _).querySelector(".ng-container-body");
       t && (y(this, P, new ResizeObserver(() => {
         this.refresh();
       })), e(this, P).observe(t));
     }, "#observeResize"));
     v(this, "refresh", /* @__PURE__ */ h(() => {
-      if (!e(this, C) || !e(this, p) || e(this, B)) return;
+      if (!e(this, _) || !e(this, p) || e(this, B)) return;
       const t = e(this, p).container, s = t.querySelector("table");
       if (!s) return;
-      const n = e(this, p).track, r = e(this, p).thumb, o = e(this, C).querySelector(".ng-container-bottom"), a = t.clientWidth, d = s.scrollWidth;
+      const n = e(this, p).track, r = e(this, p).thumb, o = e(this, _).querySelector(".ng-container-bottom"), a = t.clientWidth, d = s.scrollWidth;
       if (a !== 0 && d > a)
         o && (o.style.display = "flex");
       else {
@@ -59,7 +59,7 @@ const ke = class ke extends HTMLElement {
       let b = 0;
       g > 0 && (b = parseInt(f / g * (l - c), 10)), b < 0 && (b = 0);
       const S = l - c;
-      b > S && (b = S), r.style.left = `${b}px`, _.log(b), e(this, p).left.disabled = b === 0, e(this, p).right.disabled = b >= S - 1;
+      b > S && (b = S), r.style.left = `${b}px`, L.log(b), e(this, p).left.disabled = b === 0, e(this, p).right.disabled = b >= S - 1;
     }, "refresh"));
     u(this, V, /* @__PURE__ */ h((t) => {
       if (!e(this, p)) return !1;
@@ -113,7 +113,7 @@ const ke = class ke extends HTMLElement {
     }, "#init"));
   }
   connectedCallback() {
-    if (y(this, C, this.closest("nine-table-sheet") || this.getRootNode().host), !e(this, C)) return;
+    if (y(this, _, this.closest("nine-table-sheet") || this.getRootNode().host), !e(this, _)) return;
     this.innerHTML = `
             <style>
                 nine-table-hscrollbar {
@@ -178,7 +178,7 @@ const ke = class ke extends HTMLElement {
             <button class='ng-scroll-right' disabled><div class='ng-scroll-icon'></div></button>
         `;
     const t = /* @__PURE__ */ h(() => {
-      const s = e(this, C).querySelector(".ng-container-body");
+      const s = e(this, _).querySelector(".ng-container-body");
       if (!s) {
         setTimeout(t, 10);
         return;
@@ -197,7 +197,7 @@ const ke = class ke extends HTMLElement {
     e(this, P) && e(this, P).disconnect();
   }
 };
-C = new WeakMap(), B = new WeakMap(), p = new WeakMap(), D = new WeakMap(), N = new WeakMap(), P = new WeakMap(), ie = new WeakMap(), V = new WeakMap(), se = new WeakMap(), h(ke, "NineTableHScrollBar");
+_ = new WeakMap(), B = new WeakMap(), p = new WeakMap(), D = new WeakMap(), N = new WeakMap(), P = new WeakMap(), ie = new WeakMap(), V = new WeakMap(), se = new WeakMap(), h(ke, "NineTableHScrollBar");
 let we = ke;
 customElements.get("nine-table-hscrollbar") || customElements.define("nine-table-hscrollbar", we);
 var $, I, R, W, H, M, ne, re, oe, le;
@@ -231,7 +231,7 @@ const Le = class Le {
             const c = Math.max(r - o, 100);
             if (e(this, H) !== c && (y(this, H, c), e(this, R) !== null)) {
               const f = Math.ceil(e(this, H) / e(this, R));
-              y(this, M, f + 20), _.log(`[RowManager] Resized. Height: ${e(this, H)}px | Target Rows: ${e(this, M)}`), [".ng-container-body", ".ng-container-left", ".ng-container-right"].forEach((g) => {
+              y(this, M, f + 20), L.log(`[RowManager] Resized. Height: ${e(this, H)}px | Target Rows: ${e(this, M)}`), [".ng-container-body", ".ng-container-left", ".ng-container-right"].forEach((g) => {
                 const b = s.querySelector(g);
                 b && b.querySelector("tbody") && e(this, le).call(this, b);
               });
@@ -242,7 +242,7 @@ const Le = class Le {
     }, "#initResizeObserver"));
     // 🎯 템플릿 추출, 높이 측정, 초기 렌더링을 순서에 맞게 내부에서 일괄 처리
     v(this, "initialize", /* @__PURE__ */ h((i) => {
-      _.log(i);
+      L.log(i);
       const t = e(this, $).querySelector(".ng-container-body"), s = i.querySelector("tbody"), n = Array.from(s.querySelectorAll("tr"));
       y(this, I, n.map((r) => r.cloneNode(!0))), y(this, R, null), e(this, oe).call(this, t);
     }, "initialize"));
@@ -310,12 +310,12 @@ const Le = class Le {
 };
 $ = new WeakMap(), I = new WeakMap(), R = new WeakMap(), W = new WeakMap(), H = new WeakMap(), M = new WeakMap(), ne = new WeakMap(), re = new WeakMap(), oe = new WeakMap(), le = new WeakMap(), h(Le, "RowManager");
 let xe = Le;
-var A, U, G, F, ae, ce;
+var A, F, G, U, ae, ce;
 const j = class j extends HTMLElement {
   constructor() {
     super();
     u(this, A, null);
-    u(this, U);
+    u(this, F);
     /**
      * 🎯 2차원 셀 격자 인덱스를 계산하여 병합(`rowSpan`/`colSpan`) 셀의 절대 컬럼 위치를 부여
      */
@@ -338,8 +338,8 @@ const j = class j extends HTMLElement {
             }
           const b = g.rowSpan || 1, S = g.colSpan || 1;
           for (let x = 0; x < b; x++)
-            for (let L = 0; L < S; L++)
-              c + x < o && f + L < a && (d[c + x][f + L] = x === 0 && L === 0 ? "1" : "0");
+            for (let C = 0; C < S; C++)
+              c + x < o && f + C < a && (d[c + x][f + C] = x === 0 && C === 0 ? "1" : "0");
         });
       }), n.forEach((l) => {
         const c = l.sectionRowIndex;
@@ -355,7 +355,7 @@ const j = class j extends HTMLElement {
     /**
      * 🎯 원본 테이블을 분석하여 고정 컬럼 영역별(left, body, right)로 완벽하게 쪼개진 테이블 생성
      */
-    u(this, F, /* @__PURE__ */ h((t, s) => {
+    u(this, U, /* @__PURE__ */ h((t, s) => {
       const n = t.cloneNode(!0), r = n.querySelector("colgroup");
       if (!r) return n;
       const o = Array.from(r.querySelectorAll("col")), a = [];
@@ -376,10 +376,10 @@ const j = class j extends HTMLElement {
       const s = /* @__PURE__ */ h((l) => {
         const c = /* @__PURE__ */ h((g) => {
           if (g.querySelector("colgroup")) return;
-          const b = g.querySelector("tbody tr") || g.querySelector("tr"), S = b ? b.querySelectorAll("th, td").length : 1, x = document.createElement("colgroup"), L = Math.max(Math.floor(g.clientWidth / S), 100);
+          const b = g.querySelector("tbody tr") || g.querySelector("tr"), S = b ? b.querySelectorAll("th, td").length : 1, x = document.createElement("colgroup"), C = Math.max(Math.floor(g.clientWidth / S), 100);
           for (let $e = 0; $e < S; $e++) {
             const We = document.createElement("col");
-            We.setAttribute("width", L), x.appendChild(We);
+            We.setAttribute("width", C), x.appendChild(We);
           }
           g.prepend(x);
         }, "ensureColgroup"), f = /* @__PURE__ */ h((g) => {
@@ -394,14 +394,14 @@ const j = class j extends HTMLElement {
         f && e(this, A).querySelectorAll(`[data-col="${c}"]`).forEach((g) => {
           g.setAttribute("fixed", f);
         });
-      }), _.log(e(this, A));
+      }), L.log(e(this, A));
       const o = this.querySelector(".ng-container-left"), a = this.querySelector(".ng-container-body"), d = this.querySelector(".ng-container-right");
       if (a) {
-        const l = e(this, F).call(this, e(this, A), null);
-        a.innerHTML = "", a.appendChild(l), e(this, U).initialize(e(this, A));
+        const l = e(this, U).call(this, e(this, A), null);
+        a.innerHTML = "", a.appendChild(l), e(this, F).initialize(e(this, A));
       }
       if (o) {
-        const l = e(this, F).call(this, e(this, A), "left");
+        const l = e(this, U).call(this, e(this, A), "left");
         let c = 0;
         l.querySelectorAll("col").forEach((g) => {
           const b = parseInt(g.getAttribute("width"), 10);
@@ -411,7 +411,7 @@ const j = class j extends HTMLElement {
         o.style.flex = `0 0 ${f}px`, o.style.width = `${f}px`;
       }
       if (d) {
-        const l = e(this, F).call(this, e(this, A), "right");
+        const l = e(this, U).call(this, e(this, A), "right");
         let c = 0;
         l.querySelectorAll("col").forEach((g) => {
           const b = parseInt(g.getAttribute("width"), 10);
@@ -428,7 +428,7 @@ const j = class j extends HTMLElement {
         (l = this.querySelector("nine-table-hscrollbar")) == null || l.refresh();
       }, 0);
     }, "generate"));
-    v(this, "getRowHeight", /* @__PURE__ */ h(() => e(this, U).getRowHeight(), "getRowHeight"));
+    v(this, "getRowHeight", /* @__PURE__ */ h(() => e(this, F).getRowHeight(), "getRowHeight"));
     v(this, "scrollToX", /* @__PURE__ */ h((t) => {
       const s = this.querySelector(".ng-container-body");
       s && (s.scrollLeft = t);
@@ -440,10 +440,10 @@ const j = class j extends HTMLElement {
     u(this, ae, /* @__PURE__ */ h(() => {
       const t = /* @__PURE__ */ h(() => {
         var c, f, g;
-        _.log(":::::::::::::::");
+        L.log(":::::::::::::::");
         const s = this.querySelector(".ng-container-left table"), n = this.querySelector(".ng-container-body table"), r = this.querySelector(".ng-container-right table");
-        if (!n) return;
-        _.log("22222");
+        if (L.log(n), !n) return;
+        L.log("22222");
         const o = s ? Array.from(s.querySelectorAll("tr")) : [], a = Array.from(n.querySelectorAll("tr")), d = r ? Array.from(r.querySelectorAll("tr")) : [], l = Math.max(o.length, a.length, d.length);
         for (let b = 0; b < l; b++) {
           const S = [
@@ -451,10 +451,12 @@ const j = class j extends HTMLElement {
             ((f = a[b]) == null ? void 0 : f.getBoundingClientRect().height) || 0,
             ((g = d[b]) == null ? void 0 : g.getBoundingClientRect().height) || 0
           ], x = Math.max(...S);
-          _.log(x), x > 0 && (o[b] && (o[b].style.height = `${x}px`), a[b] && (a[b].style.height = `${x}px`), d[b] && (d[b].style.height = `${x}px`));
+          L.log(x), x > 0 && (o[b] && (o[b].style.height = `${x}px`), a[b] && (a[b].style.height = `${x}px`), d[b] && (d[b].style.height = `${x}px`));
         }
       }, "syncRowHeights");
-      e(this, ce).call(this), t(), new MutationObserver((s) => {
+      e(this, ce).call(this), requestAnimationFrame(() => {
+        t();
+      }), new MutationObserver((s) => {
         for (const n of s)
           n.attributeName === "class" && this.classList.contains("active") && t();
       }).observe(this, { attributes: !0 });
@@ -583,16 +585,16 @@ const j = class j extends HTMLElement {
             </div>
         `;
     }, "#render"));
-    y(this, U, new xe(this));
+    y(this, F, new xe(this));
   }
   connectedCallback() {
     e(this, ae).call(this);
   }
   disconnectedCallback() {
-    this.innerHTML = "", _.log("NineTableSheet destroyed.");
+    this.innerHTML = "", L.log("NineTableSheet destroyed.");
   }
 };
-A = new WeakMap(), U = new WeakMap(), G = new WeakMap(), F = new WeakMap(), ae = new WeakMap(), ce = new WeakMap(), h(j, "NineTableSheet"), v(j, "SCROLLBAR_SIZE", 16);
+A = new WeakMap(), F = new WeakMap(), G = new WeakMap(), U = new WeakMap(), ae = new WeakMap(), ce = new WeakMap(), h(j, "NineTableSheet"), v(j, "SCROLLBAR_SIZE", 16);
 let te = j;
 customElements.get("nine-table-sheet") || customElements.define("nine-table-sheet", te);
 var he, J;
@@ -613,8 +615,8 @@ const Ce = class Ce extends HTMLElement {
         Array.from(this.querySelectorAll("nine-splitter")).forEach((b) => b.style.setProperty("display", "none"));
         const g = c.filter((b) => b.classList.contains("active"));
         g.length < 2 || g.forEach((b) => {
-          const S = parseInt(b.getAttribute("data-index"), 10), x = this.querySelector(`nine-splitter[data-split-index="${S}"]`), L = c[S + 1];
-          x && L && L.classList.contains("active") && x.style.setProperty("display", "flex");
+          const S = parseInt(b.getAttribute("data-index"), 10), x = this.querySelector(`nine-splitter[data-split-index="${S}"]`), C = c[S + 1];
+          x && C && C.classList.contains("active") && x.style.setProperty("display", "flex");
         });
       }, "updateSplitters"), r = this.querySelector(".nine-tab-bar"), o = this.querySelector("nine-table-sheets-body"), a = r.querySelectorAll(".nine-tab-item"), d = o.querySelectorAll("nine-table-sheet");
       if (!a[t]) return;
@@ -978,10 +980,10 @@ const Me = class Me extends HTMLElement {
     this.attachShadow({ mode: "open" }), y(this, Y, new Ae(this));
   }
   connectedCallback() {
-    y(this, pe, new Se(this)), _.log("NineTable connected."), this.dispatchEvent(new CustomEvent("load", { bubbles: !0, detail: { target: this } }));
+    y(this, pe, new Se(this)), L.log("NineTable connected."), this.dispatchEvent(new CustomEvent("load", { bubbles: !0, detail: { target: this } }));
   }
   disconnectedCallback() {
-    _.log("NineTable disconnected.");
+    L.log("NineTable disconnected.");
   }
   // 🎯 외부에서 grid.data.set(...) 형태로 접근할 수 있도록 데이터 매니저 오픈
   get data() {