@esri/solutions-components 0.7.19 → 0.7.20

package/dist/components/map-tools2.js

@@ -5,6 +5,7 @@
  */
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { g as getLocaleComponentStrings } from './locale.js';
+import { l as loadModules } from './loadModules.js';
 import { d as defineCustomElement$9 } from './basemap-gallery2.js';
 import { d as defineCustomElement$8 } from './action.js';
 import { d as defineCustomElement$7 } from './icon.js';
@@ -22,17 +23,24 @@ const MapTools = /*@__PURE__*/ proxyCustomElement(class MapTools extends HTMLEle
         super();
         this.__registerHost();
         this.__attachShadow();
+        /**
+         * string[]: List of widget names that have been added to the UI
+         * This prop is only used when enableSingleExpand is false
+         */
+        this._widgets = [];
         this.basemapConfig = undefined;
         this.enableLegend = undefined;
         this.enableFloorFilter = undefined;
         this.enableFullscreen = undefined;
         this.enableSearch = undefined;
         this.enableBasemap = undefined;
-        this.enableMapToolsExpand = undefined;
+        this.enableHome = undefined;
+        this.enableSingleExpand = undefined;
         this.homeZoomToolsSize = "m";
         this.layout = "vertical";
         this.mapView = undefined;
         this.mapWidgetsSize = "m";
+        this.position = "top-right";
         this.searchConfiguration = undefined;
         this.stackTools = true;
         this.toolOrder = undefined;
@@ -65,7 +73,7 @@ const MapTools = /*@__PURE__*/ proxyCustomElement(class MapTools extends HTMLEle
     async _showBasemapWidgetWatchHandler(v) {
         if (v) {
             this.mapView.ui.add(this._basemapElement.basemapWidget, {
-                position: "top-right",
+                position: this.position,
                 index: 1
             });
         }
@@ -80,7 +88,7 @@ const MapTools = /*@__PURE__*/ proxyCustomElement(class MapTools extends HTMLEle
         const widget = this._floorFilterElement.floorFilterWidget;
         if (v) {
             this.mapView.ui.add(widget, {
-                position: "top-right",
+                position: this.position,
                 index: 1
             });
         }
@@ -110,7 +118,7 @@ const MapTools = /*@__PURE__*/ proxyCustomElement(class MapTools extends HTMLEle
     async _showLegendWidgetWatchHandler(v) {
         if (v) {
             this.mapView.ui.add(this._legendElement.legendWidget, {
-                position: "top-right",
+                position: this.position,
                 index: 1
             });
         }
@@ -124,7 +132,7 @@ const MapTools = /*@__PURE__*/ proxyCustomElement(class MapTools extends HTMLEle
     async _showSearchWidgetWatchHandler(v) {
         if (v) {
             this.mapView.ui.add(this._searchElement.searchWidget, {
-                position: "top-right",
+                position: this.position,
                 index: 1
             });
         }
@@ -152,6 +160,7 @@ const MapTools = /*@__PURE__*/ proxyCustomElement(class MapTools extends HTMLEle
      */
     async componentWillLoad() {
         await this._getTranslations();
+        await this._initModules();
     }
     /**
      * StencilJS: Renders the component.
@@ -167,10 +176,28 @@ const MapTools = /*@__PURE__*/ proxyCustomElement(class MapTools extends HTMLEle
         const fullscreenClass = this._showFullscreen ? "" : "display-none";
         const expandTip = this._showTools ? this._translations.collapse : this._translations.expand;
         const containerClass = !this.enableBasemap && !this.enableFullscreen && !this.enableLegend && !this.enableSearch ? "display-none" : "";
-        const toolMarginClass = this.enableMapToolsExpand ? "margin-top-1-2" : "";
+        const toolMarginClass = this.enableSingleExpand ? "margin-top-1-2" : "";
         const toolOrder = this.toolOrder ? this.toolOrder : ["legend", "search", "fullscreen", "floorfilter"];
         const shadowClass = this.stackTools ? "box-shadow" : "";
-        return (h(Host, null, h("div", { class: containerClass }, this.enableMapToolsExpand ? (h("div", { class: "box-shadow" }, this._getActionGroup(toggleIcon, false, expandTip, () => this._toggleTools()))) : undefined, h("div", { class: `${toolMarginClass} ${shadowClass} ${toolsClass}` }, this._getMapWidgets(toolOrder))), h("basemap-gallery", { basemapConfig: this.basemapConfig, class: basemapClass, mapView: this.mapView, ref: (el) => { this._basemapElement = el; } }), h("map-search", { class: searchClass, mapView: this.mapView, ref: (el) => { this._searchElement = el; }, resultGraphicEnabled: true, searchConfiguration: this.searchConfiguration }), h("map-legend", { class: legendClass, mapView: this.mapView, ref: (el) => { this._legendElement = el; } }), h("map-fullscreen", { class: fullscreenClass, mapView: this.mapView, onFullscreenStateChange: (evt) => this._fullscreenStateChange(evt.detail), ref: (el) => { this._fullscreenElement = el; } }), h("floor-filter", { class: floorFilterClass, enabled: this.enableFloorFilter, mapView: this.mapView, ref: (el) => { this._floorFilterElement = el; } })));
+        return (h(Host, null, h("div", { class: containerClass }, this.enableSingleExpand ? (h("div", { class: "box-shadow" }, this._getActionGroup(toggleIcon, false, expandTip, () => this._toggleTools()))) : undefined, h("div", { class: `${toolMarginClass} ${shadowClass} ${toolsClass}` }, this._getMapWidgets(toolOrder))), h("basemap-gallery", { basemapConfig: this.basemapConfig, class: basemapClass, mapView: this.mapView, ref: (el) => { this._basemapElement = el; } }), h("map-search", { class: searchClass, mapView: this.mapView, ref: (el) => { this._searchElement = el; }, resultGraphicEnabled: true, searchConfiguration: this.searchConfiguration }), h("map-legend", { class: legendClass, mapView: this.mapView, ref: (el) => { this._legendElement = el; } }), h("map-fullscreen", { class: fullscreenClass, mapView: this.mapView, onFullscreenStateChange: (evt) => this._fullscreenStateChange(evt.detail), ref: (el) => { this._fullscreenElement = el; } }), h("floor-filter", { class: floorFilterClass, enabled: this.enableFloorFilter, mapView: this.mapView, ref: (el) => { this._floorFilterElement = el; } })));
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Functions (protected)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * Load esri javascript api modules
+     *
+     * @returns Promise resolving when function is done
+     *
+     * @protected
+     */
+    async _initModules() {
+        const [Expand] = await loadModules([
+            "esri/widgets/Expand"
+        ]);
+        this.Expand = Expand;
     }
     /**
      * Set the size of the zoom tools based on the user defined homeZoomToolsSize variable.
@@ -198,27 +225,28 @@ const MapTools = /*@__PURE__*/ proxyCustomElement(class MapTools extends HTMLEle
         const fullscreenIcon = this._showFullscreen ? "full-screen-exit" : "full-screen";
         const fullscreenTip = this._showFullscreen ? this._translations.exitFullscreen : this._translations.enterFullscreen;
         return toolOrder.map(t => {
+            var _a, _b, _c, _d, _e;
             switch (t) {
                 case "legend":
-                    return this.enableLegend ?
+                    return this.enableLegend && this.enableSingleExpand ?
                         this._getActionGroup("legend", false, this._translations.legend, () => this._showLegend()) :
-                        undefined;
+                        this.enableLegend ? this._getWidget(t, (_a = this._legendElement) === null || _a === void 0 ? void 0 : _a.legendWidget, true) : undefined;
                 case "search":
-                    return this.enableSearch ?
+                    return this.enableSearch && this.enableSingleExpand ?
                         this._getActionGroup("magnifying-glass", false, this._translations.search, () => this._search()) :
-                        undefined;
+                        this.enableSearch ? this._getWidget(t, (_b = this._searchElement) === null || _b === void 0 ? void 0 : _b.searchWidget, true) : undefined;
                 case "fullscreen":
-                    return this.enableFullscreen ?
+                    return this.enableFullscreen && this.enableSingleExpand ?
                         this._getActionGroup(fullscreenIcon, false, fullscreenTip, () => this._expand()) :
-                        undefined;
+                        this.enableFullscreen ? this._getWidget(t, (_c = this._fullscreenElement) === null || _c === void 0 ? void 0 : _c.fullscreenWidget, false) : undefined;
                 case "basemap":
-                    return this.enableBasemap ?
+                    return this.enableBasemap && this.enableSingleExpand ?
                         this._getActionGroup("basemap", false, this._translations.basemap, () => this._toggleBasemapPicker()) :
-                        undefined;
+                        this.enableBasemap ? this._getWidget(t, (_d = this._basemapElement) === null || _d === void 0 ? void 0 : _d.basemapWidget, true) : undefined;
                 case "floorfilter":
-                    return this.enableFloorFilter && this._hasFloorInfo ?
+                    return this.enableFloorFilter && this._hasFloorInfo && this.enableSingleExpand ?
                         this._getActionGroup("urban-model", false, this._translations.floorFilter, () => this._toggleFloorFilter()) :
-                        undefined;
+                        this.enableFloorFilter && this._hasFloorInfo ? this._getWidget(t, (_e = this._floorFilterElement) === null || _e === void 0 ? void 0 : _e.floorFilterWidget, true) : undefined;
             }
         });
     }
@@ -237,11 +265,6 @@ const MapTools = /*@__PURE__*/ proxyCustomElement(class MapTools extends HTMLEle
             this._showFullscreen = true;
         }
     }
-    //--------------------------------------------------------------------------
-    //
-    //  Functions (protected)
-    //
-    //--------------------------------------------------------------------------
     /**
      * Get a calcite action group for the current action
      *
@@ -260,12 +283,40 @@ const MapTools = /*@__PURE__*/ proxyCustomElement(class MapTools extends HTMLEle
         const shadowClass = this.stackTools ? "" : "box-shadow";
         return (h("div", null, h("calcite-action", { alignment: "center", class: `${sizeClass} ${stackClass} border-bottom ${shadowClass}`, compact: false, disabled: disabled, icon: icon, id: icon, onClick: func, scale: "s", text: "" }, h("calcite-icon", { icon: "cheveron-up", scale: "s", slot: "icon" })), h("calcite-tooltip", { label: "", placement: "trailing", "reference-element": icon }, h("span", null, tip))));
     }
-    // need to discuss this with the team
+    /**
+     * Add the widget to the UI and optionally to an Expand widget
+     *
+     * @param name the icon to display for the current action
+     * @param content the widget to display
+     * @param internalExpand when true the widget will be added to an Expand widget
+     *
+     * @protected
+     */
+    _getWidget(name, content, internalExpand) {
+        if (this._widgets.indexOf(name) < 0 && this.mapView && content) {
+            const i = this.toolOrder.indexOf(name);
+            const exp = new this.Expand({
+                view: this.mapView,
+                content
+            });
+            const v = this.enableHome ? 2 : 1;
+            this.mapView.ui.add(internalExpand ? exp : content, {
+                position: this.position,
+                index: i > -1 ? i + v : 1
+            });
+            this._widgets.push(name);
+        }
+    }
+    /**
+     * Show/Hide the legend widget
+     */
     _showLegend() {
         this._showLegendWidget = !this._showLegendWidget;
         this._showTools = false;
     }
-    // Need to discuss this with the team
+    /**
+     * Show/Hide the search widget
+     */
     _search() {
         this._showSearchWidget = !this._showSearchWidget;
         this._showTools = false;
@@ -329,11 +380,13 @@ const MapTools = /*@__PURE__*/ proxyCustomElement(class MapTools extends HTMLEle
         "enableFullscreen": [4, "enable-fullscreen"],
         "enableSearch": [4, "enable-search"],
         "enableBasemap": [4, "enable-basemap"],
-        "enableMapToolsExpand": [4, "enable-map-tools-expand"],
+        "enableHome": [4, "enable-home"],
+        "enableSingleExpand": [4, "enable-single-expand"],
         "homeZoomToolsSize": [1, "home-zoom-tools-size"],
         "layout": [1],
         "mapView": [16],
         "mapWidgetsSize": [1, "map-widgets-size"],
+        "position": [1],
         "searchConfiguration": [16],
         "stackTools": [4, "stack-tools"],
         "toolOrder": [16],

package/dist/components/spatial-ref2.js

@@ -21087,16 +21087,19 @@ const spatialRefCss = ".spatial-ref-container{max-height:200px;margin-bottom:1re
 
 const SpatialRef = /*@__PURE__*/ proxyCustomElement(class SpatialRef extends HTMLElement {
     valueChanged(newValue) {
-        this.spatialReferenceChange.emit({
-            oldValue: this.value,
-            newValue: newValue
-        });
         this._spatialRef = this._createSpatialRefDisplay(newValue);
         const searchBox = document.getElementById("calcite-sr-search");
         if (searchBox) {
             searchBox.value = this._srSearchText = "";
         }
         this._clearSelection();
+        if (this._cachedValue !== this.value) {
+            this.spatialReferenceChange.emit({
+                oldValue: this._cachedValue,
+                newValue: this.value
+            });
+            this._cachedValue = this.value;
+        }
     }
     //--------------------------------------------------------------------------
     //
@@ -21110,6 +21113,7 @@ const SpatialRef = /*@__PURE__*/ proxyCustomElement(class SpatialRef extends HTM
         this.defaultWkid = 102100;
         this.disabled = false;
         this.value = this.defaultWkid.toString();
+        this._cachedValue = this.defaultWkid.toString();
         this._spatialRef = undefined;
         this._srSearchText = undefined;
         this._translations = undefined;
@@ -21320,6 +21324,7 @@ const SpatialRef = /*@__PURE__*/ proxyCustomElement(class SpatialRef extends HTM
         "defaultWkid": [1538, "default-wkid"],
         "disabled": [1540],
         "value": [1537],
+        "_cachedValue": [32],
         "_spatialRef": [32],
         "_srSearchText": [32],
         "_translations": [32],

package/dist/components/styles.js

@@ -0,0 +1,11 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+const DEFAULT_FONT_FAMILY = "'Avenir Next','Avenir','Helvetica Neue',sans-serif";
+function getFontFamily(fontFamily) {
+  return fontFamily ? fontFamily : DEFAULT_FONT_FAMILY;
+}
+
+export { getFontFamily as g };

package/dist/components/utils4.js

@@ -26,6 +26,12 @@ var EIcons;
   EIcons["Copy"] = "copy-to-clipboard";
   EIcons["Breadcrumb"] = "chevron-right";
   EIcons["DefaultIcon"] = "language";
+  EIcons["Title"] = "title";
+  EIcons["Subtitle"] = "subheading";
+  EIcons["Text"] = "text";
+  EIcons["Description"] = "description";
+  EIcons["Button"] = "button";
+  EIcons["String"] = "string";
 })(EIcons || (EIcons = {}));
 var ECalciteMode;
 (function (ECalciteMode) {
@@ -54,15 +60,19 @@ function generateUIData(appSettings, locales) {
   uiData.set('locales', locales);
   uiData.set('translatedLanguageLabels', Object.assign({}, appSettings.translatedLanguageLabels));
   appSettings.content.forEach(contentItem => {
-    var _a;
+    var _a, _b;
     const { type, label, value, uiLocation } = contentItem;
     const setting = existingUIData === null || existingUIData === void 0 ? void 0 : existingUIData.get(contentItem.id);
     uiData.set(contentItem.id, {
-      userLocaleData: { type, label, value },
+      userLocaleData: {
+        type: type !== null && type !== void 0 ? type : null,
+        label: label !== null && label !== void 0 ? label : null,
+        value: value !== null && value !== void 0 ? value : null,
+      },
       expanded: true,
       selected: (_a = setting === null || setting === void 0 ? void 0 : setting['selected']) !== null && _a !== void 0 ? _a : false,
       uiLocation,
-      tip: contentItem === null || contentItem === void 0 ? void 0 : contentItem.tip,
+      tip: (_b = contentItem === null || contentItem === void 0 ? void 0 : contentItem.tip) !== null && _b !== void 0 ? _b : null,
     });
   });
   const settingKeys = appSettings.content.map(contentItem => contentItem.id);

package/dist/esm/basemap-gallery_7.entry.js

@@ -727,17 +727,24 @@ const mapToolsCss = ":host{display:block}.display-none{display:none}.margin-top-
 const MapTools = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
+        /**
+         * string[]: List of widget names that have been added to the UI
+         * This prop is only used when enableSingleExpand is false
+         */
+        this._widgets = [];
         this.basemapConfig = undefined;
         this.enableLegend = undefined;
         this.enableFloorFilter = undefined;
         this.enableFullscreen = undefined;
         this.enableSearch = undefined;
         this.enableBasemap = undefined;
-        this.enableMapToolsExpand = undefined;
+        this.enableHome = undefined;
+        this.enableSingleExpand = undefined;
         this.homeZoomToolsSize = "m";
         this.layout = "vertical";
         this.mapView = undefined;
         this.mapWidgetsSize = "m";
+        this.position = "top-right";
         this.searchConfiguration = undefined;
         this.stackTools = true;
         this.toolOrder = undefined;
@@ -770,7 +777,7 @@ const MapTools = class {
     async _showBasemapWidgetWatchHandler(v) {
         if (v) {
             this.mapView.ui.add(this._basemapElement.basemapWidget, {
-                position: "top-right",
+                position: this.position,
                 index: 1
             });
         }
@@ -785,7 +792,7 @@ const MapTools = class {
         const widget = this._floorFilterElement.floorFilterWidget;
         if (v) {
             this.mapView.ui.add(widget, {
-                position: "top-right",
+                position: this.position,
                 index: 1
             });
         }
@@ -815,7 +822,7 @@ const MapTools = class {
     async _showLegendWidgetWatchHandler(v) {
         if (v) {
             this.mapView.ui.add(this._legendElement.legendWidget, {
-                position: "top-right",
+                position: this.position,
                 index: 1
             });
         }
@@ -829,7 +836,7 @@ const MapTools = class {
     async _showSearchWidgetWatchHandler(v) {
         if (v) {
             this.mapView.ui.add(this._searchElement.searchWidget, {
-                position: "top-right",
+                position: this.position,
                 index: 1
             });
         }
@@ -857,6 +864,7 @@ const MapTools = class {
      */
     async componentWillLoad() {
         await this._getTranslations();
+        await this._initModules();
     }
     /**
      * StencilJS: Renders the component.
@@ -872,10 +880,28 @@ const MapTools = class {
         const fullscreenClass = this._showFullscreen ? "" : "display-none";
         const expandTip = this._showTools ? this._translations.collapse : this._translations.expand;
         const containerClass = !this.enableBasemap && !this.enableFullscreen && !this.enableLegend && !this.enableSearch ? "display-none" : "";
-        const toolMarginClass = this.enableMapToolsExpand ? "margin-top-1-2" : "";
+        const toolMarginClass = this.enableSingleExpand ? "margin-top-1-2" : "";
         const toolOrder = this.toolOrder ? this.toolOrder : ["legend", "search", "fullscreen", "floorfilter"];
         const shadowClass = this.stackTools ? "box-shadow" : "";
-        return (h(Host, null, h("div", { class: containerClass }, this.enableMapToolsExpand ? (h("div", { class: "box-shadow" }, this._getActionGroup(toggleIcon, false, expandTip, () => this._toggleTools()))) : undefined, h("div", { class: `${toolMarginClass} ${shadowClass} ${toolsClass}` }, this._getMapWidgets(toolOrder))), h("basemap-gallery", { basemapConfig: this.basemapConfig, class: basemapClass, mapView: this.mapView, ref: (el) => { this._basemapElement = el; } }), h("map-search", { class: searchClass, mapView: this.mapView, ref: (el) => { this._searchElement = el; }, resultGraphicEnabled: true, searchConfiguration: this.searchConfiguration }), h("map-legend", { class: legendClass, mapView: this.mapView, ref: (el) => { this._legendElement = el; } }), h("map-fullscreen", { class: fullscreenClass, mapView: this.mapView, onFullscreenStateChange: (evt) => this._fullscreenStateChange(evt.detail), ref: (el) => { this._fullscreenElement = el; } }), h("floor-filter", { class: floorFilterClass, enabled: this.enableFloorFilter, mapView: this.mapView, ref: (el) => { this._floorFilterElement = el; } })));
+        return (h(Host, null, h("div", { class: containerClass }, this.enableSingleExpand ? (h("div", { class: "box-shadow" }, this._getActionGroup(toggleIcon, false, expandTip, () => this._toggleTools()))) : undefined, h("div", { class: `${toolMarginClass} ${shadowClass} ${toolsClass}` }, this._getMapWidgets(toolOrder))), h("basemap-gallery", { basemapConfig: this.basemapConfig, class: basemapClass, mapView: this.mapView, ref: (el) => { this._basemapElement = el; } }), h("map-search", { class: searchClass, mapView: this.mapView, ref: (el) => { this._searchElement = el; }, resultGraphicEnabled: true, searchConfiguration: this.searchConfiguration }), h("map-legend", { class: legendClass, mapView: this.mapView, ref: (el) => { this._legendElement = el; } }), h("map-fullscreen", { class: fullscreenClass, mapView: this.mapView, onFullscreenStateChange: (evt) => this._fullscreenStateChange(evt.detail), ref: (el) => { this._fullscreenElement = el; } }), h("floor-filter", { class: floorFilterClass, enabled: this.enableFloorFilter, mapView: this.mapView, ref: (el) => { this._floorFilterElement = el; } })));
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Functions (protected)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * Load esri javascript api modules
+     *
+     * @returns Promise resolving when function is done
+     *
+     * @protected
+     */
+    async _initModules() {
+        const [Expand] = await loadModules([
+            "esri/widgets/Expand"
+        ]);
+        this.Expand = Expand;
     }
     /**
      * Set the size of the zoom tools based on the user defined homeZoomToolsSize variable.
@@ -903,27 +929,28 @@ const MapTools = class {
         const fullscreenIcon = this._showFullscreen ? "full-screen-exit" : "full-screen";
         const fullscreenTip = this._showFullscreen ? this._translations.exitFullscreen : this._translations.enterFullscreen;
         return toolOrder.map(t => {
+            var _a, _b, _c, _d, _e;
             switch (t) {
                 case "legend":
-                    return this.enableLegend ?
+                    return this.enableLegend && this.enableSingleExpand ?
                         this._getActionGroup("legend", false, this._translations.legend, () => this._showLegend()) :
-                        undefined;
+                        this.enableLegend ? this._getWidget(t, (_a = this._legendElement) === null || _a === void 0 ? void 0 : _a.legendWidget, true) : undefined;
                 case "search":
-                    return this.enableSearch ?
+                    return this.enableSearch && this.enableSingleExpand ?
                         this._getActionGroup("magnifying-glass", false, this._translations.search, () => this._search()) :
-                        undefined;
+                        this.enableSearch ? this._getWidget(t, (_b = this._searchElement) === null || _b === void 0 ? void 0 : _b.searchWidget, true) : undefined;
                 case "fullscreen":
-                    return this.enableFullscreen ?
+                    return this.enableFullscreen && this.enableSingleExpand ?
                         this._getActionGroup(fullscreenIcon, false, fullscreenTip, () => this._expand()) :
-                        undefined;
+                        this.enableFullscreen ? this._getWidget(t, (_c = this._fullscreenElement) === null || _c === void 0 ? void 0 : _c.fullscreenWidget, false) : undefined;
                 case "basemap":
-                    return this.enableBasemap ?
+                    return this.enableBasemap && this.enableSingleExpand ?
                         this._getActionGroup("basemap", false, this._translations.basemap, () => this._toggleBasemapPicker()) :
-                        undefined;
+                        this.enableBasemap ? this._getWidget(t, (_d = this._basemapElement) === null || _d === void 0 ? void 0 : _d.basemapWidget, true) : undefined;
                 case "floorfilter":
-                    return this.enableFloorFilter && this._hasFloorInfo ?
+                    return this.enableFloorFilter && this._hasFloorInfo && this.enableSingleExpand ?
                         this._getActionGroup("urban-model", false, this._translations.floorFilter, () => this._toggleFloorFilter()) :
-                        undefined;
+                        this.enableFloorFilter && this._hasFloorInfo ? this._getWidget(t, (_e = this._floorFilterElement) === null || _e === void 0 ? void 0 : _e.floorFilterWidget, true) : undefined;
             }
         });
     }
@@ -942,11 +969,6 @@ const MapTools = class {
             this._showFullscreen = true;
         }
     }
-    //--------------------------------------------------------------------------
-    //
-    //  Functions (protected)
-    //
-    //--------------------------------------------------------------------------
     /**
      * Get a calcite action group for the current action
      *
@@ -965,12 +987,40 @@ const MapTools = class {
         const shadowClass = this.stackTools ? "" : "box-shadow";
         return (h("div", null, h("calcite-action", { alignment: "center", class: `${sizeClass} ${stackClass} border-bottom ${shadowClass}`, compact: false, disabled: disabled, icon: icon, id: icon, onClick: func, scale: "s", text: "" }, h("calcite-icon", { icon: "cheveron-up", scale: "s", slot: "icon" })), h("calcite-tooltip", { label: "", placement: "trailing", "reference-element": icon }, h("span", null, tip))));
     }
-    // need to discuss this with the team
+    /**
+     * Add the widget to the UI and optionally to an Expand widget
+     *
+     * @param name the icon to display for the current action
+     * @param content the widget to display
+     * @param internalExpand when true the widget will be added to an Expand widget
+     *
+     * @protected
+     */
+    _getWidget(name, content, internalExpand) {
+        if (this._widgets.indexOf(name) < 0 && this.mapView && content) {
+            const i = this.toolOrder.indexOf(name);
+            const exp = new this.Expand({
+                view: this.mapView,
+                content
+            });
+            const v = this.enableHome ? 2 : 1;
+            this.mapView.ui.add(internalExpand ? exp : content, {
+                position: this.position,
+                index: i > -1 ? i + v : 1
+            });
+            this._widgets.push(name);
+        }
+    }
+    /**
+     * Show/Hide the legend widget
+     */
     _showLegend() {
         this._showLegendWidget = !this._showLegendWidget;
         this._showTools = false;
     }
-    // Need to discuss this with the team
+    /**
+     * Show/Hide the search widget
+     */
     _search() {
         this._showSearchWidget = !this._showSearchWidget;
         this._showTools = false;

package/dist/esm/calcite-alert_3.entry.js

@@ -639,6 +639,7 @@ const InfoCard = class {
             this._features.clear();
             this._features.close();
         }
+        this._count = this._getCount();
     }
     /**
      * Watch for changes to the isMobile prop then init the Features widget
@@ -675,6 +676,14 @@ const InfoCard = class {
     async closeEdit() {
         this._editRecordOpen = false;
     }
+    /**
+     * Reset key properties when the layer selection changes
+     */
+    async layerSelectionChange() {
+        this._showListView = false;
+        this._features.viewModel.featureMenuOpen = false;
+        this._features.close();
+    }
     /**
      * Refresh the info-card graphics
      */
@@ -708,7 +717,7 @@ const InfoCard = class {
         const nextBackDisabled = ((_b = (_a = this._features) === null || _a === void 0 ? void 0 : _a.features) === null || _b === void 0 ? void 0 : _b.length) < 2;
         const nextBackClass = this.isMobile ? "display-none" : "";
         const shellClass = this.isMobile && !this._editRecordOpen ? "padding-top-46" : "";
-        return (h(Host, null, this.isMobile && !this._editRecordOpen ? (h("calcite-panel", null, h("calcite-action", { class: "end-border", icon: "chevron-left", iconFlipRtl: true, onClick: () => this._closePopup(), scale: "s", slot: "header-actions-start", text: "" }), h("span", { class: "font-bold", slot: "header-content" }, this._mobileTitle))) : undefined, h("calcite-shell", { class: shellClass }, h("calcite-loader", { class: loadingClass, label: this._translations.fetchingData }), h("div", { class: "esri-widget " + featureNodeClass, id: "features-node" }), h("div", { class: `${editButtonClass} width-100`, slot: "footer" }, h("div", { class: "display-flex top-border padding-1-2" }, h("calcite-button", { appearance: "solid", id: "solutions-edit", onClick: () => this._openEditRecord(), width: "full" }, this._translations.edit), this.isMobile ? (h("calcite-button", { appearance: "outline", class: "padding-inline-start-1", id: "solutions-cancel", onClick: () => this._closePopup(), width: "full" }, this._translations.cancel)) : undefined, h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "solutions-edit" }, h("span", null, this._translations.edit)), this.isMobile ? (h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "solutions-cancel" }, h("span", null, this._translations.cancel))) : undefined), h("div", { class: `display-flex padding-1-2 button-container top-border ${nextBackClass}` }, h("div", { class: "min-width-100" }, h("calcite-button", { appearance: "outline", disabled: nextBackDisabled, id: "solutions-back", onClick: () => this._back(), width: "full" }, this._translations.back), h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-back" }, h("span", null, this._translations.back))), h("div", null, h("calcite-action", { icon: "list", onClick: () => this._toggleListView(), scale: "s", text: this._getCount(), textEnabled: true })), h("div", { class: "min-width-100" }, h("calcite-button", { appearance: "outline", disabled: nextBackDisabled, id: "solutions-next", onClick: () => this._next(), width: "full" }, this._translations.next), h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-next" }, h("span", null, this._translations.next))))), h("edit-card", { class: editClass, graphicIndex: (_c = this._features) === null || _c === void 0 ? void 0 : _c.selectedFeatureIndex, graphics: this.graphics, mapView: this.mapView, open: this._editRecordOpen }), h("calcite-alert", { icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { slot: "title" }, this._translations.editDisabled), h("div", { slot: "message" }, this._translations.enableEditing)))));
+        return (h(Host, null, this.isMobile && !this._editRecordOpen ? (h("calcite-panel", null, h("calcite-action", { class: "end-border", icon: "chevron-left", iconFlipRtl: true, onClick: () => this._closePopup(), scale: "s", slot: "header-actions-start", text: "" }), h("span", { class: "font-bold", slot: "header-content" }, this._mobileTitle))) : undefined, h("calcite-shell", { class: shellClass }, h("calcite-loader", { class: loadingClass, label: this._translations.fetchingData }), h("div", { class: "esri-widget " + featureNodeClass, id: "features-node" }), h("div", { class: `${editButtonClass} width-100`, slot: "footer" }, h("div", { class: "display-flex top-border padding-1-2" }, h("calcite-button", { appearance: "solid", id: "solutions-edit", onClick: () => this._openEditRecord(), width: "full" }, this._translations.edit), this.isMobile ? (h("calcite-button", { appearance: "outline", class: "padding-inline-start-1", id: "solutions-cancel", onClick: () => this._closePopup(), width: "full" }, this._translations.cancel)) : undefined, h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "solutions-edit" }, h("span", null, this._translations.edit)), this.isMobile ? (h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "solutions-cancel" }, h("span", null, this._translations.cancel))) : undefined), h("div", { class: `display-flex padding-1-2 button-container top-border ${nextBackClass}` }, h("div", { class: "min-width-100" }, h("calcite-button", { appearance: "outline", disabled: nextBackDisabled, id: "solutions-back", onClick: () => this._back(), width: "full" }, this._translations.back), h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-back" }, h("span", null, this._translations.back))), h("div", null, h("calcite-action", { icon: "list", onClick: () => this._toggleListView(), scale: "s", text: this._count, textEnabled: true })), h("div", { class: "min-width-100" }, h("calcite-button", { appearance: "outline", disabled: nextBackDisabled, id: "solutions-next", onClick: () => this._next(), width: "full" }, this._translations.next), h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-next" }, h("span", null, this._translations.next))))), h("edit-card", { class: editClass, graphicIndex: (_c = this._features) === null || _c === void 0 ? void 0 : _c.selectedFeatureIndex, graphics: this.graphics, mapView: this.mapView, open: this._editRecordOpen }), h("calcite-alert", { icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { slot: "title" }, this._translations.editDisabled), h("div", { slot: "message" }, this._translations.enableEditing)))));
     }
     //--------------------------------------------------------------------------
     //

package/dist/esm/calcite-input-date-picker_3.entry.js

@@ -20,7 +20,7 @@ import { c as connectFocusTrap, d as deactivateFocusTrap, a as activateFocusTrap
 import { g as guid } from './guid-36c6c6a5.js';
 import { g as getIconScale } from './component-98bae46b.js';
 import { l as loadModules } from './loadModules-b677d6d7.js';
-import { g as getMessages } from './locale-89b49505.js';
+import { g as getMessages } from './locale-c7d9e9aa.js';
 import { g as getMode } from './mode-66911cb5.js';
 import './resources-cdc36705.js';
 import './debounce-229b1a22.js';
@@ -779,6 +779,7 @@ const InstantAppsFilterList = class {
         this.extentSelectorConfig = undefined;
         this.urlParams = undefined;
         this.view = undefined;
+        this.zoomBtn = true;
         this.loading = undefined;
         this.filterLayerExpressions = undefined;
         this.messages = undefined;
@@ -933,7 +934,7 @@ const InstantAppsFilterList = class {
     renderZoomTo(layerExpression) {
         var _a;
         const id = (layerExpression === null || layerExpression === void 0 ? void 0 : layerExpression.sublayerId) ? `zoom-to-${layerExpression.id}-${layerExpression.sublayerId}` : `zoom-to-${layerExpression.id}`;
-        return (h("div", { class: CSS$1.zoomTo }, h("calcite-button", { id: id, appearance: "transparent", kind: "neutral", scale: "s", iconStart: "magnifying-glass-plus", onClick: this.handleZoomTo.bind(this, layerExpression) }, (_a = this.messages) === null || _a === void 0 ? void 0 : _a.zoomTo)));
+        return this.zoomBtn ? (h("div", { class: CSS$1.zoomTo }, h("calcite-button", { id: id, appearance: "transparent", kind: "neutral", scale: "s", iconStart: "magnifying-glass-plus", onClick: this.handleZoomTo.bind(this, layerExpression) }, (_a = this.messages) === null || _a === void 0 ? void 0 : _a.zoomTo))) : undefined;
     }
     handleResetDatePicker(expression, layerExpression) {
         const datePicker = this.panelEl.querySelector(`[id='${expression.id}']`);
@@ -1758,6 +1759,7 @@ const InstantAppsSocialShare = class {
         this.embed = false;
         this.shareButtonColor = 'neutral';
         this.shareButtonType = 'button';
+        this.shareButtonScale = undefined;
         this.iframeInnerText = '';
         this.popoverButtonIconScale = 'm';
         this.view = undefined;
@@ -1889,7 +1891,7 @@ const InstantAppsSocialShare = class {
         return (h(Host, null, this.mode === 'popover'
             ? [
                 h("calcite-popover", { ref: (el) => (this.popoverRef = el), label: (_b = (_a = this.messages) === null || _a === void 0 ? void 0 : _a.share) === null || _b === void 0 ? void 0 : _b.label, referenceElement: "shareButton", placement: "bottom-start", scale: this.scale }, dialogContent),
-                (this.renderButton()),
+                this.renderButton(),
             ]
             : [
                 dialogContent,
@@ -1899,7 +1901,8 @@ const InstantAppsSocialShare = class {
     }
     renderButton() {
         var _a, _b, _c, _d, _e, _f, _g, _h;
-        return this.shareButtonType === "button" ? (h("calcite-button", { ref: el => (this.popoverButtonRef = el), onClick: this.togglePopover.bind(this), id: "shareButton", class: CSS.popoverButton, kind: this.shareButtonColor, appearance: "transparent", label: (_b = (_a = this.messages) === null || _a === void 0 ? void 0 : _a.share) === null || _b === void 0 ? void 0 : _b.label, title: (_d = (_c = this.messages) === null || _c === void 0 ? void 0 : _c.share) === null || _d === void 0 ? void 0 : _d.label, scale: this.scale }, h("div", { class: CSS.iconContainer }, h("calcite-icon", { icon: "share", scale: this.popoverButtonIconScale })))) : (h("calcite-action", { ref: el => (this.popoverButtonRef = el), onClick: this.togglePopover.bind(this), id: "shareButton", class: CSS.popoverButton, appearance: "transparent", label: (_f = (_e = this.messages) === null || _e === void 0 ? void 0 : _e.share) === null || _f === void 0 ? void 0 : _f.label, title: (_h = (_g = this.messages) === null || _g === void 0 ? void 0 : _g.share) === null || _h === void 0 ? void 0 : _h.label, scale: this.scale, text: "" }, h("div", { class: CSS.iconContainer }, h("calcite-icon", { icon: "share", scale: this.popoverButtonIconScale }))));
+        const scale = this.shareButtonScale != null ? this.shareButtonScale : this.scale;
+        return this.shareButtonType === 'button' ? (h("calcite-button", { ref: el => (this.popoverButtonRef = el), onClick: this.togglePopover.bind(this), id: "shareButton", class: CSS.popoverButton, kind: this.shareButtonColor, appearance: "transparent", label: (_b = (_a = this.messages) === null || _a === void 0 ? void 0 : _a.share) === null || _b === void 0 ? void 0 : _b.label, title: (_d = (_c = this.messages) === null || _c === void 0 ? void 0 : _c.share) === null || _d === void 0 ? void 0 : _d.label, scale: scale }, h("div", { class: CSS.iconContainer }, h("calcite-icon", { icon: "share", scale: this.popoverButtonIconScale })))) : (h("calcite-action", { ref: el => (this.popoverButtonRef = el), onClick: this.togglePopover.bind(this), id: "shareButton", class: CSS.popoverButton, appearance: "transparent", label: (_f = (_e = this.messages) === null || _e === void 0 ? void 0 : _e.share) === null || _f === void 0 ? void 0 : _f.label, title: (_h = (_g = this.messages) === null || _g === void 0 ? void 0 : _g.share) === null || _h === void 0 ? void 0 : _h.label, scale: scale, text: "" }, h("div", { class: CSS.iconContainer }, h("calcite-icon", { icon: "share", scale: this.popoverButtonIconScale }))));
     }
     renderSuccess() {
         var _a;