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

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.1
+ * v2.3.0-next.1
  */
 '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"]]
     }; }
 }
 
@@ -12076,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;
@@ -12140,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())));
@@ -12171,6 +12174,7 @@ class ActionPad {
             "scale": [513],
             "messages": [1040],
             "messageOverrides": [1040],
+            "overlayPositioning": [513, "overlay-positioning"],
             "expandTooltip": [32],
             "effectiveLocale": [32],
             "defaultMessages": [32],
@@ -12178,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"]]
     }; }
 }
 
@@ -13022,6 +13026,7 @@ class Block {
         this.description = undefined;
         this.messages = undefined;
         this.messageOverrides = undefined;
+        this.overlayPositioning = "absolute";
         this.effectiveLocale = undefined;
         this.defaultMessages = undefined;
     }
@@ -13119,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,
@@ -13149,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"]]
     }; }
 }
 
@@ -20830,7 +20836,7 @@ function XButton({ disabled, key, label, onClick, ref, scale, }) {
 
 /**
  * Do not edit directly
- * Generated on Fri, 19 Jan 2024 22:30:03 GMT
+ * Generated on Wed, 24 Jan 2024 07:10:48 GMT
  */
 const calciteSize48 = "48px";
 
@@ -24757,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 = "";
@@ -24843,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)))));
     }
@@ -24873,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],
@@ -24881,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"]]
     }; }
 }
 
@@ -36841,7 +36849,7 @@ const ICONS$6 = {
 
 /**
  * Do not edit directly
- * Generated on Fri, 19 Jan 2024 22:30:05 GMT
+ * Generated on Wed, 24 Jan 2024 07:10:49 GMT
  */
 const calciteContainerSizeWidthXxs = {"min":"0","max":"320px"}; // Small handheld devices and mini-windows
 const calciteContainerSizeWidthXs = {"min":"321px","max":"476px"}; // Handheld devices
@@ -37284,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;
@@ -37391,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;
@@ -37450,6 +37459,7 @@ class Panel {
             "menuOpen": [516, "menu-open"],
             "messageOverrides": [1040],
             "messages": [1040],
+            "overlayPositioning": [513, "overlay-positioning"],
             "hasStartActions": [32],
             "hasEndActions": [32],
             "hasMenuItems": [32],
@@ -37466,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"]]
     }; }
 }
 
@@ -42946,7 +42956,7 @@ const CSS$f = {
     content: "content",
 };
 
-const tabCss = "/*!@:host([selected]) section,\n:host([selected]) .container*/[selected].sc-calcite-tab-h section.sc-calcite-tab,[selected].sc-calcite-tab-h .container.sc-calcite-tab{display:block}/*!@:host*/.sc-calcite-tab-h{display:none;block-size:100%;inline-size:100%}/*!@:host([selected])*/[selected].sc-calcite-tab-h{display:block;block-size:100%;inline-size:100%;overflow:auto}/*!@.content*/.content.sc-calcite-tab{box-sizing:border-box}/*!@.scale-s .content*/.scale-s.sc-calcite-tab .content.sc-calcite-tab{padding-block:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@.scale-m .content*/.scale-m.sc-calcite-tab .content.sc-calcite-tab{padding-block:0.5rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@.scale-l .content*/.scale-l.sc-calcite-tab .content.sc-calcite-tab{padding-block:0.625rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@section,\n.container*/section.sc-calcite-tab,.container.sc-calcite-tab{display:none;block-size:100%;inline-size:100%}/*!@:host([hidden])*/[hidden].sc-calcite-tab-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-tab{display:none}";
+const tabCss = "/*!@:host([selected]) section,\n:host([selected]) .container*/[selected].sc-calcite-tab-h section.sc-calcite-tab,[selected].sc-calcite-tab-h .container.sc-calcite-tab{display:block}/*!@:host*/.sc-calcite-tab-h{display:none;block-size:100%;inline-size:100%}/*!@:host([selected])*/[selected].sc-calcite-tab-h{display:block;block-size:100%;inline-size:100%;overflow:auto}/*!@.content*/.content.sc-calcite-tab{box-sizing:border-box;padding-block:var(--calcite-internal-tab-content-block-padding)}/*!@.scale-s*/.scale-s.sc-calcite-tab{--calcite-internal-tab-content-block-padding:var(--calcite-tab-content-block-padding, 0.25rem);font-size:var(--calcite-font-size--2);line-height:1rem}/*!@.scale-m*/.scale-m.sc-calcite-tab{--calcite-internal-tab-content-block-padding:var(--calcite-tab-content-block-padding, 0.5rem);font-size:var(--calcite-font-size--1);line-height:1rem}/*!@.scale-l*/.scale-l.sc-calcite-tab{--calcite-internal-tab-content-block-padding:var(--calcite-tab-content-block-padding, 0.625rem);font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@section,\n.container*/section.sc-calcite-tab,.container.sc-calcite-tab{display:none;block-size:100%;inline-size:100%}/*!@:host([hidden])*/[hidden].sc-calcite-tab-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-tab{display:none}";
 
 /**
  * @slot - A slot for adding custom content.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@esri/calcite-components",
-  "version": "2.2.1-next.1",
+  "version": "2.3.0-next.1",
   "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": "05ac519cb03decec7af6d1a669b36fe28e52e838"
+  "gitHead": "a0384283c1741260f92e7adbc0b4c1c651749078"
 }

package/dist/calcite/p-00ab167b.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.1
- */
-import{r as t,c as e,h as i,H as o,g as a}from"./p-e7b7cbd1.js";import{c as n,d as s}from"./p-060ad977.js";import{e as r,b as l,f as c,w as d}from"./p-3a17e32e.js";import{d as h,a as m,c as p,u as b}from"./p-69ee2941.js";import{s as u,a as f,c as g}from"./p-d3a47eeb.js";import{c as x}from"./p-10fac586.js";import{o as v}from"./p-2c196569.js";import{c as k,d as z}from"./p-310bb5d7.js";import{s as w,c as y,d as C,u as j}from"./p-6f001be5.js";import{g as $,c as M}from"./p-3e580eba.js";import"./p-f3a30d54.js";import"./p-72c5d4c3.js";import"./p-9e945454.js";const O={modal:"modal",title:"title",header:"header",footer:"footer",scrim:"scrim",back:"back",close:"close",secondary:"secondary",primary:"primary",container:"container",containerOpen:"container--open",content:"content",contentNoFooter:"content--no-footer",contentBottom:"content-bottom",contentTop:"content-top",slottedInShell:"slotted-in-shell",openingIdle:"modal--opening-idle",openingActive:"modal--opening-active",closingIdle:"modal--closing-idle",closingActive:"modal--closing-active"};const B={close:"x"};const F={content:"content",contentBottom:"content-bottom",contentTop:"content-top",header:"header",back:"back",secondary:"secondary",primary:"primary"};const D=":host{--calcite-modal-scrim-background:rgba(0, 0, 0, 0.85);position:absolute;inset:0px;z-index:var(--calcite-z-index-overlay);display:flex;opacity:0;visibility:hidden !important;transition:visibility 0ms linear var(--calcite-internal-animation-timing-slow), opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);--calcite-modal-scrim-background-internal:rgba(0, 0, 0, 0.85)}.content-top[hidden],.content-bottom[hidden]{display:none}.container{position:fixed;inset:0px;z-index:var(--calcite-z-index-overlay);display:flex;align-items:center;justify-content:center;overflow-y:hidden;color:var(--calcite-color-text-2);opacity:0;visibility:hidden !important;transition:visibility 0ms linear var(--calcite-internal-animation-timing-slow), opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88)}:host([scale=s]){--calcite-modal-padding-internal:0.75rem;--calcite-modal-padding-large-internal:1rem;--calcite-modal-title-text-internal:var(--calcite-font-size-1);--calcite-modal-content-text-internal:var(--calcite-font-size--1)}:host([scale=m]){--calcite-modal-padding-internal:1rem;--calcite-modal-padding-large-internal:1.25rem;--calcite-modal-title-text-internal:var(--calcite-font-size-2);--calcite-modal-content-text-internal:var(--calcite-font-size-0)}:host([scale=l]){--calcite-modal-padding-internal:1.25rem;--calcite-modal-padding-large-internal:1.5rem;--calcite-modal-title-text-internal:var(--calcite-font-size-3);--calcite-modal-content-text-internal:var(--calcite-font-size-1)}.scrim{--calcite-scrim-background:var(--calcite-modal-scrim-background, var(--calcite-color-transparent-scrim));position:fixed;inset:0px;display:flex;overflow-y:hidden}.modal{pointer-events:none;z-index:var(--calcite-z-index-modal);float:none;margin:1.5rem;box-sizing:border-box;display:flex;inline-size:100%;flex-direction:column;overflow:hidden;border-radius:0.25rem;background-color:var(--calcite-color-foreground-1);opacity:0;--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);-webkit-overflow-scrolling:touch;visibility:hidden;transition:transform var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), visibility 0ms linear var(--calcite-internal-animation-timing-slow), opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);--calcite-modal-hidden-position:translate3d(0, 20px, 0);--calcite-modal-shown-position:translate3d(0, 0, 0)}.modal--opening-idle{transform:var(--calcite-modal-hidden-position)}.modal--opening-active{transform:var(--calcite-modal-shown-position)}.modal--closing-idle{transform:var(--calcite-modal-shown-position)}.modal--closing-active{transform:var(--calcite-modal-hidden-position)}:host([opened]){opacity:1;visibility:visible !important;transition-delay:0ms}.container--open{opacity:1;visibility:visible !important;transition-delay:0ms}.container--open .modal{pointer-events:auto;visibility:visible;opacity:1;transition:transform var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), visibility 0ms linear, opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), max-inline-size var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), max-block-size var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);transition-delay:0ms}.header{z-index:var(--calcite-z-index-header);display:flex;min-inline-size:0px;max-inline-size:100%;border-start-start-radius:0.25rem;border-start-end-radius:0.25rem;border-width:0px;border-block-end-width:1px;border-style:solid;border-color:var(--calcite-color-border-3);background-color:var(--calcite-color-foreground-1);flex:0 0 auto}.close{order:2;margin:0px;cursor:pointer;appearance:none;border-style:none;background-color:transparent;color:var(--calcite-color-text-3);outline-color:transparent;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;padding-block:var(--calcite-modal-padding-internal);padding-inline:var(--calcite-modal-padding-internal);flex:0 0 auto}.close calcite-icon{pointer-events:none;vertical-align:-2px}.close:focus{outline:2px solid var(--calcite-color-brand);outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.close:hover,.close:focus,.close:active{background-color:var(--calcite-color-foreground-2);color:var(--calcite-color-text-1)}.title{order:1;display:flex;min-inline-size:0px;align-items:center;flex:1 1 auto;padding-block:var(--calcite-modal-padding-internal);padding-inline:var(--calcite-modal-padding-large-internal)}slot[name=header]::slotted(*),*::slotted([slot=header]){margin:0px;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-1);font-size:var(--calcite-modal-title-text-internal)}.content{position:relative;box-sizing:border-box;display:block;block-size:100%;overflow:auto;padding:0px;background-color:var(--calcite-modal-content-background, var(--calcite-color-foreground-1));max-block-size:100%;padding:var(--calcite-modal-content-padding, var(--calcite-modal-padding-internal))}.content-top,.content-bottom{z-index:var(--calcite-z-index-header);display:flex;border-width:0px;border-style:solid;border-color:var(--calcite-color-border-3);background-color:var(--calcite-color-foreground-1);flex:0 0 auto;padding:var(--calcite-modal-padding-internal)}.content-top{min-inline-size:0px;max-inline-size:100%;border-block-end-width:1px}.content-bottom{margin-block-start:auto;box-sizing:border-box;inline-size:100%;justify-content:space-between;border-block-start-width:1px}.content-top:not(.header~.content-top){border-start-start-radius:0.25rem;border-start-end-radius:0.25rem}.content-bottom:not(.content-bottom~.footer),.content--no-footer{border-end-end-radius:0.25rem;border-end-start-radius:0.25rem}slot[name=content]::slotted(*),*::slotted([slot=content]){font-size:var(--calcite-modal-context-text-internal)}.footer{z-index:var(--calcite-z-index-header);margin-block-start:auto;box-sizing:border-box;display:flex;inline-size:100%;justify-content:space-between;border-end-end-radius:0.25rem;border-end-start-radius:0.25rem;border-width:0px;border-block-start-width:1px;border-style:solid;border-color:var(--calcite-color-border-3);background-color:var(--calcite-color-foreground-1);flex:0 0 auto;padding-block:var(--calcite-modal-padding-internal);padding-inline:var(--calcite-modal-padding-large-internal)}.footer--hide-back .back,.footer--hide-secondary .secondary{display:none}.back{display:block;margin-inline-end:auto}.secondary{margin-inline:0.25rem;display:block}slot[name=primary]{display:block}:host([width=small]) .modal{inline-size:auto}:host([width-scale=s]) .modal{max-block-size:100%;max-inline-size:100%;inline-size:var(--calcite-modal-width, 32rem);block-size:var(--calcite-modal-height, auto)}@media screen and (max-width: 35rem){:host([width-scale=s]) .modal{margin:0px;block-size:100%;max-block-size:100%;inline-size:100%;max-inline-size:100%}:host([width-scale=s]) .content{flex:1 1 auto;max-block-size:unset}:host([width-scale=s][docked]) .container{align-items:flex-end}}:host([width-scale=m]) .modal{max-block-size:100%;max-inline-size:100%;inline-size:var(--calcite-modal-width, 48rem);block-size:var(--calcite-modal-height, auto)}@media screen and (max-width: 51rem){:host([width-scale=m]) .modal{margin:0px;block-size:100%;max-block-size:100%;inline-size:100%;max-inline-size:100%}:host([width-scale=m]) .content{flex:1 1 auto;max-block-size:unset}:host([width-scale=m][docked]) .container{align-items:flex-end}}:host([width-scale=l]) .modal{max-block-size:100%;max-inline-size:100%;inline-size:var(--calcite-modal-width, 94rem);block-size:var(--calcite-modal-height, auto)}@media screen and (max-width: 97rem){:host([width-scale=l]) .modal{margin:0px;block-size:100%;max-block-size:100%;inline-size:100%;max-inline-size:100%}:host([width-scale=l]) .content{flex:1 1 auto;max-block-size:unset}:host([width-scale=l][docked]) .container{align-items:flex-end}}:host([fullscreen]) .modal{margin:0px;block-size:100%;max-block-size:100%;inline-size:100%;max-inline-size:100%;border-radius:0px;--calcite-modal-hidden-position:translate3D(0, 20px, 0) scale(0.95);--calcite-modal-shown-position:translate3D(0, 0, 0) scale(1)}:host([fullscreen]) .content{max-block-size:100%;flex:1 1 auto}:host([opened][fullscreen]) .header,:host([opened][fullscreen]) .footer,:host([opened][fullscreen]) .content-top,:host([opened][fullscreen]) .content-bottom{border-radius:0}:host([docked]) .modal{block-size:var(--calcite-modal-height, auto)}:host([docked]) .content{block-size:auto;flex:1 1 auto}:host([kind=brand]) .modal{border-color:var(--calcite-color-brand)}:host([kind=danger]) .modal{border-color:var(--calcite-color-status-danger)}:host([kind=info]) .modal{border-color:var(--calcite-color-status-info)}:host([kind=success]) .modal{border-color:var(--calcite-color-status-success)}:host([kind=warning]) .modal{border-color:var(--calcite-color-status-warning)}:host([kind=brand]) .modal,:host([kind=danger]) .modal,:host([kind=info]) .modal,:host([kind=success]) .modal,:host([kind=warning]) .modal{border-width:0px;border-block-start-width:4px;border-style:solid}:host([kind=brand]) .header,:host([kind=brand]) .content-top,:host([kind=danger]) .header,:host([kind=danger]) .content-top,:host([kind=info]) .header,:host([kind=info]) .content-top,:host([kind=success]) .header,:host([kind=success]) .content-top,:host([kind=warning]) .header,:host([kind=warning]) .content-top{border-radius:0.25rem;border-end-end-radius:0px;border-end-start-radius:0px}@media screen and (max-width: 860px){* slot[name=header]::slotted(content-top),* content-top::slotted([slot=header]){font-size:var(--calcite-font-size-1)}.footer,.content-bottom{position:sticky;inset-block-end:0px}}@media screen and (max-width: 480px){.footer,.content-bottom{flex-direction:column}.back,.secondary{margin:0px;margin-block-end:0.25rem}}.container.slotted-in-shell{position:absolute;pointer-events:auto}.container.slotted-in-shell calcite-scrim{position:absolute}:host([hidden]){display:none}[hidden]{display:none}";let T=0;let L="";const S=class{constructor(i){t(this,i);this.calciteModalBeforeClose=e(this,"calciteModalBeforeClose",6);this.calciteModalClose=e(this,"calciteModalClose",6);this.calciteModalBeforeOpen=e(this,"calciteModalBeforeOpen",6);this.calciteModalOpen=e(this,"calciteModalOpen",6);this.ignoreOpenChange=false;this.mutationObserver=x("mutation",(()=>this.handleMutationObserver()));this.cssVarObserver=x("mutation",(()=>{this.updateSizeCssVars()}));this.openTransitionProp="opacity";this.setTransitionEl=t=>{this.transitionEl=t};this.openEnd=()=>{this.setFocus();this.el.removeEventListener("calciteModalOpen",this.openEnd)};this.handleCloseClick=()=>{this.open=false};this.handleOutsideClose=()=>{if(this.outsideCloseDisabled){return}this.open=false};this.closeModal=async()=>{if(this.beforeClose){try{await this.beforeClose(this.el)}catch(t){requestAnimationFrame((()=>{this.ignoreOpenChange=true;this.open=true;this.ignoreOpenChange=false}));return}}T--;this.opened=false;this.removeOverflowHiddenClass()};this.handleMutationObserver=()=>{this.updateFooterVisibility();this.updateFocusTrapElements()};this.updateFooterVisibility=()=>{this.hasFooter=!!r(this.el,[F.back,F.primary,F.secondary])};this.updateSizeCssVars=()=>{this.cssWidth=getComputedStyle(this.el).getPropertyValue("--calcite-modal-width");this.cssHeight=getComputedStyle(this.el).getPropertyValue("--calcite-modal-height")};this.contentTopSlotChangeHandler=t=>{this.hasContentTop=l(t)};this.contentBottomSlotChangeHandler=t=>{this.hasContentBottom=l(t)};this.open=false;this.opened=false;this.beforeClose=undefined;this.closeButtonDisabled=false;this.focusTrapDisabled=false;this.outsideCloseDisabled=false;this.docked=undefined;this.escapeDisabled=false;this.scale="m";this.widthScale="m";this.fullscreen=undefined;this.kind=undefined;this.messages=undefined;this.messageOverrides=undefined;this.slottedInShell=undefined;this.cssWidth=undefined;this.cssHeight=undefined;this.hasFooter=true;this.hasContentTop=false;this.hasContentBottom=false;this.effectiveLocale=undefined;this.defaultMessages=undefined}handleFocusTrapDisabled(t){if(!this.open){return}t?h(this):m(this)}onMessagesChange(){}async componentWillLoad(){await w(this);u(this);if(this.open){this.openModal()}}componentDidLoad(){f(this)}connectedCallback(){this.mutationObserver?.observe(this.el,{childList:true,subtree:true});this.cssVarObserver?.observe(this.el,{attributeFilter:["style"]});this.updateSizeCssVars();this.updateFooterVisibility();n(this);k(this);y(this);p(this)}disconnectedCallback(){this.removeOverflowHiddenClass();this.mutationObserver?.disconnect();this.cssVarObserver?.disconnect();s(this);h(this);z(this);C(this);this.slottedInShell=false}render(){return i(o,{"aria-describedby":this.contentId,"aria-labelledby":this.titleId,"aria-modal":"true",role:"dialog"},i("div",{class:{[O.container]:true,[O.containerOpen]:this.opened,[O.slottedInShell]:this.slottedInShell}},i("calcite-scrim",{class:O.scrim,onClick:this.handleOutsideClose}),this.renderStyle(),i("div",{class:{[O.modal]:true},ref:this.setTransitionEl},i("div",{class:O.header},this.renderCloseButton(),i("header",{class:O.title},i("slot",{name:O.header}))),this.renderContentTop(),i("div",{class:{[O.content]:true,[O.contentNoFooter]:!this.hasFooter},ref:t=>this.modalContent=t},i("slot",{name:F.content})),this.renderContentBottom(),this.renderFooter())))}renderFooter(){return this.hasFooter?i("div",{class:O.footer,key:"footer"},i("span",{class:O.back},i("slot",{name:F.back})),i("span",{class:O.secondary},i("slot",{name:F.secondary})),i("span",{class:O.primary},i("slot",{name:F.primary}))):null}renderContentTop(){return i("div",{class:O.contentTop,hidden:!this.hasContentTop},i("slot",{name:F.contentTop,onSlotchange:this.contentTopSlotChangeHandler}))}renderContentBottom(){return i("div",{class:O.contentBottom,hidden:!this.hasContentBottom},i("slot",{name:F.contentBottom,onSlotchange:this.contentBottomSlotChangeHandler}))}renderCloseButton(){return!this.closeButtonDisabled?i("button",{"aria-label":this.messages.close,class:O.close,key:"button",onClick:this.handleCloseClick,title:this.messages.close,ref:t=>this.closeButtonEl=t},i("calcite-icon",{icon:B.close,scale:$(this.scale)})):null}renderStyle(){if(!this.fullscreen&&(this.cssWidth||this.cssHeight)){return i("style",null,`.${O.container} {\n              ${this.docked&&this.cssWidth?`align-items: center !important;`:""}\n            }\n            .${O.modal} {\n              block-size: ${this.cssHeight?this.cssHeight:"auto"} !important;\n              ${this.cssWidth?`inline-size: ${this.cssWidth} !important;`:""}\n              ${this.cssWidth?`max-inline-size: ${this.cssWidth} !important;`:""}\n              ${this.docked?`border-radius: var(--calcite-border-radius) !important;`:""}\n            }\n            @media screen and (max-width: ${this.cssWidth}) {\n              .${O.container} {\n                ${this.docked?`align-items: flex-end !important;`:""}\n              }\n              .${O.modal} {\n                max-block-size: 100% !important;\n                inline-size: 100% !important;\n                max-inline-size: 100% !important;\n                min-inline-size: 100% !important;\n                margin: 0 !important;\n                ${!this.docked?`block-size: 100% !important;`:""}\n                ${!this.docked?`border-radius: 0 !important;`:""}\n                ${this.docked?`border-radius: var(--calcite-border-radius) var(--calcite-border-radius) 0 0 !important;`:""}\n              }\n            }\n          `)}}effectiveLocaleChange(){j(this,this.effectiveLocale)}handleEscape(t){if(this.open&&!this.escapeDisabled&&t.key==="Escape"&&!t.defaultPrevented){this.open=false;t.preventDefault()}}async setFocus(){await g(this);c(this.el)}async updateFocusTrapElements(){b(this)}async scrollContent(t=0,e=0){if(this.modalContent){if(this.modalContent.scrollTo){this.modalContent.scrollTo({top:t,left:e,behavior:"smooth"})}else{this.modalContent.scrollTop=t;this.modalContent.scrollLeft=e}}}onBeforeOpen(){this.transitionEl.classList.add(O.openingActive);this.calciteModalBeforeOpen.emit()}onOpen(){this.transitionEl.classList.remove(O.openingIdle,O.openingActive);this.calciteModalOpen.emit();m(this)}onBeforeClose(){this.transitionEl.classList.add(O.closingActive);this.calciteModalBeforeClose.emit()}onClose(){this.transitionEl.classList.remove(O.closingIdle,O.closingActive);this.calciteModalClose.emit();h(this)}toggleModal(t){if(this.ignoreOpenChange){return}if(t){this.openModal()}else{this.closeModal()}}handleOpenedChange(t){const e=t?O.openingIdle:O.closingIdle;this.transitionEl.classList.add(e);v(this)}async openModal(){await M(this.el);this.el.addEventListener("calciteModalOpen",this.openEnd);this.opened=true;const t=r(this.el,F.header);const e=r(this.el,F.content);this.titleId=d(t);this.contentId=d(e);if(!this.slottedInShell){if(T===0){L=document.documentElement.style.overflow}T++;document.documentElement.style.setProperty("overflow","hidden")}}removeOverflowHiddenClass(){document.documentElement.style.setProperty("overflow",L)}static get assetsDirs(){return["assets"]}get el(){return a(this)}static get watchers(){return{focusTrapDisabled:["handleFocusTrapDisabled"],messageOverrides:["onMessagesChange"],effectiveLocale:["effectiveLocaleChange"],open:["toggleModal"],opened:["handleOpenedChange"]}}};S.style=D;export{S as calcite_modal};
-//# sourceMappingURL=p-00ab167b.entry.js.map

package/dist/calcite/p-05220dbb.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.1
- */
-import{r as e,c as t,h as s,g as i}from"./p-e7b7cbd1.js";import{t as a}from"./p-3a17e32e.js";import{s as n,a as o,c as l}from"./p-d3a47eeb.js";import{c as r,d as c}from"./p-310bb5d7.js";import{c as d,s as h,d as f,u}from"./p-6f001be5.js";import{c as p,u as b,d as g}from"./p-8f66e8bc.js";import"./p-f3a30d54.js";import"./p-72c5d4c3.js";import"./p-9e945454.js";import"./p-10fac586.js";import"./p-81853f8b.js";const m={handle:"handle",handleSelected:"handle--selected"};const v={drag:"drag"};const x={itemLabel:"{itemLabel}",position:"{position}",total:"{total}"};const y=":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{display:flex}.handle{display:flex;align-items:center;justify-content:center;align-self:stretch;border-style:none;background-color:transparent;outline-color:transparent;color:var(--calcite-color-border-input);padding-block:0.75rem;padding-inline:0.25rem;line-height:0}.handle calcite-icon{color:inherit}:host(:not([disabled])) .handle{cursor:move}:host(:not([disabled])) .handle:hover{background-color:var(--calcite-color-foreground-2);color:var(--calcite-color-text-1)}:host(:not([disabled])) .handle:focus{color:var(--calcite-color-text-1);outline:2px solid var(--calcite-color-brand);outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}:host(:not([disabled])) .handle--selected{background-color:var(--calcite-color-foreground-3);color:var(--calcite-color-text-1)}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([hidden]){display:none}[hidden]{display:none}";const C=class{constructor(s){e(this,s);this.calciteHandleChange=t(this,"calciteHandleChange",6);this.calciteHandleNudge=t(this,"calciteHandleNudge",6);this.calciteInternalAssistiveTextChange=t(this,"calciteInternalAssistiveTextChange",6);this.handleKeyDown=e=>{if(this.disabled){return}switch(e.key){case" ":this.selected=!this.selected;this.calciteHandleChange.emit();e.preventDefault();break;case"ArrowUp":if(!this.selected){return}e.preventDefault();this.calciteHandleNudge.emit({direction:"up"});break;case"ArrowDown":if(!this.selected){return}e.preventDefault();this.calciteHandleNudge.emit({direction:"down"});break}};this.handleBlur=()=>{if(this.blurUnselectDisabled||this.disabled){return}if(this.selected){this.selected=false;this.calciteHandleChange.emit()}};this.selected=false;this.disabled=false;this.dragHandle=undefined;this.messages=undefined;this.setPosition=undefined;this.setSize=undefined;this.label=undefined;this.blurUnselectDisabled=false;this.messageOverrides=undefined;this.effectiveLocale=undefined;this.defaultMessages=undefined}handleAriaTextChange(){const e=this.getAriaText("live");if(e){this.calciteInternalAssistiveTextChange.emit({message:e})}}onMessagesChange(){}connectedCallback(){p(this);d(this);r(this)}async componentWillLoad(){n(this);await h(this)}componentDidLoad(){o(this)}componentDidRender(){b(this)}disconnectedCallback(){g(this);f(this);c(this)}effectiveLocaleChange(){u(this,this.effectiveLocale)}async setFocus(){await l(this);this.handleButton?.focus()}getTooltip(){const{label:e,messages:t}=this;if(!t){return""}if(!e){return t.dragHandleUntitled}return t.dragHandle.replace(x.itemLabel,e)}getAriaText(e){const{setPosition:t,setSize:s,label:i,messages:a,selected:n}=this;if(!a||!i||typeof s!=="number"||typeof t!=="number"){return null}const o=e==="label"?n?a.dragHandleChange:a.dragHandleIdle:n?a.dragHandleActive:a.dragHandleCommit;const l=o.replace(x.position,t.toString());const r=l.replace(x.itemLabel,i);return r.replace(x.total,s.toString())}render(){return s("span",{"aria-disabled":this.disabled?a(this.disabled):null,"aria-label":this.disabled?null:this.getAriaText("label"),"aria-pressed":this.disabled?null:a(this.selected),class:{[m.handle]:true,[m.handleSelected]:!this.disabled&&this.selected},onBlur:this.handleBlur,onKeyDown:this.handleKeyDown,role:"button",tabIndex:this.disabled?null:0,title:this.getTooltip(),ref:e=>{this.handleButton=e}},s("calcite-icon",{icon:v.drag,scale:"s"}))}static get assetsDirs(){return["assets"]}get el(){return i(this)}static get watchers(){return{messages:["handleAriaTextChange"],label:["handleAriaTextChange"],selected:["handleAriaTextChange"],setPosition:["handleAriaTextChange"],setSize:["handleAriaTextChange"],messageOverrides:["onMessagesChange"],effectiveLocale:["effectiveLocaleChange"]}}};C.style=y;export{C as calcite_handle};
-//# sourceMappingURL=p-05220dbb.entry.js.map

package/dist/calcite/p-060ad977.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.1
- */
-import{f as t}from"./p-e7b7cbd1.js";import{c as o}from"./p-10fac586.js";const c=new Set;let n;const f={childList:true};function s(t){if(!n){n=o("mutation",r)}n.observe(t.el,f)}function i(t){c.delete(t.el);r(n.takeRecords());n.disconnect();for(const[t]of c.entries()){n.observe(t,f)}}function r(o){o.forEach((({target:o})=>{t(o)}))}export{s as c,i as d};
-//# sourceMappingURL=p-060ad977.js.map

package/dist/calcite/p-069aad10.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.1
- */
-import{r as e,f as t,h as i,H as n,g as o,c as s,F as r}from"./p-e7b7cbd1.js";import{s as a,l as c,d as l,g as h}from"./p-3a17e32e.js";import{s as d,a as u,c as f}from"./p-d3a47eeb.js";import{c as m,d as p}from"./p-310bb5d7.js";import{u as v,c as b,s as g,d as y}from"./p-6f001be5.js";import{C as x}from"./p-72c5d4c3.js";import"./p-f3a30d54.js";import"./p-9e945454.js";import"./p-10fac586.js";const w=":host{display:flex}ul{margin:0px;display:inline-flex;block-size:100%;align-items:center;padding:0px}:host([layout=vertical]) ul{display:flex;inline-size:100%;flex-direction:column}:host([hidden]){display:none}[hidden]{display:none}";const k=class{constructor(t){e(this,t);this.menuItems=[];this.handleMenuSlotChange=e=>{this.menuItems=a(e);this.setMenuItemLayout(this.menuItems,this.layout)};this.label=undefined;this.layout="horizontal";this.messageOverrides=undefined;this.messages=undefined;this.defaultMessages=undefined;this.effectiveLocale=""}handleGlobalAttributesChanged(){t(this);this.setMenuItemLayout(this.menuItems,this.layout)}handleLayoutChange(e){this.setMenuItemLayout(this.menuItems,e)}onMessagesChange(){}effectiveLocaleChange(){v(this,this.effectiveLocale)}connectedCallback(){m(this);b(this)}async componentWillLoad(){d(this);await g(this)}componentDidLoad(){u(this)}disconnectedCallback(){p(this);y(this)}async setFocus(){await f(this);this.el.focus()}calciteInternalNavMenuItemKeyEvent(e){const t=e.target;const i=e.detail.children;const n=e.detail.event.key;e.stopPropagation();if(n==="ArrowDown"){if(t.layout==="vertical"){c(this.menuItems,t,"next",false)}else{if(e.detail.isSubmenuOpen){i[0].setFocus()}}}else if(n==="ArrowUp"){if(this.layout==="vertical"){c(this.menuItems,t,"previous",false)}else{if(e.detail.isSubmenuOpen){i[i.length-1].setFocus()}}}else if(n==="ArrowRight"){if(this.layout==="horizontal"){c(this.menuItems,t,"next",false)}else{if(e.detail.isSubmenuOpen){i[0].setFocus()}}}else if(n==="ArrowLeft"){if(this.layout==="horizontal"){c(this.menuItems,t,"previous",false)}else{if(e.detail.isSubmenuOpen){this.focusParentElement(e.target)}}}else if(n==="Escape"){this.focusParentElement(e.target)}e.preventDefault()}focusParentElement(e){const t=e.parentElement;if(t){l(t);t.open=false}}setMenuItemLayout(e,t){e.forEach((e=>{e.layout=t;if(this.getEffectiveRole()==="menubar"){e.isTopLevelItem=true;e.topLevelMenuLayout=this.layout}}))}getEffectiveRole(){return this.el.getAttribute("role")||"menubar"}render(){return i(n,null,i("ul",{"aria-label":this.label,role:this.getEffectiveRole()},i("slot",{onSlotchange:this.handleMenuSlotChange})))}static get delegatesFocus(){return true}static get assetsDirs(){return["assets"]}get el(){return o(this)}static get watchers(){return{role:["handleGlobalAttributesChanged"],layout:["handleLayoutChange"],messageOverrides:["onMessagesChange"],effectiveLocale:["effectiveLocaleChange"]}}};k.style=w;const z={container:"container",content:"content",dropdownVertical:"dropdown--vertical",dropdownMenuItems:"dropdown-menu-items",dropdownAction:"dropdown-action",layoutVertical:"layout--vertical",hoverHrefIcon:"hover-href-icon",icon:"icon",iconBreadcrumb:"icon--breadcrumb",iconDropdown:"icon--dropdown",iconEnd:"icon--end",iconStart:"icon--start",isParentVertical:"parent--vertical",itemContent:"item-content",open:"open",nested:"nested",textContainer:"text-container"};const C=':host{position:relative;box-sizing:border-box;display:flex;align-items:center;flex-shrink:0}:host .container,:host .item-content,:host .content{min-block-size:3rem}:host([layout=vertical]){inline-size:100%}:host(:not([layout=vertical])){block-size:100%}.container,.item-content{display:flex;block-size:100%;inline-size:100%;flex-direction:row;align-items:stretch}.content{position:relative;box-sizing:border-box;display:flex;block-size:100%;inline-size:100%;cursor:pointer;align-items:center;justify-content:center;background-color:var(--calcite-color-foreground-1);padding-inline:1rem;font-size:var(--calcite-font-size-0);color:var(--calcite-color-text-2);outline:2px solid transparent;outline-offset:2px;text-decoration:none;border-block-end:0.125rem solid transparent;padding-block-start:0.125rem}.content:hover{background-color:var(--calcite-color-foreground-2);color:var(--calcite-color-text-2)}.content:focus{background-color:var(--calcite-color-foreground-2);color:var(--calcite-color-text-2);outline:2px solid var(--calcite-color-brand);outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.content:active{background-color:var(--calcite-color-foreground-3);color:var(--calcite-color-text-1)}.content span{display:inline-flex}.content.layout--vertical{display:flex;inline-size:100%;justify-content:flex-start;padding-block:1rem;border-block-end:0;border-inline-end:0.25rem solid transparent}:host([active]) .content{color:var(--calcite-color-text-1);border-color:var(--calcite-color-brand)}:host([active]) .content .icon{--calcite-ui-icon-color:var(--calcite-color-brand)}:host([layout=vertical]) .content{padding-inline:0.75rem}.icon--start{margin-inline-end:0.75rem}.icon--end{margin-inline-start:0.75rem}:host([layout=vertical]) .icon--end{margin-inline-start:auto;padding-inline-start:0.75rem}.icon--dropdown{position:relative;margin-inline-start:auto;margin-inline-end:0px;padding-inline-start:0.5rem;--calcite-ui-icon-color:var(--calcite-color-text-3)}:host([layout=vertical]) .icon--end~.icon--dropdown{margin-inline-start:0.75rem}:host([layout=vertical]) .hover-href-icon{padding-inline-start:0.5rem}:host([layout=vertical]) .hover-href-icon~.icon--end{margin-inline-start:0.5rem}:host([layout=vertical]) .hover-href-icon~.icon--breadcrumb{margin-inline-start:0.75rem}.icon--breadcrumb{margin-inline-end:0px;padding-inline-start:0.5rem;--calcite-ui-icon-color:var(--calcite-color-text-3)}:host([layout=vertical]) .icon--breadcrumb{margin-inline-start:auto}:host([layout=vertical]) .icon--breadcrumb~.icon--dropdown{margin-inline-start:0.5rem}:host([layout=vertical]) .icon--end~.icon--breadcrumb{margin-inline-start:0.5rem}:host([breadcrumb]) .content{padding-inline-end:0.75rem}calcite-action{position:relative;block-size:auto;border-inline-start:1px solid var(--calcite-color-foreground-1)}calcite-action:after{position:absolute;inset-inline-start:-1px;display:block;inline-size:1px;content:"";inset-block:0.75rem;background-color:var(--calcite-color-border-3)}calcite-action:hover:after{block-size:100%;inset-block:0}.content:focus~calcite-action,.content:hover~calcite-action{color:var(--calcite-color-text-1);border-inline-start:1px solid var(--calcite-color-border-3)}.container:hover .dropdown-action{background-color:var(--calcite-color-foreground-2)}.dropdown-menu-items{position:absolute;display:none;block-size:auto;min-inline-size:100%;flex-direction:column;overflow:visible;border:1px solid var(--calcite-color-border-3);background:var(--calcite-color-foreground-1);inset-block-start:100%;z-index:var(--calcite-z-index-dropdown)}.dropdown-menu-items.open{display:block}.dropdown-menu-items.nested{position:absolute;inset-block-start:-1px;transform:translateX(calc(100% - 2px))}.parent--vertical{flex-direction:column}.dropdown--vertical.dropdown-menu-items{position:relative;border-radius:0px;box-shadow:none;inset-block-start:0;transform:none}.dropdown--vertical.dropdown-menu-items:last-of-type{border-inline:0}:host([layout=vertical]:last-of-type) .dropdown-menu-items{border-block-end:0}:host([slot=submenu-item]) .parent--vertical{padding-inline-start:1.5rem}.dropdown-menu-items.nested.calcite--rtl{transform:translateX(calc(-100% + 2px))}.dropdown--vertical.dropdown-menu-items.nested.calcite--rtl{transform:none}.hover-href-icon{position:relative;inset-inline-end:0.25rem;margin-inline-start:auto;opacity:0;transition:all var(--calcite-internal-animation-timing-medium) ease-in-out}.content:focus .hover-href-icon,.content:hover .hover-href-icon{inset-inline-end:-0.25rem;opacity:1}:host([hidden]){display:none}[hidden]{display:none}';const I=class{constructor(t){e(this,t);this.calciteInternalMenuItemKeyEvent=s(this,"calciteInternalMenuItemKeyEvent",7);this.calciteMenuItemSelect=s(this,"calciteMenuItemSelect",7);this.clickHandler=e=>{if(this.href&&e.target===this.dropdownActionEl||!this.href&&this.hasSubmenu){this.open=!this.open}this.selectMenuItem(e)};this.handleMenuItemSlotChange=e=>{this.submenuItems=a(e);this.submenuItems.forEach((e=>{if(!e.topLevelMenuLayout){e.topLevelMenuLayout=this.topLevelMenuLayout}}));this.hasSubmenu=this.submenuItems.length>0};this.keyDownHandler=async e=>{const{hasSubmenu:t,href:i,layout:n,open:o,submenuItems:s}=this;const r=e.key;const a=e.target===this.dropdownActionEl;if(r===" "||r==="Enter"){if(t&&(!i||i&&a)){this.open=!o}if(!(i&&a)&&r!=="Enter"){this.selectMenuItem(e)}if(r===" "||i&&a){e.preventDefault()}}else if(r==="Escape"){if(o){this.open=false;return}this.calciteInternalMenuItemKeyEvent.emit({event:e});e.preventDefault()}else if(r==="ArrowDown"||r==="ArrowUp"){e.preventDefault();if((a||!i)&&t&&!o&&n==="horizontal"){this.open=true;return}this.calciteInternalMenuItemKeyEvent.emit({event:e,children:s,isSubmenuOpen:o&&t})}else if(r==="ArrowLeft"){e.preventDefault();this.calciteInternalMenuItemKeyEvent.emit({event:e,children:s,isSubmenuOpen:true})}else if(r==="ArrowRight"){e.preventDefault();if((a||!i)&&t&&!o&&n==="vertical"){this.open=true;return}this.calciteInternalMenuItemKeyEvent.emit({event:e,children:s,isSubmenuOpen:o&&t})}};this.active=undefined;this.breadcrumb=undefined;this.href=undefined;this.iconEnd=undefined;this.iconFlipRtl=undefined;this.iconStart=undefined;this.isTopLevelItem=false;this.label=undefined;this.layout=undefined;this.messageOverrides=undefined;this.messages=undefined;this.open=false;this.rel=undefined;this.target=undefined;this.text=undefined;this.topLevelMenuLayout=undefined;this.defaultMessages=undefined;this.effectiveLocale="";this.hasSubmenu=false;this.submenuItems=undefined}onMessagesChange(){}effectiveLocaleChange(){v(this,this.effectiveLocale)}async setFocus(){await f(this);this.anchorEl.focus()}handleClickOut(e){if(this.topLevelMenuLayout!=="vertical"&&this.hasSubmenu&&this.open&&!e.composedPath().includes(this.el)){this.open=false}}handleFocusOut(e){if(this.topLevelMenuLayout!=="vertical"&&!this.el.contains(e.relatedTarget)){this.open=false}}connectedCallback(){m(this);b(this)}async componentWillLoad(){d(this);await g(this)}componentDidLoad(){u(this)}disconnectedCallback(){p(this);y(this)}blurHandler(){this.isFocused=false}focusHandler(e){const t=e.target;this.isFocused=true;if(t.open&&!this.open){t.open=false}}selectMenuItem(e){if(e.target!==this.dropdownActionEl){this.calciteMenuItemSelect.emit()}}renderIconStart(){return i("calcite-icon",{class:`${z.icon} ${z.iconStart}`,flipRtl:this.iconFlipRtl==="start"||this.iconFlipRtl==="both",icon:this.iconStart,key:z.iconStart,scale:"s"})}renderIconEnd(){return i("calcite-icon",{class:`${z.icon} ${z.iconEnd}`,flipRtl:this.iconFlipRtl==="end"||this.iconFlipRtl==="both",icon:this.iconEnd,key:z.iconEnd,scale:"s"})}renderBreadcrumbIcon(e){return i("calcite-icon",{class:`${z.icon} ${z.iconBreadcrumb}`,icon:e==="rtl"?"chevron-left":"chevron-right",key:z.iconBreadcrumb,scale:"s"})}renderDropdownIcon(e){const t=e==="rtl"?"chevron-left":"chevron-right";return i("calcite-icon",{class:`${z.icon} ${z.iconDropdown}`,icon:this.topLevelMenuLayout==="vertical"||this.isTopLevelItem?this.open?"chevron-up":"chevron-down":t,key:z.iconDropdown,scale:"s"})}renderDropdownAction(e){const t=e==="rtl"?"chevron-left":"chevron-right";return i("calcite-action",{class:z.dropdownAction,icon:this.topLevelMenuLayout==="vertical"||this.isTopLevelItem?this.open?"chevron-up":"chevron-down":t,key:z.dropdownAction,onClick:this.clickHandler,onKeyDown:this.keyDownHandler,text:this.messages.open,ref:e=>this.dropdownActionEl=e})}renderSubmenuItems(e){return i("calcite-menu",{class:{[z.dropdownMenuItems]:true,[z.open]:this.open,[z.nested]:!this.isTopLevelItem,[x.rtl]:e==="rtl",[z.dropdownVertical]:this.topLevelMenuLayout==="vertical"},label:this.messages.submenu,layout:"vertical",role:"menu"},i("slot",{name:"submenu-item",onSlotchange:this.handleMenuItemSlotChange}))}renderHrefIcon(e){return i("calcite-icon",{class:z.hoverHrefIcon,icon:e==="rtl"?"arrow-left":"arrow-right",key:z.hoverHrefIcon,scale:"s"})}renderItemContent(e){const t=this.href&&(this.topLevelMenuLayout==="vertical"||!this.isTopLevelItem);return i(r,null,this.iconStart&&this.renderIconStart(),i("div",{class:z.textContainer},i("span",null,this.text)),t&&this.renderHrefIcon(e),this.iconEnd&&this.renderIconEnd(),this.breadcrumb?this.renderBreadcrumbIcon(e):null,!this.href&&this.hasSubmenu?this.renderDropdownIcon(e):null)}render(){const e=h(this.el);return i(n,{onBlur:this.blurHandler,onFocus:this.focusHandler},i("li",{class:{[z.container]:true,[z.isParentVertical]:this.topLevelMenuLayout==="vertical"},role:"none"},i("div",{class:z.itemContent},i("a",{"aria-current":this.isFocused?"page":false,"aria-expanded":this.open,"aria-haspopup":this.hasSubmenu,"aria-label":this.label,class:{[z.layoutVertical]:this.layout==="vertical",[z.content]:true},href:this.href,onClick:this.clickHandler,onKeyDown:this.keyDownHandler,rel:this.rel,role:"menuitem",tabIndex:this.isTopLevelItem?0:-1,target:this.target,ref:e=>this.anchorEl=e},this.renderItemContent(e)),this.href&&this.hasSubmenu?this.renderDropdownAction(e):null),this.renderSubmenuItems(e)))}static get assetsDirs(){return["assets"]}get el(){return o(this)}static get watchers(){return{messageOverrides:["onMessagesChange"],effectiveLocale:["effectiveLocaleChange"]}}};I.style=C;export{k as calcite_menu,I as calcite_menu_item};
-//# sourceMappingURL=p-069aad10.entry.js.map

package/dist/calcite/p-0bc75b4f.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.1
- */
-import{r as t,c as e,h as s,F as i,g as a}from"./p-e7b7cbd1.js";import{s as n,a as o,c as r}from"./p-d3a47eeb.js";import{n as l,c,d as h}from"./p-310bb5d7.js";import{u as d,c as m,s as p,d as u}from"./p-6f001be5.js";import{c as g}from"./p-10fac586.js";import{g as f}from"./p-3e580eba.js";import"./p-3a17e32e.js";import"./p-f3a30d54.js";import"./p-72c5d4c3.js";import"./p-9e945454.js";const v={page:"page",selected:"selected",chevron:"chevron",disabled:"disabled",ellipsis:"ellipsis"};const b={next:"chevron-right",previous:"chevron-left",first:"chevron-start",last:"chevron-end"};const x={min:"0",max:"320px"};const k={min:"321px",max:"476px"};const y={min:"477px",max:"768px"};const z={min:"769px",max:"1152px"};const I={min:"1153px",max:"1440px"};const C={width:{large:S(I.max),medium:S(z.max),small:S(y.max),xsmall:S(k.max),xxsmall:S(x.max)}};function S(t){return parseInt(t)}const w=":host{display:flex;writing-mode:horizontal-tb}:host([scale=s]) .chevron,:host([scale=s]) .page,:host([scale=s]) .ellipsis{block-size:1.5rem;padding-inline:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem;min-inline-size:1.5rem}:host([scale=m]) .chevron,:host([scale=m]) .page,:host([scale=m]) .ellipsis{block-size:2rem;padding-inline:0.5rem;font-size:var(--calcite-font-size--1);line-height:1rem;min-inline-size:2rem}:host([scale=l]) .chevron,:host([scale=l]) .page,:host([scale=l]) .ellipsis{block-size:2.75rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;min-inline-size:2.75rem}:host([scale=l]) .chevron{padding-inline:0.625rem}:host([scale=l]) .page,:host([scale=l]) .ellipsis{padding-inline:0.75rem}:host button{outline-color:transparent}:host button:focus{outline:2px solid var(--calcite-color-brand);outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.chevron,.page,.ellipsis{margin:0px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;border-style:none;--tw-border-opacity:0;background-color:transparent;padding:0px;vertical-align:baseline;font-family:inherit;font-size:var(--calcite-font-size-0);line-height:1.25rem;color:var(--calcite-color-text-3)}.chevron,.page{cursor:pointer;border-block:2px solid transparent}.chevron:hover,.page:hover{color:var(--calcite-color-text-1);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}.page:hover{border-block-end-color:var(--calcite-color-border-2)}.page.selected{font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1);border-block-end-color:var(--calcite-color-brand)}.chevron:hover{background-color:var(--calcite-color-foreground-2);color:var(--calcite-color-brand)}.chevron:active{background-color:var(--calcite-color-foreground-3)}.chevron.disabled{pointer-events:none;background-color:transparent}.chevron.disabled>calcite-icon{opacity:var(--calcite-opacity-disabled)}:host([hidden]){display:none}[hidden]{display:none}";const L=2;const j=2;const P={large:11,medium:9,small:7,xsmall:5,xxsmall:1};const X=class{constructor(s){t(this,s);this.calcitePaginationChange=e(this,"calcitePaginationChange",6);this.resizeObserver=g("resize",(t=>t.forEach(this.resizeHandler)));this.resizeHandler=({contentRect:{width:t}})=>this.setMaxItemsToBreakpoint(t);this.firstClicked=()=>{this.startItem=1;this.emitUpdate()};this.lastClicked=()=>{this.startItem=this.lastStartItem;this.emitUpdate()};this.previousClicked=async()=>{await this.previousPage();this.emitUpdate()};this.nextClicked=async()=>{await this.nextPage();this.emitUpdate()};this.handlePageClick=t=>{const e=t.target;this.startItem=parseInt(e.value,10);this.emitUpdate()};this.groupSeparator=false;this.messages=undefined;this.messageOverrides=undefined;this.numberingSystem=undefined;this.pageSize=20;this.scale="m";this.startItem=1;this.totalItems=0;this.defaultMessages=undefined;this.effectiveLocale="";this.maxItems=P.xxsmall;this.totalPages=undefined;this.lastStartItem=undefined;this.isXXSmall=undefined}onMessagesChange(){}handleTotalPages(){if(this.pageSize<1){this.pageSize=1}this.totalPages=this.totalItems/this.pageSize}effectiveLocaleChange(){d(this,this.effectiveLocale)}effectiveLocaleWatcher(){l.numberFormatOptions={locale:this.effectiveLocale,numberingSystem:this.numberingSystem,useGrouping:this.groupSeparator}}handleLastStartItemChange(){const{totalItems:t,pageSize:e,totalPages:s}=this;this.lastStartItem=(t%e===0?t-e:Math.floor(s)*e)+1}handleIsXXSmall(){this.isXXSmall=this.maxItems===P.xxsmall}connectedCallback(){c(this);m(this);this.resizeObserver?.observe(this.el)}async componentWillLoad(){await p(this);n(this);this.handleTotalPages();this.handleLastStartItemChange();this.handleIsXXSmall()}componentDidLoad(){o(this);this.setMaxItemsToBreakpoint(this.el.clientWidth)}disconnectedCallback(){h(this);u(this);this.resizeObserver?.disconnect()}async setFocus(){await r(this);this.el.focus()}async nextPage(){this.startItem=Math.min(this.lastStartItem,this.startItem+this.pageSize)}async previousPage(){this.startItem=Math.max(1,this.startItem-this.pageSize)}setMaxItemsToBreakpoint(t){if(!C||!t){return}if(t>=C.width.medium){this.maxItems=P.large;return}if(t>=C.width.small){this.maxItems=P.medium;return}if(t>=C.width.xsmall){this.maxItems=P.small;return}if(t>=C.width.xxsmall){this.maxItems=P.xsmall;return}this.maxItems=P.xxsmall}showStartEllipsis(){return this.totalPages>this.maxItems&&Math.floor(this.startItem/this.pageSize)>this.maxItems-L-j}showEndEllipsis(){return this.totalPages>this.maxItems&&(this.totalItems-this.startItem)/this.pageSize>this.maxItems-L-(j-1)}emitUpdate(){this.calcitePaginationChange.emit()}renderEllipsis(t){return s("span",{class:v.ellipsis,"data-test-ellipsis":t,key:t},"…")}renderItems(){const{totalItems:t,pageSize:e,startItem:s,maxItems:i,totalPages:a,lastStartItem:n,isXXSmall:o}=this;const r=[];if(o){r.push(this.renderPage(s));return r}const l=t>e;const c=this.showStartEllipsis();const h=this.showEndEllipsis();if(l){r.push(this.renderPage(1))}if(c){r.push(this.renderEllipsis("start"))}const d=i-L-(h?1:0)-(c?1:0);let m;let p;if(a-1<=d){p=1+e;m=n-e}else{if(s/e<d){p=1+e;m=1+d*e}else{if(s+d*e>=t){p=n-d*e;m=n-e}else{p=s-e*((d-1)/2);m=s+e*((d-1)/2)}}}for(let t=0;t<d&&p<=m;t++){r.push(this.renderPage(p));p=p+e}if(h){r.push(this.renderEllipsis("end"))}r.push(this.renderPage(n));return r}renderPage(t){const{pageSize:e}=this;const i=Math.floor(t/e)+(e===1?0:1);l.numberFormatOptions={locale:this.effectiveLocale,numberingSystem:this.numberingSystem,useGrouping:this.groupSeparator};const a=l.localize(i.toString());const n=t===this.startItem;return s("button",{"aria-current":n?"page":"false",class:{[v.page]:true,[v.selected]:n},onClick:this.handlePageClick,value:t},a)}renderPreviousChevron(){const{pageSize:t,startItem:e,messages:i}=this;const a=t===1?e<=t:e<t;return s("button",{"aria-label":i.previous,class:{[v.chevron]:true,[v.disabled]:a},"data-test-chevron":"previous",disabled:a,key:"previous",onClick:this.previousClicked},s("calcite-icon",{flipRtl:true,icon:b.previous,scale:f(this.scale)}))}renderNextChevron(){const{totalItems:t,pageSize:e,startItem:i,messages:a}=this;const n=e===1?i+e>t:i+e>t;return s("button",{"aria-label":a.next,class:{[v.chevron]:true,[v.disabled]:n},"data-test-chevron":"next",disabled:n,key:"next-button",onClick:this.nextClicked},s("calcite-icon",{flipRtl:true,icon:b.next,scale:f(this.scale)}))}renderFirstChevron(){const{messages:t,startItem:e,isXXSmall:i}=this;const a=e===1;return i?s("button",{"aria-label":t.first,class:{[v.chevron]:true,[v.disabled]:a},disabled:a,key:"first-button",onClick:this.firstClicked},s("calcite-icon",{flipRtl:true,icon:b.first,scale:f(this.scale)})):null}renderLastChevron(){const{messages:t,startItem:e,isXXSmall:i,lastStartItem:a}=this;const n=e===a;return i?s("button",{"aria-label":t.last,class:{[v.chevron]:true,[v.disabled]:n},disabled:n,key:"last-button",onClick:this.lastClicked},s("calcite-icon",{flipRtl:true,icon:b.last,scale:f(this.scale)})):null}render(){return s(i,null,this.renderFirstChevron(),this.renderPreviousChevron(),this.renderItems(),this.renderNextChevron(),this.renderLastChevron())}static get delegatesFocus(){return true}static get assetsDirs(){return["assets"]}get el(){return a(this)}static get watchers(){return{messageOverrides:["onMessagesChange"],totalItems:["handleTotalPages","handleLastStartItemChange"],pageSize:["handleTotalPages","handleLastStartItemChange"],effectiveLocale:["effectiveLocaleChange","effectiveLocaleWatcher"],totalPages:["handleLastStartItemChange"],maxItems:["handleIsXXSmall"]}}};X.style=w;export{X as calcite_pagination};
-//# sourceMappingURL=p-0bc75b4f.entry.js.map