@soomo/react-text-annotator 3.2.0-staging.5 → 3.2.0-staging.7

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.
Files changed (74) hide show
  1. package/dist/TextAnnotationPopup/TextAnnotationPopup.d.ts.map +1 -1
  2. package/dist/TextAnnotationPopup/useAnnouncePopupNavigation.d.ts.map +1 -0
  3. package/dist/hooks/index.d.ts +1 -2
  4. package/dist/hooks/index.d.ts.map +1 -1
  5. package/dist/hooks/useAnnotationQuoteIdle.d.ts +4 -0
  6. package/dist/hooks/useAnnotationQuoteIdle.d.ts.map +1 -0
  7. package/dist/react-text-annotator.css +1 -31
  8. package/dist/react-text-annotator.es.js +212 -25
  9. package/dist/react-text-annotator.es.js.map +1 -1
  10. package/package.json +14 -13
  11. package/dist/hooks/useAnnotationQuoteIdling.d.ts +0 -4
  12. package/dist/hooks/useAnnotationQuoteIdling.d.ts.map +0 -1
  13. package/dist/hooks/useAnnouncePopupNavigation.d.ts.map +0 -1
  14. package/dist/react-text-annotator.es10.js +0 -504
  15. package/dist/react-text-annotator.es10.js.map +0 -1
  16. package/dist/react-text-annotator.es11.js +0 -85
  17. package/dist/react-text-annotator.es11.js.map +0 -1
  18. package/dist/react-text-annotator.es12.js +0 -48
  19. package/dist/react-text-annotator.es12.js.map +0 -1
  20. package/dist/react-text-annotator.es13.js +0 -28
  21. package/dist/react-text-annotator.es13.js.map +0 -1
  22. package/dist/react-text-annotator.es14.js +0 -1646
  23. package/dist/react-text-annotator.es14.js.map +0 -1
  24. package/dist/react-text-annotator.es15.js +0 -13
  25. package/dist/react-text-annotator.es15.js.map +0 -1
  26. package/dist/react-text-annotator.es17.js +0 -607
  27. package/dist/react-text-annotator.es17.js.map +0 -1
  28. package/dist/react-text-annotator.es18.js +0 -285
  29. package/dist/react-text-annotator.es18.js.map +0 -1
  30. package/dist/react-text-annotator.es19.js +0 -18
  31. package/dist/react-text-annotator.es19.js.map +0 -1
  32. package/dist/react-text-annotator.es2.js +0 -67
  33. package/dist/react-text-annotator.es2.js.map +0 -1
  34. package/dist/react-text-annotator.es20.js +0 -5
  35. package/dist/react-text-annotator.es20.js.map +0 -1
  36. package/dist/react-text-annotator.es21.js +0 -34
  37. package/dist/react-text-annotator.es21.js.map +0 -1
  38. package/dist/react-text-annotator.es22.js +0 -891
  39. package/dist/react-text-annotator.es22.js.map +0 -1
  40. package/dist/react-text-annotator.es23.js +0 -5
  41. package/dist/react-text-annotator.es23.js.map +0 -1
  42. package/dist/react-text-annotator.es24.js +0 -5
  43. package/dist/react-text-annotator.es24.js.map +0 -1
  44. package/dist/react-text-annotator.es25.js +0 -117
  45. package/dist/react-text-annotator.es25.js.map +0 -1
  46. package/dist/react-text-annotator.es26.js +0 -312
  47. package/dist/react-text-annotator.es26.js.map +0 -1
  48. package/dist/react-text-annotator.es27.js +0 -61
  49. package/dist/react-text-annotator.es27.js.map +0 -1
  50. package/dist/react-text-annotator.es28.js +0 -23
  51. package/dist/react-text-annotator.es28.js.map +0 -1
  52. package/dist/react-text-annotator.es29.js +0 -130
  53. package/dist/react-text-annotator.es29.js.map +0 -1
  54. package/dist/react-text-annotator.es3.js +0 -29
  55. package/dist/react-text-annotator.es3.js.map +0 -1
  56. package/dist/react-text-annotator.es30.js +0 -167
  57. package/dist/react-text-annotator.es30.js.map +0 -1
  58. package/dist/react-text-annotator.es31.js +0 -314
  59. package/dist/react-text-annotator.es31.js.map +0 -1
  60. package/dist/react-text-annotator.es32.js +0 -152
  61. package/dist/react-text-annotator.es32.js.map +0 -1
  62. package/dist/react-text-annotator.es33.js +0 -629
  63. package/dist/react-text-annotator.es33.js.map +0 -1
  64. package/dist/react-text-annotator.es4.js +0 -43
  65. package/dist/react-text-annotator.es4.js.map +0 -1
  66. package/dist/react-text-annotator.es5.js +0 -48
  67. package/dist/react-text-annotator.es5.js.map +0 -1
  68. package/dist/react-text-annotator.es6.js +0 -29
  69. package/dist/react-text-annotator.es6.js.map +0 -1
  70. package/dist/react-text-annotator.es7.js +0 -143
  71. package/dist/react-text-annotator.es7.js.map +0 -1
  72. package/dist/react-text-annotator.es8.js +0 -6
  73. package/dist/react-text-annotator.es8.js.map +0 -1
  74. /package/dist/{hooks → TextAnnotationPopup}/useAnnouncePopupNavigation.d.ts +0 -0
@@ -1,1646 +0,0 @@
1
- import * as React from "react";
2
- import { useLayoutEffect, useEffect, useRef } from "react";
3
- import { getDocument, isTypeableCombobox, activeElement, contains, isVirtualClick, isVirtualPointerEvent, getTarget, isReactEvent, isRootElement, isEventTargetWithin, isSafari, stopEvent } from "./react-text-annotator.es29.js";
4
- import { j as jsxRuntimeExports } from "./react-text-annotator.es8.js";
5
- import { isElement, getOverflowAncestors, isHTMLElement, getComputedStyle, isWebKit, isLastTraversableNode, getParentNode, getNodeName } from "./react-text-annotator.es30.js";
6
- import { tabbable, isTabbable } from "./react-text-annotator.es31.js";
7
- import * as ReactDOM from "react-dom";
8
- import { useFloating as useFloating$1 } from "./react-text-annotator.es18.js";
9
- import { arrow, flip, inline, offset, shift } from "./react-text-annotator.es18.js";
10
- const SafeReact = {
11
- ...React
12
- };
13
- const useInsertionEffect = SafeReact.useInsertionEffect;
14
- const useSafeInsertionEffect = useInsertionEffect || ((fn) => fn());
15
- function useEffectEvent(callback) {
16
- const ref = React.useRef(() => {
17
- if (process.env.NODE_ENV !== "production") {
18
- throw new Error("Cannot call an event handler while rendering.");
19
- }
20
- });
21
- useSafeInsertionEffect(() => {
22
- ref.current = callback;
23
- });
24
- return React.useCallback(function() {
25
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
26
- args[_key] = arguments[_key];
27
- }
28
- return ref.current == null ? void 0 : ref.current(...args);
29
- }, []);
30
- }
31
- var index = typeof document !== "undefined" ? useLayoutEffect : useEffect;
32
- let serverHandoffComplete = false;
33
- let count = 0;
34
- const genId = () => (
35
- // Ensure the id is unique with multiple independent versions of Floating UI
36
- // on <React 18
37
- "floating-ui-" + Math.random().toString(36).slice(2, 6) + count++
38
- );
39
- function useFloatingId() {
40
- const [id, setId] = React.useState(() => serverHandoffComplete ? genId() : void 0);
41
- index(() => {
42
- if (id == null) {
43
- setId(genId());
44
- }
45
- }, []);
46
- React.useEffect(() => {
47
- serverHandoffComplete = true;
48
- }, []);
49
- return id;
50
- }
51
- const useReactId = SafeReact.useId;
52
- const useId = useReactId || useFloatingId;
53
- let devMessageSet;
54
- if (process.env.NODE_ENV !== "production") {
55
- devMessageSet = /* @__PURE__ */ new Set();
56
- }
57
- function warn() {
58
- var _devMessageSet;
59
- for (var _len = arguments.length, messages = new Array(_len), _key = 0; _key < _len; _key++) {
60
- messages[_key] = arguments[_key];
61
- }
62
- const message = "Floating UI: " + messages.join(" ");
63
- if (!((_devMessageSet = devMessageSet) != null && _devMessageSet.has(message))) {
64
- var _devMessageSet2;
65
- (_devMessageSet2 = devMessageSet) == null || _devMessageSet2.add(message);
66
- console.warn(message);
67
- }
68
- }
69
- function error() {
70
- var _devMessageSet3;
71
- for (var _len2 = arguments.length, messages = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
72
- messages[_key2] = arguments[_key2];
73
- }
74
- const message = "Floating UI: " + messages.join(" ");
75
- if (!((_devMessageSet3 = devMessageSet) != null && _devMessageSet3.has(message))) {
76
- var _devMessageSet4;
77
- (_devMessageSet4 = devMessageSet) == null || _devMessageSet4.add(message);
78
- console.error(message);
79
- }
80
- }
81
- const FloatingArrow = /* @__PURE__ */ React.forwardRef(function FloatingArrow2(props, ref) {
82
- const {
83
- context: {
84
- placement,
85
- elements: {
86
- floating
87
- },
88
- middlewareData: {
89
- arrow: arrow2,
90
- shift: shift2
91
- }
92
- },
93
- width = 14,
94
- height = 7,
95
- tipRadius = 0,
96
- strokeWidth = 0,
97
- staticOffset,
98
- stroke,
99
- d,
100
- style: {
101
- transform,
102
- ...restStyle
103
- } = {},
104
- ...rest
105
- } = props;
106
- if (process.env.NODE_ENV !== "production") {
107
- if (!ref) {
108
- warn("The `ref` prop is required for `FloatingArrow`.");
109
- }
110
- }
111
- const clipPathId = useId();
112
- const [isRTL, setIsRTL] = React.useState(false);
113
- index(() => {
114
- if (!floating) return;
115
- const isRTL2 = getComputedStyle(floating).direction === "rtl";
116
- if (isRTL2) {
117
- setIsRTL(true);
118
- }
119
- }, [floating]);
120
- if (!floating) {
121
- return null;
122
- }
123
- const [side, alignment] = placement.split("-");
124
- const isVerticalSide = side === "top" || side === "bottom";
125
- let computedStaticOffset = staticOffset;
126
- if (isVerticalSide && shift2 != null && shift2.x || !isVerticalSide && shift2 != null && shift2.y) {
127
- computedStaticOffset = null;
128
- }
129
- const computedStrokeWidth = strokeWidth * 2;
130
- const halfStrokeWidth = computedStrokeWidth / 2;
131
- const svgX = width / 2 * (tipRadius / -8 + 1);
132
- const svgY = height / 2 * tipRadius / 4;
133
- const isCustomShape = !!d;
134
- const yOffsetProp = computedStaticOffset && alignment === "end" ? "bottom" : "top";
135
- let xOffsetProp = computedStaticOffset && alignment === "end" ? "right" : "left";
136
- if (computedStaticOffset && isRTL) {
137
- xOffsetProp = alignment === "end" ? "left" : "right";
138
- }
139
- const arrowX = (arrow2 == null ? void 0 : arrow2.x) != null ? computedStaticOffset || arrow2.x : "";
140
- const arrowY = (arrow2 == null ? void 0 : arrow2.y) != null ? computedStaticOffset || arrow2.y : "";
141
- const dValue = d || "M0,0" + (" H" + width) + (" L" + (width - svgX) + "," + (height - svgY)) + (" Q" + width / 2 + "," + height + " " + svgX + "," + (height - svgY)) + " Z";
142
- const rotation = {
143
- top: isCustomShape ? "rotate(180deg)" : "",
144
- left: isCustomShape ? "rotate(90deg)" : "rotate(-90deg)",
145
- bottom: isCustomShape ? "" : "rotate(180deg)",
146
- right: isCustomShape ? "rotate(-90deg)" : "rotate(90deg)"
147
- }[side];
148
- return /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", {
149
- ...rest,
150
- "aria-hidden": true,
151
- ref,
152
- width: isCustomShape ? width : width + computedStrokeWidth,
153
- height: width,
154
- viewBox: "0 0 " + width + " " + (height > width ? height : width),
155
- style: {
156
- position: "absolute",
157
- pointerEvents: "none",
158
- [xOffsetProp]: arrowX,
159
- [yOffsetProp]: arrowY,
160
- [side]: isVerticalSide || isCustomShape ? "100%" : "calc(100% - " + computedStrokeWidth / 2 + "px)",
161
- transform: [rotation, transform].filter((t) => !!t).join(" "),
162
- ...restStyle
163
- },
164
- children: [computedStrokeWidth > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("path", {
165
- clipPath: "url(#" + clipPathId + ")",
166
- fill: "none",
167
- stroke,
168
- strokeWidth: computedStrokeWidth + (d ? 0 : 1),
169
- d: dValue
170
- }), /* @__PURE__ */ jsxRuntimeExports.jsx("path", {
171
- stroke: computedStrokeWidth && !d ? rest.fill : "none",
172
- d: dValue
173
- }), /* @__PURE__ */ jsxRuntimeExports.jsx("clipPath", {
174
- id: clipPathId,
175
- children: /* @__PURE__ */ jsxRuntimeExports.jsx("rect", {
176
- x: -halfStrokeWidth,
177
- y: halfStrokeWidth * (isCustomShape ? -1 : 1),
178
- width: width + computedStrokeWidth,
179
- height: width
180
- })
181
- })]
182
- });
183
- });
184
- function createPubSub() {
185
- const map = /* @__PURE__ */ new Map();
186
- return {
187
- emit(event, data) {
188
- var _map$get;
189
- (_map$get = map.get(event)) == null || _map$get.forEach((handler) => handler(data));
190
- },
191
- on(event, listener) {
192
- map.set(event, [...map.get(event) || [], listener]);
193
- },
194
- off(event, listener) {
195
- var _map$get2;
196
- map.set(event, ((_map$get2 = map.get(event)) == null ? void 0 : _map$get2.filter((l) => l !== listener)) || []);
197
- }
198
- };
199
- }
200
- const FloatingNodeContext = /* @__PURE__ */ React.createContext(null);
201
- const FloatingTreeContext = /* @__PURE__ */ React.createContext(null);
202
- const useFloatingParentNodeId = () => {
203
- var _React$useContext;
204
- return ((_React$useContext = React.useContext(FloatingNodeContext)) == null ? void 0 : _React$useContext.id) || null;
205
- };
206
- const useFloatingTree = () => React.useContext(FloatingTreeContext);
207
- function createAttribute(name) {
208
- return "data-floating-ui-" + name;
209
- }
210
- function useLatestRef(value) {
211
- const ref = useRef(value);
212
- index(() => {
213
- ref.current = value;
214
- });
215
- return ref;
216
- }
217
- let rafId = 0;
218
- function enqueueFocus(el, options) {
219
- if (options === void 0) {
220
- options = {};
221
- }
222
- const {
223
- preventScroll = false,
224
- cancelPrevious = true,
225
- sync = false
226
- } = options;
227
- cancelPrevious && cancelAnimationFrame(rafId);
228
- const exec = () => el == null ? void 0 : el.focus({
229
- preventScroll
230
- });
231
- if (sync) {
232
- exec();
233
- } else {
234
- rafId = requestAnimationFrame(exec);
235
- }
236
- }
237
- function getAncestors(nodes, id) {
238
- var _nodes$find;
239
- let allAncestors = [];
240
- let currentParentId = (_nodes$find = nodes.find((node) => node.id === id)) == null ? void 0 : _nodes$find.parentId;
241
- while (currentParentId) {
242
- const currentNode = nodes.find((node) => node.id === currentParentId);
243
- currentParentId = currentNode == null ? void 0 : currentNode.parentId;
244
- if (currentNode) {
245
- allAncestors = allAncestors.concat(currentNode);
246
- }
247
- }
248
- return allAncestors;
249
- }
250
- function getChildren(nodes, id) {
251
- let allChildren = nodes.filter((node) => {
252
- var _node$context;
253
- return node.parentId === id && ((_node$context = node.context) == null ? void 0 : _node$context.open);
254
- });
255
- let currentChildren = allChildren;
256
- while (currentChildren.length) {
257
- currentChildren = nodes.filter((node) => {
258
- var _currentChildren;
259
- return (_currentChildren = currentChildren) == null ? void 0 : _currentChildren.some((n) => {
260
- var _node$context2;
261
- return node.parentId === n.id && ((_node$context2 = node.context) == null ? void 0 : _node$context2.open);
262
- });
263
- });
264
- allChildren = allChildren.concat(currentChildren);
265
- }
266
- return allChildren;
267
- }
268
- let counterMap = /* @__PURE__ */ new WeakMap();
269
- let uncontrolledElementsSet = /* @__PURE__ */ new WeakSet();
270
- let markerMap = {};
271
- let lockCount$1 = 0;
272
- const supportsInert = () => typeof HTMLElement !== "undefined" && "inert" in HTMLElement.prototype;
273
- const unwrapHost = (node) => node && (node.host || unwrapHost(node.parentNode));
274
- const correctElements = (parent, targets) => targets.map((target) => {
275
- if (parent.contains(target)) {
276
- return target;
277
- }
278
- const correctedTarget = unwrapHost(target);
279
- if (parent.contains(correctedTarget)) {
280
- return correctedTarget;
281
- }
282
- return null;
283
- }).filter((x) => x != null);
284
- function applyAttributeToOthers(uncorrectedAvoidElements, body, ariaHidden, inert) {
285
- const markerName = "data-floating-ui-inert";
286
- const controlAttribute = inert ? "inert" : ariaHidden ? "aria-hidden" : null;
287
- const avoidElements = correctElements(body, uncorrectedAvoidElements);
288
- const elementsToKeep = /* @__PURE__ */ new Set();
289
- const elementsToStop = new Set(avoidElements);
290
- const hiddenElements = [];
291
- if (!markerMap[markerName]) {
292
- markerMap[markerName] = /* @__PURE__ */ new WeakMap();
293
- }
294
- const markerCounter = markerMap[markerName];
295
- avoidElements.forEach(keep);
296
- deep(body);
297
- elementsToKeep.clear();
298
- function keep(el) {
299
- if (!el || elementsToKeep.has(el)) {
300
- return;
301
- }
302
- elementsToKeep.add(el);
303
- el.parentNode && keep(el.parentNode);
304
- }
305
- function deep(parent) {
306
- if (!parent || elementsToStop.has(parent)) {
307
- return;
308
- }
309
- [].forEach.call(parent.children, (node) => {
310
- if (getNodeName(node) === "script") return;
311
- if (elementsToKeep.has(node)) {
312
- deep(node);
313
- } else {
314
- const attr2 = controlAttribute ? node.getAttribute(controlAttribute) : null;
315
- const alreadyHidden = attr2 !== null && attr2 !== "false";
316
- const currentCounterValue = counterMap.get(node) || 0;
317
- const counterValue = controlAttribute ? currentCounterValue + 1 : currentCounterValue;
318
- const markerValue = (markerCounter.get(node) || 0) + 1;
319
- counterMap.set(node, counterValue);
320
- markerCounter.set(node, markerValue);
321
- hiddenElements.push(node);
322
- if (counterValue === 1 && alreadyHidden) {
323
- uncontrolledElementsSet.add(node);
324
- }
325
- if (markerValue === 1) {
326
- node.setAttribute(markerName, "");
327
- }
328
- if (!alreadyHidden && controlAttribute) {
329
- node.setAttribute(controlAttribute, controlAttribute === "inert" ? "" : "true");
330
- }
331
- }
332
- });
333
- }
334
- lockCount$1++;
335
- return () => {
336
- hiddenElements.forEach((element) => {
337
- const currentCounterValue = counterMap.get(element) || 0;
338
- const counterValue = controlAttribute ? currentCounterValue - 1 : currentCounterValue;
339
- const markerValue = (markerCounter.get(element) || 0) - 1;
340
- counterMap.set(element, counterValue);
341
- markerCounter.set(element, markerValue);
342
- if (!counterValue) {
343
- if (!uncontrolledElementsSet.has(element) && controlAttribute) {
344
- element.removeAttribute(controlAttribute);
345
- }
346
- uncontrolledElementsSet.delete(element);
347
- }
348
- if (!markerValue) {
349
- element.removeAttribute(markerName);
350
- }
351
- });
352
- lockCount$1--;
353
- if (!lockCount$1) {
354
- counterMap = /* @__PURE__ */ new WeakMap();
355
- counterMap = /* @__PURE__ */ new WeakMap();
356
- uncontrolledElementsSet = /* @__PURE__ */ new WeakSet();
357
- markerMap = {};
358
- }
359
- };
360
- }
361
- function markOthers(avoidElements, ariaHidden, inert) {
362
- if (ariaHidden === void 0) {
363
- ariaHidden = false;
364
- }
365
- if (inert === void 0) {
366
- inert = false;
367
- }
368
- const body = getDocument(avoidElements[0]).body;
369
- return applyAttributeToOthers(avoidElements.concat(Array.from(body.querySelectorAll("[aria-live]"))), body, ariaHidden, inert);
370
- }
371
- const getTabbableOptions = () => ({
372
- getShadowRoot: true,
373
- displayCheck: (
374
- // JSDOM does not support the `tabbable` library. To solve this we can
375
- // check if `ResizeObserver` is a real function (not polyfilled), which
376
- // determines if the current environment is JSDOM-like.
377
- typeof ResizeObserver === "function" && ResizeObserver.toString().includes("[native code]") ? "full" : "none"
378
- )
379
- });
380
- function getTabbableIn(container, direction) {
381
- const allTabbable = tabbable(container, getTabbableOptions());
382
- if (direction === "prev") {
383
- allTabbable.reverse();
384
- }
385
- const activeIndex = allTabbable.indexOf(activeElement(getDocument(container)));
386
- const nextTabbableElements = allTabbable.slice(activeIndex + 1);
387
- return nextTabbableElements[0];
388
- }
389
- function getNextTabbable(referenceElement) {
390
- return getTabbableIn(getDocument(referenceElement).body, "next") || referenceElement;
391
- }
392
- function getPreviousTabbable(referenceElement) {
393
- return getTabbableIn(getDocument(referenceElement).body, "prev") || referenceElement;
394
- }
395
- function isOutsideEvent(event, container) {
396
- const containerElement = container || event.currentTarget;
397
- const relatedTarget = event.relatedTarget;
398
- return !relatedTarget || !contains(containerElement, relatedTarget);
399
- }
400
- function disableFocusInside(container) {
401
- const tabbableElements = tabbable(container, getTabbableOptions());
402
- tabbableElements.forEach((element) => {
403
- element.dataset.tabindex = element.getAttribute("tabindex") || "";
404
- element.setAttribute("tabindex", "-1");
405
- });
406
- }
407
- function enableFocusInside(container) {
408
- const elements = container.querySelectorAll("[data-tabindex]");
409
- elements.forEach((element) => {
410
- const tabindex = element.dataset.tabindex;
411
- delete element.dataset.tabindex;
412
- if (tabindex) {
413
- element.setAttribute("tabindex", tabindex);
414
- } else {
415
- element.removeAttribute("tabindex");
416
- }
417
- });
418
- }
419
- const HIDDEN_STYLES = {
420
- border: 0,
421
- clip: "rect(0 0 0 0)",
422
- height: "1px",
423
- margin: "-1px",
424
- overflow: "hidden",
425
- padding: 0,
426
- position: "fixed",
427
- whiteSpace: "nowrap",
428
- width: "1px",
429
- top: 0,
430
- left: 0
431
- };
432
- const FocusGuard = /* @__PURE__ */ React.forwardRef(function FocusGuard2(props, ref) {
433
- const [role, setRole] = React.useState();
434
- index(() => {
435
- if (isSafari()) {
436
- setRole("button");
437
- }
438
- }, []);
439
- const restProps = {
440
- ref,
441
- tabIndex: 0,
442
- // Role is only for VoiceOver
443
- role,
444
- "aria-hidden": role ? void 0 : true,
445
- [createAttribute("focus-guard")]: "",
446
- style: HIDDEN_STYLES
447
- };
448
- return /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
449
- ...props,
450
- ...restProps
451
- });
452
- });
453
- const PortalContext = /* @__PURE__ */ React.createContext(null);
454
- const attr = /* @__PURE__ */ createAttribute("portal");
455
- function useFloatingPortalNode(props) {
456
- if (props === void 0) {
457
- props = {};
458
- }
459
- const {
460
- id,
461
- root
462
- } = props;
463
- const uniqueId = useId();
464
- const portalContext = usePortalContext();
465
- const [portalNode, setPortalNode] = React.useState(null);
466
- const portalNodeRef = React.useRef(null);
467
- index(() => {
468
- return () => {
469
- portalNode == null || portalNode.remove();
470
- queueMicrotask(() => {
471
- portalNodeRef.current = null;
472
- });
473
- };
474
- }, [portalNode]);
475
- index(() => {
476
- if (!uniqueId) return;
477
- if (portalNodeRef.current) return;
478
- const existingIdRoot = id ? document.getElementById(id) : null;
479
- if (!existingIdRoot) return;
480
- const subRoot = document.createElement("div");
481
- subRoot.id = uniqueId;
482
- subRoot.setAttribute(attr, "");
483
- existingIdRoot.appendChild(subRoot);
484
- portalNodeRef.current = subRoot;
485
- setPortalNode(subRoot);
486
- }, [id, uniqueId]);
487
- index(() => {
488
- if (root === null) return;
489
- if (!uniqueId) return;
490
- if (portalNodeRef.current) return;
491
- let container = root || (portalContext == null ? void 0 : portalContext.portalNode);
492
- if (container && !isElement(container)) container = container.current;
493
- container = container || document.body;
494
- let idWrapper = null;
495
- if (id) {
496
- idWrapper = document.createElement("div");
497
- idWrapper.id = id;
498
- container.appendChild(idWrapper);
499
- }
500
- const subRoot = document.createElement("div");
501
- subRoot.id = uniqueId;
502
- subRoot.setAttribute(attr, "");
503
- container = idWrapper || container;
504
- container.appendChild(subRoot);
505
- portalNodeRef.current = subRoot;
506
- setPortalNode(subRoot);
507
- }, [id, root, uniqueId, portalContext]);
508
- return portalNode;
509
- }
510
- function FloatingPortal(props) {
511
- const {
512
- children,
513
- id,
514
- root,
515
- preserveTabOrder = true
516
- } = props;
517
- const portalNode = useFloatingPortalNode({
518
- id,
519
- root
520
- });
521
- const [focusManagerState, setFocusManagerState] = React.useState(null);
522
- const beforeOutsideRef = React.useRef(null);
523
- const afterOutsideRef = React.useRef(null);
524
- const beforeInsideRef = React.useRef(null);
525
- const afterInsideRef = React.useRef(null);
526
- const modal = focusManagerState == null ? void 0 : focusManagerState.modal;
527
- const open = focusManagerState == null ? void 0 : focusManagerState.open;
528
- const shouldRenderGuards = (
529
- // The FocusManager and therefore floating element are currently open/
530
- // rendered.
531
- !!focusManagerState && // Guards are only for non-modal focus management.
532
- !focusManagerState.modal && // Don't render if unmount is transitioning.
533
- focusManagerState.open && preserveTabOrder && !!(root || portalNode)
534
- );
535
- React.useEffect(() => {
536
- if (!portalNode || !preserveTabOrder || modal) {
537
- return;
538
- }
539
- function onFocus(event) {
540
- if (portalNode && isOutsideEvent(event)) {
541
- const focusing = event.type === "focusin";
542
- const manageFocus = focusing ? enableFocusInside : disableFocusInside;
543
- manageFocus(portalNode);
544
- }
545
- }
546
- portalNode.addEventListener("focusin", onFocus, true);
547
- portalNode.addEventListener("focusout", onFocus, true);
548
- return () => {
549
- portalNode.removeEventListener("focusin", onFocus, true);
550
- portalNode.removeEventListener("focusout", onFocus, true);
551
- };
552
- }, [portalNode, preserveTabOrder, modal]);
553
- React.useEffect(() => {
554
- if (!portalNode) return;
555
- if (open) return;
556
- enableFocusInside(portalNode);
557
- }, [open, portalNode]);
558
- return /* @__PURE__ */ jsxRuntimeExports.jsxs(PortalContext.Provider, {
559
- value: React.useMemo(() => ({
560
- preserveTabOrder,
561
- beforeOutsideRef,
562
- afterOutsideRef,
563
- beforeInsideRef,
564
- afterInsideRef,
565
- portalNode,
566
- setFocusManagerState
567
- }), [preserveTabOrder, portalNode]),
568
- children: [shouldRenderGuards && portalNode && /* @__PURE__ */ jsxRuntimeExports.jsx(FocusGuard, {
569
- "data-type": "outside",
570
- ref: beforeOutsideRef,
571
- onFocus: (event) => {
572
- if (isOutsideEvent(event, portalNode)) {
573
- var _beforeInsideRef$curr;
574
- (_beforeInsideRef$curr = beforeInsideRef.current) == null || _beforeInsideRef$curr.focus();
575
- } else {
576
- const domReference = focusManagerState ? focusManagerState.domReference : null;
577
- const prevTabbable = getPreviousTabbable(domReference);
578
- prevTabbable == null || prevTabbable.focus();
579
- }
580
- }
581
- }), shouldRenderGuards && portalNode && /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
582
- "aria-owns": portalNode.id,
583
- style: HIDDEN_STYLES
584
- }), portalNode && /* @__PURE__ */ ReactDOM.createPortal(children, portalNode), shouldRenderGuards && portalNode && /* @__PURE__ */ jsxRuntimeExports.jsx(FocusGuard, {
585
- "data-type": "outside",
586
- ref: afterOutsideRef,
587
- onFocus: (event) => {
588
- if (isOutsideEvent(event, portalNode)) {
589
- var _afterInsideRef$curre;
590
- (_afterInsideRef$curre = afterInsideRef.current) == null || _afterInsideRef$curre.focus();
591
- } else {
592
- const domReference = focusManagerState ? focusManagerState.domReference : null;
593
- const nextTabbable = getNextTabbable(domReference);
594
- nextTabbable == null || nextTabbable.focus();
595
- (focusManagerState == null ? void 0 : focusManagerState.closeOnFocusOut) && (focusManagerState == null ? void 0 : focusManagerState.onOpenChange(false, event.nativeEvent, "focus-out"));
596
- }
597
- }
598
- })]
599
- });
600
- }
601
- const usePortalContext = () => React.useContext(PortalContext);
602
- const FOCUSABLE_ATTRIBUTE = "data-floating-ui-focusable";
603
- function getFloatingFocusElement(floatingElement) {
604
- if (!floatingElement) {
605
- return null;
606
- }
607
- return floatingElement.hasAttribute(FOCUSABLE_ATTRIBUTE) ? floatingElement : floatingElement.querySelector("[" + FOCUSABLE_ATTRIBUTE + "]") || floatingElement;
608
- }
609
- function useLiteMergeRefs(refs) {
610
- return React.useMemo(() => {
611
- return (value) => {
612
- refs.forEach((ref) => {
613
- if (ref) {
614
- ref.current = value;
615
- }
616
- });
617
- };
618
- }, refs);
619
- }
620
- const LIST_LIMIT = 20;
621
- let previouslyFocusedElements = [];
622
- function addPreviouslyFocusedElement(element) {
623
- previouslyFocusedElements = previouslyFocusedElements.filter((el) => el.isConnected);
624
- if (element && getNodeName(element) !== "body") {
625
- previouslyFocusedElements.push(element);
626
- if (previouslyFocusedElements.length > LIST_LIMIT) {
627
- previouslyFocusedElements = previouslyFocusedElements.slice(-20);
628
- }
629
- }
630
- }
631
- function getPreviouslyFocusedElement() {
632
- return previouslyFocusedElements.slice().reverse().find((el) => el.isConnected);
633
- }
634
- function getFirstTabbableElement(container) {
635
- const tabbableOptions = getTabbableOptions();
636
- if (isTabbable(container, tabbableOptions)) {
637
- return container;
638
- }
639
- return tabbable(container, tabbableOptions)[0] || container;
640
- }
641
- const VisuallyHiddenDismiss = /* @__PURE__ */ React.forwardRef(function VisuallyHiddenDismiss2(props, ref) {
642
- return /* @__PURE__ */ jsxRuntimeExports.jsx("button", {
643
- ...props,
644
- type: "button",
645
- ref,
646
- tabIndex: -1,
647
- style: HIDDEN_STYLES
648
- });
649
- });
650
- function FloatingFocusManager(props) {
651
- const {
652
- context,
653
- children,
654
- disabled = false,
655
- order = ["content"],
656
- guards: _guards = true,
657
- initialFocus = 0,
658
- returnFocus = true,
659
- restoreFocus = false,
660
- modal = true,
661
- visuallyHiddenDismiss = false,
662
- closeOnFocusOut = true,
663
- outsideElementsInert = false,
664
- getInsideElements: _getInsideElements = () => []
665
- } = props;
666
- const {
667
- open,
668
- onOpenChange,
669
- events,
670
- dataRef,
671
- elements: {
672
- domReference,
673
- floating
674
- }
675
- } = context;
676
- const getNodeId = useEffectEvent(() => {
677
- var _dataRef$current$floa;
678
- return (_dataRef$current$floa = dataRef.current.floatingContext) == null ? void 0 : _dataRef$current$floa.nodeId;
679
- });
680
- const getInsideElements = useEffectEvent(_getInsideElements);
681
- const ignoreInitialFocus = typeof initialFocus === "number" && initialFocus < 0;
682
- const isUntrappedTypeableCombobox = isTypeableCombobox(domReference) && ignoreInitialFocus;
683
- const inertSupported = supportsInert();
684
- const guards = inertSupported ? _guards : true;
685
- const useInert = !guards || inertSupported && outsideElementsInert;
686
- const orderRef = useLatestRef(order);
687
- const initialFocusRef = useLatestRef(initialFocus);
688
- const returnFocusRef = useLatestRef(returnFocus);
689
- const tree = useFloatingTree();
690
- const portalContext = usePortalContext();
691
- const startDismissButtonRef = React.useRef(null);
692
- const endDismissButtonRef = React.useRef(null);
693
- const preventReturnFocusRef = React.useRef(false);
694
- const isPointerDownRef = React.useRef(false);
695
- const tabbableIndexRef = React.useRef(-1);
696
- const isInsidePortal = portalContext != null;
697
- const floatingFocusElement = getFloatingFocusElement(floating);
698
- const getTabbableContent = useEffectEvent(function(container) {
699
- if (container === void 0) {
700
- container = floatingFocusElement;
701
- }
702
- return container ? tabbable(container, getTabbableOptions()) : [];
703
- });
704
- const getTabbableElements = useEffectEvent((container) => {
705
- const content = getTabbableContent(container);
706
- return orderRef.current.map((type) => {
707
- if (domReference && type === "reference") {
708
- return domReference;
709
- }
710
- if (floatingFocusElement && type === "floating") {
711
- return floatingFocusElement;
712
- }
713
- return content;
714
- }).filter(Boolean).flat();
715
- });
716
- React.useEffect(() => {
717
- if (disabled) return;
718
- if (!modal) return;
719
- function onKeyDown(event) {
720
- if (event.key === "Tab") {
721
- if (contains(floatingFocusElement, activeElement(getDocument(floatingFocusElement))) && getTabbableContent().length === 0 && !isUntrappedTypeableCombobox) {
722
- stopEvent(event);
723
- }
724
- const els = getTabbableElements();
725
- const target = getTarget(event);
726
- if (orderRef.current[0] === "reference" && target === domReference) {
727
- stopEvent(event);
728
- if (event.shiftKey) {
729
- enqueueFocus(els[els.length - 1]);
730
- } else {
731
- enqueueFocus(els[1]);
732
- }
733
- }
734
- if (orderRef.current[1] === "floating" && target === floatingFocusElement && event.shiftKey) {
735
- stopEvent(event);
736
- enqueueFocus(els[0]);
737
- }
738
- }
739
- }
740
- const doc = getDocument(floatingFocusElement);
741
- doc.addEventListener("keydown", onKeyDown);
742
- return () => {
743
- doc.removeEventListener("keydown", onKeyDown);
744
- };
745
- }, [disabled, domReference, floatingFocusElement, modal, orderRef, isUntrappedTypeableCombobox, getTabbableContent, getTabbableElements]);
746
- React.useEffect(() => {
747
- if (disabled) return;
748
- if (!floating) return;
749
- function handleFocusIn(event) {
750
- const target = getTarget(event);
751
- const tabbableContent = getTabbableContent();
752
- const tabbableIndex = tabbableContent.indexOf(target);
753
- if (tabbableIndex !== -1) {
754
- tabbableIndexRef.current = tabbableIndex;
755
- }
756
- }
757
- floating.addEventListener("focusin", handleFocusIn);
758
- return () => {
759
- floating.removeEventListener("focusin", handleFocusIn);
760
- };
761
- }, [disabled, floating, getTabbableContent]);
762
- React.useEffect(() => {
763
- if (disabled) return;
764
- if (!closeOnFocusOut) return;
765
- function handlePointerDown() {
766
- isPointerDownRef.current = true;
767
- setTimeout(() => {
768
- isPointerDownRef.current = false;
769
- });
770
- }
771
- function handleFocusOutside(event) {
772
- const relatedTarget = event.relatedTarget;
773
- queueMicrotask(() => {
774
- const nodeId = getNodeId();
775
- const movedToUnrelatedNode = !(contains(domReference, relatedTarget) || contains(floating, relatedTarget) || contains(relatedTarget, floating) || contains(portalContext == null ? void 0 : portalContext.portalNode, relatedTarget) || relatedTarget != null && relatedTarget.hasAttribute(createAttribute("focus-guard")) || tree && (getChildren(tree.nodesRef.current, nodeId).find((node) => {
776
- var _node$context, _node$context2;
777
- return contains((_node$context = node.context) == null ? void 0 : _node$context.elements.floating, relatedTarget) || contains((_node$context2 = node.context) == null ? void 0 : _node$context2.elements.domReference, relatedTarget);
778
- }) || getAncestors(tree.nodesRef.current, nodeId).find((node) => {
779
- var _node$context3, _node$context4, _node$context5;
780
- return [(_node$context3 = node.context) == null ? void 0 : _node$context3.elements.floating, getFloatingFocusElement((_node$context4 = node.context) == null ? void 0 : _node$context4.elements.floating)].includes(relatedTarget) || ((_node$context5 = node.context) == null ? void 0 : _node$context5.elements.domReference) === relatedTarget;
781
- })));
782
- if (restoreFocus && movedToUnrelatedNode && activeElement(getDocument(floatingFocusElement)) === getDocument(floatingFocusElement).body) {
783
- if (isHTMLElement(floatingFocusElement)) {
784
- floatingFocusElement.focus();
785
- }
786
- const prevTabbableIndex = tabbableIndexRef.current;
787
- const tabbableContent = getTabbableContent();
788
- const nodeToFocus = tabbableContent[prevTabbableIndex] || tabbableContent[tabbableContent.length - 1] || floatingFocusElement;
789
- if (isHTMLElement(nodeToFocus)) {
790
- nodeToFocus.focus();
791
- }
792
- }
793
- if ((isUntrappedTypeableCombobox ? true : !modal) && relatedTarget && movedToUnrelatedNode && !isPointerDownRef.current && // Fix React 18 Strict Mode returnFocus due to double rendering.
794
- relatedTarget !== getPreviouslyFocusedElement()) {
795
- preventReturnFocusRef.current = true;
796
- onOpenChange(false, event, "focus-out");
797
- }
798
- });
799
- }
800
- if (floating && isHTMLElement(domReference)) {
801
- domReference.addEventListener("focusout", handleFocusOutside);
802
- domReference.addEventListener("pointerdown", handlePointerDown);
803
- floating.addEventListener("focusout", handleFocusOutside);
804
- return () => {
805
- domReference.removeEventListener("focusout", handleFocusOutside);
806
- domReference.removeEventListener("pointerdown", handlePointerDown);
807
- floating.removeEventListener("focusout", handleFocusOutside);
808
- };
809
- }
810
- }, [disabled, domReference, floating, floatingFocusElement, modal, tree, portalContext, onOpenChange, closeOnFocusOut, restoreFocus, getTabbableContent, isUntrappedTypeableCombobox, getNodeId]);
811
- const beforeGuardRef = React.useRef(null);
812
- const afterGuardRef = React.useRef(null);
813
- const mergedBeforeGuardRef = useLiteMergeRefs([beforeGuardRef, portalContext == null ? void 0 : portalContext.beforeInsideRef]);
814
- const mergedAfterGuardRef = useLiteMergeRefs([afterGuardRef, portalContext == null ? void 0 : portalContext.afterInsideRef]);
815
- React.useEffect(() => {
816
- var _portalContext$portal, _ancestors$find;
817
- if (disabled) return;
818
- if (!floating) return;
819
- const portalNodes = Array.from((portalContext == null || (_portalContext$portal = portalContext.portalNode) == null ? void 0 : _portalContext$portal.querySelectorAll("[" + createAttribute("portal") + "]")) || []);
820
- const ancestors = tree ? getAncestors(tree.nodesRef.current, getNodeId()) : [];
821
- const ancestorFloatingNodes = tree && !modal ? ancestors.map((node) => {
822
- var _node$context6;
823
- return (_node$context6 = node.context) == null ? void 0 : _node$context6.elements.floating;
824
- }) : [];
825
- const rootAncestorComboboxDomReference = (_ancestors$find = ancestors.find((node) => {
826
- var _node$context7;
827
- return isTypeableCombobox(((_node$context7 = node.context) == null ? void 0 : _node$context7.elements.domReference) || null);
828
- })) == null || (_ancestors$find = _ancestors$find.context) == null ? void 0 : _ancestors$find.elements.domReference;
829
- const insideElements = [floating, rootAncestorComboboxDomReference, ...portalNodes, ...ancestorFloatingNodes, ...getInsideElements(), startDismissButtonRef.current, endDismissButtonRef.current, beforeGuardRef.current, afterGuardRef.current, portalContext == null ? void 0 : portalContext.beforeOutsideRef.current, portalContext == null ? void 0 : portalContext.afterOutsideRef.current, orderRef.current.includes("reference") || isUntrappedTypeableCombobox ? domReference : null].filter((x) => x != null);
830
- const cleanup = modal || isUntrappedTypeableCombobox ? markOthers(insideElements, !useInert, useInert) : markOthers(insideElements);
831
- return () => {
832
- cleanup();
833
- };
834
- }, [disabled, domReference, floating, modal, orderRef, portalContext, isUntrappedTypeableCombobox, guards, useInert, tree, getNodeId, getInsideElements]);
835
- index(() => {
836
- if (disabled || !isHTMLElement(floatingFocusElement)) return;
837
- const doc = getDocument(floatingFocusElement);
838
- const previouslyFocusedElement = activeElement(doc);
839
- queueMicrotask(() => {
840
- const focusableElements = getTabbableElements(floatingFocusElement);
841
- const initialFocusValue = initialFocusRef.current;
842
- const elToFocus = (typeof initialFocusValue === "number" ? focusableElements[initialFocusValue] : initialFocusValue.current) || floatingFocusElement;
843
- const focusAlreadyInsideFloatingEl = contains(floatingFocusElement, previouslyFocusedElement);
844
- if (!ignoreInitialFocus && !focusAlreadyInsideFloatingEl && open) {
845
- enqueueFocus(elToFocus, {
846
- preventScroll: elToFocus === floatingFocusElement
847
- });
848
- }
849
- });
850
- }, [disabled, open, floatingFocusElement, ignoreInitialFocus, getTabbableElements, initialFocusRef]);
851
- index(() => {
852
- if (disabled || !floatingFocusElement) return;
853
- let preventReturnFocusScroll = false;
854
- let focusReference = false;
855
- const doc = getDocument(floatingFocusElement);
856
- const previouslyFocusedElement = activeElement(doc);
857
- const contextData = dataRef.current;
858
- let openEvent = contextData.openEvent;
859
- addPreviouslyFocusedElement(previouslyFocusedElement);
860
- function onOpenChange2(_ref) {
861
- let {
862
- open: open2,
863
- reason,
864
- event,
865
- nested
866
- } = _ref;
867
- if (open2) {
868
- openEvent = event;
869
- }
870
- if (reason === "escape-key") {
871
- focusReference = true;
872
- }
873
- if (["hover", "safe-polygon"].includes(reason) && event.type === "mouseleave") {
874
- preventReturnFocusRef.current = true;
875
- }
876
- if (reason !== "outside-press") return;
877
- if (nested) {
878
- preventReturnFocusRef.current = false;
879
- preventReturnFocusScroll = true;
880
- } else if (isVirtualClick(event) || isVirtualPointerEvent(event)) {
881
- preventReturnFocusRef.current = false;
882
- } else {
883
- let isPreventScrollSupported = false;
884
- document.createElement("div").focus({
885
- get preventScroll() {
886
- isPreventScrollSupported = true;
887
- return false;
888
- }
889
- });
890
- if (isPreventScrollSupported) {
891
- preventReturnFocusRef.current = false;
892
- preventReturnFocusScroll = true;
893
- } else {
894
- preventReturnFocusRef.current = true;
895
- }
896
- }
897
- }
898
- events.on("openchange", onOpenChange2);
899
- const fallbackEl = doc.createElement("span");
900
- fallbackEl.setAttribute("tabindex", "-1");
901
- fallbackEl.setAttribute("aria-hidden", "true");
902
- Object.assign(fallbackEl.style, HIDDEN_STYLES);
903
- if (isInsidePortal && domReference) {
904
- domReference.insertAdjacentElement("afterend", fallbackEl);
905
- }
906
- function getReturnElement() {
907
- if (typeof returnFocusRef.current === "boolean") {
908
- return focusReference && domReference ? domReference : getPreviouslyFocusedElement() || fallbackEl;
909
- }
910
- return returnFocusRef.current.current || fallbackEl;
911
- }
912
- return () => {
913
- events.off("openchange", onOpenChange2);
914
- const activeEl = activeElement(doc);
915
- const isFocusInsideFloatingTree = contains(floating, activeEl) || tree && getChildren(tree.nodesRef.current, getNodeId()).some((node) => {
916
- var _node$context8;
917
- return contains((_node$context8 = node.context) == null ? void 0 : _node$context8.elements.floating, activeEl);
918
- });
919
- if (isFocusInsideFloatingTree || !!openEvent && ["click", "mousedown"].includes(openEvent.type)) {
920
- focusReference = true;
921
- }
922
- const returnElement = getReturnElement();
923
- queueMicrotask(() => {
924
- const tabbableReturnElement = getFirstTabbableElement(returnElement);
925
- if (
926
- // eslint-disable-next-line react-hooks/exhaustive-deps
927
- returnFocusRef.current && !preventReturnFocusRef.current && isHTMLElement(tabbableReturnElement) && // If the focus moved somewhere else after mount, avoid returning focus
928
- // since it likely entered a different element which should be
929
- // respected: https://github.com/floating-ui/floating-ui/issues/2607
930
- (tabbableReturnElement !== activeEl && activeEl !== doc.body ? isFocusInsideFloatingTree : true)
931
- ) {
932
- tabbableReturnElement.focus({
933
- preventScroll: preventReturnFocusScroll
934
- });
935
- }
936
- fallbackEl.remove();
937
- });
938
- };
939
- }, [disabled, floating, floatingFocusElement, returnFocusRef, dataRef, events, tree, isInsidePortal, domReference, getNodeId]);
940
- React.useEffect(() => {
941
- queueMicrotask(() => {
942
- preventReturnFocusRef.current = false;
943
- });
944
- }, [disabled]);
945
- index(() => {
946
- if (disabled) return;
947
- if (!portalContext) return;
948
- portalContext.setFocusManagerState({
949
- modal,
950
- closeOnFocusOut,
951
- open,
952
- onOpenChange,
953
- domReference
954
- });
955
- return () => {
956
- portalContext.setFocusManagerState(null);
957
- };
958
- }, [disabled, portalContext, modal, open, onOpenChange, closeOnFocusOut, domReference]);
959
- index(() => {
960
- if (disabled) return;
961
- if (!floatingFocusElement) return;
962
- if (typeof MutationObserver !== "function") return;
963
- if (ignoreInitialFocus) return;
964
- const handleMutation = () => {
965
- const tabIndex = floatingFocusElement.getAttribute("tabindex");
966
- const tabbableContent = getTabbableContent();
967
- const activeEl = activeElement(getDocument(floating));
968
- const tabbableIndex = tabbableContent.indexOf(activeEl);
969
- if (tabbableIndex !== -1) {
970
- tabbableIndexRef.current = tabbableIndex;
971
- }
972
- if (orderRef.current.includes("floating") || activeEl !== domReference && tabbableContent.length === 0) {
973
- if (tabIndex !== "0") {
974
- floatingFocusElement.setAttribute("tabindex", "0");
975
- }
976
- } else if (tabIndex !== "-1") {
977
- floatingFocusElement.setAttribute("tabindex", "-1");
978
- }
979
- };
980
- handleMutation();
981
- const observer = new MutationObserver(handleMutation);
982
- observer.observe(floatingFocusElement, {
983
- childList: true,
984
- subtree: true,
985
- attributes: true
986
- });
987
- return () => {
988
- observer.disconnect();
989
- };
990
- }, [disabled, floating, floatingFocusElement, domReference, orderRef, getTabbableContent, ignoreInitialFocus]);
991
- function renderDismissButton(location) {
992
- if (disabled || !visuallyHiddenDismiss || !modal) {
993
- return null;
994
- }
995
- return /* @__PURE__ */ jsxRuntimeExports.jsx(VisuallyHiddenDismiss, {
996
- ref: location === "start" ? startDismissButtonRef : endDismissButtonRef,
997
- onClick: (event) => onOpenChange(false, event.nativeEvent),
998
- children: typeof visuallyHiddenDismiss === "string" ? visuallyHiddenDismiss : "Dismiss"
999
- });
1000
- }
1001
- const shouldRenderGuards = !disabled && guards && (modal ? !isUntrappedTypeableCombobox : true) && (isInsidePortal || modal);
1002
- return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, {
1003
- children: [shouldRenderGuards && /* @__PURE__ */ jsxRuntimeExports.jsx(FocusGuard, {
1004
- "data-type": "inside",
1005
- ref: mergedBeforeGuardRef,
1006
- onFocus: (event) => {
1007
- if (modal) {
1008
- const els = getTabbableElements();
1009
- enqueueFocus(order[0] === "reference" ? els[0] : els[els.length - 1]);
1010
- } else if (portalContext != null && portalContext.preserveTabOrder && portalContext.portalNode) {
1011
- preventReturnFocusRef.current = false;
1012
- if (isOutsideEvent(event, portalContext.portalNode)) {
1013
- const nextTabbable = getNextTabbable(domReference);
1014
- nextTabbable == null || nextTabbable.focus();
1015
- } else {
1016
- var _portalContext$before;
1017
- (_portalContext$before = portalContext.beforeOutsideRef.current) == null || _portalContext$before.focus();
1018
- }
1019
- }
1020
- }
1021
- }), !isUntrappedTypeableCombobox && renderDismissButton("start"), children, renderDismissButton("end"), shouldRenderGuards && /* @__PURE__ */ jsxRuntimeExports.jsx(FocusGuard, {
1022
- "data-type": "inside",
1023
- ref: mergedAfterGuardRef,
1024
- onFocus: (event) => {
1025
- if (modal) {
1026
- enqueueFocus(getTabbableElements()[0]);
1027
- } else if (portalContext != null && portalContext.preserveTabOrder && portalContext.portalNode) {
1028
- if (closeOnFocusOut) {
1029
- preventReturnFocusRef.current = true;
1030
- }
1031
- if (isOutsideEvent(event, portalContext.portalNode)) {
1032
- const prevTabbable = getPreviousTabbable(domReference);
1033
- prevTabbable == null || prevTabbable.focus();
1034
- } else {
1035
- var _portalContext$afterO;
1036
- (_portalContext$afterO = portalContext.afterOutsideRef.current) == null || _portalContext$afterO.focus();
1037
- }
1038
- }
1039
- }
1040
- })]
1041
- });
1042
- }
1043
- const bubbleHandlerKeys = {
1044
- pointerdown: "onPointerDown",
1045
- mousedown: "onMouseDown",
1046
- click: "onClick"
1047
- };
1048
- const captureHandlerKeys = {
1049
- pointerdown: "onPointerDownCapture",
1050
- mousedown: "onMouseDownCapture",
1051
- click: "onClickCapture"
1052
- };
1053
- const normalizeProp = (normalizable) => {
1054
- var _normalizable$escapeK, _normalizable$outside;
1055
- return {
1056
- escapeKey: typeof normalizable === "boolean" ? normalizable : (_normalizable$escapeK = normalizable == null ? void 0 : normalizable.escapeKey) != null ? _normalizable$escapeK : false,
1057
- outsidePress: typeof normalizable === "boolean" ? normalizable : (_normalizable$outside = normalizable == null ? void 0 : normalizable.outsidePress) != null ? _normalizable$outside : true
1058
- };
1059
- };
1060
- function useDismiss(context, props) {
1061
- if (props === void 0) {
1062
- props = {};
1063
- }
1064
- const {
1065
- open,
1066
- onOpenChange,
1067
- elements,
1068
- dataRef
1069
- } = context;
1070
- const {
1071
- enabled = true,
1072
- escapeKey = true,
1073
- outsidePress: unstable_outsidePress = true,
1074
- outsidePressEvent = "pointerdown",
1075
- referencePress = false,
1076
- referencePressEvent = "pointerdown",
1077
- ancestorScroll = false,
1078
- bubbles,
1079
- capture
1080
- } = props;
1081
- const tree = useFloatingTree();
1082
- const outsidePressFn = useEffectEvent(typeof unstable_outsidePress === "function" ? unstable_outsidePress : () => false);
1083
- const outsidePress = typeof unstable_outsidePress === "function" ? outsidePressFn : unstable_outsidePress;
1084
- const insideReactTreeRef = React.useRef(false);
1085
- const endedOrStartedInsideRef = React.useRef(false);
1086
- const {
1087
- escapeKey: escapeKeyBubbles,
1088
- outsidePress: outsidePressBubbles
1089
- } = normalizeProp(bubbles);
1090
- const {
1091
- escapeKey: escapeKeyCapture,
1092
- outsidePress: outsidePressCapture
1093
- } = normalizeProp(capture);
1094
- const isComposingRef = React.useRef(false);
1095
- const closeOnEscapeKeyDown = useEffectEvent((event) => {
1096
- var _dataRef$current$floa;
1097
- if (!open || !enabled || !escapeKey || event.key !== "Escape") {
1098
- return;
1099
- }
1100
- if (isComposingRef.current) {
1101
- return;
1102
- }
1103
- const nodeId = (_dataRef$current$floa = dataRef.current.floatingContext) == null ? void 0 : _dataRef$current$floa.nodeId;
1104
- const children = tree ? getChildren(tree.nodesRef.current, nodeId) : [];
1105
- if (!escapeKeyBubbles) {
1106
- event.stopPropagation();
1107
- if (children.length > 0) {
1108
- let shouldDismiss = true;
1109
- children.forEach((child) => {
1110
- var _child$context;
1111
- if ((_child$context = child.context) != null && _child$context.open && !child.context.dataRef.current.__escapeKeyBubbles) {
1112
- shouldDismiss = false;
1113
- return;
1114
- }
1115
- });
1116
- if (!shouldDismiss) {
1117
- return;
1118
- }
1119
- }
1120
- }
1121
- onOpenChange(false, isReactEvent(event) ? event.nativeEvent : event, "escape-key");
1122
- });
1123
- const closeOnEscapeKeyDownCapture = useEffectEvent((event) => {
1124
- var _getTarget2;
1125
- const callback = () => {
1126
- var _getTarget;
1127
- closeOnEscapeKeyDown(event);
1128
- (_getTarget = getTarget(event)) == null || _getTarget.removeEventListener("keydown", callback);
1129
- };
1130
- (_getTarget2 = getTarget(event)) == null || _getTarget2.addEventListener("keydown", callback);
1131
- });
1132
- const closeOnPressOutside = useEffectEvent((event) => {
1133
- var _dataRef$current$floa2;
1134
- const insideReactTree = insideReactTreeRef.current;
1135
- insideReactTreeRef.current = false;
1136
- const endedOrStartedInside = endedOrStartedInsideRef.current;
1137
- endedOrStartedInsideRef.current = false;
1138
- if (outsidePressEvent === "click" && endedOrStartedInside) {
1139
- return;
1140
- }
1141
- if (insideReactTree) {
1142
- return;
1143
- }
1144
- if (typeof outsidePress === "function" && !outsidePress(event)) {
1145
- return;
1146
- }
1147
- const target = getTarget(event);
1148
- const inertSelector = "[" + createAttribute("inert") + "]";
1149
- const markers = getDocument(elements.floating).querySelectorAll(inertSelector);
1150
- let targetRootAncestor = isElement(target) ? target : null;
1151
- while (targetRootAncestor && !isLastTraversableNode(targetRootAncestor)) {
1152
- const nextParent = getParentNode(targetRootAncestor);
1153
- if (isLastTraversableNode(nextParent) || !isElement(nextParent)) {
1154
- break;
1155
- }
1156
- targetRootAncestor = nextParent;
1157
- }
1158
- if (markers.length && isElement(target) && !isRootElement(target) && // Clicked on a direct ancestor (e.g. FloatingOverlay).
1159
- !contains(target, elements.floating) && // If the target root element contains none of the markers, then the
1160
- // element was injected after the floating element rendered.
1161
- Array.from(markers).every((marker) => !contains(targetRootAncestor, marker))) {
1162
- return;
1163
- }
1164
- if (isHTMLElement(target) && floating) {
1165
- const lastTraversableNode = isLastTraversableNode(target);
1166
- const style = getComputedStyle(target);
1167
- const scrollRe = /auto|scroll/;
1168
- const isScrollableX = lastTraversableNode || scrollRe.test(style.overflowX);
1169
- const isScrollableY = lastTraversableNode || scrollRe.test(style.overflowY);
1170
- const canScrollX = isScrollableX && target.clientWidth > 0 && target.scrollWidth > target.clientWidth;
1171
- const canScrollY = isScrollableY && target.clientHeight > 0 && target.scrollHeight > target.clientHeight;
1172
- const isRTL = style.direction === "rtl";
1173
- const pressedVerticalScrollbar = canScrollY && (isRTL ? event.offsetX <= target.offsetWidth - target.clientWidth : event.offsetX > target.clientWidth);
1174
- const pressedHorizontalScrollbar = canScrollX && event.offsetY > target.clientHeight;
1175
- if (pressedVerticalScrollbar || pressedHorizontalScrollbar) {
1176
- return;
1177
- }
1178
- }
1179
- const nodeId = (_dataRef$current$floa2 = dataRef.current.floatingContext) == null ? void 0 : _dataRef$current$floa2.nodeId;
1180
- const targetIsInsideChildren = tree && getChildren(tree.nodesRef.current, nodeId).some((node) => {
1181
- var _node$context;
1182
- return isEventTargetWithin(event, (_node$context = node.context) == null ? void 0 : _node$context.elements.floating);
1183
- });
1184
- if (isEventTargetWithin(event, elements.floating) || isEventTargetWithin(event, elements.domReference) || targetIsInsideChildren) {
1185
- return;
1186
- }
1187
- const children = tree ? getChildren(tree.nodesRef.current, nodeId) : [];
1188
- if (children.length > 0) {
1189
- let shouldDismiss = true;
1190
- children.forEach((child) => {
1191
- var _child$context2;
1192
- if ((_child$context2 = child.context) != null && _child$context2.open && !child.context.dataRef.current.__outsidePressBubbles) {
1193
- shouldDismiss = false;
1194
- return;
1195
- }
1196
- });
1197
- if (!shouldDismiss) {
1198
- return;
1199
- }
1200
- }
1201
- onOpenChange(false, event, "outside-press");
1202
- });
1203
- const closeOnPressOutsideCapture = useEffectEvent((event) => {
1204
- var _getTarget4;
1205
- const callback = () => {
1206
- var _getTarget3;
1207
- closeOnPressOutside(event);
1208
- (_getTarget3 = getTarget(event)) == null || _getTarget3.removeEventListener(outsidePressEvent, callback);
1209
- };
1210
- (_getTarget4 = getTarget(event)) == null || _getTarget4.addEventListener(outsidePressEvent, callback);
1211
- });
1212
- React.useEffect(() => {
1213
- if (!open || !enabled) {
1214
- return;
1215
- }
1216
- dataRef.current.__escapeKeyBubbles = escapeKeyBubbles;
1217
- dataRef.current.__outsidePressBubbles = outsidePressBubbles;
1218
- let compositionTimeout = -1;
1219
- function onScroll(event) {
1220
- onOpenChange(false, event, "ancestor-scroll");
1221
- }
1222
- function handleCompositionStart() {
1223
- window.clearTimeout(compositionTimeout);
1224
- isComposingRef.current = true;
1225
- }
1226
- function handleCompositionEnd() {
1227
- compositionTimeout = window.setTimeout(
1228
- () => {
1229
- isComposingRef.current = false;
1230
- },
1231
- // 0ms or 1ms don't work in Safari. 5ms appears to consistently work.
1232
- // Only apply to WebKit for the test to remain 0ms.
1233
- isWebKit() ? 5 : 0
1234
- );
1235
- }
1236
- const doc = getDocument(elements.floating);
1237
- if (escapeKey) {
1238
- doc.addEventListener("keydown", escapeKeyCapture ? closeOnEscapeKeyDownCapture : closeOnEscapeKeyDown, escapeKeyCapture);
1239
- doc.addEventListener("compositionstart", handleCompositionStart);
1240
- doc.addEventListener("compositionend", handleCompositionEnd);
1241
- }
1242
- outsidePress && doc.addEventListener(outsidePressEvent, outsidePressCapture ? closeOnPressOutsideCapture : closeOnPressOutside, outsidePressCapture);
1243
- let ancestors = [];
1244
- if (ancestorScroll) {
1245
- if (isElement(elements.domReference)) {
1246
- ancestors = getOverflowAncestors(elements.domReference);
1247
- }
1248
- if (isElement(elements.floating)) {
1249
- ancestors = ancestors.concat(getOverflowAncestors(elements.floating));
1250
- }
1251
- if (!isElement(elements.reference) && elements.reference && elements.reference.contextElement) {
1252
- ancestors = ancestors.concat(getOverflowAncestors(elements.reference.contextElement));
1253
- }
1254
- }
1255
- ancestors = ancestors.filter((ancestor) => {
1256
- var _doc$defaultView;
1257
- return ancestor !== ((_doc$defaultView = doc.defaultView) == null ? void 0 : _doc$defaultView.visualViewport);
1258
- });
1259
- ancestors.forEach((ancestor) => {
1260
- ancestor.addEventListener("scroll", onScroll, {
1261
- passive: true
1262
- });
1263
- });
1264
- return () => {
1265
- if (escapeKey) {
1266
- doc.removeEventListener("keydown", escapeKeyCapture ? closeOnEscapeKeyDownCapture : closeOnEscapeKeyDown, escapeKeyCapture);
1267
- doc.removeEventListener("compositionstart", handleCompositionStart);
1268
- doc.removeEventListener("compositionend", handleCompositionEnd);
1269
- }
1270
- outsidePress && doc.removeEventListener(outsidePressEvent, outsidePressCapture ? closeOnPressOutsideCapture : closeOnPressOutside, outsidePressCapture);
1271
- ancestors.forEach((ancestor) => {
1272
- ancestor.removeEventListener("scroll", onScroll);
1273
- });
1274
- window.clearTimeout(compositionTimeout);
1275
- };
1276
- }, [dataRef, elements, escapeKey, outsidePress, outsidePressEvent, open, onOpenChange, ancestorScroll, enabled, escapeKeyBubbles, outsidePressBubbles, closeOnEscapeKeyDown, escapeKeyCapture, closeOnEscapeKeyDownCapture, closeOnPressOutside, outsidePressCapture, closeOnPressOutsideCapture]);
1277
- React.useEffect(() => {
1278
- insideReactTreeRef.current = false;
1279
- }, [outsidePress, outsidePressEvent]);
1280
- const reference = React.useMemo(() => ({
1281
- onKeyDown: closeOnEscapeKeyDown,
1282
- ...referencePress && {
1283
- [bubbleHandlerKeys[referencePressEvent]]: (event) => {
1284
- onOpenChange(false, event.nativeEvent, "reference-press");
1285
- },
1286
- ...referencePressEvent !== "click" && {
1287
- onClick(event) {
1288
- onOpenChange(false, event.nativeEvent, "reference-press");
1289
- }
1290
- }
1291
- }
1292
- }), [closeOnEscapeKeyDown, onOpenChange, referencePress, referencePressEvent]);
1293
- const floating = React.useMemo(() => ({
1294
- onKeyDown: closeOnEscapeKeyDown,
1295
- onMouseDown() {
1296
- endedOrStartedInsideRef.current = true;
1297
- },
1298
- onMouseUp() {
1299
- endedOrStartedInsideRef.current = true;
1300
- },
1301
- [captureHandlerKeys[outsidePressEvent]]: () => {
1302
- insideReactTreeRef.current = true;
1303
- }
1304
- }), [closeOnEscapeKeyDown, outsidePressEvent]);
1305
- return React.useMemo(() => enabled ? {
1306
- reference,
1307
- floating
1308
- } : {}, [enabled, reference, floating]);
1309
- }
1310
- function useFloatingRootContext(options) {
1311
- const {
1312
- open = false,
1313
- onOpenChange: onOpenChangeProp,
1314
- elements: elementsProp
1315
- } = options;
1316
- const floatingId = useId();
1317
- const dataRef = React.useRef({});
1318
- const [events] = React.useState(() => createPubSub());
1319
- const nested = useFloatingParentNodeId() != null;
1320
- if (process.env.NODE_ENV !== "production") {
1321
- const optionDomReference = elementsProp.reference;
1322
- if (optionDomReference && !isElement(optionDomReference)) {
1323
- error("Cannot pass a virtual element to the `elements.reference` option,", "as it must be a real DOM element. Use `refs.setPositionReference()`", "instead.");
1324
- }
1325
- }
1326
- const [positionReference, setPositionReference] = React.useState(elementsProp.reference);
1327
- const onOpenChange = useEffectEvent((open2, event, reason) => {
1328
- dataRef.current.openEvent = open2 ? event : void 0;
1329
- events.emit("openchange", {
1330
- open: open2,
1331
- event,
1332
- reason,
1333
- nested
1334
- });
1335
- onOpenChangeProp == null || onOpenChangeProp(open2, event, reason);
1336
- });
1337
- const refs = React.useMemo(() => ({
1338
- setPositionReference
1339
- }), []);
1340
- const elements = React.useMemo(() => ({
1341
- reference: positionReference || elementsProp.reference || null,
1342
- floating: elementsProp.floating || null,
1343
- domReference: elementsProp.reference
1344
- }), [positionReference, elementsProp.reference, elementsProp.floating]);
1345
- return React.useMemo(() => ({
1346
- dataRef,
1347
- open,
1348
- onOpenChange,
1349
- elements,
1350
- events,
1351
- floatingId,
1352
- refs
1353
- }), [open, onOpenChange, elements, events, floatingId, refs]);
1354
- }
1355
- function useFloating(options) {
1356
- if (options === void 0) {
1357
- options = {};
1358
- }
1359
- const {
1360
- nodeId
1361
- } = options;
1362
- const internalRootContext = useFloatingRootContext({
1363
- ...options,
1364
- elements: {
1365
- reference: null,
1366
- floating: null,
1367
- ...options.elements
1368
- }
1369
- });
1370
- const rootContext = options.rootContext || internalRootContext;
1371
- const computedElements = rootContext.elements;
1372
- const [_domReference, setDomReference] = React.useState(null);
1373
- const [positionReference, _setPositionReference] = React.useState(null);
1374
- const optionDomReference = computedElements == null ? void 0 : computedElements.domReference;
1375
- const domReference = optionDomReference || _domReference;
1376
- const domReferenceRef = React.useRef(null);
1377
- const tree = useFloatingTree();
1378
- index(() => {
1379
- if (domReference) {
1380
- domReferenceRef.current = domReference;
1381
- }
1382
- }, [domReference]);
1383
- const position = useFloating$1({
1384
- ...options,
1385
- elements: {
1386
- ...computedElements,
1387
- ...positionReference && {
1388
- reference: positionReference
1389
- }
1390
- }
1391
- });
1392
- const setPositionReference = React.useCallback((node) => {
1393
- const computedPositionReference = isElement(node) ? {
1394
- getBoundingClientRect: () => node.getBoundingClientRect(),
1395
- getClientRects: () => node.getClientRects(),
1396
- contextElement: node
1397
- } : node;
1398
- _setPositionReference(computedPositionReference);
1399
- position.refs.setReference(computedPositionReference);
1400
- }, [position.refs]);
1401
- const setReference = React.useCallback((node) => {
1402
- if (isElement(node) || node === null) {
1403
- domReferenceRef.current = node;
1404
- setDomReference(node);
1405
- }
1406
- if (isElement(position.refs.reference.current) || position.refs.reference.current === null || // Don't allow setting virtual elements using the old technique back to
1407
- // `null` to support `positionReference` + an unstable `reference`
1408
- // callback ref.
1409
- node !== null && !isElement(node)) {
1410
- position.refs.setReference(node);
1411
- }
1412
- }, [position.refs]);
1413
- const refs = React.useMemo(() => ({
1414
- ...position.refs,
1415
- setReference,
1416
- setPositionReference,
1417
- domReference: domReferenceRef
1418
- }), [position.refs, setReference, setPositionReference]);
1419
- const elements = React.useMemo(() => ({
1420
- ...position.elements,
1421
- domReference
1422
- }), [position.elements, domReference]);
1423
- const context = React.useMemo(() => ({
1424
- ...position,
1425
- ...rootContext,
1426
- refs,
1427
- elements,
1428
- nodeId
1429
- }), [position, refs, elements, nodeId, rootContext]);
1430
- index(() => {
1431
- rootContext.dataRef.current.floatingContext = context;
1432
- const node = tree == null ? void 0 : tree.nodesRef.current.find((node2) => node2.id === nodeId);
1433
- if (node) {
1434
- node.context = context;
1435
- }
1436
- });
1437
- return React.useMemo(() => ({
1438
- ...position,
1439
- context,
1440
- refs,
1441
- elements
1442
- }), [position, refs, elements, context]);
1443
- }
1444
- const ACTIVE_KEY = "active";
1445
- const SELECTED_KEY = "selected";
1446
- function mergeProps(userProps, propsList, elementKey) {
1447
- const map = /* @__PURE__ */ new Map();
1448
- const isItem = elementKey === "item";
1449
- let domUserProps = userProps;
1450
- if (isItem && userProps) {
1451
- const {
1452
- [ACTIVE_KEY]: _,
1453
- [SELECTED_KEY]: __,
1454
- ...validProps
1455
- } = userProps;
1456
- domUserProps = validProps;
1457
- }
1458
- return {
1459
- ...elementKey === "floating" && {
1460
- tabIndex: -1,
1461
- [FOCUSABLE_ATTRIBUTE]: ""
1462
- },
1463
- ...domUserProps,
1464
- ...propsList.map((value) => {
1465
- const propsOrGetProps = value ? value[elementKey] : null;
1466
- if (typeof propsOrGetProps === "function") {
1467
- return userProps ? propsOrGetProps(userProps) : null;
1468
- }
1469
- return propsOrGetProps;
1470
- }).concat(userProps).reduce((acc, props) => {
1471
- if (!props) {
1472
- return acc;
1473
- }
1474
- Object.entries(props).forEach((_ref) => {
1475
- let [key, value] = _ref;
1476
- if (isItem && [ACTIVE_KEY, SELECTED_KEY].includes(key)) {
1477
- return;
1478
- }
1479
- if (key.indexOf("on") === 0) {
1480
- if (!map.has(key)) {
1481
- map.set(key, []);
1482
- }
1483
- if (typeof value === "function") {
1484
- var _map$get;
1485
- (_map$get = map.get(key)) == null || _map$get.push(value);
1486
- acc[key] = function() {
1487
- var _map$get2;
1488
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
1489
- args[_key] = arguments[_key];
1490
- }
1491
- return (_map$get2 = map.get(key)) == null ? void 0 : _map$get2.map((fn) => fn(...args)).find((val) => val !== void 0);
1492
- };
1493
- }
1494
- } else {
1495
- acc[key] = value;
1496
- }
1497
- });
1498
- return acc;
1499
- }, {})
1500
- };
1501
- }
1502
- function useInteractions(propsList) {
1503
- if (propsList === void 0) {
1504
- propsList = [];
1505
- }
1506
- const referenceDeps = propsList.map((key) => key == null ? void 0 : key.reference);
1507
- const floatingDeps = propsList.map((key) => key == null ? void 0 : key.floating);
1508
- const itemDeps = propsList.map((key) => key == null ? void 0 : key.item);
1509
- const getReferenceProps = React.useCallback(
1510
- (userProps) => mergeProps(userProps, propsList, "reference"),
1511
- // eslint-disable-next-line react-hooks/exhaustive-deps
1512
- referenceDeps
1513
- );
1514
- const getFloatingProps = React.useCallback(
1515
- (userProps) => mergeProps(userProps, propsList, "floating"),
1516
- // eslint-disable-next-line react-hooks/exhaustive-deps
1517
- floatingDeps
1518
- );
1519
- const getItemProps = React.useCallback(
1520
- (userProps) => mergeProps(userProps, propsList, "item"),
1521
- // eslint-disable-next-line react-hooks/exhaustive-deps
1522
- itemDeps
1523
- );
1524
- return React.useMemo(() => ({
1525
- getReferenceProps,
1526
- getFloatingProps,
1527
- getItemProps
1528
- }), [getReferenceProps, getFloatingProps, getItemProps]);
1529
- }
1530
- const componentRoleToAriaRoleMap = /* @__PURE__ */ new Map([["select", "listbox"], ["combobox", "listbox"], ["label", false]]);
1531
- function useRole(context, props) {
1532
- var _componentRoleToAriaR;
1533
- if (props === void 0) {
1534
- props = {};
1535
- }
1536
- const {
1537
- open,
1538
- floatingId
1539
- } = context;
1540
- const {
1541
- enabled = true,
1542
- role = "dialog"
1543
- } = props;
1544
- const ariaRole = (_componentRoleToAriaR = componentRoleToAriaRoleMap.get(role)) != null ? _componentRoleToAriaR : role;
1545
- const referenceId = useId();
1546
- const parentId = useFloatingParentNodeId();
1547
- const isNested = parentId != null;
1548
- const reference = React.useMemo(() => {
1549
- if (ariaRole === "tooltip" || role === "label") {
1550
- return {
1551
- ["aria-" + (role === "label" ? "labelledby" : "describedby")]: open ? floatingId : void 0
1552
- };
1553
- }
1554
- return {
1555
- "aria-expanded": open ? "true" : "false",
1556
- "aria-haspopup": ariaRole === "alertdialog" ? "dialog" : ariaRole,
1557
- "aria-controls": open ? floatingId : void 0,
1558
- ...ariaRole === "listbox" && {
1559
- role: "combobox"
1560
- },
1561
- ...ariaRole === "menu" && {
1562
- id: referenceId
1563
- },
1564
- ...ariaRole === "menu" && isNested && {
1565
- role: "menuitem"
1566
- },
1567
- ...role === "select" && {
1568
- "aria-autocomplete": "none"
1569
- },
1570
- ...role === "combobox" && {
1571
- "aria-autocomplete": "list"
1572
- }
1573
- };
1574
- }, [ariaRole, floatingId, isNested, open, referenceId, role]);
1575
- const floating = React.useMemo(() => {
1576
- const floatingProps = {
1577
- id: floatingId,
1578
- ...ariaRole && {
1579
- role: ariaRole
1580
- }
1581
- };
1582
- if (ariaRole === "tooltip" || role === "label") {
1583
- return floatingProps;
1584
- }
1585
- return {
1586
- ...floatingProps,
1587
- ...ariaRole === "menu" && {
1588
- "aria-labelledby": referenceId
1589
- }
1590
- };
1591
- }, [ariaRole, floatingId, referenceId, role]);
1592
- const item = React.useCallback((_ref) => {
1593
- let {
1594
- active,
1595
- selected
1596
- } = _ref;
1597
- const commonProps = {
1598
- role: "option",
1599
- ...active && {
1600
- id: floatingId + "-option"
1601
- }
1602
- };
1603
- switch (role) {
1604
- case "select":
1605
- return {
1606
- ...commonProps,
1607
- "aria-selected": active && selected
1608
- };
1609
- case "combobox": {
1610
- return {
1611
- ...commonProps,
1612
- ...active && {
1613
- "aria-selected": true
1614
- }
1615
- };
1616
- }
1617
- }
1618
- return {};
1619
- }, [floatingId, role]);
1620
- return React.useMemo(() => enabled ? {
1621
- reference,
1622
- floating,
1623
- item
1624
- } : {}, [enabled, reference, floating, item]);
1625
- }
1626
- export {
1627
- FloatingArrow,
1628
- FloatingFocusManager,
1629
- FloatingPortal,
1630
- arrow,
1631
- flip,
1632
- getOverflowAncestors,
1633
- inline,
1634
- offset,
1635
- shift,
1636
- useDismiss,
1637
- useFloating,
1638
- useFloatingParentNodeId,
1639
- useFloatingPortalNode,
1640
- useFloatingRootContext,
1641
- useFloatingTree,
1642
- useId,
1643
- useInteractions,
1644
- useRole
1645
- };
1646
- //# sourceMappingURL=react-text-annotator.es14.js.map