react-resizable-panels 4.12.3 → 4.12.4

package/dist/react-resizable-panels.js

@@ -1,6 +1,6 @@
 "use client";
-import { jsx as ae } from "react/jsx-runtime";
-import { useState as Q, useCallback as re, useId as mt, useLayoutEffect as Ke, useEffect as me, useRef as O, createContext as gt, useImperativeHandle as Xe, useMemo as Se, useSyncExternalStore as qe, useContext as yt } from "react";
+import { jsx as se } from "react/jsx-runtime";
+import { useState as Q, useCallback as ie, useId as mt, useLayoutEffect as Ke, useEffect as ge, useRef as O, createContext as gt, useImperativeHandle as Xe, useMemo as ve, useSyncExternalStore as qe, useContext as yt } from "react";
 function St(e, t) {
   const n = getComputedStyle(e), o = parseFloat(n.fontSize);
   return t * o;
@@ -25,7 +25,7 @@ function xt(e) {
     }
   }
 }
-function ie({
+function oe({
   groupSize: e,
   panelElement: t,
   styleProp: n
@@ -69,7 +69,7 @@ function ne({
   const { orientation: t, panels: n } = e;
   return n.reduce((o, i) => (o += t === "horizontal" ? i.element.offsetWidth : i.element.offsetHeight, o), 0);
 }
-function ve(e) {
+function be(e) {
   const { panels: t } = e, n = ne({ group: e });
   return n === 0 ? t.map((o) => ({
     groupResizeBehavior: o.panelConstraints.groupResizeBehavior,
@@ -84,7 +84,7 @@ function ve(e) {
     const { element: i, panelConstraints: s } = o;
     let u = 0;
     if (s.collapsedSize !== void 0) {
-      const c = ie({
+      const c = oe({
         groupSize: n,
         panelElement: i,
         styleProp: s.collapsedSize
@@ -93,7 +93,7 @@ function ve(e) {
     }
     let a;
     if (s.defaultSize !== void 0) {
-      const c = ie({
+      const c = oe({
         groupSize: n,
         panelElement: i,
         styleProp: s.defaultSize
@@ -102,7 +102,7 @@ function ve(e) {
     }
     let r = 0;
     if (s.minSize !== void 0) {
-      const c = ie({
+      const c = oe({
         groupSize: n,
         panelElement: i,
         styleProp: s.minSize
@@ -111,7 +111,7 @@ function ve(e) {
     }
     let l = 100;
     if (s.maxSize !== void 0) {
-      const c = ie({
+      const c = oe({
         groupSize: n,
         panelElement: i,
         styleProp: s.maxSize
@@ -134,7 +134,7 @@ function C(e, t = "Assertion error") {
   if (!e)
     throw Error(t);
 }
-function be(e, t) {
+function ze(e, t) {
   return Array.from(t).sort(
     e === "horizontal" ? Pt : wt
   );
@@ -178,12 +178,12 @@ function Lt({
   }
   return C(i, "No rect found"), i;
 }
-let fe;
+let de;
 function Ct() {
-  return fe === void 0 && (typeof matchMedia == "function" ? fe = !!matchMedia("(pointer:coarse)").matches : fe = !1), fe;
+  return de === void 0 && (typeof matchMedia == "function" ? de = !!matchMedia("(pointer:coarse)").matches : de = !1), de;
 }
 function Ze(e) {
-  const { element: t, orientation: n, panels: o, separators: i } = e, s = be(
+  const { element: t, orientation: n, panels: o, separators: i } = e, s = ze(
     n,
     Array.from(t.children).filter(Ye).map((z) => ({ element: z }))
   ).map(({ element: z }) => z), u = [];
@@ -343,32 +343,32 @@ let ee = {
   cursorFlags: 0,
   state: "inactive"
 };
-const ze = new Qe();
+const xe = new Qe();
 function W() {
   return ee;
 }
 function Rt(e) {
-  return ze.addListener("change", e);
+  return xe.addListener("change", e);
 }
 function Et(e) {
   const t = ee, n = { ...ee };
-  n.cursorFlags = e, ee = n, ze.emit("change", {
+  n.cursorFlags = e, ee = n, xe.emit("change", {
     prev: t,
     next: n
   });
 }
 function te(e) {
   const t = ee;
-  ee = e, ze.emit("change", {
+  ee = e, xe.emit("change", {
     prev: t,
     next: e
   });
 }
-const Mt = (e) => e, ye = () => {
+const Mt = (e) => e, Se = () => {
 }, et = 1, tt = 2, nt = 4, ot = 8, Ie = 3, ke = 12;
-let de;
+let pe;
 function De() {
-  return de === void 0 && (de = !1, typeof window < "u" && (window.navigator.userAgent.includes("Chrome") || window.navigator.userAgent.includes("Firefox")) && (de = !0)), de;
+  return pe === void 0 && (pe = !1, typeof window < "u" && (window.navigator.userAgent.includes("Chrome") || window.navigator.userAgent.includes("Firefox")) && (pe = !0)), pe;
 }
 function It({
   cursorFlags: e,
@@ -414,7 +414,7 @@ function It({
   }
 }
 const Te = /* @__PURE__ */ new WeakMap();
-function xe(e) {
+function Pe(e) {
   if (!e.defaultView || !e.adoptedStyleSheets)
     return;
   let { prevStyle: t, styleSheet: n } = Te.get(e) ?? {};
@@ -466,7 +466,7 @@ function H(e, t) {
 function V() {
   return F;
 }
-function Pe(e, t) {
+function we(e, t) {
   return it.addListener("groupChange", (n) => {
     n.group.id === e && t(n);
   });
@@ -488,7 +488,7 @@ function rt(e) {
       te({
         cursorFlags: 0,
         state: "inactive"
-      }), t.hitRegions.length > 0 && (xe(e), o = !0, t.hitRegions.forEach((i) => {
+      }), t.hitRegions.length > 0 && (Pe(e), o = !0, t.hitRegions.forEach((i) => {
         if (!n.has(i.group))
           return;
         const s = H(i.group.id, !0);
@@ -611,7 +611,7 @@ function _t({
   }
   return !0;
 }
-function we(e, t) {
+function Le(e, t) {
   const n = [];
   return t.forEach((o, i) => {
     if (i.disabled)
@@ -635,11 +635,11 @@ function $t(e, t) {
       return !1;
   return !0;
 }
-function k(e, t, n = 0) {
+function D(e, t, n = 0) {
   return Math.abs(T(e) - T(t)) <= n;
 }
 function A(e, t) {
-  return k(e, t) ? 0 : e > t ? 1 : -1;
+  return D(e, t) ? 0 : e > t ? 1 : -1;
 }
 function Z({
   overrideDisabledPanels: e,
@@ -664,7 +664,7 @@ function Z({
       o = r;
   return o = Math.min(a, o), o = T(o), o;
 }
-function le({
+function ae({
   delta: e,
   initialLayout: t,
   panelConstraints: n,
@@ -672,7 +672,7 @@ function le({
   prevLayout: i,
   trigger: s
 }) {
-  if (k(e, 0))
+  if (D(e, 0))
     return t;
   const u = s === "imperative-api", a = Object.values(t), r = Object.values(i), l = [...a], [c, m] = o;
   C(c != null, "Invalid first pivot index"), C(m != null, "Invalid second pivot index");
@@ -695,7 +695,7 @@ function le({
           if (C(
             v != null,
             `Previous layout not found for panel index ${f}`
-          ), k(v, h)) {
+          ), D(v, h)) {
             const g = b - v;
             A(g, Math.abs(e)) > 0 && (e = e < 0 ? 0 - g : g);
           }
@@ -717,7 +717,7 @@ function le({
           if (C(
             v != null,
             `Previous layout not found for panel index ${f}`
-          ), k(v, b)) {
+          ), D(v, b)) {
             const g = v - h;
             A(g, Math.abs(e)) > 0 && (e = e < 0 ? 0 - g : g);
           }
@@ -778,7 +778,7 @@ function le({
         prevSize: y,
         size: b
       });
-      if (!k(y, v) && (p += y - v, l[d] = v, p.toFixed(3).localeCompare(Math.abs(e).toFixed(3), void 0, {
+      if (!D(y, v) && (p += y - v, l[d] = v, p.toFixed(3).localeCompare(Math.abs(e).toFixed(3), void 0, {
         numeric: !0
       }) >= 0))
         break;
@@ -799,7 +799,7 @@ function le({
       prevSize: d,
       size: h
     });
-    if (l[f] = y, !k(y, h)) {
+    if (l[f] = y, !D(y, h)) {
       let b = h - y, g = e < 0 ? m : c;
       for (; g >= 0 && g < n.length; ) {
         const w = l[g];
@@ -813,7 +813,7 @@ function le({
           prevSize: w,
           size: E
         });
-        if (k(w, L) || (b -= L - w, l[g] = L), k(b, 0))
+        if (D(w, L) || (b -= L - w, l[g] = L), D(b, 0))
           break;
         e > 0 ? g-- : g++;
       }
@@ -823,7 +823,7 @@ function le({
     (f, d) => d + f,
     0
   );
-  if (!k(S, 100, 0.1))
+  if (!D(S, 100, 0.1))
     return i;
   const z = Object.keys(i);
   return l.reduce((f, d, h) => (f[z[h]] = d, f), {});
@@ -848,7 +848,7 @@ function X({
     throw Error(
       `Invalid ${t.length} panel layout: ${o.map((a) => `${a}%`).join(", ")}`
     );
-  if (!k(i, 100) && o.length > 0)
+  if (!D(i, 100) && o.length > 0)
     for (let a = 0; a < t.length; a++) {
       const r = o[a];
       C(r != null, `No layout data found for index ${a}`);
@@ -869,7 +869,7 @@ function X({
     });
     l != c && (s += l - c, o[a] = c);
   }
-  if (!k(s, 0))
+  if (!D(s, 0))
     for (let a = 0; a < t.length; a++) {
       const r = o[a];
       C(r != null, `No layout data found for index ${a}`);
@@ -879,7 +879,7 @@ function X({
         prevSize: r,
         size: l
       });
-      if (r !== c && (s -= c - r, o[a] = c, k(s, 0)))
+      if (r !== c && (s -= c - r, o[a] = c, D(s, 0)))
         break;
     }
   const u = Object.keys(e);
@@ -937,7 +937,7 @@ function at({
     const p = s(), S = l.findIndex((h) => h.id === t), z = S === 0, f = S === l.length - 1;
     if (f && r < p && (z || l.slice(0, S).every((h, y) => {
       const b = m[y];
-      return b?.collapsible && k(b.collapsedSize, c[b.panelId]);
+      return b?.collapsible && D(b.collapsedSize, c[b.panelId]);
     }))) {
       const h = l.slice(0, S).reduce((y, b) => y + c[b.id], 0);
       return {
@@ -945,7 +945,7 @@ function at({
         [t]: T(100 - h)
       };
     }
-    return le({
+    return ae({
       delta: f ? p - r : r - p,
       initialLayout: c,
       panelConstraints: m,
@@ -1002,10 +1002,10 @@ function at({
     },
     isCollapsed: () => {
       const { collapsible: r, collapsedSize: l } = o(), c = s();
-      return r && k(l, c);
+      return r && D(l, c);
     },
     resize: (r) => {
-      const { group: l } = n(), { element: c } = i(), m = ne({ group: l }), p = ie({
+      const { group: l } = n(), { element: c } = i(), m = ne({ group: l }), p = oe({
         groupSize: m,
         panelElement: c,
         styleProp: r
@@ -1018,7 +1018,7 @@ function _e(e) {
   if (e.defaultPrevented)
     return;
   const t = V();
-  we(e, t).forEach((o) => {
+  Le(e, t).forEach((o) => {
     if (o.separator && !o.separator.disableDoubleClick) {
       const i = o.panels.find(
         (s) => s.panelConstraints.defaultSize !== void 0
@@ -1033,7 +1033,7 @@ function _e(e) {
     }
   });
 }
-function pe(e) {
+function he(e) {
   const t = V();
   for (const [n] of t)
     if (n.separators.some(
@@ -1080,13 +1080,13 @@ function lt({
   };
 }
 function B(e, t) {
-  const n = pe(e), o = H(n.id, !0), i = n.separators.find(
+  const n = he(e), o = H(n.id, !0), i = n.separators.find(
     (m) => m.element === e
   );
   C(i, "Matching separator not found");
   const s = o.separatorToPanels.get(i);
   C(s, "Matching panels not found");
-  const u = s.map((m) => n.panels.indexOf(m)), r = lt({ groupId: n.id }).getLayout(), l = le({
+  const u = s.map((m) => n.panels.indexOf(m)), r = lt({ groupId: n.id }).getLayout(), l = ae({
     delta: t,
     initialLayout: r,
     panelConstraints: o.derivedPanelConstraints,
@@ -1116,7 +1116,7 @@ function B(e, t) {
 function $e(e) {
   if (e.defaultPrevented)
     return;
-  const t = e.currentTarget, n = pe(t);
+  const t = e.currentTarget, n = he(t);
   if (!n.disabled)
     switch (e.key) {
       case "ArrowDown": {
@@ -1141,7 +1141,7 @@ function $e(e) {
       }
       case "Enter": {
         e.preventDefault();
-        const o = pe(t), i = H(o.id, !0), { derivedPanelConstraints: s, layout: u, separatorToPanels: a } = i, r = o.separators.find(
+        const o = he(t), i = H(o.id, !0), { derivedPanelConstraints: s, layout: u, separatorToPanels: a } = i, r = o.separators.find(
           (p) => p.element === t
         );
         C(r, "Matching separator not found");
@@ -1158,7 +1158,7 @@ function $e(e) {
       }
       case "F6": {
         e.preventDefault();
-        const i = pe(t).separators.map(
+        const i = he(t).separators.map(
           (r) => r.element
         ), s = Array.from(i).findIndex(
           (r) => r === e.currentTarget
@@ -1181,7 +1181,7 @@ function je(e) {
     return;
   if (e.pointerType === "mouse" && e.button > 0)
     return;
-  const t = V(), n = we(e, t), o = /* @__PURE__ */ new Map();
+  const t = V(), n = Le(e, t), o = /* @__PURE__ */ new Map();
   let i = !1;
   n.forEach((s) => {
     s.separator && (i || (i = !0, s.separator.element.focus({
@@ -1224,7 +1224,7 @@ function ut({
       separatorToPanels: w
     } = h;
     if (b && g && w) {
-      const E = le({
+      const E = ae({
         delta: f,
         initialLayout: d,
         panelConstraints: b,
@@ -1255,7 +1255,7 @@ function ut({
     }
   });
   let r = 0;
-  t.movementX === 0 ? r |= u & Ie : r |= a & Ie, t.movementY === 0 ? r |= u & ke : r |= a & ke, Et(r), xe(e);
+  t.movementX === 0 ? r |= u & Ie : r |= a & Ie, t.movementY === 0 ? r |= u & ke : r |= a & ke, Et(r), Pe(e);
 }
 function He(e) {
   const t = V(), n = W();
@@ -1297,7 +1297,7 @@ function Ve(e) {
       for (const o of t.hitRegions)
         if (o.separator) {
           const { element: i } = o.separator;
-          i.hasPointerCapture?.(e.pointerId) || i.setPointerCapture?.(e.pointerId);
+          i.isConnected && !i.hasPointerCapture?.(e.pointerId) && i.setPointerCapture?.(e.pointerId);
         }
       ut({
         document: e.currentTarget,
@@ -1311,7 +1311,7 @@ function Ve(e) {
       break;
     }
     default: {
-      const o = we(e, n);
+      const o = Le(e, n);
       o.length === 0 ? t.state !== "inactive" && te({
         cursorFlags: 0,
         state: "inactive"
@@ -1319,7 +1319,7 @@ function Ve(e) {
         cursorFlags: 0,
         hitRegions: o,
         state: "hover"
-      }), xe(e.currentTarget);
+      }), Pe(e.currentTarget);
       break;
     }
   }
@@ -1458,7 +1458,7 @@ function Wt(e) {
           const v = H(e.id);
           if (!v)
             return;
-          const g = ve(e), w = v.defaultLayoutDeferred ? We(g) : v.layout, E = Ut({
+          const g = be(e), w = v.defaultLayoutDeferred ? We(g) : v.layout, E = Ut({
             group: e,
             nextGroupSize: b,
             prevGroupSize: v.groupSize,
@@ -1490,7 +1490,7 @@ function Wt(e) {
       `Panel ids must be unique; id "${f.id}" was used more than once`
     ), o.add(f.id), f.onResize && s.observe(f.element);
   });
-  const u = ne({ group: e }), a = ve(e), r = e.panels.map(({ id: f }) => f).join(",");
+  const u = ne({ group: e }), a = be(e), r = e.panels.map(({ id: f }) => f).join(",");
   let l = e.mutableState.defaultLayout;
   l && (Bt(e.panels, l) || (l = void 0));
   const c = e.mutableState.layouts[r] ?? l ?? We(a), m = X({
@@ -1537,25 +1537,25 @@ function Wt(e) {
   };
 }
 function Kt() {
-  const [e, t] = Q({}), n = re(() => t({}), []);
+  const [e, t] = Q({}), n = ie(() => t({}), []);
   return [e, n];
 }
-function Le(e) {
+function Ce(e) {
   const t = mt();
   return `${e ?? t}`;
 }
-const q = typeof window < "u" ? Ke : me;
-function se(e) {
+const q = typeof window < "u" ? Ke : ge;
+function re(e) {
   const t = O(e);
   return q(() => {
     t.current = e;
-  }, [e]), re(
+  }, [e]), ie(
     (...n) => t.current?.(...n),
     [t]
   );
 }
-function Ce(...e) {
-  return se((t) => {
+function Re(...e) {
+  return re((t) => {
     e.forEach((n) => {
       if (n)
         switch (typeof n) {
@@ -1571,7 +1571,7 @@ function Ce(...e) {
     });
   });
 }
-function Re(e) {
+function Ee(e) {
   const t = O({ ...e });
   return q(() => {
     for (const n in e)
@@ -1613,28 +1613,28 @@ function qt({
   const z = O({
     onLayoutChange: {},
     onLayoutChanged: {}
-  }), f = se((x) => {
+  }), f = re((x) => {
     K(z.current.onLayoutChange, x) || (z.current.onLayoutChange = x, r?.(x));
-  }), d = se(
+  }), d = re(
     (x, P) => {
       K(z.current.onLayoutChanged, x) || (z.current.onLayoutChanged = x, l?.(x, { isUserInteraction: P }));
     }
-  ), h = Le(a), y = O(null), [b, v] = Kt(), g = O({
+  ), h = Ce(a), y = O(null), [b, v] = Kt(), g = O({
     lastExpandedPanelSizes: {},
     layouts: {},
     panels: [],
     resizeTargetMinimumSize: m,
     separators: []
-  }), w = Ce(y, s);
+  }), w = Re(y, s);
   Xt(h, u);
-  const E = se(
+  const E = re(
     (x, P) => {
       const I = W(), R = Oe(x), M = H(x);
       if (M) {
-        let D = !1;
+        let k = !1;
         switch (I.state) {
           case "active": {
-            D = I.hitRegions.some(
+            k = I.hitRegions.some(
               (U) => U.group === R
             );
             break;
@@ -1642,7 +1642,7 @@ function qt({
         }
         return {
           flexGrow: M.layout[P] ?? 1,
-          pointerEvents: D ? "none" : void 0
+          pointerEvents: k ? "none" : void 0
         };
       }
       if (n?.[P])
@@ -1650,10 +1650,10 @@ function qt({
           flexGrow: n?.[P]
         };
     }
-  ), L = Re({
+  ), L = Ee({
     defaultLayout: n,
     disableCursor: o
-  }), G = Se(
+  }), G = ve(
     () => ({
       get disableCursor() {
         return !!L.disableCursor;
@@ -1663,7 +1663,7 @@ function qt({
       orientation: c,
       registerPanel: (x) => {
         const P = g.current;
-        return P.panels = be(c, [
+        return P.panels = ze(c, [
           ...P.panels,
           x
         ]), v(), () => {
@@ -1674,7 +1674,7 @@ function qt({
       },
       registerSeparator: (x) => {
         const P = g.current;
-        return P.separators = be(c, [
+        return P.separators = ze(c, [
           ...P.separators,
           x
         ]), v(), () => {
@@ -1688,10 +1688,10 @@ function qt({
           (U) => U.id === x
         );
         R && (R.panelConstraints.disabled = P);
-        const M = Oe(h), D = H(h);
-        M && D && j(M, {
-          ...D,
-          derivedPanelConstraints: ve(M)
+        const M = Oe(h), k = H(h);
+        M && k && j(M, {
+          ...k,
+          derivedPanelConstraints: be(M)
         });
       },
       updateSeparatorProps: (x, {
@@ -1699,7 +1699,7 @@ function qt({
         disableDoubleClick: I
       }) => {
         const M = g.current.separators.find(
-          (D) => D.id === x
+          (k) => k.id === x
         );
         M && (M.disabled = P, M.disableDoubleClick = I);
       }
@@ -1735,33 +1735,33 @@ function qt({
       separators: P.separators
     };
     N.current = R;
-    const M = Wt(R), { defaultLayoutDeferred: D, derivedPanelConstraints: U, layout: ue } = H(R.id, !0);
-    !D && U.length > 0 && (f(ue), d(ue, !1));
-    const oe = Pe(h, (_) => {
-      const { defaultLayoutDeferred: Y, derivedPanelConstraints: Me, layout: ce } = _.next;
-      if (Y || Me.length === 0)
+    const M = Wt(R), { defaultLayoutDeferred: k, derivedPanelConstraints: U, layout: le } = H(R.id, !0);
+    !k && U.length > 0 && (f(le), d(le, !1));
+    const ue = we(h, (_) => {
+      const { defaultLayoutDeferred: Y, derivedPanelConstraints: ce, layout: fe } = _.next;
+      if (Y || ce.length === 0)
         return;
       const ft = R.panels.map(({ id: $ }) => $).join(",");
-      R.mutableState.layouts[ft] = ce, Me.forEach(($) => {
+      R.mutableState.layouts[ft] = fe, ce.forEach(($) => {
         if ($.collapsible) {
-          const { layout: ge } = _.prev ?? {};
-          if (ge) {
-            const pt = k(
+          const { layout: ye } = _.prev ?? {};
+          if (ye) {
+            const pt = D(
               $.collapsedSize,
-              ce[$.panelId]
-            ), ht = k(
+              fe[$.panelId]
+            ), ht = D(
               $.collapsedSize,
-              ge[$.panelId]
+              ye[$.panelId]
             );
-            pt && !ht && (R.mutableState.expandedPanelSizes[$.panelId] = ge[$.panelId]);
+            pt && !ht && (R.mutableState.expandedPanelSizes[$.panelId] = ye[$.panelId]);
           }
         }
       });
       const dt = W().state !== "active";
-      f(ce), dt && d(ce, _.isUserInteraction);
+      f(fe), dt && d(fe, _.isUserInteraction);
     });
     return () => {
-      N.current = null, M(), oe();
+      N.current = null, M(), ue();
     };
   }, [
     i,
@@ -1771,10 +1771,10 @@ function qt({
     c,
     b,
     L
-  ]), me(() => {
+  ]), ge(() => {
     const x = N.current;
     x && (x.mutableState.defaultLayout = n, x.mutableState.disableCursor = !!o);
-  }), /* @__PURE__ */ ae(ct.Provider, { value: G, children: /* @__PURE__ */ ae(
+  }), /* @__PURE__ */ se(ct.Provider, { value: G, children: /* @__PURE__ */ se(
     "div",
     {
       ...S,
@@ -1802,7 +1802,7 @@ function qt({
   ) });
 }
 qt.displayName = "Group";
-function he(e, t) {
+function me(e, t) {
   return `react-resizable-panels:${[e, ...t].join(":")}`;
 }
 function Yt({
@@ -1810,7 +1810,7 @@ function Yt({
   panelIds: t,
   storage: n
 }) {
-  const o = he(e, []), i = n.getItem(o);
+  const o = me(e, []), i = n.getItem(o);
   if (i)
     try {
       const s = JSON.parse(i);
@@ -1847,31 +1847,31 @@ function an({
   storage: o = localStorage,
   ...i
 }) {
-  const s = n !== void 0, u = "id" in i ? i.id : i.groupId, a = he(u, n ?? []), r = qe(
+  const s = n !== void 0, u = "id" in i ? i.id : i.groupId, a = me(u, n ?? []), r = qe(
     Jt,
     () => o.getItem(a),
     () => o.getItem(a)
-  ), l = Se(() => {
+  ), l = ve(() => {
     if (r) {
       const d = JSON.parse(r), h = Object.values(d);
       if (Array.from(h).every((y) => typeof y == "number"))
         return d;
     }
-  }, [r]), c = Se(() => {
+  }, [r]), c = ve(() => {
     if (!l)
       return Yt({
         id: u,
         panelIds: n,
         storage: o
       });
-  }, [l, u, n, o]), m = l ?? c, p = O(null), S = re(() => {
+  }, [l, u, n, o]), m = l ?? c, p = O(null), S = ie(() => {
     const d = p.current;
     d && (p.current = null, clearTimeout(d));
   }, []);
   Ke(() => () => {
     S();
   }, [S]);
-  const z = re(
+  const z = ie(
     // The hook persists every layout commit -- including library-driven ones --
     // because it owns its own storage and the goal is to remember whatever
     // layout the user is currently looking at. Consumers that only want to
@@ -1882,7 +1882,7 @@ function an({
         return;
       S();
       let y;
-      s ? y = he(u, Object.keys(d)) : y = he(u, []);
+      s ? y = me(u, Object.keys(d)) : y = me(u, []);
       try {
         o.setItem(y, JSON.stringify(d));
       } catch (b) {
@@ -1896,7 +1896,7 @@ function an({
       t,
       o
     ]
-  ), f = re(
+  ), f = ie(
     (d) => {
       S(), e === 0 ? z(d, { isUserInteraction: !1 }) : p.current = setTimeout(() => {
         z(d, { isUserInteraction: !1 });
@@ -1931,7 +1931,7 @@ function ln() {
 function un() {
   return O(null);
 }
-function Ee() {
+function Me() {
   const e = yt(ct);
   return C(
     e,
@@ -1939,15 +1939,15 @@ function Ee() {
   ), e;
 }
 function Zt(e, t) {
-  const { id: n } = Ee(), o = O({
-    collapse: ye,
-    expand: ye,
+  const { id: n } = Me(), o = O({
+    collapse: Se,
+    expand: Se,
     getSize: () => ({
       asPercentage: 0,
       inPixels: 0
     }),
     isCollapsed: () => !1,
-    resize: ye
+    resize: Se
   });
   Xe(t, () => o.current, []), q(() => {
     Object.assign(
@@ -1973,17 +1973,17 @@ function Qt({
   style: S,
   ...z
 }) {
-  const f = !!r, d = Le(r), h = Re({
+  const f = !!r, d = Ce(r), h = Ee({
     disabled: s
-  }), y = O(null), b = Ce(y, u), {
+  }), y = O(null), b = Re(y, u), {
     getPanelStyles: v,
     id: g,
     orientation: w,
     registerPanel: E,
     updatePanelProps: L
-  } = Ee(), G = m !== null, N = se(
-    (R, M, D) => {
-      m?.(R, r, D);
+  } = Me(), G = m !== null, N = re(
+    (R, M, k) => {
+      m?.(R, r, k);
     }
   );
   q(() => {
@@ -2023,7 +2023,7 @@ function Qt({
     N,
     E,
     h
-  ]), me(() => {
+  ]), ge(() => {
     L(d, { disabled: s });
   }, [s, d, L]), Zt(d, p);
   const x = () => {
@@ -2031,7 +2031,7 @@ function Qt({
     if (R)
       return JSON.stringify(R);
   }, P = qe(
-    (R) => Pe(g, R),
+    (R) => we(g, R),
     x,
     x
   );
@@ -2040,7 +2040,7 @@ function Qt({
     flexGrow: void 0,
     flexShrink: void 0,
     flexBasis: i
-  } : I = { flexGrow: 1 }, /* @__PURE__ */ ae(
+  } : I = { flexGrow: 1 }, /* @__PURE__ */ se(
     "div",
     {
       ...z,
@@ -2057,7 +2057,7 @@ function Qt({
         overflow: "visible",
         ...I
       },
-      children: /* @__PURE__ */ ae(
+      children: /* @__PURE__ */ se(
         "div",
         {
           className: t,
@@ -2111,7 +2111,7 @@ function tn({
   if (a) {
     const r = a.maxSize, l = a.collapsible ? a.collapsedSize : a.minSize, c = [o, o + 1];
     s = X({
-      layout: le({
+      layout: ae({
         delta: l - u,
         initialLayout: e,
         panelConstraints: t,
@@ -2120,7 +2120,7 @@ function tn({
       }),
       panelConstraints: t
     })[n], i = X({
-      layout: le({
+      layout: ae({
         delta: r - u,
         initialLayout: e,
         panelConstraints: t,
@@ -2147,16 +2147,16 @@ function nn({
   style: u,
   ...a
 }) {
-  const r = Le(s), l = Re({
+  const r = Ce(s), l = Ee({
     disabled: n,
     disableDoubleClick: o
-  }), [c, m] = Q({}), [p, S] = Q("inactive"), [z, f] = Q(!1), d = O(null), h = Ce(d, i), {
+  }), [c, m] = Q({}), [p, S] = Q("inactive"), [z, f] = Q(!1), d = O(null), h = Re(d, i), {
     disableCursor: y,
     id: b,
     orientation: v,
     registerSeparator: g,
     updateSeparatorProps: w
-  } = Ee(), E = v === "horizontal" ? "vertical" : "horizontal";
+  } = Me(), E = v === "horizontal" ? "vertical" : "horizontal";
   q(() => {
     const N = d.current;
     if (N !== null) {
@@ -2169,20 +2169,22 @@ function nn({
         (M) => {
           S(
             M.next.state !== "inactive" && M.next.hitRegions.some(
-              (D) => D.separator === x
+              (k) => k.separator === x
             ) ? M.next.state : "inactive"
           );
         }
-      ), R = Pe(
+      ), R = we(
         b,
         (M) => {
-          const { derivedPanelConstraints: D, layout: U, separatorToPanels: ue } = M.next, oe = ue.get(x);
-          if (oe) {
-            const _ = oe[0], Y = oe.indexOf(_);
+          const { derivedPanelConstraints: k, layout: U, separatorToPanels: le } = M.next, ue = le.get(x);
+          if (ue) {
+            const _ = ue[0], Y = k.findIndex(
+              (ce) => ce.panelId === _.id
+            );
             m(
               tn({
                 layout: U,
-                panelConstraints: D,
+                panelConstraints: k,
                 panelId: _.id,
                 panelIndex: Y
               })
@@ -2194,7 +2196,7 @@ function nn({
         I(), R(), P();
       };
     }
-  }, [b, r, g, l]), me(() => {
+  }, [b, r, g, l]), ge(() => {
     w(r, { disabled: n, disableDoubleClick: o });
   }, [n, o, r, w]);
   let L;
@@ -2211,7 +2213,7 @@ function nn({
       default:
         z ? G = "focus" : G = p;
     }
-  return /* @__PURE__ */ ae(
+  return /* @__PURE__ */ se(
     "div",
     {
       ...a,