Theme Switcher

Theme
About this piece

Theme Switcher

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

Usage

The import and the props worth knowing about, in one place.

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

<Editor35
  active="system"
/>

More Editor pieces

View all Editor
Zen Modemanifesto.md
Exit+K+Z

Zen Mode

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

format
  • Format DocumentEditor
  • Format SelectionEditor
  • Reveal in File ExplorerFile

Command Palette

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

greet.ts
export function greet(name: string) {
return `Hello, ${name}!`;
}
 
// Ship it

Code Window

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

Switch branch…
  • feat/onboarding
  • main
  • feat/ai-suggest3
  • chore/cleanup

Branch Switcher

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

hero181

Portrait Hero

Tall photograph beside a heading, a short paragraph and a checked benefit list.

Section Picker Card

One card from a block picker. Its preview loads behind a sweeping skeleton while the section id, title and description sit ready underneath, the way a picker fills a grid.

Launch Checklist

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

  • Verify preview URL
  • Run smoke suite
  • Tag the release
pnpm release

Markdown Preview

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