@esri/solutions-components 1.2.0-next.3 → 1.2.0-next.31

package/dist/components/solution-deployed-card/customElement.d.ts

@@ -1,9 +1,8 @@
 /// <reference path="../../index.d.ts" />
 import { PublicLitElement as LitElement, TargetedEvent, JsxNode } from '@arcgis/lumina';
-import { ISolutionInfoCard, ITemplateInfo } from '../../utils/interfaces';
+import { IDeployCard, ISolutionInfoCard, ITemplateInfo } from '../../utils/interfaces';
 import { ITemplateInfoGraph } from '../solution-item-diagram/utils/solutionGraph';
 import { SolutionDeleteDialog } from '../solution-delete-dialog/customElement.js';
-import { SolutionConfigureDialog } from '../solution-configure-dialog/customElement.js';
 import { PropertyValues } from 'lit';
 
 export declare class SolutionDeployedCard extends LitElement {
@@ -33,13 +32,11 @@ export declare class SolutionDeployedCard extends LitElement {
     updateAvailable: boolean;
     /** ITemplateInfo[]: Collection of template infos */
     templateInfos: ITemplateInfo[];
-    /** Reference to the card that opened this dialog */
-    cardRef: SolutionConfigureDialog | undefined;
     /**
      * Show the configure dialog
      * This allows other components to leverage the logic that is built into this card.
      */
-    renderConfigureDialog(showSuccessAlert: boolean): Promise<void>;
+    renderConfigureDialog(): Promise<void>;
     /**
      * Show the delete dialog
      * This allows other components to leverage the logic that is built into this card.
@@ -54,4 +51,6 @@ export declare class SolutionDeployedCard extends LitElement {
     renderDiagramDialog(evt: MouseEvent): Promise<HTMLCalciteDialogElement | undefined>;
     /** Get the templates from the current card */
     getTemplates(): Promise<ITemplateInfoGraph[]>;
+    /** Emitted on demand when the details card is selected. */
+    readonly deployedCardSelected: TargetedEvent<this, IDeployCard>;
 }

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

@@ -1,15 +1,15 @@
 import { c as n } from "../../chunks/runtime.js";
 import { u as r } from "../../chunks/useT9n.js";
-import { LitElement as c, nothing as i } from "@arcgis/lumina";
-import { useContextConsumer as l } from "@arcgis/lumina/context";
-import { a as d, u as h } from "../../chunks/deployAppContexts.js";
-import { css as p, html as t, svg as g } from "lit";
+import { LitElement as c, createEvent as d, nothing as i } from "@arcgis/lumina";
+import { useContextConsumer as o } from "@arcgis/lumina/context";
+import { a as h, u as p } from "../../chunks/deployAppContexts.js";
+import { css as g, html as t, svg as m } from "lit";
 import { p as u } from "../../chunks/prepareDataForSolutionDisplay.js";
-import { createRef as o, ref as s } from "lit-html/directives/ref.js";
+import { createRef as s, ref as l } from "lit-html/directives/ref.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.2/esri/copyright.txt for details.
-v1.2.0-next.3 */
-const m = p`/** @license
+v1.2.0-next.31 */
+const f = g`/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -23,31 +23,31 @@ const m = p`/** @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.
- */calcite-card{width:295px;height:100%;padding-bottom:2px}@media(max-width:400px){calcite-card{width:100%}}calcite-card:hover img{-webkit-filter:brightness(20%);filter:brightness(20%);-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-o-transition:all 1s ease;-ms-transition:all 1s ease;transition:all 1s ease}calcite-card:hover .hover-text{opacity:1;color:#fff}calcite-card:hover{outline:2px solid var(--calcite-ui-brand);box-sizing:content-box;cursor:pointer}.hover-text{transition:.5s ease;opacity:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);text-align:center;display:flex;flex-direction:row;align-items:center;height:100%;font-size:1.2rem}.card-image-wrap{flex:0 0 auto}.card-image-wrap{width:100%;position:relative;margin-bottom:0;-webkit-box-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto}.card-image{width:100%;display:block}video,img{max-width:100%;height:auto}img{overflow-clip-margin:content-box;overflow:clip}.width-full{width:100%}.deployed-label-override{--calcite-label-text-color: var(--calcite-color-text-3);--calcite-label-margin-bottom: 0px}.svg-color{fill:var(--calcite-color-text-3)}.padding-end-1-2{padding-inline-end:.5rem}.padding-bottom-1-2{padding-bottom:.5rem}.display-flex{display:flex}.flex-direction-column{flex-direction:column}.align-items-center{align-items:center}.font-weight-400,.font-weight-normal{font-weight:400}.font-color-text-2{--calcite-label-text-color: var(--calcite-color-text-2)}.font-line-height{line-height:1.4}.font-size-size--1{font-size:var(--calcite-font-size--1)}.icon-brand-color{--calcite-icon-color: var(--calcite-color-brand)}.header-line-height{--calcite-label-margin-bottom: 0;margin-top:.5rem;margin-bottom:.7rem}.dialog-y-size{--calcite-dialog-size-y: 90% }.dialog-x-size{--calcite-dialog-size-x: 90% }.justify-content-space-between{justify-content:space-between}.panel-bg-color{--calcite-panel-header-background-color: var(--calcite-color-foreground-1);--calcite-panel-background-color: var(--calcite-color-foreground-1)}.cursor-default{cursor:default}`;
-class f extends c {
+ */calcite-card{height:100%;padding-bottom:var(--calcite-spacing-base)}@media(max-width:400px){calcite-card{width:100%}}calcite-card:hover img{-webkit-filter:brightness(20%);filter:brightness(20%);-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-o-transition:all 1s ease;-ms-transition:all 1s ease;transition:all 1s ease}calcite-card:hover .hover-text{opacity:1;color:#fff}calcite-card:hover{outline:var(--calcite-spacing-base) solid var(--calcite-ui-brand);box-sizing:content-box;cursor:pointer}.hover-text{transition:.5s ease;opacity:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);text-align:center;display:flex;flex-direction:row;align-items:center;height:100%;font-size:var(--calcite-spacing-xl)}.card-image-wrap{flex:0 0 auto}.card-image-wrap{width:100%;position:relative;margin-bottom:0;-webkit-box-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto}.card-image{width:100%;display:block}video,img{max-width:100%;height:auto}img{overflow-clip-margin:content-box;overflow:clip}.width-full{width:100%}.deployed-label-override{--calcite-label-text-color: var(--calcite-color-text-3);--calcite-label-margin-bottom: var(--calcite-spacing-none)}.svg-color{fill:var(--calcite-color-text-3)}.padding-end-1-2{padding-inline-end:var(--calcite-spacing-sm)}.padding-bottom-1-2{padding-bottom:var(--calcite-spacing-sm)}.display-flex{display:flex}.flex-direction-column{flex-direction:column}.align-items-center{align-items:center}.font-weight-400,.font-weight-normal{font-weight:400}.font-color-text-2{--calcite-label-text-color: var(--calcite-color-text-2)}.font-line-height{line-height:1.4}.font-size-size--1{font-size:var(--calcite-font-size--1)}.icon-brand-color{--calcite-icon-color: var(--calcite-color-brand)}.header-line-height{--calcite-label-margin-bottom: 0;margin-top:var(--calcite-spacing-sm);margin-bottom:.7rem}.dialog-y-size{--calcite-dialog-size-y: 90% }.dialog-x-size{--calcite-dialog-size-x: 90% }.justify-content-space-between{justify-content:space-between}.panel-bg-color{--calcite-panel-header-background-color: var(--calcite-color-foreground-1);--calcite-panel-background-color: var(--calcite-color-foreground-1)}.cursor-default{cursor:default}`;
+class w extends c {
   constructor() {
-    super(...arguments), this.allowDelete = !1, this.deployedDate = "", this.description = "", this.diagramKey = "", this.heading = "", this.itemId = "", this.owner = "", this.thumbnail = "", this.updateAvailable = !1, this.templateInfos = [], this._isConfigureOpen = !1, this._isDeleteOpen = !1, this._isDiagramOpen = !1, this.templateInfoGraph = [], this._configureTitlesOpen = !1, this._translations = r({ name: "solution-deployed-card", blocking: !0 }), this._authContextConsumer = l({
-      context: d,
-      subscribe: !0
-    }), this._configureDialogRef = o(), this._deleteDialogRef = o(), this._diagramDialogRef = o(), this._userSessionContextConsumer = l({
+    super(...arguments), this.allowDelete = !1, this.deployedDate = "", this.description = "", this.diagramKey = "", this.heading = "", this.itemId = "", this.owner = "", this.thumbnail = "", this.updateAvailable = !1, this.templateInfos = [], this._isDeleteOpen = !1, this._isDiagramOpen = !1, this.templateInfoGraph = [], this._configureTitlesOpen = !1, this._translations = r({ name: "solution-deployed-card", blocking: !0 }), this._authContextConsumer = o({
       context: h,
       subscribe: !0
-    });
+    }), this._deleteDialogRef = s(), this._diagramDialogRef = s(), this._userSessionContextConsumer = o({
+      context: p,
+      subscribe: !0
+    }), this.deployedCardSelected = d();
   }
   static {
-    this.properties = { allowDelete: 5, card: 0, deployedDate: 1, description: 1, diagramKey: 1, heading: 1, itemId: 1, owner: 1, thumbnail: 1, updateAvailable: 5, templateInfos: 0, cardRef: 0, _isConfigureOpen: 16, _isDeleteOpen: 16, _isDiagramOpen: 16, templateInfoGraph: 16, _configureTitlesOpen: 16, _translations: 16 };
+    this.properties = { allowDelete: 5, card: 0, deployedDate: 1, description: 1, diagramKey: 1, heading: 1, itemId: 1, owner: 1, thumbnail: 1, updateAvailable: 5, templateInfos: 0, _isDeleteOpen: 16, _isDiagramOpen: 16, templateInfoGraph: 16, _configureTitlesOpen: 16, _translations: 16 };
   }
   static {
-    this.styles = m;
+    this.styles = f;
   }
-  async renderConfigureDialog(e) {
-    this._cardSelected(), this._configureDialogRef.value && (this._configureDialogRef.value.showSuccessAlert = e);
+  async renderConfigureDialog() {
+    this._cardSelected();
   }
   async renderDeleteDialog() {
     return this._isDeleteOpen = !0, this._renderDeleteDialog(), this._deleteDialogRef.value;
   }
   async renderDiagramDialog(e) {
-    return this._isDiagramOpen = !0, await this._viewDiagram(e), await this._renderDiagramDialog(), this._diagramDialogRef.value;
+    return await this._viewDiagram(e), await this._renderDiagramDialog(), this._diagramDialogRef.value;
   }
   async getTemplates() {
     return this._processTemplates(this.card);
@@ -58,11 +58,11 @@ class f extends c {
     });
   }
   render() {
-    return t`<calcite-card .label=${this.description} @click=${this._cardSelected}>${this._getImage()}${this._getHeader()}<p slot=description class="font-color-text-2 font-line-height font-size-size--1">${this.description}</p><div class="width-full display-flex flex-direction-column" slot=footer-start><div class="padding-bottom-1-2">${this._getOwnerLabel()}${this._getDeployedDate()}</div>${this._getConfigureButton()}</div></calcite-card>${this._renderDeleteDialog()}${this._renderDiagramDialog()}${this._renderConfigureDialog()}${this._renderConfigureTitlesDialog()}`;
+    return t`<calcite-card .label=${this.description} @click=${this._cardSelected}>${this._getImage()}${this._getHeader()}<p class="font-color-text-2 font-line-height font-size-size--1" slot=description>${this.description}</p><div class="width-full display-flex flex-direction-column" slot=footer-start><div class="padding-bottom-1-2">${this._getOwnerLabel()}${this._getDeployedDate()}</div>${this._getConfigureButton()}</div></calcite-card>${this._renderDeleteDialog()}${this._renderDiagramDialog()}${this._renderConfigureTitlesDialog()}`;
   }
   _getImage() {
     const e = this._userSessionContextConsumer.value;
-    return t`<div class="card-image-wrap" slot=thumbnail><img class="thumbnail card-image" alt=${this.heading ?? i} src=${`${this.thumbnail}&token=${e?.token}`}><div class="hover-text">${this._translations.openSolution}</div></div>`;
+    return t`<div class="card-image-wrap" slot=thumbnail><img alt=${this.heading ?? i} class="thumbnail card-image" src=${`${this.thumbnail}&token=${e?.token}`}><div class="hover-text">${this._translations.openSolution}</div></div>`;
   }
   _getHeader() {
     return t`<div class="display-flex justify-content-space-between header-line-height" slot=heading><calcite-label layout=inline-space-between scale=l>${this.heading}</calcite-label></div>`;
@@ -71,11 +71,14 @@ class f extends c {
     return t`<calcite-label class="font-weight-400 padding-end-1-2" layout=inline scale=s>${`${this._translations.owner}:`}<calcite-link class="font-weight-normal" @click=${this._openUserProfile}>${this.owner}</calcite-link></calcite-label>`;
   }
   _getDeployedDate() {
-    return t`<div class="display-flex align-items-center"><div class="padding-end-1-2"><svg height=16px viewBox="0 0 32 32" width=16px xmlns=http://www.w3.org/2000/svg>${g`<path class="svg-color" d="M29.963 7.672a1.586 1.586 0 0 0-1.584-1.585h-5.274a.187.187 0 0 1-.188-.187V3.977A2 2 0 0 0 20.825 2h-9.672A2.095 2.095 0 0 0 9.06 4.093V5.9a.187.187 0 0 1-.187.187H3.598a1.586 1.586 0 0 0-1.584 1.585v4.016a.281.281 0 0 0 .281.28H4.9l.014-.013V9.153a.177.177 0 0 1 .177-.177h21.46a.456.456 0 0 1 .449.45v13.742A1.832 1.832 0 0 1 25.168 25h-8.892a.568.568 0 0 1-.534-.373 3.98 3.98 0 0 0-7.6.373H5.657a.757.757 0 0 1-.757-.757v-3.055A.188.188 0 0 0 4.714 21H2.028l-.014.014v4.58a2.35 2.35 0 0 0 2.347 2.346h4.161a3.963 3.963 0 0 0 6.8.256.569.569 0 0 1 .475-.256h12.065a2.102 2.102 0 0 0 2.101-2.101zM21 5.625a.375.375 0 0 1-.375.375h-9.25A.375.375 0 0 1 11 5.625V4.45a.456.456 0 0 1 .45-.45h9.1a.456.456 0 0 1 .45.45zM12 28a2 2 0 1 1 2-2 2 2 0 0 1-2 2z" /><path class="svg-color" d="M13.273 17.994a.57.57 0 0 1 .479.262A3.73 3.73 0 0 0 17 20a3.74 3.74 0 0 0 3.403-2.006h3.41a.188.188 0 0 0 .187-.188v-2.589a.187.187 0 0 0-.188-.188H20.8A3.8 3.8 0 0 0 17 12a4.058 4.058 0 0 0-3.69 2.647.568.568 0 0 1-.537.383H1.093a.094.094 0 0 0-.093.093V17.9a.094.094 0 0 0 .094.094zM17 13.9a2.1 2.1 0 1 1-2.1 2.1 2.1 2.1 0 0 1 2.1-2.1z" />`}</svg></div><calcite-label class="deployed-label-override" scale=s>${this._translations.deployedDate.replace("{{date}}", this.deployedDate)}</calcite-label></div>`;
+    return t`<div class="display-flex align-items-center"><div class="padding-end-1-2"><svg height=16px viewBox="0 0 32 32" width=16px xmlns=http://www.w3.org/2000/svg>${m`<path class="svg-color" d="M29.963 7.672a1.586 1.586 0 0 0-1.584-1.585h-5.274a.187.187 0 0 1-.188-.187V3.977A2 2 0 0 0 20.825 2h-9.672A2.095 2.095 0 0 0 9.06 4.093V5.9a.187.187 0 0 1-.187.187H3.598a1.586 1.586 0 0 0-1.584 1.585v4.016a.281.281 0 0 0 .281.28H4.9l.014-.013V9.153a.177.177 0 0 1 .177-.177h21.46a.456.456 0 0 1 .449.45v13.742A1.832 1.832 0 0 1 25.168 25h-8.892a.568.568 0 0 1-.534-.373 3.98 3.98 0 0 0-7.6.373H5.657a.757.757 0 0 1-.757-.757v-3.055A.188.188 0 0 0 4.714 21H2.028l-.014.014v4.58a2.35 2.35 0 0 0 2.347 2.346h4.161a3.963 3.963 0 0 0 6.8.256.569.569 0 0 1 .475-.256h12.065a2.102 2.102 0 0 0 2.101-2.101zM21 5.625a.375.375 0 0 1-.375.375h-9.25A.375.375 0 0 1 11 5.625V4.45a.456.456 0 0 1 .45-.45h9.1a.456.456 0 0 1 .45.45zM12 28a2 2 0 1 1 2-2 2 2 0 0 1-2 2z" /><path class="svg-color" d="M13.273 17.994a.57.57 0 0 1 .479.262A3.73 3.73 0 0 0 17 20a3.74 3.74 0 0 0 3.403-2.006h3.41a.188.188 0 0 0 .187-.188v-2.589a.187.187 0 0 0-.188-.188H20.8A3.8 3.8 0 0 0 17 12a4.058 4.058 0 0 0-3.69 2.647.568.568 0 0 1-.537.383H1.093a.094.094 0 0 0-.093.093V17.9a.094.094 0 0 0 .094.094zM17 13.9a2.1 2.1 0 1 1-2.1 2.1 2.1 2.1 0 0 1 2.1-2.1z" />`}</svg></div><calcite-label class="deployed-label-override" scale=s>${this._translations.deployedDate.replace("{{date}}", this.deployedDate)}</calcite-label></div>`;
   }
   _getConfigureButton() {
     return t`<calcite-split-button appearance=outline aria-label=${this._translations.openSolution ?? i} dropdown-label=${this._translations.moreActions ?? i} kind=neutral @calciteSplitButtonPrimaryClick=${() => {
-      this._isConfigureOpen = !0;
+      this.deployedCardSelected.emit({
+        card: this.card,
+        cardRef: this.el
+      });
     }} @click=${(e) => e.stopPropagation()} overlay-positioning=fixed primary-text=${this._translations.openSolution ?? i} width=full><calcite-dropdown-group selection-mode=none><calcite-dropdown-item icon-start=file-text @click=${this._viewDocumentation}>${this._translations.documentation}</calcite-dropdown-item><calcite-dropdown-item icon-start=model @click=${this._viewDiagram}>${this._translations.viewDiagram}</calcite-dropdown-item><calcite-dropdown-item icon-start=edit-attributes @click=${() => {
       this._configureTitlesOpen = !0;
     }}>${this._translations.renameItems}</calcite-dropdown-item><calcite-dropdown-item icon-start=information @click=${this._viewItemDetails}>${this._translations.viewItemDetails}</calcite-dropdown-item>${this.allowDelete && t`<calcite-dropdown-item icon-start=trash @click=${this._deleteSolution}>${this._translations.deleteSolution}</calcite-dropdown-item>` || ""}</calcite-dropdown-group></calcite-split-button>`;
@@ -83,17 +86,12 @@ class f extends c {
   _renderDeleteDialog() {
     return this._isDeleteOpen ? t`<solution-delete-dialog .card=${this.card} @solutionDeleteDialogOpen=${(e) => {
       this._isDeleteOpen = e.detail;
-    }} .open=${this._isDeleteOpen} ${s(this._deleteDialogRef)}></solution-delete-dialog>` : "";
+    }} .open=${this._isDeleteOpen} ${l(this._deleteDialogRef)}></solution-delete-dialog>` : "";
   }
   _renderDiagramDialog() {
     return this._isDiagramOpen ? t`<calcite-dialog class="dialog-y-size dialog-x-size panel-bg-color" .heading=${this._translations.diagramTitle.replace("{{solution}}", this.card?.title ?? "")} id=${this._translations.diagramTitle.replace("{{solution}}", this.card?.title ?? "") ?? i} modal .open=${this._isDiagramOpen} @calciteDialogClose=${() => {
       this._isDiagramOpen = !1;
-    }} outside-close-disabled resizable scale=l width=l ${s(this._diagramDialogRef)}><solution-item-diagram .diagramKey=${this.diagramKey} .templateInfoGraph=${this.templateInfoGraph} .typeKeywords=${this.card?.typeKeywords}></solution-item-diagram></calcite-dialog>` : "";
-  }
-  _renderConfigureDialog() {
-    return t`<solution-configure-dialog .card=${this.card} .cardRef=${this.el} @solutionConfigureDialogClose=${() => {
-      this._isConfigureOpen = !1;
-    }} .open=${this._isConfigureOpen} ${s(this._configureDialogRef)}></solution-configure-dialog>`;
+    }} outside-close-disabled scale=m width=l ${l(this._diagramDialogRef)}><solution-item-diagram .diagramKey=${this.diagramKey} .templateInfoGraph=${this.templateInfoGraph} .typeKeywords=${this.card?.typeKeywords}></solution-item-diagram></calcite-dialog>` : "";
   }
   _renderConfigureTitlesDialog() {
     return this._configureTitlesOpen ? t`<solution-configure-titles .card=${this.card} @solutionConfigureTitlesBeforeClose=${() => {
@@ -105,7 +103,10 @@ class f extends c {
     }} .open=${this._configureTitlesOpen} .templateInfos=${this.templateInfos}></solution-configure-titles>` : "";
   }
   _cardSelected() {
-    this._isConfigureOpen = !0;
+    this.deployedCardSelected.emit({
+      card: this.card,
+      cardRef: this.el
+    });
   }
   async _viewDiagram(e) {
     e.stopPropagation(), this.card && (this.templateInfoGraph = await this._processTemplates(this.card), this._isDiagramOpen = !0);
@@ -128,7 +129,7 @@ class f extends c {
     return await u(e.id, this._userSessionContextConsumer.value);
   }
 }
-n("solution-deployed-card", f);
+n("solution-deployed-card", w);
 export {
-  f as SolutionDeployedCard
+  w as SolutionDeployedCard
 };

package/dist/components/solution-deployed-card/index.d.ts

@@ -7,6 +7,5 @@ import "@esri/calcite-components/components/calcite-dropdown-item";
 import "../solution-delete-dialog/index.js";
 import "@esri/calcite-components/components/calcite-dialog";
 import "../solution-item-diagram/index.js";
-import "../solution-configure-dialog/index.js";
 import "../solution-configure-titles/index.js";
 export * from "./customElement.js";

package/dist/components/solution-deployed-card/index.js

@@ -7,6 +7,5 @@ import "@esri/calcite-components/components/calcite-dropdown-item";
 import "../solution-delete-dialog/index.js";
 import "@esri/calcite-components/components/calcite-dialog";
 import "../solution-item-diagram/index.js";
-import "../solution-configure-dialog/index.js";
 import "../solution-configure-titles/index.js";
 export * from "./customElement.js";

package/dist/components/solution-deployed-card-panel/customElement.d.ts

@@ -0,0 +1,40 @@
+/// <reference path="../../index.d.ts" />
+import { PublicLitElement as LitElement, TargetedEvent, JsxNode } from '@arcgis/lumina';
+import { INavTab, ISolutionInfoCard, ITemplateInfo } from '../../utils/interfaces';
+import { ITemplateInfoGraph } from '../solution-item-diagram/utils/solutionGraph';
+
+export declare class SolutionDeployedCardPanel extends LitElement {
+    /** Key details about the solution */
+    card: ISolutionInfoCard | undefined;
+    /** Reference to the card that opened this dialog */
+    cardRef: any | undefined;
+    /**
+     * Digram license key to use view the diagram
+     *
+     * @default ''
+     */
+    diagramKey: string;
+    /**
+     * boolean: when true the dialog is open
+     *
+     * @default false
+     */
+    open: boolean;
+    /**
+     * boolean: when true the success alert will be shown when first rendered
+     *
+     * @default false
+     */
+    showSuccessAlert: boolean;
+    /** ITemplateInfo[]: Collection of template infos */
+    templateInfos: ITemplateInfo[];
+    /** Tab selected event */
+    readonly navTabSelected: TargetedEvent<this, INavTab>;
+    /** Emitted on demand when the sort type changes */
+    readonly sortTypeChanged: TargetedEvent<this, string>;
+    /**
+     * This event will be emitted when this dialog is closed.
+     * When the emitted value is true the solution has been updated and needs to be fetched again
+     */
+    readonly solutionConfigureDialogClose: TargetedEvent<this, boolean>;
+}

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

@@ -0,0 +1,118 @@
+import { c as d } from "../../chunks/runtime.js";
+import { css as p, html as t } from "lit";
+import { keyed as g } from "lit/directives/keyed.js";
+import { u as h } from "../../chunks/useT9n.js";
+import { LitElement as u, createEvent as l, nothing as s } from "@arcgis/lumina";
+import { useContextConsumer as m } from "@arcgis/lumina/context";
+import { c as f } from "../../chunks/deployAppContexts.js";
+import { a as x, d as c, h as b } from "../../chunks/cardsHelpers.js";
+/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
+See https://js.arcgis.com/1.2/esri/copyright.txt for details.
+v1.2.0-next.31 */
+const v = p`/** @license
+ * Copyright 2025 Esri
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */.font-weight-med{font-weight:var(--calcite-font-weight-medium)}.font-weight-bold{font-weight:var(--calcite-font-weight-bold)}.heading-font{font-size:var(--calcite-font-size-0);font-weight:var(--calcite-font-weight-medium)}.title-font{font-size:1.8rem;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1)}.font-1{font-size:var(--calcite-spacing-xxl)}.display-flex{display:flex}.flex-direction-column{flex-direction:column}.flex-direction-row{flex-direction:row}.icon-color{color:var(--calcite-color-text-3)}.padding-bottom-lg{padding-bottom:var(--calcite-spacing-lg)}.item-padding{--calcite-internal-accordion-item-padding: var(--calcite-spacing-xl)}.align-items-center{align-items:center}.align-items-start{align-items:start}.font-size-override{--calcite-font-size--2: var(--calcite-font-size--1)}.background-color-2{background-color:var(--calcite-color-foreground-2)}.label-override{--calcite-label-margin-bottom: var(--calcite-spacing-none)}.position-relative{position:relative}.overflow-hidden{overflow:hidden}.overflow-auto{overflow:auto}.margin-block-start-end-0{margin-block-start:var(--calcite-spacing-none);margin-block-end:var(--calcite-spacing-none)}.panel-background-2{--calcite-panel-background-color: var(--calcite-color-foreground-2);background-color:var(--calcite-color-foreground-2)}.panel-background-1{--calcite-panel-background-color: var(--calcite-color-foreground-1);--calcite-shell-panel-background-color: var(--calcite-color-foreground-1)}.border-none{border:none}.font-color-1{color:var(--calcite-color-text-1)}.panel-bg-color{--calcite-panel-header-background-color: var(--calcite-color-foreground-1);--calcite-panel-background-color: var(--calcite-color-foreground-1)}.dialog-y-size{--calcite-dialog-size-y: 90% }.dialog-x-size{--calcite-dialog-size-x: 90% }.bottom-border{border-bottom:solid var(--calcite-spacing-px);color:var(--calcite-color-border-1)}.margin-start-end-xxl{margin-inline-start:var(--calcite-spacing-xxl);margin-inline-end:var(--calcite-spacing-xxl)}.justify-between{justify-content:space-between}.items-baseline{align-items:baseline}.padding-xxl{padding:var(--calcite-spacing-xxl)}.padding-top-xxl{padding-top:var(--calcite-spacing-xxl)}.padding-top-lg{padding-top:var(--calcite-spacing-lg)}.padding-bottom-xxl{padding-bottom:var(--calcite-spacing-xxl)}.padding-end-xxl{padding-inline-end:var(--calcite-spacing-xxl)}.padding-start-sm{padding-inline-start:var(--calcite-spacing-sm)}.padding-start-xxl{padding-inline-start:var(--calcite-spacing-xxl)}.image-width{width:395px;flex-grow:0;flex-shrink:0}@media(max-width:1280px){.image-width{flex-grow:2;flex-shrink:.5}}img{max-width:100%;height:auto;overflow-clip-margin:content-box;overflow:clip}.margin-xl{margin:var(--calcite-spacing-xl)}.line-height-1{line-height:1.1}@media(max-width:800px){.image-width{display:none}}calcite-shell-panel{--calcite-shell-panel-max-width: 20rem;--calcite-shell-panel-width: 24vw}calcite-shell{overflow:auto;block-size:unset}`;
+class w extends u {
+  constructor() {
+    super(), this.diagramKey = "", this.open = !1, this.showSuccessAlert = !1, this.templateInfos = [], this._accordionLoading = !1, this._configureTitlesOpen = !1, this._deleteDialogOpen = !1, this._hasNewVersion = !1, this._isDiagramOpen = !1, this._isNameConflict = !1, this._invalidNameMessage = "", this._showFailedAlert = !1, this._showItemUpdateLoading = !1, this._templateInfoGraph = [], this._translations = h({ name: "solution-deployed-card-panel", blocking: !0 }), this._configContextConsumer = m({
+      context: f,
+      subscribe: !0
+    }), this.navTabSelected = l(), this.sortTypeChanged = l(), this.solutionConfigureDialogClose = l(), this.listenOn(window, "deployedCardSelected", this._deployedCardSelected), this.listenOn(window, "deployAppTabSelected", this._handleDeployAppTabSelected);
+  }
+  static {
+    this.properties = { card: 0, cardRef: 1, diagramKey: 1, open: 5, showSuccessAlert: 5, templateInfos: 0, _accordionLoading: 16, _configureTitlesOpen: 16, _deleteDialogOpen: 16, _hasNewVersion: 16, _isDiagramOpen: 16, _isNameConflict: 16, _invalidNameMessage: 16, _showFailedAlert: 16, _showItemUpdateLoading: 16, _templateInfoGraph: 16, _translations: 16 };
+  }
+  static {
+    this.styles = v;
+  }
+  render() {
+    return 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()}<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.cardRef.getTemplates().then((o) => {
+      this.templateInfos = o, this._accordionLoading = !1;
+    });
+    const a = x(this._configContextConsumer.value?.allCards || [], this.card.deployCommonId);
+    let n = !1;
+    if (a) {
+      const o = c(a), r = c(this.card);
+      n = o > r;
+    }
+    this._hasNewVersion = n;
+  }
+  _handleDeployAppTabSelected(e) {
+    e.detail === "deployed-card" && this.sortTypeChanged.emit("");
+  }
+  _getButtons() {
+    return t`<div class="display-flex flex-direction-column padding-xxl"><calcite-button appearance=outline class="padding-bottom-lg" icon-start=model kind=neutral @click=${this._openDiagram}>${this._translations.viewTheDiagram}</calcite-button><calcite-button appearance=outline class="padding-bottom-lg" icon-start=edit-attributes kind=neutral @click=${this._openConfigureTitlesDialog}>${this._translations.updateTitles}</calcite-button><calcite-button appearance=outline class="padding-bottom-lg" icon-start=file-text kind=neutral @click=${this._viewDocumentation}>${this._translations.solutionDocumentation}</calcite-button><calcite-button appearance=outline class="padding-bottom-lg" icon-start=launch kind=neutral @click=${this._openItemDetails}>${this._translations.itemDetails}</calcite-button><calcite-button appearance=outline class="padding-bottom-lg" icon-start=trash 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=${() => {
+      this._configureTitlesOpen = !1;
+    }} @solutionItemsTitlesChanged=${async () => {
+      this.templateInfos = await this.cardRef.getTemplates();
+    }} .open=${this._configureTitlesOpen} .templateInfos=${this.templateInfos}></solution-configure-titles>` : "";
+  }
+  _viewDocumentation(e) {
+    e.stopPropagation(), window.open(this.card.learnMoreUrl, "_blank");
+  }
+  _openItemDetails(e) {
+    e.stopPropagation(), window.open(this.card.itemUrl, "_blank");
+  }
+  _getOwnerSection() {
+    return t`<div class="display-flex padding-bottom-xxl margin-start-end-xxl flex-direction-column"><div class="display-flex justify-between items-baseline"><calcite-label class="font-weight-med label-override" layout=inline scale=l>${this._translations.aboutYourSolutionOwner}</calcite-label><calcite-button appearance=transparent kind=neutral icon-start=pencil @click=${() => {
+    }}>${this._translations.editSolutionOwner}</calcite-button></div>${g(this.card?.owner, t`<arcgis-user-popup api=4 appearance=outline .baseUrl=${this._configContextConsumer?.value?.orgUrl} class="padding-top-lg" .portal=${this._configContextConsumer?.value?.authentication?.Portal} scale=l show-avatar show-name show-username underline .username=${this.card?.owner}></arcgis-user-popup>`)}</div>`;
+  }
+  async _openDiagram(e) {
+    e.stopPropagation(), this.cardRef && (this._templateInfoGraph = await this.cardRef.getTemplates(), this._isDiagramOpen = !0);
+  }
+  _getSolutionVersionCard() {
+    const e = this._hasNewVersion ? this._translations.newVersionAvailable : this._translations.youHaveTheLatestVersion;
+    return t`<div class="padding-xxl display-flex flex-direction-column"><calcite-label class="font-weight-med label-override" layout=inline scale=l slot=heading>${this._translations.solutionVersion}</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="font-weight-bold font-color-1">${this.card?.deployVersion}</span><span>${e}</span></div></div></div>${this._hasNewVersion ? t`<calcite-button appearance=outline class="padding-top-lg" kind=neutral @click=${this._openNewVersionSolution} width=full>${this._translations.viewNewVersion}</calcite-button>` : ""}</div>`;
+  }
+  _openNewVersionSolution(e) {
+    e.stopPropagation();
+    const i = b(this._configContextConsumer.value.allCards, this.card.deployCommonId), a = window.location.href;
+    i && window.open(a.replace(/deployments\/.+/, i), "_self");
+  }
+  _getSolutionPanel() {
+    const e = this.card?.thumbnailUrl.replace(/w=\d+/, "w=400"), i = this._configContextConsumer.value?.userSession;
+    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 ?? s} src=${`${e}&token=${i?.token}`}></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">${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"><calcite-label class="font-1 padding-end-xxl" scale=l>${this.card?.snippet}</calcite-label></div><div class="display-flex"><div class="display-flex"><calcite-label class="label-override icon-color" layout=inline><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() {
+    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 list-selection-mode=single .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=${() => {
+      this._deleteDialogOpen = !1;
+    }} .open=${this._deleteDialogOpen}></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 ?? "") ?? s} 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>` : "";
+  }
+  async _deleteSolution() {
+    this._deleteDialogOpen = !0;
+  }
+}
+d("solution-deployed-card-panel", w);
+export {
+  w as SolutionDeployedCardPanel
+};

package/dist/components/solution-deployed-card-panel/index.d.ts

@@ -0,0 +1,16 @@
+import "@esri/calcite-components/components/calcite-shell";
+import "@esri/calcite-components/components/calcite-panel";
+import "@esri/calcite-components/components/calcite-shell-panel";
+import "@esri/calcite-components/components/calcite-button";
+import "../solution-configure-titles/index.js";
+import "@esri/calcite-components/components/calcite-label";
+import "@arcgis/app-components/dist/components/arcgis-user-popup.js";
+import "@esri/calcite-components/components/calcite-icon";
+import "@esri/calcite-components/components/calcite-accordion";
+import "@esri/calcite-components/components/calcite-accordion-item";
+import "@esri/calcite-components/components/calcite-loader";
+import "../solution-item-accordion/index.js";
+import "../solution-delete-dialog/index.js";
+import "@esri/calcite-components/components/calcite-dialog";
+import "../solution-item-diagram/index.js";
+export * from "./customElement.js";

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

@@ -0,0 +1,16 @@
+import "@esri/calcite-components/components/calcite-shell";
+import "@esri/calcite-components/components/calcite-panel";
+import "@esri/calcite-components/components/calcite-shell-panel";
+import "@esri/calcite-components/components/calcite-button";
+import "../solution-configure-titles/index.js";
+import "@esri/calcite-components/components/calcite-label";
+import "@arcgis/app-components/dist/components/arcgis-user-popup.js";
+import "@esri/calcite-components/components/calcite-icon";
+import "@esri/calcite-components/components/calcite-accordion";
+import "@esri/calcite-components/components/calcite-accordion-item";
+import "@esri/calcite-components/components/calcite-loader";
+import "../solution-item-accordion/index.js";
+import "../solution-delete-dialog/index.js";
+import "@esri/calcite-components/components/calcite-dialog";
+import "../solution-item-diagram/index.js";
+export * from "./customElement.js";

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

@@ -25,4 +25,6 @@ export declare class SolutionDeployingDialog extends LitElement {
     confirmCancel(): void;
     /** Cancel the current deployment */
     cancelDeployment(): void;
+    /** Emitted when the deploying dialog opens */
+    readonly deployingDialogOpened: TargetedEvent<this, void>;
 }

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

@@ -1,12 +1,13 @@
-import { c as a } from "../../chunks/runtime.js";
-import { css as s, html as t } from "lit";
-import { u as o } from "../../chunks/useT9n.js";
-import { LitElement as c } from "@arcgis/lumina";
-import { createRef as r, ref as h } from "lit-html/directives/ref.js";
+import { c as l } from "../../chunks/runtime.js";
+import { css as n, html as t } from "lit";
+import { keyed as c } from "lit/directives/keyed.js";
+import { u as r } from "../../chunks/useT9n.js";
+import { LitElement as h, createEvent as u } from "@arcgis/lumina";
+import { createRef as i, ref as a } from "lit-html/directives/ref.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.2/esri/copyright.txt for details.
-v1.2.0-next.3 */
-const d = s`/** @license
+v1.2.0-next.31 */
+const d = n`/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -21,12 +22,14 @@ const d = s`/** @license
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */.panel-bg-white{--calcite-panel-background-color: var(--calcite-color-foreground-1)}`;
-class p extends c {
+class g extends h {
   constructor() {
-    super(...arguments), this.deploymentProgress = 0, this.open = !1, this._isInCancelConfirmation = !1, this._showCancelConfirmation = !1, this._showIsCancelling = !1, this._translations = o({ name: "solution-deploying-dialog", blocking: !0 }), this._deployingDialogRef = r();
+    super(), this.deploymentProgress = 0, this.open = !1, this._isInCancelConfirmation = !1, this._showCancelConfirmation = !1, this._showIsCancelling = !1, this._translations = r({ name: "solution-deploying-dialog", blocking: !0 }), this._carouselKey = 0, this._deployingDialogRef = i(), this._carouselRef = i(), this._carouselMessages = [], this._confirmUnload = !1, this.deployingDialogOpened = u(), this.listenOn(window, "beforeunload", (e) => {
+      (this._confirmUnload || this._showIsCancelling) && (e.preventDefault(), e.returnValue = !0);
+    });
   }
   static {
-    this.properties = { abortController: 0, card: 0, deploymentProgress: 9, open: 5, _isInCancelConfirmation: 16, _showCancelConfirmation: 16, _showIsCancelling: 16, _translations: 16 };
+    this.properties = { abortController: 0, card: 0, deploymentProgress: 9, open: 5, _isInCancelConfirmation: 16, _showCancelConfirmation: 16, _showIsCancelling: 16, _translations: 16, _carouselKey: 16 };
   }
   static {
     this.styles = d;
@@ -47,14 +50,68 @@ class p extends c {
   }
   render() {
     return t`<calcite-dialog close-disabled .heading=${this._translations.title.replace("{{solution}}", this.card?.title ?? "")} modal width=m .open=${this.open} @calciteDialogBeforeClose=${(e) => {
-      e.preventDefault();
-    }} outside-close-disabled ${h(this._deployingDialogRef)}>${this._showCancelConfirmation ? this.renderCancelModal() : this._showIsCancelling ? this.renderCancellingModal() : t`<calcite-panel class="panel-bg-white"><calcite-loader .label=${this._translations.deploymentInProgress} scale=l .text=${this._translations.deploymentInProgress} type=determinate-value .value=${this.deploymentProgress}></calcite-loader><calcite-carousel autoplay .label=${this._translations.newsAndFeatures} arrow-type=inline>${this.renderCarouselItems()}</calcite-carousel><calcite-button appearance=outline @click=${this.confirmCancel} slot=footer-end>${this._translations.cancel}</calcite-button></calcite-panel>`}</calcite-dialog>`;
+      e.preventDefault(), this._confirmUnload = !1;
+    }} @calciteDialogOpen=${() => this._onDialogOpen()} outside-close-disabled ${a(this._deployingDialogRef)}>${this._showCancelConfirmation ? this.renderCancelModal() : this._showIsCancelling ? this.renderCancellingModal() : t`<calcite-panel class="panel-bg-white"><calcite-loader .label=${this._translations.deploymentInProgress} scale=l .text=${this._translations.deploymentInProgress} type=determinate-value .value=${this.deploymentProgress}></calcite-loader><div style="height: 120px; display: flex; align-items: center;">${c(this._carouselKey, t`<calcite-carousel autoplay=paused autoplay-duration=8000 .label=${this._translations.newsAndFeatures} arrow-type=inline ${a(this._carouselRef)}>${this.renderCarouselItems()}</calcite-carousel>`)}</div><calcite-button appearance=outline @click=${this.confirmCancel} slot=footer-end>${this._translations.cancel}</calcite-button></calcite-panel>`}</calcite-dialog>`;
   }
   renderCarouselItems() {
-    const e = [], l = this._translations.carousel;
-    for (const [i, n] of Object.entries(l))
-      e.push(t`<calcite-carousel-item .label=${i}><calcite-label layout=inline>${i === "stockMessage1" && t`<calcite-icon icon=model></calcite-icon>` || ""}${i === "stockMessage2" && t`<calcite-icon icon=trash></calcite-icon>` || ""}${n}</calcite-label></calcite-carousel-item>`);
-    return e;
+    const e = [];
+    return this._carouselMessages.forEach((s, o) => {
+      e.push(t`<calcite-carousel-item .label=${`carousel-item-${o}`}><calcite-label layout=inline>${s.icon && t`<calcite-icon .icon=${s.icon} class="padding-end-0-5"></calcite-icon>` || ""}<span .innerHTML=${this._processCarouselMessage(s) ?? ""}></span></calcite-label></calcite-carousel-item>`);
+    }), e;
+  }
+  _getCarouselMessages() {
+    const e = this._translations.carousel, s = [
+      {
+        message: e.stockMessage1,
+        icon: "mega-phone",
+        url: "https://doc.arcgis.com/en/arcgis-solutions/latest/get-started/what-s-new-in-arcgis-solutions.htm"
+      },
+      {
+        message: e.stockMessage2,
+        icon: "question",
+        url: this.card?.learnMoreUrl
+      },
+      {
+        message: e.stockMessage3,
+        icon: "model",
+        url: void 0
+      },
+      {
+        message: e.stockMessage4,
+        icon: "trash",
+        url: void 0
+      },
+      {
+        message: e.stockMessage5,
+        icon: "lightbulb",
+        url: void 0
+      },
+      {
+        message: e.stockMessage6,
+        icon: "information",
+        url: void 0
+      },
+      {
+        message: e.stockMessage7,
+        icon: "speech-bubbles",
+        url: void 0
+      },
+      {
+        message: e.stockMessage8,
+        icon: "information",
+        url: "https://doc.arcgis.com/en/arcgis-solutions/latest/get-started/releases-and-versions.htm"
+      },
+      {
+        message: e.stockMessage9,
+        icon: "lightbulb",
+        url: "https://doc.arcgis.com/en/arcgis-solutions/latest/get-started/upgrading-an-arcgis-solution.htm"
+      }
+    ];
+    return s.sort(() => Math.random() - 0.5), s;
+  }
+  _processCarouselMessage(e) {
+    let s = e.message || "";
+    return s.includes("{{url}}") && e.url && (s = s.replace("{{url}}", e.url)), s;
   }
   renderCancelModal() {
     return t`<calcite-panel class="panel-bg-white">${this._translations.deploymentCancelMessage}<calcite-button kind=brand @click=${() => {
@@ -65,8 +122,14 @@ class p extends c {
   renderCancellingModal() {
     return t`<calcite-panel class="panel-bg-white"><calcite-loader .label=${this._translations.cancelCurrentDeployment} .text=${this._translations.cancelCurrentDeployment}></calcite-loader></calcite-panel>`;
   }
+  _onDialogOpen() {
+    this._confirmUnload = !0, this._carouselKey++, this._translations.carousel && (this._carouselMessages = this._getCarouselMessages()), this.deployingDialogOpened.emit(), setTimeout(() => {
+      const e = this._carouselRef.value;
+      e && e.play();
+    }, 100);
+  }
 }
-a("solution-deploying-dialog", p);
+l("solution-deploying-dialog", g);
 export {
-  p as SolutionDeployingDialog
+  g as SolutionDeployingDialog
 };

package/dist/components/solution-details-card/customElement.js

@@ -1,11 +1,11 @@
-import { c as s } from "../../chunks/runtime.js";
+import { c } from "../../chunks/runtime.js";
 import { css as r, html as i } from "lit";
 import { u as l } from "../../chunks/useT9n.js";
 import { LitElement as n, createEvent as d, nothing as a, safeClassMap as h } from "@arcgis/lumina";
 import { b as p } from "../../chunks/cardsHelpers.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.2/esri/copyright.txt for details.
-v1.2.0-next.3 */
+v1.2.0-next.31 */
 const m = r`/** @license
  * Copyright 2025 Esri
  *
@@ -20,7 +20,7 @@ const m = r`/** @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.
- */calcite-card{width:240px;height:100%;padding-bottom:2px}@media(max-width:400px){calcite-card{width:100%}}calcite-card:hover img{-webkit-filter:brightness(20%);filter:brightness(20%);-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-o-transition:all 1s ease;-ms-transition:all 1s ease;transition:all 1s ease}calcite-card:hover .hover-text{opacity:1;color:#fff}calcite-card:hover{outline:2px solid var(--calcite-ui-brand);box-sizing:border-box;cursor:pointer}.chip-status{--calcite-chip-icon-color: var(--calcite-ui-brand);cursor:pointer}.chip-deployed{--calcite-chip-icon-color: var(--calcite-color-status-success)}.hover-text{transition:.5s ease;opacity:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);text-align:center;display:flex;flex-direction:row;align-items:center;height:100%;font-size:1.2rem}.font-color-text-2{--calcite-label-text-color: var(--calcite-color-text-2)}.font-line-height{line-height:1.4}.font-size-size--1{font-size:var(--calcite-font-size--1)}.header-line-height{--calcite-label-margin-bottom: 0;margin-top:.5rem;margin-bottom:.7rem}.info-icon{--calcite-icon-color: var(--calcite-color-text-inverse);padding-inline-end:.3rem}.card-image-wrap{flex:0 0 auto}.card-image-wrap{width:100%;position:relative;margin-bottom:0;-webkit-box-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto}.card-image{width:100%;display:block}video,img{max-width:100%;height:auto}img{overflow-clip-margin:content-box;overflow:clip}a{text-decoration:none;color:inherit;outline:0;padding:0;margin:0;display:inherit;height:100%}`;
+ */calcite-card{height:100%;padding-bottom:2px}@media(max-width:400px){calcite-card{width:100%}}calcite-card:hover img{-webkit-filter:brightness(20%);filter:brightness(20%);-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-o-transition:all 1s ease;-ms-transition:all 1s ease;transition:all 1s ease}calcite-card:hover .hover-text{opacity:1;color:#fff}calcite-card:hover{outline:2px solid var(--calcite-ui-brand);box-sizing:border-box;cursor:pointer}.chip-status{--calcite-chip-icon-color: var(--calcite-ui-brand);cursor:pointer}.chip-deployed{--calcite-chip-icon-color: var(--calcite-color-status-success)}.hover-text{transition:.5s ease;opacity:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);text-align:center;display:flex;flex-direction:row;align-items:center;height:100%;font-size:1.2rem}.font-color-text-2{--calcite-label-text-color: var(--calcite-color-text-2)}.font-line-height{line-height:1.4}.font-size-size--1{font-size:var(--calcite-font-size--1)}.header-line-height{--calcite-label-margin-bottom: 0;margin-top:.5rem;margin-bottom:.7rem}.info-icon{--calcite-icon-color: var(--calcite-color-text-inverse);padding-inline-end:.3rem}.card-image-wrap{flex:0 0 auto}.card-image-wrap{width:100%;position:relative;margin-bottom:0;-webkit-box-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto}.card-image{width:100%;display:block}video,img{max-width:100%;height:auto}img{overflow-clip-margin:content-box;overflow:clip}a{text-decoration:none;color:inherit;outline:0;padding:0;margin:0;display:inherit;height:100%}`;
 class u extends n {
   constructor() {
     super(...arguments), this._translations = l({ name: "solution-details-card", blocking: !0 }), this.detailsCardSelected = d();
@@ -33,7 +33,7 @@ class u extends n {
   }
   render() {
     const e = p(this.card.title);
-    return console.warn("TODO update string after R3 release"), i`<a href=${e ?? a} @click=${this._anchorClick} .title=${`${this.card.title} - ArcGIS Solutions`}>${this._renderCard()}</a>`;
+    return i`<a href=${e ?? a} @click=${this._anchorClick} .title=${`${this.card.title} - ${this._translations.arcgisSolutions}`}>${this._renderCard()}</a>`;
   }
   _anchorClick(e) {
     e.preventDefault();
@@ -42,11 +42,11 @@ class u extends n {
     this.detailsCardSelected.emit(this.card);
   }
   _renderCard() {
-    const e = this.card, c = e.chip === "new" || e.chip === "updated" ? "chip-status" : this.card.chip === "deployed" ? "chip-deployed" : "", o = "solution-details-card-chip", t = e.chip === "new" ? this._translations.newSolution : e.chip === "updated" ? this._translations.updated : this._translations.deployed;
-    return i`<calcite-card .label=${e.snippet} @click=${this._cardSelected}><div class="card-image-wrap" slot=thumbnail><img alt=${e.title ?? a} class="thumbnail card-image" src=${e.thumbnailUrl ?? a}><div class="hover-text">${this._translations.viewDetails}</div></div><calcite-label slot=heading class="header-line-height" scale=l>${e.title}</calcite-label><p slot=description class="font-color-text-2 font-line-height font-size-size--1">${e.snippet}</p>${e.chip !== "none" ? i`<div slot=footer-end><calcite-chip class=${h(c)} .icon=${e.chip === "updated" || e.chip === "new" ? "mega-phone" : "check-circle"} id=${o} .label=${t} .value=${t} scale=s></calcite-chip><calcite-tooltip .referenceElement=${o}><span>${t}</span></calcite-tooltip></div>` : void 0}<div slot=footer-start></div></calcite-card>`;
+    const e = this.card, s = e.chip === "new" || e.chip === "updated" ? "chip-status" : this.card.chip === "deployed" ? "chip-deployed" : "", o = "solution-details-card-chip", t = e.chip === "new" ? this._translations.newSolution : e.chip === "updated" ? this._translations.updated : this._translations.deployed;
+    return i`<calcite-card .label=${e.snippet} @click=${this._cardSelected}><div class="card-image-wrap" slot=thumbnail><img alt=${e.title ?? a} class="thumbnail card-image" src=${e.thumbnailUrl ?? a}><div class="hover-text">${this._translations.viewDetails}</div></div><calcite-label slot=heading class="header-line-height" scale=l>${e.title}</calcite-label><p slot=description class="font-color-text-2 font-line-height font-size-size--1">${e.snippet}</p>${e.chip !== "none" ? i`<div slot=footer-end><calcite-chip class=${h(s)} .icon=${e.chip === "updated" || e.chip === "new" ? "mega-phone" : "check-circle"} id=${o} .label=${t} .value=${t} scale=s></calcite-chip><calcite-tooltip .referenceElement=${o}><span>${t}</span></calcite-tooltip></div>` : void 0}<div slot=footer-start></div></calcite-card>`;
   }
 }
-s("solution-details-card", u);
+c("solution-details-card", u);
 export {
   u as SolutionDetailsCard
 };