react-datepicker-enhanced/dist/index.js

react datepicker component. (include persian jalaali calendar)

import momentJalaali from 'moment-jalaali';
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import TetherComponent from 'react-tether';
import classnames from 'classnames';
import onClickOutside from 'react-onclickoutside';
import Trigger from 'rc-trigger';
import ReactDom from 'react-dom';

function styleInject(css, ref) {
  if ( ref === void 0 ) ref = {};
  var insertAt = ref.insertAt;

  if (!css || typeof document === 'undefined') { return; }

  var head = document.head || document.getElementsByTagName('head')[0];
  var style = document.createElement('style');
  style.type = 'text/css';

  if (insertAt === 'top') {
    if (head.firstChild) {
      head.insertBefore(style, head.firstChild);
    } else {
      head.appendChild(style);
    }
  } else {
    head.appendChild(style);
  }

  if (style.styleSheet) {
    style.styleSheet.cssText = css;
  } else {
    style.appendChild(document.createTextNode(css));
  }
}

var css_248z = ".calendarContainer{position:relative;border-radius:4px;-webkit-box-shadow:0 3px 15px rgba(0,0,0,.2);box-shadow:0 3px 15px rgba(0,0,0,.2);width:320px;margin:auto;text-align:center;padding:15px;background-color:#fff}.calendarContainer *{-webkit-box-sizing:border-box;box-sizing:border-box}.calendarContainer .dayPickerContainer:after,.calendarContainer .daysOfWeek:after,.calendarContainer .monthsList:after{content:'';display:block;clear:both}.datepicker-input{-webkit-box-sizing:border-box;box-sizing:border-box}.calendarContainer .heading{height:auto;font-weight:700;margin-bottom:10px}.calendarContainer .heading>button{background:0 0;margin:5px 0;border:none;text-align:center;line-height:30px;width:36px;height:32px;cursor:pointer}.calendarContainer .heading>button:hover{background-color:#f2f2f2}.calendarContainer .heading svg{width:10px;fill:#777}.calendarContainer .heading .next,.calendarContainer .heading .prev{width:42px;height:42px;border-radius:50%;margin:0}.calendarContainer .heading .prev{float:right}.calendarContainer .heading .next{float:left}.calendarContainer .heading .title{height:auto;border-radius:4px;width:auto;margin:0 5px;border:1px solid #f7f7f7;text-align:center;display:inline-block;font-weight:400;padding:4px 15px 5px 15px;line-height:1.5;font-size:1.2em;max-height:none}.jalaali.calendarContainer .heading .title{padding:4px 15px 7px 15px}.calendarContainer .dayWrapper{float:left;width:14.28571429%;margin-top:5px;position:relative}.calendarContainer .dayWrapper button{border:none;background:0 0;outline:0;width:100%;cursor:pointer;width:40px;height:40px;border-radius:50%;font-size:1.1em;padding:0;line-height:1.5;padding:0 0 1px 0}.jalaali.calendarContainer .dayWrapper button{padding:0 0 1px 0}.calendarContainer .dayWrapper button:hover{background-color:#d6f1ff}.calendarContainer .dayWrapper button[disabled]{color:#aaa;cursor:not-allowed;background-color:#ebebeb}.calendarContainer .dayWrapper button.selected{background-color:#337ab7;color:#fff}.calendarContainer .dayWrapper:not(.currentMonth) button{opacity:.5}.calendarContainer .daysOfWeek{margin-bottom:5px;padding-bottom:5px;display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;color:#919191}.calendarContainer .daysOfWeek>div{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;width:42px}.calendarContainer .monthsList{clear:both;width:100%}.calendarContainer .monthsList button{width:33.33333332%;height:25%;float:right;border:1px solid #f9f9f9;outline:0;font-size:1em;background:#fff;padding:10px 0;cursor:pointer}.calendarContainer .monthsList button:hover{background:#eee;cursor:pointer}.calendarContainer .selected button,.calendarContainer .selected button:active,.calendarContainer .selected button:focus,.calendarContainer .selected button:hover{background-color:#4285f4;color:#fff}.calendarContainer.jalaali{direction:rtl}.calendarContainer.jalaali .dayWrapper{float:right}.time-picker-container{margin-bottom:10}.time-picker-container>.time-label{float:left;line-height:30px;width:50%;text-align:center}.time-picker-container>.time-picker-panel{float:right;width:50%}.time-picker-container.jalaali>.time-label{float:right}.time-picker-container.jalaali>.time-picker-panel{float:left}.rc-time-picker{border-radius:4px;display:inline-block;-webkit-box-sizing:border-box;box-sizing:border-box;width:110px;border:1px solid #f7f7f7;font-size:1.2em}.rc-time-picker *{-webkit-box-sizing:border-box;box-sizing:border-box}.rc-time-picker-input{margin:4px 0;padding:0 15px 1px 15px;direction:ltr;text-align:center;width:100%;position:relative;display:inline-block;cursor:pointer;font-size:1em;line-height:1.5;border:none;background-image:none;background-color:transparent;-webkit-box-shadow:none;box-shadow:none}.jalaali.calendarContainer .rc-time-picker-input{padding:0 15px 3px 15px}.rc-time-picker-input:focus{-webkit-box-shadow:none;box-shadow:none;border:none;background-color:#f2f2f2}.rc-time-picker:hover{background-color:#f2f2f2}.rc-time-picker-panel{z-index:2001;width:170px;position:absolute;-webkit-box-sizing:border-box;box-sizing:border-box}.rc-time-picker-panel *{-webkit-box-sizing:border-box;box-sizing:border-box}.rc-time-picker-panel-inner{display:inline-block;position:relative;outline:0;list-style:none;font-size:12px;text-align:left;background-color:#fff;border-radius:3px;-webkit-box-shadow:0 1px 5px #ccc;box-shadow:0 1px 5px #ccc;background-clip:padding-box;border:1px solid #ccc;line-height:1.5}.rc-time-picker-panel-input{margin:0;padding:0;width:100%;cursor:default;line-height:1.5;outline:0;border:1px solid transparent;padding:4px 0;font-size:1.4em;text-align:center;font-family:inherit}.rc-time-picker-panel-input,.rc-time-picker-panel-input:hover{-webkit-box-shadow:none;box-shadow:none;border:none}.rc-time-picker-panel-input-wrap{-webkit-box-sizing:border-box;box-sizing:border-box;position:relative;padding:6px;border-bottom:1px solid #e9e9e9}.rc-time-picker-panel-input-invalid{border-color:red}.rc-time-picker-panel-clear-btn{position:absolute;right:6px;cursor:pointer;overflow:hidden;width:20px;height:20px;text-align:center;line-height:20px;top:6px;margin:0}.rc-time-picker-panel-clear-btn:after{content:\"x\";font-size:12px;color:#aaa;display:inline-block;line-height:1;width:20px;-webkit-transition:color .3s ease;transition:color .3s ease}.rc-time-picker-panel-clear-btn:hover:after{color:#666}.rc-time-picker-panel-select{float:left;font-size:12px;border:1px solid #e9e9e9;border-width:0 1px;margin-left:-1px;-webkit-box-sizing:border-box;box-sizing:border-box;width:56px;overflow:hidden;position:relative}.rc-time-picker-panel-select-active{overflow-y:auto}.rc-time-picker-panel-select:first-child{border-left:0;margin-left:0}.rc-time-picker-panel-select:last-child{border-right:0}.rc-time-picker-panel-select ul{list-style:none;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;width:100%;max-height:144px;overflow-x:hidden;overflow-y:scroll}.rc-time-picker-panel-select li{list-style:none;-webkit-box-sizing:content-box;box-sizing:content-box;margin:0;padding:0 0 0 16px;width:100%;height:24px;line-height:24px;text-align:left;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.rc-time-picker-panel-select li:hover{background:#edfaff}li.rc-time-picker-panel-select-option-selected{background:#edfaff;color:#2db7f5}li.rc-time-picker-panel-select-option-disabled{color:#bfbfbf}li.rc-time-picker-panel-select-option-disabled:hover{background:0 0;cursor:not-allowed}.tether-element.tether-element-attached-top.tether-element-attached-center.tether-target-attached-bottom.tether-target-attached-center.tether-enabled{z-index:2000}.calendarContainer *,.datepicker-input{font-family:inherit}.today button{border:3px solid #4285f4!important}.jalaali.calendarContainer .selectToday{padding:4px 0 6px 0}.calendarButton{display:block;width:100%;background:#4285f4;color:#fff;outline:0;border-radius:5px;border:0;cursor:pointer;padding:5px 0 7px 0;-webkit-transition:.2s all ease-in-out;transition:.2s all ease-in-out;-webkit-transition-property:background;transition-property:background}.calendarButton:hover{background:#1266f1}.toggleButton{margin-bottom:1rem}.selectToday{margin-top:1rem}.highLightDot-container{text-align:center;bottom:0;width:100%;position:absolute;cursor:pointer;direction:ltr}.highLightDot-container .highLightDot{border:1px solid #fff;display:inline-block;width:7px;height:7px;border-radius:50%}.highLightDot-container .highLightDot:not(:first-child){margin-left:2px}";
styleInject(css_248z);

function _classCallCheck(instance, Constructor) {
  if (!(instance instanceof Constructor)) {
    throw new TypeError("Cannot call a class as a function");
  }
}

var classCallCheck = _classCallCheck;

function _defineProperties(target, props) {
  for (var i = 0; i < props.length; i++) {
    var descriptor = props[i];
    descriptor.enumerable = descriptor.enumerable || false;
    descriptor.configurable = true;
    if ("value" in descriptor) descriptor.writable = true;
    Object.defineProperty(target, descriptor.key, descriptor);
  }
}

function _createClass(Constructor, protoProps, staticProps) {
  if (protoProps) _defineProperties(Constructor.prototype, protoProps);
  if (staticProps) _defineProperties(Constructor, staticProps);
  return Constructor;
}

var createClass = _createClass;

function _assertThisInitialized(self) {
  if (self === void 0) {
    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
  }

  return self;
}

var assertThisInitialized = _assertThisInitialized;

function createCommonjsModule(fn, module) {
	return module = { exports: {} }, fn(module, module.exports), module.exports;
}

var _typeof_1 = createCommonjsModule(function (module) {
function _typeof(obj) {
  "@babel/helpers - typeof";

  if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
    module.exports = _typeof = function _typeof(obj) {
      return typeof obj;
    };
  } else {
    module.exports = _typeof = function _typeof(obj) {
      return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
    };
  }

  return _typeof(obj);
}

module.exports = _typeof;
});

function _possibleConstructorReturn(self, call) {
  if (call && (_typeof_1(call) === "object" || typeof call === "function")) {
    return call;
  }

  return assertThisInitialized(self);
}

var possibleConstructorReturn = _possibleConstructorReturn;

var getPrototypeOf = createCommonjsModule(function (module) {
function _getPrototypeOf(o) {
  module.exports = _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
    return o.__proto__ || Object.getPrototypeOf(o);
  };
  return _getPrototypeOf(o);
}

module.exports = _getPrototypeOf;
});

var setPrototypeOf = createCommonjsModule(function (module) {
function _setPrototypeOf(o, p) {
  module.exports = _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
    o.__proto__ = p;
    return o;
  };

  return _setPrototypeOf(o, p);
}

module.exports = _setPrototypeOf;
});

function _inherits(subClass, superClass) {
  if (typeof superClass !== "function" && superClass !== null) {
    throw new TypeError("Super expression must either be null or a function");
  }

  subClass.prototype = Object.create(superClass && superClass.prototype, {
    constructor: {
      value: subClass,
      writable: true,
      configurable: true
    }
  });
  if (superClass) setPrototypeOf(subClass, superClass);
}

var inherits = _inherits;

function _defineProperty(obj, key, value) {
  if (key in obj) {
    Object.defineProperty(obj, key, {
      value: value,
      enumerable: true,
      configurable: true,
      writable: true
    });
  } else {
    obj[key] = value;
  }

  return obj;
}

var defineProperty = _defineProperty;

var latinToPersianMap = ['۱', '۲', '۳', '۴', '۵', '۶', '۷', '۸', '۹', '۰'];
var latinNumbers = [/1/g, /2/g, /3/g, /4/g, /5/g, /6/g, /7/g, /8/g, /9/g, /0/g];

function prepareNumber(input) {
  var string;

  if (typeof input === 'number') {
    string = input.toString();
  } else if (typeof input === 'undefined') {
    string = '';
  } else {
    string = input;
  }

  return string;
}

function latinToPersian(string) {
  var result = string;

  for (var index = 0; index < 10; index++) {
    result = result.replace(latinNumbers[index], latinToPersianMap[index]);
  }

  return result;
}

function persianNumber(input) {
  return latinToPersian(prepareNumber(input));
}

var leftArrow = {
  __html: '<svg version="1.1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 314.5 314.5" style="enable-background:new 0 0 314.5 314.5;" xml:space="preserve"><g><path class="arrow-icon" d="M125,157.5l116-116c10-10,10-24,0-34s-25-10-35,0l-133,133c-5,5-7,10-7,17s2,12,7,17l133,133c5,5,11,7,17,7s13-2,18-7c10-10,10-24,0-34L125,157.5z"/></g></svg>'
};
var rightArrow = {
  __html: '<svg version="1.1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 315.5 315.5" style="enable-background:new 0 0 315.5 315.5;" xml:space="preserve"><g><path class="arrow-icon" d="M242,141L109,8c-5-5-12-8-18-8S79,3,74,8c-10,10-10,24,0,34l116,116L74,274c-10,10-10,24,0,34s25,10,35,0l133-133c5-5,7-11,7-17C249,151,247,146,242,141z"/></g></svg>'
};

function _createSuper(Derived) { return function () { var Super = getPrototypeOf(Derived), result; if (_isNativeReflectConstruct()) { var NewTarget = getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return possibleConstructorReturn(this, result); }; }

function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }

var Heading = /*#__PURE__*/function (_Component) {
  inherits(Heading, _Component);

  var _super = _createSuper(Heading);

  function Heading() {
    classCallCheck(this, Heading);

    return _super.apply(this, arguments);
  }

  createClass(Heading, [{
    key: "handleMonthClick",
    value: function handleMonthClick(event) {
      var setCalendarMode = this.context.setCalendarMode;
      event.preventDefault();
      setCalendarMode('monthSelector');
    }
  }, {
    key: "render",
    value: function render() {
      var _this$context = this.context,
          nextMonth = _this$context.nextMonth,
          prevMonth = _this$context.prevMonth;
      var _this$props = this.props,
          month = _this$props.month,
          styles = _this$props.styles;
      return /*#__PURE__*/React.createElement("div", {
        className: styles.heading
      }, /*#__PURE__*/React.createElement("button", {
        className: styles.title,
        onClick: this.handleMonthClick.bind(this)
      }, this.props.isGregorian ? month.locale('en').format('MMMM YYYY') : persianNumber(month.locale('fa').format('jMMMM jYYYY'))), this.props.timePicker, !this.props.isGregorian && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("button", {
        type: "button",
        title: "\u0645\u0627\u0647 \u0642\u0628\u0644",
        className: styles.prev,
        onClick: prevMonth,
        dangerouslySetInnerHTML: rightArrow
      }), /*#__PURE__*/React.createElement("button", {
        type: "button",
        title: "\u0645\u0627\u0647 \u0628\u0639\u062F",
        className: styles.next,
        onClick: nextMonth,
        dangerouslySetInnerHTML: leftArrow
      })), this.props.isGregorian && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("button", {
        type: "button",
        title: "prev month",
        className: styles.next,
        onClick: prevMonth,
        dangerouslySetInnerHTML: leftArrow
      }), /*#__PURE__*/React.createElement("button", {
        type: "button",
        title: "next month",
        className: styles.prev,
        onClick: nextMonth,
        dangerouslySetInnerHTML: rightArrow
      })));
    }
  }]);

  return Heading;
}(Component);

defineProperty(Heading, "propTypes", {
  month: PropTypes.object.isRequired,
  isGregorian: PropTypes.bool
});

defineProperty(Heading, "contextTypes", {
  styles: PropTypes.object,
  nextMonth: PropTypes.func.isRequired,
  prevMonth: PropTypes.func.isRequired,
  setCalendarMode: PropTypes.func.isRequired
});

function _createSuper$1(Derived) { return function () { var Super = getPrototypeOf(Derived), result; if (_isNativeReflectConstruct$1()) { var NewTarget = getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return possibleConstructorReturn(this, result); }; }

function _isNativeReflectConstruct$1() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }

var dayOfWeekNamesJalaali = ['ش', 'ی', 'د', 'س', 'چ', 'پ', 'ج'];
var dayOfWeekNamesGregorian = ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'];

var DaysOfWeek = /*#__PURE__*/function (_Component) {
  inherits(DaysOfWeek, _Component);

  var _super = _createSuper$1(DaysOfWeek);

  function DaysOfWeek() {
    classCallCheck(this, DaysOfWeek);

    return _super.apply(this, arguments);
  }

  createClass(DaysOfWeek, [{
    key: "render",
    value: function render() {
      var _this$props = this.props,
          styles = _this$props.styles,
          isGregorian = _this$props.isGregorian;
      var dayOfWeekNames = isGregorian ? dayOfWeekNamesGregorian : dayOfWeekNamesJalaali;
      return /*#__PURE__*/React.createElement("div", {
        className: styles.daysOfWeek
      }, dayOfWeekNames.map(function (name, key) {
        return /*#__PURE__*/React.createElement("div", {
          key: key
        }, name);
      }));
    }
  }]);

  return DaysOfWeek;
}(Component);

defineProperty(DaysOfWeek, "propTypes", {
  styles: PropTypes.object,
  isGregorian: PropTypes.bool
});

function _createSuper$2(Derived) { return function () { var Super = getPrototypeOf(Derived), result; if (_isNativeReflectConstruct$2()) { var NewTarget = getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return possibleConstructorReturn(this, result); }; }

function _isNativeReflectConstruct$2() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }

var MonthsViewHeading = /*#__PURE__*/function (_Component) {
  inherits(MonthsViewHeading, _Component);

  var _super = _createSuper$2(MonthsViewHeading);

  function MonthsViewHeading() {
    classCallCheck(this, MonthsViewHeading);

    return _super.apply(this, arguments);
  }

  createClass(MonthsViewHeading, [{
    key: "render",
    value: function render() {
      var _this$props = this.props,
          year = _this$props.year,
          styles = _this$props.styles,
          type = _this$props.type,
          isGregorian = _this$props.isGregorian;
      var yearFormat = isGregorian ? 'YYYY' : 'jYYYY';
      return /*#__PURE__*/React.createElement("div", {
        className: styles.heading
      }, /*#__PURE__*/React.createElement("span", {
        className: styles.title
      }, isGregorian ? year.format(yearFormat) : persianNumber(year.format(yearFormat))), /*#__PURE__*/React.createElement("button", {
        type: "button",
        title: isGregorian ? 'before year' : 'سال قبل',
        style: styles.navButton,
        className: styles.prev,
        onClick: this.props.onPrevYear,
        dangerouslySetInnerHTML: rightArrow
      }), /*#__PURE__*/React.createElement("button", {
        type: "button",
        title: isGregorian ? 'next year' : 'سال بعد',
        style: styles.navButton,
        className: styles.next,
        onClick: this.props.onNextYear,
        dangerouslySetInnerHTML: leftArrow
      }));
    }
  }]);

  return MonthsViewHeading;
}(Component);

defineProperty(MonthsViewHeading, "propTypes", {
  year: PropTypes.object.isRequired,
  onNextYear: PropTypes.func.isRequired,
  onPrevYear: PropTypes.func.isRequired,
  isGregorian: PropTypes.bool
});

defineProperty(MonthsViewHeading, "contextTypes", {
  styles: PropTypes.object,
  type: PropTypes.number
});

function _createSuper$3(Derived) { return function () { var Super = getPrototypeOf(Derived), result; if (_isNativeReflectConstruct$3()) { var NewTarget = getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return possibleConstructorReturn(this, result); }; }

function _isNativeReflectConstruct$3() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }

var monthsJalaali = ['فروردین', 'اردیبهشت', 'خرداد', 'تیر', 'مرداد', 'شهریور', 'مهر', 'آبان', 'آذر', 'دی', 'بهمن', 'اسفند'];
var monthsGregorian = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];

var MonthSelector = /*#__PURE__*/function (_Component) {
  inherits(MonthSelector, _Component);

  var _super = _createSuper$3(MonthSelector);

  function MonthSelector() {
    var _this;

    classCallCheck(this, MonthSelector);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = _super.call.apply(_super, [this].concat(args));

    defineProperty(assertThisInitialized(_this), "state", {
      year: _this.props.selectedMonth
    });

    return _this;
  }

  createClass(MonthSelector, [{
    key: "nextYear",
    value: function nextYear() {
      this.setState({
        year: this.state.year.clone().add(1, 'year')
      });
    }
  }, {
    key: "prevYear",
    value: function prevYear() {
      this.setState({
        year: this.state.year.clone().subtract(1, 'year')
      });
    }
  }, {
    key: "handleClick",
    value: function handleClick(key) {
      var _this$context = this.context,
          setMonth = _this$context.setMonth,
          setCalendarMode = _this$context.setCalendarMode;
      var isGregorian = this.props.isGregorian;
      var monthYearFormat = isGregorian ? 'M-YYYY' : 'jM-jYYYY';
      setMonth(momentJalaali(key, monthYearFormat));
      setCalendarMode('days');
    }
  }, {
    key: "render",
    value: function render() {
      var _this2 = this;

      var year = this.state.year;
      var _this$props = this.props,
          selectedMonth = _this$props.selectedMonth,
          styles = _this$props.styles,
          isGregorian = _this$props.isGregorian;
      var yearFormat = isGregorian ? 'YYYY' : 'jYYYY';
      var monthYearFormat = isGregorian ? 'M-YYYY' : 'jM-jYYYY';
      var months = isGregorian ? monthsGregorian : monthsJalaali;
      return /*#__PURE__*/React.createElement("div", {
        className: "month-selector"
      }, /*#__PURE__*/React.createElement(MonthsViewHeading, {
        isGregorian: isGregorian,
        styles: styles,
        year: year,
        onNextYear: this.nextYear.bind(this),
        onPrevYear: this.prevYear.bind(this)
      }), /*#__PURE__*/React.createElement("div", {
        className: styles.monthsList
      }, months.map(function (name, key) {
        var buttonFingerprint = "".concat(key + 1, "-").concat(year.format(yearFormat));
        var selectedMonthFingerprint = selectedMonth.format(monthYearFormat);
        var isCurrent = selectedMonthFingerprint === buttonFingerprint;
        var className = classnames(styles.monthWrapper, defineProperty({}, styles.selected, isCurrent));
        return /*#__PURE__*/React.createElement("div", {
          key: key,
          className: className
        }, /*#__PURE__*/React.createElement("button", {
          onClick: _this2.handleClick.bind(_this2, buttonFingerprint)
        }, name));
      })));
    }
  }]);

  return MonthSelector;
}(Component);

defineProperty(MonthSelector, "propTypes", {
  styles: PropTypes.object,
  selectedMonth: PropTypes.object.isRequired,
  isGregorian: PropTypes.bool
});

defineProperty(MonthSelector, "contextTypes", {
  setCalendarMode: PropTypes.func.isRequired,
  setMonth: PropTypes.func.isRequired
});

var _extends_1 = createCommonjsModule(function (module) {
function _extends() {
  module.exports = _extends = Object.assign || function (target) {
    for (var i = 1; i < arguments.length; i++) {
      var source = arguments[i];

      for (var key in source) {
        if (Object.prototype.hasOwnProperty.call(source, key)) {
          target[key] = source[key];
        }
      }
    }

    return target;
  };

  return _extends.apply(this, arguments);
}

module.exports = _extends;
});

function _objectWithoutPropertiesLoose(source, excluded) {
  if (source == null) return {};
  var target = {};
  var sourceKeys = Object.keys(source);
  var key, i;

  for (i = 0; i < sourceKeys.length; i++) {
    key = sourceKeys[i];
    if (excluded.indexOf(key) >= 0) continue;
    target[key] = source[key];
  }

  return target;
}

var objectWithoutPropertiesLoose = _objectWithoutPropertiesLoose;

function _objectWithoutProperties(source, excluded) {
  if (source == null) return {};
  var target = objectWithoutPropertiesLoose(source, excluded);
  var key, i;

  if (Object.getOwnPropertySymbols) {
    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);

    for (i = 0; i < sourceSymbolKeys.length; i++) {
      key = sourceSymbolKeys[i];
      if (excluded.indexOf(key) >= 0) continue;
      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
      target[key] = source[key];
    }
  }

  return target;
}

var objectWithoutProperties = _objectWithoutProperties;

function _createSuper$4(Derived) { return function () { var Super = getPrototypeOf(Derived), result; if (_isNativeReflectConstruct$4()) { var NewTarget = getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return possibleConstructorReturn(this, result); }; }

function _isNativeReflectConstruct$4() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }

var Day = /*#__PURE__*/function (_Component) {
  inherits(Day, _Component);

  var _super = _createSuper$4(Day);

  function Day() {
    classCallCheck(this, Day);

    return _super.apply(this, arguments);
  }

  createClass(Day, [{
    key: "shouldComponentUpdate",
    value: function shouldComponentUpdate(nextProps) {
      return nextProps.selected !== this.props.selected || nextProps.disabled !== this.props.disabled || nextProps.isCurrentMonth !== this.props.isCurrentMonth;
    }
  }, {
    key: "handleClick",
    value: function handleClick(event) {
      event.preventDefault();
      event.stopPropagation();
      event.nativeEvent.stopImmediatePropagation();
      var _this$props = this.props,
          onClick = _this$props.onClick,
          day = _this$props.day;

      if (onClick) {
        onClick(day);
      }
    }
  }, {
    key: "render",
    value: function render() {
      var _classnames;

      var _this$props2 = this.props,
          day = _this$props2.day,
          disabled = _this$props2.disabled,
          selected = _this$props2.selected,
          isCurrentMonth = _this$props2.isCurrentMonth,
          onClick = _this$props2.onClick,
          styles = _this$props2.styles,
          isGregorian = _this$props2.isGregorian,
          isToday = _this$props2.isToday,
          colors = _this$props2.colors,
          rest = objectWithoutProperties(_this$props2, ["day", "disabled", "selected", "isCurrentMonth", "onClick", "styles", "isGregorian", "isToday", "colors"]);

      var className = classnames(styles.dayWrapper, (_classnames = {}, defineProperty(_classnames, styles.selected, selected), defineProperty(_classnames, styles.currentMonth, isCurrentMonth), defineProperty(_classnames, styles.today, isToday), _classnames));
      return /*#__PURE__*/React.createElement("div", {
        className: className
      }, /*#__PURE__*/React.createElement("button", _extends_1({
        type: "button",
        onClick: this.handleClick.bind(this),
        disabled: disabled
      }, rest), isGregorian ? day.format('D') : persianNumber(day.format('jD'))), /*#__PURE__*/React.createElement("div", {
        className: "highLightDot-container",
        onClick: this.handleClick.bind(this)
      }, colors.map(function (x, i) {
        return /*#__PURE__*/React.createElement("span", {
          key: i,
          className: "highLightDot",
          style: {
            backgroundColor: x
          }
        });
      })));
    }
  }]);

  return Day;
}(Component);

defineProperty(Day, "propTypes", {
  day: PropTypes.object.isRequired,
  isCurrentMonth: PropTypes.bool,
  disabled: PropTypes.bool,
  selected: PropTypes.bool,
  onClick: PropTypes.func,
  isGregorian: PropTypes.bool
});

/**
 * Get days of a month that should be shown on a month page
 *
 * @param month A moment object
 * @returns {Array}
 */
function getDaysOfMonth(month, isGregorian) {
  var days = [];
  var monthFormat = isGregorian ? 'Month' : 'jMonth';
  var dayOffset = isGregorian ? 0 : 1;
  var current = month.clone().startOf(monthFormat);
  var end = month.clone().endOf(monthFormat); // Set start to the first day of week in the last month

  current.subtract((current.day() + dayOffset) % 7, 'days'); // Set end to the last day of week in the next month

  end.add(6 - (end.day() + dayOffset) % 7, 'days');

  while (current.isBefore(end)) {
    days.push(current.clone());
    current.add(1, 'days');
  }

  return days;
}
function addZero(val) {
  val = Number(val);
  if (val < 10) return "0".concat(val);
  return val;
}
function checkToday(compare) {
  var today = new Date();
  var todayString = String(today.getFullYear()) + addZero(String(today.getMonth() + 1)) + addZero(String(today.getDate()));
  return compare === todayString;
}

var defaultStyles = {
  calendarContainer: 'calendarContainer',
  heading: 'heading',
  prev: 'prev',
  next: 'next',
  title: 'title',
  dayWrapper: 'dayWrapper',
  currentMonth: 'currentMonth',
  daysOfWeek: 'daysOfWeek',
  monthsList: 'monthsList',
  selected: 'selected',
  today: 'today',
  dayPickerContainer: 'dayPickerContainer'
};

var MomentRange = require('moment-range');

var extendedMoment = MomentRange.extendMoment(momentJalaali);

var RangesList = /*#__PURE__*/function () {
  function RangesList(ranges) {
    var _this = this;

    classCallCheck(this, RangesList);

    this.ranges = [];

    if (ranges) {
      ranges.forEach(function (item) {
        _this.validateRangeObject(item);

        var range = extendedMoment.range(item.start, item.end); // include start

        var start = range.start.add(-1, 'days');

        _this.ranges.push({
          color: item.color,
          range: range,
          disabled: !!item.disabled
        });
      });
    }
  }

  createClass(RangesList, [{
    key: "getDayState",
    value: function getDayState(day) {
      var disabled = this.ranges.some(function (x) {
        return x.disabled && x.range.contains(day);
      });
      var colors = this.ranges.filter(function (x) {
        return x.color && x.range.contains(day);
      }).map(function (x) {
        return x.color;
      });
      return {
        disabled: disabled,
        colors: colors
      };
    }
  }, {
    key: "validateRangeObject",
    value: function validateRangeObject(range) {
      if (!('start' in range)) throw "'start' property is a required property of 'range' object.\n            range object: ".concat(JSON.stringify(range));
      if (!('end' in range)) throw "'end' property is a required property of 'range' object.\n            range object: ".concat(JSON.stringify(range));
    }
  }]);

  return RangesList;
}();

function _createSuper$5(Derived) { return function () { var Super = getPrototypeOf(Derived), result; if (_isNativeReflectConstruct$5()) { var NewTarget = getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return possibleConstructorReturn(this, result); }; }

function _isNativeReflectConstruct$5() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
var Calendar = /*#__PURE__*/function (_Component) {
  inherits(Calendar, _Component);

  var _super = _createSuper$5(Calendar);

  function Calendar() {
    var _this;

    classCallCheck(this, Calendar);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = _super.call.apply(_super, [this].concat(args));

    defineProperty(assertThisInitialized(_this), "state", {
      month: _this.props.defaultMonth || _this.props.selectedDay || momentJalaali(_this.props.min),
      selectedDay: _this.props.selectedDay || _this.props.value || momentJalaali(),
      mode: 'days',
      isGregorian: _this.props.isGregorian,
      ranges: new RangesList(_this.props.ranges)
    });

    defineProperty(assertThisInitialized(_this), "setMode", function (mode) {
      _this.setState({
        mode: mode
      });
    });

    defineProperty(assertThisInitialized(_this), "setMonth", function (month) {
      var onMonthChange = _this.props.onMonthChange;

      _this.setState({
        month: month
      });

      if (onMonthChange) {
        onMonthChange(month);
      }
    });

    defineProperty(assertThisInitialized(_this), "setType", function (type) {
      _this.setState({
        type: type
      });
    });

    defineProperty(assertThisInitialized(_this), "nextMonth", function () {
      var isGregorian = _this.state.isGregorian;
      var monthFormat = isGregorian ? 'Month' : 'jMonth';

      _this.setState({
        month: _this.state.month.clone().add(1, monthFormat)
      }, function () {
        return _this.props.onMonthChange && _this.props.onMonthChange(_this.state.month);
      });
    });

    defineProperty(assertThisInitialized(_this), "prevMonth", function () {
      var isGregorian = _this.state.isGregorian;
      var monthFormat = isGregorian ? 'Month' : 'jMonth';

      _this.setState({
        month: _this.state.month.clone().subtract(1, monthFormat)
      }, function () {
        return _this.props.onMonthChange && _this.props.onMonthChange(_this.state.month);
      });
    });

    defineProperty(assertThisInitialized(_this), "selectDay", function (selectedDay) {
      var _this$state = _this.state,
          month = _this$state.month,
          isGregorian = _this$state.isGregorian;
      var yearMonthFormat = isGregorian ? 'YYYYMM' : 'jYYYYjMM'; // Because there's no `m1.isSame(m2, 'jMonth')`

      if (selectedDay.format(yearMonthFormat) !== month.format(yearMonthFormat)) {
        _this.setState({
          month: selectedDay
        });
      }

      _this.setState({
        selectedDay: selectedDay
      });
    });

    defineProperty(assertThisInitialized(_this), "handleClickOnDay", function (selectedDay) {
      var _this$props = _this.props,
          onSelect = _this$props.onSelect,
          onChange = _this$props.onChange;

      _this.selectDay(selectedDay);

      if (onSelect) {
        onSelect(selectedDay);
      }

      if (onChange) onChange(selectedDay);
    });

    defineProperty(assertThisInitialized(_this), "handleClickOutside", function (event) {
      if (_this.props.onClickOutside) {
        _this.props.onClickOutside(event);
      }
    });

    defineProperty(assertThisInitialized(_this), "days", null);

    defineProperty(assertThisInitialized(_this), "lastRenderedMonth", null);

    defineProperty(assertThisInitialized(_this), "renderMonthSelector", function () {
      var _this$state2 = _this.state,
          month = _this$state2.month,
          isGregorian = _this$state2.isGregorian;
      var styles = _this.props.styles;
      return /*#__PURE__*/React.createElement(MonthSelector, {
        styles: styles,
        isGregorian: isGregorian,
        selectedMonth: month
      });
    });

    defineProperty(assertThisInitialized(_this), "renderDays", function () {
      var _this$state3 = _this.state,
          month = _this$state3.month,
          selectedDay = _this$state3.selectedDay,
          isGregorian = _this$state3.isGregorian;
      var _this$props2 = _this.props,
          children = _this$props2.children,
          min = _this$props2.min,
          max = _this$props2.max,
          styles = _this$props2.styles,
          outsideClickIgnoreClass = _this$props2.outsideClickIgnoreClass;
      var days;

      if (_this.lastRenderedMonth === month) {
        days = _this.days;
      } else {
        days = getDaysOfMonth(month, isGregorian);
        _this.days = days;
        _this.lastRenderedMonth = month;
      }

      var monthFormat = isGregorian ? 'MM' : 'jMM';
      var dateFormat = isGregorian ? 'YYYYMMDD' : 'jYYYYjMMjDD';
      return /*#__PURE__*/React.createElement("div", {
        className: _this.props.calendarClass
      }, children, /*#__PURE__*/React.createElement(Heading, {
        timePicker: _this.props.timePicker,
        isGregorian: isGregorian,
        styles: styles,
        month: month
      }), /*#__PURE__*/React.createElement(DaysOfWeek, {
        styles: styles,
        isGregorian: isGregorian
      }), /*#__PURE__*/React.createElement("div", {
        className: styles.dayPickerContainer
      }, days.map(function (day) {
        var isCurrentMonth = day.format(monthFormat) === month.format(monthFormat);
        var selected = selectedDay ? selectedDay.isSame(day, 'day') : false;
        var key = day.format(dateFormat);
        var isToday = checkToday(day.format('YYYYMMDD')); // disabling by old min-max props

        var disabled = (min ? day.isBefore(min) : false) || (max ? day.isAfter(max) : false); // new method for disabling and highlighting the ranges of days

        var dayState = _this.state.ranges.getDayState(day);

        return /*#__PURE__*/React.createElement(Day, {
          isGregorian: isGregorian,
          key: key,
          onClick: _this.handleClickOnDay,
          day: day,
          isToday: isToday,
          colors: dayState.colors,
          disabled: disabled || dayState.disabled // disabled by old method or new range method
          ,
          selected: selected,
          isCurrentMonth: isCurrentMonth,
          styles: styles
        });
      })));
    });

    return _this;
  }

  createClass(Calendar, [{
    key: "getChildContext",
    value: function getChildContext() {
      return {
        nextMonth: this.nextMonth.bind(this),
        prevMonth: this.prevMonth.bind(this),
        setCalendarMode: this.setMode.bind(this),
        setMonth: this.setMonth.bind(this),
        setType: this.setMonth.bind(this)
      };
    }
  }, {
    key: "UNSAFE_componentWillReceiveProps",
    value: function UNSAFE_componentWillReceiveProps(_ref) {
      var selectedDay = _ref.selectedDay,
          defaultMonth = _ref.defaultMonth,
          min = _ref.min,
          isGregorian = _ref.isGregorian,
          ranges = _ref.ranges;

      if (typeof isGregorian !== 'undefined' && isGregorian !== this.state.isGregorian) {
        this.setState({
          isGregorian: isGregorian
        });
      }

      if (this.props.selectedDay !== selectedDay) {
        this.selectDay(selectedDay || momentJalaali());
      } else if (defaultMonth && this.props.defaultMonth !== defaultMonth && this.state.month === this.props.defaultMonth) {
        this.setMonth(defaultMonth);
      } else if (min && this.props.min !== min && this.state.month.isSame(this.props.min)) {
        this.setMonth(min.clone());
      }

      if (JSON.stringify(this.props.ranges) !== JSON.stringify(ranges)) {
        this.setState({
          ranges: new RangesList(ranges)
        });
      }
    }
  }, {
    key: "changeCalendarMode",
    value: function changeCalendarMode() {
      this.props.toggleMode();
    }
  }, {
    key: "render",
    value: function render() {
      var _this2 = this;

      var _this$props3 = this.props,
          selectedDay = _this$props3.selectedDay,
          min = _this$props3.min,
          max = _this$props3.max,
          onClickOutside = _this$props3.onClickOutside,
          outsideClickIgnoreClass = _this$props3.outsideClickIgnoreClass,
          styles = _this$props3.styles,
          className = _this$props3.className,
          showTodayButton = _this$props3.showTodayButton;
      var _this$state4 = this.state,
          mode = _this$state4.mode,
          isGregorian = _this$state4.isGregorian;
      var jalaaliClassName = isGregorian ? '' : 'jalaali ';
      return /*#__PURE__*/React.createElement("div", {
        className: "".concat(styles.calendarContainer, " ").concat(jalaaliClassName).concat(className)
      }, this.props.showToggleButton && /*#__PURE__*/React.createElement("button", {
        className: "calendarButton toggleButton",
        type: "button",
        onClick: this.changeCalendarMode.bind(this)
      }, isGregorian ? this.props.toggleButtonText[0] : this.props.toggleButtonText[1]), mode === 'monthSelector' ? this.renderMonthSelector() : this.renderDays(), showTodayButton && /*#__PURE__*/React.createElement("button", {
        type: "button",
        className: "calendarButton selectToday",
        onClick: function onClick() {
          return _this2.handleClickOnDay(momentJalaali());
        }
      }, isGregorian ? 'today' : 'امروز'));
    }
  }]);

  return Calendar;
}(Component);

defineProperty(Calendar, "propTypes", {
  min: PropTypes.object,
  max: PropTypes.object,
  styles: PropTypes.object,
  selectedDay: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
  defaultMonth: PropTypes.object,
  onSelect: PropTypes.func,
  onMonthChange: PropTypes.func,
  onClickOutside: PropTypes.func,
  containerProps: PropTypes.object,
  isGregorian: PropTypes.bool,
  calendarClass: PropTypes.string,
  showToggleButton: PropTypes.bool,
  toggleButtonText: PropTypes.any,
  showTodayButton: PropTypes.bool
});

defineProperty(Calendar, "childContextTypes", {
  nextMonth: PropTypes.func.isRequired,
  prevMonth: PropTypes.func.isRequired,
  setCalendarMode: PropTypes.func.isRequired,
  setMonth: PropTypes.func.isRequired,
  setType: PropTypes.func.isRequired
});

defineProperty(Calendar, "defaultProps", {
  styles: defaultStyles,
  containerProps: {},
  isGregorian: true,
  showToggleButton: false,
  showTodayButton: true,
  toggleButtonText: ['تاریخ شمسی', 'تاریخ میلادی']
});

var Calendar$1 = onClickOutside(Calendar);

function _arrayLikeToArray(arr, len) {
  if (len == null || len > arr.length) len = arr.length;

  for (var i = 0, arr2 = new Array(len); i < len; i++) {
    arr2[i] = arr[i];
  }

  return arr2;
}

var arrayLikeToArray = _arrayLikeToArray;

function _arrayWithoutHoles(arr) {
  if (Array.isArray(arr)) return arrayLikeToArray(arr);
}

var arrayWithoutHoles = _arrayWithoutHoles;

function _iterableToArray(iter) {
  if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter);
}

var iterableToArray = _iterableToArray;

function _unsupportedIterableToArray(o, minLen) {
  if (!o) return;
  if (typeof o === "string") return arrayLikeToArray(o, minLen);
  var n = Object.prototype.toString.call(o).slice(8, -1);
  if (n === "Object" && o.constructor) n = o.constructor.name;
  if (n === "Map" || n === "Set") return Array.from(n);
  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return arrayLikeToArray(o, minLen);
}

var unsupportedIterableToArray = _unsupportedIterableToArray;

function _nonIterableSpread() {
  throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}

var nonIterableSpread = _nonIterableSpread;

function _toConsumableArray(arr) {
  return arrayWithoutHoles(arr) || iterableToArray(arr) || unsupportedIterableToArray(arr) || nonIterableSpread();
}

var toConsumableArray = _toConsumableArray;

function _createSuper$6(Derived) { return function () { var Super = getPrototypeOf(Derived), result; if (_isNativeReflectConstruct$6()) { var NewTarget = getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return possibleConstructorReturn(this, result); }; }

function _isNativeReflectConstruct$6() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }

var Header = /*#__PURE__*/function (_React$Component) {
  inherits(Header, _React$Component);

  var _super = _createSuper$6(Header);

  function Header(props) {
    var _this;

    classCallCheck(this, Header);

    _this = _super.call(this, props);
    var _this$props = _this.props,
        value = _this$props.value,
        format = _this$props.format;
    _this.state = {
      str: value && value.format(format) || '',
      invalid: false
    };
    _this.onClear = _this.onClear.bind(assertThisInitialized(_this));
    _this.onInputChange = _this.onInputChange.bind(assertThisInitialized(_this));
    _this.onKeyDown = _this.onKeyDown.bind(assertThisInitialized(_this));
    return _this;
  }

  createClass(Header, [{
    key: "UNSAFE_componentWillReceiveProps",
    value: function UNSAFE_componentWillReceiveProps(nextProps) {
      var value = nextProps.value,
          format = nextProps.format;
      this.setState({
        str: value && value.format(format) || '',
        invalid: false
      });
    }
  }, {
    key: "onInputChange",
    value: function onInputChange(event) {
      var str = event.target.value;
      this.setState({
        str: str
      });
      var _this$props2 = this.props,
          format = _this$props2.format,
          hourOptions = _this$props2.hourOptions,
          minuteOptions = _this$props2.minuteOptions,
          secondOptions = _this$props2.secondOptions,
          disabledHours = _this$props2.disabledHours,
          disabledMinutes = _this$props2.disabledMinutes,
          disabledSeconds = _this$props2.disabledSeconds,
          onChange = _this$props2.onChange,
          allowEmpty = _this$props2.allowEmpty;

      if (str) {
        var originalValue = this.props.value;
        var value = this.getProtoValue().clone();
        var parsed = momentJalaali(str, format, true);

        if (!parsed.isValid()) {
          this.setState({
            invalid: true
          });
          return;
        }

        value.hour(parsed.hour()).minute(parsed.minute()).second(parsed.second()); // if time value not allowed, response warning.

        if (hourOptions.indexOf(value.hour()) < 0 || minuteOptions.indexOf(value.minute()) < 0 || secondOptions.indexOf(value.second()) < 0) {
          this.setState({
            invalid: true
          });
          return;
        } // if time value is disabled, response warning.


        var disabledHourOptions = disabledHours();
        var disabledMinuteOptions = disabledMinutes(value.hour());
        var disabledSecondOptions = disabledSeconds(value.hour(), value.minute());

        if (disabledHourOptions && disabledHourOptions.indexOf(value.hour()) >= 0 || disabledMinuteOptions && disabledMinuteOptions.indexOf(value.minute()) >= 0 || disabledSecondOptions && disabledSecondOptions.indexOf(value.second()) >= 0) {
          this.setState({
            invalid: true
          });
          return;
        }

        if (originalValue) {
          if (originalValue.hour() !== value.hour() || originalValue.minute() !== value.minute() || originalValue.second() !== value.second()) {
            // keep other fields for rc-calendar
            var changedValue = originalValue.clone();
            changedValue.hour(value.hour());
            changedValue.minute(value.minute());
            changedValue.second(value.second());
            onChange(changedValue);
          }
        } else if (originalValue !== value) {
          onChange(value);
        }
      } else if (allowEmpty) {
        onChange(null);
      } else {
        this.setState({
          invalid: true
        });
        return;
      }

      this.setState({
        invalid: false
      });
    }
  }, {
    key: "onKeyDown",
    value: function onKeyDown(e) {
      if (e.keyCode === 27) {
        this.props.onEsc();
      }
    }
  }, {
    key: "onClear",
    value: function onClear() {
      this.setState({
        str: ''
      });
      this.props.