Username
The username preset converts input into a URL-friendly slug in real time. It normalizes characters (e.g. Turkish characters to ASCII), converts spaces to hyphens, and allows only lowercase alphanumeric characters and hyphens.
Raw Value
Display Value
import { useViraMask } from '@virastack/input-mask';
import { useForm } from 'react-hook-form';
const form = useForm({ defaultValues: { username: '' } });
const { username } = useViraMask({
form,
schema: { username: 'username' },
});
<input {...username} placeholder="omer-gulcicek" />