Comments (10)
In order to get this to work with latest @blocknote I had to do what @siddharthbulia suggested above, but I had to install @mantine/[email protected] instead of 7.5.0 (which gave me dependency warnings and didn't work).
from blocknote.
@i-am-chitti and @quuu
I have been able to fix it by installing @mantine/[email protected]
and by adding import "@mantine/core/style.css
at the start of my App.jsx
It seems like this file should have automatically been imported but is not happening.
import "@blocknote/core/fonts/inter.css";
import { BlockNoteView, useCreateBlockNote } from "@blocknote/react";
import "@blocknote/react/style.css";
import "@mantine/core/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} />;
}
from blocknote.
Hi all! Turns out this was caused by a Mantine update. It should be fixed in the latest BlockNote release! (0.12.4)
from blocknote.
Thanks for the reports. This seems like a recent regression, we'll fix it asap!
from blocknote.
Am also hitting this issue on a fresh repo
from blocknote.
The stackblitz linked in the docs also is directly repro-able for this issue
from blocknote.
Same issue here. It is not working in regular project as well.
from blocknote.
Same problem here. Nextjs 14.1. @siddharthbulia fixed the Blocknote layout but broke up all styles of my app 😅 I'm using Tailwind and shadcn.
Bellow some images to exemplify.
Blocknote without manually import:
Blocknote manually importing @mantime/core/styles.css:
from blocknote.
@YousefED Thanks. Do post an update when fixed please.
from blocknote.
it works like this so far
Adding "@mantine/core/styles.css" and also importing "@/app/globals.css"
"@mantine/core": "^7.7.1"
from blocknote.
Related Issues (20)
- TypeError: Cannot read properties of null (reading 'useMemo') in next.js HOT 3
- Add support for Uppy for file uploading HOT 7
- Integrate emoji picker HOT 21
- `i.view is undefined` with `editor.replaceBlocks` or `editor.removeBlocks` HOT 4
- Custom blocks don't cut-paste properly HOT 5
- 我如何在编辑器中上传图片和文件进行超链接点击图片实现自动跳转超链接功能? HOT 1
- Using `BlockNoteViewRaw` throws `SideMenu` error HOT 4
- Severe Vulnerability from root HOT 1
- In custom blocks , how can I disable the menu when editable is false. HOT 2
- Darkmode not applied in next.js next-themes HOT 2
- `tryParseMarkdownToBlocks` not parsing checklists HOT 7
- Calling `editor.updateBlock()` in quick succession breaks the editor's undo/redo functionality HOT 1
- Table: Cannot read properties of null ChildNodes HOT 2
- Code formatting with Blocknote? HOT 5
- architecture: fix contentcomponent mounting
- architecture: make it possible to manipulate blocks before view is instantiated HOT 2
- `replaceBlocks` is removing the space between brackets for checklists HOT 3
- block position error HOT 1
- Error: Blocks with the following IDs could not be found in the editor HOT 2
- So many deprecated packages HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from blocknote.