Project Name | Stars | Downloads | Repos Using This | Packages Using This | Most Recent Commit | Total Releases | Latest Release | Open Issues | License | Language |
---|---|---|---|---|---|---|---|---|---|---|
Slate | 26,694 | 3,499 | 923 | 12 hours ago | 686 | August 23, 2022 | 577 | mit | TypeScript | |
A completely customizable framework for building rich text editors. (Currently in beta.) | ||||||||||
Tiptap | 18,530 | 136 | 6 hours ago | 198 | September 20, 2022 | 244 | mit | TypeScript | ||
The headless editor framework for web artisans. | ||||||||||
Affine | 13,861 | 6 hours ago | 167 | mpl-2.0 | TypeScript | |||||
There can be more than Notion and Miro. AFFiNE is a next-gen knowledge base that brings planning, sorting and creating all together. Privacy first, open-source, customizable and ready to use. | ||||||||||
Oni | 11,477 | 1 | 3 years ago | 6 | April 02, 2017 | 518 | mit | TypeScript | ||
Oni: Modern Modal Editing - powered by Neovim | ||||||||||
Awesome Lowcode | 11,264 | 2 days ago | 4 | cc0-1.0 | ||||||
国内低代码平台从业者交流 | ||||||||||
React Page | 9,134 | 18 | 8 days ago | 304 | September 21, 2022 | 11 | mit | TypeScript | ||
Next-gen, highly customizable content editor for the browser - based on React and written in TypeScript. WYSIWYG on steroids. | ||||||||||
Tinacms | 8,555 | 5 | 61 | a day ago | 105 | September 21, 2022 | 84 | other | TypeScript | |
A headless CMS for Markdown | ||||||||||
H5 Dooring | 7,298 | a month ago | 29 | gpl-3.0 | JavaScript | |||||
H5 Page Maker, H5 Editor, LowCode. Make H5 as easy as building blocks. | 让H5制作像搭积木一样简单, 轻松搭建H5页面, H5网站, PC端网站,LowCode平台. | ||||||||||
Vditor | 6,039 | 11 | 17 | 3 days ago | 310 | August 04, 2022 | 82 | mit | TypeScript | |
♏ 一款浏览器端的 Markdown 编辑器,支持所见即所得(富文本)、即时渲染(类似 Typora)和分屏预览模式。An In-browser Markdown editor, support WYSIWYG (Rich Text), Instant Rendering (Typora-like) and Split View modes. | ||||||||||
React Draft Wysiwyg | 6,000 | 786 | 337 | a month ago | 131 | July 17, 2022 | 683 | mit | JavaScript | |
A Wysiwyg editor build on top of ReactJS and DraftJS. https://jpuri.github.io/react-draft-wysiwyg |
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 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: