react-resizable-panels 4.0.9 → 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 Ke, useLayoutEffect as Xe, useEffect as Re, useRef as O, useCallback as Ee, createContext as Ye, useImperativeHandle as Me, useState as G, useMemo as Ge, useSyncExternalStore as qe, useContext as Ze } 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);
@@ -9,77 +9,145 @@ function B({
   group: e
 }) {
   const { orientation: t, panels: n } = e;
-  return n.reduce((o, s) => (o += t === "horizontal" ? s.element.offsetWidth : s.element.offsetHeight, o), 0);
+  return n.reduce((o, r) => (o += t === "horizontal" ? r.element.offsetWidth : r.element.offsetHeight, o), 0);
 }
 function se(e, t) {
   return t.sort(
-    e === "horizontal" ? Je : Qe
+    e === "horizontal" ? Qe : et
   );
 }
-function Je(e, t) {
+function Qe(e, t) {
   const n = e.element.offsetLeft - t.element.offsetLeft;
   return n !== 0 ? n : e.element.offsetWidth - t.element.offsetWidth;
 }
-function Qe(e, t) {
+function et(e, t) {
   const n = e.element.offsetTop - t.element.offsetTop;
   return n !== 0 ? n : e.element.offsetHeight - t.element.offsetHeight;
 }
-function Ie(e) {
-  const { element: t, orientation: n, panels: o, separators: s } = e, a = se(
+function Ie(e, t) {
+  return {
+    x: e.x >= t.left && e.x <= t.right ? 0 : Math.min(
+      Math.abs(e.x - t.left),
+      Math.abs(e.x - t.right)
+    ),
+    y: e.y >= t.top && e.y <= t.bottom ? 0 : Math.min(
+      Math.abs(e.y - t.top),
+      Math.abs(e.y - t.bottom)
+    )
+  };
+}
+function tt({
+  orientation: e,
+  rects: t,
+  targetRect: n
+}) {
+  const o = {
+    x: n.x + n.width / 2,
+    y: n.y + n.height / 2
+  };
+  let r, a = Number.MAX_VALUE;
+  for (const l of t) {
+    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 Ge(e) {
+  const { element: t, orientation: n, panels: o, separators: r } = e, a = se(
     n,
-    Array.from(t.children).filter((u) => u instanceof HTMLElement).map((u) => ({ element: u }))
-  ).map(({ element: u }) => u), l = [];
-  let i, r;
-  for (const u of a) {
-    const c = o.find(
-      (d) => d.element === u
-    );
-    if (c) {
-      if (i) {
-        const d = i.element.getBoundingClientRect(), x = u.getBoundingClientRect();
-        l.push({
-          group: e,
-          groupSize: B({ group: e }),
-          panels: [i, c],
-          separator: r,
-          rect: n === "horizontal" ? new DOMRect(
-            d.right,
-            x.top,
-            x.left - d.right,
-            x.height
-          ) : new DOMRect(
-            x.left,
-            d.bottom,
-            x.width,
-            x.top - d.bottom
-          )
-        });
+    Array.from(t.children).filter((c) => c instanceof HTMLElement).map((c) => ({ element: c }))
+  ).map(({ element: c }) => c), l = [];
+  let i = !1, s, u = [];
+  for (const c of a)
+    if (c.hasAttribute("data-panel")) {
+      const h = o.find(
+        (m) => m.element === c
+      );
+      if (h) {
+        if (s) {
+          const m = s.element.getBoundingClientRect(), p = c.getBoundingClientRect();
+          let f;
+          if (i) {
+            const d = n === "horizontal" ? new DOMRect(m.right, m.top, 0, m.height) : new DOMRect(
+              m.left,
+              m.bottom,
+              m.width,
+              0
+            ), y = n === "horizontal" ? new DOMRect(p.left, p.top, 0, p.height) : new DOMRect(p.left, p.top, p.width, 0);
+            switch (u.length) {
+              case 0: {
+                f = [
+                  d,
+                  y
+                ];
+                break;
+              }
+              case 1: {
+                const v = u[0], S = tt({
+                  orientation: n,
+                  rects: [m, p],
+                  targetRect: v.element.getBoundingClientRect()
+                });
+                f = [
+                  v,
+                  S === m ? y : d
+                ];
+                break;
+              }
+              default: {
+                f = u;
+                break;
+              }
+            }
+          } else
+            u.length ? f = u : f = [
+              n === "horizontal" ? new DOMRect(
+                m.right,
+                p.top,
+                p.left - m.right,
+                p.height
+              ) : new DOMRect(
+                p.left,
+                m.bottom,
+                p.width,
+                p.top - m.bottom
+              )
+            ];
+          for (const d of f)
+            l.push({
+              group: e,
+              groupSize: B({ group: e }),
+              panels: [s, h],
+              separator: "width" in d ? void 0 : d,
+              rect: "width" in d ? d : d.element.getBoundingClientRect()
+            });
+        }
+        i = !1, s = h, u = [];
       }
-      i = c, r = void 0;
-    } else {
-      const d = s.find(
-        (x) => x.element === u
+    } else if (c.hasAttribute("data-separator")) {
+      const h = r.find(
+        (m) => m.element === c
       );
-      d ? r = d : (i = void 0, r = void 0);
-    }
-  }
+      h ? u.push(h) : (s = void 0, u = []);
+    } else
+      i = !0;
   return l;
 }
-function et(e, t) {
+function nt(e, t) {
   const n = getComputedStyle(e), o = parseFloat(n.fontSize);
   return t * o;
 }
-function tt(e, t) {
+function ot(e, t) {
   const n = getComputedStyle(e.ownerDocument.body), o = parseFloat(n.fontSize);
   return t * o;
 }
-function nt(e) {
+function it(e) {
   return e / 100 * window.innerHeight;
 }
-function ot(e) {
+function rt(e) {
   return e / 100 * window.innerWidth;
 }
-function it(e) {
+function st(e) {
   switch (typeof e) {
     case "number":
       return [e, "px"];
@@ -95,30 +163,30 @@ function te({
   styleProp: n
 }) {
   let o;
-  const [s, a] = it(n);
+  const [r, a] = st(n);
   switch (a) {
     case "%": {
-      o = s / 100 * e;
+      o = r / 100 * e;
       break;
     }
     case "px": {
-      o = s;
+      o = r;
       break;
     }
     case "rem": {
-      o = tt(t, s);
+      o = ot(t, r);
       break;
     }
     case "em": {
-      o = et(t, s);
+      o = nt(t, r);
       break;
     }
     case "vh": {
-      o = nt(s);
+      o = it(r);
       break;
     }
     case "vw": {
-      o = ot(s);
+      o = rt(r);
       break;
     }
   }
@@ -137,12 +205,12 @@ function ye(e) {
     maxSize: 100,
     panelId: o.id
   })) : t.map((o) => {
-    const { element: s, panelConstraints: a } = o;
+    const { element: r, panelConstraints: a } = o;
     let l = 0;
     if (a.collapsedSize) {
       const c = te({
         groupSize: n,
-        panelElement: s,
+        panelElement: r,
         styleProp: a.collapsedSize
       });
       l = I(c / n * 100);
@@ -151,25 +219,25 @@ function ye(e) {
     if (a.defaultSize) {
       const c = te({
         groupSize: n,
-        panelElement: s,
+        panelElement: r,
         styleProp: a.defaultSize
       });
       i = I(c / n * 100);
     }
-    let r = 0;
+    let s = 0;
     if (a.minSize) {
       const c = te({
         groupSize: n,
-        panelElement: s,
+        panelElement: r,
         styleProp: a.minSize
       });
-      r = I(c / n * 100);
+      s = I(c / n * 100);
     }
     let u = 100;
     if (a.maxSize) {
       const c = te({
         groupSize: n,
-        panelElement: s,
+        panelElement: r,
         styleProp: a.maxSize
       });
       u = I(c / n * 100);
@@ -178,13 +246,13 @@ function ye(e) {
       collapsedSize: l,
       collapsible: a.collapsible === !0,
       defaultSize: i,
-      minSize: r,
+      minSize: s,
       maxSize: u,
       panelId: o.id
     };
   });
 }
-class rt {
+class at {
   #e = {};
   addListener(t, n) {
     const o = this.#e[t];
@@ -198,17 +266,17 @@ class rt {
       if (o.length === 1)
         o[0].call(null, n);
       else {
-        let s = !1, a = null;
+        let r = !1, a = null;
         const l = Array.from(o);
         for (let i = 0; i < l.length; i++) {
-          const r = l[i];
+          const s = l[i];
           try {
-            r.call(null, n);
+            s.call(null, n);
           } catch (u) {
-            a === null && (s = !0, a = u);
+            a === null && (r = !0, a = u);
           }
         }
-        if (s)
+        if (r)
           throw a;
       }
   }
@@ -218,8 +286,8 @@ class rt {
   removeListener(t, n) {
     const o = this.#e[t];
     if (o !== void 0) {
-      const s = o.indexOf(n);
-      s >= 0 && o.splice(s, 1);
+      const r = o.indexOf(n);
+      r >= 0 && o.splice(r, 1);
     }
   }
 }
@@ -233,7 +301,7 @@ let R = {
   },
   mountedGroups: /* @__PURE__ */ new Map()
 };
-const _ = new rt();
+const _ = new at();
 function D() {
   return R;
 }
@@ -245,35 +313,35 @@ function E(e) {
   return R = {
     ...R,
     ...t
-  }, t.cursorFlags !== void 0 && _.emit("cursorFlagsChange", R.cursorFlags), t.interactionState !== void 0 && _.emit("interactionStateChange", R.interactionState), t.mountedGroups !== void 0 && (R.mountedGroups.forEach((o, s) => {
+  }, 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(s) ?? {};
+        const { layout: l } = n.mountedGroups.get(r) ?? {};
         if (l) {
           const i = P(
             a.collapsedSize,
             o.layout[a.panelId]
-          ), r = P(
+          ), s = P(
             a.collapsedSize,
             l[a.panelId]
           );
-          i && !r && (s.inMemoryLastExpandedPanelSizes[a.panelId] = l[a.panelId]);
+          i && !s && (r.inMemoryLastExpandedPanelSizes[a.panelId] = l[a.panelId]);
         }
       }
     });
   }), _.emit("mountedGroupsChange", R.mountedGroups)), R;
 }
-const st = (e) => e, ie = () => {
-}, ke = 1, De = 2, Oe = 4, Te = 8, ge = {
+const lt = (e) => e, ie = () => {
+}, De = 1, Oe = 2, Te = 4, _e = 8, ge = {
   coarse: 10,
   precise: 5
 };
-function at({
+function ut({
   cursorFlags: e,
   groups: t,
   state: n
 }) {
-  let o = 0, s = 0;
+  let o = 0, r = 0;
   switch (n) {
     case "active":
     case "hover":
@@ -285,56 +353,56 @@ function at({
               break;
             }
             case "vertical": {
-              s++;
+              r++;
               break;
             }
           }
       });
   }
-  if (o === 0 && s === 0)
+  if (o === 0 && r === 0)
     return null;
   switch (n) {
     case "active": {
-      const a = (e & ke) !== 0, l = (e & De) !== 0, i = (e & Oe) !== 0, r = (e & Te) !== 0;
+      const a = (e & De) !== 0, l = (e & Oe) !== 0, i = (e & Te) !== 0, s = (e & _e) !== 0;
       if (e) {
         if (a)
-          return i ? "se-resize" : r ? "ne-resize" : "e-resize";
+          return i ? "se-resize" : s ? "ne-resize" : "e-resize";
         if (l)
-          return i ? "sw-resize" : r ? "nw-resize" : "w-resize";
+          return i ? "sw-resize" : s ? "nw-resize" : "w-resize";
         if (i)
           return "s-resize";
-        if (r)
+        if (s)
           return "n-resize";
       }
       break;
     }
   }
-  return o > 0 && s > 0 ? "move" : o > 0 ? "ew-resize" : "ns-resize";
+  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":
     case "hover": {
-      const n = at({
+      const n = ut({
         cursorFlags: e,
-        groups: t.hitRegions.map((s) => s.group),
+        groups: t.hitRegions.map((r) => r.group),
         state: t.state
       }), 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;
     }
   }
 }
-function lt(e, t) {
+function ct(e, t) {
   if (e.length !== t.length)
     return !1;
   for (let n = 0; n < e.length; n++)
@@ -345,14 +413,14 @@ function lt(e, t) {
 function X(e, t) {
   return P(e, t) ? 0 : e > t ? 1 : -1;
 }
-function j({
+function W({
   panelConstraints: e,
   size: t
 }) {
   const {
     collapsedSize: n = 0,
     collapsible: o,
-    maxSize: s = 100,
+    maxSize: r = 100,
     minSize: a = 0
   } = e;
   if (X(t, a) < 0)
@@ -361,143 +429,143 @@ function j({
       X(t, l) < 0 ? t = n : t = a;
     } else
       t = a;
-  return t = Math.min(s, t), t = I(t), t;
+  return t = Math.min(r, t), t = I(t), t;
 }
 function Y({
   delta: e,
   initialLayout: t,
   panelConstraints: n,
   pivotIndices: o,
-  prevLayout: s,
+  prevLayout: r,
   trigger: a
 }) {
   if (P(e, 0))
     return t;
-  const l = Object.values(t), i = Object.values(s), r = [...l], [u, c] = o;
+  const l = Object.values(t), i = Object.values(r), s = [...l], [u, c] = o;
   z(u != null, "Invalid first pivot index"), z(c != null, "Invalid second pivot index");
-  let d = 0;
+  let h = 0;
   if (a === "keyboard") {
     {
-      const f = e < 0 ? c : u, p = n[f];
+      const f = e < 0 ? c : u, d = n[f];
       z(
-        p,
+        d,
         `Panel constraints not found for index ${f}`
       );
       const {
-        collapsedSize: h = 0,
+        collapsedSize: y = 0,
         collapsible: v,
-        minSize: g = 0
-      } = p;
+        minSize: S = 0
+      } = d;
       if (v) {
-        const S = l[f];
+        const x = l[f];
         if (z(
-          S != null,
+          x != null,
           `Previous layout not found for panel index ${f}`
-        ), P(S, h)) {
-          const y = g - S;
-          X(y, Math.abs(e)) > 0 && (e = e < 0 ? 0 - y : y);
+        ), P(x, y)) {
+          const g = S - x;
+          X(g, Math.abs(e)) > 0 && (e = e < 0 ? 0 - g : g);
         }
       }
     }
     {
-      const f = e < 0 ? u : c, p = n[f];
+      const f = e < 0 ? u : c, d = n[f];
       z(
-        p,
+        d,
         `No panel constraints found for index ${f}`
       );
       const {
-        collapsedSize: h = 0,
+        collapsedSize: y = 0,
         collapsible: v,
-        minSize: g = 0
-      } = p;
+        minSize: S = 0
+      } = d;
       if (v) {
-        const S = l[f];
+        const x = l[f];
         if (z(
-          S != null,
+          x != null,
           `Previous layout not found for panel index ${f}`
-        ), P(S, g)) {
-          const y = S - h;
-          X(y, Math.abs(e)) > 0 && (e = e < 0 ? 0 - y : y);
+        ), P(x, S)) {
+          const g = x - y;
+          X(g, Math.abs(e)) > 0 && (e = e < 0 ? 0 - g : g);
         }
       }
     }
   }
   {
     const f = e < 0 ? 1 : -1;
-    let p = e < 0 ? c : u, h = 0;
+    let d = e < 0 ? c : u, y = 0;
     for (; ; ) {
-      const g = l[p];
+      const S = l[d];
       z(
-        g != null,
-        `Previous layout not found for panel index ${p}`
+        S != null,
+        `Previous layout not found for panel index ${d}`
       );
-      const y = j({
-        panelConstraints: n[p],
+      const g = W({
+        panelConstraints: n[d],
         size: 100
-      }) - g;
-      if (h += y, p += f, p < 0 || p >= n.length)
+      }) - S;
+      if (y += g, d += f, d < 0 || d >= n.length)
         break;
     }
-    const v = Math.min(Math.abs(e), Math.abs(h));
+    const v = Math.min(Math.abs(e), Math.abs(y));
     e = e < 0 ? 0 - v : v;
   }
   {
-    let p = e < 0 ? u : c;
-    for (; p >= 0 && p < n.length; ) {
-      const h = Math.abs(e) - Math.abs(d), v = l[p];
+    let d = e < 0 ? u : c;
+    for (; d >= 0 && d < n.length; ) {
+      const y = Math.abs(e) - Math.abs(h), v = l[d];
       z(
         v != null,
-        `Previous layout not found for panel index ${p}`
+        `Previous layout not found for panel index ${d}`
       );
-      const g = v - h, S = j({
-        panelConstraints: n[p],
-        size: g
+      const S = v - y, x = W({
+        panelConstraints: n[d],
+        size: S
       });
-      if (!P(v, S) && (d += v - S, r[p] = S, d.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;
-      e < 0 ? p-- : p++;
+      e < 0 ? d-- : d++;
     }
   }
-  if (lt(i, r))
-    return s;
+  if (ct(i, s))
+    return r;
   {
-    const f = e < 0 ? c : u, p = l[f];
+    const f = e < 0 ? c : u, d = l[f];
     z(
-      p != null,
+      d != null,
       `Previous layout not found for panel index ${f}`
     );
-    const h = p + d, v = j({
+    const y = d + h, v = W({
       panelConstraints: n[f],
-      size: h
+      size: y
     });
-    if (r[f] = v, !P(v, h)) {
-      let g = h - v, y = e < 0 ? c : u;
-      for (; y >= 0 && y < n.length; ) {
-        const b = r[y];
+    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 ${y}`
+          `Previous layout not found for panel index ${g}`
         );
-        const L = b + g, C = j({
-          panelConstraints: n[y],
+        const L = b + S, C = W({
+          panelConstraints: n[g],
           size: L
         });
-        if (P(b, C) || (g -= C - b, r[y] = C), P(g, 0))
+        if (P(b, C) || (S -= C - b, s[g] = C), P(S, 0))
           break;
-        e > 0 ? y-- : y++;
+        e > 0 ? g-- : g++;
       }
     }
   }
-  const x = Object.values(r).reduce(
-    (f, p) => p + f,
+  const m = Object.values(s).reduce(
+    (f, d) => d + f,
     0
   );
-  if (!P(x, 100, 0.1))
-    return s;
-  const m = Object.keys(s);
-  return r.reduce((f, p, h) => (f[m[h]] = p, f), {});
+  if (!P(m, 100, 0.1))
+    return r;
+  const p = Object.keys(r);
+  return s.reduce((f, d, y) => (f[p[y]] = d, f), {});
 }
 function U(e, t) {
   if (Object.keys(e).length !== Object.keys(t).length)
@@ -507,55 +575,55 @@ function U(e, t) {
       return !1;
   return !0;
 }
-function _e({
+function Ae({
   event: e,
   hitRegions: t,
   initialLayoutMap: n,
   mountedGroups: o,
-  pointerDownAtPoint: s
+  pointerDownAtPoint: r
 }) {
   let a = 0;
   const l = new Map(o);
   t.forEach((i) => {
-    const { group: r, groupSize: u } = i, { disableCursor: c, orientation: d, panels: x } = r;
-    let m = 0;
-    s ? d === "horizontal" ? m = (e.clientX - s.x) / u * 100 : m = (e.clientY - s.y) / u * 100 : d === "horizontal" ? m = e.clientX < 0 ? -100 : 100 : m = e.clientY < 0 ? -100 : 100;
-    const f = n.get(r), {
-      defaultLayoutDeferred: p,
-      derivedPanelConstraints: h,
+    const { group: s, groupSize: u } = i, { disableCursor: c, orientation: h, panels: m } = s;
+    let p = 0;
+    r ? h === "horizontal" ? p = (e.clientX - r.x) / u * 100 : p = (e.clientY - r.y) / u * 100 : h === "horizontal" ? p = e.clientX < 0 ? -100 : 100 : p = e.clientY < 0 ? -100 : 100;
+    const f = n.get(s), {
+      defaultLayoutDeferred: d,
+      derivedPanelConstraints: y,
       layout: v,
-      separatorToPanels: g
-    } = o.get(r) ?? { defaultLayoutDeferred: !1 };
-    if (h && f && v && g) {
-      const S = Y({
-        delta: m,
+      separatorToPanels: S
+    } = o.get(s) ?? { defaultLayoutDeferred: !1 };
+    if (y && f && v && S) {
+      const x = Y({
+        delta: p,
         initialLayout: f,
-        panelConstraints: h,
-        pivotIndices: i.panels.map((y) => x.indexOf(y)),
+        panelConstraints: y,
+        pivotIndices: i.panels.map((g) => m.indexOf(g)),
         prevLayout: v,
         trigger: "mouse-or-touch"
       });
-      if (U(S, v)) {
-        if (m !== 0 && !c)
-          switch (d) {
+      if (U(x, v)) {
+        if (p !== 0 && !c)
+          switch (h) {
             case "horizontal": {
-              a |= m < 0 ? ke : De;
+              a |= p < 0 ? De : Oe;
               break;
             }
             case "vertical": {
-              a |= m < 0 ? Oe : Te;
+              a |= p < 0 ? Te : _e;
               break;
             }
           }
       } else {
         l.set(i.group, {
-          defaultLayoutDeferred: p,
-          derivedPanelConstraints: h,
-          layout: S,
-          separatorToPanels: g
+          defaultLayoutDeferred: d,
+          derivedPanelConstraints: y,
+          layout: x,
+          separatorToPanels: S
         });
-        const y = i.group.panels.map(({ id: b }) => b).join(",");
-        i.group.inMemoryLayouts[y] = S;
+        const g = i.group.panels.map(({ id: b }) => b).join(",");
+        i.group.inMemoryLayouts[g] = x;
       }
     }
   }), E({
@@ -574,7 +642,7 @@ function ve(e) {
   switch (t.state) {
     case "active":
       t.hitRegions.forEach((o) => {
-        e.currentTarget === o.group.element && _e({
+        e.currentTarget === o.group.element && Ae({
           event: e,
           hitRegions: t.hitRegions,
           initialLayoutMap: t.initialLayoutMap,
@@ -596,53 +664,53 @@ function A({
   layout: e,
   panelConstraints: t
 }) {
-  const o = [...Object.values(e)], s = o.reduce(
-    (i, r) => i + r,
+  const o = [...Object.values(e)], r = o.reduce(
+    (i, s) => i + s,
     0
   );
   if (o.length !== t.length)
     throw Error(
       `Invalid ${t.length} panel layout: ${o.map((i) => `${i}%`).join(", ")}`
     );
-  if (!P(s, 100) && o.length > 0)
+  if (!P(r, 100) && o.length > 0)
     for (let i = 0; i < t.length; i++) {
-      const r = o[i];
-      z(r != null, `No layout data found for index ${i}`);
-      const u = 100 / s * r;
+      const s = o[i];
+      z(s != null, `No layout data found for index ${i}`);
+      const u = 100 / r * s;
       o[i] = u;
     }
   let a = 0;
   for (let i = 0; i < t.length; i++) {
-    const r = o[i];
-    z(r != null, `No layout data found for index ${i}`);
-    const u = j({
+    const s = o[i];
+    z(s != null, `No layout data found for index ${i}`);
+    const u = W({
       panelConstraints: t[i],
-      size: r
+      size: s
     });
-    r != u && (a += r - u, o[i] = u);
+    s != u && (a += s - u, o[i] = u);
   }
   if (!P(a, 0))
     for (let i = 0; i < t.length; i++) {
-      const r = o[i];
-      z(r != null, `No layout data found for index ${i}`);
-      const u = r + a, c = j({
+      const s = o[i];
+      z(s != null, `No layout data found for index ${i}`);
+      const u = s + a, c = W({
         panelConstraints: t[i],
         size: u
       });
-      if (r !== c && (a -= c - r, o[i] = c, P(a, 0)))
+      if (s !== c && (a -= c - s, o[i] = c, P(a, 0)))
         break;
     }
   const l = Object.keys(e);
-  return o.reduce((i, r, u) => (i[l[u]] = r, i), {});
+  return o.reduce((i, s, u) => (i[l[u]] = s, i), {});
 }
-function Ae({
+function Ne({
   groupId: e
 }) {
   const t = () => {
     const { mountedGroups: n } = D();
-    for (const [o, s] of n)
+    for (const [o, r] of n)
       if (o.id === e)
-        return { group: o, ...s };
+        return { group: o, ...r };
     throw Error(`Could not find Group with id "${e}"`);
   };
   return {
@@ -653,49 +721,49 @@ function Ae({
     setLayout(n) {
       const {
         defaultLayoutDeferred: o,
-        derivedPanelConstraints: s,
+        derivedPanelConstraints: r,
         group: a,
         layout: l,
         separatorToPanels: i
-      } = t(), r = A({
+      } = t(), s = A({
         layout: n,
-        panelConstraints: s
+        panelConstraints: r
       });
-      return o ? l : (U(l, r) || E((u) => ({
+      return o ? l : (U(l, s) || E((u) => ({
         mountedGroups: new Map(u.mountedGroups).set(a, {
           defaultLayoutDeferred: o,
-          derivedPanelConstraints: s,
-          layout: r,
+          derivedPanelConstraints: r,
+          layout: s,
           separatorToPanels: i
         })
-      })), r);
+      })), s);
     }
   };
 }
-function Ne(e) {
+function $e(e) {
   const { mountedGroups: t } = D(), n = t.get(e);
   return z(n, `Mounted Group ${e.id} not found`), n;
 }
 function T(e, t) {
-  const n = oe(e), o = Ne(n), s = n.separators.find(
-    (d) => d.element === e
+  const n = oe(e), o = $e(n), r = n.separators.find(
+    (h) => h.element === e
   );
-  z(s, "Matching separator not found");
-  const a = o.separatorToPanels.get(s);
+  z(r, "Matching separator not found");
+  const a = o.separatorToPanels.get(r);
   z(a, "Matching panels not found");
-  const l = a.map((d) => n.panels.indexOf(d)), r = Ae({ groupId: n.id }).getLayout(), u = Y({
+  const l = a.map((h) => n.panels.indexOf(h)), s = Ne({ groupId: n.id }).getLayout(), u = Y({
     delta: t,
-    initialLayout: r,
+    initialLayout: s,
     panelConstraints: o.derivedPanelConstraints,
     pivotIndices: l,
-    prevLayout: r,
+    prevLayout: s,
     trigger: "keyboard"
   }), c = A({
     layout: u,
     panelConstraints: o.derivedPanelConstraints
   });
-  U(r, c) || E((d) => ({
-    mountedGroups: new Map(d.mountedGroups).set(n, {
+  U(s, c) || E((h) => ({
+    mountedGroups: new Map(h.mountedGroups).set(n, {
       defaultLayoutDeferred: o.defaultLayoutDeferred,
       derivedPanelConstraints: o.derivedPanelConstraints,
       layout: c,
@@ -731,31 +799,31 @@ function Se(e) {
       }
       case "Enter": {
         e.preventDefault();
-        const o = oe(t), { derivedPanelConstraints: s, layout: a, separatorToPanels: l } = Ne(o), i = o.separators.find(
-          (d) => d.element === t
+        const o = oe(t), { derivedPanelConstraints: r, layout: a, separatorToPanels: l } = $e(o), i = o.separators.find(
+          (h) => h.element === t
         );
         z(i, "Matching separator not found");
-        const r = l.get(i);
-        z(r, "Matching panels not found");
-        const u = r[0], c = s.find(
-          (d) => d.panelId === u.id
+        const s = l.get(i);
+        z(s, "Matching panels not found");
+        const u = s[0], c = r.find(
+          (h) => h.panelId === u.id
         );
         if (z(c, "Panel metadata not found"), c.collapsible) {
-          const d = a[u.id], x = c.collapsedSize === d ? o.inMemoryLastExpandedPanelSizes[u.id] ?? c.minSize : c.collapsedSize;
-          T(t, x - d);
+          const h = a[u.id], m = c.collapsedSize === h ? o.inMemoryLastExpandedPanelSizes[u.id] ?? c.minSize : c.collapsedSize;
+          T(t, m - h);
         }
         break;
       }
       case "F6": {
         e.preventDefault();
-        const s = oe(t).separators.map(
-          (r) => r.element
-        ), a = Array.from(s).findIndex(
-          (r) => r === e.currentTarget
+        const r = oe(t).separators.map(
+          (s) => s.element
+        ), a = Array.from(r).findIndex(
+          (s) => s === e.currentTarget
         );
         z(a !== null, "Index not found");
-        const l = e.shiftKey ? a > 0 ? a - 1 : s.length - 1 : a + 1 < s.length ? a + 1 : 0;
-        s[l].focus();
+        const l = e.shiftKey ? a > 0 ? a - 1 : r.length - 1 : a + 1 < r.length ? a + 1 : 0;
+        r[l].focus();
         break;
       }
       case "Home": {
@@ -764,46 +832,34 @@ function Se(e) {
       }
     }
 }
-function ut(e, t) {
-  return {
-    x: e.x >= t.left && e.x <= t.right ? 0 : Math.min(
-      Math.abs(e.x - t.left),
-      Math.abs(e.x - t.right)
-    ),
-    y: e.y >= t.top && e.y <= t.bottom ? 0 : Math.min(
-      Math.abs(e.y - t.top),
-      Math.abs(e.y - t.bottom)
-    )
-  };
-}
-function ct(e, t, n) {
-  let o, s = {
+function ft(e, t, n) {
+  let o, r = {
     x: 1 / 0,
     y: 1 / 0
   };
   for (const a of t) {
-    const l = ut(n, a.rect);
+    const l = Ie(n, a.rect);
     switch (e) {
       case "horizontal": {
-        l.x <= s.x && (o = a, s = l);
+        l.x <= r.x && (o = a, r = l);
         break;
       }
       case "vertical": {
-        l.y <= s.y && (o = a, s = l);
+        l.y <= r.y && (o = a, r = l);
         break;
       }
     }
   }
   return o ? {
-    distance: s,
+    distance: r,
     hitRegion: o
   } : void 0;
 }
 let ne;
-function ft() {
+function dt() {
   return ne === void 0 && (typeof matchMedia == "function" ? ne = !!matchMedia("(pointer:coarse)").matches : ne = !1), ne;
 }
-function dt(e, t) {
+function pt(e, t) {
   if (e === t) throw new Error("Cannot compare node with itself");
   const n = {
     a: we(e),
@@ -816,38 +872,38 @@ function dt(e, t) {
     o,
     "Stacking order can only be calculated for elements with a common ancestor"
   );
-  const s = {
+  const r = {
     a: ze(xe(n.a)),
     b: ze(xe(n.b))
   };
-  if (s.a === s.b) {
+  if (r.a === r.b) {
     const a = o.childNodes, l = {
       a: n.a.at(-1),
       b: n.b.at(-1)
     };
     let i = a.length;
     for (; i--; ) {
-      const r = a[i];
-      if (r === l.a) return 1;
-      if (r === l.b) return -1;
+      const s = a[i];
+      if (s === l.a) return 1;
+      if (s === l.b) return -1;
     }
   }
-  return Math.sign(s.a - s.b);
+  return Math.sign(r.a - r.b);
 }
-const pt = /\b(?:position|zIndex|opacity|transform|webkitTransform|mixBlendMode|filter|webkitFilter|isolation)\b/;
+const ht = /\b(?:position|zIndex|opacity|transform|webkitTransform|mixBlendMode|filter|webkitFilter|isolation)\b/;
 function mt(e) {
-  const t = getComputedStyle($e(e) ?? e).display;
+  const t = getComputedStyle(Fe(e) ?? e).display;
   return t === "flex" || t === "inline-flex";
 }
-function ht(e) {
+function yt(e) {
   const t = getComputedStyle(e);
-  return !!(t.position === "fixed" || t.zIndex !== "auto" && (t.position !== "static" || mt(e)) || +t.opacity < 1 || "transform" in t && t.transform !== "none" || "webkitTransform" in t && t.webkitTransform !== "none" || "mixBlendMode" in t && t.mixBlendMode !== "normal" || "filter" in t && t.filter !== "none" || "webkitFilter" in t && t.webkitFilter !== "none" || "isolation" in t && t.isolation === "isolate" || pt.test(t.willChange) || t.webkitOverflowScrolling === "touch");
+  return !!(t.position === "fixed" || t.zIndex !== "auto" && (t.position !== "static" || mt(e)) || +t.opacity < 1 || "transform" in t && t.transform !== "none" || "webkitTransform" in t && t.webkitTransform !== "none" || "mixBlendMode" in t && t.mixBlendMode !== "normal" || "filter" in t && t.filter !== "none" || "webkitFilter" in t && t.webkitFilter !== "none" || "isolation" in t && t.isolation === "isolate" || ht.test(t.willChange) || t.webkitOverflowScrolling === "touch");
 }
 function xe(e) {
   let t = e.length;
   for (; t--; ) {
     const n = e[t];
-    if (z(n, "Missing node"), ht(n)) return n;
+    if (z(n, "Missing node"), yt(n)) return n;
   }
   return null;
 }
@@ -857,46 +913,46 @@ function ze(e) {
 function we(e) {
   const t = [];
   for (; e; )
-    t.push(e), e = $e(e);
+    t.push(e), e = Fe(e);
   return t;
 }
-function $e(e) {
+function Fe(e) {
   const { parentNode: t } = e;
   return t && t instanceof ShadowRoot ? t.host : t;
 }
-function yt(e, t) {
+function gt(e, t) {
   return e.x < t.x + t.width && e.x + e.width > t.x && e.y < t.y + t.height && e.y + e.height > t.y;
 }
-function gt({
+function vt({
   groupElement: e,
   hitRegion: t,
   pointerEventTarget: n
 }) {
   if (!(n instanceof HTMLElement) || n.contains(e) || e.contains(n))
     return !0;
-  if (dt(n, e) > 0) {
+  if (pt(n, e) > 0) {
     let o = n;
     for (; o; ) {
       if (o.contains(e))
         return !0;
-      if (yt(o.getBoundingClientRect(), t))
+      if (gt(o.getBoundingClientRect(), t))
         return !1;
       o = o.parentElement;
     }
   }
   return !0;
 }
-function Fe(e, t) {
+function He(e, t) {
   const n = [];
-  return t.forEach((o, s) => {
-    if (s.disabled)
+  return t.forEach((o, r) => {
+    if (r.disabled)
       return;
-    const a = ft() ? ge.coarse : ge.precise, l = Ie(s), i = ct(s.orientation, l, {
+    const a = dt() ? ge.coarse : ge.precise, l = Ge(r), i = ft(r.orientation, l, {
       x: e.clientX,
       y: e.clientY
     });
-    i && i.distance.x <= a && i.distance.y <= a && gt({
-      groupElement: s.element,
+    i && i.distance.x <= a && i.distance.y <= a && vt({
+      groupElement: r.element,
       hitRegion: i.hitRegion.rect,
       pointerEventTarget: e.target
     }) && n.push(i.hitRegion);
@@ -905,14 +961,14 @@ function Fe(e, t) {
 function be(e) {
   if (e.defaultPrevented)
     return;
-  const { mountedGroups: t } = D(), n = Fe(e, t), o = /* @__PURE__ */ new Set(), s = /* @__PURE__ */ new Set(), a = /* @__PURE__ */ new Set(), l = /* @__PURE__ */ new Map();
+  const { mountedGroups: t } = D(), n = He(e, t), o = /* @__PURE__ */ new Set(), r = /* @__PURE__ */ new Set(), a = /* @__PURE__ */ new Set(), l = /* @__PURE__ */ new Map();
   let i = !1;
-  n.forEach((r) => {
-    o.add(r.group), r.panels.forEach((c) => {
-      s.add(c);
-    }), r.separator && (a.add(r.separator), i || (i = !0, r.separator.element.focus()));
-    const u = t.get(r.group);
-    u && l.set(r.group, u.layout);
+  n.forEach((s) => {
+    o.add(s.group), s.panels.forEach((c) => {
+      r.add(c);
+    }), s.separator && (a.add(s.separator), i || (i = !0, s.separator.element.focus()));
+    const u = t.get(s.group);
+    u && l.set(s.group, u.layout);
   }), E({
     interactionState: {
       hitRegions: n,
@@ -942,7 +998,7 @@ function Le(e) {
         );
         return;
       }
-      _e({
+      Ae({
         event: e,
         hitRegions: t.hitRegions,
         initialLayoutMap: t.initialLayoutMap,
@@ -952,7 +1008,7 @@ function Le(e) {
       break;
     }
     default: {
-      const o = Fe(e, n);
+      const o = He(e, n);
       o.length === 0 ? t.state !== "inactive" && E({
         interactionState: { state: "inactive" }
       }) : E({
@@ -990,111 +1046,121 @@ function Ce(e) {
       n += l, o[a.panelId] = l;
     } else
       o[a.panelId] = void 0;
-  const s = e.length - t;
-  if (s !== 0) {
-    const a = I((100 - n) / s);
+  const r = e.length - t;
+  if (r !== 0) {
+    const a = I((100 - n) / r);
     for (const l of e)
       l.defaultSize === void 0 && (o[l.panelId] = a);
   }
   return o;
 }
-function vt(e, t, n) {
+function St(e, t, n) {
   const o = n[0];
   if (!o)
     return;
-  const s = e.panels.find((l) => l.element === t);
-  if (!s || !s.onResize)
+  const r = e.panels.find((l) => l.element === t);
+  if (!r || !r.onResize)
     return;
   const a = B({ group: e });
-  s.onResize(
+  r.onResize(
     {
       asPercentage: I(
         o.inlineSize / a * 100
       ),
       inPixels: o.inlineSize
     },
-    s.id
+    r.id
   );
 }
-function St(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;
-  z(
-    e.separators.length === 0 || e.separators.length < e.panels.length,
-    "Invalid Group configuration; too many Separator components"
-  );
-  const n = /* @__PURE__ */ new Set(), o = /* @__PURE__ */ new Set(), s = new ResizeObserver((m) => {
-    for (const f of m) {
-      const { borderBoxSize: p, target: h } = f;
-      if (h === e.element) {
+  const n = /* @__PURE__ */ new Set(), o = /* @__PURE__ */ new Set(), r = new ResizeObserver((p) => {
+    for (const f of p) {
+      const { borderBoxSize: d, target: y } = f;
+      if (y === e.element) {
         if (t) {
           if (B({ group: e }) === 0)
             return;
-          E((g) => {
-            const S = g.mountedGroups.get(e);
-            if (S) {
-              const y = ye(e), b = S.defaultLayoutDeferred ? Ce(y) : S.layout, L = A({
+          E((S) => {
+            const x = S.mountedGroups.get(e);
+            if (x) {
+              const g = ye(e), b = x.defaultLayoutDeferred ? Ce(g) : x.layout, L = A({
                 layout: b,
-                panelConstraints: y
+                panelConstraints: g
               });
-              return !S.defaultLayoutDeferred && U(b, L) ? g : {
-                mountedGroups: new Map(g.mountedGroups).set(e, {
+              return !x.defaultLayoutDeferred && U(b, L) && xt(
+                x.derivedPanelConstraints,
+                g
+              ) ? S : {
+                mountedGroups: new Map(S.mountedGroups).set(e, {
                   defaultLayoutDeferred: !1,
-                  derivedPanelConstraints: y,
+                  derivedPanelConstraints: g,
                   layout: L,
-                  separatorToPanels: S.separatorToPanels
+                  separatorToPanels: x.separatorToPanels
                 })
               };
             }
-            return g;
+            return S;
           });
         }
       } else
-        vt(e, h, p);
+        St(e, y, d);
     }
   });
-  s.observe(e.element), e.panels.forEach((m) => {
+  r.observe(e.element), e.panels.forEach((p) => {
     z(
-      !n.has(m.id),
-      `Panel ids must be unique; id "${m.id}" was used more than once`
-    ), n.add(m.id), m.onResize && s.observe(m.element);
+      !n.has(p.id),
+      `Panel ids must be unique; id "${p.id}" was used more than once`
+    ), n.add(p.id), p.onResize && r.observe(p.element);
   });
-  const a = B({ group: e }), l = ye(e), i = e.panels.map(({ id: m }) => m).join(",");
-  let r = e.defaultLayout;
-  r && e.panels.length !== Object.keys(r).length && (r = void 0);
-  const u = e.inMemoryLayouts[i] ?? r ?? Ce(l), c = A({
+  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 ?? Ce(l), c = A({
     layout: u,
     panelConstraints: l
-  }), d = Ie(e), x = E((m) => ({
-    mountedGroups: new Map(m.mountedGroups).set(e, {
-      defaultLayoutDeferred: a === 0,
-      derivedPanelConstraints: l,
-      layout: c,
-      separatorToPanels: new Map(
-        d.filter((f) => f.separator).map((f) => [f.separator, f.panels])
-      )
-    })
-  }));
-  return e.element.addEventListener("pointerleave", ve), e.separators.forEach((m) => {
+  }), h = Ge(e), m = E((p) => {
+    const f = /* @__PURE__ */ new Map();
+    return h.forEach((d) => {
+      d.separator && f.set(d.separator, d.panels);
+    }), {
+      mountedGroups: new Map(p.mountedGroups).set(e, {
+        defaultLayoutDeferred: a === 0,
+        derivedPanelConstraints: l,
+        layout: c,
+        separatorToPanels: f
+      })
+    };
+  });
+  return e.element.addEventListener("pointerleave", ve), e.separators.forEach((p) => {
     z(
-      !o.has(m.id),
-      `Separator ids must be unique; id "${m.id}" was used more than once`
-    ), o.add(m.id), m.element.addEventListener("keydown", Se);
-  }), x.mountedGroups.size === 1 && (window.addEventListener("pointerdown", be), window.addEventListener("pointermove", Le), window.addEventListener("pointerup", Pe)), function() {
+      !o.has(p.id),
+      `Separator ids must be unique; id "${p.id}" was used more than once`
+    ), o.add(p.id), p.element.addEventListener("keydown", Se);
+  }), m.mountedGroups.size === 1 && (window.addEventListener("pointerdown", be), window.addEventListener("pointermove", Le), window.addEventListener("pointerup", Pe)), function() {
     t = !1;
-    const f = E((p) => {
-      const h = new Map(p.mountedGroups);
-      return h.delete(e), { mountedGroups: h };
+    const f = E((d) => {
+      const y = new Map(d.mountedGroups);
+      return y.delete(e), { mountedGroups: y };
     });
-    e.element.removeEventListener("pointerleave", ve), e.separators.forEach((p) => {
-      p.element.removeEventListener("keydown", Se);
-    }), f.mountedGroups.size === 0 && (window.removeEventListener("pointerdown", be), window.removeEventListener("pointermove", Le), window.removeEventListener("pointerup", Pe)), s.disconnect();
+    e.element.removeEventListener("pointerleave", ve), e.separators.forEach((d) => {
+      d.element.removeEventListener("keydown", Se);
+    }), f.mountedGroups.size === 0 && (window.removeEventListener("pointerdown", be), window.removeEventListener("pointermove", Le), window.removeEventListener("pointerup", Pe)), r.disconnect();
   };
 }
 function ue(e) {
-  const t = Ke();
+  const t = Xe();
   return `${e ?? t}`;
 }
-const N = typeof window < "u" ? Xe : Re;
+const N = typeof window < "u" ? Ye : Re;
 function ce(e) {
   const t = O(e);
   return N(() => {
@@ -1118,28 +1184,28 @@ function fe(...e) {
     });
   });
 }
-function xt(e) {
+function wt(e) {
   const t = O({ ...e });
   return N(() => {
     for (const n in e)
       t.current[n] = e[n];
   }, [e]), t.current;
 }
-const He = "--react-resizable-panels--panel--pointer-events";
+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 je = Ye(null);
-function zt(e, t) {
+const Be = qe(null);
+function bt(e, t) {
   const n = O({
     getLayout: () => ({}),
-    setLayout: st
+    setLayout: lt
   });
   Me(t, () => n.current, []), N(() => {
     Object.assign(
       n.current,
-      Ae({ groupId: e })
+      Ne({ groupId: e })
     );
   });
 }
@@ -1148,23 +1214,23 @@ function Gt({
   className: t,
   defaultLayout: n,
   disableCursor: o,
-  disabled: s,
+  disabled: r,
   elementRef: a,
   groupRef: l,
   id: i,
-  onLayoutChange: r,
+  onLayoutChange: s,
   orientation: u = "horizontal",
   style: c,
-  ...d
+  ...h
 }) {
-  const x = O({}), m = ce((w) => {
-    U(x.current, w) || (x.current = w, r?.(w));
-  }), f = ue(i), [p, h] = G(!1), [v, g] = G(null), [S, y] = G(n ?? {}), [b, L] = G([]), [C, q] = G([]), Z = O({
+  const m = O({}), p = ce((w) => {
+    U(m.current, w) || (m.current = w, s?.(w));
+  }), 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(g, a);
-  zt(f, l);
-  const Q = Ge(
+  }), J = fe(S, a);
+  bt(f, l);
+  const Q = ke(
     () => ({
       id: f,
       orientation: u,
@@ -1180,7 +1246,7 @@ function Gt({
       })
     }),
     [f, u]
-  ), $ = xt({
+  ), $ = wt({
     defaultLayout: n,
     disableCursor: o
   }), V = O(null);
@@ -1190,7 +1256,7 @@ function Gt({
     const w = {
       defaultLayout: $.defaultLayout,
       disableCursor: !!$.disableCursor,
-      disabled: !!s,
+      disabled: !!r,
       element: v,
       id: f,
       inMemoryLastExpandedPanelSizes: Z.current.lastExpandedPanelSizes,
@@ -1200,49 +1266,49 @@ function Gt({
       separators: C
     };
     V.current = w;
-    const M = St(w), me = D().mountedGroups.get(w);
-    if (me) {
-      const { defaultLayoutDeferred: H, derivedPanelConstraints: W, layout: ee } = me;
-      !H && W.length > 0 && (y(ee), m?.(ee));
+    const M = zt(w), he = D().mountedGroups.get(w);
+    if (he) {
+      const { defaultLayoutDeferred: H, derivedPanelConstraints: j, layout: ee } = he;
+      !H && j.length > 0 && (g(ee), p?.(ee));
     }
-    const Be = _.addListener(
+    const Ue = _.addListener(
       "interactionStateChange",
       (H) => {
         switch (H.state) {
           case "active": {
-            h(
+            y(
               H.hitRegions.some(
-                (W) => W.group === w
+                (j) => j.group === w
               )
             );
             break;
           }
           default: {
-            h(!1);
+            y(!1);
             break;
           }
         }
       }
-    ), Ue = _.addListener(
+    ), Ve = _.addListener(
       "mountedGroupsChange",
       (H) => {
-        const W = H.get(w);
-        if (W) {
-          const { defaultLayoutDeferred: ee, derivedPanelConstraints: Ve, layout: he } = W;
-          if (ee || Ve.length === 0)
+        const j = H.get(w);
+        if (j) {
+          const { defaultLayoutDeferred: ee, derivedPanelConstraints: Ke, layout: me } = j;
+          if (ee || Ke.length === 0)
             return;
-          y(he), m?.(he);
+          g(me), p?.(me);
         }
       }
     );
     return () => {
-      V.current = null, M(), Be(), Ue();
+      V.current = null, M(), Ue(), Ve();
     };
   }, [
-    s,
+    r,
     v,
     f,
-    m,
+    p,
     u,
     b,
     C,
@@ -1252,16 +1318,16 @@ function Gt({
     w && (w.defaultLayout = n, w.disableCursor = !!o);
   });
   const pe = {
-    [He]: p ? "none" : void 0
+    [je]: d ? "none" : void 0
   };
-  for (const w in S) {
-    const M = We(f, w), F = S[w];
+  for (const w in x) {
+    const M = We(f, w), F = x[w];
     pe[M] = F;
   }
-  return /* @__PURE__ */ K(je.Provider, { value: Q, children: /* @__PURE__ */ K(
+  return /* @__PURE__ */ K(Be.Provider, { value: Q, children: /* @__PURE__ */ K(
     "div",
     {
-      ...d,
+      ...h,
       "aria-orientation": u,
       className: t,
       "data-group": !0,
@@ -1282,7 +1348,7 @@ function Gt({
 function ae(e) {
   return `react-resizable-panels:${e}`;
 }
-function wt({
+function Lt({
   id: e,
   layout: t,
   storage: n
@@ -1294,19 +1360,19 @@ function wt({
     console.error(o);
   }
 }
-function It({
+function Dt({
   groupId: e,
   storage: t
 }) {
-  const n = qe(
-    bt,
+  const n = Ze(
+    Pt,
     () => t.getItem(ae(e)),
     () => t.getItem(ae(e))
-  ), o = Ge(
+  ), o = ke(
     () => n ? JSON.parse(n) : void 0,
     [n]
-  ), s = Ee(
-    (a) => wt({
+  ), r = Ee(
+    (a) => Lt({
       id: e,
       layout: a,
       storage: t
@@ -1315,59 +1381,59 @@ function It({
   );
   return {
     defaultLayout: o,
-    onLayoutChange: s
+    onLayoutChange: r
   };
 }
-function bt() {
+function Pt() {
   return function() {
   };
 }
-function kt() {
-  return G(null);
+function Ot() {
+  return k(null);
 }
-function Dt() {
+function Tt() {
   return O(null);
 }
 function de() {
-  const e = Ze(je);
+  const e = Je(Be);
   return z(
     e,
     "Group Context not found; did you render a Panel or Separator outside of a Group?"
   ), e;
 }
-function Lt({
+function Ct({
   groupId: e,
   panelId: t
 }) {
   const n = () => {
     const { mountedGroups: i } = D();
     for (const [
-      r,
+      s,
       {
         defaultLayoutDeferred: u,
         derivedPanelConstraints: c,
-        layout: d,
-        separatorToPanels: x
+        layout: h,
+        separatorToPanels: m
       }
     ] of i)
-      if (r.id === e)
+      if (s.id === e)
         return {
           defaultLayoutDeferred: u,
           derivedPanelConstraints: c,
-          group: r,
-          layout: d,
-          separatorToPanels: x
+          group: s,
+          layout: h,
+          separatorToPanels: m
         };
     throw Error(`Group ${e} not found`);
   }, o = () => {
     const i = n().derivedPanelConstraints.find(
-      (r) => r.panelId === t
+      (s) => s.panelId === t
     );
     if (i !== void 0)
       return i;
     throw Error(`Panel constraints not found for Panel ${t}`);
-  }, s = () => {
-    const i = n().group.panels.find((r) => r.id === t);
+  }, r = () => {
+    const i = n().group.panels.find((s) => s.id === t);
     if (i !== void 0)
       return i;
     throw Error(`Layout not found for Panel ${t}`);
@@ -1377,62 +1443,62 @@ function Lt({
       return i;
     throw Error(`Layout not found for Panel ${t}`);
   }, l = (i) => {
-    const r = a();
-    if (i === r)
+    const s = a();
+    if (i === s)
       return;
     const {
       defaultLayoutDeferred: u,
       derivedPanelConstraints: c,
-      group: d,
-      layout: x,
-      separatorToPanels: m
-    } = n(), f = d.panels.findIndex((g) => g.id === t), p = f === d.panels.length - 1, h = Y({
-      delta: p ? r - i : i - r,
-      initialLayout: x,
+      group: h,
+      layout: m,
+      separatorToPanels: p
+    } = 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: p ? [f - 1, f] : [f, f + 1],
-      prevLayout: x,
+      pivotIndices: d ? [f - 1, f] : [f, f + 1],
+      prevLayout: m,
       trigger: "imperative-api"
     }), v = A({
-      layout: h,
+      layout: y,
       panelConstraints: c
     });
-    U(x, v) || E((g) => ({
-      mountedGroups: new Map(g.mountedGroups).set(d, {
+    U(m, v) || E((S) => ({
+      mountedGroups: new Map(S.mountedGroups).set(h, {
         defaultLayoutDeferred: u,
         derivedPanelConstraints: c,
         layout: v,
-        separatorToPanels: m
+        separatorToPanels: p
       })
     }));
   };
   return {
     collapse: () => {
-      const { collapsible: i, collapsedSize: r } = o(), u = a();
-      i && u !== r && l(r);
+      const { collapsible: i, collapsedSize: s } = o(), u = a();
+      i && u !== s && l(s);
     },
     expand: () => {
-      const { collapsible: i, collapsedSize: r, minSize: u } = o(), c = a();
-      i && c === r && l(u);
+      const { collapsible: i, collapsedSize: s, minSize: u } = o(), c = a();
+      i && c === s && l(u);
     },
     getSize: () => {
-      const { group: i } = n(), r = a(), { element: u } = s(), c = i.orientation === "horizontal" ? u.offsetWidth : u.offsetHeight;
+      const { group: i } = n(), s = a(), { element: u } = r(), c = i.orientation === "horizontal" ? u.offsetWidth : u.offsetHeight;
       return {
-        asPercentage: r,
+        asPercentage: s,
         inPixels: c
       };
     },
     isCollapsed: () => {
-      const { collapsible: i, collapsedSize: r } = o(), u = a();
-      return i && P(r, u);
+      const { collapsible: i, collapsedSize: s } = o(), u = a();
+      return i && P(s, u);
     },
     resize: (i) => {
       if (a() !== i) {
         let u;
         switch (typeof i) {
           case "number": {
-            const { group: c } = n(), d = B({ group: c });
-            u = I(i / d * 100);
+            const { group: c } = n(), h = B({ group: c });
+            u = I(i / h * 100);
             break;
           }
           case "string": {
@@ -1445,7 +1511,7 @@ function Lt({
     }
   };
 }
-function Pt(e, t) {
+function Rt(e, t) {
   const { id: n } = de(), o = O({
     collapse: ie,
     expand: ie,
@@ -1459,67 +1525,67 @@ function Pt(e, t) {
   Me(t, () => o.current, []), N(() => {
     Object.assign(
       o.current,
-      Lt({ groupId: n, panelId: e })
+      Ct({ groupId: n, panelId: e })
     );
   });
 }
-function Ot({
+function _t({
   children: e,
   className: t,
   collapsedSize: n = "0%",
   collapsible: o = !1,
-  defaultSize: s,
+  defaultSize: r,
   elementRef: a,
   id: l,
   maxSize: i = "100%",
-  minSize: r = "0%",
+  minSize: s = "0%",
   onResize: u,
   panelRef: c,
-  style: d,
-  ...x
+  style: h,
+  ...m
 }) {
-  const m = !!l, f = ue(l), [p, h] = G(null), v = fe(h, a), { id: g, registerPanel: S } = de(), y = u !== null, b = ce((C) => {
+  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 (p !== null)
-      return S({
-        element: p,
+    if (d !== null)
+      return x({
+        element: d,
         id: f,
-        idIsStable: m,
-        onResize: y ? b : void 0,
+        idIsStable: p,
+        onResize: g ? b : void 0,
         panelConstraints: {
           collapsedSize: n,
           collapsible: o,
-          defaultSize: s,
+          defaultSize: r,
           maxSize: i,
-          minSize: r
+          minSize: s
         }
       });
   }, [
     n,
     o,
-    s,
-    p,
-    y,
+    r,
+    d,
+    g,
     f,
-    m,
+    p,
     i,
-    r,
+    s,
     b,
-    S
-  ]), Pt(f, c);
-  const L = We(g, f);
+    x
+  ]), Rt(f, c);
+  const L = We(S, f);
   return /* @__PURE__ */ K(
     "div",
     {
-      ...x,
+      ...m,
       "data-panel": !0,
       "data-testid": f,
       id: f,
       ref: v,
       style: {
-        ...Ct,
+        ...Et,
         flexBasis: 0,
         flexGrow: `var(${L}, 1)`,
         flexShrink: 1,
@@ -1527,7 +1593,7 @@ function Ot({
         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",
@@ -1536,7 +1602,7 @@ function Ot({
           style: {
             width: "100%",
             height: "100%",
-            ...d
+            ...h
           },
           children: e
         }
@@ -1544,7 +1610,7 @@ function Ot({
     }
   );
 }
-const Ct = {
+const Et = {
   minHeight: "unset",
   maxHeight: "unset",
   height: "unset",
@@ -1560,24 +1626,24 @@ const Ct = {
   padding: "unset",
   margin: "unset"
 };
-function Tt() {
-  return G(null);
+function At() {
+  return k(null);
 }
-function _t() {
+function Nt() {
   return O(null);
 }
-function Rt({
+function Mt({
   layout: e,
   panelConstraints: t,
   panelId: n,
   panelIndex: o
 }) {
-  let s, a;
+  let r, a;
   const l = e[n], i = t.find(
-    (r) => r.panelId === n
+    (s) => s.panelId === n
   );
   if (i) {
-    const r = i.maxSize, u = a = i.collapsible ? i.collapsedSize : i.minSize, c = [o, o + 1];
+    const s = i.maxSize, u = a = i.collapsible ? i.collapsedSize : i.minSize, c = [o, o + 1];
     a = A({
       layout: Y({
         delta: u - l,
@@ -1588,9 +1654,9 @@ function Rt({
         trigger: "keyboard"
       }),
       panelConstraints: t
-    })[n], s = A({
+    })[n], r = A({
       layout: Y({
-        delta: r - l,
+        delta: s - l,
         initialLayout: e,
         panelConstraints: t,
         pivotIndices: c,
@@ -1602,35 +1668,35 @@ function Rt({
   }
   return {
     valueControls: n,
-    valueMax: s,
+    valueMax: r,
     valueMin: a,
     valueNow: l
   };
 }
-function At({
+function $t({
   children: e,
   className: t,
   elementRef: n,
   id: o,
-  style: s,
+  style: r,
   ...a
 }) {
-  const l = ue(o), [i, r] = G({}), [u, c] = G("inactive"), [d, x] = G(null), m = fe(x, n), {
+  const l = ue(o), [i, s] = k({}), [u, c] = k("inactive"), [h, m] = k(null), p = fe(m, n), {
     id: f,
-    orientation: p,
-    registerSeparator: h
-  } = de(), v = p === "horizontal" ? "vertical" : "horizontal";
+    orientation: d,
+    registerSeparator: y
+  } = de(), v = d === "horizontal" ? "vertical" : "horizontal";
   return N(() => {
-    if (d !== null) {
-      const g = {
-        element: d,
+    if (h !== null) {
+      const S = {
+        element: h,
         id: l
-      }, S = h(g), y = _.addListener(
+      }, x = y(S), g = _.addListener(
         "interactionStateChange",
         (L) => {
           c(
             L.state !== "inactive" && L.hitRegions.some(
-              (C) => C.separator === g
+              (C) => C.separator === S
             ) ? L.state : "inactive"
           );
         }
@@ -1640,11 +1706,11 @@ function At({
           L.forEach(
             ({ derivedPanelConstraints: C, layout: q, separatorToPanels: Z }, J) => {
               if (J.id === f) {
-                const Q = Z.get(g);
+                const Q = Z.get(S);
                 if (Q) {
                   const $ = Q[0], V = J.panels.indexOf($);
-                  r(
-                    Rt({
+                  s(
+                    Mt({
                       layout: q,
                       panelConstraints: C,
                       panelId: $.id,
@@ -1658,10 +1724,10 @@ function At({
         }
       );
       return () => {
-        y(), b(), S();
+        g(), b(), x();
       };
     }
-  }, [d, f, l, h]), /* @__PURE__ */ K(
+  }, [h, f, l, y]), /* @__PURE__ */ K(
     "div",
     {
       ...a,
@@ -1675,11 +1741,11 @@ function At({
       "data-separator": u,
       "data-testid": l,
       id: l,
-      ref: m,
+      ref: p,
       role: "separator",
       style: {
         flexBasis: "auto",
-        ...s,
+        ...r,
         flexGrow: 0,
         flexShrink: 0
       },
@@ -1689,12 +1755,12 @@ function At({
 }
 export {
   Gt as Group,
-  Ot as Panel,
-  At as Separator,
-  It as useDefaultLayout,
-  kt as useGroupCallbackRef,
-  Dt as useGroupRef,
-  Tt as usePanelCallbackRef,
-  _t 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