@teamturing/react-kit 2.11.0 → 2.13.0

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 (28) hide show
  1. package/dist/core/Button/index.d.ts +2 -2
  2. package/dist/core/IconButton/index.d.ts +2 -2
  3. package/dist/core/Overlay/index.d.ts +18 -0
  4. package/dist/core/OverlayPopper/index.d.ts +16 -0
  5. package/dist/hook/useFocusTrap.d.ts +13 -0
  6. package/dist/hook/useFocusZone.d.ts +15 -0
  7. package/dist/index.d.ts +8 -0
  8. package/dist/index.js +2523 -164
  9. package/esm/core/Button/index.js +2 -2
  10. package/esm/core/Dialog/index.js +8 -36
  11. package/esm/core/IconButton/index.js +1 -1
  12. package/esm/core/Overlay/index.js +92 -0
  13. package/esm/core/OverlayPopper/index.js +69 -0
  14. package/esm/hook/useFocusTrap.js +39 -0
  15. package/esm/hook/useFocusZone.js +35 -0
  16. package/esm/index.js +6 -0
  17. package/esm/node_modules/@floating-ui/core/dist/floating-ui.core.js +475 -0
  18. package/esm/node_modules/@floating-ui/dom/dist/floating-ui.dom.js +599 -0
  19. package/esm/node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js +229 -0
  20. package/esm/node_modules/@floating-ui/utils/dist/floating-ui.utils.js +121 -0
  21. package/esm/node_modules/@floating-ui/utils/dom/dist/floating-ui.utils.dom.js +128 -0
  22. package/esm/node_modules/@primer/behaviors/dist/esm/focus-trap.js +105 -0
  23. package/esm/node_modules/@primer/behaviors/dist/esm/focus-zone.js +436 -0
  24. package/esm/node_modules/@primer/behaviors/dist/esm/polyfills/event-listener-signal.js +38 -0
  25. package/esm/node_modules/@primer/behaviors/dist/esm/utils/iterate-focusable-elements.js +65 -0
  26. package/esm/node_modules/@primer/behaviors/dist/esm/utils/unique-id.js +6 -0
  27. package/esm/node_modules/@primer/behaviors/dist/esm/utils/user-agent.js +9 -0
  28. package/package.json +5 -2
@@ -0,0 +1,599 @@
1
+ import { computePosition as computePosition$1 } from '../../core/dist/floating-ui.core.js';
2
+ export { detectOverflow, flip, offset, shift } from '../../core/dist/floating-ui.core.js';
3
+ import { createCoords, rectToClientRect, round, floor, max, min } from '../../utils/dist/floating-ui.utils.js';
4
+ import { getOverflowAncestors, isElement, getWindow, getComputedStyle, getDocumentElement, isHTMLElement, isWebKit, getNodeName, isOverflowElement, getNodeScroll, isTableElement, isContainingBlock, getContainingBlock, getParentNode, isLastTraversableNode } from '../../utils/dom/dist/floating-ui.utils.dom.js';
5
+
6
+ function getCssDimensions(element) {
7
+ const css = getComputedStyle(element);
8
+ // In testing environments, the `width` and `height` properties are empty
9
+ // strings for SVG elements, returning NaN. Fallback to `0` in this case.
10
+ let width = parseFloat(css.width) || 0;
11
+ let height = parseFloat(css.height) || 0;
12
+ const hasOffset = isHTMLElement(element);
13
+ const offsetWidth = hasOffset ? element.offsetWidth : width;
14
+ const offsetHeight = hasOffset ? element.offsetHeight : height;
15
+ const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
16
+ if (shouldFallback) {
17
+ width = offsetWidth;
18
+ height = offsetHeight;
19
+ }
20
+ return {
21
+ width,
22
+ height,
23
+ $: shouldFallback
24
+ };
25
+ }
26
+
27
+ function unwrapElement(element) {
28
+ return !isElement(element) ? element.contextElement : element;
29
+ }
30
+
31
+ function getScale(element) {
32
+ const domElement = unwrapElement(element);
33
+ if (!isHTMLElement(domElement)) {
34
+ return createCoords(1);
35
+ }
36
+ const rect = domElement.getBoundingClientRect();
37
+ const {
38
+ width,
39
+ height,
40
+ $
41
+ } = getCssDimensions(domElement);
42
+ let x = ($ ? round(rect.width) : rect.width) / width;
43
+ let y = ($ ? round(rect.height) : rect.height) / height;
44
+
45
+ // 0, NaN, or Infinity should always fallback to 1.
46
+
47
+ if (!x || !Number.isFinite(x)) {
48
+ x = 1;
49
+ }
50
+ if (!y || !Number.isFinite(y)) {
51
+ y = 1;
52
+ }
53
+ return {
54
+ x,
55
+ y
56
+ };
57
+ }
58
+
59
+ const noOffsets = /*#__PURE__*/createCoords(0);
60
+ function getVisualOffsets(element) {
61
+ const win = getWindow(element);
62
+ if (!isWebKit() || !win.visualViewport) {
63
+ return noOffsets;
64
+ }
65
+ return {
66
+ x: win.visualViewport.offsetLeft,
67
+ y: win.visualViewport.offsetTop
68
+ };
69
+ }
70
+ function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
71
+ if (isFixed === void 0) {
72
+ isFixed = false;
73
+ }
74
+ if (!floatingOffsetParent || isFixed && floatingOffsetParent !== getWindow(element)) {
75
+ return false;
76
+ }
77
+ return isFixed;
78
+ }
79
+
80
+ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
81
+ if (includeScale === void 0) {
82
+ includeScale = false;
83
+ }
84
+ if (isFixedStrategy === void 0) {
85
+ isFixedStrategy = false;
86
+ }
87
+ const clientRect = element.getBoundingClientRect();
88
+ const domElement = unwrapElement(element);
89
+ let scale = createCoords(1);
90
+ if (includeScale) {
91
+ if (offsetParent) {
92
+ if (isElement(offsetParent)) {
93
+ scale = getScale(offsetParent);
94
+ }
95
+ } else {
96
+ scale = getScale(element);
97
+ }
98
+ }
99
+ const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
100
+ let x = (clientRect.left + visualOffsets.x) / scale.x;
101
+ let y = (clientRect.top + visualOffsets.y) / scale.y;
102
+ let width = clientRect.width / scale.x;
103
+ let height = clientRect.height / scale.y;
104
+ if (domElement) {
105
+ const win = getWindow(domElement);
106
+ const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
107
+ let currentIFrame = win.frameElement;
108
+ while (currentIFrame && offsetParent && offsetWin !== win) {
109
+ const iframeScale = getScale(currentIFrame);
110
+ const iframeRect = currentIFrame.getBoundingClientRect();
111
+ const css = getComputedStyle(currentIFrame);
112
+ const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
113
+ const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
114
+ x *= iframeScale.x;
115
+ y *= iframeScale.y;
116
+ width *= iframeScale.x;
117
+ height *= iframeScale.y;
118
+ x += left;
119
+ y += top;
120
+ currentIFrame = getWindow(currentIFrame).frameElement;
121
+ }
122
+ }
123
+ return rectToClientRect({
124
+ width,
125
+ height,
126
+ x,
127
+ y
128
+ });
129
+ }
130
+
131
+ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
132
+ let {
133
+ rect,
134
+ offsetParent,
135
+ strategy
136
+ } = _ref;
137
+ const isOffsetParentAnElement = isHTMLElement(offsetParent);
138
+ const documentElement = getDocumentElement(offsetParent);
139
+ if (offsetParent === documentElement) {
140
+ return rect;
141
+ }
142
+ let scroll = {
143
+ scrollLeft: 0,
144
+ scrollTop: 0
145
+ };
146
+ let scale = createCoords(1);
147
+ const offsets = createCoords(0);
148
+ if (isOffsetParentAnElement || !isOffsetParentAnElement && strategy !== 'fixed') {
149
+ if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
150
+ scroll = getNodeScroll(offsetParent);
151
+ }
152
+ if (isHTMLElement(offsetParent)) {
153
+ const offsetRect = getBoundingClientRect(offsetParent);
154
+ scale = getScale(offsetParent);
155
+ offsets.x = offsetRect.x + offsetParent.clientLeft;
156
+ offsets.y = offsetRect.y + offsetParent.clientTop;
157
+ }
158
+ }
159
+ return {
160
+ width: rect.width * scale.x,
161
+ height: rect.height * scale.y,
162
+ x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x,
163
+ y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y
164
+ };
165
+ }
166
+
167
+ function getClientRects(element) {
168
+ return Array.from(element.getClientRects());
169
+ }
170
+
171
+ function getWindowScrollBarX(element) {
172
+ // If <html> has a CSS width greater than the viewport, then this will be
173
+ // incorrect for RTL.
174
+ return getBoundingClientRect(getDocumentElement(element)).left + getNodeScroll(element).scrollLeft;
175
+ }
176
+
177
+ // Gets the entire size of the scrollable document area, even extending outside
178
+ // of the `<html>` and `<body>` rect bounds if horizontally scrollable.
179
+ function getDocumentRect(element) {
180
+ const html = getDocumentElement(element);
181
+ const scroll = getNodeScroll(element);
182
+ const body = element.ownerDocument.body;
183
+ const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
184
+ const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
185
+ let x = -scroll.scrollLeft + getWindowScrollBarX(element);
186
+ const y = -scroll.scrollTop;
187
+ if (getComputedStyle(body).direction === 'rtl') {
188
+ x += max(html.clientWidth, body.clientWidth) - width;
189
+ }
190
+ return {
191
+ width,
192
+ height,
193
+ x,
194
+ y
195
+ };
196
+ }
197
+
198
+ function getViewportRect(element, strategy) {
199
+ const win = getWindow(element);
200
+ const html = getDocumentElement(element);
201
+ const visualViewport = win.visualViewport;
202
+ let width = html.clientWidth;
203
+ let height = html.clientHeight;
204
+ let x = 0;
205
+ let y = 0;
206
+ if (visualViewport) {
207
+ width = visualViewport.width;
208
+ height = visualViewport.height;
209
+ const visualViewportBased = isWebKit();
210
+ if (!visualViewportBased || visualViewportBased && strategy === 'fixed') {
211
+ x = visualViewport.offsetLeft;
212
+ y = visualViewport.offsetTop;
213
+ }
214
+ }
215
+ return {
216
+ width,
217
+ height,
218
+ x,
219
+ y
220
+ };
221
+ }
222
+
223
+ // Returns the inner client rect, subtracting scrollbars if present.
224
+ function getInnerBoundingClientRect(element, strategy) {
225
+ const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
226
+ const top = clientRect.top + element.clientTop;
227
+ const left = clientRect.left + element.clientLeft;
228
+ const scale = isHTMLElement(element) ? getScale(element) : createCoords(1);
229
+ const width = element.clientWidth * scale.x;
230
+ const height = element.clientHeight * scale.y;
231
+ const x = left * scale.x;
232
+ const y = top * scale.y;
233
+ return {
234
+ width,
235
+ height,
236
+ x,
237
+ y
238
+ };
239
+ }
240
+ function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
241
+ let rect;
242
+ if (clippingAncestor === 'viewport') {
243
+ rect = getViewportRect(element, strategy);
244
+ } else if (clippingAncestor === 'document') {
245
+ rect = getDocumentRect(getDocumentElement(element));
246
+ } else if (isElement(clippingAncestor)) {
247
+ rect = getInnerBoundingClientRect(clippingAncestor, strategy);
248
+ } else {
249
+ const visualOffsets = getVisualOffsets(element);
250
+ rect = {
251
+ ...clippingAncestor,
252
+ x: clippingAncestor.x - visualOffsets.x,
253
+ y: clippingAncestor.y - visualOffsets.y
254
+ };
255
+ }
256
+ return rectToClientRect(rect);
257
+ }
258
+ function hasFixedPositionAncestor(element, stopNode) {
259
+ const parentNode = getParentNode(element);
260
+ if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) {
261
+ return false;
262
+ }
263
+ return getComputedStyle(parentNode).position === 'fixed' || hasFixedPositionAncestor(parentNode, stopNode);
264
+ }
265
+
266
+ // A "clipping ancestor" is an `overflow` element with the characteristic of
267
+ // clipping (or hiding) child elements. This returns all clipping ancestors
268
+ // of the given element up the tree.
269
+ function getClippingElementAncestors(element, cache) {
270
+ const cachedResult = cache.get(element);
271
+ if (cachedResult) {
272
+ return cachedResult;
273
+ }
274
+ let result = getOverflowAncestors(element, [], false).filter(el => isElement(el) && getNodeName(el) !== 'body');
275
+ let currentContainingBlockComputedStyle = null;
276
+ const elementIsFixed = getComputedStyle(element).position === 'fixed';
277
+ let currentNode = elementIsFixed ? getParentNode(element) : element;
278
+
279
+ // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
280
+ while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
281
+ const computedStyle = getComputedStyle(currentNode);
282
+ const currentNodeIsContaining = isContainingBlock(currentNode);
283
+ if (!currentNodeIsContaining && computedStyle.position === 'fixed') {
284
+ currentContainingBlockComputedStyle = null;
285
+ }
286
+ const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && ['absolute', 'fixed'].includes(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
287
+ if (shouldDropCurrentNode) {
288
+ // Drop non-containing blocks.
289
+ result = result.filter(ancestor => ancestor !== currentNode);
290
+ } else {
291
+ // Record last containing block for next iteration.
292
+ currentContainingBlockComputedStyle = computedStyle;
293
+ }
294
+ currentNode = getParentNode(currentNode);
295
+ }
296
+ cache.set(element, result);
297
+ return result;
298
+ }
299
+
300
+ // Gets the maximum area that the element is visible in due to any number of
301
+ // clipping ancestors.
302
+ function getClippingRect(_ref) {
303
+ let {
304
+ element,
305
+ boundary,
306
+ rootBoundary,
307
+ strategy
308
+ } = _ref;
309
+ const elementClippingAncestors = boundary === 'clippingAncestors' ? getClippingElementAncestors(element, this._c) : [].concat(boundary);
310
+ const clippingAncestors = [...elementClippingAncestors, rootBoundary];
311
+ const firstClippingAncestor = clippingAncestors[0];
312
+ const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
313
+ const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
314
+ accRect.top = max(rect.top, accRect.top);
315
+ accRect.right = min(rect.right, accRect.right);
316
+ accRect.bottom = min(rect.bottom, accRect.bottom);
317
+ accRect.left = max(rect.left, accRect.left);
318
+ return accRect;
319
+ }, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
320
+ return {
321
+ width: clippingRect.right - clippingRect.left,
322
+ height: clippingRect.bottom - clippingRect.top,
323
+ x: clippingRect.left,
324
+ y: clippingRect.top
325
+ };
326
+ }
327
+
328
+ function getDimensions(element) {
329
+ return getCssDimensions(element);
330
+ }
331
+
332
+ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
333
+ const isOffsetParentAnElement = isHTMLElement(offsetParent);
334
+ const documentElement = getDocumentElement(offsetParent);
335
+ const isFixed = strategy === 'fixed';
336
+ const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
337
+ let scroll = {
338
+ scrollLeft: 0,
339
+ scrollTop: 0
340
+ };
341
+ const offsets = createCoords(0);
342
+ if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
343
+ if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
344
+ scroll = getNodeScroll(offsetParent);
345
+ }
346
+ if (isOffsetParentAnElement) {
347
+ const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
348
+ offsets.x = offsetRect.x + offsetParent.clientLeft;
349
+ offsets.y = offsetRect.y + offsetParent.clientTop;
350
+ } else if (documentElement) {
351
+ offsets.x = getWindowScrollBarX(documentElement);
352
+ }
353
+ }
354
+ return {
355
+ x: rect.left + scroll.scrollLeft - offsets.x,
356
+ y: rect.top + scroll.scrollTop - offsets.y,
357
+ width: rect.width,
358
+ height: rect.height
359
+ };
360
+ }
361
+
362
+ function getTrueOffsetParent(element, polyfill) {
363
+ if (!isHTMLElement(element) || getComputedStyle(element).position === 'fixed') {
364
+ return null;
365
+ }
366
+ if (polyfill) {
367
+ return polyfill(element);
368
+ }
369
+ return element.offsetParent;
370
+ }
371
+
372
+ // Gets the closest ancestor positioned element. Handles some edge cases,
373
+ // such as table ancestors and cross browser bugs.
374
+ function getOffsetParent(element, polyfill) {
375
+ const window = getWindow(element);
376
+ if (!isHTMLElement(element)) {
377
+ return window;
378
+ }
379
+ let offsetParent = getTrueOffsetParent(element, polyfill);
380
+ while (offsetParent && isTableElement(offsetParent) && getComputedStyle(offsetParent).position === 'static') {
381
+ offsetParent = getTrueOffsetParent(offsetParent, polyfill);
382
+ }
383
+ if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle(offsetParent).position === 'static' && !isContainingBlock(offsetParent))) {
384
+ return window;
385
+ }
386
+ return offsetParent || getContainingBlock(element) || window;
387
+ }
388
+
389
+ const getElementRects = async function (_ref) {
390
+ let {
391
+ reference,
392
+ floating,
393
+ strategy
394
+ } = _ref;
395
+ const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
396
+ const getDimensionsFn = this.getDimensions;
397
+ return {
398
+ reference: getRectRelativeToOffsetParent(reference, await getOffsetParentFn(floating), strategy),
399
+ floating: {
400
+ x: 0,
401
+ y: 0,
402
+ ...(await getDimensionsFn(floating))
403
+ }
404
+ };
405
+ };
406
+
407
+ function isRTL(element) {
408
+ return getComputedStyle(element).direction === 'rtl';
409
+ }
410
+
411
+ const platform = {
412
+ convertOffsetParentRelativeRectToViewportRelativeRect,
413
+ getDocumentElement,
414
+ getClippingRect,
415
+ getOffsetParent,
416
+ getElementRects,
417
+ getClientRects,
418
+ getDimensions,
419
+ getScale,
420
+ isElement,
421
+ isRTL
422
+ };
423
+
424
+ // https://samthor.au/2021/observing-dom/
425
+ function observeMove(element, onMove) {
426
+ let io = null;
427
+ let timeoutId;
428
+ const root = getDocumentElement(element);
429
+ function cleanup() {
430
+ clearTimeout(timeoutId);
431
+ io && io.disconnect();
432
+ io = null;
433
+ }
434
+ function refresh(skip, threshold) {
435
+ if (skip === void 0) {
436
+ skip = false;
437
+ }
438
+ if (threshold === void 0) {
439
+ threshold = 1;
440
+ }
441
+ cleanup();
442
+ const {
443
+ left,
444
+ top,
445
+ width,
446
+ height
447
+ } = element.getBoundingClientRect();
448
+ if (!skip) {
449
+ onMove();
450
+ }
451
+ if (!width || !height) {
452
+ return;
453
+ }
454
+ const insetTop = floor(top);
455
+ const insetRight = floor(root.clientWidth - (left + width));
456
+ const insetBottom = floor(root.clientHeight - (top + height));
457
+ const insetLeft = floor(left);
458
+ const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px";
459
+ const options = {
460
+ rootMargin,
461
+ threshold: max(0, min(1, threshold)) || 1
462
+ };
463
+ let isFirstUpdate = true;
464
+ function handleObserve(entries) {
465
+ const ratio = entries[0].intersectionRatio;
466
+ if (ratio !== threshold) {
467
+ if (!isFirstUpdate) {
468
+ return refresh();
469
+ }
470
+ if (!ratio) {
471
+ timeoutId = setTimeout(() => {
472
+ refresh(false, 1e-7);
473
+ }, 100);
474
+ } else {
475
+ refresh(false, ratio);
476
+ }
477
+ }
478
+ isFirstUpdate = false;
479
+ }
480
+
481
+ // Older browsers don't support a `document` as the root and will throw an
482
+ // error.
483
+ try {
484
+ io = new IntersectionObserver(handleObserve, {
485
+ ...options,
486
+ // Handle <iframe>s
487
+ root: root.ownerDocument
488
+ });
489
+ } catch (e) {
490
+ io = new IntersectionObserver(handleObserve, options);
491
+ }
492
+ io.observe(element);
493
+ }
494
+ refresh(true);
495
+ return cleanup;
496
+ }
497
+
498
+ /**
499
+ * Automatically updates the position of the floating element when necessary.
500
+ * Should only be called when the floating element is mounted on the DOM or
501
+ * visible on the screen.
502
+ * @returns cleanup function that should be invoked when the floating element is
503
+ * removed from the DOM or hidden from the screen.
504
+ * @see https://floating-ui.com/docs/autoUpdate
505
+ */
506
+ function autoUpdate(reference, floating, update, options) {
507
+ if (options === void 0) {
508
+ options = {};
509
+ }
510
+ const {
511
+ ancestorScroll = true,
512
+ ancestorResize = true,
513
+ elementResize = typeof ResizeObserver === 'function',
514
+ layoutShift = typeof IntersectionObserver === 'function',
515
+ animationFrame = false
516
+ } = options;
517
+ const referenceEl = unwrapElement(reference);
518
+ const ancestors = ancestorScroll || ancestorResize ? [...(referenceEl ? getOverflowAncestors(referenceEl) : []), ...getOverflowAncestors(floating)] : [];
519
+ ancestors.forEach(ancestor => {
520
+ ancestorScroll && ancestor.addEventListener('scroll', update, {
521
+ passive: true
522
+ });
523
+ ancestorResize && ancestor.addEventListener('resize', update);
524
+ });
525
+ const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null;
526
+ let reobserveFrame = -1;
527
+ let resizeObserver = null;
528
+ if (elementResize) {
529
+ resizeObserver = new ResizeObserver(_ref => {
530
+ let [firstEntry] = _ref;
531
+ if (firstEntry && firstEntry.target === referenceEl && resizeObserver) {
532
+ // Prevent update loops when using the `size` middleware.
533
+ // https://github.com/floating-ui/floating-ui/issues/1740
534
+ resizeObserver.unobserve(floating);
535
+ cancelAnimationFrame(reobserveFrame);
536
+ reobserveFrame = requestAnimationFrame(() => {
537
+ resizeObserver && resizeObserver.observe(floating);
538
+ });
539
+ }
540
+ update();
541
+ });
542
+ if (referenceEl && !animationFrame) {
543
+ resizeObserver.observe(referenceEl);
544
+ }
545
+ resizeObserver.observe(floating);
546
+ }
547
+ let frameId;
548
+ let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
549
+ if (animationFrame) {
550
+ frameLoop();
551
+ }
552
+ function frameLoop() {
553
+ const nextRefRect = getBoundingClientRect(reference);
554
+ if (prevRefRect && (nextRefRect.x !== prevRefRect.x || nextRefRect.y !== prevRefRect.y || nextRefRect.width !== prevRefRect.width || nextRefRect.height !== prevRefRect.height)) {
555
+ update();
556
+ }
557
+ prevRefRect = nextRefRect;
558
+ frameId = requestAnimationFrame(frameLoop);
559
+ }
560
+ update();
561
+ return () => {
562
+ ancestors.forEach(ancestor => {
563
+ ancestorScroll && ancestor.removeEventListener('scroll', update);
564
+ ancestorResize && ancestor.removeEventListener('resize', update);
565
+ });
566
+ cleanupIo && cleanupIo();
567
+ resizeObserver && resizeObserver.disconnect();
568
+ resizeObserver = null;
569
+ if (animationFrame) {
570
+ cancelAnimationFrame(frameId);
571
+ }
572
+ };
573
+ }
574
+
575
+ /**
576
+ * Computes the `x` and `y` coordinates that will place the floating element
577
+ * next to a reference element when it is given a certain CSS positioning
578
+ * strategy.
579
+ */
580
+ const computePosition = (reference, floating, options) => {
581
+ // This caches the expensive `getClippingElementAncestors` function so that
582
+ // multiple lifecycle resets re-use the same result. It only lives for a
583
+ // single call. If other functions become expensive, we can add them as well.
584
+ const cache = new Map();
585
+ const mergedOptions = {
586
+ platform,
587
+ ...options
588
+ };
589
+ const platformWithCache = {
590
+ ...mergedOptions.platform,
591
+ _c: cache
592
+ };
593
+ return computePosition$1(reference, floating, {
594
+ ...mergedOptions,
595
+ platform: platformWithCache
596
+ });
597
+ };
598
+
599
+ export { autoUpdate, computePosition, getOverflowAncestors, platform };