remirror

One editing package to rule them all, one editing package to bind them.

Usage no npm install needed!

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

README

remirror

One package to rule them all, one entry point to bind them.

Version Weekly Downloads Bundled size Typed Codebase MIT License

Installation

# yarn
yarn add remirror @remirror/pm

# pnpm
pnpm add remirror @remirror/pm

# npm
npm install remirror @remirror/pm

The remirror package will automatically install the @remirror/pm package for you. You only need to install it yourself if you'd like to ensure consistent versions of the prosemirror-* libraries when importing from @remirror/pm/state instead of prosemirror-state or @remirror/pm/model instead of prosemirror-model.

Usage

Rather than installing multiple scoped packages, the remirror package is a gateway to using all the goodness that remirror provides while minimising your bundle size.

The following creates a controlled editor with React.

import React from 'react';
import { SocialPreset } from 'remirror/extensions';
import { Remirror, SocialEmojiComponent, useRemirror } from '@remirror/react';

const EditorWrapper = () => {
  const socialPreset = new SocialPreset();
  const { state, onChange } = useRemirror({ extensions: () => [...socialPreset()] });

  return (
    <Remirror state={state} onChange={onChange} manager={manager} autoRender={true}>
      <SocialEmojiComponent />
    </Remirror>
  );
};

These are the entry points available through the remirror package.

  • remirror - All the core functionality available through @remirror/core.
  • remirror/extensions - All the core extensions and presets made available through the main remirror repository. This doesn't include any framework specific extensions and presets.
  • remirror/dom - The dom framework implementation of via createDomEditor.