Small pieces for a good letter

Your words.
A few useful components.

Give an idea a little emphasis, share a useful link, or invite your readers to take the next step. Every block below works in the website and renders to HTML for email.

5 starter componentsIn the editor: Insert component → customise → insert

Worth keeping

A small idea you want your readers to remember.

Callout

Web & email

Give an idea or announcement a little more room.

By Caveat · MITCreate a publication
Developer example

The editor stores this as structured content. Add it through the picker, or use it with Tiptap’s insertContent command.

{
  "type": "newsletterComponent",
  "attrs": {
    "title": "Worth keeping",
    "body": "A small idea you want your readers to remember.",
    "url": "",
    "label": "",
    "attribution": "",
    "kind": "callout"
  }
}

There is always something worth paying attention to.

From my notebook

Pull quote

Web & email

A memorable line, with space for its author.

By Caveat · MITCreate a publication
Developer example

The editor stores this as structured content. Add it through the picker, or use it with Tiptap’s insertContent command.

{
  "type": "newsletterComponent",
  "attrs": {
    "title": "",
    "body": "There is always something worth paying attention to.",
    "url": "",
    "label": "",
    "attribution": "From my notebook",
    "kind": "quote"
  }
}

Button

Web & email

One clear next step for your readers.

By Caveat · MITCreate a publication
Developer example

The editor stores this as structured content. Add it through the picker, or use it with Tiptap’s insertContent command.

{
  "type": "newsletterComponent",
  "attrs": {
    "title": "",
    "body": "",
    "url": "https://example.com",
    "label": "Read more",
    "attribution": "",
    "kind": "button"
  }
}

Divider

Web & email

A quiet pause between sections of your letter.

By Caveat · MITCreate a publication
Developer example

The editor stores this as structured content. Add it through the picker, or use it with Tiptap’s insertContent command.

{
  "type": "newsletterComponent",
  "attrs": {
    "title": "",
    "body": "",
    "url": "",
    "label": "",
    "attribution": "",
    "kind": "divider"
  }
}

A library we can grow together

Made by Caveat.
Open to the community.

These first five components are included with Caveat. Community submissions are welcome through the project repository; there are no community entries yet.

Suggest a component

What makes a good contribution?

  • A clear purpose, author credit, and a compatible licence.
  • Editable fields and a static HTML version for email.
  • A mobile preview, safe links, and readable fallbacks.
  • Checks for saving, reopening, publishing, and rendering.

Contributions are reviewed and shipped with an application update. The editor does not fetch or execute remote component code.

Read the contribution guide

Email clients render HTML differently. Preview your letter and send yourself a test before sending to readers. Interactive React components belong on your website; email blocks use their static HTML equivalent.