Skip to content

Conversation

@matthewlipski
Copy link
Collaborator

@matthewlipski matthewlipski commented Oct 15, 2025

Summary

Currently, when there is only one block in a column, removing it via removeBlocks/replaceBlocks won't collapse the column as it should, leading to confusing UX when deleting the block from the side menu. This behavior is also different to removing the block by hitting backspace at its start.

This PR makes empty columns, and columnLists with <2 children get collapsed. This happens by running the new fixColumnList function in removeBlocks/replaceBlocks. The Backspace keyboard handler has also been updated to use fixColumnList when removing the last block in a column.

Closes #1323
Fixes #2000

Rationale

The current behavior of the remove block button in the side menu is unintuitive when used on the only block in a column, and should be improved.

Changes

  • Added fixColumnList function.
  • Made removeAndInsertBlocks and Backspace keyboard handler use fixColumnList.

Impact

Since removeAndInsertBlocks can now remove column/columnList nodes that it's actively traversing in doc.descendants, there's an edge case where I'm not sure what will happen.

E.g. consider this structure:

  • columnList
    • column
      • blockContainer 1
    • column
      • blockContainer 2
    • column
      • blockContainer 3

If we call removeBlocks for both blockContainer 2 & 3, I'm not sure this will work properly. Worth adding tests for this?

EDIT: Added tests, works ok for both removing and replacing blocks 👍

Testing

See above.

Screenshots/Video

N/A

Checklist

  • Code follows the project's coding standards.
  • Unit tests covering the new feature have been added.
  • All existing tests pass.
  • The documentation has been updated to reflect the new feature

Additional Notes

@vercel
Copy link

vercel bot commented Oct 15, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Preview Updated (UTC)
blocknote Ready Ready Preview Oct 31, 2025 4:59pm
blocknote-website Ready Ready Preview Oct 31, 2025 4:59pm

@pkg-pr-new
Copy link

pkg-pr-new bot commented Oct 15, 2025

Open in StackBlitz

@blocknote/ariakit

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/ariakit@2110

@blocknote/code-block

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/code-block@2110

@blocknote/core

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/core@2110

@blocknote/mantine

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/mantine@2110

@blocknote/react

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/react@2110

@blocknote/server-util

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/server-util@2110

@blocknote/shadcn

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/shadcn@2110

@blocknote/xl-ai

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-ai@2110

@blocknote/xl-docx-exporter

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-docx-exporter@2110

@blocknote/xl-email-exporter

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-email-exporter@2110

@blocknote/xl-multi-column

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-multi-column@2110

@blocknote/xl-odt-exporter

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-odt-exporter@2110

@blocknote/xl-pdf-exporter

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-pdf-exporter@2110

commit: 4ff328f

@nperez0111
Copy link
Contributor

Where are we at with this @matthewlipski, am I missing the changes you made here?

@matthewlipski
Copy link
Collaborator Author

Nope, #2113 merges into this PR though - do we wanna close this one and merge #2113 straight into main instead?

@nperez0111
Copy link
Contributor

That's what it was. Let's merge that into this & review altogether I think

* Added `fixColumnList` function

* Updated keyboard shortcut

* Implemented PR feedback
@matthewlipski
Copy link
Collaborator Author

IMPORTANT NOTE

There is a known issue with this PR, in that fixColumnList will remove all empty columns from a columnList (i.e. ones which only have a single empty paragraph). This is because we want to remove any empty columns that ProseMirror adds when it tries to "fix" columnLists that don't conform to the schema, and we don't differentiate between these and empty columns intentionally created by the user. This can result in poor UX as below:

Screen.Recording.2025-10-31.at.16.27.16.mov

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

UX hickups - multi-column cursor drop Cannot convert from Multi Column to single column

3 participants