fix(core): call scrollIntoView() on Enter by Wqrld · Pull Request #2802 · TypeCellOS/BlockNote

Wqrld · 2026-05-30T20:31:57Z

Summary

Updates the enter handler to scrollintoview both globally and for listItems.

Part of #2801

Rationale

Without this handler, the cursor goes out of frame when pressing enter on the last line in the window

Changes

adds a scrollintoview call for the normal and listitem enter handler

Impact

None expected.

Testing

Tested in the playground environment. Does not overscroll the margins yet as in the demo video.

Screenshots/Video

See referenced issue

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

There should be support for configuring the margin aswell (see original issue). I can try to add that here or in a separate PR

Disclaimer: Code was AI assisted, but tested by a human and PR text is human.

Summary by CodeRabbit

New Features
- Allow passing editor configuration props (excluding internally managed attributes and paste handling) when creating the editor, enabling safer customization of editor behavior.
Bug Fixes
- Ensure pressing Enter to split blocks or empty list items scrolls the newly created content into view automatically.

updates the enter handler to scrollintoview both globally and for listItems. Signed-off-by: Wqrld <wereld03@gmail.com>

vercel · 2026-05-30T20:32:02Z

@Wqrld is attempting to deploy a commit to the TypeCell Team on Vercel.

A member of the Team first needs to authorize it.

coderabbitai · 2026-05-30T20:32:09Z

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 8642f3ec-7f7e-4d81-81d7-7fa969147c2c

📥 Commits

Reviewing files that changed from the base of the PR and between 360d5d1 and a88625d.

📒 Files selected for processing (1)

packages/core/src/blocks/utils/listItemEnterHandler.ts

📝 Walkthrough

Walkthrough

Adds viewport scrolling for newly created blocks when splitting with Enter (both list-item handler and keyboard shortcut). Also exposes a restricted editorProps option on BlockNoteEditorOptions and uses it during TipTap initialization while BlockNote retains control of attributes and transformPasted.

Changes

Enter key scroll behavior

Layer / File(s)	Summary
Scroll into view on block split `packages/core/src/blocks/utils/listItemEnterHandler.ts`, `packages/core/src/extensions/tiptap-extensions/KeyboardShortcuts/KeyboardShortcutsExtension.ts`	List item Enter handler calls `tr.scrollIntoView()` after deleting the selection and before returning the split transaction; KeyboardShortcuts adds `.scrollIntoView()` to the split command chain before `.run()`.

BlockNote editorProps option

Layer / File(s)	Summary
Expose and consume restricted `editorProps` `packages/core/src/editor/BlockNoteEditor.ts`	Adds `editorProps?: Omit<NonNullable<EditorOptions['editorProps']>, 'attributes'

Sequence Diagram

sequenceDiagram
  participant Editor
  participant ListItemEnterHandler
  participant KeyboardShortcutsExtension
  participant splitBlockCommand
  participant tr
  Editor->>ListItemEnterHandler: Enter in empty list item
  ListItemEnterHandler->>tr: tr.deleteSelection()
  ListItemEnterHandler->>splitBlockCommand: splitBlockTr(...)
  splitBlockCommand->>tr: returns split transaction
  ListItemEnterHandler->>tr: tr.scrollIntoView()
  Editor->>KeyboardShortcutsExtension: Enter shortcut invoked
  KeyboardShortcutsExtension->>splitBlockCommand: splitBlockCommand(...)
  splitBlockCommand->>tr: updated transaction
  KeyboardShortcutsExtension->>tr: .scrollIntoView() chained before .run()

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related issues

Cursor goes out of view when pressing enter on the last line of a document #2801 — The changes add tr.scrollIntoView() after split-block/Enter handling, which addresses the cursor-out-of-view behavior described.

Suggested reviewers

nperez0111
matthewlipski

Poem

🐰 A hop, a split, a page made new,
The viewport follows each cursor's cue,
Options tucked where settings stay,
Editors listen, then display,
I nibble bugs and hop away. ✨

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately describes the main changes: adding scrollIntoView() calls to the Enter key handlers across multiple files.
Description check	✅ Passed	The description covers Summary, Rationale, Changes, Impact, and Testing sections with sufficient detail, though some non-critical checklist items remain incomplete.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

Wqrld · 2026-05-30T20:37:58Z

Would you be willing to promote editorprops to something that does not need accessing the internal _tiptapOptions so the margins and maybe other editorprops can be set nicely?

(Ref workaround diff in the original issue)

YousefED

Thanks for this.

PR seems good, but I'd rather not expose the generic "editorProps", but rather design our own API surface / properties for the scroll configuration.

wdyt @nperez0111 ?

pkg-pr-new · 2026-06-01T07:34:35Z

Open in StackBlitz

@blocknote/ariakit

npm i https://pkg.pr.new/@blocknote/ariakit@2802

@blocknote/code-block

npm i https://pkg.pr.new/@blocknote/code-block@2802

@blocknote/core

npm i https://pkg.pr.new/@blocknote/core@2802

@blocknote/mantine

npm i https://pkg.pr.new/@blocknote/mantine@2802

@blocknote/react

npm i https://pkg.pr.new/@blocknote/react@2802

@blocknote/server-util

npm i https://pkg.pr.new/@blocknote/server-util@2802

@blocknote/shadcn

npm i https://pkg.pr.new/@blocknote/shadcn@2802

@blocknote/xl-ai

npm i https://pkg.pr.new/@blocknote/xl-ai@2802

@blocknote/xl-docx-exporter

npm i https://pkg.pr.new/@blocknote/xl-docx-exporter@2802

@blocknote/xl-email-exporter

npm i https://pkg.pr.new/@blocknote/xl-email-exporter@2802

@blocknote/xl-multi-column

npm i https://pkg.pr.new/@blocknote/xl-multi-column@2802

@blocknote/xl-odt-exporter

npm i https://pkg.pr.new/@blocknote/xl-odt-exporter@2802

@blocknote/xl-pdf-exporter

npm i https://pkg.pr.new/@blocknote/xl-pdf-exporter@2802

commit: 360d5d1

nperez0111 · 2026-06-01T13:34:07Z

+  /**
+   * Additional ProseMirror editor props to pass to the underlying editor view.
+   * Use this to configure options such as `scrollMargin`, `scrollThreshold`,
+   * `handleDOMEvents`, and other
+   * [ProseMirror EditorProps](https://prosemirror.net/docs/ref/#view.EditorProps).
+   *
+   * Note: `attributes` (use {@link domAttributes} instead) and `transformPasted`
+   * are managed by BlockNote and cannot be overridden here.
+   */
+  editorProps?: Omit<
+    NonNullable<EditorOptions["editorProps"]>,
+    "attributes" | "transformPasted"
+  >;


I'm not sure that I want to expose this @Wqrld, can you explain what you would be using this for? If it is just for scrollMargin, I think we could set that default within BlockNote instead of having to expose this whole config on our API surface for it.

It is indeed just for scrollmargin and scrollthreshold. Any way that exposes those in some way or another works for me.

What values are you using for those? I don't think I would expose that low-level of a concept. I would just pick a value that makes sense for BlockNote already

I was playing around with 72 for scrollmargin and 0 for scrollThreshold. What feels right depends a bit on the font and editor size so i prefer to make it configurable (with good defaults)

nperez0111 · 2026-06-01T13:40:22Z

Thanks for the contribution, I agree with the goal here, just some minor details to work through

Co-authored-by: Nick Perez <computers@nickthesick.com>

fix(core): call scrollIntoView() on Enter

82b69ea

updates the enter handler to scrollintoview both globally and for listItems. Signed-off-by: Wqrld <wereld03@gmail.com>

feat: Make editorprops public

360d5d1

YousefED reviewed Jun 1, 2026

View reviewed changes

nperez0111 reviewed Jun 1, 2026

View reviewed changes

Comment thread packages/core/src/blocks/utils/listItemEnterHandler.ts Outdated

nperez0111 requested changes Jun 1, 2026

View reviewed changes

cleanup scrollintoview call

a88625d

Co-authored-by: Nick Perez <computers@nickthesick.com>

Uh oh!

Conversation

Wqrld commented May 30, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Rationale

Changes

Impact

Testing

Screenshots/Video

Checklist

Additional Notes

Summary by CodeRabbit

Uh oh!

vercel Bot commented May 30, 2026

Uh oh!

coderabbitai Bot commented May 30, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Sequence Diagram

Estimated code review effort

Possibly related issues

Suggested reviewers

Poem

Uh oh!

Wqrld commented May 30, 2026

Uh oh!

YousefED left a comment

Choose a reason for hiding this comment

Uh oh!

pkg-pr-new Bot commented Jun 1, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

nperez0111 Jun 1, 2026

Choose a reason for hiding this comment

Uh oh!

Wqrld Jun 1, 2026

Choose a reason for hiding this comment

Uh oh!

nperez0111 Jun 1, 2026

Choose a reason for hiding this comment

Uh oh!

Wqrld Jun 1, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

nperez0111 commented Jun 1, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Wqrld commented May 30, 2026 •

edited by coderabbitai Bot

Loading

coderabbitai Bot commented May 30, 2026 •

edited

Loading

pkg-pr-new Bot commented Jun 1, 2026 •

edited

Loading