Plate is using a zustood store for each editor, stored by id.
If rendering only one editor, the store
id is optional, the default being
Plate Store is a zustood store that implements the following state:
Editableis rendered so slate DOM is resolvable.
- A key that is incremented on each editor change.
- A key that is incremented on each editor.plugins change.
- A key that is incremented on each editor.selection change.
usePlateSelectors(id).<state property>()when you need to subscribe to a value.
usePlateSelectors(id).value()will subscribe to
- See zustood hooks
getPlateSelectors(id).<state property>()when you don't need to subscribe to a value.
- See zustood getters
Platesubscribes to the store state so you can update the store state in a flexible way.
getPlateActions(id).<state property>(<new value>)when you need to update the value of a store property.
getPlateActions(id).value(<new value>)will update
- See zustood actions
- Redecorate the editor.
You can't access the store before it's initialized. Two ways of doing this:
Platecomponent: the store is initialized, you can access it.
Platecomponent (e.g. for a shared toolbar): the store is not initialized, you will need to render
PlateProviderabove your accessing component.
The only prop of
id which is the id of the store (defaults to
- HOC that wraps your component with
In other words,
platesStore is a store that can store many plate stores by id, looking to this:
Plate is taking care of the store initialization and updates. You will not need to use this store directly.
This store is an object whose property keys are event names (e.g.
'focus') and whose property values are editor ids.
This is useful when having multiple editors and get one based on DOM events (e.g. the last focused editor).
One of the core plugins of Plate will store the following events.
- the last focused editor id
- the last blurred editor id (sets
- the last defined editor id
- Hook selectors
useEventEditorSelectors().focus()will get the last focused editor id.
- See zustood hooks
- Get last event editor id: focus, blur or last.
- Get the context plate id if called in a
- If the latter is not defined, useEventEditorId will be used.
- HOC that will add
PlateEventProviderabove a component.
- Useful for toolbars shared between multiple editors.