@esri/solutions-components 0.8.5 → 0.8.7

package/dist/collection/collection-manifest.json

@@ -7,6 +7,7 @@
     "components/consent-manager/consent-manager.js",
     "components/create-feature/create-feature.js",
     "components/crowdsource-manager/crowdsource-manager.js",
+    "components/layer-list/layer-list.js",
     "components/crowdsource-reporter/crowdsource-reporter.js",
     "components/deduct-calculator/deduct-calculator.js",
     "components/delete-button/delete-button.js",
@@ -18,7 +19,6 @@
     "components/floor-filter/floor-filter.js",
     "components/info-card/info-card.js",
     "components/json-editor/json-editor.js",
-    "components/layer-list/layer-list.js",
     "components/layer-table/layer-table.js",
     "components/layout-manager/layout-manager.js",
     "components/list-flow-item/list-flow-item.js",

package/dist/collection/components/create-feature/create-feature.css

@@ -47,4 +47,13 @@
 .esri-editor .esri-item-list__filter-container--sticky {
   padding-block: 0px !important;
   padding-inline: 10px !important;
+}
+
+.search-widget {
+  width: 92% !important;
+  margin: 5px 0 20px 14px;
+}
+
+.display-none {
+  display: none !important;
 }

package/dist/collection/components/create-feature/create-feature.js

@@ -18,14 +18,16 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { Host, h } from "@stencil/core";
+import { Fragment, h } from "@stencil/core";
 import { loadModules } from "../../utils/loadModules";
-import { getAllLayers } from "../../utils/mapViewUtils";
+import { getAllLayers, getLayerOrTable } from "../../utils/mapViewUtils";
 export class CreateFeature {
     constructor() {
         this.mapView = undefined;
         this.selectedLayerId = undefined;
         this.customizeSubmit = false;
+        this.searchConfiguration = undefined;
+        this.showSearchWidget = undefined;
     }
     //--------------------------------------------------------------------------
     //
@@ -85,7 +87,8 @@ export class CreateFeature {
      * Renders the component.
      */
     render() {
-        return (h(Host, { id: "feature-form" }));
+        const showSearchWidget = this.showSearchWidget ? '' : 'display-none';
+        return (h(Fragment, null, h("div", { id: "feature-form" }), h("div", { class: `search-widget ${showSearchWidget}`, id: "search-widget-ref" })));
     }
     //--------------------------------------------------------------------------
     //
@@ -93,11 +96,12 @@ export class CreateFeature {
     //
     //--------------------------------------------------------------------------
     /**
-     * Init Editor widget and starts the create workflow
+     * Init Editor widget and Search widget
      */
     async init() {
         if (this.mapView && this.selectedLayerId) {
             await this.createEditorWidget();
+            await this.createSearchWidget();
         }
     }
     /**
@@ -106,12 +110,14 @@ export class CreateFeature {
      * @protected
      */
     async initModules() {
-        const [Editor, reactiveUtils] = await loadModules([
+        const [Editor, reactiveUtils, Search] = await loadModules([
             "esri/widgets/Editor",
-            "esri/core/reactiveUtils"
+            "esri/core/reactiveUtils",
+            "esri/widgets/Search"
         ]);
         this.Editor = Editor;
         this.reactiveUtils = reactiveUtils;
+        this.Search = Search;
     }
     /**
      * Display editor widget to create the new feature
@@ -165,6 +171,13 @@ export class CreateFeature {
             }
         });
         this._editor.viewModel.addHandles(handle);
+        //Add handle to watch editor viewmodel state and then show the search widget
+        const formHandle = this.reactiveUtils.watch(() => this._editor.viewModel.state, (state) => {
+            if (state === 'creating-features') {
+                this.showSearchWidget = true;
+            }
+        });
+        this._editor.viewModel.addHandles(formHandle);
     }
     /**
      * Start creating the feature
@@ -183,6 +196,7 @@ export class CreateFeature {
                     //on sketch complete emit the event
                     this._editor.viewModel.sketchViewModel.on("create", (evt) => {
                         if (evt.state === "complete") {
+                            this.showSearchWidget = false;
                             this.drawComplete.emit();
                         }
                     });
@@ -199,6 +213,94 @@ export class CreateFeature {
             this.hideEditorsElements();
         }
     }
+    /**
+     * Display search widget to search location
+     * @protected
+     */
+    async createSearchWidget() {
+        let searchOptions = {
+            view: this.mapView,
+        };
+        if (this.searchConfiguration) {
+            const searchConfiguration = this._getSearchConfig(this.searchConfiguration, this.mapView);
+            searchOptions = Object.assign({}, searchConfiguration);
+        }
+        this._search = new this.Search(searchOptions);
+        this._search.container = 'search-widget-ref';
+        this._search.popupEnabled = false;
+        this._search.resultGraphicEnabled = false;
+        const layer = await getLayerOrTable(this.mapView, this.selectedLayerId);
+        let pointGeometry = null;
+        // on search get the geometry of the searched location and pass it in sketchViewModel and go to featureForm page
+        this._search.on('search-complete', (e) => {
+            var _a;
+            void this.mapView.goTo(e.results[0].results[0].extent);
+            if (layer.geometryType === 'point') {
+                pointGeometry = (_a = e.results[0].results[0]) === null || _a === void 0 ? void 0 : _a.feature.geometry;
+            }
+        });
+        //Add handle to watch if search viewModel state is ready
+        const createFeatureHandle = this.reactiveUtils.watch(() => this._search.viewModel.state, (state) => {
+            if (state === 'ready') {
+                setTimeout(() => {
+                    if (this._editor.viewModel.sketchViewModel.createGraphic && pointGeometry) {
+                        this._editor.viewModel.sketchViewModel.createGraphic.set('geometry', pointGeometry);
+                        this._editor.viewModel.sketchViewModel.complete();
+                        this.hideEditorsElements();
+                    }
+                }, 100);
+            }
+        });
+        this._search.viewModel.addHandles(createFeatureHandle);
+    }
+    /**
+     * Initialize the search widget based on user defined configuration
+     *
+     * @param searchConfiguration search configuration defined by the user
+     * @param view the current map view
+     *
+     * @protected
+     */
+    _getSearchConfig(searchConfiguration, view) {
+        const INCLUDE_DEFAULT_SOURCES = "includeDefaultSources";
+        const sources = searchConfiguration.sources;
+        if ((sources === null || sources === void 0 ? void 0 : sources.length) > 0) {
+            searchConfiguration[INCLUDE_DEFAULT_SOURCES] = false;
+            sources.forEach((source) => {
+                var _a, _b;
+                const isLayerSource = source.hasOwnProperty("layer");
+                if (isLayerSource) {
+                    const layerSource = source;
+                    const layerId = (_a = layerSource.layer) === null || _a === void 0 ? void 0 : _a.id;
+                    const layerFromMap = layerId ? view.map.findLayerById(layerId) : null;
+                    const layerUrl = (_b = layerSource === null || layerSource === void 0 ? void 0 : layerSource.layer) === null || _b === void 0 ? void 0 : _b.url;
+                    if (layerFromMap) {
+                        layerSource.layer = layerFromMap;
+                    }
+                    else if (layerUrl) {
+                        layerSource.layer = new this.FeatureLayer(layerUrl);
+                    }
+                }
+            });
+            sources === null || sources === void 0 ? void 0 : sources.forEach((source) => {
+                const isLocatorSource = source.hasOwnProperty("locator");
+                if (isLocatorSource) {
+                    const locatorSource = source;
+                    if ((locatorSource === null || locatorSource === void 0 ? void 0 : locatorSource.name) === "ArcGIS World Geocoding Service") {
+                        const outFields = locatorSource.outFields || ["Addr_type", "Match_addr", "StAddr", "City"];
+                        locatorSource.outFields = outFields;
+                        locatorSource.singleLineFieldName = "SingleLine";
+                    }
+                    locatorSource.url = locatorSource.url;
+                    delete locatorSource.url;
+                }
+            });
+        }
+        else {
+            searchConfiguration = Object.assign(Object.assign({}, searchConfiguration), { includeDefaultSources: true });
+        }
+        return searchConfiguration;
+    }
     /**
      * Hides the elements of editor widget
      * @protected
@@ -319,9 +421,35 @@ export class CreateFeature {
                 "attribute": "customize-submit",
                 "reflect": false,
                 "defaultValue": "false"
+            },
+            "searchConfiguration": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "ISearchConfiguration",
+                    "resolved": "ISearchConfiguration",
+                    "references": {
+                        "ISearchConfiguration": {
+                            "location": "import",
+                            "path": "../../utils/interfaces",
+                            "id": "src/utils/interfaces.ts::ISearchConfiguration"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "ISearchConfiguration: Configuration details for the Search widget"
+                }
             }
         };
     }
+    static get states() {
+        return {
+            "showSearchWidget": {}
+        };
+    }
     static get events() {
         return [{
                 "method": "success",

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

@@ -45,6 +45,7 @@ export class CrowdsourceManager {
          */
         this._shouldSetMapView = false;
         this.appProxies = undefined;
+        this.basemapConfig = undefined;
         this.defaultCenter = "";
         this.defaultGlobalId = "";
         this.defaultLayer = "";
@@ -52,26 +53,27 @@ export class CrowdsourceManager {
         this.defaultOid = "";
         this.defaultWebmap = "";
         this.enableAutoRefresh = false;
+        this.enableBasemap = true;
         this.enableColumnReorder = true;
         this.enableCSV = true;
         this.enableFloorFilter = true;
         this.enableFullscreen = true;
+        this.enableHome = true;
         this.enableInlineEdit = false;
         this.enableLegend = true;
         this.enableSearch = true;
         this.enableShare = false;
-        this.enableHome = true;
         this.enableZoom = true;
-        this.enableBasemap = true;
-        this.basemapConfig = undefined;
-        this.showNewestFirst = true;
+        this.hideMapOnLoad = undefined;
         this.mapInfos = [];
         this.onlyShowUpdatableLayers = true;
         this.searchConfiguration = undefined;
         this.shareIncludeEmbed = undefined;
         this.shareIncludeSocial = undefined;
+        this.showNewestFirst = true;
         this.theme = "light";
         this.zoomAndScrollToSelected = false;
+        this.zoomToScale = undefined;
         this._expandPopup = false;
         this._hideFooter = false;
         this._hideTable = false;
@@ -522,6 +524,27 @@ export class CrowdsourceManager {
                 "attribute": "app-proxies",
                 "reflect": false
             },
+            "basemapConfig": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "IBasemapConfig",
+                    "resolved": "IBasemapConfig",
+                    "references": {
+                        "IBasemapConfig": {
+                            "location": "import",
+                            "path": "../../utils/interfaces",
+                            "id": "src/utils/interfaces.ts::IBasemapConfig"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "IBasemapConfig: List of any basemaps to filter out from the basemap widget"
+                }
+            },
             "defaultCenter": {
                 "type": "string",
                 "mutable": false,
@@ -648,7 +671,7 @@ export class CrowdsourceManager {
                 "reflect": false,
                 "defaultValue": "false"
             },
-            "enableColumnReorder": {
+            "enableBasemap": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -660,13 +683,13 @@ export class CrowdsourceManager {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "boolean: when true the layer table will support drag/drop of columns to adjust order"
+                    "text": "boolean: when true the basemap widget will be available"
                 },
-                "attribute": "enable-column-reorder",
+                "attribute": "enable-basemap",
                 "reflect": false,
                 "defaultValue": "true"
             },
-            "enableCSV": {
+            "enableColumnReorder": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -678,13 +701,13 @@ export class CrowdsourceManager {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "boolean: when true the export to csv button will be available"
+                    "text": "boolean: when true the layer table will support drag/drop of columns to adjust order"
                 },
-                "attribute": "enable-c-s-v",
+                "attribute": "enable-column-reorder",
                 "reflect": false,
                 "defaultValue": "true"
             },
-            "enableFloorFilter": {
+            "enableCSV": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -696,13 +719,13 @@ export class CrowdsourceManager {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "boolean: when true the fullscreen widget will be available"
+                    "text": "boolean: when true the export to csv button will be available"
                 },
-                "attribute": "enable-floor-filter",
+                "attribute": "enable-c-s-v",
                 "reflect": false,
                 "defaultValue": "true"
             },
-            "enableFullscreen": {
+            "enableFloorFilter": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -716,11 +739,11 @@ export class CrowdsourceManager {
                     "tags": [],
                     "text": "boolean: when true the fullscreen widget will be available"
                 },
-                "attribute": "enable-fullscreen",
+                "attribute": "enable-floor-filter",
                 "reflect": false,
                 "defaultValue": "true"
             },
-            "enableInlineEdit": {
+            "enableFullscreen": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -732,13 +755,13 @@ export class CrowdsourceManager {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "boolean: when true edits can be applied directly within the table"
+                    "text": "boolean: when true the fullscreen widget will be available"
                 },
-                "attribute": "enable-inline-edit",
+                "attribute": "enable-fullscreen",
                 "reflect": false,
-                "defaultValue": "false"
+                "defaultValue": "true"
             },
-            "enableLegend": {
+            "enableHome": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -750,13 +773,13 @@ export class CrowdsourceManager {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "boolean: when true the legend widget will be available"
+                    "text": "boolean: when true the home widget will be available"
                 },
-                "attribute": "enable-legend",
+                "attribute": "enable-home",
                 "reflect": false,
                 "defaultValue": "true"
             },
-            "enableSearch": {
+            "enableInlineEdit": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -768,13 +791,13 @@ export class CrowdsourceManager {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "boolean: when true the search widget will be available"
+                    "text": "boolean: when true edits can be applied directly within the table"
                 },
-                "attribute": "enable-search",
+                "attribute": "enable-inline-edit",
                 "reflect": false,
-                "defaultValue": "true"
+                "defaultValue": "false"
             },
-            "enableShare": {
+            "enableLegend": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -786,13 +809,13 @@ export class CrowdsourceManager {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "boolean: when true the share widget will be available"
+                    "text": "boolean: when true the legend widget will be available"
                 },
-                "attribute": "enable-share",
+                "attribute": "enable-legend",
                 "reflect": false,
-                "defaultValue": "false"
+                "defaultValue": "true"
             },
-            "enableHome": {
+            "enableSearch": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -804,13 +827,13 @@ export class CrowdsourceManager {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "boolean: when true the home widget will be available"
+                    "text": "boolean: when true the search widget will be available"
                 },
-                "attribute": "enable-home",
+                "attribute": "enable-search",
                 "reflect": false,
                 "defaultValue": "true"
             },
-            "enableZoom": {
+            "enableShare": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -822,13 +845,13 @@ export class CrowdsourceManager {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "boolean: when true the zoom widget will be available"
+                    "text": "boolean: when true the share widget will be available"
                 },
-                "attribute": "enable-zoom",
+                "attribute": "enable-share",
                 "reflect": false,
-                "defaultValue": "true"
+                "defaultValue": "false"
             },
-            "enableBasemap": {
+            "enableZoom": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -840,34 +863,13 @@ export class CrowdsourceManager {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "boolean: when true the basemap widget will be available"
+                    "text": "boolean: when true the zoom widget will be available"
                 },
-                "attribute": "enable-basemap",
+                "attribute": "enable-zoom",
                 "reflect": false,
                 "defaultValue": "true"
             },
-            "basemapConfig": {
-                "type": "unknown",
-                "mutable": false,
-                "complexType": {
-                    "original": "IBasemapConfig",
-                    "resolved": "IBasemapConfig",
-                    "references": {
-                        "IBasemapConfig": {
-                            "location": "import",
-                            "path": "../../utils/interfaces",
-                            "id": "src/utils/interfaces.ts::IBasemapConfig"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "IBasemapConfig: List of any basemaps to filter out from the basemap widget"
-                }
-            },
-            "showNewestFirst": {
+            "hideMapOnLoad": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -879,11 +881,10 @@ export class CrowdsourceManager {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "boolean: when true the table will be sorted by objectid in descending order by default"
+                    "text": "boolean: when true the map will be hidden on load"
                 },
-                "attribute": "show-newest-first",
-                "reflect": false,
-                "defaultValue": "true"
+                "attribute": "hide-map-on-load",
+                "reflect": false
             },
             "mapInfos": {
                 "type": "unknown",
@@ -980,6 +981,24 @@ export class CrowdsourceManager {
                 "attribute": "share-include-social",
                 "reflect": false
             },
+            "showNewestFirst": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "boolean: when true the table will be sorted by objectid in descending order by default"
+                },
+                "attribute": "show-newest-first",
+                "reflect": false,
+                "defaultValue": "true"
+            },
             "theme": {
                 "type": "string",
                 "mutable": false,
@@ -1021,6 +1040,23 @@ export class CrowdsourceManager {
                 "attribute": "zoom-and-scroll-to-selected",
                 "reflect": false,
                 "defaultValue": "false"
+            },
+            "zoomToScale": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "number: default scale to zoom to when zooming to a single point feature"
+                },
+                "attribute": "zoom-to-scale",
+                "reflect": false
             }
         };
     }

package/dist/collection/components/crowdsource-reporter/crowdsource-reporter.css

@@ -56,3 +56,8 @@
 .footer-button {
   height: 35px;
 }
+
+.report-submitted-msg {
+  position: absolute;
+  z-index: 1000;
+}