PageNode

The page node is always a descendent of the DocumentNode.

Page node properties

type

  • Readonly: true
  • Type: PAGE

The type of this node, represented by the string literal PAGE

clone

  • Type: clone(): PageNode

Create a clone of this page.

guides

  • Type: guides: ReadonlyArray<Guide>

The guides on this page.

selection

  • Type: selection: ReadonlyArray<SceneNode>

The selected nodes on this page.

backgrounds

  • Type: backgrounds: ReadonlyArray<Paint>

The background color of the canvas (currently only supports a single solid color paint).

prototypeBackgrounds

  • Type: prototypeBackgrounds: ReadonlyArray<Paint>

The background color of the prototype (currently only supports a single solid color paint).

prototypeStartNode

  • Readonly: true
  • Type: FrameNode | GroupNode | ComponentNode | InstanceNode | null

The starting point when launching a prototype.

Base node properties

id

  • Readonly: true
  • Type: string

The ID of current node.

parent

  • Readonly: true
  • Type: (BaseNode & ChildrenMixin) | null

Get the parent node of the current node.

index

  • Readonly: true
  • Type: number

Get the sequential index of the current node at the same level.

name

  • Type: string

The name of the layer that appears in the layers panel.

removed

  • Readonly: true
  • Type: boolean

Returns true if the node was removed. if the plugin stays open for a while and stores references to the node, you should defensively write code and check that the node has not been removed by the user.

toString

  • Type: string

Returns a string representation of the node.

remove

  • Type: remove():void

Removes this node and all of its children from the document.

setRelaunchData

  • Type: data: {[command: string]: string}): void

Sets state on the node to show a button and description when the node is selected.

getRelaunchData

  • Type: getRelaunchData(): { [command: string]: string }

Retreives the reluanch data stored on this node using setRelaunchData

getPluginData

  • Type: getPluginData(key: string): string

Retrieves custom information that was stored on this node or style. To get a value type other than a string, decode it first via JSON.parse.

setPluginData

  • Type: setPluginData(key: string, value: string): void

Lets you store custom information on any node or style, private to your plugin. If you want to store a value type other than a string, please encode it first via JSON.stringify.

getPluginDataKeys

  • Type: getPluginDataKeys(): string[]

Retrieves a list of all keys stored on this node or style.

getSharedPluginData

  • Type: getSharedPluginData(namespace: string, key: string): string

Get the shared data stored on a specific namespace.

setSharedPluginData

  • Type: setSharedPluginData(namespace: string, key: string, value: string): void

This allows you to store custom information on any node. You can retrieve it later by calling getSharedPluginData with the same namespace and key. To find all the data on a node stored in a specific namespace, use getSharpedPluginDataKeys.

Any data you write using this API can be read by any plug-in. The purpose is to allow plugins to interoperate with each other. If you do not want other plugins to be able to read your data, use setPluginData instead.

You must also provide the namespace parameter to avoid key conflicts with other plugins. This parameter is mandatory to prevent multiple plugins from using common key names (such as data) and overwriting each other. We recommend passing a value that identifies your plugin. This namespace can be provided to the authors of other plugins so that they can read data from your plugin.

namespace is a unique string used to identify your plugin and avoid key conflicts with other plugins. The namespace must contain at least 3 alphanumeric characters.

getSharedPluginDataKeys

  • Type: getSharedPluginDataKeys(namespace: string): string[]

Retrieves a list of all keys stored on this node or style using setSharedPluginData. This enables iterating through all data stored in a given namespace.

children

  • Readonly: true
  • Type: ReadonlyArray<SceneNode>
  • Type Declaration: SceneNode

The direct child of the current node.

childrenCount

  • Readonly: true
  • Type: number

Gets the number of direct children of the current node.

appendChild

  • Type: appendChild(child: SceneNode, preserveAbsolutePostion?: boolean): void

Adds the given node child as a direct child of the current node.

After appendChild, the relativeTransform of the child node is maintained by default. Due to changes in the parent layer of child, the position of the child node on the canvas may change; if you want to maintain the position of the child node, you can Set preserveAbsolutePostion to true.

insertChild

  • Type: insertChild(index: number, child: SceneNode, preserveAbsolutePostion?: boolean): void

Suppose a group has three children, A, B, and C. Now call the insertChild method to insert layer node D.

  • insertChild(0, D), the order of child nodes is: D, A, B, C.
  • insertChild(1, D), the order of child nodes is: A, D, B, C.
  • insertChild(2, D), the order of child nodes is: A, B, D, C.
  • insertChild(3, D), the order of child nodes is: A, B, C, D.

findChildren

  • Type: findChildren(callback?: (node: SceneNode) => boolean): SceneNode[]

Similar to findAll, except that findChildren will only look in the direct children of the current node (not the children of the children).

findChild

  • Type: findChild(callback: (node: SceneNode) => boolean): SceneNode | null

Similar to findOne, except that findChild will only look in the direct children of the current node (excluding children of children).

findAll

  • Type: findAll(callback?: (node: SceneNode) => boolean): SceneNode[]

Finds the entire subtree starting from the current node, calls the callback function for each node, and returns all nodes whose return value is true for the callback function.

findOne

  • Type: findOne(callback: (node: SceneNode) => boolean): SceneNode | null

Find the entire node tree starting from the current node, call the callback function for each node, and return the first node whose return value is true for the callback function.

findAllWithCriteria

  • Type: findAllWithCriteria<T extends NodeType[]>(criteria: {types: T;}): Array<{ type: T[number] } & SceneNode>
  • Type Declaration: NodeType

Searches the entire subtree (children of this node, children of its children, etc.). Returns all nodes that satisfy any of the types defined in the condition.