@asup/context-menu 2.2.0 → 2.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/cjs/main.js CHANGED
@@ -1,7 +1,4 @@
1
1
  require("./main.css");
2
- var $gTuX4$swchelperscjs_object_spreadcjs = require("@swc/helpers/cjs/_object_spread.cjs");
3
- var $gTuX4$swchelperscjs_object_spread_propscjs = require("@swc/helpers/cjs/_object_spread_props.cjs");
4
- var $gTuX4$swchelperscjs_object_without_propertiescjs = require("@swc/helpers/cjs/_object_without_properties.cjs");
5
2
  var $gTuX4$reactjsxruntime = require("react/jsx-runtime");
6
3
  var $gTuX4$react = require("react");
7
4
  var $gTuX4$reactdom = require("react-dom");
@@ -32,6 +29,8 @@ function $parcel$interopDefault(a) {
32
29
  return a && a.__esModule ? a.default : a;
33
30
  }
34
31
 
32
+ $parcel$export(module.exports, "useMouseMove", function () { return $847f433873d20215$export$f93615b9594453fc; });
33
+
35
34
 
36
35
  var $a68bd8a6c0fd98c2$exports = {};
37
36
 
@@ -42,9 +41,6 @@ $parcel$export($a68bd8a6c0fd98c2$exports, "ContextMenuHandler", function () { re
42
41
  $parcel$export($a68bd8a6c0fd98c2$exports, "ContextWindow", function () { return $46fb0088a1bbb6d8$export$1af8984c69ba1b24; });
43
42
 
44
43
 
45
-
46
-
47
-
48
44
  var $796f463330153c24$exports = {};
49
45
 
50
46
  $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
55
51
  $796f463330153c24$export$563bd8f955c52746 = `aiw-AutoHeight-module-pDlSVW-autoHeightWrapper`;
56
52
 
57
53
 
58
- function $95149596d5a7ed2b$export$77bf000da9303d1(_param) {
59
- var { children: children, hide: hide = false, duration: duration = 300 } = _param, rest = (0, $gTuX4$swchelperscjs_object_without_propertiescjs._)(_param, [
60
- "children",
61
- "hide",
62
- "duration"
63
- ]);
54
+ function $95149596d5a7ed2b$export$77bf000da9303d1({ children: children, hide: hide = false, duration: duration = 300, ...rest }) {
64
55
  const wrapperRef = (0, $gTuX4$react.useRef)(null);
65
56
  const innerRef = (0, $gTuX4$react.useRef)(null);
66
57
  const [height, setHeight] = (0, $gTuX4$react.useState)(null);
@@ -143,20 +134,22 @@ function $95149596d5a7ed2b$export$77bf000da9303d1(_param) {
143
134
  }
144
135
  };
145
136
  }, []);
146
- return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", (0, $gTuX4$swchelperscjs_object_spread_propscjs._)((0, $gTuX4$swchelperscjs_object_spreadcjs._)({}, rest), {
137
+ return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
138
+ ...rest,
147
139
  className: (0, (/*@__PURE__*/$parcel$interopDefault($796f463330153c24$exports))).autoHeightWrapper,
148
140
  ref: wrapperRef,
149
- style: (0, $gTuX4$swchelperscjs_object_spread_propscjs._)((0, $gTuX4$swchelperscjs_object_spreadcjs._)({}, rest.style), {
141
+ style: {
142
+ ...rest.style,
150
143
  display: animationState === "closed" ? "none" : undefined,
151
144
  height: height ? `${height}px` : "auto",
152
145
  transitionDuration: `${duration}ms`
153
- }),
146
+ },
154
147
  children: /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
155
148
  className: (0, (/*@__PURE__*/$parcel$interopDefault($796f463330153c24$exports))).autoHeightInner,
156
149
  ref: innerRef,
157
150
  children: targetChildren
158
151
  })
159
- }));
152
+ });
160
153
  }
161
154
  $95149596d5a7ed2b$export$77bf000da9303d1.displayName = "AutoHeight";
162
155
 
@@ -166,9 +159,6 @@ $95149596d5a7ed2b$export$77bf000da9303d1.displayName = "AutoHeight";
166
159
 
167
160
 
168
161
 
169
-
170
-
171
-
172
162
  var $da5a7b95ca760552$exports = {};
173
163
 
174
164
  $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";
336
326
 
337
327
 
338
328
 
339
- const $a79b75d040e03c92$export$d4ebdd58e04c6ace = (_param)=>{
340
- var { id: id, menuItems: menuItems, children: children } = _param, rest = (0, $gTuX4$swchelperscjs_object_without_propertiescjs._)(_param, [
341
- "id",
342
- "menuItems",
343
- "children"
344
- ]);
329
+ const $a79b75d040e03c92$export$d4ebdd58e04c6ace = ({ id: id, menuItems: menuItems, children: children, ...rest })=>{
345
330
  // Menu state
346
331
  const [menuInDom, setMenuInDom] = (0, $gTuX4$react.useState)(false);
347
332
  const [menuVisible, setMenuVisible] = (0, $gTuX4$react.useState)(false);
@@ -391,10 +376,10 @@ const $a79b75d040e03c92$export$d4ebdd58e04c6ace = (_param)=>{
391
376
  ]);
392
377
  return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)((0, $gTuX4$reactjsxruntime.Fragment), {
393
378
  children: [
394
- /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", (0, $gTuX4$swchelperscjs_object_spread_propscjs._)((0, $gTuX4$swchelperscjs_object_spreadcjs._)({}, rest), {
379
+ /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
380
+ ...rest,
395
381
  id: id,
396
382
  onClick: (e)=>{
397
- var _rest_onClick;
398
383
  if (menuItems) {
399
384
  setMenuInDom(true);
400
385
  e.preventDefault();
@@ -405,10 +390,10 @@ const $a79b75d040e03c92$export$d4ebdd58e04c6ace = (_param)=>{
405
390
  setMenuXPos(e.pageX);
406
391
  setMenuYPos(e.pageY);
407
392
  }, 1);
408
- } else (_rest_onClick = rest.onClick) === null || _rest_onClick === void 0 ? void 0 : _rest_onClick.call(rest, e);
393
+ } else rest.onClick?.(e);
409
394
  },
410
395
  children: children
411
- })),
396
+ }),
412
397
  menuInDom && menuItems && /*#__PURE__*/ (0, $gTuX4$reactdom.createPortal)(/*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
413
398
  className: (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).anchor,
414
399
  children: /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)((0, $5150b66b01c99189$export$8dc6765e8be191c7), {
@@ -436,9 +421,6 @@ $a79b75d040e03c92$export$d4ebdd58e04c6ace.displayName = "ClickForMenu";
436
421
 
437
422
 
438
423
 
439
-
440
-
441
-
442
424
  var $63cdf2819565020c$exports = {};
443
425
 
444
426
  $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 })=>{
534
516
  setTarget(null);
535
517
  },
536
518
  onClick: (e)=>{
537
- var _entry_action;
538
519
  e.preventDefault();
539
520
  e.stopPropagation();
540
- if (!entry.disabled) (_entry_action = entry.action) === null || _entry_action === void 0 ? void 0 : _entry_action.call(entry, target);
521
+ if (!entry.disabled) entry.action?.(target);
541
522
  },
542
523
  children: [
543
524
  /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("span", {
@@ -583,12 +564,7 @@ const $3c568ee547c732c3$export$fc58dc71afe92de2 = /*#__PURE__*/ (0, $gTuX4$react
583
564
  function $3c568ee547c732c3$var$isDivider(label) {
584
565
  return typeof label !== "string" && label.type === "hr";
585
566
  }
586
- const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
587
- var { children: children, menuItems: menuItems, showLowMenu: showLowMenu = false } = _param, rest = (0, $gTuX4$swchelperscjs_object_without_propertiescjs._)(_param, [
588
- "children",
589
- "menuItems",
590
- "showLowMenu"
591
- ]);
567
+ const $3c568ee547c732c3$export$ed4f9641643dc7e4 = ({ children: children, menuItems: menuItems, showLowMenu: showLowMenu = false, ...rest })=>{
592
568
  // Check for higher content menu
593
569
  const higherContext = (0, $gTuX4$react.useContext)($3c568ee547c732c3$export$fc58dc71afe92de2);
594
570
  const thisMenuItems = [
@@ -633,7 +609,7 @@ const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
633
609
  window.addEventListener("scroll", updatePos, true);
634
610
  let ro = null;
635
611
  if (typeof ResizeObserver !== "undefined" && divHandlderRef.current) {
636
- ro = new ResizeObserver(()=>updatePos());
612
+ ro = new ResizeObserver(updatePos);
637
613
  ro.observe(divHandlderRef.current);
638
614
  }
639
615
  return ()=>{
@@ -648,8 +624,7 @@ const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
648
624
  ]);
649
625
  // Handle click off the menu
650
626
  const handleClick = (0, $gTuX4$react.useCallback)((e)=>{
651
- var _menuRef_current;
652
- 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);
627
+ if (menuRef.current && (e.target instanceof Element && !menuRef.current?.contains(e.target) || !(e.target instanceof Element))) setMenuVisible(false);
653
628
  }, []);
654
629
  // Update the document click handler
655
630
  (0, $gTuX4$react.useEffect)(()=>{
@@ -680,9 +655,9 @@ const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
680
655
  menuItems: thisMenuItems
681
656
  },
682
657
  children: [
683
- /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", (0, $gTuX4$swchelperscjs_object_spread_propscjs._)((0, $gTuX4$swchelperscjs_object_spreadcjs._)({
684
- ref: divHandlderRef
685
- }, rest), {
658
+ /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
659
+ ref: divHandlderRef,
660
+ ...rest,
686
661
  className: [
687
662
  (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).contextMenuHandler,
688
663
  rest.className
@@ -701,7 +676,6 @@ const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
701
676
  }
702
677
  },
703
678
  onMouseEnter: async (e)=>{
704
- var _rest_onMouseEnter;
705
679
  if (showLowMenu) {
706
680
  setMenuInDom(true);
707
681
  setMouseOverHandlerDiv(false);
@@ -710,19 +684,18 @@ const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
710
684
  setMouseOverHandlerDiv(true);
711
685
  }, 1);
712
686
  }
713
- (_rest_onMouseEnter = rest.onMouseEnter) === null || _rest_onMouseEnter === void 0 ? void 0 : _rest_onMouseEnter.call(rest, e);
687
+ rest.onMouseEnter?.(e);
714
688
  },
715
689
  onMouseLeave: async (e)=>{
716
- var _rest_onMouseLeave;
717
690
  if (showLowMenu) {
718
691
  removeController.current.abort();
719
692
  removeController.current = new AbortController();
720
693
  setMouseOverHandlerDiv(false);
721
694
  }
722
- (_rest_onMouseLeave = rest.onMouseLeave) === null || _rest_onMouseLeave === void 0 ? void 0 : _rest_onMouseLeave.call(rest, e);
695
+ rest.onMouseLeave?.(e);
723
696
  },
724
697
  children: children
725
- })),
698
+ }),
726
699
  menuInDom && divHandlerPos && /*#__PURE__*/ (0, $gTuX4$reactdom.createPortal)(/*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
727
700
  className: (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).anchor,
728
701
  onMouseEnter: ()=>{
@@ -761,9 +734,6 @@ $3c568ee547c732c3$export$ed4f9641643dc7e4.displayName = "ContextMenuHandler";
761
734
 
762
735
 
763
736
 
764
-
765
-
766
-
767
737
  const $c986bcdcae4b83bd$export$d81cfea7c54be196 = (divRef)=>{
768
738
  if (!divRef.current) return {
769
739
  translateX: 0,
@@ -786,6 +756,137 @@ const $c986bcdcae4b83bd$export$d81cfea7c54be196 = (divRef)=>{
786
756
  };
787
757
 
788
758
 
759
+
760
+ const $847f433873d20215$export$f93615b9594453fc = ({ onMouseDown: onMouseDownCallback, onMouseMove: onMouseMoveCallback, onMouseUp: onMouseUpCallback, onInteractionEnd: onInteractionEndCallback, interactionEndEnabled: interactionEndEnabled = true, onViewportResize: onViewportResizeCallback, viewportResizeEnabled: viewportResizeEnabled = true })=>{
761
+ const mouseMoveRef = (0, $gTuX4$react.useRef)(null);
762
+ const mouseUpRef = (0, $gTuX4$react.useRef)(null);
763
+ const mouseDownElementRef = (0, $gTuX4$react.useRef)(null);
764
+ const mouseDownUserSelectRef = (0, $gTuX4$react.useRef)(null);
765
+ const interactionEndRef = (0, $gTuX4$react.useRef)(null);
766
+ const interactionEndCallbackRef = (0, $gTuX4$react.useRef)(onInteractionEndCallback);
767
+ const viewportResizeCallbackRef = (0, $gTuX4$react.useRef)(onViewportResizeCallback);
768
+ (0, $gTuX4$react.useEffect)(()=>{
769
+ interactionEndCallbackRef.current = onInteractionEndCallback;
770
+ }, [
771
+ onInteractionEndCallback
772
+ ]);
773
+ (0, $gTuX4$react.useEffect)(()=>{
774
+ viewportResizeCallbackRef.current = onViewportResizeCallback;
775
+ }, [
776
+ onViewportResizeCallback
777
+ ]);
778
+ const removeMouseListeners = (0, $gTuX4$react.useCallback)(()=>{
779
+ if (mouseMoveRef.current) {
780
+ document.removeEventListener("mousemove", mouseMoveRef.current);
781
+ document.removeEventListener("pointermove", mouseMoveRef.current);
782
+ }
783
+ if (mouseUpRef.current) {
784
+ document.removeEventListener("mouseup", mouseUpRef.current);
785
+ document.removeEventListener("pointerup", mouseUpRef.current);
786
+ }
787
+ }, []);
788
+ const restoreMouseDownUserSelect = (0, $gTuX4$react.useCallback)(()=>{
789
+ if (mouseDownElementRef.current) {
790
+ /* v8 ignore next */ mouseDownElementRef.current.style.userSelect = mouseDownUserSelectRef.current ?? "";
791
+ mouseDownElementRef.current = null;
792
+ mouseDownUserSelectRef.current = null;
793
+ }
794
+ }, []);
795
+ const removeInteractionEndListeners = (0, $gTuX4$react.useCallback)(()=>{
796
+ if (interactionEndRef.current) {
797
+ document.removeEventListener("mouseup", interactionEndRef.current, true);
798
+ document.removeEventListener("pointerup", interactionEndRef.current, true);
799
+ interactionEndRef.current = null;
800
+ }
801
+ }, []);
802
+ const onMouseMove = (0, $gTuX4$react.useCallback)((e)=>{
803
+ e.preventDefault();
804
+ e.stopPropagation();
805
+ onMouseMoveCallback?.(e);
806
+ }, [
807
+ onMouseMoveCallback
808
+ ]);
809
+ const onMouseUp = (0, $gTuX4$react.useCallback)((e)=>{
810
+ e.preventDefault();
811
+ e.stopPropagation();
812
+ removeMouseListeners();
813
+ restoreMouseDownUserSelect();
814
+ onMouseUpCallback?.(e);
815
+ }, [
816
+ onMouseUpCallback,
817
+ removeMouseListeners,
818
+ restoreMouseDownUserSelect
819
+ ]);
820
+ const onMouseDown = (0, $gTuX4$react.useCallback)((e)=>{
821
+ restoreMouseDownUserSelect();
822
+ mouseDownElementRef.current = e.currentTarget;
823
+ mouseDownUserSelectRef.current = e.currentTarget.style.userSelect;
824
+ e.currentTarget.style.userSelect = "none";
825
+ mouseMoveRef.current = onMouseMove;
826
+ mouseUpRef.current = onMouseUp;
827
+ document.addEventListener("mousemove", onMouseMove);
828
+ document.addEventListener("pointermove", onMouseMove);
829
+ document.addEventListener("mouseup", onMouseUp);
830
+ document.addEventListener("pointerup", onMouseUp);
831
+ onMouseDownCallback?.(e);
832
+ }, [
833
+ onMouseDownCallback,
834
+ onMouseMove,
835
+ onMouseUp,
836
+ restoreMouseDownUserSelect
837
+ ]);
838
+ const armInteractionEnd = (0, $gTuX4$react.useCallback)(()=>{
839
+ if (!interactionEndEnabled || interactionEndRef.current) return;
840
+ const onInteractionEnd = (e)=>{
841
+ removeInteractionEndListeners();
842
+ interactionEndCallbackRef.current?.(e);
843
+ };
844
+ interactionEndRef.current = onInteractionEnd;
845
+ document.addEventListener("mouseup", onInteractionEnd, true);
846
+ document.addEventListener("pointerup", onInteractionEnd, true);
847
+ }, [
848
+ interactionEndEnabled,
849
+ removeInteractionEndListeners
850
+ ]);
851
+ (0, $gTuX4$react.useEffect)(()=>{
852
+ if (!interactionEndEnabled) removeInteractionEndListeners();
853
+ }, [
854
+ interactionEndEnabled,
855
+ removeInteractionEndListeners
856
+ ]);
857
+ (0, $gTuX4$react.useEffect)(()=>{
858
+ if (!viewportResizeEnabled || !viewportResizeCallbackRef.current || !onViewportResizeCallback) return;
859
+ const onViewportResize = (e)=>{
860
+ viewportResizeCallbackRef.current?.(e);
861
+ };
862
+ window.addEventListener("resize", onViewportResize);
863
+ return ()=>{
864
+ window.removeEventListener("resize", onViewportResize);
865
+ };
866
+ }, [
867
+ onViewportResizeCallback,
868
+ viewportResizeEnabled
869
+ ]);
870
+ (0, $gTuX4$react.useEffect)(()=>{
871
+ return ()=>{
872
+ removeMouseListeners();
873
+ removeInteractionEndListeners();
874
+ restoreMouseDownUserSelect();
875
+ };
876
+ }, [
877
+ removeInteractionEndListeners,
878
+ removeMouseListeners,
879
+ restoreMouseDownUserSelect
880
+ ]);
881
+ return {
882
+ onMouseDown: onMouseDown,
883
+ onMouseMove: onMouseMove,
884
+ onMouseUp: onMouseUp,
885
+ armInteractionEnd: armInteractionEnd
886
+ };
887
+ };
888
+
889
+
789
890
  var $7c5fb3f6c1601913$exports = {};
790
891
 
791
892
  $parcel$export($7c5fb3f6c1601913$exports, "contextWindow", function () { return $7c5fb3f6c1601913$export$72cad2e5ad4d2674; }, function (v) { return $7c5fb3f6c1601913$export$72cad2e5ad4d2674 = v; });
@@ -826,22 +927,10 @@ const $46fb0088a1bbb6d8$var$getMaxZIndex = (componentMinZIndex)=>{
826
927
  });
827
928
  return maxZIndex;
828
929
  };
829
- const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react.forwardRef)((_param, ref)=>{
830
- 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, [
831
- "id",
832
- "visible",
833
- "title",
834
- "titleElement",
835
- "children",
836
- "onOpen",
837
- "onClose",
838
- "minZIndex"
839
- ]);
840
- var _rest_style, _rest_style1, _rest_style2, _rest_style3;
930
+ 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)=>{
841
931
  const divRef = (0, $gTuX4$react.useRef)(null);
842
932
  const windowRef = (0, $gTuX4$react.useRef)(null);
843
933
  const [zIndex, setZIndex] = (0, $gTuX4$react.useState)(minZIndex);
844
- const resizeListenerRef = (0, $gTuX4$react.useRef)(null);
845
934
  // Track internal state: whether window is in DOM and whether it's been positioned
846
935
  const [windowInDOM, setWindowInDOM] = (0, $gTuX4$react.useState)(false);
847
936
  const [windowVisible, setWindowVisible] = (0, $gTuX4$react.useState)(false);
@@ -853,51 +942,31 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
853
942
  });
854
943
  const [moving, setMoving] = (0, $gTuX4$react.useState)(false);
855
944
  const move = (0, $gTuX4$react.useCallback)((x, y)=>{
856
- if (windowRef.current && windowPos.current) {
857
- const window1 = windowRef.current;
858
- const pos = windowPos.current;
859
- pos.x += x;
860
- pos.y += y;
861
- window1.style.transform = `translate(${pos.x}px, ${pos.y}px)`;
945
+ if (windowRef.current) {
946
+ windowPos.current.x += x;
947
+ windowPos.current.y += y;
948
+ windowRef.current.style.transform = `translate(${windowPos.current.x}px, ${windowPos.current.y}px)`;
862
949
  }
863
950
  }, []);
951
+ const fitToViewport = (0, $gTuX4$react.useCallback)(()=>{
952
+ if (!windowRef.current) return;
953
+ const viewportPadding = 32;
954
+ const availableWidth = Math.max(0, window.innerWidth - viewportPadding);
955
+ const availableHeight = Math.max(0, window.innerHeight - viewportPadding);
956
+ const rect = windowRef.current.getBoundingClientRect();
957
+ const horizontalChrome = rect.width - windowRef.current.clientWidth;
958
+ const verticalChrome = rect.height - windowRef.current.clientHeight;
959
+ if (rect.width > availableWidth) windowRef.current.style.width = `${Math.max(0, availableWidth - horizontalChrome)}px`;
960
+ if (rect.height > availableHeight) windowRef.current.style.height = `${Math.max(0, availableHeight - verticalChrome)}px`;
961
+ }, []);
864
962
  const checkPosition = (0, $gTuX4$react.useCallback)(()=>{
865
963
  const chkPos = (0, $c986bcdcae4b83bd$export$d81cfea7c54be196)(windowRef);
866
964
  move(chkPos.translateX, chkPos.translateY);
965
+ fitToViewport();
867
966
  }, [
967
+ fitToViewport,
868
968
  move
869
969
  ]);
870
- const mouseMove = (0, $gTuX4$react.useCallback)((e)=>{
871
- e.preventDefault();
872
- e.stopPropagation();
873
- move(e.movementX, e.movementY);
874
- }, [
875
- move
876
- ]);
877
- const mouseMoveRef = (0, $gTuX4$react.useRef)(mouseMove);
878
- const mouseUpRef = (0, $gTuX4$react.useRef)(()=>{});
879
- const mouseUp = (0, $gTuX4$react.useCallback)((e)=>{
880
- e.preventDefault();
881
- e.stopPropagation();
882
- setMoving(false);
883
- checkPosition();
884
- if (mouseMoveRef.current) document.removeEventListener("mousemove", mouseMoveRef.current);
885
- if (mouseUpRef.current) document.removeEventListener("mouseup", mouseUpRef.current);
886
- if (resizeListenerRef.current) {
887
- window.removeEventListener("resize", resizeListenerRef.current);
888
- resizeListenerRef.current = null;
889
- }
890
- if (e.target && (e.target instanceof HTMLElement || e.target instanceof SVGElement)) e.target.style.userSelect = "auto";
891
- }, [
892
- checkPosition
893
- ]);
894
- (0, $gTuX4$react.useEffect)(()=>{
895
- mouseMoveRef.current = mouseMove;
896
- mouseUpRef.current = mouseUp;
897
- }, [
898
- mouseMove,
899
- mouseUp
900
- ]);
901
970
  // Helper function to push this window to the top
902
971
  const pushToTop = (0, $gTuX4$react.useCallback)(()=>{
903
972
  const maxZIndex = $46fb0088a1bbb6d8$var$getMaxZIndex(minZIndex);
@@ -905,6 +974,39 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
905
974
  }, [
906
975
  minZIndex
907
976
  ]);
977
+ const parseTranslate = (transform)=>{
978
+ const match = transform?.match(/translate\((-?\d+(?:\.\d+)?)px,\s*(-?\d+(?:\.\d+)?)px\)/);
979
+ if (match) return {
980
+ x: Number.parseFloat(match[1]),
981
+ y: Number.parseFloat(match[2])
982
+ };
983
+ /* v8 ignore next */ return {
984
+ x: 0,
985
+ y: 0
986
+ };
987
+ };
988
+ const { onMouseDown: onMouseDown, armInteractionEnd: armInteractionEnd } = (0, $847f433873d20215$export$f93615b9594453fc)({
989
+ onMouseDown: ()=>{
990
+ windowPos.current = parseTranslate(windowRef.current?.style.transform);
991
+ setMoving(true);
992
+ pushToTop();
993
+ },
994
+ onMouseMove: (e)=>{
995
+ move(e.movementX, e.movementY);
996
+ },
997
+ onMouseUp: ()=>{
998
+ checkPosition();
999
+ setMoving(false);
1000
+ },
1001
+ onInteractionEnd: ()=>{
1002
+ checkPosition();
1003
+ },
1004
+ interactionEndEnabled: windowVisible,
1005
+ onViewportResize: ()=>{
1006
+ checkPosition();
1007
+ },
1008
+ viewportResizeEnabled: windowVisible
1009
+ });
908
1010
  // Expose pushToTop method via ref
909
1011
  (0, $gTuX4$react.useImperativeHandle)(ref, ()=>({
910
1012
  pushToTop: pushToTop
@@ -938,14 +1040,15 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
938
1040
  windowRef.current.style.left = `${parentPos.left}px`;
939
1041
  windowRef.current.style.top = `${parentPos.bottom + windowHeight < window.innerHeight ? parentPos.bottom : Math.max(0, parentPos.top - windowHeight)}px`;
940
1042
  windowRef.current.style.transform = "";
941
- windowPos.current = {
942
- x: 0,
943
- y: 0
1043
+ const checkedPosition = (0, $c986bcdcae4b83bd$export$d81cfea7c54be196)(windowRef);
1044
+ windowRef.current.style.transform = `translate(${checkedPosition.translateX}px, ${checkedPosition.translateY}px)`;
1045
+ if (windowPos && windowPos.current) windowPos.current = {
1046
+ x: checkedPosition.translateX,
1047
+ y: checkedPosition.translateY
944
1048
  };
945
- checkPosition();
946
1049
  // Update z-index and make visible - use startTransition
947
1050
  const maxZ = $46fb0088a1bbb6d8$var$getMaxZIndex(minZIndex);
948
- onOpen === null || onOpen === void 0 ? void 0 : onOpen();
1051
+ onOpen?.();
949
1052
  startTransition(()=>{
950
1053
  setZIndex(maxZ + 1);
951
1054
  setWindowVisible(true);
@@ -955,28 +1058,29 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
955
1058
  windowInDOM,
956
1059
  windowVisible,
957
1060
  visible,
958
- checkPosition,
959
1061
  minZIndex,
960
1062
  onOpen,
961
1063
  startTransition
962
1064
  ]);
963
- // Cleanup effect to remove event listeners on unmount
1065
+ // When CSS resize handle is used, defer checkPosition until resize interaction ends.
964
1066
  (0, $gTuX4$react.useEffect)(()=>{
1067
+ if (!windowVisible || !windowRef.current || typeof ResizeObserver === "undefined") return;
1068
+ const observer = new ResizeObserver(()=>{
1069
+ armInteractionEnd();
1070
+ });
1071
+ observer.observe(windowRef.current);
965
1072
  return ()=>{
966
- // Clean up event listeners if component unmounts while dragging
967
- if (mouseMoveRef.current) document.removeEventListener("mousemove", mouseMoveRef.current);
968
- if (mouseUpRef.current) document.removeEventListener("mouseup", mouseUpRef.current);
969
- if (resizeListenerRef.current) {
970
- window.removeEventListener("resize", resizeListenerRef.current);
971
- resizeListenerRef.current = null;
972
- }
1073
+ observer.disconnect();
973
1074
  };
974
- }, []);
975
- var _rest_style_minHeight, _rest_style_minWidth, _rest_style_maxHeight, _rest_style_maxWidth;
1075
+ }, [
1076
+ armInteractionEnd,
1077
+ windowVisible
1078
+ ]);
976
1079
  return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
977
1080
  className: (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindowAnchor,
978
1081
  ref: divRef,
979
- 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), {
1082
+ children: windowInDOM && /*#__PURE__*/ (0, $gTuX4$reactdom.createPortal)(/*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)("div", {
1083
+ ...rest,
980
1084
  ref: windowRef,
981
1085
  id: id,
982
1086
  [$46fb0088a1bbb6d8$var$CONTEXT_WINDOW_DATA_ATTR]: "true",
@@ -984,19 +1088,19 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
984
1088
  (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindow,
985
1089
  rest.className
986
1090
  ].filter((c)=>c).join(" "),
987
- style: (0, $gTuX4$swchelperscjs_object_spread_propscjs._)((0, $gTuX4$swchelperscjs_object_spreadcjs._)({}, rest.style), {
1091
+ style: {
1092
+ ...rest.style,
988
1093
  opacity: moving ? 0.8 : windowVisible ? 1 : 0,
989
1094
  visibility: windowVisible ? "visible" : "hidden",
990
1095
  zIndex: zIndex,
991
- 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",
992
- 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",
993
- 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",
994
- 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"
995
- }),
1096
+ minHeight: rest.style?.minHeight ?? "150px",
1097
+ minWidth: rest.style?.minWidth ?? "200px",
1098
+ maxHeight: rest.style?.maxHeight ?? "1000px",
1099
+ maxWidth: rest.style?.maxWidth ?? "1000px"
1100
+ },
996
1101
  onClickCapture: (e)=>{
997
- var _rest_onClickCapture;
998
1102
  pushToTop();
999
- (_rest_onClickCapture = rest.onClickCapture) === null || _rest_onClickCapture === void 0 ? void 0 : _rest_onClickCapture.call(rest, e);
1103
+ rest.onClickCapture?.(e);
1000
1104
  },
1001
1105
  children: [
1002
1106
  /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)("div", {
@@ -1004,16 +1108,7 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
1004
1108
  (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindowTitle,
1005
1109
  moving ? (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).moving : ""
1006
1110
  ].filter((c)=>c !== "").join(" "),
1007
- onMouseDown: (e)=>{
1008
- if (e.target && (e.target instanceof HTMLElement || e.target instanceof SVGElement)) e.target.style.userSelect = "none";
1009
- setMoving(true);
1010
- pushToTop();
1011
- document.addEventListener("mouseup", mouseUp);
1012
- document.addEventListener("mousemove", mouseMove);
1013
- const resizeListener = ()=>checkPosition();
1014
- resizeListenerRef.current = resizeListener;
1015
- window.addEventListener("resize", resizeListener);
1016
- },
1111
+ onMouseDown: onMouseDown,
1017
1112
  children: [
1018
1113
  /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
1019
1114
  className: (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindowTitleText,
@@ -1046,7 +1141,7 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
1046
1141
  })
1047
1142
  })
1048
1143
  ]
1049
- })), document.body)
1144
+ }), document.body)
1050
1145
  });
1051
1146
  });
1052
1147
  $46fb0088a1bbb6d8$export$1af8984c69ba1b24.displayName = "ContextWindow";
@@ -1054,6 +1149,7 @@ $46fb0088a1bbb6d8$export$1af8984c69ba1b24.displayName = "ContextWindow";
1054
1149
 
1055
1150
 
1056
1151
 
1152
+
1057
1153
  $parcel$exportWildcard(module.exports, $a68bd8a6c0fd98c2$exports);
1058
1154
 
1059
1155