Security News
OpenJS: “XZ Utils Cyberattack Likely Not an Isolated Incident”
OpenJS is warning of social engineering takeovers targeting open source projects after receiving a credible attempt on the foundation.
text-mask-addons
Advanced tools
Weekly downloads
Readme
These addons are ready-to-use pipes and masks that can be used with Text Mask.
npm i text-mask-addons --save
These can be passed as a
mask
to Text Mask.
createNumberMask
createNumberMask
returns a numberMask
function that will format user input as currency.
createNumberMask
accepts an object with the following keys:
prefix
(string): what to display before the amount. Defaults to '$'
.suffix
(string): what to display after the amount. Defaults to empty string.includeThousandsSeparator
(boolean): whether or not to separate thousands. Defaults to to true
.thousandsSeparatorSymbol
(string): character with which to separate thousands. Default to ','
.allowDecimal
(boolean): whether or not to allow the user to enter a fraction with the amount. Default to false
.decimalSymbol
(string): character that will act as a decimal point. Defaults to '.'
decimalLimit
(number): how many digits to allow after the decimal. Defaults to 2
integerLimit
(number): limit the length of the integer number. Defaults to null
for unlimitedrequireDecimal
(boolean): whether or not to always include a decimal point and placeholder for decimal digits
after the integer. Defaults to false
.allowNegative
(boolean): whether or not to allow negative numbers. Defaults to false
allowLeadingZeroes
(boolean): whether or not to allow leading zeroes. Defaults to false
import createNumberMask from 'text-mask-addons/dist/createNumberMask'
// First, you need to create the `numberMask` with your desired configurations
const numberMask = createNumberMask({
prefix: '',
suffix: ' $' // This will put the dollar sign at the end, with a space.
})
// ...then pass `numberMask` to the Text Mask component as the mask
emailMask
emailMask
formats user input as an email address.
import emailMask from 'text-mask-addons/dist/emailMask'
// ...then pass `emailMask` to the Text Mask component as the mask
Technical side note: even though emailMask
is passed as a mask
, it is actually made of both a mask
and a pipe
bundled
together for convenience. The Text Mask component knows how to unwrap and separate the pipe
and mask
functions to use them.
These functions here can be passed as a
pipe
to Text Mask.
createAutoCorrectedDatePipe
The createAutoCorrectedDatePipe
returns a autoCorrectedDatePipe
, which can help the user in entering a date.
The createAutoCorrectedDatePipe
accepts a string specifying date format and an object with the following keys:
minYear
(number): the minimum year allowed in the date field mask
.maxYear
(number): the maximum year allowed in the date field mask
.For example, if the user enters a value
larger than 1
in the 1st slot of month, it appends 0
to it. That is 4
=> 04
. It does a similar thing for the
day slots.
It also blocks the user from entering invalid days or months such as 33/44
.
For createAutoCorrectedDatePipe
to work properly, the Text Mask component needs to be
configured with
keepCharPositions
set to true
.
import createAutoCorrectedDatePipe from 'text-mask-addons/dist/createAutoCorrectedDatePipe'
const autoCorrectedDatePipe = createAutoCorrectedDatePipe('mm/dd/yyyy HH:MM')
// As you can see in the line above, you can pass a string argument to `createAutoCorrectedDatePipe`
// to give it the order of day, month, year, hour and minute in your `mask`.
// ...now you can pass `autoCorrectedDatePipe` to the Text Mask component as the `pipe`
FAQs
Addons for Text Mask https://github.com/text-mask/text-mask
The npm package text-mask-addons receives a total of 187,421 weekly downloads. As such, text-mask-addons popularity was classified as popular.
We found that text-mask-addons demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 3 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
OpenJS is warning of social engineering takeovers targeting open source projects after receiving a credible attempt on the foundation.
Company News
Come meet the Socket team at BSidesSF and RSA! We're sponsoring several fun networking events and we would love to see you there.
Security News
OSI is starting a conversation aimed at removing the excuse of the SaaS loophole for companies navigating licensing and the complexities of doing business with open source.