@esri/solutions-components 0.10.15 → 0.10.17

package/dist/components/crowdsource-manager.js

@@ -7,49 +7,51 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host, Fragment } from
 import { g as getLocaleComponentStrings } from './locale.js';
 import { a as ELayoutMode } from './interfaces.js';
 import { g as getLayerOrTable } from './mapViewUtils.js';
-import { d as defineCustomElement$W } from './basemap-gallery2.js';
-import { d as defineCustomElement$V } from './action.js';
-import { d as defineCustomElement$U } from './action-bar.js';
-import { d as defineCustomElement$T } from './action-group.js';
-import { d as defineCustomElement$S } from './action-menu.js';
-import { d as defineCustomElement$R } from './alert.js';
-import { d as defineCustomElement$Q } from './block.js';
-import { d as defineCustomElement$P } from './button.js';
-import { d as defineCustomElement$O } from './checkbox.js';
-import { d as defineCustomElement$N } from './chip.js';
-import { d as defineCustomElement$M } from './combobox.js';
-import { d as defineCustomElement$L } from './combobox-item.js';
-import { d as defineCustomElement$K } from './date-picker.js';
-import { d as defineCustomElement$J } from './date-picker-day.js';
-import { d as defineCustomElement$I } from './date-picker-month.js';
-import { d as defineCustomElement$H } from './date-picker-month-header.js';
-import { d as defineCustomElement$G } from './dropdown.js';
-import { d as defineCustomElement$F } from './dropdown-group.js';
-import { d as defineCustomElement$E } from './dropdown-item.js';
-import { d as defineCustomElement$D } from './filter2.js';
-import { d as defineCustomElement$C } from './graph.js';
-import { d as defineCustomElement$B } from './handle.js';
-import { d as defineCustomElement$A } from './icon.js';
-import { d as defineCustomElement$z } from './input.js';
-import { d as defineCustomElement$y } from './input-date-picker.js';
-import { d as defineCustomElement$x } from './input-text.js';
-import { d as defineCustomElement$w } from './label2.js';
-import { d as defineCustomElement$v } from './list.js';
-import { d as defineCustomElement$u } from './list-item.js';
-import { d as defineCustomElement$t } from './loader.js';
-import { d as defineCustomElement$s } from './modal.js';
-import { d as defineCustomElement$r } from './notice.js';
-import { d as defineCustomElement$q } from './option.js';
-import { d as defineCustomElement$p } from './panel.js';
-import { d as defineCustomElement$o } from './popover.js';
-import { d as defineCustomElement$n } from './progress.js';
-import { d as defineCustomElement$m } from './scrim.js';
-import { d as defineCustomElement$l } from './select.js';
-import { d as defineCustomElement$k } from './shell.js';
-import { d as defineCustomElement$j } from './slider.js';
-import { d as defineCustomElement$i } from './stack.js';
-import { d as defineCustomElement$h } from './tooltip.js';
-import { d as defineCustomElement$g } from './card-manager2.js';
+import { d as defineCustomElement$Y } from './basemap-gallery2.js';
+import { d as defineCustomElement$X } from './action.js';
+import { d as defineCustomElement$W } from './action-bar.js';
+import { d as defineCustomElement$V } from './action-group.js';
+import { d as defineCustomElement$U } from './action-menu.js';
+import { d as defineCustomElement$T } from './alert.js';
+import { d as defineCustomElement$S } from './block.js';
+import { d as defineCustomElement$R } from './button.js';
+import { d as defineCustomElement$Q } from './checkbox.js';
+import { d as defineCustomElement$P } from './chip.js';
+import { d as defineCustomElement$O } from './combobox.js';
+import { d as defineCustomElement$N } from './combobox-item.js';
+import { d as defineCustomElement$M } from './date-picker.js';
+import { d as defineCustomElement$L } from './date-picker-day.js';
+import { d as defineCustomElement$K } from './date-picker-month.js';
+import { d as defineCustomElement$J } from './date-picker-month-header.js';
+import { d as defineCustomElement$I } from './dropdown.js';
+import { d as defineCustomElement$H } from './dropdown-group.js';
+import { d as defineCustomElement$G } from './dropdown-item.js';
+import { d as defineCustomElement$F } from './filter2.js';
+import { d as defineCustomElement$E } from './flow-item.js';
+import { d as defineCustomElement$D } from './graph.js';
+import { d as defineCustomElement$C } from './handle.js';
+import { d as defineCustomElement$B } from './icon.js';
+import { d as defineCustomElement$A } from './input.js';
+import { d as defineCustomElement$z } from './input-date-picker.js';
+import { d as defineCustomElement$y } from './input-text.js';
+import { d as defineCustomElement$x } from './label2.js';
+import { d as defineCustomElement$w } from './list.js';
+import { d as defineCustomElement$v } from './list-item.js';
+import { d as defineCustomElement$u } from './loader.js';
+import { d as defineCustomElement$t } from './modal.js';
+import { d as defineCustomElement$s } from './notice.js';
+import { d as defineCustomElement$r } from './option.js';
+import { d as defineCustomElement$q } from './panel.js';
+import { d as defineCustomElement$p } from './popover.js';
+import { d as defineCustomElement$o } from './progress.js';
+import { d as defineCustomElement$n } from './scrim.js';
+import { d as defineCustomElement$m } from './select.js';
+import { d as defineCustomElement$l } from './shell.js';
+import { d as defineCustomElement$k } from './slider.js';
+import { d as defineCustomElement$j } from './stack.js';
+import { d as defineCustomElement$i } from './tooltip.js';
+import { d as defineCustomElement$h } from './card-manager2.js';
+import { d as defineCustomElement$g } from './create-feature2.js';
 import { d as defineCustomElement$f } from './delete-button2.js';
 import { d as defineCustomElement$e } from './edit-card2.js';
 import { d as defineCustomElement$d } from './floor-filter2.js';
@@ -65,7 +67,7 @@ import { d as defineCustomElement$4 } from './map-picker2.js';
 import { d as defineCustomElement$3 } from './map-search2.js';
 import { d as defineCustomElement$2 } from './map-tools2.js';
 
-const crowdsourceManagerCss = ":host{display:block;--calcite-label-margin-bottom:0px;--solutions-theme-foreground-color:var(--calcite-color-foreground-1)}.padding-1-2{padding:0.5rem}.display-flex{display:flex}.width-full{width:100%}.width-1-2{position:relative;width:50%}.width-1-3{position:relative;width:33.33%}.width-2-3{position:relative;width:66.66%}.width-0{width:0}.height-full{height:100%}.height-1-2{position:relative;height:50%}.height-0{height:0}.toggle-node{width:51px;height:51px}.overflow-hidden{overflow:hidden}.flex-column{flex-direction:column}.border{border:1px solid var(--calcite-color-border-3)}.border-bottom{border-bottom:1px solid var(--calcite-color-border-3)}.border-sides{border-left:1px solid var(--calcite-color-border-3);border-right:1px solid var(--calcite-color-border-3)}.position-relative{position:relative}.height-50{height:50%}.adjusted-height-50{height:calc(50% - 25px)}.adjusted-height-100{height:calc(100% - 50px)}.adjusted-height-100-50{height:calc(100% - 50px)}.display-none{display:none}.height-53{height:53px}.position-absolute-53{position:absolute;top:53px}.display-grid{display:grid}.height-50-px{height:50px}.padding-inline-start-75{padding-inline-start:0.75rem}.align-items-center{align-items:center}.esri-floor-filter__close-levels-button{width:40px !important;height:40px !important}.esri-floor-filter__level-button{width:40px !important;height:40px !important}.esri-floor-filter__browse-button{width:40px !important;height:40px !important}.position-absolute-50{position:absolute;top:50px;bottom:0px;left:0px;right:0px}.position-absolute-0{position:absolute;top:0px;bottom:0px;left:0px;right:0px}.visibility-hidden{visibility:hidden;height:0px}.position-fixed{position:fixed}.border-width-0{border-width:0px}.border-bottom-width-0{border-bottom-width:0px}.floating-container{position:fixed;width:100px;height:10px;bottom:0;right:0;margin:100px 0px}.floating-container .floating-button{box-shadow:0 10px 25px rgb(92 93 94 / 60%);transform:translatey(5px);transition:all 0.3s}";
+const crowdsourceManagerCss = ":host{display:block;--calcite-label-margin-bottom:0px;--solutions-theme-foreground-color:var(--calcite-color-foreground-1)}.padding-1-2{padding:0.5rem}.display-flex{display:flex}.width-full{width:100%}.width-1-2{position:relative;width:50%}.width-1-3{position:relative;width:33.33%}.width-2-3{position:relative;width:66.66%}.width-0{width:0}.height-full{height:100%}.height-1-2{position:relative;height:50%}.height-0{height:0}.toggle-node{width:51px;height:51px}.overflow-hidden{overflow:hidden}.flex-column{flex-direction:column}.border{border:1px solid var(--calcite-color-border-3)}.border-bottom{border-bottom:1px solid var(--calcite-color-border-3)}.border-sides{border-left:1px solid var(--calcite-color-border-3);border-right:1px solid var(--calcite-color-border-3)}.position-relative{position:relative}.position-absolute{position:absolute}.height-51{height:51%}.adjusted-height-50{height:calc(50% - 25px)}.adjusted-height-100{height:calc(100% - 50px)}.adjusted-height-100-50{height:calc(100% - 50px)}.display-none{display:none !important}.adjusted-height-50_25{height:calc(50% + 25px)}.position-absolute-53{position:absolute;top:53px}.display-grid{display:grid}.height-50-px{height:50px}.padding-inline-start-75{padding-inline-start:0.75rem}.align-items-center{align-items:center}.esri-floor-filter__close-levels-button{width:40px !important;height:40px !important}.esri-floor-filter__level-button{width:40px !important;height:40px !important}.esri-floor-filter__browse-button{width:40px !important;height:40px !important}.position-absolute-50{position:absolute;top:50px;bottom:0px;left:0px;right:0px}.position-absolute-0{position:absolute;top:0px;bottom:0px;left:0px;right:0px}.visibility-hidden{visibility:hidden;height:0px}.position-fixed{position:fixed}.border-width-0{border-width:0px}.border-bottom-width-0{border-bottom-width:0px}.floating-container{position:fixed;width:100px;height:10px;bottom:0;right:0;margin:100px 0px}.floating-container .floating-button{box-shadow:0 10px 25px rgb(92 93 94 / 60%);transform:translatey(5px);transition:all 0.3s}.z-index-0{z-index:0 !important}";
 const CrowdsourceManagerStyle0 = crowdsourceManagerCss;
 
 const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceManager extends HTMLElement {
@@ -97,7 +99,6 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
         this.enableSearch = true;
         this.enableShare = false;
         this.enableZoom = true;
-        this.hideMapOnLoad = false;
         this.mapInfos = [];
         this.onlyShowUpdatableLayers = true;
         this.popupHeaderColor = undefined;
@@ -123,6 +124,7 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
         this._panelOpen = true;
         this._numSelected = 0;
         this._filterOpen = false;
+        this._showInformationHeader = true;
     }
     get el() { return this; }
     //--------------------------------------------------------------------------
@@ -140,10 +142,6 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
      * 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
      */
@@ -184,12 +182,6 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
     enableZoomWatchHandler() {
         this._initMapZoom();
     }
-    /**
-     * When true the map will be hidden on load
-     */
-    hideMapOnLoadWatchHandler() {
-        this.showHideMapPopupAndTable(this.hideMapOnLoad && !this._isMobile);
-    }
     //--------------------------------------------------------------------------
     //
     //  Methods (public)
@@ -243,17 +235,11 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
     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)
@@ -274,7 +260,7 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
     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
@@ -293,10 +279,6 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
      */
     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);
     }
@@ -422,7 +404,7 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
     _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" }))));
     }
@@ -476,7 +458,7 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
      */
     _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: {
@@ -484,7 +466,7 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
                 '--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
@@ -495,9 +477,15 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
     _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
@@ -512,7 +500,7 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
         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";
@@ -521,7 +509,7 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
             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
@@ -598,8 +586,8 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
         if (forceOpen) {
             this._panelOpen = true;
         }
-        if ((this.hideMapOnLoad && !this._hideMapOnLoadHonored) || this._isMobile) {
-            this.hideMapOnLoadWatchHandler();
+        if (this._isMobile) {
+            this.showHideMapPopupAndTable(!this._isMobile);
         }
     }
     /**
@@ -732,8 +720,7 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
         this._translations = messages[0];
     }
     static get watchers() { return {
-        "enableZoom": ["enableZoomWatchHandler"],
-        "hideMapOnLoad": ["hideMapOnLoadWatchHandler"]
+        "enableZoom": ["enableZoomWatchHandler"]
     }; }
     static get style() { return CrowdsourceManagerStyle0; }
 }, [0, "crowdsource-manager", {
@@ -760,7 +747,6 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
         "enableSearch": [4, "enable-search"],
         "enableShare": [4, "enable-share"],
         "enableZoom": [4, "enable-zoom"],
-        "hideMapOnLoad": [4, "hide-map-on-load"],
         "mapInfos": [16],
         "onlyShowUpdatableLayers": [4, "only-show-updatable-layers"],
         "popupHeaderColor": [1, "popup-header-color"],
@@ -785,16 +771,16 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
         "_mapView": [32],
         "_panelOpen": [32],
         "_numSelected": [32],
-        "_filterOpen": [32]
-    }, [[8, "featureSelectionChange", "featureSelectionChange"], [8, "popupClosed", "popupClosed"], [8, "layoutChanged", "layoutChanged"], [8, "mapChanged", "mapChanged"], [8, "layerSelectionChange", "layerSelectionChange"], [8, "mapInfoChange", "mapInfoChange"]], {
-        "enableZoom": ["enableZoomWatchHandler"],
-        "hideMapOnLoad": ["hideMapOnLoadWatchHandler"]
+        "_filterOpen": [32],
+        "_showInformationHeader": [32]
+    }, [[8, "featureSelectionChange", "featureSelectionChange"], [8, "popupClosed", "popupClosed"], [8, "layoutChanged", "layoutChanged"], [8, "mapChanged", "mapChanged"], [8, "layerSelectionChange", "layerSelectionChange"]], {
+        "enableZoom": ["enableZoomWatchHandler"]
     }]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["crowdsource-manager", "basemap-gallery", "calcite-action", "calcite-action-bar", "calcite-action-group", "calcite-action-menu", "calcite-alert", "calcite-block", "calcite-button", "calcite-checkbox", "calcite-chip", "calcite-combobox", "calcite-combobox-item", "calcite-date-picker", "calcite-date-picker-day", "calcite-date-picker-month", "calcite-date-picker-month-header", "calcite-dropdown", "calcite-dropdown-group", "calcite-dropdown-item", "calcite-filter", "calcite-graph", "calcite-handle", "calcite-icon", "calcite-input", "calcite-input-date-picker", "calcite-input-text", "calcite-label", "calcite-list", "calcite-list-item", "calcite-loader", "calcite-modal", "calcite-notice", "calcite-option", "calcite-panel", "calcite-popover", "calcite-progress", "calcite-scrim", "calcite-select", "calcite-shell", "calcite-slider", "calcite-stack", "calcite-tooltip", "card-manager", "delete-button", "edit-card", "floor-filter", "info-card", "instant-apps-filter-list", "instant-apps-social-share", "layer-table", "map-card", "map-fullscreen", "map-layer-picker", "map-legend", "map-picker", "map-search", "map-tools"];
+    const components = ["crowdsource-manager", "basemap-gallery", "calcite-action", "calcite-action-bar", "calcite-action-group", "calcite-action-menu", "calcite-alert", "calcite-block", "calcite-button", "calcite-checkbox", "calcite-chip", "calcite-combobox", "calcite-combobox-item", "calcite-date-picker", "calcite-date-picker-day", "calcite-date-picker-month", "calcite-date-picker-month-header", "calcite-dropdown", "calcite-dropdown-group", "calcite-dropdown-item", "calcite-filter", "calcite-flow-item", "calcite-graph", "calcite-handle", "calcite-icon", "calcite-input", "calcite-input-date-picker", "calcite-input-text", "calcite-label", "calcite-list", "calcite-list-item", "calcite-loader", "calcite-modal", "calcite-notice", "calcite-option", "calcite-panel", "calcite-popover", "calcite-progress", "calcite-scrim", "calcite-select", "calcite-shell", "calcite-slider", "calcite-stack", "calcite-tooltip", "card-manager", "create-feature", "delete-button", "edit-card", "floor-filter", "info-card", "instant-apps-filter-list", "instant-apps-social-share", "layer-table", "map-card", "map-fullscreen", "map-layer-picker", "map-legend", "map-picker", "map-search", "map-tools"];
     components.forEach(tagName => { switch (tagName) {
         case "crowdsource-manager":
             if (!customElements.get(tagName)) {
@@ -803,215 +789,225 @@ function defineCustomElement$1() {
             break;
         case "basemap-gallery":
             if (!customElements.get(tagName)) {
-                defineCustomElement$W();
+                defineCustomElement$Y();
             }
             break;
         case "calcite-action":
             if (!customElements.get(tagName)) {
-                defineCustomElement$V();
+                defineCustomElement$X();
             }
             break;
         case "calcite-action-bar":
             if (!customElements.get(tagName)) {
-                defineCustomElement$U();
+                defineCustomElement$W();
             }
             break;
         case "calcite-action-group":
             if (!customElements.get(tagName)) {
-                defineCustomElement$T();
+                defineCustomElement$V();
             }
             break;
         case "calcite-action-menu":
             if (!customElements.get(tagName)) {
-                defineCustomElement$S();
+                defineCustomElement$U();
             }
             break;
         case "calcite-alert":
             if (!customElements.get(tagName)) {
-                defineCustomElement$R();
+                defineCustomElement$T();
             }
             break;
         case "calcite-block":
             if (!customElements.get(tagName)) {
-                defineCustomElement$Q();
+                defineCustomElement$S();
             }
             break;
         case "calcite-button":
             if (!customElements.get(tagName)) {
-                defineCustomElement$P();
+                defineCustomElement$R();
             }
             break;
         case "calcite-checkbox":
             if (!customElements.get(tagName)) {
-                defineCustomElement$O();
+                defineCustomElement$Q();
             }
             break;
         case "calcite-chip":
             if (!customElements.get(tagName)) {
-                defineCustomElement$N();
+                defineCustomElement$P();
             }
             break;
         case "calcite-combobox":
             if (!customElements.get(tagName)) {
-                defineCustomElement$M();
+                defineCustomElement$O();
             }
             break;
         case "calcite-combobox-item":
             if (!customElements.get(tagName)) {
-                defineCustomElement$L();
+                defineCustomElement$N();
             }
             break;
         case "calcite-date-picker":
             if (!customElements.get(tagName)) {
-                defineCustomElement$K();
+                defineCustomElement$M();
             }
             break;
         case "calcite-date-picker-day":
             if (!customElements.get(tagName)) {
-                defineCustomElement$J();
+                defineCustomElement$L();
             }
             break;
         case "calcite-date-picker-month":
             if (!customElements.get(tagName)) {
-                defineCustomElement$I();
+                defineCustomElement$K();
             }
             break;
         case "calcite-date-picker-month-header":
             if (!customElements.get(tagName)) {
-                defineCustomElement$H();
+                defineCustomElement$J();
             }
             break;
         case "calcite-dropdown":
             if (!customElements.get(tagName)) {
-                defineCustomElement$G();
+                defineCustomElement$I();
             }
             break;
         case "calcite-dropdown-group":
             if (!customElements.get(tagName)) {
-                defineCustomElement$F();
+                defineCustomElement$H();
             }
             break;
         case "calcite-dropdown-item":
             if (!customElements.get(tagName)) {
-                defineCustomElement$E();
+                defineCustomElement$G();
             }
             break;
         case "calcite-filter":
             if (!customElements.get(tagName)) {
-                defineCustomElement$D();
+                defineCustomElement$F();
+            }
+            break;
+        case "calcite-flow-item":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$E();
             }
             break;
         case "calcite-graph":
             if (!customElements.get(tagName)) {
-                defineCustomElement$C();
+                defineCustomElement$D();
             }
             break;
         case "calcite-handle":
             if (!customElements.get(tagName)) {
-                defineCustomElement$B();
+                defineCustomElement$C();
             }
             break;
         case "calcite-icon":
             if (!customElements.get(tagName)) {
-                defineCustomElement$A();
+                defineCustomElement$B();
             }
             break;
         case "calcite-input":
             if (!customElements.get(tagName)) {
-                defineCustomElement$z();
+                defineCustomElement$A();
             }
             break;
         case "calcite-input-date-picker":
             if (!customElements.get(tagName)) {
-                defineCustomElement$y();
+                defineCustomElement$z();
             }
             break;
         case "calcite-input-text":
             if (!customElements.get(tagName)) {
-                defineCustomElement$x();
+                defineCustomElement$y();
             }
             break;
         case "calcite-label":
             if (!customElements.get(tagName)) {
-                defineCustomElement$w();
+                defineCustomElement$x();
             }
             break;
         case "calcite-list":
             if (!customElements.get(tagName)) {
-                defineCustomElement$v();
+                defineCustomElement$w();
             }
             break;
         case "calcite-list-item":
             if (!customElements.get(tagName)) {
-                defineCustomElement$u();
+                defineCustomElement$v();
             }
             break;
         case "calcite-loader":
             if (!customElements.get(tagName)) {
-                defineCustomElement$t();
+                defineCustomElement$u();
             }
             break;
         case "calcite-modal":
             if (!customElements.get(tagName)) {
-                defineCustomElement$s();
+                defineCustomElement$t();
             }
             break;
         case "calcite-notice":
             if (!customElements.get(tagName)) {
-                defineCustomElement$r();
+                defineCustomElement$s();
             }
             break;
         case "calcite-option":
             if (!customElements.get(tagName)) {
-                defineCustomElement$q();
+                defineCustomElement$r();
             }
             break;
         case "calcite-panel":
             if (!customElements.get(tagName)) {
-                defineCustomElement$p();
+                defineCustomElement$q();
             }
             break;
         case "calcite-popover":
             if (!customElements.get(tagName)) {
-                defineCustomElement$o();
+                defineCustomElement$p();
             }
             break;
         case "calcite-progress":
             if (!customElements.get(tagName)) {
-                defineCustomElement$n();
+                defineCustomElement$o();
             }
             break;
         case "calcite-scrim":
             if (!customElements.get(tagName)) {
-                defineCustomElement$m();
+                defineCustomElement$n();
             }
             break;
         case "calcite-select":
             if (!customElements.get(tagName)) {
-                defineCustomElement$l();
+                defineCustomElement$m();
             }
             break;
         case "calcite-shell":
             if (!customElements.get(tagName)) {
-                defineCustomElement$k();
+                defineCustomElement$l();
             }
             break;
         case "calcite-slider":
             if (!customElements.get(tagName)) {
-                defineCustomElement$j();
+                defineCustomElement$k();
             }
             break;
         case "calcite-stack":
             if (!customElements.get(tagName)) {
-                defineCustomElement$i();
+                defineCustomElement$j();
             }
             break;
         case "calcite-tooltip":
             if (!customElements.get(tagName)) {
-                defineCustomElement$h();
+                defineCustomElement$i();
             }
             break;
         case "card-manager":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$h();
+            }
+            break;
+        case "create-feature":
             if (!customElements.get(tagName)) {
                 defineCustomElement$g();
             }