Security News
NIST Misses 2024 Deadline to Clear NVD Backlog
NIST has failed to meet its self-imposed deadline of clearing the NVD's backlog by the end of the fiscal year. Meanwhile, CVE's awaiting analysis have increased by 33% since June.
@blocknote/react
Advanced tools
A "Notion-style" block-based extensible text editor built on top of Prosemirror and Tiptap.
Welcome to BlockNote! The open source Block-Based rich text editor. Easily add a modern text editing experience to your app.
Homepage - Introduction - Documentation
Play with the editor @ https://blocknote-main.vercel.app/.
(Source in examples/editor)
import { BlockNoteView, useBlockNote } from "@blocknote/react";
import "@blocknote/core/style.css";
function App() {
const editor = useBlockNote({
onEditorContentChange: (editor) => {
// Log the document to console on every update
console.log(editor.getJSON());
},
});
return <BlockNoteView editor={editor} />;
}
@blocknote/react
comes with a fully styled UI that makes it an instant, polished editor ready to use in your app.
If you prefer to create your own UI components (menus), or don't want to use React, you can use @blocknote/core
(advanced, see docs).
BlockNote comes with a number of features and components to make it easy to embed a high-quality block-based editor in your app:
We'd love to hear your thoughts and see your experiments, so come and say hi on Discord or Matrix.
See CONTRIBUTING.md for more info and guidance on how to run the project (TLDR: just use npm start
).
Directory structure:
blocknote
├── packages/core - The core of the editor
├── packages/react - The main library for use in React apps
├── examples/editor - Example React app that embeds the editor
├── examples/vanilla - An advanced example if you don't want to use React or want to build your own UI components
└── tests - Playwright end to end tests
The codebase is automatically tested using Vitest and Playwright.
BlockNote is licensed under the MPL 2.0 license, which allows you to use BlockNote in commercial (and closed-source) applications. If you make changes to the BlockNote source files, you're expected to publish these changes so the wider community can benefit as well.
BlockNote builds directly on two awesome projects; Prosemirror by Marijn Haverbeke and Tiptap. Consider sponsoring those libraries when using BlockNote: Prosemirror, Tiptap.
BlockNote is built as part of TypeCell. TypeCell is proudly sponsored by the renowned NLNet foundation who are on a mission to support an open internet, and protect the privacy and security of internet users. Check them out!
Hosting and deployments powered by Vercel:
FAQs
A "Notion-style" block-based extensible text editor built on top of Prosemirror and Tiptap.
The npm package @blocknote/react receives a total of 17,644 weekly downloads. As such, @blocknote/react popularity was classified as popular.
We found that @blocknote/react demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
NIST has failed to meet its self-imposed deadline of clearing the NVD's backlog by the end of the fiscal year. Meanwhile, CVE's awaiting analysis have increased by 33% since June.
Security News
Cloudflare has launched a setup wizard allowing users to easily create and manage a security.txt file for vulnerability disclosure on their websites.
Security News
The Socket Research team breaks down a malicious npm package targeting the legitimate DOMPurify library. It uses obfuscated code to hide that it is exfiltrating browser and crypto wallet data.