React-native-scrollable-time-date-picker NPM

react-native-scrollable-time-date-picker

An extension to react-native-scrollable-time-date-picker A scrollable date or time picker where you can set max date & time.

It's developer for personal usage, but if you can use it feel free.

The library is using https://github.com/rheng001/react-native-wheel-scrollview-picker(https://github.com/rheng001/react-native-wheel-scrollview-picker) as dependency.

Installation

yarn add react-native-scrollable-time-date-picker

Usage

import Picker from 'react-native-scrollable-time-date-picker';

export default function App() {
  const onConfirm = (date: string) => {
    console.log('from index', date);
  };

  return (
    <View>
      <Picker
        type={'time'}
        confirmText={'Confirm'}
        cancelText={'Deny'}
        maxTime={'13:13'}
        value={'13:13'}
        open={false}
        onConfirm={(text) => onConfirm(text)}
        image={require('../assets/time_gray.png')}
      />
      <Picker
        type={'date'}
        confirmText={'Confirm'}
        cancelText={'Deny'}
        maxDate={'19-09-2023'}
        value={'18-09-2022'}
        open={false}
        onConfirm={(text) => onConfirm(text)}
        image={require('../assets/date_gray.png')}
        language="da"
      />
    </View>
  );
}

Option	Value	Required	Default
onConfirm	(date: string) => void;	yes
type	'date' or 'time'	no	'date'
backgroundColor	string	no	'white'
highlightColor	string	no	'red'
itemTextColor	string	no	'grey'
textColor	string	no	'black'
confirmText	string	no	'Confirm'
cancelText	string	no	'Cancel'
minDate	string 'DD-MM-YYYY'	no
minTime	string 'HH:mm'	no
maxDate	string 'DD-MM-YYYY'	no
maxTime	string 'HH:mm'	no
open	boolean	no	false
value	string 'DD-MM-YYYY' or 'HH:mm'	yes
buttonStyle	StyleProp	no
buttonTextStyle	StyleProp	no
image	ImageSourcePropType	no
imageSize	number	no	25
language:	'da'/'de'/ 'en'/ 'fi'/'sv'/'no'	no	'en'