@esri/calcite-components 2.2.1-next.0 → 2.3.0-next.0

package/dist/types/components/block/block.d.ts

@@ -8,6 +8,7 @@ import { Status } from "../interfaces";
 import { BlockMessages } from "./assets/block/t9n";
 import { LoadableComponent } from "../../utils/loadable";
 import { OpenCloseComponent } from "../../utils/openCloseComponent";
+import { OverlayPositioning } from "../../utils/floating-ui";
 /**
  * @slot - A slot for adding custom content.
  * @slot icon - A slot for adding a leading header icon with `calcite-icon`.
@@ -63,6 +64,15 @@ export declare class Block implements ConditionalSlotComponent, InteractiveCompo
      */
     messageOverrides: Partial<BlockMessages>;
     onMessagesChange(): void;
+    /**
+     * Determines the type of positioning to use for the overlaid content.
+     *
+     * Using `"absolute"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.
+     *
+     * `"fixed"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `"fixed"`.
+     *
+     */
+    overlayPositioning: OverlayPositioning;
     /**
      * Sets focus on the component's first tabbable element.
      *

package/dist/types/components/flow-item/flow-item.d.ts

@@ -5,6 +5,7 @@ import { LocalizedComponent } from "../../utils/locale";
 import { T9nComponent } from "../../utils/t9n";
 import { HeadingLevel } from "../functional/Heading";
 import { FlowItemMessages } from "./assets/flow-item/t9n";
+import { OverlayPositioning } from "../../utils/floating-ui";
 /**
  * @slot - A slot for adding custom content.
  * @slot action-bar - A slot for adding a `calcite-action-bar` to the component.
@@ -72,6 +73,15 @@ export declare class FlowItem implements InteractiveComponent, LoadableComponent
      * @internal
      */
     messages: FlowItemMessages;
+    /**
+     * Determines the type of positioning to use for the overlaid content.
+     *
+     * Using `"absolute"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.
+     *
+     * `"fixed"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `"fixed"`.
+     *
+     */
+    overlayPositioning: OverlayPositioning;
     /**
      * When `true`, displays a back button in the component's header.
      *

package/dist/types/components/panel/panel.d.ts

@@ -5,6 +5,7 @@ import { HeadingLevel } from "../functional/Heading";
 import { LocalizedComponent } from "../../utils/locale";
 import { T9nComponent } from "../../utils/t9n";
 import { PanelMessages } from "./assets/panel/t9n";
+import { OverlayPositioning } from "../../utils/floating-ui";
 /**
  * @slot - A slot for adding custom content.
  * @slot action-bar - A slot for adding a `calcite-action-bar` to the component.
@@ -68,6 +69,15 @@ export declare class Panel implements InteractiveComponent, LoadableComponent, L
      */
     messages: PanelMessages;
     onMessagesChange(): void;
+    /**
+     * Determines the type of positioning to use for the overlaid content.
+     *
+     * Using `"absolute"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.
+     *
+     * `"fixed"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `"fixed"`.
+     *
+     */
+    overlayPositioning: OverlayPositioning;
     connectedCallback(): void;
     componentWillLoad(): Promise<void>;
     componentDidLoad(): void;

package/dist/types/components.d.ts

@@ -9,8 +9,8 @@ import { Alignment, Appearance, Columns, FlipContext, Kind, Layout, LogicalFlowP
 import { RequestedItem } from "./components/accordion/interfaces";
 import { RequestedItem as RequestedItem1 } from "./components/accordion-item/interfaces";
 import { ActionMessages } from "./components/action/assets/action/t9n";
-import { ActionBarMessages } from "./components/action-bar/assets/action-bar/t9n";
 import { EffectivePlacement, LogicalPlacement, MenuPlacement, OverlayPositioning, ReferenceElement } from "./utils/floating-ui";
+import { ActionBarMessages } from "./components/action-bar/assets/action-bar/t9n";
 import { ActionGroupMessages } from "./components/action-group/assets/action-group/t9n";
 import { ActionPadMessages } from "./components/action-pad/assets/action-pad/t9n";
 import { AlertDuration, Sync } from "./components/alert/interfaces";
@@ -95,8 +95,8 @@ export { Alignment, Appearance, Columns, FlipContext, Kind, Layout, LogicalFlowP
 export { RequestedItem } from "./components/accordion/interfaces";
 export { RequestedItem as RequestedItem1 } from "./components/accordion-item/interfaces";
 export { ActionMessages } from "./components/action/assets/action/t9n";
-export { ActionBarMessages } from "./components/action-bar/assets/action-bar/t9n";
 export { EffectivePlacement, LogicalPlacement, MenuPlacement, OverlayPositioning, ReferenceElement } from "./utils/floating-ui";
+export { ActionBarMessages } from "./components/action-bar/assets/action-bar/t9n";
 export { ActionGroupMessages } from "./components/action-group/assets/action-group/t9n";
 export { ActionPadMessages } from "./components/action-pad/assets/action-pad/t9n";
 export { AlertDuration, Sync } from "./components/alert/interfaces";
@@ -344,6 +344,10 @@ export namespace Components {
           * Disables automatically overflowing `calcite-action`s that won't fit into menus.
          */
         "overflowActionsDisabled": boolean;
+        /**
+          * Determines the type of positioning to use for the overlaid content.  Using `"absolute"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.  `"fixed"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `"fixed"`.
+         */
+        "overlayPositioning": OverlayPositioning;
         /**
           * Arranges the component depending on the element's `dir` property.
          */
@@ -463,6 +467,10 @@ export namespace Components {
           * Made into a prop for testing purposes only
          */
         "messages": ActionPadMessages;
+        /**
+          * Determines the type of positioning to use for the overlaid content.  Using `"absolute"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.  `"fixed"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `"fixed"`.
+         */
+        "overlayPositioning": OverlayPositioning;
         /**
           * Arranges the component depending on the element's `dir` property.
          */
@@ -604,6 +612,10 @@ export namespace Components {
           * When `true`, expands the component and its contents.
          */
         "open": boolean;
+        /**
+          * Determines the type of positioning to use for the overlaid content.  Using `"absolute"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.  `"fixed"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `"fixed"`.
+         */
+        "overlayPositioning": OverlayPositioning;
         /**
           * Sets focus on the component's first tabbable element.
          */
@@ -1724,6 +1736,10 @@ export namespace Components {
           * Made into a prop for testing purposes only
          */
         "messages": FlowItemMessages;
+        /**
+          * Determines the type of positioning to use for the overlaid content.  Using `"absolute"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.  `"fixed"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `"fixed"`.
+         */
+        "overlayPositioning": OverlayPositioning;
         /**
           * Scrolls the component's content to a specified set of coordinates.
           * @example myCalciteFlowItem.scrollContentTo({   left: 0, // Specifies the number of pixels along the X axis to scroll the window or element.   top: 0, // Specifies the number of pixels along the Y axis to scroll the window or element   behavior: "auto" // Specifies whether the scrolling should animate smoothly (smooth), or happen instantly in a single jump (auto, the default value). });
@@ -3433,6 +3449,10 @@ export namespace Components {
           * Made into a prop for testing purposes only
          */
         "messages": PanelMessages;
+        /**
+          * Determines the type of positioning to use for the overlaid content.  Using `"absolute"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.  `"fixed"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `"fixed"`.
+         */
+        "overlayPositioning": OverlayPositioning;
         /**
           * Scrolls the component's content to a specified set of coordinates.
           * @example myCalciteFlowItem.scrollContentTo({   left: 0, // Specifies the number of pixels along the X axis to scroll the window or element.   top: 0, // Specifies the number of pixels along the Y axis to scroll the window or element   behavior: "auto" // Specifies whether the scrolling should animate smoothly (smooth), or happen instantly in a single jump (auto, the default value). });
@@ -7540,6 +7560,10 @@ declare namespace LocalJSX {
           * Disables automatically overflowing `calcite-action`s that won't fit into menus.
          */
         "overflowActionsDisabled"?: boolean;
+        /**
+          * Determines the type of positioning to use for the overlaid content.  Using `"absolute"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.  `"fixed"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `"fixed"`.
+         */
+        "overlayPositioning"?: OverlayPositioning;
         /**
           * Arranges the component depending on the element's `dir` property.
          */
@@ -7647,6 +7671,10 @@ declare namespace LocalJSX {
           * Fires when the `expanded` property is toggled.
          */
         "onCalciteActionPadToggle"?: (event: CalciteActionPadCustomEvent<void>) => void;
+        /**
+          * Determines the type of positioning to use for the overlaid content.  Using `"absolute"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.  `"fixed"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `"fixed"`.
+         */
+        "overlayPositioning"?: OverlayPositioning;
         /**
           * Arranges the component depending on the element's `dir` property.
          */
@@ -7805,6 +7833,10 @@ declare namespace LocalJSX {
           * When `true`, expands the component and its contents.
          */
         "open"?: boolean;
+        /**
+          * Determines the type of positioning to use for the overlaid content.  Using `"absolute"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.  `"fixed"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `"fixed"`.
+         */
+        "overlayPositioning"?: OverlayPositioning;
         /**
           * Displays a status-related indicator icon.
          */
@@ -8848,6 +8880,10 @@ declare namespace LocalJSX {
           * Fires when the collapse button is clicked.
          */
         "onCalciteFlowItemToggle"?: (event: CalciteFlowItemCustomEvent<void>) => void;
+        /**
+          * Determines the type of positioning to use for the overlaid content.  Using `"absolute"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.  `"fixed"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `"fixed"`.
+         */
+        "overlayPositioning"?: OverlayPositioning;
     }
     interface CalciteGraph {
         /**
@@ -10487,6 +10523,10 @@ declare namespace LocalJSX {
           * Fires when the collapse button is clicked.
          */
         "onCalcitePanelToggle"?: (event: CalcitePanelCustomEvent<void>) => void;
+        /**
+          * Determines the type of positioning to use for the overlaid content.  Using `"absolute"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.  `"fixed"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `"fixed"`.
+         */
+        "overlayPositioning"?: OverlayPositioning;
     }
     /**
      * @deprecated Use the `list` component instead.

package/dist/types/tests/commonTests.d.ts

@@ -281,6 +281,20 @@ export declare function floatingUIOwner(componentTagOrHTML: TagOrHTML, togglePro
      */
     shadowSelector?: string;
 }): void;
+/**
+ * Helper to test if a component has a floating-UI-owning component wired up.
+ *
+ * Note: this performs a shallow test and assumes the underlying component has floating-ui properly configured.
+ *
+ * @example
+ * describe("delegates to floating-ui-owner component", () => {
+ *   delegatesToFloatingUiOwningComponent("calcite-pad", "calcite-action-group");
+ * });
+ *
+ * @param componentTagOrHTML
+ * @param floatingUiOwnerComponentTag
+ */
+export declare function delegatesToFloatingUiOwningComponent(componentTagOrHTML: TagOrHTML, floatingUiOwnerComponentTag: ComponentTag): Promise<void>;
 /**
  * Helper to test t9n component setup.
  *

package/hydrate/index.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.1-next.0
+ * v2.3.0-next.0
  */
 'use strict';
 
@@ -11446,6 +11446,7 @@ class ActionBar {
         this.expanded = false;
         this.layout = "vertical";
         this.overflowActionsDisabled = false;
+        this.overlayPositioning = "absolute";
         this.position = undefined;
         this.scale = undefined;
         this.messages = undefined;
@@ -11547,11 +11548,11 @@ class ActionBar {
     //
     // --------------------------------------------------------------------------
     renderBottomActionGroup() {
-        const { expanded, expandDisabled, el, position, toggleExpand, scale, layout, messages, actionsEndGroupLabel, } = this;
+        const { expanded, expandDisabled, el, position, toggleExpand, scale, layout, messages, actionsEndGroupLabel, overlayPositioning, } = this;
         const expandToggleNode = !expandDisabled ? (hAsync(ExpandToggle, { collapseText: messages.collapse, el: el, expandText: messages.expand, expanded: expanded, position: position, scale: scale, toggle: toggleExpand, tooltip: this.expandTooltip,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.setExpandToggleRef })) : null;
-        return (hAsync("calcite-action-group", { class: CSS$1h.actionGroupEnd, hidden: this.expandDisabled && !(this.hasActionsEnd || this.hasBottomActions), label: actionsEndGroupLabel, layout: layout, scale: scale }, hAsync("slot", { name: SLOTS$v.actionsEnd, onSlotchange: this.handleActionsEndSlotChange }), hAsync("slot", { name: SLOTS$v.bottomActions, onSlotchange: this.handleBottomActionsSlotChange }), hAsync("slot", { name: SLOTS$v.expandTooltip, onSlotchange: this.handleTooltipSlotChange }), expandToggleNode));
+        return (hAsync("calcite-action-group", { class: CSS$1h.actionGroupEnd, hidden: this.expandDisabled && !(this.hasActionsEnd || this.hasBottomActions), label: actionsEndGroupLabel, layout: layout, overlayPositioning: overlayPositioning, scale: scale }, hAsync("slot", { name: SLOTS$v.actionsEnd, onSlotchange: this.handleActionsEndSlotChange }), hAsync("slot", { name: SLOTS$v.bottomActions, onSlotchange: this.handleBottomActionsSlotChange }), hAsync("slot", { name: SLOTS$v.expandTooltip, onSlotchange: this.handleTooltipSlotChange }), expandToggleNode));
     }
     render() {
         return (hAsync(Host, { onCalciteActionMenuOpen: this.actionMenuOpenHandler }, hAsync("slot", { onSlotchange: this.handleDefaultSlotChange }), this.renderBottomActionGroup()));
@@ -11576,6 +11577,7 @@ class ActionBar {
             "expanded": [1540],
             "layout": [513],
             "overflowActionsDisabled": [516, "overflow-actions-disabled"],
+            "overlayPositioning": [513, "overlay-positioning"],
             "position": [513],
             "scale": [513],
             "messages": [1040],
@@ -11590,7 +11592,7 @@ class ActionBar {
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
-        "$attrsToReflect$": [["expandDisabled", "expand-disabled"], ["expanded", "expanded"], ["layout", "layout"], ["overflowActionsDisabled", "overflow-actions-disabled"], ["position", "position"], ["scale", "scale"]]
+        "$attrsToReflect$": [["expandDisabled", "expand-disabled"], ["expanded", "expanded"], ["layout", "layout"], ["overflowActionsDisabled", "overflow-actions-disabled"], ["overlayPositioning", "overlay-positioning"], ["position", "position"], ["scale", "scale"]]
     }; }
 }
 
@@ -11766,7 +11768,6 @@ class ActionMenu {
             }
             menuButtonEl.addEventListener("pointerdown", this.menuButtonClick);
             menuButtonEl.addEventListener("keydown", this.menuButtonKeyDown);
-            menuButtonEl.addEventListener("blur", this.menuButtonBlur);
         };
         this.disconnectMenuButtonEl = () => {
             const { menuButtonEl } = this;
@@ -11775,7 +11776,6 @@ class ActionMenu {
             }
             menuButtonEl.removeEventListener("pointerdown", this.menuButtonClick);
             menuButtonEl.removeEventListener("keydown", this.menuButtonKeyDown);
-            menuButtonEl.removeEventListener("blur", this.menuButtonBlur);
         };
         this.setMenuButtonEl = (event) => {
             const actions = event.target
@@ -11851,9 +11851,6 @@ class ActionMenu {
             }, []);
             this.actionElements = actions.filter((action) => !action.disabled && !action.hidden);
         };
-        this.menuButtonBlur = () => {
-            this.open = false;
-        };
         this.menuButtonKeyDown = (event) => {
             const { key } = event;
             const { actionElements, activeMenuItemIndex, open } = this;
@@ -11869,6 +11866,10 @@ class ActionMenu {
                 const action = actionElements[activeMenuItemIndex];
                 action ? action.click() : this.toggleOpen(false);
             }
+            if (key === "Tab") {
+                this.open = false;
+                return;
+            }
             if (key === "Escape") {
                 this.toggleOpen(false);
                 event.preventDefault();
@@ -12077,6 +12078,7 @@ class ActionPad {
         this.scale = undefined;
         this.messages = undefined;
         this.messageOverrides = undefined;
+        this.overlayPositioning = "absolute";
         this.expandTooltip = undefined;
         this.effectiveLocale = "";
         this.defaultMessages = undefined;
@@ -12141,11 +12143,11 @@ class ActionPad {
     //
     // --------------------------------------------------------------------------
     renderBottomActionGroup() {
-        const { expanded, expandDisabled, messages, el, position, toggleExpand, scale, layout, actionsEndGroupLabel, } = this;
+        const { expanded, expandDisabled, messages, el, position, toggleExpand, scale, layout, actionsEndGroupLabel, overlayPositioning, } = this;
         const expandToggleNode = !expandDisabled ? (hAsync(ExpandToggle, { collapseText: messages.collapse, el: el, expandText: messages.expand, expanded: expanded, position: position, scale: scale, toggle: toggleExpand, tooltip: this.expandTooltip,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.setExpandToggleRef })) : null;
-        return expandToggleNode ? (hAsync("calcite-action-group", { class: CSS$1g.actionGroupEnd, label: actionsEndGroupLabel, layout: layout, scale: scale }, hAsync("slot", { name: SLOTS$u.expandTooltip, onSlotchange: this.handleTooltipSlotChange }), expandToggleNode)) : null;
+        return expandToggleNode ? (hAsync("calcite-action-group", { class: CSS$1g.actionGroupEnd, label: actionsEndGroupLabel, layout: layout, overlayPositioning: overlayPositioning, scale: scale }, hAsync("slot", { name: SLOTS$u.expandTooltip, onSlotchange: this.handleTooltipSlotChange }), expandToggleNode)) : null;
     }
     render() {
         return (hAsync(Host, { onCalciteActionMenuOpen: this.actionMenuOpenHandler }, hAsync("div", { class: CSS$1g.container }, hAsync("slot", { onSlotchange: this.handleDefaultSlotChange }), this.renderBottomActionGroup())));
@@ -12172,6 +12174,7 @@ class ActionPad {
             "scale": [513],
             "messages": [1040],
             "messageOverrides": [1040],
+            "overlayPositioning": [513, "overlay-positioning"],
             "expandTooltip": [32],
             "effectiveLocale": [32],
             "defaultMessages": [32],
@@ -12179,7 +12182,7 @@ class ActionPad {
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
-        "$attrsToReflect$": [["expandDisabled", "expand-disabled"], ["expanded", "expanded"], ["layout", "layout"], ["position", "position"], ["scale", "scale"]]
+        "$attrsToReflect$": [["expandDisabled", "expand-disabled"], ["expanded", "expanded"], ["layout", "layout"], ["position", "position"], ["scale", "scale"], ["overlayPositioning", "overlay-positioning"]]
     }; }
 }
 
@@ -13023,6 +13026,7 @@ class Block {
         this.description = undefined;
         this.messages = undefined;
         this.messageOverrides = undefined;
+        this.overlayPositioning = "absolute";
         this.effectiveLocale = undefined;
         this.defaultMessages = undefined;
     }
@@ -13120,7 +13124,7 @@ class Block {
         const hasControl = !!getSlotted(el, SLOTS$s.control);
         const hasMenuActions = !!getSlotted(el, SLOTS$s.headerMenuActions);
         const collapseIcon = open ? ICONS$h.opened : ICONS$h.closed;
-        const headerNode = (hAsync("div", { class: CSS$1e.headerContainer }, this.dragHandle ? hAsync("calcite-handle", { label: heading }) : null, collapsible ? (hAsync("button", { "aria-controls": IDS$1.content, "aria-describedby": IDS$1.header, "aria-expanded": collapsible ? toAriaBoolean(open) : null, class: CSS$1e.toggle, id: IDS$1.toggle, onClick: this.onHeaderClick, title: toggleLabel }, headerContent, hAsync("calcite-icon", { "aria-hidden": "true", class: CSS$1e.toggleIcon, icon: collapseIcon, scale: "s" }))) : (headerContent), hasControl ? (hAsync("div", { class: CSS$1e.controlContainer }, hAsync("slot", { name: SLOTS$s.control }))) : null, hasMenuActions ? (hAsync("calcite-action-menu", { label: messages.options }, hAsync("slot", { name: SLOTS$s.headerMenuActions }))) : null));
+        const headerNode = (hAsync("div", { class: CSS$1e.headerContainer }, this.dragHandle ? hAsync("calcite-handle", { label: heading }) : null, collapsible ? (hAsync("button", { "aria-controls": IDS$1.content, "aria-describedby": IDS$1.header, "aria-expanded": collapsible ? toAriaBoolean(open) : null, class: CSS$1e.toggle, id: IDS$1.toggle, onClick: this.onHeaderClick, title: toggleLabel }, headerContent, hAsync("calcite-icon", { "aria-hidden": "true", class: CSS$1e.toggleIcon, icon: collapseIcon, scale: "s" }))) : (headerContent), hasControl ? (hAsync("div", { class: CSS$1e.controlContainer }, hAsync("slot", { name: SLOTS$s.control }))) : null, hasMenuActions ? (hAsync("calcite-action-menu", { label: messages.options, overlayPositioning: this.overlayPositioning }, hAsync("slot", { name: SLOTS$s.headerMenuActions }))) : null));
         return (hAsync(Host, null, hAsync(InteractiveContainer, { disabled: this.disabled }, hAsync("article", { "aria-busy": toAriaBoolean(loading), class: {
                 [CSS$1e.container]: true,
             } }, headerNode, hAsync("section", { "aria-labelledby": IDS$1.toggle, class: CSS$1e.content, hidden: !open, id: IDS$1.content,
@@ -13150,13 +13154,14 @@ class Block {
             "description": [1],
             "messages": [1040],
             "messageOverrides": [1040],
+            "overlayPositioning": [513, "overlay-positioning"],
             "effectiveLocale": [32],
             "defaultMessages": [32],
             "setFocus": [64]
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
-        "$attrsToReflect$": [["collapsible", "collapsible"], ["disabled", "disabled"], ["dragHandle", "drag-handle"], ["headingLevel", "heading-level"], ["loading", "loading"], ["open", "open"], ["status", "status"]]
+        "$attrsToReflect$": [["collapsible", "collapsible"], ["disabled", "disabled"], ["dragHandle", "drag-handle"], ["headingLevel", "heading-level"], ["loading", "loading"], ["open", "open"], ["status", "status"], ["overlayPositioning", "overlay-positioning"]]
     }; }
 }
 
@@ -20831,7 +20836,7 @@ function XButton({ disabled, key, label, onClick, ref, scale, }) {
 
 /**
  * Do not edit directly
- * Generated on Thu, 18 Jan 2024 17:03:58 GMT
+ * Generated on Wed, 24 Jan 2024 05:48:26 GMT
  */
 const calciteSize48 = "48px";
 
@@ -24758,6 +24763,7 @@ class FlowItem {
         this.menuOpen = false;
         this.messageOverrides = undefined;
         this.messages = undefined;
+        this.overlayPositioning = "absolute";
         this.showBackButton = false;
         this.defaultMessages = undefined;
         this.effectiveLocale = "";
@@ -24844,8 +24850,8 @@ class FlowItem {
             ref: this.setBackRef })) : null;
     }
     render() {
-        const { collapsed, collapseDirection, collapsible, closable, closed, description, disabled, heading, headingLevel, loading, menuOpen, messages, } = this;
-        return (hAsync(Host, null, hAsync(InteractiveContainer, { disabled: disabled }, hAsync("calcite-panel", { 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,
+        const { collapsed, collapseDirection, collapsible, closable, closed, description, disabled, heading, headingLevel, loading, menuOpen, messages, overlayPositioning, } = this;
+        return (hAsync(Host, null, hAsync(InteractiveContainer, { disabled: disabled }, hAsync("calcite-panel", { 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,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.setContainerRef }, this.renderBackButton(), hAsync("slot", { name: SLOTS$m.actionBar, slot: SLOTS$n.actionBar }), hAsync("slot", { name: SLOTS$m.headerActionsStart, slot: SLOTS$n.headerActionsStart }), hAsync("slot", { name: SLOTS$m.headerActionsEnd, slot: SLOTS$n.headerActionsEnd }), hAsync("slot", { name: SLOTS$m.headerContent, slot: SLOTS$n.headerContent }), hAsync("slot", { name: SLOTS$m.headerMenuActions, slot: SLOTS$n.headerMenuActions }), hAsync("slot", { name: SLOTS$m.fab, slot: SLOTS$n.fab }), hAsync("slot", { name: SLOTS$m.footerActions, slot: SLOTS$n.footerActions }), hAsync("slot", { name: SLOTS$m.footer, slot: SLOTS$n.footer }), hAsync("slot", null)))));
     }
@@ -24874,6 +24880,7 @@ class FlowItem {
             "menuOpen": [516, "menu-open"],
             "messageOverrides": [1040],
             "messages": [1040],
+            "overlayPositioning": [513, "overlay-positioning"],
             "showBackButton": [4, "show-back-button"],
             "defaultMessages": [32],
             "effectiveLocale": [32],
@@ -24882,7 +24889,7 @@ class FlowItem {
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
-        "$attrsToReflect$": [["closable", "closable"], ["closed", "closed"], ["collapsed", "collapsed"], ["collapsible", "collapsible"], ["disabled", "disabled"], ["headingLevel", "heading-level"], ["loading", "loading"], ["menuOpen", "menu-open"]]
+        "$attrsToReflect$": [["closable", "closable"], ["closed", "closed"], ["collapsed", "collapsed"], ["collapsible", "collapsible"], ["disabled", "disabled"], ["headingLevel", "heading-level"], ["loading", "loading"], ["menuOpen", "menu-open"], ["overlayPositioning", "overlay-positioning"]]
     }; }
 }
 
@@ -36842,7 +36849,7 @@ const ICONS$6 = {
 
 /**
  * Do not edit directly
- * Generated on Thu, 18 Jan 2024 17:04:00 GMT
+ * Generated on Wed, 24 Jan 2024 05:48:28 GMT
  */
 const calciteContainerSizeWidthXxs = {"min":"0","max":"320px"}; // Small handheld devices and mini-windows
 const calciteContainerSizeWidthXs = {"min":"321px","max":"476px"}; // Handheld devices
@@ -37285,6 +37292,7 @@ class Panel {
         this.menuOpen = false;
         this.messageOverrides = undefined;
         this.messages = undefined;
+        this.overlayPositioning = "absolute";
         this.hasStartActions = false;
         this.hasEndActions = false;
         this.hasMenuItems = false;
@@ -37392,7 +37400,7 @@ class Panel {
     }
     renderMenu() {
         const { hasMenuItems, messages, menuOpen } = this;
-        return (hAsync("calcite-action-menu", { flipPlacements: ["top", "bottom"], hidden: !hasMenuItems, key: "menu", label: messages.options, open: menuOpen, placement: "bottom-end" }, hAsync("calcite-action", { icon: ICONS$b.menu, slot: SLOTS$w.trigger, text: messages.options }), hAsync("slot", { name: SLOTS$n.headerMenuActions, onSlotchange: this.handleHeaderMenuActionsSlotChange })));
+        return (hAsync("calcite-action-menu", { flipPlacements: ["top", "bottom"], hidden: !hasMenuItems, key: "menu", label: messages.options, open: menuOpen, overlayPositioning: this.overlayPositioning, placement: "bottom-end" }, hAsync("calcite-action", { icon: ICONS$b.menu, slot: SLOTS$w.trigger, text: messages.options }), hAsync("slot", { name: SLOTS$n.headerMenuActions, onSlotchange: this.handleHeaderMenuActionsSlotChange })));
     }
     renderHeaderNode() {
         const { hasHeaderContent, hasStartActions, hasEndActions, closable, collapsible, hasMenuItems, hasActionBar, } = this;
@@ -37451,6 +37459,7 @@ class Panel {
             "menuOpen": [516, "menu-open"],
             "messageOverrides": [1040],
             "messages": [1040],
+            "overlayPositioning": [513, "overlay-positioning"],
             "hasStartActions": [32],
             "hasEndActions": [32],
             "hasMenuItems": [32],
@@ -37467,7 +37476,7 @@ class Panel {
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
-        "$attrsToReflect$": [["closed", "closed"], ["disabled", "disabled"], ["closable", "closable"], ["collapsed", "collapsed"], ["collapsible", "collapsible"], ["headingLevel", "heading-level"], ["loading", "loading"], ["menuOpen", "menu-open"]]
+        "$attrsToReflect$": [["closed", "closed"], ["disabled", "disabled"], ["closable", "closable"], ["collapsed", "collapsed"], ["collapsible", "collapsible"], ["headingLevel", "heading-level"], ["loading", "loading"], ["menuOpen", "menu-open"], ["overlayPositioning", "overlay-positioning"]]
     }; }
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@esri/calcite-components",
-  "version": "2.2.1-next.0",
+  "version": "2.3.0-next.0",
   "homepage": "https://developers.arcgis.com/calcite-design-system/",
   "description": "Web Components for Esri's Calcite Design System.",
   "main": "dist/index.cjs.js",
@@ -89,5 +89,5 @@
   "volta": {
     "extends": "../../package.json"
   },
-  "gitHead": "0b3b66d2613200aab39a7963f225f14c4d6914ca"
+  "gitHead": "ddda76440689f2e28d46219c1d726f89df06e7a3"
 }

package/dist/calcite/p-00febd56.js

@@ -1,7 +0,0 @@
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.1-next.0
- */
-import{d as e}from"./p-3d0ccd86.js";import"./p-e803f236.js";import"./p-a97dee2b.js";import"./p-8be82fa6.js";import"./p-5ce7286a.js";import"./p-7224093d.js";import"./p-07a9bf34.js";import"./p-0e072457.js";import"./p-70ddf3ab.js";import"./p-8f9d21e8.js";import"./p-64b093b4.js";import"./p-cf0e64a9.js";import"./p-79d1143b.js";import"./p-e2b818e3.js";import"./p-1579d120.js";import"./p-4bb5a64f.js";import"./p-2a8574d7.js";import"./p-9b87ab49.js";import"./p-fa429bc3.js";var s={name:"ca",weekdays:"Diumenge_Dilluns_Dimarts_Dimecres_Dijous_Divendres_Dissabte".split("_"),weekdaysShort:"Dg._Dl._Dt._Dc._Dj._Dv._Ds.".split("_"),weekdaysMin:"Dg_Dl_Dt_Dc_Dj_Dv_Ds".split("_"),months:"Gener_Febrer_Març_Abril_Maig_Juny_Juliol_Agost_Setembre_Octubre_Novembre_Desembre".split("_"),monthsShort:"Gen._Febr._Març_Abr._Maig_Juny_Jul._Ag._Set._Oct._Nov._Des.".split("_"),weekStart:1,formats:{LT:"H:mm",LTS:"H:mm:ss",L:"DD/MM/YYYY",LL:"D MMMM [de] YYYY",LLL:"D MMMM [de] YYYY [a les] H:mm",LLLL:"dddd D MMMM [de] YYYY [a les] H:mm",ll:"D MMM YYYY",lll:"D MMM YYYY, H:mm",llll:"ddd D MMM YYYY, H:mm"},relativeTime:{future:"d'aquí %s",past:"fa %s",s:"uns segons",m:"un minut",mm:"%d minuts",h:"una hora",hh:"%d hores",d:"un dia",dd:"%d dies",M:"un mes",MM:"%d mesos",y:"un any",yy:"%d anys"},ordinal:function e(s){var r;if(s===1||s===3)r="r";else if(s===2)r="n";else if(s===4)r="t";else r="è";return""+s+r}};e.locale(s,null,true);export default s;
-//# sourceMappingURL=p-00febd56.js.map

package/dist/calcite/p-0490db9b.entry.js

@@ -1,7 +0,0 @@
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.1-next.0
- */
-import{r as e,c as t,h as i,H as s,g as l}from"./p-e803f236.js";import{l as a}from"./p-8be82fa6.js";import{i as n}from"./p-70ddf3ab.js";import{c as o,u as c,d as r,I as h}from"./p-07a9bf34.js";import{g as d}from"./p-64b093b4.js";import"./p-5ce7286a.js";import"./p-7224093d.js";import"./p-0e072457.js";const b={lastVisibleRow:"last-visible-row"};const u=":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{--calcite-internal-table-row-background:var(--calcite-table-row-background, var(--calcite-color-foreground-1));--calcite-internal-table-row-border-color:var(--calcite-table-row-border-color, transparent);display:contents}:host([hidden]){display:none}[hidden]{display:none}:host([disabled]) tr{pointer-events:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}tr{border-block-end:1px solid var(--calcite-internal-table-row-border-color);background-color:var(--calcite-internal-table-row-background)}tr.last-visible-row{border-block-end:0}";const f=class{constructor(i){e(this,i);this.calciteTableRowSelect=t(this,"calciteTableRowSelect",6);this.calciteInternalTableRowFocusRequest=t(this,"calciteInternalTableRowFocusRequest",6);this.rowCells=[];this.emitTableRowFocusRequest=(e,t,i,s)=>{this.calciteInternalTableRowFocusRequest.emit({cellPosition:e,rowPosition:t,destination:i,lastCell:s})};this.updateCells=()=>{const e=this.tableRowSlotEl?.assignedElements({flatten:true})?.filter((e=>e.matches("calcite-table-cell")||e.matches("calcite-table-header")));const t=Array.from(this.tableRowEl?.querySelectorAll("calcite-table-header, calcite-table-cell"))?.filter((e=>e.numberCell||e.selectionCell));const i=t?t.concat(e):e;if(i.length>0){i?.forEach(((e,t)=>{e.positionInRow=t+1;e.parentRowType=this.rowType;e.parentRowIsSelected=this.selected;e.scale=this.scale;e.lastCell=t===i.length-1;if(e.nodeName==="CALCITE-TABLE-CELL"){e.readCellContentsToAT=this.readCellContentsToAT;e.disabled=this.disabled}}))}this.rowCells=i||[];this.cellCount=i?.length};this.handleSelectionOfRow=()=>{this.calciteTableRowSelect.emit()};this.handleKeyboardSelection=e=>{if(n(e.key)){if(e.key===" "){e.preventDefault()}this.handleSelectionOfRow()}};this.disabled=false;this.selected=false;this.cellCount=undefined;this.lastVisibleRow=undefined;this.rowType=undefined;this.numbered=false;this.positionSection=undefined;this.positionSectionLocalized=undefined;this.positionAll=undefined;this.readCellContentsToAT=undefined;this.scale=undefined;this.selectionMode="none";this.selectedRowCount=undefined;this.selectedRowCountLocalized=undefined;this.bodyRowCount=undefined;this.effectiveLocale=""}handleCellChanges(){if(this.tableRowEl&&this.rowCells.length>0){this.updateCells()}}handleDelayedCellChanges(){if(this.tableRowEl&&this.rowCells.length>0){requestAnimationFrame((()=>this.updateCells()))}}componentDidLoad(){if(this.tableRowEl&&this.rowCells.length>0){this.updateCells()}}connectedCallback(){o(this)}componentDidRender(){c(this)}disconnectedCallback(){r(this)}calciteInternalTableRowFocusChangeHandler(e){if(e.target.contains(this.el)){const t=e.detail.cellPosition;const i=e.detail.rowPosition;const s=e.detail.destination;const l=e.detail.lastCell;if(i===this.positionAll){if(this.disabled){const e=s==="last"?"previous":s==="first"?"next":s;this.emitTableRowFocusRequest(t,this.positionAll,e);return}const e=l?this.rowCells[this.rowCells.length-1]:this.rowCells?.find(((e,i)=>i+1===t));if(e){e.setFocus()}}}}keyDownHandler(e){const t=e.target;const i=e.key;const s=e.ctrlKey;const l=this.rowCells;if(t.matches("calcite-table-cell")||t.matches("calcite-table-header")){switch(i){case"ArrowUp":this.emitTableRowFocusRequest(t.positionInRow,this.positionAll,"previous");e.preventDefault();break;case"ArrowDown":this.emitTableRowFocusRequest(t.positionInRow,this.positionAll,"next");e.preventDefault();break;case"PageUp":this.emitTableRowFocusRequest(t.positionInRow,this.positionAll,"first");e.preventDefault();break;case"PageDown":this.emitTableRowFocusRequest(t.positionInRow,this.positionAll,"last");e.preventDefault();break;case"ArrowLeft":a(l,t,"previous",false);e.preventDefault();break;case"ArrowRight":a(l,t,"next",false);e.preventDefault();break;case"Home":if(s){this.emitTableRowFocusRequest(1,this.positionAll,"first");e.preventDefault()}else{a(l,t,"first",false);e.preventDefault()}break;case"End":if(s){this.emitTableRowFocusRequest(this.rowCells?.length,this.positionAll,"last",true);e.preventDefault()}else{a(l,t,"last",false);e.preventDefault()}break}}}renderSelectionIcon(){const e=this.selectionMode==="multiple"&&this.selected?"check-square-f":this.selectionMode==="multiple"?"square":this.selected?"circle-f":"circle";return i("calcite-icon",{icon:e,scale:d(this.scale)})}renderSelectableCell(){return this.rowType==="head"?i("calcite-table-header",{alignment:"center",bodyRowCount:this.bodyRowCount,key:"selection-head",onClick:this.selectionMode==="multiple"&&this.handleSelectionOfRow,onKeyDown:this.selectionMode==="multiple"&&this.handleKeyboardSelection,selectedRowCount:this.selectedRowCount,selectedRowCountLocalized:this.selectedRowCountLocalized,selectionCell:true,selectionMode:this.selectionMode}):this.rowType==="body"?i("calcite-table-cell",{alignment:"center",key:"selection-body",onClick:this.handleSelectionOfRow,onKeyDown:this.handleKeyboardSelection,parentRowIsSelected:this.selected,parentRowPositionLocalized:this.positionSectionLocalized,selectionCell:true},this.renderSelectionIcon()):i("calcite-table-cell",{alignment:"center",key:"selection-foot",selectionCell:true})}renderNumberedCell(){return this.rowType==="head"?i("calcite-table-header",{alignment:"center",key:"numbered-head",numberCell:true}):this.rowType==="body"?i("calcite-table-cell",{alignment:"center",key:"numbered-body",numberCell:true},this.positionSectionLocalized):i("calcite-table-cell",{alignment:"center",key:"numbered-foot",numberCell:true})}render(){return i(s,null,i(h,{disabled:this.disabled},i("tr",{"aria-disabled":this.disabled,"aria-rowindex":this.positionAll+1,"aria-selected":this.selected,class:{[b.lastVisibleRow]:this.lastVisibleRow},onKeyDown:e=>this.keyDownHandler(e),ref:e=>this.tableRowEl=e},this.numbered&&this.renderNumberedCell(),this.selectionMode!=="none"&&this.renderSelectableCell(),i("slot",{onSlotchange:this.updateCells,ref:e=>this.tableRowSlotEl=e}))))}get el(){return l(this)}static get watchers(){return{bodyRowCount:["handleCellChanges"],scale:["handleCellChanges"],selected:["handleCellChanges"],selectedRowCount:["handleCellChanges"],numbered:["handleDelayedCellChanges"],selectionMode:["handleDelayedCellChanges"]}}};f.style=u;export{f as calcite_table_row};
-//# sourceMappingURL=p-0490db9b.entry.js.map

package/dist/calcite/p-057e8bd5.js

@@ -1,7 +0,0 @@
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.1-next.0
- */
-var a;(function(a){a["brand"]="lightbulb";a["danger"]="exclamationMarkTriangle";a["info"]="information";a["success"]="checkCircle";a["warning"]="exclamationMarkTriangle"})(a||(a={}));export{a as K};
-//# sourceMappingURL=p-057e8bd5.js.map

package/dist/calcite/p-076b84fc.js

@@ -1,7 +0,0 @@
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.1-next.0
- */
-import{d as e}from"./p-3d0ccd86.js";import"./p-e803f236.js";import"./p-a97dee2b.js";import"./p-8be82fa6.js";import"./p-5ce7286a.js";import"./p-7224093d.js";import"./p-07a9bf34.js";import"./p-0e072457.js";import"./p-70ddf3ab.js";import"./p-8f9d21e8.js";import"./p-64b093b4.js";import"./p-cf0e64a9.js";import"./p-79d1143b.js";import"./p-e2b818e3.js";import"./p-1579d120.js";import"./p-4bb5a64f.js";import"./p-2a8574d7.js";import"./p-9b87ab49.js";import"./p-fa429bc3.js";var r={name:"fr",weekdays:"dimanche_lundi_mardi_mercredi_jeudi_vendredi_samedi".split("_"),weekdaysShort:"dim._lun._mar._mer._jeu._ven._sam.".split("_"),weekdaysMin:"di_lu_ma_me_je_ve_sa".split("_"),months:"janvier_février_mars_avril_mai_juin_juillet_août_septembre_octobre_novembre_décembre".split("_"),monthsShort:"janv._févr._mars_avr._mai_juin_juil._août_sept._oct._nov._déc.".split("_"),weekStart:1,yearStart:4,formats:{LT:"HH:mm",LTS:"HH:mm:ss",L:"DD/MM/YYYY",LL:"D MMMM YYYY",LLL:"D MMMM YYYY HH:mm",LLLL:"dddd D MMMM YYYY HH:mm"},relativeTime:{future:"dans %s",past:"il y a %s",s:"quelques secondes",m:"une minute",mm:"%d minutes",h:"une heure",hh:"%d heures",d:"un jour",dd:"%d jours",M:"un mois",MM:"%d mois",y:"un an",yy:"%d ans"},ordinal:function e(r){var m=r===1?"er":"";return""+r+m}};e.locale(r,null,true);export default r;
-//# sourceMappingURL=p-076b84fc.js.map

package/dist/calcite/p-07a9bf34.js

@@ -1,7 +0,0 @@
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.1-next.0
- */
-import{g as n}from"./p-0e072457.js";import{h as t}from"./p-e803f236.js";const i=/firefox/i.test(n());const o=i?new WeakMap:null;function e(){const{disabled:n}=this;if(!n){HTMLElement.prototype.click.call(this)}}function r(n){const t=n.target;if(i&&!o.get(t)){return}const{disabled:e}=t;if(e){n.preventDefault()}}const c=["mousedown","mouseup","click"];function u(n){if(i&&!o.get(n.target)){return}const{disabled:t}=n.target;if(t){n.stopImmediatePropagation();n.preventDefault()}}const s={capture:true};function f(n){if(n.disabled){n.el.setAttribute("aria-disabled","true");if(n.el.contains(document.activeElement)){document.activeElement.blur()}a(n);return}p(n);n.el.removeAttribute("aria-disabled")}function a(n){n.el.click=e;d(i?l(n):n.el)}function d(n){if(!n){return}n.addEventListener("pointerdown",r,s);c.forEach((t=>n.addEventListener(t,u,s)))}function l(n){return o.get(n.el)}function p(n){delete n.el.click;m(i?l(n):n.el)}function m(n){if(!n){return}n.removeEventListener("pointerdown",r,s);c.forEach((t=>n.removeEventListener(t,u,s)))}function b(n){if(!n.disabled||!i){return}const t=n.el.parentElement||n.el;o.set(n.el,t);a(n)}function w(n){if(!i){return}o.delete(n.el);p(n)}const h={container:"interaction-container"};function j({disabled:n},i){return t("div",{class:h.container,inert:n},...i)}export{j as I,b as c,w as d,f as u};
-//# sourceMappingURL=p-07a9bf34.js.map

package/dist/calcite/p-07b32af7.entry.js

@@ -1,7 +0,0 @@
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.1-next.0
- */
-import{r as i,c as e,h as t,H as n,g as a}from"./p-e803f236.js";import{w as s,g as o,f as c}from"./p-8be82fa6.js";import{d as l,a as r,c as h,u as d}from"./p-1579d120.js";import{s as p,a as m,c as x}from"./p-cf0e64a9.js";import{c as b}from"./p-e2b818e3.js";import{o as v}from"./p-9b87ab49.js";import{C as g}from"./p-7224093d.js";import"./p-5ce7286a.js";const f={scrim:"scrim",container:"container",containerOpen:"container--open",content:"content",containerSlottedInShell:"container--slotted-in-shell"};const u=":host{position:absolute;inset:0px;z-index:var(--calcite-z-index-overlay);display:flex;visibility:hidden !important;--calcite-sheet-scrim-background-internal:rgba(0, 0, 0, 0.85);--calcite-scrim-shadow-block-start-internal:0 4px 8px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.04);--calcite-scrim-shadow-block-end-internal:0 -4px 8px -1px rgba(0, 0, 0, 0.08), 0 -2px 4px -1px rgba(0, 0, 0, 0.04);--calcite-scrim-shadow-inline-start-internal:4px 0 8px -1px rgba(0, 0, 0, 0.08), 2px 0 4px -1px rgba(0, 0, 0, 0.04);--calcite-scrim-shadow-inline-end-internal:-4px 0 8px -1px rgba(0, 0, 0, 0.08), -2px 0 4px -1px rgba(0, 0, 0, 0.04)}.calcite--rtl{--calcite-scrim-shadow-inline-start-internal:-4px 0 8px -1px rgba(0, 0, 0, 0.08), -2px 0 4px -1px rgba(0, 0, 0, 0.04);--calcite-scrim-shadow-inline-end-internal:4px 0 8px -1px rgba(0, 0, 0, 0.08), 2px 0 4px -1px rgba(0, 0, 0, 0.04)}.container{visibility:hidden;position:fixed;z-index:var(--calcite-z-index-overlay);display:flex;overflow-y:hidden;color:var(--calcite-color-text-2);opacity:0;transition:visibility 0ms linear var(--calcite-internal-animation-timing-medium), opacity var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88)}:host([position=inline-start]) .container{justify-content:flex-start;inset-block:0;inset-inline:0 auto;--calcite-sheet-hidden-position-internal:translate3d(-1rem, 0, 0)}:host([position=inline-end]) .container{justify-content:flex-end;inset-block:0;inset-inline:auto 0;--calcite-sheet-hidden-position-internal:translate3d(1rem, 0, 0)}:host([position=block-start]) .container{align-items:flex-start;inset-block:0 auto;inset-inline:0;--calcite-sheet-hidden-position-internal:translate3d(0, -1rem, 0)}:host([position=block-end]) .container{align-items:flex-end;inset-block:auto 0;inset-inline:0;--calcite-sheet-hidden-position-internal:translate3d(0, 1rem, 0)}:host([display-mode=float]) .content{--tw-shadow:0 2px 12px -4px rgba(0, 0, 0, 0.2), 0 2px 4px -2px rgba(0, 0, 0, 0.16);--tw-shadow-colored:0 2px 12px -4px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host([display-mode=overlay][position=inline-start]) .container{box-shadow:var(--calcite-scrim-shadow-inline-start-internal)}:host([display-mode=overlay][position=inline-end]) .container{box-shadow:var(--calcite-scrim-shadow-inline-end-internal)}:host([display-mode=overlay][position=block-start]) .container{box-shadow:var(--calcite-scrim-shadow-block-start-internal)}:host([display-mode=overlay][position=block-end]) .container{box-shadow:var(--calcite-scrim-shadow-block-end-internal)}:host([position^=inline]) .container,:host([position^=inline]) .content{inline-size:var(--calcite-sheet-width-internal);max-inline-size:var(--calcite-sheet-max-width-internal);min-inline-size:var(--calcite-sheet-min-width-internal)}:host([position^=block]) .container,:host([position^=block]) .content{block-size:var(--calcite-sheet-height-internal);max-block-size:var(--calcite-sheet-max-height-internal);min-block-size:var(--calcite-sheet-min-height-internal)}:host([display-mode=float][position^=inline]) .container{block-size:calc(100% - 1.5rem);max-block-size:calc(100% - 1.5rem);min-block-size:calc(100% - 1.5rem)}:host([display-mode=float][position^=block]) .container{inline-size:calc(100% - 1.5rem);max-inline-size:calc(100% - 1.5rem);min-inline-size:calc(100% - 1.5rem)}:host([position^=inline][width-scale=s]){--calcite-sheet-width-internal:var(--calcite-sheet-width, 15vw);--calcite-sheet-max-width-internal:var(--calcite-sheet-max-width, 360px);--calcite-sheet-min-width-internal:var(--calcite-sheet-min-width, 260px)}:host([position^=inline][width-scale=m]){--calcite-sheet-width-internal:var(--calcite-sheet-width, 25vw);--calcite-sheet-max-width-internal:var(--calcite-sheet-max-width, 420px);--calcite-sheet-min-width-internal:var(--calcite-sheet-min-width, 300px)}:host([position^=inline][width-scale=l]){--calcite-sheet-width-internal:var(--calcite-sheet-width, 45vw);--calcite-sheet-max-width-internal:var(--calcite-sheet-max-width, 680px);--calcite-sheet-min-width-internal:var(--calcite-sheet-min-width, 340px)}:host([position^=block][height-scale=s]){--calcite-sheet-min-height-internal:var(--calcite-sheet-min-height, 160px);--calcite-sheet-height-internal:var(--calcite-sheet-height, 30vh);--calcite-sheet-max-height-internal:var(--calcite-sheet-max-height, 30vh)}:host([position^=block][height-scale=m]){--calcite-sheet-min-height-internal:var(--calcite-sheet-min-height, 200px);--calcite-sheet-height-internal:var(--calcite-sheet-height, 45vh);--calcite-sheet-max-height-internal:var(--calcite-sheet-max-height, 50vh)}:host([position^=block][height-scale=l]){--calcite-sheet-min-height-internal:var(--calcite-sheet-min-height, 240px);--calcite-sheet-height-internal:var(--calcite-sheet-height, 60vh);--calcite-sheet-max-height-internal:var(--calcite-sheet-max-height, 70vh)}.scrim{--calcite-scrim-background:var(--calcite-sheet-scrim-background, var(--calcite-sheet-scrim-background-internal));position:fixed;inset:0px;display:flex;overflow-y:hidden}:host([opened]){visibility:visible !important}.content{position:relative;z-index:var(--calcite-z-index-modal);box-sizing:border-box;display:block;max-block-size:100%;max-inline-size:100%;overflow-y:hidden;padding:0px;background-color:var(--calcite-color-foreground-1);max-block-size:100%;visibility:hidden;transition:transform var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88), visibility 0ms linear var(--calcite-internal-animation-timing-medium), opacity var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88);transform:var(--calcite-sheet-hidden-position-internal)}.container--open .content{transform:translate3d(0, 0, 0)}:host([display-mode=float]) .content,:host([display-mode=float]) .container{border-radius:0.25rem}:host([display-mode=float]) .container{padding:0.75rem}.container--open{visibility:visible;opacity:1;transition-delay:0ms}.container--open .content{pointer-events:auto;visibility:visible;opacity:1;transition:transform var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88), visibility 0ms linear, opacity var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88), max-inline-size var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88), max-block-size var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88);transition-delay:0ms}:host([position=inline-start]) .content,:host([position=inline-end]) .content{block-size:100%}:host([position=block-start]) .content,:host([position=block-end]) .content{inline-size:100%}:host([position]) .container--slotted-in-shell{pointer-events:auto;position:absolute;inline-size:100%;max-inline-size:100%;min-inline-size:100%;block-size:100%;max-block-size:100%;min-block-size:100%}:host([position]) .container--slotted-in-shell calcite-scrim{position:absolute}:host([hidden]){display:none}[hidden]{display:none}";const w=class{constructor(t){i(this,t);this.calciteSheetBeforeClose=e(this,"calciteSheetBeforeClose",6);this.calciteSheetClose=e(this,"calciteSheetClose",6);this.calciteSheetBeforeOpen=e(this,"calciteSheetBeforeOpen",6);this.calciteSheetOpen=e(this,"calciteSheetOpen",6);this.openTransitionProp="opacity";this.ignoreOpenChange=false;this.mutationObserver=b("mutation",(()=>this.handleMutationObserver()));this.setTransitionEl=i=>{this.transitionEl=i;this.contentId=s(i)};this.openEnd=()=>{this.setFocus();this.el.removeEventListener("calciteSheetOpen",this.openEnd)};this.handleOutsideClose=()=>{if(this.outsideCloseDisabled){return}this.open=false};this.closeSheet=async()=>{if(this.beforeClose){try{await this.beforeClose(this.el)}catch(i){requestAnimationFrame((()=>{this.ignoreOpenChange=true;this.open=true;this.ignoreOpenChange=false}));return}}this.opened=false;this.removeOverflowHiddenClass()};this.beforeClose=undefined;this.displayMode="overlay";this.escapeDisabled=false;this.heightScale="m";this.focusTrapDisabled=false;this.label=undefined;this.open=false;this.opened=false;this.outsideCloseDisabled=false;this.position="inline-start";this.slottedInShell=undefined;this.widthScale="m"}handleFocusTrapDisabled(i){if(!this.open){return}i?l(this):r(this)}toggleSheet(i){if(this.ignoreOpenChange){return}if(i){this.openSheet()}else{this.closeSheet()}}handleOpenedChange(){v(this)}async componentWillLoad(){p(this);if(this.open){requestAnimationFrame((()=>this.openSheet()))}}componentDidLoad(){m(this)}connectedCallback(){this.mutationObserver?.observe(this.el,{childList:true,subtree:true});h(this)}disconnectedCallback(){this.removeOverflowHiddenClass();this.mutationObserver?.disconnect();l(this);this.slottedInShell=false}render(){const i=o(this.el);return t(n,{"aria-describedby":this.contentId,"aria-label":this.label,"aria-modal":"true",role:"dialog"},t("div",{class:{[f.container]:true,[f.containerOpen]:this.opened,[f.containerSlottedInShell]:this.slottedInShell,[g.rtl]:i==="rtl"}},t("calcite-scrim",{class:f.scrim,onClick:this.handleOutsideClose}),t("div",{class:{[f.content]:true},ref:this.setTransitionEl},t("slot",null))))}handleEscape(i){if(this.open&&!this.escapeDisabled&&i.key==="Escape"&&!i.defaultPrevented){this.open=false;i.preventDefault()}}async setFocus(){await x(this);c(this.el)}async updateFocusTrapElements(){d(this)}onBeforeOpen(){this.calciteSheetBeforeOpen.emit()}onOpen(){this.calciteSheetOpen.emit();r(this)}onBeforeClose(){this.calciteSheetBeforeClose.emit()}onClose(){this.calciteSheetClose.emit();l(this)}openSheet(){this.el.addEventListener("calciteSheetOpen",this.openEnd);this.opened=true;if(!this.slottedInShell){this.initialOverflowCSS=document.documentElement.style.overflow;document.documentElement.style.setProperty("overflow","hidden")}}removeOverflowHiddenClass(){document.documentElement.style.setProperty("overflow",this.initialOverflowCSS)}handleMutationObserver(){this.updateFocusTrapElements()}get el(){return a(this)}static get watchers(){return{focusTrapDisabled:["handleFocusTrapDisabled"],open:["toggleSheet"],opened:["handleOpenedChange"]}}};w.style=u;export{w as calcite_sheet};
-//# sourceMappingURL=p-07b32af7.entry.js.map