@todoforai/figma-api 1.0.0 → 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/AGENTS.md +86 -0
- package/package.json +17 -3
package/AGENTS.md
ADDED
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
# AGENTS.md — figma-api setup for AI agents
|
|
2
|
+
|
|
3
|
+
Read this before using `figma-api`. It tells you exactly what to set up.
|
|
4
|
+
|
|
5
|
+
## TL;DR decision
|
|
6
|
+
|
|
7
|
+
- Need to **read** designs, or **write** comments / dev-resources / webhooks?
|
|
8
|
+
→ REST is enough. Just set a token (step 1). Works headless / in CI.
|
|
9
|
+
- Need to **create canvas nodes** (frames, text, shapes) or **edit variables**
|
|
10
|
+
off-Enterprise? → REST can't. Use the **plugin bridge** (step 2). Requires the
|
|
11
|
+
Figma desktop app open.
|
|
12
|
+
|
|
13
|
+
## 1. Auth (always required)
|
|
14
|
+
|
|
15
|
+
```bash
|
|
16
|
+
figma-api auth <token> # saved to ~/.config/figma-api/credentials.json
|
|
17
|
+
# or, no save:
|
|
18
|
+
FIGMA_TOKEN=<token> figma-api me
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
- Token = Figma Personal Access Token (`figd_…`), from https://www.figma.com/settings → Personal access tokens.
|
|
22
|
+
- Scopes: reads need `file_content:read`. Writes need the matching scope
|
|
23
|
+
(`file_comments:write`, `file_dev_resources:write`, `webhooks:write`).
|
|
24
|
+
`file_variables:*` is **Enterprise-only** → REST `variables-modify` returns 403
|
|
25
|
+
on non-Enterprise; use the bridge instead.
|
|
26
|
+
- Verify: `figma-api me` should print your user JSON. If you have a stored token
|
|
27
|
+
in a secret vault, fetch it from there rather than asking the user.
|
|
28
|
+
- File commands accept a raw file key **or** a Figma URL; `node-id` is parsed from
|
|
29
|
+
the URL automatically.
|
|
30
|
+
|
|
31
|
+
## 2. Plugin bridge (only for canvas writes / variables off-Enterprise)
|
|
32
|
+
|
|
33
|
+
The Figma REST API has **no endpoint** to create canvas nodes. The Figma Plugin
|
|
34
|
+
API does. The bridge lets the CLI drive a companion plugin:
|
|
35
|
+
|
|
36
|
+
```
|
|
37
|
+
figma-api run '<code>' ──POST──▶ relay ◀──poll── Figma plugin → runs on canvas
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
Setup (do all three, in order):
|
|
41
|
+
|
|
42
|
+
1. **Start the relay** (keep it running, background it):
|
|
43
|
+
```bash
|
|
44
|
+
figma-api bridge # listens on http://localhost:8917
|
|
45
|
+
```
|
|
46
|
+
2. **Load the plugin** — this is a human step, you cannot automate it:
|
|
47
|
+
In the **Figma desktop app** (browser can't import dev plugins):
|
|
48
|
+
Plugins → Development → Import plugin from manifest → pick this package's
|
|
49
|
+
`plugin/manifest.json`. Run it, paste the relay URL, click **Connect**.
|
|
50
|
+
3. **Drive it**:
|
|
51
|
+
```bash
|
|
52
|
+
figma-api ping # round-trip check; prints page + selection
|
|
53
|
+
figma-api run 'const t=figma.createText(); await figma.loadFontAsync({family:"Inter",style:"Regular"}); t.characters="Hi"; figma.currentPage.appendChild(t); return t'
|
|
54
|
+
figma-api run @script.js # or load code from a file
|
|
55
|
+
```
|
|
56
|
+
|
|
57
|
+
`run` executes arbitrary Plugin API code (`figma` in scope, `await` + `return`
|
|
58
|
+
supported; returned nodes come back as `{id,type,name}`). It subsumes any
|
|
59
|
+
draw/create helper — prefer it over inventing new commands.
|
|
60
|
+
|
|
61
|
+
Cross-machine (CLI and Figma on different hosts): expose the relay publicly with
|
|
62
|
+
`cloudflared tunnel --url http://localhost:8917` and paste that https URL into
|
|
63
|
+
the plugin instead of localhost.
|
|
64
|
+
|
|
65
|
+
## Gotchas an agent will hit
|
|
66
|
+
|
|
67
|
+
- **REST `variables-modify` → 403** on non-Enterprise tokens. Don't retry; switch
|
|
68
|
+
to `figma-api run` with `figma.variables.*`.
|
|
69
|
+
- **"create a frame/text/shape via REST"** is impossible — there is no endpoint.
|
|
70
|
+
Use the bridge.
|
|
71
|
+
- **Browser-only Figma can't load the dev plugin.** Needs the desktop app, or a
|
|
72
|
+
published plugin. If the user is browser-only and refuses desktop, canvas
|
|
73
|
+
writes are not available — say so plainly.
|
|
74
|
+
- **`figma-api run` / the relay have no auth** and execute arbitrary code in the
|
|
75
|
+
user's document. Only run on a trusted machine; don't expose the tunnel URL
|
|
76
|
+
publicly; don't run untrusted code.
|
|
77
|
+
- The bridge handles **one command at a time, one connected plugin**. Don't fan
|
|
78
|
+
out parallel `run` calls.
|
|
79
|
+
- The CLI exits non-zero on plugin error/timeout — check exit codes.
|
|
80
|
+
|
|
81
|
+
## Quick reference
|
|
82
|
+
|
|
83
|
+
`figma-api --help` lists every command; `figma-api <cmd> --help` has params,
|
|
84
|
+
scopes and examples. Read = me/file/nodes/images/comments/components/styles/
|
|
85
|
+
variables-*/dev-resources/webhooks/… Write (REST) = comment-add/reaction-add/
|
|
86
|
+
variables-modify/dev-resource-*/webhook-*. Canvas write = bridge + run.
|
package/package.json
CHANGED
|
@@ -1,13 +1,27 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@todoforai/figma-api",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.1",
|
|
4
4
|
"description": "Figma CLI — full REST API wrapper (files, comments, variables, webhooks…) plus a plugin bridge for canvas writes.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"bin": {
|
|
7
7
|
"figma-api": "src/index.ts"
|
|
8
8
|
},
|
|
9
|
-
"files": [
|
|
10
|
-
|
|
9
|
+
"files": [
|
|
10
|
+
"src",
|
|
11
|
+
"plugin",
|
|
12
|
+
"README.md",
|
|
13
|
+
"AGENTS.md",
|
|
14
|
+
"LICENSE"
|
|
15
|
+
],
|
|
16
|
+
"keywords": [
|
|
17
|
+
"figma",
|
|
18
|
+
"figma-api",
|
|
19
|
+
"cli",
|
|
20
|
+
"rest",
|
|
21
|
+
"design",
|
|
22
|
+
"plugin",
|
|
23
|
+
"mcp"
|
|
24
|
+
],
|
|
11
25
|
"repository": {
|
|
12
26
|
"type": "git",
|
|
13
27
|
"url": "git+https://github.com/todoforai/figma-api.git"
|