@esri/solutions-components 0.7.48 → 0.7.50

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

@@ -29,8 +29,9 @@ export class CrowdsourceManager {
          * MapView.when is not fired when mapView is not currently visible
          */
         this._shouldSetMapView = false;
+        this._defaultCenterHonored = false;
+        this._defaultLevelHonored = false;
         this.defaultCenter = "";
-        this.defaultFilter = "";
         this.defaultGlobalId = "";
         this.defaultLayer = "";
         this.defaultLevel = "";
@@ -75,39 +76,6 @@ export class CrowdsourceManager {
     //  Watch handlers
     //
     //--------------------------------------------------------------------------
-    /**
-     * Watch for center url param to be set
-     */
-    defaultCenterWatchHandler() {
-        this._defaultCenter = !this.defaultCenter ? undefined :
-            this.defaultCenter.split(";").map(v => parseFloat(v));
-    }
-    /**
-     * Watch for filter url param to be set
-     */
-    defaultFilterWatchHandler() {
-        this._defaultFilter = JSON.parse(this.defaultFilter);
-    }
-    /**
-     * Watch for globalid url param to be set
-     */
-    defaultGlobalIdWatchHandler() {
-        this._defaultGlobalId = !this.defaultGlobalId ? undefined :
-            this.defaultGlobalId.indexOf(",") > -1 ? this.defaultGlobalId.split(",") : [this.defaultGlobalId];
-    }
-    /**
-     * Watch for oid url param to be set
-     */
-    defaultOidWatchHandler() {
-        this._defaultOid = !this.defaultOid ? undefined :
-            this.defaultOid.indexOf(",") > -1 ? this.defaultOid.split(",").map(o => parseInt(o, 10)) : [parseInt(this.defaultOid, 10)];
-    }
-    /**
-     * Watch for zoom level param to be set
-     */
-    defaultLevelWatchHandler() {
-        this._defaultLevel = !this.defaultLevel ? undefined : parseInt(this.defaultLevel, 10);
-    }
     /**
      * When true the map zoom tools will be available
      */
@@ -399,6 +367,7 @@ export class CrowdsourceManager {
      * @protected
      */
     _getTable(layoutMode, panelOpen, hideTable) {
+        var _a, _b;
         const tableClass = hideTable && this._isMobile ? "visibility-hidden" : "";
         const tableSizeClass = this._getTableSizeClass(layoutMode, panelOpen);
         const icon = this._getDividerIcon(layoutMode, panelOpen);
@@ -407,7 +376,11 @@ export class CrowdsourceManager {
         const toggleLayout = layoutMode === ELayoutMode.HORIZONTAL ? "horizontal" : "vertical";
         const toggleSlot = layoutMode === ELayoutMode.HORIZONTAL ? "header" : "panel-start";
         const hasMapAndLayer = this.defaultWebmap && this.defaultLayer;
-        return (h("calcite-shell", { class: `${tableSizeClass} ${tableClass} border-bottom` }, !this._isMobile ? (h("calcite-action-bar", { class: "border-sides", expandDisabled: true, layout: toggleLayout, slot: toggleSlot }, h("calcite-action", { class: "toggle-node", icon: icon, id: id, onClick: () => this._toggleLayout(), text: "" }), h("calcite-tooltip", { label: tooltip, placement: "bottom", "reference-element": id }, h("span", null, tooltip)))) : undefined, h("div", { class: `width-full height-full position-relative` }, h("layer-table", { defaultFilter: hasMapAndLayer ? this._defaultFilter : undefined, defaultGlobalId: hasMapAndLayer ? this._defaultGlobalId : undefined, defaultLayerId: hasMapAndLayer ? this.defaultLayer : "", defaultOid: hasMapAndLayer && !this.defaultGlobalId ? this._defaultOid : undefined, enableAutoRefresh: this.enableAutoRefresh, enableCSV: this.enableCSV, enableColumnReorder: this.enableColumnReorder, enableInlineEdit: this.enableInlineEdit, enableShare: this.enableShare, isMobile: this._isMobile, mapInfo: this._mapInfo, mapView: this === null || this === void 0 ? void 0 : this._mapView, onlyShowUpdatableLayers: this.onlyShowUpdatableLayers, ref: (el) => this._layerTable = el, shareIncludeEmbed: this.shareIncludeEmbed, shareIncludeSocial: this.shareIncludeSocial, showNewestFirst: this.showNewestFirst, zoomAndScrollToSelected: this.zoomAndScrollToSelected }))));
+        const globalId = !this.defaultGlobalId ? undefined :
+            ((_a = this.defaultGlobalId) === null || _a === void 0 ? void 0 : _a.indexOf(",")) > -1 ? this.defaultGlobalId.split(",") : [this.defaultGlobalId];
+        const defaultOid = !this.defaultOid ? undefined :
+            ((_b = this.defaultOid) === null || _b === void 0 ? void 0 : _b.indexOf(",")) > -1 ? this.defaultOid.split(",").map(o => parseInt(o, 10)) : [parseInt(this.defaultOid, 10)];
+        return (h("calcite-shell", { class: `${tableSizeClass} ${tableClass} border-bottom` }, !this._isMobile ? (h("calcite-action-bar", { class: "border-sides", expandDisabled: true, layout: toggleLayout, slot: toggleSlot }, h("calcite-action", { class: "toggle-node", icon: icon, id: id, onClick: () => this._toggleLayout(), text: "" }), h("calcite-tooltip", { label: tooltip, placement: "bottom", "reference-element": id }, h("span", null, tooltip)))) : undefined, h("div", { class: `width-full height-full position-relative` }, h("layer-table", { defaultGlobalId: hasMapAndLayer ? globalId : undefined, defaultLayerId: hasMapAndLayer ? this.defaultLayer : "", defaultOid: hasMapAndLayer && !globalId ? defaultOid : undefined, enableAutoRefresh: this.enableAutoRefresh, enableCSV: this.enableCSV, enableColumnReorder: this.enableColumnReorder, enableInlineEdit: this.enableInlineEdit, enableShare: this.enableShare, isMobile: this._isMobile, mapInfo: this._mapInfo, mapView: this === null || this === void 0 ? void 0 : this._mapView, onlyShowUpdatableLayers: this.onlyShowUpdatableLayers, ref: (el) => this._layerTable = el, shareIncludeEmbed: this.shareIncludeEmbed, shareIncludeSocial: this.shareIncludeSocial, showNewestFirst: this.showNewestFirst, zoomAndScrollToSelected: this.zoomAndScrollToSelected }))));
     }
     /**
      * Update the component layout when its size changes
@@ -460,17 +433,22 @@ export class CrowdsourceManager {
      * @protected
      */
     async _setMapView() {
+        var _a;
         this._mapInfo = this._getMapInfo(this._mapChange.id);
         this._mapView = this._mapChange.mapView;
         this._initMapZoom();
         this._mapView.popupEnabled = false;
-        if (this._defaultCenter && this._defaultLevel) {
+        const center = !this.defaultCenter || this._defaultCenterHonored ?
+            undefined : (_a = this.defaultCenter) === null || _a === void 0 ? void 0 : _a.split(";").map(v => parseFloat(v));
+        const zoom = !this.defaultLevel || this._defaultLevelHonored ?
+            undefined : parseInt(this.defaultLevel, 10);
+        if (center && zoom) {
             await this._mapView.goTo({
-                center: this._defaultCenter,
-                zoom: this._defaultLevel
+                center,
+                zoom
             });
-            this._defaultCenter = undefined;
-            this._defaultLevel = undefined;
+            this._defaultCenterHonored = true;
+            this._defaultLevelHonored = true;
         }
     }
     /**
@@ -531,24 +509,6 @@ export class CrowdsourceManager {
                 "reflect": false,
                 "defaultValue": "\"\""
             },
-            "defaultFilter": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "string: default layer expression to apply to the current layer"
-                },
-                "attribute": "default-filter",
-                "reflect": false,
-                "defaultValue": "\"\""
-            },
             "defaultGlobalId": {
                 "type": "string",
                 "mutable": false,
@@ -1052,21 +1012,6 @@ export class CrowdsourceManager {
     static get elementRef() { return "el"; }
     static get watchers() {
         return [{
-                "propName": "defaultCenter",
-                "methodName": "defaultCenterWatchHandler"
-            }, {
-                "propName": "defaultFilter",
-                "methodName": "defaultFilterWatchHandler"
-            }, {
-                "propName": "defaultGlobalId",
-                "methodName": "defaultGlobalIdWatchHandler"
-            }, {
-                "propName": "defaultOid",
-                "methodName": "defaultOidWatchHandler"
-            }, {
-                "propName": "defaultLevel",
-                "methodName": "defaultLevelWatchHandler"
-            }, {
                 "propName": "enableZoom",
                 "methodName": "enableZoomWatchHandler"
             }];

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

@@ -64,7 +64,6 @@ export class LayerTable {
         this.onTableNodeCreate = (node) => {
             this._tableNode = node;
         };
-        this.defaultFilter = undefined;
         this.defaultGlobalId = undefined;
         this.defaultLayerId = undefined;
         this.defaultOid = undefined;
@@ -100,6 +99,12 @@ export class LayerTable {
     //  Watch handlers
     //
     //--------------------------------------------------------------------------
+    async defaultOidWatchHandler() {
+        await this._handleDefaults();
+    }
+    async defaultGlobalIdWatchHandler() {
+        await this._handleDefaults();
+    }
     /**
      * Reset the toolInfos when export csv is enabled/disabled
      */
@@ -156,6 +161,8 @@ export class LayerTable {
      * watch for changes in map info and update the toolbar
      */
     async mapInfoWatchHandler() {
+        this._resetColumnTemplates();
+        this._initLayerExpressions();
         this._initToolInfos();
         this._updateToolbar();
     }
@@ -186,8 +193,8 @@ export class LayerTable {
             this._floorField = (_a = this._layer.floorInfo) === null || _a === void 0 ? void 0 : _a.floorField;
             this._updateFloorDefinitionExpression();
             await this._resetTable();
-            this._updateShareUrl();
             this._initLayerExpressions();
+            this._updateShareUrl();
             this._fetchingData = false;
         }));
     }
@@ -785,22 +792,6 @@ export class LayerTable {
         else {
             urlObj.searchParams.delete("oid");
         }
-        if (this._filterActive) {
-            const filter = JSON.parse(this._filterList.urlParams.get("filter"));
-            const layerExpressions = this._filterList.layerExpressions.map(layerExp => {
-                layerExp.expressions = layerExp.expressions.map(exp => {
-                    if (exp.id.toString() === filter.expressionId.toString()) {
-                        exp.active = true;
-                    }
-                    return exp;
-                });
-                return layerExp;
-            });
-            urlObj.searchParams.set("filter", JSON.stringify(layerExpressions));
-        }
-        else {
-            urlObj.searchParams.delete("filter");
-        }
         this._shareNode.shareUrl = urlObj.href;
     }
     /**
@@ -814,7 +805,7 @@ export class LayerTable {
      * @returns VNode The tooltip node
      */
     _getToolTip(placement, referenceElement, text) {
-        return (h("calcite-tooltip", { placement: placement, "reference-element": referenceElement }, h("span", null, text)));
+        return document.getElementById(referenceElement) ? (h("calcite-tooltip", { placement: placement, "reference-element": referenceElement }, h("span", null, text))) : undefined;
     }
     /**
      * Get an id with a prefix to the user supplied value
@@ -874,8 +865,6 @@ export class LayerTable {
                     container: node
                 });
             });
-            this._initColumnsInfo();
-            this._checkEditEnabled();
             await this._table.when(() => {
                 this._table.highlightIds.on("change", (evt) => {
                     void this._handleOnChange(evt);
@@ -979,7 +968,11 @@ export class LayerTable {
     _resetColumnTemplates() {
         var _a, _b;
         const columnTemplates = this._getColumnTemplates((_a = this._layer) === null || _a === void 0 ? void 0 : _a.id, (_b = this._layer) === null || _b === void 0 ? void 0 : _b.fields);
-        if (this._table && columnTemplates) {
+        const hasChange = columnTemplates.some((ct, i) => {
+            var _a;
+            return JSON.stringify((_a = this._table) === null || _a === void 0 ? void 0 : _a.tableTemplate.columnTemplates[i]) !== JSON.stringify(ct);
+        });
+        if (this._table && columnTemplates && hasChange) {
             this._table.tableTemplate = new this.TableTemplate({
                 columnTemplates
             });
@@ -993,46 +986,73 @@ export class LayerTable {
     async _resetTable() {
         var _a;
         this._clearSelection();
-        this._allIds = [];
-        this.featureSelectionChange.emit(this.selectedIds);
-        const columnTemplates = this._getColumnTemplates(this._layer.id, (_a = this._layer) === null || _a === void 0 ? void 0 : _a.fields);
         this._allIds = await queryAllIds(this._layer);
         if (!this._table) {
+            const columnTemplates = this._getColumnTemplates(this._layer.id, (_a = this._layer) === null || _a === void 0 ? void 0 : _a.fields);
             await this._getTable(this._tableNode, columnTemplates);
         }
-        this._table.layer = this._layer;
-        this._table.view = this.mapView;
+        else {
+            this._table.view = this.mapView;
+            this._table.layer = this._layer;
+        }
+        await this._initLayerRefresh();
         this._checkEditEnabled();
         this._table.editingEnabled = this._editEnabled && this.enableInlineEdit;
         await this.reactiveUtils.once(() => this._table.state === "loaded")
             .then(async () => {
-            var _a, _b;
             this._table.highlightIds.removeAll();
             this._table.clearSelectionFilter();
             this._resetColumnTemplates();
-            if (!this._defaultOidHonored && ((_a = this.defaultOid) === null || _a === void 0 ? void 0 : _a.length) > 0 && this.defaultOid[0] > -1) {
-                this._selectDefaultFeature(this.defaultOid);
-                this._defaultOidHonored = true;
-            }
-            if (!this._defaultGlobalIdHonored && ((_b = this.defaultGlobalId) === null || _b === void 0 ? void 0 : _b.length) > 0) {
-                const features = await queryFeaturesByGlobalID(this.defaultGlobalId, this._layer);
-                const oids = (features === null || features === void 0 ? void 0 : features.length) > 0 ? features.map(f => f.getObjectId()) : undefined;
-                if (oids) {
-                    this._selectDefaultFeature(oids);
-                }
-                this._defaultGlobalIdHonored = true;
-            }
-            if (!this._defaultFilterHonored && this.defaultFilter && this._filterList) {
-                this._layerExpressions = this.defaultFilter;
-                this._filterActive = true;
-                this._defaultFilterHonored = true;
-            }
             this._showOnlySelected = false;
+            await this._handleDefaults();
             await this._sortTable();
             this._initToolInfos();
             this._updateToolbar();
         });
     }
+    /**
+     * Update the current IDs when that layers data is modified
+     */
+    async _initLayerRefresh() {
+        if (this._refreshHandle) {
+            this._refreshHandle.remove();
+        }
+        this._refreshHandle = this._layer.on("refresh", (evt) => {
+            if (evt.dataChanged) {
+                this._skipOnChange = true;
+                void this._updateAllIds();
+            }
+        });
+    }
+    /**
+     * Reset _allIds when the layers data has changed and refresh the selection ids and table
+     */
+    async _updateAllIds() {
+        this._allIds = await queryAllIds(this._layer);
+        this.selectedIds = this.selectedIds.filter(id => this._allIds.indexOf(id) > -1);
+        await this._refresh();
+    }
+    async _handleDefaults() {
+        var _a, _b;
+        if (!this._defaultOidHonored && ((_a = this.defaultOid) === null || _a === void 0 ? void 0 : _a.length) > 0 && this.defaultOid[0] > -1 && this._table) {
+            await this._selectDefaultFeature(this.defaultOid);
+            this._defaultOidHonored = true;
+            this.defaultOid = undefined;
+            this._showOnlySelected = false;
+            this._toggleShowSelected();
+        }
+        if (!this._defaultGlobalIdHonored && ((_b = this.defaultGlobalId) === null || _b === void 0 ? void 0 : _b.length) > 0 && this._table) {
+            const features = await queryFeaturesByGlobalID(this.defaultGlobalId, this._layer);
+            const oids = (features === null || features === void 0 ? void 0 : features.length) > 0 ? features.map(f => f.getObjectId()) : undefined;
+            if (oids) {
+                await this._selectDefaultFeature(oids);
+            }
+            this._defaultGlobalIdHonored = true;
+            this.defaultGlobalId = undefined;
+            this._showOnlySelected = false;
+            this._toggleShowSelected();
+        }
+    }
     /**
      * Store the column names and current hidden status to support show/hide of columns
      * @param fieldNames optional list of names from new config options
@@ -1061,13 +1081,12 @@ export class LayerTable {
     /**
      * Select the feature that was specified via url params
      */
-    _selectDefaultFeature(oids) {
+    async _selectDefaultFeature(oids) {
         if (oids.length > 0) {
             this._table.highlightIds.addMany(oids);
-            void this._table.when(() => {
-                const i = this._table.viewModel.getObjectIdIndex(oids[0]);
-                this._table.viewModel.scrollToIndex(i);
-            });
+            // This is messed up and only make this worse
+            //const i = this._table.viewModel.getObjectIdIndex(oids[0]);
+            //this._table.viewModel.scrollToIndex(i);
         }
     }
     /**
@@ -1258,7 +1277,6 @@ export class LayerTable {
         this._layerExpressions = layerExpressions ? layerExpressions.filter((exp) => { var _a; return exp.id === ((_a = this._layer) === null || _a === void 0 ? void 0 : _a.id); }) : [];
         this._filterList.layerExpressions = this._layerExpressions;
         this._filterActive = this._layerExpressions.filter(lyrExp => {
-            console.log(lyrExp);
             return lyrExp.expressions.filter(exp => exp.active).length > 0;
         }).length > 0;
     }
@@ -1455,27 +1473,6 @@ export class LayerTable {
     }
     static get properties() {
         return {
-            "defaultFilter": {
-                "type": "unknown",
-                "mutable": false,
-                "complexType": {
-                    "original": "LayerExpression[]",
-                    "resolved": "LayerExpression[]",
-                    "references": {
-                        "LayerExpression": {
-                            "location": "import",
-                            "path": "@esri/instant-apps-components",
-                            "id": ""
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "LayerExpression[]: default layer expression(s) to apply to the current layer"
-                }
-            },
             "defaultGlobalId": {
                 "type": "unknown",
                 "mutable": false,
@@ -1807,6 +1804,12 @@ export class LayerTable {
     static get elementRef() { return "el"; }
     static get watchers() {
         return [{
+                "propName": "defaultOid",
+                "methodName": "defaultOidWatchHandler"
+            }, {
+                "propName": "defaultGlobalId",
+                "methodName": "defaultGlobalIdWatchHandler"
+            }, {
                 "propName": "enableCSV",
                 "methodName": "enableCSVWatchHandler"
             }, {

package/dist/components/crowdsource-manager.js

@@ -76,8 +76,9 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
          * MapView.when is not fired when mapView is not currently visible
          */
         this._shouldSetMapView = false;
+        this._defaultCenterHonored = false;
+        this._defaultLevelHonored = false;
         this.defaultCenter = "";
-        this.defaultFilter = "";
         this.defaultGlobalId = "";
         this.defaultLayer = "";
         this.defaultLevel = "";
@@ -122,39 +123,6 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
     //  Watch handlers
     //
     //--------------------------------------------------------------------------
-    /**
-     * Watch for center url param to be set
-     */
-    defaultCenterWatchHandler() {
-        this._defaultCenter = !this.defaultCenter ? undefined :
-            this.defaultCenter.split(";").map(v => parseFloat(v));
-    }
-    /**
-     * Watch for filter url param to be set
-     */
-    defaultFilterWatchHandler() {
-        this._defaultFilter = JSON.parse(this.defaultFilter);
-    }
-    /**
-     * Watch for globalid url param to be set
-     */
-    defaultGlobalIdWatchHandler() {
-        this._defaultGlobalId = !this.defaultGlobalId ? undefined :
-            this.defaultGlobalId.indexOf(",") > -1 ? this.defaultGlobalId.split(",") : [this.defaultGlobalId];
-    }
-    /**
-     * Watch for oid url param to be set
-     */
-    defaultOidWatchHandler() {
-        this._defaultOid = !this.defaultOid ? undefined :
-            this.defaultOid.indexOf(",") > -1 ? this.defaultOid.split(",").map(o => parseInt(o, 10)) : [parseInt(this.defaultOid, 10)];
-    }
-    /**
-     * Watch for zoom level param to be set
-     */
-    defaultLevelWatchHandler() {
-        this._defaultLevel = !this.defaultLevel ? undefined : parseInt(this.defaultLevel, 10);
-    }
     /**
      * When true the map zoom tools will be available
      */
@@ -446,6 +414,7 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
      * @protected
      */
     _getTable(layoutMode, panelOpen, hideTable) {
+        var _a, _b;
         const tableClass = hideTable && this._isMobile ? "visibility-hidden" : "";
         const tableSizeClass = this._getTableSizeClass(layoutMode, panelOpen);
         const icon = this._getDividerIcon(layoutMode, panelOpen);
@@ -454,7 +423,11 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
         const toggleLayout = layoutMode === ELayoutMode.HORIZONTAL ? "horizontal" : "vertical";
         const toggleSlot = layoutMode === ELayoutMode.HORIZONTAL ? "header" : "panel-start";
         const hasMapAndLayer = this.defaultWebmap && this.defaultLayer;
-        return (h("calcite-shell", { class: `${tableSizeClass} ${tableClass} border-bottom` }, !this._isMobile ? (h("calcite-action-bar", { class: "border-sides", expandDisabled: true, layout: toggleLayout, slot: toggleSlot }, h("calcite-action", { class: "toggle-node", icon: icon, id: id, onClick: () => this._toggleLayout(), text: "" }), h("calcite-tooltip", { label: tooltip, placement: "bottom", "reference-element": id }, h("span", null, tooltip)))) : undefined, h("div", { class: `width-full height-full position-relative` }, h("layer-table", { defaultFilter: hasMapAndLayer ? this._defaultFilter : undefined, defaultGlobalId: hasMapAndLayer ? this._defaultGlobalId : undefined, defaultLayerId: hasMapAndLayer ? this.defaultLayer : "", defaultOid: hasMapAndLayer && !this.defaultGlobalId ? this._defaultOid : undefined, enableAutoRefresh: this.enableAutoRefresh, enableCSV: this.enableCSV, enableColumnReorder: this.enableColumnReorder, enableInlineEdit: this.enableInlineEdit, enableShare: this.enableShare, isMobile: this._isMobile, mapInfo: this._mapInfo, mapView: this === null || this === void 0 ? void 0 : this._mapView, onlyShowUpdatableLayers: this.onlyShowUpdatableLayers, ref: (el) => this._layerTable = el, shareIncludeEmbed: this.shareIncludeEmbed, shareIncludeSocial: this.shareIncludeSocial, showNewestFirst: this.showNewestFirst, zoomAndScrollToSelected: this.zoomAndScrollToSelected }))));
+        const globalId = !this.defaultGlobalId ? undefined :
+            ((_a = this.defaultGlobalId) === null || _a === void 0 ? void 0 : _a.indexOf(",")) > -1 ? this.defaultGlobalId.split(",") : [this.defaultGlobalId];
+        const defaultOid = !this.defaultOid ? undefined :
+            ((_b = this.defaultOid) === null || _b === void 0 ? void 0 : _b.indexOf(",")) > -1 ? this.defaultOid.split(",").map(o => parseInt(o, 10)) : [parseInt(this.defaultOid, 10)];
+        return (h("calcite-shell", { class: `${tableSizeClass} ${tableClass} border-bottom` }, !this._isMobile ? (h("calcite-action-bar", { class: "border-sides", expandDisabled: true, layout: toggleLayout, slot: toggleSlot }, h("calcite-action", { class: "toggle-node", icon: icon, id: id, onClick: () => this._toggleLayout(), text: "" }), h("calcite-tooltip", { label: tooltip, placement: "bottom", "reference-element": id }, h("span", null, tooltip)))) : undefined, h("div", { class: `width-full height-full position-relative` }, h("layer-table", { defaultGlobalId: hasMapAndLayer ? globalId : undefined, defaultLayerId: hasMapAndLayer ? this.defaultLayer : "", defaultOid: hasMapAndLayer && !globalId ? defaultOid : undefined, enableAutoRefresh: this.enableAutoRefresh, enableCSV: this.enableCSV, enableColumnReorder: this.enableColumnReorder, enableInlineEdit: this.enableInlineEdit, enableShare: this.enableShare, isMobile: this._isMobile, mapInfo: this._mapInfo, mapView: this === null || this === void 0 ? void 0 : this._mapView, onlyShowUpdatableLayers: this.onlyShowUpdatableLayers, ref: (el) => this._layerTable = el, shareIncludeEmbed: this.shareIncludeEmbed, shareIncludeSocial: this.shareIncludeSocial, showNewestFirst: this.showNewestFirst, zoomAndScrollToSelected: this.zoomAndScrollToSelected }))));
     }
     /**
      * Update the component layout when its size changes
@@ -507,17 +480,22 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
      * @protected
      */
     async _setMapView() {
+        var _a;
         this._mapInfo = this._getMapInfo(this._mapChange.id);
         this._mapView = this._mapChange.mapView;
         this._initMapZoom();
         this._mapView.popupEnabled = false;
-        if (this._defaultCenter && this._defaultLevel) {
+        const center = !this.defaultCenter || this._defaultCenterHonored ?
+            undefined : (_a = this.defaultCenter) === null || _a === void 0 ? void 0 : _a.split(";").map(v => parseFloat(v));
+        const zoom = !this.defaultLevel || this._defaultLevelHonored ?
+            undefined : parseInt(this.defaultLevel, 10);
+        if (center && zoom) {
             await this._mapView.goTo({
-                center: this._defaultCenter,
-                zoom: this._defaultLevel
+                center,
+                zoom
             });
-            this._defaultCenter = undefined;
-            this._defaultLevel = undefined;
+            this._defaultCenterHonored = true;
+            this._defaultLevelHonored = true;
         }
     }
     /**
@@ -549,17 +527,11 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
     }
     get el() { return this; }
     static get watchers() { return {
-        "defaultCenter": ["defaultCenterWatchHandler"],
-        "defaultFilter": ["defaultFilterWatchHandler"],
-        "defaultGlobalId": ["defaultGlobalIdWatchHandler"],
-        "defaultOid": ["defaultOidWatchHandler"],
-        "defaultLevel": ["defaultLevelWatchHandler"],
         "enableZoom": ["enableZoomWatchHandler"]
     }; }
     static get style() { return crowdsourceManagerCss; }
 }, [0, "crowdsource-manager", {
         "defaultCenter": [1, "default-center"],
-        "defaultFilter": [1, "default-filter"],
         "defaultGlobalId": [1, "default-global-id"],
         "defaultLayer": [1, "default-layer"],
         "defaultLevel": [1, "default-level"],
@@ -599,11 +571,6 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
         "_numSelected": [32],
         "_tableOnly": [32]
     }, [[8, "featureSelectionChange", "featureSelectionChange"], [8, "popupClosed", "popupClosed"], [8, "idsFound", "idsFound"], [8, "layoutChanged", "layoutChanged"], [8, "mapChanged", "mapChanged"], [8, "beforeMapChanged", "beforeMapChanged"], [8, "layerSelectionChange", "layerSelectionChange"]], {
-        "defaultCenter": ["defaultCenterWatchHandler"],
-        "defaultFilter": ["defaultFilterWatchHandler"],
-        "defaultGlobalId": ["defaultGlobalIdWatchHandler"],
-        "defaultOid": ["defaultOidWatchHandler"],
-        "defaultLevel": ["defaultLevelWatchHandler"],
         "enableZoom": ["enableZoomWatchHandler"]
     }]);
 function defineCustomElement$1() {

package/dist/components/instant-apps-export.js

@@ -664,13 +664,13 @@ const InstantAppsExport$1 = /*@__PURE__*/ proxyCustomElement(class InstantAppsEx
         });
     }
     updateScaleBar() {
-        var _a, _b, _c;
-        if (this.scaleBarContainerEl) {
+        if (this.scaleBarContainerEl && this.view != null) {
             this.scaleBarContainerEl.innerHTML = '';
             if (this.showScaleBar) {
-                const scaleBar = (_c = (_b = (_a = this.view) === null || _a === void 0 ? void 0 : _a.container) === null || _b === void 0 ? void 0 : _b.querySelector('.esri-scale-bar.esri-widget')) === null || _c === void 0 ? void 0 : _c.cloneNode(true);
-                if (scaleBar != null) {
-                    this.scaleBarContainerEl.append(scaleBar);
+                const widgets = this.view.ui.getComponents();
+                const scaleBar = widgets === null || widgets === void 0 ? void 0 : widgets.find(({ container }) => { var _a; return (_a = container === null || container === void 0 ? void 0 : container.className) === null || _a === void 0 ? void 0 : _a.includes('esri-scale-bar'); });
+                if ((scaleBar === null || scaleBar === void 0 ? void 0 : scaleBar.container) != null && typeof scaleBar.container !== 'string') {
+                    this.scaleBarContainerEl.append(scaleBar.container.cloneNode(true));
                 }
             }
         }

package/dist/components/instant-apps-filter-list2.js

@@ -65,7 +65,7 @@ function resetDatePicker(datePicker) {
   }
 }
 
-const instantAppsFilterListCss = ":host{display:block}.instant-apps-filter-list *{box-sizing:border-box}.instant-apps-filter-list__container{height:100%}.instant-apps-filter-list__container calcite-block:last-of-type{margin-bottom:0}.instant-apps-filter-list__footer{padding:12px;display:flex}.instant-apps-filter-list__footer calcite-button:nth-child(2){margin-left:6px}.instant-apps-filter-list__item-container,.instant-apps-filter-list__item-container--user-input{display:flex;justify-content:space-between;align-items:center}.instant-apps-filter-list__item-container:not(:last-child),.instant-apps-filter-list__item-container--user-input:not(:last-child){padding-bottom:20px}.instant-apps-filter-list__item-container--user-input{margin:0;display:flex;flex-direction:column;align-items:flex-start}.instant-apps-filter-list__item-container--user-input>span{margin:0 0 6px;font-size:14px;font-weight:normal}.instant-apps-filter-list__item-container--user-input calcite-combobox{width:100%;--calcite-font-size--1:16px}.instant-apps-filter-list__item-container--user-input calcite-combobox-item{--calcite-font-size--1:12px}.instant-apps-filter-list__number-input-container{width:100%;display:flex;justify-content:center}.instant-apps-filter-list__number-input-container calcite-slider{width:90%}.instant-apps-filter-list__date-picker-input-container{display:flex;align-items:center;justify-content:unset;width:100%}.instant-apps-filter-list__date-picker-input-container calcite-action{height:64px;border-top:1px solid var(--calcite-color-border-input);border-right:1px solid var(--calcite-color-border-input);border-bottom:1px solid var(--calcite-color-border-input)}.instant-apps-filter-list__title{margin-right:20px}.instant-apps-filter-list__title>p{font-size:14px;font-weight:normal;margin:0}.instant-apps-filter-list__checkbox-container{display:flex}.instant-apps-filter-list__checkbox-container calcite-checkbox{height:18px}.instant-apps-filter-list__operator-description{margin:0;--calcite-font-size--1:12px}.instant-apps-filter-list__zoom-to{display:flex;justify-content:flex-end;margin:8px 0 20px}.instant-apps-filter-list__zoom-to calcite-action{width:-moz-min-content;width:min-content}.instant-apps-filter-list calcite-input-date-picker{--calcite-font-size--1:16px}@media (prefers-reduced-motion){.instant-apps-filter-list calcite-loader{--calcite-internal-duration-factor:2;--calcite-internal-animation-timing-slow:calc(300ms * 2)}}.instant-apps-filter-list.calcite-mode-dark .instant-apps-filter-list__header-container{background:#2b2b2b;color:#fff}.instant-apps-filter-list.calcite-mode-dark .instant-apps-filter-list__operator-description{background:#353535}";
+const instantAppsFilterListCss = ":host{display:block}.instant-apps-filter-list *{box-sizing:border-box}.instant-apps-filter-list__container{height:100%}.instant-apps-filter-list__container calcite-block:last-of-type{margin-bottom:0}.instant-apps-filter-list__footer{padding:12px;display:flex}.instant-apps-filter-list__footer calcite-button:nth-child(2){margin-left:6px}.instant-apps-filter-list__item-container,.instant-apps-filter-list__item-container--user-input{display:flex;justify-content:space-between;align-items:center}.instant-apps-filter-list__item-container:not(:last-child),.instant-apps-filter-list__item-container--user-input:not(:last-child){padding-bottom:20px}.instant-apps-filter-list__item-container--user-input{margin:0;display:flex;flex-direction:column;align-items:flex-start}.instant-apps-filter-list__item-container--user-input>span{margin:0 0 6px;font-size:14px;font-weight:normal}.instant-apps-filter-list__item-container--user-input calcite-combobox{width:100%;font-size:16px;--calcite-combobox-input-height:24px}.instant-apps-filter-list__number-input-container{width:100%;display:flex;justify-content:center}.instant-apps-filter-list__number-input-container calcite-slider{width:90%}.instant-apps-filter-list__date-picker-input-container{display:flex;align-items:center;justify-content:unset;width:100%}.instant-apps-filter-list__date-picker-input-container calcite-action{height:64px;border-top:1px solid var(--calcite-color-border-input);border-right:1px solid var(--calcite-color-border-input);border-bottom:1px solid var(--calcite-color-border-input)}.instant-apps-filter-list__title{margin-right:20px}.instant-apps-filter-list__title>p{font-size:14px;font-weight:normal;margin:0}.instant-apps-filter-list__checkbox-container{display:flex}.instant-apps-filter-list__checkbox-container calcite-checkbox{height:18px}.instant-apps-filter-list__operator-description{margin:0;--calcite-font-size--1:12px}.instant-apps-filter-list__zoom-to{display:flex;justify-content:flex-end;margin:8px 0 20px}.instant-apps-filter-list__zoom-to calcite-action{width:-moz-min-content;width:min-content}.instant-apps-filter-list calcite-input-date-picker{--calcite-font-size--1:16px}@media (prefers-reduced-motion){.instant-apps-filter-list calcite-loader{--calcite-internal-duration-factor:2;--calcite-internal-animation-timing-slow:calc(300ms * 2)}}.instant-apps-filter-list.calcite-mode-dark .instant-apps-filter-list__header-container{background:#2b2b2b;color:#fff}.instant-apps-filter-list.calcite-mode-dark .instant-apps-filter-list__operator-description{background:#353535}";
 
 const CSS = {
     base: 'instant-apps-filter-list',
@@ -91,7 +91,7 @@ const InstantAppsFilterList = /*@__PURE__*/ proxyCustomElement(class InstantApps
         this.autoUpdateUrl = false;
         this.closeBtn = false;
         this.closeBtnOnClick = undefined;
-        this.comboboxOverlayPositioning = "absolute";
+        this.comboboxOverlayPositioning = 'absolute';
         this.closeBtnText = undefined;
         this.openFilters = false;
         this.extentSelector = false;
@@ -188,7 +188,7 @@ const InstantAppsFilterList = /*@__PURE__*/ proxyCustomElement(class InstantApps
     }
     renderCombobox(layerExpression, expression) {
         var _a;
-        return (h("label", { key: "combo-select", class: CSS.filterUIItemContainer }, h("span", null, expression.name), h("calcite-combobox", { id: expression.id.toString(), onCalciteComboboxChange: this.handleComboSelect.bind(this, expression, layerExpression), label: expression.name, placeholder: expression.placeholder, selectionMode: "multiple", "max-items": "6", overlayPositioning: this.comboboxOverlayPositioning }, (_a = expression.fields) === null || _a === void 0 ? void 0 : _a.map((value, index) => this.renderComboboxItem(expression, value, index)))));
+        return (h("label", { key: "combo-select", class: CSS.filterUIItemContainer }, h("span", null, expression.name), h("calcite-combobox", { id: expression.id.toString(), onCalciteComboboxChange: this.handleComboSelect.bind(this, expression, layerExpression), label: expression.name, placeholder: expression.placeholder, selectionMode: "multiple", "max-items": "6", scale: "s", overlayPositioning: this.comboboxOverlayPositioning }, (_a = expression.fields) === null || _a === void 0 ? void 0 : _a.map((value, index) => this.renderComboboxItem(expression, value, index)))));
     }
     renderComboboxItem(expression, value, index) {
         var _a;

package/dist/components/instant-apps-interactive-legend-classic2.js

@@ -1200,11 +1200,26 @@ const InstantAppsInteractiveLegendClassic = /*@__PURE__*/ proxyCustomElement(cla
                 var _a, _b, _c, _d;
                 try {
                     // Initial data setup
+                    // Loads map/basemap
                     const map = await ((_c = (_b = (_a = this.legendvm) === null || _a === void 0 ? void 0 : _a.view) === null || _b === void 0 ? void 0 : _b.map) === null || _c === void 0 ? void 0 : _c.load());
                     await ((_d = map === null || map === void 0 ? void 0 : map.basemap) === null || _d === void 0 ? void 0 : _d.load());
+                    // Loads all layers in webmap and waits until all settled promises
                     const allLayers = map === null || map === void 0 ? void 0 : map.allLayers;
                     const promises = allLayers === null || allLayers === void 0 ? void 0 : allLayers.map(layer => layer.load());
-                    await Promise.allSettled(promises);
+                    const settled = await Promise.allSettled(promises);
+                    const settledLayerPromises = settled
+                        .map(settledLayer => ((settledLayer === null || settledLayer === void 0 ? void 0 : settledLayer.status) === 'fulfilled' && (settledLayer === null || settledLayer === void 0 ? void 0 : settledLayer.value) ? settledLayer.value : null))
+                        .filter(layer => !!layer);
+                    // Wait until all layer views are settled/available
+                    const lvPromises = [];
+                    settledLayerPromises.forEach(layer => {
+                        var _a;
+                        if ((_a = this.legendvm) === null || _a === void 0 ? void 0 : _a.view) {
+                            lvPromises.push(this.legendvm.view.whenLayerView(layer));
+                        }
+                    });
+                    await Promise.allSettled(lvPromises);
+                    // Generate data once all layers/layer views are complete
                     const data = await generateData(this.legendvm, this.reactiveUtils);
                     store.set('data', Object.assign(Object.assign({}, interactiveLegendState.data), data));
                     this.isLoading = false;