• Getting Started
    • Installation
    • Quick Start
    • Guides and Concepts
    • Migrating from RA-UI
    • MCP Server
    • Changelog
  • App Config
  • Page Components
  • Viewing
  • Editing
  • Widgets
  • Map (Leaflet)
  • CSV Import
  • MDX Editor
  • Rich Text Input
  • Block Editor
  • Realtime
  • UI & Layout
  • Supabase
  1. Docs
  2. Block Editor

Block Editor

Notion-style block editing for structured content.

BlockEditorInput

Use <BlockEditorInput> to edit structured content in a block editor (TipTap) and store it as TipTap JSON. The value is a plain JavaScript object (JSONContent) — not HTML or Markdown.

BlockDocField

Use <BlockDocField> to render a stored block document in read-only mode in a Show view. It reads TipTap JSON from the record at source and renders it using the same block renderers as the editor, but without any editing chrome.

Custom Blocks

The block editor is open by design. Use defineBlock to author new block types and pass them to <BlockEditorInput> and <BlockDocField> via the blocks prop. There is no global registry — blocks are always explicit.