fix(a11y): add htmlFor/id label associations in login and token input forms\n\nCo-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -37,11 +37,13 @@ function RegistrationTokenErrorDialog({
|
||||
<Box direction="Column" gap="100">
|
||||
<Text size="H4">{title}</Text>
|
||||
<Text>{message}</Text>
|
||||
<Text as="label" size="L400" style={{ paddingTop: config.space.S400 }}>
|
||||
<Text as="label" htmlFor="retryTokenInput" size="L400" style={{ paddingTop: config.space.S400 }}>
|
||||
Registration Token
|
||||
</Text>
|
||||
<Input
|
||||
id="retryTokenInput"
|
||||
name="retryTokenInput"
|
||||
aria-label="Registration token"
|
||||
variant="Background"
|
||||
size="500"
|
||||
outlined
|
||||
|
||||
@@ -200,12 +200,13 @@ export function PasswordLoginForm({ defaultUsername, defaultEmail }: PasswordLog
|
||||
return (
|
||||
<Box as="form" onSubmit={handleSubmit} direction="Inherit" gap="400">
|
||||
<Box direction="Column" gap="100">
|
||||
<Text as="label" size="L400" priority="300">
|
||||
<Text as="label" htmlFor="usernameInput" size="L400" priority="300">
|
||||
Username
|
||||
</Text>
|
||||
<Input
|
||||
defaultValue={defaultUsername ?? defaultEmail}
|
||||
style={{ paddingRight: config.space.S300 }}
|
||||
id="usernameInput"
|
||||
name="usernameInput"
|
||||
aria-label="Username or email"
|
||||
variant="Background"
|
||||
@@ -226,10 +227,10 @@ export function PasswordLoginForm({ defaultUsername, defaultEmail }: PasswordLog
|
||||
)}
|
||||
</Box>
|
||||
<Box direction="Column" gap="100">
|
||||
<Text as="label" size="L400" priority="300">
|
||||
<Text as="label" htmlFor="passwordInput" size="L400" priority="300">
|
||||
Password
|
||||
</Text>
|
||||
<PasswordInput name="passwordInput" aria-label="Password" variant="Background" size="500" outlined required />
|
||||
<PasswordInput id="passwordInput" name="passwordInput" aria-label="Password" variant="Background" size="500" outlined required />
|
||||
<Box alignItems="Start" justifyContent="SpaceBetween" gap="200">
|
||||
{loginState.status === AsyncStatus.Error && (
|
||||
<>
|
||||
|
||||
Reference in New Issue
Block a user