@esri/solutions-components 0.6.9 → 0.6.10

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

@@ -153,7 +153,11 @@ export class LayerTable {
     const tableNodeClass = this._fetchingData ? "display-none" : "";
     const loadingClass = this._fetchingData ? "" : "display-none";
     const alertActionClass = this._alertShowAction ? "" : "display-none";
-    return (h(Host, null, h("calcite-shell", null, this._getTableControlRow("header"), h("div", { class: "height-full width-full" }, h("calcite-panel", { class: "height-full width-full" }, h("calcite-loader", { class: loadingClass, label: this._translations.fetchingData, scale: "l" }), h("div", { class: tableNodeClass, ref: this.onTableNodeCreate }))), h("calcite-alert", { icon: this._alertIcon, kind: this._alertKind, label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { slot: "title" }, this._alertTitle), h("div", { slot: "message" }, this._alertMessage), h("calcite-link", { class: alertActionClass, onClick: this._alertActionFunction, slot: "link" }, this._alertActionText)))));
+    const total = this._allIds.length.toString();
+    const selected = this._selectedIndexes.length.toString();
+    return (h(Host, null, h("calcite-shell", null, this._getTableControlRow("header"), h("div", { class: "height-full width-full" }, h("calcite-panel", { class: "height-full width-full" }, h("calcite-loader", { class: loadingClass, label: this._translations.fetchingData, scale: "l" }), h("div", { class: tableNodeClass, ref: this.onTableNodeCreate })), h("div", { class: "bottom-left background text-color" }, this._translations.recordsSelected
+      .replace("{{total}}", total)
+      .replace("{{selected}}", selected))), h("calcite-alert", { icon: this._alertIcon, kind: this._alertKind, label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { slot: "title" }, this._alertTitle), h("div", { slot: "message" }, this._alertMessage), h("calcite-link", { class: alertActionClass, onClick: this._alertActionFunction, slot: "link" }, this._alertActionText)))));
   }
   //--------------------------------------------------------------------------
   //

package/dist/collection/components/map-card/map-card.css

@@ -23,10 +23,3 @@
 .map-height {
   height: calc(100% - 58px);
 }
-
-/* Not sure how else to do this
-  tried navigation gamepad settings but enabled: false still shows this */
-
-.esri-zoom {
-  display: none !important;
-}

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

@@ -73,12 +73,14 @@ export class MapCard {
    * @protected
    */
   async _initModules() {
-    const [WebMap, MapView] = await loadModules([
+    const [WebMap, MapView, Home] = await loadModules([
       "esri/WebMap",
-      "esri/views/MapView"
+      "esri/views/MapView",
+      "esri/widgets/Home"
     ]);
     this.WebMap = WebMap;
     this.MapView = MapView;
+    this.Home = Home;
   }
   /**
    * Load the webmap for the provided webMapInfo
@@ -104,13 +106,17 @@ export class MapCard {
         map: webMap,
         resizeAlign: "top-left"
       });
+      this._loadedId = id;
+      this._searchConfiguration = this._webMapInfo.searchConfiguration;
+      this.mapChanged.emit({
+        id: id,
+        mapView: this.mapView
+      });
       await this.mapView.when(() => {
-        this._loadedId = id;
-        this._searchConfiguration = this._webMapInfo.searchConfiguration;
-        this.mapChanged.emit({
-          id: id,
-          mapView: this.mapView
+        const home = new this.Home({
+          view: this.mapView
         });
+        this.mapView.ui.add(home, { position: "top-left", index: 3 });
         this.mapView.ui.add(this._mapTools, { position: "top-right", index: 0 });
       });
     }

package/dist/collection/components/map-picker/map-picker.css

@@ -49,7 +49,7 @@
   overflow: hidden;
   animation: calcite-scrim-fade-in var(--calcite-internal-animation-timing-medium) ease-in-out;
   background-color: var(--calcite-scrim-background);
-  z-index: 1;
+  z-index: 1000;
   width: 100%;
   height: -moz-fit-content;
   height: fit-content;
@@ -58,3 +58,7 @@
 .display-none {
   display: none;
 }
+
+.action-bar-color {
+  background-color: var(--calcite-ui-border-3) !important;
+}

package/dist/collection/components/map-picker/map-picker.js

@@ -95,7 +95,7 @@ export class MapPicker {
   _getMapPicker() {
     var _a;
     const mapListIcon = this._mapListExpanded ? "chevron-up" : "chevron-down";
-    return (h("calcite-button", { alignment: "icon-end-space-between", appearance: "solid", class: "width-full height-full", iconEnd: mapListIcon, kind: "neutral", onClick: () => this._chooseMap(), width: "full" }, (_a = this._webMapInfo) === null || _a === void 0 ? void 0 : _a.name));
+    return (h("calcite-button", { alignment: "icon-end-space-between", appearance: "transparent", class: "width-full height-full", iconEnd: mapListIcon, kind: "neutral", onClick: () => this._chooseMap(), width: "full" }, (_a = this._webMapInfo) === null || _a === void 0 ? void 0 : _a.name));
   }
   /**
    * Create the toolbar (controls used for map and app interactions)
@@ -105,7 +105,7 @@ export class MapPicker {
    * @protected
    */
   _getToolbar() {
-    return (h("div", { class: "display-flex" }, h("calcite-action-bar", { class: "border-bottom-1 action-bar-size", "expand-disabled": true, layout: "horizontal", slot: "header" }, this._getMapPicker())));
+    return (h("div", { class: "display-flex" }, h("calcite-action-bar", { class: "action-bar-color border-bottom-1 action-bar-size", "expand-disabled": true, layout: "horizontal", slot: "header" }, this._getMapPicker())));
   }
   /**
    * Get a pick list for all maps in mapInfos

package/dist/collection/components/map-tools/map-tools.css

@@ -29,3 +29,17 @@
 .margin-top-1-2 {
   margin-top: 0.5rem;
 }
+
+.square-40 {
+  width: 40px;
+  height: 40px;
+}
+
+.width-40 {
+  width: 40px;
+}
+
+.square-40-41 {
+  width: 40px;
+  height: 41px;
+}

package/dist/collection/components/map-tools/map-tools.js

@@ -37,14 +37,6 @@ export class MapTools {
   //  Watch handlers
   //
   //--------------------------------------------------------------------------
-  /**
-   * Store the home extent when the map view changes
-   */
-  async mapViewWatchHandler() {
-    await this.mapView.when(() => {
-      this._homeExtent = this.mapView.extent;
-    });
-  }
   /**
    * When the _showBasemapWidget property is true display the basemap gallery
    */
@@ -107,7 +99,7 @@ export class MapTools {
     const searchClass = this._showSearchWidget ? "" : "display-none";
     const basemapClass = this._showBasemapWidget ? "" : "display-none";
     const legendClass = this._showLegendWidget ? "" : "display-none";
-    return (h(Host, null, h("div", null, h("calcite-action", { alignment: "center", class: "border", compact: false, icon: toggleIcon, onClick: () => { this._toggleTools(); }, text: "" }), h("calcite-action-bar", { class: `border margin-top-1-2 ${toolsClass}`, "expand-disabled": true, layout: this.layout }, this._getActionGroup("home", false, this._translations.home, () => void this._goHome()), this._getActionGroup("plus", false, this._translations.zoomIn, () => void this._zoomIn()), this._getActionGroup("minus", false, this._translations.zoomOut, () => void this._zoomOut()), this._getActionGroup("legend", false, this._translations.legend, () => this._showLegend()), this._getActionGroup("magnifying-glass", false, this._translations.search, () => this._search()), this._getActionGroup("expand", false, this._translations.expand, () => this._expand()), this._getActionGroup("basemap", false, this._translations.basemap, () => this._toggleBasemapPicker()))), h("basemap-gallery", { class: basemapClass, mapView: this.mapView, ref: (el) => { this._basemapElement = el; } }), h("map-search", { class: searchClass, mapView: this.mapView, ref: (el) => { this._searchElement = el; }, searchConfiguration: this.searchConfiguration }), h("map-legend", { class: legendClass, mapView: this.mapView, ref: (el) => { this._legendElement = el; } })));
+    return (h(Host, null, h("div", null, h("calcite-action", { alignment: "center", class: "border square-40", compact: false, icon: toggleIcon, onClick: () => { this._toggleTools(); }, scale: "s", text: "" }), h("calcite-action-bar", { class: `width-40 border margin-top-1-2 ${toolsClass}`, "expand-disabled": true, layout: this.layout }, this._getActionGroup("legend", false, this._translations.legend, () => this._showLegend()), this._getActionGroup("magnifying-glass", false, this._translations.search, () => this._search()), this._getActionGroup("expand", false, this._translations.expand, () => this._expand()), this._getActionGroup("basemap", false, this._translations.basemap, () => this._toggleBasemapPicker()))), h("basemap-gallery", { class: basemapClass, mapView: this.mapView, ref: (el) => { this._basemapElement = el; } }), h("map-search", { class: searchClass, mapView: this.mapView, ref: (el) => { this._searchElement = el; }, searchConfiguration: this.searchConfiguration }), h("map-legend", { class: legendClass, mapView: this.mapView, ref: (el) => { this._legendElement = el; } })));
   }
   //--------------------------------------------------------------------------
   //
@@ -127,17 +119,7 @@ export class MapTools {
    * @protected
    */
   _getActionGroup(icon, disabled, tip, func) {
-    return (h("calcite-action-group", null, h("calcite-action", { alignment: "center", compact: false, disabled: disabled, icon: icon, id: icon, onClick: func, text: "" }, h("calcite-icon", { icon: "cheveron-up", scale: "s", slot: "icon" })), h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": icon }, h("span", null, tip))));
-  }
-  /**
-   * Go to the exent that was first used when loading the map
-   *
-   * @returns void
-   *
-   * @protected
-   */
-  async _goHome() {
-    await this.mapView.goTo(this._homeExtent);
+    return (h("calcite-action-group", { class: "square-40-41" }, h("calcite-action", { alignment: "center", class: "square-40", compact: false, disabled: disabled, icon: icon, id: icon, onClick: func, scale: "s", text: "" }, h("calcite-icon", { icon: "cheveron-up", scale: "s", slot: "icon" })), h("calcite-tooltip", { label: "", placement: "trailing", "reference-element": icon }, h("span", null, tip))));
   }
   // need to discuss this with the team
   _showLegend() {
@@ -149,42 +131,6 @@ export class MapTools {
     this._showSearchWidget = !this._showSearchWidget;
     this._showTools = false;
   }
-  /**
-   * Fixed zoom in
-   *
-   * @returns void
-   *
-   * @protected
-   */
-  async _zoomIn() {
-    await this._zoom(this.mapView.zoom + 1);
-  }
-  /**
-   * Fixed zoom out
-   *
-   * @returns void
-   *
-   * @protected
-   */
-  async _zoomOut() {
-    await this._zoom(this.mapView.zoom - 1);
-  }
-  /**
-   * Zoom in/out at the maps current center point
-   *
-   * @param zoom Number to zoom level to go to
-   *
-   * @returns void
-   *
-   * @protected
-   */
-  async _zoom(zoom) {
-    var _a;
-    await ((_a = this.mapView) === null || _a === void 0 ? void 0 : _a.goTo({
-      target: this.mapView.center,
-      zoom
-    }));
-  }
   /**
    * Show/Hide the basemap picker
    *
@@ -342,9 +288,6 @@ export class MapTools {
   static get elementRef() { return "el"; }
   static get watchers() {
     return [{
-        "propName": "mapView",
-        "methodName": "mapViewWatchHandler"
-      }, {
         "propName": "_showBasemapWidget",
         "methodName": "_showBasemapWidgetWatchHandler"
       }, {

package/dist/collection/utils/downloadUtils.js

@@ -324,8 +324,8 @@ export function _getFieldNamesFromFieldExpressions(fieldExpressions) {
  * all attributes are exported
  * @param attributeFormats Empty object to hold the formats for each attribute in a feature; the object is filled
  * with formats by this function
- * @returns A Promise resolving to the format of a single label, e.g., for ILabelFormat type "pattern":
- * "{NAME}|{STREET}|{CITY}, {STATE} {ZIP}"
+ * @returns A Promise resolving to the format of a single label with fields coerced to lowercase, e.g.,
+ * for ILabelFormat type "pattern": "{name}|{street}|{city}, {state} {zip}"
  */
 export async function _getLabelFormat(layer, formatUsingLayerPopup, attributeFormats) {
   var _a, _b, _c, _d, _e, _f;
@@ -338,7 +338,7 @@ export async function _getLabelFormat(layer, formatUsingLayerPopup, attributeFor
     // Extract any format info that we have
     fieldInfo => {
       if (fieldInfo.format) {
-        attributeFormats[fieldInfo.fieldName] = fieldInfo.format;
+        attributeFormats[fieldInfo.fieldName.toLowerCase()] = fieldInfo.format;
       }
     });
     // What is the nature of the label content?
@@ -447,11 +447,14 @@ export async function _prepareLabels(layer, ids, formatUsingLayerPopup = true, i
   // Get the features to export
   const featureSet = await queryFeaturesByID(ids, layer, [], false);
   // Get field data types. Do we have any domain-based fields?
+  const attributeOrigNames = {};
   const attributeTypes = {};
   const attributeDomains = {};
   layer.fields.forEach(field => {
-    attributeTypes[field.name] = field.type;
-    attributeDomains[field.name] = field.domain;
+    const lowercaseFieldname = field.name.toLowerCase();
+    attributeOrigNames[lowercaseFieldname] = field.name;
+    attributeDomains[lowercaseFieldname] = field.domain;
+    attributeTypes[lowercaseFieldname] = field.type;
   });
   const attributeFormats = {};
   // Get the label formatting, if any
@@ -462,7 +465,7 @@ export async function _prepareLabels(layer, ids, formatUsingLayerPopup = true, i
     await _prepareLabelsFromAll(featureSet, attributeTypes, attributeDomains, includeHeaderNames)
     : labelFormat.type == "pattern" ?
       // Export attributes in format
-      await _prepareLabelsFromPattern(featureSet, attributeTypes, attributeDomains, attributeFormats, labelFormat.format, includeHeaderNames)
+      await _prepareLabelsFromPattern(featureSet, attributeOrigNames, attributeTypes, attributeDomains, attributeFormats, labelFormat.format, includeHeaderNames)
       :
         // Export attributes in expression
         await _prepareLabelsUsingExecutor(featureSet, labelFormat.format);
@@ -482,7 +485,8 @@ export async function _prepareLabelsFromAll(featureSet, attributeTypes, attribut
   // Export all attributes
   const labels = featureSet.map(feature => {
     return Object.keys(feature.attributes).map((attributeName) => {
-      return _prepareAttributeValue(feature.attributes[attributeName], attributeTypes[attributeName], attributeDomains[attributeName], null, intl);
+      const lowercaseFieldname = attributeName.toLowerCase();
+      return _prepareAttributeValue(feature.attributes[attributeName], attributeTypes[lowercaseFieldname], attributeDomains[lowercaseFieldname], null, intl);
     });
   });
   // Add header names
@@ -500,6 +504,7 @@ export async function _prepareLabelsFromAll(featureSet, attributeTypes, attribut
  * Creates labels from attributes in a layer popup.
  *
  * @param featureSet Features to convert to labels
+ * @param attributeOrigNames Mapping from lowercase field names to original field names
  * @param attributeTypes Type for each attribute in a feature
  * @param attributeDomains Domains for each attribute in a feature
  * @param attributeFormats Formats for each attribute in a feature
@@ -507,7 +512,7 @@ export async function _prepareLabelsFromAll(featureSet, attributeTypes, attribut
  * @param includeHeaderNames Add the label format at the front of the list of generated labels
  * @returns Promise resolving with list of labels, each of which is a list of label lines
  */
-export async function _prepareLabelsFromPattern(featureSet, attributeTypes, attributeDomains, attributeFormats, labelFormat, includeHeaderNames = false) {
+export async function _prepareLabelsFromPattern(featureSet, attributeOrigNames, attributeTypes, attributeDomains, attributeFormats, labelFormat, includeHeaderNames = false) {
   const [intl] = await loadModules(["esri/intl"]);
   // Find the label fields that we need to replace with values
   const attributeExpressionMatches = _getFieldExpressionsFromLabel(labelFormat);
@@ -517,7 +522,8 @@ export async function _prepareLabelsFromPattern(featureSet, attributeTypes, attr
     let labelPrep = labelFormat;
     // Replace non-Arcade fields in this feature
     attributeNames.forEach((attributeName, i) => {
-      const value = _prepareAttributeValue(feature.attributes[attributeName], attributeTypes[attributeName], attributeDomains[attributeName], attributeFormats[attributeName], intl);
+      const lowercaseFieldname = attributeName.toLowerCase();
+      const value = _prepareAttributeValue(feature.attributes[attributeOrigNames[lowercaseFieldname]], attributeTypes[lowercaseFieldname], attributeDomains[lowercaseFieldname], attributeFormats[lowercaseFieldname], intl);
       labelPrep = labelPrep.replace(attributeExpressionMatches[i], value);
     });
     // Split label into lines

package/dist/collection/utils/downloadUtils.ts

@@ -24,6 +24,10 @@ import { IExportInfo, IExportInfos } from "../utils/interfaces";
 
 export { ILabel } from "./pdfUtils";
 
+export interface IAttributeOrigNames {
+  [lowercaseName: string]: string;
+}
+
 export interface IAttributeDomains {
   [attributeName: string]: __esri.CodedValueDomain | __esri.RangeDomain | __esri.InheritedDomain | null;
 }
@@ -436,8 +440,8 @@ export function _getFieldNamesFromFieldExpressions(
  * all attributes are exported
  * @param attributeFormats Empty object to hold the formats for each attribute in a feature; the object is filled
  * with formats by this function
- * @returns A Promise resolving to the format of a single label, e.g., for ILabelFormat type "pattern":
- * "{NAME}|{STREET}|{CITY}, {STATE} {ZIP}"
+ * @returns A Promise resolving to the format of a single label with fields coerced to lowercase, e.g.,
+ * for ILabelFormat type "pattern": "{name}|{street}|{city}, {state} {zip}"
  */
 export async function _getLabelFormat(
   layer: __esri.FeatureLayer,
@@ -454,7 +458,7 @@ export async function _getLabelFormat(
       // Extract any format info that we have
       fieldInfo => {
         if (fieldInfo.format) {
-          attributeFormats[fieldInfo.fieldName] = fieldInfo.format;
+          attributeFormats[fieldInfo.fieldName.toLowerCase()] = fieldInfo.format;
         }
       }
     );
@@ -586,12 +590,15 @@ export async function _prepareLabels(
   const featureSet = await queryFeaturesByID(ids, layer, [], false);
 
   // Get field data types. Do we have any domain-based fields?
+  const attributeOrigNames: IAttributeOrigNames = {};
   const attributeTypes: IAttributeTypes = {};
   const attributeDomains: IAttributeDomains = {};
   layer.fields.forEach(
     field => {
-      attributeTypes[field.name] = field.type;
-      attributeDomains[field.name] = field.domain;
+      const lowercaseFieldname = field.name.toLowerCase();
+      attributeOrigNames[lowercaseFieldname] = field.name;
+      attributeDomains[lowercaseFieldname] = field.domain;
+      attributeTypes[lowercaseFieldname] = field.type;
     }
   );
   const attributeFormats: IAttributeFormats = {};
@@ -605,7 +612,7 @@ export async function _prepareLabels(
     await _prepareLabelsFromAll(featureSet, attributeTypes, attributeDomains, includeHeaderNames)
     : labelFormat.type == "pattern" ?
     // Export attributes in format
-    await _prepareLabelsFromPattern(featureSet, attributeTypes, attributeDomains,
+    await _prepareLabelsFromPattern(featureSet, attributeOrigNames, attributeTypes, attributeDomains,
       attributeFormats, labelFormat.format as string, includeHeaderNames)
     :
     // Export attributes in expression
@@ -636,8 +643,9 @@ export async function _prepareLabelsFromAll(
     feature => {
       return Object.keys(feature.attributes).map(
         (attributeName: string) => {
+          const lowercaseFieldname = attributeName.toLowerCase();
           return _prepareAttributeValue(feature.attributes[attributeName],
-            attributeTypes[attributeName], attributeDomains[attributeName],
+            attributeTypes[lowercaseFieldname], attributeDomains[lowercaseFieldname],
             null, intl);
         }
       );
@@ -661,6 +669,7 @@ export async function _prepareLabelsFromAll(
  * Creates labels from attributes in a layer popup.
  *
  * @param featureSet Features to convert to labels
+ * @param attributeOrigNames Mapping from lowercase field names to original field names
  * @param attributeTypes Type for each attribute in a feature
  * @param attributeDomains Domains for each attribute in a feature
  * @param attributeFormats Formats for each attribute in a feature
@@ -670,6 +679,7 @@ export async function _prepareLabelsFromAll(
  */
 export async function _prepareLabelsFromPattern(
   featureSet: __esri.Graphic[],
+  attributeOrigNames: IAttributeOrigNames,
   attributeTypes: IAttributeTypes,
   attributeDomains: IAttributeDomains,
   attributeFormats: IAttributeFormats,
@@ -690,9 +700,10 @@ export async function _prepareLabelsFromPattern(
       // Replace non-Arcade fields in this feature
       attributeNames.forEach(
         (attributeName: string, i: number) => {
-          const value = _prepareAttributeValue(feature.attributes[attributeName],
-            attributeTypes[attributeName], attributeDomains[attributeName],
-            attributeFormats[attributeName], intl);
+          const lowercaseFieldname = attributeName.toLowerCase();
+          const value = _prepareAttributeValue(feature.attributes[attributeOrigNames[lowercaseFieldname]],
+            attributeTypes[lowercaseFieldname], attributeDomains[lowercaseFieldname],
+            attributeFormats[lowercaseFieldname], intl);
           labelPrep = labelPrep.replace(attributeExpressionMatches[i], value);
 
         },

package/dist/components/card-manager2.js

@@ -7,8 +7,8 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
 import { g as getLocaleComponentStrings } from './locale.js';
 import { q as queryFeaturesByID } from './queryUtils.js';
 import { g as getLayer } from './mapViewUtils.js';
-import { d as defineCustomElement$a } from './action.js';
-import { d as defineCustomElement$9 } from './alert.js';
+import { d as defineCustomElement$a } from './alert.js';
+import { d as defineCustomElement$9 } from './button.js';
 import { d as defineCustomElement$8 } from './chip.js';
 import { d as defineCustomElement$7 } from './icon.js';
 import { d as defineCustomElement$6 } from './loader.js';
@@ -84,7 +84,7 @@ const CardManager = /*@__PURE__*/ proxyCustomElement(class CardManager extends H
     var _a, _b;
     const featuresClass = ((_a = this._graphics) === null || _a === void 0 ? void 0 : _a.length) > 0 ? "" : "display-none";
     const messageClass = ((_b = this._graphics) === null || _b === void 0 ? void 0 : _b.length) > 0 ? "display-none" : "";
-    return (h(Host, null, h("div", { class: "border-rounded overflow-auto height-full" }, h("calcite-shell", { class: "position-relative padding-1 " + featuresClass }, h("div", null, h("info-card", { graphics: this._graphics, isLoading: this._cardLoading, mapView: this.mapView, zoomAndScrollToSelected: this.zoomAndScrollToSelected }))), h("div", { class: "padding-1 " + messageClass }, h("calcite-notice", { icon: "table", open: true }, h("div", { slot: "message" }, this._translations.selectFeaturesToStart))))));
+    return (h(Host, null, h("div", { class: "border-rounded overflow-auto height-full" }, h("calcite-shell", { class: "position-relative " + featuresClass }, h("div", null, h("info-card", { graphics: this._graphics, isLoading: this._cardLoading, mapView: this.mapView, zoomAndScrollToSelected: this.zoomAndScrollToSelected }))), h("div", { class: "padding-1 " + messageClass }, h("calcite-notice", { icon: "table", open: true }, h("div", { slot: "message" }, this._translations.selectFeaturesToStart))))));
   }
   //--------------------------------------------------------------------------
   //
@@ -115,19 +115,19 @@ function defineCustomElement() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["card-manager", "calcite-action", "calcite-alert", "calcite-chip", "calcite-icon", "calcite-loader", "calcite-notice", "calcite-shell", "calcite-tooltip", "edit-card", "info-card"];
+  const components = ["card-manager", "calcite-alert", "calcite-button", "calcite-chip", "calcite-icon", "calcite-loader", "calcite-notice", "calcite-shell", "calcite-tooltip", "edit-card", "info-card"];
   components.forEach(tagName => { switch (tagName) {
     case "card-manager":
       if (!customElements.get(tagName)) {
         customElements.define(tagName, CardManager);
       }
       break;
-    case "calcite-action":
+    case "calcite-alert":
       if (!customElements.get(tagName)) {
         defineCustomElement$a();
       }
       break;
-    case "calcite-alert":
+    case "calcite-button":
       if (!customElements.get(tagName)) {
         defineCustomElement$9();
       }

package/dist/components/crowdsource-manager.js

@@ -48,7 +48,7 @@ import { d as defineCustomElement$4 } from './map-picker2.js';
 import { d as defineCustomElement$3 } from './map-search2.js';
 import { d as defineCustomElement$2 } from './map-tools2.js';
 
-const crowdsourceManagerCss = ":host{display:block;--calcite-label-margin-bottom:0px}.padding-1-2{padding:0.5rem}.display-flex{display:flex}.width-full{width:100%}.width-1-2{position:relative;width:50%}.width-1-3{position:relative;width:33.33%}.width-2-3{position:relative;width:66.66%}.width-0{width:0}.height-full{height:100%}.height-1-2{position:relative;height:50%}.height-0{height:0}.toggle-node{width:51px;height:51px}.overflow-hidden{overflow:hidden}.flex-column{flex-direction:column}.border{border:1px solid var(--calcite-ui-border-3)}.border-bottom{border-bottom:1px solid var(--calcite-ui-border-3)}.position-relative{position:relative}.height-50{height:50%}.adjusted-height-50{height:calc(50% - 0.5rem)}.adjusted-height-100{height:calc(100% - 1rem)}.display-none{display:none}.height-53{height:53px}.position-absolute-53{position:absolute;top:53px}.display-grid{display:grid}";
+const crowdsourceManagerCss = ":host{display:block;--calcite-label-margin-bottom:0px}.padding-1-2{padding:0.5rem}.display-flex{display:flex}.width-full{width:100%}.width-1-2{position:relative;width:50%}.width-1-3{position:relative;width:33.33%}.width-2-3{position:relative;width:66.66%}.width-0{width:0}.height-full{height:100%}.height-1-2{position:relative;height:50%}.height-0{height:0}.toggle-node{width:51px;height:51px}.overflow-hidden{overflow:hidden}.flex-column{flex-direction:column}.border{border:1px solid var(--calcite-ui-border-3)}.border-bottom{border-bottom:1px solid var(--calcite-ui-border-3)}.position-relative{position:relative}.height-50{height:50%}.adjusted-height-50{height:calc(50% - 0.5rem - 25px)}.adjusted-height-100{height:calc(100% - 1rem - 50px)}.adjusted-height-100-50{height:calc(100% - 50px)}.display-none{display:none}.height-53{height:53px}.position-absolute-53{position:absolute;top:53px}.display-grid{display:grid}.height-49-px{height:49px}.height-50-px{height:50px}.padding-inline-end-75{padding-inline-end:0.75rem}.align-items-center{align-items:center}";
 
 const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceManager extends HTMLElement {
   constructor() {
@@ -60,6 +60,7 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
     this.mapInfos = [];
     this.searchConfiguration = undefined;
     this.zoomAndScrollToSelected = false;
+    this._expandPopup = false;
     this._translations = undefined;
     this._layoutMode = ELayoutMode.GRID;
     this._mapView = undefined;
@@ -91,6 +92,9 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
    */
   async mapChanged(evt) {
     const mapChange = evt.detail;
+    // close popup by default when the map changes otherwise other components that rely on the view don't work since it
+    // doesn't seem to fully load when it's not visible
+    this._expandPopup = false;
     this._mapInfo = this._getMapInfo(mapChange.id);
     this._mapView = mapChange.mapView;
     this._mapView.popupEnabled = false;
@@ -227,7 +231,7 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
    */
   _getMapAndCard(layoutMode, panelOpen, hideMap) {
     const mapSizeClass = this._getMapSizeClass(layoutMode, panelOpen);
-    return this.classicGrid ? (h("div", { class: `${mapSizeClass} overflow-hidden` }, this._getCardNode(layoutMode, hideMap), this._getMapNode(layoutMode, hideMap))) : (h("div", { class: `${mapSizeClass} overflow-hidden` }, this._getMapNode(layoutMode, hideMap), this._getCardNode(layoutMode, hideMap)));
+    return this.classicGrid ? (h("div", { class: `${mapSizeClass} overflow-hidden` }, this._getCardNode(layoutMode, hideMap), this._getMapNode(layoutMode, hideMap))) : (h("div", { class: `${mapSizeClass} overflow-hidden` }, this._getMapNode(layoutMode, hideMap), this._getPopupExpandNode(), this._getCardNode(layoutMode, hideMap)));
   }
   /**
    * Get the map node based for the current layout options
@@ -241,9 +245,27 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
   _getMapNode(layoutMode, hideMap) {
     const mapDisplayClass = this.classicGrid && layoutMode === ELayoutMode.GRID ? "display-flex height-full width-1-2" :
       layoutMode === ELayoutMode.GRID && !hideMap ? "" : "display-none";
-    const mapContainerClass = this.classicGrid && layoutMode === ELayoutMode.GRID ? "width-full" : "adjusted-height-50";
+    const mapContainerClass = this.classicGrid && layoutMode === ELayoutMode.GRID ? "width-full" : this._expandPopup ? "height-50-px" : "adjusted-height-50";
     return (h("div", { class: `${mapContainerClass} overflow-hidden ${mapDisplayClass}` }, h("map-card", { class: "width-full", mapInfos: this.mapInfos })));
   }
+  /**
+   * Get the expand node for the popup information
+   *
+   * @returns the expand node
+   * @protected
+   */
+  _getPopupExpandNode() {
+    const icon = this._expandPopup ? "chevrons-down" : "chevrons-up";
+    return (h("div", { class: "height-49-px calcite-mode-dark" }, h("calcite-panel", null, h("div", { class: "display-flex align-items-center", slot: "header-content" }, h("calcite-icon", { class: "padding-inline-end-75", icon: "information", scale: "s" }), h("div", null, this._translations.information)), h("calcite-action", { class: "height-49-px", icon: icon, onClick: () => this._togglePopup(), slot: "header-actions-end" }))));
+  }
+  /**
+   * Toggle the popup information
+   *
+   * @protected
+   */
+  _togglePopup() {
+    this._expandPopup = !this._expandPopup;
+  }
   /**
    * Get the card node based for the current layout options
    *
@@ -255,9 +277,9 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
    */
   _getCardNode(layoutMode, hideMap) {
     const cardManagerHeight = this.classicGrid && layoutMode === ELayoutMode.GRID ? "" :
-      layoutMode === ELayoutMode.GRID && !hideMap ? "adjusted-height-50" : "adjusted-height-100";
+      layoutMode === ELayoutMode.GRID && !this._expandPopup && !hideMap ? "adjusted-height-50" : "adjusted-height-100";
     const cardManagerContainer = this.classicGrid && layoutMode === ELayoutMode.GRID ?
-      "width-full adjusted-height-100" : "width-50 height-full";
+      "width-full adjusted-height-100" : this._expandPopup ? "width-50 adjusted-height-100-50" : "width-50 height-full";
     return (h("div", { class: `padding-1-2 ${cardManagerContainer}` }, h("card-manager", { class: `${cardManagerHeight} width-full`, mapView: this === null || this === void 0 ? void 0 : this._mapView, zoomAndScrollToSelected: this.zoomAndScrollToSelected })));
   }
   /**
@@ -325,6 +347,7 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
     "mapInfos": [16],
     "searchConfiguration": [16],
     "zoomAndScrollToSelected": [4, "zoom-and-scroll-to-selected"],
+    "_expandPopup": [32],
     "_translations": [32],
     "_layoutMode": [32],
     "_mapView": [32],

package/dist/components/downloadUtils.js

@@ -2520,8 +2520,8 @@ function _getFieldNamesFromFieldExpressions(fieldExpressions) {
  * all attributes are exported
  * @param attributeFormats Empty object to hold the formats for each attribute in a feature; the object is filled
  * with formats by this function
- * @returns A Promise resolving to the format of a single label, e.g., for ILabelFormat type "pattern":
- * "{NAME}|{STREET}|{CITY}, {STATE} {ZIP}"
+ * @returns A Promise resolving to the format of a single label with fields coerced to lowercase, e.g.,
+ * for ILabelFormat type "pattern": "{name}|{street}|{city}, {state} {zip}"
  */
 async function _getLabelFormat(layer, formatUsingLayerPopup, attributeFormats) {
   var _a, _b, _c, _d, _e, _f;
@@ -2534,7 +2534,7 @@ async function _getLabelFormat(layer, formatUsingLayerPopup, attributeFormats) {
     // Extract any format info that we have
     fieldInfo => {
       if (fieldInfo.format) {
-        attributeFormats[fieldInfo.fieldName] = fieldInfo.format;
+        attributeFormats[fieldInfo.fieldName.toLowerCase()] = fieldInfo.format;
       }
     });
     // What is the nature of the label content?
@@ -2643,11 +2643,14 @@ async function _prepareLabels(layer, ids, formatUsingLayerPopup = true, includeH
   // Get the features to export
   const featureSet = await queryFeaturesByID(ids, layer, [], false);
   // Get field data types. Do we have any domain-based fields?
+  const attributeOrigNames = {};
   const attributeTypes = {};
   const attributeDomains = {};
   layer.fields.forEach(field => {
-    attributeTypes[field.name] = field.type;
-    attributeDomains[field.name] = field.domain;
+    const lowercaseFieldname = field.name.toLowerCase();
+    attributeOrigNames[lowercaseFieldname] = field.name;
+    attributeDomains[lowercaseFieldname] = field.domain;
+    attributeTypes[lowercaseFieldname] = field.type;
   });
   const attributeFormats = {};
   // Get the label formatting, if any
@@ -2658,7 +2661,7 @@ async function _prepareLabels(layer, ids, formatUsingLayerPopup = true, includeH
     await _prepareLabelsFromAll(featureSet, attributeTypes, attributeDomains, includeHeaderNames)
     : labelFormat.type == "pattern" ?
       // Export attributes in format
-      await _prepareLabelsFromPattern(featureSet, attributeTypes, attributeDomains, attributeFormats, labelFormat.format, includeHeaderNames)
+      await _prepareLabelsFromPattern(featureSet, attributeOrigNames, attributeTypes, attributeDomains, attributeFormats, labelFormat.format, includeHeaderNames)
       :
         // Export attributes in expression
         await _prepareLabelsUsingExecutor(featureSet, labelFormat.format);
@@ -2678,7 +2681,8 @@ async function _prepareLabelsFromAll(featureSet, attributeTypes, attributeDomain
   // Export all attributes
   const labels = featureSet.map(feature => {
     return Object.keys(feature.attributes).map((attributeName) => {
-      return _prepareAttributeValue(feature.attributes[attributeName], attributeTypes[attributeName], attributeDomains[attributeName], null, intl);
+      const lowercaseFieldname = attributeName.toLowerCase();
+      return _prepareAttributeValue(feature.attributes[attributeName], attributeTypes[lowercaseFieldname], attributeDomains[lowercaseFieldname], null, intl);
     });
   });
   // Add header names
@@ -2696,6 +2700,7 @@ async function _prepareLabelsFromAll(featureSet, attributeTypes, attributeDomain
  * Creates labels from attributes in a layer popup.
  *
  * @param featureSet Features to convert to labels
+ * @param attributeOrigNames Mapping from lowercase field names to original field names
  * @param attributeTypes Type for each attribute in a feature
  * @param attributeDomains Domains for each attribute in a feature
  * @param attributeFormats Formats for each attribute in a feature
@@ -2703,7 +2708,7 @@ async function _prepareLabelsFromAll(featureSet, attributeTypes, attributeDomain
  * @param includeHeaderNames Add the label format at the front of the list of generated labels
  * @returns Promise resolving with list of labels, each of which is a list of label lines
  */
-async function _prepareLabelsFromPattern(featureSet, attributeTypes, attributeDomains, attributeFormats, labelFormat, includeHeaderNames = false) {
+async function _prepareLabelsFromPattern(featureSet, attributeOrigNames, attributeTypes, attributeDomains, attributeFormats, labelFormat, includeHeaderNames = false) {
   const [intl] = await loadModules(["esri/intl"]);
   // Find the label fields that we need to replace with values
   const attributeExpressionMatches = _getFieldExpressionsFromLabel(labelFormat);
@@ -2713,7 +2718,8 @@ async function _prepareLabelsFromPattern(featureSet, attributeTypes, attributeDo
     let labelPrep = labelFormat;
     // Replace non-Arcade fields in this feature
     attributeNames.forEach((attributeName, i) => {
-      const value = _prepareAttributeValue(feature.attributes[attributeName], attributeTypes[attributeName], attributeDomains[attributeName], attributeFormats[attributeName], intl);
+      const lowercaseFieldname = attributeName.toLowerCase();
+      const value = _prepareAttributeValue(feature.attributes[attributeOrigNames[lowercaseFieldname]], attributeTypes[lowercaseFieldname], attributeDomains[lowercaseFieldname], attributeFormats[lowercaseFieldname], intl);
       labelPrep = labelPrep.replace(attributeExpressionMatches[i], value);
     });
     // Split label into lines