Handsontable widget

I want to put a Handsontable widget in prosemirror , can you give me a hint about the schema and how?

1 Like

There’s roughly two approaches here. Both would involve a node view that renders your table nodes using Handsontable.

  • You can model the whole table in your ProseMirror schema, and carefully map changes in the table control to the proper ProseMirror steps (and vice versa, sync the table when its ProseMirror representation changes). This would make it possible to do collaborative editing inside the table.

  • You can treat the table as an opaque blob, and either store it elsewhere or put a representation of its content in a node attribute. Syncing would be all-or-nothing, which may require some additional logic to keep the selection inside the table intact.

1 Like

thank you.:slight_smile:

I’ve implemented something similar to this but I’m having difficulty copy/pasting from one table to the other (when there are two tables in the document). This works when the editor editable prop is false but not when editable is true.

I’m rendering the widget with a custom NodeView and have added

stopEvent() { 
  return true;

but hasn’t done the trick.

@marijn Any ideas on how I can fix this?

Nope, no idea what might be going wrong.