Is there a way to tie commands to a 3rd party menu control?

Hello,

I am trying to build an Angular document editor and I was wondering how can I tie commands to 3rd party controls (e.g. Angular Material buttons) that are outside of the ProseMirror container?

A simple sample or pseudocode will help me a lot. Unfortunately, I have spent a lot of time on this without any luck so not sure if this is possible or I am missing something here.

Thank you!

Hey,

Just create a plugin, set the state of it from your command ( by sending it some meta: dispatch(state.tr.setMeta(pluginKey, “set”/ “unset”) ).

After that you can read out the state from the outside world with pluginKey.getState(view.state). You can do a refresh on that query / refresh your menu each time dispatchTransaction is called.

The other option is to pass a callback to a plugin in a closure when it’s created, and call that callback.

Good luck!

1 Like

Commands are just functions that take an editor state and optionally a dispatch function, so if you have an EditorView object, you can call commands with command(view.state, view.dispatch) to run them, and just command(view.state) to query whether they currently apply.

1 Like

For some reason I totally misunderstood your question, maybe it was too late. Marijn’s answer is what you need.

1 Like