usePlateStore ? how to store and subscribe to changes on a custom value

[aarcoraci]

Hello all ! I'm working on some components for an editor: a button and an Editable. The button has many functionalities but among them some search text (all voice activated).

In order to show the matches when the search voice command is processed through the ToolbarButton I was thinking on using a custom Editable with some decorators (basically a carbon copy of the slate search text demo).

The problem I'm facing is the Button Component and the Editor component are independent and I need to sync the search term. Is it possible to use the Store for this ?

hierarchy wise these elements are siblings:

  <Plate
    initialValue={initialValue}
    plugins={plugins}
    renderEditable={() => <EditableVoiceCommands />}
  >
    <HeadingToolbar>
      <ToolbarVoiceCommandsButton {...args} />
    </HeadingToolbar>
  </Plate>

As I was mentioning, the idea if that if I say "select Lorem" then lorem is stored and the custom Editable reacts to this change.

Thanks !

[zbeyens]

You can use plate store for anything but I strongly recommend having your own store – I'm using https://github.com/udecode/zustood which is very fast to setup

[aarcoraci]

Thanks for that super fast response ! I was trying to stay within the context of Plate and add as little dependencies as possible. Is there gist or source file where I could see how to add a custom value to be consumed ?

Thanks again !

[zbeyens]

Plate is using zustood so you're safe to go.

Adding new fields to the store is not possible at the moment, you can only extend selectors/actions (see zustood docs)

[aarcoraci]

Thanks a lot !