<Periodic>
– 🕐🕑🕒📆 Form inputs for periodic or recurring times – daily, weekly, or monthly at a chosen time
UI
A segmented control for daily, weekly, or monthly. Weekdays are multi-select, day of month is a Picker
, and time is a DatePickerIOS
(the only iOS component - if you want an Android version, let me know). If you need anything to be more customizable, send me a PR!
Demo
git clone git@github.com:lorensr/react-native-periodic.gitcd react-native-periodicnpm inpm run storybook
open http://localhost:7007/react-native run-ios
Select an example in the browser and see the demo in the simulator. You may need to refresh to get them started.
Here are some screenshots from the demo:
Daily
Weekly
Monthly
Usage
<Periodic ="periodic" = = /><Button => Submit</Button>
Only the time part of state.date
is used. If state.period
is 'Daily'
, only state.date
is used. If it's 'Weekly'
, state.date
and state.weekdays
are used. If it's 'Monthly'
, state.date
and state.dayOfMonth
is used.
Props are optional:
segmentedControl: PropTypesobjectinitialState: PropTypesshape period: PropTypesstring date: PropTypes weekdays: PropTypes dayOfMonth: PropTypesstring
segmentedControl
is passed to the SegmentedControls
component as props.
Credits
- Contributions by these fine folks
- Segmented control component from
react-native-radio-buttons
- Multiple choice component from
react-native-multiple-choice