Input mask API · Needless UI

Import

import-mask.ts

import { nuiCardMask, nuiIbanMask, NuiMask } from '@needless-ui/angular/mask';

A mask on a native text field.

NuiMask: Properties
Name	Type	Default	Description
`nuiMask`Input	`string \| ((raw: string) => string)`		The mask, or a function that picks one for the data typed.
`tokens`Input	`Record<string, NuiMaskToken>`		Mask characters to add or replace.
`unmask`Input	`boolean`	`false`	The value is only the data, without the literals.
`value`Two-way	`string`	`''`	The value: what’s shown, or the data with `unmask`.
`raw`Property	`Signal<string>`		The data typed, without the literals.
`complete`Property	`Signal<boolean>`		Every place in the mask is filled.

Functions to format, check and build masks.

Helpers: Properties
Name	Type	Description
`nuiMaskFormat, nuiUnmask`Method	`(value, mask) => string`	Format a value with a mask, or read the data out of one.
`nuiCardMask`Method	`(raw: string) => string`	A mask for card numbers, grouped as their brand prints them.
`nuiCardBrand`Method	`(number: string) => NuiCardBrand \| null`	The brand of a card number, from its first digits.
`nuiCardValid, nuiLuhn`Method	`(number: string) => boolean`	Whether a card number has its brand’s length and passes the Luhn check.
`nuiIbanMask`Method	`(raw: string) => string`	A mask for IBANs, as long as the country’s.
`nuiIbanValid`Method	`(iban: string) => boolean`	Whether an IBAN has its country’s length and the right check digits.