feat(calendar): add TypeScript definitions

Makefile

@@ -130,6 +130,7 @@ packages-tslint: ##@1 packages run tslint on all packages
 	@echo "${YELLOW}Running tslint on all packages${RESET}"
 	@./node_modules/.bin/tslint \
 	    ./packages/nivo-bar/index.d.ts \
+	    ./packages/nivo-calendar/index.d.ts \
 	    ./packages/nivo-core/index.d.ts \
 	    ./packages/nivo-heatmap/index.d.ts \
         ./packages/nivo-pie/index.d.ts \

packages/nivo-calendar/index.d.ts

@@ -0,0 +1,78 @@
+import * as React from 'react'
+import { Dimensions, Theme, Box } from '@nivo/core'
+import { LegendProps } from '@nivo/legends'
+
+declare module '@nivo/calendar' {
+    export type DateOrString = string | Date
+
+    export interface CalendarDatum {
+        day: string
+        value: number
+    }
+
+    export interface CalendarData {
+        from: DateOrString
+        to: DateOrString
+        data: CalendarDatum[]
+    }
+
+    export type CalendarDirection = 'horizontal' | 'vertical'
+
+    export type CalendarLegend = LegendProps & {
+        itemCount: number
+    }
+
+    export interface CalendarDayData {
+        date: Date
+        day: string
+        value?: number
+        color: string
+        size: number
+        x: number
+        y: number
+    }
+
+    export type CalendarCommonProps = Partial<{
+        domain: 'auto' | number[]
+        direction: CalendarDirection
+        colors: string[]
+        margin: Box
+
+        // years
+        yearLabel: (year: number) => string | number
+        yearSpacing: number
+        yearLegendOffset: number
+
+        // months
+        monthLabel: (year: number, month: number) => string | number
+        monthBorderWidth: number
+        monthBorderColor: string
+        monthLegendOffset: number
+
+        // days
+        daySpacing: number
+        dayBorderWidth: number
+        dayBorderColor: string
+        emptyColor: string
+
+        // interactivity
+        isInteractive: boolean
+
+        // tooltip
+        tooltipFormat: (value: number) => string | number
+
+        // legends
+        legends: CalendarLegend[]
+
+        theme: Theme
+    }>
+
+    export type CalendarSvgProps = CalendarData
+        & CalendarCommonProps
+        & Partial<{
+            onClick: (datum: CalendarDayData, event: React.MouseEvent<SVGRectElement>) => void
+        }>
+
+    export class Calendar extends React.Component<CalendarSvgProps & Dimensions> {}
+    export class ResponsiveCalendar extends React.Component<CalendarSvgProps> {}
+}

packages/nivo-calendar/package.json

@@ -6,6 +6,7 @@
   "files": [
     "README.md",
     "index.js",
+    "index.d.ts",
     "cjs/"
   ],
   "dependencies": {

packages/nivo-calendar/src/props.js

@@ -31,7 +31,6 @@ export const CalendarPropTypes = {
     colors: PropTypes.arrayOf(PropTypes.string).isRequired,
     colorScale: PropTypes.func.isRequired,
 
-    onDayClick: PropTypes.func.isRequired,
     direction: PropTypes.oneOf([DIRECTION_HORIZONTAL, DIRECTION_VERTICAL]),
     emptyColor: PropTypes.string.isRequired,
 
@@ -57,7 +56,7 @@ export const CalendarPropTypes = {
     legends: PropTypes.arrayOf(
         PropTypes.shape({
             ...LegendPropShape,
-            itemCount: PropTypes.number,
+            itemCount: PropTypes.number.isRequired,
         })
     ).isRequired,
 }
@@ -72,7 +71,6 @@ export const CalendarDefaultProps = {
     colors: ['#61cdbb', '#97e3d5', '#e8c1a0', '#f47560'],
 
     direction: DIRECTION_HORIZONTAL,
-    onDayClick: () => {},
     emptyColor: '#fff',
 
     // years