@cognivo/components 0.8.0

package/dist/components/ai-data-table/ai-data-table.js

@@ -0,0 +1,388 @@
+import { css as f, LitElement as _, nothing as g, html as l } from "lit";
+import { property as n, state as b, query as w, customElement as k } from "lit/decorators.js";
+import { repeat as y } from "lit/directives/repeat.js";
+import { styleMap as m } from "lit/directives/style-map.js";
+import { h as $, r as x } from "../../chunks/premium.css-9I4kHrsl.js";
+var z = Object.defineProperty, M = Object.getOwnPropertyDescriptor, i = (t, e, r, o) => {
+  for (var s = o > 1 ? void 0 : o ? M(e, r) : e, c = t.length - 1, d; c >= 0; c--)
+    (d = t[c]) && (s = (o ? d(e, r, s) : d(s)) || s);
+  return o && s && z(e, r, s), s;
+};
+let a = class extends _ {
+  constructor() {
+    super(...arguments), this.rounded = "lg", this.columns = [], this.data = [], this.anomalies = [], this.sortable = !1, this.striped = !1, this.compact = !1, this.rowIdKey = "id", this.virtualize = !1, this.rowHeight = 48, this.overscan = 5, this._sortKey = "", this._sortDir = "asc", this._hoveredAnomaly = null, this._scrollTop = 0, this._viewportHeight = 0, this._resizeObserver = null, this._onScroll = () => {
+      this._scrollEl && (this._scrollTop = this._scrollEl.scrollTop);
+    }, this._sortedCache = null, this._anomalyMap = null, this._anomalyMapSource = null;
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this._scrollEl?.removeEventListener("scroll", this._onScroll), this._resizeObserver?.disconnect(), this._resizeObserver = null;
+  }
+  firstUpdated() {
+    this._wireVirtualization();
+  }
+  updated(t) {
+    t.has("virtualize") && this._wireVirtualization();
+  }
+  _wireVirtualization() {
+    if (!this.virtualize) {
+      this._scrollEl?.removeEventListener("scroll", this._onScroll), this._resizeObserver?.disconnect(), this._resizeObserver = null;
+      return;
+    }
+    const t = this._scrollEl;
+    t && (t.addEventListener("scroll", this._onScroll, { passive: !0 }), this._viewportHeight = t.clientHeight, this._scrollTop = t.scrollTop, typeof ResizeObserver < "u" && (this._resizeObserver?.disconnect(), this._resizeObserver = new ResizeObserver(() => {
+      this._scrollEl && (this._viewportHeight = this._scrollEl.clientHeight);
+    }), this._resizeObserver.observe(t)));
+  }
+  _getAnomaly(t, e) {
+    if (this._anomalyMapSource !== this.anomalies || !this._anomalyMap) {
+      this._anomalyMap = /* @__PURE__ */ new Map();
+      for (const r of this.anomalies) this._anomalyMap.set(`${r.row}::${r.col}`, r);
+      this._anomalyMapSource = this.anomalies;
+    }
+    return this._anomalyMap.get(`${t}::${e}`);
+  }
+  _handleSort(t) {
+    this.sortable && (this._sortKey === t ? this._sortDir = this._sortDir === "asc" ? "desc" : "asc" : (this._sortKey = t, this._sortDir = "asc"), this.dispatchEvent(new CustomEvent("ai-data-sort", {
+      detail: { key: this._sortKey, direction: this._sortDir },
+      bubbles: !0,
+      composed: !0
+    })));
+  }
+  _handleCellClick(t, e, r) {
+    this.dispatchEvent(new CustomEvent("ai-data-cell-click", {
+      detail: { row: t, col: e, value: r },
+      bubbles: !0,
+      composed: !0
+    }));
+  }
+  _handleAnomalyClick(t) {
+    this.dispatchEvent(new CustomEvent("ai-data-anomaly-click", {
+      detail: t,
+      bubbles: !0,
+      composed: !0
+    }));
+  }
+  get _sortedData() {
+    if (!this._sortKey) return this.data;
+    const t = this._sortedCache;
+    if (t && t.source === this.data && t.key === this._sortKey && t.dir === this._sortDir)
+      return t.data;
+    const e = this._sortKey, r = this._sortDir === "desc" ? -1 : 1, o = [...this.data].sort((s, c) => {
+      const d = s[e], h = c[e];
+      return d == null && h == null ? 0 : d == null ? 1 * r : h == null ? -1 * r : typeof d == "number" && typeof h == "number" ? (d - h) * r : String(d).localeCompare(String(h)) * r;
+    });
+    return this._sortedCache = { data: o, key: e, dir: this._sortDir, source: this.data }, o;
+  }
+  _rowKey(t, e) {
+    const r = t[this.rowIdKey];
+    return r != null && (typeof r == "string" || typeof r == "number") ? r : e;
+  }
+  _renderRow(t, e) {
+    return l`
+      <tr role="row">
+        ${this.columns.map((r) => {
+      const o = this._getAnomaly(e, r.key), s = o ? `anomaly-${o.severity}` : "", c = `${e}-${r.key}`;
+      return l`
+            <td
+              class="clickable ${s}"
+              data-align=${r.align || "left"}
+              role="cell"
+              aria-label=${o ? `Anomaly: ${o.reason}` : g}
+              @click=${() => {
+        this._handleCellClick(e, r.key, t[r.key]), o && this._handleAnomalyClick(o);
+      }}
+              @mouseenter=${() => {
+        o && (this._hoveredAnomaly = c);
+      }}
+              @mouseleave=${() => {
+        this._hoveredAnomaly = null;
+      }}
+            >
+              ${typeof t[r.key] == "object" ? JSON.stringify(t[r.key]) : String(t[r.key] ?? "")}
+              ${o ? l`<span class="anomaly-icon" title="${o.reason}" aria-hidden="true"><svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M12 9v4m0 4h.01M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z"/></svg></span>` : g}
+              ${o && this._hoveredAnomaly === c ? l`<span class="tooltip" role="tooltip">${o.reason}</span>` : g}
+            </td>
+          `;
+    })}
+      </tr>
+    `;
+  }
+  _renderRows() {
+    const t = this._sortedData;
+    if (!this.virtualize)
+      return y(
+        t,
+        (p, u) => this._rowKey(p, u),
+        (p, u) => this._renderRow(p, u)
+      );
+    const e = Math.max(1, this.rowHeight), r = this._viewportHeight > 0 ? this._viewportHeight : e * 10, o = Math.max(0, Math.floor(this._scrollTop / e) - this.overscan), s = Math.min(t.length, Math.ceil((this._scrollTop + r) / e) + this.overscan), c = t.slice(o, s), d = o * e, h = Math.max(0, (t.length - s) * e), v = this.columns.length;
+    return l`
+      ${d > 0 ? l`<tr class="virtual-spacer" aria-hidden="true"><td colspan=${v} style=${m({ height: `${d}px` })}></td></tr>` : g}
+      ${y(
+      c,
+      (p, u) => this._rowKey(p, o + u),
+      (p, u) => this._renderRow(p, o + u)
+    )}
+      ${h > 0 ? l`<tr class="virtual-spacer" aria-hidden="true"><td colspan=${v} style=${m({ height: `${h}px` })}></td></tr>` : g}
+    `;
+  }
+  render() {
+    return this.columns.length ? l`
+      <div class="wrapper">
+        <div class="table-scroll">
+          <table role="table" aria-label="Data table">
+            <thead>
+              <tr role="row">
+                ${this.columns.map((t) => {
+      const e = this._sortKey === t.key;
+      return l`
+                    <th
+                      class="${this.sortable ? "sortable" : ""} ${e ? "sorted" : ""}"
+                      data-align=${t.align || "left"}
+                      role="columnheader"
+                      tabindex=${this.sortable ? "0" : "-1"}
+                      aria-sort=${e ? this._sortDir === "asc" ? "ascending" : "descending" : "none"}
+                      @click=${() => this._handleSort(t.key)}
+                      @keydown=${(r) => {
+        (r.key === "Enter" || r.key === " ") && (r.preventDefault(), this._handleSort(t.key));
+      }}
+                    >
+                      ${t.label}
+                      ${this.sortable ? l`
+                        <span class="sort-icon">
+                          <svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round">
+                            ${e && this._sortDir === "desc" ? l`<path d="M12 5v14m-7-7l7 7 7-7"/>` : l`<path d="M12 19V5m-7 7l7-7 7 7"/>`}
+                          </svg>
+                        </span>
+                      ` : g}
+                    </th>
+                  `;
+    })}
+              </tr>
+            </thead>
+            <tbody>
+              ${this._renderRows()}
+            </tbody>
+          </table>
+        </div>
+        ${this.data.length ? g : l`<div class="empty-state">No data available</div>`}
+      </div>
+    ` : l`<div class="wrapper"><div class="empty-state">No columns defined</div></div>`;
+  }
+};
+a.styles = [$, x, f`
+    :host([hidden]) { display: none; }
+
+    /* ── Wrapper — matches cg-table ── */
+    .wrapper {
+      overflow: hidden;
+      background: var(--cg-color-surface-container-background);
+      border: var(--cg-border-width-50) solid var(--cg-color-surface-table-divider);
+      border-radius: var(--cg-component-table-radius);
+      padding: var(--cg-spacing-4) 0;
+    }
+
+    .table-scroll { overflow-x: auto; }
+
+    /* ── Virtualized scroll container ── */
+    :host([virtualize]) .table-scroll {
+      overflow-y: auto;
+      max-height: var(--cg-component-table-virtual-max-height);
+    }
+    :host([virtualize]) table { table-layout: fixed; }
+    .virtual-spacer td { padding: 0; border: none; background: transparent; }
+
+    table {
+      width: calc(100% - var(--cg-spacing-8) * 2);
+      margin: 0 var(--cg-spacing-8);
+      border-collapse: separate;
+      border-spacing: 0;
+      font-size: var(--cg-font-size-sm);
+    }
+    :host([compact]) table { font-size: var(--cg-font-size-xs); }
+
+    /* ── Header — matches cg-table: transparent, medium weight, muted ── */
+    thead { position: sticky; top: 0; z-index: 1; }
+
+    th {
+      padding: var(--cg-spacing-12) var(--cg-spacing-16);
+      text-align: left;
+      font-weight: var(--cg-font-weight-medium);
+      font-size: var(--cg-font-size-xs);
+      color: var(--cg-color-surface-container-outlined);
+      background: transparent;
+      border-bottom: none;
+      white-space: nowrap;
+      user-select: none;
+    }
+    :host([compact]) th { padding: var(--cg-spacing-6) var(--cg-spacing-12); }
+    th[data-align="center"] { text-align: center; }
+    th[data-align="right"] { text-align: right; }
+
+    th.sortable { cursor: pointer; }
+    th.sortable:hover { color: var(--cg-color-action-primary-background-default); }
+    th.sortable:focus-visible {
+      outline: none;
+      box-shadow: inset 0 0 0 var(--cg-border-width-100) var(--cg-color-action-primary-background-default);
+    }
+
+    .sort-icon {
+      display: inline-flex;
+      margin-left: var(--cg-spacing-4);
+      opacity: 0.4;
+      vertical-align: middle;
+    }
+    th.sorted .sort-icon {
+      opacity: 1;
+      color: var(--cg-color-action-primary-background-default);
+    }
+
+    /* ── Body — inset with inner rounding (matches cg-table) ── */
+    tbody { background: var(--cg-overlay-dark-subtle); }
+    tbody tr:first-child td { border-top: var(--cg-border-width-50) solid var(--cg-color-surface-table-divider); }
+    tbody tr:last-child td { border-bottom: var(--cg-border-width-50) solid var(--cg-color-surface-table-divider); }
+    tbody td:first-child { border-left: var(--cg-border-width-50) solid var(--cg-color-surface-table-divider); }
+    tbody td:last-child { border-right: var(--cg-border-width-50) solid var(--cg-color-surface-table-divider); }
+    tbody tr:first-child td:first-child { border-top-left-radius: var(--cg-border-radius-150); }
+    tbody tr:first-child td:last-child { border-top-right-radius: var(--cg-border-radius-150); }
+    tbody tr:last-child td:first-child { border-bottom-left-radius: var(--cg-border-radius-150); }
+    tbody tr:last-child td:last-child { border-bottom-right-radius: var(--cg-border-radius-150); }
+
+    td {
+      padding: var(--cg-spacing-12) var(--cg-spacing-16);
+      color: var(--cg-color-surface-table-text);
+      border-bottom: var(--cg-border-width-50) solid var(--cg-color-surface-table-divider);
+      vertical-align: middle;
+      position: relative;
+    }
+    :host([compact]) td { padding: var(--cg-spacing-6) var(--cg-spacing-12); }
+    td[data-align="center"] { text-align: center; }
+    td[data-align="right"] { text-align: right; }
+    td.clickable { cursor: pointer; }
+
+    /* Row states */
+    tbody tr { transition: background-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default); }
+    tbody tr:hover td { background: var(--cg-color-action-tertiary-background-hover); }
+
+    /* Striped */
+    :host([striped]) tbody tr:nth-child(even) td {
+      background: var(--cg-color-action-tertiary-background-hover);
+    }
+
+    /* ── Anomaly cells — left accent border ── */
+    .anomaly-high {
+      border-left: var(--cg-border-width-300) solid var(--cg-color-status-error-text-default);
+    }
+    .anomaly-medium {
+      border-left: var(--cg-border-width-300) solid var(--cg-color-status-warning-text-default);
+    }
+    .anomaly-low {
+      border-left: var(--cg-border-width-300) solid var(--cg-color-status-info-text-default);
+    }
+
+    .anomaly-icon {
+      display: inline-flex;
+      margin-left: var(--cg-spacing-6);
+      color: var(--cg-color-input-text-placeholder);
+      vertical-align: middle;
+    }
+
+    /* Tooltip */
+    .tooltip {
+      position: absolute;
+      bottom: calc(100% + var(--cg-spacing-4));
+      left: 50%;
+      transform: translateX(-50%);
+      background: var(--cg-color-surface-base-background);
+      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
+      color: var(--cg-color-surface-base-text);
+      font-size: var(--cg-font-size-xs);
+      padding: var(--cg-spacing-6) var(--cg-spacing-8);
+      border-radius: var(--cg-border-radius-100);
+      white-space: nowrap;
+      pointer-events: none;
+      z-index: 10;
+      box-shadow: var(--cg-elevation-2);
+    }
+
+    .empty-state {
+      padding: var(--cg-spacing-24);
+      text-align: center;
+      color: var(--cg-color-input-text-placeholder);
+      font-size: var(--cg-font-size-sm);
+    }
+
+    /* ── Rounded variants — matches cg-table ── */
+    :host([rounded="none"]) .wrapper { border-radius: 0; }
+    :host([rounded="none"]) tbody tr:first-child td:first-child,
+    :host([rounded="none"]) tbody tr:first-child td:last-child,
+    :host([rounded="none"]) tbody tr:last-child td:first-child,
+    :host([rounded="none"]) tbody tr:last-child td:last-child { border-radius: 0; }
+
+    :host([rounded="sm"]) .wrapper { border-radius: var(--cg-border-radius-100); }
+    :host([rounded="sm"]) tbody tr:first-child td:first-child { border-top-left-radius: var(--cg-border-radius-50); }
+    :host([rounded="sm"]) tbody tr:first-child td:last-child { border-top-right-radius: var(--cg-border-radius-50); }
+    :host([rounded="sm"]) tbody tr:last-child td:first-child { border-bottom-left-radius: var(--cg-border-radius-50); }
+    :host([rounded="sm"]) tbody tr:last-child td:last-child { border-bottom-right-radius: var(--cg-border-radius-50); }
+
+    :host([rounded="md"]) .wrapper { border-radius: var(--cg-border-radius-150); }
+    :host([rounded="lg"]) .wrapper { border-radius: var(--cg-component-table-radius); }
+  `];
+i([
+  n({ reflect: !0 })
+], a.prototype, "rounded", 2);
+i([
+  n({ type: Array })
+], a.prototype, "columns", 2);
+i([
+  n({ type: Array })
+], a.prototype, "data", 2);
+i([
+  n({ type: Array })
+], a.prototype, "anomalies", 2);
+i([
+  n({ type: Boolean, reflect: !0 })
+], a.prototype, "sortable", 2);
+i([
+  n({ type: Boolean, reflect: !0 })
+], a.prototype, "striped", 2);
+i([
+  n({ type: Boolean, reflect: !0 })
+], a.prototype, "compact", 2);
+i([
+  n({ type: String })
+], a.prototype, "rowIdKey", 2);
+i([
+  n({ type: Boolean, reflect: !0 })
+], a.prototype, "virtualize", 2);
+i([
+  n({ type: Number })
+], a.prototype, "rowHeight", 2);
+i([
+  n({ type: Number })
+], a.prototype, "overscan", 2);
+i([
+  b()
+], a.prototype, "_sortKey", 2);
+i([
+  b()
+], a.prototype, "_sortDir", 2);
+i([
+  b()
+], a.prototype, "_hoveredAnomaly", 2);
+i([
+  b()
+], a.prototype, "_scrollTop", 2);
+i([
+  b()
+], a.prototype, "_viewportHeight", 2);
+i([
+  w(".table-scroll")
+], a.prototype, "_scrollEl", 2);
+a = i([
+  k("ai-data-table")
+], a);
+export {
+  a as AiDataTable
+};
+//# sourceMappingURL=ai-data-table.js.map

package/dist/components/ai-data-table/ai-data-table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ai-data-table.js","sources":["../../../src/components/ai-data-table/ai-data-table.ts"],"sourcesContent":["/**\n * @element ai-data-table\n * Data table with sortable columns, AI-detected anomaly highlighting, striped rows, and compact mode.\n * Aligned with cg-table patterns — same header style, spacing, row hover, focus rings.\n * Adds: anomaly left-border + tooltip, sort arrows, cell click events.\n *\n * @example\n * ```html\n * <ai-data-table\n *   .columns=${[{key:'name', label:'Name'}, {key:'score', label:'Score', type:'number'}]}\n *   .data=${[{name:'Alice', score:92}, {name:'Bob', score:12}]}\n *   .anomalies=${[{row:1, col:'score', severity:'high', reason:'Unusually low'}]}\n *   sortable striped\n * ></ai-data-table>\n * ```\n *\n * @fires {CustomEvent<{key, direction}>} ai-data-sort - Column sorted\n * @fires {CustomEvent<{row, col, value}>} ai-data-cell-click - Cell clicked\n * @fires {CustomEvent<{row, col, severity, reason}>} ai-data-anomaly-click - Anomaly clicked\n */\nimport { LitElement, html, css, nothing } from 'lit';\nimport { property, state, customElement, query } from 'lit/decorators.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { hostBlock, reducedMotion } from '../../styles/index.js';\n\ninterface Column {\n  key: string;\n  label: string;\n  type?: string;\n  align?: 'left' | 'center' | 'right';\n}\n\ninterface Anomaly {\n  row: number;\n  col: string;\n  severity: 'high' | 'medium' | 'low';\n  reason: string;\n}\n\n@customElement('ai-data-table')\nexport class AiDataTable extends LitElement {\n  static override styles = [hostBlock, reducedMotion, css`\n    :host([hidden]) { display: none; }\n\n    /* ── Wrapper — matches cg-table ── */\n    .wrapper {\n      overflow: hidden;\n      background: var(--cg-color-surface-container-background);\n      border: var(--cg-border-width-50) solid var(--cg-color-surface-table-divider);\n      border-radius: var(--cg-component-table-radius);\n      padding: var(--cg-spacing-4) 0;\n    }\n\n    .table-scroll { overflow-x: auto; }\n\n    /* ── Virtualized scroll container ── */\n    :host([virtualize]) .table-scroll {\n      overflow-y: auto;\n      max-height: var(--cg-component-table-virtual-max-height);\n    }\n    :host([virtualize]) table { table-layout: fixed; }\n    .virtual-spacer td { padding: 0; border: none; background: transparent; }\n\n    table {\n      width: calc(100% - var(--cg-spacing-8) * 2);\n      margin: 0 var(--cg-spacing-8);\n      border-collapse: separate;\n      border-spacing: 0;\n      font-size: var(--cg-font-size-sm);\n    }\n    :host([compact]) table { font-size: var(--cg-font-size-xs); }\n\n    /* ── Header — matches cg-table: transparent, medium weight, muted ── */\n    thead { position: sticky; top: 0; z-index: 1; }\n\n    th {\n      padding: var(--cg-spacing-12) var(--cg-spacing-16);\n      text-align: left;\n      font-weight: var(--cg-font-weight-medium);\n      font-size: var(--cg-font-size-xs);\n      color: var(--cg-color-surface-container-outlined);\n      background: transparent;\n      border-bottom: none;\n      white-space: nowrap;\n      user-select: none;\n    }\n    :host([compact]) th { padding: var(--cg-spacing-6) var(--cg-spacing-12); }\n    th[data-align=\"center\"] { text-align: center; }\n    th[data-align=\"right\"] { text-align: right; }\n\n    th.sortable { cursor: pointer; }\n    th.sortable:hover { color: var(--cg-color-action-primary-background-default); }\n    th.sortable:focus-visible {\n      outline: none;\n      box-shadow: inset 0 0 0 var(--cg-border-width-100) var(--cg-color-action-primary-background-default);\n    }\n\n    .sort-icon {\n      display: inline-flex;\n      margin-left: var(--cg-spacing-4);\n      opacity: 0.4;\n      vertical-align: middle;\n    }\n    th.sorted .sort-icon {\n      opacity: 1;\n      color: var(--cg-color-action-primary-background-default);\n    }\n\n    /* ── Body — inset with inner rounding (matches cg-table) ── */\n    tbody { background: var(--cg-overlay-dark-subtle); }\n    tbody tr:first-child td { border-top: var(--cg-border-width-50) solid var(--cg-color-surface-table-divider); }\n    tbody tr:last-child td { border-bottom: var(--cg-border-width-50) solid var(--cg-color-surface-table-divider); }\n    tbody td:first-child { border-left: var(--cg-border-width-50) solid var(--cg-color-surface-table-divider); }\n    tbody td:last-child { border-right: var(--cg-border-width-50) solid var(--cg-color-surface-table-divider); }\n    tbody tr:first-child td:first-child { border-top-left-radius: var(--cg-border-radius-150); }\n    tbody tr:first-child td:last-child { border-top-right-radius: var(--cg-border-radius-150); }\n    tbody tr:last-child td:first-child { border-bottom-left-radius: var(--cg-border-radius-150); }\n    tbody tr:last-child td:last-child { border-bottom-right-radius: var(--cg-border-radius-150); }\n\n    td {\n      padding: var(--cg-spacing-12) var(--cg-spacing-16);\n      color: var(--cg-color-surface-table-text);\n      border-bottom: var(--cg-border-width-50) solid var(--cg-color-surface-table-divider);\n      vertical-align: middle;\n      position: relative;\n    }\n    :host([compact]) td { padding: var(--cg-spacing-6) var(--cg-spacing-12); }\n    td[data-align=\"center\"] { text-align: center; }\n    td[data-align=\"right\"] { text-align: right; }\n    td.clickable { cursor: pointer; }\n\n    /* Row states */\n    tbody tr { transition: background-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default); }\n    tbody tr:hover td { background: var(--cg-color-action-tertiary-background-hover); }\n\n    /* Striped */\n    :host([striped]) tbody tr:nth-child(even) td {\n      background: var(--cg-color-action-tertiary-background-hover);\n    }\n\n    /* ── Anomaly cells — left accent border ── */\n    .anomaly-high {\n      border-left: var(--cg-border-width-300) solid var(--cg-color-status-error-text-default);\n    }\n    .anomaly-medium {\n      border-left: var(--cg-border-width-300) solid var(--cg-color-status-warning-text-default);\n    }\n    .anomaly-low {\n      border-left: var(--cg-border-width-300) solid var(--cg-color-status-info-text-default);\n    }\n\n    .anomaly-icon {\n      display: inline-flex;\n      margin-left: var(--cg-spacing-6);\n      color: var(--cg-color-input-text-placeholder);\n      vertical-align: middle;\n    }\n\n    /* Tooltip */\n    .tooltip {\n      position: absolute;\n      bottom: calc(100% + var(--cg-spacing-4));\n      left: 50%;\n      transform: translateX(-50%);\n      background: var(--cg-color-surface-base-background);\n      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      color: var(--cg-color-surface-base-text);\n      font-size: var(--cg-font-size-xs);\n      padding: var(--cg-spacing-6) var(--cg-spacing-8);\n      border-radius: var(--cg-border-radius-100);\n      white-space: nowrap;\n      pointer-events: none;\n      z-index: 10;\n      box-shadow: var(--cg-elevation-2);\n    }\n\n    .empty-state {\n      padding: var(--cg-spacing-24);\n      text-align: center;\n      color: var(--cg-color-input-text-placeholder);\n      font-size: var(--cg-font-size-sm);\n    }\n\n    /* ── Rounded variants — matches cg-table ── */\n    :host([rounded=\"none\"]) .wrapper { border-radius: 0; }\n    :host([rounded=\"none\"]) tbody tr:first-child td:first-child,\n    :host([rounded=\"none\"]) tbody tr:first-child td:last-child,\n    :host([rounded=\"none\"]) tbody tr:last-child td:first-child,\n    :host([rounded=\"none\"]) tbody tr:last-child td:last-child { border-radius: 0; }\n\n    :host([rounded=\"sm\"]) .wrapper { border-radius: var(--cg-border-radius-100); }\n    :host([rounded=\"sm\"]) tbody tr:first-child td:first-child { border-top-left-radius: var(--cg-border-radius-50); }\n    :host([rounded=\"sm\"]) tbody tr:first-child td:last-child { border-top-right-radius: var(--cg-border-radius-50); }\n    :host([rounded=\"sm\"]) tbody tr:last-child td:first-child { border-bottom-left-radius: var(--cg-border-radius-50); }\n    :host([rounded=\"sm\"]) tbody tr:last-child td:last-child { border-bottom-right-radius: var(--cg-border-radius-50); }\n\n    :host([rounded=\"md\"]) .wrapper { border-radius: var(--cg-border-radius-150); }\n    :host([rounded=\"lg\"]) .wrapper { border-radius: var(--cg-component-table-radius); }\n  `];\n\n  @property({ reflect: true }) rounded: 'none' | 'sm' | 'md' | 'lg' = 'lg';\n  @property({ type: Array }) columns: Column[] = [];\n  @property({ type: Array }) data: Record<string, unknown>[] = [];\n  @property({ type: Array }) anomalies: Anomaly[] = [];\n  @property({ type: Boolean, reflect: true }) sortable = false;\n  @property({ type: Boolean, reflect: true }) striped = false;\n  @property({ type: Boolean, reflect: true }) compact = false;\n\n  /** Field name used as stable key for each row (Lit repeat directive). Improves diffing on sort/filter. */\n  @property({ type: String }) rowIdKey = 'id';\n  /** Opt-in windowed rendering for large datasets (>200 rows recommended). */\n  @property({ type: Boolean, reflect: true }) virtualize = false;\n  /** Estimated row height in pixels (used to compute the visible window). */\n  @property({ type: Number }) rowHeight = 48;\n  /** Extra rows rendered above/below the viewport to avoid pop-in during fast scrolls. */\n  @property({ type: Number }) overscan = 5;\n\n  @state() private _sortKey = '';\n  @state() private _sortDir: 'asc' | 'desc' = 'asc';\n  @state() private _hoveredAnomaly: string | null = null;\n  @state() private _scrollTop = 0;\n  @state() private _viewportHeight = 0;\n\n  @query('.table-scroll') private _scrollEl?: HTMLElement;\n\n  private _resizeObserver: ResizeObserver | null = null;\n  private _onScroll = (): void => {\n    if (this._scrollEl) this._scrollTop = this._scrollEl.scrollTop;\n  };\n\n  // Memo cache for sorted data + anomaly lookup\n  private _sortedCache: { data: Record<string, unknown>[]; key: string; dir: string; source: Record<string, unknown>[] } | null = null;\n  private _anomalyMap: Map<string, Anomaly> | null = null;\n  private _anomalyMapSource: Anomaly[] | null = null;\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this._scrollEl?.removeEventListener('scroll', this._onScroll);\n    this._resizeObserver?.disconnect();\n    this._resizeObserver = null;\n  }\n\n  override firstUpdated(): void {\n    this._wireVirtualization();\n  }\n\n  override updated(changed: Map<string, unknown>): void {\n    if (changed.has('virtualize')) this._wireVirtualization();\n  }\n\n  private _wireVirtualization(): void {\n    if (!this.virtualize) {\n      this._scrollEl?.removeEventListener('scroll', this._onScroll);\n      this._resizeObserver?.disconnect();\n      this._resizeObserver = null;\n      return;\n    }\n    const el = this._scrollEl;\n    if (!el) return;\n    el.addEventListener('scroll', this._onScroll, { passive: true });\n    this._viewportHeight = el.clientHeight;\n    this._scrollTop = el.scrollTop;\n    if (typeof ResizeObserver !== 'undefined') {\n      this._resizeObserver?.disconnect();\n      this._resizeObserver = new ResizeObserver(() => {\n        if (this._scrollEl) this._viewportHeight = this._scrollEl.clientHeight;\n      });\n      this._resizeObserver.observe(el);\n    }\n  }\n\n  private _getAnomaly(row: number, col: string): Anomaly | undefined {\n    if (this._anomalyMapSource !== this.anomalies || !this._anomalyMap) {\n      this._anomalyMap = new Map();\n      for (const a of this.anomalies) this._anomalyMap.set(`${a.row}::${a.col}`, a);\n      this._anomalyMapSource = this.anomalies;\n    }\n    return this._anomalyMap.get(`${row}::${col}`);\n  }\n\n  private _handleSort(key: string) {\n    if (!this.sortable) return;\n    if (this._sortKey === key) {\n      this._sortDir = this._sortDir === 'asc' ? 'desc' : 'asc';\n    } else {\n      this._sortKey = key;\n      this._sortDir = 'asc';\n    }\n    this.dispatchEvent(new CustomEvent('ai-data-sort', {\n      detail: { key: this._sortKey, direction: this._sortDir },\n      bubbles: true, composed: true,\n    }));\n  }\n\n  private _handleCellClick(row: number, col: string, value: unknown) {\n    this.dispatchEvent(new CustomEvent('ai-data-cell-click', {\n      detail: { row, col, value },\n      bubbles: true, composed: true,\n    }));\n  }\n\n  private _handleAnomalyClick(anomaly: Anomaly) {\n    this.dispatchEvent(new CustomEvent('ai-data-anomaly-click', {\n      detail: anomaly,\n      bubbles: true, composed: true,\n    }));\n  }\n\n  private get _sortedData(): Record<string, unknown>[] {\n    if (!this._sortKey) return this.data;\n    const cached = this._sortedCache;\n    if (cached && cached.source === this.data && cached.key === this._sortKey && cached.dir === this._sortDir) {\n      return cached.data;\n    }\n    const key = this._sortKey;\n    const dirMul = this._sortDir === 'desc' ? -1 : 1;\n    const sorted = [...this.data].sort((a, b) => {\n      const va = a[key];\n      const vb = b[key];\n      if (va == null && vb == null) return 0;\n      if (va == null) return 1 * dirMul;\n      if (vb == null) return -1 * dirMul;\n      if (typeof va === 'number' && typeof vb === 'number') return (va - vb) * dirMul;\n      return String(va).localeCompare(String(vb)) * dirMul;\n    });\n    this._sortedCache = { data: sorted, key, dir: this._sortDir, source: this.data };\n    return sorted;\n  }\n\n  private _rowKey(row: Record<string, unknown>, fallbackIdx: number): string | number {\n    const id = row[this.rowIdKey];\n    if (id != null && (typeof id === 'string' || typeof id === 'number')) return id;\n    return fallbackIdx;\n  }\n\n  private _renderRow(row: Record<string, unknown>, ri: number) {\n    return html`\n      <tr role=\"row\">\n        ${this.columns.map(col => {\n          const anomaly = this._getAnomaly(ri, col.key);\n          const anomalyClass = anomaly ? `anomaly-${anomaly.severity}` : '';\n          const cellId = `${ri}-${col.key}`;\n          return html`\n            <td\n              class=\"clickable ${anomalyClass}\"\n              data-align=${col.align || 'left'}\n              role=\"cell\"\n              aria-label=${anomaly ? `Anomaly: ${anomaly.reason}` : nothing}\n              @click=${() => { this._handleCellClick(ri, col.key, row[col.key]); if (anomaly) this._handleAnomalyClick(anomaly); }}\n              @mouseenter=${() => { if (anomaly) this._hoveredAnomaly = cellId; }}\n              @mouseleave=${() => { this._hoveredAnomaly = null; }}\n            >\n              ${typeof row[col.key] === 'object' ? JSON.stringify(row[col.key]) : String(row[col.key] ?? '')}\n              ${anomaly ? html`<span class=\"anomaly-icon\" title=\"${anomaly.reason}\" aria-hidden=\"true\"><svg width=\"12\" height=\"12\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"><path d=\"M12 9v4m0 4h.01M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z\"/></svg></span>` : nothing}\n              ${anomaly && this._hoveredAnomaly === cellId ? html`<span class=\"tooltip\" role=\"tooltip\">${anomaly.reason}</span>` : nothing}\n            </td>\n          `;\n        })}\n      </tr>\n    `;\n  }\n\n  private _renderRows() {\n    const rows = this._sortedData;\n\n    // Fast path: no virtualization — repeat with stable keys so sort/filter only moves nodes.\n    if (!this.virtualize) {\n      return repeat(\n        rows,\n        (row, i) => this._rowKey(row, i),\n        (row, i) => this._renderRow(row, i),\n      );\n    }\n\n    // Windowed rendering. Before firstUpdated, _viewportHeight is 0 — render an initial chunk\n    // so rows exist to measure against and SSR/initial paint isn't empty.\n    const rh = Math.max(1, this.rowHeight);\n    const vh = this._viewportHeight > 0 ? this._viewportHeight : rh * 10;\n    const start = Math.max(0, Math.floor(this._scrollTop / rh) - this.overscan);\n    const end = Math.min(rows.length, Math.ceil((this._scrollTop + vh) / rh) + this.overscan);\n    const visible = rows.slice(start, end);\n    const topPad = start * rh;\n    const bottomPad = Math.max(0, (rows.length - end) * rh);\n    const colspan = this.columns.length;\n\n    return html`\n      ${topPad > 0 ? html`<tr class=\"virtual-spacer\" aria-hidden=\"true\"><td colspan=${colspan} style=${styleMap({ height: `${topPad}px` })}></td></tr>` : nothing}\n      ${repeat(\n        visible,\n        (row, i) => this._rowKey(row, start + i),\n        (row, i) => this._renderRow(row, start + i),\n      )}\n      ${bottomPad > 0 ? html`<tr class=\"virtual-spacer\" aria-hidden=\"true\"><td colspan=${colspan} style=${styleMap({ height: `${bottomPad}px` })}></td></tr>` : nothing}\n    `;\n  }\n\n  override render() {\n    if (!this.columns.length) {\n      return html`<div class=\"wrapper\"><div class=\"empty-state\">No columns defined</div></div>`;\n    }\n\n    return html`\n      <div class=\"wrapper\">\n        <div class=\"table-scroll\">\n          <table role=\"table\" aria-label=\"Data table\">\n            <thead>\n              <tr role=\"row\">\n                ${this.columns.map(col => {\n                  const isSorted = this._sortKey === col.key;\n                  return html`\n                    <th\n                      class=\"${this.sortable ? 'sortable' : ''} ${isSorted ? 'sorted' : ''}\"\n                      data-align=${col.align || 'left'}\n                      role=\"columnheader\"\n                      tabindex=${this.sortable ? '0' : '-1'}\n                      aria-sort=${isSorted ? (this._sortDir === 'asc' ? 'ascending' : 'descending') : 'none'}\n                      @click=${() => this._handleSort(col.key)}\n                      @keydown=${(e: KeyboardEvent) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); this._handleSort(col.key); } }}\n                    >\n                      ${col.label}\n                      ${this.sortable ? html`\n                        <span class=\"sort-icon\">\n                          <svg width=\"10\" height=\"10\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\">\n                            ${isSorted && this._sortDir === 'desc'\n                              ? html`<path d=\"M12 5v14m-7-7l7 7 7-7\"/>`\n                              : html`<path d=\"M12 19V5m-7 7l7-7 7 7\"/>`}\n                          </svg>\n                        </span>\n                      ` : nothing}\n                    </th>\n                  `;\n                })}\n              </tr>\n            </thead>\n            <tbody>\n              ${this._renderRows()}\n            </tbody>\n          </table>\n        </div>\n        ${!this.data.length ? html`<div class=\"empty-state\">No data available</div>` : nothing}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ai-data-table': AiDataTable;\n  }\n}\n"],"names":["AiDataTable","LitElement","changed","el","row","col","a","key","value","anomaly","cached","dirMul","sorted","b","va","vb","fallbackIdx","id","ri","html","anomalyClass","cellId","nothing","rows","repeat","i","rh","vh","start","end","visible","topPad","bottomPad","colspan","styleMap","isSorted","e","hostBlock","reducedMotion","css","__decorateClass","property","state","query","customElement"],"mappings":";;;;;;;;;;AAyCO,IAAMA,IAAN,cAA0BC,EAAW;AAAA,EAArC,cAAA;AAAA,UAAA,GAAA,SAAA,GAgKwB,KAAA,UAAuC,MACzC,KAAA,UAAoB,CAAA,GACpB,KAAA,OAAkC,CAAA,GAClC,KAAA,YAAuB,CAAA,GACN,KAAA,WAAW,IACX,KAAA,UAAU,IACV,KAAA,UAAU,IAG1B,KAAA,WAAW,MAEK,KAAA,aAAa,IAE7B,KAAA,YAAY,IAEZ,KAAA,WAAW,GAE9B,KAAQ,WAAW,IACnB,KAAQ,WAA2B,OACnC,KAAQ,kBAAiC,MACzC,KAAQ,aAAa,GACrB,KAAQ,kBAAkB,GAInC,KAAQ,kBAAyC,MACjD,KAAQ,YAAY,MAAY;AAC9B,MAAI,KAAK,cAAW,KAAK,aAAa,KAAK,UAAU;AAAA,IACvD,GAGA,KAAQ,eAAwH,MAChI,KAAQ,cAA2C,MACnD,KAAQ,oBAAsC;AAAA,EAAA;AAAA,EAErC,uBAA6B;AACpC,UAAM,qBAAA,GACN,KAAK,WAAW,oBAAoB,UAAU,KAAK,SAAS,GAC5D,KAAK,iBAAiB,WAAA,GACtB,KAAK,kBAAkB;AAAA,EACzB;AAAA,EAES,eAAqB;AAC5B,SAAK,oBAAA;AAAA,EACP;AAAA,EAES,QAAQC,GAAqC;AACpD,IAAIA,EAAQ,IAAI,YAAY,UAAQ,oBAAA;AAAA,EACtC;AAAA,EAEQ,sBAA4B;AAClC,QAAI,CAAC,KAAK,YAAY;AACpB,WAAK,WAAW,oBAAoB,UAAU,KAAK,SAAS,GAC5D,KAAK,iBAAiB,WAAA,GACtB,KAAK,kBAAkB;AACvB;AAAA,IACF;AACA,UAAMC,IAAK,KAAK;AAChB,IAAKA,MACLA,EAAG,iBAAiB,UAAU,KAAK,WAAW,EAAE,SAAS,IAAM,GAC/D,KAAK,kBAAkBA,EAAG,cAC1B,KAAK,aAAaA,EAAG,WACjB,OAAO,iBAAmB,QAC5B,KAAK,iBAAiB,WAAA,GACtB,KAAK,kBAAkB,IAAI,eAAe,MAAM;AAC9C,MAAI,KAAK,cAAW,KAAK,kBAAkB,KAAK,UAAU;AAAA,IAC5D,CAAC,GACD,KAAK,gBAAgB,QAAQA,CAAE;AAAA,EAEnC;AAAA,EAEQ,YAAYC,GAAaC,GAAkC;AACjE,QAAI,KAAK,sBAAsB,KAAK,aAAa,CAAC,KAAK,aAAa;AAClE,WAAK,kCAAkB,IAAA;AACvB,iBAAWC,KAAK,KAAK,UAAW,MAAK,YAAY,IAAI,GAAGA,EAAE,GAAG,KAAKA,EAAE,GAAG,IAAIA,CAAC;AAC5E,WAAK,oBAAoB,KAAK;AAAA,IAChC;AACA,WAAO,KAAK,YAAY,IAAI,GAAGF,CAAG,KAAKC,CAAG,EAAE;AAAA,EAC9C;AAAA,EAEQ,YAAYE,GAAa;AAC/B,IAAK,KAAK,aACN,KAAK,aAAaA,IACpB,KAAK,WAAW,KAAK,aAAa,QAAQ,SAAS,SAEnD,KAAK,WAAWA,GAChB,KAAK,WAAW,QAElB,KAAK,cAAc,IAAI,YAAY,gBAAgB;AAAA,MACjD,QAAQ,EAAE,KAAK,KAAK,UAAU,WAAW,KAAK,SAAA;AAAA,MAC9C,SAAS;AAAA,MAAM,UAAU;AAAA,IAAA,CAC1B,CAAC;AAAA,EACJ;AAAA,EAEQ,iBAAiBH,GAAaC,GAAaG,GAAgB;AACjE,SAAK,cAAc,IAAI,YAAY,sBAAsB;AAAA,MACvD,QAAQ,EAAE,KAAAJ,GAAK,KAAAC,GAAK,OAAAG,EAAA;AAAA,MACpB,SAAS;AAAA,MAAM,UAAU;AAAA,IAAA,CAC1B,CAAC;AAAA,EACJ;AAAA,EAEQ,oBAAoBC,GAAkB;AAC5C,SAAK,cAAc,IAAI,YAAY,yBAAyB;AAAA,MAC1D,QAAQA;AAAA,MACR,SAAS;AAAA,MAAM,UAAU;AAAA,IAAA,CAC1B,CAAC;AAAA,EACJ;AAAA,EAEA,IAAY,cAAyC;AACnD,QAAI,CAAC,KAAK,SAAU,QAAO,KAAK;AAChC,UAAMC,IAAS,KAAK;AACpB,QAAIA,KAAUA,EAAO,WAAW,KAAK,QAAQA,EAAO,QAAQ,KAAK,YAAYA,EAAO,QAAQ,KAAK;AAC/F,aAAOA,EAAO;AAEhB,UAAMH,IAAM,KAAK,UACXI,IAAS,KAAK,aAAa,SAAS,KAAK,GACzCC,IAAS,CAAC,GAAG,KAAK,IAAI,EAAE,KAAK,CAACN,GAAGO,MAAM;AAC3C,YAAMC,IAAKR,EAAEC,CAAG,GACVQ,IAAKF,EAAEN,CAAG;AAChB,aAAIO,KAAM,QAAQC,KAAM,OAAa,IACjCD,KAAM,OAAa,IAAIH,IACvBI,KAAM,OAAa,KAAKJ,IACxB,OAAOG,KAAO,YAAY,OAAOC,KAAO,YAAkBD,IAAKC,KAAMJ,IAClE,OAAOG,CAAE,EAAE,cAAc,OAAOC,CAAE,CAAC,IAAIJ;AAAA,IAChD,CAAC;AACD,gBAAK,eAAe,EAAE,MAAMC,GAAQ,KAAAL,GAAK,KAAK,KAAK,UAAU,QAAQ,KAAK,KAAA,GACnEK;AAAA,EACT;AAAA,EAEQ,QAAQR,GAA8BY,GAAsC;AAClF,UAAMC,IAAKb,EAAI,KAAK,QAAQ;AAC5B,WAAIa,KAAM,SAAS,OAAOA,KAAO,YAAY,OAAOA,KAAO,YAAkBA,IACtED;AAAA,EACT;AAAA,EAEQ,WAAWZ,GAA8Bc,GAAY;AAC3D,WAAOC;AAAA;AAAA,UAED,KAAK,QAAQ,IAAI,CAAAd,MAAO;AACxB,YAAMI,IAAU,KAAK,YAAYS,GAAIb,EAAI,GAAG,GACtCe,IAAeX,IAAU,WAAWA,EAAQ,QAAQ,KAAK,IACzDY,IAAS,GAAGH,CAAE,IAAIb,EAAI,GAAG;AAC/B,aAAOc;AAAA;AAAA,iCAEgBC,CAAY;AAAA,2BAClBf,EAAI,SAAS,MAAM;AAAA;AAAA,2BAEnBI,IAAU,YAAYA,EAAQ,MAAM,KAAKa,CAAO;AAAA,uBACpD,MAAM;AAAE,aAAK,iBAAiBJ,GAAIb,EAAI,KAAKD,EAAIC,EAAI,GAAG,CAAC,GAAOI,KAAS,KAAK,oBAAoBA,CAAO;AAAA,MAAG,CAAC;AAAA,4BACtG,MAAM;AAAE,QAAIA,WAAc,kBAAkBY;AAAA,MAAQ,CAAC;AAAA,4BACrD,MAAM;AAAE,aAAK,kBAAkB;AAAA,MAAM,CAAC;AAAA;AAAA,gBAElD,OAAOjB,EAAIC,EAAI,GAAG,KAAM,WAAW,KAAK,UAAUD,EAAIC,EAAI,GAAG,CAAC,IAAI,OAAOD,EAAIC,EAAI,GAAG,KAAK,EAAE,CAAC;AAAA,gBAC5FI,IAAUU,sCAAyCV,EAAQ,MAAM,+QAA+Qa,CAAO;AAAA,gBACvVb,KAAW,KAAK,oBAAoBY,IAASF,yCAA4CV,EAAQ,MAAM,YAAYa,CAAO;AAAA;AAAA;AAAA,IAGlI,CAAC,CAAC;AAAA;AAAA;AAAA,EAGR;AAAA,EAEQ,cAAc;AACpB,UAAMC,IAAO,KAAK;AAGlB,QAAI,CAAC,KAAK;AACR,aAAOC;AAAA,QACLD;AAAA,QACA,CAACnB,GAAKqB,MAAM,KAAK,QAAQrB,GAAKqB,CAAC;AAAA,QAC/B,CAACrB,GAAKqB,MAAM,KAAK,WAAWrB,GAAKqB,CAAC;AAAA,MAAA;AAMtC,UAAMC,IAAK,KAAK,IAAI,GAAG,KAAK,SAAS,GAC/BC,IAAK,KAAK,kBAAkB,IAAI,KAAK,kBAAkBD,IAAK,IAC5DE,IAAQ,KAAK,IAAI,GAAG,KAAK,MAAM,KAAK,aAAaF,CAAE,IAAI,KAAK,QAAQ,GACpEG,IAAM,KAAK,IAAIN,EAAK,QAAQ,KAAK,MAAM,KAAK,aAAaI,KAAMD,CAAE,IAAI,KAAK,QAAQ,GAClFI,IAAUP,EAAK,MAAMK,GAAOC,CAAG,GAC/BE,IAASH,IAAQF,GACjBM,IAAY,KAAK,IAAI,IAAIT,EAAK,SAASM,KAAOH,CAAE,GAChDO,IAAU,KAAK,QAAQ;AAE7B,WAAOd;AAAA,QACHY,IAAS,IAAIZ,8DAAiEc,CAAO,UAAUC,EAAS,EAAE,QAAQ,GAAGH,CAAM,KAAA,CAAM,CAAC,gBAAgBT,CAAO;AAAA,QACzJE;AAAA,MACAM;AAAA,MACA,CAAC1B,GAAKqB,MAAM,KAAK,QAAQrB,GAAKwB,IAAQH,CAAC;AAAA,MACvC,CAACrB,GAAKqB,MAAM,KAAK,WAAWrB,GAAKwB,IAAQH,CAAC;AAAA,IAAA,CAC3C;AAAA,QACCO,IAAY,IAAIb,8DAAiEc,CAAO,UAAUC,EAAS,EAAE,QAAQ,GAAGF,CAAS,KAAA,CAAM,CAAC,gBAAgBV,CAAO;AAAA;AAAA,EAErK;AAAA,EAES,SAAS;AAChB,WAAK,KAAK,QAAQ,SAIXH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMO,KAAK,QAAQ,IAAI,CAAAd,MAAO;AACxB,YAAM8B,IAAW,KAAK,aAAa9B,EAAI;AACvC,aAAOc;AAAA;AAAA,+BAEM,KAAK,WAAW,aAAa,EAAE,IAAIgB,IAAW,WAAW,EAAE;AAAA,mCACvD9B,EAAI,SAAS,MAAM;AAAA;AAAA,iCAErB,KAAK,WAAW,MAAM,IAAI;AAAA,kCACzB8B,IAAY,KAAK,aAAa,QAAQ,cAAc,eAAgB,MAAM;AAAA,+BAC7E,MAAM,KAAK,YAAY9B,EAAI,GAAG,CAAC;AAAA,iCAC7B,CAAC+B,MAAqB;AAAE,SAAIA,EAAE,QAAQ,WAAWA,EAAE,QAAQ,SAAOA,EAAE,eAAA,GAAkB,KAAK,YAAY/B,EAAI,GAAG;AAAA,MAAK,CAAC;AAAA;AAAA,wBAE7HA,EAAI,KAAK;AAAA,wBACT,KAAK,WAAWc;AAAA;AAAA;AAAA,8BAGVgB,KAAY,KAAK,aAAa,SAC5BhB,uCACAA,oCAAuC;AAAA;AAAA;AAAA,0BAG7CG,CAAO;AAAA;AAAA;AAAA,IAGjB,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA,gBAIF,KAAK,aAAa;AAAA;AAAA;AAAA;AAAA,UAIvB,KAAK,KAAK,SAAkEA,IAAzDH,mDAAgE;AAAA;AAAA,QAzCjFA;AAAA,EA4CX;AACF;AAnZanB,EACK,SAAS,CAACqC,GAAWC,GAAeC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA6JnD;AAE4BC,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GAhKhBzC,EAgKkB,WAAA,WAAA,CAAA;AACFwC,EAAA;AAAA,EAA1BC,EAAS,EAAE,MAAM,MAAA,CAAO;AAAA,GAjKdzC,EAiKgB,WAAA,WAAA,CAAA;AACAwC,EAAA;AAAA,EAA1BC,EAAS,EAAE,MAAM,MAAA,CAAO;AAAA,GAlKdzC,EAkKgB,WAAA,QAAA,CAAA;AACAwC,EAAA;AAAA,EAA1BC,EAAS,EAAE,MAAM,MAAA,CAAO;AAAA,GAnKdzC,EAmKgB,WAAA,aAAA,CAAA;AACiBwC,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GApK/BzC,EAoKiC,WAAA,YAAA,CAAA;AACAwC,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GArK/BzC,EAqKiC,WAAA,WAAA,CAAA;AACAwC,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAtK/BzC,EAsKiC,WAAA,WAAA,CAAA;AAGhBwC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAzKfzC,EAyKiB,WAAA,YAAA,CAAA;AAEgBwC,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GA3K/BzC,EA2KiC,WAAA,cAAA,CAAA;AAEhBwC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA7KfzC,EA6KiB,WAAA,aAAA,CAAA;AAEAwC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA/KfzC,EA+KiB,WAAA,YAAA,CAAA;AAEXwC,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAjLI1C,EAiLM,WAAA,YAAA,CAAA;AACAwC,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAlLI1C,EAkLM,WAAA,YAAA,CAAA;AACAwC,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAnLI1C,EAmLM,WAAA,mBAAA,CAAA;AACAwC,EAAA;AAAA,EAAhBE,EAAA;AAAM,GApLI1C,EAoLM,WAAA,cAAA,CAAA;AACAwC,EAAA;AAAA,EAAhBE,EAAA;AAAM,GArLI1C,EAqLM,WAAA,mBAAA,CAAA;AAEewC,EAAA;AAAA,EAA/BG,EAAM,eAAe;AAAA,GAvLX3C,EAuLqB,WAAA,aAAA,CAAA;AAvLrBA,IAANwC,EAAA;AAAA,EADNI,EAAc,eAAe;AAAA,GACjB5C,CAAA;"}

package/dist/components/ai-debug-console/ai-debug-console.d.ts

@@ -0,0 +1,39 @@
+import { LitElement } from 'lit';
+export type DebugEntryType = 'request' | 'response' | 'error' | 'info' | 'tool';
+export interface DebugEntry {
+    type: DebugEntryType;
+    timestamp: string;
+    content: string;
+    duration?: number;
+}
+export declare class AiDebugConsole extends LitElement {
+    static styles: import('lit').CSSResult[];
+    rounded: 'none' | 'sm' | 'md' | 'lg' | 'full';
+    entries: DebugEntry[];
+    open: boolean;
+    maxEntries: number;
+    /** Pulsing live dot in the header — set to true while a stream is active. */
+    streaming: boolean;
+    private _expanded;
+    private _filter;
+    private _query;
+    private _panelEl?;
+    private _wasAtBottom;
+    updated(changed: Map<string, unknown>): void;
+    /** Window onto entries — capped to maxEntries, then filtered + searched. */
+    private get _visibleEntries();
+    private _countByType;
+    private _onToggle;
+    private _onClear;
+    private _toggleEntry;
+    private _onPanelScroll;
+    private _onSearch;
+    private _formatContent;
+    render(): import('lit').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ai-debug-console': AiDebugConsole;
+    }
+}
+//# sourceMappingURL=ai-debug-console.d.ts.map

package/dist/components/ai-debug-console/ai-debug-console.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ai-debug-console.d.ts","sourceRoot":"","sources":["../../../src/components/ai-debug-console/ai-debug-console.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAC;AAGrD,OAAO,2BAA2B,CAAC;AAEnC,MAAM,MAAM,cAAc,GAAG,SAAS,GAAG,UAAU,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;AAEhF,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,cAAc,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAWD,qBACa,cAAe,SAAQ,UAAU;IAC5C,OAAgB,MAAM,4BAmTnB;IAE0B,OAAO,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAQ;IACvD,OAAO,EAAE,UAAU,EAAE,CAAM;IACV,IAAI,UAAS;IACH,UAAU,SAAO;IACvE,6EAA6E;IACjC,SAAS,UAAS;IAErD,OAAO,CAAC,SAAS,CAAqB;IACtC,OAAO,CAAC,OAAO,CAAiC;IAChD,OAAO,CAAC,MAAM,CAAM;IAEZ,OAAO,CAAC,QAAQ,CAAC,CAAc;IAEhD,OAAO,CAAC,YAAY,CAAQ;IAEnB,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAQrD,4EAA4E;IAC5E,OAAO,KAAK,eAAe,GAO1B;IAED,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,SAAS;IAQjB,OAAO,CAAC,QAAQ;IAMhB,OAAO,CAAC,YAAY;IAUpB,OAAO,CAAC,cAAc;IAMtB,OAAO,CAAC,SAAS;IAIjB,OAAO,CAAC,cAAc;IAQb,MAAM;CA0GhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,kBAAkB,EAAE,cAAc,CAAC;KACpC;CACF"}