@entur/menu 5.2.1-beta.0 → 5.2.1-beta.3
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/menu.cjs.js +33 -3194
- package/dist/menu.cjs.js.map +1 -1
- package/dist/menu.esm.js +128 -3272
- package/dist/menu.esm.js.map +1 -1
- package/package.json +11 -19
package/dist/menu.cjs.js
CHANGED
|
@@ -3,110 +3,25 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
|
3
3
|
const utils = require("@entur/utils");
|
|
4
4
|
const jsxRuntime = require("react/jsx-runtime");
|
|
5
5
|
const React = require("react");
|
|
6
|
+
const classNames = require("classnames");
|
|
6
7
|
const icons = require("@entur/icons");
|
|
7
|
-
const
|
|
8
|
+
const react = require("@floating-ui/react");
|
|
8
9
|
const button = require("@entur/button");
|
|
9
10
|
const tooltip = require("@entur/tooltip");
|
|
10
11
|
const tokens = require("@entur/tokens");
|
|
11
12
|
const a11y = require("@entur/a11y");
|
|
12
13
|
const typography = require("@entur/typography");
|
|
13
14
|
const expand = require("@entur/expand");
|
|
14
|
-
function _interopNamespaceDefault(e) {
|
|
15
|
-
const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
|
|
16
|
-
if (e) {
|
|
17
|
-
for (const k in e) {
|
|
18
|
-
if (k !== "default") {
|
|
19
|
-
const d = Object.getOwnPropertyDescriptor(e, k);
|
|
20
|
-
Object.defineProperty(n, k, d.get ? d : {
|
|
21
|
-
enumerable: true,
|
|
22
|
-
get: () => e[k]
|
|
23
|
-
});
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
n.default = e;
|
|
28
|
-
return Object.freeze(n);
|
|
29
|
-
}
|
|
30
|
-
const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
|
|
31
|
-
const ReactDOM__namespace = /* @__PURE__ */ _interopNamespaceDefault(ReactDOM);
|
|
32
15
|
const BreadcrumbNavigation = ({
|
|
33
16
|
"aria-label": ariaLabel = "Brødsmulesti",
|
|
34
17
|
children
|
|
35
18
|
}) => {
|
|
36
|
-
return /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": ariaLabel, children: /* @__PURE__ */ jsxRuntime.jsx("ol", { className: "eds-breadcrumbs", children: React.Children.map(children, (child,
|
|
19
|
+
return /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": ariaLabel, children: /* @__PURE__ */ jsxRuntime.jsx("ol", { className: "eds-breadcrumbs", children: React.Children.map(children, (child, index) => {
|
|
37
20
|
return React.cloneElement(child, {
|
|
38
|
-
isCurrent:
|
|
21
|
+
isCurrent: index + 1 === React.Children.count(children)
|
|
39
22
|
});
|
|
40
23
|
}) }) });
|
|
41
24
|
};
|
|
42
|
-
function getDefaultExportFromCjs(x) {
|
|
43
|
-
return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
|
|
44
|
-
}
|
|
45
|
-
var classnames = { exports: {} };
|
|
46
|
-
/*!
|
|
47
|
-
Copyright (c) 2018 Jed Watson.
|
|
48
|
-
Licensed under the MIT License (MIT), see
|
|
49
|
-
http://jedwatson.github.io/classnames
|
|
50
|
-
*/
|
|
51
|
-
var hasRequiredClassnames;
|
|
52
|
-
function requireClassnames() {
|
|
53
|
-
if (hasRequiredClassnames) return classnames.exports;
|
|
54
|
-
hasRequiredClassnames = 1;
|
|
55
|
-
(function(module2) {
|
|
56
|
-
(function() {
|
|
57
|
-
var hasOwn = {}.hasOwnProperty;
|
|
58
|
-
function classNames2() {
|
|
59
|
-
var classes = "";
|
|
60
|
-
for (var i = 0; i < arguments.length; i++) {
|
|
61
|
-
var arg = arguments[i];
|
|
62
|
-
if (arg) {
|
|
63
|
-
classes = appendClass(classes, parseValue(arg));
|
|
64
|
-
}
|
|
65
|
-
}
|
|
66
|
-
return classes;
|
|
67
|
-
}
|
|
68
|
-
function parseValue(arg) {
|
|
69
|
-
if (typeof arg === "string" || typeof arg === "number") {
|
|
70
|
-
return arg;
|
|
71
|
-
}
|
|
72
|
-
if (typeof arg !== "object") {
|
|
73
|
-
return "";
|
|
74
|
-
}
|
|
75
|
-
if (Array.isArray(arg)) {
|
|
76
|
-
return classNames2.apply(null, arg);
|
|
77
|
-
}
|
|
78
|
-
if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes("[native code]")) {
|
|
79
|
-
return arg.toString();
|
|
80
|
-
}
|
|
81
|
-
var classes = "";
|
|
82
|
-
for (var key in arg) {
|
|
83
|
-
if (hasOwn.call(arg, key) && arg[key]) {
|
|
84
|
-
classes = appendClass(classes, key);
|
|
85
|
-
}
|
|
86
|
-
}
|
|
87
|
-
return classes;
|
|
88
|
-
}
|
|
89
|
-
function appendClass(value, newClass) {
|
|
90
|
-
if (!newClass) {
|
|
91
|
-
return value;
|
|
92
|
-
}
|
|
93
|
-
if (value) {
|
|
94
|
-
return value + " " + newClass;
|
|
95
|
-
}
|
|
96
|
-
return value + newClass;
|
|
97
|
-
}
|
|
98
|
-
if (module2.exports) {
|
|
99
|
-
classNames2.default = classNames2;
|
|
100
|
-
module2.exports = classNames2;
|
|
101
|
-
} else {
|
|
102
|
-
window.classNames = classNames2;
|
|
103
|
-
}
|
|
104
|
-
})();
|
|
105
|
-
})(classnames);
|
|
106
|
-
return classnames.exports;
|
|
107
|
-
}
|
|
108
|
-
var classnamesExports = requireClassnames();
|
|
109
|
-
const classNames = /* @__PURE__ */ getDefaultExportFromCjs(classnamesExports);
|
|
110
25
|
const defaultElement$1 = "a";
|
|
111
26
|
const BreadcrumbItem = ({
|
|
112
27
|
className,
|
|
@@ -114,10 +29,10 @@ const BreadcrumbItem = ({
|
|
|
114
29
|
as,
|
|
115
30
|
...rest
|
|
116
31
|
}) => {
|
|
117
|
-
const
|
|
32
|
+
const Element = as || defaultElement$1;
|
|
118
33
|
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
119
34
|
/* @__PURE__ */ jsxRuntime.jsx("li", { className: classNames("eds-breadcrumb__item", className), children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
120
|
-
|
|
35
|
+
Element,
|
|
121
36
|
{
|
|
122
37
|
"aria-current": isCurrent ? "page" : void 0,
|
|
123
38
|
className: classNames("eds-breadcrumb__link", {
|
|
@@ -210,3082 +125,6 @@ const useSideNavigationContext = () => {
|
|
|
210
125
|
}
|
|
211
126
|
return context;
|
|
212
127
|
};
|
|
213
|
-
function hasWindow() {
|
|
214
|
-
return typeof window !== "undefined";
|
|
215
|
-
}
|
|
216
|
-
function getNodeName(node) {
|
|
217
|
-
if (isNode(node)) {
|
|
218
|
-
return (node.nodeName || "").toLowerCase();
|
|
219
|
-
}
|
|
220
|
-
return "#document";
|
|
221
|
-
}
|
|
222
|
-
function getWindow(node) {
|
|
223
|
-
var _node$ownerDocument;
|
|
224
|
-
return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
|
|
225
|
-
}
|
|
226
|
-
function getDocumentElement(node) {
|
|
227
|
-
var _ref;
|
|
228
|
-
return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement;
|
|
229
|
-
}
|
|
230
|
-
function isNode(value) {
|
|
231
|
-
if (!hasWindow()) {
|
|
232
|
-
return false;
|
|
233
|
-
}
|
|
234
|
-
return value instanceof Node || value instanceof getWindow(value).Node;
|
|
235
|
-
}
|
|
236
|
-
function isElement(value) {
|
|
237
|
-
if (!hasWindow()) {
|
|
238
|
-
return false;
|
|
239
|
-
}
|
|
240
|
-
return value instanceof Element || value instanceof getWindow(value).Element;
|
|
241
|
-
}
|
|
242
|
-
function isHTMLElement(value) {
|
|
243
|
-
if (!hasWindow()) {
|
|
244
|
-
return false;
|
|
245
|
-
}
|
|
246
|
-
return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
|
|
247
|
-
}
|
|
248
|
-
function isShadowRoot(value) {
|
|
249
|
-
if (!hasWindow() || typeof ShadowRoot === "undefined") {
|
|
250
|
-
return false;
|
|
251
|
-
}
|
|
252
|
-
return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
|
|
253
|
-
}
|
|
254
|
-
function isOverflowElement(element) {
|
|
255
|
-
const {
|
|
256
|
-
overflow,
|
|
257
|
-
overflowX,
|
|
258
|
-
overflowY,
|
|
259
|
-
display
|
|
260
|
-
} = getComputedStyle(element);
|
|
261
|
-
return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !["inline", "contents"].includes(display);
|
|
262
|
-
}
|
|
263
|
-
function isTableElement(element) {
|
|
264
|
-
return ["table", "td", "th"].includes(getNodeName(element));
|
|
265
|
-
}
|
|
266
|
-
function isTopLayer(element) {
|
|
267
|
-
return [":popover-open", ":modal"].some((selector) => {
|
|
268
|
-
try {
|
|
269
|
-
return element.matches(selector);
|
|
270
|
-
} catch (e) {
|
|
271
|
-
return false;
|
|
272
|
-
}
|
|
273
|
-
});
|
|
274
|
-
}
|
|
275
|
-
function isContainingBlock(elementOrCss) {
|
|
276
|
-
const webkit = isWebKit();
|
|
277
|
-
const css = isElement(elementOrCss) ? getComputedStyle(elementOrCss) : elementOrCss;
|
|
278
|
-
return css.transform !== "none" || css.perspective !== "none" || (css.containerType ? css.containerType !== "normal" : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== "none" : false) || !webkit && (css.filter ? css.filter !== "none" : false) || ["transform", "perspective", "filter"].some((value) => (css.willChange || "").includes(value)) || ["paint", "layout", "strict", "content"].some((value) => (css.contain || "").includes(value));
|
|
279
|
-
}
|
|
280
|
-
function getContainingBlock(element) {
|
|
281
|
-
let currentNode = getParentNode(element);
|
|
282
|
-
while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
283
|
-
if (isContainingBlock(currentNode)) {
|
|
284
|
-
return currentNode;
|
|
285
|
-
} else if (isTopLayer(currentNode)) {
|
|
286
|
-
return null;
|
|
287
|
-
}
|
|
288
|
-
currentNode = getParentNode(currentNode);
|
|
289
|
-
}
|
|
290
|
-
return null;
|
|
291
|
-
}
|
|
292
|
-
function isWebKit() {
|
|
293
|
-
if (typeof CSS === "undefined" || !CSS.supports) return false;
|
|
294
|
-
return CSS.supports("-webkit-backdrop-filter", "none");
|
|
295
|
-
}
|
|
296
|
-
function isLastTraversableNode(node) {
|
|
297
|
-
return ["html", "body", "#document"].includes(getNodeName(node));
|
|
298
|
-
}
|
|
299
|
-
function getComputedStyle(element) {
|
|
300
|
-
return getWindow(element).getComputedStyle(element);
|
|
301
|
-
}
|
|
302
|
-
function getNodeScroll(element) {
|
|
303
|
-
if (isElement(element)) {
|
|
304
|
-
return {
|
|
305
|
-
scrollLeft: element.scrollLeft,
|
|
306
|
-
scrollTop: element.scrollTop
|
|
307
|
-
};
|
|
308
|
-
}
|
|
309
|
-
return {
|
|
310
|
-
scrollLeft: element.scrollX,
|
|
311
|
-
scrollTop: element.scrollY
|
|
312
|
-
};
|
|
313
|
-
}
|
|
314
|
-
function getParentNode(node) {
|
|
315
|
-
if (getNodeName(node) === "html") {
|
|
316
|
-
return node;
|
|
317
|
-
}
|
|
318
|
-
const result = (
|
|
319
|
-
// Step into the shadow DOM of the parent of a slotted node.
|
|
320
|
-
node.assignedSlot || // DOM Element detected.
|
|
321
|
-
node.parentNode || // ShadowRoot detected.
|
|
322
|
-
isShadowRoot(node) && node.host || // Fallback.
|
|
323
|
-
getDocumentElement(node)
|
|
324
|
-
);
|
|
325
|
-
return isShadowRoot(result) ? result.host : result;
|
|
326
|
-
}
|
|
327
|
-
function getNearestOverflowAncestor(node) {
|
|
328
|
-
const parentNode = getParentNode(node);
|
|
329
|
-
if (isLastTraversableNode(parentNode)) {
|
|
330
|
-
return node.ownerDocument ? node.ownerDocument.body : node.body;
|
|
331
|
-
}
|
|
332
|
-
if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) {
|
|
333
|
-
return parentNode;
|
|
334
|
-
}
|
|
335
|
-
return getNearestOverflowAncestor(parentNode);
|
|
336
|
-
}
|
|
337
|
-
function getOverflowAncestors(node, list, traverseIframes) {
|
|
338
|
-
var _node$ownerDocument2;
|
|
339
|
-
if (list === void 0) {
|
|
340
|
-
list = [];
|
|
341
|
-
}
|
|
342
|
-
if (traverseIframes === void 0) {
|
|
343
|
-
traverseIframes = true;
|
|
344
|
-
}
|
|
345
|
-
const scrollableAncestor = getNearestOverflowAncestor(node);
|
|
346
|
-
const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body);
|
|
347
|
-
const win = getWindow(scrollableAncestor);
|
|
348
|
-
if (isBody) {
|
|
349
|
-
const frameElement = getFrameElement(win);
|
|
350
|
-
return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
|
|
351
|
-
}
|
|
352
|
-
return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
|
|
353
|
-
}
|
|
354
|
-
function getFrameElement(win) {
|
|
355
|
-
return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
|
|
356
|
-
}
|
|
357
|
-
function activeElement(doc) {
|
|
358
|
-
let activeElement2 = doc.activeElement;
|
|
359
|
-
while (((_activeElement = activeElement2) == null || (_activeElement = _activeElement.shadowRoot) == null ? void 0 : _activeElement.activeElement) != null) {
|
|
360
|
-
var _activeElement;
|
|
361
|
-
activeElement2 = activeElement2.shadowRoot.activeElement;
|
|
362
|
-
}
|
|
363
|
-
return activeElement2;
|
|
364
|
-
}
|
|
365
|
-
function contains(parent, child) {
|
|
366
|
-
if (!parent || !child) {
|
|
367
|
-
return false;
|
|
368
|
-
}
|
|
369
|
-
const rootNode = child.getRootNode == null ? void 0 : child.getRootNode();
|
|
370
|
-
if (parent.contains(child)) {
|
|
371
|
-
return true;
|
|
372
|
-
}
|
|
373
|
-
if (rootNode && isShadowRoot(rootNode)) {
|
|
374
|
-
let next = child;
|
|
375
|
-
while (next) {
|
|
376
|
-
if (parent === next) {
|
|
377
|
-
return true;
|
|
378
|
-
}
|
|
379
|
-
next = next.parentNode || next.host;
|
|
380
|
-
}
|
|
381
|
-
}
|
|
382
|
-
return false;
|
|
383
|
-
}
|
|
384
|
-
function getPlatform() {
|
|
385
|
-
const uaData = navigator.userAgentData;
|
|
386
|
-
if (uaData != null && uaData.platform) {
|
|
387
|
-
return uaData.platform;
|
|
388
|
-
}
|
|
389
|
-
return navigator.platform;
|
|
390
|
-
}
|
|
391
|
-
function getUserAgent() {
|
|
392
|
-
const uaData = navigator.userAgentData;
|
|
393
|
-
if (uaData && Array.isArray(uaData.brands)) {
|
|
394
|
-
return uaData.brands.map((_ref) => {
|
|
395
|
-
let {
|
|
396
|
-
brand,
|
|
397
|
-
version
|
|
398
|
-
} = _ref;
|
|
399
|
-
return brand + "/" + version;
|
|
400
|
-
}).join(" ");
|
|
401
|
-
}
|
|
402
|
-
return navigator.userAgent;
|
|
403
|
-
}
|
|
404
|
-
function isVirtualClick(event) {
|
|
405
|
-
if (event.mozInputSource === 0 && event.isTrusted) {
|
|
406
|
-
return true;
|
|
407
|
-
}
|
|
408
|
-
if (isAndroid() && event.pointerType) {
|
|
409
|
-
return event.type === "click" && event.buttons === 1;
|
|
410
|
-
}
|
|
411
|
-
return event.detail === 0 && !event.pointerType;
|
|
412
|
-
}
|
|
413
|
-
function isVirtualPointerEvent(event) {
|
|
414
|
-
if (isJSDOM()) return false;
|
|
415
|
-
return !isAndroid() && event.width === 0 && event.height === 0 || isAndroid() && event.width === 1 && event.height === 1 && event.pressure === 0 && event.detail === 0 && event.pointerType === "mouse" || // iOS VoiceOver returns 0.333• for width/height.
|
|
416
|
-
event.width < 1 && event.height < 1 && event.pressure === 0 && event.detail === 0 && event.pointerType === "touch";
|
|
417
|
-
}
|
|
418
|
-
function isSafari() {
|
|
419
|
-
return /apple/i.test(navigator.vendor);
|
|
420
|
-
}
|
|
421
|
-
function isAndroid() {
|
|
422
|
-
const re = /android/i;
|
|
423
|
-
return re.test(getPlatform()) || re.test(getUserAgent());
|
|
424
|
-
}
|
|
425
|
-
function isMac() {
|
|
426
|
-
return getPlatform().toLowerCase().startsWith("mac") && !navigator.maxTouchPoints;
|
|
427
|
-
}
|
|
428
|
-
function isJSDOM() {
|
|
429
|
-
return getUserAgent().includes("jsdom/");
|
|
430
|
-
}
|
|
431
|
-
function getDocument(node) {
|
|
432
|
-
return (node == null ? void 0 : node.ownerDocument) || document;
|
|
433
|
-
}
|
|
434
|
-
const TYPEABLE_SELECTOR = "input:not([type='hidden']):not([disabled]),[contenteditable]:not([contenteditable='false']),textarea:not([disabled])";
|
|
435
|
-
function isTypeableElement(element) {
|
|
436
|
-
return isHTMLElement(element) && element.matches(TYPEABLE_SELECTOR);
|
|
437
|
-
}
|
|
438
|
-
function stopEvent(event) {
|
|
439
|
-
event.preventDefault();
|
|
440
|
-
event.stopPropagation();
|
|
441
|
-
}
|
|
442
|
-
function isTypeableCombobox(element) {
|
|
443
|
-
if (!element) return false;
|
|
444
|
-
return element.getAttribute("role") === "combobox" && isTypeableElement(element);
|
|
445
|
-
}
|
|
446
|
-
const min = Math.min;
|
|
447
|
-
const max = Math.max;
|
|
448
|
-
const round = Math.round;
|
|
449
|
-
const floor = Math.floor;
|
|
450
|
-
const createCoords = (v) => ({
|
|
451
|
-
x: v,
|
|
452
|
-
y: v
|
|
453
|
-
});
|
|
454
|
-
const oppositeSideMap = {
|
|
455
|
-
left: "right",
|
|
456
|
-
right: "left",
|
|
457
|
-
bottom: "top",
|
|
458
|
-
top: "bottom"
|
|
459
|
-
};
|
|
460
|
-
const oppositeAlignmentMap = {
|
|
461
|
-
start: "end",
|
|
462
|
-
end: "start"
|
|
463
|
-
};
|
|
464
|
-
function clamp(start, value, end) {
|
|
465
|
-
return max(start, min(value, end));
|
|
466
|
-
}
|
|
467
|
-
function evaluate(value, param) {
|
|
468
|
-
return typeof value === "function" ? value(param) : value;
|
|
469
|
-
}
|
|
470
|
-
function getSide(placement) {
|
|
471
|
-
return placement.split("-")[0];
|
|
472
|
-
}
|
|
473
|
-
function getAlignment(placement) {
|
|
474
|
-
return placement.split("-")[1];
|
|
475
|
-
}
|
|
476
|
-
function getOppositeAxis(axis) {
|
|
477
|
-
return axis === "x" ? "y" : "x";
|
|
478
|
-
}
|
|
479
|
-
function getAxisLength(axis) {
|
|
480
|
-
return axis === "y" ? "height" : "width";
|
|
481
|
-
}
|
|
482
|
-
function getSideAxis(placement) {
|
|
483
|
-
return ["top", "bottom"].includes(getSide(placement)) ? "y" : "x";
|
|
484
|
-
}
|
|
485
|
-
function getAlignmentAxis(placement) {
|
|
486
|
-
return getOppositeAxis(getSideAxis(placement));
|
|
487
|
-
}
|
|
488
|
-
function getAlignmentSides(placement, rects, rtl) {
|
|
489
|
-
if (rtl === void 0) {
|
|
490
|
-
rtl = false;
|
|
491
|
-
}
|
|
492
|
-
const alignment = getAlignment(placement);
|
|
493
|
-
const alignmentAxis = getAlignmentAxis(placement);
|
|
494
|
-
const length = getAxisLength(alignmentAxis);
|
|
495
|
-
let mainAlignmentSide = alignmentAxis === "x" ? alignment === (rtl ? "end" : "start") ? "right" : "left" : alignment === "start" ? "bottom" : "top";
|
|
496
|
-
if (rects.reference[length] > rects.floating[length]) {
|
|
497
|
-
mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
|
|
498
|
-
}
|
|
499
|
-
return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
|
|
500
|
-
}
|
|
501
|
-
function getExpandedPlacements(placement) {
|
|
502
|
-
const oppositePlacement = getOppositePlacement(placement);
|
|
503
|
-
return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
|
|
504
|
-
}
|
|
505
|
-
function getOppositeAlignmentPlacement(placement) {
|
|
506
|
-
return placement.replace(/start|end/g, (alignment) => oppositeAlignmentMap[alignment]);
|
|
507
|
-
}
|
|
508
|
-
function getSideList(side, isStart, rtl) {
|
|
509
|
-
const lr = ["left", "right"];
|
|
510
|
-
const rl = ["right", "left"];
|
|
511
|
-
const tb = ["top", "bottom"];
|
|
512
|
-
const bt = ["bottom", "top"];
|
|
513
|
-
switch (side) {
|
|
514
|
-
case "top":
|
|
515
|
-
case "bottom":
|
|
516
|
-
if (rtl) return isStart ? rl : lr;
|
|
517
|
-
return isStart ? lr : rl;
|
|
518
|
-
case "left":
|
|
519
|
-
case "right":
|
|
520
|
-
return isStart ? tb : bt;
|
|
521
|
-
default:
|
|
522
|
-
return [];
|
|
523
|
-
}
|
|
524
|
-
}
|
|
525
|
-
function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
|
|
526
|
-
const alignment = getAlignment(placement);
|
|
527
|
-
let list = getSideList(getSide(placement), direction === "start", rtl);
|
|
528
|
-
if (alignment) {
|
|
529
|
-
list = list.map((side) => side + "-" + alignment);
|
|
530
|
-
if (flipAlignment) {
|
|
531
|
-
list = list.concat(list.map(getOppositeAlignmentPlacement));
|
|
532
|
-
}
|
|
533
|
-
}
|
|
534
|
-
return list;
|
|
535
|
-
}
|
|
536
|
-
function getOppositePlacement(placement) {
|
|
537
|
-
return placement.replace(/left|right|bottom|top/g, (side) => oppositeSideMap[side]);
|
|
538
|
-
}
|
|
539
|
-
function expandPaddingObject(padding) {
|
|
540
|
-
return {
|
|
541
|
-
top: 0,
|
|
542
|
-
right: 0,
|
|
543
|
-
bottom: 0,
|
|
544
|
-
left: 0,
|
|
545
|
-
...padding
|
|
546
|
-
};
|
|
547
|
-
}
|
|
548
|
-
function getPaddingObject(padding) {
|
|
549
|
-
return typeof padding !== "number" ? expandPaddingObject(padding) : {
|
|
550
|
-
top: padding,
|
|
551
|
-
right: padding,
|
|
552
|
-
bottom: padding,
|
|
553
|
-
left: padding
|
|
554
|
-
};
|
|
555
|
-
}
|
|
556
|
-
function rectToClientRect(rect) {
|
|
557
|
-
const {
|
|
558
|
-
x,
|
|
559
|
-
y,
|
|
560
|
-
width,
|
|
561
|
-
height
|
|
562
|
-
} = rect;
|
|
563
|
-
return {
|
|
564
|
-
width,
|
|
565
|
-
height,
|
|
566
|
-
top: y,
|
|
567
|
-
left: x,
|
|
568
|
-
right: x + width,
|
|
569
|
-
bottom: y + height,
|
|
570
|
-
x,
|
|
571
|
-
y
|
|
572
|
-
};
|
|
573
|
-
}
|
|
574
|
-
function computeCoordsFromPlacement(_ref, placement, rtl) {
|
|
575
|
-
let {
|
|
576
|
-
reference,
|
|
577
|
-
floating
|
|
578
|
-
} = _ref;
|
|
579
|
-
const sideAxis = getSideAxis(placement);
|
|
580
|
-
const alignmentAxis = getAlignmentAxis(placement);
|
|
581
|
-
const alignLength = getAxisLength(alignmentAxis);
|
|
582
|
-
const side = getSide(placement);
|
|
583
|
-
const isVertical = sideAxis === "y";
|
|
584
|
-
const commonX = reference.x + reference.width / 2 - floating.width / 2;
|
|
585
|
-
const commonY = reference.y + reference.height / 2 - floating.height / 2;
|
|
586
|
-
const commonAlign = reference[alignLength] / 2 - floating[alignLength] / 2;
|
|
587
|
-
let coords;
|
|
588
|
-
switch (side) {
|
|
589
|
-
case "top":
|
|
590
|
-
coords = {
|
|
591
|
-
x: commonX,
|
|
592
|
-
y: reference.y - floating.height
|
|
593
|
-
};
|
|
594
|
-
break;
|
|
595
|
-
case "bottom":
|
|
596
|
-
coords = {
|
|
597
|
-
x: commonX,
|
|
598
|
-
y: reference.y + reference.height
|
|
599
|
-
};
|
|
600
|
-
break;
|
|
601
|
-
case "right":
|
|
602
|
-
coords = {
|
|
603
|
-
x: reference.x + reference.width,
|
|
604
|
-
y: commonY
|
|
605
|
-
};
|
|
606
|
-
break;
|
|
607
|
-
case "left":
|
|
608
|
-
coords = {
|
|
609
|
-
x: reference.x - floating.width,
|
|
610
|
-
y: commonY
|
|
611
|
-
};
|
|
612
|
-
break;
|
|
613
|
-
default:
|
|
614
|
-
coords = {
|
|
615
|
-
x: reference.x,
|
|
616
|
-
y: reference.y
|
|
617
|
-
};
|
|
618
|
-
}
|
|
619
|
-
switch (getAlignment(placement)) {
|
|
620
|
-
case "start":
|
|
621
|
-
coords[alignmentAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
|
|
622
|
-
break;
|
|
623
|
-
case "end":
|
|
624
|
-
coords[alignmentAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
|
|
625
|
-
break;
|
|
626
|
-
}
|
|
627
|
-
return coords;
|
|
628
|
-
}
|
|
629
|
-
const computePosition$1 = async (reference, floating, config) => {
|
|
630
|
-
const {
|
|
631
|
-
placement = "bottom",
|
|
632
|
-
strategy = "absolute",
|
|
633
|
-
middleware = [],
|
|
634
|
-
platform: platform2
|
|
635
|
-
} = config;
|
|
636
|
-
const validMiddleware = middleware.filter(Boolean);
|
|
637
|
-
const rtl = await (platform2.isRTL == null ? void 0 : platform2.isRTL(floating));
|
|
638
|
-
let rects = await platform2.getElementRects({
|
|
639
|
-
reference,
|
|
640
|
-
floating,
|
|
641
|
-
strategy
|
|
642
|
-
});
|
|
643
|
-
let {
|
|
644
|
-
x,
|
|
645
|
-
y
|
|
646
|
-
} = computeCoordsFromPlacement(rects, placement, rtl);
|
|
647
|
-
let statefulPlacement = placement;
|
|
648
|
-
let middlewareData = {};
|
|
649
|
-
let resetCount = 0;
|
|
650
|
-
for (let i = 0; i < validMiddleware.length; i++) {
|
|
651
|
-
const {
|
|
652
|
-
name,
|
|
653
|
-
fn
|
|
654
|
-
} = validMiddleware[i];
|
|
655
|
-
const {
|
|
656
|
-
x: nextX,
|
|
657
|
-
y: nextY,
|
|
658
|
-
data,
|
|
659
|
-
reset
|
|
660
|
-
} = await fn({
|
|
661
|
-
x,
|
|
662
|
-
y,
|
|
663
|
-
initialPlacement: placement,
|
|
664
|
-
placement: statefulPlacement,
|
|
665
|
-
strategy,
|
|
666
|
-
middlewareData,
|
|
667
|
-
rects,
|
|
668
|
-
platform: platform2,
|
|
669
|
-
elements: {
|
|
670
|
-
reference,
|
|
671
|
-
floating
|
|
672
|
-
}
|
|
673
|
-
});
|
|
674
|
-
x = nextX != null ? nextX : x;
|
|
675
|
-
y = nextY != null ? nextY : y;
|
|
676
|
-
middlewareData = {
|
|
677
|
-
...middlewareData,
|
|
678
|
-
[name]: {
|
|
679
|
-
...middlewareData[name],
|
|
680
|
-
...data
|
|
681
|
-
}
|
|
682
|
-
};
|
|
683
|
-
if (reset && resetCount <= 50) {
|
|
684
|
-
resetCount++;
|
|
685
|
-
if (typeof reset === "object") {
|
|
686
|
-
if (reset.placement) {
|
|
687
|
-
statefulPlacement = reset.placement;
|
|
688
|
-
}
|
|
689
|
-
if (reset.rects) {
|
|
690
|
-
rects = reset.rects === true ? await platform2.getElementRects({
|
|
691
|
-
reference,
|
|
692
|
-
floating,
|
|
693
|
-
strategy
|
|
694
|
-
}) : reset.rects;
|
|
695
|
-
}
|
|
696
|
-
({
|
|
697
|
-
x,
|
|
698
|
-
y
|
|
699
|
-
} = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
|
|
700
|
-
}
|
|
701
|
-
i = -1;
|
|
702
|
-
}
|
|
703
|
-
}
|
|
704
|
-
return {
|
|
705
|
-
x,
|
|
706
|
-
y,
|
|
707
|
-
placement: statefulPlacement,
|
|
708
|
-
strategy,
|
|
709
|
-
middlewareData
|
|
710
|
-
};
|
|
711
|
-
};
|
|
712
|
-
async function detectOverflow(state, options) {
|
|
713
|
-
var _await$platform$isEle;
|
|
714
|
-
if (options === void 0) {
|
|
715
|
-
options = {};
|
|
716
|
-
}
|
|
717
|
-
const {
|
|
718
|
-
x,
|
|
719
|
-
y,
|
|
720
|
-
platform: platform2,
|
|
721
|
-
rects,
|
|
722
|
-
elements,
|
|
723
|
-
strategy
|
|
724
|
-
} = state;
|
|
725
|
-
const {
|
|
726
|
-
boundary = "clippingAncestors",
|
|
727
|
-
rootBoundary = "viewport",
|
|
728
|
-
elementContext = "floating",
|
|
729
|
-
altBoundary = false,
|
|
730
|
-
padding = 0
|
|
731
|
-
} = evaluate(options, state);
|
|
732
|
-
const paddingObject = getPaddingObject(padding);
|
|
733
|
-
const altContext = elementContext === "floating" ? "reference" : "floating";
|
|
734
|
-
const element = elements[altBoundary ? altContext : elementContext];
|
|
735
|
-
const clippingClientRect = rectToClientRect(await platform2.getClippingRect({
|
|
736
|
-
element: ((_await$platform$isEle = await (platform2.isElement == null ? void 0 : platform2.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || await (platform2.getDocumentElement == null ? void 0 : platform2.getDocumentElement(elements.floating)),
|
|
737
|
-
boundary,
|
|
738
|
-
rootBoundary,
|
|
739
|
-
strategy
|
|
740
|
-
}));
|
|
741
|
-
const rect = elementContext === "floating" ? {
|
|
742
|
-
x,
|
|
743
|
-
y,
|
|
744
|
-
width: rects.floating.width,
|
|
745
|
-
height: rects.floating.height
|
|
746
|
-
} : rects.reference;
|
|
747
|
-
const offsetParent = await (platform2.getOffsetParent == null ? void 0 : platform2.getOffsetParent(elements.floating));
|
|
748
|
-
const offsetScale = await (platform2.isElement == null ? void 0 : platform2.isElement(offsetParent)) ? await (platform2.getScale == null ? void 0 : platform2.getScale(offsetParent)) || {
|
|
749
|
-
x: 1,
|
|
750
|
-
y: 1
|
|
751
|
-
} : {
|
|
752
|
-
x: 1,
|
|
753
|
-
y: 1
|
|
754
|
-
};
|
|
755
|
-
const elementClientRect = rectToClientRect(platform2.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform2.convertOffsetParentRelativeRectToViewportRelativeRect({
|
|
756
|
-
elements,
|
|
757
|
-
rect,
|
|
758
|
-
offsetParent,
|
|
759
|
-
strategy
|
|
760
|
-
}) : rect);
|
|
761
|
-
return {
|
|
762
|
-
top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
|
|
763
|
-
bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
|
|
764
|
-
left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
|
|
765
|
-
right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
|
|
766
|
-
};
|
|
767
|
-
}
|
|
768
|
-
const flip$2 = function(options) {
|
|
769
|
-
if (options === void 0) {
|
|
770
|
-
options = {};
|
|
771
|
-
}
|
|
772
|
-
return {
|
|
773
|
-
name: "flip",
|
|
774
|
-
options,
|
|
775
|
-
async fn(state) {
|
|
776
|
-
var _middlewareData$arrow, _middlewareData$flip;
|
|
777
|
-
const {
|
|
778
|
-
placement,
|
|
779
|
-
middlewareData,
|
|
780
|
-
rects,
|
|
781
|
-
initialPlacement,
|
|
782
|
-
platform: platform2,
|
|
783
|
-
elements
|
|
784
|
-
} = state;
|
|
785
|
-
const {
|
|
786
|
-
mainAxis: checkMainAxis = true,
|
|
787
|
-
crossAxis: checkCrossAxis = true,
|
|
788
|
-
fallbackPlacements: specifiedFallbackPlacements,
|
|
789
|
-
fallbackStrategy = "bestFit",
|
|
790
|
-
fallbackAxisSideDirection = "none",
|
|
791
|
-
flipAlignment = true,
|
|
792
|
-
...detectOverflowOptions
|
|
793
|
-
} = evaluate(options, state);
|
|
794
|
-
if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
|
|
795
|
-
return {};
|
|
796
|
-
}
|
|
797
|
-
const side = getSide(placement);
|
|
798
|
-
const initialSideAxis = getSideAxis(initialPlacement);
|
|
799
|
-
const isBasePlacement = getSide(initialPlacement) === initialPlacement;
|
|
800
|
-
const rtl = await (platform2.isRTL == null ? void 0 : platform2.isRTL(elements.floating));
|
|
801
|
-
const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
|
|
802
|
-
const hasFallbackAxisSideDirection = fallbackAxisSideDirection !== "none";
|
|
803
|
-
if (!specifiedFallbackPlacements && hasFallbackAxisSideDirection) {
|
|
804
|
-
fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
|
|
805
|
-
}
|
|
806
|
-
const placements = [initialPlacement, ...fallbackPlacements];
|
|
807
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
808
|
-
const overflows = [];
|
|
809
|
-
let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
|
|
810
|
-
if (checkMainAxis) {
|
|
811
|
-
overflows.push(overflow[side]);
|
|
812
|
-
}
|
|
813
|
-
if (checkCrossAxis) {
|
|
814
|
-
const sides = getAlignmentSides(placement, rects, rtl);
|
|
815
|
-
overflows.push(overflow[sides[0]], overflow[sides[1]]);
|
|
816
|
-
}
|
|
817
|
-
overflowsData = [...overflowsData, {
|
|
818
|
-
placement,
|
|
819
|
-
overflows
|
|
820
|
-
}];
|
|
821
|
-
if (!overflows.every((side2) => side2 <= 0)) {
|
|
822
|
-
var _middlewareData$flip2, _overflowsData$filter;
|
|
823
|
-
const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
|
|
824
|
-
const nextPlacement = placements[nextIndex];
|
|
825
|
-
if (nextPlacement) {
|
|
826
|
-
return {
|
|
827
|
-
data: {
|
|
828
|
-
index: nextIndex,
|
|
829
|
-
overflows: overflowsData
|
|
830
|
-
},
|
|
831
|
-
reset: {
|
|
832
|
-
placement: nextPlacement
|
|
833
|
-
}
|
|
834
|
-
};
|
|
835
|
-
}
|
|
836
|
-
let resetPlacement = (_overflowsData$filter = overflowsData.filter((d) => d.overflows[0] <= 0).sort((a, b) => a.overflows[1] - b.overflows[1])[0]) == null ? void 0 : _overflowsData$filter.placement;
|
|
837
|
-
if (!resetPlacement) {
|
|
838
|
-
switch (fallbackStrategy) {
|
|
839
|
-
case "bestFit": {
|
|
840
|
-
var _overflowsData$filter2;
|
|
841
|
-
const placement2 = (_overflowsData$filter2 = overflowsData.filter((d) => {
|
|
842
|
-
if (hasFallbackAxisSideDirection) {
|
|
843
|
-
const currentSideAxis = getSideAxis(d.placement);
|
|
844
|
-
return currentSideAxis === initialSideAxis || // Create a bias to the `y` side axis due to horizontal
|
|
845
|
-
// reading directions favoring greater width.
|
|
846
|
-
currentSideAxis === "y";
|
|
847
|
-
}
|
|
848
|
-
return true;
|
|
849
|
-
}).map((d) => [d.placement, d.overflows.filter((overflow2) => overflow2 > 0).reduce((acc, overflow2) => acc + overflow2, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$filter2[0];
|
|
850
|
-
if (placement2) {
|
|
851
|
-
resetPlacement = placement2;
|
|
852
|
-
}
|
|
853
|
-
break;
|
|
854
|
-
}
|
|
855
|
-
case "initialPlacement":
|
|
856
|
-
resetPlacement = initialPlacement;
|
|
857
|
-
break;
|
|
858
|
-
}
|
|
859
|
-
}
|
|
860
|
-
if (placement !== resetPlacement) {
|
|
861
|
-
return {
|
|
862
|
-
reset: {
|
|
863
|
-
placement: resetPlacement
|
|
864
|
-
}
|
|
865
|
-
};
|
|
866
|
-
}
|
|
867
|
-
}
|
|
868
|
-
return {};
|
|
869
|
-
}
|
|
870
|
-
};
|
|
871
|
-
};
|
|
872
|
-
async function convertValueToCoords(state, options) {
|
|
873
|
-
const {
|
|
874
|
-
placement,
|
|
875
|
-
platform: platform2,
|
|
876
|
-
elements
|
|
877
|
-
} = state;
|
|
878
|
-
const rtl = await (platform2.isRTL == null ? void 0 : platform2.isRTL(elements.floating));
|
|
879
|
-
const side = getSide(placement);
|
|
880
|
-
const alignment = getAlignment(placement);
|
|
881
|
-
const isVertical = getSideAxis(placement) === "y";
|
|
882
|
-
const mainAxisMulti = ["left", "top"].includes(side) ? -1 : 1;
|
|
883
|
-
const crossAxisMulti = rtl && isVertical ? -1 : 1;
|
|
884
|
-
const rawValue = evaluate(options, state);
|
|
885
|
-
let {
|
|
886
|
-
mainAxis,
|
|
887
|
-
crossAxis,
|
|
888
|
-
alignmentAxis
|
|
889
|
-
} = typeof rawValue === "number" ? {
|
|
890
|
-
mainAxis: rawValue,
|
|
891
|
-
crossAxis: 0,
|
|
892
|
-
alignmentAxis: null
|
|
893
|
-
} : {
|
|
894
|
-
mainAxis: rawValue.mainAxis || 0,
|
|
895
|
-
crossAxis: rawValue.crossAxis || 0,
|
|
896
|
-
alignmentAxis: rawValue.alignmentAxis
|
|
897
|
-
};
|
|
898
|
-
if (alignment && typeof alignmentAxis === "number") {
|
|
899
|
-
crossAxis = alignment === "end" ? alignmentAxis * -1 : alignmentAxis;
|
|
900
|
-
}
|
|
901
|
-
return isVertical ? {
|
|
902
|
-
x: crossAxis * crossAxisMulti,
|
|
903
|
-
y: mainAxis * mainAxisMulti
|
|
904
|
-
} : {
|
|
905
|
-
x: mainAxis * mainAxisMulti,
|
|
906
|
-
y: crossAxis * crossAxisMulti
|
|
907
|
-
};
|
|
908
|
-
}
|
|
909
|
-
const offset$2 = function(options) {
|
|
910
|
-
if (options === void 0) {
|
|
911
|
-
options = 0;
|
|
912
|
-
}
|
|
913
|
-
return {
|
|
914
|
-
name: "offset",
|
|
915
|
-
options,
|
|
916
|
-
async fn(state) {
|
|
917
|
-
var _middlewareData$offse, _middlewareData$arrow;
|
|
918
|
-
const {
|
|
919
|
-
x,
|
|
920
|
-
y,
|
|
921
|
-
placement,
|
|
922
|
-
middlewareData
|
|
923
|
-
} = state;
|
|
924
|
-
const diffCoords = await convertValueToCoords(state, options);
|
|
925
|
-
if (placement === ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse.placement) && (_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
|
|
926
|
-
return {};
|
|
927
|
-
}
|
|
928
|
-
return {
|
|
929
|
-
x: x + diffCoords.x,
|
|
930
|
-
y: y + diffCoords.y,
|
|
931
|
-
data: {
|
|
932
|
-
...diffCoords,
|
|
933
|
-
placement
|
|
934
|
-
}
|
|
935
|
-
};
|
|
936
|
-
}
|
|
937
|
-
};
|
|
938
|
-
};
|
|
939
|
-
const shift$2 = function(options) {
|
|
940
|
-
if (options === void 0) {
|
|
941
|
-
options = {};
|
|
942
|
-
}
|
|
943
|
-
return {
|
|
944
|
-
name: "shift",
|
|
945
|
-
options,
|
|
946
|
-
async fn(state) {
|
|
947
|
-
const {
|
|
948
|
-
x,
|
|
949
|
-
y,
|
|
950
|
-
placement
|
|
951
|
-
} = state;
|
|
952
|
-
const {
|
|
953
|
-
mainAxis: checkMainAxis = true,
|
|
954
|
-
crossAxis: checkCrossAxis = false,
|
|
955
|
-
limiter = {
|
|
956
|
-
fn: (_ref) => {
|
|
957
|
-
let {
|
|
958
|
-
x: x2,
|
|
959
|
-
y: y2
|
|
960
|
-
} = _ref;
|
|
961
|
-
return {
|
|
962
|
-
x: x2,
|
|
963
|
-
y: y2
|
|
964
|
-
};
|
|
965
|
-
}
|
|
966
|
-
},
|
|
967
|
-
...detectOverflowOptions
|
|
968
|
-
} = evaluate(options, state);
|
|
969
|
-
const coords = {
|
|
970
|
-
x,
|
|
971
|
-
y
|
|
972
|
-
};
|
|
973
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
974
|
-
const crossAxis = getSideAxis(getSide(placement));
|
|
975
|
-
const mainAxis = getOppositeAxis(crossAxis);
|
|
976
|
-
let mainAxisCoord = coords[mainAxis];
|
|
977
|
-
let crossAxisCoord = coords[crossAxis];
|
|
978
|
-
if (checkMainAxis) {
|
|
979
|
-
const minSide = mainAxis === "y" ? "top" : "left";
|
|
980
|
-
const maxSide = mainAxis === "y" ? "bottom" : "right";
|
|
981
|
-
const min2 = mainAxisCoord + overflow[minSide];
|
|
982
|
-
const max2 = mainAxisCoord - overflow[maxSide];
|
|
983
|
-
mainAxisCoord = clamp(min2, mainAxisCoord, max2);
|
|
984
|
-
}
|
|
985
|
-
if (checkCrossAxis) {
|
|
986
|
-
const minSide = crossAxis === "y" ? "top" : "left";
|
|
987
|
-
const maxSide = crossAxis === "y" ? "bottom" : "right";
|
|
988
|
-
const min2 = crossAxisCoord + overflow[minSide];
|
|
989
|
-
const max2 = crossAxisCoord - overflow[maxSide];
|
|
990
|
-
crossAxisCoord = clamp(min2, crossAxisCoord, max2);
|
|
991
|
-
}
|
|
992
|
-
const limitedCoords = limiter.fn({
|
|
993
|
-
...state,
|
|
994
|
-
[mainAxis]: mainAxisCoord,
|
|
995
|
-
[crossAxis]: crossAxisCoord
|
|
996
|
-
});
|
|
997
|
-
return {
|
|
998
|
-
...limitedCoords,
|
|
999
|
-
data: {
|
|
1000
|
-
x: limitedCoords.x - x,
|
|
1001
|
-
y: limitedCoords.y - y,
|
|
1002
|
-
enabled: {
|
|
1003
|
-
[mainAxis]: checkMainAxis,
|
|
1004
|
-
[crossAxis]: checkCrossAxis
|
|
1005
|
-
}
|
|
1006
|
-
}
|
|
1007
|
-
};
|
|
1008
|
-
}
|
|
1009
|
-
};
|
|
1010
|
-
};
|
|
1011
|
-
function getCssDimensions(element) {
|
|
1012
|
-
const css = getComputedStyle(element);
|
|
1013
|
-
let width = parseFloat(css.width) || 0;
|
|
1014
|
-
let height = parseFloat(css.height) || 0;
|
|
1015
|
-
const hasOffset = isHTMLElement(element);
|
|
1016
|
-
const offsetWidth = hasOffset ? element.offsetWidth : width;
|
|
1017
|
-
const offsetHeight = hasOffset ? element.offsetHeight : height;
|
|
1018
|
-
const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
|
|
1019
|
-
if (shouldFallback) {
|
|
1020
|
-
width = offsetWidth;
|
|
1021
|
-
height = offsetHeight;
|
|
1022
|
-
}
|
|
1023
|
-
return {
|
|
1024
|
-
width,
|
|
1025
|
-
height,
|
|
1026
|
-
$: shouldFallback
|
|
1027
|
-
};
|
|
1028
|
-
}
|
|
1029
|
-
function unwrapElement(element) {
|
|
1030
|
-
return !isElement(element) ? element.contextElement : element;
|
|
1031
|
-
}
|
|
1032
|
-
function getScale(element) {
|
|
1033
|
-
const domElement = unwrapElement(element);
|
|
1034
|
-
if (!isHTMLElement(domElement)) {
|
|
1035
|
-
return createCoords(1);
|
|
1036
|
-
}
|
|
1037
|
-
const rect = domElement.getBoundingClientRect();
|
|
1038
|
-
const {
|
|
1039
|
-
width,
|
|
1040
|
-
height,
|
|
1041
|
-
$
|
|
1042
|
-
} = getCssDimensions(domElement);
|
|
1043
|
-
let x = ($ ? round(rect.width) : rect.width) / width;
|
|
1044
|
-
let y = ($ ? round(rect.height) : rect.height) / height;
|
|
1045
|
-
if (!x || !Number.isFinite(x)) {
|
|
1046
|
-
x = 1;
|
|
1047
|
-
}
|
|
1048
|
-
if (!y || !Number.isFinite(y)) {
|
|
1049
|
-
y = 1;
|
|
1050
|
-
}
|
|
1051
|
-
return {
|
|
1052
|
-
x,
|
|
1053
|
-
y
|
|
1054
|
-
};
|
|
1055
|
-
}
|
|
1056
|
-
const noOffsets = /* @__PURE__ */ createCoords(0);
|
|
1057
|
-
function getVisualOffsets(element) {
|
|
1058
|
-
const win = getWindow(element);
|
|
1059
|
-
if (!isWebKit() || !win.visualViewport) {
|
|
1060
|
-
return noOffsets;
|
|
1061
|
-
}
|
|
1062
|
-
return {
|
|
1063
|
-
x: win.visualViewport.offsetLeft,
|
|
1064
|
-
y: win.visualViewport.offsetTop
|
|
1065
|
-
};
|
|
1066
|
-
}
|
|
1067
|
-
function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
|
|
1068
|
-
if (isFixed === void 0) {
|
|
1069
|
-
isFixed = false;
|
|
1070
|
-
}
|
|
1071
|
-
if (!floatingOffsetParent || isFixed && floatingOffsetParent !== getWindow(element)) {
|
|
1072
|
-
return false;
|
|
1073
|
-
}
|
|
1074
|
-
return isFixed;
|
|
1075
|
-
}
|
|
1076
|
-
function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
|
|
1077
|
-
if (includeScale === void 0) {
|
|
1078
|
-
includeScale = false;
|
|
1079
|
-
}
|
|
1080
|
-
if (isFixedStrategy === void 0) {
|
|
1081
|
-
isFixedStrategy = false;
|
|
1082
|
-
}
|
|
1083
|
-
const clientRect = element.getBoundingClientRect();
|
|
1084
|
-
const domElement = unwrapElement(element);
|
|
1085
|
-
let scale = createCoords(1);
|
|
1086
|
-
if (includeScale) {
|
|
1087
|
-
if (offsetParent) {
|
|
1088
|
-
if (isElement(offsetParent)) {
|
|
1089
|
-
scale = getScale(offsetParent);
|
|
1090
|
-
}
|
|
1091
|
-
} else {
|
|
1092
|
-
scale = getScale(element);
|
|
1093
|
-
}
|
|
1094
|
-
}
|
|
1095
|
-
const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
|
|
1096
|
-
let x = (clientRect.left + visualOffsets.x) / scale.x;
|
|
1097
|
-
let y = (clientRect.top + visualOffsets.y) / scale.y;
|
|
1098
|
-
let width = clientRect.width / scale.x;
|
|
1099
|
-
let height = clientRect.height / scale.y;
|
|
1100
|
-
if (domElement) {
|
|
1101
|
-
const win = getWindow(domElement);
|
|
1102
|
-
const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
|
|
1103
|
-
let currentWin = win;
|
|
1104
|
-
let currentIFrame = getFrameElement(currentWin);
|
|
1105
|
-
while (currentIFrame && offsetParent && offsetWin !== currentWin) {
|
|
1106
|
-
const iframeScale = getScale(currentIFrame);
|
|
1107
|
-
const iframeRect = currentIFrame.getBoundingClientRect();
|
|
1108
|
-
const css = getComputedStyle(currentIFrame);
|
|
1109
|
-
const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
|
|
1110
|
-
const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
|
|
1111
|
-
x *= iframeScale.x;
|
|
1112
|
-
y *= iframeScale.y;
|
|
1113
|
-
width *= iframeScale.x;
|
|
1114
|
-
height *= iframeScale.y;
|
|
1115
|
-
x += left;
|
|
1116
|
-
y += top;
|
|
1117
|
-
currentWin = getWindow(currentIFrame);
|
|
1118
|
-
currentIFrame = getFrameElement(currentWin);
|
|
1119
|
-
}
|
|
1120
|
-
}
|
|
1121
|
-
return rectToClientRect({
|
|
1122
|
-
width,
|
|
1123
|
-
height,
|
|
1124
|
-
x,
|
|
1125
|
-
y
|
|
1126
|
-
});
|
|
1127
|
-
}
|
|
1128
|
-
function getWindowScrollBarX(element, rect) {
|
|
1129
|
-
const leftScroll = getNodeScroll(element).scrollLeft;
|
|
1130
|
-
if (!rect) {
|
|
1131
|
-
return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
|
|
1132
|
-
}
|
|
1133
|
-
return rect.left + leftScroll;
|
|
1134
|
-
}
|
|
1135
|
-
function getHTMLOffset(documentElement, scroll, ignoreScrollbarX) {
|
|
1136
|
-
if (ignoreScrollbarX === void 0) {
|
|
1137
|
-
ignoreScrollbarX = false;
|
|
1138
|
-
}
|
|
1139
|
-
const htmlRect = documentElement.getBoundingClientRect();
|
|
1140
|
-
const x = htmlRect.left + scroll.scrollLeft - (ignoreScrollbarX ? 0 : (
|
|
1141
|
-
// RTL <body> scrollbar.
|
|
1142
|
-
getWindowScrollBarX(documentElement, htmlRect)
|
|
1143
|
-
));
|
|
1144
|
-
const y = htmlRect.top + scroll.scrollTop;
|
|
1145
|
-
return {
|
|
1146
|
-
x,
|
|
1147
|
-
y
|
|
1148
|
-
};
|
|
1149
|
-
}
|
|
1150
|
-
function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
|
|
1151
|
-
let {
|
|
1152
|
-
elements,
|
|
1153
|
-
rect,
|
|
1154
|
-
offsetParent,
|
|
1155
|
-
strategy
|
|
1156
|
-
} = _ref;
|
|
1157
|
-
const isFixed = strategy === "fixed";
|
|
1158
|
-
const documentElement = getDocumentElement(offsetParent);
|
|
1159
|
-
const topLayer = elements ? isTopLayer(elements.floating) : false;
|
|
1160
|
-
if (offsetParent === documentElement || topLayer && isFixed) {
|
|
1161
|
-
return rect;
|
|
1162
|
-
}
|
|
1163
|
-
let scroll = {
|
|
1164
|
-
scrollLeft: 0,
|
|
1165
|
-
scrollTop: 0
|
|
1166
|
-
};
|
|
1167
|
-
let scale = createCoords(1);
|
|
1168
|
-
const offsets = createCoords(0);
|
|
1169
|
-
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
1170
|
-
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
1171
|
-
if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) {
|
|
1172
|
-
scroll = getNodeScroll(offsetParent);
|
|
1173
|
-
}
|
|
1174
|
-
if (isHTMLElement(offsetParent)) {
|
|
1175
|
-
const offsetRect = getBoundingClientRect(offsetParent);
|
|
1176
|
-
scale = getScale(offsetParent);
|
|
1177
|
-
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
1178
|
-
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
1179
|
-
}
|
|
1180
|
-
}
|
|
1181
|
-
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll, true) : createCoords(0);
|
|
1182
|
-
return {
|
|
1183
|
-
width: rect.width * scale.x,
|
|
1184
|
-
height: rect.height * scale.y,
|
|
1185
|
-
x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
|
|
1186
|
-
y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
|
|
1187
|
-
};
|
|
1188
|
-
}
|
|
1189
|
-
function getClientRects(element) {
|
|
1190
|
-
return Array.from(element.getClientRects());
|
|
1191
|
-
}
|
|
1192
|
-
function getDocumentRect(element) {
|
|
1193
|
-
const html = getDocumentElement(element);
|
|
1194
|
-
const scroll = getNodeScroll(element);
|
|
1195
|
-
const body = element.ownerDocument.body;
|
|
1196
|
-
const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
|
|
1197
|
-
const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
|
|
1198
|
-
let x = -scroll.scrollLeft + getWindowScrollBarX(element);
|
|
1199
|
-
const y = -scroll.scrollTop;
|
|
1200
|
-
if (getComputedStyle(body).direction === "rtl") {
|
|
1201
|
-
x += max(html.clientWidth, body.clientWidth) - width;
|
|
1202
|
-
}
|
|
1203
|
-
return {
|
|
1204
|
-
width,
|
|
1205
|
-
height,
|
|
1206
|
-
x,
|
|
1207
|
-
y
|
|
1208
|
-
};
|
|
1209
|
-
}
|
|
1210
|
-
function getViewportRect(element, strategy) {
|
|
1211
|
-
const win = getWindow(element);
|
|
1212
|
-
const html = getDocumentElement(element);
|
|
1213
|
-
const visualViewport = win.visualViewport;
|
|
1214
|
-
let width = html.clientWidth;
|
|
1215
|
-
let height = html.clientHeight;
|
|
1216
|
-
let x = 0;
|
|
1217
|
-
let y = 0;
|
|
1218
|
-
if (visualViewport) {
|
|
1219
|
-
width = visualViewport.width;
|
|
1220
|
-
height = visualViewport.height;
|
|
1221
|
-
const visualViewportBased = isWebKit();
|
|
1222
|
-
if (!visualViewportBased || visualViewportBased && strategy === "fixed") {
|
|
1223
|
-
x = visualViewport.offsetLeft;
|
|
1224
|
-
y = visualViewport.offsetTop;
|
|
1225
|
-
}
|
|
1226
|
-
}
|
|
1227
|
-
return {
|
|
1228
|
-
width,
|
|
1229
|
-
height,
|
|
1230
|
-
x,
|
|
1231
|
-
y
|
|
1232
|
-
};
|
|
1233
|
-
}
|
|
1234
|
-
function getInnerBoundingClientRect(element, strategy) {
|
|
1235
|
-
const clientRect = getBoundingClientRect(element, true, strategy === "fixed");
|
|
1236
|
-
const top = clientRect.top + element.clientTop;
|
|
1237
|
-
const left = clientRect.left + element.clientLeft;
|
|
1238
|
-
const scale = isHTMLElement(element) ? getScale(element) : createCoords(1);
|
|
1239
|
-
const width = element.clientWidth * scale.x;
|
|
1240
|
-
const height = element.clientHeight * scale.y;
|
|
1241
|
-
const x = left * scale.x;
|
|
1242
|
-
const y = top * scale.y;
|
|
1243
|
-
return {
|
|
1244
|
-
width,
|
|
1245
|
-
height,
|
|
1246
|
-
x,
|
|
1247
|
-
y
|
|
1248
|
-
};
|
|
1249
|
-
}
|
|
1250
|
-
function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
|
|
1251
|
-
let rect;
|
|
1252
|
-
if (clippingAncestor === "viewport") {
|
|
1253
|
-
rect = getViewportRect(element, strategy);
|
|
1254
|
-
} else if (clippingAncestor === "document") {
|
|
1255
|
-
rect = getDocumentRect(getDocumentElement(element));
|
|
1256
|
-
} else if (isElement(clippingAncestor)) {
|
|
1257
|
-
rect = getInnerBoundingClientRect(clippingAncestor, strategy);
|
|
1258
|
-
} else {
|
|
1259
|
-
const visualOffsets = getVisualOffsets(element);
|
|
1260
|
-
rect = {
|
|
1261
|
-
x: clippingAncestor.x - visualOffsets.x,
|
|
1262
|
-
y: clippingAncestor.y - visualOffsets.y,
|
|
1263
|
-
width: clippingAncestor.width,
|
|
1264
|
-
height: clippingAncestor.height
|
|
1265
|
-
};
|
|
1266
|
-
}
|
|
1267
|
-
return rectToClientRect(rect);
|
|
1268
|
-
}
|
|
1269
|
-
function hasFixedPositionAncestor(element, stopNode) {
|
|
1270
|
-
const parentNode = getParentNode(element);
|
|
1271
|
-
if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) {
|
|
1272
|
-
return false;
|
|
1273
|
-
}
|
|
1274
|
-
return getComputedStyle(parentNode).position === "fixed" || hasFixedPositionAncestor(parentNode, stopNode);
|
|
1275
|
-
}
|
|
1276
|
-
function getClippingElementAncestors(element, cache) {
|
|
1277
|
-
const cachedResult = cache.get(element);
|
|
1278
|
-
if (cachedResult) {
|
|
1279
|
-
return cachedResult;
|
|
1280
|
-
}
|
|
1281
|
-
let result = getOverflowAncestors(element, [], false).filter((el) => isElement(el) && getNodeName(el) !== "body");
|
|
1282
|
-
let currentContainingBlockComputedStyle = null;
|
|
1283
|
-
const elementIsFixed = getComputedStyle(element).position === "fixed";
|
|
1284
|
-
let currentNode = elementIsFixed ? getParentNode(element) : element;
|
|
1285
|
-
while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
1286
|
-
const computedStyle = getComputedStyle(currentNode);
|
|
1287
|
-
const currentNodeIsContaining = isContainingBlock(currentNode);
|
|
1288
|
-
if (!currentNodeIsContaining && computedStyle.position === "fixed") {
|
|
1289
|
-
currentContainingBlockComputedStyle = null;
|
|
1290
|
-
}
|
|
1291
|
-
const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === "static" && !!currentContainingBlockComputedStyle && ["absolute", "fixed"].includes(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
|
|
1292
|
-
if (shouldDropCurrentNode) {
|
|
1293
|
-
result = result.filter((ancestor) => ancestor !== currentNode);
|
|
1294
|
-
} else {
|
|
1295
|
-
currentContainingBlockComputedStyle = computedStyle;
|
|
1296
|
-
}
|
|
1297
|
-
currentNode = getParentNode(currentNode);
|
|
1298
|
-
}
|
|
1299
|
-
cache.set(element, result);
|
|
1300
|
-
return result;
|
|
1301
|
-
}
|
|
1302
|
-
function getClippingRect(_ref) {
|
|
1303
|
-
let {
|
|
1304
|
-
element,
|
|
1305
|
-
boundary,
|
|
1306
|
-
rootBoundary,
|
|
1307
|
-
strategy
|
|
1308
|
-
} = _ref;
|
|
1309
|
-
const elementClippingAncestors = boundary === "clippingAncestors" ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
|
|
1310
|
-
const clippingAncestors = [...elementClippingAncestors, rootBoundary];
|
|
1311
|
-
const firstClippingAncestor = clippingAncestors[0];
|
|
1312
|
-
const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
|
|
1313
|
-
const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
|
|
1314
|
-
accRect.top = max(rect.top, accRect.top);
|
|
1315
|
-
accRect.right = min(rect.right, accRect.right);
|
|
1316
|
-
accRect.bottom = min(rect.bottom, accRect.bottom);
|
|
1317
|
-
accRect.left = max(rect.left, accRect.left);
|
|
1318
|
-
return accRect;
|
|
1319
|
-
}, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
|
|
1320
|
-
return {
|
|
1321
|
-
width: clippingRect.right - clippingRect.left,
|
|
1322
|
-
height: clippingRect.bottom - clippingRect.top,
|
|
1323
|
-
x: clippingRect.left,
|
|
1324
|
-
y: clippingRect.top
|
|
1325
|
-
};
|
|
1326
|
-
}
|
|
1327
|
-
function getDimensions(element) {
|
|
1328
|
-
const {
|
|
1329
|
-
width,
|
|
1330
|
-
height
|
|
1331
|
-
} = getCssDimensions(element);
|
|
1332
|
-
return {
|
|
1333
|
-
width,
|
|
1334
|
-
height
|
|
1335
|
-
};
|
|
1336
|
-
}
|
|
1337
|
-
function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
|
|
1338
|
-
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
1339
|
-
const documentElement = getDocumentElement(offsetParent);
|
|
1340
|
-
const isFixed = strategy === "fixed";
|
|
1341
|
-
const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
|
|
1342
|
-
let scroll = {
|
|
1343
|
-
scrollLeft: 0,
|
|
1344
|
-
scrollTop: 0
|
|
1345
|
-
};
|
|
1346
|
-
const offsets = createCoords(0);
|
|
1347
|
-
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
1348
|
-
if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) {
|
|
1349
|
-
scroll = getNodeScroll(offsetParent);
|
|
1350
|
-
}
|
|
1351
|
-
if (isOffsetParentAnElement) {
|
|
1352
|
-
const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
|
|
1353
|
-
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
1354
|
-
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
1355
|
-
} else if (documentElement) {
|
|
1356
|
-
offsets.x = getWindowScrollBarX(documentElement);
|
|
1357
|
-
}
|
|
1358
|
-
}
|
|
1359
|
-
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
|
|
1360
|
-
const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
|
|
1361
|
-
const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
|
|
1362
|
-
return {
|
|
1363
|
-
x,
|
|
1364
|
-
y,
|
|
1365
|
-
width: rect.width,
|
|
1366
|
-
height: rect.height
|
|
1367
|
-
};
|
|
1368
|
-
}
|
|
1369
|
-
function isStaticPositioned(element) {
|
|
1370
|
-
return getComputedStyle(element).position === "static";
|
|
1371
|
-
}
|
|
1372
|
-
function getTrueOffsetParent(element, polyfill) {
|
|
1373
|
-
if (!isHTMLElement(element) || getComputedStyle(element).position === "fixed") {
|
|
1374
|
-
return null;
|
|
1375
|
-
}
|
|
1376
|
-
if (polyfill) {
|
|
1377
|
-
return polyfill(element);
|
|
1378
|
-
}
|
|
1379
|
-
let rawOffsetParent = element.offsetParent;
|
|
1380
|
-
if (getDocumentElement(element) === rawOffsetParent) {
|
|
1381
|
-
rawOffsetParent = rawOffsetParent.ownerDocument.body;
|
|
1382
|
-
}
|
|
1383
|
-
return rawOffsetParent;
|
|
1384
|
-
}
|
|
1385
|
-
function getOffsetParent(element, polyfill) {
|
|
1386
|
-
const win = getWindow(element);
|
|
1387
|
-
if (isTopLayer(element)) {
|
|
1388
|
-
return win;
|
|
1389
|
-
}
|
|
1390
|
-
if (!isHTMLElement(element)) {
|
|
1391
|
-
let svgOffsetParent = getParentNode(element);
|
|
1392
|
-
while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
|
|
1393
|
-
if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) {
|
|
1394
|
-
return svgOffsetParent;
|
|
1395
|
-
}
|
|
1396
|
-
svgOffsetParent = getParentNode(svgOffsetParent);
|
|
1397
|
-
}
|
|
1398
|
-
return win;
|
|
1399
|
-
}
|
|
1400
|
-
let offsetParent = getTrueOffsetParent(element, polyfill);
|
|
1401
|
-
while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) {
|
|
1402
|
-
offsetParent = getTrueOffsetParent(offsetParent, polyfill);
|
|
1403
|
-
}
|
|
1404
|
-
if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) {
|
|
1405
|
-
return win;
|
|
1406
|
-
}
|
|
1407
|
-
return offsetParent || getContainingBlock(element) || win;
|
|
1408
|
-
}
|
|
1409
|
-
const getElementRects = async function(data) {
|
|
1410
|
-
const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
|
|
1411
|
-
const getDimensionsFn = this.getDimensions;
|
|
1412
|
-
const floatingDimensions = await getDimensionsFn(data.floating);
|
|
1413
|
-
return {
|
|
1414
|
-
reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
|
|
1415
|
-
floating: {
|
|
1416
|
-
x: 0,
|
|
1417
|
-
y: 0,
|
|
1418
|
-
width: floatingDimensions.width,
|
|
1419
|
-
height: floatingDimensions.height
|
|
1420
|
-
}
|
|
1421
|
-
};
|
|
1422
|
-
};
|
|
1423
|
-
function isRTL(element) {
|
|
1424
|
-
return getComputedStyle(element).direction === "rtl";
|
|
1425
|
-
}
|
|
1426
|
-
const platform = {
|
|
1427
|
-
convertOffsetParentRelativeRectToViewportRelativeRect,
|
|
1428
|
-
getDocumentElement,
|
|
1429
|
-
getClippingRect,
|
|
1430
|
-
getOffsetParent,
|
|
1431
|
-
getElementRects,
|
|
1432
|
-
getClientRects,
|
|
1433
|
-
getDimensions,
|
|
1434
|
-
getScale,
|
|
1435
|
-
isElement,
|
|
1436
|
-
isRTL
|
|
1437
|
-
};
|
|
1438
|
-
function observeMove(element, onMove) {
|
|
1439
|
-
let io = null;
|
|
1440
|
-
let timeoutId;
|
|
1441
|
-
const root = getDocumentElement(element);
|
|
1442
|
-
function cleanup() {
|
|
1443
|
-
var _io;
|
|
1444
|
-
clearTimeout(timeoutId);
|
|
1445
|
-
(_io = io) == null || _io.disconnect();
|
|
1446
|
-
io = null;
|
|
1447
|
-
}
|
|
1448
|
-
function refresh(skip, threshold) {
|
|
1449
|
-
if (skip === void 0) {
|
|
1450
|
-
skip = false;
|
|
1451
|
-
}
|
|
1452
|
-
if (threshold === void 0) {
|
|
1453
|
-
threshold = 1;
|
|
1454
|
-
}
|
|
1455
|
-
cleanup();
|
|
1456
|
-
const {
|
|
1457
|
-
left,
|
|
1458
|
-
top,
|
|
1459
|
-
width,
|
|
1460
|
-
height
|
|
1461
|
-
} = element.getBoundingClientRect();
|
|
1462
|
-
if (!skip) {
|
|
1463
|
-
onMove();
|
|
1464
|
-
}
|
|
1465
|
-
if (!width || !height) {
|
|
1466
|
-
return;
|
|
1467
|
-
}
|
|
1468
|
-
const insetTop = floor(top);
|
|
1469
|
-
const insetRight = floor(root.clientWidth - (left + width));
|
|
1470
|
-
const insetBottom = floor(root.clientHeight - (top + height));
|
|
1471
|
-
const insetLeft = floor(left);
|
|
1472
|
-
const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px";
|
|
1473
|
-
const options = {
|
|
1474
|
-
rootMargin,
|
|
1475
|
-
threshold: max(0, min(1, threshold)) || 1
|
|
1476
|
-
};
|
|
1477
|
-
let isFirstUpdate = true;
|
|
1478
|
-
function handleObserve(entries) {
|
|
1479
|
-
const ratio = entries[0].intersectionRatio;
|
|
1480
|
-
if (ratio !== threshold) {
|
|
1481
|
-
if (!isFirstUpdate) {
|
|
1482
|
-
return refresh();
|
|
1483
|
-
}
|
|
1484
|
-
if (!ratio) {
|
|
1485
|
-
timeoutId = setTimeout(() => {
|
|
1486
|
-
refresh(false, 1e-7);
|
|
1487
|
-
}, 1e3);
|
|
1488
|
-
} else {
|
|
1489
|
-
refresh(false, ratio);
|
|
1490
|
-
}
|
|
1491
|
-
}
|
|
1492
|
-
isFirstUpdate = false;
|
|
1493
|
-
}
|
|
1494
|
-
try {
|
|
1495
|
-
io = new IntersectionObserver(handleObserve, {
|
|
1496
|
-
...options,
|
|
1497
|
-
// Handle <iframe>s
|
|
1498
|
-
root: root.ownerDocument
|
|
1499
|
-
});
|
|
1500
|
-
} catch (e) {
|
|
1501
|
-
io = new IntersectionObserver(handleObserve, options);
|
|
1502
|
-
}
|
|
1503
|
-
io.observe(element);
|
|
1504
|
-
}
|
|
1505
|
-
refresh(true);
|
|
1506
|
-
return cleanup;
|
|
1507
|
-
}
|
|
1508
|
-
function autoUpdate(reference, floating, update, options) {
|
|
1509
|
-
if (options === void 0) {
|
|
1510
|
-
options = {};
|
|
1511
|
-
}
|
|
1512
|
-
const {
|
|
1513
|
-
ancestorScroll = true,
|
|
1514
|
-
ancestorResize = true,
|
|
1515
|
-
elementResize = typeof ResizeObserver === "function",
|
|
1516
|
-
layoutShift = typeof IntersectionObserver === "function",
|
|
1517
|
-
animationFrame = false
|
|
1518
|
-
} = options;
|
|
1519
|
-
const referenceEl = unwrapElement(reference);
|
|
1520
|
-
const ancestors = ancestorScroll || ancestorResize ? [...referenceEl ? getOverflowAncestors(referenceEl) : [], ...getOverflowAncestors(floating)] : [];
|
|
1521
|
-
ancestors.forEach((ancestor) => {
|
|
1522
|
-
ancestorScroll && ancestor.addEventListener("scroll", update, {
|
|
1523
|
-
passive: true
|
|
1524
|
-
});
|
|
1525
|
-
ancestorResize && ancestor.addEventListener("resize", update);
|
|
1526
|
-
});
|
|
1527
|
-
const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null;
|
|
1528
|
-
let reobserveFrame = -1;
|
|
1529
|
-
let resizeObserver = null;
|
|
1530
|
-
if (elementResize) {
|
|
1531
|
-
resizeObserver = new ResizeObserver((_ref) => {
|
|
1532
|
-
let [firstEntry] = _ref;
|
|
1533
|
-
if (firstEntry && firstEntry.target === referenceEl && resizeObserver) {
|
|
1534
|
-
resizeObserver.unobserve(floating);
|
|
1535
|
-
cancelAnimationFrame(reobserveFrame);
|
|
1536
|
-
reobserveFrame = requestAnimationFrame(() => {
|
|
1537
|
-
var _resizeObserver;
|
|
1538
|
-
(_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating);
|
|
1539
|
-
});
|
|
1540
|
-
}
|
|
1541
|
-
update();
|
|
1542
|
-
});
|
|
1543
|
-
if (referenceEl && !animationFrame) {
|
|
1544
|
-
resizeObserver.observe(referenceEl);
|
|
1545
|
-
}
|
|
1546
|
-
resizeObserver.observe(floating);
|
|
1547
|
-
}
|
|
1548
|
-
let frameId;
|
|
1549
|
-
let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
|
|
1550
|
-
if (animationFrame) {
|
|
1551
|
-
frameLoop();
|
|
1552
|
-
}
|
|
1553
|
-
function frameLoop() {
|
|
1554
|
-
const nextRefRect = getBoundingClientRect(reference);
|
|
1555
|
-
if (prevRefRect && (nextRefRect.x !== prevRefRect.x || nextRefRect.y !== prevRefRect.y || nextRefRect.width !== prevRefRect.width || nextRefRect.height !== prevRefRect.height)) {
|
|
1556
|
-
update();
|
|
1557
|
-
}
|
|
1558
|
-
prevRefRect = nextRefRect;
|
|
1559
|
-
frameId = requestAnimationFrame(frameLoop);
|
|
1560
|
-
}
|
|
1561
|
-
update();
|
|
1562
|
-
return () => {
|
|
1563
|
-
var _resizeObserver2;
|
|
1564
|
-
ancestors.forEach((ancestor) => {
|
|
1565
|
-
ancestorScroll && ancestor.removeEventListener("scroll", update);
|
|
1566
|
-
ancestorResize && ancestor.removeEventListener("resize", update);
|
|
1567
|
-
});
|
|
1568
|
-
cleanupIo == null || cleanupIo();
|
|
1569
|
-
(_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect();
|
|
1570
|
-
resizeObserver = null;
|
|
1571
|
-
if (animationFrame) {
|
|
1572
|
-
cancelAnimationFrame(frameId);
|
|
1573
|
-
}
|
|
1574
|
-
};
|
|
1575
|
-
}
|
|
1576
|
-
const offset$1 = offset$2;
|
|
1577
|
-
const shift$1 = shift$2;
|
|
1578
|
-
const flip$1 = flip$2;
|
|
1579
|
-
const computePosition = (reference, floating, options) => {
|
|
1580
|
-
const cache = /* @__PURE__ */ new Map();
|
|
1581
|
-
const mergedOptions = {
|
|
1582
|
-
platform,
|
|
1583
|
-
...options
|
|
1584
|
-
};
|
|
1585
|
-
const platformWithCache = {
|
|
1586
|
-
...mergedOptions.platform,
|
|
1587
|
-
_c: cache
|
|
1588
|
-
};
|
|
1589
|
-
return computePosition$1(reference, floating, {
|
|
1590
|
-
...mergedOptions,
|
|
1591
|
-
platform: platformWithCache
|
|
1592
|
-
});
|
|
1593
|
-
};
|
|
1594
|
-
var index$1 = typeof document !== "undefined" ? React.useLayoutEffect : React.useEffect;
|
|
1595
|
-
function deepEqual(a, b) {
|
|
1596
|
-
if (a === b) {
|
|
1597
|
-
return true;
|
|
1598
|
-
}
|
|
1599
|
-
if (typeof a !== typeof b) {
|
|
1600
|
-
return false;
|
|
1601
|
-
}
|
|
1602
|
-
if (typeof a === "function" && a.toString() === b.toString()) {
|
|
1603
|
-
return true;
|
|
1604
|
-
}
|
|
1605
|
-
let length;
|
|
1606
|
-
let i;
|
|
1607
|
-
let keys;
|
|
1608
|
-
if (a && b && typeof a === "object") {
|
|
1609
|
-
if (Array.isArray(a)) {
|
|
1610
|
-
length = a.length;
|
|
1611
|
-
if (length !== b.length) return false;
|
|
1612
|
-
for (i = length; i-- !== 0; ) {
|
|
1613
|
-
if (!deepEqual(a[i], b[i])) {
|
|
1614
|
-
return false;
|
|
1615
|
-
}
|
|
1616
|
-
}
|
|
1617
|
-
return true;
|
|
1618
|
-
}
|
|
1619
|
-
keys = Object.keys(a);
|
|
1620
|
-
length = keys.length;
|
|
1621
|
-
if (length !== Object.keys(b).length) {
|
|
1622
|
-
return false;
|
|
1623
|
-
}
|
|
1624
|
-
for (i = length; i-- !== 0; ) {
|
|
1625
|
-
if (!{}.hasOwnProperty.call(b, keys[i])) {
|
|
1626
|
-
return false;
|
|
1627
|
-
}
|
|
1628
|
-
}
|
|
1629
|
-
for (i = length; i-- !== 0; ) {
|
|
1630
|
-
const key = keys[i];
|
|
1631
|
-
if (key === "_owner" && a.$$typeof) {
|
|
1632
|
-
continue;
|
|
1633
|
-
}
|
|
1634
|
-
if (!deepEqual(a[key], b[key])) {
|
|
1635
|
-
return false;
|
|
1636
|
-
}
|
|
1637
|
-
}
|
|
1638
|
-
return true;
|
|
1639
|
-
}
|
|
1640
|
-
return a !== a && b !== b;
|
|
1641
|
-
}
|
|
1642
|
-
function getDPR(element) {
|
|
1643
|
-
if (typeof window === "undefined") {
|
|
1644
|
-
return 1;
|
|
1645
|
-
}
|
|
1646
|
-
const win = element.ownerDocument.defaultView || window;
|
|
1647
|
-
return win.devicePixelRatio || 1;
|
|
1648
|
-
}
|
|
1649
|
-
function roundByDPR(element, value) {
|
|
1650
|
-
const dpr = getDPR(element);
|
|
1651
|
-
return Math.round(value * dpr) / dpr;
|
|
1652
|
-
}
|
|
1653
|
-
function useLatestRef$1(value) {
|
|
1654
|
-
const ref = React__namespace.useRef(value);
|
|
1655
|
-
index$1(() => {
|
|
1656
|
-
ref.current = value;
|
|
1657
|
-
});
|
|
1658
|
-
return ref;
|
|
1659
|
-
}
|
|
1660
|
-
function useFloating$1(options) {
|
|
1661
|
-
if (options === void 0) {
|
|
1662
|
-
options = {};
|
|
1663
|
-
}
|
|
1664
|
-
const {
|
|
1665
|
-
placement = "bottom",
|
|
1666
|
-
strategy = "absolute",
|
|
1667
|
-
middleware = [],
|
|
1668
|
-
platform: platform2,
|
|
1669
|
-
elements: {
|
|
1670
|
-
reference: externalReference,
|
|
1671
|
-
floating: externalFloating
|
|
1672
|
-
} = {},
|
|
1673
|
-
transform = true,
|
|
1674
|
-
whileElementsMounted,
|
|
1675
|
-
open
|
|
1676
|
-
} = options;
|
|
1677
|
-
const [data, setData] = React__namespace.useState({
|
|
1678
|
-
x: 0,
|
|
1679
|
-
y: 0,
|
|
1680
|
-
strategy,
|
|
1681
|
-
placement,
|
|
1682
|
-
middlewareData: {},
|
|
1683
|
-
isPositioned: false
|
|
1684
|
-
});
|
|
1685
|
-
const [latestMiddleware, setLatestMiddleware] = React__namespace.useState(middleware);
|
|
1686
|
-
if (!deepEqual(latestMiddleware, middleware)) {
|
|
1687
|
-
setLatestMiddleware(middleware);
|
|
1688
|
-
}
|
|
1689
|
-
const [_reference, _setReference] = React__namespace.useState(null);
|
|
1690
|
-
const [_floating, _setFloating] = React__namespace.useState(null);
|
|
1691
|
-
const setReference = React__namespace.useCallback((node) => {
|
|
1692
|
-
if (node !== referenceRef.current) {
|
|
1693
|
-
referenceRef.current = node;
|
|
1694
|
-
_setReference(node);
|
|
1695
|
-
}
|
|
1696
|
-
}, []);
|
|
1697
|
-
const setFloating = React__namespace.useCallback((node) => {
|
|
1698
|
-
if (node !== floatingRef.current) {
|
|
1699
|
-
floatingRef.current = node;
|
|
1700
|
-
_setFloating(node);
|
|
1701
|
-
}
|
|
1702
|
-
}, []);
|
|
1703
|
-
const referenceEl = externalReference || _reference;
|
|
1704
|
-
const floatingEl = externalFloating || _floating;
|
|
1705
|
-
const referenceRef = React__namespace.useRef(null);
|
|
1706
|
-
const floatingRef = React__namespace.useRef(null);
|
|
1707
|
-
const dataRef = React__namespace.useRef(data);
|
|
1708
|
-
const hasWhileElementsMounted = whileElementsMounted != null;
|
|
1709
|
-
const whileElementsMountedRef = useLatestRef$1(whileElementsMounted);
|
|
1710
|
-
const platformRef = useLatestRef$1(platform2);
|
|
1711
|
-
const openRef = useLatestRef$1(open);
|
|
1712
|
-
const update = React__namespace.useCallback(() => {
|
|
1713
|
-
if (!referenceRef.current || !floatingRef.current) {
|
|
1714
|
-
return;
|
|
1715
|
-
}
|
|
1716
|
-
const config = {
|
|
1717
|
-
placement,
|
|
1718
|
-
strategy,
|
|
1719
|
-
middleware: latestMiddleware
|
|
1720
|
-
};
|
|
1721
|
-
if (platformRef.current) {
|
|
1722
|
-
config.platform = platformRef.current;
|
|
1723
|
-
}
|
|
1724
|
-
computePosition(referenceRef.current, floatingRef.current, config).then((data2) => {
|
|
1725
|
-
const fullData = {
|
|
1726
|
-
...data2,
|
|
1727
|
-
// The floating element's position may be recomputed while it's closed
|
|
1728
|
-
// but still mounted (such as when transitioning out). To ensure
|
|
1729
|
-
// `isPositioned` will be `false` initially on the next open, avoid
|
|
1730
|
-
// setting it to `true` when `open === false` (must be specified).
|
|
1731
|
-
isPositioned: openRef.current !== false
|
|
1732
|
-
};
|
|
1733
|
-
if (isMountedRef.current && !deepEqual(dataRef.current, fullData)) {
|
|
1734
|
-
dataRef.current = fullData;
|
|
1735
|
-
ReactDOM__namespace.flushSync(() => {
|
|
1736
|
-
setData(fullData);
|
|
1737
|
-
});
|
|
1738
|
-
}
|
|
1739
|
-
});
|
|
1740
|
-
}, [latestMiddleware, placement, strategy, platformRef, openRef]);
|
|
1741
|
-
index$1(() => {
|
|
1742
|
-
if (open === false && dataRef.current.isPositioned) {
|
|
1743
|
-
dataRef.current.isPositioned = false;
|
|
1744
|
-
setData((data2) => ({
|
|
1745
|
-
...data2,
|
|
1746
|
-
isPositioned: false
|
|
1747
|
-
}));
|
|
1748
|
-
}
|
|
1749
|
-
}, [open]);
|
|
1750
|
-
const isMountedRef = React__namespace.useRef(false);
|
|
1751
|
-
index$1(() => {
|
|
1752
|
-
isMountedRef.current = true;
|
|
1753
|
-
return () => {
|
|
1754
|
-
isMountedRef.current = false;
|
|
1755
|
-
};
|
|
1756
|
-
}, []);
|
|
1757
|
-
index$1(() => {
|
|
1758
|
-
if (referenceEl) referenceRef.current = referenceEl;
|
|
1759
|
-
if (floatingEl) floatingRef.current = floatingEl;
|
|
1760
|
-
if (referenceEl && floatingEl) {
|
|
1761
|
-
if (whileElementsMountedRef.current) {
|
|
1762
|
-
return whileElementsMountedRef.current(referenceEl, floatingEl, update);
|
|
1763
|
-
}
|
|
1764
|
-
update();
|
|
1765
|
-
}
|
|
1766
|
-
}, [referenceEl, floatingEl, update, whileElementsMountedRef, hasWhileElementsMounted]);
|
|
1767
|
-
const refs = React__namespace.useMemo(() => ({
|
|
1768
|
-
reference: referenceRef,
|
|
1769
|
-
floating: floatingRef,
|
|
1770
|
-
setReference,
|
|
1771
|
-
setFloating
|
|
1772
|
-
}), [setReference, setFloating]);
|
|
1773
|
-
const elements = React__namespace.useMemo(() => ({
|
|
1774
|
-
reference: referenceEl,
|
|
1775
|
-
floating: floatingEl
|
|
1776
|
-
}), [referenceEl, floatingEl]);
|
|
1777
|
-
const floatingStyles = React__namespace.useMemo(() => {
|
|
1778
|
-
const initialStyles = {
|
|
1779
|
-
position: strategy,
|
|
1780
|
-
left: 0,
|
|
1781
|
-
top: 0
|
|
1782
|
-
};
|
|
1783
|
-
if (!elements.floating) {
|
|
1784
|
-
return initialStyles;
|
|
1785
|
-
}
|
|
1786
|
-
const x = roundByDPR(elements.floating, data.x);
|
|
1787
|
-
const y = roundByDPR(elements.floating, data.y);
|
|
1788
|
-
if (transform) {
|
|
1789
|
-
return {
|
|
1790
|
-
...initialStyles,
|
|
1791
|
-
transform: "translate(" + x + "px, " + y + "px)",
|
|
1792
|
-
...getDPR(elements.floating) >= 1.5 && {
|
|
1793
|
-
willChange: "transform"
|
|
1794
|
-
}
|
|
1795
|
-
};
|
|
1796
|
-
}
|
|
1797
|
-
return {
|
|
1798
|
-
position: strategy,
|
|
1799
|
-
left: x,
|
|
1800
|
-
top: y
|
|
1801
|
-
};
|
|
1802
|
-
}, [strategy, transform, elements.floating, data.x, data.y]);
|
|
1803
|
-
return React__namespace.useMemo(() => ({
|
|
1804
|
-
...data,
|
|
1805
|
-
update,
|
|
1806
|
-
refs,
|
|
1807
|
-
elements,
|
|
1808
|
-
floatingStyles
|
|
1809
|
-
}), [data, update, refs, elements, floatingStyles]);
|
|
1810
|
-
}
|
|
1811
|
-
const offset = (options, deps) => ({
|
|
1812
|
-
...offset$1(options),
|
|
1813
|
-
options: [options, deps]
|
|
1814
|
-
});
|
|
1815
|
-
const shift = (options, deps) => ({
|
|
1816
|
-
...shift$1(options),
|
|
1817
|
-
options: [options, deps]
|
|
1818
|
-
});
|
|
1819
|
-
const flip = (options, deps) => ({
|
|
1820
|
-
...flip$1(options),
|
|
1821
|
-
options: [options, deps]
|
|
1822
|
-
});
|
|
1823
|
-
const SafeReact = {
|
|
1824
|
-
...React__namespace
|
|
1825
|
-
};
|
|
1826
|
-
const useInsertionEffect = SafeReact.useInsertionEffect;
|
|
1827
|
-
const useSafeInsertionEffect = useInsertionEffect || ((fn) => fn());
|
|
1828
|
-
function useEffectEvent(callback) {
|
|
1829
|
-
const ref = React__namespace.useRef(() => {
|
|
1830
|
-
if (process.env.NODE_ENV !== "production") {
|
|
1831
|
-
throw new Error("Cannot call an event handler while rendering.");
|
|
1832
|
-
}
|
|
1833
|
-
});
|
|
1834
|
-
useSafeInsertionEffect(() => {
|
|
1835
|
-
ref.current = callback;
|
|
1836
|
-
});
|
|
1837
|
-
return React__namespace.useCallback(function() {
|
|
1838
|
-
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
1839
|
-
args[_key] = arguments[_key];
|
|
1840
|
-
}
|
|
1841
|
-
return ref.current == null ? void 0 : ref.current(...args);
|
|
1842
|
-
}, []);
|
|
1843
|
-
}
|
|
1844
|
-
const ARROW_UP = "ArrowUp";
|
|
1845
|
-
const ARROW_DOWN = "ArrowDown";
|
|
1846
|
-
const ARROW_LEFT = "ArrowLeft";
|
|
1847
|
-
const ARROW_RIGHT = "ArrowRight";
|
|
1848
|
-
function isDifferentRow(index2, cols, prevRow) {
|
|
1849
|
-
return Math.floor(index2 / cols) !== prevRow;
|
|
1850
|
-
}
|
|
1851
|
-
function isIndexOutOfBounds(listRef, index2) {
|
|
1852
|
-
return index2 < 0 || index2 >= listRef.current.length;
|
|
1853
|
-
}
|
|
1854
|
-
function getMinIndex(listRef, disabledIndices) {
|
|
1855
|
-
return findNonDisabledIndex(listRef, {
|
|
1856
|
-
disabledIndices
|
|
1857
|
-
});
|
|
1858
|
-
}
|
|
1859
|
-
function getMaxIndex(listRef, disabledIndices) {
|
|
1860
|
-
return findNonDisabledIndex(listRef, {
|
|
1861
|
-
decrement: true,
|
|
1862
|
-
startingIndex: listRef.current.length,
|
|
1863
|
-
disabledIndices
|
|
1864
|
-
});
|
|
1865
|
-
}
|
|
1866
|
-
function findNonDisabledIndex(listRef, _temp) {
|
|
1867
|
-
let {
|
|
1868
|
-
startingIndex = -1,
|
|
1869
|
-
decrement = false,
|
|
1870
|
-
disabledIndices,
|
|
1871
|
-
amount = 1
|
|
1872
|
-
} = _temp === void 0 ? {} : _temp;
|
|
1873
|
-
const list = listRef.current;
|
|
1874
|
-
let index2 = startingIndex;
|
|
1875
|
-
do {
|
|
1876
|
-
index2 += decrement ? -amount : amount;
|
|
1877
|
-
} while (index2 >= 0 && index2 <= list.length - 1 && isDisabled(list, index2, disabledIndices));
|
|
1878
|
-
return index2;
|
|
1879
|
-
}
|
|
1880
|
-
function getGridNavigatedIndex(elementsRef, _ref) {
|
|
1881
|
-
let {
|
|
1882
|
-
event,
|
|
1883
|
-
orientation,
|
|
1884
|
-
loop,
|
|
1885
|
-
rtl,
|
|
1886
|
-
cols,
|
|
1887
|
-
disabledIndices,
|
|
1888
|
-
minIndex,
|
|
1889
|
-
maxIndex,
|
|
1890
|
-
prevIndex,
|
|
1891
|
-
stopEvent: stop = false
|
|
1892
|
-
} = _ref;
|
|
1893
|
-
let nextIndex = prevIndex;
|
|
1894
|
-
if (event.key === ARROW_UP) {
|
|
1895
|
-
stop && stopEvent(event);
|
|
1896
|
-
if (prevIndex === -1) {
|
|
1897
|
-
nextIndex = maxIndex;
|
|
1898
|
-
} else {
|
|
1899
|
-
nextIndex = findNonDisabledIndex(elementsRef, {
|
|
1900
|
-
startingIndex: nextIndex,
|
|
1901
|
-
amount: cols,
|
|
1902
|
-
decrement: true,
|
|
1903
|
-
disabledIndices
|
|
1904
|
-
});
|
|
1905
|
-
if (loop && (prevIndex - cols < minIndex || nextIndex < 0)) {
|
|
1906
|
-
const col = prevIndex % cols;
|
|
1907
|
-
const maxCol = maxIndex % cols;
|
|
1908
|
-
const offset2 = maxIndex - (maxCol - col);
|
|
1909
|
-
if (maxCol === col) {
|
|
1910
|
-
nextIndex = maxIndex;
|
|
1911
|
-
} else {
|
|
1912
|
-
nextIndex = maxCol > col ? offset2 : offset2 - cols;
|
|
1913
|
-
}
|
|
1914
|
-
}
|
|
1915
|
-
}
|
|
1916
|
-
if (isIndexOutOfBounds(elementsRef, nextIndex)) {
|
|
1917
|
-
nextIndex = prevIndex;
|
|
1918
|
-
}
|
|
1919
|
-
}
|
|
1920
|
-
if (event.key === ARROW_DOWN) {
|
|
1921
|
-
stop && stopEvent(event);
|
|
1922
|
-
if (prevIndex === -1) {
|
|
1923
|
-
nextIndex = minIndex;
|
|
1924
|
-
} else {
|
|
1925
|
-
nextIndex = findNonDisabledIndex(elementsRef, {
|
|
1926
|
-
startingIndex: prevIndex,
|
|
1927
|
-
amount: cols,
|
|
1928
|
-
disabledIndices
|
|
1929
|
-
});
|
|
1930
|
-
if (loop && prevIndex + cols > maxIndex) {
|
|
1931
|
-
nextIndex = findNonDisabledIndex(elementsRef, {
|
|
1932
|
-
startingIndex: prevIndex % cols - cols,
|
|
1933
|
-
amount: cols,
|
|
1934
|
-
disabledIndices
|
|
1935
|
-
});
|
|
1936
|
-
}
|
|
1937
|
-
}
|
|
1938
|
-
if (isIndexOutOfBounds(elementsRef, nextIndex)) {
|
|
1939
|
-
nextIndex = prevIndex;
|
|
1940
|
-
}
|
|
1941
|
-
}
|
|
1942
|
-
if (orientation === "both") {
|
|
1943
|
-
const prevRow = floor(prevIndex / cols);
|
|
1944
|
-
if (event.key === (rtl ? ARROW_LEFT : ARROW_RIGHT)) {
|
|
1945
|
-
stop && stopEvent(event);
|
|
1946
|
-
if (prevIndex % cols !== cols - 1) {
|
|
1947
|
-
nextIndex = findNonDisabledIndex(elementsRef, {
|
|
1948
|
-
startingIndex: prevIndex,
|
|
1949
|
-
disabledIndices
|
|
1950
|
-
});
|
|
1951
|
-
if (loop && isDifferentRow(nextIndex, cols, prevRow)) {
|
|
1952
|
-
nextIndex = findNonDisabledIndex(elementsRef, {
|
|
1953
|
-
startingIndex: prevIndex - prevIndex % cols - 1,
|
|
1954
|
-
disabledIndices
|
|
1955
|
-
});
|
|
1956
|
-
}
|
|
1957
|
-
} else if (loop) {
|
|
1958
|
-
nextIndex = findNonDisabledIndex(elementsRef, {
|
|
1959
|
-
startingIndex: prevIndex - prevIndex % cols - 1,
|
|
1960
|
-
disabledIndices
|
|
1961
|
-
});
|
|
1962
|
-
}
|
|
1963
|
-
if (isDifferentRow(nextIndex, cols, prevRow)) {
|
|
1964
|
-
nextIndex = prevIndex;
|
|
1965
|
-
}
|
|
1966
|
-
}
|
|
1967
|
-
if (event.key === (rtl ? ARROW_RIGHT : ARROW_LEFT)) {
|
|
1968
|
-
stop && stopEvent(event);
|
|
1969
|
-
if (prevIndex % cols !== 0) {
|
|
1970
|
-
nextIndex = findNonDisabledIndex(elementsRef, {
|
|
1971
|
-
startingIndex: prevIndex,
|
|
1972
|
-
decrement: true,
|
|
1973
|
-
disabledIndices
|
|
1974
|
-
});
|
|
1975
|
-
if (loop && isDifferentRow(nextIndex, cols, prevRow)) {
|
|
1976
|
-
nextIndex = findNonDisabledIndex(elementsRef, {
|
|
1977
|
-
startingIndex: prevIndex + (cols - prevIndex % cols),
|
|
1978
|
-
decrement: true,
|
|
1979
|
-
disabledIndices
|
|
1980
|
-
});
|
|
1981
|
-
}
|
|
1982
|
-
} else if (loop) {
|
|
1983
|
-
nextIndex = findNonDisabledIndex(elementsRef, {
|
|
1984
|
-
startingIndex: prevIndex + (cols - prevIndex % cols),
|
|
1985
|
-
decrement: true,
|
|
1986
|
-
disabledIndices
|
|
1987
|
-
});
|
|
1988
|
-
}
|
|
1989
|
-
if (isDifferentRow(nextIndex, cols, prevRow)) {
|
|
1990
|
-
nextIndex = prevIndex;
|
|
1991
|
-
}
|
|
1992
|
-
}
|
|
1993
|
-
const lastRow = floor(maxIndex / cols) === prevRow;
|
|
1994
|
-
if (isIndexOutOfBounds(elementsRef, nextIndex)) {
|
|
1995
|
-
if (loop && lastRow) {
|
|
1996
|
-
nextIndex = event.key === (rtl ? ARROW_RIGHT : ARROW_LEFT) ? maxIndex : findNonDisabledIndex(elementsRef, {
|
|
1997
|
-
startingIndex: prevIndex - prevIndex % cols - 1,
|
|
1998
|
-
disabledIndices
|
|
1999
|
-
});
|
|
2000
|
-
} else {
|
|
2001
|
-
nextIndex = prevIndex;
|
|
2002
|
-
}
|
|
2003
|
-
}
|
|
2004
|
-
}
|
|
2005
|
-
return nextIndex;
|
|
2006
|
-
}
|
|
2007
|
-
function buildCellMap(sizes, cols, dense) {
|
|
2008
|
-
const cellMap = [];
|
|
2009
|
-
let startIndex = 0;
|
|
2010
|
-
sizes.forEach((_ref2, index2) => {
|
|
2011
|
-
let {
|
|
2012
|
-
width,
|
|
2013
|
-
height
|
|
2014
|
-
} = _ref2;
|
|
2015
|
-
if (width > cols) {
|
|
2016
|
-
if (process.env.NODE_ENV !== "production") {
|
|
2017
|
-
throw new Error("[Floating UI]: Invalid grid - item width at index " + index2 + " is greater than grid columns");
|
|
2018
|
-
}
|
|
2019
|
-
}
|
|
2020
|
-
let itemPlaced = false;
|
|
2021
|
-
if (dense) {
|
|
2022
|
-
startIndex = 0;
|
|
2023
|
-
}
|
|
2024
|
-
while (!itemPlaced) {
|
|
2025
|
-
const targetCells = [];
|
|
2026
|
-
for (let i = 0; i < width; i++) {
|
|
2027
|
-
for (let j = 0; j < height; j++) {
|
|
2028
|
-
targetCells.push(startIndex + i + j * cols);
|
|
2029
|
-
}
|
|
2030
|
-
}
|
|
2031
|
-
if (startIndex % cols + width <= cols && targetCells.every((cell) => cellMap[cell] == null)) {
|
|
2032
|
-
targetCells.forEach((cell) => {
|
|
2033
|
-
cellMap[cell] = index2;
|
|
2034
|
-
});
|
|
2035
|
-
itemPlaced = true;
|
|
2036
|
-
} else {
|
|
2037
|
-
startIndex++;
|
|
2038
|
-
}
|
|
2039
|
-
}
|
|
2040
|
-
});
|
|
2041
|
-
return [...cellMap];
|
|
2042
|
-
}
|
|
2043
|
-
function getCellIndexOfCorner(index2, sizes, cellMap, cols, corner) {
|
|
2044
|
-
if (index2 === -1) return -1;
|
|
2045
|
-
const firstCellIndex = cellMap.indexOf(index2);
|
|
2046
|
-
const sizeItem = sizes[index2];
|
|
2047
|
-
switch (corner) {
|
|
2048
|
-
case "tl":
|
|
2049
|
-
return firstCellIndex;
|
|
2050
|
-
case "tr":
|
|
2051
|
-
if (!sizeItem) {
|
|
2052
|
-
return firstCellIndex;
|
|
2053
|
-
}
|
|
2054
|
-
return firstCellIndex + sizeItem.width - 1;
|
|
2055
|
-
case "bl":
|
|
2056
|
-
if (!sizeItem) {
|
|
2057
|
-
return firstCellIndex;
|
|
2058
|
-
}
|
|
2059
|
-
return firstCellIndex + (sizeItem.height - 1) * cols;
|
|
2060
|
-
case "br":
|
|
2061
|
-
return cellMap.lastIndexOf(index2);
|
|
2062
|
-
}
|
|
2063
|
-
}
|
|
2064
|
-
function getCellIndices(indices, cellMap) {
|
|
2065
|
-
return cellMap.flatMap((index2, cellIndex) => indices.includes(index2) ? [cellIndex] : []);
|
|
2066
|
-
}
|
|
2067
|
-
function isDisabled(list, index2, disabledIndices) {
|
|
2068
|
-
if (disabledIndices) {
|
|
2069
|
-
return disabledIndices.includes(index2);
|
|
2070
|
-
}
|
|
2071
|
-
const element = list[index2];
|
|
2072
|
-
return element == null || element.hasAttribute("disabled") || element.getAttribute("aria-disabled") === "true";
|
|
2073
|
-
}
|
|
2074
|
-
var index = typeof document !== "undefined" ? React.useLayoutEffect : React.useEffect;
|
|
2075
|
-
function sortByDocumentPosition(a, b) {
|
|
2076
|
-
const position = a.compareDocumentPosition(b);
|
|
2077
|
-
if (position & Node.DOCUMENT_POSITION_FOLLOWING || position & Node.DOCUMENT_POSITION_CONTAINED_BY) {
|
|
2078
|
-
return -1;
|
|
2079
|
-
}
|
|
2080
|
-
if (position & Node.DOCUMENT_POSITION_PRECEDING || position & Node.DOCUMENT_POSITION_CONTAINS) {
|
|
2081
|
-
return 1;
|
|
2082
|
-
}
|
|
2083
|
-
return 0;
|
|
2084
|
-
}
|
|
2085
|
-
function areMapsEqual(map1, map2) {
|
|
2086
|
-
if (map1.size !== map2.size) {
|
|
2087
|
-
return false;
|
|
2088
|
-
}
|
|
2089
|
-
for (const [key, value] of map1.entries()) {
|
|
2090
|
-
if (value !== map2.get(key)) {
|
|
2091
|
-
return false;
|
|
2092
|
-
}
|
|
2093
|
-
}
|
|
2094
|
-
return true;
|
|
2095
|
-
}
|
|
2096
|
-
const FloatingListContext = /* @__PURE__ */ React__namespace.createContext({
|
|
2097
|
-
register: () => {
|
|
2098
|
-
},
|
|
2099
|
-
unregister: () => {
|
|
2100
|
-
},
|
|
2101
|
-
map: /* @__PURE__ */ new Map(),
|
|
2102
|
-
elementsRef: {
|
|
2103
|
-
current: []
|
|
2104
|
-
}
|
|
2105
|
-
});
|
|
2106
|
-
function FloatingList(props) {
|
|
2107
|
-
const {
|
|
2108
|
-
children,
|
|
2109
|
-
elementsRef,
|
|
2110
|
-
labelsRef
|
|
2111
|
-
} = props;
|
|
2112
|
-
const [map, setMap] = React__namespace.useState(() => /* @__PURE__ */ new Map());
|
|
2113
|
-
const register = React__namespace.useCallback((node) => {
|
|
2114
|
-
setMap((prevMap) => new Map(prevMap).set(node, null));
|
|
2115
|
-
}, []);
|
|
2116
|
-
const unregister = React__namespace.useCallback((node) => {
|
|
2117
|
-
setMap((prevMap) => {
|
|
2118
|
-
const map2 = new Map(prevMap);
|
|
2119
|
-
map2.delete(node);
|
|
2120
|
-
return map2;
|
|
2121
|
-
});
|
|
2122
|
-
}, []);
|
|
2123
|
-
index(() => {
|
|
2124
|
-
const newMap = new Map(map);
|
|
2125
|
-
const nodes = Array.from(newMap.keys()).sort(sortByDocumentPosition);
|
|
2126
|
-
nodes.forEach((node, index2) => {
|
|
2127
|
-
newMap.set(node, index2);
|
|
2128
|
-
});
|
|
2129
|
-
if (!areMapsEqual(map, newMap)) {
|
|
2130
|
-
setMap(newMap);
|
|
2131
|
-
}
|
|
2132
|
-
}, [map]);
|
|
2133
|
-
return /* @__PURE__ */ React__namespace.createElement(FloatingListContext.Provider, {
|
|
2134
|
-
value: React__namespace.useMemo(() => ({
|
|
2135
|
-
register,
|
|
2136
|
-
unregister,
|
|
2137
|
-
map,
|
|
2138
|
-
elementsRef,
|
|
2139
|
-
labelsRef
|
|
2140
|
-
}), [register, unregister, map, elementsRef, labelsRef])
|
|
2141
|
-
}, children);
|
|
2142
|
-
}
|
|
2143
|
-
function useListItem(props) {
|
|
2144
|
-
if (props === void 0) {
|
|
2145
|
-
props = {};
|
|
2146
|
-
}
|
|
2147
|
-
const {
|
|
2148
|
-
label
|
|
2149
|
-
} = props;
|
|
2150
|
-
const {
|
|
2151
|
-
register,
|
|
2152
|
-
unregister,
|
|
2153
|
-
map,
|
|
2154
|
-
elementsRef,
|
|
2155
|
-
labelsRef
|
|
2156
|
-
} = React__namespace.useContext(FloatingListContext);
|
|
2157
|
-
const [index$12, setIndex] = React__namespace.useState(null);
|
|
2158
|
-
const componentRef = React__namespace.useRef(null);
|
|
2159
|
-
const ref = React__namespace.useCallback((node) => {
|
|
2160
|
-
componentRef.current = node;
|
|
2161
|
-
if (index$12 !== null) {
|
|
2162
|
-
elementsRef.current[index$12] = node;
|
|
2163
|
-
if (labelsRef) {
|
|
2164
|
-
var _node$textContent;
|
|
2165
|
-
const isLabelDefined = label !== void 0;
|
|
2166
|
-
labelsRef.current[index$12] = isLabelDefined ? label : (_node$textContent = node == null ? void 0 : node.textContent) != null ? _node$textContent : null;
|
|
2167
|
-
}
|
|
2168
|
-
}
|
|
2169
|
-
}, [index$12, elementsRef, labelsRef, label]);
|
|
2170
|
-
index(() => {
|
|
2171
|
-
const node = componentRef.current;
|
|
2172
|
-
if (node) {
|
|
2173
|
-
register(node);
|
|
2174
|
-
return () => {
|
|
2175
|
-
unregister(node);
|
|
2176
|
-
};
|
|
2177
|
-
}
|
|
2178
|
-
}, [register, unregister]);
|
|
2179
|
-
index(() => {
|
|
2180
|
-
const index2 = componentRef.current ? map.get(componentRef.current) : null;
|
|
2181
|
-
if (index2 != null) {
|
|
2182
|
-
setIndex(index2);
|
|
2183
|
-
}
|
|
2184
|
-
}, [map]);
|
|
2185
|
-
return React__namespace.useMemo(() => ({
|
|
2186
|
-
ref,
|
|
2187
|
-
index: index$12 == null ? -1 : index$12
|
|
2188
|
-
}), [index$12, ref]);
|
|
2189
|
-
}
|
|
2190
|
-
let serverHandoffComplete = false;
|
|
2191
|
-
let count = 0;
|
|
2192
|
-
const genId = () => (
|
|
2193
|
-
// Ensure the id is unique with multiple independent versions of Floating UI
|
|
2194
|
-
// on <React 18
|
|
2195
|
-
"floating-ui-" + Math.random().toString(36).slice(2, 6) + count++
|
|
2196
|
-
);
|
|
2197
|
-
function useFloatingId() {
|
|
2198
|
-
const [id, setId] = React__namespace.useState(() => serverHandoffComplete ? genId() : void 0);
|
|
2199
|
-
index(() => {
|
|
2200
|
-
if (id == null) {
|
|
2201
|
-
setId(genId());
|
|
2202
|
-
}
|
|
2203
|
-
}, []);
|
|
2204
|
-
React__namespace.useEffect(() => {
|
|
2205
|
-
serverHandoffComplete = true;
|
|
2206
|
-
}, []);
|
|
2207
|
-
return id;
|
|
2208
|
-
}
|
|
2209
|
-
const useReactId = SafeReact.useId;
|
|
2210
|
-
const useId = useReactId || useFloatingId;
|
|
2211
|
-
let devMessageSet;
|
|
2212
|
-
if (process.env.NODE_ENV !== "production") {
|
|
2213
|
-
devMessageSet = /* @__PURE__ */ new Set();
|
|
2214
|
-
}
|
|
2215
|
-
function warn() {
|
|
2216
|
-
var _devMessageSet;
|
|
2217
|
-
for (var _len = arguments.length, messages = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
2218
|
-
messages[_key] = arguments[_key];
|
|
2219
|
-
}
|
|
2220
|
-
const message = "Floating UI: " + messages.join(" ");
|
|
2221
|
-
if (!((_devMessageSet = devMessageSet) != null && _devMessageSet.has(message))) {
|
|
2222
|
-
var _devMessageSet2;
|
|
2223
|
-
(_devMessageSet2 = devMessageSet) == null || _devMessageSet2.add(message);
|
|
2224
|
-
console.warn(message);
|
|
2225
|
-
}
|
|
2226
|
-
}
|
|
2227
|
-
function error() {
|
|
2228
|
-
var _devMessageSet3;
|
|
2229
|
-
for (var _len2 = arguments.length, messages = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
|
|
2230
|
-
messages[_key2] = arguments[_key2];
|
|
2231
|
-
}
|
|
2232
|
-
const message = "Floating UI: " + messages.join(" ");
|
|
2233
|
-
if (!((_devMessageSet3 = devMessageSet) != null && _devMessageSet3.has(message))) {
|
|
2234
|
-
var _devMessageSet4;
|
|
2235
|
-
(_devMessageSet4 = devMessageSet) == null || _devMessageSet4.add(message);
|
|
2236
|
-
console.error(message);
|
|
2237
|
-
}
|
|
2238
|
-
}
|
|
2239
|
-
function createPubSub() {
|
|
2240
|
-
const map = /* @__PURE__ */ new Map();
|
|
2241
|
-
return {
|
|
2242
|
-
emit(event, data) {
|
|
2243
|
-
var _map$get;
|
|
2244
|
-
(_map$get = map.get(event)) == null || _map$get.forEach((handler) => handler(data));
|
|
2245
|
-
},
|
|
2246
|
-
on(event, listener) {
|
|
2247
|
-
map.set(event, [...map.get(event) || [], listener]);
|
|
2248
|
-
},
|
|
2249
|
-
off(event, listener) {
|
|
2250
|
-
var _map$get2;
|
|
2251
|
-
map.set(event, ((_map$get2 = map.get(event)) == null ? void 0 : _map$get2.filter((l) => l !== listener)) || []);
|
|
2252
|
-
}
|
|
2253
|
-
};
|
|
2254
|
-
}
|
|
2255
|
-
const FloatingNodeContext = /* @__PURE__ */ React__namespace.createContext(null);
|
|
2256
|
-
const FloatingTreeContext = /* @__PURE__ */ React__namespace.createContext(null);
|
|
2257
|
-
const useFloatingParentNodeId = () => {
|
|
2258
|
-
var _React$useContext;
|
|
2259
|
-
return ((_React$useContext = React__namespace.useContext(FloatingNodeContext)) == null ? void 0 : _React$useContext.id) || null;
|
|
2260
|
-
};
|
|
2261
|
-
const useFloatingTree = () => React__namespace.useContext(FloatingTreeContext);
|
|
2262
|
-
function useLatestRef(value) {
|
|
2263
|
-
const ref = React.useRef(value);
|
|
2264
|
-
index(() => {
|
|
2265
|
-
ref.current = value;
|
|
2266
|
-
});
|
|
2267
|
-
return ref;
|
|
2268
|
-
}
|
|
2269
|
-
let rafId = 0;
|
|
2270
|
-
function enqueueFocus(el, options) {
|
|
2271
|
-
if (options === void 0) {
|
|
2272
|
-
options = {};
|
|
2273
|
-
}
|
|
2274
|
-
const {
|
|
2275
|
-
preventScroll = false,
|
|
2276
|
-
cancelPrevious = true,
|
|
2277
|
-
sync = false
|
|
2278
|
-
} = options;
|
|
2279
|
-
cancelPrevious && cancelAnimationFrame(rafId);
|
|
2280
|
-
const exec = () => el == null ? void 0 : el.focus({
|
|
2281
|
-
preventScroll
|
|
2282
|
-
});
|
|
2283
|
-
if (sync) {
|
|
2284
|
-
exec();
|
|
2285
|
-
} else {
|
|
2286
|
-
rafId = requestAnimationFrame(exec);
|
|
2287
|
-
}
|
|
2288
|
-
}
|
|
2289
|
-
function getChildren(nodes, id) {
|
|
2290
|
-
let allChildren = nodes.filter((node) => {
|
|
2291
|
-
var _node$context;
|
|
2292
|
-
return node.parentId === id && ((_node$context = node.context) == null ? void 0 : _node$context.open);
|
|
2293
|
-
});
|
|
2294
|
-
let currentChildren = allChildren;
|
|
2295
|
-
while (currentChildren.length) {
|
|
2296
|
-
currentChildren = nodes.filter((node) => {
|
|
2297
|
-
var _currentChildren;
|
|
2298
|
-
return (_currentChildren = currentChildren) == null ? void 0 : _currentChildren.some((n) => {
|
|
2299
|
-
var _node$context2;
|
|
2300
|
-
return node.parentId === n.id && ((_node$context2 = node.context) == null ? void 0 : _node$context2.open);
|
|
2301
|
-
});
|
|
2302
|
-
});
|
|
2303
|
-
allChildren = allChildren.concat(currentChildren);
|
|
2304
|
-
}
|
|
2305
|
-
return allChildren;
|
|
2306
|
-
}
|
|
2307
|
-
function getDeepestNode(nodes, id) {
|
|
2308
|
-
let deepestNodeId;
|
|
2309
|
-
let maxDepth = -1;
|
|
2310
|
-
function findDeepest(nodeId, depth) {
|
|
2311
|
-
if (depth > maxDepth) {
|
|
2312
|
-
deepestNodeId = nodeId;
|
|
2313
|
-
maxDepth = depth;
|
|
2314
|
-
}
|
|
2315
|
-
const children = getChildren(nodes, nodeId);
|
|
2316
|
-
children.forEach((child) => {
|
|
2317
|
-
findDeepest(child.id, depth + 1);
|
|
2318
|
-
});
|
|
2319
|
-
}
|
|
2320
|
-
findDeepest(id, 0);
|
|
2321
|
-
return nodes.find((node) => node.id === deepestNodeId);
|
|
2322
|
-
}
|
|
2323
|
-
const FOCUSABLE_ATTRIBUTE = "data-floating-ui-focusable";
|
|
2324
|
-
function getFloatingFocusElement(floatingElement) {
|
|
2325
|
-
if (!floatingElement) {
|
|
2326
|
-
return null;
|
|
2327
|
-
}
|
|
2328
|
-
return floatingElement.hasAttribute(FOCUSABLE_ATTRIBUTE) ? floatingElement : floatingElement.querySelector("[" + FOCUSABLE_ATTRIBUTE + "]") || floatingElement;
|
|
2329
|
-
}
|
|
2330
|
-
function useFloatingRootContext(options) {
|
|
2331
|
-
const {
|
|
2332
|
-
open = false,
|
|
2333
|
-
onOpenChange: onOpenChangeProp,
|
|
2334
|
-
elements: elementsProp
|
|
2335
|
-
} = options;
|
|
2336
|
-
const floatingId = useId();
|
|
2337
|
-
const dataRef = React__namespace.useRef({});
|
|
2338
|
-
const [events] = React__namespace.useState(() => createPubSub());
|
|
2339
|
-
const nested = useFloatingParentNodeId() != null;
|
|
2340
|
-
if (process.env.NODE_ENV !== "production") {
|
|
2341
|
-
const optionDomReference = elementsProp.reference;
|
|
2342
|
-
if (optionDomReference && !isElement(optionDomReference)) {
|
|
2343
|
-
error("Cannot pass a virtual element to the `elements.reference` option,", "as it must be a real DOM element. Use `refs.setPositionReference()`", "instead.");
|
|
2344
|
-
}
|
|
2345
|
-
}
|
|
2346
|
-
const [positionReference, setPositionReference] = React__namespace.useState(elementsProp.reference);
|
|
2347
|
-
const onOpenChange = useEffectEvent((open2, event, reason) => {
|
|
2348
|
-
dataRef.current.openEvent = open2 ? event : void 0;
|
|
2349
|
-
events.emit("openchange", {
|
|
2350
|
-
open: open2,
|
|
2351
|
-
event,
|
|
2352
|
-
reason,
|
|
2353
|
-
nested
|
|
2354
|
-
});
|
|
2355
|
-
onOpenChangeProp == null || onOpenChangeProp(open2, event, reason);
|
|
2356
|
-
});
|
|
2357
|
-
const refs = React__namespace.useMemo(() => ({
|
|
2358
|
-
setPositionReference
|
|
2359
|
-
}), []);
|
|
2360
|
-
const elements = React__namespace.useMemo(() => ({
|
|
2361
|
-
reference: positionReference || elementsProp.reference || null,
|
|
2362
|
-
floating: elementsProp.floating || null,
|
|
2363
|
-
domReference: elementsProp.reference
|
|
2364
|
-
}), [positionReference, elementsProp.reference, elementsProp.floating]);
|
|
2365
|
-
return React__namespace.useMemo(() => ({
|
|
2366
|
-
dataRef,
|
|
2367
|
-
open,
|
|
2368
|
-
onOpenChange,
|
|
2369
|
-
elements,
|
|
2370
|
-
events,
|
|
2371
|
-
floatingId,
|
|
2372
|
-
refs
|
|
2373
|
-
}), [open, onOpenChange, elements, events, floatingId, refs]);
|
|
2374
|
-
}
|
|
2375
|
-
function useFloating(options) {
|
|
2376
|
-
if (options === void 0) {
|
|
2377
|
-
options = {};
|
|
2378
|
-
}
|
|
2379
|
-
const {
|
|
2380
|
-
nodeId
|
|
2381
|
-
} = options;
|
|
2382
|
-
const internalRootContext = useFloatingRootContext({
|
|
2383
|
-
...options,
|
|
2384
|
-
elements: {
|
|
2385
|
-
reference: null,
|
|
2386
|
-
floating: null,
|
|
2387
|
-
...options.elements
|
|
2388
|
-
}
|
|
2389
|
-
});
|
|
2390
|
-
const rootContext = options.rootContext || internalRootContext;
|
|
2391
|
-
const computedElements = rootContext.elements;
|
|
2392
|
-
const [_domReference, setDomReference] = React__namespace.useState(null);
|
|
2393
|
-
const [positionReference, _setPositionReference] = React__namespace.useState(null);
|
|
2394
|
-
const optionDomReference = computedElements == null ? void 0 : computedElements.domReference;
|
|
2395
|
-
const domReference = optionDomReference || _domReference;
|
|
2396
|
-
const domReferenceRef = React__namespace.useRef(null);
|
|
2397
|
-
const tree = useFloatingTree();
|
|
2398
|
-
index(() => {
|
|
2399
|
-
if (domReference) {
|
|
2400
|
-
domReferenceRef.current = domReference;
|
|
2401
|
-
}
|
|
2402
|
-
}, [domReference]);
|
|
2403
|
-
const position = useFloating$1({
|
|
2404
|
-
...options,
|
|
2405
|
-
elements: {
|
|
2406
|
-
...computedElements,
|
|
2407
|
-
...positionReference && {
|
|
2408
|
-
reference: positionReference
|
|
2409
|
-
}
|
|
2410
|
-
}
|
|
2411
|
-
});
|
|
2412
|
-
const setPositionReference = React__namespace.useCallback((node) => {
|
|
2413
|
-
const computedPositionReference = isElement(node) ? {
|
|
2414
|
-
getBoundingClientRect: () => node.getBoundingClientRect(),
|
|
2415
|
-
contextElement: node
|
|
2416
|
-
} : node;
|
|
2417
|
-
_setPositionReference(computedPositionReference);
|
|
2418
|
-
position.refs.setReference(computedPositionReference);
|
|
2419
|
-
}, [position.refs]);
|
|
2420
|
-
const setReference = React__namespace.useCallback((node) => {
|
|
2421
|
-
if (isElement(node) || node === null) {
|
|
2422
|
-
domReferenceRef.current = node;
|
|
2423
|
-
setDomReference(node);
|
|
2424
|
-
}
|
|
2425
|
-
if (isElement(position.refs.reference.current) || position.refs.reference.current === null || // Don't allow setting virtual elements using the old technique back to
|
|
2426
|
-
// `null` to support `positionReference` + an unstable `reference`
|
|
2427
|
-
// callback ref.
|
|
2428
|
-
node !== null && !isElement(node)) {
|
|
2429
|
-
position.refs.setReference(node);
|
|
2430
|
-
}
|
|
2431
|
-
}, [position.refs]);
|
|
2432
|
-
const refs = React__namespace.useMemo(() => ({
|
|
2433
|
-
...position.refs,
|
|
2434
|
-
setReference,
|
|
2435
|
-
setPositionReference,
|
|
2436
|
-
domReference: domReferenceRef
|
|
2437
|
-
}), [position.refs, setReference, setPositionReference]);
|
|
2438
|
-
const elements = React__namespace.useMemo(() => ({
|
|
2439
|
-
...position.elements,
|
|
2440
|
-
domReference
|
|
2441
|
-
}), [position.elements, domReference]);
|
|
2442
|
-
const context = React__namespace.useMemo(() => ({
|
|
2443
|
-
...position,
|
|
2444
|
-
...rootContext,
|
|
2445
|
-
refs,
|
|
2446
|
-
elements,
|
|
2447
|
-
nodeId
|
|
2448
|
-
}), [position, refs, elements, nodeId, rootContext]);
|
|
2449
|
-
index(() => {
|
|
2450
|
-
rootContext.dataRef.current.floatingContext = context;
|
|
2451
|
-
const node = tree == null ? void 0 : tree.nodesRef.current.find((node2) => node2.id === nodeId);
|
|
2452
|
-
if (node) {
|
|
2453
|
-
node.context = context;
|
|
2454
|
-
}
|
|
2455
|
-
});
|
|
2456
|
-
return React__namespace.useMemo(() => ({
|
|
2457
|
-
...position,
|
|
2458
|
-
context,
|
|
2459
|
-
refs,
|
|
2460
|
-
elements
|
|
2461
|
-
}), [position, refs, elements, context]);
|
|
2462
|
-
}
|
|
2463
|
-
const ACTIVE_KEY = "active";
|
|
2464
|
-
const SELECTED_KEY = "selected";
|
|
2465
|
-
function mergeProps(userProps, propsList, elementKey) {
|
|
2466
|
-
const map = /* @__PURE__ */ new Map();
|
|
2467
|
-
const isItem = elementKey === "item";
|
|
2468
|
-
let domUserProps = userProps;
|
|
2469
|
-
if (isItem && userProps) {
|
|
2470
|
-
const {
|
|
2471
|
-
[ACTIVE_KEY]: _,
|
|
2472
|
-
[SELECTED_KEY]: __,
|
|
2473
|
-
...validProps
|
|
2474
|
-
} = userProps;
|
|
2475
|
-
domUserProps = validProps;
|
|
2476
|
-
}
|
|
2477
|
-
return {
|
|
2478
|
-
...elementKey === "floating" && {
|
|
2479
|
-
tabIndex: -1,
|
|
2480
|
-
[FOCUSABLE_ATTRIBUTE]: ""
|
|
2481
|
-
},
|
|
2482
|
-
...domUserProps,
|
|
2483
|
-
...propsList.map((value) => {
|
|
2484
|
-
const propsOrGetProps = value ? value[elementKey] : null;
|
|
2485
|
-
if (typeof propsOrGetProps === "function") {
|
|
2486
|
-
return userProps ? propsOrGetProps(userProps) : null;
|
|
2487
|
-
}
|
|
2488
|
-
return propsOrGetProps;
|
|
2489
|
-
}).concat(userProps).reduce((acc, props) => {
|
|
2490
|
-
if (!props) {
|
|
2491
|
-
return acc;
|
|
2492
|
-
}
|
|
2493
|
-
Object.entries(props).forEach((_ref) => {
|
|
2494
|
-
let [key, value] = _ref;
|
|
2495
|
-
if (isItem && [ACTIVE_KEY, SELECTED_KEY].includes(key)) {
|
|
2496
|
-
return;
|
|
2497
|
-
}
|
|
2498
|
-
if (key.indexOf("on") === 0) {
|
|
2499
|
-
if (!map.has(key)) {
|
|
2500
|
-
map.set(key, []);
|
|
2501
|
-
}
|
|
2502
|
-
if (typeof value === "function") {
|
|
2503
|
-
var _map$get;
|
|
2504
|
-
(_map$get = map.get(key)) == null || _map$get.push(value);
|
|
2505
|
-
acc[key] = function() {
|
|
2506
|
-
var _map$get2;
|
|
2507
|
-
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
2508
|
-
args[_key] = arguments[_key];
|
|
2509
|
-
}
|
|
2510
|
-
return (_map$get2 = map.get(key)) == null ? void 0 : _map$get2.map((fn) => fn(...args)).find((val) => val !== void 0);
|
|
2511
|
-
};
|
|
2512
|
-
}
|
|
2513
|
-
} else {
|
|
2514
|
-
acc[key] = value;
|
|
2515
|
-
}
|
|
2516
|
-
});
|
|
2517
|
-
return acc;
|
|
2518
|
-
}, {})
|
|
2519
|
-
};
|
|
2520
|
-
}
|
|
2521
|
-
function useInteractions(propsList) {
|
|
2522
|
-
if (propsList === void 0) {
|
|
2523
|
-
propsList = [];
|
|
2524
|
-
}
|
|
2525
|
-
const referenceDeps = propsList.map((key) => key == null ? void 0 : key.reference);
|
|
2526
|
-
const floatingDeps = propsList.map((key) => key == null ? void 0 : key.floating);
|
|
2527
|
-
const itemDeps = propsList.map((key) => key == null ? void 0 : key.item);
|
|
2528
|
-
const getReferenceProps = React__namespace.useCallback(
|
|
2529
|
-
(userProps) => mergeProps(userProps, propsList, "reference"),
|
|
2530
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
2531
|
-
referenceDeps
|
|
2532
|
-
);
|
|
2533
|
-
const getFloatingProps = React__namespace.useCallback(
|
|
2534
|
-
(userProps) => mergeProps(userProps, propsList, "floating"),
|
|
2535
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
2536
|
-
floatingDeps
|
|
2537
|
-
);
|
|
2538
|
-
const getItemProps = React__namespace.useCallback(
|
|
2539
|
-
(userProps) => mergeProps(userProps, propsList, "item"),
|
|
2540
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
2541
|
-
itemDeps
|
|
2542
|
-
);
|
|
2543
|
-
return React__namespace.useMemo(() => ({
|
|
2544
|
-
getReferenceProps,
|
|
2545
|
-
getFloatingProps,
|
|
2546
|
-
getItemProps
|
|
2547
|
-
}), [getReferenceProps, getFloatingProps, getItemProps]);
|
|
2548
|
-
}
|
|
2549
|
-
let isPreventScrollSupported = false;
|
|
2550
|
-
function doSwitch(orientation, vertical, horizontal) {
|
|
2551
|
-
switch (orientation) {
|
|
2552
|
-
case "vertical":
|
|
2553
|
-
return vertical;
|
|
2554
|
-
case "horizontal":
|
|
2555
|
-
return horizontal;
|
|
2556
|
-
default:
|
|
2557
|
-
return vertical || horizontal;
|
|
2558
|
-
}
|
|
2559
|
-
}
|
|
2560
|
-
function isMainOrientationKey(key, orientation) {
|
|
2561
|
-
const vertical = key === ARROW_UP || key === ARROW_DOWN;
|
|
2562
|
-
const horizontal = key === ARROW_LEFT || key === ARROW_RIGHT;
|
|
2563
|
-
return doSwitch(orientation, vertical, horizontal);
|
|
2564
|
-
}
|
|
2565
|
-
function isMainOrientationToEndKey(key, orientation, rtl) {
|
|
2566
|
-
const vertical = key === ARROW_DOWN;
|
|
2567
|
-
const horizontal = rtl ? key === ARROW_LEFT : key === ARROW_RIGHT;
|
|
2568
|
-
return doSwitch(orientation, vertical, horizontal) || key === "Enter" || key === " " || key === "";
|
|
2569
|
-
}
|
|
2570
|
-
function isCrossOrientationOpenKey(key, orientation, rtl) {
|
|
2571
|
-
const vertical = rtl ? key === ARROW_LEFT : key === ARROW_RIGHT;
|
|
2572
|
-
const horizontal = key === ARROW_DOWN;
|
|
2573
|
-
return doSwitch(orientation, vertical, horizontal);
|
|
2574
|
-
}
|
|
2575
|
-
function isCrossOrientationCloseKey(key, orientation, rtl) {
|
|
2576
|
-
const vertical = rtl ? key === ARROW_RIGHT : key === ARROW_LEFT;
|
|
2577
|
-
const horizontal = key === ARROW_UP;
|
|
2578
|
-
return doSwitch(orientation, vertical, horizontal);
|
|
2579
|
-
}
|
|
2580
|
-
function useListNavigation(context, props) {
|
|
2581
|
-
const {
|
|
2582
|
-
open,
|
|
2583
|
-
onOpenChange,
|
|
2584
|
-
elements
|
|
2585
|
-
} = context;
|
|
2586
|
-
const {
|
|
2587
|
-
listRef,
|
|
2588
|
-
activeIndex,
|
|
2589
|
-
onNavigate: unstable_onNavigate = () => {
|
|
2590
|
-
},
|
|
2591
|
-
enabled = true,
|
|
2592
|
-
selectedIndex = null,
|
|
2593
|
-
allowEscape = false,
|
|
2594
|
-
loop = false,
|
|
2595
|
-
nested = false,
|
|
2596
|
-
rtl = false,
|
|
2597
|
-
virtual = false,
|
|
2598
|
-
focusItemOnOpen = "auto",
|
|
2599
|
-
focusItemOnHover = true,
|
|
2600
|
-
openOnArrowKeyDown = true,
|
|
2601
|
-
disabledIndices = void 0,
|
|
2602
|
-
orientation = "vertical",
|
|
2603
|
-
cols = 1,
|
|
2604
|
-
scrollItemIntoView = true,
|
|
2605
|
-
virtualItemRef,
|
|
2606
|
-
itemSizes,
|
|
2607
|
-
dense = false
|
|
2608
|
-
} = props;
|
|
2609
|
-
if (process.env.NODE_ENV !== "production") {
|
|
2610
|
-
if (allowEscape) {
|
|
2611
|
-
if (!loop) {
|
|
2612
|
-
warn("`useListNavigation` looping must be enabled to allow escaping.");
|
|
2613
|
-
}
|
|
2614
|
-
if (!virtual) {
|
|
2615
|
-
warn("`useListNavigation` must be virtual to allow escaping.");
|
|
2616
|
-
}
|
|
2617
|
-
}
|
|
2618
|
-
if (orientation === "vertical" && cols > 1) {
|
|
2619
|
-
warn("In grid list navigation mode (`cols` > 1), the `orientation` should", 'be either "horizontal" or "both".');
|
|
2620
|
-
}
|
|
2621
|
-
}
|
|
2622
|
-
const floatingFocusElement = getFloatingFocusElement(elements.floating);
|
|
2623
|
-
const floatingFocusElementRef = useLatestRef(floatingFocusElement);
|
|
2624
|
-
const parentId = useFloatingParentNodeId();
|
|
2625
|
-
const tree = useFloatingTree();
|
|
2626
|
-
const onNavigate = useEffectEvent(unstable_onNavigate);
|
|
2627
|
-
const typeableComboboxReference = isTypeableCombobox(elements.domReference);
|
|
2628
|
-
const focusItemOnOpenRef = React__namespace.useRef(focusItemOnOpen);
|
|
2629
|
-
const indexRef = React__namespace.useRef(selectedIndex != null ? selectedIndex : -1);
|
|
2630
|
-
const keyRef = React__namespace.useRef(null);
|
|
2631
|
-
const isPointerModalityRef = React__namespace.useRef(true);
|
|
2632
|
-
const previousOnNavigateRef = React__namespace.useRef(onNavigate);
|
|
2633
|
-
const previousMountedRef = React__namespace.useRef(!!elements.floating);
|
|
2634
|
-
const previousOpenRef = React__namespace.useRef(open);
|
|
2635
|
-
const forceSyncFocus = React__namespace.useRef(false);
|
|
2636
|
-
const forceScrollIntoViewRef = React__namespace.useRef(false);
|
|
2637
|
-
const disabledIndicesRef = useLatestRef(disabledIndices);
|
|
2638
|
-
const latestOpenRef = useLatestRef(open);
|
|
2639
|
-
const scrollItemIntoViewRef = useLatestRef(scrollItemIntoView);
|
|
2640
|
-
const selectedIndexRef = useLatestRef(selectedIndex);
|
|
2641
|
-
const [activeId, setActiveId] = React__namespace.useState();
|
|
2642
|
-
const [virtualId, setVirtualId] = React__namespace.useState();
|
|
2643
|
-
const focusItem = useEffectEvent(function(listRef2, indexRef2, forceScrollIntoView) {
|
|
2644
|
-
if (forceScrollIntoView === void 0) {
|
|
2645
|
-
forceScrollIntoView = false;
|
|
2646
|
-
}
|
|
2647
|
-
function runFocus(item2) {
|
|
2648
|
-
if (virtual) {
|
|
2649
|
-
setActiveId(item2.id);
|
|
2650
|
-
tree == null || tree.events.emit("virtualfocus", item2);
|
|
2651
|
-
if (virtualItemRef) {
|
|
2652
|
-
virtualItemRef.current = item2;
|
|
2653
|
-
}
|
|
2654
|
-
} else {
|
|
2655
|
-
enqueueFocus(item2, {
|
|
2656
|
-
preventScroll: true,
|
|
2657
|
-
// Mac Safari does not move the virtual cursor unless the focus call
|
|
2658
|
-
// is sync. However, for the very first focus call, we need to wait
|
|
2659
|
-
// for the position to be ready in order to prevent unwanted
|
|
2660
|
-
// scrolling. This means the virtual cursor will not move to the first
|
|
2661
|
-
// item when first opening the floating element, but will on
|
|
2662
|
-
// subsequent calls. `preventScroll` is supported in modern Safari,
|
|
2663
|
-
// so we can use that instead.
|
|
2664
|
-
// iOS Safari must be async or the first item will not be focused.
|
|
2665
|
-
sync: isMac() && isSafari() ? isPreventScrollSupported || forceSyncFocus.current : false
|
|
2666
|
-
});
|
|
2667
|
-
}
|
|
2668
|
-
}
|
|
2669
|
-
const initialItem = listRef2.current[indexRef2.current];
|
|
2670
|
-
if (initialItem) {
|
|
2671
|
-
runFocus(initialItem);
|
|
2672
|
-
}
|
|
2673
|
-
requestAnimationFrame(() => {
|
|
2674
|
-
const waitedItem = listRef2.current[indexRef2.current] || initialItem;
|
|
2675
|
-
if (!waitedItem) return;
|
|
2676
|
-
if (!initialItem) {
|
|
2677
|
-
runFocus(waitedItem);
|
|
2678
|
-
}
|
|
2679
|
-
const scrollIntoViewOptions = scrollItemIntoViewRef.current;
|
|
2680
|
-
const shouldScrollIntoView = scrollIntoViewOptions && item && (forceScrollIntoView || !isPointerModalityRef.current);
|
|
2681
|
-
if (shouldScrollIntoView) {
|
|
2682
|
-
waitedItem.scrollIntoView == null || waitedItem.scrollIntoView(typeof scrollIntoViewOptions === "boolean" ? {
|
|
2683
|
-
block: "nearest",
|
|
2684
|
-
inline: "nearest"
|
|
2685
|
-
} : scrollIntoViewOptions);
|
|
2686
|
-
}
|
|
2687
|
-
});
|
|
2688
|
-
});
|
|
2689
|
-
index(() => {
|
|
2690
|
-
document.createElement("div").focus({
|
|
2691
|
-
get preventScroll() {
|
|
2692
|
-
isPreventScrollSupported = true;
|
|
2693
|
-
return false;
|
|
2694
|
-
}
|
|
2695
|
-
});
|
|
2696
|
-
}, []);
|
|
2697
|
-
index(() => {
|
|
2698
|
-
if (!enabled) return;
|
|
2699
|
-
if (open && elements.floating) {
|
|
2700
|
-
if (focusItemOnOpenRef.current && selectedIndex != null) {
|
|
2701
|
-
forceScrollIntoViewRef.current = true;
|
|
2702
|
-
indexRef.current = selectedIndex;
|
|
2703
|
-
onNavigate(selectedIndex);
|
|
2704
|
-
}
|
|
2705
|
-
} else if (previousMountedRef.current) {
|
|
2706
|
-
indexRef.current = -1;
|
|
2707
|
-
previousOnNavigateRef.current(null);
|
|
2708
|
-
}
|
|
2709
|
-
}, [enabled, open, elements.floating, selectedIndex, onNavigate]);
|
|
2710
|
-
index(() => {
|
|
2711
|
-
if (!enabled) return;
|
|
2712
|
-
if (open && elements.floating) {
|
|
2713
|
-
if (activeIndex == null) {
|
|
2714
|
-
forceSyncFocus.current = false;
|
|
2715
|
-
if (selectedIndexRef.current != null) {
|
|
2716
|
-
return;
|
|
2717
|
-
}
|
|
2718
|
-
if (previousMountedRef.current) {
|
|
2719
|
-
indexRef.current = -1;
|
|
2720
|
-
focusItem(listRef, indexRef);
|
|
2721
|
-
}
|
|
2722
|
-
if ((!previousOpenRef.current || !previousMountedRef.current) && focusItemOnOpenRef.current && (keyRef.current != null || focusItemOnOpenRef.current === true && keyRef.current == null)) {
|
|
2723
|
-
let runs = 0;
|
|
2724
|
-
const waitForListPopulated = () => {
|
|
2725
|
-
if (listRef.current[0] == null) {
|
|
2726
|
-
if (runs < 2) {
|
|
2727
|
-
const scheduler = runs ? requestAnimationFrame : queueMicrotask;
|
|
2728
|
-
scheduler(waitForListPopulated);
|
|
2729
|
-
}
|
|
2730
|
-
runs++;
|
|
2731
|
-
} else {
|
|
2732
|
-
indexRef.current = keyRef.current == null || isMainOrientationToEndKey(keyRef.current, orientation, rtl) || nested ? getMinIndex(listRef, disabledIndicesRef.current) : getMaxIndex(listRef, disabledIndicesRef.current);
|
|
2733
|
-
keyRef.current = null;
|
|
2734
|
-
onNavigate(indexRef.current);
|
|
2735
|
-
}
|
|
2736
|
-
};
|
|
2737
|
-
waitForListPopulated();
|
|
2738
|
-
}
|
|
2739
|
-
} else if (!isIndexOutOfBounds(listRef, activeIndex)) {
|
|
2740
|
-
indexRef.current = activeIndex;
|
|
2741
|
-
focusItem(listRef, indexRef, forceScrollIntoViewRef.current);
|
|
2742
|
-
forceScrollIntoViewRef.current = false;
|
|
2743
|
-
}
|
|
2744
|
-
}
|
|
2745
|
-
}, [enabled, open, elements.floating, activeIndex, selectedIndexRef, nested, listRef, orientation, rtl, onNavigate, focusItem, disabledIndicesRef]);
|
|
2746
|
-
index(() => {
|
|
2747
|
-
var _nodes$find;
|
|
2748
|
-
if (!enabled || elements.floating || !tree || virtual || !previousMountedRef.current) {
|
|
2749
|
-
return;
|
|
2750
|
-
}
|
|
2751
|
-
const nodes = tree.nodesRef.current;
|
|
2752
|
-
const parent = (_nodes$find = nodes.find((node) => node.id === parentId)) == null || (_nodes$find = _nodes$find.context) == null ? void 0 : _nodes$find.elements.floating;
|
|
2753
|
-
const activeEl = activeElement(getDocument(elements.floating));
|
|
2754
|
-
const treeContainsActiveEl = nodes.some((node) => node.context && contains(node.context.elements.floating, activeEl));
|
|
2755
|
-
if (parent && !treeContainsActiveEl && isPointerModalityRef.current) {
|
|
2756
|
-
parent.focus({
|
|
2757
|
-
preventScroll: true
|
|
2758
|
-
});
|
|
2759
|
-
}
|
|
2760
|
-
}, [enabled, elements.floating, tree, parentId, virtual]);
|
|
2761
|
-
index(() => {
|
|
2762
|
-
if (!enabled) return;
|
|
2763
|
-
if (!tree) return;
|
|
2764
|
-
if (!virtual) return;
|
|
2765
|
-
if (parentId) return;
|
|
2766
|
-
function handleVirtualFocus(item2) {
|
|
2767
|
-
setVirtualId(item2.id);
|
|
2768
|
-
if (virtualItemRef) {
|
|
2769
|
-
virtualItemRef.current = item2;
|
|
2770
|
-
}
|
|
2771
|
-
}
|
|
2772
|
-
tree.events.on("virtualfocus", handleVirtualFocus);
|
|
2773
|
-
return () => {
|
|
2774
|
-
tree.events.off("virtualfocus", handleVirtualFocus);
|
|
2775
|
-
};
|
|
2776
|
-
}, [enabled, tree, virtual, parentId, virtualItemRef]);
|
|
2777
|
-
index(() => {
|
|
2778
|
-
previousOnNavigateRef.current = onNavigate;
|
|
2779
|
-
previousMountedRef.current = !!elements.floating;
|
|
2780
|
-
});
|
|
2781
|
-
index(() => {
|
|
2782
|
-
if (!open) {
|
|
2783
|
-
keyRef.current = null;
|
|
2784
|
-
}
|
|
2785
|
-
}, [open]);
|
|
2786
|
-
index(() => {
|
|
2787
|
-
previousOpenRef.current = open;
|
|
2788
|
-
}, [open]);
|
|
2789
|
-
const hasActiveIndex = activeIndex != null;
|
|
2790
|
-
const item = React__namespace.useMemo(() => {
|
|
2791
|
-
function syncCurrentTarget(currentTarget) {
|
|
2792
|
-
if (!open) return;
|
|
2793
|
-
const index2 = listRef.current.indexOf(currentTarget);
|
|
2794
|
-
if (index2 !== -1) {
|
|
2795
|
-
onNavigate(index2);
|
|
2796
|
-
}
|
|
2797
|
-
}
|
|
2798
|
-
const props2 = {
|
|
2799
|
-
onFocus(_ref) {
|
|
2800
|
-
let {
|
|
2801
|
-
currentTarget
|
|
2802
|
-
} = _ref;
|
|
2803
|
-
syncCurrentTarget(currentTarget);
|
|
2804
|
-
},
|
|
2805
|
-
onClick: (_ref2) => {
|
|
2806
|
-
let {
|
|
2807
|
-
currentTarget
|
|
2808
|
-
} = _ref2;
|
|
2809
|
-
return currentTarget.focus({
|
|
2810
|
-
preventScroll: true
|
|
2811
|
-
});
|
|
2812
|
-
},
|
|
2813
|
-
// Safari
|
|
2814
|
-
...focusItemOnHover && {
|
|
2815
|
-
onMouseMove(_ref3) {
|
|
2816
|
-
let {
|
|
2817
|
-
currentTarget
|
|
2818
|
-
} = _ref3;
|
|
2819
|
-
syncCurrentTarget(currentTarget);
|
|
2820
|
-
},
|
|
2821
|
-
onPointerLeave(_ref4) {
|
|
2822
|
-
let {
|
|
2823
|
-
pointerType
|
|
2824
|
-
} = _ref4;
|
|
2825
|
-
if (!isPointerModalityRef.current || pointerType === "touch") {
|
|
2826
|
-
return;
|
|
2827
|
-
}
|
|
2828
|
-
indexRef.current = -1;
|
|
2829
|
-
focusItem(listRef, indexRef);
|
|
2830
|
-
onNavigate(null);
|
|
2831
|
-
if (!virtual) {
|
|
2832
|
-
enqueueFocus(floatingFocusElementRef.current, {
|
|
2833
|
-
preventScroll: true
|
|
2834
|
-
});
|
|
2835
|
-
}
|
|
2836
|
-
}
|
|
2837
|
-
}
|
|
2838
|
-
};
|
|
2839
|
-
return props2;
|
|
2840
|
-
}, [open, floatingFocusElementRef, focusItem, focusItemOnHover, listRef, onNavigate, virtual]);
|
|
2841
|
-
const commonOnKeyDown = useEffectEvent((event) => {
|
|
2842
|
-
isPointerModalityRef.current = false;
|
|
2843
|
-
forceSyncFocus.current = true;
|
|
2844
|
-
if (event.which === 229) {
|
|
2845
|
-
return;
|
|
2846
|
-
}
|
|
2847
|
-
if (!latestOpenRef.current && event.currentTarget === floatingFocusElementRef.current) {
|
|
2848
|
-
return;
|
|
2849
|
-
}
|
|
2850
|
-
if (nested && isCrossOrientationCloseKey(event.key, orientation, rtl)) {
|
|
2851
|
-
stopEvent(event);
|
|
2852
|
-
onOpenChange(false, event.nativeEvent, "list-navigation");
|
|
2853
|
-
if (isHTMLElement(elements.domReference)) {
|
|
2854
|
-
if (virtual) {
|
|
2855
|
-
tree == null || tree.events.emit("virtualfocus", elements.domReference);
|
|
2856
|
-
} else {
|
|
2857
|
-
elements.domReference.focus();
|
|
2858
|
-
}
|
|
2859
|
-
}
|
|
2860
|
-
return;
|
|
2861
|
-
}
|
|
2862
|
-
const currentIndex = indexRef.current;
|
|
2863
|
-
const minIndex = getMinIndex(listRef, disabledIndices);
|
|
2864
|
-
const maxIndex = getMaxIndex(listRef, disabledIndices);
|
|
2865
|
-
if (!typeableComboboxReference) {
|
|
2866
|
-
if (event.key === "Home") {
|
|
2867
|
-
stopEvent(event);
|
|
2868
|
-
indexRef.current = minIndex;
|
|
2869
|
-
onNavigate(indexRef.current);
|
|
2870
|
-
}
|
|
2871
|
-
if (event.key === "End") {
|
|
2872
|
-
stopEvent(event);
|
|
2873
|
-
indexRef.current = maxIndex;
|
|
2874
|
-
onNavigate(indexRef.current);
|
|
2875
|
-
}
|
|
2876
|
-
}
|
|
2877
|
-
if (cols > 1) {
|
|
2878
|
-
const sizes = itemSizes || Array.from({
|
|
2879
|
-
length: listRef.current.length
|
|
2880
|
-
}, () => ({
|
|
2881
|
-
width: 1,
|
|
2882
|
-
height: 1
|
|
2883
|
-
}));
|
|
2884
|
-
const cellMap = buildCellMap(sizes, cols, dense);
|
|
2885
|
-
const minGridIndex = cellMap.findIndex((index3) => index3 != null && !isDisabled(listRef.current, index3, disabledIndices));
|
|
2886
|
-
const maxGridIndex = cellMap.reduce((foundIndex, index3, cellIndex) => index3 != null && !isDisabled(listRef.current, index3, disabledIndices) ? cellIndex : foundIndex, -1);
|
|
2887
|
-
const index2 = cellMap[getGridNavigatedIndex({
|
|
2888
|
-
current: cellMap.map((itemIndex) => itemIndex != null ? listRef.current[itemIndex] : null)
|
|
2889
|
-
}, {
|
|
2890
|
-
event,
|
|
2891
|
-
orientation,
|
|
2892
|
-
loop,
|
|
2893
|
-
rtl,
|
|
2894
|
-
cols,
|
|
2895
|
-
// treat undefined (empty grid spaces) as disabled indices so we
|
|
2896
|
-
// don't end up in them
|
|
2897
|
-
disabledIndices: getCellIndices([...disabledIndices || listRef.current.map((_, index3) => isDisabled(listRef.current, index3) ? index3 : void 0), void 0], cellMap),
|
|
2898
|
-
minIndex: minGridIndex,
|
|
2899
|
-
maxIndex: maxGridIndex,
|
|
2900
|
-
prevIndex: getCellIndexOfCorner(
|
|
2901
|
-
indexRef.current > maxIndex ? minIndex : indexRef.current,
|
|
2902
|
-
sizes,
|
|
2903
|
-
cellMap,
|
|
2904
|
-
cols,
|
|
2905
|
-
// use a corner matching the edge closest to the direction
|
|
2906
|
-
// we're moving in so we don't end up in the same item. Prefer
|
|
2907
|
-
// top/left over bottom/right.
|
|
2908
|
-
event.key === ARROW_DOWN ? "bl" : event.key === (rtl ? ARROW_LEFT : ARROW_RIGHT) ? "tr" : "tl"
|
|
2909
|
-
),
|
|
2910
|
-
stopEvent: true
|
|
2911
|
-
})];
|
|
2912
|
-
if (index2 != null) {
|
|
2913
|
-
indexRef.current = index2;
|
|
2914
|
-
onNavigate(indexRef.current);
|
|
2915
|
-
}
|
|
2916
|
-
if (orientation === "both") {
|
|
2917
|
-
return;
|
|
2918
|
-
}
|
|
2919
|
-
}
|
|
2920
|
-
if (isMainOrientationKey(event.key, orientation)) {
|
|
2921
|
-
stopEvent(event);
|
|
2922
|
-
if (open && !virtual && activeElement(event.currentTarget.ownerDocument) === event.currentTarget) {
|
|
2923
|
-
indexRef.current = isMainOrientationToEndKey(event.key, orientation, rtl) ? minIndex : maxIndex;
|
|
2924
|
-
onNavigate(indexRef.current);
|
|
2925
|
-
return;
|
|
2926
|
-
}
|
|
2927
|
-
if (isMainOrientationToEndKey(event.key, orientation, rtl)) {
|
|
2928
|
-
if (loop) {
|
|
2929
|
-
indexRef.current = currentIndex >= maxIndex ? allowEscape && currentIndex !== listRef.current.length ? -1 : minIndex : findNonDisabledIndex(listRef, {
|
|
2930
|
-
startingIndex: currentIndex,
|
|
2931
|
-
disabledIndices
|
|
2932
|
-
});
|
|
2933
|
-
} else {
|
|
2934
|
-
indexRef.current = Math.min(maxIndex, findNonDisabledIndex(listRef, {
|
|
2935
|
-
startingIndex: currentIndex,
|
|
2936
|
-
disabledIndices
|
|
2937
|
-
}));
|
|
2938
|
-
}
|
|
2939
|
-
} else {
|
|
2940
|
-
if (loop) {
|
|
2941
|
-
indexRef.current = currentIndex <= minIndex ? allowEscape && currentIndex !== -1 ? listRef.current.length : maxIndex : findNonDisabledIndex(listRef, {
|
|
2942
|
-
startingIndex: currentIndex,
|
|
2943
|
-
decrement: true,
|
|
2944
|
-
disabledIndices
|
|
2945
|
-
});
|
|
2946
|
-
} else {
|
|
2947
|
-
indexRef.current = Math.max(minIndex, findNonDisabledIndex(listRef, {
|
|
2948
|
-
startingIndex: currentIndex,
|
|
2949
|
-
decrement: true,
|
|
2950
|
-
disabledIndices
|
|
2951
|
-
}));
|
|
2952
|
-
}
|
|
2953
|
-
}
|
|
2954
|
-
if (isIndexOutOfBounds(listRef, indexRef.current)) {
|
|
2955
|
-
onNavigate(null);
|
|
2956
|
-
} else {
|
|
2957
|
-
onNavigate(indexRef.current);
|
|
2958
|
-
}
|
|
2959
|
-
}
|
|
2960
|
-
});
|
|
2961
|
-
const ariaActiveDescendantProp = React__namespace.useMemo(() => {
|
|
2962
|
-
return virtual && open && hasActiveIndex && {
|
|
2963
|
-
"aria-activedescendant": virtualId || activeId
|
|
2964
|
-
};
|
|
2965
|
-
}, [virtual, open, hasActiveIndex, virtualId, activeId]);
|
|
2966
|
-
const floating = React__namespace.useMemo(() => {
|
|
2967
|
-
return {
|
|
2968
|
-
"aria-orientation": orientation === "both" ? void 0 : orientation,
|
|
2969
|
-
...!isTypeableCombobox(elements.domReference) && ariaActiveDescendantProp,
|
|
2970
|
-
onKeyDown: commonOnKeyDown,
|
|
2971
|
-
onPointerMove() {
|
|
2972
|
-
isPointerModalityRef.current = true;
|
|
2973
|
-
}
|
|
2974
|
-
};
|
|
2975
|
-
}, [ariaActiveDescendantProp, commonOnKeyDown, elements.domReference, orientation]);
|
|
2976
|
-
const reference = React__namespace.useMemo(() => {
|
|
2977
|
-
function checkVirtualMouse(event) {
|
|
2978
|
-
if (focusItemOnOpen === "auto" && isVirtualClick(event.nativeEvent)) {
|
|
2979
|
-
focusItemOnOpenRef.current = true;
|
|
2980
|
-
}
|
|
2981
|
-
}
|
|
2982
|
-
function checkVirtualPointer(event) {
|
|
2983
|
-
focusItemOnOpenRef.current = focusItemOnOpen;
|
|
2984
|
-
if (focusItemOnOpen === "auto" && isVirtualPointerEvent(event.nativeEvent)) {
|
|
2985
|
-
focusItemOnOpenRef.current = true;
|
|
2986
|
-
}
|
|
2987
|
-
}
|
|
2988
|
-
return {
|
|
2989
|
-
...ariaActiveDescendantProp,
|
|
2990
|
-
onKeyDown(event) {
|
|
2991
|
-
isPointerModalityRef.current = false;
|
|
2992
|
-
const isArrowKey = event.key.startsWith("Arrow");
|
|
2993
|
-
const isHomeOrEndKey = ["Home", "End"].includes(event.key);
|
|
2994
|
-
const isMoveKey = isArrowKey || isHomeOrEndKey;
|
|
2995
|
-
const isCrossOpenKey = isCrossOrientationOpenKey(event.key, orientation, rtl);
|
|
2996
|
-
const isCrossCloseKey = isCrossOrientationCloseKey(event.key, orientation, rtl);
|
|
2997
|
-
const isMainKey = isMainOrientationKey(event.key, orientation);
|
|
2998
|
-
const isNavigationKey = (nested ? isCrossOpenKey : isMainKey) || event.key === "Enter" || event.key.trim() === "";
|
|
2999
|
-
if (virtual && open) {
|
|
3000
|
-
const rootNode = tree == null ? void 0 : tree.nodesRef.current.find((node) => node.parentId == null);
|
|
3001
|
-
const deepestNode = tree && rootNode ? getDeepestNode(tree.nodesRef.current, rootNode.id) : null;
|
|
3002
|
-
if (isMoveKey && deepestNode && virtualItemRef) {
|
|
3003
|
-
const eventObject = new KeyboardEvent("keydown", {
|
|
3004
|
-
key: event.key,
|
|
3005
|
-
bubbles: true
|
|
3006
|
-
});
|
|
3007
|
-
if (isCrossOpenKey || isCrossCloseKey) {
|
|
3008
|
-
var _deepestNode$context, _deepestNode$context2;
|
|
3009
|
-
const isCurrentTarget = ((_deepestNode$context = deepestNode.context) == null ? void 0 : _deepestNode$context.elements.domReference) === event.currentTarget;
|
|
3010
|
-
const dispatchItem = isCrossCloseKey && !isCurrentTarget ? (_deepestNode$context2 = deepestNode.context) == null ? void 0 : _deepestNode$context2.elements.domReference : isCrossOpenKey ? listRef.current.find((item2) => (item2 == null ? void 0 : item2.id) === activeId) : null;
|
|
3011
|
-
if (dispatchItem) {
|
|
3012
|
-
stopEvent(event);
|
|
3013
|
-
dispatchItem.dispatchEvent(eventObject);
|
|
3014
|
-
setVirtualId(void 0);
|
|
3015
|
-
}
|
|
3016
|
-
}
|
|
3017
|
-
if ((isMainKey || isHomeOrEndKey) && deepestNode.context) {
|
|
3018
|
-
if (deepestNode.context.open && deepestNode.parentId && event.currentTarget !== deepestNode.context.elements.domReference) {
|
|
3019
|
-
var _deepestNode$context$;
|
|
3020
|
-
stopEvent(event);
|
|
3021
|
-
(_deepestNode$context$ = deepestNode.context.elements.domReference) == null || _deepestNode$context$.dispatchEvent(eventObject);
|
|
3022
|
-
return;
|
|
3023
|
-
}
|
|
3024
|
-
}
|
|
3025
|
-
}
|
|
3026
|
-
return commonOnKeyDown(event);
|
|
3027
|
-
}
|
|
3028
|
-
if (!open && !openOnArrowKeyDown && isArrowKey) {
|
|
3029
|
-
return;
|
|
3030
|
-
}
|
|
3031
|
-
if (isNavigationKey) {
|
|
3032
|
-
keyRef.current = nested && isMainKey ? null : event.key;
|
|
3033
|
-
}
|
|
3034
|
-
if (nested) {
|
|
3035
|
-
if (isCrossOpenKey) {
|
|
3036
|
-
stopEvent(event);
|
|
3037
|
-
if (open) {
|
|
3038
|
-
indexRef.current = getMinIndex(listRef, disabledIndicesRef.current);
|
|
3039
|
-
onNavigate(indexRef.current);
|
|
3040
|
-
} else {
|
|
3041
|
-
onOpenChange(true, event.nativeEvent, "list-navigation");
|
|
3042
|
-
}
|
|
3043
|
-
}
|
|
3044
|
-
return;
|
|
3045
|
-
}
|
|
3046
|
-
if (isMainKey) {
|
|
3047
|
-
if (selectedIndex != null) {
|
|
3048
|
-
indexRef.current = selectedIndex;
|
|
3049
|
-
}
|
|
3050
|
-
stopEvent(event);
|
|
3051
|
-
if (!open && openOnArrowKeyDown) {
|
|
3052
|
-
onOpenChange(true, event.nativeEvent, "list-navigation");
|
|
3053
|
-
} else {
|
|
3054
|
-
commonOnKeyDown(event);
|
|
3055
|
-
}
|
|
3056
|
-
if (open) {
|
|
3057
|
-
onNavigate(indexRef.current);
|
|
3058
|
-
}
|
|
3059
|
-
}
|
|
3060
|
-
},
|
|
3061
|
-
onFocus() {
|
|
3062
|
-
if (open && !virtual) {
|
|
3063
|
-
onNavigate(null);
|
|
3064
|
-
}
|
|
3065
|
-
},
|
|
3066
|
-
onPointerDown: checkVirtualPointer,
|
|
3067
|
-
onMouseDown: checkVirtualMouse,
|
|
3068
|
-
onClick: checkVirtualMouse
|
|
3069
|
-
};
|
|
3070
|
-
}, [activeId, ariaActiveDescendantProp, commonOnKeyDown, disabledIndicesRef, focusItemOnOpen, listRef, nested, onNavigate, onOpenChange, open, openOnArrowKeyDown, orientation, rtl, selectedIndex, tree, virtual, virtualItemRef]);
|
|
3071
|
-
return React__namespace.useMemo(() => enabled ? {
|
|
3072
|
-
reference,
|
|
3073
|
-
floating,
|
|
3074
|
-
item
|
|
3075
|
-
} : {}, [enabled, reference, floating, item]);
|
|
3076
|
-
}
|
|
3077
|
-
const componentRoleToAriaRoleMap = /* @__PURE__ */ new Map([["select", "listbox"], ["combobox", "listbox"], ["label", false]]);
|
|
3078
|
-
function useRole(context, props) {
|
|
3079
|
-
var _componentRoleToAriaR;
|
|
3080
|
-
if (props === void 0) {
|
|
3081
|
-
props = {};
|
|
3082
|
-
}
|
|
3083
|
-
const {
|
|
3084
|
-
open,
|
|
3085
|
-
floatingId
|
|
3086
|
-
} = context;
|
|
3087
|
-
const {
|
|
3088
|
-
enabled = true,
|
|
3089
|
-
role = "dialog"
|
|
3090
|
-
} = props;
|
|
3091
|
-
const ariaRole = (_componentRoleToAriaR = componentRoleToAriaRoleMap.get(role)) != null ? _componentRoleToAriaR : role;
|
|
3092
|
-
const referenceId = useId();
|
|
3093
|
-
const parentId = useFloatingParentNodeId();
|
|
3094
|
-
const isNested = parentId != null;
|
|
3095
|
-
const reference = React__namespace.useMemo(() => {
|
|
3096
|
-
if (ariaRole === "tooltip" || role === "label") {
|
|
3097
|
-
return {
|
|
3098
|
-
["aria-" + (role === "label" ? "labelledby" : "describedby")]: open ? floatingId : void 0
|
|
3099
|
-
};
|
|
3100
|
-
}
|
|
3101
|
-
return {
|
|
3102
|
-
"aria-expanded": open ? "true" : "false",
|
|
3103
|
-
"aria-haspopup": ariaRole === "alertdialog" ? "dialog" : ariaRole,
|
|
3104
|
-
"aria-controls": open ? floatingId : void 0,
|
|
3105
|
-
...ariaRole === "listbox" && {
|
|
3106
|
-
role: "combobox"
|
|
3107
|
-
},
|
|
3108
|
-
...ariaRole === "menu" && {
|
|
3109
|
-
id: referenceId
|
|
3110
|
-
},
|
|
3111
|
-
...ariaRole === "menu" && isNested && {
|
|
3112
|
-
role: "menuitem"
|
|
3113
|
-
},
|
|
3114
|
-
...role === "select" && {
|
|
3115
|
-
"aria-autocomplete": "none"
|
|
3116
|
-
},
|
|
3117
|
-
...role === "combobox" && {
|
|
3118
|
-
"aria-autocomplete": "list"
|
|
3119
|
-
}
|
|
3120
|
-
};
|
|
3121
|
-
}, [ariaRole, floatingId, isNested, open, referenceId, role]);
|
|
3122
|
-
const floating = React__namespace.useMemo(() => {
|
|
3123
|
-
const floatingProps = {
|
|
3124
|
-
id: floatingId,
|
|
3125
|
-
...ariaRole && {
|
|
3126
|
-
role: ariaRole
|
|
3127
|
-
}
|
|
3128
|
-
};
|
|
3129
|
-
if (ariaRole === "tooltip" || role === "label") {
|
|
3130
|
-
return floatingProps;
|
|
3131
|
-
}
|
|
3132
|
-
return {
|
|
3133
|
-
...floatingProps,
|
|
3134
|
-
...ariaRole === "menu" && {
|
|
3135
|
-
"aria-labelledby": referenceId
|
|
3136
|
-
}
|
|
3137
|
-
};
|
|
3138
|
-
}, [ariaRole, floatingId, referenceId, role]);
|
|
3139
|
-
const item = React__namespace.useCallback((_ref) => {
|
|
3140
|
-
let {
|
|
3141
|
-
active,
|
|
3142
|
-
selected
|
|
3143
|
-
} = _ref;
|
|
3144
|
-
const commonProps = {
|
|
3145
|
-
role: "option",
|
|
3146
|
-
...active && {
|
|
3147
|
-
id: floatingId + "-option"
|
|
3148
|
-
}
|
|
3149
|
-
};
|
|
3150
|
-
switch (role) {
|
|
3151
|
-
case "select":
|
|
3152
|
-
return {
|
|
3153
|
-
...commonProps,
|
|
3154
|
-
"aria-selected": active && selected
|
|
3155
|
-
};
|
|
3156
|
-
case "combobox": {
|
|
3157
|
-
return {
|
|
3158
|
-
...commonProps,
|
|
3159
|
-
...active && {
|
|
3160
|
-
"aria-selected": true
|
|
3161
|
-
}
|
|
3162
|
-
};
|
|
3163
|
-
}
|
|
3164
|
-
}
|
|
3165
|
-
return {};
|
|
3166
|
-
}, [floatingId, role]);
|
|
3167
|
-
return React__namespace.useMemo(() => enabled ? {
|
|
3168
|
-
reference,
|
|
3169
|
-
floating,
|
|
3170
|
-
item
|
|
3171
|
-
} : {}, [enabled, reference, floating, item]);
|
|
3172
|
-
}
|
|
3173
|
-
function useTypeahead(context, props) {
|
|
3174
|
-
var _ref;
|
|
3175
|
-
const {
|
|
3176
|
-
open,
|
|
3177
|
-
dataRef
|
|
3178
|
-
} = context;
|
|
3179
|
-
const {
|
|
3180
|
-
listRef,
|
|
3181
|
-
activeIndex,
|
|
3182
|
-
onMatch: unstable_onMatch,
|
|
3183
|
-
onTypingChange: unstable_onTypingChange,
|
|
3184
|
-
enabled = true,
|
|
3185
|
-
findMatch = null,
|
|
3186
|
-
resetMs = 750,
|
|
3187
|
-
ignoreKeys = [],
|
|
3188
|
-
selectedIndex = null
|
|
3189
|
-
} = props;
|
|
3190
|
-
const timeoutIdRef = React__namespace.useRef();
|
|
3191
|
-
const stringRef = React__namespace.useRef("");
|
|
3192
|
-
const prevIndexRef = React__namespace.useRef((_ref = selectedIndex != null ? selectedIndex : activeIndex) != null ? _ref : -1);
|
|
3193
|
-
const matchIndexRef = React__namespace.useRef(null);
|
|
3194
|
-
const onMatch = useEffectEvent(unstable_onMatch);
|
|
3195
|
-
const onTypingChange = useEffectEvent(unstable_onTypingChange);
|
|
3196
|
-
const findMatchRef = useLatestRef(findMatch);
|
|
3197
|
-
const ignoreKeysRef = useLatestRef(ignoreKeys);
|
|
3198
|
-
index(() => {
|
|
3199
|
-
if (open) {
|
|
3200
|
-
clearTimeout(timeoutIdRef.current);
|
|
3201
|
-
matchIndexRef.current = null;
|
|
3202
|
-
stringRef.current = "";
|
|
3203
|
-
}
|
|
3204
|
-
}, [open]);
|
|
3205
|
-
index(() => {
|
|
3206
|
-
if (open && stringRef.current === "") {
|
|
3207
|
-
var _ref2;
|
|
3208
|
-
prevIndexRef.current = (_ref2 = selectedIndex != null ? selectedIndex : activeIndex) != null ? _ref2 : -1;
|
|
3209
|
-
}
|
|
3210
|
-
}, [open, selectedIndex, activeIndex]);
|
|
3211
|
-
const setTypingChange = useEffectEvent((value) => {
|
|
3212
|
-
if (value) {
|
|
3213
|
-
if (!dataRef.current.typing) {
|
|
3214
|
-
dataRef.current.typing = value;
|
|
3215
|
-
onTypingChange(value);
|
|
3216
|
-
}
|
|
3217
|
-
} else {
|
|
3218
|
-
if (dataRef.current.typing) {
|
|
3219
|
-
dataRef.current.typing = value;
|
|
3220
|
-
onTypingChange(value);
|
|
3221
|
-
}
|
|
3222
|
-
}
|
|
3223
|
-
});
|
|
3224
|
-
const onKeyDown = useEffectEvent((event) => {
|
|
3225
|
-
function getMatchingIndex(list, orderedList, string) {
|
|
3226
|
-
const str = findMatchRef.current ? findMatchRef.current(orderedList, string) : orderedList.find((text) => (text == null ? void 0 : text.toLocaleLowerCase().indexOf(string.toLocaleLowerCase())) === 0);
|
|
3227
|
-
return str ? list.indexOf(str) : -1;
|
|
3228
|
-
}
|
|
3229
|
-
const listContent = listRef.current;
|
|
3230
|
-
if (stringRef.current.length > 0 && stringRef.current[0] !== " ") {
|
|
3231
|
-
if (getMatchingIndex(listContent, listContent, stringRef.current) === -1) {
|
|
3232
|
-
setTypingChange(false);
|
|
3233
|
-
} else if (event.key === " ") {
|
|
3234
|
-
stopEvent(event);
|
|
3235
|
-
}
|
|
3236
|
-
}
|
|
3237
|
-
if (listContent == null || ignoreKeysRef.current.includes(event.key) || // Character key.
|
|
3238
|
-
event.key.length !== 1 || // Modifier key.
|
|
3239
|
-
event.ctrlKey || event.metaKey || event.altKey) {
|
|
3240
|
-
return;
|
|
3241
|
-
}
|
|
3242
|
-
if (open && event.key !== " ") {
|
|
3243
|
-
stopEvent(event);
|
|
3244
|
-
setTypingChange(true);
|
|
3245
|
-
}
|
|
3246
|
-
const allowRapidSuccessionOfFirstLetter = listContent.every((text) => {
|
|
3247
|
-
var _text$, _text$2;
|
|
3248
|
-
return text ? ((_text$ = text[0]) == null ? void 0 : _text$.toLocaleLowerCase()) !== ((_text$2 = text[1]) == null ? void 0 : _text$2.toLocaleLowerCase()) : true;
|
|
3249
|
-
});
|
|
3250
|
-
if (allowRapidSuccessionOfFirstLetter && stringRef.current === event.key) {
|
|
3251
|
-
stringRef.current = "";
|
|
3252
|
-
prevIndexRef.current = matchIndexRef.current;
|
|
3253
|
-
}
|
|
3254
|
-
stringRef.current += event.key;
|
|
3255
|
-
clearTimeout(timeoutIdRef.current);
|
|
3256
|
-
timeoutIdRef.current = setTimeout(() => {
|
|
3257
|
-
stringRef.current = "";
|
|
3258
|
-
prevIndexRef.current = matchIndexRef.current;
|
|
3259
|
-
setTypingChange(false);
|
|
3260
|
-
}, resetMs);
|
|
3261
|
-
const prevIndex = prevIndexRef.current;
|
|
3262
|
-
const index2 = getMatchingIndex(listContent, [...listContent.slice((prevIndex || 0) + 1), ...listContent.slice(0, (prevIndex || 0) + 1)], stringRef.current);
|
|
3263
|
-
if (index2 !== -1) {
|
|
3264
|
-
onMatch(index2);
|
|
3265
|
-
matchIndexRef.current = index2;
|
|
3266
|
-
} else if (event.key !== " ") {
|
|
3267
|
-
stringRef.current = "";
|
|
3268
|
-
setTypingChange(false);
|
|
3269
|
-
}
|
|
3270
|
-
});
|
|
3271
|
-
const reference = React__namespace.useMemo(() => ({
|
|
3272
|
-
onKeyDown
|
|
3273
|
-
}), [onKeyDown]);
|
|
3274
|
-
const floating = React__namespace.useMemo(() => {
|
|
3275
|
-
return {
|
|
3276
|
-
onKeyDown,
|
|
3277
|
-
onKeyUp(event) {
|
|
3278
|
-
if (event.key === " ") {
|
|
3279
|
-
setTypingChange(false);
|
|
3280
|
-
}
|
|
3281
|
-
}
|
|
3282
|
-
};
|
|
3283
|
-
}, [onKeyDown, setTypingChange]);
|
|
3284
|
-
return React__namespace.useMemo(() => enabled ? {
|
|
3285
|
-
reference,
|
|
3286
|
-
floating
|
|
3287
|
-
} : {}, [enabled, reference, floating]);
|
|
3288
|
-
}
|
|
3289
128
|
const SelectContext = React.createContext(
|
|
3290
129
|
{}
|
|
3291
130
|
);
|
|
@@ -3302,7 +141,7 @@ const OverflowMenu = ({
|
|
|
3302
141
|
const [activeIndex, setActiveIndex] = React.useState(null);
|
|
3303
142
|
const listRef = React.useRef([]);
|
|
3304
143
|
const labelsRef = React.useRef([]);
|
|
3305
|
-
const { refs, floatingStyles, context, elements, update } = useFloating({
|
|
144
|
+
const { refs, floatingStyles, context, elements, update } = react.useFloating({
|
|
3306
145
|
placement: tooltip.standardisePlacement(
|
|
3307
146
|
// check for left is added for backwards compatibility
|
|
3308
147
|
rest.position === "left" ? "bottom-end" : placement
|
|
@@ -3310,29 +149,29 @@ const OverflowMenu = ({
|
|
|
3310
149
|
open: isOpen,
|
|
3311
150
|
onOpenChange: setIsOpen,
|
|
3312
151
|
middleware: [
|
|
3313
|
-
offset(tokens.space.extraSmall2),
|
|
3314
|
-
flip(),
|
|
3315
|
-
shift({ padding: tokens.space.extraSmall })
|
|
152
|
+
react.offset(tokens.space.extraSmall2),
|
|
153
|
+
react.flip(),
|
|
154
|
+
react.shift({ padding: tokens.space.extraSmall })
|
|
3316
155
|
]
|
|
3317
156
|
});
|
|
3318
157
|
React.useEffect(() => {
|
|
3319
158
|
if (isOpen && elements.reference && elements.floating) {
|
|
3320
|
-
const cleanup = autoUpdate(elements.reference, elements.floating, update);
|
|
159
|
+
const cleanup = react.autoUpdate(elements.reference, elements.floating, update);
|
|
3321
160
|
return cleanup;
|
|
3322
161
|
}
|
|
3323
162
|
}, [isOpen, elements, update]);
|
|
3324
|
-
const listNav = useListNavigation(context, {
|
|
163
|
+
const listNav = react.useListNavigation(context, {
|
|
3325
164
|
listRef,
|
|
3326
165
|
activeIndex,
|
|
3327
166
|
onNavigate: setActiveIndex
|
|
3328
167
|
});
|
|
3329
|
-
const typeahead = useTypeahead(context, {
|
|
168
|
+
const typeahead = react.useTypeahead(context, {
|
|
3330
169
|
listRef: labelsRef,
|
|
3331
170
|
activeIndex,
|
|
3332
|
-
onMatch: (
|
|
171
|
+
onMatch: (index) => isOpen && setActiveIndex(index)
|
|
3333
172
|
});
|
|
3334
|
-
const role = useRole(context, { role: "menu" });
|
|
3335
|
-
const { getReferenceProps, getFloatingProps, getItemProps } = useInteractions(
|
|
173
|
+
const role = react.useRole(context, { role: "menu" });
|
|
174
|
+
const { getReferenceProps, getFloatingProps, getItemProps } = react.useInteractions(
|
|
3336
175
|
[listNav, typeahead, role]
|
|
3337
176
|
);
|
|
3338
177
|
const closeMenuAndReturnFocus = () => {
|
|
@@ -3383,7 +222,7 @@ const OverflowMenu = ({
|
|
|
3383
222
|
...getFloatingProps({
|
|
3384
223
|
className: "eds-overflow-menu__menu-list"
|
|
3385
224
|
}),
|
|
3386
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(FloatingList, { elementsRef: listRef, labelsRef, children })
|
|
225
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(react.FloatingList, { elementsRef: listRef, labelsRef, children })
|
|
3387
226
|
}
|
|
3388
227
|
) })
|
|
3389
228
|
] });
|
|
@@ -3398,14 +237,14 @@ const OverflowMenuItem = ({
|
|
|
3398
237
|
...rest
|
|
3399
238
|
}) => {
|
|
3400
239
|
const { activeIndex, getItemProps, closeMenuAndReturnFocus } = React.useContext(SelectContext);
|
|
3401
|
-
const { ref: listItemRef, index
|
|
240
|
+
const { ref: listItemRef, index } = react.useListItem({
|
|
3402
241
|
label: !disabled ? utils.getNodeText(children) : null
|
|
3403
242
|
});
|
|
3404
|
-
const isHighlighted = activeIndex ===
|
|
243
|
+
const isHighlighted = activeIndex === index;
|
|
3405
244
|
const isLink = href !== void 0;
|
|
3406
|
-
const
|
|
245
|
+
const Element = as ?? (isLink ? "a" : "button");
|
|
3407
246
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3408
|
-
|
|
247
|
+
Element,
|
|
3409
248
|
{
|
|
3410
249
|
ref: listItemRef,
|
|
3411
250
|
className: classNames(
|
|
@@ -3417,7 +256,7 @@ const OverflowMenuItem = ({
|
|
|
3417
256
|
className
|
|
3418
257
|
),
|
|
3419
258
|
role: "menuitem",
|
|
3420
|
-
type:
|
|
259
|
+
type: Element === "button" ? "button" : void 0,
|
|
3421
260
|
"aria-disabled": disabled,
|
|
3422
261
|
"aria-selected": isHighlighted,
|
|
3423
262
|
...getItemProps({
|
|
@@ -3635,7 +474,7 @@ const Pagination = ({
|
|
|
3635
474
|
}
|
|
3636
475
|
),
|
|
3637
476
|
listedEntries.map(
|
|
3638
|
-
(entry,
|
|
477
|
+
(entry, index) => entry === "…" ? /* @__PURE__ */ jsxRuntime.jsx(Ellipsis, {}, `ellipsis-${index}`) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
3639
478
|
PaginationPage,
|
|
3640
479
|
{
|
|
3641
480
|
selected: entry === currentPage,
|
|
@@ -3744,12 +583,12 @@ const BaseSideNavigationItem = React.forwardRef(
|
|
|
3744
583
|
as,
|
|
3745
584
|
...rest
|
|
3746
585
|
}, ref) => {
|
|
3747
|
-
const
|
|
586
|
+
const Element = as || defaultElementBaseItem;
|
|
3748
587
|
const { isCollapsed } = useSideNavigationContext();
|
|
3749
588
|
const [showLabel] = useShowDelayedLabel(isCollapsed);
|
|
3750
589
|
return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: classNames("eds-side-navigation__item", className), children: [
|
|
3751
590
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
3752
|
-
|
|
591
|
+
Element,
|
|
3753
592
|
{
|
|
3754
593
|
className: classNames("eds-side-navigation__click-target", {
|
|
3755
594
|
"eds-side-navigation__click-target--active": active
|
|
@@ -3790,7 +629,7 @@ const SideNavigationItem = React.forwardRef(
|
|
|
3790
629
|
as,
|
|
3791
630
|
...rest
|
|
3792
631
|
}, ref) => {
|
|
3793
|
-
const
|
|
632
|
+
const Element = as || defaultElementItem;
|
|
3794
633
|
const childrenArray = React.Children.toArray(children);
|
|
3795
634
|
const subMenu = childrenArray.find(
|
|
3796
635
|
(child) => child && child.type && child.type.__IS_ENTUR_MENU__
|
|
@@ -3803,7 +642,7 @@ const SideNavigationItem = React.forwardRef(
|
|
|
3803
642
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3804
643
|
BaseSideNavigationItem,
|
|
3805
644
|
{
|
|
3806
|
-
as:
|
|
645
|
+
as: Element,
|
|
3807
646
|
active,
|
|
3808
647
|
ref,
|
|
3809
648
|
...rest,
|
|
@@ -3818,7 +657,7 @@ const SideNavigationItem = React.forwardRef(
|
|
|
3818
657
|
active,
|
|
3819
658
|
subMenu: isExpanded && subMenu,
|
|
3820
659
|
"aria-expanded": isExpanded,
|
|
3821
|
-
as:
|
|
660
|
+
as: Element,
|
|
3822
661
|
ref,
|
|
3823
662
|
...rest,
|
|
3824
663
|
children: label
|
|
@@ -3905,12 +744,12 @@ const Stepper = ({
|
|
|
3905
744
|
children: steps.map((step, i) => {
|
|
3906
745
|
const isCurrent = i === activeIndex;
|
|
3907
746
|
const isInteractive = interactive && activeIndex > i;
|
|
3908
|
-
const
|
|
747
|
+
const Element = isInteractive ? "button" : "div";
|
|
3909
748
|
const isCompleted = activeIndex > i;
|
|
3910
749
|
const currentStepSummary = `${ariaLabelStep} ${i + 1} ${ariaLabelOf} ${steps.length}, ${step} ${isCompleted ? `, ${ariaLabelCompleted}` : ""}`;
|
|
3911
750
|
const props = isInteractive ? { onClick: () => onStepClick?.(i) } : {};
|
|
3912
751
|
return /* @__PURE__ */ jsxRuntime.jsx("li", { className: "eds-stepper__step__wrapper", children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3913
|
-
|
|
752
|
+
Element,
|
|
3914
753
|
{
|
|
3915
754
|
className: classNames(
|
|
3916
755
|
"eds-stepper__step",
|
|
@@ -3919,7 +758,7 @@ const Stepper = ({
|
|
|
3919
758
|
{ "eds-stepper__step--interactive": isInteractive }
|
|
3920
759
|
),
|
|
3921
760
|
"aria-current": isCurrent ? "step" : void 0,
|
|
3922
|
-
type:
|
|
761
|
+
type: Element === "button" ? "button" : void 0,
|
|
3923
762
|
...props,
|
|
3924
763
|
children: [
|
|
3925
764
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "eds-stepper__step__line", "aria-hidden": true }),
|
|
@@ -3943,9 +782,9 @@ const TopNavigationItem = ({
|
|
|
3943
782
|
as,
|
|
3944
783
|
...rest
|
|
3945
784
|
}) => {
|
|
3946
|
-
const
|
|
785
|
+
const Element = as || defaultElement;
|
|
3947
786
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3948
|
-
|
|
787
|
+
Element,
|
|
3949
788
|
{
|
|
3950
789
|
className: classNames([
|
|
3951
790
|
"eds-top-navigation-item",
|