@factorialco/f0-react 1.306.4 → 1.308.0

package/dist/f0.js

@@ -1,9 +1,9 @@
-import { L as Cn, C as Wr, c as j, a as Di, u as _n, m as Ri, i as En, B as Si, O as Gr, p as $r, w as jr, S as Fe, b as Ur, F as Dn, d as Kr, A as Xr, D as Yr, e as qr, f as Re, g as Vr, h as me, j as Vi, k as Jr, l as di, n as lt, o as Zr, q as Qr, r as Ot, s as Rn, E as es, t as zt, v as ts, x as is, y as ns, z as rs, G as Xe, H as Sn, I as ss, J as os, K as as, M as Ji, N as ls, P as Nn, Q as cs, R as On, X as An, Y as vi, T as ds, U as kn, V as us, W as hs, Z as fs, _ as gs, $ as ps, a0 as ms, a1 as vs, a2 as ys, a3 as Zi, a4 as bs, a5 as ct, a6 as ui, a7 as xs, a8 as ws, a9 as Cs, aa as _s, ab as Es, ac as Ds, ad as Rs, ae as Ss, af as Ns, ag as Os, ah as Tn, ai as As, aj as Mt, ak as zn, al as Pn, am as ks, an as Mn, ao as Ln, ap as In, aq as Ts, ar as zs, as as Hn, at as Ps, au as Ms, av as Ls, aw as Is, ax as Hs, ay as Bs, az as Bn, aA as Ve, aB as Fn, aC as Fs, aD as Ws, aE as Qi, aF as Gs, aG as Wn, aH as $s, aI as js, aJ as Us, aK as Ks, aL as Xs, aM as Ys, aN as qs, aO as Vs, aP as Js, aQ as Zs, aR as Qs, aS as eo } from "./hooks-DRjrmneu.js";
-import { bl as Vc, by as Jc, bH as Zc, aT as Qc, aU as ed, aV as td, aW as id, aX as nd, aY as rd, aZ as sd, a_ as od, b0 as ad, b1 as ld, b2 as cd, b3 as dd, b4 as ud, b5 as hd, b6 as fd, bD as gd, b8 as pd, b9 as md, bc as vd, bd as yd, be as bd, bf as xd, bi as wd, bj as Cd, bk as _d, bn as Ed, bb as Dd, bm as Rd, bh as Sd, bE as Nd, bx as Od, bs as Ad, bv as kd, br as Td, bI as zd, bq as Pd, bp as Md, a$ as Ld, b7 as Id, ba as Hd, bg as Bd, bo as Fd, bt as Wd, bz as Gd, bA as $d, bB as jd, bJ as Ud, bu as Kd, bC as Xd, bG as Yd, bw as qd, bF as Vd } from "./hooks-DRjrmneu.js";
+import { L as Cn, C as Wr, c as j, a as Di, u as _n, m as Ri, i as En, B as Si, O as Gr, p as $r, w as jr, S as Fe, b as Ur, F as Dn, d as Kr, A as Xr, D as Yr, e as qr, f as Re, g as Vr, h as me, j as Vi, k as Jr, l as di, n as lt, o as Zr, q as Qr, r as Ot, s as Rn, E as es, t as zt, v as ts, x as is, y as ns, z as rs, G as Xe, H as Sn, I as ss, J as os, K as as, M as Ji, N as ls, P as Nn, Q as cs, R as On, X as An, Y as vi, T as ds, U as Tn, V as us, W as hs, Z as fs, _ as gs, $ as ps, a0 as ms, a1 as vs, a2 as ys, a3 as Zi, a4 as bs, a5 as ct, a6 as ui, a7 as xs, a8 as ws, a9 as Cs, aa as _s, ab as Es, ac as Ds, ad as Rs, ae as Ss, af as Ns, ag as Os, ah as kn, ai as As, aj as Mt, ak as zn, al as Pn, am as Ts, an as Mn, ao as Ln, ap as In, aq as ks, ar as zs, as as Hn, at as Ps, au as Ms, av as Ls, aw as Is, ax as Hs, ay as Bs, az as Bn, aA as Ve, aB as Fn, aC as Fs, aD as Ws, aE as Qi, aF as Gs, aG as Wn, aH as $s, aI as js, aJ as Us, aK as Ks, aL as Xs, aM as Ys, aN as qs, aO as Vs, aP as Js, aQ as Zs, aR as Qs, aS as eo } from "./hooks-DhJYpAKB.js";
+import { bl as Zc, by as Qc, bH as ed, aT as td, aU as id, aV as nd, aW as rd, aX as sd, aY as od, aZ as ad, a_ as ld, b0 as cd, b1 as dd, b2 as ud, b3 as hd, b4 as fd, b5 as gd, b6 as pd, bD as md, b8 as vd, b9 as yd, bd, be as xd, bf as wd, bg as Cd, bi as _d, bj as Ed, bk as Dd, bn as Rd, bb as Sd, bm as Nd, bc as Od, bh as Ad, bE as Td, bx as kd, bs as zd, bv as Pd, br as Md, bI as Ld, bq as Id, bp as Hd, a$ as Bd, b7 as Fd, ba as Wd, bo as Gd, bt as $d, bz as jd, bA as Ud, bB as Kd, bJ as Xd, bu as Yd, bC as qd, bG as Vd, bw as Jd, bF as Zd } from "./hooks-DhJYpAKB.js";
 import { jsx as g, jsxs as M, Fragment as Vt } from "react/jsx-runtime";
 import L, { forwardRef as le, useRef as I, useImperativeHandle as to, Children as Lt, createContext as Ne, useContext as we, useState as W, useMemo as B, useEffect as H, useCallback as K, useLayoutEffect as yi, createElement as en, isValidElement as Gn, Fragment as io, memo as no, useReducer as ro, cloneElement as so, PureComponent as oo } from "react";
 import { createPortal as $n, unstable_batchedUpdates as At } from "react-dom";
-import { defaultTranslations as Zd } from "./i18n-provider-defaults.js";
+import { defaultTranslations as eu } from "./i18n-provider-defaults.js";
 import './f0.css';const ao = {
   xs: 1,
   sm: 2,
@@ -279,10 +279,10 @@ function mo({ children: n, options: e, onResizeStop: t, onChange: i, widgets: r
         }), _;
       });
     }
-    const T = y.filter((A) => R.includes(A.id));
-    if (T.length > 0) {
+    const k = y.filter((A) => R.includes(A.id));
+    if (k.length > 0) {
       const A = [];
-      T.forEach((m) => {
+      k.forEach((m) => {
         const _ = C.find((P) => P.id === m.id);
         if (!_)
           return;
@@ -304,7 +304,7 @@ function mo({ children: n, options: e, onResizeStop: t, onChange: i, widgets: r
             });
           }
         }
-      }), T.forEach((m) => {
+      }), k.forEach((m) => {
         m.content && h.current.set(m.id, m.content), m._originalContent !== void 0 && v.current.set(m.id, m._originalContent);
       }), A.forEach(({ element: m, updateOptions: _ }) => {
         try {
@@ -314,18 +314,18 @@ function mo({ children: n, options: e, onResizeStop: t, onChange: i, widgets: r
         }
       }), S((m) => {
         const _ = new Map(m);
-        return T.forEach((O) => {
+        return k.forEach((O) => {
           const P = Ye(O);
           _.set(O.id, P);
         }), _;
       }), d((m) => {
         const _ = new Map(m);
-        return T.forEach((O) => {
+        return k.forEach((O) => {
           O.content && _.set(O.id, O.content);
         }), _;
       }), x((m) => {
         const _ = new Map(m);
-        return T.forEach((O) => {
+        return k.forEach((O) => {
           O._originalContent !== void 0 && _.set(O.id, O._originalContent);
         }), _;
       });
@@ -352,7 +352,7 @@ function mo({ children: n, options: e, onResizeStop: t, onChange: i, widgets: r
       const R = C.map((y) => {
         const b = y.id;
         if (!b) return null;
-        const D = h.current.get(b), E = v.current.get(b), T = y;
+        const D = h.current.get(b), E = v.current.get(b), k = y;
         return {
           ...y,
           id: b,
@@ -360,7 +360,7 @@ function mo({ children: n, options: e, onResizeStop: t, onChange: i, widgets: r
           h: y.h ?? 1,
           x: y.x ?? 0,
           y: y.y ?? 0,
-          meta: T.meta,
+          meta: k.meta,
           _originalContent: E,
           content: D ?? g("div", {
             children: "No content"
@@ -2336,7 +2336,7 @@ class _o {
  * see root license https://github.com/gridstack/gridstack.js/tree/master/LICENSE
  */
 const Q = new _o();
-class k {
+class T {
   /**
    * initializing the HTML element, or selector string, into a grid will return the grid. Calling it again will
    * simply return the existing instance (ignore any passed options). There is also an initAll() version that support
@@ -2353,8 +2353,8 @@ class k {
   static init(e = {}, t = ".grid-stack") {
     if (typeof document > "u")
       return null;
-    const i = k.getGridElement(t);
-    return i ? (i.gridstack || (i.gridstack = new k(i, p.cloneDeep(e))), i.gridstack) : (console.error(typeof t == "string" ? 'GridStack.initAll() no grid was found with selector "' + t + `" - element missing or wrong selector ?
+    const i = T.getGridElement(t);
+    return i ? (i.gridstack || (i.gridstack = new T(i, p.cloneDeep(e))), i.gridstack) : (console.error(typeof t == "string" ? 'GridStack.initAll() no grid was found with selector "' + t + `" - element missing or wrong selector ?
 Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the default selector.` : "GridStack.init() no grid element was passed."), null);
   }
   /**
@@ -2368,8 +2368,8 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    */
   static initAll(e = {}, t = ".grid-stack") {
     const i = [];
-    return typeof document > "u" || (k.getGridElements(t).forEach((r) => {
-      r.gridstack || (r.gridstack = new k(r, p.cloneDeep(e))), i.push(r.gridstack);
+    return typeof document > "u" || (T.getGridElements(t).forEach((r) => {
+      r.gridstack || (r.gridstack = new T(r, p.cloneDeep(e))), i.push(r.gridstack);
     }), i.length === 0 && console.error('GridStack.initAll() no grid was found with selector "' + t + `" - element missing or wrong selector ?
 Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the default selector.`)), i;
   }
@@ -2388,14 +2388,14 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       const o = i.gridstack;
       return t && (o.opts = { ...o.opts, ...t }), t.children !== void 0 && o.load(t.children), o;
     }
-    return (!e.classList.contains("grid-stack") || k.addRemoveCB) && (k.addRemoveCB ? i = k.addRemoveCB(e, t, !0, !0) : i = p.createDiv(["grid-stack", t.class], e)), k.init(t, i);
+    return (!e.classList.contains("grid-stack") || T.addRemoveCB) && (T.addRemoveCB ? i = T.addRemoveCB(e, t, !0, !0) : i = p.createDiv(["grid-stack", t.class], e)), T.init(t, i);
   }
   /** call this method to register your engine instead of the default one.
    * See instead `GridStackOptions.engineClass` if you only need to
    * replace just one instance.
    */
   static registerEngine(e) {
-    k.engineClass = e;
+    T.engineClass = e;
   }
   /**
    * @internal create placeholder DIV as needed
@@ -2449,7 +2449,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       delete t.cellHeight, this.cellHeight(c);
     }
     t.alwaysShowResizeHandle === "mobile" && (t.alwaysShowResizeHandle = fe), this._setStaticClass();
-    const l = t.engineClass || k.engineClass || Se;
+    const l = t.engineClass || T.engineClass || Se;
     if (this.engine = new l({
       column: this.getColumn(),
       float: t.float,
@@ -2492,7 +2492,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     if (e.ELEMENT_NODE)
       return console.error("V11: GridStack.addWidget() does not support HTMLElement anymore. use makeWidget()"), this.makeWidget(e);
     let t, i = e;
-    if (i.grid = this, i.el ? t = i.el : k.addRemoveCB ? t = k.addRemoveCB(this.el, e, !0, !1) : t = this.createWidgetDivs(i), !t)
+    if (i.grid = this, i.el ? t = i.el : T.addRemoveCB ? t = T.addRemoveCB(this.el, e, !0, !1) : t = this.createWidgetDivs(i), !t)
       return;
     if (i = t.gridstackNode, i && t.parentElement === this.el && this.engine.nodes.find((s) => s._id === i._id))
       return t;
@@ -2512,11 +2512,11 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     const t = p.createDiv(["grid-stack-item", this.opts.itemClass]), i = p.createDiv(["grid-stack-item-content"], t);
     return p.lazyLoad(e) ? e.visibleObservable || (e.visibleObservable = new IntersectionObserver(([r]) => {
       var s, o;
-      r.isIntersecting && ((s = e.visibleObservable) == null || s.disconnect(), delete e.visibleObservable, k.renderCB(i, e), (o = e.grid) == null || o.prepareDragDrop(e.el));
+      r.isIntersecting && ((s = e.visibleObservable) == null || s.disconnect(), delete e.visibleObservable, T.renderCB(i, e), (o = e.grid) == null || o.prepareDragDrop(e.el));
     }), window.setTimeout(() => {
       var r;
       return (r = e.visibleObservable) == null ? void 0 : r.observe(t);
-    })) : k.renderCB(i, e), t;
+    })) : T.renderCB(i, e), t;
   }
   /**
    * Convert an existing gridItem element into a sub-grid with the given (optional) options, else inherit them
@@ -2550,11 +2550,11 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     let l;
     t.column === "auto" && (l = !0, t.column = Math.max(s.w || 1, (i == null ? void 0 : i.w) || 1), delete t.columnOpts);
     let u = s.el.querySelector(".grid-stack-item-content"), c, d;
-    if (r && (this._removeDD(s.el), d = { ...s, x: 0, y: 0 }, p.removeInternalForSave(d), delete d.subGridOpts, s.content && (d.content = s.content, delete s.content), k.addRemoveCB ? c = k.addRemoveCB(this.el, d, !0, !1) : (c = p.createDiv(["grid-stack-item"]), c.appendChild(u), u = p.createDiv(["grid-stack-item-content"], s.el)), this.prepareDragDrop(s.el)), i) {
+    if (r && (this._removeDD(s.el), d = { ...s, x: 0, y: 0 }, p.removeInternalForSave(d), delete d.subGridOpts, s.content && (d.content = s.content, delete s.content), T.addRemoveCB ? c = T.addRemoveCB(this.el, d, !0, !1) : (c = p.createDiv(["grid-stack-item"]), c.appendChild(u), u = p.createDiv(["grid-stack-item-content"], s.el)), this.prepareDragDrop(s.el)), i) {
       const w = l ? t.column : s.w, S = s.h + i.h, N = s.el.style;
       N.transition = "none", this.update(s.el, { w, h: S }), setTimeout(() => N.transition = null);
     }
-    const h = s.subGrid = k.addGrid(u, t);
+    const h = s.subGrid = T.addGrid(u, t);
     return i != null && i._moving && (h._isTemp = !0), l && (h._autoColumn = !0), r && h.makeWidget(c, d), i && (i._moving ? window.setTimeout(() => p.simulateMouseEvent(i._event, "mouseenter", h.el), 0) : h.makeWidget(s.el, s)), this.resizeToContentCheck(!1, s), h;
   }
   /**
@@ -2581,7 +2581,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * NOTE2: nested grids will ALWAYS save to the container size to be in sync with parent.
    * @returns list of widgets or full grid option, including .children list of widgets
    */
-  save(e = !0, t = !1, i = k.saveCB, r) {
+  save(e = !0, t = !1, i = T.saveCB, r) {
     const s = this.engine.save(e, i, r);
     if (s.forEach((o) => {
       var a;
@@ -2636,7 +2636,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    *
    * @see {@link http://gridstackjs.com/demo/serialization.html} for complete example
    */
-  load(e, t = k.addRemoveCB || !0) {
+  load(e, t = T.addRemoveCB || !0) {
     e = p.cloneDeep(e);
     const i = this.getColumn();
     e.forEach((c) => {
@@ -2646,15 +2646,15 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     e.forEach((c) => {
       r = Math.max(r, (c.x || 0) + c.w);
     }), r > this.engine.defaultColumn && (this.engine.defaultColumn = r), r > i && (this.engine.nodes.length === 0 && this.responseLayout ? (this.engine.nodes = e, this.engine.columnChanged(r, i, this.responseLayout), e = this.engine.nodes, this.engine.nodes = [], delete this.responseLayout) : this.engine.cacheLayout(e, r, !0));
-    const s = k.addRemoveCB;
-    typeof t == "function" && (k.addRemoveCB = t);
+    const s = T.addRemoveCB;
+    typeof t == "function" && (T.addRemoveCB = t);
     const o = [];
     this.batchUpdate();
     const a = !this.engine.nodes.length, l = a && this.opts.animate;
     l && this.setAnimation(!1), !a && t && [...this.engine.nodes].forEach((d) => {
       if (!d.id)
         return;
-      p.find(e, d.id) || (k.addRemoveCB && k.addRemoveCB(this.el, d, !1, !1), o.push(d), this.removeWidget(d.el, !0, !1));
+      p.find(e, d.id) || (T.addRemoveCB && T.addRemoveCB(this.el, d, !1, !1), o.push(d), this.removeWidget(d.el, !0, !1));
     }), this.engine._loading = !0;
     const u = [];
     return this.engine.nodes = this.engine.nodes.filter((c) => p.find(e, c.id) ? (u.push(c), !1) : !0), e.forEach((c) => {
@@ -2666,7 +2666,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
           f && f.gridstack && f.gridstack.load(c.subGridOpts.children);
         }
       } else t && this.addWidget(c);
-    }), delete this.engine._loading, this.engine.removedNodes = o, this.batchUpdate(!1), delete this._ignoreLayoutsNodeChange, delete this.engine.skipCacheUpdate, s ? k.addRemoveCB = s : delete k.addRemoveCB, l && this.setAnimation(!0, !0), this;
+    }), delete this.engine._loading, this.engine.removedNodes = o, this.batchUpdate(!1), delete this._ignoreLayoutsNodeChange, delete this.engine.skipCacheUpdate, s ? T.addRemoveCB = s : delete T.addRemoveCB, l && this.setAnimation(!0, !0), this;
   }
   /**
    * use before calling a bunch of `addWidget()` to prevent un-necessary relayouts in between (more efficient)
@@ -2982,7 +2982,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * grid.makeWidget(element, {x: 0, y: 1, w: 4, h: 2});
    */
   makeWidget(e, t) {
-    const i = k.getElement(e);
+    const i = T.getElement(e);
     if (!i || i.gridstackNode)
       return i;
     i.parentElement || this.el.appendChild(i), this._prepareElement(i, !0, t);
@@ -3021,11 +3021,11 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * @param triggerEvent if `false` (quiet mode) element will not be added to removed list and no 'removed' callbacks will be called (Default? true).
    */
   removeWidget(e, t = !0, i = !0) {
-    return e ? (k.getElements(e).forEach((r) => {
+    return e ? (T.getElements(e).forEach((r) => {
       if (r.parentElement && r.parentElement !== this.el)
         return;
       let s = r.gridstackNode;
-      s || (s = this.engine.nodes.find((o) => r === o.el)), s && (t && k.addRemoveCB && k.addRemoveCB(this.el, s, !1, !1), delete r.gridstackNode, this._removeDD(r), this.engine.removeNode(s, t, i), t && r.parentElement && r.remove());
+      s || (s = this.engine.nodes.find((o) => r === o.el)), s && (t && T.addRemoveCB && T.addRemoveCB(this.el, s, !1, !1), delete r.gridstackNode, this._removeDD(r), this.engine.removeNode(s, t, i), t && r.parentElement && r.remove());
     }), i && (this._triggerRemoveEvent(), this._triggerChangeEvent()), this) : (console.error("Error: GridStack.removeWidget(undefined) called"), this);
   }
   /**
@@ -3035,7 +3035,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    */
   removeAll(e = !0, t = !0) {
     return this.engine.nodes.forEach((i) => {
-      e && k.addRemoveCB && k.addRemoveCB(this.el, i, !1, !1), delete i.el.gridstackNode, this.opts.staticGrid || this._removeDD(i.el);
+      e && T.addRemoveCB && T.addRemoveCB(this.el, i, !1, !1), delete i.el.gridstackNode, this.opts.staticGrid || this._removeDD(i.el);
     }), this.engine.removeAll(e, t), t && this._triggerRemoveEvent(), this;
   }
   /**
@@ -3101,7 +3101,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * });
    */
   update(e, t) {
-    return k.getElements(e).forEach((i) => {
+    return T.getElements(e).forEach((i) => {
       var c;
       const r = i == null ? void 0 : i.gridstackNode;
       if (!r)
@@ -3114,7 +3114,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
         a[d] = s[d] !== void 0 ? s[d] : r[d], delete s[d];
       })), !a && (s.minW || s.minH || s.maxW || s.maxH) && (a = {}), s.content !== void 0) {
         const d = i.querySelector(".grid-stack-item-content");
-        d && d.textContent !== s.content && (r.content = s.content, k.renderCB(d, s), (c = r.subGrid) != null && c.el && (d.appendChild(r.subGrid.el), r.subGrid._updateContainerHeight())), delete s.content;
+        d && d.textContent !== s.content && (r.content = s.content, T.renderCB(d, s), (c = r.subGrid) != null && c.el && (d.appendChild(r.subGrid.el), r.subGrid._updateContainerHeight())), delete s.content;
       }
       let l = !1, u = !1;
       for (const d in s)
@@ -3123,7 +3123,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
         const d = a.w !== void 0 && a.w !== r.w;
         this.moveNode(r, a), d && r.subGrid ? r.subGrid.onResize(this.hasAnimationCSS() ? r.w : void 0) : this.resizeToContentCheck(d, r), delete r._orig;
       }
-      (a || l) && this._writeAttr(i, r), u && this.prepareDragDrop(r.el), k.updateCB && k.updateCB(r);
+      (a || l) && this._writeAttr(i, r), u && this.prepareDragDrop(r.el), T.updateCB && T.updateCB(r);
     }), this;
   }
   moveNode(e, t) {
@@ -3162,7 +3162,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     if (!r)
       return;
     let s = t.h ? t.h * r : e.clientHeight, o;
-    if (t.resizeToContentParent && (o = e.querySelector(t.resizeToContentParent)), o || (o = e.querySelector(k.resizeToContentParent)), !o)
+    if (t.resizeToContentParent && (o = e.querySelector(t.resizeToContentParent)), o || (o = e.querySelector(T.resizeToContentParent)), !o)
       return;
     const a = e.clientHeight - o.clientHeight, l = t.h ? t.h * r - a : o.clientHeight;
     let u;
@@ -3176,7 +3176,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       {
         const x = o.firstElementChild;
         if (!x) {
-          console.error(`Error: GridStack.resizeToContent() widget id:${t.id} '${k.resizeToContentParent}'.firstElementChild is null, make sure to have a div like container. Skipping sizing.`);
+          console.error(`Error: GridStack.resizeToContent() widget id:${t.id} '${T.resizeToContentParent}'.firstElementChild is null, make sure to have a div like container. Skipping sizing.`);
           return;
         }
         u = x.getBoundingClientRect().height || l;
@@ -3191,7 +3191,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   }
   /** call the user resize (so they can do extra work) else our build in version */
   resizeToContentCBCheck(e) {
-    k.resizeToContentCB ? k.resizeToContentCB(e) : this.resizeToContent(e);
+    T.resizeToContentCB ? T.resizeToContentCB(e) : this.resizeToContent(e);
   }
   /**
    * Rotate widgets by swapping their width and height. This is typically called when the user presses 'r' during dragging.
@@ -3209,7 +3209,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * grid.rotate(widget, { left: 50, top: 30 });
    */
   rotate(e, t) {
-    return k.getElements(e).forEach((i) => {
+    return T.getElements(e).forEach((i) => {
       const r = i.gridstackNode;
       if (!p.canBeRotated(r))
         return;
@@ -3434,7 +3434,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   }
   /** @internal */
   static getGridElement(e) {
-    return k.getElement(e);
+    return T.getElement(e);
   }
   /** @internal */
   static getGridElements(e) {
@@ -3500,7 +3500,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * grid.movable('#fixed-widget', false);
    */
   movable(e, t) {
-    return this.opts.staticGrid ? this : (k.getElements(e).forEach((i) => {
+    return this.opts.staticGrid ? this : (T.getElements(e).forEach((i) => {
       const r = i.gridstackNode;
       r && (t ? delete r.noMove : r.noMove = !0, this.prepareDragDrop(r.el));
     }), this);
@@ -3521,7 +3521,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * grid.resizable('#fixed-size-widget', false);
    */
   resizable(e, t) {
-    return this.opts.staticGrid ? this : (k.getElements(e).forEach((i) => {
+    return this.opts.staticGrid ? this : (T.getElements(e).forEach((i) => {
       const r = i.gridstackNode;
       r && (t ? delete r.noResize : r.noResize = !0, this.prepareDragDrop(r.el));
     }), this);
@@ -3626,7 +3626,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   cancelDrag() {
     var t;
     const e = (t = this._placeholder) == null ? void 0 : t.gridstackNode;
-    e && (e._isExternal ? (e._isAboutToRemove = !0, this.engine.removeNode(e)) : e._isAboutToRemove && k._itemRemoving(e.el, !1), this.engine.restoreInitial());
+    e && (e._isExternal ? (e._isAboutToRemove = !0, this.engine.removeNode(e)) : e._isAboutToRemove && T._itemRemoving(e.el, !1), this.engine.restoreInitial());
   }
   /** @internal removes any drag&drop present (called during destroy) */
   _removeDD(e) {
@@ -3708,7 +3708,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       a.grid || (a.el || (a = { ...a }), a._isExternal = !0, o.gridstackNode = a);
       const l = a.w || Math.round(o.offsetWidth / t) || 1, u = a.h || Math.round(o.offsetHeight / e) || 1;
       return a.grid && a.grid !== this ? (s._gridstackNodeOrig || (s._gridstackNodeOrig = a), s.gridstackNode = a = { ...a, w: l, h: u, grid: this }, delete a.x, delete a.y, this.engine.cleanupNode(a).nodeBoundFix(a), a._initDD = a._isExternal = // DOM needs to be re-parented on a drop
-      a._temporaryRemoved = !0) : (a.w = l, a.h = u, a._temporaryRemoved = !0), k._itemRemoving(a.el, !1), Q.on(s, "drag", i), i(r, s, o), !1;
+      a._temporaryRemoved = !0) : (a.w = l, a.h = u, a._temporaryRemoved = !0), T._itemRemoving(a.el, !1), Q.on(s, "drag", i), i(r, s, o), !1;
     }).on(this.el, "dropout", (r, s, o) => {
       const a = (o == null ? void 0 : o.gridstackNode) || s.gridstackNode;
       return a && (!a.grid || a.grid === this) && (this._leave(s, o), this._isTemp && this.removeAsSubGrid(a)), !1;
@@ -3727,7 +3727,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       if (!a || (l && (this.engine.cleanupNode(a), a.grid = this), (h = a.grid) == null || delete h._isTemp, Q.off(s, "drag"), o !== s ? (o.remove(), s = o) : s.remove(), this._removeDD(s), !l))
         return !1;
       const d = (x = (f = a.subGrid) == null ? void 0 : f.el) == null ? void 0 : x.gridstack;
-      return p.copyPos(a, this._readAttr(this.placeholder)), p.removePositioningStyles(s), u && (a.content || a.subGridOpts || k.addRemoveCB) ? (delete a.el, s = this.addWidget(a)) : (this._prepareElement(s, !0, a), this.el.appendChild(s), this.resizeToContentCheck(!1, a), d && (d.parentGridNode = a), this._updateContainerHeight()), this.engine.addedNodes.push(a), this._triggerAddEvent(), this._triggerChangeEvent(), this.engine.endUpdate(), this._gsEventHandler.dropped && this._gsEventHandler.dropped({ ...r, type: "dropped" }, c && c.grid ? c : void 0, a), !1;
+      return p.copyPos(a, this._readAttr(this.placeholder)), p.removePositioningStyles(s), u && (a.content || a.subGridOpts || T.addRemoveCB) ? (delete a.el, s = this.addWidget(a)) : (this._prepareElement(s, !0, a), this.el.appendChild(s), this.resizeToContentCheck(!1, a), d && (d.parentGridNode = a), this._updateContainerHeight()), this.engine.addedNodes.push(a), this._triggerAddEvent(), this._triggerChangeEvent(), this.engine.endUpdate(), this._gsEventHandler.dropped && this._gsEventHandler.dropped({ ...r, type: "dropped" }, c && c.grid ? c : void 0, a), !1;
     }), this;
   }
   /** @internal mark item for removal */
@@ -3742,7 +3742,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     if (typeof this.opts.removable != "string")
       return this;
     const e = document.querySelector(this.opts.removable);
-    return e ? (!this.opts.staticGrid && !Q.isDroppable(e) && Q.droppable(e, this.opts.removableOptions).on(e, "dropover", (t, i) => k._itemRemoving(i, !0)).on(e, "dropout", (t, i) => k._itemRemoving(i, !1)), this) : this;
+    return e ? (!this.opts.staticGrid && !Q.isDroppable(e) && Q.droppable(e, this.opts.removableOptions).on(e, "dropover", (t, i) => T._itemRemoving(i, !0)).on(e, "dropout", (t, i) => T._itemRemoving(i, !1)), this) : this;
   }
   /**
    * prepares the element for drag&drop - this is normally called by makeWidget() unless are are delay loading
@@ -3864,31 +3864,31 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       return;
     i._temporaryRemoved = !0, this.engine.removeNode(i), i.el = i._isExternal && t ? t : e;
     const r = i._sidebarOrig;
-    i._isExternal && this.engine.cleanupNode(i), i._sidebarOrig = r, this.opts.removable === !0 && k._itemRemoving(e, !0), e._gridstackNodeOrig ? (e.gridstackNode = e._gridstackNodeOrig, delete e._gridstackNodeOrig) : i._isExternal && this.engine.restoreInitial();
+    i._isExternal && this.engine.cleanupNode(i), i._sidebarOrig = r, this.opts.removable === !0 && T._itemRemoving(e, !0), e._gridstackNodeOrig ? (e.gridstackNode = e._gridstackNodeOrig, delete e._gridstackNodeOrig) : i._isExternal && this.engine.restoreInitial();
   }
   // legacy method removed
   commit() {
     return xo(this, this.batchUpdate(!1), "commit", "batchUpdate", "5.2"), this;
   }
 }
-k.renderCB = (n, e) => {
+T.renderCB = (n, e) => {
   n && (e != null && e.content) && (n.textContent = e.content);
 };
-k.resizeToContentParent = ".grid-stack-item-content";
-k.Utils = p;
-k.Engine = Se;
-k.GDRev = "12.3.2";
-const kt = /* @__PURE__ */ new WeakMap();
+T.resizeToContentParent = ".grid-stack-item-content";
+T.Utils = p;
+T.Engine = Se;
+T.GDRev = "12.3.2";
+const Tt = /* @__PURE__ */ new WeakMap();
 function Eo({ children: n }) {
   const { _gridStack: { value: e, set: t }, options: i } = Kn(), r = I(/* @__PURE__ */ new Map()), s = I(null), o = I(i), a = K((c, d) => {
     if (d.id && d.grid) {
-      let h = kt.get(d.grid);
-      h || (h = /* @__PURE__ */ new Map(), kt.set(d.grid, h)), h.set(d.id, c), r.current.set(d.id, c);
+      let h = Tt.get(d.grid);
+      h || (h = /* @__PURE__ */ new Map(), Tt.set(d.grid, h)), h.set(d.id, c), r.current.set(d.id, c);
     }
   }, []), l = K(() => {
     if (s.current) {
-      k.renderCB = a;
-      const c = k.init(o.current, s.current);
+      T.renderCB = a;
+      const c = T.init(o.current, s.current);
       return c && o.current.handle && c.opts && (c.opts.handle = o.current.handle), c;
     }
     return null;
@@ -3899,7 +3899,7 @@ function Eo({ children: n }) {
   return yi(() => {
     if (!u(i, o.current) && e)
       try {
-        e.removeAll(!1), e.destroy(!1), r.current.clear(), kt.delete(e), o.current = i, t(null);
+        e.removeAll(!1), e.destroy(!1), r.current.clear(), Tt.delete(e), o.current = i, t(null);
       } catch (c) {
         console.error("Error destroying gridstack", c);
       }
@@ -3915,7 +3915,7 @@ function Eo({ children: n }) {
     value: B(() => ({
       getWidgetContainer: (c) => {
         if (e) {
-          const d = kt.get(e);
+          const d = Tt.get(e);
           if (d != null && d.has(c))
             return d.get(c) || null;
         }
@@ -4042,7 +4042,7 @@ const Do = (n, e, t) => g("div", {
     }
     return typeof y.content == "function" ? null : y.content;
   }, u = (y, b, D) => y.map((E) => {
-    const T = l(E, D), A = {
+    const k = l(E, D), A = {
       id: E.id,
       h: E.h ?? 1,
       w: E.w ?? 1,
@@ -4051,8 +4051,8 @@ const Do = (n, e, t) => g("div", {
       noResize: !b,
       locked: E.locked,
       meta: E.meta,
-      _originalContent: T,
-      content: o(T, E.meta, b)
+      _originalContent: k,
+      content: o(k, E.meta, b)
     };
     return E.x !== void 0 && (A.x = E.x), E.y !== void 0 && (A.y = E.y), A;
   }), [c, d] = W(u(n, e)), h = I(e), f = I(n), x = I(!1), v = I(/* @__PURE__ */ new Map()), w = I(n);
@@ -4093,9 +4093,9 @@ const Do = (n, e, t) => g("div", {
         E.set(m.id, R(_, O)), O ? v.current.set(m.id, O) : v.current.delete(m.id);
       }
     });
-    const T = new Set(n.map((m) => m.id));
+    const k = new Set(n.map((m) => m.id));
     v.current.forEach((m, _) => {
-      T.has(_) || v.current.delete(_);
+      k.has(_) || v.current.delete(_);
     });
     const A = Array.from(E.values()).some((m) => m) || D;
     y && !b && !A ? (x.current = !0, d((m) => m.map((_) => {
@@ -4232,7 +4232,7 @@ const hi = Di({
   "positive-strong": "p",
   "info-strong": "p",
   code: "code"
-}, ki = le(({ content: n, variant: e, align: t, className: i, as: r, ellipsis: s, noEllipsisTooltip: o, markdown: a, ...l }, u) => {
+}, Ti = le(({ content: n, variant: e, align: t, className: i, as: r, ellipsis: s, noEllipsisTooltip: o, markdown: a, ...l }, u) => {
   const c = r ?? Ao[e ?? "body"];
   if (s !== void 0)
     return g(Gr, {
@@ -4271,8 +4271,8 @@ const hi = Di({
     ref: u
   }, n);
 });
-ki.displayName = "Text";
-const Jn = le((n, e) => g(ki, {
+Ti.displayName = "Text";
+const Jn = le((n, e) => g(Ti, {
   ref: e,
   markdown: n.markdown ?? !0,
   ...n
@@ -4367,7 +4367,7 @@ const wc = [
       children: a
     })]
   });
-}, ko = () => M("div", {
+}, To = () => M("div", {
   className: "relative flex h-full w-full cursor-progress flex-col rounded-xl border border-solid border-f1-border-secondary bg-f1-background",
   children: [g("div", {
     className: "flex h-12 w-full items-center px-4",
@@ -4392,7 +4392,7 @@ const wc = [
   })]
 });
 Zn.displayName = "F0Widget";
-const To = jr(Zn, ko), zo = ({ children: n, title: e, draggable: t = !1, actions: i, aiButton: r }) => g(To, {
+const ko = jr(Zn, To), zo = ({ children: n, title: e, draggable: t = !1, actions: i, aiButton: r }) => g(ko, {
   title: e,
   draggable: t,
   actions: i,
@@ -4489,7 +4489,7 @@ const Ho = ({ title: n = "", description: e, titleLevel: t = "h2", children: i,
       `${n}: Children components must inherit from PageLayoutBlock or PageLayoutGroup. Found:`,
       r
     );
-}, Ti = le(({ children: n, onSort: e, ...t }, i) => {
+}, ki = le(({ children: n, onSort: e, ...t }, i) => {
   er("GroupLinear", n, ["block"]);
   const [r, s] = W(Lt.toArray(n));
   return H(() => {
@@ -4504,8 +4504,8 @@ const Ho = ({ title: n = "", description: e, titleLevel: t = "h2", children: i,
     }, a))
   });
 });
-Ti.displayName = "GroupLinear";
-Ti.__isPageLayoutGroup = !0;
+ki.displayName = "GroupLinear";
+ki.__isPageLayoutGroup = !0;
 function Go() {
   for (var n = arguments.length, e = new Array(n), t = 0; t < n; t++)
     e[t] = arguments[t];
@@ -5476,8 +5476,8 @@ class Li {
           } = ur(v), D = xa(v), E = {
             x: Math.min(w === F.Right ? D.right - D.width / 2 : D.right, Math.max(w === F.Right ? D.left : D.left + D.width / 2, d.x)),
             y: Math.min(w === F.Down ? D.bottom - D.height / 2 : D.bottom, Math.max(w === F.Down ? D.top : D.top + D.height / 2, d.y))
-          }, T = w === F.Right && !N || w === F.Left && !C, A = w === F.Down && !R || w === F.Up && !S;
-          if (T && E.x !== d.x) {
+          }, k = w === F.Right && !N || w === F.Left && !C, A = w === F.Down && !R || w === F.Up && !S;
+          if (k && E.x !== d.x) {
             const m = v.scrollLeft + h.x, _ = w === F.Right && m <= y.x || w === F.Left && m >= b.x;
             if (_ && !h.y) {
               v.scrollTo({
@@ -5784,7 +5784,7 @@ var Kt;
 (function(n) {
   n[n.TreeOrder = 0] = "TreeOrder", n[n.ReversedTreeOrder = 1] = "ReversedTreeOrder";
 })(Kt || (Kt = {}));
-function ka(n) {
+function Ta(n) {
   let {
     acceleration: e,
     activator: t = ut.Pointer,
@@ -5840,13 +5840,13 @@ function ka(n) {
         if (!E)
           continue;
         const {
-          direction: T,
+          direction: k,
           speed: A
         } = ba(b, E, N, e, h);
         for (const m of ["x", "y"])
-          f[m][T[m]] || (A[m] = 0, T[m] = 0);
+          f[m][k[m]] || (A[m] = 0, k[m] = 0);
         if (A.x > 0 || A.y > 0) {
-          v(), C.current = b, x(R, o), w.current = A, S.current = T;
+          v(), C.current = b, x(R, o), w.current = A, S.current = k;
           return;
         }
       }
@@ -5879,7 +5879,7 @@ function ka(n) {
     ]
   );
 }
-const Ta = {
+const ka = {
   x: {
     [q.Backward]: !1,
     [q.Forward]: !1
@@ -5897,7 +5897,7 @@ function za(n) {
   const i = $t(e);
   return wt((r) => {
     if (t || !i || !r)
-      return Ta;
+      return ka;
     const s = {
       x: Math.sign(e.x - i.x),
       y: Math.sign(e.y - i.y)
@@ -6555,7 +6555,7 @@ const tl = /* @__PURE__ */ no(function(e) {
     draggable: {
       active: D,
       nodes: E,
-      translate: T
+      translate: k
     },
     droppable: {
       containers: A
@@ -6577,7 +6577,7 @@ const tl = /* @__PURE__ */ no(function(e) {
     measuringScheduled: it
   } = La(Dt, {
     dragging: b,
-    dependencies: [T.x, T.y],
+    dependencies: [k.x, k.y],
     config: ie.droppable
   }), ce = Pa(E, D), Rt = B(() => U ? jt(U) : null, [U]), Oe = Fr(), _e = Ia(ce, ie.draggable.measure);
   el({
@@ -6604,8 +6604,8 @@ const tl = /* @__PURE__ */ no(function(e) {
     measure: ie.dragOverlay.measure
   }), Ge = (i = Ee.nodeRef.current) != null ? i : ce, $e = b ? (r = Ee.rect) != null ? r : $ : null, Gi = !!(Ee.nodeRef.current && Ee.rect), $i = Fa(Gi ? null : $), ai = pr(Ge ? ee(Ge) : null), Ae = Wa(b ? We ?? ce : null), St = Ua(Ae), Nt = br(f, {
     transform: {
-      x: T.x - $i.x,
-      y: T.y - $i.y,
+      x: k.x - $i.x,
+      y: k.y - $i.y,
       scaleX: 1,
       scaleY: 1
     },
@@ -6619,17 +6619,17 @@ const tl = /* @__PURE__ */ no(function(e) {
     scrollableAncestors: Ae,
     scrollableAncestorRects: St,
     windowRect: ai
-  }), ji = Rt ? qe(Rt, T) : null, Ui = Ga(Ae), zr = gn(Ui), Pr = gn(Ui, [$]), je = qe(Nt, zr), Ue = $e ? ha($e, Nt) : null, rt = O && Ue ? d({
+  }), ji = Rt ? qe(Rt, k) : null, Ui = Ga(Ae), zr = gn(Ui), Pr = gn(Ui, [$]), je = qe(Nt, zr), Ue = $e ? ha($e, Nt) : null, rt = O && Ue ? d({
     active: O,
     collisionRect: Ue,
     droppableRects: Ce,
     droppableContainers: Dt,
     pointerCoordinates: ji
-  }) : null, Ki = rr(rt, "id"), [ke, Xi] = W(null), Mr = Gi ? Nt : qe(Nt, Pr), Lr = da(Mr, (s = ke == null ? void 0 : ke.rect) != null ? s : null, $), li = I(null), Yi = K(
+  }) : null, Ki = rr(rt, "id"), [Te, Xi] = W(null), Mr = Gi ? Nt : qe(Nt, Pr), Lr = da(Mr, (s = Te == null ? void 0 : Te.rect) != null ? s : null, $), li = I(null), Yi = K(
     (Z, re) => {
       let {
         sensor: se,
-        options: Te
+        options: ke
       } = re;
       if (P.current == null)
         return;
@@ -6640,7 +6640,7 @@ const tl = /* @__PURE__ */ no(function(e) {
         active: P.current,
         activeNode: de,
         event: oe,
-        options: Te,
+        options: ke,
         // Sensors need to be instantiated with refs for arguments that change over time
         // otherwise they are frozen in time with the stale arguments
         context: ve,
@@ -6750,8 +6750,8 @@ const tl = /* @__PURE__ */ no(function(e) {
     },
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [E]
-  ), Ir = K((Z, re) => (se, Te) => {
-    const de = se.nativeEvent, oe = E.get(Te);
+  ), Ir = K((Z, re) => (se, ke) => {
+    const de = se.nativeEvent, oe = E.get(ke);
     if (
       // Another sensor is already instantiating
       P.current !== null || // No active draggable
@@ -6764,7 +6764,7 @@ const tl = /* @__PURE__ */ no(function(e) {
     };
     Z(se, re.options, ye) === !0 && (de.dndKit = {
       capturedBy: re.sensor
-    }, P.current = Te, Yi(se, re));
+    }, P.current = ke, Yi(se, re));
   }, [E, Yi]), qi = Ma(c, Ir);
   $a(c), ge(() => {
     $ && R === Le.Initializing && y(Le.Initialized);
@@ -6775,7 +6775,7 @@ const tl = /* @__PURE__ */ no(function(e) {
       } = G.current, {
         active: re,
         activatorEvent: se,
-        collisions: Te,
+        collisions: ke,
         over: de
       } = ve.current;
       if (!re || !se)
@@ -6783,7 +6783,7 @@ const tl = /* @__PURE__ */ no(function(e) {
       const oe = {
         active: re,
         activatorEvent: se,
-        collisions: Te,
+        collisions: ke,
         delta: {
           x: je.x,
           y: je.y
@@ -6805,14 +6805,14 @@ const tl = /* @__PURE__ */ no(function(e) {
         active: Z,
         activatorEvent: re,
         collisions: se,
-        droppableContainers: Te,
+        droppableContainers: ke,
         scrollAdjustedTranslate: de
       } = ve.current;
       if (!Z || P.current == null || !re || !de)
         return;
       const {
         onDragOver: oe
-      } = G.current, ye = Te.get(Ki), Ke = ye && ye.rect.current ? {
+      } = G.current, ye = ke.get(Ki), Ke = ye && ye.rect.current ? {
         id: ye.id,
         rect: ye.rect.current,
         data: ye.data,
@@ -6848,16 +6848,16 @@ const tl = /* @__PURE__ */ no(function(e) {
       draggingNode: Ge,
       draggingNodeRect: $e,
       droppableContainers: A,
-      over: ke,
+      over: Te,
       scrollableAncestors: Ae,
       scrollAdjustedTranslate: je
     }, _.current = {
       initial: $e,
       translated: Ue
     };
-  }, [O, ce, rt, Ue, E, Ge, $e, Ce, A, ke, Ae, je]), ka({
+  }, [O, ce, rt, Ue, E, Ge, $e, Ce, A, Te, Ae, je]), Ta({
     ...Oe,
-    delta: T,
+    delta: k,
     draggingRect: Ue,
     pointerCoordinates: ji,
     scrollableAncestors: Ae,
@@ -6874,14 +6874,14 @@ const tl = /* @__PURE__ */ no(function(e) {
     draggableNodes: E,
     droppableContainers: A,
     droppableRects: Ce,
-    over: ke,
+    over: Te,
     measureDroppableContainers: Be,
     scrollableAncestors: Ae,
     scrollableAncestorRects: St,
     measuringConfiguration: ie,
     measuringScheduled: it,
     windowRect: ai
-  }), [O, ce, $, U, rt, nt, Ee, E, A, Ce, ke, Be, Ae, St, ie, it, ai]), Br = B(() => ({
+  }), [O, ce, $, U, rt, nt, Ee, E, A, Ce, Te, Be, Ae, St, ie, it, ai]), Br = B(() => ({
     activatorEvent: U,
     activators: qi,
     active: O,
@@ -6891,9 +6891,9 @@ const tl = /* @__PURE__ */ no(function(e) {
     },
     dispatch: S,
     draggableNodes: E,
-    over: ke,
+    over: Te,
     measureDroppableContainers: Be
-  }), [U, qi, O, $, S, ne, E, ke, Be]);
+  }), [U, qi, O, $, S, ne, E, Te, Be]);
   return L.createElement(nr.Provider, {
     value: C
   }, L.createElement(_t.Provider, {
@@ -6946,8 +6946,8 @@ function rl(n) {
       activatorNode: R,
       data: D
     }), () => {
-      const T = d.get(e);
-      T && T.key === s && d.delete(e);
+      const k = d.get(e);
+      k && k.key === s && d.delete(e);
     }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [d, e]
@@ -7016,8 +7016,8 @@ function al(n) {
   ), C = ri({
     callback: N,
     disabled: x || !o
-  }), R = K((E, T) => {
-    C && (T && (C.unobserve(T), d.current = !1), E && C.observe(E));
+  }), R = K((E, k) => {
+    C && (k && (C.unobserve(k), d.current = !1), E && C.observe(E));
   }, [C]), [y, b] = Gt(R), D = vt(e);
   return H(() => {
     !C || !y.current || (C.disconnect(), d.current = !1, C.observe(y.current));
@@ -7316,12 +7316,12 @@ const xl = /* @__PURE__ */ L.memo((n) => {
     scrollableAncestorRects: R,
     transform: b,
     windowRect: y
-  }), T = Bi(h), A = vl({
+  }), k = Bi(h), A = vl({
     config: i,
     draggableNodes: x,
     droppableContainers: v,
     measuringConfiguration: N
-  }), m = T ? w.setRef : void 0;
+  }), m = k ? w.setRef : void 0;
   return L.createElement(dl, null, L.createElement(ll, {
     animation: A
   }, d && D ? L.createElement(fl, {
@@ -7333,7 +7333,7 @@ const xl = /* @__PURE__ */ L.memo((n) => {
     adjustScale: e,
     className: l,
     transition: s,
-    rect: T,
+    rect: k,
     style: {
       zIndex: u,
       ...r
@@ -7351,7 +7351,7 @@ function wl(n, e) {
     return s && (t[r] = s), t;
   }, Array(n.length));
 }
-function Tt(n) {
+function kt(n) {
   return n !== null && n >= 0;
 }
 function Cl(n, e) {
@@ -7496,7 +7496,7 @@ function Al(n) {
     s && o(null);
   }, [s]), s;
 }
-function kl(n) {
+function Tl(n) {
   let {
     animateLayoutChanges: e = Rl,
     attributes: t,
@@ -7518,7 +7518,7 @@ function kl(n) {
     overIndex: w,
     useDragOverlay: S,
     strategy: N
-  } = we(_r), C = Tl(i, f), R = c.indexOf(o), y = B(() => ({
+  } = we(_r), C = kl(i, f), R = c.indexOf(o), y = B(() => ({
     sortable: {
       containerId: d,
       index: R,
@@ -7528,7 +7528,7 @@ function kl(n) {
   }), [d, r, R, c]), b = B(() => c.slice(c.indexOf(o)), [c, o]), {
     rect: D,
     node: E,
-    isOver: T,
+    isOver: k,
     setNodeRef: A
   } = al({
     id: o,
@@ -7557,13 +7557,13 @@ function kl(n) {
       ...t
     },
     disabled: C.draggable
-  }), Dt = Go(A, V), ie = !!m, Ce = ie && !x && Tt(h) && Tt(w), Be = !S && U, it = Be && Ce ? ne : null, Rt = Ce ? it ?? (a ?? N)({
+  }), Dt = Go(A, V), ie = !!m, Ce = ie && !x && kt(h) && kt(w), Be = !S && U, it = Be && Ce ? ne : null, Rt = Ce ? it ?? (a ?? N)({
     rects: v,
     activeNodeRect: O,
     activeIndex: h,
     overIndex: w,
     index: R
-  }) : null, Oe = Tt(h) && Tt(w) ? s({
+  }) : null, Oe = kt(h) && kt(w) ? s({
     id: o,
     items: c,
     activeIndex: h,
@@ -7614,7 +7614,7 @@ function kl(n) {
     index: R,
     newIndex: Oe,
     items: c,
-    isOver: T,
+    isOver: k,
     isSorting: ie,
     isDragging: U,
     listeners: X,
@@ -7642,7 +7642,7 @@ function kl(n) {
       });
   }
 }
-function Tl(n, e) {
+function kl(n, e) {
   var t, i;
   return typeof n == "boolean" ? {
     draggable: n,
@@ -7725,7 +7725,7 @@ function Ml(n, e) {
   return !Xt(n) || !Xt(e) || !Dr(n, e) ? !1 : n.data.current.sortable.index < e.data.current.sortable.index;
 }
 const yn = ({ id: n, children: e }) => {
-  const { attributes: t, listeners: i, setNodeRef: r, transform: s, transition: o } = kl({
+  const { attributes: t, listeners: i, setNodeRef: r, transform: s, transition: o } = Tl({
     id: n
   }), a = {
     transform: He.Translate.toString(s),
@@ -7810,7 +7810,7 @@ const Ll = le(function({ children: e, aside: t, header: i, variant: r = "main-as
   Page: Re("Page", Ll),
   Block: Re("Block", Qt),
   BlockContent: Re("BlockContent", Bo),
-  Group: Re("Group", Ti),
+  Group: Re("Group", ki),
   GroupGrid: Re("GroupGrid", Zt),
   GroupMasonry: Re("GroupMasonry", Wi)
 }, Ec = me({
@@ -8289,7 +8289,7 @@ Ie(Et, "getComposedData", function(n) {
       dataKey: f,
       type: u
     });
-    var T = Ji({
+    var k = Ji({
       axis: e,
       ticks: o,
       bandSize: w,
@@ -8305,9 +8305,9 @@ Ie(Et, "getComposedData", function(n) {
       dataKey: h
     }), m = D !== "-" ? i.scale(D) : v, _ = Math.sqrt(Math.max(m, 0) / Math.PI);
     return ue(ue({}, C), {}, {
-      cx: T,
+      cx: k,
       cy: A,
-      x: T - _,
+      x: k - _,
       y: A - _,
       xAxis: e,
       yAxis: t,
@@ -8322,7 +8322,7 @@ Ie(Et, "getComposedData", function(n) {
       },
       tooltipPayload: E,
       tooltipPosition: {
-        x: T,
+        x: k,
         y: A
       },
       payload: C
@@ -8374,7 +8374,7 @@ const nc = (n) => {
 }, rc = ({ dataConfig: n, data: e, xAxis: t, yAxis: i = {
   hide: !0
 }, label: r = !1, hideTooltip: s = !1, hideGrid: o = !1, aspect: a, legend: l, showValueUnderLabel: u = !1, bar: c, line: d, scatter: h, onClick: f }, x) => {
-  var D, E, T, A;
+  var D, E, k, A;
   const v = us(e), w = c != null && c.categories ? Array.isArray(c.categories) ? c.categories : [c.categories] : [], S = d != null && d.categories ? Array.isArray(d.categories) ? d.categories : [d.categories] : [], N = h != null && h.categories ? Array.isArray(h.categories) ? h.categories : [h.categories] : [], C = [...w, ...S, ...N], R = Math.max(...v.flatMap((m) => C.map((_) => hs(i != null && i.tickFormatter ? i.tickFormatter(`${m[_]}`) : `${m[_]}`)))), y = [c, d, h].filter((m) => (m == null ? void 0 : m.axisPosition) === "left"), b = [c, d, h].filter((m) => (m == null ? void 0 : m.axisPosition) === "right");
   return g(fs, {
     config: n,
@@ -8423,7 +8423,7 @@ const nc = (n) => {
         yAxisId: "right",
         orientation: "right",
         tick: !0,
-        width: i.width ?? R + 20 + (y.length > 0 && ((T = b[0]) != null && T.axisLabel) ? 20 : 0),
+        width: i.width ?? R + 20 + (y.length > 0 && ((k = b[0]) != null && k.axisLabel) ? 20 : 0),
         hide: i.hide || b.some((m) => m == null ? void 0 : m.hideAxis),
         label: (A = b[0]) != null && A.axisLabel ? {
           value: b[0].axisLabel,
@@ -8493,7 +8493,7 @@ const nc = (n) => {
       })]
     })
   });
-}, sc = kn(rc), oc = ({ value: n, max: e = 100, label: t, color: i }, r) => {
+}, sc = Tn(rc), oc = ({ value: n, max: e = 100, label: t, color: i }, r) => {
   const s = i ? ct(i) : ct("categorical-1"), o = n / e * 100;
   return M("div", {
     className: "flex items-center space-x-2",
@@ -8514,7 +8514,7 @@ const nc = (n) => {
       children: t
     })]
   });
-}, ac = kn(oc), Sc = me(
+}, ac = Tn(oc), Sc = me(
   {
     name: "AreaChart",
     type: "info"
@@ -8538,13 +8538,13 @@ const nc = (n) => {
     type: "info"
   },
   Rs
-), kc = me(
+), Tc = me(
   {
     name: "PieChart",
     type: "info"
   },
   Ss
-), Tc = me(
+), kc = me(
   {
     name: "VerticalBarChart",
     type: "info"
@@ -8564,7 +8564,19 @@ const nc = (n) => {
   sc
 ), Mc = Os.filter(
   (n) => n !== "ai"
-), Lc = Tn, Ic = ["default", "outline", "neutral"], Hc = Tn, Bc = ["sm", "md", "lg"], Fc = As, Ei = ({ count: n, list: e }) => {
+), Lc = kn, Ic = ["default", "outline", "neutral"], Hc = kn, Bc = ["sm", "md", "lg"], Fc = ["compact", "expanded"], Wc = As, Gc = [
+  "viridian",
+  "malibu",
+  "yellow",
+  "purple",
+  "lilac",
+  "barbie",
+  "smoke",
+  "army",
+  "flubber",
+  "indigo",
+  "camel"
+], Ei = ({ count: n, list: e }) => {
   const [t, i] = W(!1), r = g(Mt, {
     label: `+${n}`
   });
@@ -8574,7 +8586,7 @@ const nc = (n) => {
     children: [g(Pn, {
       asChild: !0,
       children: g("button", {
-        className: ks("inline-flex flex-shrink-0 items-center"),
+        className: Ts("inline-flex flex-shrink-0 items-center"),
         children: r
       })
     }), g(Mn, {
@@ -8596,9 +8608,9 @@ const nc = (n) => {
   }) : r;
 };
 Ei.displayName = "ChipCounter";
-const kr = ({ chips: n, max: e = 4, remainingCount: t, layout: i = "compact" }) => {
+const Tr = ({ chips: n, max: e = 4, remainingCount: t, layout: i = "compact" }) => {
   if (i === "fill")
-    return g(Ts, {
+    return g(ks, {
       items: n,
       renderListItem: (l) => g(Mt, {
         ...l
@@ -8623,14 +8635,14 @@ const kr = ({ chips: n, max: e = 4, remainingCount: t, layout: i = "compact" })
     })]
   });
 };
-kr.displayName = "F0ChipList";
-const Wc = Re("F0ChipList", kr), Gc = zs, lc = le((n, e) => g(ki, {
+Tr.displayName = "F0ChipList";
+const $c = Re("F0ChipList", Tr), jc = zs, lc = le((n, e) => g(Ti, {
   ref: e,
   variant: "heading",
   ...n
 }));
 lc.displayName = "F0Heading";
-const $c = Re(
+const Uc = Re(
   "F0GridStack",
   Ai
 ), cc = ({ benefits: n }) => g("div", {
@@ -8647,7 +8659,7 @@ const $c = Re(
   }), g("span", {
     children: n
   })]
-}), Tr = le(({ title: n, image: e, benefits: t, actions: i, withShadow: r = !0, module: s, moduleName: o, tag: a, promoTag: l }, u) => M("div", {
+}), kr = le(({ title: n, image: e, benefits: t, actions: i, withShadow: r = !0, module: s, moduleName: o, tag: a, promoTag: l }, u) => M("div", {
   ref: u,
   className: j("bg-white flex flex-row rounded-xl border border-f1-border-secondary", r && "shadow-md"),
   children: [g("div", {
@@ -8693,7 +8705,7 @@ const $c = Re(
     })]
   })]
 }));
-Tr.displayName = "ProductBlankslate";
+kr.displayName = "ProductBlankslate";
 function uc({ isOpen: n, onClose: e, title: t, children: i, module: r, portalContainer: s }) {
   const [o, a] = W(n);
   return H(() => {
@@ -8732,7 +8744,7 @@ function uc({ isOpen: n, onClose: e, title: t, children: i, module: r, portalCon
     })
   });
 }
-function jc({ isOpen: n, onClose: e, title: t, image: i, benefits: r, errorMessage: s, successMessage: o, loadingState: a, nextSteps: l, closeLabel: u, primaryAction: c, modalTitle: d, modalModule: h, secondaryAction: f, portalContainer: x, tag: v, promoTag: w, showResponseDialog: S = !0 }) {
+function Kc({ isOpen: n, onClose: e, title: t, image: i, benefits: r, errorMessage: s, successMessage: o, loadingState: a, nextSteps: l, closeLabel: u, primaryAction: c, modalTitle: d, modalModule: h, secondaryAction: f, portalContainer: x, tag: v, promoTag: w, showResponseDialog: S = !0 }) {
   const [N, C] = W(n), [R, y] = W(null), [b, D] = W(!1), E = async () => {
     if (c != null && c.onClick) {
       D(!0);
@@ -8744,19 +8756,19 @@ function jc({ isOpen: n, onClose: e, title: t, image: i, benefits: r, errorMessa
         D(!1);
       }
     }
-  }, T = () => {
+  }, k = () => {
     C(!1), e == null || e();
   }, A = b;
   return M(Vt, {
     children: [g(uc, {
       isOpen: N,
-      onClose: T,
+      onClose: k,
       title: d,
       module: h,
       portalContainer: x,
       children: g("div", {
         className: "pb-4 pl-4",
-        children: g(Tr, {
+        children: g(kr, {
           title: t,
           image: i,
           benefits: r,
@@ -8785,7 +8797,7 @@ function jc({ isOpen: n, onClose: e, title: t, image: i, benefits: r, errorMessa
     }), R && S && g(Fn, {
       open: !0,
       onClose: () => {
-        T(), y(null);
+        k(), y(null);
       },
       success: R === "success",
       errorMessage: s,
@@ -8897,7 +8909,7 @@ const fc = le(function({ primaryAction: e, secondaryAction: t, ...i }, r) {
   });
 });
 fc.displayName = "UpsellingBanner";
-function Uc({ isOpen: n, setIsOpen: e, label: t, variant: i = "promote", size: r = "md", showIcon: s = !0, side: o = "right", align: a = "center", icon: l = js, mediaUrl: u, title: c, description: d, width: h = "300px", trackVisibility: f, actions: x, onClick: v, hideLabel: w = !1 }) {
+function Xc({ isOpen: n, setIsOpen: e, label: t, variant: i = "promote", size: r = "md", showIcon: s = !0, side: o = "right", align: a = "center", icon: l = js, mediaUrl: u, title: c, description: d, width: h = "300px", trackVisibility: f, actions: x, onClick: v, hideLabel: w = !1 }) {
   const [S, N] = W(!1), [C, R] = W(null), [y, b] = W(null), D = (_) => {
     e(_), v && v();
   }, E = async (_) => {
@@ -8909,7 +8921,7 @@ function Uc({ isOpen: n, setIsOpen: e, label: t, variant: i = "promote", size: r
         N(!0), R("error");
       }
     }
-  }, T = () => {
+  }, k = () => {
     R(null), N(!1), b(null), e(!1);
   }, A = n && !S, m = x == null ? void 0 : x.map((_) => _.type === "upsell" ? {
     ..._,
@@ -8947,7 +8959,7 @@ function Uc({ isOpen: n, setIsOpen: e, label: t, variant: i = "promote", size: r
       })]
     }), (y == null ? void 0 : y.type) === "upsell" && y.showConfirmation && C && g(Fn, {
       open: !0,
-      onClose: T,
+      onClose: k,
       success: C === "success",
       errorMessage: y.errorMessage,
       successMessage: y.successMessage,
@@ -8977,7 +8989,7 @@ const gc = Ne(null), pc = ({ children: n, fullScreen: e = !0 }) => {
 }, mc = ({ children: n }) => g(Qs, {
   reducedMotion: "user",
   children: n
-}), Kc = ({ children: n, layout: e, link: t, privacyModeInitiallyEnabled: i, image: r, i18n: s, l10n: o, isDev: a = !1, dataCollectionStorageHandler: l, showExperimentalWarnings: u = !1 }) => g(mc, {
+}), Yc = ({ children: n, layout: e, link: t, privacyModeInitiallyEnabled: i, image: r, i18n: s, l10n: o, isDev: a = !1, dataCollectionStorageHandler: l, showExperimentalWarnings: u = !1 }) => g(mc, {
   children: g(Us, {
     isDev: a,
     showExperimentalWarnings: u,
@@ -9006,7 +9018,7 @@ const gc = Ne(null), pc = ({ children: n, fullScreen: e = !0 }) => {
       })
     })
   })
-}), wn = (n) => `datacollection-${n}`, Xc = {
+}), wn = (n) => `datacollection-${n}`, qc = {
   get: async (n) => JSON.parse(
     localStorage.getItem(wn(n)) ?? "{}"
   ),
@@ -9016,102 +9028,104 @@ const gc = Ne(null), pc = ({ children: n, fullScreen: e = !0 }) => {
 };
 export {
   Sc as AreaChart,
-  Vc as Await,
+  Zc as Await,
   Nc as BarChart,
   Oc as CategoryBarChart,
   Pc as ComboChart,
   Cc as Dashboard,
-  Jc as DndProvider,
-  Zc as EmojiImage,
-  Qc as F0Avatar,
-  ed as F0AvatarAlert,
-  td as F0AvatarCompany,
-  id as F0AvatarDate,
-  nd as F0AvatarEmoji,
-  rd as F0AvatarFile,
-  sd as F0AvatarIcon,
-  od as F0AvatarList,
+  Qc as DndProvider,
+  ed as EmojiImage,
+  td as F0Avatar,
+  id as F0AvatarAlert,
+  nd as F0AvatarCompany,
+  rd as F0AvatarDate,
+  sd as F0AvatarEmoji,
+  od as F0AvatarFile,
+  ad as F0AvatarIcon,
+  ld as F0AvatarList,
   Hn as F0AvatarModule,
-  ad as F0AvatarPerson,
-  ld as F0AvatarTeam,
+  cd as F0AvatarPerson,
+  dd as F0AvatarTeam,
   Ve as F0Button,
-  cd as F0ButtonDropdown,
-  dd as F0ButtonToggle,
-  ud as F0Card,
-  hd as F0Checkbox,
-  Wc as F0ChipList,
-  fd as F0DatePicker,
-  gd as F0EventCatcherProvider,
-  $c as F0GridStack,
+  ud as F0ButtonDropdown,
+  hd as F0ButtonToggle,
+  fd as F0Card,
+  gd as F0Checkbox,
+  $c as F0ChipList,
+  pd as F0DatePicker,
+  md as F0EventCatcherProvider,
+  Uc as F0GridStack,
   lc as F0Heading,
   Dn as F0Icon,
-  pd as F0Link,
-  Kc as F0Provider,
-  md as F0Select,
-  vd as F0TagAlert,
-  yd as F0TagBalance,
-  bd as F0TagCompany,
-  xd as F0TagDot,
-  wd as F0TagList,
-  Cd as F0TagPerson,
+  vd as F0Link,
+  Yc as F0Provider,
+  yd as F0Select,
+  bd as F0TagAlert,
+  xd as F0TagBalance,
+  wd as F0TagCompany,
+  Cd as F0TagDot,
+  _d as F0TagList,
+  Ed as F0TagPerson,
   Ps as F0TagRaw,
   Ms as F0TagStatus,
-  _d as F0TagTeam,
+  Dd as F0TagTeam,
   Jn as F0Text,
-  Ed as GROUP_ID_SYMBOL,
+  Rd as GROUP_ID_SYMBOL,
   Rc as HomeLayout,
   _c as Layout,
   Ac as LineChart,
-  Dd as OneFilterPicker,
-  kc as PieChart,
+  Sd as OneFilterPicker,
+  Tc as PieChart,
   Vs as PrivacyModeProvider,
-  Tr as ProductBlankslate,
-  Rd as ProductCard,
-  jc as ProductModal,
+  kr as ProductBlankslate,
+  Nd as ProductCard,
+  Kc as ProductModal,
   hc as ProductWidget,
   zc as ProgressBarChart,
   Ec as StandardLayout,
-  Sd as TagCounter,
+  Od as Tag,
+  Ad as TagCounter,
   Dc as TwoColumnLayout,
   Fn as UpsellRequestResponseDialog,
   fc as UpsellingBanner,
   Wn as UpsellingButton,
-  Uc as UpsellingPopover,
-  Tc as VerticalBarChart,
+  Xc as UpsellingPopover,
+  kc as VerticalBarChart,
   wc as avatarVariants,
-  Nd as buildTranslations,
+  Td as buildTranslations,
   Hc as buttonDropdownSizes,
   Ic as buttonDropdownVariants,
   Lc as buttonSizes,
   Bc as buttonToggleSizes,
+  Fc as buttonToggleVariants,
   Mc as buttonVariants,
-  Od as createAtlaskitDriver,
-  Ad as createDataSourceDefinition,
+  kd as createAtlaskitDriver,
+  zd as createDataSourceDefinition,
   Ro as createPageLayoutBlock,
   So as createPageLayoutBlockGroup,
-  Xc as dataCollectionLocalStorageHandler,
-  Gc as datepickerSizes,
-  Zd as defaultTranslations,
+  qc as dataCollectionLocalStorageHandler,
+  jc as datepickerSizes,
+  eu as defaultTranslations,
   Re as experimental,
-  kd as getAnimationVariants,
-  Td as getDataSourcePaginationType,
-  zd as getEmojiLabel,
-  Pd as isInfiniteScrollPagination,
-  Md as isPageBasedPagination,
-  Fc as linkVariants,
-  Ld as modules,
-  Id as predefinedPresets,
-  Hd as selectSizes,
-  Bd as tagDotColors,
-  Fd as useData,
-  Wd as useDataSource,
-  Gd as useDndEvents,
-  $d as useDraggable,
-  jd as useDroppableList,
-  Ud as useEmojiConfetti,
-  Kd as useGroups,
-  Xd as usePrivacyMode,
-  Yd as useReducedMotion,
-  qd as useSelectable,
-  Vd as useXRay
+  Pd as getAnimationVariants,
+  Md as getDataSourcePaginationType,
+  Ld as getEmojiLabel,
+  Id as isInfiniteScrollPagination,
+  Hd as isPageBasedPagination,
+  Wc as linkVariants,
+  Bd as modules,
+  Fd as predefinedPresets,
+  Wd as selectSizes,
+  Gc as tagDotColors,
+  Gd as useData,
+  $d as useDataSource,
+  jd as useDndEvents,
+  Ud as useDraggable,
+  Kd as useDroppableList,
+  Xd as useEmojiConfetti,
+  Yd as useGroups,
+  qd as usePrivacyMode,
+  Vd as useReducedMotion,
+  Jd as useSelectable,
+  Zd as useXRay
 };