@teamturing/react-kit 2.45.3 → 2.46.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 (34) hide show
  1. package/dist/core/OverlayPopper/index.d.ts +1 -1
  2. package/dist/core/Tooltip/BaseTooltip.d.ts +7 -0
  3. package/dist/core/Tooltip/index.d.ts +4 -19
  4. package/dist/core/Tooltip/useTooltip.d.ts +14 -0
  5. package/dist/core/Tooltip/useTooltipContext.d.ts +6 -0
  6. package/dist/index.js +15670 -12798
  7. package/esm/core/Breadcrumbs/BreadcrumbsItem.js +0 -3
  8. package/esm/core/OverlayPopper/index.js +2 -2
  9. package/esm/core/Tooltip/BaseTooltip.js +125 -0
  10. package/esm/core/Tooltip/index.js +21 -279
  11. package/esm/core/Tooltip/useTooltip.js +56 -0
  12. package/esm/core/Tooltip/useTooltipContext.js +12 -0
  13. package/esm/node_modules/@floating-ui/core/dist/floating-ui.core.js +145 -27
  14. package/esm/node_modules/@floating-ui/dom/dist/floating-ui.dom.js +191 -59
  15. package/esm/node_modules/@floating-ui/react/dist/floating-ui.react.js +1621 -0
  16. package/esm/node_modules/@floating-ui/react/dist/floating-ui.react.utils.js +233 -0
  17. package/esm/node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js +108 -16
  18. package/esm/node_modules/@floating-ui/utils/{dom/dist → dist}/floating-ui.utils.dom.js +48 -15
  19. package/esm/node_modules/@floating-ui/utils/dist/floating-ui.utils.js +28 -13
  20. package/esm/node_modules/tabbable/dist/index.esm.js +560 -0
  21. package/esm/packages/icons/esm/AHorizontalLine.js +15 -0
  22. package/esm/packages/icons/esm/AVertialLine.js +15 -0
  23. package/esm/packages/icons/esm/BoxPlus.js +15 -0
  24. package/esm/packages/icons/esm/Crop.js +24 -0
  25. package/esm/packages/icons/esm/Cursor.js +22 -0
  26. package/esm/packages/icons/esm/Global.js +17 -0
  27. package/esm/packages/icons/esm/LandscapeArrow.js +20 -0
  28. package/esm/packages/icons/esm/Moon.js +15 -0
  29. package/esm/packages/icons/esm/PortraitArrow.js +20 -0
  30. package/esm/packages/icons/esm/SoundPaper.js +20 -0
  31. package/esm/packages/icons/esm/Sun.js +15 -0
  32. package/esm/packages/icons/esm/index.js +11 -0
  33. package/esm/packages/token-studio/esm/foundation/palette/index.js +1 -0
  34. package/package.json +5 -5
@@ -1,10 +1,9 @@
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';
1
+ import { offset as offset$1, shift as shift$1, flip as flip$1, computePosition as computePosition$1, arrow as arrow$1 } from '../../core/dist/floating-ui.core.js';
3
2
  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';
3
+ import { getOverflowAncestors, isElement, getWindow, getFrameElement, getComputedStyle as getComputedStyle$1, getDocumentElement, isHTMLElement, isWebKit, isTopLayer, getNodeName, isOverflowElement, getNodeScroll, getParentNode, isLastTraversableNode, isTableElement, isContainingBlock, getContainingBlock } from '../../utils/dist/floating-ui.utils.dom.js';
5
4
 
6
5
  function getCssDimensions(element) {
7
- const css = getComputedStyle(element);
6
+ const css = getComputedStyle$1(element);
8
7
  // In testing environments, the `width` and `height` properties are empty
9
8
  // strings for SVG elements, returning NaN. Fallback to `0` in this case.
10
9
  let width = parseFloat(css.width) || 0;
@@ -104,11 +103,12 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
104
103
  if (domElement) {
105
104
  const win = getWindow(domElement);
106
105
  const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
107
- let currentIFrame = win.frameElement;
108
- while (currentIFrame && offsetParent && offsetWin !== win) {
106
+ let currentWin = win;
107
+ let currentIFrame = getFrameElement(currentWin);
108
+ while (currentIFrame && offsetParent && offsetWin !== currentWin) {
109
109
  const iframeScale = getScale(currentIFrame);
110
110
  const iframeRect = currentIFrame.getBoundingClientRect();
111
- const css = getComputedStyle(currentIFrame);
111
+ const css = getComputedStyle$1(currentIFrame);
112
112
  const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
113
113
  const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
114
114
  x *= iframeScale.x;
@@ -117,7 +117,8 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
117
117
  height *= iframeScale.y;
118
118
  x += left;
119
119
  y += top;
120
- currentIFrame = getWindow(currentIFrame).frameElement;
120
+ currentWin = getWindow(currentIFrame);
121
+ currentIFrame = getFrameElement(currentWin);
121
122
  }
122
123
  }
123
124
  return rectToClientRect({
@@ -128,15 +129,37 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
128
129
  });
129
130
  }
130
131
 
132
+ // If <html> has a CSS width greater than the viewport, then this will be
133
+ // incorrect for RTL.
134
+ function getWindowScrollBarX(element, rect) {
135
+ const leftScroll = getNodeScroll(element).scrollLeft;
136
+ if (!rect) {
137
+ return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
138
+ }
139
+ return rect.left + leftScroll;
140
+ }
141
+
142
+ function getHTMLOffset(documentElement, scroll) {
143
+ const htmlRect = documentElement.getBoundingClientRect();
144
+ const x = htmlRect.left + scroll.scrollLeft - getWindowScrollBarX(documentElement, htmlRect);
145
+ const y = htmlRect.top + scroll.scrollTop;
146
+ return {
147
+ x,
148
+ y
149
+ };
150
+ }
151
+
131
152
  function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
132
153
  let {
154
+ elements,
133
155
  rect,
134
156
  offsetParent,
135
157
  strategy
136
158
  } = _ref;
137
- const isOffsetParentAnElement = isHTMLElement(offsetParent);
159
+ const isFixed = strategy === 'fixed';
138
160
  const documentElement = getDocumentElement(offsetParent);
139
- if (offsetParent === documentElement) {
161
+ const topLayer = elements ? isTopLayer(elements.floating) : false;
162
+ if (offsetParent === documentElement || topLayer && isFixed) {
140
163
  return rect;
141
164
  }
142
165
  let scroll = {
@@ -145,7 +168,8 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
145
168
  };
146
169
  let scale = createCoords(1);
147
170
  const offsets = createCoords(0);
148
- if (isOffsetParentAnElement || !isOffsetParentAnElement && strategy !== 'fixed') {
171
+ const isOffsetParentAnElement = isHTMLElement(offsetParent);
172
+ if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
149
173
  if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
150
174
  scroll = getNodeScroll(offsetParent);
151
175
  }
@@ -156,11 +180,12 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
156
180
  offsets.y = offsetRect.y + offsetParent.clientTop;
157
181
  }
158
182
  }
183
+ const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
159
184
  return {
160
185
  width: rect.width * scale.x,
161
186
  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
187
+ x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
188
+ y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
164
189
  };
165
190
  }
166
191
 
@@ -168,12 +193,6 @@ function getClientRects(element) {
168
193
  return Array.from(element.getClientRects());
169
194
  }
170
195
 
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
196
  // Gets the entire size of the scrollable document area, even extending outside
178
197
  // of the `<html>` and `<body>` rect bounds if horizontally scrollable.
179
198
  function getDocumentRect(element) {
@@ -184,7 +203,7 @@ function getDocumentRect(element) {
184
203
  const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
185
204
  let x = -scroll.scrollLeft + getWindowScrollBarX(element);
186
205
  const y = -scroll.scrollTop;
187
- if (getComputedStyle(body).direction === 'rtl') {
206
+ if (getComputedStyle$1(body).direction === 'rtl') {
188
207
  x += max(html.clientWidth, body.clientWidth) - width;
189
208
  }
190
209
  return {
@@ -195,6 +214,10 @@ function getDocumentRect(element) {
195
214
  };
196
215
  }
197
216
 
217
+ // Safety check: ensure the scrollbar space is reasonable in case this
218
+ // calculation is affected by unusual styles.
219
+ // Most scrollbars leave 15-18px of space.
220
+ const SCROLLBAR_MAX = 25;
198
221
  function getViewportRect(element, strategy) {
199
222
  const win = getWindow(element);
200
223
  const html = getDocumentElement(element);
@@ -212,6 +235,24 @@ function getViewportRect(element, strategy) {
212
235
  y = visualViewport.offsetTop;
213
236
  }
214
237
  }
238
+ const windowScrollbarX = getWindowScrollBarX(html);
239
+ // <html> `overflow: hidden` + `scrollbar-gutter: stable` reduces the
240
+ // visual width of the <html> but this is not considered in the size
241
+ // of `html.clientWidth`.
242
+ if (windowScrollbarX <= 0) {
243
+ const doc = html.ownerDocument;
244
+ const body = doc.body;
245
+ const bodyStyles = getComputedStyle(body);
246
+ const bodyMarginInline = doc.compatMode === 'CSS1Compat' ? parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight) || 0 : 0;
247
+ const clippingStableScrollbarWidth = Math.abs(html.clientWidth - body.clientWidth - bodyMarginInline);
248
+ if (clippingStableScrollbarWidth <= SCROLLBAR_MAX) {
249
+ width -= clippingStableScrollbarWidth;
250
+ }
251
+ } else if (windowScrollbarX <= SCROLLBAR_MAX) {
252
+ // If the <body> scrollbar is on the left, the width needs to be extended
253
+ // by the scrollbar amount so there isn't extra space on the right.
254
+ width += windowScrollbarX;
255
+ }
215
256
  return {
216
257
  width,
217
258
  height,
@@ -220,6 +261,7 @@ function getViewportRect(element, strategy) {
220
261
  };
221
262
  }
222
263
 
264
+ const absoluteOrFixed = /*#__PURE__*/new Set(['absolute', 'fixed']);
223
265
  // Returns the inner client rect, subtracting scrollbars if present.
224
266
  function getInnerBoundingClientRect(element, strategy) {
225
267
  const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
@@ -248,9 +290,10 @@ function getClientRectFromClippingAncestor(element, clippingAncestor, strategy)
248
290
  } else {
249
291
  const visualOffsets = getVisualOffsets(element);
250
292
  rect = {
251
- ...clippingAncestor,
252
293
  x: clippingAncestor.x - visualOffsets.x,
253
- y: clippingAncestor.y - visualOffsets.y
294
+ y: clippingAncestor.y - visualOffsets.y,
295
+ width: clippingAncestor.width,
296
+ height: clippingAncestor.height
254
297
  };
255
298
  }
256
299
  return rectToClientRect(rect);
@@ -260,7 +303,7 @@ function hasFixedPositionAncestor(element, stopNode) {
260
303
  if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) {
261
304
  return false;
262
305
  }
263
- return getComputedStyle(parentNode).position === 'fixed' || hasFixedPositionAncestor(parentNode, stopNode);
306
+ return getComputedStyle$1(parentNode).position === 'fixed' || hasFixedPositionAncestor(parentNode, stopNode);
264
307
  }
265
308
 
266
309
  // A "clipping ancestor" is an `overflow` element with the characteristic of
@@ -273,17 +316,17 @@ function getClippingElementAncestors(element, cache) {
273
316
  }
274
317
  let result = getOverflowAncestors(element, [], false).filter(el => isElement(el) && getNodeName(el) !== 'body');
275
318
  let currentContainingBlockComputedStyle = null;
276
- const elementIsFixed = getComputedStyle(element).position === 'fixed';
319
+ const elementIsFixed = getComputedStyle$1(element).position === 'fixed';
277
320
  let currentNode = elementIsFixed ? getParentNode(element) : element;
278
321
 
279
322
  // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
280
323
  while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
281
- const computedStyle = getComputedStyle(currentNode);
324
+ const computedStyle = getComputedStyle$1(currentNode);
282
325
  const currentNodeIsContaining = isContainingBlock(currentNode);
283
326
  if (!currentNodeIsContaining && computedStyle.position === 'fixed') {
284
327
  currentContainingBlockComputedStyle = null;
285
328
  }
286
- const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && ['absolute', 'fixed'].includes(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
329
+ const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && absoluteOrFixed.has(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
287
330
  if (shouldDropCurrentNode) {
288
331
  // Drop non-containing blocks.
289
332
  result = result.filter(ancestor => ancestor !== currentNode);
@@ -306,7 +349,7 @@ function getClippingRect(_ref) {
306
349
  rootBoundary,
307
350
  strategy
308
351
  } = _ref;
309
- const elementClippingAncestors = boundary === 'clippingAncestors' ? getClippingElementAncestors(element, this._c) : [].concat(boundary);
352
+ const elementClippingAncestors = boundary === 'clippingAncestors' ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
310
353
  const clippingAncestors = [...elementClippingAncestors, rootBoundary];
311
354
  const firstClippingAncestor = clippingAncestors[0];
312
355
  const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
@@ -326,7 +369,14 @@ function getClippingRect(_ref) {
326
369
  }
327
370
 
328
371
  function getDimensions(element) {
329
- return getCssDimensions(element);
372
+ const {
373
+ width,
374
+ height
375
+ } = getCssDimensions(element);
376
+ return {
377
+ width,
378
+ height
379
+ };
330
380
  }
331
381
 
332
382
  function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
@@ -339,6 +389,12 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
339
389
  scrollTop: 0
340
390
  };
341
391
  const offsets = createCoords(0);
392
+
393
+ // If the <body> scrollbar appears on the left (e.g. RTL systems). Use
394
+ // Firefox with layout.scrollbar.side = 3 in about:config to test this.
395
+ function setLeftRTLScrollbarOffset() {
396
+ offsets.x = getWindowScrollBarX(documentElement);
397
+ }
342
398
  if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
343
399
  if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
344
400
  scroll = getNodeScroll(offsetParent);
@@ -348,64 +404,90 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
348
404
  offsets.x = offsetRect.x + offsetParent.clientLeft;
349
405
  offsets.y = offsetRect.y + offsetParent.clientTop;
350
406
  } else if (documentElement) {
351
- offsets.x = getWindowScrollBarX(documentElement);
407
+ setLeftRTLScrollbarOffset();
352
408
  }
353
409
  }
410
+ if (isFixed && !isOffsetParentAnElement && documentElement) {
411
+ setLeftRTLScrollbarOffset();
412
+ }
413
+ const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
414
+ const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
415
+ const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
354
416
  return {
355
- x: rect.left + scroll.scrollLeft - offsets.x,
356
- y: rect.top + scroll.scrollTop - offsets.y,
417
+ x,
418
+ y,
357
419
  width: rect.width,
358
420
  height: rect.height
359
421
  };
360
422
  }
361
423
 
424
+ function isStaticPositioned(element) {
425
+ return getComputedStyle$1(element).position === 'static';
426
+ }
427
+
362
428
  function getTrueOffsetParent(element, polyfill) {
363
- if (!isHTMLElement(element) || getComputedStyle(element).position === 'fixed') {
429
+ if (!isHTMLElement(element) || getComputedStyle$1(element).position === 'fixed') {
364
430
  return null;
365
431
  }
366
432
  if (polyfill) {
367
433
  return polyfill(element);
368
434
  }
369
- return element.offsetParent;
435
+ let rawOffsetParent = element.offsetParent;
436
+
437
+ // Firefox returns the <html> element as the offsetParent if it's non-static,
438
+ // while Chrome and Safari return the <body> element. The <body> element must
439
+ // be used to perform the correct calculations even if the <html> element is
440
+ // non-static.
441
+ if (getDocumentElement(element) === rawOffsetParent) {
442
+ rawOffsetParent = rawOffsetParent.ownerDocument.body;
443
+ }
444
+ return rawOffsetParent;
370
445
  }
371
446
 
372
447
  // Gets the closest ancestor positioned element. Handles some edge cases,
373
448
  // such as table ancestors and cross browser bugs.
374
449
  function getOffsetParent(element, polyfill) {
375
- const window = getWindow(element);
450
+ const win = getWindow(element);
451
+ if (isTopLayer(element)) {
452
+ return win;
453
+ }
376
454
  if (!isHTMLElement(element)) {
377
- return window;
455
+ let svgOffsetParent = getParentNode(element);
456
+ while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
457
+ if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) {
458
+ return svgOffsetParent;
459
+ }
460
+ svgOffsetParent = getParentNode(svgOffsetParent);
461
+ }
462
+ return win;
378
463
  }
379
464
  let offsetParent = getTrueOffsetParent(element, polyfill);
380
- while (offsetParent && isTableElement(offsetParent) && getComputedStyle(offsetParent).position === 'static') {
465
+ while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) {
381
466
  offsetParent = getTrueOffsetParent(offsetParent, polyfill);
382
467
  }
383
- if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle(offsetParent).position === 'static' && !isContainingBlock(offsetParent))) {
384
- return window;
468
+ if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) {
469
+ return win;
385
470
  }
386
- return offsetParent || getContainingBlock(element) || window;
471
+ return offsetParent || getContainingBlock(element) || win;
387
472
  }
388
473
 
389
- const getElementRects = async function (_ref) {
390
- let {
391
- reference,
392
- floating,
393
- strategy
394
- } = _ref;
474
+ const getElementRects = async function (data) {
395
475
  const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
396
476
  const getDimensionsFn = this.getDimensions;
477
+ const floatingDimensions = await getDimensionsFn(data.floating);
397
478
  return {
398
- reference: getRectRelativeToOffsetParent(reference, await getOffsetParentFn(floating), strategy),
479
+ reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
399
480
  floating: {
400
481
  x: 0,
401
482
  y: 0,
402
- ...(await getDimensionsFn(floating))
483
+ width: floatingDimensions.width,
484
+ height: floatingDimensions.height
403
485
  }
404
486
  };
405
487
  };
406
488
 
407
489
  function isRTL(element) {
408
- return getComputedStyle(element).direction === 'rtl';
490
+ return getComputedStyle$1(element).direction === 'rtl';
409
491
  }
410
492
 
411
493
  const platform = {
@@ -421,14 +503,19 @@ const platform = {
421
503
  isRTL
422
504
  };
423
505
 
506
+ function rectsAreEqual(a, b) {
507
+ return a.x === b.x && a.y === b.y && a.width === b.width && a.height === b.height;
508
+ }
509
+
424
510
  // https://samthor.au/2021/observing-dom/
425
511
  function observeMove(element, onMove) {
426
512
  let io = null;
427
513
  let timeoutId;
428
514
  const root = getDocumentElement(element);
429
515
  function cleanup() {
516
+ var _io;
430
517
  clearTimeout(timeoutId);
431
- io && io.disconnect();
518
+ (_io = io) == null || _io.disconnect();
432
519
  io = null;
433
520
  }
434
521
  function refresh(skip, threshold) {
@@ -439,12 +526,13 @@ function observeMove(element, onMove) {
439
526
  threshold = 1;
440
527
  }
441
528
  cleanup();
529
+ const elementRectForRootMargin = element.getBoundingClientRect();
442
530
  const {
443
531
  left,
444
532
  top,
445
533
  width,
446
534
  height
447
- } = element.getBoundingClientRect();
535
+ } = elementRectForRootMargin;
448
536
  if (!skip) {
449
537
  onMove();
450
538
  }
@@ -468,13 +556,25 @@ function observeMove(element, onMove) {
468
556
  return refresh();
469
557
  }
470
558
  if (!ratio) {
559
+ // If the reference is clipped, the ratio is 0. Throttle the refresh
560
+ // to prevent an infinite loop of updates.
471
561
  timeoutId = setTimeout(() => {
472
562
  refresh(false, 1e-7);
473
- }, 100);
563
+ }, 1000);
474
564
  } else {
475
565
  refresh(false, ratio);
476
566
  }
477
567
  }
568
+ if (ratio === 1 && !rectsAreEqual(elementRectForRootMargin, element.getBoundingClientRect())) {
569
+ // It's possible that even though the ratio is reported as 1, the
570
+ // element is not actually fully within the IntersectionObserver's root
571
+ // area anymore. This can happen under performance constraints. This may
572
+ // be a bug in the browser's IntersectionObserver implementation. To
573
+ // work around this, we compare the element's bounding rect now with
574
+ // what it was at the time we created the IntersectionObserver. If they
575
+ // are not equal then the element moved, so we refresh.
576
+ refresh();
577
+ }
478
578
  isFirstUpdate = false;
479
579
  }
480
580
 
@@ -486,7 +586,7 @@ function observeMove(element, onMove) {
486
586
  // Handle <iframe>s
487
587
  root: root.ownerDocument
488
588
  });
489
- } catch (e) {
589
+ } catch (_e) {
490
590
  io = new IntersectionObserver(handleObserve, options);
491
591
  }
492
592
  io.observe(element);
@@ -534,7 +634,8 @@ function autoUpdate(reference, floating, update, options) {
534
634
  resizeObserver.unobserve(floating);
535
635
  cancelAnimationFrame(reobserveFrame);
536
636
  reobserveFrame = requestAnimationFrame(() => {
537
- resizeObserver && resizeObserver.observe(floating);
637
+ var _resizeObserver;
638
+ (_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating);
538
639
  });
539
640
  }
540
641
  update();
@@ -551,7 +652,7 @@ function autoUpdate(reference, floating, update, options) {
551
652
  }
552
653
  function frameLoop() {
553
654
  const nextRefRect = getBoundingClientRect(reference);
554
- if (prevRefRect && (nextRefRect.x !== prevRefRect.x || nextRefRect.y !== prevRefRect.y || nextRefRect.width !== prevRefRect.width || nextRefRect.height !== prevRefRect.height)) {
655
+ if (prevRefRect && !rectsAreEqual(prevRefRect, nextRefRect)) {
555
656
  update();
556
657
  }
557
658
  prevRefRect = nextRefRect;
@@ -559,12 +660,13 @@ function autoUpdate(reference, floating, update, options) {
559
660
  }
560
661
  update();
561
662
  return () => {
663
+ var _resizeObserver2;
562
664
  ancestors.forEach(ancestor => {
563
665
  ancestorScroll && ancestor.removeEventListener('scroll', update);
564
666
  ancestorResize && ancestor.removeEventListener('resize', update);
565
667
  });
566
- cleanupIo && cleanupIo();
567
- resizeObserver && resizeObserver.disconnect();
668
+ cleanupIo == null || cleanupIo();
669
+ (_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect();
568
670
  resizeObserver = null;
569
671
  if (animationFrame) {
570
672
  cancelAnimationFrame(frameId);
@@ -572,10 +674,40 @@ function autoUpdate(reference, floating, update, options) {
572
674
  };
573
675
  }
574
676
 
677
+ /**
678
+ * Modifies the placement by translating the floating element along the
679
+ * specified axes.
680
+ * A number (shorthand for `mainAxis` or distance), or an axes configuration
681
+ * object may be passed.
682
+ * @see https://floating-ui.com/docs/offset
683
+ */
684
+ const offset = offset$1;
685
+
686
+ /**
687
+ * Optimizes the visibility of the floating element by shifting it in order to
688
+ * keep it in view when it will overflow the clipping boundary.
689
+ * @see https://floating-ui.com/docs/shift
690
+ */
691
+ const shift = shift$1;
692
+
693
+ /**
694
+ * Optimizes the visibility of the floating element by flipping the `placement`
695
+ * in order to keep it in view when the preferred placement(s) will overflow the
696
+ * clipping boundary. Alternative to `autoPlacement`.
697
+ * @see https://floating-ui.com/docs/flip
698
+ */
699
+ const flip = flip$1;
700
+
701
+ /**
702
+ * Provides data to position an inner element of the floating element so that it
703
+ * appears centered to the reference element.
704
+ * @see https://floating-ui.com/docs/arrow
705
+ */
706
+ const arrow = arrow$1;
707
+
575
708
  /**
576
709
  * 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.
710
+ * next to a given reference element.
579
711
  */
580
712
  const computePosition = (reference, floating, options) => {
581
713
  // This caches the expensive `getClippingElementAncestors` function so that
@@ -596,4 +728,4 @@ const computePosition = (reference, floating, options) => {
596
728
  });
597
729
  };
598
730
 
599
- export { autoUpdate, computePosition, getOverflowAncestors, platform };
731
+ export { arrow, autoUpdate, computePosition, flip, getOverflowAncestors, offset, platform, shift };