Does the editor work with Vite?

Yes. It needs React 19, Tailwind CSS v4 and shadcn with Radix primitives, and nothing in it needs Next.js. The registry is tested with shadcn 4.21.4 on both Next.js and Vite.

Can I use it without Next.js?

Yes, in any React 19 project that can build the shadcn components it depends on. The editor has no server requirement; only the read-only renderer is designed to run on a server, and it also runs in the browser.

Does it support Base UI?

No. The block renders the Radix component APIs, and a shadcn project styled for Base UI does not compile without changes.

How do I save a document to my database?

Implement EditorPersistenceAdapter, with load, save, saveRecovery and an optional subscribe, and pass it as the adapter prop. The editor autosaves 800 ms after the last change and sends the revision it edited from, so your API can reject a stale write with a conflict.

How do I upload images and other files?

Pass a FileUploadAdapter whose upload returns an object with a url. Without one there is no upload function: dropped and pasted files are rejected with a notice, and only http, https or root-relative URLs are shown.

Is there live collaboration or AI?

Neither. There is no presence and no suggestion engine. A document saved by someone else while the editor is open is reported as a conflict, and the user is asked to reload; the local copy is written to recovery storage first.

How do I render the content read-only on the server?

Render NotionLikeEditorStatic with the saved EditorValue. It has no hooks and no "use client" directive, so a server component can render it, and it takes no adapters and no onChange. It has no width of its own, so set one on the element around it.

How do I disable tables?

Pass features={{ tables: false }}. The table entries disappear from the slash menu, the Add menu and Turn into, and a pasted HTML table becomes paragraphs. Existing tables still render, and can still be edited and deleted.

How do I change the width of the editor?

Set --editor-max-width on an ancestor of the editor. The default is 700px, and it applies to the editing column and to the loading skeleton and recovery notice. The static renderer ignores it, so give the element around it the same width.

Why did shadcn ask me to overwrite a file?

The block depends on shadcn components you may already have, such as button or dialog. Answer N to keep your local file and continue the install; only answer yes if you want the registry's version to replace it.

How do mentions work?

Pass a MentionProvider with a search method, and optionally resolve. A mention stores the entity type and entity id plus the label it shows, so renaming a person later does not break the link. Without a provider, the @ trigger does nothing.

Can I export a document to Markdown?

The editor ships no import or export. A document is JSON in your storage, so an export is a function you write over that value.

FAQ

Short answers to the questions developers ask first: Vite, Base UI, saving to a database, uploads, collaboration, read-only rendering and tables.

The questions that come up first. Each answer stands alone, so a search result or an agent can read one without the rest of this page.

Questions

Does the editor work with Vite?: Yes. It needs React 19, Tailwind CSS v4 and shadcn with Radix primitives, and nothing in it needs Next.js. The registry is tested with shadcn 4.21.4 on both Next.js and Vite.
Can I use it without Next.js?: Yes, in any React 19 project that can build the shadcn components it depends on. The editor has no server requirement; only the read-only renderer is designed to run on a server, and it also runs in the browser.
Does it support Base UI?: No. The block renders the Radix component APIs, and a shadcn project styled for Base UI does not compile without changes.
How do I save a document to my database?: Implement EditorPersistenceAdapter, with load, save, saveRecovery and an optional subscribe, and pass it as the adapter prop. The editor autosaves 800 ms after the last change and sends the revision it edited from, so your API can reject a stale write with a conflict.
How do I upload images and other files?: Pass a FileUploadAdapter whose upload returns an object with a url. Without one there is no upload function: dropped and pasted files are rejected with a notice, and only http, https or root-relative URLs are shown.
Is there live collaboration or AI?: Neither. There is no presence and no suggestion engine. A document saved by someone else while the editor is open is reported as a conflict, and the user is asked to reload; the local copy is written to recovery storage first.
How do I render the content read-only on the server?: Render NotionLikeEditorStatic with the saved EditorValue. It has no hooks and no "use client" directive, so a server component can render it, and it takes no adapters and no onChange. It has no width of its own, so set one on the element around it.
How do I disable tables?: Pass features={{ tables: false }}. The table entries disappear from the slash menu, the Add menu and Turn into, and a pasted HTML table becomes paragraphs. Existing tables still render, and can still be edited and deleted.
How do I change the width of the editor?: Set --editor-max-width on an ancestor of the editor. The default is 700px, and it applies to the editing column and to the loading skeleton and recovery notice. The static renderer ignores it, so give the element around it the same width.
Why did shadcn ask me to overwrite a file?: The block depends on shadcn components you may already have, such as button or dialog. Answer N to keep your local file and continue the install; only answer yes if you want the registry's version to replace it.
How do mentions work?: Pass a MentionProvider with a search method, and optionally resolve. A mention stores the entity type and entity id plus the label it shows, so renaming a person later does not break the link. Without a provider, the @ trigger does nothing.
Can I export a document to Markdown?: The editor ships no import or export. A document is JSON in your storage, so an export is a function you write over that value.

Installation for the commands and the prompts
Known limits for what the editor does not do yet

Questions

Related