@esri/solutions-components 0.8.22 → 0.8.24

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

@@ -35,6 +35,7 @@ export class FeatureList {
         this.whereClause = undefined;
         this.textSize = "large";
         this.showInitialLoading = true;
+        this.showErrorWhenNoFeatures = true;
         this._featureItems = [];
         this._featuresCount = 0;
         this._isLoading = false;
@@ -102,9 +103,9 @@ export class FeatureList {
      * Renders the component.
      */
     render() {
-        return (h("calcite-panel", { key: '9f702c6d98cc19704e0773e36fd969817ea7262e', "full-height": true, "full-width": true }, this._isLoading && h("calcite-loader", { key: 'e9acf13f3444057b097d6b145c1a6e0118f150ea', label: "", scale: "m" }), this._featureItems.length === 0 && !this._isLoading &&
-            h("calcite-notice", { key: '8c7fa89e2da7490b04456e51f8534c2515a02399', class: "error-msg", icon: "feature-details", kind: "info", open: true }, h("div", { key: '799d419e9c26b7928f15cb1cf9afa9f47cab0e94', slot: "message" }, this.noFeaturesFoundMsg ? this.noFeaturesFoundMsg : this._translations.featureErrorMsg)), h("calcite-list", { key: '82c60b16ab586ad57f8f98bb08814f688102b166', "selection-appearance": "border", "selection-mode": "none" }, !this._isLoading && this._featureItems.length > 0 && this._featureItems), this._featuresCount > this.pageSize &&
-            h("div", { key: 'e5b789ea46c6bedfbe83f1323ffb89271c0b76ce', class: "width-full", slot: "footer" }, h("calcite-pagination", { key: '4d30b5364fc4742f278157c5f2c21e75d4ecb0b8', class: "pagination", "full-width": true, onCalcitePaginationChange: this.pageChanged.bind(this), "page-size": this.pageSize, ref: el => this._pagination = el, "start-item": "1", "total-items": this._featuresCount }))));
+        return (h("calcite-panel", { key: '6184d07592669fd8884996475b7eeb26e0604790', "full-height": true, "full-width": true }, this._isLoading && h("calcite-loader", { key: '282127215213a28b9cfdf484aaf5730145b6bb55', label: "", scale: "m" }), this.showErrorWhenNoFeatures && this._featureItems.length === 0 && !this._isLoading &&
+            h("calcite-notice", { key: '25fcfeb1d19a089b092050515c3d69401bc17dc8', class: "error-msg", icon: "feature-details", kind: "info", open: true }, h("div", { key: '2ac81a338df9d0e0f43c659a24be0c9b7b95d027', slot: "message" }, this.noFeaturesFoundMsg ? this.noFeaturesFoundMsg : this._translations.featureErrorMsg)), h("calcite-list", { key: '70453e8ded4f859076a5f00d8f04152cd78278d8', "selection-appearance": "border", "selection-mode": "none" }, !this._isLoading && this._featureItems.length > 0 && this._featureItems), this._featuresCount > this.pageSize &&
+            h("div", { key: 'db1003ace54cd599acefad04e94fe54248327126', class: "width-full", slot: "footer" }, h("calcite-pagination", { key: '67764a051381b0e7ef26dbd16dc9226d7e152c20', class: "pagination", "full-width": true, onCalcitePaginationChange: this.pageChanged.bind(this), "page-size": this.pageSize, ref: el => this._pagination = el, "start-item": "1", "total-items": this._featuresCount }))));
     }
     //--------------------------------------------------------------------------
     //
@@ -280,7 +281,7 @@ export class FeatureList {
         //use object id if popupTitle is null or undefined
         popupTitle = popupTitle !== null && popupTitle !== void 0 ? popupTitle : oId;
         const popupTitleClass = this.textSize === 'small' ? 'feature-list-popup-title-small' : 'feature-list-popup-title';
-        return (h("calcite-list-item", { onCalciteListItemSelect: (e) => { void this.featureClicked(e, selectedFeature); }, onMouseLeave: () => { void this.clearHighlights(); }, onMouseOver: () => { void this.onFeatureHover(selectedFeature); }, value: oId }, h("div", { class: popupTitleClass, slot: "content-start" }, popupTitle), h("calcite-icon", { icon: "chevron-right", scale: "s", slot: "content-end" })));
+        return (h("calcite-list-item", { onCalciteListItemSelect: (e) => { void this.featureClicked(e, selectedFeature); }, onMouseLeave: () => { void this.clearHighlights(); }, onMouseOver: () => { void this.onFeatureHover(selectedFeature); }, value: oId }, h("div", { class: popupTitleClass, slot: "content-start" }, popupTitle), h("calcite-icon", { flipRtl: true, icon: "chevron-right", scale: "s", slot: "content-end" })));
     }
     /**
      * Fetches the component's translations
@@ -485,6 +486,24 @@ export class FeatureList {
                 "attribute": "show-initial-loading",
                 "reflect": false,
                 "defaultValue": "true"
+            },
+            "showErrorWhenNoFeatures": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "boolean: If true will show error msg when features are not present"
+                },
+                "attribute": "show-error-when-no-features",
+                "reflect": false,
+                "defaultValue": "true"
             }
         };
     }

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

@@ -32,7 +32,6 @@ export class InfoCard {
         this.isLoading = false;
         this.isMobile = undefined;
         this.mapView = undefined;
-        this.zoomAndScrollToSelected = undefined;
         this.allowEditing = true;
         this.highlightEnabled = true;
         this.paginationEnabled = true;
@@ -185,8 +184,8 @@ export class InfoCard {
         const id = (_d = (_c = this._features) === null || _c === void 0 ? void 0 : _c.selectedFeature) === null || _d === void 0 ? void 0 : _d.getObjectId();
         const ids = parseInt(id === null || id === void 0 ? void 0 : id.toString(), 10) > -1 ? [id] : [];
         const deleteEnabled = ((_e = this._layer) === null || _e === void 0 ? void 0 : _e.editingEnabled) && ((_h = (_g = (_f = this._layer) === null || _f === void 0 ? void 0 : _f.capabilities) === null || _g === void 0 ? void 0 : _g.operations) === null || _h === void 0 ? void 0 : _h.supportsDelete);
-        return (h(Host, { key: '7b48c1dbd2c4e384c4bcba62a8cf35e4c62d2edb' }, h("calcite-shell", { key: 'a8387dfb3968ea07182cdd782a5a147bdcb1188a', style: { position: this.position } }, this._getHeader(), h("calcite-loader", { key: '1695d423a19876c6ccde5f4004f21ca26e305350', class: loadingClass, label: this._translations.fetchingData }), h("div", { key: 'd8870e95ba06ed713c5143c5b260ee4059275d81', class: "esri-widget feature-node " + featureNodeClass, id: this._featuresNodeId }), h("div", { key: '84af335caa0f39890801faebc207bf8c794fe1e3', class: `${editButtonClass} width-100`, slot: "footer" }, this.allowEditing &&
-            h("div", { key: 'fa91c18424af38067c44e50635b9af55aacc84b8', class: "display-flex top-border padding-1-2" }, h("calcite-button", { key: 'c4565bda374ab4eb2afd2273c62256fae187d151', appearance: "solid", id: "solutions-edit", onClick: () => this._openEditRecord(), width: "full" }, this._translations.edit), this.isMobile && deleteEnabled ? (h("delete-button", { class: "padding-inline-start-1 width-100", id: "solutions-delete", ids: ids, layer: this._layer, onEditsComplete: () => this._closePopup() })) : undefined, h("calcite-tooltip", { key: '7175a74e7e1db0939fbbe4a229e7f6df6efb2768', placement: "bottom", "reference-element": "solutions-edit" }, h("span", { key: '6443c4d8274fe6003f5dcbd3b36f35057234c550' }, this._translations.edit)), this.isMobile ? (h("calcite-tooltip", { placement: "bottom", "reference-element": "solutions-delete" }, h("span", null, this._translations.delete))) : undefined), this.paginationEnabled && !nextBackDisabled && h("div", { key: 'ff3d3dffd57bf118f7e71ec5a504bbcfda0de229', class: `display-flex padding-1-2 button-container top-border ${nextBackClass}` }, h("div", { key: '1912bdf3dbad45ba66acf13ef8ad6894ced8caa2' }, h("calcite-button", { key: 'fe1e5032b764b3c0ac8ef619c9d365f8d781d6b3', appearance: 'transparent', disabled: nextBackDisabled, iconStart: "chevron-left", id: "solutions-back", onClick: () => this._back(), width: "full" }), h("calcite-tooltip", { key: 'a9928e72cc3dcebad2544ee5a347a0b70ebdae4b', placement: "top", "reference-element": "solutions-back" }, h("span", { key: '6d8cc94ae72deab6ae19d3314f5b0f7e1833bd3c' }, this._translations.back))), h("calcite-action", { key: '90d7951f0eacd4b77f8ebe3da79a12665a8b9f63', class: 'pagination-action', onClick: () => this._toggleListView(), scale: "s", text: "", textEnabled: true }, h("span", { key: '6c36eb43691a79b6a7c0da99663fa22c1d97e572', class: "pagination-count" }, this._count)), h("div", { key: '23758504ca1b4b97c4c488e88e61f0c3cdc10830' }, h("calcite-button", { key: '93efeff6e0cb54edd1817c3410806b009755618f', appearance: "transparent", disabled: nextBackDisabled, iconStart: "chevron-right", id: "solutions-next", onClick: () => this._next(), width: "full" }), h("calcite-tooltip", { key: '17afd49a3b167d9322d944a9d8ae6ffc249d202e', placement: "top", "reference-element": "solutions-next" }, h("span", { key: '0b15e569313961c53700d2ef6eb148b9c0efd778' }, this._translations.next))))), h("edit-card", { key: '2217a66105095ea1e5bd577dc8bf970b3fdeae10', class: editClass, graphicIndex: (_j = this._features) === null || _j === void 0 ? void 0 : _j.selectedFeatureIndex, graphics: this.graphics, mapView: this.mapView, open: this._editRecordOpen }), h("calcite-alert", { key: 'c59bd8d759ef1df763b3bbe513b7146cfa270057', icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { key: '3733d543e7483037aa5130f0ca06f8da434eaf7e', slot: "title" }, this._translations.editDisabled), h("div", { key: 'eaace9548fd442015000f836d54e556c9859a3fc', slot: "message" }, this._translations.enableEditing)))));
+        return (h(Host, { key: 'ab22ed392db6e8bad11758f39d6bd1738c10a229' }, h("calcite-shell", { key: 'f97bdc21cb5e667b1973353a45297f9536252fcd', style: { position: this.position } }, this._getHeader(), h("calcite-loader", { key: '82b78360be903de1be044406735db84122399f49', class: loadingClass, label: this._translations.fetchingData }), h("div", { key: '168d0310daf7eca08c4891283b8a9865eda102bc', class: "esri-widget feature-node " + featureNodeClass, id: this._featuresNodeId }), h("div", { key: '258b913cfdc4f1269dcc250a473643878d97f8bd', class: `${editButtonClass} width-100`, slot: "footer" }, this.allowEditing &&
+            h("div", { key: 'c6fd569640410dd3a106f27f49eb6553c9ea0167', class: "display-flex top-border padding-1-2" }, h("calcite-button", { key: '3dbe007feb1104d53c47298ae1308c776e3ec5cf', appearance: "solid", id: "solutions-edit", onClick: () => this._openEditRecord(), width: "full" }, this._translations.edit), this.isMobile && deleteEnabled ? (h("delete-button", { class: "padding-inline-start-1 width-100", id: "solutions-delete", ids: ids, layer: this._layer, onEditsComplete: () => this._closePopup() })) : undefined, h("calcite-tooltip", { key: '094e52e8d2945125096856a8c5249babdbbd1eec', placement: "bottom", "reference-element": "solutions-edit" }, h("span", { key: 'da9edbf6bdb39ce1a287894287d69f2767bb18de' }, this._translations.edit)), this.isMobile ? (h("calcite-tooltip", { placement: "bottom", "reference-element": "solutions-delete" }, h("span", null, this._translations.delete))) : undefined), this.paginationEnabled && !nextBackDisabled && h("div", { key: '5badbe8009a3a64e3b471ce4e63f4a7d2ae68acc', class: `display-flex padding-1-2 button-container top-border ${nextBackClass}` }, h("div", { key: '17b287e0f0405ead48a9460423e5371e102de38a' }, h("calcite-button", { key: '4277d8e56528475c5cea369811c9c3c8a0cdd5c7', appearance: 'transparent', disabled: nextBackDisabled, iconStart: "chevron-left", id: "solutions-back", onClick: () => this._back(), width: "full" }), h("calcite-tooltip", { key: 'c8ee8c81d9de098290f35075b0c6ac3ee2f46afc', placement: "top", "reference-element": "solutions-back" }, h("span", { key: '3321af9ca1a78efe28249872be05433d9d79f51b' }, this._translations.back))), h("calcite-action", { key: '5ce96bff1e1e1bd77f364d8ceb297e0db7453a29', class: 'pagination-action', onClick: () => this._toggleListView(), scale: "s", text: "", textEnabled: true }, h("span", { key: 'd558026468f5aeb0797efcfa1843f515fed2b451', class: "pagination-count" }, this._count)), h("div", { key: '52fd57812fda98ad244a1f60aa4ec2f31efce78d' }, h("calcite-button", { key: '3582c2ea725fe9eb36f1846fbb06acaedcb3ebe1', appearance: "transparent", disabled: nextBackDisabled, iconStart: "chevron-right", id: "solutions-next", onClick: () => this._next(), width: "full" }), h("calcite-tooltip", { key: '1212e990b6ae4e7979f2a1571b461cf063e55b9d', placement: "top", "reference-element": "solutions-next" }, h("span", { key: '2284b042fdfeebc86441119c404c5905fb84f367' }, this._translations.next))))), h("edit-card", { key: 'ae9f73223bdffa5c3ec85e3ebdf4b314cd91d1c7', class: editClass, graphicIndex: (_j = this._features) === null || _j === void 0 ? void 0 : _j.selectedFeatureIndex, graphics: this.graphics, mapView: this.mapView, open: this._editRecordOpen }), h("calcite-alert", { key: '1927a41a8c9fbb6373490d554cf8128a93fe8e71', icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { key: '33ba87f5b72019c2795fe12485aa51429115b74d', slot: "title" }, this._translations.editDisabled), h("div", { key: 'd45970a653b416bbdd5e5b97040b23e54eaf98a5', slot: "message" }, this._translations.enableEditing)))));
     }
     //--------------------------------------------------------------------------
     //
@@ -259,13 +258,11 @@ export class InfoCard {
                         this._showListView = isOpen;
                     }
                 });
-                if (this.zoomAndScrollToSelected) {
-                    this.reactiveUtils.watch(() => this._features.selectedFeatureIndex, (i) => {
-                        if (i > -1) {
-                            this.selectionChanged.emit({ selectedFeature: [this._features.selectedFeature], selectedFeatureIndex: this._features.selectedFeatureIndex });
-                        }
-                    });
-                }
+                this.reactiveUtils.watch(() => this._features.selectedFeatureIndex, (i) => {
+                    if (i > -1) {
+                        this.selectionChanged.emit({ selectedFeature: [this._features.selectedFeature], selectedFeatureIndex: this._features.selectedFeatureIndex });
+                    }
+                });
             }
             else {
                 this._features.view = this.mapView;
@@ -445,23 +442,6 @@ export class InfoCard {
                     "text": "esri/views/MapView: https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html"
                 }
             },
-            "zoomAndScrollToSelected": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "boolean: When true the selected feature will zoomed to in the map and the row will be scrolled to within the table"
-                },
-                "attribute": "zoom-and-scroll-to-selected",
-                "reflect": false
-            },
             "allowEditing": {
                 "type": "boolean",
                 "mutable": false,

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

@@ -74,9 +74,9 @@ export class LayerList {
      * Renders the component.
      */
     render() {
-        return (h(Fragment, { key: 'c73bf36c13fed8120273d8a5321dd60fe4d4b5f4' }, this._isLoading && h("calcite-loader", { key: 'e748d9cc7d1855d3a2da34702ba853d35d1a2cde', label: "", scale: "m" }), !this._isLoading && this.mapView && this._noLayersToDisplay &&
-            h("calcite-notice", { key: '4a06b7694fd91456ee5cdc51d33e4ac633d416b2', class: "error-msg", icon: "layers-reference", kind: "danger", open: true }, h("div", { key: '63b09f02312aba71826957c5b2c04a7750bdfca1', slot: "title" }, this._translations.error), h("div", { key: '5a19dfe527a6c66a5477a4c6a14f4686cde73bb3', slot: "message" }, this._translations.noLayerToDisplayErrorMsg)), !this._isLoading && this.mapView &&
-            h("calcite-list", { key: 'e8a6170a55f4ba6ea35a1397690c3e365b814886', "selection-appearance": "border", "selection-mode": "none" }, this.renderLayerList())));
+        return (h(Fragment, { key: '9366302a704c1dbdd7a65aef5c43d0ad84a44b23' }, this._isLoading && h("calcite-loader", { key: '69974a23fd42bc37ef13816efbe6d06e28cb2749', label: "", scale: "m" }), !this._isLoading && this.mapView && this._noLayersToDisplay &&
+            h("calcite-notice", { key: 'a93abb55b4db09727b3634cb1935e482c377d662', class: "error-msg", icon: "layers-reference", kind: "danger", open: true }, h("div", { key: 'b9046685353b8894e6c6094cff47fab7a8e07ffa', slot: "title" }, this._translations.error), h("div", { key: '90a052e1d80779a09a32fdd35563a1ce21d582e0', slot: "message" }, this._translations.noLayerToDisplayErrorMsg)), !this._isLoading && this.mapView &&
+            h("calcite-list", { key: '709c1b8edd5710a2476ecef638199c2f929b4165', "selection-appearance": "border", "selection-mode": "none" }, this.renderLayerList())));
     }
     //--------------------------------------------------------------------------
     //
@@ -104,10 +104,7 @@ export class LayerList {
         const allMapLayers = await getAllLayers(this.mapView);
         // eslint-disable-next-line @typescript-eslint/no-misused-promises
         allMapLayers.forEach(async (eachLayer) => {
-            var _a, _b;
-            //TODO: checking editable condition could be configurable
-            if ((eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.type) === "feature" && (eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.editingEnabled) && ((_b = (_a = eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.capabilities) === null || _a === void 0 ? void 0 : _a.operations) === null || _b === void 0 ? void 0 : _b.supportsAdd)) {
-                this._layerItemsHash[eachLayer.id].supportsAdd = true;
+            if ((eachLayer === null || eachLayer === void 0 ? void 0 : eachLayer.type) === "feature") {
                 if (this.showFeatureCount) {
                     const q = eachLayer.createQuery();
                     const result = eachLayer.queryFeatureCount(q);
@@ -140,7 +137,7 @@ export class LayerList {
         this.layersListLoaded.emit(this._mapLayerIds);
     }
     /**
-     * Returns the ids of all OR configured layers that needs to be shown in the list
+     * Returns the ids of configured layers that needs to be shown in the list
      * @param hash each layer item details
      * @returns array of layer ids
      */
@@ -148,11 +145,7 @@ export class LayerList {
         var _a;
         const configuredLayers = ((_a = this.layers) === null || _a === void 0 ? void 0 : _a.length) > 0 ? this.layers : [];
         return Object.keys(hash).reduce((prev, cur) => {
-            let showLayer = true;
-            if ((configuredLayers === null || configuredLayers === void 0 ? void 0 : configuredLayers.length) > 0) {
-                showLayer = configuredLayers.indexOf(cur) > -1;
-            }
-            if (showLayer) {
+            if (configuredLayers.indexOf(cur) > -1) {
                 prev.push(cur);
             }
             return prev;
@@ -180,7 +173,7 @@ export class LayerList {
     getLayerListItem(layerId) {
         const layerName = this._layerItemsHash[layerId].name;
         const featureCount = this._layerItemsHash[layerId].formattedFeatureCount;
-        return (h("calcite-list-item", { onCalciteListItemSelect: () => { this.onLayerItemSelected(layerId); } }, h("div", { class: "layer-name", slot: "content-start" }, layerName), this.showFeatureCount && featureCount !== undefined && featureCount !== "" && h("div", { class: !this.showNextIcon ? "feature-count" : "", slot: "content-end" }, "(" + featureCount + ")"), this.showNextIcon && h("calcite-icon", { icon: "chevron-right", scale: "s", slot: "content-end" })));
+        return (h("calcite-list-item", { onCalciteListItemSelect: () => { this.onLayerItemSelected(layerId); } }, h("div", { class: "layer-name", slot: "content-start" }, layerName), this.showFeatureCount && featureCount !== undefined && featureCount !== "" && h("div", { class: !this.showNextIcon ? "feature-count" : "", slot: "content-end" }, "(" + featureCount + ")"), this.showNextIcon && h("calcite-icon", { flipRtl: true, icon: "chevron-right", scale: "s", slot: "content-end" })));
     }
     /**On click of layer list item emit the event along with the selected layerId and layerName
      * @param layerId Layer id

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

@@ -224,6 +224,12 @@ export class LayerTable {
     async selectionChanged(evt) {
         const g = evt.detail.selectedFeature[0];
         const oid = g.getObjectId();
+        //Highlight the current selected feature in the table using rowHighlightIds
+        const table = this._table;
+        if (table.rowHighlightIds.length) {
+            table.rowHighlightIds.removeAll();
+        }
+        table.rowHighlightIds.add(oid);
         if (this.zoomAndScrollToSelected) {
             const i = this._table.viewModel.getObjectIdIndex(oid);
             this._table.scrollToIndex(i);
@@ -308,7 +314,7 @@ export class LayerTable {
         const selected = this.selectedIds.length.toString();
         const tableHeightClass = this.isMobile ? "height-full" : "height-full-adjusted";
         this._validateActiveActions();
-        return (h(Host, { key: 'a8110680363000bcec4eb6f0b4a94ee2f677dcca' }, h("calcite-shell", { key: '3c4471daca709db284ede134712933ada2213bdd' }, this._getTableControlRow("header"), h("div", { key: 'fce44e957e4490d6fd9cbcff02beec8cf1a780f4', class: `width-full ${tableHeightClass}` }, h("calcite-panel", { key: 'e75572b0f313f99489268f6d63b27b78c8722331', class: "height-full width-full" }, h("calcite-loader", { key: '2a34bd84408d1aff552f2818976e03c487443215', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), h("div", { key: '0823308992c61fa803cf5a526d903b629327c251', class: tableNodeClass, ref: this.onTableNodeCreate })), !this.isMobile ? (h("div", { class: "bottom-left text-color height-19" }, this._translations.recordsSelected
+        return (h(Host, { key: '92b88fc87d2c0a0eaaef9587d2324a63665b1cc2' }, h("calcite-shell", { key: 'fcc7190ee18fe6f20ab08a5331a8bcd2c9c83c74' }, this._getTableControlRow("header"), h("div", { key: 'be1a282eb23580b8f713f27fe198bab1c18ba689', class: `width-full ${tableHeightClass}` }, h("calcite-panel", { key: 'd5ef6c04334f48c26f01b61f587370c0ee58682f', class: "height-full width-full" }, h("calcite-loader", { key: 'b31c1977446ed6ca47e96a7a47673e03f938265e', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), h("div", { key: '07ce4a7741dc0197816f04e57c5d32cbc5666f0e', class: tableNodeClass, ref: this.onTableNodeCreate })), !this.isMobile ? (h("div", { class: "bottom-left text-color height-19" }, this._translations.recordsSelected
             .replace("{{total}}", total)
             .replace("{{selected}}", selected))) : undefined)), this._filterModal()));
     }

package/dist/collection/components/public-notification/public-notification.js

@@ -529,7 +529,7 @@ export class PublicNotification {
     _getExportPage() {
         const hasSelections = this._hasSelections(this.showRefineSelection);
         const displayDuplicatesClass = this._numDuplicates > 0 ? "display-block" : "display-none";
-        return (h("calcite-panel", null, h("div", null, this._getLabel(this._translations.export, false), hasSelections ? (h("div", null, this._getNotice(this._translations.exportTip, "padding-sides-1"), this._getLabel(this._translations.exportListsLabel), this._getExportSelectionLists(), h("div", { class: "padding-sides-1 " + displayDuplicatesClass }, h("div", { class: "display-flex" }, h("calcite-label", { layout: "inline" }, h("calcite-checkbox", { ref: (el) => { this._removeDuplicates = el; } }), h("div", { class: "display-flex" }, this._translations.removeDuplicate, h("div", { class: "info-message padding-start-1-2" }, h("calcite-input-message", { class: "info-blue margin-top-0", scale: "m" }, ` ${this._translations.numDuplicates.replace("{{n}}", this._numDuplicates.toString())}`)))), h("calcite-icon", { class: "padding-start-1-2 icon", icon: "question", id: "remove-duplicates-icon", scale: "s" })), h("calcite-popover", { closable: true, label: "", referenceElement: "remove-duplicates-icon" }, h("span", { class: "tooltip-message" }, this._translations.duplicatesTip))), h("div", { class: "border-bottom" }), h("div", { class: "padding-top-sides-1" }, h("calcite-segmented-control", { class: "w-100", onCalciteSegmentedControlChange: (evt) => this._exportTypeChange(evt), width: "full" }, h("calcite-segmented-control-item", { checked: this._exportType === EExportType.PDF, class: "w-50 end-border", value: EExportType.PDF }, h("span", { class: "font-weight-500" }, this._translations.pdf)), h("calcite-segmented-control-item", { checked: this._exportType === EExportType.CSV, class: "w-50", value: EExportType.CSV }, h("span", { class: "font-weight-500" }, this._translations.csv)))), h("div", { class: "padding-bottom-1" }, this._getExportOptions()), h("div", { class: "padding-1 display-flex" }, h("calcite-button", { disabled: (!this._downloadActive || this._fetchingData) || (!this._addMap && !this._addResults), loading: this._fetchingData, onClick: () => void this._export(), width: "full" }, h("span", { class: "font-weight-500" }, this._translations.export))))) : (this._getNotice(this._translations.downloadNoLists, "padding-sides-1 padding-bottom-1")))));
+        return (h("calcite-panel", null, h("div", null, this._getLabel(this._translations.export, false), hasSelections ? (h("div", null, this._getNotice(this._translations.exportTip, "padding-sides-1"), this._getLabel(this._translations.exportListsLabel), this._getExportSelectionLists(), h("div", { class: "padding-sides-1 " + displayDuplicatesClass }, h("div", { class: "display-flex" }, h("calcite-label", { layout: "inline" }, h("calcite-checkbox", { ref: (el) => { this._removeDuplicates = el; } }), h("div", { class: "display-flex" }, this._translations.removeDuplicate, h("div", { class: "info-message padding-start-1-2" }, h("calcite-input-message", { class: "info-blue margin-top-0", scale: "m" }, ` ${this._translations.numDuplicates.replace("{{n}}", this._numDuplicates.toString())}`)))), h("calcite-icon", { class: "padding-start-1-2 icon", flipRtl: true, icon: "question", id: "remove-duplicates-icon", scale: "s" })), h("calcite-popover", { closable: true, label: "", referenceElement: "remove-duplicates-icon" }, h("span", { class: "tooltip-message" }, this._translations.duplicatesTip))), h("div", { class: "border-bottom" }), h("div", { class: "padding-top-sides-1" }, h("calcite-segmented-control", { class: "w-100", onCalciteSegmentedControlChange: (evt) => this._exportTypeChange(evt), width: "full" }, h("calcite-segmented-control-item", { checked: this._exportType === EExportType.PDF, class: "w-50 end-border", value: EExportType.PDF }, h("span", { class: "font-weight-500" }, this._translations.pdf)), h("calcite-segmented-control-item", { checked: this._exportType === EExportType.CSV, class: "w-50", value: EExportType.CSV }, h("span", { class: "font-weight-500" }, this._translations.csv)))), h("div", { class: "padding-bottom-1" }, this._getExportOptions()), h("div", { class: "padding-1 display-flex" }, h("calcite-button", { disabled: (!this._downloadActive || this._fetchingData) || (!this._addMap && !this._addResults), loading: this._fetchingData, onClick: () => void this._export(), width: "full" }, h("span", { class: "font-weight-500" }, this._translations.export))))) : (this._getNotice(this._translations.downloadNoLists, "padding-sides-1 padding-bottom-1")))));
     }
     /**
      * Store the user selected export type CSV || PDF
@@ -550,7 +550,7 @@ export class PublicNotification {
         const graphicsOptionsClass = this._addMap ? "display-flex" : "display-none";
         const title = this._titleValue ? this._titleValue : this.defaultExportTitle ? this.defaultExportTitle : "";
         const formatOptionsClass = this._addResults ? "" : "display-none";
-        return (h("div", { class: displayClass }, this._getLabel(this._translations.pdfOptions, true), h("div", { class: "padding-top-sides-1" }, h("calcite-label", { class: "label-margin-0", layout: "inline" }, h("calcite-checkbox", { checked: this._addResults, onCalciteCheckboxChange: () => this._addResults = !this._addResults }), this._translations.addResults)), h("div", { class: `padding-top-sides-1 ${formatOptionsClass}` }, h("calcite-label", { class: "label-margin-0" }, this._translations.selectPDFLabelOption)), h("div", { class: `padding-sides-1 ${formatOptionsClass}` }, h("pdf-download", { defaultNumLabelsPerPage: parseInt(this.defaultNumLabelsPerPage.toString(), 10), disabled: !this._downloadActive, ref: (el) => { this._downloadTools = el; } })), h("div", { class: "padding-top-sides-1" }, h("calcite-label", { class: "label-margin-0", layout: "inline" }, h("calcite-checkbox", { checked: this._addTitle, onCalciteCheckboxChange: () => this._addTitle = !this._addTitle }), this._translations.title)), h("div", { class: titleOptionsClass }, this._getLabel(this._translations.title, true, ""), h("calcite-input-text", { class: "padding-sides-1", onCalciteInputTextInput: () => this._changeTitle(), placeholder: this._translations.titlePlaceholder, ref: (el) => { this._titleElement = el; }, value: title })), h("div", { class: "padding-top-sides-1" }, h("calcite-label", { class: "label-margin-0", layout: "inline" }, h("calcite-checkbox", { checked: this._addMap, onCalciteCheckboxChange: () => this._handleAddMapChange() }), this._translations.includeMap)), h("div", { class: `padding-top-sides-1 ${graphicsOptionsClass}` }, h("calcite-label", { class: "label-margin-0", layout: "inline" }, h("calcite-checkbox", { checked: this._exportGraphics, onCalciteCheckboxChange: () => this._handleExportGraphicsChange() }), this._translations.listGraphics), h("calcite-icon", { class: "padding-start-1-2 icon", icon: "question", id: "list-graphics-icon", scale: "s" }), h("calcite-popover", { closable: true, label: "", referenceElement: "list-graphics-icon" }, h("span", { class: "tooltip-message" }, this._translations.listGraphicsTip)))));
+        return (h("div", { class: displayClass }, this._getLabel(this._translations.pdfOptions, true), h("div", { class: "padding-top-sides-1" }, h("calcite-label", { class: "label-margin-0", layout: "inline" }, h("calcite-checkbox", { checked: this._addResults, onCalciteCheckboxChange: () => this._addResults = !this._addResults }), this._translations.addResults)), h("div", { class: `padding-top-sides-1 ${formatOptionsClass}` }, h("calcite-label", { class: "label-margin-0" }, this._translations.selectPDFLabelOption)), h("div", { class: `padding-sides-1 ${formatOptionsClass}` }, h("pdf-download", { defaultNumLabelsPerPage: parseInt(this.defaultNumLabelsPerPage.toString(), 10), disabled: !this._downloadActive, ref: (el) => { this._downloadTools = el; } })), h("div", { class: "padding-top-sides-1" }, h("calcite-label", { class: "label-margin-0", layout: "inline" }, h("calcite-checkbox", { checked: this._addTitle, onCalciteCheckboxChange: () => this._addTitle = !this._addTitle }), this._translations.title)), h("div", { class: titleOptionsClass }, this._getLabel(this._translations.title, true, ""), h("calcite-input-text", { class: "padding-sides-1", onCalciteInputTextInput: () => this._changeTitle(), placeholder: this._translations.titlePlaceholder, ref: (el) => { this._titleElement = el; }, value: title })), h("div", { class: "padding-top-sides-1" }, h("calcite-label", { class: "label-margin-0", layout: "inline" }, h("calcite-checkbox", { checked: this._addMap, onCalciteCheckboxChange: () => this._handleAddMapChange() }), this._translations.includeMap)), h("div", { class: `padding-top-sides-1 ${graphicsOptionsClass}` }, h("calcite-label", { class: "label-margin-0", layout: "inline" }, h("calcite-checkbox", { checked: this._exportGraphics, onCalciteCheckboxChange: () => this._handleExportGraphicsChange() }), this._translations.listGraphics), h("calcite-icon", { class: "padding-start-1-2 icon", flipRtl: true, icon: "question", id: "list-graphics-icon", scale: "s" }), h("calcite-popover", { closable: true, label: "", referenceElement: "list-graphics-icon" }, h("span", { class: "tooltip-message" }, this._translations.listGraphicsTip)))));
     }
     /**
      * Toggle the _addMap state variable and update the graphics on the map
@@ -846,7 +846,7 @@ export class PublicNotification {
      * @protected
      */
     _getAction(enabled, icon, text, onClick, indicator = false, slot = "") {
-        return (h("calcite-action", { disabled: !enabled, icon: icon, indicator: indicator, onClick: onClick, slot: slot, text: text }));
+        return (h("calcite-action", { disabled: !enabled, icon: icon, iconFlipRtl: true, indicator: indicator, onClick: onClick, slot: slot, text: text }));
     }
     /**
      * Store the number of selected features and if it's more than one enable save

package/dist/collection/demos/crowdsource-manager.html

@@ -45,11 +45,17 @@
     // });
 
       function infoIconButtonClick(evt) {
-      }
+          console.log('Introduction window button clicked')
+        }
+
+        function coverPageIconButtonClick() {
+          console.log('cover page button clicked')
+        }
 
       function addValues() {
       const demo = document.getElementById("demo");
-      demo.addEventListener('infoIconButtonClick', infoIconButtonClick);
+      demo.addEventListener('showIntroductionWindow', infoIconButtonClick);
+      demo.addEventListener('showCoverPage', coverPageIconButtonClick);
       let headerSet = false;
       let custom = [];
       var vars = window.location.search.substring(1).split('&');
@@ -204,6 +210,8 @@
         }]
       ];
       demo.hideMapOnLoad = false;
+      //demo.coverPageEnabled = true;
+      demo.introductionWindowEnabled = true;
     }
   </script>
 </head>

package/dist/collection/demos/crowdsource-reporter.html

@@ -140,10 +140,10 @@
           //id: "c720e337ff814fe4a83bc244c46f8e43" //15 Layers
           //id: "f5186c798b9e40dab1078658ddbc28cf" // 30K features
           //id: "dda88d905a6748a5ab46bea5be795f33" // screening layers
-          id: "b5bdcb1e5d684dd3b21a2d44b8e4f928" //Popup content + like dislike
+          //id: "b5bdcb1e5d684dd3b21a2d44b8e4f928" //Popup content + like dislike
           //id: "d399ec39959a4aac8617ae4f05dd6785" //Arcade
           //id: "024e8a5e73a34c5aade9632d651c5750" //Attachments
-          //id: "ae6d5d1936e84ce7adde44c7a7908846" //like dislike
+          id: "ae6d5d1936e84ce7adde44c7a7908846" //like dislike
           // id: "ce3dec81bf714d3bb71da9691ab686d1" //Filter
         }
         const webMap = new WebMap({
@@ -219,7 +219,8 @@
             like: false,
             likeField: "Like_field",
             dislike: false,
-            dislikeField: "Dislike_field"
+            dislikeField: "Dislike_field",
+            visible: false
           },
           "18cdb191817-layer-5": {
             reporting: true,
@@ -227,7 +228,8 @@
             like: true,
             likeField: "Like_field",
             dislike: true,
-            dislikeField: "Dislike_field"
+            dislikeField: "Dislike_field",
+            visible: false
           },
           "18f056682a4-layer-12":{
             reporting: true,
@@ -235,41 +237,46 @@
             like: true,
             likeField: "shrt",
             dislike: false,
-            dislikeField: "dislike_field"
+            dislikeField: "dislike_field",
+            visible: true
           },
-          "18f2a1562a8-layer-7": {
+          "18f2a1562a5-layer-3": {
             reporting: true,
             comment: true,
             like: true,
             likeField: "like_field",
             dislike: true,
-            dislikeField: "dislike_field"
+            dislikeField: "dislike_field",
+            visible: true
           },
-          "18f2a1562a5-layer-3": {
+          "18f2a1562a7-layer-4": {
             reporting: true,
             comment: true,
             like: true,
             likeField: "like_field",
             dislike: true,
-            dislikeField: "dislike_field"
+            dislikeField: "dislike_field",
+            visible: true
           },
-          "18f2a1562a7-layer-4": {
-            reporting: true,
+          "18f2a1562a7-layer-5": {
+            reporting: false,
             comment: true,
             like: true,
             likeField: "like_field",
             dislike: true,
-            dislikeField: "dislike_field"
+            dislikeField: "dislike_field",
+            visible: true
           },
-          "18f2a1562a7-layer-5": {
+          "18f2a1562a8-layer-6": {
             reporting: true,
             comment: true,
             like: true,
             likeField: "like_field",
             dislike: true,
-            dislikeField: "dislike_field"
+            dislikeField: "dislike_field",
+            visible: true
           },
-          "18f2a1562a8-layer-6": {
+          "18f2a1562a8-layer-7": {
             reporting: true,
             comment: true,
             like: true,

package/dist/collection/utils/interfaces.ts

@@ -589,6 +589,7 @@ export interface IReportingOption {
   likeField?: string;
   dislike: boolean;
   dislikeField?: string;
+  visible: boolean;
 }
 
 export interface ISortingInfo {

package/dist/collection/utils/popupUtils.js

@@ -18,6 +18,7 @@
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
+import { _prepareAttributeValue } from "./downloadUtils";
 import { loadModules } from "./loadModules";
 export class PopupUtils {
     /**
@@ -39,6 +40,7 @@ export class PopupUtils {
         }
         const layer = graphic.layer;
         const popupTitle = this._removeTags((_a = layer === null || layer === void 0 ? void 0 : layer.popupTemplate) === null || _a === void 0 ? void 0 : _a.title);
+        //resolve arcade expression from the popup title
         if (popupTitle.includes("{expression/expr") && ((_b = layer === null || layer === void 0 ? void 0 : layer.popupTemplate) === null || _b === void 0 ? void 0 : _b.expressionInfos) != null) {
             for (let i = 0; i < ((_c = layer.popupTemplate) === null || _c === void 0 ? void 0 : _c.expressionInfos.length); i++) {
                 const info = layer.popupTemplate.expressionInfos[i];
@@ -58,6 +60,17 @@ export class PopupUtils {
                 }
             }
         }
+        //Format field values
+        if (layer.popupTemplate.fieldInfos) {
+            layer.fields.forEach((field) => {
+                const attributeValue = graphic.attributes[field.name];
+                //get the field info from popupTemplate
+                const fieldInfo = layer.popupTemplate.fieldInfos.find((fInfo) => fInfo.fieldName.toLowerCase() === field.name.toLowerCase());
+                //format the attribute value
+                const formattedAttributeValue = _prepareAttributeValue(attributeValue, field.type, field.domain, fieldInfo === null || fieldInfo === void 0 ? void 0 : fieldInfo.format, this.intl);
+                attributes[`{${field.name.toUpperCase()}}`] = formattedAttributeValue;
+            });
+        }
         return popupTitle === null || popupTitle === void 0 ? void 0 : popupTitle.replace(/{.*?}/g, (placeholder) => {
             return attributes[placeholder.toUpperCase()] != null ? attributes[placeholder.toUpperCase()] : "";
         });
@@ -83,9 +96,11 @@ export class PopupUtils {
      * @protected
      */
     async _initModules() {
-        const [arcade] = await loadModules([
-            "esri/arcade"
+        const [arcade, intl] = await loadModules([
+            "esri/arcade",
+            "esri/intl"
         ]);
         this.arcade = arcade;
+        this.intl = intl;
     }
 }

package/dist/collection/utils/popupUtils.ts

@@ -14,6 +14,7 @@
 * limitations under the License.
 */
 
+import { _prepareAttributeValue } from "./downloadUtils";
 import { loadModules } from "./loadModules";
 
 export class PopupUtils {
@@ -23,6 +24,11 @@ export class PopupUtils {
 	 */
 	arcade: typeof import("esri/arcade");
 
+	/**
+	 * esri/intl: https://developers.arcgis.com/javascript/latest/api-reference/esri-intl.html
+	 */
+	intl: typeof import("esri/intl");
+
 	/**
 	 * Get the popup title that honors arcade expressions
 	 * @param graphic selected graphic
@@ -47,6 +53,7 @@ export class PopupUtils {
 		}
 		const layer = graphic.layer as __esri.FeatureLayer;
 		const popupTitle = this._removeTags(layer?.popupTemplate?.title as string);
+		//resolve arcade expression from the popup title
 		if (popupTitle.includes("{expression/expr") && layer?.popupTemplate?.expressionInfos != null) {
 			for (let i = 0; i < layer.popupTemplate?.expressionInfos.length; i++) {
 				const info = layer.popupTemplate.expressionInfos[i];
@@ -65,7 +72,18 @@ export class PopupUtils {
 				}
 			}
 		}
-
+		//Format field values
+		if (layer.popupTemplate.fieldInfos) {
+			layer.fields.forEach((field) => {
+				const attributeValue = graphic.attributes[field.name];
+				//get the field info from popupTemplate
+				const fieldInfo = layer.popupTemplate.fieldInfos.find((fInfo) => fInfo.fieldName.toLowerCase() === field.name.toLowerCase());
+				//format the attribute value
+				const formattedAttributeValue = _prepareAttributeValue(attributeValue, field.type, field.domain, fieldInfo?.format, this.intl);
+				attributes[`{${field.name.toUpperCase()}}`] = formattedAttributeValue;
+			})
+		}
+		
 		return popupTitle?.replace(/{.*?}/g, (placeholder: string) => {
 			return attributes[placeholder.toUpperCase()] != null ? (attributes[placeholder.toUpperCase()] as string) : "";
 		});
@@ -93,10 +111,12 @@ export class PopupUtils {
 	 * @protected
 	 */
 	protected async _initModules(): Promise<void> {
-		const [arcade] = await loadModules([
-			"esri/arcade"
+		const [arcade, intl] = await loadModules([
+			"esri/arcade",
+			"esri/intl"
 		]);
 		this.arcade = arcade;
+		this.intl = intl;
 	}
 
 }

package/dist/components/arcgis-login.js

@@ -50,7 +50,7 @@ const ArcgisLogin$1 = /*@__PURE__*/ proxyCustomElement(class ArcgisLogin extends
     //
     //--------------------------------------------------------------------------
     render() {
-        return (h(Host, { key: '7ef89062c15023c646a5134818900cc5b5ae2c43' }, h("slot", { key: 'a1698e009dd0e86591c4858f352186079e0299ed' })));
+        return (h(Host, { key: 'b71ecf635ef91c3604665890c3eec5c5bc51651c' }, h("slot", { key: '77c4af2284404bc351b1eb93a81b2151f8e8cce1' })));
     }
     get el() { return this; }
     static get style() { return ArcgisLoginStyle0; }

package/dist/components/basemap-gallery2.js

@@ -53,7 +53,7 @@ const BasemapGallery = /*@__PURE__*/ proxyCustomElement(class BasemapGallery ext
      * StencilJS: Renders the component.
      */
     render() {
-        return (h(Host, { key: '9cef4efc85e1168ca8909f9e7d5cea48bf06b51c' }, h("div", { key: '837779b470b2170285fafeffa705d09f573dbfc6', ref: (el) => { this._basemapElement = el; } })));
+        return (h(Host, { key: '7fe5ef48d77de087f17498e2e1f3370a069e8629' }, h("div", { key: 'aca555c687352046a138343cab6f656234069644', ref: (el) => { this._basemapElement = el; } })));
     }
     /**
      * StencilJS: Called once just after the component is fully loaded and the first render() occurs.

package/dist/components/buffer-tools2.js

@@ -86,7 +86,7 @@ const BufferTools = /*@__PURE__*/ proxyCustomElement(class BufferTools extends H
      * Renders the component.
      */
     render() {
-        return (h(Host, { key: 'b06e61d0e1cb18f0b7c34f51c74455a8d00c279b' }, this.appearance === "text" ? this._getTextBoxDisplay() : this._getSliderDisplay()));
+        return (h(Host, { key: '63b775eca8dd10785df7b58be3a79eaa6cf4c049' }, this.appearance === "text" ? this._getTextBoxDisplay() : this._getSliderDisplay()));
     }
     //--------------------------------------------------------------------------
     //