🚀 BlockNote AI is here! Access the early preview.
Examples/Basic/Scrollable Editor

Scrollable Editor

This example shows how to constrain the editor height and make it scrollable.

Relevant Docs:

import "@blocknote/core/fonts/inter.css";
import { BlockNoteView } from "@blocknote/mantine";
import "@blocknote/mantine/style.css";
import { useCreateBlockNote } from "@blocknote/react";

import "./style.css";

export default function App() {
  // Creates a new editor instance.
  const editor = useCreateBlockNote();

  // Renders the editor instance using a React component.
  return <BlockNoteView editor={editor} />;
}
.bn-editor {
  height: 500px;
  overflow: auto;
}