@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 +236 -140
- package/dist/cjs/main.js.map +1 -1
- package/dist/context-menu.d.ts +17 -1
- package/dist/context-menu.d.ts.map +1 -1
- package/dist/main.js +235 -141
- package/dist/main.js.map +1 -1
- package/package.json +9 -9
package/dist/main.js
CHANGED
|
@@ -1,7 +1,4 @@
|
|
|
1
1
|
import "./main.css";
|
|
2
|
-
import {_ as $duWW8$_} from "@swc/helpers/_/_object_spread";
|
|
3
|
-
import {_ as $duWW8$_1} from "@swc/helpers/_/_object_spread_props";
|
|
4
|
-
import {_ as $duWW8$_2} from "@swc/helpers/_/_object_without_properties";
|
|
5
2
|
import {jsx as $duWW8$jsx, jsxs as $duWW8$jsxs, Fragment as $duWW8$Fragment} from "react/jsx-runtime";
|
|
6
3
|
import {useRef as $duWW8$useRef, useState as $duWW8$useState, useEffectEvent as $duWW8$useEffectEvent, useLayoutEffect as $duWW8$useLayoutEffect, useEffect as $duWW8$useEffect, forwardRef as $duWW8$forwardRef, createContext as $duWW8$createContext, useContext as $duWW8$useContext, useCallback as $duWW8$useCallback, useTransition as $duWW8$useTransition, useImperativeHandle as $duWW8$useImperativeHandle} from "react";
|
|
7
4
|
import {createPortal as $duWW8$createPortal} from "react-dom";
|
|
@@ -25,9 +22,6 @@ $parcel$export($b65191f6d0a0a991$exports, "ContextMenuHandler", function () { re
|
|
|
25
22
|
$parcel$export($b65191f6d0a0a991$exports, "ContextWindow", function () { return $b5e8657823def5be$export$1af8984c69ba1b24; });
|
|
26
23
|
|
|
27
24
|
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
25
|
var $181673e3e0e596f3$exports = {};
|
|
32
26
|
|
|
33
27
|
$parcel$export($181673e3e0e596f3$exports, "autoHeightInner", function () { return $181673e3e0e596f3$export$df919f6b0f7f84e6; }, function (v) { return $181673e3e0e596f3$export$df919f6b0f7f84e6 = v; });
|
|
@@ -38,12 +32,7 @@ $181673e3e0e596f3$export$df919f6b0f7f84e6 = `aiw-AutoHeight-module-pDlSVW-autoHe
|
|
|
38
32
|
$181673e3e0e596f3$export$563bd8f955c52746 = `aiw-AutoHeight-module-pDlSVW-autoHeightWrapper`;
|
|
39
33
|
|
|
40
34
|
|
|
41
|
-
function $62873e7e5aeec7f1$export$77bf000da9303d1(
|
|
42
|
-
var { children: children, hide: hide = false, duration: duration = 300 } = _param, rest = (0, $duWW8$_2)(_param, [
|
|
43
|
-
"children",
|
|
44
|
-
"hide",
|
|
45
|
-
"duration"
|
|
46
|
-
]);
|
|
35
|
+
function $62873e7e5aeec7f1$export$77bf000da9303d1({ children: children, hide: hide = false, duration: duration = 300, ...rest }) {
|
|
47
36
|
const wrapperRef = (0, $duWW8$useRef)(null);
|
|
48
37
|
const innerRef = (0, $duWW8$useRef)(null);
|
|
49
38
|
const [height, setHeight] = (0, $duWW8$useState)(null);
|
|
@@ -126,20 +115,22 @@ function $62873e7e5aeec7f1$export$77bf000da9303d1(_param) {
|
|
|
126
115
|
}
|
|
127
116
|
};
|
|
128
117
|
}, []);
|
|
129
|
-
return /*#__PURE__*/ (0, $duWW8$jsx)("div",
|
|
118
|
+
return /*#__PURE__*/ (0, $duWW8$jsx)("div", {
|
|
119
|
+
...rest,
|
|
130
120
|
className: (0, (/*@__PURE__*/$parcel$interopDefault($181673e3e0e596f3$exports))).autoHeightWrapper,
|
|
131
121
|
ref: wrapperRef,
|
|
132
|
-
style:
|
|
122
|
+
style: {
|
|
123
|
+
...rest.style,
|
|
133
124
|
display: animationState === "closed" ? "none" : undefined,
|
|
134
125
|
height: height ? `${height}px` : "auto",
|
|
135
126
|
transitionDuration: `${duration}ms`
|
|
136
|
-
}
|
|
127
|
+
},
|
|
137
128
|
children: /*#__PURE__*/ (0, $duWW8$jsx)("div", {
|
|
138
129
|
className: (0, (/*@__PURE__*/$parcel$interopDefault($181673e3e0e596f3$exports))).autoHeightInner,
|
|
139
130
|
ref: innerRef,
|
|
140
131
|
children: targetChildren
|
|
141
132
|
})
|
|
142
|
-
})
|
|
133
|
+
});
|
|
143
134
|
}
|
|
144
135
|
$62873e7e5aeec7f1$export$77bf000da9303d1.displayName = "AutoHeight";
|
|
145
136
|
|
|
@@ -149,9 +140,6 @@ $62873e7e5aeec7f1$export$77bf000da9303d1.displayName = "AutoHeight";
|
|
|
149
140
|
|
|
150
141
|
|
|
151
142
|
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
143
|
var $47067f35ca62d4a5$exports = {};
|
|
156
144
|
|
|
157
145
|
$parcel$export($47067f35ca62d4a5$exports, "anchor", function () { return $47067f35ca62d4a5$export$2e2992790a6f69a8; }, function (v) { return $47067f35ca62d4a5$export$2e2992790a6f69a8 = v; });
|
|
@@ -319,12 +307,7 @@ $567ed433af94513f$export$8dc6765e8be191c7.displayName = "ContextMenu";
|
|
|
319
307
|
|
|
320
308
|
|
|
321
309
|
|
|
322
|
-
const $c3e82278b501f10c$export$d4ebdd58e04c6ace = (
|
|
323
|
-
var { id: id, menuItems: menuItems, children: children } = _param, rest = (0, $duWW8$_2)(_param, [
|
|
324
|
-
"id",
|
|
325
|
-
"menuItems",
|
|
326
|
-
"children"
|
|
327
|
-
]);
|
|
310
|
+
const $c3e82278b501f10c$export$d4ebdd58e04c6ace = ({ id: id, menuItems: menuItems, children: children, ...rest })=>{
|
|
328
311
|
// Menu state
|
|
329
312
|
const [menuInDom, setMenuInDom] = (0, $duWW8$useState)(false);
|
|
330
313
|
const [menuVisible, setMenuVisible] = (0, $duWW8$useState)(false);
|
|
@@ -374,10 +357,10 @@ const $c3e82278b501f10c$export$d4ebdd58e04c6ace = (_param)=>{
|
|
|
374
357
|
]);
|
|
375
358
|
return /*#__PURE__*/ (0, $duWW8$jsxs)((0, $duWW8$Fragment), {
|
|
376
359
|
children: [
|
|
377
|
-
/*#__PURE__*/ (0, $duWW8$jsx)("div",
|
|
360
|
+
/*#__PURE__*/ (0, $duWW8$jsx)("div", {
|
|
361
|
+
...rest,
|
|
378
362
|
id: id,
|
|
379
363
|
onClick: (e)=>{
|
|
380
|
-
var _rest_onClick;
|
|
381
364
|
if (menuItems) {
|
|
382
365
|
setMenuInDom(true);
|
|
383
366
|
e.preventDefault();
|
|
@@ -388,10 +371,10 @@ const $c3e82278b501f10c$export$d4ebdd58e04c6ace = (_param)=>{
|
|
|
388
371
|
setMenuXPos(e.pageX);
|
|
389
372
|
setMenuYPos(e.pageY);
|
|
390
373
|
}, 1);
|
|
391
|
-
} else
|
|
374
|
+
} else rest.onClick?.(e);
|
|
392
375
|
},
|
|
393
376
|
children: children
|
|
394
|
-
})
|
|
377
|
+
}),
|
|
395
378
|
menuInDom && menuItems && /*#__PURE__*/ (0, $duWW8$createPortal)(/*#__PURE__*/ (0, $duWW8$jsx)("div", {
|
|
396
379
|
className: (0, (/*@__PURE__*/$parcel$interopDefault($47067f35ca62d4a5$exports))).anchor,
|
|
397
380
|
children: /*#__PURE__*/ (0, $duWW8$jsx)((0, $567ed433af94513f$export$8dc6765e8be191c7), {
|
|
@@ -419,9 +402,6 @@ $c3e82278b501f10c$export$d4ebdd58e04c6ace.displayName = "ClickForMenu";
|
|
|
419
402
|
|
|
420
403
|
|
|
421
404
|
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
405
|
var $c7a6ae87165004e6$exports = {};
|
|
426
406
|
|
|
427
407
|
$parcel$export($c7a6ae87165004e6$exports, "caretHolder", function () { return $c7a6ae87165004e6$export$6ed5f4fbab298e07; }, function (v) { return $c7a6ae87165004e6$export$6ed5f4fbab298e07 = v; });
|
|
@@ -517,10 +497,9 @@ const $556d6f9158abfc99$export$aafc28aea571c4bc = ({ entry: entry })=>{
|
|
|
517
497
|
setTarget(null);
|
|
518
498
|
},
|
|
519
499
|
onClick: (e)=>{
|
|
520
|
-
var _entry_action;
|
|
521
500
|
e.preventDefault();
|
|
522
501
|
e.stopPropagation();
|
|
523
|
-
if (!entry.disabled)
|
|
502
|
+
if (!entry.disabled) entry.action?.(target);
|
|
524
503
|
},
|
|
525
504
|
children: [
|
|
526
505
|
/*#__PURE__*/ (0, $duWW8$jsx)("span", {
|
|
@@ -566,12 +545,7 @@ const $1e1c1e9e0b943830$export$fc58dc71afe92de2 = /*#__PURE__*/ (0, $duWW8$creat
|
|
|
566
545
|
function $1e1c1e9e0b943830$var$isDivider(label) {
|
|
567
546
|
return typeof label !== "string" && label.type === "hr";
|
|
568
547
|
}
|
|
569
|
-
const $1e1c1e9e0b943830$export$ed4f9641643dc7e4 = (
|
|
570
|
-
var { children: children, menuItems: menuItems, showLowMenu: showLowMenu = false } = _param, rest = (0, $duWW8$_2)(_param, [
|
|
571
|
-
"children",
|
|
572
|
-
"menuItems",
|
|
573
|
-
"showLowMenu"
|
|
574
|
-
]);
|
|
548
|
+
const $1e1c1e9e0b943830$export$ed4f9641643dc7e4 = ({ children: children, menuItems: menuItems, showLowMenu: showLowMenu = false, ...rest })=>{
|
|
575
549
|
// Check for higher content menu
|
|
576
550
|
const higherContext = (0, $duWW8$useContext)($1e1c1e9e0b943830$export$fc58dc71afe92de2);
|
|
577
551
|
const thisMenuItems = [
|
|
@@ -616,7 +590,7 @@ const $1e1c1e9e0b943830$export$ed4f9641643dc7e4 = (_param)=>{
|
|
|
616
590
|
window.addEventListener("scroll", updatePos, true);
|
|
617
591
|
let ro = null;
|
|
618
592
|
if (typeof ResizeObserver !== "undefined" && divHandlderRef.current) {
|
|
619
|
-
ro = new ResizeObserver(
|
|
593
|
+
ro = new ResizeObserver(updatePos);
|
|
620
594
|
ro.observe(divHandlderRef.current);
|
|
621
595
|
}
|
|
622
596
|
return ()=>{
|
|
@@ -631,8 +605,7 @@ const $1e1c1e9e0b943830$export$ed4f9641643dc7e4 = (_param)=>{
|
|
|
631
605
|
]);
|
|
632
606
|
// Handle click off the menu
|
|
633
607
|
const handleClick = (0, $duWW8$useCallback)((e)=>{
|
|
634
|
-
|
|
635
|
-
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);
|
|
608
|
+
if (menuRef.current && (e.target instanceof Element && !menuRef.current?.contains(e.target) || !(e.target instanceof Element))) setMenuVisible(false);
|
|
636
609
|
}, []);
|
|
637
610
|
// Update the document click handler
|
|
638
611
|
(0, $duWW8$useEffect)(()=>{
|
|
@@ -663,9 +636,9 @@ const $1e1c1e9e0b943830$export$ed4f9641643dc7e4 = (_param)=>{
|
|
|
663
636
|
menuItems: thisMenuItems
|
|
664
637
|
},
|
|
665
638
|
children: [
|
|
666
|
-
/*#__PURE__*/ (0, $duWW8$jsx)("div",
|
|
667
|
-
ref: divHandlderRef
|
|
668
|
-
|
|
639
|
+
/*#__PURE__*/ (0, $duWW8$jsx)("div", {
|
|
640
|
+
ref: divHandlderRef,
|
|
641
|
+
...rest,
|
|
669
642
|
className: [
|
|
670
643
|
(0, (/*@__PURE__*/$parcel$interopDefault($47067f35ca62d4a5$exports))).contextMenuHandler,
|
|
671
644
|
rest.className
|
|
@@ -684,7 +657,6 @@ const $1e1c1e9e0b943830$export$ed4f9641643dc7e4 = (_param)=>{
|
|
|
684
657
|
}
|
|
685
658
|
},
|
|
686
659
|
onMouseEnter: async (e)=>{
|
|
687
|
-
var _rest_onMouseEnter;
|
|
688
660
|
if (showLowMenu) {
|
|
689
661
|
setMenuInDom(true);
|
|
690
662
|
setMouseOverHandlerDiv(false);
|
|
@@ -693,19 +665,18 @@ const $1e1c1e9e0b943830$export$ed4f9641643dc7e4 = (_param)=>{
|
|
|
693
665
|
setMouseOverHandlerDiv(true);
|
|
694
666
|
}, 1);
|
|
695
667
|
}
|
|
696
|
-
|
|
668
|
+
rest.onMouseEnter?.(e);
|
|
697
669
|
},
|
|
698
670
|
onMouseLeave: async (e)=>{
|
|
699
|
-
var _rest_onMouseLeave;
|
|
700
671
|
if (showLowMenu) {
|
|
701
672
|
removeController.current.abort();
|
|
702
673
|
removeController.current = new AbortController();
|
|
703
674
|
setMouseOverHandlerDiv(false);
|
|
704
675
|
}
|
|
705
|
-
|
|
676
|
+
rest.onMouseLeave?.(e);
|
|
706
677
|
},
|
|
707
678
|
children: children
|
|
708
|
-
})
|
|
679
|
+
}),
|
|
709
680
|
menuInDom && divHandlerPos && /*#__PURE__*/ (0, $duWW8$createPortal)(/*#__PURE__*/ (0, $duWW8$jsx)("div", {
|
|
710
681
|
className: (0, (/*@__PURE__*/$parcel$interopDefault($47067f35ca62d4a5$exports))).anchor,
|
|
711
682
|
onMouseEnter: ()=>{
|
|
@@ -744,9 +715,6 @@ $1e1c1e9e0b943830$export$ed4f9641643dc7e4.displayName = "ContextMenuHandler";
|
|
|
744
715
|
|
|
745
716
|
|
|
746
717
|
|
|
747
|
-
|
|
748
|
-
|
|
749
|
-
|
|
750
718
|
const $ab4d5d6bf03370d0$export$d81cfea7c54be196 = (divRef)=>{
|
|
751
719
|
if (!divRef.current) return {
|
|
752
720
|
translateX: 0,
|
|
@@ -769,6 +737,137 @@ const $ab4d5d6bf03370d0$export$d81cfea7c54be196 = (divRef)=>{
|
|
|
769
737
|
};
|
|
770
738
|
|
|
771
739
|
|
|
740
|
+
|
|
741
|
+
const $a7d2a7efe39e6c95$export$f93615b9594453fc = ({ onMouseDown: onMouseDownCallback, onMouseMove: onMouseMoveCallback, onMouseUp: onMouseUpCallback, onInteractionEnd: onInteractionEndCallback, interactionEndEnabled: interactionEndEnabled = true, onViewportResize: onViewportResizeCallback, viewportResizeEnabled: viewportResizeEnabled = true })=>{
|
|
742
|
+
const mouseMoveRef = (0, $duWW8$useRef)(null);
|
|
743
|
+
const mouseUpRef = (0, $duWW8$useRef)(null);
|
|
744
|
+
const mouseDownElementRef = (0, $duWW8$useRef)(null);
|
|
745
|
+
const mouseDownUserSelectRef = (0, $duWW8$useRef)(null);
|
|
746
|
+
const interactionEndRef = (0, $duWW8$useRef)(null);
|
|
747
|
+
const interactionEndCallbackRef = (0, $duWW8$useRef)(onInteractionEndCallback);
|
|
748
|
+
const viewportResizeCallbackRef = (0, $duWW8$useRef)(onViewportResizeCallback);
|
|
749
|
+
(0, $duWW8$useEffect)(()=>{
|
|
750
|
+
interactionEndCallbackRef.current = onInteractionEndCallback;
|
|
751
|
+
}, [
|
|
752
|
+
onInteractionEndCallback
|
|
753
|
+
]);
|
|
754
|
+
(0, $duWW8$useEffect)(()=>{
|
|
755
|
+
viewportResizeCallbackRef.current = onViewportResizeCallback;
|
|
756
|
+
}, [
|
|
757
|
+
onViewportResizeCallback
|
|
758
|
+
]);
|
|
759
|
+
const removeMouseListeners = (0, $duWW8$useCallback)(()=>{
|
|
760
|
+
if (mouseMoveRef.current) {
|
|
761
|
+
document.removeEventListener("mousemove", mouseMoveRef.current);
|
|
762
|
+
document.removeEventListener("pointermove", mouseMoveRef.current);
|
|
763
|
+
}
|
|
764
|
+
if (mouseUpRef.current) {
|
|
765
|
+
document.removeEventListener("mouseup", mouseUpRef.current);
|
|
766
|
+
document.removeEventListener("pointerup", mouseUpRef.current);
|
|
767
|
+
}
|
|
768
|
+
}, []);
|
|
769
|
+
const restoreMouseDownUserSelect = (0, $duWW8$useCallback)(()=>{
|
|
770
|
+
if (mouseDownElementRef.current) {
|
|
771
|
+
/* v8 ignore next */ mouseDownElementRef.current.style.userSelect = mouseDownUserSelectRef.current ?? "";
|
|
772
|
+
mouseDownElementRef.current = null;
|
|
773
|
+
mouseDownUserSelectRef.current = null;
|
|
774
|
+
}
|
|
775
|
+
}, []);
|
|
776
|
+
const removeInteractionEndListeners = (0, $duWW8$useCallback)(()=>{
|
|
777
|
+
if (interactionEndRef.current) {
|
|
778
|
+
document.removeEventListener("mouseup", interactionEndRef.current, true);
|
|
779
|
+
document.removeEventListener("pointerup", interactionEndRef.current, true);
|
|
780
|
+
interactionEndRef.current = null;
|
|
781
|
+
}
|
|
782
|
+
}, []);
|
|
783
|
+
const onMouseMove = (0, $duWW8$useCallback)((e)=>{
|
|
784
|
+
e.preventDefault();
|
|
785
|
+
e.stopPropagation();
|
|
786
|
+
onMouseMoveCallback?.(e);
|
|
787
|
+
}, [
|
|
788
|
+
onMouseMoveCallback
|
|
789
|
+
]);
|
|
790
|
+
const onMouseUp = (0, $duWW8$useCallback)((e)=>{
|
|
791
|
+
e.preventDefault();
|
|
792
|
+
e.stopPropagation();
|
|
793
|
+
removeMouseListeners();
|
|
794
|
+
restoreMouseDownUserSelect();
|
|
795
|
+
onMouseUpCallback?.(e);
|
|
796
|
+
}, [
|
|
797
|
+
onMouseUpCallback,
|
|
798
|
+
removeMouseListeners,
|
|
799
|
+
restoreMouseDownUserSelect
|
|
800
|
+
]);
|
|
801
|
+
const onMouseDown = (0, $duWW8$useCallback)((e)=>{
|
|
802
|
+
restoreMouseDownUserSelect();
|
|
803
|
+
mouseDownElementRef.current = e.currentTarget;
|
|
804
|
+
mouseDownUserSelectRef.current = e.currentTarget.style.userSelect;
|
|
805
|
+
e.currentTarget.style.userSelect = "none";
|
|
806
|
+
mouseMoveRef.current = onMouseMove;
|
|
807
|
+
mouseUpRef.current = onMouseUp;
|
|
808
|
+
document.addEventListener("mousemove", onMouseMove);
|
|
809
|
+
document.addEventListener("pointermove", onMouseMove);
|
|
810
|
+
document.addEventListener("mouseup", onMouseUp);
|
|
811
|
+
document.addEventListener("pointerup", onMouseUp);
|
|
812
|
+
onMouseDownCallback?.(e);
|
|
813
|
+
}, [
|
|
814
|
+
onMouseDownCallback,
|
|
815
|
+
onMouseMove,
|
|
816
|
+
onMouseUp,
|
|
817
|
+
restoreMouseDownUserSelect
|
|
818
|
+
]);
|
|
819
|
+
const armInteractionEnd = (0, $duWW8$useCallback)(()=>{
|
|
820
|
+
if (!interactionEndEnabled || interactionEndRef.current) return;
|
|
821
|
+
const onInteractionEnd = (e)=>{
|
|
822
|
+
removeInteractionEndListeners();
|
|
823
|
+
interactionEndCallbackRef.current?.(e);
|
|
824
|
+
};
|
|
825
|
+
interactionEndRef.current = onInteractionEnd;
|
|
826
|
+
document.addEventListener("mouseup", onInteractionEnd, true);
|
|
827
|
+
document.addEventListener("pointerup", onInteractionEnd, true);
|
|
828
|
+
}, [
|
|
829
|
+
interactionEndEnabled,
|
|
830
|
+
removeInteractionEndListeners
|
|
831
|
+
]);
|
|
832
|
+
(0, $duWW8$useEffect)(()=>{
|
|
833
|
+
if (!interactionEndEnabled) removeInteractionEndListeners();
|
|
834
|
+
}, [
|
|
835
|
+
interactionEndEnabled,
|
|
836
|
+
removeInteractionEndListeners
|
|
837
|
+
]);
|
|
838
|
+
(0, $duWW8$useEffect)(()=>{
|
|
839
|
+
if (!viewportResizeEnabled || !viewportResizeCallbackRef.current || !onViewportResizeCallback) return;
|
|
840
|
+
const onViewportResize = (e)=>{
|
|
841
|
+
viewportResizeCallbackRef.current?.(e);
|
|
842
|
+
};
|
|
843
|
+
window.addEventListener("resize", onViewportResize);
|
|
844
|
+
return ()=>{
|
|
845
|
+
window.removeEventListener("resize", onViewportResize);
|
|
846
|
+
};
|
|
847
|
+
}, [
|
|
848
|
+
onViewportResizeCallback,
|
|
849
|
+
viewportResizeEnabled
|
|
850
|
+
]);
|
|
851
|
+
(0, $duWW8$useEffect)(()=>{
|
|
852
|
+
return ()=>{
|
|
853
|
+
removeMouseListeners();
|
|
854
|
+
removeInteractionEndListeners();
|
|
855
|
+
restoreMouseDownUserSelect();
|
|
856
|
+
};
|
|
857
|
+
}, [
|
|
858
|
+
removeInteractionEndListeners,
|
|
859
|
+
removeMouseListeners,
|
|
860
|
+
restoreMouseDownUserSelect
|
|
861
|
+
]);
|
|
862
|
+
return {
|
|
863
|
+
onMouseDown: onMouseDown,
|
|
864
|
+
onMouseMove: onMouseMove,
|
|
865
|
+
onMouseUp: onMouseUp,
|
|
866
|
+
armInteractionEnd: armInteractionEnd
|
|
867
|
+
};
|
|
868
|
+
};
|
|
869
|
+
|
|
870
|
+
|
|
772
871
|
var $ddf7153c7c69b209$exports = {};
|
|
773
872
|
|
|
774
873
|
$parcel$export($ddf7153c7c69b209$exports, "contextWindow", function () { return $ddf7153c7c69b209$export$72cad2e5ad4d2674; }, function (v) { return $ddf7153c7c69b209$export$72cad2e5ad4d2674 = v; });
|
|
@@ -809,22 +908,10 @@ const $b5e8657823def5be$var$getMaxZIndex = (componentMinZIndex)=>{
|
|
|
809
908
|
});
|
|
810
909
|
return maxZIndex;
|
|
811
910
|
};
|
|
812
|
-
const $b5e8657823def5be$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $duWW8$forwardRef)((
|
|
813
|
-
var { id: id, visible: visible, title: title, titleElement: titleElement, children: children, onOpen: onOpen, onClose: onClose, minZIndex: minZIndex = $b5e8657823def5be$export$4f9fb66ac71c7da5 } = _param, rest = (0, $duWW8$_2)(_param, [
|
|
814
|
-
"id",
|
|
815
|
-
"visible",
|
|
816
|
-
"title",
|
|
817
|
-
"titleElement",
|
|
818
|
-
"children",
|
|
819
|
-
"onOpen",
|
|
820
|
-
"onClose",
|
|
821
|
-
"minZIndex"
|
|
822
|
-
]);
|
|
823
|
-
var _rest_style, _rest_style1, _rest_style2, _rest_style3;
|
|
911
|
+
const $b5e8657823def5be$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $duWW8$forwardRef)(({ id: id, visible: visible, title: title, titleElement: titleElement, children: children, onOpen: onOpen, onClose: onClose, minZIndex: minZIndex = $b5e8657823def5be$export$4f9fb66ac71c7da5, ...rest }, ref)=>{
|
|
824
912
|
const divRef = (0, $duWW8$useRef)(null);
|
|
825
913
|
const windowRef = (0, $duWW8$useRef)(null);
|
|
826
914
|
const [zIndex, setZIndex] = (0, $duWW8$useState)(minZIndex);
|
|
827
|
-
const resizeListenerRef = (0, $duWW8$useRef)(null);
|
|
828
915
|
// Track internal state: whether window is in DOM and whether it's been positioned
|
|
829
916
|
const [windowInDOM, setWindowInDOM] = (0, $duWW8$useState)(false);
|
|
830
917
|
const [windowVisible, setWindowVisible] = (0, $duWW8$useState)(false);
|
|
@@ -836,51 +923,31 @@ const $b5e8657823def5be$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $duWW8$forwa
|
|
|
836
923
|
});
|
|
837
924
|
const [moving, setMoving] = (0, $duWW8$useState)(false);
|
|
838
925
|
const move = (0, $duWW8$useCallback)((x, y)=>{
|
|
839
|
-
if (windowRef.current
|
|
840
|
-
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
pos.y += y;
|
|
844
|
-
window1.style.transform = `translate(${pos.x}px, ${pos.y}px)`;
|
|
926
|
+
if (windowRef.current) {
|
|
927
|
+
windowPos.current.x += x;
|
|
928
|
+
windowPos.current.y += y;
|
|
929
|
+
windowRef.current.style.transform = `translate(${windowPos.current.x}px, ${windowPos.current.y}px)`;
|
|
845
930
|
}
|
|
846
931
|
}, []);
|
|
932
|
+
const fitToViewport = (0, $duWW8$useCallback)(()=>{
|
|
933
|
+
if (!windowRef.current) return;
|
|
934
|
+
const viewportPadding = 32;
|
|
935
|
+
const availableWidth = Math.max(0, window.innerWidth - viewportPadding);
|
|
936
|
+
const availableHeight = Math.max(0, window.innerHeight - viewportPadding);
|
|
937
|
+
const rect = windowRef.current.getBoundingClientRect();
|
|
938
|
+
const horizontalChrome = rect.width - windowRef.current.clientWidth;
|
|
939
|
+
const verticalChrome = rect.height - windowRef.current.clientHeight;
|
|
940
|
+
if (rect.width > availableWidth) windowRef.current.style.width = `${Math.max(0, availableWidth - horizontalChrome)}px`;
|
|
941
|
+
if (rect.height > availableHeight) windowRef.current.style.height = `${Math.max(0, availableHeight - verticalChrome)}px`;
|
|
942
|
+
}, []);
|
|
847
943
|
const checkPosition = (0, $duWW8$useCallback)(()=>{
|
|
848
944
|
const chkPos = (0, $ab4d5d6bf03370d0$export$d81cfea7c54be196)(windowRef);
|
|
849
945
|
move(chkPos.translateX, chkPos.translateY);
|
|
946
|
+
fitToViewport();
|
|
850
947
|
}, [
|
|
948
|
+
fitToViewport,
|
|
851
949
|
move
|
|
852
950
|
]);
|
|
853
|
-
const mouseMove = (0, $duWW8$useCallback)((e)=>{
|
|
854
|
-
e.preventDefault();
|
|
855
|
-
e.stopPropagation();
|
|
856
|
-
move(e.movementX, e.movementY);
|
|
857
|
-
}, [
|
|
858
|
-
move
|
|
859
|
-
]);
|
|
860
|
-
const mouseMoveRef = (0, $duWW8$useRef)(mouseMove);
|
|
861
|
-
const mouseUpRef = (0, $duWW8$useRef)(()=>{});
|
|
862
|
-
const mouseUp = (0, $duWW8$useCallback)((e)=>{
|
|
863
|
-
e.preventDefault();
|
|
864
|
-
e.stopPropagation();
|
|
865
|
-
setMoving(false);
|
|
866
|
-
checkPosition();
|
|
867
|
-
if (mouseMoveRef.current) document.removeEventListener("mousemove", mouseMoveRef.current);
|
|
868
|
-
if (mouseUpRef.current) document.removeEventListener("mouseup", mouseUpRef.current);
|
|
869
|
-
if (resizeListenerRef.current) {
|
|
870
|
-
window.removeEventListener("resize", resizeListenerRef.current);
|
|
871
|
-
resizeListenerRef.current = null;
|
|
872
|
-
}
|
|
873
|
-
if (e.target && (e.target instanceof HTMLElement || e.target instanceof SVGElement)) e.target.style.userSelect = "auto";
|
|
874
|
-
}, [
|
|
875
|
-
checkPosition
|
|
876
|
-
]);
|
|
877
|
-
(0, $duWW8$useEffect)(()=>{
|
|
878
|
-
mouseMoveRef.current = mouseMove;
|
|
879
|
-
mouseUpRef.current = mouseUp;
|
|
880
|
-
}, [
|
|
881
|
-
mouseMove,
|
|
882
|
-
mouseUp
|
|
883
|
-
]);
|
|
884
951
|
// Helper function to push this window to the top
|
|
885
952
|
const pushToTop = (0, $duWW8$useCallback)(()=>{
|
|
886
953
|
const maxZIndex = $b5e8657823def5be$var$getMaxZIndex(minZIndex);
|
|
@@ -888,6 +955,39 @@ const $b5e8657823def5be$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $duWW8$forwa
|
|
|
888
955
|
}, [
|
|
889
956
|
minZIndex
|
|
890
957
|
]);
|
|
958
|
+
const parseTranslate = (transform)=>{
|
|
959
|
+
const match = transform?.match(/translate\((-?\d+(?:\.\d+)?)px,\s*(-?\d+(?:\.\d+)?)px\)/);
|
|
960
|
+
if (match) return {
|
|
961
|
+
x: Number.parseFloat(match[1]),
|
|
962
|
+
y: Number.parseFloat(match[2])
|
|
963
|
+
};
|
|
964
|
+
/* v8 ignore next */ return {
|
|
965
|
+
x: 0,
|
|
966
|
+
y: 0
|
|
967
|
+
};
|
|
968
|
+
};
|
|
969
|
+
const { onMouseDown: onMouseDown, armInteractionEnd: armInteractionEnd } = (0, $a7d2a7efe39e6c95$export$f93615b9594453fc)({
|
|
970
|
+
onMouseDown: ()=>{
|
|
971
|
+
windowPos.current = parseTranslate(windowRef.current?.style.transform);
|
|
972
|
+
setMoving(true);
|
|
973
|
+
pushToTop();
|
|
974
|
+
},
|
|
975
|
+
onMouseMove: (e)=>{
|
|
976
|
+
move(e.movementX, e.movementY);
|
|
977
|
+
},
|
|
978
|
+
onMouseUp: ()=>{
|
|
979
|
+
checkPosition();
|
|
980
|
+
setMoving(false);
|
|
981
|
+
},
|
|
982
|
+
onInteractionEnd: ()=>{
|
|
983
|
+
checkPosition();
|
|
984
|
+
},
|
|
985
|
+
interactionEndEnabled: windowVisible,
|
|
986
|
+
onViewportResize: ()=>{
|
|
987
|
+
checkPosition();
|
|
988
|
+
},
|
|
989
|
+
viewportResizeEnabled: windowVisible
|
|
990
|
+
});
|
|
891
991
|
// Expose pushToTop method via ref
|
|
892
992
|
(0, $duWW8$useImperativeHandle)(ref, ()=>({
|
|
893
993
|
pushToTop: pushToTop
|
|
@@ -921,14 +1021,15 @@ const $b5e8657823def5be$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $duWW8$forwa
|
|
|
921
1021
|
windowRef.current.style.left = `${parentPos.left}px`;
|
|
922
1022
|
windowRef.current.style.top = `${parentPos.bottom + windowHeight < window.innerHeight ? parentPos.bottom : Math.max(0, parentPos.top - windowHeight)}px`;
|
|
923
1023
|
windowRef.current.style.transform = "";
|
|
924
|
-
|
|
925
|
-
|
|
926
|
-
|
|
1024
|
+
const checkedPosition = (0, $ab4d5d6bf03370d0$export$d81cfea7c54be196)(windowRef);
|
|
1025
|
+
windowRef.current.style.transform = `translate(${checkedPosition.translateX}px, ${checkedPosition.translateY}px)`;
|
|
1026
|
+
if (windowPos && windowPos.current) windowPos.current = {
|
|
1027
|
+
x: checkedPosition.translateX,
|
|
1028
|
+
y: checkedPosition.translateY
|
|
927
1029
|
};
|
|
928
|
-
checkPosition();
|
|
929
1030
|
// Update z-index and make visible - use startTransition
|
|
930
1031
|
const maxZ = $b5e8657823def5be$var$getMaxZIndex(minZIndex);
|
|
931
|
-
onOpen
|
|
1032
|
+
onOpen?.();
|
|
932
1033
|
startTransition(()=>{
|
|
933
1034
|
setZIndex(maxZ + 1);
|
|
934
1035
|
setWindowVisible(true);
|
|
@@ -938,28 +1039,29 @@ const $b5e8657823def5be$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $duWW8$forwa
|
|
|
938
1039
|
windowInDOM,
|
|
939
1040
|
windowVisible,
|
|
940
1041
|
visible,
|
|
941
|
-
checkPosition,
|
|
942
1042
|
minZIndex,
|
|
943
1043
|
onOpen,
|
|
944
1044
|
startTransition
|
|
945
1045
|
]);
|
|
946
|
-
//
|
|
1046
|
+
// When CSS resize handle is used, defer checkPosition until resize interaction ends.
|
|
947
1047
|
(0, $duWW8$useEffect)(()=>{
|
|
1048
|
+
if (!windowVisible || !windowRef.current || typeof ResizeObserver === "undefined") return;
|
|
1049
|
+
const observer = new ResizeObserver(()=>{
|
|
1050
|
+
armInteractionEnd();
|
|
1051
|
+
});
|
|
1052
|
+
observer.observe(windowRef.current);
|
|
948
1053
|
return ()=>{
|
|
949
|
-
|
|
950
|
-
if (mouseMoveRef.current) document.removeEventListener("mousemove", mouseMoveRef.current);
|
|
951
|
-
if (mouseUpRef.current) document.removeEventListener("mouseup", mouseUpRef.current);
|
|
952
|
-
if (resizeListenerRef.current) {
|
|
953
|
-
window.removeEventListener("resize", resizeListenerRef.current);
|
|
954
|
-
resizeListenerRef.current = null;
|
|
955
|
-
}
|
|
1054
|
+
observer.disconnect();
|
|
956
1055
|
};
|
|
957
|
-
}, [
|
|
958
|
-
|
|
1056
|
+
}, [
|
|
1057
|
+
armInteractionEnd,
|
|
1058
|
+
windowVisible
|
|
1059
|
+
]);
|
|
959
1060
|
return /*#__PURE__*/ (0, $duWW8$jsx)("div", {
|
|
960
1061
|
className: (0, (/*@__PURE__*/$parcel$interopDefault($ddf7153c7c69b209$exports))).contextWindowAnchor,
|
|
961
1062
|
ref: divRef,
|
|
962
|
-
children: windowInDOM && /*#__PURE__*/ (0, $duWW8$createPortal)(/*#__PURE__*/ (0, $duWW8$jsxs)("div",
|
|
1063
|
+
children: windowInDOM && /*#__PURE__*/ (0, $duWW8$createPortal)(/*#__PURE__*/ (0, $duWW8$jsxs)("div", {
|
|
1064
|
+
...rest,
|
|
963
1065
|
ref: windowRef,
|
|
964
1066
|
id: id,
|
|
965
1067
|
[$b5e8657823def5be$var$CONTEXT_WINDOW_DATA_ATTR]: "true",
|
|
@@ -967,19 +1069,19 @@ const $b5e8657823def5be$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $duWW8$forwa
|
|
|
967
1069
|
(0, (/*@__PURE__*/$parcel$interopDefault($ddf7153c7c69b209$exports))).contextWindow,
|
|
968
1070
|
rest.className
|
|
969
1071
|
].filter((c)=>c).join(" "),
|
|
970
|
-
style:
|
|
1072
|
+
style: {
|
|
1073
|
+
...rest.style,
|
|
971
1074
|
opacity: moving ? 0.8 : windowVisible ? 1 : 0,
|
|
972
1075
|
visibility: windowVisible ? "visible" : "hidden",
|
|
973
1076
|
zIndex: zIndex,
|
|
974
|
-
minHeight:
|
|
975
|
-
minWidth:
|
|
976
|
-
maxHeight:
|
|
977
|
-
maxWidth:
|
|
978
|
-
}
|
|
1077
|
+
minHeight: rest.style?.minHeight ?? "150px",
|
|
1078
|
+
minWidth: rest.style?.minWidth ?? "200px",
|
|
1079
|
+
maxHeight: rest.style?.maxHeight ?? "1000px",
|
|
1080
|
+
maxWidth: rest.style?.maxWidth ?? "1000px"
|
|
1081
|
+
},
|
|
979
1082
|
onClickCapture: (e)=>{
|
|
980
|
-
var _rest_onClickCapture;
|
|
981
1083
|
pushToTop();
|
|
982
|
-
|
|
1084
|
+
rest.onClickCapture?.(e);
|
|
983
1085
|
},
|
|
984
1086
|
children: [
|
|
985
1087
|
/*#__PURE__*/ (0, $duWW8$jsxs)("div", {
|
|
@@ -987,16 +1089,7 @@ const $b5e8657823def5be$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $duWW8$forwa
|
|
|
987
1089
|
(0, (/*@__PURE__*/$parcel$interopDefault($ddf7153c7c69b209$exports))).contextWindowTitle,
|
|
988
1090
|
moving ? (0, (/*@__PURE__*/$parcel$interopDefault($ddf7153c7c69b209$exports))).moving : ""
|
|
989
1091
|
].filter((c)=>c !== "").join(" "),
|
|
990
|
-
onMouseDown:
|
|
991
|
-
if (e.target && (e.target instanceof HTMLElement || e.target instanceof SVGElement)) e.target.style.userSelect = "none";
|
|
992
|
-
setMoving(true);
|
|
993
|
-
pushToTop();
|
|
994
|
-
document.addEventListener("mouseup", mouseUp);
|
|
995
|
-
document.addEventListener("mousemove", mouseMove);
|
|
996
|
-
const resizeListener = ()=>checkPosition();
|
|
997
|
-
resizeListenerRef.current = resizeListener;
|
|
998
|
-
window.addEventListener("resize", resizeListener);
|
|
999
|
-
},
|
|
1092
|
+
onMouseDown: onMouseDown,
|
|
1000
1093
|
children: [
|
|
1001
1094
|
/*#__PURE__*/ (0, $duWW8$jsx)("div", {
|
|
1002
1095
|
className: (0, (/*@__PURE__*/$parcel$interopDefault($ddf7153c7c69b209$exports))).contextWindowTitleText,
|
|
@@ -1029,7 +1122,7 @@ const $b5e8657823def5be$export$1af8984c69ba1b24 = /*#__PURE__*/ (0, $duWW8$forwa
|
|
|
1029
1122
|
})
|
|
1030
1123
|
})
|
|
1031
1124
|
]
|
|
1032
|
-
})
|
|
1125
|
+
}), document.body)
|
|
1033
1126
|
});
|
|
1034
1127
|
});
|
|
1035
1128
|
$b5e8657823def5be$export$1af8984c69ba1b24.displayName = "ContextWindow";
|
|
@@ -1039,5 +1132,6 @@ $b5e8657823def5be$export$1af8984c69ba1b24.displayName = "ContextWindow";
|
|
|
1039
1132
|
|
|
1040
1133
|
|
|
1041
1134
|
|
|
1042
|
-
|
|
1135
|
+
|
|
1136
|
+
export {$a7d2a7efe39e6c95$export$f93615b9594453fc as useMouseMove, $62873e7e5aeec7f1$export$77bf000da9303d1 as AutoHeight, $c3e82278b501f10c$export$d4ebdd58e04c6ace as ClickForMenu, $567ed433af94513f$export$8dc6765e8be191c7 as ContextMenu, $1e1c1e9e0b943830$export$ed4f9641643dc7e4 as ContextMenuHandler, $b5e8657823def5be$export$1af8984c69ba1b24 as ContextWindow};
|
|
1043
1137
|
//# sourceMappingURL=main.js.map
|