TypeCellOS / BlockNote

A React Rich Text Editor that's block-based (Notion style) and extensible. Built on top of Prosemirror and Tiptap.
https://www.blocknotejs.org/
Mozilla Public License 2.0
6.79k stars 476 forks source link

fix: Selections and moving multiple blocks #1276

Open matthewlipski opened 3 days ago

matthewlipski commented 3 days ago

getSelection

This PR changes the logic for retrieving getSelection().blocks.

Generally, we now return the blocks spanned by the selection at the depth of the shallowest block spanned, aka the shared depth. However, when the block in which the selection starts is at a higher depth than the shared depth, we omit the first block at the shared depth. Instead, we include descendant blocks of the first block at the shared depth, starting at the start block at its original depth, adding the siblings after it, and reducing the depth until we reach the shared depth. This sounds a bit confusing, but basically it's to mimic Notion's behaviour (which you can see when moving multiple selected blocks up/down using Cmd+Shift+ArrowUp/ArrowDown).

Previously, getSelection().blocks would return all blocks spanned by the selection regardless of nesting level.

The code should also be much more performant as it no longer calls doc.descendants.

setSelection

A setSelection method has also been added to the editor. This takes 2 block identifiers for the start and end blocks of the selection and makes the selection span them, as well as any blocks between. The blocks passed must have content of some kind (either "inline" or "table"), as the selection created is always a TextSelection in ProseMirror terms. The block identifiers must also point to 2 different blocks.

moveBlocks

moveBlockUp and moveBlockDown have been renamed to moveBlocksUp and moveBlocksDown as they now work when multiple blocks are selected. As well as this, they now work with columns and the behaviour follows Notion aside from a few cases. Namely, column and columnList blocks in the selection are replaced with just the blocks inside them when moving up/down.

Other changes

getPrevBlock, getNextBlock and getParentBlock methods have been added to the editor. These are pretty self-explanatory and share a lot of logic with the existing getBlock. All of these also now work for getting column & columnList blocks, whereas getBlock could previously only find regular blocks.

Fixed an error sometimes being thrown by the table handles when removing blocks. This was specifically happening with moveBlocksUp and moveBlocksDown.

Closes #1239

vercel[bot] commented 3 days ago

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

Name Status Preview Updated (UTC)
blocknote ✅ Ready (Inspect) Visit Preview Nov 28, 2024 1:32pm
blocknote-website ✅ Ready (Inspect) Visit Preview Nov 28, 2024 1:32pm