@esri/solutions-components 0.5.0 → 0.5.2

package/dist/solutions-components/utils/csvUtils.ts

@@ -14,47 +14,28 @@
  * limitations under the License.
  */
 
+//#region Declarations
+
+import * as csvDownload from "./csvDownload";
+
+//#endregion
 //#region Public functions
 
 /**
  * Export a csv of the attributes from the features that match the provided ids
  *
+ * @param title Title to use for file
  * @param labels Labels to write
  */
 export function exportCSV(
+  title: string,
   labels: string[][],
 ): void {
   // Format values to string so it doesn't get tripped up when a value has a comma
   // another option could be to export with a different delimiter
   const outputLines = labels.map(label => Object.values(label).map(v => `"${v}"`).join(",") + "\r\n");
 
-  _downloadCSVFile(outputLines, `notify-${Date.now().toString()}`);
-}
-
-//#endregion
-//#region Private functions
-
-/**
- * Download the CSV file
- *
- * @param outputLines Lines of output to write to file
- * @param fileTitle Title (without file extension) to use for file; defaults to "export"
- *
- * @see {@link https://medium.com/@danny.pule/export-json-to-csv-file-using-javascript-a0b7bc5b00d2}
- */
-function _downloadCSVFile(
-  outputLines: string[],
-  fileTitle: string
-): void {
-  const link = document.createElement("a");
-  if (link.download !== undefined) {
-    link.href = URL.createObjectURL(new Blob(outputLines, { type: "text/csv;charset=utf-8;" }));
-    link.download = `${fileTitle}.csv` || "export.csv";
-    link.style.visibility = "hidden";
-    document.body.appendChild(link);
-    link.click();
-    document.body.removeChild(link);
-  }
+  csvDownload.downloadCSVFile(title, outputLines);
 }
 
 //#endregion

package/dist/solutions-components/utils/downloadUtils.ts

@@ -68,11 +68,9 @@ export async function downloadCSV(
   removeDuplicates = false,
   addColumnTitle = false
 ): Promise<void> {
-  console.log("downloadCSV using selectionSetNames " + JSON.stringify(selectionSetNames));//???
-  console.log("downloadCSV removeDuplicates", removeDuplicates);//???
   const labels = await _prepareLabels(layer, ids, removeDuplicates, formatUsingLayerPopup, addColumnTitle);
 
-  exportCSV(labels);
+  exportCSV(_createTitle(selectionSetNames), labels);
 
   return Promise.resolve();
 }
@@ -94,8 +92,6 @@ export async function downloadPDF(
   removeDuplicates: boolean,
   labelPageDescription: ILabel
 ): Promise<void> {
-  console.log("downloadPDF using selectionSetNames " + JSON.stringify(selectionSetNames));//???
-  console.log("downloadPDF removeDuplicates", removeDuplicates);//???
   let labels = await _prepareLabels(layer, ids, removeDuplicates);
 
   labels =
@@ -104,7 +100,7 @@ export async function downloadPDF(
     // Remove empty labels
     .filter(label => label.length > 0);
 
-  exportPDF(labels, labelPageDescription);
+  exportPDF(_createTitle(selectionSetNames), labels, labelPageDescription);
 
   return Promise.resolve();
 }
@@ -119,7 +115,7 @@ export async function downloadPDF(
  * @param bypassFieldVisiblity Indicates if the configured fieldInfo visibility property should be ignored
  * @return Label spec with lines separated by `lineSeparatorChar`
  */
-function _convertPopupFieldsToLabelSpec(
+export function _convertPopupFieldsToLabelSpec(
   fieldInfos: __esri.FieldInfo[],
   bypassFieldVisiblity = false
 ): string {
@@ -145,7 +141,7 @@ function _convertPopupFieldsToLabelSpec(
  * "<div style='text-align: left;'>{NAME}<br />{STREET}<br />{CITY}, {STATE} {ZIP} <br /></div>"
  * @return Label spec with lines separated by `lineSeparatorChar`
  */
-function _convertPopupTextToLabelSpec(
+export function _convertPopupTextToLabelSpec(
   popupInfo: string,
 ): string {
   // Replace <br> variants with the line separator character
@@ -157,19 +153,30 @@ function _convertPopupTextToLabelSpec(
   // Remove </p>
   popupInfo = popupInfo.replace(/<\/p>/gi, "");
 
-  // Remove \n
-  popupInfo = popupInfo.replace(/\n/gi, "");
+  // Replace \n with the line separator character
+  popupInfo = popupInfo.replace(/\n/gi, "|");
 
-  // Remove remaining HTML tags, replace 0xA0 that popup uses for spaces, and replace some char representations,
-  // and split the label back into individual lines
-  const labelSpec = popupInfo
+  // Remove remaining HTML tags, replace 0xA0 that popup uses for spaces, and replace some char representations
+  let labelSpec = popupInfo
     .replace(/<[\s.]*[^<>]*\/?>/gi, "")
     .replace(/\xA0/gi, " ")
     .replace(/&lt;/gi, "<")
     .replace(/&gt;/gi, ">")
     .replace(/&nbsp;/gi, " ");
 
-  return labelSpec;
+  // Trim each line
+  labelSpec = labelSpec.replace(/\s*\|\s*/g, "|");
+
+  // Remove empty lines
+  while (labelSpec.match(/\|\|/)) {
+    labelSpec = labelSpec.replace(/\|\|/, "|");
+  }
+
+  // Remove leading and trailing line feeds
+  labelSpec = labelSpec.replace(/^\|/, "");
+  labelSpec = labelSpec.replace(/\|$/, "");
+
+  return labelSpec.trim();
 };
 
 /**
@@ -252,6 +259,21 @@ async function _createArcadeExecutors(
   );
 }
 
+/**
+ * Creates a title from a list of selection set names.
+ *
+ * @param selectionSetNames Names to use in title
+ * @return Title composed of the selectionSetNames separated by commas; if there are no
+ * selection set names supplied, "download" is returned
+ */
+export function _createTitle(
+  selectionSetNames: string[]
+): string {
+  // Windows doesn't permit the characters \/:*?"<>|
+  const title = selectionSetNames.length > 0 ? selectionSetNames.join(", ") : "download";
+  return title;
+}
+
 /**
  * Prepares an attribute's value by applying domain and type information.
  *

package/dist/solutions-components/utils/interfaces.ts

@@ -19,6 +19,12 @@ import {
   IItemTemplate
 } from '@esri/solution-common';
 
+export enum ELayoutMode {
+  GRID = "GRID",
+  HORIZONTAL = "HORIZONTAL",
+  VERTICAL = "VERTICAL"
+}
+
 /**
  * Resource update types
  */

package/dist/solutions-components/utils/pdfUtils.ts

@@ -27,14 +27,16 @@ export { ILabel } from "../assets/arcgis-pdf-creator/PDFLabels";
 /**
  * Exports a PDF of labels.
  *
+ * @param title Title to use for file
  * @param labels Labels to write
  * @param labelPageDescription Page format to use for labels
  */
 export function exportPDF(
+  title: string,
   labels: string[][],
   labelPageDescription: PDFLabels.ILabel
 ): void {
-  _downloadPDFFile(labels, labelPageDescription, `notify-${Date.now().toString()}`);
+  downloadPDFFile(title, labels, labelPageDescription);
 }
 
 //#endregion
@@ -43,21 +45,23 @@ export function exportPDF(
 /**
  * Downloads the PDF file.
  *
+ * @param title Title (without file extension) to use for file; defaults to "export"
  * @param labels Labels to write
  * @param labelPageDescription Page format to use for labels
- * @param fileTitle Title (without file extension) to use for file; defaults to "export"
  */
-function _downloadPDFFile(
+function downloadPDFFile(
+  title: string,
   labels: string[][],
-  labelPageDescription: PDFLabels.ILabel,
-  fileTitle: string
+  labelPageDescription: PDFLabels.ILabel
 ): void {
   const pdfLib = new PDFCreator_jsPDF.PDFCreator_jsPDF();
   pdfLib.initialize(
     {
       pageType: "ANSI_A"
-    }, getAssetPath(`../assets/arcgis-pdf-creator/`), "en",
-    fileTitle, false
+    },
+    getAssetPath(`../assets/arcgis-pdf-creator/`),
+    "en",
+    title
   )
   .then(
     () => {
@@ -68,7 +72,8 @@ function _downloadPDFFile(
           await labeller.addLabelsToDoc(
             labels,
             labelPageDescription.labelSpec,
-            1
+            1,  // startingPageNum
+            title  // heading
           );
 
           pdfLib.save();

package/dist/solutions-components/utils/queryUtils.ts

@@ -61,7 +61,7 @@ export async function queryObjectIds(
   layer: __esri.FeatureLayer
 ): Promise<number[]> {
   let ids = [];
-  const queryDefs = geometries.map(g => _intersectQuery(g, layer))
+  const queryDefs = geometries ? geometries.map(g => _intersectQuery(g, layer)) : [Promise.resolve()];
   const results = await Promise.all(queryDefs);
   results.forEach(resultIds => {
     ids = [
@@ -206,7 +206,7 @@ export function getSelectionSetQuery(
   type: string,
   geometryEngine: __esri.geometryEngine
 ): __esri.Geometry[] {
-  const geoms = geometries.filter(g => g.type === type);
+  const geoms = geometries?.filter(g => g.type === type) || [];
   return geoms.length <= 1 ? geoms : [geometryEngine.union(geoms)];
 }
 

package/dist/solutions-components/utils/test/csvUtils.spec.tsx

@@ -0,0 +1,56 @@
+/** @license
+ * Copyright 2023 Esri
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import * as csvDownload from "../csvDownload";
+import * as csvUtils from "../csvUtils";
+import {expect, jest, test} from "@jest/globals";
+
+afterEach(() => {
+  jest.restoreAllMocks();
+});
+
+describe("csvUtils", () => {
+
+  describe("exportCSV", () => {
+
+    it("prepares output lines 1", () => {
+      const title = "title";
+      const labels = [
+        ["Cyd Charise", "1922 Main St", "Amarillo, TX 79118"],
+        ["Fred Astaire", "1899 Main St", "Omaha, NE 68022"],
+        ["Gene Kelly", "1912 Main St", "Pittsburgh, PA 15215"],
+        ["Ginger Rogers", "1911 Main St", "Independence, MO 64050"]
+      ];
+      const expectedOutputLines = [
+        "\"Cyd Charise\",\"1922 Main St\",\"Amarillo, TX 79118\"\r\n",
+        "\"Fred Astaire\",\"1899 Main St\",\"Omaha, NE 68022\"\r\n",
+        "\"Gene Kelly\",\"1912 Main St\",\"Pittsburgh, PA 15215\"\r\n",
+        "\"Ginger Rogers\",\"1911 Main St\",\"Independence, MO 64050\"\r\n"
+      ];
+
+      const downloadCSVFileMock = jest.spyOn(csvDownload, "downloadCSVFile")
+        .mockImplementation(
+          (fileTitle: string, outputLines: string[]) => {}
+        );
+      csvUtils.exportCSV(title, labels);
+      expect(downloadCSVFileMock).toBeCalledTimes(1);
+      expect(downloadCSVFileMock.mock.calls[0][0]).toEqual(title);
+      expect(downloadCSVFileMock.mock.calls[0][1]).toEqual(expectedOutputLines);
+    });
+
+  });
+
+});

package/dist/solutions-components/utils/test/downloadUtils.spec.tsx

@@ -0,0 +1,133 @@
+/** @license
+ * Copyright 2023 Esri
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import * as downloadUtils from "../downloadUtils";
+
+describe("downloadUtils", () => {
+
+  describe("_convertPopupFieldsToLabelSpec", () => {
+
+    it("handles fieldname visibility", () => {
+      const fieldInfos: __esri.FieldInfo[] = [
+        { fieldName: "A", visible: true },
+        { fieldName: "B", visible: true },
+        { fieldName: "C", visible: false },
+        { fieldName: "D", visible: true }
+      ];
+      const bypassFieldVisiblity = false;
+      const expectedLabelSpec = "{A}|{B}|{D}";
+
+      const labelSpec = downloadUtils._convertPopupFieldsToLabelSpec(fieldInfos, bypassFieldVisiblity);
+      expect(labelSpec).toEqual(expectedLabelSpec);
+    });
+
+    it("handles fieldname ignoring visibility", () => {
+      const fieldInfos: __esri.FieldInfo[] = [
+        { fieldName: "A", visible: true },
+        { fieldName: "B", visible: true },
+        { fieldName: "C", visible: false },
+        { fieldName: "D", visible: true }
+      ];
+      const bypassFieldVisiblity = true;
+      const expectedLabelSpec = "{A}|{B}|{C}|{D}";
+
+      const labelSpec = downloadUtils._convertPopupFieldsToLabelSpec(fieldInfos, bypassFieldVisiblity);
+      expect(labelSpec).toEqual(expectedLabelSpec);
+    });
+
+  });
+
+  describe("_convertPopupTextToLabelSpec", () => {
+
+    it("handles <br> variants", () => {
+      const popupInfo = "<div style='text-align: left;'>{NAME}<br />{STREET}<br/>{CITY}, {STATE} {ZIP} <br></div>";
+      const expectedLabelSpec = "{NAME}|{STREET}|{CITY}, {STATE} {ZIP}";
+
+      const labelSpec = downloadUtils._convertPopupTextToLabelSpec(popupInfo);
+      expect(labelSpec).toEqual(expectedLabelSpec);
+    });
+
+    it("handles <p>", () => {
+      const popupInfo = "<p>{NAME}</p><p>{STREET}</p><p>{CITY}, {STATE} {ZIP}</p>";
+      const expectedLabelSpec = "{NAME}|{STREET}|{CITY}, {STATE} {ZIP}";
+
+      const labelSpec = downloadUtils._convertPopupTextToLabelSpec(popupInfo);
+      expect(labelSpec).toEqual(expectedLabelSpec);
+    });
+
+    it("handles popup's use of \xA0", () => {
+      const popupInfo = "<div style='text-align: left;'>{NAME}<br />{STREET}<br />{CITY},\xA0{STATE}\xA0{ZIP}\xA0<br /></div>";
+      const expectedLabelSpec = "{NAME}|{STREET}|{CITY}, {STATE} {ZIP}";
+
+      const labelSpec = downloadUtils._convertPopupTextToLabelSpec(popupInfo);
+      expect(labelSpec).toEqual(expectedLabelSpec);
+    });
+
+    it("removes newlines and blank lines, and trims each line", () => {
+      const popupInfo = "  \n\n   {NAME}   \n  \n\n   {STREET}\n{CITY}, {STATE} {ZIP}\n\n  \n ";
+      const expectedLabelSpec = "{NAME}|{STREET}|{CITY}, {STATE} {ZIP}";
+
+      const labelSpec = downloadUtils._convertPopupTextToLabelSpec(popupInfo);
+      expect(labelSpec).toEqual(expectedLabelSpec);
+    });
+
+    it("removes extra HTML", () => {
+      const popupInfo = "\n<div style='text-align: left;'><span style='font-weight:bold'>{NAME}</span><br />{STREET}<br />{CITY},\xA0{STATE}\xA0{ZIP}\xA0<br /></div>\n";
+      const expectedLabelSpec = "{NAME}|{STREET}|{CITY}, {STATE} {ZIP}";
+
+      const labelSpec = downloadUtils._convertPopupTextToLabelSpec(popupInfo);
+      expect(labelSpec).toEqual(expectedLabelSpec);
+    });
+
+    it("handles some special characters", () => {
+      const popupInfo = "<div style='text-align: left;'>&lt;{NAME}&gt;<br />{STREET}<br/>{CITY},&nbsp;{STATE}&nbsp;{ZIP}<br></div>";
+      const expectedLabelSpec = "<{NAME}>|{STREET}|{CITY}, {STATE} {ZIP}";
+
+      const labelSpec = downloadUtils._convertPopupTextToLabelSpec(popupInfo);
+      expect(labelSpec).toEqual(expectedLabelSpec);
+    });
+
+  });
+
+  describe("_createTitle", () => {
+
+    it("handles no selection set names", () => {
+      const selectionSetNames: string[] = [];
+      const expectedTitle = "download";
+
+      const title = downloadUtils._createTitle(selectionSetNames);
+      expect(title).toEqual(expectedTitle);
+    });
+
+    it("handles one selection set name", () => {
+      const selectionSetNames: string[] = ["fred"];
+      const expectedTitle = "fred";
+
+      const title = downloadUtils._createTitle(selectionSetNames);
+      expect(title).toEqual(expectedTitle);
+    });
+
+    it("handles two selection set names", () => {
+      const selectionSetNames: string[] = ["fred", "ginger"];
+      const expectedTitle = "fred,ginger";
+
+      const title = downloadUtils._createTitle(selectionSetNames);
+      expect(title).toEqual(expectedTitle);
+    });
+
+  });
+
+});

package/dist/types/components/crowdsource-manager/crowdsource-manager.d.ts

@@ -13,9 +13,48 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+/// <reference types="arcgis-js-api" />
+import { VNode } from '../../stencil-public-runtime';
+import CrowdsourceManager_T9n from "../../assets/t9n/crowdsource-manager/resources.json";
+import { ELayoutMode, IMapInfo } from '../../utils/interfaces';
 export declare class CrowdsourceManager {
   el: HTMLCrowdsourceManagerElement;
+  /**
+   * IMapInfo[]: array of map infos (name and id)
+   */
+  mapInfos: IMapInfo[];
+  /**
+   * Contains the translations for this component.
+   * All UI strings should be defined here.
+   */
+  _translations: typeof CrowdsourceManager_T9n;
+  /**
+   * Controls the layout of the application
+   */
+  _layoutMode: ELayoutMode;
+  /**
+   * Stores the current map view
+   */
+  _mapView: __esri.MapView;
+  /**
+   * Controls the layout of the application
+   */
+  _panelOpen: boolean;
+  /**
+   * Handle changes to the buffer distance value
+   */
+  mapChanged(event: CustomEvent): void;
+  componentWillLoad(): Promise<void>;
   render(): any;
+  protected _getAction(imgClass: string, layoutMode: ELayoutMode, tip: string): VNode;
+  protected _getDividerIcon(layoutMode: ELayoutMode, panelOpen: boolean): string;
+  protected _getMapSizeClass(layoutMode: ELayoutMode, panelOpen: boolean): string;
+  protected _getTableSizeClass(layoutMode: ELayoutMode, panelOpen: boolean): string;
+  protected _getBody(layoutMode: ELayoutMode, panelOpen: boolean): VNode;
+  protected _getMap(layoutMode: ELayoutMode, panelOpen: boolean): VNode;
+  protected _getTable(layoutMode: ELayoutMode, panelOpen: boolean): VNode;
+  protected _setLayoutMode(layoutMode: ELayoutMode): void;
+  protected _toggleLayout(): void;
   /**
    * Fetches the component's translations
    *

package/dist/types/components/layer-table/layer-table.d.ts

@@ -22,35 +22,48 @@ export declare class LayerTable {
    * esri/views/View: https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html
    */
   mapView: __esri.MapView;
+  /**
+   * esri/views/layers/FeatureLayerView: https://developers.arcgis.com/javascript/latest/api-reference/esri-views-layers-FeatureLayerView.html
+   */
+  _layerView: __esri.FeatureLayerView;
+  /**
+   * A list of indexes that are currently selected
+   */
+  _selectedIndexes: number[];
   /**
    * Contains the translations for this component.
    * All UI strings should be defined here.
    */
   _translations: typeof LayerTable_T9n;
   /**
-   * A list of indexes that are currently selected
+   * esri/widgets/FeatureTable: https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-FeatureTable.html
    */
-  _selectedIndexes: number[];
+  protected FeatureTable: typeof import("esri/widgets/FeatureTable");
   /**
    * HTMLEditRecordModalElement: Modal used to edit multiple records
    */
   protected _editMultipleMpdal: HTMLEditRecordModalElement;
+  /**
+   * string[]: List of field names to display
+   */
+  protected _fieldNames: string[];
   /**
    * esri/Graphic[]: https://developers.arcgis.com/javascript/latest/api-reference/esri-Graphic.html
    */
   protected _graphics: __esri.Graphic[];
   /**
-   * esri/views/layers/FeatureLayerView: https://developers.arcgis.com/javascript/latest/api-reference/esri-views-layers-FeatureLayerView.html
+   * HTMLCalciteCheckboxElement: Element to force selection of all records
    */
-  protected _layerView: __esri.FeatureLayerView;
+  protected _selectAllElement: HTMLCalciteCheckboxElement;
   /**
-   * string[]: List of field names to display
+   * esri/widgets/FeatureTable: https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-FeatureTable.html
    */
-  protected _fieldNames: string[];
+  protected _table: __esri.FeatureTable;
   /**
-   * HTMLCalciteCheckboxElement: Element to force selection of all records
+   * HTMLDivElement: Element to hold the FeatureTable
    */
-  protected _selectAllElement: HTMLCalciteCheckboxElement;
+  protected _tableNode: HTMLDivElement;
+  mapViewWatchHandler(): Promise<void>;
   /**
    * StencilJS: Called once just after the component is first connected to the DOM.
    *
@@ -62,58 +75,32 @@ export declare class LayerTable {
    */
   render(): any;
   /**
-   * Gets a row of controls that can be used for various interactions with the table
+   * Load esri javascript api modules
    *
-   * @returns The dom node that contains the controls
-   */
-  protected _getTableControlRow(): VNode;
-  /**
-   * Gets the table header with a select all control and column headers for each field
-   *
-   * @returns The dom node that contains the header
-   */
-  protected _getTableHeader(): VNode;
-  /**
-   * Gets a header cell for the table header
-   *
-   * @param name the string to display in the cell
-   *
-   * @returns The dom node that contains the header cell
-   */
-  protected _getTableHeaderCell(name: string): VNode;
-  /**
-   * Gets the table rows for all features
+   * @returns Promise resolving when function is done
    *
-   * @returns The dom node that contains the body of the table
+   * @protected
    */
-  protected _getTableRows(): VNode[];
+  protected _initModules(): Promise<void>;
   /**
-   * Gets the individual table row for a feature
-   *
-   * @param g the graphic the row is based on
-   * @param index the index location of the row within the table
+   * Gets a row of controls that can be used for various interactions with the table
    *
-   * @returns The dom node that contains the row
+   * @returns The dom node that contains the controls
    */
-  protected _getTableRow(g: __esri.Graphic, index: number): VNode;
+  protected _getTableControlRow(): VNode;
   /**
-   * Gets the individual table cell for the provided field
-   *
-   * @param v the value to display
-   * @param field the field the row is based on
-   * @param rowSelected when true editable fields will render a control that will allow the value to be updated
+   * Store a reference to the table node after it's first created
+   * and initializes the FeatureTable
    *
-   * @returns The dom node that contains the table cell
+   * @returns void
    */
-  protected _getTableRowCell(v: string, field: __esri.Field, rowSelected: boolean): VNode;
+  private onTableNodeCreate;
   /**
-   * Simple lookup that will get the appropriate edit control for the value type
+   * Initialize the FeatureTable
    *
-   * @param type the Esri field type
-   *
-   * @returns A string for the type of control to create based on the provided field type
+   * @returns void
    */
-  protected _getInputType(type: string): "number" | "datetime-local" | "text";
+  protected _getTable(node: HTMLDivElement): void;
   /**
    * Select or deselect all rows
    *

package/dist/types/components/map-card/map-card.d.ts

@@ -24,13 +24,13 @@ export declare class MapCard {
    */
   mapInfos: IMapInfo[];
   /**
-   * boolean: controls the state of the map list
+   * esri/views/View: https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html
    */
-  _mapListExpanded: boolean;
+  mapView: __esri.MapView;
   /**
-   * esri/views/View: https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html
+   * boolean: controls the state of the map list
    */
-  _mapView: __esri.MapView;
+  _mapListExpanded: boolean;
   /**
    * Contains the translations for this component.
    * All UI strings should be defined here.
@@ -53,9 +53,9 @@ export declare class MapCard {
    */
   protected _loadedId: string;
   /**
-   * string: the id of the container div for the map
+   * HTMLDivElement: the container div for the map
    */
-  protected _mapDivId: string;
+  protected _mapDiv: HTMLDivElement;
   /**
    * Called each time the _webMapId prop is changed.
    */
@@ -68,6 +68,10 @@ export declare class MapCard {
    * Emitted when the expand button is clicked
    */
   expandMap: EventEmitter<EExpandType>;
+  /**
+   * Emitted when a new map is loaded
+   */
+  mapChanged: EventEmitter<__esri.MapView>;
   /**
    * StencilJS: Called once just after the component is first connected to the DOM.
    */