@esri/solutions-components 0.11.32 → 0.11.33

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

@@ -142,7 +142,7 @@ export class CardManager {
         const heading = isTable ? this._translations.createRecord : this._translations.createFeature;
         const guideMsg = this.customInfoText ? this.customInfoText : this.selectingFeatureFromMap ? this._translations.selectFeaturesFromMapToStart : this._translations.selectFeaturesToStart;
         const showCreateFeatureOrRecordBtn = this.enableCreateFeatures && this.layer?.capabilities?.operations?.supportsAdd;
-        return (h(Host, { key: '803f5130e6f4fa0bf97cfdd2776e176786e736cc' }, h("div", { key: '7c0a756f5de5f536b52d2e9f6629593eb3c85781', class: "overflow-auto height-full" }, h("calcite-shell", { key: '9a6366bba429d5c29a5f1c556d6812f44d28ee2c', class: "position-relative " + featuresClass }, h("div", { key: '61cb9f7942eb209e5e0bd751ab4b5ca026086882', class: "position-static z-index-500" }, h("info-card", { key: '0c3b6f958384dab4bc1db2917a88215bafe330b1', enableEditGeometry: this.enableEditGeometry, enableSnapping: this.enableSnapping, graphics: this._graphics, isLoading: this._cardLoading, isMobile: this.isMobile, locale: this.locale, mapView: this.mapView, showCloseBtn: true }))), h("calcite-shell", { key: 'db9233d29cc88ddc6cb023bcf9e9190ecb721214', class: "position-relative " + messageClass }, h("calcite-panel", { key: '0d1c22a3ad3d2d2a56054b2e8609697987b45ca7' }, h("div", { key: 'cc5f7faa934f474ddca2d0ab74fd46dac240cc6f', class: "padding-1" }, h("calcite-notice", { key: '2c2771696892455fcb1ec24d895cd321a84a8f49', icon: this.selectingFeatureFromMap ? "map" : "table", iconFlipRtl: true, open: true }, h("div", { key: '0bbbd13e4e9a7b2240a85b41dbd00fc2a7e39c75', slot: "message" }, guideMsg))), !this.isMobile && showCreateFeatureOrRecordBtn && h("calcite-button", { key: '67bac627f68fc6bcda2b1a8965ab6d7fb12d2e4c', disabled: !this.layer, onClick: () => this._createFeatureBtnClicked(), slot: "footer", width: "full" }, isTable ? this._translations.createRecord : this._translations.createFeature))), h("calcite-shell", { key: 'cd44af48bb05fd6ac41c0d66bdd9e01826ece1a4', class: "position-relative " + createFeatureClass }, h("calcite-flow-item", { key: '648dfdc4fb559ecbf64ee43791e3d9799c346f1a', selected: true }, h("calcite-panel", { key: '855df56ed576e52c94dbe3cfa8f6d57427a37ba2', heading: heading }, h("calcite-action", { key: '156d1b20da3f02de66879531802aa2d2fb99b1ca', class: "back-button hydrated", icon: "chevron-left", onClick: this._backFromCreateFeature.bind(this), scale: "s", slot: "header-actions-start", text: "" }), this.getEditorComponent(), this._showSubmitBtn && h("calcite-button", { key: '9b4556876d579a4f2bd02849737cd55b55f87cbd', appearance: "solid", class: "footer-top-button footer-button", onClick: () => void this._createFeature.submit(), slot: "footer", width: "full" }, this._translations.create)))))));
+        return (h(Host, { key: '803f5130e6f4fa0bf97cfdd2776e176786e736cc' }, h("div", { key: '7c0a756f5de5f536b52d2e9f6629593eb3c85781', class: "overflow-auto height-full" }, h("calcite-shell", { key: '9a6366bba429d5c29a5f1c556d6812f44d28ee2c', class: "position-relative " + featuresClass }, h("div", { key: '61cb9f7942eb209e5e0bd751ab4b5ca026086882', class: "position-static z-index-500" }, h("info-card", { key: 'aa2e8443af374a37dfebd0d5e87ca052221339a7', enableEditGeometry: this.enableEditGeometry, enableSnapping: this.enableSnapping, graphics: this._graphics, highlightEnabled: false, isLoading: this._cardLoading, isMobile: this.isMobile, locale: this.locale, mapView: this.mapView, showCloseBtn: true }))), h("calcite-shell", { key: '4979b9d94cd68f36b5d9e6ea59ffc0baecd180c0', class: "position-relative " + messageClass }, h("calcite-panel", { key: '9e02f86010e2348668a995de7d3644f0ddf838a6' }, h("div", { key: '83a5ac2003838734308d81dc2903313cb6c07e9a', class: "padding-1" }, h("calcite-notice", { key: 'e380ab334a7b4d65fb64b51bc2b7feb61771f813', icon: this.selectingFeatureFromMap ? "map" : "table", iconFlipRtl: true, open: true }, h("div", { key: '2ac48545c9c825d8d266a96b034dba7d17c024c1', slot: "message" }, guideMsg))), !this.isMobile && showCreateFeatureOrRecordBtn && h("calcite-button", { key: '300e922dcf00b72657ca48382579746073a1a646', disabled: !this.layer, onClick: () => this._createFeatureBtnClicked(), slot: "footer", width: "full" }, isTable ? this._translations.createRecord : this._translations.createFeature))), h("calcite-shell", { key: '1c279da12e0885ed5ecae714a0958e76ac3734d5', class: "position-relative " + createFeatureClass }, h("calcite-flow-item", { key: '8e54e6abf83e3d8ce487a2f76e1bdd8635f4d7b5', selected: true }, h("calcite-panel", { key: 'd31997df187797550eeaee6df294e4f41e6653b5', heading: heading }, h("calcite-action", { key: '636c83f8d5f361c1eb35a5b524565d0bd072489f', class: "back-button hydrated", icon: "chevron-left", onClick: this._backFromCreateFeature.bind(this), scale: "s", slot: "header-actions-start", text: "" }), this.getEditorComponent(), this._showSubmitBtn && h("calcite-button", { key: 'bd1a3ee472e275c57e9c40c217a3c0ac9c8e8715', 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

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

@@ -215,7 +215,7 @@ export class EditCard {
             !this.graphics[0].layer.editingEnabled : true;
         const tableNodeClass = this._editorLoading ? "display-none" : "position-absolute";
         const loadingClass = this._editorLoading ? "" : "display-none";
-        return (h(Host, { key: 'd67dbfb453966623d26a1567df84bc58024305d7' }, h("div", { key: '9cd13eaf0125ab39e1d24398ccfda17c9534317a', class: "position-absolute" }, editDisabled ? (h("calcite-notice", { kind: "warning", open: true, slot: "content-top", width: "full" }, h("div", { slot: "message" }, this._translations.enableEditing))) : undefined, h("div", { key: '6cb4122611d8d8595cd85cd07224baa374066658', class: "position-absolute" }, h("div", { key: 'c4498b1ecd165fa594d9d1cef43f01643b5e3efb', class: tableNodeClass, id: "feature-form", ref: (el) => this._editContainer = el }), h("calcite-loader", { key: 'febb4d5c9a662ec9ffa6955114c8476c498116ee', class: loadingClass, label: "", scale: "s" })))));
+        return (h(Host, { key: '5d0380d4dbd7412c90e6e3b9aa28b580bf5a6ac4' }, h("div", { key: '29825ee6c26acce86fcb6678d3e3db957358e314', class: "position-absolute" }, editDisabled ? (h("calcite-notice", { kind: "warning", open: true, slot: "content-top", width: "full" }, h("div", { slot: "message" }, this._translations.enableEditing))) : undefined, h("div", { key: '35fc876d6857fb72c8808cff311e894dd9890afe', class: "position-absolute" }, h("div", { key: 'c95f3453d5fc4dac7ba5f1e7db69490405861059', class: tableNodeClass, id: "feature-form", ref: (el) => this._editContainer = el }), h("calcite-loader", { key: '211fd81ec4b13a731a895c882fafcb438fbf235c', class: loadingClass, label: "", scale: "s" })))));
     }
     //--------------------------------------------------------------------------
     //

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

@@ -312,8 +312,8 @@ export class InfoCard {
             });
         }
         else {
-            this._features.clear();
-            this._features.close();
+            this._features?.clear();
+            this._features?.close();
         }
         this._count = this._getCount();
     }

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

@@ -230,6 +230,18 @@ export class LayerTable {
      * boolean: When true we will not evaluate if the editor has any pending edits
      */
     _skipEditCheck = false;
+    /**
+     * __esri.Handle: highlight handle for the current feature
+     */
+    _currentFeatureHighlightHandle;
+    /**
+     * __esri.Handle: highlight handle for the default features
+     */
+    _defaultFeaturesHandle;
+    /**
+     * __esri.Handle: highlight handle for temporary / hovered feature
+    */
+    _temporaryFeatureHandle;
     /**
      * __esri.Handle: handle for the filter by extent
      */
@@ -246,6 +258,10 @@ export class LayerTable {
      * boolean: When true allow table to update the records
      */
     _shouldUpdateTableOnExtentChange = true;
+    /**
+     * any: layer view of the selected layer
+     */
+    _selectedLayerView;
     //--------------------------------------------------------------------------
     //
     //  Watch handlers
@@ -345,6 +361,19 @@ export class LayerTable {
         if (this.mapView) {
             this._floorExpression = undefined;
             this._searchExpression = undefined;
+            // highlight group for selections
+            this.mapView.highlights = [
+                {
+                    name: "default",
+                    color: "#00FFFF"
+                }, {
+                    name: "current-selection",
+                    color: "#ff00ff"
+                }, {
+                    name: "temporary",
+                    color: "#FFFF00"
+                }
+            ];
             this._updateShareUrl();
             this._mapClickHandle = this.reactiveUtils.on(() => this.mapView, "click", (event) => {
                 void this._mapClicked(event);
@@ -507,6 +536,7 @@ export class LayerTable {
             table.rowHighlightIds.removeAll();
         }
         table.rowHighlightIds.add(oid);
+        this._highlightFeatures(oid);
         if (this.zoomAndScrollToSelected) {
             const i = this._table.viewModel.getObjectIdIndex(oid);
             this._table.scrollToIndex(i);
@@ -625,8 +655,8 @@ export class LayerTable {
         const tableHeightClass = this.isMobile ? "height-full" : "height-full-adjusted";
         const showSearch = this._canShowFullTextSearch();
         this._validateActiveActions();
-        return (h(Host, { key: '407c23b3b63455e5bab7e6c5fd239faae66a313a' }, h("div", { key: '9630101da8fef334861a236101d37f4a2b990dbc' }, h("calcite-scrim", { key: '8e7844a1ba4df87ab8d6fbe4ac9265688f5354dd', class: scrimClass, loading: this._queryingData }), h("calcite-shell", { key: 'd0a5eaa5bdbaf0338125bbdc47c6f1801662b37a' }, this._getTableControlRow("header"), h("div", { key: '6747f6638aa3d1f7380c61451cb522d159e7ddb2', class: `width-full ${tableHeightClass}` }, h("calcite-panel", { key: 'dc5b04234e48d6c466fc514a58eee4ef6c4886ba', class: "height-full width-full" }, showSearch &&
-            h("div", { key: '8aebcf99b0a159e3e7ce8c737f0558f9f147ee9b', class: "search-container border-bottom" }, h("calcite-input", { key: '7e4c1343755a966c4460506d6b1c205a81261155', class: "search", clearable: true, icon: "search", onCalciteInputChange: (evt) => void this._searchTextChanged(evt), placeholder: this._searchPlaceHolder, title: this._searchPlaceHolder, type: "search" })), h("calcite-loader", { key: '2eaa2b221d9e401a0ac1c6b379718b29eb76ea9e', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), h("div", { key: 'fa05975786b02a18c9c9866f3390c2f549d67961', class: tableNodeClass, ref: this.onTableNodeCreate }))), !this.isMobile ? (h("div", { class: "bottom-left text-color height-19", id: "solutions-selected-count-div" }, this._translations.recordsSelected
+        return (h(Host, { key: '2d4fa2f8d4cce83ef1f972444cac99ab17ccf09a' }, h("div", { key: 'b53e3d454a7c2c1886bfd61e960ca7aa27bf5761' }, h("calcite-scrim", { key: '9a0e507b26707b8010f4d0ac3acd5a1eb8820780', class: scrimClass, loading: this._queryingData }), h("calcite-shell", { key: '1f1815e38773a834b7c1f6bdb783717477331522' }, this._getTableControlRow("header"), h("div", { key: 'fd2b3ca04bbb6b5ed9c2e044722079704b1c778e', class: `width-full ${tableHeightClass}` }, h("calcite-panel", { key: '0355028dce084ac034fe4b5ea8f7a0b1fec18b83', class: "height-full width-full" }, showSearch &&
+            h("div", { key: '3169fdf7d876b504c6ee1d11a0b41a55815cbc87', class: "search-container border-bottom" }, h("calcite-input", { key: '116960c2b95658c23c2ed2ee4b5282af0fa44f27', class: "search", clearable: true, icon: "search", onCalciteInputChange: (evt) => void this._searchTextChanged(evt), placeholder: this._searchPlaceHolder, title: this._searchPlaceHolder, type: "search" })), h("calcite-loader", { key: '83fdb600a68786dc0dd0dbbcfee1bc59bd311763', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), h("div", { key: '4983053113d687a459f7749bfe7723964551c3df', class: tableNodeClass, ref: this.onTableNodeCreate }))), !this.isMobile ? (h("div", { class: "bottom-left text-color height-19", id: "solutions-selected-count-div" }, this._translations.recordsSelected
             .replace("{{total}}", total)
             .replace("{{selected}}", selected))) : undefined), this.createFilterModal && this._filterModal())));
     }
@@ -1338,7 +1368,7 @@ export class LayerTable {
                     view: this.mapView,
                     columnReorderingEnabled: this.enableColumnReorder,
                     editingEnabled: this._editEnabled && this.enableInlineEdit,
-                    highlightEnabled: true,
+                    highlightEnabled: false,
                     multiSortEnabled: false,
                     attachmentsEnabled: true,
                     visibleElements: {
@@ -1358,6 +1388,9 @@ export class LayerTable {
                     void this._handleOnChange(evt);
                 });
                 this._table.viewModel.addHandles(changeHandle);
+                this._table.on('cell-pointerover', this.tempHighlightOnHover.bind(this));
+                this._table.on('cell-pointerout', this._removeTempHighlight.bind(this));
+                this._tableNode.addEventListener("mouseleave", this._removeTempHighlight.bind(this));
                 //Add handle to watch size of the table and update the state to reflect the total count
                 const handle = this.reactiveUtils.watch(() => this._table.size, (size) => {
                     this._size = size;
@@ -1376,6 +1409,7 @@ export class LayerTable {
         this._tempSelectedIds = [...this.selectedIds];
         this._finishOnChange();
         this._selectionFromMap = false;
+        this._highlightFeatures(this.selectedIds[0]);
     }
     /**
      * Validate if the editor has any pending edits
@@ -1438,6 +1472,47 @@ export class LayerTable {
         }
         this.featureSelectionChange.emit(this.selectedIds);
     }
+    /**
+     * Highlight feature when hovered over table row
+     * @param e The Feature table pointer over event
+     */
+    tempHighlightOnHover(e) {
+        this._removeTempHighlight();
+        const temporaryFeature = e.feature;
+        this._temporaryFeatureHandle = this._selectedLayerView.highlight([temporaryFeature], { name: "temporary" });
+    }
+    /**
+     * Clears the temporary highlight
+     */
+    _removeTempHighlight() {
+        if (this._temporaryFeatureHandle) {
+            this._temporaryFeatureHandle.remove();
+        }
+    }
+    /**
+     * Highlights the current and secondary features on map
+     * @param currentFeatureId selected current feature id
+     */
+    _highlightFeatures(currentFeatureId) {
+        this._clearHighlights();
+        this._currentFeatureHighlightHandle = this._selectedLayerView.highlight([currentFeatureId], { name: "current-selection" });
+        if (this.selectedIds.length > 1) {
+            const secondaryFeatures = this.selectedIds.filter((id) => id !== currentFeatureId);
+            this._defaultFeaturesHandle = this._selectedLayerView.highlight(secondaryFeatures, { name: "default" });
+        }
+    }
+    /**
+     * Clears the highlights
+     */
+    _clearHighlights() {
+        this._removeTempHighlight();
+        if (this._currentFeatureHighlightHandle) {
+            this._currentFeatureHighlightHandle.remove();
+        }
+        if (this._defaultFeaturesHandle) {
+            this._defaultFeaturesHandle.remove();
+        }
+    }
     /**
      * Reset the tables column templates when we get new column config
      */
@@ -1736,7 +1811,10 @@ export class LayerTable {
                         this._outOFExtentOids = [...this._outOFExtentOids, ...outOids];
                     }
                     if (restoreOids.length > 0) {
-                        this._table.highlightIds.addMany(restoreOids);
+                        // Merge this two array and then highlight the feature to maintain the current feature selection while restoring highlighted features
+                        this.selectedIds = [...new Set([...this.selectedIds, ...restoreOids])];
+                        this._table.highlightIds.removeAll();
+                        this._table.highlightIds.addMany(this.selectedIds.reverse());
                         this._outOFExtentOids = this._outOFExtentOids.filter(oid => !restoreOids.includes(oid));
                     }
                 }
@@ -1834,6 +1912,7 @@ export class LayerTable {
             this._table.viewModel.hideAttachmentsView();
         }
         this._table?.highlightIds.removeAll();
+        this._clearHighlights();
         this._table?.rowHighlightIds.removeAll();
         this._finishOnChange();
     }
@@ -1944,8 +2023,7 @@ export class LayerTable {
      */
     async _zoom() {
         if (this._layer) {
-            const selectedLayerView = await getFeatureLayerView(this.mapView, this._layer.id);
-            await goToSelection(this.selectedIds, selectedLayerView, this.mapView, true, undefined, this.zoomToScale);
+            await goToSelection(this.selectedIds, this._selectedLayerView, this.mapView, true, undefined, this.zoomToScale);
         }
     }
     /**
@@ -1961,7 +2039,8 @@ export class LayerTable {
         if (id !== this._layer?.id || this._featuresEmpty()) {
             this._fetchingData = true;
             const layer = await getLayerOrTable(this.mapView, id);
-            layer && await layer.when(() => {
+            layer && await layer.when(async () => {
+                this._selectedLayerView = await getFeatureLayerView(this.mapView, layer.id);
                 if (this._table && this._table?.viewModel?.attachmentsViewOptions?.objectId) {
                     this._table.viewModel.hideAttachmentsView();
                 }
@@ -2000,8 +2079,6 @@ export class LayerTable {
         if (fieldInfos) {
             columnTemplates = fieldInfos.reduce((prev, cur) => {
                 const template = {
-                    icon: "information",
-                    iconText: cur.description,
                     type: "field",
                     fieldName: cur.name,
                     label: cur.alias,

package/dist/components/basemap-gallery2.js

@@ -124,9 +124,6 @@ const BasemapGallery = /*@__PURE__*/ proxyCustomElement(class BasemapGallery ext
      */
     async _initBaseMapGallery(view) {
         if (this.BasemapGallery) {
-            if (this.basemapWidget) {
-                this.basemapWidget.destroy();
-            }
             const source = new this.PortalBasemapsSource({
                 query: this.basemapConfig?.basemapGroupId ? `id:${this.basemapConfig.basemapGroupId}` : null,
                 filterFunction: this.basemapConfig ? (basemap) => {
@@ -134,11 +131,19 @@ const BasemapGallery = /*@__PURE__*/ proxyCustomElement(class BasemapGallery ext
                 } : () => true
             });
             await source.refresh();
-            this.basemapWidget = new this.BasemapGallery({
-                container: this._basemapElement,
-                view,
-                source
-            });
+            // Don't destroy and re-create this widget as it leads to a duplication
+            // of the basemaps listed
+            if (!this.basemapWidget) {
+                this.basemapWidget = new this.BasemapGallery({
+                    container: this._basemapElement,
+                    view,
+                    source
+                });
+            }
+            else {
+                this.basemapWidget.view = view;
+                this.basemapWidget.source = source;
+            }
         }
     }
     static get watchers() { return {

package/dist/components/card-manager2.js

@@ -144,7 +144,7 @@ const CardManager = /*@__PURE__*/ proxyCustomElement(class CardManager extends H
         const heading = isTable ? this._translations.createRecord : this._translations.createFeature;
         const guideMsg = this.customInfoText ? this.customInfoText : this.selectingFeatureFromMap ? this._translations.selectFeaturesFromMapToStart : this._translations.selectFeaturesToStart;
         const showCreateFeatureOrRecordBtn = this.enableCreateFeatures && this.layer?.capabilities?.operations?.supportsAdd;
-        return (h(Host, { key: '803f5130e6f4fa0bf97cfdd2776e176786e736cc' }, h("div", { key: '7c0a756f5de5f536b52d2e9f6629593eb3c85781', class: "overflow-auto height-full" }, h("calcite-shell", { key: '9a6366bba429d5c29a5f1c556d6812f44d28ee2c', class: "position-relative " + featuresClass }, h("div", { key: '61cb9f7942eb209e5e0bd751ab4b5ca026086882', class: "position-static z-index-500" }, h("info-card", { key: '0c3b6f958384dab4bc1db2917a88215bafe330b1', enableEditGeometry: this.enableEditGeometry, enableSnapping: this.enableSnapping, graphics: this._graphics, isLoading: this._cardLoading, isMobile: this.isMobile, locale: this.locale, mapView: this.mapView, showCloseBtn: true }))), h("calcite-shell", { key: 'db9233d29cc88ddc6cb023bcf9e9190ecb721214', class: "position-relative " + messageClass }, h("calcite-panel", { key: '0d1c22a3ad3d2d2a56054b2e8609697987b45ca7' }, h("div", { key: 'cc5f7faa934f474ddca2d0ab74fd46dac240cc6f', class: "padding-1" }, h("calcite-notice", { key: '2c2771696892455fcb1ec24d895cd321a84a8f49', icon: this.selectingFeatureFromMap ? "map" : "table", iconFlipRtl: true, open: true }, h("div", { key: '0bbbd13e4e9a7b2240a85b41dbd00fc2a7e39c75', slot: "message" }, guideMsg))), !this.isMobile && showCreateFeatureOrRecordBtn && h("calcite-button", { key: '67bac627f68fc6bcda2b1a8965ab6d7fb12d2e4c', disabled: !this.layer, onClick: () => this._createFeatureBtnClicked(), slot: "footer", width: "full" }, isTable ? this._translations.createRecord : this._translations.createFeature))), h("calcite-shell", { key: 'cd44af48bb05fd6ac41c0d66bdd9e01826ece1a4', class: "position-relative " + createFeatureClass }, h("calcite-flow-item", { key: '648dfdc4fb559ecbf64ee43791e3d9799c346f1a', selected: true }, h("calcite-panel", { key: '855df56ed576e52c94dbe3cfa8f6d57427a37ba2', heading: heading }, h("calcite-action", { key: '156d1b20da3f02de66879531802aa2d2fb99b1ca', class: "back-button hydrated", icon: "chevron-left", onClick: this._backFromCreateFeature.bind(this), scale: "s", slot: "header-actions-start", text: "" }), this.getEditorComponent(), this._showSubmitBtn && h("calcite-button", { key: '9b4556876d579a4f2bd02849737cd55b55f87cbd', appearance: "solid", class: "footer-top-button footer-button", onClick: () => void this._createFeature.submit(), slot: "footer", width: "full" }, this._translations.create)))))));
+        return (h(Host, { key: '803f5130e6f4fa0bf97cfdd2776e176786e736cc' }, h("div", { key: '7c0a756f5de5f536b52d2e9f6629593eb3c85781', class: "overflow-auto height-full" }, h("calcite-shell", { key: '9a6366bba429d5c29a5f1c556d6812f44d28ee2c', class: "position-relative " + featuresClass }, h("div", { key: '61cb9f7942eb209e5e0bd751ab4b5ca026086882', class: "position-static z-index-500" }, h("info-card", { key: 'aa2e8443af374a37dfebd0d5e87ca052221339a7', enableEditGeometry: this.enableEditGeometry, enableSnapping: this.enableSnapping, graphics: this._graphics, highlightEnabled: false, isLoading: this._cardLoading, isMobile: this.isMobile, locale: this.locale, mapView: this.mapView, showCloseBtn: true }))), h("calcite-shell", { key: '4979b9d94cd68f36b5d9e6ea59ffc0baecd180c0', class: "position-relative " + messageClass }, h("calcite-panel", { key: '9e02f86010e2348668a995de7d3644f0ddf838a6' }, h("div", { key: '83a5ac2003838734308d81dc2903313cb6c07e9a', class: "padding-1" }, h("calcite-notice", { key: 'e380ab334a7b4d65fb64b51bc2b7feb61771f813', icon: this.selectingFeatureFromMap ? "map" : "table", iconFlipRtl: true, open: true }, h("div", { key: '2ac48545c9c825d8d266a96b034dba7d17c024c1', slot: "message" }, guideMsg))), !this.isMobile && showCreateFeatureOrRecordBtn && h("calcite-button", { key: '300e922dcf00b72657ca48382579746073a1a646', disabled: !this.layer, onClick: () => this._createFeatureBtnClicked(), slot: "footer", width: "full" }, isTable ? this._translations.createRecord : this._translations.createFeature))), h("calcite-shell", { key: '1c279da12e0885ed5ecae714a0958e76ac3734d5', class: "position-relative " + createFeatureClass }, h("calcite-flow-item", { key: '8e54e6abf83e3d8ce487a2f76e1bdd8635f4d7b5', selected: true }, h("calcite-panel", { key: 'd31997df187797550eeaee6df294e4f41e6653b5', heading: heading }, h("calcite-action", { key: '636c83f8d5f361c1eb35a5b524565d0bd072489f', class: "back-button hydrated", icon: "chevron-left", onClick: this._backFromCreateFeature.bind(this), scale: "s", slot: "header-actions-start", text: "" }), this.getEditorComponent(), this._showSubmitBtn && h("calcite-button", { key: 'bd1a3ee472e275c57e9c40c217a3c0ac9c8e8715', 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

package/dist/components/edit-card2.js

@@ -207,7 +207,7 @@ const EditCard = /*@__PURE__*/ proxyCustomElement(class EditCard extends HTMLEle
             !this.graphics[0].layer.editingEnabled : true;
         const tableNodeClass = this._editorLoading ? "display-none" : "position-absolute";
         const loadingClass = this._editorLoading ? "" : "display-none";
-        return (h(Host, { key: 'd67dbfb453966623d26a1567df84bc58024305d7' }, h("div", { key: '9cd13eaf0125ab39e1d24398ccfda17c9534317a', class: "position-absolute" }, editDisabled ? (h("calcite-notice", { kind: "warning", open: true, slot: "content-top", width: "full" }, h("div", { slot: "message" }, this._translations.enableEditing))) : undefined, h("div", { key: '6cb4122611d8d8595cd85cd07224baa374066658', class: "position-absolute" }, h("div", { key: 'c4498b1ecd165fa594d9d1cef43f01643b5e3efb', class: tableNodeClass, id: "feature-form", ref: (el) => this._editContainer = el }), h("calcite-loader", { key: 'febb4d5c9a662ec9ffa6955114c8476c498116ee', class: loadingClass, label: "", scale: "s" })))));
+        return (h(Host, { key: '5d0380d4dbd7412c90e6e3b9aa28b580bf5a6ac4' }, h("div", { key: '29825ee6c26acce86fcb6678d3e3db957358e314', class: "position-absolute" }, editDisabled ? (h("calcite-notice", { kind: "warning", open: true, slot: "content-top", width: "full" }, h("div", { slot: "message" }, this._translations.enableEditing))) : undefined, h("div", { key: '35fc876d6857fb72c8808cff311e894dd9890afe', class: "position-absolute" }, h("div", { key: 'c95f3453d5fc4dac7ba5f1e7db69490405861059', class: tableNodeClass, id: "feature-form", ref: (el) => this._editContainer = el }), h("calcite-loader", { key: '211fd81ec4b13a731a895c882fafcb438fbf235c', class: loadingClass, label: "", scale: "s" })))));
     }
     //--------------------------------------------------------------------------
     //

package/dist/components/info-card2.js

@@ -313,8 +313,8 @@ const InfoCard = /*@__PURE__*/ proxyCustomElement(class InfoCard extends HTMLEle
             });
         }
         else {
-            this._features.clear();
-            this._features.close();
+            this._features?.clear();
+            this._features?.close();
         }
         this._count = this._getCount();
     }

package/dist/components/layer-table2.js

@@ -6,7 +6,7 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { l as loadModules } from './loadModules.js';
 import { g as getLocaleComponentStrings } from './locale.js';
-import { b as goToSelection, c as getFeatureLayerView, g as getLayerOrTable } from './mapViewUtils.js';
+import { b as goToSelection, g as getLayerOrTable, c as getFeatureLayerView } from './mapViewUtils.js';
 import { b as queryFeaturesByGlobalID } from './queryUtils.js';
 import { d as downloadCSV } from './downloadUtils.js';
 import { d as defineCustomElement$1 } from './map-layer-picker2.js';
@@ -236,6 +236,18 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
      * boolean: When true we will not evaluate if the editor has any pending edits
      */
     _skipEditCheck = false;
+    /**
+     * __esri.Handle: highlight handle for the current feature
+     */
+    _currentFeatureHighlightHandle;
+    /**
+     * __esri.Handle: highlight handle for the default features
+     */
+    _defaultFeaturesHandle;
+    /**
+     * __esri.Handle: highlight handle for temporary / hovered feature
+    */
+    _temporaryFeatureHandle;
     /**
      * __esri.Handle: handle for the filter by extent
      */
@@ -252,6 +264,10 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
      * boolean: When true allow table to update the records
      */
     _shouldUpdateTableOnExtentChange = true;
+    /**
+     * any: layer view of the selected layer
+     */
+    _selectedLayerView;
     //--------------------------------------------------------------------------
     //
     //  Watch handlers
@@ -351,6 +367,19 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
         if (this.mapView) {
             this._floorExpression = undefined;
             this._searchExpression = undefined;
+            // highlight group for selections
+            this.mapView.highlights = [
+                {
+                    name: "default",
+                    color: "#00FFFF"
+                }, {
+                    name: "current-selection",
+                    color: "#ff00ff"
+                }, {
+                    name: "temporary",
+                    color: "#FFFF00"
+                }
+            ];
             this._updateShareUrl();
             this._mapClickHandle = this.reactiveUtils.on(() => this.mapView, "click", (event) => {
                 void this._mapClicked(event);
@@ -513,6 +542,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
             table.rowHighlightIds.removeAll();
         }
         table.rowHighlightIds.add(oid);
+        this._highlightFeatures(oid);
         if (this.zoomAndScrollToSelected) {
             const i = this._table.viewModel.getObjectIdIndex(oid);
             this._table.scrollToIndex(i);
@@ -631,8 +661,8 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
         const tableHeightClass = this.isMobile ? "height-full" : "height-full-adjusted";
         const showSearch = this._canShowFullTextSearch();
         this._validateActiveActions();
-        return (h(Host, { key: '407c23b3b63455e5bab7e6c5fd239faae66a313a' }, h("div", { key: '9630101da8fef334861a236101d37f4a2b990dbc' }, h("calcite-scrim", { key: '8e7844a1ba4df87ab8d6fbe4ac9265688f5354dd', class: scrimClass, loading: this._queryingData }), h("calcite-shell", { key: 'd0a5eaa5bdbaf0338125bbdc47c6f1801662b37a' }, this._getTableControlRow("header"), h("div", { key: '6747f6638aa3d1f7380c61451cb522d159e7ddb2', class: `width-full ${tableHeightClass}` }, h("calcite-panel", { key: 'dc5b04234e48d6c466fc514a58eee4ef6c4886ba', class: "height-full width-full" }, showSearch &&
-            h("div", { key: '8aebcf99b0a159e3e7ce8c737f0558f9f147ee9b', class: "search-container border-bottom" }, h("calcite-input", { key: '7e4c1343755a966c4460506d6b1c205a81261155', class: "search", clearable: true, icon: "search", onCalciteInputChange: (evt) => void this._searchTextChanged(evt), placeholder: this._searchPlaceHolder, title: this._searchPlaceHolder, type: "search" })), h("calcite-loader", { key: '2eaa2b221d9e401a0ac1c6b379718b29eb76ea9e', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), h("div", { key: 'fa05975786b02a18c9c9866f3390c2f549d67961', class: tableNodeClass, ref: this.onTableNodeCreate }))), !this.isMobile ? (h("div", { class: "bottom-left text-color height-19", id: "solutions-selected-count-div" }, this._translations.recordsSelected
+        return (h(Host, { key: '2d4fa2f8d4cce83ef1f972444cac99ab17ccf09a' }, h("div", { key: 'b53e3d454a7c2c1886bfd61e960ca7aa27bf5761' }, h("calcite-scrim", { key: '9a0e507b26707b8010f4d0ac3acd5a1eb8820780', class: scrimClass, loading: this._queryingData }), h("calcite-shell", { key: '1f1815e38773a834b7c1f6bdb783717477331522' }, this._getTableControlRow("header"), h("div", { key: 'fd2b3ca04bbb6b5ed9c2e044722079704b1c778e', class: `width-full ${tableHeightClass}` }, h("calcite-panel", { key: '0355028dce084ac034fe4b5ea8f7a0b1fec18b83', class: "height-full width-full" }, showSearch &&
+            h("div", { key: '3169fdf7d876b504c6ee1d11a0b41a55815cbc87', class: "search-container border-bottom" }, h("calcite-input", { key: '116960c2b95658c23c2ed2ee4b5282af0fa44f27', class: "search", clearable: true, icon: "search", onCalciteInputChange: (evt) => void this._searchTextChanged(evt), placeholder: this._searchPlaceHolder, title: this._searchPlaceHolder, type: "search" })), h("calcite-loader", { key: '83fdb600a68786dc0dd0dbbcfee1bc59bd311763', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), h("div", { key: '4983053113d687a459f7749bfe7723964551c3df', class: tableNodeClass, ref: this.onTableNodeCreate }))), !this.isMobile ? (h("div", { class: "bottom-left text-color height-19", id: "solutions-selected-count-div" }, this._translations.recordsSelected
             .replace("{{total}}", total)
             .replace("{{selected}}", selected))) : undefined), this.createFilterModal && this._filterModal())));
     }
@@ -1344,7 +1374,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
                     view: this.mapView,
                     columnReorderingEnabled: this.enableColumnReorder,
                     editingEnabled: this._editEnabled && this.enableInlineEdit,
-                    highlightEnabled: true,
+                    highlightEnabled: false,
                     multiSortEnabled: false,
                     attachmentsEnabled: true,
                     visibleElements: {
@@ -1364,6 +1394,9 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
                     void this._handleOnChange(evt);
                 });
                 this._table.viewModel.addHandles(changeHandle);
+                this._table.on('cell-pointerover', this.tempHighlightOnHover.bind(this));
+                this._table.on('cell-pointerout', this._removeTempHighlight.bind(this));
+                this._tableNode.addEventListener("mouseleave", this._removeTempHighlight.bind(this));
                 //Add handle to watch size of the table and update the state to reflect the total count
                 const handle = this.reactiveUtils.watch(() => this._table.size, (size) => {
                     this._size = size;
@@ -1382,6 +1415,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
         this._tempSelectedIds = [...this.selectedIds];
         this._finishOnChange();
         this._selectionFromMap = false;
+        this._highlightFeatures(this.selectedIds[0]);
     }
     /**
      * Validate if the editor has any pending edits
@@ -1444,6 +1478,47 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
         }
         this.featureSelectionChange.emit(this.selectedIds);
     }
+    /**
+     * Highlight feature when hovered over table row
+     * @param e The Feature table pointer over event
+     */
+    tempHighlightOnHover(e) {
+        this._removeTempHighlight();
+        const temporaryFeature = e.feature;
+        this._temporaryFeatureHandle = this._selectedLayerView.highlight([temporaryFeature], { name: "temporary" });
+    }
+    /**
+     * Clears the temporary highlight
+     */
+    _removeTempHighlight() {
+        if (this._temporaryFeatureHandle) {
+            this._temporaryFeatureHandle.remove();
+        }
+    }
+    /**
+     * Highlights the current and secondary features on map
+     * @param currentFeatureId selected current feature id
+     */
+    _highlightFeatures(currentFeatureId) {
+        this._clearHighlights();
+        this._currentFeatureHighlightHandle = this._selectedLayerView.highlight([currentFeatureId], { name: "current-selection" });
+        if (this.selectedIds.length > 1) {
+            const secondaryFeatures = this.selectedIds.filter((id) => id !== currentFeatureId);
+            this._defaultFeaturesHandle = this._selectedLayerView.highlight(secondaryFeatures, { name: "default" });
+        }
+    }
+    /**
+     * Clears the highlights
+     */
+    _clearHighlights() {
+        this._removeTempHighlight();
+        if (this._currentFeatureHighlightHandle) {
+            this._currentFeatureHighlightHandle.remove();
+        }
+        if (this._defaultFeaturesHandle) {
+            this._defaultFeaturesHandle.remove();
+        }
+    }
     /**
      * Reset the tables column templates when we get new column config
      */
@@ -1742,7 +1817,10 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
                         this._outOFExtentOids = [...this._outOFExtentOids, ...outOids];
                     }
                     if (restoreOids.length > 0) {
-                        this._table.highlightIds.addMany(restoreOids);
+                        // Merge this two array and then highlight the feature to maintain the current feature selection while restoring highlighted features
+                        this.selectedIds = [...new Set([...this.selectedIds, ...restoreOids])];
+                        this._table.highlightIds.removeAll();
+                        this._table.highlightIds.addMany(this.selectedIds.reverse());
                         this._outOFExtentOids = this._outOFExtentOids.filter(oid => !restoreOids.includes(oid));
                     }
                 }
@@ -1840,6 +1918,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
             this._table.viewModel.hideAttachmentsView();
         }
         this._table?.highlightIds.removeAll();
+        this._clearHighlights();
         this._table?.rowHighlightIds.removeAll();
         this._finishOnChange();
     }
@@ -1950,8 +2029,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
      */
     async _zoom() {
         if (this._layer) {
-            const selectedLayerView = await getFeatureLayerView(this.mapView, this._layer.id);
-            await goToSelection(this.selectedIds, selectedLayerView, this.mapView, true, undefined, this.zoomToScale);
+            await goToSelection(this.selectedIds, this._selectedLayerView, this.mapView, true, undefined, this.zoomToScale);
         }
     }
     /**
@@ -1967,7 +2045,8 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
         if (id !== this._layer?.id || this._featuresEmpty()) {
             this._fetchingData = true;
             const layer = await getLayerOrTable(this.mapView, id);
-            layer && await layer.when(() => {
+            layer && await layer.when(async () => {
+                this._selectedLayerView = await getFeatureLayerView(this.mapView, layer.id);
                 if (this._table && this._table?.viewModel?.attachmentsViewOptions?.objectId) {
                     this._table.viewModel.hideAttachmentsView();
                 }
@@ -2006,8 +2085,6 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
         if (fieldInfos) {
             columnTemplates = fieldInfos.reduce((prev, cur) => {
                 const template = {
-                    icon: "information",
-                    iconText: cur.description,
                     type: "field",
                     fieldName: cur.name,
                     label: cur.alias,

package/dist/esm/{asyncToGenerator-96b2368d.js → asyncToGenerator-48cd21fe.js}

@@ -4,7 +4,7 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  */
 import { g as getDefaultExportFromCjs } from './_commonjsHelpers-089957fe.js';
-import { _ as _typeof } from './typeof-ef2a007d.js';
+import { _ as _typeof } from './typeof-2511410e.js';
 
 var defineProperty = {exports: {}};
 

package/dist/esm/basemap-gallery_7.entry.js

@@ -4,7 +4,7 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  */
 import { r as registerInstance, g as getElement, h, H as Host, c as createEvent } from './index-21b6e87e.js';
-import { l as loadModules, g as getLocaleComponentStrings } from './locale-fa8258bf.js';
+import { l as loadModules, g as getLocaleComponentStrings } from './locale-4be8e04f.js';
 import './_commonjsHelpers-089957fe.js';
 
 const basemapGalleryCss = ":host{display:block}";
@@ -123,9 +123,6 @@ const BasemapGallery = class {
      */
     async _initBaseMapGallery(view) {
         if (this.BasemapGallery) {
-            if (this.basemapWidget) {
-                this.basemapWidget.destroy();
-            }
             const source = new this.PortalBasemapsSource({
                 query: this.basemapConfig?.basemapGroupId ? `id:${this.basemapConfig.basemapGroupId}` : null,
                 filterFunction: this.basemapConfig ? (basemap) => {
@@ -133,11 +130,19 @@ const BasemapGallery = class {
                 } : () => true
             });
             await source.refresh();
-            this.basemapWidget = new this.BasemapGallery({
-                container: this._basemapElement,
-                view,
-                source
-            });
+            // Don't destroy and re-create this widget as it leads to a duplication
+            // of the basemaps listed
+            if (!this.basemapWidget) {
+                this.basemapWidget = new this.BasemapGallery({
+                    container: this._basemapElement,
+                    view,
+                    source
+                });
+            }
+            else {
+                this.basemapWidget.view = view;
+                this.basemapWidget.source = source;
+            }
         }
     }
     static get watchers() { return {

package/dist/esm/buffer-tools_2.entry.js

@@ -4,7 +4,7 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  */
 import { r as registerInstance, c as createEvent, g as getElement, h, H as Host } from './index-21b6e87e.js';
-import { l as loadModules, g as getLocaleComponentStrings } from './locale-fa8258bf.js';
+import { l as loadModules, g as getLocaleComponentStrings } from './locale-4be8e04f.js';
 import { f as EDrawMode } from './interfaces-659e3836.js';
 import { s as state } from './publicNotificationStore-9f8e00a1.js';
 import './_commonjsHelpers-089957fe.js';