@asup/context-menu 1.3.8 → 1.3.10

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 DELETED
@@ -1,721 +0,0 @@
1
- require("./main.css");
2
- var $gTuX4$reactjsxruntime = require("react/jsx-runtime");
3
- var $gTuX4$react = require("react");
4
- var $gTuX4$reactdom = require("react-dom");
5
-
6
-
7
- function $parcel$exportWildcard(dest, source) {
8
- Object.keys(source).forEach(function(key) {
9
- if (key === 'default' || key === '__esModule' || Object.prototype.hasOwnProperty.call(dest, key)) {
10
- return;
11
- }
12
-
13
- Object.defineProperty(dest, key, {
14
- enumerable: true,
15
- get: function get() {
16
- return source[key];
17
- }
18
- });
19
- });
20
-
21
- return dest;
22
- }
23
-
24
- function $parcel$export(e, n, v, s) {
25
- Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
26
- }
27
-
28
- function $parcel$interopDefault(a) {
29
- return a && a.__esModule ? a.default : a;
30
- }
31
-
32
-
33
- var $a68bd8a6c0fd98c2$exports = {};
34
-
35
- $parcel$export($a68bd8a6c0fd98c2$exports, "ContextMenuHandler", function () { return $3c568ee547c732c3$export$ed4f9641643dc7e4; });
36
- $parcel$export($a68bd8a6c0fd98c2$exports, "ContextWindow", function () { return $46fb0088a1bbb6d8$export$1af8984c69ba1b24; });
37
- $parcel$export($a68bd8a6c0fd98c2$exports, "ContextWindowStack", function () { return $16208d559c772441$export$9f37482ccd50dad2; });
38
-
39
-
40
-
41
-
42
-
43
- var $da5a7b95ca760552$exports = {};
44
-
45
- $parcel$export($da5a7b95ca760552$exports, "anchor", function () { return $da5a7b95ca760552$export$2e2992790a6f69a8; }, function (v) { return $da5a7b95ca760552$export$2e2992790a6f69a8 = v; });
46
- $parcel$export($da5a7b95ca760552$exports, "caretHolder", function () { return $da5a7b95ca760552$export$6ed5f4fbab298e07; }, function (v) { return $da5a7b95ca760552$export$6ed5f4fbab298e07 = v; });
47
- $parcel$export($da5a7b95ca760552$exports, "contextMenu", function () { return $da5a7b95ca760552$export$218b899e1d476006; }, function (v) { return $da5a7b95ca760552$export$218b899e1d476006 = v; });
48
- $parcel$export($da5a7b95ca760552$exports, "contextMenuHandler", function () { return $da5a7b95ca760552$export$ed8ffb5bb55a3bc8; }, function (v) { return $da5a7b95ca760552$export$ed8ffb5bb55a3bc8 = v; });
49
- $parcel$export($da5a7b95ca760552$exports, "contextMenuItem", function () { return $da5a7b95ca760552$export$e5ea51c279904378; }, function (v) { return $da5a7b95ca760552$export$e5ea51c279904378 = v; });
50
- $parcel$export($da5a7b95ca760552$exports, "contextMenuItemLabel", function () { return $da5a7b95ca760552$export$6ada86c5b962aa22; }, function (v) { return $da5a7b95ca760552$export$6ada86c5b962aa22 = v; });
51
- $parcel$export($da5a7b95ca760552$exports, "disabled", function () { return $da5a7b95ca760552$export$683472f6198a076e; }, function (v) { return $da5a7b95ca760552$export$683472f6198a076e = v; });
52
- $parcel$export($da5a7b95ca760552$exports, "hidden", function () { return $da5a7b95ca760552$export$73920f18ca706874; }, function (v) { return $da5a7b95ca760552$export$73920f18ca706874 = v; });
53
- $parcel$export($da5a7b95ca760552$exports, "subMenu", function () { return $da5a7b95ca760552$export$6e0e6ce39e5a0361; }, function (v) { return $da5a7b95ca760552$export$6e0e6ce39e5a0361 = v; });
54
- $parcel$export($da5a7b95ca760552$exports, "visible", function () { return $da5a7b95ca760552$export$664c6d24e3175067; }, function (v) { return $da5a7b95ca760552$export$664c6d24e3175067 = v; });
55
- var $da5a7b95ca760552$export$2e2992790a6f69a8;
56
- var $da5a7b95ca760552$export$6ed5f4fbab298e07;
57
- var $da5a7b95ca760552$export$218b899e1d476006;
58
- var $da5a7b95ca760552$export$ed8ffb5bb55a3bc8;
59
- var $da5a7b95ca760552$export$e5ea51c279904378;
60
- var $da5a7b95ca760552$export$6ada86c5b962aa22;
61
- var $da5a7b95ca760552$export$683472f6198a076e;
62
- var $da5a7b95ca760552$export$73920f18ca706874;
63
- var $da5a7b95ca760552$export$6e0e6ce39e5a0361;
64
- var $da5a7b95ca760552$export$664c6d24e3175067;
65
- $da5a7b95ca760552$export$2e2992790a6f69a8 = `aiw-ContextMenu-module-WinFxq-anchor`;
66
- $da5a7b95ca760552$export$6ed5f4fbab298e07 = `aiw-ContextMenu-module-WinFxq-caretHolder`;
67
- $da5a7b95ca760552$export$218b899e1d476006 = `aiw-ContextMenu-module-WinFxq-contextMenu`;
68
- $da5a7b95ca760552$export$ed8ffb5bb55a3bc8 = `aiw-ContextMenu-module-WinFxq-contextMenuHandler`;
69
- $da5a7b95ca760552$export$e5ea51c279904378 = `aiw-ContextMenu-module-WinFxq-contextMenuItem`;
70
- $da5a7b95ca760552$export$6ada86c5b962aa22 = `aiw-ContextMenu-module-WinFxq-contextMenuItemLabel`;
71
- $da5a7b95ca760552$export$683472f6198a076e = `aiw-ContextMenu-module-WinFxq-disabled`;
72
- $da5a7b95ca760552$export$73920f18ca706874 = `aiw-ContextMenu-module-WinFxq-hidden`;
73
- $da5a7b95ca760552$export$6e0e6ce39e5a0361 = `aiw-ContextMenu-module-WinFxq-subMenu`;
74
- $da5a7b95ca760552$export$664c6d24e3175067 = `aiw-ContextMenu-module-WinFxq-visible`;
75
-
76
-
77
-
78
-
79
-
80
-
81
- const $d35a356381c44181$export$7e4e6110f96afd7e = ({ entries: entries, toClose: toClose })=>{
82
- const [visible, setVisible] = (0, $gTuX4$react.useState)(false);
83
- return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)("span", {
84
- className: (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).caretHolder,
85
- onMouseEnter: ()=>{
86
- setVisible(true);
87
- },
88
- onMouseLeave: ()=>{
89
- setVisible(false);
90
- },
91
- children: [
92
- /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("svg", {
93
- xmlns: "http://www.w3.org/2000/svg",
94
- width: "16",
95
- height: "16",
96
- fill: "currentColor",
97
- viewBox: "0 0 16 16",
98
- children: /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("path", {
99
- d: "m12.14 8.753-5.482 4.796c-.646.566-1.658.106-1.658-.753V3.204a1 1 0 0 1 1.659-.753l5.48 4.796a1 1 0 0 1 0 1.506z"
100
- })
101
- }),
102
- /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
103
- className: (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).subMenu,
104
- children: /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)((0, $5150b66b01c99189$export$8dc6765e8be191c7), {
105
- visible: visible,
106
- entries: entries,
107
- xPos: 14,
108
- yPos: -21,
109
- toClose: toClose
110
- })
111
- })
112
- ]
113
- });
114
- };
115
- $d35a356381c44181$export$7e4e6110f96afd7e.displayName = "ContextSubMenu";
116
-
117
-
118
- const $5150b66b01c99189$export$8dc6765e8be191c7 = /*#__PURE__*/ (0, ($parcel$interopDefault($gTuX4$react))).forwardRef(({ visible: visible, entries: entries, xPos: xPos, yPos: yPos, toClose: toClose }, ref)=>{
119
- const [target, setTarget] = (0, $gTuX4$react.useState)(null);
120
- return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
121
- ref: ref,
122
- className: [
123
- (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).contextMenu,
124
- visible ? (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).visible : (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).hidden
125
- ].filter((c)=>c !== "").join(" "),
126
- style: {
127
- top: `${yPos}px`,
128
- left: `${xPos}px`
129
- },
130
- onContextMenuCapture: (e)=>{
131
- e.preventDefault();
132
- e.stopPropagation();
133
- },
134
- children: entries.map((entry, i)=>/*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)("div", {
135
- className: [
136
- (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).contextMenuItem,
137
- entry.disabled ? (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).disabled : ""
138
- ].filter((c)=>c !== "").join(" "),
139
- children: [
140
- typeof entry.label === "string" ? /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("span", {
141
- "aria-label": typeof entry.label === "string" ? entry.label : undefined,
142
- "aria-disabled": entry.disabled,
143
- className: (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).contextMenuItemLabel,
144
- onMouseEnter: ()=>{
145
- const sel = window.getSelection();
146
- const target = sel && sel.rangeCount > 0 ? sel.getRangeAt(0) : null;
147
- setTarget(target);
148
- },
149
- onMouseLeave: ()=>{
150
- setTarget(null);
151
- },
152
- onMouseDownCapture: (e)=>{
153
- e.preventDefault();
154
- e.stopPropagation();
155
- entry.action && !entry.disabled && entry.action(target);
156
- !entry.disabled && toClose();
157
- },
158
- children: entry.label
159
- }) : entry.label,
160
- entry.group && /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)((0, $d35a356381c44181$export$7e4e6110f96afd7e), {
161
- toClose: toClose,
162
- entries: entry.group
163
- })
164
- ]
165
- }, i))
166
- });
167
- });
168
- $5150b66b01c99189$export$8dc6765e8be191c7.displayName = "ContextMenu";
169
-
170
-
171
-
172
-
173
- var $63cdf2819565020c$exports = {};
174
-
175
- $parcel$export($63cdf2819565020c$exports, "caretHolder", function () { return $63cdf2819565020c$export$6ed5f4fbab298e07; }, function (v) { return $63cdf2819565020c$export$6ed5f4fbab298e07 = v; });
176
- $parcel$export($63cdf2819565020c$exports, "disabled", function () { return $63cdf2819565020c$export$683472f6198a076e; }, function (v) { return $63cdf2819565020c$export$683472f6198a076e = v; });
177
- $parcel$export($63cdf2819565020c$exports, "hidden", function () { return $63cdf2819565020c$export$73920f18ca706874; }, function (v) { return $63cdf2819565020c$export$73920f18ca706874 = v; });
178
- $parcel$export($63cdf2819565020c$exports, "lowMenu", function () { return $63cdf2819565020c$export$59e4b099a896b33; }, function (v) { return $63cdf2819565020c$export$59e4b099a896b33 = v; });
179
- $parcel$export($63cdf2819565020c$exports, "lowMenu-item", function () { return $63cdf2819565020c$export$19fbf76b734bf310; }, function (v) { return $63cdf2819565020c$export$19fbf76b734bf310 = v; });
180
- $parcel$export($63cdf2819565020c$exports, "lowMenuButtonHolder", function () { return $63cdf2819565020c$export$22ec12d194e0789c; }, function (v) { return $63cdf2819565020c$export$22ec12d194e0789c = v; });
181
- $parcel$export($63cdf2819565020c$exports, "lowMenuItem", function () { return $63cdf2819565020c$export$2ad34a478577e75d; }, function (v) { return $63cdf2819565020c$export$2ad34a478577e75d = v; });
182
- $parcel$export($63cdf2819565020c$exports, "subMenu", function () { return $63cdf2819565020c$export$6e0e6ce39e5a0361; }, function (v) { return $63cdf2819565020c$export$6e0e6ce39e5a0361 = v; });
183
- $parcel$export($63cdf2819565020c$exports, "visible", function () { return $63cdf2819565020c$export$664c6d24e3175067; }, function (v) { return $63cdf2819565020c$export$664c6d24e3175067 = v; });
184
- var $63cdf2819565020c$export$6ed5f4fbab298e07;
185
- var $63cdf2819565020c$export$683472f6198a076e;
186
- var $63cdf2819565020c$export$73920f18ca706874;
187
- var $63cdf2819565020c$export$59e4b099a896b33;
188
- var $63cdf2819565020c$export$19fbf76b734bf310;
189
- var $63cdf2819565020c$export$22ec12d194e0789c;
190
- var $63cdf2819565020c$export$2ad34a478577e75d;
191
- var $63cdf2819565020c$export$6e0e6ce39e5a0361;
192
- var $63cdf2819565020c$export$664c6d24e3175067;
193
- $63cdf2819565020c$export$6ed5f4fbab298e07 = `aiw-LowMenu-module-JfzGeq-caretHolder`;
194
- $63cdf2819565020c$export$683472f6198a076e = `aiw-LowMenu-module-JfzGeq-disabled`;
195
- $63cdf2819565020c$export$73920f18ca706874 = `aiw-LowMenu-module-JfzGeq-hidden`;
196
- $63cdf2819565020c$export$59e4b099a896b33 = `aiw-LowMenu-module-JfzGeq-lowMenu`;
197
- $63cdf2819565020c$export$19fbf76b734bf310 = `aiw-LowMenu-module-JfzGeq-lowMenu-item`;
198
- $63cdf2819565020c$export$22ec12d194e0789c = `aiw-LowMenu-module-JfzGeq-lowMenuButtonHolder`;
199
- $63cdf2819565020c$export$2ad34a478577e75d = `aiw-LowMenu-module-JfzGeq-lowMenuItem`;
200
- $63cdf2819565020c$export$6e0e6ce39e5a0361 = `aiw-LowMenu-module-JfzGeq-subMenu`;
201
- $63cdf2819565020c$export$664c6d24e3175067 = `aiw-LowMenu-module-JfzGeq-visible`;
202
-
203
-
204
-
205
-
206
-
207
-
208
-
209
-
210
- const $d30299730ea8ec1e$export$251b9f54013cdfac = ({ entry: entry })=>{
211
- const [visible, setVisible] = (0, $gTuX4$react.useState)(false);
212
- if (!entry.group || entry.group.length === 0) return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)((0, $gTuX4$reactjsxruntime.Fragment), {});
213
- return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)("span", {
214
- "aria-label": `Sub menu for ${entry.label}`,
215
- className: (0, (/*@__PURE__*/$parcel$interopDefault($63cdf2819565020c$exports))).caretHolder,
216
- onMouseEnter: ()=>{
217
- setVisible(true);
218
- },
219
- onMouseLeave: ()=>{
220
- setVisible(false);
221
- },
222
- children: [
223
- /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("svg", {
224
- xmlns: "http://www.w3.org/2000/svg",
225
- width: "16",
226
- height: "16",
227
- fill: "currentColor",
228
- viewBox: "0 0 16 16",
229
- children: /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("path", {
230
- d: "m12.14 8.753-5.482 4.796c-.646.566-1.658.106-1.658-.753V3.204a1 1 0 0 1 1.659-.753l5.48 4.796a1 1 0 0 1 0 1.506z"
231
- })
232
- }),
233
- /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
234
- className: (0, (/*@__PURE__*/$parcel$interopDefault($63cdf2819565020c$exports))).subMenu,
235
- children: visible && /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)((0, $5150b66b01c99189$export$8dc6765e8be191c7), {
236
- visible: visible,
237
- entries: entry.group,
238
- xPos: 14,
239
- yPos: entry.group.length * -21 - 8,
240
- toClose: ()=>setVisible(false)
241
- })
242
- })
243
- ]
244
- });
245
- };
246
- $d30299730ea8ec1e$export$251b9f54013cdfac.displayName = "LowSubMenu";
247
-
248
-
249
-
250
- const $b34598671fff4a77$export$aafc28aea571c4bc = ({ entry: entry })=>{
251
- const [target, setTarget] = (0, $gTuX4$react.useState)(null);
252
- return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)("div", {
253
- className: [
254
- (0, (/*@__PURE__*/$parcel$interopDefault($63cdf2819565020c$exports))).lowMenuItem,
255
- entry.disabled ? (0, (/*@__PURE__*/$parcel$interopDefault($63cdf2819565020c$exports))).disabled : ""
256
- ].filter((c)=>c !== "").join(" "),
257
- "aria-label": typeof entry.label === "string" ? entry.label : undefined,
258
- "aria-disabled": entry.disabled,
259
- onMouseEnter: ()=>{
260
- const sel = window.getSelection();
261
- const target = sel && sel.rangeCount > 0 ? sel.getRangeAt(0) : null;
262
- setTarget(target);
263
- },
264
- onMouseLeave: ()=>{
265
- setTarget(null);
266
- },
267
- onClick: (e)=>{
268
- e.preventDefault();
269
- e.stopPropagation();
270
- entry.action && !entry.disabled && entry.action(target);
271
- },
272
- children: [
273
- /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("span", {
274
- children: entry.label
275
- }),
276
- entry.group && /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)((0, $d30299730ea8ec1e$export$251b9f54013cdfac), {
277
- entry: entry
278
- })
279
- ]
280
- });
281
- };
282
- $b34598671fff4a77$export$aafc28aea571c4bc.displayName = "LowMenuButton";
283
-
284
-
285
- const $10d1ee4e7fc9bbbd$export$49e8edc8ebca5f25 = ({ entries: entries, visible: visible, xPos: xPos, yPos: yPos, maxWidth: maxWidth })=>{
286
- return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
287
- className: [
288
- (0, (/*@__PURE__*/$parcel$interopDefault($63cdf2819565020c$exports))).lowMenu,
289
- visible ? (0, (/*@__PURE__*/$parcel$interopDefault($63cdf2819565020c$exports))).visible : (0, (/*@__PURE__*/$parcel$interopDefault($63cdf2819565020c$exports))).hidden
290
- ].join(" "),
291
- "aria-label": "Low context menu",
292
- style: {
293
- left: `${xPos}px`,
294
- top: `${yPos}px`,
295
- maxWidth: `calc(${maxWidth}px)`,
296
- width: `calc(${maxWidth}px - 4px)`
297
- },
298
- children: /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
299
- className: (0, (/*@__PURE__*/$parcel$interopDefault($63cdf2819565020c$exports))).lowMenuButtonHolder,
300
- children: entries.map((e, i)=>/*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)((0, $b34598671fff4a77$export$aafc28aea571c4bc), {
301
- entry: e
302
- }, i))
303
- })
304
- });
305
- };
306
- $10d1ee4e7fc9bbbd$export$49e8edc8ebca5f25.displayName = "LowMenu";
307
-
308
-
309
- const $3c568ee547c732c3$export$fc58dc71afe92de2 = /*#__PURE__*/ (0, $gTuX4$react.createContext)(null);
310
- const $3c568ee547c732c3$export$ed4f9641643dc7e4 = ({ children: children, menuItems: menuItems, showLowMenu: showLowMenu = false, ...rest })=>{
311
- var _divHandlderRef_current;
312
- // Check for higher content menu
313
- const higherContext = (0, $gTuX4$react.useContext)($3c568ee547c732c3$export$fc58dc71afe92de2);
314
- const thisMenuItems = (0, $gTuX4$react.useMemo)(()=>[
315
- ...higherContext !== null ? [
316
- ...higherContext.menuItems,
317
- {
318
- label: /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("hr", {
319
- style: {
320
- flexGrow: 1,
321
- cursor: "none",
322
- margin: "0",
323
- padding: "0"
324
- }
325
- })
326
- }
327
- ] : [],
328
- ...menuItems
329
- ], [
330
- higherContext,
331
- menuItems
332
- ]);
333
- // Menu resources
334
- const divHandlderRef = (0, $gTuX4$react.useRef)(null);
335
- const menuRef = (0, $gTuX4$react.useRef)(null);
336
- const [menuXPos, setMenuXPos] = (0, $gTuX4$react.useState)(0);
337
- const [menuYPos, setMenuYPos] = (0, $gTuX4$react.useState)(0);
338
- const [menuVisible, setMenuVisible] = (0, $gTuX4$react.useState)(false);
339
- const [menuInDom, setMenuInDom] = (0, $gTuX4$react.useState)(false);
340
- const [mouseOverHandlerDiv, setMouseOverHandlerDiv] = (0, $gTuX4$react.useState)(false);
341
- const [mouseOverMenu, setMouseOverMenu] = (0, $gTuX4$react.useState)(false);
342
- // Get holder position
343
- const divHandlerPos = divHandlderRef ? (_divHandlderRef_current = divHandlderRef.current) === null || _divHandlderRef_current === void 0 ? void 0 : _divHandlderRef_current.getBoundingClientRect() : null;
344
- // Handle click off the menu
345
- const handleClick = (0, $gTuX4$react.useCallback)((e)=>{
346
- var _menuRef_current;
347
- 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);
348
- }, []);
349
- // Update the document click handler
350
- (0, $gTuX4$react.useEffect)(()=>{
351
- if (menuVisible) document.addEventListener("mousedown", handleClick);
352
- else document.removeEventListener("mousedown", handleClick);
353
- return ()=>{
354
- document.removeEventListener("mousedown", handleClick);
355
- };
356
- }, [
357
- handleClick,
358
- menuVisible
359
- ]);
360
- const removeController = (0, $gTuX4$react.useRef)(new AbortController());
361
- (0, $gTuX4$react.useEffect)(()=>{
362
- if (!mouseOverMenu && !menuVisible && !mouseOverHandlerDiv) {
363
- removeController.current.abort();
364
- removeController.current = new AbortController();
365
- setTimeout(()=>{
366
- if (!removeController.current.signal.aborted) setMenuInDom(false);
367
- }, 300);
368
- }
369
- }, [
370
- mouseOverHandlerDiv,
371
- menuVisible,
372
- mouseOverMenu
373
- ]);
374
- return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)($3c568ee547c732c3$export$fc58dc71afe92de2.Provider, {
375
- value: {
376
- menuItems: thisMenuItems
377
- },
378
- children: [
379
- /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
380
- ref: divHandlderRef,
381
- ...rest,
382
- className: [
383
- (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).contextMenuHandler,
384
- rest.className
385
- ].join(" "),
386
- onContextMenu: (e)=>{
387
- if (!showLowMenu) {
388
- setMenuInDom(true);
389
- e.preventDefault();
390
- e.stopPropagation();
391
- setTimeout(()=>{
392
- removeController.current.abort();
393
- setMenuVisible(true);
394
- setMenuXPos(e.pageX);
395
- setMenuYPos(e.pageY);
396
- }, 1);
397
- }
398
- },
399
- onMouseEnter: (e)=>{
400
- if (showLowMenu) {
401
- setMenuInDom(true);
402
- setMouseOverHandlerDiv(false);
403
- setTimeout(()=>{
404
- removeController.current.abort();
405
- setMouseOverHandlerDiv(true);
406
- }, 1);
407
- }
408
- rest.onMouseEnter && rest.onMouseEnter(e);
409
- },
410
- onMouseLeave: (e)=>{
411
- if (showLowMenu) {
412
- removeController.current.abort();
413
- removeController.current = new AbortController();
414
- setMouseOverHandlerDiv(false);
415
- }
416
- rest.onMouseLeave && rest.onMouseLeave(e);
417
- },
418
- children: children
419
- }),
420
- menuInDom && divHandlerPos && /*#__PURE__*/ (0, $gTuX4$reactdom.createPortal)(/*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
421
- className: (0, (/*@__PURE__*/$parcel$interopDefault($da5a7b95ca760552$exports))).anchor,
422
- onMouseEnter: ()=>{
423
- removeController.current.abort();
424
- setMouseOverMenu(true);
425
- },
426
- onMouseLeave: ()=>{
427
- removeController.current.abort();
428
- removeController.current = new AbortController();
429
- setMouseOverMenu(false);
430
- },
431
- children: showLowMenu ? /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)((0, $10d1ee4e7fc9bbbd$export$49e8edc8ebca5f25), {
432
- visible: mouseOverHandlerDiv,
433
- entries: menuItems,
434
- xPos: divHandlerPos.left,
435
- yPos: divHandlerPos.bottom,
436
- maxWidth: divHandlerPos.width
437
- }) : /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)((0, $5150b66b01c99189$export$8dc6765e8be191c7), {
438
- visible: menuVisible,
439
- ref: menuRef,
440
- entries: thisMenuItems,
441
- xPos: menuXPos,
442
- yPos: menuYPos,
443
- toClose: ()=>{
444
- setMenuVisible(false);
445
- setMouseOverMenu(false);
446
- }
447
- })
448
- }), document.body)
449
- ]
450
- });
451
- };
452
- $3c568ee547c732c3$export$ed4f9641643dc7e4.displayName = "ContextMenuHandler";
453
-
454
-
455
-
456
-
457
-
458
- const $c986bcdcae4b83bd$export$d81cfea7c54be196 = (divRef)=>{
459
- if (!divRef.current) return {
460
- translateX: 0,
461
- translateY: 0
462
- };
463
- else {
464
- const innerBounce = 16;
465
- const posn = divRef.current.getBoundingClientRect();
466
- let translateX = 0;
467
- if (posn.left < innerBounce) translateX = -posn.left + innerBounce;
468
- else if (posn.right > window.innerWidth) translateX = Math.max(-posn.left + innerBounce, window.innerWidth - posn.right - innerBounce);
469
- let translateY = 0;
470
- if (posn.top < innerBounce) translateY = -posn.top + innerBounce;
471
- else if (posn.bottom > window.innerHeight) translateY = Math.max(-posn.top + innerBounce, window.innerHeight - posn.bottom - innerBounce);
472
- return {
473
- translateX: translateX,
474
- translateY: translateY
475
- };
476
- }
477
- };
478
-
479
-
480
-
481
-
482
- const $16208d559c772441$export$aff5d0593e3727b0 = /*#__PURE__*/ (0, $gTuX4$react.createContext)(null);
483
- const $16208d559c772441$var$pushToTop = (windowId, minZIndex, windowList, setWindowList)=>{
484
- const otherWindows = windowList.filter((w)=>w.windowId !== windowId).map((w, i)=>({
485
- windowId: w.windowId,
486
- zIndex: minZIndex + i
487
- }));
488
- setWindowList([
489
- ...otherWindows,
490
- {
491
- windowId: windowId,
492
- zIndex: minZIndex + otherWindows.length
493
- }
494
- ]);
495
- };
496
- const $16208d559c772441$export$9f37482ccd50dad2 = ({ minZIndex: minZIndex = 1000, children: children })=>{
497
- const [currentWindows, setCurrentWindows] = (0, $gTuX4$react.useState)([]);
498
- return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)($16208d559c772441$export$aff5d0593e3727b0.Provider, {
499
- value: {
500
- currentWindows: currentWindows.map((w)=>({
501
- windowId: w.windowId,
502
- zIndex: minZIndex + w.zIndex
503
- })),
504
- pushToTop: (ret)=>$16208d559c772441$var$pushToTop(ret, minZIndex, currentWindows, setCurrentWindows)
505
- },
506
- children: children
507
- });
508
- };
509
- $16208d559c772441$export$9f37482ccd50dad2.displayName = "ContextWindowStack";
510
-
511
-
512
- var $7c5fb3f6c1601913$exports = {};
513
-
514
- $parcel$export($7c5fb3f6c1601913$exports, "contextWindow", function () { return $7c5fb3f6c1601913$export$72cad2e5ad4d2674; }, function (v) { return $7c5fb3f6c1601913$export$72cad2e5ad4d2674 = v; });
515
- $parcel$export($7c5fb3f6c1601913$exports, "contextWindowAnchor", function () { return $7c5fb3f6c1601913$export$9f3a8a17ac700f7d; }, function (v) { return $7c5fb3f6c1601913$export$9f3a8a17ac700f7d = v; });
516
- $parcel$export($7c5fb3f6c1601913$exports, "contextWindowBody", function () { return $7c5fb3f6c1601913$export$dfb2c4d2d1c0156f; }, function (v) { return $7c5fb3f6c1601913$export$dfb2c4d2d1c0156f = v; });
517
- $parcel$export($7c5fb3f6c1601913$exports, "contextWindowTitle", function () { return $7c5fb3f6c1601913$export$1b02f2cd2f7db0f4; }, function (v) { return $7c5fb3f6c1601913$export$1b02f2cd2f7db0f4 = v; });
518
- $parcel$export($7c5fb3f6c1601913$exports, "contextWindowTitleClose", function () { return $7c5fb3f6c1601913$export$7ba38d4cc2870e66; }, function (v) { return $7c5fb3f6c1601913$export$7ba38d4cc2870e66 = v; });
519
- $parcel$export($7c5fb3f6c1601913$exports, "contextWindowTitleText", function () { return $7c5fb3f6c1601913$export$cebbac70b4d99c48; }, function (v) { return $7c5fb3f6c1601913$export$cebbac70b4d99c48 = v; });
520
- $parcel$export($7c5fb3f6c1601913$exports, "moving", function () { return $7c5fb3f6c1601913$export$d03a2f3acc60252b; }, function (v) { return $7c5fb3f6c1601913$export$d03a2f3acc60252b = v; });
521
- var $7c5fb3f6c1601913$export$72cad2e5ad4d2674;
522
- var $7c5fb3f6c1601913$export$9f3a8a17ac700f7d;
523
- var $7c5fb3f6c1601913$export$dfb2c4d2d1c0156f;
524
- var $7c5fb3f6c1601913$export$1b02f2cd2f7db0f4;
525
- var $7c5fb3f6c1601913$export$7ba38d4cc2870e66;
526
- var $7c5fb3f6c1601913$export$cebbac70b4d99c48;
527
- var $7c5fb3f6c1601913$export$d03a2f3acc60252b;
528
- $7c5fb3f6c1601913$export$72cad2e5ad4d2674 = `aiw-ContextWindow-module-RIIF9a-contextWindow`;
529
- $7c5fb3f6c1601913$export$9f3a8a17ac700f7d = `aiw-ContextWindow-module-RIIF9a-contextWindowAnchor`;
530
- $7c5fb3f6c1601913$export$dfb2c4d2d1c0156f = `aiw-ContextWindow-module-RIIF9a-contextWindowBody`;
531
- $7c5fb3f6c1601913$export$1b02f2cd2f7db0f4 = `aiw-ContextWindow-module-RIIF9a-contextWindowTitle`;
532
- $7c5fb3f6c1601913$export$7ba38d4cc2870e66 = `aiw-ContextWindow-module-RIIF9a-contextWindowTitleClose`;
533
- $7c5fb3f6c1601913$export$cebbac70b4d99c48 = `aiw-ContextWindow-module-RIIF9a-contextWindowTitleText`;
534
- $7c5fb3f6c1601913$export$d03a2f3acc60252b = `aiw-ContextWindow-module-RIIF9a-moving`;
535
-
536
-
537
- const $46fb0088a1bbb6d8$export$1af8984c69ba1b24 = ({ id: id, visible: visible, title: title, children: children, onOpen: onOpen, onClose: onClose, ...rest })=>{
538
- var _rest_style, _rest_style1, _rest_style2, _rest_style3;
539
- const windowStack = (0, $gTuX4$react.useContext)((0, $16208d559c772441$export$aff5d0593e3727b0));
540
- const windowId = (0, $gTuX4$react.useRef)(null);
541
- const divRef = (0, $gTuX4$react.useRef)(null);
542
- const windowRef = (0, $gTuX4$react.useRef)(null);
543
- const [windowInDOM, setWindowInDOM] = (0, $gTuX4$react.useState)(false);
544
- const [windowVisible, setWindowVisible] = (0, $gTuX4$react.useState)(false);
545
- const zIndex = (0, $gTuX4$react.useMemo)(()=>{
546
- var _windowStack_currentWindows_find;
547
- var _windowStack_currentWindows_find_zIndex;
548
- return (_windowStack_currentWindows_find_zIndex = windowStack === null || windowStack === void 0 ? void 0 : (_windowStack_currentWindows_find = windowStack.currentWindows.find((w)=>w.windowId === windowId.current)) === null || _windowStack_currentWindows_find === void 0 ? void 0 : _windowStack_currentWindows_find.zIndex) !== null && _windowStack_currentWindows_find_zIndex !== void 0 ? _windowStack_currentWindows_find_zIndex : 1;
549
- }, [
550
- windowStack === null || windowStack === void 0 ? void 0 : windowStack.currentWindows
551
- ]);
552
- // Position
553
- const windowPos = (0, $gTuX4$react.useRef)({
554
- x: 0,
555
- y: 0
556
- });
557
- const [moving, setMoving] = (0, $gTuX4$react.useState)(false);
558
- const move = (0, $gTuX4$react.useCallback)((x, y)=>{
559
- if (windowRef.current && windowPos.current) {
560
- const window1 = windowRef.current;
561
- const pos = windowPos.current;
562
- pos.x += x;
563
- pos.y += y;
564
- window1.style.transform = `translate(${pos.x}px, ${pos.y}px)`;
565
- }
566
- }, []);
567
- const checkPosition = (0, $gTuX4$react.useCallback)(()=>{
568
- const chkPos = (0, $c986bcdcae4b83bd$export$d81cfea7c54be196)(windowRef);
569
- move(chkPos.translateX, chkPos.translateY);
570
- }, [
571
- move
572
- ]);
573
- const mouseMove = (0, $gTuX4$react.useCallback)((e)=>{
574
- e.preventDefault();
575
- e.stopPropagation();
576
- move(e.movementX, e.movementY);
577
- }, [
578
- move
579
- ]);
580
- const mouseUp = (0, $gTuX4$react.useCallback)((e)=>{
581
- e.preventDefault();
582
- e.stopPropagation();
583
- setMoving(false);
584
- checkPosition();
585
- document.removeEventListener("mousemove", mouseMove);
586
- document.removeEventListener("mouseup", mouseUp);
587
- window.removeEventListener("resize", checkPosition);
588
- if (e.target && (e.target instanceof HTMLElement || e.target instanceof SVGElement)) e.target.style.userSelect = "auto";
589
- }, [
590
- checkPosition,
591
- mouseMove
592
- ]);
593
- // Update visibility
594
- (0, $gTuX4$react.useEffect)(()=>{
595
- if (windowStack) {
596
- // Visible set, but not in DOM
597
- if (visible && !windowInDOM) setWindowInDOM(true);
598
- else if (visible && windowInDOM && !windowVisible) {
599
- if (!windowId.current) {
600
- const maxWindowId = Math.max(0, ...windowStack.currentWindows.map((w)=>w.windowId));
601
- windowId.current = maxWindowId + 1;
602
- }
603
- windowStack.pushToTop(windowId.current);
604
- setWindowVisible(visible);
605
- onOpen && onOpen();
606
- // Get starting position
607
- if (divRef.current && windowRef.current) {
608
- const parentPos = divRef.current.getBoundingClientRect();
609
- const pos = windowRef.current.getBoundingClientRect();
610
- const windowHeight = pos.bottom - pos.top;
611
- windowRef.current.style.left = `${parentPos.left}px`;
612
- windowRef.current.style.top = `${parentPos.bottom + windowHeight < window.innerHeight ? parentPos.bottom : Math.max(0, parentPos.top - windowHeight)}px`;
613
- windowRef.current.style.transform = "";
614
- windowPos.current = {
615
- x: 0,
616
- y: 0
617
- };
618
- }
619
- checkPosition();
620
- } else if (windowId.current && !visible && windowVisible) setWindowVisible(false);
621
- else if (windowId.current && !visible && windowInDOM) setWindowInDOM(false);
622
- }
623
- }, [
624
- checkPosition,
625
- onOpen,
626
- visible,
627
- windowInDOM,
628
- windowStack,
629
- windowVisible
630
- ]);
631
- var _rest_style_minHeight, _rest_style_minWidth, _rest_style_maxHeight, _rest_style_maxWidth;
632
- return /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)("div", {
633
- className: (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindowAnchor,
634
- ref: divRef,
635
- children: [
636
- !windowStack && /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)("div", {
637
- ...rest,
638
- children: [
639
- false,
640
- children
641
- ]
642
- }),
643
- windowStack && windowInDOM && /*#__PURE__*/ (0, $gTuX4$reactdom.createPortal)(/*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)("div", {
644
- ...rest,
645
- ref: windowRef,
646
- id: id,
647
- className: [
648
- (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindow,
649
- rest.className
650
- ].join(" "),
651
- style: {
652
- ...rest.style,
653
- opacity: moving ? 0.8 : windowVisible ? 1 : 0,
654
- visibility: windowVisible ? "visible" : "hidden",
655
- zIndex: zIndex !== null && zIndex !== void 0 ? zIndex : 1,
656
- 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",
657
- 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",
658
- 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",
659
- 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"
660
- },
661
- onClickCapture: (e)=>{
662
- windowId && windowId.current && windowStack.pushToTop(windowId.current);
663
- rest.onClickCapture && rest.onClickCapture(e);
664
- },
665
- children: [
666
- /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsxs)("div", {
667
- className: [
668
- (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindowTitle,
669
- moving ? (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).moving : ""
670
- ].filter((c)=>c !== "").join(" "),
671
- onMouseDown: (e)=>{
672
- if (e.target && (e.target instanceof HTMLElement || e.target instanceof SVGElement)) e.target.style.userSelect = "none";
673
- setMoving(true);
674
- windowId && windowId.current && windowStack.pushToTop(windowId.current);
675
- document.addEventListener("mouseup", mouseUp);
676
- document.addEventListener("mousemove", mouseMove);
677
- window.addEventListener("resize", ()=>checkPosition());
678
- },
679
- children: [
680
- /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
681
- className: (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindowTitleText,
682
- children: title
683
- }),
684
- /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
685
- className: (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindowTitleClose,
686
- children: /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("svg", {
687
- xmlns: "http://www.w3.org/2000/svg",
688
- width: "16",
689
- height: "16",
690
- fill: "currentColor",
691
- viewBox: "0 0 16 16",
692
- "aria-label": "Close window",
693
- onClick: onClose,
694
- children: /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("path", {
695
- d: "M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z"
696
- })
697
- })
698
- })
699
- ]
700
- }),
701
- /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
702
- className: (0, (/*@__PURE__*/$parcel$interopDefault($7c5fb3f6c1601913$exports))).contextWindowBody,
703
- children: /*#__PURE__*/ (0, $gTuX4$reactjsxruntime.jsx)("div", {
704
- children: children
705
- })
706
- })
707
- ]
708
- }), document.body)
709
- ]
710
- });
711
- };
712
- $46fb0088a1bbb6d8$export$1af8984c69ba1b24.displayName = "ContextWindow";
713
-
714
-
715
-
716
-
717
-
718
- $parcel$exportWildcard(module.exports, $a68bd8a6c0fd98c2$exports);
719
-
720
-
721
- //# sourceMappingURL=main.js.map