@esri/solutions-components 1.1.0-next.20250917.3 → 1.1.0-next.20250919

package/dist/components/map-card/customElement.js

@@ -2,15 +2,15 @@ import { c as b } from "../../chunks/runtime.js";
 import { l as y } from "../../chunks/loadModules.js";
 import { B as c } from "../../chunks/interfaces.js";
 import { joinAppProxies as _ } from "templates-common-library/functionality/proxy";
-import { g, b as I } from "../../chunks/mapViewUtils.js";
-import { u as v } from "../../chunks/useT9n.js";
-import { css as $, html as o, nothing as m } from "lit";
-import { createRef as n, ref as h } from "lit-html/directives/ref.js";
-import { LitElement as w, createEvent as r, noShadowRoot as L, safeClassMap as f } from "@arcgis/lumina";
+import { g, b as v } from "../../chunks/mapViewUtils.js";
+import { u as I } from "../../chunks/useT9n.js";
+import { css as $, html as l, nothing as m } from "lit";
+import { createRef as h, ref as r } from "lit-html/directives/ref.js";
+import { LitElement as w, createEvent as p, noShadowRoot as L, safeClassMap as f } from "@arcgis/lumina";
 import { defineCustomElements as M } from "@arcgis/instant-apps-components/loader";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.1/esri/copyright.txt for details.
-v1.1.0-next.20250917.3 */
+v1.1.0-next.20250919 */
 const S = $`@layer{/** @license
  * Copyright 2025 Esri
  *
@@ -28,7 +28,7 @@ const S = $`@layer{/** @license
  */:host{display:block;--calcite-label-margin-bottom: 0;--calcite-block-padding: 0}.map-height{height:calc(100% - 53px)}.height-full{height:100%}.height-49-px{height:49px}.box-shadow{box-shadow:none!important}.visibility-hidden-1{visibility:hidden;height:1px}.hidden{visibility:hidden!important}.display-flex{display:flex}.display-none{display:none}.display-block{display:block}.absolute-right{position:absolute;right:0;left:unset}.esri-ui-inner-container.esri-ui-corner-container{direction:ltr}html[dir=rtl] .absolute-right{left:0;right:unset}.panel-header-override{--calcite-panel-header-content-space: 0px}@media only screen and (max-width: 1024px){.esri-zoom{display:none!important}}}`;
 class T extends w {
   constructor() {
-    super(), this.defaultWebmapId = "", this.defaultLayerId = "", this.enableHome = !1, this.enableLegend = !1, this.enableFloorFilter = !1, this.enableFullscreen = !1, this.enableShare = !1, this.enableMapLayerPicker = !1, this.enableMapPicker = !1, this.enableSingleExpand = !1, this.enableSearch = !1, this.enableBasemap = !1, this.featureSelectionMode = "multiple", this.hide = !1, this.zoomToolsSize = "m", this.mapInfos = [], this.mapWidgetsIndex = 0, this.mapWidgetsPosition = "top-left", this.mobileMapWidgetsPosition = "top-right", this.mapWidgetsSize = "m", this.stackTools = !1, this.mapToolsOrder = [], this.mobileToolsOrder = [], this.isMapLayout = !1, this.shareIncludeEmbed = !1, this.shareIncludeSocial = !1, this.selectedFeaturesIds = [], this.showOnlyUpdatableLayers = !1, this.isMobile = !1, this.enableSelectionTool = !1, this._translations = v({ name: "map-card", blocking: !0 }), this._toolInfos = [], this._filterActive = !1, this._enabledLayerIds = [], this._defaultWebmapHonored = !1, this._loadedId = "", this._mapDiv = n(), this._mapPicker = n(), this._mapTools = n(), this._mobMapTools = n(), this._mapListExpanded = !1, this._definitionExpression = "", this._mapLayerPicker = n(), this._toolbar = n(), this._selectedWebMapId = "", this.mapChanged = r(), this.beforeMapChanged = r(), this.toggleFilter = r(), this.clearSelection = r(), this.editMultipleFeatures = r(), this.listenOn(window, "mapInfoChange", this.mapInfoChange), this.listenOn(window, "noLayersFound", this.noLayersFound), this.listenOn(window, "layerSelectionChange", this.layerSelectionChange), this.enableSingleExpand = !0, this.stackTools = !0, M(window);
+    super(), this.defaultWebmapId = "", this.defaultLayerId = "", this.enableHome = !1, this.enableLegend = !1, this.enableFloorFilter = !1, this.enableFullscreen = !1, this.enableShare = !1, this.enableMapLayerPicker = !1, this.enableMapPicker = !1, this.enableSingleExpand = !1, this.enableSearch = !1, this.enableBasemap = !1, this.featureSelectionMode = "multiple", this.hide = !1, this.zoomToolsSize = "m", this.mapInfos = [], this.mapWidgetsIndex = 0, this.mapWidgetsPosition = "top-left", this.mobileMapWidgetsPosition = "top-right", this.mapWidgetsSize = "m", this.stackTools = !1, this.mapToolsOrder = [], this.mobileToolsOrder = [], this.isMapLayout = !1, this.shareIncludeEmbed = !1, this.shareIncludeSocial = !1, this.selectedFeaturesIds = [], this.showOnlyUpdatableLayers = !1, this.isMobile = !1, this.enableSelectionTool = !1, this._translations = I({ name: "map-card", blocking: !0 }), this._toolInfos = [], this._filterActive = !1, this._enabledLayerIds = [], this._defaultWebmapHonored = !1, this._loadedId = "", this._mapDiv = h(), this._mapPicker = h(), this._mapTools = h(), this._mobMapTools = h(), this._mapListExpanded = !1, this._definitionExpression = "", this._mapLayerPicker = h(), this._toolbar = h(), this._selectedWebMapId = "", this._isValidWebMap = !0, this.mapChanged = p(), this.beforeMapChanged = p(), this.toggleFilter = p(), this.clearSelection = p(), this.editMultipleFeatures = p(), this.listenOn(window, "mapInfoChange", this.mapInfoChange), this.listenOn(window, "noLayersFound", this.noLayersFound), this.listenOn(window, "layerSelectionChange", this.layerSelectionChange), this.enableSingleExpand = !0, this.stackTools = !0, M(window);
   }
   static {
     this.properties = { appLayout: 1, appProxies: 1, defaultWebmapId: 1, defaultLayerId: 1, enableHome: 5, enableLegend: 5, enableFloorFilter: 5, enableFullscreen: 5, enableShare: 5, enableMapLayerPicker: 5, enableMapPicker: 5, enableSingleExpand: 5, enableSearch: 5, enableBasemap: 5, featureSelectionMode: 1, basemapConfig: 0, hide: 5, zoomToolsSize: 1, mapInfos: 0, mapWidgetsIndex: 9, mapWidgetsPosition: 1, mobileMapWidgetsPosition: 1, mapWidgetsSize: 1, mapView: 0, stackTools: 5, theme: 1, mapToolsOrder: 0, mobileToolsOrder: 0, isMapLayout: 5, shareIncludeEmbed: 5, shareIncludeSocial: 5, selectedFeaturesIds: 0, selectedLayer: 0, zoomToScale: 9, showOnlyUpdatableLayers: 5, isMobile: 5, mapInfo: 0, enableSelectionTool: 5, _translations: 16, _searchConfiguration: 16, _webMapInfo: 16, _toolInfos: 16, _filterActive: 16, _mapDivHeight: 16, _mapDivWidth: 16 };
@@ -88,8 +88,8 @@ class T extends w {
     }));
   }
   render() {
-    const e = this.hide ? "visibility-hidden-1" : "", i = this.theme === "dark" ? "calcite-mode-dark" : "calcite-mode-light", s = "height-full", t = this.isMapLayout ? "" : "display-none", a = this.isMobile ? "" : "hidden";
-    return this._validateActiveActions(), o`<calcite-panel class="height-full width-full panel-header-override">${this._getMapLayerPicker()}${this._getHeaderActions()}<div slot=header-actions-end class="display-flex absolute-right">${this.enableShare && this.isMapLayout ? this._getShare("share") : void 0}</div><calcite-progress class=${f(t)} value=0></calcite-progress><div class=${`${e} ${s}`}><div class="height-full" ${h(this._mapDiv)}></div></div>${o`<map-tools .basemapConfig=${this.basemapConfig} class=${`box-shadow ${i}`} .defaultLayerId=${this.defaultLayerId} .enableBasemap=${this.enableBasemap} .enableFloorFilter=${this.enableFloorFilter} .enableFullscreen=${this.enableFullscreen} .enableHome=${this.enableHome} .enableLegend=${this.enableLegend} .enableSearch=${this.enableSearch} .enableSingleExpand=${this.enableSingleExpand} .enableSelectionTool=${this.enableSelectionTool} .isMobile=${this.isMobile} .parentComponentHeight=${this._mapDivHeight} .parentComponentWidth=${this._mapDivWidth} .zoomToolsSize=${this.zoomToolsSize} layout=horizontal .mapView=${this.mapView} .mapWidgetsSize=${this.mapWidgetsSize} .position=${this.mapWidgetsPosition} .selectedLayer=${this.selectedLayer} .searchConfiguration=${this._searchConfiguration} .stackTools=${this.stackTools} .toolOrder=${this.mapToolsOrder} ${h(this._mapTools)}></map-tools><map-tools class=${`box-shadow ${i} ${a}`} .defaultLayerId=${this.defaultLayerId} .enabledLayerIds=${this._enabledLayerIds} .enableMapLayerPicker=${this.enableMapLayerPicker} .enableMapPicker=${this.enableMapPicker} .isMobile=${this.isMobile} .zoomToolsSize=${this.zoomToolsSize} layout=vertical .mapInfos=${this.mapInfos} .mapView=${this.mapView} .mapWidgetsSize=${this.mapWidgetsSize} .parentComponentHeight=${this._mapDivHeight} .position=${this.mobileMapWidgetsPosition} .selectedLayer=${this.selectedLayer} .selectedWebMapId=${this._selectedWebMapId} .showOnlyUpdatableLayers=${this.showOnlyUpdatableLayers} .stackTools=${this.stackTools} .toolOrder=${this.mobileToolsOrder} ${h(this._mobMapTools)}></map-tools>`}</calcite-panel>`;
+    const e = this.hide ? "visibility-hidden-1" : "", i = this.theme === "dark" ? "calcite-mode-dark" : "calcite-mode-light", s = "height-full", t = this.isMapLayout ? "" : "display-none", a = this._isValidWebMap ? "" : "hidden", n = this.isMobile ? "" : "hidden";
+    return this._handleMapVisibility(), this._validateActiveActions(), l`<calcite-panel class="height-full width-full panel-header-override">${this._getMapLayerPicker()}${this._getHeaderActions()}<div slot=header-actions-end class="display-flex absolute-right">${this.enableShare && this.isMapLayout ? this._getShare("share") : void 0}</div><calcite-progress class=${f(t)} value=0></calcite-progress><div class=${`${e} ${s}`}><div class="height-full" ${r(this._mapDiv)}></div></div>${l`<map-tools .basemapConfig=${this.basemapConfig} class=${`box-shadow ${i} ${a}`} .defaultLayerId=${this.defaultLayerId} .enableBasemap=${this.enableBasemap} .enableFloorFilter=${this.enableFloorFilter} .enableFullscreen=${this.enableFullscreen} .enableHome=${this.enableHome} .enableLegend=${this.enableLegend} .enableSearch=${this.enableSearch} .enableSingleExpand=${this.enableSingleExpand} .enableSelectionTool=${this.enableSelectionTool} .isMobile=${this.isMobile} .parentComponentHeight=${this._mapDivHeight} .parentComponentWidth=${this._mapDivWidth} .zoomToolsSize=${this.zoomToolsSize} layout=horizontal .mapView=${this.mapView} .mapWidgetsSize=${this.mapWidgetsSize} .position=${this.mapWidgetsPosition} .selectedLayer=${this.selectedLayer} .searchConfiguration=${this._searchConfiguration} .stackTools=${this.stackTools} .toolOrder=${this.mapToolsOrder} ${r(this._mapTools)}></map-tools><map-tools class=${`box-shadow ${i} ${n}`} .defaultLayerId=${this.defaultLayerId} .enabledLayerIds=${this._enabledLayerIds} .enableMapLayerPicker=${this.enableMapLayerPicker} .enableMapPicker=${this.enableMapPicker} .isMobile=${this.isMobile} .zoomToolsSize=${this.zoomToolsSize} layout=vertical .mapInfos=${this.mapInfos} .mapView=${this.mapView} .mapWidgetsSize=${this.mapWidgetsSize} .parentComponentHeight=${this._mapDivHeight} .position=${this.mobileMapWidgetsPosition} .selectedLayer=${this.selectedLayer} .selectedWebMapId=${this._selectedWebMapId} .showOnlyUpdatableLayers=${this.showOnlyUpdatableLayers} .stackTools=${this.stackTools} .toolOrder=${this.mobileToolsOrder} ${r(this._mobMapTools)}></map-tools>`}</calcite-panel>`;
   }
   updated() {
     this._mapDivHeight = this._mapDiv.value?.offsetHeight ?? 0, document.onclick = (e) => this._handleDocumentClick(e);
@@ -107,41 +107,52 @@ class T extends w {
     this.WebMap = e, this.MapView = i, this.Home = s, this.esriConfig = t;
   }
   async _loadMap(e) {
-    const i = !this._defaultWebmapHonored && this.defaultWebmapId, s = this.mapInfos?.filter((l) => l.id === this.defaultWebmapId), t = JSON.stringify(e) !== JSON.stringify(this._webMapInfo);
+    const i = !this._defaultWebmapHonored && this.defaultWebmapId, s = this.mapInfos?.filter((o) => o.id === this.defaultWebmapId), t = JSON.stringify(e) !== JSON.stringify(this._webMapInfo);
     this._webMapInfo = i && s ? s[0] : !e?.id && this.mapInfos.length > 0 ? this.mapInfos[0] : e;
-    const a = this._webMapInfo.id, d = i && e?.id === this.defaultWebmapId;
-    if (this._loadedId !== a && !i || d) {
-      const l = this.WebMap && new this.WebMap({
+    const a = this._webMapInfo.id, n = i && e?.id === this.defaultWebmapId;
+    if (this._loadedId !== a && !i || n) {
+      const o = this.WebMap && new this.WebMap({
         portalItem: { id: a }
       });
-      this.appProxies && l && this.esriConfig && (await l.load(), await _(l, this.esriConfig, this.appProxies)), this.mapView = this.MapView && new this.MapView({
-        container: this._mapDiv.value,
-        map: l,
-        resizeAlign: "center"
-      }), this._loadedId = a, this._searchConfiguration = this._webMapInfo.searchConfiguration, this.beforeMapChanged.emit(), this.mapView && await this.mapView.when(() => {
-        if (this.mapView) {
-          const p = this.isMobile ? 160 : 110;
-          this._mapDivWidth = this._mapDiv.value && this._mapDiv.value.offsetWidth - p, this._mapTools.value && this.mapView.ui.add(this._mapTools.value, { position: this.mapWidgetsPosition, index: this.mapWidgetsIndex }), this._mobMapTools.value && this.mapView.ui.add(this._mobMapTools.value, { position: this.mobileMapWidgetsPosition, index: this.mapWidgetsIndex }), this._defaultWebmapHonored = d ? !0 : this._defaultWebmapHonored, this.mapChanged.emit({
-            id: a,
-            mapView: this.mapView
-          });
-        }
-      });
+      try {
+        o && await o.load(), this.appProxies && o && this.esriConfig && await _(o, this.esriConfig, this.appProxies), this.mapView = this.MapView && new this.MapView({
+          container: this._mapDiv.value,
+          map: o,
+          resizeAlign: "center"
+        }), this._loadedId = a, this._searchConfiguration = this._webMapInfo.searchConfiguration, this.beforeMapChanged.emit(), this.mapView && await this.mapView.when(() => {
+          if (this.mapView) {
+            const d = this.isMobile ? 160 : 110;
+            this._mapDivWidth = this._mapDiv.value && this._mapDiv.value.offsetWidth - d, this._mapTools.value && this.mapView.ui.add(this._mapTools.value, { position: this.mapWidgetsPosition, index: this.mapWidgetsIndex }), this._mobMapTools.value && this.mapView.ui.add(this._mobMapTools.value, { position: this.mobileMapWidgetsPosition, index: this.mapWidgetsIndex }), this._defaultWebmapHonored = n ? !0 : this._defaultWebmapHonored, this._isValidWebMap = !0, this.mapChanged.emit({
+              id: a,
+              mapView: this.mapView,
+              isValid: !0
+            }), this.isMobile || document.getElementsByClassName("esri-zoom")[0]?.classList.remove("display-none");
+          }
+        });
+      } catch (d) {
+        console.error(d), this._loadedId = a, this._isValidWebMap = !1, this.mapChanged.emit({
+          id: a,
+          mapView: void 0,
+          isValid: !1
+        }), document.getElementsByClassName("esri-zoom")[0]?.classList.add("display-none");
+        return;
+      }
     } else i ? (this._defaultWebmapHonored = !0, this._mapPicker.value && this._mapPicker.value.setMapByID(a)) : t && this.mapView && (this._searchConfiguration = this._webMapInfo.searchConfiguration, this.beforeMapChanged.emit(), this.mapChanged.emit({
       id: a,
-      mapView: this.mapView
+      mapView: this.mapView,
+      isValid: !0
     }));
     this._updateShareUrl();
   }
   _getMapLayerPicker() {
     const e = this.isMapLayout ? "header-actions-start" : "", i = this.mapInfos?.length > 1 ? "" : "display-none", s = this.isMapLayout ? "height-0" : "width-full", t = "display-flex", a = this.isMapLayout ? "" : "display-none";
-    return o`${!this.isMobile && o`<div slot=${e ?? m}><map-picker class=${`${i} ${s}`} id=map-picker .isMapLayout=${this.isMapLayout} .mapInfos=${this.mapInfos} .selectedWebMapId=${this._selectedWebMapId} ${h(this._mapPicker)}></map-picker></div>` || ""}<div slot=header-actions-start class=${`mapView-header display-flex ${a}`} id=solutions-map-layer-picker-container><div class=${`border-end ${t}`}>${this.mapView && o`<map-layer-picker appearance=transparent .defaultLayerId=${this.defaultLayerId} display=inline-flex .enabledLayerIds=${this._enabledLayerIds} height=50 .isMobile=${this.isMobile} .mapView=${this.mapView} .showOnlyUpdatableLayers=${this.showOnlyUpdatableLayers} placeholder-icon=layers scale=l .selectedIds=${this.selectedLayer ? [this.selectedLayer.id] : []} show-single-layer-as-label show-tables show-tables-disabled type=dropdown ${h(this._mapLayerPicker)}></map-layer-picker>` || ""}</div></div>`;
+    return l`${!this.isMobile && l`<div slot=${e ?? m}><map-picker class=${`${i} ${s}`} id=map-picker .isMapLayout=${this.isMapLayout} .mapInfos=${this.mapInfos} .selectedWebMapId=${this._selectedWebMapId} ${r(this._mapPicker)}></map-picker></div>` || ""}<div slot=header-actions-start class=${`mapView-header display-flex ${a}`} id=solutions-map-layer-picker-container><div class=${`border-end ${t}`}>${this.mapView && l`<map-layer-picker appearance=transparent .defaultLayerId=${this.defaultLayerId} display=inline-flex .enabledLayerIds=${this._enabledLayerIds} height=50 .isMobile=${this.isMobile} .mapView=${this.mapView} .showOnlyUpdatableLayers=${this.showOnlyUpdatableLayers} placeholder-icon=layers scale=l .selectedIds=${this.selectedLayer ? [this.selectedLayer.id] : []} show-single-layer-as-label show-tables show-tables-disabled type=dropdown ${r(this._mapLayerPicker)}></map-layer-picker>` || ""}</div></div>`;
   }
   _getHeaderActions() {
-    return o`<div slot=header-content><calcite-action-bar class=${f("display-flex")} expand-disabled expanded id=${this._getId("bar") ?? m} layout=horizontal><calcite-action-group>${this.isMapLayout ? this._getActions() : void 0}</calcite-action-group></calcite-action-bar></div>`;
+    return l`<div slot=header-content><calcite-action-bar class=${f("display-flex")} expand-disabled expanded id=${this._getId("bar") ?? m} layout=horizontal><calcite-action-group>${this.isMapLayout ? this._getActions() : void 0}</calcite-action-group></calcite-action-bar></div>`;
   }
   _getShare(e) {
-    return o`<div class="share-action" id=${this._getId(e) ?? m}>${this.mapView && o`<instant-apps-social-share class="instant-app-share" .embed=${this.shareIncludeEmbed} flip-rtl popover-button-icon-scale=s scale=m share-button-color=neutral share-button-type=action .socialMedia=${this.shareIncludeSocial} .view=${this.mapView} ${h((i) => {
+    return l`<div class="share-action" id=${this._getId(e) ?? m}>${this.mapView && l`<instant-apps-social-share class="instant-app-share" .embed=${this.shareIncludeEmbed} flip-rtl popover-button-icon-scale=s scale=m share-button-color=neutral share-button-type=action .socialMedia=${this.shareIncludeSocial} .view=${this.mapView} ${r((i) => {
       i && (this._shareNode = i, this._updateShareUrl());
     })}></instant-apps-social-share>` || ""}${this._getToolTip("bottom", `map-${e}`, this._translations?.share)}</div>`;
   }
@@ -202,6 +213,12 @@ class T extends w {
       i && e.indexOf(i.icon) > -1 && i.icon === "filter" && (i.indicator = this._filterActive);
     });
   }
+  _handleMapVisibility() {
+    if (this._mapDiv.value) {
+      const e = this._mapDiv.value.getElementsByClassName("esri-view-surface")[0], i = this._mapDiv.value.getElementsByClassName("esri-attribution")[0];
+      this._isValidWebMap ? (e?.classList.remove("hidden"), i?.classList.remove("hidden")) : (e?.classList.add("hidden"), i?.classList.add("hidden"));
+    }
+  }
   _validateEnabledActions() {
     const e = this.selectedFeaturesIds.length > 0, i = this.selectedFeaturesIds.length < 2 || this.selectedFeaturesIds.length > c, s = ["zoom-to-object", "pencil", "erase"];
     this._toolInfos?.forEach((t) => {
@@ -214,7 +231,7 @@ class T extends w {
   async _zoom() {
     if (this.selectedLayer && this.mapView) {
       const e = await g(this.mapView, this.selectedLayer.id);
-      e && await I(this.selectedFeaturesIds, e, this.mapView, !0, void 0, this.zoomToScale);
+      e && await v(this.selectedFeaturesIds, e, this.mapView, !0, void 0, this.zoomToScale);
     }
   }
   async _toggleFilter() {
@@ -228,11 +245,11 @@ class T extends w {
     return this._toolInfos?.reduce((e, i) => (i && e.push(this._getAction(i.active, i.icon, i.indicator, i.label, i.func, i.disabled, i.loading, i.toolTip)), e), []);
   }
   _getToolTip(e, i, s) {
-    return o`<calcite-tooltip .placement=${e} .referenceElement=${i}><span>${s}</span></calcite-tooltip>`;
+    return l`<calcite-tooltip .placement=${e} .referenceElement=${i}><span>${s}</span></calcite-tooltip>`;
   }
-  _getAction(e, i, s, t, a, d, l, p) {
-    const u = this.selectedLayer === void 0 ? !0 : d;
-    return o`<calcite-action .active=${e} appearance=solid .disabled=${u} .icon=${i} .id=${`map-${i}`} .indicator=${s} .label=${t} .loading=${l} @click=${a} .text=${t} text-enabled></calcite-action>${this._getToolTip("auto", `map-${i}`, p)}`;
+  _getAction(e, i, s, t, a, n, o, d) {
+    const u = this.selectedLayer === void 0 ? !0 : n;
+    return l`<calcite-action .active=${e} appearance=solid .disabled=${u} .icon=${i} .id=${`map-${i}`} .indicator=${s} .label=${t} .loading=${o} @click=${a} .text=${t} text-enabled></calcite-action>${this._getToolTip("auto", `map-${i}`, d)}`;
   }
   _getId(e) {
     return `solutions-action-${e}`;

package/dist/components/map-draw-tools/customElement.js

@@ -9,7 +9,7 @@ import { useContextConsumer as k } from "@arcgis/lumina/context";
 import { p as w } from "../../chunks/publicNotificationContext.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.1/esri/copyright.txt for details.
-v1.1.0-next.20250917.3 */
+v1.1.0-next.20250919 */
 const _ = d`@layer{/** @license
  * Copyright 2025 Esri
  *
@@ -25,7 +25,7 @@ const _ = d`@layer{/** @license
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */:host{display:block}.border{outline:1px solid var(--calcite-color-border-input)}.div-visible{display:inherit}.div-not-visible{display:none!important}.padding-top-1-2{padding-top:.5rem}.main-label{display:flex;float:left}html[dir=rtl] .main-label{display:flex;float:right}.margin-top-1{margin-top:1rem}.border-left{border-left:1px solid rgba(110,110,110,.3)}.border-left[dir=rtl]{border-right:1px solid rgba(110,110,110,.3)}.esri-widget{box-sizing:border-box;color:#323232;font-size:14px;font-family:Avenir Next,Helvetica Neue,Helvetica,Arial,sans-serif;line-height:1.3em;background-color:#fff;--esri-widget-padding-v: 12px;--esri-widget-padding-h: 15px;--esri-widget-padding: var(--esri-widget-padding-v) var(--esri-widget-padding-h)}.esri-sketch__panel{align-items:center;display:flex;flex-flow:row wrap;padding:0;justify-content:flex-start!important}.esri-sketch__section{align-items:center;display:flex;flex-flow:row wrap;padding:0 7px;margin:6px 0}.esri-responsive-toolbar__bar--horizontal{--calcite-action-group-border-color: var(--calcite-color-border-3) !important}}`;
-class b extends f {
+class u extends f {
   constructor() {
     super(...arguments), this.active = !1, this.drawMode = a.SKETCH, this.editGraphicsEnabled = !0, this.graphics = [], this.redoEnabled = !1, this.undoEnabled = !1, this._translations = n({ name: "map-draw-tools", blocking: !0 }), this._pnContextConsumer = k({
       context: w,
@@ -122,7 +122,9 @@ class b extends f {
     }), this._sketchWidget && this._sketchWidget.viewModel) {
       this._sketchViewModel = this.SketchViewModel && new this.SketchViewModel({
         ...e
-      }), this.polylineSymbol && (this._sketchWidget.viewModel.polylineSymbol = this.polylineSymbol), this.pointSymbol && (this._sketchWidget.viewModel.pointSymbol = this.pointSymbol), this.polygonSymbol && (this._sketchWidget.viewModel.polygonSymbol = this.polygonSymbol);
+      }), this.polylineSymbol && (this._sketchWidget.viewModel.polylineSymbol = this.polylineSymbol), this.pointSymbol && (this._sketchWidget.viewModel.pointSymbol = this.pointSymbol), this.polygonSymbol && (this._sketchWidget.viewModel.polygonSymbol = this.polygonSymbol), this._sketchWidget?.when(async () => {
+        await new Promise((s) => setTimeout(s, 50)), this._sketchElement.value?.getElementsByTagName("calcite-popover")[0]?.setAttribute("placement", "auto");
+      });
       let t = !1;
       this._sketchWidget.viewModel.addHandles(this._sketchWidget.on("create", (i) => {
         i.state === "complete" && (this.graphics = [i.graphic], this.sketchGraphicsChange.emit({
@@ -182,7 +184,7 @@ class b extends f {
     s && e.forEach((r) => r.symbol = s);
   }
 }
-l("map-draw-tools", b);
+l("map-draw-tools", u);
 export {
-  b as MapDrawTools
+  u as MapDrawTools
 };

package/dist/components/map-fullscreen/customElement.js

@@ -5,7 +5,7 @@ import { createRef as a, ref as r } from "lit-html/directives/ref.js";
 import { LitElement as c, createEvent as h } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.1/esri/copyright.txt for details.
-v1.1.0-next.20250917.3 */
+v1.1.0-next.20250919 */
 const d = l`/** @license
  * Copyright 2025 Esri
  *

package/dist/components/map-layer-picker/customElement.js

@@ -1,15 +1,15 @@
 import { c as m } from "../../chunks/runtime.js";
 import { d as p, e as b, f as _ } from "../../chunks/mapViewUtils.js";
 import { u } from "../../chunks/useT9n.js";
-import { css as f, html as a, nothing as l } from "lit";
+import { css as g, html as i, nothing as l } from "lit";
 import { createRef as o, ref as d } from "lit-html/directives/ref.js";
-import { LitElement as g, createEvent as n, noShadowRoot as L, safeStyleMap as c, safeClassMap as y } from "@arcgis/lumina";
+import { LitElement as f, createEvent as r, noShadowRoot as L, safeStyleMap as c, safeClassMap as y } from "@arcgis/lumina";
 import { useContextConsumer as w } from "@arcgis/lumina/context";
 import { p as v } from "../../chunks/publicNotificationContext.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.1/esri/copyright.txt for details.
-v1.1.0-next.20250917.3 */
-const I = f`@layer{/** @license
+v1.1.0-next.20250919 */
+const I = g`@layer{/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -24,12 +24,12 @@ const I = f`@layer{/** @license
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */:host{display:block}.map-layer-picker-container{width:100%;align-items:center}.map-layer-picker{position:relative;width:100%;display:inline-block}.padding-bottom-1{padding-bottom:1rem}.layer-picker-dropdown{height:100%;width:100%}.max-width-350{max-width:350px}.height-100{height:100%}.disabled{cursor:default!important;user-select:none;opacity:var(--calcite-opacity-disabled);pointer-events:none}.no-bottom-margin{--calcite-label-margin-bottom: 0px}.layer-picker-label-container{align-items:center;display:inline-flex;height:100%;padding-inline-start:1rem;padding-inline-end:1rem}.padding-start-1{padding-inline-start:1rem}.cursor-default{cursor:default}.popover-list{overflow:auto;width:250px}}`;
-class $ extends g {
+class $ extends f {
   constructor() {
-    super(...arguments), this.appearance = "transparent", this.defaultLayerId = "", this.display = "inline-block", this.enabledLayerIds = [], this.isMobile = !1, this.showOnlyUpdatableLayers = !1, this.placeholderIcon = "", this.selectedIds = [], this.scale = "m", this.showTables = !1, this.showTablesDisabled = !1, this.showSingleLayerAsLabel = !1, this.type = "select", this.showLayersListInPopover = !1, this.referenceElement = "", this.force = !1, this._hasMultipleLayers = !0, this._hasValidLayers = !0, this._isDropdownOpen = !1, this.ids = [], this.selectedName = "", this._translations = u({ name: "map-layer-picker", blocking: !0 }), this.defaultLayerHonored = !1, this._layerSelectElement = o(), this._layerComboboxElement = o(), this._pnContextConsumer = w({
+    super(), this.appearance = "transparent", this.defaultLayerId = "", this.display = "inline-block", this.enabledLayerIds = [], this.isMobile = !1, this.showOnlyUpdatableLayers = !1, this.placeholderIcon = "", this.selectedIds = [], this.scale = "m", this.showTables = !1, this.showTablesDisabled = !1, this.showSingleLayerAsLabel = !1, this.type = "select", this.showLayersListInPopover = !1, this.referenceElement = "", this.force = !1, this._hasMultipleLayers = !0, this._hasValidLayers = !0, this._isDropdownOpen = !1, this.ids = [], this.selectedName = "", this._translations = u({ name: "map-layer-picker", blocking: !0 }), this.defaultLayerHonored = !1, this._layerSelectElement = o(), this._layerComboboxElement = o(), this._pnContextConsumer = w({
       context: v,
       subscribe: !0
-    }), this._skipEditCheck = !1, this._popover = o(), this.beforeLayerSelectionChange = n(), this.idsFound = n(), this.noLayersFound = n(), this.layerSelectionChange = n();
+    }), this._skipEditCheck = !1, this._popover = o(), this.beforeLayerSelectionChange = r(), this.idsFound = r(), this.noLayersFound = r(), this.layerSelectionChange = r(), this.listenOn(window, "mapChanged", this.mapChanged);
   }
   static {
     this.properties = { appearance: 1, defaultLayerId: 1, display: 1, enabledLayerIds: 0, height: 9, isMobile: 5, mapView: 0, showOnlyUpdatableLayers: 5, placeholderIcon: 1, selectedIds: 0, scale: 1, showTables: 5, showTablesDisabled: 5, showSingleLayerAsLabel: 5, type: 1, showLayersListInPopover: 5, referenceElement: 1, force: 16, _hasMultipleLayers: 16, _hasValidLayers: 16, _isDropdownOpen: 16, ids: 16, selectedName: 16, _translations: 16 };
@@ -47,8 +47,8 @@ class $ extends g {
     })(), e.has("enabledLayerIds") && this.hasUpdated && this.enabledLayerIdsWatchHandler();
   }
   async enabledLayerIdsWatchHandler() {
-    const e = this.selectedIds.length > 0 && !this.enabledLayerIds.includes(this.selectedIds[0]), t = this.enabledLayerIds.some((s) => !this.ids.includes(s));
-    e ? this.mapViewWatchHandler() : t && this._setLayers(), this._hasMultipleLayers = this.enabledLayerIds.length > 1;
+    const e = this.selectedIds.length > 0 && !this.enabledLayerIds.includes(this.selectedIds[0]), t = this.enabledLayerIds.some((a) => !this.ids.includes(a)), s = this.ids.toString() !== this.enabledLayerIds.toString();
+    e ? this.mapViewWatchHandler() : (t || s) && this._setLayers(), this._hasMultipleLayers = this.enabledLayerIds.length > 1;
   }
   async mapViewWatchHandler() {
     await this._setLayers(), this.ids?.length > 0 ? (this._hasValidLayers = !0, this._hasMultipleLayers = this.ids.length > 1, await this._setSelectedLayer(this.ids[0])) : (this._hasValidLayers = !1, this.noLayersFound.emit());
@@ -64,13 +64,16 @@ class $ extends g {
   async updateLayer() {
     await this._setSelectedLayer(this.ids[0]);
   }
+  async mapChanged(e) {
+    e.detail.isValid || (this._hasValidLayers = !1, this.noLayersFound.emit());
+  }
   async load() {
     await this._setLayers(), this.ids?.length > 0 ? (this._hasValidLayers = !0, this._hasMultipleLayers = this.ids.length > 1, await this._setSelectedLayer(this.ids[0])) : (this._hasValidLayers = !1, this.noLayersFound.emit());
   }
   render() {
     const e = "map-layer-picker";
     let t = this.height && this.height > 0 && !this.showLayersListInPopover ? { height: `${this.height.toString()}px` } : {};
-    return t = { ...t, display: this.display }, a`<div class="map-layer-picker-container" style=${c(t)}><div class="map-layer-picker" style=${c(t)}>${this._hasValidLayers ? !this._hasMultipleLayers && this.showSingleLayerAsLabel ? this._getSingleLayerPlaceholder() : this.type === "combobox" ? this._getCombobox(e) : this.type === "select" ? this._getSelect(e) : this.showLayersListInPopover ? this._getMapLayerPopOver() : this._getDropdown(e) : this._getInvalidPlaceholder()}</div></div>`;
+    return t = { ...t, display: this.display }, i`<div class="map-layer-picker-container" style=${c(t)}><div class="map-layer-picker" style=${c(t)}>${this._hasValidLayers ? !this._hasMultipleLayers && this.showSingleLayerAsLabel ? this._getSingleLayerPlaceholder() : this.type === "combobox" ? this._getCombobox(e) : this.type === "select" ? this._getSelect(e) : this.showLayersListInPopover ? this._getMapLayerPopOver() : this._getDropdown(e) : this._getInvalidPlaceholder()}</div></div>`;
   }
   loaded() {
     if (this.ids?.length > 0 || this.selectedIds?.length === 1) {
@@ -83,30 +86,30 @@ class $ extends g {
   }
   _getMapLayerPopOver() {
     const e = this.height && this.height > 0 ? { "max-height": `${this.height.toString()}px` } : {};
-    return a`<calcite-popover auto-close focus-trap-disabled .label=${this.referenceElement} placement=left .referenceElement=${this.referenceElement} scale=s ${d(this._popover)}><div class=popover-list style=${c(e)}>${this._getMapLayerOptions()}</div></calcite-popover>`;
+    return i`<calcite-popover auto-close focus-trap-disabled .label=${this.referenceElement} placement=left .referenceElement=${this.referenceElement} scale=s ${d(this._popover)}><div class=popover-list style=${c(e)}>${this._getMapLayerOptions()}</div></calcite-popover>`;
   }
   _getInvalidPlaceholder() {
-    return a`<div><calcite-notice class="height-100" icon=exclamation-mark-triangle id=no-valid-layers kind=danger open><div slot=message>${this._translations.noLayersFound}</div></calcite-notice><calcite-tooltip .label=${this._translations.enableEditUpdate} placement=bottom reference-element=no-valid-layers><span>${this._translations.enableEditUpdate}</span></calcite-tooltip></div>`;
+    return i`<div><calcite-notice class="height-100" icon=exclamation-mark-triangle id=no-valid-layers kind=danger open><div slot=message>${this._translations.noLayersFound}</div></calcite-notice><calcite-tooltip .label=${this._translations.enableEditUpdate} placement=bottom reference-element=no-valid-layers><span>${this._translations.enableEditUpdate}</span></calcite-tooltip></div>`;
   }
   _getSingleLayerPlaceholder() {
     const e = this._getItemTypeIcon();
-    return a`<div class="layer-picker-label-container cursor-default"><calcite-icon .icon=${e} scale=s></calcite-icon><calcite-label class="no-bottom-margin padding-start-1">${this.selectedName}</calcite-label></div>`;
+    return i`<div class="layer-picker-label-container cursor-default"><calcite-icon .icon=${e} scale=s></calcite-icon><calcite-label class="no-bottom-margin padding-start-1">${this.selectedName}</calcite-label></div>`;
   }
   _getSelect(e) {
-    return a`<calcite-select id=${e ?? l} label @calciteSelectChange=${() => this._layerSelectionChange()} .scale=${this.scale} ${d(this._layerElement)}>${this._getMapLayerOptions()}</calcite-select>`;
+    return i`<calcite-select id=${e ?? l} label @calciteSelectChange=${() => this._layerSelectionChange()} .scale=${this.scale} ${d(this._layerElement)}>${this._getMapLayerOptions()}</calcite-select>`;
   }
   _getCombobox(e) {
-    return a`<calcite-combobox clear-disabled id=${e ?? l} label @calciteComboboxChange=${() => this._layerSelectionChange()} .placeholderIcon=${this.placeholderIcon} .scale=${this.scale} selection-mode=single ${d(this._layerElement)}>${this._getMapLayerOptions()}</calcite-combobox>`;
+    return i`<calcite-combobox clear-disabled id=${e ?? l} label @calciteComboboxChange=${() => this._layerSelectionChange()} .placeholderIcon=${this.placeholderIcon} .scale=${this.scale} selection-mode=single ${d(this._layerElement)}>${this._getMapLayerOptions()}</calcite-combobox>`;
   }
   _getDropdown(e) {
-    return a`<calcite-dropdown class="layer-picker-dropdown" @calciteDropdownBeforeClose=${() => this._isDropdownOpen = !1} @calciteDropdownBeforeOpen=${() => this._isDropdownOpen = !0}>${this.isMobile ? this._getDropdownButton() : this._getActionDropdownButton(e)}<calcite-dropdown-group selection-mode=single>${this._getMapLayerOptions()}</calcite-dropdown-group></calcite-dropdown>`;
+    return i`<calcite-dropdown class="layer-picker-dropdown" @calciteDropdownBeforeClose=${() => this._isDropdownOpen = !1} @calciteDropdownBeforeOpen=${() => this._isDropdownOpen = !0}>${this.isMobile ? this._getDropdownButton() : this._getActionDropdownButton(e)}<calcite-dropdown-group selection-mode=single>${this._getMapLayerOptions()}</calcite-dropdown-group></calcite-dropdown>`;
   }
   _getActionDropdownButton(e) {
-    return a`<calcite-action id=${e ?? l} slot=trigger text>${this._getDropdownButton()}</calcite-action>`;
+    return i`<calcite-action id=${e ?? l} slot=trigger text>${this._getDropdownButton()}</calcite-action>`;
   }
   _getDropdownButton() {
-    const e = this._getItemTypeIcon(), t = this.isMobile ? "" : "max-width-350", s = this.isMobile ? "trigger" : "", i = this._isDropdownOpen ? "chevron-up" : "chevron-down";
-    return a`<calcite-button alignment=icon-end-space-between .appearance=${this.appearance} class=${y(t)} .iconEnd=${i} .iconStart=${e} kind=neutral slot=${s ?? l} width=full><div>${this.selectedName}</div></calcite-button>`;
+    const e = this._getItemTypeIcon(), t = this.isMobile ? "" : "max-width-350", s = this.isMobile ? "trigger" : "", a = this._isDropdownOpen ? "chevron-up" : "chevron-down";
+    return i`<calcite-button alignment=icon-end-space-between .appearance=${this.appearance} class=${y(t)} .iconEnd=${a} .iconStart=${e} kind=neutral slot=${s ?? l} width=full><div>${this.selectedName}</div></calcite-button>`;
   }
   _getItemTypeIcon() {
     let e = "layers";
@@ -120,8 +123,8 @@ class $ extends g {
     return this.ids.reduce((e, t) => (this._validLayer(t) ? e.push(this._getItem(t, "layer")) : this._validTable(t) && e.push(this._getItem(t, "table")), e), []);
   }
   _getItem(e, t) {
-    const s = t === "layer" && this._layerNameHash ? this._layerNameHash[e] : this._tableNameHash ? this._tableNameHash[e] : void 0, i = this.showOnlyUpdatableLayers ? s && !s.supportsUpdate : !1, r = s?.name, h = this.selectedIds.indexOf(e) > -1;
-    return this.type === "combobox" ? a`<calcite-combobox-item .disabled=${i} .selected=${h} .textLabel=${r} .value=${e}></calcite-combobox-item>` : this.type === "select" ? a`<calcite-option .disabled=${i} .label=${r} .selected=${h} .value=${e}></calcite-option>` : this.force && h || !this.force ? a`<calcite-dropdown-group class=${y(i ? "disabled" : "")} id=${r ?? l} .selectionMode=${i ? "none" : "single"}><calcite-dropdown-item .disabled=${!!(t === "table" && this.showTablesDisabled)} .iconStart=${t} @click=${i ? void 0 : () => void this._setSelectedLayer(e)} .selected=${h}>${r}</calcite-dropdown-item></calcite-dropdown-group>` : null;
+    const s = t === "layer" && this._layerNameHash ? this._layerNameHash[e] : this._tableNameHash ? this._tableNameHash[e] : void 0, a = this.showOnlyUpdatableLayers ? s && !s.supportsUpdate : !1, n = s?.name, h = this.selectedIds.indexOf(e) > -1;
+    return this.type === "combobox" ? i`<calcite-combobox-item .disabled=${a} .selected=${h} .textLabel=${n} .value=${e}></calcite-combobox-item>` : this.type === "select" ? i`<calcite-option .disabled=${a} .label=${n} .selected=${h} .value=${e}></calcite-option>` : this.force && h || !this.force ? i`<calcite-dropdown-group class=${y(a ? "disabled" : "")} id=${n ?? l} .selectionMode=${a ? "none" : "single"}><calcite-dropdown-item .disabled=${!!(t === "table" && this.showTablesDisabled)} .iconStart=${t} @click=${a ? void 0 : () => void this._setSelectedLayer(e)} .selected=${h}>${n}</calcite-dropdown-item></calcite-dropdown-group>` : null;
   }
   async _setSelectedLayer(e) {
     if (e !== this.selectedIds[0]) {
@@ -147,10 +150,9 @@ class $ extends g {
       let e = [];
       this._layerNameHash && (e = this.showOnlyUpdatableLayers ? this._getEditableIds(this._layerNameHash) : Object.keys(this._layerNameHash));
       let t = [];
-      this._tableNameHash && (t = this.showTables ? this.showOnlyUpdatableLayers ? this._getEditableIds(this._tableNameHash) : Object.keys(this._tableNameHash) : []), this.ids = [
-        ...e.reverse().filter((s) => this.enabledLayerIds?.length > 0 ? this.enabledLayerIds.reverse().indexOf(s) > -1 : !0),
-        ...t.reverse().filter((s) => this.enabledLayerIds?.length > 0 ? this.enabledLayerIds.reverse().indexOf(s) > -1 : !0)
-      ], this.idsFound.emit({
+      this._tableNameHash && (t = this.showTables ? this.showOnlyUpdatableLayers ? this._getEditableIds(this._tableNameHash) : Object.keys(this._tableNameHash) : []);
+      const s = [...e.reverse(), ...t.reverse()];
+      this.ids = this.enabledLayerIds.length > 0 ? this.enabledLayerIds.filter((a) => s.includes(a)) : s, this.idsFound.emit({
         layerIds: e,
         tableIds: t
       });
@@ -167,8 +169,8 @@ class $ extends g {
     return s !== void 0 && Object.keys(t?.managedLayers || []).indexOf(s) < 0 && (this.enabledLayerIds?.length > 0 ? this.enabledLayerIds.indexOf(e) > -1 : !0);
   }
   _validTable(e) {
-    const t = this._pnContextConsumer.value, s = this._tableNameHash && this._tableNameHash[e]?.name, i = s && this.showTables;
-    return i ? (t?.managedTables || []).indexOf(s) < 0 && (this.enabledLayerIds?.length > 0 ? this.enabledLayerIds.indexOf(e) > -1 : !0) : i !== void 0;
+    const t = this._pnContextConsumer.value, s = this._tableNameHash && this._tableNameHash[e]?.name, a = s && this.showTables;
+    return a ? (t?.managedTables || []).indexOf(s) < 0 && (this.enabledLayerIds?.length > 0 ? this.enabledLayerIds.indexOf(e) > -1 : !0) : a !== void 0;
   }
   _layerSelectionChange(e) {
     if (this._layerElement.value) {

package/dist/components/map-legend/customElement.js

@@ -5,7 +5,7 @@ import { createRef as a, ref as r } from "lit-html/directives/ref.js";
 import { LitElement as d } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.1/esri/copyright.txt for details.
-v1.1.0-next.20250917.3 */
+v1.1.0-next.20250919 */
 const o = s`/**
  * @license
  * Copyright 2025 Esri

package/dist/components/map-picker/customElement.js

@@ -1,11 +1,11 @@
-import { c as h } from "../../chunks/runtime.js";
-import { u as c } from "../../chunks/useT9n.js";
+import { c } from "../../chunks/runtime.js";
+import { u as h } from "../../chunks/useT9n.js";
 import { css as m, html as a } from "lit";
-import { createRef as n, ref as r } from "lit-html/directives/ref.js";
-import { LitElement as f, createEvent as l, safeClassMap as p, safeStyleMap as b } from "@arcgis/lumina";
+import { createRef as l, ref as r } from "lit-html/directives/ref.js";
+import { LitElement as f, createEvent as p, safeClassMap as d, safeStyleMap as b } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.1/esri/copyright.txt for details.
-v1.1.0-next.20250917.3 */
+v1.1.0-next.20250919 */
 const u = m`/** @license
  * Copyright 2025 Esri
  *
@@ -23,10 +23,10 @@ const u = m`/** @license
  */:host{display:block;--solutions-theme-foreground-color: var(--calcite-color-foreground-1);width:100%}.width-full{width:100%}.width-26{width:26%!important}.height-full{height:100%}.display-flex{display:flex}.border-bottom-1{border-bottom-width:1px!important;border-width:0px}.border-bottom-2{border-bottom-width:2px!important;border-width:0px}.border-solid{border-style:solid;border-color:var(--calcite-color-border-3)}.border-left-right{border-left:1px solid var(--calcite-color-border-3);border-right:1px solid var(--calcite-color-border-3)}.action-bar-size{height:51px;width:100%}.map-list{display:flex;flex-direction:column;animation:calcite-scrim-fade-in var(--calcite-internal-animation-timing-medium) ease-in-out;background-color:var(--calcite-color-background);z-index:1000}.display-none{display:none}.align-center{align-items:center}.adjusted-height{max-height:calc(100% - 68px);overflow-y:auto}.position-absolute{position:absolute}.position-relative{position:relative}.popover-map-list{overflow:auto;width:250px}.max-width-200{max-width:200px}.min-width-150{min-width:150px}`;
 class g extends f {
   constructor() {
-    super(...arguments), this.mapInfos = [], this.isMapLayout = !1, this.showMapListInPopover = !1, this.referenceElement = "", this.selectedWebMapId = "", this._mapListExpanded = !1, this._translations = c({ name: "map-picker", blocking: !0 }), this._list = n(), this._loadedId = "", this._skipEditCheck = !1, this._popover = n(), this.beforeMapInfoChange = l(), this.mapInfoChange = l();
+    super(), this.mapInfos = [], this.isMapLayout = !1, this.showMapListInPopover = !1, this.referenceElement = "", this.selectedWebMapId = "", this._mapListExpanded = !1, this._isValidWebMap = !0, this._translations = h({ name: "map-picker", blocking: !0 }), this._list = l(), this._loadedId = "", this._skipEditCheck = !1, this._popover = l(), this._mapPickerButton = l(), this.beforeMapInfoChange = p(), this.mapInfoChange = p(), this.listenOn(window, "mapChanged", this.mapChanged);
   }
   static {
-    this.properties = { mapInfos: 0, isMapLayout: 5, height: 9, showMapListInPopover: 5, referenceElement: 1, selectedWebMapId: 1, _mapListExpanded: 16, _translations: 16 };
+    this.properties = { mapInfos: 0, isMapLayout: 5, height: 9, showMapListInPopover: 5, referenceElement: 1, selectedWebMapId: 1, _mapListExpanded: 16, _isValidWebMap: 16, _translations: 16 };
   }
   static {
     this.styles = u;
@@ -57,6 +57,10 @@ class g extends f {
   async toggle(e) {
     this._mapListExpanded = e;
   }
+  async mapChanged(e) {
+    const t = e.detail.isValid;
+    this._isValidWebMap = t;
+  }
   render() {
     return a`${!this.showMapListInPopover && this._getToolbar() || ""}${this.showMapListInPopover ? this._getMapListPopover() : this._getMapNameList(this._mapListExpanded)}`;
   }
@@ -65,16 +69,27 @@ class g extends f {
     e && this._webMapSelected(e);
   }
   _getMapPicker() {
-    const e = "map-picker-expand-toggle", t = this._mapListExpanded ? "chevron-up" : "chevron-down", i = this.isMapLayout ? "" : "position-absolute", s = this.isMapLayout ? "max-width-200" : "width-full";
-    return a`<div class=${p(s)}><calcite-button alignment=icon-end-space-between appearance=transparent class=${`width-full height-full ${i}`} .iconEnd=${t} icon-start=map id=${e} kind=neutral @click=${() => this._chooseMap()} width=full>${this._getWebMapInfo().name}</calcite-button><calcite-tooltip placement=bottom .referenceElement=${e}><span>${this._translations.switchMap}</span></calcite-tooltip></div>`;
+    const e = "map-picker-expand-toggle", t = this._mapListExpanded ? "chevron-up" : "chevron-down", i = this.isMapLayout ? "" : "position-absolute", s = this.isMapLayout ? "max-width-200" : "width-full", n = this._isValidWebMap ? "map" : "exclamation-mark-triangle";
+    return a`<div class=${d(s)}><calcite-button alignment=icon-end-space-between appearance=transparent class=${`width-full height-full ${i}`} .iconEnd=${t} .iconStart=${n} id=${e} kind=neutral @click=${() => this._chooseMap()} width=full ${r(this._mapPickerButton)}>${this._getWebMapInfo().name}</calcite-button><calcite-tooltip placement=bottom .referenceElement=${e}><span>${this._translations.switchMap}</span></calcite-tooltip></div>`;
   }
   _getToolbar() {
     const e = this.isMapLayout ? "border-bottom-1" : "border-bottom-2", t = this.isMapLayout ? "" : "position-relative";
-    return a`<div class=${`display-flex border-left-right ${t}`}><calcite-action-bar class=${`border-solid action-bar-size overflow-hidden ${e}`} expand-disabled layout=horizontal slot=header>${this._getMapPicker()}</calcite-action-bar></div>`;
+    return a`<div class=${`display-flex border-left-right ${t}`}><calcite-action-bar class=${`border-solid action-bar-size overflow-hidden ${e}`} expand-disabled layout=horizontal slot=header>${this._getMapPicker()}${this._updateMapPickerIconColor()}</calcite-action-bar></div>`;
+  }
+  _updateMapPickerIconColor() {
+    this._mapPickerButton.value?.componentOnReady().then(() => {
+      const t = this._mapPickerButton.value?.shadowRoot?.lastChild;
+      let i = null;
+      if (t && t instanceof HTMLElement) {
+        const s = t.getElementsByClassName("icon icon--start");
+        s.length > 0 && (i = s[0]);
+      }
+      i && (this._isValidWebMap ? i.style.setProperty("color", "var(--calcite-color-text-1)") : i.style.setProperty("color", "var(--calcite-color-status-danger)"));
+    });
   }
   _getMapNameList(e) {
-    const t = this.showMapListInPopover ? "position-relative" : "position-absolute", i = this.isMapLayout ? "max-width-200 min-width-150" : "width-full", s = this.isMapLayout ? "border-bottom-1" : "border-bottom-2", d = e ? `map-list border-solid ${s} adjusted-height ${i} ${t}` : "display-none";
-    return a`<div class=${p(d)}><calcite-list id=mapList label selection-appearance=border selection-mode=single-persist ${r(this._list)}>${this.mapInfos.map((o) => a`<calcite-list-item .label=${o.name} @click=${() => this._webMapSelected(o)} .selected=${o.id === this._loadedId} .value=${o.id}></calcite-list-item>`)}</calcite-list></div>`;
+    const t = this.showMapListInPopover ? "position-relative" : "position-absolute", i = this.isMapLayout ? "max-width-200 min-width-150" : "width-full", s = this.isMapLayout ? "border-bottom-1" : "border-bottom-2", n = e ? `map-list border-solid ${s} adjusted-height ${i} ${t}` : "display-none";
+    return a`<div class=${d(n)}><calcite-list id=mapList label selection-appearance=border selection-mode=single-persist ${r(this._list)}>${this.mapInfos.map((o) => a`<calcite-list-item .label=${o.name} @click=${() => this._webMapSelected(o)} .selected=${o.id === this._loadedId} .value=${o.id}></calcite-list-item>`)}</calcite-list></div>`;
   }
   _getMapListPopover() {
     const e = this.height && this.height > 0 && this.showMapListInPopover ? { "max-height": `${this.height.toString()}px` } : {};
@@ -100,7 +115,7 @@ class g extends f {
     this._mapListExpanded = !this._mapListExpanded;
   }
 }
-h("map-picker", g);
+c("map-picker", g);
 export {
   g as MapPicker
 };

package/dist/components/map-search/customElement.js

@@ -5,7 +5,7 @@ import { createRef as m, ref as f } from "lit-html/directives/ref.js";
 import { LitElement as y } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.1/esri/copyright.txt for details.
-v1.1.0-next.20250917.3 */
+v1.1.0-next.20250919 */
 const S = u`/** @license
  * Copyright 2025 Esri
  *

package/dist/components/map-select-tools/customElement.js

@@ -11,7 +11,7 @@ import { useContextConsumer as F } from "@arcgis/lumina/context";
 import { p as D } from "../../chunks/publicNotificationContext.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.1/esri/copyright.txt for details.
-v1.1.0-next.20250917.3 */
+v1.1.0-next.20250919 */
 const x = k`@layer{/** @license
  * Copyright 2025 Esri
  *

package/dist/components/map-tools/customElement.d.ts

@@ -152,4 +152,6 @@ export declare class MapTools extends LitElement {
      * @default false
      */
     showOnlyUpdatableLayers: boolean;
+    /** IMapInfo: key configuration details about the current map */
+    mapInfo: IMapInfo | undefined;
 }