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