@domternal/core

The framework-agnostic editor engine of Domternal, built on ProseMirror. It provides the headless Editor class, the extension system (Extension, Node, Mark), a chainable command API, and the built-in nodes, marks, and behaviors (paragraph, heading, lists, tasks, links, inline formatting, history, keymaps) bundled as StarterKit. Use it directly with vanilla JS/TS, or as the runtime under the Angular, React, Vue, and Vanilla wrappers. Every export is tree-shakeable, so unused extensions are stripped from your bundle.

Links

Website    •    Documentation    •    Live examples

Install

pnpm add @domternal/core

linkedom is an optional peer dependency: install it only if you call the SSR helpers (generateHTML, generateJSON, generateText) outside a browser.

pnpm add linkedom

Usage

import { Editor, StarterKit } from '@domternal/core';

const editor = new Editor({
  element: document.getElementById('editor')!,
  extensions: [StarterKit],
  content: '<p>Hello <strong>world</strong></p>',
  onUpdate: ({ editor }) => {
    console.log(editor.getJSON());
  },
});

// Chainable command API
editor.chain().focus().toggleBold().run();

// Read content
const html = editor.getHTML();
const json = editor.getJSON();

// Tear down
editor.destroy();

The engine ships no styles. Import @domternal/theme for ready-made light/dark editor styling, or supply your own CSS.

StarterKit bundles the common nodes, marks, and behaviors; each entry can be configured or disabled individually.

StarterKit.configure({
  codeBlock: false,                  // disable an extension
  heading: { levels: [1, 2, 3] },    // configure an extension
  link: { openOnClick: false },
});

To trim the bundle further, skip StarterKit and compose only the extensions you need:

import { Editor, Document, Paragraph, Text, Bold, History } from '@domternal/core';

const editor = new Editor({
  element: document.getElementById('editor')!,
  extensions: [Document, Paragraph, Text, Bold, History],
});

SSR

The generateHTML, generateJSON, and generateText helpers render content without an editor instance, for example on the server.

import { generateHTML, StarterKit } from '@domternal/core';

const html = generateHTML(
  { type: 'doc', content: [{ type: 'paragraph', content: [{ type: 'text', text: 'Hi' }] }] },
  [StarterKit],
);

generateJSON(html, extensions) does the reverse (HTML to doc JSON) and generateText extracts plain text.