@esri/solutions-components 0.7.30 → 0.7.31

package/dist/components/downloadUtils.js

@@ -2859,7 +2859,7 @@ function _prepareAttributeValue(attributeValue, attributeType, attributeDomain,
     if (attributeDomain && attributeDomain.type === "coded-value") {
         // "coded-value" domain field
         const value = attributeDomain.getName(attributeValue);
-        return value.toString();
+        return value === null || value === void 0 ? void 0 : value.toString();
     }
     else {
         // Non-domain field or unsupported domain type

package/dist/components/feature-list2.js

@@ -91,6 +91,7 @@ const FeatureList = /*@__PURE__*/ proxyCustomElement(class FeatureList extends H
     //--------------------------------------------------------------------------
     /**
      * Initialize the features list using the selected layer
+     * @protected
      */
     async initializeFeatureItems() {
         if (this._selectedLayer) {

package/dist/components/layer-list2.js

@@ -39,6 +39,23 @@ const LayerList = /*@__PURE__*/ proxyCustomElement(class LayerList extends HTMLE
     }
     //--------------------------------------------------------------------------
     //
+    //  Watch handlers
+    //
+    //--------------------------------------------------------------------------
+    //--------------------------------------------------------------------------
+    //
+    //  Methods (public)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * Refresh the layer list which will fetch the latest layer count and update the list
+     * @returns Promise that resolves when the operation is complete
+     */
+    async refresh() {
+        await this.setLayers();
+    }
+    //--------------------------------------------------------------------------
+    //
     //  Functions (lifecycle)
     //
     //--------------------------------------------------------------------------
@@ -63,7 +80,7 @@ const LayerList = /*@__PURE__*/ proxyCustomElement(class LayerList extends HTMLE
     render() {
         return (h(Fragment, null, this._isLoading && h("calcite-loader", { scale: "m" }), !this._isLoading && this.mapView && this._noLayersToDisplay &&
             h("calcite-notice", { class: "error-msg", icon: "layers-reference", kind: "danger", open: true }, h("div", { slot: "title" }, this._translations.error), h("div", { slot: "message" }, this.noLayerErrorMsg ? this.noLayerErrorMsg : this._translations.noLayerToDisplayErrorMsg)), !this._isLoading && this.mapView &&
-            h("calcite-list", { "selection-appearance": "border", "selection-mode": this.showNextIcon ? "none" : "single" }, this.renderLayerList())));
+            h("calcite-list", { "selection-appearance": "border", "selection-mode": this.showNextIcon ? "none" : "single-persist" }, this.renderLayerList())));
     }
     //--------------------------------------------------------------------------
     //
@@ -90,21 +107,24 @@ const LayerList = /*@__PURE__*/ proxyCustomElement(class LayerList extends HTMLE
         this._layerItemsHash = await getMapLayerHash(this.mapView, true);
         const allMapLayers = await getAllLayers(this.mapView);
         // eslint-disable-next-line @typescript-eslint/no-misused-promises
-        this.showFeatureCount && allMapLayers.forEach(async (eachLayer) => {
+        allMapLayers.forEach(async (eachLayer) => {
             var _a, _b;
             //TODO: checking editable condition could be configurable
-            if ((eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.type) === "feature" && (eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.editingEnabled) && ((_b = (_a = eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.capabilities) === null || _a === void 0 ? void 0 : _a.operations) === null || _b === void 0 ? void 0 : _b.supportsUpdate)) {
-                const q = eachLayer.createQuery();
-                const result = eachLayer.queryFeatureCount(q);
-                def.push(result);
-                void result.then(async (resCount) => {
-                    const formattedCount = !isNaN(resCount) ? await formatNumber(resCount, {
-                        places: 0,
-                        api: 4,
-                        type: "decimal"
-                    }) : "";
-                    this._layerItemsHash[eachLayer.id].formattedFeatureCount = formattedCount;
-                });
+            if ((eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.type) === "feature" && (eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.editingEnabled) && ((_b = (_a = eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.capabilities) === null || _a === void 0 ? void 0 : _a.operations) === null || _b === void 0 ? void 0 : _b.supportsAdd)) {
+                this._layerItemsHash[eachLayer.id].supportsAdd = true;
+                if (this.showFeatureCount) {
+                    const q = eachLayer.createQuery();
+                    const result = eachLayer.queryFeatureCount(q);
+                    def.push(result);
+                    void result.then(async (resCount) => {
+                        const formattedCount = !isNaN(resCount) ? await formatNumber(resCount, {
+                            places: 0,
+                            api: 4,
+                            type: "decimal"
+                        }) : "";
+                        this._layerItemsHash[eachLayer.id].formattedFeatureCount = formattedCount;
+                    });
+                }
             }
         });
         await Promise.all(def).then(() => {
@@ -132,9 +152,9 @@ const LayerList = /*@__PURE__*/ proxyCustomElement(class LayerList extends HTMLE
         var _a;
         const configuredLayers = ((_a = this.layers) === null || _a === void 0 ? void 0 : _a.length) > 0 ? this.layers : [];
         return Object.keys(hash).reduce((prev, cur) => {
-            let showLayer = hash[cur].supportsUpdate;
+            let showLayer = hash[cur].supportsAdd;
             if ((configuredLayers === null || configuredLayers === void 0 ? void 0 : configuredLayers.length) > 0) {
-                showLayer = configuredLayers.indexOf(cur) > -1 ? hash[cur].supportsUpdate : false;
+                showLayer = configuredLayers.indexOf(cur) > -1 ? hash[cur].supportsAdd : false;
             }
             if (showLayer) {
                 prev.push(cur);
@@ -193,7 +213,8 @@ const LayerList = /*@__PURE__*/ proxyCustomElement(class LayerList extends HTMLE
         "_noLayersToDisplay": [32],
         "_mapLayerIds": [32],
         "_isLoading": [32],
-        "_translations": [32]
+        "_translations": [32],
+        "refresh": [64]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {

package/dist/esm/{calcite-flow_4.entry.js → calcite-flow_5.entry.js}

@@ -11,16 +11,16 @@ import { c as connectInteractive, u as updateHostInteraction, d as disconnectInt
 import { c as connectLocalized, d as disconnectLocalized } from './locale-6107ef11.js';
 import { c as connectMessages, s as setUpMessages, d as disconnectMessages, u as updateMessages } from './t9n-f16911e7.js';
 import { S as SLOTS$1 } from './resources-649a0f91.js';
-import { P as PopupUtils } from './popupUtils-d75edf93.js';
+import { l as loadModules, g as getLocaleComponentStrings, f as formatNumber } from './locale-731e75a8.js';
 import { g as getLayerOrTable, c as getFeatureLayerView, h as highlightFeatures, d as getMapLayerHash, a as getAllLayers } from './mapViewUtils-cf05e880.js';
-import { g as getLocaleComponentStrings, f as formatNumber } from './locale-731e75a8.js';
+import { P as PopupUtils } from './popupUtils-d75edf93.js';
 import './guid-36c6c6a5.js';
 import './resources-cdc36705.js';
 import './browser-b4c16201.js';
 import './key-af303047.js';
-import './interfaces-586e863c.js';
 import './esri-loader-eda07632.js';
 import './_commonjsHelpers-d5f9d613.js';
+import './interfaces-586e863c.js';
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
@@ -335,6 +335,200 @@ const FlowItem = class {
 };
 FlowItem.style = flowItemCss;
 
+const createFeatureCss = ":host{display:block}.esri-editor__panel-toolbar{display:none !important}";
+
+const CreateFeature = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.success = createEvent(this, "success", 7);
+        this.fail = createEvent(this, "fail", 7);
+        this.drawComplete = createEvent(this, "drawComplete", 7);
+        this.mapView = undefined;
+        this.selectedLayerId = undefined;
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Watch handlers
+    //
+    //--------------------------------------------------------------------------
+    /**
+    * Called each time the mapView prop is changed.
+    */
+    async mapViewWatchHandler() {
+        await this.mapView.when(async () => {
+            await this.init();
+        });
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Methods (public)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * Destroy the Editor widget instance
+     * @returns Promise that resolves when the operation is complete
+     */
+    async close() {
+        if (this._editor) {
+            this._editor.destroy();
+        }
+    }
+    /**
+     * Submit the created feature
+     * @returns Promise that resolves when the operation is complete
+     */
+    async submit() {
+        if (this._editor) {
+            this._editor.viewModel.featureFormViewModel.submit();
+        }
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Functions (lifecycle)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * StencilJS: Called once just after the component is first connected to the DOM.
+     * @returns Promise when complete
+     */
+    async componentWillLoad() {
+        await this.initModules();
+    }
+    /**
+     * StencilJS: Called once just after the component is fully loaded and the first render() occurs.
+     */
+    async componentDidLoad() {
+        await this.init();
+    }
+    /**
+     * Renders the component.
+     */
+    render() {
+        return (h(Host, { id: "feature-form" }));
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Functions (protected)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * Init Editor widget and starts the create workflow
+     */
+    async init() {
+        if (this.mapView) {
+            if (this.mapView && this.selectedLayerId) {
+                await getLayerOrTable(this.mapView, this.selectedLayerId);
+                await this.createEditorWidget();
+                await this.startCreate();
+                this._editor.viewModel.featureFormViewModel.on('submit', this.submitted.bind(this));
+                setTimeout(() => {
+                    var _a, _b;
+                    this.el.querySelector('.esri-editor').querySelectorAll('calcite-flow-item')[1].shadowRoot.querySelector('calcite-panel').shadowRoot.querySelector('article').querySelector('header').setAttribute('style', 'display: none');
+                    (_b = (_a = this.el.querySelector('.esri-editor').querySelectorAll('calcite-flow-item')[1].shadowRoot.querySelector('calcite-panel').shadowRoot.querySelector('article')) === null || _a === void 0 ? void 0 : _a.querySelector('footer')) === null || _b === void 0 ? void 0 : _b.setAttribute('style', 'display: none');
+                }, 700);
+            }
+        }
+    }
+    /**
+     * Load esri javascript api modules
+     * @returns Promise resolving when function is done
+     * @protected
+     */
+    async initModules() {
+        const [Editor] = await loadModules([
+            "esri/widgets/Editor"
+        ]);
+        this.Editor = Editor;
+    }
+    /**
+     * Display editor widget to create the new feature
+     * @protected
+     */
+    async createEditorWidget() {
+        if (this._editor) {
+            this._editor.destroy();
+        }
+        const container = document.createElement("div");
+        const layer = await getLayerOrTable(this.mapView, this.selectedLayerId);
+        const selectedLayer = {
+            layer: layer
+        };
+        this._editor = new this.Editor({
+            allowedWorkflows: "create-features",
+            view: this.mapView,
+            layerInfos: [selectedLayer],
+            visibleElements: {
+                snappingControls: false,
+                snappingControlsElements: {
+                    featureEnabledToggle: false,
+                    layerList: false,
+                    enabledToggle: false
+                }
+            },
+            container,
+        });
+        this.el.appendChild(container);
+    }
+    /**
+     * Start creating the feature
+     * @protected
+     */
+    async startCreate() {
+        var _a, _b;
+        const layer = await getLayerOrTable(this.mapView, this.selectedLayerId);
+        if (layer) {
+            let template = layer.templates && layer.templates.length ? layer.templates[0] : {};
+            if (((_a = layer.sourceJSON) === null || _a === void 0 ? void 0 : _a.types.length) && ((_b = layer.sourceJSON.types[0].templates) === null || _b === void 0 ? void 0 : _b.length)) {
+                template = layer.sourceJSON.types[0].templates[0];
+            }
+            const creationInfo = {
+                layer: layer,
+                template: template
+            };
+            await this._editor.startCreateFeaturesWorkflowAtFeatureCreation(creationInfo);
+            this._editor.viewModel.sketchViewModel.on("create", (evt) => {
+                if (evt.state === "complete") {
+                    this.drawComplete.emit();
+                }
+            });
+        }
+    }
+    /**
+     * On creation of feature emit the event that the feature is created
+     * @param evt feature submit event
+     * @protected
+     */
+    async submitted(evt) {
+        var _a;
+        if (evt.invalid.length) {
+            return;
+        }
+        if (evt.valid.length) {
+            try {
+                await this._editor.activeWorkflow.commit();
+                //throw errors if any failures
+                if ((_a = this._editor.viewModel.failures) === null || _a === void 0 ? void 0 : _a.length) {
+                    this._editor.viewModel.failures.some((failure) => {
+                        if (failure.error) {
+                            throw (failure.error);
+                        }
+                    });
+                }
+            }
+            catch (e) {
+                this.fail.emit(e);
+                return;
+            }
+            this.success.emit();
+        }
+    }
+    get el() { return getElement(this); }
+    static get watchers() { return {
+        "mapView": ["mapViewWatchHandler"]
+    }; }
+};
+CreateFeature.style = createFeatureCss;
+
 const featureListCss = ":host{display:block}.width-full{width:100%}.pagination{display:flex;justify-content:center}.error-msg{padding:10px;width:calc(100% - 20px)}.popup-title{font-weight:500;padding:10px 12px}";
 
 const FeatureList = class {
@@ -401,6 +595,7 @@ const FeatureList = class {
     //--------------------------------------------------------------------------
     /**
      * Initialize the features list using the selected layer
+     * @protected
      */
     async initializeFeatureItems() {
         if (this._selectedLayer) {
@@ -534,6 +729,23 @@ const LayerList = class {
     }
     //--------------------------------------------------------------------------
     //
+    //  Watch handlers
+    //
+    //--------------------------------------------------------------------------
+    //--------------------------------------------------------------------------
+    //
+    //  Methods (public)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * Refresh the layer list which will fetch the latest layer count and update the list
+     * @returns Promise that resolves when the operation is complete
+     */
+    async refresh() {
+        await this.setLayers();
+    }
+    //--------------------------------------------------------------------------
+    //
     //  Functions (lifecycle)
     //
     //--------------------------------------------------------------------------
@@ -558,7 +770,7 @@ const LayerList = class {
     render() {
         return (h(Fragment, null, this._isLoading && h("calcite-loader", { scale: "m" }), !this._isLoading && this.mapView && this._noLayersToDisplay &&
             h("calcite-notice", { class: "error-msg", icon: "layers-reference", kind: "danger", open: true }, h("div", { slot: "title" }, this._translations.error), h("div", { slot: "message" }, this.noLayerErrorMsg ? this.noLayerErrorMsg : this._translations.noLayerToDisplayErrorMsg)), !this._isLoading && this.mapView &&
-            h("calcite-list", { "selection-appearance": "border", "selection-mode": this.showNextIcon ? "none" : "single" }, this.renderLayerList())));
+            h("calcite-list", { "selection-appearance": "border", "selection-mode": this.showNextIcon ? "none" : "single-persist" }, this.renderLayerList())));
     }
     //--------------------------------------------------------------------------
     //
@@ -585,21 +797,24 @@ const LayerList = class {
         this._layerItemsHash = await getMapLayerHash(this.mapView, true);
         const allMapLayers = await getAllLayers(this.mapView);
         // eslint-disable-next-line @typescript-eslint/no-misused-promises
-        this.showFeatureCount && allMapLayers.forEach(async (eachLayer) => {
+        allMapLayers.forEach(async (eachLayer) => {
             var _a, _b;
             //TODO: checking editable condition could be configurable
-            if ((eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.type) === "feature" && (eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.editingEnabled) && ((_b = (_a = eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.capabilities) === null || _a === void 0 ? void 0 : _a.operations) === null || _b === void 0 ? void 0 : _b.supportsUpdate)) {
-                const q = eachLayer.createQuery();
-                const result = eachLayer.queryFeatureCount(q);
-                def.push(result);
-                void result.then(async (resCount) => {
-                    const formattedCount = !isNaN(resCount) ? await formatNumber(resCount, {
-                        places: 0,
-                        api: 4,
-                        type: "decimal"
-                    }) : "";
-                    this._layerItemsHash[eachLayer.id].formattedFeatureCount = formattedCount;
-                });
+            if ((eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.type) === "feature" && (eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.editingEnabled) && ((_b = (_a = eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.capabilities) === null || _a === void 0 ? void 0 : _a.operations) === null || _b === void 0 ? void 0 : _b.supportsAdd)) {
+                this._layerItemsHash[eachLayer.id].supportsAdd = true;
+                if (this.showFeatureCount) {
+                    const q = eachLayer.createQuery();
+                    const result = eachLayer.queryFeatureCount(q);
+                    def.push(result);
+                    void result.then(async (resCount) => {
+                        const formattedCount = !isNaN(resCount) ? await formatNumber(resCount, {
+                            places: 0,
+                            api: 4,
+                            type: "decimal"
+                        }) : "";
+                        this._layerItemsHash[eachLayer.id].formattedFeatureCount = formattedCount;
+                    });
+                }
             }
         });
         await Promise.all(def).then(() => {
@@ -627,9 +842,9 @@ const LayerList = class {
         var _a;
         const configuredLayers = ((_a = this.layers) === null || _a === void 0 ? void 0 : _a.length) > 0 ? this.layers : [];
         return Object.keys(hash).reduce((prev, cur) => {
-            let showLayer = hash[cur].supportsUpdate;
+            let showLayer = hash[cur].supportsAdd;
             if ((configuredLayers === null || configuredLayers === void 0 ? void 0 : configuredLayers.length) > 0) {
-                showLayer = configuredLayers.indexOf(cur) > -1 ? hash[cur].supportsUpdate : false;
+                showLayer = configuredLayers.indexOf(cur) > -1 ? hash[cur].supportsAdd : false;
             }
             if (showLayer) {
                 prev.push(cur);
@@ -681,4 +896,4 @@ const LayerList = class {
 };
 LayerList.style = layerListCss;
 
-export { Flow as calcite_flow, FlowItem as calcite_flow_item, FeatureList as feature_list, LayerList as layer_list };
+export { Flow as calcite_flow, FlowItem as calcite_flow_item, CreateFeature as create_feature, FeatureList as feature_list, LayerList as layer_list };

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

@@ -6,7 +6,7 @@
 import { r as registerInstance, h, H as Host, g as getElement, c as createEvent } from './index-7183ce4a.js';
 import { g as getLocaleComponentStrings, l as loadModules } from './locale-731e75a8.js';
 import { q as queryFeaturesByID, g as getLayerOrTable, b as goToSelection, e as queryAllIds, f as queryFeatureIds, i as queryFeaturesByGlobalID } from './mapViewUtils-cf05e880.js';
-import { d as downloadCSV } from './downloadUtils-d070a467.js';
+import { d as downloadCSV } from './downloadUtils-d297078f.js';
 import './esri-loader-eda07632.js';
 import './_commonjsHelpers-d5f9d613.js';
 import './interfaces-586e863c.js';