1.0.0 • Published 6 months ago

native-datepicker-month-change v1.0.0

Weekly downloads
-
License
MIT
Repository
-
Last release
6 months ago

Installation

npm i @oman21/rn-datetimepicker

Usage

import DateTimePickerLib from '@oman21/rn-datetimepicker';

const App () => {
  const [visible, setVisible] = useState(false);
  const [date, setDate] = useState(new Date());

  return (
   <View style={{flex:1}}>
      <Text style={{margin: 15}}>{date.toString()}</Text>

      <Button
        onPress={()=>setVisible(!visible)}
        title="Open Datetime Picker"
      />

      <DateTimePickerLib
        value={date}
        visible={visible}
        onCancel={()=>setVisible(!visible)}
        onSelect={(data:any)=>{
          setDate(data);
          setVisible(!visible);
        }}
      />
   </View>
 )
}

Screenshots

screenshoot

Props

PropTypeDefaultDescription
visibleboleanfalseDatetime picker modal visible
minDateany""Set minimum date (Date or string).
maxDateany""Set maximum date (Date or string).
valueany""Set value (Date or string).
typestringdatetimeType datetime/date.
themestringlightLight/dark theme.
monthsarray"January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"Month name.
monthsShortarray"Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"Month short name.
weekDaysarray"Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"Day name.
weekDaysShortarray"Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"Day short name.

Function

PropDescription
onCancelAction when cancel.
onSelectAction when select return date.

To Do

  • Minimum date
  • Maximum date
  • Value
  • Type datetime/date
  • Typescript support
  • Hour am/pm

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Please make sure to update tests as appropriate.

License

MIT