@ninebone/table 0.0.259 → 0.0.261

package/dist/nine-table.js

@@ -310,12 +310,12 @@ const Le = class Le {
 };
 $ = new WeakMap(), _ = new WeakMap(), A = new WeakMap(), W = new WeakMap(), H = new WeakMap(), I = new WeakMap(), ne = new WeakMap(), re = new WeakMap(), oe = new WeakMap(), le = new WeakMap(), c(Le, "RowManager");
 let xe = Le;
-var E, F, G, U, ae, ce;
+var R, U, G, F, ae, ce;
 const j = class j extends HTMLElement {
   constructor() {
     super();
-    u(this, E, null);
-    u(this, F);
+    u(this, R, null);
+    u(this, U);
     /**
      * 🎯 2차원 셀 격자 인덱스를 계산하여 병합(`rowSpan`/`colSpan`) 셀의 절대 컬럼 위치를 부여
      */
@@ -355,7 +355,7 @@ const j = class j extends HTMLElement {
     /**
      * 🎯 순수 바닐라 자바스크립트(Vanilla JS) 기반의 깔끔한 #createSplitTable
      */
-    u(this, U, /* @__PURE__ */ c((t, s) => {
+    u(this, F, /* @__PURE__ */ c((t, s) => {
       const n = t.cloneNode(!0);
       return s === "left" ? n.querySelectorAll("col, th, td").forEach((r) => {
         r.getAttribute("fixed") !== "left" && r.remove();
@@ -383,19 +383,19 @@ const j = class j extends HTMLElement {
         }, "ensureThead");
         return h(l), f(l), l.classList.add("nine-table-element"), l;
       }, "initializeTable"), n = t.cloneNode(!0);
-      y(this, E, s(n)), e(this, E).style.display = "table", e(this, G).call(this, e(this, E), "thead"), e(this, G).call(this, e(this, E), "tbody"), Array.from(e(this, E).querySelectorAll("colgroup col")).forEach((l, h) => {
+      y(this, R, s(n)), e(this, R).style.display = "table", e(this, G).call(this, e(this, R), "thead"), e(this, G).call(this, e(this, R), "tbody"), Array.from(e(this, R).querySelectorAll("colgroup col")).forEach((l, h) => {
         const f = l.getAttribute("fixed");
-        f && e(this, E).querySelectorAll(`[data-col="${h}"]`).forEach((g) => {
+        f && e(this, R).querySelectorAll(`[data-col="${h}"]`).forEach((g) => {
           g.setAttribute("fixed", f);
         });
-      }), M.log(e(this, E));
+      }), M.log(e(this, R));
       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, U).call(this, e(this, E), null);
-        a.innerHTML = "", a.appendChild(l), M.log(e(this, E)), M.log(l), e(this, F).initialize(e(this, E));
+        const l = e(this, F).call(this, e(this, R), null);
+        a.innerHTML = "", a.appendChild(l), M.log(e(this, R)), M.log(l), e(this, U).initialize(e(this, R));
       }
       if (o) {
-        const l = e(this, U).call(this, e(this, E), "left");
+        const l = e(this, F).call(this, e(this, R), "left");
         let h = 0;
         l.querySelectorAll("col").forEach((g) => {
           const b = parseInt(g.getAttribute("width"), 10);
@@ -405,7 +405,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, U).call(this, e(this, E), "right");
+        const l = e(this, F).call(this, e(this, R), "right");
         let h = 0;
         l.querySelectorAll("col").forEach((g) => {
           const b = parseInt(g.getAttribute("width"), 10);
@@ -422,7 +422,7 @@ const j = class j extends HTMLElement {
         (l = this.querySelector("nine-table-hscrollbar")) == null || l.refresh();
       }, 0);
     }, "generate"));
-    x(this, "getRowHeight", /* @__PURE__ */ c(() => e(this, F).getRowHeight(), "getRowHeight"));
+    x(this, "getRowHeight", /* @__PURE__ */ c(() => e(this, U).getRowHeight(), "getRowHeight"));
     x(this, "scrollToX", /* @__PURE__ */ c((t) => {
       const s = this.querySelector(".ng-container-body");
       s && (s.scrollLeft = t);
@@ -446,9 +446,10 @@ const j = class j extends HTMLElement {
           v > 0 && (o[b] && (o[b].style.height = `${v}px`), a[b] && (a[b].style.height = `${v}px`), d[b] && (d[b].style.height = `${v}px`));
         }
       }, "syncRowHeights");
-      e(this, ce).call(this), requestAnimationFrame(() => {
-        t();
-      }), new MutationObserver((s) => {
+      e(this, ce).call(this), new ResizeObserver((s) => {
+        for (let n of s)
+          n.contentRect.height > 0 && t();
+      }).observe(this.querySelector(".ng-container-body")), new MutationObserver((s) => {
         for (const n of s)
           n.attributeName === "class" && this.classList.contains("active") && t();
       }).observe(this, { attributes: !0 });
@@ -577,7 +578,7 @@ const j = class j extends HTMLElement {
             </div>
         `;
     }, "#render"));
-    y(this, F, new xe(this));
+    y(this, U, new xe(this));
   }
   connectedCallback() {
     e(this, ae).call(this);
@@ -586,7 +587,7 @@ const j = class j extends HTMLElement {
     this.innerHTML = "", M.log("NineTableSheet destroyed.");
   }
 };
-E = new WeakMap(), F = new WeakMap(), G = new WeakMap(), U = new WeakMap(), ae = new WeakMap(), ce = new WeakMap(), c(j, "NineTableSheet"), x(j, "SCROLLBAR_SIZE", 16);
+R = new WeakMap(), U = new WeakMap(), G = new WeakMap(), F = new WeakMap(), ae = new WeakMap(), ce = new WeakMap(), c(j, "NineTableSheet"), x(j, "SCROLLBAR_SIZE", 16);
 let te = j;
 customElements.get("nine-table-sheet") || customElements.define("nine-table-sheet", te);
 var he, J;
@@ -640,29 +641,29 @@ const Ce = class Ce extends HTMLElement {
 he = new WeakMap(), J = new WeakMap(), c(Ce, "NineTableSheets");
 let ve = Ce;
 customElements.get("nine-table-sheets") || customElements.define("nine-table-sheets", ve);
-var R, de, Q, fe;
+var E, de, Q, fe;
 const _e = class _e {
   constructor(i) {
-    u(this, R);
+    u(this, E);
     u(this, de, /* @__PURE__ */ c(() => {
       e(this, fe).call(this), new ResizeObserver((i) => {
         for (let t of i)
-          e(this, R).getAttribute("auto-height") === "true" && e(this, Q).call(this);
-      }).observe(e(this, R));
+          e(this, E).getAttribute("auto-height") === "true" && e(this, Q).call(this);
+      }).observe(e(this, E));
     }, "#init"));
     u(this, Q, /* @__PURE__ */ c(() => {
       var d, l;
-      const i = Array.from(e(this, R).shadowRoot.querySelectorAll("nine-table-sheet.active"));
+      const i = Array.from(e(this, E).shadowRoot.querySelectorAll("nine-table-sheet.active"));
       if (i.length === 0) return;
-      const t = parseInt(e(this, R).getAttribute("max-display-row"), 10) || 10, s = Math.max(...i.map((h) => h.getRowHeight())), n = (d = e(this, R).shadowRoot.querySelector("nine-table-header")) == null ? void 0 : d.getBoundingClientRect().height, r = (l = e(this, R).shadowRoot.querySelector("nine-table-sheets-footer")) == null ? void 0 : l.getBoundingClientRect().height, o = te.SCROLLBAR_SIZE, a = t * s + n + r + o;
-      e(this, R).style.height = `${a}px`;
+      const t = parseInt(e(this, E).getAttribute("max-display-row"), 10) || 10, s = Math.max(...i.map((h) => h.getRowHeight())), n = (d = e(this, E).shadowRoot.querySelector("nine-table-header")) == null ? void 0 : d.getBoundingClientRect().height, r = (l = e(this, E).shadowRoot.querySelector("nine-table-sheets-footer")) == null ? void 0 : l.getBoundingClientRect().height, o = te.SCROLLBAR_SIZE, a = t * s + n + r + o;
+      e(this, E).style.height = `${a}px`;
     }, "#applyAutoHeight"));
     u(this, fe, /* @__PURE__ */ c(() => {
-      const t = Array.from(e(this, R).children).filter((d) => d.tagName === "TABLE"), s = e(this, R).getAttribute("auto-height") === "true", n = t.length, r = t.map((d, l) => {
+      const t = Array.from(e(this, E).children).filter((d) => d.tagName === "TABLE"), s = e(this, E).getAttribute("auto-height") === "true", n = t.length, r = t.map((d, l) => {
         const f = `<nine-table-sheet class="${l === 0 ? "active" : ""}" data-index="${l}"></nine-table-sheet>`, g = l < n - 1 ? `<nine-splitter class="h" data-split-index="${l}"></nine-splitter>` : "";
         return f + g;
       }).join(""), o = t.map((d, l) => `<div class="nine-tab-item ${l === 0 ? "active" : ""}" data-index="${l}">Sheet ${l + 1}</div>`).join("");
-      e(this, R).shadowRoot.innerHTML = `
+      e(this, E).shadowRoot.innerHTML = `
             <style>
                 :host { 
                     display: flex; 
@@ -761,17 +762,17 @@ const _e = class _e {
             </nine-table-body>
             <nine-table-footer></nine-table-footer>
         `;
-      const a = e(this, R).shadowRoot.querySelectorAll("nine-table-sheet");
+      const a = e(this, E).shadowRoot.querySelectorAll("nine-table-sheet");
       a == null || a.forEach((d, l) => {
         t[l] && setTimeout(() => {
           d.generate(t[l]), s && e(this, Q).call(this);
         });
       });
     }, "#render"));
-    y(this, R, i), e(this, de).call(this);
+    y(this, E, i), e(this, de).call(this);
   }
 };
-R = new WeakMap(), de = new WeakMap(), Q = new WeakMap(), fe = new WeakMap(), c(_e, "LayoutManager");
+E = new WeakMap(), de = new WeakMap(), Q = new WeakMap(), fe = new WeakMap(), c(_e, "LayoutManager");
 let Se = _e;
 var z, X;
 const He = class He {
@@ -795,7 +796,7 @@ const He = class He {
   }
 };
 z = new WeakMap(), X = new WeakMap(), c(He, "ngRow");
-let Ee = He;
+let Re = He;
 var T, w, q, K, ue, O, ge, ee, be, ye, Z;
 const k = class k {
   constructor(i, t) {
@@ -940,10 +941,10 @@ x(k, "ROW_STATE", {
   UPDATE: "UPDATE",
   DELETE: "DELETE"
 });
-let Re = k;
+let Ee = k;
 const Ie = class Ie {
   constructor(i) {
-    this.owner = i, this.row = new Ee(this), this.data = new Re(i, this), this.rawRecords = [], this.viewRecords = [], this.delRecords = [], this.pageCnt = 25, this.viewRecords.reset = () => {
+    this.owner = i, this.row = new Re(this), this.data = new Ee(i, this), this.rawRecords = [], this.viewRecords = [], this.delRecords = [], this.pageCnt = 25, this.viewRecords.reset = () => {
       var t;
       (t = this.owner.view) != null && t.redraw && this.owner.view.redraw();
     }, this.setDataSource = (t) => {