How to get component set from team library

Plugin and Widget API
1

Hi,
I trying to get the component set from our team component library. Currently need one specific component set. I have token and component set key. When a use https://www.figma.com/developers/api#get-component-sets-endpoint everything look good. I get json response. But when I use this codem, I don’t have any response or error. Nothing :frowning:

My code:

async function postData() {
// Default options are marked with *
const url = “https://api.figma.com/v1/component_sets/ea1fdf3f1f3edb9a47fcacXXXXXXXXXX”

const response = await fetch(url, {
method: “GET”,
headers: {
“Content-Type”: “application/json”,
“X-FIGMA-TOKEN”: “figd_ieTLw28Y9FATHrnPMCmwBtXXXXXXXXXXXXXXXX”
},
});
return response.json(); // parses JSON response into native JavaScript objects
console.log(response.json());
}
postData()

And second question, after I have a response (json) how do I create an instance of this component set?

Thanks a lot

T.

2

Your function ends on this line:

Just call console.log() before this line.

3

Thanks for your response:

I tried to do these changes:

async function postData() {
const url = “https://api.figma.com/v1/components/5cad03b3d7bca2dc0edcf3659ad1f5ace96bf648”

const response = await fetch(url, {
method: “GET”,
headers: {
“Content-Type”: “application/json”,
“X-FIGMA-TOKEN”: “figd_ieTLw28Y9FATHrnPMCmwBtc8XXXXXXXXXX”
},
});
console.log(response);
return response.json(); // parses JSON response into native JavaScript objects
}

But my response is still empty:

{headersObject: {…}, ok: true, redirected: false, status: 200, statusText: '', …}
headersObject:{cache-control: 'no-cache, no-store', content-length: '1056', content-type: 'application/json; charset=utf-8'}
ok:true
redirected:false
status: 200
statusText: ""
type:"cors"
url:"https://api.figma.com/v1/components/5cad03b3d7bca2dc0edcf3659ad1f5ace96bf648"
arrayBuffer:ƒ arrayBuffer()
arguments:null
caller:null
length:0
name:"arrayBuffer"
prototype:{constructor: ƒ}
[[FunctionLocation]]:VM2312:3
[[Prototype]]:ƒ ()
[[Scopes]]:Scopes[2]
json:ƒ json()
arguments:null
caller:null
length:0
name:"json"
prototype:{constructor: ƒ}
[[FunctionLocation]]:VM2314:3
[[Prototype]]:ƒ ()
[[Scopes]]:Scopes[2]
...

what I do wrong?

4

You did not call the json() method of the response object.

5

you mean call

console.log(response.json());

But in this case I get response

 Promise {}
   [[Prototype]]: Object
   catch: ƒ ()
   constructor: ƒ Promise()
   finally: ƒ ()
   then: ƒ then()
   [[Prototype]]: Object
6

Wait for the promise to complete.

7

Great, thanks.

And please last question. How can I create an instance of a component from this response?

8

Import the component by key and create an instance.

1 Like