Introduction
A lightweight input formatting library that works in sync with React Hook Form.
It provides a single useViraMask() hook for card numbers, phone, IBAN, currency, and custom masks. While the form state holds raw (unmasked) values, the input shows a formatted display.
Getting started
Install the package. For live mask examples, see the examples page.
$ pnpm add @virastack/maskPeer dependencies
react≥ 18.2react-dom≥ 18.2react-hook-form≥ 7
Also selectable during ViraStack Start CLI setup.
Why ViraStack Mask?
- Lightweight: zero runtime dependencies; React and React Hook Form as peers.
- RHF-first: integrates with register / setValue; display and raw values are separate.
- Type-safe: field names in the schema match TypeScript types.
- Smart presets: card (Visa, Mastercard, Amex, Troy), CVV, TCKN, IBAN, currency, and more.
Scope
This documentation covers the full package surface:
- useViraMask() and the schema model
- Custom mask syntax and
resolveMask - Validation and helpers
- Types reference
- Examples for every preset