mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-15 18:31:06 +00:00
25 lines
641 B
Svelte
25 lines
641 B
Svelte
<script>
|
|
import {
|
|
FluidForm,
|
|
TextInput,
|
|
PasswordInput,
|
|
} from "carbon-components-svelte";
|
|
|
|
let password = "";
|
|
let invalid = false;
|
|
|
|
$: invalid = !/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[a-zA-Z\d]{6,}$/.test(password);
|
|
</script>
|
|
|
|
<FluidForm>
|
|
<TextInput labelText="User name" placeholder="Enter user name..." required />
|
|
<PasswordInput
|
|
bind:value={password}
|
|
{invalid}
|
|
invalidText="Your password must be at least 6 characters as well as contain at least one uppercase, one lowercase, and one number."
|
|
required
|
|
type="password"
|
|
labelText="Password"
|
|
placeholder="Enter password..."
|
|
/>
|
|
</FluidForm>
|