@toolbox-web/grid 1.12.0 → 1.13.0

package/lib/plugins/responsive/index.js

@@ -1,4 +1,4 @@
-const R = /{{\s*([^}]+)\s*}}/g, u = "__DG_EMPTY__", y = /^[\w$. '?+\-*/%:()!<>=,&|]+$/, _ = /__(proto|defineGetter|defineSetter)|constructor|window|globalThis|global|process|Function|import|eval|Reflect|Proxy|Error|arguments|document|location|cookie|localStorage|sessionStorage|indexedDB|fetch|XMLHttpRequest|WebSocket|Worker|SharedWorker|ServiceWorker|opener|parent|top|frames|self|this\b/, C = /* @__PURE__ */ new Set([
+const y = /{{\s*([^}]+)\s*}}/g, u = "__DG_EMPTY__", _ = /^[\w$. '?+\-*/%:()!<>=,&|]+$/, C = /__(proto|defineGetter|defineSetter)|constructor|window|globalThis|global|process|Function|import|eval|Reflect|Proxy|Error|arguments|document|location|cookie|localStorage|sessionStorage|indexedDB|fetch|XMLHttpRequest|WebSocket|Worker|SharedWorker|ServiceWorker|opener|parent|top|frames|self|this\b/, E = /* @__PURE__ */ new Set([
   "script",
   "iframe",
   "object",
@@ -23,23 +23,23 @@ const R = /{{\s*([^}]+)\s*}}/g, u = "__DG_EMPTY__", y = /^[\w$. '?+\-*/%:()!<>=,
   "plaintext",
   "xmp",
   "listing"
-]), m = /^on\w+$/i, E = /* @__PURE__ */ new Set(["href", "src", "action", "formaction", "data", "srcdoc", "xlink:href", "poster", "srcset"]), A = /^\s*(javascript|vbscript|data|blob):/i;
-function S(r) {
+]), v = /^on\w+$/i, A = /* @__PURE__ */ new Set(["href", "src", "action", "formaction", "data", "srcdoc", "xlink:href", "poster", "srcset"]), S = /^\s*(javascript|vbscript|data|blob):/i;
+function k(r) {
   if (!r || typeof r != "string") return "";
   if (r.indexOf("<") === -1) return r;
   const t = document.createElement("template");
-  return t.innerHTML = r, k(t.content), t.innerHTML;
+  return t.innerHTML = r, H(t.content), t.innerHTML;
 }
-function k(r) {
+function H(r) {
   const t = [], e = r.querySelectorAll("*");
   for (const i of e) {
     const n = i.tagName.toLowerCase();
-    if (C.has(n)) {
+    if (E.has(n)) {
       t.push(i);
       continue;
     }
     if ((n === "svg" || i.namespaceURI === "http://www.w3.org/2000/svg") && Array.from(i.attributes).some(
-      (o) => m.test(o.name) || o.name === "href" || o.name === "xlink:href"
+      (o) => v.test(o.name) || o.name === "href" || o.name === "xlink:href"
     )) {
       t.push(i);
       continue;
@@ -47,11 +47,11 @@ function k(r) {
     const a = [];
     for (const s of i.attributes) {
       const o = s.name.toLowerCase();
-      if (m.test(o)) {
+      if (v.test(o)) {
         a.push(s.name);
         continue;
       }
-      if (E.has(o) && A.test(s.value)) {
+      if (A.has(o) && S.test(s.value)) {
         a.push(s.name);
         continue;
       }
@@ -64,41 +64,42 @@ function k(r) {
   }
   t.forEach((i) => i.remove());
 }
-function H(r, t) {
+function T(r, t) {
   if (!r || r.indexOf("{{") === -1) return r;
-  const e = [], i = r.replace(R, (o, c) => {
-    const l = T(c, t);
+  const e = [], i = r.replace(y, (o, c) => {
+    const l = L(c, t);
     return e.push({ expr: c.trim(), result: l }), l;
-  }), n = L(i), a = e.length && e.every((o) => o.result === "" || o.result === u);
-  return /Reflect\.|\bProxy\b|ownKeys\(/.test(r) || a ? "" : n;
+  }), n = x(i), a = e.length && e.every((o) => o.result === "" || o.result === u);
+  return m.test(r) || a ? "" : n;
 }
-function T(r, t) {
-  if (r = (r || "").trim(), !r || /\b(Reflect|Proxy|ownKeys)\b/.test(r)) return u;
+function L(r, t) {
+  if (r = (r || "").trim(), !r || m.test(r)) return u;
   if (r === "value") return t.value == null ? u : String(t.value);
   if (r.startsWith("row.") && !/[()?]/.test(r) && !r.includes(":")) {
     const i = r.slice(4), n = t.row ? t.row[i] : void 0;
     return n == null ? u : String(n);
   }
-  if (r.length > 80 || !y.test(r) || _.test(r)) return u;
+  if (r.length > 80 || !_.test(r) || C.test(r)) return u;
   const e = r.match(/\./g);
   if (e && e.length > 1) return u;
   try {
     const n = new Function("value", "row", `return (${r});`)(t.value, t.row), a = n == null ? "" : String(n);
-    return /Reflect|Proxy|ownKeys/.test(a) ? u : a || u;
+    return m.test(a) ? u : a || u;
   } catch {
     return u;
   }
 }
-function L(r) {
-  return r && r.replace(new RegExp(u, "g"), "").replace(/Reflect\.[^<>{}\s]+/g, "").replace(/\bProxy\b/g, "").replace(/ownKeys\([^)]*\)/g, "");
-}
+const m = /Reflect|Proxy|ownKeys/;
 function x(r) {
+  return r && r.replace(new RegExp(u, "g"), "").replace(/Reflect\.[^<>{}\s]+|\bProxy\b|ownKeys\([^)]*\)/g, "");
+}
+function M(r) {
   r && r.querySelectorAll(".cell-focus").forEach((t) => t.classList.remove("cell-focus"));
 }
-const M = 'input,select,textarea,[contenteditable="true"],[contenteditable=""],[tabindex]:not([tabindex="-1"])', D = document.createElement("template");
-D.innerHTML = '<div class="cell" role="gridcell" part="cell"></div>';
-const q = document.createElement("template");
-q.innerHTML = '<div class="data-grid-row" role="row" part="row"></div>';
+const D = 'input,select,textarea,[contenteditable="true"],[contenteditable=""],[tabindex]:not([tabindex="-1"])', q = document.createElement("template");
+q.innerHTML = '<div class="cell" role="gridcell" part="cell"></div>';
+const N = document.createElement("template");
+N.innerHTML = '<div class="data-grid-row" role="row" part="row"></div>';
 function g(r, t) {
   if (r._virtualization?.enabled) {
     const { rowHeight: s, container: o, viewportEl: c } = r._virtualization, l = o, h = c?.clientHeight ?? l?.clientHeight ?? 0;
@@ -108,7 +109,7 @@ function g(r, t) {
     }
   }
   const e = r._activeEditRows !== void 0 && r._activeEditRows !== -1;
-  e || r.refreshVirtualWindow(!1), x(r._bodyEl), Array.from(r._bodyEl.querySelectorAll('[aria-selected="true"]')).forEach((s) => {
+  e || r.refreshVirtualWindow(!1), M(r._bodyEl), Array.from(r._bodyEl.querySelectorAll('[aria-selected="true"]')).forEach((s) => {
     s.setAttribute("aria-selected", "false");
   });
   const i = r._focusRow, n = r._virtualization.start ?? 0, a = r._virtualization.end ?? r._rows.length;
@@ -121,12 +122,12 @@ function g(r, t) {
       if (c && o && (!e || t?.forceHorizontalScroll)) {
         const l = r._getHorizontalScrollOffsets?.(s ?? void 0, o) ?? { left: 0, right: 0 };
         if (!l.skipScroll) {
-          const h = o.getBoundingClientRect(), d = c.getBoundingClientRect(), f = h.left - d.left + c.scrollLeft, w = f + h.width, p = c.scrollLeft + l.left, b = c.scrollLeft + c.clientWidth - l.right;
-          f < p ? c.scrollLeft = f - l.left : w > b && (c.scrollLeft = w - c.clientWidth + l.right);
+          const h = o.getBoundingClientRect(), d = c.getBoundingClientRect(), f = h.left - d.left + c.scrollLeft, w = f + h.width, p = c.scrollLeft + l.left, R = c.scrollLeft + c.clientWidth - l.right;
+          f < p ? c.scrollLeft = f - l.left : w > R && (c.scrollLeft = w - c.clientWidth + l.right);
         }
       }
       if (r._activeEditRows !== void 0 && r._activeEditRows !== -1 && o.classList.contains("editing")) {
-        const l = o.querySelector(M);
+        const l = o.querySelector(D);
         if (l && document.activeElement !== l)
           try {
             l.focus({ preventScroll: !0 });
@@ -142,7 +143,7 @@ function g(r, t) {
     }
   }
 }
-const v = '<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentColor" d="M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/></svg>', N = {
+const b = '<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentColor" d="M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/></svg>', I = {
   expand: "▶",
   collapse: "▼",
   sortAsc: "▲",
@@ -151,11 +152,11 @@ const v = '<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentCo
   submenuArrow: "▶",
   dragHandle: "⋮⋮",
   toolPanel: "☰",
-  filter: v,
-  filterActive: v,
+  filter: b,
+  filterActive: b,
   print: "🖨️"
 };
-class P {
+class z {
   /**
    * Plugin dependencies - declare other plugins this one requires.
    *
@@ -445,7 +446,7 @@ class P {
    */
   get gridIcons() {
     const t = this.grid?.gridConfig?.icons ?? {};
-    return { ...N, ...t };
+    return { ...I, ...t };
   }
   // #region Animation Helpers
   /**
@@ -521,11 +522,11 @@ class P {
   }
   // #endregion
 }
-const I = 'tbw-grid[data-responsive-animate] .data-grid-row,tbw-grid[data-responsive-animate] .data-grid-row>.cell{transition:opacity var(--tbw-responsive-duration, .2s) ease-out,transform var(--tbw-responsive-duration, .2s) ease-out}tbw-grid[data-responsive][data-responsive-animate] .data-grid-row{animation:responsive-card-enter var(--tbw-responsive-duration, .2s) ease-out}@keyframes responsive-card-enter{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}tbw-grid[data-responsive] .header{display:none!important}tbw-grid[data-responsive] .footer-row{display:none}tbw-grid[data-responsive] .tbw-scroll-area{overflow-x:hidden;min-width:0!important}tbw-grid[data-responsive] .rows-body-wrapper{min-width:0!important}tbw-grid[data-responsive] .data-grid-row:not(.group-row){display:block!important;grid-template-columns:none!important;padding:var(--tbw-cell-padding);padding-inline-start:var(--tbw-spacing-xl);border-bottom:1px solid var(--tbw-color-border);min-height:auto!important;height:auto!important;contain:none!important;content-visibility:visible!important;background:var(--tbw-color-bg);position:relative}tbw-grid[data-responsive] .data-grid-row:not(.group-row):nth-child(2n){background:var(--tbw-color-row-alt)}tbw-grid[data-responsive] .data-grid-row:not(.group-row):hover{background:var(--tbw-color-row-hover)}tbw-grid[data-responsive] .data-grid-row:not(.group-row)[aria-selected=true]{background:var(--tbw-color-selection)}tbw-grid[data-responsive] .data-grid-row:not(.group-row)[aria-selected=true]:before{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:4px;background:var(--tbw-color-accent)}tbw-grid[data-responsive] .data-grid-row:not(.group-row)>.cell{display:flex!important;justify-content:space-between;align-items:center;padding:var(--tbw-spacing-xs) var(--tbw-spacing-md);width:100%!important;min-width:0!important;min-height:auto!important;height:auto!important;line-height:1.5!important;position:static!important;left:auto!important;right:auto!important;border:none!important;border-bottom:none!important;border-inline-end:none!important;background:transparent!important;white-space:normal!important;overflow:visible!important}tbw-grid[data-responsive] .data-grid-row:not(.group-row)>.cell:before{content:attr(data-header) ": ";font-weight:600;color:var(--tbw-color-header-fg);flex-shrink:0;margin-inline-end:var(--tbw-spacing-md);min-width:100px}tbw-grid[data-responsive] .data-grid-row:not(.group-row)>.cell:after{content:none}tbw-grid[data-responsive] .cell[data-utility]{display:none!important}tbw-grid[data-responsive] .cell[data-responsive-hidden]{display:none!important}tbw-grid[data-responsive] .cell[data-responsive-value-only]{justify-content:flex-start!important;font-weight:500}tbw-grid[data-responsive] .cell[data-responsive-value-only]:before{display:none!important}tbw-grid:not([data-responsive]) .cell[data-responsive-hidden]{display:none!important}tbw-grid[data-responsive] .tbw-footer,tbw-grid[data-responsive] .tbw-pinned-rows,tbw-grid[data-responsive] .tbw-aggregation-rows{display:none!important}tbw-grid[data-responsive] .tbw-pinned-rows,tbw-grid[data-responsive] .tbw-aggregation-rows,tbw-grid[data-responsive] .tbw-aggregation-row{min-width:0!important}tbw-grid[data-responsive] .data-grid-row.responsive-card{display:block!important;padding:var(--tbw-cell-padding);border-bottom:1px solid var(--tbw-color-border)}tbw-grid[data-responsive] .data-grid-row.responsive-card>*{width:100%}tbw-grid[data-responsive] .data-grid-row.responsive-card .cell:before{display:none}';
-class z extends P {
+const B = 'tbw-grid[data-responsive-animate] .data-grid-row,tbw-grid[data-responsive-animate] .data-grid-row>.cell{transition:opacity var(--tbw-responsive-duration, .2s) ease-out,transform var(--tbw-responsive-duration, .2s) ease-out}tbw-grid[data-responsive][data-responsive-animate] .data-grid-row{animation:responsive-card-enter var(--tbw-responsive-duration, .2s) ease-out}@keyframes responsive-card-enter{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}tbw-grid[data-responsive] .header{display:none!important}tbw-grid[data-responsive] .footer-row{display:none}tbw-grid[data-responsive] .tbw-scroll-area{overflow-x:hidden;min-width:0!important}tbw-grid[data-responsive] .rows-body-wrapper{min-width:0!important}tbw-grid[data-responsive] .data-grid-row:not(.group-row){display:block!important;grid-template-columns:none!important;padding:var(--tbw-cell-padding);padding-inline-start:var(--tbw-spacing-xl);border-bottom:1px solid var(--tbw-color-border);min-height:auto!important;height:auto!important;contain:none!important;content-visibility:visible!important;background:var(--tbw-color-bg);position:relative}tbw-grid[data-responsive] .data-grid-row:not(.group-row):nth-child(2n){background:var(--tbw-color-row-alt)}tbw-grid[data-responsive] .data-grid-row:not(.group-row):hover{background:var(--tbw-color-row-hover)}tbw-grid[data-responsive] .data-grid-row:not(.group-row)[aria-selected=true]{background:var(--tbw-color-selection)}tbw-grid[data-responsive] .data-grid-row:not(.group-row)[aria-selected=true]:before{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:4px;background:var(--tbw-color-accent)}tbw-grid[data-responsive] .data-grid-row:not(.group-row)>.cell{display:flex!important;justify-content:space-between;align-items:center;padding:var(--tbw-spacing-xs) var(--tbw-spacing-md);width:100%!important;min-width:0!important;min-height:auto!important;height:auto!important;line-height:1.5!important;position:static!important;left:auto!important;right:auto!important;border:none!important;border-bottom:none!important;border-inline-end:none!important;background:transparent!important;white-space:normal!important;overflow:visible!important}tbw-grid[data-responsive] .data-grid-row:not(.group-row)>.cell:before{content:attr(data-header) ": ";font-weight:600;color:var(--tbw-color-header-fg);flex-shrink:0;margin-inline-end:var(--tbw-spacing-md);min-width:100px}tbw-grid[data-responsive] .data-grid-row:not(.group-row)>.cell:after{content:none}tbw-grid[data-responsive] .cell[data-utility]{display:none!important}tbw-grid[data-responsive] .cell[data-responsive-hidden]{display:none!important}tbw-grid[data-responsive] .cell[data-responsive-value-only]{justify-content:flex-start!important;font-weight:500}tbw-grid[data-responsive] .cell[data-responsive-value-only]:before{display:none!important}tbw-grid:not([data-responsive]) .cell[data-responsive-hidden]{display:none!important}tbw-grid[data-responsive] .tbw-footer,tbw-grid[data-responsive] .tbw-pinned-rows,tbw-grid[data-responsive] .tbw-aggregation-rows{display:none!important}tbw-grid[data-responsive] .tbw-pinned-rows,tbw-grid[data-responsive] .tbw-aggregation-rows,tbw-grid[data-responsive] .tbw-aggregation-row{min-width:0!important}tbw-grid[data-responsive] .data-grid-row.responsive-card{display:block!important;padding:var(--tbw-cell-padding);border-bottom:1px solid var(--tbw-color-border)}tbw-grid[data-responsive] .data-grid-row.responsive-card>*{width:100%}tbw-grid[data-responsive] .data-grid-row.responsive-card .cell:before{display:none}';
+class G extends z {
   name = "responsive";
   version = "1.0.0";
-  styles = I;
+  styles = B;
   /**
    * Plugin manifest declaring incompatibilities with other plugins.
    */
@@ -656,7 +657,7 @@ class z extends P {
     }
     const h = e.innerHTML.trim();
     h && !this.config.cardRenderer && !i.__frameworkAdapter?.parseResponsiveCardElement && (l.cardRenderer = (d) => {
-      const f = H(h, { value: d, row: d }), w = S(f), p = document.createElement("div");
+      const f = T(h, { value: d, row: d }), w = k(f), p = document.createElement("div");
       return p.className = "tbw-responsive-card-content", p.innerHTML = w, p;
     }), Object.keys(l).length > 0 && (this.config = { ...this.config, ...l });
   }
@@ -963,6 +964,6 @@ class z extends P {
   }
 }
 export {
-  z as ResponsivePlugin
+  G as ResponsivePlugin
 };
 //# sourceMappingURL=index.js.map