- npm install
- npm start
| Regualr Calendar | Sticky Calendar |
|---|---|
 |
 |
| name | type | description |
|---|---|---|
| cellHoverStyle | Object |
style of the cell when the user hovers on it |
| cellStyle | (current: moment) => Object |
general cell style |
| headerStyle | Object |
style of all the week headers from Sunday to Monday |
| inputClassName | String |
css className for the input field |
| monthHeaderStyle | Object |
style of the month header in the calendar |
| onCellClick | (current: moment) => { ... } |
function called when the user clicks on the cell |
| onHeaderCellClick | (day: String) => { ... } |
function called when the user clicks on the week header cells |
| renderHeaderCell | (day: String) => React.Node |
function to render the week header cell |
| rowStyle | (rowData: Array[moment], index: number) => Object |
function to render styles of each row in the calendar |
| sticky | Boolean |
a sticky calendar instead of an input calendar, by default, it is set to false |
| style | Object |
style of the parent div of the component |
| name | type | description |
|---|---|---|
| dates | {date: "YYYY-MM-DD", count: number}[] |
Array of Objects with date and count of the measure |
| colorCode | String |
Color Hexcode |
| cellSize | Number |
The size of the cell, basically it is the width and height of the cell |
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent