README.md

metadata

title: Document Editor Playground
emoji: 📝
colorFrom: indigo
colorTo: purple
sdk: static
app_file: index.html
pinned: false
license: gpl-3.0
short_description: Compare six open-source rich-text editors in one UI

Document Editor Playground

Compare six open-source authoring editors — TipTap, Toast UI Editor, Editor.js, Slate, Lexical, and CKEditor 5 — side by side in one consistent, full-page workspace. Type the same content into each, apply formatting, run diagnostics, and see how they differ.

Editors

Editor	What it is	Upstream
TipTap	Headless ProseMirror framework for deeply customized authoring UX	https://github.com/ueberdosis/tiptap
Toast UI Editor	Markdown + WYSIWYG editor with practical built-in formatting	https://github.com/nhn/tui.editor
Editor.js	Block-styled editor that stores content as structured blocks	https://github.com/codex-team/editor.js
Slate	Framework for custom rich-text editors with full schema control	https://github.com/ianstormtaylor/slate
Lexical	Extensible React editor framework from Meta	https://github.com/facebook/lexical
CKEditor 5	Production-ready rich-text editor framework	https://github.com/ckeditor/ckeditor5

Each editor has its own route (/tiptap/, /toast/, /codex/, /slate/, /lexical/, /ckeditor/) behind a shared shell providing navigation, a theme toggle, controls, diagnostics, and comments. / is the editor picker.

About this repository

This is the deployment repository for the Space. The application is developed in DocEditorPlayground and vendored into app/; UPSTREAM.json records exactly which upstream commit is deployed.

Do not edit files under app/ — it is a mirror, and edits are overwritten on the next sync. Change upstream, then re-sync. See DEPLOY.md.

How the Space runs

This is a Static Space: Hugging Face serves the files in this repository directly, with no container and no compute. The site is a Next.js static export (output: "export") built on a workstation by scripts/build-static.ps1 and committed here, so a push goes live immediately with no build wait and no cold start.

The generated files at the repository root (index.html, _next/, the route directories) are build output — see .space-build-manifest. The build inputs are app/ plus overlay/, a small set of static-only additions.

One difference from running it as a server

A static export has no Next.js API routes, so upstream's POST /api/ai-suggest does not exist here. overlay/public/ai-suggest-shim.js answers that request in the browser with the same contract the upstream stub implemented — validate, strip zero-width characters, uppercase — so TipTap's AI Suggest behaves exactly as it does locally.

That stub was never a real model. To make AI Suggest genuinely intelligent while staying on a free Static Space, replace the shim's suggest() with a transformers.js call and run a small model in the browser. A server-side LLM would instead mean hosting where Next.js can run, since a static page cannot hold an API key.

Local development

Build the exact site this Space serves:

.\scripts\build-static.ps1
python -m http.server 8000

Or run the vendored app as a normal dev server with Node 20:

cd app
npm ci
npm run dev     # http://localhost:3000

For real feature work use the upstream repo — it has the tests, lint config, and docs this deployment copy deliberately omits.

License

GPL-3.0-only, inherited from the upstream project. See app/LICENSE.