Socket
Socket
Sign inDemoInstall

react-imask

Package Overview
Dependencies
10
Maintainers
1
Versions
93
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 0.0.1 to 0.1.0

dist/react-imask.js

36

package.json
{
"name": "react-imask",
"version": "0.0.1",
"version": "0.1.0",
"description": "React input mask",
"main": "index.js",
"main": "dist/react-imask.js",
"module": "src/index.js",
"scripts": {
"test": "npm run test"
"test": "npm run test",
"build": "rollup -c",
"prepublishOnly": "npm run build"
},

@@ -19,4 +22,29 @@ "repository": {

],
"files": [
"src",
"dist"
],
"author": "Alexey Kryazhev",
"license": "MIT"
"license": "MIT",
"dependencies": {
"imask": "latest",
"prop-types": "^15.6.0"
},
"peerDependencies": {
"react": ">=0.14.0"
},
"devDependencies": {
"babel-core": "^6.26.0",
"babel-plugin-external-helpers": "^6.22.0",
"babel-plugin-transform-object-assign": "^6.22.0",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-env": "^1.6.1",
"rollup": "^0.52.0",
"rollup-plugin-babel": "^3.0.2",
"rollup-plugin-eslint": "^4.0.0"
},
"engines": {
"npm": ">=4.0.0"
},
"homepage": "https://unmanner.github.io/imaskjs/"
}

@@ -1,4 +0,59 @@

# react-imask
React input mask
# React IMask Plugin
react-imask
## TODO
[![npm version](https://badge.fury.io/js/react-imask.svg)](https://badge.fury.io/js/react-imask)
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
## Install
`npm install react-imask`
## Mask input example
```javascript
import {IMaskInput} from 'react-imask';
<IMaskInput
mask=Number,
radix=".",
value="123", // possible to use `unmaskedValue`, but not both
onAccept={
// first argument is `value` or `unmaskedValue` depending on prop above
(value, mask) => console.log(value)
},
// ...and more mask props in a guide
// input props also available
placeholder='Enter number here'
/>
```
## Extend existing components
```javascript
import {IMaskMixin} from 'react-imask';
// extend style component
const StyledInput = styled.input`
color: paleviolet;
`;
const MaskedStyledInput = IMaskMixin(({inputRef, ...props}) => (
<StyledInput
...props,
innerRef={inputRef} // bind internal input
/>
));
<MaskedStyledInput
mask=Number,
radix=".",
onAccept={(value, mask) => console.log(value)},
// ...and more mask props in a guide
// ...other styled props
/>
```
More options see in a [guide](https://unmanner.github.io/imaskjs/guide.html).
## Many thanks to
[@Yordis Prieto](https://github.com/yordis)
[@Alexander Kiselev](https://github.com/MaaKut)
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc