@esri/calcite-components 1.0.0-next.672 → 1.0.0-next.674

package/dist/esm/{floating-ui-8d520bdb.js → floating-ui-a69f2d99.js}

@@ -1,10 +1,10 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.672
+ * v1.0.0-next.674
  */
-import { c as closestElementCrossShadowBoundary, a as getElementDir } from './dom-c342229b.js';
-import { d as debounce } from './debounce-60ee31c2.js';
+import { c as closestElementCrossShadowBoundary, a as getElementDir } from './dom-b7646102.js';
+import { d as debounce } from './debounce-c587ba92.js';
 
 function getSide(placement) {
   return placement.split('-')[0];
@@ -255,16 +255,25 @@ async function detectOverflow(middlewareArguments, options) {
     x,
     y
   } : rects.reference;
+  const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
+  const offsetScale = (await (platform.isElement == null ? void 0 : platform.isElement(offsetParent))) ? (await (platform.getScale == null ? void 0 : platform.getScale(offsetParent))) || {
+    x: 1,
+    y: 1
+  } : {
+    x: 1,
+    y: 1
+  };
   const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
     rect,
-    offsetParent: await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating)),
+    offsetParent,
     strategy
   }) : rect);
+
   return {
-    top: clippingClientRect.top - elementClientRect.top + paddingObject.top,
-    bottom: elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom,
-    left: clippingClientRect.left - elementClientRect.left + paddingObject.left,
-    right: elementClientRect.right - clippingClientRect.right + paddingObject.right
+    top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
+    bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
+    left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
+    right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
   };
 }
 
@@ -853,11 +862,17 @@ function getNodeName(node) {
   return isNode(node) ? (node.nodeName || '').toLowerCase() : '';
 }
 
+let uaString;
 function getUAString() {
+  if (uaString) {
+    return uaString;
+  }
+
   const uaData = navigator.userAgentData;
 
   if (uaData && Array.isArray(uaData.brands)) {
-    return uaData.brands.map(item => item.brand + "/" + item.version).join(' ');
+    uaString = uaData.brands.map(item => item.brand + "/" + item.version).join(' ');
+    return uaString;
   }
 
   return navigator.userAgent;
@@ -920,11 +935,37 @@ function isLastTraversableNode(node) {
   return ['html', 'body', '#document'].includes(getNodeName(node));
 }
 
-const min = Math.min;
-const max = Math.max;
-const round = Math.round;
+const FALLBACK_SCALE = {
+  x: 1,
+  y: 1
+};
+function getScale(element) {
+  const domElement = !isElement(element) && element.contextElement ? element.contextElement : isElement(element) ? element : null;
+
+  if (!domElement) {
+    return FALLBACK_SCALE;
+  }
+
+  const rect = domElement.getBoundingClientRect();
+  const css = getComputedStyle(domElement);
+  let x = rect.width / parseFloat(css.width);
+  let y = rect.height / parseFloat(css.height); // 0, NaN, or Infinity should always fallback to 1.
+
+  if (!x || !Number.isFinite(x)) {
+    x = 1;
+  }
+
+  if (!y || !Number.isFinite(y)) {
+    y = 1;
+  }
 
-function getBoundingClientRect(element, includeScale, isFixedStrategy) {
+  return {
+    x,
+    y
+  };
+}
+
+function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
   var _win$visualViewport$o, _win$visualViewport, _win$visualViewport$o2, _win$visualViewport2;
 
   if (includeScale === void 0) {
@@ -936,27 +977,24 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy) {
   }
 
   const clientRect = element.getBoundingClientRect();
-  let contextRect = clientRect;
-  let elementToCheckForScale = element;
-  let scaleX = 1;
-  let scaleY = 1;
-
-  if (!isElement(element) && element.contextElement) {
-    contextRect = element.contextElement.getBoundingClientRect();
-    elementToCheckForScale = element.contextElement;
-  }
+  let scale = FALLBACK_SCALE;
 
-  if (includeScale && isHTMLElement(elementToCheckForScale)) {
-    scaleX = elementToCheckForScale.offsetWidth > 0 ? round(contextRect.width) / elementToCheckForScale.offsetWidth || 1 : 1;
-    scaleY = elementToCheckForScale.offsetHeight > 0 ? round(contextRect.height) / elementToCheckForScale.offsetHeight || 1 : 1;
+  if (includeScale) {
+    if (offsetParent) {
+      if (isElement(offsetParent)) {
+        scale = getScale(offsetParent);
+      }
+    } else {
+      scale = getScale(element);
+    }
   }
 
   const win = isElement(element) ? getWindow(element) : window;
   const addVisualOffsets = !isLayoutViewport() && isFixedStrategy;
-  const x = (clientRect.left + (addVisualOffsets ? (_win$visualViewport$o = (_win$visualViewport = win.visualViewport) == null ? void 0 : _win$visualViewport.offsetLeft) != null ? _win$visualViewport$o : 0 : 0)) / scaleX;
-  const y = (clientRect.top + (addVisualOffsets ? (_win$visualViewport$o2 = (_win$visualViewport2 = win.visualViewport) == null ? void 0 : _win$visualViewport2.offsetTop) != null ? _win$visualViewport$o2 : 0 : 0)) / scaleY;
-  const width = clientRect.width / scaleX;
-  const height = clientRect.height / scaleY;
+  const x = (clientRect.left + (addVisualOffsets ? (_win$visualViewport$o = (_win$visualViewport = win.visualViewport) == null ? void 0 : _win$visualViewport.offsetLeft) != null ? _win$visualViewport$o : 0 : 0)) / scale.x;
+  const y = (clientRect.top + (addVisualOffsets ? (_win$visualViewport$o2 = (_win$visualViewport2 = win.visualViewport) == null ? void 0 : _win$visualViewport2.offsetTop) != null ? _win$visualViewport$o2 : 0 : 0)) / scale.y;
+  const width = clientRect.width / scale.x;
+  const height = clientRect.height / scale.y;
   return {
     width,
     height,
@@ -993,16 +1031,10 @@ function getWindowScrollBarX(element) {
   return getBoundingClientRect(getDocumentElement(element)).left + getNodeScroll(element).scrollLeft;
 }
 
-function isScaled(element) {
-  const rect = getBoundingClientRect(element);
-  return round(rect.width) !== element.offsetWidth || round(rect.height) !== element.offsetHeight;
-}
-
 function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
   const isOffsetParentAnElement = isHTMLElement(offsetParent);
   const documentElement = getDocumentElement(offsetParent);
-  const rect = getBoundingClientRect(element, // @ts-ignore - checked above (TS 4.1 compat)
-  isOffsetParentAnElement && isScaled(offsetParent), strategy === 'fixed');
+  const rect = getBoundingClientRect(element, true, strategy === 'fixed', offsetParent);
   let scroll = {
     scrollLeft: 0,
     scrollTop: 0
@@ -1118,6 +1150,10 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
     scrollLeft: 0,
     scrollTop: 0
   };
+  let scale = {
+    x: 1,
+    y: 1
+  };
   const offsets = {
     x: 0,
     y: 0
@@ -1130,18 +1166,21 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
 
     if (isHTMLElement(offsetParent)) {
       const offsetRect = getBoundingClientRect(offsetParent);
+      scale = getScale(offsetParent);
       offsets.x = offsetRect.x + offsetParent.clientLeft;
       offsets.y = offsetRect.y + offsetParent.clientTop;
-    } // This doesn't appear to be need to be negated.
+    } // This doesn't appear to need to be negated.
     // else if (documentElement) {
     //   offsets.x = getWindowScrollBarX(documentElement);
     // }
 
   }
 
-  return { ...rect,
-    x: rect.x - scroll.scrollLeft + offsets.x,
-    y: rect.y - scroll.scrollTop + offsets.y
+  return {
+    width: rect.width * scale.x,
+    height: rect.height * scale.y,
+    x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x,
+    y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y
   };
 }
 
@@ -1173,6 +1212,9 @@ function getViewportRect(element, strategy) {
   };
 }
 
+const min = Math.min;
+const max = Math.max;
+
 // of the `<html>` and `<body>` rect bounds if horizontally scrollable
 
 function getDocumentRect(element) {
@@ -1231,19 +1273,28 @@ function getOverflowAncestors(node, list) {
   return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor));
 }
 
+// Returns the inner client rect, subtracting scrollbars if present
 function getInnerBoundingClientRect(element, strategy) {
-  const clientRect = getBoundingClientRect(element, false, strategy === 'fixed');
+  const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
   const top = clientRect.top + element.clientTop;
   const left = clientRect.left + element.clientLeft;
+  const scale = isHTMLElement(element) ? getScale(element) : {
+    x: 1,
+    y: 1
+  };
+  const width = element.clientWidth * scale.x;
+  const height = element.clientHeight * scale.y;
+  const x = left * scale.x;
+  const y = top * scale.y;
   return {
-    top,
-    left,
-    x: left,
-    y: top,
-    right: left + element.clientWidth,
-    bottom: top + element.clientHeight,
-    width: element.clientWidth,
-    height: element.clientHeight
+    top: y,
+    left: x,
+    right: x + width,
+    bottom: y + height,
+    x,
+    y,
+    width,
+    height
   };
 }
 
@@ -1257,12 +1308,18 @@ function getClientRectFromClippingAncestor(element, clippingAncestor, strategy)
   }
 
   return rectToClientRect(getDocumentRect(getDocumentElement(element)));
-} // A "clipping ancestor" is an overflowable container with the characteristic of
-// clipping (or hiding) overflowing elements with a position different from
-// `initial`
+} // A "clipping ancestor" is an `overflow` element with the characteristic of
+// clipping (or hiding) child elements. This returns all clipping ancestors
+// of the given element up the tree.
 
 
-function getClippingElementAncestors(element) {
+function getClippingElementAncestors(element, cache) {
+  const cachedResult = cache.get(element);
+
+  if (cachedResult) {
+    return cachedResult;
+  }
+
   let result = getOverflowAncestors(element).filter(el => isElement(el) && getNodeName(el) !== 'body');
   let currentContainingBlockComputedStyle = null;
   const elementIsFixed = getComputedStyle(element).position === 'fixed';
@@ -1284,6 +1341,7 @@ function getClippingElementAncestors(element) {
     currentNode = getParentNode(currentNode);
   }
 
+  cache.set(element, result);
   return result;
 } // Gets the maximum area that the element is visible in due to any number of
 // clipping ancestors
@@ -1296,7 +1354,7 @@ function getClippingRect(_ref) {
     rootBoundary,
     strategy
   } = _ref;
-  const elementClippingAncestors = boundary === 'clippingAncestors' ? getClippingElementAncestors(element) : [].concat(boundary);
+  const elementClippingAncestors = boundary === 'clippingAncestors' ? getClippingElementAncestors(element, this._c) : [].concat(boundary);
   const clippingAncestors = [...elementClippingAncestors, rootBoundary];
   const firstClippingAncestor = clippingAncestors[0];
   const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
@@ -1322,6 +1380,7 @@ const platform = {
   getDimensions,
   getOffsetParent,
   getDocumentElement,
+  getScale,
 
   async getElementRects(_ref) {
     let {
@@ -1429,10 +1488,22 @@ function autoUpdate(reference, floating, update, options) {
  * strategy.
  */
 
-const computePosition = (reference, floating, options) => computePosition$1(reference, floating, {
-  platform,
-  ...options
-});
+const computePosition = (reference, floating, options) => {
+  // This caches the expensive `getClippingElementAncestors` function so that
+  // multiple lifecycle resets re-use the same result. It only lives for a
+  // single call. If other functions become expensive, we can add them as well.
+  const cache = new Map();
+  const mergedOptions = {
+    platform,
+    ...options
+  };
+  const platformWithCache = { ...mergedOptions.platform,
+    _c: cache
+  };
+  return computePosition$1(reference, floating, { ...mergedOptions,
+    platform: platformWithCache
+  });
+};
 
 /**
  * This module helps users provide custom configuration for component internals.
@@ -1463,7 +1534,7 @@ async function patchFloatingUiForNonChromiumBrowsers() {
   if (config.floatingUINonChromiumPositioningFix &&
     // ⚠️ browser-sniffing is not a best practice and should be avoided ⚠️
     /firefox|safari/i.test(getUAString())) {
-    const { getClippingRect, getElementRects, getOffsetParent } = await import('./nonChromiumPlatformUtils-165f3ea4.js');
+    const { getClippingRect, getElementRects, getOffsetParent } = await import('./nonChromiumPlatformUtils-e2e836d8.js');
     platform.getClippingRect = getClippingRect;
     platform.getOffsetParent = getOffsetParent;
     platform.getElementRects = getElementRects;

package/dist/esm/{focusTrapComponent-abb5fa39.js → focusTrapComponent-28e7dca7.js}

@@ -1,9 +1,9 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.672
+ * v1.0.0-next.674
  */
-import { f as focusElement } from './dom-c342229b.js';
+import { f as focusElement } from './dom-b7646102.js';
 
 /*!
 * tabbable 6.0.1
@@ -1210,8 +1210,7 @@ function connectFocusTrap(component) {
     focusTrapEl.tabIndex = -1;
   }
   const focusTrapOptions = {
-    allowOutsideClick: true,
-    clickOutsideDeactivates: false,
+    clickOutsideDeactivates: true,
     document: focusTrapEl.ownerDocument,
     escapeDeactivates: false,
     fallbackFocus: focusTrapEl,

package/dist/esm/{form-47c98610.js → form-017d35a8.js}

@@ -1,10 +1,10 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.672
+ * v1.0.0-next.674
  */
-import { c as closestElementCrossShadowBoundary } from './dom-c342229b.js';
-import { h } from './index-2b4630f9.js';
+import { c as closestElementCrossShadowBoundary } from './dom-b7646102.js';
+import { h } from './index-f3ceb464.js';
 
 /**
  * Exported for testing purposes.

package/dist/esm/{guid-25cfcb34.js → guid-f3ec568f.js}

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.672
+ * v1.0.0-next.674
  */
 function gen(counts) {
   return counts

package/dist/esm/{index-2b4630f9.js → index-f3ceb464.js}

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.672
+ * v1.0.0-next.674
  */
 const NAMESPACE = 'calcite';
 

package/dist/esm/index.js

@@ -1,5 +1,5 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.672
+ * v1.0.0-next.674
  */

package/dist/esm/{interactive-2ed49093.js → interactive-030f1dac.js}

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.672
+ * v1.0.0-next.674
  */
 function noopClick() {
   /** noop */

package/dist/esm/{interfaces-23cab187.js → interfaces-70d03ea1.js}

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.672
+ * v1.0.0-next.674
  */
 var StatusIcons;
 (function (StatusIcons) {

package/dist/esm/{key-034168b5.js → key-33946066.js}

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.672
+ * v1.0.0-next.674
  */
 function isActivationKey(key) {
   return key === "Enter" || key === " ";

package/dist/esm/{label-5b3c762a.js → label-1708f467.js}

@@ -1,9 +1,9 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.672
+ * v1.0.0-next.674
  */
-import { q as queryElementRoots, c as closestElementCrossShadowBoundary } from './dom-c342229b.js';
+import { q as queryElementRoots, c as closestElementCrossShadowBoundary } from './dom-b7646102.js';
 
 /**
  * Exported for testing purposes only

package/dist/esm/{loadable-f3bde1f2.js → loadable-a5cc916b.js}

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.672
+ * v1.0.0-next.674
  */
 const resolveMap = new WeakMap();
 const promiseMap = new WeakMap();