@esri/solutions-components 0.10.34 → 0.10.35

package/dist/collection/components/delete-button/delete-button.js

@@ -22,6 +22,7 @@ import { Host, h } from "@stencil/core";
 import { getLocaleComponentStrings } from "../../utils/locale";
 export class DeleteButton {
     constructor() {
+        this.deleteDialog = undefined;
         this.buttonType = "button";
         this.disabled = false;
         this.icon = undefined;
@@ -29,7 +30,6 @@ export class DeleteButton {
         this.layer = undefined;
         this._confirmDelete = false;
         this._deleteEndabled = false;
-        this._isDeleting = false;
         this._supportsDelete = undefined;
         this._translations = undefined;
     }
@@ -92,7 +92,7 @@ export class DeleteButton {
      * Renders the component.
      */
     render() {
-        return (h(Host, { key: '23936d6981c9779f5a21951c6667e3cba86e5d82' }, this.buttonType === "button" ? (h("calcite-button", { appearance: "outline", disabled: !this._deleteEndabled, id: "solutions-delete", kind: "danger", onClick: () => this._delete(), width: "full" }, this._translations.deleteCount.replace("{{n}}", this.ids.length.toString()))) : (h("calcite-action", { appearance: "solid", compact: true, disabled: !this._deleteEndabled, id: this.icon, onClick: () => this._delete(), scale: "s", text: this._translations.delete }, h("calcite-button", { appearance: "transparent", iconStart: this.icon, kind: "danger" }, this._translations.delete))), this._deleteMessage(), h("calcite-tooltip", { key: '0078ca79ef0a2195be88d0b508fefc9838af9693', placement: "bottom", "reference-element": this.buttonType === "button" ? "solutions-delete" : this.icon }, h("span", { key: '6a2f3c55237c2cb07f17559c9f14edd4b442e004' }, this._translations.delete))));
+        return (h(Host, { key: '4ced17b35479900aaa01ebbd298eeae57194e358' }, this.buttonType === "button" ? (h("calcite-button", { appearance: "outline", disabled: !this._deleteEndabled, id: "solutions-delete", kind: "danger", onClick: () => this._delete(), width: "full" }, this._translations.deleteCount.replace("{{n}}", this.ids.length.toString()))) : (h("calcite-action", { appearance: "solid", compact: true, disabled: !this._deleteEndabled, id: this.icon, onClick: () => this._delete(), scale: "s", text: this._translations.delete }, h("calcite-button", { appearance: "transparent", iconStart: this.icon, kind: "danger" }, this._translations.delete))), this._deleteMessage(), h("calcite-tooltip", { key: '04f82e726cf9142c403ee43cb8151027bb7b617f', placement: "bottom", "reference-element": this.buttonType === "button" ? "solutions-delete" : this.icon }, h("span", { key: 'f7852b2476dae4b18e82495c64a819b3db98696d' }, this._translations.delete))));
     }
     /**
      * StencilJS: Called once just after the component is fully loaded and the first render() occurs.
@@ -126,30 +126,7 @@ export class DeleteButton {
      * @returns node to confirm or deny the delete operation
      */
     _deleteMessage() {
-        const confirmMessage = this.ids.length === 1 ? this._translations.confirmSingle :
-            this._translations.confirmMultiple;
-        return (h("calcite-modal", { "aria-labelledby": "modal-title", class: "delete-modal", kind: "danger", onCalciteModalClose: () => this._deleteClosed(), open: this._confirmDelete }, h("div", { class: "display-flex align-center", id: "modal-title", slot: "header" }, this._translations.deleteFeature), h("div", { slot: "content" }, confirmMessage), h("calcite-button", { appearance: "outline", kind: "danger", onClick: () => this._deleteClosed(), slot: "secondary", width: "full" }, this._translations.cancel), h("calcite-button", { kind: "danger", loading: this._isDeleting, onClick: () => void this._deleteFeatures(), slot: "primary", width: "full" }, this._translations.delete)));
-    }
-    /**
-     * Delete the currently selected features
-     */
-    async _deleteFeatures() {
-        this._isDeleting = true;
-        const deleteFeatures = this.ids.map((objectId) => {
-            return { objectId };
-        });
-        await this.layer.applyEdits({
-            deleteFeatures
-        });
-        this._isDeleting = false;
-        this._deleteClosed();
-        this.editsComplete.emit("delete");
-    }
-    /**
-     * Set the alertOpen member to false when the alert is closed
-     */
-    _deleteClosed() {
-        this._confirmDelete = false;
+        return this.deleteDialog ? this.deleteDialog : (h("delete-dialog", { id: "solution-delete-dialog", ids: this.ids, layer: this.layer, onDeleteDialogClose: () => this._confirmDelete = false, open: this._confirmDelete }));
     }
     /**
      * Fetches the component's translations
@@ -175,6 +152,23 @@ export class DeleteButton {
     }
     static get properties() {
         return {
+            "deleteDialog": {
+                "type": "any",
+                "mutable": false,
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "calcite-modal: Use this prop when using the button within a parent like a dropdown that would constrain the modal and that is not desired"
+                },
+                "attribute": "delete-dialog",
+                "reflect": false
+            },
             "buttonType": {
                 "type": "string",
                 "mutable": false,
@@ -276,7 +270,6 @@ export class DeleteButton {
         return {
             "_confirmDelete": {},
             "_deleteEndabled": {},
-            "_isDeleting": {},
             "_supportsDelete": {},
             "_translations": {}
         };

package/dist/collection/components/delete-dialog/delete-dialog.css

@@ -0,0 +1,23 @@
+/** @license
+ * Copyright 2024 Esri
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+:host {
+  display: block;
+}
+
+.delete-modal {
+  position: fixed;
+}

package/dist/collection/components/delete-dialog/delete-dialog.js

@@ -0,0 +1,239 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+/** @license
+ * Copyright 2024 Esri
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { Host, h } from "@stencil/core";
+import { getLocaleComponentStrings } from "../../utils/locale";
+export class DeleteDialog {
+    constructor() {
+        this.ids = [];
+        this.layer = undefined;
+        this.open = false;
+        this._isDeleting = false;
+        this._translations = undefined;
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Host element access
+    //
+    //--------------------------------------------------------------------------
+    el;
+    //--------------------------------------------------------------------------
+    //
+    //  Properties (protected)
+    //
+    //--------------------------------------------------------------------------
+    //--------------------------------------------------------------------------
+    //
+    //  Watch handlers
+    //
+    //--------------------------------------------------------------------------
+    //--------------------------------------------------------------------------
+    //
+    //  Methods (public)
+    //
+    //--------------------------------------------------------------------------
+    //--------------------------------------------------------------------------
+    //
+    //  Events (public)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * Emitted on demand when features have been deleted
+     */
+    editsComplete;
+    /**
+     * Emitted on demand when features have been deleted
+     */
+    deleteDialogClose;
+    //--------------------------------------------------------------------------
+    //
+    //  Functions (lifecycle)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * StencilJS: Called once just after the component is first connected to the DOM.
+     *
+     * @returns Promise when complete
+     */
+    async componentWillLoad() {
+        await this._getTranslations();
+    }
+    /**
+     * Renders the component.
+     */
+    render() {
+        const confirmMessage = this.ids.length === 1 ? this._translations?.confirmSingle :
+            this._translations?.confirmMultiple;
+        return (h(Host, { key: '64cd1440f80a9609f90056b919fa807e975eff70' }, h("calcite-modal", { key: '022302455960cbcf894dc2f0079d88be6fb59367', "aria-labelledby": "modal-title", class: "delete-modal", kind: "danger", onCalciteModalClose: () => this._close(), open: this.open, widthScale: "s" }, h("div", { key: '7484caedbdd759efbe972182ddd41a6ebaa2bd64', class: "display-flex align-center", id: "modal-title", slot: "header" }, this._translations?.deleteFeature), h("div", { key: 'e31136a6eed46dd0cbc4d919deb732a623097fbf', slot: "content" }, confirmMessage), h("calcite-button", { key: '7de42845a99777bcec59221fb6ab863e72ca2654', appearance: "outline", kind: "danger", onClick: () => this._close(), slot: "secondary", width: "full" }, this._translations?.cancel), h("calcite-button", { key: '67921ff64fc5c4439e66833fd8502f7e95671b5d', kind: "danger", loading: this._isDeleting, onClick: () => void this._deleteFeatures(), slot: "primary", width: "full" }, this._translations?.delete))));
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Functions (protected)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * Delete the currently selected features
+     */
+    async _deleteFeatures() {
+        this._isDeleting = true;
+        const deleteFeatures = this.ids.map((objectId) => {
+            return { objectId };
+        });
+        await this.layer.applyEdits({
+            deleteFeatures
+        });
+        this._isDeleting = false;
+        this._close();
+        this.editsComplete.emit("delete");
+    }
+    /**
+     * Set the alertOpen member to false when the alert is closed
+     */
+    _close() {
+        this.open = false;
+        this.deleteDialogClose.emit();
+    }
+    /**
+     * Fetches the component's translations
+     *
+     * @returns Promise when complete
+     * @protected
+     */
+    async _getTranslations() {
+        const messages = await getLocaleComponentStrings(this.el);
+        this._translations = messages[0];
+    }
+    static get is() { return "delete-dialog"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["delete-dialog.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["delete-dialog.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "ids": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "any[]",
+                    "resolved": "any[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "number[]: The ids that would be deleted"
+                },
+                "defaultValue": "[]"
+            },
+            "layer": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "__esri.FeatureLayer",
+                    "resolved": "FeatureLayer",
+                    "references": {
+                        "___esri": {
+                            "location": "global",
+                            "id": "global::___esri"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "esri/views/layers/FeatureLayer: https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-FeatureLayer.html"
+                }
+            },
+            "open": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "boolean: When true the delete dialog will be displayed"
+                },
+                "attribute": "open",
+                "reflect": false,
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "_isDeleting": {},
+            "_translations": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "editsComplete",
+                "name": "editsComplete",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted on demand when features have been deleted"
+                },
+                "complexType": {
+                    "original": "EditType",
+                    "resolved": "\"add\" | \"delete\" | \"update\"",
+                    "references": {
+                        "EditType": {
+                            "location": "import",
+                            "path": "../../utils/interfaces",
+                            "id": "src/utils/interfaces.ts::EditType"
+                        }
+                    }
+                }
+            }, {
+                "method": "deleteDialogClose",
+                "name": "deleteDialogClose",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted on demand when features have been deleted"
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }];
+    }
+    static get elementRef() { return "el"; }
+}

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

@@ -198,7 +198,7 @@ export class EditCard {
             !this.graphics[0].layer.editingEnabled : true;
         const tableNodeClass = this._editorLoading ? "display-none" : "position-absolute";
         const loadingClass = this._editorLoading ? "" : "display-none";
-        return (h(Host, { key: '9f4aaad65aed5e7b8d05e6171fdbfdb4f6534c12' }, h("div", { key: 'ded5d125959b11da1a48faf2f28baa9779e36e57', 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: '6eb7dd1c025f3385f68a08176558e07a0c4bf3cd', class: "position-absolute" }, h("div", { key: 'a56ac68bc0bda73a2153d89fc29d5bef3313ae7f', class: tableNodeClass, id: "feature-form", ref: (el) => this._editContainer = el }), h("calcite-loader", { key: 'a1323d9db0e6de6df48573de7fbc954280b27b8f', class: loadingClass, label: "", scale: "s" })))));
+        return (h(Host, { key: 'ff6d1819cfd084e9f11a1c87d89c49d13035b289' }, h("div", { key: '797882acbcc26283719be4c08936e93b93931bcd', 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: '34ce92da0b7c452f0fbae98d9f557543da59f5b8', class: "position-absolute" }, h("div", { key: '81af3854249e193d0d508c022cb4075be63f052d', class: tableNodeClass, id: "feature-form", ref: (el) => this._editContainer = el }), h("calcite-loader", { key: 'd7aa82424f87c47039a8a8f8c61240da7a5ca971', class: loadingClass, label: "", scale: "s" })))));
     }
     //--------------------------------------------------------------------------
     //

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

@@ -62,7 +62,7 @@ export class FeatureComments {
     //
     //--------------------------------------------------------------------------
     render() {
-        return (h(Host, { key: '9d6d06f2466bbbfba74ead0dd8af4354834006c6' }, h("slot", { key: '25722c28a43a7a005a0c55b16c0df536a7a19a61' })));
+        return (h(Host, { key: 'b58aca4fb9f05091f7b4c9a622755afed968a539' }, h("slot", { key: '806ab314b95a05252b5d558722b3dcb68e9b5b44' })));
     }
     static get is() { return "feature-comments"; }
     static get encapsulation() { return "shadow"; }

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

@@ -180,12 +180,12 @@ export class FeatureDetails {
     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: '05a12e56500ab833e856b8f5ac0f8371de522170', "full-height": true }, h("info-card", { key: '53c2102681c8005322c1711b038087b1a70d9a53', allowEditing: false, graphics: this.graphics, highlightEnabled: false, isLoading: false, isMobile: false, 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: '1cf9a8eb026a2ed6c15ccafc3910fed388e63e5d', class: "buttons-container" }, this._commentsAvailable &&
-                h("calcite-button", { key: 'c95920ae526cfeaa9a8824b985f593c95807c3ae', appearance: "transparent", iconEnd: "speech-bubble", kind: "neutral", onClick: () => { this.addComment.emit(); }, scale: 'm' }, this._relatedFeaturesOIDs.length), this._likeFieldAvailable &&
-                h("calcite-button", { key: 'cf6cab791332884e63615058d6d0a1861534177b', 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: '1fe322958b367df620c73834353251d05566d8c7', 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: '8eefe98bc8af36db6793879c38dbed85f45b4a36', class: "height-full", mapView: this.mapView, onFeatureSelect: (e) => { this.commentSelect.emit(e.detail); }, pageSize: 5, ref: el => this._commentsList = el, selectedLayerId: this.relatedTableId, showErrorWhenNoFeatures: false, showInitialLoading: false, showUserImageInList: this.showUserImageInCommentsList, textSize: "small", whereClause: commentsListWhereClause })));
+        return (h("calcite-panel", { key: 'e09b693348a5d446f6ea3c774af3c2fd14e66daf', "full-height": true }, h("info-card", { key: '4483a15e4e0bdd62c2c21bc4622d3bbddf3cd113', allowEditing: false, graphics: this.graphics, highlightEnabled: false, isLoading: false, isMobile: false, 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: 'ac24bb5fd56a7561e78d90c3a1b10027cfab6b2b', class: "buttons-container" }, this._commentsAvailable &&
+                h("calcite-button", { key: '676c5da52465f295212668f8db9b353e219070f2', appearance: "transparent", iconEnd: "speech-bubble", kind: "neutral", onClick: () => { this.addComment.emit(); }, scale: 'm' }, this._relatedFeaturesOIDs.length), this._likeFieldAvailable &&
+                h("calcite-button", { key: 'b3fe54ea2fcf5361e6ec0a91bd52775d24408d77', 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: 'd83c9b9fdd287e07670ca9a5aeafd1a4cc38c0f8', 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: '9d72181a778e08b632d802689a66fa21924cd5b3', class: "height-full", mapView: this.mapView, onFeatureSelect: (e) => { this.commentSelect.emit(e.detail); }, pageSize: 5, ref: el => this._commentsList = el, selectedLayerId: this.relatedTableId, showErrorWhenNoFeatures: false, showInitialLoading: false, showUserImageInList: this.showUserImageInCommentsList, textSize: "small", whereClause: commentsListWhereClause })));
     }
     /**
      * Load esri javascript api modules
@@ -208,11 +208,13 @@ export class FeatureDetails {
      * @protected
      */
     async getCompleteGraphic(graphic) {
-        const layer = graphic.layer;
-        const query = layer.createQuery();
-        query.objectIds = [graphic.getObjectId()];
-        const completeGraphic = await layer.queryFeatures(query);
-        this._selectedGraphic = completeGraphic.features[0];
+        if (graphic) {
+            const layer = graphic.layer;
+            const query = layer.createQuery();
+            query.objectIds = [graphic.getObjectId()];
+            const completeGraphic = await layer.queryFeatures(query);
+            this._selectedGraphic = completeGraphic.features[0];
+        }
     }
     /**
      * Process the comments functionality.

package/dist/collection/components/feature-form-flow-item/feature-form-flow-item.js

@@ -62,7 +62,7 @@ export class FeatureFormFlowItem {
     //
     //--------------------------------------------------------------------------
     render() {
-        return (h(Host, { key: '69a6d88e4a58724a61b964ab9e4cc44df1879be4' }, h("slot", { key: '57bb8fc9d5fc942af7a47d4735b358510e406818' })));
+        return (h(Host, { key: 'ada36a5353ae5c21f81ab8ffea24fab3312acc85' }, h("slot", { key: '424cb194632c9ea0ade6cf848e01a414c05abc42' })));
     }
     static get is() { return "feature-form-flow-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -187,9 +187,9 @@ export class FeatureList {
      * Renders the component.
      */
     render() {
-        return (h("calcite-panel", { key: '381f7da40e715848d4601810aacedbe3a7a46d6d', "full-height": true, "full-width": true }, this._isLoading && h("calcite-loader", { key: '62d128eee1b0a987fe24764b8cfbff148dcf9084', label: "", scale: "m" }), this.showErrorWhenNoFeatures && this._featureItems.length === 0 && !this._isLoading &&
-            h("calcite-notice", { key: '975aef0b4c33676fc2be4aa85a51641d0b203cd4', class: "error-msg", icon: "feature-details", kind: "info", open: true }, h("div", { key: 'c002eb4d59d8bab086d91266ca4a0ca56a185db3', slot: "message" }, this.noFeaturesFoundMsg ? this.noFeaturesFoundMsg : this._translations.featureErrorMsg)), h("calcite-list", { key: '50f0c269f30e9619561ea61f462fb964f91a93a9', "selection-appearance": "border", "selection-mode": "none" }, !this._isLoading && this._featureItems.length > 0 && this._featureItems), this._featuresCount > this.pageSize &&
-            h("div", { key: '97f837035b89d3045efd2771c0ef77d12fbb333b', class: "width-full", slot: "footer" }, h("calcite-pagination", { key: 'd88adbe6499b358395bd7bf5917c3d0c1506d8b1', class: "pagination", "full-width": true, onCalcitePaginationChange: this.pageChanged.bind(this), "page-size": this.pageSize, ref: el => this._pagination = el, "start-item": "1", "total-items": this._featuresCount }))));
+        return (h("calcite-panel", { key: '59289a87561105e3edcbd52bac96b974b1387a16', "full-height": true, "full-width": true }, this._isLoading && h("calcite-loader", { key: '59629285e49227209761d2f16bdd62a90750538f', label: "", scale: "m" }), this.showErrorWhenNoFeatures && this._featureItems.length === 0 && !this._isLoading &&
+            h("calcite-notice", { key: 'bc6c2e6e0fdf959374caf79f2027784e2fdaca15', class: "error-msg", icon: "feature-details", kind: "info", open: true }, h("div", { key: '052207ce0b0e2d8030ac7a4a7985c718371a9667', slot: "message" }, this.noFeaturesFoundMsg ? this.noFeaturesFoundMsg : this._translations.featureErrorMsg)), h("calcite-list", { key: '3f17ea85f2265717aa13c9c71f19c259470c9fcc', "selection-appearance": "border", "selection-mode": "none" }, !this._isLoading && this._featureItems.length > 0 && this._featureItems), this._featuresCount > this.pageSize &&
+            h("div", { key: 'ce3179bcdc7af254488dea909034c58db17ec565', class: "width-full", slot: "footer" }, h("calcite-pagination", { key: 'd6a4b8c7a940918388b3b9891a666c4a142edae7', class: "pagination", "full-width": true, onCalcitePaginationChange: this.pageChanged.bind(this), "page-size": this.pageSize, ref: el => this._pagination = el, "start-item": "1", "total-items": this._featuresCount }))));
     }
     //--------------------------------------------------------------------------
     //
@@ -424,7 +424,7 @@ export class FeatureList {
         const popupTitlePaddingClass = this.showUserImageInList || this.showFeatureSymbol ? 'feature-list-popup-title-padding-reduced' : 'feature-list-popup-title-padding';
         return (h("calcite-list-item", { onCalciteListItemSelect: (e) => { void this.featureClicked(e, selectedFeature); }, onMouseLeave: () => { void this.clearHighlights(); }, onMouseOver: () => { void this.onFeatureHover(selectedFeature); }, value: oId }, this.showUserImageInList &&
             h("calcite-avatar", { class: 'profile-img', "full-name": userInfo?.fullName, scale: "m", slot: "content-start", thumbnail: userInfo?.userProfileUrl, userId: userInfo?.id, username: userInfo?.fullName ? userInfo.username : undefined }), this.showFeatureSymbol &&
-            h("div", { class: 'feature-symbol', ref: (el) => el && el.appendChild(featureSymbol), slot: "content-start" }), h("div", { class: `${popupTitleClass} ${popupTitlePaddingClass}`, slot: "content-start" }, popupTitle), this._likeFieldAvailable &&
+            h("div", { class: 'feature-symbol', ref: (el) => el && el.replaceChildren(featureSymbol), slot: "content-start" }), h("div", { class: `${popupTitleClass} ${popupTitlePaddingClass}`, slot: "content-start" }, popupTitle), this._likeFieldAvailable &&
             h("div", { class: "like-container", id: oId.concat("like"), slot: "content-end" }, h("span", null, this._abbreviatedLikeCount), h("calcite-icon", { icon: "thumbs-up", scale: 's' }), h("calcite-tooltip", { overlayPositioning: "fixed", placement: "top", "reference-element": oId.concat("like") }, formattedLikeCount)), h("calcite-icon", { flipRtl: true, icon: "chevron-right", scale: "s", slot: "content-end" })));
     }
     /**

package/dist/collection/components/features-flow-item/features-flow-item.js

@@ -62,7 +62,7 @@ export class FeaturesFlowItem {
     //
     //--------------------------------------------------------------------------
     render() {
-        return (h(Host, { key: '8154ad4de3a112bcdef4b1495c6fbeab1a13e292' }, h("slot", { key: '6c12197599bd5742f4ffacbae64170929e485d99' })));
+        return (h(Host, { key: 'b775a26ab493f17e0e93ba5713b407566d37683d' }, h("slot", { key: '05f063062f8cced80ae18d36e7ef08abe6b15839' })));
     }
     static get is() { return "features-flow-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/floor-filter/floor-filter.js

@@ -127,7 +127,7 @@ export class FloorFilter {
      * Renders the component.
      */
     render() {
-        return (h(Host, { key: '51da7a656e7f56ecc8cc4093d3dab856f77b5c7a' }, h("div", { key: 'd2fda7047f09a673216484f5c202f039fca20108', ref: (el) => { this._floorFilterElement = el; } })));
+        return (h(Host, { key: '7890927db517fe8e1133fce3e0fe977a441f2abf' }, h("div", { key: '34ad695eb04dd20a0b9893817a33df5020de7da1', ref: (el) => { this._floorFilterElement = el; } })));
     }
     /**
      * StencilJS: Called once just after the component is first loaded.

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

@@ -232,8 +232,8 @@ export class InfoCard {
         const id = this._features?.selectedFeature?.getObjectId();
         const ids = parseInt(id?.toString(), 10) > -1 ? [id] : [];
         const deleteEnabled = this._layer?.editingEnabled && this._layer?.capabilities?.operations?.supportsDelete;
-        return (h(Host, { key: 'a46a4081790c4e67a7e62d7602cf7d3203688d43' }, h("calcite-shell", { key: '688be9c8641692e2843536024752172416e88213', style: { position: this.position } }, this._getHeader(), h("calcite-loader", { key: '0d99da4c0046325af848deaa5b6cb67ed524de96', class: loadingClass, label: this._translations.fetchingData }), h("div", { key: 'e075742e911624b76b56404ccde68bff8f0363aa', class: "esri-widget feature-node " + featureNodeClass, id: this._featuresNodeId }), h("div", { key: '17423712d3a1a2d38ee890ca4dba3ab55ff9ff5f', class: `${editButtonClass} width-100`, slot: "footer" }, this.allowEditing &&
-            h("div", { key: 'f9738f91381d1f1e011951c74b53c733a563f37d', class: "display-flex top-border padding-1-2" }, h("calcite-button", { key: 'bdb409117bc78ce70cb015521506086c6a8fc9c1', 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, onEditsComplete: () => this._closePopup() })) : undefined, h("calcite-tooltip", { key: 'b1927881890a62576bfb794ac8d7ceec3178ae50', placement: "bottom", "reference-element": "solutions-edit" }, h("span", { key: '5b8024aca83b9a12e55e83025353b718fbabc56a' }, this._translations.edit)), this.isMobile ? (h("calcite-tooltip", { placement: "bottom", "reference-element": "solutions-delete" }, h("span", null, this._translations.delete))) : undefined), this.paginationEnabled && !nextBackDisabled && h("div", { key: '5b2410d9f2a2038f8903fb312ec00174d7b227f7', class: `display-flex padding-1-2 button-container top-border ${nextBackClass}` }, h("div", { key: '3e1ba697bd0c22e59b5555375aa192e05900d4a3' }, h("calcite-button", { key: 'd0308cab8f7b570eb64ba6639b753e34e471f0e4', appearance: 'transparent', disabled: nextBackDisabled, iconFlipRtl: "both", iconStart: "chevron-left", id: "solutions-back", onClick: () => this._back(), width: "full" }), h("calcite-tooltip", { key: 'ff51bfc1fe19c2cff4e9ef37c619e0c69dd7c707', placement: "top", "reference-element": "solutions-back" }, h("span", { key: 'dc1e698ca37f5988c2b822d6d7e00eacfc4fe4ba' }, this._translations.back))), h("calcite-action", { key: 'e442df4bcc0012851b8102a2590a58697cb1dc49', class: 'pagination-action', iconFlipRtl: true, onClick: () => this._toggleListView(), scale: "s", text: "", textEnabled: true }, h("span", { key: 'cb4729f055978f1d4c1c63d3e875fec3e4161602', class: "pagination-count" }, this._count)), h("div", { key: 'e6eac05de054f614dc8b6bf3de2ae289dd6d527f' }, h("calcite-button", { key: 'e253248af7d5e21880ccb3e82bbbe95082ff916a', appearance: "transparent", disabled: nextBackDisabled, iconFlipRtl: "both", iconStart: "chevron-right", id: "solutions-next", onClick: () => this._next(), width: "full" }), h("calcite-tooltip", { key: '7a2340dc1403c1a95c0a926c9fda19876a513708', placement: "top", "reference-element": "solutions-next" }, h("span", { key: '3b69deac115afe2dc8cf9fb9d9eaed8d93abb22c' }, this._translations.next))))), h("edit-card", { key: 'e43be40ba13bec51123fbcd3f30062f4bc3e8550', class: editClass, enableEditGeometry: this.enableEditGeometry, graphicIndex: this._features?.selectedFeatureIndex, graphics: this.graphics, mapView: this.mapView, open: this._editRecordOpen }), h("calcite-alert", { key: 'ccbd2ecf9f1f719912ec3020d29559a6d8727e3f', icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { key: '4f17aeceb63548d1eef560d3ef178f630f8dfe47', slot: "title" }, this._translations.editDisabled), h("div", { key: '9c720479ed61012787d7f6be966e31e3fa136d54', slot: "message" }, this._translations.enableEditing)))));
+        return (h(Host, { key: 'e200fd8d903d1c3295247a45f352ae62394501d5' }, h("calcite-shell", { key: '0b467ed0b480944660ef2194b302070d56cb70e4', style: { position: this.position } }, this._getHeader(), h("calcite-loader", { key: 'cf6172f533f67274b04ac61af75f44ffe62cbc9e', class: loadingClass, label: this._translations.fetchingData }), h("div", { key: '06f3e0c61e14fe73c0fadd58c3cf2c7c03efff6d', class: "esri-widget feature-node " + featureNodeClass, id: this._featuresNodeId }), h("div", { key: '0f964afa075abbd27db827f90d189b9bc2a7c9d4', class: `${editButtonClass} width-100`, slot: "footer" }, this.allowEditing &&
+            h("div", { key: 'd518934d172425ecb46e6b28ea683427d8982382', class: "display-flex top-border padding-1-2" }, h("calcite-button", { key: '4d4f3583b6448e33e3d3ad1aba8c9178f71d75b8', 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, onEditsComplete: () => this._closePopup() })) : undefined, h("calcite-tooltip", { key: '5358ba4079f1906d23b6df5b1facb84eec9692d3', placement: "bottom", "reference-element": "solutions-edit" }, h("span", { key: '8466cfb97ce12e46a06ed665afe974377911e101' }, this._translations.edit)), this.isMobile ? (h("calcite-tooltip", { placement: "bottom", "reference-element": "solutions-delete" }, h("span", null, this._translations.delete))) : undefined), this.paginationEnabled && !nextBackDisabled && h("div", { key: '61c551cc2b0c0a2981daa9bf67c7e13318508ca6', class: `display-flex padding-1-2 button-container top-border ${nextBackClass}` }, h("div", { key: '379dc6697743caedf8fdbea16423b83e9e823a5b' }, h("calcite-button", { key: '616a52367d2f56db0104ce279951a81fcf60a376', appearance: 'transparent', disabled: nextBackDisabled, iconFlipRtl: "both", iconStart: "chevron-left", id: "solutions-back", onClick: () => this._back(), width: "full" }), h("calcite-tooltip", { key: 'f7f83e145c25591de025650fd358ca6200c4b6c5', placement: "top", "reference-element": "solutions-back" }, h("span", { key: '8afbde57b91ee8597de237db87efda7eabc10d69' }, this._translations.back))), h("calcite-action", { key: '23344d4abac515d089b8770d63181a989971aa33', class: 'pagination-action', iconFlipRtl: true, onClick: () => this._toggleListView(), scale: "s", text: "", textEnabled: true }, h("span", { key: 'a4c784c5a2c7dfeb9442a58f86961a3242f55055', class: "pagination-count" }, this._count)), h("div", { key: '75e33452a93e9a77f30505957e87b8758ab8d2dd' }, h("calcite-button", { key: '0283a96c401e1929588e28d6ec014eb28b93d1f1', appearance: "transparent", disabled: nextBackDisabled, iconFlipRtl: "both", iconStart: "chevron-right", id: "solutions-next", onClick: () => this._next(), width: "full" }), h("calcite-tooltip", { key: '658a26b1bca471b96799cb81ee941f0556619dc9', placement: "top", "reference-element": "solutions-next" }, h("span", { key: '9892d4ee61a1b5656711bb0a188282d9b46bd3f9' }, this._translations.next))))), h("edit-card", { key: '541268c24631ab526bf1b65313d39f3ca606cb6d', class: editClass, enableEditGeometry: this.enableEditGeometry, graphicIndex: this._features?.selectedFeatureIndex, graphics: this.graphics, mapView: this.mapView, open: this._editRecordOpen }), h("calcite-alert", { key: '1cdff00f5d7e72b5db220750d290593a1baf68c4', icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { key: 'bb250c5906f0e998a794b5c02c22f9643fab16a9', slot: "title" }, this._translations.editDisabled), h("div", { key: 'd330d1ce74473fc76630d2607ab3ca2584aabbd7', slot: "message" }, this._translations.enableEditing)))));
     }
     //--------------------------------------------------------------------------
     //

package/dist/collection/components/json-editor/json-editor.js

@@ -135,7 +135,7 @@ export class JsonEditor {
      * Renders the component.
      */
     render() {
-        return (h(Host, { key: '2932135e373b0e5cf5bc5347c7b7960a60e81df1' }, h("div", { key: '98579089177f92e2a3600dd64d738e4ec8ff8ae2', id: `${this.instanceid}-editor-container`, class: "editor-container padding-right" }, h("div", { key: '971de116ef81850ecc2fcbff9d9f30e36c5928cf', class: "editor-controls" }, h("div", { key: '75e505043095753dc414dad671c6eec4e27a47c1', class: "editor-buttons" }, h("calcite-icon", { key: 'af8645c74758aff0f310089a5c97a504a52a2026', id: `${this.instanceid}-errorFlag`, icon: "exclamation-mark-triangle", title: this._translations.errorFlag, scale: "s", class: "edit-error-flag" }), h("calcite-button", { key: '6d736a2f3aa9c3e0efd5c1919253fc02e3dec0a2', id: `${this.instanceid}-undo`, color: "blue", appearance: "solid", title: this._translations.undo, onClick: () => this._undo(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: '20fdf41124e256f139c7be3bd6f0e42823706cec', icon: "undo", scale: "s" })), h("calcite-button", { key: '7ca8a3bf590e33d6596af51e0b1f25019e9f806a', id: `${this.instanceid}-redo`, color: "blue", appearance: "solid", title: this._translations.redo, onClick: () => this._redo(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: '3e248322dd1381da5ec609e92953d8ea94ebad29', icon: "redo", scale: "s" })), h("calcite-button", { key: '2e147af3b73714e40347f432d3d440d0e9bd2ae9', id: `${this.instanceid}-diff`, color: "blue", appearance: "solid", title: this._translations.diff, onClick: () => this._toggleEditor(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: 'dc3fea2e4743511af20347412c6093163f0b674c', icon: "compare", scale: "s" })), h("calcite-button", { key: 'f983c7535f4a36a693b186a716ad6750e33f679a', id: `${this.instanceid}-search`, appearance: "outline", color: "blue", title: this._translations.search, onClick: () => this._search(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: '315076f61831b8294e0c9b2c2e5fb174d9163bce', icon: "search", scale: "s" })), h("calcite-button", { key: 'a9223c5ad5eeed5a932ce106d3f3db90008933b9', id: `${this.instanceid}-reset`, color: "blue", appearance: "solid", disabled: true, title: this._translations.cancelEdits, onClick: () => this._reset(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: '0cd3c9c634da8fe710890b533bc046c536af0bb2', icon: "reset", scale: "s" })))), h("div", { key: '73fc19136eb3aa3148c859ba617cd9904ee92f98', class: "edit-parent" }, h("div", { key: '57435dbeeef39ddaeb97256512acca6360e1a7ec', id: `${this.instanceid}-container`, class: "json-edit-container" }), h("div", { key: '152e58aeb94ae22d6d11e4332496cb2e637ebbca', id: `${this.instanceid}-diff-container`, class: "json-edit-container display-none" })))));
+        return (h(Host, { key: '0c7531c8c816eb9be80d357b19b568ccdb22c407' }, h("div", { key: '866f82b68c2a750edfc80d801e4ea95a3f655100', id: `${this.instanceid}-editor-container`, class: "editor-container padding-right" }, h("div", { key: '5b9f15641f6a26daeb3847d8ef75c76b8be44fc5', class: "editor-controls" }, h("div", { key: 'd1e91eaa242ccd23d5dc1386b6a58d2fafeb4083', class: "editor-buttons" }, h("calcite-icon", { key: 'd9364f7dfdbc22a414b4711c8a22e145b533998e', id: `${this.instanceid}-errorFlag`, icon: "exclamation-mark-triangle", title: this._translations.errorFlag, scale: "s", class: "edit-error-flag" }), h("calcite-button", { key: '29750fc7cedf1f9caf556df3ff84dc45d6b922b9', id: `${this.instanceid}-undo`, color: "blue", appearance: "solid", title: this._translations.undo, onClick: () => this._undo(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: 'c95008b3fccb8bc33f01eb1bd204c84141850981', icon: "undo", scale: "s" })), h("calcite-button", { key: '49ac9ee70c58954f6dee34524f4c7ab6fa0d7a49', id: `${this.instanceid}-redo`, color: "blue", appearance: "solid", title: this._translations.redo, onClick: () => this._redo(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: '2170c36d0fd236c989222991353324d50afa8ac0', icon: "redo", scale: "s" })), h("calcite-button", { key: 'c6e1a0f84fac6fb02d2590cc7b32aefffbc06d25', id: `${this.instanceid}-diff`, color: "blue", appearance: "solid", title: this._translations.diff, onClick: () => this._toggleEditor(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: '88443cfd2a8888447acc75588ecff7938ade5273', icon: "compare", scale: "s" })), h("calcite-button", { key: '42dcd8f63600d4ddb77eaedd529321999cf537b3', id: `${this.instanceid}-search`, appearance: "outline", color: "blue", title: this._translations.search, onClick: () => this._search(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: '31e8ced3f14f1475c62133fbd7730e34b2bc4028', icon: "search", scale: "s" })), h("calcite-button", { key: '769b268d7476f3fe1a8623e9432cfae56602db0c', id: `${this.instanceid}-reset`, color: "blue", appearance: "solid", disabled: true, title: this._translations.cancelEdits, onClick: () => this._reset(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: '4a8ead1dbf8fefe8b4106a0f6f9c42fb5b875cd2', icon: "reset", scale: "s" })))), h("div", { key: '98f29030a0fa0ecbce0d165840a30edd655ba249', class: "edit-parent" }, h("div", { key: '1441e32a184bc24f2a0a25fcb855c41b40bd0cec', id: `${this.instanceid}-container`, class: "json-edit-container" }), h("div", { key: 'f0cf0a3bd11d3f8102c4cc8695ac1743bac36bbb', id: `${this.instanceid}-diff-container`, class: "json-edit-container display-none" })))));
     }
     //--------------------------------------------------------------------------
     //

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

@@ -91,22 +91,20 @@ export class LayerList {
      */
     async componentWillLoad() {
         await this._getTranslations();
-        this._isLoading = true;
     }
     /**
      * StencilJS: Called once just after the component is fully loaded and the first render() occurs.
      */
     async componentDidLoad() {
         await this.setLayers();
-        this._isLoading = false;
     }
     /**
      * Renders the component.
      */
     render() {
-        return (h(Fragment, { key: '96f61a2b92d352cdc341961c54b9fdfb06bab6fc' }, this._isLoading && h("calcite-loader", { key: '948c5a101fe19294dbc99a5d015c4f08c3db7f24', label: "", scale: "m" }), !this._isLoading && this.mapView && this._noLayersToDisplay &&
-            h("calcite-notice", { key: '23a73833e78b0c0009453ecfbf9bc000f2f7ff33', class: "error-msg", icon: "layers-reference", kind: "danger", open: true }, h("div", { key: 'da338486c22d7d70499713e22d45bd343c752e38', slot: "title" }, this._translations.error), h("div", { key: '751c99a20af04f7253a518181d02a353e7f1b6b8', slot: "message" }, this._translations.noLayerToDisplayErrorMsg)), !this._isLoading && this.mapView &&
-            h("calcite-list", { key: '09c24ccb0ce715bc0606302af41571b5594e64b5', "selection-appearance": "border", "selection-mode": "none" }, this.renderLayerList())));
+        return (h(Fragment, { key: 'f8e0c21d4ff87d663a1e0f00f1d9ef1123091db9' }, this._isLoading && h("calcite-loader", { key: '42058be6b41126e58d33895bc237b174e55a16ed', label: "", scale: "m" }), !this._isLoading && this.mapView && this._noLayersToDisplay &&
+            h("calcite-notice", { key: '89d9073a156f07379699cc5b67bf9ba54654cc68', class: "error-msg", icon: "layers-reference", kind: "danger", open: true }, h("div", { key: '730b8dcca79bd45a7a6eecb5030626d1dcd01238', slot: "title" }, this._translations.error), h("div", { key: '656e8276ffab75734909348f49f11492de1d5a8b', slot: "message" }, this._translations.noLayerToDisplayErrorMsg)), !this._isLoading && this.mapView &&
+            h("calcite-list", { key: '1d2206d3163b6c5ed8511e32ab296f0025889824', "selection-appearance": "border", "selection-mode": "none" }, this.renderLayerList())));
     }
     //--------------------------------------------------------------------------
     //
@@ -120,7 +118,9 @@ export class LayerList {
      */
     async setLayers() {
         if (this.mapView) {
+            this._isLoading = true;
             await this.initLayerHash();
+            this._isLoading = false;
         }
     }
     /**

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

@@ -148,4 +148,10 @@ html[dir="rtl"] .share-action {
   --calcite-color-border-input: var(--calcite-color-border-3);
   width: 60%;
   padding: 10px;
+}
+
+.delete-red {
+  --calcite-icon-color: var(--calcite-color-status-danger);
+  --calcite-color-text-1: var(--calcite-color-status-danger);
+  --calcite-color-text-3: var(--calcite-color-status-danger);
 }