Compositions

Code block

Keyboard-accessible code examples with real clipboard feedback.

Pass the exact code and an optional language. Copy uses the shared async-action and PendingButton behavior and provides a manual-copy fallback on failure.

src/components/docs/code-block.tsx

bun run check
bun run build:cloudflare

Live components · Changes stay in this preview

Built from the app library

The preview imports your production components. Open Code for the complete working example, including its imports.

Try every state

Use Tab to inspect keyboard focus, switch themes, and try the controls. Reset restores the example’s initial state.

Code blockCode block

Built from the app library

Try every state

Code blockCode block

Built from the app library

Try every state

Code block

Code block