@esri/solutions-components 0.10.16 → 0.10.18

package/dist/collection/components/layer-list/layer-list.js

@@ -104,9 +104,9 @@ export class LayerList {
      * Renders the component.
      */
     render() {
-        return (h(Fragment, { key: '19f68b9a5d0b6c85832544e4281e1c4a1707ba86' }, this._isLoading && h("calcite-loader", { key: 'c908f311165f8f520f267a0dcde0bd954863ba6b', label: "", scale: "m" }), !this._isLoading && this.mapView && this._noLayersToDisplay &&
-            h("calcite-notice", { key: '56dfb252f998333ed6a671cccddd5683f08ad63d', class: "error-msg", icon: "layers-reference", kind: "danger", open: true }, h("div", { key: 'a27ad45ac2b1984152af5a80da36583f7c375be6', slot: "title" }, this._translations.error), h("div", { key: 'a9466cb560b6ee2c72ebd18130ce21371f9e7cdf', slot: "message" }, this._translations.noLayerToDisplayErrorMsg)), !this._isLoading && this.mapView &&
-            h("calcite-list", { key: '40e54ba92d2f48a97dd0987808f4b7fdefd266bb', "selection-appearance": "border", "selection-mode": "none" }, this.renderLayerList())));
+        return (h(Fragment, { key: '96f61a2b92d352cdc341961c54b9fdfb06bab6fc' }, this._isLoading && h("calcite-loader", { key: '948c5a101fe19294dbc99a5d015c4f08c3db7f24', label: "", scale: "m" }), !this._isLoading && this.mapView && this._noLayersToDisplay &&
+            h("calcite-notice", { key: '23a73833e78b0c0009453ecfbf9bc000f2f7ff33', class: "error-msg", icon: "layers-reference", kind: "danger", open: true }, h("div", { key: 'da338486c22d7d70499713e22d45bd343c752e38', slot: "title" }, this._translations.error), h("div", { key: '751c99a20af04f7253a518181d02a353e7f1b6b8', slot: "message" }, this._translations.noLayerToDisplayErrorMsg)), !this._isLoading && this.mapView &&
+            h("calcite-list", { key: '09c24ccb0ce715bc0606302af41571b5594e64b5', "selection-appearance": "border", "selection-mode": "none" }, this.renderLayerList())));
     }
     //--------------------------------------------------------------------------
     //

package/dist/collection/components/layer-table/layer-table.css

@@ -54,7 +54,7 @@
   padding-inline-end: 1rem;
 }
 
-.height-51 {
+.height-51-px {
   height: 51px;
 }
 
@@ -138,4 +138,4 @@ html[dir="rtl"] .share-action {
 
 .esri-feature-table__table-container {
   height: 100%;
-}
+}

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

@@ -59,6 +59,8 @@ export class LayerTable {
         this._showOnlySelected = false;
         this._toolInfos = undefined;
         this._translations = undefined;
+        this._fullTextSearchInfo = undefined;
+        this._searchPlaceHolder = '';
     }
     //--------------------------------------------------------------------------
     //
@@ -223,6 +225,10 @@ export class LayerTable {
      * IToolSizeInfo[]: Id and Width for the current tools
      */
     _toolbarSizeInfos;
+    /**
+     * string the current search expression
+     */
+    _searchExpression;
     //--------------------------------------------------------------------------
     //
     //  Watch handlers
@@ -319,6 +325,7 @@ export class LayerTable {
         }
         if (this.mapView) {
             this._floorExpression = undefined;
+            this._searchExpression = undefined;
             this._updateShareUrl();
             this._mapClickHandle = this.reactiveUtils.on(() => this.mapView, "click", (event) => {
                 void this._mapClicked(event);
@@ -365,13 +372,13 @@ export class LayerTable {
      * Reset the filter
      */
     async filterReset() {
-        void this._handleFilterListReset();
+        await this._handleFilterListReset();
     }
     /**
      * Updates the filter
      */
     async filterUpdate() {
-        this._handleFilterUpdate();
+        await this._handleFilterUpdate();
     }
     /**
      * Closes the filter
@@ -383,7 +390,9 @@ export class LayerTable {
      * refresh the feature table
      */
     async refresh() {
-        await this._refresh();
+        if (this._table) {
+            await this._refresh();
+        }
     }
     //--------------------------------------------------------------------------
     //
@@ -430,10 +439,10 @@ export class LayerTable {
         }
     }
     /**
-   * Handles layer selection change to show new table
-   *
-   * @param evt CustomEvent the id for the current layer
-   */
+     * Handles layer selection change to show new table
+     *
+     * @param evt CustomEvent the id for the current layer
+     */
     async layerSelectionChange(evt) {
         await this._layerSelectionChanged(evt);
     }
@@ -503,10 +512,12 @@ export class LayerTable {
         const total = this._allIds.length.toString();
         const selected = this.selectedIds.length.toString();
         const tableHeightClass = this.isMobile ? "height-full" : "height-full-adjusted";
+        const showSearch = this._canShowFullTextSearch();
         this._validateActiveActions();
-        return (h(Host, { key: '388b0c1f6fc251361b3e1d93310c5077a8244f1f' }, h("calcite-shell", { key: 'ed4d6f8b884ecba4dbcd6b747528fd2e83a2717d' }, this._getTableControlRow("header"), h("div", { key: '6d86a54602feda5dad9e9d4097c9b8e3fe80227c', class: `width-full ${tableHeightClass}` }, h("calcite-panel", { key: 'dc4c986af144111acbd21aee82318c90ee920a42', class: "height-full width-full" }, h("calcite-loader", { key: 'd96bbbfa441f9e968fd04e5d17b80c298b690a49', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), h("div", { key: 'afa9e7dea3b195004ef258745b642c05a77ad62d', class: tableNodeClass, ref: this.onTableNodeCreate })), !this.isMobile ? (h("div", { class: "bottom-left text-color height-19" }, this._translations.recordsSelected
+        return (h(Host, { key: '3bdcab95ec86da387ae93e62a0b87856010c6f8c' }, h("calcite-shell", { key: 'cbf48d44ae4d480e904093e320331bdf714ed1cd' }, this._getTableControlRow("header"), h("div", { key: '96a1806648eb3edaecae575088873d1a8e255e0d', class: `width-full ${tableHeightClass}` }, h("calcite-panel", { key: '085137217d77556344bb47e34279e0f16434e268', class: "height-full width-full" }, showSearch &&
+            h("calcite-input", { key: '5defb981e7a5299e9f9d2a17bb9bf2040c68fdc7', clearable: true, icon: "search", onCalciteInputChange: (evt) => void this._searchTextChanged(evt), placeholder: this._searchPlaceHolder, title: this._searchPlaceHolder, type: "search" }), h("calcite-loader", { key: '432073ef427c020b822d804b36213fe969f4754c', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), h("div", { key: '1e987a9ecf5779c901f96abc092ad4944a80a4ab', class: tableNodeClass, ref: this.onTableNodeCreate }))), !this.isMobile ? (h("div", { class: "bottom-left text-color height-19" }, this._translations.recordsSelected
             .replace("{{total}}", total)
-            .replace("{{selected}}", selected))) : undefined)), this.createFilterModal && this._filterModal()));
+            .replace("{{selected}}", selected))) : undefined), this.createFilterModal && this._filterModal()));
     }
     /**
      * Called once after the component is loaded
@@ -548,6 +559,107 @@ export class LayerTable {
         this.reactiveUtils = reactiveUtils;
         this.TableTemplate = TableTemplate;
     }
+    /**
+     * Search using the fullTextSearch on layer and filter the table
+     *
+     * @param event The input change event
+     */
+    async _searchTextChanged(event) {
+        this._fullTextSearchInfo.forEach(searchInfo => {
+            searchInfo.searchTerm = event.target.value;
+        });
+        void this._searchFullText();
+    }
+    /**
+     * Search using the fullTextSearch on layer and filter the table
+     *
+     */
+    async _searchFullText() {
+        //always clear previous search definition
+        if (this._searchExpression) {
+            this._clearSearchDefinitionExpression();
+        }
+        if (this._fullTextSearchInfo.length) {
+            if (this._fullTextSearchInfo[0].searchTerm) {
+                const searchQueryParams = this._layer.createQuery();
+                searchQueryParams.fullText = this._fullTextSearchInfo;
+                const searchedIds = await this._layer.queryObjectIds(searchQueryParams);
+                this._updateSearchDefinitionExpression(searchedIds?.length ? searchedIds : [-1]);
+            }
+        }
+    }
+    /**
+     * Clears the applied search expression on the layer
+     *
+     */
+    _clearSearchDefinitionExpression() {
+        const defExp = this._layer.definitionExpression;
+        //remove previous search expression first
+        if (this._searchExpression && defExp?.indexOf(this._searchExpression) > -1) {
+            // eslint-disable-next-line unicorn/prefer-ternary
+            if (defExp?.indexOf(' AND (' + this._searchExpression) > -1) {
+                this._layer.definitionExpression = defExp.replace(` AND (${this._searchExpression})`, '');
+            }
+            else {
+                this._layer.definitionExpression = defExp.replace(this._searchExpression, '');
+            }
+        }
+        this._searchExpression = undefined;
+    }
+    /**
+     * Update the search expression in layer
+     * @param searchedIds
+     */
+    _updateSearchDefinitionExpression(searchedIds) {
+        const defExp = this._layer.definitionExpression;
+        if (searchedIds?.length) {
+            const searchExp = `objectId in(${searchedIds})`;
+            this._layer.definitionExpression = defExp?.indexOf(this._searchExpression) > -1 ?
+                defExp.replace(this._searchExpression, searchExp) :
+                defExp ? `${defExp} AND (${searchExp})` : searchExp;
+            this._searchExpression = searchExp;
+        }
+        else {
+            this._clearSearchDefinitionExpression();
+        }
+    }
+    /**
+     * Validates if full text search is enabled and and indexes for fullTextSearch available on the layer
+     */
+    _canShowFullTextSearch() {
+        return ((this._layer?.capabilities)?.query)?.supportsFullTextSearch &&
+            this._layer.indexes.items.filter(i => i.indexType == 'FullText').length > 0;
+    }
+    /**
+     * Create list of full text search info
+     */
+    _getFullTextSearchInfo() {
+        this._fullTextSearchInfo = [];
+        //combine all the fullText index
+        if (((this._layer?.capabilities)?.query)?.supportsFullTextSearch) {
+            const fullTextIndexes = this._layer.indexes?.filter(i => i.indexType == 'FullText');
+            if (fullTextIndexes?.length) {
+                //create the search placeholder text
+                const onFields = [];
+                fullTextIndexes.forEach((index) => {
+                    onFields.push(...index.fields.split(','));
+                });
+                //get field alias for fields
+                const fieldAlias = [];
+                onFields.forEach(fieldName => {
+                    //We splitting the fields array so we get leading/trailing spaces, hence trim the fieldName
+                    const fieldInfo = this._layer.getField(fieldName.trim());
+                    fieldAlias.push(fieldInfo.alias);
+                });
+                this._searchPlaceHolder = this._translations.searchPlaceholder.replace("{{fields}}", fieldAlias.join(' | '));
+                this._fullTextSearchInfo.push({
+                    'onFields': ['*'],
+                    'searchTerm': '',
+                    'searchType': 'prefix'
+                });
+            }
+        }
+    }
     /**
      * Update the toolbar when its size changes
      */
@@ -563,7 +675,7 @@ export class LayerTable {
      */
     _getTableControlRow(slot) {
         const id = "more-table-options";
-        return (h("div", { class: "display-flex border-bottom height-51", ref: (el) => this._toolbar = el, slot: slot }, this._getActionBar(), !this.isMobile ? this._getDropdown(id) : undefined, this.enableShare && !this.isMobile ? this._getShare("share") : undefined));
+        return (h("div", { class: "display-flex border-bottom height-51-px", ref: (el) => this._toolbar = el, slot: slot }, this._getActionBar(), !this.isMobile ? this._getDropdown(id) : undefined, this.enableShare && !this.isMobile ? this._getShare("share") : undefined));
     }
     /**
      * Gets a row of controls that can be used for various interactions with the table
@@ -697,7 +809,6 @@ export class LayerTable {
                     func: () => alert(this._translations.editMultiple),
                     disabled: !showMultipleEdits,
                     isOverflow: false,
-                    isSublist: false
                 } : undefined,
                 this._deleteEnabled ? {
                     active: undefined,
@@ -1390,6 +1501,8 @@ export class LayerTable {
     }
     /**
      * Close show/hide dropdown when the user clicks outside of it
+     * @param e clicked event from mouse
+     * @protected
      */
     _handleDocumentClick(e) {
         const id = e.target?.id;
@@ -1421,21 +1534,25 @@ export class LayerTable {
      * Show filter component in modal
      *
      * @returns node to interact with any configured filters for the current layer
+     * @protected
      */
     _filterModal() {
-        return (h("calcite-modal", { "aria-labelledby": "modal-title", class: "modal", kind: "brand", onCalciteModalClose: () => void this._closeFilter(), open: this._filterOpen, widthScale: "s" }, h("div", { class: "display-flex align-center", id: "modal-title", slot: "header" }, this._translations?.filter?.replace("{{title}}", this._layer?.title)), h("div", { slot: "content" }, h("instant-apps-filter-list", { autoUpdateUrl: false, closeBtn: true, closeBtnOnClick: async () => this._closeFilter(), comboboxOverlayPositioning: "fixed", layerExpressions: this._layerExpressions, onFilterListReset: () => this._handleFilterListReset(), onFilterUpdate: () => this._handleFilterUpdate(), ref: (el) => this._filterList = el, view: this.mapView, zoomBtn: false }))));
+        return (h("calcite-modal", { "aria-labelledby": "modal-title", class: "modal", kind: "brand", onCalciteModalClose: () => void this._closeFilter(), open: this._filterOpen, widthScale: "s" }, h("div", { class: "display-flex align-center", id: "modal-title", slot: "header" }, this._translations?.filter?.replace("{{title}}", this._layer?.title)), h("div", { slot: "content" }, h("instant-apps-filter-list", { autoUpdateUrl: false, closeBtn: true, closeBtnOnClick: async () => this._closeFilter(), comboboxOverlayPositioning: "fixed", layerExpressions: this._layerExpressions, onFilterListReset: () => void this._handleFilterListReset(), onFilterUpdate: () => void this._handleFilterUpdate(), ref: (el) => this._filterList = el, view: this.mapView, zoomBtn: false }))));
     }
     /**
      * Reset the filter active prop
+     * @protected
      */
-    _handleFilterListReset() {
+    async _handleFilterListReset() {
         this._filterActive = false;
         this._updateShareUrl();
+        await this._searchFullText();
     }
     /**
      * Check if the layers definitionExpression has been modified
+     * @protected
      */
-    _handleFilterUpdate() {
+    async _handleFilterUpdate() {
         const defExp = this._layer.definitionExpression;
         if (this._floorExpression) {
             const regEx = new RegExp(`${this._floorField} = ['].+[']`, "gm");
@@ -1446,9 +1563,11 @@ export class LayerTable {
         this._filterActive = this._definitionExpression !== this._layer.definitionExpression &&
             (this._floorExpression ? this._layer.definitionExpression !== this._floorExpression : true);
         this._updateShareUrl();
+        await this._searchFullText();
     }
     /**
      * Close the filter modal
+     * @protected
      */
     async _closeFilter() {
         if (this._filterOpen) {
@@ -1461,6 +1580,7 @@ export class LayerTable {
      * Handle map click events to keep table and map click selection in sync
      *
      * @param evt IMapClick map click event details
+     * @protected
      */
     async _mapClicked(evt) {
         const opts = {
@@ -1486,6 +1606,7 @@ export class LayerTable {
     }
     /**
      * Select or deselect all rows
+     * @protected
      */
     _selectAll() {
         const ids = this._allIds;
@@ -1499,6 +1620,7 @@ export class LayerTable {
     /**
      * Toggle the show only selected flag
      *  When showOnly is true only the selected features will be shown in the table
+     * @protected
      */
     _toggleShowSelected() {
         this._showOnlySelected = !this._showOnlySelected;
@@ -1511,6 +1633,7 @@ export class LayerTable {
     }
     /**
      * Clears the selected indexes
+     * @protected
      */
     _clearSelection() {
         this.selectedIds = [];
@@ -1520,6 +1643,7 @@ export class LayerTable {
     }
     /**
      * When true the filter modal will be displayed
+     * @protected
      */
     _toggleFilter() {
         this._filterOpen = !this._filterOpen;
@@ -1527,6 +1651,7 @@ export class LayerTable {
     /**
      * Store any filters for the current layer.
      * Should only occur on layer change
+     * @protected
      */
     _initLayerExpressions() {
         const layerExpressions = this.mapInfo?.filterConfig?.layerExpressions;
@@ -1538,6 +1663,7 @@ export class LayerTable {
     }
     /**
      * Select all rows that are not currently selectd
+     * @protected
      */
     _switchSelected() {
         const currentIndexes = [...this.selectedIds];
@@ -1557,6 +1683,7 @@ export class LayerTable {
      * Export all selected rows as CSV
      *
      * @returns a promise that will resolve when the operation is complete
+     * @protected
      */
     async _exportToCSV() {
         const exportInfos = {};
@@ -1584,6 +1711,7 @@ export class LayerTable {
     }
     /**
      * Set the loading prop in the stored toolInfos
+     * @protected
      */
     _updateToolInfoLoading(name, isLoading) {
         this._toolInfos.some(tool => {
@@ -1595,15 +1723,18 @@ export class LayerTable {
     }
     /**
      * Refreshes the table and maintains the curent scroll position
+     * @protected
      */
     async _refresh() {
         await this._table.refresh();
+        this._allIds = await queryAllIds(this._layer);
         this.featureSelectionChange.emit(this.selectedIds);
     }
     /**
      * Zoom to all selected features
      *
      * @returns a promise that will resolve when the operation is complete
+     * @protected
      */
     async _zoom() {
         if (this._layer) {
@@ -1617,14 +1748,16 @@ export class LayerTable {
      * @param evt CustomEvent the id for the current layer
      *
      * @returns a promise that will resolve when the operation is complete
+     * @protected
      */
     async _layerSelectionChanged(evt) {
         const id = evt.detail[0];
         if (id !== this._layer?.id || this._featuresEmpty()) {
             this._fetchingData = true;
             const layer = await getLayerOrTable(this.mapView, id);
-            await layer.when(() => {
+            layer && await layer.when(() => {
                 this._layer = layer;
+                this._getFullTextSearchInfo();
             });
         }
         this._fetchingData = false;
@@ -1635,6 +1768,7 @@ export class LayerTable {
      * @param id item ID of the current map
      *
      * @returns a list of column templates if they exist
+     * @protected
      */
     _getColumnTemplates(id, fieldInfos) {
         let layerOption;
@@ -1680,6 +1814,7 @@ export class LayerTable {
     }
     /**
      * Get the menu config that adds the ability to hide the current column
+     * @protected
      */
     _getMenuConfig(name) {
         return {
@@ -1697,6 +1832,7 @@ export class LayerTable {
     }
     /**
      * Hide the table column for the provided name
+     * @protected
      */
     _handleHideClick(name) {
         this._columnsInfo[name] = false;
@@ -2089,7 +2225,9 @@ export class LayerTable {
             "_showHideOpen": {},
             "_showOnlySelected": {},
             "_toolInfos": {},
-            "_translations": {}
+            "_translations": {},
+            "_fullTextSearchInfo": {},
+            "_searchPlaceHolder": {}
         };
     }
     static get events() {

package/dist/collection/components/layout-manager/layout-manager.css

@@ -70,4 +70,4 @@
 
 .vertical-background {
   background-image: url('../../assets/data/images/vertical.png');
-}
+}

package/dist/collection/components/layout-manager/layout-manager.js

@@ -76,7 +76,7 @@ export class LayoutManager {
      * Renders the component.
      */
     render() {
-        return (h(Host, { key: 'b21325b44c55b4169b7c14ee8a72d4fb329049c0' }, h("div", { key: '9aa53161553d8daecde88138017758885747d357', class: "display-flex" }, h("div", { key: '4efeebd0ee5b9d288ae37a2f3697049eb71c5d4c', class: "display-flex action-center" }, h("calcite-icon", { key: 'aa2a89bc8b1974c56997478c7a1c4080e2f0e5e1', class: "icon icon-color", icon: "information", id: "app-information-icon", scale: "s" }), h("calcite-popover", { key: '920120df5f5036770308422dafe6c76201af303b', closable: true, label: "", referenceElement: "app-information-icon" }, h("span", { key: 'ed38dc29dd382563b9c38fd171f7380965b88fef', class: "tooltip-message" }, this._translations.appInfo))), h("div", { key: '5d09996c91decfea662e159625ab4c8dd06154ba', class: "header-text" }, this._translations.layout), this._getAction("grid-background", ELayoutMode.GRID, this._translations.grid), this._getAction("vertical-background", ELayoutMode.VERTICAL, this._translations.vertical), this._getAction("horizontal-background", ELayoutMode.HORIZONTAL, this._translations.horizontal))));
+        return (h(Host, { key: 'abb6818ffa37aa0f868270ec6d6b8041d44099b2' }, h("div", { key: '434fdf8ae99c123373df74b36eef28153bde9b06', class: "display-flex" }, h("div", { key: '962fcc67d6b211d264aaae049545770c335a13ee', class: "display-flex action-center" }, h("calcite-icon", { key: '6adbcb918d749c68c2c6071e1ec483324aa0f7d1', class: "icon icon-color", icon: "information", id: "app-information-icon", scale: "s" }), h("calcite-popover", { key: '5197e76bcfff70f204716489ed67466a0cfed0ef', closable: true, label: "", referenceElement: "app-information-icon" }, h("span", { key: '9af1ed841241eaec81d52d5c586a8e138a3c266b', class: "tooltip-message" }, this._translations.appInfo))), h("div", { key: '2b6a46642a794715225d0e49a2b75f0ff1df7079', class: "header-text" }, this._translations.layout), this._getAction("grid-background", ELayoutMode.GRID, this._translations.grid), this._getAction("vertical-background", ELayoutMode.VERTICAL, this._translations.vertical), this._getAction("horizontal-background", ELayoutMode.HORIZONTAL, this._translations.horizontal))));
     }
     //--------------------------------------------------------------------------
     //

package/dist/collection/components/list-flow-item/list-flow-item.css

@@ -16,4 +16,4 @@
 
 :host {
   display: block;
-}
+}

package/dist/collection/components/list-flow-item/list-flow-item.js

@@ -62,7 +62,7 @@ export class ListFlowItem {
     //
     //--------------------------------------------------------------------------
     render() {
-        return (h(Host, { key: 'de2fbee0068872b2eed39cb528169156a4f69615' }, h("slot", { key: '2fe9659669fe24fd4921c64548dcca0ed57111b9' })));
+        return (h(Host, { key: '184c77ba240a38a47fa12fdd7a5fd294ff0cc4e5' }, h("slot", { key: '67984b53c6b441e16f624bff775b83cc56ddbcf2' })));
     }
     static get is() { return "list-flow-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/location-flow-item/location-flow-item.css

@@ -16,4 +16,4 @@
 
 :host {
   display: block;
-}
+}

package/dist/collection/components/location-flow-item/location-flow-item.js

@@ -62,7 +62,7 @@ export class LocationFlowItem {
     //
     //--------------------------------------------------------------------------
     render() {
-        return (h(Host, { key: '48471224a5b2cf54e0f88ad58938d716a2388873' }, h("slot", { key: '4a438911cbc255d9be3d3ebe523ac971b58bbbbd' })));
+        return (h(Host, { key: 'edffcd51633ea9da90b22ee9339bf40950973ac0' }, h("slot", { key: '8bc1c0f25caf1cbf05f8629c5e0d882d77d4a839' })));
     }
     static get is() { return "location-flow-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/map-card/map-card.css

@@ -38,9 +38,10 @@
 
 .visibility-hidden-1 {
   visibility: hidden;
-  height: 1px; /* setting to 1 as 0 would cause the editor to not load in some cases */
+  height: 1px;
+  /* setting to 1 as 0 would cause the editor to not load in some cases */
 }
 
 .display-none {
   display: none;
-}
+}

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

@@ -223,7 +223,7 @@ export class MapCard {
         const containerClass = this.isMobile ? "width-full" : "";
         const mobileClass = this.isMobile ? "border-top" : "";
         const headerElements = this.isMapLayout ? "" : "display-none";
-        return (h(Host, { key: 'a724cfff5c8cd19703df8443fccf806cca1d37a7' }, h("div", { key: '8ee5d81cea48cbb5d62dd7e75f4d128aa36132ae', class: `${mapContainerClass}` }, h("map-picker", { key: '782526b5429f1b136efd2e0d339caea4b78038dd', class: mapPickerClass, isMapLayout: this.isMapLayout, mapInfos: this.mapInfos, ref: (el) => this._mapPicker = el }), h("div", { key: 'a8f9a8cd4e02aad729d119a5c04829142931c6dd', class: `mapView-header display-flex ${headerElements}` }, h("div", { key: 'f8e06895d78ed95c1467ba804325b458a54f0ae8', class: `border-end ${containerClass} ${mobileClass}`, id: "solutions-map-layer-picker-container" }, this.mapView && h("map-layer-picker", { key: 'f63739e17afb38bf98ec458a48298514c63a8bf2', appearance: "transparent", defaultLayerId: this.defaultLayerId, display: "inline-flex", height: 50, isMobile: this.isMobile, mapView: this.mapView, onlyShowUpdatableLayers: this.onlyShowUpdatableLayers, placeholderIcon: "layers", scale: "l", selectedIds: this.selectedLayer ? [this.selectedLayer.id] : [], showSingleLayerAsLabel: true, showTables: true, type: "dropdown" })), this._getDropDownItem())), h("div", { key: '740f980cadf2ab3ce2692357d39cef1cec31bbae', class: `${mapHeightClass} ${mapClass}`, ref: (el) => (this._mapDiv = el) }), h("map-tools", { key: 'e748b8677208111b7592d035c15abdab645c618e', basemapConfig: this.basemapConfig, class: `box-shadow ${themeClass}`, 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, ref: (el) => this._mapTools = el, searchConfiguration: this._searchConfiguration, stackTools: this.stackTools, toolOrder: this.toolOrder })));
+        return (h(Host, { key: 'd1320ec774cfaf0df3df6a2b53098251f55eb576' }, h("div", { key: 'b9180291be4c0ff0827a8fae263e98d6dd9e68aa', class: `${mapContainerClass}` }, h("map-picker", { key: '4aa3be4bfd15a311177aaa079e09d4e3c26f2051', class: mapPickerClass, isMapLayout: this.isMapLayout, mapInfos: this.mapInfos, ref: (el) => this._mapPicker = el }), h("div", { key: '0f29b0b33f46155b3e281a0adc92ecb21ebf4cee', class: `mapView-header display-flex ${headerElements}` }, h("div", { key: '4243b5cf75c46de7959d2c36af395e0042ae4dbc', class: `border-end ${containerClass} ${mobileClass}`, id: "solutions-map-layer-picker-container" }, this.mapView && h("map-layer-picker", { key: '8e2670134ba293b3e09bbae80c317aa52ebd701c', appearance: "transparent", defaultLayerId: this.defaultLayerId, display: "inline-flex", height: 50, isMobile: this.isMobile, mapView: this.mapView, onlyShowUpdatableLayers: this.onlyShowUpdatableLayers, placeholderIcon: "layers", scale: "l", selectedIds: this.selectedLayer ? [this.selectedLayer.id] : [], showSingleLayerAsLabel: true, showTables: true, type: "dropdown" })), this._getDropDownItem())), h("div", { key: '400443a5ffe15a4be9ec14c952cbdd911eeeaaec', class: `${mapHeightClass} ${mapClass}`, ref: (el) => (this._mapDiv = el) }), h("map-tools", { key: 'f423bb21ba69daa086cad359240c6c7f8622eb7b', basemapConfig: this.basemapConfig, class: `box-shadow ${themeClass}`, 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, ref: (el) => this._mapTools = el, searchConfiguration: this._searchConfiguration, stackTools: this.stackTools, toolOrder: this.toolOrder })));
     }
     /**
      * Called each time after the component is loaded

package/dist/collection/components/map-draw-tools/map-draw-tools.css

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
- :host {
+:host {
   display: block;
 }
 
@@ -49,11 +49,11 @@ html[dir="rtl"] .main-label {
 }
 
 .border-left {
-  border-left: 1px solid rgba(110,110,110,.3);
+  border-left: 1px solid rgba(110, 110, 110, .3);
 }
 
 .border-left[dir="rtl"] {
-  border-right: 1px solid rgba(110,110,110,.3);
+  border-right: 1px solid rgba(110, 110, 110, .3);
 }
 
 /* from js api */
@@ -61,7 +61,7 @@ html[dir="rtl"] .main-label {
   box-sizing: border-box;
   color: #323232;
   font-size: 14px;
-  font-family: "Avenir Next","Helvetica Neue",Helvetica,Arial,sans-serif;
+  font-family: "Avenir Next", "Helvetica Neue", Helvetica, Arial, sans-serif;
   line-height: 1.3em;
   background-color: #fff;
   --esri-widget-padding-v: 12px;
@@ -83,4 +83,4 @@ html[dir="rtl"] .main-label {
   flex-flow: row wrap;
   padding: 0 7px;
   margin: 6px 0;
-}
+}

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

@@ -183,7 +183,7 @@ export class MapDrawTools {
             "border" : "border esri-widget esri-sketch__panel";
         const undoRedoClass = this.drawMode === EDrawMode.SKETCH ?
             "display-none" : "esri-widget esri-sketch__panel border-left esri-sketch__section";
-        return (h(Host, { key: '29a6976363bf4d6d256a80235fddc4d9f29d3314' }, h("div", { key: 'a377200e030bf41964215c4d456f1aabb3ce0fa1', class: containerClass }, h("div", { key: 'de5b692eaa3d529099e1515daad6345393200039', ref: (el) => { this._sketchElement = el; } }), h("div", { key: '8a710aface1f6c50cb124b0e0a740ae7ba6822be', class: undoRedoClass }, h("calcite-action", { key: '259c132f9b45e9442f9c8060c7ebbeb1ce614e58', disabled: !this.undoEnabled, icon: "undo", onClick: () => this._undo(), scale: "s", text: this._translations.undo }), h("calcite-action", { key: '3a9f249a0f601e1975f73dcd05f53ab768e5f4e2', disabled: !this.redoEnabled, icon: "redo", onClick: () => this._redo(), scale: "s", text: this._translations.redo })))));
+        return (h(Host, { key: '017f8613460ab41feb1bd645e472213d0c2df356' }, h("div", { key: '557afac3997f606a105c9f89d3abe67d1648f3d9', class: containerClass }, h("div", { key: '57059d18c0559756ac4204821f6a6b2f0034a221', ref: (el) => { this._sketchElement = el; } }), h("div", { key: '7e8f7f479e511b5b16cb2934214c844d2dd02838', class: undoRedoClass }, h("calcite-action", { key: 'd76c8e31a478102dfe649d6370c9a8dff0252f11', disabled: !this.undoEnabled, icon: "undo", onClick: () => this._undo(), scale: "s", text: this._translations.undo }), h("calcite-action", { key: '5ce303707f16d8b4fdb84741f42d572ac1e05496', disabled: !this.redoEnabled, icon: "redo", onClick: () => this._redo(), scale: "s", text: this._translations.redo })))));
     }
     //--------------------------------------------------------------------------
     //

package/dist/collection/components/map-fullscreen/map-fullscreen.css

@@ -16,4 +16,4 @@
 
 :host {
   display: block;
-}
+}

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

@@ -95,7 +95,7 @@ export class MapFullscreen {
      * Renders the component.
      */
     render() {
-        return (h(Host, { key: '57cf43d121435c4db3c4847bb909ee77986d2f39' }, h("div", { key: 'e748dbb1924d588d3aa3cef1cfc7d9524a08ff1e', class: "fullscreen-widget", ref: (el) => { this._fullscreenElement = el; } })));
+        return (h(Host, { key: 'c72c550533e8820c2744a7efeb1fd869f0939b9e' }, h("div", { key: '34df2d628a421cb2a74046b459568765e800a30a', class: "fullscreen-widget", ref: (el) => { this._fullscreenElement = el; } })));
     }
     /**
      * StencilJS: Called just after the component updates.

package/dist/collection/components/map-layer-picker/map-layer-picker.css

@@ -73,4 +73,4 @@
 
 .cursor-default {
   cursor: default;
-}
+}

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

@@ -148,7 +148,7 @@ export class MapLayerPicker {
         const id = "map-layer-picker";
         let style = this.height > 0 ? { "height": `${this.height.toString()}px` } : {};
         style = { ...style, "display": this.display };
-        return (h(Host, { key: 'd575e7f5ef535d37466d8dc7b0c3d3de35e9b3fd' }, h("div", { key: '18010837a120b62adce243097d428ca424180c2c', class: "map-layer-picker-container", style: style }, h("div", { key: 'e9b625ab31cd069c2442f24ad81d747902a72ded', class: "map-layer-picker", style: style }, !this._hasValidLayers ? this._getInvalidPlaceholder() :
+        return (h(Host, { key: 'cd5647231dd3ed44a0acb155b00dbdfd25b54ab3' }, h("div", { key: '9468d551facd02669c12a6b6b75c89fab9efa1da', class: "map-layer-picker-container", style: style }, h("div", { key: 'd434b15e27476b2207bcdaf00c1f06b746dc352b', class: "map-layer-picker", style: style }, !this._hasValidLayers ? this._getInvalidPlaceholder() :
             !this._hasMultipleLayers && this.showSingleLayerAsLabel ? this._getSingleLayerPlaceholder() :
                 this.type === "combobox" ? this._getCombobox(id) :
                     this.type === "select" ? this._getSelect(id) : this._getDropdown(id)))));
@@ -268,7 +268,7 @@ export class MapLayerPicker {
         const name = item.name;
         const selected = this.selectedIds.indexOf(id) > -1;
         return this.type === "combobox" ? (h("calcite-combobox-item", { disabled: disabled, selected: selected, textLabel: name, value: id })) :
-            this.type === "select" ? (h("calcite-option", { disabled: disabled, label: name, selected: selected, value: id })) : (h("calcite-dropdown-group", { class: disabled ? "disabled" : "", selectionMode: disabled ? "none" : "single" }, h("calcite-dropdown-item", { onClick: disabled ? undefined : () => void this._setSelectedLayer(id), selected: selected }, name)));
+            this.type === "select" ? (h("calcite-option", { disabled: disabled, label: name, selected: selected, value: id })) : (h("calcite-dropdown-group", { class: disabled ? "disabled" : "", selectionMode: disabled ? "none" : "single" }, h("calcite-dropdown-item", { "icon-start": itemType, onClick: disabled ? undefined : () => void this._setSelectedLayer(id), selected: selected }, name)));
     }
     /**
      * Store the layer name based on the user selection

package/dist/collection/components/map-legend/map-legend.css

@@ -1,3 +1,3 @@
 :host {
   display: block;
-}
+}

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

@@ -86,7 +86,7 @@ export class MapLegend {
      * StencilJS: Renders the component.
      */
     render() {
-        return (h(Host, { key: '32e729a3a7b4989ced535b78b5ca4aa38b9dcc71' }, h("div", { key: '87a583eaad85b2b163a6f7349e65f00d5a29d0b7', ref: (el) => { this._legendElement = el; } })));
+        return (h(Host, { key: 'e3a9351058c504102e9ee43fd7544672538baf85' }, h("div", { key: '5d771b27dc314439a14da7ac8fbcf03c045c96e2', ref: (el) => { this._legendElement = el; } })));
     }
     /**
      * StencilJS: Called once just after the component is fully loaded and the first render() occurs.

package/dist/collection/components/map-picker/map-picker.css

@@ -70,4 +70,4 @@
 
 .align-center {
   align-items: center;
-}
+}

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

@@ -120,7 +120,7 @@ export class MapPicker {
      * Renders the component.
      */
     render() {
-        return (h(Host, { key: 'd9ee2182be2b3fbec5235e814d4929fa4d23a234' }, this._getToolbar(), this._getMapNameList(this._mapListExpanded)));
+        return (h(Host, { key: 'cf621d05f7736f85c4f9806a30b3fcee125409dc' }, this._getToolbar(), this._getMapNameList(this._mapListExpanded)));
     }
     /**
      * Called once after the component has loaded

package/dist/collection/components/map-search/map-search.css

@@ -21,4 +21,4 @@
 .search-widget {
   width: 100% !important;
   border: 1px solid var(--calcite-color-border-input);
-}
+}