Instead of trying to serialize everything into blocknote/html, we can instead serialize into blocknote/json whatever slice of data we want to be on the clipboard or drag & drop.

This should resolve a number of issues related to drag & drop, and simplifies things significantly.

HTML cannot encode the same sort of information that json can, for example, that a slice has different depths is not representable by html & has to be inferred, whereas just representing it as a slice, just works.

Does not resolve:

• PDF Block cannot be moved to any desired location. #1205
• Dragging text around copies the text instead of moving it #1610 need to handle a drag like that as a sort of cut & paste
• Likely the same code block cannot be moved (example page) #1653
  • this likely needs to be re-worked:

    BlockNote/packages/core/src/extensions/SideMenu/SideMenuPlugin.ts

    Lines 301 to 335 in 0eb3bce

    	// Drop event occurred within an editor.
    	if (parentEditorElement) {
    	// When ProseMirror handles a drop event on the editor while
    	// `view.dragging` is set, it deletes the selected content. However, if
    	// a block from a different editor is being dropped, this causes some
    	// issues that the code below fixes:
    	if (!this.isDragOrigin && this.pmView.dom === parentEditorElement) {
    	// Because the editor selection is unrelated to the dragged content, we
    	// don't want PM to delete its content. Therefore, we collapse the
    	// selection.
    	this.pmView.dispatch(
    	this.pmView.state.tr.setSelection(
    	TextSelection.create(
    	this.pmView.state.tr.doc,
    	this.pmView.state.tr.selection.to,
    	),
    	),
    	);
    	} else if (this.isDragOrigin && this.pmView.dom !== parentEditorElement) {
    	// Because the editor from which the block originates doesn't get a drop
    	// event on it, PM doesn't delete its selected content. Therefore, we
    	// need to do so manually.
    	//
    	// Note: Deleting the selected content from the editor from which the
    	// block originates, may change its height. This can cause the position of
    	// the editor in which the block is being dropping to shift, before it
    	// can handle the drop event. That in turn can cause the drop to happen
    	// somewhere other than the user intended. To get around this, we delay
    	// deleting the selected content until all editors have had the chance to
    	// handle the event.
    	setTimeout(
    	() => this.pmView.dispatch(this.pmView.state.tr.deleteSelection()),
    	0,
    	);
    	}

• Needs more info: Custom blocks change type when dragging. #1452
• Did not check, but unlikely to resolve: Dragging doesn't work on mobile #1693
• Did not check, but unlikely to resolve: Dragging custom block show Error: block type does not match #1694
• Don't know what is happening here: Can't copy paste multiple times #1788

What is left?

• We should add some tests around this to make sure that copy & paste results in the correct document (rather than just testing clipboard serialization)
• There is some work to do when it comes to drag & drop behavior (i.e. when to cut & paste)