@esri/solutions-components 0.8.0 → 0.8.2

package/dist/collection/components/consent-manager/consent-manager.js

@@ -37,7 +37,7 @@ export class ConsentManager {
          * boolean: When true the telemetry instance has been loaded
          */
         this._loaded = false;
-        this.firstUseVar = "solutions-first-use";
+        this.firstUseVar = undefined;
         this.measurementIds = undefined;
         this.portal = undefined;
         this._shouldRender = undefined;
@@ -85,6 +85,16 @@ export class ConsentManager {
     render() {
         return this._shouldRender ? (h(Host, null, h("calcite-panel", { class: "consent-panel calcite-mode-dark", id: "cookie-policy" }, h("div", { class: "cookie-consent-popup-container" }, h("div", { id: "cookie-policy-description-top", tabindex: "-1" }, h("p", null, this._translations.dearVisitor), h("p", null, this._translations.useAnalytics)), h("div", { class: "button-container" }, h("calcite-button", { appearance: "solid", class: "padding-end-1", kind: "brand", onClick: () => this._refuse() }, this._translations.refuseAnalytics), h("calcite-button", { appearance: "solid", kind: "brand", onClick: () => this._accept() }, this._translations.acceptAnalytics)), h("div", null, h("p", null, this._translations.moreInfo, "\u00A0", h("calcite-link", { class: "link-text", href: "https://www.arcgis.com/", rel: "noopener noreferrer", target: "_blank" }, this._translations.protectionPolicy), this._translations.our, "\u00A0", h("calcite-link", { class: "link-text", href: "https://www.arcgis.com/", rel: "noopener noreferrer", target: "_blank" }, this._translations.cookiePolicy, "\u00A0"), this._translations.andOur, "\u00A0", h("calcite-link", { class: "link-text", href: "https://www.arcgis.com/", rel: "noopener noreferrer", target: "_blank" }, this._translations.cookiesInventory))))))) : undefined;
     }
+    /**
+     * Called once after the component is loaded
+     *
+     * @returns Promise when complete
+     */
+    async componentDidLoad() {
+        this.consentGranted.emit({
+            granted: localStorage.getItem(this.firstUseVar) === "true"
+        });
+    }
     //--------------------------------------------------------------------------
     //
     //  Functions (protected)
@@ -172,15 +182,14 @@ export class ConsentManager {
                     "resolved": "string",
                     "references": {}
                 },
-                "required": false,
+                "required": true,
                 "optional": false,
                 "docs": {
                     "tags": [],
                     "text": "string: The name to use for the variable stored in the browsers local storge that\r\nwill keep track of the users choice for consent"
                 },
                 "attribute": "first-use-var",
-                "reflect": false,
-                "defaultValue": "\"solutions-first-use\""
+                "reflect": false
             },
             "measurementIds": {
                 "type": "unknown",

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

@@ -277,10 +277,10 @@ export class MapDrawTools {
      * @protected
      */
     _clearSketch() {
-        var _a;
-        this._sketchWidget.viewModel.cancel();
+        var _a, _b;
+        (_a = this._sketchWidget) === null || _a === void 0 ? void 0 : _a.viewModel.cancel();
         this.graphics = [];
-        (_a = this._sketchGraphicsLayer) === null || _a === void 0 ? void 0 : _a.removeAll();
+        (_b = this._sketchGraphicsLayer) === null || _b === void 0 ? void 0 : _b.removeAll();
     }
     /**
      * Emit the undo event

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

@@ -87,6 +87,14 @@ export class MapSelectTools {
             }
         }
     }
+    /**
+     * Called each time the mapView prop is changed.
+     */
+    async mapViewWatchHandler(v, oldV) {
+        if (v && v !== oldV) {
+            await this._init();
+        }
+    }
     /**
      * Called each time the searchConfiguration prop is changed.
      *
@@ -94,7 +102,7 @@ export class MapSelectTools {
      */
     async watchSearchConfigurationHandler(newValue, oldValue) {
         if (JSON.stringify(newValue) !== JSON.stringify(oldValue)) {
-            this._initSearchWidget();
+            await this._initSearchWidget();
         }
     }
     //--------------------------------------------------------------------------
@@ -178,12 +186,6 @@ export class MapSelectTools {
      */
     async componentDidLoad() {
         await this._init();
-        await this._searchWidget.when(() => {
-            var _a;
-            this._searchWidget.allPlaceholder = ((_a = this.searchConfiguration) === null || _a === void 0 ? void 0 : _a.allPlaceholder) &&
-                this.searchConfiguration.allPlaceholder.toLowerCase() !== "find address or place" ?
-                this.searchConfiguration.allPlaceholder : this._translations.placeholder;
-        });
     }
     /**
      * Renders the component.
@@ -270,7 +272,7 @@ export class MapSelectTools {
     async _init() {
         this._initGraphicsLayer();
         await this._initSelectionSet();
-        this._initSearchWidget();
+        await this._initSearchWidget();
     }
     /**
      * Initialize the state of the component with any stored values in a selection set
@@ -316,7 +318,7 @@ export class MapSelectTools {
      *
      * @protected
      */
-    _initSearchWidget() {
+    async _initSearchWidget() {
         if (this.mapView && this._searchElement) {
             const searchConfiguration = this._getSearchConfig(this.searchConfiguration, this.mapView);
             const searchOptions = Object.assign({ view: this.mapView, container: this._searchElement, searchTerm: this._searchTerm }, searchConfiguration);
@@ -345,6 +347,12 @@ export class MapSelectTools {
                     void this._clearResults(false, clearLabel);
                 }
             });
+            await this._searchWidget.when(() => {
+                var _a;
+                this._searchWidget.allPlaceholder = ((_a = this.searchConfiguration) === null || _a === void 0 ? void 0 : _a.allPlaceholder) &&
+                    this.searchConfiguration.allPlaceholder.toLowerCase() !== "find address or place" ?
+                    this.searchConfiguration.allPlaceholder : this._translations.placeholder;
+            });
         }
     }
     /**
@@ -412,19 +420,21 @@ export class MapSelectTools {
      */
     _initGraphicsLayer() {
         const title = this._translations.bufferLayer;
-        const bufferIndex = this.mapView.map.layers.findIndex((l) => l.title === title);
-        if (bufferIndex > -1) {
-            this._bufferGraphicsLayer = this.mapView.map.layers.getItemAt(bufferIndex);
-        }
-        else {
-            this._bufferGraphicsLayer = new this.GraphicsLayer({ title, listMode: "hide" });
-            state.managedLayers.push(title);
-            const sketchIndex = this.mapView.map.layers.findIndex((l) => l.title === this._translations.sketchLayer);
-            if (sketchIndex > -1) {
-                this.mapView.map.layers.add(this._bufferGraphicsLayer, sketchIndex);
+        if (this.mapView) {
+            const bufferIndex = this.mapView.map.layers.findIndex((l) => l.title === title);
+            if (bufferIndex > -1) {
+                this._bufferGraphicsLayer = this.mapView.map.layers.getItemAt(bufferIndex);
             }
             else {
-                this.mapView.map.layers.add(this._bufferGraphicsLayer);
+                this._bufferGraphicsLayer = new this.GraphicsLayer({ title, listMode: "hide" });
+                state.managedLayers.push(title);
+                const sketchIndex = this.mapView.map.layers.findIndex((l) => l.title === this._translations.sketchLayer);
+                if (sketchIndex > -1) {
+                    this.mapView.map.layers.add(this._bufferGraphicsLayer, sketchIndex);
+                }
+                else {
+                    this.mapView.map.layers.add(this._bufferGraphicsLayer);
+                }
             }
         }
     }
@@ -1220,6 +1230,9 @@ export class MapSelectTools {
         return [{
                 "propName": "geometries",
                 "methodName": "watchGeometriesHandler"
+            }, {
+                "propName": "mapView",
+                "methodName": "mapViewWatchHandler"
             }, {
                 "propName": "searchConfiguration",
                 "methodName": "watchSearchConfigurationHandler"

package/dist/collection/components/public-notification/public-notification.js

@@ -84,6 +84,7 @@ export class PublicNotification {
         if (v === null || v === void 0 ? void 0 : v.popup) {
             this._popupsEnabled = v === null || v === void 0 ? void 0 : v.popup.autoOpenEnabled;
         }
+        this._initSearchConfiguration(this.searchConfiguration);
     }
     /**
      * Called each time the searchConfiguration prop is changed.
@@ -92,7 +93,7 @@ export class PublicNotification {
      */
     async watchSearchConfigurationHandler(newValue, oldValue) {
         const s_newValue = JSON.stringify(newValue);
-        if (s_newValue !== JSON.stringify(oldValue)) {
+        if (this.mapView && (s_newValue !== JSON.stringify(oldValue) || (s_newValue && !this._searchConfiguration))) {
             this._searchConfiguration = JSON.parse(s_newValue);
             this.searchConfigurationChange.emit(this._searchConfiguration);
             // force back to list page before we create Search
@@ -181,6 +182,12 @@ export class PublicNotification {
         const headerSlot = this._isMobile ? "footer" : "header";
         return (h(Host, null, h("calcite-shell", null, h("calcite-action-bar", { class: "border-bottom-1 action-bar-size", "expand-disabled": true, layout: "horizontal", slot: headerSlot }, this._getActionGroup("list-check", EPageType.LIST, this._translations.myLists), this.showRefineSelection ? this._getActionGroup("test-data", EPageType.REFINE, this._translations.refineSelection) : null, this._getActionGroup("export", EPageType.EXPORT, this._translations.export)), this._getPage(this._pageType))));
     }
+    /**
+     * StencilJS: Called once just after the component is first loaded.
+     */
+    async componentDidLoad() {
+        this._initSearchConfiguration(this.searchConfiguration);
+    }
     /**
      * StencilJS: Called every time the component is disconnected from the DOM
      */
@@ -207,6 +214,22 @@ export class PublicNotification {
         this._geometryEngine = geometryEngine;
         this._jsonUtils = jsonUtils;
     }
+    /**
+     * Load the search configuration
+     *
+     * @returns Promise resolving when function is done
+     *
+     * @protected
+     */
+    _initSearchConfiguration(v) {
+        if (this.searchConfiguration && !this._searchConfiguration && this.mapView) {
+            this._searchConfiguration = v;
+            this.searchConfigurationChange.emit(this._searchConfiguration);
+            // force back to list page before we create Search
+            // https://devtopia.esri.com/WebGIS/arcgis-template-configuration/issues/3402
+            void this._home();
+        }
+    }
     /**
      * Initialize the default symbols that will be used when creating new graphics
      *

package/dist/components/consent-manager.js

@@ -1655,7 +1655,7 @@ const ConsentManager$1 = /*@__PURE__*/ proxyCustomElement(class ConsentManager e
          * boolean: When true the telemetry instance has been loaded
          */
         this._loaded = false;
-        this.firstUseVar = "solutions-first-use";
+        this.firstUseVar = undefined;
         this.measurementIds = undefined;
         this.portal = undefined;
         this._shouldRender = undefined;
@@ -1703,6 +1703,16 @@ const ConsentManager$1 = /*@__PURE__*/ proxyCustomElement(class ConsentManager e
     render() {
         return this._shouldRender ? (h(Host, null, h("calcite-panel", { class: "consent-panel calcite-mode-dark", id: "cookie-policy" }, h("div", { class: "cookie-consent-popup-container" }, h("div", { id: "cookie-policy-description-top", tabindex: "-1" }, h("p", null, this._translations.dearVisitor), h("p", null, this._translations.useAnalytics)), h("div", { class: "button-container" }, h("calcite-button", { appearance: "solid", class: "padding-end-1", kind: "brand", onClick: () => this._refuse() }, this._translations.refuseAnalytics), h("calcite-button", { appearance: "solid", kind: "brand", onClick: () => this._accept() }, this._translations.acceptAnalytics)), h("div", null, h("p", null, this._translations.moreInfo, "\u00A0", h("calcite-link", { class: "link-text", href: "https://www.arcgis.com/", rel: "noopener noreferrer", target: "_blank" }, this._translations.protectionPolicy), this._translations.our, "\u00A0", h("calcite-link", { class: "link-text", href: "https://www.arcgis.com/", rel: "noopener noreferrer", target: "_blank" }, this._translations.cookiePolicy, "\u00A0"), this._translations.andOur, "\u00A0", h("calcite-link", { class: "link-text", href: "https://www.arcgis.com/", rel: "noopener noreferrer", target: "_blank" }, this._translations.cookiesInventory))))))) : undefined;
     }
+    /**
+     * Called once after the component is loaded
+     *
+     * @returns Promise when complete
+     */
+    async componentDidLoad() {
+        this.consentGranted.emit({
+            granted: localStorage.getItem(this.firstUseVar) === "true"
+        });
+    }
     //--------------------------------------------------------------------------
     //
     //  Functions (protected)

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

@@ -274,10 +274,10 @@ const MapDrawTools = /*@__PURE__*/ proxyCustomElement(class MapDrawTools extends
      * @protected
      */
     _clearSketch() {
-        var _a;
-        this._sketchWidget.viewModel.cancel();
+        var _a, _b;
+        (_a = this._sketchWidget) === null || _a === void 0 ? void 0 : _a.viewModel.cancel();
         this.graphics = [];
-        (_a = this._sketchGraphicsLayer) === null || _a === void 0 ? void 0 : _a.removeAll();
+        (_b = this._sketchGraphicsLayer) === null || _b === void 0 ? void 0 : _b.removeAll();
     }
     /**
      * Emit the undo event

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

@@ -103,6 +103,14 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
             }
         }
     }
+    /**
+     * Called each time the mapView prop is changed.
+     */
+    async mapViewWatchHandler(v, oldV) {
+        if (v && v !== oldV) {
+            await this._init();
+        }
+    }
     /**
      * Called each time the searchConfiguration prop is changed.
      *
@@ -110,7 +118,7 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
      */
     async watchSearchConfigurationHandler(newValue, oldValue) {
         if (JSON.stringify(newValue) !== JSON.stringify(oldValue)) {
-            this._initSearchWidget();
+            await this._initSearchWidget();
         }
     }
     //--------------------------------------------------------------------------
@@ -194,12 +202,6 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
      */
     async componentDidLoad() {
         await this._init();
-        await this._searchWidget.when(() => {
-            var _a;
-            this._searchWidget.allPlaceholder = ((_a = this.searchConfiguration) === null || _a === void 0 ? void 0 : _a.allPlaceholder) &&
-                this.searchConfiguration.allPlaceholder.toLowerCase() !== "find address or place" ?
-                this.searchConfiguration.allPlaceholder : this._translations.placeholder;
-        });
     }
     /**
      * Renders the component.
@@ -286,7 +288,7 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
     async _init() {
         this._initGraphicsLayer();
         await this._initSelectionSet();
-        this._initSearchWidget();
+        await this._initSearchWidget();
     }
     /**
      * Initialize the state of the component with any stored values in a selection set
@@ -332,7 +334,7 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
      *
      * @protected
      */
-    _initSearchWidget() {
+    async _initSearchWidget() {
         if (this.mapView && this._searchElement) {
             const searchConfiguration = this._getSearchConfig(this.searchConfiguration, this.mapView);
             const searchOptions = Object.assign({ view: this.mapView, container: this._searchElement, searchTerm: this._searchTerm }, searchConfiguration);
@@ -361,6 +363,12 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
                     void this._clearResults(false, clearLabel);
                 }
             });
+            await this._searchWidget.when(() => {
+                var _a;
+                this._searchWidget.allPlaceholder = ((_a = this.searchConfiguration) === null || _a === void 0 ? void 0 : _a.allPlaceholder) &&
+                    this.searchConfiguration.allPlaceholder.toLowerCase() !== "find address or place" ?
+                    this.searchConfiguration.allPlaceholder : this._translations.placeholder;
+            });
         }
     }
     /**
@@ -428,19 +436,21 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
      */
     _initGraphicsLayer() {
         const title = this._translations.bufferLayer;
-        const bufferIndex = this.mapView.map.layers.findIndex((l) => l.title === title);
-        if (bufferIndex > -1) {
-            this._bufferGraphicsLayer = this.mapView.map.layers.getItemAt(bufferIndex);
-        }
-        else {
-            this._bufferGraphicsLayer = new this.GraphicsLayer({ title, listMode: "hide" });
-            state.managedLayers.push(title);
-            const sketchIndex = this.mapView.map.layers.findIndex((l) => l.title === this._translations.sketchLayer);
-            if (sketchIndex > -1) {
-                this.mapView.map.layers.add(this._bufferGraphicsLayer, sketchIndex);
+        if (this.mapView) {
+            const bufferIndex = this.mapView.map.layers.findIndex((l) => l.title === title);
+            if (bufferIndex > -1) {
+                this._bufferGraphicsLayer = this.mapView.map.layers.getItemAt(bufferIndex);
             }
             else {
-                this.mapView.map.layers.add(this._bufferGraphicsLayer);
+                this._bufferGraphicsLayer = new this.GraphicsLayer({ title, listMode: "hide" });
+                state.managedLayers.push(title);
+                const sketchIndex = this.mapView.map.layers.findIndex((l) => l.title === this._translations.sketchLayer);
+                if (sketchIndex > -1) {
+                    this.mapView.map.layers.add(this._bufferGraphicsLayer, sketchIndex);
+                }
+                else {
+                    this.mapView.map.layers.add(this._bufferGraphicsLayer);
+                }
             }
         }
     }
@@ -798,6 +808,7 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
     get el() { return this; }
     static get watchers() { return {
         "geometries": ["watchGeometriesHandler"],
+        "mapView": ["mapViewWatchHandler"],
         "searchConfiguration": ["watchSearchConfigurationHandler"]
     }; }
     static get style() { return mapSelectToolsCss; }
@@ -830,6 +841,7 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
         "getSelection": [64]
     }, [[8, "searchConfigurationChange", "searchConfigurationChangeChanged"], [8, "distanceChanged", "distanceChanged"], [8, "unitChanged", "unitChanged"]], {
         "geometries": ["watchGeometriesHandler"],
+        "mapView": ["mapViewWatchHandler"],
         "searchConfiguration": ["watchSearchConfigurationHandler"]
     }]);
 function defineCustomElement() {

package/dist/components/public-notification.js

@@ -117,6 +117,7 @@ const PublicNotification$1 = /*@__PURE__*/ proxyCustomElement(class PublicNotifi
         if (v === null || v === void 0 ? void 0 : v.popup) {
             this._popupsEnabled = v === null || v === void 0 ? void 0 : v.popup.autoOpenEnabled;
         }
+        this._initSearchConfiguration(this.searchConfiguration);
     }
     /**
      * Called each time the searchConfiguration prop is changed.
@@ -125,7 +126,7 @@ const PublicNotification$1 = /*@__PURE__*/ proxyCustomElement(class PublicNotifi
      */
     async watchSearchConfigurationHandler(newValue, oldValue) {
         const s_newValue = JSON.stringify(newValue);
-        if (s_newValue !== JSON.stringify(oldValue)) {
+        if (this.mapView && (s_newValue !== JSON.stringify(oldValue) || (s_newValue && !this._searchConfiguration))) {
             this._searchConfiguration = JSON.parse(s_newValue);
             this.searchConfigurationChange.emit(this._searchConfiguration);
             // force back to list page before we create Search
@@ -214,6 +215,12 @@ const PublicNotification$1 = /*@__PURE__*/ proxyCustomElement(class PublicNotifi
         const headerSlot = this._isMobile ? "footer" : "header";
         return (h(Host, null, h("calcite-shell", null, h("calcite-action-bar", { class: "border-bottom-1 action-bar-size", "expand-disabled": true, layout: "horizontal", slot: headerSlot }, this._getActionGroup("list-check", EPageType.LIST, this._translations.myLists), this.showRefineSelection ? this._getActionGroup("test-data", EPageType.REFINE, this._translations.refineSelection) : null, this._getActionGroup("export", EPageType.EXPORT, this._translations.export)), this._getPage(this._pageType))));
     }
+    /**
+     * StencilJS: Called once just after the component is first loaded.
+     */
+    async componentDidLoad() {
+        this._initSearchConfiguration(this.searchConfiguration);
+    }
     /**
      * StencilJS: Called every time the component is disconnected from the DOM
      */
@@ -240,6 +247,22 @@ const PublicNotification$1 = /*@__PURE__*/ proxyCustomElement(class PublicNotifi
         this._geometryEngine = geometryEngine;
         this._jsonUtils = jsonUtils;
     }
+    /**
+     * Load the search configuration
+     *
+     * @returns Promise resolving when function is done
+     *
+     * @protected
+     */
+    _initSearchConfiguration(v) {
+        if (this.searchConfiguration && !this._searchConfiguration && this.mapView) {
+            this._searchConfiguration = v;
+            this.searchConfigurationChange.emit(this._searchConfiguration);
+            // force back to list page before we create Search
+            // https://devtopia.esri.com/WebGIS/arcgis-template-configuration/issues/3402
+            void this._home();
+        }
+    }
     /**
      * Initialize the default symbols that will be used when creating new graphics
      *

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

@@ -571,10 +571,10 @@ const MapDrawTools = class {
      * @protected
      */
     _clearSketch() {
-        var _a;
-        this._sketchWidget.viewModel.cancel();
+        var _a, _b;
+        (_a = this._sketchWidget) === null || _a === void 0 ? void 0 : _a.viewModel.cancel();
         this.graphics = [];
-        (_a = this._sketchGraphicsLayer) === null || _a === void 0 ? void 0 : _a.removeAll();
+        (_b = this._sketchGraphicsLayer) === null || _b === void 0 ? void 0 : _b.removeAll();
     }
     /**
      * Emit the undo event

package/dist/esm/consent-manager.entry.js

@@ -1645,7 +1645,7 @@ const ConsentManager = class {
          * boolean: When true the telemetry instance has been loaded
          */
         this._loaded = false;
-        this.firstUseVar = "solutions-first-use";
+        this.firstUseVar = undefined;
         this.measurementIds = undefined;
         this.portal = undefined;
         this._shouldRender = undefined;
@@ -1693,6 +1693,16 @@ const ConsentManager = class {
     render() {
         return this._shouldRender ? (h(Host, null, h("calcite-panel", { class: "consent-panel calcite-mode-dark", id: "cookie-policy" }, h("div", { class: "cookie-consent-popup-container" }, h("div", { id: "cookie-policy-description-top", tabindex: "-1" }, h("p", null, this._translations.dearVisitor), h("p", null, this._translations.useAnalytics)), h("div", { class: "button-container" }, h("calcite-button", { appearance: "solid", class: "padding-end-1", kind: "brand", onClick: () => this._refuse() }, this._translations.refuseAnalytics), h("calcite-button", { appearance: "solid", kind: "brand", onClick: () => this._accept() }, this._translations.acceptAnalytics)), h("div", null, h("p", null, this._translations.moreInfo, "\u00A0", h("calcite-link", { class: "link-text", href: "https://www.arcgis.com/", rel: "noopener noreferrer", target: "_blank" }, this._translations.protectionPolicy), this._translations.our, "\u00A0", h("calcite-link", { class: "link-text", href: "https://www.arcgis.com/", rel: "noopener noreferrer", target: "_blank" }, this._translations.cookiePolicy, "\u00A0"), this._translations.andOur, "\u00A0", h("calcite-link", { class: "link-text", href: "https://www.arcgis.com/", rel: "noopener noreferrer", target: "_blank" }, this._translations.cookiesInventory))))))) : undefined;
     }
+    /**
+     * Called once after the component is loaded
+     *
+     * @returns Promise when complete
+     */
+    async componentDidLoad() {
+        this.consentGranted.emit({
+            granted: localStorage.getItem(this.firstUseVar) === "true"
+        });
+    }
     //--------------------------------------------------------------------------
     //
     //  Functions (protected)