@esri/solutions-components 0.8.5 → 0.8.6-6.2

package/dist/collection/collection-manifest.json

@@ -1,24 +1,26 @@
 {
   "entries": [
+    "components/layer-list/layer-list.js",
     "components/arcgis-login/arcgis-login.js",
     "components/basemap-gallery/basemap-gallery.js",
     "components/buffer-tools/buffer-tools.js",
     "components/card-manager/card-manager.js",
     "components/consent-manager/consent-manager.js",
     "components/create-feature/create-feature.js",
+    "components/create-related-feature/create-related-feature.js",
     "components/crowdsource-manager/crowdsource-manager.js",
     "components/crowdsource-reporter/crowdsource-reporter.js",
     "components/deduct-calculator/deduct-calculator.js",
     "components/delete-button/delete-button.js",
     "components/edit-card/edit-card.js",
     "components/feature-comments/feature-comments.js",
+    "components/feature-details/feature-details.js",
     "components/feature-form-flow-item/feature-form-flow-item.js",
     "components/feature-list/feature-list.js",
     "components/features-flow-item/features-flow-item.js",
     "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",
@@ -54,8 +56,8 @@
   ],
   "compiler": {
     "name": "@stencil/core",
-    "version": "4.9.0",
-    "typescriptVersion": "5.2.2"
+    "version": "4.19.2",
+    "typescriptVersion": "5.4.5"
   },
   "collections": [
     {
@@ -74,6 +76,9 @@
         "calcite-block-section",
         "calcite-button",
         "calcite-card",
+        "calcite-card-group",
+        "calcite-carousel",
+        "calcite-carousel-item",
         "calcite-checkbox",
         "calcite-chip",
         "calcite-chip-group",
@@ -156,6 +161,7 @@
         "calcite-tabs",
         "calcite-text-area",
         "calcite-tile",
+        "calcite-tile-group",
         "calcite-tile-select",
         "calcite-tile-select-group",
         "calcite-time-picker",
@@ -174,6 +180,7 @@
       "tags": [
         "instant-apps-ckeditor-wrapper",
         "instant-apps-control-panel",
+        "instant-apps-create",
         "instant-apps-export",
         "instant-apps-filter-list",
         "instant-apps-header",
@@ -198,6 +205,7 @@
         "instant-apps-popover",
         "instant-apps-popovers",
         "instant-apps-scoreboard",
+        "instant-apps-sign-in",
         "instant-apps-social-share",
         "instant-apps-splash"
       ]

package/dist/collection/components/arcgis-login/arcgis-login.js

@@ -56,7 +56,7 @@ export class ArcgisLogin {
     //
     //--------------------------------------------------------------------------
     render() {
-        return (h(Host, null, h("slot", null)));
+        return (h(Host, { key: 'b71ecf635ef91c3604665890c3eec5c5bc51651c' }, h("slot", { key: '77c4af2284404bc351b1eb93a81b2151f8e8cce1' })));
     }
     static get is() { return "arcgis-login"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/basemap-gallery/basemap-gallery.js

@@ -61,7 +61,7 @@ export class BasemapGallery {
      * StencilJS: Renders the component.
      */
     render() {
-        return (h(Host, null, h("div", { ref: (el) => { this._basemapElement = el; } })));
+        return (h(Host, { key: '7fe5ef48d77de087f17498e2e1f3370a069e8629' }, h("div", { key: 'aca555c687352046a138343cab6f656234069644', ref: (el) => { this._basemapElement = el; } })));
     }
     /**
      * StencilJS: Called once just after the component is fully loaded and the first render() occurs.

package/dist/collection/components/buffer-tools/buffer-tools.js

@@ -84,7 +84,7 @@ export class BufferTools {
      * Renders the component.
      */
     render() {
-        return (h(Host, null, this.appearance === "text" ? this._getTextBoxDisplay() : this._getSliderDisplay()));
+        return (h(Host, { key: '63b775eca8dd10785df7b58be3a79eaa6cf4c049' }, this.appearance === "text" ? this._getTextBoxDisplay() : this._getSliderDisplay()));
     }
     //--------------------------------------------------------------------------
     //

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

@@ -86,7 +86,7 @@ export class CardManager {
         var _a, _b;
         const featuresClass = ((_a = this._graphics) === null || _a === void 0 ? void 0 : _a.length) > 0 ? "" : "display-none";
         const messageClass = ((_b = this._graphics) === null || _b === void 0 ? void 0 : _b.length) > 0 ? "display-none" : "";
-        return (h(Host, null, h("div", { class: "overflow-auto height-full" }, h("calcite-shell", { class: "position-relative " + featuresClass }, h("div", null, h("info-card", { graphics: this._graphics, isLoading: this._cardLoading, isMobile: this.isMobile, mapView: this.mapView, zoomAndScrollToSelected: this.zoomAndScrollToSelected }))), h("calcite-shell", { class: "position-relative " + messageClass }, h("div", { class: "padding-1" }, h("calcite-notice", { icon: "table", open: true }, h("div", { slot: "message" }, this._translations.selectFeaturesToStart)))))));
+        return (h(Host, { key: '343554e5408de156f1973f6d1e3daa8f1ba90675' }, h("div", { key: '1852562a795002314236052351cab7c29d36854e', class: "overflow-auto height-full" }, h("calcite-shell", { key: '684f013e4397bc50743526357384f782a88a5cd3', class: "position-relative " + featuresClass }, h("div", { key: 'db6d9f4be5448b5596b22f2a4f49c6baefa88466' }, h("info-card", { key: 'be5cec81cae7ca00a5b57c8d9590541f78b67fbd', graphics: this._graphics, isLoading: this._cardLoading, isMobile: this.isMobile, mapView: this.mapView }))), h("calcite-shell", { key: 'df34e0ae6978298130970c60d21203f52fa32e4b', class: "position-relative " + messageClass }, h("div", { key: '9525a95dd21745e211ebf888da44eca6a6c17721', class: "padding-1" }, h("calcite-notice", { key: 'ade0e0a2f09bbe7b7bda6fdb2ce65ba81121e633', icon: "table", open: true }, h("div", { key: 'd6fce2d657e23738720e004177c510c3273017f4', slot: "message" }, this._translations.selectFeaturesToStart)))))));
     }
     //--------------------------------------------------------------------------
     //

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

@@ -56,6 +56,7 @@ export class ConsentManager {
     /**
      * Initialize and return the telemetry instance if consent has been granted
      */
+    // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents
     async getInstance() {
         if (localStorage.getItem(this.firstUseVar) === "true") {
             await this._init();

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,21 @@
  * 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() {
+        /**
+         * boolean: Flag to maintain form submission using submit button
+         */
+        this._isSubmitBtnClicked = false;
         this.mapView = undefined;
         this.selectedLayerId = undefined;
         this.customizeSubmit = false;
+        this.searchConfiguration = undefined;
+        this._editorLoading = false;
+        this._showSearchWidget = undefined;
     }
     //--------------------------------------------------------------------------
     //
@@ -33,13 +40,25 @@ export class CreateFeature {
     //
     //--------------------------------------------------------------------------
     /**
-    * Called each time the mapView prop is changed.
-    */
+     * Called each time the mapView prop is changed.
+     */
     async mapViewWatchHandler() {
         await this.mapView.when(async () => {
             await this.init();
         });
     }
+    /**
+     * When _editorLoading is true the container node will be hidden while starting the create workflow
+     */
+    async _editorLoadingWatchHandler(v) {
+        var _a, _b;
+        if (v) {
+            (_a = this._container) === null || _a === void 0 ? void 0 : _a.classList.add("display-none");
+            await this.startCreate();
+            (_b = this._container) === null || _b === void 0 ? void 0 : _b.classList.remove("display-none");
+            this._editorLoading = false;
+        }
+    }
     //--------------------------------------------------------------------------
     //
     //  Methods (public)
@@ -60,6 +79,7 @@ export class CreateFeature {
      */
     async submit() {
         if (this._editor) {
+            this._isSubmitBtnClicked = true;
             this._editor.viewModel.featureFormViewModel.submit();
         }
     }
@@ -85,7 +105,10 @@ export class CreateFeature {
      * Renders the component.
      */
     render() {
-        return (h(Host, { id: "feature-form" }));
+        const showSearchWidget = this._showSearchWidget ? '' : 'display-none';
+        const loaderClass = this._editorLoading ? "" : "display-none";
+        const featureFormClass = this._editorLoading ? "display-none" : "";
+        return (h(Fragment, { key: 'a4ccd565a52a4cde4e76439629425f19bd4c222e' }, h("calcite-loader", { key: '30e8a3753985a734dd7cba461f26691b51f49ab9', class: loaderClass, label: "", scale: "s" }), h("div", { key: '0845f1fa85a21b578fd18200b43d4a77c34e6808', class: featureFormClass, id: "feature-form" }), h("div", { key: 'af74b6337f5a0dcfdbd552145c88eae5282a3307', class: `search-widget ${showSearchWidget} ${featureFormClass}`, id: "search-widget-ref" })));
     }
     //--------------------------------------------------------------------------
     //
@@ -93,11 +116,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,31 +130,35 @@ 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
      * @protected
      */
     async createEditorWidget() {
+        var _a;
         if (this._editor) {
             this._editor.destroy();
         }
         const layerInfos = [];
-        const container = document.createElement("div");
+        this._container = document.createElement("div");
+        (_a = this._container) === null || _a === void 0 ? void 0 : _a.classList.add("display-none");
         const allMapLayers = await getAllLayers(this.mapView);
         // eslint-disable-next-line @typescript-eslint/no-misused-promises
         allMapLayers.forEach(async (eachLayer) => {
             layerInfos.push({
                 layer: eachLayer,
                 enabled: (eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.type) === "feature" && (eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.id) === this.selectedLayerId,
-                addEnabled: true,
-                updateEnabled: false,
+                addEnabled: true, // default is true, set to false to disable the ability to add a new feature
+                updateEnabled: false, // default is true, set to false to disable the ability to edit an existing feature
                 deleteEnabled: false // default is true, set to false to disable the ability to delete features
             });
         });
@@ -141,9 +169,9 @@ export class CreateFeature {
             visibleElements: {
                 snappingControls: false
             },
-            container
+            container: this._container
         });
-        this.el.appendChild(container);
+        this.el.appendChild(this._container);
         //Add handle to watch if attachments are added/edited
         const attachmentHandle = this.reactiveUtils.watch(() => this._editor.viewModel.state, (state) => {
             if (state === 'adding-attachment' || state === 'editing-attachment') {
@@ -161,64 +189,172 @@ export class CreateFeature {
         //Add handle to watch featureTemplatesViewModel ready state and then start the creation
         const handle = this.reactiveUtils.watch(() => this._editor.viewModel.featureTemplatesViewModel.state, (state) => {
             if (state === 'ready') {
-                void this.startCreate();
+                this.progressStatus.emit(0.5);
+                this._editorLoading = true;
             }
         });
         this._editor.viewModel.addHandles(handle);
+        //Add handle to watch featureFormViewModel ready state
+        const formHandle = this.reactiveUtils.watch(() => { var _a; return (_a = this._editor.viewModel.featureFormViewModel) === null || _a === void 0 ? void 0 : _a.state; }, (state) => {
+            if (state === 'ready') {
+                this._showSearchWidget = false;
+                this.progressStatus.emit(1);
+                this.drawComplete.emit();
+            }
+        });
+        this._editor.viewModel.addHandles(formHandle);
+        //Add handle to watch editor viewmodel state and then show the search widget
+        const createFeatureHandle = this.reactiveUtils.watch(() => this._editor.viewModel.state, (state) => {
+            if (state === 'creating-features') {
+                this._editorLoading = true;
+                this._showSearchWidget = true;
+            }
+        });
+        this._editor.viewModel.addHandles(createFeatureHandle);
     }
     /**
      * Start creating the feature
      * @protected
      */
     async startCreate() {
-        var _a;
-        if ((_a = this._editor.viewModel.featureTemplatesViewModel.items) === null || _a === void 0 ? void 0 : _a.length) {
-            const items = this._editor.viewModel.featureTemplatesViewModel.items[0].get("items");
-            //once the feature template is selected handle the event for formSubmit and sketch complete
-            //also, hide the headers and footer in the editor as we will be showing our own submit and cancel button
-            this._editor.viewModel.featureTemplatesViewModel.on('select', () => {
+        return new Promise((resolve, reject) => {
+            var _a;
+            if ((_a = this._editor.viewModel.featureTemplatesViewModel.items) === null || _a === void 0 ? void 0 : _a.length) {
+                const items = this._editor.viewModel.featureTemplatesViewModel.items[0].get("items");
+                //once the feature template is selected handle the event for formSubmit and sketch complete
+                //also, hide the headers and footer in the editor as we will be showing our own submit and cancel button
+                this._editor.viewModel.featureTemplatesViewModel.on('select', () => {
+                    this.progressStatus.emit(0.75);
+                    setTimeout(() => {
+                        //on form submit
+                        this._editor.viewModel.featureFormViewModel.on('submit', this.submitted.bind(this));
+                        //hides the header and footer elements in editor widget
+                        this.hideEditorsElements().then(() => {
+                            resolve({});
+                        }, e => reject(e));
+                    }, 700);
+                });
+                //if only one feature template then directly start geometry creation for that
+                //else allow feature template selection to user
+                if (items.length === 1) {
+                    this._editor.viewModel.featureTemplatesViewModel.select(items[0]);
+                }
+                const resolvePromise = items.length > 1;
+                this.hideEditorsElements().then(() => {
+                    if (resolvePromise) {
+                        resolve({});
+                    }
+                }, e => resolvePromise && reject(e));
+            }
+        });
+    }
+    /**
+     * 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(() => {
-                    //on form submit 
-                    this._editor.viewModel.featureFormViewModel.on('submit', this.submitted.bind(this));
-                    //on sketch complete emit the event
-                    this._editor.viewModel.sketchViewModel.on("create", (evt) => {
-                        if (evt.state === "complete") {
-                            this.drawComplete.emit();
-                        }
-                    });
-                    this.hideEditorsElements();
-                }, 700);
-                this.hideEditorsElements();
-            });
-            //if only one feature template then directly start geometry creation for that
-            //else allow feature template selection to user
-            if (items.length === 1) {
-                this._editor.viewModel.featureTemplatesViewModel.select(items[0]);
+                    if (this._editor.viewModel.sketchViewModel.createGraphic && pointGeometry) {
+                        this._editor.viewModel.sketchViewModel.createGraphic.set('geometry', pointGeometry);
+                        this._editor.viewModel.sketchViewModel.complete();
+                        void this.hideEditorsElements();
+                    }
+                }, 100);
             }
-            //hides the header and footer elements in editor widget
-            this.hideEditorsElements();
+        });
+        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
      */
-    hideEditorsElements() {
+    async hideEditorsElements() {
+        var _a, _b;
         if (!this.customizeSubmit) {
             return;
         }
-        setTimeout(() => {
-            var _a;
-            //hides the header and footer on the featureForm
-            (_a = this.el.querySelector('.esri-editor').querySelectorAll('calcite-flow-item')) === null || _a === void 0 ? void 0 : _a.forEach((flowItem) => {
-                var _a, _b, _c, _d, _e;
-                const article = (_c = (_b = (_a = flowItem.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('calcite-panel')) === null || _b === void 0 ? void 0 : _b.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('article');
-                //hide the header
-                (_d = article === null || article === void 0 ? void 0 : article.querySelector('header')) === null || _d === void 0 ? void 0 : _d.setAttribute('style', 'display: none');
-                //hide the footer
-                (_e = article === null || article === void 0 ? void 0 : article.querySelector('footer')) === null || _e === void 0 ? void 0 : _e.setAttribute('style', 'display: none');
-            });
-        }, 700);
+        await this.timeout(700);
+        //hides the header and footer on the featureForm
+        (_b = (_a = this.el.querySelector('.esri-editor')) === null || _a === void 0 ? void 0 : _a.querySelectorAll('calcite-flow-item')) === null || _b === void 0 ? void 0 : _b.forEach((flowItem) => {
+            var _a, _b, _c, _d, _e;
+            const article = (_c = (_b = (_a = flowItem.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('calcite-panel')) === null || _b === void 0 ? void 0 : _b.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('article');
+            //hide the header
+            (_d = article === null || article === void 0 ? void 0 : article.querySelector('header')) === null || _d === void 0 ? void 0 : _d.setAttribute('style', 'display: none');
+            //hide the footer
+            (_e = article === null || article === void 0 ? void 0 : article.querySelector('footer')) === null || _e === void 0 ? void 0 : _e.setAttribute('style', 'display: none');
+        });
     }
     /**
      * On creation of feature emit the event that the feature is created
@@ -229,11 +365,13 @@ export class CreateFeature {
         var _a;
         //return if any attribute is invalid , focus will be shifted to the invalid attribute in feature form
         if (evt.invalid.length) {
+            this._isSubmitBtnClicked = false;
             return;
         }
         //Submit only when valid attributes
         //emit success or fail based on the result
-        if (evt.valid.length) {
+        if (evt.valid.length && this._isSubmitBtnClicked) {
+            this._isSubmitBtnClicked = false;
             try {
                 await this._editor.activeWorkflow.commit();
                 //throw errors if any failures
@@ -252,6 +390,14 @@ export class CreateFeature {
             this.success.emit();
         }
     }
+    /**
+     * call setTimeout in Promise wrapper
+     * @param delay The time, in milliseconds that the timer should wait before the promise is resolved
+     * @protected
+     */
+    timeout(delay) {
+        return new Promise(resolve => setTimeout(resolve, delay));
+    }
     static get is() { return "create-feature"; }
     static get originalStyleUrls() {
         return {
@@ -319,9 +465,36 @@ 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 {
+            "_editorLoading": {},
+            "_showSearchWidget": {}
+        };
+    }
     static get events() {
         return [{
                 "method": "success",
@@ -388,6 +561,21 @@ export class CreateFeature {
                     "resolved": "boolean",
                     "references": {}
                 }
+            }, {
+                "method": "progressStatus",
+                "name": "progressStatus",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted on demand when editor panel changes"
+                },
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                }
             }];
     }
     static get methods() {
@@ -439,6 +627,9 @@ export class CreateFeature {
         return [{
                 "propName": "mapView",
                 "methodName": "mapViewWatchHandler"
+            }, {
+                "propName": "_editorLoading",
+                "methodName": "_editorLoadingWatchHandler"
             }];
     }
 }

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

@@ -0,0 +1,12 @@
+:host {
+  display: block;
+}
+
+/* Override to hide Editor settings panel collapsible */
+.esri-editor__panel-toolbar {
+  display: none !important;
+}
+
+.display-none {
+  display: none !important;
+}