@esri/solutions-components 1.0.0-next.20250422.3 → 1.0.0-next.20250425

package/dist/components/layer-table/index.d.ts

@@ -3,15 +3,14 @@ import "@esri/calcite-components/components/calcite-shell";
 import "@esri/calcite-components/components/calcite-panel";
 import "@esri/calcite-components/components/calcite-input";
 import "@esri/calcite-components/components/calcite-loader";
+import "../field-selection/index.js";
 import "@esri/calcite-components/components/calcite-action-bar";
 import "../map-layer-picker/index.js";
-import "@esri/calcite-components/components/calcite-dropdown";
-import "@esri/calcite-components/components/calcite-dropdown-group";
-import "@esri/calcite-components/components/calcite-dropdown-item";
+import "@esri/calcite-components/components/calcite-action-group";
 import "@esri/calcite-components/components/calcite-action";
-import "@esri/calcite-components/components/calcite-button";
 import "@arcgis/instant-apps-components/dist/components/instant-apps-social-share.js";
 import "@esri/calcite-components/components/calcite-tooltip";
+import "@esri/calcite-components/components/calcite-button";
 import "@esri/calcite-components/components/calcite-dialog";
 import "@arcgis/instant-apps-components/dist/components/instant-apps-filter-list.js";
 export * from "./customElement.js";

package/dist/components/layer-table/index.js

@@ -3,15 +3,14 @@ import "@esri/calcite-components/components/calcite-shell";
 import "@esri/calcite-components/components/calcite-panel";
 import "@esri/calcite-components/components/calcite-input";
 import "@esri/calcite-components/components/calcite-loader";
+import "../field-selection/index.js";
 import "@esri/calcite-components/components/calcite-action-bar";
 import "../map-layer-picker/index.js";
-import "@esri/calcite-components/components/calcite-dropdown";
-import "@esri/calcite-components/components/calcite-dropdown-group";
-import "@esri/calcite-components/components/calcite-dropdown-item";
+import "@esri/calcite-components/components/calcite-action-group";
 import "@esri/calcite-components/components/calcite-action";
-import "@esri/calcite-components/components/calcite-button";
 import "@arcgis/instant-apps-components/dist/components/instant-apps-social-share.js";
 import "@esri/calcite-components/components/calcite-tooltip";
+import "@esri/calcite-components/components/calcite-button";
 import "@esri/calcite-components/components/calcite-dialog";
 import "@arcgis/instant-apps-components/dist/components/instant-apps-filter-list.js";
 export * from "./customElement.js";

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

@@ -1,6 +1,6 @@
 /// <reference types="@arcgis/core/interfaces.d.ts" />
 /// <reference types="../../index.d.ts" />
-import { AppLayout, IBasemapConfig, IMapChange, IMapInfo, ISearchConfiguration, IToolInfo, IToolSizeInfo, theme, TooltipPlacement } from '../../utils/interfaces';
+import { AppLayout, IBasemapConfig, IMapChange, IMapInfo, ISearchConfiguration, IToolInfo, theme, TooltipPlacement } from '../../utils/interfaces';
 import { PropertyValues } from 'lit';
 import { PublicLitElement as LitElement, JsxNode, TargetedEvent } from '@arcgis/lumina';
 import { MapLayerPicker } from '../map-layer-picker/customElement.js';

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

@@ -1,17 +1,17 @@
-import { c as u } from "../../chunks/runtime.js";
-import { l as _ } from "../../chunks/loadModules.js";
+import { c as f } from "../../chunks/runtime.js";
+import { l as u } from "../../chunks/loadModules.js";
 import { joinAppProxies as b } from "templates-common-library/functionality/proxy";
-import { g, b as w } from "../../chunks/mapViewUtils.js";
-import { u as y } from "../../chunks/useT9n.js";
-import { html as h, nothing as c } from "lit";
-import { createRef as d, ref as r } from "lit-html/directives/ref.js";
-import { LitElement as I, createEvent as p, noShadowRoot as S, safeClassMap as f } from "@arcgis/lumina";
-import { css as v } from "@lit/reactive-element/css-tag.js";
+import { g, b as y } from "../../chunks/mapViewUtils.js";
+import { u as _ } from "../../chunks/useT9n.js";
+import { html as l, nothing as c } from "lit";
+import { createRef as n, ref as h } from "lit-html/directives/ref.js";
+import { LitElement as w, createEvent as d, noShadowRoot as I, safeClassMap as p } from "@arcgis/lumina";
+import { css as L } from "@lit/reactive-element/css-tag.js";
 import { defineCustomElements as $ } from "@arcgis/instant-apps-components/loader";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.0/esri/copyright.txt for details.
-v1.0.0-next.20250422.3 */
-const L = v`@layer{/** @license
+v1.0.0-next.20250425 */
+const S = L`@layer{/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -25,28 +25,28 @@ const L = v`@layer{/** @license
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the 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}.display-none{display:none}.display-block{display:block}}`;
-class T extends I {
+ */: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}.display-flex{display:flex}.display-none{display:none}.display-block{display:block}.absolute-right{position:absolute;right:0;left:unset}html[dir=rtl] .absolute-right{left:0;right:unset}}`;
+class v extends w {
   //--------------------------------------------------------------------------
   //
   //  Overrides (internal)
   //
   //--------------------------------------------------------------------------
   constructor() {
-    super(), this.defaultWebmapId = "", this.defaultLayerId = "", this.enableHome = !1, this.enableLegend = !1, this.enableFloorFilter = !1, this.enableFullscreen = !1, this.enableShare = !1, this.enableSingleExpand = !1, this.enableSearch = !1, this.enableBasemap = !1, this.hide = !1, this.homeZoomIndex = 3, this.homeZoomPosition = "top-left", this.homeZoomToolsSize = "m", this.locale = "", this.mapInfos = [], this.mapWidgetsIndex = 0, this.mapWidgetsPosition = "top-right", this.mapWidgetsSize = "m", this.stackTools = !1, this.toolOrder = [], this.isMapLayout = !1, this.shareIncludeEmbed = !1, this.shareIncludeSocial = !1, this.selectedFeaturesIds = [], this.onlyShowUpdatableLayers = !1, this.isMobile = !1, this._translations = y({ name: "map-card", blocking: !0 }), this._showHideOpen = !1, this._toolInfos = [], this._controlsThatFit = [], this._defaultWebmapHonored = !1, this._loadedId = "", this._mapDiv = d(), this._mapPicker = d(), this._mapTools = d(), this._moreDropdown = d(), this._mapListExpanded = !1, this._filterActive = !1, this._definitionExpression = "", this._mapLayerPicker = d(), this._toolbar = d(), this._toolbarSizeInfos = [], this._defaultVisibleToolSizeInfos = [], this._observerSet = !1, this.mapChanged = p(), this.beforeMapChanged = p(), this.toggleFilter = p(), this.clearSelection = 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, $(window);
+    super(), this.defaultWebmapId = "", this.defaultLayerId = "", this.enableHome = !1, this.enableLegend = !1, this.enableFloorFilter = !1, this.enableFullscreen = !1, this.enableShare = !1, this.enableSingleExpand = !1, this.enableSearch = !1, this.enableBasemap = !1, this.hide = !1, this.homeZoomIndex = 3, this.homeZoomPosition = "top-left", this.homeZoomToolsSize = "m", this.locale = "", this.mapInfos = [], this.mapWidgetsIndex = 0, this.mapWidgetsPosition = "top-right", this.mapWidgetsSize = "m", this.stackTools = !1, this.toolOrder = [], this.isMapLayout = !1, this.shareIncludeEmbed = !1, this.shareIncludeSocial = !1, this.selectedFeaturesIds = [], this.onlyShowUpdatableLayers = !1, this.isMobile = !1, this._translations = _({ name: "map-card", blocking: !0 }), this._toolInfos = [], this._defaultWebmapHonored = !1, this._loadedId = "", this._mapDiv = n(), this._mapPicker = n(), this._mapTools = n(), this._mapListExpanded = !1, this._filterActive = !1, this._definitionExpression = "", this._mapLayerPicker = n(), this._toolbar = n(), this.mapChanged = d(), this.beforeMapChanged = d(), this.toggleFilter = d(), this.clearSelection = d(), this.listenOn(window, "mapInfoChange", this.mapInfoChange), this.listenOn(window, "noLayersFound", this.noLayersFound), this.listenOn(window, "layerSelectionChange", this.layerSelectionChange), this.enableSingleExpand = !0, this.stackTools = !0, $(window);
   }
   static {
-    this.properties = { appLayout: 1, appProxies: 1, defaultWebmapId: 1, defaultLayerId: 1, enableHome: 5, enableLegend: 5, enableFloorFilter: 5, enableFullscreen: 5, enableShare: 5, enableSingleExpand: 5, enableSearch: 5, enableBasemap: 5, basemapConfig: 0, hide: 5, homeZoomIndex: 9, homeZoomPosition: 1, homeZoomToolsSize: 1, locale: 1, mapInfos: 0, mapWidgetsIndex: 9, mapWidgetsPosition: 1, mapWidgetsSize: 1, mapView: 0, stackTools: 5, theme: 1, toolOrder: 0, isMapLayout: 5, shareIncludeEmbed: 5, shareIncludeSocial: 5, selectedFeaturesIds: 0, selectedLayer: 0, zoomToScale: 9, onlyShowUpdatableLayers: 5, isMobile: 5, mapInfo: 0, _translations: 16, _searchConfiguration: 16, _webMapInfo: 16, _showHideOpen: 16, _toolInfos: 16, _controlsThatFit: 16 };
+    this.properties = { appLayout: 1, appProxies: 1, defaultWebmapId: 1, defaultLayerId: 1, enableHome: 5, enableLegend: 5, enableFloorFilter: 5, enableFullscreen: 5, enableShare: 5, enableSingleExpand: 5, enableSearch: 5, enableBasemap: 5, basemapConfig: 0, hide: 5, homeZoomIndex: 9, homeZoomPosition: 1, homeZoomToolsSize: 1, locale: 1, mapInfos: 0, mapWidgetsIndex: 9, mapWidgetsPosition: 1, mapWidgetsSize: 1, mapView: 0, stackTools: 5, theme: 1, toolOrder: 0, isMapLayout: 5, shareIncludeEmbed: 5, shareIncludeSocial: 5, selectedFeaturesIds: 0, selectedLayer: 0, zoomToScale: 9, onlyShowUpdatableLayers: 5, isMobile: 5, mapInfo: 0, _translations: 16, _searchConfiguration: 16, _webMapInfo: 16, _toolInfos: 16 };
   }
   static {
-    this.styles = L;
+    this.styles = S;
   }
   static {
-    this.shadowRootOptions = S;
+    this.shadowRootOptions = I;
   }
   /** TODO: [MIGRATION] Consider inlining some of the watch functions called inside of this method to reduce boilerplate code */
-  willUpdate(i) {
-    i.has("appLayout") && this.appLayoutWatchHandler(), i.has("enableHome") && this.enableHomeWatchHandler(), i.has("enableShare") && (this.hasUpdated || this.enableShare !== !1) && this.enableShareWatchHandler(), i.has("locale") && this.localeWatchHandler(), i.has("mapView") && this.mapViewWatchHandler(), i.has("selectedLayer") && this.selectedLayerWatchHandler(), i.has("selectedFeaturesIds") && this.selectedFeaturesIdsWatchHandler(), i.has("_controlsThatFit") && this._controlsThatFitWatchHandler();
+  willUpdate(e) {
+    e.has("appLayout") && this.appLayoutWatchHandler(), e.has("enableHome") && this.enableHomeWatchHandler(), e.has("locale") && this.localeWatchHandler(), e.has("mapView") && this.mapViewWatchHandler(), e.has("selectedLayer") && this.selectedLayerWatchHandler(), e.has("selectedFeaturesIds") && this.selectedFeaturesIdsWatchHandler();
   }
   //--------------------------------------------------------------------------
   //
@@ -61,10 +61,6 @@ class T extends I {
   enableHomeWatchHandler() {
     this.mapView && this._initHome();
   }
-  /** Update the toolbar when the share button is enabled/disabled */
-  enableShareWatchHandler() {
-    this._toolbar.value && this._updateToolbar();
-  }
   /** Fetch translations when the locale is updated */
   async localeWatchHandler() {
     this.el.lang = this.locale;
@@ -83,16 +79,6 @@ class T extends I {
   async selectedFeaturesIdsWatchHandler() {
     this._updateShareUrl(), this._validateEnabledActions();
   }
-  /** watch for changes to the list of controls that will currently fit in the display */
-  _controlsThatFitWatchHandler() {
-    const i = this._controlsThatFit ? this._controlsThatFit.reduce((e, t) => (e.push(t.id), e), []) : [];
-    this._toolInfos = this._toolInfos?.map((e) => {
-      if (e && this._controlsThatFit) {
-        const t = this._getId(e.icon);
-        return e.isOverflow = i.indexOf(t) < 0, e;
-      }
-    });
-  }
   //--------------------------------------------------------------------------
   //
   //  Methods (public)
@@ -103,16 +89,16 @@ class T extends I {
     this._filterActive = !1, this._updateShareUrl();
   }
   /** updates the filter */
-  async updateFilterState(i) {
-    this._filterActive = i, this._updateShareUrl();
+  async updateFilterState(e) {
+    this._filterActive = e, this._updateShareUrl();
   }
   /** updates the layer in map layer picker */
   async updateLayer() {
     this._mapLayerPicker.value && this._mapLayerPicker.value.updateLayer();
   }
   /** Listen for changes to map info and load the appropriate map */
-  async mapInfoChange(i) {
-    await this._loadMap(i.detail);
+  async mapInfoChange(e) {
+    await this._loadMap(e.detail);
   }
   /** Listen for change when mapview doesn't contain any layer */
   noLayersFound() {
@@ -126,20 +112,20 @@ class T extends I {
   }
   /** Called once just after the component is first connected to the DOM. */
   async load() {
-    await this._initModules(), this._initToolInfos(), this._resizeObserver || (this._resizeObserver = new ResizeObserver(() => this._updateToolbar()));
+    await this._initModules(), this._initToolInfos();
   }
   /** Renders the component. */
   render() {
-    const i = this.isMapLayout ? "display-flex height-49-px" : "", e = this.hide ? "visibility-hidden-1" : "", t = this.theme === "dark" ? "calcite-mode-dark" : "calcite-mode-light", s = this.mapInfos?.length > 1 || this.isMapLayout ? "map-height" : "height-full", a = this.isMapLayout ? "" : "display-none";
-    return this._validateActiveActions(), h`<div class=${`${i} width-full`} ${r(this._toolbar)}>${this._getActionBar()}${!this.isMobile && this.isMapLayout && this._getDropdown("more-table-options") || ""}${this.enableShare && !this.isMobile && this.isMapLayout ? this._getShare("share") : void 0}</div><calcite-progress class=${f(a)} value=0></calcite-progress><div class=${`${s} ${e}`} ${r(this._mapDiv)}></div>${h`<map-tools .basemapConfig=${this.basemapConfig} class=${`box-shadow ${t}`} .enableBasemap=${this.enableBasemap} .enableFloorFilter=${this.enableFloorFilter} .enableFullscreen=${this.enableFullscreen} .enableHome=${this.enableHome} .enableLegend=${this.enableLegend} .enableSearch=${this.enableSearch} .enableSingleExpand=${this.enableSingleExpand} .homeZoomToolsSize=${this.homeZoomToolsSize} .locale=${this.locale} .mapView=${this.mapView} .mapWidgetsSize=${this.mapWidgetsSize} .position=${this.mapWidgetsPosition} .searchConfiguration=${this._searchConfiguration} .stackTools=${this.stackTools} .toolOrder=${this.toolOrder} ${r(this._mapTools)}></map-tools>`}`;
+    const e = this.isMapLayout ? "display-flex height-49-px" : "", i = this.hide ? "visibility-hidden-1" : "", s = this.theme === "dark" ? "calcite-mode-dark" : "calcite-mode-light", t = this.mapInfos?.length > 1 || this.isMapLayout ? "map-height" : "height-full", a = this.isMapLayout ? "" : "display-none";
+    return this._validateActiveActions(), l`<div class=${`${e} width-full`} ${h(this._toolbar)}>${this._getActionBar()}<div slot=header-actions-end class="display-flex absolute-right">${this.enableShare && !this.isMobile && this.isMapLayout ? this._getShare("share") : void 0}</div></div><calcite-progress class=${p(a)} value=0></calcite-progress><div class=${`${t} ${i}`} ${h(this._mapDiv)}></div>${l`<map-tools .basemapConfig=${this.basemapConfig} class=${`box-shadow ${s}`} .enableBasemap=${this.enableBasemap} .enableFloorFilter=${this.enableFloorFilter} .enableFullscreen=${this.enableFullscreen} .enableHome=${this.enableHome} .enableLegend=${this.enableLegend} .enableSearch=${this.enableSearch} .enableSingleExpand=${this.enableSingleExpand} .homeZoomToolsSize=${this.homeZoomToolsSize} .locale=${this.locale} .mapView=${this.mapView} .mapWidgetsSize=${this.mapWidgetsSize} .position=${this.mapWidgetsPosition} .searchConfiguration=${this._searchConfiguration} .stackTools=${this.stackTools} .toolOrder=${this.toolOrder} ${h(this._mapTools)}></map-tools>`}`;
   }
   /** Called each time after the component is loaded */
   updated() {
-    this.isMapLayout && this._updateToolbar(), document.onclick = (i) => this._handleDocumentClick(i);
+    document.onclick = (e) => this._handleDocumentClick(e);
   }
   /** Called once after the component is loaded */
   loaded() {
-    !this.isMobile && !this._observerSet && this._toolbar.value && (this._resizeObserver?.observe(this._toolbar.value), this._observerSet = !0), this._updateShareUrl();
+    this._updateShareUrl();
   }
   //--------------------------------------------------------------------------
   //
@@ -153,24 +139,24 @@ class T extends I {
    * @protected
    */
   async _initModules() {
-    const [i, e, t, s] = await _([
+    const [e, i, s, t] = await u([
       "esri/WebMap",
       "esri/views/MapView",
       "esri/widgets/Home",
       "esri/config"
     ]);
-    this.WebMap = i, this.MapView = e, this.Home = t, this.esriConfig = s;
+    this.WebMap = e, this.MapView = i, this.Home = s, this.esriConfig = t;
   }
   /**
    * Load the webmap for the provided webMapInfo
    *
    * @param webMapInfo the webmap id and name to load
    */
-  async _loadMap(i) {
-    const e = !this._defaultWebmapHonored && this.defaultWebmapId, t = this.mapInfos?.filter((o) => o.id === this.defaultWebmapId), s = JSON.stringify(i) !== JSON.stringify(this._webMapInfo);
-    this._webMapInfo = e && t ? t[0] : !i?.id && this.mapInfos.length > 0 ? this.mapInfos[0] : i;
-    const a = this._webMapInfo.id, l = e && i?.id === this.defaultWebmapId;
-    if (this._loadedId !== a && !e || l) {
+  async _loadMap(e) {
+    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, r = i && e?.id === this.defaultWebmapId;
+    if (this._loadedId !== a && !i || r) {
       const o = this.WebMap && new this.WebMap({
         portalItem: { id: a }
       });
@@ -179,74 +165,17 @@ class T extends I {
         map: o,
         resizeAlign: "center"
       }), this._loadedId = a, this._searchConfiguration = this._webMapInfo.searchConfiguration, this.beforeMapChanged.emit(), this.mapView && await this.mapView.when(() => {
-        this._initHome(), this.mapView && (this._mapTools.value && this.mapView.ui.add(this._mapTools.value, { position: this.mapWidgetsPosition, index: this.mapWidgetsIndex }), this._defaultWebmapHonored = l ? !0 : this._defaultWebmapHonored, this.mapChanged.emit({
+        this._initHome(), this.mapView && (this._mapTools.value && this.mapView.ui.add(this._mapTools.value, { position: this.mapWidgetsPosition, index: this.mapWidgetsIndex }), this._defaultWebmapHonored = r ? !0 : this._defaultWebmapHonored, this.mapChanged.emit({
           id: a,
           mapView: this.mapView
         }));
       });
-    } else e ? (this._defaultWebmapHonored = !0, this._mapPicker.value && this._mapPicker.value.setMapByID(a)) : s && this.mapView && (this._searchConfiguration = this._webMapInfo.searchConfiguration, this.beforeMapChanged.emit(), this.mapChanged.emit({
+    } 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
     }));
     this._updateShareUrl();
   }
-  /**
-   * Add/Remove tools from the action bar and dropdown based on available size
-   *
-   * @protected
-   */
-  _updateToolbar() {
-    this._timeout && clearTimeout(this._timeout), !this.isMobile && this._toolbar.value && this._toolInfos && (this._timeout = setTimeout(() => {
-      clearTimeout(this._timeout), this._setToolbarSizeInfos();
-      const i = this._toolbar?.value?.offsetWidth || 0;
-      let e = this._toolbarSizeInfos.reduce((s, a) => (s += a.width, s), 0);
-      const t = ["solutions-more", "solutions-map-layer-picker-container", "map-picker", "solutions-action-share"];
-      if (e > i) {
-        if (this._toolbarSizeInfos.length > 0) {
-          const s = [...this._toolbarSizeInfos].reverse().reduce((a, l) => (t.indexOf(l.id) < 0 && (e > i ? e -= l.width : a.push(l)), a), []).reverse();
-          this._setControlsThatFit(s, t);
-        }
-      } else if (this._defaultVisibleToolSizeInfos) {
-        const s = this._toolbarSizeInfos.reduce((o, n) => (o.push(n.id), o), []);
-        let a = !1;
-        const l = [...this._defaultVisibleToolSizeInfos].reduce((o, n) => (!a && t.indexOf(n.id) < 0 && (s.indexOf(n.id) > -1 || e + n.width <= i) ? (s.indexOf(n.id) < 0 && (e += n.width), o.push(n)) : t.indexOf(n.id) < 0 && e + n.width > i && (a = !0), o), []);
-        this._setControlsThatFit(l, t);
-      }
-    }, 250));
-  }
-  /**
-   * Validate if controls that fit the current display has changed or
-   * is different from what is currently displayed
-   *
-   * @param _setControlsThatFit
-   * @param skipControls
-   * @protected
-   */
-  _setControlsThatFit(i, e) {
-    let t = JSON.stringify(i) !== JSON.stringify(this._controlsThatFit);
-    document.getElementById("solutions-action-bar")?.childNodes?.forEach((a) => {
-      a.nodeType === 1 && e.indexOf(a.id) < 0 && !t && (t = this._controlsThatFit.map((l) => l.id).indexOf(a.id) < 0);
-    }), t && (this._controlsThatFit = [...i]);
-  }
-  /**
-   * Get the id and size for the toolbars current items
-   *
-   * @protected
-   */
-  _setToolbarSizeInfos() {
-    let i = !1;
-    this._toolbarSizeInfos = [], this._toolbar?.value?.childNodes.forEach((e) => {
-      e.nodeType === 1 && (e.id === "solutions-action-bar" ? e.childNodes.forEach((t) => {
-        t.nodeType === 1 && (this._toolbarSizeInfos.push({
-          id: t.id,
-          width: t.offsetWidth
-        }), i || (i = t.offsetWidth > 0));
-      }) : e.referenceElement || (this._toolbarSizeInfos.push({
-        id: e.id,
-        width: e.offsetWidth
-      }), i || (i = e.offsetWidth > 0)));
-    }), i && !this._defaultVisibleToolSizeInfos && (this._defaultVisibleToolSizeInfos = [...this._toolbarSizeInfos]);
-  }
   /**
    * Gets a row of controls that can be used for various interactions with the table
    *
@@ -254,19 +183,8 @@ class T extends I {
    * @protected
    */
   _getActionBar() {
-    const i = this.mapInfos?.length > 1 ? "" : "display-none", e = this.isMapLayout ? "display-flex" : "display-block", t = this.isMobile ? "border-top" : "", s = this.isMapLayout ? "" : "display-none";
-    return h`<calcite-action-bar class=${f(e)} expand-disabled expanded id=${this._getId("bar") ?? c} layout=horizontal><map-picker class=${f(i)} id=map-picker .isMapLayout=${this.isMapLayout} .locale=${this.locale} .mapInfos=${this.mapInfos} ${r(this._mapPicker)}></map-picker><div class=${`mapView-header display-flex ${s}`} id=solutions-map-layer-picker-container><div class=${`border-end ${e} ${t}`}>${this.mapView && h`<map-layer-picker appearance=transparent .defaultLayerId=${this.defaultLayerId} display=inline-flex height=50 .isMobile=${this.isMobile} .locale=${this.locale} .mapView=${this.mapView} @lyShowUpdatableLayers=${this.onlyShowUpdatableLayers} 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>${!this.isMobile && this.isMapLayout ? this._getActions() : void 0}</calcite-action-bar>`;
-  }
-  /**
-   * Get a list of toolInfos that should display in the dropdown
-   *
-   * @param id string the id for the dropdown and its tooltip
-   * @returns VNode the dropdown node
-   * @protected
-   */
-  _getDropdown(i) {
-    const e = this._getDropdownItems();
-    return e.length > 0 ? h`<calcite-dropdown close-on-select-disabled .disabled=${this.selectedLayer === void 0} id=solutions-more @calciteDropdownBeforeClose=${() => this._forceShowHide()} ${r(this._moreDropdown)}><calcite-action appearance=solid id=${i ?? c} label @click=${() => this._closeShowHide()} slot=trigger text><calcite-button appearance=transparent icon-end=chevron-down kind=neutral>${this._translations.more}</calcite-button></calcite-action><calcite-dropdown-group selection-mode=none>${e.map((t) => h`<calcite-dropdown-group class=${f(t.disabled ? "disabled" : "")} selection-mode=none><calcite-dropdown-item .disabled=${t.loading} .iconStart=${t.icon} id=solutions-subset-list @click=${t.func}>${t.loading ? h`<div class=display-flex><calcite-loader inline .label=${t.label} scale=m></calcite-loader>${t.label}</div>` : t.label}</calcite-dropdown-item></calcite-dropdown-group>`)}</calcite-dropdown-group></calcite-dropdown>` : void 0;
+    const e = this.mapInfos?.length > 1 ? "" : "display-none", i = this.isMapLayout ? "display-flex" : "display-block", s = this.isMobile ? "border-top" : "", t = this.isMapLayout ? "" : "display-none";
+    return l`<calcite-action-bar class=${p(i)} expand-disabled expanded id=${this._getId("bar") ?? c} layout=horizontal><map-picker class=${p(e)} id=map-picker .isMapLayout=${this.isMapLayout} .locale=${this.locale} .mapInfos=${this.mapInfos} ${h(this._mapPicker)}></map-picker><div class=${`mapView-header display-flex ${t}`} id=solutions-map-layer-picker-container><div class=${`border-end ${i} ${s}`}>${this.mapView && l`<map-layer-picker appearance=transparent .defaultLayerId=${this.defaultLayerId} display=inline-flex height=50 .isMobile=${this.isMobile} .locale=${this.locale} .mapView=${this.mapView} @lyShowUpdatableLayers=${this.onlyShowUpdatableLayers} 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>${!this.isMobile && this.isMapLayout ? this._getActions() : void 0}</calcite-action-bar>`;
   }
   /**
    * Get an action and tooltip for share
@@ -274,35 +192,18 @@ class T extends I {
    * @param icon string the name of the icon to display, will also be used in its id
    * @returns VNode The node representing the DOM element that will contain the action
    */
-  _getShare(i) {
-    return h`<div class="share-action" id=${this._getId(i) ?? c}>${this.mapView && h`<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((e) => {
-      e && (this._shareNode = e, this._updateShareUrl());
-    })}></instant-apps-social-share>` || ""}${this._getToolTip("bottom", i, this._translations?.share || "")}</div>`;
+  _getShare(e) {
+    return l`<div class="share-action" id=${this._getId(e) ?? c}>${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} ${h((i) => {
+      i && (this._shareNode = i, this._updateShareUrl());
+    })}></instant-apps-social-share>` || ""}${this._getToolTip("bottom", e, this._translations?.share || "")}</div>`;
   }
   /** Called each time the values that are used for custom url params change */
   _updateShareUrl() {
-    const i = this._shareNode?.shareUrl;
-    if (!i)
+    const e = this._shareNode?.shareUrl;
+    if (!e)
       return;
-    const e = new URL(i);
-    this._loadedId ? e.searchParams.set("webmap", this._loadedId) : e.searchParams.delete("webmap"), this.selectedLayer?.id ? e.searchParams.set("layer", this.selectedLayer.id) : e.searchParams.delete("layer"), this.selectedFeaturesIds?.length > 0 ? e.searchParams.set("oid", this.selectedFeaturesIds.join(",")) : e.searchParams.delete("oid"), this.appLayout && e.searchParams.set("applayout", this.appLayout), this._shareNode && (this._shareNode.shareUrl = e.href);
-  }
-  /**
-   * Open show/hide dropdown
-   *
-   * @protected
-   */
-  _closeShowHide() {
-    this._showHideOpen = !1;
-  }
-  /**
-   * Get a list of toolInfos that should display in the dropdown
-   *
-   * @returns IToolInfo[] the list of toolInfos that should display in the dropdown
-   * @protected
-   */
-  _getDropdownItems() {
-    return this._toolInfos?.filter((i) => i && i.isOverflow);
+    const i = new URL(e);
+    this._loadedId ? i.searchParams.set("webmap", this._loadedId) : i.searchParams.delete("webmap"), this.selectedLayer?.id ? i.searchParams.set("layer", this.selectedLayer.id) : i.searchParams.delete("layer"), this.selectedFeaturesIds?.length > 0 ? i.searchParams.set("oid", this.selectedFeaturesIds.join(",")) : i.searchParams.delete("oid"), this.appLayout && i.searchParams.set("applayout", this.appLayout), this._shareNode && (this._shareNode.shareUrl = i.href);
   }
   /**
    * Get the full list of toolInfos.
@@ -312,42 +213,38 @@ class T extends I {
    * @protected
    */
   _initToolInfos() {
-    const i = this.selectedFeaturesIds?.length > 0;
+    const e = this.selectedFeaturesIds?.length > 0;
     if (this.selectedFeaturesIds?.length > 1, this._translations) {
-      const e = [];
-      e.push({
+      const i = [];
+      i.push({
         active: !1,
         icon: "zoom-to-object",
         indicator: !1,
         label: this._translations.zoom || "",
         func: () => this._zoom(),
-        disabled: !i,
-        isOverflow: !1
-      }), e.push({
+        disabled: !e
+      }), i.push({
         active: !1,
         icon: "filter",
         indicator: !1,
         label: this._translations.filters || "",
         func: () => this._toggleFilter(),
-        disabled: !1,
-        isOverflow: !1
-      }), e.push({
+        disabled: !1
+      }), i.push({
         active: !1,
         icon: "refresh",
         indicator: !1,
         label: this._translations.refresh || "",
         func: () => this.selectedLayer?.refresh(),
-        disabled: !1,
-        isOverflow: !1
-      }), e.push({
+        disabled: !1
+      }), i.push({
         active: !1,
         icon: "erase",
         indicator: !1,
         label: this._translations.clearSelection || "",
         func: () => this.clearSelection.emit(),
-        disabled: !i,
-        isOverflow: !1
-      }), this._toolInfos = e, this._defaultVisibleToolSizeInfos = [];
+        disabled: !e
+      }), this._toolInfos = i;
     }
   }
   /**
@@ -356,9 +253,9 @@ class T extends I {
    * @protected
    */
   _validateActiveActions() {
-    const i = ["filter"];
-    this._toolInfos?.forEach((e) => {
-      e && i.indexOf(e.icon) > -1 && e.icon === "filter" && (e.indicator = this._filterActive);
+    const e = ["filter"];
+    this._toolInfos?.forEach((i) => {
+      i && e.indexOf(i.icon) > -1 && i.icon === "filter" && (i.indicator = this._filterActive);
     });
   }
   /**
@@ -367,9 +264,9 @@ class T extends I {
    * @protected
    */
   _validateEnabledActions() {
-    const i = this.selectedFeaturesIds?.length > 0, e = this.selectedFeaturesIds?.length > 1 && this.selectedLayer?.capabilities?.operations?.supportsUpdate, t = ["zoom-to-object", "pencil", "erase"];
-    this._toolInfos?.forEach((s) => {
-      s && t.indexOf(s.icon) > -1 && (s.disabled = s.icon === "pencil" ? !e : !i);
+    const e = this.selectedFeaturesIds?.length > 0, i = this.selectedFeaturesIds?.length > 1 && this.selectedLayer?.capabilities?.operations?.supportsUpdate, s = ["zoom-to-object", "pencil", "erase"];
+    this._toolInfos?.forEach((t) => {
+      t && s.indexOf(t.icon) > -1 && (t.disabled = t.icon === "pencil" ? !i : !e);
     });
   }
   /**
@@ -383,23 +280,14 @@ class T extends I {
         view: this.mapView
       }), this._homeWidget && this.mapView) {
         this.mapView.ui.add(this._homeWidget, { position: this.homeZoomPosition, index: this.homeZoomIndex });
-        const i = this.homeZoomToolsSize === "s" ? "32px" : this.homeZoomToolsSize === "m" ? "40px" : "48px";
-        this._homeWidget.domNode.style.height = i, this._homeWidget.domNode.style.width = i;
+        const e = this.homeZoomToolsSize === "s" ? "32px" : this.homeZoomToolsSize === "m" ? "40px" : "48px";
+        this._homeWidget.domNode.style.height = e, this._homeWidget.domNode.style.width = e;
       }
     } else this._homeWidget && this.mapView && this.mapView.ui.remove(this._homeWidget);
   }
-  /** Toggle show/hide dropdown */
-  _toggleShowHide() {
-    this._showHideOpen = !this._showHideOpen;
-  }
-  /** Open show/hide dropdown */
-  _forceShowHide() {
-    this._moreDropdown.value && (this._moreDropdown.value.open = this._showHideOpen);
-  }
   /** Close show/hide dropdown when the user clicks outside of it */
-  _handleDocumentClick(i) {
-    const e = i.target?.id;
-    e === "solutions-subset-list" ? this._moreDropdown.value && (this._moreDropdown.value.open = !0) : this._showHideOpen && e !== "solutions-subset-list" && e !== "solutions-more" && e !== "chevron-down" && this._moreDropdown.value && (this._showHideOpen = !1, this._moreDropdown.value.open = !1), i.target.tagName !== "MAP-PICKER" && (this._mapListExpanded = !1, this._mapPicker.value && this._mapPicker.value.close());
+  _handleDocumentClick(e) {
+    e.target.tagName !== "MAP-PICKER" && (this._mapListExpanded = !1, this._mapPicker.value && this._mapPicker.value.close());
   }
   /**
    * Zoom to all selected features
@@ -408,8 +296,8 @@ class T extends I {
    */
   async _zoom() {
     if (this.selectedLayer && this.mapView) {
-      const i = await g(this.mapView, this.selectedLayer.id);
-      i && await w(this.selectedFeaturesIds, i, this.mapView, !0, void 0, this.zoomToScale);
+      const e = await g(this.mapView, this.selectedLayer.id);
+      e && await y(this.selectedFeaturesIds, e, this.mapView, !0, void 0, this.zoomToScale);
     }
   }
   /**
@@ -426,8 +314,8 @@ class T extends I {
    * @returns boolean
    */
   _hasFilterExpressions() {
-    let i = [];
-    return this.mapInfo?.filterConfig?.layerExpressions && this.selectedLayer?.id && (i = this.mapInfo.filterConfig.layerExpressions.filter((e) => e.id === this.selectedLayer?.id)), i.length > 0;
+    let e = [];
+    return this.mapInfo?.filterConfig?.layerExpressions && this.selectedLayer?.id && (e = this.mapInfo.filterConfig.layerExpressions.filter((i) => i.id === this.selectedLayer?.id)), e.length > 0;
   }
   /**
    * Get the actions that are used for various interactions with the table
@@ -435,7 +323,7 @@ class T extends I {
    * @returns VNode[] the action nodes
    */
   _getActions() {
-    return this._getActionItems()?.reduce((e, t) => (t && !t.isOverflow && e.push(this._getAction(t.active, t.icon, t.indicator, t.label, t.func, t.disabled, t.loading)), e), []);
+    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)), e), []);
   }
   /**
    * Get a tooltip
@@ -445,16 +333,8 @@ class T extends I {
    * @param text string the text to display in the tooltip
    * @returns VNode The tooltip node
    */
-  _getToolTip(i, e, t) {
-    return document.getElementById(e) ? h`<calcite-tooltip .placement=${i} .referenceElement=${"map-" + e}><span>${t}</span></calcite-tooltip>` : void 0;
-  }
-  /**
-   * Get a list of toolInfos that should display outside of the dropdown
-   *
-   * @returns IToolInfo[] the list of toolInfos that should not display in the overflow dropdown
-   */
-  _getActionItems() {
-    return this._toolInfos?.filter((i) => i && !i.isOverflow);
+  _getToolTip(e, i, s) {
+    return document.getElementById(i) ? l`<calcite-tooltip .placement=${e} .referenceElement=${"map-" + i}><span>${s}</span></calcite-tooltip>` : void 0;
   }
   /**
    * Get an action and tooltip
@@ -469,9 +349,9 @@ class T extends I {
    * @param slot slot for the action
    * @returns VNode The node representing the DOM element that will contain the action
    */
-  _getAction(i, e, t, s, a, l, o, n) {
-    const m = this.selectedLayer === void 0 ? !0 : l;
-    return h`<div class=display-flex id=${this._getId(e) ?? c} slot=${n ?? c}><calcite-action .active=${i} appearance=solid .disabled=${m} .icon=${e} .id=${"map-" + e} .indicator=${t} .label=${s} .loading=${o} @click=${a} .text=${s} text-enabled></calcite-action>${this._getToolTip("bottom", e, s)}</div>`;
+  _getAction(e, i, s, t, a, r, o) {
+    const m = this.selectedLayer === void 0 ? !0 : r;
+    return l`<calcite-action .active=${e} appearance=solid .disabled=${m} .icon=${i} .id=${"map-" + i} .indicator=${s} .label=${t} .loading=${o} @click=${a} .text=${t} text-enabled></calcite-action>`;
   }
   /**
    * Get an id with a prefix to the user supplied value
@@ -479,11 +359,11 @@ class T extends I {
    * @param id the unique value for the id
    * @returns the new id with the prefix value
    */
-  _getId(i) {
-    return `solutions-action-${i}`;
+  _getId(e) {
+    return `solutions-action-${e}`;
   }
 }
-u("map-card", T);
+f("map-card", v);
 export {
-  T as MapCard
+  v as MapCard
 };

package/dist/components/map-card/index.d.ts

@@ -3,12 +3,7 @@ import "../map-tools/index.js";
 import "@esri/calcite-components/components/calcite-action-bar";
 import "../map-picker/index.js";
 import "../map-layer-picker/index.js";
-import "@esri/calcite-components/components/calcite-dropdown";
-import "@esri/calcite-components/components/calcite-action";
-import "@esri/calcite-components/components/calcite-button";
-import "@esri/calcite-components/components/calcite-dropdown-group";
-import "@esri/calcite-components/components/calcite-dropdown-item";
-import "@esri/calcite-components/components/calcite-loader";
 import "@arcgis/instant-apps-components/dist/components/instant-apps-social-share.js";
 import "@esri/calcite-components/components/calcite-tooltip";
+import "@esri/calcite-components/components/calcite-action";
 export * from "./customElement.js";

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

@@ -3,12 +3,7 @@ import "../map-tools/index.js";
 import "@esri/calcite-components/components/calcite-action-bar";
 import "../map-picker/index.js";
 import "../map-layer-picker/index.js";
-import "@esri/calcite-components/components/calcite-dropdown";
-import "@esri/calcite-components/components/calcite-action";
-import "@esri/calcite-components/components/calcite-button";
-import "@esri/calcite-components/components/calcite-dropdown-group";
-import "@esri/calcite-components/components/calcite-dropdown-item";
-import "@esri/calcite-components/components/calcite-loader";
 import "@arcgis/instant-apps-components/dist/components/instant-apps-social-share.js";
 import "@esri/calcite-components/components/calcite-tooltip";
+import "@esri/calcite-components/components/calcite-action";
 export * from "./customElement.js";

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

@@ -9,7 +9,7 @@ import { LitElement as f, createEvent as h, noShadowRoot as y, safeClassMap as o
 import { css as k } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.0/esri/copyright.txt for details.
-v1.0.0-next.20250422.3 */
+v1.0.0-next.20250425 */
 const w = k`@layer{/** @license
  * Copyright 2025 Esri
  *

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

@@ -6,7 +6,7 @@ import { LitElement as r, createEvent as c } from "@arcgis/lumina";
 import { css as h } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.0/esri/copyright.txt for details.
-v1.0.0-next.20250422.3 */
+v1.0.0-next.20250425 */
 const o = h`/** @license
  * Copyright 2025 Esri
  *

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

@@ -8,7 +8,7 @@ import { LitElement as f, createEvent as r, noShadowRoot as L, safeStyleMap as y
 import { css as w } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.0/esri/copyright.txt for details.
-v1.0.0-next.20250422.3 */
+v1.0.0-next.20250425 */
 const I = w`@layer{/** @license
  * Copyright 2025 Esri
  *