| 1 |
import { withState } from '@wordpress/compose'; |
| 2 |
import { Button, Popover, DateTimePicker } from '@wordpress/components'; |
| 3 |
|
| 4 |
const GutenifyDatePicker = withState({ |
| 5 |
isVisible: false, |
| 6 |
})(({ isVisible, setState, onChange, dateTime, content }) => { |
| 7 |
const toggleVisible = () => { |
| 8 |
setState((state) => ({ isVisible: !state.isVisible })); |
| 9 |
}; |
| 10 |
return ( |
| 11 |
<> |
| 12 |
<Button isDefault onClick={toggleVisible} isLink={true}> |
| 13 |
{content} |
| 14 |
{isVisible && ( |
| 15 |
<Popover position="bottom left" onFocusOutside={(e) => console.log(e) |
| 16 |
}> |
| 17 |
<DateTimePicker |
| 18 |
currentDate={dateTime} |
| 19 |
onChange={onChange} /> |
| 20 |
</Popover> |
| 21 |
)} |
| 22 |
</Button> |
| 23 |
</> |
| 24 |
); |
| 25 |
}); |
| 26 |
|
| 27 |
export default GutenifyDatePicker; |
