Introduction
The rich-text editor framework for React.
Plate is a powerful toolkit that makes it easier for you to develop with Slate, a popular framework for building text editors. Plate focuses on four main areas: Core, Plugins, Primitives and Components.
Core
The heart of Plate is its plugin system, designed for both slate
and slate-react
, with support for server-side rendering. It helps keep your project organized and efficient by separating different functionalities and keeping things clean. The core functionality is available in vanilla JavaScript, allowing for server-side rendering and non-React usage.
Plugins
Plate offers a wide range of plugin packages that enhance the behavior, hooks, serialization, normalization, and other features of the editor. These plugins are "headless," meaning they are unstyled by default. The plugin system includes:
- State Management: Each plugin has its own Zustand store.
- Shortcuts: Define custom hotkeys for each plugin.
- API and Transforms: Plugins can define their own API methods and transforms, accessible through
editor.api
andeditor.transforms
. - TypeScript: Powerful type inference for both plugins and editor.
Primitives
In addition to plugins, Plate provides unstyled and accessible components based on Radix UI. These components serve as the foundation for building high-quality design systems.
Components
To help you get started with a visually appealing interface, Plate offers pre-built styled components you can own using our CLI. These components, based on shadcn/ui, can be used as a reference or starting point for your own component library, enabling you to create a unique, accessible, and visually pleasing user interface.
FAQ
Credits
Customizable and extensible.