figma-arrange-component-setlisted

# figma-arrange-component-set — labeled variant grid Reorganize the variants inside a `COMPONENT_SET` into a tidy matrix: it parses each variant's properties (`Size=md, State=hover`), uses one property for columns and the rest for rows, centers each variant in a grid cell, and wraps everything in a white container frame with a title, left-edge row labels, and top column headers. The result is the kind of variant sheet you'd show in design-system docs. ## 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). - **Understanding what the variants mean** (state machine, CSS) → use `figma-analyze-component-set`. - This **writes a new layout** to the canvas — it is a design-system authoring capability the native MCP's `get_design_context` / `get_metadata` (read-only) do not cover. ## Workflow 1. **Identify the set.** Get the `COMPONENT_SET_ID` from selection, search, or a pasted id. (You can also leave the constant blank and select the set on the canvas — the script falls back to the current selection.) 2. **Pick the column axi