comisai 1.0.37 → 1.0.40

package/node_modules/@comis/web/dist/assets/pipeline-history-DsOViMHn.js

@@ -0,0 +1,317 @@
+import{c as e,f as t,h as n,l as r,n as i,o as a,r as o,s,t as c,u as l}from"./decorate-BvWYovGE.js";import{a as u,r as d}from"./system-time-B0nBw4nV.js";import{a as f}from"./index-D_ZV_sV5.js";import"./ic-breadcrumb-1qP0UJ5v.js";import"./ic-confirm-dialog-Wdt0QSRg.js";import"./ic-icon-BkVssjSQ.js";import"./ic-empty-state-BRy4ZXds.js";var p={completed:`#22c55e`,failed:`#ef4444`};function m(e){if(!e)return`Never`;let t=u()-e;if(t<0)return`just now`;let n=Math.floor(t/1e3);if(n<60)return`just now`;let r=Math.floor(n/60);if(r<60)return`${r}m ago`;let i=Math.floor(r/60);if(i<24)return`${i}h ago`;let a=Math.floor(i/24);return a<30?`${a}d ago`:d(e).toISOString().slice(0,10)}var h=class extends r{constructor(...e){super(...e),this.rpcClient=null,this._rpcStatusUnsub=null,this._runs=[],this._loading=!0,this._sortField=`date`,this._sortDir=`desc`,this._deleteTarget=null}static{this.styles=[o,i,n`
+      :host {
+        display: block;
+      }
+
+      .page-header {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: var(--ic-space-lg, 1.5rem);
+      }
+
+      .page-title {
+        font-size: var(--ic-text-2xl, 1.5rem);
+        font-weight: 700;
+        margin: 0;
+      }
+
+      /* Grid-based table -- 5 columns */
+      .grid-table {
+        display: grid;
+        grid-template-columns: minmax(180px, 2fr) 100px 70px 120px auto;
+        width: 100%;
+      }
+
+      .grid-header {
+        display: contents;
+      }
+
+      .grid-header .cell {
+        font-size: var(--ic-text-xs, 0.75rem);
+        font-weight: 600;
+        text-transform: uppercase;
+        letter-spacing: 0.05em;
+        color: var(--ic-text-dim, #6b7280);
+        padding: var(--ic-space-sm, 0.5rem) var(--ic-space-md, 0.75rem);
+        border-bottom: 1px solid var(--ic-border, #374151);
+        cursor: pointer;
+        user-select: none;
+        white-space: nowrap;
+      }
+
+      .grid-header .cell:hover {
+        color: var(--ic-text-muted, #9ca3af);
+      }
+
+      .grid-header .cell.actions-header {
+        cursor: default;
+        text-align: right;
+      }
+
+      .grid-header .cell.actions-header:hover {
+        color: var(--ic-text-dim, #6b7280);
+      }
+
+      .sort-arrow {
+        display: inline-block;
+        margin-left: 4px;
+        font-size: 0.625rem;
+        opacity: 0.5;
+      }
+
+      .sort-arrow--active {
+        opacity: 1;
+        color: var(--ic-accent, #3b82f6);
+      }
+
+      .grid-row {
+        display: contents;
+        cursor: pointer;
+      }
+
+      .grid-row .cell {
+        padding: var(--ic-space-sm, 0.5rem) var(--ic-space-md, 0.75rem);
+        border-bottom: 1px solid var(--ic-border, #374151);
+        font-size: var(--ic-text-sm, 0.875rem);
+        display: flex;
+        align-items: center;
+        transition: background var(--ic-transition, 150ms ease);
+      }
+
+      .grid-row:hover .cell {
+        background: var(--ic-surface-2, #1f2937);
+      }
+
+      .grid-row .cell.actions-cell {
+        justify-content: flex-end;
+        white-space: nowrap;
+      }
+
+      .run-name {
+        font-weight: 500;
+        color: var(--ic-text, #f3f4f6);
+      }
+
+      /* Status dot */
+      .status-dot {
+        display: inline-block;
+        width: 8px;
+        height: 8px;
+        border-radius: 50%;
+        background: var(--dot-color, #6b7280);
+        margin-right: 6px;
+        vertical-align: middle;
+        flex-shrink: 0;
+      }
+
+      .status-text {
+        display: inline-flex;
+        align-items: center;
+      }
+
+      /* Action buttons */
+      .action-btn {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        width: 32px;
+        height: 32px;
+        padding: 0;
+        background: transparent;
+        border: 1px solid transparent;
+        border-radius: var(--ic-radius-sm, 0.25rem);
+        color: var(--ic-text-dim, #6b7280);
+        cursor: pointer;
+        transition: background var(--ic-transition, 150ms ease),
+          color var(--ic-transition, 150ms ease),
+          border-color var(--ic-transition, 150ms ease);
+      }
+
+      .action-btn:hover {
+        background: var(--ic-surface-2, #1f2937);
+        color: var(--ic-text, #f3f4f6);
+        border-color: var(--ic-border, #374151);
+      }
+
+      .action-btn--danger:hover {
+        color: var(--ic-error, #f87171);
+        border-color: var(--ic-error, #f87171);
+      }
+
+      .dim-text {
+        color: var(--ic-text-dim, #6b7280);
+      }
+
+      /* Mobile responsive cards */
+      .mobile-list {
+        display: none;
+      }
+
+      @media (max-width: 767px) {
+        .grid-table {
+          display: none;
+        }
+        .mobile-list {
+          display: flex;
+          flex-direction: column;
+          gap: 8px;
+        }
+        .mobile-card {
+          background: var(--ic-surface, #111827);
+          border: 1px solid var(--ic-border, #374151);
+          border-radius: var(--ic-radius-md, 0.5rem);
+          padding: 12px;
+          cursor: pointer;
+          transition: border-color var(--ic-transition, 150ms ease);
+        }
+        .mobile-card:hover {
+          border-color: var(--ic-accent, #3b82f6);
+        }
+        .card-header {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          margin-bottom: 8px;
+        }
+        .card-label {
+          font-weight: 600;
+          font-size: var(--ic-text-sm, 0.875rem);
+          color: var(--ic-text, #f3f4f6);
+        }
+        .card-meta {
+          display: flex;
+          gap: 12px;
+          font-size: var(--ic-text-xs, 0.75rem);
+          color: var(--ic-text-dim, #6b7280);
+          margin-bottom: 8px;
+        }
+        .card-actions {
+          display: flex;
+          gap: 4px;
+          justify-content: flex-end;
+        }
+      }
+    `]}get _breadcrumbs(){return[{label:`Pipelines`,route:`pipelines`},{label:`History`}]}disconnectedCallback(){super.disconnectedCallback(),this._rpcStatusUnsub?.(),this._rpcStatusUnsub=null}updated(e){e.has(`rpcClient`)&&this.rpcClient&&(this._rpcStatusUnsub?.(),this.rpcClient.status===`connected`?this._loadRuns():this._rpcStatusUnsub=this.rpcClient.onStatusChange(e=>{e===`connected`&&(this._rpcStatusUnsub=null,this._loadRuns())}))}async _loadRuns(){this._loading=!0;try{let e=await this.rpcClient?.call(`graph.runs`,{});this._runs=e?.runs??[]}catch{this._runs=[]}this._loading=!1}get _sorted(){return[...this._runs].sort((e,t)=>{let n=0;switch(this._sortField){case`name`:n=e.name.localeCompare(t.name);break;case`status`:n=e.status.localeCompare(t.status);break;case`nodeCount`:n=e.nodeCount-t.nodeCount;break;case`date`:n=e.date.localeCompare(t.date);break}return this._sortDir===`asc`?n:-n})}_handleSort(e){this._sortField===e?this._sortDir=this._sortDir===`asc`?`desc`:`asc`:(this._sortField=e,this._sortDir=e===`name`?`asc`:`desc`)}_sortArrow(e){return this._sortField===e?this._sortDir===`asc`?`▲`:`▼`:``}_sortArrowClass(e){return this._sortField===e?`sort-arrow sort-arrow--active`:`sort-arrow`}_navigateToDetail(e){window.location.hash=`#/pipelines/history/${e.graphId}`}_handleDeleteClick(e,t){t.stopPropagation(),this._deleteTarget=e}async _confirmDelete(){if(!this._deleteTarget)return;let e=this._deleteTarget;this._deleteTarget=null;try{await this.rpcClient?.call(`graph.deleteRun`,{graphId:e.graphId}),this._runs=this._runs.filter(t=>t.graphId!==e.graphId),f.show(`Deleted "${e.name}"`,`success`)}catch(e){f.show(`Failed to delete: ${e instanceof Error?e.message:`Unknown error`}`,`error`)}}_cancelDelete(){this._deleteTarget=null}_renderStatusDot(e){return t`<span class="status-text">
+      <span class="status-dot" style="--dot-color: ${p[e]??`#6b7280`}"></span>
+      ${e.charAt(0).toUpperCase()+e.slice(1)}
+    </span>`}_dateToRelative(e){return m(d(e).getTime())}render(){return t`
+      <ic-breadcrumb .items=${this._breadcrumbs}
+        @navigate=${e=>this.dispatchEvent(new CustomEvent(`navigate`,{detail:e.detail,bubbles:!0,composed:!0}))}
+      ></ic-breadcrumb>
+
+      <div class="page-header" role="region" aria-label="Pipeline History">
+        <h1 class="page-title">Pipeline History</h1>
+      </div>
+
+      ${this._renderContent()}
+      ${this._deleteTarget?t`
+            <ic-confirm-dialog
+              open
+              variant="danger"
+              title="Delete Run"
+              message=${`Delete run "${this._deleteTarget.name}"? This cannot be undone.`}
+              confirmLabel="Delete"
+              @confirm=${this._confirmDelete}
+              @cancel=${this._cancelDelete}
+            ></ic-confirm-dialog>
+          `:l}
+    `}_renderContent(){if(this._loading)return t`<ic-skeleton-view variant="list"></ic-skeleton-view>`;if(this._runs.length===0)return t`
+        <ic-empty-state
+          icon="git-branch"
+          message="No pipeline runs yet"
+          description="Run a pipeline to see results here."
+        >
+          <button
+            class="action-btn"
+            style="padding: 8px 16px; width: auto; height: auto; border: 1px solid var(--ic-border, #374151); color: var(--ic-text, #f3f4f6);"
+            @click=${()=>{window.location.hash=`#/pipelines/new`}}
+          >
+            New Pipeline
+          </button>
+        </ic-empty-state>
+      `;let e=this._sorted;return t`
+      ${this._renderTable(e)}
+      ${this._renderMobileList(e)}
+    `}_renderTable(e){return t`
+      <div class="grid-table" role="table">
+        <div class="grid-header" role="row">
+          <div class="cell" role="columnheader" @click=${()=>this._handleSort(`name`)}>
+            Name
+            <span class=${this._sortArrowClass(`name`)}>${this._sortArrow(`name`)}</span>
+          </div>
+          <div class="cell" role="columnheader" @click=${()=>this._handleSort(`status`)}>
+            Status
+            <span class=${this._sortArrowClass(`status`)}>${this._sortArrow(`status`)}</span>
+          </div>
+          <div class="cell" role="columnheader" @click=${()=>this._handleSort(`nodeCount`)}>
+            Nodes
+            <span class=${this._sortArrowClass(`nodeCount`)}>${this._sortArrow(`nodeCount`)}</span>
+          </div>
+          <div class="cell" role="columnheader" @click=${()=>this._handleSort(`date`)}>
+            Date
+            <span class=${this._sortArrowClass(`date`)}>${this._sortArrow(`date`)}</span>
+          </div>
+          <div class="cell actions-header" role="columnheader">Actions</div>
+        </div>
+        ${e.map(e=>this._renderRow(e))}
+      </div>
+    `}_renderRow(e){return t`
+      <div class="grid-row" role="row" @click=${()=>this._navigateToDetail(e)}>
+        <div class="cell" role="cell">
+          <span class="run-name">${e.name}</span>
+        </div>
+        <div class="cell" role="cell">
+          ${this._renderStatusDot(e.status)}
+        </div>
+        <div class="cell" role="cell">${e.nodeCount}</div>
+        <div class="cell dim-text" role="cell">${this._dateToRelative(e.date)}</div>
+        <div class="cell actions-cell" role="cell">
+          <button
+            class="action-btn"
+            aria-label="View ${e.name}"
+            @click=${t=>{t.stopPropagation(),this._navigateToDetail(e)}}
+          >
+            <ic-icon name="eye" size="16px"></ic-icon>
+          </button>
+          <button
+            class="action-btn action-btn--danger"
+            aria-label="Delete ${e.name}"
+            @click=${t=>this._handleDeleteClick(e,t)}
+          >
+            <ic-icon name="trash" size="16px"></ic-icon>
+          </button>
+        </div>
+      </div>
+    `}_renderMobileList(e){return t`
+      <div class="mobile-list">
+        ${e.map(e=>t`
+            <div class="mobile-card" @click=${()=>this._navigateToDetail(e)}>
+              <div class="card-header">
+                <span class="card-label">${e.name}</span>
+                ${this._renderStatusDot(e.status)}
+              </div>
+              <div class="card-meta">
+                <span>${e.nodeCount} nodes</span>
+                <span>${this._dateToRelative(e.date)}</span>
+              </div>
+              <div class="card-actions">
+                <button
+                  class="action-btn"
+                  aria-label="View ${e.name}"
+                  @click=${t=>{t.stopPropagation(),this._navigateToDetail(e)}}
+                >
+                  <ic-icon name="eye" size="16px"></ic-icon>
+                </button>
+                <button
+                  class="action-btn action-btn--danger"
+                  aria-label="Delete ${e.name}"
+                  @click=${t=>this._handleDeleteClick(e,t)}
+                >
+                  <ic-icon name="trash" size="16px"></ic-icon>
+                </button>
+              </div>
+            </div>
+          `)}
+      </div>
+    `}};c([s({attribute:!1})],h.prototype,`rpcClient`,void 0),c([a()],h.prototype,`_runs`,void 0),c([a()],h.prototype,`_loading`,void 0),c([a()],h.prototype,`_sortField`,void 0),c([a()],h.prototype,`_sortDir`,void 0),c([a()],h.prototype,`_deleteTarget`,void 0),h=c([e(`ic-pipeline-history`)],h);export{h as IcPipelineHistory};

package/node_modules/@comis/web/dist/assets/pipeline-history-detail-D6g-NB_Q.js

@@ -0,0 +1,287 @@
+import{c as e,f as t,h as n,l as r,n as i,o as a,r as o,s,t as c,u as l}from"./decorate-BvWYovGE.js";import{a as u,r as d}from"./system-time-B0nBw4nV.js";import{a as f}from"./index-D_ZV_sV5.js";import"./ic-breadcrumb-1qP0UJ5v.js";import"./ic-confirm-dialog-Wdt0QSRg.js";import"./ic-icon-BkVssjSQ.js";import{n as p,t as m}from"./ic-chat-message-b8x6Gh80.js";var h={completed:`#22c55e`,failed:`#ef4444`};function g(e){if(!e)return`Never`;let t=u()-e;if(t<0)return`just now`;let n=Math.floor(t/1e3);if(n<60)return`just now`;let r=Math.floor(n/60);if(r<60)return`${r}m ago`;let i=Math.floor(r/60);if(i<24)return`${i}h ago`;let a=Math.floor(i/24);return a<30?`${a}d ago`:d(e).toISOString().slice(0,10)}function _(e){return e.replace(/_/g,` `).replace(/\b\w/g,e=>e.toUpperCase())}var v=class extends r{constructor(...e){super(...e),this.rpcClient=null,this.graphId=``,this._rpcStatusUnsub=null,this._detail=null,this._loading=!0,this._error=!1,this._showDeleteConfirm=!1}static{this.styles=[o,i,n`
+      :host {
+        display: block;
+      }
+
+      /* Metadata header */
+      .meta-header {
+        display: flex;
+        justify-content: space-between;
+        align-items: flex-start;
+        padding: var(--ic-space-md, 0.75rem) var(--ic-space-lg, 1.5rem);
+        background: var(--ic-surface, #111827);
+        border: 1px solid var(--ic-border, #374151);
+        border-radius: var(--ic-radius-md, 0.5rem);
+        margin-bottom: var(--ic-space-lg, 1.5rem);
+      }
+
+      .meta-info {
+        display: flex;
+        flex-direction: column;
+        gap: var(--ic-space-xs, 0.25rem);
+      }
+
+      .meta-name {
+        font-size: var(--ic-text-xl, 1.25rem);
+        font-weight: 700;
+        color: var(--ic-text, #f3f4f6);
+        margin: 0;
+      }
+
+      .meta-details {
+        display: flex;
+        gap: var(--ic-space-lg, 1.5rem);
+        font-size: var(--ic-text-sm, 0.875rem);
+        color: var(--ic-text-dim, #6b7280);
+      }
+
+      .meta-detail {
+        display: inline-flex;
+        align-items: center;
+        gap: 4px;
+      }
+
+      /* Status dot */
+      .status-dot {
+        display: inline-block;
+        width: 8px;
+        height: 8px;
+        border-radius: 50%;
+        background: var(--dot-color, #6b7280);
+        margin-right: 4px;
+        vertical-align: middle;
+        flex-shrink: 0;
+      }
+
+      .status-text {
+        display: inline-flex;
+        align-items: center;
+      }
+
+      /* Delete button */
+      .delete-btn {
+        display: inline-flex;
+        align-items: center;
+        gap: var(--ic-space-xs, 0.25rem);
+        padding: var(--ic-space-sm, 0.5rem) var(--ic-space-md, 0.75rem);
+        background: transparent;
+        border: 1px solid var(--ic-border, #374151);
+        border-radius: var(--ic-radius-sm, 0.25rem);
+        color: var(--ic-text-dim, #6b7280);
+        font-size: var(--ic-text-sm, 0.875rem);
+        font-family: inherit;
+        cursor: pointer;
+        transition: color var(--ic-transition, 150ms ease),
+          border-color var(--ic-transition, 150ms ease);
+      }
+
+      .delete-btn:hover {
+        color: var(--ic-error, #f87171);
+        border-color: var(--ic-error, #f87171);
+      }
+
+      /* Node accordion */
+      .node-accordion {
+        display: flex;
+        flex-direction: column;
+        gap: var(--ic-space-sm, 0.5rem);
+      }
+
+      .node-section {
+        border: 1px solid var(--ic-border, #374151);
+        border-radius: var(--ic-radius-md, 0.5rem);
+        overflow: hidden;
+      }
+
+      .node-section summary {
+        padding: var(--ic-space-sm, 0.5rem) var(--ic-space-md, 0.75rem);
+        font-weight: 600;
+        font-size: var(--ic-text-sm, 0.875rem);
+        color: var(--ic-text, #f3f4f6);
+        cursor: pointer;
+        user-select: none;
+        background: var(--ic-surface, #111827);
+        border-bottom: 1px solid transparent;
+        transition: background var(--ic-transition, 150ms ease);
+      }
+
+      .node-section summary:hover {
+        background: var(--ic-surface-2, #1f2937);
+      }
+
+      .node-section[open] summary {
+        border-bottom-color: var(--ic-border, #374151);
+      }
+
+      .node-content {
+        padding: var(--ic-space-md, 0.75rem) var(--ic-space-lg, 1.5rem);
+        border-left: 3px solid var(--ic-accent, #3b82f6);
+        margin-left: var(--ic-space-sm, 0.5rem);
+      }
+
+      /* Markdown rendering styles */
+      .node-content h3, .node-content h4, .node-content h5, .node-content h6 {
+        color: var(--ic-text, #f3f4f6);
+        margin-top: var(--ic-space-md, 0.75rem);
+        margin-bottom: var(--ic-space-xs, 0.25rem);
+      }
+
+      .node-content p {
+        margin: var(--ic-space-xs, 0.25rem) 0;
+        line-height: 1.6;
+      }
+
+      .node-content ul, .node-content ol {
+        padding-left: var(--ic-space-lg, 1.5rem);
+        margin: var(--ic-space-xs, 0.25rem) 0;
+      }
+
+      .node-content li {
+        margin: 2px 0;
+      }
+
+      .node-content code.inline-code {
+        background: var(--ic-surface-2, #1f2937);
+        padding: 1px 4px;
+        border-radius: 3px;
+        font-size: 0.85em;
+        font-family: var(--ic-font-mono, monospace);
+      }
+
+      .node-content table {
+        width: 100%;
+        border-collapse: collapse;
+        margin: var(--ic-space-sm, 0.5rem) 0;
+        font-size: var(--ic-text-sm, 0.875rem);
+      }
+
+      .node-content th, .node-content td {
+        padding: 4px 8px;
+        border: 1px solid var(--ic-border, #374151);
+        text-align: left;
+      }
+
+      .node-content th {
+        background: var(--ic-surface-2, #1f2937);
+        font-weight: 600;
+      }
+
+      .node-content a {
+        color: var(--ic-accent, #3b82f6);
+        text-decoration: underline;
+      }
+
+      .node-content blockquote {
+        border-left: 3px solid var(--ic-border, #374151);
+        padding-left: var(--ic-space-md, 0.75rem);
+        color: var(--ic-text-dim, #6b7280);
+        margin: var(--ic-space-sm, 0.5rem) 0;
+      }
+
+      /* Artifact sub-sections */
+      .artifact-section {
+        margin-top: var(--ic-space-sm, 0.5rem);
+        border: 1px solid var(--ic-border, #374151);
+        border-radius: var(--ic-radius-sm, 0.25rem);
+      }
+
+      .artifact-section summary {
+        padding: var(--ic-space-xs, 0.25rem) var(--ic-space-sm, 0.5rem);
+        font-size: var(--ic-text-xs, 0.75rem);
+        font-weight: 500;
+        color: var(--ic-text-dim, #6b7280);
+        cursor: pointer;
+        background: var(--ic-bg, #0d1117);
+      }
+
+      .artifact-section summary:hover {
+        color: var(--ic-text-muted, #9ca3af);
+      }
+
+      .artifact-content {
+        padding: var(--ic-space-sm, 0.5rem);
+        font-size: var(--ic-text-sm, 0.875rem);
+      }
+
+      /* No output placeholder */
+      .no-output {
+        color: var(--ic-text-dim, #6b7280);
+        font-style: italic;
+        font-size: var(--ic-text-sm, 0.875rem);
+      }
+
+      /* Not found state */
+      .not-found {
+        text-align: center;
+        padding: var(--ic-space-xl, 2rem);
+        color: var(--ic-text-dim, #6b7280);
+      }
+
+      .not-found a {
+        color: var(--ic-accent, #3b82f6);
+        text-decoration: underline;
+      }
+    `]}get _breadcrumbs(){return[{label:`Pipelines`,route:`pipelines`},{label:`History`,route:`pipelines/history`},{label:this._detail?.name??this.graphId}]}disconnectedCallback(){super.disconnectedCallback(),this._rpcStatusUnsub?.(),this._rpcStatusUnsub=null}updated(e){(e.has(`rpcClient`)||e.has(`graphId`))&&this.rpcClient&&this.graphId&&(this._rpcStatusUnsub?.(),this.rpcClient.status===`connected`?this._loadDetail():this._rpcStatusUnsub=this.rpcClient.onStatusChange(e=>{e===`connected`&&(this._rpcStatusUnsub=null,this._loadDetail())}))}async _loadDetail(){this._loading=!0,this._error=!1;try{let e=await this.rpcClient?.call(`graph.runDetail`,{graphId:this.graphId});e?this._detail=e:this._error=!0}catch{this._error=!0}this._loading=!1}async _confirmDelete(){this._showDeleteConfirm=!1;try{await this.rpcClient?.call(`graph.deleteRun`,{graphId:this.graphId}),f.show(`Run deleted`,`success`),window.location.hash=`#/pipelines/history`}catch(e){f.show(`Failed to delete: ${e instanceof Error?e.message:`Unknown error`}`,`error`)}}render(){return t`
+      <ic-breadcrumb .items=${this._breadcrumbs}
+        @navigate=${e=>this.dispatchEvent(new CustomEvent(`navigate`,{detail:e.detail,bubbles:!0,composed:!0}))}
+      ></ic-breadcrumb>
+
+      ${this._renderContent()}
+
+      <ic-confirm-dialog
+        ?open=${this._showDeleteConfirm}
+        variant="danger"
+        title="Delete Run"
+        message=${`Delete run "${this._detail?.name??this.graphId}"? This cannot be undone.`}
+        confirmLabel="Delete"
+        @confirm=${this._confirmDelete}
+        @cancel=${()=>{this._showDeleteConfirm=!1}}
+      ></ic-confirm-dialog>
+    `}_renderContent(){if(this._loading)return t`<ic-skeleton-view variant="detail"></ic-skeleton-view>`;if(this._error||!this._detail)return t`
+        <div class="not-found">
+          <p>Run not found.</p>
+          <a href="#/pipelines/history">Back to History</a>
+        </div>
+      `;let e=this._detail,n=d(e.date).getTime(),r=h[e.status]??`#6b7280`,i=e.status.charAt(0).toUpperCase()+e.status.slice(1);return t`
+      <div class="meta-header">
+        <div class="meta-info">
+          <h2 class="meta-name">${e.name}</h2>
+          <div class="meta-details">
+            <span class="meta-detail">
+              <span class="status-text">
+                <span class="status-dot" style="--dot-color: ${r}"></span>
+                ${i}
+              </span>
+            </span>
+            <span class="meta-detail">${g(n)}</span>
+            <span class="meta-detail">${e.nodes.length} nodes</span>
+          </div>
+        </div>
+        <button
+          class="delete-btn"
+          @click=${()=>{this._showDeleteConfirm=!0}}
+        >
+          <ic-icon name="trash" size="14px"></ic-icon>
+          Delete Run
+        </button>
+      </div>
+
+      <div class="node-accordion">
+        ${e.nodes.map((e,n)=>t`
+          <details class="node-section" ?open=${n===0}>
+            <summary>${_(e.nodeId)}</summary>
+            <div class="node-content">
+              ${e.output?p(m(e.output)):t`<p class="no-output">No output</p>`}
+              ${e.artifacts.length>0?e.artifacts.map(e=>t`
+                    <details class="artifact-section">
+                      <summary>${e.filename}</summary>
+                      <div class="artifact-content">
+                        ${p(m(e.content))}
+                      </div>
+                    </details>
+                  `):l}
+            </div>
+          </details>
+        `)}
+      </div>
+    `}};c([s({attribute:!1})],v.prototype,`rpcClient`,void 0),c([s({type:String})],v.prototype,`graphId`,void 0),c([a()],v.prototype,`_detail`,void 0),c([a()],v.prototype,`_loading`,void 0),c([a()],v.prototype,`_error`,void 0),c([a()],v.prototype,`_showDeleteConfirm`,void 0),v=c([e(`ic-pipeline-history-detail`)],v);export{v as IcPipelineHistoryDetail};