Theme Switcher

Settings card with a segmented light / dark / system toggle and icon plus label per option.

Theme

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

Import & use

import { Editor35 } from "@/components/beste/piece/editor35";

<Editor35
  active="system"
/>

More Editor pieces

greet.ts

1export function greet(name: string) {
2  return `Hello, ${name}!`;
3}
4 
5// Ship it

editor1

Theme-adaptive editor window with traffic-light header, filename, and a tokenized code body.

Zen Modemanifesto.md

Exit⌘+K+Z

editor32

Minimal focus card with a focus icon, current filename, and an exit-shortcut reminder.

format

editor9

Command palette card with a search bar, ranked results, hint captions, and kbd shortcut pills.

Switch branch…

editor24

Branch picker popover with search, a list of branches, ahead counts, and an emerald check on the current one.

Ship with confidence by running through the five-point review.

pnpm release

editor10

Rendered markdown mini card with a heading, lede paragraph, bullet list, and inline code chip.

Ship production-ready components in a weekend.

27 chars·3 words

editor19

Text with a primary-tinted highlight and a floating dark pill showing character and word counts.