@esri/solutions-components 5.1.0-next.75 → 5.1.0-next.77

package/dist/components/solution-deployed-card-panel/customElement.js

@@ -1,11 +1,11 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
 import { c as u } from "../../chunks/runtime.js";
 import { u as m } from "../../chunks/useT9n.js";
-import { LitElement as f, createEvent as r, safeClassMap as b, nothing as d } from "@arcgis/lumina";
+import { LitElement as f, createEvent as c, safeClassMap as b, nothing as d } from "@arcgis/lumina";
 import { useContextConsumer as g } from "@arcgis/lumina/context";
-import { css as x, html as t } from "lit";
+import { css as x, html as i } from "lit";
 import { c as _, i as v } from "../../chunks/deployAppContexts.js";
-import { F as y, T as s, H as w, z as C, J as $ } from "../../chunks/helpers.js";
+import { F as y, T as r, H as w, z as C, J as $ } from "../../chunks/helpers.js";
 import { f as S, g as p, a as k } from "../../chunks/cardsHelpers.js";
 import { g as D } from "../../chunks/getRelatedInfos.js";
 import * as h from "@esri/solution-common";
@@ -22,9 +22,9 @@ class I extends f {
       context: v,
       subscribe: !0,
       callback: (e) => this.isMobile = e
-    }), this.navTabSelected = r(), this.forceSelectTab = r(), this.sortTypeChanged = r(), this.solutionConfigureDialogClose = r(), this._nonSolutionDependencyItems = [], this._openFolder = (e) => {
+    }), this.navTabSelected = c(), this.forceSelectTab = c(), this.sortTypeChanged = c(), this.solutionConfigureDialogClose = c(), this._nonSolutionDependencyItems = [], this._openFolder = (e) => {
       e.stopPropagation(), this._telemetry?.logEvent({
-        category: s.DEPLOYMENTS,
+        category: r.DEPLOYMENTS,
         action: "Open Folder",
         dimensions: [
           this.card?.title || "",
@@ -33,10 +33,10 @@ class I extends f {
           "Details Page"
         ]
       });
-      const i = this._configContextConsumer.value?.orgUrl;
-      if (!i)
+      const t = this._configContextConsumer.value?.orgUrl;
+      if (!t)
         return;
-      const a = this._folderId || this.card?.owner, o = `${i}/home/content.html?folder=${a}`;
+      const a = this._folderId || this.card?.owner, o = `${t}/home/content.html?folder=${a}`;
       window.open(o, "_blank");
     }, this.listenOn(window, "deployedCardSelected", this._deployedCardSelected), this.listenOn(window, "deployAppTabSelected", this._handleDeployAppTabSelected), this.listenOn(window, "displayDeployedCard", () => {
       w({
@@ -62,29 +62,29 @@ class I extends f {
   }
   async load() {
     if (this._isMobileContextConsumer.value && (this.isMobile = this._isMobileContextConsumer.value), this.card?.thumbnailUrl) {
-      const e = this._configContextConsumer.value?.userSession, i = this.card?.thumbnailUrl.replace(/w=\d+/, "w=400");
-      this._thumbnailUrl = `${i}&token=${e?.token}`;
+      const e = this._configContextConsumer.value?.userSession, t = this.card?.thumbnailUrl.replace(/w=\d+/, "w=400");
+      this._thumbnailUrl = `${t}&token=${e?.token}`;
     }
   }
   willUpdate(e) {
     if (e.has("card")) {
-      const i = this._configContextConsumer.value?.userSession, a = this.card?.thumbnailUrl.replace(/w=\d+/, "w=400");
-      this._thumbnailUrl = `${a}&token=${i?.token}`, this._folderLoading = !0, this._folderName = "", this._folderId = null;
+      const t = this._configContextConsumer.value?.userSession, a = this.card?.thumbnailUrl.replace(/w=\d+/, "w=400");
+      this._thumbnailUrl = `${a}&token=${t?.token}`, this._folderLoading = !0, this._folderName = "", this._folderId = null;
     }
   }
   render() {
-    return this.isMobile ? t`<calcite-shell class="position-relative background-color-2"><calcite-panel class="panel-background-2 border-none" slot=panel-bottom><div class="background-color-2 padding-top-lg">${this._getSolutionPanel()}</div><div class="background-color-1 margin-top-xxl">${this._getButtons()}${this._getOwnerSection()}${this.card?.owner === this._configContextConsumer.value?.userSession?.username && t`<div class="bottom-border margin-start-end-xxl"></div>${this._getFolderSection()}` || ""}<div class="bottom-border margin-start-end-xxl"></div>${this._getSolutionVersionCard()}</div>${this._getSolutionContents()}</calcite-panel></calcite-shell>` : t`<calcite-shell class="position-relative background-color-2"><calcite-panel class="padding-end-xxl panel-background-2 border-none" slot=panel-bottom><div class="display-flex flex-direction-column overflow-hidden"><div class="background-color-2 padding-top-xxl">${this._getSolutionPanel()}</div>${this._getSolutionContents()}</div></calcite-panel><calcite-shell-panel class="panel-background-1" slot=panel-end>${this._getButtons()}${this._getOwnerSection()}${this.card?.owner === this._configContextConsumer.value?.userSession?.username && t`<div class="bottom-border margin-start-end-xxl"></div>${this._getFolderSection()}` || ""}<div class="bottom-border margin-start-end-xxl"></div>${this._getSolutionVersionCard()}</calcite-shell-panel>${this._renderDiagramDialog()}${this._getConfigureTitlesDialog()}${this._getDeleteDialog()}</calcite-shell>`;
+    return this.isMobile ? i`<calcite-shell class="position-relative background-color-2"><calcite-panel class="panel-background-2 border-none" slot=panel-bottom><div class="background-color-2 padding-top-lg">${this._getSolutionPanel()}</div><div class="background-color-1 margin-top-xxl">${this._getButtons()}${this._getOwnerSection()}${this.card?.owner === this._configContextConsumer.value?.userSession?.username && i`<div class="bottom-border margin-start-end-xxl"></div>${this._getFolderSection()}` || ""}<div class="bottom-border margin-start-end-xxl"></div>${this._getSolutionVersionCard()}</div>${this._getSolutionContents()}</calcite-panel></calcite-shell>` : i`<calcite-shell class="position-relative background-color-2"><calcite-panel class="padding-end-xxl panel-background-2 border-none" slot=panel-bottom><div class="display-flex flex-direction-column overflow-hidden"><div class="background-color-2 padding-top-xxl">${this._getSolutionPanel()}</div>${this._getSolutionContents()}</div></calcite-panel><calcite-shell-panel class="panel-background-1" slot=panel-end>${this._getButtons()}${this._getOwnerSection()}${this.card?.owner === this._configContextConsumer.value?.userSession?.username && i`<div class="bottom-border margin-start-end-xxl"></div>${this._getFolderSection()}` || ""}<div class="bottom-border margin-start-end-xxl"></div>${this._getSolutionVersionCard()}</calcite-shell-panel>${this._renderDiagramDialog()}${this._getConfigureTitlesDialog()}${this._getDeleteDialog()}</calcite-shell>`;
   }
   async _deployedCardSelected(e) {
-    const i = e.detail;
-    this.card = i.card, this.cardRef = i.cardRef, this.templateInfos = [], this._accordionLoading = !0, this.templateInfos = await this._getTemplates(), this._accordionLoading = !1;
+    const t = e.detail;
+    this.card = t.card, this.cardRef = t.cardRef, this.templateInfos = [], this._accordionLoading = !0, this.templateInfos = await this._getTemplates(), this._accordionLoading = !1;
     const a = await D(this._configContextConsumer.value.userSession, this.card);
     this._nonSolutionDependencyItems = a._nonSolutionDependencyItems;
     const o = S(this._configContextConsumer.value?.allCards || [], this.card.deployCommonId);
     let n = !1;
     if (o) {
-      const l = p(o), c = p(this.card);
-      n = l > c;
+      const l = p(o), s = p(this.card);
+      n = l > s;
     }
     this._hasNewVersion = n, this._folderLoading = !0, this._folderName = "", this._folderId = null, await this._fetchFolderInfo(), this._folderLoading = !1;
   }
@@ -92,14 +92,14 @@ class I extends f {
     e.detail === "deployed-card" && this.sortTypeChanged.emit("");
   }
   _getButtons() {
-    const e = this._configContextConsumer.value?.userSession?.username, i = this._configContextConsumer.value?.authentication?.CanUpdateSolution, a = this.card?.owner === e || this._isOrgAdmin || i, o = this.card?.owner === e || this._isOrgAdmin, n = a ? "display-none" : "", l = this.isMobile ? "padding-lg" : "padding-xxl";
-    return t`<div class=${`display-flex flex-direction-column ${l}`}>${!this.isMobile && t`<calcite-button appearance=outline class="padding-bottom-lg solution-deployed-action" kind=neutral @click=${this._openDiagram}>${this._translations.viewTheDiagram}</calcite-button>` || ""}<calcite-button appearance=outline class="padding-bottom-lg solution-deployed-action" kind=neutral @click=${this._viewDocumentation}>${this._translations.solutionDocumentation}</calcite-button><calcite-button appearance=outline class="padding-bottom-lg solution-deployed-action" kind=neutral @click=${this._openItemDetails}>${this._translations.itemDetails}</calcite-button>${a && !this.isMobile && t`<calcite-button appearance=outline class="padding-bottom-lg solution-deployed-action" id=solution-configure-titles-button kind=neutral @click=${this._openConfigureTitlesDialog}>${this._translations.updateTitles}</calcite-button><calcite-tooltip class=${b(n)} overlay-positioning=fixed reference-element=solution-configure-titles-button><span>${this._translations.mustOwnSolution}</span></calcite-tooltip>` || ""}${o && !this.isMobile && t`<calcite-button appearance=outline class="padding-bottom-lg solution-deployed-action" kind=neutral @click=${this._deleteSolution}>${this._translations.deleteSolution}</calcite-button>` || ""}</div>`;
+    const e = this._configContextConsumer.value?.userSession?.username, t = this._configContextConsumer.value?.authentication?.CanUpdateSolution, a = this._configContextConsumer.value?.authentication?.CanDeleteSolution && this._configContextConsumer.value?.authentication?.CanUpdateSolution, o = this.card?.owner === e || this._isOrgAdmin || t, n = this.card?.owner === e || this._isOrgAdmin || a, l = o ? "display-none" : "", s = this.isMobile ? "padding-lg" : "padding-xxl";
+    return i`<div class=${`display-flex flex-direction-column ${s}`}>${!this.isMobile && i`<calcite-button appearance=outline class="padding-bottom-lg solution-deployed-action" kind=neutral @click=${this._openDiagram}>${this._translations.viewTheDiagram}</calcite-button>` || ""}<calcite-button appearance=outline class="padding-bottom-lg solution-deployed-action" kind=neutral @click=${this._viewDocumentation}>${this._translations.solutionDocumentation}</calcite-button><calcite-button appearance=outline class="padding-bottom-lg solution-deployed-action" kind=neutral @click=${this._openItemDetails}>${this._translations.itemDetails}</calcite-button>${o && !this.isMobile && i`<calcite-button appearance=outline class="padding-bottom-lg solution-deployed-action" id=solution-configure-titles-button kind=neutral @click=${this._openConfigureTitlesDialog}>${this._translations.updateTitles}</calcite-button><calcite-tooltip class=${b(l)} overlay-positioning=fixed reference-element=solution-configure-titles-button><span>${this._translations.mustOwnSolution}</span></calcite-tooltip>` || ""}${n && !this.isMobile && i`<calcite-button appearance=outline class="padding-bottom-lg solution-deployed-action" kind=neutral @click=${this._deleteSolution}>${this._translations.deleteSolution}</calcite-button>` || ""}</div>`;
   }
   _openConfigureTitlesDialog() {
     this._configureTitlesOpen = !0;
   }
   _getConfigureTitlesDialog() {
-    return this._configureTitlesOpen ? t`<solution-configure-titles .card=${this.card} @solutionConfigureTitlesBeforeClose=${async () => {
+    return this._configureTitlesOpen ? i`<solution-configure-titles .card=${this.card} @solutionConfigureTitlesBeforeClose=${async () => {
       this.templateInfos = await this._getTemplates(), this._configureTitlesOpen = !1;
     }} @solutionItemsTitlesChanged=${async () => {
       this.templateInfos = await this._getTemplates();
@@ -107,7 +107,7 @@ class I extends f {
   }
   _viewDocumentation(e) {
     e.stopPropagation(), this._telemetry?.logEvent({
-      category: s.DEPLOYMENTS,
+      category: r.DEPLOYMENTS,
       action: "Open Help",
       dimensions: [
         this.card?.title || "",
@@ -119,7 +119,7 @@ class I extends f {
   }
   _openItemDetails(e) {
     e.stopPropagation(), this._telemetry?.logEvent({
-      category: s.DEPLOYMENTS,
+      category: r.DEPLOYMENTS,
       action: "Open Item Details",
       dimensions: [
         this.card?.title || "",
@@ -133,13 +133,13 @@ class I extends f {
     if (!this._configContextConsumer?.value)
       return;
     const e = this.isMobile ? "margin-start-end-lg" : "margin-start-end-xxl";
-    return t`<div class=${`display-flex padding-bottom-xxl ${e} flex-direction-column`}><div class="display-flex justify-between items-baseline"><calcite-label class="font-weight-med label-override tabbing-offset" layout=inline scale=l tabindex=0>${this._translations.aboutYourSolutionOwner}</calcite-label></div><solution-user-avatar .fullname=${this._user?.username === this.card?.owner ? this._user?.fullName : void 0} .lookupProfile=${this._user?.username !== this.card?.owner} .thumbnailUrl=${this._user?.username === this.card?.owner ? this._user?.thumbnailUrl : void 0} .username=${this.card?.owner}></solution-user-avatar></div>`;
+    return i`<div class=${`display-flex padding-bottom-xxl ${e} flex-direction-column`}><div class="display-flex justify-between items-baseline"><calcite-label class="font-weight-med label-override tabbing-offset" layout=inline scale=l tabindex=0>${this._translations.aboutYourSolutionOwner}</calcite-label></div><solution-user-avatar .fullname=${this._user?.username === this.card?.owner ? this._user?.fullName : void 0} .lookupProfile=${this._user?.username !== this.card?.owner} .thumbnailUrl=${this._user?.username === this.card?.owner ? this._user?.thumbnailUrl : void 0} .username=${this.card?.owner}></solution-user-avatar></div>`;
   }
   async _openDiagram(e) {
     e.stopPropagation();
-    const i = await this._getTemplates();
-    i && (this._telemetry?.logEvent({
-      category: s.DEPLOYMENTS,
+    const t = await this._getTemplates();
+    t && (this._telemetry?.logEvent({
+      category: r.DEPLOYMENTS,
       action: "View Diagram",
       dimensions: [
         this.card?.title || "",
@@ -147,7 +147,7 @@ class I extends f {
         this.card?.deployVersion || "",
         "Details Page"
       ]
-    }), this._templateInfoGraph = i, this._isDiagramOpen = !0);
+    }), this._templateInfoGraph = t, this._isDiagramOpen = !0);
   }
   async _getTemplates() {
     return this.cardRef ? await this.cardRef.getTemplates() : this.card ? await C(this.card.id, this._configContextConsumer.value.userSession) : void 0;
@@ -158,34 +158,34 @@ class I extends f {
     const e = this._configContextConsumer.value?.userSession?.username;
     if (this.card?.owner === e)
       try {
-        const i = this._configContextConsumer.value?.userSession;
-        if (!i)
+        const t = this._configContextConsumer.value?.userSession;
+        if (!t)
           return;
-        const a = await h.getItemBase(this.card.id, i);
+        const a = await h.getItemBase(this.card.id, t);
         this._folderId = a.ownerFolder ?? null;
         const o = this._configContextConsumer.value?.userSession?.username;
         if (this.card?.owner !== o)
           return;
         if (this._folderId) {
-          const { folders: n } = await h.getFoldersAndGroups(i), l = n.find((c) => c.id === this._folderId);
+          const { folders: n } = await h.getFoldersAndGroups(t), l = n.find((s) => s.id === this._folderId);
           this._folderName = l?.title || this._folderId;
         } else
           this._folderName = this.card?.owner || "Root";
-      } catch (i) {
-        console.error("Error fetching folder info:", i), this._folderId = null, this._folderName = "";
+      } catch (t) {
+        console.error("Error fetching folder info:", t), this._folderId = null, this._folderName = "";
       }
   }
   _getFolderSection() {
     const e = this.isMobile ? "padding-lg" : "padding-xxl", a = !this._folderId ? "home" : "folder";
-    return t`<div class=${`${e} display-flex flex-direction-column`}><div class="display-flex justify-between items-baseline"><calcite-label class="font-weight-med label-override tabbing-offset" layout=inline scale=l slot=heading tabindex=0>${this._translations.folder}</calcite-label><calcite-button appearance=transparent .disabled=${this._folderLoading} kind=neutral icon-start=launch2 @click=${this._openFolder}>${this._translations.openFolder}</calcite-button></div><div class="display-flex"><div class="display-flex flex-direction-row padding-top-lg align-items-center">${this._folderLoading ? t`<div class="skeleton-loader skeleton-folder"></div>` : t`<calcite-icon class="icon-color" .icon=${a} scale=m></calcite-icon><div class="display-flex flex-direction-column padding-start-xxl"><span class="tabbing-offset" tabindex=0>${this._folderName || "Root"}</span></div>`}</div></div></div>`;
+    return i`<div class=${`${e} display-flex flex-direction-column`}><div class="display-flex justify-between items-baseline"><calcite-label class="font-weight-med label-override tabbing-offset" layout=inline scale=l slot=heading tabindex=0>${this._translations.folder}</calcite-label><calcite-button appearance=transparent .disabled=${this._folderLoading} kind=neutral icon-start=launch2 @click=${this._openFolder}>${this._translations.openFolder}</calcite-button></div><div class="display-flex"><div class="display-flex flex-direction-row padding-top-lg align-items-center">${this._folderLoading ? i`<div class="skeleton-loader skeleton-folder"></div>` : i`<calcite-icon class="icon-color" .icon=${a} scale=m></calcite-icon><div class="display-flex flex-direction-column padding-start-xxl"><span class="tabbing-offset" tabindex=0>${this._folderName || "Root"}</span></div>`}</div></div></div>`;
   }
   _getSolutionVersionCard() {
-    const e = this._hasNewVersion ? this._translations.newVersionAvailable : this._translations.youHaveTheLatestVersion, i = this.isMobile ? "padding-lg" : "padding-xxl";
-    return t`<div class=${`${i} display-flex flex-direction-column`}><calcite-label class="font-weight-med label-override tabbing-offset" layout=inline scale=l slot=heading tabindex=0>${this._translations.solutionVersion.replace("{{version}}", this.card?.deployVersion || "")}</calcite-label><div class="display-flex"><div class="display-flex flex-direction-row padding-top-lg align-items-center"><calcite-icon class="icon-color" icon=clock-forward scale=m></calcite-icon><div class="display-flex flex-direction-column padding-start-xxl"><span class="tabbing-offset" tabindex=0>${e}</span></div></div></div>${this._hasNewVersion ? t`<calcite-button appearance=outline class="padding-top-lg solution-deployed-action" kind=neutral @click=${this._openNewVersionSolution} width=full>${this._translations.learnMoreNewVersion}</calcite-button>` : ""}</div>`;
+    const e = this._hasNewVersion ? this._translations.newVersionAvailable : this._translations.youHaveTheLatestVersion, t = this.isMobile ? "padding-lg" : "padding-xxl";
+    return i`<div class=${`${t} display-flex flex-direction-column`}><calcite-label class="font-weight-med label-override tabbing-offset" layout=inline scale=l slot=heading tabindex=0>${this._translations.solutionVersion.replace("{{version}}", this.card?.deployVersion || "")}</calcite-label><div class="display-flex"><div class="display-flex flex-direction-row padding-top-lg align-items-center"><calcite-icon class="icon-color" icon=clock-forward scale=m></calcite-icon><div class="display-flex flex-direction-column padding-start-xxl"><span class="tabbing-offset" tabindex=0>${e}</span></div></div></div>${this._hasNewVersion ? i`<calcite-button appearance=outline class="padding-top-lg solution-deployed-action" kind=neutral @click=${this._openNewVersionSolution} width=full>${this._translations.learnMoreNewVersion}</calcite-button>` : ""}</div>`;
   }
   async _openNewVersionSolution(e) {
     e.stopPropagation(), this._telemetry?.logEvent({
-      category: s.DEPLOYMENTS,
+      category: r.DEPLOYMENTS,
       action: "View Latest Version",
       dimensions: [
         this.card?.title || "",
@@ -193,23 +193,23 @@ class I extends f {
         this.card?.deployVersion || ""
       ]
     }), await new Promise((a) => setTimeout(a, 100));
-    const i = k(this._configContextConsumer.value.allCards, this.card.deployCommonId);
-    i && this.forceSelectTab.emit({ tabType: "details", tabTitleOrId: i });
+    const t = k(this._configContextConsumer.value.allCards, this.card.deployCommonId);
+    t && this.forceSelectTab.emit({ tabType: "details", tabTitleOrId: t });
   }
   _getSolutionPanel() {
-    return t`<calcite-panel class="font-size-override panel-background-1"><div class="display-flex flex-direction-row"><div class="image-width margin-xl"><img alt=${this.card?.title ?? d} src=${this._thumbnailUrl ?? d}></div><div class="display-flex flex-direction-column"><h1 class="title-font margin-block-start-end-0 padding-end-xxl padding-start-sm padding-top-xxl padding-bottom-xxl line-height-1 negative-tabbing-offset" tabindex=0>${this.card?.title}</h1><div class="display-flex flex-direction-column padding-bottom-xxl padding-start-sm"><div class="display-flex align-items-start padding-bottom-xxl"><div class="font-1 padding-end-1 line-height-xxl negative-tabbing-offset" tabindex=0>${this.card?.snippet}</div></div><div class="display-flex"><div class="display-flex"><calcite-label class="label-override icon-color tabbing-offset" layout=inline tabindex=0><calcite-icon class="icon-color" icon=projects scale=s></calcite-icon>${this._translations.aboutYourSolutionDeployedDate.replace("{{deployedDate}}", this.card?.created || "")}</calcite-label></div></div></div></div></div></calcite-panel>`;
+    return i`<calcite-panel class="font-size-override panel-background-1"><div class="display-flex flex-direction-row"><div class="image-width margin-xl"><img alt=${this.card?.title ?? d} src=${this._thumbnailUrl ?? d}></div><div class="display-flex flex-direction-column"><h1 class="title-font margin-block-start-end-0 padding-end-xxl padding-start-sm padding-top-xxl padding-bottom-xxl line-height-1 negative-tabbing-offset" tabindex=0>${this.card?.title}</h1><div class="display-flex flex-direction-column padding-bottom-xxl padding-start-sm"><div class="display-flex align-items-start padding-bottom-xxl"><div class="font-1 padding-end-1 line-height-xxl negative-tabbing-offset" tabindex=0>${this.card?.snippet}</div></div><div class="display-flex"><div class="display-flex"><calcite-label class="label-override icon-color tabbing-offset" layout=inline tabindex=0><calcite-icon class="icon-color" icon=projects scale=s></calcite-icon>${this._translations.aboutYourSolutionDeployedDate.replace("{{deployedDate}}", this.card?.created || "")}</calcite-label></div></div></div></div></div></calcite-panel>`;
   }
   _getSolutionContents() {
-    const e = [...new Set(this._nonSolutionDependencyItems.map((i) => i.controlItemId))];
-    return t`<calcite-panel class="panel-background-1 padding-top-xxl"><calcite-accordion class="accordion-bg " icon-position=start scale=l appearance=transparent><calcite-accordion-item class="item-padding" expanded><div class="margin-block-start-end-0 heading-font " slot=content-start>${this._translations.solutionsContentsAndCount.replace("{{numberOfSolutions}}", this.templateInfos.length.toString())}</div><div class="overflow-auto">${this._accordionLoading ? t`<calcite-loader .label=${this._translations.loadingText} scale=m></calcite-loader>` : t`<solution-item-accordion .itemRelationshipDependencies=${e} .listSelectionMode=${e.length > 0 ? "multiple" : "single"} .reuseWarning=${this._translations.itemUsedInOtherSolutions} .templateInfos=${this.templateInfos} .typeKeywords=${this.card?.typeKeywords}></solution-item-accordion>`}</div></calcite-accordion-item></calcite-accordion></calcite-panel>`;
+    const e = [...new Set(this._nonSolutionDependencyItems.map((t) => t.controlItemId))];
+    return i`<calcite-panel class="panel-background-1 padding-top-xxl"><calcite-accordion class="accordion-bg " icon-position=start scale=l appearance=transparent><calcite-accordion-item class="item-padding" expanded><div class="margin-block-start-end-0 heading-font " slot=content-start>${this._translations.solutionsContentsAndCount.replace("{{numberOfSolutions}}", this.templateInfos.length.toString())}</div><div class="overflow-auto">${this._accordionLoading ? i`<calcite-loader .label=${this._translations.loadingText} scale=m></calcite-loader>` : i`<solution-item-accordion .itemRelationshipDependencies=${e} .listSelectionMode=${e.length > 0 ? "multiple" : "single"} .reuseWarning=${this._translations.itemUsedInOtherSolutions} .templateInfos=${this.templateInfos} .typeKeywords=${this.card?.typeKeywords}></solution-item-accordion>`}</div></calcite-accordion-item></calcite-accordion></calcite-panel>`;
   }
   _getDeleteDialog() {
-    return this._deleteDialogOpen ? t`<solution-delete-dialog .card=${this.card} @solutionDeleted=${() => setTimeout(() => this.navTabSelected.emit({ tabType: "deployments" }), 100)} @solutionDeleteDialogBeforeClose=${() => {
+    return this._deleteDialogOpen ? i`<solution-delete-dialog .card=${this.card} @solutionDeleted=${() => setTimeout(() => this.navTabSelected.emit({ tabType: "deployments" }), 100)} @solutionDeleteDialogBeforeClose=${() => {
       this._deleteDialogOpen = !1;
     }} .open=${this._deleteDialogOpen} source="Details Page"></solution-delete-dialog>` : "";
   }
   _renderDiagramDialog() {
-    return this._isDiagramOpen ? t`<calcite-dialog class="dialog-y-size dialog-x-size panel-bg-color" .heading=${this._translations.diagramOfTheSolution.replace("{{solution}}", this.card?.title ?? "")} id=${this._translations.diagramOfTheSolution.replace("{{solution}}", this.card?.title ?? "") ?? d} modal .open=${this._isDiagramOpen} @calciteDialogClose=${() => {
+    return this._isDiagramOpen ? i`<calcite-dialog class="dialog-y-size dialog-x-size panel-bg-color" .heading=${this._translations.diagramOfTheSolution.replace("{{solution}}", this.card?.title ?? "")} id=${this._translations.diagramOfTheSolution.replace("{{solution}}", this.card?.title ?? "") ?? d} modal .open=${this._isDiagramOpen} @calciteDialogClose=${() => {
       this._isDiagramOpen = !1;
     }} outside-close-disabled scale=m width=l><solution-item-diagram .diagramKey=${this.diagramKey !== "" ? this.diagramKey : this._configContextConsumer.value?.diagramKey ?? ""} .templateInfoGraph=${this._templateInfoGraph} .typeKeywords=${this.card?.typeKeywords}></solution-item-diagram></calcite-dialog>` : "";
   }

package/dist/components/solution-item-accordion/customElement.d.ts

@@ -11,9 +11,11 @@ export abstract class SolutionItemAccordion extends LitElement {
    * @internal
    */
   protected _translations: {
+      differentOwnerDeleteWarning: string;
       openDetails: string;
       solutionsTemplates: string;
   } & T9nMeta<{
+      differentOwnerDeleteWarning: string;
       openDetails: string;
       solutionsTemplates: string;
   }>;

package/dist/components/solution-item-accordion/customElement.js

@@ -126,10 +126,7 @@ class f extends h {
     const i = this.typeKeywords.includes("Deployed") && e.url, t = this.linkType === "action", s = this._configContextConsumer.value?.userSession?.username ?? null, o = this.itemRelationshipDependencies.some((l) => l === e.id);
     return n`<calcite-list-item id=${e.id ?? p} @mouseenter=${() => this.solutionItemHover.emit({ itemId: e.id, entering: !0 })} @mouseleave=${() => this.solutionItemHover.emit({ itemId: e.id, entering: !1 })} @calciteListItemSelect=${() => {
       this._deselectOthers(e.id), this.solutionItemSelect.emit({ itemId: e.id, selected: !0 }), i && !t && window.open(e.url, "_blank");
-    }} .value=${e.id}><div class="solution-list-item-content" slot=content><div class=${`solution-list-item-label ${i && !t ? "underline" : ""}`}>${e.title}</div><div class="solution-list-item-description">${e.snippet}</div></div>${o ? this.reuseWarning && this._getWarningChip(this.reuseWarning) : (
-      //TODO: hard coded string move to nls
-      e.owner !== s && !this._canDeletePermission && this._getWarningChip("This item is owned by a different user and will not be deleted")
-    )}${i && t ? n`<div slot=actions-end><calcite-action icon=launch .id=${`${e.id}-launch`} @click=${() => window.open(e.url, "_blank")} text></calcite-action><calcite-tooltip overlay-positioning=fixed .referenceElement=${`${e.id}-launch`}><span>${this._translations?.openDetails}</span></calcite-tooltip></div>` : null}</calcite-list-item>`;
+    }} .value=${e.id}><div class="solution-list-item-content" slot=content><div class=${`solution-list-item-label ${i && !t ? "underline" : ""}`}>${e.title}</div><div class="solution-list-item-description">${e.snippet}</div></div>${o ? this.reuseWarning && this._getWarningChip(this.reuseWarning) : e.owner !== s && !this._canDeletePermission && this._getWarningChip(this._translations?.differentOwnerDeleteWarning || "")}${i && t ? n`<div slot=actions-end><calcite-action icon=launch .id=${`${e.id}-launch`} @click=${() => window.open(e.url, "_blank")} text></calcite-action><calcite-tooltip overlay-positioning=fixed .referenceElement=${`${e.id}-launch`}><span>${this._translations?.openDetails}</span></calcite-tooltip></div>` : null}</calcite-list-item>`;
   }
   _sortTemplatesByTitle(e) {
     return e.sort((i, t) => i.title < t.title ? -1 : i.title > t.title ? 1 : 0);