@cognivo/components 0.8.0 → 0.8.2

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

@@ -1,166 +1,71 @@
-import { css as h, LitElement as f, html as s, nothing as p } from "lit";
-import { property as g, customElement as b } from "lit/decorators.js";
-import { h as v, r as m, f as y } from "../../chunks/premium.css-9I4kHrsl.js";
-import "../cg-button/cg-button.js";
-import "../cg-spinner/cg-spinner.js";
-var x = Object.defineProperty, w = Object.getOwnPropertyDescriptor, d = (t, r, i, a) => {
-  for (var e = a > 1 ? void 0 : a ? w(r, i) : r, n = t.length - 1, o; n >= 0; n--)
-    (o = t[n]) && (e = (a ? o(r, i, e) : o(e)) || e);
-  return a && e && x(r, i, e), e;
+import { css as h, LitElement as b, html as o, nothing as g } from "lit";
+import { property as d, customElement as p } from "lit/decorators.js";
+import { h as v, r as m, f as y } from "../../chunks/premium.css-DHekUEUt.js";
+var x = Object.defineProperty, w = Object.getOwnPropertyDescriptor, l = (t, r, n, e) => {
+  for (var a = e > 1 ? void 0 : e ? w(r, n) : r, i = t.length - 1, s; i >= 0; i--)
+    (s = t[i]) && (a = (e ? s(r, n, a) : s(a)) || a);
+  return e && a && x(r, n, a), a;
 };
-let l = class extends f {
+let c = class extends b {
   constructor() {
-    super(...arguments), this.data = null, this.format = "json", this.maxRows = 50, this.title = "Data Preview", this.loading = !1, this.error = "";
+    super(...arguments), this.data = null, this.format = "json", this.maxRows = 50, this.title = "Data Preview";
   }
-  // ─── Helpers ────────────────────────────────────────────────────────────
   _getRowCount() {
-    return Array.isArray(this.data) ? this.data.length : typeof this.data == "string" && this.format === "csv" ? Math.max(0, this.data.split(`
-`).filter(Boolean).length - 1) : 0;
+    return Array.isArray(this.data) ? this.data.length : typeof this.data == "string" && this.format === "csv" ? this.data.split(`
+`).filter(Boolean).length - 1 : 0;
   }
   _getSize() {
-    try {
-      const t = typeof this.data == "string" ? this.data : JSON.stringify(this.data), r = new Blob([t]).size;
-      return r < 1024 ? `${r} B` : r < 1024 * 1024 ? `${(r / 1024).toFixed(1)} KB` : `${(r / (1024 * 1024)).toFixed(1)} MB`;
-    } catch {
-      return "0 B";
-    }
-  }
-  /** Detect column type by sampling values across rows. */
-  _inferColumnType(t, r) {
-    let i = 0, a = 0, e = null;
-    for (const n of t) {
-      const o = n[r];
-      if (o == null || o === "") {
-        i++;
-        continue;
-      }
-      a++;
-      const c = this._cellType(o);
-      if (e && e !== c) return "string";
-      if (e = c, a > 25) break;
-    }
-    return a === 0 ? i > 0 ? "null" : "string" : e ?? "string";
-  }
-  _cellType(t) {
-    return t == null ? "null" : typeof t == "boolean" ? "boolean" : typeof t == "number" ? "number" : typeof t == "object" ? "object" : typeof t == "string" ? /^-?\d+(\.\d+)?$/.test(t) ? "number" : t === "true" || t === "false" ? "boolean" : t === "null" ? "null" : /^\d{4}-\d{2}-\d{2}/.test(t) && !isNaN(Date.parse(t)) ? "date" : "string" : "string";
-  }
-  _typeClass(t) {
-    switch (t) {
-      case "number":
-        return "tok-number";
-      case "boolean":
-        return "tok-bool";
-      case "null":
-        return "tok-null";
-      case "date":
-        return "tok-date";
-      case "object":
-        return "tok-string";
-      default:
-        return "tok-string";
-    }
+    const t = typeof this.data == "string" ? this.data : JSON.stringify(this.data), r = new Blob([t]).size;
+    return r < 1024 ? `${r} B` : r < 1024 * 1024 ? `${(r / 1024).toFixed(1)} KB` : `${(r / (1024 * 1024)).toFixed(1)} MB`;
   }
-  _formatCell(t, r) {
-    if (t == null) return "null";
-    if (r === "object")
-      try {
-        return JSON.stringify(t);
-      } catch {
-        return String(t);
-      }
-    return String(t);
-  }
-  // ─── JSON syntax highlight ──────────────────────────────────────────────
   _syntaxHighlight(t) {
-    const r = [], i = /("(\\u[\dA-Fa-f]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+-]?\d+)?)/g;
-    let a = 0, e;
-    for (; (e = i.exec(t)) !== null; ) {
-      e.index > a && r.push(s`${t.substring(a, e.index)}`);
-      const n = e[0];
-      let o = "json-number";
-      /^"/.test(n) ? o = e[3] ? "json-key" : "json-string" : /true|false/.test(n) ? o = "json-bool" : /null/.test(n) && (o = "json-null"), r.push(s`<span class=${o}>${n}</span>`), a = i.lastIndex;
+    const r = [], n = /("(\\u[\dA-Fa-f]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+-]?\d+)?)/g;
+    let e = 0, a;
+    for (; (a = n.exec(t)) !== null; ) {
+      a.index > e && r.push(o`${t.substring(e, a.index)}`);
+      const i = a[0];
+      let s = "json-number";
+      /^"/.test(i) ? s = a[3] ? "json-key" : "json-string" : /true|false/.test(i) ? s = "json-bool" : /null/.test(i) && (s = "json-null"), r.push(o`<span class=${s}>${i}</span>`), e = n.lastIndex;
     }
-    return a < t.length && r.push(s`${t.substring(a)}`), s`${r}`;
+    return e < t.length && r.push(o`${t.substring(e)}`), o`${r}`;
   }
-  // ─── Renderers ──────────────────────────────────────────────────────────
   _renderJson() {
     try {
       const t = typeof this.data == "string" ? this.data : JSON.stringify(this.data, null, 2);
-      return s`<pre>${this._syntaxHighlight(t)}</pre>`;
+      return o`<pre>${this._syntaxHighlight(t)}</pre>`;
     } catch {
-      return s`<pre>${String(this.data)}</pre>`;
+      return o`<pre>${String(this.data)}</pre>`;
     }
   }
   _renderTable(t, r) {
-    if (t.length === 0)
-      return s`
-        <div class="state">
-          <svg class="state-icon" viewBox="0 0 24 24" fill="none" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
-            <path d="M3 6.5a2.5 2.5 0 0 1 2.5-2.5h13A2.5 2.5 0 0 1 21 6.5v11a2.5 2.5 0 0 1-2.5 2.5h-13A2.5 2.5 0 0 1 3 17.5z"/>
-            <path d="M3 10h18M9 4v16"/>
-          </svg>
-          <span>No data to preview</span>
-        </div>
-      `;
-    const i = Object.keys(t[0]), a = {};
-    for (const e of i) a[e] = this._inferColumnType(t, e);
-    return s`
-      <table aria-label="Data table">
-        <thead>
-          <tr>
-            ${i.map((e) => s`
-              <th scope="col">
-                <span class="col-name">${e}</span>
-                <span class="col-type">${a[e]}</span>
-              </th>
-            `)}
-          </tr>
-        </thead>
+    if (t.length === 0) return o`<div class="truncated-msg">No data</div>`;
+    const n = Object.keys(t[0]);
+    return o`
+      <table role="table" aria-label="Data table">
+        <thead><tr>${n.map((e) => o`<th scope="col">${e}</th>`)}</tr></thead>
         <tbody>
-          ${t.map((e) => s`
-            <tr>
-              ${i.map((n) => {
-      const o = this._cellType(e[n]) === "null" ? "null" : a[n], c = this._formatCell(e[n], o);
-      return s`<td title=${c}><span class=${this._typeClass(o)}>${c}</span></td>`;
-    })}
-            </tr>
+          ${t.map((e) => o`
+            <tr>${n.map((a) => o`<td>${String(e[a] ?? "")}</td>`)}</tr>
           `)}
         </tbody>
       </table>
-      ${r ? s`<div class="truncated-msg">Showing ${t.length} of ${this._getRowCount()} rows</div>` : p}
+      ${r ? o`<div class="truncated-msg">Showing ${t.length} of ${this._getRowCount()} rows</div>` : g}
     `;
   }
   _renderCsv() {
     if (typeof this.data != "string") return this._renderJson();
     const t = this.data.split(`
 `).filter(Boolean);
-    if (t.length === 0) return s`<pre>${this.data}</pre>`;
-    const r = t[0].split(",").map((e) => e.trim()), a = t.slice(1, this.maxRows + 1).map((e) => {
-      const n = e.split(","), o = {};
-      return r.forEach((c, u) => {
-        o[c] = (n[u] || "").trim();
-      }), o;
+    if (t.length === 0) return o`<pre>${this.data}</pre>`;
+    const r = t[0].split(",").map((a) => a.trim()), e = t.slice(1, this.maxRows + 1).map((a) => {
+      const i = a.split(","), s = {};
+      return r.forEach((f, u) => {
+        s[f] = (i[u] || "").trim();
+      }), s;
     });
-    return this._renderTable(a, t.length - 1 > this.maxRows);
+    return this._renderTable(e, t.length - 1 > this.maxRows);
   }
   _renderContent() {
-    if (this.loading)
-      return s`
-        <div class="state">
-          <cg-spinner size="md"></cg-spinner>
-          <span>Parsing data…</span>
-        </div>
-      `;
-    if (this.error)
-      return s`
-        <div class="state error" role="alert">
-          <svg class="state-icon" viewBox="0 0 24 24" fill="none" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
-            <circle cx="12" cy="12" r="9"/>
-            <path d="M12 8v5M12 16h.01"/>
-          </svg>
-          <span>${this.error}</span>
-        </div>
-      `;
     if (this.format === "csv") return this._renderCsv();
     if (this.format === "table" || Array.isArray(this.data) && typeof this.data[0] == "object") {
       const t = Array.isArray(this.data) ? this.data : [this.data], r = t.slice(0, this.maxRows);
@@ -183,110 +88,79 @@ let l = class extends f {
   }
   render() {
     const t = this._getRowCount();
-    let r = 0;
-    if (Array.isArray(this.data) && this.data.length > 0 && typeof this.data[0] == "object" && this.data[0] !== null)
-      r = Object.keys(this.data[0]).length;
-    else if (this.format === "csv" && typeof this.data == "string") {
-      const i = this.data.split(`
-`)[0];
-      r = i ? i.split(",").length : 0;
-    }
-    return s`
+    return o`
       <div class="header">
-        <div class="header-left">
+        <div>
           <h3 class="title">${this.title}</h3>
           <div class="meta">
             <span class="format-badge">${this.format}</span>
-            ${t > 0 ? s`<span>${t.toLocaleString()} ${t === 1 ? "row" : "rows"}</span>` : p}
-            ${r > 0 ? s`<span>· ${r} ${r === 1 ? "col" : "cols"}</span>` : p}
-            <span>· ${this._getSize()}</span>
+            ${t > 0 ? o`<span>${t} rows</span>` : g}
+            <span>${this._getSize()}</span>
           </div>
         </div>
       </div>
-
       <div class="preview-area" role="region" aria-label="Data preview" tabindex="0">
         ${this._renderContent()}
       </div>
-
       <div class="actions">
-        <cg-button variant="secondary" size="sm" @click=${this._onCancel}>
-          Cancel
-        </cg-button>
-        <cg-button variant="primary" size="sm" @click=${this._onConfirm} ?disabled=${!!this.error || this.loading}>
-          Confirm
-        </cg-button>
+        <button class="btn btn-cancel" @click=${this._onCancel}
+                aria-label="Cancel" tabindex="0">Cancel</button>
+        <button class="btn btn-confirm" @click=${this._onConfirm}
+                aria-label="Confirm data" tabindex="0">Confirm</button>
       </div>
     `;
   }
 };
-l.styles = [v, m, y, h`
+c.styles = [v, m, y, h`
     :host {
-      display: block;
-      background: var(--cg-color-surface-cards-background);
+      background: var(--cg-color-surface-base-background);
       color: var(--cg-color-surface-base-text);
       border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
       border-radius: var(--cg-border-radius-150);
-      box-shadow: var(--cg-elevation-1);
-      padding: var(--cg-spacing-20);
-      animation: fadeSlideIn var(--cg-transition-duration-default) var(--cg-transition-easing-ease-out) both;
+      padding: var(--cg-spacing-16);
+      animation: fadeSlideIn var(--cg-transition-duration-fast) var(--cg-transition-easing-ease-out) both;
     }
     :host([hidden]) { display: none; }
 
-    /* ── Header ── */
     .header {
       display: flex;
       justify-content: space-between;
-      align-items: flex-start;
-      gap: var(--cg-spacing-12);
-      padding-bottom: var(--cg-spacing-16);
-      border-bottom: var(--cg-border-width-50) solid var(--cg-color-surface-cards-divider);
-      margin-bottom: var(--cg-spacing-16);
+      align-items: center;
+      padding-bottom: var(--cg-spacing-12);
+      border-bottom: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
+      margin-bottom: var(--cg-spacing-12);
     }
-    .header-left { min-width: 0; flex: 1; }
 
     .title {
       font-size: var(--cg-font-size-sm);
       font-weight: var(--cg-font-weight-semibold);
-      margin: 0 0 var(--cg-spacing-4);
-      color: var(--cg-color-surface-base-text);
+      margin: 0;
     }
 
     .meta {
       display: flex;
-      flex-wrap: wrap;
-      gap: var(--cg-spacing-8) var(--cg-spacing-12);
+      gap: var(--cg-spacing-12);
       font-size: var(--cg-font-size-xs);
       color: var(--cg-color-input-text-placeholder);
-      align-items: center;
-      font-variant-numeric: tabular-nums;
     }
 
-    /* Format badge — neutral chrome, not brand-tinted (it's a type label, not a CTA). */
     .format-badge {
-      display: inline-flex;
-      align-items: center;
       padding: var(--cg-spacing-2) var(--cg-spacing-8);
-      background: var(--cg-color-surface-cards-emphasis);
-      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
+      background: var(--cg-overlay-accent-subtle);
       border-radius: var(--cg-border-radius-50);
-      font-size: 10px;
-      font-weight: var(--cg-font-weight-bold);
+      font-size: var(--cg-font-size-xs);
       color: var(--cg-color-surface-base-text);
       text-transform: uppercase;
-      letter-spacing: var(--cg-letter-spacing-wide);
+      font-weight: var(--cg-font-weight-semibold);
     }
 
-    /* ── Preview surface ── */
     .preview-area {
-      max-height: 320px;
+      max-height: var(--cg-component-table-virtual-max-height);
       overflow: auto;
-      background: var(--cg-overlay-dark-subtle);
-      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
+      background: var(--cg-color-surface-cards-background);
       border-radius: var(--cg-border-radius-100);
       padding: var(--cg-spacing-12);
-      margin-bottom: var(--cg-spacing-16);
-      scrollbar-width: thin;
-      scrollbar-color: var(--cg-color-surface-cards-border-strong) transparent;
+      margin-bottom: var(--cg-spacing-12);
     }
 
     pre {
@@ -298,118 +172,107 @@ l.styles = [v, m, y, h`
       word-break: break-word;
     }
 
-    /* JSON syntax tokens — match the type colors used in the table cells. */
-    .tok-key,    .json-key    { color: var(--cg-color-code-keyword); }
-    .tok-string, .json-string { color: var(--cg-color-code-string); }
-    .tok-number, .json-number { color: var(--cg-color-code-number); }
-    .tok-bool,   .json-bool   { color: var(--cg-color-status-success-text-default); }
-    .tok-null,   .json-null   { color: var(--cg-color-input-text-placeholder); font-style: italic; }
-    .tok-date                 { color: var(--cg-color-status-info-text-default); }
+    .json-key { color: var(--cg-color-code-keyword); }
+    .json-string { color: var(--cg-color-code-string); }
+    .json-number { color: var(--cg-color-code-number); }
+    .json-bool { color: var(--cg-color-status-success-text-default); }
+    .json-null { color: var(--cg-color-input-text-placeholder); }
 
-    /* ── Table ── */
     table {
       width: 100%;
       border-collapse: collapse;
       font-size: var(--cg-font-size-xs);
     }
 
-    thead th {
+    th {
       text-align: left;
-      padding: var(--cg-spacing-8) var(--cg-spacing-12);
+      padding: var(--cg-spacing-6) var(--cg-spacing-8);
       border-bottom: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
       color: var(--cg-color-input-text-placeholder);
-      font-weight: var(--cg-font-weight-bold);
-      font-size: 10px;
-      text-transform: uppercase;
-      letter-spacing: var(--cg-letter-spacing-wide);
+      font-weight: var(--cg-font-weight-semibold);
       position: sticky;
-      top: calc(-1 * var(--cg-spacing-12));
-      background: var(--cg-color-surface-cards-emphasis);
-      backdrop-filter: blur(6px);
-    }
-
-    .col-name { display: inline-block; }
-    .col-type {
-      display: inline-block;
-      margin-left: var(--cg-spacing-6);
-      font-size: 9px;
-      font-weight: var(--cg-font-weight-medium);
-      color: var(--cg-color-input-text-placeholder);
-      opacity: 0.7;
+      top: 0;
+      background: var(--cg-color-surface-cards-background);
     }
 
-    tbody td {
-      padding: var(--cg-spacing-6) var(--cg-spacing-12);
+    td {
+      padding: var(--cg-spacing-4) var(--cg-spacing-8);
+      border-bottom: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
       color: var(--cg-color-surface-base-text);
       font-family: var(--cg-font-family-mono);
-      vertical-align: top;
-      max-width: 240px;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      border-bottom: var(--cg-border-width-50) solid transparent;
     }
 
-    /* Zebra striping for readability — the modern data-viewer default. */
-    tbody tr:nth-child(even) td { background: var(--cg-overlay-dark-subtle); }
-    tbody tr:hover td { background: var(--cg-color-action-tertiary-background-hover); }
+    tr:hover td {
+      background: var(--cg-overlay-dark-subtle);
+    }
 
     .truncated-msg {
       font-size: var(--cg-font-size-xs);
       color: var(--cg-color-input-text-placeholder);
       text-align: center;
-      padding: var(--cg-spacing-12);
+      padding: var(--cg-spacing-8);
       font-style: italic;
     }
 
-    /* ── State overlays ── */
-    .state {
+    .actions {
       display: flex;
-      flex-direction: column;
-      align-items: center;
-      justify-content: center;
       gap: var(--cg-spacing-8);
-      padding: var(--cg-spacing-32);
-      color: var(--cg-color-input-text-placeholder);
+      justify-content: flex-end;
+    }
+
+    .btn {
+      border: none;
+      border-radius: var(--cg-border-radius-100);
+      padding: var(--cg-spacing-8) var(--cg-spacing-16);
       font-size: var(--cg-font-size-sm);
+      font-weight: var(--cg-font-weight-semibold);
+      cursor: pointer;
+      font-family: inherit;
     }
-    .state.error { color: var(--cg-color-status-error-text-default); }
-    .state-icon {
-      width: var(--cg-icon-size-200);
-      height: var(--cg-icon-size-200);
-      stroke: currentColor;
+
+    .btn:focus-visible {
+      outline: 2px solid var(--cg-overlay-accent-strong);
+      outline-offset: var(--cg-outline-offset-default);
     }
 
-    /* ── Actions ── */
-    .actions {
-      display: flex;
-      gap: var(--cg-spacing-8);
-      justify-content: flex-end;
+    .btn-cancel {
+      background: transparent;
+      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
+      color: var(--cg-color-input-text-placeholder);
+    }
+
+    .btn-cancel:hover {
+      background: var(--cg-color-surface-cards-border);
+    }
+
+    .btn-confirm {
+      background: var(--cg-color-action-primary-background-default);
+      color: var(--cg-color-surface-container-background);
+    }
+    .btn-confirm:hover {
+      filter: brightness(1.1);
+    }
+
+    .btn:active {
+      transform: scale(var(--cg-interaction-press-scale));
     }
-    .actions cg-button { flex-shrink: 0; }
   `];
-d([
-  g({ attribute: !1 })
-], l.prototype, "data", 2);
-d([
-  g({ type: String })
-], l.prototype, "format", 2);
-d([
-  g({ type: Number, attribute: "max-rows" })
-], l.prototype, "maxRows", 2);
-d([
-  g({ type: String })
-], l.prototype, "title", 2);
-d([
-  g({ type: Boolean })
-], l.prototype, "loading", 2);
-d([
-  g({ type: String })
-], l.prototype, "error", 2);
-l = d([
-  b("ai-data-preview")
-], l);
+l([
+  d({ attribute: !1 })
+], c.prototype, "data", 2);
+l([
+  d({ type: String })
+], c.prototype, "format", 2);
+l([
+  d({ type: Number })
+], c.prototype, "maxRows", 2);
+l([
+  d({ type: String })
+], c.prototype, "title", 2);
+c = l([
+  p("ai-data-preview")
+], c);
 export {
-  l as AiDataPreview
+  c as AiDataPreview
 };
 //# sourceMappingURL=ai-data-preview.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ai-data-preview.js","sources":["../../../src/components/ai-data-preview/ai-data-preview.ts"],"sourcesContent":["/**\n * @element ai-data-preview\n * Structured-data preview with JSON syntax coloring, CSV/table formatting,\n * type-inferred + color-coded cell values, zebra-striped rows, schema\n * summary, loading/error/empty states, and dogfooded confirm/cancel\n * actions via <cg-button>.\n *\n * @example\n * ```html\n * <ai-data-preview\n *   .data=${[{name:'Alice', score:92}, {name:'Bob', score:87}]}\n *   format=\"table\"\n *   title=\"Training Data\"\n *   max-rows=\"25\"\n * ></ai-data-preview>\n * ```\n *\n * @fires {CustomEvent<{data: unknown, format: string}>} ai-data-confirm - Confirm clicked\n * @fires {CustomEvent} ai-data-cancel - Cancel clicked\n *\n * @cssprop [--cg-color-surface-cards-background] - Card background\n * @cssprop [--cg-color-code-keyword] - JSON key + table-string color\n * @cssprop [--cg-color-code-number] - Number cell color\n */\nimport { LitElement, html, css, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { hostBlock, reducedMotion, fadeSlideInKeyframes } from '../../styles/index.js';\nimport '../cg-button/cg-button.js';\nimport '../cg-spinner/cg-spinner.js';\n\ntype CellType = 'string' | 'number' | 'boolean' | 'null' | 'date' | 'object';\n\n@customElement('ai-data-preview')\nexport class AiDataPreview extends LitElement {\n  static override styles = [hostBlock, reducedMotion, fadeSlideInKeyframes, css`\n    :host {\n      display: block;\n      background: var(--cg-color-surface-cards-background);\n      color: var(--cg-color-surface-base-text);\n      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      border-radius: var(--cg-border-radius-150);\n      box-shadow: var(--cg-elevation-1);\n      padding: var(--cg-spacing-20);\n      animation: fadeSlideIn var(--cg-transition-duration-default) var(--cg-transition-easing-ease-out) both;\n    }\n    :host([hidden]) { display: none; }\n\n    /* ── Header ── */\n    .header {\n      display: flex;\n      justify-content: space-between;\n      align-items: flex-start;\n      gap: var(--cg-spacing-12);\n      padding-bottom: var(--cg-spacing-16);\n      border-bottom: var(--cg-border-width-50) solid var(--cg-color-surface-cards-divider);\n      margin-bottom: var(--cg-spacing-16);\n    }\n    .header-left { min-width: 0; flex: 1; }\n\n    .title {\n      font-size: var(--cg-font-size-sm);\n      font-weight: var(--cg-font-weight-semibold);\n      margin: 0 0 var(--cg-spacing-4);\n      color: var(--cg-color-surface-base-text);\n    }\n\n    .meta {\n      display: flex;\n      flex-wrap: wrap;\n      gap: var(--cg-spacing-8) var(--cg-spacing-12);\n      font-size: var(--cg-font-size-xs);\n      color: var(--cg-color-input-text-placeholder);\n      align-items: center;\n      font-variant-numeric: tabular-nums;\n    }\n\n    /* Format badge — neutral chrome, not brand-tinted (it's a type label, not a CTA). */\n    .format-badge {\n      display: inline-flex;\n      align-items: center;\n      padding: var(--cg-spacing-2) var(--cg-spacing-8);\n      background: var(--cg-color-surface-cards-emphasis);\n      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      border-radius: var(--cg-border-radius-50);\n      font-size: 10px;\n      font-weight: var(--cg-font-weight-bold);\n      color: var(--cg-color-surface-base-text);\n      text-transform: uppercase;\n      letter-spacing: var(--cg-letter-spacing-wide);\n    }\n\n    /* ── Preview surface ── */\n    .preview-area {\n      max-height: 320px;\n      overflow: auto;\n      background: var(--cg-overlay-dark-subtle);\n      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      border-radius: var(--cg-border-radius-100);\n      padding: var(--cg-spacing-12);\n      margin-bottom: var(--cg-spacing-16);\n      scrollbar-width: thin;\n      scrollbar-color: var(--cg-color-surface-cards-border-strong) transparent;\n    }\n\n    pre {\n      margin: 0;\n      font-family: var(--cg-font-family-mono);\n      font-size: var(--cg-font-size-xs);\n      line-height: var(--cg-line-height-relaxed);\n      white-space: pre-wrap;\n      word-break: break-word;\n    }\n\n    /* JSON syntax tokens — match the type colors used in the table cells. */\n    .tok-key,    .json-key    { color: var(--cg-color-code-keyword); }\n    .tok-string, .json-string { color: var(--cg-color-code-string); }\n    .tok-number, .json-number { color: var(--cg-color-code-number); }\n    .tok-bool,   .json-bool   { color: var(--cg-color-status-success-text-default); }\n    .tok-null,   .json-null   { color: var(--cg-color-input-text-placeholder); font-style: italic; }\n    .tok-date                 { color: var(--cg-color-status-info-text-default); }\n\n    /* ── Table ── */\n    table {\n      width: 100%;\n      border-collapse: collapse;\n      font-size: var(--cg-font-size-xs);\n    }\n\n    thead th {\n      text-align: left;\n      padding: var(--cg-spacing-8) var(--cg-spacing-12);\n      border-bottom: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      color: var(--cg-color-input-text-placeholder);\n      font-weight: var(--cg-font-weight-bold);\n      font-size: 10px;\n      text-transform: uppercase;\n      letter-spacing: var(--cg-letter-spacing-wide);\n      position: sticky;\n      top: calc(-1 * var(--cg-spacing-12));\n      background: var(--cg-color-surface-cards-emphasis);\n      backdrop-filter: blur(6px);\n    }\n\n    .col-name { display: inline-block; }\n    .col-type {\n      display: inline-block;\n      margin-left: var(--cg-spacing-6);\n      font-size: 9px;\n      font-weight: var(--cg-font-weight-medium);\n      color: var(--cg-color-input-text-placeholder);\n      opacity: 0.7;\n    }\n\n    tbody td {\n      padding: var(--cg-spacing-6) var(--cg-spacing-12);\n      color: var(--cg-color-surface-base-text);\n      font-family: var(--cg-font-family-mono);\n      vertical-align: top;\n      max-width: 240px;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      border-bottom: var(--cg-border-width-50) solid transparent;\n    }\n\n    /* Zebra striping for readability — the modern data-viewer default. */\n    tbody tr:nth-child(even) td { background: var(--cg-overlay-dark-subtle); }\n    tbody tr:hover td { background: var(--cg-color-action-tertiary-background-hover); }\n\n    .truncated-msg {\n      font-size: var(--cg-font-size-xs);\n      color: var(--cg-color-input-text-placeholder);\n      text-align: center;\n      padding: var(--cg-spacing-12);\n      font-style: italic;\n    }\n\n    /* ── State overlays ── */\n    .state {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      gap: var(--cg-spacing-8);\n      padding: var(--cg-spacing-32);\n      color: var(--cg-color-input-text-placeholder);\n      font-size: var(--cg-font-size-sm);\n    }\n    .state.error { color: var(--cg-color-status-error-text-default); }\n    .state-icon {\n      width: var(--cg-icon-size-200);\n      height: var(--cg-icon-size-200);\n      stroke: currentColor;\n    }\n\n    /* ── Actions ── */\n    .actions {\n      display: flex;\n      gap: var(--cg-spacing-8);\n      justify-content: flex-end;\n    }\n    .actions cg-button { flex-shrink: 0; }\n  `];\n\n  @property({ attribute: false }) data: unknown = null;\n  @property({ type: String }) format: 'json' | 'csv' | 'table' = 'json';\n  @property({ type: Number, attribute: 'max-rows' }) maxRows = 50;\n  @property({ type: String }) override title = 'Data Preview';\n  @property({ type: Boolean }) loading = false;\n  @property({ type: String }) error = '';\n\n  // ─── Helpers ────────────────────────────────────────────────────────────\n\n  private _getRowCount(): number {\n    if (Array.isArray(this.data)) return this.data.length;\n    if (typeof this.data === 'string' && this.format === 'csv') {\n      return Math.max(0, this.data.split('\\n').filter(Boolean).length - 1);\n    }\n    return 0;\n  }\n\n  private _getSize(): string {\n    try {\n      const json = typeof this.data === 'string' ? this.data : JSON.stringify(this.data);\n      const bytes = new Blob([json]).size;\n      if (bytes < 1024) return `${bytes} B`;\n      if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;\n      return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;\n    } catch {\n      return '0 B';\n    }\n  }\n\n  /** Detect column type by sampling values across rows. */\n  private _inferColumnType(rows: Record<string, unknown>[], key: string): CellType {\n    let nullCount = 0;\n    let sampled = 0;\n    let kind: CellType | null = null;\n    for (const row of rows) {\n      const v = row[key];\n      if (v === null || v === undefined || v === '') { nullCount++; continue; }\n      sampled++;\n      const t = this._cellType(v);\n      // Promote conflicting types to 'string'.\n      if (kind && kind !== t) return 'string';\n      kind = t;\n      if (sampled > 25) break;\n    }\n    if (sampled === 0) return nullCount > 0 ? 'null' : 'string';\n    return kind ?? 'string';\n  }\n\n  private _cellType(v: unknown): CellType {\n    if (v === null || v === undefined) return 'null';\n    if (typeof v === 'boolean') return 'boolean';\n    if (typeof v === 'number') return 'number';\n    if (typeof v === 'object') return 'object';\n    if (typeof v === 'string') {\n      // Try numeric-looking strings (CSV input arrives as strings).\n      if (/^-?\\d+(\\.\\d+)?$/.test(v)) return 'number';\n      if (v === 'true' || v === 'false') return 'boolean';\n      if (v === 'null') return 'null';\n      // Loose ISO date detect\n      if (/^\\d{4}-\\d{2}-\\d{2}/.test(v) && !isNaN(Date.parse(v))) return 'date';\n      return 'string';\n    }\n    return 'string';\n  }\n\n  private _typeClass(t: CellType): string {\n    switch (t) {\n      case 'number':  return 'tok-number';\n      case 'boolean': return 'tok-bool';\n      case 'null':    return 'tok-null';\n      case 'date':    return 'tok-date';\n      case 'object':  return 'tok-string';\n      default:        return 'tok-string';\n    }\n  }\n\n  private _formatCell(v: unknown, t: CellType): string {\n    if (v === null || v === undefined) return 'null';\n    if (t === 'object') {\n      try { return JSON.stringify(v); } catch { return String(v); }\n    }\n    return String(v);\n  }\n\n  // ─── JSON syntax highlight ──────────────────────────────────────────────\n\n  private _syntaxHighlight(json: string): ReturnType<typeof html> {\n    const parts: Array<ReturnType<typeof html>> = [];\n    const regex = /(\"(\\\\u[\\dA-Fa-f]{4}|\\\\[^u]|[^\\\\\"])*\"(\\s*:)?|\\b(true|false|null)\\b|-?\\d+(?:\\.\\d*)?(?:[eE][+-]?\\d+)?)/g;\n    let lastIndex = 0;\n    let match: RegExpExecArray | null;\n    while ((match = regex.exec(json)) !== null) {\n      if (match.index > lastIndex) {\n        parts.push(html`${json.substring(lastIndex, match.index)}`);\n      }\n      const val = match[0];\n      let cls = 'json-number';\n      if (/^\"/.test(val)) cls = match[3] ? 'json-key' : 'json-string';\n      else if (/true|false/.test(val)) cls = 'json-bool';\n      else if (/null/.test(val)) cls = 'json-null';\n      parts.push(html`<span class=${cls}>${val}</span>`);\n      lastIndex = regex.lastIndex;\n    }\n    if (lastIndex < json.length) parts.push(html`${json.substring(lastIndex)}`);\n    return html`${parts}`;\n  }\n\n  // ─── Renderers ──────────────────────────────────────────────────────────\n\n  private _renderJson() {\n    try {\n      const str = typeof this.data === 'string' ? this.data : JSON.stringify(this.data, null, 2);\n      return html`<pre>${this._syntaxHighlight(str)}</pre>`;\n    } catch {\n      return html`<pre>${String(this.data)}</pre>`;\n    }\n  }\n\n  private _renderTable(rows: Record<string, unknown>[], truncated: boolean) {\n    if (rows.length === 0) {\n      return html`\n        <div class=\"state\">\n          <svg class=\"state-icon\" viewBox=\"0 0 24 24\" fill=\"none\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n            <path d=\"M3 6.5a2.5 2.5 0 0 1 2.5-2.5h13A2.5 2.5 0 0 1 21 6.5v11a2.5 2.5 0 0 1-2.5 2.5h-13A2.5 2.5 0 0 1 3 17.5z\"/>\n            <path d=\"M3 10h18M9 4v16\"/>\n          </svg>\n          <span>No data to preview</span>\n        </div>\n      `;\n    }\n    const keys = Object.keys(rows[0] as Record<string, unknown>);\n    const types: Record<string, CellType> = {};\n    for (const k of keys) types[k] = this._inferColumnType(rows, k);\n\n    return html`\n      <table aria-label=\"Data table\">\n        <thead>\n          <tr>\n            ${keys.map(k => html`\n              <th scope=\"col\">\n                <span class=\"col-name\">${k}</span>\n                <span class=\"col-type\">${types[k]}</span>\n              </th>\n            `)}\n          </tr>\n        </thead>\n        <tbody>\n          ${rows.map(row => html`\n            <tr>\n              ${keys.map(k => {\n                const t = this._cellType(row[k]) === 'null' ? 'null' : types[k]!;\n                const display = this._formatCell(row[k], t);\n                return html`<td title=${display}><span class=${this._typeClass(t)}>${display}</span></td>`;\n              })}\n            </tr>\n          `)}\n        </tbody>\n      </table>\n      ${truncated ? html`<div class=\"truncated-msg\">Showing ${rows.length} of ${this._getRowCount()} rows</div>` : nothing}\n    `;\n  }\n\n  private _renderCsv() {\n    if (typeof this.data !== 'string') return this._renderJson();\n    const lines = this.data.split('\\n').filter(Boolean);\n    if (lines.length === 0) return html`<pre>${this.data}</pre>`;\n    const headers = lines[0]!.split(',').map(h => h.trim());\n    const dataLines = lines.slice(1, this.maxRows + 1);\n    const rows = dataLines.map(line => {\n      const vals = line.split(',');\n      const obj: Record<string, string> = {};\n      headers.forEach((h, i) => { obj[h] = (vals[i] || '').trim(); });\n      return obj;\n    });\n    return this._renderTable(rows, lines.length - 1 > this.maxRows);\n  }\n\n  private _renderContent() {\n    if (this.loading) {\n      return html`\n        <div class=\"state\">\n          <cg-spinner size=\"md\"></cg-spinner>\n          <span>Parsing data…</span>\n        </div>\n      `;\n    }\n    if (this.error) {\n      return html`\n        <div class=\"state error\" role=\"alert\">\n          <svg class=\"state-icon\" viewBox=\"0 0 24 24\" fill=\"none\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n            <circle cx=\"12\" cy=\"12\" r=\"9\"/>\n            <path d=\"M12 8v5M12 16h.01\"/>\n          </svg>\n          <span>${this.error}</span>\n        </div>\n      `;\n    }\n    if (this.format === 'csv') return this._renderCsv();\n    if (this.format === 'table' || (Array.isArray(this.data) && typeof this.data[0] === 'object')) {\n      const arr = Array.isArray(this.data) ? this.data : [this.data];\n      const limited = arr.slice(0, this.maxRows);\n      return this._renderTable(limited as Record<string, unknown>[], arr.length > this.maxRows);\n    }\n    return this._renderJson();\n  }\n\n  private _onConfirm(): void {\n    this.dispatchEvent(new CustomEvent('ai-data-confirm', {\n      bubbles: true, composed: true,\n      detail: { data: this.data, format: this.format },\n    }));\n  }\n\n  private _onCancel(): void {\n    this.dispatchEvent(new CustomEvent('ai-data-cancel', {\n      bubbles: true, composed: true,\n    }));\n  }\n\n  override render() {\n    const rowCount = this._getRowCount();\n    let colCount = 0;\n    if (Array.isArray(this.data) && this.data.length > 0 && typeof this.data[0] === 'object' && this.data[0] !== null) {\n      colCount = Object.keys(this.data[0] as Record<string, unknown>).length;\n    } else if (this.format === 'csv' && typeof this.data === 'string') {\n      const firstLine = this.data.split('\\n')[0];\n      colCount = firstLine ? firstLine.split(',').length : 0;\n    }\n\n    return html`\n      <div class=\"header\">\n        <div class=\"header-left\">\n          <h3 class=\"title\">${this.title}</h3>\n          <div class=\"meta\">\n            <span class=\"format-badge\">${this.format}</span>\n            ${rowCount > 0 ? html`<span>${rowCount.toLocaleString()} ${rowCount === 1 ? 'row' : 'rows'}</span>` : nothing}\n            ${colCount > 0 ? html`<span>· ${colCount} ${colCount === 1 ? 'col' : 'cols'}</span>` : nothing}\n            <span>· ${this._getSize()}</span>\n          </div>\n        </div>\n      </div>\n\n      <div class=\"preview-area\" role=\"region\" aria-label=\"Data preview\" tabindex=\"0\">\n        ${this._renderContent()}\n      </div>\n\n      <div class=\"actions\">\n        <cg-button variant=\"secondary\" size=\"sm\" @click=${this._onCancel}>\n          Cancel\n        </cg-button>\n        <cg-button variant=\"primary\" size=\"sm\" @click=${this._onConfirm} ?disabled=${!!this.error || this.loading}>\n          Confirm\n        </cg-button>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ai-data-preview': AiDataPreview;\n  }\n}\n"],"names":["AiDataPreview","LitElement","json","bytes","rows","key","nullCount","sampled","kind","row","v","t","parts","regex","lastIndex","match","html","val","cls","str","truncated","keys","types","k","display","nothing","lines","headers","h","line","vals","obj","i","arr","limited","rowCount","colCount","firstLine","hostBlock","reducedMotion","fadeSlideInKeyframes","css","__decorateClass","property","customElement"],"mappings":"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"}
+{"version":3,"file":"ai-data-preview.js","sources":["../../../src/components/ai-data-preview/ai-data-preview.ts"],"sourcesContent":["/**\n * @element ai-data-preview\n * Structured data preview with JSON syntax coloring, CSV/table formatting, and confirm/cancel actions.\n *\n * @example\n * ```html\n * <ai-data-preview\n *   .data=${[{name:'Alice', score:92}, {name:'Bob', score:87}]}\n *   format=\"table\"\n *   title=\"Training Data\"\n *   maxRows=\"25\"\n * ></ai-data-preview>\n * ```\n *\n * @fires {CustomEvent<{data: unknown, format: string}>} ai-data-confirm - Confirm button clicked\n * @fires {CustomEvent} ai-data-cancel - Cancel button clicked\n *\n * @cssprop [--cg-color-accent=#dfff61] - Confirm button and JSON key color\n */\nimport { LitElement, html, css, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { hostBlock, reducedMotion, fadeSlideInKeyframes } from '../../styles/index.js';\n\n@customElement('ai-data-preview')\nexport class AiDataPreview extends LitElement {\n  static override styles = [hostBlock, reducedMotion, fadeSlideInKeyframes, css`\n    :host {\n      background: var(--cg-color-surface-base-background);\n      color: var(--cg-color-surface-base-text);\n      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      border-radius: var(--cg-border-radius-150);\n      padding: var(--cg-spacing-16);\n      animation: fadeSlideIn var(--cg-transition-duration-fast) var(--cg-transition-easing-ease-out) both;\n    }\n    :host([hidden]) { display: none; }\n\n    .header {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      padding-bottom: var(--cg-spacing-12);\n      border-bottom: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      margin-bottom: var(--cg-spacing-12);\n    }\n\n    .title {\n      font-size: var(--cg-font-size-sm);\n      font-weight: var(--cg-font-weight-semibold);\n      margin: 0;\n    }\n\n    .meta {\n      display: flex;\n      gap: var(--cg-spacing-12);\n      font-size: var(--cg-font-size-xs);\n      color: var(--cg-color-input-text-placeholder);\n    }\n\n    .format-badge {\n      padding: var(--cg-spacing-2) var(--cg-spacing-8);\n      background: var(--cg-overlay-accent-subtle);\n      border-radius: var(--cg-border-radius-50);\n      font-size: var(--cg-font-size-xs);\n      color: var(--cg-color-surface-base-text);\n      text-transform: uppercase;\n      font-weight: var(--cg-font-weight-semibold);\n    }\n\n    .preview-area {\n      max-height: var(--cg-component-table-virtual-max-height);\n      overflow: auto;\n      background: var(--cg-color-surface-cards-background);\n      border-radius: var(--cg-border-radius-100);\n      padding: var(--cg-spacing-12);\n      margin-bottom: var(--cg-spacing-12);\n    }\n\n    pre {\n      margin: 0;\n      font-family: var(--cg-font-family-mono);\n      font-size: var(--cg-font-size-xs);\n      line-height: var(--cg-line-height-relaxed);\n      white-space: pre-wrap;\n      word-break: break-word;\n    }\n\n    .json-key { color: var(--cg-color-code-keyword); }\n    .json-string { color: var(--cg-color-code-string); }\n    .json-number { color: var(--cg-color-code-number); }\n    .json-bool { color: var(--cg-color-status-success-text-default); }\n    .json-null { color: var(--cg-color-input-text-placeholder); }\n\n    table {\n      width: 100%;\n      border-collapse: collapse;\n      font-size: var(--cg-font-size-xs);\n    }\n\n    th {\n      text-align: left;\n      padding: var(--cg-spacing-6) var(--cg-spacing-8);\n      border-bottom: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      color: var(--cg-color-input-text-placeholder);\n      font-weight: var(--cg-font-weight-semibold);\n      position: sticky;\n      top: 0;\n      background: var(--cg-color-surface-cards-background);\n    }\n\n    td {\n      padding: var(--cg-spacing-4) var(--cg-spacing-8);\n      border-bottom: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      color: var(--cg-color-surface-base-text);\n      font-family: var(--cg-font-family-mono);\n    }\n\n    tr:hover td {\n      background: var(--cg-overlay-dark-subtle);\n    }\n\n    .truncated-msg {\n      font-size: var(--cg-font-size-xs);\n      color: var(--cg-color-input-text-placeholder);\n      text-align: center;\n      padding: var(--cg-spacing-8);\n      font-style: italic;\n    }\n\n    .actions {\n      display: flex;\n      gap: var(--cg-spacing-8);\n      justify-content: flex-end;\n    }\n\n    .btn {\n      border: none;\n      border-radius: var(--cg-border-radius-100);\n      padding: var(--cg-spacing-8) var(--cg-spacing-16);\n      font-size: var(--cg-font-size-sm);\n      font-weight: var(--cg-font-weight-semibold);\n      cursor: pointer;\n      font-family: inherit;\n    }\n\n    .btn:focus-visible {\n      outline: 2px solid var(--cg-overlay-accent-strong);\n      outline-offset: var(--cg-outline-offset-default);\n    }\n\n    .btn-cancel {\n      background: transparent;\n      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      color: var(--cg-color-input-text-placeholder);\n    }\n\n    .btn-cancel:hover {\n      background: var(--cg-color-surface-cards-border);\n    }\n\n    .btn-confirm {\n      background: var(--cg-color-action-primary-background-default);\n      color: var(--cg-color-surface-container-background);\n    }\n    .btn-confirm:hover {\n      filter: brightness(1.1);\n    }\n\n    .btn:active {\n      transform: scale(var(--cg-interaction-press-scale));\n    }\n  `];\n  @property({ attribute: false }) data: unknown = null;\n  @property({ type: String }) format: 'json' | 'csv' | 'table' = 'json';\n  @property({ type: Number }) maxRows = 50;\n  @property({ type: String }) override title = 'Data Preview';\n\n  private _getRowCount(): number {\n    if (Array.isArray(this.data)) return this.data.length;\n    if (typeof this.data === 'string' && this.format === 'csv') {\n      return this.data.split('\\n').filter(Boolean).length - 1;\n    }\n    return 0;\n  }\n\n  private _getSize(): string {\n    const json = typeof this.data === 'string' ? this.data : JSON.stringify(this.data);\n    const bytes = new Blob([json]).size;\n    if (bytes < 1024) return `${bytes} B`;\n    if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;\n    return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;\n  }\n\n  private _syntaxHighlight(json: string): ReturnType<typeof html> {\n    const parts: Array<ReturnType<typeof html>> = [];\n    const regex = /(\"(\\\\u[\\dA-Fa-f]{4}|\\\\[^u]|[^\\\\\"])*\"(\\s*:)?|\\b(true|false|null)\\b|-?\\d+(?:\\.\\d*)?(?:[eE][+-]?\\d+)?)/g;\n    let lastIndex = 0;\n    let match: RegExpExecArray | null;\n\n    while ((match = regex.exec(json)) !== null) {\n      if (match.index > lastIndex) {\n        parts.push(html`${json.substring(lastIndex, match.index)}`);\n      }\n      const val = match[0];\n      let cls = 'json-number';\n      if (/^\"/.test(val)) {\n        cls = match[3] ? 'json-key' : 'json-string';\n      } else if (/true|false/.test(val)) {\n        cls = 'json-bool';\n      } else if (/null/.test(val)) {\n        cls = 'json-null';\n      }\n      parts.push(html`<span class=${cls}>${val}</span>`);\n      lastIndex = regex.lastIndex;\n    }\n    if (lastIndex < json.length) {\n      parts.push(html`${json.substring(lastIndex)}`);\n    }\n    return html`${parts}`;\n  }\n\n  private _renderJson() {\n    try {\n      const str = typeof this.data === 'string' ? this.data : JSON.stringify(this.data, null, 2);\n      return html`<pre>${this._syntaxHighlight(str)}</pre>`;\n    } catch {\n      return html`<pre>${String(this.data)}</pre>`;\n    }\n  }\n\n  private _renderTable(rows: Record<string, unknown>[], truncated: boolean) {\n    if (rows.length === 0) return html`<div class=\"truncated-msg\">No data</div>`;\n    const keys = Object.keys(rows[0] as Record<string, unknown>);\n    return html`\n      <table role=\"table\" aria-label=\"Data table\">\n        <thead><tr>${keys.map(k => html`<th scope=\"col\">${k}</th>`)}</tr></thead>\n        <tbody>\n          ${rows.map(row => html`\n            <tr>${keys.map(k => html`<td>${String(row[k] ?? '')}</td>`)}</tr>\n          `)}\n        </tbody>\n      </table>\n      ${truncated ? html`<div class=\"truncated-msg\">Showing ${rows.length} of ${this._getRowCount()} rows</div>` : nothing}\n    `;\n  }\n\n  private _renderCsv() {\n    if (typeof this.data !== 'string') return this._renderJson();\n    const lines = this.data.split('\\n').filter(Boolean);\n    if (lines.length === 0) return html`<pre>${this.data}</pre>`;\n    const headers = lines[0]!.split(',').map(h => h.trim());\n    const dataLines = lines.slice(1, this.maxRows + 1);\n    const rows = dataLines.map(line => {\n      const vals = line.split(',');\n      const obj: Record<string, string> = {};\n      headers.forEach((h, i) => { obj[h] = (vals[i] || '').trim(); });\n      return obj;\n    });\n    return this._renderTable(rows, lines.length - 1 > this.maxRows);\n  }\n\n  private _renderContent() {\n    if (this.format === 'csv') return this._renderCsv();\n    if (this.format === 'table' || (Array.isArray(this.data) && typeof this.data[0] === 'object')) {\n      const arr = Array.isArray(this.data) ? this.data : [this.data];\n      const limited = arr.slice(0, this.maxRows);\n      return this._renderTable(limited as Record<string, unknown>[], arr.length > this.maxRows);\n    }\n    return this._renderJson();\n  }\n\n  private _onConfirm(): void {\n    this.dispatchEvent(new CustomEvent('ai-data-confirm', {\n      bubbles: true, composed: true,\n      detail: { data: this.data, format: this.format },\n    }));\n  }\n\n  private _onCancel(): void {\n    this.dispatchEvent(new CustomEvent('ai-data-cancel', {\n      bubbles: true, composed: true,\n    }));\n  }\n\n  override render() {\n    const rowCount = this._getRowCount();\n\n    return html`\n      <div class=\"header\">\n        <div>\n          <h3 class=\"title\">${this.title}</h3>\n          <div class=\"meta\">\n            <span class=\"format-badge\">${this.format}</span>\n            ${rowCount > 0 ? html`<span>${rowCount} rows</span>` : nothing}\n            <span>${this._getSize()}</span>\n          </div>\n        </div>\n      </div>\n      <div class=\"preview-area\" role=\"region\" aria-label=\"Data preview\" tabindex=\"0\">\n        ${this._renderContent()}\n      </div>\n      <div class=\"actions\">\n        <button class=\"btn btn-cancel\" @click=${this._onCancel}\n                aria-label=\"Cancel\" tabindex=\"0\">Cancel</button>\n        <button class=\"btn btn-confirm\" @click=${this._onConfirm}\n                aria-label=\"Confirm data\" tabindex=\"0\">Confirm</button>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ai-data-preview': AiDataPreview;\n  }\n}\n"],"names":["AiDataPreview","LitElement","json","bytes","parts","regex","lastIndex","match","html","val","cls","str","rows","truncated","keys","k","row","nothing","lines","headers","h","line","vals","obj","i","arr","limited","rowCount","hostBlock","reducedMotion","fadeSlideInKeyframes","css","__decorateClass","property","customElement"],"mappings":"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"}