@esri/solutions-components 0.10.16 → 0.10.17

package/dist/cjs/card-manager_3.cjs.entry.js

@@ -9,20 +9,23 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5a0af791.js');
 const locale = require('./locale-a09603ee.js');
-const mapViewUtils = require('./mapViewUtils-8d4da732.js');
-const downloadUtils = require('./downloadUtils-e6e2f8c4.js');
+const mapViewUtils = require('./mapViewUtils-18c46b84.js');
+const downloadUtils = require('./downloadUtils-b1bc6031.js');
 require('./esri-loader-08dc41bd.js');
 require('./_commonjsHelpers-baf43783.js');
 require('./interfaces-09c4c40e.js');
 require('./solution-resource-16c7510c.js');
 require('./restHelpersGet-88ba0e25.js');
 
-const cardManagerCss = ":host{display:block !important}.display-flex{display:flex}.display-none{display:none}.w-100{width:100%}.padding-bottom-1{padding-bottom:1rem}.padding-1{padding:1rem}.position-relative{position:relative}.focus-margin{margin:1px 1px 0px 1px}.overflow-auto{overflow:auto}.height-full{height:100%}card-manager{display:block}";
+const cardManagerCss = ":host{display:block !important}.display-flex{display:flex}.display-none{display:none}.w-100{width:100%}.padding-bottom-1{padding-bottom:1rem}.padding-1{padding:1rem}.position-relative{position:relative}.focus-margin{margin:1px 1px 0px 1px}.overflow-auto{overflow:auto}.height-full{height:100%}.position-static{position:static !important}.z-index-500{z-index:500 !important}card-manager{display:block}";
 const CardManagerStyle0 = cardManagerCss;
 
 const CardManager = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
+        this.createWorkFlowStarted = index.createEvent(this, "createWorkFlowStarted", 7);
+        this.backFromCreateWorkFlow = index.createEvent(this, "backFromCreateWorkFlow", 7);
+        this.featureOrRecordSubmitted = index.createEvent(this, "featureOrRecordSubmitted", 7);
         this.customInfoText = undefined;
         this.enableEditGeometry = false;
         this.isMobile = undefined;
@@ -30,11 +33,27 @@ const CardManager = class {
         this.mapView = undefined;
         this.zoomAndScrollToSelected = undefined;
         this.selectedFeaturesIds = undefined;
+        this.enableCreateFeatures = true;
         this._cardLoading = false;
         this._graphics = undefined;
+        this._showCreateFeatureComponent = false;
+        this._showSubmitBtn = false;
         this._translations = undefined;
     }
     get el() { return index.getElement(this); }
+    /**
+     * boolean: Flag to maintain if recently any feature has been created
+     */
+    _isFeatureCreated = false;
+    //--------------------------------------------------------------------------
+    //
+    //  Properties (protected)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * HTMLCreateFeatureElement: Create Feature component instance
+     */
+    _createFeature;
     //--------------------------------------------------------------------------
     //
     //  Watch handlers
@@ -50,10 +69,25 @@ const CardManager = class {
     //  Events (public)
     //
     //--------------------------------------------------------------------------
+    /**
+     * Emits when create work flow started
+     */
+    createWorkFlowStarted;
+    /**
+     * Emits when back from create work flow
+     */
+    backFromCreateWorkFlow;
+    /**
+     * Emits when feature/record is submitted
+     */
+    featureOrRecordSubmitted;
     /**
      * Query the layer for the provided ids and store the result graphics
      */
     async featureSelectionChange(evt) {
+        if (this._showCreateFeatureComponent && !this._isFeatureCreated) {
+            void this._backFromCreateFeature();
+        }
         const ids = evt.detail;
         this._graphics = await this._getFeaturesByIds(ids);
     }
@@ -61,6 +95,9 @@ const CardManager = class {
      * Get the layer view for the provided layer id
      */
     async layerSelectionChange(evt) {
+        if (this._showCreateFeatureComponent) {
+            void this._backFromCreateFeature();
+        }
         const id = evt.detail[0];
         this.layer = await mapViewUtils.getLayerOrTable(this.mapView, id);
     }
@@ -85,8 +122,23 @@ const CardManager = class {
      */
     render() {
         const featuresClass = this._graphics?.length > 0 ? "" : "display-none";
-        const messageClass = this._graphics?.length > 0 ? "display-none" : "";
-        return (index.h(index.Host, { key: 'dafff11793b5ae60164964c346cbb152caceaeb9' }, index.h("div", { key: '02507fe9e1f4205fe8a9342b466f1ada849c8ed8', class: "overflow-auto height-full" }, index.h("calcite-shell", { key: '712c42c4044c1386e8bc4ff42e44f250ac4023a2', class: "position-relative " + featuresClass }, index.h("div", { key: 'f2bc47f58463506f7ea8011495b22cafb63e4f27' }, index.h("info-card", { key: '1ad1fb78dcc99a43d92ad08d4c7bbeda7c2f276d', enableEditGeometry: this.enableEditGeometry, graphics: this._graphics, isLoading: this._cardLoading, isMobile: this.isMobile, mapView: this.mapView }))), index.h("calcite-shell", { key: 'fa9fcada67198c182f918b939826f1f7f19f8e5b', class: "position-relative " + messageClass }, index.h("div", { key: '0da349d1442b6375cde177780c5f868d2e32072a', class: "padding-1" }, index.h("calcite-notice", { key: 'c0e04ca03c546f90c942c2eef622fbe9c8e61227', icon: "table", open: true }, index.h("div", { key: '85e3925e725798189b16270df31c266c55391ec7', slot: "message" }, this.customInfoText || this._translations.selectFeaturesToStart)))))));
+        const createFeatureClass = this._graphics?.length === 0 && this._showCreateFeatureComponent ? "" : "display-none";
+        const messageClass = this._graphics?.length > 0 || this._showCreateFeatureComponent ? "display-none" : "";
+        const isTable = this.layer?.isTable;
+        const heading = isTable ? this._translations.createRecord : this._translations.createFeature;
+        const showCreateFeatureOrRecordBtn = this.enableCreateFeatures && this.layer?.capabilities?.operations?.supportsAdd;
+        return (index.h(index.Host, { key: '6089a5003e4ee08df4da7ecbcf8e6a3c8628f8bf' }, index.h("div", { key: '60dc1c21c650cce5165f56a0e040feba3652ae10', class: "overflow-auto height-full" }, index.h("calcite-shell", { key: '530a3173010e32fe062dc313ed3805833228f0fd', class: "position-relative " + featuresClass }, index.h("div", { key: 'af2350dac50f8ecc576cdeb528b350557057ff8d', class: "position-static z-index-500" }, index.h("info-card", { key: '626b34ec1ed2fc7e52f0ee2f9ae4520d1bcceb08', enableEditGeometry: this.enableEditGeometry, graphics: this._graphics, isLoading: this._cardLoading, isMobile: this.isMobile, mapView: this.mapView }))), index.h("calcite-shell", { key: '642531296a90d92068592eef75bc4632438a4cbc', class: "position-relative " + messageClass }, index.h("calcite-flow-item", { key: 'b15e856439afdf9f08df9ff22f4e7dd7fee74273' }, index.h("calcite-panel", { key: '9305e17349e3b653565d1c183e118bdc3b791e23' }, index.h("div", { key: '25cf89836b8d20c6728842c5372e2c17dda967e6', class: "padding-1" }, index.h("calcite-notice", { key: '8df4a9c3e037f1b9f6131371d36a23e845db7ee2', icon: "table", open: true }, index.h("div", { key: '5c613ab8e9b9c25fc9f824e1007c3c4fa48b15b5', slot: "message" }, this.customInfoText || this._translations.selectFeaturesToStart))), showCreateFeatureOrRecordBtn && index.h("calcite-button", { key: 'ba88fcd64b3cf2ae1fc36da58581974473d4e0b3', disabled: !this.layer, onClick: () => this._createFeatureBtnClicked(), slot: "footer", width: "full" }, isTable ? this._translations.createRecord : this._translations.createFeature)))), index.h("calcite-shell", { key: '5e64963bf756e397c819a4c60112191031d9113f', class: "position-relative " + createFeatureClass }, index.h("calcite-flow-item", { key: '7d93240bffd381e2ed1e6dc10126b30cb1a143f9' }, index.h("calcite-panel", { key: '6ae7f4917394521b3226e38e07ac8eaf8c29b58e', heading: heading }, index.h("calcite-action", { key: '60cfdea79ad19ba0b62a9fb2ef3a6495c41b1f53', class: "back-button hydrated", icon: "chevron-left", onClick: this._backFromCreateFeature.bind(this), scale: "s", slot: "header-actions-start", text: "back" }), this.getEditorComponent(), this._showSubmitBtn && index.h("calcite-button", { key: 'ab10ab259363cee6b872f7e6619518125141759e', appearance: "solid", class: "footer-top-button footer-button", onClick: () => void this._createFeature.submit(), slot: "footer", width: "full" }, this._translations.create)))))));
+    }
+    /**
+   * Returns the editor component for adding feature
+   * @returns Node
+   */
+    getEditorComponent() {
+        return (index.h("div", null, this._showCreateFeatureComponent && index.h("create-feature", { customizeSubmit: true, mapView: this.mapView, onDrawComplete: () => { this._showSubmitBtn = true; }, onEditingAttachment: (evt) => { this._showSubmitBtn = !evt.detail; }, onProgressStatus: () => {
+                setTimeout(() => {
+                    this._isFeatureCreated = false;
+                }, 2000);
+            }, onSuccess: this._featureCreated.bind(this), ref: el => this._createFeature = el, selectedLayerId: this.layer?.id })));
     }
     //--------------------------------------------------------------------------
     //
@@ -101,10 +153,44 @@ const CardManager = class {
      */
     async _getFeaturesByIds(ids) {
         // only query if we have some ids...query with no ids will result in all features being returned
-        const featureSet = ids.length > 0 ? await mapViewUtils.queryFeaturesByID(ids, this.layer, [], false, this.mapView.spatialReference) : [];
+        const featureSet = ids.length > 0 ? await mapViewUtils.queryFeaturesByID(ids, this.layer, [], true, this.mapView.spatialReference) : [];
         // https://github.com/Esri/solutions-components/issues/365
         return featureSet.sort((a, b) => ids.indexOf(a.getObjectId()) - ids.indexOf(b.getObjectId()));
     }
+    /**
+     * Displays the feature creation functionality and changes the layout
+     * @protected
+     */
+    _createFeatureBtnClicked() {
+        this._showCreateFeatureComponent = true;
+        this.createWorkFlowStarted.emit();
+    }
+    /**
+     * Closes the Create feature component
+     * @protected
+     */
+    async _backFromCreateFeature() {
+        if (this._createFeature) {
+            await this._createFeature.close();
+            this._showCreateFeatureComponent = false;
+            this.backFromCreateWorkFlow.emit();
+        }
+        this._showSubmitBtn = false;
+    }
+    /**
+     * On Submitting the form show the creator feature again
+     * @protected
+     */
+    _featureCreated() {
+        void this._createFeature.close();
+        this._showCreateFeatureComponent = false;
+        this._showSubmitBtn = false;
+        this._isFeatureCreated = true;
+        this.featureOrRecordSubmitted.emit();
+        setTimeout(() => {
+            this._showCreateFeatureComponent = true;
+        }, 50);
+    }
     /**
      * Fetches the component's translations
      *
@@ -118,7 +204,7 @@ const CardManager = class {
 };
 CardManager.style = CardManagerStyle0;
 
-const layerTableCss = ":host{display:block}.height-full{height:100%}.height-full-adjusted{height:calc(100% - 20px)}.width-full{width:100%}.display-flex{display:flex}.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{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}.share-action{position:absolute;right:0}html[dir=\"rtl\"] .share-action{left:0}.disabled{cursor:default !important;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled);pointer-events:none}.instant-app-share{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%}";
+const layerTableCss = ":host{display:block}.height-full{height:100%}.height-full-adjusted{height:calc(100% - 20px)}.width-full{width:100%}.display-flex{display:flex}.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}.share-action{position:absolute;right:0}html[dir=\"rtl\"] .share-action{left:0}.disabled{cursor:default !important;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled);pointer-events:none}.instant-app-share{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%}";
 const LayerTableStyle0 = layerTableCss;
 
 const LayerTable = class {
@@ -158,6 +244,8 @@ const LayerTable = class {
         this._showOnlySelected = false;
         this._toolInfos = undefined;
         this._translations = undefined;
+        this._fullTextSearchInfo = undefined;
+        this._searchPlaceHolder = '';
     }
     get el() { return index.getElement(this); }
     //--------------------------------------------------------------------------
@@ -317,6 +405,10 @@ const LayerTable = class {
      * IToolSizeInfo[]: Id and Width for the current tools
      */
     _toolbarSizeInfos;
+    /**
+     * string the current search expression
+     */
+    _searchExpression;
     //--------------------------------------------------------------------------
     //
     //  Watch handlers
@@ -413,6 +505,7 @@ const LayerTable = class {
         }
         if (this.mapView) {
             this._floorExpression = undefined;
+            this._searchExpression = undefined;
             this._updateShareUrl();
             this._mapClickHandle = this.reactiveUtils.on(() => this.mapView, "click", (event) => {
                 void this._mapClicked(event);
@@ -459,13 +552,13 @@ const LayerTable = class {
      * Reset the filter
      */
     async filterReset() {
-        void this._handleFilterListReset();
+        await this._handleFilterListReset();
     }
     /**
      * Updates the filter
      */
     async filterUpdate() {
-        this._handleFilterUpdate();
+        await this._handleFilterUpdate();
     }
     /**
      * Closes the filter
@@ -477,7 +570,9 @@ const LayerTable = class {
      * refresh the feature table
      */
     async refresh() {
-        await this._refresh();
+        if (this._table) {
+            await this._refresh();
+        }
     }
     //--------------------------------------------------------------------------
     //
@@ -524,10 +619,10 @@ const LayerTable = class {
         }
     }
     /**
-   * 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);
     }
@@ -597,10 +692,12 @@ const LayerTable = class {
         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 (index.h(index.Host, { key: '388b0c1f6fc251361b3e1d93310c5077a8244f1f' }, index.h("calcite-shell", { key: 'ed4d6f8b884ecba4dbcd6b747528fd2e83a2717d' }, this._getTableControlRow("header"), index.h("div", { key: '6d86a54602feda5dad9e9d4097c9b8e3fe80227c', class: `width-full ${tableHeightClass}` }, index.h("calcite-panel", { key: 'dc4c986af144111acbd21aee82318c90ee920a42', class: "height-full width-full" }, index.h("calcite-loader", { key: 'd96bbbfa441f9e968fd04e5d17b80c298b690a49', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), index.h("div", { key: 'afa9e7dea3b195004ef258745b642c05a77ad62d', class: tableNodeClass, ref: this.onTableNodeCreate })), !this.isMobile ? (index.h("div", { class: "bottom-left text-color height-19" }, this._translations.recordsSelected
+        return (index.h(index.Host, { key: '3bdcab95ec86da387ae93e62a0b87856010c6f8c' }, index.h("calcite-shell", { key: 'cbf48d44ae4d480e904093e320331bdf714ed1cd' }, this._getTableControlRow("header"), index.h("div", { key: '96a1806648eb3edaecae575088873d1a8e255e0d', class: `width-full ${tableHeightClass}` }, index.h("calcite-panel", { key: '085137217d77556344bb47e34279e0f16434e268', class: "height-full width-full" }, showSearch &&
+            index.h("calcite-input", { key: '5defb981e7a5299e9f9d2a17bb9bf2040c68fdc7', clearable: true, icon: "search", onCalciteInputChange: (evt) => void this._searchTextChanged(evt), placeholder: this._searchPlaceHolder, title: this._searchPlaceHolder, type: "search" }), index.h("calcite-loader", { key: '432073ef427c020b822d804b36213fe969f4754c', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), index.h("div", { key: '1e987a9ecf5779c901f96abc092ad4944a80a4ab', class: tableNodeClass, ref: this.onTableNodeCreate }))), !this.isMobile ? (index.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
@@ -642,6 +739,107 @@ const LayerTable = class {
         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
      */
@@ -657,7 +855,7 @@ const LayerTable = class {
      */
     _getTableControlRow(slot) {
         const id = "more-table-options";
-        return (index.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 (index.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
@@ -791,7 +989,6 @@ const LayerTable = class {
                     func: () => alert(this._translations.editMultiple),
                     disabled: !showMultipleEdits,
                     isOverflow: false,
-                    isSublist: false
                 } : undefined,
                 this._deleteEnabled ? {
                     active: undefined,
@@ -1484,6 +1681,8 @@ const LayerTable = class {
     }
     /**
      * 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;
@@ -1515,21 +1714,25 @@ const LayerTable = class {
      * Show filter component in modal
      *
      * @returns node to interact with any configured filters for the current layer
+     * @protected
      */
     _filterModal() {
-        return (index.h("calcite-modal", { "aria-labelledby": "modal-title", class: "modal", kind: "brand", onCalciteModalClose: () => void this._closeFilter(), open: this._filterOpen, widthScale: "s" }, index.h("div", { class: "display-flex align-center", id: "modal-title", slot: "header" }, this._translations?.filter?.replace("{{title}}", this._layer?.title)), index.h("div", { slot: "content" }, index.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 (index.h("calcite-modal", { "aria-labelledby": "modal-title", class: "modal", kind: "brand", onCalciteModalClose: () => void this._closeFilter(), open: this._filterOpen, widthScale: "s" }, index.h("div", { class: "display-flex align-center", id: "modal-title", slot: "header" }, this._translations?.filter?.replace("{{title}}", this._layer?.title)), index.h("div", { slot: "content" }, index.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");
@@ -1540,9 +1743,11 @@ const LayerTable = class {
         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) {
@@ -1555,6 +1760,7 @@ const LayerTable = class {
      * 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 = {
@@ -1580,6 +1786,7 @@ const LayerTable = class {
     }
     /**
      * Select or deselect all rows
+     * @protected
      */
     _selectAll() {
         const ids = this._allIds;
@@ -1593,6 +1800,7 @@ const LayerTable = class {
     /**
      * 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;
@@ -1605,6 +1813,7 @@ const LayerTable = class {
     }
     /**
      * Clears the selected indexes
+     * @protected
      */
     _clearSelection() {
         this.selectedIds = [];
@@ -1614,6 +1823,7 @@ const LayerTable = class {
     }
     /**
      * When true the filter modal will be displayed
+     * @protected
      */
     _toggleFilter() {
         this._filterOpen = !this._filterOpen;
@@ -1621,6 +1831,7 @@ const LayerTable = class {
     /**
      * Store any filters for the current layer.
      * Should only occur on layer change
+     * @protected
      */
     _initLayerExpressions() {
         const layerExpressions = this.mapInfo?.filterConfig?.layerExpressions;
@@ -1632,6 +1843,7 @@ const LayerTable = class {
     }
     /**
      * Select all rows that are not currently selectd
+     * @protected
      */
     _switchSelected() {
         const currentIndexes = [...this.selectedIds];
@@ -1651,6 +1863,7 @@ const LayerTable = class {
      * Export all selected rows as CSV
      *
      * @returns a promise that will resolve when the operation is complete
+     * @protected
      */
     async _exportToCSV() {
         const exportInfos = {};
@@ -1678,6 +1891,7 @@ const LayerTable = class {
     }
     /**
      * Set the loading prop in the stored toolInfos
+     * @protected
      */
     _updateToolInfoLoading(name, isLoading) {
         this._toolInfos.some(tool => {
@@ -1689,15 +1903,18 @@ const LayerTable = class {
     }
     /**
      * Refreshes the table and maintains the curent scroll position
+     * @protected
      */
     async _refresh() {
         await this._table.refresh();
+        this._allIds = await mapViewUtils.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) {
@@ -1711,14 +1928,16 @@ const LayerTable = class {
      * @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 mapViewUtils.getLayerOrTable(this.mapView, id);
-            await layer.when(() => {
+            layer && await layer.when(() => {
                 this._layer = layer;
+                this._getFullTextSearchInfo();
             });
         }
         this._fetchingData = false;
@@ -1729,6 +1948,7 @@ const LayerTable = class {
      * @param id item ID of the current map
      *
      * @returns a list of column templates if they exist
+     * @protected
      */
     _getColumnTemplates(id, fieldInfos) {
         let layerOption;
@@ -1774,6 +1994,7 @@ const LayerTable = class {
     }
     /**
      * Get the menu config that adds the ability to hide the current column
+     * @protected
      */
     _getMenuConfig(name) {
         return {
@@ -1791,6 +2012,7 @@ const LayerTable = class {
     }
     /**
      * Hide the table column for the provided name
+     * @protected
      */
     _handleHideClick(name) {
         this._columnsInfo[name] = false;
@@ -2063,7 +2285,7 @@ const MapCard = class {
         const containerClass = this.isMobile ? "width-full" : "";
         const mobileClass = this.isMobile ? "border-top" : "";
         const headerElements = this.isMapLayout ? "" : "display-none";
-        return (index.h(index.Host, { key: 'a724cfff5c8cd19703df8443fccf806cca1d37a7' }, index.h("div", { key: '8ee5d81cea48cbb5d62dd7e75f4d128aa36132ae', class: `${mapContainerClass}` }, index.h("map-picker", { key: '782526b5429f1b136efd2e0d339caea4b78038dd', class: mapPickerClass, isMapLayout: this.isMapLayout, mapInfos: this.mapInfos, ref: (el) => this._mapPicker = el }), index.h("div", { key: 'a8f9a8cd4e02aad729d119a5c04829142931c6dd', class: `mapView-header display-flex ${headerElements}` }, index.h("div", { key: 'f8e06895d78ed95c1467ba804325b458a54f0ae8', class: `border-end ${containerClass} ${mobileClass}`, id: "solutions-map-layer-picker-container" }, this.mapView && index.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())), index.h("div", { key: '740f980cadf2ab3ce2692357d39cef1cec31bbae', class: `${mapHeightClass} ${mapClass}`, ref: (el) => (this._mapDiv = el) }), index.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 (index.h(index.Host, { key: 'd1320ec774cfaf0df3df6a2b53098251f55eb576' }, index.h("div", { key: 'b9180291be4c0ff0827a8fae263e98d6dd9e68aa', class: `${mapContainerClass}` }, index.h("map-picker", { key: '4aa3be4bfd15a311177aaa079e09d4e3c26f2051', class: mapPickerClass, isMapLayout: this.isMapLayout, mapInfos: this.mapInfos, ref: (el) => this._mapPicker = el }), index.h("div", { key: '0f29b0b33f46155b3e281a0adc92ecb21ebf4cee', class: `mapView-header display-flex ${headerElements}` }, index.h("div", { key: '4243b5cf75c46de7959d2c36af395e0042ae4dbc', class: `border-end ${containerClass} ${mobileClass}`, id: "solutions-map-layer-picker-container" }, this.mapView && index.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())), index.h("div", { key: '400443a5ffe15a4be9ec14c952cbdd911eeeaaec', class: `${mapHeightClass} ${mapClass}`, ref: (el) => (this._mapDiv = el) }), index.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/cjs/component-ab59efe0.js

@@ -0,0 +1,33 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+'use strict';
+
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
+ * v2.12.1
+ */
+function getIconScale(componentScale) {
+    return componentScale === "l" ? "m" : "s";
+}
+/**
+ * This util helps us wait for a component to be ready for both lazy-loading (`dist` output) and non-lazy-loading (`components` output) components.
+ *
+ * Based on https://github.com/ionic-team/ionic-framework/blob/1a8bd6d/core/src/utils/helpers.ts#L60C1-L79C3
+ *
+ * @param el - the host element to wait for
+ */
+async function componentOnReady(el) {
+    await (isStencilEl(el)
+        ? el.componentOnReady()
+        : new Promise((resolve) => requestAnimationFrame(() => resolve())));
+}
+function isStencilEl(el) {
+    return typeof el.componentOnReady === "function";
+}
+
+exports.componentOnReady = componentOnReady;
+exports.getIconScale = getIconScale;

package/dist/cjs/conditionalSlot-e7b1e80b.js

@@ -0,0 +1,54 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+'use strict';
+
+const index = require('./index-5a0af791.js');
+const observers = require('./observers-b83abbfc.js');
+
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
+ * v2.12.1
+ */
+let mutationObserver;
+const observerOptions = { childList: true };
+/**
+ * Helper to set up a conditional slot component on connectedCallback.
+ *
+ * @param component
+ * @deprecated Use `onSlotchange` event with `slotChangeHasAssignedElement` DOM utility instead.
+ *
+ * ```
+ * <slot onSlotchange={(event) => this.mySlotHasElement = slotChangeHasAssignedElement(event)} />}
+ * ```
+ */
+function connectConditionalSlotComponent(component) {
+    if (!mutationObserver) {
+        mutationObserver = observers.createObserver("mutation", processMutations);
+    }
+    mutationObserver.observe(component.el, observerOptions);
+}
+/**
+ * Helper to tear down a conditional slot component on disconnectedCallback.
+ *
+ * @param component
+ * @deprecated Use `onSlotchange` event with `slotChangeHasAssignedElement` DOM utility instead.
+ *
+ * ```
+ * <slot onSlotchange={(event) => this.mySlotHasElement = slotChangeHasAssignedElement(event)} />}
+ * ```
+ */
+function disconnectConditionalSlotComponent(component) {
+    mutationObserver.unobserve(component.el);
+}
+function processMutations(mutations) {
+    mutations.forEach(({ target }) => {
+        index.forceUpdate(target);
+    });
+}
+
+exports.connectConditionalSlotComponent = connectConditionalSlotComponent;
+exports.disconnectConditionalSlotComponent = disconnectConditionalSlotComponent;