react-resizable-panels 4.0.0-alpha.4 → 4.0.0-alpha.5

package/dist/react-resizable-panels.js

@@ -5,7 +5,7 @@ function S(e, t = "Assertion error") {
   if (!e)
     throw Error(t);
 }
-function se(e, t) {
+function re(e, t) {
   return t.sort(
     e === "horizontal" ? He : je
   );
@@ -19,54 +19,54 @@ function je(e, t) {
   return n !== 0 ? n : e.element.offsetHeight - t.element.offsetHeight;
 }
 function be(e) {
-  const { element: t, orientation: n, panels: o, separators: s } = e, r = se(
+  const { element: t, orientation: n, panels: o, separators: r } = e, s = re(
     n,
     Array.from(t.children).filter((l) => l instanceof HTMLElement).map((l) => ({ element: l }))
-  ).map(({ element: l }) => l), c = [];
+  ).map(({ element: l }) => l), u = [];
   let i, a;
-  for (const l of r) {
+  for (const l of s) {
     const f = o.find(
-      (u) => u.element === l
+      (c) => c.element === l
     );
     if (f) {
       if (i) {
-        const u = i.element.getBoundingClientRect(), m = l.getBoundingClientRect();
-        c.push({
+        const c = i.element.getBoundingClientRect(), m = l.getBoundingClientRect();
+        u.push({
           group: e,
           panels: [i, f],
           separator: a,
           rect: n === "horizontal" ? new DOMRect(
-            u.right,
+            c.right,
             m.top,
-            m.left - u.right,
+            m.left - c.right,
             m.height
           ) : new DOMRect(
             m.left,
-            u.bottom,
+            c.bottom,
             m.width,
-            m.top - u.bottom
+            m.top - c.bottom
           )
         });
       }
       i = f, a = void 0;
     } else {
-      const u = s.find(
+      const c = r.find(
         (m) => m.element === l
       );
-      u ? a = u : (i = void 0, a = void 0);
+      c ? a = c : (i = void 0, a = void 0);
     }
   }
-  return c;
+  return u;
 }
 function We(e, t) {
   const n = getComputedStyle(e), o = parseFloat(n.fontSize);
   return t * o;
 }
-function Ue(e, t) {
+function Be(e, t) {
   const n = getComputedStyle(e.ownerDocument.body), o = parseFloat(n.fontSize);
   return t * o;
 }
-function Be(e) {
+function Ue(e) {
   return e / 100 * window.innerHeight;
 }
 function Ke(e) {
@@ -88,30 +88,30 @@ function J({
   styleProp: n
 }) {
   let o;
-  const [s, r] = Ve(n);
-  switch (r) {
+  const [r, s] = Ve(n);
+  switch (s) {
     case "%": {
-      o = s / 100 * e;
+      o = r / 100 * e;
       break;
     }
     case "px": {
-      o = s;
+      o = r;
       break;
     }
     case "rem": {
-      o = Ue(t, s);
+      o = Be(t, r);
       break;
     }
     case "em": {
-      o = We(t, s);
+      o = We(t, r);
       break;
     }
     case "vh": {
-      o = Be(s);
+      o = Ue(r);
       break;
     }
     case "vw": {
-      o = Ke(s);
+      o = Ke(r);
       break;
     }
   }
@@ -120,55 +120,55 @@ function J({
 function I(e) {
   return parseFloat(e.toFixed(3));
 }
-function ce({
+function ue({
   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 me(e) {
-  const { panels: t } = e, n = ce({ group: e });
+  const { panels: t } = e, n = ue({ group: e });
   return t.map((o) => {
-    const { element: s, panelConstraints: r } = o;
-    let c = 0;
-    if (r.collapsedSize) {
+    const { element: r, panelConstraints: s } = o;
+    let u = 0;
+    if (s.collapsedSize) {
       const f = J({
         groupSize: n,
-        panelElement: s,
-        styleProp: r.collapsedSize
+        panelElement: r,
+        styleProp: s.collapsedSize
       });
-      c = I(f / n * 100);
+      u = I(f / n * 100);
     }
     let i;
-    if (r.defaultSize) {
+    if (s.defaultSize) {
       const f = J({
         groupSize: n,
-        panelElement: s,
-        styleProp: r.defaultSize
+        panelElement: r,
+        styleProp: s.defaultSize
       });
       i = I(f / n * 100);
     }
     let a = 0;
-    if (r.minSize) {
+    if (s.minSize) {
       const f = J({
         groupSize: n,
-        panelElement: s,
-        styleProp: r.minSize
+        panelElement: r,
+        styleProp: s.minSize
       });
       a = I(f / n * 100);
     }
     let l = 100;
-    if (r.maxSize) {
+    if (s.maxSize) {
       const f = J({
         groupSize: n,
-        panelElement: s,
-        styleProp: r.maxSize
+        panelElement: r,
+        styleProp: s.maxSize
       });
       l = I(f / n * 100);
     }
     return {
-      collapsedSize: c,
-      collapsible: r.collapsible === !0,
+      collapsedSize: u,
+      collapsible: s.collapsible === !0,
       defaultSize: i,
       minSize: a,
       maxSize: l,
@@ -190,18 +190,18 @@ class qe {
       if (o.length === 1)
         o[0].call(null, n);
       else {
-        let s = !1, r = null;
-        const c = Array.from(o);
-        for (let i = 0; i < c.length; i++) {
-          const a = c[i];
+        let r = !1, s = null;
+        const u = Array.from(o);
+        for (let i = 0; i < u.length; i++) {
+          const a = u[i];
           try {
             a.call(null, n);
           } catch (l) {
-            r === null && (s = !0, r = l);
+            s === null && (r = !0, s = l);
           }
         }
-        if (s)
-          throw r;
+        if (r)
+          throw s;
       }
   }
   removeAllListeners() {
@@ -210,8 +210,8 @@ class qe {
   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);
     }
   }
 }
@@ -229,7 +229,7 @@ const A = new qe();
 function O() {
   return C;
 }
-function M(e) {
+function R(e) {
   const t = typeof e == "function" ? e(C) : e;
   if (C === t)
     return C;
@@ -237,19 +237,19 @@ function M(e) {
   return C = {
     ...C,
     ...t
-  }, t.cursorFlags !== void 0 && A.emit("cursorFlagsChange", C.cursorFlags), t.interactionState !== void 0 && A.emit("interactionStateChange", C.interactionState), t.mountedGroups !== void 0 && (C.mountedGroups.forEach((o, s) => {
-    o.derivedPanelConstraints.forEach((r) => {
-      if (r.collapsible) {
-        const { layout: c } = n.mountedGroups.get(s) ?? {};
-        if (c) {
+  }, t.cursorFlags !== void 0 && A.emit("cursorFlagsChange", C.cursorFlags), t.interactionState !== void 0 && A.emit("interactionStateChange", C.interactionState), t.mountedGroups !== void 0 && (C.mountedGroups.forEach((o, r) => {
+    o.derivedPanelConstraints.forEach((s) => {
+      if (s.collapsible) {
+        const { layout: u } = n.mountedGroups.get(r) ?? {};
+        if (u) {
           const i = w(
-            r.collapsedSize,
-            o.layout[r.panelId]
+            s.collapsedSize,
+            o.layout[s.panelId]
           ), a = w(
-            r.collapsedSize,
-            c[r.panelId]
+            s.collapsedSize,
+            u[s.panelId]
           );
-          i && !a && (s.inMemoryLastExpandedPanelSizes[r.panelId] = c[r.panelId]);
+          i && !a && (r.inMemoryLastExpandedPanelSizes[s.panelId] = u[s.panelId]);
         }
       }
     });
@@ -273,31 +273,31 @@ function F({
   const {
     collapsedSize: n = 0,
     collapsible: o,
-    maxSize: s = 100,
-    minSize: r = 0
+    maxSize: r = 100,
+    minSize: s = 0
   } = e;
-  if (W(t, r) < 0)
+  if (W(t, s) < 0)
     if (o) {
-      const c = (n + r) / 2;
-      W(t, c) < 0 ? t = n : t = r;
+      const u = (n + s) / 2;
+      W(t, u) < 0 ? t = n : t = s;
     } else
-      t = r;
-  return t = Math.min(s, t), t = I(t), t;
+      t = s;
+  return t = Math.min(r, t), t = I(t), t;
 }
-function U({
+function B({
   delta: e,
   initialLayout: t,
   panelConstraints: n,
   pivotIndices: o,
-  prevLayout: s,
-  trigger: r
+  prevLayout: r,
+  trigger: s
 }) {
   if (w(e, 0))
     return t;
-  const c = Object.values(t), i = Object.values(s), a = [...c], [l, f] = o;
+  const u = Object.values(t), i = Object.values(r), a = [...u], [l, f] = o;
   S(l != null, "Invalid first pivot index"), S(f != null, "Invalid second pivot index");
-  let u = 0;
-  if (r === "keyboard") {
+  let c = 0;
+  if (s === "keyboard") {
     {
       const d = e < 0 ? f : l, p = n[d];
       S(
@@ -310,13 +310,13 @@ function U({
         minSize: z = 0
       } = p;
       if (v) {
-        const x = c[d];
+        const x = u[d];
         if (S(
           x != null,
           `Previous layout not found for panel index ${d}`
         ), w(x, h)) {
-          const g = z - x;
-          W(g, Math.abs(e)) > 0 && (e = e < 0 ? 0 - g : g);
+          const y = z - x;
+          W(y, Math.abs(e)) > 0 && (e = e < 0 ? 0 - y : y);
         }
       }
     }
@@ -332,13 +332,13 @@ function U({
         minSize: z = 0
       } = p;
       if (v) {
-        const x = c[d];
+        const x = u[d];
         if (S(
           x != null,
           `Previous layout not found for panel index ${d}`
         ), w(x, z)) {
-          const g = x - h;
-          W(g, Math.abs(e)) > 0 && (e = e < 0 ? 0 - g : g);
+          const y = x - h;
+          W(y, Math.abs(e)) > 0 && (e = e < 0 ? 0 - y : y);
         }
       }
     }
@@ -347,16 +347,16 @@ function U({
     const d = e < 0 ? 1 : -1;
     let p = e < 0 ? f : l, h = 0;
     for (; ; ) {
-      const z = c[p];
+      const z = u[p];
       S(
         z != null,
         `Previous layout not found for panel index ${p}`
       );
-      const g = F({
+      const y = F({
         panelConstraints: n[p],
         size: 100
       }) - z;
-      if (h += g, p += d, p < 0 || p >= n.length)
+      if (h += y, p += d, p < 0 || p >= n.length)
         break;
     }
     const v = Math.min(Math.abs(e), Math.abs(h));
@@ -365,7 +365,7 @@ function U({
   {
     let p = e < 0 ? l : f;
     for (; p >= 0 && p < n.length; ) {
-      const h = Math.abs(e) - Math.abs(u), v = c[p];
+      const h = Math.abs(e) - Math.abs(c), v = u[p];
       S(
         v != null,
         `Previous layout not found for panel index ${p}`
@@ -374,7 +374,7 @@ function U({
         panelConstraints: n[p],
         size: z
       });
-      if (!w(v, x) && (u += v - x, a[p] = x, u.toFixed(3).localeCompare(Math.abs(e).toFixed(3), void 0, {
+      if (!w(v, x) && (c += v - x, a[p] = x, c.toFixed(3).localeCompare(Math.abs(e).toFixed(3), void 0, {
         numeric: !0
       }) >= 0))
         break;
@@ -382,32 +382,32 @@ function U({
     }
   }
   if (Xe(i, a))
-    return s;
+    return r;
   {
-    const d = e < 0 ? f : l, p = c[d];
+    const d = e < 0 ? f : l, p = u[d];
     S(
       p != null,
       `Previous layout not found for panel index ${d}`
     );
-    const h = p + u, v = F({
+    const h = p + c, v = F({
       panelConstraints: n[d],
       size: h
     });
     if (a[d] = v, !w(v, h)) {
-      let z = h - v, g = e < 0 ? f : l;
-      for (; g >= 0 && g < n.length; ) {
-        const L = a[g];
+      let z = h - v, y = e < 0 ? f : l;
+      for (; y >= 0 && y < n.length; ) {
+        const P = a[y];
         S(
-          L != null,
-          `Previous layout not found for panel index ${g}`
+          P != null,
+          `Previous layout not found for panel index ${y}`
         );
-        const P = L + z, E = F({
-          panelConstraints: n[g],
-          size: P
+        const L = P + z, E = F({
+          panelConstraints: n[y],
+          size: L
         });
-        if (w(L, E) || (z -= E - L, a[g] = E), w(z, 0))
+        if (w(P, E) || (z -= E - P, a[y] = E), w(z, 0))
           break;
-        e > 0 ? g-- : g++;
+        e > 0 ? y-- : y++;
       }
     }
   }
@@ -416,9 +416,9 @@ function U({
     0
   );
   if (!w(m, 100, 0.1))
-    return s;
-  const y = Object.keys(s);
-  return a.reduce((d, p, h) => (d[y[h]] = p, d), {});
+    return r;
+  const g = Object.keys(r);
+  return a.reduce((d, p, h) => (d[g[h]] = p, d), {});
 }
 function te(e) {
   const t = e.parentElement;
@@ -429,7 +429,7 @@ function te(e) {
       return o;
   throw Error("Could not find parent Group for separator element");
 }
-function B(e, t) {
+function U(e, t) {
   if (Object.keys(e).length !== Object.keys(t).length)
     return !1;
   for (const n in e)
@@ -441,7 +441,7 @@ function $({
   layout: e,
   panelConstraints: t
 }) {
-  const o = [...Object.values(e)], s = o.reduce(
+  const o = [...Object.values(e)], r = o.reduce(
     (i, a) => i + a,
     0
   );
@@ -449,14 +449,14 @@ function $({
     throw Error(
       `Invalid ${t.length} panel layout: ${o.map((i) => `${i}%`).join(", ")}`
     );
-  if (!w(s, 100) && o.length > 0)
+  if (!w(r, 100) && o.length > 0)
     for (let i = 0; i < t.length; i++) {
       const a = o[i];
       S(a != null, `No layout data found for index ${i}`);
-      const l = 100 / s * a;
+      const l = 100 / r * a;
       o[i] = l;
     }
-  let r = 0;
+  let s = 0;
   for (let i = 0; i < t.length; i++) {
     const a = o[i];
     S(a != null, `No layout data found for index ${i}`);
@@ -464,30 +464,30 @@ function $({
       panelConstraints: t[i],
       size: a
     });
-    a != l && (r += a - l, o[i] = l);
+    a != l && (s += a - l, o[i] = l);
   }
-  if (!w(r, 0))
+  if (!w(s, 0))
     for (let i = 0; i < t.length; i++) {
       const a = o[i];
       S(a != null, `No layout data found for index ${i}`);
-      const l = a + r, f = F({
+      const l = a + s, f = F({
         panelConstraints: t[i],
         size: l
       });
-      if (a !== f && (r -= f - a, o[i] = f, w(r, 0)))
+      if (a !== f && (s -= f - a, o[i] = f, w(s, 0)))
         break;
     }
-  const c = Object.keys(e);
-  return o.reduce((i, a, l) => (i[c[l]] = a, i), {});
+  const u = Object.keys(e);
+  return o.reduce((i, a, l) => (i[u[l]] = a, i), {});
 }
 function we({
   groupId: e
 }) {
   const t = () => {
     const { mountedGroups: n } = O();
-    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(`Group ${e} not found`);
   };
   return {
@@ -498,47 +498,47 @@ function we({
     setLayout(n) {
       const {
         derivedPanelConstraints: o,
-        group: s,
-        layout: r,
-        separatorToPanels: c
+        group: r,
+        layout: s,
+        separatorToPanels: u
       } = t(), i = $({
         layout: n,
         panelConstraints: o
       });
-      return B(r, i) || M((a) => ({
-        mountedGroups: new Map(a.mountedGroups).set(s, {
+      return U(s, i) || R((a) => ({
+        mountedGroups: new Map(a.mountedGroups).set(r, {
           derivedPanelConstraints: o,
           layout: i,
-          separatorToPanels: c
+          separatorToPanels: u
         })
       })), i;
     }
   };
 }
-function Le(e) {
+function Pe(e) {
   const { mountedGroups: t } = O(), n = t.get(e);
   return S(n, `Mounted Group ${e.id} not found`), n;
 }
 function D(e, t) {
-  const n = te(e), o = Le(n), s = n.separators.find(
-    (u) => u.element === e
+  const n = te(e), o = Pe(n), r = n.separators.find(
+    (c) => c.element === e
   );
-  S(s, "Matching separator not found");
-  const r = o.separatorToPanels.get(s);
-  S(r, "Matching panels not found");
-  const c = r.map((u) => n.panels.indexOf(u)), a = we({ groupId: n.id }).getLayout(), l = U({
+  S(r, "Matching separator not found");
+  const s = o.separatorToPanels.get(r);
+  S(s, "Matching panels not found");
+  const u = s.map((c) => n.panels.indexOf(c)), a = we({ groupId: n.id }).getLayout(), l = B({
     delta: t,
     initialLayout: a,
     panelConstraints: o.derivedPanelConstraints,
-    pivotIndices: c,
+    pivotIndices: u,
     prevLayout: a,
     trigger: "keyboard"
   }), f = $({
     layout: l,
     panelConstraints: o.derivedPanelConstraints
   });
-  B(a, f) || M((u) => ({
-    mountedGroups: new Map(u.mountedGroups).set(n, {
+  U(a, f) || R((c) => ({
+    mountedGroups: new Map(c.mountedGroups).set(n, {
       derivedPanelConstraints: o.derivedPanelConstraints,
       layout: f,
       separatorToPanels: o.separatorToPanels
@@ -573,31 +573,31 @@ function he(e) {
       }
       case "Enter": {
         e.preventDefault();
-        const o = te(t), { derivedPanelConstraints: s, layout: r, separatorToPanels: c } = Le(o), i = o.separators.find(
-          (u) => u.element === t
+        const o = te(t), { derivedPanelConstraints: r, layout: s, separatorToPanels: u } = Pe(o), i = o.separators.find(
+          (c) => c.element === t
         );
         S(i, "Matching separator not found");
-        const a = c.get(i);
+        const a = u.get(i);
         S(a, "Matching panels not found");
-        const l = a[0], f = s.find(
-          (u) => u.panelId === l.id
+        const l = a[0], f = r.find(
+          (c) => c.panelId === l.id
         );
         if (S(f, "Panel metadata not found"), f.collapsible) {
-          const u = r[l.id], m = f.collapsedSize === u ? o.inMemoryLastExpandedPanelSizes[l.id] ?? f.minSize : f.collapsedSize;
-          D(t, m - u);
+          const c = s[l.id], m = f.collapsedSize === c ? o.inMemoryLastExpandedPanelSizes[l.id] ?? f.minSize : f.collapsedSize;
+          D(t, m - c);
         }
         break;
       }
       case "F6": {
         e.preventDefault();
-        const s = te(t).separators.map(
+        const r = te(t).separators.map(
           (a) => a.element
-        ), r = Array.from(s).findIndex(
+        ), s = Array.from(r).findIndex(
           (a) => a === e.currentTarget
         );
-        S(r !== null, "Index not found");
-        const c = e.shiftKey ? r > 0 ? r - 1 : s.length - 1 : r + 1 < s.length ? r + 1 : 0;
-        s[c].focus();
+        S(s !== null, "Index not found");
+        const u = e.shiftKey ? s > 0 ? s - 1 : r.length - 1 : s + 1 < r.length ? s + 1 : 0;
+        r[u].focus();
         break;
       }
       case "Home": {
@@ -607,7 +607,7 @@ function he(e) {
     }
 }
 const Ye = (e) => e, ie = () => {
-}, Pe = 1, Ee = 2, Ce = 4, Me = 8, ve = {
+}, Le = 1, Ee = 2, Ce = 4, Re = 8, ve = {
   coarse: 10,
   precise: 5
 };
@@ -624,25 +624,25 @@ function Ze(e, t) {
   };
 }
 function Je(e, t, n) {
-  let o, s = {
+  let o, r = {
     x: 1 / 0,
     y: 1 / 0
   };
-  for (const r of t) {
-    const c = Ze(n, r.rect);
+  for (const s of t) {
+    const u = Ze(n, s.rect);
     switch (e) {
       case "horizontal": {
-        c.x <= s.x && (o = r, s = c);
+        u.x <= r.x && (o = s, r = u);
         break;
       }
       case "vertical": {
-        c.y <= s.y && (o = r, s = c);
+        u.y <= r.y && (o = s, r = u);
         break;
       }
     }
   }
   return o ? {
-    distance: s,
+    distance: r,
     hitRegion: o
   } : void 0;
 }
@@ -650,32 +650,32 @@ let Q;
 function Qe() {
   return Q === void 0 && (typeof matchMedia == "function" ? Q = !!matchMedia("(pointer:coarse)").matches : Q = !1), Q;
 }
-function Re(e, t) {
+function Me(e, t) {
   const n = [];
-  return t.forEach((o, s) => {
-    if (s.disabled)
+  return t.forEach((o, r) => {
+    if (r.disabled)
       return;
-    const r = Qe() ? ve.coarse : ve.precise, c = be(s), i = Je(s.orientation, c, {
+    const s = Qe() ? ve.coarse : ve.precise, u = be(r), i = Je(r.orientation, u, {
       x: e.clientX,
       y: e.clientY
     });
-    i && i.distance.x <= r && i.distance.y <= r && n.push(i.hitRegion);
+    i && i.distance.x <= s && i.distance.y <= s && n.push(i.hitRegion);
   }), n;
 }
-function ye(e) {
+function ge(e) {
   if (e.defaultPrevented)
     return;
-  const { mountedGroups: t } = O(), n = Re(e, t), o = /* @__PURE__ */ new Set(), s = /* @__PURE__ */ new Set(), r = /* @__PURE__ */ new Set(), c = /* @__PURE__ */ new Map();
+  const { mountedGroups: t } = O(), n = Me(e, t), o = /* @__PURE__ */ new Set(), r = /* @__PURE__ */ new Set(), s = /* @__PURE__ */ new Set(), u = /* @__PURE__ */ new Map();
   n.forEach((i) => {
     o.add(i.group), i.panels.forEach((l) => {
-      s.add(l);
-    }), i.separator && r.add(i.separator);
+      r.add(l);
+    }), i.separator && s.add(i.separator);
     const a = t.get(i.group);
-    a && c.set(i.group, a.layout);
-  }), M({
+    a && u.set(i.group, a.layout);
+  }), R({
     interactionState: {
       hitRegions: n,
-      initialLayoutMap: c,
+      initialLayoutMap: u,
       pointerDownAtPoint: { x: e.clientX, y: e.clientY },
       state: "active"
     }
@@ -686,33 +686,33 @@ function et({
   groups: t,
   state: n
 }) {
-  let o = 0, s = 0;
+  let o = 0, r = 0;
   switch (n) {
     case "active":
     case "hover":
-      t.forEach((r) => {
-        if (!r.disableCursor)
-          switch (r.orientation) {
+      t.forEach((s) => {
+        if (!s.disableCursor)
+          switch (s.orientation) {
             case "horizontal": {
               o++;
               break;
             }
             case "vertical": {
-              s++;
+              r++;
               break;
             }
           }
       });
   }
-  if (o === 0 && s === 0)
+  if (o === 0 && r === 0)
     return null;
   switch (n) {
     case "active": {
-      const r = (e & Pe) !== 0, c = (e & Ee) !== 0, i = (e & Ce) !== 0, a = (e & Me) !== 0;
+      const s = (e & Le) !== 0, u = (e & Ee) !== 0, i = (e & Ce) !== 0, a = (e & Re) !== 0;
       if (e) {
-        if (r)
+        if (s)
           return i ? "se-resize" : a ? "ne-resize" : "e-resize";
-        if (c)
+        if (u)
           return i ? "sw-resize" : a ? "nw-resize" : "w-resize";
         if (i)
           return "s-resize";
@@ -722,9 +722,9 @@ function et({
       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 = null, k;
+let se = null, k;
 function ae() {
   k === void 0 && (k = new CSSStyleSheet(), document.adoptedStyleSheets = [k]);
   const { cursorFlags: e, interactionState: t } = O();
@@ -736,13 +736,13 @@ function ae() {
         groups: t.hitRegions.map((o) => o.group),
         state: t.state
       });
-      if (re === n)
+      if (se === n)
         return;
-      re = n, n ? k.cssRules.length === 0 ? k.insertRule(`*{cursor: ${n} !important;}`) : k.replaceSync(`*{cursor: ${n} !important;}`) : k.cssRules.length === 1 && k.deleteRule(0);
+      se = n, n ? k.cssRules.length === 0 ? k.insertRule(`*{cursor: ${n} !important;}`) : k.replaceSync(`*{cursor: ${n} !important;}`) : k.cssRules.length === 1 && k.deleteRule(0);
       break;
     }
     case "inactive": {
-      re = null, k.cssRules.length === 1 && k.deleteRule(0);
+      se = null, k.cssRules.length === 1 && k.deleteRule(0);
       break;
     }
   }
@@ -757,8 +757,8 @@ function ee(e) {
         // Skip this check for "pointerleave" events, else Firefox triggers a false positive (see #514)
         e.type !== "pointerleave" && e.buttons === 0
       ) {
-        M(
-          (r) => r.interactionState.state === "inactive" ? r : {
+        R(
+          (s) => s.interactionState.state === "inactive" ? s : {
             cursorFlags: 0,
             interactionState: {
               state: "inactive"
@@ -768,60 +768,60 @@ function ee(e) {
         return;
       }
       let o = 0;
-      const s = new Map(n);
-      t.hitRegions.forEach((r) => {
-        const { disableCursor: c, element: i, orientation: a, panels: l } = r.group;
+      const r = new Map(n);
+      t.hitRegions.forEach((s) => {
+        const { disableCursor: u, element: i, orientation: a, panels: l } = s.group;
         let f = 0;
         t.state === "active" && (a === "horizontal" ? f = (e.clientX - t.pointerDownAtPoint.x) / i.offsetWidth * 100 : f = (e.clientY - t.pointerDownAtPoint.y) / i.offsetHeight * 100);
-        const u = t.initialLayoutMap.get(
-          r.group
+        const c = t.initialLayoutMap.get(
+          s.group
         ), {
           derivedPanelConstraints: m,
-          layout: y,
+          layout: g,
           separatorToPanels: d
-        } = n.get(r.group) ?? {};
-        if (m && u && y && d) {
-          const p = U({
+        } = n.get(s.group) ?? {};
+        if (m && c && g && d) {
+          const p = B({
             delta: f,
-            initialLayout: u,
+            initialLayout: c,
             panelConstraints: m,
-            pivotIndices: r.panels.map((h) => l.indexOf(h)),
-            prevLayout: y,
+            pivotIndices: s.panels.map((h) => l.indexOf(h)),
+            prevLayout: g,
             trigger: "mouse-or-touch"
           });
-          if (B(p, y)) {
-            if (f !== 0 && !c)
+          if (U(p, g)) {
+            if (f !== 0 && !u)
               switch (a) {
                 case "horizontal": {
-                  o |= f < 0 ? Pe : Ee;
+                  o |= f < 0 ? Le : Ee;
                   break;
                 }
                 case "vertical": {
-                  o |= f < 0 ? Ce : Me;
+                  o |= f < 0 ? Ce : Re;
                   break;
                 }
               }
           } else {
-            s.set(r.group, {
+            r.set(s.group, {
               derivedPanelConstraints: m,
               layout: p,
               separatorToPanels: d
             });
-            const h = r.group.panels.map(({ id: v }) => v).join(",");
-            r.group.inMemoryLayouts[h] = p;
+            const h = s.group.panels.map(({ id: v }) => v).join(",");
+            s.group.inMemoryLayouts[h] = p;
           }
         }
-      }), M({
+      }), R({
         cursorFlags: o,
-        mountedGroups: s
+        mountedGroups: r
       }), ae();
       break;
     }
     default: {
-      const o = Re(e, n);
-      o.length === 0 ? t.state !== "inactive" && M({
+      const o = Me(e, n);
+      o.length === 0 ? t.state !== "inactive" && R({
         interactionState: { state: "inactive" }
-      }) : M({
+      }) : R({
         interactionState: {
           hitRegions: o,
           state: "hover"
@@ -831,14 +831,14 @@ function ee(e) {
     }
   }
 }
-function ge(e) {
+function ye(e) {
   if (e.defaultPrevented)
     return;
   e.preventDefault();
   const { interactionState: t } = O();
   switch (t.state) {
     case "active":
-      M({
+      R({
         cursorFlags: 0,
         interactionState: {
           state: "inactive"
@@ -849,18 +849,18 @@ function ge(e) {
 function tt(e) {
   let t = 0, n = 0;
   const o = {};
-  for (const r of e)
-    if (r.defaultSize !== void 0) {
+  for (const s of e)
+    if (s.defaultSize !== void 0) {
       t++;
-      const c = I(r.defaultSize);
-      n += c, o[r.panelId] = c;
+      const u = I(s.defaultSize);
+      n += u, o[s.panelId] = u;
     } else
-      o[r.panelId] = void 0;
-  const s = e.length - t;
-  if (s !== 0) {
-    const r = I((100 - n) / s);
-    for (const c of e)
-      c.defaultSize === void 0 && (o[c.panelId] = r);
+      o[s.panelId] = void 0;
+  const r = e.length - t;
+  if (r !== 0) {
+    const s = I((100 - n) / r);
+    for (const u of e)
+      u.defaultSize === void 0 && (o[u.panelId] = s);
   }
   return o;
 }
@@ -868,18 +868,18 @@ function nt(e, t, n) {
   const o = n[0];
   if (!o)
     return;
-  const s = e.panels.find((c) => c.element === t);
-  if (!s || !s.onResize)
+  const r = e.panels.find((u) => u.element === t);
+  if (!r || !r.onResize)
     return;
-  const r = ce({ group: e });
-  s.onResize(
+  const s = ue({ group: e });
+  r.onResize(
     {
       asPercentage: I(
-        o.inlineSize / r * 100
+        o.inlineSize / s * 100
       ),
       inPixels: o.inlineSize
     },
-    s.id
+    r.id
   );
 }
 function ot(e) {
@@ -888,10 +888,10 @@ function ot(e) {
     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((u) => {
-    for (const m of u) {
-      const { borderBoxSize: y, target: d } = m;
-      d === e.element ? t && M((p) => {
+  const n = /* @__PURE__ */ new Set(), o = /* @__PURE__ */ new Set(), r = new ResizeObserver((c) => {
+    for (const m of c) {
+      const { borderBoxSize: g, target: d } = m;
+      d === e.element ? t && R((p) => {
         const h = p.mountedGroups.get(e);
         if (h) {
           const v = me(e), z = h.layout, x = $({
@@ -907,44 +907,44 @@ function ot(e) {
           };
         }
         return p;
-      }) : nt(e, d, y);
+      }) : nt(e, d, g);
     }
   });
-  s.observe(e.element), e.panels.forEach((u) => {
+  r.observe(e.element), e.panels.forEach((c) => {
     S(
-      !n.has(u.id),
-      `Panel ids must be unique; id "${u.id}" was used more than once`
-    ), n.add(u.id), u.onResize && s.observe(u.element);
+      !n.has(c.id),
+      `Panel ids must be unique; id "${c.id}" was used more than once`
+    ), n.add(c.id), c.onResize && r.observe(c.element);
   });
-  const r = me(e), c = e.panels.map(({ id: u }) => u).join(","), i = e.inMemoryLayouts[c] ?? e.defaultLayout ?? tt(r), a = $({
+  const s = me(e), u = e.panels.map(({ id: c }) => c).join(","), i = e.inMemoryLayouts[u] ?? e.defaultLayout ?? tt(s), a = $({
     layout: i,
-    panelConstraints: r
-  }), l = be(e), f = M((u) => ({
-    mountedGroups: new Map(u.mountedGroups).set(e, {
-      derivedPanelConstraints: r,
+    panelConstraints: s
+  }), l = be(e), f = R((c) => ({
+    mountedGroups: new Map(c.mountedGroups).set(e, {
+      derivedPanelConstraints: s,
       layout: a,
       separatorToPanels: new Map(
         l.filter((m) => m.separator).map((m) => [m.separator, m.panels])
       )
     })
   }));
-  return e.separators.forEach((u) => {
+  return e.separators.forEach((c) => {
     S(
-      !o.has(u.id),
-      `Separator ids must be unique; id "${u.id}" was used more than once`
-    ), o.add(u.id), u.element.addEventListener("keydown", he);
-  }), f.mountedGroups.size === 1 && (window.addEventListener("pointerdown", ye), window.addEventListener("pointerleave", ee), window.addEventListener("pointermove", ee), window.addEventListener("pointerup", ge)), function() {
+      !o.has(c.id),
+      `Separator ids must be unique; id "${c.id}" was used more than once`
+    ), o.add(c.id), c.element.addEventListener("keydown", he);
+  }), f.mountedGroups.size === 1 && (window.addEventListener("pointerdown", ge), window.addEventListener("pointerleave", ee), window.addEventListener("pointermove", ee), window.addEventListener("pointerup", ye)), function() {
     t = !1;
-    const m = M((y) => {
-      const d = new Map(y.mountedGroups);
+    const m = R((g) => {
+      const d = new Map(g.mountedGroups);
       return d.delete(e), { mountedGroups: d };
     });
-    e.separators.forEach((y) => {
-      y.element.removeEventListener("keydown", he);
-    }), m.mountedGroups.size === 0 && (window.removeEventListener("pointerdown", ye), window.removeEventListener("pointerleave", ee), window.removeEventListener("pointermove", ee), window.removeEventListener("pointerup", ge)), s.disconnect();
+    e.separators.forEach((g) => {
+      g.element.removeEventListener("keydown", he);
+    }), m.mountedGroups.size === 0 && (window.removeEventListener("pointerdown", ge), window.removeEventListener("pointerleave", ee), window.removeEventListener("pointermove", ee), window.removeEventListener("pointerup", ye)), r.disconnect();
   };
 }
-function ue(e) {
+function ce(e) {
   const t = De();
   return `${e ?? t}`;
 }
@@ -990,56 +990,56 @@ function it(e, t) {
     );
   });
 }
-function dt({
+function pt({
   children: e,
   className: t,
   defaultLayout: n,
   disableCursor: o,
-  disabled: s,
-  elementRef: r,
-  groupRef: c,
+  disabled: r,
+  elementRef: s,
+  groupRef: u,
   id: i,
   onLayoutChange: a,
   orientation: l = "horizontal",
   style: f,
-  ...u
+  ...c
 }) {
-  const m = T({}), y = fe((b) => {
-    B(m.current, b) || (m.current = b, a?.(b));
-  }), d = ue(i), [p, h] = G(!1), [v, z] = G(null), [x, g] = G(n ?? {}), [L, P] = G([]), [E, K] = G([]), ne = T({}), V = T({}), q = de(z, r);
-  it(d, c);
+  const m = T({}), g = fe((b) => {
+    U(m.current, b) || (m.current = b, a?.(b));
+  }), d = ce(i), [p, h] = G(!1), [v, z] = G(null), [x, y] = G(n ?? {}), [P, L] = G([]), [E, K] = G([]), ne = T({}), V = T({}), q = de(z, s);
+  it(d, u);
   const X = ze(
     () => ({
       id: d,
       orientation: l,
-      registerPanel: (b) => (P((R) => se(l, [...R, b])), () => {
-        P((R) => R.filter((N) => N !== b));
+      registerPanel: (b) => (L((M) => re(l, [...M, b])), () => {
+        L((M) => M.filter((N) => N !== b));
       }),
       registerSeparator: (b) => (K(
-        (R) => se(l, [...R, b])
+        (M) => re(l, [...M, b])
       ), () => {
         K(
-          (R) => R.filter((N) => N !== b)
+          (M) => M.filter((N) => N !== b)
         );
       })
     }),
     [d, l]
   );
   H(() => {
-    if (v !== null && L.length > 0) {
+    if (v !== null && P.length > 0) {
       const b = {
         defaultLayout: n,
         disableCursor: !!o,
-        disabled: !!s,
+        disabled: !!r,
         element: v,
         id: d,
         inMemoryLastExpandedPanelSizes: ne.current,
         inMemoryLayouts: V.current,
         orientation: l,
-        panels: L,
+        panels: P,
         separators: E
-      }, R = ot(b), oe = O().mountedGroups.get(b);
-      oe && (g(oe.layout), y?.(oe.layout));
+      }, M = ot(b), oe = O().mountedGroups.get(b);
+      oe && (y(oe.layout), g?.(oe.layout));
       const Oe = A.addListener(
         "interactionStateChange",
         (Z) => {
@@ -1059,35 +1059,35 @@ function dt({
         "mountedGroupsChange",
         (Z) => {
           const _ = Z.get(b);
-          _ && _.derivedPanelConstraints.length > 0 && (g(_.layout), y?.(_.layout));
+          _ && _.derivedPanelConstraints.length > 0 && (y(_.layout), g?.(_.layout));
         }
       );
       return () => {
-        R(), Oe(), Te();
+        M(), Oe(), Te();
       };
     }
   }, [
     n,
     o,
-    s,
+    r,
     v,
     d,
-    y,
+    g,
     l,
-    L,
+    P,
     E
   ]);
   const Y = {
     [Ge]: p ? "none" : void 0
   };
   for (const b in x) {
-    const R = Ie(d, b), N = x[b];
-    Y[R] = N;
+    const M = Ie(d, b), N = x[b];
+    Y[M] = N;
   }
   return /* @__PURE__ */ j(ke.Provider, { value: X, children: /* @__PURE__ */ j(
     "div",
     {
-      ...u,
+      ...c,
       "aria-orientation": l,
       className: t,
       "data-group": !0,
@@ -1108,7 +1108,7 @@ function dt({
 function le(e) {
   return `react-resizable-panels:${e}`;
 }
-function rt({
+function st({
   id: e,
   layout: t,
   storage: n
@@ -1120,38 +1120,38 @@ function rt({
     console.error(o);
   }
 }
-function pt({
+function mt({
   groupId: e,
   storage: t
 }) {
   const n = _e(
-    st,
+    rt,
     () => t.getItem(le(e)),
     () => t.getItem(le(e))
   ), o = ze(
     () => n ? JSON.parse(n) : null,
     [n]
-  ), s = Se(
-    (r) => rt({
+  ), r = Se(
+    (s) => st({
       id: e,
-      layout: r,
+      layout: s,
       storage: t
     }),
     [e, t]
   );
   return {
     defaultLayout: o,
-    onLayoutChange: s
+    onLayoutChange: r
   };
 }
-function st() {
+function rt() {
   return function() {
   };
 }
-function mt() {
+function ht() {
   return G(null);
 }
-function ht() {
+function vt() {
   return T(null);
 }
 function pe() {
@@ -1169,10 +1169,10 @@ function at({
     const { mountedGroups: i } = O();
     for (const [
       a,
-      { derivedPanelConstraints: l, layout: f, separatorToPanels: u }
+      { derivedPanelConstraints: l, layout: f, separatorToPanels: c }
     ] of i)
       if (a.id === e)
-        return { derivedPanelConstraints: l, group: a, layout: f, separatorToPanels: u };
+        return { derivedPanelConstraints: l, group: a, layout: f, separatorToPanels: c };
     throw Error(`Group ${e} not found`);
   }, o = () => {
     const i = n().derivedPanelConstraints.find(
@@ -1181,37 +1181,37 @@ function at({
     if (i !== void 0)
       return i;
     throw Error(`Panel constraints not found for Panel ${t}`);
-  }, s = () => {
+  }, r = () => {
     const i = n().group.panels.find((a) => a.id === t);
     if (i !== void 0)
       return i;
     throw Error(`Layout not found for Panel ${t}`);
-  }, r = () => {
+  }, s = () => {
     const i = n().layout[t];
     if (i !== void 0)
       return i;
     throw Error(`Layout not found for Panel ${t}`);
-  }, c = (i) => {
-    const a = r();
+  }, u = (i) => {
+    const a = s();
     if (i === a)
       return;
     const {
       derivedPanelConstraints: l,
       group: f,
-      layout: u,
+      layout: c,
       separatorToPanels: m
-    } = n(), y = f.panels.findIndex((v) => v.id === t), d = y === f.panels.length - 1, p = U({
+    } = n(), g = f.panels.findIndex((v) => v.id === t), d = g === f.panels.length - 1, p = B({
       delta: d ? a - i : i - a,
-      initialLayout: u,
+      initialLayout: c,
       panelConstraints: l,
-      pivotIndices: d ? [y - 1, y] : [y, y + 1],
-      prevLayout: u,
+      pivotIndices: d ? [g - 1, g] : [g, g + 1],
+      prevLayout: c,
       trigger: "imperative-api"
     }), h = $({
       layout: p,
       panelConstraints: l
     });
-    B(u, h) || M((v) => ({
+    U(c, h) || R((v) => ({
       mountedGroups: new Map(v.mountedGroups).set(f, {
         derivedPanelConstraints: l,
         layout: h,
@@ -1221,31 +1221,31 @@ function at({
   };
   return {
     collapse: () => {
-      const { collapsible: i, collapsedSize: a } = o(), l = r();
-      i && l !== a && c(a);
+      const { collapsible: i, collapsedSize: a } = o(), l = s();
+      i && l !== a && u(a);
     },
     expand: () => {
-      const { collapsible: i, collapsedSize: a, minSize: l } = o(), f = r();
-      i && f === a && c(l);
+      const { collapsible: i, collapsedSize: a, minSize: l } = o(), f = s();
+      i && f === a && u(l);
     },
     getSize: () => {
-      const { group: i } = n(), a = r(), { element: l } = s(), f = i.orientation === "horizontal" ? l.offsetWidth : l.offsetHeight;
+      const { group: i } = n(), a = s(), { element: l } = r(), f = i.orientation === "horizontal" ? l.offsetWidth : l.offsetHeight;
       return {
         asPercentage: a,
         inPixels: f
       };
     },
     isCollapsed: () => {
-      const { collapsible: i, collapsedSize: a } = o(), l = r();
+      const { collapsible: i, collapsedSize: a } = o(), l = s();
       return i && w(a, l);
     },
     resize: (i) => {
-      if (r() !== i) {
+      if (s() !== i) {
         let l;
         switch (typeof i) {
           case "number": {
-            const { group: f } = n(), u = ce({ group: f });
-            l = I(i / u * 100);
+            const { group: f } = n(), c = ue({ group: f });
+            l = I(i / c * 100);
             break;
           }
           case "string": {
@@ -1253,7 +1253,7 @@ function at({
             break;
           }
         }
-        c(l);
+        u(l);
       }
     }
   };
@@ -1276,35 +1276,35 @@ function lt(e, t) {
     );
   });
 }
-function vt({
+function gt({
   children: e,
   className: t,
   collapsedSize: n = 0,
   collapsible: o = !1,
-  defaultSize: s,
-  elementRef: r,
-  id: c,
+  defaultSize: r,
+  elementRef: s,
+  id: u,
   maxSize: i = "100",
   minSize: a = "0",
   onResize: l,
   panelRef: f,
-  style: u,
+  style: c,
   ...m
 }) {
-  const y = !!c, d = ue(c), [p, h] = G(null), v = de(h, r), { id: z, registerPanel: x } = pe(), g = l !== null, L = fe((E) => {
-    l?.(E, c);
+  const g = !!u, d = ce(u), [p, h] = G(null), v = de(h, s), { id: z, registerPanel: x } = pe(), y = l !== null, P = fe((E) => {
+    l?.(E, u);
   });
   H(() => {
     if (p !== null)
       return x({
         element: p,
         id: d,
-        idIsStable: y,
-        onResize: g ? L : void 0,
+        idIsStable: g,
+        onResize: y ? P : void 0,
         panelConstraints: {
           collapsedSize: n,
           collapsible: o,
-          defaultSize: s,
+          defaultSize: r,
           maxSize: i,
           minSize: a
         }
@@ -1312,17 +1312,17 @@ function vt({
   }, [
     n,
     o,
-    s,
+    r,
     p,
-    g,
-    d,
     y,
+    d,
+    g,
     i,
     a,
-    L,
+    P,
     x
   ]), lt(d, f);
-  const P = Ie(z, d);
+  const L = Ie(z, d);
   return /* @__PURE__ */ j(
     "div",
     {
@@ -1332,8 +1332,9 @@ function vt({
       id: d,
       ref: v,
       style: {
+        ...ut,
         flexBasis: 0,
-        flexGrow: `var(${P}, 1)`,
+        flexGrow: `var(${L}, 1)`,
         flexShrink: 1,
         // Prevent Panel content from interfering with panel size
         overflow: "hidden",
@@ -1348,7 +1349,7 @@ function vt({
           style: {
             width: "100%",
             height: "100%",
-            ...u
+            ...c
           },
           children: e
         }
@@ -1356,10 +1357,26 @@ function vt({
     }
   );
 }
+const ut = {
+  minHeight: "unset",
+  maxHeight: "unset",
+  height: "unset",
+  minWidth: "unset",
+  maxWidth: "unset",
+  width: "unset",
+  flex: "unset",
+  flexBasis: "unset",
+  flexShrink: "unset",
+  flexGrow: "unset",
+  border: "unset",
+  borderWidth: "unset",
+  padding: "unset",
+  margin: "unset"
+};
 function yt() {
   return G(null);
 }
-function gt() {
+function St() {
   return T(null);
 }
 function ct({
@@ -1368,15 +1385,15 @@ function ct({
   panelId: n,
   panelIndex: o
 }) {
-  let s, r;
-  const c = e[n], i = t.find(
+  let r, s;
+  const u = e[n], i = t.find(
     (a) => a.panelId === n
   );
   if (i) {
-    const a = i.maxSize, l = r = i.collapsible ? i.collapsedSize : i.minSize, f = [o, o + 1];
-    r = $({
-      layout: U({
-        delta: l - c,
+    const a = i.maxSize, l = s = i.collapsible ? i.collapsedSize : i.minSize, f = [o, o + 1];
+    s = $({
+      layout: B({
+        delta: l - u,
         initialLayout: e,
         panelConstraints: t,
         pivotIndices: f,
@@ -1384,9 +1401,9 @@ function ct({
         trigger: "keyboard"
       }),
       panelConstraints: t
-    })[n], s = $({
-      layout: U({
-        delta: a - c,
+    })[n], r = $({
+      layout: B({
+        delta: a - u,
         initialLayout: e,
         panelConstraints: t,
         pivotIndices: f,
@@ -1398,42 +1415,42 @@ function ct({
   }
   return {
     valueControls: n,
-    valueMax: s,
-    valueMin: r,
-    valueNow: c
+    valueMax: r,
+    valueMin: s,
+    valueNow: u
   };
 }
-function St({
+function xt({
   children: e,
   className: t,
   elementRef: n,
   id: o,
-  style: s,
-  ...r
+  style: r,
+  ...s
 }) {
-  const c = ue(o), [i, a] = G({}), [l, f] = G("inactive"), [u, m] = G(null), y = de(m, n), {
+  const u = ce(o), [i, a] = G({}), [l, f] = G("inactive"), [c, m] = G(null), g = de(m, n), {
     id: d,
     orientation: p,
     registerSeparator: h
   } = pe(), v = p === "horizontal" ? "vertical" : "horizontal";
   return H(() => {
-    if (u !== null) {
+    if (c !== null) {
       const z = {
-        element: u,
-        id: c
-      }, x = h(z), g = A.addListener(
+        element: c,
+        id: u
+      }, x = h(z), y = A.addListener(
         "interactionStateChange",
-        (P) => {
+        (L) => {
           f(
-            P.state !== "inactive" && P.hitRegions.some(
+            L.state !== "inactive" && L.hitRegions.some(
               (E) => E.separator === z
-            ) ? P.state : "inactive"
+            ) ? L.state : "inactive"
           );
         }
-      ), L = A.addListener(
+      ), P = A.addListener(
         "mountedGroupsChange",
-        (P) => {
-          P.forEach(
+        (L) => {
+          L.forEach(
             ({ derivedPanelConstraints: E, layout: K, separatorToPanels: ne }, V) => {
               if (V.id === d) {
                 const q = ne.get(z);
@@ -1454,13 +1471,13 @@ function St({
         }
       );
       return () => {
-        g(), L(), x();
+        y(), P(), x();
       };
     }
-  }, [u, d, c, h]), /* @__PURE__ */ j(
+  }, [c, d, u, h]), /* @__PURE__ */ j(
     "div",
     {
-      ...r,
+      ...s,
       "aria-controls": i.valueControls,
       "aria-orientation": v,
       "aria-valuemax": i.valueMax,
@@ -1469,13 +1486,13 @@ function St({
       children: e,
       className: t,
       "data-separator": l,
-      "data-testid": c,
-      id: c,
-      ref: y,
+      "data-testid": u,
+      id: u,
+      ref: g,
       role: "separator",
       style: {
         flexBasis: "auto",
-        ...s,
+        ...r,
         flexGrow: 0,
         flexShrink: 0
       },
@@ -1484,13 +1501,13 @@ function St({
   );
 }
 export {
-  dt as Group,
-  vt as Panel,
-  St as Separator,
-  pt as useDefaultLayout,
-  mt as useGroupCallbackRef,
-  ht as useGroupRef,
+  pt as Group,
+  gt as Panel,
+  xt as Separator,
+  mt as useDefaultLayout,
+  ht as useGroupCallbackRef,
+  vt as useGroupRef,
   yt as usePanelCallbackRef,
-  gt as usePanelRef
+  St as usePanelRef
 };
 //# sourceMappingURL=react-resizable-panels.js.map