Add FuneralFinder organism — hero search with stepped flow

Procedural stepped search widget for the homepage:
1. "I'm here to" — Arrange now / Pre-plan (radiogroup)
2. "I'm planning for" — Myself / Someone else (conditional, pre-plan only)
3. "Type of funeral" — dynamic Chip list from prop
4. Location — suburb or postcode input
5. CTA: "Find funeral directors" (disabled until complete)

Features:
- Progressive disclosure: steps unlock sequentially
- Brand checkmarks + edit icon on completed steps
- Click completed value to revert (only resets dependents)
- Step numbering adjusts when conditional step hidden
- Trust signal: "Free to use · No obligation"

Audit: 17/20 (Good). P1/P2 fixes applied:
- Location input aria-label for screen readers
- Option groups wrapped in role="radiogroup"
- Completed values have edit icon affordance
- Heading uses display font CSS variable
- CheckCircleIcon aria-hidden

5 stories: Default, FewerTypes, CustomHeading, InHeroDesktop, InHeroMobile

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-26 09:15:07 +11:00
parent 83e3809752
commit d7dddb0773
4 changed files with 705 additions and 0 deletions

View File

@@ -0,0 +1,6 @@
export {
FuneralFinder,
type FuneralFinderProps,
type FuneralTypeOption,
type FuneralSearchParams,
} from './FuneralFinder';