- Suppress Autocomplete's own popup/clear indicators (forcePopupIcon,
clearIcon) so the search IconButton stays anchored in the same spot
across empty, draft, and chip states
- Search button is a primary-filled circle at default strength in every
state (no disabled dimming) — a clear affordance, handler already
guards for empty drafts
- Drop the brand-gold focus ring on the search bar; keep the default
neutral border on focus
- Drop the copper 2px focus outline on Filters and Sort (outline: none
under :focus-visible)
- Committed location chip now uses the default neutral tonal fill
instead of the promoted brand colour
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Sticky search now uses Autocomplete (multiple+freeSolo capped to 1)
instead of a plain TextField:
- Pin icon tightened to the left edge and to the placeholder
- Committed location renders inside the input as an FA Chip with an
X delete (clears the committed filter)
- Primary-coloured magnifying-glass IconButton on the right commits
the draft; disabled while the draft is empty
- Typing no longer filters live — Enter or the search button promotes
the draft to a chip, matching the chip mental model
The FilterPanel dialog's Location autocomplete already read from the
same searchQuery state, so it continues to display the committed chip.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- Sort button now reads "Sort: <value>" so it's distinguishable from
a filter; aria-label spells out the current sort. Price sort labels
dropped their internal colons (avoids double-colon rendering).
- Results count bolds the number in primary text so it registers as
the subject rather than incidental metadata.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Introduces a full Google-Maps-backed provider map for the arrangement
wizard's ProvidersStep. Clicking a pin morphs it into a MapPopup at
the same coord; pins within 70px of each other collapse into a cluster
(ceiling at zoom 13) that opens a ClusterPopup list on click. Row
clicks pan + zoom the map to the provider and open their MapPopup.
Map-background click routes through an exit transition that fades the
popup out before reappearing the pin, via a matching fade-in keyframe
on the atom markers.
Key additions:
- @vis.gl/react-google-maps + @googlemaps/markerclusterer deps
- ClusterMarker atom (count badge; verified / unverified palettes)
- ClusterPopup molecule (image-free rows; verified icon aligned to
name; right-aligned "From $X" column; verified-first sort)
- ProviderMap organism (APIProvider + Map + imperative AdvancedMarker
layer via createRoot for clusterer compatibility)
Component changes:
- MapPin: promoted verified palette (brand-700); name now required;
name-only and price-only variants dropped; active prop removed in
favour of organism-level state; SVG nub with fill+stroke replaces
the CSS border-triangle trick so the outline is continuous
- MapPopup: `exiting` prop drives close animation; click events stop
propagation so the map's onClick can't clear state mid-interaction
- ProviderData type gains optional `coords`; demo fixtures populated
with real NSW/QLD lat/lng for all 7 providers
- ProvidersStep demo route wires ProviderMap into the mapPanel slot
Memory:
- docs/memory/component-registry updated (ClusterMarker, ClusterPopup,
ProviderMap added; MapPin + MapPopup refined; MapCard retired)
- docs/memory/session-log captures arc across 2026-04-21/22 and flags
next-session work: ProvidersStep polish, mobile layout for list-map
WizardLayout, and demo deploy
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- Sort button: remove fontSize override so it inherits Button small size
- Results count: mt 2 → 3 for more breathing room below controls
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- View toggle: floating in top-left of map panel with shadow + paper bg
- Control bar: just Filters + Sort (consistent heights, no overflow)
- Results count: bumped mt from 1 to 2 for more breathing room
- Both ProvidersStep and VenueStep updated
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- All controls on one line: [List|Map] [Filters] [↕ Recommended]
- Sort: compact menu button replaces bulky TextField select
- View toggle: "List" / "Map" text labels alongside icons
- Results count: own line below controls
- Sort pushed right with ml:auto for visual separation
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
New control bar below search on both listing pages:
- Left: results count (passive)
- Right: sort select (Recommended/Nearest/Price), list/map toggle, filters
Sort: compact TextField select with 4 options, 0.813rem font.
View toggle: MUI ToggleButtonGroup with list/map icons, brand highlight.
Control bar wraps gracefully on narrow panels (flex-wrap).
New types: ProviderSortBy, VenueSortBy, ListViewMode.
Stories updated with interactive sort + view state.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Funeral type chips: wrap instead of horizontal scroll (stacks to 2 rows)
- Price slider: px 1 → 2.5 to accommodate MUI thumb radius (10px)
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Price slider: overflow hidden on container prevents horizontal scrollbar
- Funeral type chips: overflow hidden on parent prevents clipping through
- Location: chip-in-input using Autocomplete multiple+freeSolo (real estate
site pattern — chip with X sits inside the search field)
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Heading + subheading now scroll with listings (not sticky)
- Search bar + filters + results count remain sticky at top
- Subtle divider border on sticky section for visual segmentation
- Consistent pattern across both list-map pages
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Visual fixes:
- Sticky headers: add pt: 2 so scrolling content doesn't bleed
flush against the heading (ProvidersStep, VenueStep)
Accessibility:
- ProvidersStep: add role="list" to provider list container
(aria-label needs a semantic role to be announced)
- VenueStep: add aria-label to search TextField (placeholder
alone is not a reliable label for screen readers)
Token consistency:
- Map placeholders: var(--fa-color-sage-50) → var(--fa-color-surface-cool)
(use semantic token, not primitive) in ProvidersStep, VenueStep
- ArrangementDialog: var(--fa-color-brand-50) → var(--fa-color-surface-warm)
for package summary background
- ArrangementDialog: replace Box component="a" with Link atom
for terms and conditions (consistent focus/hover styling)
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
New molecule:
- FilterPanel: Popover-based reusable filter trigger with active
count badge, Clear all, Done actions. D-C: Popover for MVP.
Step integrations:
- ProvidersStep: inline Chip filter bar → FilterPanel Popover,
search bar + filter button side-by-side in sticky header
- VenueStep: same pattern, filter chips moved into Popover
- CoffinsStep (D-F): grid-sidebar layout → wide-form (full-width
4-col grid), category + price selects moved into FilterPanel
WizardLayout:
- Added wide-form variant (maxWidth lg, single column) for
card grids that benefit from full width
- wide-form included in STEPPER_VARIANTS for progress bar
Storybook:
- FilterPanel stories: Default, WithActiveFilters, SelectFilters,
CustomLabel
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- WizardLayout ListMapLayout: 420px fixed left column (D-B), flex:1
right panel, back link rendered inside left panel instead of above
the split (eliminates gap above map)
- LAYOUT_MAP type updated to accept backLink prop for list-map variant
- ProvidersStep: heading + search + filters wrapped in sticky Box
that pins at top of scrollable left panel while card list scrolls
- VenueStep: same sticky header treatment, heading moved inside form
for consistent wrapper structure
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- [P0] CrematoriumStep: Fix <option> → <MenuItem> in priority select
- [P1] All form steps: Add aria-busy={loading} + loading guard on submit
- [P1] Error messages: Replace color="error" (red) with copper
(var(--fa-color-text-brand)) across ProvidersStep, PackagesStep,
VenueStep, CrematoriumStep, CemeteryStep, CoffinsStep, PaymentStep
- [P2] IntroStep: "Has the person died?" → "Has this person passed away?"
- [P2] DateTimeStep: "About the person who died" → "who has passed"
- [P2] ProvidersStep: "Showing results from X" → "X providers found"
- [P2] Empty states: Add guidance text for ProvidersStep, PackagesStep,
VenueStep, CoffinsStep empty results
Steps 4, 13, 15 passed with no issues.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
