@esri/solutions-components 0.7.24 → 0.7.25

package/dist/cjs/buffer-tools_3.cjs.entry.js

@@ -8,8 +8,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b8a649fc.js');
-const loadModules = require('./loadModules-46d14e81.js');
-const locale = require('./locale-1ff119f5.js');
+const locale = require('./locale-a476e15d.js');
 const dom = require('./dom-e111eaa6.js');
 const interfaces = require('./interfaces-7cd0a48a.js');
 const publicNotificationStore = require('./publicNotificationStore-3a17c2f4.js');
@@ -114,7 +113,7 @@ const BufferTools = class {
      * @protected
      */
     async _initModules() {
-        const [geometryEngine] = await loadModules.loadModules([
+        const [geometryEngine] = await locale.loadModules([
             "esri/geometry/geometryEngine"
         ]);
         this._geometryEngine = geometryEngine;
@@ -435,7 +434,7 @@ const MapDrawTools = class {
      * @protected
      */
     async _initModules() {
-        const [GraphicsLayer, Sketch, SketchViewModel] = await loadModules.loadModules([
+        const [GraphicsLayer, Sketch, SketchViewModel] = await locale.loadModules([
             "esri/layers/GraphicsLayer",
             "esri/widgets/Sketch",
             "esri/widgets/Sketch/SketchViewModel"

package/dist/cjs/{calcite-alert_3.cjs.entry.js → calcite-alert_4.cjs.entry.js}

@@ -15,9 +15,9 @@ const locale = require('./locale-6a627639.js');
 const openCloseComponent = require('./openCloseComponent-8c9a1749.js');
 const t9n = require('./t9n-0556abcb.js');
 const resources = require('./resources-222ad22c.js');
-const locale$1 = require('./locale-1ff119f5.js');
-const loadModules = require('./loadModules-46d14e81.js');
+const locale$1 = require('./locale-a476e15d.js');
 const mapViewUtils = require('./mapViewUtils-8aa325de.js');
+const popupUtils = require('./popupUtils-a73902a6.js');
 require('./guid-1a466ca6.js');
 require('./resources-6c60363a.js');
 require('./key-b8c05387.js');
@@ -553,7 +553,7 @@ const EditCard = class {
      * @returns Promise resolving when function is done
      */
     async _initModules() {
-        const [Editor, reactiveUtils] = await loadModules.loadModules([
+        const [Editor, reactiveUtils] = await locale$1.loadModules([
             "esri/widgets/Editor",
             "esri/core/reactiveUtils"
         ]);
@@ -654,6 +654,299 @@ const EditCard = class {
 };
 EditCard.style = editCardCss;
 
+const infoCardCss = ":host{display:block;--calcite-label-margin-bottom:0}.padding-1-2{padding:0.5rem}.display-none{display:none !important}.display-flex{display:flex}.position-absolute{position:absolute;top:0;right:0;bottom:0;left:0;overflow:auto}.esri-features__footer{display:none !important}.button-container{justify-content:space-between;align-items:center}.top-border{border-top:1px solid var(--calcite-color-border-1)}.min-width-100{min-width:100px}.width-100{width:100%}.esri-features__container{padding:0.5rem !important;background-color:var(--calcite-color-foreground-1) !important;height:100% !important}.overflow-hidden{overflow:hidden}.height-40{height:40px}.padding-top-46{padding-top:46px}.end-border{border-inline-end:1px solid var(--calcite-color-border-1)}.font-bold{font-weight:bold}.visibility-hidden{visibility:hidden;height:0px}.padding-inline-start-1{padding-inline-start:1rem}";
+
+const InfoCard = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.popupClosed = index.createEvent(this, "popupClosed", 7);
+        this.selectionChanged = index.createEvent(this, "selectionChanged", 7);
+        this.graphics = undefined;
+        this.isLoading = false;
+        this.isMobile = undefined;
+        this.mapView = undefined;
+        this.zoomAndScrollToSelected = undefined;
+        this.allowEditing = true;
+        this._alertOpen = false;
+        this._count = "";
+        this._editRecordOpen = false;
+        this._mobileTitle = "";
+        this._showListView = false;
+        this._translations = undefined;
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Watch handlers
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * Watch for changes to the graphic and update the feature widget
+     */
+    async graphicsWatchHandler() {
+        await this.setGraphics();
+    }
+    /**
+     * Watch for changes to the isMobile prop then init the Features widget
+     * We need to know if the title should be displayed by the widget (non mobile)
+     * or by us (mobile)
+     */
+    async isMobileWatchHandler() {
+        await this._initFeaturesWidget();
+    }
+    /**
+     * Watch for changes to the mapView and re-init the Feature widget
+     */
+    async mapViewWatchHandler() {
+        return await this._initFeaturesWidget();
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Methods (public)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * Get the current selected feature from the Features widget
+     *
+     * @returns Promise resolving with the current feature
+     */
+    async getSelectedFeature() {
+        return this._features.selectedFeature;
+    }
+    /**
+     * Respond to and close the edit record display
+     *
+     * @returns a promise when the operation has completed
+     */
+    async closeEdit() {
+        this._editRecordOpen = false;
+    }
+    /**
+     * Reset key properties when the layer selection changes
+     */
+    async layerSelectionChange() {
+        var _a;
+        this._showListView = false;
+        if ((_a = this._features) === null || _a === void 0 ? void 0 : _a.viewModel) {
+            this._features.viewModel.featureMenuOpen = false;
+            this._features.close();
+        }
+    }
+    /**
+     * Refresh the info-card graphics
+     */
+    async refreshGraphics(evt) {
+        this.graphics = [...evt.detail];
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Functions (lifecycle)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * StencilJS: Called once just after the component is first connected to the DOM.
+     *
+     * @returns Promise when complete
+     */
+    async componentWillLoad() {
+        await this._initModules();
+        await this._getTranslations();
+        this._popupUtils = new popupUtils.PopupUtils();
+    }
+    /**
+     * StencilJS: Called once just after the component is fully loaded and the first render() occurs.
+     * @returns Promise when complete
+     */
+    async componentDidLoad() {
+        var _a;
+        if (((_a = this.graphics) === null || _a === void 0 ? void 0 : _a.length) > 0) {
+            await this.setGraphics();
+        }
+    }
+    /**
+     * Renders the component.
+     */
+    render() {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+        const loadingClass = this.isLoading ? "" : "display-none";
+        const featureNodeClass = this.isLoading || this._editRecordOpen ? "visibility-hidden" : "position-absolute";
+        const editClass = !this.isLoading && this._editRecordOpen ? "position-absolute" : "display-none";
+        const editButtonClass = (!this.isLoading && this._editRecordOpen) || this._showListView ? "display-none" : "";
+        const nextBackDisabled = ((_b = (_a = this._features) === null || _a === void 0 ? void 0 : _a.features) === null || _b === void 0 ? void 0 : _b.length) < 2;
+        const nextBackClass = this.isMobile ? "display-none" : "";
+        const shellClass = this.isMobile && !this._editRecordOpen ? "padding-top-46" : "";
+        const id = (_d = (_c = this._features) === null || _c === void 0 ? void 0 : _c.selectedFeature) === null || _d === void 0 ? void 0 : _d.getObjectId();
+        const ids = parseInt(id === null || id === void 0 ? void 0 : id.toString(), 10) > -1 ? [id] : [];
+        const deleteEnabled = ((_e = this._layer) === null || _e === void 0 ? void 0 : _e.editingEnabled) && ((_h = (_g = (_f = this._layer) === null || _f === void 0 ? void 0 : _f.capabilities) === null || _g === void 0 ? void 0 : _g.operations) === null || _h === void 0 ? void 0 : _h.supportsDelete);
+        return (index.h(index.Host, null, this.isMobile && !this._editRecordOpen ? (index.h("calcite-panel", null, index.h("calcite-action", { class: "end-border", icon: "chevron-left", iconFlipRtl: true, onClick: () => this._closePopup(), scale: "s", slot: "header-actions-start", text: "" }), index.h("span", { class: "font-bold", slot: "header-content" }, this._mobileTitle))) : undefined, index.h("calcite-shell", { class: shellClass }, index.h("calcite-loader", { class: loadingClass, label: this._translations.fetchingData }), index.h("div", { class: "esri-widget " + featureNodeClass, id: "features-node" }), index.h("div", { class: `${editButtonClass} width-100`, slot: "footer" }, this.allowEditing &&
+            index.h("div", { class: "display-flex top-border padding-1-2" }, index.h("calcite-button", { appearance: "solid", id: "solutions-edit", onClick: () => this._openEditRecord(), width: "full" }, this._translations.edit), this.isMobile && deleteEnabled ? (index.h("delete-button", { class: "padding-inline-start-1 width-100", id: "solutions-delete", ids: ids, layer: this._layer, onEditsComplete: () => this._closePopup() })) : undefined, index.h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "solutions-edit" }, index.h("span", null, this._translations.edit)), this.isMobile ? (index.h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "solutions-delete" }, index.h("span", null, this._translations.delete))) : undefined), !nextBackDisabled && index.h("div", { class: `display-flex padding-1-2 button-container top-border ${nextBackClass}` }, index.h("div", { class: "min-width-100" }, index.h("calcite-button", { appearance: "outline", disabled: nextBackDisabled, id: "solutions-back", onClick: () => this._back(), width: "full" }, this._translations.back), index.h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-back" }, index.h("span", null, this._translations.back))), index.h("div", null, index.h("calcite-action", { icon: "list", onClick: () => this._toggleListView(), scale: "s", text: this._count, textEnabled: true })), index.h("div", { class: "min-width-100" }, index.h("calcite-button", { appearance: "outline", disabled: nextBackDisabled, id: "solutions-next", onClick: () => this._next(), width: "full" }, this._translations.next), index.h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-next" }, index.h("span", null, this._translations.next))))), index.h("edit-card", { class: editClass, graphicIndex: (_j = this._features) === null || _j === void 0 ? void 0 : _j.selectedFeatureIndex, graphics: this.graphics, mapView: this.mapView, open: this._editRecordOpen }), index.h("calcite-alert", { icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, index.h("div", { slot: "title" }, this._translations.editDisabled), index.h("div", { slot: "message" }, this._translations.enableEditing)))));
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Functions (protected)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * Load esri javascript api modules
+     *
+     * @returns Promise resolving when function is done
+     *
+     * @protected
+     */
+    async _initModules() {
+        const [Features, reactiveUtils] = await locale$1.loadModules([
+            "esri/widgets/Features",
+            "esri/core/reactiveUtils"
+        ]);
+        this.Features = Features;
+        this.reactiveUtils = reactiveUtils;
+    }
+    /**
+     * Initializes the features widget if not created and updates the feature widget and other required states
+     *
+     * @protected
+     */
+    async setGraphics() {
+        var _a;
+        if (!this._features) {
+            await this._initFeaturesWidget();
+        }
+        if (this.graphics.length > 0) {
+            this._layer = (_a = this.graphics[0]) === null || _a === void 0 ? void 0 : _a.layer;
+            this._editEnabled = this._layer.editingEnabled && this._layer.capabilities.operations.supportsUpdate;
+            this._mobileTitle = await this._popupUtils.getPopupTitle(this.graphics[0]);
+            this._features.open({
+                features: this.graphics
+            });
+        }
+        else {
+            this._features.clear();
+            this._features.close();
+        }
+        this._count = this._getCount();
+    }
+    /**
+     * Init the Feature widget so we can display the popup content
+     *
+     * @returns a promise when the operation has completed
+     *
+     * @protected
+     */
+    async _initFeaturesWidget() {
+        var _a;
+        return this.isMobile !== undefined ? await ((_a = this.mapView) === null || _a === void 0 ? void 0 : _a.when(() => {
+            if (!this._features) {
+                this._features = new this.Features({
+                    view: this.mapView,
+                    container: "features-node",
+                    visibleElements: {
+                        actionBar: false,
+                        closeButton: false,
+                        heading: !this.isMobile
+                    }
+                });
+                this.reactiveUtils.watch(() => this._features.viewModel.featureMenuOpen, (isOpen) => {
+                    if (!isOpen) {
+                        this._showListView = isOpen;
+                    }
+                });
+                if (this.zoomAndScrollToSelected) {
+                    this.reactiveUtils.watch(() => this._features.selectedFeatureIndex, (i) => {
+                        if (i > -1) {
+                            this.selectionChanged.emit([this._features.selectedFeature]);
+                        }
+                    });
+                }
+            }
+            else {
+                this._features.view = this.mapView;
+                this._features.visibleElements.actionBar = false;
+                this._features.visibleElements.closeButton = false;
+                this._features.visibleElements.heading = !this.isMobile;
+            }
+        })) : Promise.resolve();
+    }
+    /**
+     * Close the popup and emit the selected features
+     */
+    _closePopup() {
+        this.popupClosed.emit();
+    }
+    /**
+     * Set the alertOpen member to false when the alert is closed
+     */
+    _alertClosed() {
+        this._alertOpen = false;
+    }
+    /**
+     * Open the edit record
+     */
+    _openEditRecord() {
+        if (this._editEnabled) {
+            this._editRecordOpen = true;
+        }
+        else {
+            this._alertOpen = true;
+        }
+    }
+    /**
+     * Go to the previous feature in the features widget
+     */
+    _back() {
+        this._features.previous();
+        this._count = this._getCount();
+    }
+    /**
+     * Go to the next feature in the features widget
+     */
+    _next() {
+        this._features.next();
+        this._count = this._getCount();
+    }
+    /**
+     * Get the current index of total string
+     *
+     * @returns the index of total string
+     */
+    _getCount() {
+        var _a, _b, _c;
+        const index = (((_a = this._features) === null || _a === void 0 ? void 0 : _a.viewModel.selectedFeatureIndex) + 1).toString();
+        const total = (_c = (_b = this._features) === null || _b === void 0 ? void 0 : _b.features) === null || _c === void 0 ? void 0 : _c.length.toString();
+        return this._translations.indexOfTotal
+            .replace("{{index}}", index)
+            .replace("{{total}}", total);
+    }
+    /**
+     * Toggle the visibility of the features list view
+     */
+    _toggleListView() {
+        this._showListView = !this._showListView;
+        const i = this._features.selectedFeatureIndex;
+        this._features.open({
+            features: this.graphics,
+            featureMenuOpen: this._showListView
+        });
+        this._features.selectedFeatureIndex = i;
+    }
+    /**
+     * Fetches the component's translations
+     *
+     * @returns Promise when complete
+     * @protected
+     */
+    async _getTranslations() {
+        const messages = await locale$1.getLocaleComponentStrings(this.el);
+        this._translations = messages[0];
+    }
+    get el() { return index.getElement(this); }
+    static get watchers() { return {
+        "graphics": ["graphicsWatchHandler"],
+        "isMobile": ["isMobileWatchHandler"],
+        "mapView": ["mapViewWatchHandler"]
+    }; }
+};
+InfoCard.style = infoCardCss;
+
 exports.calcite_alert = Alert;
 exports.delete_button = DeleteButton;
 exports.edit_card = EditCard;
+exports.info_card = InfoCard;

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

@@ -25,12 +25,11 @@ const component = require('./component-c270a500.js');
 const debounce = require('./debounce-30afab47.js');
 const conditionalSlot = require('./conditionalSlot-63e11cba.js');
 const key = require('./key-b8c05387.js');
-const locale$1 = require('./locale-1ff119f5.js');
+const locale$1 = require('./locale-a476e15d.js');
 const mapViewUtils = require('./mapViewUtils-8aa325de.js');
 const publicNotificationStore = require('./publicNotificationStore-3a17c2f4.js');
 require('./resources-6c60363a.js');
 require('./browser-9a43b900.js');
-require('./loadModules-46d14e81.js');
 require('./esri-loader-a91c0ec1.js');
 require('./_commonjsHelpers-384729db.js');
 require('./interfaces-7cd0a48a.js');

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

@@ -15,17 +15,16 @@ const interactive = require('./interactive-8aff886e.js');
 const locale = require('./locale-6a627639.js');
 const t9n = require('./t9n-0556abcb.js');
 const resources = require('./resources-8e3763a4.js');
-const popupUtils = require('./popupUtils-8d5b6e94.js');
+const popupUtils = require('./popupUtils-a73902a6.js');
 const mapViewUtils = require('./mapViewUtils-8aa325de.js');
-const locale$1 = require('./locale-1ff119f5.js');
+const locale$1 = require('./locale-a476e15d.js');
 require('./guid-1a466ca6.js');
 require('./resources-6c60363a.js');
 require('./browser-9a43b900.js');
 require('./key-b8c05387.js');
-require('./loadModules-46d14e81.js');
+require('./interfaces-7cd0a48a.js');
 require('./esri-loader-a91c0ec1.js');
 require('./_commonjsHelpers-384729db.js');
-require('./interfaces-7cd0a48a.js');
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.

package/dist/cjs/calcite-shell-panel_14.cjs.entry.js

@@ -23,7 +23,7 @@ const sharedListRender = require('./shared-list-render-25bedff5.js');
 const sortableComponent = require('./sortableComponent-188f3290.js');
 const resources$2 = require('./resources-228f9286.js');
 const resources$1 = require('./resources-d2d7b7c7.js');
-const locale$1 = require('./locale-1ff119f5.js');
+const locale$1 = require('./locale-a476e15d.js');
 const solutionStore = require('./solution-store-ab6c980f.js');
 const interfaces = require('./interfaces-7cd0a48a.js');
 const solutionResource = require('./solution-resource-abec7452.js');
@@ -33,7 +33,6 @@ require('./browser-9a43b900.js');
 require('./array-1d19377b.js');
 require('./resources-9400a252.js');
 require('./debounce-30afab47.js');
-require('./loadModules-46d14e81.js');
 require('./esri-loader-a91c0ec1.js');
 require('./_commonjsHelpers-384729db.js');
 require('./index-22bb61da.js');

package/dist/cjs/{card-manager_2.cjs.entry.js → card-manager_3.cjs.entry.js}

@@ -8,13 +8,12 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b8a649fc.js');
-const locale = require('./locale-1ff119f5.js');
+const locale = require('./locale-a476e15d.js');
 const mapViewUtils = require('./mapViewUtils-8aa325de.js');
-const loadModules = require('./loadModules-46d14e81.js');
-const downloadUtils = require('./downloadUtils-401356b5.js');
-require('./interfaces-7cd0a48a.js');
+const downloadUtils = require('./downloadUtils-83c6d3c3.js');
 require('./esri-loader-a91c0ec1.js');
 require('./_commonjsHelpers-384729db.js');
+require('./interfaces-7cd0a48a.js');
 require('./solution-resource-abec7452.js');
 require('./index-f64944ad.js');
 require('./restHelpersGet-e0737480.js');
@@ -402,7 +401,7 @@ const LayerTable = class {
      * @protected
      */
     async _initModules() {
-        const [FeatureTable, reactiveUtils] = await loadModules.loadModules([
+        const [FeatureTable, reactiveUtils] = await locale.loadModules([
             "esri/widgets/FeatureTable",
             "esri/core/reactiveUtils"
         ]);
@@ -1465,5 +1464,183 @@ const LayerTable = class {
 };
 LayerTable.style = layerTableCss;
 
+const mapCardCss = ":host{display:block;--calcite-label-margin-bottom:0;--calcite-block-padding:0}.map-height{height:calc(100% - 51px)}.height-full{height:100%}.box-shadow{box-shadow:none !important}.visibility-hidden{visibility:hidden}.display-none{display:none}";
+
+const MapCard = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.mapChanged = index.createEvent(this, "mapChanged", 7);
+        this.beforeMapChanged = index.createEvent(this, "beforeMapChanged", 7);
+        /**
+         * boolean: When true the default map provided via url params has been loaded and should no longer override other maps
+         */
+        this._defaultWebmapHonored = false;
+        /**
+         * string: the id of map currently displayed
+         */
+        this._loadedId = "";
+        this.defaultWebmapId = "";
+        this.enableHome = undefined;
+        this.enableLegend = undefined;
+        this.enableFloorFilter = undefined;
+        this.enableFullscreen = undefined;
+        this.enableSingleExpand = true;
+        this.enableSearch = undefined;
+        this.enableBasemap = undefined;
+        this.basemapConfig = undefined;
+        this.hidden = undefined;
+        this.homeZoomIndex = 3;
+        this.homeZoomPosition = "top-left";
+        this.homeZoomToolsSize = "m";
+        this.mapInfos = [];
+        this.mapWidgetsIndex = 0;
+        this.mapWidgetsPosition = "top-right";
+        this.mapWidgetsSize = "m";
+        this.mapView = undefined;
+        this.stackTools = true;
+        this.theme = undefined;
+        this.toolOrder = undefined;
+        this._searchConfiguration = undefined;
+        this._webMapInfo = undefined;
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Watch handlers
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * Add/remove home widget
+     */
+    enableHomeWatchHandler() {
+        this._initHome();
+    }
+    /**
+     * Listen for changes to map info and load the appropriate map
+     */
+    async mapInfoChange(evt) {
+        await this._loadMap(evt.detail);
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Functions (lifecycle)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * StencilJS: Called once just after the component is first connected to the DOM.
+     */
+    async componentWillLoad() {
+        await this._initModules();
+    }
+    /**
+     * Renders the component.
+     */
+    render() {
+        var _a, _b;
+        const mapClass = this.hidden ? "visibility-hidden" : "";
+        const themeClass = this.theme === "dark" ? "calcite-mode-dark" : "calcite-mode-light";
+        const mapPickerClass = ((_a = this.mapInfos) === null || _a === void 0 ? void 0 : _a.length) > 1 ? "" : "display-none";
+        const mapHeightClass = ((_b = this.mapInfos) === null || _b === void 0 ? void 0 : _b.length) > 1 ? "map-height" : "height-full";
+        return (index.h(index.Host, null, index.h("map-picker", { class: mapPickerClass, mapInfos: this.mapInfos, ref: (el) => this._mapPicker = el }), index.h("div", { class: `${mapHeightClass} ${mapClass}`, ref: (el) => (this._mapDiv = el) }), index.h("map-tools", { basemapConfig: this.basemapConfig, class: `box-shadow ${themeClass}`, enableBasemap: this.enableBasemap, enableFloorFilter: this.enableFloorFilter, enableFullscreen: this.enableFullscreen, enableHome: this.enableHome, enableLegend: this.enableLegend, enableSearch: this.enableSearch, enableSingleExpand: this.enableSingleExpand, homeZoomToolsSize: this.homeZoomToolsSize, mapView: this.mapView, mapWidgetsSize: this.mapWidgetsSize, position: this.mapWidgetsPosition, ref: (el) => this._mapTools = el, searchConfiguration: this._searchConfiguration, stackTools: this.stackTools, toolOrder: this.toolOrder })));
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Functions (protected)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * Load esri javascript api modules
+     *
+     * @returns Promise resolving when function is done
+     *
+     * @protected
+     */
+    async _initModules() {
+        const [WebMap, MapView, Home] = await locale.loadModules([
+            "esri/WebMap",
+            "esri/views/MapView",
+            "esri/widgets/Home"
+        ]);
+        this.WebMap = WebMap;
+        this.MapView = MapView;
+        this.Home = Home;
+    }
+    /**
+     * Load the webmap for the provided webMapInfo
+     *
+     * @param webMapInfo the webmap id and name to load
+     */
+    async _loadMap(webMapInfo) {
+        var _a;
+        // on the first render use the default webmap id if provided otherwise use the first child of the provided mapInfos
+        const loadDefaultMap = !this._defaultWebmapHonored && this.defaultWebmapId;
+        const defaultMap = (_a = this.mapInfos) === null || _a === void 0 ? void 0 : _a.filter(i => i.id === this.defaultWebmapId);
+        const mapConfigChanged = JSON.stringify(webMapInfo) !== JSON.stringify(this._webMapInfo);
+        this._webMapInfo = loadDefaultMap && defaultMap ? defaultMap[0] :
+            !(webMapInfo === null || webMapInfo === void 0 ? void 0 : webMapInfo.id) && this.mapInfos.length > 0 ? this.mapInfos[0] : webMapInfo;
+        const id = this._webMapInfo.id;
+        const isDefaultMap = loadDefaultMap && (webMapInfo === null || webMapInfo === void 0 ? void 0 : webMapInfo.id) === this.defaultWebmapId;
+        if ((this._loadedId !== id && !loadDefaultMap) || isDefaultMap) {
+            const webMap = new this.WebMap({
+                portalItem: { id }
+            });
+            this.mapView = new this.MapView({
+                container: this._mapDiv,
+                map: webMap,
+                resizeAlign: "center"
+            });
+            this._loadedId = id;
+            this._searchConfiguration = this._webMapInfo.searchConfiguration;
+            this.beforeMapChanged.emit();
+            await this.mapView.when(() => {
+                this._initHome();
+                this.mapView.ui.add(this._mapTools, { position: this.mapWidgetsPosition, index: this.mapWidgetsIndex });
+                this._defaultWebmapHonored = isDefaultMap ? true : this._defaultWebmapHonored;
+                this.mapChanged.emit({
+                    id: id,
+                    mapView: this.mapView
+                });
+            });
+        }
+        else if (loadDefaultMap) {
+            this._defaultWebmapHonored = true;
+            this._mapPicker.setMapByID(id);
+        }
+        else if (mapConfigChanged) {
+            // Map is the same so no need to reload but we need to update for any changes from the config
+            this._searchConfiguration = this._webMapInfo.searchConfiguration;
+            this.beforeMapChanged.emit();
+            this.mapChanged.emit({
+                id: id,
+                mapView: this.mapView
+            });
+        }
+    }
+    /**
+     * Add/remove the home widget base on enableHome prop
+     *
+     * @protected
+     */
+    _initHome() {
+        if (this.enableHome) {
+            this._homeWidget = new this.Home({
+                view: this.mapView
+            });
+            this.mapView.ui.add(this._homeWidget, { position: this.homeZoomPosition, index: this.homeZoomIndex });
+            const size = this.homeZoomToolsSize === "s" ? "32px" : this.homeZoomToolsSize === "m" ? "40px" : "48px";
+            this._homeWidget.domNode.style.height = size;
+            this._homeWidget.domNode.style.width = size;
+        }
+        else if (this._homeWidget) {
+            this.mapView.ui.remove(this._homeWidget);
+        }
+    }
+    get el() { return index.getElement(this); }
+    static get watchers() { return {
+        "enableHome": ["enableHomeWatchHandler"]
+    }; }
+};
+MapCard.style = mapCardCss;
+
 exports.card_manager = CardManager;
 exports.layer_table = LayerTable;
+exports.map_card = MapCard;

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

@@ -8,10 +8,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b8a649fc.js');
-const locale = require('./locale-1ff119f5.js');
+const locale = require('./locale-a476e15d.js');
 const interfaces = require('./interfaces-7cd0a48a.js');
 const mapViewUtils = require('./mapViewUtils-8aa325de.js');
-require('./loadModules-46d14e81.js');
 require('./esri-loader-a91c0ec1.js');
 require('./_commonjsHelpers-384729db.js');