feat(edgeless): support consistent dragging behavior

[AyushAgrawal-A2]

closes #5561

Changes:
In edgeless mode,

• dragging edgeless-note onto another edgeless-note merge the notes.
• dragging multiple blocks from edgeless-note onto whiteboard move the blocks into a new edgeless-note.
• dragging single image/bookmark/embed-* block from edgeless-note onto whiteboard creates a top-level edgeless block.
• dragging top-level edgeless image/bookmark/embed-* block onto edgeless note move the block inside the edgeless note.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
blocksuite	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Dec 14, 2023 8:57am

1 Ignored Deployment

Name	Status	Preview	Comments	Updated (UTC)
blocksuite-docs	⬜️ Ignored (Inspect)	Visit Preview		Dec 14, 2023 8:57am

[doodlewind]

Awesome work, we should definitely land this!

Two minor issues:

1. After dragging out an image, you can undo this operation, but unable to redo it back:

Screen.Recording.2023-12-14.at.21.51.31.mov

This usually happens due to unexpected side effect (model mutation) that comes with the undo, which resets the history stack.

2. After dragging an image inside the note, the first undo/redo pair works fine. But from this moment, it requires 2 undo operations to make actual undo effect:

Screen.Recording.2023-12-14.at.21.56.45.mov

This usually happens when page.captureSync() is called during a series of model operations, which will add one undo step.

By default, the UndoManger merges all operations from the same user during about 500ms (even if these operations are using multiple page.transact calls) into one undo step. Using page.captureSync() is the way to add more undo steps manually. For certain cases (e.g., batch adding images), adding more undo steps allows user to undo each operation one after another.