Calendar component for React
Demo
🔨 How to install:
npm install react-calendar-datetime
or
yarn add react-calendar-datetime
📆 How to use:
import React from "react";
import { Calendar } from "react-calendar-datetime";
const App = () => {
const [date, setDate] = useState(new Date());
return <Calendar date={date} onChangeDate={setDate} />;
};Easy and simple
Props:
| Property | Type | Default | Description |
|---|---|---|---|
| date | Date | new Date() |
accepts the date in the normal format |
| onChangeDate | function | ----- | callback, called when the calendar changes and return the new date |
| locale | string | 'en-gb' | locale name, currently supported: en-gb,ru,de,uk,zh-cn,fr
|
| presets | boolean | false |
presets mode |
| time | boolean | false |
timepicker mode |
| width | string | null |
any css-lang string measure |
| height | string | null |
any css-lang string measure |
| dark | boolean | false | dark theme |
✅ Patch note:
v 1.3.1
- add year picker
- add dark theme
🌙 - add locales:
zh-cnfr
