feat: add TerminalBreadcrumb component

[clawgreen]

What does this PR do?

Adds a new TerminalBreadcrumb component for displaying file paths and navigation breadcrumbs in terminal style.

Features

• Auto-parse paths: ~/projects/app/src → clickable breadcrumbs
• Manual items: Full control with item arrays
• Navigation callbacks: Click to navigate segments
• Custom separators: /, >, or custom elements
• Variants: Multiple color options (green, blue, yellow, red, purple, cyan)
• Path normalization: Handles both Unix (/) and Windows (\) paths

Example Usage

// Auto-parse from string
<TerminalBreadcrumb path="~/projects/terminal-ui/components" />

// With navigation
<TerminalBreadcrumb
  items={[
    { label: "~", path: "/home" },
    { label: "projects", path: "/home/projects" },
    { label: "app", path: "/home/projects/app" },
  ]}
  onNavigate={(path) => console.log(path)}
/>

// Custom separator
<TerminalBreadcrumb path="~/src" separator=" > " variant="purple" />

Type of Change

• 📦 New component
• ✨ Enhancement (playground example)

Checklist

• Component created in components/terminal-breadcrumb.tsx
• TypeScript interfaces with JSDoc
• Exported from components/terminal.tsx
• Playground examples added
• Build passes (pnpm run build)
• Follows project patterns
• Zero new dependencies

Screenshots

See playground at /playground for live examples.

---

Part of NEW_COMPONENTS_PLAN.md (Phase 1)

[vercel]

@clawgreen is attempting to deploy a commit to the 0xBuns Team on Vercel.

A member of the Team first needs to authorize it.

[BunsDev]

Closing as a duplicate of #52. Both PRs add a breadcrumb component touching the same surface area, and #52 is the better fit to carry forward for now because it keeps the API smaller and easier to maintain. If we want path parsing or callback-driven navigation later, that can be layered onto the surviving component in a follow-up.