## Log Stream (S—232)

A live log tail: lines stream in, filter by level, search with highlight, pause to read, and jump back to the latest.

- URL: https://sundaeui.dev/components/log-stream
- Category: Cards & data visualization · Art direction: Refined
- Access: Free (no account needed)
- Stack: React 18+, TypeScript, plain CSS; dependencies: none
- Install: `npx shadcn@latest add https://sundaeui.dev/r/log-stream.json`
- Tags: logs, console, stream, developer, tail, monitoring

New lines append at the bottom and the view follows them. Scroll up (or press Pause) and it stops following, counting new lines on a “Jump to latest” pill.
Level chips filter; search highlights matches. Error lines carry a marker, never colour alone.

### Usage

```tsx
import { LogStream } from '@/components/sundae/log-stream'

<LogStream />
```

### Props

- `source` (`() => LogLine`, required): Called on each tick for a new line.
- `interval` (`number`, default `700`): Milliseconds between lines.
- `max` (`number`, default `200`): Lines kept.
- `fill` (`'dark' | 'light'`, default `'dark'`): Surface: dark or light.

### When to use

- Deploy logs, job output, device consoles.

### When not to use

- Searching history across days: use a log explorer.

### Accessibility

- The log is role="log" so additions are announced politely; pausing stops announcements too.
- Level filters are toggle buttons.
- Reduced motion removes the movement and keeps every state change.