7618476b6022b6455345f5fe93d058d4ec5cbc77
- Replace jumpHandledRef boolean with lastHandledTargetRef so rapid preview clicks are tracked per-target and not swallowed by a stale global flag. - Wrap the Monaco editor in a ResizeObserver container and call editor.layout() before revealRangeInCenter so container resizes (sidebar, window) don't break scroll-to-target. - Harden tinymist/preview/scrollSource handler against missing or non-string filepath payloads.
typst-leaf 🍂
A completely self-hostable, high-performance editor for Typst, built on the philosophy of "Git as the Database."
Features:
- Instant Preview: Sub-50ms incremental compilation using
tinymist. - Live diagnostics & autocomplete from the Typst language server.
- Git Native: No hidden databases. Your projects are just folders.
- Hybrid: Run it in a browser, or as a native desktop app via Tauri.
📂 Repository Structure
typst-leaf/
├── typst-leaf-backend/ # Node.js/TS server (spawns tinymist, REST + WS)
├── typst-leaf-frontend/ # React + Monaco frontend (includes Tauri)
├── VISION.md # Project philosophy and architecture
└── AGENTS.md # Guidelines for AI coding assistants
Prerequisites
- Node.js 20+
- pnpm (10+)
- Rust (only required for the Tauri desktop wrapper)
tinymiston yourPATH— the Typst language server & preview engine:cargo install --git https://github.com/Myriad-Dreamin/tinymist --bin tinymist --locked tinymist-cli
🚀 Quick Start (Development)
# 1. Install workspace dependencies
pnpm install
# 2. Start the backend (port 4000)
pnpm --filter typst-leaf-backend dev
# 3. Start the web frontend (port 1420 — mandated by Tauri)
pnpm --filter typst-leaf-frontend dev
# 4. (Optional) Launch the Tauri desktop wrapper
pnpm --filter typst-leaf-frontend tauri dev
Then open http://localhost:1420 in your browser. A hello project is auto-seeded on first run.
Environment variables
| Var | Default | Description |
|---|---|---|
PROJECTS_ROOT |
<repo>/projects |
Directory under which project folders live. The backend refuses to read or write outside this root. |
TINYMIST_PREVIEW_HOST |
127.0.0.1 |
Host the tinymist preview server binds to. |
TINYMIST_PREVIEW_PORT |
23635 |
Port the tinymist preview server binds to. |
PORT (backend) |
4000 |
Backend HTTP/WS port. |
FRONTEND_ORIGIN (backend) |
http://localhost:1420 |
CORS origin allowed to call the REST API. |
🏗️ Architecture
- Editor: Monaco Editor
- LSP:
tinymistover a WebSocket thin proxy - Preview: Backend spawns
tinymist preview <file>on demand; the frontend iframes its webview for live SVG updates. - Data plane:
ws://localhost:4000/lsp→tinymist lsp(single active connection, takeover on reconnect)GET /api/projects,GET/PUT /api/projects/:p/file?path=…,POST /api/projects/:p/focus?path=…
Description
Languages
TypeScript
98.6%
Rust
0.5%
CSS
0.5%
HTML
0.4%