tuil
ReferenceComponentsLogs, JSON, and diffs

LogViewer

LogViewer component API, behavior, and executable example.

View rawEdit

Loading executable example…

API and events

Inspect streaming logs, expandable structured values, and line-oriented changes in terminal-bounded viewports.

export function LogViewer(props: LogViewerProps): ReactNode;

Props, functions, and events

MemberTypeRequiredDescriptionRelated types
linesreadonly (string | LogEntry)[]YesThe lines member uses the readonly (string | LogEntry)[] contract.
heightnumber | undefinedNoThe height member uses the number | undefined contract.
widthnumber | undefinedNoThe width member uses the number | undefined contract.
maxLinesnumber | undefinedNoThe maxLines member uses the number | undefined contract.
filterstring | undefinedNoThe filter member uses the string | undefined contract.
followboolean | undefinedNoThe follow member uses the boolean | undefined contract.
defaultFollowboolean | undefinedNoThe defaultFollow member uses the boolean | undefined contract.
onFollowChange((follow: boolean) => void | Promise<void>) | undefinedNoThe onFollowChange member uses the ((follow: boolean) => void | Promise<void>) | undefined contract.
showTimestampboolean | undefinedNoThe showTimestamp member uses the boolean | undefined contract.
staticLimitnumber | undefinedNoThe staticLimit member uses the number | undefined contract.
autoFocusboolean | undefinedNoThe autoFocus member uses the boolean | undefined contract.
variantstring | undefinedNoThe variant member uses the string | undefined contract.
size"sm" | "md" | "lg" | undefinedNoThe size member uses the "sm" | "md" | "lg" | undefined contract.
unstyledboolean | undefinedNoThe unstyled member uses the boolean | undefined contract.
classNamestring | undefinedNoThe className member uses the string | undefined contract.
layoutPartial<Omit<LayoutNodeInput, "children" | "id" | "semantics">> | undefinedNoThe layout member uses the Partial<Omit<LayoutNodeInput, "children" | "id" | "semantics">> | undefined contract.
idstring | undefinedNoThe id member uses the string | undefined contract.
testIdstring | undefinedNoThe testId member uses the string | undefined contract.
roleSemanticRole | undefinedNoThe role member uses the SemanticRole | undefined contract.SemanticRole
labelstring | undefinedNoThe label member uses the string | undefined contract.
descriptionstring | undefinedNoThe description member uses the string | undefined contract.
disabledboolean | undefinedNoThe disabled member uses the boolean | undefined contract.
readOnlyboolean | undefinedNoThe readOnly member uses the boolean | undefined contract.
selectedboolean | undefinedNoThe selected member uses the boolean | undefined contract.
checkedboolean | undefinedNoThe checked member uses the boolean | undefined contract.
expandedboolean | undefinedNoThe expanded member uses the boolean | undefined contract.
valueTextstring | undefinedNoThe valueText member uses the string | undefined contract.

LogViewer reports follow state; JSON expansion can be controlled; pure transformation helpers emit nothing.

Callback props run after the documented input is accepted. Callbacks are not cancellable unless their return type or description states otherwise.

Interaction and capabilities

Viewers scroll and filter; JSON nodes expand or collapse; diff output remains deterministic in static mode.

The published manifest records keyboard, focus, pointer, theme, terminal, semantic, event, and dependency requirements.

Complete import

import { LogViewer } from "@/components/tuil/data-display/log-viewer";

On this page