updated proptype definitions to typescript in README

README.md

@@ -176,50 +176,47 @@ ariaLabels                           | Object    | {}               | inserts ar
 dayContentRenderer                   | Function  | null             | Function to customize the rendering of Calendar Day. given a date is supposed to return what to render.
 preventScrollToFocusedMonth          | Boolean   | false            | When two or more months are open, prevent the shift of the focused month to the left.
 
- *shape of range:
- ```js
-  {
-    startDate: PropTypes.object,
-    endDate: PropTypes.object,
-    color: PropTypes.string,
-    key: PropTypes.string,
-    autoFocus: PropTypes.bool,
-    disabled: PropTypes.bool,
-    showDateDisplay: PropTypes.bool,
-  }
-```
-
- **shape of ariaLabels:
- ```js
-  {
-    // The key of dateInput should be same as key in range.
-    dateInput: PropTypes.objectOf(
-      PropTypes.shape({
-        startDate: PropTypes.string,
-        endDate: PropTypes.string
-      })
-    ),
-    monthPicker: PropTypes.string,
-    yearPicker: PropTypes.string,
-    prevButton: PropTypes.string,
-    nextButton: PropTypes.string,
-  }
+#### Type DateRange:
+ ```ts
+type DateRange = {
+  startDate: Date,
+  endDate: Date,
+  color?: string,
+  key?: string,
+  autoFocus?: boolean,
+  disabled?: boolean,
+  showDateDisplay?: boolean,
+  label?: string
+}
+```
+
+#### Type AriaLabelsType:
+ ```ts
+type AriaLabelsType = {
+  dateInput?: {
+    startDate?: string,
+    endDate?: string
+  },
+  monthPicker?: string,
+  yearPicker?: string,
+  prevButton?: string,
+  nextButton?: string
+}
 ```
 #### Infinite Scrolled Mode
 
 To enable infinite scroll set `scroll={{enabled: true}}` basically. Infinite scroll feature is affected by `direction`(rendering direction for months) and `months`(for rendered months count) props directly.
 If you prefer, you can overwrite calendar sizes with `calendarWidth`/`calendarHeight` or each month's height/width with `monthWidth`/`monthHeight`/`longMonthHeight` at `scroll` prop.
 
-```js
-  // shape of scroll prop
-  scroll: {
-    enabled: PropTypes.bool,
-    monthHeight: PropTypes.number,
-    longMonthHeight: PropTypes.number, // some months has 1 more row than others
-    monthWidth: PropTypes.number, // just used when direction="horizontal"
-    calendarWidth: PropTypes.number, // defaults monthWidth * months
-    calendarHeight: PropTypes.number, // defaults monthHeight * months
-  }),
+```ts
+type Scroll = {
+  enabled?: boolean,
+  monthHeight?: number,
+  longMonthHeight?: number,
+  monthWidth?: number,
+  calendarWidth?: number,
+  calendarHeight?: number
+}
 ```
 
 

src/accessibility/index.ts

@@ -1,4 +1,4 @@
-export type AriasLabelsType = {
+export type AriaLabelsType = {
   dateInput?: {
     startDate?: string,
     endDate?: string

src/components/Calendar/index.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { StylesType } from '../../styles';
-import { AriasLabelsType } from '../../accessibility';
+import { AriaLabelsType } from '../../accessibility';
 import { Locale, WeekOptions, Month as FNSMonth, addDays, addMonths, addYears, differenceInCalendarMonths, differenceInDays, eachDayOfInterval, endOfMonth, endOfWeek, format, isSameDay, startOfMonth, startOfWeek, subMonths, isSameMonth, FormatOptions, ParseOptions, setMonth, setYear, min, max } from 'date-fns';
 import { DateRange } from '../DayCell';
 import { enUS } from 'date-fns/locale/en-US';
@@ -64,7 +64,7 @@ export type CalendarProps = {
   fixedHeight?: boolean,
   calendarFocus?: "forwards" | "backwards",
   preventSnapRefocus?: boolean,
-  ariaLabels?: AriasLabelsType,
+  ariaLabels?: AriaLabelsType,
   preventScrollToFocusedMonth?: boolean
 };
 
@@ -457,7 +457,7 @@ type MonthAndYearProps = {
   showMonthArrow: boolean,
   minDate: Date,
   maxDate: Date,
-  ariaLabels: AriasLabelsType,
+  ariaLabels: AriaLabelsType,
   focusedDate: Date,
   showMonthAndYearPickers: boolean,
   monthNames: string[],
@@ -581,7 +581,7 @@ type DateDisplayProps = {
   editableDateInputs: boolean,
   startDatePlaceholder: string,
   endDatePlaceholder: string,
-  ariaLabels: AriasLabelsType,
+  ariaLabels: AriaLabelsType,
   styles: Partial<StylesType>,
   onDragSelectionEnd: (date: Date) => void,
   handleRangeFocusChange: (rangesIndex: number, rangeItemIndex: number) => void