0.1.4 • Published 2 months ago
react-simple-datepicker-calendar v0.1.4
Simple DatePicker Calendar for React
Overview
Simple Datepicker is a date picker component for React. Select dates easily and customize the color scheme to fit your design needs. It will continually evolving to offer a variety of designs.
Features
- ☝️ Select any date.
- 🔢 Input a date manually.
- 👀 Browse previous or future months in current month.
- 🚚 Navigate quickly to a specific date.
- ☀️ Distinguish today's date from the selected date.
Installation
To install the Simple DatePicker Calendar in your React project, use the following command:
npm install react-simple-datepicker-calendar
Usage
import React from 'react';
import { Calendar } from 'react-simple-datepicker-calendar';
function App() {
return (
<Calendar
calendarBackgroundColor="#252525"
displayBackgroundColor="#252525"
displayFontColor="#c5c5c5"
dayFontColor="#899797"
currentDateFontColor="#d5d5d5"
prevNextDateFontColor="#899797"
/>
);
}Props
| Prop Name | Type | Description | Default |
|---|---|---|---|
| calendarBackgroundColor | string | Background color of the entire calendar component. | '#252525' |
| displayBackgroundColor | string | Background color for the display area (e.g., month and year display). | '#252525' |
| displayFontColor | string | Font color for the display area, such as the selected date and year-month header. | '#c5c5c5' |
| dayFontColor | string | Font color for the day names (e.g., Sun, Mon) in the calendar. | '#899797' |
| currentDateFontColor | string | Font color for the current date in the calendar. | '#d5d5d5' |
| prevNextDateFontColor | string | Font color for the dates of the previous and next month. | '#899797' |
Planned Updates
Enhance Customization: Further customization options are in development. You'll soon be able to tailor the calendar to your preferences, including date format, language, start day, and more.
License
Simple DatePicker Calendar is open-source, licensed under the MIT License.
Contact
For inquiries or suggestions, feel free to submit Github Issue. Your feedback is invaluable. Thank you for using Simple DatePicker!