Package Exports
- vb-react-phone-number
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (vb-react-phone-number) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
VBPhoneNumber
A React component for masking and formatting phone number.
Live Demo
Install
npm
VBPhoneNumber can be used on the server, or bundled for the client using an npm-compatible packaging system such as Browserify or webpack.
npm install vb-react-phone-number --saveBrowser bundle
The browser bundle exposes a global VBPhoneNumber variable and expects to find a global React (>= 0.14.0) variable to work with.
- vb-react-phone-number.js (development version)
- vb-react-phone-number.min.js (compressed production version)
Usage
var React = require('react')
var VBPhoneNumber = require('vb-react-phone-number')
var PhoneNumber = React.createClass({
onChange = (value) => {};
onInvalidChange = (value) => {};
onValidChange = (value) => {};
onFocus = (event) => {};
onBlur = (event) => {};
render () {
const { value } = this.props;
return (
<VBPhoneNumber {...custom}
value={value}
onChange={this.onChange}
onInvalidChange={this.onInvalidChange}
onValidChange={this.onValidChange}
onFocus={this.onFocus}
onBlur={this.onBlur}
onlyCountryCodes={['UA', 'US', 'RU', 'DE']}
favoriteCountryCodes={['US', 'UA', 'RU']}
errorMessage="Phone number is not valid" />
)
}
})Props
{
favoriteCountryCodes: PropTypes.arrayOf(PropTypes.string),
onlyCountryCodes: PropTypes.arrayOf(PropTypes.string),
value: PropTypes.string,
errorMessage: PropTypes.string,
onChange: PropTypes.func,
onValidChange: PropTypes.func,
onInvalidChange: PropTypes.func,
onFocus: PropTypes.func,
onBlur: PropTypes.func,
selectComponent: PropTypes.func
}