diff --git a/src/DateTimePicker.tsx b/src/DateTimePicker.tsx new file mode 100644 index 0000000..92ad4a2 --- /dev/null +++ b/src/DateTimePicker.tsx @@ -0,0 +1,84 @@ +import * as React from 'react'; + +class DateTimePicker extends React.Component { + state: { + date: string, + time: string, + }; + + props: { + value?: string, + dateOnly?: boolean, + onChange: (date: Date) => void; + }; + + constructor(props: any) { + super(props); + this.state = { + date: '', + time: '', + }; + + if (props.value) { + const str = props.value; + this.state.date = str.substr(0, 10); + this.state.time = str.substr(11, 5); + } + this.handleInputChange = this.handleInputChange.bind(this); + this.reportChange = this.reportChange.bind(this); + } + + handleInputChange(event: any) { + const name = event.target.name; + const value = event.target.value; + this.setState( + { + [name]: value + }, + () => this.reportChange(this.props) + ); + } + + componentWillReceiveProps(nextProps: any) { + if (this.props.dateOnly !== nextProps.dateOnly) { + this.reportChange(nextProps); + } + } + + reportChange(props: any) { + const { date, time } = this.state; + + if (date !== undefined) { + if (props.dateOnly) { + props.onChange(date); + } else if (time !== undefined) { + props.onChange(date + ' ' + time + ':00'); + } + } + } + + render() { + return ( + + + + {this.props.dateOnly || + } + + ); + } +} + +export default DateTimePicker;