feat(www): add code editor block

[mehdibha]

What

Adds a Code Editor block (code-editor) to the /create preview blocks — an IDE surface recreated from a reference screenshot:

• Editor tab strip with per-tab close buttons (close-on-hover for inactive tabs) and a right-side action cluster: editor menu (split / close others / close all), open-external, expand.
• Sidebar with a SearchField filter and a Tree file explorer for a fictional meridian-ui project. Typing swaps the tree for a quick-open ListBox of matches, with an Empty state for no hits.
• Code pane with file-name + path header (search / copy-path actions), line numbers, and syntax highlighting from hand-tokenized source. Token tones map to semantic tokens (text-fg-accent, text-fg-success, text-fg-info, …) so highlighting re-themes live — no hardcoded colors.
• Status bar: branch, language, line count, Ln/Col, indentation, encoding.
• Closing the active tab activates its left neighbour; closing all shows a "No editor open" Empty state.

Notes for review

• Verified in the browser: tree → tab opening, tab switching/closing, filter quick-open, close-all empty state, and that all six syntax tones resolve to distinct theme colors.
• pnpm check and pnpm typecheck pass; no registry/generated drift (blocks live outside www/src/registry/).

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
dotui	Ready	Preview	Sep 1, 2026 12:58am UTC