3.3.1 • Published 1 year ago
react-simple-timefield v3.3.1
react-simple-timefield
Simple React time input field, check out demo.
Installation
npm install --save react-simple-timefield
#for React <16 use: npm install --save react-simple-timefield@1
Usage
import TimeField from 'react-simple-timefield';
...
<TimeField
value={time} // {String} required, format '00:00' or '00:00:00'
onChange={(event, value) => {...}} // {Function} required
input={<MyCustomInputElement />} // {Element} default: <input type="text" />
inputRef={(ref) => {...}} // {Function} input's ref
colon=":" // {String} default: ":"
showSeconds // {Boolean} default: false
/>
Real world example
import TimeField from 'react-simple-timefield';
class App extends React.Component {
constructor(...args) {
super(...args);
this.state = {
time: '12:34'
};
this.onTimeChange = this.onTimeChange.bind(this);
}
onTimeChange(event, time) {
this.setState({time});
}
render() {
const {time} = this.state;
return (
<TimeField value={time} onChange={this.onTimeChange} />
);
}
}
Migrate version 2.x to version 3.x
There is a breaking change in version 3.
The onChange
callback property will be called with two arguments.
// Before:
<TimeField onChange={(value) => console.log(value)} />
// After:
<TimeField onChange={(event, value) => console.log(event, value)} />
Contributing
Run demo:
For running demo locally, replace:
import TimeField from '../';
// to
import TimeField from '../src';
in demo/index.tsx
file.
# run development mode
cd demo
npm install
npm install --only=dev
npm run dev
Build:
npm install
npm install --only=dev
npm test
npm run format
npm run build
License
MIT License. Free use and change.
3.3.1
1 year ago
3.3.0
1 year ago
3.2.5
3 years ago
3.2.4
3 years ago
3.2.3
4 years ago
3.2.1
4 years ago
3.2.0
4 years ago
3.1.0
4 years ago
3.0.0
5 years ago
2.0.3
5 years ago
2.0.2
5 years ago
2.0.1
5 years ago
2.0.0
6 years ago
1.3.2
7 years ago
1.3.1
7 years ago
1.3.0
7 years ago
1.2.0
7 years ago
1.1.0
7 years ago
1.0.2
7 years ago
1.0.1
7 years ago
1.0.0
7 years ago