Run 3: Composition Components

Implements Wave 2 — the four composition molecules that assemble foundation components (Run 2 outputs) into higher-order interaction surfaces.

Base branch: jmpicnic/item-image-upload-components (branched from main)
Parallelism: Tasks 3.1, 3.2, 3.3 are independent; 3.4 depends on 3.1. Parallel agents use separate worktrees and task branches, merging back to the base branch at the end of the wave.

Entry Criteria

Run 2 exit gate passed: lint, build-storybook, and test all exit 0 on the base branch.
Base branch jmpicnic/item-image-upload-components contains all Run 2 commits.

Artifact Specifications

3.1 — ImageHoverPreview

Property	Value
Type	Molecule
Location	`src/components/canary/molecules/image-hover-preview/`
Tests	6
Stories	4
Depends on	ImageDisplay (Run 2), popover primitive (Run 1)

Acceptance Criteria:

Configurable hover delay triggers popover open correctly.
Image load errors inside the popover are suppressed (no propagation to parent error boundary).

3.2 — ImageInspectorOverlay

Property	Value
Type	Molecule
Location	`src/components/canary/molecules/image-inspector-overlay/`
Tests	8
Stories	4
Depends on	Dialog atom (existing)

Acceptance Criteria:

Open, close, and edit-mode transition states all work correctly.
Keyboard dismiss (Escape) closes the overlay.

3.3 — ImageComparisonLayout

Property	Value
Type	Molecule
Location	`src/components/canary/molecules/image-comparison-layout/`
Tests	6
Stories	5
Depends on	ImageDisplay (Run 2), tabs primitive (Run 1)

Acceptance Criteria:

Desktop breakpoint renders side-by-side layout.
Mobile breakpoint renders tabbed layout.

3.4 — ImageFormField

Property	Value
Type	Molecule
Location	`src/components/canary/molecules/form/image/`
Tests	11
Stories	7
Depends on	ImageHoverPreview (3.1), ImageDisplay (Run 2), alert-dialog primitive (Run 1)

Acceptance Criteria:

Hover affordances delegate correctly to ImageHoverPreview.
Remove flow triggers alert-dialog confirmation before clearing the field.
Disabled state suppresses all interactions.

Task List

Task	Component	Tests	Stories	Status
3.1	ImageHoverPreview	6	4	Pending
3.2	ImageInspectorOverlay	8	4	Pending
3.3	ImageComparisonLayout	6	5	Pending
3.4	ImageFormField	11	7	Pending
Total		31	20

Internal Dependency Graph

Tasks 3.1, 3.2, and 3.3 are independent and may be implemented in parallel. Task 3.4 depends on Task 3.1 (ImageHoverPreview) and must begin only after 3.1 is complete and passing.

3.1 ImageHoverPreview      ─┐
3.2 ImageInspectorOverlay  ─┤─ (independent, parallel)
3.3 ImageComparisonLayout  ─┘
        │
        └─► 3.4 ImageFormField

Exit Criteria

All of the following must pass before Run 4 may begin:

npm run lint exits 0 (zero warnings).
npm run build-storybook exits 0.
npm run test exits 0.
31 new unit tests pass (cumulative count includes Run 1 and Run 2 tests).
20 new Storybook stories render without console errors.

Handoff

Artifacts produced by Run 3 and their consumers in Run 4:

Artifact	Consumed By (Run 4)
ImageHoverPreview	ImageCellDisplay (Task 4.1)
ImageComparisonLayout	ImageUploadDialog (Task 4.3)
ImageFormField	Barrel exports (Task 4.6)
ImageInspectorOverlay	Barrel exports (Task 4.6)