@esri/solutions-components 1.0.0-next.20250425.2 → 1.0.0-next.20250429

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

@@ -1,10 +1,10 @@
 import { c as b } from "../../chunks/runtime.js";
 import { l as y } from "../../chunks/loadModules.js";
 import { b as g, d as m, g as w } from "../../chunks/mapViewUtils.js";
-import { b as I } from "../../chunks/queryUtils.js";
+import { c as I } from "../../chunks/queryUtils.js";
 import { d as x } from "../../chunks/downloadUtils.js";
-import { defineCustomElements as E } from "@arcgis/instant-apps-components/loader";
-import { u as v } from "../../chunks/useT9n.js";
+import { defineCustomElements as v } from "@arcgis/instant-apps-components/loader";
+import { u as E } from "../../chunks/useT9n.js";
 import { nothing as d, html as h } from "lit";
 import { createRef as _, ref as c } from "lit-html/directives/ref.js";
 import { LitElement as S, createEvent as p, noShadowRoot as O, safeClassMap as u } from "@arcgis/lumina";
@@ -12,7 +12,7 @@ import { css as T } from "@lit/reactive-element/css-tag.js";
 import "@arcgis/map-config-components";
 /*! 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.20250425.2 */
+v1.0.0-next.20250429 */
 const C = T`@layer{/** @license
  * Copyright 2025 Esri
  *
@@ -30,10 +30,10 @@ const C = T`@layer{/** @license
  */:host{display:block}.height-full{height:100%}.height-full-adjusted{height:calc(100% - 20px)}.width-full{width:100%}.display-flex{display:flex}.display-none{display:none}.table-border{border:1px solid var(--calcite-color-border-2)}.border-end{border-inline-end:1px solid var(--calcite-color-border-2)}.border-bottom{border-bottom:1px solid var(--calcite-color-border-2)}.padding-5{padding:5px}.padding-end-1{padding-inline-end:1rem}.height-51-px{height:51px}.height-50-px{height:50px}.bottom-left{position:absolute;left:0;bottom:0;padding-left:5px}html[dir=rtl] .bottom-left{position:absolute;right:0;bottom:0;padding-right:5px}.height-19{height:19px}.background{background-color:var(--calcite-color-background)}.text-color{color:var(--calcite-color-text-1)}.align-center{align-items:center}.danger-color{color:var(--calcite-color-status-danger)}.esri-feature-table vaadin-grid{border:none!important}vaadin-grid-cell-content{font-size:14px!important;color:var(--calcite-color-text-3)!important}.absolute-right{position:absolute;right:0;left:unset}html[dir=rtl] .absolute-right{left:0;right:unset}.disabled{cursor:default!important;user-select:none;opacity:var(--calcite-opacity-disabled);pointer-events:none}.actions-end{height:50px!important;display:inline-flex}.border-top{border-top:1px solid var(--calcite-color-border-2)}.modal{--calcite-modal-content-padding: 0}.esri-feature-table__table-container{height:100%}.search-container{background-color:var(--calcite-color-foreground-1)!important}.search{--calcite-color-border-input: var(--calcite-color-border-3);width:60%;padding:10px}.delete-red{--calcite-icon-color: var(--calcite-color-status-danger);--calcite-color-text-1: var(--calcite-color-status-danger);--calcite-color-text-3: var(--calcite-color-status-danger)}}`;
 class F extends S {
   constructor() {
-    super(), this.defaultGlobalId = [], this.defaultLayerId = "", this.defaultOid = [], this.enableAutoRefresh = !1, this.enableColumnReorder = !0, this.enableCSV = !1, this.enableInlineEdit = !1, this.enableShare = !1, this.honorMapFieldSettings = !1, this.isMobile = !1, this.locale = "", this.mapHidden = !1, this.onlyShowUpdatableLayers = !1, this.selectedIds = [], this.shareIncludeEmbed = !1, this.shareIncludeSocial = !1, this.showNewestFirst = !1, this.zoomAndScrollToSelected = !1, this.createFilterModal = !0, this._allIds = [], this._csvExporting = !1, this._fetchingData = !1, this._filterActive = !1, this._filterOpen = !1, this._selectAllActive = !1, this._showHideOpen = !1, this._showOnlySelected = !1, this._toolInfos = [], this._translations = v({ name: "layer-table", blocking: !0 }), this._fullTextSearchInfo = [], this._searchPlaceHolder = "", this._size = 0, this._queryingData = !1, this._editEnabled = !1, this._defaultFilterHonored = !1, this._defaultGlobalIdHonored = !1, this._defaultOidHonored = !1, this._definitionExpression = "", this._deleteEnabled = !1, this._filterList = _(), this._floorExpression = "", this._floorField = "", this._floorFacility = "", this._floorLevel = "", this._floorSite = "", this._layerExpressions = [], this._loaded = !1, this._selectionFromMap = !1, this._shareNode = _(), this._toolbar = _(), this._searchExpression = "", this._skipEditCheck = !1, this._tempSelectedIds = [], this._outOFExtentOids = [], this._shouldUpdateTableOnExtentChange = !0, this.featureSelectionChange = p(), this.toggleFilter = p(), this.showDelete = p(), this.listenOn(window, "beforeMapInfoChange", this.beforeMapInfoChange, { capture: !0 }), this.listenOn(window, "editorInitialized", this.editorInitialized), this.listenOn(window, "closeEdit", this.closeEdit), this.listenOn(window, "selectionChanged", this.selectionChanged), this.listenOn(window, "beforeLayerSelectionChange", this.beforeLayerSelectionChange), this.listenOn(window, "layerSelectionChange", this.layerSelectionChange), this.listenOn(window, "editsComplete", this.editsComplete), this.listenOn(window, "facilityChanged", this.facilityChanged), this.listenOn(window, "levelChanged", this.levelChanged), this.listenOn(window, "siteChanged", this.siteChanged), this.listenOn(window, "noLayersFound", this.noLayersFound), this.listenOn(window, "clearSelection", this.clearSelection), E(window);
+    super(), this.defaultGlobalId = [], this.defaultLayerId = "", this.defaultOid = [], this.enableAutoRefresh = !1, this.enableColumnReorder = !0, this.enableCSV = !1, this.enableInlineEdit = !1, this.enableShare = !1, this.honorMapFieldSettings = !1, this.isMobile = !1, this.mapHidden = !1, this.onlyShowUpdatableLayers = !1, this.selectedIds = [], this.shareIncludeEmbed = !1, this.shareIncludeSocial = !1, this.showNewestFirst = !1, this.zoomAndScrollToSelected = !1, this.createFilterModal = !0, this._allIds = [], this._csvExporting = !1, this._fetchingData = !1, this._filterActive = !1, this._filterOpen = !1, this._selectAllActive = !1, this._showHideOpen = !1, this._showOnlySelected = !1, this._toolInfos = [], this._translations = E({ name: "layer-table", blocking: !0 }), this._fullTextSearchInfo = [], this._searchPlaceHolder = "", this._size = 0, this._queryingData = !1, this._editEnabled = !1, this._defaultFilterHonored = !1, this._defaultGlobalIdHonored = !1, this._defaultOidHonored = !1, this._definitionExpression = "", this._deleteEnabled = !1, this._filterList = _(), this._floorExpression = "", this._floorField = "", this._floorFacility = "", this._floorLevel = "", this._floorSite = "", this._layerExpressions = [], this._loaded = !1, this._selectionFromMap = !1, this._shareNode = _(), this._toolbar = _(), this._searchExpression = "", this._skipEditCheck = !1, this._tempSelectedIds = [], this._outOFExtentOids = [], this._shouldUpdateTableOnExtentChange = !0, this.featureSelectionChange = p(), this.toggleFilter = p(), this.showDelete = p(), this.listenOn(window, "beforeMapInfoChange", this.beforeMapInfoChange, { capture: !0 }), this.listenOn(window, "editorInitialized", this.editorInitialized), this.listenOn(window, "closeEdit", this.closeEdit), this.listenOn(window, "selectionChanged", this.selectionChanged), this.listenOn(window, "beforeLayerSelectionChange", this.beforeLayerSelectionChange), this.listenOn(window, "layerSelectionChange", this.layerSelectionChange), this.listenOn(window, "editsComplete", this.editsComplete), this.listenOn(window, "facilityChanged", this.facilityChanged), this.listenOn(window, "levelChanged", this.levelChanged), this.listenOn(window, "siteChanged", this.siteChanged), this.listenOn(window, "noLayersFound", this.noLayersFound), this.listenOn(window, "clearSelection", this.clearSelection), v(window);
   }
   static {
-    this.properties = { appLayout: 1, defaultGlobalId: 0, defaultLayerId: 1, defaultOid: 0, enableAutoRefresh: 5, enableColumnReorder: 5, enableCSV: 5, enableInlineEdit: 5, enableShare: 5, honorMapFieldSettings: 5, isMobile: 5, locale: 1, mapHidden: 5, mapInfo: 0, mapView: 0, onlyShowUpdatableLayers: 5, selectedIds: 0, shareIncludeEmbed: 5, shareIncludeSocial: 5, showNewestFirst: 5, zoomAndScrollToSelected: 5, zoomToScale: 9, createFilterModal: 5, _allIds: 16, _csvExporting: 16, _fetchingData: 16, _filterActive: 16, _filterOpen: 16, _layer: 16, _selectAllActive: 16, _showHideOpen: 16, _showOnlySelected: 16, _toolInfos: 16, _translations: 16, _fullTextSearchInfo: 16, _searchPlaceHolder: 16, _size: 16, _queryingData: 16 };
+    this.properties = { appLayout: 1, defaultGlobalId: 0, defaultLayerId: 1, defaultOid: 0, enableAutoRefresh: 5, enableColumnReorder: 5, enableCSV: 5, enableInlineEdit: 5, enableShare: 5, honorMapFieldSettings: 5, isMobile: 5, mapHidden: 5, mapInfo: 0, mapView: 0, onlyShowUpdatableLayers: 5, selectedIds: 0, shareIncludeEmbed: 5, shareIncludeSocial: 5, showNewestFirst: 5, zoomAndScrollToSelected: 5, zoomToScale: 9, createFilterModal: 5, _allIds: 16, _csvExporting: 16, _fetchingData: 16, _filterActive: 16, _filterOpen: 16, _layer: 16, _selectAllActive: 16, _showHideOpen: 16, _showOnlySelected: 16, _toolInfos: 16, _translations: 16, _fullTextSearchInfo: 16, _searchPlaceHolder: 16, _size: 16, _queryingData: 16 };
   }
   static {
     this.styles = C;
@@ -43,7 +43,10 @@ class F extends S {
   }
   /** TODO: [MIGRATION] Consider inlining some of the watch functions called inside of this method to reduce boilerplate code */
   willUpdate(e) {
-    e.has("appLayout") && this.appLayoutWatchHandler(), e.has("defaultOid") && this.defaultOidWatchHandler(), e.has("defaultGlobalId") && this.defaultGlobalIdWatchHandler(), e.has("enableCSV") && this.enableCSVWatchHandler(), e.has("enableInlineEdit") && this.enableInlineEditWatchHandler(), e.has("locale") && this.localeWatchHandler(), e.has("mapHidden") && this.mapHiddenWatchHandler(), e.has("isMobile") && this.isMobileWatchHandler(), e.has("mapInfo") && this.mapInfoWatchHandler(), e.has("mapView") && this.mapViewWatchHandler(), e.has("_layer") && this._layerWatchHandler(), e.has("selectedIds") && (this.hasUpdated || JSON.stringify(e.get("selectedIds")) !== JSON.stringify(this.selectedIds)) && this.selectedIdsWatchHandler();
+    if (e.has("appLayout") && this.appLayoutWatchHandler(), e.has("defaultOid") && this.defaultOidWatchHandler(), e.has("defaultGlobalId") && this.defaultGlobalIdWatchHandler(), e.has("enableCSV") && this.enableCSVWatchHandler(), e.has("enableInlineEdit") && this.enableInlineEditWatchHandler(), e.has("mapHidden") && this.mapHiddenWatchHandler(), e.has("isMobile") && this.isMobileWatchHandler(), e.has("mapInfo") && this.mapInfoWatchHandler(), e.has("mapView") && this.mapViewWatchHandler(), e.has("_layer") && this._layerWatchHandler(), e.has("selectedIds") && (this.hasUpdated || JSON.stringify(e.get("selectedIds")) !== JSON.stringify(this.selectedIds)) && this.selectedIdsWatchHandler(), e.has("_translations")) {
+      const t = this._translations._lang, i = e.get("_translations")?._lang;
+      t && i && t !== i && this._initToolInfos();
+    }
   }
   //--------------------------------------------------------------------------
   //
@@ -70,10 +73,6 @@ class F extends S {
   enableInlineEditWatchHandler() {
     this._table && (this._table.editingEnabled = this._editEnabled && this.enableInlineEdit);
   }
-  /** Fetch translations when the locale is updated */
-  async localeWatchHandler() {
-    this.el.lang = this.locale;
-  }
   /** Reset the toolInfos when mapHidden prop changes so we can show/hide any map dependant tool(s) */
   mapHiddenWatchHandler() {
     this._toolInfos?.length > 0 && this._initToolInfos();
@@ -156,7 +155,7 @@ class F extends S {
   /**
    * Get the Editor instance after it's been initialized
    *
-   * @param evt CustomEvent that contains the editor instance
+   * @param _evt CustomEvent that contains the editor instance
    * @returns a promise when the operation has completed
    */
   async editorInitialized(e) {
@@ -173,7 +172,7 @@ class F extends S {
   /**
    * Scroll and zoom to the selected feature from the Features widget.
    *
-   * @param evt CustomEvent the graphic for the current selection
+   * @param _evt CustomEvent the graphic for the current selection
    */
   async selectionChanged(e) {
     const t = e.detail.selectedFeature[0], i = Number(t.getObjectId()), a = this._table;
@@ -188,7 +187,7 @@ class F extends S {
   /**
    * Handles before layer selection change
    *
-   * @param evt CustomEvent the id for the current layer
+   * @param _evt CustomEvent the id for the current layer
    */
   async beforeLayerSelectionChange(e) {
     if (this._hasPendingEdits()) {
@@ -200,7 +199,7 @@ class F extends S {
   /**
    * Handles layer selection change to show new table
    *
-   * @param evt CustomEvent the id for the current layer
+   * @param _evt CustomEvent the id for the current layer
    */
   async layerSelectionChange(e) {
     await this._layerSelectionChanged(e);
@@ -241,7 +240,7 @@ class F extends S {
   /** Renders the component. */
   render() {
     const e = this._fetchingData ? "display-none" : "", t = this._fetchingData ? "" : "display-none", i = this._queryingData ? "" : "display-none", a = this._size.toString(), s = this.selectedIds.length.toString(), l = this.isMobile ? "height-full" : "height-full-adjusted", o = this._canShowFullTextSearch();
-    return this._validateActiveActions(), h`<div><calcite-scrim class=${u(i)} .loading=${this._queryingData}></calcite-scrim><calcite-shell>${this._getTableControlRow("header")}<div class=${`width-full ${l}`}><calcite-panel class="height-full width-full">${o && h`<div class="search-container border-bottom"><calcite-input class=search clearable icon=search @calciteInputChange=${(n) => void this._searchTextChanged(n)} .placeholder=${this._searchPlaceHolder} title=${this._searchPlaceHolder ?? d} type=search></calcite-input></div>` || ""}<calcite-loader class=${u(t)} .label=${this._translations.fetchingData || ""} scale=l></calcite-loader><div class=${u(e)} ${c(this.onTableNodeCreate)}></div></calcite-panel></div>${this.isMobile ? void 0 : h`<div class="bottom-left text-color height-19" id=solutions-selected-count-div>${((this._translations?.recordsTotal || "").replace("{{total-number-of-records}}", a) + " | " + (this._translations.recordsSelected || "").replace("{{selected-number-of-records}}", s)).replace("{{total}}", a).replace("{{selected}}", s)}</div>`}</calcite-shell>${this.createFilterModal && this._filterModal() || ""}</div>`;
+    return this._validateActiveActions(), h`<div><calcite-scrim class=${u(i)} .loading=${this._queryingData}></calcite-scrim><calcite-shell>${this._getTableControlRow("header")}<div class=${`width-full ${l}`}><calcite-panel class="height-full width-full">${o && h`<div class="search-container border-bottom"><calcite-input class=search clearable icon=search @calciteInputChange=${(n) => void this._searchTextChanged(n)} .placeholder=${this._searchPlaceHolder} title=${this._searchPlaceHolder ?? d} type=search></calcite-input></div>` || ""}<calcite-loader class=${u(t)} .label=${this._translations.fetchingData} scale=l></calcite-loader><div class=${u(e)} ${c(this.onTableNodeCreate)}></div></calcite-panel></div>${this.isMobile ? void 0 : h`<div class="bottom-left text-color height-19" id=solutions-selected-count-div>${(this._translations.recordsTotal?.replace("{{total-number-of-records}}", a) + " | " + this._translations.recordsSelected.replace("{{selected-number-of-records}}", s)).replace("{{total}}", a).replace("{{selected}}", s)}</div>`}</calcite-shell>${this.createFilterModal && this._filterModal() || ""}</div>`;
   }
   //--------------------------------------------------------------------------
   //
@@ -325,7 +324,7 @@ class F extends S {
         t.forEach((a) => {
           const s = this._layer?.getField(a.trim());
           s?.alias && i.push(s.alias);
-        }), this._searchPlaceHolder = (this._translations.searchPlaceholder || "").replace("{{fields}}", i.join(", ")), this._fullTextSearchInfo.push({
+        }), this._searchPlaceHolder = this._translations.searchPlaceholder.replace("{{fields}}", i.join(", ")), this._fullTextSearchInfo.push({
           onFields: ["*"],
           searchTerm: "",
           searchType: "prefix"
@@ -350,7 +349,7 @@ class F extends S {
    */
   _getActionBar() {
     const e = this.isMobile ? "border-top" : "";
-    return h`<calcite-action-bar class=width-full expand-disabled expanded id=${this._getId("bar") ?? d} layout=horizontal><div class=${`border-end ${e}`} id=solutions-map-layer-picker-container><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._layer ? [this._layer?.id] : []} show-single-layer-as-label show-tables type=dropdown></map-layer-picker></div><calcite-action-group>${this.isMobile ? void 0 : this._getActions()}</calcite-action-group></calcite-action-bar>`;
+    return h`<calcite-action-bar class=width-full expand-disabled expanded id=${this._getId("bar") ?? d} layout=horizontal><div class=${`border-end ${e}`} id=solutions-map-layer-picker-container><map-layer-picker appearance=transparent .defaultLayerId=${this.defaultLayerId} display=inline-flex height=50 .isMobile=${this.isMobile} .mapView=${this.mapView} @lyShowUpdatableLayers=${this.onlyShowUpdatableLayers} placeholder-icon=layers scale=l .selectedIds=${this._layer ? [this._layer?.id] : []} show-single-layer-as-label show-tables type=dropdown></map-layer-picker></div><calcite-action-group>${this.isMobile ? void 0 : this._getActions()}</calcite-action-group></calcite-action-bar>`;
   }
   /**
    * Get the actions that are used for various interactions with the table
@@ -371,7 +370,7 @@ class F extends S {
   _validateActiveActions() {
     const e = ["filter", "list-check-all", "selected-items-filter"];
     this._toolInfos?.forEach((t) => {
-      t && e.indexOf(t.icon) > -1 && (t.icon === "filter" && (t.indicator = this._filterActive), t.icon === "list-check-all" && (t.active = this._selectAllActive), t.icon === "selected-items-filter" && (t.active = this._showOnlySelected, t.label = this._showOnlySelected ? this._translations.showAll || "" : this._translations.showSelected || ""));
+      t && e.indexOf(t.icon) > -1 && (t.icon === "filter" && (t.indicator = this._filterActive), t.icon === "list-check-all" && (t.active = this._selectAllActive), t.icon === "selected-items-filter" && (t.active = this._showOnlySelected, t.label = this._showOnlySelected ? this._translations.showAll : this._translations.showSelected));
     });
   }
   /**
@@ -382,76 +381,73 @@ class F extends S {
   _initToolInfos() {
     const e = this._featuresSelected();
     this.selectedIds.length > 1 && this._layer?.capabilities?.operations?.supportsUpdate;
-    const t = !this.mapHidden && !this._layer?.isTable, i = this._featuresEmpty(), a = !this._layer?.isTable || this._hasFilterExpressions();
-    if (this._translations) {
-      const s = [];
-      t && s.push({
-        active: !1,
-        icon: "zoom-to-object",
-        indicator: !1,
-        label: this._translations.zoom || "",
-        func: () => this._zoom(),
-        disabled: !e
-      }), a && s.push({
-        active: !1,
-        icon: "filter",
-        indicator: !1,
-        label: this._translations.filters || "",
-        func: () => this.createFilterModal ? this._toggleFilter() : this.toggleFilter.emit(),
-        disabled: !1
-      }), this._deleteEnabled && s.push({
-        active: !1,
-        icon: "trash",
-        indicator: !1,
-        label: this._translations.delete || "",
-        func: () => this._showDelete(),
-        disabled: !e,
-        isDanger: !0
-      }), s.push({
-        active: !1,
-        icon: "erase",
-        indicator: !1,
-        label: this._translations.clearSelection || "",
-        func: () => void this.clearSelection(),
-        disabled: !e
-      }), s.push({
-        active: !1,
-        icon: "selected-items-filter",
-        indicator: !1,
-        label: (this._showOnlySelected ? this._translations.showAll : this._translations.showSelected) || "",
-        func: () => this._toggleShowSelected(),
-        disabled: !e
-      }), s.push({
-        active: !1,
-        icon: "list-check-all",
-        indicator: !1,
-        func: async () => await this._selectAll(),
-        label: this._translations.selectAll || "",
-        disabled: i
-      }), s.push({
-        active: !1,
-        icon: "compare",
-        indicator: !1,
-        func: async () => await this._switchSelected(),
-        label: this._translations.switchSelected || "",
-        disabled: i
-      }), s.push({
-        active: !1,
-        icon: "refresh",
-        indicator: !1,
-        func: () => this._refresh(),
-        label: this._translations.refresh || "",
-        disabled: !1
-      }), this.enableCSV && s.push({
-        active: !1,
-        icon: "export",
-        indicator: !1,
-        func: () => void this._exportToCSV(),
-        label: this._translations.exportCSV || "",
-        loading: this._csvExporting,
-        disabled: i
-      }), this._toolInfos = s;
-    }
+    const t = !this.mapHidden && !this._layer?.isTable, i = this._featuresEmpty(), a = !this._layer?.isTable || this._hasFilterExpressions(), s = [];
+    t && s.push({
+      active: !1,
+      icon: "zoom-to-object",
+      indicator: !1,
+      label: this._translations.zoom,
+      func: () => this._zoom(),
+      disabled: !e
+    }), a && s.push({
+      active: !1,
+      icon: "filter",
+      indicator: !1,
+      label: this._translations.filters,
+      func: () => this.createFilterModal ? this._toggleFilter() : this.toggleFilter.emit(),
+      disabled: !1
+    }), this._deleteEnabled && s.push({
+      active: !1,
+      icon: "trash",
+      indicator: !1,
+      label: this._translations.delete,
+      func: () => this._showDelete(),
+      disabled: !e,
+      isDanger: !0
+    }), s.push({
+      active: !1,
+      icon: "erase",
+      indicator: !1,
+      label: this._translations.clearSelection,
+      func: () => void this.clearSelection(),
+      disabled: !e
+    }), s.push({
+      active: !1,
+      icon: "selected-items-filter",
+      indicator: !1,
+      label: this._showOnlySelected ? this._translations.showAll : this._translations.showSelected,
+      func: () => this._toggleShowSelected(),
+      disabled: !e
+    }), s.push({
+      active: !1,
+      icon: "list-check-all",
+      indicator: !1,
+      func: async () => await this._selectAll(),
+      label: this._translations.selectAll,
+      disabled: i
+    }), s.push({
+      active: !1,
+      icon: "compare",
+      indicator: !1,
+      func: async () => await this._switchSelected(),
+      label: this._translations.switchSelected,
+      disabled: i
+    }), s.push({
+      active: !1,
+      icon: "refresh",
+      indicator: !1,
+      func: () => this._refresh(),
+      label: this._translations.refresh,
+      disabled: !1
+    }), this.enableCSV && s.push({
+      active: !1,
+      icon: "export",
+      indicator: !1,
+      func: () => void this._exportToCSV(),
+      label: this._translations.exportCSV,
+      loading: this._csvExporting,
+      disabled: i
+    }), console.log(s), this._toolInfos = [...s];
   }
   /**
    * Applies a definition expression when floor field and level are available
@@ -520,7 +516,7 @@ class F extends S {
    * @returns VNode The node representing the DOM element that will contain the action
    */
   _getShare(e) {
-    return this.mapView && h`<div id=${this._getId(e) ?? d}><instant-apps-social-share class="actions-end" .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} ${c(this._shareNode)}></instant-apps-social-share>${this._getToolTip("bottom", e, this._translations.share || "")}</div>` || "";
+    return this.mapView && h`<div id=${this._getId(e) ?? d}><instant-apps-social-share class="actions-end" .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} ${c(this._shareNode)}></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() {
@@ -570,7 +566,7 @@ class F extends S {
    * @returns number[] the selected ids
    */
   _getIds() {
-    return this._table?.highlightIds?.map((e) => parseInt(e.toString(), 10)).toArray() || [];
+    return this._table?.highlightIds?.map((e) => Number.parseInt(e.toString(), 10)).toArray() || [];
   }
   /**
    * Store a reference to the table node after it's first created
@@ -775,7 +771,7 @@ class F extends S {
    * @protected
    */
   _filterModal() {
-    return h`<calcite-dialog class="filter-content-space" .heading=${this._translations?.filter?.replace("{{title}}", this._layer?.title || "")} id=solutions-filter-dialog kind=brand modal @calciteDialogClose=${() => void this._closeFilter()} .open=${this._filterOpen} width-scale=s>${this.mapView && h`<instant-apps-filter-list close-btn .closeBtnOnClick=${() => void this._closeFilter()} combobox-overlay-positioning=fixed .layerExpressions=${this._layerExpressions} @filterListReset=${() => void this._handleFilterListReset()} @filterUpdate=${() => this._filterList?.value?.filterCount && void this._handleFilterUpdate(this._filterList?.value?.filterCount > 0)} .view=${this.mapView} ${c(this._filterList)}></instant-apps-filter-list>` || ""}</calcite-dialog>`;
+    return h`<calcite-dialog class="filter-content-space" .heading=${this._translations.filter.replace("{{title}}", this._layer?.title || "")} id=solutions-filter-dialog kind=brand modal @calciteDialogClose=${() => void this._closeFilter()} .open=${this._filterOpen} width-scale=s>${this.mapView && h`<instant-apps-filter-list close-btn .closeBtnOnClick=${() => void this._closeFilter()} combobox-overlay-positioning=fixed .layerExpressions=${this._layerExpressions} @filterListReset=${() => void this._handleFilterListReset()} @filterUpdate=${() => this._filterList?.value?.filterCount && void this._handleFilterUpdate(this._filterList?.value?.filterCount > 0)} .view=${this.mapView} ${c(this._filterList)}></instant-apps-filter-list>` || ""}</calcite-dialog>`;
   }
   /**
    * Reset the filter active prop
@@ -842,7 +838,7 @@ class F extends S {
   /**
    * Handle map click events to keep table and map click selection in sync
    *
-   * @param evt IMapClick map click event details
+   * @param _evt IMapClick map click event details
    * @protected
    */
   async _mapClicked(e) {
@@ -969,7 +965,7 @@ class F extends S {
   /**
    * Handles layer selection change to show new table
    *
-   * @param evt CustomEvent the id for the current layer
+   * @param _evt CustomEvent the id for the current layer
    * @returns a promise that will resolve when the operation is complete
    * @protected
    */

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

@@ -2,7 +2,7 @@
 /// <reference types="../../index.d.ts" />
 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 { PublicLitElement as LitElement, TargetedEvent, JsxNode } from '@arcgis/lumina';
 import { MapLayerPicker } from '../map-layer-picker/customElement.js';
 import { MapTools } from '../map-tools/customElement.js';
 import { MapPicker } from '../map-picker/customElement.js';
@@ -50,9 +50,7 @@ export declare class MapCard extends LitElement {
      */
     homeZoomPosition: __esri.UIPosition;
     /** "s" | "m" | "l": Used for Zoom and Home tools */
-    homeZoomToolsSize: 's' | 'm' | 'l';
-    /** string: Locale to use for translation of stings in the UI */
-    locale: string;
+    homeZoomToolsSize: 'l' | 'm' | 's';
     /** IMapInfo[]: array of map infos (name and id) */
     mapInfos: IMapInfo[];
     /**
@@ -66,7 +64,7 @@ export declare class MapCard extends LitElement {
      */
     mapWidgetsPosition: __esri.UIPosition;
     /** "s" | "m" | "l": Used for optional map tool widget */
-    mapWidgetsSize: 's' | 'm' | 'l';
+    mapWidgetsSize: 'l' | 'm' | 's';
     /** esri/views/View: https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html */
     mapView: __esri.MapView | undefined;
     /**

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

@@ -10,8 +10,8 @@ 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.20250425.2 */
-const S = L`@layer{/** @license
+v1.0.0-next.20250429 */
+const v = L`@layer{/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -26,27 +26,27 @@ const S = L`@layer{/** @license
  * 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-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 {
+class S 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 = _({ 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);
+    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.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, _toolInfos: 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, 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 = S;
+    this.styles = v;
   }
   static {
     this.shadowRootOptions = I;
   }
   /** TODO: [MIGRATION] Consider inlining some of the watch functions called inside of this method to reduce boilerplate code */
   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();
+    e.has("appLayout") && this.appLayoutWatchHandler(), e.has("enableHome") && this.enableHomeWatchHandler(), e.has("mapView") && this.mapViewWatchHandler(), e.has("selectedLayer") && this.selectedLayerWatchHandler(), e.has("selectedFeaturesIds") && this.selectedFeaturesIdsWatchHandler();
   }
   //--------------------------------------------------------------------------
   //
@@ -61,10 +61,6 @@ class v extends w {
   enableHomeWatchHandler() {
     this.mapView && this._initHome();
   }
-  /** Fetch translations when the locale is updated */
-  async localeWatchHandler() {
-    this.el.lang = this.locale;
-  }
   /** watch for changes in map view and get the first layer */
   async mapViewWatchHandler() {
     this.mapView && this._updateShareUrl();
@@ -117,7 +113,7 @@ class v extends w {
   /** Renders the component. */
   render() {
     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>`}`;
+    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} .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() {
@@ -184,7 +180,7 @@ class v extends w {
    */
   _getActionBar() {
     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>`;
+    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} .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} .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
@@ -195,7 +191,7 @@ class v extends w {
   _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>`;
+    })}></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() {
@@ -214,38 +210,37 @@ class v extends w {
    */
   _initToolInfos() {
     const e = this.selectedFeaturesIds?.length > 0;
-    if (this.selectedFeaturesIds?.length > 1, this._translations) {
-      const i = [];
-      i.push({
-        active: !1,
-        icon: "zoom-to-object",
-        indicator: !1,
-        label: this._translations.zoom || "",
-        func: () => this._zoom(),
-        disabled: !e
-      }), i.push({
-        active: !1,
-        icon: "filter",
-        indicator: !1,
-        label: this._translations.filters || "",
-        func: () => this._toggleFilter(),
-        disabled: !1
-      }), i.push({
-        active: !1,
-        icon: "refresh",
-        indicator: !1,
-        label: this._translations.refresh || "",
-        func: () => this.selectedLayer?.refresh(),
-        disabled: !1
-      }), i.push({
-        active: !1,
-        icon: "erase",
-        indicator: !1,
-        label: this._translations.clearSelection || "",
-        func: () => this.clearSelection.emit(),
-        disabled: !e
-      }), this._toolInfos = i;
-    }
+    this.selectedFeaturesIds?.length > 1;
+    const i = [];
+    i.push({
+      active: !1,
+      icon: "zoom-to-object",
+      indicator: !1,
+      label: this._translations.zoom,
+      func: () => this._zoom(),
+      disabled: !e
+    }), i.push({
+      active: !1,
+      icon: "filter",
+      indicator: !1,
+      label: this._translations.filters,
+      func: () => this._toggleFilter(),
+      disabled: !1
+    }), i.push({
+      active: !1,
+      icon: "refresh",
+      indicator: !1,
+      label: this._translations.refresh,
+      func: () => this.selectedLayer?.refresh(),
+      disabled: !1
+    }), i.push({
+      active: !1,
+      icon: "erase",
+      indicator: !1,
+      label: this._translations.clearSelection,
+      func: () => this.clearSelection.emit(),
+      disabled: !e
+    }), this._toolInfos = i;
   }
   /**
    * Update actions active prop based on a stored value
@@ -363,7 +358,7 @@ class v extends w {
     return `solutions-action-${e}`;
   }
 }
-f("map-card", v);
+f("map-card", S);
 export {
-  v as MapCard
+  S as MapCard
 };

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

@@ -1,8 +1,8 @@
 /// <reference types="@arcgis/core/interfaces.d.ts" />
 /// <reference types="../../index.d.ts" />
-import { EDrawMode, ESelectionType, ISketchGraphicsChange } from '../../utils/interfaces';
+import { ESelectionType, ISketchGraphicsChange, EDrawMode } from '../../utils/interfaces';
 import { PropertyValues } from 'lit';
-import { PublicLitElement as LitElement, JsxNode, TargetedEvent } from '@arcgis/lumina';
+import { PublicLitElement as LitElement, TargetedEvent, JsxNode } from '@arcgis/lumina';
 
 export declare class MapDrawTools extends LitElement {
     /** boolean: sketch is used by multiple components...need a way to know who should respond... */
@@ -18,8 +18,6 @@ export declare class MapDrawTools extends LitElement {
     editGraphicsEnabled: boolean;
     /** esri/Graphic: https://developers.arcgis.com/javascript/latest/api-reference/esri-Graphic.html */
     graphics: __esri.Graphic[];
-    /** string: Locale to use for translation of stings in the UI */
-    locale: string;
     /** esri/views/View: https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html */
     mapView: __esri.MapView | undefined;
     /** esri/symbols/SimpleMarkerSymbol: https://developers.arcgis.com/javascript/latest/api-reference/esri-symbols-SimpleMarkerSymbol.html */

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.20250425.2 */
+v1.0.0-next.20250429 */
 const w = k`@layer{/** @license
  * Copyright 2025 Esri
  *
@@ -27,10 +27,10 @@ const w = k`@layer{/** @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 _ extends f {
   constructor() {
-    super(...arguments), this.active = !1, this.drawMode = s.SKETCH, this.editGraphicsEnabled = !0, this.graphics = [], this.locale = "", this.redoEnabled = !1, this.undoEnabled = !1, this._translations = n({ name: "map-draw-tools", blocking: !0 }), this._sketchElement = g(), this.selectionLoadingChange = h(), this.sketchGraphicsChange = h(), this.drawUndo = h(), this.drawRedo = h();
+    super(...arguments), this.active = !1, this.drawMode = s.SKETCH, this.editGraphicsEnabled = !0, this.graphics = [], this.redoEnabled = !1, this.undoEnabled = !1, this._translations = n({ name: "map-draw-tools", blocking: !0 }), this._sketchElement = g(), this.selectionLoadingChange = h(), this.sketchGraphicsChange = h(), this.drawUndo = h(), this.drawRedo = h();
   }
   static {
-    this.properties = { active: 5, drawMode: 0, editGraphicsEnabled: 5, graphics: 0, locale: 1, mapView: 0, pointSymbol: 0, polylineSymbol: 0, polygonSymbol: 0, redoEnabled: 5, undoEnabled: 5, _translations: 16, _selectionMode: 16 };
+    this.properties = { active: 5, drawMode: 0, editGraphicsEnabled: 5, graphics: 0, mapView: 0, pointSymbol: 0, polylineSymbol: 0, polygonSymbol: 0, redoEnabled: 5, undoEnabled: 5, _translations: 16, _selectionMode: 16 };
   }
   static {
     this.styles = w;
@@ -40,7 +40,7 @@ class _ extends f {
   }
   /** TODO: [MIGRATION] Consider inlining some of the watch functions called inside of this method to reduce boilerplate code */
   willUpdate(e) {
-    e.has("graphics") && this.graphicsWatchHandler(this.graphics, e.get("graphics")), e.has("locale") && this.localeWatchHandler(), e.has("mapView") && this.mapView && this.mapViewWatchHandler(this.mapView, e.get("mapView"));
+    e.has("graphics") && this.graphicsWatchHandler(this.graphics, e.get("graphics")), e.has("mapView") && this.mapView && this.mapViewWatchHandler(this.mapView, e.get("mapView"));
   }
   //--------------------------------------------------------------------------
   //
@@ -51,10 +51,6 @@ class _ extends f {
   graphicsWatchHandler(e, t) {
     e && e.length > 0 && JSON.stringify(e) !== JSON.stringify(t) && this._sketchGraphicsLayer && (this._updateGraphicsSymbols(e), this._sketchGraphicsLayer.removeAll(), this._sketchGraphicsLayer.addMany(e));
   }
-  /** Fetch translations when the locale is updated */
-  async localeWatchHandler() {
-    this.el.lang = this.locale;
-  }
   /** Called each time the mapView prop is changed. */
   mapViewWatchHandler(e, t) {
     e && e !== t && this._init();
@@ -103,7 +99,7 @@ class _ extends f {
   /** Renders the component. */
   render() {
     const e = this.drawMode === s.SKETCH ? "border" : "border esri-widget esri-sketch__panel", t = this.drawMode === s.SKETCH ? "display-none" : "esri-widget esri-sketch__panel border-left esri-sketch__section";
-    return p`<div class=${o(e)}><div ${m(this._sketchElement)}></div><div class=${o(t)}><calcite-action .disabled=${!this.undoEnabled} icon=undo @click=${() => this._undo()} scale=s .text=${this._translations.undo || ""}></calcite-action><calcite-action .disabled=${!this.redoEnabled} icon=redo @click=${() => this._redo()} scale=s .text=${this._translations.redo || ""}></calcite-action></div></div>`;
+    return p`<div class=${o(e)}><div ${m(this._sketchElement)}></div><div class=${o(t)}><calcite-action .disabled=${!this.undoEnabled} icon=undo @click=${() => this._undo()} scale=s .text=${this._translations.undo}></calcite-action><calcite-action .disabled=${!this.redoEnabled} icon=redo @click=${() => this._redo()} scale=s .text=${this._translations.redo}></calcite-action></div></div>`;
   }
   //--------------------------------------------------------------------------
   //
@@ -139,7 +135,7 @@ class _ extends f {
    * @protected
    */
   _initGraphicsLayer() {
-    const e = this._translations.sketchLayer || "";
+    const e = this._translations.sketchLayer;
     if (this.mapView) {
       const t = this.mapView.map.layers.findIndex((i) => i.title === e);
       t > -1 ? this._sketchGraphicsLayer = this.mapView.map.layers.getItemAt(t) : (this._sketchGraphicsLayer = this.GraphicsLayer && new this.GraphicsLayer({ title: e, listMode: "hide" }), this._sketchGraphicsLayer && (d.managedLayers[e] = "sketch", this.mapView.map.layers.add(this._sketchGraphicsLayer))), this.graphics && this.graphics.length > 0 && this._sketchGraphicsLayer && this._sketchGraphicsLayer.addMany(this.graphics);