figma_analyze_component_set
Analyze a Figma component set to extract variant axes, interaction-state mappings, visual diffs, component properties, and slots for generating code.
Instructions
Analyze a Figma COMPONENT_SET to extract variant state machine and cross-variant diffs for code generation. Returns: (1) variant axes (size, state) with all values, (2) CSS pseudo-class mappings for interaction states (hover→:hover, focus→:focus-visible, disabled→:disabled, error→[aria-invalid]), (3) visual diff from default state per variant (only changed properties — fill/stroke as token or hex, gradient, image and paint opacity, stroke weight, text color, opacity, effects, corner radius, size, child layers, visibility, the variant's own fill/stroke/opacity/radius (variantFill, variantStroke, variantOpacity, variantRadius), auto-layout (layout) and swapped spacing/size tokens (tokens), plus layers: changes to nested layers keyed by layer path such as 'Icons/Radio › Icon' — instance swaps, size, free position, rotation, vector shape, label text and typography), (4) component property definitions mapped to code props (BOOLEAN→boolean, TEXT→string, INSTANCE_SWAP→slot/ReactNode), and (5) slots — Figma SLOT properties (name, preferredValues = the components a slot accepts, and limitViolations) to implement as named slots / children props (React {children} or named ReactNode; Web Components ). Use this on the parent COMPONENT_SET node, not individual variants. Requires Desktop Bridge plugin.
Input Schema
| Name | Required | Description | Default |
|---|---|---|---|
| nodeId | Yes | COMPONENT_SET node ID (the parent of all variants, e.g., '214:274') |