react-resizable-panels 0.0.33 → 0.0.35

package/dist/react-resizable-panels.js

@@ -1,48 +1,48 @@
-var $b2QPe$react = require("react");
+var $2IMI0$react = require("react");
 
 function $parcel$export(e, n, v, s) {
   Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
 }
 
-$parcel$export(module.exports, "Panel", () => $4b51bd7b90b9da8b$export$2ddb90ad54e5f587);
-$parcel$export(module.exports, "PanelGroup", () => $19bf0050f73d236b$export$1d05749f6f573bb);
-$parcel$export(module.exports, "PanelResizeHandle", () => $01377e07790cf46f$export$8829ecf6b6b15484);
+$parcel$export(module.exports, "Panel", () => $45da0e827c614f1d$export$2ddb90ad54e5f587);
+$parcel$export(module.exports, "PanelGroup", () => $cec4cafe75f3db78$export$1d05749f6f573bb);
+$parcel$export(module.exports, "PanelResizeHandle", () => $3a26a712c9163348$export$8829ecf6b6b15484);
 
 
-const $967abed3d1bd1fe9$var$canUseEffectHooks = !!(typeof window !== "undefined" && typeof window.document !== "undefined" && typeof window.document.createElement !== "undefined");
-const $967abed3d1bd1fe9$var$useIsomorphicLayoutEffect = $967abed3d1bd1fe9$var$canUseEffectHooks ? (0, $b2QPe$react.useLayoutEffect) : ()=>{};
-var $967abed3d1bd1fe9$export$2e2bcd8739ae039 = $967abed3d1bd1fe9$var$useIsomorphicLayoutEffect;
+const $129b5b9a317dcc10$var$canUseEffectHooks = !!(typeof window !== "undefined" && typeof window.document !== "undefined" && typeof window.document.createElement !== "undefined");
+const $129b5b9a317dcc10$var$useIsomorphicLayoutEffect = $129b5b9a317dcc10$var$canUseEffectHooks ? (0, $2IMI0$react.useLayoutEffect) : ()=>{};
+var $129b5b9a317dcc10$export$2e2bcd8739ae039 = $129b5b9a317dcc10$var$useIsomorphicLayoutEffect;
 
 
 
-let $6d548a0d130941e3$var$counter = 0;
-function $6d548a0d130941e3$export$2e2bcd8739ae039(idFromParams = null) {
-    const idFromUseId = typeof (0, $b2QPe$react.useId) === "function" ? (0, $b2QPe$react.useId)() : null;
-    const idRef = (0, $b2QPe$react.useRef)(idFromParams || idFromUseId || null);
-    if (idRef.current === null) idRef.current = "" + $6d548a0d130941e3$var$counter++;
+let $b1693d8d8f570e9c$var$counter = 0;
+function $b1693d8d8f570e9c$export$2e2bcd8739ae039(idFromParams = null) {
+    const idFromUseId = typeof (0, $2IMI0$react.useId) === "function" ? (0, $2IMI0$react.useId)() : null;
+    const idRef = (0, $2IMI0$react.useRef)(idFromParams || idFromUseId || null);
+    if (idRef.current === null) idRef.current = "" + $b1693d8d8f570e9c$var$counter++;
     return idRef.current;
 }
 
 
 
-const $3251d17c1c3bce6c$export$7d8c6d083caec74a = (0, $b2QPe$react.createContext)(null);
+const $b9cf028330e7f243$export$7d8c6d083caec74a = (0, $2IMI0$react.createContext)(null);
 // Workaround for Parcel scope hoisting (which renames objects/functions).
 // Casting to :any is required to avoid corrupting the generated TypeScript types.
 // See github.com/parcel-bundler/parcel/issues/8724
-$3251d17c1c3bce6c$export$7d8c6d083caec74a.displayName = "PanelGroupContext";
+$b9cf028330e7f243$export$7d8c6d083caec74a.displayName = "PanelGroupContext";
 
 
-function $4b51bd7b90b9da8b$var$PanelWithForwardedRef({ children: children = null , className: classNameFromProps = "" , collapsible: collapsible = false , defaultSize: defaultSize = null , forwardedRef: forwardedRef , id: idFromProps = null , maxSize: maxSize = 100 , minSize: minSize = 10 , onCollapse: onCollapse = null , onResize: onResize = null , order: order = null , style: styleFromProps = {} , tagName: Type = "div"  }) {
-    const context = (0, $b2QPe$react.useContext)((0, $3251d17c1c3bce6c$export$7d8c6d083caec74a));
+function $45da0e827c614f1d$var$PanelWithForwardedRef({ children: children = null , className: classNameFromProps = "" , collapsible: collapsible = false , defaultSize: defaultSize = null , forwardedRef: forwardedRef , id: idFromProps = null , maxSize: maxSize = 100 , minSize: minSize = 10 , onCollapse: onCollapse = null , onResize: onResize = null , order: order = null , style: styleFromProps = {} , tagName: Type = "div"  }) {
+    const context = (0, $2IMI0$react.useContext)((0, $b9cf028330e7f243$export$7d8c6d083caec74a));
     if (context === null) throw Error(`Panel components must be rendered within a PanelGroup container`);
-    const panelId = (0, $6d548a0d130941e3$export$2e2bcd8739ae039)(idFromProps);
+    const panelId = (0, $b1693d8d8f570e9c$export$2e2bcd8739ae039)(idFromProps);
     const { collapsePanel: collapsePanel , expandPanel: expandPanel , getPanelStyle: getPanelStyle , registerPanel: registerPanel , resizePanel: resizePanel , unregisterPanel: unregisterPanel  } = context;
     // Use a ref to guard against users passing inline props
-    const callbacksRef = (0, $b2QPe$react.useRef)({
+    const callbacksRef = (0, $2IMI0$react.useRef)({
         onCollapse: onCollapse,
         onResize: onResize
     });
-    (0, $b2QPe$react.useEffect)(()=>{
+    (0, $2IMI0$react.useEffect)(()=>{
         callbacksRef.current.onCollapse = onCollapse;
         callbacksRef.current.onResize = onResize;
     });
@@ -56,7 +56,7 @@ function $4b51bd7b90b9da8b$var$PanelWithForwardedRef({ children: children = null
             defaultSize = minSize;
         }
     }
-    (0, $967abed3d1bd1fe9$export$2e2bcd8739ae039)(()=>{
+    (0, $129b5b9a317dcc10$export$2e2bcd8739ae039)(()=>{
         const panel = {
             callbacksRef: callbacksRef,
             collapsible: collapsible,
@@ -81,13 +81,13 @@ function $4b51bd7b90b9da8b$var$PanelWithForwardedRef({ children: children = null
         unregisterPanel
     ]);
     const style = getPanelStyle(panelId);
-    const committedValuesRef = (0, $b2QPe$react.useRef)({
-        size: $4b51bd7b90b9da8b$var$parseSizeFromStyle(style)
+    const committedValuesRef = (0, $2IMI0$react.useRef)({
+        size: $45da0e827c614f1d$var$parseSizeFromStyle(style)
     });
-    (0, $967abed3d1bd1fe9$export$2e2bcd8739ae039)(()=>{
-        committedValuesRef.current.size = $4b51bd7b90b9da8b$var$parseSizeFromStyle(style);
+    (0, $129b5b9a317dcc10$export$2e2bcd8739ae039)(()=>{
+        committedValuesRef.current.size = $45da0e827c614f1d$var$parseSizeFromStyle(style);
     });
-    (0, $b2QPe$react.useImperativeHandle)(forwardedRef, ()=>({
+    (0, $2IMI0$react.useImperativeHandle)(forwardedRef, ()=>({
             collapse: ()=>collapsePanel(panelId),
             expand: ()=>expandPanel(panelId),
             getCollapsed () {
@@ -103,7 +103,7 @@ function $4b51bd7b90b9da8b$var$PanelWithForwardedRef({ children: children = null
         panelId,
         resizePanel
     ]);
-    return (0, $b2QPe$react.createElement)(Type, {
+    return (0, $2IMI0$react.createElement)(Type, {
         children: children,
         className: classNameFromProps,
         "data-panel": "",
@@ -117,17 +117,17 @@ function $4b51bd7b90b9da8b$var$PanelWithForwardedRef({ children: children = null
         }
     });
 }
-const $4b51bd7b90b9da8b$export$2ddb90ad54e5f587 = (0, $b2QPe$react.forwardRef)((props, ref)=>(0, $b2QPe$react.createElement)($4b51bd7b90b9da8b$var$PanelWithForwardedRef, {
+const $45da0e827c614f1d$export$2ddb90ad54e5f587 = (0, $2IMI0$react.forwardRef)((props, ref)=>(0, $2IMI0$react.createElement)($45da0e827c614f1d$var$PanelWithForwardedRef, {
         ...props,
         forwardedRef: ref
     }));
 // Workaround for Parcel scope hoisting (which renames objects/functions).
 // Casting to :any is required to avoid corrupting the generated TypeScript types.
 // See github.com/parcel-bundler/parcel/issues/8724
-$4b51bd7b90b9da8b$var$PanelWithForwardedRef.displayName = "Panel";
-$4b51bd7b90b9da8b$export$2ddb90ad54e5f587.displayName = "forwardRef(Panel)";
+$45da0e827c614f1d$var$PanelWithForwardedRef.displayName = "Panel";
+$45da0e827c614f1d$export$2ddb90ad54e5f587.displayName = "forwardRef(Panel)";
 // HACK
-function $4b51bd7b90b9da8b$var$parseSizeFromStyle(style) {
+function $45da0e827c614f1d$var$parseSizeFromStyle(style) {
     const { flexGrow: flexGrow  } = style;
     if (typeof flexGrow === "string") return parseFloat(flexGrow);
     else return flexGrow;
@@ -140,15 +140,15 @@ function $4b51bd7b90b9da8b$var$parseSizeFromStyle(style) {
 // so they should not be used as part of the serialization key.
 // Using an attribute like minSize instead should work well enough.
 // Pre-sorting by minSize allows remembering layouts even if panels are re-ordered/dragged.
-function $e045b0dd313f33c7$var$getSerializationKey(panels) {
+function $f9cb001fbb908626$var$getSerializationKey(panels) {
     return panels.map((panel)=>{
         const { minSize: minSize , order: order  } = panel;
         return order ? `${order}:${minSize}` : `${minSize}`;
     }).sort((a, b)=>a.localeCompare(b)).join(",");
 }
-function $e045b0dd313f33c7$var$loadSerializedPanelGroupState(autoSaveId) {
+function $f9cb001fbb908626$var$loadSerializedPanelGroupState(autoSaveId, storage) {
     try {
-        const serialized = localStorage.getItem(`PanelGroup:sizes:${autoSaveId}`);
+        const serialized = storage.getItem(`PanelGroup:sizes:${autoSaveId}`);
         if (serialized) {
             const parsed = JSON.parse(serialized);
             if (typeof parsed === "object" && parsed != null) return parsed;
@@ -156,34 +156,39 @@ function $e045b0dd313f33c7$var$loadSerializedPanelGroupState(autoSaveId) {
     } catch (error) {}
     return null;
 }
-function $e045b0dd313f33c7$export$9c80c6617f0386da(autoSaveId, panels) {
-    const state = $e045b0dd313f33c7$var$loadSerializedPanelGroupState(autoSaveId);
+function $f9cb001fbb908626$export$9c80c6617f0386da(autoSaveId, panels, storage) {
+    const state = $f9cb001fbb908626$var$loadSerializedPanelGroupState(autoSaveId, storage);
     if (state) {
-        const key = $e045b0dd313f33c7$var$getSerializationKey(panels);
-        return state[key] || null;
+        const key = $f9cb001fbb908626$var$getSerializationKey(panels);
+        var _state_key;
+        return (_state_key = state[key]) !== null && _state_key !== void 0 ? _state_key : null;
     }
     return null;
 }
-function $e045b0dd313f33c7$export$af183b313c61be4f(autoSaveId, panels, sizes) {
-    const key = $e045b0dd313f33c7$var$getSerializationKey(panels);
-    const state = $e045b0dd313f33c7$var$loadSerializedPanelGroupState(autoSaveId) || {};
+function $f9cb001fbb908626$export$af183b313c61be4f(autoSaveId, panels, sizes, storage) {
+    const key = $f9cb001fbb908626$var$getSerializationKey(panels);
+    const state = $f9cb001fbb908626$var$loadSerializedPanelGroupState(autoSaveId, storage) || {};
     state[key] = sizes;
     try {
-        localStorage.setItem(`PanelGroup:sizes:${autoSaveId}`, JSON.stringify(state));
+        storage.setItem(`PanelGroup:sizes:${autoSaveId}`, JSON.stringify(state));
     } catch (error) {
         console.error(error);
     }
 }
 
 
-const $3237bc4a138172cd$export$d6d3992f3becc879 = 10;
+const $9abd79656a89cd3a$export$d6d3992f3becc879 = 10;
 
 
 
-function $d520236daad9c5d5$export$f50bae335f53943c(event, panels, idBefore, idAfter, delta, prevSizes, panelSizeBeforeCollapse) {
-    if (delta === 0) return prevSizes;
-    const panelsArray = $d520236daad9c5d5$export$a861c0ad45885494(panels);
-    const nextSizes = prevSizes.concat();
+function $cda3cc4b1114cf23$export$f50bae335f53943c(event, panels, idBefore, idAfter, delta, prevSizes, panelSizeBeforeCollapse, initialDragState) {
+    const { sizes: initialSizes  } = initialDragState || {};
+    // If we're resizing by mouse or touch, use the initial sizes as a base.
+    // This has the benefit of causing force-collapsed panels to spring back open if drag is reversed.
+    const baseSizes = initialSizes || prevSizes;
+    if (delta === 0) return baseSizes;
+    const panelsArray = $cda3cc4b1114cf23$export$a861c0ad45885494(panels);
+    const nextSizes = baseSizes.concat();
     let deltaApplied = 0;
     // A resizing panel affects the panels before or after it.
     //
@@ -197,25 +202,29 @@ function $d520236daad9c5d5$export$f50bae335f53943c(event, panels, idBefore, idAf
         const pivotId = delta < 0 ? idAfter : idBefore;
         const index = panelsArray.findIndex((panel)=>panel.id === pivotId);
         const panel = panelsArray[index];
-        const prevSize = prevSizes[index];
-        const nextSize = $d520236daad9c5d5$var$safeResizePanel(panel, Math.abs(delta), prevSize, event);
-        if (prevSize === nextSize) return prevSizes;
+        const baseSize = baseSizes[index];
+        const nextSize = $cda3cc4b1114cf23$var$safeResizePanel(panel, Math.abs(delta), baseSize, event);
+        if (baseSize === nextSize) // If there's no room for the pivot panel to grow, we can ignore this drag update.
+        return baseSizes;
         else {
-            if (nextSize === 0 && prevSize > 0) panelSizeBeforeCollapse.set(pivotId, prevSize);
-            delta = delta < 0 ? prevSize - nextSize : nextSize - prevSize;
+            if (nextSize === 0 && baseSize > 0) panelSizeBeforeCollapse.set(pivotId, baseSize);
+            delta = delta < 0 ? baseSize - nextSize : nextSize - baseSize;
         }
     }
     let pivotId1 = delta < 0 ? idBefore : idAfter;
     let index1 = panelsArray.findIndex((panel)=>panel.id === pivotId1);
     while(true){
         const panel1 = panelsArray[index1];
-        const prevSize1 = prevSizes[index1];
-        const nextSize1 = $d520236daad9c5d5$var$safeResizePanel(panel1, 0 - Math.abs(delta), prevSize1, event);
-        if (prevSize1 !== nextSize1) {
-            if (nextSize1 === 0 && prevSize1 > 0) panelSizeBeforeCollapse.set(panel1.id, prevSize1);
-            deltaApplied += prevSize1 - nextSize1;
+        const baseSize1 = baseSizes[index1];
+        const deltaRemaining = Math.abs(delta) - Math.abs(deltaApplied);
+        const nextSize1 = $cda3cc4b1114cf23$var$safeResizePanel(panel1, 0 - deltaRemaining, baseSize1, event);
+        if (baseSize1 !== nextSize1) {
+            if (nextSize1 === 0 && baseSize1 > 0) panelSizeBeforeCollapse.set(panel1.id, baseSize1);
+            deltaApplied += baseSize1 - nextSize1;
             nextSizes[index1] = nextSize1;
-            if (deltaApplied.toPrecision((0, $3237bc4a138172cd$export$d6d3992f3becc879)) >= delta.toPrecision((0, $3237bc4a138172cd$export$d6d3992f3becc879))) break;
+            if (deltaApplied.toPrecision((0, $9abd79656a89cd3a$export$d6d3992f3becc879)).localeCompare(Math.abs(delta).toPrecision((0, $9abd79656a89cd3a$export$d6d3992f3becc879)), undefined, {
+                numeric: true
+            }) >= 0) break;
         }
         if (delta < 0) {
             if (--index1 < 0) break;
@@ -225,14 +234,14 @@ function $d520236daad9c5d5$export$f50bae335f53943c(event, panels, idBefore, idAf
     }
     // If we were unable to resize any of the panels panels, return the previous state.
     // This will essentially bailout and ignore the "mousemove" event.
-    if (deltaApplied === 0) return prevSizes;
+    if (deltaApplied === 0) return baseSizes;
     // Adjust the pivot panel before, but only by the amount that surrounding panels were able to shrink/contract.
     pivotId1 = delta < 0 ? idAfter : idBefore;
     index1 = panelsArray.findIndex((panel)=>panel.id === pivotId1);
-    nextSizes[index1] = prevSizes[index1] + deltaApplied;
+    nextSizes[index1] = baseSizes[index1] + deltaApplied;
     return nextSizes;
 }
-function $d520236daad9c5d5$export$b8e48269e4faa934(panelsArray, prevSizes, nextSizes) {
+function $cda3cc4b1114cf23$export$b8e48269e4faa934(panelsArray, prevSizes, nextSizes) {
     nextSizes.forEach((nextSize, index)=>{
         const prevSize = prevSizes[index];
         if (prevSize !== nextSize) {
@@ -248,7 +257,7 @@ function $d520236daad9c5d5$export$b8e48269e4faa934(panelsArray, prevSizes, nextS
         }
     });
 }
-function $d520236daad9c5d5$export$5a5b0c1d38c23c3b(id, panelsArray) {
+function $cda3cc4b1114cf23$export$5a5b0c1d38c23c3b(id, panelsArray) {
     if (panelsArray.length < 2) return [
         null,
         null
@@ -266,61 +275,65 @@ function $d520236daad9c5d5$export$5a5b0c1d38c23c3b(id, panelsArray) {
         idAfter
     ];
 }
-function $d520236daad9c5d5$export$6f43503e166de6fb(panels, id, sizes) {
+function $cda3cc4b1114cf23$export$6f43503e166de6fb(panels, id, sizes) {
     if (panels.size === 1) return "100";
-    const panelsArray = $d520236daad9c5d5$export$a861c0ad45885494(panels);
+    const panelsArray = $cda3cc4b1114cf23$export$a861c0ad45885494(panels);
     const index = panelsArray.findIndex((panel)=>panel.id === id);
     const size = sizes[index];
     if (size == null) return "0";
-    return size.toPrecision((0, $3237bc4a138172cd$export$d6d3992f3becc879));
+    return size.toPrecision((0, $9abd79656a89cd3a$export$d6d3992f3becc879));
 }
-function $d520236daad9c5d5$export$7361ed18ff57179e(id) {
+function $cda3cc4b1114cf23$export$7361ed18ff57179e(id) {
     const element = document.querySelector(`[data-panel-id="${id}"]`);
     if (element) return element;
     return null;
 }
-function $d520236daad9c5d5$export$5e67632cf3550a9c(id) {
+function $cda3cc4b1114cf23$export$5e67632cf3550a9c(id) {
     const element = document.querySelector(`[data-panel-group-id="${id}"]`);
     if (element) return element;
     return null;
 }
-function $d520236daad9c5d5$export$2e27d3a347680388(id) {
+function $cda3cc4b1114cf23$export$2e27d3a347680388(id) {
     const element = document.querySelector(`[data-panel-resize-handle-id="${id}"]`);
     if (element) return element;
     return null;
 }
-function $d520236daad9c5d5$export$96a40be80fb6c3c8(id) {
-    const handles = $d520236daad9c5d5$export$8d0cd3c32ddc045e();
+function $cda3cc4b1114cf23$export$96a40be80fb6c3c8(id) {
+    const handles = $cda3cc4b1114cf23$export$8d0cd3c32ddc045e();
     const index = handles.findIndex((handle)=>handle.getAttribute("data-panel-resize-handle-id") === id);
-    return index || null;
+    return index !== null && index !== void 0 ? index : null;
 }
-function $d520236daad9c5d5$export$8d0cd3c32ddc045e() {
+function $cda3cc4b1114cf23$export$8d0cd3c32ddc045e() {
     return Array.from(document.querySelectorAll(`[data-panel-resize-handle-id]`));
 }
-function $d520236daad9c5d5$export$ae14931f0a0256a3(groupId) {
+function $cda3cc4b1114cf23$export$ae14931f0a0256a3(groupId) {
     return Array.from(document.querySelectorAll(`[data-panel-resize-handle-id][data-panel-group-id="${groupId}"]`));
 }
-function $d520236daad9c5d5$export$68d3a33c21dfbe27(groupId, handleId, panelsArray) {
-    const handle = $d520236daad9c5d5$export$2e27d3a347680388(handleId);
-    const handles = $d520236daad9c5d5$export$ae14931f0a0256a3(groupId);
+function $cda3cc4b1114cf23$export$68d3a33c21dfbe27(groupId, handleId, panelsArray) {
+    var _panelsArray_index, _panelsArray_;
+    const handle = $cda3cc4b1114cf23$export$2e27d3a347680388(handleId);
+    const handles = $cda3cc4b1114cf23$export$ae14931f0a0256a3(groupId);
     const index = handles.indexOf(handle);
-    const idBefore = panelsArray[index]?.id || null;
-    const idAfter = panelsArray[index + 1]?.id || null;
+    var _panelsArray_index_id;
+    const idBefore = (_panelsArray_index_id = (_panelsArray_index = panelsArray[index]) === null || _panelsArray_index === void 0 ? void 0 : _panelsArray_index.id) !== null && _panelsArray_index_id !== void 0 ? _panelsArray_index_id : null;
+    var _panelsArray__id;
+    const idAfter = (_panelsArray__id = (_panelsArray_ = panelsArray[index + 1]) === null || _panelsArray_ === void 0 ? void 0 : _panelsArray_.id) !== null && _panelsArray__id !== void 0 ? _panelsArray__id : null;
     return [
         idBefore,
         idAfter
     ];
 }
-function $d520236daad9c5d5$export$a861c0ad45885494(panels) {
+function $cda3cc4b1114cf23$export$a861c0ad45885494(panels) {
     return Array.from(panels.values()).sort((a, b)=>a.order - b.order);
 }
-function $d520236daad9c5d5$var$safeResizePanel(panel, delta, prevSize, event) {
+function $cda3cc4b1114cf23$var$safeResizePanel(panel, delta, prevSize, event) {
     const nextSizeUnsafe = prevSize + delta;
     if (panel.collapsible) {
         if (prevSize > 0) {
             if (nextSizeUnsafe <= 0) return 0;
         } else {
-            const isKeyboardEvent = event?.type?.startsWith("key");
+            var _event_type;
+            const isKeyboardEvent = event === null || event === void 0 ? void 0 : (_event_type = event.type) === null || _event_type === void 0 ? void 0 : _event_type.startsWith("key");
             if (!isKeyboardEvent) {
                 // Keyboard events should expand a collapsed panel to the min size,
                 // but mouse events should wait until the panel has reached its min size
@@ -334,23 +347,27 @@ function $d520236daad9c5d5$var$safeResizePanel(panel, delta, prevSize, event) {
 }
 
 
-function $f5af57c8e042a4ad$export$ec391ce65b083ed4(event, handleId, direction, initialOffset = 0) {
+function $47eee9224cfec8e8$export$ec391ce65b083ed4(event, handleId, direction, initialOffset = 0, initialHandleElementRect = null) {
     const isHorizontal = direction === "horizontal";
     let pointerOffset = 0;
-    if ($f5af57c8e042a4ad$export$764db16956f554f8(event)) pointerOffset = isHorizontal ? event.clientX : event.clientY;
-    else if ($f5af57c8e042a4ad$export$c4dfce035d43d1e0(event)) {
+    if ($47eee9224cfec8e8$export$764db16956f554f8(event)) pointerOffset = isHorizontal ? event.clientX : event.clientY;
+    else if ($47eee9224cfec8e8$export$c4dfce035d43d1e0(event)) {
         const firstTouch = event.touches[0];
         pointerOffset = isHorizontal ? firstTouch.screenX : firstTouch.screenY;
     } else return 0;
-    const handleElement = (0, $d520236daad9c5d5$export$2e27d3a347680388)(handleId);
-    const rect = handleElement.getBoundingClientRect();
+    const handleElement = (0, $cda3cc4b1114cf23$export$2e27d3a347680388)(handleId);
+    const rect = initialHandleElementRect || handleElement.getBoundingClientRect();
     const elementOffset = isHorizontal ? rect.left : rect.top;
     return pointerOffset - elementOffset - initialOffset;
 }
-function $f5af57c8e042a4ad$export$354b17c0684607ed(event, groupId, handleId, panelsArray, direction, sizes, initialOffset) {
-    if ($f5af57c8e042a4ad$export$e7bf60a870f429b0(event)) {
+function $47eee9224cfec8e8$export$354b17c0684607ed(event, groupId, handleId, panelsArray, direction, prevSizes, initialDragState) {
+    const { dragOffset: dragOffset = 0 , dragHandleRect: dragHandleRect , sizes: initialSizes  } = initialDragState || {};
+    // If we're resizing by mouse or touch, use the initial sizes as a base.
+    // This has the benefit of causing force-collapsed panels to spring back open if drag is reversed.
+    const baseSizes = initialSizes || prevSizes;
+    if ($47eee9224cfec8e8$export$e7bf60a870f429b0(event)) {
         const isHorizontal = direction === "horizontal";
-        const groupElement = (0, $d520236daad9c5d5$export$5e67632cf3550a9c)(groupId);
+        const groupElement = (0, $cda3cc4b1114cf23$export$5e67632cf3550a9c)(groupId);
         const rect = groupElement.getBoundingClientRect();
         const groupSizeInPixels = isHorizontal ? rect.width : rect.height;
         const denominator = event.shiftKey ? 10 : 100;
@@ -380,24 +397,24 @@ function $f5af57c8e042a4ad$export$354b17c0684607ed(event, groupId, handleId, pan
         // we need to special case resizing around the minSize boundary.
         // If contracting, Panels should shrink to their minSize and then snap to fully collapsed.
         // If expanding from collapsed, they should snap back to their minSize.
-        const [idBefore, idAfter] = (0, $d520236daad9c5d5$export$68d3a33c21dfbe27)(groupId, handleId, panelsArray);
+        const [idBefore, idAfter] = (0, $cda3cc4b1114cf23$export$68d3a33c21dfbe27)(groupId, handleId, panelsArray);
         const targetPanelId = movement < 0 ? idBefore : idAfter;
         const targetPanelIndex = panelsArray.findIndex((panel)=>panel.id === targetPanelId);
         const targetPanel = panelsArray[targetPanelIndex];
         if (targetPanel.collapsible) {
-            const prevSize = sizes[targetPanelIndex];
-            if (prevSize === 0 || prevSize.toPrecision((0, $3237bc4a138172cd$export$d6d3992f3becc879)) === targetPanel.minSize.toPrecision((0, $3237bc4a138172cd$export$d6d3992f3becc879))) movement = movement < 0 ? -targetPanel.minSize * groupSizeInPixels : targetPanel.minSize * groupSizeInPixels;
+            const baseSize = baseSizes[targetPanelIndex];
+            if (baseSize === 0 || baseSize.toPrecision((0, $9abd79656a89cd3a$export$d6d3992f3becc879)) === targetPanel.minSize.toPrecision((0, $9abd79656a89cd3a$export$d6d3992f3becc879))) movement = movement < 0 ? -targetPanel.minSize * groupSizeInPixels : targetPanel.minSize * groupSizeInPixels;
         }
         return movement;
-    } else return $f5af57c8e042a4ad$export$ec391ce65b083ed4(event, handleId, direction, initialOffset);
+    } else return $47eee9224cfec8e8$export$ec391ce65b083ed4(event, handleId, direction, dragOffset, dragHandleRect);
 }
-function $f5af57c8e042a4ad$export$e7bf60a870f429b0(event) {
+function $47eee9224cfec8e8$export$e7bf60a870f429b0(event) {
     return event.type === "keydown";
 }
-function $f5af57c8e042a4ad$export$764db16956f554f8(event) {
+function $47eee9224cfec8e8$export$764db16956f554f8(event) {
     return event.type.startsWith("mouse");
 }
-function $f5af57c8e042a4ad$export$c4dfce035d43d1e0(event) {
+function $47eee9224cfec8e8$export$c4dfce035d43d1e0(event) {
     return event.type.startsWith("touch");
 }
 
@@ -408,16 +425,16 @@ function $f5af57c8e042a4ad$export$c4dfce035d43d1e0(event) {
 
 
 
-function $63be9a96d8675f03$export$d9fcbe062527d159({ committedValuesRef: committedValuesRef , groupId: groupId , panels: panels , setSizes: setSizes , sizes: sizes , panelSizeBeforeCollapse: panelSizeBeforeCollapse  }) {
-    (0, $b2QPe$react.useEffect)(()=>{
+function $a695670cc57a5969$export$d9fcbe062527d159({ committedValuesRef: committedValuesRef , groupId: groupId , panels: panels , setSizes: setSizes , sizes: sizes , panelSizeBeforeCollapse: panelSizeBeforeCollapse  }) {
+    (0, $2IMI0$react.useEffect)(()=>{
         const { direction: direction , panels: panels  } = committedValuesRef.current;
-        const groupElement = (0, $d520236daad9c5d5$export$5e67632cf3550a9c)(groupId);
+        const groupElement = (0, $cda3cc4b1114cf23$export$5e67632cf3550a9c)(groupId);
         const { height: height , width: width  } = groupElement.getBoundingClientRect();
-        const handles = (0, $d520236daad9c5d5$export$ae14931f0a0256a3)(groupId);
+        const handles = (0, $cda3cc4b1114cf23$export$ae14931f0a0256a3)(groupId);
         const cleanupFunctions = handles.map((handle)=>{
             const handleId = handle.getAttribute("data-panel-resize-handle-id");
-            const panelsArray = (0, $d520236daad9c5d5$export$a861c0ad45885494)(panels);
-            const [idBefore, idAfter] = (0, $d520236daad9c5d5$export$68d3a33c21dfbe27)(groupId, handleId, panelsArray);
+            const panelsArray = (0, $cda3cc4b1114cf23$export$a861c0ad45885494)(panels);
+            const [idBefore, idAfter] = (0, $cda3cc4b1114cf23$export$68d3a33c21dfbe27)(groupId, handleId, panelsArray);
             if (idBefore == null || idAfter == null) return ()=>{};
             let minSize = 0;
             let maxSize = 100;
@@ -435,7 +452,7 @@ function $63be9a96d8675f03$export$d9fcbe062527d159({ committedValuesRef: committ
             });
             const ariaValueMax = Math.min(maxSize, 100 - totalMinSize);
             const ariaValueMin = Math.max(minSize, (panelsArray.length - 1) * 100 - totalMaxSize);
-            const flexGrow = (0, $d520236daad9c5d5$export$6f43503e166de6fb)(panels, idBefore, sizes);
+            const flexGrow = (0, $cda3cc4b1114cf23$export$6f43503e166de6fb)(panels, idBefore, sizes);
             handle.setAttribute("aria-valuemax", "" + Math.round(ariaValueMax));
             handle.setAttribute("aria-valuemin", "" + Math.round(ariaValueMin));
             handle.setAttribute("aria-valuenow", "" + Math.round(parseInt(flexGrow)));
@@ -449,9 +466,9 @@ function $63be9a96d8675f03$export$d9fcbe062527d159({ committedValuesRef: committ
                                 const size = sizes[index];
                                 if (size != null) {
                                     let delta = 0;
-                                    if (size.toPrecision((0, $3237bc4a138172cd$export$d6d3992f3becc879)) <= panelData.minSize.toPrecision((0, $3237bc4a138172cd$export$d6d3992f3becc879))) delta = direction === "horizontal" ? width : height;
+                                    if (size.toPrecision((0, $9abd79656a89cd3a$export$d6d3992f3becc879)) <= panelData.minSize.toPrecision((0, $9abd79656a89cd3a$export$d6d3992f3becc879))) delta = direction === "horizontal" ? width : height;
                                     else delta = -(direction === "horizontal" ? width : height);
-                                    const nextSizes = (0, $d520236daad9c5d5$export$f50bae335f53943c)(event, panels, idBefore, idAfter, delta, sizes, panelSizeBeforeCollapse.current);
+                                    const nextSizes = (0, $cda3cc4b1114cf23$export$f50bae335f53943c)(event, panels, idBefore, idAfter, delta, sizes, panelSizeBeforeCollapse.current, null);
                                     if (sizes !== nextSizes) setSizes(nextSizes);
                                 }
                             }
@@ -460,7 +477,7 @@ function $63be9a96d8675f03$export$d9fcbe062527d159({ committedValuesRef: committ
                 }
             };
             handle.addEventListener("keydown", onKeyDown);
-            const panelBefore = (0, $d520236daad9c5d5$export$7361ed18ff57179e)(idBefore);
+            const panelBefore = (0, $cda3cc4b1114cf23$export$7361ed18ff57179e)(idBefore);
             if (panelBefore != null) handle.setAttribute("aria-controls", panelBefore.id);
             return ()=>{
                 handle.removeAttribute("aria-valuemax");
@@ -479,10 +496,10 @@ function $63be9a96d8675f03$export$d9fcbe062527d159({ committedValuesRef: committ
         sizes
     ]);
 }
-function $63be9a96d8675f03$export$33b0bea6ac3ffb03({ disabled: disabled , handleId: handleId , resizeHandler: resizeHandler  }) {
-    (0, $b2QPe$react.useEffect)(()=>{
+function $a695670cc57a5969$export$33b0bea6ac3ffb03({ disabled: disabled , handleId: handleId , resizeHandler: resizeHandler  }) {
+    (0, $2IMI0$react.useEffect)(()=>{
         if (disabled || resizeHandler == null) return;
-        const handleElement = (0, $d520236daad9c5d5$export$2e27d3a347680388)(handleId);
+        const handleElement = (0, $cda3cc4b1114cf23$export$2e27d3a347680388)(handleId);
         if (handleElement == null) return;
         const onKeyDown = (event)=>{
             switch(event.key){
@@ -496,8 +513,8 @@ function $63be9a96d8675f03$export$33b0bea6ac3ffb03({ disabled: disabled , handle
                     break;
                 case "F6":
                     {
-                        const handles = (0, $d520236daad9c5d5$export$8d0cd3c32ddc045e)();
-                        const index = (0, $d520236daad9c5d5$export$96a40be80fb6c3c8)(handleId);
+                        const handles = (0, $cda3cc4b1114cf23$export$8d0cd3c32ddc045e)();
+                        const index = (0, $cda3cc4b1114cf23$export$96a40be80fb6c3c8)(handleId);
                         const nextIndex = event.shiftKey ? index > 0 ? index - 1 : handles.length - 1 : index + 1 < handles.length ? index + 1 : 0;
                         const nextHandle = handles[nextIndex];
                         nextHandle.focus();
@@ -517,9 +534,9 @@ function $63be9a96d8675f03$export$33b0bea6ac3ffb03({ disabled: disabled , handle
 }
 
 
-let $102aa6bc0f99b2b3$var$currentState = null;
-let $102aa6bc0f99b2b3$var$element = null;
-function $102aa6bc0f99b2b3$export$fa35f3322c52262f(state) {
+let $08745f7373322b05$var$currentState = null;
+let $08745f7373322b05$var$element = null;
+function $08745f7373322b05$export$fa35f3322c52262f(state) {
     switch(state){
         case "horizontal":
             return "col-resize";
@@ -535,26 +552,26 @@ function $102aa6bc0f99b2b3$export$fa35f3322c52262f(state) {
             return "s-resize";
     }
 }
-function $102aa6bc0f99b2b3$export$b61932ee18f96e08() {
-    if ($102aa6bc0f99b2b3$var$element !== null) {
-        document.head.removeChild($102aa6bc0f99b2b3$var$element);
-        $102aa6bc0f99b2b3$var$currentState = null;
-        $102aa6bc0f99b2b3$var$element = null;
+function $08745f7373322b05$export$b61932ee18f96e08() {
+    if ($08745f7373322b05$var$element !== null) {
+        document.head.removeChild($08745f7373322b05$var$element);
+        $08745f7373322b05$var$currentState = null;
+        $08745f7373322b05$var$element = null;
     }
 }
-function $102aa6bc0f99b2b3$export$d395b5dfd066a659(state) {
-    if ($102aa6bc0f99b2b3$var$currentState === state) return;
-    $102aa6bc0f99b2b3$var$currentState = state;
-    const style = $102aa6bc0f99b2b3$export$fa35f3322c52262f(state);
-    if ($102aa6bc0f99b2b3$var$element === null) {
-        $102aa6bc0f99b2b3$var$element = document.createElement("style");
-        document.head.appendChild($102aa6bc0f99b2b3$var$element);
+function $08745f7373322b05$export$d395b5dfd066a659(state) {
+    if ($08745f7373322b05$var$currentState === state) return;
+    $08745f7373322b05$var$currentState = state;
+    const style = $08745f7373322b05$export$fa35f3322c52262f(state);
+    if ($08745f7373322b05$var$element === null) {
+        $08745f7373322b05$var$element = document.createElement("style");
+        document.head.appendChild($08745f7373322b05$var$element);
     }
-    $102aa6bc0f99b2b3$var$element.innerHTML = `*{cursor: ${style}!important;}`;
+    $08745f7373322b05$var$element.innerHTML = `*{cursor: ${style}!important;}`;
 }
 
 
-function $0f7a23424493ebd6$export$2e2bcd8739ae039(callback, durationMs = 10) {
+function $2e8572579e31d898$export$2e2bcd8739ae039(callback, durationMs = 10) {
     let timeoutId = null;
     let callable = (...args)=>{
         clearTimeout(timeoutId);
@@ -566,38 +583,56 @@ function $0f7a23424493ebd6$export$2e2bcd8739ae039(callback, durationMs = 10) {
 }
 
 
+function $d31ef7445a11a6c5$export$b141efd0b0fb9174(arrayA, arrayB) {
+    if (arrayA.length !== arrayB.length) return false;
+    for(let index = 0; index < arrayA.length; index++){
+        if (arrayA[index] !== arrayB[index]) return false;
+    }
+    return true;
+}
+
+
 // Limit the frequency of localStorage updates.
-const $19bf0050f73d236b$var$savePanelGroupLayoutDebounced = (0, $0f7a23424493ebd6$export$2e2bcd8739ae039)((0, $e045b0dd313f33c7$export$af183b313c61be4f), 100);
-function $19bf0050f73d236b$export$1d05749f6f573bb({ autoSaveId: autoSaveId , children: children = null , className: classNameFromProps = "" , direction: direction , id: idFromProps = null , onLayout: onLayout = null , style: styleFromProps = {} , tagName: Type = "div"  }) {
-    const groupId = (0, $6d548a0d130941e3$export$2e2bcd8739ae039)(idFromProps);
-    const [activeHandleId, setActiveHandleId] = (0, $b2QPe$react.useState)(null);
-    const [panels, setPanels] = (0, $b2QPe$react.useState)(new Map());
+const $cec4cafe75f3db78$var$savePanelGroupLayoutDebounced = (0, $2e8572579e31d898$export$2e2bcd8739ae039)((0, $f9cb001fbb908626$export$af183b313c61be4f), 100);
+function $cec4cafe75f3db78$var$throwServerError() {
+    throw new Error('PanelGroup "storage" prop required for server rendering.');
+}
+const $cec4cafe75f3db78$var$defaultStorage = {
+    getItem: typeof localStorage !== "undefined" ? (name)=>localStorage.getItem(name) : $cec4cafe75f3db78$var$throwServerError,
+    setItem: typeof localStorage !== "undefined" ? (name, value)=>localStorage.setItem(name, value) : $cec4cafe75f3db78$var$throwServerError
+};
+function $cec4cafe75f3db78$export$1d05749f6f573bb({ autoSaveId: autoSaveId , children: children = null , className: classNameFromProps = "" , direction: direction , id: idFromProps = null , onLayout: onLayout = null , storage: storage = $cec4cafe75f3db78$var$defaultStorage , style: styleFromProps = {} , tagName: Type = "div"  }) {
+    const groupId = (0, $b1693d8d8f570e9c$export$2e2bcd8739ae039)(idFromProps);
+    const [activeHandleId, setActiveHandleId] = (0, $2IMI0$react.useState)(null);
+    const [panels, setPanels] = (0, $2IMI0$react.useState)(new Map());
+    // When resizing is done via mouse/touch event–
+    // We store the initial Panel sizes in this ref, and apply move deltas to them instead of to the current sizes.
+    // This has the benefit of causing force-collapsed panels to spring back open if drag is reversed.
+    const initialDragStateRef = (0, $2IMI0$react.useRef)(null);
     // Use a ref to guard against users passing inline props
-    const callbacksRef = (0, $b2QPe$react.useRef)({
+    const callbacksRef = (0, $2IMI0$react.useRef)({
         onLayout: onLayout
     });
-    (0, $b2QPe$react.useEffect)(()=>{
+    (0, $2IMI0$react.useEffect)(()=>{
         callbacksRef.current.onLayout = onLayout;
     });
     // 0-1 values representing the relative size of each panel.
-    const [sizes, setSizes] = (0, $b2QPe$react.useState)([]);
-    // Resize is calculated by the distance between the current pointer event and the resize handle being "dragged"
-    // This value accounts for the initial offset when the touch/click starts, so the handle doesn't appear to "jump"
-    const dragOffsetRef = (0, $b2QPe$react.useRef)(0);
+    const [sizes, setSizes] = (0, $2IMI0$react.useState)([]);
     // Used to support imperative collapse/expand API.
-    const panelSizeBeforeCollapse = (0, $b2QPe$react.useRef)(new Map());
+    const panelSizeBeforeCollapse = (0, $2IMI0$react.useRef)(new Map());
+    const prevDeltaRef = (0, $2IMI0$react.useRef)(0);
     // Store committed values to avoid unnecessarily re-running memoization/effects functions.
-    const committedValuesRef = (0, $b2QPe$react.useRef)({
+    const committedValuesRef = (0, $2IMI0$react.useRef)({
         direction: direction,
         panels: panels,
         sizes: sizes
     });
-    (0, $967abed3d1bd1fe9$export$2e2bcd8739ae039)(()=>{
+    (0, $129b5b9a317dcc10$export$2e2bcd8739ae039)(()=>{
         committedValuesRef.current.direction = direction;
         committedValuesRef.current.panels = panels;
         committedValuesRef.current.sizes = sizes;
     });
-    (0, $63be9a96d8675f03$export$d9fcbe062527d159)({
+    (0, $a695670cc57a5969$export$d9fcbe062527d159)({
         committedValuesRef: committedValuesRef,
         groupId: groupId,
         panels: panels,
@@ -606,7 +641,7 @@ function $19bf0050f73d236b$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
         panelSizeBeforeCollapse: panelSizeBeforeCollapse
     });
     // Notify external code when sizes have changed.
-    (0, $b2QPe$react.useEffect)(()=>{
+    (0, $2IMI0$react.useEffect)(()=>{
         const { onLayout: onLayout  } = callbacksRef.current;
         if (onLayout) {
             const { sizes: sizes  } = committedValuesRef.current;
@@ -618,14 +653,14 @@ function $19bf0050f73d236b$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
     ]);
     // Notify Panel listeners about their initial sizes and collapsed state after mount.
     // Subsequent changes will be called by the resizeHandler.
-    const didNotifyCallbacksAfterMountRef = (0, $b2QPe$react.useRef)(false);
-    (0, $967abed3d1bd1fe9$export$2e2bcd8739ae039)(()=>{
+    const didNotifyCallbacksAfterMountRef = (0, $2IMI0$react.useRef)(false);
+    (0, $129b5b9a317dcc10$export$2e2bcd8739ae039)(()=>{
         if (didNotifyCallbacksAfterMountRef.current) return;
         const { panels: panels , sizes: sizes  } = committedValuesRef.current;
         if (sizes.length > 0) {
             didNotifyCallbacksAfterMountRef.current = true;
-            const panelsArray = (0, $d520236daad9c5d5$export$a861c0ad45885494)(panels);
-            (0, $d520236daad9c5d5$export$b8e48269e4faa934)(panelsArray, [], sizes);
+            const panelsArray = (0, $cda3cc4b1114cf23$export$a861c0ad45885494)(panels);
+            (0, $cda3cc4b1114cf23$export$b8e48269e4faa934)(panelsArray, [], sizes);
         }
     }, [
         sizes
@@ -633,7 +668,7 @@ function $19bf0050f73d236b$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
     // Once all panels have registered themselves,
     // Compute the initial sizes based on default weights.
     // This assumes that panels register during initial mount (no conditional rendering)!
-    (0, $967abed3d1bd1fe9$export$2e2bcd8739ae039)(()=>{
+    (0, $129b5b9a317dcc10$export$2e2bcd8739ae039)(()=>{
         const sizes = committedValuesRef.current.sizes;
         if (sizes.length === panels.size) // Only compute (or restore) default sizes once per panel configuration.
         return;
@@ -641,12 +676,12 @@ function $19bf0050f73d236b$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
         // default size should be restored from local storage if possible.
         let defaultSizes = undefined;
         if (autoSaveId) {
-            const panelsArray = (0, $d520236daad9c5d5$export$a861c0ad45885494)(panels);
-            defaultSizes = (0, $e045b0dd313f33c7$export$9c80c6617f0386da)(autoSaveId, panelsArray);
+            const panelsArray = (0, $cda3cc4b1114cf23$export$a861c0ad45885494)(panels);
+            defaultSizes = (0, $f9cb001fbb908626$export$9c80c6617f0386da)(autoSaveId, panelsArray, storage);
         }
         if (defaultSizes != null) setSizes(defaultSizes);
         else {
-            const panelsArray1 = (0, $d520236daad9c5d5$export$a861c0ad45885494)(panels);
+            const panelsArray1 = (0, $cda3cc4b1114cf23$export$a861c0ad45885494)(panels);
             let panelsWithNullDefaultSize = 0;
             let totalDefaultSize = 0;
             let totalMinSize = 0;
@@ -670,19 +705,19 @@ function $19bf0050f73d236b$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
         autoSaveId,
         panels
     ]);
-    (0, $b2QPe$react.useEffect)(()=>{
+    (0, $2IMI0$react.useEffect)(()=>{
         // If this panel has been configured to persist sizing information, save sizes to local storage.
         if (autoSaveId) {
             if (sizes.length === 0 || sizes.length !== panels.size) return;
-            const panelsArray = (0, $d520236daad9c5d5$export$a861c0ad45885494)(panels);
-            $19bf0050f73d236b$var$savePanelGroupLayoutDebounced(autoSaveId, panelsArray, sizes);
+            const panelsArray = (0, $cda3cc4b1114cf23$export$a861c0ad45885494)(panels);
+            $cec4cafe75f3db78$var$savePanelGroupLayoutDebounced(autoSaveId, panelsArray, sizes, storage);
         }
     }, [
         autoSaveId,
         panels,
         sizes
     ]);
-    const getPanelStyle = (0, $b2QPe$react.useCallback)((id)=>{
+    const getPanelStyle = (0, $2IMI0$react.useCallback)((id)=>{
         const { panels: panels  } = committedValuesRef.current;
         // Before mounting, Panels will not yet have registered themselves.
         // This includes server rendering.
@@ -694,7 +729,7 @@ function $19bf0050f73d236b$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
             // Without this, Panel sizes may be unintentionally overridden by their content.
             overflow: "hidden"
         };
-        const flexGrow = (0, $d520236daad9c5d5$export$6f43503e166de6fb)(panels, id, sizes);
+        const flexGrow = (0, $cda3cc4b1114cf23$export$6f43503e166de6fb)(panels, id, sizes);
         return {
             flexBasis: 0,
             flexGrow: flexGrow,
@@ -710,7 +745,7 @@ function $19bf0050f73d236b$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
         direction,
         sizes
     ]);
-    const registerPanel = (0, $b2QPe$react.useCallback)((id, panel)=>{
+    const registerPanel = (0, $2IMI0$react.useCallback)((id, panel)=>{
         setPanels((prevPanels)=>{
             if (prevPanels.has(id)) return prevPanels;
             const nextPanels = new Map(prevPanels);
@@ -718,40 +753,50 @@ function $19bf0050f73d236b$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
             return nextPanels;
         });
     }, []);
-    const registerResizeHandle = (0, $b2QPe$react.useCallback)((handleId)=>{
+    const registerResizeHandle = (0, $2IMI0$react.useCallback)((handleId)=>{
         const resizeHandler = (event)=>{
             event.preventDefault();
             const { direction: direction , panels: panels , sizes: prevSizes  } = committedValuesRef.current;
-            const panelsArray = (0, $d520236daad9c5d5$export$a861c0ad45885494)(panels);
-            const [idBefore, idAfter] = (0, $d520236daad9c5d5$export$68d3a33c21dfbe27)(groupId, handleId, panelsArray);
+            const panelsArray = (0, $cda3cc4b1114cf23$export$a861c0ad45885494)(panels);
+            const [idBefore, idAfter] = (0, $cda3cc4b1114cf23$export$68d3a33c21dfbe27)(groupId, handleId, panelsArray);
             if (idBefore == null || idAfter == null) return;
-            const movement = (0, $f5af57c8e042a4ad$export$354b17c0684607ed)(event, groupId, handleId, panelsArray, direction, prevSizes, dragOffsetRef.current);
+            const movement = (0, $47eee9224cfec8e8$export$354b17c0684607ed)(event, groupId, handleId, panelsArray, direction, prevSizes, initialDragStateRef.current);
             if (movement === 0) return;
-            const groupElement = (0, $d520236daad9c5d5$export$5e67632cf3550a9c)(groupId);
+            const groupElement = (0, $cda3cc4b1114cf23$export$5e67632cf3550a9c)(groupId);
             const rect = groupElement.getBoundingClientRect();
             const isHorizontal = direction === "horizontal";
             const size = isHorizontal ? rect.width : rect.height;
             const delta = movement / size * 100;
-            const nextSizes = (0, $d520236daad9c5d5$export$f50bae335f53943c)(event, panels, idBefore, idAfter, delta, prevSizes, panelSizeBeforeCollapse.current);
-            if (prevSizes === nextSizes) {
-                // If the pointer has moved too far to resize the panel any further,
-                // update the cursor style for a visual clue.
-                // This mimics VS Code behavior.
-                if (isHorizontal) (0, $102aa6bc0f99b2b3$export$d395b5dfd066a659)(movement < 0 ? "horizontal-min" : "horizontal-max");
-                else (0, $102aa6bc0f99b2b3$export$d395b5dfd066a659)(movement < 0 ? "vertical-min" : "vertical-max");
-            } else {
-                // Reset the cursor style to the the normal resize cursor.
-                (0, $102aa6bc0f99b2b3$export$d395b5dfd066a659)(isHorizontal ? "horizontal" : "vertical");
+            const nextSizes = (0, $cda3cc4b1114cf23$export$f50bae335f53943c)(event, panels, idBefore, idAfter, delta, prevSizes, panelSizeBeforeCollapse.current, initialDragStateRef.current);
+            const sizesChanged = !(0, $d31ef7445a11a6c5$export$b141efd0b0fb9174)(prevSizes, nextSizes);
+            // Don't update cursor for resizes triggered by keyboard interactions.
+            if ((0, $47eee9224cfec8e8$export$764db16956f554f8)(event) || (0, $47eee9224cfec8e8$export$c4dfce035d43d1e0)(event)) // Watch for multiple subsequent deltas; this might occur for tiny cursor movements.
+            // In this case, Panel sizes might not change–
+            // but updating cursor in this scenario would cause a flicker.
+            {
+                if (prevDeltaRef.current != delta) {
+                    if (!sizesChanged) {
+                        // If the pointer has moved too far to resize the panel any further,
+                        // update the cursor style for a visual clue.
+                        // This mimics VS Code behavior.
+                        if (isHorizontal) (0, $08745f7373322b05$export$d395b5dfd066a659)(movement < 0 ? "horizontal-min" : "horizontal-max");
+                        else (0, $08745f7373322b05$export$d395b5dfd066a659)(movement < 0 ? "vertical-min" : "vertical-max");
+                    } else // Reset the cursor style to the the normal resize cursor.
+                    (0, $08745f7373322b05$export$d395b5dfd066a659)(isHorizontal ? "horizontal" : "vertical");
+                }
+            }
+            if (sizesChanged) {
                 // If resize change handlers have been declared, this is the time to call them.
-                (0, $d520236daad9c5d5$export$b8e48269e4faa934)(panelsArray, prevSizes, nextSizes);
+                (0, $cda3cc4b1114cf23$export$b8e48269e4faa934)(panelsArray, prevSizes, nextSizes);
                 setSizes(nextSizes);
             }
+            prevDeltaRef.current = delta;
         };
         return resizeHandler;
     }, [
         groupId
     ]);
-    const unregisterPanel = (0, $b2QPe$react.useCallback)((id)=>{
+    const unregisterPanel = (0, $2IMI0$react.useCallback)((id)=>{
         setPanels((prevPanels)=>{
             if (!prevPanels.has(id)) return prevPanels;
             const nextPanels = new Map(prevPanels);
@@ -759,72 +804,74 @@ function $19bf0050f73d236b$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
             return nextPanels;
         });
     }, []);
-    const collapsePanel = (0, $b2QPe$react.useCallback)((id)=>{
+    const collapsePanel = (0, $2IMI0$react.useCallback)((id)=>{
         const { panels: panels , sizes: prevSizes  } = committedValuesRef.current;
         const panel = panels.get(id);
         if (panel == null || !panel.collapsible) return;
-        const panelsArray = (0, $d520236daad9c5d5$export$a861c0ad45885494)(panels);
+        const panelsArray = (0, $cda3cc4b1114cf23$export$a861c0ad45885494)(panels);
         const index = panelsArray.indexOf(panel);
         if (index < 0) return;
         const currentSize = prevSizes[index];
         if (currentSize === 0) // Panel is already collapsed.
         return;
         panelSizeBeforeCollapse.current.set(id, currentSize);
-        const [idBefore, idAfter] = (0, $d520236daad9c5d5$export$5a5b0c1d38c23c3b)(id, panelsArray);
+        const [idBefore, idAfter] = (0, $cda3cc4b1114cf23$export$5a5b0c1d38c23c3b)(id, panelsArray);
         if (idBefore == null || idAfter == null) return;
         const isLastPanel = index === panelsArray.length - 1;
         const delta = isLastPanel ? currentSize : 0 - currentSize;
-        const nextSizes = (0, $d520236daad9c5d5$export$f50bae335f53943c)(null, panels, idBefore, idAfter, delta, prevSizes, panelSizeBeforeCollapse.current);
+        const nextSizes = (0, $cda3cc4b1114cf23$export$f50bae335f53943c)(null, panels, idBefore, idAfter, delta, prevSizes, panelSizeBeforeCollapse.current, null);
         if (prevSizes !== nextSizes) {
             // If resize change handlers have been declared, this is the time to call them.
-            (0, $d520236daad9c5d5$export$b8e48269e4faa934)(panelsArray, prevSizes, nextSizes);
+            (0, $cda3cc4b1114cf23$export$b8e48269e4faa934)(panelsArray, prevSizes, nextSizes);
             setSizes(nextSizes);
         }
     }, []);
-    const expandPanel = (0, $b2QPe$react.useCallback)((id)=>{
+    const expandPanel = (0, $2IMI0$react.useCallback)((id)=>{
         const { panels: panels , sizes: prevSizes  } = committedValuesRef.current;
         const panel = panels.get(id);
         if (panel == null) return;
         const sizeBeforeCollapse = panelSizeBeforeCollapse.current.get(id) || panel.minSize;
         if (!sizeBeforeCollapse) return;
-        const panelsArray = (0, $d520236daad9c5d5$export$a861c0ad45885494)(panels);
+        const panelsArray = (0, $cda3cc4b1114cf23$export$a861c0ad45885494)(panels);
         const index = panelsArray.indexOf(panel);
         if (index < 0) return;
         const currentSize = prevSizes[index];
         if (currentSize !== 0) // Panel is already expanded.
         return;
-        const [idBefore, idAfter] = (0, $d520236daad9c5d5$export$5a5b0c1d38c23c3b)(id, panelsArray);
+        const [idBefore, idAfter] = (0, $cda3cc4b1114cf23$export$5a5b0c1d38c23c3b)(id, panelsArray);
         if (idBefore == null || idAfter == null) return;
         const isLastPanel = index === panelsArray.length - 1;
         const delta = isLastPanel ? 0 - sizeBeforeCollapse : sizeBeforeCollapse;
-        const nextSizes = (0, $d520236daad9c5d5$export$f50bae335f53943c)(null, panels, idBefore, idAfter, delta, prevSizes, panelSizeBeforeCollapse.current);
+        const nextSizes = (0, $cda3cc4b1114cf23$export$f50bae335f53943c)(null, panels, idBefore, idAfter, delta, prevSizes, panelSizeBeforeCollapse.current, null);
         if (prevSizes !== nextSizes) {
             // If resize change handlers have been declared, this is the time to call them.
-            (0, $d520236daad9c5d5$export$b8e48269e4faa934)(panelsArray, prevSizes, nextSizes);
+            (0, $cda3cc4b1114cf23$export$b8e48269e4faa934)(panelsArray, prevSizes, nextSizes);
             setSizes(nextSizes);
         }
     }, []);
-    const resizePanel = (0, $b2QPe$react.useCallback)((id, nextSize)=>{
+    const resizePanel = (0, $2IMI0$react.useCallback)((id, nextSize)=>{
         const { panels: panels , sizes: prevSizes  } = committedValuesRef.current;
         const panel = panels.get(id);
         if (panel == null) return;
-        const panelsArray = (0, $d520236daad9c5d5$export$a861c0ad45885494)(panels);
+        const panelsArray = (0, $cda3cc4b1114cf23$export$a861c0ad45885494)(panels);
         const index = panelsArray.indexOf(panel);
         if (index < 0) return;
         const currentSize = prevSizes[index];
         if (currentSize === nextSize) return;
-        const [idBefore, idAfter] = (0, $d520236daad9c5d5$export$5a5b0c1d38c23c3b)(id, panelsArray);
+        if (panel.collapsible && nextSize === 0) ;
+        else nextSize = Math.min(panel.maxSize, Math.max(panel.minSize, nextSize));
+        const [idBefore, idAfter] = (0, $cda3cc4b1114cf23$export$5a5b0c1d38c23c3b)(id, panelsArray);
         if (idBefore == null || idAfter == null) return;
         const isLastPanel = index === panelsArray.length - 1;
         const delta = isLastPanel ? currentSize - nextSize : nextSize - currentSize;
-        const nextSizes = (0, $d520236daad9c5d5$export$f50bae335f53943c)(null, panels, idBefore, idAfter, delta, prevSizes, panelSizeBeforeCollapse.current);
+        const nextSizes = (0, $cda3cc4b1114cf23$export$f50bae335f53943c)(null, panels, idBefore, idAfter, delta, prevSizes, panelSizeBeforeCollapse.current, null);
         if (prevSizes !== nextSizes) {
             // If resize change handlers have been declared, this is the time to call them.
-            (0, $d520236daad9c5d5$export$b8e48269e4faa934)(panelsArray, prevSizes, nextSizes);
+            (0, $cda3cc4b1114cf23$export$b8e48269e4faa934)(panelsArray, prevSizes, nextSizes);
             setSizes(nextSizes);
         }
     }, []);
-    const context = (0, $b2QPe$react.useMemo)(()=>({
+    const context = (0, $2IMI0$react.useMemo)(()=>({
             activeHandleId: activeHandleId,
             collapsePanel: collapsePanel,
             direction: direction,
@@ -836,11 +883,19 @@ function $19bf0050f73d236b$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
             resizePanel: resizePanel,
             startDragging: (id, event)=>{
                 setActiveHandleId(id);
-                dragOffsetRef.current = (0, $f5af57c8e042a4ad$export$ec391ce65b083ed4)(event, id, direction);
+                if ((0, $47eee9224cfec8e8$export$764db16956f554f8)(event) || (0, $47eee9224cfec8e8$export$c4dfce035d43d1e0)(event)) {
+                    const handleElement = (0, $cda3cc4b1114cf23$export$2e27d3a347680388)(id);
+                    initialDragStateRef.current = {
+                        dragHandleRect: handleElement.getBoundingClientRect(),
+                        dragOffset: (0, $47eee9224cfec8e8$export$ec391ce65b083ed4)(event, id, direction),
+                        sizes: committedValuesRef.current.sizes
+                    };
+                }
             },
             stopDragging: ()=>{
-                (0, $102aa6bc0f99b2b3$export$b61932ee18f96e08)();
+                (0, $08745f7373322b05$export$b61932ee18f96e08)();
                 setActiveHandleId(null);
+                initialDragStateRef.current = null;
             },
             unregisterPanel: unregisterPanel
         }), [
@@ -862,10 +917,11 @@ function $19bf0050f73d236b$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
         overflow: "hidden",
         width: "100%"
     };
-    return (0, $b2QPe$react.createElement)((0, $3251d17c1c3bce6c$export$7d8c6d083caec74a).Provider, {
-        children: (0, $b2QPe$react.createElement)(Type, {
+    return (0, $2IMI0$react.createElement)((0, $b9cf028330e7f243$export$7d8c6d083caec74a).Provider, {
+        children: (0, $2IMI0$react.createElement)(Type, {
             children: children,
             className: classNameFromProps,
+            "data-panel-group": "",
             "data-panel-group-direction": direction,
             "data-panel-group-id": groupId,
             style: {
@@ -879,7 +935,7 @@ function $19bf0050f73d236b$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
 // Workaround for Parcel scope hoisting (which renames objects/functions).
 // Casting to :any is required to avoid corrupting the generated TypeScript types.
 // See github.com/parcel-bundler/parcel/issues/8724
-$19bf0050f73d236b$export$1d05749f6f573bb.displayName = "PanelGroup";
+$cec4cafe75f3db78$export$1d05749f6f573bb.displayName = "PanelGroup";
 
 
 
@@ -887,16 +943,16 @@ $19bf0050f73d236b$export$1d05749f6f573bb.displayName = "PanelGroup";
 
 
 
-function $01377e07790cf46f$export$8829ecf6b6b15484({ children: children = null , className: classNameFromProps = "" , disabled: disabled = false , id: idFromProps = null , style: styleFromProps = {} , tagName: Type = "div"  }) {
-    const divElementRef = (0, $b2QPe$react.useRef)(null);
-    const panelGroupContext = (0, $b2QPe$react.useContext)((0, $3251d17c1c3bce6c$export$7d8c6d083caec74a));
+function $3a26a712c9163348$export$8829ecf6b6b15484({ children: children = null , className: classNameFromProps = "" , disabled: disabled = false , id: idFromProps = null , style: styleFromProps = {} , tagName: Type = "div"  }) {
+    const divElementRef = (0, $2IMI0$react.useRef)(null);
+    const panelGroupContext = (0, $2IMI0$react.useContext)((0, $b9cf028330e7f243$export$7d8c6d083caec74a));
     if (panelGroupContext === null) throw Error(`PanelResizeHandle components must be rendered within a PanelGroup container`);
     const { activeHandleId: activeHandleId , direction: direction , groupId: groupId , registerResizeHandle: registerResizeHandle , startDragging: startDragging , stopDragging: stopDragging  } = panelGroupContext;
-    const resizeHandleId = (0, $6d548a0d130941e3$export$2e2bcd8739ae039)(idFromProps);
+    const resizeHandleId = (0, $b1693d8d8f570e9c$export$2e2bcd8739ae039)(idFromProps);
     const isDragging = activeHandleId === resizeHandleId;
-    const [isFocused, setIsFocused] = (0, $b2QPe$react.useState)(false);
-    const [resizeHandler, setResizeHandler] = (0, $b2QPe$react.useState)(null);
-    const stopDraggingAndBlur = (0, $b2QPe$react.useCallback)(()=>{
+    const [isFocused, setIsFocused] = (0, $2IMI0$react.useState)(false);
+    const [resizeHandler, setResizeHandler] = (0, $2IMI0$react.useState)(null);
+    const stopDraggingAndBlur = (0, $2IMI0$react.useCallback)(()=>{
         // Clicking on the drag handle shouldn't leave it focused;
         // That would cause the PanelGroup to think it was still active.
         const div = divElementRef.current;
@@ -905,7 +961,7 @@ function $01377e07790cf46f$export$8829ecf6b6b15484({ children: children = null ,
     }, [
         stopDragging
     ]);
-    (0, $b2QPe$react.useEffect)(()=>{
+    (0, $2IMI0$react.useEffect)(()=>{
         if (disabled) setResizeHandler(null);
         else {
             const resizeHandler = registerResizeHandle(resizeHandleId);
@@ -916,7 +972,7 @@ function $01377e07790cf46f$export$8829ecf6b6b15484({ children: children = null ,
         resizeHandleId,
         registerResizeHandle
     ]);
-    (0, $b2QPe$react.useEffect)(()=>{
+    (0, $2IMI0$react.useEffect)(()=>{
         if (disabled || resizeHandler == null || !isDragging) return;
         const onMove = (event)=>{
             resizeHandler(event);
@@ -940,17 +996,17 @@ function $01377e07790cf46f$export$8829ecf6b6b15484({ children: children = null ,
         resizeHandler,
         stopDraggingAndBlur
     ]);
-    (0, $63be9a96d8675f03$export$33b0bea6ac3ffb03)({
+    (0, $a695670cc57a5969$export$33b0bea6ac3ffb03)({
         disabled: disabled,
         handleId: resizeHandleId,
         resizeHandler: resizeHandler
     });
     const style = {
-        cursor: (0, $102aa6bc0f99b2b3$export$fa35f3322c52262f)(direction),
+        cursor: (0, $08745f7373322b05$export$fa35f3322c52262f)(direction),
         touchAction: "none",
         userSelect: "none"
     };
-    return (0, $b2QPe$react.createElement)(Type, {
+    return (0, $2IMI0$react.createElement)(Type, {
         children: children,
         className: classNameFromProps,
         "data-resize-handle-active": isDragging ? "pointer" : isFocused ? "keyboard" : undefined,
@@ -977,7 +1033,7 @@ function $01377e07790cf46f$export$8829ecf6b6b15484({ children: children = null ,
 // Workaround for Parcel scope hoisting (which renames objects/functions).
 // Casting to :any is required to avoid corrupting the generated TypeScript types.
 // See github.com/parcel-bundler/parcel/issues/8724
-$01377e07790cf46f$export$8829ecf6b6b15484.displayName = "PanelResizeHandle";
+$3a26a712c9163348$export$8829ecf6b6b15484.displayName = "PanelResizeHandle";