import {CalendarHeatmapValuesProp} from "./CalendarHeatmapValuesProp";
import {ReactEventHandler} from "react";

export interface CalendarHeatmapProp {
    values: CalendarHeatmapValuesProp[]; // array of objects with date and arbitrary metadata
    startDate: Date; // start of date range
    endDate: Date; // end of date range
    gutterSize: number; // size of space between squares
    horizontal: boolean; // whether to orient horizontally or vertically
    showMonthLabels: boolean; // whether to show month labels
    showWeekdayLabels: boolean; // whether to show weekday labels
    showOutOfRangeDays: boolean; // whether to render squares for extra days in week after endDate, and before start date
    tooltipDataAttrs: object; // data attributes to add to square for setting 3rd party tooltips, e.g. { 'data-toggle': 'tooltip' } for bootstrap tooltips
    onClick: (v:string) => void; // callback function when a square is clicked
    onMouseOver?: (e:ReactEventHandler, v:string) => void; // callback function when mouse pointer is over a square
    onMouseLeave?: (e:ReactEventHandler, v:string) => void; // callback function when mouse pointer is left a square
    transformDayElement?: (element:JSX.Element, v:string, i:number) => void; // function to further transform the svg element for a single day
}