@asup/context-menu 2.2.0 → 2.2.2

package/dist/cjs/main.js

@@ -1,7 +1,4 @@
 require("./main.css");
-var $gTuX4$swchelperscjs_object_spreadcjs = require("@swc/helpers/cjs/_object_spread.cjs");
-var $gTuX4$swchelperscjs_object_spread_propscjs = require("@swc/helpers/cjs/_object_spread_props.cjs");
-var $gTuX4$swchelperscjs_object_without_propertiescjs = require("@swc/helpers/cjs/_object_without_properties.cjs");
 var $gTuX4$reactjsxruntime = require("react/jsx-runtime");
 var $gTuX4$react = require("react");
 var $gTuX4$reactdom = require("react-dom");
@@ -32,6 +29,8 @@ function $parcel$interopDefault(a) {
   return a && a.__esModule ? a.default : a;
 }
 
+$parcel$export(module.exports, "useMouseMove", function () { return $847f433873d20215$export$f93615b9594453fc; });
+
 
 var $a68bd8a6c0fd98c2$exports = {};
 
@@ -42,9 +41,6 @@ $parcel$export($a68bd8a6c0fd98c2$exports, "ContextMenuHandler", function () { re
 $parcel$export($a68bd8a6c0fd98c2$exports, "ContextWindow", function () { return $46fb0088a1bbb6d8$export$1af8984c69ba1b24; });
 
 
-
-
-
 var $796f463330153c24$exports = {};
 
 $parcel$export($796f463330153c24$exports, "autoHeightInner", function () { return $796f463330153c24$export$df919f6b0f7f84e6; }, function (v) { return $796f463330153c24$export$df919f6b0f7f84e6 = v; });
@@ -55,12 +51,7 @@ $796f463330153c24$export$df919f6b0f7f84e6 = `aiw-AutoHeight-module-pDlSVW-autoHe
 $796f463330153c24$export$563bd8f955c52746 = `aiw-AutoHeight-module-pDlSVW-autoHeightWrapper`;
 
 
-function $95149596d5a7ed2b$export$77bf000da9303d1(_param) {
-    var { children: children, hide: hide = false, duration: duration = 300 } = _param, rest = (0, $gTuX4$swchelperscjs_object_without_propertiescjs._)(_param, [
-        "children",
-        "hide",
-        "duration"
-    ]);
+function $95149596d5a7ed2b$export$77bf000da9303d1({ children: children, hide: hide = false, duration: duration = 300, ...rest }) {
     const wrapperRef = (0, $gTuX4$react.useRef)(null);
     const innerRef = (0, $gTuX4$react.useRef)(null);
     const [height, setHeight] = (0, $gTuX4$react.useState)(null);
@@ -143,20 +134,22 @@ function $95149596d5a7ed2b$export$77bf000da9303d1(_param) {
             }
         };
     }, []);
-    return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", (0, $gTuX4$swchelperscjs_object_spread_propscjs._)((0, $gTuX4$swchelperscjs_object_spreadcjs._)({}, rest), {
+    return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
+        ...rest,
         className: (0, (/*@__PURE__*/$parcel$interopDefault($796f463330153c24$exports))).autoHeightWrapper,
         ref: wrapperRef,
-        style: (0, $gTuX4$swchelperscjs_object_spread_propscjs._)((0, $gTuX4$swchelperscjs_object_spreadcjs._)({}, rest.style), {
+        style: {
+            ...rest.style,
             display: animationState === "closed" ? "none" : undefined,
             height: height ? `${height}px` : "auto",
             transitionDuration: `${duration}ms`
-        }),
+        },
         children: /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
             className: (0, (/*@__PURE__*/$parcel$interopDefault($796f463330153c24$exports))).autoHeightInner,
             ref: innerRef,
             children: targetChildren
         })
-    }));
+    });
 }
 $95149596d5a7ed2b$export$77bf000da9303d1.displayName = "AutoHeight";
 
@@ -166,9 +159,6 @@ $95149596d5a7ed2b$export$77bf000da9303d1.displayName = "AutoHeight";
 
 
 
-
-
-
 var $da5a7b95ca760552$exports = {};
 
 $parcel$export($da5a7b95ca760552$exports, "anchor", function () { return $da5a7b95ca760552$export$2e2992790a6f69a8; }, function (v) { return $da5a7b95ca760552$export$2e2992790a6f69a8 = v; });
@@ -336,12 +326,7 @@ $5150b66b01c99189$export$8dc6765e8be191c7.displayName = "ContextMenu";
 
 
 
-const $a79b75d040e03c92$export$d4ebdd58e04c6ace = (_param)=>{
-    var { id: id, menuItems: menuItems, children: children } = _param, rest = (0, $gTuX4$swchelperscjs_object_without_propertiescjs._)(_param, [
-        "id",
-        "menuItems",
-        "children"
-    ]);
+const $a79b75d040e03c92$export$d4ebdd58e04c6ace = ({ id: id, menuItems: menuItems, children: children, ...rest })=>{
     // Menu state
     const [menuInDom, setMenuInDom] = (0, $gTuX4$react.useState)(false);
     const [menuVisible, setMenuVisible] = (0, $gTuX4$react.useState)(false);
@@ -391,10 +376,10 @@ const $a79b75d040e03c92$export$d4ebdd58e04c6ace = (_param)=>{
     ]);
     return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)((0, $gTuX4$reactjsxruntime.Fragment), {
         children: [
-            /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", (0, $gTuX4$swchelperscjs_object_spread_propscjs._)((0, $gTuX4$swchelperscjs_object_spreadcjs._)({}, rest), {
+            /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
+                ...rest,
                 id: id,
                 onClick: (e)=>{
-                    var _rest_onClick;
                     if (menuItems) {
                         setMenuInDom(true);
                         e.preventDefault();
@@ -405,10 +390,10 @@ const $a79b75d040e03c92$export$d4ebdd58e04c6ace = (_param)=>{
                             setMenuXPos(e.pageX);
                             setMenuYPos(e.pageY);
                         }, 1);
-                    } else (_rest_onClick = rest.onClick) === null || _rest_onClick === void 0 ? void 0 : _rest_onClick.call(rest, e);
+                    } else rest.onClick?.(e);
                 },
                 children: children
-            })),
+            }),
             menuInDom && menuItems && /*#__PURE__*/ (0, $gTuX4$reactdom.createPortal)(/*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
                 className: (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).anchor,
                 children: /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)((0, $5150b66b01c99189$export$8dc6765e8be191c7), {
@@ -436,9 +421,6 @@ $a79b75d040e03c92$export$d4ebdd58e04c6ace.displayName = "ClickForMenu";
 
 
 
-
-
-
 var $63cdf2819565020c$exports = {};
 
 $parcel$export($63cdf2819565020c$exports, "caretHolder", function () { return $63cdf2819565020c$export$6ed5f4fbab298e07; }, function (v) { return $63cdf2819565020c$export$6ed5f4fbab298e07 = v; });
@@ -534,10 +516,9 @@ const $b34598671fff4a77$export$aafc28aea571c4bc = ({ entry: entry })=>{
             setTarget(null);
         },
         onClick: (e)=>{
-            var _entry_action;
             e.preventDefault();
             e.stopPropagation();
-            if (!entry.disabled) (_entry_action = entry.action) === null || _entry_action === void 0 ? void 0 : _entry_action.call(entry, target);
+            if (!entry.disabled) entry.action?.(target);
         },
         children: [
             /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("span", {
@@ -583,12 +564,7 @@ const $3c568ee547c732c3$export$fc58dc71afe92de2 = /*#__PURE__*/ (0, $gTuX4$react
 function $3c568ee547c732c3$var$isDivider(label) {
     return typeof label !== "string" && label.type === "hr";
 }
-const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
-    var { children: children, menuItems: menuItems, showLowMenu: showLowMenu = false } = _param, rest = (0, $gTuX4$swchelperscjs_object_without_propertiescjs._)(_param, [
-        "children",
-        "menuItems",
-        "showLowMenu"
-    ]);
+const $3c568ee547c732c3$export$ed4f9641643dc7e4 = ({ children: children, menuItems: menuItems, showLowMenu: showLowMenu = false, ...rest })=>{
     // Check for higher content menu
     const higherContext = (0, $gTuX4$react.useContext)($3c568ee547c732c3$export$fc58dc71afe92de2);
     const thisMenuItems = [
@@ -633,7 +609,7 @@ const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
             window.addEventListener("scroll", updatePos, true);
             let ro = null;
             if (typeof ResizeObserver !== "undefined" && divHandlderRef.current) {
-                ro = new ResizeObserver(()=>updatePos());
+                ro = new ResizeObserver(updatePos);
                 ro.observe(divHandlderRef.current);
             }
             return ()=>{
@@ -648,8 +624,7 @@ const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
     ]);
     // Handle click off the menu
     const handleClick = (0, $gTuX4$react.useCallback)((e)=>{
-        var _menuRef_current;
-        if (menuRef.current && (e.target instanceof Element && !((_menuRef_current = menuRef.current) === null || _menuRef_current === void 0 ? void 0 : _menuRef_current.contains(e.target)) || !(e.target instanceof Element))) setMenuVisible(false);
+        if (menuRef.current && (e.target instanceof Element && !menuRef.current?.contains(e.target) || !(e.target instanceof Element))) setMenuVisible(false);
     }, []);
     // Update the document click handler
     (0, $gTuX4$react.useEffect)(()=>{
@@ -680,9 +655,9 @@ const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
             menuItems: thisMenuItems
         },
         children: [
-            /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", (0, $gTuX4$swchelperscjs_object_spread_propscjs._)((0, $gTuX4$swchelperscjs_object_spreadcjs._)({
-                ref: divHandlderRef
-            }, rest), {
+            /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
+                ref: divHandlderRef,
+                ...rest,
                 className: [
                     (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).contextMenuHandler,
                     rest.className
@@ -701,7 +676,6 @@ const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
                     }
                 },
                 onMouseEnter: async (e)=>{
-                    var _rest_onMouseEnter;
                     if (showLowMenu) {
                         setMenuInDom(true);
                         setMouseOverHandlerDiv(false);
@@ -710,19 +684,18 @@ const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
                             setMouseOverHandlerDiv(true);
                         }, 1);
                     }
-                    (_rest_onMouseEnter = rest.onMouseEnter) === null || _rest_onMouseEnter === void 0 ? void 0 : _rest_onMouseEnter.call(rest, e);
+                    rest.onMouseEnter?.(e);
                 },
                 onMouseLeave: async (e)=>{
-                    var _rest_onMouseLeave;
                     if (showLowMenu) {
                         removeController.current.abort();
                         removeController.current = new AbortController();
                         setMouseOverHandlerDiv(false);
                     }
-                    (_rest_onMouseLeave = rest.onMouseLeave) === null || _rest_onMouseLeave === void 0 ? void 0 : _rest_onMouseLeave.call(rest, e);
+                    rest.onMouseLeave?.(e);
                 },
                 children: children
-            })),
+            }),
             menuInDom && divHandlerPos && /*#__PURE__*/ (0, $gTuX4$reactdom.createPortal)(/*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
                 className: (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).anchor,
                 onMouseEnter: ()=>{
@@ -761,9 +734,6 @@ $3c568ee547c732c3$export$ed4f9641643dc7e4.displayName = "ContextMenuHandler";
 
 
 
-
-
-
 const $c986bcdcae4b83bd$export$d81cfea7c54be196 = (divRef)=>{
     if (!divRef.current) return {
         translateX: 0,
@@ -786,6 +756,146 @@ const $c986bcdcae4b83bd$export$d81cfea7c54be196 = (divRef)=>{
 };
 
 
+
+const $847f433873d20215$export$f93615b9594453fc = ({ onMouseDown: onMouseDownCallback, onMouseMove: onMouseMoveCallback, onMouseUp: onMouseUpCallback, onInteractionEnd: onInteractionEndCallback, interactionEndEnabled: interactionEndEnabled = true, onViewportResize: onViewportResizeCallback, viewportResizeEnabled: viewportResizeEnabled = true })=>{
+    const mouseMoveRef = (0, $gTuX4$react.useRef)(null);
+    const mouseUpRef = (0, $gTuX4$react.useRef)(null);
+    const activeInputRef = (0, $gTuX4$react.useRef)(null);
+    const mouseDownElementRef = (0, $gTuX4$react.useRef)(null);
+    const mouseDownUserSelectRef = (0, $gTuX4$react.useRef)(null);
+    const interactionEndRef = (0, $gTuX4$react.useRef)(null);
+    const interactionEndCallbackRef = (0, $gTuX4$react.useRef)(onInteractionEndCallback);
+    const viewportResizeCallbackRef = (0, $gTuX4$react.useRef)(onViewportResizeCallback);
+    (0, $gTuX4$react.useEffect)(()=>{
+        interactionEndCallbackRef.current = onInteractionEndCallback;
+    }, [
+        onInteractionEndCallback
+    ]);
+    (0, $gTuX4$react.useEffect)(()=>{
+        viewportResizeCallbackRef.current = onViewportResizeCallback;
+    }, [
+        onViewportResizeCallback
+    ]);
+    const removeMouseListeners = (0, $gTuX4$react.useCallback)(()=>{
+        if (mouseMoveRef.current) {
+            document.removeEventListener("mousemove", mouseMoveRef.current);
+            document.removeEventListener("pointermove", mouseMoveRef.current);
+        }
+        if (mouseUpRef.current) {
+            document.removeEventListener("mouseup", mouseUpRef.current);
+            document.removeEventListener("pointerup", mouseUpRef.current);
+        }
+        activeInputRef.current = null;
+    }, []);
+    const restoreMouseDownUserSelect = (0, $gTuX4$react.useCallback)(()=>{
+        if (mouseDownElementRef.current) {
+            /* v8 ignore next */ mouseDownElementRef.current.style.userSelect = mouseDownUserSelectRef.current ?? "";
+            mouseDownElementRef.current = null;
+            mouseDownUserSelectRef.current = null;
+        }
+    }, []);
+    const removeInteractionEndListeners = (0, $gTuX4$react.useCallback)(()=>{
+        if (interactionEndRef.current) {
+            document.removeEventListener("mouseup", interactionEndRef.current, true);
+            document.removeEventListener("pointerup", interactionEndRef.current, true);
+            interactionEndRef.current = null;
+        }
+    }, []);
+    const onMouseMove = (0, $gTuX4$react.useCallback)((e)=>{
+        e.preventDefault();
+        e.stopPropagation();
+        onMouseMoveCallback?.(e);
+    }, [
+        onMouseMoveCallback
+    ]);
+    const onMouseUp = (0, $gTuX4$react.useCallback)((e)=>{
+        e.preventDefault();
+        e.stopPropagation();
+        removeMouseListeners();
+        restoreMouseDownUserSelect();
+        onMouseUpCallback?.(e);
+    }, [
+        onMouseUpCallback,
+        removeMouseListeners,
+        restoreMouseDownUserSelect
+    ]);
+    const onMouseDown = (0, $gTuX4$react.useCallback)((e)=>{
+        restoreMouseDownUserSelect();
+        mouseDownElementRef.current = e.currentTarget;
+        mouseDownUserSelectRef.current = e.currentTarget.style.userSelect;
+        e.currentTarget.style.userSelect = "none";
+        mouseMoveRef.current = onMouseMove;
+        mouseUpRef.current = onMouseUp;
+        // React can emit both pointer and mouse streams for one interaction.
+        // Subscribe to only one stream to avoid applying movement deltas twice.
+        if (e.type === "pointerdown") {
+            activeInputRef.current = "pointer";
+            document.addEventListener("pointermove", onMouseMove);
+            document.addEventListener("pointerup", onMouseUp);
+        } else {
+            activeInputRef.current = "mouse";
+            document.addEventListener("mousemove", onMouseMove);
+            document.addEventListener("mouseup", onMouseUp);
+        }
+        onMouseDownCallback?.(e);
+    }, [
+        onMouseDownCallback,
+        onMouseMove,
+        onMouseUp,
+        restoreMouseDownUserSelect
+    ]);
+    const armInteractionEnd = (0, $gTuX4$react.useCallback)(()=>{
+        if (!interactionEndEnabled || interactionEndRef.current) return;
+        const onInteractionEnd = (e)=>{
+            removeInteractionEndListeners();
+            interactionEndCallbackRef.current?.(e);
+        };
+        interactionEndRef.current = onInteractionEnd;
+        document.addEventListener("mouseup", onInteractionEnd, true);
+        document.addEventListener("pointerup", onInteractionEnd, true);
+    }, [
+        interactionEndEnabled,
+        removeInteractionEndListeners
+    ]);
+    (0, $gTuX4$react.useEffect)(()=>{
+        if (!interactionEndEnabled) removeInteractionEndListeners();
+    }, [
+        interactionEndEnabled,
+        removeInteractionEndListeners
+    ]);
+    (0, $gTuX4$react.useEffect)(()=>{
+        if (!viewportResizeEnabled || !viewportResizeCallbackRef.current || !onViewportResizeCallback) return;
+        const onViewportResize = (e)=>{
+            viewportResizeCallbackRef.current?.(e);
+        };
+        window.addEventListener("resize", onViewportResize);
+        return ()=>{
+            window.removeEventListener("resize", onViewportResize);
+        };
+    }, [
+        onViewportResizeCallback,
+        viewportResizeEnabled
+    ]);
+    (0, $gTuX4$react.useEffect)(()=>{
+        return ()=>{
+            removeMouseListeners();
+            removeInteractionEndListeners();
+            restoreMouseDownUserSelect();
+        };
+    }, [
+        removeInteractionEndListeners,
+        removeMouseListeners,
+        restoreMouseDownUserSelect
+    ]);
+    return {
+        onMouseDown: onMouseDown,
+        onMouseMove: onMouseMove,
+        onMouseUp: onMouseUp,
+        armInteractionEnd: armInteractionEnd
+    };
+};
+
+
 var $7c5fb3f6c1601913$exports = {};
 
 $parcel$export($7c5fb3f6c1601913$exports, "contextWindow", function () { return $7c5fb3f6c1601913$export$72cad2e5ad4d2674; }, function (v) { return $7c5fb3f6c1601913$export$72cad2e5ad4d2674 = v; });
@@ -826,22 +936,10 @@ const $46fb0088a1bbb6d8$var$getMaxZIndex = (componentMinZIndex)=>{
     });
     return maxZIndex;
 };
-const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react.forwardRef)((_param, ref)=>{
-    var { id: id, visible: visible, title: title, titleElement: titleElement, children: children, onOpen: onOpen, onClose: onClose, minZIndex: minZIndex = $46fb0088a1bbb6d8$export$4f9fb66ac71c7da5 } = _param, rest = (0, $gTuX4$swchelperscjs_object_without_propertiescjs._)(_param, [
-        "id",
-        "visible",
-        "title",
-        "titleElement",
-        "children",
-        "onOpen",
-        "onClose",
-        "minZIndex"
-    ]);
-    var _rest_style, _rest_style1, _rest_style2, _rest_style3;
+const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react.forwardRef)(({ id: id, visible: visible, title: title, titleElement: titleElement, children: children, onOpen: onOpen, onClose: onClose, minZIndex: minZIndex = $46fb0088a1bbb6d8$export$4f9fb66ac71c7da5, ...rest }, ref)=>{
     const divRef = (0, $gTuX4$react.useRef)(null);
     const windowRef = (0, $gTuX4$react.useRef)(null);
     const [zIndex, setZIndex] = (0, $gTuX4$react.useState)(minZIndex);
-    const resizeListenerRef = (0, $gTuX4$react.useRef)(null);
     // Track internal state: whether window is in DOM and whether it's been positioned
     const [windowInDOM, setWindowInDOM] = (0, $gTuX4$react.useState)(false);
     const [windowVisible, setWindowVisible] = (0, $gTuX4$react.useState)(false);
@@ -853,51 +951,31 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
     });
     const [moving, setMoving] = (0, $gTuX4$react.useState)(false);
     const move = (0, $gTuX4$react.useCallback)((x, y)=>{
-        if (windowRef.current && windowPos.current) {
-            const window1 = windowRef.current;
-            const pos = windowPos.current;
-            pos.x += x;
-            pos.y += y;
-            window1.style.transform = `translate(${pos.x}px, ${pos.y}px)`;
+        if (windowRef.current) {
+            windowPos.current.x += x;
+            windowPos.current.y += y;
+            windowRef.current.style.transform = `translate(${windowPos.current.x}px, ${windowPos.current.y}px)`;
         }
     }, []);
+    const fitToViewport = (0, $gTuX4$react.useCallback)(()=>{
+        if (!windowRef.current) return;
+        const viewportPadding = 32;
+        const availableWidth = Math.max(0, window.innerWidth - viewportPadding);
+        const availableHeight = Math.max(0, window.innerHeight - viewportPadding);
+        const rect = windowRef.current.getBoundingClientRect();
+        const horizontalChrome = rect.width - windowRef.current.clientWidth;
+        const verticalChrome = rect.height - windowRef.current.clientHeight;
+        if (rect.width > availableWidth) windowRef.current.style.width = `${Math.max(0, availableWidth - horizontalChrome)}px`;
+        if (rect.height > availableHeight) windowRef.current.style.height = `${Math.max(0, availableHeight - verticalChrome)}px`;
+    }, []);
     const checkPosition = (0, $gTuX4$react.useCallback)(()=>{
         const chkPos = (0, $c986bcdcae4b83bd$export$d81cfea7c54be196)(windowRef);
         move(chkPos.translateX, chkPos.translateY);
+        fitToViewport();
     }, [
+        fitToViewport,
         move
     ]);
-    const mouseMove = (0, $gTuX4$react.useCallback)((e)=>{
-        e.preventDefault();
-        e.stopPropagation();
-        move(e.movementX, e.movementY);
-    }, [
-        move
-    ]);
-    const mouseMoveRef = (0, $gTuX4$react.useRef)(mouseMove);
-    const mouseUpRef = (0, $gTuX4$react.useRef)(()=>{});
-    const mouseUp = (0, $gTuX4$react.useCallback)((e)=>{
-        e.preventDefault();
-        e.stopPropagation();
-        setMoving(false);
-        checkPosition();
-        if (mouseMoveRef.current) document.removeEventListener("mousemove", mouseMoveRef.current);
-        if (mouseUpRef.current) document.removeEventListener("mouseup", mouseUpRef.current);
-        if (resizeListenerRef.current) {
-            window.removeEventListener("resize", resizeListenerRef.current);
-            resizeListenerRef.current = null;
-        }
-        if (e.target && (e.target instanceof HTMLElement || e.target instanceof SVGElement)) e.target.style.userSelect = "auto";
-    }, [
-        checkPosition
-    ]);
-    (0, $gTuX4$react.useEffect)(()=>{
-        mouseMoveRef.current = mouseMove;
-        mouseUpRef.current = mouseUp;
-    }, [
-        mouseMove,
-        mouseUp
-    ]);
     // Helper function to push this window to the top
     const pushToTop = (0, $gTuX4$react.useCallback)(()=>{
         const maxZIndex = $46fb0088a1bbb6d8$var$getMaxZIndex(minZIndex);
@@ -905,6 +983,39 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
     }, [
         minZIndex
     ]);
+    const parseTranslate = (transform)=>{
+        const match = transform?.match(/translate\((-?\d+(?:\.\d+)?)px,\s*(-?\d+(?:\.\d+)?)px\)/);
+        if (match) return {
+            x: Number.parseFloat(match[1]),
+            y: Number.parseFloat(match[2])
+        };
+        /* v8 ignore next */ return {
+            x: 0,
+            y: 0
+        };
+    };
+    const { onMouseDown: onMouseDown, armInteractionEnd: armInteractionEnd } = (0, $847f433873d20215$export$f93615b9594453fc)({
+        onMouseDown: ()=>{
+            windowPos.current = parseTranslate(windowRef.current?.style.transform);
+            setMoving(true);
+            pushToTop();
+        },
+        onMouseMove: (e)=>{
+            move(e.movementX, e.movementY);
+        },
+        onMouseUp: ()=>{
+            checkPosition();
+            setMoving(false);
+        },
+        onInteractionEnd: ()=>{
+            checkPosition();
+        },
+        interactionEndEnabled: windowVisible,
+        onViewportResize: ()=>{
+            checkPosition();
+        },
+        viewportResizeEnabled: windowVisible
+    });
     // Expose pushToTop method via ref
     (0, $gTuX4$react.useImperativeHandle)(ref, ()=>({
             pushToTop: pushToTop
@@ -938,14 +1049,15 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
             windowRef.current.style.left = `${parentPos.left}px`;
             windowRef.current.style.top = `${parentPos.bottom + windowHeight < window.innerHeight ? parentPos.bottom : Math.max(0, parentPos.top - windowHeight)}px`;
             windowRef.current.style.transform = "";
-            windowPos.current = {
-                x: 0,
-                y: 0
+            const checkedPosition = (0, $c986bcdcae4b83bd$export$d81cfea7c54be196)(windowRef);
+            windowRef.current.style.transform = `translate(${checkedPosition.translateX}px, ${checkedPosition.translateY}px)`;
+            if (windowPos && windowPos.current) windowPos.current = {
+                x: checkedPosition.translateX,
+                y: checkedPosition.translateY
             };
-            checkPosition();
             // Update z-index and make visible - use startTransition
             const maxZ = $46fb0088a1bbb6d8$var$getMaxZIndex(minZIndex);
-            onOpen === null || onOpen === void 0 ? void 0 : onOpen();
+            onOpen?.();
             startTransition(()=>{
                 setZIndex(maxZ + 1);
                 setWindowVisible(true);
@@ -955,28 +1067,29 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
         windowInDOM,
         windowVisible,
         visible,
-        checkPosition,
         minZIndex,
         onOpen,
         startTransition
     ]);
-    // Cleanup effect to remove event listeners on unmount
+    // When CSS resize handle is used, defer checkPosition until resize interaction ends.
     (0, $gTuX4$react.useEffect)(()=>{
+        if (!windowVisible || !windowRef.current || typeof ResizeObserver === "undefined") return;
+        const observer = new ResizeObserver(()=>{
+            armInteractionEnd();
+        });
+        observer.observe(windowRef.current);
         return ()=>{
-            // Clean up event listeners if component unmounts while dragging
-            if (mouseMoveRef.current) document.removeEventListener("mousemove", mouseMoveRef.current);
-            if (mouseUpRef.current) document.removeEventListener("mouseup", mouseUpRef.current);
-            if (resizeListenerRef.current) {
-                window.removeEventListener("resize", resizeListenerRef.current);
-                resizeListenerRef.current = null;
-            }
+            observer.disconnect();
         };
-    }, []);
-    var _rest_style_minHeight, _rest_style_minWidth, _rest_style_maxHeight, _rest_style_maxWidth;
+    }, [
+        armInteractionEnd,
+        windowVisible
+    ]);
     return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
         className: (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindowAnchor,
         ref: divRef,
-        children: windowInDOM && /*#__PURE__*/ (0, $gTuX4$reactdom.createPortal)(/*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)("div", (0, $gTuX4$swchelperscjs_object_spread_propscjs._)((0, $gTuX4$swchelperscjs_object_spreadcjs._)({}, rest), {
+        children: windowInDOM && /*#__PURE__*/ (0, $gTuX4$reactdom.createPortal)(/*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)("div", {
+            ...rest,
             ref: windowRef,
             id: id,
             [$46fb0088a1bbb6d8$var$CONTEXT_WINDOW_DATA_ATTR]: "true",
@@ -984,19 +1097,19 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
                 (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindow,
                 rest.className
             ].filter((c)=>c).join(" "),
-            style: (0, $gTuX4$swchelperscjs_object_spread_propscjs._)((0, $gTuX4$swchelperscjs_object_spreadcjs._)({}, rest.style), {
+            style: {
+                ...rest.style,
                 opacity: moving ? 0.8 : windowVisible ? 1 : 0,
                 visibility: windowVisible ? "visible" : "hidden",
                 zIndex: zIndex,
-                minHeight: (_rest_style_minHeight = (_rest_style = rest.style) === null || _rest_style === void 0 ? void 0 : _rest_style.minHeight) !== null && _rest_style_minHeight !== void 0 ? _rest_style_minHeight : "150px",
-                minWidth: (_rest_style_minWidth = (_rest_style1 = rest.style) === null || _rest_style1 === void 0 ? void 0 : _rest_style1.minWidth) !== null && _rest_style_minWidth !== void 0 ? _rest_style_minWidth : "200px",
-                maxHeight: (_rest_style_maxHeight = (_rest_style2 = rest.style) === null || _rest_style2 === void 0 ? void 0 : _rest_style2.maxHeight) !== null && _rest_style_maxHeight !== void 0 ? _rest_style_maxHeight : "1000px",
-                maxWidth: (_rest_style_maxWidth = (_rest_style3 = rest.style) === null || _rest_style3 === void 0 ? void 0 : _rest_style3.maxWidth) !== null && _rest_style_maxWidth !== void 0 ? _rest_style_maxWidth : "1000px"
-            }),
+                minHeight: rest.style?.minHeight ?? "150px",
+                minWidth: rest.style?.minWidth ?? "200px",
+                maxHeight: rest.style?.maxHeight ?? "1000px",
+                maxWidth: rest.style?.maxWidth ?? "1000px"
+            },
             onClickCapture: (e)=>{
-                var _rest_onClickCapture;
                 pushToTop();
-                (_rest_onClickCapture = rest.onClickCapture) === null || _rest_onClickCapture === void 0 ? void 0 : _rest_onClickCapture.call(rest, e);
+                rest.onClickCapture?.(e);
             },
             children: [
                 /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)("div", {
@@ -1004,16 +1117,7 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
                         (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindowTitle,
                         moving ? (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).moving : ""
                     ].filter((c)=>c !== "").join(" "),
-                    onMouseDown: (e)=>{
-                        if (e.target && (e.target instanceof HTMLElement || e.target instanceof SVGElement)) e.target.style.userSelect = "none";
-                        setMoving(true);
-                        pushToTop();
-                        document.addEventListener("mouseup", mouseUp);
-                        document.addEventListener("mousemove", mouseMove);
-                        const resizeListener = ()=>checkPosition();
-                        resizeListenerRef.current = resizeListener;
-                        window.addEventListener("resize", resizeListener);
-                    },
+                    onMouseDown: onMouseDown,
                     children: [
                         /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
                             className: (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindowTitleText,
@@ -1046,7 +1150,7 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
                     })
                 })
             ]
-        })), document.body)
+        }), document.body)
     });
 });
 $46fb0088a1bbb6d8$export$1af8984c69ba1b24.displayName = "ContextWindow";
@@ -1054,6 +1158,7 @@ $46fb0088a1bbb6d8$export$1af8984c69ba1b24.displayName = "ContextWindow";
 
 
 
+
 $parcel$exportWildcard(module.exports, $a68bd8a6c0fd98c2$exports);