react-time-input

1.1.1 • Public • Published

Contributor: Dima Bukhal - dimabuhal@gmail.com Collaborators: Dima Bukhal - dimabuhal@gmail.com, arthurvi (https://github.com/arthurvi, https://www.npmjs.com/~arthurvi)

If you want be contributors or collaborators - write me on dimabuhal@gmail.com with the theme 'react-time-input IMPORTANT'

What's in it?

A simple react component for select time in format HH:mm timeInput.jsx Its used webpack for building and es6 syntax

Demo page

Basic Usage

 npm install react-time-input --save

const TimeWrapper = () => {

   const onFocusHandler = (event) => {
       console.log("hello there you entered :  my name is ", event.target.name);
   }

   const onBlurHandler = (event) => {
       console.log("you left ");
   }

   const onTimeChangeHandler = (val) => {
       if (val.length === 5) {
           // do something with this value
       }
   }

   return (
       <TimeInput
           name="example"
           initTime='11:12'
           className='s-input -time'
           mountFocus='true'
           onTimeChange={onTimeChangeHandler}
           onFocusHandler={onFocusHandler}
           onBlurHandler={onBlurHandler}
       />
   );

}

function App() {
   return (
       <TimeWrapper/>
   );

}

ReactDOM.render(<App/>, document.querySelector("#myApp"));

To run

  • You'll need to have git and node installed in your system.
  • Fork and clone the project:
> $ git clone https://github.com/dima-bu/react-time-input.git

Then install the dependencies:

 npm install

You can simply run webpack example build using this command:

npm run example

Open in the web browser file ./example/index.html

Create build

npm run build

Please contribute to the project if you think this can be done better in any way even for this README :)

Package Sidebar

Install

npm i react-time-input

Weekly Downloads

5,762

Version

1.1.1

License

MIT

Unpacked Size

36.6 kB

Total Files

17

Last publish

Collaborators

  • dima-bu
  • arthurvi