@udecode/plate

What is @udecode/plate?

@udecode/plate is a highly customizable rich text editor framework for React. It provides a set of tools and plugins to create a feature-rich text editor with various functionalities such as text formatting, embedding media, and collaborative editing.

What are @udecode/plate's main functionalities?

Basic Text Formatting

This code demonstrates how to set up a basic text editor with text formatting capabilities such as bold, italic, and underline using @udecode/plate.

const withPlate = createPlateUI();
const editor = withPlate(createEditor());

const App = () => (
  <Plate editor={editor} plugins={basicElementsPlugins} />
);

Embedding Media

This code shows how to extend the basic text editor to support embedding media like images and videos using the mediaEmbedPlugin.

const withPlate = createPlateUI();
const editor = withPlate(createEditor());

const App = () => (
  <Plate editor={editor} plugins={[...basicElementsPlugins, mediaEmbedPlugin]} />
);

Collaborative Editing

This code demonstrates how to enable collaborative editing in the text editor using the collaborativeEditingPlugin.

const withPlate = createPlateUI();
const editor = withPlate(createEditor());

const App = () => (
  <Plate editor={editor} plugins={[...basicElementsPlugins, collaborativeEditingPlugin]} />
);

Other packages similar to @udecode/plate

slate

Slate is a completely customizable framework for building rich text editors. It provides a set of tools to create complex text editing experiences. Compared to @udecode/plate, Slate offers more low-level control but requires more setup and configuration.

draft-js

Draft.js is a framework for building rich text editors in React, developed by Facebook. It provides a set of tools for creating text editors with features like text formatting and media embedding. Compared to @udecode/plate, Draft.js is less modular and has fewer built-in plugins.

quill

Quill is a powerful, free, open-source WYSIWYG editor built for the modern web. It offers a rich API and a wide range of features out of the box. Compared to @udecode/plate, Quill is less customizable but easier to set up and use for basic text editing needs.

README

Plate

This package bundles Plate core, plugins and UI for a quick start.

Documentation

Check out Playground.

API

See the API documentation.

License

MIT