@esri/calcite-components 1.0.0-next.646 → 1.0.0-next.648

package/dist/esm/{floating-ui-39e24e16.js → floating-ui-fc1dd50c.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.646
+ * v1.0.0-next.648
  */
-import { c as closestElementCrossShadowBoundary, a as getElementDir } from './dom-c7442d5a.js';
-import { d as debounce } from './debounce-a80cea2e.js';
+import { c as closestElementCrossShadowBoundary, a as getElementDir } from './dom-c8898dc4.js';
+import { d as debounce } from './debounce-6bf69804.js';
 
 function getSide(placement) {
   return placement.split('-')[0];
@@ -100,6 +100,7 @@ const computePosition$1 = async (reference, floating, config) => {
     middleware = [],
     platform
   } = config;
+  const validMiddleware = middleware.filter(Boolean);
   const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
 
   let rects = await platform.getElementRects({
@@ -115,11 +116,11 @@ const computePosition$1 = async (reference, floating, config) => {
   let middlewareData = {};
   let resetCount = 0;
 
-  for (let i = 0; i < middleware.length; i++) {
+  for (let i = 0; i < validMiddleware.length; i++) {
     const {
       name,
       fn
-    } = middleware[i];
+    } = validMiddleware[i];
     const {
       x: nextX,
       y: nextY,
@@ -864,7 +865,7 @@ function getNodeName(node) {
 function getUAString() {
   const uaData = navigator.userAgentData;
 
-  if (uaData != null && uaData.brands) {
+  if (uaData && Array.isArray(uaData.brands)) {
     return uaData.brands.map(item => item.brand + "/" + item.version).join(' ');
   }
 
@@ -905,11 +906,12 @@ function isTableElement(element) {
 function isContainingBlock(element) {
   // TODO: Try and use feature detection here instead
   const isFirefox = /firefox/i.test(getUAString());
-  const css = getComputedStyle(element); // This is non-exhaustive but covers the most common CSS properties that
+  const css = getComputedStyle(element);
+  const backdropFilter = css.backdropFilter || css.WebkitBackdropFilter; // This is non-exhaustive but covers the most common CSS properties that
   // create a containing block.
   // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
 
-  return css.transform !== 'none' || css.perspective !== 'none' || isFirefox && css.willChange === 'filter' || isFirefox && (css.filter ? css.filter !== 'none' : false) || ['transform', 'perspective'].some(value => css.willChange.includes(value)) || ['paint', 'layout', 'strict', 'content'].some( // TS 4.1 compat
+  return css.transform !== 'none' || css.perspective !== 'none' || (backdropFilter ? backdropFilter !== 'none' : false) || isFirefox && css.willChange === 'filter' || isFirefox && (css.filter ? css.filter !== 'none' : false) || ['transform', 'perspective'].some(value => css.willChange.includes(value)) || ['paint', 'layout', 'strict', 'content'].some( // TS 4.1 compat
   value => {
     const contain = css.contain;
     return contain != null ? contain.includes(value) : false;
@@ -1039,14 +1041,12 @@ function getParentNode(node) {
     return node;
   }
 
-  return (// this is a quicker (but less type safe) way to save quite some bytes from the bundle
-    // @ts-ignore
-    node.assignedSlot || // step into the shadow DOM of the parent of a slotted node
-    node.parentNode || ( // DOM Element detected
-    isShadowRoot(node) ? node.host : null) || // ShadowRoot detected
-    getDocumentElement(node) // fallback
-
-  );
+  const result = // Step into the shadow DOM of the parent of a slotted node
+  node.assignedSlot || // DOM Element detected
+  node.parentNode || ( // ShadowRoot detected
+  isShadowRoot(node) ? node.host : null) || // Fallback
+  getDocumentElement(node);
+  return isShadowRoot(result) ? result.host : result;
 }
 
 function getTrueOffsetParent(element) {
@@ -1060,16 +1060,11 @@ function getTrueOffsetParent(element) {
 function getContainingBlock(element) {
   let currentNode = getParentNode(element);
 
-  if (isShadowRoot(currentNode)) {
-    currentNode = currentNode.host;
-  }
-
   while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
     if (isContainingBlock(currentNode)) {
       return currentNode;
     } else {
-      const parent = currentNode.parentNode;
-      currentNode = isShadowRoot(parent) ? parent.host : parent;
+      currentNode = getParentNode(currentNode);
     }
   }
 
@@ -1236,45 +1231,6 @@ function getOverflowAncestors(node, list) {
   updatedList.concat(getOverflowAncestors(target));
 }
 
-function contains(parent, child) {
-  const rootNode = child.getRootNode == null ? void 0 : child.getRootNode(); // First, attempt with faster native method
-
-  if (parent.contains(child)) {
-    return true;
-  } // then fallback to custom implementation with Shadow DOM support
-  else if (rootNode && isShadowRoot(rootNode)) {
-    let next = child;
-
-    do {
-      // use `===` replace node.isSameNode()
-      if (next && parent === next) {
-        return true;
-      } // @ts-ignore: need a better way to handle this...
-
-
-      next = next.parentNode || next.host;
-    } while (next);
-  }
-
-  return false;
-}
-
-function getNearestParentCapableOfEscapingClipping(element, clippingAncestors) {
-  let currentNode = element;
-
-  while (currentNode && !isLastTraversableNode(currentNode) && // @ts-expect-error
-  !clippingAncestors.includes(currentNode)) {
-    if (isElement(currentNode) && ['absolute', 'fixed'].includes(getComputedStyle(currentNode).position)) {
-      break;
-    }
-
-    const parentNode = getParentNode(currentNode);
-    currentNode = isShadowRoot(parentNode) ? parentNode.host : parentNode;
-  }
-
-  return currentNode;
-}
-
 function getInnerBoundingClientRect(element, strategy) {
   const clientRect = getBoundingClientRect(element, false, strategy === 'fixed');
   const top = clientRect.top + element.clientTop;
@@ -1291,13 +1247,13 @@ function getInnerBoundingClientRect(element, strategy) {
   };
 }
 
-function getClientRectFromClippingAncestor(element, clippingParent, strategy) {
-  if (clippingParent === 'viewport') {
+function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
+  if (clippingAncestor === 'viewport') {
     return rectToClientRect(getViewportRect(element, strategy));
   }
 
-  if (isElement(clippingParent)) {
-    return getInnerBoundingClientRect(clippingParent, strategy);
+  if (isElement(clippingAncestor)) {
+    return getInnerBoundingClientRect(clippingAncestor, strategy);
   }
 
   return rectToClientRect(getDocumentRect(getDocumentElement(element)));
@@ -1306,27 +1262,29 @@ function getClientRectFromClippingAncestor(element, clippingParent, strategy) {
 // `initial`
 
 
-function getClippingAncestors(element) {
-  const clippingAncestors = getOverflowAncestors(element);
-  const nearestEscapableParent = getNearestParentCapableOfEscapingClipping(element, clippingAncestors);
-  let clipperElement = null;
+function getClippingElementAncestors(element) {
+  let result = getOverflowAncestors(element).filter(el => isElement(el) && getNodeName(el) !== 'body');
+  let currentContainingBlockComputedStyle = null;
+  const elementIsFixed = getComputedStyle(element).position === 'fixed';
+  let currentNode = elementIsFixed ? getParentNode(element) : element; // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
 
-  if (nearestEscapableParent && isHTMLElement(nearestEscapableParent)) {
-    const offsetParent = getOffsetParent(nearestEscapableParent);
+  while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
+    const computedStyle = getComputedStyle(currentNode);
+    const containingBlock = isContainingBlock(currentNode);
+    const shouldDropCurrentNode = elementIsFixed ? !containingBlock && !currentContainingBlockComputedStyle : !containingBlock && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && ['absolute', 'fixed'].includes(currentContainingBlockComputedStyle.position);
 
-    if (isOverflowElement(nearestEscapableParent)) {
-      clipperElement = nearestEscapableParent;
-    } else if (isHTMLElement(offsetParent)) {
-      clipperElement = offsetParent;
+    if (shouldDropCurrentNode) {
+      // Drop non-containing blocks
+      result = result.filter(ancestor => ancestor !== currentNode);
+    } else {
+      // Record last containing block for next iteration
+      currentContainingBlockComputedStyle = computedStyle;
     }
-  }
-
-  if (!isElement(clipperElement)) {
-    return [];
-  } // @ts-ignore isElement check ensures we return Array<Element>
 
+    currentNode = getParentNode(currentNode);
+  }
 
-  return clippingAncestors.filter(clippingAncestors => clipperElement && isElement(clippingAncestors) && contains(clippingAncestors, clipperElement) && getNodeName(clippingAncestors) !== 'body');
+  return result;
 } // Gets the maximum area that the element is visible in due to any number of
 // clipping ancestors
 
@@ -1338,8 +1296,8 @@ function getClippingRect(_ref) {
     rootBoundary,
     strategy
   } = _ref;
-  const mainClippingAncestors = boundary === 'clippingAncestors' ? getClippingAncestors(element) : [].concat(boundary);
-  const clippingAncestors = [...mainClippingAncestors, rootBoundary];
+  const elementClippingAncestors = boundary === 'clippingAncestors' ? getClippingElementAncestors(element) : [].concat(boundary);
+  const clippingAncestors = [...elementClippingAncestors, rootBoundary];
   const firstClippingAncestor = clippingAncestors[0];
   const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
     const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
@@ -1364,20 +1322,25 @@ const platform = {
   getDimensions,
   getOffsetParent,
   getDocumentElement,
-  getElementRects: _ref => {
+
+  async getElementRects(_ref) {
     let {
       reference,
       floating,
       strategy
     } = _ref;
+    const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
+    const getDimensionsFn = this.getDimensions;
     return {
-      reference: getRectRelativeToOffsetParent(reference, getOffsetParent(floating), strategy),
-      floating: { ...getDimensions(floating),
+      reference: getRectRelativeToOffsetParent(reference, await getOffsetParentFn(floating), strategy),
+      floating: {
         x: 0,
-        y: 0
+        y: 0,
+        ...(await getDimensionsFn(floating))
       }
     };
   },
+
   getClientRects: element => Array.from(element.getClientRects()),
   isRTL: element => getComputedStyle(element).direction === 'rtl'
 };
@@ -1398,7 +1361,7 @@ function autoUpdate(reference, floating, update, options) {
     animationFrame = false
   } = options;
   const ancestorScroll = _ancestorScroll && !animationFrame;
-  const ancestors = ancestorScroll || ancestorResize ? [...(isElement(reference) ? getOverflowAncestors(reference) : []), ...getOverflowAncestors(floating)] : [];
+  const ancestors = ancestorScroll || ancestorResize ? [...(isElement(reference) ? getOverflowAncestors(reference) : reference.contextElement ? getOverflowAncestors(reference.contextElement) : []), ...getOverflowAncestors(floating)] : [];
   ancestors.forEach(ancestor => {
     ancestorScroll && ancestor.addEventListener('scroll', update, {
       passive: true
@@ -1417,6 +1380,11 @@ function autoUpdate(reference, floating, update, options) {
       initialUpdate = false;
     });
     isElement(reference) && !animationFrame && observer.observe(reference);
+
+    if (!isElement(reference) && reference.contextElement && !animationFrame) {
+      observer.observe(reference.contextElement);
+    }
+
     observer.observe(floating);
   }
 
@@ -1495,7 +1463,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-ab5672bb.js');
+    const { getClippingRect, getElementRects, getOffsetParent } = await import('./nonChromiumPlatformUtils-38b56ea7.js');
     platform.getClippingRect = getClippingRect;
     platform.getOffsetParent = getOffsetParent;
     platform.getElementRects = getElementRects;

package/dist/esm/{focusTrapComponent-94194c83.js → focusTrapComponent-abc370ad.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.646
+ * v1.0.0-next.648
  */
-import { f as focusElement } from './dom-c7442d5a.js';
+import { f as focusElement } from './dom-c8898dc4.js';
 
 /*!
 * tabbable 6.0.1

package/dist/esm/{form-a676c099.js → form-44011828.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.646
+ * v1.0.0-next.648
  */
-import { c as closestElementCrossShadowBoundary } from './dom-c7442d5a.js';
-import { h } from './index-3db52168.js';
+import { c as closestElementCrossShadowBoundary } from './dom-c8898dc4.js';
+import { h } from './index-d13d66db.js';
 
 /**
  * Exported for testing purposes.

package/dist/esm/{guid-2a3eda01.js → guid-eaa87c08.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.646
+ * v1.0.0-next.648
  */
 function gen(counts) {
   return counts

package/dist/esm/{index-3db52168.js → index-d13d66db.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.646
+ * v1.0.0-next.648
  */
 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.646
+ * v1.0.0-next.648
  */

package/dist/esm/{interactive-26387dc4.js → interactive-ee7f9950.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.646
+ * v1.0.0-next.648
  */
 function noopClick() {
   /** noop */

package/dist/esm/{interfaces-65ac0d72.js → interfaces-e740f58c.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.646
+ * v1.0.0-next.648
  */
 var StatusIcons;
 (function (StatusIcons) {

package/dist/esm/{key-411c120d.js → key-23509709.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.646
+ * v1.0.0-next.648
  */
 function isActivationKey(key) {
   return key === "Enter" || key === " ";

package/dist/esm/{label-2102b073.js → label-226b0181.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.646
+ * v1.0.0-next.648
  */
-import { q as queryElementRoots, c as closestElementCrossShadowBoundary } from './dom-c7442d5a.js';
+import { q as queryElementRoots, c as closestElementCrossShadowBoundary } from './dom-c8898dc4.js';
 
 /**
  * Exported for testing purposes only

package/dist/esm/{loadable-b4a4f025.js → loadable-5df6cd58.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.646
+ * v1.0.0-next.648
  */
 const resolveMap = new WeakMap();
 const promiseMap = new WeakMap();