@kong-ui-public/dashboard-renderer 4.1.15 → 5.0.0

package/dist/dashboard-renderer.es.js

@@ -1,11 +1,11 @@
-var Lt = Object.defineProperty;
-var Je = (u) => {
+var At = Object.defineProperty;
+var Qe = (u) => {
   throw TypeError(u);
 };
-var Mt = (u, e, t) => e in u ? Lt(u, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : u[e] = t;
-var Ze = (u, e, t) => Mt(u, typeof e != "symbol" ? e + "" : e, t), Be = (u, e, t) => e.has(u) || Je("Cannot " + t);
-var v = (u, e, t) => (Be(u, e, "read from private field"), t ? t.call(u) : e.get(u)), O = (u, e, t) => e.has(u) ? Je("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(u) : e.set(u, t), N = (u, e, t, i) => (Be(u, e, "write to private field"), i ? i.call(u, t) : e.set(u, t), t), L = (u, e, t) => (Be(u, e, "access private method"), t);
-var ve = (u, e, t, i) => ({
+var Ot = (u, e, t) => e in u ? At(u, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : u[e] = t;
+var Je = (u, e, t) => Ot(u, typeof e != "symbol" ? e + "" : e, t), Pe = (u, e, t) => e.has(u) || Qe("Cannot " + t);
+var v = (u, e, t) => (Pe(u, e, "read from private field"), t ? t.call(u) : e.get(u)), O = (u, e, t) => e.has(u) ? Qe("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(u) : e.set(u, t), N = (u, e, t, i) => (Pe(u, e, "write to private field"), i ? i.call(u, t) : e.set(u, t), t), L = (u, e, t) => (Pe(u, e, "access private method"), t);
+var me = (u, e, t, i) => ({
   set _(s) {
     N(u, e, s, t);
   },
@@ -13,27 +13,27 @@ var ve = (u, e, t, i) => ({
     return v(u, e, i);
   }
 });
-import { ref as B, watchEffect as gt, inject as pe, provide as It, defineComponent as U, onUnmounted as Ue, computed as A, watch as Ge, resolveComponent as oe, unref as z, openBlock as T, createBlock as H, withCtx as M, createTextVNode as _e, toDisplayString as ee, renderSlot as Me, createCommentVNode as X, useCssVars as Ie, createElementVNode as he, normalizeClass as We, createVNode as te, mergeProps as pt, createSlots as mt, createElementBlock as $, normalizeProps as Pt, guardReactiveProps as qt, defineAsyncComponent as Bt, onMounted as Ke, nextTick as yt, resolveDynamicComponent as vt, Fragment as _t, renderList as bt, normalizeStyle as et, mergeModels as tt, useModel as $t } from "vue";
-import { stripUnknownFilters as Ft, Timeframe as Ut, TimePeriods as wt, TIMEFRAME_LOOKUP as Gt, formatTime as it, msToGranularity as Wt } from "@kong-ui-public/analytics-utilities";
-import { SimpleChart as Kt, AnalyticsChart as Vt, TopNTable as Yt, CsvExportModal as Xt } from "@kong-ui-public/analytics-chart";
-import jt from "swrv";
+import { ref as B, watchEffect as ft, inject as ge, provide as Lt, defineComponent as F, onUnmounted as $e, computed as H, watch as Ue, resolveComponent as ne, unref as k, openBlock as T, createBlock as A, withCtx as M, createTextVNode as ye, toDisplayString as ee, renderSlot as Le, createCommentVNode as X, useCssVars as Ge, createElementVNode as le, normalizeClass as Fe, createVNode as te, mergeProps as gt, createSlots as pt, createElementBlock as $, normalizeProps as Mt, guardReactiveProps as It, defineAsyncComponent as Pt, onMounted as We, nextTick as mt, resolveDynamicComponent as yt, Fragment as vt, renderList as _t, normalizeStyle as Ze, mergeModels as et, useModel as qt } from "vue";
+import { stripUnknownFilters as Bt, Timeframe as $t, TimePeriods as wt, TIMEFRAME_LOOKUP as Ut, formatTime as tt, msToGranularity as Gt } from "@kong-ui-public/analytics-utilities";
+import { SimpleChart as Ft, AnalyticsChart as Wt, TopNTable as Vt, CsvExportModal as Kt } from "@kong-ui-public/analytics-chart";
+import Yt from "swrv";
 import "axios";
-import { createI18n as Qt, i18nTComponent as Jt } from "@kong-ui-public/i18n";
-import { useAnalyticsConfigStore as Et } from "@kong-ui-public/analytics-config-store";
-import { MetricsProvider as Zt, MetricsConsumer as ei } from "@kong-ui-public/analytics-metric-provider";
-import { EditIcon as ti, MoreIcon as ii } from "@kong/icons";
-var xt = /* @__PURE__ */ ((u) => (u.VALIDATING = "VALIDATING", u.VALIDATING_HAS_DATA = "VALIDATING_HAS_DATA", u.PENDING = "PENDING", u.SUCCESS = "SUCCESS", u.SUCCESS_HAS_DATA = "SUCCESS_HAS_DATA", u.ERROR = "ERROR", u.STALE_IF_ERROR = "STALE_IF_ERROR", u))(xt || {});
-const si = (u) => {
+import { createI18n as Xt, i18nTComponent as jt } from "@kong-ui-public/i18n";
+import { useAnalyticsConfigStore as bt } from "@kong-ui-public/analytics-config-store";
+import { MetricsProvider as Qt, MetricsConsumer as Jt } from "@kong-ui-public/analytics-metric-provider";
+import { EditIcon as Zt, MoreIcon as ei } from "@kong/icons";
+var Et = /* @__PURE__ */ ((u) => (u.VALIDATING = "VALIDATING", u.VALIDATING_HAS_DATA = "VALIDATING_HAS_DATA", u.PENDING = "PENDING", u.SUCCESS = "SUCCESS", u.SUCCESS_HAS_DATA = "SUCCESS_HAS_DATA", u.ERROR = "ERROR", u.STALE_IF_ERROR = "STALE_IF_ERROR", u))(Et || {});
+const ti = (u) => {
   var e, t, i, s, r;
   return u ? !!// TODO: revisit: currently only the first check ever matters?
   ((e = Object.keys(u)) != null && e.length || (t = u.data) != null && t.length || (s = (i = u.data) == null ? void 0 : i.data) != null && s.length || !((r = u.data) != null && r.data) && typeof u.data == "object" && Object.keys(u == null ? void 0 : u.data).length) : !1;
 };
-function ri(u = B({}), e, t, i = si) {
+function ii(u = B({}), e, t, i = ti) {
   const s = B(
     "PENDING"
     /* PENDING */
   );
-  return gt(() => {
+  return ft(() => {
     const r = i(u.value);
     if (u.value && r && t.value) {
       s.value = "VALIDATING_HAS_DATA";
@@ -62,10 +62,10 @@ function ri(u = B({}), e, t, i = si) {
     u.value === void 0 && e && (s.value = "ERROR");
   }), {
     state: s,
-    swrvState: xt
+    swrvState: Et
   };
 }
-const ni = {
+const si = {
   noQueryBridge: "No query bridge provided.  Unable to render dashboard.",
   trendRange: {
     "24h": "Last 24-Hour Summary",
@@ -74,157 +74,157 @@ const ni = {
   },
   edit: "Edit",
   remove: "Remove"
-}, oi = {
+}, ri = {
   timeRangeExceeded: "The time range for this report is outside of your organization's data retention period"
-}, ai = {
+}, ni = {
   defaultFilename: "Chart Export",
   exportAsCsv: "Export as CSV"
-}, li = "Explore", hi = {
-  renderer: ni,
-  queryDataProvider: oi,
-  csvExport: ai,
-  jumpToExplore: li
+}, oi = "Explore", ai = {
+  renderer: si,
+  queryDataProvider: ri,
+  csvExport: ni,
+  jumpToExplore: oi
 };
-function di() {
-  const u = Qt("en-us", hi);
+function li() {
+  const u = Xt("en-us", ai);
   return {
     i18n: u,
-    i18nT: Jt(u)
+    i18nT: jt(u)
     // Translation component <i18n-t>
   };
 }
-const Ve = 170, ae = "analytics-query-provider", st = "{entity-id}", ui = "{cp-id}", ci = "{timeframe}", fi = 30 * 1e3;
-function gi() {
-  const u = pe(ae);
+const Ve = 170, oe = "analytics-query-provider", it = "{entity-id}", hi = "{cp-id}", di = "{timeframe}", ui = 30 * 1e3;
+function ci() {
+  const u = ge(oe);
   return {
     evaluateFeatureFlag: (t, i) => u ? u.evaluateFeatureFlagFn(t, i) : i
   };
 }
-function pi(u) {
+function fi(u) {
   return u && u.__esModule && Object.prototype.hasOwnProperty.call(u, "default") ? u.default : u;
 }
-var Ct = { exports: {} };
+var xt = { exports: {} };
 (function(u) {
   var e = Object.prototype.hasOwnProperty, t = "~";
   function i() {
   }
   Object.create && (i.prototype = /* @__PURE__ */ Object.create(null), new i().__proto__ || (t = !1));
-  function s(d, l, a) {
-    this.fn = d, this.context = l, this.once = a || !1;
+  function s(a, d, l) {
+    this.fn = a, this.context = d, this.once = l || !1;
   }
-  function r(d, l, a, h, f) {
-    if (typeof a != "function")
+  function r(a, d, l, h, f) {
+    if (typeof l != "function")
       throw new TypeError("The listener must be a function");
-    var g = new s(a, h || d, f), m = t ? t + l : l;
-    return d._events[m] ? d._events[m].fn ? d._events[m] = [d._events[m], g] : d._events[m].push(g) : (d._events[m] = g, d._eventsCount++), d;
+    var p = new s(l, h || a, f), m = t ? t + d : d;
+    return a._events[m] ? a._events[m].fn ? a._events[m] = [a._events[m], p] : a._events[m].push(p) : (a._events[m] = p, a._eventsCount++), a;
   }
-  function o(d, l) {
-    --d._eventsCount === 0 ? d._events = new i() : delete d._events[l];
+  function o(a, d) {
+    --a._eventsCount === 0 ? a._events = new i() : delete a._events[d];
   }
   function n() {
     this._events = new i(), this._eventsCount = 0;
   }
   n.prototype.eventNames = function() {
-    var l = [], a, h;
-    if (this._eventsCount === 0) return l;
-    for (h in a = this._events)
-      e.call(a, h) && l.push(t ? h.slice(1) : h);
-    return Object.getOwnPropertySymbols ? l.concat(Object.getOwnPropertySymbols(a)) : l;
-  }, n.prototype.listeners = function(l) {
-    var a = t ? t + l : l, h = this._events[a];
+    var d = [], l, h;
+    if (this._eventsCount === 0) return d;
+    for (h in l = this._events)
+      e.call(l, h) && d.push(t ? h.slice(1) : h);
+    return Object.getOwnPropertySymbols ? d.concat(Object.getOwnPropertySymbols(l)) : d;
+  }, n.prototype.listeners = function(d) {
+    var l = t ? t + d : d, h = this._events[l];
     if (!h) return [];
     if (h.fn) return [h.fn];
-    for (var f = 0, g = h.length, m = new Array(g); f < g; f++)
+    for (var f = 0, p = h.length, m = new Array(p); f < p; f++)
       m[f] = h[f].fn;
     return m;
-  }, n.prototype.listenerCount = function(l) {
-    var a = t ? t + l : l, h = this._events[a];
+  }, n.prototype.listenerCount = function(d) {
+    var l = t ? t + d : d, h = this._events[l];
     return h ? h.fn ? 1 : h.length : 0;
-  }, n.prototype.emit = function(l, a, h, f, g, m) {
-    var y = t ? t + l : l;
+  }, n.prototype.emit = function(d, l, h, f, p, m) {
+    var y = t ? t + d : d;
     if (!this._events[y]) return !1;
-    var p = this._events[y], C = arguments.length, k, R;
-    if (p.fn) {
-      switch (p.once && this.removeListener(l, p.fn, void 0, !0), C) {
+    var g = this._events[y], R = arguments.length, S, C;
+    if (g.fn) {
+      switch (g.once && this.removeListener(d, g.fn, void 0, !0), R) {
         case 1:
-          return p.fn.call(p.context), !0;
+          return g.fn.call(g.context), !0;
         case 2:
-          return p.fn.call(p.context, a), !0;
+          return g.fn.call(g.context, l), !0;
         case 3:
-          return p.fn.call(p.context, a, h), !0;
+          return g.fn.call(g.context, l, h), !0;
         case 4:
-          return p.fn.call(p.context, a, h, f), !0;
+          return g.fn.call(g.context, l, h, f), !0;
         case 5:
-          return p.fn.call(p.context, a, h, f, g), !0;
+          return g.fn.call(g.context, l, h, f, p), !0;
         case 6:
-          return p.fn.call(p.context, a, h, f, g, m), !0;
+          return g.fn.call(g.context, l, h, f, p, m), !0;
       }
-      for (R = 1, k = new Array(C - 1); R < C; R++)
-        k[R - 1] = arguments[R];
-      p.fn.apply(p.context, k);
+      for (C = 1, S = new Array(R - 1); C < R; C++)
+        S[C - 1] = arguments[C];
+      g.fn.apply(g.context, S);
     } else {
-      var E = p.length, x;
-      for (R = 0; R < E; R++)
-        switch (p[R].once && this.removeListener(l, p[R].fn, void 0, !0), C) {
+      var E = g.length, x;
+      for (C = 0; C < E; C++)
+        switch (g[C].once && this.removeListener(d, g[C].fn, void 0, !0), R) {
           case 1:
-            p[R].fn.call(p[R].context);
+            g[C].fn.call(g[C].context);
             break;
           case 2:
-            p[R].fn.call(p[R].context, a);
+            g[C].fn.call(g[C].context, l);
             break;
           case 3:
-            p[R].fn.call(p[R].context, a, h);
+            g[C].fn.call(g[C].context, l, h);
             break;
           case 4:
-            p[R].fn.call(p[R].context, a, h, f);
+            g[C].fn.call(g[C].context, l, h, f);
             break;
           default:
-            if (!k) for (x = 1, k = new Array(C - 1); x < C; x++)
-              k[x - 1] = arguments[x];
-            p[R].fn.apply(p[R].context, k);
+            if (!S) for (x = 1, S = new Array(R - 1); x < R; x++)
+              S[x - 1] = arguments[x];
+            g[C].fn.apply(g[C].context, S);
         }
     }
     return !0;
-  }, n.prototype.on = function(l, a, h) {
-    return r(this, l, a, h, !1);
-  }, n.prototype.once = function(l, a, h) {
-    return r(this, l, a, h, !0);
-  }, n.prototype.removeListener = function(l, a, h, f) {
-    var g = t ? t + l : l;
-    if (!this._events[g]) return this;
-    if (!a)
-      return o(this, g), this;
-    var m = this._events[g];
+  }, n.prototype.on = function(d, l, h) {
+    return r(this, d, l, h, !1);
+  }, n.prototype.once = function(d, l, h) {
+    return r(this, d, l, h, !0);
+  }, n.prototype.removeListener = function(d, l, h, f) {
+    var p = t ? t + d : d;
+    if (!this._events[p]) return this;
+    if (!l)
+      return o(this, p), this;
+    var m = this._events[p];
     if (m.fn)
-      m.fn === a && (!f || m.once) && (!h || m.context === h) && o(this, g);
+      m.fn === l && (!f || m.once) && (!h || m.context === h) && o(this, p);
     else {
-      for (var y = 0, p = [], C = m.length; y < C; y++)
-        (m[y].fn !== a || f && !m[y].once || h && m[y].context !== h) && p.push(m[y]);
-      p.length ? this._events[g] = p.length === 1 ? p[0] : p : o(this, g);
+      for (var y = 0, g = [], R = m.length; y < R; y++)
+        (m[y].fn !== l || f && !m[y].once || h && m[y].context !== h) && g.push(m[y]);
+      g.length ? this._events[p] = g.length === 1 ? g[0] : g : o(this, p);
     }
     return this;
-  }, n.prototype.removeAllListeners = function(l) {
-    var a;
-    return l ? (a = t ? t + l : l, this._events[a] && o(this, a)) : (this._events = new i(), this._eventsCount = 0), this;
+  }, n.prototype.removeAllListeners = function(d) {
+    var l;
+    return d ? (l = t ? t + d : d, this._events[l] && o(this, l)) : (this._events = new i(), this._eventsCount = 0), this;
   }, n.prototype.off = n.prototype.removeListener, n.prototype.addListener = n.prototype.on, n.prefixed = t, n.EventEmitter = n, u.exports = n;
-})(Ct);
-var mi = Ct.exports;
-const yi = /* @__PURE__ */ pi(mi);
-class Rt extends Error {
+})(xt);
+var gi = xt.exports;
+const pi = /* @__PURE__ */ fi(gi);
+class Ct extends Error {
   constructor(e) {
     super(e), this.name = "TimeoutError";
   }
 }
-class vi extends Error {
+class mi extends Error {
   constructor(e) {
     super(), this.name = "AbortError", this.message = e;
   }
 }
-const rt = (u) => globalThis.DOMException === void 0 ? new vi(u) : new DOMException(u), nt = (u) => {
-  const e = u.reason === void 0 ? rt("This operation was aborted.") : u.reason;
-  return e instanceof Error ? e : rt(e);
+const st = (u) => globalThis.DOMException === void 0 ? new mi(u) : new DOMException(u), rt = (u) => {
+  const e = u.reason === void 0 ? st("This operation was aborted.") : u.reason;
+  return e instanceof Error ? e : st(e);
 };
-function _i(u, e) {
+function yi(u, e) {
   const {
     milliseconds: t,
     fallback: i,
@@ -232,45 +232,45 @@ function _i(u, e) {
     customTimers: r = { setTimeout, clearTimeout }
   } = e;
   let o, n;
-  const l = new Promise((a, h) => {
+  const d = new Promise((l, h) => {
     if (typeof t != "number" || Math.sign(t) !== 1)
       throw new TypeError(`Expected \`milliseconds\` to be a positive number, got \`${t}\``);
     if (e.signal) {
-      const { signal: g } = e;
-      g.aborted && h(nt(g)), n = () => {
-        h(nt(g));
-      }, g.addEventListener("abort", n, { once: !0 });
+      const { signal: p } = e;
+      p.aborted && h(rt(p)), n = () => {
+        h(rt(p));
+      }, p.addEventListener("abort", n, { once: !0 });
     }
     if (t === Number.POSITIVE_INFINITY) {
-      u.then(a, h);
+      u.then(l, h);
       return;
     }
-    const f = new Rt();
+    const f = new Ct();
     o = r.setTimeout.call(void 0, () => {
       if (i) {
         try {
-          a(i());
-        } catch (g) {
-          h(g);
+          l(i());
+        } catch (p) {
+          h(p);
         }
         return;
       }
-      typeof u.cancel == "function" && u.cancel(), s === !1 ? a() : s instanceof Error ? h(s) : (f.message = s ?? `Promise timed out after ${t} milliseconds`, h(f));
+      typeof u.cancel == "function" && u.cancel(), s === !1 ? l() : s instanceof Error ? h(s) : (f.message = s ?? `Promise timed out after ${t} milliseconds`, h(f));
     }, t), (async () => {
       try {
-        a(await u);
-      } catch (g) {
-        h(g);
+        l(await u);
+      } catch (p) {
+        h(p);
       }
     })();
   }).finally(() => {
-    l.clear(), n && e.signal && e.signal.removeEventListener("abort", n);
+    d.clear(), n && e.signal && e.signal.removeEventListener("abort", n);
   });
-  return l.clear = () => {
+  return d.clear = () => {
     r.clearTimeout.call(void 0, o), o = void 0;
-  }, l;
+  }, d;
 }
-function bi(u, e, t) {
+function vi(u, e, t) {
   let i = 0, s = u.length;
   for (; s > 0; ) {
     const r = Math.trunc(s / 2);
@@ -280,7 +280,7 @@ function bi(u, e, t) {
   return i;
 }
 var W;
-class wi {
+class _i {
   constructor() {
     O(this, W, []);
   }
@@ -298,7 +298,7 @@ class wi {
       v(this, W).push(i);
       return;
     }
-    const s = bi(v(this, W), i, (r, o) => o.priority - r.priority);
+    const s = vi(v(this, W), i, (r, o) => o.priority - r.priority);
     v(this, W).splice(s, 0, i);
   }
   setPriority(e, t) {
@@ -320,57 +320,57 @@ class wi {
   }
 }
 W = new WeakMap();
-var de, ue, ne, Ee, ce, xe, K, fe, P, Ce, V, ge, Z, Re, Le, D, Tt, Dt, zt, St, kt, De, $e, Fe, ze, Nt, Se;
-class Ei extends yi {
+var he, de, re, be, ue, Ee, V, ce, P, xe, K, fe, Z, Ce, Oe, D, Rt, Tt, Dt, zt, St, Te, qe, Be, De, kt, ze;
+class wi extends pi {
   // TODO: The `throwOnTimeout` option should affect the return types of `add()` and `addAll()`
   constructor(t) {
     var i, s;
     super();
     O(this, D);
+    O(this, he);
     O(this, de);
+    O(this, re, 0);
+    O(this, be);
     O(this, ue);
-    O(this, ne, 0);
-    O(this, Ee);
+    O(this, Ee, 0);
+    O(this, V);
     O(this, ce);
-    O(this, xe, 0);
-    O(this, K);
-    O(this, fe);
     O(this, P);
-    O(this, Ce);
-    O(this, V, 0);
+    O(this, xe);
+    O(this, K, 0);
     // The `!` is needed because of https://github.com/microsoft/TypeScript/issues/32194
-    O(this, ge);
+    O(this, fe);
     O(this, Z);
-    O(this, Re);
+    O(this, Ce);
     // Use to assign a unique identifier to a promise function, if not explicitly specified
-    O(this, Le, 1n);
+    O(this, Oe, 1n);
     /**
         Per-operation timeout in milliseconds. Operations fulfill once `timeout` elapses if they haven't already.
     
         Applies to each future operation.
         */
-    Ze(this, "timeout");
+    Je(this, "timeout");
     if (t = {
       carryoverConcurrencyCount: !1,
       intervalCap: Number.POSITIVE_INFINITY,
       interval: 0,
       concurrency: Number.POSITIVE_INFINITY,
       autoStart: !0,
-      queueClass: wi,
+      queueClass: _i,
       ...t
     }, !(typeof t.intervalCap == "number" && t.intervalCap >= 1))
       throw new TypeError(`Expected \`intervalCap\` to be a number from 1 and up, got \`${((i = t.intervalCap) == null ? void 0 : i.toString()) ?? ""}\` (${typeof t.intervalCap})`);
     if (t.interval === void 0 || !(Number.isFinite(t.interval) && t.interval >= 0))
       throw new TypeError(`Expected \`interval\` to be a finite number >= 0, got \`${((s = t.interval) == null ? void 0 : s.toString()) ?? ""}\` (${typeof t.interval})`);
-    N(this, de, t.carryoverConcurrencyCount), N(this, ue, t.intervalCap === Number.POSITIVE_INFINITY || t.interval === 0), N(this, Ee, t.intervalCap), N(this, ce, t.interval), N(this, P, new t.queueClass()), N(this, Ce, t.queueClass), this.concurrency = t.concurrency, this.timeout = t.timeout, N(this, Re, t.throwOnTimeout === !0), N(this, Z, t.autoStart === !1);
+    N(this, he, t.carryoverConcurrencyCount), N(this, de, t.intervalCap === Number.POSITIVE_INFINITY || t.interval === 0), N(this, be, t.intervalCap), N(this, ue, t.interval), N(this, P, new t.queueClass()), N(this, xe, t.queueClass), this.concurrency = t.concurrency, this.timeout = t.timeout, N(this, Ce, t.throwOnTimeout === !0), N(this, Z, t.autoStart === !1);
   }
   get concurrency() {
-    return v(this, ge);
+    return v(this, fe);
   }
   set concurrency(t) {
     if (!(typeof t == "number" && t >= 1))
       throw new TypeError(`Expected \`concurrency\` to be a number from 1 and up, got \`${t}\` (${typeof t})`);
-    N(this, ge, t), L(this, D, ze).call(this);
+    N(this, fe, t), L(this, D, De).call(this);
   }
   /**
       Updates the priority of a promise function by its id, affecting its execution order. Requires a defined concurrency limit to take effect.
@@ -412,30 +412,30 @@ class Ei extends yi {
     v(this, P).setPriority(t, i);
   }
   async add(t, i = {}) {
-    return i.id ?? (i.id = (ve(this, Le)._++).toString()), i = {
+    return i.id ?? (i.id = (me(this, Oe)._++).toString()), i = {
       timeout: this.timeout,
-      throwOnTimeout: v(this, Re),
+      throwOnTimeout: v(this, Ce),
       ...i
     }, new Promise((s, r) => {
       v(this, P).enqueue(async () => {
         var o;
-        ve(this, V)._++, ve(this, ne)._++;
+        me(this, K)._++, me(this, re)._++;
         try {
           (o = i.signal) == null || o.throwIfAborted();
           let n = t({ signal: i.signal });
-          i.timeout && (n = _i(Promise.resolve(n), { milliseconds: i.timeout })), i.signal && (n = Promise.race([n, L(this, D, Nt).call(this, i.signal)]));
-          const d = await n;
-          s(d), this.emit("completed", d);
+          i.timeout && (n = yi(Promise.resolve(n), { milliseconds: i.timeout })), i.signal && (n = Promise.race([n, L(this, D, kt).call(this, i.signal)]));
+          const a = await n;
+          s(a), this.emit("completed", a);
         } catch (n) {
-          if (n instanceof Rt && !i.throwOnTimeout) {
+          if (n instanceof Ct && !i.throwOnTimeout) {
             s();
             return;
           }
           r(n), this.emit("error", n);
         } finally {
-          L(this, D, zt).call(this);
+          L(this, D, Dt).call(this);
         }
-      }, i), this.emit("add"), L(this, D, De).call(this);
+      }, i), this.emit("add"), L(this, D, Te).call(this);
     });
   }
   async addAll(t, i) {
@@ -445,7 +445,7 @@ class Ei extends yi {
   Start (or resume) executing enqueued tasks within concurrency limit. No need to call this if queue is not paused (via `options.autoStart = false` or by `.pause()` method.)
   */
   start() {
-    return v(this, Z) ? (N(this, Z, !1), L(this, D, ze).call(this), this) : this;
+    return v(this, Z) ? (N(this, Z, !1), L(this, D, De).call(this), this) : this;
   }
   /**
   Put queue execution on hold.
@@ -457,7 +457,7 @@ class Ei extends yi {
   Clear the queue.
   */
   clear() {
-    N(this, P, new (v(this, Ce))());
+    N(this, P, new (v(this, xe))());
   }
   /**
       Can be called multiple times. Useful if you for example add additional items at a later time.
@@ -465,7 +465,7 @@ class Ei extends yi {
       @returns A promise that settles when the queue becomes empty.
       */
   async onEmpty() {
-    v(this, P).size !== 0 && await L(this, D, Se).call(this, "empty");
+    v(this, P).size !== 0 && await L(this, D, ze).call(this, "empty");
   }
   /**
       @returns A promise that settles when the queue size is less than the given limit: `queue.size < limit`.
@@ -475,7 +475,7 @@ class Ei extends yi {
       Note that this only limits the number of items waiting to start. There could still be up to `concurrency` jobs already running that this call does not include in its calculation.
       */
   async onSizeLessThan(t) {
-    v(this, P).size < t || await L(this, D, Se).call(this, "next", () => v(this, P).size < t);
+    v(this, P).size < t || await L(this, D, ze).call(this, "next", () => v(this, P).size < t);
   }
   /**
       The difference with `.onEmpty` is that `.onIdle` guarantees that all work from the queue has finished. `.onEmpty` merely signals that the queue is empty, but it could mean that some promises haven't completed yet.
@@ -483,7 +483,7 @@ class Ei extends yi {
       @returns A promise that settles when the queue becomes empty, and all promises have completed; `queue.size === 0 && queue.pending === 0`.
       */
   async onIdle() {
-    v(this, V) === 0 && v(this, P).size === 0 || await L(this, D, Se).call(this, "idle");
+    v(this, K) === 0 && v(this, P).size === 0 || await L(this, D, ze).call(this, "idle");
   }
   /**
   Size of the queue, the number of queued items waiting to run.
@@ -503,7 +503,7 @@ class Ei extends yi {
   Number of running items (no longer in the queue).
   */
   get pending() {
-    return v(this, V);
+    return v(this, K);
   }
   /**
   Whether the queue is currently paused.
@@ -512,56 +512,56 @@ class Ei extends yi {
     return v(this, Z);
   }
 }
-de = new WeakMap(), ue = new WeakMap(), ne = new WeakMap(), Ee = new WeakMap(), ce = new WeakMap(), xe = new WeakMap(), K = new WeakMap(), fe = new WeakMap(), P = new WeakMap(), Ce = new WeakMap(), V = new WeakMap(), ge = new WeakMap(), Z = new WeakMap(), Re = new WeakMap(), Le = new WeakMap(), D = new WeakSet(), Tt = function() {
-  return v(this, ue) || v(this, ne) < v(this, Ee);
+he = new WeakMap(), de = new WeakMap(), re = new WeakMap(), be = new WeakMap(), ue = new WeakMap(), Ee = new WeakMap(), V = new WeakMap(), ce = new WeakMap(), P = new WeakMap(), xe = new WeakMap(), K = new WeakMap(), fe = new WeakMap(), Z = new WeakMap(), Ce = new WeakMap(), Oe = new WeakMap(), D = new WeakSet(), Rt = function() {
+  return v(this, de) || v(this, re) < v(this, be);
+}, Tt = function() {
+  return v(this, K) < v(this, fe);
 }, Dt = function() {
-  return v(this, V) < v(this, ge);
+  me(this, K)._--, L(this, D, Te).call(this), this.emit("next");
 }, zt = function() {
-  ve(this, V)._--, L(this, D, De).call(this), this.emit("next");
+  L(this, D, Be).call(this), L(this, D, qe).call(this), N(this, ce, void 0);
 }, St = function() {
-  L(this, D, Fe).call(this), L(this, D, $e).call(this), N(this, fe, void 0);
-}, kt = function() {
   const t = Date.now();
-  if (v(this, K) === void 0) {
-    const i = v(this, xe) - t;
+  if (v(this, V) === void 0) {
+    const i = v(this, Ee) - t;
     if (i < 0)
-      N(this, ne, v(this, de) ? v(this, V) : 0);
+      N(this, re, v(this, he) ? v(this, K) : 0);
     else
-      return v(this, fe) === void 0 && N(this, fe, setTimeout(() => {
-        L(this, D, St).call(this);
+      return v(this, ce) === void 0 && N(this, ce, setTimeout(() => {
+        L(this, D, zt).call(this);
       }, i)), !0;
   }
   return !1;
-}, De = function() {
+}, Te = function() {
   if (v(this, P).size === 0)
-    return v(this, K) && clearInterval(v(this, K)), N(this, K, void 0), this.emit("empty"), v(this, V) === 0 && this.emit("idle"), !1;
+    return v(this, V) && clearInterval(v(this, V)), N(this, V, void 0), this.emit("empty"), v(this, K) === 0 && this.emit("idle"), !1;
   if (!v(this, Z)) {
-    const t = !v(this, D, kt);
-    if (v(this, D, Tt) && v(this, D, Dt)) {
+    const t = !v(this, D, St);
+    if (v(this, D, Rt) && v(this, D, Tt)) {
       const i = v(this, P).dequeue();
-      return i ? (this.emit("active"), i(), t && L(this, D, $e).call(this), !0) : !1;
+      return i ? (this.emit("active"), i(), t && L(this, D, qe).call(this), !0) : !1;
     }
   }
   return !1;
-}, $e = function() {
-  v(this, ue) || v(this, K) !== void 0 || (N(this, K, setInterval(() => {
-    L(this, D, Fe).call(this);
-  }, v(this, ce))), N(this, xe, Date.now() + v(this, ce)));
-}, Fe = function() {
-  v(this, ne) === 0 && v(this, V) === 0 && v(this, K) && (clearInterval(v(this, K)), N(this, K, void 0)), N(this, ne, v(this, de) ? v(this, V) : 0), L(this, D, ze).call(this);
+}, qe = function() {
+  v(this, de) || v(this, V) !== void 0 || (N(this, V, setInterval(() => {
+    L(this, D, Be).call(this);
+  }, v(this, ue))), N(this, Ee, Date.now() + v(this, ue)));
+}, Be = function() {
+  v(this, re) === 0 && v(this, K) === 0 && v(this, V) && (clearInterval(v(this, V)), N(this, V, void 0)), N(this, re, v(this, he) ? v(this, K) : 0), L(this, D, De).call(this);
 }, /**
 Executes all queued functions until it reaches the limit.
 */
-ze = function() {
-  for (; L(this, D, De).call(this); )
+De = function() {
+  for (; L(this, D, Te).call(this); )
     ;
-}, Nt = async function(t) {
+}, kt = async function(t) {
   return new Promise((i, s) => {
     t.addEventListener("abort", () => {
       s(t.reason);
     }, { once: !0 });
   });
-}, Se = async function(t, i) {
+}, ze = async function(t, i) {
   return new Promise((s) => {
     const r = () => {
       i && !i() || (this.off(t, r), s());
@@ -569,15 +569,15 @@ ze = function() {
     this.on(t, r);
   });
 };
-const xi = () => {
-  const u = Et(), e = pe(ae);
+const bi = () => {
+  const u = bt(), e = ge(oe);
   if (!e)
     return;
   if (e.queryFnOverride) {
     console.warn("Detected incorrect use of useRequestQueue.  This composable should not be used in nested components.  Please discuss with team-data or report an issue if you feel you have a use case.");
     return;
   }
-  const t = new Ei({
+  const t = new wi({
     carryoverConcurrencyCount: !0,
     concurrency: u.maxParallelRequests,
     interval: u.requestInterval,
@@ -587,12 +587,12 @@ const xi = () => {
     queryFnOverride: !0,
     queryFn: (s, r) => t.add(() => e.queryFn(s, r), { throwOnTimeout: !0 })
   };
-  It(ae, i);
-}, ie = {
-  useI18n: di,
-  useEvaluateFeatureFlag: gi,
-  useRequestQueue: xi
-}, Ye = /* @__PURE__ */ U({
+  Lt(oe, i);
+}, ve = {
+  useI18n: li,
+  useEvaluateFeatureFlag: ci,
+  useRequestQueue: bi
+}, Ke = /* @__PURE__ */ F({
   __name: "QueryDataProvider",
   props: {
     context: {},
@@ -602,73 +602,73 @@ const xi = () => {
   },
   emits: ["chart-data", "queryComplete"],
   setup(u, { emit: e }) {
-    const t = u, i = e, { i18n: s } = ie.useI18n(), r = pe(ae), o = () => t.queryReady && r ? JSON.stringify([t.query, t.context, t.refreshCounter]) : null, n = new AbortController();
-    Ue(() => {
+    const t = u, i = e, { i18n: s } = ve.useI18n(), r = ge(oe), o = () => t.queryReady && r ? JSON.stringify([t.query, t.context, t.refreshCounter]) : null, n = new AbortController();
+    $e(() => {
       n.abort();
     });
-    const d = (C, k, R) => {
+    const a = (R, S, C) => {
       const E = [];
-      return k && E.push(...k), E.push(...Ft(C, R)), E;
-    }, { data: l, error: a, isValidating: h } = jt(o, async () => {
-      var C, k, R, E;
+      return S && E.push(...S), E.push(...Bt(R, C)), E;
+    }, { data: d, error: l, isValidating: h } = Yt(o, async () => {
+      var R, S, C, E;
       try {
         let {
           datasource: x,
-          ...S
+          ...z
         } = t.query;
         x || (x = "basic");
-        const q = d(x, t.query.filters, t.context.filters);
-        let G = t.query.time_range;
-        G ? G.tz || (G = {
-          ...G,
+        const q = a(x, t.query.filters, t.context.filters);
+        let U = t.query.time_range;
+        U ? U.tz || (U = {
+          ...U,
           tz: t.context.tz
-        }) : G = {
+        }) : U = {
           ...t.context.timeSpec,
           tz: t.context.tz
         };
-        const Te = {
+        const Re = {
           datasource: x,
           query: {
-            ...S,
-            time_range: G,
+            ...z,
+            time_range: U,
             filters: q
           }
         };
-        return r == null ? void 0 : r.queryFn(Te, n);
+        return r == null ? void 0 : r.queryFn(Re, n);
       } catch (x) {
-        m.value = ((k = (C = x == null ? void 0 : x.response) == null ? void 0 : C.data) == null ? void 0 : k.message) === "Range not allowed for this tier" ? s.t("queryDataProvider.timeRangeExceeded") : ((E = (R = x == null ? void 0 : x.response) == null ? void 0 : R.data) == null ? void 0 : E.message) || (x == null ? void 0 : x.message);
+        m.value = ((S = (R = x == null ? void 0 : x.response) == null ? void 0 : R.data) == null ? void 0 : S.message) === "Range not allowed for this tier" ? s.t("queryDataProvider.timeRangeExceeded") : ((E = (C = x == null ? void 0 : x.response) == null ? void 0 : C.data) == null ? void 0 : E.message) || (x == null ? void 0 : x.message);
       } finally {
         i("queryComplete");
       }
     }, {
       refreshInterval: t.context.refreshInterval,
       revalidateOnFocus: !1
-    }), { state: f, swrvState: g } = ri(l, a, h), m = B(null), y = A(() => f.value === g.ERROR || !!m.value), p = A(() => !t.queryReady || f.value === g.PENDING);
-    return Ge(l, (C) => {
-      C && i("chart-data", C);
-    }), (C, k) => {
-      const R = oe("KSkeleton"), E = oe("KEmptyState");
-      return p.value || !z(l) && !y.value ? (T(), H(R, {
+    }), { state: f, swrvState: p } = ii(d, l, h), m = B(null), y = H(() => f.value === p.ERROR || !!m.value), g = H(() => !t.queryReady || f.value === p.PENDING);
+    return Ue(d, (R) => {
+      R && i("chart-data", R);
+    }), (R, S) => {
+      const C = ne("KSkeleton"), E = ne("KEmptyState");
+      return g.value || !k(d) && !y.value ? (T(), A(C, {
         key: 0,
         class: "chart-skeleton",
         type: "table"
-      })) : y.value ? (T(), H(E, {
+      })) : y.value ? (T(), A(E, {
         key: 1,
         "action-button-visible": !1,
         "data-testid": "chart-empty-state",
         "icon-variant": "error"
       }, {
         default: M(() => [
-          _e(ee(m.value), 1)
+          ye(ee(m.value), 1)
         ]),
         _: 1
-      })) : z(l) ? Me(C.$slots, "default", {
+      })) : k(d) ? Le(R.$slots, "default", {
         key: 2,
-        data: z(l)
+        data: k(d)
       }) : X("", !0);
     };
   }
-}), Ci = /* @__PURE__ */ U({
+}), Ei = /* @__PURE__ */ F({
   __name: "SimpleChartRenderer",
   props: {
     query: {},
@@ -679,21 +679,21 @@ const xi = () => {
     refreshCounter: {}
   },
   setup(u) {
-    Ie((i) => ({
+    Ge((i) => ({
       "35a26ebf": `${i.height}px`
     }));
-    const e = u, t = A(() => e.chartOptions.type === "single_value");
-    return (i, s) => (T(), H(Ye, {
+    const e = u, t = H(() => e.chartOptions.type === "single_value");
+    return (i, s) => (T(), A(Ke, {
       context: i.context,
       query: i.query,
       "query-ready": i.queryReady,
       "refresh-counter": i.refreshCounter
     }, {
       default: M(({ data: r }) => [
-        he("div", {
-          class: We(["analytics-chart", { "single-value": t.value }])
+        le("div", {
+          class: Fe(["analytics-chart", { "single-value": t.value }])
         }, [
-          te(z(Kt), {
+          te(k(Ft), {
             "chart-data": r,
             "chart-options": i.chartOptions,
             "synthetics-data-key": t.value ? void 0 : i.chartOptions.syntheticsDataKey
@@ -703,12 +703,12 @@ const xi = () => {
       _: 1
     }, 8, ["context", "query", "query-ready", "refresh-counter"]));
   }
-}), le = (u, e) => {
+}), ae = (u, e) => {
   const t = u.__vccOpts || u;
   for (const [i, s] of e)
     t[i] = s;
   return t;
-}, ot = /* @__PURE__ */ le(Ci, [["__scopeId", "data-v-65cc8607"]]), Ri = { class: "analytics-chart" }, Ti = /* @__PURE__ */ U({
+}, nt = /* @__PURE__ */ ae(Ei, [["__scopeId", "data-v-65cc8607"]]), xi = { class: "analytics-chart" }, Ci = /* @__PURE__ */ F({
   __name: "BaseAnalyticsChartRenderer",
   props: {
     query: {},
@@ -721,57 +721,56 @@ const xi = () => {
   },
   emits: ["edit-tile", "chart-data"],
   setup(u, { emit: e }) {
-    const t = u, i = e, { i18n: s } = ie.useI18n(), { evaluateFeatureFlag: r } = ie.useEvaluateFeatureFlag(), o = r("ma-3043-analytics-chart-kebab-menu", !1), n = A(() => ({
+    const t = u, i = e, { i18n: s } = ve.useI18n(), r = H(() => ({
       type: t.chartOptions.type,
       stacked: t.chartOptions.stacked ?? !1,
       chartDatasetColors: t.chartOptions.chartDatasetColors,
       threshold: t.chartOptions.threshold
-    })), d = () => {
+    })), o = () => {
       i("edit-tile");
-    }, l = (a) => {
+    }, n = (a) => {
       i("chart-data", a);
     };
-    return (a, h) => {
-      const f = oe("KDropdownItem");
-      return T(), H(Ye, {
+    return (a, d) => {
+      const l = ne("KDropdownItem");
+      return T(), A(Ke, {
         context: a.context,
         query: a.query,
         "query-ready": a.queryReady,
         "refresh-counter": a.refreshCounter,
-        onChartData: l
+        onChartData: n
       }, {
-        default: M(({ data: g }) => [
-          he("div", Ri, [
-            te(z(Vt), pt({
+        default: M(({ data: h }) => [
+          le("div", xi, [
+            te(k(Wt), gt({
               "allow-csv-export": a.chartOptions.allowCsvExport,
-              "chart-data": g,
-              "chart-options": n.value,
-              "chart-title": !z(o) && a.chartOptions.chartTitle || "",
+              "chart-data": h,
+              "chart-options": r.value,
               "legend-position": "bottom",
               "show-menu": a.context.editable,
               "synthetics-data-key": a.chartOptions.syntheticsDataKey,
               "tooltip-title": ""
-            }, a.extraProps), mt({ _: 2 }, [
+            }, a.extraProps), pt({ _: 2 }, [
               a.context.editable ? {
                 name: "menu-items",
                 fn: M(() => [
-                  te(f, { onClick: d }, {
+                  te(l, { onClick: o }, {
                     default: M(() => [
-                      _e(ee(z(s).t("renderer.edit")), 1)
+                      ye(ee(k(s).t("renderer.edit")), 1)
                     ]),
                     _: 1
                   })
                 ]),
                 key: "0"
               } : void 0
-            ]), 1040, ["allow-csv-export", "chart-data", "chart-options", "chart-title", "show-menu", "synthetics-data-key"])
+            ]), 1040, ["allow-csv-export", "chart-data", "chart-options", "show-menu", "synthetics-data-key"])
           ])
         ]),
         _: 1
       }, 8, ["context", "query", "query-ready", "refresh-counter"]);
     };
   }
-}), Xe = /* @__PURE__ */ le(Ti, [["__scopeId", "data-v-ac4da911"]]), at = /* @__PURE__ */ U({
+}), Ye = /* @__PURE__ */ ae(Ci, [["__scopeId", "data-v-85aa2302"]]), ot = /* @__PURE__ */ F({
   __name: "BarChartRenderer",
   props: {
     query: {},
@@ -782,7 +781,7 @@ const xi = () => {
     refreshCounter: {}
   },
   setup(u) {
-    return (e, t) => (T(), H(Xe, {
+    return (e, t) => (T(), A(Ye, {
       "chart-options": e.chartOptions,
       context: e.context,
       "extra-props": { showAnnotations: !1 },
@@ -792,7 +791,7 @@ const xi = () => {
       "refresh-counter": e.refreshCounter
     }, null, 8, ["chart-options", "context", "height", "query", "query-ready", "refresh-counter"]));
   }
-}), lt = /* @__PURE__ */ U({
+}), at = /* @__PURE__ */ F({
   __name: "TimeseriesChartRenderer",
   props: {
     query: {},
@@ -803,7 +802,7 @@ const xi = () => {
     refreshCounter: {}
   },
   setup(u) {
-    return (e, t) => (T(), H(Xe, {
+    return (e, t) => (T(), A(Ye, {
       "chart-options": e.chartOptions,
       context: e.context,
       height: e.height,
@@ -812,7 +811,7 @@ const xi = () => {
       "refresh-counter": e.refreshCounter
     }, null, 8, ["chart-options", "context", "height", "query", "query-ready", "refresh-counter"]));
   }
-}), Di = { class: "metric-card-tile-wrapper" }, zi = /* @__PURE__ */ U({
+}), Ri = { class: "metric-card-tile-wrapper" }, Ti = /* @__PURE__ */ F({
   __name: "GoldenSignalsRenderer",
   props: {
     query: {},
@@ -823,71 +822,64 @@ const xi = () => {
     refreshCounter: {}
   },
   setup(u) {
-    Ie((o) => ({
-      "926e3b48": z(i) ? "90%" : "100%",
-      "7be2893e": z(i) ? "auto" : "100%",
-      "0d55c162": z(i) ? "100%" : "none"
-    }));
-    const e = u, { evaluateFeatureFlag: t } = ie.useEvaluateFeatureFlag(), i = t("ma-3043-analytics-chart-kebab-menu", !1), s = A(() => {
-      const o = e.context.timeSpec;
-      if (o.type === "absolute")
-        return new Ut({
+    const e = u, t = H(() => {
+      const s = e.context.timeSpec;
+      if (s.type === "absolute")
+        return new $t({
           key: "custom",
           timeframeText: "custom",
           display: "custom",
-          startCustom: o.start,
-          endCustom: o.end,
-          timeframeLength: () => o.end.getTime() - o.start.getTime(),
+          startCustom: s.start,
+          endCustom: s.end,
+          timeframeLength: () => s.end.getTime() - s.start.getTime(),
           defaultResponseGranularity: "daily",
           dataGranularity: "daily",
           isRelative: !1,
           allowedTiers: ["free", "plus", "enterprise"]
         });
-      const n = wt.get(o.time_range);
-      if (!n)
+      const r = wt.get(s.time_range);
+      if (!r)
         throw new Error("Unknown time range");
-      return n;
-    }), r = A(() => {
-      var n, d;
-      const o = (n = e.query) == null ? void 0 : n.datasource;
-      if (o && o !== "advanced" && o !== "basic")
-        throw new Error(`Invalid datasource value: ${o}`);
+      return r;
+    }), i = H(() => {
+      var r, o;
+      const s = (r = e.query) == null ? void 0 : r.datasource;
+      if (s && s !== "advanced" && s !== "basic")
+        throw new Error(`Invalid datasource value: ${s}`);
       return {
-        datasource: (d = e.query) == null ? void 0 : d.datasource,
-        overrideTimeframe: s.value,
+        datasource: (o = e.query) == null ? void 0 : o.datasource,
+        overrideTimeframe: t.value,
         tz: e.context.tz,
         additionalFilter: e.context.filters,
         // TODO: Decide how to handle metric card filters.
         longCardTitles: e.chartOptions.longCardTitles,
-        ...!i && { containerTitle: e.chartOptions.chartTitle },
-        ...!i && { description: e.chartOptions.description },
         percentileLatency: e.chartOptions.percentileLatency,
         refreshInterval: e.context.refreshInterval,
         queryReady: e.queryReady,
         refreshCounter: e.refreshCounter
       };
     });
-    return (o, n) => (T(), $("div", Di, [
-      te(z(Zt), Pt(qt(r.value)), {
+    return (s, r) => (T(), $("div", Ri, [
+      te(k(Qt), Mt(It(i.value)), {
         default: M(() => [
-          te(z(ei))
+          te(k(Jt))
         ]),
         _: 1
       }, 16)
     ]));
   }
-}), Si = /* @__PURE__ */ le(zi, [["__scopeId", "data-v-0f571079"]]), ht = "#6c7489", dt = "20px", At = "20px", ki = {
+}), Di = /* @__PURE__ */ ae(Ti, [["__scopeId", "data-v-bd5889d1"]]), lt = "#6c7489", ht = "20px", Nt = "20px", zi = {
   class: "fallback-entity-link",
   "data-testid": "entity-link-parent"
-}, ut = /* @__PURE__ */ U({
+}, dt = /* @__PURE__ */ F({
   __name: "FallbackEntityLink",
   props: {
     entityLinkData: {}
   },
   setup(u) {
-    return (e, t) => (T(), $("div", ki, ee(e.entityLinkData.label), 1));
+    return (e, t) => (T(), $("div", zi, ee(e.entityLinkData.label), 1));
   }
-}), Ni = /* @__PURE__ */ U({
+}), Si = /* @__PURE__ */ F({
   __name: "TopNTableRenderer",
   props: {
     query: {},
@@ -898,57 +890,55 @@ const xi = () => {
     refreshCounter: {}
   },
   setup(u) {
-    const e = u, { evaluateFeatureFlag: t } = ie.useEvaluateFeatureFlag(), i = t("ma-3043-analytics-chart-kebab-menu", !1), s = pe(ae), r = Bt(async () => {
-      if (s != null && s.fetchComponent)
+    const e = u, t = ge(oe), i = Pt(async () => {
+      if (t != null && t.fetchComponent)
         try {
-          return await s.fetchComponent("EntityLink");
+          return await t.fetchComponent("EntityLink");
         } catch {
-          return ut;
+          return dt;
         }
-      return ut;
-    }), o = (n) => {
-      var d;
-      if ((d = e.chartOptions) != null && d.entityLink)
-        if (n.id.includes(":")) {
-          const [l, a] = n.id.split(":");
-          return e.chartOptions.entityLink.replace(ui, l).replace(st, a);
+      return dt;
+    }), s = (r) => {
+      var o;
+      if ((o = e.chartOptions) != null && o.entityLink)
+        if (r.id.includes(":")) {
+          const [n, a] = r.id.split(":");
+          return e.chartOptions.entityLink.replace(hi, n).replace(it, a);
         } else
-          return e.chartOptions.entityLink.replace(st, n.id);
+          return e.chartOptions.entityLink.replace(it, r.id);
       return "";
     };
-    return (n, d) => (T(), H(Ye, {
-      context: n.context,
-      query: n.query,
-      "query-ready": n.queryReady,
-      "refresh-counter": n.refreshCounter
+    return (r, o) => (T(), A(Ke, {
+      context: r.context,
+      query: r.query,
+      "query-ready": r.queryReady,
+      "refresh-counter": r.refreshCounter
     }, {
-      default: M(({ data: l }) => [
-        te(z(Yt), {
-          data: l,
-          description: !z(i) && n.chartOptions.description || "",
-          "synthetics-data-key": n.chartOptions.syntheticsDataKey,
-          title: !z(i) && n.chartOptions.chartTitle || ""
-        }, mt({ _: 2 }, [
+      default: M(({ data: n }) => [
+        te(k(Vt), {
+          data: n,
+          "synthetics-data-key": r.chartOptions.syntheticsDataKey
+        }, pt({ _: 2 }, [
           e.chartOptions.entityLink ? {
             name: "name",
             fn: M(({ record: a }) => [
-              te(z(r), {
+              te(k(i), {
                 "entity-link-data": {
                   id: a.id,
                   label: a.name,
                   deleted: a.deleted
                 },
-                "external-link": o(a)
+                "external-link": s(a)
               }, null, 8, ["entity-link-data", "external-link"])
             ]),
             key: "0"
           } : void 0
-        ]), 1032, ["data", "description", "synthetics-data-key", "title"])
+        ]), 1032, ["data", "synthetics-data-key"])
       ]),
       _: 1
     }, 8, ["context", "query", "query-ready", "refresh-counter"]));
   }
-}), Ai = /* @__PURE__ */ U({
+}), ki = /* @__PURE__ */ F({
   __name: "DonutChartRenderer",
   props: {
     query: {},
@@ -959,7 +949,7 @@ const xi = () => {
     refreshCounter: {}
   },
   setup(u) {
-    return (e, t) => (T(), H(Xe, {
+    return (e, t) => (T(), A(Ye, {
       "chart-options": e.chartOptions,
       context: e.context,
       height: e.height,
@@ -968,10 +958,10 @@ const xi = () => {
       "refresh-counter": e.refreshCounter
     }, null, 8, ["chart-options", "context", "height", "query", "query-ready", "refresh-counter"]));
   }
-}), Hi = ["data-testid"], Oi = {
+}), Ni = ["data-testid"], Hi = {
   key: 0,
   class: "tile-header"
-}, Li = ["data-testid"], Mi = ["data-testid"], Ii = ["data-testid"], Pi = ["data-testid"], qi = /* @__PURE__ */ U({
+}, Ai = ["data-testid"], Oi = ["data-testid"], Li = ["data-testid"], Mi = ["data-testid"], Ii = /* @__PURE__ */ F({
   __name: "DashboardTile",
   props: {
     definition: {},
@@ -983,45 +973,45 @@ const xi = () => {
   },
   emits: ["edit-tile", "remove-tile"],
   setup(u, { emit: e }) {
-    Ie((b) => ({
-      b37143fa: `${b.height}px`
+    Ge((w) => ({
+      "7cb73d6a": `${w.height}px`
     }));
-    const t = parseInt(At, 10), i = u, s = e, r = pe(ae), { evaluateFeatureFlag: o } = ie.useEvaluateFeatureFlag(), { i18n: n } = ie.useI18n(), d = o("ma-3043-analytics-chart-kebab-menu", !1), l = B(), a = B(!1), h = B(), f = B(!1), g = B("");
-    Ke(async () => {
-      var b;
-      g.value = await ((b = r == null ? void 0 : r.exploreBaseUrl) == null ? void 0 : b.call(r)) ?? "";
-    }), Ge(() => i.definition, async () => {
-      await yt(), h.value && (f.value = h.value.scrollWidth > h.value.clientWidth);
+    const t = parseInt(Nt, 10), i = u, s = e, r = ge(oe), { i18n: o } = ve.useI18n(), n = B(), a = B(!1), d = B(), l = B(!1), h = B("");
+    We(async () => {
+      var w;
+      h.value = await ((w = r == null ? void 0 : r.exploreBaseUrl) == null ? void 0 : w.call(r)) ?? "";
+    }), Ue(() => i.definition, async () => {
+      await mt(), d.value && (l.value = d.value.scrollWidth > d.value.clientWidth);
     }, { immediate: !0, deep: !0 });
-    const m = A(() => {
-      if (!g.value || !i.definition.query || !C.value)
+    const f = H(() => {
+      if (!h.value || !i.definition.query || !y.value)
         return "";
-      const b = [...i.context.filters, ...i.definition.query.filters ?? []], se = i.definition.query.dimensions ?? [], Y = /* @__PURE__ */ new Set(["portal", "api"]);
-      if (b.some((re) => "dimension" in re && Y.has(re.dimension) || "field" in re && Y.has(re.field)) || se.some((re) => Y.has(re)))
+      const w = [...i.context.filters, ...i.definition.query.filters ?? []], ie = i.definition.query.dimensions ?? [], Y = /* @__PURE__ */ new Set(["portal", "api"]);
+      if (w.some((se) => "dimension" in se && Y.has(se.dimension) || "field" in se && Y.has(se.field)) || ie.some((se) => Y.has(se)))
         return "";
-      const qe = {
-        filters: b,
+      const Ie = {
+        filters: w,
         metrics: i.definition.query.metrics ?? [],
-        dimensions: se,
+        dimensions: ie,
         time_range: i.definition.query.time_range || i.context.timeSpec,
-        granularity: i.definition.query.granularity || S.value
-      }, ye = ["advanced", "ai"].includes(i.definition.query.datasource) ? i.definition.query.datasource : "advanced";
-      return `${g.value}?q=${JSON.stringify(qe)}&d=${ye}&c=${i.definition.chart.type}`;
-    }), y = A(() => n.t("csvExport.defaultFilename")), p = A(() => C.value && (k.value || i.context.editable) || !!x.value), C = A(() => d && !["golden_signals", "top_n", "gauge"].includes(i.definition.chart.type)), k = A(() => !!m.value || "allowCsvExport" in i.definition.chart && i.definition.chart.allowCsvExport || i.context.editable), R = {
-      timeseries_line: lt,
-      timeseries_bar: lt,
-      horizontal_bar: at,
-      vertical_bar: at,
-      gauge: ot,
-      donut: Ai,
-      golden_signals: Si,
-      top_n: Ni,
+        granularity: i.definition.query.granularity || E.value
+      }, pe = ["advanced", "ai"].includes(i.definition.query.datasource) ? i.definition.query.datasource : "advanced";
+      return `${h.value}?q=${JSON.stringify(Ie)}&d=${pe}&c=${i.definition.chart.type}`;
+    }), p = H(() => o.t("csvExport.defaultFilename")), m = H(() => y.value && (g.value || i.context.editable) || !!C.value), y = H(() => !["golden_signals", "top_n", "gauge"].includes(i.definition.chart.type)), g = H(() => !!f.value || "allowCsvExport" in i.definition.chart && i.definition.chart.allowCsvExport || i.context.editable), R = {
+      timeseries_line: at,
+      timeseries_bar: at,
+      horizontal_bar: ot,
+      vertical_bar: ot,
+      gauge: nt,
+      donut: ki,
+      golden_signals: Di,
+      top_n: Si,
       slottable: void 0,
-      single_value: ot
-    }, E = A(() => {
-      const b = R[i.definition.chart.type];
-      return b && {
-        component: b,
+      single_value: nt
+    }, S = H(() => {
+      const w = R[i.definition.chart.type];
+      return w && {
+        component: w,
         rendererProps: {
           query: i.definition.query,
           context: i.context,
@@ -1031,149 +1021,149 @@ const xi = () => {
           refreshCounter: i.refreshCounter
         }
       };
-    }), x = A(() => {
-      var se;
-      const b = (se = i.definition.query) == null ? void 0 : se.time_range;
-      if ((b == null ? void 0 : b.type) === "relative") {
-        const Y = wt.get(Gt[b.time_range]);
-        return Y ? Y.display : (console.warn("Did not recognize the given relative time range:", b.time_range), b.time_range);
-      } else if ((b == null ? void 0 : b.type) === "absolute") {
-        const Y = b.tz || "Etc/UTC";
-        return `${it(b.start, { short: !0, tz: Y })} - ${it(b.end, { short: !0, tz: Y })}`;
+    }), C = H(() => {
+      var ie;
+      const w = (ie = i.definition.query) == null ? void 0 : ie.time_range;
+      if ((w == null ? void 0 : w.type) === "relative") {
+        const Y = wt.get(Ut[w.time_range]);
+        return Y ? Y.display : (console.warn("Did not recognize the given relative time range:", w.time_range), w.time_range);
+      } else if ((w == null ? void 0 : w.type) === "absolute") {
+        const Y = w.tz || "Etc/UTC";
+        return `${tt(w.start, { short: !0, tz: Y })} - ${tt(w.end, { short: !0, tz: Y })}`;
       }
       return null;
-    }), S = A(() => l.value ? Wt(l.value.meta.granularity_ms) : void 0), q = () => {
+    }), E = H(() => n.value ? Gt(n.value.meta.granularity_ms) : void 0), x = () => {
       s("edit-tile", i.definition);
-    }, G = () => {
+    }, z = () => {
       s("remove-tile", i.definition);
-    }, Te = (b) => {
-      l.value = b;
-    }, me = (b) => {
-      a.value = b;
-    }, Ot = () => {
-      me(!0);
+    }, q = (w) => {
+      n.value = w;
+    }, U = (w) => {
+      a.value = w;
+    }, Re = () => {
+      U(!0);
     };
-    return (b, se) => {
-      const Y = oe("KTooltip"), qe = oe("KBadge"), ye = oe("KDropdownItem"), re = oe("KDropdown");
+    return (w, ie) => {
+      const Y = ne("KTooltip"), Ie = ne("KBadge"), pe = ne("KDropdownItem"), se = ne("KDropdown");
       return T(), $("div", {
-        class: We(["tile-boundary", { editable: b.context.editable }]),
-        "data-testid": `tile-${b.tileId}`
+        class: Fe(["tile-boundary", { editable: w.context.editable }]),
+        "data-testid": `tile-${w.tileId}`
       }, [
-        z(d) && b.definition.chart.type !== "slottable" ? (T(), $("div", Oi, [
+        w.definition.chart.type !== "slottable" ? (T(), $("div", Hi, [
           te(Y, {
             class: "title-tooltip",
-            disabled: !f.value,
+            disabled: !l.value,
             "max-width": "500",
-            text: b.definition.chart.chartTitle
+            text: w.definition.chart.chartTitle
           }, {
             default: M(() => [
-              he("div", {
+              le("div", {
                 ref_key: "titleRef",
-                ref: h,
+                ref: d,
                 class: "title"
-              }, ee(b.definition.chart.chartTitle), 513)
+              }, ee(w.definition.chart.chartTitle), 513)
             ]),
             _: 1
           }, 8, ["disabled", "text"]),
-          p.value ? (T(), $("div", {
+          m.value ? (T(), $("div", {
             key: 0,
             class: "tile-actions",
-            "data-testid": `tile-actions-${b.tileId}`
+            "data-testid": `tile-actions-${w.tileId}`
           }, [
-            x.value ? (T(), H(qe, { key: 0 }, {
+            C.value ? (T(), A(Ie, { key: 0 }, {
               default: M(() => [
-                _e(ee(x.value), 1)
+                ye(ee(C.value), 1)
               ]),
               _: 1
             })) : X("", !0),
-            C.value && b.context.editable ? (T(), H(z(ti), {
+            y.value && w.context.editable ? (T(), A(k(Zt), {
               key: 1,
               class: "edit-icon",
-              color: z(ht),
-              "data-testid": `edit-tile-${b.tileId}`,
-              size: z(dt),
-              onClick: q
+              color: k(lt),
+              "data-testid": `edit-tile-${w.tileId}`,
+              size: k(ht),
+              onClick: x
             }, null, 8, ["color", "data-testid", "size"])) : X("", !0),
-            C.value && k.value ? (T(), H(re, {
+            y.value && g.value ? (T(), A(se, {
               key: 2,
               class: "dropdown",
-              "data-testid": `chart-action-menu-${b.tileId}`,
+              "data-testid": `chart-action-menu-${w.tileId}`,
               "kpop-attributes": { placement: "bottom-end" }
             }, {
               items: M(() => [
-                m.value ? (T(), H(ye, {
+                f.value ? (T(), A(pe, {
                   key: 0,
-                  "data-testid": `chart-jump-to-explore-${b.tileId}`,
-                  item: { label: z(n).t("jumpToExplore"), to: m.value }
+                  "data-testid": `chart-jump-to-explore-${w.tileId}`,
+                  item: { label: k(o).t("jumpToExplore"), to: f.value }
                 }, null, 8, ["data-testid", "item"])) : X("", !0),
-                "allowCsvExport" in b.definition.chart && b.definition.chart.allowCsvExport ? (T(), H(ye, {
+                !("allowCsvExport" in w.definition.chart) || w.definition.chart.allowCsvExport ? (T(), A(pe, {
                   key: 1,
                   class: "chart-export-button",
-                  "data-testid": `chart-csv-export-${b.tileId}`,
-                  onClick: se[0] || (se[0] = (ts) => Ot())
+                  "data-testid": `chart-csv-export-${w.tileId}`,
+                  onClick: ie[0] || (ie[0] = (Zi) => Re())
                 }, {
                   default: M(() => [
-                    he("span", {
+                    le("span", {
                       class: "chart-export-trigger",
-                      "data-testid": `csv-export-button-${b.tileId}`
-                    }, ee(z(n).t("csvExport.exportAsCsv")), 9, Mi)
+                      "data-testid": `csv-export-button-${w.tileId}`
+                    }, ee(k(o).t("csvExport.exportAsCsv")), 9, Oi)
                   ]),
                   _: 1
                 }, 8, ["data-testid"])) : X("", !0),
-                b.context.editable ? (T(), H(ye, {
+                w.context.editable ? (T(), A(pe, {
                   key: 2,
-                  "data-testid": `remove-tile-${b.tileId}`,
-                  onClick: G
+                  "data-testid": `remove-tile-${w.tileId}`,
+                  onClick: z
                 }, {
                   default: M(() => [
-                    _e(ee(z(n).t("renderer.remove")), 1)
+                    ye(ee(k(o).t("renderer.remove")), 1)
                   ]),
                   _: 1
                 }, 8, ["data-testid"])) : X("", !0)
               ]),
               default: M(() => [
-                te(z(ii), {
+                te(k(ei), {
                   class: "kebab-action-menu",
-                  color: z(ht),
-                  "data-testid": `kebab-action-menu-${b.tileId}`,
-                  size: z(dt)
+                  color: k(lt),
+                  "data-testid": `kebab-action-menu-${w.tileId}`,
+                  size: k(ht)
                 }, null, 8, ["color", "data-testid", "size"])
               ]),
               _: 1
             }, 8, ["data-testid"])) : X("", !0)
-          ], 8, Li)) : "description" in b.definition.chart ? (T(), $("div", {
+          ], 8, Ai)) : "description" in w.definition.chart ? (T(), $("div", {
             key: 1,
             class: "header-description",
-            "data-testid": `tile-description-${b.tileId}`
-          }, ee(b.definition.chart.description), 9, Ii)) : X("", !0),
-          a.value ? (T(), H(z(Xt), {
+            "data-testid": `tile-description-${w.tileId}`
+          }, ee(w.definition.chart.description), 9, Li)) : X("", !0),
+          a.value ? (T(), A(k(Kt), {
             key: 2,
-            "chart-data": l.value,
-            "data-testid": `csv-export-modal-${b.tileId}`,
-            filename: y.value,
-            onToggleModal: me
+            "chart-data": n.value,
+            "data-testid": `csv-export-modal-${w.tileId}`,
+            filename: p.value,
+            onToggleModal: U
           }, null, 8, ["chart-data", "data-testid", "filename"])) : X("", !0)
         ])) : X("", !0),
-        he("div", {
+        le("div", {
           class: "tile-content",
-          "data-testid": `tile-content-${b.tileId}`
+          "data-testid": `tile-content-${w.tileId}`
         }, [
-          E.value ? (T(), H(vt(E.value.component), pt({ key: 0 }, E.value.rendererProps, { onChartData: Te }), null, 16)) : X("", !0)
-        ], 8, Pi)
-      ], 10, Hi);
+          S.value ? (T(), A(yt(S.value.component), gt({ key: 0 }, S.value.rendererProps, { onChartData: q }), null, 16)) : X("", !0)
+        ], 8, Mi)
+      ], 10, Ni);
     };
   }
-}), Bi = /* @__PURE__ */ le(qi, [["__scopeId", "data-v-00d0c9ec"]]), $i = (u, e, t) => {
+}), Pi = /* @__PURE__ */ ae(Ii, [["__scopeId", "data-v-7be0ec05"]]), qi = (u, e, t) => {
   const i = /* @__PURE__ */ new Map();
   t.forEach((r) => {
-    const o = r.layout.position.row, n = i.get(o), d = r.layout.size.rows === 1 && !!r.layout.size.fitToContent;
-    n === void 0 ? i.set(o, d) : i.set(o, n && d);
+    const o = r.layout.position.row, n = i.get(o), a = r.layout.size.rows === 1 && !!r.layout.size.fitToContent;
+    n === void 0 ? i.set(o, a) : i.set(o, n && a);
   });
   const s = [];
   for (let r = 0; r < u; r++)
     i.get(r) ? s.push("auto") : s.push(`${e}px`);
   return s;
-}, Fi = /* @__PURE__ */ U({
+}, Bi = /* @__PURE__ */ F({
   __name: "GridLayout",
   props: {
     gridSize: {
@@ -1191,7 +1181,7 @@ const xi = () => {
     }
   },
   setup(u) {
-    Ie((n) => ({
+    Ge((n) => ({
       "3bc5e939": u.gridSize.cols,
       "77aa3028": r.value
     }));
@@ -1200,16 +1190,16 @@ const xi = () => {
         !Array.isArray(n) || !n.length || (i.value = n[0].contentRect.width);
       });
     });
-    Ke(() => {
+    We(() => {
       t.value && s.observe(t.value);
-    }), Ue(() => {
+    }), $e(() => {
       t.value && s.unobserve(t.value);
     });
-    const r = A(() => {
-      var d;
-      return $i((d = e.gridSize) == null ? void 0 : d.rows, e.tileHeight, e.tiles).join(" ");
-    }), o = A(() => e.tiles.map((n, d) => ({
-      key: `tile-${d}`,
+    const r = H(() => {
+      var a;
+      return qi((a = e.gridSize) == null ? void 0 : a.rows, e.tileHeight, e.tiles).join(" ");
+    }), o = H(() => e.tiles.map((n, a) => ({
+      key: `tile-${a}`,
       tile: n,
       style: {
         "grid-column-start": n.layout.position.col + 1,
@@ -1218,27 +1208,27 @@ const xi = () => {
         "grid-row-end": n.layout.position.row + 1 + n.layout.size.rows
       }
     })));
-    return (n, d) => (T(), $("div", {
+    return (n, a) => (T(), $("div", {
       ref_key: "gridContainer",
       ref: t,
       class: "kong-ui-public-grid-layout"
     }, [
-      (T(!0), $(_t, null, bt(o.value, (l) => (T(), $("div", {
-        key: l.key,
-        class: We(["grid-cell", {
-          "empty-cell": !l.tile
+      (T(!0), $(vt, null, _t(o.value, (d) => (T(), $("div", {
+        key: d.key,
+        class: Fe(["grid-cell", {
+          "empty-cell": !d.tile
         }]),
-        style: et(l.style)
+        style: Ze(d.style)
       }, [
-        Me(n.$slots, "tile", {
-          style: et(l.style),
-          tile: l.tile
+        Le(n.$slots, "tile", {
+          style: Ze(d.style),
+          tile: d.tile
         }, void 0, !0)
       ], 6))), 128))
     ], 512));
   }
-}), Ui = /* @__PURE__ */ le(Fi, [["__scopeId", "data-v-f43eb7b8"]]);
-function Gi(u, e, t, i, s) {
+}), $i = /* @__PURE__ */ ae(Bi, [["__scopeId", "data-v-f43eb7b8"]]);
+function Ui(u, e, t, i, s) {
   const r = (...o) => (console.warn("gridstack.js: Function `" + t + "` is deprecated in " + s + " and has been replaced with `" + i + "`. It will be **removed** in a future release"), e.apply(u, o));
   return r.prototype = e.prototype, r;
 }
@@ -1277,12 +1267,12 @@ class c {
   static createWidgetDivs(e, t) {
     var o, n;
     const i = c.createDiv(["grid-stack-item", e]), s = c.createDiv(["grid-stack-item-content"], i);
-    return t.lazyLoad || ((n = (o = t.grid) == null ? void 0 : o.opts) == null ? void 0 : n.lazyLoad) && t.lazyLoad !== !1 ? t.visibleObservable || (t.visibleObservable = new IntersectionObserver(([d]) => {
-      var l;
-      d.isIntersecting && ((l = t.visibleObservable) == null || l.disconnect(), delete t.visibleObservable, _.renderCB(s, t));
-    }), window.setTimeout(() => {
+    return t.lazyLoad || ((n = (o = t.grid) == null ? void 0 : o.opts) == null ? void 0 : n.lazyLoad) && t.lazyLoad !== !1 ? t.visibleObservable || (t.visibleObservable = new IntersectionObserver(([a]) => {
       var d;
-      return (d = t.visibleObservable) == null ? void 0 : d.observe(i);
+      a.isIntersecting && ((d = t.visibleObservable) == null || d.disconnect(), delete t.visibleObservable, _.renderCB(s, t));
+    }), window.setTimeout(() => {
+      var a;
+      return (a = t.visibleObservable) == null ? void 0 : a.observe(i);
     })) : _.renderCB(s, t), i;
   }
   /** create a div with the given classes */
@@ -1452,10 +1442,10 @@ class c {
   static updateScrollPosition(e, t, i) {
     const s = e.getBoundingClientRect(), r = window.innerHeight || document.documentElement.clientHeight;
     if (s.top < 0 || s.bottom > r) {
-      const o = s.bottom - r, n = s.top, d = this.getScrollElement(e);
-      if (d !== null) {
-        const l = d.scrollTop;
-        s.top < 0 && i < 0 ? e.offsetHeight > r ? d.scrollTop += i : d.scrollTop += Math.abs(n) > Math.abs(i) ? i : n : i > 0 && (e.offsetHeight > r ? d.scrollTop += i : d.scrollTop += o > i ? i : o), t.top += d.scrollTop - l;
+      const o = s.bottom - r, n = s.top, a = this.getScrollElement(e);
+      if (a !== null) {
+        const d = a.scrollTop;
+        s.top < 0 && i < 0 ? e.offsetHeight > r ? a.scrollTop += i : a.scrollTop += Math.abs(n) > Math.abs(i) ? i : n : i > 0 && (e.offsetHeight > r ? a.scrollTop += i : a.scrollTop += o > i ? i : o), t.top += a.scrollTop - d;
       }
     }
   }
@@ -1467,8 +1457,8 @@ class c {
    * @param distance Distance from the V edges to start scrolling
    */
   static updateScrollResize(e, t, i) {
-    const s = this.getScrollElement(t), r = s.clientHeight, o = s === this.getScrollElement() ? 0 : s.getBoundingClientRect().top, n = e.clientY - o, d = n < i, l = n > r - i;
-    d ? s.scrollBy({ behavior: "smooth", top: n - i }) : l && s.scrollBy({ behavior: "smooth", top: i - (r - n) });
+    const s = this.getScrollElement(t), r = s.clientHeight, o = s === this.getScrollElement() ? 0 : s.getBoundingClientRect().top, n = e.clientY - o, a = n < i, d = n > r - i;
+    a ? s.scrollBy({ behavior: "smooth", top: n - i }) : d && s.scrollBy({ behavior: "smooth", top: i - (r - n) });
   }
   /** single level clone, returning a new object with same top fields. This will share sub objects and arrays */
   static clone(e) {
@@ -1622,19 +1612,19 @@ class Q {
     !this._loading && this._useEntireRowArea(e, t) && (r = { x: 0, w: this.column, y: t.y, h: t.h }, i = this.collide(e, r, s.skip));
     let o = !1;
     const n = { nested: !0, pack: !1 };
-    let d = 0;
+    let a = 0;
     for (; i = i || this.collide(e, r, s.skip); ) {
-      if (d++ > this.nodes.length * 2)
+      if (a++ > this.nodes.length * 2)
         throw new Error("Infinite collide check");
-      let l;
+      let d;
       if (i.locked || this._loading || e._moving && !e._skipDown && t.y > e.y && !this.float && // can take space we had, or before where we're going
       (!this.collide(i, { ...i, y: e.y }, e) || !this.collide(i, { ...i, y: t.y - i.h }, e))) {
         e._skipDown = e._skipDown || t.y > e.y;
-        const a = { ...t, y: i.y + i.h, ...n };
-        l = this._loading && c.samePos(e, a) ? !0 : this.moveNode(e, a), (i.locked || this._loading) && l ? c.copyPos(t, e) : !i.locked && l && s.pack && (this._packNodes(), t.y = i.y + i.h, c.copyPos(e, t)), o = o || l;
+        const l = { ...t, y: i.y + i.h, ...n };
+        d = this._loading && c.samePos(e, l) ? !0 : this.moveNode(e, l), (i.locked || this._loading) && d ? c.copyPos(t, e) : !i.locked && d && s.pack && (this._packNodes(), t.y = i.y + i.h, c.copyPos(e, t)), o = o || d;
       } else
-        l = this.moveNode(i, { ...i, y: t.y + t.h, skip: e, ...n });
-      if (!l)
+        d = this.moveNode(i, { ...i, y: t.y + t.h, skip: e, ...n });
+      if (!d)
         return o;
       i = void 0;
     }
@@ -1656,14 +1646,14 @@ class Q {
     const s = e._rect, r = { ...t.rect };
     r.y > s.y ? (r.h += r.y - s.y, r.y = s.y) : r.h += s.y - r.y, r.x > s.x ? (r.w += r.x - s.x, r.x = s.x) : r.w += s.x - r.x;
     let o, n = 0.5;
-    for (let d of i) {
-      if (d.locked || !d._rect)
+    for (let a of i) {
+      if (a.locked || !a._rect)
         break;
-      const l = d._rect;
-      let a = Number.MAX_VALUE, h = Number.MAX_VALUE;
-      s.y < l.y ? a = (r.y + r.h - l.y) / l.h : s.y + s.h > l.y + l.h && (a = (l.y + l.h - r.y) / l.h), s.x < l.x ? h = (r.x + r.w - l.x) / l.w : s.x + s.w > l.x + l.w && (h = (l.x + l.w - r.x) / l.w);
-      const f = Math.min(h, a);
-      f > n && (n = f, o = d);
+      const d = a._rect;
+      let l = Number.MAX_VALUE, h = Number.MAX_VALUE;
+      s.y < d.y ? l = (r.y + r.h - d.y) / d.h : s.y + s.h > d.y + d.h && (l = (d.y + d.h - r.y) / d.h), s.x < d.x ? h = (r.x + r.w - d.x) / d.w : s.x + s.w > d.x + d.w && (h = (d.x + d.w - r.x) / d.w);
+      const f = Math.min(h, l);
+      f > n && (n = f, o = a);
     }
     return t.collide = o, o;
   }
@@ -1737,9 +1727,9 @@ class Q {
     const s = this._inColumnResize;
     s || (this._inColumnResize = !0);
     const r = this.nodes;
-    return this.nodes = [], r.forEach((o, n, d) => {
-      let l;
-      o.locked || (o.autoPosition = !0, e === "list" && n && (l = d[n - 1])), this.addNode(o, !1, l);
+    return this.nodes = [], r.forEach((o, n, a) => {
+      let d;
+      o.locked || (o.autoPosition = !0, e === "list" && n && (d = a[n - 1])), this.addNode(o, !1, d);
     }), s || delete this._inColumnResize, i || this.batchUpdate(!1), this;
   }
   /** enable/disable floating widgets (default: `false`) See [example](http://gridstackjs.com/demo/float.html) */
@@ -1837,11 +1827,11 @@ class Q {
     const r = s ? s.y * i + (s.x + s.w) : 0;
     let o = !1;
     for (let n = r; !o; ++n) {
-      const d = n % i, l = Math.floor(n / i);
-      if (d + e.w > i)
+      const a = n % i, d = Math.floor(n / i);
+      if (a + e.w > i)
         continue;
-      const a = { x: d, y: l, w: e.w, h: e.h };
-      t.find((h) => c.isIntercepted(a, h)) || ((e.x !== d || e.y !== l) && (e._dirty = !0), e.x = d, e.y = l, delete e.autoPosition, o = !0);
+      const l = { x: a, y: d, w: e.w, h: e.h };
+      t.find((h) => c.isIntercepted(l, h)) || ((e.x !== a || e.y !== d) && (e._dirty = !0), e.x = a, e.y = d, delete e.autoPosition, o = !0);
     }
     return o;
   }
@@ -1887,7 +1877,7 @@ class Q {
         return this._notify(), !0;
     }
     return r ? (s.nodes.filter((o) => o._dirty).forEach((o) => {
-      const n = this.nodes.find((d) => d._id === o._id);
+      const n = this.nodes.find((a) => a._id === o._id);
       n && (c.copyPos(n, o), n._dirty = !0);
     }), this._notify(), !0) : !1;
   }
@@ -1908,7 +1898,7 @@ class Q {
   }
   /** return true if the passed in node was actually moved (checks for no-op and locked) */
   moveNode(e, t) {
-    var l, a;
+    var d, l;
     if (!e || /*node.locked ||*/
     !t)
       return !1;
@@ -1918,17 +1908,17 @@ class Q {
     if (c.copyPos(r, t), this.nodeBoundFix(r, s), c.copyPos(t, r), !t.forceCollide && c.samePos(e, t))
       return !1;
     const o = c.copyPos({}, e), n = this.collideAll(e, r, t.skip);
-    let d = !0;
+    let a = !0;
     if (n.length) {
       const h = e._moving && !t.nested;
       let f = h ? this.directionCollideCoverage(e, t, n) : n[0];
-      if (h && f && ((a = (l = e.grid) == null ? void 0 : l.opts) != null && a.subGridDynamic) && !e.grid._isTemp) {
-        const g = c.areaIntercept(t.rect, f._rect), m = c.area(t.rect), y = c.area(f._rect);
-        g / (m < y ? m : y) > 0.8 && (f.grid.makeSubGrid(f.el, void 0, e), f = void 0);
+      if (h && f && ((l = (d = e.grid) == null ? void 0 : d.opts) != null && l.subGridDynamic) && !e.grid._isTemp) {
+        const p = c.areaIntercept(t.rect, f._rect), m = c.area(t.rect), y = c.area(f._rect);
+        p / (m < y ? m : y) > 0.8 && (f.grid.makeSubGrid(f.el, void 0, e), f = void 0);
       }
-      f ? d = !this._fixCollisions(e, r, f, t) : (d = !1, i && delete t.pack);
+      f ? a = !this._fixCollisions(e, r, f, t) : (a = !1, i && delete t.pack);
     }
-    return d && !c.samePos(e, r) && (e._dirty = !0, c.copyPos(e, r)), t.pack && this._packNodes()._notify(), !c.samePos(e, o);
+    return a && !c.samePos(e, r) && (e._dirty = !0, c.copyPos(e, r)), t.pack && this._packNodes()._notify(), !c.samePos(e, o);
   }
   getRow() {
     return this.nodes.reduce((e, t) => Math.max(e, t.y + t.h), 0);
@@ -1946,8 +1936,8 @@ class Q {
     var o;
     const i = (o = this._layouts) == null ? void 0 : o.length, s = i && this.column !== i - 1 ? this._layouts[i - 1] : null, r = [];
     return this.sortNodes(), this.nodes.forEach((n) => {
-      const d = s == null ? void 0 : s.find((a) => a._id === n._id), l = { ...n, ...d || {} };
-      c.removeInternalForSave(l, !e), t && t(n, l), r.push(l);
+      const a = s == null ? void 0 : s.find((l) => l._id === n._id), d = { ...n, ...a || {} };
+      c.removeInternalForSave(d, !e), t && t(n, d), r.push(d);
     }), r;
   }
   /** @internal called whenever a node is added or moved - updates the cached layouts */
@@ -1986,19 +1976,19 @@ class Q {
     s && this.sortNodes(1), t < e && this.cacheLayout(this.nodes, e), this.batchUpdate();
     let r = [], o = s ? this.nodes : c.sort(this.nodes, -1);
     if (t > e && this._layouts) {
-      const d = this._layouts[t] || [], l = this._layouts.length - 1;
-      !d.length && e !== l && ((n = this._layouts[l]) != null && n.length) && (e = l, this._layouts[l].forEach((a) => {
-        const h = o.find((f) => f._id === a._id);
-        h && (!s && !a.autoPosition && (h.x = a.x ?? h.x, h.y = a.y ?? h.y), h.w = a.w ?? h.w, (a.x == null || a.y === void 0) && (h.autoPosition = !0));
-      })), d.forEach((a) => {
-        const h = o.findIndex((f) => f._id === a._id);
+      const a = this._layouts[t] || [], d = this._layouts.length - 1;
+      !a.length && e !== d && ((n = this._layouts[d]) != null && n.length) && (e = d, this._layouts[d].forEach((l) => {
+        const h = o.find((f) => f._id === l._id);
+        h && (!s && !l.autoPosition && (h.x = l.x ?? h.x, h.y = l.y ?? h.y), h.w = l.w ?? h.w, (l.x == null || l.y === void 0) && (h.autoPosition = !0));
+      })), a.forEach((l) => {
+        const h = o.findIndex((f) => f._id === l._id);
         if (h !== -1) {
           const f = o[h];
           if (s) {
-            f.w = a.w;
+            f.w = l.w;
             return;
           }
-          (a.autoPosition || isNaN(a.x) || isNaN(a.y)) && this.findEmptyPosition(a, r), a.autoPosition || (f.x = a.x ?? f.x, f.y = a.y ?? f.y, f.w = a.w ?? f.w, r.push(f)), o.splice(h, 1);
+          (l.autoPosition || isNaN(l.x) || isNaN(l.y)) && this.findEmptyPosition(l, r), l.autoPosition || (f.x = l.x ?? f.x, f.y = l.y ?? f.y, f.w = l.w ?? f.w, r.push(f)), o.splice(h, 1);
         }
       });
     }
@@ -2009,16 +1999,16 @@ class Q {
         if (typeof i == "function")
           i(t, e, r, o);
         else {
-          const d = s || i === "none" ? 1 : t / e, l = i === "move" || i === "moveScale", a = i === "scale" || i === "moveScale";
+          const a = s || i === "none" ? 1 : t / e, d = i === "move" || i === "moveScale", l = i === "scale" || i === "moveScale";
           o.forEach((h) => {
-            h.x = t === 1 ? 0 : l ? Math.round(h.x * d) : Math.min(h.x, t - 1), h.w = t === 1 || e === 1 ? 1 : a ? Math.round(h.w * d) || 1 : Math.min(h.w, t), r.push(h);
+            h.x = t === 1 ? 0 : d ? Math.round(h.x * a) : Math.min(h.x, t - 1), h.w = t === 1 || e === 1 ? 1 : l ? Math.round(h.w * a) || 1 : Math.min(h.w, t), r.push(h);
           }), o = [];
         }
-      r = c.sort(r, -1), this._inColumnResize = !0, this.nodes = [], r.forEach((d) => {
-        this.addNode(d, !1), delete d._orig;
+      r = c.sort(r, -1), this._inColumnResize = !0, this.nodes = [], r.forEach((a) => {
+        this.addNode(a, !1), delete a._orig;
       });
     }
-    return this.nodes.forEach((d) => delete d._orig), this.batchUpdate(!1, !s), delete this._inColumnResize, this;
+    return this.nodes.forEach((a) => delete a._orig), this.batchUpdate(!1, !s), delete this._inColumnResize, this;
   }
   /**
    * call to cache the given layout internally to the given location so we can restore back when column changes size
@@ -2030,7 +2020,7 @@ class Q {
     const s = [];
     return e.forEach((r, o) => {
       if (r._id === void 0) {
-        const n = r.id ? this.nodes.find((d) => d.id === r.id) : void 0;
+        const n = r.id ? this.nodes.find((a) => a.id === r.id) : void 0;
         r._id = (n == null ? void 0 : n._id) ?? Q._idSeq++;
       }
       s[o] = { x: r.x, y: r.y, w: r.w, _id: r._id };
@@ -2067,7 +2057,7 @@ class Q {
   }
 }
 Q._idSeq = 0;
-const F = {
+const G = {
   alwaysShowResizeHandle: "mobile",
   animate: !0,
   auto: !0,
@@ -2097,12 +2087,12 @@ const F = {
   // styleInHead: false,
   //removable
 };
-class w {
+class b {
 }
 const j = typeof window < "u" && typeof document < "u" && ("ontouchstart" in document || "ontouchstart" in window || window.DocumentTouch && document instanceof window.DocumentTouch || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0);
 class J {
 }
-function ke(u, e) {
+function Se(u, e) {
   if (u.touches.length > 1)
     return;
   u.cancelable && u.preventDefault();
@@ -2176,46 +2166,46 @@ function Ht(u, e) {
     // relatedTarget
   ), u.target.dispatchEvent(t);
 }
-function Ne(u) {
-  J.touchHandled || (J.touchHandled = !0, ke(u, "mousedown"));
+function ke(u) {
+  J.touchHandled || (J.touchHandled = !0, Se(u, "mousedown"));
 }
-function Ae(u) {
-  J.touchHandled && ke(u, "mousemove");
+function Ne(u) {
+  J.touchHandled && Se(u, "mousemove");
 }
 function He(u) {
   if (!J.touchHandled)
     return;
   J.pointerLeaveTimeout && (window.clearTimeout(J.pointerLeaveTimeout), delete J.pointerLeaveTimeout);
-  const e = !!w.dragElement;
-  ke(u, "mouseup"), e || ke(u, "click"), J.touchHandled = !1;
+  const e = !!b.dragElement;
+  Se(u, "mouseup"), e || Se(u, "click"), J.touchHandled = !1;
 }
-function Oe(u) {
+function Ae(u) {
   u.pointerType !== "mouse" && u.target.releasePointerCapture(u.pointerId);
 }
-function ct(u) {
-  w.dragElement && u.pointerType !== "mouse" && Ht(u, "mouseenter");
+function ut(u) {
+  b.dragElement && u.pointerType !== "mouse" && Ht(u, "mouseenter");
 }
-function ft(u) {
-  w.dragElement && u.pointerType !== "mouse" && (J.pointerLeaveTimeout = window.setTimeout(() => {
+function ct(u) {
+  b.dragElement && u.pointerType !== "mouse" && (J.pointerLeaveTimeout = window.setTimeout(() => {
     delete J.pointerLeaveTimeout, Ht(u, "mouseleave");
   }, 10));
 }
-class Pe {
+class Me {
   constructor(e, t, i) {
     this.host = e, this.dir = t, this.option = i, this.moving = !1, this._mouseDown = this._mouseDown.bind(this), this._mouseMove = this._mouseMove.bind(this), this._mouseUp = this._mouseUp.bind(this), this._keyEvent = this._keyEvent.bind(this), this._init();
   }
   /** @internal */
   _init() {
     const e = this.el = document.createElement("div");
-    return e.classList.add("ui-resizable-handle"), e.classList.add(`${Pe.prefix}${this.dir}`), e.style.zIndex = "100", e.style.userSelect = "none", this.host.appendChild(this.el), this.el.addEventListener("mousedown", this._mouseDown), j && (this.el.addEventListener("touchstart", Ne), this.el.addEventListener("pointerdown", Oe)), this;
+    return e.classList.add("ui-resizable-handle"), e.classList.add(`${Me.prefix}${this.dir}`), e.style.zIndex = "100", e.style.userSelect = "none", this.host.appendChild(this.el), this.el.addEventListener("mousedown", this._mouseDown), j && (this.el.addEventListener("touchstart", ke), this.el.addEventListener("pointerdown", Ae)), this;
   }
   /** call this when resize handle needs to be removed and cleaned up */
   destroy() {
-    return this.moving && this._mouseUp(this.mouseDownEvent), this.el.removeEventListener("mousedown", this._mouseDown), j && (this.el.removeEventListener("touchstart", Ne), this.el.removeEventListener("pointerdown", Oe)), this.host.removeChild(this.el), delete this.el, delete this.host, this;
+    return this.moving && this._mouseUp(this.mouseDownEvent), this.el.removeEventListener("mousedown", this._mouseDown), j && (this.el.removeEventListener("touchstart", ke), this.el.removeEventListener("pointerdown", Ae)), this.host.removeChild(this.el), delete this.el, delete this.host, this;
   }
   /** @internal called on mouse down on us: capture move on the entire document (mouse might not stay on us) until we release the mouse */
   _mouseDown(e) {
-    this.mouseDownEvent = e, document.addEventListener("mousemove", this._mouseMove, { capture: !0, passive: !0 }), document.addEventListener("mouseup", this._mouseUp, !0), j && (this.el.addEventListener("touchmove", Ae), this.el.addEventListener("touchend", He)), e.stopPropagation(), e.preventDefault();
+    this.mouseDownEvent = e, document.addEventListener("mousemove", this._mouseMove, { capture: !0, passive: !0 }), document.addEventListener("mouseup", this._mouseUp, !0), j && (this.el.addEventListener("touchmove", Ne), this.el.addEventListener("touchend", He)), e.stopPropagation(), e.preventDefault();
   }
   /** @internal */
   _mouseMove(e) {
@@ -2224,7 +2214,7 @@ class Pe {
   }
   /** @internal */
   _mouseUp(e) {
-    this.moving && (this._triggerEvent("stop", e), document.removeEventListener("keydown", this._keyEvent)), document.removeEventListener("mousemove", this._mouseMove, !0), document.removeEventListener("mouseup", this._mouseUp, !0), j && (this.el.removeEventListener("touchmove", Ae), this.el.removeEventListener("touchend", He)), delete this.moving, delete this.mouseDownEvent, e.stopPropagation(), e.preventDefault();
+    this.moving && (this._triggerEvent("stop", e), document.removeEventListener("keydown", this._keyEvent)), document.removeEventListener("mousemove", this._mouseMove, !0), document.removeEventListener("mouseup", this._mouseUp, !0), j && (this.el.removeEventListener("touchmove", Ne), this.el.removeEventListener("touchend", He)), delete this.moving, delete this.mouseDownEvent, e.stopPropagation(), e.preventDefault();
   }
   /** @internal call when keys are being pressed - use Esc to cancel */
   _keyEvent(e) {
@@ -2236,8 +2226,8 @@ class Pe {
     return this.option[e] && this.option[e](t), this;
   }
 }
-Pe.prefix = "ui-resizable-";
-class je {
+Me.prefix = "ui-resizable-";
+class Xe {
   constructor() {
     this._eventRegister = {};
   }
@@ -2265,7 +2255,7 @@ class je {
       return this._eventRegister[e](t);
   }
 }
-class be extends je {
+class _e extends Xe {
   // have to be public else complains for HTMLElementExtendOpt ?
   constructor(e, t = {}) {
     super(), this.el = e, this.option = t, this.rectScale = { x: 1, y: 1 }, this._ui = () => {
@@ -2321,21 +2311,21 @@ class be extends je {
   }
   /** @internal turns auto hide on/off */
   _setupAutoHide(e) {
-    return e ? (this.el.classList.add("ui-resizable-autohide"), this.el.addEventListener("mouseover", this._mouseOver), this.el.addEventListener("mouseout", this._mouseOut)) : (this.el.classList.remove("ui-resizable-autohide"), this.el.removeEventListener("mouseover", this._mouseOver), this.el.removeEventListener("mouseout", this._mouseOut), w.overResizeElement === this && delete w.overResizeElement), this;
+    return e ? (this.el.classList.add("ui-resizable-autohide"), this.el.addEventListener("mouseover", this._mouseOver), this.el.addEventListener("mouseout", this._mouseOut)) : (this.el.classList.remove("ui-resizable-autohide"), this.el.removeEventListener("mouseover", this._mouseOver), this.el.removeEventListener("mouseout", this._mouseOut), b.overResizeElement === this && delete b.overResizeElement), this;
   }
   /** @internal */
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   _mouseOver(e) {
-    w.overResizeElement || w.dragElement || (w.overResizeElement = this, this.el.classList.remove("ui-resizable-autohide"));
+    b.overResizeElement || b.dragElement || (b.overResizeElement = this, this.el.classList.remove("ui-resizable-autohide"));
   }
   /** @internal */
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   _mouseOut(e) {
-    w.overResizeElement === this && (delete w.overResizeElement, this.el.classList.add("ui-resizable-autohide"));
+    b.overResizeElement === this && (delete b.overResizeElement, this.el.classList.add("ui-resizable-autohide"));
   }
   /** @internal */
   _setupHandlers() {
-    return this.handlers = this.option.handles.split(",").map((e) => e.trim()).map((e) => new Pe(this.el, e, {
+    return this.handlers = this.option.handles.split(",").map((e) => e.trim()).map((e) => new Me(this.el, e, {
       start: (t) => {
         this._resizeStart(t);
       },
@@ -2366,7 +2356,7 @@ class be extends je {
   }
   /** @internal */
   _setupHelper() {
-    this.elOriginStyleVal = be._originStyleProp.map((i) => this.el.style[i]), this.parentOriginStylePosition = this.el.parentElement.style.position;
+    this.elOriginStyleVal = _e._originStyleProp.map((i) => this.el.style[i]), this.parentOriginStylePosition = this.el.parentElement.style.position;
     const e = this.el.parentElement, t = c.getValuesFromTransformedElement(e);
     return this.rectScale = {
       x: t.xScale,
@@ -2375,7 +2365,7 @@ class be extends je {
   }
   /** @internal */
   _cleanHelper() {
-    return be._originStyleProp.forEach((e, t) => {
+    return _e._originStyleProp.forEach((e, t) => {
       this.el.style[e] = this.elOriginStyleVal[t] || null;
     }), this.el.parentElement.style.position = this.parentOriginStylePosition || null, this;
   }
@@ -2387,15 +2377,15 @@ class be extends je {
       left: this.originalRect.left,
       top: this.originalRect.top - this.scrolled
     }, r = e.clientX - i.clientX, o = this.sizeToContent ? 0 : e.clientY - i.clientY;
-    let n, d;
-    t.indexOf("e") > -1 ? s.width += r : t.indexOf("w") > -1 && (s.width -= r, s.left += r, n = !0), t.indexOf("s") > -1 ? s.height += o : t.indexOf("n") > -1 && (s.height -= o, s.top += o, d = !0);
-    const l = this._constrainSize(s.width, s.height, n, d);
-    return Math.round(s.width) !== Math.round(l.width) && (t.indexOf("w") > -1 && (s.left += s.width - l.width), s.width = l.width), Math.round(s.height) !== Math.round(l.height) && (t.indexOf("n") > -1 && (s.top += s.height - l.height), s.height = l.height), s;
+    let n, a;
+    t.indexOf("e") > -1 ? s.width += r : t.indexOf("w") > -1 && (s.width -= r, s.left += r, n = !0), t.indexOf("s") > -1 ? s.height += o : t.indexOf("n") > -1 && (s.height -= o, s.top += o, a = !0);
+    const d = this._constrainSize(s.width, s.height, n, a);
+    return Math.round(s.width) !== Math.round(d.width) && (t.indexOf("w") > -1 && (s.left += s.width - d.width), s.width = d.width), Math.round(s.height) !== Math.round(d.height) && (t.indexOf("n") > -1 && (s.top += s.height - d.height), s.height = d.height), s;
   }
   /** @internal constrain the size to the set min/max values */
   _constrainSize(e, t, i, s) {
-    const r = this.option, o = (i ? r.maxWidthMoveLeft : r.maxWidth) || Number.MAX_SAFE_INTEGER, n = r.minWidth / this.rectScale.x || e, d = (s ? r.maxHeightMoveUp : r.maxHeight) || Number.MAX_SAFE_INTEGER, l = r.minHeight / this.rectScale.y || t, a = Math.min(o, Math.max(n, e)), h = Math.min(d, Math.max(l, t));
-    return { width: a, height: h };
+    const r = this.option, o = (i ? r.maxWidthMoveLeft : r.maxWidth) || Number.MAX_SAFE_INTEGER, n = r.minWidth / this.rectScale.x || e, a = (s ? r.maxHeightMoveUp : r.maxHeight) || Number.MAX_SAFE_INTEGER, d = r.minHeight / this.rectScale.y || t, l = Math.min(o, Math.max(n, e)), h = Math.min(a, Math.max(d, t));
+    return { width: l, height: h };
   }
   /** @internal */
   _applyChange() {
@@ -2414,9 +2404,9 @@ class be extends je {
     return this.handlers.forEach((e) => e.destroy()), delete this.handlers, this;
   }
 }
-be._originStyleProp = ["width", "height", "position", "left", "top", "opacity", "zIndex"];
-const Wi = 'input,textarea,button,select,option,[contenteditable="true"],.ui-resizable-handle';
-class we extends je {
+_e._originStyleProp = ["width", "height", "position", "left", "top", "opacity", "zIndex"];
+const Gi = 'input,textarea,button,select,option,[contenteditable="true"],.ui-resizable-handle';
+class we extends Xe {
   constructor(e, t = {}) {
     var r;
     super(), this.el = e, this.option = t, this.dragTransform = {
@@ -2436,12 +2426,12 @@ class we extends je {
   }
   enable() {
     this.disabled !== !1 && (super.enable(), this.dragEls.forEach((e) => {
-      e.addEventListener("mousedown", this._mouseDown), j && (e.addEventListener("touchstart", Ne), e.addEventListener("pointerdown", Oe));
+      e.addEventListener("mousedown", this._mouseDown), j && (e.addEventListener("touchstart", ke), e.addEventListener("pointerdown", Ae));
     }), this.el.classList.remove("ui-draggable-disabled"));
   }
   disable(e = !1) {
     this.disabled !== !0 && (super.disable(), this.dragEls.forEach((t) => {
-      t.removeEventListener("mousedown", this._mouseDown), j && (t.removeEventListener("touchstart", Ne), t.removeEventListener("pointerdown", Oe));
+      t.removeEventListener("mousedown", this._mouseDown), j && (t.removeEventListener("touchstart", ke), t.removeEventListener("pointerdown", Ae));
     }), e || this.el.classList.add("ui-draggable-disabled"));
   }
   destroy() {
@@ -2452,8 +2442,8 @@ class we extends je {
   }
   /** @internal call when mouse goes down before a dragstart happens */
   _mouseDown(e) {
-    if (!w.mouseHandled)
-      return e.button !== 0 || !this.dragEls.find((t) => t === e.target) && e.target.closest(Wi) || this.option.cancel && e.target.closest(this.option.cancel) || (this.mouseDownEvent = e, delete this.dragging, delete w.dragElement, delete w.dropElement, document.addEventListener("mousemove", this._mouseMove, { capture: !0, passive: !0 }), document.addEventListener("mouseup", this._mouseUp, !0), j && (e.currentTarget.addEventListener("touchmove", Ae), e.currentTarget.addEventListener("touchend", He)), e.preventDefault(), document.activeElement && document.activeElement.blur(), w.mouseHandled = !0), !0;
+    if (!b.mouseHandled)
+      return e.button !== 0 || !this.dragEls.find((t) => t === e.target) && e.target.closest(Gi) || this.option.cancel && e.target.closest(this.option.cancel) || (this.mouseDownEvent = e, delete this.dragging, delete b.dragElement, delete b.dropElement, document.addEventListener("mousemove", this._mouseMove, { capture: !0, passive: !0 }), document.addEventListener("mouseup", this._mouseUp, !0), j && (e.currentTarget.addEventListener("touchmove", Ne), e.currentTarget.addEventListener("touchend", He)), e.preventDefault(), document.activeElement && document.activeElement.blur(), b.mouseHandled = !0), !0;
   }
   /** @internal method to call actual drag event */
   _callDrag(e) {
@@ -2467,15 +2457,15 @@ class we extends je {
     var i;
     const t = this.mouseDownEvent;
     if (this.lastDrag = e, this.dragging)
-      if (this._dragFollow(e), w.pauseDrag) {
-        const s = Number.isInteger(w.pauseDrag) ? w.pauseDrag : 100;
+      if (this._dragFollow(e), b.pauseDrag) {
+        const s = Number.isInteger(b.pauseDrag) ? b.pauseDrag : 100;
         this.dragTimeout && window.clearTimeout(this.dragTimeout), this.dragTimeout = window.setTimeout(() => this._callDrag(e), s);
       } else
         this._callDrag(e);
     else if (Math.abs(e.x - t.x) + Math.abs(e.y - t.y) > 3) {
-      this.dragging = !0, w.dragElement = this;
+      this.dragging = !0, b.dragElement = this;
       const s = (i = this.el.gridstackNode) == null ? void 0 : i.grid;
-      s ? w.dropElement = s.el.ddElement.ddDroppable : delete w.dropElement, this.helper = this._createHelper(), this._setupHelperContainmentStyle(), this.dragTransform = c.getValuesFromTransformedElement(this.helperContainment), this.dragOffset = this._getDragOffset(e, this.el, this.helperContainment), this._setupHelperStyle(e);
+      s ? b.dropElement = s.el.ddElement.ddDroppable : delete b.dropElement, this.helper = this._createHelper(), this._setupHelperContainmentStyle(), this.dragTransform = c.getValuesFromTransformedElement(this.helperContainment), this.dragOffset = this._getDragOffset(e, this.el, this.helperContainment), this._setupHelperStyle(e);
       const r = c.initEvent(e, { target: this.el, type: "dragstart" });
       this.option.start && this.option.start(r, this.ui()), this.triggerEvent("dragstart", r), document.addEventListener("keydown", this._keyEvent);
     }
@@ -2484,17 +2474,17 @@ class we extends je {
   /** @internal call when the mouse gets released to drop the item at current location */
   _mouseUp(e) {
     var t, i;
-    if (document.removeEventListener("mousemove", this._mouseMove, !0), document.removeEventListener("mouseup", this._mouseUp, !0), j && e.currentTarget && (e.currentTarget.removeEventListener("touchmove", Ae, !0), e.currentTarget.removeEventListener("touchend", He, !0)), this.dragging) {
-      delete this.dragging, (t = this.el.gridstackNode) == null || delete t._origRotate, document.removeEventListener("keydown", this._keyEvent), ((i = w.dropElement) == null ? void 0 : i.el) === this.el.parentElement && delete w.dropElement, this.helperContainment.style.position = this.parentOriginStylePosition || null, this.helper !== this.el && this.helper.remove(), this._removeHelperStyle();
+    if (document.removeEventListener("mousemove", this._mouseMove, !0), document.removeEventListener("mouseup", this._mouseUp, !0), j && e.currentTarget && (e.currentTarget.removeEventListener("touchmove", Ne, !0), e.currentTarget.removeEventListener("touchend", He, !0)), this.dragging) {
+      delete this.dragging, (t = this.el.gridstackNode) == null || delete t._origRotate, document.removeEventListener("keydown", this._keyEvent), ((i = b.dropElement) == null ? void 0 : i.el) === this.el.parentElement && delete b.dropElement, this.helperContainment.style.position = this.parentOriginStylePosition || null, this.helper !== this.el && this.helper.remove(), this._removeHelperStyle();
       const s = c.initEvent(e, { target: this.el, type: "dragstop" });
-      this.option.stop && this.option.stop(s), this.triggerEvent("dragstop", s), w.dropElement && w.dropElement.drop(e);
+      this.option.stop && this.option.stop(s), this.triggerEvent("dragstop", s), b.dropElement && b.dropElement.drop(e);
     }
-    delete this.helper, delete this.mouseDownEvent, delete w.dragElement, delete w.dropElement, delete w.mouseHandled, e.preventDefault();
+    delete this.helper, delete this.mouseDownEvent, delete b.dragElement, delete b.dropElement, delete b.mouseHandled, e.preventDefault();
   }
   /** @internal call when keys are being pressed - use Esc to cancel, R to rotate */
   _keyEvent(e) {
     var s, r;
-    const t = this.el.gridstackNode, i = (t == null ? void 0 : t.grid) || ((r = (s = w.dropElement) == null ? void 0 : s.el) == null ? void 0 : r.gridstack);
+    const t = this.el.gridstackNode, i = (t == null ? void 0 : t.grid) || ((r = (s = b.dropElement) == null ? void 0 : s.el) == null ? void 0 : r.gridstack);
     if (e.key === "Escape")
       t && t._origRotate && (t._orig = t._origRotate, delete t._origRotate), i == null || i.cancelDrag(), this._mouseUp(this.mouseDownEvent);
     else if (t && i && (e.key === "r" || e.key === "R")) {
@@ -2566,7 +2556,7 @@ class we extends je {
   }
 }
 we.originStyleProp = ["width", "height", "transform", "transform-origin", "transition", "pointerEvents", "position", "left", "top", "minWidth", "willChange"];
-class Ki extends je {
+class Fi extends Xe {
   constructor(e, t = {}) {
     super(), this.el = e, this.option = t, this._mouseEnter = this._mouseEnter.bind(this), this._mouseLeave = this._mouseLeave.bind(this), this.enable(), this._setupAccept();
   }
@@ -2577,10 +2567,10 @@ class Ki extends je {
     super.off(e);
   }
   enable() {
-    this.disabled !== !1 && (super.enable(), this.el.classList.add("ui-droppable"), this.el.classList.remove("ui-droppable-disabled"), this.el.addEventListener("mouseenter", this._mouseEnter), this.el.addEventListener("mouseleave", this._mouseLeave), j && (this.el.addEventListener("pointerenter", ct), this.el.addEventListener("pointerleave", ft)));
+    this.disabled !== !1 && (super.enable(), this.el.classList.add("ui-droppable"), this.el.classList.remove("ui-droppable-disabled"), this.el.addEventListener("mouseenter", this._mouseEnter), this.el.addEventListener("mouseleave", this._mouseLeave), j && (this.el.addEventListener("pointerenter", ut), this.el.addEventListener("pointerleave", ct)));
   }
   disable(e = !1) {
-    this.disabled !== !0 && (super.disable(), this.el.classList.remove("ui-droppable"), e || this.el.classList.add("ui-droppable-disabled"), this.el.removeEventListener("mouseenter", this._mouseEnter), this.el.removeEventListener("mouseleave", this._mouseLeave), j && (this.el.removeEventListener("pointerenter", ct), this.el.removeEventListener("pointerleave", ft)));
+    this.disabled !== !0 && (super.disable(), this.el.classList.remove("ui-droppable"), e || this.el.classList.add("ui-droppable-disabled"), this.el.removeEventListener("mouseenter", this._mouseEnter), this.el.removeEventListener("mouseleave", this._mouseLeave), j && (this.el.removeEventListener("pointerenter", ut), this.el.removeEventListener("pointerleave", ct)));
   }
   destroy() {
     this.disable(!0), this.el.classList.remove("ui-droppable"), this.el.classList.remove("ui-droppable-disabled"), super.destroy();
@@ -2590,20 +2580,20 @@ class Ki extends je {
   }
   /** @internal called when the cursor enters our area - prepare for a possible drop and track leaving */
   _mouseEnter(e) {
-    if (!w.dragElement || !this._canDrop(w.dragElement.el))
+    if (!b.dragElement || !this._canDrop(b.dragElement.el))
       return;
-    e.preventDefault(), e.stopPropagation(), w.dropElement && w.dropElement !== this && w.dropElement._mouseLeave(e, !0), w.dropElement = this;
+    e.preventDefault(), e.stopPropagation(), b.dropElement && b.dropElement !== this && b.dropElement._mouseLeave(e, !0), b.dropElement = this;
     const t = c.initEvent(e, { target: this.el, type: "dropover" });
-    this.option.over && this.option.over(t, this._ui(w.dragElement)), this.triggerEvent("dropover", t), this.el.classList.add("ui-droppable-over");
+    this.option.over && this.option.over(t, this._ui(b.dragElement)), this.triggerEvent("dropover", t), this.el.classList.add("ui-droppable-over");
   }
   /** @internal called when the item is leaving our area, stop tracking if we had moving item */
   _mouseLeave(e, t = !1) {
     var s;
-    if (!w.dragElement || w.dropElement !== this)
+    if (!b.dragElement || b.dropElement !== this)
       return;
     e.preventDefault(), e.stopPropagation();
     const i = c.initEvent(e, { target: this.el, type: "dropout" });
-    if (this.option.out && this.option.out(i, this._ui(w.dragElement)), this.triggerEvent("dropout", i), w.dropElement === this && (delete w.dropElement, !t)) {
+    if (this.option.out && this.option.out(i, this._ui(b.dragElement)), this.triggerEvent("dropout", i), b.dropElement === this && (delete b.dropElement, !t)) {
       let r, o = this.el.parentElement;
       for (; !r && o; )
         r = (s = o.ddElement) == null ? void 0 : s.ddDroppable, o = o.parentElement;
@@ -2614,7 +2604,7 @@ class Ki extends je {
   drop(e) {
     e.preventDefault();
     const t = c.initEvent(e, { target: this.el, type: "drop" });
-    this.option.drop && this.option.drop(t, this._ui(w.dragElement)), this.triggerEvent("drop", t);
+    this.option.drop && this.option.drop(t, this._ui(b.dragElement)), this.triggerEvent("drop", t);
   }
   /** @internal true if element matches the string/method accept option */
   _canDrop(e) {
@@ -2632,9 +2622,9 @@ class Ki extends je {
     };
   }
 }
-class Qe {
+class je {
   static init(e) {
-    return e.ddElement || (e.ddElement = new Qe(e)), e.ddElement;
+    return e.ddElement || (e.ddElement = new je(e)), e.ddElement;
   }
   constructor(e) {
     this.el = e;
@@ -2652,19 +2642,19 @@ class Qe {
     return this.ddDraggable && (this.ddDraggable.destroy(), delete this.ddDraggable), this;
   }
   setupResizable(e) {
-    return this.ddResizable ? this.ddResizable.updateOption(e) : this.ddResizable = new be(this.el, e), this;
+    return this.ddResizable ? this.ddResizable.updateOption(e) : this.ddResizable = new _e(this.el, e), this;
   }
   cleanResizable() {
     return this.ddResizable && (this.ddResizable.destroy(), delete this.ddResizable), this;
   }
   setupDroppable(e) {
-    return this.ddDroppable ? this.ddDroppable.updateOption(e) : this.ddDroppable = new Ki(this.el, e), this;
+    return this.ddDroppable ? this.ddDroppable.updateOption(e) : this.ddDroppable = new Fi(this.el, e), this;
   }
   cleanDroppable() {
     return this.ddDroppable && (this.ddDroppable.destroy(), delete this.ddDroppable), this;
   }
 }
-class Vi {
+class Wi {
   resizable(e, t, i, s) {
     return this._getDDElements(e).forEach((r) => {
       if (t === "disable" || t === "enable")
@@ -2675,13 +2665,13 @@ class Vi {
         r.setupResizable({ [i]: s });
       else {
         const n = r.el.gridstackNode.grid;
-        let d = r.el.getAttribute("gs-resize-handles") || n.opts.resizable.handles || "e,s,se";
-        d === "all" && (d = "n,e,s,w,se,sw,ne,nw");
-        const l = !n.opts.alwaysShowResizeHandle;
+        let a = r.el.getAttribute("gs-resize-handles") || n.opts.resizable.handles || "e,s,se";
+        a === "all" && (a = "n,e,s,w,se,sw,ne,nw");
+        const d = !n.opts.alwaysShowResizeHandle;
         r.setupResizable({
           ...n.opts.resizable,
-          handles: d,
-          autoHide: l,
+          handles: a,
+          autoHide: d,
           start: t.start,
           stop: t.stop,
           resize: t.resize
@@ -2734,7 +2724,7 @@ class Vi {
   }
   on(e, t, i) {
     return this._getDDElements(e).forEach((s) => s.on(t, (r) => {
-      i(r, w.dragElement ? w.dragElement.el : r.target, w.dragElement ? w.dragElement.helper : null);
+      i(r, b.dragElement ? b.dragElement.el : r.target, b.dragElement ? b.dragElement.helper : null);
     })), this;
   }
   off(e, t) {
@@ -2745,7 +2735,7 @@ class Vi {
     const i = c.getElements(e);
     if (!i.length)
       return [];
-    const s = i.map((r) => r.ddElement || (t ? Qe.init(r) : null));
+    const s = i.map((r) => r.ddElement || (t ? je.init(r) : null));
     return t || s.filter((r) => r), s;
   }
 }
@@ -2756,7 +2746,7 @@ class Vi {
  * Copyright (c) 2021-2024  Alain Dumesny
  * see root license https://github.com/gridstack/gridstack.js/tree/master/LICENSE
  */
-const I = new Vi();
+const I = new Wi();
 class _ {
   /**
    * initializing the HTML element, or selector string, into a grid will return the grid. Calling it again will
@@ -2821,7 +2811,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   /** @internal create placeholder DIV as needed */
   get placeholder() {
     if (!this._placeholder) {
-      this._placeholder = c.createDiv([this.opts.placeholderClass, F.itemClass, this.opts.itemClass]);
+      this._placeholder = c.createDiv([this.opts.placeholderClass, G.itemClass, this.opts.itemClass]);
       const e = c.createDiv(["placeholder-content"], this._placeholder);
       this.opts.placeholderText && (e.textContent = this.opts.placeholderText);
     }
@@ -2833,7 +2823,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * @param opts grid options - public for classes to access, but use methods to modify!
    */
   constructor(e, t = {}) {
-    var h, f, g;
+    var h, f, p;
     this.el = e, this.opts = t, this.animationDelay = 310, this._gsEventHandler = {}, this._extraDragRow = 0, this.dragTransform = { xScale: 1, yScale: 1, xOffset: 0, yOffset: 0 }, e.gridstack = this, this.opts = t = t || {}, e.classList.contains("grid-stack") || this.el.classList.add("grid-stack"), t.row && (t.minRow = t.maxRow = t.row, delete t.row);
     const i = c.toNumber(e.getAttribute("gs-row"));
     t.column === "auto" && delete t.column, t.alwaysShowResizeHandle !== void 0 && (t._alwaysShowResizeHandle = t.alwaysShowResizeHandle);
@@ -2842,48 +2832,48 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     if (r.oneColumnModeDomSort && (delete r.oneColumnModeDomSort, console.log("warning: Gridstack oneColumnModeDomSort no longer supported. Use GridStackOptions.columnOpts instead.")), r.oneColumnSize || r.disableOneColumnMode === !1) {
       const m = r.oneColumnSize || 768;
       delete r.oneColumnSize, delete r.disableOneColumnMode, t.columnOpts = t.columnOpts || {}, s = t.columnOpts.breakpoints = t.columnOpts.breakpoints || [];
-      let y = s.find((p) => p.c === 1);
+      let y = s.find((g) => g.c === 1);
       y ? y.w = m : (y = { c: 1, w: m }, s.push(y, { c: 12, w: m + 1 }));
     }
     const o = t.columnOpts;
     o && (!o.columnWidth && !((f = o.breakpoints) != null && f.length) ? (delete t.columnOpts, s = void 0) : o.columnMax = o.columnMax || 12), (s == null ? void 0 : s.length) > 1 && s.sort((m, y) => (y.w || 0) - (m.w || 0));
     const n = {
-      ...c.cloneDeep(F),
-      column: c.toNumber(e.getAttribute("gs-column")) || F.column,
-      minRow: i || c.toNumber(e.getAttribute("gs-min-row")) || F.minRow,
-      maxRow: i || c.toNumber(e.getAttribute("gs-max-row")) || F.maxRow,
-      staticGrid: c.toBool(e.getAttribute("gs-static")) || F.staticGrid,
+      ...c.cloneDeep(G),
+      column: c.toNumber(e.getAttribute("gs-column")) || G.column,
+      minRow: i || c.toNumber(e.getAttribute("gs-min-row")) || G.minRow,
+      maxRow: i || c.toNumber(e.getAttribute("gs-max-row")) || G.maxRow,
+      staticGrid: c.toBool(e.getAttribute("gs-static")) || G.staticGrid,
       sizeToContent: c.toBool(e.getAttribute("gs-size-to-content")) || void 0,
       draggable: {
-        handle: (t.handleClass ? "." + t.handleClass : t.handle ? t.handle : "") || F.draggable.handle
+        handle: (t.handleClass ? "." + t.handleClass : t.handle ? t.handle : "") || G.draggable.handle
       },
       removableOptions: {
-        accept: t.itemClass || F.removableOptions.accept,
-        decline: F.removableOptions.decline
+        accept: t.itemClass || G.removableOptions.accept,
+        decline: G.removableOptions.decline
       }
     };
     e.getAttribute("gs-animate") && (n.animate = c.toBool(e.getAttribute("gs-animate"))), t = c.defaults(t, n), this._initMargin(), this.checkDynamicColumn(), this.el.classList.add("gs-" + t.column), t.rtl === "auto" && (t.rtl = e.style.direction === "rtl"), t.rtl && this.el.classList.add("grid-stack-rtl");
-    const d = this.el.closest("." + F.itemClass), l = d == null ? void 0 : d.gridstackNode;
-    l && (l.subGrid = this, this.parentGridNode = l, this.el.classList.add("grid-stack-nested"), l.el.classList.add("grid-stack-sub-grid")), this._isAutoCellHeight = t.cellHeight === "auto", this._isAutoCellHeight || t.cellHeight === "initial" ? this.cellHeight(void 0, !1) : (typeof t.cellHeight == "number" && t.cellHeightUnit && t.cellHeightUnit !== F.cellHeightUnit && (t.cellHeight = t.cellHeight + t.cellHeightUnit, delete t.cellHeightUnit), this.cellHeight(t.cellHeight, !1)), t.alwaysShowResizeHandle === "mobile" && (t.alwaysShowResizeHandle = j), this._styleSheetClass = "gs-id-" + Q._idSeq++, this.el.classList.add(this._styleSheetClass), this._setStaticClass();
-    const a = t.engineClass || _.engineClass || Q;
-    if (this.engine = new a({
+    const a = this.el.closest("." + G.itemClass), d = a == null ? void 0 : a.gridstackNode;
+    d && (d.subGrid = this, this.parentGridNode = d, this.el.classList.add("grid-stack-nested"), d.el.classList.add("grid-stack-sub-grid")), this._isAutoCellHeight = t.cellHeight === "auto", this._isAutoCellHeight || t.cellHeight === "initial" ? this.cellHeight(void 0, !1) : (typeof t.cellHeight == "number" && t.cellHeightUnit && t.cellHeightUnit !== G.cellHeightUnit && (t.cellHeight = t.cellHeight + t.cellHeightUnit, delete t.cellHeightUnit), this.cellHeight(t.cellHeight, !1)), t.alwaysShowResizeHandle === "mobile" && (t.alwaysShowResizeHandle = j), this._styleSheetClass = "gs-id-" + Q._idSeq++, this.el.classList.add(this._styleSheetClass), this._setStaticClass();
+    const l = t.engineClass || _.engineClass || Q;
+    if (this.engine = new l({
       column: this.getColumn(),
       float: t.float,
       maxRow: t.maxRow,
       onChange: (m) => {
         let y = 0;
-        this.engine.nodes.forEach((p) => {
-          y = Math.max(y, p.y + p.h);
-        }), m.forEach((p) => {
-          const C = p.el;
-          C && (p._removeDOM ? (C && C.remove(), delete p._removeDOM) : this._writePosAttr(C, p));
+        this.engine.nodes.forEach((g) => {
+          y = Math.max(y, g.y + g.h);
+        }), m.forEach((g) => {
+          const R = g.el;
+          R && (g._removeDOM ? (R && R.remove(), delete g._removeDOM) : this._writePosAttr(R, g));
         }), this._updateStyles(!1, y);
       }
     }), this._updateStyles(!1, 0), t.auto && (this.batchUpdate(), this.engine._loading = !0, this.getGridItems().forEach((m) => this._prepareElement(m)), delete this.engine._loading, this.batchUpdate(!1)), t.children) {
       const m = t.children;
       delete t.children, m.length && this.load(m);
     }
-    this.setAnimation(), t.subGridDynamic && !w.pauseDrag && (w.pauseDrag = !0), ((g = t.draggable) == null ? void 0 : g.pause) !== void 0 && (w.pauseDrag = t.draggable.pause), this._setupRemoveDrop(), this._setupAcceptWidget(), this._updateResizeEvent();
+    this.setAnimation(), t.subGridDynamic && !b.pauseDrag && (b.pauseDrag = !0), ((p = t.draggable) == null ? void 0 : p.pause) !== void 0 && (b.pauseDrag = t.draggable.pause), this._setupRemoveDrop(), this._setupAcceptWidget(), this._updateResizeEvent();
   }
   /**
    * add a new widget and returns it.
@@ -2923,9 +2913,9 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * @returns newly created grid
    */
   makeSubGrid(e, t, i, s = !0) {
-    var g, m, y;
+    var p, m, y;
     let r = e.gridstackNode;
-    if (r || (r = this.makeWidget(e).gridstackNode), (g = r.subGrid) != null && g.el)
+    if (r || (r = this.makeWidget(e).gridstackNode), (p = r.subGrid) != null && p.el)
       return r.subGrid;
     let o, n = this;
     for (; n && !o; )
@@ -2942,15 +2932,15 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       ...o || {},
       ...t || r.subGridOpts || {}
     }), r.subGridOpts = t;
-    let d;
-    t.column === "auto" && (d = !0, t.column = Math.max(r.w || 1, (i == null ? void 0 : i.w) || 1), delete t.columnOpts);
-    let l = r.el.querySelector(".grid-stack-item-content"), a, h;
-    if (s && (this._removeDD(r.el), h = { ...r, x: 0, y: 0 }, c.removeInternalForSave(h), delete h.subGridOpts, r.content && (h.content = r.content, delete r.content), _.addRemoveCB ? a = _.addRemoveCB(this.el, h, !0, !1) : (a = c.createDiv(["grid-stack-item"]), a.appendChild(l), l = c.createDiv(["grid-stack-item-content"], r.el)), this._prepareDragDropByNode(r)), i) {
-      const p = d ? t.column : r.w, C = r.h + i.h, k = r.el.style;
-      k.transition = "none", this.update(r.el, { w: p, h: C }), setTimeout(() => k.transition = null);
+    let a;
+    t.column === "auto" && (a = !0, t.column = Math.max(r.w || 1, (i == null ? void 0 : i.w) || 1), delete t.columnOpts);
+    let d = r.el.querySelector(".grid-stack-item-content"), l, h;
+    if (s && (this._removeDD(r.el), h = { ...r, x: 0, y: 0 }, c.removeInternalForSave(h), delete h.subGridOpts, r.content && (h.content = r.content, delete r.content), _.addRemoveCB ? l = _.addRemoveCB(this.el, h, !0, !1) : (l = c.createDiv(["grid-stack-item"]), l.appendChild(d), d = c.createDiv(["grid-stack-item-content"], r.el)), this._prepareDragDropByNode(r)), i) {
+      const g = a ? t.column : r.w, R = r.h + i.h, S = r.el.style;
+      S.transition = "none", this.update(r.el, { w: g, h: R }), setTimeout(() => S.transition = null);
     }
-    const f = r.subGrid = _.addGrid(l, t);
-    return i != null && i._moving && (f._isTemp = !0), d && (f._autoColumn = !0), s && f.makeWidget(a, h), i && (i._moving ? window.setTimeout(() => c.simulateMouseEvent(i._event, "mouseenter", f.el), 0) : f.makeWidget(r.el, r)), this.resizeToContentCheck(!1, r), f;
+    const f = r.subGrid = _.addGrid(d, t);
+    return i != null && i._moving && (f._isTemp = !0), a && (f._autoColumn = !0), s && f.makeWidget(l, h), i && (i._moving ? window.setTimeout(() => c.simulateMouseEvent(i._event, "mouseenter", f.el), 0) : f.makeWidget(r.el, r)), this.resizeToContentCheck(!1, r), f;
   }
   /**
    * called when an item was converted into a nested grid to accommodate a dragged over item, but then item leaves - return back
@@ -2988,7 +2978,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       const r = c.cloneDeep(this.opts);
       r.marginBottom === r.marginTop && r.marginRight === r.marginLeft && r.marginTop === r.marginRight && (r.margin = r.marginTop, delete r.marginTop, delete r.marginRight, delete r.marginBottom, delete r.marginLeft), r.rtl === (this.el.style.direction === "rtl") && (r.rtl = "auto"), this._isAutoCellHeight && (r.cellHeight = "auto"), this._autoColumn && (r.column = "auto");
       const o = r._alwaysShowResizeHandle;
-      return delete r._alwaysShowResizeHandle, o !== void 0 ? r.alwaysShowResizeHandle = o : delete r.alwaysShowResizeHandle, c.removeInternalAndSame(r, F), r.children = s, r;
+      return delete r._alwaysShowResizeHandle, o !== void 0 ? r.alwaysShowResizeHandle = o : delete r.alwaysShowResizeHandle, c.removeInternalAndSame(r, G), r.children = s, r;
     }
     return s;
   }
@@ -3003,15 +2993,15 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * see http://gridstackjs.com/demo/serialization.html
    */
   load(e, t = _.addRemoveCB || !0) {
-    var l;
+    var d;
     e = c.cloneDeep(e);
     const i = this.getColumn();
-    e.forEach((a) => {
-      a.w = a.w || 1, a.h = a.h || 1;
+    e.forEach((l) => {
+      l.w = l.w || 1, l.h = l.h || 1;
     }), e = c.sort(e), this.engine.skipCacheUpdate = this._ignoreLayoutsNodeChange = !0;
     let s = 0;
-    e.forEach((a) => {
-      s = Math.max(s, (a.x || 0) + a.w);
+    e.forEach((l) => {
+      s = Math.max(s, (l.x || 0) + l.w);
     }), s > this.engine.defaultColumn && (this.engine.defaultColumn = s), s > i && this.engine.cacheLayout(e, s, !0);
     const r = _.addRemoveCB;
     typeof t == "function" && (_.addRemoveCB = t);
@@ -3023,17 +3013,17 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
         return;
       c.find(e, h.id) || (_.addRemoveCB && _.addRemoveCB(this.el, h, !1, !1), o.push(h), this.removeWidget(h.el, !0, !1));
     }), this.engine._loading = !0;
-    const d = [];
-    return this.engine.nodes = this.engine.nodes.filter((a) => c.find(e, a.id) ? (d.push(a), !1) : !0), e.forEach((a) => {
+    const a = [];
+    return this.engine.nodes = this.engine.nodes.filter((l) => c.find(e, l.id) ? (a.push(l), !1) : !0), e.forEach((l) => {
       var f;
-      const h = c.find(d, a.id);
+      const h = c.find(a, l.id);
       if (h) {
-        if (c.shouldSizeToContent(h) && (a.h = h.h), this.engine.nodeBoundFix(a), (a.autoPosition || a.x === void 0 || a.y === void 0) && (a.w = a.w || h.w, a.h = a.h || h.h, this.engine.findEmptyPosition(a)), this.engine.nodes.push(h), c.samePos(h, a) && this.engine.nodes.length > 1 && (this.moveNode(h, { ...a, forceCollide: !0 }), c.copyPos(a, h)), this.update(h.el, a), (f = a.subGridOpts) != null && f.children) {
-          const g = h.el.querySelector(".grid-stack");
-          g && g.gridstack && g.gridstack.load(a.subGridOpts.children);
+        if (c.shouldSizeToContent(h) && (l.h = h.h), this.engine.nodeBoundFix(l), (l.autoPosition || l.x === void 0 || l.y === void 0) && (l.w = l.w || h.w, l.h = l.h || h.h, this.engine.findEmptyPosition(l)), this.engine.nodes.push(h), c.samePos(h, l) && this.engine.nodes.length > 1 && (this.moveNode(h, { ...l, forceCollide: !0 }), c.copyPos(l, h)), this.update(h.el, l), (f = l.subGridOpts) != null && f.children) {
+          const p = h.el.querySelector(".grid-stack");
+          p && p.gridstack && p.gridstack.load(l.subGridOpts.children);
         }
-      } else t && this.addWidget(a);
-    }), delete this.engine._loading, this.engine.removedNodes = o, this.batchUpdate(!1), delete this._ignoreLayoutsNodeChange, delete this.engine.skipCacheUpdate, r ? _.addRemoveCB = r : delete _.addRemoveCB, n && ((l = this.opts) != null && l.animate) && this.setAnimation(this.opts.animate, !0), this;
+      } else t && this.addWidget(l);
+    }), delete this.engine._loading, this.engine.removedNodes = o, this.batchUpdate(!1), delete this._ignoreLayoutsNodeChange, delete this.engine.skipCacheUpdate, r ? _.addRemoveCB = r : delete _.addRemoveCB, n && ((d = this.opts) != null && d.animate) && this.setAnimation(this.opts.animate, !0), this;
   }
   /**
    * use before calling a bunch of `addWidget()` to prevent un-necessary relayouts in between (more efficient)
@@ -3113,7 +3103,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
         i = e.breakpoints[n++].c || t;
     }
     if (i !== t) {
-      const n = (o = e.breakpoints) == null ? void 0 : o.find((d) => d.c === i);
+      const n = (o = e.breakpoints) == null ? void 0 : o.find((a) => a.c === i);
       return this.column(i, (n == null ? void 0 : n.layout) || e.layout), !0;
     }
     return !1;
@@ -3191,8 +3181,8 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     const i = this.el.getBoundingClientRect();
     let s;
     t ? s = { top: i.top + document.documentElement.scrollTop, left: i.left } : s = { top: this.el.offsetTop, left: this.el.offsetLeft };
-    const r = e.left - s.left, o = e.top - s.top, n = i.width / this.getColumn(), d = i.height / parseInt(this.el.getAttribute("gs-current-row"));
-    return { x: Math.floor(r / n), y: Math.floor(o / d) };
+    const r = e.left - s.left, o = e.top - s.top, n = i.width / this.getColumn(), a = i.height / parseInt(this.el.getAttribute("gs-current-row"));
+    return { x: Math.floor(r / n), y: Math.floor(o / a) };
   }
   /** returns the current number of rows, which will be at least `minRow` if set */
   getRow() {
@@ -3310,7 +3300,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       return t = { x: i[s++], y: i[s++], w: i[s++], h: i[s++] }, this.update(e, t);
     }
     return _.getElements(e).forEach((i) => {
-      var a;
+      var l;
       const s = i == null ? void 0 : i.gridstackNode;
       if (!s)
         return;
@@ -3322,16 +3312,16 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
         n[h] = r[h] !== void 0 ? r[h] : s[h], delete r[h];
       })), !n && (r.minW || r.minH || r.maxW || r.maxH) && (n = {}), r.content !== void 0) {
         const h = i.querySelector(".grid-stack-item-content");
-        h && h.textContent !== r.content && (s.content = r.content, _.renderCB(h, r), (a = s.subGrid) != null && a.el && (h.appendChild(s.subGrid.el), s.subGrid.opts.styleInHead || s.subGrid._updateStyles(!0))), delete r.content;
+        h && h.textContent !== r.content && (s.content = r.content, _.renderCB(h, r), (l = s.subGrid) != null && l.el && (h.appendChild(s.subGrid.el), s.subGrid.opts.styleInHead || s.subGrid._updateStyles(!0))), delete r.content;
       }
-      let d = !1, l = !1;
+      let a = !1, d = !1;
       for (const h in r)
-        h[0] !== "_" && s[h] !== r[h] && (s[h] = r[h], d = !0, l = l || !this.opts.staticGrid && (h === "noResize" || h === "noMove" || h === "locked"));
+        h[0] !== "_" && s[h] !== r[h] && (s[h] = r[h], a = !0, d = d || !this.opts.staticGrid && (h === "noResize" || h === "noMove" || h === "locked"));
       if (c.sanitizeMinMax(s), n) {
         const h = n.w !== void 0 && n.w !== s.w;
         this.moveNode(s, n), h && s.subGrid ? s.subGrid.onResize(this.hasAnimationCSS() ? s.w : void 0) : this.resizeToContentCheck(h, s), delete s._orig;
       }
-      (n || d) && this._writeAttr(i, s), l && this._prepareDragDropByNode(s);
+      (n || a) && this._writeAttr(i, s), d && this._prepareDragDropByNode(s);
     }), this;
   }
   moveNode(e, t) {
@@ -3345,7 +3335,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * @param useNodeH set to true if GridStackNode.h should be used instead of actual container height when we don't need to wait for animation to finish to get actual DOM heights
    */
   resizeToContent(e) {
-    var f, g;
+    var f, p;
     if (!e || (e.classList.remove("size-to-content-max"), !e.clientHeight))
       return;
     const t = e.gridstackNode;
@@ -3360,14 +3350,14 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     let r = t.h ? t.h * s : e.clientHeight, o;
     if (t.resizeToContentParent && (o = e.querySelector(t.resizeToContentParent)), o || (o = e.querySelector(_.resizeToContentParent)), !o)
       return;
-    const n = e.clientHeight - o.clientHeight, d = t.h ? t.h * s - n : o.clientHeight;
-    let l;
+    const n = e.clientHeight - o.clientHeight, a = t.h ? t.h * s - n : o.clientHeight;
+    let d;
     if (t.subGrid) {
-      l = t.subGrid.getRow() * t.subGrid.getCellHeight(!0);
+      d = t.subGrid.getRow() * t.subGrid.getCellHeight(!0);
       const m = t.subGrid.el.getBoundingClientRect(), y = t.subGrid.el.parentElement.getBoundingClientRect();
-      l += m.top - y.top;
+      d += m.top - y.top;
     } else {
-      if ((g = (f = t.subGridOpts) == null ? void 0 : f.children) != null && g.length)
+      if ((p = (f = t.subGridOpts) == null ? void 0 : f.children) != null && p.length)
         return;
       {
         const m = o.firstElementChild;
@@ -3375,15 +3365,15 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
           console.error(`Error: GridStack.resizeToContent() widget id:${t.id} '${_.resizeToContentParent}'.firstElementChild is null, make sure to have a div like container. Skipping sizing.`);
           return;
         }
-        l = m.getBoundingClientRect().height || d;
+        d = m.getBoundingClientRect().height || a;
       }
     }
-    if (d === l)
+    if (a === d)
       return;
-    r += l - d;
-    let a = Math.ceil(r / s);
+    r += d - a;
+    let l = Math.ceil(r / s);
     const h = Number.isInteger(t.sizeToContent) ? t.sizeToContent : 0;
-    h && a > h && (a = h, e.classList.add("size-to-content-max")), t.minH && a < t.minH ? a = t.minH : t.maxH && a > t.maxH && (a = t.maxH), a !== t.h && (i._ignoreLayoutsNodeChange = !0, i.moveNode(t, { h: a }), delete i._ignoreLayoutsNodeChange);
+    h && l > h && (l = h, e.classList.add("size-to-content-max")), t.minH && l < t.minH ? l = t.minH : t.maxH && l > t.maxH && (l = t.maxH), l !== t.h && (i._ignoreLayoutsNodeChange = !0, i.moveNode(t, { h: l }), delete i._ignoreLayoutsNodeChange);
   }
   /** call the user resize (so they can do extra work) else our build in version */
   resizeToContentCBCheck(e) {
@@ -3400,8 +3390,8 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
         return;
       const r = { w: s.h, h: s.w, minH: s.minW, minW: s.minH, maxH: s.maxW, maxW: s.maxH };
       if (t) {
-        const n = t.left > 0 ? Math.floor(t.left / this.cellWidth()) : 0, d = t.top > 0 ? Math.floor(t.top / this.opts.cellHeight) : 0;
-        r.x = s.x + n - (s.h - (d + 1)), r.y = s.y + d - n;
+        const n = t.left > 0 ? Math.floor(t.left / this.cellWidth()) : 0, a = t.top > 0 ? Math.floor(t.top / this.opts.cellHeight) : 0;
+        r.x = s.x + n - (s.h - (a + 1)), r.y = s.y + a - n;
       }
       Object.keys(r).forEach((n) => {
         r[n] === void 0 && delete r[n];
@@ -3504,8 +3494,8 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       }), !this._styles)
         return this;
       this._styles._max = 0, c.addCSSRule(this._styles, r, `height: ${i}${s}`);
-      const n = this.opts.marginTop + this.opts.marginUnit, d = this.opts.marginBottom + this.opts.marginUnit, l = this.opts.marginRight + this.opts.marginUnit, a = this.opts.marginLeft + this.opts.marginUnit, h = `${r} > .grid-stack-item-content`, f = `.${this._styleSheetClass} > .grid-stack-placeholder > .placeholder-content`;
-      c.addCSSRule(this._styles, h, `top: ${n}; right: ${l}; bottom: ${d}; left: ${a};`), c.addCSSRule(this._styles, f, `top: ${n}; right: ${l}; bottom: ${d}; left: ${a};`), c.addCSSRule(this._styles, `${r} > .ui-resizable-n`, `top: ${n};`), c.addCSSRule(this._styles, `${r} > .ui-resizable-s`, `bottom: ${d}`), c.addCSSRule(this._styles, `${r} > .ui-resizable-ne`, `right: ${l}; top: ${n}`), c.addCSSRule(this._styles, `${r} > .ui-resizable-e`, `right: ${l}`), c.addCSSRule(this._styles, `${r} > .ui-resizable-se`, `right: ${l}; bottom: ${d}`), c.addCSSRule(this._styles, `${r} > .ui-resizable-nw`, `left: ${a}; top: ${n}`), c.addCSSRule(this._styles, `${r} > .ui-resizable-w`, `left: ${a}`), c.addCSSRule(this._styles, `${r} > .ui-resizable-sw`, `left: ${a}; bottom: ${d}`);
+      const n = this.opts.marginTop + this.opts.marginUnit, a = this.opts.marginBottom + this.opts.marginUnit, d = this.opts.marginRight + this.opts.marginUnit, l = this.opts.marginLeft + this.opts.marginUnit, h = `${r} > .grid-stack-item-content`, f = `.${this._styleSheetClass} > .grid-stack-placeholder > .placeholder-content`;
+      c.addCSSRule(this._styles, h, `top: ${n}; right: ${d}; bottom: ${a}; left: ${l};`), c.addCSSRule(this._styles, f, `top: ${n}; right: ${d}; bottom: ${a}; left: ${l};`), c.addCSSRule(this._styles, `${r} > .ui-resizable-n`, `top: ${n};`), c.addCSSRule(this._styles, `${r} > .ui-resizable-s`, `bottom: ${a}`), c.addCSSRule(this._styles, `${r} > .ui-resizable-ne`, `right: ${d}; top: ${n}`), c.addCSSRule(this._styles, `${r} > .ui-resizable-e`, `right: ${d}`), c.addCSSRule(this._styles, `${r} > .ui-resizable-se`, `right: ${d}; bottom: ${a}`), c.addCSSRule(this._styles, `${r} > .ui-resizable-nw`, `left: ${l}; top: ${n}`), c.addCSSRule(this._styles, `${r} > .ui-resizable-w`, `left: ${l}`), c.addCSSRule(this._styles, `${r} > .ui-resizable-sw`, `left: ${l}; bottom: ${a}`);
     }
     if (t = t || this._styles._max, t > this._styles._max) {
       const o = (n) => i * n + s;
@@ -3535,7 +3525,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   }
   /** @internal */
   _prepareElement(e, t = !1, i) {
-    i = i || this._readAttr(e), e.gridstackNode = i, i.el = e, i.grid = this, i = this.engine.addNode(i, t), this._writeAttr(e, i), e.classList.add(F.itemClass, this.opts.itemClass);
+    i = i || this._readAttr(e), e.gridstackNode = i, i.el = e, i.grid = this, i = this.engine.addNode(i, t), this._writeAttr(e, i), e.classList.add(G.itemClass, this.opts.itemClass);
     const s = c.shouldSizeToContent(i);
     return s ? e.classList.add("size-to-content") : e.classList.remove("size-to-content"), s && this.resizeToContentCheck(!1, i), this._prepareDragDropByNode(i), this;
   }
@@ -3651,7 +3641,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * @param root optional root which defaults to document (for shadow dom pass the parent HTMLDocument)
    */
   static setupDragIn(e, t, i, s = document) {
-    (t == null ? void 0 : t.pause) !== void 0 && (w.pauseDrag = t.pause), t = { appendTo: "body", helper: "clone", ...t || {} }, (typeof e == "string" ? c.getElements(e, s) : e).forEach((o, n) => {
+    (t == null ? void 0 : t.pause) !== void 0 && (b.pauseDrag = t.pause), t = { appendTo: "body", helper: "clone", ...t || {} }, (typeof e == "string" ? c.getElements(e, s) : e).forEach((o, n) => {
       I.isDraggable(o) || I.dragIn(o, t), i != null && i[n] && (o.gridstackNode = i[n]);
     });
   }
@@ -3746,20 +3736,20 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
         return;
       if (!((f = n.grid) != null && f.el)) {
         o.style.transform = `scale(${1 / this.dragTransform.xScale},${1 / this.dragTransform.yScale})`;
-        const g = o.getBoundingClientRect();
-        o.style.left = g.x + (this.dragTransform.xScale - 1) * (s.clientX - g.x) / this.dragTransform.xScale + "px", o.style.top = g.y + (this.dragTransform.yScale - 1) * (s.clientY - g.y) / this.dragTransform.yScale + "px", o.style.transformOrigin = "0px 0px";
+        const p = o.getBoundingClientRect();
+        o.style.left = p.x + (this.dragTransform.xScale - 1) * (s.clientX - p.x) / this.dragTransform.xScale + "px", o.style.top = p.y + (this.dragTransform.yScale - 1) * (s.clientY - p.y) / this.dragTransform.yScale + "px", o.style.transformOrigin = "0px 0px";
       }
-      let { top: d, left: l } = o.getBoundingClientRect();
-      const a = this.el.getBoundingClientRect();
-      l -= a.left, d -= a.top;
+      let { top: a, left: d } = o.getBoundingClientRect();
+      const l = this.el.getBoundingClientRect();
+      d -= l.left, a -= l.top;
       const h = {
         position: {
-          top: d * this.dragTransform.xScale,
-          left: l * this.dragTransform.yScale
+          top: a * this.dragTransform.xScale,
+          left: d * this.dragTransform.yScale
         }
       };
       if (n._temporaryRemoved) {
-        if (n.x = Math.max(0, Math.round(l / t)), n.y = Math.max(0, Math.round(d / e)), delete n.autoPosition, this.engine.nodeBoundFix(n), !this.engine.willItFit(n)) {
+        if (n.x = Math.max(0, Math.round(d / t)), n.y = Math.max(0, Math.round(a / e)), delete n.autoPosition, this.engine.nodeBoundFix(n), !this.engine.willItFit(n)) {
           if (n.autoPosition = !0, !this.engine.willItFit(n)) {
             I.off(r, "drag");
             return;
@@ -3795,42 +3785,42 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       if ((n == null ? void 0 : n.grid) === this && !n._temporaryRemoved)
         return !1;
       if (n != null && n.grid && n.grid !== this && !n._temporaryRemoved && n.grid._leave(r, o), o = o || r, t = this.cellWidth(), e = this.getCellHeight(!0), !n) {
-        const a = o.getAttribute("data-gs-widget") || o.getAttribute("gridstacknode");
-        if (a) {
+        const l = o.getAttribute("data-gs-widget") || o.getAttribute("gridstacknode");
+        if (l) {
           try {
-            n = JSON.parse(a);
+            n = JSON.parse(l);
           } catch {
-            console.error("Gridstack dropover: Bad JSON format: ", a);
+            console.error("Gridstack dropover: Bad JSON format: ", l);
           }
           o.removeAttribute("data-gs-widget"), o.removeAttribute("gridstacknode");
         }
         n || (n = this._readAttr(o));
       }
       n.grid || (n.el || (n = { ...n }), n._isExternal = !0, o.gridstackNode = n);
-      const d = n.w || Math.round(o.offsetWidth / t) || 1, l = n.h || Math.round(o.offsetHeight / e) || 1;
-      return n.grid && n.grid !== this ? (r._gridstackNodeOrig || (r._gridstackNodeOrig = n), r.gridstackNode = n = { ...n, w: d, h: l, grid: this }, delete n.x, delete n.y, this.engine.cleanupNode(n).nodeBoundFix(n), n._initDD = n._isExternal = // DOM needs to be re-parented on a drop
-      n._temporaryRemoved = !0) : (n.w = d, n.h = l, n._temporaryRemoved = !0), _._itemRemoving(n.el, !1), I.on(r, "drag", i), i(s, r, o), !1;
+      const a = n.w || Math.round(o.offsetWidth / t) || 1, d = n.h || Math.round(o.offsetHeight / e) || 1;
+      return n.grid && n.grid !== this ? (r._gridstackNodeOrig || (r._gridstackNodeOrig = n), r.gridstackNode = n = { ...n, w: a, h: d, grid: this }, delete n.x, delete n.y, this.engine.cleanupNode(n).nodeBoundFix(n), n._initDD = n._isExternal = // DOM needs to be re-parented on a drop
+      n._temporaryRemoved = !0) : (n.w = a, n.h = d, n._temporaryRemoved = !0), _._itemRemoving(n.el, !1), I.on(r, "drag", i), i(s, r, o), !1;
     }).on(this.el, "dropout", (s, r, o) => {
       const n = (o == null ? void 0 : o.gridstackNode) || r.gridstackNode;
       return n && (!n.grid || n.grid === this) && (this._leave(r, o), this._isTemp && this.removeAsSubGrid(n)), !1;
     }).on(this.el, "drop", (s, r, o) => {
-      var g, m, y;
+      var p, m, y;
       const n = (o == null ? void 0 : o.gridstackNode) || r.gridstackNode;
       if ((n == null ? void 0 : n.grid) === this && !n._isExternal)
         return !1;
-      const d = !!this.placeholder.parentElement, l = r !== o;
+      const a = !!this.placeholder.parentElement, d = r !== o;
       this.placeholder.remove(), delete this.placeholder.gridstackNode;
-      const a = d && this.opts.animate;
-      a && this.setAnimation(!1);
+      const l = a && this.opts.animate;
+      l && this.setAnimation(!1);
       const h = r._gridstackNodeOrig;
-      if (delete r._gridstackNodeOrig, d && (h != null && h.grid) && h.grid !== this) {
-        const p = h.grid;
-        p.engine.removeNodeFromLayoutCache(h), p.engine.removedNodes.push(h), p._triggerRemoveEvent()._triggerChangeEvent(), p.parentGridNode && !p.engine.nodes.length && p.opts.subGridDynamic && p.removeAsSubGrid();
+      if (delete r._gridstackNodeOrig, a && (h != null && h.grid) && h.grid !== this) {
+        const g = h.grid;
+        g.engine.removeNodeFromLayoutCache(h), g.engine.removedNodes.push(h), g._triggerRemoveEvent()._triggerChangeEvent(), g.parentGridNode && !g.engine.nodes.length && g.opts.subGridDynamic && g.removeAsSubGrid();
       }
-      if (!n || (d && (this.engine.cleanupNode(n), n.grid = this), (g = n.grid) == null || delete g._isTemp, I.off(r, "drag"), o !== r ? (o.remove(), r = o) : r.remove(), this._removeDD(r), !d))
+      if (!n || (a && (this.engine.cleanupNode(n), n.grid = this), (p = n.grid) == null || delete p._isTemp, I.off(r, "drag"), o !== r ? (o.remove(), r = o) : r.remove(), this._removeDD(r), !a))
         return !1;
       const f = (y = (m = n.subGrid) == null ? void 0 : m.el) == null ? void 0 : y.gridstack;
-      return c.copyPos(n, this._readAttr(this.placeholder)), c.removePositioningStyles(r), l && (n.content || n.subGridOpts || _.addRemoveCB) ? (delete n.el, r = this.addWidget(n)) : (this._prepareElement(r, !0, n), this.el.appendChild(r), this.resizeToContentCheck(!1, n), f && (f.parentGridNode = n, f.opts.styleInHead || f._updateStyles(!0)), this._updateContainerHeight()), this.engine.addedNodes.push(n), this._triggerAddEvent(), this._triggerChangeEvent(), this.engine.endUpdate(), this._gsEventHandler.dropped && this._gsEventHandler.dropped({ ...s, type: "dropped" }, h && h.grid ? h : void 0, n), a && this.setAnimation(this.opts.animate, !0), !1;
+      return c.copyPos(n, this._readAttr(this.placeholder)), c.removePositioningStyles(r), d && (n.content || n.subGridOpts || _.addRemoveCB) ? (delete n.el, r = this.addWidget(n)) : (this._prepareElement(r, !0, n), this.el.appendChild(r), this.resizeToContentCheck(!1, n), f && (f.parentGridNode = n, f.opts.styleInHead || f._updateStyles(!0)), this._updateContainerHeight()), this.engine.addedNodes.push(n), this._triggerAddEvent(), this._triggerChangeEvent(), this.engine.endUpdate(), this._gsEventHandler.dropped && this._gsEventHandler.dropped({ ...s, type: "dropped" }, h && h.grid ? h : void 0, n), l && this.setAnimation(this.opts.animate, !0), !1;
     }), this;
   }
   /** @internal mark item for removal */
@@ -3854,30 +3844,30 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       return e._initDD && (this._removeDD(t), delete e._initDD), t.classList.add("ui-draggable-disabled", "ui-resizable-disabled"), this;
     if (!e._initDD) {
       let r, o;
-      const n = (a, h) => {
-        this._gsEventHandler[a.type] && this._gsEventHandler[a.type](a, a.target), r = this.cellWidth(), o = this.getCellHeight(!0), this._onStartMoving(t, a, h, e, r, o);
-      }, d = (a, h) => {
-        this._dragOrResize(t, a, h, e, r, o);
-      }, l = (a) => {
+      const n = (l, h) => {
+        this._gsEventHandler[l.type] && this._gsEventHandler[l.type](l, l.target), r = this.cellWidth(), o = this.getCellHeight(!0), this._onStartMoving(t, l, h, e, r, o);
+      }, a = (l, h) => {
+        this._dragOrResize(t, l, h, e, r, o);
+      }, d = (l) => {
         this.placeholder.remove(), delete this.placeholder.gridstackNode, delete e._moving, delete e._event, delete e._lastTried;
-        const h = e.w !== e._orig.w, f = a.target;
+        const h = e.w !== e._orig.w, f = l.target;
         if (!(!f.gridstackNode || f.gridstackNode.grid !== this)) {
           if (e.el = f, e._isAboutToRemove) {
-            const g = t.gridstackNode.grid;
-            g._gsEventHandler[a.type] && g._gsEventHandler[a.type](a, f), g.engine.nodes.push(e), g.removeWidget(t, !0, !0);
+            const p = t.gridstackNode.grid;
+            p._gsEventHandler[l.type] && p._gsEventHandler[l.type](l, f), p.engine.nodes.push(e), p.removeWidget(t, !0, !0);
           } else
-            c.removePositioningStyles(f), e._temporaryRemoved ? (c.copyPos(e, e._orig), this._writePosAttr(f, e), this.engine.addNode(e)) : this._writePosAttr(f, e), this._gsEventHandler[a.type] && this._gsEventHandler[a.type](a, f);
-          this._extraDragRow = 0, this._updateContainerHeight(), this._triggerChangeEvent(), this.engine.endUpdate(), a.type === "resizestop" && (Number.isInteger(e.sizeToContent) && (e.sizeToContent = e.h), this.resizeToContentCheck(h, e));
+            c.removePositioningStyles(f), e._temporaryRemoved ? (c.copyPos(e, e._orig), this._writePosAttr(f, e), this.engine.addNode(e)) : this._writePosAttr(f, e), this._gsEventHandler[l.type] && this._gsEventHandler[l.type](l, f);
+          this._extraDragRow = 0, this._updateContainerHeight(), this._triggerChangeEvent(), this.engine.endUpdate(), l.type === "resizestop" && (Number.isInteger(e.sizeToContent) && (e.sizeToContent = e.h), this.resizeToContentCheck(h, e));
         }
       };
       I.draggable(t, {
         start: n,
-        stop: l,
-        drag: d
+        stop: d,
+        drag: a
       }).resizable(t, {
         start: n,
-        stop: l,
-        resize: d
+        stop: d,
+        resize: a
       }), e._initDD = !0;
     }
     return I.draggable(t, i ? "disable" : "enable").resizable(t, s ? "disable" : "enable"), this;
@@ -3888,8 +3878,8 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     if (this.engine.cleanNodes().beginUpdate(s), this._writePosAttr(this.placeholder, s), this.el.appendChild(this.placeholder), this.placeholder.gridstackNode = s, (n = s.grid) != null && n.el)
       this.dragTransform = c.getValuesFromTransformedElement(e);
     else if (this.placeholder && this.placeholder.closest(".grid-stack")) {
-      const d = this.placeholder.closest(".grid-stack");
-      this.dragTransform = c.getValuesFromTransformedElement(d);
+      const a = this.placeholder.closest(".grid-stack");
+      this.dragTransform = c.getValuesFromTransformedElement(a);
     } else
       this.dragTransform = {
         xScale: 1,
@@ -3898,48 +3888,48 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
         yOffset: 0
       };
     if (s.el = this.placeholder, s._lastUiPosition = i.position, s._prevYPix = i.position.top, s._moving = t.type === "dragstart", delete s._lastTried, t.type === "dropover" && s._temporaryRemoved && (this.engine.addNode(s), s._moving = !0), this.engine.cacheRects(r, o, this.opts.marginTop, this.opts.marginRight, this.opts.marginBottom, this.opts.marginLeft), t.type === "resizestart") {
-      const d = this.getColumn() - s.x, l = (this.opts.maxRow || Number.MAX_SAFE_INTEGER) - s.y;
-      I.resizable(e, "option", "minWidth", r * Math.min(s.minW || 1, d)).resizable(e, "option", "minHeight", o * Math.min(s.minH || 1, l)).resizable(e, "option", "maxWidth", r * Math.min(s.maxW || Number.MAX_SAFE_INTEGER, d)).resizable(e, "option", "maxWidthMoveLeft", r * Math.min(s.maxW || Number.MAX_SAFE_INTEGER, s.x + s.w)).resizable(e, "option", "maxHeight", o * Math.min(s.maxH || Number.MAX_SAFE_INTEGER, l)).resizable(e, "option", "maxHeightMoveUp", o * Math.min(s.maxH || Number.MAX_SAFE_INTEGER, s.y + s.h));
+      const a = this.getColumn() - s.x, d = (this.opts.maxRow || Number.MAX_SAFE_INTEGER) - s.y;
+      I.resizable(e, "option", "minWidth", r * Math.min(s.minW || 1, a)).resizable(e, "option", "minHeight", o * Math.min(s.minH || 1, d)).resizable(e, "option", "maxWidth", r * Math.min(s.maxW || Number.MAX_SAFE_INTEGER, a)).resizable(e, "option", "maxWidthMoveLeft", r * Math.min(s.maxW || Number.MAX_SAFE_INTEGER, s.x + s.w)).resizable(e, "option", "maxHeight", o * Math.min(s.maxH || Number.MAX_SAFE_INTEGER, d)).resizable(e, "option", "maxHeightMoveUp", o * Math.min(s.maxH || Number.MAX_SAFE_INTEGER, s.y + s.h));
     }
   }
   /** @internal handles actual drag/resize */
   _dragOrResize(e, t, i, s, r, o) {
     const n = { ...s._orig };
-    let d, l = this.opts.marginLeft, a = this.opts.marginRight, h = this.opts.marginTop, f = this.opts.marginBottom;
-    const g = Math.round(o * 0.1), m = Math.round(r * 0.1);
-    if (l = Math.min(l, m), a = Math.min(a, m), h = Math.min(h, g), f = Math.min(f, g), t.type === "drag") {
+    let a, d = this.opts.marginLeft, l = this.opts.marginRight, h = this.opts.marginTop, f = this.opts.marginBottom;
+    const p = Math.round(o * 0.1), m = Math.round(r * 0.1);
+    if (d = Math.min(d, m), l = Math.min(l, m), h = Math.min(h, p), f = Math.min(f, p), t.type === "drag") {
       if (s._temporaryRemoved)
         return;
-      const p = i.position.top - s._prevYPix;
-      s._prevYPix = i.position.top, this.opts.draggable.scroll !== !1 && c.updateScrollPosition(e, i.position, p);
-      const C = i.position.left + (i.position.left > s._lastUiPosition.left ? -a : l), k = i.position.top + (i.position.top > s._lastUiPosition.top ? -f : h);
-      n.x = Math.round(C / r), n.y = Math.round(k / o);
-      const R = this._extraDragRow;
+      const g = i.position.top - s._prevYPix;
+      s._prevYPix = i.position.top, this.opts.draggable.scroll !== !1 && c.updateScrollPosition(e, i.position, g);
+      const R = i.position.left + (i.position.left > s._lastUiPosition.left ? -l : d), S = i.position.top + (i.position.top > s._lastUiPosition.top ? -f : h);
+      n.x = Math.round(R / r), n.y = Math.round(S / o);
+      const C = this._extraDragRow;
       if (this.engine.collide(s, n)) {
         const E = this.getRow();
         let x = Math.max(0, n.y + s.h - E);
         this.opts.maxRow && E + x > this.opts.maxRow && (x = Math.max(0, this.opts.maxRow - E)), this._extraDragRow = x;
       } else
         this._extraDragRow = 0;
-      if (this._extraDragRow !== R && this._updateContainerHeight(), s.x === n.x && s.y === n.y)
+      if (this._extraDragRow !== C && this._updateContainerHeight(), s.x === n.x && s.y === n.y)
         return;
     } else if (t.type === "resize") {
-      if (n.x < 0 || (c.updateScrollResize(t, e, o), n.w = Math.round((i.size.width - l) / r), n.h = Math.round((i.size.height - h) / o), s.w === n.w && s.h === n.h) || s._lastTried && s._lastTried.w === n.w && s._lastTried.h === n.h)
+      if (n.x < 0 || (c.updateScrollResize(t, e, o), n.w = Math.round((i.size.width - d) / r), n.h = Math.round((i.size.height - h) / o), s.w === n.w && s.h === n.h) || s._lastTried && s._lastTried.w === n.w && s._lastTried.h === n.h)
         return;
-      const p = i.position.left + l, C = i.position.top + h;
-      n.x = Math.round(p / r), n.y = Math.round(C / o), d = !0;
+      const g = i.position.left + d, R = i.position.top + h;
+      n.x = Math.round(g / r), n.y = Math.round(R / o), a = !0;
     }
     s._event = t, s._lastTried = n;
     const y = {
-      x: i.position.left + l,
+      x: i.position.left + d,
       y: i.position.top + h,
-      w: (i.size ? i.size.width : s.w * r) - l - a,
+      w: (i.size ? i.size.width : s.w * r) - d - l,
       h: (i.size ? i.size.height : s.h * o) - h - f
     };
-    if (this.engine.moveNodeCheck(s, { ...n, cellWidth: r, cellHeight: o, rect: y, resizing: d })) {
-      s._lastUiPosition = i.position, this.engine.cacheRects(r, o, h, a, f, l), delete s._skipDown, d && s.subGrid && s.subGrid.onResize(), this._extraDragRow = 0, this._updateContainerHeight();
-      const p = t.target;
-      this._writePosAttr(p, s), this._gsEventHandler[t.type] && this._gsEventHandler[t.type](t, p);
+    if (this.engine.moveNodeCheck(s, { ...n, cellWidth: r, cellHeight: o, rect: y, resizing: a })) {
+      s._lastUiPosition = i.position, this.engine.cacheRects(r, o, h, l, f, d), delete s._skipDown, a && s.subGrid && s.subGrid.onResize(), this._extraDragRow = 0, this._updateContainerHeight();
+      const g = t.target;
+      this._writePosAttr(g, s), this._gsEventHandler[t.type] && this._gsEventHandler[t.type](t, g);
     }
   }
   /** @internal called when item leaving our area by either cursor dropout event
@@ -3953,7 +3943,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   }
   // legacy method removed
   commit() {
-    return Gi(this, this.batchUpdate(!1), "commit", "batchUpdate", "5.2"), this;
+    return Ui(this, this.batchUpdate(!1), "commit", "batchUpdate", "5.2"), this;
   }
 }
 _.renderCB = (u, e) => {
@@ -3963,7 +3953,7 @@ _.resizeToContentParent = ".grid-stack-item-content";
 _.Utils = c;
 _.Engine = Q;
 _.GDRev = "11.3.0";
-const Yi = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], Xi = { class: "grid-stack-item-content" }, ji = /* @__PURE__ */ U({
+const Vi = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], Ki = { class: "grid-stack-item-content" }, Yi = /* @__PURE__ */ F({
   __name: "DraggableGridLayout",
   props: {
     tiles: {},
@@ -3972,11 +3962,11 @@ const Yi = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], Xi = { cl
   },
   emits: ["update-tiles"],
   setup(u, { expose: e, emit: t }) {
-    const i = u, s = t, r = B(null), o = B(new Map(i.tiles.map((g) => [`${g.id}`, g])));
+    const i = u, s = t, r = B(null), o = B(new Map(i.tiles.map((p) => [`${p.id}`, p])));
     let n = null;
-    const d = (g) => `[data-id="${g}"]`, l = (g) => g.map((m) => {
-      var p;
-      const y = o.value.get(`${(p = m.el) == null ? void 0 : p.getAttribute("data-id")}`);
+    const a = (p) => `[data-id="${p}"]`, d = (p) => p.map((m) => {
+      var g;
+      const y = o.value.get(`${(g = m.el) == null ? void 0 : g.getAttribute("data-id")}`);
       if (y)
         return {
           ...y,
@@ -3985,52 +3975,52 @@ const Yi = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], Xi = { cl
             size: { cols: Number(m.w), rows: Number(m.h) }
           }
         };
-    }).filter((m) => m !== void 0), a = (g, m) => {
-      n && (l(m).forEach((p) => {
-        o.value.set(`${p.id}`, p);
+    }).filter((m) => m !== void 0), l = (p, m) => {
+      n && (d(m).forEach((g) => {
+        o.value.set(`${g.id}`, g);
       }), s("update-tiles", Array.from(o.value.values())));
-    }, h = (g, m) => {
+    }, h = (p, m) => {
       m.forEach((y) => {
-        var p;
-        o.value.delete(`${(p = y.el) == null ? void 0 : p.getAttribute("data-id")}`);
+        var g;
+        o.value.delete(`${(g = y.el) == null ? void 0 : g.getAttribute("data-id")}`);
       }), s("update-tiles", Array.from(o.value.values()));
     };
-    Ke(() => {
+    We(() => {
       r.value && (n = _.init({
         column: i.gridSize.cols,
         cellHeight: i.tileHeight,
         resizable: { handles: "se, sw" },
         handle: ".tile-header"
-      }, r.value), n.on("change", a), n.on("added", a), n.on("removed", h));
-    }), Ue(() => {
+      }, r.value), n.on("change", l), n.on("added", l), n.on("removed", h));
+    }), $e(() => {
       n && n.destroy(!1);
     });
-    const f = (g) => {
+    const f = (p) => {
       if (n && r.value) {
-        const m = r.value.querySelector(d(g));
+        const m = r.value.querySelector(a(p));
         m && n.removeWidget(m);
       }
     };
-    return Ge(() => i.tiles.length, async (g, m) => {
-      if (g > m && n) {
+    return Ue(() => i.tiles.length, async (p, m) => {
+      if (p > m && n) {
         const y = i.tiles.slice(m);
-        for (const p of y)
-          o.value.set(`${p.id}`, p), await yt(), n.makeWidget(d(p.id), {
+        for (const g of y)
+          o.value.set(`${g.id}`, g), await mt(), n.makeWidget(a(g.id), {
             autoPosition: !0,
-            w: p.layout.size.cols,
-            h: p.layout.size.rows
+            w: g.layout.size.cols,
+            h: g.layout.size.rows
           });
       }
-    }), gt(() => {
-      i.tiles.forEach((g) => {
-        o.value.set(`${g.id}`, g);
+    }), ft(() => {
+      i.tiles.forEach((p) => {
+        o.value.set(`${p.id}`, p);
       });
-    }), e({ removeWidget: f }), (g, m) => (T(), $("div", {
+    }), e({ removeWidget: f }), (p, m) => (T(), $("div", {
       ref_key: "gridContainer",
       ref: r,
       class: "grid-stack"
     }, [
-      (T(!0), $(_t, null, bt(i.tiles, (y) => (T(), $("div", {
+      (T(!0), $(vt, null, _t(i.tiles, (y) => (T(), $("div", {
         key: y.id,
         class: "grid-stack-item",
         "data-id": `${y.id}`,
@@ -4041,46 +4031,46 @@ const Yi = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], Xi = { cl
         "gs-x": y.layout.position.col,
         "gs-y": y.layout.position.row
       }, [
-        he("div", Xi, [
-          Me(g.$slots, "tile", { tile: y }, void 0, !0)
+        le("div", Ki, [
+          Le(p.$slots, "tile", { tile: y }, void 0, !0)
         ])
-      ], 8, Yi))), 128))
+      ], 8, Vi))), 128))
     ], 512));
   }
-}), Qi = /* @__PURE__ */ le(ji, [["__scopeId", "data-v-f4f87f74"]]), Ji = { class: "kong-ui-public-dashboard-renderer" }, Zi = {
+}), Xi = /* @__PURE__ */ ae(Yi, [["__scopeId", "data-v-f4f87f74"]]), ji = { class: "kong-ui-public-dashboard-renderer" }, Qi = {
   key: 0,
   class: "tile-container slottable-tile"
-}, es = /* @__PURE__ */ U({
+}, Ji = /* @__PURE__ */ F({
   __name: "DashboardRenderer",
-  props: /* @__PURE__ */ tt({
+  props: /* @__PURE__ */ et({
     context: {}
   }, {
     modelValue: { required: !0 },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ tt(["edit-tile"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ et(["edit-tile"], ["update:modelValue"]),
   setup(u, { expose: e, emit: t }) {
-    const i = u, s = t, r = $t(u, "modelValue"), { i18n: o } = ie.useI18n(), n = B(0), d = B(null), l = pe(ae);
-    l || (console.warn("Analytics dashboards require a query bridge supplied via provide / inject."), console.warn("Please ensure your application has a query bridge provided under the key 'analytics-query-provider', as described in"), console.warn("https://github.com/Kong/public-ui-components/blob/main/packages/analytics/dashboard-renderer/README.md#requirements")), ie.useRequestQueue();
-    const a = Et(), h = A(() => i.context.timeSpec ? i.context.timeSpec : {
+    const i = u, s = t, r = qt(u, "modelValue"), { i18n: o } = ve.useI18n(), n = B(0), a = B(null), d = ge(oe);
+    d || (console.warn("Analytics dashboards require a query bridge supplied via provide / inject."), console.warn("Please ensure your application has a query bridge provided under the key 'analytics-query-provider', as described in"), console.warn("https://github.com/Kong/public-ui-components/blob/main/packages/analytics/dashboard-renderer/README.md#requirements")), ve.useRequestQueue();
+    const l = bt(), h = H(() => i.context.timeSpec ? i.context.timeSpec : {
       type: "relative",
-      time_range: a.defaultQueryTimeForOrg
-    }), f = A(() => !!i.context.timeSpec || !a.loading), g = (E, x) => {
-      const S = E.layout.position.row - x.layout.position.row;
-      return S !== 0 ? S : E.layout.position.col - x.layout.position.col;
-    }, m = A(() => r.value.tiles.map((E, x) => {
+      time_range: l.defaultQueryTimeForOrg
+    }), f = H(() => !!i.context.timeSpec || !l.loading), p = (E, x) => {
+      const z = E.layout.position.row - x.layout.position.row;
+      return z !== 0 ? z : E.layout.position.col - x.layout.position.col;
+    }, m = H(() => r.value.tiles.map((E, x) => {
       var q;
-      let S = E.definition;
-      if ("description" in S.chart) {
-        const G = (q = S.chart.description) == null ? void 0 : q.replace(ci, () => {
-          const me = `renderer.trendRange.${h.value.type === "absolute" ? "custom" : h.value.time_range}`;
-          return o.te(me) ? o.t(me) : "";
+      let z = E.definition;
+      if ("description" in z.chart) {
+        const U = (q = z.chart.description) == null ? void 0 : q.replace(di, () => {
+          const w = `renderer.trendRange.${h.value.type === "absolute" ? "custom" : h.value.time_range}`;
+          return o.te(w) ? o.t(w) : "";
         });
-        S = {
-          ...S,
+        z = {
+          ...z,
           chart: {
-            ...S.chart,
-            description: G
+            ...z.chart,
+            description: U
           }
         };
       }
@@ -4090,82 +4080,82 @@ const Yi = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], Xi = { cl
         E
       ), {
         layout: E.layout,
-        meta: S,
+        meta: z,
         // Add a unique key to each tile internally.
         id: E.id ?? crypto.randomUUID()
       };
-    })), y = A(() => {
-      let { tz: E, refreshInterval: x, editable: S } = i.context;
-      return E || (E = new Intl.DateTimeFormat().resolvedOptions().timeZone), x === void 0 && (x = fi), S === void 0 && (S = !1), {
+    })), y = H(() => {
+      let { tz: E, refreshInterval: x, editable: z } = i.context;
+      return E || (E = new Intl.DateTimeFormat().resolvedOptions().timeZone), x === void 0 && (x = ui), z === void 0 && (z = !1), {
         ...i.context,
         tz: E,
         timeSpec: h.value,
         refreshInterval: x,
-        editable: S
+        editable: z
       };
-    }), p = (E) => {
+    }), g = (E) => {
       s("edit-tile", E);
-    }, C = (E) => {
-      d.value && d.value.removeWidget(E.id);
-    }, k = () => {
-      n.value++;
     }, R = (E) => {
-      const x = E.map((S) => ({
-        id: S.id,
-        layout: S.layout,
-        definition: S.meta
+      a.value && a.value.removeWidget(E.id);
+    }, S = () => {
+      n.value++;
+    }, C = (E) => {
+      const x = E.map((z) => ({
+        id: z.id,
+        layout: z.layout,
+        definition: z.meta
       }));
-      r.value.gridSize.rows = Math.max(1, ...x.map((S) => S.layout.position.row + S.layout.size.rows)), r.value.tiles = x.sort(g);
+      r.value.gridSize.rows = Math.max(1, ...x.map((z) => z.layout.position.row + z.layout.size.rows)), r.value.tiles = x.sort(p);
     };
-    return e({ refresh: k }), (E, x) => {
-      const S = oe("KAlert");
-      return T(), $("div", Ji, [
-        z(l) ? (T(), H(vt(E.context.editable ? Qi : Ui), {
+    return e({ refresh: S }), (E, x) => {
+      const z = ne("KAlert");
+      return T(), $("div", ji, [
+        k(d) ? (T(), A(yt(E.context.editable ? Xi : $i), {
           key: 1,
           ref_key: "gridLayoutRef",
-          ref: d,
+          ref: a,
           "grid-size": r.value.gridSize,
           "tile-height": r.value.tileHeight,
           tiles: m.value,
-          onUpdateTiles: R
+          onUpdateTiles: C
         }, {
           tile: M(({ tile: q }) => [
-            q.meta.chart.type === "slottable" ? (T(), $("div", Zi, [
-              Me(E.$slots, q.meta.chart.id, {}, void 0, !0)
-            ])) : (T(), H(Bi, {
+            q.meta.chart.type === "slottable" ? (T(), $("div", Qi, [
+              Le(E.$slots, q.meta.chart.id, {}, void 0, !0)
+            ])) : (T(), A(Pi, {
               key: 1,
               class: "tile-container",
               context: y.value,
               definition: q.meta,
-              height: q.layout.size.rows * (r.value.tileHeight || z(Ve)) + parseInt(z(At), 10),
+              height: q.layout.size.rows * (r.value.tileHeight || k(Ve)) + parseInt(k(Nt), 10),
               "query-ready": f.value,
               "refresh-counter": n.value,
               "tile-id": q.id,
-              onEditTile: (G) => p(q),
-              onRemoveTile: (G) => C(q)
+              onEditTile: (U) => g(q),
+              onRemoveTile: (U) => R(q)
             }, null, 8, ["context", "definition", "height", "query-ready", "refresh-counter", "tile-id", "onEditTile", "onRemoveTile"]))
           ]),
           _: 3
-        }, 40, ["grid-size", "tile-height", "tiles"])) : (T(), H(S, {
+        }, 40, ["grid-size", "tile-height", "tiles"])) : (T(), A(z, {
           key: 0,
           appearance: "danger"
         }, {
           default: M(() => [
-            _e(ee(z(o).t("renderer.noQueryBridge")), 1)
+            ye(ee(k(o).t("renderer.noQueryBridge")), 1)
           ]),
           _: 1
         }))
       ]);
     };
   }
-}), cs = /* @__PURE__ */ le(es, [["__scopeId", "data-v-18c7e16d"]]);
+}), ds = /* @__PURE__ */ ae(Ji, [["__scopeId", "data-v-18c7e16d"]]);
 export {
-  ui as CP_ID_TOKEN,
+  hi as CP_ID_TOKEN,
   Ve as DEFAULT_TILE_HEIGHT,
-  fi as DEFAULT_TILE_REFRESH_INTERVAL_MS,
-  cs as DashboardRenderer,
-  st as ENTITY_ID_TOKEN,
-  Ui as GridLayout,
-  ae as INJECT_QUERY_PROVIDER,
-  ci as TIMEFRAME_TOKEN
+  ui as DEFAULT_TILE_REFRESH_INTERVAL_MS,
+  ds as DashboardRenderer,
+  it as ENTITY_ID_TOKEN,
+  $i as GridLayout,
+  oe as INJECT_QUERY_PROVIDER,
+  di as TIMEFRAME_TOKEN
 };