@esri/solutions-components 1.0.5 → 1.1.0-next.20250731

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

@@ -1,14 +1,16 @@
-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";
+import { c as p } from "../../chunks/runtime.js";
+import { u as h } from "../../chunks/useT9n.js";
+import { LitElement as m, createEvent as g } from "@arcgis/lumina";
+import { useContextConsumer as c } from "@arcgis/lumina/context";
+import { css as f, html as i } from "lit";
+import { a as _, u as v } from "../../chunks/deployAppContexts.js";
+import { v as w } from "../../chunks/helpers.js";
+import { createRef as o, ref as n } from "lit-html/directives/ref.js";
+import { updateItem as d, getItem as $ } from "@esri/solution-common";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
-See https://js.arcgis.com/1.0/esri/copyright.txt for details.
-v1.0.5 */
-const v = g`/** @license
+See https://js.arcgis.com/1.1/esri/copyright.txt for details.
+v1.1.0-next.20250731 */
+const S = f`/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -22,41 +24,49 @@ const v = g`/** @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}.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 {
+ */.minor-card{width:16%}.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-35{max-width:35vw}.large-card{width:49%}.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}.calcite-internal-dialog-content-padding-override{--calcite-internal-dialog-content-padding: 0px}.background-color-2{background-color:var(--calcite-color-foreground-2)}.card-group-padding{padding:1rem 1rem 2rem}.solution-content-padding{padding:1rem}@media (max-width: 1240px){.large-card{width:48%}}.error-icon-color{--calcite-icon-color: var(--calcite-color-status-danger)}`;
+class b extends m {
   constructor() {
-    super(...arguments), this.authContextConsumer = h({
+    super(...arguments), this.open = !1, this.showSuccessAlert = !1, this.templateInfos = [], this._configureTitlesOpen = !1, this._deleteDialogOpen = !1, this._displayClass = "", this._isNameConflict = !1, this._invalidNameMessage = "", this._showFailedAlert = !1, this._showItemUpdateLoading = !1, this._translations = h({ name: "solution-configure-dialog", blocking: !0 }), this._authContextConsumer = c({
       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();
+    }), this._editSummaryRef = o(), this._editSummaryPopoverRef = o(), this._editNameRef = o(), this._editNamePopoverRef = o(), this._solutionSnippetUpdated = !1, this._solutionTitleUpdated = !1, this._typeKeywords = [], this._updateSolutionNameInputRef = o(), this._updateSolutionSummaryInputRef = o(), this._userSessionContextConsumer = c({
+      context: v,
+      subscribe: !0
+    }), this.solutionConfigureDialogClose = g();
   }
   static {
-    this.properties = { authContextConsumer: 0, card: 0, cardRef: 1, open: 5, showSuccessAlert: 5, templateInfos: 0, _configureTitlesOpen: 16, _displayClass: 16, _translations: 16 };
+    this.properties = { card: 0, cardRef: 1, open: 5, showSuccessAlert: 5, templateInfos: 0, _configureTitlesOpen: 16, _deleteDialogOpen: 16, _displayClass: 16, _isNameConflict: 16, _invalidNameMessage: 16, _showFailedAlert: 16, _showItemUpdateLoading: 16, _translations: 16 };
   }
   static {
-    this.styles = v;
-  }
-  async load() {
-    this.templateInfos = await this.cardRef.getTemplates();
+    this.styles = S;
   }
   updated(e) {
     if (e.has("open")) {
       const t = e.get("open");
-      this.open && !t && this.cardRef.getTemplates().then((o) => {
-        this.templateInfos = o;
+      this.open && !t && this.cardRef.getTemplates().then((s) => {
+        this.templateInfos = s;
       });
     }
   }
   render() {
-    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>`;
+    return i`<div>${this.templateInfos.length > 0 && i`<calcite-dialog class=${`${this._displayClass} calcite-internal-dialog-content-padding-override`} .heading=${this.card?.title} modal @calciteDialogClose=${() => {
+      this.open = !1, this.solutionConfigureDialogClose.emit(this._solutionSnippetUpdated || this._solutionTitleUpdated), 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 card-group-padding background-color-2"><calcite-card-group .label=${this._translations.reviewAndConfigureSolution}>${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><div slot=alerts>${this._getSuccessAlert()}${this._getFailedAlert()}</div></calcite-dialog>` || ""}${this.templateInfos.length > 0 && this._getConfigureTitlesDialog() || ""}${this.templateInfos.length > 0 && this._getDeleteDialog() || ""}</div>`;
   }
   _getConfigureTitlesDialog() {
     return this._configureTitlesOpen ? i`<solution-configure-titles .card=${this.card} @solutionConfigureTitlesBeforeClose=${() => {
       this._displayClass = "", this._configureTitlesOpen = !1;
+    }} @solutionItemsTitlesChanged=${async () => {
+      this.templateInfos = await this.cardRef.getTemplates();
     }} .open=${this._configureTitlesOpen} .templateInfos=${this.templateInfos}></solution-configure-titles>` : "";
   }
+  _getFailedAlert() {
+    const e = this._failedType === "snippet" ? this._translations.failedToUpdateSnippet : this._failedType === "title" ? this._translations.failedToUpdateTitle : this._failedType === "titles" ? this._translations.failedToUpdateTitles : void 0;
+    return this._showFailedAlert && e ? i`<calcite-alert auto-close icon=exclamation-mark-triangle kind=danger .label=${e} @calciteAlertClose=${() => {
+      this._showFailedAlert = !1;
+    }} .open=${this._showFailedAlert}><div slot=message>${e}</div></calcite-alert>` : "";
+  }
   _getSuccessAlert() {
     return this.showSuccessAlert ? i`<calcite-alert auto-close icon=check-circle kind=success .label=${this.card?.title || ""} @calciteAlertClose=${() => {
       this.showSuccessAlert = !1;
@@ -78,48 +88,91 @@ class w extends p {
   _getSolutionVersionCard() {
     return this._getBasicCard(this._translations.solutionVersion, this._translations.youHaveTheLatestVersion, "check-shield", void 0, void 0, void 0, "Version 3.2");
   }
-  _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>`;
+  _getBasicCard(e, t, s, l, a, u, r) {
+    return i`<calcite-card class="minor-card 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=${s} scale=l></calcite-icon>${r ? i`<span class="font-weight-medium">${r}</span>` : ""}<p>${t}</p></div></div>${l ? i`<div class="btn-center" slot=footer-start><calcite-button .appearance=${a} kind=brand @click=${u}>${l}</calcite-button></div>` : ""}</calcite-card>`;
   }
   _getSolutionCard() {
     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>`;
+    return i`<calcite-card class="large-card 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 ${n(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 ${n(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 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=${() => {
+    return i`<div class="solution-content-padding"><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>`;
   }
+  _getDeleteDialog() {
+    return this._deleteDialogOpen ? i`<solution-delete-dialog .card=${this.card} @solutionDeleted=${this._close} @solutionDeleteDialogBeforeClose=${() => {
+      this._displayClass = "", this._deleteDialogOpen = !1;
+    }} .open=${this._deleteDialogOpen}></solution-delete-dialog>` : "";
+  }
   async _deleteSolution() {
-    this._displayClass = "display-none";
-    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();
-    }));
+    this._displayClass = "display-none", this._deleteDialogOpen = !0;
   }
   _showItemDetails() {
     window.open(this.card.itemUrl, "_blank");
   }
   _openUserProfile(e) {
     e.stopPropagation();
-    const t = this.authContextConsumer.value?.PortalSubset?.orgUrl;
+    const t = this._authContextConsumer.value?.PortalSubset?.orgUrl;
     t && window.open(`${t}/home/user.html`, "_blank");
   }
   _showChangeOwner() {
   }
   _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>`;
-  }
-  _closeSummaryChangePopup(e) {
-    console.log(e), this._editSummaryPopoverRef.value && (this._editSummaryPopoverRef.value.open = !1);
+    return i`<calcite-popover .heading=${this._translations.updateSolutionSummary} .label=${this._translations.updateSolutionSummary} overlay-positioning=fixed .referenceElement=${e} ${n(this._editSummaryPopoverRef)}><calcite-text-area class="padding-3-4 margin-0 width-400" rows=6 .value=${this.card?.snippet || ""} ${n(this._updateSolutionSummaryInputRef)}></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 .loading=${this._showItemUpdateLoading} @click=${() => this._closeSummaryChangePopup(!0)} width=full>${this._translations.ok}</calcite-button></div></calcite-popover>`;
+  }
+  async _closeSummaryChangePopup(e) {
+    const t = this.card.snippet !== this._updateSolutionSummaryInputRef.value.value;
+    if (t)
+      if (e && t) {
+        this._showItemUpdateLoading = !0;
+        const s = {
+          id: this.card.id,
+          snippet: this._updateSolutionSummaryInputRef.value.value
+        }, l = await d(s, this._userSessionContextConsumer.value), a = await this._getItem(l.id);
+        l.success && a && this.card.snippet !== a.snippet && (this.card.snippet = a.snippet, this.card = { ...this.card }, this._solutionSnippetUpdated = !0), this._updateSolutionSummaryInputRef.value.value !== a.snippet && (this._resetSnippet(), this._failedType = "snippet", this._showFailedAlert = !0);
+      } else t && this._resetSnippet();
+    this._showItemUpdateLoading = !1, this._editSummaryPopoverRef.value.open = !1;
+  }
+  _resetSnippet() {
+    setTimeout(() => {
+      this._updateSolutionSummaryInputRef.value.value = this.card.snippet;
+    }, 100);
+  }
+  async _getItem(e) {
+    return await $(e, { authentication: this._userSessionContextConsumer.value });
   }
   _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);
+    return i`<calcite-popover .heading=${this._translations.updateSolutionName} .label=${this.card?.title || ""} @calcitePopoverClose=${() => {
+      this._closeNameChangePopup(!1);
+    }} overlay-positioning=fixed .referenceElement=${e} ${n(this._editNamePopoverRef)}><calcite-input class="padding-3-4 margin-0 width-400" max-length=250 @calciteInputInput=${async (t) => {
+      const s = t.target.value.trim();
+      if (s !== this.card?.title) {
+        const l = await this._validateName(s);
+        this._updateSolutionNameInputRef.value?.value.trim() === s && (this._isNameConflict = !l);
+      } else
+        this._isNameConflict = !1;
+    }} required .value=${this.card?.title} ${n(this._updateSolutionNameInputRef)}></calcite-input>${this._isNameConflict && this._updateSolutionNameInputRef.value && i`<calcite-label layout=inline class="padding-3-4 margin-0 width-400"><calcite-icon class="error-icon-color" icon=exclamation-mark-triangle scale=s></calcite-icon>${this._invalidNameMessage}</calcite-label>` || ""}<div class="display-flex flex-direction-row padding-3-4 margin-0"><calcite-button appearance=outline @click=${() => {
+      this._isNameConflict = !1, this._closeNameChangePopup(!1);
+    }} width=full>${this._translations.cancelTheDialog}</calcite-button><calcite-button .disabled=${this._isNameConflict} width=full .loading=${this._showItemUpdateLoading} @click=${() => void this._closeNameChangePopup(!0)}>${this._translations.ok}</calcite-button></div></calcite-popover>`;
+  }
+  async _closeNameChangePopup(e) {
+    if (this.card.title !== this._updateSolutionNameInputRef.value.value)
+      if (e) {
+        this._showItemUpdateLoading = !0;
+        const s = {
+          id: this.card.id,
+          title: this._updateSolutionNameInputRef.value.value
+        }, l = await d(s, this._userSessionContextConsumer.value), a = await this._getItem(l.id);
+        l.success && a && this.card.title !== a.title && (this.card.title = a.title, this.card = { ...this.card }, this._solutionTitleUpdated = !0), this._updateSolutionNameInputRef.value.value !== a.title && (this._resetTitle(), this._failedType = "title", this._showFailedAlert = !0);
+      } else
+        this._resetTitle();
+    this._showItemUpdateLoading = !1, this._editNamePopoverRef.value.open = !1;
+  }
+  _resetTitle() {
+    setTimeout(() => {
+      this._updateSolutionNameInputRef.value.value = this.card.title;
+    }, 100);
   }
   _close() {
     this.open = !1;
@@ -127,8 +180,30 @@ class w extends p {
   _cleanupPanel() {
     this._editSummaryPopoverRef.value?.open && (this._editSummaryPopoverRef.value.open = !1), this._editNamePopoverRef.value?.open && (this._editNamePopoverRef.value.open = !1);
   }
+  async _validateName(e) {
+    this._invalidNameMessage = "";
+    const t = await w(e, this._userSessionContextConsumer.value);
+    if (!t.status) {
+      switch (t.type) {
+        case "empty":
+          this._invalidNameMessage = this._translations.solutionNameErrorBlank;
+          break;
+        case "exceed length":
+          this._invalidNameMessage = this._translations.solutionNameErrorLength;
+          break;
+        case "special character":
+          this._invalidNameMessage = this._translations.solutionNameErrorSpecialCharacter;
+          break;
+        case "not unique":
+          this._invalidNameMessage = this._translations.solutionNameErrorUniqueName;
+          break;
+      }
+      return t.status;
+    }
+    return !0;
+  }
 }
-d("solution-configure-dialog", w);
+p("solution-configure-dialog", b);
 export {
-  w as SolutionConfigureDialog
+  b as SolutionConfigureDialog
 };

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

@@ -8,6 +8,7 @@ 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 "../solution-delete-dialog/index.js";
 import "@esri/calcite-components/components/calcite-popover";
 import "@esri/calcite-components/components/calcite-text-area";
 import "@esri/calcite-components/components/calcite-input";

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

@@ -8,6 +8,7 @@ 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 "../solution-delete-dialog/index.js";
 import "@esri/calcite-components/components/calcite-popover";
 import "@esri/calcite-components/components/calcite-text-area";
 import "@esri/calcite-components/components/calcite-input";

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

@@ -1,4 +1,4 @@
-/// <reference types="../../index.d.ts" />
+/// <reference path="../../index.d.ts" />
 import { PublicLitElement as LitElement, TargetedEvent, JsxNode } from '@arcgis/lumina';
 import { ISolutionInfoCard, ITemplateInfo } from '../../utils/interfaces';
 import { PropertyValues } from 'lit';
@@ -16,4 +16,6 @@ export declare class SolutionConfigureTitles extends LitElement {
     templateInfos: ITemplateInfo[];
     /** This event will be emitted when this dialog is closed */
     readonly solutionConfigureTitlesBeforeClose: TargetedEvent<this, void>;
+    /** This event will be emitted when the titles have been updated */
+    readonly solutionItemsTitlesChanged: TargetedEvent<this, void>;
 }

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

@@ -1,13 +1,15 @@
-import { c as a } from "../../chunks/runtime.js";
-import { u as n } from "../../chunks/useT9n.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 t } from "lit";
+import { c as r } from "../../chunks/runtime.js";
+import { u } from "../../chunks/useT9n.js";
+import { LitElement as c, createEvent as n } from "@arcgis/lumina";
+import { useContextConsumer as d } from "@arcgis/lumina/context";
+import { css as p, html as l } from "lit";
+import { createRef as o, ref as a } from "lit-html/directives/ref.js";
+import { u as f } from "../../chunks/deployAppContexts.js";
+import { updateItem as h } from "@esri/solution-common";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
-See https://js.arcgis.com/1.0/esri/copyright.txt for details.
-v1.0.5 */
-const d = r`/** @license
+See https://js.arcgis.com/1.1/esri/copyright.txt for details.
+v1.1.0-next.20250731 */
+const m = p`/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -22,15 +24,18 @@ const d = r`/** @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 u extends o {
+class _ extends c {
   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 = "", this.solutionConfigureTitlesBeforeClose = c();
+    super(...arguments), this.open = !1, this.templateInfos = [], this._displayTemplateInfos = [], this._solutionItemsTitlesUpdating = !1, this._translations = u({ name: "solution-configure-titles", blocking: !0 }), this._prefixRef = o(), this._prefixValue = "", this._suffixRef = o(), this._suffixValue = "", this._userSessionContextConsumer = d({
+      context: f,
+      subscribe: !0
+    }), this.solutionConfigureTitlesBeforeClose = n(), this.solutionItemsTitlesChanged = n();
   }
   static {
-    this.properties = { card: 0, open: 5, templateInfos: 0, _displayTemplateInfos: 16, _translations: 16 };
+    this.properties = { card: 0, open: 5, templateInfos: 0, _displayTemplateInfos: 16, _solutionItemsTitlesUpdating: 16, _translations: 16 };
   }
   static {
-    this.styles = d;
+    this.styles = m;
   }
   willUpdate(e) {
     e.has("templateInfos") && this._updateTemplates();
@@ -40,18 +45,18 @@ class u extends o {
   }
   render() {
     const e = this._translations.configureTitlesDialogHeader.replace("{{solutionName}}", this.card.title);
-    return t`<calcite-dialog .heading=${e} modal @calciteDialogBeforeClose=${() => {
+    return l`<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 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>`;
+    return l`<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} ${a(this._prefixRef)}></calcite-input></calcite-label><calcite-label class="width-full">${this._translations.suffixToAddToItems}<calcite-input @input=${this._suffixInput} .placeholder=${this._translations.enterSuffixPlaceholder} ${a(this._suffixRef)}></calcite-input></calcite-label></div></div>`;
   }
   _getAccordion() {
-    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>`;
+    return l`<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 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>`;
+    return l`<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 .loading=${this._solutionItemsTitlesUpdating} @click=${this._commitNameChanges}>${this._translations.keepChangesAndCloseTheDialog}</calcite-button></div>`;
   }
   _prefixInput() {
     clearTimeout(this._textInputTimeout), this._textInputTimeout = setTimeout(() => {
@@ -64,17 +69,28 @@ class u extends o {
     }, 500);
   }
   _updateTemplates() {
-    const e = JSON.parse(JSON.stringify(this.templateInfos));
-    this._displayTemplateInfos = e.map((i) => (i.title = `${`${this._prefixValue} `}${i.title}${` ${this._suffixValue}`}`, i));
+    const e = /[^\s\\]/.test(this._prefixValue), i = /[^\s\\]/.test(this._suffixValue), s = JSON.parse(JSON.stringify(this.templateInfos));
+    this._displayTemplateInfos = s.map((t) => (t.title = e && i ? `${`${this._prefixValue} `}${t.title}${` ${this._suffixValue}`}` : e ? `${`${this._prefixValue} `}${t.title}` : i ? `${t.title}${` ${this._suffixValue}`}` : t.title, t));
   }
   _closeDialog() {
     this.open = !1;
   }
-  _commitNameChanges() {
-    console.log("Commit the name changes here");
+  async _commitNameChanges() {
+    if (JSON.stringify(this.templateInfos) !== JSON.stringify(this._displayTemplateInfos)) {
+      this._solutionItemsTitlesUpdating = !0;
+      const e = this._displayTemplateInfos.reduce((i, s) => {
+        const t = {
+          id: s.id,
+          title: s.title
+        };
+        return i.push(h(t, this._userSessionContextConsumer.value)), i;
+      }, []);
+      await Promise.all(e), this._solutionItemsTitlesUpdating = !1, this.solutionItemsTitlesChanged.emit();
+    }
+    this._closeDialog();
   }
 }
-a("solution-configure-titles", u);
+r("solution-configure-titles", _);
 export {
-  u as SolutionConfigureTitles
+  _ as SolutionConfigureTitles
 };

package/dist/components/solution-contents/customElement.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="../../index.d.ts" />
+/// <reference path="../../index.d.ts" />
 import { IInventoryItem } from '../../utils/interfaces';
 import { PropertyValues } from 'lit';
 import { PublicLitElement as LitElement, TargetedEvent, JsxNode } from '@arcgis/lumina';

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

@@ -1,11 +1,10 @@
 import { c as n } from "../../chunks/runtime.js";
-import { html as r, nothing as c } from "lit";
-import { LitElement as a, createEvent as l, noShadowRoot as d } from "@arcgis/lumina";
-import { css as o } from "@lit/reactive-element/css-tag.js";
+import { css as a, html as r, nothing as c } from "lit";
+import { LitElement as l, createEvent as d, noShadowRoot as o } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
-See https://js.arcgis.com/1.0/esri/copyright.txt for details.
-v1.0.5 */
-const h = o`@layer{/** @license
+See https://js.arcgis.com/1.1/esri/copyright.txt for details.
+v1.1.0-next.20250731 */
+const h = a`@layer{/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -20,9 +19,9 @@ const h = o`@layer{/** @license
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */.icon-text{@apply truncate;}}`;
-class p extends a {
+class p extends l {
   constructor() {
-    super(...arguments), this.selectedItemId = "", this.templateHierarchy = [], this.solutionItemSelected = l();
+    super(...arguments), this.selectedItemId = "", this.templateHierarchy = [], this.solutionItemSelected = d();
   }
   static {
     this.properties = { selectedItemId: 3, templateHierarchy: 2 };
@@ -31,7 +30,7 @@ class p extends a {
     this.styles = h;
   }
   static {
-    this.shadowRootOptions = d;
+    this.shadowRootOptions = o;
   }
   willUpdate(t) {
     t.has("templateHierarchy") && (this.hasUpdated || this.templateHierarchy?.length > 0) && this.valueWatchHandler(this.templateHierarchy, t.get("templateHierarchy"));

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

@@ -1,4 +1,4 @@
-/// <reference types="../../index.d.ts" />
+/// <reference path="../../index.d.ts" />
 import { PropertyValues } from 'lit';
 import { PublicLitElement as LitElement, TargetedEvent, JsxNode } from '@arcgis/lumina';
 import { ISolutionInfoCard, ITemplateInfo } from '../../utils/interfaces';
@@ -8,11 +8,11 @@ export type DependencyItem = {
 };
 
 export declare class SolutionDeleteDialog extends LitElement {
-    /** The authentication from global nav */
-    authContextConsumer: import('@lit/context').ContextConsumer<{
-        __context__: import('../../utils/Auth').Auth;
-    }, HTMLElement & import('lit').ReactiveControllerHost>;
-    /** Key details about the solution */
+    /**
+     * Key details about the solution
+     *
+     * @required
+     */
     card: ISolutionInfoCard | undefined;
     /**
      * When true the dialog will be shown
@@ -20,16 +20,14 @@ export declare class SolutionDeleteDialog extends LitElement {
      * @default false
      */
     open: boolean;
-    /** The user session to use for fetching solutions */
-    userSessionContextConsumer: import('@lit/context').ContextConsumer<{
-        __context__: import('@esri/arcgis-rest-request').ArcGISIdentityManager;
-    }, HTMLElement & import('lit').ReactiveControllerHost>;
     /** Closes the panel */
     close(): void;
     /** Deletes the solution provided in the card property. */
     delete(): void;
     /** Emitted when the dialog is closed. */
-    readonly dialogOpen: TargetedEvent<this, boolean>;
+    readonly solutionDeleteDialogOpen: TargetedEvent<this, boolean>;
     /** Emitted after delete process to refresh solutions list */
     readonly solutionDeleted: TargetedEvent<this, boolean>;
+    /** This event will be emitted on dialog before close */
+    readonly solutionDeleteDialogBeforeClose: TargetedEvent<this, void>;
 }