Skip to content
This repository has been archived by the owner on Jul 9, 2020. It is now read-only.

react-maskedinput form element that works with react-bootstrap

License

Notifications You must be signed in to change notification settings

schneidmaster/react-bootstrap-maskedinput

Repository files navigation

Deprecated

Please see the deprecation notice.

react-bootstrap-maskedinput

react-maskedinput form element that works with react-bootstrap.

Versioning

  • For react-bootstrap < 0.29.0, use v0.1.0.
  • For react-bootstrap >= 0.29.0 and < 1.0, use v0.4.0.
  • For react-bootstrap >= 1.0, use v0.5.0.

Usage

  1. Install the package: npm install react-bootstrap-maskedinput --save or yarn add react-bootstrap-maskedinput
  2. Import the component: import MaskedFormControl from 'react-bootstrap-maskedinput'
  3. Use in your JSX -- the component accepts all the usuals from react-bootstrap's FormControl component plus react-maskedinput's MaskedInput component.

Simple example:

import MaskedFormControl from 'react-bootstrap-maskedinput'

export default class MyForm extends React.Component {
  render () {
    return (
      <FormGroup>
        <ControlLabel>Phone Number</ControlLabel>
        <MaskedFormControl type='text' name='phoneNumber' mask='111-111-1111' />
      </FormGroup>
    );
  }
}

Development

Prerequisites

  • git
  • npm
  • yarn (optional/recommended)

Setup

  1. Clone the repository (git clone git@github.com:schneidmaster/react-bootstrap-maskedinput.git)
  2. Install dependencies: npm install or yarn install

Testing

Run npm run example or yarn example and open http://localhost:8080. Make changes in src/index.js or try different setups in example/index.js.

Deployment

  1. Run npm run build or yarn build to build an ES5 version of the class.

Contributing

  1. Fork it ( https://github.com/schneidmaster/react-bootstrap-maskedinput/fork )
  2. Create your feature branch (git checkout -b my-new-feature)
  3. Commit your changes (git commit -am 'Add some feature')
  4. Push to the branch (git push origin my-new-feature)
  5. Create a new Pull Request

License

MIT