docs/components/display/TerminalOutput

TerminalOutput

ANSI-aware terminal text display.

import { TerminalOutput } from '@ybouhjira/hyperkit';

#Playground

Edit the code — the preview recompiles and re-renders as you type.

Live playground
Loading preview…

#Props

PropTypeDefaultDescription
lines *TerminalLine[]Array of lines to display.
maxLinesnumber500Maximum number of lines to keep.
showTimestampsbooleanfalseShow timestamps for each line.
classstringAdditional CSS classes.

* required prop.

#Design Tokens

This component reads the following CSS custom properties. Override them globally or per-instance to restyle it — see the CSS Variables guide.

  • --sk-font-mono
  • --sk-radius-md
  • --sk-terminal-accent
  • --sk-terminal-bg
  • --sk-terminal-error
  • --sk-terminal-fg
  • --sk-terminal-success
  • --sk-terminal-system