@jorgerdz/timeview 0.1.0

package/src/timeview/core/metric.ts

@@ -0,0 +1,263 @@
+// metric.ts - pure data-space helpers for MetricTimeline.
+
+import { DAY_MS, fmt } from "./time";
+import type { TimeDataset, TimeInterval } from "../types";
+
+export interface MetricPoint {
+  t: number;
+  at: string;
+  value: number;
+}
+
+export interface MetricState extends TimeInterval {
+  _s: number;
+  _e: number;
+}
+
+export interface MetricEvent {
+  id: string;
+  title: string;
+  labelIds?: string[];
+  _t: number;
+}
+
+export interface MetricTarget {
+  value: number;
+  label: string;
+}
+
+export interface MetricModel {
+  samples: MetricPoint[];
+  states: MetricState[];
+  events: MetricEvent[];
+  T0: number;
+  T1: number;
+  unit: string;
+  name: string;
+  target: MetricTarget | null;
+  vMin: number;
+  vMax: number;
+}
+
+export interface NiceTicks {
+  lo: number;
+  hi: number;
+  step: number;
+  ticks: number[];
+}
+
+export interface MetricTimeTick {
+  t: number;
+  label: string;
+  strong: boolean;
+}
+
+export interface MetricLineSegment {
+  a: MetricPoint;
+  b: MetricPoint;
+  labelId: string | null;
+}
+
+export const METRIC_MIN_SPAN = 5 * DAY_MS;
+
+function startOfDayUTC(value: number | string | Date): number {
+  const date = value instanceof Date ? value : new Date(value);
+  return Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate());
+}
+
+export function tvNiceTicks(min: number, max: number, target = 5): NiceTicks {
+  if (!(max > min)) {
+    const value = Number.isFinite(min) ? min : 0;
+    return { lo: value - 1, hi: value + 1, step: 1, ticks: [value - 1, value, value + 1] };
+  }
+
+  const raw = (max - min) / Math.max(1, target);
+  const mag = Math.pow(10, Math.floor(Math.log10(raw)));
+  const n = raw / mag;
+  const step = (n >= 5 ? 5 : n >= 2.5 ? 2.5 : n >= 2 ? 2 : n >= 1 ? 1 : 0.5) * mag;
+  const lo = Math.floor(min / step) * step;
+  const hi = Math.ceil(max / step) * step;
+  const ticks: number[] = [];
+  for (let value = lo; value <= hi + step * 1e-6; value += step) {
+    ticks.push(Math.round(value * 1000) / 1000);
+  }
+  return { lo, hi, step, ticks };
+}
+
+export function tvMetricTimeTicks(v0: number, v1: number): MetricTimeTick[] {
+  const days = (v1 - v0) / DAY_MS;
+  const ticks: MetricTimeTick[] = [];
+  const push = (t: number, label: string, strong: boolean) => {
+    if (t >= v0 - 1 && t <= v1 + 1) ticks.push({ t, label, strong });
+  };
+
+  if (days <= 16) {
+    const step = days <= 8 ? 1 : 2;
+    const base = startOfDayUTC(v0);
+    let d = base;
+    if (d < v0) d += DAY_MS;
+    for (; d <= v1; d += DAY_MS) {
+      if (Math.round((d - base) / DAY_MS) % step !== 0) continue;
+      const date = new Date(d);
+      push(d, fmt.monDay(date), date.getUTCDate() === 1);
+    }
+  } else if (days <= 70) {
+    let d = startOfDayUTC(v0);
+    const dow = (new Date(d).getUTCDay() + 6) % 7;
+    d += ((7 - dow) % 7) * DAY_MS;
+    for (; d <= v1; d += 7 * DAY_MS) {
+      const date = new Date(d);
+      push(d, fmt.monDay(date), date.getUTCDate() <= 7);
+    }
+  } else if (days <= 240) {
+    let d = Date.UTC(new Date(v0).getUTCFullYear(), new Date(v0).getUTCMonth(), 1);
+    while (d <= v1) {
+      const date = new Date(d);
+      push(d, fmt.mon(date), true);
+      push(Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), 15), "15", false);
+      d = Date.UTC(date.getUTCFullYear(), date.getUTCMonth() + 1, 1);
+    }
+  } else {
+    let d = Date.UTC(new Date(v0).getUTCFullYear(), new Date(v0).getUTCMonth(), 1);
+    if (d < v0) {
+      const date = new Date(d);
+      d = Date.UTC(date.getUTCFullYear(), date.getUTCMonth() + 1, 1);
+    }
+    while (d <= v1) {
+      const date = new Date(d);
+      push(d, fmt.mon(date), date.getUTCMonth() === 0);
+      d = Date.UTC(date.getUTCFullYear(), date.getUTCMonth() + 1, 1);
+    }
+  }
+  return ticks;
+}
+
+export function tvStateAt(states: MetricState[], t: number): MetricState | null {
+  return states.find((state) => t >= state._s && t < state._e) || null;
+}
+
+export function tvMetricModel(dataset: TimeDataset): MetricModel {
+  const series = dataset.series;
+  const samples = (series?.samples || [])
+    .map((point) => ({ t: Date.parse(point.at), at: point.at, value: point.value }))
+    .filter((point) => Number.isFinite(point.t) && Number.isFinite(point.value))
+    .sort((a, b) => a.t - b.t);
+
+  const states = (dataset.intervals || [])
+    .map((interval) => ({
+      ...interval,
+      _s: Date.parse(interval.range.start),
+      _e: startOfDayUTC(interval.range.end) + DAY_MS,
+    }))
+    .filter((state) => Number.isFinite(state._s) && Number.isFinite(state._e) && state._e > state._s)
+    .sort((a, b) => a._s - b._s);
+
+  const events = (dataset.events || [])
+    .map((event) => ({ id: event.id, title: event.title, labelIds: event.labelIds, _t: Date.parse(event.at) }))
+    .filter((event) => Number.isFinite(event._t))
+    .sort((a, b) => a._t - b._t);
+
+  const times: number[] = [];
+  samples.forEach((point) => times.push(point.t));
+  states.forEach((state) => times.push(state._s, state._e));
+  events.forEach((event) => times.push(event._t));
+
+  let T0 = times.length ? Math.min(...times) : Date.UTC(2026, 0, 1);
+  let T1 = times.length ? Math.max(...times) : T0 + 30 * DAY_MS;
+  if (T1 <= T0) T1 = T0 + DAY_MS;
+
+  const values = samples.map((point) => point.value);
+  return {
+    samples,
+    states,
+    events,
+    T0,
+    T1,
+    unit: series?.unit || "",
+    name: series?.name || "Value",
+    target: typeof series?.target?.value === "number" ? { value: series.target.value, label: series.target.label || "goal" } : null,
+    vMin: values.length ? Math.min(...values) : 0,
+    vMax: values.length ? Math.max(...values) : 1,
+  };
+}
+
+export function tvDefaultViewport(model: MetricModel, days = 90, today: string | null | undefined = null): [number, number] {
+  const parsedToday = today ? Date.parse(today) : Number.NaN;
+  const end = Number.isFinite(parsedToday) ? Math.min(model.T1, parsedToday) : model.T1;
+  const span = Math.min(model.T1 - model.T0, days * DAY_MS);
+  let v1 = end;
+  let v0 = end - span;
+  if (v0 < model.T0) {
+    v0 = model.T0;
+    v1 = Math.min(model.T1, v0 + span);
+  }
+  if (v1 > model.T1) {
+    v1 = model.T1;
+    v0 = Math.max(model.T0, v1 - span);
+  }
+  if (v1 - v0 < METRIC_MIN_SPAN) v1 = v0 + METRIC_MIN_SPAN;
+  return [v0, v1];
+}
+
+export function tvClampViewport(v0: number, v1: number, model: MetricModel, mode: "pan" | "zoom" = "pan"): [number, number] {
+  const full = model.T1 - model.T0;
+  let span = Math.max(METRIC_MIN_SPAN, Math.min(full, v1 - v0));
+  if (mode === "pan") span = Math.min(full, v1 - v0);
+  let next0 = v0;
+  let next1 = next0 + span;
+  if (next0 < model.T0) {
+    next0 = model.T0;
+    next1 = next0 + span;
+  }
+  if (next1 > model.T1) {
+    next1 = model.T1;
+    next0 = next1 - span;
+  }
+  if (next0 < model.T0) next0 = model.T0;
+  return [next0, next1];
+}
+
+export function tvNearest(samples: MetricPoint[], t: number | Date): MetricPoint | null {
+  if (!samples.length) return null;
+  const time = t instanceof Date ? t.getTime() : t;
+  let lo = 0;
+  let hi = samples.length - 1;
+  while (lo < hi) {
+    const mid = (lo + hi) >> 1;
+    if (samples[mid].t < time) lo = mid + 1;
+    else hi = mid;
+  }
+  const a = samples[Math.max(0, lo - 1)];
+  const b = samples[lo];
+  return Math.abs(a.t - time) <= Math.abs(b.t - time) ? a : b;
+}
+
+export function tvLineSegments(samples: MetricPoint[], states: MetricState[]): MetricLineSegment[] {
+  const segments: MetricLineSegment[] = [];
+  for (let i = 0; i < samples.length - 1; i += 1) {
+    const a = samples[i];
+    const b = samples[i + 1];
+    const boundaries: number[] = [];
+    states.forEach((state) => {
+      [state._s, state._e].forEach((boundary) => {
+        if (boundary > a.t && boundary < b.t) boundaries.push(boundary);
+      });
+    });
+    boundaries.sort((x, y) => x - y);
+    let prev = a;
+    [...boundaries, b.t].forEach((boundary) => {
+      const end =
+        boundary === b.t
+          ? b
+          : {
+              t: boundary,
+              at: new Date(boundary).toISOString(),
+              value: a.value + (b.value - a.value) * ((boundary - a.t) / (b.t - a.t)),
+            };
+      const state = tvStateAt(states, (prev.t + end.t) / 2);
+      segments.push({ a: prev, b: end, labelId: state?.labelIds?.[0] || null });
+      prev = end;
+    });
+  }
+  return segments;
+}

package/src/timeview/core/time.ts

@@ -0,0 +1,103 @@
+// time.ts — shared time-domain helpers for Timeview visualizers.
+
+import type { TimeDataset, TimeInput, TvScale } from "../types";
+
+export const DAY_MS = 86400000;
+
+function asDate(d: TimeInput): Date {
+  return d instanceof Date ? d : new Date(d);
+}
+
+function startOfDayUTC(d: TimeInput): number {
+  const x = asDate(d);
+  return Date.UTC(x.getUTCFullYear(), x.getUTCMonth(), x.getUTCDate());
+}
+
+export function domainOf(dataset: TimeDataset): [number, number] {
+  const ts: number[] = [];
+  (dataset.events || []).forEach((e) => ts.push(new Date(e.at).getTime()));
+  (dataset.intervals || []).forEach((iv) => {
+    ts.push(new Date(iv.range.start).getTime());
+    ts.push(new Date(iv.range.end).getTime());
+  });
+  (dataset.series?.samples || []).forEach((sample) => {
+    ts.push(new Date(sample.at).getTime());
+  });
+  if (!ts.length) {
+    const now = Date.UTC(2026, 0, 5);
+    return [now, now + 24 * DAY_MS];
+  }
+  const min = Math.min(...ts);
+  const max = Math.max(...ts);
+  const floor = (t: number) => {
+    const d = new Date(t);
+    return Date.UTC(d.getUTCFullYear(), d.getUTCMonth(), d.getUTCDate());
+  };
+  const t0 = floor(min);
+  const t1 = floor(max) + DAY_MS;
+  return [t0, t1];
+}
+
+/** Linear scale: maps a time domain [t0,t1] to pixels [0,width]. */
+export function tvScale(t0: TimeInput, t1: TimeInput, width: number): TvScale {
+  const a = asDate(t0).getTime();
+  const b = asDate(t1).getTime();
+  const span = Math.max(1, b - a);
+  const fn = ((t: TimeInput) => ((asDate(t).getTime() - a) / span) * width) as TvScale;
+  fn.invert = (px: number) => new Date(a + (px / width) * span);
+  fn.domain = [a, b];
+  fn.width = width;
+  return fn;
+}
+
+/** Every day-tick boundary within [t0,t1] (UTC midnights). */
+export function tvDays(t0: TimeInput, t1: TimeInput): Date[] {
+  const out: Date[] = [];
+  let d = startOfDayUTC(t0);
+  const end = asDate(t1).getTime();
+  while (d <= end) {
+    out.push(new Date(d));
+    d += DAY_MS;
+  }
+  return out;
+}
+
+/** Week groupings (Mon-start) covering the domain, for the secondary axis. */
+export function tvWeeks(t0: TimeInput, t1: TimeInput): { start: Date; end: Date }[] {
+  const out: { start: Date; end: Date }[] = [];
+  let d = new Date(startOfDayUTC(t0));
+  const dow = (d.getUTCDay() + 6) % 7; // 0 = Monday
+  d = new Date(d.getTime() - dow * DAY_MS);
+  const end = asDate(t1).getTime();
+  while (d.getTime() <= end) {
+    const ws = new Date(d.getTime());
+    const we = new Date(d.getTime() + 7 * DAY_MS);
+    out.push({ start: ws, end: we });
+    d = we;
+  }
+  return out;
+}
+
+const MON = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+const DOW = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
+
+export const fmt = {
+  day: (d: TimeInput) => asDate(d).getUTCDate(),
+  dow: (d: TimeInput) => DOW[asDate(d).getUTCDay()],
+  mon: (d: TimeInput) => MON[asDate(d).getUTCMonth()],
+  monDay: (d: TimeInput) => `${MON[asDate(d).getUTCMonth()]} ${asDate(d).getUTCDate()}`,
+  full: (d: TimeInput) => `${DOW[asDate(d).getUTCDay()]}, ${MON[asDate(d).getUTCMonth()]} ${asDate(d).getUTCDate()}`,
+  time: (d: TimeInput): string | null => {
+    const x = asDate(d);
+    const h = x.getUTCHours();
+    const m = x.getUTCMinutes();
+    if (h === 0 && m === 0) return null;
+    const ap = h >= 12 ? "PM" : "AM";
+    const hh = ((h + 11) % 12) + 1;
+    return `${hh}:${String(m).padStart(2, "0")} ${ap} UTC`;
+  },
+  span: (a: TimeInput, b: TimeInput) => {
+    const days = Math.max(1, Math.round((startOfDayUTC(b) - startOfDayUTC(a)) / DAY_MS));
+    return days === 1 ? "1 day" : `${days} days`;
+  },
+};

package/src/timeview/dashboard.ts

@@ -0,0 +1,80 @@
+import { EXPORT_PRESETS, type ExportFormat, type ExportPresetId } from "./export";
+import { normalizeTimeviewConfig, type TimeviewConfigV1, type ValidationResult } from "./config";
+
+export interface TimeviewDashboardPanelV1 {
+  id: string;
+  title: string;
+  config: TimeviewConfigV1;
+  format: ExportFormat;
+  preset: ExportPresetId;
+}
+
+export interface TimeviewDashboardV1 {
+  v: 1;
+  title: string;
+  generatedAt: string;
+  panels: TimeviewDashboardPanelV1[];
+}
+
+function isRecord(value: unknown): value is Record<string, unknown> {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+
+function isExportFormat(value: unknown): value is ExportFormat {
+  return value === "html" || value === "png";
+}
+
+function isExportPreset(value: unknown): value is ExportPresetId {
+  return typeof value === "string" && value in EXPORT_PRESETS;
+}
+
+export function normalizeTimeviewDashboard(raw: unknown): ValidationResult<TimeviewDashboardV1> {
+  const errors: string[] = [];
+  if (!isRecord(raw)) return { value: null, errors: ["Dashboard root must be a JSON object."] };
+
+  if (raw.v !== 1) errors.push("Dashboard version must be 1.");
+  if (typeof raw.title !== "string" || !raw.title.trim()) errors.push("Dashboard title must be a non-empty string.");
+  if (typeof raw.generatedAt !== "string" || !raw.generatedAt.trim()) errors.push("Dashboard generatedAt must be a non-empty string.");
+  if (!Array.isArray(raw.panels) || raw.panels.length === 0) errors.push("Dashboard panels must be a non-empty array.");
+
+  const panels: TimeviewDashboardPanelV1[] = [];
+
+  if (Array.isArray(raw.panels)) {
+    raw.panels.forEach((panel, index) => {
+      if (!isRecord(panel)) {
+        errors.push(`panels[${index}] must be a JSON object.`);
+        return;
+      }
+
+      if (typeof panel.id !== "string" || !panel.id.trim()) errors.push(`panels[${index}].id must be a non-empty string.`);
+      if (typeof panel.title !== "string" || !panel.title.trim()) errors.push(`panels[${index}].title must be a non-empty string.`);
+      if (!isExportFormat(panel.format)) errors.push(`panels[${index}].format must be "png" or "html".`);
+      if (!isExportPreset(panel.preset)) errors.push(`panels[${index}].preset must be one of ${Object.keys(EXPORT_PRESETS).join(", ")}.`);
+
+      const config = normalizeTimeviewConfig(panel.config);
+      errors.push(...config.errors.map((error) => `panels[${index}].config: ${error}`));
+
+      if (config.value && typeof panel.id === "string" && typeof panel.title === "string" && isExportFormat(panel.format) && isExportPreset(panel.preset)) {
+        panels.push({
+          id: panel.id,
+          title: panel.title,
+          config: config.value,
+          format: panel.format,
+          preset: panel.preset,
+        });
+      }
+    });
+  }
+
+  if (errors.length) return { value: null, errors };
+
+  return {
+    value: {
+      v: 1,
+      title: raw.title as string,
+      generatedAt: raw.generatedAt as string,
+      panels,
+    },
+    errors: [],
+  };
+}

package/src/timeview/data.ts

@@ -0,0 +1,242 @@
+// data.ts — Timeview datasets, palettes, and scale helper re-exports.
+//
+// A TimeDataset is renderer-agnostic: the same data feeds any visualizer.
+// Ported from the design handoff's `data.jsx` (window globals → ES modules).
+
+import type { TimeDataset } from "./types";
+import { DAY_MS } from "./core/time";
+export { DAY_MS, domainOf, tvScale, tvDays, tvWeeks, fmt } from "./core/time";
+
+// ── Categorical palettes (the label-color tweak picks one) ──────────
+// 8 hues each, ordered. Labels map to a palette slot by index, so the
+// design never bakes one fixture's literal hex into a band.
+export const TV_PALETTES = {
+  Studio: ["#2f6fed", "#d97706", "#0f9f6e", "#c2410c", "#7c3aed", "#0891b2", "#db2777", "#475569"],
+  Muted: ["#5b7aa8", "#b08147", "#5a8f73", "#a96a4f", "#7e6ba8", "#5f8a96", "#a96d86", "#6b7280"],
+  Vivid: ["#3b82f6", "#f59e0b", "#10b981", "#ef4444", "#8b5cf6", "#06b6d4", "#ec4899", "#64748b"],
+  Cool: ["#2563eb", "#0ea5e9", "#0d9488", "#7c3aed", "#4f46e5", "#0891b2", "#6366f1", "#475569"],
+} satisfies Record<string, string[]>;
+
+// ── Fixtures ────────────────────────────────────────────────────────
+// Each fixture is a full TimeDataset (schema timeview.dataset.v1).
+
+const LABELS_DEFAULT = [
+  { id: "focus", name: "Focus" },
+  { id: "travel", name: "Travel" },
+  { id: "qa", name: "QA" },
+  { id: "launch", name: "Launch" },
+];
+
+const FIXTURE_DEFAULT: TimeDataset = {
+  schemaVersion: "timeview.dataset.v1",
+  timezone: "UTC",
+  meta: {
+    title: "Launch preparation timeline",
+    description: "Focus work, travel, QA, and launch windows.",
+  },
+  labels: LABELS_DEFAULT,
+  events: [
+    { id: "kickoff", at: "2026-01-06T09:00:00Z", title: "Kickoff", labelIds: ["focus"] },
+    { id: "design-freeze", at: "2026-01-16T18:00:00Z", title: "Design freeze", labelIds: ["qa"] },
+    { id: "launch", at: "2026-01-27T15:00:00Z", title: "Launch", labelIds: ["launch"] },
+  ],
+  intervals: [
+    { id: "deep-work", range: { start: "2026-01-06T00:00:00Z", end: "2026-01-18T23:59:59Z" }, title: "Deep work", labelIds: ["focus"] },
+    { id: "travel-week", range: { start: "2026-01-12T00:00:00Z", end: "2026-01-15T23:59:59Z" }, title: "Travel", labelIds: ["travel"] },
+    { id: "qa-window", range: { start: "2026-01-16T00:00:00Z", end: "2026-01-24T23:59:59Z" }, title: "QA window", labelIds: ["qa"] },
+    { id: "launch-window", range: { start: "2026-01-24T00:00:00Z", end: "2026-01-29T23:59:59Z" }, title: "Launch window", labelIds: ["launch"] },
+  ],
+};
+
+// Overlap-heavy: many intervals crossing the same days.
+const FIXTURE_OVERLAP: TimeDataset = {
+  schemaVersion: "timeview.dataset.v1",
+  timezone: "UTC",
+  meta: { title: "Overlapping work streams", description: "Several streams running in parallel across the same days." },
+  labels: [
+    { id: "focus", name: "Engineering" },
+    { id: "travel", name: "Design" },
+    { id: "qa", name: "Research" },
+    { id: "launch", name: "Marketing" },
+    { id: "ops", name: "Ops" },
+  ],
+  events: [
+    { id: "e1", at: "2026-01-09T12:00:00Z", title: "Spec sign-off", labelIds: ["focus"] },
+    { id: "e2", at: "2026-01-20T12:00:00Z", title: "Beta cut", labelIds: ["qa"] },
+  ],
+  intervals: [
+    { id: "o1", range: { start: "2026-01-05", end: "2026-01-22" }, title: "Build core", labelIds: ["focus"] },
+    { id: "o2", range: { start: "2026-01-07", end: "2026-01-17" }, title: "Visual design", labelIds: ["travel"] },
+    { id: "o3", range: { start: "2026-01-06", end: "2026-01-14" }, title: "User research", labelIds: ["qa"] },
+    { id: "o4", range: { start: "2026-01-12", end: "2026-01-26" }, title: "Campaign prep", labelIds: ["launch"] },
+    { id: "o5", range: { start: "2026-01-10", end: "2026-01-24" }, title: "Infra hardening", labelIds: ["ops"] },
+    { id: "o6", range: { start: "2026-01-18", end: "2026-01-28" }, title: "Polish & QA", labelIds: ["qa"] },
+  ],
+};
+
+// Dense: long titles, many short intervals, tight packing.
+const FIXTURE_DENSE: TimeDataset = {
+  schemaVersion: "timeview.dataset.v1",
+  timezone: "UTC",
+  meta: { title: "Dense sprint board", description: "Many short tasks with long names competing for space." },
+  labels: [
+    { id: "focus", name: "Engineering" },
+    { id: "travel", name: "Design review" },
+    { id: "qa", name: "Quality assurance" },
+    { id: "launch", name: "Release management" },
+    { id: "ops", name: "Platform operations" },
+    { id: "data", name: "Data & analytics" },
+  ],
+  events: [
+    { id: "d1", at: "2026-01-07", title: "Sprint 1 demo", labelIds: ["focus"] },
+    { id: "d2", at: "2026-01-13", title: "Mid-cycle review", labelIds: ["travel"] },
+    { id: "d3", at: "2026-01-19", title: "Code freeze", labelIds: ["qa"] },
+    { id: "d4", at: "2026-01-26", title: "Go / no-go", labelIds: ["launch"] },
+  ],
+  intervals: [
+    { id: "i1", range: { start: "2026-01-05", end: "2026-01-08" }, title: "Authentication refactor", labelIds: ["focus"] },
+    { id: "i2", range: { start: "2026-01-06", end: "2026-01-09" }, title: "Onboarding redesign exploration", labelIds: ["travel"] },
+    { id: "i3", range: { start: "2026-01-08", end: "2026-01-11" }, title: "Accessibility audit pass", labelIds: ["qa"] },
+    { id: "i4", range: { start: "2026-01-09", end: "2026-01-13" }, title: "Billing migration", labelIds: ["focus"] },
+    { id: "i5", range: { start: "2026-01-10", end: "2026-01-12" }, title: "Marketing site copy", labelIds: ["launch"] },
+    { id: "i6", range: { start: "2026-01-11", end: "2026-01-16" }, title: "Search infrastructure", labelIds: ["ops"] },
+    { id: "i7", range: { start: "2026-01-12", end: "2026-01-15" }, title: "Event tracking instrumentation", labelIds: ["data"] },
+    { id: "i8", range: { start: "2026-01-14", end: "2026-01-18" }, title: "Component library polish", labelIds: ["travel"] },
+    { id: "i9", range: { start: "2026-01-15", end: "2026-01-20" }, title: "Load & performance testing", labelIds: ["qa"] },
+    { id: "i10", range: { start: "2026-01-17", end: "2026-01-22" }, title: "Feature flag rollout", labelIds: ["focus"] },
+    { id: "i11", range: { start: "2026-01-19", end: "2026-01-23" }, title: "Localization sweep", labelIds: ["ops"] },
+    { id: "i12", range: { start: "2026-01-21", end: "2026-01-27" }, title: "Release candidate hardening", labelIds: ["launch"] },
+    { id: "i13", range: { start: "2026-01-22", end: "2026-01-25" }, title: "Analytics dashboards", labelIds: ["data"] },
+    { id: "i14", range: { start: "2026-01-24", end: "2026-01-29" }, title: "Launch comms", labelIds: ["launch"] },
+  ],
+};
+
+const FIXTURE_STACKED: TimeDataset = {
+  schemaVersion: "timeview.dataset.v1",
+  timezone: "UTC",
+  meta: { title: "Team coverage & assignments", description: "Overlapping assignments stacking within each team." },
+  labels: [
+    { id: "focus", name: "Platform" },
+    { id: "travel", name: "Mobile" },
+    { id: "qa", name: "Support" },
+    { id: "launch", name: "Growth" },
+  ],
+  events: [
+    { id: "s-e1", at: "2026-01-14T12:00:00Z", title: "Coverage checkpoint", labelIds: ["focus"] },
+    { id: "s-e2", at: "2026-01-22T12:00:00Z", title: "Campaign live", labelIds: ["launch"] },
+  ],
+  intervals: [
+    { id: "s1", range: { start: "2026-01-05T00:00:00Z", end: "2026-01-16T23:59:59Z" }, title: "Data migration", labelIds: ["focus"] },
+    { id: "s2", range: { start: "2026-01-10T00:00:00Z", end: "2026-01-20T23:59:59Z" }, title: "On-call rotation", labelIds: ["focus"] },
+    { id: "s3", range: { start: "2026-01-06T00:00:00Z", end: "2026-01-12T23:59:59Z" }, title: "iOS release", labelIds: ["travel"] },
+    { id: "s4", range: { start: "2026-01-13T00:00:00Z", end: "2026-01-19T23:59:59Z" }, title: "Android release", labelIds: ["travel"] },
+    { id: "s5", range: { start: "2026-01-08T00:00:00Z", end: "2026-01-18T23:59:59Z" }, title: "Tier 1 desk", labelIds: ["qa"] },
+    { id: "s6", range: { start: "2026-01-11T00:00:00Z", end: "2026-01-15T23:59:59Z" }, title: "Tier 2 desk", labelIds: ["qa"] },
+    { id: "s7", range: { start: "2026-01-12T00:00:00Z", end: "2026-01-14T23:59:59Z" }, title: "Escalations", labelIds: ["qa"] },
+    { id: "s8", range: { start: "2026-01-16T00:00:00Z", end: "2026-01-24T23:59:59Z" }, title: "Launch campaign", labelIds: ["launch"] },
+  ],
+};
+
+const FIXTURE_EMPTY: TimeDataset = {
+  schemaVersion: "timeview.dataset.v1",
+  timezone: "UTC",
+  meta: { title: "Launch preparation timeline", description: "No events or intervals fall in this window yet." },
+  labels: LABELS_DEFAULT,
+  events: [],
+  intervals: [],
+};
+
+const METRIC_LABELS = [
+  { id: "diet", name: "Diet" },
+  { id: "maintenance", name: "Maintenance" },
+  { id: "off", name: "Off plan" },
+];
+
+function seeded(seed: number) {
+  let value = seed;
+  return () => {
+    value = (value * 1664525 + 1013904223) % 4294967296;
+    return value / 4294967296;
+  };
+}
+
+function metricSamples(stepDays: number, noise: number, start = "2025-06-10", end = "2026-06-09") {
+  const random = seeded(stepDays * 1009 + Math.round(noise * 100));
+  const out: { at: string; value: number }[] = [];
+  const startMs = Date.parse(start + "T08:00:00Z");
+  const endMs = Date.parse(end + "T08:00:00Z");
+  const totalDays = Math.max(1, Math.round((endMs - startMs) / DAY_MS));
+
+  for (let t = startMs; t <= endMs; t += stepDays * DAY_MS) {
+    const day = Math.round((t - startMs) / DAY_MS);
+    let base = 204 - day * 0.055;
+    if (day > 95) base += (day - 95) * 0.032;
+    if (day > 164) base -= (day - 164) * 0.07;
+    if (day > 270) base += (day - 270) * 0.018;
+    const seasonal = Math.sin((day / totalDays) * Math.PI * 4) * 0.9;
+    const jitter = (random() - 0.5) * noise;
+    out.push({ at: new Date(t).toISOString(), value: Math.round((base + seasonal + jitter) * 10) / 10 });
+  }
+  return out;
+}
+
+const METRIC_INTERVALS = [
+  { id: "phase-1", range: { start: "2025-06-10T00:00:00Z", end: "2025-09-12T23:59:59Z" }, title: "Diet", labelIds: ["diet"] },
+  { id: "phase-2", range: { start: "2025-09-13T00:00:00Z", end: "2025-11-24T23:59:59Z" }, title: "Off plan", labelIds: ["off"] },
+  { id: "phase-3", range: { start: "2025-11-25T00:00:00Z", end: "2026-03-15T23:59:59Z" }, title: "Diet", labelIds: ["diet"] },
+  { id: "phase-4", range: { start: "2026-03-16T00:00:00Z", end: "2026-06-09T23:59:59Z" }, title: "Maintenance", labelIds: ["maintenance"] },
+];
+
+const FIXTURE_METRIC: TimeDataset = {
+  schemaVersion: "timeview.dataset.v1",
+  timezone: "UTC",
+  meta: { title: "Weight trend & diet phases", description: "Body weight logs with diet, maintenance, and off-plan periods." },
+  labels: METRIC_LABELS,
+  events: [
+    { id: "m-goal-start", at: "2025-06-10T08:00:00Z", title: "Cut started", labelIds: ["diet"] },
+    { id: "m-off-plan", at: "2025-09-13T08:00:00Z", title: "Travel break", labelIds: ["off"] },
+    { id: "m-maintenance", at: "2026-03-16T08:00:00Z", title: "Maintenance", labelIds: ["maintenance"] },
+  ],
+  intervals: METRIC_INTERVALS,
+  series: {
+    id: "weight",
+    name: "Weight",
+    unit: "lb",
+    target: { value: 185, label: "goal" },
+    samples: metricSamples(2, 1.8),
+  },
+};
+
+const FIXTURE_METRIC_DENSE: TimeDataset = {
+  ...FIXTURE_METRIC,
+  meta: { title: "Daily weight trend", description: "Dense daily logs across the full history." },
+  series: { ...FIXTURE_METRIC.series!, samples: metricSamples(1, 1.5) },
+};
+
+const FIXTURE_METRIC_SPARSE: TimeDataset = {
+  ...FIXTURE_METRIC,
+  meta: { title: "Weekly weight check-ins", description: "Sparse weekly logs where value labels are useful." },
+  series: { ...FIXTURE_METRIC.series!, samples: metricSamples(7, 1.1, "2026-01-06", "2026-06-09") },
+};
+
+const FIXTURE_METRIC_EMPTY: TimeDataset = {
+  ...FIXTURE_METRIC,
+  meta: { title: "Weight trend & diet phases", description: "No measurements have been logged yet." },
+  events: [],
+  intervals: [],
+  series: { ...FIXTURE_METRIC.series!, samples: [] },
+};
+
+export const TV_DATA = {
+  default: FIXTURE_DEFAULT,
+  overlap: FIXTURE_OVERLAP,
+  dense: FIXTURE_DENSE,
+  stacked: FIXTURE_STACKED,
+  empty: FIXTURE_EMPTY,
+  metric: FIXTURE_METRIC,
+  metricDense: FIXTURE_METRIC_DENSE,
+  metricSparse: FIXTURE_METRIC_SPARSE,
+  metricEmpty: FIXTURE_METRIC_EMPTY,
+} satisfies Record<string, TimeDataset>;
+
+export type FixtureKey = keyof typeof TV_DATA;