@cognivo/components 0.8.0

package/dist/components/ai-test-runner/ai-test-runner.js

@@ -0,0 +1,448 @@
+import { css as x, LitElement as y, svg as p, html as s, nothing as i } from "lit";
+import { property as m, state as b, customElement as w } from "lit/decorators.js";
+import { h as _, r as $, f as k } from "../../chunks/premium.css-9I4kHrsl.js";
+import "../cg-card/cg-card.js";
+import "../cg-text/cg-text.js";
+import "../cg-button/cg-button.js";
+import "../cg-spinner/cg-spinner.js";
+var C = Object.defineProperty, z = Object.getOwnPropertyDescriptor, d = (t, a, r, o) => {
+  for (var n = o > 1 ? void 0 : o ? z(a, r) : a, l = t.length - 1, g; l >= 0; l--)
+    (g = t[l]) && (n = (o ? g(a, r, n) : g(n)) || n);
+  return o && n && C(a, r, n), n;
+};
+let c = class extends y {
+  constructor() {
+    super(...arguments), this.tests = [], this.title = "Test Results", this._expanded = /* @__PURE__ */ new Set(), this._filter = "all";
+  }
+  // ─── Derived counts ─────────────────────────────────────────────────────
+  _countByStatus(t) {
+    return this.tests.filter((a) => a.status === t).length;
+  }
+  get _passCount() {
+    return this._countByStatus("pass");
+  }
+  get _failCount() {
+    return this._countByStatus("fail");
+  }
+  get _runningCount() {
+    return this._countByStatus("running");
+  }
+  get _pendingCount() {
+    return this._countByStatus("pending");
+  }
+  /** Sum of test.duration (skipping undefined). */
+  get _totalDuration() {
+    return this.tests.reduce((t, a) => t + (a.duration ?? 0), 0);
+  }
+  /** Average of defined `score` values; null if no scores present. */
+  get _avgScore() {
+    const t = this.tests.filter((r) => typeof r.score == "number");
+    if (!t.length) return null;
+    const a = t.reduce((r, o) => r + (o.score ?? 0), 0);
+    return Math.round(a / t.length);
+  }
+  _formatDuration(t) {
+    if (t < 1e3) return `${Math.round(t)} ms`;
+    if (t < 6e4) return `${(t / 1e3).toFixed(1)} s`;
+    const a = Math.floor(t / 6e4), r = Math.round(t % 6e4 / 1e3);
+    return `${a}m ${r}s`;
+  }
+  get _visibleTests() {
+    return this.tests.map((t, a) => ({ test: t, index: a })).filter(({ test: t }) => this._filter === "all" || t.status === this._filter);
+  }
+  // ─── Handlers ───────────────────────────────────────────────────────────
+  _toggle(t) {
+    const a = new Set(this._expanded);
+    a.has(t) ? a.delete(t) : a.add(t), this._expanded = a, this.dispatchEvent(new CustomEvent("ai-test-click", {
+      bubbles: !0,
+      composed: !0,
+      detail: { index: t, test: this.tests[t] }
+    }));
+  }
+  _runAll() {
+    this.dispatchEvent(new CustomEvent("ai-test-run", {
+      bubbles: !0,
+      composed: !0,
+      detail: { tests: this.tests.map((t) => t.name) }
+    }));
+  }
+  // ─── Renderers ──────────────────────────────────────────────────────────
+  _statusIcon(t) {
+    return t === "pass" ? s`<span class="status-icon pass" aria-label="Passed">${p`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>`}</span>` : t === "fail" ? s`<span class="status-icon fail" aria-label="Failed">${p`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round"><path d="M18 6L6 18M6 6l12 12"/></svg>`}</span>` : t === "running" ? s`<span class="status-icon running" aria-label="Running"><cg-spinner size="sm"></cg-spinner></span>` : s`<span class="status-icon pending" aria-label="Pending">${p`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="9"/></svg>`}</span>`;
+  }
+  render() {
+    const t = this.tests.length || 1, a = this._passCount / t * 100, r = this._failCount / t * 100, o = this._totalDuration, n = this._avgScore, l = this._visibleTests, v = [
+      { id: "all", label: "All", count: this.tests.length },
+      { id: "pass", label: "Passed", count: this._passCount },
+      { id: "fail", label: "Failed", count: this._failCount },
+      { id: "running", label: "Running", count: this._runningCount },
+      { id: "pending", label: "Pending", count: this._pendingCount }
+    ].filter((e) => e.id === "all" || e.count > 0);
+    return s`
+      <cg-card variant="elevated" padding="md" rounded="lg">
+        <div slot="header" class="header-row">
+          <cg-text as="h3" size="sm" weight="semibold">${this.title}</cg-text>
+          <cg-button variant="primary" size="sm" @click=${this._runAll} aria-label="Run all tests">
+            Run all
+          </cg-button>
+        </div>
+
+        <div class="summary-bar" role="status" aria-label="Test summary">
+          <span class="summary-item">
+            <span class="dot dot-pass" aria-hidden="true"></span>
+            <cg-text size="xs" color="muted">${this._passCount} passed</cg-text>
+          </span>
+          <span class="summary-item">
+            <span class="dot dot-fail" aria-hidden="true"></span>
+            <cg-text size="xs" color="muted">${this._failCount} failed</cg-text>
+          </span>
+          ${this._runningCount ? s`
+            <span class="summary-item">
+              <span class="dot dot-running" aria-hidden="true"></span>
+              <cg-text size="xs" color="muted">${this._runningCount} running</cg-text>
+            </span>
+          ` : i}
+          ${this._pendingCount ? s`
+            <span class="summary-item">
+              <span class="dot dot-pending" aria-hidden="true"></span>
+              <cg-text size="xs" color="muted">${this._pendingCount} pending</cg-text>
+            </span>
+          ` : i}
+          <span class="summary-spacer"></span>
+          ${n != null ? s`
+            <span class="summary-item">
+              <cg-text size="xs" color="muted">Avg score:</cg-text>
+              <cg-text size="xs" weight="semibold">${n}%</cg-text>
+            </span>
+          ` : i}
+          ${o > 0 ? s`
+            <span class="summary-item">
+              <cg-text size="xs" color="muted">${this._formatDuration(o)}</cg-text>
+            </span>
+          ` : i}
+        </div>
+
+        <div class="progress-bar" aria-hidden="true">
+          <div class="progress-pass" style="width:${a}%"></div>
+          <div class="progress-fail" style="width:${r}%"></div>
+        </div>
+
+        ${this.tests.length > 1 && v.length > 1 ? s`
+          <div class="filter-chips">
+            ${v.map((e) => s`
+              <button
+                class="filter-chip ${this._filter === e.id ? "active" : ""}"
+                type="button"
+                @click=${() => {
+      this._filter = e.id;
+    }}
+                aria-pressed=${this._filter === e.id ? "true" : "false"}
+              >
+                <span>${e.label}</span>
+                <span class="filter-count">${e.count}</span>
+              </button>
+            `)}
+          </div>
+        ` : i}
+
+        <div class="test-list" role="list" aria-label="Tests">
+          ${l.length === 0 ? s`
+            <div class="empty">No tests match the current filter.</div>
+          ` : l.map(({ test: e, index: h }) => {
+      const u = !!(e.expected || e.actual), f = this._expanded.has(h);
+      return s`
+              <div class="test-item ${e.status === "running" ? "running-row" : ""}" role="listitem">
+                <button
+                  class="test-header ${u ? "expandable" : ""}"
+                  type="button"
+                  @click=${() => {
+        u && this._toggle(h);
+      }}
+                  aria-expanded=${u ? f ? "true" : "false" : i}
+                >
+                  ${this._statusIcon(e.status)}
+                  <cg-text class="test-name" size="sm">${e.name}</cg-text>
+                  <div class="test-meta">
+                    ${e.score != null ? s`<cg-text size="xs" weight="semibold">${e.score}%</cg-text>` : i}
+                    ${e.duration != null ? s`<cg-text size="xs" color="muted">${this._formatDuration(e.duration)}</cg-text>` : i}
+                  </div>
+                </button>
+                ${f && u ? s`
+                  <div class="test-details">
+                    ${e.expected ? s`
+                      <div class="detail-row">
+                        <cg-text class="detail-label" size="xs" color="muted">Expected</cg-text>
+                        <span class="detail-value detail-expected">${e.expected}</span>
+                      </div>
+                    ` : i}
+                    ${e.actual ? s`
+                      <div class="detail-row">
+                        <cg-text class="detail-label" size="xs" color="muted">Actual</cg-text>
+                        <span class="detail-value detail-actual">${e.actual}</span>
+                      </div>
+                    ` : i}
+                  </div>
+                ` : i}
+              </div>
+            `;
+    })}
+        </div>
+      </cg-card>
+    `;
+  }
+};
+c.styles = [_, $, k, x`
+    :host {
+      display: block;
+      animation: fadeSlideIn var(--cg-transition-duration-default) var(--cg-transition-easing-default);
+    }
+    :host([hidden]) { display: none; }
+
+    cg-card { display: block; }
+
+    /* ── Header row ── */
+    .header-row {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: var(--cg-spacing-12);
+      width: 100%;
+    }
+
+    /* ── Summary bar ── */
+    .summary-bar {
+      display: flex;
+      flex-wrap: wrap;
+      gap: var(--cg-spacing-16);
+      margin-bottom: var(--cg-spacing-8);
+      align-items: center;
+    }
+    .summary-spacer { flex: 1; }
+    .summary-item {
+      display: inline-flex;
+      align-items: center;
+      gap: var(--cg-spacing-6);
+      font-variant-numeric: tabular-nums;
+    }
+    .dot {
+      width: var(--cg-spacing-8);
+      height: var(--cg-spacing-8);
+      border-radius: var(--cg-border-radius-full);
+    }
+    .dot-pass    { background: var(--cg-color-status-success-text-default); }
+    .dot-fail    { background: var(--cg-color-status-error-text-default); }
+    .dot-running { background: var(--cg-color-status-warning-text-default); }
+    .dot-pending { background: var(--cg-color-surface-container-outlined); }
+
+    /* Combined pass/fail progress bar — track uses divider semantic, not a
+       border-color token. */
+    .progress-bar {
+      height: var(--cg-spacing-6);
+      border-radius: var(--cg-border-radius-full);
+      background: var(--cg-color-surface-cards-divider);
+      margin-bottom: var(--cg-spacing-12);
+      overflow: hidden;
+      display: flex;
+    }
+    .progress-pass {
+      background: var(--cg-color-status-success-text-default);
+      height: 100%;
+      transition: width var(--cg-transition-duration-slow) var(--cg-transition-easing-ease-out);
+    }
+    .progress-fail {
+      background: var(--cg-color-status-error-text-default);
+      height: 100%;
+      transition: width var(--cg-transition-duration-slow) var(--cg-transition-easing-ease-out);
+    }
+
+    /* ── Filter chips ── */
+    .filter-chips {
+      display: flex;
+      gap: var(--cg-spacing-6);
+      flex-wrap: wrap;
+      margin-bottom: var(--cg-spacing-12);
+    }
+    .filter-chip {
+      display: inline-flex;
+      align-items: center;
+      gap: var(--cg-spacing-4);
+      padding: var(--cg-spacing-2) var(--cg-spacing-8);
+      border-radius: var(--cg-border-radius-full);
+      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
+      background: transparent;
+      color: var(--cg-color-input-text-placeholder);
+      font-size: var(--cg-font-size-xs);
+      font-weight: var(--cg-font-weight-medium);
+      font-family: inherit;
+      cursor: pointer;
+      transition:
+        background-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default),
+        border-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default),
+        color var(--cg-transition-duration-fast) var(--cg-transition-easing-default);
+    }
+    .filter-chip:hover {
+      border-color: var(--cg-color-surface-cards-border-strong);
+      color: var(--cg-color-surface-base-text);
+    }
+    .filter-chip:focus-visible {
+      outline: none;
+      box-shadow: 0 0 0 3px var(--cg-overlay-accent-strong);
+    }
+    .filter-chip.active {
+      background: var(--cg-color-surface-cards-emphasis);
+      border-color: var(--cg-color-surface-cards-border-strong);
+      color: var(--cg-color-surface-base-text);
+    }
+    .filter-count {
+      font-variant-numeric: tabular-nums;
+      color: var(--cg-color-input-text-placeholder);
+    }
+    .filter-chip.active .filter-count { color: var(--cg-color-surface-base-text); }
+
+    /* ── Test list ──
+       Items render as a single grouped table inside the card, divided
+       by hairlines. Per-item border-radius is omitted so every row's
+       hover/focus bg fills consistently corner-to-corner — the previous
+       version rounded only the first row, which made the first hover
+       look different from the rest. The parent <cg-card> handles the
+       outer rounding. */
+    .test-list {
+      display: flex;
+      flex-direction: column;
+    }
+
+    .test-item + .test-item {
+      border-top: var(--cg-border-width-50) solid var(--cg-color-surface-cards-divider);
+    }
+
+    .test-header {
+      display: flex;
+      align-items: center;
+      gap: var(--cg-spacing-12);
+      padding: var(--cg-spacing-12);
+      background: transparent;
+      border: none;
+      color: inherit;
+      width: 100%;
+      font-family: inherit;
+      text-align: left;
+      min-height: var(--cg-spacing-48);
+      cursor: default;
+      transition: background var(--cg-transition-duration-fast) var(--cg-transition-easing-default);
+    }
+    /* Only rows that have details to reveal get the clickable affordance.
+       Running/pending tests have nothing to expand, so they shouldn't
+       suggest interaction. */
+    .test-header.expandable { cursor: pointer; }
+    .test-header.expandable:hover {
+      background: var(--cg-color-action-tertiary-background-hover);
+    }
+    .test-header:focus-visible {
+      outline: none;
+      box-shadow: inset 0 0 0 3px var(--cg-overlay-accent-strong);
+    }
+
+    .status-icon {
+      flex-shrink: 0;
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      width: var(--cg-icon-size-150);
+      height: var(--cg-icon-size-150);
+    }
+    .status-icon svg { width: 100%; height: 100%; }
+    .status-icon.pass    { color: var(--cg-color-status-success-text-default); }
+    .status-icon.fail    { color: var(--cg-color-status-error-text-default); }
+    .status-icon.pending { color: var(--cg-color-surface-container-outlined); }
+
+    /* Subtle pulse on the running spinner host so the row visibly "breathes". */
+    .running-row .status-icon {
+      animation: cg-test-pulse 1.6s var(--cg-transition-easing-ease-in-out) infinite;
+    }
+    @keyframes cg-test-pulse {
+      0%, 100% { opacity: 1; }
+      50%      { opacity: 0.55; }
+    }
+
+    .test-name {
+      flex: 1;
+      min-width: 0;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+
+    .test-meta {
+      flex-shrink: 0;
+      display: inline-flex;
+      align-items: center;
+      gap: var(--cg-spacing-12);
+      font-variant-numeric: tabular-nums;
+    }
+
+    /* ── Expanded details ── */
+    .test-details {
+      padding: var(--cg-spacing-12) var(--cg-spacing-12) var(--cg-spacing-16) var(--cg-spacing-32);
+      border-top: var(--cg-border-width-50) solid var(--cg-color-surface-cards-divider);
+      font-family: var(--cg-font-family-mono);
+      background: var(--cg-color-code-background);
+      animation: cg-test-detail-expand var(--cg-transition-duration-default) var(--cg-transition-easing-ease-out) both;
+    }
+    @keyframes cg-test-detail-expand {
+      from { opacity: 0; transform: translateY(-4px); }
+      to   { opacity: 1; transform: translateY(0); }
+    }
+    .detail-row {
+      display: flex;
+      gap: var(--cg-spacing-12);
+      padding: var(--cg-spacing-4) 0;
+      align-items: flex-start;
+    }
+    .detail-label {
+      min-width: var(--cg-spacing-64);
+      flex-shrink: 0;
+      text-transform: uppercase;
+      letter-spacing: var(--cg-letter-spacing-wide);
+    }
+    .detail-value {
+      flex: 1;
+      word-break: break-word;
+      white-space: pre-wrap;
+    }
+    .detail-expected {
+      color: var(--cg-color-status-success-text-default);
+      border-left: var(--cg-spacing-2) solid var(--cg-color-status-success-text-default);
+      padding-left: var(--cg-spacing-8);
+    }
+    .detail-actual {
+      color: var(--cg-color-status-error-text-default);
+      border-left: var(--cg-spacing-2) solid var(--cg-color-status-error-text-default);
+      padding-left: var(--cg-spacing-8);
+    }
+
+    .empty {
+      padding: var(--cg-spacing-32);
+      text-align: center;
+      color: var(--cg-color-input-text-placeholder);
+      font-size: var(--cg-font-size-xs);
+    }
+  `];
+d([
+  m({ type: Array })
+], c.prototype, "tests", 2);
+d([
+  m({ type: String })
+], c.prototype, "title", 2);
+d([
+  b()
+], c.prototype, "_expanded", 2);
+d([
+  b()
+], c.prototype, "_filter", 2);
+c = d([
+  w("ai-test-runner")
+], c);
+export {
+  c as AiTestRunner
+};
+//# sourceMappingURL=ai-test-runner.js.map

package/dist/components/ai-test-runner/ai-test-runner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ai-test-runner.js","sources":["../../../src/components/ai-test-runner/ai-test-runner.ts"],"sourcesContent":["/**\n * @element ai-test-runner\n * AI evaluation test results panel built from design-system primitives\n * (cg-card, cg-text, cg-button, cg-spinner). Status icons (pass / fail /\n * running / pending), per-test duration + score, summary bar with combined\n * pass/fail progress, total duration + avg score, status filter chips, and\n * a \"Run All\" CTA. Modeled on the Vitest / Playwright UI mode.\n *\n * @example\n * ```html\n * <ai-test-runner title=\"Eval Suite\" .tests=${[\n *   { name: 'Summarization accuracy', status: 'pass', duration: 340, score: 92 },\n *   { name: 'Hallucination check', status: 'fail', duration: 210,\n *     expected: 'No hallucinations', actual: 'Found 2 claims' }\n * ]}></ai-test-runner>\n * ```\n *\n * @prop {TestEntry[]} tests - Test entries\n * @prop {string} title - Panel header title (default 'Test Results')\n *\n * @fires {CustomEvent<{tests: string[]}>} ai-test-run - \"Run All\" clicked\n * @fires {CustomEvent<{index: number, test: TestEntry}>} ai-test-click - Test row toggled\n */\nimport { LitElement, html, css, nothing, svg } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { hostBlock, reducedMotion, fadeSlideInKeyframes } from '../../styles/index.js';\nimport '../cg-card/cg-card.js';\nimport '../cg-text/cg-text.js';\nimport '../cg-button/cg-button.js';\nimport '../cg-spinner/cg-spinner.js';\n\nexport interface TestEntry {\n  name: string;\n  status: 'pass' | 'fail' | 'running' | 'pending';\n  duration?: number;\n  expected?: string;\n  actual?: string;\n  score?: number;\n}\n\ntype FilterId = 'all' | 'pass' | 'fail' | 'running' | 'pending';\n\n@customElement('ai-test-runner')\nexport class AiTestRunner extends LitElement {\n  static override styles = [hostBlock, reducedMotion, fadeSlideInKeyframes, css`\n    :host {\n      display: block;\n      animation: fadeSlideIn var(--cg-transition-duration-default) var(--cg-transition-easing-default);\n    }\n    :host([hidden]) { display: none; }\n\n    cg-card { display: block; }\n\n    /* ── Header row ── */\n    .header-row {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      gap: var(--cg-spacing-12);\n      width: 100%;\n    }\n\n    /* ── Summary bar ── */\n    .summary-bar {\n      display: flex;\n      flex-wrap: wrap;\n      gap: var(--cg-spacing-16);\n      margin-bottom: var(--cg-spacing-8);\n      align-items: center;\n    }\n    .summary-spacer { flex: 1; }\n    .summary-item {\n      display: inline-flex;\n      align-items: center;\n      gap: var(--cg-spacing-6);\n      font-variant-numeric: tabular-nums;\n    }\n    .dot {\n      width: var(--cg-spacing-8);\n      height: var(--cg-spacing-8);\n      border-radius: var(--cg-border-radius-full);\n    }\n    .dot-pass    { background: var(--cg-color-status-success-text-default); }\n    .dot-fail    { background: var(--cg-color-status-error-text-default); }\n    .dot-running { background: var(--cg-color-status-warning-text-default); }\n    .dot-pending { background: var(--cg-color-surface-container-outlined); }\n\n    /* Combined pass/fail progress bar — track uses divider semantic, not a\n       border-color token. */\n    .progress-bar {\n      height: var(--cg-spacing-6);\n      border-radius: var(--cg-border-radius-full);\n      background: var(--cg-color-surface-cards-divider);\n      margin-bottom: var(--cg-spacing-12);\n      overflow: hidden;\n      display: flex;\n    }\n    .progress-pass {\n      background: var(--cg-color-status-success-text-default);\n      height: 100%;\n      transition: width var(--cg-transition-duration-slow) var(--cg-transition-easing-ease-out);\n    }\n    .progress-fail {\n      background: var(--cg-color-status-error-text-default);\n      height: 100%;\n      transition: width var(--cg-transition-duration-slow) var(--cg-transition-easing-ease-out);\n    }\n\n    /* ── Filter chips ── */\n    .filter-chips {\n      display: flex;\n      gap: var(--cg-spacing-6);\n      flex-wrap: wrap;\n      margin-bottom: var(--cg-spacing-12);\n    }\n    .filter-chip {\n      display: inline-flex;\n      align-items: center;\n      gap: var(--cg-spacing-4);\n      padding: var(--cg-spacing-2) var(--cg-spacing-8);\n      border-radius: var(--cg-border-radius-full);\n      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      background: transparent;\n      color: var(--cg-color-input-text-placeholder);\n      font-size: var(--cg-font-size-xs);\n      font-weight: var(--cg-font-weight-medium);\n      font-family: inherit;\n      cursor: pointer;\n      transition:\n        background-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default),\n        border-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default),\n        color var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n    .filter-chip:hover {\n      border-color: var(--cg-color-surface-cards-border-strong);\n      color: var(--cg-color-surface-base-text);\n    }\n    .filter-chip:focus-visible {\n      outline: none;\n      box-shadow: 0 0 0 3px var(--cg-overlay-accent-strong);\n    }\n    .filter-chip.active {\n      background: var(--cg-color-surface-cards-emphasis);\n      border-color: var(--cg-color-surface-cards-border-strong);\n      color: var(--cg-color-surface-base-text);\n    }\n    .filter-count {\n      font-variant-numeric: tabular-nums;\n      color: var(--cg-color-input-text-placeholder);\n    }\n    .filter-chip.active .filter-count { color: var(--cg-color-surface-base-text); }\n\n    /* ── Test list ──\n       Items render as a single grouped table inside the card, divided\n       by hairlines. Per-item border-radius is omitted so every row's\n       hover/focus bg fills consistently corner-to-corner — the previous\n       version rounded only the first row, which made the first hover\n       look different from the rest. The parent <cg-card> handles the\n       outer rounding. */\n    .test-list {\n      display: flex;\n      flex-direction: column;\n    }\n\n    .test-item + .test-item {\n      border-top: var(--cg-border-width-50) solid var(--cg-color-surface-cards-divider);\n    }\n\n    .test-header {\n      display: flex;\n      align-items: center;\n      gap: var(--cg-spacing-12);\n      padding: var(--cg-spacing-12);\n      background: transparent;\n      border: none;\n      color: inherit;\n      width: 100%;\n      font-family: inherit;\n      text-align: left;\n      min-height: var(--cg-spacing-48);\n      cursor: default;\n      transition: background var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n    /* Only rows that have details to reveal get the clickable affordance.\n       Running/pending tests have nothing to expand, so they shouldn't\n       suggest interaction. */\n    .test-header.expandable { cursor: pointer; }\n    .test-header.expandable:hover {\n      background: var(--cg-color-action-tertiary-background-hover);\n    }\n    .test-header:focus-visible {\n      outline: none;\n      box-shadow: inset 0 0 0 3px var(--cg-overlay-accent-strong);\n    }\n\n    .status-icon {\n      flex-shrink: 0;\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      width: var(--cg-icon-size-150);\n      height: var(--cg-icon-size-150);\n    }\n    .status-icon svg { width: 100%; height: 100%; }\n    .status-icon.pass    { color: var(--cg-color-status-success-text-default); }\n    .status-icon.fail    { color: var(--cg-color-status-error-text-default); }\n    .status-icon.pending { color: var(--cg-color-surface-container-outlined); }\n\n    /* Subtle pulse on the running spinner host so the row visibly \"breathes\". */\n    .running-row .status-icon {\n      animation: cg-test-pulse 1.6s var(--cg-transition-easing-ease-in-out) infinite;\n    }\n    @keyframes cg-test-pulse {\n      0%, 100% { opacity: 1; }\n      50%      { opacity: 0.55; }\n    }\n\n    .test-name {\n      flex: 1;\n      min-width: 0;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n\n    .test-meta {\n      flex-shrink: 0;\n      display: inline-flex;\n      align-items: center;\n      gap: var(--cg-spacing-12);\n      font-variant-numeric: tabular-nums;\n    }\n\n    /* ── Expanded details ── */\n    .test-details {\n      padding: var(--cg-spacing-12) var(--cg-spacing-12) var(--cg-spacing-16) var(--cg-spacing-32);\n      border-top: var(--cg-border-width-50) solid var(--cg-color-surface-cards-divider);\n      font-family: var(--cg-font-family-mono);\n      background: var(--cg-color-code-background);\n      animation: cg-test-detail-expand var(--cg-transition-duration-default) var(--cg-transition-easing-ease-out) both;\n    }\n    @keyframes cg-test-detail-expand {\n      from { opacity: 0; transform: translateY(-4px); }\n      to   { opacity: 1; transform: translateY(0); }\n    }\n    .detail-row {\n      display: flex;\n      gap: var(--cg-spacing-12);\n      padding: var(--cg-spacing-4) 0;\n      align-items: flex-start;\n    }\n    .detail-label {\n      min-width: var(--cg-spacing-64);\n      flex-shrink: 0;\n      text-transform: uppercase;\n      letter-spacing: var(--cg-letter-spacing-wide);\n    }\n    .detail-value {\n      flex: 1;\n      word-break: break-word;\n      white-space: pre-wrap;\n    }\n    .detail-expected {\n      color: var(--cg-color-status-success-text-default);\n      border-left: var(--cg-spacing-2) solid var(--cg-color-status-success-text-default);\n      padding-left: var(--cg-spacing-8);\n    }\n    .detail-actual {\n      color: var(--cg-color-status-error-text-default);\n      border-left: var(--cg-spacing-2) solid var(--cg-color-status-error-text-default);\n      padding-left: var(--cg-spacing-8);\n    }\n\n    .empty {\n      padding: var(--cg-spacing-32);\n      text-align: center;\n      color: var(--cg-color-input-text-placeholder);\n      font-size: var(--cg-font-size-xs);\n    }\n  `];\n\n  @property({ type: Array }) tests: TestEntry[] = [];\n  @property({ type: String }) override title = 'Test Results';\n\n  @state() private _expanded = new Set<number>();\n  @state() private _filter: FilterId = 'all';\n\n  // ─── Derived counts ─────────────────────────────────────────────────────\n\n  private _countByStatus(status: TestEntry['status']): number {\n    return this.tests.filter(t => t.status === status).length;\n  }\n  private get _passCount() { return this._countByStatus('pass'); }\n  private get _failCount() { return this._countByStatus('fail'); }\n  private get _runningCount() { return this._countByStatus('running'); }\n  private get _pendingCount() { return this._countByStatus('pending'); }\n\n  /** Sum of test.duration (skipping undefined). */\n  private get _totalDuration(): number {\n    return this.tests.reduce((acc, t) => acc + (t.duration ?? 0), 0);\n  }\n\n  /** Average of defined `score` values; null if no scores present. */\n  private get _avgScore(): number | null {\n    const scored = this.tests.filter(t => typeof t.score === 'number');\n    if (!scored.length) return null;\n    const sum = scored.reduce((acc, t) => acc + (t.score ?? 0), 0);\n    return Math.round(sum / scored.length);\n  }\n\n  private _formatDuration(ms: number): string {\n    if (ms < 1000) return `${Math.round(ms)} ms`;\n    if (ms < 60_000) return `${(ms / 1000).toFixed(1)} s`;\n    const m = Math.floor(ms / 60_000);\n    const s = Math.round((ms % 60_000) / 1000);\n    return `${m}m ${s}s`;\n  }\n\n  private get _visibleTests(): Array<{ test: TestEntry; index: number }> {\n    return this.tests\n      .map((test, index) => ({ test, index }))\n      .filter(({ test }) => this._filter === 'all' || test.status === this._filter);\n  }\n\n  // ─── Handlers ───────────────────────────────────────────────────────────\n\n  private _toggle(idx: number): void {\n    const next = new Set(this._expanded);\n    if (next.has(idx)) next.delete(idx); else next.add(idx);\n    this._expanded = next;\n    this.dispatchEvent(new CustomEvent('ai-test-click', {\n      bubbles: true, composed: true,\n      detail: { index: idx, test: this.tests[idx] },\n    }));\n  }\n\n  private _runAll(): void {\n    this.dispatchEvent(new CustomEvent('ai-test-run', {\n      bubbles: true, composed: true,\n      detail: { tests: this.tests.map(t => t.name) },\n    }));\n  }\n\n  // ─── Renderers ──────────────────────────────────────────────────────────\n\n  private _statusIcon(status: TestEntry['status']) {\n    if (status === 'pass') {\n      return html`<span class=\"status-icon pass\" aria-label=\"Passed\">${svg`<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg>`}</span>`;\n    }\n    if (status === 'fail') {\n      return html`<span class=\"status-icon fail\" aria-label=\"Failed\">${svg`<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\"><path d=\"M18 6L6 18M6 6l12 12\"/></svg>`}</span>`;\n    }\n    if (status === 'running') {\n      return html`<span class=\"status-icon running\" aria-label=\"Running\"><cg-spinner size=\"sm\"></cg-spinner></span>`;\n    }\n    return html`<span class=\"status-icon pending\" aria-label=\"Pending\">${svg`<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><circle cx=\"12\" cy=\"12\" r=\"9\"/></svg>`}</span>`;\n  }\n\n  override render() {\n    const total = this.tests.length || 1;\n    const passP = (this._passCount / total) * 100;\n    const failP = (this._failCount / total) * 100;\n    const totalDur = this._totalDuration;\n    const avgScore = this._avgScore;\n    const visible = this._visibleTests;\n\n    const allFilters: Array<{ id: FilterId; label: string; count: number }> = [\n      { id: 'all',     label: 'All',     count: this.tests.length },\n      { id: 'pass',    label: 'Passed',  count: this._passCount },\n      { id: 'fail',    label: 'Failed',  count: this._failCount },\n      { id: 'running', label: 'Running', count: this._runningCount },\n      { id: 'pending', label: 'Pending', count: this._pendingCount },\n    ];\n    const FILTERS = allFilters.filter(f => f.id === 'all' || f.count > 0);\n\n    return html`\n      <cg-card variant=\"elevated\" padding=\"md\" rounded=\"lg\">\n        <div slot=\"header\" class=\"header-row\">\n          <cg-text as=\"h3\" size=\"sm\" weight=\"semibold\">${this.title}</cg-text>\n          <cg-button variant=\"primary\" size=\"sm\" @click=${this._runAll} aria-label=\"Run all tests\">\n            Run all\n          </cg-button>\n        </div>\n\n        <div class=\"summary-bar\" role=\"status\" aria-label=\"Test summary\">\n          <span class=\"summary-item\">\n            <span class=\"dot dot-pass\" aria-hidden=\"true\"></span>\n            <cg-text size=\"xs\" color=\"muted\">${this._passCount} passed</cg-text>\n          </span>\n          <span class=\"summary-item\">\n            <span class=\"dot dot-fail\" aria-hidden=\"true\"></span>\n            <cg-text size=\"xs\" color=\"muted\">${this._failCount} failed</cg-text>\n          </span>\n          ${this._runningCount ? html`\n            <span class=\"summary-item\">\n              <span class=\"dot dot-running\" aria-hidden=\"true\"></span>\n              <cg-text size=\"xs\" color=\"muted\">${this._runningCount} running</cg-text>\n            </span>\n          ` : nothing}\n          ${this._pendingCount ? html`\n            <span class=\"summary-item\">\n              <span class=\"dot dot-pending\" aria-hidden=\"true\"></span>\n              <cg-text size=\"xs\" color=\"muted\">${this._pendingCount} pending</cg-text>\n            </span>\n          ` : nothing}\n          <span class=\"summary-spacer\"></span>\n          ${avgScore != null ? html`\n            <span class=\"summary-item\">\n              <cg-text size=\"xs\" color=\"muted\">Avg score:</cg-text>\n              <cg-text size=\"xs\" weight=\"semibold\">${avgScore}%</cg-text>\n            </span>\n          ` : nothing}\n          ${totalDur > 0 ? html`\n            <span class=\"summary-item\">\n              <cg-text size=\"xs\" color=\"muted\">${this._formatDuration(totalDur)}</cg-text>\n            </span>\n          ` : nothing}\n        </div>\n\n        <div class=\"progress-bar\" aria-hidden=\"true\">\n          <div class=\"progress-pass\" style=\"width:${passP}%\"></div>\n          <div class=\"progress-fail\" style=\"width:${failP}%\"></div>\n        </div>\n\n        ${this.tests.length > 1 && FILTERS.length > 1 ? html`\n          <div class=\"filter-chips\">\n            ${FILTERS.map(f => html`\n              <button\n                class=\"filter-chip ${this._filter === f.id ? 'active' : ''}\"\n                type=\"button\"\n                @click=${() => { this._filter = f.id; }}\n                aria-pressed=${this._filter === f.id ? 'true' : 'false'}\n              >\n                <span>${f.label}</span>\n                <span class=\"filter-count\">${f.count}</span>\n              </button>\n            `)}\n          </div>\n        ` : nothing}\n\n        <div class=\"test-list\" role=\"list\" aria-label=\"Tests\">\n          ${visible.length === 0 ? html`\n            <div class=\"empty\">No tests match the current filter.</div>\n          ` : visible.map(({ test, index }) => {\n            const expandable = !!(test.expected || test.actual);\n            const expanded = this._expanded.has(index);\n            return html`\n              <div class=\"test-item ${test.status === 'running' ? 'running-row' : ''}\" role=\"listitem\">\n                <button\n                  class=\"test-header ${expandable ? 'expandable' : ''}\"\n                  type=\"button\"\n                  @click=${() => { if (expandable) this._toggle(index); }}\n                  aria-expanded=${expandable ? (expanded ? 'true' : 'false') : nothing}\n                >\n                  ${this._statusIcon(test.status)}\n                  <cg-text class=\"test-name\" size=\"sm\">${test.name}</cg-text>\n                  <div class=\"test-meta\">\n                    ${test.score != null ? html`<cg-text size=\"xs\" weight=\"semibold\">${test.score}%</cg-text>` : nothing}\n                    ${test.duration != null ? html`<cg-text size=\"xs\" color=\"muted\">${this._formatDuration(test.duration)}</cg-text>` : nothing}\n                  </div>\n                </button>\n                ${expanded && expandable ? html`\n                  <div class=\"test-details\">\n                    ${test.expected ? html`\n                      <div class=\"detail-row\">\n                        <cg-text class=\"detail-label\" size=\"xs\" color=\"muted\">Expected</cg-text>\n                        <span class=\"detail-value detail-expected\">${test.expected}</span>\n                      </div>\n                    ` : nothing}\n                    ${test.actual ? html`\n                      <div class=\"detail-row\">\n                        <cg-text class=\"detail-label\" size=\"xs\" color=\"muted\">Actual</cg-text>\n                        <span class=\"detail-value detail-actual\">${test.actual}</span>\n                      </div>\n                    ` : nothing}\n                  </div>\n                ` : nothing}\n              </div>\n            `;\n          })}\n        </div>\n      </cg-card>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ai-test-runner': AiTestRunner;\n  }\n}\n"],"names":["AiTestRunner","LitElement","status","t","acc","scored","sum","ms","m","s","test","index","idx","next","html","svg","total","passP","failP","totalDur","avgScore","visible","FILTERS","f","nothing","expandable","expanded","hostBlock","reducedMotion","fadeSlideInKeyframes","css","__decorateClass","property","state","customElement"],"mappings":"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"}

package/dist/components/ai-thinking/ai-thinking.d.ts

@@ -0,0 +1,33 @@
+import { LitElement, nothing } from 'lit';
+interface ToolCall {
+    name: string;
+    status: 'loading' | 'complete' | 'error';
+    result?: string;
+}
+export declare class AiThinking extends LitElement {
+    static styles: import('lit').CSSResult[];
+    text: string;
+    variant: 'dots' | 'spinner' | 'skeleton' | 'shimmer';
+    size: 'sm' | 'md' | 'lg';
+    shimmer: boolean;
+    stages: string[];
+    cancelable: boolean;
+    tools: ToolCall[];
+    progress: number;
+    delay: number;
+    private _visible;
+    private _stageIndex;
+    private _delayTimer?;
+    private _stageTimer?;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    updated(changed: Map<string, unknown>): void;
+    private _startStages;
+    private _handleCancel;
+    private get _displayText();
+    private _humanizeTool;
+    private _renderToolIcon;
+    render(): import('lit').TemplateResult<1> | typeof nothing;
+}
+export {};
+//# sourceMappingURL=ai-thinking.d.ts.map

package/dist/components/ai-thinking/ai-thinking.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ai-thinking.d.ts","sourceRoot":"","sources":["../../../src/components/ai-thinking/ai-thinking.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,EAAE,UAAU,EAAa,OAAO,EAAE,MAAM,KAAK,CAAC;AAIrD,UAAU,QAAQ;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,SAAS,GAAG,UAAU,GAAG,OAAO,CAAC;IACzC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,qBACa,UAAW,SAAQ,UAAU;IACxC,OAAgB,MAAM,4BAiOnB;IAEyB,IAAI,SAAc;IACH,OAAO,EAAE,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,SAAS,CAAU;IAC9D,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAC9C,OAAO,UAAS;IAClB,MAAM,EAAE,MAAM,EAAE,CAAM;IACpB,UAAU,UAAS;IACrB,KAAK,EAAE,QAAQ,EAAE,CAAM;IACtB,QAAQ,SAAM;IACd,KAAK,SAAO;IAE/B,OAAO,CAAC,QAAQ,CAAS;IACzB,OAAO,CAAC,WAAW,CAAK;IACjC,OAAO,CAAC,WAAW,CAAC,CAAgC;IACpD,OAAO,CAAC,WAAW,CAAC,CAAiC;IAE5C,iBAAiB;IAWjB,oBAAoB;IAMpB,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAO9C,OAAO,CAAC,YAAY;IAapB,OAAO,CAAC,aAAa;IAIrB,OAAO,KAAK,YAAY,GAGvB;IAED,OAAO,CAAC,aAAa;IAYrB,OAAO,CAAC,eAAe;IAMd,MAAM;CAuDhB"}