react-resizable-panels 4.0.10 → 4.0.11

package/dist/react-resizable-panels.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as K } from "react/jsx-runtime";
-import { useId as Xe, useLayoutEffect as Ye, useEffect as Ce, useRef as O, useCallback as Ee, createContext as qe, useImperativeHandle as Me, useState as I, useMemo as Ie, useSyncExternalStore as Ze, useContext as Je } from "react";
+import { useId as Xe, useLayoutEffect as Ye, useEffect as Re, useRef as O, useCallback as Ee, createContext as qe, useImperativeHandle as Me, useState as k, useMemo as ke, useSyncExternalStore as Ze, useContext as Je } from "react";
 function z(e, t = "Assertion error") {
   if (!e)
     throw Error(t);
@@ -24,7 +24,7 @@ function et(e, t) {
   const n = e.element.offsetTop - t.element.offsetTop;
   return n !== 0 ? n : e.element.offsetHeight - t.element.offsetHeight;
 }
-function Ge(e, t) {
+function Ie(e, t) {
   return {
     x: e.x >= t.left && e.x <= t.right ? 0 : Math.min(
       Math.abs(e.x - t.left),
@@ -47,12 +47,12 @@ function tt({
   };
   let r, a = Number.MAX_VALUE;
   for (const l of t) {
-    const { x: i, y: s } = Ge(o, l), u = e === "horizontal" ? i : s;
+    const { x: i, y: s } = Ie(o, l), u = e === "horizontal" ? i : s;
     u < a && (a = u, r = l);
   }
   return z(r, "No rect found"), r;
 }
-function ke(e) {
+function Ge(e) {
   const { element: t, orientation: n, panels: o, separators: r } = e, a = se(
     n,
     Array.from(t.children).filter((c) => c instanceof HTMLElement).map((c) => ({ element: c }))
@@ -83,14 +83,14 @@ function ke(e) {
                 break;
               }
               case 1: {
-                const g = u[0], v = tt({
+                const v = u[0], S = tt({
                   orientation: n,
                   rects: [m, p],
-                  targetRect: g.element.getBoundingClientRect()
+                  targetRect: v.element.getBoundingClientRect()
                 });
                 f = [
-                  g,
-                  v === m ? y : d
+                  v,
+                  S === m ? y : d
                 ];
                 break;
               }
@@ -192,7 +192,7 @@ function te({
   }
   return o;
 }
-function G(e) {
+function I(e) {
   return parseFloat(e.toFixed(3));
 }
 function ye(e) {
@@ -213,7 +213,7 @@ function ye(e) {
         panelElement: r,
         styleProp: a.collapsedSize
       });
-      l = G(c / n * 100);
+      l = I(c / n * 100);
     }
     let i;
     if (a.defaultSize) {
@@ -222,7 +222,7 @@ function ye(e) {
         panelElement: r,
         styleProp: a.defaultSize
       });
-      i = G(c / n * 100);
+      i = I(c / n * 100);
     }
     let s = 0;
     if (a.minSize) {
@@ -231,7 +231,7 @@ function ye(e) {
         panelElement: r,
         styleProp: a.minSize
       });
-      s = G(c / n * 100);
+      s = I(c / n * 100);
     }
     let u = 100;
     if (a.maxSize) {
@@ -240,7 +240,7 @@ function ye(e) {
         panelElement: r,
         styleProp: a.maxSize
       });
-      u = G(c / n * 100);
+      u = I(c / n * 100);
     }
     return {
       collapsedSize: l,
@@ -292,9 +292,9 @@ class at {
   }
 }
 function P(e, t, n = 0) {
-  return Math.abs(G(e) - G(t)) <= n;
+  return Math.abs(I(e) - I(t)) <= n;
 }
-let C = {
+let R = {
   cursorFlags: 0,
   interactionState: {
     state: "inactive"
@@ -303,17 +303,17 @@ let C = {
 };
 const _ = new at();
 function D() {
-  return C;
+  return R;
 }
 function E(e) {
-  const t = typeof e == "function" ? e(C) : e;
-  if (C === t)
-    return C;
-  const n = C;
-  return C = {
-    ...C,
+  const t = typeof e == "function" ? e(R) : e;
+  if (R === t)
+    return R;
+  const n = R;
+  return R = {
+    ...R,
     ...t
-  }, t.cursorFlags !== void 0 && _.emit("cursorFlagsChange", C.cursorFlags), t.interactionState !== void 0 && _.emit("interactionStateChange", C.interactionState), t.mountedGroups !== void 0 && (C.mountedGroups.forEach((o, r) => {
+  }, t.cursorFlags !== void 0 && _.emit("cursorFlagsChange", R.cursorFlags), t.interactionState !== void 0 && _.emit("interactionStateChange", R.interactionState), t.mountedGroups !== void 0 && (R.mountedGroups.forEach((o, r) => {
     o.derivedPanelConstraints.forEach((a) => {
       if (a.collapsible) {
         const { layout: l } = n.mountedGroups.get(r) ?? {};
@@ -329,7 +329,7 @@ function E(e) {
         }
       }
     });
-  }), _.emit("mountedGroupsChange", C.mountedGroups)), C;
+  }), _.emit("mountedGroupsChange", R.mountedGroups)), R;
 }
 const lt = (e) => e, ie = () => {
 }, De = 1, Oe = 2, Te = 4, _e = 8, ge = {
@@ -379,9 +379,9 @@ function ut({
   }
   return o > 0 && r > 0 ? "move" : o > 0 ? "ew-resize" : "ns-resize";
 }
-let re, k;
+let re, G;
 function le() {
-  k === void 0 && (k = new CSSStyleSheet(), document.adoptedStyleSheets = [k]);
+  G === void 0 && (G = new CSSStyleSheet(), document.adoptedStyleSheets = [G]);
   const { cursorFlags: e, interactionState: t } = D();
   switch (t.state) {
     case "active":
@@ -393,11 +393,11 @@ function le() {
       }), o = `*{cursor: ${n} !important; ${t.state === "active" ? "touch-action: none;" : ""} }`;
       if (re === o)
         return;
-      re = o, n ? k.cssRules.length === 0 ? k.insertRule(o) : k.replaceSync(o) : k.cssRules.length === 1 && k.deleteRule(0);
+      re = o, n ? G.cssRules.length === 0 ? G.insertRule(o) : G.replaceSync(o) : G.cssRules.length === 1 && G.deleteRule(0);
       break;
     }
     case "inactive": {
-      re = void 0, k.cssRules.length === 1 && k.deleteRule(0);
+      re = void 0, G.cssRules.length === 1 && G.deleteRule(0);
       break;
     }
   }
@@ -413,7 +413,7 @@ function ct(e, t) {
 function X(e, t) {
   return P(e, t) ? 0 : e > t ? 1 : -1;
 }
-function j({
+function W({
   panelConstraints: e,
   size: t
 }) {
@@ -429,7 +429,7 @@ function j({
       X(t, l) < 0 ? t = n : t = a;
     } else
       t = a;
-  return t = Math.min(r, t), t = G(t), t;
+  return t = Math.min(r, t), t = I(t), t;
 }
 function Y({
   delta: e,
@@ -453,17 +453,17 @@ function Y({
       );
       const {
         collapsedSize: y = 0,
-        collapsible: g,
-        minSize: v = 0
+        collapsible: v,
+        minSize: S = 0
       } = d;
-      if (g) {
+      if (v) {
         const x = l[f];
         if (z(
           x != null,
           `Previous layout not found for panel index ${f}`
         ), P(x, y)) {
-          const S = v - x;
-          X(S, Math.abs(e)) > 0 && (e = e < 0 ? 0 - S : S);
+          const g = S - x;
+          X(g, Math.abs(e)) > 0 && (e = e < 0 ? 0 - g : g);
         }
       }
     }
@@ -475,17 +475,17 @@ function Y({
       );
       const {
         collapsedSize: y = 0,
-        collapsible: g,
-        minSize: v = 0
+        collapsible: v,
+        minSize: S = 0
       } = d;
-      if (g) {
+      if (v) {
         const x = l[f];
         if (z(
           x != null,
           `Previous layout not found for panel index ${f}`
-        ), P(x, v)) {
-          const S = x - y;
-          X(S, Math.abs(e)) > 0 && (e = e < 0 ? 0 - S : S);
+        ), P(x, S)) {
+          const g = x - y;
+          X(g, Math.abs(e)) > 0 && (e = e < 0 ? 0 - g : g);
         }
       }
     }
@@ -494,34 +494,34 @@ function Y({
     const f = e < 0 ? 1 : -1;
     let d = e < 0 ? c : u, y = 0;
     for (; ; ) {
-      const v = l[d];
+      const S = l[d];
       z(
-        v != null,
+        S != null,
         `Previous layout not found for panel index ${d}`
       );
-      const S = j({
+      const g = W({
         panelConstraints: n[d],
         size: 100
-      }) - v;
-      if (y += S, d += f, d < 0 || d >= n.length)
+      }) - S;
+      if (y += g, d += f, d < 0 || d >= n.length)
         break;
     }
-    const g = Math.min(Math.abs(e), Math.abs(y));
-    e = e < 0 ? 0 - g : g;
+    const v = Math.min(Math.abs(e), Math.abs(y));
+    e = e < 0 ? 0 - v : v;
   }
   {
     let d = e < 0 ? u : c;
     for (; d >= 0 && d < n.length; ) {
-      const y = Math.abs(e) - Math.abs(h), g = l[d];
+      const y = Math.abs(e) - Math.abs(h), v = l[d];
       z(
-        g != null,
+        v != null,
         `Previous layout not found for panel index ${d}`
       );
-      const v = g - y, x = j({
+      const S = v - y, x = W({
         panelConstraints: n[d],
-        size: v
+        size: S
       });
-      if (!P(g, x) && (h += g - x, s[d] = x, h.toFixed(3).localeCompare(Math.abs(e).toFixed(3), void 0, {
+      if (!P(v, x) && (h += v - x, s[d] = x, h.toFixed(3).localeCompare(Math.abs(e).toFixed(3), void 0, {
         numeric: !0
       }) >= 0))
         break;
@@ -536,25 +536,25 @@ function Y({
       d != null,
       `Previous layout not found for panel index ${f}`
     );
-    const y = d + h, g = j({
+    const y = d + h, v = W({
       panelConstraints: n[f],
       size: y
     });
-    if (s[f] = g, !P(g, y)) {
-      let v = y - g, S = e < 0 ? c : u;
-      for (; S >= 0 && S < n.length; ) {
-        const b = s[S];
+    if (s[f] = v, !P(v, y)) {
+      let S = y - v, g = e < 0 ? c : u;
+      for (; g >= 0 && g < n.length; ) {
+        const b = s[g];
         z(
           b != null,
-          `Previous layout not found for panel index ${S}`
+          `Previous layout not found for panel index ${g}`
         );
-        const L = b + v, R = j({
-          panelConstraints: n[S],
+        const L = b + S, C = W({
+          panelConstraints: n[g],
           size: L
         });
-        if (P(b, R) || (v -= R - b, s[S] = R), P(v, 0))
+        if (P(b, C) || (S -= C - b, s[g] = C), P(S, 0))
           break;
-        e > 0 ? S-- : S++;
+        e > 0 ? g-- : g++;
       }
     }
   }
@@ -591,19 +591,19 @@ function Ae({
     const f = n.get(s), {
       defaultLayoutDeferred: d,
       derivedPanelConstraints: y,
-      layout: g,
-      separatorToPanels: v
+      layout: v,
+      separatorToPanels: S
     } = o.get(s) ?? { defaultLayoutDeferred: !1 };
-    if (y && f && g && v) {
+    if (y && f && v && S) {
       const x = Y({
         delta: p,
         initialLayout: f,
         panelConstraints: y,
-        pivotIndices: i.panels.map((S) => m.indexOf(S)),
-        prevLayout: g,
+        pivotIndices: i.panels.map((g) => m.indexOf(g)),
+        prevLayout: v,
         trigger: "mouse-or-touch"
       });
-      if (U(x, g)) {
+      if (U(x, v)) {
         if (p !== 0 && !c)
           switch (h) {
             case "horizontal": {
@@ -620,10 +620,10 @@ function Ae({
           defaultLayoutDeferred: d,
           derivedPanelConstraints: y,
           layout: x,
-          separatorToPanels: v
+          separatorToPanels: S
         });
-        const S = i.group.panels.map(({ id: b }) => b).join(",");
-        i.group.inMemoryLayouts[S] = x;
+        const g = i.group.panels.map(({ id: b }) => b).join(",");
+        i.group.inMemoryLayouts[g] = x;
       }
     }
   }), E({
@@ -683,7 +683,7 @@ function A({
   for (let i = 0; i < t.length; i++) {
     const s = o[i];
     z(s != null, `No layout data found for index ${i}`);
-    const u = j({
+    const u = W({
       panelConstraints: t[i],
       size: s
     });
@@ -693,7 +693,7 @@ function A({
     for (let i = 0; i < t.length; i++) {
       const s = o[i];
       z(s != null, `No layout data found for index ${i}`);
-      const u = s + a, c = j({
+      const u = s + a, c = W({
         panelConstraints: t[i],
         size: u
       });
@@ -838,7 +838,7 @@ function ft(e, t, n) {
     y: 1 / 0
   };
   for (const a of t) {
-    const l = Ge(n, a.rect);
+    const l = Ie(n, a.rect);
     switch (e) {
       case "horizontal": {
         l.x <= r.x && (o = a, r = l);
@@ -947,7 +947,7 @@ function He(e, t) {
   return t.forEach((o, r) => {
     if (r.disabled)
       return;
-    const a = dt() ? ge.coarse : ge.precise, l = ke(r), i = ft(r.orientation, l, {
+    const a = dt() ? ge.coarse : ge.precise, l = Ge(r), i = ft(r.orientation, l, {
       x: e.clientX,
       y: e.clientY
     });
@@ -1036,19 +1036,19 @@ function Pe(e) {
       }), le();
   }
 }
-function Re(e) {
+function Ce(e) {
   let t = 0, n = 0;
   const o = {};
   for (const a of e)
     if (a.defaultSize !== void 0) {
       t++;
-      const l = G(a.defaultSize);
+      const l = I(a.defaultSize);
       n += l, o[a.panelId] = l;
     } else
       o[a.panelId] = void 0;
   const r = e.length - t;
   if (r !== 0) {
-    const a = G((100 - n) / r);
+    const a = I((100 - n) / r);
     for (const l of e)
       l.defaultSize === void 0 && (o[l.panelId] = a);
   }
@@ -1064,7 +1064,7 @@ function St(e, t, n) {
   const a = B({ group: e });
   r.onResize(
     {
-      asPercentage: G(
+      asPercentage: I(
         o.inlineSize / a * 100
       ),
       inPixels: o.inlineSize
@@ -1072,7 +1072,15 @@ function St(e, t, n) {
     r.id
   );
 }
-function xt(e) {
+function xt(e, t) {
+  if (Object.keys(e).length !== Object.keys(t).length)
+    return !1;
+  for (const o in e)
+    if (e[o] !== t[o])
+      return !1;
+  return !0;
+}
+function zt(e) {
   let t = !0;
   const n = /* @__PURE__ */ new Set(), o = /* @__PURE__ */ new Set(), r = new ResizeObserver((p) => {
     for (const f of p) {
@@ -1081,23 +1089,26 @@ function xt(e) {
         if (t) {
           if (B({ group: e }) === 0)
             return;
-          E((v) => {
-            const x = v.mountedGroups.get(e);
+          E((S) => {
+            const x = S.mountedGroups.get(e);
             if (x) {
-              const S = ye(e), b = x.defaultLayoutDeferred ? Re(S) : x.layout, L = A({
+              const g = ye(e), b = x.defaultLayoutDeferred ? Ce(g) : x.layout, L = A({
                 layout: b,
-                panelConstraints: S
+                panelConstraints: g
               });
-              return !x.defaultLayoutDeferred && U(b, L) ? v : {
-                mountedGroups: new Map(v.mountedGroups).set(e, {
+              return !x.defaultLayoutDeferred && U(b, L) && xt(
+                x.derivedPanelConstraints,
+                g
+              ) ? S : {
+                mountedGroups: new Map(S.mountedGroups).set(e, {
                   defaultLayoutDeferred: !1,
-                  derivedPanelConstraints: S,
+                  derivedPanelConstraints: g,
                   layout: L,
                   separatorToPanels: x.separatorToPanels
                 })
               };
             }
-            return v;
+            return S;
           });
         }
       } else
@@ -1113,10 +1124,10 @@ function xt(e) {
   const a = B({ group: e }), l = ye(e), i = e.panels.map(({ id: p }) => p).join(",");
   let s = e.defaultLayout;
   s && e.panels.length !== Object.keys(s).length && (s = void 0);
-  const u = e.inMemoryLayouts[i] ?? s ?? Re(l), c = A({
+  const u = e.inMemoryLayouts[i] ?? s ?? Ce(l), c = A({
     layout: u,
     panelConstraints: l
-  }), h = ke(e), m = E((p) => {
+  }), h = Ge(e), m = E((p) => {
     const f = /* @__PURE__ */ new Map();
     return h.forEach((d) => {
       d.separator && f.set(d.separator, d.panels);
@@ -1149,7 +1160,7 @@ function ue(e) {
   const t = Xe();
   return `${e ?? t}`;
 }
-const N = typeof window < "u" ? Ye : Ce;
+const N = typeof window < "u" ? Ye : Re;
 function ce(e) {
   const t = O(e);
   return N(() => {
@@ -1173,20 +1184,20 @@ function fe(...e) {
     });
   });
 }
-function zt(e) {
+function wt(e) {
   const t = O({ ...e });
   return N(() => {
     for (const n in e)
       t.current[n] = e[n];
   }, [e]), t.current;
 }
-const We = "--react-resizable-panels--panel--pointer-events";
-function je(e, t) {
+const je = "--react-resizable-panels--panel--pointer-events";
+function We(e, t) {
   const n = e.replace(/[^a-zA-Z0-9\-_]/g, ""), o = t.replace(/[^a-zA-Z0-9\-_]/g, "");
   return `--react-resizable-panels--${n}--${o}`;
 }
 const Be = qe(null);
-function wt(e, t) {
+function bt(e, t) {
   const n = O({
     getLayout: () => ({}),
     setLayout: lt
@@ -1214,12 +1225,12 @@ function Gt({
 }) {
   const m = O({}), p = ce((w) => {
     U(m.current, w) || (m.current = w, s?.(w));
-  }), f = ue(i), [d, y] = I(!1), [g, v] = I(null), [x, S] = I(n ?? {}), [b, L] = I([]), [R, q] = I([]), Z = O({
+  }), f = ue(i), [d, y] = k(!1), [v, S] = k(null), [x, g] = k(n ?? {}), [b, L] = k([]), [C, q] = k([]), Z = O({
     lastExpandedPanelSizes: {},
     layouts: {}
-  }), J = fe(v, a);
-  wt(f, l);
-  const Q = Ie(
+  }), J = fe(S, a);
+  bt(f, l);
+  const Q = ke(
     () => ({
       id: f,
       orientation: u,
@@ -1235,30 +1246,30 @@ function Gt({
       })
     }),
     [f, u]
-  ), $ = zt({
+  ), $ = wt({
     defaultLayout: n,
     disableCursor: o
   }), V = O(null);
   N(() => {
-    if (g === null)
+    if (v === null)
       return;
     const w = {
       defaultLayout: $.defaultLayout,
       disableCursor: !!$.disableCursor,
       disabled: !!r,
-      element: g,
+      element: v,
       id: f,
       inMemoryLastExpandedPanelSizes: Z.current.lastExpandedPanelSizes,
       inMemoryLayouts: Z.current.layouts,
       orientation: u,
       panels: b,
-      separators: R
+      separators: C
     };
     V.current = w;
-    const M = xt(w), he = D().mountedGroups.get(w);
+    const M = zt(w), he = D().mountedGroups.get(w);
     if (he) {
-      const { defaultLayoutDeferred: H, derivedPanelConstraints: W, layout: ee } = he;
-      !H && W.length > 0 && (S(ee), p?.(ee));
+      const { defaultLayoutDeferred: H, derivedPanelConstraints: j, layout: ee } = he;
+      !H && j.length > 0 && (g(ee), p?.(ee));
     }
     const Ue = _.addListener(
       "interactionStateChange",
@@ -1267,7 +1278,7 @@ function Gt({
           case "active": {
             y(
               H.hitRegions.some(
-                (W) => W.group === w
+                (j) => j.group === w
               )
             );
             break;
@@ -1281,12 +1292,12 @@ function Gt({
     ), Ve = _.addListener(
       "mountedGroupsChange",
       (H) => {
-        const W = H.get(w);
-        if (W) {
-          const { defaultLayoutDeferred: ee, derivedPanelConstraints: Ke, layout: me } = W;
+        const j = H.get(w);
+        if (j) {
+          const { defaultLayoutDeferred: ee, derivedPanelConstraints: Ke, layout: me } = j;
           if (ee || Ke.length === 0)
             return;
-          S(me), p?.(me);
+          g(me), p?.(me);
         }
       }
     );
@@ -1295,22 +1306,22 @@ function Gt({
     };
   }, [
     r,
-    g,
+    v,
     f,
     p,
     u,
     b,
-    R,
+    C,
     $
-  ]), Ce(() => {
+  ]), Re(() => {
     const w = V.current;
     w && (w.defaultLayout = n, w.disableCursor = !!o);
   });
   const pe = {
-    [We]: d ? "none" : void 0
+    [je]: d ? "none" : void 0
   };
   for (const w in x) {
-    const M = je(f, w), F = x[w];
+    const M = We(f, w), F = x[w];
     pe[M] = F;
   }
   return /* @__PURE__ */ K(Be.Provider, { value: Q, children: /* @__PURE__ */ K(
@@ -1337,7 +1348,7 @@ function Gt({
 function ae(e) {
   return `react-resizable-panels:${e}`;
 }
-function bt({
+function Lt({
   id: e,
   layout: t,
   storage: n
@@ -1349,19 +1360,19 @@ function bt({
     console.error(o);
   }
 }
-function kt({
+function Dt({
   groupId: e,
   storage: t
 }) {
   const n = Ze(
-    Lt,
+    Pt,
     () => t.getItem(ae(e)),
     () => t.getItem(ae(e))
-  ), o = Ie(
+  ), o = ke(
     () => n ? JSON.parse(n) : void 0,
     [n]
   ), r = Ee(
-    (a) => bt({
+    (a) => Lt({
       id: e,
       layout: a,
       storage: t
@@ -1373,14 +1384,14 @@ function kt({
     onLayoutChange: r
   };
 }
-function Lt() {
+function Pt() {
   return function() {
   };
 }
-function Dt() {
-  return I(null);
-}
 function Ot() {
+  return k(null);
+}
+function Tt() {
   return O(null);
 }
 function de() {
@@ -1390,7 +1401,7 @@ function de() {
     "Group Context not found; did you render a Panel or Separator outside of a Group?"
   ), e;
 }
-function Pt({
+function Ct({
   groupId: e,
   panelId: t
 }) {
@@ -1441,22 +1452,22 @@ function Pt({
       group: h,
       layout: m,
       separatorToPanels: p
-    } = n(), f = h.panels.findIndex((v) => v.id === t), d = f === h.panels.length - 1, y = Y({
+    } = n(), f = h.panels.findIndex((S) => S.id === t), d = f === h.panels.length - 1, y = Y({
       delta: d ? s - i : i - s,
       initialLayout: m,
       panelConstraints: c,
       pivotIndices: d ? [f - 1, f] : [f, f + 1],
       prevLayout: m,
       trigger: "imperative-api"
-    }), g = A({
+    }), v = A({
       layout: y,
       panelConstraints: c
     });
-    U(m, g) || E((v) => ({
-      mountedGroups: new Map(v.mountedGroups).set(h, {
+    U(m, v) || E((S) => ({
+      mountedGroups: new Map(S.mountedGroups).set(h, {
         defaultLayoutDeferred: u,
         derivedPanelConstraints: c,
-        layout: g,
+        layout: v,
         separatorToPanels: p
       })
     }));
@@ -1487,7 +1498,7 @@ function Pt({
         switch (typeof i) {
           case "number": {
             const { group: c } = n(), h = B({ group: c });
-            u = G(i / h * 100);
+            u = I(i / h * 100);
             break;
           }
           case "string": {
@@ -1514,11 +1525,11 @@ function Rt(e, t) {
   Me(t, () => o.current, []), N(() => {
     Object.assign(
       o.current,
-      Pt({ groupId: n, panelId: e })
+      Ct({ groupId: n, panelId: e })
     );
   });
 }
-function Tt({
+function _t({
   children: e,
   className: t,
   collapsedSize: n = "0%",
@@ -1533,8 +1544,8 @@ function Tt({
   style: h,
   ...m
 }) {
-  const p = !!l, f = ue(l), [d, y] = I(null), g = fe(y, a), { id: v, registerPanel: x } = de(), S = u !== null, b = ce((R) => {
-    u?.(R, l);
+  const p = !!l, f = ue(l), [d, y] = k(null), v = fe(y, a), { id: S, registerPanel: x } = de(), g = u !== null, b = ce((C) => {
+    u?.(C, l);
   });
   N(() => {
     if (d !== null)
@@ -1542,7 +1553,7 @@ function Tt({
         element: d,
         id: f,
         idIsStable: p,
-        onResize: S ? b : void 0,
+        onResize: g ? b : void 0,
         panelConstraints: {
           collapsedSize: n,
           collapsible: o,
@@ -1556,7 +1567,7 @@ function Tt({
     o,
     r,
     d,
-    S,
+    g,
     f,
     p,
     i,
@@ -1564,7 +1575,7 @@ function Tt({
     b,
     x
   ]), Rt(f, c);
-  const L = je(v, f);
+  const L = We(S, f);
   return /* @__PURE__ */ K(
     "div",
     {
@@ -1572,9 +1583,9 @@ function Tt({
       "data-panel": !0,
       "data-testid": f,
       id: f,
-      ref: g,
+      ref: v,
       style: {
-        ...Ct,
+        ...Et,
         flexBasis: 0,
         flexGrow: `var(${L}, 1)`,
         flexShrink: 1,
@@ -1582,7 +1593,7 @@ function Tt({
         overflow: "hidden",
         // Disable pointer events inside of a panel during resize
         // This avoid edge cases like nested iframes
-        pointerEvents: `var(${We})`
+        pointerEvents: `var(${je})`
       },
       children: /* @__PURE__ */ K(
         "div",
@@ -1599,7 +1610,7 @@ function Tt({
     }
   );
 }
-const Ct = {
+const Et = {
   minHeight: "unset",
   maxHeight: "unset",
   height: "unset",
@@ -1615,13 +1626,13 @@ const Ct = {
   padding: "unset",
   margin: "unset"
 };
-function _t() {
-  return I(null);
-}
 function At() {
+  return k(null);
+}
+function Nt() {
   return O(null);
 }
-function Et({
+function Mt({
   layout: e,
   panelConstraints: t,
   panelId: n,
@@ -1662,7 +1673,7 @@ function Et({
     valueNow: l
   };
 }
-function Nt({
+function $t({
   children: e,
   className: t,
   elementRef: n,
@@ -1670,22 +1681,22 @@ function Nt({
   style: r,
   ...a
 }) {
-  const l = ue(o), [i, s] = I({}), [u, c] = I("inactive"), [h, m] = I(null), p = fe(m, n), {
+  const l = ue(o), [i, s] = k({}), [u, c] = k("inactive"), [h, m] = k(null), p = fe(m, n), {
     id: f,
     orientation: d,
     registerSeparator: y
-  } = de(), g = d === "horizontal" ? "vertical" : "horizontal";
+  } = de(), v = d === "horizontal" ? "vertical" : "horizontal";
   return N(() => {
     if (h !== null) {
-      const v = {
+      const S = {
         element: h,
         id: l
-      }, x = y(v), S = _.addListener(
+      }, x = y(S), g = _.addListener(
         "interactionStateChange",
         (L) => {
           c(
             L.state !== "inactive" && L.hitRegions.some(
-              (R) => R.separator === v
+              (C) => C.separator === S
             ) ? L.state : "inactive"
           );
         }
@@ -1693,15 +1704,15 @@ function Nt({
         "mountedGroupsChange",
         (L) => {
           L.forEach(
-            ({ derivedPanelConstraints: R, layout: q, separatorToPanels: Z }, J) => {
+            ({ derivedPanelConstraints: C, layout: q, separatorToPanels: Z }, J) => {
               if (J.id === f) {
-                const Q = Z.get(v);
+                const Q = Z.get(S);
                 if (Q) {
                   const $ = Q[0], V = J.panels.indexOf($);
                   s(
-                    Et({
+                    Mt({
                       layout: q,
-                      panelConstraints: R,
+                      panelConstraints: C,
                       panelId: $.id,
                       panelIndex: V
                     })
@@ -1713,7 +1724,7 @@ function Nt({
         }
       );
       return () => {
-        S(), b(), x();
+        g(), b(), x();
       };
     }
   }, [h, f, l, y]), /* @__PURE__ */ K(
@@ -1721,7 +1732,7 @@ function Nt({
     {
       ...a,
       "aria-controls": i.valueControls,
-      "aria-orientation": g,
+      "aria-orientation": v,
       "aria-valuemax": i.valueMax,
       "aria-valuemin": i.valueMin,
       "aria-valuenow": i.valueNow,
@@ -1744,12 +1755,12 @@ function Nt({
 }
 export {
   Gt as Group,
-  Tt as Panel,
-  Nt as Separator,
-  kt as useDefaultLayout,
-  Dt as useGroupCallbackRef,
-  Ot as useGroupRef,
-  _t as usePanelCallbackRef,
-  At as usePanelRef
+  _t as Panel,
+  $t as Separator,
+  Dt as useDefaultLayout,
+  Ot as useGroupCallbackRef,
+  Tt as useGroupRef,
+  At as usePanelCallbackRef,
+  Nt as usePanelRef
 };
 //# sourceMappingURL=react-resizable-panels.js.map