react-calendar - npm Package Compare versions

Comparing version 2.16.1 to 2.17.0-beta

dist/Calendar.js

@@ -393,2 +393,3 @@ 'use strict';
                 onClickWeekNumber = _props4.onClickWeekNumber,
+                showFixedNumberOfWeeks = _props4.showFixedNumberOfWeeks,
                 showNeighboringMonth = _props4.showNeighboringMonth,
@@ -403,2 +404,3 @@ showWeekNumbers = _props4.showWeekNumbers;
               onClickWeekNumber: onClickWeekNumber,
+              showFixedNumberOfWeeks: showFixedNumberOfWeeks,
               showNeighboringMonth: showNeighboringMonth,
@@ -618,2 +620,3 @@ showWeekNumbers: showWeekNumbers
   selectRange: _propTypes2.default.bool,
+  showFixedNumberOfWeeks: _propTypes2.default.bool,
   showNavigation: _propTypes2.default.bool,
@@ -620,0 +623,0 @@ showNeighboringMonth: _propTypes2.default.bool,

dist/Calendar/Navigation.js

@@ -79,3 +79,9 @@ 'use strict';
     value: function shouldComponentUpdate(nextProps) {
-      return nextProps.activeStartDate !== this.props.activeStartDate || nextProps.locale !== this.props.locale || nextProps.view !== this.props.view;
+      var _props = this.props,
+          activeStartDate = _props.activeStartDate,
+          locale = _props.locale,
+          view = _props.view;
+
+
+      return nextProps.activeStartDate !== activeStartDate || nextProps.locale !== locale || nextProps.view !== view;
     }
@@ -86,6 +92,11 @@ }, {
       var label = this.label;
-      var _props = this.props,
-          drillUp = _props.drillUp,
-          view = _props.view,
-          date = _props.activeStartDate;
+      var _props2 = this.props,
+          date = _props2.activeStartDate,
+          drillUp = _props2.drillUp,
+          navigationLabel = _props2.navigationLabel,
+          next2Label = _props2.next2Label,
+          nextLabel = _props2.nextLabel,
+          prev2Label = _props2.prev2Label,
+          prevLabel = _props2.prevLabel,
+          view = _props2.view;
 
@@ -101,3 +112,3 @@
         },
-        this.props.prev2Label !== null && view !== 'century' && _react2.default.createElement(
+        prev2Label !== null && view !== 'century' && _react2.default.createElement(
           'button',
@@ -110,3 +121,3 @@ {
           },
-          this.props.prev2Label
+          prev2Label
         ),
@@ -121,3 +132,3 @@ _react2.default.createElement(
           },
-          this.props.prevLabel
+          prevLabel
         ),
@@ -133,3 +144,3 @@ _react2.default.createElement(
           },
-          this.props.navigationLabel ? this.props.navigationLabel({ date: date, view: view, label: label }) : label
+          navigationLabel ? navigationLabel({ date: date, view: view, label: label }) : label
         ),
@@ -144,5 +155,5 @@ _react2.default.createElement(
           },
-          this.props.nextLabel
+          nextLabel
         ),
-        this.props.next2Label !== null && view !== 'century' && _react2.default.createElement(
+        next2Label !== null && view !== 'century' && _react2.default.createElement(
           'button',
@@ -155,3 +166,3 @@ {
           },
-          this.props.next2Label
+          next2Label
         )
@@ -163,5 +174,5 @@ );
     get: function get() {
-      var _props2 = this.props,
-          view = _props2.view,
-          views = _props2.views;
+      var _props3 = this.props,
+          view = _props3.view,
+          views = _props3.views;
 
@@ -173,6 +184,6 @@ return views.indexOf(view) > 0;
     get: function get() {
-      var _props3 = this.props,
-          date = _props3.activeStartDate,
-          minDate = _props3.minDate,
-          view = _props3.view;
+      var _props4 = this.props,
+          date = _props4.activeStartDate,
+          minDate = _props4.minDate,
+          view = _props4.view;
 
@@ -189,6 +200,6 @@ var previousActiveStartDate = (0, _dates.getBeginPrevious)(view, date);
     get: function get() {
-      var _props4 = this.props,
-          date = _props4.activeStartDate,
-          minDate = _props4.minDate,
-          view = _props4.view;
+      var _props5 = this.props,
+          date = _props5.activeStartDate,
+          minDate = _props5.minDate,
+          view = _props5.view;
 
@@ -205,6 +216,6 @@ var previousActiveStartDate = (0, _dates.getBeginPrevious2)(view, date);
     get: function get() {
-      var _props5 = this.props,
-          date = _props5.activeStartDate,
-          maxDate = _props5.maxDate,
-          view = _props5.view;
+      var _props6 = this.props,
+          date = _props6.activeStartDate,
+          maxDate = _props6.maxDate,
+          view = _props6.view;
 
@@ -217,6 +228,6 @@ var nextActiveStartDate = (0, _dates.getBeginNext)(view, date);
     get: function get() {
-      var _props6 = this.props,
-          date = _props6.activeStartDate,
-          maxDate = _props6.maxDate,
-          view = _props6.view;
+      var _props7 = this.props,
+          date = _props7.activeStartDate,
+          maxDate = _props7.maxDate,
+          view = _props7.view;
 
@@ -229,7 +240,7 @@ var nextActiveStartDate = (0, _dates.getBeginNext2)(view, date);
     get: function get() {
-      var _props7 = this.props,
-          date = _props7.activeStartDate,
-          formatMonthYear = _props7.formatMonthYear,
-          locale = _props7.locale,
-          view = _props7.view;
+      var _props8 = this.props,
+          date = _props8.activeStartDate,
+          formatMonthYear = _props8.formatMonthYear,
+          locale = _props8.locale,
+          view = _props8.view;
 
@@ -236,0 +247,0 @@

dist/MonthView.js

@@ -55,7 +55,13 @@ 'use strict';
     value: function renderWeekdays() {
+      var _props = this.props,
+          activeStartDate = _props.activeStartDate,
+          formatShortWeekday = _props.formatShortWeekday,
+          locale = _props.locale;
+
+
       return _react2.default.createElement(_Weekdays2.default, {
         calendarType: this.calendarType,
-        locale: this.props.locale,
-        month: this.props.activeStartDate,
-        formatShortWeekday: this.props.formatShortWeekday
+        locale: locale,
+        month: activeStartDate,
+        formatShortWeekday: formatShortWeekday
       });
@@ -73,6 +79,13 @@ }
 
+      var _props2 = this.props,
+          activeStartDate = _props2.activeStartDate,
+          onClickWeekNumber = _props2.onClickWeekNumber,
+          showFixedNumberOfWeeks = _props2.showFixedNumberOfWeeks;
+
+
       return _react2.default.createElement(_WeekNumbers2.default, {
-        activeStartDate: this.props.activeStartDate,
+        activeStartDate: activeStartDate,
         calendarType: this.calendarType,
-        onClickWeekNumber: this.props.onClickWeekNumber
+        onClickWeekNumber: onClickWeekNumber,
+        showFixedNumberOfWeeks: showFixedNumberOfWeeks
       });
@@ -83,6 +96,6 @@ }
     value: function renderDays() {
-      var _props = this.props,
-          calendarType = _props.calendarType,
-          showWeekNumbers = _props.showWeekNumbers,
-          childProps = _objectWithoutProperties(_props, ['calendarType', 'showWeekNumbers']);
+      var _props3 = this.props,
+          calendarType = _props3.calendarType,
+          showWeekNumbers = _props3.showWeekNumbers,
+          childProps = _objectWithoutProperties(_props3, ['calendarType', 'showWeekNumbers']);
 
@@ -132,5 +145,5 @@ return _react2.default.createElement(_Days2.default, _extends({
     get: function get() {
-      var _props2 = this.props,
-          calendarType = _props2.calendarType,
-          locale = _props2.locale;
+      var _props4 = this.props,
+          calendarType = _props4.calendarType,
+          locale = _props4.locale;
 
@@ -143,4 +156,46 @@
       switch (locale) {
+        case 'en-CA':
         case 'en-US':
+        case 'es-AR':
+        case 'es-BO':
+        case 'es-CL':
+        case 'es-CO':
+        case 'es-CR':
+        case 'es-DO':
+        case 'es-EC':
+        case 'es-GT':
+        case 'es-HN':
+        case 'es-MX':
+        case 'es-NI':
+        case 'es-PA':
+        case 'es-PE':
+        case 'es-PR':
+        case 'es-SV':
+        case 'es-VE':
+        case 'pt-BR':
           return 'US';
+        // ar-LB, ar-MA intentionally missing
+        case 'ar':
+        case 'ar-AE':
+        case 'ar-BH':
+        case 'ar-DZ':
+        case 'ar-EG':
+        case 'ar-IQ':
+        case 'ar-JO':
+        case 'ar-KW':
+        case 'ar-LY':
+        case 'ar-OM':
+        case 'ar-QA':
+        case 'ar-SA':
+        case 'ar-SD':
+        case 'ar-SY':
+        case 'ar-YE':
+        case 'dv':
+        case 'dv-MV':
+        case 'ps':
+        case 'ps-AR':
+          return 'Arabic';
+        case 'he':
+        case 'he-IL':
+          return 'Hebrew';
         default:
@@ -168,2 +223,3 @@ return 'ISO 8601';
   setActiveRange: _propTypes2.default.func,
+  showFixedNumberOfWeeks: _propTypes2.default.bool,
   showNeighboringMonth: _propTypes2.default.bool,
@@ -170,0 +226,0 @@ showWeekNumbers: _propTypes2.default.bool,

dist/MonthView/Day.js

@@ -34,6 +34,7 @@ 'use strict';
 var Day = function Day(_ref) {
-  var classes = _ref.classes,
+  var calendarType = _ref.calendarType,
+      classes = _ref.classes,
       currentMonthIndex = _ref.currentMonthIndex,
       date = _ref.date,
-      otherProps = _objectWithoutProperties(_ref, ['classes', 'currentMonthIndex', 'date']);
+      otherProps = _objectWithoutProperties(_ref, ['calendarType', 'classes', 'currentMonthIndex', 'date']);
 
@@ -43,3 +44,3 @@ return _react2.default.createElement(
     _extends({}, otherProps, {
-      classes: [].concat(_toConsumableArray(classes), [className, (0, _dates.isWeekend)(date) ? className + '--weekend' : null, date.getMonth() !== currentMonthIndex ? className + '--neighboringMonth' : null]),
+      classes: [].concat(_toConsumableArray(classes), [className, (0, _dates.isWeekend)(date, calendarType) ? className + '--weekend' : null, date.getMonth() !== currentMonthIndex ? className + '--neighboringMonth' : null]),
       date: date,
@@ -46,0 +47,0 @@ dateTime: (0, _dates.getISOLocalDate)(date) + 'T00:00:00.000',

dist/MonthView/Days.js

@@ -59,5 +59,4 @@ 'use strict';
           activeStartDate = _props.activeStartDate,
-          calendarType = _props.calendarType,
           showNeighboringMonth = _props.showNeighboringMonth,
-          otherProps = _objectWithoutProperties(_props, ['activeStartDate', 'calendarType', 'showNeighboringMonth']);
+          otherProps = _objectWithoutProperties(_props, ['activeStartDate', 'showNeighboringMonth']);
 
@@ -82,10 +81,16 @@ return _react2.default.createElement(_TileGroup2.default, _extends({}, otherProps, {
     get: function get() {
-      if (this.props.showNeighboringMonth) {
+      var _props2 = this.props,
+          showFixedNumberOfWeeks = _props2.showFixedNumberOfWeeks,
+          showNeighboringMonth = _props2.showNeighboringMonth;
+
+
+      if (showFixedNumberOfWeeks || showNeighboringMonth) {
         return 0;
       }
 
-      var _props2 = this.props,
-          activeStartDate = _props2.activeStartDate,
-          calendarType = _props2.calendarType;
+      var _props3 = this.props,
+          activeStartDate = _props3.activeStartDate,
+          calendarType = _props3.calendarType;
 
+
       return (0, _dates.getDayOfWeek)(activeStartDate, calendarType);
@@ -103,9 +108,15 @@ }
     get: function get() {
-      if (this.props.showNeighboringMonth) {
-        var _props3 = this.props,
-            activeStartDate = _props3.activeStartDate,
-            calendarType = _props3.calendarType;
+      var _props4 = this.props,
+          showFixedNumberOfWeeks = _props4.showFixedNumberOfWeeks,
+          showNeighboringMonth = _props4.showNeighboringMonth;
 
+
+      if (showFixedNumberOfWeeks || showNeighboringMonth) {
+        var _props5 = this.props,
+            activeStartDate = _props5.activeStartDate,
+            calendarType = _props5.calendarType;
+
         return -(0, _dates.getDayOfWeek)(activeStartDate, calendarType) + 1;
       }
+
       return 1;
@@ -123,6 +134,15 @@ }
     get: function get() {
-      var activeStartDate = this.props.activeStartDate;
+      var _props6 = this.props,
+          activeStartDate = _props6.activeStartDate,
+          showFixedNumberOfWeeks = _props6.showFixedNumberOfWeeks,
+          showNeighboringMonth = _props6.showNeighboringMonth;
 
       var daysInMonth = (0, _dates.getDaysInMonth)(activeStartDate);
-      if (this.props.showNeighboringMonth) {
+
+      if (showFixedNumberOfWeeks) {
+        // Always show 6 weeks
+        return this.start + 6 * 7 - 1;
+      }
+
+      if (showNeighboringMonth) {
         var year = this.year,
@@ -135,2 +155,3 @@ monthIndex = this.monthIndex;
       }
+
       return daysInMonth;
@@ -162,3 +183,4 @@ }
   calendarType: _propTypes3.isCalendarType.isRequired,
+  showFixedNumberOfWeeks: _propTypes2.default.bool,
   showNeighboringMonth: _propTypes2.default.bool
 }, _propTypes3.tileGroupProps);

dist/MonthView/Weekdays.js

@@ -47,3 +47,8 @@ 'use strict';
     value: function shouldComponentUpdate(nextProps) {
-      return nextProps.calendarType !== this.props.calendarType || nextProps.locale !== this.props.locale;
+      var _props = this.props,
+          calendarType = _props.calendarType,
+          locale = _props.locale;
+
+
+      return nextProps.calendarType !== calendarType || nextProps.locale !== locale;
     }
@@ -53,6 +58,6 @@ }, {
     value: function render() {
-      var _props = this.props,
-          calendarType = _props.calendarType,
-          formatShortWeekday = _props.formatShortWeekday,
-          locale = _props.locale;
+      var _props2 = this.props,
+          calendarType = _props2.calendarType,
+          formatShortWeekday = _props2.formatShortWeekday,
+          locale = _props2.locale;
       var beginOfMonth = this.beginOfMonth,
@@ -59,0 +64,0 @@ year = this.year,

dist/MonthView/WeekNumbers.js

@@ -92,2 +92,9 @@ 'use strict';
     get: function get() {
+      var showFixedNumberOfWeeks = this.props.showFixedNumberOfWeeks;
+
+
+      if (showFixedNumberOfWeeks) {
+        return 6;
+      }
+
       var days = this.numberOfDays - (7 - this.startWeekday);
@@ -154,3 +161,4 @@ return 1 + Math.ceil(days / 7);
   calendarType: _propTypes3.isCalendarType.isRequired,
-  onClickWeekNumber: _propTypes2.default.func
+  onClickWeekNumber: _propTypes2.default.func,
+  showFixedNumberOfWeeks: _propTypes2.default.bool
 };

dist/shared/dates.js

@@ -9,2 +9,16 @@ 'use strict';
 
+var _Array$from = Array.from(Array(7), function (el, index) {
+  return index;
+}),
+    _Array$from2 = _slicedToArray(_Array$from, 7),
+
+// eslint-disable-next-line no-unused-vars
+SUNDAY = _Array$from2[0],
+    MONDAY = _Array$from2[1],
+    TUESDAY = _Array$from2[2],
+    WEDNESDAY = _Array$from2[3],
+    THURSDAY = _Array$from2[4],
+    FRIDAY = _Array$from2[5],
+    SATURDAY = _Array$from2[6];
+
 /* Simple getters - getting a property of a given point in time */
@@ -51,2 +65,5 @@
       return (weekday + 6) % 7;
+    case 'Arabic':
+      return (weekday + 1) % 7;
+    case 'Hebrew':
     case 'US':
@@ -283,3 +300,3 @@ return weekday;
  * Gets week number according to ISO 8601 or US standard.
- * In ISO 8601 week 1 is the one with January 4.
+ * In ISO 8601, Arabic and Hebrew week 1 is the one with January 4.
  * In US calendar week 1 is the one with January 1.
@@ -293,3 +310,4 @@ *
 
-  var beginOfWeek = getBeginOfWeek(date, calendarType);
+  var calendarTypeForWeekNumber = calendarType === 'US' ? 'US' : 'ISO 8601';
+  var beginOfWeek = getBeginOfWeek(date, calendarTypeForWeekNumber);
   var year = getYear(date) + 1;
@@ -301,4 +319,4 @@ var dayInWeekOne = void 0;
   do {
-    dayInWeekOne = new Date(year, 0, calendarType === 'ISO 8601' ? 4 : 1);
-    beginOfFirstWeek = getBeginOfWeek(dayInWeekOne, calendarType);
+    dayInWeekOne = new Date(year, 0, calendarTypeForWeekNumber === 'ISO 8601' ? 4 : 1);
+    beginOfFirstWeek = getBeginOfWeek(dayInWeekOne, calendarTypeForWeekNumber);
     year -= 1;
@@ -522,4 +540,15 @@ } while (date - beginOfFirstWeek < 0);
 var isWeekend = exports.isWeekend = function isWeekend(date) {
-  var weekday = getDayOfWeek(date);
-  return weekday >= 5;
+  var calendarType = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'ISO 8601';
+
+  var weekday = date.getDay();
+  switch (calendarType) {
+    case 'Arabic':
+    case 'Hebrew':
+      return weekday === FRIDAY || weekday === SATURDAY;
+    case 'ISO 8601':
+    case 'US':
+      return weekday === SATURDAY || weekday === SUNDAY;
+    default:
+      throw new Error('Unsupported calendar type.');
+  }
 };
@@ -526,0 +555,0 @@

dist/shared/propTypes.js

@@ -16,3 +16,3 @@ 'use strict';
 
-var calendarTypes = ['ISO 8601', 'US'];
+var calendarTypes = ['ISO 8601', 'US', 'Arabic', 'Hebrew'];
 var allViews = ['century', 'decade', 'year', 'month'];
@@ -19,0 +19,0 @@

dist/shared/utils.js

@@ -90,2 +90,18 @@ 'use strict';
   var classes = [className];
+
+  if (!date) {
+    return classes;
+  }
+
+  if (!(date instanceof Array) && !dateType) {
+    throw new Error('getTileClasses(): Unable to get tile activity classes because one or more required arguments were not passed.');
+  }
+
+  var now = new Date();
+  var dateRange = date instanceof Array ? date : (0, _dates.getRange)(dateType, date);
+
+  if (isValueWithinRange(now, dateRange)) {
+    classes.push(className + '--now');
+  }
+
   if (!value) {
@@ -95,3 +111,3 @@ return classes;
 
-  if (!date || !(value instanceof Array) && !valueType || !(date instanceof Array) && !dateType) {
+  if (!(value instanceof Array) && !valueType) {
     throw new Error('getTileClasses(): Unable to get tile activity classes because one or more required arguments were not passed.');
@@ -101,4 +117,2 @@ }
   var valueRange = value instanceof Array ? value : (0, _dates.getRange)(valueType, value);
-  var dateRange = date instanceof Array ? date : (0, _dates.getRange)(dateType, date);
-  var now = new Date();
 
@@ -132,7 +146,3 @@ if (isRangeWithinRange(valueRange, dateRange)) {
 
-  if (isValueWithinRange(now, dateRange)) {
-    classes.push(className + '--now');
-  }
-
   return classes;
 };

index.d.ts

 declare module "react-calendar" {
+  type CalendarType = "ISO 8601" | "US" | "Arabic" | "Hebrew"
   type Detail = "month" | "year" | "decade" | "century"
   type DateCallback = (date: Date) => void
+  type OnChangeDateCallback = (date: Date | Date[]) => void
   type FormatterCallback = (date: Date) => string
@@ -11,3 +13,3 @@ type ViewCallback = (props: ViewCallbackProperties) => void
     activeStartDate?: Date;
-    calendarType?: "US" | "ISO 8601";
+    calendarType?: CalendarType;
     className?: string | string[];
@@ -25,3 +27,3 @@ formatMonth?: FormatterCallback;
     onActiveDateChange?: ViewCallback;
-    onChange?: DateCallback;
+    onChange?: OnChangeDateCallback;
     onClickDay?: DateCallback;
@@ -39,2 +41,3 @@ onClickDecade?: DateCallback;
     selectRange?: boolean;
+    showFixedNumberOfWeeks?: boolean;
     showNavigation?: boolean;
@@ -67,3 +70,3 @@ showNeighboringMonth?: boolean;
     activeStartDate: Date;
-    calendarType?: "US" | "ISO 8601";
+    calendarType?: CalendarType;
     locale?: string;
@@ -70,0 +73,0 @@ hover?: Date;

package.json

 {
   "name": "react-calendar",
-  "version": "2.16.1",
+  "version": "2.17.0-beta",
   "description": "Ultimate calendar for your React app.",
@@ -16,3 +16,3 @@ "main": "dist/entry.js",
     "test": "yarn run test-eslint && yarn run test-jest",
-    "test-eslint": "eslint ./src",
+    "test-eslint": "eslint --ext .jsx,.js src/",
     "test-jest": "jest",
@@ -93,3 +93,4 @@ "test-jest-coverage": "jest --coverage"
     "react": "^16.4.1",
-    "react-dom": "^16.4.1"
+    "react-dom": "^16.4.1",
+    "react-test-renderer": "^16.4.1"
   },
@@ -96,0 +97,0 @@ "peerDependencies": {

README.md

@@ -88,3 +88,3 @@ ![downloads](https://img.shields.io/npm/dt/react-calendar.svg) ![build](https://img.shields.io/travis/wojtekmaj/react-calendar/master.svg) ![dependencies](https://img.shields.io/david/wojtekmaj/react-calendar.svg
 |activeStartDate|The beginning of a period that shall be displayed by default when no value is given. Defaults to today.|`new Date(2017, 0, 1)`|
-|calendarType|Defines which type of calendar should be used. Can be "US" or "ISO 8601". Defaults to "US" for "en-US" locale, "ISO 8601" to all the others. Changing to "US" will change the first day of the week from Monday to Sunday.|`"ISO 8601"`|
+|calendarType|Defines which type of calendar should be used. Can be "ISO 8601", "US", "Arabic", or "Hebrew". Defaults to a calendar most commonly used in specific locale. Setting to "US" or "Hebrew" will change the first day of the week to Sunday. Setting to "Arabic" will change the first day of the week to Saturday. Setting to "Arabic" or "Hebrew" will make weekends appear on Friday to Saturday.|`"ISO 8601"`|
 |className|Defines class name(s) that will be added along with "react-calendar" to the main React-Calendar `<div>` element.|<ul><li>String: `"class1 class2"`</li><li>Array of strings: `["class1", "class2 class3"]`</li></ul>|
@@ -115,2 +115,3 @@ |formatMonth|Function called to override default formatting of month names. Can be used to use your own formatting function.|`(value) => formatDate(value, 'MMM')`|
 |showNavigation|Defines whether a navigation bar with arrows and title shall be rendered. Defaults to true.|`false`|
+|showFixedNumberOfWeeks|Defines whether to always show fixed number of weeks (6). Forces showNeighboringMonth prop to be true. Defaults to false.|`true`|
 |showNeighboringMonth|Defines whether days from previous or next month shall be rendered if the month doesn't start on the first day of the week or doesn't end on the last day of the week, respectively. Defaults to true.|`false`|
@@ -160,1 +161,15 @@ |selectRange|Defines whether the user shall select two dates forming a range instead of just one. Note: This feature will make React-Calendar return array with two dates regardless of returnValue setting. Defaults to false.|`true`|
 </table>
+
+## Thank you
+
+### Sponsors
+
+Thank you to all our sponsors! [Become a sponsor](https://opencollective.com/react-calendar#sponsor) and get your image on our README on GitHub.
+
+<a href="https://opencollective.com/react-calendar#sponsors" target="_blank"><img src="https://opencollective.com/react-calendar/sponsors.svg?width=890"></a>
+
+### Backers
+
+Thank you to all our backers! [Become a backer](https://opencollective.com/react-calendar#backer) and get your image on our README on GitHub.
+
+<a href="https://opencollective.com/react-calendar#backers" target="_blank"><img src="https://opencollective.com/react-calendar/backers.svg?width=890"></a>

src/__tests__/Flex.jsx

@@ -12,5 +12,11 @@ import React from 'react';
       <Flex count={3} wrap={false}>
-        <div>Hey</div>
-        <div>Hi</div>
-        <div>Hello</div>
+        <div>
+          Hey
+        </div>
+        <div>
+          Hi
+        </div>
+        <div>
+          Hello
+        </div>
       </Flex>
@@ -26,5 +32,11 @@ );
       <Flex count={3} wrap>
-        <div>Hey</div>
-        <div>Hi</div>
-        <div>Hello</div>
+        <div>
+          Hey
+        </div>
+        <div>
+          Hi
+        </div>
+        <div>
+          Hello
+        </div>
       </Flex>
@@ -40,5 +52,11 @@ );
       <Flex count={3}>
-        <div>Hey</div>
-        <div>Hi</div>
-        <div>Hello</div>
+        <div>
+          Hey
+        </div>
+        <div>
+          Hi
+        </div>
+        <div>
+          Hello
+        </div>
       </Flex>
@@ -58,4 +76,8 @@ );
       <Flex count={3} offset={1}>
-        <div>Hey</div>
-        <div>Hi</div>
+        <div>
+          Hey
+        </div>
+        <div>
+          Hi
+        </div>
       </Flex>
@@ -66,7 +88,5 @@ );
 
-    children.forEach(child =>
-      expect(parseFloat(child.prop('style').flexBasis)).toBeCloseTo(33.33)
-    );
+    children.forEach(child => expect(parseFloat(child.prop('style').flexBasis)).toBeCloseTo(33.33));
     expect(parseFloat(children.first().prop('style').marginLeft)).toBeCloseTo(33.33);
   });
 });

src/__tests__/MonthView.jsx

@@ -107,2 +107,3 @@ import React from 'react';
     };
+
     const component = mount(
@@ -126,2 +127,25 @@ <MonthView
   });
+
+  it('does not render WeekNumbers component by default', () => {
+    const activeStartDate = new Date(2017, 0, 1);
+
+    const component = mount(
+      <MonthView activeStartDate={activeStartDate} />
+    );
+
+    expect(component.find('WeekNumbers')).toHaveLength(0);
+  });
+
+  it('renders WeekNumbers component by given showWeekNumbers flag', () => {
+    const activeStartDate = new Date(2017, 0, 1);
+
+    const component = mount(
+      <MonthView
+        activeStartDate={activeStartDate}
+        showWeekNumbers
+      />
+    );
+
+    expect(component.find('WeekNumbers')).toHaveLength(1);
+  });
 });

src/Calendar.jsx

@@ -400,2 +400,3 @@ import React, { Component } from 'react';
           onClickWeekNumber,
+          showFixedNumberOfWeeks,
           showNeighboringMonth,
@@ -411,2 +412,3 @@ showWeekNumbers,
             onClickWeekNumber={onClickWeekNumber}
+            showFixedNumberOfWeeks={showFixedNumberOfWeeks}
             showNeighboringMonth={showNeighboringMonth}
@@ -527,2 +529,3 @@ showWeekNumbers={showWeekNumbers}
   selectRange: PropTypes.bool,
+  showFixedNumberOfWeeks: PropTypes.bool,
   showNavigation: PropTypes.bool,
@@ -529,0 +532,0 @@ showNeighboringMonth: PropTypes.bool,

src/Calendar/Navigation.jsx

@@ -20,6 +20,8 @@ import React, { Component } from 'react';
   shouldComponentUpdate(nextProps) {
+    const { activeStartDate, locale, view } = this.props;
+
     return (
-      nextProps.activeStartDate !== this.props.activeStartDate ||
-      nextProps.locale !== this.props.locale ||
-      nextProps.view !== this.props.view
+      nextProps.activeStartDate !== activeStartDate
+      || nextProps.locale !== locale
+      || nextProps.view !== view
     );
@@ -106,3 +108,12 @@ }
     const { label } = this;
-    const { drillUp, view, activeStartDate: date } = this.props;
+    const {
+      activeStartDate: date,
+      drillUp,
+      navigationLabel,
+      next2Label,
+      nextLabel,
+      prev2Label,
+      prevLabel,
+      view,
+    } = this.props;
 
@@ -116,3 +127,3 @@ const className = 'react-calendar__navigation';
       >
-        {this.props.prev2Label !== null && view !== 'century' && (
+        {prev2Label !== null && view !== 'century' && (
           <button
@@ -124,3 +135,3 @@ className={`${className}__arrow ${className}__prev2-button`}
           >
-            {this.props.prev2Label}
+            {prev2Label}
           </button>
@@ -134,3 +145,3 @@ )}
         >
-          {this.props.prevLabel}
+          {prevLabel}
         </button>
@@ -144,5 +155,5 @@ <button
         >
-          {this.props.navigationLabel ?
-            this.props.navigationLabel({ date, view, label }) :
-            label
+          {navigationLabel
+            ? navigationLabel({ date, view, label })
+            : label
           }
@@ -156,5 +167,5 @@ </button>
         >
-          {this.props.nextLabel}
+          {nextLabel}
         </button>
-        {this.props.next2Label !== null && view !== 'century' && (
+        {next2Label !== null && view !== 'century' && (
           <button
@@ -166,3 +177,3 @@ className={`${className}__arrow ${className}__next2-button`}
           >
-            {this.props.next2Label}
+            {next2Label}
           </button>
@@ -169,0 +180,0 @@ )}

src/MonthView.jsx

@@ -8,3 +8,8 @@ import React, { PureComponent } from 'react';
 
-import { isCalendarType, isMaxDate, isMinDate, isValue } from './shared/propTypes';
+import {
+  isCalendarType,
+  isMaxDate,
+  isMinDate,
+  isValue,
+} from './shared/propTypes';
 
@@ -20,4 +25,46 @@ export default class MonthView extends PureComponent {
     switch (locale) {
+      case 'en-CA':
       case 'en-US':
+      case 'es-AR':
+      case 'es-BO':
+      case 'es-CL':
+      case 'es-CO':
+      case 'es-CR':
+      case 'es-DO':
+      case 'es-EC':
+      case 'es-GT':
+      case 'es-HN':
+      case 'es-MX':
+      case 'es-NI':
+      case 'es-PA':
+      case 'es-PE':
+      case 'es-PR':
+      case 'es-SV':
+      case 'es-VE':
+      case 'pt-BR':
         return 'US';
+      // ar-LB, ar-MA intentionally missing
+      case 'ar':
+      case 'ar-AE':
+      case 'ar-BH':
+      case 'ar-DZ':
+      case 'ar-EG':
+      case 'ar-IQ':
+      case 'ar-JO':
+      case 'ar-KW':
+      case 'ar-LY':
+      case 'ar-OM':
+      case 'ar-QA':
+      case 'ar-SA':
+      case 'ar-SD':
+      case 'ar-SY':
+      case 'ar-YE':
+      case 'dv':
+      case 'dv-MV':
+      case 'ps':
+      case 'ps-AR':
+        return 'Arabic';
+      case 'he':
+      case 'he-IL':
+        return 'Hebrew';
       default:
@@ -29,8 +76,10 @@ return 'ISO 8601';
   renderWeekdays() {
+    const { activeStartDate, formatShortWeekday, locale } = this.props;
+
     return (
       <Weekdays
         calendarType={this.calendarType}
-        locale={this.props.locale}
-        month={this.props.activeStartDate}
-        formatShortWeekday={this.props.formatShortWeekday}
+        locale={locale}
+        month={activeStartDate}
+        formatShortWeekday={formatShortWeekday}
       />
@@ -47,7 +96,14 @@ );
 
+    const {
+      activeStartDate,
+      onClickWeekNumber,
+      showFixedNumberOfWeeks,
+    } = this.props;
+
     return (
       <WeekNumbers
-        activeStartDate={this.props.activeStartDate}
+        activeStartDate={activeStartDate}
         calendarType={this.calendarType}
-        onClickWeekNumber={this.props.onClickWeekNumber}
+        onClickWeekNumber={onClickWeekNumber}
+        showFixedNumberOfWeeks={showFixedNumberOfWeeks}
       />
@@ -112,2 +168,3 @@ );
   setActiveRange: PropTypes.func,
+  showFixedNumberOfWeeks: PropTypes.bool,
   showNeighboringMonth: PropTypes.bool,
@@ -114,0 +171,0 @@ showWeekNumbers: PropTypes.bool,

src/MonthView/__tests__/WeekNumbers.jsx

@@ -65,2 +65,18 @@ import React from 'react';
 
+  it('renders proper weekNumbers given showFixedNumberOfWeeks flag', () => {
+    // Same config as in first test which gives 5 weeks, except for the flag
+    const component = mount(
+      <WeekNumbers
+        activeStartDate={new Date(2018, 0, 1)}
+        calendarType="ISO 8601"
+        showFixedNumberOfWeeks
+      />
+    );
+
+    const weekNumbers = component.find('WeekNumber');
+
+    expect(weekNumbers).toHaveLength(6);
+    expect(weekNumbers.first().text()).toBe('1');
+  });
+
   it('renders static divs as children when not given onClickWeekNumber', () => {
@@ -67,0 +83,0 @@ const component = mount(

src/MonthView/Day.jsx

@@ -18,2 +18,3 @@ import React from 'react';
 const Day = ({
+  calendarType,
   classes,
@@ -29,3 +30,3 @@ currentMonthIndex,
       className,
-      isWeekend(date) ? `${className}--weekend` : null,
+      isWeekend(date, calendarType) ? `${className}--weekend` : null,
       date.getMonth() !== currentMonthIndex ? `${className}--neighboringMonth` : null,
@@ -32,0 +33,0 @@ ]}

src/MonthView/Days.jsx

@@ -17,3 +17,5 @@ import React, { PureComponent } from 'react';
   get offset() {
-    if (this.props.showNeighboringMonth) {
+    const { showFixedNumberOfWeeks, showNeighboringMonth } = this.props;
+
+    if (showFixedNumberOfWeeks || showNeighboringMonth) {
       return 0;
@@ -23,2 +25,3 @@ }
     const { activeStartDate, calendarType } = this.props;
+
     return getDayOfWeek(activeStartDate, calendarType);
@@ -33,6 +36,9 @@ }
   get start() {
-    if (this.props.showNeighboringMonth) {
+    const { showFixedNumberOfWeeks, showNeighboringMonth } = this.props;
+
+    if (showFixedNumberOfWeeks || showNeighboringMonth) {
       const { activeStartDate, calendarType } = this.props;
       return -getDayOfWeek(activeStartDate, calendarType) + 1;
     }
+
     return 1;
@@ -47,5 +53,11 @@ }
   get end() {
-    const { activeStartDate } = this.props;
+    const { activeStartDate, showFixedNumberOfWeeks, showNeighboringMonth } = this.props;
     const daysInMonth = getDaysInMonth(activeStartDate);
-    if (this.props.showNeighboringMonth) {
+
+    if (showFixedNumberOfWeeks) {
+      // Always show 6 weeks
+      return this.start + (6 * 7) - 1;
+    }
+
+    if (showNeighboringMonth) {
       const { year, monthIndex } = this;
@@ -56,2 +68,3 @@ const { calendarType } = this.props;
     }
+
     return daysInMonth;
@@ -75,3 +88,2 @@ }
       activeStartDate,
-      calendarType,
       showNeighboringMonth,
@@ -101,4 +113,5 @@ ...otherProps
   calendarType: isCalendarType.isRequired,
+  showFixedNumberOfWeeks: PropTypes.bool,
   showNeighboringMonth: PropTypes.bool,
   ...tileGroupProps,
 };

src/MonthView/Weekdays.jsx

@@ -17,5 +17,7 @@ import React, { Component } from 'react';
   shouldComponentUpdate(nextProps) {
+    const { calendarType, locale } = this.props;
+
     return (
-      nextProps.calendarType !== this.props.calendarType ||
-      nextProps.locale !== this.props.locale
+      nextProps.calendarType !== calendarType
+      || nextProps.locale !== locale
     );
@@ -49,4 +51,5 @@ }
     for (let weekday = 1; weekday <= 7; weekday += 1) {
-      const weekdayDate =
-        new Date(year, monthIndex, weekday - getDayOfWeek(beginOfMonth, calendarType));
+      const weekdayDate = new Date(
+        year, monthIndex, weekday - getDayOfWeek(beginOfMonth, calendarType),
+      );
 
@@ -53,0 +56,0 @@ weekdays.push(

src/MonthView/WeekNumber.jsx

@@ -9,17 +9,25 @@ import React from 'react';
 }) => (
-  onClickWeekNumber ?
-    <button
-      className="react-calendar__tile"
-      onClick={() => onClickWeekNumber(weekNumber, date)}
-      style={{ flexGrow: 1 }}
-      type="button"
-    >
-      <span>{weekNumber}</span>
-    </button> :
-    <div
-      className="react-calendar__tile"
-      style={{ flexGrow: 1 }}
-    >
-      <span>{weekNumber}</span>
-    </div>
+  onClickWeekNumber
+    ? (
+      <button
+        className="react-calendar__tile"
+        onClick={() => onClickWeekNumber(weekNumber, date)}
+        style={{ flexGrow: 1 }}
+        type="button"
+      >
+        <span>
+          {weekNumber}
+        </span>
+      </button>
+    )
+    : (
+      <div
+        className="react-calendar__tile"
+        style={{ flexGrow: 1 }}
+      >
+        <span>
+          {weekNumber}
+        </span>
+      </div>
+    )
 );
@@ -26,0 +34,0 @@

src/MonthView/WeekNumbers.jsx

@@ -30,2 +30,8 @@ import React, { PureComponent } from 'react';
   get numberOfWeeks() {
+    const { showFixedNumberOfWeeks } = this.props;
+
+    if (showFixedNumberOfWeeks) {
+      return 6;
+    }
+
     const days = this.numberOfDays - (7 - this.startWeekday);
@@ -101,2 +107,3 @@ return 1 + Math.ceil(days / 7);
   onClickWeekNumber: PropTypes.func,
+  showFixedNumberOfWeeks: PropTypes.bool,
 };

src/shared/__tests__/dates.js

@@ -138,2 +138,18 @@ import {
 
+  it('returns proper day of the week (Arabic)', () => {
+    const date = new Date(2017, 0, 1);
+
+    const dayOfWeek = getDayOfWeek(date, 'Arabic');
+
+    expect(dayOfWeek).toBe(1);
+  });
+
+  it('returns proper day of the week (Hebrew)', () => {
+    const date = new Date(2017, 0, 1);
+
+    const dayOfWeek = getDayOfWeek(date, 'Hebrew');
+
+    expect(dayOfWeek).toBe(0);
+  });
+
   it('returns proper day of the week (default)', () => {
@@ -431,2 +447,20 @@ const date = new Date(2017, 0, 1);
 
+  it('returns proper beginning of the week (Arabic)', () => {
+    const date = new Date(2016, 0, 1);
+    const beginOfWeekDate = new Date(2015, 11, 26);
+
+    const beginOfWeek = getBeginOfWeek(date, 'Arabic');
+
+    expect(beginOfWeek).toEqual(beginOfWeekDate);
+  });
+
+  it('returns proper beginning of the week (Hebrew)', () => {
+    const date = new Date(2016, 0, 1);
+    const beginOfWeekDate = new Date(2015, 11, 27);
+
+    const beginOfWeek = getBeginOfWeek(date, 'Hebrew');
+
+    expect(beginOfWeek).toEqual(beginOfWeekDate);
+  });
+
   it('returns proper beginning of the week (default)', () => {
@@ -651,2 +685,116 @@ const date = new Date(2017, 0, 1);
   });
+
+  it('returns proper week number for a sample week 1 (Arabic)', () => {
+    const year = 2018;
+    const month = 0;
+    const startDate = 1;
+
+    for (let currentDate = startDate; currentDate < startDate + 7; currentDate += 1) {
+      const date = new Date(year, month, currentDate);
+
+      const weekNumber = getWeekNumber(date, 'Arabic');
+
+      expect(weekNumber).toBe(1);
+    }
+  });
+
+  it('returns proper week number for a sample year starting in week 1 (Arabic)', () => {
+    const year = 2018;
+    const month = 0;
+    const startDate = 1;
+
+    for (let currentWeek = 1; currentWeek <= 52; currentWeek += 1) {
+      const weekOffset = (currentWeek - 1) * 7;
+      const date = new Date(year, month, startDate + weekOffset);
+
+      const weekNumber = getWeekNumber(date, 'Arabic');
+
+      expect(weekNumber).toBe(currentWeek);
+    }
+  });
+
+  it('returns proper week number for a sample week 52 (Arabic)', () => {
+    const year = 2016;
+    const month = 11;
+    const startDate = 26;
+
+    for (let currentDate = startDate; currentDate < startDate + 7; currentDate += 1) {
+      const date = new Date(year, month, currentDate);
+
+      const weekNumber = getWeekNumber(date, 'Arabic');
+
+      expect(weekNumber).toBe(52);
+    }
+  });
+
+  it('returns proper week number for a sample week 53 (Arabic)', () => {
+    const year = 2015;
+    const month = 11;
+    const startDate = 28;
+
+    for (let currentDate = startDate; currentDate < startDate + 7; currentDate += 1) {
+      const date = new Date(year, month, currentDate);
+
+      const weekNumber = getWeekNumber(date, 'Arabic');
+
+      expect(weekNumber).toBe(53);
+    }
+  });
+
+  it('returns proper week number for a sample week 1 (Hebrew)', () => {
+    const year = 2018;
+    const month = 0;
+    const startDate = 1;
+
+    for (let currentDate = startDate; currentDate < startDate + 7; currentDate += 1) {
+      const date = new Date(year, month, currentDate);
+
+      const weekNumber = getWeekNumber(date, 'Hebrew');
+
+      expect(weekNumber).toBe(1);
+    }
+  });
+
+  it('returns proper week number for a sample year starting in week 1 (Hebrew)', () => {
+    const year = 2018;
+    const month = 0;
+    const startDate = 1;
+
+    for (let currentWeek = 1; currentWeek <= 52; currentWeek += 1) {
+      const weekOffset = (currentWeek - 1) * 7;
+      const date = new Date(year, month, startDate + weekOffset);
+
+      const weekNumber = getWeekNumber(date, 'Hebrew');
+
+      expect(weekNumber).toBe(currentWeek);
+    }
+  });
+
+  it('returns proper week number for a sample week 52 (Hebrew)', () => {
+    const year = 2016;
+    const month = 11;
+    const startDate = 26;
+
+    for (let currentDate = startDate; currentDate < startDate + 7; currentDate += 1) {
+      const date = new Date(year, month, currentDate);
+
+      const weekNumber = getWeekNumber(date, 'Hebrew');
+
+      expect(weekNumber).toBe(52);
+    }
+  });
+
+  it('returns proper week number for a sample week 53 (Hebrew)', () => {
+    const year = 2015;
+    const month = 11;
+    const startDate = 28;
+
+    for (let currentDate = startDate; currentDate < startDate + 7; currentDate += 1) {
+      const date = new Date(year, month, currentDate);
+
+      const weekNumber = getWeekNumber(date, 'Hebrew');
+
+      expect(weekNumber).toBe(53);
+    }
+  });
 });
@@ -1111,18 +1259,68 @@
 describe('isWeekend', () => {
-  it('returns proper flag', () => {
-    const date1 = new Date(2016, 11, 30);
-    const date2 = new Date(2016, 11, 31);
-    const date3 = new Date(2017, 0, 1);
-    const date4 = new Date(2017, 0, 2);
+  /* eslint-disable indent */
+  describe('returns proper flag (ISO 8601)', () => {
+    it.each`
+      date                      | flag
+      ${new Date(2016, 11, 30)} | ${false}
+      ${new Date(2016, 11, 31)} | ${true}
+      ${new Date(2017, 0, 1)}   | ${true}
+      ${new Date(2017, 0, 2)}   | ${false}
+    `('returns $flag for $date',
+    ({ date, flag }) => {
+      expect(isWeekend(date, 'ISO 8601')).toBe(flag);
+    });
+  });
 
-    const isWeekend1 = isWeekend(date1);
-    const isWeekend2 = isWeekend(date2);
-    const isWeekend3 = isWeekend(date3);
-    const isWeekend4 = isWeekend(date4);
+  describe('returns proper flag (US)', () => {
+    it.each`
+      date                      | flag
+      ${new Date(2016, 11, 30)} | ${false}
+      ${new Date(2016, 11, 31)} | ${true}
+      ${new Date(2017, 0, 1)}   | ${true}
+      ${new Date(2017, 0, 2)}   | ${false}
+    `('returns $flag for $date',
+    ({ date, flag }) => {
+      expect(isWeekend(date, 'US')).toBe(flag);
+    });
+  });
 
-    expect(isWeekend1).toBe(false);
-    expect(isWeekend2).toBe(true);
-    expect(isWeekend3).toBe(true);
-    expect(isWeekend4).toBe(false);
+  describe('returns proper flag (Arabic)', () => {
+    it.each`
+      date                      | flag
+      ${new Date(2016, 11, 30)} | ${true}
+      ${new Date(2016, 11, 31)} | ${true}
+      ${new Date(2017, 0, 1)}   | ${false}
+      ${new Date(2017, 0, 2)}   | ${false}
+    `('returns $flag for $date',
+    ({ date, flag }) => {
+      expect(isWeekend(date, 'Arabic')).toBe(flag);
+    });
   });
+
+  describe('returns proper flag (Hebrew)', () => {
+    it.each`
+      date                      | flag
+      ${new Date(2016, 11, 30)} | ${true}
+      ${new Date(2016, 11, 31)} | ${true}
+      ${new Date(2017, 0, 1)}   | ${false}
+      ${new Date(2017, 0, 2)}   | ${false}
+    `('returns $flag for $date',
+    ({ date, flag }) => {
+      expect(isWeekend(date, 'Hebrew')).toBe(flag);
+    });
+  });
+
+  describe('returns proper flag (default)', () => {
+    it.each`
+      date                      | flag
+      ${new Date(2016, 11, 30)} | ${false}
+      ${new Date(2016, 11, 31)} | ${true}
+      ${new Date(2017, 0, 1)}   | ${true}
+      ${new Date(2017, 0, 2)}   | ${false}
+    `('returns $flag for $date',
+    ({ date, flag }) => {
+      expect(isWeekend(date)).toBe(flag);
+    });
+  });
+  /* eslint-enable indent */
 });
@@ -1129,0 +1327,0 @@

src/shared/__tests__/utils.js

@@ -214,8 +214,18 @@ import {
 
-  it('throws an error when given value but not given other parameters ', () => {
+  it('throws an error when given date but not given dateType parameter ', () => {
     expect(
-      () => getTileClasses({ value: new Date(2017, 0, 1) }),
+      () => getTileClasses({ date: new Date(2017, 0, 1) }),
     ).toThrow();
   });
 
+  it('throws an error when given date and value but not given valueType parameter ', () => {
+    expect(
+      () => getTileClasses({
+        date: new Date(2017, 0, 1),
+        dateType: 'month',
+        value: new Date(2017, 0, 1),
+      }),
+    ).toThrow();
+  });
+
   it('returns active flag set to true when passed a value equal to date', () => {
@@ -222,0 +232,0 @@ const result = getTileClasses({

src/shared/dates.js

@@ -0,1 +1,6 @@
+const [
+  // eslint-disable-next-line no-unused-vars
+  SUNDAY, MONDAY, TUESDAY, WEDNESDAY, THURSDAY, FRIDAY, SATURDAY,
+] = Array.from(Array(7), (el, index) => index);
+
 /* Simple getters - getting a property of a given point in time */
@@ -34,2 +39,5 @@
       return (weekday + 6) % 7;
+    case 'Arabic':
+      return (weekday + 1) % 7;
+    case 'Hebrew':
     case 'US':
@@ -251,3 +259,3 @@ return weekday;
  * Gets week number according to ISO 8601 or US standard.
- * In ISO 8601 week 1 is the one with January 4.
+ * In ISO 8601, Arabic and Hebrew week 1 is the one with January 4.
  * In US calendar week 1 is the one with January 1.
@@ -259,3 +267,4 @@ *
 export const getWeekNumber = (date, calendarType = 'ISO 8601') => {
-  const beginOfWeek = getBeginOfWeek(date, calendarType);
+  const calendarTypeForWeekNumber = calendarType === 'US' ? 'US' : 'ISO 8601';
+  const beginOfWeek = getBeginOfWeek(date, calendarTypeForWeekNumber);
   let year = getYear(date) + 1;
@@ -267,4 +276,4 @@ let dayInWeekOne;
   do {
-    dayInWeekOne = new Date(year, 0, calendarType === 'ISO 8601' ? 4 : 1);
-    beginOfFirstWeek = getBeginOfWeek(dayInWeekOne, calendarType);
+    dayInWeekOne = new Date(year, 0, calendarTypeForWeekNumber === 'ISO 8601' ? 4 : 1);
+    beginOfFirstWeek = getBeginOfWeek(dayInWeekOne, calendarTypeForWeekNumber);
     year -= 1;
@@ -478,5 +487,14 @@ } while (date - beginOfFirstWeek < 0);
  */
-export const isWeekend = (date) => {
-  const weekday = getDayOfWeek(date);
-  return weekday >= 5;
+export const isWeekend = (date, calendarType = 'ISO 8601') => {
+  const weekday = date.getDay();
+  switch (calendarType) {
+    case 'Arabic':
+    case 'Hebrew':
+      return weekday === FRIDAY || weekday === SATURDAY;
+    case 'ISO 8601':
+    case 'US':
+      return weekday === SATURDAY || weekday === SUNDAY;
+    default:
+      throw new Error('Unsupported calendar type.');
+  }
 };
@@ -483,0 +501,0 @@

src/shared/propTypes.js

 import PropTypes from 'prop-types';
 
-const calendarTypes = ['ISO 8601', 'US'];
+const calendarTypes = ['ISO 8601', 'US', 'Arabic', 'Hebrew'];
 const allViews = ['century', 'decade', 'year', 'month'];
@@ -5,0 +5,0 @@

src/shared/utils.js

@@ -62,2 +62,18 @@ import { getRange } from './dates';
   const classes = [className];
+
+  if (!date) {
+    return classes;
+  }
+
+  if (!(date instanceof Array) && !dateType) {
+    throw new Error('getTileClasses(): Unable to get tile activity classes because one or more required arguments were not passed.');
+  }
+
+  const now = new Date();
+  const dateRange = date instanceof Array ? date : getRange(dateType, date);
+
+  if (isValueWithinRange(now, dateRange)) {
+    classes.push(`${className}--now`);
+  }
+
   if (!value) {
@@ -67,7 +83,3 @@ return classes;
 
-  if (
-    !date
-    || (!(value instanceof Array) && !valueType)
-    || (!(date instanceof Array) && !dateType)
-  ) {
+  if (!(value instanceof Array) && !valueType) {
     throw new Error('getTileClasses(): Unable to get tile activity classes because one or more required arguments were not passed.');
@@ -77,4 +89,2 @@ }
   const valueRange = value instanceof Array ? value : getRange(valueType, value);
-  const dateRange = date instanceof Array ? date : getRange(dateType, date);
-  const now = new Date();
 
@@ -117,7 +127,3 @@ if (isRangeWithinRange(valueRange, dateRange)) {
 
-  if (isValueWithinRange(now, dateRange)) {
-    classes.push(`${className}--now`);
-  }
-
   return classes;
 };

src/Tile.jsx

@@ -30,5 +30,5 @@ import React from 'react';
     disabled={
-      (minDate && minDateTransform(minDate) > date) ||
-      (maxDate && maxDateTransform(maxDate) < date) ||
-      (tileDisabled && tileDisabled({ date, view }))
+      (minDate && minDateTransform(minDate) > date)
+      || (maxDate && maxDateTransform(maxDate) < date)
+      || (tileDisabled && tileDisabled({ date, view }))
     }
@@ -35,0 +35,0 @@ onClick={onClick && (() => onClick(date))}

New alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

340542

increased by4.66%

Lines of code

8573

increased by5.42%

Number of lines in readme file

173

increased by9.49%

Worsened metrics

Dev dependency count

23

increased by4.55%

Number of low quality alerts

2

increased by100%

No dependency changes