react-resizable-panels 4.7.2 → 4.7.4

package/dist/react-resizable-panels.js

@@ -1,6 +1,6 @@
 "use client";
-import { jsx as oe } from "react/jsx-runtime";
-import { useState as ie, useCallback as te, useId as pt, useLayoutEffect as Be, useEffect as de, useRef as T, createContext as ht, useImperativeHandle as We, useMemo as Ue, useSyncExternalStore as Ke, useContext as mt } from "react";
+import { jsx as ie } from "react/jsx-runtime";
+import { useState as re, useCallback as ne, useId as pt, useLayoutEffect as Be, useEffect as de, useRef as T, createContext as ht, useImperativeHandle as We, useMemo as Ue, useSyncExternalStore as Ke, useContext as mt } from "react";
 function gt(e, t) {
   const n = getComputedStyle(e), o = parseFloat(n.fontSize);
   return t * o;
@@ -25,36 +25,36 @@ function zt(e) {
     }
   }
 }
-function le({
+function te({
   groupSize: e,
   panelElement: t,
   styleProp: n
 }) {
   let o;
-  const [r, a] = zt(n);
-  switch (a) {
+  const [i, s] = zt(n);
+  switch (s) {
     case "%": {
-      o = r / 100 * e;
+      o = i / 100 * e;
       break;
     }
     case "px": {
-      o = r;
+      o = i;
       break;
     }
     case "rem": {
-      o = St(t, r);
+      o = St(t, i);
       break;
     }
     case "em": {
-      o = gt(t, r);
+      o = gt(t, i);
       break;
     }
     case "vh": {
-      o = yt(r);
+      o = yt(i);
       break;
     }
     case "vw": {
-      o = vt(r);
+      o = vt(i);
       break;
     }
   }
@@ -67,7 +67,7 @@ function Q({
   group: e
 }) {
   const { orientation: t, panels: n } = e;
-  return n.reduce((o, r) => (o += t === "horizontal" ? r.element.offsetWidth : r.element.offsetHeight, o), 0);
+  return n.reduce((o, i) => (o += t === "horizontal" ? i.element.offsetWidth : i.element.offsetHeight, o), 0);
 }
 function ge(e) {
   const { panels: t } = e, n = Q({ group: e });
@@ -81,51 +81,51 @@ function ge(e) {
     maxSize: 100,
     panelId: o.id
   })) : t.map((o) => {
-    const { element: r, panelConstraints: a } = o;
-    let u = 0;
-    if (a.collapsedSize !== void 0) {
-      const c = le({
+    const { element: i, panelConstraints: s } = o;
+    let l = 0;
+    if (s.collapsedSize !== void 0) {
+      const c = te({
         groupSize: n,
-        panelElement: r,
-        styleProp: a.collapsedSize
+        panelElement: i,
+        styleProp: s.collapsedSize
       });
-      u = D(c / n * 100);
+      l = D(c / n * 100);
     }
-    let i;
-    if (a.defaultSize !== void 0) {
-      const c = le({
+    let r;
+    if (s.defaultSize !== void 0) {
+      const c = te({
         groupSize: n,
-        panelElement: r,
-        styleProp: a.defaultSize
+        panelElement: i,
+        styleProp: s.defaultSize
       });
-      i = D(c / n * 100);
+      r = D(c / n * 100);
     }
-    let s = 0;
-    if (a.minSize !== void 0) {
-      const c = le({
+    let a = 0;
+    if (s.minSize !== void 0) {
+      const c = te({
         groupSize: n,
-        panelElement: r,
-        styleProp: a.minSize
+        panelElement: i,
+        styleProp: s.minSize
       });
-      s = D(c / n * 100);
+      a = D(c / n * 100);
     }
-    let l = 100;
-    if (a.maxSize !== void 0) {
-      const c = le({
+    let u = 100;
+    if (s.maxSize !== void 0) {
+      const c = te({
         groupSize: n,
-        panelElement: r,
-        styleProp: a.maxSize
+        panelElement: i,
+        styleProp: s.maxSize
       });
-      l = D(c / n * 100);
+      u = D(c / n * 100);
     }
     return {
-      groupResizeBehavior: a.groupResizeBehavior,
-      collapsedSize: u,
-      collapsible: a.collapsible === !0,
-      defaultSize: i,
-      disabled: a.disabled,
-      minSize: s,
-      maxSize: l,
+      groupResizeBehavior: s.groupResizeBehavior,
+      collapsedSize: l,
+      collapsible: s.collapsible === !0,
+      defaultSize: r,
+      disabled: s.disabled,
+      minSize: a,
+      maxSize: u,
       panelId: o.id
     };
   });
@@ -171,41 +171,41 @@ function wt({
     x: n.x + n.width / 2,
     y: n.y + n.height / 2
   };
-  let r, a = Number.MAX_VALUE;
-  for (const u of t) {
-    const { x: i, y: s } = qe(o, u), l = e === "horizontal" ? i : s;
-    l < a && (a = l, r = u);
+  let i, s = Number.MAX_VALUE;
+  for (const l of t) {
+    const { x: r, y: a } = qe(o, l), u = e === "horizontal" ? r : a;
+    u < s && (s = u, i = l);
   }
-  return L(r, "No rect found"), r;
+  return L(i, "No rect found"), i;
 }
 let ue;
 function Pt() {
   return ue === void 0 && (typeof matchMedia == "function" ? ue = !!matchMedia("(pointer:coarse)").matches : ue = !1), ue;
 }
 function Ye(e) {
-  const { element: t, orientation: n, panels: o, separators: r } = e, a = Se(
+  const { element: t, orientation: n, panels: o, separators: i } = e, s = Se(
     n,
     Array.from(t.children).filter(Xe).map((x) => ({ element: x }))
-  ).map(({ element: x }) => x), u = [];
-  let i = !1, s = !1, l = -1, c = -1, m = 0, p, v = [];
+  ).map(({ element: x }) => x), l = [];
+  let r = !1, a = !1, u = -1, c = -1, m = 0, d, v = [];
   {
     let x = -1;
-    for (const f of a)
-      f.hasAttribute("data-panel") && (x++, f.ariaDisabled === null && (m++, l === -1 && (l = x), c = x));
+    for (const f of s)
+      f.hasAttribute("data-panel") && (x++, f.ariaDisabled === null && (m++, u === -1 && (u = x), c = x));
   }
   if (m > 1) {
     let x = -1;
-    for (const f of a)
+    for (const f of s)
       if (f.hasAttribute("data-panel")) {
         x++;
         const h = o.find(
           (g) => g.element === f
         );
         if (h) {
-          if (p) {
-            const g = p.element.getBoundingClientRect(), y = f.getBoundingClientRect();
+          if (d) {
+            const g = d.element.getBoundingClientRect(), y = f.getBoundingClientRect();
             let z;
-            if (s) {
+            if (a) {
               const S = n === "horizontal" ? new DOMRect(
                 g.right,
                 g.top,
@@ -216,12 +216,12 @@ function Ye(e) {
                 g.bottom,
                 g.width,
                 0
-              ), d = n === "horizontal" ? new DOMRect(y.left, y.top, 0, y.height) : new DOMRect(y.left, y.top, y.width, 0);
+              ), p = n === "horizontal" ? new DOMRect(y.left, y.top, 0, y.height) : new DOMRect(y.left, y.top, y.width, 0);
               switch (v.length) {
                 case 0: {
                   z = [
                     S,
-                    d
+                    p
                   ];
                   break;
                 }
@@ -233,7 +233,7 @@ function Ye(e) {
                   });
                   z = [
                     P,
-                    R === g ? d : S
+                    R === g ? p : S
                   ];
                   break;
                 }
@@ -257,48 +257,48 @@ function Ye(e) {
                 )
               ];
             for (const S of z) {
-              let d = "width" in S ? S : S.element.getBoundingClientRect();
+              let p = "width" in S ? S : S.element.getBoundingClientRect();
               const P = Pt() ? e.resizeTargetMinimumSize.coarse : e.resizeTargetMinimumSize.fine;
-              if (d.width < P) {
-                const C = P - d.width;
-                d = new DOMRect(
-                  d.x - C / 2,
-                  d.y,
-                  d.width + C,
-                  d.height
+              if (p.width < P) {
+                const C = P - p.width;
+                p = new DOMRect(
+                  p.x - C / 2,
+                  p.y,
+                  p.width + C,
+                  p.height
                 );
               }
-              if (d.height < P) {
-                const C = P - d.height;
-                d = new DOMRect(
-                  d.x,
-                  d.y - C / 2,
-                  d.width,
-                  d.height + C
+              if (p.height < P) {
+                const C = P - p.height;
+                p = new DOMRect(
+                  p.x,
+                  p.y - C / 2,
+                  p.width,
+                  p.height + C
                 );
               }
-              const R = x <= l || x > c;
-              !i && !R && u.push({
+              const R = x <= u || x > c;
+              !r && !R && l.push({
                 group: e,
                 groupSize: Q({ group: e }),
-                panels: [p, h],
+                panels: [d, h],
                 separator: "width" in S ? void 0 : S,
-                rect: d
-              }), i = !1;
+                rect: p
+              }), r = !1;
             }
           }
-          s = !1, p = h, v = [];
+          a = !1, d = h, v = [];
         }
       } else if (f.hasAttribute("data-separator")) {
-        f.ariaDisabled !== null && (i = !0);
-        const h = r.find(
+        f.ariaDisabled !== null && (r = !0);
+        const h = i.find(
           (g) => g.element === f
         );
-        h ? v.push(h) : (p = void 0, v = []);
+        h ? v.push(h) : (d = void 0, v = []);
       } else
-        s = !0;
+        a = !0;
   }
-  return u;
+  return l;
 }
 class Je {
   #e = {};
@@ -314,18 +314,18 @@ class Je {
       if (o.length === 1)
         o[0].call(null, n);
       else {
-        let r = !1, a = null;
-        const u = Array.from(o);
-        for (let i = 0; i < u.length; i++) {
-          const s = u[i];
+        let i = !1, s = null;
+        const l = Array.from(o);
+        for (let r = 0; r < l.length; r++) {
+          const a = l[r];
           try {
-            s.call(null, n);
-          } catch (l) {
-            a === null && (r = !0, a = l);
+            a.call(null, n);
+          } catch (u) {
+            s === null && (i = !0, s = u);
           }
         }
-        if (r)
-          throw a;
+        if (i)
+          throw s;
       }
   }
   removeAllListeners() {
@@ -334,8 +334,8 @@ class Je {
   removeListener(t, n) {
     const o = this.#e[t];
     if (o !== void 0) {
-      const r = o.indexOf(n);
-      r >= 0 && o.splice(r, 1);
+      const i = o.indexOf(n);
+      i >= 0 && o.splice(i, 1);
     }
   }
 }
@@ -364,7 +364,7 @@ function ye(e, t) {
     n.group.id === e && t(n);
   });
 }
-function F(e, t) {
+function _(e, t) {
   const n = A.get(e);
   A = new Map(A), A.set(e, t), Ze.emit("groupChange", {
     group: e,
@@ -373,25 +373,25 @@ function F(e, t) {
   });
 }
 function Ct(e, t, n) {
-  let o, r = {
+  let o, i = {
     x: 1 / 0,
     y: 1 / 0
   };
-  for (const a of t) {
-    const u = qe(n, a.rect);
+  for (const s of t) {
+    const l = qe(n, s.rect);
     switch (e) {
       case "horizontal": {
-        u.x <= r.x && (o = a, r = u);
+        l.x <= i.x && (o = s, i = l);
         break;
       }
       case "vertical": {
-        u.y <= r.y && (o = a, r = u);
+        l.y <= i.y && (o = s, i = l);
         break;
       }
     }
   }
   return o ? {
-    distance: r,
+    distance: i,
     hitRegion: o
   } : void 0;
 }
@@ -411,23 +411,23 @@ function Mt(e, t) {
     o,
     "Stacking order can only be calculated for elements with a common ancestor"
   );
-  const r = {
+  const i = {
     a: Ie(Ee(n.a)),
     b: Ie(Ee(n.b))
   };
-  if (r.a === r.b) {
-    const a = o.childNodes, u = {
+  if (i.a === i.b) {
+    const s = o.childNodes, l = {
       a: n.a.at(-1),
       b: n.b.at(-1)
     };
-    let i = a.length;
-    for (; i--; ) {
-      const s = a[i];
-      if (s === u.a) return 1;
-      if (s === u.b) return -1;
+    let r = s.length;
+    for (; r--; ) {
+      const a = s[r];
+      if (a === l.a) return 1;
+      if (a === l.b) return -1;
     }
   }
-  return Math.sign(r.a - r.b);
+  return Math.sign(i.a - i.b);
 }
 const Et = /\b(?:position|zIndex|opacity|transform|webkitTransform|mixBlendMode|filter|webkitFilter|isolation)\b/;
 function It(e) {
@@ -483,18 +483,18 @@ function Tt({
 }
 function ve(e, t) {
   const n = [];
-  return t.forEach((o, r) => {
-    if (r.disabled)
+  return t.forEach((o, i) => {
+    if (i.disabled)
       return;
-    const a = Ye(r), u = Ct(r.orientation, a, {
+    const s = Ye(i), l = Ct(i.orientation, s, {
       x: e.clientX,
       y: e.clientY
     });
-    u && u.distance.x <= 0 && u.distance.y <= 0 && Tt({
-      groupElement: r.element,
-      hitRegion: u.hitRegion.rect,
+    l && l.distance.x <= 0 && l.distance.y <= 0 && Tt({
+      groupElement: i.element,
+      hitRegion: l.hitRegion.rect,
       pointerEventTarget: e.target
-    }) && n.push(u.hitRegion);
+    }) && n.push(l.hitRegion);
   }), n;
 }
 function Ot(e, t) {
@@ -518,36 +518,36 @@ function Y({
   size: o
 }) {
   const {
-    collapsedSize: r = 0,
-    collapsible: a,
-    disabled: u,
-    maxSize: i = 100,
-    minSize: s = 0
+    collapsedSize: i = 0,
+    collapsible: s,
+    disabled: l,
+    maxSize: r = 100,
+    minSize: a = 0
   } = t;
-  if (u && !e)
+  if (l && !e)
     return n;
-  if (G(o, s) < 0)
-    if (a) {
-      const l = (r + s) / 2;
-      G(o, l) < 0 ? o = r : o = s;
+  if (G(o, a) < 0)
+    if (s) {
+      const u = (i + a) / 2;
+      G(o, u) < 0 ? o = i : o = a;
     } else
-      o = s;
-  return o = Math.min(i, o), o = D(o), o;
+      o = a;
+  return o = Math.min(r, o), o = D(o), o;
 }
-function re({
+function se({
   delta: e,
   initialLayout: t,
   panelConstraints: n,
   pivotIndices: o,
-  prevLayout: r,
-  trigger: a
+  prevLayout: i,
+  trigger: s
 }) {
   if (I(e, 0))
     return t;
-  const u = a === "imperative-api", i = Object.values(t), s = Object.values(r), l = [...i], [c, m] = o;
+  const l = s === "imperative-api", r = Object.values(t), a = Object.values(i), u = [...r], [c, m] = o;
   L(c != null, "Invalid first pivot index"), L(m != null, "Invalid second pivot index");
-  let p = 0;
-  switch (a) {
+  let d = 0;
+  switch (s) {
     case "keyboard": {
       {
         const f = e < 0 ? m : c, h = n[f];
@@ -561,13 +561,13 @@ function re({
           minSize: z = 0
         } = h;
         if (y) {
-          const S = i[f];
+          const S = r[f];
           if (L(
             S != null,
             `Previous layout not found for panel index ${f}`
           ), I(S, g)) {
-            const d = z - S;
-            G(d, Math.abs(e)) > 0 && (e = e < 0 ? 0 - d : d);
+            const p = z - S;
+            G(p, Math.abs(e)) > 0 && (e = e < 0 ? 0 - p : p);
           }
         }
       }
@@ -583,13 +583,13 @@ function re({
           minSize: z = 0
         } = h;
         if (y) {
-          const S = i[f];
+          const S = r[f];
           if (L(
             S != null,
             `Previous layout not found for panel index ${f}`
           ), I(S, z)) {
-            const d = S - g;
-            G(d, Math.abs(e)) > 0 && (e = e < 0 ? 0 - d : d);
+            const p = S - g;
+            G(p, Math.abs(e)) > 0 && (e = e < 0 ? 0 - p : p);
           }
         }
       }
@@ -601,14 +601,14 @@ function re({
         h,
         `Panel constraints not found for index ${f}`
       );
-      const g = i[f], { collapsible: y, collapsedSize: z, minSize: S } = h;
+      const g = r[f], { collapsible: y, collapsedSize: z, minSize: S } = h;
       if (y && G(g, S) < 0)
         if (e > 0) {
-          const d = S - z, P = d / 2, R = g + e;
-          G(R, S) < 0 && (e = G(e, P) <= 0 ? 0 : d);
+          const p = S - z, P = p / 2, R = g + e;
+          G(R, S) < 0 && (e = G(e, P) <= 0 ? 0 : p);
         } else {
-          const d = S - z, P = 100 - d / 2, R = g - e;
-          G(R, S) < 0 && (e = G(100 + e, P) > 0 ? 0 : -d);
+          const p = S - z, P = 100 - p / 2, R = g - e;
+          G(R, S) < 0 && (e = G(100 + e, P) > 0 ? 0 : -p);
         }
       break;
     }
@@ -617,18 +617,18 @@ function re({
     const f = e < 0 ? 1 : -1;
     let h = e < 0 ? m : c, g = 0;
     for (; ; ) {
-      const z = i[h];
+      const z = r[h];
       L(
         z != null,
         `Previous layout not found for panel index ${h}`
       );
-      const d = Y({
-        overrideDisabledPanels: u,
+      const p = Y({
+        overrideDisabledPanels: l,
         panelConstraints: n[h],
         prevSize: z,
         size: 100
       }) - z;
-      if (g += d, h += f, h < 0 || h >= n.length)
+      if (g += p, h += f, h < 0 || h >= n.length)
         break;
     }
     const y = Math.min(Math.abs(e), Math.abs(g));
@@ -637,66 +637,66 @@ function re({
   {
     let h = e < 0 ? c : m;
     for (; h >= 0 && h < n.length; ) {
-      const g = Math.abs(e) - Math.abs(p), y = i[h];
+      const g = Math.abs(e) - Math.abs(d), y = r[h];
       L(
         y != null,
         `Previous layout not found for panel index ${h}`
       );
       const z = y - g, S = Y({
-        overrideDisabledPanels: u,
+        overrideDisabledPanels: l,
         panelConstraints: n[h],
         prevSize: y,
         size: z
       });
-      if (!I(y, S) && (p += y - S, l[h] = S, p.toFixed(3).localeCompare(Math.abs(e).toFixed(3), void 0, {
+      if (!I(y, S) && (d += y - S, u[h] = S, d.toFixed(3).localeCompare(Math.abs(e).toFixed(3), void 0, {
         numeric: !0
       }) >= 0))
         break;
       e < 0 ? h-- : h++;
     }
   }
-  if (Ot(s, l))
-    return r;
+  if (Ot(a, u))
+    return i;
   {
-    const f = e < 0 ? m : c, h = i[f];
+    const f = e < 0 ? m : c, h = r[f];
     L(
       h != null,
       `Previous layout not found for panel index ${f}`
     );
-    const g = h + p, y = Y({
-      overrideDisabledPanels: u,
+    const g = h + d, y = Y({
+      overrideDisabledPanels: l,
       panelConstraints: n[f],
       prevSize: h,
       size: g
     });
-    if (l[f] = y, !I(y, g)) {
-      let z = g - y, d = e < 0 ? m : c;
-      for (; d >= 0 && d < n.length; ) {
-        const P = l[d];
+    if (u[f] = y, !I(y, g)) {
+      let z = g - y, p = e < 0 ? m : c;
+      for (; p >= 0 && p < n.length; ) {
+        const P = u[p];
         L(
           P != null,
-          `Previous layout not found for panel index ${d}`
+          `Previous layout not found for panel index ${p}`
         );
         const R = P + z, C = Y({
-          overrideDisabledPanels: u,
-          panelConstraints: n[d],
+          overrideDisabledPanels: l,
+          panelConstraints: n[p],
           prevSize: P,
           size: R
         });
-        if (I(P, C) || (z -= C - P, l[d] = C), I(z, 0))
+        if (I(P, C) || (z -= C - P, u[p] = C), I(z, 0))
           break;
-        e > 0 ? d-- : d++;
+        e > 0 ? p-- : p++;
       }
     }
   }
-  const v = Object.values(l).reduce(
+  const v = Object.values(u).reduce(
     (f, h) => h + f,
     0
   );
   if (!I(v, 100, 0.1))
-    return r;
-  const x = Object.keys(r);
-  return l.reduce((f, h, g) => (f[x[g]] = h, f), {});
+    return i;
+  const x = Object.keys(i);
+  return u.reduce((f, h, g) => (f[x[g]] = h, f), {});
 }
 function j(e, t) {
   if (Object.keys(e).length !== Object.keys(t).length)
@@ -710,107 +710,107 @@ function B({
   layout: e,
   panelConstraints: t
 }) {
-  const n = Object.values(e), o = [...n], r = o.reduce(
-    (i, s) => i + s,
+  const n = Object.values(e), o = [...n], i = o.reduce(
+    (r, a) => r + a,
     0
   );
   if (o.length !== t.length)
     throw Error(
-      `Invalid ${t.length} panel layout: ${o.map((i) => `${i}%`).join(", ")}`
+      `Invalid ${t.length} panel layout: ${o.map((r) => `${r}%`).join(", ")}`
     );
-  if (!I(r, 100) && o.length > 0)
-    for (let i = 0; i < t.length; i++) {
-      const s = o[i];
-      L(s != null, `No layout data found for index ${i}`);
-      const l = 100 / r * s;
-      o[i] = l;
+  if (!I(i, 100) && o.length > 0)
+    for (let r = 0; r < t.length; r++) {
+      const a = o[r];
+      L(a != null, `No layout data found for index ${r}`);
+      const u = 100 / i * a;
+      o[r] = u;
     }
-  let a = 0;
-  for (let i = 0; i < t.length; i++) {
-    const s = n[i];
-    L(s != null, `No layout data found for index ${i}`);
-    const l = o[i];
-    L(l != null, `No layout data found for index ${i}`);
+  let s = 0;
+  for (let r = 0; r < t.length; r++) {
+    const a = n[r];
+    L(a != null, `No layout data found for index ${r}`);
+    const u = o[r];
+    L(u != null, `No layout data found for index ${r}`);
     const c = Y({
       overrideDisabledPanels: !0,
-      panelConstraints: t[i],
-      prevSize: s,
-      size: l
+      panelConstraints: t[r],
+      prevSize: a,
+      size: u
     });
-    l != c && (a += l - c, o[i] = c);
+    u != c && (s += u - c, o[r] = c);
   }
-  if (!I(a, 0))
-    for (let i = 0; i < t.length; i++) {
-      const s = o[i];
-      L(s != null, `No layout data found for index ${i}`);
-      const l = s + a, c = Y({
+  if (!I(s, 0))
+    for (let r = 0; r < t.length; r++) {
+      const a = o[r];
+      L(a != null, `No layout data found for index ${r}`);
+      const u = a + s, c = Y({
         overrideDisabledPanels: !0,
-        panelConstraints: t[i],
-        prevSize: s,
-        size: l
+        panelConstraints: t[r],
+        prevSize: a,
+        size: u
       });
-      if (s !== c && (a -= c - s, o[i] = c, I(a, 0)))
+      if (a !== c && (s -= c - a, o[r] = c, I(s, 0)))
         break;
     }
-  const u = Object.keys(e);
-  return o.reduce((i, s, l) => (i[u[l]] = s, i), {});
+  const l = Object.keys(e);
+  return o.reduce((r, a, u) => (r[l[u]] = a, r), {});
 }
 function et({
   groupId: e,
   panelId: t
 }) {
   const n = () => {
-    const i = U();
+    const r = U();
     for (const [
-      s,
+      a,
       {
-        defaultLayoutDeferred: l,
+        defaultLayoutDeferred: u,
         derivedPanelConstraints: c,
         layout: m,
-        groupSize: p,
+        groupSize: d,
         separatorToPanels: v
       }
-    ] of i)
-      if (s.id === e)
+    ] of r)
+      if (a.id === e)
         return {
-          defaultLayoutDeferred: l,
+          defaultLayoutDeferred: u,
           derivedPanelConstraints: c,
-          group: s,
-          groupSize: p,
+          group: a,
+          groupSize: d,
           layout: m,
           separatorToPanels: v
         };
     throw Error(`Group ${e} not found`);
   }, o = () => {
-    const i = n().derivedPanelConstraints.find(
-      (s) => s.panelId === t
+    const r = n().derivedPanelConstraints.find(
+      (a) => a.panelId === t
     );
-    if (i !== void 0)
-      return i;
+    if (r !== void 0)
+      return r;
     throw Error(`Panel constraints not found for Panel ${t}`);
-  }, r = () => {
-    const i = n().group.panels.find((s) => s.id === t);
-    if (i !== void 0)
-      return i;
+  }, i = () => {
+    const r = n().group.panels.find((a) => a.id === t);
+    if (r !== void 0)
+      return r;
     throw Error(`Layout not found for Panel ${t}`);
-  }, a = () => {
-    const i = n().layout[t];
-    if (i !== void 0)
-      return i;
+  }, s = () => {
+    const r = n().layout[t];
+    if (r !== void 0)
+      return r;
     throw Error(`Layout not found for Panel ${t}`);
-  }, u = (i) => {
-    const s = a();
-    if (i === s)
+  }, l = (r) => {
+    const a = s();
+    if (r === a)
       return;
     const {
-      defaultLayoutDeferred: l,
+      defaultLayoutDeferred: u,
       derivedPanelConstraints: c,
       group: m,
-      groupSize: p,
+      groupSize: d,
       layout: v,
       separatorToPanels: x
-    } = n(), f = m.panels.findIndex((z) => z.id === t), h = f === m.panels.length - 1, g = re({
-      delta: h ? s - i : i - s,
+    } = n(), f = m.panels.findIndex((z) => z.id === t), h = f === m.panels.length - 1, g = se({
+      delta: h ? a - r : r - a,
       initialLayout: v,
       panelConstraints: c,
       pivotIndices: h ? [f - 1, f] : [f, f + 1],
@@ -820,53 +820,44 @@ function et({
       layout: g,
       panelConstraints: c
     });
-    j(v, y) || F(m, {
-      defaultLayoutDeferred: l,
+    j(v, y) || _(m, {
+      defaultLayoutDeferred: u,
       derivedPanelConstraints: c,
-      groupSize: p,
+      groupSize: d,
       layout: y,
       separatorToPanels: x
     });
   };
   return {
     collapse: () => {
-      const { collapsible: i, collapsedSize: s } = o(), { mutableValues: l } = r(), c = a();
-      i && c !== s && (l.expandToSize = c, u(s));
+      const { collapsible: r, collapsedSize: a } = o(), { mutableValues: u } = i(), c = s();
+      r && c !== a && (u.expandToSize = c, l(a));
     },
     expand: () => {
-      const { collapsible: i, collapsedSize: s, minSize: l } = o(), { mutableValues: c } = r(), m = a();
-      if (i && m === s) {
-        let p = c.expandToSize ?? l;
-        p === 0 && (p = 1), u(p);
+      const { collapsible: r, collapsedSize: a, minSize: u } = o(), { mutableValues: c } = i(), m = s();
+      if (r && m === a) {
+        let d = c.expandToSize ?? u;
+        d === 0 && (d = 1), l(d);
       }
     },
     getSize: () => {
-      const { group: i } = n(), s = a(), { element: l } = r(), c = i.orientation === "horizontal" ? l.offsetWidth : l.offsetHeight;
+      const { group: r } = n(), a = s(), { element: u } = i(), c = r.orientation === "horizontal" ? u.offsetWidth : u.offsetHeight;
       return {
-        asPercentage: s,
+        asPercentage: a,
         inPixels: c
       };
     },
     isCollapsed: () => {
-      const { collapsible: i, collapsedSize: s } = o(), l = a();
-      return i && I(s, l);
+      const { collapsible: r, collapsedSize: a } = o(), u = s();
+      return r && I(a, u);
     },
-    resize: (i) => {
-      if (a() !== i) {
-        let l;
-        switch (typeof i) {
-          case "number": {
-            const { group: c } = n(), m = Q({ group: c });
-            l = D(i / m * 100);
-            break;
-          }
-          case "string": {
-            l = parseFloat(i);
-            break;
-          }
-        }
-        u(l);
-      }
+    resize: (r) => {
+      const { group: a } = n(), { element: u } = i(), c = Q({ group: a }), m = te({
+        groupSize: c,
+        panelElement: u,
+        styleProp: r
+      }), d = D(m / c * 100);
+      l(d);
     }
   };
 }
@@ -876,15 +867,15 @@ function De(e) {
   const t = U();
   ve(e, t).forEach((o) => {
     if (o.separator) {
-      const r = o.panels.find(
-        (a) => a.panelConstraints.defaultSize !== void 0
+      const i = o.panels.find(
+        (s) => s.panelConstraints.defaultSize !== void 0
       );
-      if (r) {
-        const a = r.panelConstraints.defaultSize, u = et({
+      if (i) {
+        const s = i.panelConstraints.defaultSize, l = et({
           groupId: o.group.id,
-          panelId: r.id
+          panelId: i.id
         });
-        u && a !== void 0 && (u.resize(a), e.preventDefault());
+        l && s !== void 0 && (l.resize(s), e.preventDefault());
       }
     }
   });
@@ -903,9 +894,9 @@ function tt({
 }) {
   const t = () => {
     const n = U();
-    for (const [o, r] of n)
+    for (const [o, i] of n)
       if (o.id === e)
-        return { group: o, ...r };
+        return { group: o, ...i };
     throw Error(`Could not find Group with id "${e}"`);
   };
   return {
@@ -916,44 +907,44 @@ function tt({
     setLayout(n) {
       const {
         defaultLayoutDeferred: o,
-        derivedPanelConstraints: r,
-        group: a,
-        groupSize: u,
-        layout: i,
-        separatorToPanels: s
-      } = t(), l = B({
+        derivedPanelConstraints: i,
+        group: s,
+        groupSize: l,
+        layout: r,
+        separatorToPanels: a
+      } = t(), u = B({
         layout: n,
-        panelConstraints: r
+        panelConstraints: i
       });
-      return o ? i : (j(i, l) || F(a, {
+      return o ? r : (j(r, u) || _(s, {
         defaultLayoutDeferred: o,
-        derivedPanelConstraints: r,
-        groupSize: u,
-        layout: l,
-        separatorToPanels: s
-      }), l);
+        derivedPanelConstraints: i,
+        groupSize: l,
+        layout: u,
+        separatorToPanels: a
+      }), u);
     }
   };
 }
 function V(e, t) {
-  const n = fe(e), o = $(n.id, !0), r = n.separators.find(
+  const n = fe(e), o = $(n.id, !0), i = n.separators.find(
     (m) => m.element === e
   );
-  L(r, "Matching separator not found");
-  const a = o.separatorToPanels.get(r);
-  L(a, "Matching panels not found");
-  const u = a.map((m) => n.panels.indexOf(m)), s = tt({ groupId: n.id }).getLayout(), l = re({
+  L(i, "Matching separator not found");
+  const s = o.separatorToPanels.get(i);
+  L(s, "Matching panels not found");
+  const l = s.map((m) => n.panels.indexOf(m)), a = tt({ groupId: n.id }).getLayout(), u = se({
     delta: t,
-    initialLayout: s,
+    initialLayout: a,
     panelConstraints: o.derivedPanelConstraints,
-    pivotIndices: u,
-    prevLayout: s,
+    pivotIndices: l,
+    prevLayout: a,
     trigger: "keyboard"
   }), c = B({
-    layout: l,
+    layout: u,
     panelConstraints: o.derivedPanelConstraints
   });
-  j(s, c) || F(n, {
+  j(a, c) || _(n, {
     defaultLayoutDeferred: o.defaultLayoutDeferred,
     derivedPanelConstraints: o.derivedPanelConstraints,
     groupSize: o.groupSize,
@@ -989,31 +980,31 @@ function Te(e) {
       }
       case "Enter": {
         e.preventDefault();
-        const o = fe(t), r = $(o.id, !0), { derivedPanelConstraints: a, layout: u, separatorToPanels: i } = r, s = o.separators.find(
-          (p) => p.element === t
+        const o = fe(t), i = $(o.id, !0), { derivedPanelConstraints: s, layout: l, separatorToPanels: r } = i, a = o.separators.find(
+          (d) => d.element === t
         );
-        L(s, "Matching separator not found");
-        const l = i.get(s);
-        L(l, "Matching panels not found");
-        const c = l[0], m = a.find(
-          (p) => p.panelId === c.id
+        L(a, "Matching separator not found");
+        const u = r.get(a);
+        L(u, "Matching panels not found");
+        const c = u[0], m = s.find(
+          (d) => d.panelId === c.id
         );
         if (L(m, "Panel metadata not found"), m.collapsible) {
-          const p = u[c.id], v = m.collapsedSize === p ? o.mutableState.expandedPanelSizes[c.id] ?? m.minSize : m.collapsedSize;
-          V(t, v - p);
+          const d = l[c.id], v = m.collapsedSize === d ? o.mutableState.expandedPanelSizes[c.id] ?? m.minSize : m.collapsedSize;
+          V(t, v - d);
         }
         break;
       }
       case "F6": {
         e.preventDefault();
-        const r = fe(t).separators.map(
-          (s) => s.element
-        ), a = Array.from(r).findIndex(
-          (s) => s === e.currentTarget
+        const i = fe(t).separators.map(
+          (a) => a.element
+        ), s = Array.from(i).findIndex(
+          (a) => a === e.currentTarget
         );
-        L(a !== null, "Index not found");
-        const u = e.shiftKey ? a > 0 ? a - 1 : r.length - 1 : a + 1 < r.length ? a + 1 : 0;
-        r[u].focus({
+        L(s !== null, "Index not found");
+        const l = e.shiftKey ? s > 0 ? s - 1 : i.length - 1 : s + 1 < i.length ? s + 1 : 0;
+        i[l].focus({
           preventScroll: !0
         });
         break;
@@ -1055,13 +1046,13 @@ function Oe(e) {
   if (e.pointerType === "mouse" && e.button > 0)
     return;
   const t = U(), n = ve(e, t), o = /* @__PURE__ */ new Map();
-  let r = !1;
-  n.forEach((a) => {
-    a.separator && (r || (r = !0, a.separator.element.focus({
+  let i = !1;
+  n.forEach((s) => {
+    s.separator && (i || (i = !0, s.separator.element.focus({
       preventScroll: !0
     })));
-    const u = t.get(a.group);
-    u && o.set(a.group, u.layout);
+    const l = t.get(s.group);
+    l && o.set(s.group, l.layout);
   }), Z({
     cursorFlags: 0,
     hitRegions: n,
@@ -1076,67 +1067,67 @@ let ce;
 function Ne() {
   return ce === void 0 && (ce = !1, typeof window < "u" && (window.navigator.userAgent.includes("Chrome") || window.navigator.userAgent.includes("Firefox")) && (ce = !0)), ce;
 }
-function Ft({
+function _t({
   cursorFlags: e,
   groups: t,
   state: n
 }) {
-  let o = 0, r = 0;
+  let o = 0, i = 0;
   switch (n) {
     case "active":
     case "hover":
-      t.forEach((a) => {
-        if (!a.mutableState.disableCursor)
-          switch (a.orientation) {
+      t.forEach((s) => {
+        if (!s.mutableState.disableCursor)
+          switch (s.orientation) {
             case "horizontal": {
               o++;
               break;
             }
             case "vertical": {
-              r++;
+              i++;
               break;
             }
           }
       });
   }
-  if (!(o === 0 && r === 0)) {
+  if (!(o === 0 && i === 0)) {
     switch (n) {
       case "active": {
         if (e && Ne()) {
-          const a = (e & nt) !== 0, u = (e & ot) !== 0, i = (e & it) !== 0, s = (e & rt) !== 0;
-          if (a)
-            return i ? "se-resize" : s ? "ne-resize" : "e-resize";
-          if (u)
-            return i ? "sw-resize" : s ? "nw-resize" : "w-resize";
-          if (i)
-            return "s-resize";
+          const s = (e & nt) !== 0, l = (e & ot) !== 0, r = (e & it) !== 0, a = (e & rt) !== 0;
           if (s)
+            return r ? "se-resize" : a ? "ne-resize" : "e-resize";
+          if (l)
+            return r ? "sw-resize" : a ? "nw-resize" : "w-resize";
+          if (r)
+            return "s-resize";
+          if (a)
             return "n-resize";
         }
         break;
       }
     }
-    return Ne() ? o > 0 && r > 0 ? "move" : o > 0 ? "ew-resize" : "ns-resize" : o > 0 && r > 0 ? "grab" : o > 0 ? "col-resize" : "row-resize";
+    return Ne() ? o > 0 && i > 0 ? "move" : o > 0 ? "ew-resize" : "ns-resize" : o > 0 && i > 0 ? "grab" : o > 0 ? "col-resize" : "row-resize";
   }
 }
-const Fe = /* @__PURE__ */ new WeakMap();
+const _e = /* @__PURE__ */ new WeakMap();
 function be(e) {
   if (e.defaultView === null || e.defaultView === void 0)
     return;
-  let { prevStyle: t, styleSheet: n } = Fe.get(e) ?? {};
+  let { prevStyle: t, styleSheet: n } = _e.get(e) ?? {};
   n === void 0 && (n = new e.defaultView.CSSStyleSheet(), e.adoptedStyleSheets && e.adoptedStyleSheets.push(n));
   const o = W();
   switch (o.state) {
     case "active":
     case "hover": {
-      const r = Ft({
+      const i = _t({
         cursorFlags: o.cursorFlags,
-        groups: o.hitRegions.map((u) => u.group),
+        groups: o.hitRegions.map((l) => l.group),
         state: o.state
-      }), a = `*, *:hover {cursor: ${r} !important; }`;
-      if (t === a)
+      }), s = `*, *:hover {cursor: ${i} !important; }`;
+      if (t === s)
         return;
-      t = a, r ? n.cssRules.length === 0 ? n.insertRule(a) : n.replaceSync(a) : n.cssRules.length === 1 && n.deleteRule(0);
+      t = s, i ? n.cssRules.length === 0 ? n.insertRule(s) : n.replaceSync(s) : n.cssRules.length === 1 && n.deleteRule(0);
       break;
     }
     case "inactive": {
@@ -1144,58 +1135,58 @@ function be(e) {
       break;
     }
   }
-  Fe.set(e, {
+  _e.set(e, {
     prevStyle: t,
     styleSheet: n
   });
 }
-function at({
+function st({
   document: e,
   event: t,
   hitRegions: n,
   initialLayoutMap: o,
-  mountedGroups: r,
-  pointerDownAtPoint: a,
-  prevCursorFlags: u
+  mountedGroups: i,
+  pointerDownAtPoint: s,
+  prevCursorFlags: l
 }) {
-  let i = 0;
-  n.forEach((l) => {
-    const { group: c, groupSize: m } = l, { orientation: p, panels: v } = c, { disableCursor: x } = c.mutableState;
+  let r = 0;
+  n.forEach((u) => {
+    const { group: c, groupSize: m } = u, { orientation: d, panels: v } = c, { disableCursor: x } = c.mutableState;
     let f = 0;
-    a ? p === "horizontal" ? f = (t.clientX - a.x) / m * 100 : f = (t.clientY - a.y) / m * 100 : p === "horizontal" ? f = t.clientX < 0 ? -100 : 100 : f = t.clientY < 0 ? -100 : 100;
-    const h = o.get(c), g = r.get(c);
+    s ? d === "horizontal" ? f = (t.clientX - s.x) / m * 100 : f = (t.clientY - s.y) / m * 100 : d === "horizontal" ? f = t.clientX < 0 ? -100 : 100 : f = t.clientY < 0 ? -100 : 100;
+    const h = o.get(c), g = i.get(c);
     if (!h || !g)
       return;
     const {
       defaultLayoutDeferred: y,
       derivedPanelConstraints: z,
       groupSize: S,
-      layout: d,
+      layout: p,
       separatorToPanels: P
     } = g;
-    if (z && d && P) {
-      const R = re({
+    if (z && p && P) {
+      const R = se({
         delta: f,
         initialLayout: h,
         panelConstraints: z,
-        pivotIndices: l.panels.map((C) => v.indexOf(C)),
-        prevLayout: d,
+        pivotIndices: u.panels.map((C) => v.indexOf(C)),
+        prevLayout: p,
         trigger: "mouse-or-touch"
       });
-      if (j(R, d)) {
+      if (j(R, p)) {
         if (f !== 0 && !x)
-          switch (p) {
+          switch (d) {
             case "horizontal": {
-              i |= f < 0 ? nt : ot;
+              r |= f < 0 ? nt : ot;
               break;
             }
             case "vertical": {
-              i |= f < 0 ? it : rt;
+              r |= f < 0 ? it : rt;
               break;
             }
           }
       } else
-        F(l.group, {
+        _(u.group, {
           defaultLayoutDeferred: y,
           derivedPanelConstraints: z,
           groupSize: S,
@@ -1204,14 +1195,14 @@ function at({
         });
     }
   });
-  let s = 0;
-  t.movementX === 0 ? s |= u & Ge : s |= i & Ge, t.movementY === 0 ? s |= u & Ae : s |= i & Ae, At(s), be(e);
+  let a = 0;
+  t.movementX === 0 ? a |= l & Ge : a |= r & Ge, t.movementY === 0 ? a |= l & Ae : a |= r & Ae, At(a), be(e);
 }
-function _e(e) {
+function Fe(e) {
   const t = U(), n = W();
   switch (n.state) {
     case "active":
-      at({
+      st({
         document: e.currentTarget,
         event: e,
         hitRegions: n.hitRegions,
@@ -1235,12 +1226,17 @@ function $e(e) {
           cursorFlags: 0,
           state: "inactive"
         }), t.hitRegions.forEach((o) => {
-          const r = $(o.group.id, !0);
-          F(o.group, r);
+          const i = $(o.group.id, !0);
+          _(o.group, i);
         });
         return;
       }
-      at({
+      for (const o of t.hitRegions)
+        if (o.separator) {
+          const { element: i } = o.separator;
+          i.hasPointerCapture?.(e.pointerId) || i.setPointerCapture?.(e.pointerId);
+        }
+      st({
         document: e.currentTarget,
         event: e,
         hitRegions: t.hitRegions,
@@ -1288,39 +1284,39 @@ function Ve(e) {
         state: "inactive"
       }), t.hitRegions.length > 0 && (be(e.currentTarget), t.hitRegions.forEach((n) => {
         const o = $(n.group.id, !0);
-        F(n.group, o);
+        _(n.group, o);
       }), e.preventDefault());
   }
 }
 function je(e) {
   let t = 0, n = 0;
   const o = {};
-  for (const a of e)
-    if (a.defaultSize !== void 0) {
+  for (const s of e)
+    if (s.defaultSize !== void 0) {
       t++;
-      const u = D(a.defaultSize);
-      n += u, o[a.panelId] = u;
+      const l = D(s.defaultSize);
+      n += l, o[s.panelId] = l;
     } else
-      o[a.panelId] = void 0;
-  const r = e.length - t;
-  if (r !== 0) {
-    const a = D((100 - n) / r);
-    for (const u of e)
-      u.defaultSize === void 0 && (o[u.panelId] = a);
+      o[s.panelId] = void 0;
+  const i = e.length - t;
+  if (i !== 0) {
+    const s = D((100 - n) / i);
+    for (const l of e)
+      l.defaultSize === void 0 && (o[l.panelId] = s);
   }
   return o;
 }
-function _t(e, t, n) {
+function Ft(e, t, n) {
   if (!n[0])
     return;
-  const r = e.panels.find((l) => l.element === t);
-  if (!r || !r.onResize)
+  const i = e.panels.find((u) => u.element === t);
+  if (!i || !i.onResize)
     return;
-  const a = Q({ group: e }), u = e.orientation === "horizontal" ? r.element.offsetWidth : r.element.offsetHeight, i = r.mutableValues.prevSize, s = {
-    asPercentage: D(u / a * 100),
-    inPixels: u
+  const s = Q({ group: e }), l = e.orientation === "horizontal" ? i.element.offsetWidth : i.element.offsetHeight, r = i.mutableValues.prevSize, a = {
+    asPercentage: D(l / s * 100),
+    inPixels: l
   };
-  r.mutableValues.prevSize = s, r.onResize(s, r.id, i);
+  i.mutableValues.prevSize = a, i.onResize(a, i.id, r);
 }
 function $t(e, t) {
   if (Object.keys(e).length !== Object.keys(t).length)
@@ -1338,53 +1334,53 @@ function Ht({
 }) {
   if (n <= 0 || t <= 0 || n === t)
     return o;
-  let r = 0, a = 0, u = !1;
-  const i = /* @__PURE__ */ new Map(), s = [];
+  let i = 0, s = 0, l = !1;
+  const r = /* @__PURE__ */ new Map(), a = [];
   for (const m of e.panels) {
-    const p = o[m.id] ?? 0;
+    const d = o[m.id] ?? 0;
     switch (m.panelConstraints.groupResizeBehavior) {
       case "preserve-pixel-size": {
-        u = !0;
-        const v = p / 100 * n, x = D(
+        l = !0;
+        const v = d / 100 * n, x = D(
           v / t * 100
         );
-        i.set(m.id, x), r += x;
+        r.set(m.id, x), i += x;
         break;
       }
       case "preserve-relative-size":
       default: {
-        s.push(m.id), a += p;
+        a.push(m.id), s += d;
         break;
       }
     }
   }
-  if (!u || s.length === 0)
+  if (!l || a.length === 0)
     return o;
-  const l = 100 - r, c = { ...o };
-  if (i.forEach((m, p) => {
-    c[p] = m;
-  }), a > 0)
-    for (const m of s) {
-      const p = o[m] ?? 0;
+  const u = 100 - i, c = { ...o };
+  if (r.forEach((m, d) => {
+    c[d] = m;
+  }), s > 0)
+    for (const m of a) {
+      const d = o[m] ?? 0;
       c[m] = D(
-        p / a * l
+        d / s * u
       );
     }
   else {
     const m = D(
-      l / s.length
+      u / a.length
     );
-    for (const p of s)
-      c[p] = m;
+    for (const d of a)
+      c[d] = m;
   }
   return c;
 }
 function Vt(e, t) {
-  const n = e.map((r) => r.id), o = Object.keys(t);
+  const n = e.map((i) => i.id), o = Object.keys(t);
   if (n.length !== o.length)
     return !1;
-  for (const r of n)
-    if (!o.includes(r))
+  for (const i of n)
+    if (!o.includes(i))
       return !1;
   return !0;
 }
@@ -1395,7 +1391,7 @@ function jt(e) {
     e.element.ownerDocument.defaultView,
     "Cannot register an unmounted Group"
   );
-  const n = e.element.ownerDocument.defaultView.ResizeObserver, o = /* @__PURE__ */ new Set(), r = /* @__PURE__ */ new Set(), a = new n((f) => {
+  const n = e.element.ownerDocument.defaultView.ResizeObserver, o = /* @__PURE__ */ new Set(), i = /* @__PURE__ */ new Set(), s = new n((f) => {
     for (const h of f) {
       const { borderBoxSize: g, target: y } = h;
       if (y === e.element) {
@@ -1406,82 +1402,82 @@ function jt(e) {
           const S = $(e.id);
           if (!S)
             return;
-          const d = ge(e), P = S.defaultLayoutDeferred ? je(d) : S.layout, R = Ht({
+          const p = ge(e), P = S.defaultLayoutDeferred ? je(p) : S.layout, R = Ht({
             group: e,
             nextGroupSize: z,
             prevGroupSize: S.groupSize,
             prevLayout: P
           }), C = B({
             layout: R,
-            panelConstraints: d
+            panelConstraints: p
           });
           if (!S.defaultLayoutDeferred && j(S.layout, C) && $t(
             S.derivedPanelConstraints,
-            d
+            p
           ) && S.groupSize === z)
             return;
-          F(e, {
+          _(e, {
             defaultLayoutDeferred: !1,
-            derivedPanelConstraints: d,
+            derivedPanelConstraints: p,
             groupSize: z,
             layout: C,
             separatorToPanels: S.separatorToPanels
           });
         }
       } else
-        _t(e, y, g);
+        Ft(e, y, g);
     }
   });
-  a.observe(e.element), e.panels.forEach((f) => {
+  s.observe(e.element), e.panels.forEach((f) => {
     L(
       !o.has(f.id),
       `Panel ids must be unique; id "${f.id}" was used more than once`
-    ), o.add(f.id), f.onResize && a.observe(f.element);
+    ), o.add(f.id), f.onResize && s.observe(f.element);
   });
-  const u = Q({ group: e }), i = ge(e), s = e.panels.map(({ id: f }) => f).join(",");
-  let l = e.mutableState.defaultLayout;
-  l && (Vt(e.panels, l) || (l = void 0));
-  const c = e.mutableState.layouts[s] ?? l ?? je(i), m = B({
+  const l = Q({ group: e }), r = ge(e), a = e.panels.map(({ id: f }) => f).join(",");
+  let u = e.mutableState.defaultLayout;
+  u && (Vt(e.panels, u) || (u = void 0));
+  const c = e.mutableState.layouts[a] ?? u ?? je(r), m = B({
     layout: c,
-    panelConstraints: i
-  }), p = e.element.ownerDocument;
+    panelConstraints: r
+  }), d = e.element.ownerDocument;
   q.set(
-    p,
-    (q.get(p) ?? 0) + 1
+    d,
+    (q.get(d) ?? 0) + 1
   );
   const v = /* @__PURE__ */ new Map();
   return Ye(e).forEach((f) => {
     f.separator && v.set(f.separator, f.panels);
-  }), F(e, {
-    defaultLayoutDeferred: u === 0,
-    derivedPanelConstraints: i,
-    groupSize: u,
+  }), _(e, {
+    defaultLayoutDeferred: l === 0,
+    derivedPanelConstraints: r,
+    groupSize: l,
     layout: m,
     separatorToPanels: v
   }), e.separators.forEach((f) => {
     L(
-      !r.has(f.id),
+      !i.has(f.id),
       `Separator ids must be unique; id "${f.id}" was used more than once`
-    ), r.add(f.id), f.element.addEventListener("keydown", Te);
-  }), q.get(p) === 1 && (p.addEventListener("dblclick", De, !0), p.addEventListener("pointerdown", Oe, !0), p.addEventListener("pointerleave", _e), p.addEventListener("pointermove", $e), p.addEventListener("pointerout", He), p.addEventListener("pointerup", Ve, !0)), function() {
+    ), i.add(f.id), f.element.addEventListener("keydown", Te);
+  }), q.get(d) === 1 && (d.addEventListener("dblclick", De, !0), d.addEventListener("pointerdown", Oe, !0), d.addEventListener("pointerleave", Fe), d.addEventListener("pointermove", $e), d.addEventListener("pointerout", He), d.addEventListener("pointerup", Ve, !0)), function() {
     t = !1, q.set(
-      p,
-      Math.max(0, (q.get(p) ?? 0) - 1)
+      d,
+      Math.max(0, (q.get(d) ?? 0) - 1)
     ), Lt(e), e.separators.forEach((h) => {
       h.element.removeEventListener("keydown", Te);
-    }), q.get(p) || (p.removeEventListener(
+    }), q.get(d) || (d.removeEventListener(
       "dblclick",
       De,
       !0
-    ), p.removeEventListener(
+    ), d.removeEventListener(
       "pointerdown",
       Oe,
       !0
-    ), p.removeEventListener("pointerleave", _e), p.removeEventListener("pointermove", $e), p.removeEventListener("pointerout", He), p.removeEventListener("pointerup", Ve, !0)), a.disconnect();
+    ), d.removeEventListener("pointerleave", Fe), d.removeEventListener("pointermove", $e), d.removeEventListener("pointerout", He), d.removeEventListener("pointerup", Ve, !0)), s.disconnect();
   };
 }
 function Bt() {
-  const [e, t] = ie({}), n = te(() => t({}), []);
+  const [e, t] = re({}), n = ne(() => t({}), []);
   return [e, n];
 }
 function xe(e) {
@@ -1489,17 +1485,17 @@ function xe(e) {
   return `${e ?? t}`;
 }
 const K = typeof window < "u" ? Be : de;
-function ne(e) {
+function oe(e) {
   const t = T(e);
   return K(() => {
     t.current = e;
-  }, [e]), te(
+  }, [e]), ne(
     (...n) => t.current?.(...n),
     [t]
   );
 }
 function we(...e) {
-  return ne((t) => {
+  return oe((t) => {
     e.forEach((n) => {
       if (n)
         switch (typeof n) {
@@ -1522,7 +1518,7 @@ function Pe(e) {
       t.current[n] = e[n];
   }, [e]), t.current;
 }
-const st = ht(null);
+const at = ht(null);
 function Wt(e, t) {
   const n = T({
     getLayout: () => ({}),
@@ -1540,36 +1536,36 @@ function Ut({
   className: t,
   defaultLayout: n,
   disableCursor: o,
-  disabled: r,
-  elementRef: a,
-  groupRef: u,
-  id: i,
-  onLayoutChange: s,
-  onLayoutChanged: l,
+  disabled: i,
+  elementRef: s,
+  groupRef: l,
+  id: r,
+  onLayoutChange: a,
+  onLayoutChanged: u,
   orientation: c = "horizontal",
   resizeTargetMinimumSize: m = {
     coarse: 20,
     fine: 10
   },
-  style: p,
+  style: d,
   ...v
 }) {
   const x = T({
     onLayoutChange: {},
     onLayoutChanged: {}
-  }), f = ne((b) => {
-    j(x.current.onLayoutChange, b) || (x.current.onLayoutChange = b, s?.(b));
-  }), h = ne((b) => {
-    j(x.current.onLayoutChanged, b) || (x.current.onLayoutChanged = b, l?.(b));
-  }), g = xe(i), y = T(null), [z, S] = Bt(), d = T({
+  }), f = oe((b) => {
+    j(x.current.onLayoutChange, b) || (x.current.onLayoutChange = b, a?.(b));
+  }), h = oe((b) => {
+    j(x.current.onLayoutChanged, b) || (x.current.onLayoutChanged = b, u?.(b));
+  }), g = xe(r), y = T(null), [z, S] = Bt(), p = T({
     lastExpandedPanelSizes: {},
     layouts: {},
     panels: [],
     resizeTargetMinimumSize: m,
     separators: []
-  }), P = we(y, a);
-  Wt(g, u);
-  const R = ne(
+  }), P = we(y, s);
+  Wt(g, l);
+  const R = oe(
     (b, w) => {
       const E = W(), M = Me(b), k = $(b);
       if (k) {
@@ -1603,7 +1599,7 @@ function Ut({
       id: g,
       orientation: c,
       registerPanel: (b) => {
-        const w = d.current;
+        const w = p.current;
         return w.panels = Se(c, [
           ...w.panels,
           b
@@ -1614,7 +1610,7 @@ function Ut({
         };
       },
       registerSeparator: (b) => {
-        const w = d.current;
+        const w = p.current;
         return w.separators = Se(c, [
           ...w.separators,
           b
@@ -1625,30 +1621,30 @@ function Ut({
         };
       },
       togglePanelDisabled: (b, w) => {
-        const M = d.current.panels.find(
+        const M = p.current.panels.find(
           (H) => H.id === b
         );
         M && (M.panelConstraints.disabled = w);
         const k = Me(g), O = $(g);
-        k && O && F(k, {
+        k && O && _(k, {
           ...O,
           derivedPanelConstraints: ge(k)
         });
       },
       toggleSeparatorDisabled: (b, w) => {
-        const M = d.current.separators.find(
+        const M = p.current.separators.find(
           (k) => k.id === b
         );
         M && (M.disabled = w);
       }
     }),
     [R, g, S, c, C]
-  ), _ = T(null);
+  ), F = T(null);
   return K(() => {
     const b = y.current;
     if (b === null)
       return;
-    const w = d.current;
+    const w = p.current;
     let E;
     if (C.defaultLayout !== void 0 && Object.keys(C.defaultLayout).length === w.panels.length) {
       E = {};
@@ -1658,35 +1654,35 @@ function Ut({
       }
     }
     const M = {
-      disabled: !!r,
+      disabled: !!i,
       element: b,
       id: g,
       mutableState: {
         defaultLayout: E,
         disableCursor: !!C.disableCursor,
-        expandedPanelSizes: d.current.lastExpandedPanelSizes,
-        layouts: d.current.layouts
+        expandedPanelSizes: p.current.lastExpandedPanelSizes,
+        layouts: p.current.layouts
       },
       orientation: c,
       panels: w.panels,
       resizeTargetMinimumSize: w.resizeTargetMinimumSize,
       separators: w.separators
     };
-    _.current = M;
+    F.current = M;
     const k = jt(M), { defaultLayoutDeferred: O, derivedPanelConstraints: H, layout: Ce } = $(M.id, !0);
     !O && H.length > 0 && (f(Ce), h(Ce));
     const lt = ye(g, (ee) => {
-      const { defaultLayoutDeferred: ae, derivedPanelConstraints: Re, layout: se } = ee.next;
+      const { defaultLayoutDeferred: ae, derivedPanelConstraints: Re, layout: le } = ee.next;
       if (ae || Re.length === 0)
         return;
       const ut = M.panels.map(({ id: N }) => N).join(",");
-      M.mutableState.layouts[ut] = se, Re.forEach((N) => {
+      M.mutableState.layouts[ut] = le, Re.forEach((N) => {
         if (N.collapsible) {
           const { layout: pe } = ee.prev ?? {};
           if (pe) {
             const ft = I(
               N.collapsedSize,
-              se[N.panelId]
+              le[N.panelId]
             ), dt = I(
               N.collapsedSize,
               pe[N.panelId]
@@ -1696,13 +1692,13 @@ function Ut({
         }
       });
       const ct = W().state !== "active";
-      f(se), ct && h(se);
+      f(le), ct && h(le);
     });
     return () => {
-      _.current = null, k(), lt();
+      F.current = null, k(), lt();
     };
   }, [
-    r,
+    i,
     g,
     h,
     f,
@@ -1710,9 +1706,9 @@ function Ut({
     z,
     C
   ]), de(() => {
-    const b = _.current;
+    const b = F.current;
     b && (b.mutableState.defaultLayout = n, b.mutableState.disableCursor = !!o);
-  }), /* @__PURE__ */ oe(st.Provider, { value: X, children: /* @__PURE__ */ oe(
+  }), /* @__PURE__ */ ie(at.Provider, { value: X, children: /* @__PURE__ */ ie(
     "div",
     {
       ...v,
@@ -1725,7 +1721,7 @@ function Ut({
         height: "100%",
         width: "100%",
         overflow: "hidden",
-        ...p,
+        ...d,
         display: "flex",
         flexDirection: c === "horizontal" ? "row" : "column",
         flexWrap: "nowrap",
@@ -1749,35 +1745,35 @@ function nn({
   storage: n = localStorage,
   ...o
 }) {
-  const r = t !== void 0, a = "id" in o ? o.id : o.groupId, u = me(a, t ?? []), i = Ke(
+  const i = t !== void 0, s = "id" in o ? o.id : o.groupId, l = me(s, t ?? []), r = Ke(
     Kt,
-    () => n.getItem(u),
-    () => n.getItem(u)
-  ), s = Ue(
-    () => i ? JSON.parse(i) : void 0,
-    [i]
-  ), l = T(null), c = te(() => {
-    const v = l.current;
-    v && (l.current = null, clearTimeout(v));
+    () => n.getItem(l),
+    () => n.getItem(l)
+  ), a = Ue(
+    () => r ? JSON.parse(r) : void 0,
+    [r]
+  ), u = T(null), c = ne(() => {
+    const v = u.current;
+    v && (u.current = null, clearTimeout(v));
   }, []);
   Be(() => () => {
     c();
   }, [c]);
-  const m = te(
+  const m = ne(
     (v) => {
       c();
       let x;
-      r ? x = me(a, Object.keys(v)) : x = me(a, []);
+      i ? x = me(s, Object.keys(v)) : x = me(s, []);
       try {
         n.setItem(x, JSON.stringify(v));
       } catch (f) {
         console.error(f);
       }
     },
-    [c, r, a, n]
-  ), p = te(
+    [c, i, s, n]
+  ), d = ne(
     (v) => {
-      c(), e === 0 ? m(v) : l.current = setTimeout(() => {
+      c(), e === 0 ? m(v) : u.current = setTimeout(() => {
         m(v);
       }, e);
     },
@@ -1787,13 +1783,13 @@ function nn({
     /**
      * Pass this value to `Group` as the `defaultLayout` prop.
      */
-    defaultLayout: s,
+    defaultLayout: a,
     /**
      * Attach this callback on the `Group` as the `onLayoutChange` prop.
      *
      * @deprecated Use the {@link onLayoutChanged} prop instead.
      */
-    onLayoutChange: p,
+    onLayoutChange: d,
     /**
      * Attach this callback on the `Group` as the `onLayoutChanged` prop.
      */
@@ -1805,13 +1801,13 @@ function Kt() {
   };
 }
 function on() {
-  return ie(null);
+  return re(null);
 }
 function rn() {
   return T(null);
 }
 function Le() {
-  const e = mt(st);
+  const e = mt(at);
   return L(
     e,
     "Group Context not found; did you render a Panel or Separator outside of a Group?"
@@ -1840,29 +1836,29 @@ function qt({
   className: t,
   collapsedSize: n = "0%",
   collapsible: o = !1,
-  defaultSize: r,
-  disabled: a,
-  elementRef: u,
-  groupResizeBehavior: i = "preserve-relative-size",
-  id: s,
-  maxSize: l = "100%",
+  defaultSize: i,
+  disabled: s,
+  elementRef: l,
+  groupResizeBehavior: r = "preserve-relative-size",
+  id: a,
+  maxSize: u = "100%",
   minSize: c = "0%",
   onResize: m,
-  panelRef: p,
+  panelRef: d,
   style: v,
   ...x
 }) {
-  const f = !!s, h = xe(s), g = Pe({
-    disabled: a
-  }), y = T(null), z = we(y, u), {
+  const f = !!a, h = xe(a), g = Pe({
+    disabled: s
+  }), y = T(null), z = we(y, l), {
     getPanelStyles: S,
-    id: d,
+    id: p,
     orientation: P,
     registerPanel: R,
     togglePanelDisabled: C
-  } = Le(), X = m !== null, _ = ne(
+  } = Le(), X = m !== null, F = oe(
     (w, E, M) => {
-      m?.(w, s, M);
+      m?.(w, a, M);
     }
   );
   K(() => {
@@ -1876,47 +1872,47 @@ function qt({
           expandToSize: void 0,
           prevSize: void 0
         },
-        onResize: X ? _ : void 0,
+        onResize: X ? F : void 0,
         panelConstraints: {
-          groupResizeBehavior: i,
+          groupResizeBehavior: r,
           collapsedSize: n,
           collapsible: o,
-          defaultSize: r,
+          defaultSize: i,
           disabled: g.disabled,
-          maxSize: l,
+          maxSize: u,
           minSize: c
         }
       };
       return R(E);
     }
   }, [
-    i,
+    r,
     n,
     o,
-    r,
+    i,
     X,
     h,
     f,
-    l,
+    u,
     c,
-    _,
+    F,
     R,
     g
   ]), de(() => {
-    C(h, !!a);
-  }, [a, h, C]), Xt(h, p);
+    C(h, !!s);
+  }, [s, h, C]), Xt(h, d);
   const b = Ke(
-    (w) => ye(d, w),
+    (w) => ye(p, w),
     // useSyncExternalStore does not support a custom equality check
     // stringify avoids re-rendering when the style value hasn't changed
-    () => JSON.stringify(S(d, h)),
-    () => JSON.stringify(S(d, h))
+    () => JSON.stringify(S(p, h)),
+    () => JSON.stringify(S(p, h))
   );
-  return /* @__PURE__ */ oe(
+  return /* @__PURE__ */ ie(
     "div",
     {
       ...x,
-      "aria-disabled": a || void 0,
+      "aria-disabled": s || void 0,
       "data-panel": !0,
       "data-testid": h,
       id: h,
@@ -1929,7 +1925,7 @@ function qt({
         overflow: "visible",
         ...JSON.parse(b)
       },
-      children: /* @__PURE__ */ oe(
+      children: /* @__PURE__ */ ie(
         "div",
         {
           className: t,
@@ -1964,10 +1960,10 @@ const Yt = {
   padding: 0,
   margin: 0
 };
-function an() {
-  return ie(null);
-}
 function sn() {
+  return re(null);
+}
+function an() {
   return T(null);
 }
 function Jt({
@@ -1976,24 +1972,24 @@ function Jt({
   panelId: n,
   panelIndex: o
 }) {
-  let r, a;
-  const u = e[n], i = t.find(
-    (s) => s.panelId === n
+  let i, s;
+  const l = e[n], r = t.find(
+    (a) => a.panelId === n
   );
-  if (i) {
-    const s = i.maxSize, l = i.collapsible ? i.collapsedSize : i.minSize, c = [o, o + 1];
-    a = B({
-      layout: re({
-        delta: l - u,
+  if (r) {
+    const a = r.maxSize, u = r.collapsible ? r.collapsedSize : r.minSize, c = [o, o + 1];
+    s = B({
+      layout: se({
+        delta: u - l,
         initialLayout: e,
         panelConstraints: t,
         pivotIndices: c,
         prevLayout: e
       }),
       panelConstraints: t
-    })[n], r = B({
-      layout: re({
-        delta: s - u,
+    })[n], i = B({
+      layout: se({
+        delta: a - l,
         initialLayout: e,
         panelConstraints: t,
         pivotIndices: c,
@@ -2004,9 +2000,9 @@ function Jt({
   }
   return {
     valueControls: n,
-    valueMax: r,
-    valueMin: a,
-    valueNow: u
+    valueMax: i,
+    valueMin: s,
+    valueNow: l
   };
 }
 function Zt({
@@ -2014,13 +2010,13 @@ function Zt({
   className: t,
   disabled: n,
   elementRef: o,
-  id: r,
-  style: a,
-  ...u
+  id: i,
+  style: s,
+  ...l
 }) {
-  const i = xe(r), s = Pe({
+  const r = xe(i), a = Pe({
     disabled: n
-  }), [l, c] = ie({}), [m, p] = ie("inactive"), v = T(null), x = we(v, o), {
+  }), [u, c] = re({}), [m, d] = re("inactive"), v = T(null), x = we(v, o), {
     disableCursor: f,
     id: h,
     orientation: g,
@@ -2031,18 +2027,18 @@ function Zt({
     const P = v.current;
     if (P !== null) {
       const R = {
-        disabled: s.disabled,
+        disabled: a.disabled,
         element: P,
-        id: i
+        id: r
       }, C = y(R), X = Gt(
         (b) => {
-          p(
+          d(
             b.next.state !== "inactive" && b.next.hitRegions.some(
               (w) => w.separator === R
             ) ? b.next.state : "inactive"
           );
         }
-      ), _ = ye(
+      ), F = ye(
         h,
         (b) => {
           const { derivedPanelConstraints: w, layout: E, separatorToPanels: M } = b.next, k = M.get(R);
@@ -2060,34 +2056,34 @@ function Zt({
         }
       );
       return () => {
-        X(), _(), C();
+        X(), F(), C();
       };
     }
-  }, [h, i, y, s]), de(() => {
-    z(i, !!n);
-  }, [n, i, z]);
-  let d;
-  return n && !f && (d = "not-allowed"), /* @__PURE__ */ oe(
+  }, [h, r, y, a]), de(() => {
+    z(r, !!n);
+  }, [n, r, z]);
+  let p;
+  return n && !f && (p = "not-allowed"), /* @__PURE__ */ ie(
     "div",
     {
-      ...u,
-      "aria-controls": l.valueControls,
+      ...l,
+      "aria-controls": u.valueControls,
       "aria-disabled": n || void 0,
       "aria-orientation": S,
-      "aria-valuemax": l.valueMax,
-      "aria-valuemin": l.valueMin,
-      "aria-valuenow": l.valueNow,
+      "aria-valuemax": u.valueMax,
+      "aria-valuemin": u.valueMin,
+      "aria-valuenow": u.valueNow,
       children: e,
       className: t,
       "data-separator": n ? "disabled" : m,
-      "data-testid": i,
-      id: i,
+      "data-testid": r,
+      id: r,
       ref: x,
       role: "separator",
       style: {
         flexBasis: "auto",
-        cursor: d,
-        ...a,
+        cursor: p,
+        ...s,
         flexGrow: 0,
         flexShrink: 0,
         // Inform the browser that the library is handling touch events for this element
@@ -2107,7 +2103,7 @@ export {
   nn as useDefaultLayout,
   on as useGroupCallbackRef,
   rn as useGroupRef,
-  an as usePanelCallbackRef,
-  sn as usePanelRef
+  sn as usePanelCallbackRef,
+  an as usePanelRef
 };
 //# sourceMappingURL=react-resizable-panels.js.map