@elabs-ai/components-editor
Token-themed Monaco editor: CodeEditor, DiffEditor, CodeWorkspace (file tabs).
pnpm add @elabs-ai/components-editorHighlights
A few of the 22 pages here. Open a family below, or in the navigation, to see all of it.
A markdown editing workspace: the editor with its outline, preview and toolbar arranged as one document surface.
The Monaco side-by-side diff surface — the only diff in the library that can be typed into.
An agent's decision presented as a card in the document — the option taken, the alternatives and the rationale — for the reader to accept or revise.
Mermaid source beside its rendered diagram, with the preview updating as the source changes.
A live calculation block inside markdown: inputs, a formula and its result, recomputed as the inputs change.
Browse by family
CodeEditor · CodeWorkspace · DiffEditor
Academic · DocumentOutline · Iteration · MarkdownEditor · MarkdownPreview · MarkdownToolbar · MarkdownWorkspace · Prose · SlashMenu
AI Content Access · BuilderDialog · CalcBlock · CalcEditor · CalcInline · DecisionCard · MetricBlock · TemplateDialog
MermaidDiagram · MermaidWorkspace