Import
tsx
import { PasswordInput, PasswordStrengthMeter, passwordStrength } from "@indoku/ui"Examples
Basic usage
tsx
function PasswordInputDemo() { const [pw, setPw] = useState("") return ( <Stack maxW="xs" gap="3"> <PasswordInput placeholder="Kata sandi" value={pw} onChange={(e) => setPw(e.target.value)} /> <PasswordStrengthMeter value={passwordStrength(pw)} /> </Stack> )}Props
PasswordInput
| Prop | Type | Default | Description |
|---|---|---|---|
visible | boolean | – | |
defaultVisible | boolean | – | |
onVisibleChange | (visible: boolean) => void | – | |
visibilityIcon | { on: React.ReactNode; off: React.ReactNode } | – | Custom icons for the toggle button. |
PasswordStrengthMeter
| Prop | Type | Default | Description |
|---|---|---|---|
value* | number | – | 0–4, usually from passwordStrength(). |
max | number | – |
* required. Style props and HTML attributes are accepted as well.
Created by @indokudev