@tangle-network/ui 11.51.4 → 11.51.6

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @tangle-network/ui
 
+## 11.51.6
+
+- Expose the existing run-clock and status modules directly so minimal graph/server consumers do not load unrelated optional session stores.
+
+## 11.51.5
+
+- Render user-message times explicitly in UTC so server and browser hydration agree across timezones. Share one clock across run duration, stream age and graph readers; keep replay timestamps fixed and export the canonical open-state predicate.
+
 ## 11.51.4
 
 - Normalize retained record lifecycle aliases through the shared status vocabulary; stopped and absent terminal states remain distinct from success.

package/README.md

@@ -1,5 +1,7 @@
 # @tangle-network/ui
 
+Minimal graph and server hosts can import the existing clock from `@tangle-network/ui/hooks/use-live-time` and status metadata/glyphs from `@tangle-network/ui/run/status-meta`. These module entries share the root bindings without loading optional session stores.
+
 Generic React UI components for Tangle products. Imports tokens from `@tangle-network/brand` (peer dep). Tailwind v4-native.
 
 Component visual precedent is governed by the repo-level [design bible](../../docs/design-bible.md) and [component audit](../../docs/component-audit.md). Storybook examples are test surfaces; they are not automatically approved brand patterns.

package/dist/chat/user-message.js

@@ -5,10 +5,7 @@ import { memo, useLayoutEffect, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 // src/chat/user-message.tsx
 function formatTime(date) {
-	return date.toLocaleTimeString(void 0, {
-		hour: "numeric",
-		minute: "2-digit"
-	});
+	return Number.isFinite(date.valueOf()) ? date.toISOString().slice(11, 16) + " UTC" : "Invalid Date";
 }
 function MessageActions({ children, align = "end" }) {
 	return /* @__PURE__ */ jsx("div", {

package/dist/hooks/use-live-time.d.ts

@@ -1,5 +1,4 @@
-/**
- * Returns `Date.now()` and re-renders every `intervalMs` so derived
- * values like "uptime" tick forward without polling upstream data.
- */
+/** One run clock; retained playback observes only its supplied timestamp. */
+export declare const useRunNow: (fixed?: number) => number;
+/** Existing cadence API shares the same clock and scheduler, including its 100ms floor. */
 export declare function useLiveTime(intervalMs?: number): number;

package/dist/hooks/use-live-time.js

@@ -1,21 +1,44 @@
 "use client";
-import * as React from "react";
+import { useCallback, useRef, useSyncExternalStore } from "react";
 // src/hooks/use-live-time.ts
-/**
-* Returns `Date.now()` and re-renders every `intervalMs` so derived
-* values like "uptime" tick forward without polling upstream data.
-*/
-function useLiveTime(intervalMs = 1e3) {
-	const [now, setNow] = React.useState(() => Date.now());
-	React.useEffect(() => {
-		const delay = Math.max(Number.isFinite(intervalMs) && intervalMs > 0 ? intervalMs : 1e3, 100);
-		const id = window.setInterval(() => {
-			setNow(Date.now());
-		}, delay);
+const subscribers = /* @__PURE__ */ new Set();
+let now = Date.now();
+let timer;
+function schedule() {
+	clearTimeout(timer);
+	if (!subscribers.size) return;
+	timer = setTimeout(() => {
+		now = Date.now();
+		for (const subscriber of subscribers) if (now >= subscriber.next) {
+			subscriber.next = now + subscriber.period;
+			subscriber.notify();
+		}
+		schedule();
+	}, Math.max(0, Math.min(...[...subscribers].map((subscriber) => subscriber.next)) - Date.now()));
+}
+function useClock(period, fixed, initial) {
+	const subscribe = useCallback((notify) => {
+		if (fixed !== void 0) return () => {};
+		if (!subscribers.size) now = Date.now();
+		const subscriber = {
+			period,
+			next: Math.floor(now / period + 1) * period,
+			notify
+		};
+		subscribers.add(subscriber);
+		schedule();
 		return () => {
-			window.clearInterval(id);
+			subscribers.delete(subscriber);
+			schedule();
 		};
-	}, [intervalMs]);
-	return now;
+	}, [period, fixed]);
+	return useSyncExternalStore(subscribe, () => fixed ?? Math.max(now, initial), () => fixed ?? initial);
+}
+/** One run clock; retained playback observes only its supplied timestamp. */
+const useRunNow = (fixed) => useClock(1e3, fixed, 0);
+/** Existing cadence API shares the same clock and scheduler, including its 100ms floor. */
+function useLiveTime(intervalMs = 1e3) {
+	const initial = useRef(Date.now()).current;
+	return useClock(Number.isFinite(intervalMs) && intervalMs > 0 ? Math.max(intervalMs, 100) : 1e3, void 0, initial);
 }
-export { useLiveTime };
+export { useLiveTime, useRunNow };

package/dist/hooks/use-sse-stream.js

@@ -1,4 +1,5 @@
 "use client";
+import { useRunNow } from "./use-live-time.js";
 import { openNativeStream } from "./use-event-stream.js";
 import * as React from "react";
 // src/hooks/use-sse-stream.ts
@@ -31,18 +32,12 @@ function useSSEStream(options) {
 	const [lastEvent, setLastEvent] = React.useState(null);
 	const [error, setError] = React.useState(null);
 	const [lastEventTime, setLastEventTime] = React.useState(Date.now());
-	const [timeSinceLastEvent, setTimeSinceLastEvent] = React.useState(0);
+	const timeSinceLastEvent = Math.max(0, useRunNow() - lastEventTime);
 	const retryCountRef = React.useRef(0);
 	const eventSourceRef = React.useRef(null);
 	const abortControllerRef = React.useRef(null);
 	const reconnectTimeoutRef = React.useRef(null);
 	const lastEventIdRef = React.useRef(void 0);
-	React.useEffect(() => {
-		const interval = setInterval(() => {
-			setTimeSinceLastEvent(Date.now() - lastEventTime);
-		}, 1e3);
-		return () => clearInterval(interval);
-	}, [lastEventTime]);
 	React.useEffect(() => {
 		onStateChange?.(state);
 	}, [state, onStateChange]);
@@ -54,7 +49,7 @@ function useSSEStream(options) {
 			timestamp: Date.now()
 		};
 		if (id) lastEventIdRef.current = id;
-		setLastEventTime(Date.now());
+		setLastEventTime(event.timestamp);
 		setLastEvent(event);
 		setEvents((prev) => {
 			const next = [...prev, event];

package/dist/hooks.d.ts

@@ -1,6 +1,6 @@
 import { useAutoScroll } from "./hooks/use-auto-scroll.js";
 import { useDropdownMenu } from "./hooks/use-dropdown-menu.js";
-import { useLiveTime } from "./hooks/use-live-time.js";
+import { useLiveTime, useRunNow } from "./hooks/use-live-time.js";
 import { useRunCollapseState } from "./hooks/use-run-collapse-state.js";
 import { UseRunGroupsOptions, useRunGroups } from "./hooks/use-run-groups.js";
 import { UseToolCallStreamReturn, useToolCallStream } from "./hooks/use-tool-call-stream.js";
@@ -10,4 +10,4 @@ import { RealtimeSessionOptions, RealtimeSessionRegistry, RealtimeSessionRegistr
 import { AgentStreamEvent, AutomationStreamEvent, BotStreamEvent, ConnectionState, SSEEvent, TaskStreamEvent, TerminalStreamEvent, UseSSEStreamOptions, UseSSEStreamResult, useSSEStream } from "./hooks/use-sse-stream.js";
 import { EventStreamHandlers, EventStreamOpener, EventStreamSource, useEventStream } from "./hooks/use-event-stream.js";
 import { useFollowTail } from "./hooks/use-follow-tail.js";
-export { AgentStreamEvent, AppendUserMessageOptions, ApplySdkEventOptions, AuthUser, AutomationStreamEvent, BeginAssistantMessageOptions, BotStreamEvent, CompleteAssistantMessageOptions, ConnectionState, type EventStreamHandlers, type EventStreamOpener, type EventStreamSource, RealtimeSessionOptions, RealtimeSessionRegistry, RealtimeSessionRegistryProps, RealtimeSessionState, RealtimeSessionTarget, SSEEvent, SdkSessionAttachment, SdkSessionEvent, SdkSessionSeed, TaskStreamEvent, TerminalStreamEvent, UseAuthOptions, UseAuthResult, UseRunGroupsOptions, UseSSEStreamOptions, UseSSEStreamResult, UseSdkSessionOptions, UseSdkSessionReturn, UseToolCallStreamReturn, createAuthFetcher, useApiKey, useAuth, useAutoScroll, useDropdownMenu, useEventStream, useFollowTail, useLiveTime, useRealtimeSession, useRunCollapseState, useRunGroups, useSSEStream, useSdkSession, useToolCallStream };
+export { AgentStreamEvent, AppendUserMessageOptions, ApplySdkEventOptions, AuthUser, AutomationStreamEvent, BeginAssistantMessageOptions, BotStreamEvent, CompleteAssistantMessageOptions, ConnectionState, type EventStreamHandlers, type EventStreamOpener, type EventStreamSource, RealtimeSessionOptions, RealtimeSessionRegistry, RealtimeSessionRegistryProps, RealtimeSessionState, RealtimeSessionTarget, SSEEvent, SdkSessionAttachment, SdkSessionEvent, SdkSessionSeed, TaskStreamEvent, TerminalStreamEvent, UseAuthOptions, UseAuthResult, UseRunGroupsOptions, UseSSEStreamOptions, UseSSEStreamResult, UseSdkSessionOptions, UseSdkSessionReturn, UseToolCallStreamReturn, createAuthFetcher, useApiKey, useAuth, useAutoScroll, useDropdownMenu, useEventStream, useFollowTail, useLiveTime, useRealtimeSession, useRunCollapseState, useRunGroups, useRunNow, useSSEStream, useSdkSession, useToolCallStream };

package/dist/hooks.js

@@ -2,12 +2,12 @@ import { useRunGroups } from "./hooks/use-run-groups.js";
 import { useRunCollapseState } from "./hooks/use-run-collapse-state.js";
 import { useFollowTail } from "./hooks/use-follow-tail.js";
 import { useAutoScroll } from "./hooks/use-auto-scroll.js";
+import { useLiveTime, useRunNow } from "./hooks/use-live-time.js";
 import { useDropdownMenu } from "./hooks/use-dropdown-menu.js";
-import { useLiveTime } from "./hooks/use-live-time.js";
 import { useToolCallStream } from "./hooks/use-tool-call-stream.js";
 import { createAuthFetcher, useApiKey, useAuth } from "./hooks/use-auth.js";
 import { RealtimeSessionRegistry, useRealtimeSession } from "./hooks/use-realtime-session.js";
 import { useSdkSession } from "./hooks/use-sdk-session.js";
 import { useEventStream } from "./hooks/use-event-stream.js";
 import { useSSEStream } from "./hooks/use-sse-stream.js";
-export { RealtimeSessionRegistry, createAuthFetcher, useApiKey, useAuth, useAutoScroll, useDropdownMenu, useEventStream, useFollowTail, useLiveTime, useRealtimeSession, useRunCollapseState, useRunGroups, useSSEStream, useSdkSession, useToolCallStream };
+export { RealtimeSessionRegistry, createAuthFetcher, useApiKey, useAuth, useAutoScroll, useDropdownMenu, useEventStream, useFollowTail, useLiveTime, useRealtimeSession, useRunCollapseState, useRunGroups, useRunNow, useSSEStream, useSdkSession, useToolCallStream };

package/dist/index.d.ts

@@ -40,7 +40,7 @@ import { FileFormat, FilePreviewKind, detectFileFormat, fileExtension, getCodeLa
 import "./files.js";
 import { useAutoScroll } from "./hooks/use-auto-scroll.js";
 import { useDropdownMenu } from "./hooks/use-dropdown-menu.js";
-import { useLiveTime } from "./hooks/use-live-time.js";
+import { useLiveTime, useRunNow } from "./hooks/use-live-time.js";
 import { useRunCollapseState } from "./hooks/use-run-collapse-state.js";
 import { UseRunGroupsOptions, useRunGroups } from "./hooks/use-run-groups.js";
 import { UseToolCallStreamReturn, useToolCallStream } from "./hooks/use-tool-call-stream.js";
@@ -120,7 +120,7 @@ import { LiveDuration } from "./run/run-item-primitives.js";
 import { TaskList, TaskListItem, TaskListProps, TaskStatus, showsTaskPriority, taskProgress, taskStatus } from "./run/task-list.js";
 import { ApprovalCard, ApprovalCardProps, ApprovalDiffFile, ApprovalDiffSummary, ApprovalPlanStep } from "./run/approval-card.js";
 import { RunPhase, RunPhaseList } from "./run/run-phase-list.js";
-import { RunStatus, RunStatusIcon, RunStatusIconProps, StatusMeta, runStatus, statusMeta } from "./run/status-meta.js";
+import { RunStatus, RunStatusIcon, RunStatusIconProps, StatusMeta, isOpen, runStatus, statusMeta } from "./run/status-meta.js";
 import "./run.js";
 import { OPENUI_NODE_JSON_SCHEMA, OPENUI_NODE_TYPES } from "./openui/schema-data.js";
 import { OpenUISchemaIssue, OpenUISchemaValidation, findUnsupportedOpenUINode, validateOpenUIJsonArtifact, validateOpenUIJsonNode } from "./openui-schema.js";
@@ -147,4 +147,4 @@ import { QuestionPreview, QuestionPreviewProps } from "./tool-previews/question-
 import { DiffPreview, DiffPreviewProps } from "./tool-previews/diff-preview.js";
 import { RedactedDocSegment, RedactedDocument, RedactedDocumentData, RedactedDocumentProps, RevealResult } from "./redaction/redacted-document.js";
 import "./redaction.js";
-export { ActiveProjectActivity, ActiveSessionActivityOptions, ActiveSessionConnectionOptions, ActiveSessionConnectionState, ActiveSessionReconnectState, ActiveSessionRecord, ActiveSessionStatus, ActiveSessionTransportMode, ActiveSessionsState, AgentBranding, AgentStreamEvent, AgentTimeline, type AgentTimelineArtifactItem, AgentTimelineColumn, type AgentTimelineCustomItem, type AgentTimelineFoldItem, type AgentTimelineItem, type AgentTimelineMessageItem, type AgentTimelineProps, type AgentTimelineStatusItem, AgentTimelineStep, type AgentTimelineStepKind, type AgentTimelineStepProps, type AgentTimelineTone, type AgentTimelineToolGroupItem, type AgentTimelineToolItem, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, type AlertProps, AlertTitle, type AlertTone, ApiSchema, type ApiSchemaProps, AppendUserMessageOptions, ApplySdkEventOptions, ApprovalCard, type ApprovalCardProps, type ApprovalDiffFile, ApprovalDiffSummary, type ApprovalPlanStep, ArtifactPane, type ArtifactPaneProps, AuthHeader, type AuthHeaderProps, AuthUser, AutomationStreamEvent, Avatar, AvatarFallback, AvatarImage, type AvatarProps, Badge, type BadgeProps, BeginAssistantMessageOptions, BotStreamEvent, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, type ButtonProps, CATEGORY_TONES, CSV_PREVIEW_ROW_LIMIT, Calendar, type CalendarDate, type CalendarProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, type CardTitleProps, type CategoryTone, type ChartReferenceLine, ChatAuthor, ChatContainer, type ChatContainerProps, ChatMessage, type ChatMessageProps, Checkbox, Chip, type ChipProps, CodeBlock, type CodeBlockProps, Collapsible, CollapsibleContent, CollapsibleTrigger, CommandPreview, type CommandPreviewProps, CompleteAssistantMessageOptions, ComplianceBadge, type ComplianceBadgeProps, type ComplianceProduct, type ComplianceStatus, ConnectionState, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, CopyButton, type CopyButtonProps, CustomToolRenderer, DatePicker, type DatePickerProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DiffPreview, type DiffPreviewProps, DisplayVariant, DropZone, type DropZoneProps, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, type EmptyStateProps, type EventStreamHandlers, type EventStreamOpener, type EventStreamSource, ExpandedToolDetail, type ExpandedToolDetailProps, type FeedSegment, Field, type FieldProps, FileArtifactPane, type FileArtifactPaneProps, FileCard, type FileCardProps, type FileDetails, type FileFormat, FileList, type FileListItem, type FileListProps, type FileNode, FilePreview, type FilePreviewKind, type FilePreviewProps, type FileTabData, FileTabs, type FileTabsProps, FileTree, type FileTreeProps, type FileTreeVisibilityOptions, type FileUploader, FilterField, type FilterFieldProps, FinalTextPart, GitHubLoginButton, type GitHubLoginButtonProps, GlobResultsPreview, type GlobResultsPreviewProps, GrepResultsPreview, type GrepResultsPreviewProps, GroupedMessage, Heading, type HeadingProps, type HeadingVariant, HelpText, type HelpTextProps, HoverCard, HoverCardContent, HoverCardDescription, HoverCardHeader, HoverCardTitle, HoverCardTrigger, IconTile, type IconTileProps, InlineCode, type InlineCodeProps, InlineThinkingItem, type InlineThinkingItemProps, InlineToolItem, type InlineToolItemProps, Input, type InputProps, Label, LiveDuration, LoginLayout, type LoginLayoutProps, Logo, type LogoProps, Markdown, type MarkdownLinkChip, type MarkdownLinkChipResolver, type MarkdownProps, MessageAuthor, type MessageAuthorProps, MessageList, type MessageListProps, type MessageRole, MessageRun, MessageUser, Metric, MetricChart, type MetricChartProps, type MetricProps, MetricStrip, type MetricStripProps, OPENUI_NODE_JSON_SCHEMA, OPENUI_NODE_TYPES, type OpenUIAction, type OpenUIActionsNode, OpenUIArtifactRenderer, type OpenUIArtifactRendererProps, type OpenUIBadgeNode, type OpenUICardNode, type OpenUICodeNode, type OpenUIComponentNode, type OpenUIGridNode, type OpenUIHeadingNode, type OpenUIKeyValueNode, type OpenUIMarkdownNode, type OpenUIPrimitive, type OpenUISchemaIssue, type OpenUISchemaValidation, type OpenUISeparatorNode, type OpenUIStackNode, type OpenUIStatNode, type OpenUITableNode, type OpenUITextNode, PageHeader, type PageHeaderProps, PageShell, type PageShellProps, Pagination, type PaginationProps, PdfViewer, type PdfViewerConfig, type PdfViewerProps, type PeriodDelta, Popover, PopoverAnchor, PopoverClose, PopoverContent, PopoverTrigger, Progress, QuestionPreview, type QuestionPreviewProps, RadioGroup, RadioGroupItem, RealtimeSessionOptions, RealtimeSessionRegistry, RealtimeSessionRegistryProps, RealtimeSessionState, RealtimeSessionTarget, ReasoningPart, type RedactedDocSegment, RedactedDocument, type RedactedDocumentData, type RedactedDocumentProps, RegisterActiveSessionOptions, type RevealResult, RichFileTree, type RichFileTreeGitEntry, type RichFileTreeGitStatus, type RichFileTreeProps, type RichFileTreeThemeVars, Run, RunGroup, type RunGroupProps, type RunPhase, RunPhaseList, RunRowShell, type RunRowShellProps, type RunRowStatus, RunRowStatusDot, RunStats, type RunStatus, RunStatusIcon, type RunStatusIconProps, SSEEvent, SdkSessionAttachment, SdkSessionEvent, SdkSessionSeed, SegmentedControl, type SegmentedControlOption, type SegmentedControlProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, type SeriesExtent, type SeriesPoint, type SeriesPointInput, type SeriesScale, SeriesSparkline, type SeriesSparklineProps, SessionMessage, SessionPart, SessionProjectKey, type SessionUser, SettingsList, type SettingsListAction, type SettingsListColumns, SettingsListItem, type SettingsListItemProps, type SettingsListMenuItem, type SettingsListProps, SettingsNote, type SettingsNoteProps, SettingsRow, type SettingsRowLayout, type SettingsRowProps, SettingsSection, type SettingsSectionProps, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SidebarDropZone, type SidebarDropZoneProps, Skeleton, SkeletonCard, SkeletonTable, Slider, type Speaker, SpeakerHeader, type SpeakerHeaderProps, type SpeakerPart, type SpeakerSection, type SpeakerState, StatCard, type StatCardProps, type StatusMeta, StatusPill, type StatusPillProps, type StatusTone, Switch, TONE_CLASSES, TOOL_CATEGORY_ICONS, TRANSCRIPT_TEXT, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, type TableProps, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Tag, type TagProps, TangleKnot, TaskList, type TaskListItem, type TaskListProps, type TaskStatus, TaskStreamEvent, TerminalCursor, TerminalDisplay, TerminalInput, TerminalLine, TerminalStreamEvent, TextPart, TextShimmer, type TextShimmerProps, Textarea, type TextareaProps, ThemeToggle, ThinkingIndicator, type ThinkingIndicatorProps, TimeSelect, type TimeSelectProps, type Toast, ToastContainer, ToastProvider, type Tone, type ToneClasses, type ToolCallData, ToolCallFeed, type ToolCallFeedProps, type ToolCallStatus, type ToolCallType, ToolCategory, ToolDisplayMetadata, ToolPart, ToolState, ToolStatus, ToolTime, Toolbar, type ToolbarProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type UploadFile, UploadProgress, type UploadProgressProps, UseAuthOptions, UseAuthResult, UseRunGroupsOptions, UseSSEStreamOptions, UseSSEStreamResult, UseSdkSessionOptions, UseSdkSessionReturn, UseToolCallStreamReturn, UserMenu, type UserMenuProps, UserMessage, type UserMessageProps, WebSearchPreview, type WebSearchPreviewProps, Wizard, type WizardProps, WizardStep, type WizardStepProps, WriteFilePreview, type WriteFilePreviewProps, activeSessionsAtom, addMessage, addParts, agentTimelineStepKind, badgeVariants, bumpActiveSessionActivity, buttonVariants, clearChat, cn, codeBlockGrammar, configurePdfViewer, copyText, createAuthFetcher, detectFileFormat, fenceInfo, fieldMessageId, fileExtension, filterFileTree, findUnsupportedOpenUINode, focusField, focusFieldInvalid, focusFieldWithin, focusRing, focusRingInset, foldSummary, formatBytes, formatCalendarDate, formatDuration, formatUptime, getActiveSession, getAllActiveSessions, getAllProjectActivity, getCodeLanguage, getFormatLabel, getSanitizedMarkdownHeadingIdFromRawFragment, getSessionsByActivity, getSessionsForNavbar, getSessionsForProject, getSyntaxLanguage, getToolCategory, getToolDisplayMetadata, getToolErrorText, getTotalRunningSessionCount, hasBackgroundRunningSessions, initialsOf, isStreamingAtom, isViewerMessage, ixControl, ixControlAfter, ixControlSoft, ixField, ixRow, ixSelected, ixTabUnderline, localToday, messagesAtom, normalizeSeries, numericColumns, parseCalendarDate, parseCsv, parseToolEvent, partMapAtom, partitionBySpeaker, periodDelta, plainTextFromMarkdown, registerActiveSession, resetActiveSessions, resolveFilePreviewKind, runStatus, seriesAreaPath, seriesExtent, seriesLinePath, seriesMean, seriesScale, setActiveSessionAttention, setActiveSessionConnection, setActiveSessionError, setActiveSessionRunning, setForegroundActiveSession, showsTaskPriority, statusMeta, tableCsv, taskProgress, taskStatus, timeAgo, toneFor, truncateText, unregisterActiveSession, updateActiveSessionMeta, updatePart, useActiveSession, useActiveSessions, useActiveSessionsState, useApiKey, useAuth, useAutoScroll, useDropdownMenu, useEventStream, useFollowTail, useHasBackgroundRunningSessions, useLiveTime, useNavbarSessions, useProjectActivity, useProjectSessions, useRealtimeSession, useRunCollapseState, useRunGroups, useSSEStream, useSdkSession, useSessionsByActivity, useTheme, useToast, useToolCallStream, useTotalRunningSessions, validateOpenUIJsonArtifact, validateOpenUIJsonNode };
+export { ActiveProjectActivity, ActiveSessionActivityOptions, ActiveSessionConnectionOptions, ActiveSessionConnectionState, ActiveSessionReconnectState, ActiveSessionRecord, ActiveSessionStatus, ActiveSessionTransportMode, ActiveSessionsState, AgentBranding, AgentStreamEvent, AgentTimeline, type AgentTimelineArtifactItem, AgentTimelineColumn, type AgentTimelineCustomItem, type AgentTimelineFoldItem, type AgentTimelineItem, type AgentTimelineMessageItem, type AgentTimelineProps, type AgentTimelineStatusItem, AgentTimelineStep, type AgentTimelineStepKind, type AgentTimelineStepProps, type AgentTimelineTone, type AgentTimelineToolGroupItem, type AgentTimelineToolItem, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, type AlertProps, AlertTitle, type AlertTone, ApiSchema, type ApiSchemaProps, AppendUserMessageOptions, ApplySdkEventOptions, ApprovalCard, type ApprovalCardProps, type ApprovalDiffFile, ApprovalDiffSummary, type ApprovalPlanStep, ArtifactPane, type ArtifactPaneProps, AuthHeader, type AuthHeaderProps, AuthUser, AutomationStreamEvent, Avatar, AvatarFallback, AvatarImage, type AvatarProps, Badge, type BadgeProps, BeginAssistantMessageOptions, BotStreamEvent, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, type ButtonProps, CATEGORY_TONES, CSV_PREVIEW_ROW_LIMIT, Calendar, type CalendarDate, type CalendarProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, type CardTitleProps, type CategoryTone, type ChartReferenceLine, ChatAuthor, ChatContainer, type ChatContainerProps, ChatMessage, type ChatMessageProps, Checkbox, Chip, type ChipProps, CodeBlock, type CodeBlockProps, Collapsible, CollapsibleContent, CollapsibleTrigger, CommandPreview, type CommandPreviewProps, CompleteAssistantMessageOptions, ComplianceBadge, type ComplianceBadgeProps, type ComplianceProduct, type ComplianceStatus, ConnectionState, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, CopyButton, type CopyButtonProps, CustomToolRenderer, DatePicker, type DatePickerProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DiffPreview, type DiffPreviewProps, DisplayVariant, DropZone, type DropZoneProps, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, type EmptyStateProps, type EventStreamHandlers, type EventStreamOpener, type EventStreamSource, ExpandedToolDetail, type ExpandedToolDetailProps, type FeedSegment, Field, type FieldProps, FileArtifactPane, type FileArtifactPaneProps, FileCard, type FileCardProps, type FileDetails, type FileFormat, FileList, type FileListItem, type FileListProps, type FileNode, FilePreview, type FilePreviewKind, type FilePreviewProps, type FileTabData, FileTabs, type FileTabsProps, FileTree, type FileTreeProps, type FileTreeVisibilityOptions, type FileUploader, FilterField, type FilterFieldProps, FinalTextPart, GitHubLoginButton, type GitHubLoginButtonProps, GlobResultsPreview, type GlobResultsPreviewProps, GrepResultsPreview, type GrepResultsPreviewProps, GroupedMessage, Heading, type HeadingProps, type HeadingVariant, HelpText, type HelpTextProps, HoverCard, HoverCardContent, HoverCardDescription, HoverCardHeader, HoverCardTitle, HoverCardTrigger, IconTile, type IconTileProps, InlineCode, type InlineCodeProps, InlineThinkingItem, type InlineThinkingItemProps, InlineToolItem, type InlineToolItemProps, Input, type InputProps, Label, LiveDuration, LoginLayout, type LoginLayoutProps, Logo, type LogoProps, Markdown, type MarkdownLinkChip, type MarkdownLinkChipResolver, type MarkdownProps, MessageAuthor, type MessageAuthorProps, MessageList, type MessageListProps, type MessageRole, MessageRun, MessageUser, Metric, MetricChart, type MetricChartProps, type MetricProps, MetricStrip, type MetricStripProps, OPENUI_NODE_JSON_SCHEMA, OPENUI_NODE_TYPES, type OpenUIAction, type OpenUIActionsNode, OpenUIArtifactRenderer, type OpenUIArtifactRendererProps, type OpenUIBadgeNode, type OpenUICardNode, type OpenUICodeNode, type OpenUIComponentNode, type OpenUIGridNode, type OpenUIHeadingNode, type OpenUIKeyValueNode, type OpenUIMarkdownNode, type OpenUIPrimitive, type OpenUISchemaIssue, type OpenUISchemaValidation, type OpenUISeparatorNode, type OpenUIStackNode, type OpenUIStatNode, type OpenUITableNode, type OpenUITextNode, PageHeader, type PageHeaderProps, PageShell, type PageShellProps, Pagination, type PaginationProps, PdfViewer, type PdfViewerConfig, type PdfViewerProps, type PeriodDelta, Popover, PopoverAnchor, PopoverClose, PopoverContent, PopoverTrigger, Progress, QuestionPreview, type QuestionPreviewProps, RadioGroup, RadioGroupItem, RealtimeSessionOptions, RealtimeSessionRegistry, RealtimeSessionRegistryProps, RealtimeSessionState, RealtimeSessionTarget, ReasoningPart, type RedactedDocSegment, RedactedDocument, type RedactedDocumentData, type RedactedDocumentProps, RegisterActiveSessionOptions, type RevealResult, RichFileTree, type RichFileTreeGitEntry, type RichFileTreeGitStatus, type RichFileTreeProps, type RichFileTreeThemeVars, Run, RunGroup, type RunGroupProps, type RunPhase, RunPhaseList, RunRowShell, type RunRowShellProps, type RunRowStatus, RunRowStatusDot, RunStats, type RunStatus, RunStatusIcon, type RunStatusIconProps, SSEEvent, SdkSessionAttachment, SdkSessionEvent, SdkSessionSeed, SegmentedControl, type SegmentedControlOption, type SegmentedControlProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, type SeriesExtent, type SeriesPoint, type SeriesPointInput, type SeriesScale, SeriesSparkline, type SeriesSparklineProps, SessionMessage, SessionPart, SessionProjectKey, type SessionUser, SettingsList, type SettingsListAction, type SettingsListColumns, SettingsListItem, type SettingsListItemProps, type SettingsListMenuItem, type SettingsListProps, SettingsNote, type SettingsNoteProps, SettingsRow, type SettingsRowLayout, type SettingsRowProps, SettingsSection, type SettingsSectionProps, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SidebarDropZone, type SidebarDropZoneProps, Skeleton, SkeletonCard, SkeletonTable, Slider, type Speaker, SpeakerHeader, type SpeakerHeaderProps, type SpeakerPart, type SpeakerSection, type SpeakerState, StatCard, type StatCardProps, type StatusMeta, StatusPill, type StatusPillProps, type StatusTone, Switch, TONE_CLASSES, TOOL_CATEGORY_ICONS, TRANSCRIPT_TEXT, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, type TableProps, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Tag, type TagProps, TangleKnot, TaskList, type TaskListItem, type TaskListProps, type TaskStatus, TaskStreamEvent, TerminalCursor, TerminalDisplay, TerminalInput, TerminalLine, TerminalStreamEvent, TextPart, TextShimmer, type TextShimmerProps, Textarea, type TextareaProps, ThemeToggle, ThinkingIndicator, type ThinkingIndicatorProps, TimeSelect, type TimeSelectProps, type Toast, ToastContainer, ToastProvider, type Tone, type ToneClasses, type ToolCallData, ToolCallFeed, type ToolCallFeedProps, type ToolCallStatus, type ToolCallType, ToolCategory, ToolDisplayMetadata, ToolPart, ToolState, ToolStatus, ToolTime, Toolbar, type ToolbarProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type UploadFile, UploadProgress, type UploadProgressProps, UseAuthOptions, UseAuthResult, UseRunGroupsOptions, UseSSEStreamOptions, UseSSEStreamResult, UseSdkSessionOptions, UseSdkSessionReturn, UseToolCallStreamReturn, UserMenu, type UserMenuProps, UserMessage, type UserMessageProps, WebSearchPreview, type WebSearchPreviewProps, Wizard, type WizardProps, WizardStep, type WizardStepProps, WriteFilePreview, type WriteFilePreviewProps, activeSessionsAtom, addMessage, addParts, agentTimelineStepKind, badgeVariants, bumpActiveSessionActivity, buttonVariants, clearChat, cn, codeBlockGrammar, configurePdfViewer, copyText, createAuthFetcher, detectFileFormat, fenceInfo, fieldMessageId, fileExtension, filterFileTree, findUnsupportedOpenUINode, focusField, focusFieldInvalid, focusFieldWithin, focusRing, focusRingInset, foldSummary, formatBytes, formatCalendarDate, formatDuration, formatUptime, getActiveSession, getAllActiveSessions, getAllProjectActivity, getCodeLanguage, getFormatLabel, getSanitizedMarkdownHeadingIdFromRawFragment, getSessionsByActivity, getSessionsForNavbar, getSessionsForProject, getSyntaxLanguage, getToolCategory, getToolDisplayMetadata, getToolErrorText, getTotalRunningSessionCount, hasBackgroundRunningSessions, initialsOf, isOpen, isStreamingAtom, isViewerMessage, ixControl, ixControlAfter, ixControlSoft, ixField, ixRow, ixSelected, ixTabUnderline, localToday, messagesAtom, normalizeSeries, numericColumns, parseCalendarDate, parseCsv, parseToolEvent, partMapAtom, partitionBySpeaker, periodDelta, plainTextFromMarkdown, registerActiveSession, resetActiveSessions, resolveFilePreviewKind, runStatus, seriesAreaPath, seriesExtent, seriesLinePath, seriesMean, seriesScale, setActiveSessionAttention, setActiveSessionConnection, setActiveSessionError, setActiveSessionRunning, setForegroundActiveSession, showsTaskPriority, statusMeta, tableCsv, taskProgress, taskStatus, timeAgo, toneFor, truncateText, unregisterActiveSession, updateActiveSessionMeta, updatePart, useActiveSession, useActiveSessions, useActiveSessionsState, useApiKey, useAuth, useAutoScroll, useDropdownMenu, useEventStream, useFollowTail, useHasBackgroundRunningSessions, useLiveTime, useNavbarSessions, useProjectActivity, useProjectSessions, useRealtimeSession, useRunCollapseState, useRunGroups, useRunNow, useSSEStream, useSdkSession, useSessionsByActivity, useTheme, useToast, useToolCallStream, useTotalRunningSessions, validateOpenUIJsonArtifact, validateOpenUIJsonNode };

package/dist/index.js

@@ -80,7 +80,7 @@ import { GlobResultsPreview } from "./tool-previews/glob-results-preview.js";
 import { WebSearchPreview } from "./tool-previews/web-search-preview.js";
 import { QuestionPreview } from "./tool-previews/question-preview.js";
 import { DiffPreview } from "./tool-previews/diff-preview.js";
-import { RunStatusIcon, runStatus, statusMeta } from "./run/status-meta.js";
+import { RunStatusIcon, isOpen, runStatus, statusMeta } from "./run/status-meta.js";
 import { ExpandedToolDetail } from "./run/expanded-tool-detail.js";
 import { RunRowShell, RunRowStatusDot } from "./run/run-row-shell.js";
 import { InlineToolItem } from "./run/inline-tool-item.js";
@@ -101,6 +101,7 @@ import { AgentTimeline, AgentTimelineColumn, AgentTimelineStep, agentTimelineSte
 import { ChatContainer } from "./chat/chat-container.js";
 import { ChatMessage } from "./chat/chat-message.js";
 import { SpeakerHeader, partitionBySpeaker } from "./chat/speaker.js";
+import { useLiveTime, useRunNow } from "./hooks/use-live-time.js";
 import { LiveDuration } from "./run/run-item-primitives.js";
 import { ToolCallFeed, parseToolEvent } from "./run/tool-call-feed.js";
 import { TaskList, showsTaskPriority, taskProgress, taskStatus } from "./run/task-list.js";
@@ -119,7 +120,6 @@ import { ApiSchema } from "./markdown/api-schema.js";
 import { AuthHeader, GitHubLoginButton, UserMenu } from "./auth/auth.js";
 import { LoginLayout } from "./auth/login-layout.js";
 import { useDropdownMenu } from "./hooks/use-dropdown-menu.js";
-import { useLiveTime } from "./hooks/use-live-time.js";
 import { useToolCallStream } from "./hooks/use-tool-call-stream.js";
 import { createAuthFetcher, useApiKey, useAuth } from "./hooks/use-auth.js";
 import { activeSessionsAtom, bumpActiveSessionActivity, getActiveSession, getAllActiveSessions, getAllProjectActivity, getSessionsByActivity, getSessionsForNavbar, getSessionsForProject, getTotalRunningSessionCount, hasBackgroundRunningSessions, registerActiveSession, resetActiveSessions, setActiveSessionAttention, setActiveSessionConnection, setActiveSessionError, setActiveSessionRunning, setForegroundActiveSession, unregisterActiveSession, updateActiveSessionMeta, useActiveSession, useActiveSessions, useActiveSessionsState, useHasBackgroundRunningSessions, useNavbarSessions, useProjectActivity, useProjectSessions, useSessionsByActivity, useTotalRunningSessions } from "./stores/active-sessions-store.js";
@@ -131,4 +131,4 @@ import { addMessage, addParts, clearChat, isStreamingAtom, messagesAtom, partMap
 import { copyText } from "./utils/copy-text.js";
 import { timeAgo } from "./utils/time-ago.js";
 import { RedactedDocument } from "./redaction/redacted-document.js";
-export { AgentTimeline, AgentTimelineColumn, AgentTimelineStep, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, ApiSchema, ApprovalCard, ApprovalDiffSummary, ArtifactPane, AuthHeader, Avatar, AvatarFallback, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, CATEGORY_TONES, CSV_PREVIEW_ROW_LIMIT, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ChatContainer, ChatMessage, Checkbox, Chip, CodeBlock, Collapsible, CollapsibleContent, CollapsibleTrigger, CommandPreview, ComplianceBadge, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, CopyButton, DatePicker, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DiffPreview, DropZone, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, ExpandedToolDetail, Field, FileArtifactPane, FileCard, FileList, FilePreview, FileTabs, FileTree, FilterField, GitHubLoginButton, GlobResultsPreview, GrepResultsPreview, Heading, HelpText, HoverCard, HoverCardContent, HoverCardDescription, HoverCardHeader, HoverCardTitle, HoverCardTrigger, IconTile, InlineCode, InlineThinkingItem, InlineToolItem, Input, Label, LiveDuration, LoginLayout, Logo, Markdown, MessageAuthor, MessageList, Metric, MetricChart, MetricStrip, OPENUI_NODE_JSON_SCHEMA, OPENUI_NODE_TYPES, OpenUIArtifactRenderer, PageHeader, PageShell, Pagination, PdfViewer, Popover, PopoverAnchor, PopoverClose, PopoverContent, PopoverTrigger, Progress, QuestionPreview, RadioGroup, RadioGroupItem, RealtimeSessionRegistry, RedactedDocument, RichFileTree, RunGroup, RunPhaseList, RunRowShell, RunRowStatusDot, RunStatusIcon, SegmentedControl, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, SeriesSparkline, SettingsList, SettingsListItem, SettingsNote, SettingsRow, SettingsSection, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SidebarDropZone, Skeleton, SkeletonCard, SkeletonTable, Slider, SpeakerHeader, StatCard, StatusPill, Switch, TONE_CLASSES, TOOL_CATEGORY_ICONS, TRANSCRIPT_TEXT, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Tag, TangleKnot, TaskList, TerminalCursor, TerminalDisplay, TerminalInput, TerminalLine, TextShimmer, Textarea, ThemeToggle, ThinkingIndicator, TimeSelect, ToastContainer, ToastProvider, ToolCallFeed, Toolbar, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, UploadProgress, UserMenu, UserMessage, WebSearchPreview, Wizard, WizardStep, WriteFilePreview, activeSessionsAtom, addMessage, addParts, agentTimelineStepKind, badgeVariants, bumpActiveSessionActivity, buttonVariants, clearChat, cn, codeBlockGrammar, configurePdfViewer, copyText, createAuthFetcher, detectFileFormat, fenceInfo, fieldMessageId, fileExtension, filterFileTree, findUnsupportedOpenUINode, focusField, focusFieldInvalid, focusFieldWithin, focusRing, focusRingInset, foldSummary, formatBytes, formatCalendarDate, formatDuration, formatUptime, getActiveSession, getAllActiveSessions, getAllProjectActivity, getCodeLanguage, getFormatLabel, getSanitizedMarkdownHeadingIdFromRawFragment, getSessionsByActivity, getSessionsForNavbar, getSessionsForProject, getSyntaxLanguage, getToolCategory, getToolDisplayMetadata, getToolErrorText, getTotalRunningSessionCount, hasBackgroundRunningSessions, initialsOf, isStreamingAtom, isViewerMessage, ixControl, ixControlAfter, ixControlSoft, ixField, ixRow, ixSelected, ixTabUnderline, localToday, messagesAtom, normalizeSeries, numericColumns, parseCalendarDate, parseCsv, parseToolEvent, partMapAtom, partitionBySpeaker, periodDelta, plainTextFromMarkdown, registerActiveSession, resetActiveSessions, resolveFilePreviewKind, runStatus, seriesAreaPath, seriesExtent, seriesLinePath, seriesMean, seriesScale, setActiveSessionAttention, setActiveSessionConnection, setActiveSessionError, setActiveSessionRunning, setForegroundActiveSession, showsTaskPriority, statusMeta, tableCsv, taskProgress, taskStatus, timeAgo, toneFor, truncateText, unregisterActiveSession, updateActiveSessionMeta, updatePart, useActiveSession, useActiveSessions, useActiveSessionsState, useApiKey, useAuth, useAutoScroll, useDropdownMenu, useEventStream, useFollowTail, useHasBackgroundRunningSessions, useLiveTime, useNavbarSessions, useProjectActivity, useProjectSessions, useRealtimeSession, useRunCollapseState, useRunGroups, useSSEStream, useSdkSession, useSessionsByActivity, useTheme, useToast, useToolCallStream, useTotalRunningSessions, validateOpenUIJsonArtifact, validateOpenUIJsonNode };
+export { AgentTimeline, AgentTimelineColumn, AgentTimelineStep, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, ApiSchema, ApprovalCard, ApprovalDiffSummary, ArtifactPane, AuthHeader, Avatar, AvatarFallback, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, CATEGORY_TONES, CSV_PREVIEW_ROW_LIMIT, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ChatContainer, ChatMessage, Checkbox, Chip, CodeBlock, Collapsible, CollapsibleContent, CollapsibleTrigger, CommandPreview, ComplianceBadge, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, CopyButton, DatePicker, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DiffPreview, DropZone, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, ExpandedToolDetail, Field, FileArtifactPane, FileCard, FileList, FilePreview, FileTabs, FileTree, FilterField, GitHubLoginButton, GlobResultsPreview, GrepResultsPreview, Heading, HelpText, HoverCard, HoverCardContent, HoverCardDescription, HoverCardHeader, HoverCardTitle, HoverCardTrigger, IconTile, InlineCode, InlineThinkingItem, InlineToolItem, Input, Label, LiveDuration, LoginLayout, Logo, Markdown, MessageAuthor, MessageList, Metric, MetricChart, MetricStrip, OPENUI_NODE_JSON_SCHEMA, OPENUI_NODE_TYPES, OpenUIArtifactRenderer, PageHeader, PageShell, Pagination, PdfViewer, Popover, PopoverAnchor, PopoverClose, PopoverContent, PopoverTrigger, Progress, QuestionPreview, RadioGroup, RadioGroupItem, RealtimeSessionRegistry, RedactedDocument, RichFileTree, RunGroup, RunPhaseList, RunRowShell, RunRowStatusDot, RunStatusIcon, SegmentedControl, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, SeriesSparkline, SettingsList, SettingsListItem, SettingsNote, SettingsRow, SettingsSection, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SidebarDropZone, Skeleton, SkeletonCard, SkeletonTable, Slider, SpeakerHeader, StatCard, StatusPill, Switch, TONE_CLASSES, TOOL_CATEGORY_ICONS, TRANSCRIPT_TEXT, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Tag, TangleKnot, TaskList, TerminalCursor, TerminalDisplay, TerminalInput, TerminalLine, TextShimmer, Textarea, ThemeToggle, ThinkingIndicator, TimeSelect, ToastContainer, ToastProvider, ToolCallFeed, Toolbar, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, UploadProgress, UserMenu, UserMessage, WebSearchPreview, Wizard, WizardStep, WriteFilePreview, activeSessionsAtom, addMessage, addParts, agentTimelineStepKind, badgeVariants, bumpActiveSessionActivity, buttonVariants, clearChat, cn, codeBlockGrammar, configurePdfViewer, copyText, createAuthFetcher, detectFileFormat, fenceInfo, fieldMessageId, fileExtension, filterFileTree, findUnsupportedOpenUINode, focusField, focusFieldInvalid, focusFieldWithin, focusRing, focusRingInset, foldSummary, formatBytes, formatCalendarDate, formatDuration, formatUptime, getActiveSession, getAllActiveSessions, getAllProjectActivity, getCodeLanguage, getFormatLabel, getSanitizedMarkdownHeadingIdFromRawFragment, getSessionsByActivity, getSessionsForNavbar, getSessionsForProject, getSyntaxLanguage, getToolCategory, getToolDisplayMetadata, getToolErrorText, getTotalRunningSessionCount, hasBackgroundRunningSessions, initialsOf, isOpen, isStreamingAtom, isViewerMessage, ixControl, ixControlAfter, ixControlSoft, ixField, ixRow, ixSelected, ixTabUnderline, localToday, messagesAtom, normalizeSeries, numericColumns, parseCalendarDate, parseCsv, parseToolEvent, partMapAtom, partitionBySpeaker, periodDelta, plainTextFromMarkdown, registerActiveSession, resetActiveSessions, resolveFilePreviewKind, runStatus, seriesAreaPath, seriesExtent, seriesLinePath, seriesMean, seriesScale, setActiveSessionAttention, setActiveSessionConnection, setActiveSessionError, setActiveSessionRunning, setForegroundActiveSession, showsTaskPriority, statusMeta, tableCsv, taskProgress, taskStatus, timeAgo, toneFor, truncateText, unregisterActiveSession, updateActiveSessionMeta, updatePart, useActiveSession, useActiveSessions, useActiveSessionsState, useApiKey, useAuth, useAutoScroll, useDropdownMenu, useEventStream, useFollowTail, useHasBackgroundRunningSessions, useLiveTime, useNavbarSessions, useProjectActivity, useProjectSessions, useRealtimeSession, useRunCollapseState, useRunGroups, useRunNow, useSSEStream, useSdkSession, useSessionsByActivity, useTheme, useToast, useToolCallStream, useTotalRunningSessions, validateOpenUIJsonArtifact, validateOpenUIJsonNode };

package/dist/run/run-item-primitives.js

@@ -1,13 +1,9 @@
 import { formatDuration } from "../utils/format.js";
-import { useEffect, useState } from "react";
+import { useLiveTime } from "../hooks/use-live-time.js";
 import { jsx } from "react/jsx-runtime";
 // src/run/run-item-primitives.tsx
 function LiveDuration({ startTime }) {
-	const [elapsed, setElapsed] = useState(Date.now() - startTime);
-	useEffect(() => {
-		const id = setInterval(() => setElapsed(Date.now() - startTime), 100);
-		return () => clearInterval(id);
-	}, [startTime]);
+	const elapsed = useLiveTime(100) - startTime;
 	return /* @__PURE__ */ jsx("span", {
 		className: "text-xs font-mono text-neutral-400 dark:text-neutral-500 tabular-nums",
 		children: formatDuration(elapsed)

package/dist/run/status-meta.d.ts

@@ -11,6 +11,8 @@ export interface StatusMeta {
 }
 /** Any status string as a `RunStatus`; a value nothing names reads as Unknown, never as a guess. */
 export declare function runStatus(status: string): RunStatus;
+/** Whether a canonical run state can still advance. */
+export declare const isOpen: (status: RunStatus | (string & {})) => boolean;
 /** The label, glyph and colour token for a status, in every surface. */
 export declare function statusMeta(status: RunStatus | (string & {})): StatusMeta;
 export interface RunStatusIconProps extends Omit<LucideProps, "ref"> {

package/dist/run/status-meta.js

@@ -78,6 +78,12 @@ function runStatus(status) {
 	if (Object.hasOwn(META, key)) return key;
 	return Object.hasOwn(ALIASES, key) ? ALIASES[key] : "unknown";
 }
+/** Whether a canonical run state can still advance. */
+const isOpen = (status) => [
+	"running",
+	"waiting",
+	"needs-you"
+].includes(runStatus(status));
 /** The label, glyph and colour token for a status, in every surface. */
 function statusMeta(status) {
 	return META[runStatus(status)];
@@ -107,4 +113,4 @@ function RunStatusIcon({ status, className, style, ...props }) {
 		...props
 	});
 }
-export { RunStatusIcon, runStatus, statusMeta };
+export { RunStatusIcon, isOpen, runStatus, statusMeta };

package/dist/run.d.ts

@@ -9,5 +9,5 @@ import { LiveDuration } from "./run/run-item-primitives.js";
 import { TaskList, TaskListItem, TaskListProps, TaskStatus, showsTaskPriority, taskProgress, taskStatus } from "./run/task-list.js";
 import { ApprovalCard, ApprovalCardProps, ApprovalDiffFile, ApprovalDiffSummary, ApprovalPlanStep } from "./run/approval-card.js";
 import { RunPhase, RunPhaseList } from "./run/run-phase-list.js";
-import { RunStatus, RunStatusIcon, RunStatusIconProps, StatusMeta, runStatus, statusMeta } from "./run/status-meta.js";
-export { ApprovalCard, type ApprovalCardProps, type ApprovalDiffFile, ApprovalDiffSummary, type ApprovalPlanStep, ExpandedToolDetail, type ExpandedToolDetailProps, type FeedSegment, InlineThinkingItem, type InlineThinkingItemProps, InlineToolItem, type InlineToolItemProps, LiveDuration, RunGroup, type RunGroupProps, type RunPhase, RunPhaseList, RunRowShell, type RunRowShellProps, type RunRowStatus, RunRowStatusDot, type RunStatus, RunStatusIcon, type RunStatusIconProps, type StatusMeta, TaskList, type TaskListItem, type TaskListProps, type TaskStatus, type ToolCallData, ToolCallFeed, type ToolCallFeedProps, type ToolCallStatus, type ToolCallType, parseToolEvent, runStatus, showsTaskPriority, statusMeta, taskProgress, taskStatus };
+import { RunStatus, RunStatusIcon, RunStatusIconProps, StatusMeta, isOpen, runStatus, statusMeta } from "./run/status-meta.js";
+export { ApprovalCard, type ApprovalCardProps, type ApprovalDiffFile, ApprovalDiffSummary, type ApprovalPlanStep, ExpandedToolDetail, type ExpandedToolDetailProps, type FeedSegment, InlineThinkingItem, type InlineThinkingItemProps, InlineToolItem, type InlineToolItemProps, LiveDuration, RunGroup, type RunGroupProps, type RunPhase, RunPhaseList, RunRowShell, type RunRowShellProps, type RunRowStatus, RunRowStatusDot, type RunStatus, RunStatusIcon, type RunStatusIconProps, type StatusMeta, TaskList, type TaskListItem, type TaskListProps, type TaskStatus, type ToolCallData, ToolCallFeed, type ToolCallFeedProps, type ToolCallStatus, type ToolCallType, isOpen, parseToolEvent, runStatus, showsTaskPriority, statusMeta, taskProgress, taskStatus };

package/dist/run.js

@@ -1,4 +1,4 @@
-import { RunStatusIcon, runStatus, statusMeta } from "./run/status-meta.js";
+import { RunStatusIcon, isOpen, runStatus, statusMeta } from "./run/status-meta.js";
 import { ExpandedToolDetail } from "./run/expanded-tool-detail.js";
 import { RunRowShell, RunRowStatusDot } from "./run/run-row-shell.js";
 import { InlineToolItem } from "./run/inline-tool-item.js";
@@ -9,4 +9,4 @@ import { ToolCallFeed, parseToolEvent } from "./run/tool-call-feed.js";
 import { TaskList, showsTaskPriority, taskProgress, taskStatus } from "./run/task-list.js";
 import { ApprovalCard, ApprovalDiffSummary } from "./run/approval-card.js";
 import { RunPhaseList } from "./run/run-phase-list.js";
-export { ApprovalCard, ApprovalDiffSummary, ExpandedToolDetail, InlineThinkingItem, InlineToolItem, LiveDuration, RunGroup, RunPhaseList, RunRowShell, RunRowStatusDot, RunStatusIcon, TaskList, ToolCallFeed, parseToolEvent, runStatus, showsTaskPriority, statusMeta, taskProgress, taskStatus };
+export { ApprovalCard, ApprovalDiffSummary, ExpandedToolDetail, InlineThinkingItem, InlineToolItem, LiveDuration, RunGroup, RunPhaseList, RunRowShell, RunRowStatusDot, RunStatusIcon, TaskList, ToolCallFeed, isOpen, parseToolEvent, runStatus, showsTaskPriority, statusMeta, taskProgress, taskStatus };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tangle-network/ui",
-  "version": "11.51.4",
+  "version": "11.51.6",
   "description": "Generic React UI components for Tangle products — primitives, chat, run, files, editor, markdown.",
   "type": "module",
   "license": "MIT",
@@ -125,7 +125,17 @@
       "import": "./dist/code-presentation.js",
       "default": "./dist/code-presentation.js"
     },
-    "./styles/compat.css": "./src/styles/compat.css"
+    "./styles/compat.css": "./src/styles/compat.css",
+    "./hooks/use-live-time": {
+      "types": "./dist/hooks/use-live-time.d.ts",
+      "import": "./dist/hooks/use-live-time.js",
+      "default": "./dist/hooks/use-live-time.js"
+    },
+    "./run/status-meta": {
+      "types": "./dist/run/status-meta.d.ts",
+      "import": "./dist/run/status-meta.js",
+      "default": "./dist/run/status-meta.js"
+    }
   },
   "dependencies": {
     "@pierre/theme": "1.1.0",

package/src/chat/user-message.tsx

@@ -31,7 +31,7 @@ export interface UserMessageProps {
 }
 
 function formatTime(date: Date): string {
-  return date.toLocaleTimeString(undefined, { hour: "numeric", minute: "2-digit" });
+  return Number.isFinite(date.valueOf()) ? date.toISOString().slice(11, 16) + " UTC" : "Invalid Date";
 }
 
 function MessageActions({ children, align = "end" }: { children: ReactNode; align?: "start" | "end" }) {

package/src/hooks/use-live-time.ts

@@ -1,27 +1,35 @@
 "use client";
+import { useCallback, useRef, useSyncExternalStore } from "react";
 
-import * as React from "react";
-
-/**
- * Returns `Date.now()` and re-renders every `intervalMs` so derived
- * values like "uptime" tick forward without polling upstream data.
- */
-export function useLiveTime(intervalMs: number = 1000): number {
-  const [now, setNow] = React.useState<number>(() => Date.now());
-
-  React.useEffect(() => {
-    // Guard against NaN/negative: `setInterval(cb, NaN)` coerces to 0
-    // in browsers, which would spin a tight render loop.
-    const requested =
-      Number.isFinite(intervalMs) && intervalMs > 0 ? intervalMs : 1000;
-    const delay = Math.max(requested, 100);
-    const id = window.setInterval(() => {
-      setNow(Date.now());
-    }, delay);
-    return () => {
-      window.clearInterval(id);
-    };
-  }, [intervalMs]);
-
-  return now;
+type Subscriber = { period: number; next: number; notify: () => void };
+const subscribers = new Set<Subscriber>();
+let now = Date.now(), timer: ReturnType<typeof setTimeout> | undefined;
+function schedule() {
+  clearTimeout(timer);
+  if (!subscribers.size) return;
+  timer = setTimeout(() => {
+    now = Date.now();
+    for (const subscriber of subscribers) if (now >= subscriber.next) {
+      subscriber.next = now + subscriber.period;
+      subscriber.notify();
+    }
+    schedule();
+  }, Math.max(0, Math.min(...[...subscribers].map(subscriber => subscriber.next)) - Date.now()));
+}
+function useClock(period: number, fixed: number | undefined, initial: number) {
+  const subscribe = useCallback((notify: () => void) => {
+    if (fixed !== undefined) return () => {};
+    if (!subscribers.size) now = Date.now();
+    const subscriber = { period, next: Math.floor(now / period + 1) * period, notify };
+    subscribers.add(subscriber); schedule();
+    return () => { subscribers.delete(subscriber); schedule(); };
+  }, [period, fixed]);
+  return useSyncExternalStore(subscribe, () => fixed ?? Math.max(now, initial), () => fixed ?? initial);
+}
+/** One run clock; retained playback observes only its supplied timestamp. */
+export const useRunNow = (fixed?: number): number => useClock(1000, fixed, 0);
+/** Existing cadence API shares the same clock and scheduler, including its 100ms floor. */
+export function useLiveTime(intervalMs = 1000): number {
+  const initial = useRef(Date.now()).current;
+  return useClock(Number.isFinite(intervalMs) && intervalMs > 0 ? Math.max(intervalMs, 100) : 1000, undefined, initial);
 }

package/src/hooks/use-sse-stream.ts

@@ -1,4 +1,5 @@
 "use client";
+import { useRunNow } from "./use-live-time";
 
 import * as React from "react";
 import { openNativeStream } from "./use-event-stream";
@@ -119,7 +120,7 @@ export function useSSEStream<T = unknown>(
   const [lastEvent, setLastEvent] = React.useState<SSEEvent<T> | null>(null);
   const [error, setError] = React.useState<Error | null>(null);
   const [lastEventTime, setLastEventTime] = React.useState<number>(Date.now());
-  const [timeSinceLastEvent, setTimeSinceLastEvent] = React.useState(0);
+  const timeSinceLastEvent = Math.max(0, useRunNow() - lastEventTime);
 
   const retryCountRef = React.useRef(0);
   const eventSourceRef = React.useRef<{ close(): void } | null>(null);
@@ -129,14 +130,6 @@ export function useSSEStream<T = unknown>(
   > | null>(null);
   const lastEventIdRef = React.useRef<string | undefined>(undefined);
 
-  // Update time since last event
-  React.useEffect(() => {
-    const interval = setInterval(() => {
-      setTimeSinceLastEvent(Date.now() - lastEventTime);
-    }, 1000);
-    return () => clearInterval(interval);
-  }, [lastEventTime]);
-
   // Notify state changes
   React.useEffect(() => {
     onStateChange?.(state);
@@ -155,7 +148,7 @@ export function useSSEStream<T = unknown>(
         lastEventIdRef.current = id;
       }
 
-      setLastEventTime(Date.now());
+      setLastEventTime(event.timestamp);
       setLastEvent(event);
       setEvents((prev) => {
         const next = [...prev, event];

package/src/run/index.ts

@@ -40,6 +40,7 @@ export { RunPhaseList, type RunPhase } from "./run-phase-list";
 export {
   RunStatusIcon,
   runStatus,
+  isOpen,
   statusMeta,
   type RunStatus,
   type RunStatusIconProps,

package/src/run/run-item-primitives.tsx

@@ -1,13 +1,8 @@
-import { useEffect, useState } from "react";
+import { useLiveTime } from "../hooks/use-live-time";
 import { formatDuration } from "../utils/format";
 
 export function LiveDuration({ startTime }: { startTime: number }) {
-  const [elapsed, setElapsed] = useState(Date.now() - startTime);
-
-  useEffect(() => {
-    const id = setInterval(() => setElapsed(Date.now() - startTime), 100);
-    return () => clearInterval(id);
-  }, [startTime]);
+  const elapsed = useLiveTime(100) - startTime;
 
   return (
     <span className="text-xs font-mono text-neutral-400 dark:text-neutral-500 tabular-nums">

package/src/run/status-meta.tsx

@@ -57,6 +57,9 @@ export function runStatus(status: string): RunStatus {
   return Object.hasOwn(ALIASES, key) ? ALIASES[key] : "unknown";
 }
 
+/** Whether a canonical run state can still advance. */
+export const isOpen = (status: RunStatus | (string & {})): boolean => ["running", "waiting", "needs-you"].includes(runStatus(status));
+
 /** The label, glyph and colour token for a status, in every surface. */
 export function statusMeta(status: RunStatus | (string & {})): StatusMeta {
   return META[runStatus(status)];

package/src/chat/agent-timeline.test.tsx

@@ -1,342 +0,0 @@
-import { render, screen } from "@testing-library/react"
-import userEvent from "@testing-library/user-event"
-import { describe, expect, it, vi } from "vitest"
-import type { ToolPart } from "../types/parts"
-import { AgentTimeline, type AgentTimelineItem } from "./agent-timeline"
-import { TRANSCRIPT_TEXT } from "./transcript-text"
-
-const editPart: ToolPart = {
-  type: "tool",
-  id: "tool-1",
-  tool: "edit",
-  state: {
-    status: "completed",
-    input: { path: "src/batch-writer.ts" },
-    output: "Applied 1 edit",
-  },
-}
-
-const readPart: ToolPart = {
-  type: "tool",
-  id: "tool-2",
-  tool: "read",
-  state: {
-    status: "completed",
-    input: { path: "src/lib/jitter.ts" },
-    output: "export function jitter() {}",
-  },
-}
-
-function toolItem(part: ToolPart): AgentTimelineItem {
-  return {
-    id: "item-1",
-    kind: "tool",
-    call: {
-      id: part.id,
-      type: "edit",
-      label: "Edit",
-      status: "success",
-      detail: "src/batch-writer.ts",
-      output: "Applied 1 edit",
-    },
-    part,
-  }
-}
-
-describe("AgentTimeline tool actions", () => {
-  it("renders a tool call's verb and its path, once each", () => {
-    render(<AgentTimeline items={[toolItem(editPart)]} />)
-    expect(screen.getByText("Edit")).toBeInTheDocument()
-    expect(screen.getAllByText("src/batch-writer.ts")).toHaveLength(1)
-  })
-
-  it("renders renderToolActions beside the tool item, called with the source part", () => {
-    const renderToolActions = vi.fn((part: ToolPart) => (
-      <button type="button">Open {part.id}</button>
-    ))
-
-    render(
-      <AgentTimeline
-        items={[toolItem(editPart)]}
-        renderToolActions={renderToolActions}
-      />,
-    )
-
-    expect(renderToolActions).toHaveBeenCalledWith(editPart)
-    expect(
-      screen.getByRole("button", { name: /open tool-1/i }),
-    ).toBeInTheDocument()
-  })
-
-  it("renders no action when the item carries no source part", () => {
-    const renderToolActions = vi.fn(() => <button type="button">Open</button>)
-    const item = { ...toolItem(editPart), part: undefined }
-
-    render(
-      <AgentTimeline items={[item]} renderToolActions={renderToolActions} />,
-    )
-
-    expect(renderToolActions).not.toHaveBeenCalled()
-    expect(screen.queryByRole("button", { name: /open/i })).not.toBeInTheDocument()
-  })
-
-  it("renders tool items unchanged when no renderToolActions is provided", () => {
-    render(<AgentTimeline items={[toolItem(editPart)]} />)
-    expect(screen.getByText("Edit")).toBeInTheDocument()
-    expect(screen.queryByRole("button", { name: /open/i })).not.toBeInTheDocument()
-  })
-
-  it("renders renderToolActions for each call in a tool group, with its part", () => {
-    const renderToolActions = vi.fn((part: ToolPart) => (
-      <button type="button">Open {part.id}</button>
-    ))
-    const groupItem: AgentTimelineItem = {
-      id: "group-1",
-      kind: "tool_group",
-      title: "Tool activity",
-      calls: [
-        {
-          id: "tool-1",
-          type: "edit",
-          label: "Edit",
-          status: "success",
-          detail: "src/batch-writer.ts",
-        },
-        {
-          id: "tool-2",
-          type: "read",
-          label: "Read",
-          status: "success",
-          detail: "src/lib/jitter.ts",
-        },
-      ],
-      parts: [editPart, readPart],
-    }
-
-    render(
-      <AgentTimeline items={[groupItem]} renderToolActions={renderToolActions} />,
-    )
-
-    expect(renderToolActions).toHaveBeenCalledWith(editPart)
-    expect(renderToolActions).toHaveBeenCalledWith(readPart)
-    expect(
-      screen.getByRole("button", { name: /open tool-1/i }),
-    ).toBeInTheDocument()
-    expect(
-      screen.getByRole("button", { name: /open tool-2/i }),
-    ).toBeInTheDocument()
-  })
-
-  it("renders every row and no toggle when collapseAfter is unset", () => {
-    const items: AgentTimelineItem[] = Array.from({ length: 5 }, (_, i) => ({
-      id: `s-${i}`,
-      kind: "status",
-      label: `Step ${i}`,
-    }))
-    render(<AgentTimeline items={items} />)
-    expect(screen.getByText("Step 4")).toBeInTheDocument()
-    expect(
-      screen.queryByRole("button", { name: /more step/i }),
-    ).not.toBeInTheDocument()
-  })
-
-  it("collapses to the first N spine rows behind a toggle and reveals the rest", async () => {
-    const user = userEvent.setup()
-    const items: AgentTimelineItem[] = Array.from({ length: 5 }, (_, i) => ({
-      id: `s-${i}`,
-      kind: "status",
-      label: `Step ${i}`,
-    }))
-    render(<AgentTimeline items={items} collapseAfter={2} />)
-
-    // First 2 visible, the other 3 hidden behind the toggle
-    expect(screen.getByText("Step 0")).toBeInTheDocument()
-    expect(screen.getByText("Step 1")).toBeInTheDocument()
-    expect(screen.queryByText("Step 4")).not.toBeInTheDocument()
-
-    const toggle = screen.getByRole("button", { name: /show 3 more steps/i })
-    await user.click(toggle)
-
-    expect(screen.getByText("Step 4")).toBeInTheDocument()
-    expect(screen.getByRole("button", { name: /show less/i })).toBeInTheDocument()
-  })
-
-  it("names a tool group for assistive tech but draws no header above it", () => {
-    const groupItem: AgentTimelineItem = {
-      id: "group-1",
-      kind: "tool_group",
-      title: "Tool activity",
-      calls: [
-        { id: "tool-1", type: "edit", label: "Edit", status: "success", detail: "src/a.ts" },
-        { id: "tool-2", type: "read", label: "Read", status: "success", detail: "src/b.ts" },
-      ],
-      parts: [editPart, readPart],
-    }
-    render(<AgentTimeline items={[groupItem]} />)
-    expect(screen.queryByText("Tool activity")).not.toBeInTheDocument()
-    expect(screen.getByRole("group", { name: "Tool activity" })).toBeInTheDocument()
-  })
-
-  it("renders assistant prose without a timestamp header", () => {
-    const stamp = new Date(2026, 0, 1, 15, 42)
-    render(
-      <AgentTimeline
-        items={[
-          { id: "a-1", kind: "message", role: "assistant", content: "Done.", timestamp: stamp },
-        ]}
-      />,
-    )
-    expect(screen.getByText("Done.")).toBeInTheDocument()
-    expect(
-      screen.queryByText(
-        stamp.toLocaleTimeString(undefined, { hour: "numeric", minute: "2-digit" }),
-      ),
-    ).not.toBeInTheDocument()
-  })
-
-  it("keeps the user bubble's timestamp", () => {
-    const stamp = new Date(2026, 0, 1, 15, 42)
-    render(
-      <AgentTimeline
-        items={[{ id: "u-1", kind: "message", role: "user", content: "Hi", timestamp: stamp }]}
-      />,
-    )
-    expect(
-      screen.getByText(
-        stamp.toLocaleTimeString(undefined, { hour: "numeric", minute: "2-digit" }),
-      ),
-    ).toBeInTheDocument()
-  })
-
-  it("lays rows out in a plain column — no spine gutter, no connector", () => {
-    const { container } = render(
-      <AgentTimeline
-        items={[
-          { id: "a-1", kind: "message", role: "assistant", content: "Reading." },
-          toolItem(editPart),
-          { id: "s-1", kind: "status", label: "Type-checks clean", tone: "success" },
-        ]}
-      />,
-    )
-    expect(container.querySelector('[class*="grid-cols-"]')).toBeNull()
-    expect(container.querySelector(".ring-4")).toBeNull()
-    const steps = container.querySelectorAll("[data-timeline-step]")
-    expect(Array.from(steps).map((el) => el.getAttribute("data-timeline-step"))).toEqual([
-      "prose",
-      "tool",
-      "card",
-    ])
-    // Tool rows bleed past the prose edge so the glyph sits on it.
-    expect(steps[1].className).toContain("-mx-3")
-    expect(steps[0].className).not.toContain("-mx-3")
-  })
-
-  it("spaces rows by their neighbours: turns widest, tool sequences tightest", () => {
-    const tool2 = { ...toolItem(readPart), id: "item-2" }
-    const { container } = render(
-      <AgentTimeline
-        items={[
-          { id: "u-1", kind: "message", role: "user", content: "Go" },
-          toolItem(editPart),
-          tool2,
-          { id: "a-1", kind: "message", role: "assistant", content: "Done." },
-          { id: "u-2", kind: "message", role: "user", content: "Thanks" },
-        ]}
-      />,
-    )
-    const classes = Array.from(container.querySelectorAll("[data-timeline-step]")).map(
-      (el) => el.className,
-    )
-    expect(classes[0]).not.toMatch(/mt-\d/)
-    expect(classes[1]).toContain("mt-4") // user → tool: turn boundary
-    expect(classes[2]).toContain("mt-1") // tool → tool
-    expect(classes[3]).toContain("mt-1") // tool → prose
-    expect(classes[4]).toContain("mt-4") // prose → user
-  })
-
-  it("renders the source part's real input in the expanded detail", async () => {
-    const user = userEvent.setup()
-    const probePart: ToolPart = {
-      type: "tool",
-      id: "tool-3",
-      tool: "custom_probe",
-      state: {
-        status: "completed",
-        input: { marker: "deep-input-value" },
-        output: "done",
-      },
-    }
-    const item: AgentTimelineItem = {
-      id: "item-3",
-      kind: "tool",
-      call: {
-        id: "tool-3",
-        type: "unknown",
-        label: "custom_probe",
-        status: "success",
-        detail: "probe",
-      },
-      part: probePart,
-    }
-
-    render(<AgentTimeline items={[item]} />)
-    await user.click(screen.getByRole("button", { name: /custom_probe/i }))
-
-    // ExpandedToolDetail (fed the real part) renders labelled Input/Output
-    // sections — the synthesized-part path showed only a bare output block.
-    expect(screen.getByText("Input")).toBeInTheDocument()
-    expect(screen.getByText("Output")).toBeInTheDocument()
-  })
-})
-
-describe("transcript type scale", () => {
-  it("sets the person's and the agent's message text in one family, size and leading", () => {
-    render(
-      <AgentTimeline
-        items={[
-          { id: "u", kind: "message", role: "user", content: "Can Luz take the 3 pm massage?" },
-          { id: "a", kind: "message", role: "assistant", content: "Yes, Luz is free at 3 pm." },
-        ]}
-      />,
-    )
-    const user = screen.getByText("Can Luz take the 3 pm massage?")
-    const agent = screen.getByText("Yes, Luz is free at 3 pm.").closest(".tangle-prose")
-    const textClasses = (element: Element | null) =>
-      [...(element?.classList ?? [])].filter((name) => /^(tangle-transcript-text|text-|leading-|font-)/.test(name)).sort()
-    expect(textClasses(user)).toEqual(TRANSCRIPT_TEXT.split(" ").sort())
-    expect(textClasses(agent)).toEqual(textClasses(user))
-  })
-})
-
-describe("AgentTimeline status cards", () => {
-  it("marks a failed card with the failed glyph and keeps the triangle for warnings", () => {
-    const glyph = (tone: "error" | "warning") =>
-      render(<AgentTimeline items={[{ id: tone, kind: "status", label: tone, tone }]} />).container.querySelector("svg")?.getAttribute("class")
-    expect(glyph("error")).toContain("lucide-circle-x")
-    expect(glyph("warning")).toContain("lucide-triangle-alert")
-  })
-})
-
-describe("AgentTimeline folds", () => {
-  const call = (id: string, type: "read" | "bash", detail: string, status: "success" | "error" = "success"): AgentTimelineItem => ({
-    id,
-    kind: "tool",
-    call: { id, type, label: type === "read" ? "Read" : "Shell", status, detail },
-    part: { type: "tool", id, tool: type, state: status === "error" ? { status: "error", input: { path: detail }, error: `File not found: ${detail}` } : { status: "completed", input: { path: detail }, output: "ok" } },
-  })
-
-  it("folds a run of calls into one row that names what they did and opens to the rows", async () => {
-    const user = userEvent.setup()
-    render(<AgentTimeline items={[{ id: "f", kind: "fold", items: [call("a", "read", "inputs/commission.md"), call("b", "read", "inputs/claims.json"), call("c", "bash", "ls repo")] }]} />)
-    const row = screen.getByRole("button", { name: /Read 2 files · Ran 1 command/ })
-    expect(screen.queryByText("Shell")).not.toBeInTheDocument()
-    await user.click(row)
-    expect(screen.getByText("Shell")).toBeInTheDocument()
-    expect(screen.getAllByText("Read")).toHaveLength(2)
-  })
-
-  it("keeps a failure visible under a closed fold", () => {
-    render(<AgentTimeline items={[{ id: "f", kind: "fold", items: [call("a", "read", "a.md"), call("b", "read", "b.md", "error")] }]} />)
-    expect(screen.getByText("1 failed: File not found: b.md")).toBeInTheDocument()
-  })
-})

package/src/chat/user-message.test.tsx

@@ -1,39 +0,0 @@
-import { render, screen } from "@testing-library/react"
-import { describe, expect, it } from "vitest"
-import { UserMessage } from "./user-message"
-
-describe("UserMessage", () => {
-  it("renders inverse text in a bubble that wraps in narrow panes", () => {
-    const { container } = render(<UserMessage content="Run the tests." />)
-    expect(screen.getByText("Run the tests.")).toBeInTheDocument()
-    const bubble = container.querySelector(".rounded-2xl")
-    expect(bubble).not.toBeNull()
-    expect(bubble!.className).toContain("bg-foreground")
-    expect(bubble!.className).toContain("text-background")
-    expect(container.querySelector(".group")?.className).toContain(
-      "min-w-0",
-    )
-    expect(screen.getByText("Run the tests.").className).toContain(
-      "break-words",
-    )
-  })
-
-  it("keeps the timestamp beside the bubble as a hover-revealed label", () => {
-    const stamp = new Date(2026, 0, 1, 15, 42)
-    const { container } = render(
-      <UserMessage content="Run the tests." timestamp={stamp} />,
-    )
-    const label = container.querySelector("[data-user-message-time]")
-    expect(label).not.toBeNull()
-    expect(label!.textContent).toBe(
-      stamp.toLocaleTimeString(undefined, { hour: "numeric", minute: "2-digit" }),
-    )
-    expect(label!.className).toContain("opacity-0")
-    expect(label!.className).toContain("group-hover:opacity-100")
-  })
-
-  it("renders nothing for an empty message", () => {
-    const { container } = render(<UserMessage content="   " />)
-    expect(container).toBeEmptyDOMElement()
-  })
-})

package/src/hooks/use-live-time.test.tsx

@@ -1,40 +0,0 @@
-import { describe, it, expect, vi, afterEach, beforeEach } from "vitest";
-import { renderHook, act } from "@testing-library/react";
-import { useLiveTime } from "./use-live-time";
-
-describe("useLiveTime", () => {
-  beforeEach(() => {
-    vi.useFakeTimers();
-  });
-
-  afterEach(() => {
-    vi.useRealTimers();
-  });
-
-  it("advances Date.now() snapshot on the given cadence", () => {
-    vi.setSystemTime(new Date("2025-01-01T00:00:00Z"));
-    const { result } = renderHook(() => useLiveTime(1000));
-    const initial = result.current;
-
-    act(() => {
-      vi.advanceTimersByTime(1000);
-    });
-    expect(result.current).toBeGreaterThan(initial);
-
-    act(() => {
-      vi.advanceTimersByTime(2000);
-    });
-    expect(result.current).toBeGreaterThanOrEqual(initial + 3000);
-  });
-
-  it("falls back to a safe cadence when intervalMs is NaN", () => {
-    vi.setSystemTime(new Date("2025-01-01T00:00:00Z"));
-    const setIntervalSpy = vi.spyOn(window, "setInterval");
-    renderHook(() => useLiveTime(Number.NaN));
-    // Must not pass NaN (browsers coerce to 0 and spin a render loop)
-    // nor drop below the 100ms floor.
-    const [, delay] = setIntervalSpy.mock.calls[0]!;
-    expect(Number.isFinite(delay)).toBe(true);
-    expect(delay).toBeGreaterThanOrEqual(100);
-  });
-});