Merge branch 'develop'

Author: shahabyazdi

index.d.ts

@@ -176,7 +176,7 @@ declare module "react-multi-date-picker" {
       selectedDate: DateObject | DateObject[],
       currentMonth: object,
       isSameDate(arg1: DateObject, arg2: DateObject): boolean
-    }): object,
+    }): object | void,
     disableMonthPicker?: boolean,
     disableYearPicker?: boolean,
     /**
@@ -216,9 +216,9 @@ declare module "react-multi-date-picker" {
      * 
      * <DatePicker multiple sort />
      */
-    sort: boolean,
-    numberOfMonths: number,
-    currentDate: DateObject
+    sort?: boolean,
+    numberOfMonths?: number,
+    currentDate?: DateObject
   }
 
   interface DatePickerProps {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-multi-date-picker",
-  "version": "2.2.5",
+  "version": "2.2.6",
   "description": "a simple React datepicker component for work with gregorian, persian, arabic and indian calendars",
   "main": "./build/index.js",
   "types": "index.d.ts",

src/components/header/header.js

@@ -11,13 +11,19 @@ export default function Header({
   customMonths,
   numberOfMonths
 }) {
-  let monthNames = []
+  let monthNames = [],
+    years = [],
+    digits = state.date.digits
 
   for (let monthIndex = 0; monthIndex < numberOfMonths; monthIndex++) {
-    let monthName
-    let index = state.date.month.index + monthIndex
+    let monthName,
+      year = state.date.year,
+      index = state.date.month.index + monthIndex
 
-    if (index > 11) index -= 12
+    if (index > 11) {
+      index -= 12
+      year++
+    }
 
     if (Array.isArray(customMonths) && customMonths.length >= 12) {
       let month = customMonths[index]
@@ -27,7 +33,10 @@ export default function Header({
       monthName = state.date.months[index].name
     }
 
+    year = year.toString().replace(/[0-9]/g, w => digits[w])
+
     monthNames.push(monthName)
+    years.push(year)
   }
 
   return (
@@ -44,13 +53,13 @@ export default function Header({
                     onClick={() => !disableMonthPicker && toggle("mustShowMonthPicker")}
                   >
                     {monthName},
-                                    </span>
+                  </span>
                 }
                 <span
                   style={{ cursor: disableYearPicker || state.onlyYearPicker ? "default" : "pointer" }}
                   onClick={() => !disableYearPicker && toggle("mustShowYearPicker")}
                 >
-                  {state.date.format("YYYY")}
+                  {years[index]}
                 </span>
               </div>
             )