@toolbox-web/grid 0.4.2 → 0.6.0

package/lib/plugins/column-virtualization/index.js

@@ -185,10 +185,21 @@ class b {
     return this.grid;
   }
   /**
-   * Get the shadow root of the grid.
+   * Get the render root of the grid for DOM queries.
+   * @deprecated Use `gridElement` instead. This getter exists only for backward compatibility.
+   *
+   * With Shadow DOM removed, the grid element itself is the render root.
+   * All new code should use `this.gridElement` for DOM queries.
+   *
+   * @example
+   * // OLD (deprecated)
+   * const rows = this.shadowRoot?.querySelector('.rows');
+   *
+   * // NEW (preferred)
+   * const rows = this.gridElement.querySelector('.rows');
    */
   get shadowRoot() {
-    return this.grid?.shadowRoot ?? null;
+    return this.gridElement;
   }
   /**
    * Get the disconnect signal for event listener cleanup.
@@ -239,7 +250,7 @@ class b {
     const t = this.grid?.effectiveConfig?.animation?.mode ?? "reduced-motion";
     if (t === !1 || t === "off") return !1;
     if (t === !0 || t === "on") return !0;
-    const e = this.shadowRoot?.host;
+    const e = this.gridElement;
     return e ? getComputedStyle(e).getPropertyValue("--tbw-animation-enabled").trim() !== "0" : !0;
   }
   /**
@@ -255,7 +266,7 @@ class b {
    * ```
    */
   get animationDuration() {
-    const t = this.shadowRoot?.host;
+    const t = this.gridElement;
     if (t) {
       const e = getComputedStyle(t).getPropertyValue("--tbw-animation-duration").trim(), i = parseInt(e, 10);
       if (!isNaN(i)) return i;
@@ -292,61 +303,61 @@ class b {
   }
   // #endregion
 }
-const d = 100;
-function a(s) {
-  if (s == null)
-    return d;
-  if (typeof s == "number")
-    return s;
-  const t = parseFloat(s);
-  return isNaN(t) ? d : t;
+const h = 100;
+function a(r) {
+  if (r == null)
+    return h;
+  if (typeof r == "number")
+    return r;
+  const t = parseFloat(r);
+  return isNaN(t) ? h : t;
 }
-function c(s) {
-  return s.map((t) => a(t.width));
+function c(r) {
+  return r.map((t) => a(t.width));
 }
-function f(s) {
+function f(r) {
   const t = [];
   let e = 0;
-  for (const i of s)
+  for (const i of r)
     t.push(e), e += a(i.width);
   return t;
 }
-function g(s) {
-  return s.reduce((t, e) => t + a(e.width), 0);
+function g(r) {
+  return r.reduce((t, e) => t + a(e.width), 0);
 }
-function p(s, t, e, i, o) {
-  const r = e.length;
-  if (r === 0)
+function p(r, t, e, i, n) {
+  const s = e.length;
+  if (s === 0)
     return { startCol: 0, endCol: 0, visibleColumns: [] };
-  let n = w(s, e, i);
-  n = Math.max(0, n - o);
-  const m = s + t;
-  let u = n;
-  for (let l = n; l < r; l++) {
+  let o = w(r, e, i);
+  o = Math.max(0, o - n);
+  const m = r + t;
+  let u = o;
+  for (let l = o; l < s; l++) {
     if (e[l] >= m) {
       u = l - 1;
       break;
     }
     u = l;
   }
-  u = Math.min(r - 1, u + o);
-  const h = [];
-  for (let l = n; l <= u; l++)
-    h.push(l);
-  return { startCol: n, endCol: u, visibleColumns: h };
+  u = Math.min(s - 1, u + n);
+  const d = [];
+  for (let l = o; l <= u; l++)
+    d.push(l);
+  return { startCol: o, endCol: u, visibleColumns: d };
 }
-function w(s, t, e) {
-  let i = 0, o = t.length - 1;
-  for (; i < o; ) {
-    const r = Math.floor((i + o) / 2);
-    t[r] + e[r] <= s ? i = r + 1 : o = r;
+function w(r, t, e) {
+  let i = 0, n = t.length - 1;
+  for (; i < n; ) {
+    const s = Math.floor((i + n) / 2);
+    t[s] + e[s] <= r ? i = s + 1 : n = s;
   }
   return i;
 }
-function R(s, t, e) {
-  return e ? s > t : !1;
+function R(r, t, e) {
+  return e ? r > t : !1;
 }
-class v extends b {
+class E extends b {
   name = "columnVirtualization";
   get defaultConfig() {
     return {
@@ -379,25 +390,25 @@ class v extends b {
     const e = R(t.length, this.config.threshold ?? 30, this.config.autoEnable ?? !0);
     if (this.isVirtualized = e ?? !1, this.columnWidths = c(t), this.columnOffsets = f(t), this.totalWidth = g(t), !e)
       return this.startCol = 0, this.endCol = t.length - 1, [...t];
-    const i = this.grid.clientWidth || 800, o = p(
+    const i = this.grid.clientWidth || 800, n = p(
       this.scrollLeft,
       i,
       this.columnOffsets,
       this.columnWidths,
       this.config.overscan ?? 3
     );
-    return this.startCol = o.startCol, this.endCol = o.endCol, o.visibleColumns.map((r) => t[r]);
+    return this.startCol = n.startCol, this.endCol = n.endCol, n.visibleColumns.map((s) => t[s]);
   }
   afterRender() {
     if (!this.isVirtualized) return;
-    const t = this.shadowRoot;
+    const t = this.gridElement;
     if (!t) return;
-    const e = this.columnOffsets[this.startCol] ?? 0, i = t.querySelector(".header-row"), o = t.querySelectorAll(".data-grid-row");
-    i && (i.style.paddingLeft = `${e}px`), o.forEach((n) => {
-      n.style.paddingLeft = `${e}px`;
+    const e = this.columnOffsets[this.startCol] ?? 0, i = t.querySelector(".header-row"), n = t.querySelectorAll(".data-grid-row");
+    i && (i.style.paddingLeft = `${e}px`), n.forEach((o) => {
+      o.style.paddingLeft = `${e}px`;
     });
-    const r = t.querySelector(".rows-viewport .rows");
-    r && (r.style.width = `${this.totalWidth}px`);
+    const s = t.querySelector(".rows-viewport .rows");
+    s && (s.style.width = `${this.totalWidth}px`);
   }
   onScroll(t) {
     !this.isVirtualized || Math.abs(t.scrollLeft - this.scrollLeft) < 1 || (this.scrollLeft = t.scrollLeft, this.requestRender());
@@ -440,6 +451,6 @@ class v extends b {
   // #endregion
 }
 export {
-  v as ColumnVirtualizationPlugin
+  E as ColumnVirtualizationPlugin
 };
 //# sourceMappingURL=index.js.map