react-resizable-panels 4.0.15 → 4.1.0

package/dist/react-resizable-panels.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as K } from "react/jsx-runtime";
-import { useId as Ke, useLayoutEffect as Xe, useEffect as Re, useRef as D, useCallback as qe, createContext as Ye, useImperativeHandle as Ee, useState as I, useMemo as ie, useSyncExternalStore as Ze, useContext as Je } from "react";
+import { useId as Ke, useLayoutEffect as Xe, useEffect as Ce, useRef as I, useCallback as qe, createContext as Ye, useImperativeHandle as Ee, useState as D, useMemo as se, useSyncExternalStore as Ze, useContext as Je } from "react";
 function z(e, t = "Assertion error") {
   if (!e)
     throw Error(t);
@@ -11,7 +11,7 @@ function W({
   const { orientation: t, panels: n } = e;
   return n.reduce((o, i) => (o += t === "horizontal" ? i.element.offsetWidth : i.element.offsetHeight, o), 0);
 }
-function se(e, t) {
+function ae(e, t) {
   return t.sort(
     e === "horizontal" ? Qe : et
   );
@@ -56,7 +56,7 @@ function tt({
   return z(i, "No rect found"), i;
 }
 function ke(e) {
-  const { element: t, orientation: n, panels: o, separators: i } = e, s = se(
+  const { element: t, orientation: n, panels: o, separators: i } = e, s = ae(
     n,
     Array.from(t.children).filter(Me).map((f) => ({ element: f }))
   ).map(({ element: f }) => f), l = [];
@@ -64,19 +64,19 @@ function ke(e) {
   for (const f of s)
     if (f.hasAttribute("data-panel")) {
       const p = o.find(
-        (m) => m.element === f
+        (h) => h.element === f
       );
       if (p) {
         if (a) {
-          const m = a.element.getBoundingClientRect(), h = f.getBoundingClientRect();
+          const h = a.element.getBoundingClientRect(), m = f.getBoundingClientRect();
           let c;
           if (r) {
-            const d = n === "horizontal" ? new DOMRect(m.right, m.top, 0, m.height) : new DOMRect(
-              m.left,
-              m.bottom,
-              m.width,
+            const d = n === "horizontal" ? new DOMRect(h.right, h.top, 0, h.height) : new DOMRect(
+              h.left,
+              h.bottom,
+              h.width,
               0
-            ), y = n === "horizontal" ? new DOMRect(h.left, h.top, 0, h.height) : new DOMRect(h.left, h.top, h.width, 0);
+            ), y = n === "horizontal" ? new DOMRect(m.left, m.top, 0, m.height) : new DOMRect(m.left, m.top, m.width, 0);
             switch (u.length) {
               case 0: {
                 c = [
@@ -88,12 +88,12 @@ function ke(e) {
               case 1: {
                 const v = u[0], S = tt({
                   orientation: n,
-                  rects: [m, h],
+                  rects: [h, m],
                   targetRect: v.element.getBoundingClientRect()
                 });
                 c = [
                   v,
-                  S === m ? y : d
+                  S === h ? y : d
                 ];
                 break;
               }
@@ -105,15 +105,15 @@ function ke(e) {
           } else
             u.length ? c = u : c = [
               n === "horizontal" ? new DOMRect(
-                m.right,
-                h.top,
-                h.left - m.right,
-                h.height
+                h.right,
+                m.top,
+                m.left - h.right,
+                m.height
               ) : new DOMRect(
-                h.left,
-                m.bottom,
-                h.width,
-                h.top - m.bottom
+                m.left,
+                h.bottom,
+                m.width,
+                m.top - h.bottom
               )
             ];
           for (const d of c)
@@ -129,7 +129,7 @@ function ke(e) {
       }
     } else if (f.hasAttribute("data-separator")) {
       const p = i.find(
-        (m) => m.element === f
+        (h) => h.element === f
       );
       p ? u.push(p) : (a = void 0, u = []);
     } else
@@ -160,7 +160,7 @@ function st(e) {
     }
   }
 }
-function te({
+function ee({
   groupSize: e,
   panelElement: t,
   styleProp: n
@@ -211,7 +211,7 @@ function me(e) {
     const { element: i, panelConstraints: s } = o;
     let l = 0;
     if (s.collapsedSize) {
-      const f = te({
+      const f = ee({
         groupSize: n,
         panelElement: i,
         styleProp: s.collapsedSize
@@ -220,7 +220,7 @@ function me(e) {
     }
     let r;
     if (s.defaultSize) {
-      const f = te({
+      const f = ee({
         groupSize: n,
         panelElement: i,
         styleProp: s.defaultSize
@@ -229,7 +229,7 @@ function me(e) {
     }
     let a = 0;
     if (s.minSize) {
-      const f = te({
+      const f = ee({
         groupSize: n,
         panelElement: i,
         styleProp: s.minSize
@@ -238,7 +238,7 @@ function me(e) {
     }
     let u = 100;
     if (s.maxSize) {
-      const f = te({
+      const f = ee({
         groupSize: n,
         panelElement: i,
         styleProp: s.maxSize
@@ -294,37 +294,37 @@ class at {
     }
   }
 }
-function C(e, t, n = 0) {
+function R(e, t, n = 0) {
   return Math.abs(k(e) - k(t)) <= n;
 }
-let R = {
+let E = {
   cursorFlags: 0,
   interactionState: {
     state: "inactive"
   },
   mountedGroups: /* @__PURE__ */ new Map()
 };
-const T = new at();
+const _ = new at();
 function G() {
-  return R;
-}
-function E(e) {
-  const t = typeof e == "function" ? e(R) : e;
-  if (R === t)
-    return R;
-  const n = R;
-  return R = {
-    ...R,
+  return E;
+}
+function M(e) {
+  const t = typeof e == "function" ? e(E) : e;
+  if (E === t)
+    return E;
+  const n = E;
+  return E = {
+    ...E,
     ...t
-  }, t.cursorFlags !== void 0 && T.emit("cursorFlagsChange", R.cursorFlags), t.interactionState !== void 0 && T.emit("interactionStateChange", R.interactionState), t.mountedGroups !== void 0 && (R.mountedGroups.forEach((o, i) => {
+  }, t.cursorFlags !== void 0 && _.emit("cursorFlagsChange", E.cursorFlags), t.interactionState !== void 0 && _.emit("interactionStateChange", E.interactionState), t.mountedGroups !== void 0 && (E.mountedGroups.forEach((o, i) => {
     o.derivedPanelConstraints.forEach((s) => {
       if (s.collapsible) {
         const { layout: l } = n.mountedGroups.get(i) ?? {};
         if (l) {
-          const r = C(
+          const r = R(
             s.collapsedSize,
             o.layout[s.panelId]
-          ), a = C(
+          ), a = R(
             s.collapsedSize,
             l[s.panelId]
           );
@@ -332,7 +332,7 @@ function E(e) {
         }
       }
     });
-  }), T.emit("mountedGroupsChange", R.mountedGroups)), R;
+  }), _.emit("mountedGroupsChange", E.mountedGroups)), E;
 }
 function lt(e, t) {
   if (e.length !== t.length)
@@ -343,9 +343,9 @@ function lt(e, t) {
   return !0;
 }
 function X(e, t) {
-  return C(e, t) ? 0 : e > t ? 1 : -1;
+  return R(e, t) ? 0 : e > t ? 1 : -1;
 }
-function B({
+function V({
   panelConstraints: e,
   size: t
 }) {
@@ -371,7 +371,7 @@ function q({
   prevLayout: i,
   trigger: s
 }) {
-  if (C(e, 0))
+  if (R(e, 0))
     return t;
   const l = Object.values(t), r = Object.values(i), a = [...l], [u, f] = o;
   z(u != null, "Invalid first pivot index"), z(f != null, "Invalid second pivot index");
@@ -393,7 +393,7 @@ function q({
         if (z(
           x != null,
           `Previous layout not found for panel index ${c}`
-        ), C(x, y)) {
+        ), R(x, y)) {
           const g = S - x;
           X(g, Math.abs(e)) > 0 && (e = e < 0 ? 0 - g : g);
         }
@@ -415,7 +415,7 @@ function q({
         if (z(
           x != null,
           `Previous layout not found for panel index ${c}`
-        ), C(x, S)) {
+        ), R(x, S)) {
           const g = x - y;
           X(g, Math.abs(e)) > 0 && (e = e < 0 ? 0 - g : g);
         }
@@ -431,7 +431,7 @@ function q({
         S != null,
         `Previous layout not found for panel index ${d}`
       );
-      const g = B({
+      const g = V({
         panelConstraints: n[d],
         size: 100
       }) - S;
@@ -449,11 +449,11 @@ function q({
         v != null,
         `Previous layout not found for panel index ${d}`
       );
-      const S = v - y, x = B({
+      const S = v - y, x = V({
         panelConstraints: n[d],
         size: S
       });
-      if (!C(v, x) && (p += v - x, a[d] = x, p.toFixed(3).localeCompare(Math.abs(e).toFixed(3), void 0, {
+      if (!R(v, x) && (p += v - x, a[d] = x, p.toFixed(3).localeCompare(Math.abs(e).toFixed(3), void 0, {
         numeric: !0
       }) >= 0))
         break;
@@ -468,38 +468,38 @@ function q({
       d != null,
       `Previous layout not found for panel index ${c}`
     );
-    const y = d + p, v = B({
+    const y = d + p, v = V({
       panelConstraints: n[c],
       size: y
     });
-    if (a[c] = v, !C(v, y)) {
+    if (a[c] = v, !R(v, y)) {
       let S = y - v, g = e < 0 ? f : u;
       for (; g >= 0 && g < n.length; ) {
-        const w = a[g];
+        const b = a[g];
         z(
-          w != null,
+          b != null,
           `Previous layout not found for panel index ${g}`
         );
-        const L = w + S, P = B({
+        const w = b + S, C = V({
           panelConstraints: n[g],
-          size: L
+          size: w
         });
-        if (C(w, P) || (S -= P - w, a[g] = P), C(S, 0))
+        if (R(b, C) || (S -= C - b, a[g] = C), R(S, 0))
           break;
         e > 0 ? g-- : g++;
       }
     }
   }
-  const m = Object.values(a).reduce(
+  const h = Object.values(a).reduce(
     (c, d) => d + c,
     0
   );
-  if (!C(m, 100, 0.1))
+  if (!R(h, 100, 0.1))
     return i;
-  const h = Object.keys(i);
-  return a.reduce((c, d, y) => (c[h[y]] = d, c), {});
+  const m = Object.keys(i);
+  return a.reduce((c, d, y) => (c[m[y]] = d, c), {});
 }
-function oe(e) {
+function ne(e) {
   const t = e.parentElement;
   z(t, "Parent group element not found");
   const { mountedGroups: n } = G();
@@ -508,7 +508,7 @@ function oe(e) {
       return o;
   throw Error("Could not find parent Group for separator element");
 }
-function V(e, t) {
+function U(e, t) {
   if (Object.keys(e).length !== Object.keys(t).length)
     return !1;
   for (const n in e)
@@ -516,7 +516,7 @@ function V(e, t) {
       return !1;
   return !0;
 }
-function _({
+function N({
   layout: e,
   panelConstraints: t
 }) {
@@ -528,7 +528,7 @@ function _({
     throw Error(
       `Invalid ${t.length} panel layout: ${o.map((r) => `${r}%`).join(", ")}`
     );
-  if (!C(i, 100) && o.length > 0)
+  if (!R(i, 100) && o.length > 0)
     for (let r = 0; r < t.length; r++) {
       const a = o[r];
       z(a != null, `No layout data found for index ${r}`);
@@ -539,21 +539,21 @@ function _({
   for (let r = 0; r < t.length; r++) {
     const a = o[r];
     z(a != null, `No layout data found for index ${r}`);
-    const u = B({
+    const u = V({
       panelConstraints: t[r],
       size: a
     });
     a != u && (s += a - u, o[r] = u);
   }
-  if (!C(s, 0))
+  if (!R(s, 0))
     for (let r = 0; r < t.length; r++) {
       const a = o[r];
       z(a != null, `No layout data found for index ${r}`);
-      const u = a + s, f = B({
+      const u = a + s, f = V({
         panelConstraints: t[r],
         size: u
       });
-      if (a !== f && (s -= f - a, o[r] = f, C(s, 0)))
+      if (a !== f && (s -= f - a, o[r] = f, R(s, 0)))
         break;
     }
   const l = Object.keys(e);
@@ -581,11 +581,11 @@ function Ge({
         group: s,
         layout: l,
         separatorToPanels: r
-      } = t(), a = _({
+      } = t(), a = N({
         layout: n,
         panelConstraints: i
       });
-      return o ? l : (V(l, a) || E((u) => ({
+      return o ? l : (U(l, a) || M((u) => ({
         mountedGroups: new Map(u.mountedGroups).set(s, {
           defaultLayoutDeferred: o,
           derivedPanelConstraints: i,
@@ -600,8 +600,8 @@ function De(e) {
   const { mountedGroups: t } = G(), n = t.get(e);
   return z(n, `Mounted Group ${e.id} not found`), n;
 }
-function O(e, t) {
-  const n = oe(e), o = De(n), i = n.separators.find(
+function T(e, t) {
+  const n = ne(e), o = De(n), i = n.separators.find(
     (p) => p.element === e
   );
   z(i, "Matching separator not found");
@@ -614,11 +614,11 @@ function O(e, t) {
     pivotIndices: l,
     prevLayout: a,
     trigger: "keyboard"
-  }), f = _({
+  }), f = N({
     layout: u,
     panelConstraints: o.derivedPanelConstraints
   });
-  V(a, f) || E((p) => ({
+  U(a, f) || M((p) => ({
     mountedGroups: new Map(p.mountedGroups).set(n, {
       defaultLayoutDeferred: o.defaultLayoutDeferred,
       derivedPanelConstraints: o.derivedPanelConstraints,
@@ -630,32 +630,32 @@ function O(e, t) {
 function ye(e) {
   if (e.defaultPrevented)
     return;
-  const t = e.currentTarget, n = oe(t);
+  const t = e.currentTarget, n = ne(t);
   if (!n.disabled)
     switch (e.key) {
       case "ArrowDown": {
-        e.preventDefault(), n.orientation === "vertical" && O(t, 5);
+        e.preventDefault(), n.orientation === "vertical" && T(t, 5);
         break;
       }
       case "ArrowLeft": {
-        e.preventDefault(), n.orientation === "horizontal" && O(t, -5);
+        e.preventDefault(), n.orientation === "horizontal" && T(t, -5);
         break;
       }
       case "ArrowRight": {
-        e.preventDefault(), n.orientation === "horizontal" && O(t, 5);
+        e.preventDefault(), n.orientation === "horizontal" && T(t, 5);
         break;
       }
       case "ArrowUp": {
-        e.preventDefault(), n.orientation === "vertical" && O(t, -5);
+        e.preventDefault(), n.orientation === "vertical" && T(t, -5);
         break;
       }
       case "End": {
-        e.preventDefault(), O(t, 100);
+        e.preventDefault(), T(t, 100);
         break;
       }
       case "Enter": {
         e.preventDefault();
-        const o = oe(t), { derivedPanelConstraints: i, layout: s, separatorToPanels: l } = De(o), r = o.separators.find(
+        const o = ne(t), { derivedPanelConstraints: i, layout: s, separatorToPanels: l } = De(o), r = o.separators.find(
           (p) => p.element === t
         );
         z(r, "Matching separator not found");
@@ -665,14 +665,14 @@ function ye(e) {
           (p) => p.panelId === u.id
         );
         if (z(f, "Panel metadata not found"), f.collapsible) {
-          const p = s[u.id], m = f.collapsedSize === p ? o.inMemoryLastExpandedPanelSizes[u.id] ?? f.minSize : f.collapsedSize;
-          O(t, m - p);
+          const p = s[u.id], h = f.collapsedSize === p ? o.inMemoryLastExpandedPanelSizes[u.id] ?? f.minSize : f.collapsedSize;
+          T(t, h - p);
         }
         break;
       }
       case "F6": {
         e.preventDefault();
-        const i = oe(t).separators.map(
+        const i = ne(t).separators.map(
           (a) => a.element
         ), s = Array.from(i).findIndex(
           (a) => a === e.currentTarget
@@ -683,7 +683,7 @@ function ye(e) {
         break;
       }
       case "Home": {
-        e.preventDefault(), O(t, -100);
+        e.preventDefault(), T(t, -100);
         break;
       }
     }
@@ -716,9 +716,9 @@ function ct(e, t, n) {
     hitRegion: o
   } : void 0;
 }
-let ne;
+let te;
 function ft() {
-  return ne === void 0 && (typeof matchMedia == "function" ? ne = !!matchMedia("(pointer:coarse)").matches : ne = !1), ne;
+  return te === void 0 && (typeof matchMedia == "function" ? te = !!matchMedia("(pointer:coarse)").matches : te = !1), te;
 }
 function dt(e) {
   return e !== null && typeof e == "object" && "nodeType" in e && e.nodeType === Node.DOCUMENT_FRAGMENT_NODE;
@@ -833,7 +833,7 @@ function ze(e) {
     }), a.separator && (s.add(a.separator), r || (r = !0, a.separator.element.focus()));
     const u = t.get(a.group);
     u && l.set(a.group, u.layout);
-  }), E({
+  }), M({
     interactionState: {
       hitRegions: n,
       initialLayoutMap: l,
@@ -886,8 +886,8 @@ function St({
   return o > 0 && i > 0 ? "move" : o > 0 ? "ew-resize" : "ns-resize";
 }
 const be = /* @__PURE__ */ new WeakMap();
-function ae(e) {
-  if (e.defaultView === null)
+function le(e) {
+  if (e.defaultView === null || e.defaultView === void 0)
     return;
   let { prevStyle: t, styleSheet: n } = be.get(e) ?? {};
   n === void 0 && (n = new e.defaultView.CSSStyleSheet(), e.adoptedStyleSheets = [n]);
@@ -926,9 +926,9 @@ function Fe({
   let l = 0;
   const r = new Map(i);
   n.forEach((a) => {
-    const { group: u, groupSize: f } = a, { disableCursor: p, orientation: m, panels: h } = u;
+    const { group: u, groupSize: f } = a, { disableCursor: p, orientation: h, panels: m } = u;
     let c = 0;
-    s ? m === "horizontal" ? c = (t.clientX - s.x) / f * 100 : c = (t.clientY - s.y) / f * 100 : m === "horizontal" ? c = t.clientX < 0 ? -100 : 100 : c = t.clientY < 0 ? -100 : 100;
+    s ? h === "horizontal" ? c = (t.clientX - s.x) / f * 100 : c = (t.clientY - s.y) / f * 100 : h === "horizontal" ? c = t.clientX < 0 ? -100 : 100 : c = t.clientY < 0 ? -100 : 100;
     const d = o.get(u), {
       defaultLayoutDeferred: y,
       derivedPanelConstraints: v,
@@ -940,13 +940,13 @@ function Fe({
         delta: c,
         initialLayout: d,
         panelConstraints: v,
-        pivotIndices: a.panels.map((w) => h.indexOf(w)),
+        pivotIndices: a.panels.map((b) => m.indexOf(b)),
         prevLayout: S,
         trigger: "mouse-or-touch"
       });
-      if (V(g, S)) {
+      if (U(g, S)) {
         if (c !== 0 && !p)
-          switch (m) {
+          switch (h) {
             case "horizontal": {
               l |= c < 0 ? Oe : Te;
               break;
@@ -963,14 +963,14 @@ function Fe({
           layout: g,
           separatorToPanels: x
         });
-        const w = a.group.panels.map(({ id: L }) => L).join(",");
-        a.group.inMemoryLayouts[w] = g;
+        const b = a.group.panels.map(({ id: w }) => w).join(",");
+        a.group.inMemoryLayouts[b] = g;
       }
     }
-  }), E({
+  }), M({
     cursorFlags: l,
     mountedGroups: r
-  }), ae(e);
+  }), le(e);
 }
 function we(e) {
   const { interactionState: t, mountedGroups: n } = G();
@@ -995,7 +995,7 @@ function Le(e) {
         // Skip this check for "pointerleave" events, else Firefox triggers a false positive (see #514)
         e.buttons === 0
       ) {
-        E(
+        M(
           (o) => o.interactionState.state === "inactive" ? o : {
             cursorFlags: 0,
             interactionState: {
@@ -1017,14 +1017,14 @@ function Le(e) {
     }
     default: {
       const o = $e(e, n);
-      o.length === 0 ? t.state !== "inactive" && E({
+      o.length === 0 ? t.state !== "inactive" && M({
         interactionState: { state: "inactive" }
-      }) : E({
+      }) : M({
         interactionState: {
           hitRegions: o,
           state: "hover"
         }
-      }), ae(e.currentTarget);
+      }), le(e.currentTarget);
       break;
     }
   }
@@ -1036,15 +1036,15 @@ function Pe(e) {
   const { interactionState: t } = G();
   switch (t.state) {
     case "active":
-      E({
+      M({
         cursorFlags: 0,
         interactionState: {
           state: "inactive"
         }
-      }), ae(e.currentTarget);
+      }), le(e.currentTarget);
   }
 }
-function Ce(e) {
+function Re(e) {
   let t = 0, n = 0;
   const o = {};
   for (const s of e)
@@ -1097,7 +1097,7 @@ function bt(e, t) {
       return !1;
   return !0;
 }
-const j = /* @__PURE__ */ new Map();
+const B = /* @__PURE__ */ new Map();
 function wt(e) {
   let t = !0;
   z(
@@ -1111,21 +1111,21 @@ function wt(e) {
         if (t) {
           if (W({ group: e }) === 0)
             return;
-          E((x) => {
+          M((x) => {
             const g = x.mountedGroups.get(e);
             if (g) {
-              const w = me(e), L = g.defaultLayoutDeferred ? Ce(w) : g.layout, P = _({
-                layout: L,
-                panelConstraints: w
+              const b = me(e), w = g.defaultLayoutDeferred ? Re(b) : g.layout, C = N({
+                layout: w,
+                panelConstraints: b
               });
-              return !g.defaultLayoutDeferred && V(L, P) && zt(
+              return !g.defaultLayoutDeferred && U(w, C) && zt(
                 g.derivedPanelConstraints,
-                w
+                b
               ) ? x : {
                 mountedGroups: new Map(x.mountedGroups).set(e, {
                   defaultLayoutDeferred: !1,
-                  derivedPanelConstraints: w,
-                  layout: P,
+                  derivedPanelConstraints: b,
+                  layout: C,
                   separatorToPanels: g.separatorToPanels
                 })
               };
@@ -1146,16 +1146,16 @@ function wt(e) {
   const l = W({ group: e }), r = me(e), a = e.panels.map(({ id: c }) => c).join(",");
   let u = e.defaultLayout;
   u && (bt(e.panels, u) || (u = void 0));
-  const f = e.inMemoryLayouts[a] ?? u ?? Ce(r), p = _({
+  const f = e.inMemoryLayouts[a] ?? u ?? Re(r), p = N({
     layout: f,
     panelConstraints: r
-  }), m = ke(e), h = e.element.ownerDocument;
-  return E((c) => {
+  }), h = ke(e), m = e.element.ownerDocument;
+  return M((c) => {
     const d = /* @__PURE__ */ new Map();
-    return j.set(
-      h,
-      (j.get(h) ?? 0) + 1
-    ), m.forEach((y) => {
+    return B.set(
+      m,
+      (B.get(m) ?? 0) + 1
+    ), h.forEach((y) => {
       y.separator && d.set(y.separator, y.panels);
     }), {
       mountedGroups: new Map(c.mountedGroups).set(e, {
@@ -1170,31 +1170,31 @@ function wt(e) {
       !i.has(c.id),
       `Separator ids must be unique; id "${c.id}" was used more than once`
     ), i.add(c.id), c.element.addEventListener("keydown", ye);
-  }), j.get(h) === 1 && (h.addEventListener("pointerdown", ze), h.addEventListener("pointerleave", we), h.addEventListener("pointermove", Le), h.addEventListener("pointerup", Pe)), function() {
-    t = !1, j.set(
-      h,
-      Math.max(0, (j.get(h) ?? 0) - 1)
-    ), E((d) => {
+  }), B.get(m) === 1 && (m.addEventListener("pointerdown", ze), m.addEventListener("pointerleave", we), m.addEventListener("pointermove", Le), m.addEventListener("pointerup", Pe)), function() {
+    t = !1, B.set(
+      m,
+      Math.max(0, (B.get(m) ?? 0) - 1)
+    ), M((d) => {
       const y = new Map(d.mountedGroups);
       return y.delete(e), { mountedGroups: y };
     }), e.separators.forEach((d) => {
       d.element.removeEventListener("keydown", ye);
-    }), j.get(h) || (h.removeEventListener("pointerdown", ze), h.removeEventListener("pointerleave", we), h.removeEventListener("pointermove", Le), h.removeEventListener("pointerup", Pe)), s.disconnect();
+    }), B.get(m) || (m.removeEventListener("pointerdown", ze), m.removeEventListener("pointerleave", we), m.removeEventListener("pointermove", Le), m.removeEventListener("pointerup", Pe)), s.disconnect();
   };
 }
-function le(e) {
+function ue(e) {
   const t = Ke();
   return `${e ?? t}`;
 }
-const N = typeof window < "u" ? Xe : Re;
-function ue(e) {
-  const t = D(e);
-  return N(() => {
+const A = typeof window < "u" ? Xe : Ce;
+function ce(e) {
+  const t = I(e);
+  return A(() => {
     t.current = e;
   }, [e]), qe((n) => t.current?.(n), [t]);
 }
-function ce(...e) {
-  return ue((t) => {
+function fe(...e) {
+  return ce((t) => {
     e.forEach((n) => {
       if (n)
         switch (typeof n) {
@@ -1211,24 +1211,24 @@ function ce(...e) {
   });
 }
 function Lt(e) {
-  const t = D({ ...e });
-  return N(() => {
+  const t = I({ ...e });
+  return A(() => {
     for (const n in e)
       t.current[n] = e[n];
   }, [e]), t.current;
 }
-const He = "--react-resizable-panels--panel--pointer-events";
-function je(e, t) {
+const je = "--react-resizable-panels--panel--pointer-events";
+function He(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 = Ye(null);
 function Pt(e, t) {
-  const n = D({
+  const n = I({
     getLayout: () => ({}),
     setLayout: ut
   });
-  Ee(t, () => n.current, []), N(() => {
+  Ee(t, () => n.current, []), A(() => {
     Object.assign(
       n.current,
       Ge({ groupId: e })
@@ -1249,62 +1249,63 @@ function Tt({
   style: f,
   ...p
 }) {
-  const m = D({}), h = ue((b) => {
-    V(m.current, b) || (m.current = b, a?.(b));
-  }), c = le(r), [d, y] = I(!1), [v, S] = I(null), [x, g] = I(n ?? {}), [w, L] = I([]), [P, Y] = I([]), Z = D({
+  const h = I({}), m = ce((L) => {
+    U(h.current, L) || (h.current = L, a?.(L));
+  }), c = ue(r), [d, y] = D(!1), v = I(null), [S, x] = D(n ?? {}), [g, b] = D([]), [w, C] = D([]), Y = I({
     lastExpandedPanelSizes: {},
     layouts: {}
-  }), J = ce(S, s);
+  }), oe = fe(v, s);
   Pt(c, l);
-  const Q = ie(
+  const Z = se(
     () => ({
       id: c,
       orientation: u,
-      registerPanel: (b) => (L((M) => se(u, [...M, b])), () => {
-        L((M) => M.filter(($) => $ !== b));
+      registerPanel: (L) => (b((P) => ae(u, [...P, L])), () => {
+        b((P) => P.filter((O) => O !== L));
       }),
-      registerSeparator: (b) => (Y(
-        (M) => se(u, [...M, b])
+      registerSeparator: (L) => (C(
+        (P) => ae(u, [...P, L])
       ), () => {
-        Y(
-          (M) => M.filter(($) => $ !== b)
+        C(
+          (P) => P.filter((O) => O !== L)
         );
       })
     }),
     [c, u]
-  ), A = Lt({
+  ), $ = Lt({
     defaultLayout: n,
     disableCursor: o
-  }), U = D(null);
-  N(() => {
-    if (v === null)
+  }), F = I(null);
+  A(() => {
+    const L = v.current;
+    if (L === null)
       return;
-    const b = {
-      defaultLayout: A.defaultLayout,
-      disableCursor: !!A.disableCursor,
+    const P = {
+      defaultLayout: $.defaultLayout,
+      disableCursor: !!$.disableCursor,
       disabled: !!i,
-      element: v,
+      element: L,
       id: c,
-      inMemoryLastExpandedPanelSizes: Z.current.lastExpandedPanelSizes,
-      inMemoryLayouts: Z.current.layouts,
+      inMemoryLastExpandedPanelSizes: Y.current.lastExpandedPanelSizes,
+      inMemoryLayouts: Y.current.layouts,
       orientation: u,
-      panels: w,
-      separators: P
+      panels: g,
+      separators: w
     };
-    U.current = b;
-    const M = wt(b), pe = G().mountedGroups.get(b);
+    F.current = P;
+    const O = wt(P), pe = G().mountedGroups.get(P);
     if (pe) {
-      const { defaultLayoutDeferred: F, derivedPanelConstraints: H, layout: ee } = pe;
-      !F && H.length > 0 && (g(ee), h?.(ee));
+      const { defaultLayoutDeferred: j, derivedPanelConstraints: H, layout: Q } = pe;
+      !j && H.length > 0 && (x(Q), m?.(Q));
     }
-    const We = T.addListener(
+    const Ve = _.addListener(
       "interactionStateChange",
-      (F) => {
-        switch (F.state) {
+      (j) => {
+        switch (j.state) {
           case "active": {
             y(
-              F.hitRegions.some(
-                (H) => H.group === b
+              j.hitRegions.some(
+                (H) => H.group === P
               )
             );
             break;
@@ -1315,42 +1316,41 @@ function Tt({
           }
         }
       }
-    ), Ve = T.addListener(
+    ), We = _.addListener(
       "mountedGroupsChange",
-      (F) => {
-        const H = F.get(b);
+      (j) => {
+        const H = j.get(P);
         if (H) {
-          const { defaultLayoutDeferred: ee, derivedPanelConstraints: Ue, layout: he } = H;
-          if (ee || Ue.length === 0)
+          const { defaultLayoutDeferred: Q, derivedPanelConstraints: Ue, layout: he } = H;
+          if (Q || Ue.length === 0)
             return;
-          g(he), h?.(he);
+          x(he), m?.(he);
         }
       }
     );
     return () => {
-      U.current = null, M(), We(), Ve();
+      F.current = null, O(), Ve(), We();
     };
   }, [
     i,
-    v,
     c,
-    h,
+    m,
     u,
+    g,
     w,
-    P,
-    A
-  ]), Re(() => {
-    const b = U.current;
-    b && (b.defaultLayout = n, b.disableCursor = !!o);
+    $
+  ]), Ce(() => {
+    const L = F.current;
+    L && (L.defaultLayout = n, L.disableCursor = !!o);
   });
-  const de = {
-    [He]: d ? "none" : void 0
+  const J = {
+    [je]: d ? "none" : void 0
   };
-  for (const b in x) {
-    const M = je(c, b), $ = x[b];
-    de[M] = $;
+  for (const L in S) {
+    const P = He(c, L), O = S[L];
+    J[P] = O;
   }
-  return /* @__PURE__ */ K(Be.Provider, { value: Q, children: /* @__PURE__ */ K(
+  return /* @__PURE__ */ K(Be.Provider, { value: Z, children: /* @__PURE__ */ K(
     "div",
     {
       ...p,
@@ -1359,10 +1359,10 @@ function Tt({
       "data-group": !0,
       "data-testid": c,
       id: c,
-      ref: J,
+      ref: oe,
       style: {
         ...f,
-        ...de,
+        ...J,
         display: "flex",
         flexDirection: u === "horizontal" ? "row" : "column",
         flexWrap: "nowrap"
@@ -1371,7 +1371,7 @@ function Tt({
     }
   ) });
 }
-function Ct(e, t = 10) {
+function Rt(e, t = 10) {
   let n = null;
   return (o) => {
     n !== null && clearTimeout(n), n = setTimeout(() => {
@@ -1379,54 +1379,57 @@ function Ct(e, t = 10) {
     }, t);
   };
 }
-function Rt(e) {
-  return `react-resizable-panels:${e}`;
+function ie(e, t) {
+  return `react-resizable-panels:${[e, ...t].join(":")}`;
 }
 function _t({
   debounceSaveMs: e = 100,
-  storage: t,
-  ...n
+  panelIds: t,
+  storage: n,
+  ...o
 }) {
-  const o = "id" in n ? n.id : n.groupId, i = Rt(o), s = Ze(
-    Et,
-    () => t.getItem(i),
-    () => t.getItem(i)
-  ), l = ie(
-    () => s ? JSON.parse(s) : void 0,
-    [s]
-  ), r = ie(() => {
-    const a = (u) => {
+  const i = t !== void 0, s = "id" in o ? o.id : o.groupId, l = ie(s, t ?? []), r = Ze(
+    Ct,
+    () => n.getItem(l),
+    () => n.getItem(l)
+  ), a = se(
+    () => r ? JSON.parse(r) : void 0,
+    [r]
+  ), u = se(() => {
+    const f = (p) => {
+      let h;
+      i ? h = ie(s, Object.keys(p)) : h = ie(s, []);
       try {
-        t.setItem(i, JSON.stringify(u));
-      } catch (f) {
-        console.error(f);
+        n.setItem(h, JSON.stringify(p));
+      } catch (m) {
+        console.error(m);
       }
     };
-    return e > 0 ? Ct(a, e) : a;
-  }, [e, t, i]);
+    return e > 0 ? Rt(f, e) : f;
+  }, [e, i, s, n]);
   return {
-    defaultLayout: l,
-    onLayoutChange: r
+    defaultLayout: a,
+    onLayoutChange: u
   };
 }
-function Et() {
+function Ct() {
   return function() {
   };
 }
 function Nt() {
-  return I(null);
+  return D(null);
 }
 function At() {
-  return D(null);
+  return I(null);
 }
-function fe() {
+function de() {
   const e = Je(Be);
   return z(
     e,
     "Group Context not found; did you render a Panel or Separator outside of a Group?"
   ), e;
 }
-function Mt({
+function Et({
   groupId: e,
   panelId: t
 }) {
@@ -1438,7 +1441,7 @@ function Mt({
         defaultLayoutDeferred: u,
         derivedPanelConstraints: f,
         layout: p,
-        separatorToPanels: m
+        separatorToPanels: h
       }
     ] of r)
       if (a.id === e)
@@ -1447,7 +1450,7 @@ function Mt({
           derivedPanelConstraints: f,
           group: a,
           layout: p,
-          separatorToPanels: m
+          separatorToPanels: h
         };
     throw Error(`Group ${e} not found`);
   }, o = () => {
@@ -1475,36 +1478,39 @@ function Mt({
       defaultLayoutDeferred: u,
       derivedPanelConstraints: f,
       group: p,
-      layout: m,
-      separatorToPanels: h
+      layout: h,
+      separatorToPanels: m
     } = n(), c = p.panels.findIndex((S) => S.id === t), d = c === p.panels.length - 1, y = q({
       delta: d ? a - r : r - a,
-      initialLayout: m,
+      initialLayout: h,
       panelConstraints: f,
       pivotIndices: d ? [c - 1, c] : [c, c + 1],
-      prevLayout: m,
+      prevLayout: h,
       trigger: "imperative-api"
-    }), v = _({
+    }), v = N({
       layout: y,
       panelConstraints: f
     });
-    V(m, v) || E((S) => ({
+    U(h, v) || M((S) => ({
       mountedGroups: new Map(S.mountedGroups).set(p, {
         defaultLayoutDeferred: u,
         derivedPanelConstraints: f,
         layout: v,
-        separatorToPanels: h
+        separatorToPanels: m
       })
     }));
   };
   return {
     collapse: () => {
-      const { collapsible: r, collapsedSize: a } = o(), u = s();
-      r && u !== a && l(a);
+      const { collapsible: r, collapsedSize: a } = o(), { expandToSizeRef: u } = i(), f = s();
+      r && f !== a && (u.current = f, l(a));
     },
     expand: () => {
-      const { collapsible: r, collapsedSize: a, minSize: u } = o(), f = s();
-      r && f === a && l(u);
+      const { collapsible: r, collapsedSize: a, minSize: u } = o(), { expandToSizeRef: f } = i(), p = s();
+      if (r && p === a) {
+        let h = f.current ?? u;
+        h === 0 && (h = 1), l(h);
+      }
     },
     getSize: () => {
       const { group: r } = n(), a = s(), { element: u } = i(), f = r.orientation === "horizontal" ? u.offsetWidth : u.offsetHeight;
@@ -1515,7 +1521,7 @@ function Mt({
     },
     isCollapsed: () => {
       const { collapsible: r, collapsedSize: a } = o(), u = s();
-      return r && C(a, u);
+      return r && R(a, u);
     },
     resize: (r) => {
       if (s() !== r) {
@@ -1536,8 +1542,8 @@ function Mt({
     }
   };
 }
-function It(e, t) {
-  const { id: n } = fe(), o = D({
+function Mt(e, t) {
+  const { id: n } = de(), o = I({
     collapse: re,
     expand: re,
     getSize: () => ({
@@ -1547,10 +1553,10 @@ function It(e, t) {
     isCollapsed: () => !1,
     resize: re
   });
-  Ee(t, () => o.current, []), N(() => {
+  Ee(t, () => o.current, []), A(() => {
     Object.assign(
       o.current,
-      Mt({ groupId: n, panelId: e })
+      Et({ groupId: n, panelId: e })
     );
   });
 }
@@ -1567,18 +1573,20 @@ function $t({
   onResize: u,
   panelRef: f,
   style: p,
-  ...m
+  ...h
 }) {
-  const h = !!l, c = le(l), [d, y] = I(null), v = ce(y, s), { id: S, registerPanel: x } = fe(), g = u !== null, w = ue((P) => {
-    u?.(P, l);
+  const m = !!l, c = ue(l), d = I(null), y = fe(d, s), { id: v, registerPanel: S } = de(), x = u !== null, g = ce((w) => {
+    u?.(w, l);
   });
-  N(() => {
-    if (d !== null)
-      return x({
-        element: d,
+  A(() => {
+    const w = d.current;
+    if (w !== null)
+      return S({
+        element: w,
+        expandToSizeRef: { current: void 0 },
         id: c,
-        idIsStable: h,
-        onResize: g ? w : void 0,
+        idIsStable: m,
+        onResize: x ? g : void 0,
         panelConstraints: {
           collapsedSize: n,
           collapsible: o,
@@ -1591,34 +1599,33 @@ function $t({
     n,
     o,
     i,
-    d,
-    g,
+    x,
     c,
-    h,
+    m,
     r,
     a,
-    w,
-    x
-  ]), It(c, f);
-  const L = je(S, c);
+    g,
+    S
+  ]), Mt(c, f);
+  const b = He(v, c);
   return /* @__PURE__ */ K(
     "div",
     {
-      ...m,
+      ...h,
       "data-panel": !0,
       "data-testid": c,
       id: c,
-      ref: v,
+      ref: y,
       style: {
-        ...kt,
+        ...It,
         flexBasis: 0,
-        flexGrow: `var(${L}, 1)`,
+        flexGrow: `var(${b}, 1)`,
         flexShrink: 1,
         // Prevent Panel content from interfering with panel size
         overflow: "hidden",
         // Disable pointer events inside of a panel during resize
         // This avoid edge cases like nested iframes
-        pointerEvents: `var(${He})`
+        pointerEvents: `var(${je})`
       },
       children: /* @__PURE__ */ K(
         "div",
@@ -1635,7 +1642,7 @@ function $t({
     }
   );
 }
-const kt = {
+const It = {
   minHeight: "unset",
   maxHeight: "unset",
   height: "unset",
@@ -1652,12 +1659,12 @@ const kt = {
   margin: "unset"
 };
 function Ft() {
-  return I(null);
-}
-function Ht() {
   return D(null);
 }
-function Gt({
+function jt() {
+  return I(null);
+}
+function kt({
   layout: e,
   panelConstraints: t,
   panelId: n,
@@ -1669,7 +1676,7 @@ function Gt({
   );
   if (r) {
     const a = r.maxSize, u = s = r.collapsible ? r.collapsedSize : r.minSize, f = [o, o + 1];
-    s = _({
+    s = N({
       layout: q({
         delta: u - l,
         initialLayout: e,
@@ -1679,7 +1686,7 @@ function Gt({
         trigger: "keyboard"
       }),
       panelConstraints: t
-    })[n], i = _({
+    })[n], i = N({
       layout: q({
         delta: a - l,
         initialLayout: e,
@@ -1698,7 +1705,7 @@ function Gt({
     valueNow: l
   };
 }
-function jt({
+function Ht({
   children: e,
   className: t,
   elementRef: n,
@@ -1706,40 +1713,40 @@ function jt({
   style: i,
   ...s
 }) {
-  const l = le(o), [r, a] = I({}), [u, f] = I("inactive"), [p, m] = I(null), h = ce(m, n), {
+  const l = ue(o), [r, a] = D({}), [u, f] = D("inactive"), [p, h] = D(null), m = fe(h, n), {
     id: c,
     orientation: d,
     registerSeparator: y
-  } = fe(), v = d === "horizontal" ? "vertical" : "horizontal";
-  return N(() => {
+  } = de(), v = d === "horizontal" ? "vertical" : "horizontal";
+  return A(() => {
     if (p !== null) {
       const S = {
         element: p,
         id: l
-      }, x = y(S), g = T.addListener(
+      }, x = y(S), g = _.addListener(
         "interactionStateChange",
-        (L) => {
+        (w) => {
           f(
-            L.state !== "inactive" && L.hitRegions.some(
-              (P) => P.separator === S
-            ) ? L.state : "inactive"
+            w.state !== "inactive" && w.hitRegions.some(
+              (C) => C.separator === S
+            ) ? w.state : "inactive"
           );
         }
-      ), w = T.addListener(
+      ), b = _.addListener(
         "mountedGroupsChange",
-        (L) => {
-          L.forEach(
-            ({ derivedPanelConstraints: P, layout: Y, separatorToPanels: Z }, J) => {
-              if (J.id === c) {
-                const Q = Z.get(S);
-                if (Q) {
-                  const A = Q[0], U = J.panels.indexOf(A);
+        (w) => {
+          w.forEach(
+            ({ derivedPanelConstraints: C, layout: Y, separatorToPanels: oe }, Z) => {
+              if (Z.id === c) {
+                const $ = oe.get(S);
+                if ($) {
+                  const F = $[0], J = Z.panels.indexOf(F);
                   a(
-                    Gt({
+                    kt({
                       layout: Y,
-                      panelConstraints: P,
-                      panelId: A.id,
-                      panelIndex: U
+                      panelConstraints: C,
+                      panelId: F.id,
+                      panelIndex: J
                     })
                   );
                 }
@@ -1749,7 +1756,7 @@ function jt({
         }
       );
       return () => {
-        g(), w(), x();
+        g(), b(), x();
       };
     }
   }, [p, c, l, y]), /* @__PURE__ */ K(
@@ -1766,7 +1773,7 @@ function jt({
       "data-separator": u,
       "data-testid": l,
       id: l,
-      ref: h,
+      ref: m,
       role: "separator",
       style: {
         flexBasis: "auto",
@@ -1781,11 +1788,11 @@ function jt({
 export {
   Tt as Group,
   $t as Panel,
-  jt as Separator,
+  Ht as Separator,
   _t as useDefaultLayout,
   Nt as useGroupCallbackRef,
   At as useGroupRef,
   Ft as usePanelCallbackRef,
-  Ht as usePanelRef
+  jt as usePanelRef
 };
 //# sourceMappingURL=react-resizable-panels.js.map