@esri/solutions-components 0.7.29 → 0.7.30

package/dist/assets/t9n/public-notification/resources_sk.json

@@ -29,9 +29,9 @@
   "export": "Export",
   "exportTip": "Vyberte zoznamy, ktoré chcete zahrnúť do exportovaného súboru. Exportujte zoznamy ako CSV a PDF.",
   "title": "Názov",
-  "addTitle": "Pridať názov",
+  "addResults": "ĺ_Results_______________ľ",
   "titlePlaceholder": "Tu zadajte názov",
-  "includeMap": "Zahrnúť mapu",
+  "includeMap": "ĺ_Map_______ľ",
   "pdfOptions": "Možnosti PDF",
   "csvOptions": "Možnosti CSV",
   "refineSelection": "Spresniť výber",

package/dist/assets/t9n/public-notification/resources_sl.json

@@ -29,9 +29,9 @@
   "export": "Izvozi",
   "exportTip": "Izberite sloje, ki bodo vključeni v izvoženo datoteko. Izvozite sezname kot CSV in PDF.",
   "title": "Naslov",
-  "addTitle": "Dodaj ime",
+  "addResults": "Š_Results_______________č",
   "titlePlaceholder": "Tukaj vnesi naslov",
-  "includeMap": "Vključi karto",
+  "includeMap": "Š_Map_______č",
   "pdfOptions": "Možnosti PDF",
   "csvOptions": "Možnosti CSV",
   "refineSelection": "Natančno določi izbiro",

package/dist/assets/t9n/public-notification/resources_sr.json

@@ -29,9 +29,9 @@
   "export": "Izvezi",
   "exportTip": "Odaberite liste da uključite u izvezenu datoteku. Izvezite liste kao CSV i PDF.",
   "title": "Naslov",
-  "addTitle": "Dodaj naslov",
+  "addResults": "Č_Results_______________ž",
   "titlePlaceholder": "Unesite naslov ovde",
-  "includeMap": "Uključi mapu",
+  "includeMap": "Č_Map_______ž",
   "pdfOptions": "Opcije PDF datoteke",
   "csvOptions": "Opcije CSV datoteke",
   "refineSelection": "Precizirajte selekciju",

package/dist/assets/t9n/public-notification/resources_sv.json

@@ -29,9 +29,9 @@
   "export": "Exportera",
   "exportTip": "Välj listor att inkludera i den exporterade filen. Exportera listor som CSV och PDF.",
   "title": "Titel",
-  "addTitle": "Lägg till titel",
+  "addResults": "Å_Results_______________ö",
   "titlePlaceholder": "Ange titel här",
-  "includeMap": "Inkludera karta",
+  "includeMap": "Å_Map_______ö",
   "pdfOptions": "PDF-alternativ",
   "csvOptions": "CSV-alternativ",
   "refineSelection": "Förfina urval",

package/dist/assets/t9n/public-notification/resources_th.json

@@ -29,9 +29,9 @@
   "export": "ส่งออก",
   "exportTip": "เลือกรายการที่จะรวมไว้ในไฟล์ที่ส่งออก ส่งออกรายการในรูปแบบ CSV และ PDF",
   "title": "คำนำหน้า",
-  "addTitle": "เพิ่มชื่อ",
+  "addResults": "ก้_Results_______________ษฺ",
   "titlePlaceholder": "ป้อนชื่อที่นี่",
-  "includeMap": "รวมแผนที่",
+  "includeMap": "ก้_Map_______ษฺ",
   "pdfOptions": "ตัวเลือก PDF",
   "csvOptions": "ตัวเลือก CSV",
   "refineSelection": "ปรับแต่งการเลือก",

package/dist/assets/t9n/public-notification/resources_tr.json

@@ -29,9 +29,9 @@
   "export": "Dışa Aktar",
   "exportTip": "Dışa aktarılan dosyaya dahil etmek için listeleri seçin. CSV ve PDF olarak listeleri dışa aktarın.",
   "title": "Başlık",
-  "addTitle": "Başlık ekle",
+  "addResults": "ı_Results_______________İ",
   "titlePlaceholder": "Başlığı buraya girin",
-  "includeMap": "Haritayı dahil et",
+  "includeMap": "ı_Map_______İ",
   "pdfOptions": "PDF Seçenekleri",
   "csvOptions": "CSV Seçenekleri",
   "refineSelection": "Seçimi iyileştir",

package/dist/assets/t9n/public-notification/resources_uk.json

@@ -29,9 +29,9 @@
   "export": "Експорт",
   "exportTip": "Виберіть списки для включення в файл експорту. Експортуйте списки як CSV і PDF.",
   "title": "Заголовок",
-  "addTitle": "Додати заголовок",
+  "addResults": "ґ_Results_______________Ї",
   "titlePlaceholder": "Ввести заголовок тут",
-  "includeMap": "Включити карту",
+  "includeMap": "ґ_Map_______Ї",
   "pdfOptions": "Опції PDF",
   "csvOptions": "Опції CSV",
   "refineSelection": "Уточнити вибірку",

package/dist/assets/t9n/public-notification/resources_vi.json

@@ -29,9 +29,9 @@
   "export": "Xuất",
   "exportTip": "Lựa chọn các danh sách để đưa vào tệp đã xuất. Xuất danh sách dưới dạng CSV và PDF.",
   "title": "Tiêu đề",
-  "addTitle": "Thêm tiêu đề",
+  "addResults": "Đ_Results_______________ớ",
   "titlePlaceholder": "Nhập tiêu đề ở đây",
-  "includeMap": "Bao gồm bản đồ",
+  "includeMap": "Đ_Map_______ớ",
   "pdfOptions": "Tùy chọn PDF",
   "csvOptions": "Tùy chọn CSV",
   "refineSelection": "Lựa chọn tinh chỉnh",

package/dist/assets/t9n/public-notification/resources_zh-CN.json

@@ -29,9 +29,9 @@
   "export": "导出",
   "exportTip": "选择要包含在导出的文件中的列表。 将列表导出为 CSV 和 PDF。",
   "title": "标题",
-  "addTitle": "添加标题",
+  "addResults": "试_Results_______________验",
   "titlePlaceholder": "在此处输入标题",
-  "includeMap": "包含地图",
+  "includeMap": "试_Map_______验",
   "pdfOptions": "PDF 选项",
   "csvOptions": "CSV 选项",
   "refineSelection": "优化选择",

package/dist/assets/t9n/public-notification/resources_zh-HK.json

@@ -29,9 +29,9 @@
   "export": "匯出",
   "exportTip": "選擇要包含在匯出檔案中的清單。 將清單匯出為 CSV 和 PDF。",
   "title": "標題",
-  "addTitle": "新增標題",
+  "addResults": "試_Results_______________驗",
   "titlePlaceholder": "在這裡輸入標題",
-  "includeMap": "包含地圖",
+  "includeMap": "試_Map_______驗",
   "pdfOptions": "PDF 選項",
   "csvOptions": "CSV 選項",
   "refineSelection": "精細化選擇",

package/dist/assets/t9n/public-notification/resources_zh-TW.json

@@ -29,9 +29,9 @@
   "export": "匯出",
   "exportTip": "選擇要包含在匯出檔案中的清單。 將清單匯出為 CSV 和 PDF。",
   "title": "標題",
-  "addTitle": "新增標題",
+  "addResults": "試_Results_______________驗",
   "titlePlaceholder": "在這裡輸入標題",
-  "includeMap": "包含地圖",
+  "includeMap": "試_Map_______驗",
   "pdfOptions": "PDF 選項",
   "csvOptions": "CSV 選項",
   "refineSelection": "精細化選擇",

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

@@ -432,6 +432,7 @@ const FeatureList = class {
     /**
      * On feature click in feature list highlight the feature on the map
      * @param event feature clicked event
+     * @param selectedFeature selected feature graphic
      * @protected
      */
     async featureClicked(event, selectedFeature) {
@@ -518,7 +519,7 @@ const FeatureList = class {
 };
 FeatureList.style = featureListCss;
 
-const layerListCss = ":host{display:block}.error-msg{padding:10px}.layer-name{font-weight:500;padding:10px 12px}";
+const layerListCss = ":host{display:block}.error-msg{padding:10px}.layer-name{font-weight:500;padding:10px 12px}.feature-count{padding-right:12px}";
 
 const LayerList = class {
     constructor(hostRef) {
@@ -528,6 +529,8 @@ const LayerList = class {
         this.mapView = undefined;
         this.layers = undefined;
         this.noLayerErrorMsg = undefined;
+        this.showFeatureCount = true;
+        this.showNextIcon = false;
         this._noLayersToDisplay = false;
         this._mapLayerIds = [];
         this._isLoading = false;
@@ -559,7 +562,7 @@ const LayerList = class {
     render() {
         return (index.h(index.Fragment, null, this._isLoading && index.h("calcite-loader", { scale: "m" }), !this._isLoading && this.mapView && this._noLayersToDisplay &&
             index.h("calcite-notice", { class: "error-msg", icon: "layers-reference", kind: "danger", open: true }, index.h("div", { slot: "title" }, this._translations.error), index.h("div", { slot: "message" }, this.noLayerErrorMsg ? this.noLayerErrorMsg : this._translations.noLayerToDisplayErrorMsg)), !this._isLoading && this.mapView &&
-            index.h("calcite-list", null, this.renderLayerList())));
+            index.h("calcite-list", { "selection-appearance": "border", "selection-mode": this.showNextIcon ? "none" : "single" }, this.renderLayerList())));
     }
     //--------------------------------------------------------------------------
     //
@@ -586,7 +589,7 @@ const LayerList = class {
         this._layerItemsHash = await mapViewUtils.getMapLayerHash(this.mapView, true);
         const allMapLayers = await mapViewUtils.getAllLayers(this.mapView);
         // eslint-disable-next-line @typescript-eslint/no-misused-promises
-        allMapLayers.forEach(async (eachLayer) => {
+        this.showFeatureCount && 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.supportsUpdate)) {
@@ -660,13 +663,13 @@ const LayerList = class {
     getLayerListItem(layerId) {
         const layerName = this._layerItemsHash[layerId].name;
         const featureCount = this._layerItemsHash[layerId].formattedFeatureCount;
-        return (index.h("calcite-list-item", { onCalciteListItemSelect: () => { this.showFeaturesList(layerId); } }, index.h("div", { class: "layer-name", slot: "content-start" }, layerName), featureCount !== "" && index.h("div", { slot: "content-end" }, "(" + featureCount + ")"), index.h("calcite-icon", { icon: "chevron-right", scale: "s", slot: "content-end" })));
+        return (index.h("calcite-list-item", { onCalciteListItemSelect: () => { this.onLayerItemSelected(layerId); } }, index.h("div", { class: "layer-name", slot: "content-start" }, layerName), this.showFeatureCount && featureCount !== undefined && featureCount !== "" && index.h("div", { class: !this.showNextIcon ? "feature-count" : "", slot: "content-end" }, "(" + featureCount + ")"), this.showNextIcon && index.h("calcite-icon", { icon: "chevron-right", scale: "s", slot: "content-end" })));
     }
-    /**On click of layer list item show feature list
+    /**On click of layer list item emit the event along with the selected layerId and layerName
      * @param layerId Layer id
      * @protected
      */
-    showFeaturesList(layerId) {
+    onLayerItemSelected(layerId) {
         this.layerSelect.emit({ layerId, layerName: this._layerItemsHash[layerId].name });
     }
     /**

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

@@ -9,8 +9,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b8a649fc.js');
 const locale = require('./locale-a476e15d.js');
+const mapViewUtils = require('./mapViewUtils-8aa325de.js');
 require('./esri-loader-a91c0ec1.js');
 require('./_commonjsHelpers-384729db.js');
+require('./interfaces-7cd0a48a.js');
 
 const crowdsourceReporterCss = ":host{display:block;--calcite-label-margin-bottom:0px;--solutions-theme-foreground-color:var(--calcite-color-foreground-1)}.width-full{width:100% !important}.width-0{width:0}.height-full{height:100% !important}.height-0{height:0}.overflow-hidden{overflow:hidden}.border{border:1px solid var(--calcite-color-border-3)}.error-msg{padding:10px}";
 
@@ -44,6 +46,7 @@ const CrowdsourceReporter = class {
         this._sidePanelCollapsed = false;
         this._translations = undefined;
         this._hasValidLayers = false;
+        this._selectedLayerName = undefined;
     }
     //--------------------------------------------------------------------------
     //
@@ -75,6 +78,7 @@ const CrowdsourceReporter = class {
      * @returns Promise when complete
      */
     async componentWillLoad() {
+        await this._initModules();
         await this._getTranslations();
     }
     /**
@@ -88,6 +92,19 @@ const CrowdsourceReporter = class {
     //  Functions (protected)
     //
     //--------------------------------------------------------------------------
+    /**
+     * Load esri javascript api modules
+     *
+     * @returns Promise resolving when function is done
+     *
+     * @protected
+     */
+    async _initModules() {
+        const [reactiveUtils] = await locale.loadModules([
+            "esri/core/reactiveUtils"
+        ]);
+        this.reactiveUtils = reactiveUtils;
+    }
     /**
      * Get the reporter app functionality
      * @protected
@@ -121,7 +138,7 @@ const CrowdsourceReporter = class {
         return (index.h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this.reportsHeader }, this._hasValidLayers &&
             index.h("calcite-action", { icon: "sort-ascending-arrow", slot: this.isMobile ? "header-menu-actions" : "header-actions-end", text: this._translations.sort, "text-enabled": this.isMobile }), this._hasValidLayers &&
             index.h("calcite-action", { icon: "filter", slot: this.isMobile ? "header-menu-actions" : "header-actions-end", text: this._translations.filter, "text-enabled": this.isMobile }), this.isMobile && this.getActionToExpandCollapsePanel(), this._hasValidLayers && this.enableNewReports &&
-            index.h("calcite-button", { appearance: "secondary", slot: "footer", width: "full" }, this.reportButtonText), index.h("calcite-panel", { "full-height": true, "full-width": true }, index.h("layer-list", { class: "height-full", layers: this.layers, mapView: this.mapView, noLayerErrorMsg: this._translations.noLayerToDisplayErrorMsg, onLayerSelect: this.displayFeaturesList.bind(this), onLayersListLoaded: this.layerListLoaded.bind(this) }))));
+            index.h("calcite-button", { appearance: "secondary", slot: "footer", width: "full" }, this.reportButtonText), index.h("calcite-panel", { "full-height": true, "full-width": true }, index.h("layer-list", { class: "height-full", layers: this.layers, mapView: this.mapView, noLayerErrorMsg: this._translations.noLayerToDisplayErrorMsg, onLayerSelect: this.displayFeaturesList.bind(this), onLayersListLoaded: this.layerListLoaded.bind(this), showFeatureCount: true, showNextIcon: true }))));
     }
     /**
      * When layer list is loaded, we will receive the list of layers, if its  means we don't have any valid layer to be listed
@@ -130,6 +147,7 @@ const CrowdsourceReporter = class {
      */
     layerListLoaded(evt) {
         const layersListed = evt.detail;
+        this.handleMapClick(layersListed);
         this._hasValidLayers = layersListed.length > 0;
     }
     /**On click of layer list item show feature list
@@ -169,6 +187,7 @@ const CrowdsourceReporter = class {
     /**
      * Get feature list of the selected feature layer
      * @param layerId Layer id
+     * @param layerName Layer name
      * @returns feature list node
      * @protected
      */
@@ -181,7 +200,15 @@ const CrowdsourceReporter = class {
      * @returns Node
      */
     getFeatureDetailsFlowItem() {
-        return (index.h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, onCalciteFlowItemBack: this.backFromFeatureList.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), index.h("calcite-action", { icon: "share", slot: "header-actions-end", text: this._translations.share }), index.h("calcite-panel", { "full-height": true }, index.h("info-card", { allowEditing: false, graphics: this._selectedFeature, isLoading: false, isMobile: false, mapView: this.mapView, zoomAndScrollToSelected: true }))));
+        return (index.h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, onCalciteFlowItemBack: this.backFromFeatureList.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), index.h("calcite-action", { icon: "share", slot: "header-actions-end", text: this._translations.share }), index.h("calcite-panel", { "full-height": true }, index.h("info-card", { allowEditing: false, graphics: this._selectedFeature, isLoading: false, isMobile: false, mapView: this.mapView, onSelectionChanged: this.featureDetailsChanged.bind(this), zoomAndScrollToSelected: true }))));
+    }
+    /**
+     * On Feature details change update the Layer title and the current selected layer id
+     * @param evt Event hold the details of current feature graphic in the info-card
+     */
+    featureDetailsChanged(evt) {
+        this._selectedLayerId = evt.detail[0].layer.id;
+        this._selectedLayerName = evt.detail[0].layer.title;
     }
     /**
      * Returns the action button to Expand/Collapse side panel in mobile mode
@@ -204,6 +231,63 @@ const CrowdsourceReporter = class {
             this._defaultLevel = undefined;
         }
     }
+    /**
+     * Handle map click event
+     * @param layers Array of layerIds
+     *
+     *  @protected
+     */
+    handleMapClick(layers) {
+        if (this._mapClickHandle) {
+            this._mapClickHandle.remove();
+        }
+        this._mapClickHandle = this.reactiveUtils.on(() => this.mapView, "click", (event) => {
+            void this.onMapClick(event, layers);
+        });
+    }
+    /**
+     * On map click do hitTest and get the clicked graphics of valid layers and show feature details
+     * @param event
+     * @param layers
+     *
+     * @protected
+     */
+    async onMapClick(event, layers) {
+        //disable map popup
+        this.mapView.popupEnabled = false;
+        // only include graphics from valid layers listed in the layer list widget
+        const allMapLayers = await mapViewUtils.getAllLayers(this.mapView);
+        const validLayers = [];
+        allMapLayers.forEach((eachLayer) => {
+            if (layers.includes(eachLayer.id)) {
+                validLayers.push(eachLayer);
+            }
+        });
+        const opts = {
+            include: validLayers
+        };
+        // Perform a hitTest on the View
+        const hitTest = await this.mapView.hitTest(event, opts);
+        if (hitTest.results.length > 0) {
+            const clickedGraphics = [];
+            hitTest.results.forEach(function (result) {
+                // check if the result type is graphic
+                if (result.type === 'graphic') {
+                    clickedGraphics.push(result.graphic);
+                }
+            });
+            //update the selectedFeature
+            this._selectedFeature = clickedGraphics;
+            //if featureDetails not open then add it to the list else just reInit flowItems which will update details with newly selected features
+            // eslint-disable-next-line unicorn/prefer-ternary
+            if (this._flowItems.length && this._flowItems[this._flowItems.length - 1] !== "feature-details") {
+                this._flowItems = [...this._flowItems, "feature-details"];
+            }
+            else {
+                this._flowItems = [...this._flowItems];
+            }
+        }
+    }
     /**
      * Fetches the component's translations
      * @returns Promise when complete