@esri/solutions-components 0.5.8 → 0.5.10

package/dist/components/downloadUtils.js

@@ -2261,39 +2261,52 @@ const lineSeparatorChar = "|";
 /**
  * Downloads csv of mailing labels for the provided list of ids
  *
- * @param selectionSetNames Names of the selection sets used to provide ids
- * @param layer Layer providing features and attributes for download
- * @param ids List of ids to download
+ * @param exportInfos Key details about what to export (ids, layer, and selectionSetNames)
  * @param formatUsingLayerPopup When true, the layer's popup is used to choose attributes for each column; when false,
  * all attributes are exported
  * @param removeDuplicates When true a single label is generated when multiple featues have a shared address value
  * @param addColumnTitle Indicates if column headings should be included in output
  * @returns Promise resolving when function is done
  */
-async function downloadCSV(selectionSetNames, layer, ids, formatUsingLayerPopup, removeDuplicates = false, addColumnTitle = false) {
-  const labels = await _prepareLabels(layer, ids, removeDuplicates, formatUsingLayerPopup, addColumnTitle);
-  exportCSV(_createFilename(selectionSetNames), labels);
+async function downloadCSV(exportInfos, formatUsingLayerPopup, removeDuplicates = false, addColumnTitle = false) {
+  let labels = await consolidateLabels(exportInfos, formatUsingLayerPopup, addColumnTitle, true);
+  labels = removeDuplicates ? removeDuplicateLabels(labels) : labels;
+  const layerIds = Object.keys(exportInfos);
+  let layerLabels = [];
+  labels.forEach(label => {
+    const id = label[0];
+    // layerIds are stored as value separator at the end of the values for a given layer
+    if (layerIds.indexOf(id) < 0) {
+      layerLabels.push(label);
+    }
+    else {
+      const selectionSetNames = _getSelectionSetNames(exportInfos, new RegExp(`\\b${id}\\b`));
+      // once we see the layerId we have reached the end of it's values and should export
+      exportCSV(_createFilename(selectionSetNames), layerLabels);
+      layerLabels = [];
+    }
+  });
   return Promise.resolve();
 }
 /**
  * Downloads csv of mailing labels for the provided list of ids
  *
- * @param selectionSetNames Names of the selection sets used to provide ids
- * @param layer Layer providing features and attributes for download
- * @param ids List of ids to download
+ * @param exportInfos Key details about what to export (ids, layer, and selectionSetNames)
  * @param labelPageDescription Provides PDF page layout info
  * @param removeDuplicates When true a single label is generated when multiple featues have a shared address value
  * @param title Title for each page
  * @param initialImageDataUrl Data URL of image for first page
  * @returns Promise resolving when function is done
  */
-async function downloadPDF(selectionSetNames, layer, ids, labelPageDescription, removeDuplicates = false, title = "", initialImageDataUrl = "") {
-  let labels = await _prepareLabels(layer, ids, removeDuplicates);
+async function downloadPDF(exportInfos, labelPageDescription, removeDuplicates = false, title = "", initialImageDataUrl = "") {
+  let labels = await consolidateLabels(exportInfos);
+  const selectionSetNames = _getSelectionSetNames(exportInfos);
   labels =
     // Remove empty lines in labels
     labels.map(labelLines => labelLines.filter(line => line.length > 0))
       // Remove empty labels
       .filter(label => label.length > 0);
+  labels = removeDuplicates ? removeDuplicateLabels(labels) : labels;
   exportPDF(_createFilename(selectionSetNames), labels, labelPageDescription, title, initialImageDataUrl);
   return Promise.resolve();
 }
@@ -2510,13 +2523,12 @@ function _prepareAttributeValue(attributeValue, attributeType, attributeDomain,
  *
  * @param layer Layer from which to fetch features
  * @param ids List of ids to download
- * @param removeDuplicates When true a single label is generated when multiple featues have a shared address value
  * @param formatUsingLayerPopup When true, the layer's popup is used to choose attributes for each column; when false,
  * all attributes are exported
  * @param includeHeaderNames Add the label format at the front of the list of generated labels
  * @returns Promise resolving when function is done
  */
-async function _prepareLabels(layer, ids, removeDuplicates = true, formatUsingLayerPopup = true, includeHeaderNames = false) {
+async function _prepareLabels(layer, ids, formatUsingLayerPopup = true, includeHeaderNames = false) {
   var _a, _b, _c, _d, _e, _f;
   const [intl] = await loadModules(["esri/intl"]);
   // Get the features to export
@@ -2570,7 +2582,6 @@ async function _prepareLabels(layer, ids, removeDuplicates = true, formatUsingLa
   let labels;
   // eslint-disable-next-line unicorn/prefer-ternary
   if (labelFormat) {
-    console.log("labelFormat", labelFormat); //???
     const arcadeExpressionRegExp = /\{expression\/\w+\}/g;
     const attributeRegExp = /\{\w+\}/g;
     // Find the label fields that we need to replace with values
@@ -2598,28 +2609,21 @@ async function _prepareLabels(layer, ids, removeDuplicates = true, formatUsingLa
       });
       // Wait for all of the queries for related records for this label
       const relatedFeatureQueryResults = await Promise.all(relatedFeatureQueries);
-      console.log("relatedFeatureQueryResults", relatedFeatureQueryResults); //???
       relatedFeatureQueryResults.forEach((relatedFeatureQueryResult, i) => {
         // We have an object with FeatureSets grouped by source layer or table objectIds
         const relationshipId = relationshipIds[i];
-        console.log("relationshipId", relationshipId); //???
-        console.log("relatedFeatureQueryResult", relatedFeatureQueryResult); //???
         // Run through the source layer or table objectIds
         Object.keys(relatedFeatureQueryResult).forEach(relatedFeatureSetId => {
-          console.log("relatedFeatureSetId", relatedFeatureSetId); //???
           // We have a feature set
           const relatedFeatures = relatedFeatureQueryResult[relatedFeatureSetId].features;
-          console.log("relatedFeatures", relatedFeatures); //???
           // Get the values from each feature and replace them in the label
           relatedFeatures.forEach(feature => {
             // Merge the base and related feature attributes and create the label
             // Prefix related feature's attributes with "relationships/<id>/" to match popup
             const rePrefix = "\{relationships/" + relationshipId + "/";
             const reSuffix = "\}";
-            console.log("/rePrefix + attributeName + reSuffix/g", rePrefix + "attributeName" + reSuffix); //???
             const attributes = feature.attributes;
             Object.keys(attributes).forEach(attributeName => {
-              console.log("/rePrefix + attributeName + reSuffix/g", rePrefix + attributeName + reSuffix); //???
               // Replace the value using the attribute name as a relationship
               const attributeRelationshipRegExp = new RegExp(rePrefix + attributeName + reSuffix, "g");
               labelPrep = labelPrep.replaceAll(attributeRelationshipRegExp, attributes[attributeName]);
@@ -2649,12 +2653,6 @@ async function _prepareLabels(layer, ids, removeDuplicates = true, formatUsingLa
       });
     });
   }
-  // Remove duplicates
-  if (removeDuplicates) {
-    const labelsAsStrings = labels.map(label => JSON.stringify(label));
-    const uniqueLabels = new Set(labelsAsStrings);
-    labels = Array.from(uniqueLabels, labelString => JSON.parse(labelString));
-  }
   // Add header names
   if (includeHeaderNames) {
     let headerNames = [];
@@ -2671,6 +2669,55 @@ async function _prepareLabels(layer, ids, removeDuplicates = true, formatUsingLa
   }
   return Promise.resolve(labels);
 }
+/**
+ * Remove any duplicate labels
+ *
+ * @param labels Labels to evaluate for duplicates
+ * @returns labels with duplicates removed
+ */
+function removeDuplicateLabels(labels) {
+  const labelsAsStrings = labels.map(label => JSON.stringify(label));
+  const uniqueLabels = new Set(labelsAsStrings);
+  return Array.from(uniqueLabels, labelString => JSON.parse(labelString));
+}
+/**
+ * Extract selectionSetNames from the provided exportInfos
+ *
+ * @param exportInfos Key details about what to export (ids, layer, and selectionSetNames)
+ * @returns selectionSetNames that will be used for export filenames
+ */
+function _getSelectionSetNames(exportInfos, id = /.+/) {
+  let selectionSetNames = [];
+  Object.keys(exportInfos).forEach(k => {
+    const exportInfo = exportInfos[k];
+    if (id.test(k)) {
+      selectionSetNames = selectionSetNames.concat(exportInfo.selectionSetNames);
+    }
+  });
+  return selectionSetNames;
+}
+/**
+ * Create and consolidate labels from all layers
+ *
+ * @param exportInfos Key details about what to export (ids, layer, and selectionSetNames)
+ * @param formatUsingLayerPopup When true, the layer's popup is used to choose attributes for each column; when false,
+ * all attributes are exported
+ * @param includeHeaderNames Add the label format at the front of the list of generated labels
+ * @returns selectionSetNames that will be used for export filenames
+ */
+async function consolidateLabels(exportInfos, formatUsingLayerPopup = true, includeHeaderNames = false, isCSVExport = false) {
+  const labelRequests = [];
+  Object.keys(exportInfos).forEach(k => {
+    const labelInfo = exportInfos[k];
+    labelRequests.push(_prepareLabels(labelInfo.layerView.layer, labelInfo.ids, formatUsingLayerPopup, includeHeaderNames));
+    if (isCSVExport) {
+      // add the layer id as a temp value separator that we can use to split values for CSV export
+      labelRequests.push(Promise.resolve([[k]]));
+    }
+  });
+  const labels = await Promise.all(labelRequests);
+  return labels.reduce((prev, cur) => prev.concat(cur), []);
+}
 //#endregion
 
-export { _typeof_1 as _, downloadPDF as a, downloadCSV as d };
+export { _typeof_1 as _, downloadPDF as a, consolidateLabels as c, downloadCSV as d, removeDuplicateLabels as r };

package/dist/components/layer-table2.js

@@ -195,8 +195,13 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
    * @returns a promise that will resolve when the operation is complete
    */
   _exportToCSV() {
-    void downloadCSV([], this._layerView.layer, this._getSelectedIds(), false, // formatUsingLayerPopup
-    false, // removeDuplicates
+    const exportInfos = {};
+    exportInfos[this._layerView.layer.id] = {
+      selectionSetNames: [],
+      ids: this._getSelectedIds(),
+      layerView: this._layerView
+    };
+    void downloadCSV(exportInfos, false, // formatUsingLayerPopup
     true);
   }
   /**

package/dist/components/map-draw-tools2.js

@@ -12,7 +12,7 @@ import { d as defineCustomElement$3 } from './action.js';
 import { d as defineCustomElement$2 } from './icon.js';
 import { d as defineCustomElement$1 } from './loader.js';
 
-const mapDrawToolsCss = ":host{display:block}.border{outline:1px solid var(--calcite-ui-border-input)}.div-visible{display:inherit}.div-not-visible{display:none !important}.padding-top-1-2{padding-top:.5rem}.main-label{display:flex;float:left}html[dir=\"rtl\"] .main-label{display:flex;float:right}.margin-top-1{margin-top:1rem}.border-left{border-left:1px solid rgba(110,110,110,.3)}.border-left[dir=\"rtl\"]{border-right:1px solid rgba(110,110,110,.3)}.esri-widget{box-sizing:border-box;color:#323232;font-size:14px;font-family:\"Avenir Next\",\"Helvetica Neue\",Helvetica,Arial,sans-serif;line-height:1.3em;background-color:#fff;--esri-widget-padding-v:12px;--esri-widget-padding-h:15px;--esri-widget-padding:var(--esri-widget-padding-v) var(--esri-widget-padding-h)}.esri-sketch__panel{align-items:center;display:flex;flex-flow:row wrap;padding:0}.esri-sketch__section{align-items:center;display:flex;flex-flow:row wrap;padding:0 7px;margin:6px 0}";
+const mapDrawToolsCss = ":host{display:block}.border{outline:1px solid var(--calcite-ui-border-input)}.div-visible{display:inherit}.div-not-visible{display:none !important}.padding-top-1-2{padding-top:.5rem}.main-label{display:flex;float:left}html[dir=\"rtl\"] .main-label{display:flex;float:right}.margin-top-1{margin-top:1rem}.border-left{border-left:1px solid rgba(110,110,110,.3)}.border-left[dir=\"rtl\"]{border-right:1px solid rgba(110,110,110,.3)}.esri-widget{box-sizing:border-box;color:#323232;font-size:14px;font-family:\"Avenir Next\",\"Helvetica Neue\",Helvetica,Arial,sans-serif;line-height:1.3em;background-color:#fff;--esri-widget-padding-v:12px;--esri-widget-padding-h:15px;--esri-widget-padding:var(--esri-widget-padding-v) var(--esri-widget-padding-h)}.esri-sketch__panel{align-items:center;display:flex;flex-flow:row wrap;padding:0}.esri-sketch__section{align-items:center;display:flex;flex-flow:row wrap;padding:0 7px;margin:6px 0}.esri-sketch__section.esri-sketch__info-section>calcite-action:first-of-type{display:none}";
 
 const MapDrawTools = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {

package/dist/components/map-select-tools2.js

@@ -65,6 +65,7 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
     this.noResultText = undefined;
     this.searchConfiguration = undefined;
     this.selectionSet = undefined;
+    this.selectionLayerIds = [];
     this.selectLayerView = undefined;
     this.sketchLineSymbol = undefined;
     this.sketchPointSymbol = undefined;
@@ -207,7 +208,7 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
    */
   _getUseLayerFeaturesOptions() {
     const useLayerFeaturesClass = this._useLayerFeaturesEnabled ? "div-visible" : "div-not-visible";
-    return (h("div", null, h("div", { class: "padding-top-1 display-flex" }, h("calcite-label", { class: "label-margin-0 w-100", layout: "inline-space-between" }, h("div", { class: "tooltip-container" }, this._translations.useLayerFeatures, h("calcite-icon", { class: "padding-start-1-2 icon", icon: "question", id: "use-layer-features-icon", scale: "s" }))), h("calcite-popover", { closable: true, label: "", referenceElement: "use-layer-features-icon" }, h("span", { class: "tooltip-message" }, this._translations.useLayerFeaturesTooltip)), h("calcite-switch", { checked: this._useLayerFeaturesEnabled, onCalciteSwitchChange: () => { this._useLayerFeaturesEnabledChanged(); } })), h("div", { class: useLayerFeaturesClass + " padding-top-1" }, h("map-layer-picker", { enabledLayerIds: this.enabledLayerIds, mapView: this.mapView, onLayerSelectionChange: (evt) => { void this._layerSelectionChange(evt); }, selectedLayerIds: this.layerViews.map(l => l.layer.id), selectionMode: "single" }))));
+    return (h("div", null, h("div", { class: "padding-top-1 display-flex" }, h("calcite-label", { class: "label-margin-0 w-100", layout: "inline-space-between" }, h("div", { class: "tooltip-container" }, this._translations.useLayerFeatures, h("calcite-icon", { class: "padding-start-1-2 icon", icon: "question", id: "use-layer-features-icon", scale: "s" }))), h("calcite-popover", { closable: true, label: "", referenceElement: "use-layer-features-icon" }, h("span", { class: "tooltip-message" }, this._translations.useLayerFeaturesTooltip)), h("calcite-switch", { checked: this._useLayerFeaturesEnabled, onCalciteSwitchChange: () => { this._useLayerFeaturesEnabledChanged(); } })), h("div", { class: useLayerFeaturesClass + " padding-top-1" }, h("map-layer-picker", { enabledLayerIds: this.selectionLayerIds, mapView: this.mapView, onLayerSelectionChange: (evt) => { void this._layerSelectionChange(evt); }, selectedLayerIds: this.layerViews.map(l => l.layer.id), selectionMode: "single" }))));
   }
   /**
    * Renders the number of selected features
@@ -792,6 +793,7 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
     "noResultText": [1, "no-result-text"],
     "searchConfiguration": [1040],
     "selectionSet": [16],
+    "selectionLayerIds": [16],
     "selectLayerView": [16],
     "sketchLineSymbol": [16],
     "sketchPointSymbol": [16],

package/dist/components/pdf-download2.js

@@ -237,11 +237,8 @@ const PdfDownload = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
    * @returns Promise resolving when function is done
    */
   async downloadCSV(exportInfos, removeDuplicates, addColumnTitle = true) {
-    Object.keys(exportInfos).forEach(k => {
-      const exportInfo = exportInfos[k];
-      void downloadCSV(exportInfo.selectionSetNames, exportInfo.layerView.layer, exportInfo.ids, true, // formatUsingLayerPopup
-      removeDuplicates, addColumnTitle);
-    });
+    void downloadCSV(exportInfos, true, // formatUsingLayerPopup
+    removeDuplicates, addColumnTitle);
   }
   /**
    * Downloads pdf of mailing labels for the provided list of ids
@@ -253,10 +250,7 @@ const PdfDownload = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
    * @returns Promise resolving when function is done
    */
   async downloadPDF(exportInfos, removeDuplicates = false, title = "", initialImageDataUrl = "") {
-    Object.keys(exportInfos).forEach(k => {
-      const exportInfo = exportInfos[k];
-      void downloadPDF(exportInfo.selectionSetNames, exportInfo.layerView.layer, exportInfo.ids, this._labelInfoElement.selectedOption.value, removeDuplicates, title, initialImageDataUrl);
-    });
+    void downloadPDF(exportInfos, this._labelInfoElement.selectedOption.value, removeDuplicates, title, initialImageDataUrl);
   }
   //--------------------------------------------------------------------------
   //

package/dist/components/public-notification.js

@@ -9,6 +9,7 @@ import { l as loadModules } from './loadModules.js';
 import { g as goToSelection, h as highlightFeatures, d as defineCustomElement$5 } from './map-layer-picker2.js';
 import { s as state } from './publicNotificationStore.js';
 import { g as getLocaleComponentStrings } from './locale.js';
+import { c as consolidateLabels, r as removeDuplicateLabels } from './downloadUtils.js';
 import { d as defineCustomElement$D } from './buffer-tools2.js';
 import { d as defineCustomElement$C } from './action.js';
 import { d as defineCustomElement$B } from './action-bar.js';
@@ -79,6 +80,7 @@ const PublicNotification$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
     this._addTitle = false;
     this._downloadActive = true;
     this._exportType = EExportType.PDF;
+    this._numDuplicates = 0;
     this._pageType = EPageType.LIST;
     this._saveEnabled = false;
     this._selectionSets = [];
@@ -145,6 +147,9 @@ const PublicNotification$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
     if ((_a = this.mapView) === null || _a === void 0 ? void 0 : _a.popup) {
       this.mapView.popup.autoOpenEnabled = pageType !== EPageType.LIST ? false : this._popupsEnabled;
     }
+    if (pageType === EPageType.EXPORT) {
+      this._numDuplicates = await this._getNumDuplicates();
+    }
     this._clearHighlight();
     if (oldPageType === EPageType.SELECT || oldPageType === EPageType.REFINE) {
       // clear any draw shapes or buffers
@@ -352,7 +357,7 @@ const PublicNotification$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
         validSet = numIds > 0;
       }
       if (validSet) {
-        prev.push((h("calcite-list-item", { description: this._translations.selectedFeatures.replace("{{n}}", ids.length.toString()), label: cur.label, onClick: () => this._gotoSelection(cur, this.mapView) }, h("div", { slot: "content" }, h("div", { class: "list-label" }, cur.label), h("div", { class: "list-description" }, (_a = cur === null || cur === void 0 ? void 0 : cur.layerView) === null || _a === void 0 ? void 0 : _a.layer.title), h("div", { class: "list-description" }, this._translations.selectedFeatures.replace("{{n}}", ids.length.toString()))), this._getAction(true, "pencil", "", (evt) => this._openSelection(cur, evt), false, "actions-end"), this._getAction(true, "x", "", (evt) => this._deleteSelection(i, evt), false, "actions-end"))));
+        prev.push((h("calcite-list-item", { label: cur.label, onClick: () => this._gotoSelection(cur, this.mapView) }, h("div", { slot: "content" }, h("div", { class: "list-label" }, cur.label), h("div", { class: "list-description" }, (_a = cur === null || cur === void 0 ? void 0 : cur.layerView) === null || _a === void 0 ? void 0 : _a.layer.title), h("div", { class: "list-description" }, this._translations.selectedFeatures.replace("{{n}}", ids.length.toString()))), this._getAction(true, "pencil", "", (evt) => this._openSelection(cur, evt), false, "actions-end"), this._getAction(true, "x", "", (evt) => this._deleteSelection(i, evt), false, "actions-end"))));
       }
       return prev;
     }, []))));
@@ -388,39 +393,67 @@ const PublicNotification$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
     return validateRefineSet && hasRefineSet ? ids.length > 0 || this._selectionSets.length > 1 : this._selectionSets.length > 0;
   }
   /**
-   * Check if any duplicates exist
+   * Check if any duplicate labels exist
    *
    * @returns true if duplicates are found
    *
    * @protected
    */
-  _hasDuplicates() {
-    const selectedIds = this._getSelectedIds();
-    return this._getNumDuplicates(selectedIds) > 0;
+  async _getNumDuplicates() {
+    const exportInfos = this._getExportInfos();
+    const labels = await consolidateLabels(exportInfos);
+    const duplicatesRemoved = removeDuplicateLabels(labels);
+    return labels.length - duplicatesRemoved.length;
   }
   /**
-   * Return the number of duplicates
-   *
-   * @param ids the list of currently selected ids
+   * Get key details about what to export
    *
-   * @returns the number of duplicates
+   * @returns IExportInfos that contain ids and layer
    *
    * @protected
    */
-  _getNumDuplicates(ids) {
-    return ids.length - new Set(ids).size;
+  _getExportInfos() {
+    return this._selectionSets.reduce((prev, cur) => {
+      if (cur.download) {
+        if (cur.workflowType !== EWorkflowType.REFINE) {
+          const id = cur.layerView.layer.id;
+          this._updateIds(id, cur.layerView, cur.selectedIds, prev);
+        }
+        else {
+          // REFINE stores ids differently as it can contain ids from multiple layers
+          // REFINE will only ever be 1 ISelectionSet
+          Object.keys(cur.refineInfos).forEach(k => {
+            const refineIds = cur.refineInfos[k];
+            this._updateIds(k, refineIds.layerView, refineIds.addIds, prev);
+          });
+        }
+      }
+      return prev;
+    }, {});
   }
   /**
-   * Get the complete list of selected ids
+   * Consolidate ids for each layer
    *
-   * @returns all currently selected IDs
+   * @param id the layer id from the selectionSet
+   * @param layerView the layerView from the selectionSet
+   * @param ids the selectedIds from the selectionSet
+   * @param obj the object that will store the consolidated ids and layer info
+   *
+   * @returns IExportInfo key details that will be used for export
    *
    * @protected
    */
-  _getSelectedIds() {
-    return this._selectionSets.reduce((prev, cur) => {
-      return prev.concat(cur.download ? cur.selectedIds : []);
-    }, []);
+  _updateIds(id, layerView, ids, obj) {
+    if (obj[id]) {
+      obj[id].ids = obj[id].ids.concat(ids);
+    }
+    else {
+      obj[id] = {
+        layerView,
+        ids
+      };
+    }
+    return obj;
   }
   /**
    * Create the Select page that shows the selection workflows
@@ -430,7 +463,7 @@ const PublicNotification$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
    */
   _getSelectPage() {
     const noticeText = this._translations.selectSearchTip;
-    return (h("calcite-panel", null, this._getLabel(this._translations.stepTwoFull, true), this._getNotice(noticeText), h("div", { class: "padding-top-1" }, h("map-select-tools", { bufferColor: this.bufferColor, bufferOutlineColor: this.bufferOutlineColor, class: "font-bold", customLabelEnabled: this.customLabelEnabled, defaultBufferDistance: this.defaultBufferDistance, defaultBufferUnit: this.defaultBufferUnit, enabledLayerIds: this.selectionLayerIds, isUpdate: !!this._activeSelection, mapView: this.mapView, noResultText: this.noResultText, onSelectionSetChange: (evt) => this._updateForSelection(evt), ref: (el) => { this._selectTools = el; }, searchConfiguration: this._searchConfiguration, selectionSet: this._activeSelection, sketchLineSymbol: this.sketchLineSymbol, sketchPointSymbol: this.sketchPointSymbol, sketchPolygonSymbol: this.sketchPolygonSymbol })), this._getPageNavButtons(this._translations.done, this._numSelected === 0, () => { void this._saveSelection(); }, this._translations.cancel, false, () => { void this._home(); })));
+    return (h("calcite-panel", null, this._getLabel(this._translations.stepTwoFull, true), this._getNotice(noticeText), h("div", null, h("map-select-tools", { bufferColor: this.bufferColor, bufferOutlineColor: this.bufferOutlineColor, class: "font-bold", customLabelEnabled: this.customLabelEnabled, defaultBufferDistance: this.defaultBufferDistance, defaultBufferUnit: this.defaultBufferUnit, enabledLayerIds: this.addresseeLayerIds, isUpdate: !!this._activeSelection, mapView: this.mapView, noResultText: this.noResultText, onSelectionSetChange: (evt) => this._updateForSelection(evt), ref: (el) => { this._selectTools = el; }, searchConfiguration: this._searchConfiguration, selectionLayerIds: this.selectionLayerIds, selectionSet: this._activeSelection, sketchLineSymbol: this.sketchLineSymbol, sketchPointSymbol: this.sketchPointSymbol, sketchPolygonSymbol: this.sketchPolygonSymbol })), this._getPageNavButtons(this._translations.done, this._numSelected === 0, () => { void this._saveSelection(); }, this._translations.cancel, false, () => { void this._home(); })));
   }
   /**
    * Create the main download page that has the shared aspects of both PDF and CSV
@@ -441,8 +474,8 @@ const PublicNotification$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
    */
   _getExportPage() {
     const hasSelections = this._hasSelections(this.showRefineSelection);
-    const numDuplicates = this._getNumDuplicates(this._getSelectedIds());
-    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.myLists), this._getExportSelectionLists(), h("div", { class: "padding-sides-1" }, 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}}", numDuplicates.toString())}`))))), h("div", { class: "border-bottom" }), h("div", { class: "padding-top-sides-1" }, h("calcite-segmented-control", { class: "w-100", onCalciteSegmentedControlChange: (evt) => this._exportTypeChange(evt) }, h("calcite-segmented-control-item", { checked: this._exportType === EExportType.PDF, class: "w-50 end-border", value: EExportType.PDF }, this._translations.pdf), h("calcite-segmented-control-item", { checked: this._exportType === EExportType.CSV, class: "w-50", value: EExportType.CSV }, this._translations.csv))), h("div", { class: "padding-bottom-1" }, this._getExportOptions()), h("div", { class: "padding-1 display-flex" }, h("calcite-button", { disabled: !this._downloadActive, onClick: () => void this._export(), width: "full" }, this._translations.export)))) : (this._getNotice(this._translations.downloadNoLists, "padding-sides-1 padding-bottom-1")))));
+    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) }, h("calcite-segmented-control-item", { checked: this._exportType === EExportType.PDF, class: "w-50 end-border", value: EExportType.PDF }, this._translations.pdf), h("calcite-segmented-control-item", { checked: this._exportType === EExportType.CSV, class: "w-50", value: EExportType.CSV }, this._translations.csv))), h("div", { class: "padding-bottom-1" }, this._getExportOptions()), h("div", { class: "padding-1 display-flex" }, h("calcite-button", { disabled: !this._downloadActive, onClick: () => void this._export(), width: "full" }, this._translations.export)))) : (this._getNotice(this._translations.downloadNoLists, "padding-sides-1 padding-bottom-1")))));
   }
   /**
    * Store the user selected export type CSV || PDF
@@ -522,13 +555,14 @@ const PublicNotification$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
    */
   _getExportSelectionLists() {
     return this._selectionSets.reduce((prev, cur) => {
+      var _a;
       const ids = this._getSelectionSetIds(cur);
       const validSet = cur.workflowType !== EWorkflowType.REFINE || ids.length > 0;
       if (!this._downloadActive && cur.download && validSet) {
         this._downloadActive = true;
       }
       if (validSet) {
-        prev.push((h("div", { class: "display-flex padding-sides-1 padding-bottom-1" }, h("calcite-checkbox", { checked: cur.download, class: "align-center", onClick: () => { void this._toggleDownload(cur.id); } }), h("calcite-list", { class: "list-border margin-start-1-2 width-full", id: "download-list" }, h("calcite-list-item", { description: this._translations.selectedFeatures.replace("{{n}}", ids.length.toString()), disabled: !cur.download, label: cur.label, onClick: () => { void this._toggleDownload(cur.id); } })))));
+        prev.push((h("div", { class: "display-flex padding-sides-1 padding-bottom-1" }, h("calcite-checkbox", { checked: cur.download, class: "align-center", onClick: () => { void this._toggleDownload(cur.id); } }), h("calcite-list", { class: "list-border margin-start-1-2 width-full", id: "download-list" }, h("calcite-list-item", { disabled: !cur.download, label: cur.label, onClick: () => { void this._toggleDownload(cur.id); } }, h("div", { slot: "content" }, h("div", { class: "list-label" }, cur.label), h("div", { class: "list-description" }, (_a = cur === null || cur === void 0 ? void 0 : cur.layerView) === null || _a === void 0 ? void 0 : _a.layer.title), h("div", { class: "list-description" }, this._translations.selectedFeatures.replace("{{n}}", ids.length.toString()))))))));
       }
       return prev;
     }, []) || (h("div", null));
@@ -548,6 +582,7 @@ const PublicNotification$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
       return ss;
     });
     this._downloadActive = isActive;
+    this._numDuplicates = await this._getNumDuplicates();
     await this._highlightFeatures();
   }
   /**
@@ -811,6 +846,7 @@ const PublicNotification$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
     "_addTitle": [32],
     "_downloadActive": [32],
     "_exportType": [32],
+    "_numDuplicates": [32],
     "_pageType": [32],
     "_saveEnabled": [32],
     "_selectionSets": [32],

package/dist/components/refine-selection2.js

@@ -9,17 +9,19 @@ import { b as getMapLayerView, c as getIdSets, e as highlightAllFeatures, d as d
 import { c as queryFeaturesByGeometry } from './queryUtils.js';
 import { s as state } from './publicNotificationStore.js';
 import { g as getLocaleComponentStrings } from './locale.js';
-import { d as defineCustomElement$i } from './action.js';
-import { d as defineCustomElement$h } from './chip.js';
-import { d as defineCustomElement$g } from './combobox.js';
-import { d as defineCustomElement$f } from './combobox-item.js';
-import { d as defineCustomElement$e } from './filter.js';
-import { d as defineCustomElement$d } from './icon.js';
-import { d as defineCustomElement$c } from './input.js';
-import { d as defineCustomElement$b } from './list.js';
-import { d as defineCustomElement$a } from './list-item2.js';
-import { d as defineCustomElement$9 } from './loader.js';
-import { d as defineCustomElement$8 } from './option.js';
+import { d as defineCustomElement$k } from './action.js';
+import { d as defineCustomElement$j } from './chip.js';
+import { d as defineCustomElement$i } from './combobox.js';
+import { d as defineCustomElement$h } from './combobox-item.js';
+import { d as defineCustomElement$g } from './filter.js';
+import { d as defineCustomElement$f } from './icon.js';
+import { d as defineCustomElement$e } from './input.js';
+import { d as defineCustomElement$d } from './label.js';
+import { d as defineCustomElement$c } from './list.js';
+import { d as defineCustomElement$b } from './list-item2.js';
+import { d as defineCustomElement$a } from './loader.js';
+import { d as defineCustomElement$9 } from './option.js';
+import { d as defineCustomElement$8 } from './popover.js';
 import { d as defineCustomElement$7 } from './progress.js';
 import { d as defineCustomElement$6 } from './scrim.js';
 import { d as defineCustomElement$5 } from './segmented-control.js';
@@ -27,7 +29,7 @@ import { d as defineCustomElement$4 } from './segmented-control-item.js';
 import { d as defineCustomElement$3 } from './select.js';
 import { d as defineCustomElement$2 } from './map-draw-tools2.js';
 
-const refineSelectionCss = ":host{display:block}.div-visible{display:inherit}.div-not-visible{display:none !important}.padding-top-1-2{padding-top:.5rem}.main-label{display:flex;float:left}html[dir=\"rtl\"] .main-label{display:flex;float:right}.border{outline:1px solid var(--calcite-ui-border-input)}.margin-top-1{margin-top:1rem}.esri-sketch{display:flex;flex-flow:column wrap}.esri-widget{box-sizing:border-box;color:#323232;font-size:14px;font-family:\"Avenir Next\",\"Helvetica Neue\",Helvetica,Arial,sans-serif;line-height:1.3em;background-color:var(--calcite-ui-foreground-1)}.esri-sketch__panel{align-items:center;display:flex;flex-flow:row nowrap;padding:0}*/ .esri-sketch__tool-section{border-right:1px solid rgba(110,110,110,.3)}.esri-sketch__section{align-items:center;display:flex;flex-flow:row nowrap;padding:0 7px;margin:6px 0;border-right:1px solid rgba(110,110,110,.3)}";
+const refineSelectionCss = ":host{display:block}.div-visible{display:inherit}.div-not-visible{display:none !important}.padding-top-1-2{padding-top:.5rem}.main-label{display:flex;float:left}html[dir=\"rtl\"] .main-label{display:flex;float:right}.border{outline:1px solid var(--calcite-ui-border-input)}.margin-top-1{margin-top:1rem}.esri-sketch{display:flex;flex-flow:column wrap}.esri-widget{box-sizing:border-box;color:#323232;font-size:14px;font-family:\"Avenir Next\",\"Helvetica Neue\",Helvetica,Arial,sans-serif;line-height:1.3em;background-color:var(--calcite-ui-foreground-1)}.esri-sketch__panel{align-items:center;display:flex;flex-flow:row nowrap;padding:0}*/ .esri-sketch__tool-section{border-right:1px solid rgba(110,110,110,.3)}.esri-sketch__section{align-items:center;display:flex;flex-flow:row nowrap;padding:0 7px;margin:6px 0;border-right:1px solid rgba(110,110,110,.3)}.display-flex{display:flex}.font-bold{font-weight:bold}.width-full{width:100%}.label-margin-0{--calcite-label-margin-bottom:0}.padding-start-1-2{-webkit-padding-start:0.5rem;padding-inline-start:0.5rem}";
 
 const RefineSelection = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
@@ -86,7 +88,7 @@ const RefineSelection = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
   render() {
     var _a, _b;
     const layerPickerClass = this._enabledLayerIds.length > 1 ? "display-block" : "display-none";
-    return (h(Host, null, h("div", { class: layerPickerClass + " padding-top-sides-1" }, h("map-layer-picker", { enabledLayerIds: this._enabledLayerIds, mapView: this.mapView, onLayerSelectionChange: (evt) => { void this._layerSelectionChange(evt); }, ref: (el) => { this._layerPicker = el; }, selectedLayerIds: [this._refineLayer.layer.id], selectionMode: "single" })), h("div", { class: "padding-1" }, h("div", { class: "padding-bottom-1" }, h("calcite-segmented-control", { class: "w-100" }, h("calcite-segmented-control-item", { checked: this._addEnabled, class: "w-50", onClick: () => this._setSelectionMode(ESelectionMode.ADD), value: ESelectionMode.ADD }, this._translations.add), h("calcite-segmented-control-item", { checked: !this._addEnabled, class: "w-50", onClick: () => this._setSelectionMode(ESelectionMode.REMOVE), value: ESelectionMode.REMOVE }, this._translations.remove))), h("div", null, h("map-draw-tools", { active: true, drawMode: EDrawMode.REFINE, mapView: this.mapView, onDrawRedo: () => this._redo(), onDrawUndo: () => this._undo(), onSketchGraphicsChange: (evt) => this._sketchGraphicsChanged(evt), pointSymbol: this.sketchPointSymbol, polygonSymbol: this.sketchPolygonSymbol, polylineSymbol: this.sketchLineSymbol, redoEnabled: ((_a = this._refineSelectionSet) === null || _a === void 0 ? void 0 : _a.redoStack.length) > 0, ref: (el) => { this._drawTools = el; }, undoEnabled: ((_b = this._refineSelectionSet) === null || _b === void 0 ? void 0 : _b.undoStack.length) > 0 })), h("br", null), (h("calcite-list", { class: "list-border" }, this._getRefineSelectionSetList())))));
+    return (h(Host, null, h("div", { class: layerPickerClass + " padding-top-sides-1" }, h("div", { class: "display-flex" }, h("calcite-label", { class: "font-bold width-full label-margin-0" }, h("div", { class: "display-flex" }, this._translations.inputLayer, h("calcite-icon", { class: "padding-start-1-2 icon", icon: "question", id: "refine-input-layer", scale: "s" })), h("map-layer-picker", { enabledLayerIds: this._enabledLayerIds, mapView: this.mapView, onLayerSelectionChange: (evt) => { void this._layerSelectionChange(evt); }, ref: (el) => { this._layerPicker = el; }, selectedLayerIds: [this._refineLayer.layer.id], selectionMode: "single" })), h("calcite-popover", { closable: true, label: "", referenceElement: "refine-input-layer" }, h("span", { class: "tooltip-message" }, this._translations.inputLayerTip)))), h("div", { class: "padding-1" }, h("div", { class: "padding-bottom-1" }, h("calcite-segmented-control", { class: "w-100" }, h("calcite-segmented-control-item", { checked: this._addEnabled, class: "w-50", onClick: () => this._setSelectionMode(ESelectionMode.ADD), value: ESelectionMode.ADD }, this._translations.add), h("calcite-segmented-control-item", { checked: !this._addEnabled, class: "w-50", onClick: () => this._setSelectionMode(ESelectionMode.REMOVE), value: ESelectionMode.REMOVE }, this._translations.remove))), h("div", null, h("map-draw-tools", { active: true, drawMode: EDrawMode.REFINE, mapView: this.mapView, onDrawRedo: () => this._redo(), onDrawUndo: () => this._undo(), onSketchGraphicsChange: (evt) => this._sketchGraphicsChanged(evt), pointSymbol: this.sketchPointSymbol, polygonSymbol: this.sketchPolygonSymbol, polylineSymbol: this.sketchLineSymbol, redoEnabled: ((_a = this._refineSelectionSet) === null || _a === void 0 ? void 0 : _a.redoStack.length) > 0, ref: (el) => { this._drawTools = el; }, undoEnabled: ((_b = this._refineSelectionSet) === null || _b === void 0 ? void 0 : _b.undoStack.length) > 0 })), h("br", null), (h("calcite-list", { class: "list-border" }, this._getRefineSelectionSetList())))));
   }
   //--------------------------------------------------------------------------
   //
@@ -432,7 +434,7 @@ function defineCustomElement() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["refine-selection", "calcite-action", "calcite-chip", "calcite-combobox", "calcite-combobox-item", "calcite-filter", "calcite-icon", "calcite-input", "calcite-list", "calcite-list-item", "calcite-loader", "calcite-option", "calcite-progress", "calcite-scrim", "calcite-segmented-control", "calcite-segmented-control-item", "calcite-select", "map-draw-tools", "map-layer-picker"];
+  const components = ["refine-selection", "calcite-action", "calcite-chip", "calcite-combobox", "calcite-combobox-item", "calcite-filter", "calcite-icon", "calcite-input", "calcite-label", "calcite-list", "calcite-list-item", "calcite-loader", "calcite-option", "calcite-popover", "calcite-progress", "calcite-scrim", "calcite-segmented-control", "calcite-segmented-control-item", "calcite-select", "map-draw-tools", "map-layer-picker"];
   components.forEach(tagName => { switch (tagName) {
     case "refine-selection":
       if (!customElements.get(tagName)) {
@@ -441,55 +443,65 @@ function defineCustomElement() {
       break;
     case "calcite-action":
       if (!customElements.get(tagName)) {
-        defineCustomElement$i();
+        defineCustomElement$k();
       }
       break;
     case "calcite-chip":
       if (!customElements.get(tagName)) {
-        defineCustomElement$h();
+        defineCustomElement$j();
       }
       break;
     case "calcite-combobox":
       if (!customElements.get(tagName)) {
-        defineCustomElement$g();
+        defineCustomElement$i();
       }
       break;
     case "calcite-combobox-item":
       if (!customElements.get(tagName)) {
-        defineCustomElement$f();
+        defineCustomElement$h();
       }
       break;
     case "calcite-filter":
       if (!customElements.get(tagName)) {
-        defineCustomElement$e();
+        defineCustomElement$g();
       }
       break;
     case "calcite-icon":
       if (!customElements.get(tagName)) {
-        defineCustomElement$d();
+        defineCustomElement$f();
       }
       break;
     case "calcite-input":
       if (!customElements.get(tagName)) {
-        defineCustomElement$c();
+        defineCustomElement$e();
+      }
+      break;
+    case "calcite-label":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$d();
       }
       break;
     case "calcite-list":
       if (!customElements.get(tagName)) {
-        defineCustomElement$b();
+        defineCustomElement$c();
       }
       break;
     case "calcite-list-item":
       if (!customElements.get(tagName)) {
-        defineCustomElement$a();
+        defineCustomElement$b();
       }
       break;
     case "calcite-loader":
       if (!customElements.get(tagName)) {
-        defineCustomElement$9();
+        defineCustomElement$a();
       }
       break;
     case "calcite-option":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$9();
+      }
+      break;
+    case "calcite-popover":
       if (!customElements.get(tagName)) {
         defineCustomElement$8();
       }

package/dist/esm/buffer-tools_4.entry.js

@@ -22,7 +22,7 @@ import './resources-e83f65b3.js';
 import './observers-81c91acd.js';
 import './index-4c4a4f3d.js';
 
-const bufferToolsCss = ":host{display:block}.c-container{display:inline-flex}.flex-1{flex:\"1\"}.padding-end-1{-webkit-padding-end:1rem;padding-inline-end:1rem}";
+const bufferToolsCss = ":host{display:block}.c-container{display:inline-flex}.flex-1{flex:\"1\"}.padding-end-1{-webkit-padding-end:1rem;padding-inline-end:1rem}.w-50{width:50%}";
 
 const BufferTools = class {
   constructor(hostRef) {
@@ -181,7 +181,7 @@ const BufferTools = class {
    * @protected
    */
   _getTextBoxDisplay() {
-    return (h("div", { class: "c-container" }, h("calcite-input", { class: "padding-end-1", max: this.max && this.max > 0 ? this.max : undefined, min: this.min, "number-button-type": "vertical", onCalciteInputInput: (evt) => this._setDistance(evt), placeholder: "0", type: "number", value: this.distance ? this.distance.toString() : undefined }), h("calcite-select", { class: "flex-1", label: "label", onCalciteSelectChange: () => this._setUnit(this._unitElement.value), ref: (el) => { this._unitElement = el; } }, this._getUnits())));
+    return (h("div", { class: "c-container" }, h("calcite-input", { class: "padding-end-1 w-50", max: this.max && this.max > 0 ? this.max : undefined, min: this.min, "number-button-type": "vertical", onCalciteInputInput: (evt) => this._setDistance(evt), placeholder: "0", type: "number", value: this.distance ? this.distance.toString() : undefined }), h("calcite-select", { class: "flex-1 w-50", label: "label", onCalciteSelectChange: () => this._setUnit(this._unitElement.value), ref: (el) => { this._unitElement = el; } }, this._getUnits())));
   }
   /**
    * Render distance control as a slider
@@ -1122,7 +1122,7 @@ const Slider = class {
 };
 Slider.style = sliderCss;
 
-const mapDrawToolsCss = ":host{display:block}.border{outline:1px solid var(--calcite-ui-border-input)}.div-visible{display:inherit}.div-not-visible{display:none !important}.padding-top-1-2{padding-top:.5rem}.main-label{display:flex;float:left}html[dir=\"rtl\"] .main-label{display:flex;float:right}.margin-top-1{margin-top:1rem}.border-left{border-left:1px solid rgba(110,110,110,.3)}.border-left[dir=\"rtl\"]{border-right:1px solid rgba(110,110,110,.3)}.esri-widget{box-sizing:border-box;color:#323232;font-size:14px;font-family:\"Avenir Next\",\"Helvetica Neue\",Helvetica,Arial,sans-serif;line-height:1.3em;background-color:#fff;--esri-widget-padding-v:12px;--esri-widget-padding-h:15px;--esri-widget-padding:var(--esri-widget-padding-v) var(--esri-widget-padding-h)}.esri-sketch__panel{align-items:center;display:flex;flex-flow:row wrap;padding:0}.esri-sketch__section{align-items:center;display:flex;flex-flow:row wrap;padding:0 7px;margin:6px 0}";
+const mapDrawToolsCss = ":host{display:block}.border{outline:1px solid var(--calcite-ui-border-input)}.div-visible{display:inherit}.div-not-visible{display:none !important}.padding-top-1-2{padding-top:.5rem}.main-label{display:flex;float:left}html[dir=\"rtl\"] .main-label{display:flex;float:right}.margin-top-1{margin-top:1rem}.border-left{border-left:1px solid rgba(110,110,110,.3)}.border-left[dir=\"rtl\"]{border-right:1px solid rgba(110,110,110,.3)}.esri-widget{box-sizing:border-box;color:#323232;font-size:14px;font-family:\"Avenir Next\",\"Helvetica Neue\",Helvetica,Arial,sans-serif;line-height:1.3em;background-color:#fff;--esri-widget-padding-v:12px;--esri-widget-padding-h:15px;--esri-widget-padding:var(--esri-widget-padding-v) var(--esri-widget-padding-h)}.esri-sketch__panel{align-items:center;display:flex;flex-flow:row wrap;padding:0}.esri-sketch__section{align-items:center;display:flex;flex-flow:row wrap;padding:0 7px;margin:6px 0}.esri-sketch__section.esri-sketch__info-section>calcite-action:first-of-type{display:none}";
 
 const MapDrawTools = class {
   constructor(hostRef) {