@esri/solutions-components 0.8.39 → 0.8.41

package/dist/collection/components/solution-spatial-ref/solution-spatial-ref.js

@@ -4,7 +4,7 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  */
 /** @license
- * Copyright 2022 Esri
+ * Copyright 2021 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -18,9 +18,9 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+import { h, Host } from "@stencil/core";
 import "@esri/calcite-components";
 import state from "../../utils/solution-store";
-import { h, Host } from "@stencil/core";
 import { getLocaleComponentStrings } from "../../utils/locale";
 import { nodeListToArray } from "../../utils/common";
 export class SolutionSpatialRef {
@@ -30,7 +30,6 @@ export class SolutionSpatialRef {
         this.locked = true;
         this.services = [];
         this.value = this.defaultWkid.toString();
-        this._srSearchText = undefined;
         this._translations = undefined;
     }
     lockedChanged(newLocked) {
@@ -53,17 +52,21 @@ export class SolutionSpatialRef {
     componentWillLoad() {
         return this._getTranslations();
     }
-    /**
-     * Renders the component.
-     */
     render() {
-        return (h(Host, { key: '2a12d415e9408b646365ace8e3e82138be70f343' }, h("div", { key: 'f58d6782ac4065f67dd0205271b05d4c0c31d8dc', class: "spatial-ref" }, h("div", { key: '5267f203f1c63c5e900b0ead8798f3561d225d42', class: "spatial-ref-desc" }, h("calcite-label", { key: '1183f8ee9274be1980dc889ca52f5d0c6a6994af' }, this._translations.paramDescription)), h("label", { key: '5367f57784a20501505b0e9cfdd345a8de3fce93', class: "switch-label" }, h("calcite-switch", { key: '2d79a69e64f28b6e2aeed52b0b0aa4034ebb6c57', checked: !this.locked, class: "spatial-ref-switch", onCalciteSwitchChange: (event) => this._updateLocked(event), scale: "m" }), this._translations.specifyParam), h("div", { key: '60ab36865749f4c59798bf51ff1b5264a3eeeefc', class: "spatial-ref-component", id: "spatialRefDefn" }, h("calcite-label", { key: 'bc0b446d1f7b0a62f49b579ac0e5f8da33531ed9' }, this._translations.spatialReferenceInfo, h("label", { key: '5f2135d975e2254429c8d6a14fe2f2a91fdc3fb9', class: "spatial-ref-default" }, h("spatial-ref", { key: 'be7c105e3cebba4eed80c88e8b4d539affb67e0e', defaultWkid: this.defaultWkid, disabled: this.locked, value: this.value }))), this._getFeatureServices(this.services)))));
+        return (h(Host, { key: '8c5f34b7d44429ed0395ae48956161caf7e62111' }, h("label", { key: '69f1178da58409888f0b5b15ae4ffd224bb999d4', class: "switch-label" }, h("calcite-switch", { key: '279795c5e21b914c595ea95219e3f589f7270ac4', checked: !this.locked, class: "spatial-ref-switch", onCalciteSwitchChange: (event) => this._updateLocked(event), scale: "m" }), this._translations.specifyParam), h("div", { key: '516e621ad3e2f6f881b0fbc0a80d98f1f3b7eecd', class: "spatial-ref-component", id: "spatialRefDefn" }, h("calcite-label", { key: '19b05ffa3e80d5e33521d0b6ee8438d882f9481d' }, this._translations.spatialReferenceInfo, h("label", { key: '0766edb36aa3e8853bfd4754b9ea7aa955d7d987', class: "spatial-ref-default" }, h("spatial-ref", { key: '9f1b37a12e18b5ba3c2d2b4b372f01a4f69ded28', defaultWkid: this.defaultWkid, disabled: this.locked, value: this.value }))), this._getFeatureServices(this.services))));
+    }
+    solutionStoreHasChanges() {
+        this.services = state.getStoreInfo("featureServices").map(service => service.name);
     }
     /**
      * Saves changes to the embedded spatial reference value
      */
     spatialReferenceChange(event) {
         this.value = event.detail.newValue;
+        state.setStoreInfo("defaultWkid", event.detail.newValue);
+        const spatialReferenceInfo = state.getStoreInfo("spatialReferenceInfo");
+        spatialReferenceInfo.spatialReference = event.detail.newValue;
+        state.setStoreInfo("spatialReferenceInfo", spatialReferenceInfo);
     }
     //--------------------------------------------------------------------------
     //
@@ -76,22 +79,19 @@ export class SolutionSpatialRef {
     //
     //--------------------------------------------------------------------------
     /**
-     * Toggles the ability to set the default spatial reference.
+     * Create a switch control for each of the services
+     *
+     * @param services List of feature services
+     * @returns a node to control each feature service
      */
-    _updateLocked(event) {
-        this.locked = !event.target.checked;
-        this._updateStore();
-        if (!this.loaded) {
-            // when this is switched on when loading we have reloaded a solution that
-            // has a custom wkid param and we should honor the settings they already have in the templates
-            if (event.target.checked) {
-                // By default enable all Feature Services on first load
-                this._setFeatureServiceDefaults(this.services);
-            }
-            this.loaded = true;
-        }
+    _getFeatureServices(services) {
+        // verify they are in state
+        const spatialReferenceInfo = state.getStoreInfo("spatialReferenceInfo");
+        const _services = services.filter(serviceName => {
+            return Object.keys(spatialReferenceInfo.services).some(srefServiceName => srefServiceName === serviceName);
+        });
+        return _services.length > 0 ? (h("div", null, h("label", { class: "spatial-ref-item-title" }, this._translations.featureServicesHeading), h("ul", { class: "spatial-ref-services-list" }, _services.map(name => (h("li", { class: "spatial-ref-services-list-item" }, h("label", { class: "switch-label" }, h("calcite-switch", { checked: spatialReferenceInfo.services[name], class: "spatial-ref-item-switch", disabled: this.locked, onCalciteSwitchChange: (event) => this._updateEnabledServices(event, name), scale: "m" }), name))))))) : (null);
     }
-    ;
     /**
      * Enable spatial reference variable for all feature services.
      *
@@ -104,19 +104,40 @@ export class SolutionSpatialRef {
         services.forEach(name => this._updateEnabledServices({ detail: { switched: true } }, name));
     }
     /**
-     * Create a switch control for each of the services
-     *
-     * @param services List of feature services
-     * @returns a node to control each feature service
+     * Updates the enabled/disabled state of the service in spatialReferenceInfo.
      */
-    _getFeatureServices(services) {
-        // verify they are in state
+    _updateEnabledServices(event, name) {
+        var _a, _b;
         const spatialReferenceInfo = state.getStoreInfo("spatialReferenceInfo");
-        const _services = services.filter(s => {
-            return Object.keys(spatialReferenceInfo.services).some(stateService => stateService === s);
+        const enabled = ((_a = event.detail) === null || _a === void 0 ? void 0 : _a.switched) !== undefined // internal event
+            ? event.detail.switched
+            : ((_b = event.target) === null || _b === void 0 ? void 0 : _b.checked) !== undefined // calcite event
+                ? event.target.checked
+                : true;
+        spatialReferenceInfo.services[name] = enabled;
+        state.setStoreInfo("spatialReferenceInfo", spatialReferenceInfo);
+        this.featureServiceSpatialReferenceChange.emit({
+            name,
+            enabled
         });
-        return _services && _services.length > 0 ? (h("div", null, h("label", { class: "spatial-ref-item-title" }, this._translations.featureServicesHeading), _services.map(name => (h("label", { class: "switch-label" }, h("calcite-switch", { checked: spatialReferenceInfo.services[name], class: "spatial-ref-item-switch", disabled: this.locked, onCalciteSwitchChange: (event) => this._updateEnabledServices(event, name), scale: "m" }), name))))) : (null);
     }
+    /**
+     * Toggles the ability to set the default spatial reference.
+     */
+    _updateLocked(event) {
+        this.locked = !event.target.checked;
+        this._updateStore();
+        if (!this.loaded) {
+            // when this is switched on when loading we have reloaded a solution that
+            // has a custom wkid param and we should honor the settings they already have in the templates
+            if (event.target.checked) {
+                // By default enable all Feature Services on first load
+                this._setFeatureServiceDefaults(this.services);
+            }
+            this.loaded = true;
+        }
+    }
+    ;
     /**
      * Updates the enabled and spatialReference prop in spatialReferenceInfo.
      */
@@ -126,18 +147,6 @@ export class SolutionSpatialRef {
         spatialReferenceInfo.spatialReference = this.value;
         state.setStoreInfo("spatialReferenceInfo", spatialReferenceInfo);
     }
-    /**
-     * Updates the enabled/disabled state of the service in spatialReferenceInfo.
-     */
-    _updateEnabledServices(event, name) {
-        const spatialReferenceInfo = state.getStoreInfo("spatialReferenceInfo");
-        spatialReferenceInfo.services[name] = event.target.checked;
-        state.setStoreInfo("spatialReferenceInfo", spatialReferenceInfo);
-        this.featureServiceSpatialReferenceChange.emit({
-            name,
-            enabled: event.target.checked
-        });
-    }
     /**
      * Fetches the component's translations
      *
@@ -178,6 +187,24 @@ export class SolutionSpatialRef {
                 "reflect": true,
                 "defaultValue": "102100"
             },
+            "loaded": {
+                "type": "boolean",
+                "mutable": true,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indicates if the control has been enabled.\r\nThe first time Spatial Reference has been enabled it should enable all feature services."
+                },
+                "attribute": "loaded",
+                "reflect": true,
+                "defaultValue": "false"
+            },
             "locked": {
                 "type": "boolean",
                 "mutable": true,
@@ -234,8 +261,6 @@ export class SolutionSpatialRef {
     }
     static get states() {
         return {
-            "loaded": {},
-            "_srSearchText": {},
             "_translations": {}
         };
     }
@@ -251,9 +276,14 @@ export class SolutionSpatialRef {
                     "text": ""
                 },
                 "complexType": {
-                    "original": "{ name: string, enabled: boolean }",
-                    "resolved": "{ name: string; enabled: boolean; }",
-                    "references": {}
+                    "original": "IFeatureServiceSpatialReferenceChange",
+                    "resolved": "IFeatureServiceSpatialReferenceChange",
+                    "references": {
+                        "IFeatureServiceSpatialReferenceChange": {
+                            "location": "global",
+                            "id": "global::IFeatureServiceSpatialReferenceChange"
+                        }
+                    }
                 }
             }, {
                 "method": "lockedSpatialReferenceChange",
@@ -281,6 +311,12 @@ export class SolutionSpatialRef {
     }
     static get listeners() {
         return [{
+                "name": "solutionStoreHasChanges",
+                "method": "solutionStoreHasChanges",
+                "target": "window",
+                "capture": false,
+                "passive": false
+            }, {
                 "name": "spatialReferenceChange",
                 "method": "spatialReferenceChange",
                 "target": "window",

package/dist/collection/components/solution-spatial-ref/test/solution-spatial-ref.spec.js

@@ -47,30 +47,31 @@ describe('solution-spatial-ref', () => {
         });
         expect(page.root).toEqualHtml(`
       <solution-spatial-ref default-wkid="102100" locked="" value="102100">
-        <div class="spatial-ref">
-          <div class="spatial-ref-desc">
-            <calcite-label></calcite-label>
-          </div>
-          <label class="switch-label">
-            <calcite-switch class="spatial-ref-switch" scale="m"></calcite-switch>
-          </label>
-          <div class="spatial-ref-component" id="spatialRefDefn">
-            <calcite-label>
-              <label class="spatial-ref-default">
-                <spatial-ref defaultwkid="102100" disabled="" value="102100"></spatial-ref>
-              </label>
-            </calcite-label>
-            <div>
-              <label class="spatial-ref-item-title"></label>
-              <label class="switch-label">
-                <calcite-switch checked="" class="spatial-ref-item-switch" disabled="" scale="m"></calcite-switch>
-                Feature Service 1
-              </label>
-              <label class="switch-label">
-                <calcite-switch class="spatial-ref-item-switch" disabled="" scale="m"></calcite-switch>
-                Feature Service 2
-              </label>
-            </div>
+        <label class="switch-label">
+          <calcite-switch class="spatial-ref-switch" scale="m"></calcite-switch>
+        </label>
+        <div class="spatial-ref-component" id="spatialRefDefn">
+          <calcite-label>
+            <label class="spatial-ref-default">
+              <spatial-ref defaultwkid="102100" disabled="" value="102100"></spatial-ref>
+            </label>
+          </calcite-label>
+          <div>
+            <label class="spatial-ref-item-title"></label>
+            <ul class="spatial-ref-services-list">
+              <li class="spatial-ref-services-list-item">
+                <label class="switch-label">
+                  <calcite-switch checked="" class="spatial-ref-item-switch" disabled="" scale="m"></calcite-switch>
+                  Feature Service 1
+                </label>
+              </li>
+              <li class="spatial-ref-services-list-item">
+                <label class="switch-label">
+                  <calcite-switch class="spatial-ref-item-switch" disabled="" scale="m"></calcite-switch>
+                  Feature Service 2
+                </label>
+              </li>
+            </ul>
           </div>
         </div>
       </solution-spatial-ref>

package/dist/collection/components/solution-template-data/solution-template-data.js

@@ -72,7 +72,7 @@ export class SolutionTemplateData {
      * Renders the component.
      */
     render() {
-        return (h(Host, { key: 'f6c478a45be7ba02a79446dca5a12ecb7cfaf817' }, h("div", { key: 'd268f063606f2d0a0dfbe76f0ea907074ac91c60', class: "solution-data-container" }, h("calcite-shell", { key: '170f35aa82ad4e4fbd7e111b558417712396a44d', class: "light var-container", dir: "ltr" }, h("calcite-panel", { key: 'ada2da8d5240d9904cd9021c9573eee5bd8fe6a4', class: "json-editor" }, h("div", { key: '51001e6bcf73ed23d6c76f5d9c17a66b5cbd1d05', class: "solution-data-child-container calcite-match-height" }, h("json-editor", { key: '4390b6ff57b3d6341a8c984e8393badf4122df2a', class: "solution-data-editor-container", instanceid: this.itemId + "|" + this.instanceid, value: this.value }))), h("calcite-shell-panel", { key: '866f4349e9ca6f5e8120479997248c2962c18b90', "height-scale": "l", position: "end", slot: "contextual-panel", "width-scale": "xs" }, h("div", { key: 'adb11719b67d10a9a4da50d79ac23eadc68544a7', class: this.varsOpen ? "solution-data-child-container" : "solution-data-child-container-collapsed" }, h("calcite-button", { key: 'c6a7365e101045ad0f30700e6ba296ff62f0942d', appearance: "transparent", class: "collapse-btn", "icon-start": this.varsOpen ? "chevrons-right" : "chevrons-left", id: "collapse-vars", onClick: () => this._toggleVars(), scale: "s", title: this.varsOpen ? this._translations.collapse : this._translations.expand }), h("div", { key: '76b05d456a9cafd25af16e3848e453ccfda5f1bc', class: this.varsOpen ? "org-vars" : "org-vars display-none", id: "orgVars" }, h("solution-organization-variables", { key: '4b2df6867414d5a6e4e9423b2133196dfd85b3bd', value: this.organizationVariables })), h("div", { key: 'eb5201a82e27a52e0a4f9c38cdc9db3f0c1173d8', class: this.varsOpen ? "sol-vars" : "sol-vars display-none", id: "solVars" }, h("solution-variables", { key: '00dda00409364b66e092e9ec304524c35f7d0704', value: this.solutionVariables }))))))));
+        return (h(Host, { key: '5a417f81d9b0d98ad28f9139406fee4b37204169' }, h("div", { key: '0dd5d77a961473bf45f7654ccb2e0507b492a6c7', class: "solution-data-container" }, h("calcite-shell", { key: '3b839b36a89f1a9db10a6ad8b3f7d088248770bc', class: "light var-container", dir: "ltr" }, h("calcite-panel", { key: '9f6ce42fdad56cf7a9f6b2f9ccac707eb655f4f1', class: "json-editor" }, h("div", { key: 'a1ba50c8fd13cf6d4934aa72083c0519c317721d', class: "solution-data-child-container calcite-match-height" }, h("json-editor", { key: '8f832aecde35b6b82e16b3d201b738fe202e86a3', class: "solution-data-editor-container", instanceid: this.itemId + "|" + this.instanceid, value: this.value }))), h("calcite-shell-panel", { key: 'c24f19fcc440884123f59842b392063925b5cbf6', "height-scale": "l", position: "end", slot: "contextual-panel", "width-scale": "xs" }, h("div", { key: '8d9c25baada3e2ca03ee192f44121d7bdab85432', class: this.varsOpen ? "solution-data-child-container" : "solution-data-child-container-collapsed" }, h("calcite-button", { key: '247b542336578c5404c7246552424c16030d90a7', appearance: "transparent", class: "collapse-btn", "icon-start": this.varsOpen ? "chevrons-right" : "chevrons-left", id: "collapse-vars", onClick: () => this._toggleVars(), scale: "s", title: this.varsOpen ? this._translations.collapse : this._translations.expand }), h("div", { key: '963c1802c7828557cec5493602c3a1669e21683c', class: this.varsOpen ? "org-vars" : "org-vars display-none", id: "orgVars" }, h("solution-organization-variables", { key: '566f672a97401d77ed7180d5fc7b2367027fcc57', value: this.organizationVariables })), h("div", { key: '79508bfcde2ac8507acd40bbc3edceb944c3e717', class: this.varsOpen ? "sol-vars" : "sol-vars display-none", id: "solVars" }, h("solution-variables", { key: '51756082f8d13c73d7ae1349fc5625994a3354bb', value: this.solutionVariables }))))))));
     }
     //--------------------------------------------------------------------------
     //

package/dist/collection/components/solution-variables/solution-variables.js

@@ -44,7 +44,7 @@ export class SolutionVariables {
      * Renders the component.
      */
     render() {
-        return (h(Host, { key: '6673253cf19a8d760dc1444feef39a74258d01ed' }, h("div", { key: '44e5a11c8f31558baf8458cc883e579f2f23ff47' }, h("h4", { key: 'f8b7a19e4a9eb4860015cfdb6c55c2b94d66a222', class: "org-var-header" }, this._translations.solVariables)), h("div", { key: 'ffb70400c5fd22a944328672e7eaefa5918fce5c', class: "container-border" }, h("calcite-tree", { key: 'de81612c2a603f17b1bcb58f0b750401db0d4f20', id: "variable-label" }, this._renderHierarchy(this._solutionVariables)))));
+        return (h(Host, { key: '4367694cf20a2063b57679f1a955ef827eea1c05' }, h("div", { key: '875e6e1532e7406ddf6cca804e421980aa23b7cd' }, h("h4", { key: 'b6798506cf71d3c84e2c33a3d12a0729591a73a7', class: "org-var-header" }, this._translations.solVariables)), h("div", { key: '413d3c7ebae5afa05a8cb5c87f766db64f43e106', class: "container-border" }, h("calcite-tree", { key: 'ba5bf27e005ce7536cdfe0c8022c96cd0b4ad920', id: "variable-label" }, this._renderHierarchy(this._solutionVariables)))));
     }
     //--------------------------------------------------------------------------
     //

package/dist/collection/components/spatial-ref/spatial-ref.js

@@ -64,7 +64,7 @@ export class SpatialRef {
      * Renders the component.
      */
     render() {
-        return (h(Host, { key: '0ca21876510da4276c6fd31885eed7dc15db70ad' }, h("div", { key: '90ff94d67604a66f20d30276a1b573affccf5eb2' }, h("calcite-input", { key: '35e207303270345e457406e26689f58bf5387d43', disabled: this.disabled, id: "calcite-sr-search", onKeyUp: (evt) => this._searchInputKeyDown(evt), placeholder: this._translations.spatialReferencePlaceholder }), h("calcite-tree", { key: '0b73019247c134d0cfcdf8e84544622907a40a80', id: "calcite-sr-tree", slot: "children" }, this._getTreeContent()))));
+        return (h(Host, { key: '23f3f6ff3d7eeeaeb8fb916532302a241fdbc078' }, h("div", { key: 'ea7631c0c26d451a72bd68e24ccb3ac757cf73f3' }, h("calcite-input", { key: '32d27336b3bc34ee6cd0d3c7ac3e52de7ee8011e', disabled: this.disabled, id: "calcite-sr-search", onKeyUp: (evt) => this._searchInputKeyDown(evt), placeholder: this._translations.spatialReferencePlaceholder }), h("calcite-tree", { key: '927f03277a45d5cf256306a2246bccffc0d296cb', id: "calcite-sr-tree", slot: "children" }, this._getTreeContent()))));
     }
     //--------------------------------------------------------------------------
     //

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

@@ -1,3 +1,5 @@
+import state from "../../utils/solution-store";
+import { getFeatureServices, /*getModels,*/ getSpatialReferenceInfo } from "../../utils/templates";
 export class StoreManager {
     constructor() {
         this.value = "";
@@ -20,26 +22,22 @@ export class StoreManager {
     }
     /**
      * Initialize the observer that will monitor and respond to changes in the value.
-     * When we get a new value we are dealinmg with a new solution and need to fetch the items data and load the state.
+     * When we get a new value we are dealing with a new solution and need to fetch the item's data and load the state.
      */
     _initValueObserver() {
-        //const self = this;
+        const self = this;
         this._valueObserver = new MutationObserver(ml => {
             ml.some(mutation => {
                 const newValue = mutation.target[mutation.attributeName];
                 if (mutation.type === 'attributes' && mutation.attributeName === "value" &&
                     newValue !== mutation.oldValue && newValue !== "") {
-                    /*
-                    const v = JSON.parse(newValue);
-                    // eslint-disable-next-line @typescript-eslint/no-floating-promises
-                    getItemDataAsJson(v, self.authentication).then(data => {
-                      state.models = getModels(Array.isArray(v) ? v : [v], self.authentication, v);
-                      state.featureServices = getFeatureServices(Array.isArray(v) ? v : [v])
-                      state.get("spatialReferenceInfo") = getSpatialReferenceInfo(state.featureServices, data);
-                      self.templates = v;
-                      self.stateLoaded.emit(state);
-                    });
-                    */
+                    const solutionData = JSON.parse(newValue);
+                    state.setStoreInfo("solutionData", solutionData);
+                    const services = getFeatureServices(solutionData.templates);
+                    state.setStoreInfo("featureServices", services);
+                    state.setStoreInfo("spatialReferenceInfo", getSpatialReferenceInfo(services, solutionData));
+                    //self.templates = solutionData;
+                    self.stateLoaded.emit(state);
                     return true;
                 }
             });