@soomo/react-text-annotator 3.0.0-staging.41 → 3.0.0-staging.42

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