reopt design
DocsExploreTemplatesCanvasToolsPricing
Login
opt-uiopt-chartsopt-datagridopt-editoropt-calendaropt-filemanageropt-chatopt-shellbrandapp-ui
opt-editor6
Static Renderer
reopt designreopt design

A design system for the AI era

  • Docs
  • Pricing
  • Releases
  • About
  • Contact
  • Terms of Service
  • Privacy Policy

reopt Inc.Business registration no. 217-88-02453contact@reopt.ai

© 2026 reopt Inc. All rights reserved.

Renderopt-editor example

Static Renderer

Render persisted content without mounting the editing engine.

renderread-onlypublish
bun add @reopt-ai/opt-editor

APIs used

StaticRendererEditorSpec

Live preview

Change the width and theme, then interact with the components.

1024px
Render Output

Published operating note

StaticRenderer is useful when the editing engine is no longer needed and you only want deterministic output from a stored EditorSpec.

This output can render in server components, docs, previews, and publish surfaces.
  • No editing state to hydrate
  • Ideal for canonical previews
  • Same spec format as the live editor

Install and import

Related docsOpen playground

Install

bun add @reopt-ai/opt-editor

Import

import { StaticRenderer, type EditorSpec } from "@reopt-ai/opt-editor";

Related Examples

opt-editor

Basic Editor

Examples

Edit headings, paragraphs, and a callout with Editor, defaultCatalog, and an in-memory document store.

opt-editor

Diff Review

Examples

Review changes with keyboard-accessible decisions: accept updates the document, reject keeps the original, and reset starts over.

opt-editor

Headless Composition

Examples

Compose a custom authoring surface with BlockTree, BlockToolbar, document versions, and working undo/redo controls.

PreviousDiff ReviewNextVersion History