@esri/solutions-components 0.0.2 → 0.0.3

package/dist/esm/solution-configuration.entry.js

@@ -4,8 +4,12 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  */
 import { r as registerInstance, h, H as Host, g as getElement } from './index-a3c3e3db.js';
-import { g as getModels, a as getFeatureServices, b as getSpatialReferenceInfo, c as getInventoryItems, d as getSolutionVariables, e as getOrganizationVariables } from './templates-3480c08e.js';
-import { s as state } from './editStore-30a293f5.js';
+import { g as getItemDataAsJson, a as getModels, b as getFeatureServices, c as getSpatialReferenceInfo, d as getInventoryItems, e as getSolutionVariables, f as getOrganizationVariables } from './templates-c15e0de2.js';
+import { s as state } from './editStore-197be454.js';
+import { s as save } from './common-70333fb9.js';
+import { g as getProp, c as cloneObject, s as setProp, a as setCreateProp } from './generalHelpers-91e92dc0.js';
+import './request-9c2c9a49.js';
+import './_commonjsHelpers-84c626bc.js';
 
 const solutionConfigurationCss = ".configuration-container{position:relative;width:100%;height:100%}.configuration{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;padding:8px;border:1px gray solid}.config-tabs{width:100%}.config-tab{width:100%}.config-solution{position:absolute;top:56px;right:-1px;bottom:-1px;left:-1px;display:flex;padding:8px}.config-inventory{display:inline;flex-grow:0;overflow-y:auto;max-width:min-content}.config-inventory-hide{display:none;flex-grow:0;overflow-y:auto;max-width:min-content}.config-item{display:inline;margin-left:8px;flex-grow:1;overflow-y:auto;position:relative}html[dir=\"rtl\"] .config-item{margin-left:0;margin-right:8px}solution-contents{height:100%;position:relative}solution-item{height:100%;position:relative}solution-spatial-ref{width:100%;height:100%;position:relative;overflow-y:auto}";
 
@@ -39,10 +43,18 @@ let SolutionConfiguration = class {
       properties: {},
       type: ""
     };
+    /**
+     * Contains the current solution item id
+     */
+    this.itemid = "";
     /**
      * Used to show/hide the content tree
      */
     this.treeOpen = true;
+    /**
+    * Contains the current solution item id
+    */
+    this.sourceItemData = {};
   }
   //--------------------------------------------------------------------------
   //
@@ -50,10 +62,11 @@ let SolutionConfiguration = class {
   //
   //--------------------------------------------------------------------------
   connectedCallback() {
-    this._initTemplatesObserver();
+    this._initObserver();
   }
   render() {
-    return (h(Host, null, h("div", { class: "configuration-container" }, h("div", { class: "configuration" }, h("calcite-tabs", { class: "config-tabs" }, h("calcite-tab-nav", { slot: "tab-nav" }, h("calcite-tab-title", null, this.translations.definitionTab), h("calcite-tab-title", null, this.translations.spatialReferenceTab)), h("calcite-tab", { active: true, class: "config-tab" }, h("div", { class: "config-solution" }, h("div", { class: this.treeOpen ? "config-inventory" : "config-inventory-hide" }, h("solution-contents", { id: "configInventory", key: `${this.solutionItemId}-contents`, translations: this.translations, value: this.value.contents })), h("calcite-button", { appearance: "transparent", class: "collapse-btn", "icon-start": this.treeOpen ? "chevrons-left" : "chevrons-right", id: "collapse-vars", onClick: () => this._toggleTree(), scale: "s", title: this.translations.cancelEdits }), h("div", { class: "config-item" }, h("solution-item", { key: `${this.solutionItemId}-item`, organizationVariables: this._organizationVariables, solutionVariables: this._solutionVariables, translations: this.translations, value: this.item })))), h("calcite-tab", { class: "config-tab" }, h("div", { class: "config-solution" }, h("solution-spatial-ref", { id: "configure-solution-spatial-ref", key: `${this.solutionItemId}-spatial-ref`, services: state.featureServices, translations: this.translations }))))))));
+    const wkid = getProp(state.spatialReferenceInfo, "spatialReference.wkid");
+    return (h(Host, null, h("div", { class: "configuration-container" }, h("div", { class: "configuration" }, h("calcite-tabs", { class: "config-tabs" }, h("calcite-tab-nav", { slot: "tab-nav" }, h("calcite-tab-title", null, this.translations.definitionTab), h("calcite-tab-title", null, this.translations.spatialReferenceTab)), h("calcite-tab", { active: true, class: "config-tab" }, h("div", { class: "config-solution" }, h("div", { class: this.treeOpen ? "config-inventory" : "config-inventory-hide" }, h("solution-contents", { id: "configInventory", key: `${this.itemid}-contents`, translations: this.translations, value: this.value.contents })), h("calcite-button", { appearance: "transparent", class: "collapse-btn", "icon-start": this.treeOpen ? "chevrons-left" : "chevrons-right", id: "collapse-vars", onClick: () => this._toggleTree(), scale: "s", title: this.translations.cancelEdits }), h("div", { class: "config-item" }, h("solution-item", { key: `${this.itemid}-item`, organizationVariables: this._organizationVariables, solutionVariables: this._solutionVariables, translations: this.translations, value: this.item })))), h("calcite-tab", { class: "config-tab" }, h("div", { class: "config-solution" }, h("solution-spatial-ref", { defaultWkid: wkid, id: "configure-solution-spatial-ref", key: `${this.itemid}-spatial-ref`, locked: !wkid, services: state.featureServices.map(fs => fs.name), translations: this.translations }))))))));
   }
   //--------------------------------------------------------------------------
   //
@@ -79,22 +92,32 @@ let SolutionConfiguration = class {
   async getSpatialReferenceInfo() {
     return Promise.resolve(state.spatialReferenceInfo);
   }
+  async getSourceTemplates() {
+    return Promise.resolve(this.templates);
+  }
+  async save() {
+    return Promise.resolve(this._save());
+  }
   //--------------------------------------------------------------------------
   //
   //  Private Methods
   //
   //--------------------------------------------------------------------------
   /**
-   * Observe changes to the templates prop
+   * Observe changes to the props
    */
-  _initTemplatesObserver() {
+  _initObserver() {
     this._templatesObserver = new MutationObserver(ml => {
       ml.some(mutation => {
-        if (mutation.type === 'attributes' && mutation.attributeName === "templates" &&
-          mutation.target[mutation.attributeName] !== mutation.oldValue) {
-          const v = JSON.parse(mutation.target[mutation.attributeName]);
-          this._initProps(v);
-          this._initState(v);
+        const v = mutation.target[mutation.attributeName];
+        if (mutation.type === 'attributes' && mutation.attributeName === "itemid" && v && v !== mutation.oldValue) {
+          // eslint-disable-next-line @typescript-eslint/no-floating-promises
+          getItemDataAsJson(v, this.authentication).then(data => {
+            this.sourceItemData = data;
+            this.templates = data.templates;
+            this._initProps(this.templates);
+            this._initState(this.templates);
+          });
           return true;
         }
       });
@@ -107,7 +130,7 @@ let SolutionConfiguration = class {
   _initState(v) {
     state.models = getModels(v);
     state.featureServices = getFeatureServices(v);
-    state.spatialReferenceInfo = getSpatialReferenceInfo(state.featureServices);
+    state.spatialReferenceInfo = getSpatialReferenceInfo(state.featureServices, this.sourceItemData);
     this.modelsSet = true;
   }
   /**
@@ -132,10 +155,145 @@ let SolutionConfiguration = class {
   _toggleTree() {
     this.treeOpen = !this.treeOpen;
   }
+  /**
+   * Save all edits from the current configuration
+   *
+   * @returns a response that will indicate success or failure and any associated messages
+   */
+  async _save() {
+    const templateUpdates = await this._updateTemplates();
+    const data = this._setSrInfo(templateUpdates.templates);
+    return templateUpdates.errors.length === 0 ? save(this.itemid, data, this.authentication, this.translations, "") : {
+      success: false,
+      message: `The following templates have errors: ${templateUpdates.errors.join(", ")}`
+    };
+  }
+  /**
+   * Update the solutions templates based on the stored changes
+   *
+   * @returns an object that contains the updated templates as well as any errors that were found
+   */
+  async _updateTemplates() {
+    const errors = [];
+    const models = await this.getEditModels();
+    let templates = cloneObject(this.templates);
+    Object.keys(models).forEach(k => {
+      const m = models[k];
+      templates = templates.map(t => {
+        if (t.itemId === m.itemId) {
+          this._setItem(t, m);
+          const hasDataError = this._setData(t, m);
+          const hasPropError = this._setProps(t, m);
+          if (hasDataError || hasPropError) {
+            errors.push(m.itemId);
+          }
+        }
+        return t;
+      });
+    });
+    errors.concat(window.monaco.editor.getModelMarkers({}));
+    return Promise.resolve({
+      templates,
+      errors
+    });
+  }
+  /**
+   * Set a templates data property with changes from the models
+   *
+   * @param template the current template to update
+   * @param model the corresponding model for the current template (stores any user changes)
+   *
+   * @returns a boolean that indicates if any errors were detected
+   */
+  _setData(template, model) {
+    return this._setTemplateProp(template, model.dataOriginValue, model.dataModel.getValue(), "data");
+  }
+  /**
+   * Set a templates properties property with changes from the models
+   *
+   * @param template the current template to update
+   * @param model the corresponding model for the current template (stores any user changes)
+   *
+   * @returns a boolean that indicates if any errors were detected
+   */
+  _setProps(template, model) {
+    return this._setTemplateProp(template, model.propsOriginValue, model.propsModel.getValue(), "properties");
+  }
+  /**
+   * Generic function used to set properties or data property on a given template
+   *
+   * @param template the current template to update
+   * @param originValue the original value from the solution template
+   * @param modelValue the current value from the model (will contain any edits that have been made)
+   * @param path the path to the property we should update if any changes are found
+   *
+   * @returns a boolean that indicates if any errors were detected
+   */
+  _setTemplateProp(template, originValue, modelValue, path) {
+    let hasError = false;
+    try {
+      const _originValue = JSON.parse(originValue);
+      const _modelValue = JSON.parse(modelValue);
+      if (_originValue && _modelValue && (JSON.stringify(_originValue) !== JSON.stringify(_modelValue))) {
+        setProp(template, path, _modelValue);
+      }
+    }
+    catch (e) {
+      console.error(e);
+      hasError = true;
+    }
+    return hasError;
+  }
+  /**
+   * Set a templates item property with changes from the models
+   *
+   * @param template the current template to update
+   * @param model the corresponding model for the current template (stores any user changes)
+   *
+   * This function will update the template argument when edits are found
+   */
+  _setItem(template, model) {
+    if (model.updateItemValues && Object.keys(model.updateItemValues).length > 0) {
+      Object.keys(model.updateItemValues).forEach(k => {
+        template.item[k] = model.updateItemValues[k];
+      });
+    }
+  }
+  /**
+   * Set spatial reference info in the solutions data
+   *
+   * @returns a cloned copy of the solutions data that has been updated with spatial reference info
+   *
+   */
+  _setSrInfo(templates) {
+    const srInfo = state.spatialReferenceInfo;
+    const serviceEnabled = typeof (srInfo === null || srInfo === void 0 ? void 0 : srInfo.services) === 'undefined' ?
+      false : Object.keys(srInfo.services).some(k => srInfo.services[k]);
+    const data = cloneObject(this.sourceItemData);
+    data.templates = templates;
+    if (srInfo && srInfo.enabled && serviceEnabled) {
+      const wkid = srInfo.spatialReference.wkid.toString();
+      const wkidParam = {
+        "label": "Spatial Reference",
+        "default": wkid,
+        "valueType": "spatialReference",
+        "attributes": {
+          "required": "true"
+        }
+      };
+      const params = getProp(data, "params");
+      const hasWkid = params && params.wkid;
+      setCreateProp(data, hasWkid ? "params.wkid.default" : "params.wkid", hasWkid ? wkid : params ? wkidParam : wkid);
+    }
+    else if (!srInfo.enabled) {
+      if (getProp(data, "params.wkid")) {
+        delete (data.params.wkid);
+      }
+    }
+    return data;
+  }
   get el() { return getElement(this); }
 };
 SolutionConfiguration.style = solutionConfigurationCss;
 
 export { SolutionConfiguration as solution_configuration };
-
-//# sourceMappingURL=solution-configuration.entry.js.map

package/dist/esm/solution-contents_3.entry.js

@@ -4,8 +4,10 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  */
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-a3c3e3db.js';
-import { s as state } from './editStore-30a293f5.js';
-import { g as getProp, n as nodeListToArray } from './common-ccccf04d.js';
+import { s as state } from './editStore-197be454.js';
+import { n as nodeListToArray } from './common-70333fb9.js';
+import './_commonjsHelpers-84c626bc.js';
+import './request-9c2c9a49.js';
 
 const solutionContentsCss = ".icon-text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}";
 
@@ -27,6 +29,11 @@ let SolutionContents = class {
      */
     this.value = [];
   }
+  valueWatchHandler(v, oldV) {
+    if (v && v !== oldV && Array.isArray(v) && v.length > 0) {
+      this._treeItemSelected(v[0].solutionItem);
+    }
+  }
   //--------------------------------------------------------------------------
   //
   //  Lifecycle
@@ -64,10 +71,13 @@ let SolutionContents = class {
   }
   static get assetsDirs() { return ["item-type-icons"]; }
   get el() { return getElement(this); }
+  static get watchers() { return {
+    "value": ["valueWatchHandler"]
+  }; }
 };
 SolutionContents.style = solutionContentsCss;
 
-const solutionItemCss = ".configuration-container{position:relative;width:100%;height:100%}.configuration{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;padding:8px;border:1px gray solid}.config-tabs{width:100%}.config-tab{width:100%;overflow-y:auto}";
+const solutionItemCss = ".configuration-container{position:relative;width:100%;height:100%}.configuration{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;padding:8px;border:1px gray solid}.config-tabs{width:100%}.config-tab{width:100%;overflow-y:auto;height:inherit}";
 
 let SolutionItem = class {
   constructor(hostRef) {
@@ -21177,6 +21187,7 @@ let SolutionSpatialRef = class {
   //--------------------------------------------------------------------------
   constructor(hostRef) {
     registerInstance(this, hostRef);
+    this.featureServiceSpatialReferenceChange = createEvent(this, "featureServiceSpatialReferenceChange", 7);
     //--------------------------------------------------------------------------
     //
     //  Properties (public)
@@ -21187,6 +21198,11 @@ let SolutionSpatialRef = class {
     */
     this.defaultWkid = 102100;
     /**
+    * Indicates if the control has been enabled.
+    * The first time Spatial Reference has been enabled it should enable all feature services.
+    */
+    this.loaded = false;
+    /**
     * When true, all but the main switch are disabled to prevent interaction.
     */
     this.locked = true;
@@ -21214,16 +21230,6 @@ let SolutionSpatialRef = class {
   }
   //--------------------------------------------------------------------------
   //
-  //  Event Listeners
-  //
-  //--------------------------------------------------------------------------
-  //--------------------------------------------------------------------------
-  //
-  //  Events
-  //
-  //--------------------------------------------------------------------------
-  //--------------------------------------------------------------------------
-  //
   //  Public Methods (async)
   //
   //--------------------------------------------------------------------------
@@ -21297,8 +21303,28 @@ let SolutionSpatialRef = class {
   _updateLocked(event) {
     this.locked = !event.detail.switched;
     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.detail.switched) {
+        // By default enable all Feature Services on first load
+        this._setFeatureServiceDefaults(this.services);
+      }
+      this.loaded = true;
+    }
   }
   ;
+  /**
+   * Enable spatial reference variable for all feature services.
+   *
+   * @param services list of service names
+   */
+  _setFeatureServiceDefaults(services) {
+    // switch all spatial-ref-item-switch
+    const fsNodes = nodeListToArray(this.el.getElementsByClassName("spatial-ref-item-switch"));
+    fsNodes.forEach((node) => node.checked = true);
+    services.forEach(name => this._updateEnabledServices({ detail: { switched: true } }, name));
+  }
   /**
    * Stores the wkid as the components value.
    */
@@ -21332,67 +21358,17 @@ let SolutionSpatialRef = class {
   _updateStore() {
     state.spatialReferenceInfo["enabled"] = !this.locked;
     state.spatialReferenceInfo["spatialReference"] = this.spatialRef;
-    this._updateEditModels();
   }
   /**
    * Updates the enabled/disabled state of the service in spatialReferenceInfo.
    */
   _updateEnabledServices(event, name) {
     state.spatialReferenceInfo["services"][name] = event.detail.switched;
-    this._updateEditModels(name);
-  }
-  /**
-   * When the spatial reference param is enabled/disabled..we need to handle all feature services that
-   * are listed in state.services.
-   * When an individual service is enabled/disabled we only need to handle it.
-   *
-   * @param services List of feature services
-   */
-  _updateEditModels(name) {
-    Object.keys(state.models || {}).forEach(k => {
-      var _a;
-      const m = state.models[k];
-      const nameMatch = name && name === m.name;
-      const serviceMatch = name === undefined &&
-        Object.keys(state.spatialReferenceInfo["services"]).indexOf(m.name) > -1;
-      if (nameMatch || serviceMatch) {
-        const updateModel = (_a = m.propsModel) === null || _a === void 0 ? void 0 : _a.getValue();
-        if (updateModel) {
-          const active = getProp(state, `spatialReferenceInfo.services.${m === null || m === void 0 ? void 0 : m.name}`) || false;
-          const enabled = getProp(state, 'spatialReferenceInfo.enabled') || false;
-          m.propsModel.setValue(JSON.stringify(this._updateData(updateModel, enabled, active, m.spatialReference), null, '\t'));
-          m.propsDiffOriginValue = JSON.stringify(this._updateData(m.propsDiffOriginValue, enabled, active, m.spatialReference));
-        }
-      }
+    this.featureServiceSpatialReferenceChange.emit({
+      name,
+      enabled: event.detail.switched
     });
   }
-  /**
-   * Updates the services spatial reference by setting the wkid param value and removing latestWkid when enabled and active
-   * OR
-   * Sets the spatial reference back to the original spatialReference when disabled
-   *
-   * @param updateModel The model to update
-   * @param enabled Is the param enabled
-   * @param active Is the service enabled
-   * @param spatialReference The original source spatial reference
-   */
-  _updateData(updateModel, enabled, active, spatialReference) {
-    var _a;
-    const data = typeof (updateModel) === "string" ? JSON.parse(updateModel) : updateModel;
-    if (enabled && active) {
-      const wkid = this.spatialRef.wkid;
-      if (wkid) {
-        data.service.spatialReference.wkid = `{{params.wkid||${wkid}}}`;
-        if (data.service.spatialReference.latestWkid) {
-          delete (data.service.spatialReference.latestWkid);
-        }
-      }
-    }
-    else if ((_a = data.service) === null || _a === void 0 ? void 0 : _a.spatialReference) {
-      data.service.spatialReference = spatialReference;
-    }
-    return data;
-  }
   /**
    * Select the first child on Enter key click
    * OR
@@ -21484,5 +21460,3 @@ let SolutionSpatialRef = class {
 SolutionSpatialRef.style = solutionSpatialRefCss;
 
 export { SolutionContents as solution_contents, SolutionItem as solution_item, SolutionSpatialRef as solution_spatial_ref };
-
-//# sourceMappingURL=solution-contents_3.entry.js.map