skills.rest
vivekgoquest
vivekgoquestCOMMUNITY
Explore all skills by this author →
GitHub

tldraw-offline

Drive tldraw offline canvases and write embedded document scripts via its local HTTP API.

Updated Aug 22, 2026
Search Tags:#javascript#diagramming#canvas#tldraw#whiteboard#local api#document script
One-click install
npx skills add https://github.com/vivekgoquest/hermes-agent-stable --skill tldraw-offline-vivekgoquest
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tldraw-offline
Source: https://github.com/vivekgoquest/hermes-agent-stable/tree/main/optional-skills/creative/tldraw-offline
Command: npx skills add https://github.com/vivekgoquest/hermes-agent-stable --skill tldraw-offline-vivekgoquest

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @tldraw/tlschema, and includes scripts (resource) components.

What problem does it solve? Editing tldraw offline canvases by hand or simulating GUI clicks is slow and error-prone for an agent. This Skill lets you read, edit, and script the open canvas programmatically through the app's local HTTP API, and embed durable JavaScript behavior directly into .tldraw files. ## Core Features & Use Cases - Live canvas edits via /exec: Generate shapes, layouts, and diagrams by running JavaScript against the live editor over the local API with a bearer token from server.json. - Durable document scripts: Write script/main.js files that run on every load, adding reactive shapes, clickable buttons, and animation that survive save and reload. - Schema validation: Validate raw note, text, and frame shape records against the real tldraw SDK v5 schema offline with scripts/validate_shapes.mjs. - Use Case: A user has tldraw offline open and asks for an architecture diagram with interactive counter buttons; the agent finds the focused document, generates the shapes via /exec, and ships an idempotent document script that handles pointer_down clicks. ## Quick Start Ask the agent to read the open tldraw offline document and generate a labeled diagram of your system architecture on the canvas.

Frequently Asked Questions about tldraw-offline

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I edit a tldraw canvas programmatically with an agent?▼

Use the tldraw offline app's local HTTP API: read the port and bearer token from server.json in the app's config directory, find the focused document via /api/search, then POST JavaScript to /api/doc/:id/exec to create or update shapes with the live editor in scope.

How to add interactive buttons to a tldraw whiteboard?▼

Write a document script that creates button shapes tagged with meta.action, then listen for pointer_down events with editor.on('event') and hit-test the click point in page coordinates against button bounds. Store state in a shape's meta and render it as richText so it survives save.

Does tldraw offline work without an account or network?▼

Yes, local editing needs no account or network. The desktop app runs a local control API on localhost (default port 7236) and writes server.json with the port and token to its config directory on launch.

Why does my tldraw document script not run after saving?▼

The script only runs once the app's file watcher applies it; check /api/doc/:id/script-status for state 'applied'. On Linux, an exhausted fs.inotify.max_user_instances limit leaves the watcher in 'not-watching' state, which is a host limit rather than a script bug.

Why do tldraw API requests return 401 errors?▼

Each terminal call is a fresh shell, so an exported token does not persist and requests send an empty token. Re-read both port and token inline from server.json at the top of every shell call before making the request.

What are the limitations of tldraw document scripts?▼

Document scripts can only import tldraw, react, and react-dom, not arbitrary Node modules. They rerun on every load so they must be idempotent, and all listeners must be detached on the AbortSignal to avoid duplicate handlers.

Related Skills

Explore More Design & Creative Skills→
InverterNetworkInverterNetwork

tldraw-offline

Control tldraw offline via a local HTTP API for canvas manipulation and script injection.

Official
Advanced
mlamla123mlamla123

desktop-vision-pc

Capture Windows screenshots and simulate clicks and keystrokes via vision analysis.

Community
Intermediate
ThinkInAIXYZThinkInAIXYZ
6.3k

cua-driver

Automate native macOS apps via accessibility-tree snapshots and element-indexed actions.

Official
Advanced
cloudbro-kube-aicloudbro-kube-ai
14

slack-gif-creator

Create Slack-optimized animated GIFs from PIL-generated frames with color quantization.

Official
Advanced