Novel: A Notion-style WYSIWYG Editor with AI-Powered Autocompletions

Novel is a powerful, Notion-style What You See Is What You Get (WYSIWYG) editor that leverages the power of AI to enhance your writing experience. Built using Tiptap and the Vercel AI SDK, Novel offers a seamless and intuitive interface for creating and editing documents.

Key Features

• AI-Powered Autocompletion: Novel's standout feature is its AI-driven autocompletion. Simply type ++ to activate the autocomplete suggestions, or conveniently select from the slash menu. This feature significantly speeds up your writing process and reduces errors.
• Slash Menu & Bubble Menu: Access a wide range of functionalities quickly and easily through intuitive slash and bubble menus. These menus provide quick access to features like image uploads, tweet embedding, and more.
• Image Uploads: Effortlessly add images to your documents via drag-and-drop, copy-and-paste, or by selecting from the slash menu. This streamlined process keeps your workflow efficient.
• Tweet Embedding: Seamlessly integrate tweets into your documents directly from the slash menu. This feature is perfect for sharing relevant social media content within your writing.
• Mathematical Symbols with LaTeX Expression: Novel supports the rendering of complex mathematical expressions using LaTeX. This makes it ideal for creating documents with mathematical formulas and equations.
• Example LaTeX Expressions:
  • E=mc²
  • a² = b² + c²
  • f^(ξ) = ∫₋∞₌∞ f(x)e⁻²πixξ dx
  • A = \begin{bmatrix} a & c \ b & d \end{bmatrix}
  • ∑ᵢ₌₀ⁿ xᵢ

Getting Started

Installation:

Use npm to install the Novel package:

npm i novel

Usage:

Import the Editor component and embed it into your application:

import { Editor } from "novel";

export default function App() {
  return (
    <Editor />
  );
}

Learn More

For more detailed information, tutorials, and examples, please visit the project's GitHub repository (link omitted). We encourage you to star the project to show your support!

Comparisons

While Novel shares similarities with Notion in its WYSIWYG approach, it distinguishes itself through its AI-powered autocompletion and streamlined integration of various media types, such as tweets and mathematical expressions. Unlike other editors that may lack AI assistance or require complex integrations, Novel offers a unified and intelligent writing experience.