62:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/1bpgyrs5qflhu.js","/_next/static/immutable/chunks/0-6vu2ul1h6ld.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 63:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/1bpgyrs5qflhu.js","/_next/static/immutable/chunks/0-6vu2ul1h6ld.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 64:Tee0,import { toMs, type TimeInput, type TimelineEvent } from "./types"; export type SortOrder = "desc" | "asc"; /** A copy sorted by time (newest first by default); ties keep their input order. */ export function sortEvents(events: readonly E[], order: SortOrder = "desc"): E[] { const k = order === "desc" ? -1 : 1; return events .map((e, i) => ({ e, i, t: toMs(e.at) })) .sort((a, b) => (a.t - b.t) * k || a.i - b.i) .map((x) => x.e); } const keyFormatters = new Map(); /** * The calendar day of `t` as `YYYY-MM-DD`, in `timeZone` (default: the runtime's). Pass a * `timeZone` when rendering on the server, so the server and the browser agree. */ export function dayKey(t: TimeInput, timeZone?: string): string { const id = timeZone ?? ""; let fmt = keyFormatters.get(id); if (!fmt) { fmt = new Intl.DateTimeFormat("en-CA", { timeZone, year: "numeric", month: "2-digit", day: "2-digit" }); keyFormatters.set(id, fmt); } const parts = fmt.formatToParts(toMs(t)); const get = (type: string) => parts.find((p) => p.type === type)?.value ?? ""; return `${get("year")}-${get("month")}-${get("day")}`; } /** Whole calendar days from day key `a` to `b` (DST-proof: counted on UTC midnights). */ export function daysBetweenKeys(a: string, b: string): number { return Math.round((Date.parse(`${b}T00:00:00Z`) - Date.parse(`${a}T00:00:00Z`)) / 86_400_000); } export type DayLabelOptions = { /** Reference time for "Today" / "Yesterday". Pass a fixed one for deterministic demos. */ now: TimeInput; locale?: string; timeZone?: string; }; const cap = (s: string, locale?: string) => s.charAt(0).toLocaleUpperCase(locale) + s.slice(1); /** * A day header: "Today", "Yesterday", the weekday within the last week ("Monday"), else a * short date ("Mon, 12 Oct"), with the year when it isn't the current one. Localised by Intl. */ export function dayLabel(key: string, { now, locale, timeZone }: DayLabelOptions): string { const today = dayKey(now, timeZone); const diff = daysBetweenKeys(key, today); // Noon UTC of the key, formatted in UTC, is the key's own calendar day in every zone. const date = Date.parse(`${key}T12:00:00Z`); if (diff === 0 || diff === 1 || diff === -1) { return cap(new Intl.RelativeTimeFormat(locale, { numeric: "auto" }).format(-diff, "day"), locale); } if (diff > 1 && diff < 7) return new Intl.DateTimeFormat(locale, { weekday: "long", timeZone: "UTC" }).format(date); const sameYear = key.slice(0, 4) === today.slice(0, 4); return new Intl.DateTimeFormat(locale, { weekday: "short", day: "numeric", month: "short", year: sameYear ? undefined : "numeric", timeZone: "UTC", }).format(date); } export type DayGroup = { /** `YYYY-MM-DD`. Key the sticky header by it. */ key: string; label: string; events: E[]; }; /** * Events grouped by calendar day, with localised headers, newest day first by default; events * inside a day follow the same order. Pure: call it in render or a `useMemo`. * * groupByDay(transactions, { now: FIXTURE_NOW, timeZone: "Europe/London" }) * // [{ key: "2026-10-18", label: "Today", events: [...] }, { key: "2026-10-17", label: "Yesterday", ... }] */ export function groupByDay(events: readonly E[], { order = "desc", ...label }: DayLabelOptions & { order?: SortOrder }): DayGroup[] { const groups: DayGroup[] = []; const byKey = new Map>(); for (const e of sortEvents(events, order)) { const key = dayKey(e.at, label.timeZone); let g = byKey.get(key); if (!g) { g = { key, label: dayLabel(key, label), events: [] }; byKey.set(key, g); groups.push(g); } g.events.push(e); } return groups; } 65:T869,import { toMs, type TimeInput } from "./types"; export type Span = { id: string; at: TimeInput; end?: TimeInput }; /** * Packs overlapping spans into the fewest lanes (greedy, earliest start first), so a lease, * matter or trace timeline stacks only what actually overlaps. Points (no `end`) take `minMs`. * * const { laneOf, count } = packLanes(leases); // laneOf.get("l-3") → 1 */ export function packLanes(spans: readonly Span[], { gapMs = 0, minMs = 0 }: { gapMs?: number; minMs?: number } = {}) { const items = spans .map((s, i) => { const start = toMs(s.at); return { id: s.id, i, start, end: Math.max(start + minMs, s.end === undefined ? start : toMs(s.end)) }; }) .sort((a, b) => a.start - b.start || a.i - b.i); const laneEnds: number[] = []; const laneOf = new Map(); for (const it of items) { let lane = laneEnds.findIndex((end) => end + gapMs <= it.start); if (lane === -1) lane = laneEnds.push(0) - 1; laneEnds[lane] = it.end; laneOf.set(it.id, lane); } return { laneOf, count: laneEnds.length }; } const MIN = 60_000; const HOUR = 60 * MIN; const DAY = 24 * HOUR; const STEPS = [MIN, 5 * MIN, 15 * MIN, 30 * MIN, HOUR, 3 * HOUR, 6 * HOUR, 12 * HOUR, DAY, 2 * DAY, 7 * DAY, 14 * DAY, 30 * DAY, 91 * DAY, 365 * DAY]; /** * A linear time axis for lane timelines: `x(t)` in px, the today line's x, and evenly stepped * ticks (1 min … 1 year) with at most one per `minGap` px. Ticks under a day are on whole * minutes/hours of UTC; day and longer ticks are on UTC midnights (format them with your zone). */ export function timeAxis(start: TimeInput, end: TimeInput, width: number, { minGap = 72, now }: { minGap?: number; now?: TimeInput } = {}) { const s = toMs(start); const e = Math.max(s + 1, toMs(end)); const k = width / (e - s); const x = (t: TimeInput) => (toMs(t) - s) * k; const step = STEPS.find((st) => st * k >= minGap) ?? STEPS[STEPS.length - 1]; const ticks: number[] = []; for (let t = Math.ceil(s / step) * step; t <= e; t += step) ticks.push(t); return { x, ticks, step, nowX: now === undefined ? undefined : x(now) }; } 66:T161f,"use client"; import { useCallback, useEffect, useMemo, useRef, useState } from "react"; import { duration, ease, reducedFade, stagger as staggers } from "../../lib/motion"; import { sortEvents, type SortOrder } from "./group"; import type { TimelineEvent } from "./types"; export type LiveTimelineOptions = { /** Newest first (feeds, logs) or oldest first (a matter's history). Default `desc`. */ order?: SortOrder; /** Keep at most this many events, dropping the oldest. */ max?: number; /** Seconds between rows of one appended batch. Default `stagger.item` (35ms); the batch total is capped at 0.4s (rule 83). */ stagger?: number; /** Stagger the initial events in once on mount too. Default false (they are simply there). */ animateInitial?: boolean; }; export type LiveTimeline = { /** Sorted events, ready to render (or to `groupByDay`). */ events: E[]; /** Adds one or more events; each enters with its slot in the batch's stagger. Existing ids are replaced in place, without re-entering. */ append(events: E | readonly E[]): void; /** Patches one event by id (a pending payment settling); it doesn't re-enter. */ update(id: string, patch: Partial): void; remove(id: string): void; /** Replaces everything without entrances (a filter change, a reload). */ reset(events: readonly E[]): void; /** The entrance delay (s) for an id that is entering now, or null if it should just be there. */ entering(id: string): number | null; }; /** Max total stagger for a batch, seconds (rule 83). */ const STAGGER_CAP = 0.4; /** * A live event list: append, update and remove by id, kept sorted, with an entrance stagger * only for rows that arrived after mount (each enters once; a re-render never replays it). * Rows animate with `enterMotion(timeline.entering(id), reduced)`. * * const feed = useLiveTimeline(fixtures.events, { max: 50 }); * useEffect(() => socket.on("event", feed.append), [feed.append]); */ export function useLiveTimeline(initial: readonly E[], { order = "desc", max, stagger = staggers.item, animateInitial = false }: LiveTimelineOptions = {}): LiveTimeline { const [state, setState] = useState(() => { const sorted = sortEvents(initial, order); return { list: trim(sorted, max, order), entering: animateInitial ? delays(sorted.map((e) => e.id), stagger) : new Map() }; }); const clearTimer = useRef(0); const scheduleClear = useCallback(() => { clearTimeout(clearTimer.current); // After the longest entrance has run, forget it: a row moved to another day group re-mounts and must not replay. clearTimer.current = window.setTimeout(() => setState((s) => ({ ...s, entering: new Map() })), (STAGGER_CAP + duration.slow) * 1000 + 100); }, []); useEffect(() => { if (animateInitial) scheduleClear(); return () => clearTimeout(clearTimer.current); }, [animateInitial, scheduleClear]); const append = useCallback( (input: E | readonly E[]) => { const batch = (Array.isArray(input) ? input : [input]) as E[]; if (!batch.length) return; setState(({ list, entering }) => { const byId = new Map(batch.map((e) => [e.id, e])); const known = new Set(list.map((e) => e.id)); const fresh = batch.filter((e) => !known.has(e.id)); // Newest first in a desc feed, so the top row lands first. const arrival = sortEvents(fresh, order).map((e) => e.id); const replaced = list.map((e) => byId.get(e.id) ?? e); return { list: trim(sortEvents([...replaced, ...fresh], order), max, order), entering: fresh.length ? new Map([...entering, ...delays(arrival, stagger)]) : entering, }; }); scheduleClear(); }, [order, max, stagger, scheduleClear], ); const update = useCallback( (id: string, patch: Partial) => setState((s) => ({ ...s, list: sortEvents(s.list.map((e) => (e.id === id ? { ...e, ...patch } : e)), order) })), [order], ); const remove = useCallback((id: string) => setState((s) => ({ ...s, list: s.list.filter((e) => e.id !== id) })), []); const reset = useCallback((events: readonly E[]) => setState({ list: trim(sortEvents(events, order), max, order), entering: new Map() }), [order, max]); const { list, entering: enteringMap } = state; const entering = useCallback((id: string) => enteringMap.get(id) ?? null, [enteringMap]); return useMemo(() => ({ events: list, append, update, remove, reset, entering }), [list, append, update, remove, reset, entering]); } function delays(ids: string[], step: number) { const each = ids.length > 1 ? Math.min(step, STAGGER_CAP / (ids.length - 1)) : 0; return new Map(ids.map((id, i) => [id, i * each])); } function trim(list: E[], max: number | undefined, order: SortOrder) { if (max === undefined || list.length <= max) return list; return order === "desc" ? list.slice(0, max) : list.slice(list.length - max); } /** * Motion props for a timeline row: rises `--enter-offset` (6px) and fades in after `delay`, or * renders in place when `delay` is null. Reduced motion: opacity only, instant. * * */ export function enterMotion(delay: number | null, reduced = false) { if (delay === null) return { initial: false as const }; if (reduced) return { initial: { opacity: 0 }, animate: { opacity: 1 }, transition: { ...reducedFade, delay } }; return { initial: { opacity: 0, y: 6 }, animate: { opacity: 1, y: 0 }, transition: { duration: duration.slow, ease: ease.enter, delay }, }; } 67:T101a,"use client"; import { useCallback, useSyncExternalStore } from "react"; import { toMs, type TimeInput } from "./types"; export type RelativeOptions = { locale?: string; /** Intl.RelativeTimeFormat style. `short` gives "5 min. ago". Default `long`. */ style?: Intl.RelativeTimeFormatStyle; }; const UNITS: [Intl.RelativeTimeFormatUnit, number, number][] = [ // unit, ms per unit, use it while |diff| < this many ms ["second", 1_000, 45_000], ["minute", 60_000, 45 * 60_000], ["hour", 3_600_000, 22 * 3_600_000], ["day", 86_400_000, 6.5 * 86_400_000], ["week", 7 * 86_400_000, 26 * 86_400_000], ["month", 30.44 * 86_400_000, 320 * 86_400_000], ["year", 365.25 * 86_400_000, Infinity], ]; const rtfCache = new Map(); const rtf = (locale: string | undefined, style: Intl.RelativeTimeFormatStyle) => { const id = `${locale}|${style}`; let f = rtfCache.get(id); if (!f) rtfCache.set(id, (f = new Intl.RelativeTimeFormat(locale, { numeric: "auto", style }))); return f; }; /** * "now", "5 minutes ago", "yesterday", "in 3 days", "last week": the closest unit, rounded, * localised by `Intl.RelativeTimeFormat` with `numeric: "auto"`. Under 45 seconds reads "now". */ export function formatRelative(at: TimeInput, now: TimeInput, { locale, style = "long" }: RelativeOptions = {}): string { const diff = toMs(at) - toMs(now); if (!Number.isFinite(diff)) return ""; const f = rtf(locale, style); if (Math.abs(diff) < 45_000) return f.format(0, "second"); for (const [unit, size, limit] of UNITS) { if (Math.abs(diff) < limit) return f.format(Math.round(diff / size), unit); } return ""; } /** How often a relative label needs re-rendering at this distance: 10s under a minute, 30s under an hour, then 5 min. */ export function relativeRefreshMs(at: TimeInput, now: number): number { const d = Math.abs(toMs(at) - now); return d < 60_000 ? 10_000 : d < 3_600_000 ? 30_000 : 300_000; } type NowStore = { now: number | undefined; listeners: Set<() => void>; timer: number }; const stores = new Map(); const storeFor = (interval: number) => { let s = stores.get(interval); if (!s) stores.set(interval, (s = { now: undefined, listeners: new Set(), timer: 0 })); return s; }; /** * The current time, shared by every caller with the same `intervalMs` (one timer per * interval, not per row) and paused while nobody is subscribed. Undefined on the server and * during hydration, so a relative label never mismatches the server HTML. */ export function useNow(intervalMs = 30_000): number | undefined { const subscribe = useCallback( (onChange: () => void) => { const s = storeFor(intervalMs); s.listeners.add(onChange); if (s.listeners.size === 1) { s.now = Date.now(); s.timer = window.setInterval(() => { s.now = Date.now(); s.listeners.forEach((l) => l()); }, intervalMs); queueMicrotask(onChange); } return () => { s.listeners.delete(onChange); if (s.listeners.size === 0) clearInterval(s.timer); }; }, [intervalMs], ); return useSyncExternalStore( subscribe, () => { const s = storeFor(intervalMs); return (s.now ??= Date.now()); }, () => undefined, ); } /** * A live relative label for `at` that refreshes at the cadence its distance needs. Pass `now` * to pin it (fixtures, screenshots). Undefined until mounted: render the absolute time, or * nothing, in its place. * * const ago = useRelativeTime(event.at); // "3 minutes ago" * {ago ?? time} */ export function useRelativeTime(at: TimeInput, { now: pinned, ...options }: RelativeOptions & { now?: TimeInput } = {}): string | undefined { // Pick the cadence from the event's age at the last known time. const coarse = useNow(300_000); const interval = coarse === undefined ? 300_000 : relativeRefreshMs(at, coarse); const live = useNow(interval); const now = pinned ?? live; return now === undefined ? undefined : formatRelative(at, now, options); } 68:T4b2,import type { StepStatus } from "../thinking-core/types"; /** A time: epoch ms, an ISO string, or a Date. */ export type TimeInput = number | string | Date; /** The colour role of an event; renderers map it to `*-subtle` / `*-text` tokens. */ export type EventTone = "neutral" | "info" | "success" | "warning" | "danger"; /** * One thing that happened: a filing, a payment, a deploy log line, a comment, a page. * Spans (a lease, a hearing, a trace span) set `end` too. */ export type TimelineEvent = { /** Stable id: rows are keyed by it, so live appends never re-mount older rows. */ id: string; at: TimeInput; /** Spans only. */ end?: TimeInput; title: string; detail?: string; /** A free-form category the block filters on: "filing", "deploy", "refund". */ kind?: string; tone?: EventTone; /** For runs and deploys: thinking-core's frozen status. */ status?: StepStatus; /** Who did it. */ actor?: { name: string; avatarUrl?: string }; data?: D; }; /** Epoch ms from any `TimeInput`. Invalid input reads as NaN. */ export function toMs(t: TimeInput): number { return typeof t === "number" ? t : t instanceof Date ? t.getTime() : Date.parse(t); } 61:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","motion",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/motion","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"motion"}]]}]}]]}],["$","$L62",null,{"namespace":"@registrydirectory","registryDependencies":["https://eased.dev/r/eased-tokens.json","https://eased.dev/r/eased-motion.json","https://eased.dev/r/eased-thinking-core.json"]}]]}],null]}],["$","$L63",null,{"files":[{"path":"src/registry/eased/_primitives/timeline-core/group.ts","content":"$64","type":"registry:lib","target":"@components/eased/_primitives/timeline-core/group.ts"},{"path":"src/registry/eased/_primitives/timeline-core/lanes.ts","content":"$65","type":"registry:lib","target":"@components/eased/_primitives/timeline-core/lanes.ts"},{"path":"src/registry/eased/_primitives/timeline-core/live.ts","content":"$66","type":"registry:lib","target":"@components/eased/_primitives/timeline-core/live.ts"},{"path":"src/registry/eased/_primitives/timeline-core/relative.ts","content":"$67","type":"registry:lib","target":"@components/eased/_primitives/timeline-core/relative.ts"},{"path":"src/registry/eased/_primitives/timeline-core/timeline-core.ts","content":"/**\n * timeline-core: events and timelines for matter histories, transaction ledgers, deploy logs\n * and activity feeds. A typed event model, Intl day grouping, relative time on a shared\n * clock, live append with a once-only entrance stagger, and lane packing for span timelines.\n * Import from here; the files behind it may move.\n */\nexport { toMs, type EventTone, type TimeInput, type TimelineEvent } from \"./types\";\nexport { dayKey, dayLabel, daysBetweenKeys, groupByDay, sortEvents, type DayGroup, type DayLabelOptions, type SortOrder } from \"./group\";\nexport { formatRelative, relativeRefreshMs, useNow, useRelativeTime, type RelativeOptions } from \"./relative\";\nexport { enterMotion, useLiveTimeline, type LiveTimeline, type LiveTimelineOptions } from \"./live\";\nexport { packLanes, timeAxis, type Span } from \"./lanes\";\n","type":"registry:lib","target":"@components/eased/_primitives/timeline-core/timeline-core.ts"},{"path":"src/registry/eased/_primitives/timeline-core/types.ts","content":"$68","type":"registry:lib","target":"@components/eased/_primitives/timeline-core/types.ts"}],"className":"h-[70svh] min-h-80"}]]}]