@esri/solutions-components 0.10.27 → 0.10.29

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

@@ -7,22 +7,22 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5a0af791.js');
+const index = require('./index-4b68e4b4.js');
 const _commonjsHelpers = require('./_commonjsHelpers-baf43783.js');
-const dom = require('./dom-3d3a8f25.js');
-const focusTrapComponent = require('./focusTrapComponent-86ebd41d.js');
-const loadable = require('./loadable-0e357195.js');
-const observers = require('./observers-5f9f67ee.js');
-const openCloseComponent = require('./openCloseComponent-b66f10f5.js');
-const locale = require('./locale-351282c5.js');
-const t9n = require('./t9n-e41672d2.js');
-const component = require('./component-7f2bd646.js');
-const resources = require('./resources-4c3e1c50.js');
-require('./guid-42cda8c9.js');
-require('./resources-f11e9bd6.js');
-require('./config-7c16c710.js');
-require('./browser-2893460e.js');
-require('./key-82084ef6.js');
+const dom = require('./dom-795d4a33.js');
+const focusTrapComponent = require('./focusTrapComponent-b19fd5d5.js');
+const loadable = require('./loadable-1c888c87.js');
+const observers = require('./observers-18d87cb5.js');
+const openCloseComponent = require('./openCloseComponent-3c540d25.js');
+const locale = require('./locale-da840314.js');
+const t9n = require('./t9n-ed5c03a7.js');
+const component = require('./component-5d190962.js');
+const resources = require('./resources-535f936c.js');
+require('./guid-e84a8375.js');
+require('./resources-18f799c7.js');
+require('./config-e76d9931.js');
+require('./browser-333a21c5.js');
+require('./key-47c9469a.js');
 
 var interact_min = {exports: {}};
 
@@ -38,7 +38,7 @@ const interact = interact_min.exports;
 /*!
  * 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.2
+ * v2.13.0
  */
 const CSS = {
     dialog: "dialog",
@@ -70,7 +70,7 @@ const dialogDragStep = 25;
 const initialDragPosition = { x: 0, y: 0 };
 const initialResizePosition = { top: 0, right: 0, bottom: 0, left: 0 };
 
-const dialogCss = ":host{--calcite-dialog-scrim-background-color:rgba(0, 0, 0, 0.85);pointer-events:none;inset:0px;z-index:var(--calcite-z-index-overlay);display:flex;--calcite-internal-dialog-animation-offset:20px}:host([modal]){position:absolute}.container{pointer-events:auto;position:fixed;inset:0px;z-index:var(--calcite-z-index-overlay);display:flex;align-items:center;justify-content:center;overflow:hidden;color:var(--calcite-color-text-2);opacity:0;visibility:hidden;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([placement=top]) .container{align-items:flex-start;justify-content:center}:host([placement=top-start]) .container{align-items:flex-start;justify-content:flex-start}:host([placement=top-end]) .container{align-items:flex-start;justify-content:flex-end}:host([placement=bottom]) .container{align-items:flex-end;justify-content:center}:host([placement=bottom-start]) .container{align-items:flex-end;justify-content:flex-start}:host([placement=bottom-end]) .container{align-items:flex-end;justify-content:flex-end}:host(:not([modal])) .container{pointer-events:none}:host([scale=s]){--calcite-internal-dialog-content-padding:var(--calcite-dialog-content-space, var(--calcite-spacing-sm));--calcite-internal-dialog-min-size-x:198px;--calcite-internal-dialog-min-size-y:140px}:host([scale=m]){--calcite-internal-dialog-content-padding:var(--calcite-dialog-content-space, var(--calcite-spacing-md));--calcite-internal-dialog-min-size-x:288px;--calcite-internal-dialog-min-size-y:180px}:host([scale=l]){--calcite-internal-dialog-content-padding:var(--calcite-dialog-content-space, var(--calcite-spacing-lg));--calcite-internal-dialog-min-size-x:388px;--calcite-internal-dialog-min-size-y:220px}.scrim{--calcite-scrim-background:var(--calcite-dialog-scrim-background-color, var(--calcite-color-transparent-scrim));--calcite-scrim-background-color:var(\n    --calcite-dialog-scrim-background-color,\n    var(--calcite-color-transparent-scrim)\n  );position:fixed;inset:0px;display:flex;overflow-y:hidden}calcite-panel{--calcite-panel-content-space:var(--calcite-dialog-content-space, var(--calcite-internal-dialog-content-padding));--calcite-panel-footer-padding:var(--calcite-dialog-footer-space);--calcite-panel-header-border-block-end:var(--calcite-border-width-sm) solid var(--calcite-dialog-border-color)}.dialog{pointer-events:none;position:relative;z-index:var(--calcite-z-index-modal);margin:1.5rem;box-sizing:border-box;display:flex;inline-size:100%;flex-direction:column;border-radius:0.25rem;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:inset-block var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);min-inline-size:var(--calcite-dialog-min-size-x, var(--calcite-internal-dialog-min-size-x));max-inline-size:var(--calcite-dialog-max-size-x, 100%);min-block-size:var(--calcite-dialog-min-size-y, var(--calcite-internal-dialog-min-size-y));max-block-size:var(--calcite-dialog-max-size-y, 100%);--calcite-internal-dialog-hidden-position:calc(\n    var(--calcite-dialog-offset-y, 0px) + var(--calcite-internal-dialog-animation-offset)\n  );--calcite-internal-dialog-shown-position:var(--calcite-dialog-offset-y, 0);inset-inline-start:var(--calcite-dialog-offset-x, 0);inset-block-start:var(--calcite-internal-dialog-hidden-position)}.dialog--opening-active{inset-block-start:var(--calcite-internal-dialog-shown-position)}:host([menu-open]) .dialog{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)}.panel{border-radius:0.25rem}.container--open{opacity:1;visibility:visible;transition-delay:0ms}.container--open .dialog{pointer-events:auto;visibility:visible;opacity:1;transition:inset-block var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);transition-delay:0ms}:host([width=small]) .dialog{inline-size:auto}:host([width-scale=s]) .dialog{inline-size:var(--calcite-dialog-size-x, 32rem);block-size:var(--calcite-dialog-size-y, auto)}@media screen and (max-width: 35rem){:host([width-scale=s]) .dialog{margin:0px;block-size:100%;max-block-size:100%;inline-size:100%;max-inline-size:100%;inset-inline-start:0;inset-block-start:var(--calcite-internal-dialog-animation-offset)}:host([width-scale=s]) .dialog--opening-active{inset-block-start:0}}:host([width-scale=m]) .dialog{inline-size:var(--calcite-dialog-size-x, 48rem);block-size:var(--calcite-dialog-size-y, auto)}@media screen and (max-width: 51rem){:host([width-scale=m]) .dialog{margin:0px;block-size:100%;max-block-size:100%;inline-size:100%;max-inline-size:100%;inset-inline-start:0;inset-block-start:var(--calcite-internal-dialog-animation-offset)}:host([width-scale=m]) .dialog--opening-active{inset-block-start:0}}:host([width-scale=l]) .dialog{inline-size:var(--calcite-dialog-size-x, 94rem);block-size:var(--calcite-dialog-size-y, auto)}@media screen and (max-width: 97rem){:host([width-scale=l]) .dialog{margin:0px;block-size:100%;max-block-size:100%;inline-size:100%;max-inline-size:100%;inset-inline-start:0;inset-block-start:var(--calcite-internal-dialog-animation-offset)}:host([width-scale=l]) .dialog--opening-active{inset-block-start:0}}:host([placement=cover]) .dialog{margin:0px;block-size:100%;max-block-size:100%;inline-size:100%;max-inline-size:100%;border-radius:0px}:host([placement=cover]) .panel{border-radius:0px}:host([kind]) .panel{border-start-start-radius:0px;border-start-end-radius:0px}:host([kind=brand]) .dialog{border-color:var(--calcite-color-brand)}:host([kind=danger]) .dialog{border-color:var(--calcite-color-status-danger)}:host([kind=info]) .dialog{border-color:var(--calcite-color-status-info)}:host([kind=success]) .dialog{border-color:var(--calcite-color-status-success)}:host([kind=warning]) .dialog{border-color:var(--calcite-color-status-warning)}:host([kind=brand][open]) .dialog,:host([kind=danger][open]) .dialog,:host([kind=info][open]) .dialog,:host([kind=success][open]) .dialog,:host([kind=warning][open]) .dialog{border-width:0px;border-block-start-width:4px;border-style:solid}.container--embedded{position:absolute;pointer-events:auto}.container--embedded calcite-scrim{position:absolute}.assistive-text{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}:host([hidden]){display:none}[hidden]{display:none}";
+const dialogCss = ":host{--calcite-dialog-scrim-background-color:rgba(0, 0, 0, 0.85);pointer-events:none;inset:0px;z-index:var(--calcite-z-index-overlay);display:flex;--calcite-internal-dialog-animation-offset:20px}:host([modal]){position:absolute}.container{pointer-events:auto;position:fixed;inset:0px;z-index:var(--calcite-z-index-overlay);display:flex;align-items:center;justify-content:center;overflow:hidden;color:var(--calcite-color-text-2);opacity:0;visibility:hidden;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([placement=top]) .container{align-items:flex-start;justify-content:center}:host([placement=top-start]) .container{align-items:flex-start;justify-content:flex-start}:host([placement=top-end]) .container{align-items:flex-start;justify-content:flex-end}:host([placement=bottom]) .container{align-items:flex-end;justify-content:center}:host([placement=bottom-start]) .container{align-items:flex-end;justify-content:flex-start}:host([placement=bottom-end]) .container{align-items:flex-end;justify-content:flex-end}:host(:not([modal])) .container{pointer-events:none}:host([scale=s]){--calcite-internal-dialog-content-padding:var(--calcite-dialog-content-space, var(--calcite-spacing-sm));--calcite-internal-dialog-min-size-x:198px;--calcite-internal-dialog-min-size-y:140px}:host([scale=m]){--calcite-internal-dialog-content-padding:var(--calcite-dialog-content-space, var(--calcite-spacing-md));--calcite-internal-dialog-min-size-x:288px;--calcite-internal-dialog-min-size-y:180px}:host([scale=l]){--calcite-internal-dialog-content-padding:var(--calcite-dialog-content-space, var(--calcite-spacing-lg));--calcite-internal-dialog-min-size-x:388px;--calcite-internal-dialog-min-size-y:220px}.scrim{--calcite-scrim-background:var(--calcite-dialog-scrim-background-color, var(--calcite-color-transparent-scrim));--calcite-scrim-background-color:var(\n    --calcite-dialog-scrim-background-color,\n    var(--calcite-color-transparent-scrim)\n  );position:fixed;inset:0px;display:flex;overflow-y:hidden}calcite-panel{--calcite-panel-content-space:var(--calcite-dialog-content-space, var(--calcite-internal-dialog-content-padding));--calcite-panel-footer-padding:var(--calcite-dialog-footer-space);--calcite-panel-header-border-block-end:var(--calcite-border-width-sm) solid var(--calcite-dialog-border-color);--calcite-panel-background-color:var(--calcite-dialog-background-color)}.dialog{pointer-events:none;position:relative;z-index:var(--calcite-z-index-modal);margin:1.5rem;box-sizing:border-box;display:flex;inline-size:100%;flex-direction:column;border-radius:0.25rem;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:inset-block var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);min-inline-size:var(--calcite-dialog-min-size-x, var(--calcite-internal-dialog-min-size-x));max-inline-size:var(--calcite-dialog-max-size-x, 100%);min-block-size:var(--calcite-dialog-min-size-y, var(--calcite-internal-dialog-min-size-y));max-block-size:var(--calcite-dialog-max-size-y, 100%);--calcite-internal-dialog-hidden-position:calc(\n    var(--calcite-dialog-offset-y, 0px) + var(--calcite-internal-dialog-animation-offset)\n  );--calcite-internal-dialog-shown-position:var(--calcite-dialog-offset-y, 0);inset-inline-start:var(--calcite-dialog-offset-x, 0);inset-block-start:var(--calcite-internal-dialog-hidden-position)}.dialog--opening-active{inset-block-start:var(--calcite-internal-dialog-shown-position)}:host([menu-open]) .dialog{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)}.panel{border-radius:0.25rem}.container--open{opacity:1;visibility:visible;transition-delay:0ms}.container--open .dialog{pointer-events:auto;visibility:visible;opacity:1;transition:inset-block var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);transition-delay:0ms}:host([width=small]) .dialog{inline-size:auto}:host([width-scale=s]) .dialog{inline-size:var(--calcite-dialog-size-x, 32rem);block-size:var(--calcite-dialog-size-y, auto)}@media screen and (max-width: 35rem){:host([width-scale=s]) .dialog{margin:0px;block-size:100%;max-block-size:100%;inline-size:100%;max-inline-size:100%;inset-inline-start:0;inset-block-start:var(--calcite-internal-dialog-animation-offset)}:host([width-scale=s]) .dialog--opening-active{inset-block-start:0}}:host([width-scale=m]) .dialog{inline-size:var(--calcite-dialog-size-x, 48rem);block-size:var(--calcite-dialog-size-y, auto)}@media screen and (max-width: 51rem){:host([width-scale=m]) .dialog{margin:0px;block-size:100%;max-block-size:100%;inline-size:100%;max-inline-size:100%;inset-inline-start:0;inset-block-start:var(--calcite-internal-dialog-animation-offset)}:host([width-scale=m]) .dialog--opening-active{inset-block-start:0}}:host([width-scale=l]) .dialog{inline-size:var(--calcite-dialog-size-x, 94rem);block-size:var(--calcite-dialog-size-y, auto)}@media screen and (max-width: 97rem){:host([width-scale=l]) .dialog{margin:0px;block-size:100%;max-block-size:100%;inline-size:100%;max-inline-size:100%;inset-inline-start:0;inset-block-start:var(--calcite-internal-dialog-animation-offset)}:host([width-scale=l]) .dialog--opening-active{inset-block-start:0}}:host([placement=cover]) .dialog{margin:0px;block-size:100%;max-block-size:100%;inline-size:100%;max-inline-size:100%;border-radius:0px}:host([placement=cover]) .panel{border-radius:0px}:host([kind]) .panel{border-start-start-radius:0px;border-start-end-radius:0px}:host([kind=brand]) .dialog{border-color:var(--calcite-color-brand)}:host([kind=danger]) .dialog{border-color:var(--calcite-color-status-danger)}:host([kind=info]) .dialog{border-color:var(--calcite-color-status-info)}:host([kind=success]) .dialog{border-color:var(--calcite-color-status-success)}:host([kind=warning]) .dialog{border-color:var(--calcite-color-status-warning)}:host([kind=brand][open]) .dialog,:host([kind=danger][open]) .dialog,:host([kind=info][open]) .dialog,:host([kind=success][open]) .dialog,:host([kind=warning][open]) .dialog{border-width:0px;border-block-start-width:4px;border-style:solid}.container--embedded{position:absolute;pointer-events:auto}.container--embedded calcite-scrim{position:absolute}.assistive-text{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}:host([hidden]){display:none}[hidden]{display:none}";
 const CalciteDialogStyle0 = dialogCss;
 
 let totalOpenDialogs = 0;
@@ -170,9 +170,6 @@ const Dialog = class {
                     break;
             }
         };
-        this.setContainerEl = (el) => {
-            this.containerEl = el;
-        };
         this.setTransitionEl = (el) => {
             this.transitionEl = el;
             this.setupInteractions();
@@ -196,7 +193,7 @@ const Dialog = class {
             this.open = false;
         };
         this.handlePanelKeyDown = (event) => {
-            if (this.escapeDisabled) {
+            if (this.escapeDisabled && event.key === "Escape") {
                 event.preventDefault();
             }
         };
@@ -302,11 +299,11 @@ const Dialog = class {
     }
     render() {
         const { assistiveText, description, heading, opened } = this;
-        return (index.h(index.Host, { key: '6a00a9f9c7c9ba8079b24cae446322bfa258348d' }, index.h("div", { key: 'd7a5e0f37a1fe05852bdd1b88a8b47f185e1bf71', class: {
+        return (index.h(index.Host, { key: 'bf406255eaa6d94c8443af185a74a2b2d58c6d59' }, index.h("div", { key: 'de2a34b6da4a82c66e9fafdbdd2056e4e11e1315', class: {
                 [CSS.container]: true,
                 [CSS.containerOpen]: opened,
                 [CSS.containerEmbedded]: this.embedded,
-            }, ref: this.setContainerEl }, this.modal ? (index.h("calcite-scrim", { class: CSS.scrim, onClick: this.handleOutsideClose })) : null, index.h("div", { key: 'f0236b163b7f7856033c581b9191d0fc491eee46', "aria-description": description, "aria-label": heading, "aria-modal": dom.toAriaBoolean(this.modal), class: CSS.dialog, onKeyDown: this.handleKeyDown, ref: this.setTransitionEl, role: "dialog" }, assistiveText ? (index.h("div", { "aria-live": "polite", class: CSS.assistiveText, key: "assistive-text" }, assistiveText)) : null, index.h("slot", { key: 'b0d18a7ce3e4ad5df276b8f04f41284bbe55efff', name: SLOTS.content }, index.h("calcite-panel", { key: '65bcc069837d6749c84351d7ca29c82e112ff809', 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.handleInternalPanelCloseClick, onCalcitePanelScroll: this.handleInternalPanelScroll, onKeyDown: this.handlePanelKeyDown, overlayPositioning: this.overlayPositioning, ref: (el) => (this.panelEl = el), scale: this.scale }, index.h("slot", { key: '90a1b0007537031a9c1ae3761f48d05d3dd62d78', name: SLOTS.actionBar, slot: resources.SLOTS.actionBar }), index.h("slot", { key: 'b32c13fd7cf274e1fb9ffa071a7406e1a26e0b72', name: SLOTS.alerts, slot: resources.SLOTS.alerts }), index.h("slot", { key: 'd3433c5b0ed4ec801950a72cea50f61efa9b6b8e', name: SLOTS.headerActionsStart, slot: resources.SLOTS.headerActionsStart }), index.h("slot", { key: '164df8e6a746f0e351c629193c5052a3f9254e48', name: SLOTS.headerActionsEnd, slot: resources.SLOTS.headerActionsEnd }), index.h("slot", { key: 'e67304954b705afe57384f27214ecab5b89eaed9', name: SLOTS.headerContent, slot: resources.SLOTS.headerContent }), index.h("slot", { key: 'b4108e58478e2e4e00494c8c8e7b1790804f55ee', name: SLOTS.headerMenuActions, slot: resources.SLOTS.headerMenuActions }), index.h("slot", { key: 'c9b54cd7003e3ff18c000fb32215b9dd0de6586e', name: SLOTS.fab, slot: resources.SLOTS.fab }), index.h("slot", { key: 'bf3b9d2fcbbda75832d3c27a4a5118b7eca0c891', name: SLOTS.contentTop, slot: resources.SLOTS.contentTop }), index.h("slot", { key: 'db86d0c4aa3b8655e6566462d47c33d2ae2a8518', name: SLOTS.contentBottom, slot: resources.SLOTS.contentBottom }), index.h("slot", { key: '98d5f7a2864e00b5f5a13110b892c7f52c12cf93', name: SLOTS.footerStart, slot: resources.SLOTS.footerStart }), index.h("slot", { key: '8a104a39303414390b745f23987466abaa7a874c', name: SLOTS.footer, slot: resources.SLOTS.footer }), index.h("slot", { key: '15673502ce16cab5f70c6be6204c8b9d59c3ce88', name: SLOTS.footerEnd, slot: resources.SLOTS.footerEnd }), index.h("slot", { key: '7dfb7dd86d4019c9256adccc7b16554b9fe0a05c' })))))));
+            } }, this.modal ? (index.h("calcite-scrim", { class: CSS.scrim, onClick: this.handleOutsideClose })) : null, index.h("div", { key: 'be47093e3a955ce45a71c555700143a4a1c7a166', "aria-description": description, "aria-label": heading, "aria-modal": dom.toAriaBoolean(this.modal), class: CSS.dialog, onKeyDown: this.handleKeyDown, ref: this.setTransitionEl, role: "dialog" }, assistiveText ? (index.h("div", { "aria-live": "polite", class: CSS.assistiveText, key: "assistive-text" }, assistiveText)) : null, index.h("slot", { key: '6ed9f10ae7d5ecc1ec9062d6aba559001d5194e6', name: SLOTS.content }, index.h("calcite-panel", { key: 'cd6ebaa7d7362cbeb70e9ae623f38298d1e831e3', 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.handleInternalPanelCloseClick, onCalcitePanelScroll: this.handleInternalPanelScroll, onKeyDown: this.handlePanelKeyDown, overlayPositioning: this.overlayPositioning, ref: (el) => (this.panelEl = el), scale: this.scale }, index.h("slot", { key: '2ce955775c33b09fc849a083d0bcc1c8ce523dd8', name: SLOTS.actionBar, slot: resources.SLOTS.actionBar }), index.h("slot", { key: 'dd44184de251320af6225baa2e59571b881a23cd', name: SLOTS.alerts, slot: resources.SLOTS.alerts }), index.h("slot", { key: 'da343a1a10e015b04b37463c10592e612a576e9b', name: SLOTS.headerActionsStart, slot: resources.SLOTS.headerActionsStart }), index.h("slot", { key: '6680fde2bd7ad6dc5803c78ea7250d11d4920b7c', name: SLOTS.headerActionsEnd, slot: resources.SLOTS.headerActionsEnd }), index.h("slot", { key: 'a17ca64188ffe6000792e67eafc838df575ebbc3', name: SLOTS.headerContent, slot: resources.SLOTS.headerContent }), index.h("slot", { key: '7e048c4a9104053ca0a61ab2514b018efb4fc872', name: SLOTS.headerMenuActions, slot: resources.SLOTS.headerMenuActions }), index.h("slot", { key: '6760c8a6c105a511fcb859cfd222f8c1355a82c4', name: SLOTS.fab, slot: resources.SLOTS.fab }), index.h("slot", { key: 'e0f2e7644281d408d8c21ce5bf16b08af0a59c3b', name: SLOTS.contentTop, slot: resources.SLOTS.contentTop }), index.h("slot", { key: '01889c3b7fc13bc49521c27feb2ab35346552504', name: SLOTS.contentBottom, slot: resources.SLOTS.contentBottom }), index.h("slot", { key: '593bad35110b5d7e7b44d598b397e4b87cc28e28', name: SLOTS.footerStart, slot: resources.SLOTS.footerStart }), index.h("slot", { key: '5e84099e096a6afb678cce9731b189f4011dc067', name: SLOTS.footer, slot: resources.SLOTS.footer }), index.h("slot", { key: '69a805bd0c1f43a6d165939e62db562428f39f11', name: SLOTS.footerEnd, slot: resources.SLOTS.footerEnd }), index.h("slot", { key: 'b49e14ff6d2c63caaa8fd296920618e7673eb71b' })))))));
     }
     effectiveLocaleChange() {
         t9n.updateMessages(this, this.effectiveLocale);

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

@@ -7,25 +7,25 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5a0af791.js');
-const dom = require('./dom-3d3a8f25.js');
-const floatingUi = require('./floating-ui-9ff03df8.js');
-const guid = require('./guid-42cda8c9.js');
-const interactive = require('./interactive-3b85d8df.js');
-const key = require('./key-82084ef6.js');
-const loadable = require('./loadable-0e357195.js');
-const observers = require('./observers-5f9f67ee.js');
-const openCloseComponent = require('./openCloseComponent-b66f10f5.js');
-const component = require('./component-7f2bd646.js');
-const resources = require('./resources-9b04cd8c.js');
-require('./resources-f11e9bd6.js');
-require('./browser-2893460e.js');
+const index = require('./index-4b68e4b4.js');
+const dom = require('./dom-795d4a33.js');
+const floatingUi = require('./floating-ui-0f85d59c.js');
+const guid = require('./guid-e84a8375.js');
+const interactive = require('./interactive-a128ac30.js');
+const key = require('./key-47c9469a.js');
+const loadable = require('./loadable-1c888c87.js');
+const observers = require('./observers-18d87cb5.js');
+const openCloseComponent = require('./openCloseComponent-3c540d25.js');
+const component = require('./component-5d190962.js');
+const resources = require('./resources-eeda5acf.js');
+require('./resources-18f799c7.js');
+require('./browser-333a21c5.js');
 require('./debounce-7f1e04d6.js');
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.2
+ * v2.13.0
  */
 const SLOTS = {
     dropdownTrigger: "trigger",
@@ -48,6 +48,7 @@ const Dropdown = class {
         this.resizeObserver = observers.createObserver("resize", (entries) => this.resizeObserverCallback(entries));
         this.openTransitionProp = "opacity";
         this.guid = `calcite-dropdown-${guid.guid()}`;
+        this.focusLastDropdownItem = false;
         //--------------------------------------------------------------------------
         //
         //  Private Methods
@@ -132,38 +133,44 @@ const Dropdown = class {
             if (defaultPrevented) {
                 return;
             }
-            if (this.open) {
-                if (key$1 === "Escape") {
-                    this.closeCalciteDropdown();
-                    event.preventDefault();
-                    return;
-                }
-                else if (event.shiftKey && key$1 === "Tab") {
-                    this.closeCalciteDropdown();
-                    event.preventDefault();
-                    return;
-                }
-            }
-            if (key.isActivationKey(key$1)) {
-                this.openCalciteDropdown();
+            if (key$1 === "Escape") {
+                this.closeCalciteDropdown();
                 event.preventDefault();
+                return;
             }
-            else if (key$1 === "Escape") {
+            if (this.open && event.shiftKey && key$1 === "Tab") {
                 this.closeCalciteDropdown();
                 event.preventDefault();
+                return;
+            }
+            if (key.isActivationKey(key$1)) {
+                this.toggleDropdown();
+                event.preventDefault();
+            }
+            else if (key$1 === "ArrowDown" || key$1 === "ArrowUp") {
+                this.focusLastDropdownItem = key$1 === "ArrowUp";
+                this.open = true;
+                this.el.addEventListener("calciteDropdownOpen", this.onOpenEnd);
             }
         };
-        this.focusOnFirstActiveOrFirstItem = () => {
-            this.getFocusableElement(this.getTraversableItems().find((item) => item.selected) || this.items[0]);
+        this.focusOnFirstActiveOrDefaultItem = () => {
+            const selectedItem = this.getTraversableItems().find((item) => item.selected);
+            const target = selectedItem ||
+                (this.focusLastDropdownItem ? this.items[this.items.length - 1] : this.items[0]);
+            this.focusLastDropdownItem = false;
+            if (!target) {
+                return;
+            }
+            dom.focusElement(target);
         };
-        this.toggleOpenEnd = () => {
-            this.focusOnFirstActiveOrFirstItem();
-            this.el.removeEventListener("calciteDropdownOpen", this.toggleOpenEnd);
+        this.onOpenEnd = () => {
+            this.focusOnFirstActiveOrDefaultItem();
+            this.el.removeEventListener("calciteDropdownOpen", this.onOpenEnd);
         };
-        this.openCalciteDropdown = () => {
+        this.toggleDropdown = () => {
             this.open = !this.open;
             if (this.open) {
-                this.el.addEventListener("calciteDropdownOpen", this.toggleOpenEnd);
+                this.el.addEventListener("calciteDropdownOpen", this.onOpenEnd);
             }
         };
         this.open = false;
@@ -230,7 +237,6 @@ const Dropdown = class {
             this.openHandler();
             openCloseComponent.onToggleOpenCloseComponent(this);
         }
-        interactive.connectInteractive(this);
         this.updateItems();
         floatingUi.connectFloatingUI(this, this.referenceEl, this.floatingEl);
     }
@@ -247,16 +253,15 @@ const Dropdown = class {
     disconnectedCallback() {
         this.mutationObserver?.disconnect();
         this.resizeObserver?.disconnect();
-        interactive.disconnectInteractive(this);
         floatingUi.disconnectFloatingUI(this, this.referenceEl, this.floatingEl);
     }
     render() {
         const { open, guid } = this;
-        return (index.h(index.Host, { key: '4b3349c1645b7d39263a20b688f7645d92148f23' }, index.h(interactive.InteractiveContainer, { key: 'db1d56073b9f9db2fbf6eaef824e3f12411dd174', disabled: this.disabled }, index.h("div", { key: '05de1bb5f3641147441f18eaeae104acb06e47c6', class: "calcite-trigger-container", id: `${guid}-menubutton`, onClick: this.openCalciteDropdown, onKeyDown: this.keyDownHandler, ref: this.setReferenceEl }, index.h("slot", { key: '39b976c808c4f44983f2d6a056bb128537cf1aae', "aria-controls": `${guid}-menu`, "aria-expanded": dom.toAriaBoolean(open), "aria-haspopup": "menu", name: SLOTS.dropdownTrigger, onSlotchange: this.updateTriggers })), index.h("div", { key: '57ba0f8d3632febcab69b706a73a910f54f09b62', "aria-hidden": dom.toAriaBoolean(!open), class: "calcite-dropdown-wrapper", ref: this.setFloatingEl }, index.h("div", { key: 'ae7505fa472d323ad6aed6ea0dd2ab7fdf8e7e59', "aria-labelledby": `${guid}-menubutton`, class: {
+        return (index.h(index.Host, { key: '377c3d9687bc025f004b4efe58bfa5f0893d86d0' }, index.h(interactive.InteractiveContainer, { key: '9e2f48be045fc6db10cc7203a8b998ec2b6abafd', disabled: this.disabled }, index.h("div", { key: '8607de2d53a4f8c4b29206ee56aa23ad4c2cbe3d', class: "calcite-trigger-container", id: `${guid}-menubutton`, onClick: this.toggleDropdown, onKeyDown: this.keyDownHandler, ref: this.setReferenceEl }, index.h("slot", { key: '07de8df34055ddc39301654a5ca312ddf293e6a9', "aria-controls": `${guid}-menu`, "aria-expanded": dom.toAriaBoolean(open), "aria-haspopup": "menu", name: SLOTS.dropdownTrigger, onSlotchange: this.updateTriggers })), index.h("div", { key: 'c1469efb62eb704b021ce6479ad55deda59582d4', "aria-hidden": dom.toAriaBoolean(!open), class: "calcite-dropdown-wrapper", ref: this.setFloatingEl }, index.h("div", { key: 'f875166d486a53cd393f17d9295974aa449d449f', "aria-labelledby": `${guid}-menubutton`, class: {
                 ["calcite-dropdown-content"]: true,
                 [floatingUi.FloatingCSS.animation]: true,
                 [floatingUi.FloatingCSS.animationActive]: open,
-            }, id: `${guid}-menu`, ref: this.setScrollerAndTransitionEl, role: "menu" }, index.h("slot", { key: 'ae94137311b106fbed88dfde346002d87e4efcbb', onSlotchange: this.updateGroups }))))));
+            }, id: `${guid}-menu`, ref: this.setScrollerAndTransitionEl, role: "menu" }, index.h("slot", { key: 'bc6e61383aaf85b3d6242a86c50da68bc8b31e27', onSlotchange: this.updateGroups }))))));
     }
     //--------------------------------------------------------------------------
     //
@@ -299,7 +304,7 @@ const Dropdown = class {
         if (this.disabled || this.type !== "hover") {
             return;
         }
-        this.openCalciteDropdown();
+        this.toggleDropdown();
     }
     pointerLeaveHandler() {
         if (this.disabled || this.type !== "hover") {
@@ -391,12 +396,6 @@ const Dropdown = class {
             dom.focusElement(this.triggers[0]);
         }
     }
-    getFocusableElement(item) {
-        if (!item) {
-            return;
-        }
-        dom.focusElement(item);
-    }
     updateTabIndexOfItems(target) {
         this.items.forEach((item) => {
             item.tabIndex = target !== item ? -1 : 0;
@@ -468,9 +467,9 @@ const DropdownItem = class {
     }
     render() {
         const { href, selectionMode, label, iconFlipRtl } = this;
-        const iconStartEl = (index.h("calcite-icon", { key: '46fd6784a80e78a149e6796018f495f33c9fe172', class: resources.CSS.iconStart, flipRtl: iconFlipRtl === "start" || iconFlipRtl === "both", icon: this.iconStart, scale: component.getIconScale(this.scale) }));
-        const contentNode = (index.h("span", { key: 'feee494a9e26fad963b71e5aacf3abf9084ec463', class: resources.CSS.itemContent }, index.h("slot", { key: '33e49b095819a250f469d457279f6a340ff31fd4' })));
-        const iconEndEl = (index.h("calcite-icon", { key: 'ea58bc58292cf76bcda6826e3c402079b0d3ad69', class: resources.CSS.iconEnd, flipRtl: iconFlipRtl === "end" || iconFlipRtl === "both", icon: this.iconEnd, scale: component.getIconScale(this.scale) }));
+        const iconStartEl = (index.h("calcite-icon", { key: '1ec1c941651dda8f39fa15427592141f04180f3e', class: resources.CSS.iconStart, flipRtl: iconFlipRtl === "start" || iconFlipRtl === "both", icon: this.iconStart, scale: component.getIconScale(this.scale) }));
+        const contentNode = (index.h("span", { key: '3ab167ed4054ca34b4e13e72b752af6cf25522ae', class: resources.CSS.itemContent }, index.h("slot", { key: '88cf44809fb48450c66cc8f105bbda008a78157d' })));
+        const iconEndEl = (index.h("calcite-icon", { key: '32fb27182943a032c0037f1f878a95c194d2dff1', class: resources.CSS.iconEnd, flipRtl: iconFlipRtl === "end" || iconFlipRtl === "both", icon: this.iconEnd, scale: component.getIconScale(this.scale) }));
         const slottedContent = this.iconStart && this.iconEnd
             ? [iconStartEl, contentNode, iconEndEl]
             : this.iconStart
@@ -488,7 +487,7 @@ const DropdownItem = class {
                     : "menuitem";
         const itemAria = selectionMode !== "none" ? dom.toAriaBoolean(this.selected) : null;
         const { disabled } = this;
-        return (index.h(index.Host, { key: '269693a7a036a7e39f4f8d529695df44f34df22a', "aria-checked": itemAria, "aria-label": !href ? label : "", role: itemRole, tabIndex: disabled ? -1 : 0 }, index.h(interactive.InteractiveContainer, { key: '0c644e048c9e30b8062cd60f7574c3e8fb631b4c', disabled: disabled }, index.h("div", { key: 'd5c9098d6c3007d5f05b28770074f6833a43d53f', class: {
+        return (index.h(index.Host, { key: 'beec8e51bf18bdcab1928181828b372cc70bb7ee', "aria-checked": itemAria, "aria-label": !href ? label : "", role: itemRole, tabIndex: disabled ? -1 : 0 }, index.h(interactive.InteractiveContainer, { key: '5cbbd1074d6c571f4cac3a99e4a2c09bf113db55', disabled: disabled }, index.h("div", { key: 'bff025aeb280c9d0d829e5cf4d94e9392604e607', class: {
                 [resources.CSS.container]: true,
                 [resources.CSS.containerNone]: selectionMode === "none",
             } }, selectionMode !== "none" ? (index.h("calcite-icon", { class: resources.CSS.icon, icon: selectionMode === "multiple" ? "check" : "bullet-point", scale: component.getIconScale(this.scale) })) : null, contentEl))));

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

@@ -7,18 +7,18 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5a0af791.js');
-const dom = require('./dom-3d3a8f25.js');
-const interactive = require('./interactive-3b85d8df.js');
-const loadable = require('./loadable-0e357195.js');
-require('./guid-42cda8c9.js');
-require('./resources-f11e9bd6.js');
-require('./browser-2893460e.js');
+const index = require('./index-4b68e4b4.js');
+const dom = require('./dom-795d4a33.js');
+const interactive = require('./interactive-a128ac30.js');
+const loadable = require('./loadable-1c888c87.js');
+require('./guid-e84a8375.js');
+require('./resources-18f799c7.js');
+require('./browser-333a21c5.js');
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.2
+ * v2.13.0
  */
 const CSS = {
     button: "button",
@@ -49,9 +49,6 @@ const Fab = class {
     //  Lifecycle
     //
     //--------------------------------------------------------------------------
-    connectedCallback() {
-        interactive.connectInteractive(this);
-    }
     componentWillLoad() {
         loadable.setUpLoadableComponent(this);
     }
@@ -61,9 +58,6 @@ const Fab = class {
     componentDidRender() {
         interactive.updateHostInteraction(this);
     }
-    disconnectedCallback() {
-        interactive.disconnectInteractive(this);
-    }
     // --------------------------------------------------------------------------
     //
     //  Methods
@@ -82,7 +76,7 @@ const Fab = class {
     render() {
         const { appearance, kind, disabled, loading, scale, textEnabled, icon, label, text, iconFlipRtl, } = this;
         const title = !textEnabled ? label || text || null : null;
-        return (index.h(interactive.InteractiveContainer, { key: 'a3f179f9542d93366d6befded12604369f905580', disabled: disabled }, index.h("calcite-button", { key: '2adc3c8d6408743bfa905995ce75c7ed4d241733', appearance: appearance === "solid" ? "solid" : "outline-fill", class: CSS.button, disabled: disabled, iconFlipRtl: iconFlipRtl ? "start" : null, iconStart: icon, kind: kind, label: label, loading: loading, ref: (buttonEl) => {
+        return (index.h(interactive.InteractiveContainer, { key: '7953bd06defeddfed5530500901609524f7b58fd', disabled: disabled }, index.h("calcite-button", { key: 'c2bbe2be5e2ac375abab75024005f1eb5afed51c', appearance: appearance === "solid" ? "solid" : "outline-fill", class: CSS.button, disabled: disabled, iconFlipRtl: iconFlipRtl ? "start" : null, iconStart: icon, kind: kind, label: label, loading: loading, ref: (buttonEl) => {
                 this.buttonEl = buttonEl;
             }, round: true, scale: scale, title: title, type: "button", width: "auto" }, this.textEnabled ? this.text : null)));
     }