TeaDateTimeInput

A date and time picker in the same react-native input component, based on @react-native-community/datetimepicker. It can be used as a datepicker, timepicker or both at the same time. It is customizable and can be styled to fit your project's design.

Installation

Install using npm:

npm install --save teadatetimeinput

Install using yarn:

yarn add teadatetimeinput

Usage

Requires react as a peer dependency, dependencies are moment.js and @react-native-community/datetimepicker.

import TeaDateTimeInput from 'teadatetimeinput';

or

const TeaDateTimePicker = require('teadatetimeinput');

Basic usage

import React, {useState} from 'react';
import TeaDateTimeInput from 'teadatetimeinput';

export const App = () => {
    return(
        <TeaDateTimePicker datetime="01/01/2022 00:00" />
    );
}

API

| Name | Type | Default | Description | | ------------ | ------- | ------- | ----------- | | datetime (required) | String | | Initial date and time | | formatDate (optional) | String | "DD/MM/YYYY" | Date format | | formatTime (optional) | String | "HH:mm" | Time format | | is24Hour (optional) | Bool | True | Should 24h format be used | | display (optional) | String | "spinner" | Defines the visual display of the picker | | showTextInput (optional) | Bool | True | Show the input field | | showPicker (optional) | Bool | False | Show the picker when the first time render the page | | inputWrapStyle (optional) | Object | {} | Styles to apply to input wrap component | | inputStyle (optional) | Object | {} | Additional styles which should be applied to the Input component | | dateTimePickerWrapStyle (optional) | Object | {} | Additional styles which should be applied to the DateTimePicker wrap component | | datePickerStyle (optional) | Object | {} | Additional styles which should be applied to the DatePicker component | | timePickerStyle (optional) | Object | {} | Additional styles which should be applied to the DateTime component |

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