@esri/solutions-components 0.10.16 → 0.10.18

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

@@ -47,7 +47,6 @@ export class CrowdsourceManager {
         this.enableSearch = true;
         this.enableShare = false;
         this.enableZoom = true;
-        this.hideMapOnLoad = false;
         this.mapInfos = [];
         this.onlyShowUpdatableLayers = true;
         this.popupHeaderColor = undefined;
@@ -73,6 +72,7 @@ export class CrowdsourceManager {
         this._panelOpen = true;
         this._numSelected = 0;
         this._filterOpen = false;
+        this._showInformationHeader = true;
     }
     //--------------------------------------------------------------------------
     //
@@ -95,10 +95,6 @@ export class CrowdsourceManager {
      * MapView.when is not fired when mapView is not currently visible
      */
     _defaultLevelHonored = false;
-    /**
-     * boolean: When true hideMapOnLoad was honored for the current map
-     */
-    _hideMapOnLoadHonored = false;
     /**
      * HTMLLayerTableElement: The layer table element
      */
@@ -139,12 +135,6 @@ export class CrowdsourceManager {
     enableZoomWatchHandler() {
         this._initMapZoom();
     }
-    /**
-     * When true the map will be hidden on load
-     */
-    hideMapOnLoadWatchHandler() {
-        this.showHideMapPopupAndTable(this.hideMapOnLoad && !this._isMobile);
-    }
     //--------------------------------------------------------------------------
     //
     //  Methods (public)
@@ -198,17 +188,11 @@ export class CrowdsourceManager {
     async layerSelectionChange(evt) {
         const id = evt.detail[0];
         const layer = await getLayerOrTable(this._mapView, id);
-        await layer.when(() => {
+        layer && await layer.when(() => {
             this._layer = layer;
             this._initLayerExpressions();
         });
     }
-    /**
-     * Update the state expandPopup when mapInfoChange event occurs
-     */
-    async mapInfoChange() {
-        this._hideMapOnLoadHonored = false;
-    }
     //--------------------------------------------------------------------------
     //
     //  Functions (lifecycle)
@@ -229,7 +213,7 @@ export class CrowdsourceManager {
     render() {
         // only avoid border when we have a header color that is not white
         const borderClass = this.popupHeaderColor && this.popupHeaderColor !== "#FFFFFF" ? "border-width-0" : "";
-        return (h(Host, { key: 'fa5d4e79b6f5a3eb176af497a4444bb9aca59f15' }, h("calcite-shell", { key: '3e7466a6db42b61db1f9b6efb5cd84b97d3f9d3b', class: "position-relative" }, h("calcite-panel", { key: '15b850a0e9c3b62ebe3bd94b39b61eff1734ad4b', class: `width-full height-full ${borderClass}` }, this._getBody(this._layoutMode, this._panelOpen, this._hideTable)), this._getFooter()), this._filterModal()));
+        return (h(Host, { key: 'aad237254c4f5e906be19ff79f8ed3507d4ab0f2' }, h("calcite-shell", { key: '2bbc2a426acc37d31fe21a5204f57c6cdccaebf6', class: "position-relative" }, h("calcite-panel", { key: 'cb53df81f589988dadb84f8b40ce74e0a05ffb50', class: `width-full height-full ${borderClass}` }, this._getBody(this._layoutMode, this._panelOpen, this._hideTable)), this._getFooter()), this._filterModal()));
     }
     /**
      * Called after each render
@@ -248,10 +232,6 @@ export class CrowdsourceManager {
      */
     async componentDidLoad() {
         this._resizeObserver.observe(this.el);
-        // for backward compatibility if hidemaponload is true then render table layout as default
-        if (this.hideMapOnLoad) {
-            this.appLayout = 'tableView';
-        }
         this._isMapViewOnLoad = this.appLayout === 'mapView';
         this._setActiveLayout(this.appLayout);
     }
@@ -377,7 +357,7 @@ export class CrowdsourceManager {
     _getBody(layoutMode, panelOpen, hideTable) {
         const contentClass = layoutMode === ELayoutMode.HORIZONTAL ? "" : "display-flex";
         const themeClass = this.theme === "dark" ? "calcite-mode-dark" : "calcite-mode-light";
-        return (h("calcite-panel", { class: "width-full height-full" }, h("div", { class: `width-full height-full overflow-hidden ${contentClass}` }, this._getMapAndCard(layoutMode, panelOpen, hideTable), this._getTable(layoutMode, panelOpen, hideTable)), this.coverPageEnabled &&
+        return (h("calcite-panel", { class: "width-full height-full position-absolute" }, h("div", { class: `width-full height-full overflow-hidden ${contentClass}` }, this._getMapAndCard(layoutMode, panelOpen, hideTable), this._getTable(layoutMode, panelOpen, hideTable)), this.coverPageEnabled &&
             h("div", { class: "floating-container", onClick: this.coverPageButtonClick.bind(this) }, h("calcite-button", { appearance: "solid", class: `floating-button ${themeClass}`, "icon-start": "content-minimal", kind: "neutral", label: "", round: true, scale: "l", "split-child": "primary", width: "auto" })), this.introductionWindowEnabled &&
             h("div", { class: "floating-container", onClick: this.infoButtonClick.bind(this) }, h("calcite-button", { appearance: "solid", class: `floating-button ${themeClass}`, "icon-start": "information-letter", kind: "neutral", label: "", round: true, scale: "l", "split-child": "primary", width: "auto" }))));
     }
@@ -431,7 +411,7 @@ export class CrowdsourceManager {
      */
     _getPopupExpandNode() {
         const popupNodeClass = "height-full";
-        const headerClass = this._isMobile ? "display-none height-0" : "";
+        const headerClass = this._isMobile && this._showInformationHeader ? "display-none height-0" : "";
         const headerTheme = this.popupHeaderColor ? "" : !this._isMobile ? "calcite-mode-dark" : "calcite-mode-light";
         const containerClass = this._isMobile && this._hideTable ? "position-absolute-0 width-full height-full" : this._isMobile ? "display-none height-0" : "";
         return (h("div", { class: `${headerTheme} ${popupNodeClass} ${containerClass}`, style: {
@@ -439,7 +419,7 @@ export class CrowdsourceManager {
                 '--calcite-color-foreground-2': this.popupHeaderHoverColor, /* background color that will be displayed on button when hovered */
                 '--calcite-color-text-3': this.popupHeaderTextColor, /* font color that will be displayed on button */
                 '--calcite-color-text-2': this.popupHeaderTextColor, /* font color that will be displayed on popup header text*/
-            } }, h("calcite-panel", null, !this._isMobile ? (h("div", { class: `display-flex align-items-center ${headerClass}`, slot: "header-content" }, h("calcite-icon", { icon: "information", scale: "s" }), h("div", { class: "padding-inline-start-75" }, this._translations.information))) : undefined, this._getCardNode())));
+            } }, h("calcite-panel", null, !this._isMobile && this._showInformationHeader || this._numSelected > 0 ? (h("div", { class: `display-flex align-items-center ${headerClass}`, slot: "header-content" }, h("calcite-icon", { icon: "information", scale: "s" }), h("div", { class: "padding-inline-start-75" }, this._translations.information))) : h("div", null), this._getCardNode())));
     }
     /**
      * Get the card node
@@ -450,9 +430,15 @@ export class CrowdsourceManager {
     _getCardNode() {
         const isMapLayout = this.appLayout === 'mapView';
         const isTableLayout = this.appLayout === 'tableView';
-        const cardManagerHeight = (isMapLayout || isTableLayout) ? "height-full" : !this._isMobile ? "height-50" : "height-full";
+        const cardManagerHeight = (isMapLayout || isTableLayout) ? "height-full" : this._numSelected > 0 ? "height-51" : !this._showInformationHeader ? "adjusted-height-50_25" : !this._isMobile ? "height-51" : "height-full";
         const themeClass = this.theme === "dark" ? "calcite-mode-dark" : "calcite-mode-light";
-        return (h("div", { class: `width-50 height-full ${themeClass}` }, h("card-manager", { class: `${cardManagerHeight} width-full`, customInfoText: this.customInfoText, enableEditGeometry: this?._mapInfo?.enableEditGeometry, isMobile: this._isMobile, layer: this._layer, mapView: this?._mapView, selectedFeaturesIds: this._layerTable?.selectedIds, zoomAndScrollToSelected: this.zoomAndScrollToSelected })));
+        return (h("div", { class: `width-50 height-full ${themeClass}` }, h("card-manager", { class: `${cardManagerHeight} width-full`, customInfoText: this.customInfoText, enableCreateFeatures: this._enableCreateFeatures, enableEditGeometry: this?._mapInfo?.enableEditGeometry, isMobile: this._isMobile, layer: this._layer, mapView: this?._mapView, onBackFromCreateWorkFlow: () => {
+                this._changeLayout(this.appLayout);
+                this._showInformationHeader = true;
+            }, onCreateWorkFlowStarted: () => {
+                this._changeLayout(this._layer.isTable ? "tableView" : "mapView");
+                this._showInformationHeader = false;
+            }, onFeatureOrRecordSubmitted: () => void this._layerTable.refresh(), selectedFeaturesIds: this._layerTable?.selectedIds, zoomAndScrollToSelected: this.zoomAndScrollToSelected })));
     }
     /**
      * Get the table node based for the current layout
@@ -467,7 +453,7 @@ export class CrowdsourceManager {
         const isMapLayout = this.appLayout === 'mapView';
         const isTableLayout = this.appLayout === 'tableView';
         const tableClass = hideTable && this._isMobile ? "visibility-hidden" : isMapLayout ? "display-none" : "";
-        const mapClass = isMapLayout ? "height-full width-full" : "display-none";
+        const mapClass = isMapLayout ? "height-full width-full z-index-0" : "display-none";
         const tableSizeClass = this._getTableSizeClass(layoutMode, panelOpen);
         const toggleLayout = layoutMode === ELayoutMode.HORIZONTAL ? "horizontal" : "vertical";
         const toggleSlot = layoutMode === ELayoutMode.HORIZONTAL ? "header" : "panel-start";
@@ -476,7 +462,7 @@ export class CrowdsourceManager {
             this.defaultGlobalId?.indexOf(",") > -1 ? this.defaultGlobalId.split(",") : [this.defaultGlobalId];
         const defaultOid = !this.defaultOid ? undefined :
             this.defaultOid?.indexOf(",") > -1 ? this.defaultOid.split(",").map(o => parseInt(o, 10)) : [parseInt(this.defaultOid, 10)];
-        return (h("calcite-shell", { class: `${tableSizeClass} border-bottom` }, !this._isMobile ? (h("calcite-action-bar", { class: "border-sides", expandDisabled: true, layout: toggleLayout, slot: toggleSlot }, this.getActions(layoutMode, panelOpen))) : undefined, h("div", { class: `width-full height-full position-relative ${tableClass}` }, h("layer-table", { createFilterModal: false, defaultGlobalId: hasMapAndLayer ? globalId : undefined, defaultLayerId: hasMapAndLayer ? this.defaultLayer : "", defaultOid: hasMapAndLayer && !globalId ? defaultOid : undefined, enableAutoRefresh: this.enableAutoRefresh, enableCSV: this.enableCSV, enableColumnReorder: this.enableColumnReorder, enableInlineEdit: this?._mapInfo?.enableInlineEdit, enableShare: this.enableShare, isMobile: this._isMobile, mapHidden: isTableLayout, mapInfo: this._mapInfo, mapView: this?._mapView, onToggleFilter: this._toggleFilter.bind(this), onlyShowUpdatableLayers: this.onlyShowUpdatableLayers, ref: (el) => this._layerTable = el, shareIncludeEmbed: this.shareIncludeEmbed, shareIncludeSocial: this.shareIncludeSocial, showNewestFirst: this.showNewestFirst, zoomAndScrollToSelected: this.zoomAndScrollToSelected, zoomToScale: this.zoomToScale })), h("div", { class: mapClass, id: "full-map-view" })));
+        return (h("calcite-shell", { class: `${tableSizeClass} border-bottom` }, !this._isMobile ? (h("calcite-action-bar", { class: "border-sides", expandDisabled: true, layout: toggleLayout, slot: toggleSlot }, this.getActions(layoutMode, panelOpen))) : undefined, h("div", { class: `width-full height-full position-relative z-index-0 ${tableClass}` }, h("layer-table", { createFilterModal: false, defaultGlobalId: hasMapAndLayer ? globalId : undefined, defaultLayerId: hasMapAndLayer ? this.defaultLayer : "", defaultOid: hasMapAndLayer && !globalId ? defaultOid : undefined, enableAutoRefresh: this.enableAutoRefresh, enableCSV: this.enableCSV, enableColumnReorder: this.enableColumnReorder, enableInlineEdit: this?._mapInfo?.enableInlineEdit, enableShare: this.enableShare, isMobile: this._isMobile, mapHidden: isTableLayout, mapInfo: this._mapInfo, mapView: this?._mapView, onToggleFilter: this._toggleFilter.bind(this), onlyShowUpdatableLayers: this.onlyShowUpdatableLayers, ref: (el) => this._layerTable = el, shareIncludeEmbed: this.shareIncludeEmbed, shareIncludeSocial: this.shareIncludeSocial, showNewestFirst: this.showNewestFirst, zoomAndScrollToSelected: this.zoomAndScrollToSelected, zoomToScale: this.zoomToScale })), h("div", { class: mapClass, id: "full-map-view" })));
     }
     /**
      * Returns the Actions for table's node
@@ -553,8 +539,8 @@ export class CrowdsourceManager {
         if (forceOpen) {
             this._panelOpen = true;
         }
-        if ((this.hideMapOnLoad && !this._hideMapOnLoadHonored) || this._isMobile) {
-            this.hideMapOnLoadWatchHandler();
+        if (this._isMobile) {
+            this.showHideMapPopupAndTable(!this._isMobile);
         }
     }
     /**
@@ -1119,24 +1105,6 @@ export class CrowdsourceManager {
                 "reflect": false,
                 "defaultValue": "true"
             },
-            "hideMapOnLoad": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "boolean: when true the map will be hidden on load"
-                },
-                "attribute": "hide-map-on-load",
-                "reflect": false,
-                "defaultValue": "false"
-            },
             "mapInfos": {
                 "type": "unknown",
                 "mutable": false,
@@ -1392,7 +1360,8 @@ export class CrowdsourceManager {
             "_mapView": {},
             "_panelOpen": {},
             "_numSelected": {},
-            "_filterOpen": {}
+            "_filterOpen": {},
+            "_showInformationHeader": {}
         };
     }
     static get events() {
@@ -1433,9 +1402,6 @@ export class CrowdsourceManager {
         return [{
                 "propName": "enableZoom",
                 "methodName": "enableZoomWatchHandler"
-            }, {
-                "propName": "hideMapOnLoad",
-                "methodName": "hideMapOnLoadWatchHandler"
             }];
     }
     static get listeners() {
@@ -1469,12 +1435,6 @@ export class CrowdsourceManager {
                 "target": "window",
                 "capture": false,
                 "passive": false
-            }, {
-                "name": "mapInfoChange",
-                "method": "mapInfoChange",
-                "target": "window",
-                "capture": false,
-                "passive": false
             }];
     }
 }

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

@@ -44,7 +44,7 @@
   border: 1px solid var(--calcite-color-border-3);
 }
 
-.notice-msg{
+.notice-msg {
   padding: 10px;
   width: calc(100% - 20px);
 }

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

@@ -300,7 +300,7 @@ export class CrowdsourceReporter {
      */
     render() {
         const themeClass = this.theme === "dark" ? "calcite-mode-dark" : "calcite-mode-light";
-        return (h(Host, { key: '712bd9d383d112b8e86832adc5026780ed5b6a21' }, this._reportSubmitted && h("calcite-alert", { key: '4f355784741e72c1cdd13b6e36d77ff05680e147', "auto-close": true, class: themeClass + " report-submitted-msg", icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._reportSubmitted = false; }, open: true, placement: "top" }, h("div", { key: '1a529422b45de78ff1a97ff71a616d39e33736fe', slot: "message" }, this.reportSubmittedMessage ? this.reportSubmittedMessage : this._translations.submitMsg)), this._featureCreationFailedErrorMsg && h("calcite-alert", { key: '02722111a22c5c9da25a20cd77daae0d16c4829e', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._featureCreationFailedErrorMsg = ""; }, open: true, placement: "top" }, h("div", { key: '94725b928eb5200f8b114d565f1eef551b1f8472', slot: "title" }, this._translations.error), h("div", { key: '362ab693984413822e85b50945cbff5633798dec', slot: "message" }, this._featureCreationFailedErrorMsg)), this._commentSubmitted && h("calcite-alert", { key: '74b1287b952b7e9d9406b8cc08ce85fa6ee124b2', "auto-close": true, class: 'report-submitted ' + themeClass, icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._commentSubmitted = false; }, open: true, placement: "top" }, h("div", { key: '1ebed2836d95fc7d3dc79e26acb60645b6c8300f', slot: "message" }, this.commentSubmittedMessage || this._translations.commentSubmittedMsg)), this._addingCommentFailed && h("calcite-alert", { key: '62428d3d20b754200c6390880b7067d262008d3d', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._addingCommentFailed = false; }, open: true, placement: "top" }, h("div", { key: '78593f816ca80583b062b90fc796dd9e54ed7344', slot: "title" }, this._translations.error), h("div", { key: '5d45971a4f8c26f34e87e2985e9252932e6d90ac', slot: "message" }, this._translations.addingCommentFailedMsg)), h("div", { key: '0a7d3e35e62a9955c8cb16b6e1f4435c11b8b11d' }, h("calcite-shell", { key: 'e8f9b57f6906a3e9c8960cdf722db2dc253dd454', "content-behind": true }, this._getReporter()))));
+        return (h(Host, { key: '9e2fc7137b28852f7f22c47fda4693e5659db631' }, this._reportSubmitted && h("calcite-alert", { key: 'ab818755ae126dad344cf7639d9b67048154447f', "auto-close": true, class: themeClass + " report-submitted-msg", icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._reportSubmitted = false; }, open: true, placement: "top" }, h("div", { key: 'd1d9b947bc0f1e91a07deb800b764fd6b81e2ab8', slot: "message" }, this.reportSubmittedMessage ? this.reportSubmittedMessage : this._translations.submitMsg)), this._featureCreationFailedErrorMsg && h("calcite-alert", { key: '92fa0cb53cf5525e19c9308f3d3e68bf7af741ff', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._featureCreationFailedErrorMsg = ""; }, open: true, placement: "top" }, h("div", { key: 'ebe0683e73f6b7d9b3293c21b674fbfb67aedba5', slot: "title" }, this._translations.error), h("div", { key: '06d8a126f285011d74f88807cc6c5d51b1ed8ac4', slot: "message" }, this._featureCreationFailedErrorMsg)), this._commentSubmitted && h("calcite-alert", { key: 'ab2aa9d399570fb0897dccd2f5d16ac62c8e5529', "auto-close": true, class: 'report-submitted ' + themeClass, icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._commentSubmitted = false; }, open: true, placement: "top" }, h("div", { key: '4cb649130c819cc9643b31c9e7533e1ef68fc626', slot: "message" }, this.commentSubmittedMessage || this._translations.commentSubmittedMsg)), this._addingCommentFailed && h("calcite-alert", { key: '0f960660c43e17b9e7d71d41e4f573f5aff9a6f8', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._addingCommentFailed = false; }, open: true, placement: "top" }, h("div", { key: 'b4777d4d0d1035d0b5abb51196854cda47bebb20', slot: "title" }, this._translations.error), h("div", { key: '12ae974db56c10d5edf5e8cee3d55eb2c69979cf', slot: "message" }, this._translations.addingCommentFailedMsg)), h("div", { key: 'd1b53057f95b9eb734c7263dcb7334196e84fb30' }, h("calcite-shell", { key: '62fb7d7fb784645334f99053f7453583e0f90fc0', "content-behind": true }, this._getReporter()))));
     }
     //--------------------------------------------------------------------------
     //
@@ -467,7 +467,7 @@ export class CrowdsourceReporter {
      * @protected
      */
     getFeatureCreateFlowItem() {
-        return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, onCalciteFlowItemBack: this.backFromCreateFeaturePanel.bind(this) }, this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateFeaturePanel.bind(this), width: "full" }, this._translations.cancel)), h("calcite-panel", { "full-height": true, "full-width": true }, h("div", { class: "progress-bar" }, h("calcite-progress", { type: "determinate", value: this._updatedProgressBarStatus })), h("calcite-notice", { class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, h("div", { slot: "message" }, this._translations.featureEditFormInfoMsg)), h("create-feature", { customizeSubmit: true, floorLevel: this.floorLevel, formElements: this._formElements.find(elm => elm.id === this._selectedLayerId), isMobile: this.isMobile, mapView: this.mapView, onDrawComplete: this.onFormReady.bind(this), onEditingAttachment: this.showSubmitCancelButton.bind(this), onFail: this.createFeatureFailed.bind(this), onModeChanged: this.backFromCreateFeaturePanel.bind(this), onProgressStatus: this.updatedProgressStatus.bind(this), onSuccess: this.onReportSubmitted.bind(this), ref: el => this._createFeature = el, searchConfiguration: this.searchConfiguration, selectedLayerId: this._selectedLayerId }))));
+        return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, onCalciteFlowItemBack: this.backFromCreateFeaturePanel.bind(this) }, this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateFeaturePanel.bind(this), width: "full" }, this._translations.cancel)), h("calcite-panel", { "full-height": true, "full-width": true }, h("div", { class: "progress-bar" }, h("calcite-progress", { type: "determinate", value: this._updatedProgressBarStatus })), h("calcite-notice", { class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, h("div", { slot: "message" }, this._translations.featureEditFormInfoMsg)), h("create-feature", { customizeSubmit: true, enableSearch: true, floorLevel: this.floorLevel, formElements: this._formElements.find(elm => elm.id === this._selectedLayerId), isMobile: this.isMobile, mapView: this.mapView, onDrawComplete: this.onFormReady.bind(this), onEditingAttachment: this.showSubmitCancelButton.bind(this), onFail: this.createFeatureFailed.bind(this), onModeChanged: this.backFromCreateFeaturePanel.bind(this), onProgressStatus: this.updatedProgressStatus.bind(this), onSuccess: this.onReportSubmitted.bind(this), ref: el => this._createFeature = el, searchConfiguration: this.searchConfiguration, selectedLayerId: this._selectedLayerId }))));
     }
     /**
      * Update the progress bar status when editor panel changes
@@ -785,10 +785,8 @@ export class CrowdsourceReporter {
             h("calcite-button", { appearance: "solid", onClick: this.navigateToCreateFeature.bind(this), slot: "footer", width: "full" }, this.reportButtonText ? this.reportButtonText : this._translations.createReportButtonText), h("calcite-panel", { "full-height": true }, h("feature-list", { applyLayerViewFilter: this.showMyReportsOnly, class: "height-full", highlightOnHover: true, mapView: this.mapView, noFeaturesFoundMsg: this._translations.featureErrorMsg, onFeatureSelect: this.onFeatureSelectFromList.bind(this), pageSize: 30, ref: el => this._featureList = el, reportingOptions: this.reportingOptions, selectedLayerId: layerId, showFeatureSymbol: this.showFeatureSymbol, sortingInfo: this._updatedSorting }))));
     }
     /**
-     * Get Filter page for apllying filter
-     * @param layerId Layer id
-     * @param layerName Layer name
-     * @returns feature list node
+     * Returns the calcite-flow item for filter
+     * @returns Node
      * @protected
      */
     getFilterPanel() {
@@ -891,11 +889,21 @@ export class CrowdsourceReporter {
     getActionToExpandCollapsePanel() {
         return (h("calcite-action", { icon: this._sidePanelCollapsed ? "chevrons-up" : "chevrons-down", onClick: this.toggleSidePanel.bind(this), slot: "header-actions-end", text: this._sidePanelCollapsed ? this._translations.expand : this._translations.collapse }));
     }
+    _updatingHandle;
     /**
      * Set the current map info when maps change
      * @protected
      */
     async setMapView() {
+        console.log("setMapView see if we can find the floor filter widget from the app");
+        if (this._updatingHandle) {
+            this._updatingHandle.remove();
+        }
+        this._updatingHandle = this.reactiveUtils.watch(() => this.mapView.updating, () => {
+            console.log("mapView.updating");
+            console.log(this.mapView.ui.getComponents());
+            console.log(this.mapView.ui.find("esri-floor-filter"));
+        });
         await this.getLayersToShowInList();
         // filter/update the feature(s) if any filter/condition is already applied
         await this._updateFeatures();
@@ -1002,13 +1010,12 @@ export class CrowdsourceReporter {
     }
     /**
      * Applies a definition expression when floor field and level are available
-     *
-     * @returns boolean
+     * @param layer FeatureLayer on which the definitionExpression should be updated
      * @protected
      */
     _updateFloorDefinitionExpression(layer) {
         const floorField = layer.floorInfo.floorField;
-        // update the layer defination expression
+        // update the layer definition expression
         const floorExp = `${floorField} = '${this.floorLevel}'`;
         const defExp = layer.definitionExpression;
         layer.definitionExpression = defExp?.indexOf(this._floorExpression) > -1 ?
@@ -1061,13 +1068,14 @@ export class CrowdsourceReporter {
             await this._showMyFeaturesOnly(featureLayerView);
             const floorField = featureLayerView.layer?.floorInfo?.floorField;
             if (floorField && this.floorLevel) {
-                // Update the layer's defination as per selected floor level from map for all editable layers
+                // Update the layer's definition as per selected floor level from map for all editable layers
                 this._updateFloorDefinitionExpression(featureLayerView.layer);
             }
         }
     }
     /**
      * Show only loggedIn user's features
+     * @param featureLayerView on which the filter should be applied
      * @protected
      */
     async _showMyFeaturesOnly(featureLayerView) {
@@ -1808,7 +1816,7 @@ export class CrowdsourceReporter {
                     "text": "Emitted when toggle panel button is clicked in reporter"
                 },
                 "complexType": {
-                    "original": "{panelState: boolean, isFormOpen: boolean}",
+                    "original": "{ panelState: boolean, isFormOpen: boolean }",
                     "resolved": "{ panelState: boolean; isFormOpen: boolean; }",
                     "references": {}
                 }

package/dist/collection/components/deduct-calculator/deduct-calculator.css

@@ -22,4 +22,4 @@
 .label-display {
   display: block;
   padding-bottom: 1rem;
-}
+}

package/dist/collection/components/deduct-calculator/deduct-calculator.js

@@ -93,7 +93,7 @@ export class DeductCalculator {
      * Renders the component.
      */
     render() {
-        return (h(Host, { key: '6a017676a4d4cce0ac332906e62630c93d673dd1' }, h("div", { key: '4411f75b59666e2bd268446a3e91558c803cbab6', class: "label-display" }, h("calcite-label", { key: '764e02dfc4e8224a2e7bab3ad0e90d611ff68911', class: "label-display" }, "Density %", this._getDensityInput()), h("calcite-label", { key: 'b939b06882ef6a14325f327644096d7a7a814ed5', class: "label-display" }, "Type", this._getTypeInput()), h("calcite-label", { key: 'a4b9801ca974b3ac8525080b8e1bcd4906ab4944', class: "label-display" }, "Severity", this._getSeverityInput())), h("div", { key: 'b47be60c381513f386569ca5a80525cbfdeaa0af' }, this._getCalculateInput())));
+        return (h(Host, { key: '5b8a88501e1b2c09ae02f284534a125a9eca2e1c' }, h("div", { key: 'a6cc13e4226710271b29de34d450e8bbe01133eb', class: "label-display" }, h("calcite-label", { key: 'edec19bc63ce834d9020ab118b31a7cb44acbc4d', class: "label-display" }, "Density %", this._getDensityInput()), h("calcite-label", { key: '733ff46213314e3c768a64d5c3547e5a3d769b80', class: "label-display" }, "Type", this._getTypeInput()), h("calcite-label", { key: 'd6b7142611e565530068b64da727e58a6de0aefe', class: "label-display" }, "Severity", this._getSeverityInput())), h("div", { key: '5eab9293683cdaaab7ddb40eea5127dd5061e60d' }, this._getCalculateInput())));
     }
     //--------------------------------------------------------------------------
     //

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

@@ -20,4 +20,4 @@
 
 .delete-modal {
   position: fixed;
-}
+}

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

@@ -92,7 +92,7 @@ export class DeleteButton {
      * Renders the component.
      */
     render() {
-        return (h(Host, { key: '1ff43b4d224c4cf7bbfc0656e9605cd4ac4c971a' }, 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()));
+        return (h(Host, { key: '9f2d463fab02c9081fea71102634bacd3ac57ac2' }, 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()));
     }
     /**
      * StencilJS: Called once just after the component is fully loaded and the first render() occurs.

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

@@ -35,7 +35,6 @@
 }
 
 #feature-form {
-  --calcite-color-background: none;
   padding-top: 0px;
 }
 
@@ -69,3 +68,8 @@
   left: 0;
   overflow: auto;
 }
+
+/* override the padding of the feature form */
+.esri-editor__panel-content {
+  padding-block: 10px !important;
+}

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

@@ -194,7 +194,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: 'ae604b83ef7eb6a2117145b3e9f9c1c8dd1c8688' }, h("div", { key: 'a229ea8ae44ef10a2a75011d81d0c16a461b675f', 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: 'c9461e247a3b3b6e0c7af17a3646282dbd410b89', class: "position-absolute" }, h("div", { key: '3e385f2d39277de3eeb665e6b95a1c426d3c66b4', class: tableNodeClass, id: "feature-form", ref: (el) => this._editContainer = el }), h("calcite-loader", { key: 'a995cdebcbbd9d25d2f0784c5dca7dbfbd2757dd', class: loadingClass, label: "", scale: "s" })))));
+        return (h(Host, { key: '702d90ff413f7559cfc85b1e8e709e1076ec00d6' }, h("div", { key: '8a2469c080aee5cc466e587ede8de7a60e6db7bb', 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: 'f9fce7512f023aed9151f8f6022202819e9378cd', class: "position-absolute" }, h("div", { key: '4f5e6afd20e6adb5f34a3940a193c0d858212d88', class: tableNodeClass, id: "feature-form", ref: (el) => this._editContainer = el }), h("calcite-loader", { key: '437c74efd97d1cbea536fc33fabab9b46ff2812b', class: loadingClass, label: "", scale: "s" })))));
     }
     //--------------------------------------------------------------------------
     //

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

@@ -16,4 +16,4 @@
 
 :host {
   display: block;
-}
+}

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

@@ -62,7 +62,7 @@ export class FeatureComments {
     //
     //--------------------------------------------------------------------------
     render() {
-        return (h(Host, { key: '0d331b7c201854181dcf80f6192de2c00218b50c' }, h("slot", { key: '4b602b73d1b6d773eb49eace91df6613117e974d' })));
+        return (h(Host, { key: '0d714e6be492d8df6ef9a1b9aec14ec4860ccbfd' }, h("slot", { key: '378655639849dd98f172b8a54cd23b0fb5f52079' })));
     }
     static get is() { return "feature-comments"; }
     static get encapsulation() { return "shadow"; }

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

@@ -2,7 +2,7 @@
   display: block;
 }
 
-.buttons-container{
+.buttons-container {
   align-items: center;
   display: flex;
   padding: 4px;
@@ -12,7 +12,7 @@
   border-block-end: 1px solid var(--calcite-color-border-3);
 }
 
-.comment-btn{
+.comment-btn {
   display: flex;
   gap: 10px;
   font-size: var(--calcite-font-size--1);

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

@@ -172,12 +172,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: 'a2d31f643b1a361343eb502ede98a35ea954f244', "full-height": true }, h("info-card", { key: '4ba44decfa3f155034d3edfdf8ab3e7df5f1ea8a', 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: '0f7af99fd964da408f3131385cfd617138f40151', class: "buttons-container" }, this._commentsAvailable &&
-                h("div", { key: '6ce7b090a07db23c542fc7aaacf9cc8a39987483', class: "comment-btn" }, h("span", { key: 'fcce9266efa253c679dcb69f308c07950f5e2693' }, this._relatedFeaturesOIDs.length), h("calcite-icon", { key: '25355a5c195824e473a390f196d28c909c1348eb', icon: "speech-bubble", scale: 's' })), this._likeFieldAvailable &&
-                h("calcite-button", { key: '6dca1c0f2ca14f662de98362cbe7ef0993fad6b8', 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: '9d1c0a5938806645a24a757f06e31b13587912dc', 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: '73f81c666a054b2c9f02246fcc7ea4811494c106', 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: '78ec0511a7742789b79b74014bb5f75e6730d03c', "full-height": true }, h("info-card", { key: '79e5e23332c59b7ba069f7c0f9e61f58b8ffa247', 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: '338d23e04cfe6c5ddc9b6c4aaedd0206fff700cd', class: "buttons-container" }, this._commentsAvailable &&
+                h("div", { key: 'b62d2329ff2fe44ff55615e9b9dd7e39c9bf6a5d', class: "comment-btn" }, h("span", { key: '62788ce338216eda2d531457a2978cbd959a2ad9' }, this._relatedFeaturesOIDs.length), h("calcite-icon", { key: '84238a392ca1b96372882a1b40daf8969ab48338', icon: "speech-bubble", scale: 's' })), this._likeFieldAvailable &&
+                h("calcite-button", { key: '0662c0cb848b8c72085efb7ded35071cbf47a9a6', 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: 'ef7c692a0e213c833cf3503441eb995afed02087', 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: '9f335cea513da6483f3a4fc18e7c678ae6fdde36', 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

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

@@ -16,4 +16,4 @@
 
 :host {
   display: block;
-}
+}

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: 'e4cd5ed27b476b7f5ed699ed13422b54b84be2e5' }, h("slot", { key: 'b73e8f8b52ac166b0e85f3114ed0fb0d57a7fec9' })));
+        return (h(Host, { key: 'f7daea4e10833362a48aba66f3f6c68290a10c11' }, h("slot", { key: 'a61f41868a16e3eda7762704409cd491ab7bb034' })));
     }
     static get is() { return "feature-form-flow-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -68,4 +68,4 @@
   min-width: 30px;
   display: flex;
   justify-content: center;
-}
+}

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

@@ -172,9 +172,9 @@ export class FeatureList {
      * Renders the component.
      */
     render() {
-        return (h("calcite-panel", { key: 'b84cbd9d8c0f4d9d84fe7a49d149b67e88e46c53', "full-height": true, "full-width": true }, this._isLoading && h("calcite-loader", { key: '91ee86a3223b55141206be0d3f20bca1b777e4db', label: "", scale: "m" }), this.showErrorWhenNoFeatures && this._featureItems.length === 0 && !this._isLoading &&
-            h("calcite-notice", { key: '3c3b4a35c45715a86bd17630e8f3f9b566592c27', class: "error-msg", icon: "feature-details", kind: "info", open: true }, h("div", { key: '63a35389ac64f66c706fa05e92fb8f1af8dd0b69', slot: "message" }, this.noFeaturesFoundMsg ? this.noFeaturesFoundMsg : this._translations.featureErrorMsg)), h("calcite-list", { key: 'a237f97a0d286af17cce837bfbdd3c0d868ea023', "selection-appearance": "border", "selection-mode": "none" }, !this._isLoading && this._featureItems.length > 0 && this._featureItems), this._featuresCount > this.pageSize &&
-            h("div", { key: '9cb166b5095167a2004e93217240bea6789e9039', class: "width-full", slot: "footer" }, h("calcite-pagination", { key: 'a413b26dd30fdc89be1d65ef06995604f1430a18', 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: '48a1da86541c4612eb8c4c59c3456248917ab70d', "full-height": true, "full-width": true }, this._isLoading && h("calcite-loader", { key: '941d47de3f9a9c1121361b3ee4b456104940fa1d', label: "", scale: "m" }), this.showErrorWhenNoFeatures && this._featureItems.length === 0 && !this._isLoading &&
+            h("calcite-notice", { key: '43ca98b11eb59119fc61269300858593e719d8a9', class: "error-msg", icon: "feature-details", kind: "info", open: true }, h("div", { key: 'adb5a2aedc1908788c3a072230f699c74933cf65', slot: "message" }, this.noFeaturesFoundMsg ? this.noFeaturesFoundMsg : this._translations.featureErrorMsg)), h("calcite-list", { key: '635d6b1feafd3abb2318c0e4a7acad9528d855f2', "selection-appearance": "border", "selection-mode": "none" }, !this._isLoading && this._featureItems.length > 0 && this._featureItems), this._featuresCount > this.pageSize &&
+            h("div", { key: 'c59bc38e36cda97a389e6f8724f572d402e1bb5b', class: "width-full", slot: "footer" }, h("calcite-pagination", { key: 'bd2e111d066236b1490559112d29a9514ae90ccb', 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 }))));
     }
     //--------------------------------------------------------------------------
     //

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

@@ -16,4 +16,4 @@
 
 :host {
   display: block;
-}
+}

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

@@ -62,7 +62,7 @@ export class FeaturesFlowItem {
     //
     //--------------------------------------------------------------------------
     render() {
-        return (h(Host, { key: '0070ec5f638adacbae77befed92f4aa61a675c8f' }, h("slot", { key: 'c13088ad63e931160712bdb385e431f63ca14862' })));
+        return (h(Host, { key: '55511af669a09a7b30cfc06ed7ef312b9e8bf8a7' }, h("slot", { key: 'be47b259b170b75acf426722a139a2f843bdf280' })));
     }
     static get is() { return "features-flow-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -16,4 +16,4 @@
 
 :host {
   display: block;
-}
+}

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

@@ -127,7 +127,7 @@ export class FloorFilter {
      * Renders the component.
      */
     render() {
-        return (h(Host, { key: '8c59ed98841f476670392c6ebd9dc764d72f4733' }, h("div", { key: 'b2400febc768a595dbcc6933af1565da173d97f5', ref: (el) => { this._floorFilterElement = el; } })));
+        return (h(Host, { key: '45059efd35fe78a0b8a7b723ebdd601f5d62f26c' }, h("div", { key: '18f6f3db1139102d3bb25386d0feab734f8e94c2', 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: '8714c3ab52be88e3622888c7984c9ded5759fa17' }, h("calcite-shell", { key: 'f63b166a00794815af852a1260fe7b67784428d4', style: { position: this.position } }, this._getHeader(), h("calcite-loader", { key: 'b937ff64982989f3dec3c94236932698300b0eb6', class: loadingClass, label: this._translations.fetchingData }), h("div", { key: '0f7b914839ab400b1f757eb50cd0ba5f60628336', class: "esri-widget feature-node " + featureNodeClass, id: this._featuresNodeId }), h("div", { key: '9867c94363da7d060bc718e77eab0ed139d4ba7d', class: `${editButtonClass} width-100`, slot: "footer" }, this.allowEditing &&
-            h("div", { key: 'a90edcda183289259db99b9255d28d6c31809d40', class: "display-flex top-border padding-1-2" }, h("calcite-button", { key: 'b1bc47ed857efc478c11e1353216bb8925b75885', 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: 'd493735dadf6dd34a767332a1a179716fbfa6384', placement: "bottom", "reference-element": "solutions-edit" }, h("span", { key: '663217b0b2c078aa7ac1b99a891af5380b9521c1' }, 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: 'df2249f431b0df3a25c44fb6d54adec903bbe328', class: `display-flex padding-1-2 button-container top-border ${nextBackClass}` }, h("div", { key: '31b82d904e766f938c2c1fc5bd76625921e7fe10' }, h("calcite-button", { key: '49656c590d330796f1d508ef33689f909991a6ec', appearance: 'transparent', disabled: nextBackDisabled, iconStart: "chevron-left", id: "solutions-back", onClick: () => this._back(), width: "full" }), h("calcite-tooltip", { key: 'f5238fdc65fa68152961253d536be38a044aeb76', placement: "top", "reference-element": "solutions-back" }, h("span", { key: '470c4da1cd28940155bdbd30acc8b742d827a891' }, this._translations.back))), h("calcite-action", { key: 'be9e9b4d4dbabe2c11bf13043bfb33cdae093315', class: 'pagination-action', onClick: () => this._toggleListView(), scale: "s", text: "", textEnabled: true }, h("span", { key: 'd7d3313b537691ac131b958475e6547f3659c6ac', class: "pagination-count" }, this._count)), h("div", { key: '0ef506ac483cf51a958e335b16cbe9a764bb497e' }, h("calcite-button", { key: 'f3c1a25fe1a619275f32058d1fa646467e83cca5', appearance: "transparent", disabled: nextBackDisabled, iconStart: "chevron-right", id: "solutions-next", onClick: () => this._next(), width: "full" }), h("calcite-tooltip", { key: 'cddbf1200a3acd465e5ef23f34b5bf26c81ffad5', placement: "top", "reference-element": "solutions-next" }, h("span", { key: '9e9454c303b8f37f12d4ad07b3401d50bd04141d' }, this._translations.next))))), h("edit-card", { key: '3497893bbb59f3a2ace941d3bb1d98b0fa7fac0c', class: editClass, enableEditGeometry: this.enableEditGeometry, graphicIndex: this._features?.selectedFeatureIndex, graphics: this.graphics, mapView: this.mapView, open: this._editRecordOpen }), h("calcite-alert", { key: '4fa290b977bf7c619cc349176bb1e244c554b58d', icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { key: '1e3998afedd33582d33e0c1556a1bcac87902761', slot: "title" }, this._translations.editDisabled), h("div", { key: '489ef148cc4da2a7d7e881d4de9cd6a71ac53809', slot: "message" }, this._translations.enableEditing)))));
+        return (h(Host, { key: '6f425d1817646bd9a9e4a600d391097677026f25' }, h("calcite-shell", { key: 'e717377ce155936033cdcc9ae21de8355cca08ca', style: { position: this.position } }, this._getHeader(), h("calcite-loader", { key: 'b5281d2fea94193f85d24019ac02425f9fe7e09d', class: loadingClass, label: this._translations.fetchingData }), h("div", { key: '9cc87e384a838a324ebd45bd35c48ff508628eb7', class: "esri-widget feature-node " + featureNodeClass, id: this._featuresNodeId }), h("div", { key: '3919d8b734caf6639d2a42eb675eecd35c5e5097', class: `${editButtonClass} width-100`, slot: "footer" }, this.allowEditing &&
+            h("div", { key: 'f07c11a195aaba15a277b9ab0ebd7d0a36d33820', class: "display-flex top-border padding-1-2" }, h("calcite-button", { key: '15791bdca2014ddd1a09e4ed145b9e871a431636', 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: '5e86460a3af8b4e24e3c64f03e83a975045ced17', placement: "bottom", "reference-element": "solutions-edit" }, h("span", { key: '2f0915508a261e76980f7bbd550b73dc5888ef3e' }, 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: '461230a7f8096d3f6f53b422d724a1fdb406fe92', class: `display-flex padding-1-2 button-container top-border ${nextBackClass}` }, h("div", { key: '7e9f6d377d776951759c0a7eac4512eda1101088' }, h("calcite-button", { key: 'a3cf2ee2e28f9d2da4a2d0c74f83cd55c3f882cb', appearance: 'transparent', disabled: nextBackDisabled, iconFlipRtl: "both", iconStart: "chevron-left", id: "solutions-back", onClick: () => this._back(), width: "full" }), h("calcite-tooltip", { key: '6cc374cd4dc943fdf09940fc9a7d4c1e13421567', placement: "top", "reference-element": "solutions-back" }, h("span", { key: '67caf535d71dc664c64a1d6b9f7f3512f157d143' }, this._translations.back))), h("calcite-action", { key: '90901930abe85183cd6fb8c7dd850385a6f2f8f8', class: 'pagination-action', iconFlipRtl: true, onClick: () => this._toggleListView(), scale: "s", text: "", textEnabled: true }, h("span", { key: '99ee44c6f416b9315fbe157d32f2c64ef5f91ba3', class: "pagination-count" }, this._count)), h("div", { key: 'b96ee80ab7668193b7e29c635692b96d61da07ba' }, h("calcite-button", { key: 'd0257d2159d1e18ecebaad7952a76b1534164996', appearance: "transparent", disabled: nextBackDisabled, iconFlipRtl: "both", iconStart: "chevron-right", id: "solutions-next", onClick: () => this._next(), width: "full" }), h("calcite-tooltip", { key: '5f7476d0c42127bbf7a2533d422399a6887d308b', placement: "top", "reference-element": "solutions-next" }, h("span", { key: 'cc4d1da8990996ebea70688b9a8fa0ccaeeea4cb' }, this._translations.next))))), h("edit-card", { key: '2189a272fae0b15aaa563daa2b8ae411d8e61fb0', class: editClass, enableEditGeometry: this.enableEditGeometry, graphicIndex: this._features?.selectedFeatureIndex, graphics: this.graphics, mapView: this.mapView, open: this._editRecordOpen }), h("calcite-alert", { key: 'fb557a7cf23b8711aec88da6483ab385372d9db4', icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { key: 'a3aa6e09d43f045d69c630d6e8b8c0c5c2eee55e', slot: "title" }, this._translations.editDisabled), h("div", { key: 'a76fd3260afcd35d42091a18690950be44f11365', 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: '01ac5edcc26e82397316e8a01229a3d27d6902af' }, h("div", { key: '87e015e58f6a1822ba202f660655078b7f7c1a8c', id: `${this.instanceid}-editor-container`, class: "editor-container padding-right" }, h("div", { key: '90d98682605a514797da3dc11a9f68dad336759b', class: "editor-controls" }, h("div", { key: 'c5eca5a9750d8f010ce9d749cfe7529a0b5c95c6', class: "editor-buttons" }, h("calcite-icon", { key: '5cdea0dc714261c6fa454d43c5fd3ba3902d9eac', id: `${this.instanceid}-errorFlag`, icon: "exclamation-mark-triangle", title: this._translations.errorFlag, scale: "s", class: "edit-error-flag" }), h("calcite-button", { key: 'e7f8e33c62c98a887b06bf20d5a718849f1455c6', id: `${this.instanceid}-undo`, color: "blue", appearance: "solid", title: this._translations.undo, onClick: () => this._undo(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: 'fb3e4ea4d2120bd2fce4541c6c90b1d16fe7da2f', icon: "undo", scale: "s" })), h("calcite-button", { key: 'ba214ef0fa2d27d4334dd4b10d7bf15c35b49407', id: `${this.instanceid}-redo`, color: "blue", appearance: "solid", title: this._translations.redo, onClick: () => this._redo(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: 'da359a0692ff1dd777588ab657f2520ca62eeb93', icon: "redo", scale: "s" })), h("calcite-button", { key: '569955fc77faf069f66b3c7376973822cc17f038', id: `${this.instanceid}-diff`, color: "blue", appearance: "solid", title: this._translations.diff, onClick: () => this._toggleEditor(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: 'e477c4ae6d3b2cda3bdcc56660739ffab9b271c1', icon: "compare", scale: "s" })), h("calcite-button", { key: 'a691eb75c7487c6b401f4d35a4e7e8ac84e0d8f9', id: `${this.instanceid}-search`, appearance: "outline", color: "blue", title: this._translations.search, onClick: () => this._search(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: '7a0cc6c45b49fb6db3963e7325291dd36dbc95ac', icon: "search", scale: "s" })), h("calcite-button", { key: '1ac31fcbb93e38aff565559174b45a5ef286dc01', 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: 'abcc13ccb46312d8169196af5336bf8d25882ac8', icon: "reset", scale: "s" })))), h("div", { key: 'd70a08eec3c817a38dafb6ed15085efbc3aed090', class: "edit-parent" }, h("div", { key: '6cdec935e00ba08af533c7b2ca565f9a6fefc268', id: `${this.instanceid}-container`, class: "json-edit-container" }), h("div", { key: '1611a95a808ba19133d4c3d5bec6def362771746', id: `${this.instanceid}-diff-container`, class: "json-edit-container display-none" })))));
+        return (h(Host, { key: '2fd22babaed7afb3f36a969dd851647aee6c314c' }, h("div", { key: 'cf86700a99c9ec6d94787d3a312950cb4981bc74', id: `${this.instanceid}-editor-container`, class: "editor-container padding-right" }, h("div", { key: 'a2fe047ce3d446e1e19ff9c6d1a6cf8663e709e2', class: "editor-controls" }, h("div", { key: '96f89ae7ded81e5d4dd2f40384dab407398082ef', class: "editor-buttons" }, h("calcite-icon", { key: '15beba29161b151abdad39a8a9082ef91e5bef63', id: `${this.instanceid}-errorFlag`, icon: "exclamation-mark-triangle", title: this._translations.errorFlag, scale: "s", class: "edit-error-flag" }), h("calcite-button", { key: '83854df89361aa8576d11cf9ac70e4696d9c5b1e', id: `${this.instanceid}-undo`, color: "blue", appearance: "solid", title: this._translations.undo, onClick: () => this._undo(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: '95f5aa78cd57aaae8ec626249769b805f24a5f9c', icon: "undo", scale: "s" })), h("calcite-button", { key: 'a42752361c684b30a31eceade8009fc9bb2ce5d2', id: `${this.instanceid}-redo`, color: "blue", appearance: "solid", title: this._translations.redo, onClick: () => this._redo(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: '3a03a0ae3c375d0be032d9ce4669631be0d596b8', icon: "redo", scale: "s" })), h("calcite-button", { key: '234ddc8d1ba7b42c033e45650fe137292d6838d9', id: `${this.instanceid}-diff`, color: "blue", appearance: "solid", title: this._translations.diff, onClick: () => this._toggleEditor(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: 'ab10706d7b62154805b1a5c50d2bee63169a5860', icon: "compare", scale: "s" })), h("calcite-button", { key: '52cb4b32b14ac265dd4cd7f3943bbb23c1d939fa', id: `${this.instanceid}-search`, appearance: "outline", color: "blue", title: this._translations.search, onClick: () => this._search(), scale: "s", class: "edit-button" }, h("calcite-icon", { key: '525f805a2cdc8d7b58b529cb4d9e472629cb0a45', icon: "search", scale: "s" })), h("calcite-button", { key: '752467c7e12242efcc97f465a66593a0fb3a72e8', 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: '1bb105e06a9cca9bd3116fc9c4d353f9679bb8ff', icon: "reset", scale: "s" })))), h("div", { key: '4ef626c366c89b494fcd5f1dfa41e602e65d592a', class: "edit-parent" }, h("div", { key: 'ffe9e40ed3da5627ffde778e9d0e9df222e37b63', id: `${this.instanceid}-container`, class: "json-edit-container" }), h("div", { key: '418010cb1b16de4e00e0cb7a9463f76c5de18a25', id: `${this.instanceid}-diff-container`, class: "json-edit-container display-none" })))));
     }
     //--------------------------------------------------------------------------
     //

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

@@ -29,4 +29,4 @@
 
 .feature-count {
   padding-right: 12px;
-}
+}