@asup/context-menu 2.1.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; });
@@ -209,13 +199,9 @@ $da5a7b95ca760552$export$664c6d24e3175067 = `aiw-ContextMenu-module-WinFxq-visib
209
199
 
210
200
 
211
201
 
212
-
213
- const $d35a356381c44181$export$7e4e6110f96afd7e = ({ entries: entries, toClose: toClose })=>{
214
- const [visible, setVisible] = (0, $gTuX4$react.useState)(false);
202
+ const $d35a356381c44181$export$7e4e6110f96afd7e = ({ entries: entries, toClose: toClose, visible: visible })=>{
215
203
  return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)("span", {
216
204
  className: (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).caretHolder,
217
- onMouseEnter: ()=>setVisible(true),
218
- onMouseLeave: ()=>setVisible(false),
219
205
  children: [
220
206
  /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("svg", {
221
207
  xmlns: "http://www.w3.org/2000/svg",
@@ -245,11 +231,18 @@ $d35a356381c44181$export$7e4e6110f96afd7e.displayName = "ContextSubMenu";
245
231
 
246
232
  const $1e1f300656d89038$export$c868ef28d2ba36f1 = ({ entry: entry, toClose: toClose })=>{
247
233
  const [target, setTarget] = (0, $gTuX4$react.useState)(null);
234
+ const [subMenuVisible, setSubMenuVisible] = (0, $gTuX4$react.useState)(false);
248
235
  return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)("div", {
249
236
  className: [
250
237
  (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).contextMenuItem,
251
238
  entry.disabled ? (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).disabled : ""
252
239
  ].filter((c)=>c !== "").join(" "),
240
+ onMouseEnter: entry.group ? ()=>{
241
+ setSubMenuVisible(true);
242
+ } : undefined,
243
+ onMouseLeave: entry.group ? ()=>{
244
+ setSubMenuVisible(false);
245
+ } : undefined,
253
246
  children: [
254
247
  typeof entry.label === "string" ? /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("span", {
255
248
  "aria-label": entry.label,
@@ -275,7 +268,8 @@ const $1e1f300656d89038$export$c868ef28d2ba36f1 = ({ entry: entry, toClose: toCl
275
268
  }) : entry.label,
276
269
  entry.group && /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)((0, $d35a356381c44181$export$7e4e6110f96afd7e), {
277
270
  toClose: toClose,
278
- entries: entry.group
271
+ entries: entry.group,
272
+ visible: subMenuVisible
279
273
  })
280
274
  ]
281
275
  });
@@ -332,12 +326,7 @@ $5150b66b01c99189$export$8dc6765e8be191c7.displayName = "ContextMenu";
332
326
 
333
327
 
334
328
 
335
- const $a79b75d040e03c92$export$d4ebdd58e04c6ace = (_param)=>{
336
- var { id: id, menuItems: menuItems, children: children } = _param, rest = (0, $gTuX4$swchelperscjs_object_without_propertiescjs._)(_param, [
337
- "id",
338
- "menuItems",
339
- "children"
340
- ]);
329
+ const $a79b75d040e03c92$export$d4ebdd58e04c6ace = ({ id: id, menuItems: menuItems, children: children, ...rest })=>{
341
330
  // Menu state
342
331
  const [menuInDom, setMenuInDom] = (0, $gTuX4$react.useState)(false);
343
332
  const [menuVisible, setMenuVisible] = (0, $gTuX4$react.useState)(false);
@@ -387,10 +376,10 @@ const $a79b75d040e03c92$export$d4ebdd58e04c6ace = (_param)=>{
387
376
  ]);
388
377
  return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)((0, $gTuX4$reactjsxruntime.Fragment), {
389
378
  children: [
390
- /*#__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,
391
381
  id: id,
392
382
  onClick: (e)=>{
393
- var _rest_onClick;
394
383
  if (menuItems) {
395
384
  setMenuInDom(true);
396
385
  e.preventDefault();
@@ -401,10 +390,10 @@ const $a79b75d040e03c92$export$d4ebdd58e04c6ace = (_param)=>{
401
390
  setMenuXPos(e.pageX);
402
391
  setMenuYPos(e.pageY);
403
392
  }, 1);
404
- } else (_rest_onClick = rest.onClick) === null || _rest_onClick === void 0 ? void 0 : _rest_onClick.call(rest, e);
393
+ } else rest.onClick?.(e);
405
394
  },
406
395
  children: children
407
- })),
396
+ }),
408
397
  menuInDom && menuItems && /*#__PURE__*/ (0, $gTuX4$reactdom.createPortal)(/*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
409
398
  className: (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).anchor,
410
399
  children: /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)((0, $5150b66b01c99189$export$8dc6765e8be191c7), {
@@ -432,9 +421,6 @@ $a79b75d040e03c92$export$d4ebdd58e04c6ace.displayName = "ClickForMenu";
432
421
 
433
422
 
434
423
 
435
-
436
-
437
-
438
424
  var $63cdf2819565020c$exports = {};
439
425
 
440
426
  $parcel$export($63cdf2819565020c$exports, "caretHolder", function () { return $63cdf2819565020c$export$6ed5f4fbab298e07; }, function (v) { return $63cdf2819565020c$export$6ed5f4fbab298e07 = v; });
@@ -530,10 +516,9 @@ const $b34598671fff4a77$export$aafc28aea571c4bc = ({ entry: entry })=>{
530
516
  setTarget(null);
531
517
  },
532
518
  onClick: (e)=>{
533
- var _entry_action;
534
519
  e.preventDefault();
535
520
  e.stopPropagation();
536
- 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);
537
522
  },
538
523
  children: [
539
524
  /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("span", {
@@ -579,12 +564,7 @@ const $3c568ee547c732c3$export$fc58dc71afe92de2 = /*#__PURE__*/ (0, $gTuX4$react
579
564
  function $3c568ee547c732c3$var$isDivider(label) {
580
565
  return typeof label !== "string" && label.type === "hr";
581
566
  }
582
- const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
583
- var { children: children, menuItems: menuItems, showLowMenu: showLowMenu = false } = _param, rest = (0, $gTuX4$swchelperscjs_object_without_propertiescjs._)(_param, [
584
- "children",
585
- "menuItems",
586
- "showLowMenu"
587
- ]);
567
+ const $3c568ee547c732c3$export$ed4f9641643dc7e4 = ({ children: children, menuItems: menuItems, showLowMenu: showLowMenu = false, ...rest })=>{
588
568
  // Check for higher content menu
589
569
  const higherContext = (0, $gTuX4$react.useContext)($3c568ee547c732c3$export$fc58dc71afe92de2);
590
570
  const thisMenuItems = [
@@ -629,7 +609,7 @@ const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
629
609
  window.addEventListener("scroll", updatePos, true);
630
610
  let ro = null;
631
611
  if (typeof ResizeObserver !== "undefined" && divHandlderRef.current) {
632
- ro = new ResizeObserver(()=>updatePos());
612
+ ro = new ResizeObserver(updatePos);
633
613
  ro.observe(divHandlderRef.current);
634
614
  }
635
615
  return ()=>{
@@ -644,8 +624,7 @@ const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
644
624
  ]);
645
625
  // Handle click off the menu
646
626
  const handleClick = (0, $gTuX4$react.useCallback)((e)=>{
647
- var _menuRef_current;
648
- 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);
649
628
  }, []);
650
629
  // Update the document click handler
651
630
  (0, $gTuX4$react.useEffect)(()=>{
@@ -676,9 +655,9 @@ const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
676
655
  menuItems: thisMenuItems
677
656
  },
678
657
  children: [
679
- /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", (0, $gTuX4$swchelperscjs_object_spread_propscjs._)((0, $gTuX4$swchelperscjs_object_spreadcjs._)({
680
- ref: divHandlderRef
681
- }, rest), {
658
+ /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
659
+ ref: divHandlderRef,
660
+ ...rest,
682
661
  className: [
683
662
  (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).contextMenuHandler,
684
663
  rest.className
@@ -697,7 +676,6 @@ const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
697
676
  }
698
677
  },
699
678
  onMouseEnter: async (e)=>{
700
- var _rest_onMouseEnter;
701
679
  if (showLowMenu) {
702
680
  setMenuInDom(true);
703
681
  setMouseOverHandlerDiv(false);
@@ -706,19 +684,18 @@ const $3c568ee547c732c3$export$ed4f9641643dc7e4 = (_param)=>{
706
684
  setMouseOverHandlerDiv(true);
707
685
  }, 1);
708
686
  }
709
- (_rest_onMouseEnter = rest.onMouseEnter) === null || _rest_onMouseEnter === void 0 ? void 0 : _rest_onMouseEnter.call(rest, e);
687
+ rest.onMouseEnter?.(e);
710
688
  },
711
689
  onMouseLeave: async (e)=>{
712
- var _rest_onMouseLeave;
713
690
  if (showLowMenu) {
714
691
  removeController.current.abort();
715
692
  removeController.current = new AbortController();
716
693
  setMouseOverHandlerDiv(false);
717
694
  }
718
- (_rest_onMouseLeave = rest.onMouseLeave) === null || _rest_onMouseLeave === void 0 ? void 0 : _rest_onMouseLeave.call(rest, e);
695
+ rest.onMouseLeave?.(e);
719
696
  },
720
697
  children: children
721
- })),
698
+ }),
722
699
  menuInDom && divHandlerPos && /*#__PURE__*/ (0, $gTuX4$reactdom.createPortal)(/*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
723
700
  className: (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).anchor,
724
701
  onMouseEnter: ()=>{
@@ -757,9 +734,6 @@ $3c568ee547c732c3$export$ed4f9641643dc7e4.displayName = "ContextMenuHandler";
757
734
 
758
735
 
759
736
 
760
-
761
-
762
-
763
737
  const $c986bcdcae4b83bd$export$d81cfea7c54be196 = (divRef)=>{
764
738
  if (!divRef.current) return {
765
739
  translateX: 0,
@@ -782,6 +756,137 @@ const $c986bcdcae4b83bd$export$d81cfea7c54be196 = (divRef)=>{
782
756
  };
783
757
 
784
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
+
785
890
  var $7c5fb3f6c1601913$exports = {};
786
891
 
787
892
  $parcel$export($7c5fb3f6c1601913$exports, "contextWindow", function () { return $7c5fb3f6c1601913$export$72cad2e5ad4d2674; }, function (v) { return $7c5fb3f6c1601913$export$72cad2e5ad4d2674 = v; });
@@ -822,22 +927,10 @@ const $46fb0088a1bbb6d8$var$getMaxZIndex = (componentMinZIndex)=>{
822
927
  });
823
928
  return maxZIndex;
824
929
  };
825
- const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react.forwardRef)((_param, ref)=>{
826
- 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, [
827
- "id",
828
- "visible",
829
- "title",
830
- "titleElement",
831
- "children",
832
- "onOpen",
833
- "onClose",
834
- "minZIndex"
835
- ]);
836
- 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)=>{
837
931
  const divRef = (0, $gTuX4$react.useRef)(null);
838
932
  const windowRef = (0, $gTuX4$react.useRef)(null);
839
933
  const [zIndex, setZIndex] = (0, $gTuX4$react.useState)(minZIndex);
840
- const resizeListenerRef = (0, $gTuX4$react.useRef)(null);
841
934
  // Track internal state: whether window is in DOM and whether it's been positioned
842
935
  const [windowInDOM, setWindowInDOM] = (0, $gTuX4$react.useState)(false);
843
936
  const [windowVisible, setWindowVisible] = (0, $gTuX4$react.useState)(false);
@@ -849,51 +942,31 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
849
942
  });
850
943
  const [moving, setMoving] = (0, $gTuX4$react.useState)(false);
851
944
  const move = (0, $gTuX4$react.useCallback)((x, y)=>{
852
- if (windowRef.current && windowPos.current) {
853
- const window1 = windowRef.current;
854
- const pos = windowPos.current;
855
- pos.x += x;
856
- pos.y += y;
857
- 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)`;
858
949
  }
859
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
+ }, []);
860
962
  const checkPosition = (0, $gTuX4$react.useCallback)(()=>{
861
963
  const chkPos = (0, $c986bcdcae4b83bd$export$d81cfea7c54be196)(windowRef);
862
964
  move(chkPos.translateX, chkPos.translateY);
965
+ fitToViewport();
863
966
  }, [
967
+ fitToViewport,
864
968
  move
865
969
  ]);
866
- const mouseMove = (0, $gTuX4$react.useCallback)((e)=>{
867
- e.preventDefault();
868
- e.stopPropagation();
869
- move(e.movementX, e.movementY);
870
- }, [
871
- move
872
- ]);
873
- const mouseMoveRef = (0, $gTuX4$react.useRef)(mouseMove);
874
- const mouseUpRef = (0, $gTuX4$react.useRef)(()=>{});
875
- const mouseUp = (0, $gTuX4$react.useCallback)((e)=>{
876
- e.preventDefault();
877
- e.stopPropagation();
878
- setMoving(false);
879
- checkPosition();
880
- if (mouseMoveRef.current) document.removeEventListener("mousemove", mouseMoveRef.current);
881
- if (mouseUpRef.current) document.removeEventListener("mouseup", mouseUpRef.current);
882
- if (resizeListenerRef.current) {
883
- window.removeEventListener("resize", resizeListenerRef.current);
884
- resizeListenerRef.current = null;
885
- }
886
- if (e.target && (e.target instanceof HTMLElement || e.target instanceof SVGElement)) e.target.style.userSelect = "auto";
887
- }, [
888
- checkPosition
889
- ]);
890
- (0, $gTuX4$react.useEffect)(()=>{
891
- mouseMoveRef.current = mouseMove;
892
- mouseUpRef.current = mouseUp;
893
- }, [
894
- mouseMove,
895
- mouseUp
896
- ]);
897
970
  // Helper function to push this window to the top
898
971
  const pushToTop = (0, $gTuX4$react.useCallback)(()=>{
899
972
  const maxZIndex = $46fb0088a1bbb6d8$var$getMaxZIndex(minZIndex);
@@ -901,6 +974,39 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
901
974
  }, [
902
975
  minZIndex
903
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
+ });
904
1010
  // Expose pushToTop method via ref
905
1011
  (0, $gTuX4$react.useImperativeHandle)(ref, ()=>({
906
1012
  pushToTop: pushToTop
@@ -934,14 +1040,15 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
934
1040
  windowRef.current.style.left = `${parentPos.left}px`;
935
1041
  windowRef.current.style.top = `${parentPos.bottom + windowHeight < window.innerHeight ? parentPos.bottom : Math.max(0, parentPos.top - windowHeight)}px`;
936
1042
  windowRef.current.style.transform = "";
937
- windowPos.current = {
938
- x: 0,
939
- 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
940
1048
  };
941
- checkPosition();
942
1049
  // Update z-index and make visible - use startTransition
943
1050
  const maxZ = $46fb0088a1bbb6d8$var$getMaxZIndex(minZIndex);
944
- onOpen === null || onOpen === void 0 ? void 0 : onOpen();
1051
+ onOpen?.();
945
1052
  startTransition(()=>{
946
1053
  setZIndex(maxZ + 1);
947
1054
  setWindowVisible(true);
@@ -951,28 +1058,29 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
951
1058
  windowInDOM,
952
1059
  windowVisible,
953
1060
  visible,
954
- checkPosition,
955
1061
  minZIndex,
956
1062
  onOpen,
957
1063
  startTransition
958
1064
  ]);
959
- // Cleanup effect to remove event listeners on unmount
1065
+ // When CSS resize handle is used, defer checkPosition until resize interaction ends.
960
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);
961
1072
  return ()=>{
962
- // Clean up event listeners if component unmounts while dragging
963
- if (mouseMoveRef.current) document.removeEventListener("mousemove", mouseMoveRef.current);
964
- if (mouseUpRef.current) document.removeEventListener("mouseup", mouseUpRef.current);
965
- if (resizeListenerRef.current) {
966
- window.removeEventListener("resize", resizeListenerRef.current);
967
- resizeListenerRef.current = null;
968
- }
1073
+ observer.disconnect();
969
1074
  };
970
- }, []);
971
- var _rest_style_minHeight, _rest_style_minWidth, _rest_style_maxHeight, _rest_style_maxWidth;
1075
+ }, [
1076
+ armInteractionEnd,
1077
+ windowVisible
1078
+ ]);
972
1079
  return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
973
1080
  className: (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindowAnchor,
974
1081
  ref: divRef,
975
- 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,
976
1084
  ref: windowRef,
977
1085
  id: id,
978
1086
  [$46fb0088a1bbb6d8$var$CONTEXT_WINDOW_DATA_ATTR]: "true",
@@ -980,19 +1088,19 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
980
1088
  (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindow,
981
1089
  rest.className
982
1090
  ].filter((c)=>c).join(" "),
983
- style: (0, $gTuX4$swchelperscjs_object_spread_propscjs._)((0, $gTuX4$swchelperscjs_object_spreadcjs._)({}, rest.style), {
1091
+ style: {
1092
+ ...rest.style,
984
1093
  opacity: moving ? 0.8 : windowVisible ? 1 : 0,
985
1094
  visibility: windowVisible ? "visible" : "hidden",
986
1095
  zIndex: zIndex,
987
- 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",
988
- 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",
989
- 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",
990
- 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"
991
- }),
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
+ },
992
1101
  onClickCapture: (e)=>{
993
- var _rest_onClickCapture;
994
1102
  pushToTop();
995
- (_rest_onClickCapture = rest.onClickCapture) === null || _rest_onClickCapture === void 0 ? void 0 : _rest_onClickCapture.call(rest, e);
1103
+ rest.onClickCapture?.(e);
996
1104
  },
997
1105
  children: [
998
1106
  /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)("div", {
@@ -1000,16 +1108,7 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
1000
1108
  (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindowTitle,
1001
1109
  moving ? (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).moving : ""
1002
1110
  ].filter((c)=>c !== "").join(" "),
1003
- onMouseDown: (e)=>{
1004
- if (e.target && (e.target instanceof HTMLElement || e.target instanceof SVGElement)) e.target.style.userSelect = "none";
1005
- setMoving(true);
1006
- pushToTop();
1007
- document.addEventListener("mouseup", mouseUp);
1008
- document.addEventListener("mousemove", mouseMove);
1009
- const resizeListener = ()=>checkPosition();
1010
- resizeListenerRef.current = resizeListener;
1011
- window.addEventListener("resize", resizeListener);
1012
- },
1111
+ onMouseDown: onMouseDown,
1013
1112
  children: [
1014
1113
  /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
1015
1114
  className: (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindowTitleText,
@@ -1042,7 +1141,7 @@ const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $gTuX4$react
1042
1141
  })
1043
1142
  })
1044
1143
  ]
1045
- })), document.body)
1144
+ }), document.body)
1046
1145
  });
1047
1146
  });
1048
1147
  $46fb0088a1bbb6d8$export$1af8984c69ba1b24.displayName = "ContextWindow";
@@ -1050,6 +1149,7 @@ $46fb0088a1bbb6d8$export$1af8984c69ba1b24.displayName = "ContextWindow";
1050
1149
 
1051
1150
 
1052
1151
 
1152
+
1053
1153
  $parcel$exportWildcard(module.exports, $a68bd8a6c0fd98c2$exports);
1054
1154
 
1055
1155