Update memory files — VenueCard, P2 fixes, ProviderCard audit

- component-registry: VenueCard → review status
- token-registry: Add venueCard tokens (3)
- session-log: Session 25n — VenueCard build, P2 fixes, ProviderCard audit

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-25 19:58:51 +11:00
parent 74a5469ba7
commit 7c9d71cc84
3 changed files with 62 additions and 4 deletions

View File

@@ -38,7 +38,7 @@ duplicates) and MUST update it after completing one.
|-----------|--------|-------------|-------|
| FormField | planned | Input + Typography (label) + Typography (helper) | Standard form field with label and validation |
| ProviderCard | review | Card + Typography + Badge + Tooltip | Provider listing card. Verified: image + logo (64px rounded rect) + "Verified" badge. Unverified: text-only with top accent bar. Capability badges with info icon + tooltip. Price split typography. No footer. 4 component tokens. |
| VenueCard | planned | Card + Typography + Badge | Venue listing card. Always has photo, location, capacity, price. Simpler than ProviderCard. |
| VenueCard | review | Card + Typography | Venue listing card. Always has photo + location + capacity ("X guests") + price ("From $X"). No verification tiers, no logo, no badges. 3 component tokens. Critique: 33/40. |
| MapCard | planned | Card + Typography + Badge | Compact horizontal map popup card. Deferred until map integration. |
| ServiceOption | planned | Card + Typography + Chip + Icon | Selectable service item |
| SearchBar | planned | Input + Icon + Button | Search with submit |

View File

@@ -577,6 +577,54 @@ Each entry follows this structure:
- **Planned (5 organisms):** ServiceSelector, PricingTable, ArrangementForm, Navigation, Footer
**Next steps:**
- Build VenueCard molecule (simpler — always has photo, location, capacity, price)
- Consider MapCard as a deferred item until map integration
- Address P2 audit issues in a future cleanup pass
- ~~Build VenueCard molecule~~ ✓ Done
- ~~Address P2 audit issues~~ ✓ Done
- ~~Audit ProviderCard v2~~ ✓ Done (17/20, P2s fixed)
### Session 2026-03-25n — VenueCard molecule, P2 fixes, ProviderCard audit
**Agent(s):** Claude Opus (via conversation)
**Work completed:**
- Reviewed Figma venue card design (node 2997:83018) — photo + name + location + capacity + price
- Created venueCard component tokens (`tokens/component/venueCard.json`): image.height (180px), content.padding (spacing.3), content.gap (spacing.1) — 3 tokens
- Built VenueCard molecule (`src/components/molecules/VenueCard/VenueCard.tsx`):
- Composes Card (interactive, padding="none") + Typography
- Hero image with `role="img"` + aria-label for screen readers
- Meta row: location (pin icon) + capacity with "guests" suffix for clarity
- Price with "From" qualifier (split typography like ProviderCard)
- No verification tiers, no logo, no badges — simpler than ProviderCard
- Created 6 Storybook stories: Default, ListLayout, EdgeCases, Responsive, OnDifferentBackgrounds, InteractiveDemo
- Ran /critique on VenueCard: 33/40 (Good). Applied P2 fixes before commit:
- Capacity: bare number → "X guests" for visible context
- Price: bare "$900" → "From $900" for transparency
- Image: added `role="img"` + `aria-label` for screen readers
- Fixed 6 P2 audit issues across atom components:
- Input: `Record<string, any>``Theme` type on boxShadow accessor
- Button: documented aria-label requirement for icon-only usage
- Badge: documented aria-label for icon-only badges
- Switch: strengthened a11y docs with FormControlLabel example
- Radio: strengthened a11y docs with RadioGroup + FormControlLabel example
- Chip: documented aria-label for icon-only deletable chips
- Ran /audit on ProviderCard v2: 17/20 (Good). Fixed 3 P2s:
- Hero image: added `role="img"` + `aria-label` for screen readers
- Logo shadow: hardcoded rgba → `var(--fa-shadow-sm)`
- Logo border: hardcoded white → `var(--fa-color-white)`
**Decisions made:**
- VenueCard follows same token structure as ProviderCard (image.height, content.padding, content.gap) for visual consistency in list views
- Capacity shows "X guests" suffix — bare number was confusing in critique
- Price shows "From $X" — matches ProviderCard's "Packages from" pattern for transparency
**Component status at end of session:**
- **Done (8):** Button, Typography, Input, Card, Badge, Chip, Switch, Radio
- **Review (2 molecules):** ProviderCard (v2, audit 17/20), VenueCard (critique 33/40)
- **Planned (6 atoms):** IconButton, Icon, Avatar, Divider, ColourToggle, Slider, Link
- **Planned (4 molecules):** MapCard, ServiceOption, SearchBar, StepIndicator, FormField
- **Planned (5 organisms):** ServiceSelector, PricingTable, ArrangementForm, Navigation, Footer
**Next steps:**
- User to review VenueCard in Storybook
- Build next molecule (ServiceOption — selectable card for arrangement items) or next atoms (IconButton, Avatar, Divider, Link)
- Consider MapCard as deferred until map integration
- Remaining P3s: InfoOutlinedIcon sizing in ProviderCard, image loading placeholder, accent bar 3px→4px

View File

@@ -276,3 +276,13 @@ the correct token for any design property.
| providerCard.logo.borderRadius | → borderRadius.md (8px) | ProviderCard | Rounded rectangle corners |
| providerCard.content.padding | → spacing.3 (12px) | ProviderCard | Content area padding |
| providerCard.content.gap | → spacing.1 (4px) | ProviderCard | Gap between content rows |
### VenueCard
`tokens/component/venueCard.json`
| Token path | Value / Reference | Used by | Description |
|-----------|-----------|---------|-------------|
| venueCard.image.height | 180px | VenueCard | Hero image fixed height — matches ProviderCard for list consistency |
| venueCard.content.padding | → spacing.3 (12px) | VenueCard | Content area padding |
| venueCard.content.gap | → spacing.1 (4px) | VenueCard | Gap between content rows |