react-panel-layout 0.5.1 → 0.5.2

package/dist/{GridLayout-BzrIDrC9.js → GridLayout-CJTKq7Mp.js}

@@ -1,8 +1,8 @@
-import { jsxs as H, Fragment as N, jsx as h } from "react/jsx-runtime";
+import { jsxs as H, Fragment as _, jsx as h } from "react/jsx-runtime";
 import * as i from "react";
-import { F as Pt, e as yt, a as Lt, b as Mt, f as Dt, d as Ut } from "./FloatingPanelFrame-6W5OexYe.js";
+import { F as Pt, e as yt, a as Lt, b as Mt, f as Dt, d as Ut } from "./FloatingPanelFrame-lLg-Lpg7.js";
 import { C as jt, D as Kt, o as Zt, p as qt, q as Jt, r as Qt, s as te, G as Y, t as T, u as ee, v as ne, w as oe, R as ut, x as re, y as Q } from "./styles-CA2_zLZt.js";
-import { a as se, u as ie } from "./usePivot-BvOGxLQQ.js";
+import { a as se, u as ie } from "./usePivot-CgQxB8rc.js";
 import { createPortal as ae } from "react-dom";
 import { u as It } from "./useIsomorphicLayoutEffect-DhmEnmZ_.js";
 const ce = () => {
@@ -114,7 +114,7 @@ const dt = {
       children: s
     }
   )
-] }) : /* @__PURE__ */ h(N, { children: s }), me = ({ header: t, dismissible: e, onClose: n }) => {
+] }) : /* @__PURE__ */ h(_, { children: s }), me = ({ header: t, dismissible: e, onClose: n }) => {
   if (!t)
     return null;
   const o = t.showCloseButton ?? !0, r = pe(e, o);
@@ -162,7 +162,7 @@ const dt = {
     right: "translateX(0)",
     top: "translateY(0)",
     bottom: "translateY(0)"
-  }, $ = i.useMemo(() => {
+  }, N = i.useMemo(() => {
     const I = ge(w, C, z), R = {
       ...fe,
       ...m ? { position: "absolute" } : { position: "fixed" },
@@ -184,14 +184,14 @@ const dt = {
     const I = L === "left" || L === "right", R = { borderRadius: 0 };
     return I && (R.height = "100%"), R;
   }, [L]);
-  return /* @__PURE__ */ H(N, { children: [
+  return /* @__PURE__ */ H(_, { children: [
     /* @__PURE__ */ h("div", { style: D, onClick: l ? o : void 0 }),
     /* @__PURE__ */ h(
       "div",
       {
         "data-layer-id": t,
         "data-placement": L,
-        style: $,
+        style: N,
         role: "dialog",
         "aria-modal": l ? !0 : void 0,
         "aria-hidden": n ? void 0 : !0,
@@ -227,7 +227,7 @@ const dt = {
       t(), n && await be(n, o);
       return;
   }
-}, Vn = (t) => {
+}, Xn = (t) => {
   const [e, n] = i.useState({}), o = i.useRef(t);
   o.current = t;
   const r = i.useCallback(
@@ -294,7 +294,7 @@ const dt = {
       r.set(s.id, () => e.close(s.id));
     }), r;
   }, [n, e.close]);
-  return /* @__PURE__ */ h(N, { children: n.map((r) => {
+  return /* @__PURE__ */ h(_, { children: n.map((r) => {
     if (!r.drawer)
       return null;
     const s = e.state(r.id), u = o.get(r.id);
@@ -352,7 +352,7 @@ const dt = {
 }, Nt = i.createContext(null), $t = ({ layerId: t, children: e }) => {
   const n = i.useMemo(() => ({ layerId: t }), [t]);
   return /* @__PURE__ */ h(Nt.Provider, { value: n, children: e });
-}, Xn = () => {
+}, Un = () => {
   const t = i.useContext(Nt);
   if (!t)
     throw new Error("useLayerInstance must be used within a LayerInstanceProvider.");
@@ -447,7 +447,7 @@ const dt = {
 }, De = ({ header: t, draggable: e, chrome: n, onClose: o, children: r }) => n ? /* @__PURE__ */ H(Pt, { style: { height: "100%", width: "100%" }, children: [
   /* @__PURE__ */ h(Me, { header: t, draggable: e, onClose: o }),
   /* @__PURE__ */ h(yt, { style: { flex: 1, display: "flex", flexDirection: "column" }, children: r })
-] }) : /* @__PURE__ */ h(N, { children: r }), _t = ({ id: t, config: e, onClose: n, children: o }) => {
+] }) : /* @__PURE__ */ h(_, { children: r }), _t = ({ id: t, config: e, onClose: n, children: o }) => {
   const r = e.chrome ?? !1, s = e.draggable ?? !1, u = e.header?.title ?? e.ariaLabel ?? "Floating window";
   return /* @__PURE__ */ h("div", { "data-floating-window": t, role: "dialog", "aria-label": u, style: { height: "100%", width: "100%" }, children: /* @__PURE__ */ h(De, { header: e.header, draggable: s, chrome: r, onClose: n, children: o }) });
 };
@@ -533,7 +533,7 @@ const Gt = {
   { key: "right", variant: "edge", horizontal: "right" },
   { key: "top", variant: "edge", vertical: "top" },
   { key: "bottom", variant: "edge", vertical: "bottom" }
-], He = ({ layerId: t, onPointerDown: e }) => /* @__PURE__ */ h(N, { children: Ae.map((n) => {
+], He = ({ layerId: t, onPointerDown: e }) => /* @__PURE__ */ h(_, { children: Ae.map((n) => {
   const o = n.variant === "corner" ? Ie : Te, r = n.variant === "corner" ? xe[n.key] : ke[n.key], s = { ...o, ...r }, u = n.variant === "corner" ? { "data-resize-corner": n.key } : { "data-resize-edge": n.key };
   return /* @__PURE__ */ h(
     "div",
@@ -556,19 +556,19 @@ const Gt = {
     transitionMode: t.transitionMode
   });
   return /* @__PURE__ */ h(e, {});
-}, Wt = i.memo(({ layer: t, onClose: e }) => {
-  const { getCachedContent: n } = Ht(), o = t.pivot ? /* @__PURE__ */ h(Ne, { pivot: t.pivot }) : /* @__PURE__ */ h(N, { children: n(t.id) });
+}, $e = (t, e) => t.pivot ? /* @__PURE__ */ h(Ne, { pivot: t.pivot }) : t.cache ? e(t.id) : t.component, Wt = i.memo(({ layer: t, onClose: e }) => {
+  const { getCachedContent: n } = Ht(), o = $e(t, n);
   return t.floating?.chrome ? /* @__PURE__ */ h(_t, { id: t.id, config: t.floating, onClose: e, children: o }) : o;
 });
 Wt.displayName = "LayerContentRenderer";
 const Ot = i.memo(({ layerId: t, isResizable: e, onPointerDown: n }) => e ? /* @__PURE__ */ h(He, { layerId: t, onPointerDown: n }) : null);
 Ot.displayName = "LayerResizeHandles";
-const $e = (t, e) => t ? "auto" : e ? "visible" : "hidden", Bt = i.memo(({ layer: t, handleLayerPointerDown: e }) => {
+const Fe = (t, e) => t ? "auto" : e ? "visible" : "hidden", Bt = i.memo(({ layer: t, handleLayerPointerDown: e }) => {
   const { getLayerRenderState: n } = kt(), { style: o, isResizable: r, isResizing: s, onResizeHandlePointerDown: u } = n(t), c = i.useMemo(() => {
     const g = {};
     return t.gridArea && (g.gridArea = t.gridArea), t.gridRow && (g.gridRow = t.gridRow), t.gridColumn && (g.gridColumn = t.gridColumn), g;
   }, [t.gridArea, t.gridRow, t.gridColumn]), a = i.useMemo(() => {
-    const g = !!t.floating, f = $e(t.scrollable, g), m = {
+    const g = !!t.floating, f = Fe(t.scrollable, g), m = {
       ...o,
       ...c,
       minWidth: 0,
@@ -596,9 +596,9 @@ const $e = (t, e) => t ? "auto" : e ? "visible" : "hidden", Bt = i.memo(({ layer
   );
 });
 Bt.displayName = "EmbeddedLayer";
-const Fe = ({ layers: t }) => {
+const _e = ({ layers: t }) => {
   const { handleLayerPointerDown: e } = kt();
-  return /* @__PURE__ */ h(N, { children: t.map((n) => {
+  return /* @__PURE__ */ h(_, { children: t.map((n) => {
     const o = n.floating?.mode ?? "embedded";
     return n.floating && o === "popup" ? /* @__PURE__ */ h(Pe, { layer: n }, n.id) : /* @__PURE__ */ h(Bt, { layer: n, handleLayerPointerDown: e }, n.id);
   }) });
@@ -620,7 +620,7 @@ function et(t, e) {
       };
   }, [t, e.onMove, e.onUp, e.onCancel, n, o, r]);
 }
-function _e(t, e, n) {
+function Ge(t, e, n) {
   i.useEffect(() => {
     const o = t.current;
     if (!(!e || !o || n === void 0))
@@ -629,7 +629,7 @@ function _e(t, e, n) {
       };
   }, [t, e, n]);
 }
-function Ge(t, e, n = ["pointerdown", "pointermove", "pointerup"]) {
+function We(t, e, n = ["pointerdown", "pointermove", "pointerup"]) {
   i.useEffect(() => {
     const o = t.current;
     if (!e || !o)
@@ -646,11 +646,11 @@ function Ge(t, e, n = ["pointerdown", "pointermove", "pointerup"]) {
     };
   }, [t, e, n]);
 }
-function We(t, e, n) {
+function Oe(t, e, n) {
   const { onMove: o, onUp: r, onCancel: s, pointerId: u, capturePointer: c = !0, preventDefaults: a = !0 } = n;
-  et(e, { onMove: o, onUp: r, onCancel: s }), _e(t, e ? c : !1, u), Ge(t, e ? a : !1);
+  et(e, { onMove: o, onUp: r, onCancel: s }), Ge(t, e ? c : !1, u), We(t, e ? a : !1);
 }
-const Oe = (t) => {
+const Be = (t) => {
   const e = i.useRef(null), n = i.useRef(null), o = i.useRef(0), [r, s] = i.useState(!1), u = W((f) => {
     t.onResize?.(f);
   }), c = i.useCallback(
@@ -670,7 +670,7 @@ const Oe = (t) => {
   ), g = i.useCallback(() => {
     s(!1), n.current = null;
   }, []);
-  return We(e, r, {
+  return Oe(e, r, {
     onMove: l,
     onUp: g,
     pointerId: n.current ?? void 0,
@@ -681,7 +681,7 @@ const Oe = (t) => {
     onPointerDown: a,
     isDragging: r
   };
-}, Be = ({
+}, Ye = ({
   element: t,
   component: e
 }) => i.forwardRef(({ children: n, ...o }, r) => t ? i.cloneElement(
@@ -689,22 +689,22 @@ const Oe = (t) => {
   { ...o, ref: r },
   n ?? t.props.children
 ) : e ? /* @__PURE__ */ h(e, { ...o, ref: r, children: n }) : /* @__PURE__ */ h("div", { ...o, ref: r, children: n }));
-function Ye({
+function Ve({
   element: t,
   component: e
 }) {
   return i.useMemo(
-    () => Be({
+    () => Ye({
       element: t,
       component: e
     }),
     [e, t]
   );
 }
-const Ve = {
+const Xe = {
   position: "absolute",
   zIndex: re
-}, Xe = {
+}, Ue = {
   vertical: {
     width: ut,
     height: "100%",
@@ -717,28 +717,28 @@ const Ve = {
     left: 0,
     cursor: "row-resize"
   }
-}, Ue = {
+}, je = {
   idle: oe,
   hovered: ne,
   dragging: ee
-}, je = ({
+}, Ke = ({
   direction: t,
   onResize: e,
   component: n,
   element: o,
   children: r
 }) => {
-  const s = t === "vertical" ? "x" : "y", { ref: u, isDragging: c, onPointerDown: a } = Oe({ axis: s, onResize: e }), [l, g] = i.useState(!1), f = i.useCallback(() => {
+  const s = t === "vertical" ? "x" : "y", { ref: u, isDragging: c, onPointerDown: a } = Be({ axis: s, onResize: e }), [l, g] = i.useState(!1), f = i.useCallback(() => {
     g(!0);
   }, []), m = i.useCallback(() => {
     g(!1);
-  }, []), w = Ye({
+  }, []), w = Ve({
     element: o,
     component: n
   }), C = i.useMemo(() => c ? "dragging" : l ? "hovered" : "idle", [c, l]), z = i.useMemo(() => ({
-    ...Ve,
-    ...Xe[t],
-    backgroundColor: Ue[C],
+    ...Xe,
+    ...Ue[t],
+    backgroundColor: je[C],
     touchAction: "none"
   }), [t, C]);
   return /* @__PURE__ */ h(
@@ -799,8 +799,8 @@ const Ve = {
       ...n === "start" ? { top: -f } : { bottom: -f }
     };
   }, [n, t, o]);
-  return /* @__PURE__ */ h("div", { "data-resizable": "true", style: { ...a, position: "relative", pointerEvents: "none" }, children: /* @__PURE__ */ h("div", { "data-direction": u, "data-align": n, "data-handle": "true", style: l, children: /* @__PURE__ */ h(je, { direction: u, onResize: c }) }) });
-}, Ke = (t) => {
+  return /* @__PURE__ */ h("div", { "data-resizable": "true", style: { ...a, position: "relative", pointerEvents: "none" }, children: /* @__PURE__ */ h("div", { "data-direction": u, "data-align": n, "data-handle": "true", style: l, children: /* @__PURE__ */ h(Ke, { direction: u, onResize: c }) }) });
+}, Ze = (t) => {
   const e = /* @__PURE__ */ new Map();
   t.forEach((o, r) => {
     o.forEach((s, u) => {
@@ -835,7 +835,7 @@ const Ve = {
     };
     n.set(r, l);
   }), n;
-}, Ze = (t, e) => {
+}, qe = (t, e) => {
   if ((t.positionMode ?? "grid") !== "grid")
     return t;
   const o = t.gridArea ?? t.id, r = e.get(o);
@@ -848,8 +848,8 @@ const Ve = {
     gridRow: u ? r.gridRow : t.gridRow,
     gridColumn: c ? r.gridColumn : t.gridColumn
   };
-}, qe = (t, e) => {
-  const n = i.useMemo(() => Ke(t.areas), [t.areas]), o = i.useMemo(() => e.map((c) => Ze(c, n)), [e, n]), r = i.useMemo(
+}, Je = (t, e) => {
+  const n = i.useMemo(() => Ze(t.areas), [t.areas]), o = i.useMemo(() => e.map((c) => qe(c, n)), [e, n]), r = i.useMemo(
     () => o.filter((c) => c.visible !== !1),
     [o]
   ), s = i.useMemo(
@@ -867,7 +867,7 @@ const Ve = {
     regularLayers: s,
     layerById: u
   };
-}, Je = (t) => {
+}, Qe = (t) => {
   if (!t)
     return { rowGap: 0, columnGap: 0 };
   const e = t.split(/\s+/).map((o) => o.trim()).filter(Boolean), n = (o) => {
@@ -882,15 +882,15 @@ const Ve = {
     rowGap: n(e[0]),
     columnGap: n(e[1])
   };
-}, Qe = (t, e) => {
+}, tn = (t, e) => {
   if (!t)
     return [];
   const n = getComputedStyle(t);
   return (e === "col" ? n.gridTemplateColumns : n.gridTemplateRows).split(/\s+/).map((r) => parseFloat(r)).filter((r) => !Number.isNaN(r));
-}, Yt = (t, e = Number.NEGATIVE_INFINITY, n = Number.POSITIVE_INFINITY) => Math.min(Math.max(t, e), n), Un = (t, e) => typeof t != "number" || !Number.isFinite(t) ? e : t, K = (t, e) => `${t}-${e}`, tn = (t, e, n, o) => {
+}, Yt = (t, e = Number.NEGATIVE_INFINITY, n = Number.POSITIVE_INFINITY) => Math.min(Math.max(t, e), n), jn = (t, e) => typeof t != "number" || !Number.isFinite(t) ? e : t, K = (t, e) => `${t}-${e}`, en = (t, e, n, o) => {
   const r = K(n, o), s = e[r];
   return s !== void 0 ? `minmax(${t.minSize ?? 0}px, ${s}px)` : t.size;
-}, wt = (t, e, n) => t.map((o, r) => tn(o, e, n, r)).join(" "), X = (t, e) => t.reduce((n, o, r) => (o.resizable && o.size.endsWith("px") && (n[K(e, r)] = parseInt(o.size, 10)), n), {}), en = ({
+}, wt = (t, e, n) => t.map((o, r) => en(o, e, n, r)).join(" "), X = (t, e) => t.reduce((n, o, r) => (o.resizable && o.size.endsWith("px") && (n[K(e, r)] = parseInt(o.size, 10)), n), {}), nn = ({
   trackSizes: t,
   track: e,
   direction: n,
@@ -900,9 +900,9 @@ const Ve = {
   const s = K(n, o), u = t[s];
   if (u !== void 0)
     return u;
-  const a = Qe(r?.current ?? null, n)[o];
+  const a = tn(r?.current ?? null, n)[o];
   return a !== void 0 && a > 0 ? a : e.size.endsWith("px") ? Number.parseInt(e.size, 10) : 300;
-}, nn = (t, e) => t.reduce((n, o, r) => r === e ? n : o.size.includes("fr") ? n + 100 : n + (o.minSize ?? 50), 0), on = ({
+}, on = (t, e) => t.reduce((n, o, r) => r === e ? n : o.size.includes("fr") ? n + 100 : n + (o.minSize ?? 50), 0), rn = ({
   track: t,
   tracks: e,
   trackIndex: n,
@@ -912,9 +912,9 @@ const Ve = {
 }) => {
   if (!r?.current)
     return t.maxSize;
-  const u = o === "col" ? r.current.offsetWidth : r.current.offsetHeight, c = nn(e, n), a = e.length - 1, l = o === "col" ? s.columnGap : s.rowGap, g = a * l, f = u - c - g;
+  const u = o === "col" ? r.current.offsetWidth : r.current.offsetHeight, c = on(e, n), a = e.length - 1, l = o === "col" ? s.columnGap : s.rowGap, g = a * l, f = u - c - g;
   return t.maxSize !== void 0 ? Math.min(t.maxSize, f) : f;
-}, rn = (t, e, n) => Yt(t, e ?? Number.NEGATIVE_INFINITY, n ?? Number.POSITIVE_INFINITY), bt = (t, e) => {
+}, sn = (t, e, n) => Yt(t, e ?? Number.NEGATIVE_INFINITY, n ?? Number.POSITIVE_INFINITY), bt = (t, e) => {
   const n = t.length, o = [];
   for (let u = 0; u < n; u++) {
     const c = t[u], a = c[e], l = c[e + 1];
@@ -934,7 +934,7 @@ const Ve = {
     return { start: 1, end: r + 1 };
   const u = Math.min(...s), c = Math.max(...s);
   return { start: u + 1, end: c + 2 };
-}, sn = (t, e) => {
+}, an = (t, e) => {
   if (t.length === 0)
     return [];
   const n = e.length;
@@ -953,7 +953,7 @@ const Ve = {
       o.push({ trackIndex: s, align: "end", span: a });
     }
   }), o;
-}, an = (t, e) => {
+}, cn = (t, e) => {
   if (t.length === 0)
     return [];
   const n = e[0]?.length ?? 0;
@@ -972,7 +972,7 @@ const Ve = {
       o.push({ trackIndex: s, align: "end", span: a });
     }
   }), o;
-}, cn = (t) => t !== void 0 ? { gap: t } : {}, un = (t, e) => {
+}, un = (t) => t !== void 0 ? { gap: t } : {}, ln = (t, e) => {
   const n = Object.keys(e), o = {};
   for (const g of n)
     o[g] = t[g] ?? e[g];
@@ -980,7 +980,7 @@ const Ve = {
     (g) => !Object.prototype.hasOwnProperty.call(o, g)
   ), c = s ? !0 : u, a = n.some((g) => t[g] !== o[g]);
   return (c ? !0 : a) ? o : null;
-}, ln = (t, e, n) => {
+}, dn = (t, e, n) => {
   const [o, r] = i.useState(() => ({
     ...X(t.columns, "col"),
     ...X(t.rows, "row")
@@ -990,13 +990,13 @@ const Ve = {
       ...X(t.columns, "col"),
       ...X(t.rows, "row")
     };
-    r((m) => un(m, f) ?? m);
+    r((m) => ln(m, f) ?? m);
   }, [t.columns, t.rows]);
-  const s = i.useMemo(() => t.areas.map((f) => `"${f.join(" ")}"`).join(" "), [t.areas]), u = i.useMemo(() => Je(t.gap), [t.gap]), c = i.useMemo(
-    () => sn(t.columns, t.areas),
+  const s = i.useMemo(() => t.areas.map((f) => `"${f.join(" ")}"`).join(" "), [t.areas]), u = i.useMemo(() => Qe(t.gap), [t.gap]), c = i.useMemo(
+    () => an(t.columns, t.areas),
     [t.columns, t.areas]
   ), a = i.useMemo(
-    () => an(t.rows, t.areas),
+    () => cn(t.rows, t.areas),
     [t.rows, t.areas]
   ), l = i.useMemo(() => ({
     ...t.style,
@@ -1004,19 +1004,19 @@ const Ve = {
     gridTemplateAreas: s,
     gridTemplateRows: wt(t.rows, o, "row"),
     gridTemplateColumns: wt(t.columns, o, "col"),
-    ...cn(t.gap)
+    ...un(t.gap)
   }), [s, t.columns, t.gap, t.rows, t.style, e, o]), g = i.useCallback(
     (f, m, w) => {
       const C = f === "row" ? t.rows : t.columns, z = C[m];
       if (!z || !z.resizable)
         return;
-      const y = en({
+      const y = nn({
         trackSizes: o,
         track: z,
         direction: f,
         trackIndex: m,
         containerRef: n
-      }), L = on({
+      }), L = rn({
         track: z,
         tracks: C,
         trackIndex: m,
@@ -1024,9 +1024,9 @@ const Ve = {
         containerRef: n,
         gapSizes: u
       }), x = K(f, m);
-      r(($) => {
-        const M = y + w, D = rn(M, z.minSize, L);
-        return { ...$, [x]: D };
+      r((N) => {
+        const M = y + w, D = sn(M, z.minSize, L);
+        return { ...N, [x]: D };
       });
     },
     [t.columns, t.rows, o, n, u]
@@ -1038,19 +1038,19 @@ const Ve = {
     gridStyle: l,
     handleResize: g
   };
-}, dn = (t) => t.positionMode ? t.positionMode : t.floating ? (t.floating.mode ?? "embedded") === "embedded" ? "absolute" : "relative" : "grid", fn = (t) => ({ position: t === "grid" ? "relative" : t }), gn = (t, e) => e !== "grid" ? {} : {
+}, fn = (t) => t.positionMode ? t.positionMode : t.floating ? (t.floating.mode ?? "embedded") === "embedded" ? "absolute" : "relative" : "grid", gn = (t) => ({ position: t === "grid" ? "relative" : t }), pn = (t, e) => e !== "grid" ? {} : {
   gridArea: t.gridArea,
   gridRow: t.gridRow,
   gridColumn: t.gridColumn
-}, pn = (t) => t ? {
+}, hn = (t) => t ? {
   top: t.top,
   right: t.right,
   bottom: t.bottom,
   left: t.left
-} : {}, hn = (t) => t !== void 0 ? { zIndex: t } : {}, mn = (t, e) => ({
+} : {}, mn = (t) => t !== void 0 ? { zIndex: t } : {}, wn = (t, e) => ({
   width: t,
   height: e
-}), wn = (t, e) => t.pointerEvents !== void 0 ? typeof t.pointerEvents == "boolean" ? { pointerEvents: t.pointerEvents ? "auto" : "none" } : { pointerEvents: t.pointerEvents } : e === "absolute" || e === "fixed" ? { pointerEvents: "auto" } : {}, bn = (t) => t.floating ? t.floating.position ?? t.floating.defaultPosition ?? t.position : t.position, vn = (t) => {
+}), bn = (t, e) => t.pointerEvents !== void 0 ? typeof t.pointerEvents == "boolean" ? { pointerEvents: t.pointerEvents ? "auto" : "none" } : { pointerEvents: t.pointerEvents } : e === "absolute" || e === "fixed" ? { pointerEvents: "auto" } : {}, vn = (t) => t.floating ? t.floating.position ?? t.floating.defaultPosition ?? t.position : t.position, Sn = (t) => {
   if (t.floating) {
     const e = t.floating.size ?? t.floating.defaultSize;
     if (e)
@@ -1063,21 +1063,21 @@ const Ve = {
     width: t.width,
     height: t.height
   };
-}, Sn = (t) => t.floating?.zIndex !== void 0 ? t.floating.zIndex : t.zIndex, Cn = (t) => {
-  const e = dn(t), n = bn(t), o = vn(t), r = Sn(t);
+}, Cn = (t) => t.floating?.zIndex !== void 0 ? t.floating.zIndex : t.zIndex, zn = (t) => {
+  const e = fn(t), n = vn(t), o = Sn(t), r = Cn(t);
   return {
     ...t.style,
-    ...fn(e),
-    ...gn(t, e),
-    ...pn(n),
-    ...hn(r),
-    ...mn(o.width, o.height),
-    ...wn(t, e)
+    ...gn(e),
+    ...pn(t, e),
+    ...hn(n),
+    ...mn(r),
+    ...wn(o.width, o.height),
+    ...bn(t, e)
   };
-}, zn = (t) => {
+}, En = (t) => {
   const e = t.floating;
   return e ? e.mode ?? "embedded" : null;
-}, _ = (t) => zn(t) !== "embedded" ? null : t.floating ?? null, St = (t) => t instanceof HTMLElement ? ["INPUT", "TEXTAREA", "SELECT", "BUTTON"].includes(t.tagName) : !1, Ct = (t, e, n) => {
+}, F = (t) => En(t) !== "embedded" ? null : t.floating ?? null, St = (t) => t instanceof HTMLElement ? ["INPUT", "TEXTAREA", "SELECT", "BUTTON"].includes(t.tagName) : !1, Ct = (t, e, n) => {
   const o = e ?? Number.NEGATIVE_INFINITY, r = n ?? Number.POSITIVE_INFINITY;
   return Yt(t, o, r);
 }, zt = (t, e, n) => {
@@ -1087,7 +1087,7 @@ const Ve = {
     `Floating layer "${n}" must provide a numeric "${e}" value when draggable mode is enabled.`
   );
 }, Et = (t) => {
-  const e = _(t);
+  const e = F(t);
   if (!e)
     throw new Error(`Floating layer "${t.id}" is missing floating configuration required for dragging.`);
   const n = e.position ?? e.defaultPosition ?? t.position;
@@ -1097,10 +1097,10 @@ const Ve = {
     left: zt(n.left, "left", t.id),
     top: zt(n.top, "top", t.id)
   };
-}, En = (t) => {
-  const e = _(t);
+}, Rn = (t) => {
+  const e = F(t);
   return e ? e.constraints ?? {} : {};
-}, Rn = (t, e, n) => t ? t === "left" ? e - n : e + n : e, Pn = (t, e, n) => t ? t === "top" ? e - n : e + n : e, yn = (t, e, n) => !t || t === "right" ? e : e + n, Ln = (t, e, n) => !t || t === "bottom" ? e : e + n, nt = (t, e) => t ? t.dataset.layerId === e ? t : nt(t.parentElement, e) : null, ot = (t, e, n) => !t || n?.(t) ? null : e(t) ? t : ot(t.parentElement, e, n), Mn = (t) => t instanceof HTMLElement ? ot(
+}, Pn = (t, e, n) => t ? t === "left" ? e - n : e + n : e, yn = (t, e, n) => t ? t === "top" ? e - n : e + n : e, Ln = (t, e, n) => !t || t === "right" ? e : e + n, Mn = (t, e, n) => !t || t === "bottom" ? e : e + n, nt = (t, e) => t ? t.dataset.layerId === e ? t : nt(t.parentElement, e) : null, ot = (t, e, n) => !t || n?.(t) ? null : e(t) ? t : ot(t.parentElement, e, n), Dn = (t) => t instanceof HTMLElement ? ot(
   t,
   (e) => e.dataset.dragHandle === "true",
   (e) => e.dataset.dragIgnore === "true"
@@ -1108,19 +1108,19 @@ const Ve = {
   t,
   (e) => e.dataset.resizeCorner !== void 0 || e.dataset.resizeEdge !== void 0
 ) !== null : !1, U = (t) => {
-  const e = _(t);
+  const e = F(t);
   return e ? e.resizable === !0 : !1;
 }, j = (t) => {
-  if (!_(t))
+  if (!F(t))
     return null;
-  const n = Tn(t);
+  const n = xn(t);
   if (!n)
     throw new Error(`Floating layer "${t.id}" must define width and height when resizable or draggable.`);
   return {
     width: n.width,
     height: n.height
   };
-}, Dn = (t, e, n) => {
+}, In = (t, e, n) => {
   const o = t.filter(U).reduce((f, m) => {
     if (n === m.id) {
       const C = e[m.id];
@@ -1137,7 +1137,7 @@ const Ve = {
     sizes: o,
     changed: a ? !0 : l
   };
-}, In = ({
+}, Tn = ({
   layers: t,
   layerById: e,
   isRootLevel: n
@@ -1148,7 +1148,7 @@ const Ve = {
     e.get(p)?.floating?.onResize?.(d);
   });
   It(() => {
-    const { sizes: p, changed: d } = Dn(t, l, s);
+    const { sizes: p, changed: d } = In(t, l, s);
     d && g(p);
   }, [t, s]);
   const z = i.useCallback(
@@ -1174,7 +1174,7 @@ const Ve = {
     [c]
   ), y = i.useCallback(
     (p) => {
-      const d = p.target, b = Mn(d);
+      const d = p.target, b = Dn(d);
       if (!b)
         return;
       const v = b.closest("[data-layer-id]")?.getAttribute("data-layer-id");
@@ -1183,7 +1183,7 @@ const Ve = {
       const S = e.get(v);
       if (!S)
         return;
-      const P = _(S);
+      const P = F(S);
       if (!(!P || P.draggable !== !0) && !St(p.target) && !Rt(p.target) && b) {
         const E = nt(b, v);
         if (!E)
@@ -1195,7 +1195,7 @@ const Ve = {
     [z, e]
   ), L = i.useCallback(
     (p, d) => {
-      const b = e.get(p), v = b ? _(b) : null;
+      const b = e.get(p), v = b ? F(b) : null;
       if (!b || !v || v.draggable !== !0 || St(d.target) || Rt(d.target))
         return;
       const S = nt(d.currentTarget, p);
@@ -1210,7 +1210,7 @@ const Ve = {
       const S = l[p] ?? j(v);
       if (!S)
         return;
-      const P = Et(v), E = En(v), k = c[p] ?? { x: 0, y: 0 };
+      const P = Et(v), E = Rn(v), k = c[p] ?? { x: 0, y: 0 };
       if (b.stopPropagation(), b.preventDefault(), b.currentTarget.setPointerCapture)
         try {
           b.currentTarget.setPointerCapture(b.pointerId);
@@ -1236,7 +1236,7 @@ const Ve = {
       }, u(p);
     },
     [e, c, l]
-  ), $ = i.useCallback(
+  ), N = i.useCallback(
     (p) => {
       const d = f.current;
       if (!d)
@@ -1256,12 +1256,12 @@ const Ve = {
       const d = m.current;
       if (!d || d.pointerId !== p.pointerId || !e.get(d.layerId))
         return;
-      const v = p.clientX - d.startX, S = p.clientY - d.startY, P = Rn(d.horizontalEdge, d.startWidth, v), E = Pn(d.verticalEdge, d.startHeight, S), k = Ct(P, d.minWidth, d.maxWidth), F = Ct(E, d.minHeight, d.maxHeight), O = d.startWidth - k, Z = d.startHeight - F, it = yn(
+      const v = p.clientX - d.startX, S = p.clientY - d.startY, P = Pn(d.horizontalEdge, d.startWidth, v), E = yn(d.verticalEdge, d.startHeight, S), k = Ct(P, d.minWidth, d.maxWidth), $ = Ct(E, d.minHeight, d.maxHeight), O = d.startWidth - k, Z = d.startHeight - $, it = Ln(
         d.horizontalEdge,
         d.startPosition.x,
         O
-      ), Xt = Ln(d.verticalEdge, d.startPosition.y, Z), q = l[d.layerId], at = { width: k, height: F };
-      (!q || q.width !== k || q.height !== F) && (g((J) => ({
+      ), Xt = Mn(d.verticalEdge, d.startPosition.y, Z), q = l[d.layerId], at = { width: k, height: $ };
+      (!q || q.width !== k || q.height !== $) && (g((J) => ({
         ...J,
         [d.layerId]: at
       })), C(d.layerId, at));
@@ -1299,7 +1299,7 @@ const Ve = {
     u(null);
   }, []);
   et(o !== null, {
-    onMove: $,
+    onMove: N,
     onUp: D,
     onCancel: D
   }), et(s !== null, {
@@ -1309,10 +1309,10 @@ const Ve = {
   });
   const I = i.useCallback(
     (p) => {
-      const d = Cn(p), b = _(p);
+      const d = zn(p), b = F(p);
       if (!b || b.draggable !== !0)
         return d;
-      const v = c[p.id], S = o === p.id, P = s === p.id, E = v ? { transform: `translate(${v.x}px, ${v.y}px)` } : {}, k = l[p.id], F = U(p) ? j(p) : null, O = k ?? F, Z = O ? { width: `${O.width}px`, height: `${O.height}px` } : {};
+      const v = c[p.id], S = o === p.id, P = s === p.id, E = v ? { transform: `translate(${v.x}px, ${v.y}px)` } : {}, k = l[p.id], $ = U(p) ? j(p) : null, O = k ?? $, Z = O ? { width: `${O.width}px`, height: `${O.height}px` } : {};
       return {
         ...d,
         ...Z,
@@ -1326,8 +1326,8 @@ const Ve = {
       if (!U(p))
         return { isResizable: !1 };
       const b = l[p.id], v = j(p);
-      return (b ?? v) !== null ? { isResizable: !0, onPointerDown: (k, F) => {
-        x(p.id, k, F);
+      return (b ?? v) !== null ? { isResizable: !0, onPointerDown: (k, $) => {
+        x(p.id, k, $);
       } } : { isResizable: !1 };
     },
     [x, l]
@@ -1369,7 +1369,7 @@ const Ve = {
     draggingLayerId: o,
     resizingLayerId: s
   };
-}, Tn = (t) => {
+}, xn = (t) => {
   if (t.floating) {
     const e = t.floating.size ?? t.floating.defaultSize;
     if (e)
@@ -1382,40 +1382,40 @@ const Ve = {
   width: "100%",
   height: "100%",
   overflow: "hidden"
-}, xn = {
+}, kn = {
   touchAction: "none",
   WebkitTouchCallout: "none",
   WebkitUserSelect: "none",
   userSelect: "none"
-}, kn = {
+}, An = {
   ...Vt,
   overflow: "visible",
   height: "auto",
   minHeight: "100%"
-}, An = (t) => t ? kn : Vt, jn = ({ config: t, layers: e, style: n, root: o = !1 }) => {
+}, Hn = (t) => t ? An : Vt, Kn = ({ config: t, layers: e, style: n, root: o = !1 }) => {
   const r = i.useRef(null), { isIntersecting: s } = de(r, { threshold: 0 });
-  return /* @__PURE__ */ h(Ee, { config: t, layers: e, style: n, children: /* @__PURE__ */ h(Hn, { gridRef: r, isIntersecting: s, isRoot: o }) });
-}, Hn = ({ gridRef: t, isIntersecting: e, isRoot: n }) => {
-  const { config: o, style: r, layers: s } = Ht(), { normalizedLayers: u, visibleLayers: c, regularLayers: a, layerById: l } = qe(o, s.defs), { columnHandles: g, rowHandles: f, gapSizes: m, gridStyle: w, handleResize: C } = ln(o, r, t), { providerValue: z, draggingLayerId: y, resizingLayerId: L } = In({
+  return /* @__PURE__ */ h(Ee, { config: t, layers: e, style: n, children: /* @__PURE__ */ h(Nn, { gridRef: r, isIntersecting: s, isRoot: o }) });
+}, Nn = ({ gridRef: t, isIntersecting: e, isRoot: n }) => {
+  const { config: o, style: r, layers: s } = Ht(), { normalizedLayers: u, visibleLayers: c, regularLayers: a, layerById: l } = Je(o, s.defs), { columnHandles: g, rowHandles: f, gapSizes: m, gridStyle: w, handleResize: C } = dn(o, r, t), { providerValue: z, draggingLayerId: y, resizingLayerId: L } = Tn({
     layers: u,
     layerById: l,
     isRootLevel: n
-  }), x = y ? !0 : !!L, $ = i.useMemo(() => ({
-    ...An(n),
+  }), x = y ? !0 : !!L, N = i.useMemo(() => ({
+    ...Hn(n),
     ...w,
-    ...x ? xn : {}
+    ...x ? kn : {}
   }), [w, x, n]);
-  return /* @__PURE__ */ H(N, { children: [
+  return /* @__PURE__ */ H(_, { children: [
     /* @__PURE__ */ H(
       "div",
       {
         ref: t,
-        style: $,
+        style: N,
         "data-dragging": !!y,
         "data-resizing": !!L,
         "data-visible": e,
         children: [
-          /* @__PURE__ */ h(ze, { value: z, children: /* @__PURE__ */ h(Fe, { layers: a }) }),
+          /* @__PURE__ */ h(ze, { value: z, children: /* @__PURE__ */ h(_e, { layers: a }) }),
           g.map(({ trackIndex: M, align: D, span: A }) => /* @__PURE__ */ h(
             mt,
             {
@@ -1449,17 +1449,17 @@ const Ve = {
 export {
   we as D,
   _t as F,
-  jn as G,
-  je as R,
-  Xn as a,
+  Kn as G,
+  Ke as R,
+  Un as a,
   kt as b,
   W as c,
-  Ye as d,
+  Ve as d,
   Yt as e,
   Ce as f,
-  Vn as g,
+  Xn as g,
   Tt as r,
-  Un as t,
-  Oe as u
+  jn as t,
+  Be as u
 };
-//# sourceMappingURL=GridLayout-BzrIDrC9.js.map
+//# sourceMappingURL=GridLayout-CJTKq7Mp.js.map