1Sponsor

Log

Scrolling log viewer with severity levels and filtering

Terminal

Installation

pnpm dlx shadcn@latest add https://termcn.dev/r/log.json

Usage

import { Log } from "@/components/ui/log";
<Log
  entries={[
    { level: "info", message: "Server started on port 3000" },
    { level: "warn", message: "Deprecated API call detected" },
    { level: "error", message: "Failed to connect to database" },
  ]}
  height={10}
  showTimestamp
  follow
/>

API Reference

Log

PropTypeDefault
entriesLogEntry[]required
heightnumber10
showTimestampbooleantrue
filterstringundefined
followbooleanfalse

LogEntry

PropTypeDefault
level"debug" | "info" | "warn" | "error"required
messagestringrequired
timestampDateundefined