@remirror/dom

Use remirror directly in the dom.

Usage no npm install needed!

<script type="module">
  import remirrorDom from 'https://cdn.skypack.dev/@remirror/dom';
</script>

README

@remirror/dom

Use remirror directly in the dom.

Version Weekly Downloads Bundled size Typed Codebase MIT License

Why

You've heard great things about prosemirror and would like to use it in your app, but you're slightly intimidated by some of the moving parts. You don't really want to deal with Schema, Nodes, Marks, Plugins, Decorations. You just want an editor.

This library provides an abstraction that might be right for you.

The functionality of the prosemirror library is wrapped up into extensions which manage the work for you.

Installation

# yarn
yarn add @remirror/dom

# pnpm
pnpm add @remirror/dom

# npm
npm install @remirror/dom

Usage

The following code is a guide to get you started.

import { createDomEditor, createDomManager } from 'remirror/dom';
import { BoldExtension } from 'remirror/extensions';

const element = document.querySelector('#editor');
const manager = createDomManager([new BoldExtension()]);
const editor = createDomEditor({ manager, element });

editor.addHandler('change', () => log('your editor has changed'));

// Make selected text bold.
editor.commands.toggleBold();