Wwds Components

Figma has four property types, which can be inspected in the component definition’s componentPropertyDefinitions. To fully understand the component, its descendants must be traversed. Property types include:

• Variant
  • This is reflected as permutations of the component in a Component Set on the canvas. Each variant is explicitly visualized, including an redundant permutations (“Small + Primary + Disabled” may look the same as “Small Secondary Sisabled”). These permutations create different variants implicitly in Figma and it is handled through layer naming (Variant=Primary,Size=Small,State=Disabled).
• Text/String
  • Text properties are stored on the component parent, but can be mapped to Text node descendants.
  • node.componentPropertyReferences.characters on a descendant text node are how you determine where the text property is referenced (can be multiple, though unlikely).
• Boolean
  • Boolean properties are stored on the component parent, but can be mapped to any node descendant that can have its visibility toggled.
  • node.componentPropertyReferences.visible on a descendant node are how you determine where the boolean property is referenced.
• Instance Swap
  • Instance swap properties are stored on the component parent, but can be mapped to Instance node descendants.
  • node.componentPropertyReferences.mainComponent on a descendant instance node are how you determine where the instance property is referenced. A classic example of this is an icon property.

Descriptions

Components, component sets, and instances all inherit PublishableMixin, which includes a writable description string. Setting a description is important for any component intended to be used by others — it appears in Figma’s dev mode and component panel, and is surfaced in MCP context when reading component metadata.

Descriptions should explain the component’s intent and any non-obvious usage constraints. They are not a substitute for Code Connect annotations, but they are always visible without any tooling setup.

Variant components (children of a component set) also have a description field, but in practice the component set description is what users see. Set it on the component set, not on individual variant nodes.

To read descriptions when auditing:

Usage guidelines

• Creating components: What you must consider when creating new components.
• Using components: What you must consider when trying to use the right components.

Code patterns

For runnable code examples (creating, importing, discovering, inspecting components), see component-patterns.md.