@esri/solutions-components 1.0.3 → 1.0.5

package/dist/components/solution-configure-dialog/customElement.js

@@ -1,12 +1,14 @@
-import { c } from "../../chunks/runtime.js";
-import { html as e } from "lit-html";
-import { u as r } from "../../chunks/useT9n.js";
-import { LitElement as d, createEvent as p, safeClassMap as h } from "@arcgis/lumina";
-import { css as u } from "@lit/reactive-element/css-tag.js";
+import { c as d } from "../../chunks/runtime.js";
+import { u } from "../../chunks/useT9n.js";
+import { LitElement as p, useContextConsumer as h, createEvent as m, safeClassMap as f } from "@arcgis/lumina";
+import { css as g } from "@lit/reactive-element/css-tag.js";
+import { a as _ } from "../../chunks/deployAppContexts.js";
+import { createRef as a, ref as s } from "lit-html/directives/ref.js";
+import { html as i } from "lit";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.0/esri/copyright.txt for details.
-v1.0.3 */
-const m = u`/** @license
+v1.0.5 */
+const v = g`/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -20,29 +22,53 @@ const m = u`/** @license
  * 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.
- */.minor-card{width:200px}.center{justify-content:center;align-items:center}.font-weight-semibold{font-weight:var(--calcite-font-weight-semibold)}.display-flex{display:flex}.display-none{display:none}.flex-direction-column{flex-direction:column}.flex-direction-row{flex-direction:row}.icon-color{color:var(--calcite-color-text-3)}.font-weight-normal{font-weight:var(--calcite-font-weight-normal)}.font-weight-medium{font-weight:var(--calcite-font-weight-medium)}.no-space{--calcite-label-margin-bottom: 0px}.font-color{color:red}.padding-end-1-2{padding-inline-end:.5rem}.padding-end-1{padding-inline-end:1rem}.padding-bottom-1{padding-bottom:1rem}.edit-button-position{position:absolute;right:1rem}html[dir=rtl] .edit-button-position{position:absolute;left:1rem}.max-width-20{max-width:20vw}.max-width-35{max-width:35vw}.max-width-40{max-width:40vw}.btn-center{width:100%;display:grid;place-items:center}`;
-class g extends d {
+ */.minor-card{width:200px}.center{justify-content:center;align-items:center}.align-self-center{align-self:center}.font-weight-semibold{font-weight:var(--calcite-font-weight-semibold)}.display-flex{display:flex}.display-none{display:none}.flex-direction-column{flex-direction:column}.flex-direction-row{flex-direction:row}.icon-color{color:var(--calcite-color-text-3)}.font-weight-normal{font-weight:var(--calcite-font-weight-normal)}.font-weight-medium{font-weight:var(--calcite-font-weight-medium)}.no-space{--calcite-label-margin-bottom: 0px}.font-color{color:red}.padding-end-1-2{padding-inline-end:.5rem}.padding-end-1{padding-inline-end:1rem}.padding-bottom-1{padding-bottom:1rem}.padding-bottom-1-2{padding-bottom:.5rem}.edit-button-position{position:absolute;right:1rem}html[dir=rtl] .edit-button-position{position:absolute;left:1rem}.max-width-20{max-width:20vw}.max-width-35{max-width:35vw}.max-width-40{max-width:40vw}.btn-center{width:100%;display:grid;place-items:center}.width-full{width:100%}.align-items-start{align-items:start}.font-size-override{--calcite-font-size--2: var(--calcite-font-size--1)}.width-400{width:400px}.padding-3-4{padding:.75rem}.margin-0{margin:0}`;
+class w extends p {
   constructor() {
-    super(...arguments), this.open = !1, this.templateInfos = [], this._displayClass = "", this._translations = r({ name: "solution-configure-dialog", blocking: !0 }), this._typeKeywords = [], this.solutionConfigureDialogClose = p();
+    super(...arguments), this.authContextConsumer = h({
+      context: _,
+      subscribe: !0
+    }), this.open = !1, this.showSuccessAlert = !1, this.templateInfos = [], this._configureTitlesOpen = !1, this._displayClass = "", this._translations = u({ name: "solution-configure-dialog", blocking: !0 }), this._editSummaryRef = a(), this._editSummaryPopoverRef = a(), this._editNameRef = a(), this._editNamePopoverRef = a(), this._typeKeywords = [], this.solutionConfigureDialogClose = m();
   }
   static {
-    this.properties = { card: 0, cardRef: 1, open: 5, templateInfos: 0, _displayClass: 16, _translations: 16 };
+    this.properties = { authContextConsumer: 0, card: 0, cardRef: 1, open: 5, showSuccessAlert: 5, templateInfos: 0, _configureTitlesOpen: 16, _displayClass: 16, _translations: 16 };
   }
   static {
-    this.styles = m;
+    this.styles = v;
+  }
+  async load() {
+    this.templateInfos = await this.cardRef.getTemplates();
+  }
+  updated(e) {
+    if (e.has("open")) {
+      const t = e.get("open");
+      this.open && !t && this.cardRef.getTemplates().then((o) => {
+        this.templateInfos = o;
+      });
+    }
   }
   render() {
-    return e`<calcite-dialog class=${h(this._displayClass)} heading="heading goes here" modal @calciteDialogClose=${() => {
-      this.open = !1, this.solutionConfigureDialogClose.emit();
-    }} .open=${this.open} outside-close-disabled width=l><div class="display-flex flex-direction-column"><div class="display-flex flex-direction-row padding-bottom-1"><calcite-card-group label>${this._getStartHereCard()}${this._getDiagramCard()}${this._getSolutionCard()}${this._getSolutionVersionCard()}</calcite-card-group></div>${this._getSolutionContents()}</div><div slot=footer-start></div><calcite-button appearance=outline @click=${this._close} slot=footer-end>${this._translations.closeTheDialog}</calcite-button></calcite-dialog>`;
+    return i`<div><calcite-dialog class=${f(this._displayClass)} .heading=${this.card?.title} modal @calciteDialogClose=${() => {
+      this.open = !1, this.solutionConfigureDialogClose.emit(), this._cleanupPanel(), this.card = void 0, this.templateInfos = [];
+    }} .open=${this.open} outside-close-disabled width=l><div class="display-flex flex-direction-column"><div class="display-flex flex-direction-row padding-bottom-1"><calcite-card-group label>${this._getStartHereCard()}${this._getDiagramCard()}${this._getSolutionCard()}${this._getSolutionVersionCard()}</calcite-card-group></div>${this._getSolutionContents()}</div><div slot=footer-start></div><calcite-button appearance=outline @click=${this._close} slot=footer-end>${this._translations.closeTheDialog}</calcite-button>${this._getSuccessAlert()}</calcite-dialog>${this._getConfigureTitlesDialog()}</div>`;
+  }
+  _getConfigureTitlesDialog() {
+    return this._configureTitlesOpen ? i`<solution-configure-titles .card=${this.card} @solutionConfigureTitlesBeforeClose=${() => {
+      this._displayClass = "", this._configureTitlesOpen = !1;
+    }} .open=${this._configureTitlesOpen} .templateInfos=${this.templateInfos}></solution-configure-titles>` : "";
+  }
+  _getSuccessAlert() {
+    return this.showSuccessAlert ? i`<calcite-alert auto-close icon=check-circle kind=success .label=${this.card?.title || ""} @calciteAlertClose=${() => {
+      this.showSuccessAlert = !1;
+    }} .open=${this.showSuccessAlert}><div slot=message>${this._translations.deploySuccessAlert.replace("{{solutionTitle}}", this.card?.title || "")}</div></calcite-alert>` : "";
   }
   _getDiagramCard() {
     return this._getBasicCard(this._translations.diagramOfTheSolution, this._translations.diagramSubText, "model", this._translations.openTheDiagram, "outline", this._openDiagram, void 0);
   }
-  async _openDiagram(t) {
+  async _openDiagram(e) {
     this._displayClass = "display-none";
-    const i = await this.cardRef.renderDiagramDialog(t);
-    i && this.listenOn(i, "calciteDialogBeforeClose", () => {
+    const t = await this.cardRef.renderDiagramDialog(e);
+    t && this.listenOn(t, "calciteDialogBeforeClose", () => {
       this._displayClass = "";
     });
   }
@@ -52,35 +78,57 @@ class g extends d {
   _getSolutionVersionCard() {
     return this._getBasicCard(this._translations.solutionVersion, this._translations.youHaveTheLatestVersion, "check-shield", void 0, void 0, void 0, "Version 3.2");
   }
-  _getBasicCard(t, i, o, a, s, l, n) {
-    return e`<calcite-card class="minor-card max-width-20"><span class="font-weight-medium" slot=heading>${t}</span><div class="display-flex center"><div class="display-flex flex-direction-column center"><calcite-icon class="icon-color" .icon=${o} scale=l></calcite-icon>${n ? e`<span class="font-weight-medium">${n}</span>` : ""}<p>${i}</p></div></div>${a ? e`<div class="btn-center" slot=footer-start><calcite-button .appearance=${s} kind=brand @click=${l}>${a}</calcite-button></div>` : ""}</calcite-card>`;
+  _getBasicCard(e, t, o, l, c, r, n) {
+    return i`<calcite-card class="minor-card max-width-20 font-size-override"><span class="font-weight-medium" slot=heading>${e}</span><div class="display-flex center"><div class="display-flex flex-direction-column center"><calcite-icon class="icon-color" .icon=${o} scale=l></calcite-icon>${n ? i`<span class="font-weight-medium">${n}</span>` : ""}<p>${t}</p></div></div>${l ? i`<div class="btn-center" slot=footer-start><calcite-button .appearance=${c} kind=brand @click=${r}>${l}</calcite-button></div>` : ""}</calcite-card>`;
   }
   _getSolutionCard() {
-    return e`<calcite-card class="max-width-40"><calcite-label class="font-weight-medium" scale=l slot=heading>${this._translations.aboutYourSolution}</calcite-label><div class="display-flex flex-direction-column"><calcite-label class="font-weight-medium no-space" layout=inline>${this._translations.aboutYourSolutionName}<span class="font-weight-normal">\r\n              Citizen Problem Reporter</span><calcite-button appearance=transparent class="edit-button-position" icon-start=pencil @click=${this._editName} kind=neutral></calcite-button></calcite-label><calcite-label class="font-weight-medium no-space" layout=inline>${this._translations.aboutYourSolutionSummary}<p class="font-weight-normal">\r\n              Citizen Problem Reporter</p><calcite-button appearance=transparent class="edit-button-position" icon-start=pencil @click=${this._editSummary} kind=neutral></calcite-button></calcite-label><div class="display-flex"><calcite-label class="font-weight-medium no-space padding-end-1" layout=inline>${this._translations.aboutYourSolutionOwner}<span class="font-weight-normal">\r\n                AlixSolutions</span></calcite-label><div class="display-flex"><calcite-label class="no-space icon-color" layout=inline><calcite-icon class="icon-color" icon=projects scale=s></calcite-icon>\r\n                Deployed 6/01/24</calcite-label></div></div></div><div slot=footer-start><calcite-button appearance=outline class="padding-end-1" icon-start=arrow-up-down kind=brand @click=${this._showChangeOwner}>${this._translations.changeOwner}</calcite-button><calcite-button appearance=outline class="padding-end-1" icon-start=share kind=brand @click=${this._showItemDetails}>${this._translations.itemDetails}</calcite-button></div><calcite-button appearance=outline icon-start=trash kind=brand @click=${this._deleteSolution} slot=footer-end>${this._translations.deleteSolution}</calcite-button></calcite-card>`;
+    const e = "configure-edit-solution-name", t = "configure-edit-solution-summary";
+    return i`<calcite-card class="max-width-40 font-size-override"><calcite-label class="font-weight-medium" scale=l slot=heading>${this._translations.aboutYourSolution}</calcite-label><div class="display-flex flex-direction-column"><div class="display-flex align-items-start padding-bottom-1-2"><calcite-label class="font-weight-medium no-space padding-end-1-2" layout=inline>${this._translations.aboutYourSolutionName}</calcite-label><span class="font-weight-medium width-full align-self-start">${this.card?.title}</span><calcite-button appearance=transparent icon-start=pencil id=${e} kind=neutral ${s(this._editNameRef)}></calcite-button></div><div class="display-flex align-items-start padding-bottom-1-2"><calcite-label class="font-weight-medium no-space padding-end-1-2" layout=inline>${this._translations.aboutYourSolutionSummary}</calcite-label><span class="font-weight-medium width-full align-self-center">${this.card?.snippet}</span><calcite-button appearance=transparent icon-start=pencil id=${t} kind=neutral ${s(this._editSummaryRef)}></calcite-button></div><div class="display-flex"><calcite-label class="font-weight-medium no-space padding-end-1" layout=inline>${this._translations.aboutYourSolutionOwner}<calcite-link class="font-weight-normal" @click=${this._openUserProfile}>${this.card?.owner}</calcite-link></calcite-label><div class="display-flex"><calcite-label class="no-space icon-color" layout=inline><calcite-icon class="icon-color" icon=projects scale=s></calcite-icon>${this.card?.created}</calcite-label></div></div></div><div slot=footer-start><calcite-button appearance=outline class="padding-end-1" icon-start=arrow-up-down kind=brand @click=${this._showChangeOwner}>${this._translations.changeOwner}</calcite-button><calcite-button appearance=outline class="padding-end-1" icon-start=share kind=brand @click=${this._showItemDetails}>${this._translations.itemDetails}</calcite-button></div><calcite-button appearance=outline icon-start=trash kind=brand @click=${this._deleteSolution} slot=footer-end>${this._translations.deleteSolution}</calcite-button>${this._getEditNamePopover(e)}${this._getEditSummaryPopover(t)}</calcite-card>`;
   }
   _getSolutionContents() {
-    return e`<div><calcite-label class="font-weight-medium" layout=inline scale=l>${this._translations.solutionsContentsAndCount.replace("{{numberOfSolutions}}", this.templateInfos.length.toString())}<calcite-button appearance=outline icon-start=pencil kind=brand>${this._translations.updateTitles}</calcite-button></calcite-label><solution-item-accordion list-selection-mode=single .templateInfos=${this.templateInfos} .typeKeywords=${this._typeKeywords}></solution-item-accordion></div>`;
+    return i`<div><calcite-label class="font-weight-medium" layout=inline scale=l>${this._translations.solutionsContentsAndCount.replace("{{numberOfSolutions}}", this.templateInfos.length.toString())}<calcite-button appearance=outline icon-start=pencil kind=brand @click=${() => {
+      this._configureTitlesOpen = !0, this._displayClass = "display-none";
+    }}>${this._translations.updateTitles}</calcite-button></calcite-label><solution-item-accordion list-selection-mode=single .templateInfos=${this.templateInfos} .typeKeywords=${this._typeKeywords}></solution-item-accordion></div>`;
   }
   async _deleteSolution() {
     this._displayClass = "display-none";
-    const t = await this.cardRef.renderDeleteDialog();
-    t && this.listenOn(t, "calciteDialogBeforeClose", () => {
-      this._displayClass = "";
-    });
+    const e = await this.cardRef.renderDeleteDialog();
+    e && (this.listenOn(e, "calciteDialogBeforeClose", async () => {
+      this._displayClass = "", this.templateInfos = await this.cardRef.getTemplates();
+    }), this.listenOn(e, "solutionDeleted", () => {
+      this._close();
+    }));
   }
   _showItemDetails() {
+    window.open(this.card.itemUrl, "_blank");
+  }
+  _openUserProfile(e) {
+    e.stopPropagation();
+    const t = this.authContextConsumer.value?.PortalSubset?.orgUrl;
+    t && window.open(`${t}/home/user.html`, "_blank");
   }
   _showChangeOwner() {
   }
-  _editSummary() {
+  _getEditSummaryPopover(e) {
+    return i`<calcite-popover .heading=${this._translations.updateSolutionSummary} label overlay-positioning=fixed .referenceElement=${e} ${s(this._editSummaryPopoverRef)}><calcite-text-area class="padding-3-4 margin-0 width-400" rows=6 .value=${this.card?.snippet || ""}></calcite-text-area><div class="display-flex flex-direction-row padding-3-4 margin-0"><calcite-button appearance=outline @click=${() => this._closeSummaryChangePopup(!1)} width=full>${this._translations.cancelTheDialog}</calcite-button><calcite-button width=full @click=${() => this._closeSummaryChangePopup(!0)}>${this._translations.ok}</calcite-button></div></calcite-popover>`;
   }
-  _editName() {
+  _closeSummaryChangePopup(e) {
+    console.log(e), this._editSummaryPopoverRef.value && (this._editSummaryPopoverRef.value.open = !1);
+  }
+  _getEditNamePopover(e) {
+    return i`<calcite-popover .heading=${this._translations.updateSolutionName} .label=${this.card?.title || ""} overlay-positioning=fixed .referenceElement=${e} ${s(this._editNamePopoverRef)}><calcite-input class="padding-3-4 margin-0 width-400" .value=${this.card?.title}></calcite-input><div class="display-flex flex-direction-row padding-3-4 margin-0"><calcite-button appearance=outline @click=${() => this._closeNameChangePopup(!1)} width=full>${this._translations.cancelTheDialog}</calcite-button><calcite-button width=full @click=${() => this._closeNameChangePopup(!0)}>${this._translations.ok}</calcite-button></div></calcite-popover>`;
+  }
+  _closeNameChangePopup(e) {
+    console.log(e), this._editNamePopoverRef.value && (this._editNamePopoverRef.value.open = !1);
   }
   _close() {
     this.open = !1;
   }
+  _cleanupPanel() {
+    this._editSummaryPopoverRef.value?.open && (this._editSummaryPopoverRef.value.open = !1), this._editNamePopoverRef.value?.open && (this._editNamePopoverRef.value.open = !1);
+  }
 }
-c("solution-configure-dialog", g);
+d("solution-configure-dialog", w);
 export {
-  g as SolutionConfigureDialog
+  w as SolutionConfigureDialog
 };

package/dist/components/solution-configure-dialog/index.d.ts

@@ -1,8 +1,14 @@
 import "@esri/calcite-components/components/calcite-dialog";
 import "@esri/calcite-components/components/calcite-card-group";
 import "@esri/calcite-components/components/calcite-button";
+import "../solution-configure-titles/index.js";
+import "@esri/calcite-components/components/calcite-alert";
 import "@esri/calcite-components/components/calcite-card";
 import "@esri/calcite-components/components/calcite-icon";
 import "@esri/calcite-components/components/calcite-label";
+import "@esri/calcite-components/components/calcite-link";
 import "../solution-item-accordion/index.js";
+import "@esri/calcite-components/components/calcite-popover";
+import "@esri/calcite-components/components/calcite-text-area";
+import "@esri/calcite-components/components/calcite-input";
 export * from "./customElement.js";

package/dist/components/solution-configure-dialog/index.js

@@ -1,8 +1,14 @@
 import "@esri/calcite-components/components/calcite-dialog";
 import "@esri/calcite-components/components/calcite-card-group";
 import "@esri/calcite-components/components/calcite-button";
+import "../solution-configure-titles/index.js";
+import "@esri/calcite-components/components/calcite-alert";
 import "@esri/calcite-components/components/calcite-card";
 import "@esri/calcite-components/components/calcite-icon";
 import "@esri/calcite-components/components/calcite-label";
+import "@esri/calcite-components/components/calcite-link";
 import "../solution-item-accordion/index.js";
+import "@esri/calcite-components/components/calcite-popover";
+import "@esri/calcite-components/components/calcite-text-area";
+import "@esri/calcite-components/components/calcite-input";
 export * from "./customElement.js";

package/dist/components/solution-configure-titles/customElement.d.ts

@@ -1,9 +1,11 @@
 /// <reference types="../../index.d.ts" />
 import { PublicLitElement as LitElement, TargetedEvent, JsxNode } from '@arcgis/lumina';
-import { ITemplateInfo } from '../../utils/interfaces';
+import { ISolutionInfoCard, ITemplateInfo } from '../../utils/interfaces';
 import { PropertyValues } from 'lit';
 
 export declare class SolutionConfigureTitles extends LitElement {
+    /** Key details about the solution */
+    card: ISolutionInfoCard | undefined;
     /**
      * boolean: when true the dialog is open
      *
@@ -12,4 +14,6 @@ export declare class SolutionConfigureTitles extends LitElement {
     open: boolean;
     /** ITemplateInfo[]: Collection of template infos */
     templateInfos: ITemplateInfo[];
+    /** This event will be emitted when this dialog is closed */
+    readonly solutionConfigureTitlesBeforeClose: TargetedEvent<this, void>;
 }

package/dist/components/solution-configure-titles/customElement.js

@@ -1,13 +1,13 @@
 import { c as a } from "../../chunks/runtime.js";
 import { u as n } from "../../chunks/useT9n.js";
-import { LitElement as o } from "@arcgis/lumina";
-import { css as c } from "@lit/reactive-element/css-tag.js";
+import { LitElement as o, createEvent as c } from "@arcgis/lumina";
+import { css as r } from "@lit/reactive-element/css-tag.js";
 import { createRef as s, ref as l } from "lit-html/directives/ref.js";
-import { html as e } from "lit";
+import { html as t } from "lit";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.0/esri/copyright.txt for details.
-v1.0.3 */
-const r = c`/** @license
+v1.0.5 */
+const d = r`/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -22,33 +22,36 @@ const r = c`/** @license
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */.display-flex{display:flex}.flex-direction-column{flex-direction:column}.flex-direction-row{flex-direction:row}.padding-bottom-1{padding-bottom:1rem}.padding-end-1{padding-inline-end:1rem}.padding-end-1-2{padding-inline-end:.5rem}.width-full{width:100%}.justify-content-space{justify-content:space-between}`;
-class p extends o {
+class u extends o {
   constructor() {
-    super(...arguments), this.open = !1, this.templateInfos = [], this._displayTemplateInfos = [], this._translations = n({ name: "solution-configure-titles", blocking: !0 }), this._prefixRef = s(), this._prefixValue = "", this._suffixRef = s(), this._suffixValue = "";
+    super(...arguments), this.open = !1, this.templateInfos = [], this._displayTemplateInfos = [], this._translations = n({ name: "solution-configure-titles", blocking: !0 }), this._prefixRef = s(), this._prefixValue = "", this._suffixRef = s(), this._suffixValue = "", this.solutionConfigureTitlesBeforeClose = c();
   }
   static {
-    this.properties = { open: 5, templateInfos: 0, _displayTemplateInfos: 16, _translations: 16 };
+    this.properties = { card: 0, open: 5, templateInfos: 0, _displayTemplateInfos: 16, _translations: 16 };
   }
   static {
-    this.styles = r;
+    this.styles = d;
   }
-  willUpdate(t) {
-    t.has("templateInfos") && this._updateTemplates();
+  willUpdate(e) {
+    e.has("templateInfos") && this._updateTemplates();
   }
   load() {
     this._updateTemplates();
   }
   render() {
-    return e`<calcite-dialog .heading=${this._translations.configureTitlesDialogHeader} .open=${this.open} width=l>${this._getPrefixSuffixControls()}${this._getAccordion()}${this._getDialogButtons()}</calcite-dialog>`;
+    const e = this._translations.configureTitlesDialogHeader.replace("{{solutionName}}", this.card.title);
+    return t`<calcite-dialog .heading=${e} modal @calciteDialogBeforeClose=${() => {
+      this.solutionConfigureTitlesBeforeClose.emit();
+    }} .open=${this.open} outside-close-disabled width=l>${this._getPrefixSuffixControls()}${this._getAccordion()}${this._getDialogButtons()}</calcite-dialog>`;
   }
   _getPrefixSuffixControls() {
-    return e`<div class="display-flex flex-direction-column padding-bottom-1"><calcite-label>${this._translations.addPrefixOrSuffixToItems}</calcite-label><div class="display-flex flex-direction-row justify-content-space"><calcite-label class="width-full padding-end-1">${this._translations.prefixToAddToItems}<calcite-input @input=${this._prefixInput} .placeholder=${this._translations.enterPrefixPlaceholder} ${l(this._prefixRef)}></calcite-input></calcite-label><calcite-label class="width-full">${this._translations.suffixToAddToItems}<calcite-input @input=${this._suffixInput} .placeholder=${this._translations.enterSuffixPlaceholder} ${l(this._suffixRef)}></calcite-input></calcite-label></div></div>`;
+    return t`<div class="display-flex flex-direction-column padding-bottom-1"><calcite-label>${this._translations.addPrefixOrSuffixToItems}</calcite-label><div class="display-flex flex-direction-row justify-content-space"><calcite-label class="width-full padding-end-1">${this._translations.prefixToAddToItems}<calcite-input @input=${this._prefixInput} .placeholder=${this._translations.enterPrefixPlaceholder} ${l(this._prefixRef)}></calcite-input></calcite-label><calcite-label class="width-full">${this._translations.suffixToAddToItems}<calcite-input @input=${this._suffixInput} .placeholder=${this._translations.enterSuffixPlaceholder} ${l(this._suffixRef)}></calcite-input></calcite-label></div></div>`;
   }
   _getAccordion() {
-    return e`<div class="display-flex flex-direction-column"><calcite-label class="padding-bottom-1">${this._translations.previewTheChanges}</calcite-label><solution-item-accordion .templateInfos=${this._displayTemplateInfos}></solution-item-accordion></div>`;
+    return t`<div class="display-flex flex-direction-column"><calcite-label class="padding-bottom-1">${this._translations.previewTheChanges}</calcite-label><solution-item-accordion .templateInfos=${this._displayTemplateInfos}></solution-item-accordion></div>`;
   }
   _getDialogButtons() {
-    return e`<div slot=footer-end><calcite-button appearance=outline class="padding-end-1-2" kind=brand @click=${this._closeDialog}>${this._translations.cancelTheDialog}</calcite-button><calcite-button kind=brand @click=${this._commitNameChanges}>${this._translations.keepChangesAndCloseTheDialog}</calcite-button></div>`;
+    return t`<div slot=footer-end><calcite-button appearance=outline class="padding-end-1-2" kind=brand @click=${this._closeDialog}>${this._translations.cancelTheDialog}</calcite-button><calcite-button kind=brand @click=${this._commitNameChanges}>${this._translations.keepChangesAndCloseTheDialog}</calcite-button></div>`;
   }
   _prefixInput() {
     clearTimeout(this._textInputTimeout), this._textInputTimeout = setTimeout(() => {
@@ -61,8 +64,8 @@ class p extends o {
     }, 500);
   }
   _updateTemplates() {
-    const t = JSON.parse(JSON.stringify(this.templateInfos));
-    this._displayTemplateInfos = t.map((i) => (i.title = `${`${this._prefixValue} `}${i.title}${` ${this._suffixValue}`}`, i));
+    const e = JSON.parse(JSON.stringify(this.templateInfos));
+    this._displayTemplateInfos = e.map((i) => (i.title = `${`${this._prefixValue} `}${i.title}${` ${this._suffixValue}`}`, i));
   }
   _closeDialog() {
     this.open = !1;
@@ -71,7 +74,7 @@ class p extends o {
     console.log("Commit the name changes here");
   }
 }
-a("solution-configure-titles", p);
+a("solution-configure-titles", u);
 export {
-  p as SolutionConfigureTitles
+  u as SolutionConfigureTitles
 };

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

@@ -4,7 +4,7 @@ import { LitElement as a, createEvent as l, noShadowRoot as d } from "@arcgis/lu
 import { css as o } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.0/esri/copyright.txt for details.
-v1.0.3 */
+v1.0.5 */
 const h = o`@layer{/** @license
  * Copyright 2025 Esri
  *

package/dist/components/solution-delete-dialog/customElement.d.ts

@@ -1,6 +1,11 @@
 /// <reference types="../../index.d.ts" />
+import { PropertyValues } from 'lit';
 import { PublicLitElement as LitElement, TargetedEvent, JsxNode } from '@arcgis/lumina';
 import { ISolutionInfoCard, ITemplateInfo } from '../../utils/interfaces';
+export type DependencyItem = {
+    controlItemId: string;
+    dependencyItemId: string;
+};
 
 export declare class SolutionDeleteDialog extends LitElement {
     /** The authentication from global nav */

package/dist/components/solution-delete-dialog/customElement.js

@@ -1,15 +1,15 @@
-import { c } from "../../chunks/runtime.js";
-import { html as s } from "lit-html";
-import { u as h } from "../../chunks/useT9n.js";
-import { LitElement as d, useContextConsumer as a, createEvent as r, noShadowRoot as u, nothing as p } from "@arcgis/lumina";
-import { css as m } from "@lit/reactive-element/css-tag.js";
-import { deleteSolution as g } from "@esri/solution-common";
-import { a as f, u as _ } from "../../chunks/deployAppContexts.js";
-import { p as D } from "../../chunks/prepareDataForSolutionDisplay.js";
+import { c as h } from "../../chunks/runtime.js";
+import { nothing as p, html as l } from "lit";
+import { u as m } from "../../chunks/useT9n.js";
+import { LitElement as u, useContextConsumer as c, createEvent as d } from "@arcgis/lumina";
+import { css as g } from "@lit/reactive-element/css-tag.js";
+import { deleteSolution as f, getItemRelatedItemsInSameDirection as _ } from "@esri/solution-common";
+import { a as I, u as D } from "../../chunks/deployAppContexts.js";
+import { p as b } from "../../chunks/prepareDataForSolutionDisplay.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.0/esri/copyright.txt for details.
-v1.0.3 */
-const b = m`@layer{/** @license
+v1.0.5 */
+const S = g`/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -23,73 +23,97 @@ const b = m`@layer{/** @license
  * 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.
- */.panel-bg-color{--calcite-panel-header-background-color: var(--calcite-color-foreground-1);--calcite-panel-background-color: var(--calcite-color-foreground-1)}}`;
-class C extends d {
+ */.panel-bg-color{--calcite-panel-header-background-color: var(--calcite-color-foreground-1);--calcite-panel-background-color: var(--calcite-color-foreground-1)}`;
+class C extends u {
   constructor() {
-    super(...arguments), this.authContextConsumer = a({
-      context: f,
+    super(...arguments), this.authContextConsumer = c({
+      context: I,
       subscribe: !0
-    }), this.open = !1, this.userSessionContextConsumer = a({
-      context: _,
+    }), this.open = !1, this.userSessionContextConsumer = c({
+      context: D,
       subscribe: !0
-    }), this._deletePercentage = 0, this._isDeleteInProgress = !1, this._showDeleteError = !1, this._templates = [], this._translations = h({ name: "solution-delete-dialog", blocking: !0 }), this.dialogOpen = r(), this.solutionDeleted = r();
+    }), this._deletePercentage = 0, this._isDeleteInProgress = !1, this._nonSolutionDependencyItems = [], this._showDeleteError = !1, this._templates = [], this._translations = m({ name: "solution-delete-dialog", blocking: !0 }), this.dialogOpen = d(), this.solutionDeleted = d();
   }
   static {
-    this.properties = { authContextConsumer: 0, card: 0, open: 5, userSessionContextConsumer: 0, _deletePercentage: 16, _isDeleteInProgress: 16, _showDeleteError: 16, _templates: 16, _translations: 16 };
+    this.properties = { authContextConsumer: 0, card: 0, open: 5, userSessionContextConsumer: 0, _deletePercentage: 16, _isDeleteInProgress: 16, _nonSolutionDependencyItems: 16, _showDeleteError: 16, _templates: 16, _translations: 16 };
   }
   static {
-    this.styles = b;
-  }
-  static {
-    this.shadowRootOptions = u;
+    this.styles = S;
   }
   close() {
-    this._isDeleteInProgress && this.solutionDeleted.emit(!0), this._showDeleteError = !1, this._isDeleteInProgress = !1, this.open = !1, this.dialogOpen.emit(!1);
+    this._showDeleteError = !1, this._isDeleteInProgress = !1, this.open = !1, this.dialogOpen.emit(!1);
   }
   delete() {
     if (this._isDeleteInProgress = !0, this.card) {
-      const i = [{
+      const e = [{
         itemName: this.card.title,
         itemType: "Solution",
         owner: this.card.owner,
         modified: this.card.modified
-      }], n = {
+      }], o = {
         progressCallback: (t) => {
           this._deletePercentage = Math.round(t);
         }
       };
-      g(this.card.id, this.userSessionContextConsumer.value, n).then((t) => {
+      f(this.card.id, this.userSessionContextConsumer.value, o).then((t) => {
         console.log(t);
-        const l = t[1];
-        let o;
-        l ? o = l.items.map((e) => ({
-          itemName: e.title,
-          itemType: e.type,
-          owner: e.owner,
-          modified: e.modified
-        })) : o = i, o.length === 0 ? (this.solutionDeleted.emit(!0), this._isDeleteInProgress = !1, this.open = !1) : this.card ? this._processTemplates(this.card).then((e) => {
-          this._templates = e, this._showDeleteError = !0, this._isDeleteInProgress = !1;
+        const n = t[1];
+        let s;
+        n ? s = n.items.map((i) => ({
+          itemName: i.title,
+          itemType: i.type,
+          owner: i.owner,
+          modified: i.modified
+        })) : s = e, s.length === 0 ? (this.solutionDeleted.emit(!0), this._isDeleteInProgress = !1, this.open = !1) : this.card ? this._processTemplates(this.card).then((i) => {
+          this._templates = i, this._showDeleteError = !0, this._isDeleteInProgress = !1;
         }) : (this._showDeleteError = !0, this._isDeleteInProgress = !1);
       });
     }
   }
   async load() {
-    this.card && (this._templates = await this._processTemplates(this.card));
+    if (!this.card)
+      return;
+    this._templates = await this._processTemplates(this.card);
+    const e = new Set(this._templates.map((s) => s.id)), o = [], t = this._templates.map(async (s) => {
+      const i = await this._getRelatedDependency(s.id);
+      return { template: s, relatedItems: i };
+    }), n = await Promise.all(t);
+    for (const { template: s, relatedItems: i } of n)
+      for (const a of i)
+        if (a.relationshipType !== "Solution2Item")
+          for (const r of a.relatedItemIds)
+            e.has(r) || o.push({
+              controlItemId: s.id,
+              dependencyItemId: r
+            });
+    this._nonSolutionDependencyItems = o;
+  }
+  updated(e) {
+    if (e.has("open")) {
+      const o = e.get("open");
+      this.open && !o && this._processTemplates(this.card).then((t) => {
+        this._templates = t;
+      });
+    }
   }
   render() {
-    return s`<calcite-dialog class="panel-bg-color" close-disabled .heading=${this._translations.title.replace("{{solution}}", this.card?.title ?? "")} id=${this._translations.title.replace("{{solution}}", this.card?.title ?? "") ?? p} modal .open=${this.open} outside-close-disabled @calciteDialogClose=${() => {
+    const e = [...new Set(this._nonSolutionDependencyItems.map((n) => n.controlItemId))], o = this._templates.length - this._nonSolutionDependencyItems.length, t = this._translations.deletionCount.replace("{{deleteableCount}}", o.toString()).replace("{{totalCount}}", this._templates.length.toString());
+    return l`<calcite-dialog class="panel-bg-color" close-disabled .heading=${this._translations.title.replace("{{solution}}", this.card?.title ?? "")} id=${this._translations.title.replace("{{solution}}", this.card?.title ?? "") ?? p} modal .open=${this.open} outside-close-disabled @calciteDialogClose=${() => {
       this.open = !1, this.dialogOpen.emit(!1);
-    }}>${this._isDeleteInProgress ? s`<calcite-loader .label=${this._translations.deleteInProgress} scale=l .text=${this._translations.deleteInProgress} type=determinate-value .value=${this._deletePercentage}></calcite-loader>` : s`<calcite-label layout=inline>${this._translations.deletionNote}<calcite-chip .label=${this._translations.deletionCount.replace("{{count}}", this.card?.title ?? "")}>${this._templates.length > 1 ? this._translations.deletionCountMultiple.replace("{{count}}", this._templates.length.toString()) : this._translations.deletionCount.replace("{{count}}", this._templates.length.toString())}</calcite-chip></calcite-label><solution-item-accordion .templateInfos=${this._templates}></solution-item-accordion><calcite-button appearance=outline @click=${this.close} slot=footer-end>${this._translations.buttonCancel}</calcite-button><calcite-button @click=${() => {
+    }}>${this._isDeleteInProgress ? l`<calcite-loader .label=${this._translations.deleteInProgress} scale=l .text=${this._translations.deleteInProgress} type=determinate-value .value=${this._deletePercentage}></calcite-loader>` : l`<calcite-label layout=inline>${this._translations.deletionNote}<calcite-chip .label=${t}>${t}</calcite-chip></calcite-label><solution-item-accordion .itemRelationshipDependencies=${e} .templateInfos=${this._templates} list-selection-mode=single></solution-item-accordion><calcite-button appearance=outline @click=${this.close} slot=footer-end>${this._translations.buttonCancel}</calcite-button><calcite-button @click=${() => {
       this.delete();
-    }} slot=footer-end kind=danger>${this._translations.buttonDelete}</calcite-button>${this._showDeleteError && s`<calcite-alert icon=exclamation-mark-triangle kind=danger .label=${this._translations.failedToDelete} @calciteAlertClose=${() => {
+    }} slot=footer-end kind=danger>${this._translations.buttonDelete}</calcite-button>${this._showDeleteError && l`<calcite-alert icon=exclamation-mark-triangle kind=danger .label=${this._translations.failedToDelete} @calciteAlertClose=${() => {
       this._showDeleteError = !1;
     }} open><div slot=message>${this._translations.failedToDelete}</div></calcite-alert>` || ""}`}</calcite-dialog>`;
   }
-  async _processTemplates(i) {
-    return await D(i.id, this.userSessionContextConsumer.value);
+  async _processTemplates(e) {
+    return await b(e.id, this.userSessionContextConsumer.value);
+  }
+  async _getRelatedDependency(e) {
+    return await _(e, "reverse", this.userSessionContextConsumer.value);
   }
 }
-c("solution-delete-dialog", C);
+h("solution-delete-dialog", C);
 export {
   C as SolutionDeleteDialog
 };

package/dist/components/solution-deploy-dialog/customElement.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="../../index.d.ts" />
 import { PublicLitElement as LitElement, TargetedEvent, JsxNode } from '@arcgis/lumina';
-import { IDeployFailed, IDeployProgressUpdate, IRequestDeploySolution, ISolutionInfoCard } from '../../utils/interfaces';
+import { IDeployFailed, IDeployProgressUpdate, ISolutionInfoCard, IUserOption } from '../../utils/interfaces';
 import { UserSession } from '@esri/solution-common';
 
 export declare class SolutionDeployDialog extends LitElement {
@@ -16,6 +16,11 @@ export declare class SolutionDeployDialog extends LitElement {
      * @default false
      */
     open: boolean;
+    /**
+     * TODO...this will need to be thought through some more...
+     * may be able to remove completely for v2 but need to look closer at other custom params that were supported to see
+     */
+    userOptions: IUserOption[];
     /** The user session to use for fetching solutions */
     readonly userSessionContextConsumer: import('@lit/context').ContextConsumer<{
         __context__: UserSession;
@@ -39,7 +44,7 @@ export declare class SolutionDeployDialog extends LitElement {
      * Emitted on demand when deploy progress ends
      * The emitted boolean value indicates if the process was successful or not
      */
-    readonly deployProgressEnd: TargetedEvent<this, boolean>;
+    readonly deployProgressEnd: TargetedEvent<this, string>;
     /** Emitted on demand when deploy progress is started */
     readonly deployProgressStart: TargetedEvent<this, void>;
     /** Emitted on demand when deploy progress is updated */