Log Stream

Timestamped log lines tagged by level in info, warn, error, and ok colors.

12:04:01OKServer ready on port 3000
12:04:03INFOCompiled /dashboard in 240ms
12:04:06WARNSlow query took 412ms
12:04:09ERRFailed to reach cache

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use
import { Terminal7 } from "@/components/beste/piece/terminal7";

<Terminal7
  logs={[
    {
      "time": "12:04:01",
      "level": "ok",
      "message": "Server ready on port 3000"
    },
    {
      "time": "12:04:03",
      "level": "info",
      "message": "Compiled /dashboard in 240ms"
    },
    {
      "time": "12:04:06",
      "level": "warn",
      "message": "Slow query took 412ms"
    },
    {
      "time": "12:04:09",
      "level": "error",
      "message": "Failed to reach cache"
    }
  ]}
/>

More Terminal pieces

View all Terminal
$npx beste-ui@latest init

Terminal Prompt

terminal1

Dark shell line with an emerald prompt, command text, and a blinking block cursor.

renders the label
fires onClick
respects disabled state
2 passed1 failed1.24s

Test Summary

terminal12

Test run output with pass and fail markers and a totals bar.

components/Button.tsx
function Button({ label }) {
return <button>{label}</button>;
return <button className="btn">{label}</button>;
}

Diff Block

terminal9

Unified diff with added and removed lines tinted green and red.

deploy
$beste deploy --prod
Building application…Uploading assets…Deployed in 4.2s

Output Window

terminal3

Window-chrome shell showing a command and its output ending in a success line.

Installing packagesctrl-c to cancel

Loading Line

terminal10

Single indeterminate line with a spinner and a cancel hint.

➜beste-uigit:(main)✗

Git Prompt

terminal8

Shell prompt with a git branch segment and a clean or dirty status marker.