BlockSuite is the open-source editor project behind AFFiNE. It provides an out-of-the-box block-based editor built on top of a framework designed for general-purpose collaborative applications. This monorepo maintains both the editor and the underlying framework.

BlockSuite-based Editor in AFFiNE

👉 Try BlockSuite-based AFFiNE online

⚠️ This project is under heavy development and is in a stage of rapid evolution. Stay tuned or see our roadmap here!

BlockSuite works very differently than traditional rich text frameworks. Feature highlights:

• 📝 Block-Based Editing: BlockSuite breaks down rich content into discrete contenteditable blocks, avoiding pitfalls using traditional monolithic rich text container.
• 🧬 Intrinsically Collaborative: By harnessing the power of CRDT, any application built with BlockSuite effortlessly supports real-time collaboration right from the start.
• 🧩 Framework Agnostic: With UI components implemented using Web Components, BlockSuite provides editors that can be easily embedded and eliminates the risk of vendor lock-in.
• 🎯 Incremental State Sync: The state updates in BlockSuite can be incrementally encoded as standardized binaries, enabling efficient data synchronization over various network protocols.
• 📏 Compact Rich Text: BlockSuite builds its own rich text component. With minimal responsibilities that benefits from the block-based architecture, this component is light, simple and reliable.
• 🎨 Hybrid Infinite Canvas: A high performance canvas-based renderer is also provided by BlockSuite, fulfilling needs for whiteboard functionalities.

Check out blocksuite.affine.pro for a detailed overview!

• 🎁 Examples
  • Nightly Playground (🔗 source)
  • The SimpleAffineEditor Example (🔗 source)
  • AFFiNE Alpha Editor (🔗 source)
  • BlockSuite Monorepo in StackBlitz
  • Vue-based BlocksVite Editor
• 📄 Documentation
• 🗓️ GitHub Project
• 📍 GitHub Issues
• 🎙️ GitHub Discussions
• 💬 Discord Channel
• 🏠 AFFiNE Community
• 🚀 Releases

To learn how to start using BlockSuite, visit blocksuite.affine.pro.

See BUILDING.md for instructions on how to build BlockSuite from source code.

BlockSuite accepts pull requests on GitHub. Before you start contributing, please make sure you have read and accepted our Contributor License Agreement. To indicate your agreement, simply edit this file and submit a pull request.

MPL 2.0