@esri/solutions-components 0.6.11 → 0.6.13

package/dist/components/layer-table2.js

@@ -7,7 +7,7 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/
 import { l as loadModules } from './loadModules.js';
 import { g as getLocaleComponentStrings } from './locale.js';
 import { a as getMapLayerIds, g as getLayer, b as goToSelection } from './mapViewUtils.js';
-import { q as queryFeaturesByID, b as queryAllIds } from './queryUtils.js';
+import { b as queryAllIds, q as queryFeaturesByID } from './queryUtils.js';
 import { d as downloadCSV } from './downloadUtils.js';
 import { d as defineCustomElement$n } from './action.js';
 import { d as defineCustomElement$m } from './action-bar.js';
@@ -22,8 +22,8 @@ import { d as defineCustomElement$e } from './dropdown.js';
 import { d as defineCustomElement$d } from './dropdown-group.js';
 import { d as defineCustomElement$c } from './dropdown-item.js';
 import { d as defineCustomElement$b } from './icon.js';
-import { d as defineCustomElement$a } from './link.js';
-import { d as defineCustomElement$9 } from './loader.js';
+import { d as defineCustomElement$a } from './loader.js';
+import { d as defineCustomElement$9 } from './modal.js';
 import { d as defineCustomElement$8 } from './option.js';
 import { d as defineCustomElement$7 } from './panel.js';
 import { d as defineCustomElement$6 } from './popover.js';
@@ -33,7 +33,7 @@ import { d as defineCustomElement$3 } from './shell.js';
 import { d as defineCustomElement$2 } from './tooltip.js';
 import { d as defineCustomElement$1 } from './map-layer-picker2.js';
 
-const layerTableCss = ":host{display:block}.height-full{height:100%}.width-full{width:100%}.display-flex{display:flex}.table-border{border:1px solid var(--calcite-ui-border-2)}.border-end{border-inline-end:1px solid var(--calcite-ui-border-2)}.padding-5{padding:5px}.height-51{height:51px}.bottom-left{position:absolute;left:0;bottom:0}html[dir=\"rtl\"] .bottom-left{position:absolute;right:0;bottom:0}.background{background-color:var(--calcite-ui-background)}.text-color{color:var(--calcite-ui-text-1)}";
+const layerTableCss = ":host{display:block}.height-full{height:100%}.width-full{width:100%}.display-flex{display:flex}.table-border{border:1px solid var(--calcite-ui-border-2)}.border-end{border-inline-end:1px solid var(--calcite-ui-border-2)}.padding-5{padding:5px}.padding-end-1{padding-inline-end:1rem}.height-51{height:51px}.bottom-left{position:absolute;left:0;bottom:0}html[dir=\"rtl\"] .bottom-left{position:absolute;right:0;bottom:0}.background{background-color:var(--calcite-ui-background)}.text-color{color:var(--calcite-ui-text-1)}.align-center{align-items:center}.danger-color{color:var(--calcite-ui-danger)}";
 
 const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTMLElement {
   constructor() {
@@ -59,12 +59,15 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
     this.onTableNodeCreate = (node) => {
       this._tableNode = node;
     };
+    this.enableAutoRefresh = undefined;
+    this.enableInlineEdit = undefined;
     this.mapInfo = undefined;
     this.mapView = undefined;
     this.showNewestFirst = undefined;
     this.zoomAndScrollToSelected = undefined;
     this._alertOpen = false;
     this._fetchingData = false;
+    this._isDeleting = false;
     this._layer = undefined;
     this._selectedIndexes = [];
     this._showOnlySelected = false;
@@ -166,12 +169,11 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
     }
     const tableNodeClass = this._fetchingData ? "display-none" : "";
     const loadingClass = this._fetchingData ? "" : "display-none";
-    const alertActionClass = this._alertShowAction ? "" : "display-none";
     const total = this._allIds.length.toString();
     const selected = this._selectedIndexes.length.toString();
     return (h(Host, null, h("calcite-shell", null, this._getTableControlRow("header"), h("div", { class: "height-full width-full" }, h("calcite-panel", { class: "height-full width-full" }, h("calcite-loader", { class: loadingClass, label: this._translations.fetchingData, scale: "l" }), h("div", { class: tableNodeClass, ref: this.onTableNodeCreate })), h("div", { class: "bottom-left background text-color" }, this._translations.recordsSelected
       .replace("{{total}}", total)
-      .replace("{{selected}}", selected))), h("calcite-alert", { icon: this._alertIcon, kind: this._alertKind, label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { slot: "title" }, this._alertTitle), h("div", { slot: "message" }, this._alertMessage), h("calcite-link", { class: alertActionClass, onClick: this._alertActionFunction, slot: "link" }, this._alertActionText)))));
+      .replace("{{selected}}", selected))), this._getEditDisabledWarning()), this._deleteMessage()));
   }
   //--------------------------------------------------------------------------
   //
@@ -203,7 +205,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
   _getTableControlRow(slot) {
     const featuresSelected = this._selectedIndexes.length > 0;
     return (h("div", { class: "display-flex table-border height-51", slot: slot }, h("calcite-action-bar", { expandDisabled: true, expanded: true, layout: "horizontal" }, h("div", { class: "border-end" }, h("map-layer-picker", { appearance: "transparent", mapView: this.mapView, onLayerSelectionChange: (evt) => this._layerSelectionChanged(evt), placeholderIcon: "layers", scale: "l", type: "dropdown" })), h("calcite-action", { appearance: "solid", disabled: !featuresSelected, icon: "magnifying-glass", id: "magnifying-glass", label: this._translations.zoom, onClick: () => this._zoom(), text: this._translations.zoom, textEnabled: true }), h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "magnifying-glass" }, h("span", null, this._translations.zoom)), h("calcite-action", { appearance: "solid", icon: "filter", id: "filter", onClick: () => this._filter(), text: this._translations.filters, "text-enabled": "true", textEnabled: true }), h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "filter" }, h("span", null, this._translations.filters)), h("calcite-action", { appearance: "solid", disabled: !featuresSelected, id: "trash", onClick: () => this._delete(), text: "" }, h("calcite-button", { appearance: "transparent", iconStart: "trash", kind: "danger" }, this._translations.delete)), h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "trash" }, h("span", null, this._translations.delete)), h("calcite-action", { appearance: "solid", disabled: !featuresSelected, icon: "erase", id: "erase", onClick: () => this._clearSelection(), text: this._translations.clearSelection, "text-enabled": "true", textEnabled: true }), h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "erase" }, h("span", null, this._translations.clearSelection))), h("calcite-dropdown", null, h("calcite-action", { appearance: "solid", label: "", slot: "trigger", text: "" }, h("calcite-button", { appearance: "transparent", iconEnd: "chevron-down", kind: "neutral" }, this._translations.more)), h("calcite-dropdown-group", { "selection-mode": "none" }, h("calcite-dropdown-item", { iconStart: "list-check-all", onClick: () => this._selectAll() }, this._translations.selectAll), h("calcite-dropdown-item", { iconStart: "selected-items-filter", onClick: () => this._toggleShowSelected() }, this._showOnlySelected ? this._translations.showAll :
-      this._translations.showSelected), h("calcite-dropdown-item", { iconStart: "refresh", onClick: () => this._switchSelected() }, this._translations.switchSelected), h("calcite-dropdown-item", { iconStart: "refresh", onClick: () => this._refresh() }, this._translations.refresh), h("calcite-dropdown-item", { iconStart: "export", onClick: () => void this._exportToCSV() }, this._translations.exportCSV)))));
+      this._translations.showSelected), h("calcite-dropdown-item", { iconStart: "compare", onClick: () => this._switchSelected() }, this._translations.switchSelected), h("calcite-dropdown-item", { iconStart: "refresh", onClick: () => this._refresh() }, this._translations.refresh), h("calcite-dropdown-item", { iconStart: "export", onClick: () => void this._exportToCSV() }, this._translations.exportCSV)))));
   }
   /**
    * Initialize the FeatureTable
@@ -216,9 +218,10 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
     if (this._layer) {
       await this._layer.when(async () => {
         this._table = new this.FeatureTable({
+          autoRefreshEnabled: this.enableAutoRefresh,
           layer: this._layer,
           view: this.mapView,
-          //editingEnabled: this._editEnabled,
+          editingEnabled: this._editEnabled && this.enableInlineEdit,
           highlightEnabled: true,
           multiSortEnabled: false,
           visibleElements: {
@@ -230,6 +233,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
           },
           container: node
         });
+        this._checkEditEnabled();
         await this._table.when(async () => {
           this._table.highlightIds.on("change", () => {
             this._selectedIndexes = this._table.highlightIds.toArray();
@@ -265,7 +269,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
       const columnTemplates = this._getColumnTemplates(this._layer.id);
       this._table.layer = this._layer;
       this._table.tableTemplate.columnTemplates = columnTemplates;
-      this._editEnabled = this._layer.editingEnabled;
+      this._checkEditEnabled();
       this._table.view = this.mapView;
       this._table.editingEnabled = this._editEnabled;
       this._table.clearSelectionFilter();
@@ -274,6 +278,15 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
       await this._sortTable();
     }
   }
+  /**
+   * Verify edit capabilities of the layer
+   *
+   * @returns void
+   */
+  _checkEditEnabled() {
+    this._editEnabled = this._layer.editingEnabled && this._layer.capabilities.operations.supportsUpdate;
+    this._deleteEnabled = this._layer.editingEnabled && this._layer.capabilities.operations.supportsDelete;
+  }
   /**
    * Sort the objectid field in descending order
    *
@@ -292,6 +305,40 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
       }
     }
   }
+  /**
+   * Show warning when editing is disabled
+   *
+   * @returns node with warning message
+   */
+  _getEditDisabledWarning() {
+    return (h("calcite-alert", { icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen && !this._confirmDelete, placement: "top" }, h("div", { slot: "title" }, this._translations.deleteDisabled), h("div", { slot: "message" }, this._translations.enableEditing)));
+  }
+  /**
+   * Show delete confirmation message
+   *
+   * @returns node to confirm or deny the delete operation
+   */
+  _deleteMessage() {
+    return (h("calcite-modal", { "aria-labelledby": "modal-title", kind: "danger", open: this._confirmDelete }, h("div", { class: "display-flex align-center", id: "modal-title", slot: "header" }, h("calcite-icon", { "aria-hidden": "true", class: "padding-end-1 danger-color", icon: "exclamation-mark-triangle", scale: "m" }), this._translations.deleteFeature), h("div", { slot: "content" }, this._translations.confirm), h("calcite-button", { appearance: "outline", kind: "danger", onClick: () => this._alertClosed(), slot: "secondary", width: "full" }, this._translations.cancel), h("calcite-button", { kind: "danger", loading: this._isDeleting, onClick: () => void this._deleteFeatures(), slot: "primary", width: "full" }, this._translations.delete)));
+  }
+  /**
+   * Delete the currently selected features
+   *
+   * @returns void
+   */
+  async _deleteFeatures() {
+    this._isDeleting = true;
+    const deleteFeatures = this._table.highlightIds.toArray().map((objectId) => {
+      return { objectId };
+    });
+    await this._layer.applyEdits({
+      deleteFeatures
+    });
+    await this._table.refresh();
+    this._allIds = await queryAllIds(this._layer);
+    this._isDeleting = false;
+    this._alertClosed();
+  }
   /**
    * Handle map click events to keep table and map click selection in sync
    *
@@ -327,6 +374,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
    */
   _alertClosed() {
     this._alertOpen = false;
+    this._confirmDelete = false;
   }
   /**
    * Select or deselect all rows
@@ -396,11 +444,13 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
     const exportInfos = {};
     const ids = this._table.highlightIds.toArray();
     exportInfos[this._layer.id] = {
-      selectionSetNames: [],
+      selectionSetNames: [this._layer.title],
       ids,
       layer: this._layer
     };
-    void downloadCSV(exportInfos, false, // formatUsingLayerPopup
+    void downloadCSV(null, //???
+    exportInfos, false, // formatUsingLayerPopup
+    false, // removeDuplicates
     true);
   }
   /**
@@ -426,25 +476,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
    */
   _delete() {
     if (this._editEnabled) {
-      this._alertIcon = "trash";
-      this._alertTitle = this._translations.deleteRows;
-      this._alertActionText = this._translations.delete;
-      this._alertShowAction = true;
-      this._alertMessage = this._translations.confirm;
-      this._alertKind = "danger";
-      this._alertActionFunction = () => {
-        void this._layer.applyEdits({
-          deleteFeatures: this._table.highlightIds.toArray()
-        });
-        this._alertOpen = false;
-      };
-    }
-    else {
-      this._alertIcon = "layer-broken";
-      this._alertTitle = this._translations.deleteDisabled;
-      this._alertShowAction = false;
-      this._alertMessage = this._translations.enableEditing;
-      this._alertKind = "warning";
+      this._confirmDelete = true;
     }
     this._alertOpen = true;
   }
@@ -525,12 +557,15 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
   }; }
   static get style() { return layerTableCss; }
 }, [0, "layer-table", {
+    "enableAutoRefresh": [4, "enable-auto-refresh"],
+    "enableInlineEdit": [4, "enable-inline-edit"],
     "mapInfo": [16],
     "mapView": [16],
     "showNewestFirst": [4, "show-newest-first"],
     "zoomAndScrollToSelected": [4, "zoom-and-scroll-to-selected"],
     "_alertOpen": [32],
     "_fetchingData": [32],
+    "_isDeleting": [32],
     "_layer": [32],
     "_selectedIndexes": [32],
     "_showOnlySelected": [32],
@@ -542,7 +577,7 @@ function defineCustomElement() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["layer-table", "calcite-action", "calcite-action-bar", "calcite-action-group", "calcite-action-menu", "calcite-alert", "calcite-button", "calcite-chip", "calcite-combobox", "calcite-combobox-item", "calcite-dropdown", "calcite-dropdown-group", "calcite-dropdown-item", "calcite-icon", "calcite-link", "calcite-loader", "calcite-option", "calcite-panel", "calcite-popover", "calcite-scrim", "calcite-select", "calcite-shell", "calcite-tooltip", "map-layer-picker"];
+  const components = ["layer-table", "calcite-action", "calcite-action-bar", "calcite-action-group", "calcite-action-menu", "calcite-alert", "calcite-button", "calcite-chip", "calcite-combobox", "calcite-combobox-item", "calcite-dropdown", "calcite-dropdown-group", "calcite-dropdown-item", "calcite-icon", "calcite-loader", "calcite-modal", "calcite-option", "calcite-panel", "calcite-popover", "calcite-scrim", "calcite-select", "calcite-shell", "calcite-tooltip", "map-layer-picker"];
   components.forEach(tagName => { switch (tagName) {
     case "layer-table":
       if (!customElements.get(tagName)) {
@@ -614,12 +649,12 @@ function defineCustomElement() {
         defineCustomElement$b();
       }
       break;
-    case "calcite-link":
+    case "calcite-loader":
       if (!customElements.get(tagName)) {
         defineCustomElement$a();
       }
       break;
-    case "calcite-loader":
+    case "calcite-modal":
       if (!customElements.get(tagName)) {
         defineCustomElement$9();
       }

package/dist/components/map-card2.js

@@ -5,30 +5,31 @@
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { l as loadModules } from './loadModules.js';
-import { d as defineCustomElement$m } from './basemap-gallery2.js';
-import { d as defineCustomElement$l } from './action.js';
-import { d as defineCustomElement$k } from './action-bar.js';
-import { d as defineCustomElement$j } from './action-group.js';
-import { d as defineCustomElement$i } from './action-menu.js';
-import { d as defineCustomElement$h } from './button.js';
-import { d as defineCustomElement$g } from './filter2.js';
-import { d as defineCustomElement$f } from './handle.js';
-import { d as defineCustomElement$e } from './icon.js';
-import { d as defineCustomElement$d } from './input.js';
-import { d as defineCustomElement$c } from './list.js';
-import { d as defineCustomElement$b } from './list-item2.js';
-import { d as defineCustomElement$a } from './loader.js';
-import { d as defineCustomElement$9 } from './popover.js';
-import { d as defineCustomElement$8 } from './progress.js';
-import { d as defineCustomElement$7 } from './scrim.js';
-import { d as defineCustomElement$6 } from './stack.js';
-import { d as defineCustomElement$5 } from './tooltip.js';
+import { d as defineCustomElement$n } from './basemap-gallery2.js';
+import { d as defineCustomElement$m } from './action.js';
+import { d as defineCustomElement$l } from './action-bar.js';
+import { d as defineCustomElement$k } from './action-group.js';
+import { d as defineCustomElement$j } from './action-menu.js';
+import { d as defineCustomElement$i } from './button.js';
+import { d as defineCustomElement$h } from './filter2.js';
+import { d as defineCustomElement$g } from './handle.js';
+import { d as defineCustomElement$f } from './icon.js';
+import { d as defineCustomElement$e } from './input.js';
+import { d as defineCustomElement$d } from './list.js';
+import { d as defineCustomElement$c } from './list-item2.js';
+import { d as defineCustomElement$b } from './loader.js';
+import { d as defineCustomElement$a } from './popover.js';
+import { d as defineCustomElement$9 } from './progress.js';
+import { d as defineCustomElement$8 } from './scrim.js';
+import { d as defineCustomElement$7 } from './stack.js';
+import { d as defineCustomElement$6 } from './tooltip.js';
+import { d as defineCustomElement$5 } from './map-fullscreen2.js';
 import { d as defineCustomElement$4 } from './map-legend2.js';
 import { d as defineCustomElement$3 } from './map-picker2.js';
 import { d as defineCustomElement$2 } from './map-search2.js';
 import { d as defineCustomElement$1 } from './map-tools2.js';
 
-const mapCardCss = ":host{display:block;--calcite-label-margin-bottom:0;--calcite-block-padding:0}.map-height{height:calc(100% - 58px)}";
+const mapCardCss = ":host{display:block;--calcite-label-margin-bottom:0;--calcite-block-padding:0}.map-height{height:calc(100% - 58px)}.box-shadow{box-shadow:none !important}";
 
 const MapCard = /*@__PURE__*/ proxyCustomElement(class MapCard extends HTMLElement {
   constructor() {
@@ -65,7 +66,7 @@ const MapCard = /*@__PURE__*/ proxyCustomElement(class MapCard extends HTMLEleme
    * Renders the component.
    */
   render() {
-    return (h(Host, null, h("map-picker", { mapInfos: this.mapInfos }), h("div", { class: "map-height", ref: (el) => (this._mapDiv = el) }), h("map-tools", { mapView: this.mapView, ref: (el) => this._mapTools = el, searchConfiguration: this._searchConfiguration })));
+    return (h(Host, null, h("map-picker", { mapInfos: this.mapInfos }), h("div", { class: "map-height", ref: (el) => (this._mapDiv = el) }), h("map-tools", { class: "box-shadow", mapView: this.mapView, ref: (el) => this._mapTools = el, searchConfiguration: this._searchConfiguration })));
   }
   //--------------------------------------------------------------------------
   //
@@ -140,7 +141,7 @@ function defineCustomElement() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["map-card", "basemap-gallery", "calcite-action", "calcite-action-bar", "calcite-action-group", "calcite-action-menu", "calcite-button", "calcite-filter", "calcite-handle", "calcite-icon", "calcite-input", "calcite-list", "calcite-list-item", "calcite-loader", "calcite-popover", "calcite-progress", "calcite-scrim", "calcite-stack", "calcite-tooltip", "map-legend", "map-picker", "map-search", "map-tools"];
+  const components = ["map-card", "basemap-gallery", "calcite-action", "calcite-action-bar", "calcite-action-group", "calcite-action-menu", "calcite-button", "calcite-filter", "calcite-handle", "calcite-icon", "calcite-input", "calcite-list", "calcite-list-item", "calcite-loader", "calcite-popover", "calcite-progress", "calcite-scrim", "calcite-stack", "calcite-tooltip", "map-fullscreen", "map-legend", "map-picker", "map-search", "map-tools"];
   components.forEach(tagName => { switch (tagName) {
     case "map-card":
       if (!customElements.get(tagName)) {
@@ -149,90 +150,95 @@ function defineCustomElement() {
       break;
     case "basemap-gallery":
       if (!customElements.get(tagName)) {
-        defineCustomElement$m();
+        defineCustomElement$n();
       }
       break;
     case "calcite-action":
       if (!customElements.get(tagName)) {
-        defineCustomElement$l();
+        defineCustomElement$m();
       }
       break;
     case "calcite-action-bar":
       if (!customElements.get(tagName)) {
-        defineCustomElement$k();
+        defineCustomElement$l();
       }
       break;
     case "calcite-action-group":
       if (!customElements.get(tagName)) {
-        defineCustomElement$j();
+        defineCustomElement$k();
       }
       break;
     case "calcite-action-menu":
       if (!customElements.get(tagName)) {
-        defineCustomElement$i();
+        defineCustomElement$j();
       }
       break;
     case "calcite-button":
       if (!customElements.get(tagName)) {
-        defineCustomElement$h();
+        defineCustomElement$i();
       }
       break;
     case "calcite-filter":
       if (!customElements.get(tagName)) {
-        defineCustomElement$g();
+        defineCustomElement$h();
       }
       break;
     case "calcite-handle":
       if (!customElements.get(tagName)) {
-        defineCustomElement$f();
+        defineCustomElement$g();
       }
       break;
     case "calcite-icon":
       if (!customElements.get(tagName)) {
-        defineCustomElement$e();
+        defineCustomElement$f();
       }
       break;
     case "calcite-input":
       if (!customElements.get(tagName)) {
-        defineCustomElement$d();
+        defineCustomElement$e();
       }
       break;
     case "calcite-list":
       if (!customElements.get(tagName)) {
-        defineCustomElement$c();
+        defineCustomElement$d();
       }
       break;
     case "calcite-list-item":
       if (!customElements.get(tagName)) {
-        defineCustomElement$b();
+        defineCustomElement$c();
       }
       break;
     case "calcite-loader":
       if (!customElements.get(tagName)) {
-        defineCustomElement$a();
+        defineCustomElement$b();
       }
       break;
     case "calcite-popover":
       if (!customElements.get(tagName)) {
-        defineCustomElement$9();
+        defineCustomElement$a();
       }
       break;
     case "calcite-progress":
       if (!customElements.get(tagName)) {
-        defineCustomElement$8();
+        defineCustomElement$9();
       }
       break;
     case "calcite-scrim":
       if (!customElements.get(tagName)) {
-        defineCustomElement$7();
+        defineCustomElement$8();
       }
       break;
     case "calcite-stack":
       if (!customElements.get(tagName)) {
-        defineCustomElement$6();
+        defineCustomElement$7();
       }
       break;
     case "calcite-tooltip":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$6();
+      }
+      break;
+    case "map-fullscreen":
       if (!customElements.get(tagName)) {
         defineCustomElement$5();
       }

package/dist/components/map-draw-tools2.js

@@ -4,7 +4,7 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { c as EDrawMode } from './interfaces.js';
+import { b as EDrawMode } from './interfaces.js';
 import { l as loadModules } from './loadModules.js';
 import { s as state } from './publicNotificationStore.js';
 import { g as getLocaleComponentStrings } from './locale.js';

package/dist/components/map-fullscreen.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface MapFullscreen extends Components.MapFullscreen, HTMLElement {}
+export const MapFullscreen: {
+  prototype: MapFullscreen;
+  new (): MapFullscreen;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/map-fullscreen.js

@@ -0,0 +1,11 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+import { M as MapFullscreen$1, d as defineCustomElement$1 } from './map-fullscreen2.js';
+
+const MapFullscreen = MapFullscreen$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { MapFullscreen, defineCustomElement };

package/dist/components/map-fullscreen2.js

@@ -0,0 +1,130 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { l as loadModules } from './loadModules.js';
+
+const mapFullscreenCss = ":host{display:block}";
+
+const MapFullscreen = /*@__PURE__*/ proxyCustomElement(class MapFullscreen extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.mapView = undefined;
+    this.fullscreenWidget = undefined;
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Watch handlers
+  //
+  //--------------------------------------------------------------------------
+  /**
+   * Called each time the mapView prop is changed.
+   *
+   * @returns Promise when complete
+   */
+  async mapViewWatchHandler() {
+    await this.mapView.when(() => {
+      this._initFullscreenWidget();
+    });
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Methods (public)
+  //
+  //--------------------------------------------------------------------------
+  //--------------------------------------------------------------------------
+  //
+  //  Events (public)
+  //
+  //--------------------------------------------------------------------------
+  //--------------------------------------------------------------------------
+  //
+  //  Functions (lifecycle)
+  //
+  //--------------------------------------------------------------------------
+  /**
+   * StencilJS: Called once just after the component is first connected to the DOM.
+   */
+  async componentWillLoad() {
+    await this._initModules();
+  }
+  /**
+   * Renders the component.
+   */
+  render() {
+    return (h(Host, null, h("div", { class: "fullscreen-widget", ref: (el) => { this._fullscreenElement = el; } })));
+  }
+  /**
+   * StencilJS: Called just after the component updates.
+   * It's never called during the first render().
+   */
+  async componentDidUpdate() {
+    this._initFullscreenWidget();
+  }
+  /**
+   * StencilJS: Called once just after the component is fully loaded and the first render() occurs.
+   */
+  async componentDidLoad() {
+    this._initFullscreenWidget();
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Functions (protected)
+  //
+  //--------------------------------------------------------------------------
+  /**
+   * Load esri javascript api modules
+   *
+   * @returns Promise resolving when function is done
+   *
+   * @protected
+   */
+  async _initModules() {
+    const [Fullscreen] = await loadModules([
+      "esri/widgets/Fullscreen"
+    ]);
+    this.Fullscreen = Fullscreen;
+  }
+  /**
+   * Initialize the search widget
+   *
+   * @protected
+   */
+  _initFullscreenWidget() {
+    if (this.mapView && this._fullscreenElement && !this.fullscreenWidget) {
+      this.fullscreenWidget = new this.Fullscreen({
+        view: this.mapView
+      });
+    }
+    else if (this.fullscreenWidget) {
+      this.fullscreenWidget.view = this.mapView;
+    }
+  }
+  static get watchers() { return {
+    "mapView": ["mapViewWatchHandler"]
+  }; }
+  static get style() { return mapFullscreenCss; }
+}, [1, "map-fullscreen", {
+    "mapView": [16],
+    "fullscreenWidget": [16]
+  }]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["map-fullscreen"];
+  components.forEach(tagName => { switch (tagName) {
+    case "map-fullscreen":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, MapFullscreen);
+      }
+      break;
+  } });
+}
+defineCustomElement();
+
+export { MapFullscreen as M, defineCustomElement as d };

package/dist/components/map-select-tools2.js

@@ -191,7 +191,13 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
    * StencilJS: Called once just after the component is fully loaded and the first render() occurs.
    */
   async componentDidLoad() {
-    return this._init();
+    await this._init();
+    await this._searchWidget.when(() => {
+      this._searchWidget.allPlaceholder = this._translations.placeholder;
+      this._searchWidget.defaultSources.forEach(s => {
+        s.placeholder = this._translations.placeholder;
+      });
+    });
   }
   /**
    * Renders the component.