Merge pull request #168 from Kiarash-Z/develop

v3.1.6

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-modern-calendar-datepicker",
-  "version": "3.1.4",
+  "version": "3.1.6",
   "description": "A modern, beautiful, customizable date picker for React",
   "main": "lib/index.js",
   "types": "index.d.ts",
@@ -49,8 +49,7 @@
     }
   ],
   "dependencies": {
-    "jalaali-js": "^1.1.0",
-    "prop-types": "^15.7.2"
+    "jalaali-js": "^1.1.0"
   },
   "peerDependencies": {
     "react": ">=16.8.0",

rollup.config.js

@@ -11,7 +11,7 @@ const config = {
     format: 'cjs',
     exports: 'named',
   },
-  external: ['react', 'react-dom', 'prop-types'],
+  external: ['react', 'react-dom'],
   plugins: [
     resolve(),
     babel({

src/Calendar.js

@@ -1,14 +1,7 @@
 import React, { useState, useRef, useEffect } from 'react';
-import PropTypes from 'prop-types';
 
 import { getDateAccordingToMonth, shallowClone, getValueType } from './shared/generalUtils';
-import {
-  DAY_SHAPE,
-  TYPE_SINGLE_DATE,
-  TYPE_RANGE,
-  TYPE_MUTLI_DATE,
-  LOCALE_SHAPE,
-} from './shared/constants';
+import { TYPE_SINGLE_DATE, TYPE_RANGE, TYPE_MUTLI_DATE } from './shared/constants';
 import { useLocaleUtils, useLocaleLanguage } from './shared/hooks';
 
 import { Header, MonthSelector, YearSelector, DaysList } from './components';
@@ -199,23 +192,4 @@ Calendar.defaultProps = {
   customDaysClassName: [],
 };
 
-Calendar.propTypes = {
-  value: PropTypes.oneOfType([
-    PropTypes.shape(DAY_SHAPE),
-    PropTypes.shape({ from: PropTypes.shape(DAY_SHAPE), to: PropTypes.shape(DAY_SHAPE) }),
-    PropTypes.arrayOf(PropTypes.shape(DAY_SHAPE)),
-  ]),
-  calendarClassName: PropTypes.string,
-  colorPrimary: PropTypes.string,
-  colorPrimaryLight: PropTypes.string,
-  slideAnimationDuration: PropTypes.string,
-  minimumDate: PropTypes.shape(DAY_SHAPE),
-  maximumDate: PropTypes.shape(DAY_SHAPE),
-  locale: PropTypes.oneOfType([PropTypes.oneOf(['en', 'fa']), LOCALE_SHAPE]),
-  renderFooter: PropTypes.func,
-  customDaysClassName: PropTypes.arrayOf(
-    PropTypes.shape({ ...DAY_SHAPE, className: PropTypes.string }),
-  ),
-};
-
 export { Calendar };

src/DatePicker.css

@@ -101,7 +101,7 @@
   outline: none !important;
 }
 
-.Calendar *:not(.Calendar__footer) button {
+.Calendar > :not(.Calendar__footer) button {
   font-family: inherit;
   background: transparent;
   cursor: pointer;

src/DatePicker.js

@@ -1,10 +1,9 @@
 import React, { useState, useEffect, useRef, useLayoutEffect } from 'react';
-import PropTypes from 'prop-types';
 
 import { Calendar } from './Calendar';
 import DatePickerInput from './DatePickerInput';
 import { getValueType } from './shared/generalUtils';
-import { TYPE_SINGLE_DATE, TYPE_MUTLI_DATE, TYPE_RANGE, LOCALE_SHAPE } from './shared/constants';
+import { TYPE_SINGLE_DATE, TYPE_MUTLI_DATE, TYPE_RANGE } from './shared/constants';
 
 const DatePicker = ({
   value,
@@ -201,10 +200,4 @@ DatePicker.defaultProps = {
   calendarPopperPosition: 'auto',
 };
 
-DatePicker.propTypes = {
-  wrapperClassName: PropTypes.string,
-  locale: PropTypes.oneOfType([PropTypes.oneOf(['en', 'fa']), LOCALE_SHAPE]),
-  calendarPopperPosition: PropTypes.oneOf(['auto', 'top', 'bottom']),
-};
-
 export default DatePicker;

src/DatePickerInput.js

@@ -1,5 +1,4 @@
 import React from 'react';
-import PropTypes from 'prop-types';
 
 import { useLocaleUtils, useLocaleLanguage } from './shared/hooks';
 import { putZero, getValueType } from './shared/generalUtils';
@@ -91,12 +90,4 @@ DatePickerInput.defaultProps = {
   inputName: '',
 };
 
-DatePickerInput.propTypes = {
-  formatInputText: PropTypes.func,
-  inputPlaceholder: PropTypes.string,
-  inputClassName: PropTypes.string,
-  inputName: PropTypes.string,
-  renderInput: PropTypes.func,
-};
-
 export default DatePickerInput;

src/components/DaysList.js

@@ -1,5 +1,4 @@
 import React, { useRef, useEffect } from 'react';
-import PropTypes from 'prop-types';
 
 import { getSlideDate, handleSlideAnimationEnd, animateContent } from '../shared/sliderHelpers';
 import {
@@ -8,7 +7,7 @@ import {
   createUniqueRange,
   getValueType,
 } from '../shared/generalUtils';
-import { DAY_SHAPE, TYPE_SINGLE_DATE, TYPE_RANGE, TYPE_MUTLI_DATE } from '../shared/constants';
+import { TYPE_SINGLE_DATE, TYPE_RANGE, TYPE_MUTLI_DATE } from '../shared/constants';
 import handleKeyboardNavigation from '../shared/keyboardNavigation';
 import { useLocaleUtils, useLocaleLanguage } from '../shared/hooks';
 
@@ -277,19 +276,6 @@ const DaysList = ({
   );
 };
 
-DaysList.propTypes = {
-  onChange: PropTypes.func,
-  onDisabledDayError: PropTypes.func,
-  disabledDays: PropTypes.arrayOf(PropTypes.shape(DAY_SHAPE)),
-  calendarTodayClassName: PropTypes.string,
-  calendarSelectedDayClassName: PropTypes.string,
-  calendarRangeStartClassName: PropTypes.string,
-  calendarRangeBetweenClassName: PropTypes.string,
-  calendarRangeEndClassName: PropTypes.string,
-  shouldHighlightWeekends: PropTypes.bool,
-  isQuickSelectorOpen: PropTypes.bool.isRequired,
-};
-
 DaysList.defaultProps = {
   onChange: () => {},
   onDisabledDayError: () => {},

src/components/YearSelector.js

@@ -1,5 +1,4 @@
 import React, { useRef, useEffect } from 'react';
-import PropTypes from 'prop-types';
 
 import { MINIMUM_SELECTABLE_YEAR_SUBTRACT, MAXIMUM_SELECTABLE_YEAR_SUM } from '../shared/constants';
 import handleKeyboardNavigation from '../shared/keyboardNavigation';
@@ -92,11 +91,6 @@ const YearSelector = ({
   );
 };
 
-YearSelector.propTypes = {
-  selectorStartingYear: PropTypes.number,
-  selectorEndingYear: PropTypes.number,
-};
-
 YearSelector.defaultProps = {
   selectorStartingYear: 0,
   selectorEndingYear: 0,

src/shared/constants.js

@@ -1,5 +1,3 @@
-import PropTypes from 'prop-types';
-
 export const PERSIAN_NUMBERS = ['۰', '۱', '۲', '۳', '۴', '۵', '۶', '۷', '۸', '۹'];
 
 export const PERSIAN_MONTHS = [
@@ -97,44 +95,10 @@ export const GREGORIAN_WEEK_DAYS = [
   },
 ];
 
-export const DAY_SHAPE = {
-  year: PropTypes.number.isRequired,
-  month: PropTypes.number.isRequired,
-  day: PropTypes.number.isRequired,
-};
-
 export const MINIMUM_SELECTABLE_YEAR_SUBTRACT = 100;
 
 export const MAXIMUM_SELECTABLE_YEAR_SUM = 50;
 
 export const TYPE_SINGLE_DATE = 'SINGLE_DATE';
 export const TYPE_RANGE = 'RANGE';
 export const TYPE_MUTLI_DATE = 'MUTLI_DATE';
-
-export const LOCALE_SHAPE = PropTypes.shape({
-  months: PropTypes.arrayOf(PropTypes.string),
-  weekDays: PropTypes.arrayOf(
-    PropTypes.shape({
-      name: PropTypes.string,
-      short: PropTypes.string,
-      isWeekend: PropTypes.bool,
-    }),
-  ),
-  weekStartingIndex: PropTypes.number,
-  getToday: PropTypes.func,
-  toNativeDate: PropTypes.func,
-  getMonthLength: PropTypes.func,
-  transformDigit: PropTypes.func,
-  nextMonth: PropTypes.string,
-  previousMonth: PropTypes.string,
-  openMonthSelector: PropTypes.string,
-  openYearSelector: PropTypes.string,
-  closeMonthSelector: PropTypes.string,
-  closeYearSelector: PropTypes.string,
-  from: PropTypes.string,
-  to: PropTypes.string,
-  defaultPlaceholder: PropTypes.string,
-  digitSeparator: PropTypes.string,
-  yearLetterSkip: PropTypes.number,
-  isRtl: PropTypes.bool,
-});

website/gatsby-config.js

@@ -3,7 +3,7 @@ module.exports = {
     title: `React Modern Calendar Date Picker`,
     description: `A modern, beautiful, customizable date picker for React`,
     author: `Kiarash Zarinmehr`,
-    version: `3.1.4`,
+    version: `3.1.6`,
   },
   pathPrefix: `/react-modern-calendar-datepicker`,
   plugins: [

website/package.json

@@ -21,7 +21,7 @@
     "react": "^16.8.6",
     "react-dom": "^16.8.6",
     "react-helmet": "^5.2.0",
-    "react-modern-calendar-datepicker": "^3.1.4",
+    "react-modern-calendar-datepicker": "^3.1.6",
     "sharp": "^0.25.2",
     "shortid": "^2.2.14"
   },

website/src/pages/docs/getting-started.js

@@ -9,7 +9,7 @@ const Installation = () => {
     <Docs title="Getting Started">
       <p className="Docs__paragraph">
         Welcome to docs! react-modern-calendar-datepicker (a quite long name!)
-        is a react date picker
+        is a React date picker
         package supporting other languages locales(for now there are <code className="custom-code">fa</code> and <code className="custom-code">en</code> locales).
         It&#39;s lightweight, and it&#39;s easy to use.
         Before using this package, please pay attention to these two important points: