Storybook Story Parsing
Stories are parsed and used as the source of truth for what the plugin renders in Figma.
How it works
The scanner reads your `.stories.tsx` files, extracts each named export, resolves its render function, and captures the decorator wrapper classes. The result is a `jsxTree` + `layoutClasses` pair per story that drives the exact Figma frame the plugin produces.
Usage
- 1
Write stories using the standard Storybook CSF format (named exports in `.stories.tsx`).
- 2
Each named story export becomes a separate Figma frame — 'Default', 'Variants', 'Sizes', etc.
- 3
Decorator wrapper classes (e.g. `flex gap-4 p-8`) are captured and applied to the outer Figma frame.
- 4
Stories with a `render` function are executed; stories with only `args` are merged with the component's default render.
- 5
The scanner does not require Storybook itself to be running — it reads the files statically.