# Figma branch

Figma-led **app** UI with `@chainlink/blocks`. If anything here conflicts with the parent `SKILL.md` **Figma** section or **§2**, follow the parent.

## Capture

Copy, hierarchy, layout intent, visible states. Figma MCP/assets when available. Do not treat layer names, autolayout labels, or tokens as Blocks props without **`.tsx`**.

## Resolve

1. **Code Connect** when present: first pass, family + skeleton; expect **placeholder / rough** JSX.
2. **MDX** `## When to use` per candidate; optional [chooser-table.md](chooser-table.md)—**MDX overrides table**.
3. **Storybook MCP** when connected (parent `SKILL.md`). **MDX + stories/MCP override Code Connect** when they disagree on abstraction or composition.
4. Lock in **`../../src/components/<Name>/<Name>.tsx`**; align with **`.stories.tsx`**.

`*.figma.tsx` authoring → **`blocks-figma-connect`**.

## Implement

`@chainlink/blocks` imports; Figma → content/structure; stories + `.tsx` → truth; app → routing, state, data.