@esri/solutions-components 0.8.18 → 0.8.20

package/dist/cjs/calcite-alert_4.cjs.entry.js

@@ -670,7 +670,7 @@ const EditCard = class {
 };
 EditCard.style = EditCardStyle0;
 
-const infoCardCss = ":host{display:block;--calcite-label-margin-bottom:0}.padding-1-2{padding:0.5rem}.display-none{display:none !important}.display-flex{display:flex}.position-absolute{position:absolute;top:0;right:0;bottom:0;left:0;overflow:auto}.feature-node{position:relative !important}.feature-node .esri-features__footer{display:none !important}.button-container{justify-content:center;align-items:center}.top-border{border-top:1px solid var(--calcite-color-border-1)}.width-100{width:100%}.esri-features__container{padding:0.5rem !important;background-color:var(--calcite-color-foreground-1) !important;height:100% !important}.overflow-hidden{overflow:hidden}.height-40{height:40px}.end-border{border-inline-end:1px solid var(--calcite-color-border-1)}.font-bold{font-weight:bold}.visibility-hidden{visibility:hidden;height:0px}.padding-inline-start-1{padding-inline-start:1rem}.border-width-0{border-width:0px}.pagination-action{position:relative;left:3px}.pagination-count{color:var(--calcite-color-brand);border-bottom:1px solid var(--calcite-color-brand)}";
+const infoCardCss = ":host{display:block;--calcite-label-margin-bottom:0}.padding-1-2{padding:0.5rem}.display-none{display:none !important}.display-flex{display:flex}.position-absolute{position:absolute;top:0;right:0;bottom:0;left:0;overflow:auto}.feature-node{position:relative !important}.feature-node .esri-features__footer{display:none !important}.button-container{justify-content:center;align-items:center}.top-border{border-top:1px solid var(--calcite-color-border-1)}.width-100{width:100%}.esri-features__container{padding:0.5rem !important;background-color:var(--calcite-color-foreground-1) !important;height:100% !important}.overflow-hidden{overflow:hidden}.height-40{height:40px}.end-border{border-inline-end:1px solid var(--calcite-color-border-1)}.font-bold{font-weight:bold}.visibility-hidden{visibility:hidden;height:0px}.padding-inline-start-1{padding-inline-start:1rem}.border-width-0{border-width:0px}.pagination-action{position:relative;left:3px}.pagination-count{color:var(--calcite-color-brand);border-bottom:1px solid var(--calcite-color-brand);font-weight:bold}";
 const InfoCardStyle0 = infoCardCss;
 
 const InfoCard = class {

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

@@ -166,8 +166,6 @@ const LayerTable = class {
         this.shareIncludeEmbed = undefined;
         this.shareIncludeSocial = undefined;
         this.showNewestFirst = undefined;
-        this.sortField = undefined;
-        this.sortOrder = undefined;
         this.zoomAndScrollToSelected = undefined;
         this.zoomToScale = undefined;
         this._allIds = [];
@@ -395,7 +393,7 @@ const LayerTable = class {
         const selected = this.selectedIds.length.toString();
         const tableHeightClass = this.isMobile ? "height-full" : "height-full-adjusted";
         this._validateActiveActions();
-        return (index.h(index.Host, { key: '69a8f1d8c41eb82d6f39f6c580f78369f372567f' }, index.h("calcite-shell", { key: '3cb7997d918af450d04b95e1a236e09400b30af1' }, this._getTableControlRow("header"), index.h("div", { key: '1f0e84f1759c0333acee402a603923ca96e7d9e4', class: `width-full ${tableHeightClass}` }, index.h("calcite-panel", { key: 'b62bedc4c924f0d0a30e2746a532270c2a4d4a4b', class: "height-full width-full" }, index.h("calcite-loader", { key: 'e28017e4c3aba559774965f2cbff0fcb83f9ab2d', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), index.h("div", { key: 'efc520212f53c3db46574c7caf5d9f9835b83a2c', class: tableNodeClass, ref: this.onTableNodeCreate })), !this.isMobile ? (index.h("div", { class: "bottom-left text-color height-19" }, this._translations.recordsSelected
+        return (index.h(index.Host, { key: '1077bca0d3f59ed86999449c2c5428e4aa65b30f' }, index.h("calcite-shell", { key: '02b7a7512cfdc8958251ae00709b971f9bfff6df' }, this._getTableControlRow("header"), index.h("div", { key: '83d03238c368cd332714f4434297a9a4f9d47ec4', class: `width-full ${tableHeightClass}` }, index.h("calcite-panel", { key: '18927c7c65687c9df28f69b1e66f542be05e8c52', class: "height-full width-full" }, index.h("calcite-loader", { key: '51ed528d5676b983c27b50b098dd8785a3c7b591', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), index.h("div", { key: '4e51683f468b29b6dcdf1a588cdfedb37a02166f', class: tableNodeClass, ref: this.onTableNodeCreate })), !this.isMobile ? (index.h("div", { class: "bottom-left text-color height-19" }, this._translations.recordsSelected
             .replace("{{total}}", total)
             .replace("{{selected}}", selected))) : undefined)), this._filterModal()));
     }
@@ -1195,16 +1193,27 @@ const LayerTable = class {
         this._deleteEnabled = this._layer.editingEnabled && this._layer.capabilities.operations.supportsDelete;
     }
     /**
-     * Sort the table with the configured field in the configured sort order
+     * Sort the table with the configured field and the sort order
      */
     async _sortTable() {
-        var _a, _b, _c, _d, _e, _f;
-        let sortField = this.sortField ? this.sortField : this._layer.objectIdField;
+        var _a, _b, _c, _d;
+        //By default sort the table using objectIdField and in descending order
+        let sortField = this._layer.objectIdField;
+        let sortOrder = 'desc';
+        let configuredLayer;
+        //get the sortField and sortOrder from the configuration
         if (((_c = (_b = (_a = this.mapInfo) === null || _a === void 0 ? void 0 : _a.layerOptions) === null || _b === void 0 ? void 0 : _b.layers) === null || _c === void 0 ? void 0 : _c.length) > 0) {
-            const configuredLayer = (_d = this.mapInfo.layerOptions) === null || _d === void 0 ? void 0 : _d.layers.filter((layer) => layer.id === this._layer.id);
-            sortField = ((_f = (_e = configuredLayer[0]) === null || _e === void 0 ? void 0 : _e.fields) === null || _f === void 0 ? void 0 : _f.includes(this.sortField)) ? this.sortField : this._layer.objectIdField;
+            configuredLayer = this.mapInfo.layerOptions.layers.filter((layer) => layer.id === this._layer.id);
+            if (configuredLayer && configuredLayer.length > 0) {
+                configuredLayer = configuredLayer[0];
+                //if sort field is defined and sortField is available in the fields then use it 
+                if (configuredLayer.sortField && ((_d = configuredLayer.fields) === null || _d === void 0 ? void 0 : _d.includes(configuredLayer.sortField))) {
+                    sortField = configuredLayer.sortField;
+                }
+                //use sort order if configured
+                sortOrder = (configuredLayer === null || configuredLayer === void 0 ? void 0 : configuredLayer.sortOrder) ? configuredLayer.sortOrder : "desc";
+            }
         }
-        const sortOrder = this.sortOrder ? this.sortOrder : 'desc';
         if (this._table && this._layer) {
             await this._table.when();
             await this._layer.when(() => {

package/dist/cjs/crowdsource-manager.cjs.entry.js

@@ -49,6 +49,7 @@ const CrowdsourceManager = class {
         this.defaultLevel = "";
         this.defaultOid = "";
         this.defaultWebmap = "";
+        this.introductionPageEnabled = false;
         this.enableAutoRefresh = false;
         this.enableBasemap = true;
         this.enableColumnReorder = true;
@@ -75,8 +76,6 @@ const CrowdsourceManager = class {
         this.theme = "light";
         this.zoomAndScrollToSelected = false;
         this.zoomToScale = undefined;
-        this.sortField = undefined;
-        this.sortOrder = undefined;
         this._expandPopup = this.hideMapOnLoad;
         this._hideFooter = false;
         this._hideTable = false;
@@ -183,7 +182,9 @@ const CrowdsourceManager = class {
      * Renders the component.
      */
     render() {
-        return (index.h(index.Host, { key: '686aeccc0f97c1eb8bc1b673d8816663e80fdf71' }, index.h("calcite-shell", { key: 'f3451483cdbafa8b68a00b71e9927bbff55781b9', class: "position-relative" }, index.h("calcite-panel", { key: '8256440e1cefa8f25bf1af1f9a1e87650c34462d', class: `width-full height-full border-width-0` }, this._getBody(this._layoutMode, this._panelOpen, this._hideTable)), this._getFooter())));
+        // only avoid border when we have a header color that is not white
+        const borderClass = this.popupHeaderColor && this.popupHeaderColor !== "#FFFFFF" ? "border-width-0" : "";
+        return (index.h(index.Host, { key: '175124a05c83f6f02bef1378a20e5a3ed083ce00' }, index.h("calcite-shell", { key: '10677408a11bbe6196a95622a7a5f69fd3766c20', class: "position-relative" }, index.h("calcite-panel", { key: 'd3f044385482089d2dd5a457c2de4b3cc748e7c6', class: `width-full height-full ${borderClass}` }, this._getBody(this._layoutMode, this._panelOpen, this._hideTable)), this._getFooter())));
     }
     /**
      * Called after each render
@@ -303,7 +304,8 @@ const CrowdsourceManager = class {
     _getBody(layoutMode, panelOpen, hideTable) {
         const contentClass = layoutMode === interfaces.ELayoutMode.HORIZONTAL ? "" : "display-flex";
         const themeClass = this.theme === "dark" ? "calcite-mode-dark" : "calcite-mode-light";
-        return (index.h("calcite-panel", { class: "width-full height-full" }, index.h("div", { class: `width-full height-full overflow-hidden ${contentClass}` }, this._getMapAndCard(layoutMode, panelOpen, hideTable), this._getTable(layoutMode, panelOpen, hideTable)), index.h("div", { class: "floating-container", onClick: this.infoButtonClick.bind(this) }, index.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" }))));
+        return (index.h("calcite-panel", { class: "width-full height-full" }, index.h("div", { class: `width-full height-full overflow-hidden ${contentClass}` }, this._getMapAndCard(layoutMode, panelOpen, hideTable), this._getTable(layoutMode, panelOpen, hideTable)), this.coverPageEnabled &&
+            index.h("div", { class: "floating-container", onClick: this.infoButtonClick.bind(this) }, index.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" }))));
     }
     /**
      * Emit the event when info button clicked
@@ -356,10 +358,10 @@ const CrowdsourceManager = class {
         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 (index.h("div", { class: `${headerTheme} ${popupNodeClass} ${containerClass}`, style: {
-                '--calcite-color-foreground-1': this.popupHeaderColor, /* background color to apply to the popup header */
-                '--calcite-color-foreground-2': this.popupHeaderHoverColor, /* color that will be displayed on hover when expanding the popup header */
-                '--calcite-color-text-3': this.popupHeaderHoverTextColor, /* font color that will be displayed on hover when expanding the popup header */
-                '--calcite-color-text-2': this.popupHeaderTextColor, /* font color to apply to the popup header */
+                '--calcite-color-foreground-1': this.popupHeaderColor, /* background color that will be displayed on the popup header */
+                '--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*/
             } }, index.h("calcite-panel", null, !this._isMobile ? (index.h("div", { class: `display-flex align-items-center ${headerClass}`, slot: "header-content" }, index.h("calcite-icon", { icon: "information", scale: "s" }), index.h("div", { class: "padding-inline-start-75" }, this._translations.information))) : undefined, index.h("calcite-action", { class: headerClass, disabled: this._tableOnly, icon: icon, id: id, onClick: () => this._togglePopup(), slot: "header-actions-end", text: "" }), !this._tableOnly ? index.h("calcite-tooltip", { class: themeClass, label: "", placement: "bottom", "reference-element": id }, index.h("span", null, tooltip)) : undefined, this._getCardNode())));
     }
     /**
@@ -404,7 +406,7 @@ const CrowdsourceManager = class {
             ((_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 (index.h("calcite-shell", { class: `${tableSizeClass} ${tableClass} border-bottom` }, !this._isMobile ? (index.h("calcite-action-bar", { class: "border-sides", expandDisabled: true, layout: toggleLayout, slot: toggleSlot }, index.h("calcite-action", { class: "toggle-node", icon: icon, id: id, onClick: () => this._toggleLayout(), text: "" }), index.h("calcite-tooltip", { label: tooltip, placement: "bottom", "reference-element": id }, index.h("span", null, tooltip)))) : undefined, index.h("div", { class: `width-full height-full position-relative` }, index.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, sortField: this.sortField, sortOrder: this.sortOrder, zoomAndScrollToSelected: this.zoomAndScrollToSelected, zoomToScale: this.zoomToScale }))));
+        return (index.h("calcite-shell", { class: `${tableSizeClass} ${tableClass} border-bottom` }, !this._isMobile ? (index.h("calcite-action-bar", { class: "border-sides", expandDisabled: true, layout: toggleLayout, slot: toggleSlot }, index.h("calcite-action", { class: "toggle-node", icon: icon, id: id, onClick: () => this._toggleLayout(), text: "" }), index.h("calcite-tooltip", { label: tooltip, placement: "bottom", "reference-element": id }, index.h("span", null, tooltip)))) : undefined, index.h("div", { class: `width-full height-full position-relative` }, index.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, zoomToScale: this.zoomToScale }))));
     }
     /**
      * Update the component layout when its size changes