@esri/solutions-components 0.10.10 → 0.10.12

package/dist/components/instant-apps-sign-in2.js

@@ -15,14 +15,14 @@ import { d as defineCustomElement$3 } from './icon.js';
 import { d as defineCustomElement$2 } from './loader.js';
 import { d as defineCustomElement$1 } from './navigation-user.js';
 
-const instantAppsSignInCss = ":host{display:block;box-shadow:none !important}:host .instant-apps-sign-in__container{height:inherit;display:flex;align-items:center}:host .instant-apps-sign-in__container calcite-dropdown,:host .instant-apps-sign-in__container calcite-navigation-user{height:100%}:host .instant-apps-sign-in__container .instant-apps-sign-in__sign-in-btn{margin:10px}:host .instant-apps-sign-in__container calcite-dropdown[scale=m] calcite-dropdown-group{min-width:140px}:host .instant-apps-sign-in__container calcite-dropdown[scale=s] calcite-dropdown-group{min-width:100px}:host .instant-apps-sign-in__container button{height:32px;width:32px;padding:0;box-sizing:border-box;display:flex;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;appearance:none;-moz-appearance:none;-webkit-appearance:none;text-decoration-line:none;transition:color var(--calcite-animation-timing) ease-in-out, background-color var(--calcite-animation-timing) ease-in-out, box-shadow var(--calcite-animation-timing) ease-in-out, outline-color var(--calcite-internal-animation-timing-fast) ease-in-out;border:none;border-radius:50%;background:#000}:host .instant-apps-sign-in__container button:hover calcite-avatar{opacity:0.7;transition:0.3s}:host .instant-apps-sign-in__landing-page{display:flex;flex-direction:column;justify-content:center;padding:40px;width:50%;min-height:30%;background:rgba(255, 255, 255, 0.8);color:#151515;text-align:center}:host .instant-apps-sign-in__landing-page h1{font-size:22px;margin:10px 0}:host .instant-apps-sign-in__landing-page h2{font-size:16px;margin:0 0 10px}:host .instant-apps-sign-in__landing-page p{font-size:16px;margin:0}:host .instant-apps-sign-in__landing-page-btns{display:flex;justify-content:space-between;margin-top:40px}:host .instant-apps-sign-in__landing-page-btns calcite-button{width:calc(50% - 5px);--calcite-color-brand:var(--instant-apps-landing-page-entry-button-color);--calcite-color-brand-hover:var(--instant-apps-landing-page-entry-button-color);--calcite-color-brand-press:var(--instant-apps-landing-page-entry-button-color)}:host .instant-apps-sign-in__landing-page-btns calcite-button:hover{filter:contrast(0.8)}@media screen and (max-width: 767px){:host .instant-apps-sign-in__landing-page-btns{flex-direction:column;width:100%;align-items:center;height:76px}:host .instant-apps-sign-in__landing-page-btns calcite-button{width:100%}}";
+const instantAppsSignInCss = ":host{display:block;box-shadow:none !important}:host .instant-apps-sign-in__container{height:inherit;display:flex;align-items:center}:host .instant-apps-sign-in__container calcite-dropdown,:host .instant-apps-sign-in__container calcite-navigation-user{height:100%}:host .instant-apps-sign-in__container calcite-navigation-user{--calcite-color-foreground-2:rgba(0, 0, 0, 0.04);--calcite-color-foreground-3:rgba(0, 0, 0, 0.04)}:host .instant-apps-sign-in__container .instant-apps-sign-in__sign-in-btn{margin:10px}:host .instant-apps-sign-in__container calcite-dropdown[scale=m] calcite-dropdown-group{min-width:140px}:host .instant-apps-sign-in__container calcite-dropdown[scale=s] calcite-dropdown-group{min-width:100px}:host .instant-apps-sign-in__container button{height:32px;width:32px;padding:0;box-sizing:border-box;display:flex;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;appearance:none;-moz-appearance:none;-webkit-appearance:none;text-decoration-line:none;transition:color var(--calcite-animation-timing) ease-in-out, background-color var(--calcite-animation-timing) ease-in-out, box-shadow var(--calcite-animation-timing) ease-in-out, outline-color var(--calcite-internal-animation-timing-fast) ease-in-out;border:none;border-radius:50%;background:#000}:host .instant-apps-sign-in__container button:hover calcite-avatar{opacity:0.7;transition:0.3s}:host .instant-apps-sign-in__landing-page{display:flex;flex-direction:column;justify-content:center;padding:40px;width:50%;min-height:30%;background:rgba(255, 255, 255, 0.8);color:#151515;text-align:center}:host .instant-apps-sign-in__landing-page h1{font-size:22px;margin:10px 0}:host .instant-apps-sign-in__landing-page h2{font-size:16px;margin:0 0 10px}:host .instant-apps-sign-in__landing-page p{font-size:16px;margin:0}:host .instant-apps-sign-in__entry-button{--calcite-color-brand:var(--instant-apps-landing-page-entry-button-color);--calcite-color-brand-hover:var(--instant-apps-landing-page-entry-button-color);--calcite-color-brand-press:var(--instant-apps-landing-page-entry-button-color)}@media screen and (max-width: 767px){:host{flex-direction:column;align-items:center}:host calcite-button{width:100%}:host .instant-apps-sign-in__entry-button-container{display:flex;flex-direction:column}}";
 const InstantAppsSignInStyle0 = instantAppsSignInCss;
 
 const CSS = {
     base: 'instant-apps-sign-in__container',
-    landing: 'instant-apps-sign-in__landing-page',
-    landingBtn: 'instant-apps-sign-in__landing-page-btns',
     SignInBtn: 'instant-apps-sign-in__sign-in-btn',
+    buttonContainer: 'instant-apps-sign-in__entry-button-container',
+    entryButton: 'instant-apps-sign-in__entry-button',
 };
 const InstantAppsSignIn = /*@__PURE__*/ proxyCustomElement(class InstantAppsSignIn extends HTMLElement {
     constructor() {
@@ -55,7 +55,7 @@ const InstantAppsSignIn = /*@__PURE__*/ proxyCustomElement(class InstantAppsSign
     }
     render() {
         const signIn = this.ready ? this.renderContent() : null;
-        return h(Host, { key: 'c1ab5c3ab42d485e7214b2635c127e614b573e4c' }, signIn);
+        return h(Host, { key: 'f2e2d8eb7db6b7817dd5b7d943cb602e2474431a' }, signIn);
     }
     renderContent() {
         return this.type === 'landingPage' ? this.renderLandingPageSignIn() : this.renderSignInContainer();
@@ -76,7 +76,7 @@ const InstantAppsSignIn = /*@__PURE__*/ proxyCustomElement(class InstantAppsSign
     }
     renderLandingPageSignIn() {
         var _a, _b;
-        return (h("div", { class: CSS.landing }, h("h1", null, this.titleText), h("h2", null, this.subtitleText), h("p", null, this.descriptionText), h("div", { class: CSS.landingBtn }, h("calcite-button", { onClick: this.landingPageSignIn.bind(this) }, (_a = this.messages) === null || _a === void 0 ? void 0 : _a.signIn), h("calcite-button", { onClick: this.guestOnClick.bind(this), appearance: "outline" }, (_b = this.messages) === null || _b === void 0 ? void 0 : _b.continueAsGuest))));
+        return (h("div", { class: CSS.buttonContainer }, h("calcite-button", { class: CSS.entryButton, scale: "l", appearance: "outline-fill", width: "half", onClick: this.landingPageSignIn.bind(this) }, (_a = this.messages) === null || _a === void 0 ? void 0 : _a.signIn), h("calcite-button", { class: CSS.entryButton, scale: "l", appearance: "outline-fill", width: "half", onClick: this.guestOnClick.bind(this) }, (_b = this.messages) === null || _b === void 0 ? void 0 : _b.continueAsGuest)));
     }
     async initSignIn() {
         if (this.portal == null || this.oauthappid == null)
@@ -92,66 +92,51 @@ const InstantAppsSignIn = /*@__PURE__*/ proxyCustomElement(class InstantAppsSign
         this.idManager.registerOAuthInfos([this.info]);
         this.isSignedIn = await this.checkSignInStatus();
         this.ready = true;
-        this.watchCredential();
-        reactiveUtils
-            .whenOnce(() => this.portal.user)
-            .then(() => {
-            this.user = this.portal.user;
-            this.ready = true;
-        });
+        await reactiveUtils.whenOnce(() => this.portal.user);
+        this.user = this.portal.user;
+        this.ready = true;
     }
-    signIn() {
-        if (this.landingPage) {
-            this.setSignInLocalStorage();
-        }
-        this.idManager
-            .getCredential(this.info.portalUrl + '/sharing', {
+    async signIn() {
+        this.setSignInLocalStorage();
+        await this.idManager.getCredential(`${this.info.portalUrl}/sharing`, {
             oAuthPopupConfirmation: false,
-        })
-            .then(async () => {
-            await this.checkSignInStatus();
         });
+        await this.checkSignInStatus();
     }
     signOut() {
+        var _a;
+        (_a = this.portal.credential) === null || _a === void 0 ? void 0 : _a.destroy();
         this.idManager.destroyCredentials();
         this.portal.authMode = 'anonymous';
-        localStorage.removeItem('_AGO_SESSION_');
-        this.isSignedIn = false;
         this.portal.credential = null;
+        const rdUrl = window.location.href;
+        this.setSignInLocalStorage();
+        window.location.href = `${this.portal.restUrl}/oauth2/signout?client_id=${this.oauthappid}&redirect_uri=${rdUrl}`;
     }
-    landingPageSignIn() {
-        if (!this.isSignedIn) {
-            this.setSignInLocalStorage();
-            this.signIn();
-        }
-        else if (this.closeLandingPage != null) {
+    async landingPageSignIn() {
+        await this.signIn();
+        if (this.closeLandingPage != null) {
             this.closeLandingPage();
         }
     }
     guestOnClick() {
-        this.signOut();
-        if (this.closeLandingPage != null) {
+        if (this.isSignedIn) {
+            this.signOut();
+        }
+        else if (this.closeLandingPage != null) {
             this.closeLandingPage();
         }
     }
-    checkSignInStatus() {
-        return new Promise(resolve => {
-            this.idManager
-                .checkSignInStatus(this.info.portalUrl + '/sharing')
-                .then(async (credential) => {
-                this.portal.credential = credential;
-                resolve(true);
-            })
-                .catch(() => {
-                this.portal.credential = null;
-                resolve(false);
-            });
-        });
-    }
-    watchCredential() {
-        this.portal.addHandles(this.portal.watch('credential', credential => {
-            this.isSignedIn = credential != null;
-        }));
+    async checkSignInStatus() {
+        try {
+            const credential = await this.idManager.checkSignInStatus(`${this.info.portalUrl}/sharing`);
+            this.portal.credential = credential;
+            return true;
+        }
+        catch (_a) {
+            this.portal.credential = null;
+            return false;
+        }
     }
     setSignInLocalStorage() {
         const date = new Date();

package/dist/components/interactive.js

@@ -9,7 +9,7 @@ import { g as getUserAgentString } from './browser.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.11.1
+ * v2.12.0
  */
 // ⚠️ browser-sniffing is not a best practice and should be avoided ⚠️
 const isFirefox = /firefox/i.test(getUserAgentString());
@@ -157,8 +157,6 @@ function disconnectInteractive(component) {
 const CSS = {
     container: "interaction-container",
 };
-function InteractiveContainer({ disabled }, children) {
-    return (h("div", { class: CSS.container, inert: disabled }, ...children));
-}
+const InteractiveContainer = ({ disabled }, children) => (h("div", { class: CSS.container, inert: disabled }, ...children));
 
 export { InteractiveContainer as I, connectInteractive as c, disconnectInteractive as d, updateHostInteraction as u };

package/dist/components/json-editor2.js

@@ -90,7 +90,7 @@ const JsonEditor = /*@__PURE__*/ proxyCustomElement(class JsonEditor extends HTM
      * Renders the component.
      */
     render() {
-        return (h(Host, { key: '160ba6c2961d67add84b4f23b4aacd2213d064b2' }, h("div", { key: 'bf0a77eed1d206376244526db6a261cce163ca69', id: `${this.instanceid}-editor-container`, class: "editor-container padding-right" }, h("div", { key: '65a0f2f69d4b7f9694a6617755c638d9ad19e168', class: "editor-controls" }, h("div", { key: '3fccc399a3e2a45fe55a374c869a7a7c7533eafc', class: "editor-buttons" }, h("calcite-icon", { key: '5007e48c8ecf9d5a037e062bbb3b5ee3710b18eb', id: `${this.instanceid}-errorFlag`, icon: "exclamation-mark-triangle", title: this._translations.errorFlag, scale: "s", class: "edit-error-flag" }), h("calcite-button", { key: '37f8abf8027e0743e373de473421d06884f61d0b', id: `${this.instanceid}-undo`, color: "blue", appearance: "solid", title: this._translations.undo, onClick: () => this._undo(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: '31c88e27793f4e07ccc20df6d6c88fa0d6661977', icon: "undo", scale: "s" })), h("calcite-button", { key: '56a5945e706a5c66044678f768d567286893c7b1', id: `${this.instanceid}-redo`, color: "blue", appearance: "solid", title: this._translations.redo, onClick: () => this._redo(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: 'b2a2d56e6818ee09be15114fcab357732f9f0c99', icon: "redo", scale: "s" })), h("calcite-button", { key: '63acf48f78d1f9cdcd86c5862e399be2217a16c1', id: `${this.instanceid}-diff`, color: "blue", appearance: "solid", title: this._translations.diff, onClick: () => this._toggleEditor(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: '677f9c42bbb449fb51325a9dd4b60affd8a73cd7', icon: "compare", scale: "s" })), h("calcite-button", { key: '7cf8fac59ad4096ed541bfd1e6454cec70890c72', id: `${this.instanceid}-search`, appearance: "outline", color: "blue", title: this._translations.search, onClick: () => this._search(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: '1e2e4290e7b7254a533a99d85ea2745050b22e55', icon: "search", scale: "s" })), h("calcite-button", { key: 'ec656bcb0a64a6ff6a42760710f8067eae18b9a5', id: `${this.instanceid}-reset`, color: "blue", appearance: "solid", disabled: true, title: this._translations.cancelEdits, onClick: () => this._reset(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: '0210b400f5934c68c45fe61f4bf11d3efca97333', icon: "reset", scale: "s" })))), h("div", { key: 'd14efe742fe79b18a436bf522e33924c2a7e72d5', class: "edit-parent" }, h("div", { key: 'e550bbc5968b71701220a44cba17afa9f5f61c48', id: `${this.instanceid}-container`, class: "json-edit-container" }), h("div", { key: '9778b7229d2f3ec994c8a8d707a7f7b394697823', id: `${this.instanceid}-diff-container`, class: "json-edit-container display-none" })))));
+        return (h(Host, { key: '01ac5edcc26e82397316e8a01229a3d27d6902af' }, h("div", { key: '87e015e58f6a1822ba202f660655078b7f7c1a8c', id: `${this.instanceid}-editor-container`, class: "editor-container padding-right" }, h("div", { key: '90d98682605a514797da3dc11a9f68dad336759b', class: "editor-controls" }, h("div", { key: 'c5eca5a9750d8f010ce9d749cfe7529a0b5c95c6', class: "editor-buttons" }, h("calcite-icon", { key: '5cdea0dc714261c6fa454d43c5fd3ba3902d9eac', id: `${this.instanceid}-errorFlag`, icon: "exclamation-mark-triangle", title: this._translations.errorFlag, scale: "s", class: "edit-error-flag" }), h("calcite-button", { key: 'e7f8e33c62c98a887b06bf20d5a718849f1455c6', id: `${this.instanceid}-undo`, color: "blue", appearance: "solid", title: this._translations.undo, onClick: () => this._undo(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: 'fb3e4ea4d2120bd2fce4541c6c90b1d16fe7da2f', icon: "undo", scale: "s" })), h("calcite-button", { key: 'ba214ef0fa2d27d4334dd4b10d7bf15c35b49407', id: `${this.instanceid}-redo`, color: "blue", appearance: "solid", title: this._translations.redo, onClick: () => this._redo(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: 'da359a0692ff1dd777588ab657f2520ca62eeb93', icon: "redo", scale: "s" })), h("calcite-button", { key: '569955fc77faf069f66b3c7376973822cc17f038', id: `${this.instanceid}-diff`, color: "blue", appearance: "solid", title: this._translations.diff, onClick: () => this._toggleEditor(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: 'e477c4ae6d3b2cda3bdcc56660739ffab9b271c1', icon: "compare", scale: "s" })), h("calcite-button", { key: 'a691eb75c7487c6b401f4d35a4e7e8ac84e0d8f9', id: `${this.instanceid}-search`, appearance: "outline", color: "blue", title: this._translations.search, onClick: () => this._search(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: '7a0cc6c45b49fb6db3963e7325291dd36dbc95ac', icon: "search", scale: "s" })), h("calcite-button", { key: '1ac31fcbb93e38aff565559174b45a5ef286dc01', id: `${this.instanceid}-reset`, color: "blue", appearance: "solid", disabled: true, title: this._translations.cancelEdits, onClick: () => this._reset(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: 'abcc13ccb46312d8169196af5336bf8d25882ac8', icon: "reset", scale: "s" })))), h("div", { key: 'd70a08eec3c817a38dafb6ed15085efbc3aed090', class: "edit-parent" }, h("div", { key: '6cdec935e00ba08af533c7b2ca565f9a6fefc268', id: `${this.instanceid}-container`, class: "json-edit-container" }), h("div", { key: '1611a95a808ba19133d4c3d5bec6def362771746', id: `${this.instanceid}-diff-container`, class: "json-edit-container display-none" })))));
     }
     //--------------------------------------------------------------------------
     //

package/dist/components/key.js

@@ -6,7 +6,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.11.1
+ * v2.12.0
  */
 function isActivationKey(key) {
     return key === "Enter" || key === " ";

package/dist/components/label.js

@@ -9,7 +9,7 @@ import { c as componentOnReady } from './component.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.11.1
+ * v2.12.0
  */
 /**
  * Exported for testing purposes only

package/dist/components/label2.js

@@ -9,7 +9,7 @@ import { a as associateExplicitLabelToUnlabeledComponent, l as labelConnectedEve
 /*!
  * 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.11.1
+ * v2.12.0
  */
 const CSS = {
     container: "container",
@@ -30,6 +30,9 @@ const Label = /*@__PURE__*/ proxyCustomElement(class Label extends HTMLElement {
         //
         //--------------------------------------------------------------------------
         this.labelClickHandler = (event) => {
+            if (window.getSelection()?.type === "Range") {
+                return;
+            }
             this.calciteInternalLabelClick.emit({
                 sourceEvent: event,
             });
@@ -54,7 +57,7 @@ const Label = /*@__PURE__*/ proxyCustomElement(class Label extends HTMLElement {
         document.dispatchEvent(new CustomEvent(labelDisconnectedEvent));
     }
     render() {
-        return (h(Host, { key: '41b0e79fa4984972606fb6c73a9940413f8f863a', onClick: this.labelClickHandler }, h("div", { key: '21adb621d9944f95bdf632c0717f9debdc844865', class: CSS.container }, h("slot", { key: 'cea575ac40565f9aff87e8ad36653b785f758224' }))));
+        return (h(Host, { key: '739ed848a243f79c054a6f54053c51f9242894d3', onClick: this.labelClickHandler }, h("div", { key: '8120cfb138e2400638a63a11e734fad32116bc4a', class: CSS.container }, h("slot", { key: 'b46b9328d7b02ed9e959d8db45e4fdb9711e969a' }))));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/components/layer-table2.js

@@ -530,7 +530,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
         const selected = this.selectedIds.length.toString();
         const tableHeightClass = this.isMobile ? "height-full" : "height-full-adjusted";
         this._validateActiveActions();
-        return (h(Host, { key: '17071727cb283d84afb8beab8382bd3623f35920' }, h("calcite-shell", { key: 'f8508d67fd4b100fdc3f52b7db63194714cf216b' }, this._getTableControlRow("header"), h("div", { key: '5c1ebcb0530764a9568dc5dae153632a3d9491c8', class: `width-full ${tableHeightClass}` }, h("calcite-panel", { key: '7a6420894e4e50e2b4cda6e5ebe043134f4c0397', class: "height-full width-full" }, h("calcite-loader", { key: '48d4fe7e27fae877ca0e4caa22555968636f6c33', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), h("div", { key: 'cce71356e8ca141d1a18b32944d4fa03af8aae33', class: tableNodeClass, ref: this.onTableNodeCreate })), !this.isMobile ? (h("div", { class: "bottom-left text-color height-19" }, this._translations.recordsSelected
+        return (h(Host, { key: '388b0c1f6fc251361b3e1d93310c5077a8244f1f' }, h("calcite-shell", { key: 'ed4d6f8b884ecba4dbcd6b747528fd2e83a2717d' }, this._getTableControlRow("header"), h("div", { key: '6d86a54602feda5dad9e9d4097c9b8e3fe80227c', class: `width-full ${tableHeightClass}` }, h("calcite-panel", { key: 'dc4c986af144111acbd21aee82318c90ee920a42', class: "height-full width-full" }, h("calcite-loader", { key: 'd96bbbfa441f9e968fd04e5d17b80c298b690a49', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), h("div", { key: 'afa9e7dea3b195004ef258745b642c05a77ad62d', class: tableNodeClass, ref: this.onTableNodeCreate })), !this.isMobile ? (h("div", { class: "bottom-left text-color height-19" }, this._translations.recordsSelected
             .replace("{{total}}", total)
             .replace("{{selected}}", selected))) : undefined)), this.createFilterModal && this._filterModal()));
     }

package/dist/components/layout-manager.js

@@ -69,7 +69,7 @@ const LayoutManager$1 = /*@__PURE__*/ proxyCustomElement(class LayoutManager ext
      * Renders the component.
      */
     render() {
-        return (h(Host, { key: '10b8c1f7ee9503c4bd7cb1bbbd8b58cb5009336f' }, h("div", { key: '39ae898c19e24746bfa5f7510006e368f37fe7d5', class: "display-flex" }, h("div", { key: '0080f9562ab26665e26a8447e4484d76e4861f9f', class: "display-flex action-center" }, h("calcite-icon", { key: 'cc941eede331c518fe0944e2bf4b46b0c9799f0c', class: "icon icon-color", icon: "information", id: "app-information-icon", scale: "s" }), h("calcite-popover", { key: 'd92ccbe95f58f15964fd8b5d0d1446216ef780a7', closable: true, label: "", referenceElement: "app-information-icon" }, h("span", { key: '37d306563b80589652c25809233063c60035397b', class: "tooltip-message" }, this._translations.appInfo))), h("div", { key: 'e33a33071990cd0edb32e1c76505ddcc834ae932', class: "header-text" }, this._translations.layout), this._getAction("grid-background", ELayoutMode.GRID, this._translations.grid), this._getAction("vertical-background", ELayoutMode.VERTICAL, this._translations.vertical), this._getAction("horizontal-background", ELayoutMode.HORIZONTAL, this._translations.horizontal))));
+        return (h(Host, { key: 'b21325b44c55b4169b7c14ee8a72d4fb329049c0' }, h("div", { key: '9aa53161553d8daecde88138017758885747d357', class: "display-flex" }, h("div", { key: '4efeebd0ee5b9d288ae37a2f3697049eb71c5d4c', class: "display-flex action-center" }, h("calcite-icon", { key: 'aa2a89bc8b1974c56997478c7a1c4080e2f0e5e1', class: "icon icon-color", icon: "information", id: "app-information-icon", scale: "s" }), h("calcite-popover", { key: '920120df5f5036770308422dafe6c76201af303b', closable: true, label: "", referenceElement: "app-information-icon" }, h("span", { key: 'ed38dc29dd382563b9c38fd171f7380965b88fef', class: "tooltip-message" }, this._translations.appInfo))), h("div", { key: '5d09996c91decfea662e159625ab4c8dd06154ba', class: "header-text" }, this._translations.layout), this._getAction("grid-background", ELayoutMode.GRID, this._translations.grid), this._getAction("vertical-background", ELayoutMode.VERTICAL, this._translations.vertical), this._getAction("horizontal-background", ELayoutMode.HORIZONTAL, this._translations.horizontal))));
     }
     //--------------------------------------------------------------------------
     //

package/dist/components/link.js

@@ -65,17 +65,17 @@ const Link = /*@__PURE__*/ proxyCustomElement(class Link extends HTMLElement {
         const { download, el } = this;
         const dir = getElementDir(el);
         const childElType = this.href ? "a" : "span";
-        const iconStartEl = (h("calcite-icon", { key: '901c80bf0ce7cb55fd322a1e8feb698a30d0f953', class: "calcite-link--icon icon-start", flipRtl: this.iconFlipRtl === "start" || this.iconFlipRtl === "both", icon: this.iconStart, scale: "s" }));
-        const iconEndEl = (h("calcite-icon", { key: 'a7749d95babda99b7f7a3d4792ecbf69409d03c5', class: "calcite-link--icon icon-end", flipRtl: this.iconFlipRtl === "end" || this.iconFlipRtl === "both", icon: this.iconEnd, scale: "s" }));
+        const iconStartEl = (h("calcite-icon", { key: '98cdfc979033eb5e339557d4d1a2143c9db9481d', class: "calcite-link--icon icon-start", flipRtl: this.iconFlipRtl === "start" || this.iconFlipRtl === "both", icon: this.iconStart, scale: "s" }));
+        const iconEndEl = (h("calcite-icon", { key: 'df0cfff6b187899330ec32a74132ca9d6ccb71f6', class: "calcite-link--icon icon-end", flipRtl: this.iconFlipRtl === "end" || this.iconFlipRtl === "both", icon: this.iconEnd, scale: "s" }));
         const Tag = childElType;
         const role = childElType === "span" ? "link" : null;
         const tabIndex = childElType === "span" ? 0 : null;
-        return (h(Host, { key: '58d423e9f5c1bec3135f26c08610ea00d7470d40', role: "presentation" }, h(InteractiveContainer, { key: '41e5cf76b18008ccbd0757a090cdf8b705c5121c', disabled: this.disabled }, h(Tag, { key: '3afbc9c30a4b3ca87361c31f2c0f7b41f0f7b229', class: { [CSS_UTILITY.rtl]: dir === "rtl" },
+        return (h(Host, { key: 'e0db07bcdf54a1558d2ee5f7d72dc6b3c9b7b4fc', role: "presentation" }, h(InteractiveContainer, { key: '84e1d20ffe03e7776560fa3f3bcc51a0e17c39ca', disabled: this.disabled }, h(Tag, { key: '3d37687afd90675d8aab80bce396e765d81b580e', class: { [CSS_UTILITY.rtl]: dir === "rtl" },
             /*
           When the 'download' property of type 'boolean | string' is set to true, the value is "".
           This works around that issue for now.
           */
-            download: Tag === "a" && (download === "" || download) ? download : null, href: Tag === "a" && this.href, onClick: this.childElClickHandler, ref: this.storeTagRef, rel: Tag === "a" && this.rel, role: role, tabIndex: tabIndex, target: Tag === "a" && this.target }, this.iconStart ? iconStartEl : null, h("slot", { key: 'd4c009ba0573c23d7de329e51ad424f008e9b3e3' }), this.iconEnd ? iconEndEl : null))));
+            download: Tag === "a" && (download === "" || download) ? download : null, href: Tag === "a" && this.href, onClick: this.childElClickHandler, ref: this.storeTagRef, rel: Tag === "a" && this.rel, role: role, tabIndex: tabIndex, target: Tag === "a" && this.target }, this.iconStart ? iconStartEl : null, h("slot", { key: '14a04fe0a03318cfa130744530bff8d68450c317' }), this.iconEnd ? iconEndEl : null))));
     }
     //--------------------------------------------------------------------------
     //

package/dist/components/list-flow-item.js

@@ -51,7 +51,7 @@ const ListFlowItem$1 = /*@__PURE__*/ proxyCustomElement(class ListFlowItem exten
     //
     //--------------------------------------------------------------------------
     render() {
-        return (h(Host, { key: '6691ddbcebb6a78570c1a7d1317aadcccf51c6e3' }, h("slot", { key: 'bca9498b533fa13dfc5d85b690a0cc0d80fef1b8' })));
+        return (h(Host, { key: 'de2fbee0068872b2eed39cb528169156a4f69615' }, h("slot", { key: '2fe9659669fe24fd4921c64548dcca0ed57111b9' })));
     }
     static get style() { return ListFlowItemStyle0; }
 }, [1, "list-flow-item"]);

package/dist/components/list-item.js

@@ -16,7 +16,7 @@ import { d as defineCustomElement$3 } from './handle.js';
 import { d as defineCustomElement$2 } from './icon.js';
 import { d as defineCustomElement$1 } from './loader.js';
 
-const listItemCss = ":host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:flex;flex-direction:column;background-color:var(--calcite-color-foreground-1);--calcite-list-item-icon-color:var(--calcite-color-brand)}:host([filter-hidden]),:host([closed]){display:none}.wrapper--bordered{border-block-end:1px solid var(--calcite-color-border-3)}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}.container{box-sizing:border-box;display:flex;flex:1 1 0%;background-color:var(--calcite-color-foreground-1)}.container *{box-sizing:border-box}.container--hover:hover{cursor:pointer;background-color:var(--calcite-color-foreground-2)}.container:active{background-color:var(--calcite-color-foreground-1)}.container--border{border-inline-start-width:4px;border-inline-start-style:solid}.container--border-selected{border-inline-start-color:var(--calcite-color-brand)}.container--border-unselected{border-inline-start-color:transparent}.container:hover.container--border-unselected{border-color:var(--calcite-color-border-1)}.nested-container{display:none;flex-direction:column;border-width:0px;border-style:solid;border-color:var(--calcite-color-border-3);margin-inline-start:var(--calcite-list-item-spacing-indent, 1.5rem)}.nested-container--open{display:flex}.content-container{display:flex;flex:1 1 auto;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:stretch;padding:0px;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-2)}tr,td{outline-color:transparent}tr{position:relative}tr:focus,td:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.content,.custom-content{display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;padding-inline:0.75rem;padding-block:0.5rem;font-size:var(--calcite-font-size--2);line-height:1.375}.label,.description,.content-bottom{font-family:var(--calcite-font-family);font-size:var(--calcite-font-size--2);font-weight:var(--calcite-font-weight-normal);word-wrap:break-word;word-break:break-word}.label:only-child,.description:only-child,.content-bottom:only-child{margin:0px;padding-block:0.25rem}.label{color:var(--calcite-color-text-1)}:host([selected]) .label{font-weight:var(--calcite-font-weight-medium)}.description{margin-block-start:0.125rem;color:var(--calcite-color-text-3)}:host([selected]) .description{color:var(--calcite-color-text-2)}.content-start{justify-content:flex-start}.content-end{justify-content:flex-end}.content-start,.content-end{flex:1 1 auto}.content-start ::slotted(calcite-icon),.content-end ::slotted(calcite-icon){margin-inline:0.75rem;align-self:center}.content-bottom{display:flex;flex-direction:column}.content-container--has-center-content .content-start,.content-container--has-center-content .content-end{flex:0 1 auto}.selection-container{display:flex;padding-inline:0.75rem;padding-block:0px;color:var(--calcite-color-border-input)}.selection-container--single{color:transparent}:host(:not([disabled]):not([selected])) .container:hover .selection-container--single{color:var(--calcite-color-border-1)}:host([selected]:hover) .selection-container,:host([selected]:hover) .selection-container--single,:host([selected]) .selection-container{color:var(--calcite-list-item-icon-color)}.open-container{color:var(--calcite-color-text-3)}:host(:not([disabled])) .container:hover .open-container{color:var(--calcite-color-text-1)}.actions-start,.actions-end,.content-start,.content-end,.selection-container,.drag-container,.open-container{display:flex;align-items:center}.actions-start calcite-action,.actions-start calcite-handle,.actions-end calcite-action,.actions-end calcite-handle,.content-start calcite-action,.content-start calcite-handle,.content-end calcite-action,.content-end calcite-handle,.selection-container calcite-action,.selection-container calcite-handle,.drag-container calcite-action,.drag-container calcite-handle,.open-container calcite-action,.open-container calcite-handle{align-self:stretch}.open-container,.selection-container{cursor:pointer}.actions-start,.actions-end{position:relative;padding:0px}.actions-start ::slotted(calcite-action),.actions-start ::slotted(calcite-action-menu),.actions-start ::slotted(calcite-handle),.actions-start ::slotted(calcite-dropdown),.actions-end ::slotted(calcite-action),.actions-end ::slotted(calcite-action-menu),.actions-end ::slotted(calcite-handle),.actions-end ::slotted(calcite-dropdown){align-self:stretch;color:inherit}tr:focus .actions-start,tr:focus .actions-end{inset-block:0.125rem}tr:focus .actions-start .close,tr:focus .actions-start ::slotted(calcite-action),tr:focus .actions-start ::slotted(calcite-action-menu),tr:focus .actions-start ::slotted(calcite-handle),tr:focus .actions-start ::slotted(calcite-dropdown),tr:focus .actions-end .close,tr:focus .actions-end ::slotted(calcite-action),tr:focus .actions-end ::slotted(calcite-action-menu),tr:focus .actions-end ::slotted(calcite-handle),tr:focus .actions-end ::slotted(calcite-dropdown){block-size:calc(100% - 0.25rem)}tr:focus::after,tr:focus::before{position:absolute;content:\"\";inline-size:0.125rem;z-index:var(--calcite-z-index-header);background-color:var(--calcite-color-brand);inset-block:0}tr:focus::before{inset-inline-start:0}tr:focus::after{inset-inline-end:0}.container--border:focus::before{display:none}::slotted(calcite-list:empty){border-block-start-width:0px}:host([hidden]){display:none}[hidden]{display:none}";
+const listItemCss = ":host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:flex;flex-direction:column;background-color:var(--calcite-color-foreground-1);--calcite-list-item-icon-color:var(--calcite-color-brand)}:host([filter-hidden]),:host([closed]){display:none}.wrapper--bordered{border-block-end:1px solid var(--calcite-color-border-3)}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}.container{box-sizing:border-box;display:flex;flex:1 1 0%;overflow:hidden;background-color:var(--calcite-color-foreground-1)}.container *{box-sizing:border-box}.container--hover:hover{cursor:pointer;background-color:var(--calcite-color-foreground-2)}.container:active{background-color:var(--calcite-color-foreground-1)}.container--border{border-inline-start-width:4px;border-inline-start-style:solid}.container--border-selected{border-inline-start-color:var(--calcite-color-brand)}.container--border-unselected{border-inline-start-color:transparent}.container:hover.container--border-unselected{border-color:var(--calcite-color-border-1)}.nested-container{display:none;flex-direction:column;border-width:0px;border-style:solid;border-color:var(--calcite-color-border-3);margin-inline-start:var(--calcite-list-item-spacing-indent, 1.5rem)}.nested-container--open{display:flex}.content-container{display:flex;flex:1 1 auto;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:stretch;padding:0px;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-2)}tr,td{outline-color:transparent}tr{position:relative}tr:focus,td:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.content,.custom-content{display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;padding-inline:0.75rem;padding-block:0.5rem;font-size:var(--calcite-font-size--2);line-height:1.375}.label,.description,.content-bottom{font-family:var(--calcite-font-family);font-size:var(--calcite-font-size--2);font-weight:var(--calcite-font-weight-normal);word-wrap:break-word;word-break:break-word}.label:only-child,.description:only-child,.content-bottom:only-child{margin:0px;padding-block:0.25rem}.label{color:var(--calcite-color-text-1)}:host([selected]) .label{font-weight:var(--calcite-font-weight-medium)}.description{margin-block-start:0.125rem;color:var(--calcite-color-text-3)}:host([selected]) .description{color:var(--calcite-color-text-2)}.content-start{justify-content:flex-start}.content-end{justify-content:flex-end}.content-start,.content-end{flex:1 1 auto}.content-start ::slotted(calcite-icon),.content-end ::slotted(calcite-icon){margin-inline:0.75rem;align-self:center}.content-bottom{display:flex;flex-direction:column}.content-container--has-center-content .content-start,.content-container--has-center-content .content-end{flex:0 1 auto}.selection-container{display:flex;padding-inline:0.75rem;padding-block:0px;color:var(--calcite-color-border-input)}.selection-container--single{color:transparent}:host(:not([disabled]):not([selected])) .container:hover .selection-container--single{color:var(--calcite-color-border-1)}:host([selected]:hover) .selection-container,:host([selected]:hover) .selection-container--single,:host([selected]) .selection-container{color:var(--calcite-list-item-icon-color)}.open-container{color:var(--calcite-color-text-3)}:host(:not([disabled])) .container:hover .open-container{color:var(--calcite-color-text-1)}.actions-start,.actions-end,.content-start,.content-end,.selection-container,.drag-container,.open-container{display:flex;align-items:center}.actions-start calcite-action,.actions-start calcite-handle,.actions-end calcite-action,.actions-end calcite-handle,.content-start calcite-action,.content-start calcite-handle,.content-end calcite-action,.content-end calcite-handle,.selection-container calcite-action,.selection-container calcite-handle,.drag-container calcite-action,.drag-container calcite-handle,.open-container calcite-action,.open-container calcite-handle{align-self:stretch}.open-container,.selection-container{cursor:pointer}.actions-start,.actions-end{position:relative;padding:0px}.actions-start ::slotted(calcite-action),.actions-start ::slotted(calcite-action-menu),.actions-start ::slotted(calcite-handle),.actions-start ::slotted(calcite-dropdown),.actions-end ::slotted(calcite-action),.actions-end ::slotted(calcite-action-menu),.actions-end ::slotted(calcite-handle),.actions-end ::slotted(calcite-dropdown){align-self:stretch;color:inherit}tr:focus .actions-start,tr:focus .actions-end{inset-block:0.125rem}tr:focus .actions-start .close,tr:focus .actions-start ::slotted(calcite-action),tr:focus .actions-start ::slotted(calcite-action-menu),tr:focus .actions-start ::slotted(calcite-handle),tr:focus .actions-start ::slotted(calcite-dropdown),tr:focus .actions-end .close,tr:focus .actions-end ::slotted(calcite-action),tr:focus .actions-end ::slotted(calcite-action-menu),tr:focus .actions-end ::slotted(calcite-handle),tr:focus .actions-end ::slotted(calcite-dropdown){block-size:calc(100% - 0.25rem)}tr:focus::after,tr:focus::before{position:absolute;content:\"\";inline-size:0.125rem;z-index:var(--calcite-z-index-header);background-color:var(--calcite-color-brand);inset-block:0}tr:focus::before{inset-inline-start:0}tr:focus::after{inset-inline-end:0}.container--border:focus::before{display:none}::slotted(calcite-list:empty){border-block-start-width:0px}:host([hidden]){display:none}[hidden]{display:none}";
 const CalciteListItemStyle0 = listItemCss;
 
 const focusMap = new Map();
@@ -395,7 +395,7 @@ const ListItem = /*@__PURE__*/ proxyCustomElement(class ListItem extends HTMLEle
         const showBorder = selectionMode !== "none" && selectionAppearance === "border";
         const borderSelected = showBorder && selected;
         const borderUnselected = showBorder && !selected;
-        return (h(Host, { key: '2bdaf5ae9ff5694d5efd860a345a6f1a8c94e007' }, h(InteractiveContainer, { key: 'dbd29243dfff02519b4f79c71cc9afbd203560ea', disabled: disabled }, h("div", { key: '6348bef9e84621e00c8fe8c52877c87ec1c91726', class: { [CSS.wrapper]: true, [CSS.wrapperBordered]: bordered } }, h("tr", { key: '9c93f58bda94e540e30655dd23d5c8b747e1dad4', "aria-expanded": openable ? toAriaBoolean(open) : null, "aria-label": label, "aria-level": level, "aria-posinset": setPosition, "aria-selected": toAriaBoolean(selected), "aria-setsize": setSize, class: {
+        return (h(Host, { key: 'e5c6ac9b3b611040a89e45804935c9c6e0edce2d' }, h(InteractiveContainer, { key: '352c056d23f70ef0c5596e9bc447c57dad7523c9', disabled: disabled }, h("div", { key: 'c19950786e18433c5197309442118d72806698a9', class: { [CSS.wrapper]: true, [CSS.wrapperBordered]: bordered } }, h("tr", { key: 'a77a11612d4b15afdfe0146c2808312de96756bc', "aria-expanded": openable ? toAriaBoolean(open) : null, "aria-label": label, "aria-level": level, "aria-posinset": setPosition, "aria-selected": toAriaBoolean(selected), "aria-setsize": setSize, class: {
                 [CSS.container]: true,
                 [CSS.containerHover]: true,
                 [CSS.containerBorder]: showBorder,

package/dist/components/list.js

@@ -25,7 +25,7 @@ import { d as debounce } from './debounce.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.11.1
+ * v2.12.0
  */
 const CSS = {
     container: "container",
@@ -399,7 +399,7 @@ const List = /*@__PURE__*/ proxyCustomElement(class List extends HTMLElement {
     // --------------------------------------------------------------------------
     render() {
         const { loading, label, disabled, dataForFilter, filterEnabled, filterPlaceholder, filterText, filteredItems, hasFilterActionsStart, hasFilterActionsEnd, hasFilterNoResults, filterProps, } = this;
-        return (h(InteractiveContainer, { key: '835ad7cd3b23dafd88ecb2b203da9cb0ed5c608a', disabled: this.disabled }, h("div", { key: 'd3a24de65bb88f763d5ea1ac28366ed17fa5b1aa', class: CSS.container }, this.dragEnabled ? (h("span", { "aria-live": "assertive", class: CSS.assistiveText }, this.assistiveText)) : null, this.renderItemAriaLive(), loading ? h("calcite-scrim", { class: CSS.scrim, loading: loading }) : null, h("table", { key: 'dfeccafe1a193d11e322834ff2c192fd451695eb', "aria-busy": toAriaBoolean(loading), "aria-label": label || "", class: CSS.table, onKeyDown: this.handleListKeydown, role: "treegrid" }, filterEnabled || hasFilterActionsStart || hasFilterActionsEnd ? (h("thead", { class: CSS.sticky }, h("tr", null, h("th", { colSpan: MAX_COLUMNS }, h("calcite-stack", { class: CSS.stack }, h("slot", { name: SLOTS.filterActionsStart, onSlotchange: this.handleFilterActionsStartSlotChange, slot: SLOTS$1.actionsStart }), h("calcite-filter", { "aria-label": filterPlaceholder, disabled: disabled, filterProps: filterProps, items: dataForFilter, onCalciteFilterChange: this.handleFilterChange, placeholder: filterPlaceholder, ref: this.setFilterEl, value: filterText }), h("slot", { name: SLOTS.filterActionsEnd, onSlotchange: this.handleFilterActionsEndSlotChange, slot: SLOTS$1.actionsEnd })))))) : null, h("tbody", { key: '0c7eac45016250148863ffcb8159944dae887c64', class: CSS.tableContainer }, h("slot", { key: '64c8f6a0ffa7a2179fbb0289bf79f3b5c76b55fc', onSlotchange: this.handleDefaultSlotChange }))), h("div", { key: '91fd4c27deb58481fb0be8117c13f93efc9abb16', "aria-live": "polite", "data-test-id": "no-results-container", hidden: !(hasFilterNoResults && filterEnabled && filterText && !filteredItems.length) }, h("slot", { key: '4090a37ff3323e58bdbfe98c773338b03696bbfc', name: SLOTS.filterNoResults, onSlotchange: this.handleFilterNoResultsSlotChange })))));
+        return (h(InteractiveContainer, { key: '84991009060a8b97b9901ca97f32b32fa6e830fa', disabled: this.disabled }, h("div", { key: '27f5a904be599be5768bb1a7693111573e745e0f', class: CSS.container }, this.dragEnabled ? (h("span", { "aria-live": "assertive", class: CSS.assistiveText }, this.assistiveText)) : null, this.renderItemAriaLive(), loading ? h("calcite-scrim", { class: CSS.scrim, loading: loading }) : null, h("table", { key: 'dd343a43f26edcb50f87a064a41471756a94afeb', "aria-busy": toAriaBoolean(loading), "aria-label": label || "", class: CSS.table, onKeyDown: this.handleListKeydown, role: "treegrid" }, filterEnabled || hasFilterActionsStart || hasFilterActionsEnd ? (h("thead", { class: CSS.sticky }, h("tr", null, h("th", { colSpan: MAX_COLUMNS }, h("calcite-stack", { class: CSS.stack }, h("slot", { name: SLOTS.filterActionsStart, onSlotchange: this.handleFilterActionsStartSlotChange, slot: SLOTS$1.actionsStart }), h("calcite-filter", { "aria-label": filterPlaceholder, disabled: disabled, filterProps: filterProps, items: dataForFilter, onCalciteFilterChange: this.handleFilterChange, placeholder: filterPlaceholder, ref: this.setFilterEl, value: filterText }), h("slot", { name: SLOTS.filterActionsEnd, onSlotchange: this.handleFilterActionsEndSlotChange, slot: SLOTS$1.actionsEnd })))))) : null, h("tbody", { key: '90a288eea3e02d5261e369e14b687852c1ff876b', class: CSS.tableContainer }, h("slot", { key: '08992c3c5ad4d5afe86e7e1cd38327c5f4281bd1', onSlotchange: this.handleDefaultSlotChange }))), h("div", { key: '689185b56a2990e00a409ddbc4e4c135115791d3', "aria-live": "polite", "data-test-id": "no-results-container", hidden: !(hasFilterNoResults && filterEnabled && filterText && !filteredItems.length) }, h("slot", { key: '929ef7f843f5c8e7290a3cbcebea8c5c4cf38707', name: SLOTS.filterNoResults, onSlotchange: this.handleFilterNoResultsSlotChange })))));
     }
     // --------------------------------------------------------------------------
     //

package/dist/components/loadable.js

@@ -9,7 +9,7 @@ import { i as isBrowser } from './browser.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.11.1
+ * v2.12.0
  */
 const resolveMap = new WeakMap();
 const promiseMap = new WeakMap();

package/dist/components/loader.js

@@ -5,11 +5,12 @@
  */
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { g as guid } from './guid.js';
+import { c as connectLocalized, d as disconnectLocalized } from './locale2.js';
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.11.1
+ * v2.12.0
  */
 const CSS = {
     loader: "loader",
@@ -20,7 +21,7 @@ const CSS = {
     loaderPercentage: "loader__percentage",
 };
 
-const loaderCss = "@charset \"UTF-8\";@media (prefers-reduced-motion: reduce){:root{--calcite-internal-duration-factor:0}}:host{position:relative;margin-inline:auto;display:none;align-items:center;justify-content:center;opacity:1;min-block-size:var(--calcite-loader-size);font-size:var(--calcite-loader-font-size);stroke:var(--calcite-color-brand);stroke-width:3;fill:none;transform:scale(1, 1);animation:loader-color-shift calc(var(--calcite-internal-animation-timing-slow) / var(--calcite-internal-duration-factor) * 2 / var(--calcite-internal-duration-factor)) alternate-reverse infinite linear;padding-block:var(--calcite-loader-padding, 4rem);will-change:contents}:host([scale=s]){--calcite-loader-font-size:var(--calcite-font-size--2);--calcite-loader-size:2rem;--calcite-loader-size-inline:0.75rem}:host([scale=m]){--calcite-loader-font-size:var(--calcite-font-size-0);--calcite-loader-size:4rem;--calcite-loader-size-inline:1rem}:host([scale=l]){--calcite-loader-font-size:var(--calcite-font-size-2);--calcite-loader-size:6rem;--calcite-loader-size-inline:1.5rem}:host([no-padding]){padding-block:0px}:host{display:flex}.loader__text{display:block;text-align:center;font-size:var(--calcite-font-size--2);line-height:1rem;color:var(--calcite-color-text-1);margin-block-start:calc(var(--calcite-loader-size) + 1.5rem)}.loader__percentage{position:absolute;display:block;text-align:center;color:var(--calcite-color-text-1);font-size:var(--calcite-loader-font-size);inline-size:var(--calcite-loader-size);inset-inline-start:50%;margin-inline-start:calc(var(--calcite-loader-size) / 2 * -1);line-height:0.25;transform:scale(1, 1)}.loader__svgs{position:absolute;overflow:visible;opacity:1;inline-size:var(--calcite-loader-size);block-size:var(--calcite-loader-size);inset-inline-start:50%;margin-inline-start:calc(var(--calcite-loader-size) / 2 * -1);animation-iteration-count:infinite;animation-timing-function:linear;animation-duration:calc(var(--calcite-internal-animation-timing-slow) / var(--calcite-internal-duration-factor) * 6.66 / var(--calcite-internal-duration-factor));animation-name:loader-clockwise}.loader__svg{position:absolute;inset-block-start:0px;transform-origin:center;overflow:visible;inset-inline-start:0;inline-size:var(--calcite-loader-size);block-size:var(--calcite-loader-size);animation-iteration-count:infinite;animation-timing-function:linear}.loader__svg--1{animation-name:loader-offset-1}.loader__svg--2{animation-name:loader-offset-2}.loader__svg--3{animation-name:loader-offset-3}:host([type=determinate]){animation:none;stroke:var(--calcite-color-border-3)}:host([type=determinate]) .loader__svgs{animation:none}:host([type=determinate]) .loader__svg--3{animation:none;stroke:var(--calcite-color-brand);stroke-dasharray:150.79632;transform:rotate(-90deg);transition:all var(--calcite-internal-animation-timing-fast) linear}:host([inline]){position:relative;margin:0px;animation:none;stroke:currentColor;stroke-width:2;padding-block:0px;block-size:var(--calcite-loader-size-inline);min-block-size:var(--calcite-loader-size-inline);inline-size:var(--calcite-loader-size-inline);margin-inline-end:calc(var(--calcite-loader-size-inline) * 0.5);vertical-align:calc(var(--calcite-loader-size-inline) * -1 * 0.2)}:host([inline]) .loader__svgs{inset-block-start:0px;margin:0px;inset-inline-start:0;inline-size:var(--calcite-loader-size-inline);block-size:var(--calcite-loader-size-inline)}:host([inline]) .loader__svg{inline-size:var(--calcite-loader-size-inline);block-size:var(--calcite-loader-size-inline)}:host([complete]){opacity:0;transform:scale(0.75, 0.75);transform-origin:center;transition:opacity var(--calcite-internal-animation-timing-medium) linear 1000ms, transform var(--calcite-internal-animation-timing-medium) linear 1000ms}:host([complete]) .loader__svgs{opacity:0;transform:scale(0.75, 0.75);transform-origin:center;transition:opacity calc(180ms * var(--calcite-internal-duration-factor)) linear 800ms, transform calc(180ms * var(--calcite-internal-duration-factor)) linear 800ms}:host([complete]) .loader__percentage{color:var(--calcite-color-brand);transform:scale(1.05, 1.05);transform-origin:center;transition:color var(--calcite-internal-animation-timing-medium) linear, transform var(--calcite-internal-animation-timing-medium) linear}.loader__svg--1{stroke-dasharray:27.9252444444 139.6262222222;animation-duration:calc(var(--calcite-internal-animation-timing-slow) / var(--calcite-internal-duration-factor) * 4.8 / var(--calcite-internal-duration-factor))}@keyframes loader-offset-1{0%{stroke-dasharray:27.9252444444 251.3272;stroke-dashoffset:0}50%{stroke-dasharray:139.6262222222 139.6262222222;stroke-dashoffset:-83.7757333333}100%{stroke-dasharray:27.9252444444 251.3272;stroke-dashoffset:-279.2524444444}}.loader__svg--2{stroke-dasharray:55.8504888889 139.6262222222;animation-duration:calc(var(--calcite-internal-animation-timing-slow) / var(--calcite-internal-duration-factor) * 6.4 / var(--calcite-internal-duration-factor))}@keyframes loader-offset-2{0%{stroke-dasharray:55.8504888889 223.4019555556;stroke-dashoffset:0}50%{stroke-dasharray:139.6262222222 139.6262222222;stroke-dashoffset:-97.7383555556}100%{stroke-dasharray:55.8504888889 223.4019555556;stroke-dashoffset:-279.2524444444}}.loader__svg--3{stroke-dasharray:13.9626222222 139.6262222222;animation-duration:calc(var(--calcite-internal-animation-timing-slow) / var(--calcite-internal-duration-factor) * 7.734 / var(--calcite-internal-duration-factor))}@keyframes loader-offset-3{0%{stroke-dasharray:13.9626222222 265.2898222222;stroke-dashoffset:0}50%{stroke-dasharray:139.6262222222 139.6262222222;stroke-dashoffset:-76.7944222222}100%{stroke-dasharray:13.9626222222 265.2898222222;stroke-dashoffset:-279.2524444444}}@keyframes loader-color-shift{0%{stroke:var(--calcite-color-brand)}33%{stroke:var(--calcite-color-brand-press)}66%{stroke:var(--calcite-color-brand-hover)}100%{stroke:var(--calcite-color-brand)}}@keyframes loader-clockwise{100%{transform:rotate(360deg)}}:host([hidden]){display:none}[hidden]{display:none}";
+const loaderCss = "@charset \"UTF-8\";@media (prefers-reduced-motion: reduce){:root{--calcite-internal-duration-factor:0}}:host{position:relative;margin-inline:auto;display:none;align-items:center;justify-content:center;opacity:1;min-block-size:var(--calcite-loader-size);font-size:var(--calcite-loader-font-size);stroke:var(--calcite-color-brand);stroke-width:3;fill:none;transform:scale(1, 1);animation:loader-color-shift scaleDuration(--calcite-internal-animation-timing-slow, 2) alternate-reverse infinite linear;padding-block:var(--calcite-loader-padding, 4rem);will-change:contents}:host([scale=s]){--calcite-loader-font-size:var(--calcite-font-size--3);--calcite-loader-size:2rem;--calcite-loader-size-inline:0.75rem;--calcite-internal-loader-value-line-height:0.625rem}:host([scale=m]){--calcite-loader-font-size:var(--calcite-font-size-0);--calcite-loader-size:4rem;--calcite-loader-size-inline:1rem;--calcite-internal-loader-value-line-height:1.375rem}:host([scale=l]){--calcite-loader-font-size:var(--calcite-font-size-2);--calcite-loader-size:6rem;--calcite-loader-size-inline:1.5rem;--calcite-internal-loader-value-line-height:1.71875rem}:host([no-padding]){padding-block:0px}:host{display:flex}.loader__text{display:block;text-align:center;font-size:var(--calcite-font-size--2);line-height:1rem;color:var(--calcite-color-text-1);margin-block-start:calc(var(--calcite-loader-size) + 1.5rem)}.loader__percentage{display:block;text-align:center;color:var(--calcite-color-text-1);font-size:var(--calcite-loader-font-size);inline-size:var(--calcite-loader-size);line-height:var(--calcite-internal-loader-value-line-height);align-self:center}.loader__svgs{position:absolute;overflow:visible;opacity:1;inline-size:var(--calcite-loader-size);block-size:var(--calcite-loader-size);inset-inline-start:50%;margin-inline-start:calc(var(--calcite-loader-size) / 2 * -1);animation-iteration-count:infinite;animation-timing-function:linear;animation-duration:scaleDuration(--calcite-internal-animation-timing-slow, 6.66);animation-name:loader-clockwise;display:flex}.loader__svg{position:absolute;inset-block-start:0px;transform-origin:center;overflow:visible;inset-inline-start:0;inline-size:var(--calcite-loader-size);block-size:var(--calcite-loader-size);animation-iteration-count:infinite;animation-timing-function:linear}.loader__svg--1{animation-name:loader-offset-1}.loader__svg--2{animation-name:loader-offset-2}.loader__svg--3{animation-name:loader-offset-3}:host([type=determinate]),:host([type=determinate-value]){animation:none;stroke:var(--calcite-color-border-3)}:host([type=determinate]) .loader__svgs,:host([type=determinate-value]) .loader__svgs{animation:none}:host([type=determinate]) .loader__svg--3,:host([type=determinate-value]) .loader__svg--3{animation:none;stroke:var(--calcite-color-brand);stroke-dasharray:150.79632;transform:rotate(-90deg);transition:all var(--calcite-internal-animation-timing-fast) linear}:host([inline]){position:relative;margin:0px;animation:none;stroke:currentColor;stroke-width:2;padding-block:0px;block-size:var(--calcite-loader-size-inline);min-block-size:var(--calcite-loader-size-inline);inline-size:var(--calcite-loader-size-inline);margin-inline-end:calc(var(--calcite-loader-size-inline) * 0.5);vertical-align:calc(var(--calcite-loader-size-inline) * -1 * 0.2)}:host([inline]) .loader__svgs{inset-block-start:0px;margin:0px;inset-inline-start:0;inline-size:var(--calcite-loader-size-inline);block-size:var(--calcite-loader-size-inline)}:host([inline]) .loader__svg{inline-size:var(--calcite-loader-size-inline);block-size:var(--calcite-loader-size-inline)}:host([complete]){opacity:0;transform:scale(0.75, 0.75);transform-origin:center;transition:opacity var(--calcite-internal-animation-timing-medium) linear 1000ms, transform var(--calcite-internal-animation-timing-medium) linear 1000ms}:host([complete]) .loader__svgs{opacity:0;transform:scale(0.75, 0.75);transform-origin:center;transition:opacity calc(180ms * var(--calcite-internal-duration-factor)) linear 800ms, transform calc(180ms * var(--calcite-internal-duration-factor)) linear 800ms}:host([complete]) .loader__percentage{color:var(--calcite-color-brand);transform:scale(1.05, 1.05);transform-origin:center;transition:color var(--calcite-internal-animation-timing-medium) linear, transform var(--calcite-internal-animation-timing-medium) linear}.loader__svg--1{stroke-dasharray:27.9252444444 139.6262222222;animation-duration:scaleDuration(--calcite-internal-animation-timing-slow, 4.8)}@keyframes loader-offset-1{0%{stroke-dasharray:27.9252444444 251.3272;stroke-dashoffset:0}50%{stroke-dasharray:139.6262222222 139.6262222222;stroke-dashoffset:-83.7757333333}100%{stroke-dasharray:27.9252444444 251.3272;stroke-dashoffset:-279.2524444444}}.loader__svg--2{stroke-dasharray:55.8504888889 139.6262222222;animation-duration:scaleDuration(--calcite-internal-animation-timing-slow, 6.4)}@keyframes loader-offset-2{0%{stroke-dasharray:55.8504888889 223.4019555556;stroke-dashoffset:0}50%{stroke-dasharray:139.6262222222 139.6262222222;stroke-dashoffset:-97.7383555556}100%{stroke-dasharray:55.8504888889 223.4019555556;stroke-dashoffset:-279.2524444444}}.loader__svg--3{stroke-dasharray:13.9626222222 139.6262222222;animation-duration:scaleDuration(--calcite-internal-animation-timing-slow, 7.734)}@keyframes loader-offset-3{0%{stroke-dasharray:13.9626222222 265.2898222222;stroke-dashoffset:0}50%{stroke-dasharray:139.6262222222 139.6262222222;stroke-dashoffset:-76.7944222222}100%{stroke-dasharray:13.9626222222 265.2898222222;stroke-dashoffset:-279.2524444444}}@keyframes loader-color-shift{0%{stroke:var(--calcite-color-brand)}33%{stroke:var(--calcite-color-brand-press)}66%{stroke:var(--calcite-color-brand-hover)}100%{stroke:var(--calcite-color-brand)}}@keyframes loader-clockwise{100%{transform:rotate(360deg)}}:host([hidden]){display:none}[hidden]{display:none}";
 const CalciteLoaderStyle0 = loaderCss;
 
 const Loader = /*@__PURE__*/ proxyCustomElement(class Loader extends HTMLElement {
@@ -28,18 +29,32 @@ const Loader = /*@__PURE__*/ proxyCustomElement(class Loader extends HTMLElement
         super();
         this.__registerHost();
         this.__attachShadow();
+        this.formatValue = () => {
+            if (this.type !== "determinate-value") {
+                return `${this.value}`;
+            }
+            return this.formatter.format(this.value / 100);
+        };
         this.inline = false;
         this.label = undefined;
         this.scale = "m";
         this.type = undefined;
         this.value = 0;
         this.text = "";
+        this.effectiveLocale = "";
     }
     //--------------------------------------------------------------------------
     //
     //  Lifecycle
     //
     //--------------------------------------------------------------------------
+    connectedCallback() {
+        connectLocalized(this);
+        this.updateFormatter();
+    }
+    disconnectedCallback() {
+        disconnectLocalized(this);
+    }
     render() {
         const { el, inline, label, scale, text, type, value } = this;
         const id = el.id || guid();
@@ -47,7 +62,7 @@ const Loader = /*@__PURE__*/ proxyCustomElement(class Loader extends HTMLElement
         const size = inline ? this.getInlineSize(scale) : this.getSize(scale);
         const radius = size * radiusRatio;
         const viewbox = `0 0 ${size} ${size}`;
-        const isDeterminate = type === "determinate";
+        const isDeterminate = type?.startsWith("determinate");
         const circumference = 2 * radius * Math.PI;
         const progress = (value / 100) * circumference;
         const remaining = circumference - progress;
@@ -60,10 +75,13 @@ const Loader = /*@__PURE__*/ proxyCustomElement(class Loader extends HTMLElement
         };
         const svgAttributes = { r: radius, cx: size / 2, cy: size / 2 };
         const determinateStyle = { "stroke-dasharray": `${progress} ${remaining}` };
-        return (h(Host, { key: '53c4523552d540e02cb38d599226d48d00ffffa0', "aria-label": label, id: id, role: "progressbar", ...(isDeterminate ? hostAttributes : {}) }, h("div", { key: 'e9a31da95d1769f13150426eefa8fd46f03afb53', class: CSS.loaderParts }, [1, 2, 3].map((index) => (h("svg", { "aria-hidden": "true", class: {
+        return (h(Host, { key: 'b84a28c551e2484735b2cb7bad89a7a1d608fe13', "aria-label": label, id: id, role: "progressbar", ...(isDeterminate ? hostAttributes : {}) }, h("div", { key: '7ea0d6f2a742c8950cff2196bc454cc8ec3be037', class: CSS.loaderParts }, [1, 2, 3].map((index) => (h("svg", { "aria-hidden": "true", class: {
                 [CSS.loaderPart]: true,
                 [CSS.loaderPartId(index)]: true,
-            }, key: index, viewBox: viewbox, ...(index === 3 && isDeterminate ? { style: determinateStyle } : {}) }, h("circle", { ...svgAttributes }))))), text && h("div", { key: '2942cb58f2b0466c94b925f05211972c5ede9244', class: CSS.loaderText }, text), isDeterminate && h("div", { key: '2f73c0a6b1fb26d125b2fee69f2caf09400666e3', class: CSS.loaderPercentage }, value)));
+            }, key: index, viewBox: viewbox, ...(index === 3 && isDeterminate ? { style: determinateStyle } : {}) }, h("circle", { ...svgAttributes })))), isDeterminate && h("div", { key: '2732fc9cbbaade638eb6241776b2aecea6177ed5', class: CSS.loaderPercentage }, this.formatValue())), text && h("div", { key: '5050af5bb4d979e4f83ac997f0f98aa69be86f52', class: CSS.loaderText }, text)));
+    }
+    formatterPropsChange() {
+        this.updateFormatter();
     }
     //--------------------------------------------------------------------------
     //
@@ -89,7 +107,20 @@ const Loader = /*@__PURE__*/ proxyCustomElement(class Loader extends HTMLElement
             l: 20,
         }[scale];
     }
+    updateFormatter() {
+        if (this.type !== "determinate-value" ||
+            this.formatter?.resolvedOptions().locale === this.effectiveLocale) {
+            return;
+        }
+        this.formatter = new Intl.NumberFormat(this.effectiveLocale, {
+            style: "percent",
+        });
+    }
     get el() { return this; }
+    static get watchers() { return {
+        "effectiveLocale": ["formatterPropsChange"],
+        "type": ["formatterPropsChange"]
+    }; }
     static get style() { return CalciteLoaderStyle0; }
 }, [1, "calcite-loader", {
         "inline": [516],
@@ -97,7 +128,11 @@ const Loader = /*@__PURE__*/ proxyCustomElement(class Loader extends HTMLElement
         "scale": [513],
         "type": [513],
         "value": [2],
-        "text": [1]
+        "text": [1],
+        "effectiveLocale": [32]
+    }, undefined, {
+        "effectiveLocale": ["formatterPropsChange"],
+        "type": ["formatterPropsChange"]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {

package/dist/components/locale2.js

@@ -10,7 +10,7 @@ import { c as createObserver } from './observers.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.11.1
+ * v2.12.0
  */
 const unnecessaryDecimal = new RegExp(`\\${"."}(0+)?$`);
 const trailingZeros = new RegExp("0+$");
@@ -217,7 +217,7 @@ function addLocalizedTrailingDecimalZeros(localizedValue, value, formatter) {
 /*!
  * 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.11.1
+ * v2.12.0
  */
 const defaultLocale = "en";
 const t9nLocales = [
@@ -362,6 +362,26 @@ function getSupportedLocale(locale, context = "cldr") {
     }
     return locale;
 }
+/**
+ * Gets the locale that best matches the context for date formatting.
+ *
+ * Intl date formatting has some quirks with certain locales. This handles those quirks by mapping a locale to another for date formatting.
+ *
+ * See https://github.com/Esri/calcite-design-system/issues/9387
+ *
+ * @param locale – the BCP 47 locale code
+ * @returns {string} a BCP 47 locale code
+ */
+function getDateFormatSupportedLocale(locale) {
+    switch (locale) {
+        case "it-CH":
+            return "de-CH";
+        case "bs":
+            return "bs-Cyrl";
+        default:
+            return locale;
+    }
+}
 const connectedComponents = new Set();
 /**
  * This utility sets up internals for messages support.
@@ -568,4 +588,4 @@ function getDateTimeFormat(locale, options) {
     return format;
 }
 
-export { BigDecimal as B, NumberStringFormat as N, addLocalizedTrailingDecimalZeros as a, getDateTimeFormat as b, connectLocalized as c, disconnectLocalized as d, getSupportedNumberingSystem as e, getSupportedLocale as g, isValidNumber as i, numberStringFormatter as n, parseNumberString as p, sanitizeNumberString as s };
+export { BigDecimal as B, NumberStringFormat as N, addLocalizedTrailingDecimalZeros as a, getDateTimeFormat as b, connectLocalized as c, disconnectLocalized as d, getDateFormatSupportedLocale as e, getSupportedNumberingSystem as f, getSupportedLocale as g, isValidNumber as i, numberStringFormatter as n, parseNumberString as p, sanitizeNumberString as s };

package/dist/components/location-flow-item.js

@@ -51,7 +51,7 @@ const LocationFlowItem$1 = /*@__PURE__*/ proxyCustomElement(class LocationFlowIt
     //
     //--------------------------------------------------------------------------
     render() {
-        return (h(Host, { key: '4338ca2001ca75d9994cc468c3d4216724e18a36' }, h("slot", { key: 'fc9dbfade945c848e3b3c259250d7a1c02f7431d' })));
+        return (h(Host, { key: '48471224a5b2cf54e0f88ad58938d716a2388873' }, h("slot", { key: '4a438911cbc255d9be3d3ebe523ac971b58bbbbd' })));
     }
     static get style() { return LocationFlowItemStyle0; }
 }, [1, "location-flow-item"]);

package/dist/components/logger.js

@@ -8,7 +8,7 @@ import { l as logLevel } from './config.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.11.1
+ * v2.12.0
  */
 /**
  * Exported for testing purposes only

package/dist/components/map-card2.js

@@ -279,7 +279,7 @@ const MapCard = /*@__PURE__*/ proxyCustomElement(class MapCard extends HTMLEleme
         const containerClass = this.isMobile ? "width-full" : "";
         const mobileClass = this.isMobile ? "border-top" : "";
         const headerElements = this.isMapLayout ? "" : "display-none";
-        return (h(Host, { key: '7029e518173a8c1e6e00049b8e68e23bed23d9cb' }, h("div", { key: '2b8d9197dcb68529562728fddeb53d0a7e9cbb86', class: `${mapContainerClass}` }, h("map-picker", { key: '2e50b7c70832f4151fafd06e860846a5efa8f6f1', class: mapPickerClass, isMapLayout: this.isMapLayout, mapInfos: this.mapInfos, ref: (el) => this._mapPicker = el }), h("div", { key: 'bc01ef7fb34400e3ff58151cab6abbabd9fa8a6f', class: `mapView-header display-flex ${headerElements}` }, h("div", { key: '1f1bf6ffb92fbc182be8333b4ae3d70271ea2f1b', class: `border-end ${containerClass} ${mobileClass}`, id: "solutions-map-layer-picker-container" }, this.mapView && h("map-layer-picker", { key: '47320f3794f060262c4ed29ec1400a50d9744a97', appearance: "transparent", defaultLayerId: this.defaultLayerId, display: "inline-flex", height: 50, isMobile: this.isMobile, mapView: this.mapView, onlyShowUpdatableLayers: this.onlyShowUpdatableLayers, placeholderIcon: "layers", scale: "l", selectedIds: this.selectedLayer ? [this.selectedLayer.id] : [], showSingleLayerAsLabel: true, showTables: true, type: "dropdown" })), this._getDropDownItem())), h("div", { key: '7101bfed6c0e0932275b0d28eea0ea5e1603aa8e', class: `${mapHeightClass} ${mapClass}`, ref: (el) => (this._mapDiv = el) }), h("map-tools", { key: '8ca28e50a77a25699cd6c17fe4f31788ca1cb49d', basemapConfig: this.basemapConfig, class: `box-shadow ${themeClass}`, enableBasemap: this.enableBasemap, enableFloorFilter: this.enableFloorFilter, enableFullscreen: this.enableFullscreen, enableHome: this.enableHome, enableLegend: this.enableLegend, enableSearch: this.enableSearch, enableSingleExpand: this.enableSingleExpand, homeZoomToolsSize: this.homeZoomToolsSize, mapView: this.mapView, mapWidgetsSize: this.mapWidgetsSize, position: this.mapWidgetsPosition, ref: (el) => this._mapTools = el, searchConfiguration: this._searchConfiguration, stackTools: this.stackTools, toolOrder: this.toolOrder })));
+        return (h(Host, { key: 'a724cfff5c8cd19703df8443fccf806cca1d37a7' }, h("div", { key: '8ee5d81cea48cbb5d62dd7e75f4d128aa36132ae', class: `${mapContainerClass}` }, h("map-picker", { key: '782526b5429f1b136efd2e0d339caea4b78038dd', class: mapPickerClass, isMapLayout: this.isMapLayout, mapInfos: this.mapInfos, ref: (el) => this._mapPicker = el }), h("div", { key: 'a8f9a8cd4e02aad729d119a5c04829142931c6dd', class: `mapView-header display-flex ${headerElements}` }, h("div", { key: 'f8e06895d78ed95c1467ba804325b458a54f0ae8', class: `border-end ${containerClass} ${mobileClass}`, id: "solutions-map-layer-picker-container" }, this.mapView && h("map-layer-picker", { key: 'f63739e17afb38bf98ec458a48298514c63a8bf2', appearance: "transparent", defaultLayerId: this.defaultLayerId, display: "inline-flex", height: 50, isMobile: this.isMobile, mapView: this.mapView, onlyShowUpdatableLayers: this.onlyShowUpdatableLayers, placeholderIcon: "layers", scale: "l", selectedIds: this.selectedLayer ? [this.selectedLayer.id] : [], showSingleLayerAsLabel: true, showTables: true, type: "dropdown" })), this._getDropDownItem())), h("div", { key: '740f980cadf2ab3ce2692357d39cef1cec31bbae', class: `${mapHeightClass} ${mapClass}`, ref: (el) => (this._mapDiv = el) }), h("map-tools", { key: 'e748b8677208111b7592d035c15abdab645c618e', basemapConfig: this.basemapConfig, class: `box-shadow ${themeClass}`, enableBasemap: this.enableBasemap, enableFloorFilter: this.enableFloorFilter, enableFullscreen: this.enableFullscreen, enableHome: this.enableHome, enableLegend: this.enableLegend, enableSearch: this.enableSearch, enableSingleExpand: this.enableSingleExpand, homeZoomToolsSize: this.homeZoomToolsSize, mapView: this.mapView, mapWidgetsSize: this.mapWidgetsSize, position: this.mapWidgetsPosition, ref: (el) => this._mapTools = el, searchConfiguration: this._searchConfiguration, stackTools: this.stackTools, toolOrder: this.toolOrder })));
     }
     /**
      * Called each time after the component is loaded