docs/components/data/LogViewer

LogViewer

Structured log stream viewer.

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

#Playground

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

Live playground
Loading preview…

#Props

PropTypeDefaultDescription
entries *() => ReadonlyArray<LogEntry>
classstring
styleJSX.CSSProperties
onClear() => void
maxHeightstring

* 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-accent
  • --sk-accent-muted
  • --sk-bg-elevated
  • --sk-bg-primary
  • --sk-bg-secondary
  • --sk-bg-tertiary
  • --sk-border-subtle
  • --sk-duration-fast
  • --sk-ease-default
  • --sk-error
  • --sk-font-mono
  • --sk-font-size-sm
  • --sk-font-size-xs
  • --sk-info
  • --sk-radius-sm
  • --sk-space-2xs
  • --sk-space-sm
  • --sk-space-xs
  • --sk-text-muted
  • --sk-text-primary
  • --sk-text-secondary
  • --sk-warning