CODEWITHSUNDEEP
typescriptfigmafigma-api
crowhill
crowhill

Reputation: 2558

Generated Figma plugin does not include TS typings

I'm trying to follow along with the plugin setup guide found here and I have a very, very simple plugin that looks like this:

figma.showUI(__html__);

// @ts-ignore
console.log(figma.currentPage.selection[0].cornerRadius);

Exactly as written, the plugin works fine and returns the border radius of the selected node.

However, if I remove // @ts-ignore TS complains: "Property 'cornerRadius' does not exist on type 'SceneNode'."

I have installed the typings, from here and my .tsconfig looks like this:

{
  "compilerOptions": {
  "target": "es6",
  "lib": ["es6", "dom"],
  "typeRoots": [
    "./node_modules/@types",
    "./node_modules/@figma"
  ]
}

}

What am I missing?

Upvotes: 0

Views: 763

Answers (1)

ckundo
ckundo

Reputation: 1569

figma.currentPage.selection returns a SceneNode array. SceneNode doesn't have the CornerMixin which defines cornerRadius. You'll need to check that the node type is supported.

i.e. look at the type field on SceneNode:

const selection = figma.currentPage.selection[0];
if (selection.type === "RECTANGLE") {
  console.log((selection as RectangleNode).cornerRadius);
}

The following types use CornerMixin, based on the typings plugin declaration file:

RectangleNode
EllipseNode
PolygonNode
StarNode
VectorNode
BooleanOperationNode

Upvotes: 1

Related Questions