@frontera-sdk/chat-ui 1.50.79 → 1.50.80

package/dist/vega-chart-block-NQADYNWQ.js

@@ -1,2857 +0,0 @@
-'use client';
-import { ChartBlockSkeleton, RawJsonFallback, ChartReadout, ChartErrorBoundary, buildVegaTheme, PRIMARY_COLOR, format } from './chunk-6BPHEBCF.js';
-import { useIsMobile } from './chunk-IXDM5R55.js';
-import { ArrowsShowIcon } from './chunk-AFVU5VT6.js';
-import './chunk-PR4QN5HX.js';
-import { memo, useState, useMemo, useEffect, useCallback, useRef } from 'react';
-import vegaEmbed from 'vega-embed';
-import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
-
-// src/vendor/lib/charts/util.ts
-var FALLBACK_PALETTE = [
-  "#5b8dee",
-  "#3dab82",
-  "#e8883e",
-  "#9b7ef5",
-  "#e05c78",
-  "#3ab5cc",
-  "#a4b83a",
-  "#d47a4a",
-  "#748cd4",
-  "#4cad6a",
-  "#c47eb5",
-  "#d4a43e",
-  "#e87860",
-  "#4890c4",
-  "#8eb43e",
-  "#b45e78",
-  "#3ea8a0",
-  "#d4784a",
-  "#7858c4",
-  "#58a458",
-  "#e08898",
-  "#c4a858",
-  "#5888d4",
-  "#c46848"
-];
-function resolveCssVar(name, fallback = "") {
-  if (typeof window === "undefined" || typeof document === "undefined") return fallback;
-  const value = getComputedStyle(document.documentElement).getPropertyValue(name).trim();
-  return value || fallback;
-}
-function resolveCategoryPalette() {
-  const colors = [];
-  for (let i = 1; i <= 24; i++) {
-    const resolved = resolveCssVar(`--chart-${i}`);
-    colors.push(resolved || FALLBACK_PALETTE[i - 1]);
-  }
-  return colors;
-}
-function resolveHeatmapRange() {
-  const resolved = [];
-  for (let i = 1; i <= 9; i++) {
-    const v = resolveCssVar(`--chart-heatmap-${i}`);
-    if (v) resolved.push(v);
-  }
-  if (resolved.length > 0) return resolved;
-  return ["#eef2ff", "#e0e7ff", "#c7d2fe", "#a5b4fc", "#818cf8", "#6366f1", "#4f46e5", "#4338ca", "#3730a3"];
-}
-
-// src/vendor/lib/charts/vega/theme.ts
-function isDarkBackground(hex) {
-  const clean = hex.replace("#", "");
-  if (clean.length !== 6) return false;
-  const r = parseInt(clean.slice(0, 2), 16);
-  const g = parseInt(clean.slice(2, 4), 16);
-  const b = parseInt(clean.slice(4, 6), 16);
-  const luminance = (0.2126 * r + 0.7152 * g + 0.0722 * b) / 255;
-  return luminance < 0.5;
-}
-function resolveSebatiTheme() {
-  const foreground = resolveCssVar("--foreground", "#111111");
-  const mutedForeground = resolveCssVar("--muted-foreground", "#666666");
-  const border = resolveCssVar("--border", "#e5e7eb");
-  const background = resolveCssVar("--background", "#ffffff");
-  return {
-    background,
-    foreground,
-    mutedForeground,
-    border,
-    grid: border,
-    fontFamily: "Inter, ui-sans-serif, system-ui, sans-serif",
-    category: resolveCategoryPalette(),
-    heatmapRange: resolveHeatmapRange(),
-    isDark: isDarkBackground(background)
-  };
-}
-function getSebatiVegaConfig(theme) {
-  return {
-    background: "transparent",
-    font: theme.fontFamily,
-    padding: { top: 8, bottom: 8, left: 4, right: 12 },
-    arc: { fill: theme.category[0] },
-    bar: { fill: theme.category[0] },
-    line: { stroke: theme.category[0], strokeWidth: 1.5 },
-    area: { fillOpacity: 0.5, line: true, color: theme.category[0] },
-    point: { filled: true, size: 60 },
-    rect: { stroke: theme.background, strokeWidth: 1 },
-    axisY: {
-      gridColor: theme.grid,
-      labelColor: theme.mutedForeground,
-      tickColor: theme.border,
-      domain: false,
-      titleColor: theme.foreground,
-      titleFontWeight: 500
-    },
-    axisX: {
-      grid: false,
-      labelColor: theme.mutedForeground,
-      tickColor: theme.border,
-      domainColor: theme.border,
-      titleColor: theme.foreground,
-      titleFontWeight: 500
-    },
-    legend: {
-      labelColor: theme.foreground,
-      titleColor: theme.foreground,
-      symbolStrokeWidth: 0,
-      orient: "top"
-    },
-    view: { stroke: "transparent" },
-    range: {
-      category: theme.category,
-      heatmap: theme.heatmapRange
-    },
-    numberFormat: "s",
-    customFormatTypes: true
-  };
-}
-
-// src/vendor/lib/charts/vega/tooltip.ts
-var TOOLTIP_ID = "sebati-chart-tooltip";
-var STYLE_ID = "sebati-chart-tooltip-style";
-var TOOLTIP_CSS = `
-#${TOOLTIP_ID} {
-  visibility: hidden;
-  position: fixed;
-  z-index: 10000;
-  pointer-events: none;
-  padding: 0;
-  font-family: inherit;
-  font-size: 12px;
-  line-height: 1.4;
-  border-radius: 6px;
-  box-shadow: 0 4px 6px -1px rgba(0,0,0,.1), 0 2px 4px -2px rgba(0,0,0,.1);
-  background-color: var(--surface-overlay, var(--popover, #1a1a1a));
-  color: var(--popover-foreground, #e5e5e5);
-  border: 1px solid var(--border, #333);
-  max-width: 300px;
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-}
-#${TOOLTIP_ID}.visible { visibility: visible; }
-/* When pinned, the tooltip stays put and accepts clicks so users can copy
-   values or dismiss via the close button. The ring signals "this is locked
-   in" without shouting for attention. */
-#${TOOLTIP_ID}.pinned {
-  pointer-events: auto;
-  box-shadow: 0 0 0 2px var(--ring, #4C40F8), 0 8px 24px -6px rgba(0,0,0,.25);
-}
-#${TOOLTIP_ID} .tt-close {
-  position: absolute;
-  top: 4px;
-  right: 4px;
-  width: 18px;
-  height: 18px;
-  display: none;
-  align-items: center;
-  justify-content: center;
-  border: 0;
-  padding: 0;
-  background: transparent;
-  color: var(--muted-foreground, #999);
-  border-radius: 4px;
-  cursor: pointer;
-  font-size: 14px;
-  line-height: 1;
-}
-#${TOOLTIP_ID}.pinned .tt-close { display: flex; }
-#${TOOLTIP_ID}.pinned .tt-header { padding-right: 28px; }
-#${TOOLTIP_ID} .tt-close:hover {
-  background: var(--surface-hover, rgba(255,255,255,.06));
-  color: var(--foreground, #e5e5e5);
-}
-#${TOOLTIP_ID} .tt-header {
-  font-weight: 500;
-  flex-shrink: 0;
-  padding: 8px 12px 4px;
-  border-bottom: 1px solid var(--border, #333);
-}
-#${TOOLTIP_ID} .tt-body {
-  overflow-y: auto;
-  padding: 4px 12px 8px;
-  scrollbar-width: thin;
-}
-#${TOOLTIP_ID} .tt-row {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  padding: 1px 0;
-}
-#${TOOLTIP_ID} .tt-dot {
-  width: 10px; height: 10px;
-  border-radius: 50%;
-  flex-shrink: 0;
-}
-#${TOOLTIP_ID} .tt-key { color: var(--muted-foreground, #999); }
-#${TOOLTIP_ID} .tt-value { font-weight: 500; margin-left: auto; }
-`;
-function ensureStyle() {
-  if (typeof document === "undefined") return;
-  if (document.getElementById(STYLE_ID)) return;
-  const s = document.createElement("style");
-  s.id = STYLE_ID;
-  s.textContent = TOOLTIP_CSS;
-  document.head.appendChild(s);
-}
-function getTooltipEl() {
-  if (typeof document === "undefined") return null;
-  let el = document.getElementById(TOOLTIP_ID);
-  if (!el) {
-    el = document.createElement("div");
-    el.id = TOOLTIP_ID;
-    document.body.appendChild(el);
-  }
-  return el;
-}
-var fmtCache = /* @__PURE__ */ new Map();
-function getD3Fmt(spec) {
-  let fn = fmtCache.get(spec);
-  if (!fn) {
-    try {
-      fn = format(spec);
-    } catch {
-      fn = (n) => n.toLocaleString();
-    }
-    fmtCache.set(spec, fn);
-  }
-  return fn;
-}
-function fmtValue(v, fieldType, format2) {
-  if (v == null) return "\u2014";
-  if (typeof v === "number" && Number.isNaN(v)) return "\u2014";
-  if (typeof v === "number") {
-    if (format2) return getD3Fmt(format2)(v);
-    if (fieldType === "temporal" || v > 9466848e5 && v < 41024448e5) {
-      try {
-        const d = new Date(v);
-        if (!isNaN(d.getTime())) return d.toLocaleDateString("en-US", { year: "numeric", month: "short", day: "numeric" });
-      } catch {
-      }
-    }
-    const abs = Math.abs(v);
-    if (abs >= 1e12) return (v / 1e12).toLocaleString(void 0, { minimumFractionDigits: 1, maximumFractionDigits: 1 }) + "T";
-    if (abs >= 1e9) return (v / 1e9).toLocaleString(void 0, { minimumFractionDigits: 1, maximumFractionDigits: 1 }) + "B";
-    if (abs >= 1e6) return (v / 1e6).toLocaleString(void 0, { minimumFractionDigits: 1, maximumFractionDigits: 1 }) + "M";
-    if (abs >= 1e3) return (v / 1e3).toLocaleString(void 0, { minimumFractionDigits: 1, maximumFractionDigits: 1 }) + "K";
-    if (Number.isInteger(v)) return v.toLocaleString();
-    return parseFloat(v.toPrecision(4)).toLocaleString();
-  }
-  if (typeof v === "string") {
-    if (/^\d{4}-\d{2}-\d{2}/.test(v)) {
-      try {
-        const d = new Date(v);
-        if (!isNaN(d.getTime())) return d.toLocaleDateString("en-US", { year: "numeric", month: "short", day: "numeric" });
-      } catch {
-      }
-    }
-    const siMatch = v.match(/^([+-]?[\d.]+)\s*([mµnpfakMGTPEZY])?$/);
-    if (siMatch && (siMatch[2] || siMatch[1].includes("."))) {
-      const SI = {
-        f: 1e-15,
-        p: 1e-12,
-        n: 1e-9,
-        \u00B5: 1e-6,
-        m: 1e-3,
-        k: 1e3,
-        M: 1e6,
-        G: 1e9,
-        T: 1e12,
-        P: 1e15,
-        E: 1e18
-      };
-      const base = parseFloat(siMatch[1]);
-      const multiplier = siMatch[2] ? SI[siMatch[2]] ?? 1 : 1;
-      const num = base * multiplier;
-      if (!isNaN(num)) return fmtValue(num, fieldType, format2);
-    }
-  }
-  return String(v);
-}
-function positionTooltip(el, event) {
-  const x = event.clientX + 12;
-  const y = event.clientY + 12;
-  const maxX = window.innerWidth - el.offsetWidth - 8;
-  const maxY = window.innerHeight - el.offsetHeight - 8;
-  el.style.left = `${Math.min(x, maxX)}px`;
-  el.style.top = `${Math.min(y, maxY)}px`;
-}
-var SCENE_KEYS = /* @__PURE__ */ new Set([
-  "datum",
-  "mark",
-  "bounds",
-  "stroke",
-  "strokeDash",
-  "strokeWidth",
-  "strokeOpacity",
-  "fill",
-  "fillOpacity",
-  "opacity",
-  "tooltip",
-  "description",
-  "exit",
-  "enter",
-  "update",
-  "x",
-  "y",
-  "x2",
-  "y2",
-  "width",
-  "height",
-  "size",
-  "shape",
-  "path",
-  "items",
-  "marktype",
-  "role",
-  "interactive",
-  "clip",
-  "zindex",
-  "_vgsid_"
-]);
-function pickDatum(item, value) {
-  let rawDatum = null;
-  if (item && typeof item === "object") {
-    const i = item;
-    if (i.datum && typeof i.datum === "object") {
-      const d = i.datum;
-      rawDatum = d.datum && typeof d.datum === "object" && !Array.isArray(d.datum) ? d.datum : i.datum;
-    }
-  }
-  let tooltipValue = null;
-  if (value && typeof value === "object" && !Array.isArray(value)) {
-    const v = value;
-    if (!("mark" in v) && !("bounds" in v) && !("items" in v)) tooltipValue = v;
-  }
-  if (!tooltipValue && !rawDatum) return null;
-  if (!tooltipValue) return rawDatum;
-  if (!rawDatum) return tooltipValue;
-  const merged = { ...tooltipValue };
-  for (const key of Object.keys(tooltipValue)) {
-    if (key in rawDatum && typeof rawDatum[key] === "number") {
-      merged[key] = rawDatum[key];
-    }
-  }
-  return merged;
-}
-function buildHtml(datum, color, config, fields, colorScale) {
-  const xField = config.x?.field;
-  const yFields = [config.y, config.y2].filter(Boolean).map((f) => f.field);
-  const colorField = config.color?.field;
-  const fallbackDot = color || "var(--chart-1)";
-  let header = "";
-  if (xField && xField in datum) {
-    const xMeta = fields?.[xField];
-    header = `<div class="tt-header">${fmtValue(datum[xField], config.x?.type, xMeta?.format)}</div>`;
-  }
-  let body = "";
-  if (colorField && colorField in datum && colorField !== xField) {
-    const label = fmtValue(datum[colorField]);
-    const dot = colorScale ? colorScale(String(datum[colorField])) || fallbackDot : fallbackDot;
-    body += `<div class="tt-row"><span class="tt-dot" style="background:${dot}"></span><span class="tt-key">${label}</span></div>`;
-  }
-  for (const yf of yFields) {
-    if (!(yf in datum)) continue;
-    const meta = fields?.[yf];
-    const label = meta?.displayName ?? config.y?.label ?? yf.replace(/_/g, " ");
-    body += `<div class="tt-row"><span class="tt-dot" style="background:${fallbackDot}"></span><span class="tt-key">${label}:</span><span class="tt-value">${fmtValue(datum[yf], config.y?.type, meta?.format)}</span></div>`;
-  }
-  if (!body) {
-    const skipFields = new Set([xField, colorField].filter(Boolean));
-    const keys = Object.keys(datum).filter(
-      (k) => !SCENE_KEYS.has(k) && !k.startsWith("_") && !k.startsWith("__") && !skipFields.has(k)
-    ).sort((a, b) => {
-      const av = datum[a], bv = datum[b];
-      if (typeof av === "number" && typeof bv === "number") return bv - av;
-      if (typeof av === "number") return -1;
-      if (typeof bv === "number") return 1;
-      return 0;
-    });
-    for (const k of keys) {
-      const raw = datum[k];
-      if (raw === null || raw === void 0 || typeof raw === "object" && !(raw instanceof Date)) continue;
-      const meta = fields?.[k];
-      const label = meta?.displayName ?? k.replace(/_/g, " ");
-      const dot = colorScale ? colorScale(k) || fallbackDot : fallbackDot;
-      body += `<div class="tt-row"><span class="tt-dot" style="background:${dot}"></span><span class="tt-key">${label}:</span><span class="tt-value">${fmtValue(raw, meta?.type, meta?.format)}</span></div>`;
-    }
-  }
-  if (!header && !body) return "";
-  return header + (body ? `<div class="tt-body">${body}</div>` : "");
-}
-var SebatiChartTooltipHandler = class {
-  options;
-  vegaView = null;
-  /** Latest html rendered by the hover path — captured at pin time so the
-   *  pinned tooltip keeps showing the clicked bucket even if the mouse moves
-   *  over another mark afterwards. */
-  lastHtml = null;
-  pinned = false;
-  constructor(options) {
-    this.options = options;
-  }
-  /** Call after vegaEmbed resolves so the handler can read the color scale. */
-  setView(view) {
-    this.vegaView = view;
-  }
-  getColorScale() {
-    try {
-      return this.vegaView?.scale("color") ?? null;
-    } catch {
-      return null;
-    }
-  }
-  /** Freeze the current tooltip in place; subsequent hover updates are ignored
-   *  until `unpin()` is called. Adds a small close affordance so users can
-   *  dismiss without having to click the chart again. */
-  pin() {
-    const el = getTooltipEl();
-    if (!el) return;
-    if (!el.classList.contains("visible")) return;
-    this.pinned = true;
-    el.classList.add("pinned");
-    if (!el.querySelector(".tt-close")) {
-      const btn = document.createElement("button");
-      btn.type = "button";
-      btn.className = "tt-close";
-      btn.setAttribute("aria-label", "Close tooltip");
-      btn.textContent = "\xD7";
-      btn.addEventListener("click", (e) => {
-        e.stopPropagation();
-        this.unpin();
-      });
-      el.appendChild(btn);
-    }
-  }
-  unpin() {
-    this.pinned = false;
-    const el = getTooltipEl();
-    if (!el) return;
-    el.classList.remove("pinned", "visible");
-  }
-  isPinned() {
-    return this.pinned;
-  }
-  call = (_handler, event, item, value) => {
-    const el = getTooltipEl();
-    if (!el) return;
-    if (this.pinned) return;
-    if (!item || value == null) {
-      el.classList.remove("visible");
-      return;
-    }
-    const datum = pickDatum(item, value);
-    if (!datum) {
-      el.classList.remove("visible");
-      return;
-    }
-    const pickColor = (c) => c && c !== "transparent" ? c : "";
-    const itemAny = item;
-    const color = pickColor(itemAny?.fill) || pickColor(itemAny?.stroke) || pickColor(datum.fill) || pickColor(datum.stroke) || "var(--chart-1)";
-    let html;
-    if (this.options.formatter) {
-      const values = Object.entries(datum).filter(([k, v]) => !k.startsWith("_") && !SCENE_KEYS.has(k) && v != null && typeof v !== "object").map(([k, v]) => {
-        const meta = this.options.fields?.[k];
-        return {
-          field: k,
-          title: meta?.displayName ?? k,
-          value: v,
-          formatted: fmtValue(v, meta?.type)
-        };
-      });
-      if (values.length === 0) {
-        el.classList.remove("visible");
-        return;
-      }
-      html = this.options.formatter(values);
-    } else {
-      html = buildHtml(datum, color, this.options.config, this.options.fields, this.getColorScale());
-    }
-    if (!html) {
-      el.classList.remove("visible");
-      return;
-    }
-    ensureStyle();
-    el.innerHTML = html;
-    this.lastHtml = html;
-    el.classList.add("visible");
-    if (event) positionTooltip(el, event);
-  };
-  hide() {
-    if (this.pinned) return;
-    getTooltipEl()?.classList.remove("visible");
-  }
-};
-
-// src/vendor/lib/charts/vega/flex-embed-options.ts
-function createFlexEmbedOptions(input) {
-  const {
-    theme,
-    chartConfig,
-    tooltipFormatter,
-    fields,
-    embedTooltip,
-    vegaEmbedConfigReplace
-  } = input;
-  const vlConfig = vegaEmbedConfigReplace ?? getSebatiVegaConfig(theme);
-  if (embedTooltip !== void 0) {
-    return {
-      options: {
-        actions: false,
-        renderer: "svg",
-        config: vlConfig,
-        tooltip: embedTooltip
-      },
-      handler: null
-    };
-  }
-  const handler = new SebatiChartTooltipHandler({
-    config: chartConfig,
-    formatter: tooltipFormatter,
-    fields
-  });
-  return {
-    options: {
-      actions: false,
-      renderer: "svg",
-      config: vlConfig,
-      tooltip: handler.call
-    },
-    handler
-  };
-}
-function VegaChartFlexEmbed({
-  spec,
-  theme,
-  config,
-  tooltipFormatter,
-  fields,
-  embedTooltip,
-  vegaEmbedConfigReplace,
-  tooltipHideElementId = TOOLTIP_ID,
-  onViewReady,
-  onEmbedError,
-  className
-}) {
-  const ref = useRef(null);
-  const viewRef = useRef(null);
-  const onViewReadyRef = useRef(onViewReady);
-  const onEmbedErrorRef = useRef(onEmbedError);
-  onViewReadyRef.current = onViewReady;
-  onEmbedErrorRef.current = onEmbedError;
-  useEffect(() => {
-    const el = ref.current;
-    if (!el) return;
-    let cancelled = false;
-    const { options, handler } = createFlexEmbedOptions({
-      theme,
-      chartConfig: config,
-      tooltipFormatter,
-      fields,
-      embedTooltip,
-      vegaEmbedConfigReplace
-    });
-    vegaEmbed(el, spec, options).then((result) => {
-      if (cancelled) {
-        result.view.finalize();
-        return;
-      }
-      handler?.setView(result.view);
-      viewRef.current = result.view;
-      onEmbedErrorRef.current?.(null);
-      onViewReadyRef.current?.(result.view);
-    }).catch((err) => {
-      console.error("[VegaChartFlexEmbed] embed failed", err);
-      onEmbedErrorRef.current?.(err instanceof Error ? err : new Error(String(err)));
-    });
-    return () => {
-      cancelled = true;
-      viewRef.current?.finalize();
-      viewRef.current = null;
-    };
-  }, [
-    spec,
-    theme,
-    config,
-    tooltipFormatter,
-    fields,
-    embedTooltip,
-    vegaEmbedConfigReplace
-  ]);
-  useEffect(() => {
-    const el = ref.current;
-    if (!el || typeof ResizeObserver === "undefined") return;
-    const observer = new ResizeObserver((entries) => {
-      const view = viewRef.current;
-      if (!view) return;
-      const width = entries[0]?.contentRect.width;
-      if (width != null && width > 0) {
-        view.width(width).resize().runAsync();
-      }
-    });
-    observer.observe(el);
-    return () => observer.disconnect();
-  }, []);
-  useEffect(() => {
-    const el = ref.current;
-    if (!el) return;
-    const hide = () => {
-      if (typeof window.matchMedia === "function" && window.matchMedia("(pointer: coarse)").matches) {
-        return;
-      }
-      document.getElementById(tooltipHideElementId)?.classList.remove("visible");
-    };
-    el.addEventListener("mouseleave", hide);
-    return () => el.removeEventListener("mouseleave", hide);
-  }, [tooltipHideElementId]);
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref,
-      className: className ? `vega-chart h-full w-full ${className}` : "vega-chart h-full w-full"
-    }
-  );
-}
-
-// src/vendor/plugins/vega-chart/mobile-spec.ts
-var isObj = (v) => !!v && typeof v === "object" && !Array.isArray(v);
-var ARC_LABEL_FONT_SIZE = 9;
-var SCROLL_CATEGORY_THRESHOLD = 8;
-var SCROLL_STEP_PX = 38;
-function encodingOf(spec) {
-  if (isObj(spec.encoding)) return spec.encoding;
-  if (Array.isArray(spec.layer)) {
-    const layer = spec.layer.find(
-      (l) => isObj(l) && isObj(l.encoding)
-    );
-    if (isObj(layer)) return layer.encoding;
-  }
-  return null;
-}
-function seriesField(spec) {
-  const enc = encodingOf(spec);
-  const color = enc && isObj(enc.color) ? enc.color : null;
-  const field = color?.field;
-  return typeof field === "string" ? field : null;
-}
-function inlineValues(spec) {
-  const data = isObj(spec.data) ? spec.data : null;
-  const values = data?.values;
-  return Array.isArray(values) ? values.filter(isObj) : [];
-}
-function categoryCount(spec) {
-  const enc = encodingOf(spec);
-  const x = enc && isObj(enc.x) ? enc.x : null;
-  const field = typeof x?.field === "string" ? x.field : null;
-  const type = typeof x?.type === "string" ? x.type : null;
-  if (!field || type === "quantitative" || type === "temporal") return 0;
-  const seen = /* @__PURE__ */ new Set();
-  for (const row of inlineValues(spec)) {
-    const v = row[field];
-    if (v != null) seen.add(String(v));
-  }
-  return seen.size;
-}
-function isArcSpec(spec) {
-  const markOf = (v) => {
-    if (typeof v === "string") return v;
-    if (isObj(v) && typeof v.type === "string") return v.type;
-    return null;
-  };
-  if (markOf(spec.mark) === "arc") return true;
-  if (Array.isArray(spec.layer)) {
-    return spec.layer.some(
-      (l) => isObj(l) && markOf(l.mark) === "arc"
-    );
-  }
-  return false;
-}
-function chartTitle(spec) {
-  const t = spec.title;
-  if (typeof t === "string") return t.trim() || null;
-  if (isObj(t) && typeof t.text === "string") return t.text.trim() || null;
-  return null;
-}
-function isFlatSummary(summary) {
-  if (!summary || summary.kind !== "buckets" || summary.buckets.length < 2) {
-    return false;
-  }
-  return summary.buckets.every((b) => Object.keys(b.values).length <= 1);
-}
-function fieldOf(enc, channel) {
-  const c = enc && isObj(enc[channel]) ? enc[channel] : null;
-  return typeof c?.field === "string" ? c.field : null;
-}
-function sortChannelField(sort, enc) {
-  if (typeof sort !== "string") return null;
-  const channel = sort.replace(/^[-+]/, "");
-  const def = isObj(enc[channel]) ? enc[channel] : null;
-  return typeof def?.field === "string" ? def.field : null;
-}
-function descendingSort(sort) {
-  if (sort === "descending") return true;
-  if (typeof sort === "string" && sort.startsWith("-")) return true;
-  return isObj(sort) && sort.order === "descending";
-}
-function orderBuckets(buckets, enc, xField, valueField) {
-  const xDef = xField != null ? Object.values(enc).find(
-    (d) => isObj(d) && d.field === xField
-  ) ?? null : null;
-  const sort = xDef?.sort;
-  if (sort === null) return buckets;
-  if (Array.isArray(sort)) {
-    const order = new Map(sort.map((v, i) => [String(v), i]));
-    return [...buckets].sort(
-      (a, b) => (order.get(a.key) ?? Number.MAX_SAFE_INTEGER) - (order.get(b.key) ?? Number.MAX_SAFE_INTEGER)
-    );
-  }
-  const dir = descendingSort(sort) || xDef && isObj(xDef.scale) && xDef.scale.reverse === true ? -1 : 1;
-  const sortField = isObj(sort) ? typeof sort.field === "string" ? sort.field : null : sortChannelField(sort, enc);
-  if (sortField != null && sortField === valueField) {
-    return [...buckets].sort((a, b) => (a.total - b.total) * dir);
-  }
-  const keyed = buckets.map((b) => ({ b, t: toTime(b.key) }));
-  if (keyed.every((k) => k.t != null)) {
-    return keyed.sort((a, b) => (a.t - b.t) * dir).map((k) => k.b);
-  }
-  return [...buckets].sort(
-    (a, b) => a.key.localeCompare(b.key, void 0, { numeric: true }) * dir
-  );
-}
-function summarize(spec) {
-  const enc = encodingOf(spec);
-  if (!enc) return null;
-  const rows = inlineValues(spec);
-  if (rows.length === 0) return null;
-  const series = seriesField(spec);
-  const valueField = fieldOf(enc, "theta") ?? (isObj(enc.y) && enc.y.type === "quantitative" ? fieldOf(enc, "y") : null) ?? (isObj(enc.x) && enc.x.type === "quantitative" ? fieldOf(enc, "x") : null);
-  if (!valueField) return null;
-  const valueDef = [enc.theta, enc.y, enc.x].find(
-    (d) => isObj(d) && d.field === valueField
-  );
-  const axis = isObj(valueDef?.axis) ? valueDef.axis : null;
-  const valueLabel = (typeof valueDef?.title === "string" ? valueDef.title : null) ?? (typeof axis?.title === "string" ? axis.title : null) ?? valueField;
-  const xField = fieldOf(enc, "x") === valueField ? fieldOf(enc, "y") : fieldOf(enc, "x");
-  const isComposition = !xField || fieldOf(enc, "theta") != null;
-  const num = (v) => {
-    const n = typeof v === "number" ? v : Number(v);
-    return Number.isFinite(n) ? n : 0;
-  };
-  const seen = [];
-  const byBucket = /* @__PURE__ */ new Map();
-  for (const row of rows) {
-    const bucketKey = isComposition ? "all" : String(row[xField] ?? "");
-    const name = series ? String(row[series] ?? "") : valueField;
-    if (!seen.includes(name)) seen.push(name);
-    let bucket = byBucket.get(bucketKey);
-    if (!bucket) {
-      bucket = { key: bucketKey, total: 0, values: {} };
-      byBucket.set(bucketKey, bucket);
-    }
-    const v = num(row[valueField]);
-    bucket.values[name] = (bucket.values[name] ?? 0) + v;
-    bucket.total += v;
-  }
-  const buckets = orderBuckets([...byBucket.values()], enc, xField, valueField);
-  return {
-    kind: isComposition ? "composition" : "buckets",
-    seriesField: series,
-    valueLabel,
-    bucketField: isComposition ? null : xField ?? null,
-    bucketType: isComposition || !xField ? null : channelType(enc, xField),
-    series: seen,
-    buckets,
-    total: buckets.reduce((s, b) => s + b.total, 0)
-  };
-}
-var DIMMED_OPACITY = 0.18;
-function channelType(enc, field) {
-  for (const def of Object.values(enc)) {
-    if (isObj(def) && def.field === field && typeof def.type === "string") {
-      return def.type;
-    }
-  }
-  return null;
-}
-function selectionTest(enc, field, value) {
-  const ref = `datum[${JSON.stringify(field)}]`;
-  if (channelType(enc, field) === "temporal") {
-    const ms = Date.parse(value);
-    if (!Number.isNaN(ms)) return `time(${ref}) === ${ms}`;
-  }
-  return `toString(${ref}) === ${JSON.stringify(value)}`;
-}
-function markType(target) {
-  const m = target.mark;
-  if (typeof m === "string") return m;
-  if (isObj(m) && typeof m.type === "string") return m.type;
-  return null;
-}
-var BACKDROP_OPACITY = 0.28;
-var SPANNING_MARKS = /* @__PURE__ */ new Set(["line", "area", "trail"]);
-function withOpacity(target, field, value) {
-  const enc = isObj(target.encoding) ? target.encoding : null;
-  if (!enc) return target;
-  if (Array.isArray(target.params) && target.params.length > 0) return target;
-  const existing = isObj(enc.opacity) ? enc.opacity : null;
-  const condition = existing && isObj(existing.condition) ? existing.condition : null;
-  if (condition && typeof condition.param === "string") return target;
-  const opacity = SPANNING_MARKS.has(markType(target) ?? "") ? { value: BACKDROP_OPACITY } : {
-    condition: { test: selectionTest(enc, field, value), value: 1 },
-    value: DIMMED_OPACITY
-  };
-  return { ...target, encoding: { ...enc, opacity } };
-}
-function highlightSelection(spec, field, value) {
-  if (Array.isArray(spec.layer)) {
-    return {
-      ...spec,
-      layer: spec.layer.map(
-        (l) => isObj(l) ? withOpacity(l, field, value) : l
-      )
-    };
-  }
-  return withOpacity(spec, field, value);
-}
-function adaptSpecForMobile(spec, landscape = false, cardChrome = false) {
-  const categories = categoryCount(spec);
-  const scrolls = categories > SCROLL_CATEGORY_THRESHOLD;
-  const next = { ...spec };
-  if (scrolls) {
-    next.width = { step: SCROLL_STEP_PX };
-  } else if (next.width == null || next.width === "container") {
-    next.width = "container";
-  }
-  const arc = isArcSpec(spec);
-  const capped = arc ? cardChrome ? 210 : 250 : cardChrome ? landscape ? 130 : 150 : landscape ? 200 : 220;
-  const declared = typeof next.height === "number" ? next.height : null;
-  next.height = declared != null ? Math.min(declared, capped) : capped;
-  if (arc && Array.isArray(next.layer)) {
-    const outer = next.height / 2 - 4;
-    next.layer = next.layer.map((layer) => {
-      if (!isObj(layer) || !isObj(layer.mark)) return layer;
-      const mark = { ...layer.mark };
-      if (mark.type === "arc") {
-        const declaredInner = typeof mark.innerRadius === "number" ? mark.innerRadius : null;
-        mark.outerRadius = outer;
-        mark.innerRadius = declaredInner != null ? Math.min(declaredInner, outer * 0.62) : outer * 0.58;
-      } else if (mark.type === "text") {
-        mark.fontSize = ARC_LABEL_FONT_SIZE;
-        mark.fontWeight = 500;
-        if (typeof mark.radius === "number") {
-          mark.radius = outer + 12;
-        }
-      }
-      return { ...layer, mark };
-    });
-  }
-  if (arc && !Array.isArray(next.layer)) {
-    const outer = next.height / 2 - 4;
-    const markObj = isObj(next.mark) ? { ...next.mark } : { type: typeof next.mark === "string" ? next.mark : "arc" };
-    const declaredInner = typeof markObj.innerRadius === "number" ? markObj.innerRadius : null;
-    markObj.outerRadius = outer;
-    markObj.innerRadius = declaredInner != null ? Math.min(declaredInner, outer * 0.62) : outer * 0.58;
-    next.mark = markObj;
-  }
-  next.autosize = isObj(next.autosize) ? next.autosize : { type: scrolls ? "pad" : "fit-x", contains: "padding" };
-  const config = isObj(next.config) ? { ...next.config } : {};
-  config.legend = {
-    ...isObj(config.legend) ? config.legend : {},
-    orient: "bottom",
-    direction: "horizontal",
-    labelLimit: 96,
-    labelFontSize: 11,
-    titleFontSize: 11,
-    symbolSize: 60,
-    offset: 6
-  };
-  const axisCommon = {
-    labelFontSize: 10.5,
-    titleFontSize: 11,
-    labelLimit: 72,
-    labelOverlap: "greedy"
-  };
-  config.axis = { ...isObj(config.axis) ? config.axis : {}, ...axisCommon };
-  config.axisX = {
-    ...isObj(config.axisX) ? config.axisX : {},
-    // Horizontal labels only — rotated text at 10px is unreadable, and if the
-    // labels don't fit the chart scrolls instead.
-    labelAngle: 0,
-    ...scrolls ? {} : { tickCount: 5 }
-  };
-  config.axisY = {
-    ...isObj(config.axisY) ? config.axisY : {},
-    tickCount: 4,
-    labelLimit: 56
-  };
-  config.view = { ...isObj(config.view) ? config.view : {}, stroke: null };
-  if (cardChrome) {
-    next.title = null;
-    config.text = {
-      ...isObj(config.text) ? config.text : {},
-      fontSize: arc ? ARC_LABEL_FONT_SIZE : 10,
-      fontWeight: 500
-    };
-    config.axis = { ...isObj(config.axis) ? config.axis : {}, title: null };
-    config.legend = { ...isObj(config.legend) ? config.legend : {}, disable: true };
-    const enc = encodingOf(next);
-    if (enc && isObj(enc.color)) {
-      const color = { ...enc.color, legend: null };
-      if (isObj(next.encoding)) next.encoding = { ...next.encoding, color };
-    }
-  }
-  next.config = config;
-  next.padding = isObj(next.padding) ? next.padding : 4;
-  return { spec: next, scrolls };
-}
-function dateCandidates(d) {
-  const pad = (n) => String(n).padStart(2, "0");
-  const iso = d.toISOString();
-  return [
-    String(d),
-    iso,
-    iso.slice(0, 10),
-    `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}`,
-    String(d.getTime())
-  ];
-}
-function keyCandidates(v) {
-  if (v == null) return [];
-  if (v instanceof Date) return Number.isNaN(v.getTime()) ? [] : dateCandidates(v);
-  if (typeof v === "number" && Math.abs(v) > 1e11) {
-    const d = new Date(v);
-    if (!Number.isNaN(d.getTime())) return [String(v), ...dateCandidates(d)];
-  }
-  return [String(v)];
-}
-var datumMatches = (value, key) => keyCandidates(value).includes(key);
-function keyForDatum(datum, summary) {
-  if (summary.kind === "composition") {
-    const field2 = summary.seriesField;
-    if (field2 && datum[field2] != null) {
-      const hit = summary.series.find((name) => datumMatches(datum[field2], name));
-      if (hit) return hit;
-    }
-    return summary.series.find(
-      (name) => Object.values(datum).some((v) => datumMatches(v, name))
-    );
-  }
-  const field = summary.bucketField;
-  if (field && datum[field] != null) {
-    const hit = summary.buckets.find((b) => datumMatches(datum[field], b.key));
-    if (hit) return hit.key;
-  }
-  return summary.buckets.find(
-    (b) => Object.values(datum).some((v) => datumMatches(v, b.key))
-  )?.key;
-}
-function toTime(v) {
-  if (v instanceof Date) return Number.isNaN(v.getTime()) ? null : v.getTime();
-  if (typeof v === "number") return Number.isFinite(v) ? v : null;
-  if (typeof v === "string") {
-    const n = Number(v);
-    if (Number.isFinite(n) && v.trim() !== "") return n;
-    const t = Date.parse(v);
-    return Number.isNaN(t) ? null : t;
-  }
-  return null;
-}
-function bucketAtValue(summary, value) {
-  if (value == null || summary.buckets.length === 0) return void 0;
-  const exact = summary.buckets.find((b) => datumMatches(value, b.key));
-  if (exact) return exact.key;
-  const target = toTime(value);
-  if (target == null) return void 0;
-  let best;
-  let bestDistance = Infinity;
-  for (const b of summary.buckets) {
-    const t = toTime(b.key);
-    if (t == null) continue;
-    const d = Math.abs(t - target);
-    if (d < bestDistance) {
-      bestDistance = d;
-      best = b.key;
-    }
-  }
-  return best;
-}
-function isPointerParam(p) {
-  if (!isObj(p)) return false;
-  const select = isObj(p.select) ? p.select : null;
-  const on = select?.on;
-  return typeof on === "string" && on.startsWith("pointer");
-}
-function conditionalOn(enc, removed) {
-  return Object.values(enc).filter((def) => {
-    if (!isObj(def) || !isObj(def.condition)) return false;
-    const param = def.condition.param;
-    return typeof param === "string" && removed.has(param);
-  });
-}
-function withoutPointerParams(target) {
-  if (!Array.isArray(target.params)) return target;
-  const next = { ...target };
-  const keep = target.params.filter((p) => !isPointerParam(p));
-  if (keep.length > 0) next.params = keep;
-  else delete next.params;
-  return next;
-}
-function processLayer(target, removed, selection) {
-  let next = withoutPointerParams(target);
-  const enc = isObj(next.encoding) ? { ...next.encoding } : null;
-  if (!enc) return next;
-  const conditioned = conditionalOn(enc, removed);
-  const hoverOnly = conditioned.some((def) => def.value === 0);
-  for (const [channel, def] of Object.entries(enc)) {
-    if (!isObj(def) || !isObj(def.condition)) continue;
-    const condition = def.condition;
-    const param = condition.param;
-    if (typeof param !== "string" || !removed.has(param)) continue;
-    if (hoverOnly) {
-      enc[channel] = selection ? {
-        condition: {
-          test: selectionTest(enc, selection.field, selection.value),
-          ..."value" in condition ? { value: condition.value } : {}
-        },
-        value: def.value
-      } : { value: def.value };
-    } else {
-      const value = "value" in condition ? condition.value : def.value;
-      if (value === void 0) delete enc[channel];
-      else enc[channel] = { value };
-    }
-  }
-  next = { ...next, encoding: enc };
-  if (hoverOnly || !selection) return next;
-  return withOpacity(next, selection.field, selection.value);
-}
-function applyTouchInteraction(spec, selection) {
-  const removed = /* @__PURE__ */ new Set();
-  const collect = (holder) => {
-    if (!Array.isArray(holder.params)) return;
-    for (const p of holder.params) {
-      if (isPointerParam(p) && typeof p.name === "string") removed.add(p.name);
-    }
-  };
-  collect(spec);
-  if (Array.isArray(spec.layer)) {
-    for (const l of spec.layer) if (isObj(l)) collect(l);
-  }
-  if (removed.size === 0) {
-    return selection ? highlightSelection(spec, selection.field, selection.value) : spec;
-  }
-  if (!Array.isArray(spec.layer)) return processLayer(spec, removed, selection);
-  return withoutPointerParams({
-    ...spec,
-    layer: spec.layer.map(
-      (l) => isObj(l) ? processLayer(l, removed, selection) : l
-    )
-  });
-}
-
-// src/vendor/plugins/vega-chart/chart-tooltip.ts
-var TOOLTIP_STYLE_ID = "vega-tooltip-style";
-var tooltipEl = null;
-function getTooltipEl2() {
-  if (tooltipEl && tooltipEl.isConnected) return tooltipEl;
-  tooltipEl = document.getElementById("vg-tooltip-element");
-  if (!tooltipEl) {
-    tooltipEl = document.createElement("div");
-    tooltipEl.id = "vg-tooltip-element";
-    document.body.appendChild(tooltipEl);
-  }
-  if (!tooltipEl.style.left) {
-    tooltipEl.style.left = "-9999px";
-    tooltipEl.style.top = "-9999px";
-  }
-  return tooltipEl;
-}
-function ensureTooltipStyles() {
-  if (typeof document === "undefined") return;
-  let style = document.getElementById(TOOLTIP_STYLE_ID);
-  if (!style) {
-    style = document.createElement("style");
-    style.id = TOOLTIP_STYLE_ID;
-    document.head.appendChild(style);
-  }
-  style.textContent = `
-    #vg-tooltip-element {
-      visibility: hidden;
-      position: fixed;
-      z-index: 10000;
-      pointer-events: none;
-      padding: 0;
-      font-family: inherit;
-      font-size: 12px;
-      line-height: 1.4;
-      border-radius: 6px;
-      box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
-      background-color: var(--surface-overlay, var(--popover, #1a1a1a));
-      color: var(--popover-foreground, #e5e5e5);
-      border: 1px solid var(--border, #333);
-      max-width: 300px;
-      max-height: 240px;
-      display: flex;
-      flex-direction: column;
-      overflow: hidden;
-    }
-    #vg-tooltip-element.visible {
-      visibility: visible;
-    }
-    #vg-tooltip-element .vg-tooltip-header {
-      font-weight: 500;
-      flex-shrink: 0;
-      padding: 8px 12px 4px;
-      padding-bottom: 4px;
-      border-bottom: 1px solid var(--border, #333);
-    }
-    #vg-tooltip-element .vg-tooltip-body {
-      overflow-y: auto;
-      padding: 4px 12px 8px;
-      scrollbar-width: thin;
-    }
-    #vg-tooltip-element .vg-tooltip-row {
-      display: flex;
-      align-items: center;
-      gap: 8px;
-      padding: 1px 0;
-    }
-    #vg-tooltip-element .vg-tooltip-dot {
-      width: 10px;
-      height: 10px;
-      border-radius: 50%;
-      flex-shrink: 0;
-    }
-    #vg-tooltip-element .vg-tooltip-key {
-      color: var(--muted-foreground, #999);
-    }
-    #vg-tooltip-element .vg-tooltip-value {
-      font-weight: 500;
-      margin-left: auto;
-    }
-    /* Coarse pointers get bigger text and more room, but NOT a position. This
-       block used to dock the tooltip to the bottom of the viewport (with
-       !important, so it beat the computed placement) \u2014 which is where the
-       composer and the plan bar live, so the reading landed on top of the chat
-       chrome, a screen away from the chart it described. positionTooltip owns
-       placement now, against the pointer.
-       NOTE: no backticks in here. This whole stylesheet is a template literal,
-       so one would end the string and break the parse. */
-    @media (pointer: coarse) {
-      #vg-tooltip-element {
-        max-width: calc(100vw - 24px);
-        font-size: 13px;
-      }
-    }
-    /* Hide the default vega-tooltip table rendering */
-    #vg-tooltip-element table {
-      display: none;
-    }
-    #vg-tooltip-element h2 {
-      display: none;
-    }
-  `;
-}
-var TIP_GAP = 14;
-var TIP_MARGIN = 8;
-function isCoarsePointer() {
-  return typeof window !== "undefined" && typeof window.matchMedia === "function" && window.matchMedia("(pointer: coarse)").matches;
-}
-var touchDismissInstalled = false;
-function installTouchDismiss() {
-  if (touchDismissInstalled || typeof document === "undefined") return;
-  touchDismissInstalled = true;
-  document.addEventListener(
-    "pointerdown",
-    () => {
-      if (!isCoarsePointer()) return;
-      document.getElementById("vg-tooltip-element")?.classList.remove("visible");
-    },
-    true
-  );
-}
-function pointerXY(event) {
-  const e = event;
-  const touch = e?.touches?.[0] ?? e?.changedTouches?.[0];
-  const x = Number.isFinite(e?.clientX) ? e.clientX : touch?.clientX;
-  const y = Number.isFinite(e?.clientY) ? e.clientY : touch?.clientY;
-  return Number.isFinite(x) && Number.isFinite(y) ? { x, y } : null;
-}
-function positionTooltip2(el, event, anchor) {
-  const w = el.offsetWidth;
-  const h = el.offsetHeight;
-  const maxX = Math.max(TIP_MARGIN, window.innerWidth - w - TIP_MARGIN);
-  const maxY = Math.max(TIP_MARGIN, window.innerHeight - h - TIP_MARGIN);
-  const coarse = isCoarsePointer();
-  const p = pointerXY(event);
-  let x;
-  let y;
-  if (!p) {
-    const rect = anchor?.getBoundingClientRect();
-    if (!rect) return;
-    x = rect.left + rect.width / 2 - w / 2;
-    const above = rect.top - h - TIP_GAP;
-    y = above >= TIP_MARGIN ? above : rect.bottom + TIP_GAP;
-  } else if (coarse) {
-    x = p.x - w / 2;
-    const above = p.y - h - TIP_GAP;
-    y = above >= TIP_MARGIN ? above : p.y + TIP_GAP;
-  } else {
-    x = p.x + 12;
-    y = p.y + 12;
-  }
-  const left = Math.min(Math.max(x, TIP_MARGIN), maxX);
-  const top = Math.min(Math.max(y, TIP_MARGIN), maxY);
-  if (!Number.isFinite(left) || !Number.isFinite(top)) return;
-  el.style.left = `${left}px`;
-  el.style.top = `${top}px`;
-}
-function tooltipHtml(title, rows) {
-  const head = title ? `<div class="vg-tooltip-header">${escapeTooltipText(title)}</div>` : "";
-  const body = rows.map(
-    (r) => `
-        <div class="vg-tooltip-row">
-          <span class="vg-tooltip-dot" style="background-color: ${escapeTooltipText(r.color)}"></span>
-          <span class="vg-tooltip-key">${escapeTooltipText(r.label)}:</span>
-          <span class="vg-tooltip-value">${escapeTooltipText(r.value)}</span>
-        </div>`
-  ).join("");
-  return head + `<div class="vg-tooltip-body scrollbar">${body}</div>`;
-}
-function escapeTooltipText(v) {
-  return String(v).replace(
-    /[&<>"]/g,
-    (c) => c === "&" ? "&amp;" : c === "<" ? "&lt;" : c === ">" ? "&gt;" : "&quot;"
-  );
-}
-function showTooltipAt(html, clientX, clientY) {
-  if (typeof document === "undefined") return;
-  ensureTooltipStyles();
-  installTouchDismiss();
-  const el = getTooltipEl2();
-  el.innerHTML = html;
-  el.classList.add("visible");
-  positionTooltip2(el, { clientX, clientY }, null);
-}
-function hideTooltip() {
-  if (typeof document === "undefined") return;
-  document.getElementById("vg-tooltip-element")?.classList.remove("visible");
-}
-var HOLD_TO_SCRUB_MS = 150;
-var HOLD_SLOP_PX = 8;
-var formatValue = (n) => {
-  const abs = Math.abs(n);
-  if (abs >= 1e6) return `${(n / 1e6).toFixed(1)}M`;
-  if (abs >= 1e3) return `${(n / 1e3).toFixed(1)}K`;
-  if (!Number.isInteger(n)) return n.toFixed(1);
-  return n.toLocaleString();
-};
-function ChartCardMobile({
-  title,
-  summary,
-  children,
-  view,
-  scrolls = false,
-  selected,
-  onSelect,
-  onExpand
-}) {
-  const colorOf = useCallback(
-    (name) => {
-      try {
-        const scale = view?.scale?.("color");
-        const c = scale?.(name);
-        if (typeof c === "string" && c) return c;
-      } catch {
-      }
-      return "var(--muted-foreground)";
-    },
-    [view]
-  );
-  const isComposition = summary?.kind === "composition";
-  const plotRef = useRef(null);
-  const scrubbedRef = useRef(false);
-  const canScrub = !scrolls;
-  const canScrubRef = useRef(canScrub);
-  canScrubRef.current = canScrub;
-  const armedRef = useRef(false);
-  const startRef = useRef({ x: 0, y: 0 });
-  const holdTimerRef = useRef(null);
-  const selectedRef = useRef(selected);
-  const onSelectRef = useRef(onSelect);
-  const summaryRef = useRef(summary);
-  selectedRef.current = selected;
-  onSelectRef.current = onSelect;
-  summaryRef.current = summary;
-  const bucket = useMemo(() => {
-    if (!summary || summary.buckets.length === 0) return null;
-    if (summary.kind === "buckets" && selected) {
-      return summary.buckets.find((b) => b.key === selected) ?? summary.buckets[0];
-    }
-    return summary.buckets[summary.buckets.length - 1];
-  }, [summary, selected]);
-  const slice = useMemo(() => {
-    if (!summary || summary.kind !== "composition" || !selected || !bucket) return null;
-    const value = bucket.values[selected];
-    if (value == null) return null;
-    return { name: selected, value, share: bucket.total > 0 ? value / bucket.total : 0 };
-  }, [summary, selected, bucket]);
-  const legendEntries = useMemo(() => {
-    if (!summary || summary.kind !== "buckets" || summary.series.length < 2) return [];
-    return summary.series.map((name) => ({ name, color: colorOf(name) }));
-  }, [summary, colorOf]);
-  const legendRef = useRef(null);
-  const [legendOneLine, setLegendOneLine] = useState(false);
-  useEffect(() => {
-    const el = legendRef.current;
-    if (!el || legendEntries.length === 0) return;
-    const measure = () => {
-      const kids = Array.from(el.children);
-      if (kids.length === 0) return;
-      const top = kids[0].offsetTop;
-      setLegendOneLine(kids.every((k) => k.offsetTop === top));
-    };
-    measure();
-    const ro = new ResizeObserver(measure);
-    ro.observe(el);
-    return () => ro.disconnect();
-  }, [legendEntries]);
-  const showTipFor = useCallback(
-    (key, clientX, clientY) => {
-      const s = summaryRef.current;
-      const b = s?.buckets.find((x) => x.key === key);
-      if (!s || !b) return;
-      const rows2 = !isFlatSummary(s) && s.series.length ? s.series.map((name) => ({
-        color: colorOf(name),
-        label: name,
-        value: formatValue(b.values[name] ?? 0)
-      })) : [
-        {
-          color: colorOf(b.key),
-          label: s.valueLabel || "Value",
-          value: formatValue(b.total)
-        }
-      ];
-      showTooltipAt(tooltipHtml(b.key, rows2), clientX, clientY);
-    },
-    [colorOf]
-  );
-  const showTipRef = useRef(showTipFor);
-  showTipRef.current = showTipFor;
-  const rows = useMemo(() => {
-    if (!bucket) return [];
-    return summary?.series.map((name) => ({ name, value: bucket.values[name] ?? 0 })).sort((a, b) => b.value - a.value).map((r) => ({
-      key: r.name,
-      color: colorOf(r.name),
-      label: r.name,
-      value: formatValue(r.value),
-      sub: bucket.total > 0 ? `${(r.value / bucket.total * 100).toFixed(1)}%` : void 0
-    })) ?? [];
-  }, [bucket, summary, colorOf]);
-  useEffect(() => {
-    if (!view) return;
-    const v = view;
-    const valueAtClientX = (clientX, svgFrom) => {
-      try {
-        const svg = svgFrom?.closest("svg") ?? plotRef.current?.querySelector("svg");
-        if (!svg) return null;
-        const rect = svg.getBoundingClientRect();
-        const origin = typeof v.origin === "function" ? v.origin() : [0, 0];
-        const x = clientX - rect.left - (origin[0] ?? 0);
-        const scale = typeof v.scale === "function" ? v.scale("x") : null;
-        if (!scale) return null;
-        if (typeof scale.invert === "function") return scale.invert(x);
-        const domain = typeof scale.domain === "function" ? scale.domain() : [];
-        if (domain.length === 0) return null;
-        const step = typeof scale.step === "function" ? scale.step() : Math.abs(((scale.range?.() ?? [0, 0])[1] ?? 0) - ((scale.range?.() ?? [0, 0])[0] ?? 0)) / domain.length;
-        if (!step) return null;
-        const i = Math.max(0, Math.min(domain.length - 1, Math.floor(x / step)));
-        return domain[i];
-      } catch {
-        return null;
-      }
-    };
-    const onClick = (event, item) => {
-      const summary2 = summaryRef.current;
-      if (!summary2) return;
-      if (scrubbedRef.current) {
-        scrubbedRef.current = false;
-        return;
-      }
-      const datum = item?.datum;
-      const key = (datum ? keyForDatum(datum, summary2) : void 0) ?? (summary2.kind === "buckets" ? bucketAtValue(summary2, valueAtClientX(event.clientX, event.target)) : void 0);
-      if (!key) return;
-      const next = key === selectedRef.current ? null : key;
-      onSelectRef.current(next);
-      if (isCoarsePointer()) {
-        if (next) showTipRef.current(next, event.clientX, event.clientY);
-        else hideTooltip();
-      }
-    };
-    v.addEventListener?.("click", onClick);
-    const plot = plotRef.current;
-    if (!plot || !canScrubRef.current) return () => v.removeEventListener?.("click", onClick);
-    const selectAt = (clientX, clientY) => {
-      const summary2 = summaryRef.current;
-      if (!summary2 || summary2.kind !== "buckets") return;
-      const key = bucketAtValue(summary2, valueAtClientX(clientX, null));
-      if (!key) return;
-      if (key !== selectedRef.current) onSelectRef.current(key);
-      if (isCoarsePointer()) showTipRef.current(key, clientX, clientY);
-    };
-    const disarm = () => {
-      if (holdTimerRef.current) clearTimeout(holdTimerRef.current);
-      holdTimerRef.current = null;
-      armedRef.current = false;
-      plot.style.touchAction = "";
-    };
-    const onPointerDown = (e) => {
-      if (e.pointerType === "mouse" && e.button !== 0) return;
-      if (!canScrubRef.current || summaryRef.current?.kind !== "buckets") return;
-      startRef.current = { x: e.clientX, y: e.clientY };
-      holdTimerRef.current = setTimeout(() => {
-        armedRef.current = true;
-        scrubbedRef.current = true;
-        plot.style.touchAction = "none";
-        try {
-          plot.setPointerCapture(e.pointerId);
-        } catch {
-        }
-        selectAt(e.clientX, e.clientY);
-      }, HOLD_TO_SCRUB_MS);
-    };
-    const onPointerMove = (e) => {
-      if (!armedRef.current) {
-        const { x, y } = startRef.current;
-        if (Math.abs(e.clientY - y) > HOLD_SLOP_PX || Math.abs(e.clientX - x) > HOLD_SLOP_PX) {
-          disarm();
-        }
-        return;
-      }
-      selectAt(e.clientX, e.clientY);
-    };
-    plot.addEventListener("pointerdown", onPointerDown);
-    plot.addEventListener("pointermove", onPointerMove);
-    plot.addEventListener("pointerup", disarm);
-    plot.addEventListener("pointercancel", disarm);
-    return () => {
-      v.removeEventListener?.("click", onClick);
-      plot.removeEventListener("pointerdown", onPointerDown);
-      plot.removeEventListener("pointermove", onPointerMove);
-      plot.removeEventListener("pointerup", disarm);
-      plot.removeEventListener("pointercancel", disarm);
-    };
-  }, [view]);
-  useEffect(
-    () => () => {
-      if (holdTimerRef.current) clearTimeout(holdTimerRef.current);
-    },
-    []
-  );
-  const hasHeader = !!title || !!onExpand;
-  return (
-    // `not-prose`: this card renders inside the answer's `.prose` container, so
-    // without it the header's <h3> inherits the typography plugin's heading
-    // margins AND its font-size — which outranks a utility class on
-    // specificity. That is where the header's extra vertical space came from:
-    // the row is `min-h-11` and was rendering far taller.
-    /* @__PURE__ */ jsxs("div", { className: "not-prose my-3 w-full overflow-hidden rounded-xl border border-border bg-surface-raised", children: [
-      hasHeader ? /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex min-h-11 items-center gap-1 py-1 pl-3 pr-1", children: [
-          title ? (
-            // A <div>, not an <h3>: `not-prose` above cancels the typography
-            // plugin's heading margins, but globals.css also carries an
-            // unguarded `.prose h3 { text-base }` which outranks any utility
-            // class here on specificity — the title would silently render at
-            // 16px. Every other in-prose component in the app (the readout
-            // band, the sheet titles) uses a span for the same reason.
-            /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1 truncate text-sm font-semibold", children: title })
-          ) : /* @__PURE__ */ jsx("span", { className: "flex-1" }),
-          onExpand ? /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              onClick: onExpand,
-              "aria-label": "Open chart full screen",
-              className: "flex size-9 shrink-0 items-center justify-center rounded-md text-muted-foreground transition-colors active:bg-surface-active",
-              children: /* @__PURE__ */ jsx(ArrowsShowIcon, { className: "size-4" })
-            }
-          ) : null
-        ] }),
-        /* @__PURE__ */ jsx("div", { className: "h-px bg-border" })
-      ] }) : null,
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          ref: plotRef,
-          className: canScrub ? "touch-pan-y px-2 py-1" : "px-2 py-1",
-          children
-        }
-      ),
-      legendEntries.length > 0 ? (
-        // Values deliberately omitted: this is a key, not a readout. What each
-        // series is WORTH lives in the tooltip, on the tap that asks for it.
-        // Wrapped inline, not a column grid. Equal-width columns are sized by
-        // the LONGEST name, so "Kilat" sat in a 105px cell beside "Kilat
-        // Khusus" and four short series took two rows with a gap you could
-        // park a bus in. Wrapping lets every entry take only the width it
-        // needs, so as many fit per line as actually fit — and a name too long
-        // for the line gets one to itself, which is the single-column case
-        // falling out for free rather than being switched on.
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            ref: legendRef,
-            className: `flex flex-wrap gap-x-4 gap-y-1.5 px-3 pt-1 pb-3 text-xs ${legendOneLine ? "justify-center" : ""}`,
-            children: legendEntries.map((e) => (
-              // `max-w-full` so a name wider than the card truncates instead of
-              // pushing the row sideways.
-              /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 max-w-full items-center gap-2", children: [
-                /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    "aria-hidden": true,
-                    className: "size-2.5 shrink-0 rounded-full",
-                    style: { background: e.color }
-                  }
-                ),
-                /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-foreground", children: e.name })
-              ] }, e.name)
-            ))
-          }
-        )
-      ) : null,
-      isComposition && rows.length > 0 ? (
-        // ChartReadout paints `surface-raised` itself now, matching this card.
-        /* @__PURE__ */ jsx("div", { className: "p-2 pt-0", children: /* @__PURE__ */ jsx(
-          ChartReadout,
-          {
-            label: slice ? slice.name : "All series",
-            total: /* @__PURE__ */ jsx("span", { className: "tabular-nums", children: slice ? `${formatValue(slice.value)} \xB7 ${(slice.share * 100).toFixed(1)}%` : bucket ? formatValue(bucket.total) : "" }),
-            rows
-          }
-        ) })
-      ) : null
-    ] })
-  );
-}
-var PLUGIN_VEGA_CHART_CONFIG = { type: "bar" };
-function formatTooltipValue(value, fieldType) {
-  if (value == null) return "";
-  if (typeof value === "number") {
-    if (fieldType === "temporal" || value > 9466848e5 && value < 41024448e5) {
-      try {
-        const d = new Date(value);
-        if (!isNaN(d.getTime())) {
-          return d.toLocaleDateString("en-US", { year: "numeric", month: "short", day: "numeric" });
-        }
-      } catch {
-      }
-    }
-    return value.toLocaleString();
-  }
-  if (typeof value === "string" && /^\d{4}-\d{2}-\d{2}/.test(value)) {
-    try {
-      const d = new Date(value);
-      if (!isNaN(d.getTime())) {
-        return d.toLocaleDateString("en-US", { year: "numeric", month: "short", day: "numeric" });
-      }
-    } catch {
-    }
-  }
-  return String(value);
-}
-function applyFoldTransforms(values, transforms) {
-  if (!transforms) return values;
-  let rows = values;
-  for (const t of transforms) {
-    if (!t.fold || !Array.isArray(t.fold)) continue;
-    const foldFields = t.fold;
-    const [keyAs, valueAs] = Array.isArray(t.as) ? t.as : ["key", "value"];
-    rows = rows.flatMap((row) => {
-      return foldFields.map((field) => {
-        const { ...rest } = row;
-        for (const f of foldFields) delete rest[f];
-        return { ...rest, [keyAs]: field, [valueAs]: row[field] };
-      });
-    });
-  }
-  return rows;
-}
-function extractChartMeta(spec) {
-  if (spec.layer) {
-    const layers = spec.layer;
-    const arcLayer = layers.find((l) => {
-      const m = l.mark;
-      return (typeof m === "string" ? m : m?.type) === "arc";
-    });
-    if (arcLayer) {
-      const encoding2 = arcLayer.encoding;
-      if (encoding2) {
-        const colorEnc2 = encoding2.color;
-        const thetaEnc2 = encoding2.theta;
-        const data2 = spec.data;
-        const values2 = data2?.values || [];
-        return {
-          markType: "arc",
-          categoryField: colorEnc2?.field,
-          valueFields: thetaEnc2?.field ? [thetaEnc2.field] : [],
-          data: values2
-        };
-      }
-    }
-    const lineAreaLayer = layers.find((l) => {
-      const m = l.mark;
-      const mt = typeof m === "string" ? m : m?.type;
-      return mt === "line" || mt === "area";
-    });
-    if (lineAreaLayer) {
-      const encoding2 = lineAreaLayer.encoding || spec.encoding;
-      if (encoding2) {
-        const xEnc2 = encoding2.x;
-        const yEnc2 = encoding2.y;
-        const colorEnc2 = encoding2.color;
-        const data2 = spec.data;
-        const rawValues2 = data2?.values || [];
-        const values2 = applyFoldTransforms(rawValues2, spec.transform);
-        const categoryField2 = xEnc2?.field;
-        const categoryType2 = xEnc2?.type;
-        const seriesField3 = colorEnc2?.field && colorEnc2.field !== categoryField2 ? colorEnc2.field : void 0;
-        const valueFields2 = [];
-        if (yEnc2?.field) valueFields2.push(yEnc2.field);
-        return { markType: "line", categoryField: categoryField2, categoryType: categoryType2, seriesField: seriesField3, valueFields: valueFields2, data: values2 };
-      }
-    }
-    return null;
-  }
-  if (spec.hconcat || spec.vconcat || spec.concat) return null;
-  const encoding = spec.encoding;
-  if (!encoding) return null;
-  const mark = spec.mark;
-  if (!mark) return null;
-  const markType2 = typeof mark === "string" ? mark : mark?.type;
-  if (!markType2) return null;
-  const xEnc = encoding.x;
-  const yEnc = encoding.y;
-  const colorEnc = encoding.color;
-  const thetaEnc = encoding.theta;
-  const data = spec.data;
-  const rawValues = data?.values || [];
-  const values = applyFoldTransforms(rawValues, spec.transform);
-  if (markType2 === "arc") {
-    return {
-      markType: markType2,
-      categoryField: colorEnc?.field,
-      valueFields: thetaEnc?.field ? [thetaEnc.field] : [],
-      data: values
-    };
-  }
-  const xType = xEnc?.type;
-  const yType = yEnc?.type;
-  const isHorizontal = markType2 === "bar" && xType === "quantitative" && (yType === "nominal" || yType === "ordinal");
-  const catEnc = isHorizontal ? yEnc : xEnc;
-  const valEnc = isHorizontal ? xEnc : yEnc;
-  const categoryField = catEnc?.field;
-  const categoryType = catEnc?.type;
-  const colorType = colorEnc?.type;
-  const isColorCategorical = colorType === "nominal" || colorType === "ordinal";
-  const seriesField2 = colorEnc?.field && colorEnc.field !== categoryField && isColorCategorical ? colorEnc.field : void 0;
-  const valueFields = [];
-  if (valEnc?.field) valueFields.push(valEnc.field);
-  if (markType2 === "rect" && colorEnc?.field && colorType === "quantitative") {
-    const colorField = colorEnc.field;
-    if (!valueFields.includes(colorField)) {
-      valueFields.push(colorField);
-    }
-  }
-  return {
-    markType: markType2,
-    categoryField,
-    categoryType,
-    seriesField: seriesField2,
-    valueFields,
-    data: values
-  };
-}
-function createCustomTooltipHandler(getView, chartMeta) {
-  return function handler(_handler, event, item, value) {
-    const el = getTooltipEl2();
-    if (item?.datum) {
-      const rawDatum2 = item.datum || {};
-      rawDatum2.datum && typeof rawDatum2.datum === "object" && !Array.isArray(rawDatum2.datum) ? rawDatum2.datum : rawDatum2;
-    }
-    if (!item || !value && !item.datum) {
-      if (!isCoarsePointer()) el.classList.remove("visible");
-      return;
-    }
-    const rawDatum = item.datum || {};
-    const datum = rawDatum.datum && typeof rawDatum.datum === "object" && !Array.isArray(rawDatum.datum) ? rawDatum.datum : rawDatum;
-    const tooltipValue = value && Object.keys(value).length > 0 ? value : null;
-    const pickColor = (c) => c && c !== "transparent" ? c : "";
-    const color = pickColor(item.fill) || pickColor(item.stroke) || pickColor(datum.fill) || pickColor(datum.stroke) || "var(--chart-1)";
-    let html = "";
-    let colorScale = null;
-    try {
-      colorScale = getView()?.scale("color");
-    } catch {
-    }
-    if (chartMeta) {
-      const { markType: markType2, categoryField, categoryType, seriesField: seriesField2, valueFields, data } = chartMeta;
-      if (markType2 === "arc") {
-        const sliceName = categoryField ? datum[categoryField] : null;
-        const sliceValue = valueFields[0] ? datum[valueFields[0]] : null;
-        if (sliceName != null) {
-          html += `<div class="vg-tooltip-header">${formatTooltipValue(sliceName)}</div>`;
-        }
-        if (sliceValue != null && valueFields[0]) {
-          html += `
-            <div class="vg-tooltip-row">
-              <span class="vg-tooltip-dot" style="background-color: ${color}"></span>
-              <span class="vg-tooltip-key">${valueFields[0].replace(/_/g, " ")}:</span>
-              <span class="vg-tooltip-value">${formatTooltipValue(sliceValue)}</span>
-            </div>
-          `;
-        }
-        const pctValue = datum["__pct"] ?? datum["pct"];
-        if (pctValue != null) {
-          html += `
-            <div class="vg-tooltip-row">
-              <span class="vg-tooltip-dot" style="background-color: transparent"></span>
-              <span class="vg-tooltip-key">Share:</span>
-              <span class="vg-tooltip-value">${typeof pctValue === "number" ? (pctValue * 100).toFixed(1) + "%" : pctValue}</span>
-            </div>
-          `;
-        }
-      } else if (seriesField2 && categoryField && data.length > 0) {
-        const categoryValue = datum[categoryField];
-        const toEpoch = (v) => {
-          if (v == null) return null;
-          if (typeof v === "number") return v;
-          if (typeof v === "string") {
-            const d = new Date(v);
-            return isNaN(d.getTime()) ? null : d.getTime();
-          }
-          return null;
-        };
-        let siblings;
-        if (categoryType === "temporal") {
-          const hoveredEpoch = toEpoch(categoryValue);
-          siblings = hoveredEpoch != null ? data.filter((d) => toEpoch(d[categoryField]) === hoveredEpoch) : [];
-        } else {
-          siblings = data.filter((d) => d[categoryField] === categoryValue);
-        }
-        html += `<div class="vg-tooltip-header">${formatTooltipValue(categoryValue, categoryType)}</div>`;
-        if (siblings.length > 0) {
-          const sortedSiblings = [...siblings].sort((a, b) => {
-            const av = valueFields[0] ? a[valueFields[0]] : null;
-            const bv = valueFields[0] ? b[valueFields[0]] : null;
-            if (typeof av === "number" && typeof bv === "number") return bv - av;
-            return 0;
-          });
-          for (const sib of sortedSiblings) {
-            const seriesName = String(sib[seriesField2] || "");
-            const seriesValue = valueFields[0] ? sib[valueFields[0]] : null;
-            const seriesColor = colorScale ? colorScale(seriesName) : color;
-            html += `
-              <div class="vg-tooltip-row">
-                <span class="vg-tooltip-dot" style="background-color: ${seriesColor}"></span>
-                <span class="vg-tooltip-key">${seriesName}:</span>
-                <span class="vg-tooltip-value">${formatTooltipValue(seriesValue)}</span>
-              </div>
-            `;
-          }
-        } else {
-          const seriesName = String(datum[seriesField2] || "");
-          const seriesValue = valueFields[0] ? datum[valueFields[0]] : null;
-          html += `
-            <div class="vg-tooltip-row">
-              <span class="vg-tooltip-dot" style="background-color: ${color}"></span>
-              <span class="vg-tooltip-key">${seriesName}:</span>
-              <span class="vg-tooltip-value">${formatTooltipValue(seriesValue)}</span>
-            </div>
-          `;
-        }
-      } else if (categoryField) {
-        const categoryValue = datum[categoryField];
-        html += `<div class="vg-tooltip-header">${formatTooltipValue(categoryValue, categoryType)}</div>`;
-        for (const vf of valueFields) {
-          const val = datum[vf];
-          if (val != null) {
-            html += `
-              <div class="vg-tooltip-row">
-                <span class="vg-tooltip-dot" style="background-color: ${color}"></span>
-                <span class="vg-tooltip-key">${vf.replace(/_/g, " ")}:</span>
-                <span class="vg-tooltip-value">${formatTooltipValue(val)}</span>
-              </div>
-            `;
-          }
-        }
-      }
-    }
-    if (!html) {
-      const source = tooltipValue || datum;
-      const entries = Object.entries(source).filter(
-        ([key]) => !key.startsWith("__") && !key.startsWith("sum_") && key !== "Symbol(vega_id)"
-      );
-      for (const [key, val] of entries) {
-        html += `
-          <div class="vg-tooltip-row">
-            <span class="vg-tooltip-dot" style="background-color: ${color}"></span>
-            <span class="vg-tooltip-key">${key.replace(/_/g, " ")}:</span>
-            <span class="vg-tooltip-value">${formatTooltipValue(val)}</span>
-          </div>
-        `;
-      }
-    }
-    const headerMatch = html.match(/^(<div class="vg-tooltip-header">[\s\S]*?<\/div>)/);
-    if (headerMatch) {
-      const headerHtml = headerMatch[1];
-      const bodyHtml = html.slice(headerMatch[0].length);
-      el.innerHTML = headerHtml + `<div class="vg-tooltip-body scrollbar">${bodyHtml}</div>`;
-    } else {
-      el.innerHTML = `<div class="vg-tooltip-body scrollbar">${html}</div>`;
-    }
-    el.classList.add("visible");
-    let container = null;
-    try {
-      container = getView()?.container() ?? null;
-    } catch {
-    }
-    positionTooltip2(el, event, container);
-  };
-}
-function findClosestField(missingField, dataKeys, sampleRow, encType) {
-  const lower = missingField.toLowerCase();
-  const keys = Array.from(dataKeys);
-  const ciMatch = keys.find((k) => k.toLowerCase() === lower);
-  if (ciMatch) return ciMatch;
-  const substringMatches = keys.filter(
-    (k) => k.toLowerCase().includes(lower) || lower.includes(k.toLowerCase())
-  );
-  if (substringMatches.length === 1) return substringMatches[0];
-  if (substringMatches.length > 1) {
-    substringMatches.sort(
-      (a, b) => Math.abs(a.length - missingField.length) - Math.abs(b.length - missingField.length)
-    );
-    return substringMatches[0];
-  }
-  if (encType === "quantitative") {
-    const numericKey = keys.find((k) => typeof sampleRow[k] === "number");
-    if (numericKey) return numericKey;
-  }
-  if (encType === "nominal" || encType === "ordinal") {
-    const stringKey = keys.find((k) => typeof sampleRow[k] === "string");
-    if (stringKey) return stringKey;
-  }
-  return null;
-}
-function sanitizeSpec(spec) {
-  const data = spec.data;
-  const values = data?.values;
-  if (!values || values.length === 0) return spec;
-  const sampleRow = values[0];
-  const dataKeys = new Set(Object.keys(sampleRow));
-  function collectTransformKeys(transforms, into) {
-    if (!transforms) return;
-    for (const t of transforms) {
-      if (t.fold) {
-        const foldAs = Array.isArray(t.as) ? t.as : ["key", "value"];
-        for (const f of foldAs) into.add(f);
-      }
-      if (t.calculate && typeof t.as === "string") into.add(t.as);
-      if (t.aggregate && Array.isArray(t.aggregate)) {
-        for (const agg of t.aggregate) {
-          if (typeof agg.as === "string") into.add(agg.as);
-        }
-      }
-      if (typeof t.as === "string" && t.lookup) into.add(t.as);
-    }
-  }
-  function fixEncoding(encoding, keys = dataKeys) {
-    const fixed = {};
-    for (const [channel, enc] of Object.entries(encoding)) {
-      if (!enc || typeof enc !== "object" || !("field" in enc)) {
-        fixed[channel] = enc;
-        continue;
-      }
-      const e = { ...enc };
-      const field = e.field;
-      if (field && keys.has(field)) {
-        const sampleValue = sampleRow[field];
-        if (sampleValue !== void 0 && typeof sampleValue === "string" && e.type === "quantitative") {
-          e.type = "nominal";
-        }
-      } else if (field && !keys.has(field)) {
-        const match = findClosestField(field, keys, sampleRow, e.type);
-        if (match) {
-          e.field = match;
-          const matchedValue = sampleRow[match];
-          if (typeof matchedValue === "string" && e.type === "quantitative") {
-            e.type = "nominal";
-          } else if (typeof matchedValue === "number" && (e.type === "nominal" || e.type === "ordinal")) {
-            e.type = "quantitative";
-          }
-        }
-      }
-      fixed[channel] = e;
-    }
-    return fixed;
-  }
-  collectTransformKeys(spec.transform, dataKeys);
-  let result = { ...spec };
-  if (spec.encoding) {
-    result.encoding = fixEncoding(spec.encoding);
-  }
-  if (result.encoding) {
-    const enc = result.encoding;
-    const colorEnc = enc.color;
-    if (colorEnc?.scale && colorEnc.scale.range) {
-      const { range: _range, ...scaleWithoutRange } = colorEnc.scale;
-      result = {
-        ...result,
-        encoding: {
-          ...enc,
-          color: {
-            ...colorEnc,
-            scale: Object.keys(scaleWithoutRange).length > 0 ? scaleWithoutRange : void 0
-          }
-        }
-      };
-    }
-  }
-  if (spec.layer) {
-    const layers = spec.layer;
-    result.layer = layers.map((layer) => {
-      if (!layer.encoding) return layer;
-      const layerKeys = new Set(dataKeys);
-      collectTransformKeys(layer.transform, layerKeys);
-      return { ...layer, encoding: fixEncoding(layer.encoding, layerKeys) };
-    });
-  }
-  if (result.encoding) {
-    const enc = result.encoding;
-    const xEnc = enc.x;
-    if (xEnc?.type === "temporal" && !xEnc.timeUnit) {
-      const xField = xEnc.field;
-      if (xField && values && values.length > 0) {
-        const sample = values[0][xField];
-        if (typeof sample === "string" && /^\d{4}-\d{2}$/.test(sample)) {
-          result = {
-            ...result,
-            encoding: { ...enc, x: { ...xEnc, timeUnit: "yearmonth" } }
-          };
-        }
-      }
-    }
-  }
-  const markType2 = typeof result.mark === "string" ? result.mark : result.mark?.type;
-  if (markType2 === "bar") {
-    const enc = result.encoding;
-    if (enc) {
-      const newEnc = { ...enc };
-      const xField = newEnc.x?.field;
-      for (const ch of Object.keys(newEnc)) {
-        const chEnc = newEnc[ch];
-        if (!chEnc || typeof chEnc !== "object") continue;
-        if (chEnc.type !== "temporal") continue;
-        const updated = { ...chEnc };
-        if (ch === "x") {
-          if (!updated.timeUnit) updated.timeUnit = "yearmonth";
-          updated.scale = { ...updated.scale ?? {}, nice: false };
-          const field = updated.field;
-          if (field && values && updated.timeUnit === "yearmonth") {
-            const midpoints = Array.from(
-              new Set(values.map((r) => r[field]).filter((v) => v != null))
-            ).map((v) => {
-              const d = new Date(String(v));
-              if (isNaN(d.getTime())) return v;
-              return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, "0")}-15`;
-            });
-            if (midpoints.length > 0) {
-              updated.axis = { ...updated.axis ?? {}, values: midpoints };
-            }
-          }
-        } else if (updated.timeUnit && updated.field === xField) {
-          const { timeUnit: _tu, ...rest } = updated;
-          newEnc[ch] = rest;
-          continue;
-        }
-        newEnc[ch] = updated;
-      }
-      result = { ...result, encoding: newEnc };
-    }
-    const yEnc = result.encoding?.y;
-    if (yEnc?.type === "quantitative" && yEnc.scale?.domain) {
-      const { domain: _domain, ...scaleWithoutDomain } = yEnc.scale;
-      const newYEnc = Object.keys(scaleWithoutDomain).length === 0 ? (({ scale: _scale, ...rest }) => rest)(yEnc) : { ...yEnc, scale: scaleWithoutDomain };
-      result = {
-        ...result,
-        encoding: {
-          ...result.encoding,
-          y: newYEnc
-        }
-      };
-    }
-  }
-  return result;
-}
-function isFullVega(spec) {
-  const schema = typeof spec.$schema === "string" ? spec.$schema : "";
-  if (schema.includes("vega-lite")) return false;
-  if (schema.includes("vega/v")) return true;
-  if ("marks" in spec) return true;
-  return false;
-}
-var COMPACT_AXIS_EXPR = [
-  "datum.value >= 1e12 ? format(datum.value / 1e12, ',.1f') + 'T'",
-  "datum.value >= 1e9 ? format(datum.value / 1e9, ',.1f') + 'B'",
-  "datum.value >= 1e6 ? format(datum.value / 1e6, ',.1f') + 'M'",
-  "datum.value >= 1e3 ? format(datum.value / 1e3, ',.1f') + 'K'",
-  "format(datum.value, ',.0f')"
-].join(" : ");
-function injectAxisFormat(spec) {
-  if (spec.layer || spec.hconcat || spec.vconcat || spec.concat) return spec;
-  const encoding = spec.encoding;
-  if (!encoding) return spec;
-  const xEnc = encoding.x;
-  const yEnc = encoding.y;
-  const newEncoding = { ...encoding };
-  if (xEnc?.type === "quantitative" && !xEnc.axis) {
-    newEncoding.x = { ...xEnc, axis: { labelExpr: COMPACT_AXIS_EXPR } };
-  }
-  if (yEnc?.type === "quantitative" && !yEnc.axis) {
-    newEncoding.y = { ...yEnc, axis: { labelExpr: COMPACT_AXIS_EXPR } };
-  }
-  return { ...spec, encoding: newEncoding };
-}
-function injectAreaGradient(spec) {
-  if (spec.layer || spec.hconcat || spec.vconcat || spec.concat) return spec;
-  const mark = spec.mark;
-  if (!mark) return spec;
-  const markType2 = typeof mark === "string" ? mark : mark?.type;
-  if (markType2 !== "line") return spec;
-  const encoding = spec.encoding;
-  if (!encoding) return spec;
-  const xEnc = encoding.x;
-  if (!xEnc || xEnc.type !== "temporal") return spec;
-  const colorEnc = encoding.color;
-  const { mark: _mark, ...rest } = spec;
-  const markObj = typeof mark === "string" ? {} : { ...mark };
-  delete markObj.type;
-  delete markObj.point;
-  const hoverParams = [
-    {
-      name: "hover",
-      select: { type: "point", on: "pointerover", nearest: true, clear: "pointerout" },
-      empty: false
-    }
-  ];
-  const tooltipFields = [];
-  for (const [channel, enc] of Object.entries(encoding)) {
-    if (enc && typeof enc === "object" && "field" in enc) {
-      const e = enc;
-      tooltipFields.push({ field: e.field, type: e.type || "nominal" });
-    }
-  }
-  const crosshairColor = typeof document !== "undefined" ? getComputedStyle(document.documentElement).getPropertyValue("--muted-foreground").trim() || "#6b7280" : "#6b7280";
-  const crosshairRule = {
-    mark: { type: "rule", strokeWidth: 1, strokeDash: [4, 4] },
-    encoding: {
-      x: xEnc,
-      opacity: { condition: { param: "hover", value: 0.5 }, value: 0 },
-      color: { value: crosshairColor }
-    }
-  };
-  if (colorEnc) {
-    return {
-      ...rest,
-      layer: [
-        {
-          mark: { type: "area", opacity: 0.15, line: false, ...markObj },
-          encoding: { ...encoding, y: { ...encoding.y ?? {}, stack: null }, tooltip: tooltipFields }
-        },
-        {
-          mark: { type: "line", strokeWidth: 2, ...markObj },
-          encoding: { ...encoding, tooltip: tooltipFields }
-        },
-        crosshairRule,
-        {
-          params: hoverParams,
-          mark: { type: "point", filled: true, size: 20, ...markObj },
-          encoding: {
-            ...encoding,
-            tooltip: tooltipFields,
-            opacity: { condition: { param: "hover", value: 1 }, value: 0 }
-          }
-        }
-      ]
-    };
-  }
-  return {
-    ...rest,
-    layer: [
-      {
-        mark: {
-          type: "area",
-          opacity: 0.3,
-          line: false,
-          color: {
-            x1: 1,
-            y1: 1,
-            x2: 1,
-            y2: 0,
-            gradient: "linear",
-            stops: [
-              { offset: 0, color: "transparent" },
-              { offset: 1, color: PRIMARY_COLOR }
-            ]
-          },
-          ...markObj
-        },
-        encoding: { ...encoding, tooltip: tooltipFields }
-      },
-      {
-        mark: {
-          type: "line",
-          strokeWidth: 2,
-          color: PRIMARY_COLOR,
-          ...markObj
-        },
-        encoding: { ...encoding, tooltip: tooltipFields }
-      },
-      crosshairRule,
-      {
-        params: hoverParams,
-        mark: { type: "point", filled: true, size: 60, color: PRIMARY_COLOR },
-        encoding: {
-          ...encoding,
-          tooltip: tooltipFields,
-          opacity: { condition: { param: "hover", value: 1 }, value: 0 }
-        }
-      }
-    ]
-  };
-}
-function injectAreaHover(spec) {
-  if (spec.layer || spec.hconcat || spec.vconcat || spec.concat) return spec;
-  const mark = spec.mark;
-  if (!mark) return spec;
-  const markType2 = typeof mark === "string" ? mark : mark?.type;
-  if (markType2 !== "area") return spec;
-  const encoding = spec.encoding;
-  if (!encoding) return spec;
-  if (spec.params || spec.selection) return spec;
-  const xEnc = encoding.x;
-  if (!xEnc) return spec;
-  const { mark: originalMark, ...rest } = spec;
-  const tooltipFields = [];
-  for (const [channel, enc] of Object.entries(encoding)) {
-    if (enc && typeof enc === "object" && "field" in enc) {
-      const e = enc;
-      tooltipFields.push({ field: e.field, type: e.type || "nominal" });
-    }
-  }
-  const crosshairColor = typeof document !== "undefined" ? getComputedStyle(document.documentElement).getPropertyValue("--muted-foreground").trim() || "#6b7280" : "#6b7280";
-  return {
-    ...rest,
-    layer: [
-      // Original area mark
-      { mark: originalMark, encoding: { ...encoding, tooltip: tooltipFields } },
-      // Vertical crosshair rule
-      {
-        mark: { type: "rule", strokeWidth: 1, strokeDash: [4, 4] },
-        encoding: {
-          x: xEnc,
-          opacity: { condition: { param: "hover", value: 0.5 }, value: 0 },
-          color: { value: crosshairColor }
-        }
-      },
-      // Invisible point overlay — voronoi covers entire chart area
-      {
-        params: [
-          {
-            name: "hover",
-            select: { type: "point", on: "pointerover", nearest: true, clear: "pointerout" }
-          }
-        ],
-        mark: { type: "point", filled: true, size: 60 },
-        encoding: {
-          ...encoding,
-          tooltip: tooltipFields,
-          opacity: { condition: { param: "hover", value: 1 }, value: 0 }
-        }
-      }
-    ]
-  };
-}
-function injectBarHighlight(spec) {
-  if (spec.layer || spec.hconcat || spec.vconcat || spec.concat) return spec;
-  const mark = spec.mark;
-  if (!mark) return spec;
-  const markType2 = typeof mark === "string" ? mark : mark?.type;
-  if (markType2 !== "bar") return spec;
-  const encoding = spec.encoding;
-  if (!encoding) return spec;
-  if (spec.params || spec.selection) return spec;
-  if (encoding.opacity) return spec;
-  const colorEnc = encoding.color;
-  const colorIsCategorical = colorEnc && (colorEnc.type === "nominal" || colorEnc.type === "ordinal");
-  const xEnc = encoding.x;
-  const yEnc = encoding.y;
-  const isHorizontalBar = xEnc?.type === "quantitative" && (yEnc?.type === "nominal" || yEnc?.type === "ordinal");
-  const categoryAxis = isHorizontalBar ? "y" : "x";
-  return {
-    ...spec,
-    params: [
-      {
-        name: "barHover",
-        select: {
-          type: "point",
-          on: "pointerover",
-          clear: "pointerout",
-          ...colorIsCategorical ? { encodings: [categoryAxis] } : {}
-        }
-      }
-    ],
-    encoding: {
-      ...encoding,
-      opacity: {
-        condition: { param: "barHover", empty: true, value: 1 },
-        value: 0.3
-      }
-    }
-  };
-}
-function injectPieLabels(spec) {
-  if (spec.layer || spec.hconcat || spec.vconcat || spec.concat) return spec;
-  const mark = spec.mark;
-  if (!mark) return spec;
-  const markType2 = typeof mark === "string" ? mark : mark.type;
-  if (markType2 !== "arc") return spec;
-  const encoding = spec.encoding;
-  if (!encoding) return spec;
-  const thetaEnc = encoding.theta;
-  const colorEnc = encoding.color;
-  if (!thetaEnc?.field) return spec;
-  const valueField = thetaEnc.field;
-  const labelField = colorEnc?.field || valueField;
-  const markObj = typeof mark === "string" ? { type: mark } : { ...mark };
-  markObj.padAngle ??= 0.03;
-  markObj.cornerRadius ??= 4;
-  markObj.stroke ??= "var(--surface-raised, #1a1a1a)";
-  markObj.strokeWidth ??= 2;
-  const outerRadius = markObj.outerRadius ?? 120;
-  const innerRadius = markObj.innerRadius ?? 0;
-  const midRadius = Math.round((innerRadius + outerRadius) / 2);
-  const labelRadius = outerRadius + 44;
-  const { mark: _mark, encoding: arcEncoding, ...rest } = spec;
-  const thetaStackEnc = { ...thetaEnc, stack: true };
-  return {
-    ...rest,
-    __pieLabelsInjected: true,
-    // sentinel — prevents injectLayeredArcTooltip from stripping text layers
-    transform: [
-      ...spec.transform || [],
-      { window: [{ op: "sum", field: valueField, as: "__total" }], frame: [null, null] },
-      { calculate: `datum['${valueField}'] / datum.__total`, as: "__pct" },
-      { calculate: `format(datum.__pct, '.1%')`, as: "__pctLabel" }
-    ],
-    layer: [
-      // 1. Arc slices with hover-dim
-      {
-        params: [{ name: "pieHover", select: { type: "point", on: "pointerover", clear: "pointerout" } }],
-        mark: markObj,
-        encoding: {
-          ...arcEncoding,
-          theta: thetaStackEnc,
-          tooltip: [
-            { field: labelField, type: colorEnc?.type || "nominal" },
-            { field: valueField, type: "quantitative" },
-            { field: "__pct", type: "quantitative", title: "Share", format: ".1%" }
-          ],
-          opacity: {
-            condition: { param: "pieHover", empty: true, value: 1 },
-            value: 0.65
-          }
-        }
-      },
-      // 3. Inner percentage label — hidden for slices < 4% (too small to read)
-      {
-        mark: {
-          type: "text",
-          radius: midRadius,
-          fontSize: 11,
-          fontWeight: "bold",
-          align: "center",
-          baseline: "middle",
-          fill: "white"
-        },
-        encoding: {
-          text: { field: "__pctLabel", type: "nominal" },
-          theta: thetaStackEnc,
-          ...colorEnc ? { color: { ...colorEnc, legend: null } } : {},
-          opacity: { condition: { test: "datum.__pct >= 0.04", value: 1 }, value: 0 }
-        }
-      },
-      // 4. Outer category label — hidden for slices < 4%, colored to match slice
-      {
-        mark: { type: "text", radius: labelRadius, fontSize: 11, align: "center", baseline: "middle", limit: 120 },
-        encoding: {
-          text: { field: labelField, type: colorEnc?.type || "nominal" },
-          theta: thetaStackEnc,
-          color: colorEnc ?? { value: "#888" },
-          opacity: { condition: { test: "datum.__pct >= 0.04", value: 1 }, value: 0 }
-        }
-      }
-    ]
-  };
-}
-function injectLayeredArcTooltip(spec) {
-  const layers = spec.layer;
-  if (!layers || layers.length === 0) return spec;
-  if (spec.__pieLabelsInjected) return spec;
-  const arcLayer = layers.find((layer) => {
-    const m = layer.mark;
-    return (typeof m === "string" ? m : m?.type) === "arc";
-  });
-  if (!arcLayer) return spec;
-  const arcEncoding = arcLayer.encoding;
-  if (!arcEncoding) return spec;
-  const thetaEnc = arcEncoding.theta;
-  const colorEnc = arcEncoding.color;
-  const valueField = thetaEnc?.field;
-  const labelField = colorEnc?.field || valueField;
-  const existingTransforms = (spec.transform || []).filter((t) => {
-    if (t.calculate && (String(t.calculate).includes("/ datum") || String(t.as).includes("pct"))) return false;
-    if (t.window && Array.isArray(t.window) && t.window.some((w) => String(w.as).includes("total"))) return false;
-    return true;
-  });
-  const newTransforms = valueField ? [
-    ...existingTransforms,
-    { window: [{ op: "sum", field: valueField, as: "__total" }], frame: [null, null] },
-    { calculate: `datum['${valueField}'] / datum.__total`, as: "__pct" },
-    { calculate: `format(datum.__pct, '.1%')`, as: "__pctLabel" }
-  ] : existingTransforms;
-  const hoverParam = {
-    name: "pieHover",
-    select: { type: "point", on: "pointerover", clear: "pointerout" }
-  };
-  let paramsAdded = false;
-  const newLayers = layers.map((layer) => {
-    const m = layer.mark;
-    const markType2 = typeof m === "string" ? m : m?.type;
-    const encoding = layer.encoding;
-    if (markType2 === "text") {
-      return null;
-    }
-    if (markType2 !== "arc" || !encoding) return layer;
-    const result = { ...layer };
-    if (!paramsAdded) {
-      result.params = [...layer.params || [], hoverParam];
-      paramsAdded = true;
-    }
-    const newEncoding = { ...encoding };
-    const tooltipFields = [];
-    if (labelField) tooltipFields.push({ field: labelField, type: colorEnc?.type || "nominal" });
-    if (valueField) tooltipFields.push({ field: valueField, type: "quantitative" });
-    if (valueField) tooltipFields.push({ field: "__pct", type: "quantitative", title: "Share", format: ".1%" });
-    if (tooltipFields.length > 0) newEncoding.tooltip = tooltipFields;
-    newEncoding.opacity = {
-      condition: { param: "pieHover", empty: true, value: 1 },
-      value: 0.3
-    };
-    result.encoding = newEncoding;
-    return result;
-  });
-  return { ...spec, transform: newTransforms, layer: newLayers.filter(Boolean) };
-}
-function injectScatterHover(spec) {
-  if (spec.layer || spec.hconcat || spec.vconcat || spec.concat) return spec;
-  const mark = spec.mark;
-  if (!mark) return spec;
-  const markType2 = typeof mark === "string" ? mark : mark?.type;
-  if (markType2 !== "point" && markType2 !== "circle") return spec;
-  const encoding = spec.encoding;
-  if (!encoding) return spec;
-  if (spec.params || spec.selection) return spec;
-  if (encoding.size || encoding.opacity) return spec;
-  return {
-    ...spec,
-    params: [
-      {
-        name: "ptHover",
-        select: { type: "point", on: "pointerover", nearest: true, clear: "pointerout" }
-      }
-    ],
-    encoding: {
-      ...encoding,
-      size: {
-        condition: { param: "ptHover", value: 200 },
-        value: 60
-      },
-      opacity: {
-        condition: { param: "ptHover", empty: true, value: 1 },
-        value: 0.5
-      }
-    }
-  };
-}
-function injectHeatmapHover(spec) {
-  if (spec.layer || spec.hconcat || spec.vconcat || spec.concat) return spec;
-  const mark = spec.mark;
-  if (!mark) return spec;
-  const markType2 = typeof mark === "string" ? mark : mark?.type;
-  if (markType2 !== "rect") return spec;
-  const encoding = spec.encoding;
-  if (!encoding) return spec;
-  const colorEnc = encoding.color;
-  if (!colorEnc || colorEnc.type !== "quantitative") return spec;
-  if (spec.params || spec.selection) return spec;
-  return {
-    ...spec,
-    params: [
-      {
-        name: "cellHover",
-        select: { type: "point", on: "pointerover", clear: "pointerout" }
-      }
-    ],
-    encoding: {
-      ...encoding,
-      stroke: {
-        condition: { param: "cellHover", empty: false, value: "#fff" },
-        value: "transparent"
-      },
-      strokeWidth: {
-        condition: { param: "cellHover", empty: false, value: 2 },
-        value: 0
-      }
-    }
-  };
-}
-function injectLayeredLineHover(spec) {
-  const layers = spec.layer;
-  if (!layers || layers.length === 0) return spec;
-  const lineLayer = layers.find((layer) => {
-    const m = layer.mark;
-    const mt = typeof m === "string" ? m : m?.type;
-    return mt === "line" || mt === "area";
-  });
-  if (!lineLayer) return spec;
-  const hasHoverParams = layers.some((layer) => {
-    const params = layer.params;
-    return params?.some((p) => p.select?.nearest === true);
-  });
-  if (hasHoverParams) return spec;
-  const hasArc = layers.some((layer) => {
-    const m = layer.mark;
-    return (typeof m === "string" ? m : m?.type) === "arc";
-  });
-  if (hasArc) return spec;
-  const encoding = lineLayer.encoding || spec.encoding;
-  if (!encoding) return spec;
-  const xEnc = encoding.x;
-  if (!xEnc) return spec;
-  const tooltipFields = [];
-  for (const [, enc] of Object.entries(encoding)) {
-    if (enc && typeof enc === "object" && "field" in enc) {
-      const e = enc;
-      tooltipFields.push({ field: e.field, type: e.type || "nominal" });
-    }
-  }
-  const crosshairColor = typeof document !== "undefined" ? getComputedStyle(document.documentElement).getPropertyValue("--muted-foreground").trim() || "#6b7280" : "#6b7280";
-  const updatedLayers = layers.map((layer) => {
-    const layerEnc = layer.encoding;
-    if (layerEnc && !("tooltip" in layerEnc)) {
-      return { ...layer, encoding: { ...layerEnc, tooltip: tooltipFields } };
-    }
-    return layer;
-  });
-  return {
-    ...spec,
-    layer: [
-      ...updatedLayers,
-      // Crosshair rule
-      {
-        mark: { type: "rule", strokeWidth: 1, strokeDash: [4, 4] },
-        encoding: {
-          x: xEnc,
-          opacity: { condition: { param: "hover", value: 0.5 }, value: 0 },
-          color: { value: crosshairColor }
-        }
-      },
-      // Voronoi point overlay for hover-anywhere
-      {
-        params: [{ name: "hover", select: { type: "point", on: "pointerover", nearest: true, clear: "pointerout" } }],
-        mark: { type: "point", filled: true, size: 60 },
-        encoding: {
-          ...encoding,
-          tooltip: tooltipFields,
-          opacity: { condition: { param: "hover", value: 1 }, value: 0 }
-        }
-      }
-    ]
-  };
-}
-function injectTooltip(spec) {
-  const encoding = spec.encoding;
-  if (!encoding) return spec;
-  if ("tooltip" in encoding) return spec;
-  const tooltipFields = [];
-  for (const [channel, enc] of Object.entries(encoding)) {
-    if (channel === "tooltip") continue;
-    if (enc && typeof enc === "object" && "field" in enc) {
-      const e = enc;
-      tooltipFields.push({
-        field: e.field,
-        type: e.type || "nominal",
-        ...e.title ? { title: e.title } : {}
-      });
-    }
-  }
-  if (tooltipFields.length === 0) return spec;
-  const mark = spec.mark;
-  const markType2 = typeof mark === "string" ? mark : mark?.type;
-  const isLineOrArea = markType2 === "line" || markType2 === "area";
-  let result = {
-    ...spec,
-    encoding: {
-      ...encoding,
-      tooltip: tooltipFields
-    }
-  };
-  if (isLineOrArea && !spec.selection && !spec.params && !spec.layer) {
-    const { mark: originalMark, ...restSpec } = spec;
-    return {
-      ...restSpec,
-      layer: [
-        // Visual layer (line or area)
-        { mark: originalMark, encoding: { ...encoding, tooltip: tooltipFields } },
-        // Invisible point layer — voronoi covers entire chart area for hover-anywhere
-        {
-          params: [
-            {
-              name: "hover",
-              select: { type: "point", on: "pointerover", nearest: true, clear: "pointerout" }
-            }
-          ],
-          mark: { type: "point", filled: true },
-          encoding: {
-            ...encoding,
-            tooltip: tooltipFields,
-            size: { condition: { param: "hover", value: 60 }, value: 0 },
-            opacity: { condition: { param: "hover", value: 1 }, value: 0 }
-          }
-        }
-      ]
-    };
-  }
-  return result;
-}
-function isSimpleStandaloneBarSpec(spec) {
-  if (spec.layer || spec.hconcat || spec.vconcat || spec.concat) return false;
-  if (spec.facet || spec.repeat) return false;
-  const mark = spec.mark;
-  if (mark == null) return false;
-  const markType2 = typeof mark === "string" ? mark : mark.type;
-  if (markType2 !== "bar") return false;
-  const enc = spec.encoding;
-  if (!enc || typeof enc !== "object" || Array.isArray(enc)) return false;
-  return true;
-}
-function enhancePluginVegaLiteSpec(spec) {
-  const sanitized = sanitizeSpec(spec);
-  const chartMeta = extractChartMeta(sanitized);
-  try {
-    if (isSimpleStandaloneBarSpec(sanitized)) {
-      const specWithFormat2 = injectAxisFormat(sanitized);
-      const specWithBarHL2 = injectBarHighlight(specWithFormat2);
-      const specWithTooltip2 = injectTooltip(specWithBarHL2);
-      return { vlSpec: specWithTooltip2, chartMeta };
-    }
-    const specWithFormat = injectAxisFormat(sanitized);
-    const specWithGradient = injectAreaGradient(specWithFormat);
-    const specWithAreaHover = injectAreaHover(specWithGradient);
-    const specWithLayeredLine = injectLayeredLineHover(specWithAreaHover);
-    const specWithBarHL = injectBarHighlight(specWithLayeredLine);
-    const specWithScatter = injectScatterHover(specWithBarHL);
-    const specWithHeatmap = injectHeatmapHover(specWithScatter);
-    const specWithLabels = injectPieLabels(specWithHeatmap);
-    const specWithArcTooltip = injectLayeredArcTooltip(specWithLabels);
-    const specWithTooltip = injectTooltip(specWithArcTooltip);
-    return { vlSpec: specWithTooltip, chartMeta };
-  } catch (enhanceErr) {
-    console.warn("[VegaChartBlock] Enhanced spec failed, using sanitized spec:", enhanceErr);
-    return { vlSpec: sanitized, chartMeta };
-  }
-}
-function PluginVegaEmbed({
-  spec,
-  isVegaLite,
-  legendOrientation = "top",
-  showLegend = true,
-  showTitle = true,
-  onView,
-  disableTooltip = false,
-  highlight,
-  stripHover = false
-}) {
-  const [error, setError] = useState(null);
-  const theme = useMemo(() => resolveSebatiTheme(), []);
-  const viewRef = useRef(null);
-  const vegaThemeOpts = useMemo(
-    () => ({ legendOrientation, showLegend, showTitle }),
-    [legendOrientation, showLegend, showTitle]
-  );
-  const { embedSpec, chartMeta, vegaEmbedConfigReplace } = useMemo(() => {
-    const vlConfig = buildVegaTheme(vegaThemeOpts);
-    if (!isVegaLite) {
-      return {
-        embedSpec: spec,
-        chartMeta: null,
-        vegaEmbedConfigReplace: vlConfig
-      };
-    }
-    const { vlSpec, chartMeta: chartMeta2 } = enhancePluginVegaLiteSpec(spec);
-    const highlighted = stripHover ? applyTouchInteraction(vlSpec, highlight ?? null) : vlSpec;
-    return {
-      embedSpec: highlighted,
-      chartMeta: chartMeta2,
-      vegaEmbedConfigReplace: vlConfig
-    };
-  }, [spec, isVegaLite, vegaThemeOpts, highlight, stripHover]);
-  const embedTooltip = useMemo(
-    () => createCustomTooltipHandler(() => viewRef.current, chartMeta),
-    [chartMeta]
-  );
-  const onEmbedError = useCallback((err) => {
-    setError(err ? err.message : null);
-  }, []);
-  const handleViewReady = useCallback(
-    (v) => {
-      viewRef.current = v;
-      onView?.(v);
-    },
-    [onView]
-  );
-  useEffect(() => {
-    setError(null);
-  }, [embedSpec]);
-  useEffect(() => {
-    ensureTooltipStyles();
-    installTouchDismiss();
-  }, []);
-  if (error) {
-    return /* @__PURE__ */ jsxs("div", { className: "rounded-md bg-destructive/10 p-3 text-sm text-destructive", children: [
-      "Chart render error: ",
-      error
-    ] });
-  }
-  return /* @__PURE__ */ jsx(
-    VegaChartFlexEmbed,
-    {
-      spec: embedSpec,
-      theme,
-      config: PLUGIN_VEGA_CHART_CONFIG,
-      embedTooltip: disableTooltip ? false : embedTooltip,
-      vegaEmbedConfigReplace,
-      tooltipHideElementId: "vg-tooltip-element",
-      onViewReady: handleViewReady,
-      onEmbedError,
-      className: "w-full [&>svg]:w-full"
-    }
-  );
-}
-function isVegaSpec(obj) {
-  if (!obj || typeof obj !== "object" || Array.isArray(obj)) return false;
-  const o = obj;
-  return !!(o.$schema || o.mark || o.marks || o.layer || o.data || o.encoding);
-}
-function fixMisnestedSpec(obj) {
-  const data = obj.data;
-  if (!data || typeof data !== "object" || Array.isArray(data)) return obj;
-  const hoistKeys = ["mark", "encoding", "layer", "transform", "params", "selection"];
-  const misnestedKeys = hoistKeys.filter((k) => k in data && !(k in obj));
-  if (misnestedKeys.length === 0) return obj;
-  const fixedData = {};
-  const hoisted = {};
-  for (const [k, v] of Object.entries(data)) {
-    if (misnestedKeys.includes(k)) hoisted[k] = v;
-    else fixedData[k] = v;
-  }
-  return { ...obj, data: fixedData, ...hoisted };
-}
-function parseVegaJson(content) {
-  const trimmed = content.trim();
-  try {
-    const obj = JSON.parse(trimmed);
-    if (isVegaSpec(obj)) return fixMisnestedSpec(obj);
-  } catch {
-  }
-  const start = trimmed.indexOf("{");
-  if (start < 0) return null;
-  let depth = 0;
-  let inString = false;
-  let escape = false;
-  for (let i = start; i < trimmed.length; i++) {
-    const ch = trimmed[i];
-    if (escape) {
-      escape = false;
-      continue;
-    }
-    if (ch === "\\") {
-      escape = true;
-      continue;
-    }
-    if (ch === '"') {
-      inString = !inString;
-      continue;
-    }
-    if (inString) continue;
-    if (ch === "{") depth++;
-    else if (ch === "}") {
-      depth--;
-      if (depth === 0) {
-        const extracted = trimmed.substring(start, i + 1);
-        try {
-          const obj = JSON.parse(extracted);
-          if (isVegaSpec(obj)) return fixMisnestedSpec(obj);
-        } catch {
-        }
-      }
-    }
-  }
-  for (let extra = 1; extra <= 3; extra++) {
-    try {
-      const obj = JSON.parse(trimmed + "}".repeat(extra));
-      if (isVegaSpec(obj)) return fixMisnestedSpec(obj);
-    } catch {
-    }
-  }
-  let cleaned = trimmed;
-  for (let i = 0; i < 10; i++) {
-    cleaned = cleaned.replace(/[}"'\s]$/, "");
-    for (let extra = 0; extra <= 3; extra++) {
-      try {
-        const obj = JSON.parse(cleaned + "}".repeat(1 + extra));
-        if (isVegaSpec(obj)) return fixMisnestedSpec(obj);
-      } catch {
-      }
-    }
-  }
-  return null;
-}
-function VegaChartBlockInner({
-  content,
-  vegaSpec,
-  isStreaming,
-  onExpand,
-  legendOrientation,
-  showLegend,
-  showTitle
-}) {
-  const isMobile = useIsMobile();
-  const [view, setView] = useState(null);
-  const [selected, setSelected] = useState(null);
-  const parsed = useMemo(() => {
-    if (vegaSpec && typeof vegaSpec === "object" && !Array.isArray(vegaSpec)) {
-      return vegaSpec;
-    }
-    if (content != null && content !== "") {
-      return parseVegaJson(content);
-    }
-    return null;
-  }, [vegaSpec, content]);
-  const rawFallback = content ?? (vegaSpec ? JSON.stringify(vegaSpec) : "");
-  const summary = useMemo(
-    () => parsed && !isFullVega(parsed) ? summarize(parsed) : null,
-    [parsed]
-  );
-  const title = useMemo(() => parsed ? chartTitle(parsed) : null, [parsed]);
-  const highlight = useMemo(() => {
-    if (!selected || !summary) return null;
-    const field = summary.kind === "composition" ? summary.seriesField : summary.bucketField;
-    return field ? { field, value: selected } : null;
-  }, [selected, summary]);
-  useEffect(() => setSelected(null), [parsed]);
-  const useCard = isMobile && !!summary;
-  const cardHasBand = useCard && summary?.kind === "composition";
-  const spec = useMemo(() => {
-    if (!parsed) return null;
-    const base = {
-      ...parsed,
-      width: parsed.width ?? "container",
-      height: parsed.height ?? 300
-    };
-    if (!isMobile) return base;
-    return adaptSpecForMobile(base, false, !!summarize(base)).spec;
-  }, [parsed, isMobile]);
-  const scrolls = useMemo(
-    () => isMobile && parsed ? adaptSpecForMobile(parsed).scrolls : false,
-    [isMobile, parsed]
-  );
-  if (isStreaming && !parsed) {
-    return /* @__PURE__ */ jsx(ChartBlockSkeleton, { type: "vega-chart" });
-  }
-  if (!parsed || !spec) {
-    return /* @__PURE__ */ jsx(RawJsonFallback, { content: rawFallback });
-  }
-  const fullVega = isFullVega(parsed);
-  const plot = /* @__PURE__ */ jsx(ChartErrorBoundary, { fallback: /* @__PURE__ */ jsx(RawJsonFallback, { content: rawFallback }), children: /* @__PURE__ */ jsx("div", { className: scrolls ? "overflow-x-auto overscroll-x-contain scrollbar" : void 0, children: /* @__PURE__ */ jsx(
-    PluginVegaEmbed,
-    {
-      spec,
-      isVegaLite: !fullVega,
-      legendOrientation,
-      showLegend: useCard ? false : showLegend,
-      showTitle: useCard ? false : showTitle,
-      onView: setView,
-      disableTooltip: cardHasBand,
-      highlight: useCard ? highlight : null,
-      stripHover: isMobile
-    }
-  ) }) });
-  if (useCard) {
-    return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
-      ChartCardMobile,
-      {
-        title,
-        summary,
-        view,
-        scrolls,
-        selected,
-        onSelect: setSelected,
-        onExpand,
-        children: plot
-      }
-    ) });
-  }
-  return /* @__PURE__ */ jsx("div", { className: "my-4 w-full rounded-xl border bg-surface-raised p-4 max-md:px-2 max-md:pb-2", children: plot });
-}
-function vegaChartBlockPropsEqual(a, b) {
-  return a.content === b.content && a.vegaSpec === b.vegaSpec && a.isStreaming === b.isStreaming && a.onExpand === b.onExpand && a.legendOrientation === b.legendOrientation && a.showLegend === b.showLegend && a.showTitle === b.showTitle;
-}
-var VegaChartBlock = memo(VegaChartBlockInner, vegaChartBlockPropsEqual);
-VegaChartBlockInner.displayName = "VegaChartBlock";
-
-export { VegaChartBlock, enhancePluginVegaLiteSpec, isSimpleStandaloneBarSpec };