figma-analyze-component-setlisted

# figma-analyze-component-set — variant state machine → CSS Take a Figma `COMPONENT_SET` (the purple dashed container holding all the variants of one component) and turn it into a code-generation blueprint: which property axes are *state* vs *size*, how each state maps to a CSS pseudo-class or ARIA attribute, and the minimal visual delta each state applies on top of the default variant. This is the bridge between "Figma has 12 button variants" and "emit one `.btn` rule + `:hover`/`:disabled` overrides." ## Skill boundaries - **`use_figma` rules** — load the official **`figma-use`** skill first; it is the full Figma Plugin API reference. Essentials these scripts rely on: plain JS with top-level `await` + `return` (no IIFE, no `figma.closePlugin()`; `console.log` is not returned), inputs inlined as `const` at the top of each script, colors in 0–1 range, load fonts before any text op, `await figma.getNodeByIdAsync(...)`, and **atomic errors** (a failed script applies nothing — read the error, fix, retry). - **Full recursive tree** (unlimited depth, reactions, instance refs) → use `figma-deep-component`. - **Reorganizing variants into a labeled grid** → use `figma-arrange-component-set`. - **Adding/removing the properties themselves** → use `figma-component-properties`. - This is a **design-system code-gen capability** that the native MCP's `get_design_context` / `get_metadata` do **not** provide — they return raw structure, not a variant→CSS state machine. ## Workflow 1. *