RichText
The block note editor from Attio — a contentEditable rich-text editor.
Attio's Notes editor: a large 32/36 title, a 14/20 prose body (headings, lists, quote, code, marks, links), and a floating toolbar that appears over a text selection. Built on contentEditable so it's dependency-free — no ProseMirror/Slate. Uncontrolled: seed with defaultTitle/defaultHtml and read changes via onChange.
Select some text in the preview to reveal the formatting toolbar.
Preview
Usage
import { RichTextEditor } from "crisp";
<RichTextEditor
defaultTitle="Kickoff notes"
defaultHtml="<p>Start writing…</p>"
onChange={({ title, html }) => save({ title, html })}
/>;API
| Prop | Type | Default | Description |
|---|---|---|---|
defaultTitle | string | "" | Initial title text. |
defaultHtml | string | "" | Initial body HTML. |
titlePlaceholder | string | "Untitled" | Placeholder for the empty title. |
placeholder | string | — | Placeholder for the empty body. |
onChange | (v: { title, html }) => void | — | Fired on every edit. |
The selection toolbar covers bold, italic, underline, strikethrough, link, H1, H2, bullet list, numbered list, and quote.