[InDesign pipeline] React component generator (TSX output, Tailwind/CSS Modules, Storybook stories)

[PAMulligan]

Sub-issue of #62.

Summary

Take the InDesign IR (#63/#64) and the design tokens (#65) and emit the actual React artifacts: typed .tsx components, a barrel index.ts, optional Storybook stories, and the asset imports. This is the stage that turns the design into a finished, importable React package.

Details

• Generate one .tsx component per InDesign spread (or per logical section, configurable). Component names are derived from spread/page names with safe-identifier fallback.
• Map IR frames to JSX where possible: text frames → semantic tags (h1–h6, p, figcaption) inferred from paragraph-style role; image frames → <img> (or next/image when target is Next.js); multi-column layouts → CSS Grid or Flexbox with token-driven spacing.
• Explicit prop types for any extracted content (type SpreadOneProps = { heading?: string; body?: string; image?: string; }) so consumers can override content while keeping layout.
• Two styling modes (selected via Aurelius config):
  • Tailwind (preferred): generated JSX uses Tailwind classes that resolve via the preset from [InDesign pipeline] Style and design-token mapper (paragraph/character styles + swatches → tokens + Tailwind preset) #65.
  • CSS Modules fallback: each component ships a co-located .module.css that references the CSS variables from [InDesign pipeline] Style and design-token mapper (paragraph/character styles + swatches → tokens + Tailwind preset) #65.
• Stage assets to public/indesign/ (or framework-appropriate location) and emit correct relative imports.
• Auto-generate Storybook stories (*.stories.tsx) per component, populated with the extracted content as default args. Aligns with v2.0.0 Storybook auto-generation goal.
• Emit a generation report (indesign-pipeline-report.md) listing produced artifacts, unmapped frames, accessibility follow-ups (e.g., missing alt text), and TODOs.

Acceptance Criteria

• Running the generator end-to-end on the fixture .idml produces a directory of components that tsc --noEmit accepts and that renders in Storybook without runtime errors.
• Tailwind path: generated components compile against a fixture Tailwind config that includes the preset from [InDesign pipeline] Style and design-token mapper (paragraph/character styles + swatches → tokens + Tailwind preset) #65.
• CSS Modules path: generated components compile against a fixture Vite project using CSS Modules.
• At least one Storybook story exists per component, with extracted content as default args.
• Snapshot tests cover generated JSX for two fixture spreads (text-heavy and image-heavy).
• Generation report enumerates produced files, unmapped IR nodes, and accessibility TODOs.

Dependencies

• [InDesign pipeline] IDML parser and intermediate representation #63, [InDesign pipeline] PDF ingestion as primary input (designer-to-developer PDF handoff) #64 (IR sources)
• [InDesign pipeline] Style and design-token mapper (paragraph/character styles + swatches → tokens + Tailwind preset) #65 (design tokens, Tailwind preset)

Notes

Generated components must be deterministic given the same IR — reruns should not produce diff churn in unrelated files.