25:["$","title",null,{"children":"Figma API Starter | Timothy Pesi | Observable"}] 49:[{"id":"8fc7e0cb5cf010affb31e84ccf54d80d3950639f7cf8eccbcf59699a81a8bc99d4b4ba659bfda2ebcf2965cb4d7f1016b1d51b6a4a2ccb175e9d9cc29e1d1b05","href":"https://static.observableusercontent.com/files/8fc7e0cb5cf010affb31e84ccf54d80d3950639f7cf8eccbcf59699a81a8bc99d4b4ba659bfda2ebcf2965cb4d7f1016b1d51b6a4a2ccb175e9d9cc29e1d1b05","name":"data@1.json","type":"application/json","lastModified":1676992060619.375,"size":24365},{"id":"33e708f48a393619c4de674f6ab6e56340a71aac894a584ab61ea748401386c843983626f7a4e51d16cf58badb63e6b0ee2c297995aff2a362495f965efaf385","href":"https://static.observableusercontent.com/files/33e708f48a393619c4de674f6ab6e56340a71aac894a584ab61ea748401386c843983626f7a4e51d16cf58badb63e6b0ee2c297995aff2a362495f965efaf385","name":"images@1.json","type":"application/json","lastModified":1676992060619.375,"size":3612}] 29:{"id":"6f76b6f09402fa49","slug":null,"title":"Figma API Starter","thumbnail":"549c6e57a818477f56f573e267752f9bb1292f7e2ee5bc303875d2fcb667b904","access_level":"public","create_time":"$D2023-02-21T15:07:40.619Z","update_time":"$D2023-02-21T15:07:40.619Z","view_time":null,"first_public_time":"$D2023-02-21T15:07:40.619Z","has_unpublished_edits":null,"fork":{"id":"68c17f880fc1f2de","slug":"figma-api-starter","title":"Figma API Starter","owner":{"id":"f35c755083683fe5","login":"observablehq","name":"Observable"}},"stars":0,"starred":false,"owner":{"type":"team","id":"82a33ba22321a181","login":"timo","name":"Timothy Pesi","avatar_url":"https://avatars-next.observableusercontent.com/cb07f403a2623f0fdc2cd88f9db20354f616965cf147e452ce2808594d91e4c7","tier":"starter_2024","bio":"","followed_by_you":false,"follows_you":false},"version":736,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"e98e3a6df163458d","login":"timo","name":"Timothy Pesi","avatar_url":"https://avatars-next.observableusercontent.com/cb07f403a2623f0fdc2cd88f9db20354f616965cf147e452ce2808594d91e4c7","tier":null,"bio":"","followed_by_you":false,"follows_you":false}],"members":[{"type":"individual","id":"e98e3a6df163458d","login":"timo","name":"Timothy Pesi","avatar_url":"https://avatars-next.observableusercontent.com/cb07f403a2623f0fdc2cd88f9db20354f616965cf147e452ce2808594d91e4c7","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Figma API Starter","cells":[{"id":56,"value":"# Figma API Starter\n

[Docs](https://www.figma.com/developers/api)

\n\n1. Create a [Figma access token](https://www.figma.com/developers/api#access-tokens) \n2. Save it in a [Secret](https://observablehq.com/settings/secrets) called `FIGMA_TOKEN`\n3. ${hasApiKey ? \"✅ Secret found\" : \"⚠️ Secret not found\"}","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":705,"value":"To fetch information about a document:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":510,"value":"url = \"https://www.figma.com/file/A3XoZhmJtENSXdh7EnEHbw/2x2-demo\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":104,"value":"data = hasApiKey\n ? figma(`/v1/files/${parseFigmaURL(url).fileId}`)\n : FileAttachment(\"data@1.json\").json() // cached version for demo","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":506,"value":"To get all image assets for that document:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":461,"value":"scale = 1 // between 0.01 and 4","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":463,"value":"format = \"svg\" // or \"png\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":618,"value":"

\n ${objects.map(obj => htl.html`

\n ${obj.id}\n

${obj.name}

`)}\n

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":643,"value":"// Skip the first because the overall document doesn't return an image\nobjects = flattenChildren(data.document).slice(1)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":396,"value":"images = hasApiKey\n ? (\n await figma(`/v1/images/${parseFigmaURL(url).fileId}`, {\n ids: objects.map((d) => d.id),\n scale,\n format\n })\n ).images\n : FileAttachment(\"images@1.json\").json() // cached version for demo","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":29,"value":"import {figma, hasApiKey, flattenChildren, parseFigmaURL} from \"@observablehq/figma-api-helpers\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":726,"value":"// For a notebook to access Secrets, it must statically reference one; this cell grants Secret access to the notebook from which we import the Figma API helpers. `undefined &&` prevents the Secret from appearing in plaintext in the Inspector.\nundefined && Secret(\"FIGMA_TOKEN\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W49","stdlib":"1"}} 24:null