Skip to main content

Version 1, Update 53

This release adds support for two new APIs:

  • figma.createNodeFromJSXAsync
  • ComponentNode.instances

figma.createNodeFromJSXAsync​

figma.createNodeFromJSXAsync lets you create nodes using the same JSX API that widgets use. This is a declarative, HTML-like API that should be more ergonomic when using the plugin API to create deeply nested node structures. Here is a quick example:

const { Image, AutoLayout } = figma.widget

const node = await figma.createNodeFromJSXAsync(
  <AutoLayout fill="#F00" padding={20}>
    <Image src="https://picsum.photos/200" width={200} height={200} />
  </AutoLayout>,
)

Note that using this API requires setting up your build system to compile JSX. You can learn more about this by following along with the documentation here.

ComponentNode.instances​

ComponentNode.instances returns a list of instance nodes in the file for a given main component node.