Yiitap

Yiitap is an AI powered, Notion-style WYSIWYG rich-text block-based editor, built on top of tiptap.🔥

Features

🚀 Supports Vue & React – Seamless integration with both frameworks.
📝 Modern Notion-style editor – Clean, intuitive, and distraction-free.
🔧 Highly customizable & extensible – Built on Tiptap & ProseMirror.
🤖 AI-powered – Smart features to boost productivity.
🧩 Block-based editing – Manipulate content via bubble, floating, main, or side menus.
✨ Rich feature set – Includes 15+ custom extensions & 50+ UI components.
🌗 Light & Dark mode.
🆓 MIT Licensed.

Quick start

• Guide to Yiitap
• Live Demo
• Full Example: Live | Source

For more detailed information, make sure to check out our documentation. If you encounter any problems or have suggestions, please open an issue.

Screenshots

Development

Install dependencies

pnpm install

Run demo

pnpm dev

Build

pnpm build

Others

project structure

tree -d -L 3 -I "node_modules|dist|src|public|types" yiitap

yiitap
├── apps
│   ├── react           # react demo app
│   └── vue             # vue demo app
└── packages
    ├── core            # core functions
    ├── extensions      # extensions
    │   ├── ai-block
    │   ├── callout
    │   ├── char-command
    │   ├── code-block
    │   ├── color-highlighter   
    │   ├── focus
    │   ├── image
    │   ├── link
    │   ├── placeholder
    │   ├── table
    │   ├── table-wrapper
    │   ├── trailing-node
    │   ├── unique-id
    │   └── video
    ├── icon            # editor icon set
    ├── react           # react component
    ├── utils           # utilities
    │   └── emoji
    └── vue             # vue component

Thanks

• Tiptap & ProseMirror: Yiitap is built on top of Tiptap and ProseMirror.
• BlockNote: A React Rich Text Editor that's block-based (Notion style) and extensible..

License

The MIT License (MIT). Please see License File for more information.