slate-plugins

Slate is a completely customizable framework for building rich text editors. However, your codebase can quickly get complex when implementing tens of features. Built on top of Slate, slate-plugins enables you to use a list of configurable and extendable plugins to keep your codebase clean and easy to debug.

This library comes with a lot of plugins for the elements, marks, deserialization, normalization, and so on. We also provide a bunch of helpers on top of Slate: API documentation.

Try out our plugins and create yours in a few minutes!

📦 Included

✨ 30+ Editor Plugins.
💅 Styling.
🏷️ Separation of Concerns.
⚛️ Atomic Design.
✅ Unit tested with [email protected].
📓 Docs and Demos on Storybook.
📖 API generated with TypeDoc.

🚀 Getting Started
🔌 Plugins
🤔 Notice
- Why
- Bundle size
👥 Community
👏 Contributing
- 👨‍💻 Development scripts
✨ Contributors
📝 License

🚀 Getting Started

yarn add @udecode/slate-plugins

⚠️ In production, you should pin the dependency until 1.0.0 is released.

You will also need these peerDependencies:

yarn add slate slate-hyperscript slate-react styled-components react react-dom

For guidance on using @udecode/slate-plugins visit: slate-plugins-next.netlify.app and checkout our API documentation.

For additional help, join us in our Slack.

🔌 Plugins

Element Plugins
Align	Enables support for text alignment.
BasicElements	Enables support for basic elements.
Blockquote	Enables support for block quotes.
CodeBlock	Enables support for pre-formatted code blocks.
Heading	Enables support for headings (from 1 to 6).
Image	Enables support for images.
ImageUpload	Allows for pasting images from clipboard.
Link	Enables support for hyperlinks.
List	Enables support for bulleted, numbered and to-do lists.
MediaEmbed	Enables support for embeddable media such as YouTube or Vimeo videos.
Mention	Enables support for autocompleting @mentions and #tags.
Paragraph	Enables support for paragraphs.
Table	Enables support for tables.

Mark Plugins
BasicMarks	Enables support for basic text formatting.
Bold	Enables support for bold formatting.
Code	Enables support for inline code formatting.
Highlight	Enables support for highlights.
Italic	Enables support for italic formatting.
Strikethrough	Enables support for strikethrough formatting.
Subscript	Enables support for subscript formatting.
Superscript	Enables support for superscript formatting.
Underline	Enables support for underline formatting.

Deserializer Plugins
DeserializeHtml	Enables support for deserializing content from HTML format to Slate format.
DeserializeMarkdown	Enables support for deserializing content from Markdown format to Slate format.

Serializer Plugins
SerializeHtml	Enables support for serializing content from Slate format to HTML. Useful for exports from editor.

Normalizer Plugins
NormalizeTypes	Enables support for defining type rules for specific locations in the document.
TrailingNode	Enables support for inserting a trailing node of a configurable type when the type of the last node is not matching.

Handler Plugins
Autoformat	Enables support for autoformatting actions.
SoftBreak	Enables support for inserting soft breaks.

Decorator Plugins
Preview	Enables support for previewing.

Toolbar
BalloonToolbar	Provides a toolbar, pointing at a particular element or range.
Toolbar	Provides a toolbar with buttons.

Utility Plugins
NodeID	Enables support for inserting nodes with an id key.

Widget Plugins
SearchHighlight	Enables support for highlighting searching text.

🤔 Notice

Why

Slate is a powerful editor framework that helps you deal with difficult parts when building an editor, such as events handlers, elements, formatting, commands, rendering, serializing, normalizing, etc.

While you are trying to build your own editors, it still need a lot of efforts to make something similar to Quill or ProseMirror. This repository allows you to build your editor right away with minimal slate knowledge.

Bundle size

For simplicity, a single package @udecode/slate-plugins has been published to share all the plugins. It's not a problem as it is tree-shakeable. However, a few plugins use external dependencies. These should be moved into their own package in the future.