React Inputs X
An awesome react input component.
Demo
https://dnkodi.github.io/react-inputs-x/
Installation
$ npm install react-inputs-x --save
After this you can import react-inputs-x and its styles in your application as follows:
; //Include styles at your root and make sure you have necessary loaders to handle css;
Usage
;; Component state = age: "" currency: "" firstname: "" password: "" this { const firstname age currency password = thisstate; return <div> <h3>Text Input</h3> <Input label="First Name" onChange=this placeholder="Enter first name" required value=firstname width="200px" /> <h3>Number Input</h3> <InputNumber id="age" label="Age (required)" max=1000 min=0 onChange=this pattern=/^0-904$/ placeholder="Age" required value=age width="200px" /> <h3>Number Input — With Buttons</h3> <InputNumber buttons id="currencyInput" label="Currency (required)" max=1000 min=-2 onChange=this pattern=/^\-?\d*\?\d02$/} required value=currency width="200px" /> <h3>Password Input</h3> <InputPassword label="Password" onChange=this placeholder="Enter password" value=password width="200px" /> </div> ); }}
Development
$ git clone https://github.com/dnkodi/react-inputs-x.git$ npm install
Start the dev server
$ npm start
Defaults to port 8080
.
License
MIT Licensed. Copyright (c) Duleep Kodithuwakku 2019.