Skip to main content
Question

How to get component set from team library


Tomas_Bana

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 😦

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.

7 replies

tank666
  • 4859 replies
  • January 22, 2024

Your function ends on this line:

figma.com

Tomas_Bana
  • Author
  • 7 replies
  • January 22, 2024

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?


tank666
  • 4859 replies
  • January 22, 2024

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


Tomas_Bana
  • Author
  • 7 replies
  • January 22, 2024

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

tank666
  • 4859 replies
  • January 22, 2024

Wait for the promise to complete.

MDN Web Docs

Tomas_Bana
  • Author
  • 7 replies
  • January 22, 2024

Great, thanks.

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


tank666
  • 4859 replies
  • January 22, 2024

Import the component by key and create an instance.


Reply


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings