@esri/calcite-components 2.12.0-next.21 → 2.12.0-next.22

package/dist/cjs/calcite-dialog.cjs.entry.js

@@ -1,27 +1,27 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0-next.21
+ * v2.12.0-next.22
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d80273a.js');
-const dom = require('./dom-881fc445.js');
-const focusTrapComponent = require('./focusTrapComponent-966dfc55.js');
-const loadable = require('./loadable-5de24ce2.js');
-const observers = require('./observers-60f6fe44.js');
-const openCloseComponent = require('./openCloseComponent-8e139f80.js');
-const locale = require('./locale-667d42ba.js');
-const t9n = require('./t9n-69d3dc4a.js');
-const component = require('./component-4e1d58f5.js');
-const resources = require('./resources-02947c97.js');
-require('./guid-2226c6f0.js');
-require('./resources-9b9f36a7.js');
-require('./config-f2faa27d.js');
-require('./browser-e784e39b.js');
-require('./key-ec486ff6.js');
+const index = require('./index-64d17a9a.js');
+const dom = require('./dom-a0cf752d.js');
+const focusTrapComponent = require('./focusTrapComponent-7de6a293.js');
+const loadable = require('./loadable-7a282ee2.js');
+const observers = require('./observers-da02358c.js');
+const openCloseComponent = require('./openCloseComponent-6d9ca0a6.js');
+const locale = require('./locale-eeba6ce3.js');
+const t9n = require('./t9n-7d924b32.js');
+const component = require('./component-15b9af61.js');
+const resources = require('./resources-6ba5f1fd.js');
+require('./guid-9c91b300.js');
+require('./resources-ae8dbc7a.js');
+require('./config-4152831d.js');
+require('./browser-963457a4.js');
+require('./key-b2babbb1.js');
 
 const CSS = {
     dialog: "dialog",
@@ -120,6 +120,7 @@ const Dialog = class {
         this.description = undefined;
         this.closeDisabled = false;
         this.embedded = false;
+        this.escapeDisabled = false;
         this.heading = undefined;
         this.headingLevel = undefined;
         this.kind = undefined;
@@ -179,11 +180,11 @@ const Dialog = class {
     }
     render() {
         const { description, heading, opened } = this;
-        return (index.h(index.Host, { key: '8a42eeeeab3ee4ecda173ba89645d24ac5680431', "aria-description": description, "aria-label": heading, "aria-modal": dom.toAriaBoolean(this.modal), role: "dialog" }, index.h("div", { key: '8340c99867985bc7fda81dae481753048a4c1604', class: {
+        return (index.h(index.Host, { key: '12f3ccf6a45d9e7e7a41ca14109443aa3ec3c439', "aria-description": description, "aria-label": heading, "aria-modal": dom.toAriaBoolean(this.modal), role: "dialog" }, index.h("div", { key: '08f02ef19ba4324881a3b8e6d1c63246876f4f1b', class: {
                 [CSS.container]: true,
                 [CSS.containerOpen]: opened,
                 [CSS.containerEmbedded]: this.embedded,
-            } }, this.modal ? (index.h("calcite-scrim", { class: CSS.scrim, onClick: this.handleOutsideClose })) : null, index.h("div", { key: '4a122530b1dab0f05e2e2d3c615a7ce87c01b8b6', class: CSS.dialog, ref: this.setTransitionEl }, index.h("slot", { key: 'f776421bfbf6a2a57b66f4ce0e333e194a633f83', name: SLOTS.content }, index.h("calcite-panel", { key: '4fc04c9e909cbf5318e19019297974e167b80fdd', beforeClose: this.beforeClose, class: CSS.panel, closable: !this.closeDisabled, closed: !opened, description: description, heading: heading, headingLevel: this.headingLevel, loading: this.loading, menuOpen: this.menuOpen, messageOverrides: this.messageOverrides, onCalcitePanelClose: this.handleCloseClick, onCalcitePanelScroll: this.handleScroll, overlayPositioning: this.overlayPositioning, ref: (el) => (this.panelEl = el), scale: this.scale }, index.h("slot", { key: 'c7baf471071a25bb55f23b6c22e3c0f2bd226549', name: SLOTS.actionBar, slot: resources.SLOTS.actionBar }), index.h("slot", { key: '45288a61839638b012b97e77b7ef770bc3b58db8', name: SLOTS.alerts, slot: resources.SLOTS.alerts }), index.h("slot", { key: 'f6743c0413a73316c07016df0f403789783f812e', name: SLOTS.headerActionsStart, slot: resources.SLOTS.headerActionsStart }), index.h("slot", { key: '20e6b7600012c9082ea8fc40db9c5983dc4dd43e', name: SLOTS.headerActionsEnd, slot: resources.SLOTS.headerActionsEnd }), index.h("slot", { key: '8531aaa1efa444c485244b1f643dfbd2a99531bf', name: SLOTS.headerContent, slot: resources.SLOTS.headerContent }), index.h("slot", { key: 'b25fa45d5157d6f4b18b46595cedce009cb3874e', name: SLOTS.headerMenuActions, slot: resources.SLOTS.headerMenuActions }), index.h("slot", { key: 'c4bf81edc9606b1c8b3b5d923b437bd0f4e3c3d5', name: SLOTS.fab, slot: resources.SLOTS.fab }), index.h("slot", { key: '3ca5302a35fb21976953f59f3d04615f3f364020', name: SLOTS.contentTop, slot: resources.SLOTS.contentTop }), index.h("slot", { key: '720d55b5f9f7efb5f5f47117944405cbe568ff64', name: SLOTS.contentBottom, slot: resources.SLOTS.contentBottom }), index.h("slot", { key: 'a69b899e6d0347ad7919ca75e51d3e62c5b0e69e', name: SLOTS.footerStart, slot: resources.SLOTS.footerStart }), index.h("slot", { key: 'ae943f8882d5e6576c72b9b662f3340c5d7496e8', name: SLOTS.footer, slot: resources.SLOTS.footer }), index.h("slot", { key: '2fd6916694ec9547541544cebdbbc75555d17a5f', name: SLOTS.footerEnd, slot: resources.SLOTS.footerEnd }), index.h("div", { key: '812f15f76eb55f8975c83cd135ab62a8597189be', class: CSS.content }, index.h("slot", { key: 'cf266d71f207f274e13234ce2c557f6808d82949' }))))))));
+            } }, this.modal ? (index.h("calcite-scrim", { class: CSS.scrim, onClick: this.handleOutsideClose })) : null, index.h("div", { key: 'e70ef431d5c7c6facd5e4e05f0c4eed140f5b53d', class: CSS.dialog, ref: this.setTransitionEl }, index.h("slot", { key: '88c15e89e4e92a59f81d6b502ffd922c6477b111', name: SLOTS.content }, index.h("calcite-panel", { key: 'e6d392341322729e203ab2ab10860c06b1e970dd', beforeClose: this.beforeClose, class: CSS.panel, closable: !this.closeDisabled, closed: !opened, description: description, heading: heading, headingLevel: this.headingLevel, loading: this.loading, menuOpen: this.menuOpen, messageOverrides: this.messageOverrides, onCalcitePanelClose: this.handleCloseClick, onCalcitePanelScroll: this.handleScroll, overlayPositioning: this.overlayPositioning, ref: (el) => (this.panelEl = el), scale: this.scale }, index.h("slot", { key: '9b559410abfc4925d51874980cd452a829489add', name: SLOTS.actionBar, slot: resources.SLOTS.actionBar }), index.h("slot", { key: '9b72d8fd4d52404d071610885602aeec48d7f1ea', name: SLOTS.alerts, slot: resources.SLOTS.alerts }), index.h("slot", { key: '8f072df13ff7e9cdf1b4d2e6a881a9a8b5a16411', name: SLOTS.headerActionsStart, slot: resources.SLOTS.headerActionsStart }), index.h("slot", { key: 'dcb78aec1413c2f41374159635f2cdbebfdc3ace', name: SLOTS.headerActionsEnd, slot: resources.SLOTS.headerActionsEnd }), index.h("slot", { key: '96235f7b354be88ef7f43eccb6c7d7c843f7809c', name: SLOTS.headerContent, slot: resources.SLOTS.headerContent }), index.h("slot", { key: '91186896b9265b76a125fac041ef298bd11d10c6', name: SLOTS.headerMenuActions, slot: resources.SLOTS.headerMenuActions }), index.h("slot", { key: '750aad9563e917b791b7f816ec84b6a9a12561aa', name: SLOTS.fab, slot: resources.SLOTS.fab }), index.h("slot", { key: 'd8e38ab1981888ca6619bad422e1fed4625146be', name: SLOTS.contentTop, slot: resources.SLOTS.contentTop }), index.h("slot", { key: 'eb6ffd94278c2de6bd38a0f537cff4d45e038ad1', name: SLOTS.contentBottom, slot: resources.SLOTS.contentBottom }), index.h("slot", { key: 'cd3c6b1f4bf2c5878db9802c4102a56b9f00402c', name: SLOTS.footerStart, slot: resources.SLOTS.footerStart }), index.h("slot", { key: 'dbae4847ba84c5e7cc9711667677ce18ecb3f0cf', name: SLOTS.footer, slot: resources.SLOTS.footer }), index.h("slot", { key: '768690842182eccde3555a426810da2966ff2f60', name: SLOTS.footerEnd, slot: resources.SLOTS.footerEnd }), index.h("div", { key: '271647d23ad2456a4805a62f25ebf5ac6f1e68cf', class: CSS.content }, index.h("slot", { key: 'b025541b7227de7a80d4d53f393af3c00aa56b2e' }))))))));
     }
     effectiveLocaleChange() {
         t9n.updateMessages(this, this.effectiveLocale);
@@ -194,7 +195,7 @@ const Dialog = class {
     //
     //--------------------------------------------------------------------------
     handleEscape(event) {
-        if (this.open && event.key === "Escape" && !event.defaultPrevented) {
+        if (this.open && !this.escapeDisabled && event.key === "Escape" && !event.defaultPrevented) {
             this.open = false;
             event.preventDefault();
         }

package/dist/cjs/calcite-dialog.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"calcite-dialog.entry.cjs.js","mappings":"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","names":["createObserver","setUpMessages","setUpLoadableComponent","setComponentLoaded","connectLocalized","connectMessages","connectFocusTrap","deactivateFocusTrap","disconnectLocalized","disconnectMessages","h","Host","toAriaBoolean","PANEL_SLOTS","updateMessages","componentFocusable","focusFirstTabbable","updateFocusTrapElements","activateFocusTrap","onToggleOpenCloseComponent","componentOnReady"],"sources":["src/components/dialog/resources.ts","src/components/dialog/dialog.scss?tag=calcite-dialog&encapsulation=shadow","src/components/dialog/dialog.tsx"],"sourcesContent":["import { DialogPlacement } from \"./interfaces\";\n\nexport const CSS = {\n  dialog: \"dialog\",\n  panel: \"panel\",\n  scrim: \"scrim\",\n  container: \"container\",\n  containerOpen: \"container--open\",\n  containerEmbedded: \"container--embedded\",\n  content: \"content\",\n\n  // these classes help apply the animation in phases to only set transform on open/close\n  // this helps avoid a positioning issue for any floating-ui-owning children\n  openingIdle: \"dialog--opening-idle\",\n  openingActive: \"dialog--opening-active\",\n  closingIdle: \"dialog--closing-idle\",\n  closingActive: \"dialog--closing-active\",\n};\n\nexport const SLOTS = {\n  actionBar: \"action-bar\",\n  alerts: \"alerts\",\n  content: \"content\",\n  contentTop: \"content-top\",\n  contentBottom: \"content-bottom\",\n  headerActionsStart: \"header-actions-start\",\n  headerActionsEnd: \"header-actions-end\",\n  headerMenuActions: \"header-menu-actions\",\n  headerContent: \"header-content\",\n  fab: \"fab\",\n  footer: \"footer\",\n  footerStart: \"footer-start\",\n  footerEnd: \"footer-end\",\n};\n\nexport const dialogPlacements: DialogPlacement[] = [\n  \"top\",\n  \"top-start\",\n  \"top-end\",\n  \"bottom\",\n  \"bottom-start\",\n  \"bottom-end\",\n  \"cover\",\n  \"center\",\n];\n","/**\n * CSS Custom Properties\n *\n * These properties can be overridden using the component's tag as selector.\n *\n * @prop --calcite-dialog-scrim-background-color: Specifies the background color of the component's scrim.\n * @prop --calcite-dialog-size-x: Specifies the width of the component, using `px`, `em`, `rem`, `vw`, or `%`. Does not exceed the viewport's width - applies when `placement=\"cover\"` is set.\n * @prop --calcite-dialog-size-y: Specifies the height of the component, using `px`, `em`, `rem`, `vh`, or `%`. Does not exceed the viewport's height - applies when `placement=\"cover\"` is set.\n * @prop --calcite-dialog-content-space: Specifies the padding of the component's content.\n * @prop --calcite-dialog-footer-space: Specifies the padding of the component's footer.\n * @prop --calcite-dialog-border-color: Specifies the component's border color.\n * @prop --calcite-dialog-offset-x: Specifies the horizontal offset of the component.\n * @prop --calcite-dialog-offset-y: Specifies the vertical offset of the component.\n */\n\n:host {\n  // the dialog should always use a dark scrim, regardless of light / dark mode - matches value in global.scss\n  --calcite-dialog-scrim-background-color: #{rgba($calcite-color-neutral-blk-240, $calcite-opacity-85)};\n  @apply flex\n    inset-0\n    z-overlay\n    pointer-events-none;\n}\n\n:host([modal]) {\n  @apply absolute;\n}\n\n.container {\n  @apply text-color-2\n    pointer-events-auto\n    fixed\n    inset-0\n    flex\n    items-center\n    justify-center\n    overflow-y-hidden\n    opacity-0\n    z-overlay;\n  visibility: hidden;\n  transition:\n    visibility 0ms linear var(--calcite-internal-animation-timing-slow),\n    opacity var(--calcite-internal-animation-timing-slow) $easing-function;\n}\n\n:host([placement=\"top\"]) .container {\n  @apply justify-center\n    items-start;\n}\n\n:host([placement=\"top-start\"]) .container {\n  @apply justify-start\n    items-start;\n}\n\n:host([placement=\"top-end\"]) .container {\n  @apply justify-end\n    items-start;\n}\n\n:host([placement=\"bottom\"]) .container {\n  @apply justify-center\n    items-end;\n}\n\n:host([placement=\"bottom-start\"]) .container {\n  @apply justify-start\n    items-end;\n}\n\n:host([placement=\"bottom-end\"]) .container {\n  @apply justify-end\n    items-end;\n}\n\n:host(:not([modal])) .container {\n  @apply pointer-events-none;\n}\n\n:host([scale=\"s\"]) {\n  --calcite-internal-dialog-content-padding: var(--calcite-spacing-sm);\n  --calcite-internal-dialog-padding: theme(\"spacing.3\");\n  --calcite-internal-dialog-padding-large: theme(\"spacing.4\");\n  --calcite-internal-dialog-title-text: theme(\"fontSize.1h\");\n  --calcite-internal-dialog-content-text: theme(\"fontSize.n1\");\n}\n\n:host([scale=\"m\"]) {\n  --calcite-internal-dialog-content-padding: var(--calcite-spacing-md);\n  --calcite-internal-dialog-padding: theme(\"spacing.4\");\n  --calcite-internal-dialog-padding-large: theme(\"spacing.5\");\n  --calcite-internal-dialog-title-text: theme(\"fontSize.2h\");\n  --calcite-internal-dialog-content-text: theme(\"fontSize.0\");\n}\n\n:host([scale=\"l\"]) {\n  --calcite-internal-dialog-content-padding: var(--calcite-spacing-lg);\n  --calcite-internal-dialog-padding: theme(\"spacing.5\");\n  --calcite-internal-dialog-padding-large: theme(\"spacing.6\");\n  --calcite-internal-dialog-title-text: theme(\"fontSize.3h\");\n  --calcite-internal-dialog-content-text: theme(\"fontSize.1\");\n}\n\n.scrim {\n  // todo: remove once https://github.com/Esri/calcite-design-system/pull/9816 is merged\n  --calcite-scrim-background: var(--calcite-dialog-scrim-background-color, var(--calcite-color-transparent-scrim));\n  --calcite-scrim-background-color: var(\n    --calcite-dialog-scrim-background-color,\n    var(--calcite-color-transparent-scrim)\n  );\n  @apply fixed\n    inset-0\n    flex\n    overflow-y-hidden;\n}\n\ncalcite-panel {\n  --calcite-panel-footer-padding: var(--calcite-dialog-footer-space);\n  --calcite-panel-header-border-block-end: var(--calcite-border-width-sm) solid var(--calcite-dialog-border-color);\n}\n\n.content {\n  padding: var(--calcite-dialog-content-space, var(--calcite-internal-dialog-content-padding));\n}\n\n.dialog {\n  @apply pointer-events-none\n    float-none\n    m-6\n    box-border\n    flex\n    w-full\n    flex-col\n    opacity-0\n    shadow-2-sm\n    z-modal\n    rounded\n    relative;\n  -webkit-overflow-scrolling: touch;\n  visibility: hidden;\n  transition:\n    transform var(--calcite-internal-animation-timing-slow) $easing-function,\n    visibility 0ms linear var(--calcite-internal-animation-timing-slow),\n    opacity var(--calcite-internal-animation-timing-slow) $easing-function;\n\n  --calcite-internal-dialog-hidden-position: translate3d(0, 20px, 0);\n  --calcite-internal-dialog-shown-position: translate3d(0, 0, 0);\n\n  inset-inline-start: var(--calcite-dialog-offset-x);\n  inset-block-start: var(--calcite-dialog-offset-y);\n\n  &--opening {\n    &-idle {\n      transform: var(--calcite-internal-dialog-hidden-position);\n    }\n    &-active {\n      transform: var(--calcite-internal-dialog-shown-position);\n    }\n  }\n\n  &--closing {\n    &-idle {\n      transform: var(--calcite-internal-dialog-shown-position);\n    }\n    &-active {\n      transform: var(--calcite-internal-dialog-hidden-position);\n    }\n  }\n}\n\n:host([menu-open]) .dialog {\n  transition:\n    visibility 0ms linear var(--calcite-internal-animation-timing-slow),\n    opacity var(--calcite-internal-animation-timing-slow) $easing-function;\n}\n\n.panel {\n  @apply rounded;\n}\n\n.container--open {\n  @apply opacity-100;\n  visibility: visible;\n  transition-delay: 0ms;\n  .dialog {\n    @apply pointer-events-auto\n      visible\n      opacity-100;\n    transition:\n      transform var(--calcite-internal-animation-timing-slow) $easing-function,\n      visibility 0ms linear,\n      opacity var(--calcite-internal-animation-timing-slow) $easing-function,\n      max-inline-size var(--calcite-internal-animation-timing-slow) $easing-function,\n      max-block-size var(--calcite-internal-animation-timing-slow) $easing-function;\n    transition-delay: 0ms;\n  }\n}\n\n/**\n * Sizes\n */\n@mixin dialog-size($size, $width) {\n  :host([width-scale=\"#{$size}\"]) .dialog {\n    @apply max-h-full\n      max-w-full;\n    inline-size: var(--calcite-dialog-size-x, $width);\n    block-size: var(--calcite-dialog-size-y, auto);\n  }\n\n  @media screen and (max-width: $width + 2 * $baseline) {\n    :host([width-scale=\"#{$size}\"]) {\n      .dialog {\n        @apply m-0\n          h-full\n          max-h-full\n          w-full\n          max-w-full;\n      }\n    }\n  }\n}\n\n:host([width=\"small\"]) .dialog {\n  @apply w-auto;\n}\n\n@include dialog-size(\"s\", 32rem);\n@include dialog-size(\"m\", 48rem);\n@include dialog-size(\"l\", 94rem);\n\n/**\n * placement=\"cover\"\n */\n:host([placement=\"cover\"]) {\n  .dialog {\n    @apply m-0\n      max-h-full\n      max-w-full\n      h-full\n      w-full\n      rounded-none;\n    --calcite-internal-dialog-hidden-position: translate3D(0, 20px, 0) scale(0.95);\n    --calcite-internal-dialog-shown-position: translate3D(0, 0, 0) scale(1);\n  }\n  .panel {\n    @apply rounded-none;\n  }\n}\n\n/**\n * Kinds\n */\n:host([kind]) .panel {\n  @apply rounded-t-none;\n}\n:host([kind=\"brand\"]) .dialog {\n  @apply border-color-brand;\n}\n\n:host([kind=\"danger\"]) .dialog {\n  @apply border-color-danger;\n}\n\n:host([kind=\"info\"]) .dialog {\n  @apply border-color-info;\n}\n\n:host([kind=\"success\"]) .dialog {\n  @apply border-color-success;\n}\n\n:host([kind=\"warning\"]) .dialog {\n  @apply border-color-warning;\n}\n\n:host([kind=\"brand\"][open]),\n:host([kind=\"danger\"][open]),\n:host([kind=\"info\"][open]),\n:host([kind=\"success\"][open]),\n:host([kind=\"warning\"][open]) {\n  .dialog {\n    @apply border-0\n      border-t-4\n      border-solid;\n  }\n}\n\n.container--embedded {\n  position: absolute;\n  pointer-events: auto;\n  calcite-scrim {\n    position: absolute;\n  }\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport { focusFirstTabbable, toAriaBoolean } from \"../../utils/dom\";\nimport {\n  activateFocusTrap,\n  connectFocusTrap,\n  deactivateFocusTrap,\n  FocusTrap,\n  FocusTrapComponent,\n  updateFocusTrapElements,\n} from \"../../utils/focusTrapComponent\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { createObserver } from \"../../utils/observers\";\nimport { onToggleOpenCloseComponent, OpenCloseComponent } from \"../../utils/openCloseComponent\";\nimport { Kind, Scale } from \"../interfaces\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { componentOnReady } from \"../../utils/component\";\nimport { SLOTS as PANEL_SLOTS } from \"../panel/resources\";\nimport { HeadingLevel } from \"../functional/Heading\";\nimport { OverlayPositioning } from \"../../components\";\nimport { DialogMessages } from \"./assets/dialog/t9n\";\nimport { CSS, SLOTS } from \"./resources\";\nimport { DialogPlacement } from \"./interfaces\";\n\nlet totalOpenDialogs: number = 0;\nlet initialDocumentOverflowStyle: string = \"\";\n\n/**\n * @slot - A slot for adding content.\n * @slot content - A slot for adding custom content.\n * @slot action-bar - A slot for adding a `calcite-action-bar` to the component.\n * @slot alerts - A slot for adding `calcite-alert`s to the component.\n * @slot content-bottom - A slot for adding content below the unnamed (default) slot and - if populated - the `footer` slot.\n * @slot content-top - A slot for adding content above the unnamed (default) slot and - if populated - below the `action-bar` slot.\n * @slot header-actions-start - A slot for adding actions or content to the starting side of the component's header.\n * @slot header-actions-end - A slot for adding actions or content to the ending side of the component's header.\n * @slot header-content - A slot for adding custom content to the component's header.\n * @slot header-menu-actions - A slot for adding an overflow menu with actions inside a `calcite-dropdown`.\n * @slot fab - A slot for adding a `calcite-fab` (floating action button) to perform an action.\n * @slot footer - A slot for adding custom content to the component's footer. Should not be used with the `\"footer-start\"` or `\"footer-end\"` slots.\n * @slot footer-end - A slot for adding a trailing footer custom content. Should not be used with the `\"footer\"` slot.\n * @slot footer-start - A slot for adding a leading footer custom content. Should not be used with the `\"footer\"` slot.\n */\n\n@Component({\n  tag: \"calcite-dialog\",\n  styleUrl: \"dialog.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class Dialog\n  implements\n    OpenCloseComponent,\n    FocusTrapComponent,\n    LoadableComponent,\n    LocalizedComponent,\n    T9nComponent\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** Passes a function to run before the component closes. */\n  @Prop() beforeClose: () => Promise<void>;\n\n  /** A description for the component. */\n  @Prop() description: string;\n\n  /** When `true`, disables the component's close button. */\n  @Prop({ reflect: true }) closeDisabled = false;\n\n  /**\n   * This internal property, managed by a containing calcite-shell, is used\n   * to inform the component if special configuration or styles are needed\n   *\n   * @internal\n   */\n  @Prop({ mutable: true }) embedded = false;\n\n  /**\n   * The component header text.\n   */\n  @Prop() heading: string;\n\n  /**\n   * Specifies the heading level of the component's `heading` for proper document structure, without affecting visual styling.\n   */\n  @Prop({ reflect: true }) headingLevel: HeadingLevel;\n\n  /** Specifies the kind of the component, which will style the top border. */\n  @Prop({ reflect: true }) kind: Extract<\"brand\" | \"danger\" | \"info\" | \"success\" | \"warning\", Kind>;\n\n  /**\n   * When `true`, a busy indicator is displayed.\n   */\n  @Prop({ reflect: true }) loading = false;\n\n  /**\n   * When `true`, the action menu items in the `header-menu-actions` slot are open.\n   */\n  @Prop({ reflect: true }) menuOpen = false;\n\n  /**\n   * Made into a prop for testing purposes only\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: DialogMessages;\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<DialogMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  /** When `true`, displays a scrim blocking interaction underneath the component.  */\n  @Prop({ reflect: true }) modal = false;\n\n  @Watch(\"modal\")\n  onModalChange(): void {\n    this.updateOverflowHiddenClass();\n  }\n\n  /** When `true`, displays and positions the component. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /** When `true`, disables the closing of the component when clicked outside. */\n  @Prop({ reflect: true }) outsideCloseDisabled = false;\n\n  /**\n   * Determines the type of positioning to use for the overlaid content.\n   *\n   * Using `\"absolute\"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.\n   *\n   * `\"fixed\"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `\"fixed\"`.\n   *\n   */\n  @Prop({ reflect: true }) overlayPositioning: OverlayPositioning = \"absolute\";\n\n  /**\n   * Specifies the placement of the dialog.\n   */\n  @Prop({ reflect: true }) placement: DialogPlacement = \"center\";\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /** Specifies the width of the component. */\n  @Prop({ reflect: true }) widthScale: Scale = \"m\";\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  async componentWillLoad(): Promise<void> {\n    await setUpMessages(this);\n    setUpLoadableComponent(this);\n    // when dialog initially renders, if active was set we need to open as watcher doesn't fire\n    if (this.open) {\n      this.openDialog();\n    }\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  connectedCallback(): void {\n    this.mutationObserver?.observe(this.el, { childList: true, subtree: true });\n    connectLocalized(this);\n    connectMessages(this);\n    connectFocusTrap(this);\n  }\n\n  disconnectedCallback(): void {\n    this.removeOverflowHiddenClass();\n    this.mutationObserver?.disconnect();\n    deactivateFocusTrap(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n    this.embedded = false;\n  }\n\n  render(): VNode {\n    const { description, heading, opened } = this;\n    return (\n      <Host\n        aria-description={description}\n        aria-label={heading}\n        aria-modal={toAriaBoolean(this.modal)}\n        role=\"dialog\"\n      >\n        <div\n          class={{\n            [CSS.container]: true,\n            [CSS.containerOpen]: opened,\n            [CSS.containerEmbedded]: this.embedded,\n          }}\n        >\n          {this.modal ? (\n            <calcite-scrim class={CSS.scrim} onClick={this.handleOutsideClose} />\n          ) : null}\n          <div class={CSS.dialog} ref={this.setTransitionEl}>\n            <slot name={SLOTS.content}>\n              <calcite-panel\n                beforeClose={this.beforeClose}\n                class={CSS.panel}\n                closable={!this.closeDisabled}\n                closed={!opened}\n                description={description}\n                heading={heading}\n                headingLevel={this.headingLevel}\n                loading={this.loading}\n                menuOpen={this.menuOpen}\n                messageOverrides={this.messageOverrides}\n                onCalcitePanelClose={this.handleCloseClick}\n                onCalcitePanelScroll={this.handleScroll}\n                overlayPositioning={this.overlayPositioning}\n                ref={(el) => (this.panelEl = el)}\n                scale={this.scale}\n              >\n                <slot name={SLOTS.actionBar} slot={PANEL_SLOTS.actionBar} />\n                <slot name={SLOTS.alerts} slot={PANEL_SLOTS.alerts} />\n                <slot name={SLOTS.headerActionsStart} slot={PANEL_SLOTS.headerActionsStart} />\n                <slot name={SLOTS.headerActionsEnd} slot={PANEL_SLOTS.headerActionsEnd} />\n                <slot name={SLOTS.headerContent} slot={PANEL_SLOTS.headerContent} />\n                <slot name={SLOTS.headerMenuActions} slot={PANEL_SLOTS.headerMenuActions} />\n                <slot name={SLOTS.fab} slot={PANEL_SLOTS.fab} />\n                <slot name={SLOTS.contentTop} slot={PANEL_SLOTS.contentTop} />\n                <slot name={SLOTS.contentBottom} slot={PANEL_SLOTS.contentBottom} />\n                <slot name={SLOTS.footerStart} slot={PANEL_SLOTS.footerStart} />\n                <slot name={SLOTS.footer} slot={PANEL_SLOTS.footer} />\n                <slot name={SLOTS.footerEnd} slot={PANEL_SLOTS.footerEnd} />\n                <div class={CSS.content}>\n                  <slot />\n                </div>\n              </calcite-panel>\n            </slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Properties/ State\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteDialogElement;\n\n  @State() opened = false;\n\n  @State() hasFooter = true;\n\n  @State() hasContentTop = false;\n\n  @State() hasContentBottom = false;\n\n  @State() effectiveLocale: string;\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() defaultMessages: DialogMessages;\n\n  openTransitionProp = \"opacity\";\n\n  transitionEl: HTMLDivElement;\n\n  focusTrap: FocusTrap;\n\n  private panelEl: HTMLCalcitePanelElement;\n\n  private ignoreOpenChange = false;\n\n  private mutationObserver: MutationObserver = createObserver(\"mutation\", () =>\n    this.handleMutationObserver(),\n  );\n\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"keydown\", { target: \"window\" })\n  handleEscape(event: KeyboardEvent): void {\n    if (this.open && event.key === \"Escape\" && !event.defaultPrevented) {\n      this.open = false;\n      event.preventDefault();\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n  /** Fires when the component is requested to be closed and before the closing transition begins. */\n  @Event({ cancelable: false }) calciteDialogBeforeClose: EventEmitter<void>;\n\n  /** Fires when the component is closed and animation is complete. */\n  @Event({ cancelable: false }) calciteDialogClose: EventEmitter<void>;\n\n  /** Fires when the component is added to the DOM but not rendered, and before the opening transition begins. */\n  @Event({ cancelable: false }) calciteDialogBeforeOpen: EventEmitter<void>;\n\n  /** Fires when the component is open and animation is complete. */\n  @Event({ cancelable: false }) calciteDialogOpen: EventEmitter<void>;\n\n  /** Fires when the content is scrolled. */\n  @Event({ cancelable: false }) calciteDialogScroll: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Sets focus on the component's \"close\" button (the first focusable item).\n   *\n   * @returns {Promise<void>} - A promise that is resolved when the operation has completed.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    return this.panelEl?.setFocus() ?? focusFirstTabbable(this.el);\n  }\n\n  /**\n   * Updates the element(s) that are used within the focus-trap of the component.\n   */\n  @Method()\n  async updateFocusTrapElements(): Promise<void> {\n    updateFocusTrapElements(this);\n  }\n\n  /**\n   * Scrolls the component's content to a specified set of coordinates.\n   *\n   * @example\n   * myCalciteFlowItem.scrollContentTo({\n   *   left: 0, // Specifies the number of pixels along the X axis to scroll the window or element.\n   *   top: 0, // Specifies the number of pixels along the Y axis to scroll the window or element\n   *   behavior: \"auto\" // Specifies whether the scrolling should animate smoothly (smooth), or happen instantly in a single jump (auto, the default value).\n   * });\n   * @param options - allows specific coordinates to be defined.\n   * @returns - promise that resolves once the content is scrolled to.\n   */\n  @Method()\n  async scrollContentTo(options?: ScrollToOptions): Promise<void> {\n    await this.panelEl?.scrollContentTo(options);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  onBeforeOpen(): void {\n    this.transitionEl.classList.add(CSS.openingActive);\n    this.calciteDialogBeforeOpen.emit();\n  }\n\n  onOpen(): void {\n    this.transitionEl.classList.remove(CSS.openingIdle, CSS.openingActive);\n    this.calciteDialogOpen.emit();\n    activateFocusTrap(this);\n  }\n\n  onBeforeClose(): void {\n    this.transitionEl.classList.add(CSS.closingActive);\n    this.calciteDialogBeforeClose.emit();\n  }\n\n  onClose(): void {\n    this.transitionEl.classList.remove(CSS.closingIdle, CSS.closingActive);\n    this.calciteDialogClose.emit();\n    deactivateFocusTrap(this);\n  }\n\n  @Watch(\"open\")\n  toggleDialog(value: boolean): void {\n    if (this.ignoreOpenChange) {\n      return;\n    }\n\n    if (value) {\n      this.openDialog();\n    } else {\n      this.closeDialog();\n    }\n  }\n\n  @Watch(\"opened\")\n  handleOpenedChange(value: boolean): void {\n    const idleClass = value ? CSS.openingIdle : CSS.closingIdle;\n    this.transitionEl.classList.add(idleClass);\n    onToggleOpenCloseComponent(this);\n  }\n\n  private setTransitionEl = (el: HTMLDivElement): void => {\n    this.transitionEl = el;\n  };\n\n  private openEnd = (): void => {\n    this.setFocus();\n    this.el.removeEventListener(\"calciteDialogOpen\", this.openEnd);\n  };\n\n  private handleScroll = (): void => {\n    this.calciteDialogScroll.emit();\n  };\n\n  private handleCloseClick = () => {\n    this.open = false;\n  };\n\n  private async openDialog(): Promise<void> {\n    await componentOnReady(this.el);\n    this.el.addEventListener(\"calciteDialogOpen\", this.openEnd);\n    this.opened = true;\n    this.updateOverflowHiddenClass();\n  }\n\n  private handleOutsideClose = (): void => {\n    if (this.outsideCloseDisabled) {\n      return;\n    }\n\n    this.open = false;\n  };\n\n  private closeDialog = async (): Promise<void> => {\n    if (this.beforeClose) {\n      try {\n        await this.beforeClose();\n      } catch (_error) {\n        // close prevented\n        requestAnimationFrame(() => {\n          this.ignoreOpenChange = true;\n          this.open = true;\n          this.ignoreOpenChange = false;\n        });\n        return;\n      }\n    }\n\n    totalOpenDialogs--;\n    this.opened = false;\n    this.updateOverflowHiddenClass();\n  };\n\n  private updateOverflowHiddenClass = (): void => {\n    this.opened && !this.embedded && this.modal\n      ? this.addOverflowHiddenClass()\n      : this.removeOverflowHiddenClass();\n  };\n\n  private addOverflowHiddenClass(): void {\n    if (totalOpenDialogs === 0) {\n      initialDocumentOverflowStyle = document.documentElement.style.overflow;\n    }\n\n    totalOpenDialogs++;\n    // use an inline style instead of a utility class to avoid global class declarations.\n    document.documentElement.style.setProperty(\"overflow\", \"hidden\");\n  }\n\n  private removeOverflowHiddenClass(): void {\n    document.documentElement.style.setProperty(\"overflow\", initialDocumentOverflowStyle);\n  }\n\n  private handleMutationObserver = (): void => {\n    this.updateFocusTrapElements();\n  };\n}\n"],"version":3}
+{"file":"calcite-dialog.entry.cjs.js","mappings":"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","names":["createObserver","setUpMessages","setUpLoadableComponent","setComponentLoaded","connectLocalized","connectMessages","connectFocusTrap","deactivateFocusTrap","disconnectLocalized","disconnectMessages","h","Host","toAriaBoolean","PANEL_SLOTS","updateMessages","componentFocusable","focusFirstTabbable","updateFocusTrapElements","activateFocusTrap","onToggleOpenCloseComponent","componentOnReady"],"sources":["src/components/dialog/resources.ts","src/components/dialog/dialog.scss?tag=calcite-dialog&encapsulation=shadow","src/components/dialog/dialog.tsx"],"sourcesContent":["import { DialogPlacement } from \"./interfaces\";\n\nexport const CSS = {\n  dialog: \"dialog\",\n  panel: \"panel\",\n  scrim: \"scrim\",\n  container: \"container\",\n  containerOpen: \"container--open\",\n  containerEmbedded: \"container--embedded\",\n  content: \"content\",\n\n  // these classes help apply the animation in phases to only set transform on open/close\n  // this helps avoid a positioning issue for any floating-ui-owning children\n  openingIdle: \"dialog--opening-idle\",\n  openingActive: \"dialog--opening-active\",\n  closingIdle: \"dialog--closing-idle\",\n  closingActive: \"dialog--closing-active\",\n};\n\nexport const SLOTS = {\n  actionBar: \"action-bar\",\n  alerts: \"alerts\",\n  content: \"content\",\n  contentTop: \"content-top\",\n  contentBottom: \"content-bottom\",\n  headerActionsStart: \"header-actions-start\",\n  headerActionsEnd: \"header-actions-end\",\n  headerMenuActions: \"header-menu-actions\",\n  headerContent: \"header-content\",\n  fab: \"fab\",\n  footer: \"footer\",\n  footerStart: \"footer-start\",\n  footerEnd: \"footer-end\",\n};\n\nexport const dialogPlacements: DialogPlacement[] = [\n  \"top\",\n  \"top-start\",\n  \"top-end\",\n  \"bottom\",\n  \"bottom-start\",\n  \"bottom-end\",\n  \"cover\",\n  \"center\",\n];\n","/**\n * CSS Custom Properties\n *\n * These properties can be overridden using the component's tag as selector.\n *\n * @prop --calcite-dialog-scrim-background-color: Specifies the background color of the component's scrim.\n * @prop --calcite-dialog-size-x: Specifies the width of the component, using `px`, `em`, `rem`, `vw`, or `%`. Does not exceed the viewport's width - applies when `placement=\"cover\"` is set.\n * @prop --calcite-dialog-size-y: Specifies the height of the component, using `px`, `em`, `rem`, `vh`, or `%`. Does not exceed the viewport's height - applies when `placement=\"cover\"` is set.\n * @prop --calcite-dialog-content-space: Specifies the padding of the component's content.\n * @prop --calcite-dialog-footer-space: Specifies the padding of the component's footer.\n * @prop --calcite-dialog-border-color: Specifies the component's border color.\n * @prop --calcite-dialog-offset-x: Specifies the horizontal offset of the component.\n * @prop --calcite-dialog-offset-y: Specifies the vertical offset of the component.\n */\n\n:host {\n  // the dialog should always use a dark scrim, regardless of light / dark mode - matches value in global.scss\n  --calcite-dialog-scrim-background-color: #{rgba($calcite-color-neutral-blk-240, $calcite-opacity-85)};\n  @apply flex\n    inset-0\n    z-overlay\n    pointer-events-none;\n}\n\n:host([modal]) {\n  @apply absolute;\n}\n\n.container {\n  @apply text-color-2\n    pointer-events-auto\n    fixed\n    inset-0\n    flex\n    items-center\n    justify-center\n    overflow-y-hidden\n    opacity-0\n    z-overlay;\n  visibility: hidden;\n  transition:\n    visibility 0ms linear var(--calcite-internal-animation-timing-slow),\n    opacity var(--calcite-internal-animation-timing-slow) $easing-function;\n}\n\n:host([placement=\"top\"]) .container {\n  @apply justify-center\n    items-start;\n}\n\n:host([placement=\"top-start\"]) .container {\n  @apply justify-start\n    items-start;\n}\n\n:host([placement=\"top-end\"]) .container {\n  @apply justify-end\n    items-start;\n}\n\n:host([placement=\"bottom\"]) .container {\n  @apply justify-center\n    items-end;\n}\n\n:host([placement=\"bottom-start\"]) .container {\n  @apply justify-start\n    items-end;\n}\n\n:host([placement=\"bottom-end\"]) .container {\n  @apply justify-end\n    items-end;\n}\n\n:host(:not([modal])) .container {\n  @apply pointer-events-none;\n}\n\n:host([scale=\"s\"]) {\n  --calcite-internal-dialog-content-padding: var(--calcite-spacing-sm);\n  --calcite-internal-dialog-padding: theme(\"spacing.3\");\n  --calcite-internal-dialog-padding-large: theme(\"spacing.4\");\n  --calcite-internal-dialog-title-text: theme(\"fontSize.1h\");\n  --calcite-internal-dialog-content-text: theme(\"fontSize.n1\");\n}\n\n:host([scale=\"m\"]) {\n  --calcite-internal-dialog-content-padding: var(--calcite-spacing-md);\n  --calcite-internal-dialog-padding: theme(\"spacing.4\");\n  --calcite-internal-dialog-padding-large: theme(\"spacing.5\");\n  --calcite-internal-dialog-title-text: theme(\"fontSize.2h\");\n  --calcite-internal-dialog-content-text: theme(\"fontSize.0\");\n}\n\n:host([scale=\"l\"]) {\n  --calcite-internal-dialog-content-padding: var(--calcite-spacing-lg);\n  --calcite-internal-dialog-padding: theme(\"spacing.5\");\n  --calcite-internal-dialog-padding-large: theme(\"spacing.6\");\n  --calcite-internal-dialog-title-text: theme(\"fontSize.3h\");\n  --calcite-internal-dialog-content-text: theme(\"fontSize.1\");\n}\n\n.scrim {\n  // todo: remove once https://github.com/Esri/calcite-design-system/pull/9816 is merged\n  --calcite-scrim-background: var(--calcite-dialog-scrim-background-color, var(--calcite-color-transparent-scrim));\n  --calcite-scrim-background-color: var(\n    --calcite-dialog-scrim-background-color,\n    var(--calcite-color-transparent-scrim)\n  );\n  @apply fixed\n    inset-0\n    flex\n    overflow-y-hidden;\n}\n\ncalcite-panel {\n  --calcite-panel-footer-padding: var(--calcite-dialog-footer-space);\n  --calcite-panel-header-border-block-end: var(--calcite-border-width-sm) solid var(--calcite-dialog-border-color);\n}\n\n.content {\n  padding: var(--calcite-dialog-content-space, var(--calcite-internal-dialog-content-padding));\n}\n\n.dialog {\n  @apply pointer-events-none\n    float-none\n    m-6\n    box-border\n    flex\n    w-full\n    flex-col\n    opacity-0\n    shadow-2-sm\n    z-modal\n    rounded\n    relative;\n  -webkit-overflow-scrolling: touch;\n  visibility: hidden;\n  transition:\n    transform var(--calcite-internal-animation-timing-slow) $easing-function,\n    visibility 0ms linear var(--calcite-internal-animation-timing-slow),\n    opacity var(--calcite-internal-animation-timing-slow) $easing-function;\n\n  --calcite-internal-dialog-hidden-position: translate3d(0, 20px, 0);\n  --calcite-internal-dialog-shown-position: translate3d(0, 0, 0);\n\n  inset-inline-start: var(--calcite-dialog-offset-x);\n  inset-block-start: var(--calcite-dialog-offset-y);\n\n  &--opening {\n    &-idle {\n      transform: var(--calcite-internal-dialog-hidden-position);\n    }\n    &-active {\n      transform: var(--calcite-internal-dialog-shown-position);\n    }\n  }\n\n  &--closing {\n    &-idle {\n      transform: var(--calcite-internal-dialog-shown-position);\n    }\n    &-active {\n      transform: var(--calcite-internal-dialog-hidden-position);\n    }\n  }\n}\n\n:host([menu-open]) .dialog {\n  transition:\n    visibility 0ms linear var(--calcite-internal-animation-timing-slow),\n    opacity var(--calcite-internal-animation-timing-slow) $easing-function;\n}\n\n.panel {\n  @apply rounded;\n}\n\n.container--open {\n  @apply opacity-100;\n  visibility: visible;\n  transition-delay: 0ms;\n  .dialog {\n    @apply pointer-events-auto\n      visible\n      opacity-100;\n    transition:\n      transform var(--calcite-internal-animation-timing-slow) $easing-function,\n      visibility 0ms linear,\n      opacity var(--calcite-internal-animation-timing-slow) $easing-function,\n      max-inline-size var(--calcite-internal-animation-timing-slow) $easing-function,\n      max-block-size var(--calcite-internal-animation-timing-slow) $easing-function;\n    transition-delay: 0ms;\n  }\n}\n\n/**\n * Sizes\n */\n@mixin dialog-size($size, $width) {\n  :host([width-scale=\"#{$size}\"]) .dialog {\n    @apply max-h-full\n      max-w-full;\n    inline-size: var(--calcite-dialog-size-x, $width);\n    block-size: var(--calcite-dialog-size-y, auto);\n  }\n\n  @media screen and (max-width: $width + 2 * $baseline) {\n    :host([width-scale=\"#{$size}\"]) {\n      .dialog {\n        @apply m-0\n          h-full\n          max-h-full\n          w-full\n          max-w-full;\n      }\n    }\n  }\n}\n\n:host([width=\"small\"]) .dialog {\n  @apply w-auto;\n}\n\n@include dialog-size(\"s\", 32rem);\n@include dialog-size(\"m\", 48rem);\n@include dialog-size(\"l\", 94rem);\n\n/**\n * placement=\"cover\"\n */\n:host([placement=\"cover\"]) {\n  .dialog {\n    @apply m-0\n      max-h-full\n      max-w-full\n      h-full\n      w-full\n      rounded-none;\n    --calcite-internal-dialog-hidden-position: translate3D(0, 20px, 0) scale(0.95);\n    --calcite-internal-dialog-shown-position: translate3D(0, 0, 0) scale(1);\n  }\n  .panel {\n    @apply rounded-none;\n  }\n}\n\n/**\n * Kinds\n */\n:host([kind]) .panel {\n  @apply rounded-t-none;\n}\n:host([kind=\"brand\"]) .dialog {\n  @apply border-color-brand;\n}\n\n:host([kind=\"danger\"]) .dialog {\n  @apply border-color-danger;\n}\n\n:host([kind=\"info\"]) .dialog {\n  @apply border-color-info;\n}\n\n:host([kind=\"success\"]) .dialog {\n  @apply border-color-success;\n}\n\n:host([kind=\"warning\"]) .dialog {\n  @apply border-color-warning;\n}\n\n:host([kind=\"brand\"][open]),\n:host([kind=\"danger\"][open]),\n:host([kind=\"info\"][open]),\n:host([kind=\"success\"][open]),\n:host([kind=\"warning\"][open]) {\n  .dialog {\n    @apply border-0\n      border-t-4\n      border-solid;\n  }\n}\n\n.container--embedded {\n  position: absolute;\n  pointer-events: auto;\n  calcite-scrim {\n    position: absolute;\n  }\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport { focusFirstTabbable, toAriaBoolean } from \"../../utils/dom\";\nimport {\n  activateFocusTrap,\n  connectFocusTrap,\n  deactivateFocusTrap,\n  FocusTrap,\n  FocusTrapComponent,\n  updateFocusTrapElements,\n} from \"../../utils/focusTrapComponent\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { createObserver } from \"../../utils/observers\";\nimport { onToggleOpenCloseComponent, OpenCloseComponent } from \"../../utils/openCloseComponent\";\nimport { Kind, Scale } from \"../interfaces\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { componentOnReady } from \"../../utils/component\";\nimport { SLOTS as PANEL_SLOTS } from \"../panel/resources\";\nimport { HeadingLevel } from \"../functional/Heading\";\nimport { OverlayPositioning } from \"../../components\";\nimport { DialogMessages } from \"./assets/dialog/t9n\";\nimport { CSS, SLOTS } from \"./resources\";\nimport { DialogPlacement } from \"./interfaces\";\n\nlet totalOpenDialogs: number = 0;\nlet initialDocumentOverflowStyle: string = \"\";\n\n/**\n * @slot - A slot for adding content.\n * @slot content - A slot for adding custom content.\n * @slot action-bar - A slot for adding a `calcite-action-bar` to the component.\n * @slot alerts - A slot for adding `calcite-alert`s to the component.\n * @slot content-bottom - A slot for adding content below the unnamed (default) slot and - if populated - the `footer` slot.\n * @slot content-top - A slot for adding content above the unnamed (default) slot and - if populated - below the `action-bar` slot.\n * @slot header-actions-start - A slot for adding actions or content to the starting side of the component's header.\n * @slot header-actions-end - A slot for adding actions or content to the ending side of the component's header.\n * @slot header-content - A slot for adding custom content to the component's header.\n * @slot header-menu-actions - A slot for adding an overflow menu with actions inside a `calcite-dropdown`.\n * @slot fab - A slot for adding a `calcite-fab` (floating action button) to perform an action.\n * @slot footer - A slot for adding custom content to the component's footer. Should not be used with the `\"footer-start\"` or `\"footer-end\"` slots.\n * @slot footer-end - A slot for adding a trailing footer custom content. Should not be used with the `\"footer\"` slot.\n * @slot footer-start - A slot for adding a leading footer custom content. Should not be used with the `\"footer\"` slot.\n */\n\n@Component({\n  tag: \"calcite-dialog\",\n  styleUrl: \"dialog.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class Dialog\n  implements\n    OpenCloseComponent,\n    FocusTrapComponent,\n    LoadableComponent,\n    LocalizedComponent,\n    T9nComponent\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** Passes a function to run before the component closes. */\n  @Prop() beforeClose: () => Promise<void>;\n\n  /** A description for the component. */\n  @Prop() description: string;\n\n  /** When `true`, disables the component's close button. */\n  @Prop({ reflect: true }) closeDisabled = false;\n\n  /**\n   * This internal property, managed by a containing calcite-shell, is used\n   * to inform the component if special configuration or styles are needed\n   *\n   * @internal\n   */\n  @Prop({ mutable: true }) embedded = false;\n\n  /**\n   * When `true`, disables the default close on escape behavior.\n   *\n   * By default, an open dialog can be dismissed by pressing the Esc key.\n   *\n   * @see [Dialog Accessibility](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog#accessibility)\n   */\n  @Prop({ reflect: true }) escapeDisabled = false;\n\n  /**\n   * The component header text.\n   */\n  @Prop() heading: string;\n\n  /**\n   * Specifies the heading level of the component's `heading` for proper document structure, without affecting visual styling.\n   */\n  @Prop({ reflect: true }) headingLevel: HeadingLevel;\n\n  /** Specifies the kind of the component, which will style the top border. */\n  @Prop({ reflect: true }) kind: Extract<\"brand\" | \"danger\" | \"info\" | \"success\" | \"warning\", Kind>;\n\n  /**\n   * When `true`, a busy indicator is displayed.\n   */\n  @Prop({ reflect: true }) loading = false;\n\n  /**\n   * When `true`, the action menu items in the `header-menu-actions` slot are open.\n   */\n  @Prop({ reflect: true }) menuOpen = false;\n\n  /**\n   * Made into a prop for testing purposes only\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: DialogMessages;\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<DialogMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  /** When `true`, displays a scrim blocking interaction underneath the component.  */\n  @Prop({ reflect: true }) modal = false;\n\n  @Watch(\"modal\")\n  onModalChange(): void {\n    this.updateOverflowHiddenClass();\n  }\n\n  /** When `true`, displays and positions the component. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /** When `true`, disables the closing of the component when clicked outside. */\n  @Prop({ reflect: true }) outsideCloseDisabled = false;\n\n  /**\n   * Determines the type of positioning to use for the overlaid content.\n   *\n   * Using `\"absolute\"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.\n   *\n   * `\"fixed\"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `\"fixed\"`.\n   *\n   */\n  @Prop({ reflect: true }) overlayPositioning: OverlayPositioning = \"absolute\";\n\n  /**\n   * Specifies the placement of the dialog.\n   */\n  @Prop({ reflect: true }) placement: DialogPlacement = \"center\";\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /** Specifies the width of the component. */\n  @Prop({ reflect: true }) widthScale: Scale = \"m\";\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  async componentWillLoad(): Promise<void> {\n    await setUpMessages(this);\n    setUpLoadableComponent(this);\n    // when dialog initially renders, if active was set we need to open as watcher doesn't fire\n    if (this.open) {\n      this.openDialog();\n    }\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  connectedCallback(): void {\n    this.mutationObserver?.observe(this.el, { childList: true, subtree: true });\n    connectLocalized(this);\n    connectMessages(this);\n    connectFocusTrap(this);\n  }\n\n  disconnectedCallback(): void {\n    this.removeOverflowHiddenClass();\n    this.mutationObserver?.disconnect();\n    deactivateFocusTrap(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n    this.embedded = false;\n  }\n\n  render(): VNode {\n    const { description, heading, opened } = this;\n    return (\n      <Host\n        aria-description={description}\n        aria-label={heading}\n        aria-modal={toAriaBoolean(this.modal)}\n        role=\"dialog\"\n      >\n        <div\n          class={{\n            [CSS.container]: true,\n            [CSS.containerOpen]: opened,\n            [CSS.containerEmbedded]: this.embedded,\n          }}\n        >\n          {this.modal ? (\n            <calcite-scrim class={CSS.scrim} onClick={this.handleOutsideClose} />\n          ) : null}\n          <div class={CSS.dialog} ref={this.setTransitionEl}>\n            <slot name={SLOTS.content}>\n              <calcite-panel\n                beforeClose={this.beforeClose}\n                class={CSS.panel}\n                closable={!this.closeDisabled}\n                closed={!opened}\n                description={description}\n                heading={heading}\n                headingLevel={this.headingLevel}\n                loading={this.loading}\n                menuOpen={this.menuOpen}\n                messageOverrides={this.messageOverrides}\n                onCalcitePanelClose={this.handleCloseClick}\n                onCalcitePanelScroll={this.handleScroll}\n                overlayPositioning={this.overlayPositioning}\n                ref={(el) => (this.panelEl = el)}\n                scale={this.scale}\n              >\n                <slot name={SLOTS.actionBar} slot={PANEL_SLOTS.actionBar} />\n                <slot name={SLOTS.alerts} slot={PANEL_SLOTS.alerts} />\n                <slot name={SLOTS.headerActionsStart} slot={PANEL_SLOTS.headerActionsStart} />\n                <slot name={SLOTS.headerActionsEnd} slot={PANEL_SLOTS.headerActionsEnd} />\n                <slot name={SLOTS.headerContent} slot={PANEL_SLOTS.headerContent} />\n                <slot name={SLOTS.headerMenuActions} slot={PANEL_SLOTS.headerMenuActions} />\n                <slot name={SLOTS.fab} slot={PANEL_SLOTS.fab} />\n                <slot name={SLOTS.contentTop} slot={PANEL_SLOTS.contentTop} />\n                <slot name={SLOTS.contentBottom} slot={PANEL_SLOTS.contentBottom} />\n                <slot name={SLOTS.footerStart} slot={PANEL_SLOTS.footerStart} />\n                <slot name={SLOTS.footer} slot={PANEL_SLOTS.footer} />\n                <slot name={SLOTS.footerEnd} slot={PANEL_SLOTS.footerEnd} />\n                <div class={CSS.content}>\n                  <slot />\n                </div>\n              </calcite-panel>\n            </slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Properties/ State\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteDialogElement;\n\n  @State() opened = false;\n\n  @State() hasFooter = true;\n\n  @State() hasContentTop = false;\n\n  @State() hasContentBottom = false;\n\n  @State() effectiveLocale: string;\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() defaultMessages: DialogMessages;\n\n  openTransitionProp = \"opacity\";\n\n  transitionEl: HTMLDivElement;\n\n  focusTrap: FocusTrap;\n\n  private panelEl: HTMLCalcitePanelElement;\n\n  private ignoreOpenChange = false;\n\n  private mutationObserver: MutationObserver = createObserver(\"mutation\", () =>\n    this.handleMutationObserver(),\n  );\n\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"keydown\", { target: \"window\" })\n  handleEscape(event: KeyboardEvent): void {\n    if (this.open && !this.escapeDisabled && event.key === \"Escape\" && !event.defaultPrevented) {\n      this.open = false;\n      event.preventDefault();\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n  /** Fires when the component is requested to be closed and before the closing transition begins. */\n  @Event({ cancelable: false }) calciteDialogBeforeClose: EventEmitter<void>;\n\n  /** Fires when the component is closed and animation is complete. */\n  @Event({ cancelable: false }) calciteDialogClose: EventEmitter<void>;\n\n  /** Fires when the component is added to the DOM but not rendered, and before the opening transition begins. */\n  @Event({ cancelable: false }) calciteDialogBeforeOpen: EventEmitter<void>;\n\n  /** Fires when the component is open and animation is complete. */\n  @Event({ cancelable: false }) calciteDialogOpen: EventEmitter<void>;\n\n  /** Fires when the content is scrolled. */\n  @Event({ cancelable: false }) calciteDialogScroll: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Sets focus on the component's \"close\" button (the first focusable item).\n   *\n   * @returns {Promise<void>} - A promise that is resolved when the operation has completed.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    return this.panelEl?.setFocus() ?? focusFirstTabbable(this.el);\n  }\n\n  /**\n   * Updates the element(s) that are used within the focus-trap of the component.\n   */\n  @Method()\n  async updateFocusTrapElements(): Promise<void> {\n    updateFocusTrapElements(this);\n  }\n\n  /**\n   * Scrolls the component's content to a specified set of coordinates.\n   *\n   * @example\n   * myCalciteFlowItem.scrollContentTo({\n   *   left: 0, // Specifies the number of pixels along the X axis to scroll the window or element.\n   *   top: 0, // Specifies the number of pixels along the Y axis to scroll the window or element\n   *   behavior: \"auto\" // Specifies whether the scrolling should animate smoothly (smooth), or happen instantly in a single jump (auto, the default value).\n   * });\n   * @param options - allows specific coordinates to be defined.\n   * @returns - promise that resolves once the content is scrolled to.\n   */\n  @Method()\n  async scrollContentTo(options?: ScrollToOptions): Promise<void> {\n    await this.panelEl?.scrollContentTo(options);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  onBeforeOpen(): void {\n    this.transitionEl.classList.add(CSS.openingActive);\n    this.calciteDialogBeforeOpen.emit();\n  }\n\n  onOpen(): void {\n    this.transitionEl.classList.remove(CSS.openingIdle, CSS.openingActive);\n    this.calciteDialogOpen.emit();\n    activateFocusTrap(this);\n  }\n\n  onBeforeClose(): void {\n    this.transitionEl.classList.add(CSS.closingActive);\n    this.calciteDialogBeforeClose.emit();\n  }\n\n  onClose(): void {\n    this.transitionEl.classList.remove(CSS.closingIdle, CSS.closingActive);\n    this.calciteDialogClose.emit();\n    deactivateFocusTrap(this);\n  }\n\n  @Watch(\"open\")\n  toggleDialog(value: boolean): void {\n    if (this.ignoreOpenChange) {\n      return;\n    }\n\n    if (value) {\n      this.openDialog();\n    } else {\n      this.closeDialog();\n    }\n  }\n\n  @Watch(\"opened\")\n  handleOpenedChange(value: boolean): void {\n    const idleClass = value ? CSS.openingIdle : CSS.closingIdle;\n    this.transitionEl.classList.add(idleClass);\n    onToggleOpenCloseComponent(this);\n  }\n\n  private setTransitionEl = (el: HTMLDivElement): void => {\n    this.transitionEl = el;\n  };\n\n  private openEnd = (): void => {\n    this.setFocus();\n    this.el.removeEventListener(\"calciteDialogOpen\", this.openEnd);\n  };\n\n  private handleScroll = (): void => {\n    this.calciteDialogScroll.emit();\n  };\n\n  private handleCloseClick = () => {\n    this.open = false;\n  };\n\n  private async openDialog(): Promise<void> {\n    await componentOnReady(this.el);\n    this.el.addEventListener(\"calciteDialogOpen\", this.openEnd);\n    this.opened = true;\n    this.updateOverflowHiddenClass();\n  }\n\n  private handleOutsideClose = (): void => {\n    if (this.outsideCloseDisabled) {\n      return;\n    }\n\n    this.open = false;\n  };\n\n  private closeDialog = async (): Promise<void> => {\n    if (this.beforeClose) {\n      try {\n        await this.beforeClose();\n      } catch (_error) {\n        // close prevented\n        requestAnimationFrame(() => {\n          this.ignoreOpenChange = true;\n          this.open = true;\n          this.ignoreOpenChange = false;\n        });\n        return;\n      }\n    }\n\n    totalOpenDialogs--;\n    this.opened = false;\n    this.updateOverflowHiddenClass();\n  };\n\n  private updateOverflowHiddenClass = (): void => {\n    this.opened && !this.embedded && this.modal\n      ? this.addOverflowHiddenClass()\n      : this.removeOverflowHiddenClass();\n  };\n\n  private addOverflowHiddenClass(): void {\n    if (totalOpenDialogs === 0) {\n      initialDocumentOverflowStyle = document.documentElement.style.overflow;\n    }\n\n    totalOpenDialogs++;\n    // use an inline style instead of a utility class to avoid global class declarations.\n    document.documentElement.style.setProperty(\"overflow\", \"hidden\");\n  }\n\n  private removeOverflowHiddenClass(): void {\n    document.documentElement.style.setProperty(\"overflow\", initialDocumentOverflowStyle);\n  }\n\n  private handleMutationObserver = (): void => {\n    this.updateFocusTrapElements();\n  };\n}\n"],"version":3}

package/dist/cjs/calcite-dropdown_3.cjs.entry.js

@@ -1,25 +1,25 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0-next.21
+ * v2.12.0-next.22
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d80273a.js');
-const dom = require('./dom-881fc445.js');
-const floatingUi = require('./floating-ui-e80fc4d8.js');
-const guid = require('./guid-2226c6f0.js');
-const interactive = require('./interactive-9bdb4619.js');
-const key = require('./key-ec486ff6.js');
-const loadable = require('./loadable-5de24ce2.js');
-const observers = require('./observers-60f6fe44.js');
-const openCloseComponent = require('./openCloseComponent-8e139f80.js');
-const component = require('./component-4e1d58f5.js');
-require('./resources-9b9f36a7.js');
-require('./browser-e784e39b.js');
-require('./debounce-a00cfd1e.js');
+const index = require('./index-64d17a9a.js');
+const dom = require('./dom-a0cf752d.js');
+const floatingUi = require('./floating-ui-2068f0f9.js');
+const guid = require('./guid-9c91b300.js');
+const interactive = require('./interactive-9dab57b4.js');
+const key = require('./key-b2babbb1.js');
+const loadable = require('./loadable-7a282ee2.js');
+const observers = require('./observers-da02358c.js');
+const openCloseComponent = require('./openCloseComponent-6d9ca0a6.js');
+const component = require('./component-15b9af61.js');
+require('./resources-ae8dbc7a.js');
+require('./browser-963457a4.js');
+require('./debounce-76746e1e.js');
 
 const SLOTS = {
     dropdownTrigger: "trigger",

package/dist/cjs/calcite-fab.cjs.entry.js

@@ -1,19 +1,19 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0-next.21
+ * v2.12.0-next.22
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d80273a.js');
-const dom = require('./dom-881fc445.js');
-const interactive = require('./interactive-9bdb4619.js');
-const loadable = require('./loadable-5de24ce2.js');
-require('./guid-2226c6f0.js');
-require('./resources-9b9f36a7.js');
-require('./browser-e784e39b.js');
+const index = require('./index-64d17a9a.js');
+const dom = require('./dom-a0cf752d.js');
+const interactive = require('./interactive-9dab57b4.js');
+const loadable = require('./loadable-7a282ee2.js');
+require('./guid-9c91b300.js');
+require('./resources-ae8dbc7a.js');
+require('./browser-963457a4.js');
 
 const CSS = {
     button: "button",

package/dist/cjs/calcite-filter.cjs.entry.js

@@ -1,25 +1,25 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0-next.21
+ * v2.12.0-next.22
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d80273a.js');
-const filter = require('./filter-96698ace.js');
-const interactive = require('./interactive-9bdb4619.js');
-const loadable = require('./loadable-5de24ce2.js');
-const locale = require('./locale-667d42ba.js');
-const t9n = require('./t9n-69d3dc4a.js');
-const resources = require('./resources-9b9f36a7.js');
-const debounce = require('./debounce-a00cfd1e.js');
-require('./browser-e784e39b.js');
-require('./dom-881fc445.js');
-require('./guid-2226c6f0.js');
-require('./key-ec486ff6.js');
-require('./observers-60f6fe44.js');
+const index = require('./index-64d17a9a.js');
+const filter = require('./filter-4050a593.js');
+const interactive = require('./interactive-9dab57b4.js');
+const loadable = require('./loadable-7a282ee2.js');
+const locale = require('./locale-eeba6ce3.js');
+const t9n = require('./t9n-7d924b32.js');
+const resources = require('./resources-ae8dbc7a.js');
+const debounce = require('./debounce-76746e1e.js');
+require('./browser-963457a4.js');
+require('./dom-a0cf752d.js');
+require('./guid-9c91b300.js');
+require('./key-b2babbb1.js');
+require('./observers-da02358c.js');
 
 const CSS = {
     container: "container",

package/dist/cjs/calcite-flow-item.cjs.entry.js

@@ -1,24 +1,24 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0-next.21
+ * v2.12.0-next.22
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d80273a.js');
-const dom = require('./dom-881fc445.js');
-const interactive = require('./interactive-9bdb4619.js');
-const loadable = require('./loadable-5de24ce2.js');
-const locale = require('./locale-667d42ba.js');
-const t9n = require('./t9n-69d3dc4a.js');
-const resources = require('./resources-02947c97.js');
-require('./guid-2226c6f0.js');
-require('./resources-9b9f36a7.js');
-require('./browser-e784e39b.js');
-require('./key-ec486ff6.js');
-require('./observers-60f6fe44.js');
+const index = require('./index-64d17a9a.js');
+const dom = require('./dom-a0cf752d.js');
+const interactive = require('./interactive-9dab57b4.js');
+const loadable = require('./loadable-7a282ee2.js');
+const locale = require('./locale-eeba6ce3.js');
+const t9n = require('./t9n-7d924b32.js');
+const resources = require('./resources-6ba5f1fd.js');
+require('./guid-9c91b300.js');
+require('./resources-ae8dbc7a.js');
+require('./browser-963457a4.js');
+require('./key-b2babbb1.js');
+require('./observers-da02358c.js');
 
 const CSS = {
     backButton: "back-button",

package/dist/cjs/calcite-flow.cjs.entry.js

@@ -1,16 +1,16 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0-next.21
+ * v2.12.0-next.22
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d80273a.js');
-const observers = require('./observers-60f6fe44.js');
-const loadable = require('./loadable-5de24ce2.js');
-require('./browser-e784e39b.js');
+const index = require('./index-64d17a9a.js');
+const observers = require('./observers-da02358c.js');
+const loadable = require('./loadable-7a282ee2.js');
+require('./browser-963457a4.js');
 
 const CSS = {
     frame: "frame",

package/dist/cjs/calcite-graph_2.cjs.entry.js

@@ -1,26 +1,26 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0-next.21
+ * v2.12.0-next.22
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d80273a.js');
-const guid = require('./guid-2226c6f0.js');
-const observers = require('./observers-60f6fe44.js');
-const dom = require('./dom-881fc445.js');
-const form = require('./form-5af69aa2.js');
-const interactive = require('./interactive-9bdb4619.js');
-const key = require('./key-ec486ff6.js');
-const label = require('./label-7bd1b647.js');
-const loadable = require('./loadable-5de24ce2.js');
-const locale = require('./locale-667d42ba.js');
-const math = require('./math-89b4df91.js');
-require('./browser-e784e39b.js');
-require('./resources-9b9f36a7.js');
-require('./component-4e1d58f5.js');
+const index = require('./index-64d17a9a.js');
+const guid = require('./guid-9c91b300.js');
+const observers = require('./observers-da02358c.js');
+const dom = require('./dom-a0cf752d.js');
+const form = require('./form-9eaf60df.js');
+const interactive = require('./interactive-9dab57b4.js');
+const key = require('./key-b2babbb1.js');
+const label = require('./label-bac0c203.js');
+const loadable = require('./loadable-7a282ee2.js');
+const locale = require('./locale-eeba6ce3.js');
+const math = require('./math-b3db5bdb.js');
+require('./browser-963457a4.js');
+require('./resources-ae8dbc7a.js');
+require('./component-15b9af61.js');
 
 /**
  * Calculate slope of the tangents

package/dist/cjs/calcite-handle.cjs.entry.js

@@ -1,23 +1,23 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0-next.21
+ * v2.12.0-next.22
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d80273a.js');
-const dom = require('./dom-881fc445.js');
-const loadable = require('./loadable-5de24ce2.js');
-const locale = require('./locale-667d42ba.js');
-const t9n = require('./t9n-69d3dc4a.js');
-const interactive = require('./interactive-9bdb4619.js');
-require('./guid-2226c6f0.js');
-require('./resources-9b9f36a7.js');
-require('./browser-e784e39b.js');
-require('./key-ec486ff6.js');
-require('./observers-60f6fe44.js');
+const index = require('./index-64d17a9a.js');
+const dom = require('./dom-a0cf752d.js');
+const loadable = require('./loadable-7a282ee2.js');
+const locale = require('./locale-eeba6ce3.js');
+const t9n = require('./t9n-7d924b32.js');
+const interactive = require('./interactive-9dab57b4.js');
+require('./guid-9c91b300.js');
+require('./resources-ae8dbc7a.js');
+require('./browser-963457a4.js');
+require('./key-b2babbb1.js');
+require('./observers-da02358c.js');
 
 const CSS = {
     handle: "handle",

package/dist/cjs/calcite-icon.cjs.entry.js

@@ -1,18 +1,18 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0-next.21
+ * v2.12.0-next.22
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d80273a.js');
-const dom = require('./dom-881fc445.js');
-const observers = require('./observers-60f6fe44.js');
-const browser = require('./browser-e784e39b.js');
-require('./guid-2226c6f0.js');
-require('./resources-9b9f36a7.js');
+const index = require('./index-64d17a9a.js');
+const dom = require('./dom-a0cf752d.js');
+const observers = require('./observers-da02358c.js');
+const browser = require('./browser-963457a4.js');
+require('./guid-9c91b300.js');
+require('./resources-ae8dbc7a.js');
 
 const CSS = {
     icon: "icon",

package/dist/cjs/calcite-inline-editable.cjs.entry.js

@@ -1,25 +1,25 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0-next.21
+ * v2.12.0-next.22
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d80273a.js');
-const dom = require('./dom-881fc445.js');
-const interactive = require('./interactive-9bdb4619.js');
-const label = require('./label-7bd1b647.js');
-const loadable = require('./loadable-5de24ce2.js');
-const locale = require('./locale-667d42ba.js');
-const observers = require('./observers-60f6fe44.js');
-const t9n = require('./t9n-69d3dc4a.js');
-require('./guid-2226c6f0.js');
-require('./resources-9b9f36a7.js');
-require('./browser-e784e39b.js');
-require('./component-4e1d58f5.js');
-require('./key-ec486ff6.js');
+const index = require('./index-64d17a9a.js');
+const dom = require('./dom-a0cf752d.js');
+const interactive = require('./interactive-9dab57b4.js');
+const label = require('./label-bac0c203.js');
+const loadable = require('./loadable-7a282ee2.js');
+const locale = require('./locale-eeba6ce3.js');
+const observers = require('./observers-da02358c.js');
+const t9n = require('./t9n-7d924b32.js');
+require('./guid-9c91b300.js');
+require('./resources-ae8dbc7a.js');
+require('./browser-963457a4.js');
+require('./component-15b9af61.js');
+require('./key-b2babbb1.js');
 
 const CSS = {
     wrapper: "wrapper",