npmpackage.info

Gathering detailed insights and metrics for @dietime/react-native-date-picker

@dietime/react-native-date-picker - 1.2.1 | npmpackage.info

@dietime/react-native-date-picker

React Native customizable date picker component for iOS and Android. Designed using ScrollView.

1.2.1

MIT

TypeScript

68.85 kB

1.7

Installations

npm install @dietime/react-native-date-picker

Developer Guide

BETA

Typescript

Yes

Module System

CommonJS

Node Version

18.17.1

NPM Version

9.6.7 Pull Requests

Open

0

Total

1

Closed

1

Issues

Open

3

Total

9

Closed

6

Releases

Unable to fetch releases

Languages

TypeScript

JavaScript

TypeScript (99.02%)

JavaScript (0.98%)

Developer

DieTime

Download Statistics

Total Downloads

Last Day

Last Week

Last Month

Last Year

GitHub Statistics

MIT License

61 Stars

31 Commits

14 Forks

1 Watchers

1 Branches

1 Contributors

Updated on Apr 22, 2025

Maintainers

View All 1 Contributors

Package Meta Information

Latest Version

1.2.1

Package Id

@dietime/react-native-date-picker@1.2.1

Unpacked Size

68.85 kB

Size

12.55 kB

File Count

NPM Version

9.6.7

Node Version

18.17.1

Published on

Aug 26, 2023

Total Downloads

Cumulative downloads

Total Downloads

NaN

Last Day

NaN

Compared to previous day

Last Week

NaN

Compared to previous week

Last Month

NaN

Compared to previous month

Last Year

NaN

Compared to previous year

Weekly Downloads

Monthly Downloads

Yearly Downloads

Peer Dependencies

expo-linear-gradient react react-native

Dev Dependencies

@babel/core @types/react @types/react-dom @types/react-native expo-linear-gradient react react-dom react-native react-native-builder-bob typescript

🎯 Try component at snack.expo.io

npm type definitions npm bundle size

React Native customizable date picker component for iOS and Android. Designed using ScrollView. Looks identical on all devices.

💻 Example

💬 Installation

Add dependencies to the project

1yarn add @dietime/react-native-date-picker
2
3npm install @dietime/react-native-date-picker --save

Install additional dependencies

1yarn add expo-linear-gradient
2
3npm install expo-linear-gradient --save

Then, import with ...

1import DatePicker from '@dietime/react-native-date-picker';

If you are not using Expo

You should also follow these additional installation instructions.

👩‍💻 Usage

Simple code example

1import React, {useState} from "react";
2import {Text, View} from "react-native";
3
4import DatePicker from "@dietime/react-native-date-picker";
5
6export default function App() {
7    const [date, setDate] = useState();
8
9    return (
10        <View>
11            <Text>{date ? date.toDateString() : "Select date..."}</Text>
12            <DatePicker
13                value={date}
14                onChange={(value) => setDate(value)}
15                format="yyyy-mm-dd"
16            />
17        </View>
18    );
19}

📚 Documentation

Prop	Required	Type	Description
value	✅	Date or null or undefined	Initial date for component
onChange	✅	(value: Date) : void	Callback on date change event
height	⛔	number	Custom component height
width	⛔	number or string	Custom component width such as `100` or `'50%'`
fontSize	⛔	number	Custom digits font size
textColor	⛔	string	Custom digits text color such as hex, rgb or rgba
endYear	⛔	number	Max year in component, default is current year
startYear	⛔	number	Min year in component, default is `endYear - 100`
markColor	⛔	string	Custom middle mark color such as `hex`, `rgb` or `rgba`
markHeight	⛔	number	Custom height of middle mark
markWidth	⛔	number or string	Custom width of middle mark such as `100` or `'50%'`
fadeColor	⛔	string	Custom color for top and bottom fade effect `only hex colors!`
format	⛔	string	Custom picker format like reshuffle of `yyyy`, `mm`, `dd`. Example: `'yyyy-mm-dd'` or `'dd-mm-yyyy'` and other

📂 Project Layout

example Simple project with date picker. It is presented on gif.
src Source code of date picker.
lib Shared packages.
- commonjs Package built as common js library.
- module Package built as module.
- typescript Built files for static typing.

📃 License

Source code is made available under the MIT license. Some dependencies may be licensed differently.

☕ Support

You can support me so that there will be more good open source projects in the future

No vulnerabilities found.

10

Binary-Artifacts

Determines if the project has generated executable (binary) artifacts in the source repository.

10

License

Determines if the project has defined a license.

0

Maintained

Determines if the project is "actively maintained".

0

Code-Review

Determines if the project requires human code review before pull requests (aka merge requests) are merged.

0

SAST

Determines if the project uses static code analysis.

0

CII-Best-Practices

Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.

0

Security-Policy

Determines if the project has published a security policy.

0

Fuzzing

Determines if the project uses fuzzing.

0

Branch-Protection

Determines if the default and release branches are protected with GitHub's branch protection settings.

0

Vulnerabilities

Determines if the project has open, known unfixed vulnerabilities.

Score

1.7

/10

Last Scanned on 2025-07-07

The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.

Learn More