react-resizable-panels 0.0.37 → 0.0.39

package/.eslintrc.json

@@ -0,0 +1,22 @@
+{
+  "ignorePatterns": [".parcel-cache", "dist", "node_modules"],
+  "parser": "@typescript-eslint/parser",
+  "parserOptions": { "project": ["../../tsconfig.json"] },
+  "plugins": ["@typescript-eslint", "no-restricted-imports", "react-hooks"],
+  "root": true,
+  "rules": {
+    "no-restricted-imports": [
+      "error",
+      {
+        "paths": ["react"]
+      }
+    ],
+    "react-hooks/rules-of-hooks": "error",
+    "react-hooks/exhaustive-deps": [
+      "warn",
+      {
+        "additionalHooks": "(useIsomorphicLayoutEffect)"
+      }
+    ]
+  }
+}

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # Changelog
 
+## 0.0.39
+* [#118](https://github.com/bvaughn/react-resizable-panels/issues/118): Fix import regression from 0.0.38.
+
+## 0.0.38
+* [#117](https://github.com/bvaughn/react-resizable-panels/issues/117): `Panel` collapse behavior works better near viewport edges.
+* [#115](https://github.com/bvaughn/react-resizable-panels/pull/115): `PanelResizeHandle` logic calls `event.preventDefault` for events it handles.
+* [#82](https://github.com/bvaughn/react-resizable-panels/issues/82): `useId` import changed to avoid triggering errors with older versions of React. (Note this may have an impact on tree-shaking though it is presumed to be minimal, given the small `"react"` package size.)
+
 ## 0.0.37
 * [#94](https://github.com/bvaughn/react-resizable-panels/issues/94): Add `onDragging` prop to `PanelResizeHandle` to be notified of when dragging starts/stops.
 

package/dist/react-resizable-panels.d.ts

@@ -1,4 +1,4 @@
-import { RefObject, CSSProperties, ElementType, ReactNode } from "react";
+import { CSSProperties, ElementType, ReactNode, RefObject } from "react";
 type Direction = "horizontal" | "vertical";
 export type PanelGroupStorage = {
     getItem(name: string): string | null;

package/dist/react-resizable-panels.d.ts.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/react-resizable-panels/src/src/hooks/useIsomorphicEffect.ts","packages/react-resizable-panels/src/src/hooks/useUniqueId.ts","packages/react-resizable-panels/src/src/types.ts","packages/react-resizable-panels/src/src/PanelContexts.ts","packages/react-resizable-panels/src/src/Panel.ts","packages/react-resizable-panels/src/src/utils/serialization.ts","packages/react-resizable-panels/src/src/constants.ts","packages/react-resizable-panels/src/src/utils/group.ts","packages/react-resizable-panels/src/src/utils/coordinates.ts","packages/react-resizable-panels/src/src/hooks/useWindowSplitterBehavior.ts","packages/react-resizable-panels/src/src/utils/cursor.ts","packages/react-resizable-panels/src/src/utils/debounce.ts","packages/react-resizable-panels/src/src/utils/arrays.ts","packages/react-resizable-panels/src/src/PanelGroup.ts","packages/react-resizable-panels/src/src/PanelResizeHandle.ts","packages/react-resizable-panels/src/src/index.ts","packages/react-resizable-panels/src/index.ts"],"sourcesContent":[null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,"import { Panel } from \"./Panel\";\nimport { PanelGroup } from \"./PanelGroup\";\nimport { PanelResizeHandle } from \"./PanelResizeHandle\";\n\nimport type { ImperativePanelHandle, PanelProps } from \"./Panel\";\nimport type { PanelGroupProps } from \"./PanelGroup\";\nimport type { PanelResizeHandleProps } from \"./PanelResizeHandle\";\nimport type { PanelGroupStorage } from \"./types\";\n\nexport {\n  Panel,\n  PanelGroup,\n  PanelResizeHandle,\n\n  // TypeScript types\n  ImperativePanelHandle,\n  PanelGroupProps,\n  PanelGroupStorage,\n  PanelProps,\n  PanelResizeHandleProps,\n};\n"],"names":[],"version":3,"file":"react-resizable-panels.d.ts.map"}
+{"mappings":"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","sources":["packages/react-resizable-panels/src/src/vendor/react.ts","packages/react-resizable-panels/src/src/hooks/useIsomorphicEffect.ts","packages/react-resizable-panels/src/src/hooks/useUniqueId.ts","packages/react-resizable-panels/src/src/types.ts","packages/react-resizable-panels/src/src/PanelContexts.ts","packages/react-resizable-panels/src/src/Panel.ts","packages/react-resizable-panels/src/src/utils/serialization.ts","packages/react-resizable-panels/src/src/constants.ts","packages/react-resizable-panels/src/src/utils/group.ts","packages/react-resizable-panels/src/src/utils/coordinates.ts","packages/react-resizable-panels/src/src/hooks/useWindowSplitterBehavior.ts","packages/react-resizable-panels/src/src/utils/cursor.ts","packages/react-resizable-panels/src/src/utils/debounce.ts","packages/react-resizable-panels/src/src/utils/arrays.ts","packages/react-resizable-panels/src/src/PanelGroup.ts","packages/react-resizable-panels/src/src/PanelResizeHandle.ts","packages/react-resizable-panels/src/src/index.ts","packages/react-resizable-panels/src/index.ts"],"sourcesContent":[null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,"import { Panel } from \"./Panel\";\nimport { PanelGroup } from \"./PanelGroup\";\nimport { PanelResizeHandle } from \"./PanelResizeHandle\";\n\nimport type { ImperativePanelHandle, PanelProps } from \"./Panel\";\nimport type { PanelGroupProps } from \"./PanelGroup\";\nimport type { PanelResizeHandleProps } from \"./PanelResizeHandle\";\nimport type { PanelGroupStorage } from \"./types\";\n\nexport {\n  Panel,\n  PanelGroup,\n  PanelResizeHandle,\n\n  // TypeScript types\n  ImperativePanelHandle,\n  PanelGroupProps,\n  PanelGroupStorage,\n  PanelProps,\n  PanelResizeHandleProps,\n};\n"],"names":[],"version":3,"file":"react-resizable-panels.d.ts.map"}

package/dist/react-resizable-panels.js

@@ -7,25 +7,37 @@ function $parcel$export(e, n, v, s) {
 $parcel$export(module.exports, "Panel", () => $45da0e827c614f1d$export$2ddb90ad54e5f587);
 $parcel$export(module.exports, "PanelGroup", () => $cec4cafe75f3db78$export$1d05749f6f573bb);
 $parcel$export(module.exports, "PanelResizeHandle", () => $3a26a712c9163348$export$8829ecf6b6b15484);
+// This module exists to work around Webpack issue https://github.com/webpack/webpack/issues/14814
+// and limitations with ParcelJS parsing of the useId workaround (used below).
+// For the time being, all react-resizable-panels must import "react" with the "* as React" syntax.
+// To avoid mistakes, we use the ESLint "no-restricted-imports" to prevent "react" imports except in this file.
+// See https://github.com/bvaughn/react-resizable-panels/issues/118
+// eslint-disable-next-line no-restricted-imports
+
+const { createElement: $6e687094f9ca8395$export$c8a8987d4410bf2d , createContext: $6e687094f9ca8395$export$fd42f52fd3ae1109 , forwardRef: $6e687094f9ca8395$export$257a8862b851cb5b , useCallback: $6e687094f9ca8395$export$35808ee640e87ca7 , useContext: $6e687094f9ca8395$export$fae74005e78b1a27 , useEffect: $6e687094f9ca8395$export$6d9c69b0de29b591 , useImperativeHandle: $6e687094f9ca8395$export$d5a552a76deda3c2 , useLayoutEffect: $6e687094f9ca8395$export$e5c5a5f917a5871c , useMemo: $6e687094f9ca8395$export$1538c33de8887b59 , useRef: $6e687094f9ca8395$export$b8f5890fc79d6aca , useState: $6e687094f9ca8395$export$60241385465d0a34  } = $2IMI0$react;
+// `toString()` prevents bundlers from trying to `import { useId } from 'react'`
+const $6e687094f9ca8395$export$f680877a34711e37 = $2IMI0$react["useId".toString()];
+
 
 
 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) : ()=>{};
+const $129b5b9a317dcc10$var$useIsomorphicLayoutEffect = $129b5b9a317dcc10$var$canUseEffectHooks ? (0, $6e687094f9ca8395$export$e5c5a5f917a5871c) : ()=>{};
 var $129b5b9a317dcc10$export$2e2bcd8739ae039 = $129b5b9a317dcc10$var$useIsomorphicLayoutEffect;
 
 
 
+const $b1693d8d8f570e9c$var$wrappedUseId = typeof (0, $6e687094f9ca8395$export$f680877a34711e37) === "function" ? (0, $6e687094f9ca8395$export$f680877a34711e37) : ()=>null;
 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);
+    const idFromUseId = $b1693d8d8f570e9c$var$wrappedUseId();
+    const idRef = (0, $6e687094f9ca8395$export$b8f5890fc79d6aca)(idFromParams || idFromUseId || null);
     if (idRef.current === null) idRef.current = "" + $b1693d8d8f570e9c$var$counter++;
     return idRef.current;
 }
 
 
 
-const $b9cf028330e7f243$export$7d8c6d083caec74a = (0, $2IMI0$react.createContext)(null);
+const $b9cf028330e7f243$export$7d8c6d083caec74a = (0, $6e687094f9ca8395$export$fd42f52fd3ae1109)(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
@@ -33,16 +45,16 @@ $b9cf028330e7f243$export$7d8c6d083caec74a.displayName = "PanelGroupContext";
 
 
 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));
+    const context = (0, $6e687094f9ca8395$export$fae74005e78b1a27)((0, $b9cf028330e7f243$export$7d8c6d083caec74a));
     if (context === null) throw Error(`Panel components must be rendered within a PanelGroup container`);
     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, $2IMI0$react.useRef)({
+    const callbacksRef = (0, $6e687094f9ca8395$export$b8f5890fc79d6aca)({
         onCollapse: onCollapse,
         onResize: onResize
     });
-    (0, $2IMI0$react.useEffect)(()=>{
+    (0, $6e687094f9ca8395$export$6d9c69b0de29b591)(()=>{
         callbacksRef.current.onCollapse = onCollapse;
         callbacksRef.current.onResize = onResize;
     });
@@ -81,13 +93,13 @@ function $45da0e827c614f1d$var$PanelWithForwardedRef({ children: children = null
         unregisterPanel
     ]);
     const style = getPanelStyle(panelId);
-    const committedValuesRef = (0, $2IMI0$react.useRef)({
+    const committedValuesRef = (0, $6e687094f9ca8395$export$b8f5890fc79d6aca)({
         size: $45da0e827c614f1d$var$parseSizeFromStyle(style)
     });
     (0, $129b5b9a317dcc10$export$2e2bcd8739ae039)(()=>{
         committedValuesRef.current.size = $45da0e827c614f1d$var$parseSizeFromStyle(style);
     });
-    (0, $2IMI0$react.useImperativeHandle)(forwardedRef, ()=>({
+    (0, $6e687094f9ca8395$export$d5a552a76deda3c2)(forwardedRef, ()=>({
             collapse: ()=>collapsePanel(panelId),
             expand: ()=>expandPanel(panelId),
             getCollapsed () {
@@ -103,7 +115,7 @@ function $45da0e827c614f1d$var$PanelWithForwardedRef({ children: children = null
         panelId,
         resizePanel
     ]);
-    return (0, $2IMI0$react.createElement)(Type, {
+    return (0, $6e687094f9ca8395$export$c8a8987d4410bf2d)(Type, {
         children: children,
         className: classNameFromProps,
         "data-panel": "",
@@ -117,7 +129,7 @@ function $45da0e827c614f1d$var$PanelWithForwardedRef({ children: children = null
         }
     });
 }
-const $45da0e827c614f1d$export$2ddb90ad54e5f587 = (0, $2IMI0$react.forwardRef)((props, ref)=>(0, $2IMI0$react.createElement)($45da0e827c614f1d$var$PanelWithForwardedRef, {
+const $45da0e827c614f1d$export$2ddb90ad54e5f587 = (0, $6e687094f9ca8395$export$257a8862b851cb5b)((props, ref)=>(0, $6e687094f9ca8395$export$c8a8987d4410bf2d)($45da0e827c614f1d$var$PanelWithForwardedRef, {
         ...props,
         forwardedRef: ref
     }));
@@ -426,7 +438,7 @@ function $47eee9224cfec8e8$export$c4dfce035d43d1e0(event) {
 
 
 function $a695670cc57a5969$export$d9fcbe062527d159({ committedValuesRef: committedValuesRef , groupId: groupId , panels: panels , setSizes: setSizes , sizes: sizes , panelSizeBeforeCollapse: panelSizeBeforeCollapse  }) {
-    (0, $2IMI0$react.useEffect)(()=>{
+    (0, $6e687094f9ca8395$export$6d9c69b0de29b591)(()=>{
         const { direction: direction , panels: panels  } = committedValuesRef.current;
         const groupElement = (0, $cda3cc4b1114cf23$export$5e67632cf3550a9c)(groupId);
         const { height: height , width: width  } = groupElement.getBoundingClientRect();
@@ -457,9 +469,11 @@ function $a695670cc57a5969$export$d9fcbe062527d159({ committedValuesRef: committ
             handle.setAttribute("aria-valuemin", "" + Math.round(ariaValueMin));
             handle.setAttribute("aria-valuenow", "" + Math.round(parseInt(flexGrow)));
             const onKeyDown = (event)=>{
+                if (event.defaultPrevented) return;
                 switch(event.key){
                     case "Enter":
                         {
+                            event.preventDefault();
                             const index = panelsArray.findIndex((panel)=>panel.id === idBefore);
                             if (index >= 0) {
                                 const panelData = panelsArray[index];
@@ -491,17 +505,21 @@ function $a695670cc57a5969$export$d9fcbe062527d159({ committedValuesRef: committ
             cleanupFunctions.forEach((cleanupFunction)=>cleanupFunction());
         };
     }, [
+        committedValuesRef,
         groupId,
         panels,
+        panelSizeBeforeCollapse,
+        setSizes,
         sizes
     ]);
 }
 function $a695670cc57a5969$export$33b0bea6ac3ffb03({ disabled: disabled , handleId: handleId , resizeHandler: resizeHandler  }) {
-    (0, $2IMI0$react.useEffect)(()=>{
+    (0, $6e687094f9ca8395$export$6d9c69b0de29b591)(()=>{
         if (disabled || resizeHandler == null) return;
         const handleElement = (0, $cda3cc4b1114cf23$export$2e27d3a347680388)(handleId);
         if (handleElement == null) return;
         const onKeyDown = (event)=>{
+            if (event.defaultPrevented) return;
             switch(event.key){
                 case "ArrowDown":
                 case "ArrowLeft":
@@ -509,10 +527,12 @@ function $a695670cc57a5969$export$33b0bea6ac3ffb03({ disabled: disabled , handle
                 case "ArrowUp":
                 case "End":
                 case "Home":
+                    event.preventDefault();
                     resizeHandler(event);
                     break;
                 case "F6":
                     {
+                        event.preventDefault();
                         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;
@@ -603,26 +623,26 @@ const $cec4cafe75f3db78$var$defaultStorage = {
 };
 function $cec4cafe75f3db78$export$1d05749f6f573bb({ autoSaveId: autoSaveId , children: children = null , className: classNameFromProps = "" , direction: direction , disablePointerEventsDuringResize: disablePointerEventsDuringResize = false , 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());
+    const [activeHandleId, setActiveHandleId] = (0, $6e687094f9ca8395$export$60241385465d0a34)(null);
+    const [panels, setPanels] = (0, $6e687094f9ca8395$export$60241385465d0a34)(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);
+    const initialDragStateRef = (0, $6e687094f9ca8395$export$b8f5890fc79d6aca)(null);
     // Use a ref to guard against users passing inline props
-    const callbacksRef = (0, $2IMI0$react.useRef)({
+    const callbacksRef = (0, $6e687094f9ca8395$export$b8f5890fc79d6aca)({
         onLayout: onLayout
     });
-    (0, $2IMI0$react.useEffect)(()=>{
+    (0, $6e687094f9ca8395$export$6d9c69b0de29b591)(()=>{
         callbacksRef.current.onLayout = onLayout;
     });
     // 0-1 values representing the relative size of each panel.
-    const [sizes, setSizes] = (0, $2IMI0$react.useState)([]);
+    const [sizes, setSizes] = (0, $6e687094f9ca8395$export$60241385465d0a34)([]);
     // Used to support imperative collapse/expand API.
-    const panelSizeBeforeCollapse = (0, $2IMI0$react.useRef)(new Map());
-    const prevDeltaRef = (0, $2IMI0$react.useRef)(0);
+    const panelSizeBeforeCollapse = (0, $6e687094f9ca8395$export$b8f5890fc79d6aca)(new Map());
+    const prevDeltaRef = (0, $6e687094f9ca8395$export$b8f5890fc79d6aca)(0);
     // Store committed values to avoid unnecessarily re-running memoization/effects functions.
-    const committedValuesRef = (0, $2IMI0$react.useRef)({
+    const committedValuesRef = (0, $6e687094f9ca8395$export$b8f5890fc79d6aca)({
         direction: direction,
         panels: panels,
         sizes: sizes
@@ -641,7 +661,7 @@ function $cec4cafe75f3db78$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
         panelSizeBeforeCollapse: panelSizeBeforeCollapse
     });
     // Notify external code when sizes have changed.
-    (0, $2IMI0$react.useEffect)(()=>{
+    (0, $6e687094f9ca8395$export$6d9c69b0de29b591)(()=>{
         const { onLayout: onLayout  } = callbacksRef.current;
         if (onLayout) {
             const { sizes: sizes  } = committedValuesRef.current;
@@ -653,7 +673,7 @@ function $cec4cafe75f3db78$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, $2IMI0$react.useRef)(false);
+    const didNotifyCallbacksAfterMountRef = (0, $6e687094f9ca8395$export$b8f5890fc79d6aca)(false);
     (0, $129b5b9a317dcc10$export$2e2bcd8739ae039)(()=>{
         if (didNotifyCallbacksAfterMountRef.current) return;
         const { panels: panels , sizes: sizes  } = committedValuesRef.current;
@@ -703,9 +723,10 @@ function $cec4cafe75f3db78$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
         }
     }, [
         autoSaveId,
-        panels
+        panels,
+        storage
     ]);
-    (0, $2IMI0$react.useEffect)(()=>{
+    (0, $6e687094f9ca8395$export$6d9c69b0de29b591)(()=>{
         // 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;
@@ -715,9 +736,10 @@ function $cec4cafe75f3db78$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
     }, [
         autoSaveId,
         panels,
-        sizes
+        sizes,
+        storage
     ]);
-    const getPanelStyle = (0, $2IMI0$react.useCallback)((id)=>{
+    const getPanelStyle = (0, $6e687094f9ca8395$export$35808ee640e87ca7)((id)=>{
         const { panels: panels  } = committedValuesRef.current;
         // Before mounting, Panels will not yet have registered themselves.
         // This includes server rendering.
@@ -742,10 +764,10 @@ function $cec4cafe75f3db78$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
         };
     }, [
         activeHandleId,
-        direction,
+        disablePointerEventsDuringResize,
         sizes
     ]);
-    const registerPanel = (0, $2IMI0$react.useCallback)((id, panel)=>{
+    const registerPanel = (0, $6e687094f9ca8395$export$35808ee640e87ca7)((id, panel)=>{
         setPanels((prevPanels)=>{
             if (prevPanels.has(id)) return prevPanels;
             const nextPanels = new Map(prevPanels);
@@ -753,7 +775,7 @@ function $cec4cafe75f3db78$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
             return nextPanels;
         });
     }, []);
-    const registerResizeHandle = (0, $2IMI0$react.useCallback)((handleId)=>{
+    const registerResizeHandle = (0, $6e687094f9ca8395$export$35808ee640e87ca7)((handleId)=>{
         const resizeHandler = (event)=>{
             event.preventDefault();
             const { direction: direction , panels: panels , sizes: prevSizes  } = committedValuesRef.current;
@@ -796,7 +818,7 @@ function $cec4cafe75f3db78$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
     }, [
         groupId
     ]);
-    const unregisterPanel = (0, $2IMI0$react.useCallback)((id)=>{
+    const unregisterPanel = (0, $6e687094f9ca8395$export$35808ee640e87ca7)((id)=>{
         setPanels((prevPanels)=>{
             if (!prevPanels.has(id)) return prevPanels;
             const nextPanels = new Map(prevPanels);
@@ -804,7 +826,7 @@ function $cec4cafe75f3db78$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
             return nextPanels;
         });
     }, []);
-    const collapsePanel = (0, $2IMI0$react.useCallback)((id)=>{
+    const collapsePanel = (0, $6e687094f9ca8395$export$35808ee640e87ca7)((id)=>{
         const { panels: panels , sizes: prevSizes  } = committedValuesRef.current;
         const panel = panels.get(id);
         if (panel == null || !panel.collapsible) return;
@@ -826,7 +848,7 @@ function $cec4cafe75f3db78$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
             setSizes(nextSizes);
         }
     }, []);
-    const expandPanel = (0, $2IMI0$react.useCallback)((id)=>{
+    const expandPanel = (0, $6e687094f9ca8395$export$35808ee640e87ca7)((id)=>{
         const { panels: panels , sizes: prevSizes  } = committedValuesRef.current;
         const panel = panels.get(id);
         if (panel == null) return;
@@ -849,7 +871,7 @@ function $cec4cafe75f3db78$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
             setSizes(nextSizes);
         }
     }, []);
-    const resizePanel = (0, $2IMI0$react.useCallback)((id, nextSize)=>{
+    const resizePanel = (0, $6e687094f9ca8395$export$35808ee640e87ca7)((id, nextSize)=>{
         const { panels: panels , sizes: prevSizes  } = committedValuesRef.current;
         const panel = panels.get(id);
         if (panel == null) return;
@@ -871,7 +893,7 @@ function $cec4cafe75f3db78$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
             setSizes(nextSizes);
         }
     }, []);
-    const context = (0, $2IMI0$react.useMemo)(()=>({
+    const context = (0, $6e687094f9ca8395$export$1538c33de8887b59)(()=>({
             activeHandleId: activeHandleId,
             collapsePanel: collapsePanel,
             direction: direction,
@@ -917,8 +939,8 @@ function $cec4cafe75f3db78$export$1d05749f6f573bb({ autoSaveId: autoSaveId , chi
         overflow: "hidden",
         width: "100%"
     };
-    return (0, $2IMI0$react.createElement)((0, $b9cf028330e7f243$export$7d8c6d083caec74a).Provider, {
-        children: (0, $2IMI0$react.createElement)(Type, {
+    return (0, $6e687094f9ca8395$export$c8a8987d4410bf2d)((0, $b9cf028330e7f243$export$7d8c6d083caec74a).Provider, {
+        children: (0, $6e687094f9ca8395$export$c8a8987d4410bf2d)(Type, {
             children: children,
             className: classNameFromProps,
             "data-panel-group": "",
@@ -944,22 +966,22 @@ $cec4cafe75f3db78$export$1d05749f6f573bb.displayName = "PanelGroup";
 
 
 function $3a26a712c9163348$export$8829ecf6b6b15484({ children: children = null , className: classNameFromProps = "" , disabled: disabled = false , id: idFromProps = null , onDragging: onDragging = null , style: styleFromProps = {} , tagName: Type = "div"  }) {
-    const divElementRef = (0, $2IMI0$react.useRef)(null);
+    const divElementRef = (0, $6e687094f9ca8395$export$b8f5890fc79d6aca)(null);
     // Use a ref to guard against users passing inline props
-    const callbacksRef = (0, $2IMI0$react.useRef)({
+    const callbacksRef = (0, $6e687094f9ca8395$export$b8f5890fc79d6aca)({
         onDragging: onDragging
     });
-    (0, $2IMI0$react.useEffect)(()=>{
+    (0, $6e687094f9ca8395$export$6d9c69b0de29b591)(()=>{
         callbacksRef.current.onDragging = onDragging;
     });
-    const panelGroupContext = (0, $2IMI0$react.useContext)((0, $b9cf028330e7f243$export$7d8c6d083caec74a));
+    const panelGroupContext = (0, $6e687094f9ca8395$export$fae74005e78b1a27)((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, $b1693d8d8f570e9c$export$2e2bcd8739ae039)(idFromProps);
     const isDragging = activeHandleId === resizeHandleId;
-    const [isFocused, setIsFocused] = (0, $2IMI0$react.useState)(false);
-    const [resizeHandler, setResizeHandler] = (0, $2IMI0$react.useState)(null);
-    const stopDraggingAndBlur = (0, $2IMI0$react.useCallback)(()=>{
+    const [isFocused, setIsFocused] = (0, $6e687094f9ca8395$export$60241385465d0a34)(false);
+    const [resizeHandler, setResizeHandler] = (0, $6e687094f9ca8395$export$60241385465d0a34)(null);
+    const stopDraggingAndBlur = (0, $6e687094f9ca8395$export$35808ee640e87ca7)(()=>{
         // 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;
@@ -970,7 +992,7 @@ function $3a26a712c9163348$export$8829ecf6b6b15484({ children: children = null ,
     }, [
         stopDragging
     ]);
-    (0, $2IMI0$react.useEffect)(()=>{
+    (0, $6e687094f9ca8395$export$6d9c69b0de29b591)(()=>{
         if (disabled) setResizeHandler(null);
         else {
             const resizeHandler = registerResizeHandle(resizeHandleId);
@@ -981,20 +1003,27 @@ function $3a26a712c9163348$export$8829ecf6b6b15484({ children: children = null ,
         resizeHandleId,
         registerResizeHandle
     ]);
-    (0, $2IMI0$react.useEffect)(()=>{
+    (0, $6e687094f9ca8395$export$6d9c69b0de29b591)(()=>{
         if (disabled || resizeHandler == null || !isDragging) return;
         const onMove = (event)=>{
             resizeHandler(event);
         };
-        document.body.addEventListener("contextmenu", stopDraggingAndBlur);
-        document.body.addEventListener("mousemove", onMove);
-        document.body.addEventListener("touchmove", onMove);
+        const onMouseLeave = (event)=>{
+            resizeHandler(event);
+        };
+        const divElement = divElementRef.current;
+        const targetDocument = divElement.ownerDocument;
+        targetDocument.body.addEventListener("contextmenu", stopDraggingAndBlur);
+        targetDocument.body.addEventListener("mousemove", onMove);
+        targetDocument.body.addEventListener("touchmove", onMove);
+        targetDocument.body.addEventListener("mouseleave", onMouseLeave);
         window.addEventListener("mouseup", stopDraggingAndBlur);
         window.addEventListener("touchend", stopDraggingAndBlur);
         return ()=>{
-            document.body.removeEventListener("contextmenu", stopDraggingAndBlur);
-            document.body.removeEventListener("mousemove", onMove);
-            document.body.removeEventListener("touchmove", onMove);
+            targetDocument.body.removeEventListener("contextmenu", stopDraggingAndBlur);
+            targetDocument.body.removeEventListener("mousemove", onMove);
+            targetDocument.body.removeEventListener("touchmove", onMove);
+            targetDocument.body.removeEventListener("mouseleave", onMouseLeave);
             window.removeEventListener("mouseup", stopDraggingAndBlur);
             window.removeEventListener("touchend", stopDraggingAndBlur);
         };
@@ -1015,7 +1044,7 @@ function $3a26a712c9163348$export$8829ecf6b6b15484({ children: children = null ,
         touchAction: "none",
         userSelect: "none"
     };
-    return (0, $2IMI0$react.createElement)(Type, {
+    return (0, $6e687094f9ca8395$export$c8a8987d4410bf2d)(Type, {
         children: children,
         className: classNameFromProps,
         "data-resize-handle-active": isDragging ? "pointer" : isFocused ? "keyboard" : undefined,