@esri/solutions-components 0.11.21 → 0.11.23

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

@@ -27,6 +27,7 @@ const CardManager = class {
         this.featureOrRecordSubmitted = createEvent(this, "featureOrRecordSubmitted", 7);
         this.customInfoText = undefined;
         this.enableEditGeometry = false;
+        this.enableSnapping = false;
         this.isMobile = undefined;
         this.layer = undefined;
         this.locale = undefined;
@@ -137,18 +138,18 @@ const CardManager = class {
         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: '5557aa4d80b859335e38db3f4255f4a61d00560f' }, h("div", { key: '6756e3314fc3444a982010a3cfa702d77f05f316', class: "overflow-auto height-full" }, h("calcite-shell", { key: '715eb7ed692a1d00347d44f20df370cf9a91ded5', class: "position-relative " + featuresClass }, h("div", { key: 'baf4e97c1884f477e4077a6dc8e59d98c77593a4', class: "position-static z-index-500" }, h("info-card", { key: '0b9b30182fbc3482e9edf49b79f68aec8cf86adc', enableEditGeometry: this.enableEditGeometry, graphics: this._graphics, isLoading: this._cardLoading, isMobile: this.isMobile, locale: this.locale, mapView: this.mapView, showCloseBtn: true }))), h("calcite-shell", { key: '94b646061956a78dec4f96d9d1d9dedc5ad6aee7', class: "position-relative " + messageClass }, h("calcite-panel", { key: '00b660d474234f8156f3d4c627626f5891754051' }, h("div", { key: 'adb0732ff59c4fdedb19367a32ad9e3e060ddb60', class: "padding-1" }, h("calcite-notice", { key: 'a2c88bd4a0827111b0d1f3056ae571b47e5b380b', icon: this.selectingFeatureFromMap ? "map" : "table", iconFlipRtl: true, open: true }, h("div", { key: 'bffc2630de3f0376b6ea5827c89f65dc605a5356', slot: "message" }, guideMsg))), !this.isMobile && showCreateFeatureOrRecordBtn && h("calcite-button", { key: '08bef5c20d6b60e17abcfc9fc19d7d1eb5d04b1c', disabled: !this.layer, onClick: () => this._createFeatureBtnClicked(), slot: "footer", width: "full" }, isTable ? this._translations.createRecord : this._translations.createFeature))), h("calcite-shell", { key: '833a8de60b491008006034c1696fcb29f1bb6a08', class: "position-relative " + createFeatureClass }, h("calcite-flow-item", { key: 'dd2ae4509e4bec5a90f33484f8a28f422c0eeee4' }, h("calcite-panel", { key: '8fa68650f1933a88cdaf1fee8391cf433b7b54e9', heading: heading }, h("calcite-action", { key: '2b205887ff8703e01ef356cae09ce5d15dbec7c6', 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: '0977a3974583266f6d90e18c8fbbc3e18f803983', 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: '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)))))));
     }
     /**
    * Returns the editor component for adding feature
    * @returns Node
    */
     getEditorComponent() {
-        return (h("div", null, this._showCreateFeatureComponent && h("create-feature", { customizeSubmit: true, locale: this.locale, mapView: this.mapView, onDrawComplete: () => { this._showSubmitBtn = true; }, onEditingAttachment: (evt) => { this._showSubmitBtn = !evt.detail; }, onProgressStatus: () => {
+        return (h("div", null, this._showCreateFeatureComponent && h("create-feature", { customizeSubmit: true, enableSnapping: this.enableSnapping, locale: this.locale, 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, showGuidingMsgWhileDrawing: false })));
+            }, onSuccess: this._featureCreated.bind(this), ref: el => this._createFeature = el, selectedLayerId: this.layer?.id, showGuidingMsg: false, showGuidingMsgWhileDrawing: false })));
     }
     //--------------------------------------------------------------------------
     //
@@ -830,8 +831,8 @@ const LayerTable = class {
         const tableHeightClass = this.isMobile ? "height-full" : "height-full-adjusted";
         const showSearch = this._canShowFullTextSearch();
         this._validateActiveActions();
-        return (h(Host, { key: 'a0a998de3a1b29c311a9fdfa87f3bd836481ba5a' }, h("div", { key: 'aafaf9f925ed7321e1ca7f15fc7db369212dc1dc' }, h("calcite-scrim", { key: '86459aed994823dbf1d774aad01e8207a7df5f4f', class: scrimClass, loading: this._queryingData }), h("calcite-shell", { key: 'b29896a197cba444d2ac377779670394e29ecaf6' }, this._getTableControlRow("header"), h("div", { key: '0456651ac46f399eb04253387d7aae76995f4683', class: `width-full ${tableHeightClass}` }, h("calcite-panel", { key: '9ba484159832fea630bbb653bc2fc4e99e602674', class: "height-full width-full" }, showSearch &&
-            h("div", { key: 'bd4b72db51f44c2954e893e8ef7ec2a30efc4c45', class: "search-container" }, h("calcite-input", { key: '8811ff1dd71408fda37a0d7d2403671df24b5b7b', class: "search", clearable: true, icon: "search", onCalciteInputChange: (evt) => void this._searchTextChanged(evt), placeholder: this._searchPlaceHolder, title: this._searchPlaceHolder, type: "search" })), h("calcite-loader", { key: '44a419089cf1e207f52ce19015c2870ce956e261', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), h("div", { key: '096f4fc7f5cc9500e7982bbfaceb2fcc4c82a1dd', class: tableNodeClass, ref: this.onTableNodeCreate }))), !this.isMobile ? (h("div", { class: "bottom-left text-color height-19" }, this._translations.recordsSelected
+        return (h(Host, { key: '5141283322c3492f26768af0b712df01ebb734ad' }, h("div", { key: '3a1742f91134a896a5cf8298e2359d2370a95b51' }, h("calcite-scrim", { key: 'e50e99752b35ad923bfa2adb005cc004d655c6fb', class: scrimClass, loading: this._queryingData }), h("calcite-shell", { key: '51c5b8cd436c352144f5072ea07f26518b3602f4' }, this._getTableControlRow("header"), h("div", { key: '74ac951ac1a460ed555b70db37d6502585fd702d', class: `width-full ${tableHeightClass}` }, h("calcite-panel", { key: '0afcdaa113b15a7c4a95fb2615f7b8e19bffc5f3', class: "height-full width-full" }, showSearch &&
+            h("div", { key: 'eae1850675897ebf1f2f34a2c13f9b7e19a5b962', class: "search-container" }, h("calcite-input", { key: 'cde8ce3a6bf1d9da95825fc543c7e3d72643a1f6', class: "search", clearable: true, icon: "search", onCalciteInputChange: (evt) => void this._searchTextChanged(evt), placeholder: this._searchPlaceHolder, title: this._searchPlaceHolder, type: "search" })), h("calcite-loader", { key: '78beeb6521f065fd4dbbf233f6807acefcc7fa66', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), h("div", { key: 'bc258046891b9d8ca3e6e67fb16b9b7c909f2bbc', 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())));
     }
@@ -912,16 +913,14 @@ const LayerTable = class {
             this._clearSearchDefinitionExpression();
         }
         let searchedIds = [];
-        if (this._fullTextSearchInfo.length) {
-            if (this._fullTextSearchInfo[0].searchTerm) {
-                const searchQueryParams = this._layer.createQuery();
-                searchQueryParams.fullText = this._fullTextSearchInfo;
-                searchedIds = await this._layer.queryObjectIds(searchQueryParams);
-                if (showSelected && selectedIds?.length) {
-                    searchedIds = searchedIds.filter((id) => selectedIds.includes(id));
-                }
-                await this._updateSearchDefinitionExpression(searchedIds?.length ? searchedIds : [-1]);
+        if (this._fullTextSearchInfo?.length && this._fullTextSearchInfo[0].searchTerm) {
+            const searchQueryParams = this._layer.createQuery();
+            searchQueryParams.fullText = this._fullTextSearchInfo;
+            searchedIds = await this._layer.queryObjectIds(searchQueryParams);
+            if (showSelected && selectedIds?.length) {
+                searchedIds = searchedIds.filter((id) => selectedIds.includes(id));
             }
+            await this._updateSearchDefinitionExpression(searchedIds?.length ? searchedIds : [-1]);
         }
         // highlight the feature only when selected feature is present in applied filter
         if (showSelected && searchedIds?.length) {
@@ -2093,7 +2092,10 @@ const LayerTable = class {
         };
         const fields = this._table.columns.toArray().reduce((prev, cur) => {
             if (!cur.hidden) {
-                prev.push(cur.name.toLocaleLowerCase());
+                const name = cur?.name || cur?.fieldName;
+                if (name) {
+                    prev.push(name.toLocaleLowerCase());
+                }
             }
             return prev;
         }, []);

package/dist/esm/create-feature_4.entry.js

@@ -17,7 +17,7 @@ import './solution-resource-30a29505.js';
 import './restHelpersGet-a7fda344.js';
 import './update-ad0b88fa.js';
 
-const createFeatureCss = ":host{display:block}.esri-editor__panel-toolbar{display:none !important}.esri-editor__panel-content{padding-block:0px !important}.esri-editor .esri-item-list__group__header{display:none !important}.esri-editor__panel-content__section .esri-widget__heading{display:none !important}.esri-editor .esri-item-list__filter-container--sticky{padding-block:0px !important;padding-inline:10px !important}.search-widget{width:92% !important;margin:5px 14px 20px 14px}.display-none{display:none !important}.hide-map{height:1%;visibility:hidden}.show-map{padding:10px !important;position:absolute !important;bottom:0;height:auto !important;width:calc(100% - 22px)}.notice-msg{padding:10px;width:calc(100% - 20px)}.esri-editor__panel-content{padding-block:10px !important}@media only screen and (max-width: 600px){.esri-editor__panel-content{padding-block:0 !important;min-height:0 !important}}";
+const createFeatureCss = ":host{display:block}.hide-editor-toolbar .esri-editor__panel-toolbar{display:none !important}.esri-editor__panel-content{padding-block:0px !important}.esri-editor .esri-item-list__group__header{display:none !important}.esri-editor__panel-content__section .esri-widget__heading{display:none !important}.esri-editor .esri-item-list__filter-container--sticky{padding-block:0px !important;padding-inline:10px !important}.search-widget{width:92% !important;margin:5px 14px 20px 14px}.display-none{display:none !important}.hide-map{height:1%;visibility:hidden}.show-map{padding:10px !important;position:absolute !important;bottom:0;height:auto !important;width:calc(100% - 22px)}.notice-msg{padding:10px;width:calc(100% - 20px)}.esri-editor__panel-content{padding-block:10px !important}@media only screen and (max-width: 600px){.esri-editor__panel-content{padding-block:0 !important;min-height:0 !important}}";
 const CreateFeatureStyle0 = createFeatureCss;
 
 const CreateFeature = class {
@@ -31,6 +31,7 @@ const CreateFeature = class {
         this.modeChanged = createEvent(this, "modeChanged", 7);
         this.customizeSubmit = false;
         this.enableSearch = false;
+        this.enableSnapping = false;
         this.floorLevel = undefined;
         this.formElements = undefined;
         this.isMobile = undefined;
@@ -291,8 +292,8 @@ const CreateFeature = class {
         else if (this._currentPage === 'featureForm') {
             guidingMsg = this._translations.provideDetailsMsg;
         }
-        return (h(Fragment, { key: 'cb3462a70e0097e9b4ac9dac3f910fce6d30f8b5' }, showGuidingMsg && h("calcite-notice", { key: 'ddd908ac4b31f60d07de064ec1decae06b3d93bd', class: "notice-msg", icon: "lightbulb", kind: "success", open: true, ref: el => this._calciteNotice = el }, h("div", { key: '3cee10085fa29190d88d3d03d35f726d1b51651b', slot: "message" }, guidingMsg)), h("calcite-loader", { key: 'cf714d63a011712fa03c148c17a8811356e14859', class: loaderClass, label: "", scale: "s" }), h("div", { key: 'e20cb740a1d22795b397af191a26339d709aba0d', class: featureFormClass, id: "feature-form" }), this.enableSearch &&
-            h("div", { key: 'd2b439d3845b69527fdea2414c7b22078b0af4ea', class: `search-widget ${showSearchWidget} ${featureFormClass}`, id: "search-widget-ref", ref: el => this._searchDiv = el }), h("div", { key: '1f4e39aaaa93f4e2102767c04c5ad256e4f129e2', class: `${mobileMapClass}`, ref: (el) => { this._mapViewContainer = el; } })));
+        return (h(Fragment, { key: '07a1a08a5cd9d8c439870a2500922fbd6839dac9' }, showGuidingMsg && h("calcite-notice", { key: '5d846812fc38f9ca4e9bd997f5bc519fe8a4f21e', class: "notice-msg", icon: "lightbulb", kind: "success", open: true, ref: el => this._calciteNotice = el }, h("div", { key: '8ad1da020a728e19e5d2f3add15ec7c5a8bbdd9f', slot: "message" }, guidingMsg)), h("calcite-loader", { key: '39a0843ca8b16e60a7468908eb00d08a15703756', class: loaderClass, label: "", scale: "s" }), h("div", { key: '1ce7ea5afc559adc1b0d8d8d60696bcf5783453b', class: featureFormClass, id: "feature-form" }), this.enableSearch &&
+            h("div", { key: 'e2832e4a615051a7d0a6cd29de348ef2d0c65cb9', class: `search-widget ${showSearchWidget} ${featureFormClass}`, id: "search-widget-ref", ref: el => this._searchDiv = el }), h("div", { key: 'a3388a9cf013a7c7155119d12835dc996ec9c947', class: `${mobileMapClass}`, ref: (el) => { this._mapViewContainer = el; } })));
     }
     //--------------------------------------------------------------------------
     //
@@ -371,6 +372,9 @@ const CreateFeature = class {
         const layerInfos = [];
         this._container = document.createElement("div");
         this._container?.classList.add("display-none");
+        if (!this.enableSnapping) {
+            this._container.classList.add("hide-editor-toolbar");
+        }
         const allMapLayers = await getAllLayers(this._updatedMapView);
         this._selectedLayer = await getLayerOrTable(this.mapView, this.selectedLayerId);
         // if layer is selected then only use the layerInfos while initializing the editor widget
@@ -390,10 +394,11 @@ const CreateFeature = class {
             view: this._updatedMapView,
             layerInfos: layerInfos,
             visibleElements: {
-                snappingControls: false,
+                settingsMenu: this.enableSnapping,
+                snappingControls: this.enableSnapping,
                 createFeaturesSection: true,
                 editFeaturesSection: false,
-                flow: true
+                flow: false
             },
             container: this._container
         });
@@ -840,7 +845,7 @@ const DeleteButton = class {
 };
 DeleteButton.style = DeleteButtonStyle0;
 
-const editCardCss = ":host{display:block}.padding-bottom-1{padding-bottom:1rem}.font-bold{font-weight:var(--calcite-font-weight-bold)}.font-500{font-weight:var(--calcite-font-weight-medium)}.font-italic{font-style:italic}#feature-form{padding-top:0px}.padding-sides-bottom-1{padding:0 1rem 1rem 1rem}.position-relative{position:relative}.esri-editor__prompt--danger{position:relative !important;width:100% !important;background-color:var(--calcite-color-foreground-1) !important}.esri-feature__content-node{background-color:var(--calcite-color-foreground-1) !important}.esri-editor__panel-toolbar{display:none !important}.position-absolute{position:absolute;top:0;right:0;bottom:0;left:0;overflow:auto}.esri-editor__panel-content{padding-block:10px !important}";
+const editCardCss = ":host{display:block}.padding-bottom-1{padding-bottom:1rem}.font-bold{font-weight:var(--calcite-font-weight-bold)}.font-500{font-weight:var(--calcite-font-weight-medium)}.font-italic{font-style:italic}#feature-form{padding-top:0px}.padding-sides-bottom-1{padding:0 1rem 1rem 1rem}.position-relative{position:relative}.esri-editor__prompt--danger{position:relative !important;width:100% !important;background-color:var(--calcite-color-foreground-1) !important}.esri-feature__content-node{background-color:var(--calcite-color-foreground-1) !important}.hide-editor-toolbar .esri-editor__panel-toolbar{display:none !important}.position-absolute{position:absolute;top:0;right:0;bottom:0;left:0;overflow:auto}.esri-editor__panel-content{padding-block:10px !important}";
 const EditCardStyle0 = editCardCss;
 
 const EditCard = class {
@@ -851,11 +856,12 @@ const EditCard = class {
         this.editsComplete = createEvent(this, "editsComplete", 7);
         this.refreshGraphics = createEvent(this, "refreshGraphics", 7);
         this.enableEditGeometry = false;
+        this.enableSnapping = false;
+        this.graphicIndex = 0;
         this.graphics = undefined;
         this.locale = undefined;
         this.mapView = undefined;
         this.open = false;
-        this.graphicIndex = 0;
         this._editorLoading = false;
         this._translations = undefined;
     }
@@ -1032,7 +1038,7 @@ const EditCard = class {
             !this.graphics[0].layer.editingEnabled : true;
         const tableNodeClass = this._editorLoading ? "display-none" : "position-absolute";
         const loadingClass = this._editorLoading ? "" : "display-none";
-        return (h(Host, { key: 'e181f65e7218ce0350de5dcab9049ff63a5d39c1' }, h("div", { key: '44bf2b5cf31c5acc7f65fb7ec50fd84e77c95470', 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: '97119476aa2a992ccadc1d61119f2640d195e7b1', class: "position-absolute" }, h("div", { key: 'f429decea684a6a22db89de89da3755bdbff19cc', class: tableNodeClass, id: "feature-form", ref: (el) => this._editContainer = el }), h("calcite-loader", { key: '3ea908ef8dadd2f1c85bfac1b344f8b4441b8706', class: loadingClass, label: "", scale: "s" })))));
+        return (h(Host, { key: 'bf9a2cc632deb0cc203f6a2fa837008f8e809482' }, h("div", { key: 'fa2ad6208c2274fe2982b71502d52694e3838162', 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: '98c1d2cb3dce8855b0c792328c893b6947e01f4c', class: "position-absolute" }, h("div", { key: 'ebf21d9145dabcc3b91a4fc44d3a3ae92a6ef5ea', class: tableNodeClass, id: "feature-form", ref: (el) => this._editContainer = el }), h("calcite-loader", { key: 'd3da2a76b0dda07540ca6f65a2f671e825af211a', class: loadingClass, label: "", scale: "s" })))));
     }
     //--------------------------------------------------------------------------
     //
@@ -1073,7 +1079,8 @@ const EditCard = class {
                 layerInfos,
                 visibleElements: {
                     flow: true,
-                    snappingControls: false
+                    settingsMenu: this.enableSnapping,
+                    snappingControls: this.enableSnapping,
                 },
                 container
             });
@@ -1096,6 +1103,9 @@ const EditCard = class {
                     this.open = false;
                 }
             });
+            if (!this.enableSnapping) {
+                container.classList.add("hide-editor-toolbar");
+            }
             // had issues with destroy before adding like this
             this._editContainer.appendChild(container);
             this.editorInitialized.emit(this._editor);
@@ -1155,6 +1165,7 @@ const InfoCard = class {
         this.clearSelection = createEvent(this, "clearSelection", 7);
         this.selectionChanged = createEvent(this, "selectionChanged", 7);
         this.enableEditGeometry = false;
+        this.enableSnapping = false;
         this.graphics = undefined;
         this.isLoading = false;
         this.isMobile = undefined;
@@ -1395,8 +1406,8 @@ const InfoCard = class {
         // if user has navigated to the related feature then pass the related feature to the graphics
         const graphics = this._relatedFeature ? [this._relatedFeature] : this.graphics;
         const selectedFeatureIndex = this._navigatedToRelatedFeature ? 0 : this._features?.selectedFeatureIndex;
-        return (h(Host, { key: '7662ad49543f574bbcb58f2b9611efefc0420259' }, h("calcite-shell", { key: '10075ee9cdf4d9e8a6dee615755c53eaaece8c21', style: { position: this.position } }, this._getHeader(), h("calcite-loader", { key: 'fc668f26163e1135d37a5dee1c08d72d7feee9d5', class: loadingClass, label: this._translations.fetchingData }), h("div", { key: '73faf27901ae65feaf4faae8227aa21bfb1fb0a3', class: "esri-widget feature-node " + featureNodeClass, id: this._featuresNodeId }), h("div", { key: 'ced1edadc747dd7a087fed7b0a8e378def491381', class: `${editButtonClass} width-100`, slot: "footer" }, this.allowEditing &&
-            h("div", { key: '3f1ab07a2d197730d03497d0c5c5a2970e0f42ec', class: "display-flex top-border padding-1-2" }, h("calcite-button", { key: '946cb64983426ce95c8a209aa7ae59405124709f', appearance: "solid", id: "solutions-edit", onClick: () => this._openEditRecord(), width: "full" }, this._translations.edit), this.isMobile && deleteEnabled ? (h("delete-button", { class: "padding-inline-start-1 width-100", id: "solutions-delete", ids: ids, layer: this._layer, locale: this.locale, onEditsComplete: () => this._closePopup() })) : undefined, h("calcite-tooltip", { key: '4123a740f077f6d203ae75338655a3e4f988b3dd', placement: "bottom", "reference-element": "solutions-edit" }, h("span", { key: '6968a12b2f41737cb221bc7ddbcab834f990fe3c' }, this._translations.edit)), this.isMobile && deleteEnabled ? (h("calcite-tooltip", { placement: "bottom", "reference-element": "solutions-delete" }, h("span", null, this._translations.delete))) : undefined), this.paginationEnabled && !nextBackDisabled && h("div", { key: '31d228643a734df28880c009f8d9a989f07acedb', class: `display-flex padding-1-2 button-container top-border ${nextBackClass}` }, h("div", { key: 'f1dd88d8e5359e8acfc3508890185f8769365ec8' }, h("calcite-button", { key: '86190bfd8442bcf327c8aa60272a4071dead2dbc', appearance: 'transparent', disabled: nextBackDisabled, iconFlipRtl: "both", iconStart: "chevron-left", id: "solutions-back", onClick: () => this._back(), width: "full" }), h("calcite-tooltip", { key: '6cf40e219e228547636a228d306dc6fc2929d186', placement: "top", "reference-element": "solutions-back" }, h("span", { key: '39a43c0568c3d9e71587d3e3a38970a97f16efa4' }, this._translations.back))), h("calcite-action", { key: '373330d9385477e7b8701bff969d93ccf992f8b6', class: 'pagination-action', iconFlipRtl: true, onClick: () => this._toggleListView(), scale: "s", text: "", textEnabled: true }, h("span", { key: 'badd298438061c4c61b5f5561d0883fd063d1434', class: "pagination-count" }, this._count)), h("div", { key: '501d8970243fa398721c9db04cff5491f59fe045' }, h("calcite-button", { key: '9118e14df5f7932e91e823a5bd35fe6292af1c07', appearance: "transparent", disabled: nextBackDisabled, iconFlipRtl: "both", iconStart: "chevron-right", id: "solutions-next", onClick: () => this._next(), width: "full" }), h("calcite-tooltip", { key: '29a22347603b730ab160023667bb1fc7654e69d4', placement: "top", "reference-element": "solutions-next" }, h("span", { key: '2404d5b018b0e6478a366d995c61e6ec40e9e486' }, this._translations.next))))), h("edit-card", { key: 'cad638e12cf79d7efbc8d4fa05da14ddd1140197', class: editClass, enableEditGeometry: this.enableEditGeometry, graphicIndex: selectedFeatureIndex, graphics: graphics, locale: this.locale, mapView: this.mapView, open: this._editRecordOpen }), h("calcite-alert", { key: 'b0ce00184f525e8156d282e5efd30962b018e226', icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { key: '35f655f6dc9c274b07ccafe769e8e9af357862d1', slot: "title" }, this._translations.editDisabled), h("div", { key: 'e2b8de0fdb5eac8b37e5bb2a872fd390d9b42d29', slot: "message" }, this._translations.enableEditing)))));
+        return (h(Host, { key: '5b379325eff02faa0cc5bb93b625f63e75dac557' }, h("calcite-shell", { key: 'ce3b54deb9c64f8f6a4ec58a8dce37bb738e1307', style: { position: this.position } }, this._getHeader(), h("calcite-loader", { key: '3c2824073847b85b0a7a455c1e5ea1dc1d92169a', class: loadingClass, label: this._translations.fetchingData }), h("div", { key: '02645c7bc0a5e0c20a7888f6fc6e5ac0c913b908', class: "esri-widget feature-node " + featureNodeClass, id: this._featuresNodeId }), h("div", { key: 'f7168748d005c4347295b9f85ebac29f49f197d2', class: `${editButtonClass} width-100`, slot: "footer" }, this.allowEditing &&
+            h("div", { key: '5ff5d61eb97f46789d781ed1c7d3a446542f3a68', class: "display-flex top-border padding-1-2" }, h("calcite-button", { key: '632f599ee2da0ea49baf4ee5fcff47434b3f2e8d', appearance: "solid", id: "solutions-edit", onClick: () => this._openEditRecord(), width: "full" }, this._translations.edit), this.isMobile && deleteEnabled ? (h("delete-button", { class: "padding-inline-start-1 width-100", id: "solutions-delete", ids: ids, layer: this._layer, locale: this.locale, onEditsComplete: () => this._closePopup() })) : undefined, h("calcite-tooltip", { key: '15673c1194d9ce01d6441330423352f54539158d', placement: "bottom", "reference-element": "solutions-edit" }, h("span", { key: 'bf7f3c471e66a6902863a667642fb49eb2d98938' }, this._translations.edit)), this.isMobile && deleteEnabled ? (h("calcite-tooltip", { placement: "bottom", "reference-element": "solutions-delete" }, h("span", null, this._translations.delete))) : undefined), this.paginationEnabled && !nextBackDisabled && h("div", { key: '337417e71ee660dff91793b99a74983ca765d616', class: `display-flex padding-1-2 button-container top-border ${nextBackClass}` }, h("div", { key: '6425566f26dfd1a3e35b44823f7727ddffe80efc' }, h("calcite-button", { key: '7f6cf491407741b95b3f1c2e1d533f903dd402a6', appearance: 'transparent', disabled: nextBackDisabled, iconFlipRtl: "both", iconStart: "chevron-left", id: "solutions-back", onClick: () => this._back(), width: "full" }), h("calcite-tooltip", { key: '1c209dd4229b3b3f1490563f722d19247454cb8f', placement: "top", "reference-element": "solutions-back" }, h("span", { key: '5cdbe55fddd53f430171e286ca0cf7785c564f92' }, this._translations.back))), h("calcite-action", { key: '3964c9e101508084299235ab4e4e15dedd1cd3fd', class: 'pagination-action', iconFlipRtl: true, onClick: () => this._toggleListView(), scale: "s", text: "", textEnabled: true }, h("span", { key: '3bc52707b7eac70e13caf9d2a24a09fc09456cf9', class: "pagination-count" }, this._count)), h("div", { key: '7c70dd2f40d1b799aa5c053e623cd43dc1da1594' }, h("calcite-button", { key: '9251259b306f5f0a13f953c742be7ea0606f1a2a', appearance: "transparent", disabled: nextBackDisabled, iconFlipRtl: "both", iconStart: "chevron-right", id: "solutions-next", onClick: () => this._next(), width: "full" }), h("calcite-tooltip", { key: '4634f29cf4e5c212f1f0fd46c6e5505b2f0d8dfe', placement: "top", "reference-element": "solutions-next" }, h("span", { key: 'f6480bb70598aa89547256af8867ab657e17aece' }, this._translations.next))))), h("edit-card", { key: '467a508438eceac82d387238edfaf3da7c644da9', class: editClass, enableEditGeometry: this.enableEditGeometry, enableSnapping: this.enableSnapping, graphicIndex: selectedFeatureIndex, graphics: graphics, locale: this.locale, mapView: this.mapView, open: this._editRecordOpen }), h("calcite-alert", { key: '53eba21ad693a3655d695fd1d1ae6211f7f1c68a', icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { key: '01ecc5c16948cd9f140d523cdc21dee1e45b4bcc', slot: "title" }, this._translations.editDisabled), h("div", { key: 'ae30d08e51b01a2eb1c7d3a6f276ba15b7ccf849', slot: "message" }, this._translations.enableEditing)))));
     }
     //--------------------------------------------------------------------------
     //

package/dist/esm/create-related-feature_3.entry.js

@@ -6,11 +6,11 @@
 import { r as registerInstance, c as createEvent, g as getElement, h, F as Fragment } from './index-df5db8e9.js';
 import { l as loadModules, g as getLocaleComponentStrings, f as formatNumber } from './locale-7874c756.js';
 import { b as getAllTables, d as getMapLayerHash, a as getAllLayers, c as getFeatureLayerView } from './mapViewUtils-9da9be1c.js';
-import './esri-loader-c6842c6b.js';
-import './_commonjsHelpers-089957fe.js';
+import { e as esriLoader } from './esri-loader-c6842c6b.js';
 import './interfaces-659e3836.js';
+import './_commonjsHelpers-089957fe.js';
 
-const createRelatedFeatureCss = ":host{display:block}.esri-editor__panel-toolbar{display:none !important}.display-none{display:none !important}.esri-editor__panel-content{padding-block:10px !important}.notice-msg{padding:10px;width:calc(100% - 20px)}";
+const createRelatedFeatureCss = ":host{display:block}.hide-editor-toolbar .esri-editor__panel-toolbar{display:none !important}.display-none{display:none !important}.esri-editor__panel-content{padding-block:10px !important}.notice-msg{padding:10px;width:calc(100% - 20px)}";
 const CreateRelatedFeatureStyle0 = createRelatedFeatureCss;
 
 const CreateRelatedFeature = class {
@@ -20,12 +20,13 @@ const CreateRelatedFeature = class {
         this.fail = createEvent(this, "fail", 7);
         this.isActionPending = createEvent(this, "isActionPending", 7);
         this.formReady = createEvent(this, "formReady", 7);
+        this.customizeSubmit = false;
+        this.enableSnapping = false;
         this.locale = undefined;
         this.mapView = undefined;
-        this.table = undefined;
         this.selectedFeature = undefined;
-        this.customizeSubmit = false;
         this.showGuidingMsg = true;
+        this.table = undefined;
         this._editorLoading = false;
         this._translations = undefined;
     }
@@ -40,23 +41,23 @@ const CreateRelatedFeature = class {
      * The Editor constructor
      */
     Editor;
-    /**
-   * esri/widgets/Editor: https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Editor.html
-   * The Editor instance
-   */
-    _editor;
     /**
      * esri/core/reactiveUtils: https://developers.arcgis.com/javascript/latest/api-reference/esri-core-reactiveUtils.html
      */
     reactiveUtils;
+    /**
+     * boolean: Flag to maintain the add attachment
+     */
+    _addingAttachment;
     /**
      * HTMLDivElement: The node the editor will be added to
      */
     _container;
     /**
-     * boolean: Flag to maintain the add attachment
-     */
-    _addingAttachment;
+   * esri/widgets/Editor: https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Editor.html
+   * The Editor instance
+   */
+    _editor;
     /**
      * boolean: Flag to maintain form submission using submit button
      */
@@ -164,7 +165,7 @@ const CreateRelatedFeature = class {
     }
     render() {
         const loaderClass = this._editorLoading ? "" : "display-none";
-        return (h(Fragment, { key: '261308f81b5bbed3e136efbb2100db9c1e5994a4' }, this.showGuidingMsg && h("calcite-notice", { key: '3aca1d3f48e46208ce07f2ccdd76ac4af752162d', class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, h("div", { key: 'f449d7dcde1cc75bf7470a75ae0ce915ef457459', slot: "message" }, this._translations.provideDetailsMsg)), h("calcite-loader", { key: 'e94e971b96ddba0ab36f27ffd4e37b820bb2432f', class: loaderClass, label: "", scale: "s" })));
+        return (h(Fragment, { key: '5251d18b13ed90499cd960305773b6fb04efd4db' }, this.showGuidingMsg && h("calcite-notice", { key: '9f2902f8dab476734d3a70fad4e5cc7996f721a8', class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, h("div", { key: '650f56b689cde544c96e24a966da7283efcdfcbe', slot: "message" }, this._translations.provideDetailsMsg)), h("calcite-loader", { key: 'be4c67978909e7dcf18fe8dece831b8830dee5d1', class: loaderClass, label: "", scale: "s" })));
     }
     /**
      * StencilJS: Called once just after the component is fully loaded and the first render() occurs.
@@ -190,11 +191,15 @@ const CreateRelatedFeature = class {
         }
         this._container = document.createElement("div");
         this._container?.classList.add("display-none");
+        if (!this.enableSnapping) {
+            this._container.classList.add("hide-editor-toolbar");
+        }
         this._editor = new this.Editor({
             view: this.mapView,
             visibleElements: {
                 flow: true,
-                snappingControls: false
+                settingsMenu: this.enableSnapping,
+                snappingControls: this.enableSnapping,
             },
             container: this._container
         });
@@ -370,6 +375,7 @@ const FeatureDetails = class {
         this.addComment = createEvent(this, "addComment", 7);
         this.likeOrDislikeClicked = createEvent(this, "likeOrDislikeClicked", 7);
         this.featureSelectionChange = createEvent(this, "featureSelectionChange", 7);
+        this.enableSnapping = false;
         this.mapView = undefined;
         this.graphics = undefined;
         this.reportingOptions = undefined;
@@ -524,12 +530,12 @@ const FeatureDetails = class {
     render() {
         //When related features found show comments list of only those features else comments list will be empty
         const commentsListWhereClause = this._relatedFeaturesOIDs?.length > 0 ? `objectId in(${this._relatedFeaturesOIDs})` : '1=0';
-        return (h("calcite-panel", { key: '577f06f7bc41875b38e07a44f3c734ccc839e596', "full-height": true }, h("info-card", { key: 'e815f75d02bcdfe9cc11796c913be2a6c2bfecd2', allowEditing: false, graphics: this.graphics, highlightEnabled: false, isLoading: false, isMobile: false, locale: this.locale, mapView: this.mapView, onSelectionChanged: (e) => { this.featureSelectionChange.emit(e.detail); }, paginationEnabled: false, position: "relative", ref: el => this._infoCard = el }), (this._likeFieldAvailable || this._dislikeFieldAvailable || this._commentsAvailable) &&
-            h("div", { key: '16d0af6b0e75b595573bd0816744f03d9d6dec37', class: "buttons-container" }, this._commentsAvailable &&
-                h("calcite-button", { key: '550b3af830911a1437fa3e967492666ec8c5a2e4', appearance: "transparent", iconEnd: "speech-bubble", kind: "neutral", onClick: () => { this.addComment.emit(); }, scale: 'm' }, this._relatedFeaturesOIDs.length), this._likeFieldAvailable &&
-                h("calcite-button", { key: '741848445c2083f4c0a3d9464cd810deee4a1218', appearance: "transparent", iconEnd: "thumbs-up", kind: this._isLikeBtnClicked ? "brand" : "neutral", loading: this._updating, onClick: this.onLikeButtonClick.bind(this), scale: 'm' }, this._likeCount ?? this._selectedGraphic.attributes[this._likeField] ?? 0), this._dislikeFieldAvailable &&
-                h("calcite-button", { key: '4d5e8ae279559dbf981b1b91238706adbd6ebeef', appearance: "transparent", iconEnd: "thumbs-down", kind: this._isDislikeBtnClicked ? "brand" : "neutral", loading: this._updating, onClick: this.onDislikeButtonClick.bind(this), scale: 'm' }, this._disLikeCount ?? this._selectedGraphic.attributes[this._dislikeField] ?? 0)), this.relatedTableId && this._commentsAvailable &&
-            h("feature-list", { key: '0daad9b37b13a05afc4b8a3a6eca70a7356afd8f', class: "height-full", locale: this.locale, mapView: this.mapView, onFeatureSelect: (e) => { this.commentSelect.emit(e.detail); }, pageSize: 5, ref: el => this._commentsList = el, selectedLayerId: this.relatedTableId, showErrorWhenNoFeatures: false, showFullTitle: this.showFullCommentTitle, showInitialLoading: false, showUserImageInList: this.showUserImageInCommentsList, textSize: "small", whereClause: commentsListWhereClause })));
+        return (h("calcite-panel", { key: '9fea2f56281419fd95720cd6b0f7369017d975b0', "full-height": true }, h("info-card", { key: 'ae9f7a316ba49b59dbbfaeb011aa3475b70f809b', allowEditing: false, enableSnapping: this.enableSnapping, graphics: this.graphics, highlightEnabled: false, isLoading: false, isMobile: false, locale: this.locale, mapView: this.mapView, onSelectionChanged: (e) => { this.featureSelectionChange.emit(e.detail); }, paginationEnabled: false, position: "relative", ref: el => this._infoCard = el }), (this._likeFieldAvailable || this._dislikeFieldAvailable || this._commentsAvailable) &&
+            h("div", { key: '7da88cf71d12c05321895a04d8e4039d74a466e9', class: "buttons-container" }, this._commentsAvailable &&
+                h("calcite-button", { key: 'ebc7b32a69c551fe8e2a8dd10d69cde8b9078e4f', appearance: "transparent", iconEnd: "speech-bubble", kind: "neutral", onClick: () => { this.addComment.emit(); }, scale: 'm' }, this._relatedFeaturesOIDs.length), this._likeFieldAvailable &&
+                h("calcite-button", { key: 'ef43f47829ebb6b04dbaaf7a20ee9848d9c21c87', appearance: "transparent", iconEnd: "thumbs-up", kind: this._isLikeBtnClicked ? "brand" : "neutral", loading: this._updating, onClick: this.onLikeButtonClick.bind(this), scale: 'm' }, this._likeCount ?? this._selectedGraphic.attributes[this._likeField] ?? 0), this._dislikeFieldAvailable &&
+                h("calcite-button", { key: '64651be363c2d1a5083002dcad4bff4d040a396a', appearance: "transparent", iconEnd: "thumbs-down", kind: this._isDislikeBtnClicked ? "brand" : "neutral", loading: this._updating, onClick: this.onDislikeButtonClick.bind(this), scale: 'm' }, this._disLikeCount ?? this._selectedGraphic.attributes[this._dislikeField] ?? 0)), this.relatedTableId && this._commentsAvailable &&
+            h("feature-list", { key: 'fff5e1ce72310a5a41b2223578165011026e1b8c', class: "height-full", locale: this.locale, mapView: this.mapView, onFeatureSelect: (e) => { this.commentSelect.emit(e.detail); }, pageSize: 5, ref: el => this._commentsList = el, selectedLayerId: this.relatedTableId, showErrorWhenNoFeatures: false, showFullTitle: this.showFullCommentTitle, showInitialLoading: false, showUserImageInList: this.showUserImageInCommentsList, textSize: "small", whereClause: commentsListWhereClause })));
     }
     /**
      * Load esri javascript api modules
@@ -818,6 +824,7 @@ const LayerList = class {
         this.showFeatureCount = true;
         this.showNextIcon = false;
         this.applyLayerViewFilter = false;
+        this.filterByMapExtent = false;
         this._noLayersToDisplay = false;
         this._mapLayerIds = [];
         this._isLoading = false;
@@ -833,6 +840,14 @@ const LayerList = class {
      * ILayerItemHash: id/name lookup
      */
     _layerItemsHash;
+    /**
+     * esri/core/reactiveUtils: https://developers.arcgis.com/javascript/latest/api-reference/esri-core-reactiveUtils.html
+     */
+    reactiveUtils;
+    /**
+     * __esri.Handle: Handle for filter by map extent
+     */
+    _filterByMapExtentHandle;
     //--------------------------------------------------------------------------
     //
     //  Watch handlers
@@ -846,6 +861,17 @@ const LayerList = class {
         this.el.lang = this.locale;
         await this._getTranslations();
     }
+    /**
+     * Watch for filterByMapExtent change and update the layer list
+     */
+    filterByMapExtentWatchHandler(enabled) {
+        if (enabled) {
+            this.initializeMapExtentFilter();
+        }
+        else if (this._filterByMapExtentHandle) {
+            this._filterByMapExtentHandle.remove();
+        }
+    }
     //--------------------------------------------------------------------------
     //
     //  Methods (public)
@@ -882,7 +908,11 @@ const LayerList = class {
      * @returns Promise when complete
      */
     async componentWillLoad() {
+        await this.initModules();
         await this._getTranslations();
+        if (this.filterByMapExtent) {
+            this.initializeMapExtentFilter();
+        }
     }
     /**
      * StencilJS: Called once just after the component is fully loaded and the first render() occurs.
@@ -894,15 +924,37 @@ const LayerList = class {
      * Renders the component.
      */
     render() {
-        return (h(Fragment, { key: 'a151c8fd65c50aacb23dcd0c858e52c0c7cd7e5e' }, this._isLoading && h("calcite-loader", { key: '544a134bccc29048ca80b996844cc944bcd97a24', label: "", scale: "m" }), !this._isLoading && this.mapView && this._noLayersToDisplay &&
-            h("calcite-notice", { key: '7557f91c8c3349c120c043ea59458b4c834dce2e', class: "error-msg", icon: "layers-reference", kind: "danger", open: true }, h("div", { key: 'ea8b20f8c7da5053641cfad56e3395ae3c6286f5', slot: "title" }, this._translations.error), h("div", { key: '38aaed7b456aba0b1dd70183be03e9133834dfb4', slot: "message" }, this._translations.noLayerToDisplayErrorMsg)), !this._isLoading && this.mapView &&
-            h("calcite-list", { key: '547b0681145fd8d8663b786472be9e5161cbd693', label: "", "selection-appearance": "border", "selection-mode": "none" }, this.renderLayerList())));
+        return (h(Fragment, { key: 'ac83dce884ea72ee461cc628efb51bce08cf4ce5' }, this._isLoading && h("calcite-loader", { key: '77d15458f7a081acdae63f26ffaf7b2a5ca143ec', label: "", scale: "m" }), !this._isLoading && this.mapView && this._noLayersToDisplay &&
+            h("calcite-notice", { key: 'd48169628cdaf271a1263f1ef3218a98e64897f1', class: "error-msg", icon: "layers-reference", kind: "danger", open: true }, h("div", { key: 'e5568829b5c90524f0d9313e4812d30837609db2', slot: "title" }, this._translations.error), h("div", { key: '13f04655936656439c1119c56a0f7f919994f402', slot: "message" }, this._translations.noLayerToDisplayErrorMsg)), !this._isLoading && this.mapView &&
+            h("calcite-list", { key: 'b20eeb9052c5f75a2bf798e797ec928d37729484', label: "", "selection-appearance": "border", "selection-mode": "none" }, this.renderLayerList())));
     }
     //--------------------------------------------------------------------------
     //
     //  Functions (protected)
     //
     //--------------------------------------------------------------------------
+    /**
+     * Load esri javascript api modules
+     * @returns Promise resolving when function is done
+     * @protected
+     */
+    async initModules() {
+        const [reactiveUtils] = await esriLoader.exports.loadModules([
+            "esri/core/reactiveUtils"
+        ]);
+        this.reactiveUtils = reactiveUtils;
+    }
+    /**
+     * Updates the layer list based on map view extent
+     * @protected
+     */
+    initializeMapExtentFilter() {
+        this._filterByMapExtentHandle = this.reactiveUtils.when(() => this.mapView.stationary, () => {
+            void this.setLayers();
+        }, {
+            initial: true
+        });
+    }
     /**
      * Fetch the ids of the layers from the map
      * @returns Promise when the operation has completed
@@ -939,6 +991,7 @@ const LayerList = class {
                             q.where = q.where ? q.where + ' AND ' + featureLayerView.filter.where : featureLayerView.filter.where;
                         }
                     }
+                    q.geometry = this.filterByMapExtent ? this.mapView.extent : null;
                     const result = eachLayer.queryFeatureCount(q);
                     def.push(result);
                     void result.then(async (resCount) => {
@@ -1023,7 +1076,8 @@ const LayerList = class {
         this._translations = messages[0];
     }
     static get watchers() { return {
-        "locale": ["localeWatchHandler"]
+        "locale": ["localeWatchHandler"],
+        "filterByMapExtent": ["filterByMapExtentWatchHandler"]
     }; }
 };
 LayerList.style = LayerListStyle0;

package/dist/esm/crowdsource-manager.entry.js

@@ -42,6 +42,7 @@ const CrowdsourceManager = class {
         this.enableLegend = true;
         this.enableSearch = true;
         this.enableShare = false;
+        this.enableSnapping = true;
         this.enableZoom = true;
         this.locale = undefined;
         this.mapInfos = [];
@@ -266,7 +267,7 @@ const CrowdsourceManager = class {
     render() {
         // only avoid border when we have a header color that is not white
         const borderClass = this.popupHeaderColor && this.popupHeaderColor !== "#FFFFFF" ? "border-width-0" : "";
-        return (h(Host, { key: '4ec349cf53a543077a3b938d5dad2e767f533181' }, h("calcite-shell", { key: '08c56e11ff814419aeb7295bba240b0e96856cae', class: "position-relative" }, h("calcite-panel", { key: 'aac7ff804b7e98f3b5d1b11dbc5ee8e18c9467ca', class: `width-full height-full ${borderClass}`, loading: this._isLoading }, this._getBody(this._layoutMode, this._panelOpen, this._hideTable)), this._getFooter()), this._filterModal(), this._deleteModal()));
+        return (h(Host, { key: '1d30ec71032cffd61c016cc846f59a8e437253de' }, h("calcite-shell", { key: '836f6e8cde7c3e5b177803b607e26a41bdea42a3', class: "position-relative" }, h("calcite-panel", { key: '0c968ccf6d19aa754b56dc5a3714e3b6f44dcac9', class: `width-full height-full ${borderClass}`, loading: this._isLoading }, this._getBody(this._layoutMode, this._panelOpen, this._hideTable)), this._getFooter()), this._filterModal(), this._deleteModal()));
     }
     /**
      * Called after each render
@@ -477,7 +478,9 @@ const CrowdsourceManager = class {
         const containerClass = this._isPortraitMobile && this._hideTable ? "position-absolute-0 width-full height-full" : this._isPortraitMobile ? "display-none height-0" : "";
         const tableViewClass = this.mapInfos?.length > 1 && this.appLayout === "tableView" ? "position-relative top-51" : "";
         // position-sticky added to avoid an issue where this dialog would overlap the delete message modal in some small screens
-        return (h("div", { class: `${headerTheme} ${popupNodeClass} ${containerClass} ${tableViewClass} position-sticky`, style: {
+        // position-sticky not set when in tableView as it will cause the map-picker to not be visible
+        const stickyClass = this.appLayout !== "tableView" ? "position-sticky" : "";
+        return (h("div", { class: `${headerTheme} ${popupNodeClass} ${containerClass} ${tableViewClass} ${stickyClass}`, style: {
                 '--calcite-color-foreground-1': this.popupHeaderColor, /* background color that will be displayed on the popup header */
                 '--calcite-color-foreground-2': this.popupHeaderHoverColor, /* background color that will be displayed on button when hovered */
                 '--calcite-color-text-3': this.popupHeaderTextColor, /* font color that will be displayed on button */
@@ -495,7 +498,7 @@ const CrowdsourceManager = class {
         const isTableLayout = this.appLayout === 'tableView';
         const cardManagerHeight = isTableLayout && this.mapInfos?.length > 1 ? "adjusted-height-100-51" : isMapLayout || isTableLayout ? "height-full" : (this._numSelected > 0 && !this._isMobile) ? "height-50" : !this._showInformationHeader ? "adjusted-height-50_25" : !this._isPortraitMobile ? "height-50" : "height-full";
         const themeClass = this.theme === "dark" ? "calcite-mode-dark" : "calcite-mode-light";
-        return (h("div", { class: `width-50 height-full ${themeClass}` }, h("card-manager", { class: `${cardManagerHeight} width-full`, customInfoText: this.customInfoText, enableCreateFeatures: this._enableCreateFeatures && !this._isMobile, enableEditGeometry: this?._mapInfo?.enableEditGeometry, isMobile: this._isPortraitMobile, layer: this._layer, locale: this.locale, mapView: this?._mapView, onBackFromCreateWorkFlow: () => {
+        return (h("div", { class: `width-50 height-full ${themeClass}` }, h("card-manager", { class: `${cardManagerHeight} width-full`, customInfoText: this.customInfoText, enableCreateFeatures: this._enableCreateFeatures && !this._isMobile, enableEditGeometry: this?._mapInfo?.enableEditGeometry, enableSnapping: this.enableSnapping, isMobile: this._isPortraitMobile, layer: this._layer, locale: this.locale, mapView: this?._mapView, onBackFromCreateWorkFlow: () => {
                 this._showInformationHeader = true;
             }, onCreateWorkFlowStarted: () => {
                 this.appLayout = this._layer.isTable ? "tableView" : "mapView";