Checkbox atom: new FA wrapper with brand theming

- New Checkbox atom wrapping MUI Checkbox (forwardRef, displayName)
- MuiCheckbox theme overrides: warm gold checked, focus ring, disabled muted
- Stories: Default, States, TermsAgreement, Checklist
- PaymentStep: now imports Checkbox from atom instead of MUI directly

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-30 18:27:21 +11:00
parent b5a56b6497
commit b454911314
5 changed files with 208 additions and 1 deletions

View File

@@ -783,6 +783,32 @@ export const theme = createTheme({
},
},
},
MuiCheckbox: {
styleOverrides: {
root: {
color: t.ColorNeutral400,
transition: 'color 150ms ease-in-out',
'&:hover': {
color: t.ColorNeutral600,
backgroundColor: 'transparent',
},
'&.Mui-checked': {
color: t.ColorInteractiveDefault,
'&:hover': {
color: t.ColorInteractiveHover,
},
},
'&:focus-visible': {
outline: `2px solid ${t.ColorInteractiveFocus}`,
outlineOffset: '2px',
borderRadius: '4px',
},
'&.Mui-disabled': {
color: t.ColorNeutral300,
},
},
},
},
MuiRadio: {
styleOverrides: {
root: {