@esri/solutions-components 0.10.4 → 0.10.5

package/dist/components/date-picker.js

@@ -3,11 +3,12 @@
  * Licensed under the Apache License, Version 2.0
  * http://www.apache.org/licenses/LICENSE-2.0
  */
-import { getAssetPath, proxyCustomElement, HTMLElement, createEvent, h, Host, Build } from '@stencil/core/internal/client';
+import { getAssetPath, proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { d as dateFromISO, g as getDaysDiff, a as dateToISO, b as dateFromRange, s as setEndOfDay } from './date.js';
 import { c as componentFocusable, s as setUpLoadableComponent, a as setComponentLoaded } from './loadable.js';
 import { g as getSupportedLocale, c as connectLocalized, d as disconnectLocalized, n as numberStringFormatter, b as getDateTimeFormat } from './locale2.js';
 import { c as connectMessages, d as disconnectMessages, s as setUpMessages, u as updateMessages } from './t9n.js';
+import { i as isBrowser } from './browser.js';
 import { d as defineCustomElement$4 } from './date-picker-day.js';
 import { d as defineCustomElement$3 } from './date-picker-month.js';
 import { d as defineCustomElement$2 } from './date-picker-month-header.js';
@@ -16,7 +17,7 @@ import { d as defineCustomElement$1 } from './icon.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.10.1
+ * v2.11.1
  */
 const HEADING_LEVEL = 2;
 const DATE_PICKER_FORMAT_OPTIONS = { dateStyle: "full" };
@@ -24,7 +25,7 @@ const DATE_PICKER_FORMAT_OPTIONS = { dateStyle: "full" };
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.10.1
+ * v2.11.1
  */
 /**
  * CLDR cache.
@@ -408,7 +409,7 @@ const DatePicker = /*@__PURE__*/ proxyCustomElement(class DatePicker extends HTM
                 ? endDate || this.maxAsDate
                 : this.maxAsDate
             : this.maxAsDate;
-        return (h(Host, { key: 'd144e75cd7294401677080bd08b9765f083144fc', onBlur: this.resetActiveDates, onKeyDown: this.keyDownHandler }, this.renderCalendar(activeDate, maxDate, minDate, date, endDate)));
+        return (h(Host, { key: '52087d405fc20cd885910944004caef0e4b4e33b', onBlur: this.resetActiveDates, onKeyDown: this.keyDownHandler }, this.renderCalendar(activeDate, maxDate, minDate, date, endDate)));
     }
     effectiveLocaleChange() {
         updateMessages(this, this.effectiveLocale);
@@ -422,7 +423,7 @@ const DatePicker = /*@__PURE__*/ proxyCustomElement(class DatePicker extends HTM
         }
     }
     async loadLocaleData() {
-        if (!Build.isBrowser) {
+        if (!isBrowser()) {
             return;
         }
         numberStringFormatter.numberFormatOptions = {

package/dist/components/date.js

@@ -8,7 +8,7 @@ import { n as numberStringFormatter } from './locale2.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.10.1
+ * v2.11.1
  */
 /**
  * Check if date is within a min and max

package/dist/components/dom.js

@@ -578,7 +578,7 @@ var isFocusable = function isFocusable(node, options) {
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.10.1
+ * v2.11.1
  */
 /**
  * The default `focus-trap/tabbable` options.
@@ -867,6 +867,16 @@ function querySingle(element, slotSelector, options) {
 function filterDirectChildren(el, selector) {
     return Array.from(el.children).filter((child) => child.matches(selector));
 }
+/**
+ * Filters an array of HTML elements by the provided css selector string.
+ *
+ * @param {Element[]} elements An array of elements, such as one returned by HTMLSlotElement.assignedElements().
+ * @param {string} selector The CSS selector string to filter the returned elements by.
+ * @returns {Element[]} A filtered array of elements.
+ */
+function filterElementsBySelector(elements, selector) {
+    return elements.filter((element) => element.matches(selector));
+}
 /**
  * Set a default icon from a defined set or allow an override with an icon name string
  *
@@ -986,12 +996,24 @@ function slotChangeHasAssignedElement(event) {
  * ```
  *
  * @param {Event} event The event.
- * @returns {boolean} Whether the slot has any assigned elements.
+ * @param {string} selector The CSS selector string to filter the returned elements by.
+ * @returns {Element[]} An array of elements.
+ */
+function slotChangeGetAssignedElements(event, selector) {
+    return getSlotAssignedElements(event.target, selector);
+}
+/**
+ * This helper returns the assigned elements on a `slot` element, filtered by an optional css selector.
+ *
+ * @param {HTMLSlotElement} slot The slot element.
+ * @param {string} selector CSS selector string to filter the returned elements by.
+ * @returns {Element[]} An array of elements.
  */
-function slotChangeGetAssignedElements(event) {
-    return event.currentTarget.assignedElements({
+function getSlotAssignedElements(slot, selector) {
+    const assignedElements = slot.assignedElements({
         flatten: true,
     });
+    return selector ? filterElementsBySelector(assignedElements, selector) : assignedElements;
 }
 /**
  * This helper returns true if the pointer event fired from the primary button of the device.
@@ -1152,4 +1174,4 @@ function getTransitionOrAnimationName(event) {
     return isTransitionEvent(event) ? event.propertyName : event.animationName;
 }
 
-export { nodeListToArray as A, filterDirectChildren as B, getElementWidth as C, getTextWidth as D, getFirstTabbable as E, ensureId as F, getShadowRootNode as G, getSlotted as a, intersects as b, closestElementCrossShadowBoundary as c, isBefore as d, containsCrossShadowBoundary as e, focusElement as f, getElementDir as g, slotChangeGetAssignedElements as h, isPrimaryPointerButton as i, slotChangeHasAssignedElement as j, focusFirstTabbable as k, isKeyboardTriggeredClick as l, isFocusable as m, tabbable as n, focusable as o, isTabbable as p, queryElementRoots as q, getTabIndex as r, setRequestedIcon as s, toAriaBoolean as t, tabbableOptions as u, getModeName as v, whenTransitionDone as w, slotChangeHasContent as x, focusElementInGroup as y, whenAnimationDone as z };
+export { nodeListToArray as A, filterDirectChildren as B, getSlotAssignedElements as C, getElementWidth as D, getTextWidth as E, getFirstTabbable as F, ensureId as G, getShadowRootNode as H, getSlotted as a, intersects as b, closestElementCrossShadowBoundary as c, isBefore as d, containsCrossShadowBoundary as e, focusElement as f, getElementDir as g, slotChangeGetAssignedElements as h, isPrimaryPointerButton as i, slotChangeHasAssignedElement as j, focusFirstTabbable as k, isKeyboardTriggeredClick as l, isFocusable as m, tabbable as n, focusable as o, isTabbable as p, queryElementRoots as q, getTabIndex as r, setRequestedIcon as s, toAriaBoolean as t, tabbableOptions as u, getModeName as v, whenTransitionDone as w, slotChangeHasContent as x, focusElementInGroup as y, whenAnimationDone as z };

package/dist/components/dropdown-group.js

@@ -45,9 +45,9 @@ const DropdownGroup = /*@__PURE__*/ proxyCustomElement(class DropdownGroup exten
     render() {
         const groupTitle = this.groupTitle ? (h("span", { "aria-hidden": "true", class: "dropdown-title" }, this.groupTitle)) : null;
         const dropdownSeparator = this.groupPosition > 0 ? h("div", { class: "dropdown-separator", role: "separator" }) : null;
-        return (h(Host, { key: '316d4d5c0cc68f5a34a2e53054ec6b4420e04092', "aria-label": this.groupTitle, role: "group" }, h("div", { key: '3eaadb9712203a1981d811ada11d91537f91cc03', class: {
+        return (h(Host, { key: '1c189e8ff87a118d296781b729c889307c2b4a5b', "aria-label": this.groupTitle, role: "group" }, h("div", { key: '2afc3aee9c68b26af882168ce24cb2937a17c9e8', class: {
                 [CSS.container]: true,
-            } }, dropdownSeparator, groupTitle, h("slot", { key: '8c0623959ab646c6ce923f388a3eaa6587b777cf' }))));
+            } }, dropdownSeparator, groupTitle, h("slot", { key: '3fdcfab750b0541a4a24764f1a1875c867db06e8' }))));
     }
     //--------------------------------------------------------------------------
     //

package/dist/components/dropdown-item.js

@@ -65,9 +65,9 @@ const DropdownItem = /*@__PURE__*/ proxyCustomElement(class DropdownItem extends
     }
     render() {
         const { href, selectionMode, label, iconFlipRtl } = this;
-        const iconStartEl = (h("calcite-icon", { key: '7a49a68a114bbce2e5952ac3e1155bf1ab8988de', class: CSS.iconStart, flipRtl: iconFlipRtl === "start" || iconFlipRtl === "both", icon: this.iconStart, scale: getIconScale(this.scale) }));
-        const contentNode = (h("span", { key: '8b288dfdc41b23e69be84228b5fc9457f054221a', class: CSS.itemContent }, h("slot", { key: '845d4d31ab01bf4cf37f8a03f8a129a3c297070d' })));
-        const iconEndEl = (h("calcite-icon", { key: 'd25c100431814a69d32ee8b1e2ae24ea507ccd49', class: CSS.iconEnd, flipRtl: iconFlipRtl === "end" || iconFlipRtl === "both", icon: this.iconEnd, scale: getIconScale(this.scale) }));
+        const iconStartEl = (h("calcite-icon", { key: '335624555fbf5f4e36fa0b58b7e84a722f64cdf2', class: CSS.iconStart, flipRtl: iconFlipRtl === "start" || iconFlipRtl === "both", icon: this.iconStart, scale: getIconScale(this.scale) }));
+        const contentNode = (h("span", { key: '54082db67b2cd412f5167950609387884b8ac878', class: CSS.itemContent }, h("slot", { key: 'b7c949c4dffae482fd398c21e062763fc1f06ba8' })));
+        const iconEndEl = (h("calcite-icon", { key: 'c9e8ce2e26943b228fd3912661486f5a7b58d8c2', class: CSS.iconEnd, flipRtl: iconFlipRtl === "end" || iconFlipRtl === "both", icon: this.iconEnd, scale: getIconScale(this.scale) }));
         const slottedContent = this.iconStart && this.iconEnd
             ? [iconStartEl, contentNode, iconEndEl]
             : this.iconStart
@@ -85,7 +85,7 @@ const DropdownItem = /*@__PURE__*/ proxyCustomElement(class DropdownItem extends
                     : "menuitem";
         const itemAria = selectionMode !== "none" ? toAriaBoolean(this.selected) : null;
         const { disabled } = this;
-        return (h(Host, { key: 'b74558167715baacec14b7d5fa65fc39ae4c7892', "aria-checked": itemAria, "aria-label": !href ? label : "", role: itemRole, tabIndex: disabled ? -1 : 0 }, h(InteractiveContainer, { key: '70846dbb6b6619591122384f00a0bbbbfe367376', disabled: disabled }, h("div", { key: '7143c055705c6d83183986e0418011048c01f184', class: {
+        return (h(Host, { key: '3ccaf1fea0138cbd2bbb93fb332746587e792f6e', "aria-checked": itemAria, "aria-label": !href ? label : "", role: itemRole, tabIndex: disabled ? -1 : 0 }, h(InteractiveContainer, { key: '0fc367e9272db04f7b620913774374e9a889cc55', disabled: disabled }, h("div", { key: 'd019973424b439f54f7b269cc48747d52ab7ede3', class: {
                 [CSS.container]: true,
                 [CSS.containerNone]: selectionMode === "none",
             } }, selectionMode !== "none" ? (h("calcite-icon", { class: CSS.icon, icon: selectionMode === "multiple" ? "check" : "bullet-point", scale: getIconScale(this.scale) })) : null, contentEl))));

package/dist/components/dropdown.js

@@ -16,7 +16,7 @@ import { o as onToggleOpenCloseComponent } from './openCloseComponent.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.10.1
+ * v2.11.1
  */
 const SLOTS = {
     dropdownTrigger: "trigger",
@@ -41,18 +41,11 @@ const Dropdown = /*@__PURE__*/ proxyCustomElement(class Dropdown extends HTMLEle
         this.resizeObserver = createObserver("resize", (entries) => this.resizeObserverCallback(entries));
         this.openTransitionProp = "opacity";
         this.guid = `calcite-dropdown-${guid()}`;
-        this.defaultAssignedElements = [];
         //--------------------------------------------------------------------------
         //
         //  Private Methods
         //
         //--------------------------------------------------------------------------
-        this.slotChangeHandler = (event) => {
-            this.defaultAssignedElements = event.target.assignedElements({
-                flatten: true,
-            });
-            this.updateItems();
-        };
         this.setFilteredPlacements = () => {
             const { el, flipPlacements } = this;
             this.filteredFlipPlacements = flipPlacements
@@ -252,11 +245,11 @@ const Dropdown = /*@__PURE__*/ proxyCustomElement(class Dropdown extends HTMLEle
     }
     render() {
         const { open, guid } = this;
-        return (h(Host, { key: '660d6b0944d2dc3d79357dae7b66a6d2c8f9c3a9' }, h(InteractiveContainer, { key: '1f32f4c315d77b8248c575eea7a38117bf57f1df', disabled: this.disabled }, h("div", { key: '6f1658b0c35a39f8c2614cf0dd95e07d2b0c5c9a', class: "calcite-trigger-container", id: `${guid}-menubutton`, onClick: this.openCalciteDropdown, onKeyDown: this.keyDownHandler, ref: this.setReferenceEl }, h("slot", { key: '3e97cec359dc5a14ebb285fa8d616c6f30d46b88', "aria-controls": `${guid}-menu`, "aria-expanded": toAriaBoolean(open), "aria-haspopup": "menu", name: SLOTS.dropdownTrigger, onSlotchange: this.updateTriggers })), h("div", { key: 'cfc6e225664a43cb6c9bd44785999d2fc9e0ce33', "aria-hidden": toAriaBoolean(!open), class: "calcite-dropdown-wrapper", ref: this.setFloatingEl }, h("div", { key: '1f27f69083e5a67a34a9824e5bd513fe500775fb', "aria-labelledby": `${guid}-menubutton`, class: {
+        return (h(Host, { key: '50bf6651c3987190f8477b2eebc33d2832685a10' }, h(InteractiveContainer, { key: '68d2c96cae443f3d03b961d1c36ac3a32317c6d4', disabled: this.disabled }, h("div", { key: '4bbebf0841d4de7628f6d7940b40299db864c518', class: "calcite-trigger-container", id: `${guid}-menubutton`, onClick: this.openCalciteDropdown, onKeyDown: this.keyDownHandler, ref: this.setReferenceEl }, h("slot", { key: '37e2ae56c41dcddf9be92f4d7b80b153c8a87fb8', "aria-controls": `${guid}-menu`, "aria-expanded": toAriaBoolean(open), "aria-haspopup": "menu", name: SLOTS.dropdownTrigger, onSlotchange: this.updateTriggers })), h("div", { key: 'f1faff59ee51a993e26c5bdfe59923538b818dfe', "aria-hidden": toAriaBoolean(!open), class: "calcite-dropdown-wrapper", ref: this.setFloatingEl }, h("div", { key: '6eb119e4452038a3d54d356d9818ea1cf8f0f62c', "aria-labelledby": `${guid}-menubutton`, class: {
                 ["calcite-dropdown-content"]: true,
                 [FloatingCSS.animation]: true,
                 [FloatingCSS.animationActive]: open,
-            }, id: `${guid}-menu`, ref: this.setScrollerAndTransitionEl, role: "menu" }, h("slot", { key: '66b2dce743680e932ac668f18bcd59df0647b165', onSlotchange: this.updateGroups }))))));
+            }, id: `${guid}-menu`, ref: this.setScrollerAndTransitionEl, role: "menu" }, h("slot", { key: '9bbe78ed3e58e5fb986cedcb3e947c4a755e0c88', onSlotchange: this.updateGroups }))))));
     }
     //--------------------------------------------------------------------------
     //

package/dist/components/filter.js

@@ -737,7 +737,7 @@ function forIn(object, iteratee) {
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.10.1
+ * v2.11.1
  */
 const filter = (data, value, filterProps) => {
     const escapedValue = escapeRegExp(value);

package/dist/components/filter2.js

@@ -9,6 +9,7 @@ import { c as connectInteractive, u as updateHostInteraction, d as disconnectInt
 import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable.js';
 import { c as connectLocalized, d as disconnectLocalized } from './locale2.js';
 import { u as updateMessages, s as setUpMessages, c as connectMessages, d as disconnectMessages } from './t9n.js';
+import { D as DEBOUNCE } from './resources.js';
 import { d as defineCustomElement$3 } from './icon.js';
 import { d as defineCustomElement$2 } from './input.js';
 import { d as defineCustomElement$1 } from './progress.js';
@@ -17,7 +18,7 @@ import { d as debounce } from './debounce.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.10.1
+ * v2.11.1
  */
 const CSS = {
     container: "container",
@@ -27,7 +28,6 @@ const ICONS = {
     search: "search",
     close: "x",
 };
-const DEBOUNCE_TIMEOUT = 250;
 
 const filterCss = ":host{box-sizing:border-box;background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-2);font-size:var(--calcite-font-size--1)}:host *{box-sizing:border-box}:host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:flex;inline-size:100%}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}.container{display:flex;inline-size:100%;padding:0.5rem}label{position:relative;margin-inline:0.25rem;margin-block:0px;display:flex;inline-size:100%;align-items:center;overflow:hidden}input[type=text]{margin-block-end:0.25rem;inline-size:100%;border-style:none;background-color:transparent;padding-block:0.25rem;font-family:inherit;font-size:var(--calcite-font-size--2);line-height:1rem;color:var(--calcite-color-text-1);padding-inline-end:0.25rem;padding-inline-start:1.5rem;transition:padding var(--calcite-animation-timing), box-shadow var(--calcite-animation-timing)}input[type=text]::-ms-clear{display:none}calcite-input{inline-size:100%}.search-icon{position:absolute;display:flex;color:var(--calcite-color-text-2);inset-inline-start:0;transition:inset-inline-start var(--calcite-animation-timing), inset-inline-end var(--calcite-animation-timing), opacity var(--calcite-animation-timing)}input[type=text]:focus{border-color:var(--calcite-color-brand);outline:2px solid transparent;outline-offset:2px;padding-inline:0.25rem}input[type=text]:focus~.search-icon{inset-inline-start:calc(1rem * -1);opacity:0}.clear-button{display:flex;cursor:pointer;align-items:center;border-width:0px;background-color:transparent;color:var(--calcite-color-text-2)}.clear-button:hover,.clear-button:focus{color:var(--calcite-color-text-1)}:host([hidden]){display:none}[hidden]{display:none}";
 const CalciteFilterStyle0 = filterCss;
@@ -44,7 +44,7 @@ const Filter = /*@__PURE__*/ proxyCustomElement(class Filter extends HTMLElement
         //
         // --------------------------------------------------------------------------
         this.filterDebounced = debounce((value, emit = false, onFilter) => this.items.length &&
-            this.updateFiltered(filter(this.items, value, this.filterProps), emit, onFilter), DEBOUNCE_TIMEOUT);
+            this.updateFiltered(filter(this.items, value, this.filterProps), emit, onFilter), DEBOUNCE.filter);
         this.inputHandler = (event) => {
             const target = event.target;
             this.value = target.value;
@@ -161,7 +161,7 @@ const Filter = /*@__PURE__*/ proxyCustomElement(class Filter extends HTMLElement
     // --------------------------------------------------------------------------
     render() {
         const { disabled, scale } = this;
-        return (h(InteractiveContainer, { key: 'f22271e30b567b7d88898e0c1c6d2131d3eecdba', disabled: disabled }, h("div", { key: 'ce9ca2a8669e825fc0a9bb6bbb64e14054e80308', class: CSS.container }, h("label", { key: '031e40138a6dc0c2ad814e73e2fd7e24ea03f017' }, h("calcite-input", { key: 'd66d58ea14ed30279b8b2ea063651a53d4cf0a0d', clearable: true, disabled: disabled, icon: ICONS.search, label: this.messages.label, messageOverrides: { clear: this.messages.clear }, onCalciteInputInput: this.inputHandler, onKeyDown: this.keyDownHandler, placeholder: this.placeholder, ref: (el) => {
+        return (h(InteractiveContainer, { key: '45e216d51b5b12ddc4295ade0be6dd451aeef851', disabled: disabled }, h("div", { key: '72a041cd4c1a9afcc3e20dc48719024fa0bd91d8', class: CSS.container }, h("label", { key: '94096613f5abe9d5334b47986556a7d8aaac4556' }, h("calcite-input", { key: 'cb61179b03fca1436146f80a96adc6177fb92a2e', clearable: true, disabled: disabled, icon: ICONS.search, label: this.messages.label, messageOverrides: { clear: this.messages.clear }, onCalciteInputInput: this.inputHandler, onKeyDown: this.keyDownHandler, placeholder: this.placeholder, ref: (el) => {
                 this.textInput = el;
             }, scale: scale, type: "text", value: this.value })))));
     }

package/dist/components/floating-ui.js

@@ -3,8 +3,9 @@
  * Licensed under the Apache License, Version 2.0
  * http://www.apache.org/licenses/LICENSE-2.0
  */
-import { Build } from '@stencil/core/internal/client';
+import { D as DEBOUNCE } from './resources.js';
 import { g as getElementDir } from './dom.js';
+import { i as isBrowser } from './browser.js';
 import { d as debounce } from './debounce.js';
 
 /**
@@ -1210,9 +1211,18 @@ function isOverflowElement(element) {
 function isTableElement(element) {
   return ['table', 'td', 'th'].includes(getNodeName(element));
 }
-function isContainingBlock(element) {
+function isTopLayer(element) {
+  return [':popover-open', ':modal'].some(selector => {
+    try {
+      return element.matches(selector);
+    } catch (e) {
+      return false;
+    }
+  });
+}
+function isContainingBlock(elementOrCss) {
   const webkit = isWebKit();
-  const css = getComputedStyle$1(element);
+  const css = isElement(elementOrCss) ? getComputedStyle$1(elementOrCss) : elementOrCss;
 
   // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
   return css.transform !== 'none' || css.perspective !== 'none' || (css.containerType ? css.containerType !== 'normal' : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== 'none' : false) || !webkit && (css.filter ? css.filter !== 'none' : false) || ['transform', 'perspective', 'filter'].some(value => (css.willChange || '').includes(value)) || ['paint', 'layout', 'strict', 'content'].some(value => (css.contain || '').includes(value));
@@ -1222,6 +1232,8 @@ function getContainingBlock(element) {
   while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
     if (isContainingBlock(currentNode)) {
       return currentNode;
+    } else if (isTopLayer(currentNode)) {
+      return null;
     }
     currentNode = getParentNode(currentNode);
   }
@@ -1245,8 +1257,8 @@ function getNodeScroll(element) {
     };
   }
   return {
-    scrollLeft: element.pageXOffset,
-    scrollTop: element.pageYOffset
+    scrollLeft: element.scrollX,
+    scrollTop: element.scrollY
   };
 }
 function getParentNode(node) {
@@ -1286,10 +1298,14 @@ function getOverflowAncestors(node, list, traverseIframes) {
   const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body);
   const win = getWindow(scrollableAncestor);
   if (isBody) {
-    return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], win.frameElement && traverseIframes ? getOverflowAncestors(win.frameElement) : []);
+    const frameElement = getFrameElement(win);
+    return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
   }
   return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
 }
+function getFrameElement(win) {
+  return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
+}
 
 function getCssDimensions(element) {
   const css = getComputedStyle$1(element);
@@ -1418,17 +1434,6 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
   });
 }
 
-const topLayerSelectors = [':popover-open', ':modal'];
-function isTopLayer(element) {
-  return topLayerSelectors.some(selector => {
-    try {
-      return element.matches(selector);
-    } catch (e) {
-      return false;
-    }
-  });
-}
-
 function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
   let {
     elements,
@@ -1990,7 +1995,6 @@ const computePosition = (reference, floating, options) => {
   });
 };
 
-/* eslint-disable @typescript-eslint/ban-types */
 function offsetParent(element) {
     return offsetParentPolyfill(element);
 }
@@ -2018,11 +2022,11 @@ function offsetParentPolyfill(element) {
             continue;
         }
         const style = getComputedStyle(ancestor);
-        // Display:contents nodes aren't in the layout tree so they should be skipped.
+        // Display:contents nodes aren't in the layout tree, so they should be skipped.
         if (style.display === 'contents') {
             continue;
         }
-        if (style.position !== 'static' || style.filter !== 'none') {
+        if (style.position !== 'static' || isContainingBlock(style)) {
             return ancestor;
         }
         if (ancestor.tagName === 'BODY') {
@@ -2035,10 +2039,10 @@ function offsetParentPolyfill(element) {
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.10.1
+ * v2.11.1
  */
 (function setUpFloatingUiForShadowDomPositioning() {
-    if (Build.isBrowser) {
+    if (isBrowser()) {
         const originalGetOffsetParent = platform.getOffsetParent;
         platform.getOffsetParent = (element) => originalGetOffsetParent(element, offsetParent);
     }
@@ -2140,10 +2144,6 @@ async (component, { referenceEl, floatingEl, overlayPositioning = "absolute", pl
  * Exported for testing purposes only
  */
 const placementDataAttribute = "data-placement";
-/**
- * Exported for testing purposes only
- */
-const repositionDebounceTimeout = 100;
 const flipPlacements = [
     "top",
     "bottom",
@@ -2255,9 +2255,9 @@ function getDebouncedReposition(component) {
     if (debounced) {
         return debounced;
     }
-    debounced = debounce(positionFloatingUI, repositionDebounceTimeout, {
+    debounced = debounce(positionFloatingUI, DEBOUNCE.reposition, {
         leading: true,
-        maxWait: repositionDebounceTimeout,
+        maxWait: DEBOUNCE.reposition,
     });
     componentToDebouncedRepositionMap.set(component, debounced);
     return debounced;
@@ -2279,7 +2279,7 @@ async function runAutoUpdate(component, referenceEl, floatingEl) {
     if (!floatingEl.isConnected) {
         return;
     }
-    const effectiveAutoUpdate = Build.isBrowser
+    const effectiveAutoUpdate = isBrowser()
         ? autoUpdate
         : (_refEl, _floatingEl, updateCallback) => {
             updateCallback();

package/dist/components/flow-item.js

@@ -20,7 +20,7 @@ import { d as defineCustomElement$1 } from './scrim.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.10.1
+ * v2.11.1
  */
 const CSS = {
     backButton: "back-button",
@@ -31,6 +31,7 @@ const ICONS = {
 };
 const SLOTS = {
     actionBar: "action-bar",
+    alerts: "alerts",
     contentTop: "content-top",
     contentBottom: "content-bottom",
     headerActionsStart: "header-actions-start",
@@ -67,6 +68,7 @@ const FlowItem = /*@__PURE__*/ proxyCustomElement(class FlowItem extends HTMLEle
         };
         this.handlePanelClose = (event) => {
             event.stopPropagation();
+            this.closed = true;
             this.calciteFlowItemClose.emit();
         };
         this.handlePanelToggle = (event) => {
@@ -89,6 +91,7 @@ const FlowItem = /*@__PURE__*/ proxyCustomElement(class FlowItem extends HTMLEle
         this.collapseDirection = "down";
         this.collapsible = false;
         this.beforeBack = undefined;
+        this.beforeClose = undefined;
         this.description = undefined;
         this.disabled = false;
         this.heading = undefined;
@@ -98,6 +101,7 @@ const FlowItem = /*@__PURE__*/ proxyCustomElement(class FlowItem extends HTMLEle
         this.messageOverrides = undefined;
         this.messages = undefined;
         this.overlayPositioning = "absolute";
+        this.scale = "m";
         this.showBackButton = false;
         this.defaultMessages = undefined;
         this.effectiveLocale = "";
@@ -182,8 +186,8 @@ const FlowItem = /*@__PURE__*/ proxyCustomElement(class FlowItem extends HTMLEle
         return showBackButton ? (h("calcite-action", { "aria-label": label, class: CSS.backButton, icon: icon, key: "flow-back-button", onClick: backButtonClick, ref: this.setBackRef, scale: "s", slot: "header-actions-start", text: label, title: label })) : null;
     }
     render() {
-        const { collapsed, collapseDirection, collapsible, closable, closed, description, disabled, heading, headingLevel, loading, menuOpen, messages, overlayPositioning, } = this;
-        return (h(Host, { key: '386f2c2d780c8b3a1be28a8680b6f99c9ded37e6' }, h(InteractiveContainer, { key: '6e80e71a06923e966ac75f8b8c172586444e3ccb', disabled: disabled }, h("calcite-panel", { key: '175b4bcfdecb5b4c59d5c76db6fcae7975ee5884', closable: closable, closed: closed, collapseDirection: collapseDirection, collapsed: collapsed, collapsible: collapsible, description: description, disabled: disabled, heading: heading, headingLevel: headingLevel, loading: loading, menuOpen: menuOpen, messageOverrides: messages, onCalcitePanelClose: this.handlePanelClose, onCalcitePanelScroll: this.handlePanelScroll, onCalcitePanelToggle: this.handlePanelToggle, overlayPositioning: overlayPositioning, ref: this.setContainerRef }, this.renderBackButton(), h("slot", { key: '6e0ac6b3c3b62a5be7a6a21fbe55e56c1d4ad90a', name: SLOTS.actionBar, slot: SLOTS$1.actionBar }), h("slot", { key: 'b2036686e62d9b5c8ecc39e8ee025e98798d7dec', name: SLOTS.headerActionsStart, slot: SLOTS$1.headerActionsStart }), h("slot", { key: '66c09bbb9cd21327a9cc04b3046c5264b475a77d', name: SLOTS.headerActionsEnd, slot: SLOTS$1.headerActionsEnd }), h("slot", { key: 'cd02bc580db5ecdd98b0bbbfa99655871c04bda4', name: SLOTS.headerContent, slot: SLOTS$1.headerContent }), h("slot", { key: 'b855684ce946c66b4c13756abd1865ab420715f0', name: SLOTS.headerMenuActions, slot: SLOTS$1.headerMenuActions }), h("slot", { key: 'f1d29575abbdb582c04d674dfef7f4a9d385da10', name: SLOTS.fab, slot: SLOTS$1.fab }), h("slot", { key: '3033128596131e0f1fd62b28cba07957d1707d0c', name: SLOTS.contentTop, slot: SLOTS$1.contentTop }), h("slot", { key: 'c8cf03fbacebe288afc909b9c8989242c201df8c', name: SLOTS.contentBottom, slot: SLOTS$1.contentBottom }), h("slot", { key: '09e19f66b3a855689539dc511b1b826830a90283', name: SLOTS.footer, slot: SLOTS$1.footer }, h("slot", { key: 'e7519384a44ee5f1f19d9747c44007ca7b95f4c8', name: SLOTS.footerStart, slot: SLOTS$1.footerStart }), h("slot", { key: 'abd54ab99d62783f603118361bda307c3d108af0', name: SLOTS.footerEnd, slot: SLOTS$1.footerEnd })), h("slot", { key: '9319eff4559e39701a1f838c1add5b8f57f01f2b', name: SLOTS.footerActions, slot: SLOTS$1.footerActions }), h("slot", { key: 'bd1cc6da3068868bfaf3ba8a0e524d0d138db940' })))));
+        const { collapsed, collapseDirection, collapsible, closable, closed, description, disabled, heading, headingLevel, loading, menuOpen, messages, overlayPositioning, beforeClose, } = this;
+        return (h(Host, { key: '10a182247900f88d506ad09184e6ece24f432286' }, h(InteractiveContainer, { key: '457baca75f34051cbeb62b40f770d81c6e2b6565', disabled: disabled }, h("calcite-panel", { key: 'f3ac8082ae34e8fb99c0384c75de1075a8630115', beforeClose: beforeClose, closable: closable, closed: closed, collapseDirection: collapseDirection, collapsed: collapsed, collapsible: collapsible, description: description, disabled: disabled, heading: heading, headingLevel: headingLevel, loading: loading, menuOpen: menuOpen, messageOverrides: messages, onCalcitePanelClose: this.handlePanelClose, onCalcitePanelScroll: this.handlePanelScroll, onCalcitePanelToggle: this.handlePanelToggle, overlayPositioning: overlayPositioning, ref: this.setContainerRef, scale: this.scale }, this.renderBackButton(), h("slot", { key: '86e59d53193c52fa13f3b15edd422f6dccebce08', name: SLOTS.actionBar, slot: SLOTS$1.actionBar }), h("slot", { key: '016695b76033387057b952da658a19fa961e3038', name: SLOTS.alerts, slot: SLOTS$1.alerts }), h("slot", { key: '0a937c9ee0e192e24ef199c3d7f072628b6b687c', name: SLOTS.headerActionsStart, slot: SLOTS$1.headerActionsStart }), h("slot", { key: 'ce0b888b00b9c5ced046bb23fb4ea47230e24455', name: SLOTS.headerActionsEnd, slot: SLOTS$1.headerActionsEnd }), h("slot", { key: '7af455d66b2fe6d3a55dd54543d1e96e584eb7ca', name: SLOTS.headerContent, slot: SLOTS$1.headerContent }), h("slot", { key: 'f101ed5cc74987b375f22f3f9313fe68b3adb39b', name: SLOTS.headerMenuActions, slot: SLOTS$1.headerMenuActions }), h("slot", { key: '5a923bbbbeb67a69053145c36c0fd03dbb82c048', name: SLOTS.fab, slot: SLOTS$1.fab }), h("slot", { key: 'db2116031a390dfcb0c772a5b69b29caf11c61b2', name: SLOTS.contentTop, slot: SLOTS$1.contentTop }), h("slot", { key: '77d01f9d1be7cc5fbcecc694fca82616eaec4251', name: SLOTS.contentBottom, slot: SLOTS$1.contentBottom }), h("slot", { key: 'ed461c9b6efb646147a54a56238e0d5259505e60', name: SLOTS.footerStart, slot: SLOTS$1.footerStart }), h("slot", { key: 'f00171d0b49f373bb5f705b1f51b08a783a2081a', name: SLOTS.footer, slot: SLOTS$1.footer }), h("slot", { key: '0a62333c3642433517f42852c900b4e33d64df10', name: SLOTS.footerEnd, slot: SLOTS$1.footerEnd }), h("slot", { key: '2bc94a266a195140c504e8de5eb60b2860bcd1e2', name: SLOTS.footerActions, slot: SLOTS$1.footerActions }), h("slot", { key: 'dc6f25a4107d0bc8e0fa1cb3a4103f44717aacdd' })))));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return this; }
@@ -199,6 +203,7 @@ const FlowItem = /*@__PURE__*/ proxyCustomElement(class FlowItem extends HTMLEle
         "collapseDirection": [1, "collapse-direction"],
         "collapsible": [516],
         "beforeBack": [16],
+        "beforeClose": [16],
         "description": [1],
         "disabled": [516],
         "heading": [1],
@@ -208,6 +213,7 @@ const FlowItem = /*@__PURE__*/ proxyCustomElement(class FlowItem extends HTMLEle
         "messageOverrides": [1040],
         "messages": [1040],
         "overlayPositioning": [513, "overlay-positioning"],
+        "scale": [513],
         "showBackButton": [4, "show-back-button"],
         "defaultMessages": [32],
         "effectiveLocale": [32],

package/dist/components/flow.js

@@ -10,7 +10,7 @@ import { c as componentFocusable, s as setUpLoadableComponent, a as setComponent
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.10.1
+ * v2.11.1
  */
 const CSS = {
     frame: "frame",
@@ -141,7 +141,7 @@ const Flow = /*@__PURE__*/ proxyCustomElement(class Flow extends HTMLElement {
             [CSS.frameAdvancing]: flowDirection === "advancing",
             [CSS.frameRetreating]: flowDirection === "retreating",
         };
-        return (h("div", { key: '9d405841d7a1ee2d7a5da28c02ef8d5bf08dd9f5', class: frameDirectionClasses }, h("slot", { key: 'a02231a5002f8b19542e03529aad12771787b26f' })));
+        return (h("div", { key: '3d91e0e8d0ffb94e3e8d563e3b34b47b23b3987b', class: frameDirectionClasses }, h("slot", { key: 'fb32070e340ba86196b5150d2bcc884ac2d94901' })));
     }
     get el() { return this; }
     static get style() { return CalciteFlowStyle0; }

package/dist/components/focusTrapComponent.js

@@ -944,7 +944,7 @@ var createFocusTrap = function createFocusTrap(elements, userOptions) {
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.10.1
+ * v2.11.1
  */
 /**
  * Helper to set up the FocusTrap component.

package/dist/components/form.js

@@ -9,7 +9,7 @@ import { q as queryElementRoots, c as closestElementCrossShadowBoundary } from '
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.10.1
+ * v2.11.1
  */
 /**
  * Any form <Component> with a `calcite<Component>Input` event needs to be included in this array.

package/dist/components/graph.js

@@ -10,7 +10,7 @@ import { c as createObserver } from './observers.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.10.1
+ * v2.11.1
  */
 /**
  * Calculate slope of the tangents

package/dist/components/guid.js

@@ -6,7 +6,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.10.1
+ * v2.11.1
  */
 function gen(counts) {
     return counts

package/dist/components/handle.js

@@ -14,7 +14,7 @@ import { d as defineCustomElement$1 } from './icon.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.10.1
+ * v2.11.1
  */
 const CSS = {
     handle: "handle",
@@ -175,11 +175,11 @@ const Handle = /*@__PURE__*/ proxyCustomElement(class Handle extends HTMLElement
     render() {
         return (
         // Needs to be a span because of https://github.com/SortableJS/Sortable/issues/1486
-        h("span", { key: '1b435a33669241997f126e273bd36801182a0ce5', "aria-checked": this.disabled ? null : toAriaBoolean(this.selected), "aria-disabled": this.disabled ? toAriaBoolean(this.disabled) : null, "aria-label": this.disabled ? null : this.getAriaText("label"), class: { [CSS.handle]: true, [CSS.handleSelected]: !this.disabled && this.selected }, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, ref: (el) => {
+        h("span", { key: 'fc7e1d455dfa8a6815cfbfaead80624a02980bf0', "aria-checked": this.disabled ? null : toAriaBoolean(this.selected), "aria-disabled": this.disabled ? toAriaBoolean(this.disabled) : null, "aria-label": this.disabled ? null : this.getAriaText("label"), class: { [CSS.handle]: true, [CSS.handleSelected]: !this.disabled && this.selected }, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, ref: (el) => {
                 this.handleButton = el;
             },
             // role of radio is being applied to allow space key to select in screen readers
-            role: "radio", tabIndex: this.disabled ? null : 0, title: this.getTooltip() }, h("calcite-icon", { key: 'da7f46a07a28eab86153f1a04a8f82f4d7b3a0c6', icon: ICONS.drag, scale: "s" })));
+            role: "radio", tabIndex: this.disabled ? null : 0, title: this.getTooltip() }, h("calcite-icon", { key: 'c1c1a14e910437abf1e6860815d12e3f11835a63', icon: ICONS.drag, scale: "s" })));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return this; }

package/dist/components/icon.js

@@ -3,14 +3,15 @@
  * Licensed under the Apache License, Version 2.0
  * http://www.apache.org/licenses/LICENSE-2.0
  */
-import { getAssetPath, proxyCustomElement, HTMLElement, h, Host, Build } from '@stencil/core/internal/client';
+import { getAssetPath, proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { g as getElementDir, t as toAriaBoolean } from './dom.js';
 import { c as createObserver } from './observers.js';
+import { i as isBrowser } from './browser.js';
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.10.1
+ * v2.11.1
  */
 const CSS = {
     icon: "icon",
@@ -20,7 +21,7 @@ const CSS = {
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.10.1
+ * v2.11.1
  */
 /**
  * Icon data cache.
@@ -143,7 +144,7 @@ const Icon = /*@__PURE__*/ proxyCustomElement(class Icon extends HTMLElement {
         const size = scaleToPx[scale];
         const semantic = !!textLabel;
         const paths = [].concat(pathData || "");
-        return (h(Host, { key: 'c96ce47b404bd4f75deb2261a37963679b818452', "aria-hidden": toAriaBoolean(!semantic), "aria-label": semantic ? textLabel : null, role: semantic ? "img" : null }, h("svg", { key: '614da909e3822ade4a056af0180bb21e9eba9ad2', "aria-hidden": "true", class: {
+        return (h(Host, { key: 'cc43afdebd39df596be0a30677a9be5ba0db4fe0', "aria-hidden": toAriaBoolean(!semantic), "aria-label": semantic ? textLabel : null, role: semantic ? "img" : null }, h("svg", { key: 'a40833fc10f8bb7f287eb0c75f7437cb18880603', "aria-hidden": "true", class: {
                 [CSS.flipRtl]: dir === "rtl" && flipRtl,
                 svg: true,
             }, fill: "currentColor", height: "100%", viewBox: `0 0 ${size} ${size}`, width: "100%", xmlns: "http://www.w3.org/2000/svg" }, paths.map((path) => typeof path === "string" ? (h("path", { d: path })) : (h("path", { d: path.d, opacity: "opacity" in path ? path.opacity : 1 }))))));
@@ -155,7 +156,7 @@ const Icon = /*@__PURE__*/ proxyCustomElement(class Icon extends HTMLElement {
     //--------------------------------------------------------------------------
     async loadIconPathData() {
         const { icon, scale, visible } = this;
-        if (!Build.isBrowser || !icon || !visible) {
+        if (!isBrowser() || !icon || !visible) {
             return;
         }
         const fetchIconProps = { icon, scale };