In Figma, the Node is the basis for representing layers. There are many different types of nodes, each with their own set of properties.
In the Typings File, each node type is represented with an interface. The most general
BaseNode is always one of those interfaces:
type BaseNode = DocumentNode | PageNode | SceneNode
Most often, you will work with nodes contained within a page, also referred to as "scene nodes".
type SceneNode = BooleanOperationNode | ComponentNode | ComponentSetNode | ConnectorNode | EllipseNode | FrameNode | GroupNode | InstanceNode | LineNode | PolygonNode | RectangleNode | ShapeWithTextNode | SliceNode | StampNode | StarNode | StickyNode | TextNode | VectorNode | WidgetNode
Each node has a type property that tells you the type of the node. The list of node types is declared in NodeType. You will typically use
node.type when examining a node.
type NodeType = "BOOLEAN_OPERATION" | "COMPONENT" | "COMPONENT_SET" | "CONNECTOR" | "DOCUMENT" | "ELLIPSE" | "FRAME" | "GROUP" | "INSTANCE" | "LINE" | "PAGE" | "POLYGON" | "RECTANGLE" | "SHAPE_WITH_TEXT" | "SLICE" | "STAMP" | "STAR" | "STICKY" | "TEXT" | "VECTOR" | "WIDGET"
In the Typings File, you will also find references to "mixin" interfaces. This is just a way to group related properties together. For example: pages, frames and groups can all have children, so they all have children-related properties such as
Our node properties can't be modeled using traditional object-oriented class hierarchy which is why we use the concept of mixins. The
ChildrenMixin define the properties that all nodes with children have (e.g. append, insert) and
PageNodes, etc all compose
ChildrenMixin. However, a
RectangleNode cannot have children and therefore does not inherit from