@esri/solutions-components 0.2.3 → 0.2.4

package/dist/collection/components/solution-config-modal/solution-config-modal.js

@@ -0,0 +1,245 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+/** @license
+ * Copyright 2022 Esri
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { h, Host } from "@stencil/core";
+import "@esri/calcite-components";
+import { getLocaleComponentStrings } from "../../utils/locale";
+export class SolutionConfigModal {
+  //--------------------------------------------------------------------------
+  //
+  //  Lifecycle
+  //
+  //--------------------------------------------------------------------------
+  constructor() {
+    this.cacheBreaker = undefined;
+    this.serializedAuthentication = "";
+    this.solutionTitle = "";
+    this.solutionItemId = undefined;
+    this._canSave = false;
+    this._translations = undefined;
+    //console.log("MODAL constructor " + this.solutionItemId);//??? + " open:" + this._modalIsOpen);//???
+    window.addEventListener("solutionCanSave", (evt) => {
+      this._canSave = evt.detail;
+    });
+  }
+  async valueWatchHandler() {
+    console.log("MODAL watch " + this.solutionItemId); //???
+  }
+  /**
+   * StencilJS: Called once just after the component is first connected to the DOM.
+   *
+   * @returns Promise when complete
+   */
+  async componentWillLoad() {
+    return this._getTranslations();
+  }
+  componentWillRender() {
+    console.log("MODAL will render " + this.solutionTitle + " (" + this.solutionItemId + ", " + this.cacheBreaker + ")"); //???
+  }
+  /**
+   * Renders the component.
+   */
+  render() {
+    const cacheBreakerParts = this.cacheBreaker.split("_");
+    if (!this.solutionItemId && cacheBreakerParts.length === 2) {
+      this.solutionItemId = cacheBreakerParts[0];
+    }
+    const modalIsOpen = !!this.solutionItemId;
+    console.log("MODAL render " + this.solutionTitle + " (" + this.solutionItemId + ", " + this.cacheBreaker + ")" + " open:" + modalIsOpen.toString()); //???
+    return (h(Host, null, h("calcite-modal", { "aria-labelledby": "solutions-modal-title", fullscreen: "", "intl-close": this._translations.cancel, onCalciteModalClose: () => this._cancel(), open: modalIsOpen, ref: (el) => this._modal = el }, h("h3", { id: "solutions-modal-title", slot: "header" }, this._translations.title.replace("{{solutionName}}", this.solutionTitle)), h("div", { class: "solutions-modal-content", id: "solutions-modal-content", slot: "content" }, h("solution-configuration", { ref: (el) => (this._configuration = el), "serialized-authentication": this.serializedAuthentication, "solution-item-id": this.solutionItemId })), h("calcite-button", { appearance: "outline", disabled: !this._canSave, onClick: () => this._cancel(), ref: (el) => (this._cancelBtn = el), slot: "secondary", width: "full" }, this._translations.cancel), h("calcite-button", { appearance: "solid", disabled: !this._canSave, onClick: () => this._save(), ref: (el) => (this._saveBtn = el), slot: "primary", width: "full" }, this._translations.save))));
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Public Methods (async)
+  //
+  //--------------------------------------------------------------------------
+  //--------------------------------------------------------------------------
+  //
+  //  Private Methods
+  //
+  //--------------------------------------------------------------------------
+  async _cancel() {
+    console.log("MODAL cancel " + this.solutionItemId); //???
+    this._cancelBtn.disabled = this._saveBtn.disabled = true;
+    this._canSave
+      ? confirm("Save changes?")
+        ? await this._saveChanges()
+        : await this._cancelChanges()
+      : await this._cancelChanges();
+    this._closeModal();
+  }
+  async _cancelChanges() {
+    console.log("MODAL cancelChanges"); //???
+    this._canSave = false;
+    await this._configuration.unloadSolution();
+  }
+  _closeModal() {
+    console.log("MODAL close"); //???
+    this.solutionItemId = "";
+    //this.solutionTitle = "";
+    this.cacheBreaker = "";
+    this.solutionConfigModalClosed.emit();
+  }
+  // Save changes and close the modal
+  async _save() {
+    console.log("MODAL save " + this.solutionItemId); //???
+    this._cancelBtn.disabled = this._saveBtn.disabled = true;
+    if (this._canSave) {
+      await this._saveChanges();
+    }
+  }
+  async _saveChanges() {
+    console.log("MODAL saveChanges"); //???
+    try {
+      this._canSave = false;
+      await this._configuration.saveSolution();
+    }
+    catch (error) {
+      //reportError("Unable to save", error.originalMessage);
+      console.log("Unable to save", error.originalMessage);
+    }
+  }
+  /**
+   * Fetches the component's translations
+   *
+   * @protected
+   */
+  async _getTranslations() {
+    const translations = await getLocaleComponentStrings(this.el);
+    this._translations = translations[0];
+  }
+  static get is() { return "solution-config-modal"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["solution-config-modal.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["solution-config-modal.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "cacheBreaker": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "cache-breaker",
+        "reflect": false
+      },
+      "serializedAuthentication": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Credentials for requests in a serialized form"
+        },
+        "attribute": "serialized-authentication",
+        "reflect": false,
+        "defaultValue": "\"\""
+      },
+      "solutionTitle": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "solution-title",
+        "reflect": false,
+        "defaultValue": "\"\""
+      },
+      "solutionItemId": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Contains the current solution item id"
+        },
+        "attribute": "solution-item-id",
+        "reflect": false
+      }
+    };
+  }
+  static get states() {
+    return {
+      "_canSave": {},
+      "_translations": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "solutionConfigModalClosed",
+        "name": "solutionConfigModalClosed",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }];
+  }
+  static get elementRef() { return "el"; }
+  static get watchers() {
+    return [{
+        "propName": "solutionItemId",
+        "methodName": "valueWatchHandler"
+      }];
+  }
+}
+//# sourceMappingURL=solution-config-modal.js.map

package/dist/collection/components/solution-config-modal/solution-config-modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"solution-config-modal.js","sourceRoot":"","sources":["../../../src/components/solution-config-modal/solution-config-modal.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAS,KAAK,EAAE,MAAM,eAAe,CAAC;AAC5G,OAAO,0BAA0B,CAAC;AAElC,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAO/D,MAAM,OAAO,mBAAmB;EAkC9B,4EAA4E;EAC5E,EAAE;EACF,aAAa;EACb,EAAE;EACF,4EAA4E;EAE5E;;oCAnBoD,EAAE;yBAEb,EAAE;;oBAkHb,KAAK;;IAhGjC,qGAAqG;IAErG,MAAM,CAAC,gBAAgB,CAAC,iBAAiB,EACvC,CAAC,GAAG,EAAE,EAAE;MACN,IAAI,CAAC,QAAQ,GAAI,GAAW,CAAC,MAAiB,CAAC;IACjD,CAAC,CACF,CAAC;GACH;EAlBwB,KAAK,CAAC,iBAAiB;IAC9C,OAAO,CAAC,GAAG,CAAC,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC,CAAC,CAAA,KAAK;EACzD,CAAC;EAkBD;;;;KAIG;EACH,KAAK,CAAC,iBAAiB;IACrB,OAAO,IAAI,CAAC,gBAAgB,EAAE,CAAC;EACjC,CAAC;EAED,mBAAmB;IACjB,OAAO,CAAC,GAAG,CAAC,oBAAoB,GAAG,IAAI,CAAC,aAAa,GAAG,IAAI,GAAG,IAAI,CAAC,cAAc,GAAG,IAAI,GAAG,IAAI,CAAC,YAAY,GAAG,GAAG,CAAC,CAAC,CAAA,KAAK;EAC5H,CAAC;EAED;;KAEG;EACH,MAAM;IACJ,MAAM,iBAAiB,GAAG,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IACvD,IAAI,CAAC,IAAI,CAAC,cAAc,IAAI,iBAAiB,CAAC,MAAM,KAAK,CAAC,EAAE;MAC1D,IAAI,CAAC,cAAc,GAAG,iBAAiB,CAAC,CAAC,CAAC,CAAC;KAC5C;IAED,MAAM,WAAW,GAAG,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC;IAC1C,OAAO,CAAC,GAAG,CAAC,eAAe,GAAG,IAAI,CAAC,aAAa,GAAG,IAAI,GAAG,IAAI,CAAC,cAAc,GAAG,IAAI,GAAG,IAAI,CAAC,YAAY,GAAG,GAAG,GAAG,QAAQ,GAAG,WAAW,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAA,KAAK;IACzJ,OAAO,CACL,EAAC,IAAI;MACH,wCACkB,uBAAuB,EACvC,UAAU,EAAC,EAAE,gBACD,IAAI,CAAC,aAAa,CAAC,MAAM,EACrC,mBAAmB,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,EAAE,EACzC,IAAI,EAAE,WAAW,EACjB,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,GAAG,EAAE;QAE7B,UACE,EAAE,EAAC,uBAAuB,EAC1B,IAAI,EAAC,QAAQ,IAEZ,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,OAAO,CAAC,kBAAkB,EAAE,IAAI,CAAC,aAAa,CAAC,CACtE;QACL,WACE,KAAK,EAAC,yBAAyB,EAC/B,EAAE,EAAC,yBAAyB,EAC5B,IAAI,EAAC,SAAS;UAEd,8BACE,GAAG,EAAG,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC,+BACb,IAAI,CAAC,wBAAwB,sBACtC,IAAI,CAAC,cAAc,GACrC,CACE;QACN,sBACE,UAAU,EAAC,SAAS,EACpB,QAAQ,EAAE,CAAC,IAAI,CAAC,QAAQ,EACxB,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,EAAE,EAC7B,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC,EACnC,IAAI,EAAC,WAAW,EAChB,KAAK,EAAC,MAAM,IAEX,IAAI,CAAC,aAAa,CAAC,MAAM,CACX;QACjB,sBACE,UAAU,EAAC,OAAO,EAClB,QAAQ,EAAE,CAAC,IAAI,CAAC,QAAQ,EACxB,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,EAC3B,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC,EACjC,IAAI,EAAC,SAAS,EACd,KAAK,EAAC,MAAM,IAEX,IAAI,CAAC,aAAa,CAAC,IAAI,CACT,CACH,CACX,CACR,CAAC;EACJ,CAAC;EA2CD,4EAA4E;EAC5E,EAAE;EACF,0BAA0B;EAC1B,EAAE;EACF,4EAA4E;EAE5E,4EAA4E;EAC5E,EAAE;EACF,mBAAmB;EACnB,EAAE;EACF,4EAA4E;EAElE,KAAK,CAAC,OAAO;IACrB,OAAO,CAAC,GAAG,CAAC,eAAe,GAAG,IAAI,CAAC,cAAc,CAAC,CAAC,CAAA,KAAK;IACxD,IAAI,CAAC,UAAU,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAQ,GAAG,IAAI,CAAC;IACzD,IAAI,CAAC,QAAQ;MACX,CAAC,CAAC,OAAO,CAAC,eAAe,CAAC;QACxB,CAAC,CAAC,MAAM,IAAI,CAAC,YAAY,EAAE;QAC3B,CAAC,CAAC,MAAM,IAAI,CAAC,cAAc,EAAE;MAC/B,CAAC,CAAC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAChC,IAAI,CAAC,WAAW,EAAE,CAAC;EACrB,CAAC;EAES,KAAK,CAAC,cAAc;IAC5B,OAAO,CAAC,GAAG,CAAC,qBAAqB,CAAC,CAAC,CAAA,KAAK;IACxC,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;IACtB,MAAM,IAAI,CAAC,cAAc,CAAC,cAAc,EAAE,CAAC;EAC7C,CAAC;EAES,WAAW;IACnB,OAAO,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC,CAAA,KAAK;IAChC,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC;IACzB,0BAA0B;IAC1B,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;IACvB,IAAI,CAAC,yBAAyB,CAAC,IAAI,EAAE,CAAC;EACxC,CAAC;EAED,mCAAmC;EACzB,KAAK,CAAC,KAAK;IACnB,OAAO,CAAC,GAAG,CAAC,aAAa,GAAG,IAAI,CAAC,cAAc,CAAC,CAAC,CAAA,KAAK;IACtD,IAAI,CAAC,UAAU,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAQ,GAAG,IAAI,CAAC;IACzD,IAAI,IAAI,CAAC,QAAQ,EAAE;MACjB,MAAM,IAAI,CAAC,YAAY,EAAE,CAAC;KAC3B;EACH,CAAC;EAES,KAAK,CAAC,YAAY;IAC1B,OAAO,CAAC,GAAG,CAAC,mBAAmB,CAAC,CAAC,CAAA,KAAK;IACtC,IAAI;MACF,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;MACtB,MAAM,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;KAC1C;IAAC,OAAO,KAAK,EAAE;MACd,uDAAuD;MACvD,OAAO,CAAC,GAAG,CAAC,gBAAgB,EAAE,KAAK,CAAC,eAAe,CAAC,CAAC;KACtD;EACH,CAAC;EAED;;;;KAIG;EACO,KAAK,CAAC,gBAAgB;IAC9B,MAAM,YAAY,GAAG,MAAM,yBAAyB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAC9D,IAAI,CAAC,aAAa,GAAG,YAAY,CAAC,CAAC,CAAmC,CAAC;EACzE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/** @license\r\n * Copyright 2022 Esri\r\n *\r\n * Licensed under the Apache License, Version 2.0 (the \"License\");\r\n * you may not use this file except in compliance with the License.\r\n * You may obtain a copy of the License at\r\n *\r\n *    http://www.apache.org/licenses/LICENSE-2.0\r\n *\r\n * Unless required by applicable law or agreed to in writing, software\r\n * distributed under the License is distributed on an \"AS IS\" BASIS,\r\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r\n * See the License for the specific language governing permissions and\r\n * limitations under the License.\r\n */\r\n\r\nimport { Component, Element, Event, EventEmitter, h, Host, Prop, State, VNode, Watch } from \"@stencil/core\";\r\nimport \"@esri/calcite-components\";\r\nimport SolutionConfigModal_T9n from \"../../assets/t9n/solution-config-modal/resources.json\";\r\nimport { getLocaleComponentStrings } from \"../../utils/locale\";\r\n\r\n@Component({\r\n  tag: \"solution-config-modal\",\r\n  styleUrl: \"solution-config-modal.scss\",\r\n  shadow: false\r\n})\r\nexport class SolutionConfigModal {\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Host element access\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  @Element() el: HTMLSolutionConfigModalElement;\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Properties (public)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  @Prop({ mutable: true }) cacheBreaker: string;\r\n\r\n  /**\r\n   * Credentials for requests in a serialized form\r\n   */\r\n  @Prop({ mutable: true }) serializedAuthentication = \"\";\r\n\r\n  @Prop({ mutable: true }) solutionTitle = \"\";\r\n\r\n  /**\r\n   * Contains the current solution item id\r\n   */\r\n  @Prop({ mutable: true }) solutionItemId: string;\r\n\r\n  @Watch(\"solutionItemId\") async valueWatchHandler(): Promise<void> {\r\n    console.log(\"MODAL watch \" + this.solutionItemId);//???\r\n  }\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Lifecycle\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  constructor() {\r\n    //console.log(\"MODAL constructor \" + this.solutionItemId);//??? + \" open:\" + this._modalIsOpen);//???\r\n\r\n    window.addEventListener(\"solutionCanSave\",\r\n      (evt) => {\r\n        this._canSave = (evt as any).detail as boolean;\r\n      }\r\n    );\r\n  }\r\n\r\n  /**\r\n   * StencilJS: Called once just after the component is first connected to the DOM.\r\n   *\r\n   * @returns Promise when complete\r\n   */\r\n  async componentWillLoad(): Promise<void> {\r\n    return this._getTranslations();\r\n  }\r\n\r\n  componentWillRender(): void {\r\n    console.log(\"MODAL will render \" + this.solutionTitle + \" (\" + this.solutionItemId + \", \" + this.cacheBreaker + \")\");//???\r\n  }\r\n\r\n  /**\r\n   * Renders the component.\r\n   */\r\n  render(): VNode {\r\n    const cacheBreakerParts = this.cacheBreaker.split(\"_\");\r\n    if (!this.solutionItemId && cacheBreakerParts.length === 2) {\r\n      this.solutionItemId = cacheBreakerParts[0];\r\n    }\r\n\r\n    const modalIsOpen = !!this.solutionItemId;\r\n    console.log(\"MODAL render \" + this.solutionTitle + \" (\" + this.solutionItemId + \", \" + this.cacheBreaker + \")\" + \" open:\" + modalIsOpen.toString());//???\r\n    return (\r\n      <Host>\r\n        <calcite-modal\r\n          aria-labelledby=\"solutions-modal-title\"\r\n          fullscreen=\"\"\r\n          intl-close={this._translations.cancel}\r\n          onCalciteModalClose={() => this._cancel()}\r\n          open={modalIsOpen}\r\n          ref={(el) => this._modal = el}\r\n        >\r\n          <h3\r\n            id=\"solutions-modal-title\"\r\n            slot=\"header\"\r\n          >\r\n            {this._translations.title.replace(\"{{solutionName}}\", this.solutionTitle)}\r\n          </h3>\r\n          <div\r\n            class=\"solutions-modal-content\"\r\n            id=\"solutions-modal-content\"\r\n            slot=\"content\"\r\n          >\r\n            <solution-configuration\r\n              ref ={(el) => (this._configuration = el)}\r\n              serialized-authentication={this.serializedAuthentication}\r\n              solution-item-id={this.solutionItemId}\r\n            />\r\n          </div>\r\n          <calcite-button\r\n            appearance=\"outline\"\r\n            disabled={!this._canSave}\r\n            onClick={() => this._cancel()}\r\n            ref={(el) => (this._cancelBtn = el)}\r\n            slot=\"secondary\"\r\n            width=\"full\"\r\n          >\r\n            {this._translations.cancel}\r\n          </calcite-button>\r\n          <calcite-button\r\n            appearance=\"solid\"\r\n            disabled={!this._canSave}\r\n            onClick={() => this._save()}\r\n            ref={(el) => (this._saveBtn = el)}\r\n            slot=\"primary\"\r\n            width=\"full\"\r\n          >\r\n            {this._translations.save}\r\n          </calcite-button>\r\n        </calcite-modal>\r\n      </Host>\r\n    );\r\n  }\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Properties (protected)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  protected _cancelBtn: HTMLCalciteButtonElement;\r\n\r\n  /**\r\n   * Controls enablement of Cancel and Save modal buttons\r\n   */\r\n  @State() protected _canSave = false;\r\n\r\n  protected _configuration: HTMLSolutionConfigurationElement;\r\n\r\n  protected _modal: HTMLCalciteModalElement;\r\n\r\n  //@State() protected _modalIsOpen = false;\r\n\r\n  protected _saveBtn: HTMLCalciteButtonElement;\r\n\r\n  /**\r\n   * Contains the _translations for this component.\r\n   * All UI strings should be defined here.\r\n   */\r\n  @State() protected _translations: typeof SolutionConfigModal_T9n;\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Event Listeners\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Events\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  @Event() solutionConfigModalClosed: EventEmitter<void>;\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Public Methods (async)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Private Methods\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  protected async _cancel(): Promise<void> {\r\n    console.log(\"MODAL cancel \" + this.solutionItemId);//???\r\n    this._cancelBtn.disabled = this._saveBtn.disabled = true;\r\n    this._canSave\r\n      ? confirm(\"Save changes?\")\r\n        ? await this._saveChanges()\r\n        : await this._cancelChanges()\r\n      : await this._cancelChanges();\r\n    this._closeModal();\r\n  }\r\n\r\n  protected async _cancelChanges(): Promise<void> {\r\n    console.log(\"MODAL cancelChanges\");//???\r\n    this._canSave = false;\r\n    await this._configuration.unloadSolution();\r\n  }\r\n\r\n  protected _closeModal(): void {\r\n    console.log(\"MODAL close\");//???\r\n    this.solutionItemId = \"\";\r\n    //this.solutionTitle = \"\";\r\n    this.cacheBreaker = \"\";\r\n    this.solutionConfigModalClosed.emit();\r\n  }\r\n\r\n  // Save changes and close the modal\r\n  protected async _save(): Promise<void> {\r\n    console.log(\"MODAL save \" + this.solutionItemId);//???\r\n    this._cancelBtn.disabled = this._saveBtn.disabled = true;\r\n    if (this._canSave) {\r\n      await this._saveChanges();\r\n    }\r\n  }\r\n\r\n  protected async _saveChanges(): Promise<void> {\r\n    console.log(\"MODAL saveChanges\");//???\r\n    try {\r\n      this._canSave = false;\r\n      await this._configuration.saveSolution();\r\n    } catch (error) {\r\n      //reportError(\"Unable to save\", error.originalMessage);\r\n      console.log(\"Unable to save\", error.originalMessage);\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Fetches the component's translations\r\n   *\r\n   * @protected\r\n   */\r\n  protected async _getTranslations(): Promise<void> {\r\n    const translations = await getLocaleComponentStrings(this.el);\r\n    this._translations = translations[0] as typeof SolutionConfigModal_T9n;\r\n  }\r\n}\r\n"]}

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

@@ -35,7 +35,7 @@ export class SolutionConfiguration {
     this._solutionEditorHasChanges = false;
     this._solutionEditorHasErrors = false;
     this._canSave = false;
-    this.authentication = new UserSession({});
+    this.serializedAuthentication = "";
     this.solutionItemId = "";
     this.showLoading = false;
     this._currentEditItemId = "";
@@ -46,6 +46,8 @@ export class SolutionConfiguration {
     this._templateHierarchy = [];
     this._translations = undefined;
     this._treeOpen = true;
+    this._authentication = this.serializedAuthentication ? UserSession.deserialize(this.serializedAuthentication) : new UserSession({});
+    console.log("CONFIG constructor " + this.solutionItemId); //???
     void this._loadSolution(this.solutionItemId);
     window.addEventListener("solutionStoreHasChanges", (evt) => {
       this._updateSaveability(this._solutionStoreHasChanges = evt.detail, this._solutionEditorHasChanges, this._solutionEditorHasErrors);
@@ -57,7 +59,11 @@ export class SolutionConfiguration {
       this._updateSaveability(this._solutionStoreHasChanges, this._solutionEditorHasChanges, this._solutionEditorHasErrors = evt.detail);
     });
   }
+  async serializedAuthenticationWatchHandler() {
+    this._authentication = this.serializedAuthentication ? UserSession.deserialize(this.serializedAuthentication) : new UserSession({});
+  }
   async valueWatchHandler() {
+    console.log("CONFIG watch " + this.solutionItemId); //???
     await this._loadSolution(this.solutionItemId);
   }
   /**
@@ -77,11 +83,12 @@ export class SolutionConfiguration {
     const solutionData = state.getStoreInfo("solutionData");
     this._solutionVariables = JSON.stringify(utils.getSolutionVariables(solutionData.templates, this._translations));
     this._organizationVariables = JSON.stringify(utils.getOrganizationVariables(this._translations));
+    console.log("CONFIG render " + this.solutionItemId); //???
     return (h(Host, null, !this._solutionIsLoaded
       ? h("calcite-loader", { active: true, label: '' })
       : 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), hasServices ?
       h("calcite-tab-title", null, this._translations.spatialReferenceTab) :
-      null), 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`, ref: (el) => (this._solutionContentsComponent = el) })), 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._treeOpen ? this._translations.collapse : this._translations.expand }), h("div", { class: "config-item" }, h("solution-item", { authentication: this.authentication, "item-id": this._currentEditItemId, key: `${this.solutionItemId}-item`, "organization-variables": this._organizationVariables, "solution-item-id": this.solutionItemId, "solution-variables": this._solutionVariables })))), hasServices
+      null), 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`, ref: (el) => (this._solutionContentsComponent = el) })), 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._treeOpen ? this._translations.collapse : this._translations.expand }), h("div", { class: "config-item" }, h("solution-item", { authentication: this._authentication, "item-id": this._currentEditItemId, key: `${this.solutionItemId}-item`, "organization-variables": this._organizationVariables, "solution-item-id": this.solutionItemId, "solution-variables": this._solutionVariables })))), hasServices
       ? h("calcite-tab", { class: "config-tab" }, h("div", { class: "config-solution" }, h("solution-spatial-ref", { defaultWkid: wkid, id: "configure-solution-spatial-ref", key: `${this.solutionItemId}-spatial-ref`, locked: !wkid, services: state.getStoreInfo("featureServices").map(fs => fs.name) })))
       : null)))));
   }
@@ -149,7 +156,7 @@ export class SolutionConfiguration {
         this.modelsSet = false;
         state.reset();
       }
-      getModels(templates, this.authentication, this.solutionItemId).then(models => {
+      getModels(templates, this._authentication, this.solutionItemId).then(models => {
         state.models = models;
 
         state.featureServices = getFeatureServices(templates);
@@ -198,7 +205,7 @@ export class SolutionConfiguration {
   async _loadSolution(solutionItemId) {
     if (solutionItemId) {
       this._solutionIsLoaded = false;
-      await state.loadSolution(solutionItemId, this.authentication);
+      await state.loadSolution(solutionItemId, this._authentication);
       this._initProps();
       this._solutionIsLoaded = true;
     }
@@ -261,7 +268,7 @@ export class SolutionConfiguration {
       this.solutionItemId,
       data,
       state.models,
-      this.authentication,
+      this._authentication,
       this._translations
     ).then(saveResult => {
       // need to trigger re-render...and re-fetch
@@ -566,21 +573,23 @@ export class SolutionConfiguration {
   }
   static get properties() {
     return {
-      "authentication": {
-        "type": "unknown",
+      "serializedAuthentication": {
+        "type": "string",
         "mutable": true,
         "complexType": {
-          "original": "UserSession",
-          "resolved": "UserSession",
+          "original": "string",
+          "resolved": "string",
           "references": {}
         },
         "required": false,
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "Credentials for requests"
+          "text": "Credentials for requests in a serialized form"
         },
-        "defaultValue": "new UserSession({})"
+        "attribute": "serialized-authentication",
+        "reflect": false,
+        "defaultValue": "\"\""
       },
       "solutionItemId": {
         "type": "string",
@@ -691,6 +700,9 @@ export class SolutionConfiguration {
   static get elementRef() { return "el"; }
   static get watchers() {
     return [{
+        "propName": "serializedAuthentication",
+        "methodName": "serializedAuthenticationWatchHandler"
+      }, {
         "propName": "solutionItemId",
         "methodName": "valueWatchHandler"
       }];
@@ -705,3 +717,4 @@ export class SolutionConfiguration {
       }];
   }
 }
+//# sourceMappingURL=solution-configuration.js.map

package/dist/collection/components/solution-configuration/solution-configuration.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"solution-configuration.js","sourceRoot":"","sources":["../../../src/components/solution-configuration/solution-configuration.tsx"],"names":[],"mappings":"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","sourcesContent":["/** @license\r\n * Copyright 2022 Esri\r\n *\r\n * Licensed under the Apache License, Version 2.0 (the \"License\");\r\n * you may not use this file except in compliance with the License.\r\n * You may obtain a copy of the License at\r\n *\r\n *    http://www.apache.org/licenses/LICENSE-2.0\r\n *\r\n * Unless required by applicable law or agreed to in writing, software\r\n * distributed under the License is distributed on an \"AS IS\" BASIS,\r\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r\n * See the License for the specific language governing permissions and\r\n * limitations under the License.\r\n */\r\n\r\nimport { Component, Element, h, Host, Listen, Method, Prop, State, VNode, Watch } from \"@stencil/core\";\r\nimport { IInventoryItem, IItemTemplateEdit, ISolutionSpatialReferenceInfo } from \"../../utils/interfaces\";\r\nimport * as utils from \"../../utils/templates\";\r\nimport state from \"../../utils/solution-store\";\r\nimport { getProp, UserSession } from \"@esri/solution-common\";\r\nimport \"@esri/calcite-components\";\r\nimport SolutionConfiguration_T9n from \"../../assets/t9n/solution-configuration/resources.json\";\r\nimport { getLocaleComponentStrings } from \"../../utils/locale\";\r\n\r\n@Component({\r\n  tag: \"solution-configuration\",\r\n  styleUrl: \"solution-configuration.scss\",\r\n  shadow: false\r\n})\r\nexport class SolutionConfiguration {\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Host element access\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  @Element() el: HTMLSolutionConfigurationElement;\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Properties (public)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /**\r\n   * Credentials for requests in a serialized form\r\n   */\r\n  @Prop({ mutable: true }) serializedAuthentication = \"\";\r\n\r\n  @Watch(\"serializedAuthentication\") async serializedAuthenticationWatchHandler(): Promise<void> {\r\n    this._authentication = this.serializedAuthentication ? UserSession.deserialize(this.serializedAuthentication) : new UserSession({});\r\n  }\r\n\r\n  /**\r\n   * Contains the current solution item id\r\n   */\r\n  @Prop({ mutable: true, reflect: true }) solutionItemId = \"\";\r\n\r\n  @Watch(\"solutionItemId\") async valueWatchHandler(): Promise<void> {\r\n    console.log(\"CONFIG watch \" + this.solutionItemId );//???\r\n    await this._loadSolution(this.solutionItemId);\r\n  }\r\n\r\n  /**\r\n  * Used to show/hide loading indicator\r\n  */\r\n  @Prop({ mutable: true, reflect: true }) showLoading = false;\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Lifecycle\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  constructor() {\r\n    this._authentication = this.serializedAuthentication ? UserSession.deserialize(this.serializedAuthentication) : new UserSession({});\r\n\r\n    console.log(\"CONFIG constructor \" + this.solutionItemId );//???\r\n    void this._loadSolution(this.solutionItemId);\r\n\r\n    window.addEventListener(\"solutionStoreHasChanges\",\r\n      (evt) => {\r\n        this._updateSaveability(\r\n          this._solutionStoreHasChanges = (evt as any).detail, this._solutionEditorHasChanges, this._solutionEditorHasErrors);\r\n      }\r\n    );\r\n    window.addEventListener(\"solutionEditorHasChanges\",\r\n      (evt) => {\r\n        this._updateSaveability(\r\n          this._solutionStoreHasChanges, this._solutionEditorHasChanges = (evt as any).detail, this._solutionEditorHasErrors);\r\n      }\r\n    );\r\n    window.addEventListener(\"solutionEditorHasErrors\",\r\n      (evt) => {\r\n        this._updateSaveability(\r\n          this._solutionStoreHasChanges, this._solutionEditorHasChanges, this._solutionEditorHasErrors = (evt as any).detail);\r\n      }\r\n    );\r\n  }\r\n\r\n  /**\r\n   * StencilJS: Called once just after the component is first connected to the DOM.\r\n   *\r\n   * @returns Promise when complete\r\n   */\r\n  async componentWillLoad(): Promise<void> {\r\n    return this._getTranslations();\r\n  }\r\n\r\n  /**\r\n   * Renders the component.\r\n   */\r\n  render(): VNode {\r\n    const wkid = getProp(state.getStoreInfo(\"spatialReferenceInfo\"), \"spatialReference\");\r\n    const hasServices: boolean = state.getStoreInfo(\"featureServices\").length > 0;\r\n\r\n    const solutionData = state.getStoreInfo(\"solutionData\");\r\n    this._solutionVariables = JSON.stringify(utils.getSolutionVariables(solutionData.templates, this._translations));\r\n    this._organizationVariables = JSON.stringify(utils.getOrganizationVariables(this._translations));\r\n\r\n    console.log(\"CONFIG render \" + this.solutionItemId );//???\r\n    return (\r\n      <Host>\r\n        {\r\n          !this._solutionIsLoaded\r\n            ? <calcite-loader active label='' />\r\n            : null\r\n        }\r\n        <div class=\"configuration-container\">\r\n          <div class=\"configuration\">\r\n            <calcite-tabs class=\"config-tabs\">\r\n              <calcite-tab-nav slot=\"tab-nav\">\r\n                <calcite-tab-title>{this._translations.definitionTab}</calcite-tab-title>\r\n                {hasServices ?\r\n                  <calcite-tab-title>{this._translations.spatialReferenceTab}</calcite-tab-title> :\r\n                  null\r\n                }\r\n              </calcite-tab-nav>\r\n              <calcite-tab active class=\"config-tab\">\r\n                <div class=\"config-solution\">\r\n                  <div class={this._treeOpen ? \"config-inventory\" : \"config-inventory-hide\"}>\r\n                    <solution-contents\r\n                      id=\"configInventory\"\r\n                      key={`${this.solutionItemId}-contents`}\r\n                      ref={(el) => (this._solutionContentsComponent = el)}\r\n                    />\r\n                  </div>\r\n                  <calcite-button\r\n                    appearance=\"transparent\"\r\n                    class=\"collapse-btn\"\r\n                    icon-start={this._treeOpen ? \"chevrons-left\" : \"chevrons-right\"}\r\n                    id=\"collapse-vars\"\r\n                    onClick={() => this._toggleTree()}\r\n                    scale=\"s\"\r\n                    title={this._treeOpen ? this._translations.collapse : this._translations.expand}\r\n                  />\r\n                  <div class=\"config-item\">\r\n                    <solution-item\r\n                      authentication={this._authentication}\r\n                      item-id={this._currentEditItemId}\r\n                      key={`${this.solutionItemId}-item`}\r\n                      organization-variables={this._organizationVariables}\r\n                      solution-item-id={this.solutionItemId}\r\n                      solution-variables={this._solutionVariables}\r\n                    />\r\n                  </div>\r\n                </div>\r\n              </calcite-tab>\r\n              {\r\n                hasServices\r\n                  ? <calcite-tab class=\"config-tab\">\r\n                      <div class=\"config-solution\">\r\n                        <solution-spatial-ref\r\n                          defaultWkid={wkid}\r\n                          id=\"configure-solution-spatial-ref\"\r\n                          key={`${this.solutionItemId}-spatial-ref`}\r\n                          locked={!wkid}\r\n                          services={state.getStoreInfo(\"featureServices\").map(fs => fs.name)}\r\n                        />\r\n                      </div>\r\n                    </calcite-tab>\r\n                  : null\r\n              }\r\n            </calcite-tabs>\r\n          </div>\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Properties (protected)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  protected _authentication: UserSession;\r\n\r\n  /**\r\n   * Contains the current item we are working with\r\n   */\r\n  @State() protected _currentEditItemId = \"\";\r\n\r\n  @State() protected _organizationVariables = \"\";\r\n\r\n  @State() protected _solutionContentsComponent: HTMLSolutionContentsElement;\r\n\r\n  @State() protected _solutionIsLoaded = false;\r\n\r\n  @State() protected _solutionVariables = \"\";\r\n\r\n  /**\r\n   * Contains the hierarchy of template items for the current solution.\r\n   */\r\n  @State() protected _templateHierarchy: IInventoryItem[] = [];\r\n\r\n  /**\r\n   * Contains the _translations for this component.\r\n   * All UI strings should be defined here.\r\n   */\r\n  @State() protected _translations: typeof SolutionConfiguration_T9n;\r\n\r\n  /**\r\n   * Used to show/hide the content tree\r\n   */\r\n  @State() protected _treeOpen = true;\r\n\r\n  protected _solutionStoreHasChanges = false;\r\n\r\n  protected _solutionEditorHasChanges = false;\r\n\r\n  protected _solutionEditorHasErrors = false;\r\n\r\n  protected _canSave = false;\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Event Listeners\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  @Listen(\"solutionItemSelected\", { target: \"window\" })\r\n  _solutionItemSelected(event: CustomEvent): void {\r\n    this._currentEditItemId = event.detail;\r\n  }\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Events\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Public Methods (async)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /*\r\n  @Method()\r\n  async getEditModels(): Promise<ISolutionItems> {\r\n    return Promise.resolve(state.items);\r\n  }\r\n  */\r\n\r\n  @Method()\r\n  async getSpatialReferenceInfo(): Promise<ISolutionSpatialReferenceInfo> {\r\n    return Promise.resolve(state.getStoreInfo(\"spatialReferenceInfo\"));\r\n  }\r\n\r\n  /*\r\n  @Method()\r\n  async getSourceTemplates(): Promise<any> {\r\n    return Promise.resolve(this._templates);\r\n  }\r\n  */\r\n\r\n  @Method()\r\n  async saveSolution(): Promise<void> {\r\n    this._solutionIsLoaded = false;\r\n    await state.saveSolution();\r\n    this._solutionIsLoaded = true;\r\n    this.solutionItemId = null;\r\n  }\r\n\r\n  @Method()\r\n  async unloadSolution(): Promise<void> {\r\n    this.solutionItemId = null;\r\n  }\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Private Methods\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /**\r\n   * Update the store with the initial values\r\n   *\r\n   * @param templates the solution items templates\r\n   * @param isReset (defaults to false) indicates if we are resetting the controls after save\r\n   */\r\n  /*\r\n  protected _initState(\r\n    templates: any[],\r\n    isReset = false\r\n  ): Promise<any> {\r\n    return new Promise((resolve, reject) => {\r\n      if (isReset) {\r\n        // clear models and state so we can refresh after save\r\n        this.modelsSet = false;\r\n        state.reset();\r\n      }\r\n      getModels(templates, this._authentication, this.solutionItemId).then(models => {\r\n        state.models = models;\r\n\r\n        state.featureServices = getFeatureServices(templates);\r\n        state.getStoreInfo(\"spatialReferenceInfo\") = getSpatialReferenceInfo(state.featureServices, this._sourceItemData);\r\n\r\n        if (isReset) {\r\n          // reset for undo/redo stack and diff editor tracking\r\n          const jsonEditors = Array.from(this.el.getElementsByTagName(\"json-editor\"));\r\n          // eslint-disable-next-line @typescript-eslint/no-floating-promises\r\n          jsonEditors.forEach(e => void e.reset());\r\n        }\r\n\r\n        this.modelsSet = true;\r\n        resolve(true);\r\n      }, () => reject);\r\n    });\r\n  }\r\n  */\r\n\r\n  /**\r\n   * Set Props with the initial values\r\n   *\r\n   * @protected\r\n   */\r\n  protected _initProps(): void {\r\n    const solutionData = state.getStoreInfo(\"solutionData\");\r\n\r\n    this._templateHierarchy = [...utils.getInventoryItems(solutionData.templates)];\r\n\r\n    if (this._solutionContentsComponent) {\r\n      this._solutionContentsComponent.templateHierarchy = this._templateHierarchy;\r\n    }\r\n\r\n    let firstItem: IItemTemplateEdit;\r\n    if (this._templateHierarchy.length > 0) {\r\n      // Start with the first item in the contents\r\n      firstItem = state.getItemInfo(this._templateHierarchy[0].id);\r\n    }\r\n    this._currentEditItemId = firstItem ? firstItem.itemId : \"\";\r\n  }\r\n\r\n  /**\r\n   * Loads a solution.\r\n   *\r\n   * @param solutionItemId AGO id of solution to load\r\n   *\r\n   * @returns Resolved promise when task is done\r\n   *\r\n   * @protected\r\n   */\r\n  protected async _loadSolution(solutionItemId: string): Promise<void> {\r\n    if (solutionItemId) {\r\n      this._solutionIsLoaded = false;\r\n      await state.loadSolution(solutionItemId, this._authentication);\r\n      this._initProps();\r\n      this._solutionIsLoaded = true;\r\n    } else {\r\n      this._reset();\r\n    }\r\n    return Promise.resolve();\r\n  }\r\n\r\n  /**\r\n   * Resets internal variables.\r\n   *\r\n   * @protected\r\n   */\r\n  protected _reset(): void {\r\n    this._currentEditItemId = \"\";\r\n    this._organizationVariables = \"\";\r\n    this._solutionVariables = \"\";\r\n    this._templateHierarchy = [];\r\n  }\r\n\r\n  /**\r\n   * Toggle _treeOpen prop to show/hide content tree.\r\n   *\r\n   * @protected\r\n   */\r\n  protected _toggleTree(): void {\r\n    this._treeOpen = !this._treeOpen;\r\n  }\r\n\r\n  /**\r\n   * Dispatches an event indicating if the configuration is saveable or not. It's not saveable if there are no\r\n   * changes or if there's an error in the JSON editor.\r\n   *\r\n   * @param solutionStoreHasChanges Are there changes in the configuration editor's internal store?\r\n   * @param solutionEditorHasChanges Are there changes in the configuration editor's JSON editor?\r\n   * @param solutionEditorHasErrors Are there errors in the configuration editor's JSON editor?\r\n   *\r\n   * @protected\r\n   */\r\n  protected _updateSaveability(\r\n    solutionStoreHasChanges: boolean,\r\n    solutionEditorHasChanges: boolean,\r\n    solutionEditorHasErrors: boolean\r\n  ): void {\r\n    const updateSaveability = (solutionStoreHasChanges || solutionEditorHasChanges) && !solutionEditorHasErrors;\r\n\r\n    if (this._canSave !== updateSaveability) {\r\n      window.dispatchEvent(new CustomEvent(\"solutionCanSave\", {\r\n        detail: updateSaveability,\r\n        bubbles: true,\r\n        cancelable: false,\r\n        composed: true\r\n      }));\r\n    }\r\n\r\n    this._canSave = updateSaveability;\r\n  }\r\n\r\n  /**\r\n   * Save all edits from the current configuration\r\n   *\r\n   * @returns a response that will indicate success or failure and any associated messages\r\n   */\r\n  /*\r\n  protected async _save() {\r\n    const templateUpdates = await this._updateTemplates();\r\n    const data = this._setSrInfo(templateUpdates.templates);\r\n    return templateUpdates.errors.length === 0 ? save(\r\n      this.solutionItemId,\r\n      data,\r\n      state.models,\r\n      this._authentication,\r\n      this._translations\r\n    ).then(saveResult => {\r\n      // need to trigger re-render...and re-fetch\r\n      this._fetchData = true;\r\n      this.modelsSet = false;\r\n      return Promise.resolve(saveResult)\r\n    }).catch(e => Promise.reject(e)) : Promise.reject({\r\n      success: false,\r\n      message: `The following templates have errors: ${templateUpdates.errors.join(\", \")}`\r\n    } as IResponse);\r\n  }\r\n  */\r\n\r\n  /**\r\n   * Update the solutions templates based on the stored changes\r\n   *\r\n   * @returns an object that contains the updated templates as well as any errors that were found\r\n   */\r\n  /*\r\n  protected async _updateTemplates(): Promise<IUpdateTemplateResponse> {\r\n    const errors = [];\r\n    const models = await this.getEditModels();\r\n    let templates = this._updateGroupDependencies(models, this._templates);\r\n    Object.keys(models).forEach(k => {\r\n      const m = models[k];\r\n      templates = templates.map(t => {\r\n        if (t.itemId === m.itemId) {\r\n          this._setItem(t, m);\r\n          const hasDataError = this._setData(t, m);\r\n          const hasPropError = this._setProps(t, m);\r\n          if (hasDataError || hasPropError) {\r\n            errors.push(m.itemId);\r\n          }\r\n        }\r\n        return t;\r\n      });\r\n    });\r\n    errors.concat(window.monaco.editor.getModelMarkers({}));\r\n    return Promise.resolve({\r\n      templates,\r\n      errors\r\n    });\r\n  }\r\n  */\r\n\r\n  /**\r\n   * Review all models and store itemIds that should be added or removed from group dependencies\r\n   *\r\n   * @param models the corresponding models for the current templates\r\n   *\r\n   * @returns group info (an object with keys of groupIds and\r\n   * arrays of itemIds that should be added or removed from group dependencies)\r\n   */\r\n  /*\r\n  protected _getGroupInfo(\r\n    models: any\r\n  ): any {\r\n    const groupInfo = {}\r\n    Object.keys(models).forEach(k => {\r\n      const m = models[k];\r\n      if (m.shareInfo) {\r\n        const groupId = m.shareInfo.groupId;\r\n        const type = m.shareInfo.shared ? \"share\" : \"unshare\";\r\n        if (groupInfo[groupId]) {\r\n          groupInfo[groupId][type].push(m.itemId);\r\n        } else {\r\n          groupInfo[groupId] = {};\r\n          groupInfo[groupId][type] = [m.itemId];\r\n          if (m.shareInfo.shared) {\r\n            groupInfo[groupId][\"unshare\"] = [];\r\n          } else {\r\n            groupInfo[groupId][\"share\"] = [];\r\n          }\r\n        }\r\n      }\r\n    });\r\n    return groupInfo;\r\n  }\r\n  */\r\n\r\n  /**\r\n   * Updates group dependency arrays by adding or removing itemIds\r\n   *\r\n   * @param templates the current templates to update\r\n   * @param models the corresponding models for the current templates\r\n   *\r\n   * @returns updated templates array\r\n   */\r\n  /*\r\n  protected _updateGroupDependencies(\r\n    models: any,\r\n    templates: any[]\r\n  ): any[] {\r\n    const groupInfo = this._getGroupInfo(models);\r\n    Object.keys(groupInfo).forEach(k => {\r\n      templates.some(t => {\r\n        if (t.itemId === k) {\r\n          // add share items as deps\r\n          groupInfo[k].share.forEach(s => {\r\n            if (t.dependencies.indexOf(s) < 0) {\r\n              t.dependencies.push(s);\r\n            }\r\n          });\r\n\r\n          // remove unshare items from deps\r\n          groupInfo[k].unshare.forEach(s => {\r\n            const index = t.dependencies.indexOf(s);\r\n            if (index > -1) {\r\n              t.dependencies.splice(index, 1);\r\n            }\r\n          });\r\n          return true;\r\n        } else {\r\n          return false;\r\n        }\r\n      })\r\n    })\r\n    return templates;\r\n  }\r\n  */\r\n\r\n  /**\r\n   * Add group IDs to items that should be shared\r\n   * This function will update the provided template when shareInfo is available\r\n   *\r\n   * @param template the current template to update\r\n   * @param shareInfo the corresponding shareInfo from the model for the current template\r\n   *\r\n   */\r\n  /*\r\n  protected _updateItemGroups(\r\n    template: any,\r\n    shareInfo: any\r\n  ): void {\r\n    if (shareInfo) {\r\n      const groupIndex = template.groups.indexOf(shareInfo.groupId);\r\n      if (groupIndex < 0 && shareInfo.shared) {\r\n        template.groups.push(shareInfo.groupId);\r\n      }\r\n      if (groupIndex > -1 && !shareInfo.shared) {\r\n        template.groups.splice(groupIndex, 1);\r\n      }\r\n    }\r\n  }\r\n  */\r\n\r\n  /**\r\n   * Set a templates data property with changes from the models\r\n   *\r\n   * @param template the current template to update\r\n   * @param model the corresponding model for the current template (stores any user changes)\r\n   *\r\n   * @returns a boolean that indicates if any errors were detected\r\n   */\r\n  /*\r\n  protected _setData(\r\n    template: any,\r\n    model: any\r\n  ): boolean {\r\n    return this._setTemplateProp(\r\n      template,\r\n      model.dataOriginalValue,\r\n      model.dataCurrentValue,\r\n      \"data\"\r\n    );\r\n  }\r\n  */\r\n\r\n  /**\r\n   * Set a templates properties property with changes from the models\r\n   *\r\n   * @param template the current template to update\r\n   * @param model the corresponding model for the current template (stores any user changes)\r\n   *\r\n   * @returns a boolean that indicates if any errors were detected\r\n   */\r\n  /*\r\n  protected _setProps(\r\n    template: any,\r\n    model: any\r\n  ): boolean {\r\n    return this._setTemplateProp(\r\n      template,\r\n      model.propsOriginalValue,\r\n      model.propsCurrentValue,\r\n      \"properties\"\r\n    );\r\n  }\r\n  */\r\n\r\n  /**\r\n   * Generic function used to set properties or data property on a given template\r\n   *\r\n   * @param template the current template to update\r\n   * @param originValue the original value from the solution template\r\n   * @param modelValue the current value from the model (will contain any edits that have been made)\r\n   * @param path the path to the property we should update if any changes are found\r\n   *\r\n   * @returns a boolean that indicates if any errors were detected\r\n   */\r\n  /*\r\n  protected _setTemplateProp(\r\n    template: any,\r\n    originValue: any,\r\n    modelValue: any,\r\n    path: string\r\n  ): boolean {\r\n    let hasError = false;\r\n    try {\r\n      const _originValue = JSON.parse(originValue);\r\n      const _modelValue = JSON.parse(modelValue);\r\n\r\n      if (_originValue && _modelValue && (JSON.stringify(_originValue) !== JSON.stringify(_modelValue))) {\r\n        setProp(template, path, _modelValue);\r\n      }\r\n    } catch (e) {\r\n      console.error(e);\r\n      hasError = true;\r\n    }\r\n    return hasError;\r\n  }\r\n  */\r\n\r\n  /**\r\n   * Set a templates item property with changes from the models\r\n   *\r\n   * @param template the current template to update\r\n   * @param model the corresponding model for the current template (stores any user changes)\r\n   *\r\n   * This function will update the template argument when edits are found\r\n   */\r\n  /*\r\n  protected _setItem(\r\n    template: any,\r\n    model: any\r\n  ): void {\r\n    this._updateItemGroups(template, model.shareInfo);\r\n    if (model.updateItemValues && Object.keys(model.updateItemValues).length > 0) {\r\n      Object.keys(model.updateItemValues).forEach(k => {\r\n        template.item[k] = model.updateItemValues[k];\r\n      });\r\n    }\r\n  }\r\n  */\r\n\r\n  /**\r\n   * Set spatial reference info in the solutions data\r\n   *\r\n   * @param templates a list of item templates from the solution\r\n   *\r\n   * @returns a cloned copy of the solutions data that has been updated with spatial reference info\r\n   *\r\n   */\r\n  /*\r\n  protected _setSrInfo(\r\n    templates: any[]\r\n  ): any {\r\n    const srInfo: any = state.getStoreInfo(\"spatialReferenceInfo\");\r\n\r\n    const serviceEnabled = typeof srInfo?.services === \"undefined\" ?\r\n      false : Object.keys(srInfo.services).some(k => srInfo.services[k]);\r\n\r\n    const data = cloneObject(this._sourceItemData);\r\n    data.templates = templates;\r\n    if (srInfo && srInfo.enabled && serviceEnabled) {\r\n      const wkid = srInfo.spatialReference.wkid.toString();\r\n\r\n      const wkidParam = {\r\n        \"label\": \"Spatial Reference\",\r\n        \"default\": wkid,\r\n        \"valueType\": \"spatialReference\",\r\n        \"attributes\": {\r\n          \"required\": \"true\"\r\n        }\r\n      };\r\n\r\n      const params = getProp(data, \"params\");\r\n      const hasWkid = params && params.wkid;\r\n      setCreateProp(\r\n        data,\r\n        hasWkid ? \"params.wkid.default\" : \"params.wkid\",\r\n        hasWkid ? wkid : params ? wkidParam : wkid\r\n      );\r\n    } else if (!srInfo.enabled) {\r\n      if (getProp(data, \"params.wkid\")) {\r\n        delete (data.params.wkid);\r\n      }\r\n    }\r\n    return data;\r\n  }\r\n  */\r\n\r\n  /**\r\n   * Fetches the component's translations\r\n   *\r\n   * @protected\r\n   */\r\n  protected async _getTranslations(): Promise<void> {\r\n    const translations = await getLocaleComponentStrings(this.el);\r\n    this._translations = translations[0] as typeof SolutionConfiguration_T9n;\r\n  }\r\n}\r\n"]}

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

@@ -160,3 +160,4 @@ export class SolutionContents {
       }];
   }
 }
+//# sourceMappingURL=solution-contents.js.map

package/dist/collection/components/solution-contents/solution-contents.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"solution-contents.js","sourceRoot":"","sources":["../../../src/components/solution-contents/solution-contents.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,IAAI,EAAE,CAAC,EAAE,IAAI,EAAS,KAAK,EAAE,MAAM,eAAe,CAAC;AAErG,OAAO,0BAA0B,CAAC;AAQlC,MAAM,OAAO,gBAAgB;;;6BAwBmD,EAAE;;EAEpD,iBAAiB,CAAC,CAAM,EAAE,IAAS;IAC7D,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,GAAG,CAAC,EAAE;MACvD,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;KACjC;EACH,CAAC;EAED,4EAA4E;EAC5E,EAAE;EACF,aAAa;EACb,EAAE;EACF,4EAA4E;EAE5E,iBAAiB;IACf,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,iBAAiB,EAAE,EAAE,CAAC,CAAC;EACrD,CAAC;EAED;;KAEG;EACH,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,wBACG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAChC,CACV,CACR,CAAC;EACJ,CAAC;EAED,eAAe,CAAC,IAAsB;IACpC,OAAO,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE;MACtB,MAAM,QAAQ,GAAY,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,cAAc,KAAK,GAAG,CAAC,EAAE,CAAC;MAChF,OAAO,CAAC,GAAG,CAAC,YAAY,IAAI,GAAG,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;QACxD,CACE,yBAAmB,OAAO,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,iBAAiB,CAAC,GAAG,CAAC,EAAE,EAAE,GAAG,CAAC,EAAE,QAAQ,EAAE,QAAQ;UAC1F,0BAAoB,IAAI,EAAE,GAAG,CAAC,IAAI,EAAE,YAAY,EAAE,GAAG,CAAC,YAAY,GAAI;UACtE,YAAM,KAAK,EAAC,WAAW,EAAC,KAAK,EAAE,GAAG,CAAC,KAAK,IAAG,GAAG,CAAC,KAAK,CAAQ;UAC5D,oBAAc,IAAI,EAAC,UAAU,IAC1B,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,YAAY,CAAC,CAC1B,CACG,CACrB;QACD,CAAC;UACD,CACE,yBAAmB,OAAO,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,iBAAiB,CAAC,GAAG,CAAC,EAAE,EAAE,GAAG,CAAC,EAAE,QAAQ,EAAE,QAAQ;YAC1F,0BAAoB,IAAI,EAAE,GAAG,CAAC,IAAI,EAAE,YAAY,EAAE,GAAG,CAAC,YAAY,GAAI;YACtE,YAAM,KAAK,EAAC,WAAW,EAAC,KAAK,EAAE,GAAG,CAAC,KAAK,IAAG,GAAG,CAAC,KAAK,CAAQ,CAC1C,CACrB,CAAC;IACN,CAAC,CAAC,CAAC;EACL,CAAC;EA2BD,4EAA4E;EAC5E,EAAE;EACF,0BAA0B;EAC1B,EAAE;EACF,4EAA4E;EAE5E,4EAA4E;EAC5E,EAAE;EACF,mBAAmB;EACnB,EAAE;EACF,4EAA4E;EAE5E;;;;;;;KAOG;EACO,iBAAiB,CACzB,MAAc,EACd,MAAW,SAAS;;IAEpB,MAAM,QAAQ,GAAG,MAAA,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,MAAM,0CAAE,OAAO,CAAC,mBAAmB,CAAC,CAAC;IAC3D,IAAI,QAAQ,EAAE;MACZ,QAAQ,CAAC,QAAQ,GAAG,CAAC,CAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,QAAQ,CAAA,CAAC;KACzC;IACD,IAAI,CAAC,cAAc,GAAG,MAAM,CAAC;IAC7B,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;EACzC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/** @license\r\n * Copyright 2022 Esri\r\n *\r\n * Licensed under the Apache License, Version 2.0 (the \"License\");\r\n * you may not use this file except in compliance with the License.\r\n * You may obtain a copy of the License at\r\n *\r\n *    http://www.apache.org/licenses/LICENSE-2.0\r\n *\r\n * Unless required by applicable law or agreed to in writing, software\r\n * distributed under the License is distributed on an \"AS IS\" BASIS,\r\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r\n * See the License for the specific language governing permissions and\r\n * limitations under the License.\r\n */\r\n\r\nimport { Component, Element, Event, EventEmitter, Host, h, Prop, VNode, Watch } from '@stencil/core';\r\nimport { IInventoryItem/*, ISolutionTemplateEdit */ } from '../../utils/interfaces';\r\nimport '@esri/calcite-components';\r\n\r\n@Component({\r\n  tag: 'solution-contents',\r\n  styleUrl: 'solution-contents.scss',\r\n  shadow: false,\r\n  assetsDirs: ['item-type-icons']\r\n})\r\nexport class SolutionContents {\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Host element access\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  @Element() el: HTMLSolutionContentsElement;\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Properties (public)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /**\r\n   * Contains the current item that is selected.\r\n   */\r\n  @Prop({ mutable: true, reflect: true }) selectedItemId: string;\r\n\r\n  /**\r\n   * Contains the public value for this component.\r\n   */\r\n  @Prop({ mutable: true, reflect: true }) templateHierarchy: IInventoryItem[] = [];\r\n\r\n  @Watch(\"templateHierarchy\") valueWatchHandler(v: any, oldV: any): void {\r\n    if (v && v !== oldV && Array.isArray(v) && v.length > 0) {\r\n      this._treeItemSelected(v[0].id);\r\n    }\r\n  }\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Lifecycle\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  componentWillLoad() {\r\n    this.valueWatchHandler(this.templateHierarchy, []);\r\n  }\r\n\r\n  /**\r\n   * Renders the component.\r\n   */\r\n  render(): VNode {\r\n    return (\r\n      <Host>\r\n        <calcite-tree>\r\n          {this.renderHierarchy(this.templateHierarchy)}\r\n        </calcite-tree>\r\n      </Host>\r\n    );\r\n  }\r\n\r\n  renderHierarchy(objs: IInventoryItem[]): HTMLCalciteTreeItemElement[] {\r\n    return objs.map((obj) => {\r\n      const selected: boolean = this.selectedItemId && this.selectedItemId === obj.id;\r\n      return (obj.dependencies && obj.dependencies.length > 0) ?\r\n        (\r\n          <calcite-tree-item onClick={(evt) => this._treeItemSelected(obj.id, evt)} selected={selected}>\r\n            <solution-item-icon type={obj.type} typeKeywords={obj.typeKeywords} />\r\n            <span class=\"icon-text\" title={obj.title}>{obj.title}</span>\r\n            <calcite-tree slot=\"children\" >\r\n              {this.renderHierarchy(obj.dependencies)}\r\n            </calcite-tree>\r\n          </calcite-tree-item>\r\n        )\r\n        :\r\n        (\r\n          <calcite-tree-item onClick={(evt) => this._treeItemSelected(obj.id, evt)} selected={selected}>\r\n            <solution-item-icon type={obj.type} typeKeywords={obj.typeKeywords} />\r\n            <span class=\"icon-text\" title={obj.title}>{obj.title}</span>\r\n          </calcite-tree-item>\r\n        );\r\n    });\r\n  }\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Properties (protected)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Event Listeners\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /*@Listen(\"solutionLoaded\", { target: \"window\" })\r\n  _solutionLoaded(): void {\r\n    this._treeItemSelected(this.templateHierarchy[0].solutionItem);\r\n  }*/\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Events\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  @Event() solutionItemSelected: EventEmitter<string>;\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Public Methods (async)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Private Methods\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /**\r\n   * Publishes the `solutionItemSelected` event containing `solutionItem` of the selected item.\r\n   *\r\n   * Also toggles the expanded state of the tree item.\r\n   *\r\n   * @param solutionItem the selected solution item to emit\r\n   * @param evt MouseEvent or undefined\r\n   */\r\n  protected _treeItemSelected(\r\n    itemId: string,\r\n    evt: any = undefined\r\n  ): void {\r\n    const treeItem = evt?.target?.closest(\"calcite-tree-item\");\r\n    if (treeItem) {\r\n      treeItem.expanded = !treeItem?.expanded;\r\n    }\r\n    this.selectedItemId = itemId;\r\n    this.solutionItemSelected.emit(itemId);\r\n  }\r\n}\r\n"]}

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

@@ -200,3 +200,4 @@ export class SolutionItem {
       }];
   }
 }
+//# sourceMappingURL=solution-item.js.map

package/dist/collection/components/solution-item/solution-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"solution-item.js","sourceRoot":"","sources":["../../../src/components/solution-item/solution-item.tsx"],"names":[],"mappings":"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","sourcesContent":["/** @license\r\n * Copyright 2022 Esri\r\n *\r\n * Licensed under the Apache License, Version 2.0 (the \"License\");\r\n * you may not use this file except in compliance with the License.\r\n * You may obtain a copy of the License at\r\n *\r\n *    http://www.apache.org/licenses/LICENSE-2.0\r\n *\r\n * Unless required by applicable law or agreed to in writing, software\r\n * distributed under the License is distributed on an \"AS IS\" BASIS,\r\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r\n * See the License for the specific language governing permissions and\r\n * limitations under the License.\r\n */\r\n\r\nimport { Component, Element, h, Host, Prop, State, VNode, Watch } from '@stencil/core';\r\nimport '@esri/calcite-components';\r\nimport state from \"../../utils/solution-store\";\r\nimport { UserSession } from '@esri/solution-common';\r\nimport SolutionItem_T9n from '../../assets/t9n/solution-item/resources.json';\r\nimport { getLocaleComponentStrings } from '../../utils/locale';\r\n\r\n@Component({\r\n  tag: 'solution-item',\r\n  styleUrl: 'solution-item.scss',\r\n  shadow: false\r\n})\r\nexport class SolutionItem {\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Host element access\r\n  //\r\n  //--------------------------------------------------------------------------\r\n  @Element() el: HTMLSolutionItemElement;\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Properties (public)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /**\r\n   * Credentials for requests\r\n   */\r\n  @Prop({ mutable: true }) authentication: UserSession;\r\n\r\n  /**\r\n   * A template's itemId.\r\n   */\r\n  @Prop({ mutable: true, reflect: true }) itemId = \"\";\r\n\r\n  @Watch(\"itemId\") itemIdWatchHandler(): void {\r\n    const itemEdit = state.getItemInfo(this.itemId);\r\n    this.itemType = itemEdit.type;\r\n  }\r\n\r\n  /**\r\n   * Contains the solution based variables\r\n   */\r\n  @Prop({ mutable: true, reflect: true }) solutionVariables = \"\";\r\n\r\n  /**\r\n   * Contains the organization based variables\r\n   */\r\n  @Prop({ mutable: true, reflect: true }) organizationVariables = \"\";\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Lifecycle\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /**\r\n   * StencilJS: Called once just after the component is first connected to the DOM.\r\n   */\r\n  async componentWillLoad(): Promise<void> {\r\n    return this._getTranslations();\r\n  }\r\n\r\n  /**\r\n   * Renders the component.\r\n   */\r\n  render(): VNode {\r\n    return (\r\n      <Host>\r\n        <div class=\"configuration-container\">\r\n          <div class=\"configuration\">\r\n            {/* Using this rather than ternary operator as I was getting a tabIndex error\r\n                when switching between item and group type tab.\r\n                It was also not a smooth transition when the 3rd tab of an item was selected and you would switch to a group.\r\n             */}\r\n            {this._showGroupTabs(this.itemType === \"Group\")}\r\n            {this._showItemTabs(this.itemType !== \"Group\")}\r\n          </div>\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Properties (protected)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  @State() itemType: string;\r\n\r\n  /**\r\n   * Contains the translations for this component.\r\n   * All UI strings should be defined here.\r\n   */\r\n  @State() protected _translations: typeof SolutionItem_T9n;\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Event Listeners\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Events\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Public Methods (async)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Public Methods\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /**\r\n   * Render tabs based on group item types\r\n   *\r\n   * @param visible Should the current tab be visible\r\n   */\r\n  _showGroupTabs(\r\n    visible: boolean\r\n  ): VNode {\r\n    return <calcite-tabs class=\"config-tabs\" style={{ display: visible ? \"inherit\" : \"none\" }}>\r\n      <calcite-tab-nav slot=\"tab-nav\">\r\n        <calcite-tab-title>{this._translations.groupDetailsTab}</calcite-tab-title>\r\n        <calcite-tab-title>{this._translations.sharingTab}</calcite-tab-title>\r\n      </calcite-tab-nav>\r\n\r\n      <calcite-tab active class=\"config-tab\" id=\"group-tab\">\r\n        <solution-item-details\r\n          item-id={this.itemId}\r\n        />\r\n      </calcite-tab>\r\n      <calcite-tab class=\"config-tab\" id=\"share-tab\">\r\n        <solution-item-sharing\r\n          group-id={this.itemId}\r\n        />\r\n      </calcite-tab>\r\n    </calcite-tabs>\r\n  }\r\n\r\n  /**\r\n   * Render tabs based for an items details, data, and props section from a template\r\n   *\r\n   * @param visible Should the current tab be visible\r\n   */\r\n  _showItemTabs(\r\n    visible: boolean\r\n  ): VNode {\r\n    return <calcite-tabs class=\"config-tabs\" style={{ display: visible ? \"inherit\" : \"none\" }}>\r\n      <calcite-tab-nav slot=\"tab-nav\">\r\n        <calcite-tab-title>{this._translations.itemDetailsTab}</calcite-tab-title>\r\n        <calcite-tab-title>{this._translations.dataTab}</calcite-tab-title>\r\n        <calcite-tab-title>{this._translations.propertiesTab}</calcite-tab-title>\r\n        <calcite-tab-title>{this._translations.resourcesTab}</calcite-tab-title>\r\n      </calcite-tab-nav>\r\n\r\n      <calcite-tab active class=\"config-tab\">\r\n        <solution-item-details\r\n          item-id={this.itemId}\r\n        />\r\n      </calcite-tab>\r\n      <calcite-tab class=\"config-tab\" id=\"data-tab\">\r\n        <solution-template-data\r\n          instanceid=\"data\"\r\n          item-id={this.itemId}\r\n          organization-variables={this.organizationVariables}\r\n          solution-variables={this.solutionVariables}\r\n        />\r\n      </calcite-tab>\r\n      <calcite-tab class=\"config-tab\" id=\"props-tab\">\r\n        <solution-template-data\r\n          instanceid=\"properties\"\r\n          item-id={this.itemId}\r\n          organization-variables={this.organizationVariables}\r\n          solution-variables={this.solutionVariables}\r\n        />\r\n      </calcite-tab>\r\n      <calcite-tab class=\"config-tab\" id=\"resources-tab\">\r\n        <solution-resource-item\r\n          authentication={this.authentication}\r\n          class=\"solutions-resource-container\"\r\n          item-id={this.itemId}\r\n        />\r\n      </calcite-tab>\r\n    </calcite-tabs>\r\n  }\r\n\r\n  /**\r\n   * Fetches the component's translations\r\n   *\r\n   * @protected\r\n   */\r\n  protected async _getTranslations(): Promise<void> {\r\n    const translations = await getLocaleComponentStrings(this.el);\r\n    this._translations = translations[0] as typeof SolutionItem_T9n;\r\n  }\r\n}\r\n"]}

package/dist/collection/components/solution-item-details/solution-item-details.js

@@ -246,3 +246,4 @@ export class SolutionItemDetails {
       }];
   }
 }
+//# sourceMappingURL=solution-item-details.js.map

package/dist/collection/components/solution-item-details/solution-item-details.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"solution-item-details.js","sourceRoot":"","sources":["../../../src/components/solution-item-details/solution-item-details.tsx"],"names":[],"mappings":"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","sourcesContent":["/** @license\r\n * Copyright 2022 Esri\r\n *\r\n * Licensed under the Apache License, Version 2.0 (the \"License\");\r\n * you may not use this file except in compliance with the License.\r\n * You may obtain a copy of the License at\r\n *\r\n *    http://www.apache.org/licenses/LICENSE-2.0\r\n *\r\n * Unless required by applicable law or agreed to in writing, software\r\n * distributed under the License is distributed on an \"AS IS\" BASIS,\r\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r\n * See the License for the specific language governing permissions and\r\n * limitations under the License.\r\n */\r\n\r\nimport { Component, Element, h, Host, Listen, Prop, State, VNode } from '@stencil/core';\r\nimport '@esri/calcite-components';\r\nimport state from \"../../utils/solution-store\";\r\nimport SolutionItemDetails_T9n from '../../assets/t9n/solution-item-details/resources.json';\r\nimport { getLocaleComponentStrings } from '../../utils/locale';\r\nimport { IItemGeneralized } from '@esri/solution-common';\r\nimport { IItemTemplateEdit } from '../../utils/interfaces';\r\n\r\n@Component({\r\n  tag: 'solution-item-details',\r\n  styleUrl: 'solution-item-details.scss',\r\n  shadow: false,\r\n})\r\nexport class SolutionItemDetails {\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Host element access\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  @Element() el: HTMLSolutionItemDetailsElement;\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Properties (public)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /**\r\n   * A template's itemId.\r\n   */\r\n  @Prop({ mutable: true, reflect: true }) itemId = \"\";\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Lifecycle\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /**\r\n   * StencilJS: Called once just after the component is first connected to the DOM.\r\n   */\r\n  async componentWillLoad(): Promise<void> {\r\n    return this._getTranslations();\r\n  }\r\n\r\n  async componentWillRender(): Promise<void> {\r\n    this.itemEdit = state.getItemInfo(this.itemId);\r\n    if (this.itemEdit) {\r\n      this.itemDetails = this.itemEdit.item;\r\n      this.itemType = this.itemDetails.type;\r\n    }\r\n    return Promise.resolve();\r\n  }\r\n\r\n  /**\r\n   * Renders the component.\r\n   */\r\n  render(): VNode {\r\n    return (\r\n      <Host>\r\n        <div class=\"parent-container\">\r\n          <div class=\"inputBottomSeparation\">\r\n            <calcite-input id=\"item-title\" value={this.itemDetails.title} />\r\n          </div>\r\n\r\n          <div class=\"inputBottomSeparation\">\r\n\r\n            <input accept=\".jpg,.gif,.png,image/jpg,image/gif,image/png\" class=\"display-none\" onChange={(event) => (this._updateThumbnail(event))} ref={(el) => (this.browseForThumbnail = el)} type=\"file\" />\r\n\r\n            <button class=\"font-size--3 btn-link inline-block trailer-quarter\" onClick={() => this._getThumbnail()}>\r\n              <svg class=\"icon-inline icon-inline--on-left\" height=\"16\" viewBox=\"0 0 16 16\" width=\"16\">\r\n                <path d=\"M14.792 2.666l-1.414-1.413a.965.965 0 0 0-1.385-.03l-1.444 1.444-8.763 8.72L.03 15.481a.371.371 0 0 0 .488.488l4.096-1.756 8.763-8.72-.001-.001.002.002 1.443-1.444a.965.965 0 0 0-.03-1.385zM1.569 14.431l.554-1.293.74.739zm2.338-.924l-1.414-1.414 7.963-7.92 1.414 1.415zm8.67-8.626l-1.413-1.414 1.29-1.29a.306.306 0 0 1 .433 0l.981.98a.306.306 0 0 1 0 .433z\" />\r\n              </svg>{this._translations.editThumbnail}\r\n            </button>\r\n\r\n            <div class=\"flex\">\r\n              <div class=\"img-container\" ref={(el) => (this.thumbnailContainer = el)}>\r\n                <img class=\"scale-down\" height=\"133\" id=\"item-thumbnail\" ref={(el) => (this.thumbnail = el)} width=\"200\" />\r\n              </div>\r\n              <div class=\"snippet-count-container\">\r\n                <calcite-input id=\"item-snippet\" maxlength={250} type=\"textarea\" value={this.itemDetails.snippet} />\r\n                <label class=\"font-size--3\" id=\"item-snippet-count\" ref={(el) => (this.itemSnippetCount = el)} />\r\n              </div>\r\n            </div>\r\n          </div>\r\n\r\n          <calcite-label>{this._translations.description}\r\n            <label id=\"item-description-label\">\r\n              <calcite-input id=\"item-description\" type=\"textarea\" value={this.itemDetails.description} />\r\n            </label>\r\n          </calcite-label>\r\n\r\n          <calcite-label>{this._translations.tags}\r\n            <label id=\"item-tags-label\">\r\n              <calcite-input id=\"item-tags\" value={(this.itemDetails.tags && Array.isArray(this.itemDetails.tags) ? this.itemDetails.tags : [this.itemDetails.tags]).join(\",\")} />\r\n            </label>\r\n          </calcite-label>\r\n\r\n          {this.itemType !== \"Group\" ? <calcite-label>{this._translations.credits}\r\n            <label id=\"item-credits-label\">\r\n              <calcite-input id=\"item-credits\" value={this.itemDetails.accessInformation} />\r\n            </label>\r\n          </calcite-label> : null}\r\n\r\n          {this.itemType !== \"Group\" ? <calcite-label>\r\n            <label id=\"item-terms-label\">{this._translations.termsOfUse}\r\n              <calcite-input id=\"item-terms\" type=\"textarea\" value={this.itemDetails.licenseInfo} />\r\n            </label>\r\n          </calcite-label> : null}\r\n\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n\r\n  componentDidRender(): void {\r\n    this._loadThumb();\r\n  }\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Properties (protected)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /**\r\n   * Handle to the element for browsing for a file.\r\n   */\r\n  protected browseForThumbnail: HTMLInputElement;\r\n\r\n  @State() itemDetails: IItemGeneralized = {\r\n    accessInformation: \"\",\r\n    description: \"\",\r\n    licenseInfo: \"\",\r\n    snippet: \"\",\r\n    tags: [],\r\n    title: \"\"\r\n  } as any;\r\n\r\n  @State() protected itemEdit: IItemTemplateEdit;\r\n\r\n  protected itemType: string;\r\n\r\n  /**\r\n   * Contains the translations for this component.\r\n   * All UI strings should be defined here.\r\n   */\r\n  @State() _translations: typeof SolutionItemDetails_T9n;\r\n\r\n  /**\r\n   * Handle to the snippet character-count feedback.\r\n   */\r\n  protected itemSnippetCount: HTMLLabelElement;\r\n\r\n  /**\r\n   * Handle to the thumbnail image display.\r\n   */\r\n  @State() protected thumbnail: HTMLImageElement;\r\n\r\n  /**\r\n   * Handle to the thumbnail image container.\r\n   */\r\n  @State() protected thumbnailContainer: HTMLElement;\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Event Listeners\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /**\r\n   * Updates the component's value with changes to the input fields.\r\n   */\r\n  @Listen(\"calciteInputInput\")\r\n  inputReceivedHandler(event: any): void {\r\n    switch (event.target.id) {\r\n      case \"item-title\":\r\n        this.itemDetails.title = event.target.value;\r\n        this._updateStore();\r\n        break;\r\n      case \"item-snippet\":\r\n        if (event.target.value.length > 250) {\r\n          event.target.value = event.target.value.substring(0, 250);\r\n        }\r\n        this.itemDetails.snippet = event.target.value;\r\n        this._updateLengthLabel(this.itemDetails.snippet);\r\n        this._updateStore();\r\n        break;\r\n      case \"item-description\":\r\n        this.itemDetails.description = event.target.value;\r\n        this._updateStore();\r\n        break;\r\n      case \"item-tags\":\r\n        this.itemDetails.tags = event.target.value;\r\n        this._updateStore();\r\n        break;\r\n      case \"item-credits\":\r\n        this.itemDetails.accessInformation = event.target.value;\r\n        this._updateStore();\r\n        break;\r\n      case \"item-terms\":\r\n        this.itemDetails.licenseInfo = event.target.value;\r\n        this._updateStore();\r\n        break;\r\n    }\r\n  }\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Events\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Public Methods (async)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Private Methods\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /**\r\n   * Opens image file browse dialog.\r\n   *\r\n   */\r\n  protected _getThumbnail(): void {\r\n    this.browseForThumbnail.click();\r\n  }\r\n\r\n  /**\r\n   * Load the templates thumbnail\r\n   *\r\n   */\r\n  protected _loadThumb(): void {\r\n    if (this.thumbnail && this.itemEdit?.thumbnail) {\r\n      // Show the thumbnail\r\n      this.thumbnail.src = URL.createObjectURL(this.itemEdit.thumbnail);\r\n      this.thumbnailContainer.classList.remove(\"empty-box\");\r\n      this.thumbnail.classList.remove(\"display-none\");\r\n    } else {\r\n      // Replace the thumbnail with an empty box\r\n      this.thumbnailContainer.classList.add(\"empty-box\");\r\n      this.thumbnail.classList.add(\"display-none\");\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Updates the length label to reflect the current number of characters\r\n   * relative to the max number of characters supported.\r\n   *\r\n   * @param phrase the current phrase from the control\r\n   */\r\n  protected _updateLengthLabel(phrase: string): void {\r\n    this.itemSnippetCount.innerText =\r\n      this._translations.snippetCountPattern.replace(\"{{n}}\", phrase.length.toString());\r\n  }\r\n\r\n  /**\r\n   * Add or remove the value from the store\r\n   */\r\n  protected _updateStore(\r\n  ): void {\r\n    this.itemEdit = state.getItemInfo(this.itemId);\r\n    this.itemEdit.item = this.itemDetails;\r\n    state.setItemInfo(this.itemEdit);\r\n  }\r\n\r\n  /**\r\n   * Gets and displays image result from browse and updates the item in the store.\r\n   *\r\n   * @param event The input controls event that contains the new file\r\n   * @param updateStore boolean that controls if the new value is written to the store\r\n   *  should be false on the initial load but true the rest of the time\r\n   */\r\n  protected _updateThumbnail(\r\n    event: any\r\n  ): void {\r\n    const files = event.target.files;\r\n    if (files && files[0]) {\r\n      if (this.thumbnail) {\r\n        // Update UI\r\n        this.thumbnail.src = URL.createObjectURL(files[0]);\r\n\r\n        // Update info in store\r\n        this.itemEdit = state.getItemInfo(this.itemId);\r\n        this.itemEdit.thumbnail = files[0];\r\n        state.replaceItemThumbnail(this.itemEdit);\r\n      }\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Fetches the component's translations\r\n   *\r\n   * @protected\r\n   */\r\n  protected async _getTranslations(): Promise<void> {\r\n    const translations = await getLocaleComponentStrings(this.el);\r\n    this._translations = translations[0] as typeof SolutionItemDetails_T9n;\r\n  }\r\n}\r\n"]}

package/dist/collection/components/solution-item-icon/solution-item-icon.js

@@ -396,3 +396,4 @@ export class SolutionItemIcon {
   }
   static get elementRef() { return "el"; }
 }
+//# sourceMappingURL=solution-item-icon.js.map