@birdnet/advanced-react-dates 0.0.0-stage → 1.0.0

package/lib/components/CalendarMonth.js

@@ -0,0 +1,259 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _enzymeShallowEqual = _interopRequireDefault(require("enzyme-shallow-equal"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _readOnlyError2 = _interopRequireDefault(require("@babel/runtime/helpers/readOnlyError"));
+var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _reactMomentProptypes = _interopRequireDefault(require("react-moment-proptypes"));
+var _airbnbPropTypes = require("airbnb-prop-types");
+var _reactWithStyles = require("react-with-styles");
+var _moment = _interopRequireDefault(require("moment"));
+var _defaultPhrases = require("../defaultPhrases");
+var _getPhrasePropTypes = _interopRequireDefault(require("../utils/getPhrasePropTypes"));
+var _CalendarWeek = _interopRequireDefault(require("./CalendarWeek"));
+var _CalendarDay = _interopRequireDefault(require("./CalendarDay"));
+var _calculateDimension = _interopRequireDefault(require("../utils/calculateDimension"));
+var _getCalendarMonthWeeks = _interopRequireDefault(require("../utils/getCalendarMonthWeeks"));
+var _isSameDay = _interopRequireDefault(require("../utils/isSameDay"));
+var _toISODateString = _interopRequireDefault(require("../utils/toISODateString"));
+var _ModifiersShape = _interopRequireDefault(require("../shapes/ModifiersShape"));
+var _ScrollableOrientationShape = _interopRequireDefault(require("../shapes/ScrollableOrientationShape"));
+var _DayOfWeekShape = _interopRequireDefault(require("../shapes/DayOfWeekShape"));
+var _constants = require("../constants");
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } /* eslint react/no-array-index-key: 0 */
+var propTypes = process.env.NODE_ENV !== "production" ? (0, _airbnbPropTypes.forbidExtraProps)(_objectSpread(_objectSpread({}, _reactWithStyles.withStylesPropTypes), {}, {
+  month: _reactMomentProptypes["default"].momentObj,
+  horizontalMonthPadding: _airbnbPropTypes.nonNegativeInteger,
+  isVisible: _propTypes["default"].bool,
+  enableOutsideDays: _propTypes["default"].bool,
+  modifiers: _propTypes["default"].objectOf(_ModifiersShape["default"]),
+  orientation: _ScrollableOrientationShape["default"],
+  daySize: _airbnbPropTypes.nonNegativeInteger,
+  onDayClick: _propTypes["default"].func,
+  onDayMouseEnter: _propTypes["default"].func,
+  onDayMouseLeave: _propTypes["default"].func,
+  onMonthSelect: _propTypes["default"].func,
+  onYearSelect: _propTypes["default"].func,
+  renderMonthText: (0, _airbnbPropTypes.mutuallyExclusiveProps)(_propTypes["default"].func, 'renderMonthText', 'renderMonthElement'),
+  renderCalendarDay: _propTypes["default"].func,
+  renderDayContents: _propTypes["default"].func,
+  renderMonthElement: (0, _airbnbPropTypes.mutuallyExclusiveProps)(_propTypes["default"].func, 'renderMonthText', 'renderMonthElement'),
+  firstDayOfWeek: _DayOfWeekShape["default"],
+  setMonthTitleHeight: _propTypes["default"].func,
+  verticalBorderSpacing: _airbnbPropTypes.nonNegativeInteger,
+  focusedDate: _reactMomentProptypes["default"].momentObj,
+  // indicates focusable day
+  isFocused: _propTypes["default"].bool,
+  // indicates whether or not to move focus to focusable day
+
+  // i18n
+  monthFormat: _propTypes["default"].string,
+  phrases: _propTypes["default"].shape((0, _getPhrasePropTypes["default"])(_defaultPhrases.CalendarDayPhrases)),
+  dayAriaLabelFormat: _propTypes["default"].string
+})) : {};
+var defaultProps = {
+  month: (0, _moment["default"])(),
+  horizontalMonthPadding: 13,
+  isVisible: true,
+  enableOutsideDays: false,
+  modifiers: {},
+  orientation: _constants.HORIZONTAL_ORIENTATION,
+  daySize: _constants.DAY_SIZE,
+  onDayClick: function onDayClick() {},
+  onDayMouseEnter: function onDayMouseEnter() {},
+  onDayMouseLeave: function onDayMouseLeave() {},
+  onMonthSelect: function onMonthSelect() {},
+  onYearSelect: function onYearSelect() {},
+  renderMonthText: null,
+  renderCalendarDay: function renderCalendarDay(props) {
+    return /*#__PURE__*/_react["default"].createElement(_CalendarDay["default"], props);
+  },
+  renderDayContents: null,
+  renderMonthElement: null,
+  firstDayOfWeek: null,
+  setMonthTitleHeight: null,
+  focusedDate: null,
+  isFocused: false,
+  // i18n
+  monthFormat: 'MMMM YYYY',
+  // english locale
+  phrases: _defaultPhrases.CalendarDayPhrases,
+  dayAriaLabelFormat: undefined,
+  verticalBorderSpacing: undefined
+};
+var CalendarMonth = /*#__PURE__*/function (_ref2, _ref) {
+  function CalendarMonth(props) {
+    var _this;
+    _this = _ref2.call(this, props) || this;
+    _this.state = {
+      month: props.month,
+      enableOutsideDays: props.enableOutsideDays,
+      firstDayOfWeek: props.firstDayOfWeek,
+      weeks: (0, _getCalendarMonthWeeks["default"])(props.month, props.enableOutsideDays, props.firstDayOfWeek == null ? _moment["default"].localeData().firstDayOfWeek() : props.firstDayOfWeek)
+    };
+    _this.setCaptionRef = _this.setCaptionRef.bind(_this);
+    _this.setMonthTitleHeight = _this.setMonthTitleHeight.bind(_this);
+    return _this;
+  }
+  (0, _inheritsLoose2["default"])(CalendarMonth, _ref2);
+  var _proto = CalendarMonth.prototype;
+  _proto[_ref] = function (nextProps, nextState) {
+    return !(0, _enzymeShallowEqual["default"])(this.props, nextProps) || !(0, _enzymeShallowEqual["default"])(this.state, nextState);
+  };
+  _proto.componentDidMount = function componentDidMount() {
+    this.queueSetMonthTitleHeight();
+  };
+  CalendarMonth.getDerivedStateFromProps = function getDerivedStateFromProps(props, state) {
+    var month = props.month,
+      enableOutsideDays = props.enableOutsideDays,
+      firstDayOfWeek = props.firstDayOfWeek;
+    var prevMonth = state.month,
+      prevEnableOutsideDays = state.enableOutsideDays,
+      prevFirstDayOfWeek = state.firstDayOfWeek;
+    if (!month.isSame(prevMonth) || enableOutsideDays !== prevEnableOutsideDays || firstDayOfWeek !== prevFirstDayOfWeek) {
+      return {
+        month: month,
+        enableOutsideDays: enableOutsideDays,
+        firstDayOfWeek: firstDayOfWeek,
+        weeks: (0, _getCalendarMonthWeeks["default"])(month, enableOutsideDays, firstDayOfWeek == null ? _moment["default"].localeData().firstDayOfWeek() : firstDayOfWeek)
+      };
+    }
+    return null;
+  };
+  _proto.componentDidUpdate = function componentDidUpdate(prevProps) {
+    var setMonthTitleHeight = this.props.setMonthTitleHeight;
+    if (prevProps.setMonthTitleHeight === null && setMonthTitleHeight !== null) {
+      this.queueSetMonthTitleHeight();
+    }
+  };
+  _proto.componentWillUnmount = function componentWillUnmount() {
+    if (this.setMonthTitleHeightTimeout) {
+      clearTimeout(this.setMonthTitleHeightTimeout);
+    }
+  };
+  _proto.setMonthTitleHeight = function setMonthTitleHeight() {
+    var setMonthTitleHeight = this.props.setMonthTitleHeight;
+    if (setMonthTitleHeight) {
+      var captionHeight = (0, _calculateDimension["default"])(this.captionRef, 'height', true, true);
+      setMonthTitleHeight(captionHeight);
+    }
+  };
+  _proto.setCaptionRef = function setCaptionRef(ref) {
+    this.captionRef = ref;
+  };
+  _proto.queueSetMonthTitleHeight = function queueSetMonthTitleHeight() {
+    this.setMonthTitleHeightTimeout = window.setTimeout(this.setMonthTitleHeight, 0);
+  };
+  _proto.render = function render() {
+    var _this$props = this.props,
+      dayAriaLabelFormat = _this$props.dayAriaLabelFormat,
+      daySize = _this$props.daySize,
+      focusedDate = _this$props.focusedDate,
+      horizontalMonthPadding = _this$props.horizontalMonthPadding,
+      isFocused = _this$props.isFocused,
+      isVisible = _this$props.isVisible,
+      modifiers = _this$props.modifiers,
+      month = _this$props.month,
+      monthFormat = _this$props.monthFormat,
+      onDayClick = _this$props.onDayClick,
+      onDayMouseEnter = _this$props.onDayMouseEnter,
+      onDayMouseLeave = _this$props.onDayMouseLeave,
+      onMonthSelect = _this$props.onMonthSelect,
+      onYearSelect = _this$props.onYearSelect,
+      orientation = _this$props.orientation,
+      phrases = _this$props.phrases,
+      renderCalendarDay = _this$props.renderCalendarDay,
+      renderDayContents = _this$props.renderDayContents,
+      renderMonthElement = _this$props.renderMonthElement,
+      renderMonthText = _this$props.renderMonthText,
+      css = _this$props.css,
+      styles = _this$props.styles,
+      verticalBorderSpacing = _this$props.verticalBorderSpacing;
+    var weeks = this.state.weeks;
+    var monthTitle = renderMonthText ? renderMonthText(month) : month.format(monthFormat);
+    var verticalScrollable = orientation === _constants.VERTICAL_SCROLLABLE;
+    return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, css(styles.CalendarMonth, {
+      padding: "0 ".concat(horizontalMonthPadding, "px")
+    }), {
+      "data-visible": isVisible
+    }), /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({
+      ref: this.setCaptionRef
+    }, css(styles.CalendarMonth_caption, verticalScrollable && styles.CalendarMonth_caption__verticalScrollable)), renderMonthElement ? renderMonthElement({
+      month: month,
+      onMonthSelect: onMonthSelect,
+      onYearSelect: onYearSelect,
+      isVisible: isVisible
+    }) : /*#__PURE__*/_react["default"].createElement("strong", null, monthTitle)), /*#__PURE__*/_react["default"].createElement("table", (0, _extends2["default"])({}, css(!verticalBorderSpacing && styles.CalendarMonth_table, verticalBorderSpacing && styles.CalendarMonth_verticalSpacing, verticalBorderSpacing && {
+      borderSpacing: "0px ".concat(verticalBorderSpacing, "px")
+    }), {
+      role: "presentation"
+    }), /*#__PURE__*/_react["default"].createElement("tbody", null, weeks.map(function (week, i) {
+      return /*#__PURE__*/_react["default"].createElement(_CalendarWeek["default"], {
+        key: i
+      }, week.map(function (day, dayOfWeek) {
+        return renderCalendarDay({
+          key: dayOfWeek,
+          day: day,
+          daySize: daySize,
+          isOutsideDay: !day || day.month() !== month.month(),
+          tabIndex: isVisible && (0, _isSameDay["default"])(day, focusedDate) ? 0 : -1,
+          isFocused: isFocused,
+          onDayMouseEnter: onDayMouseEnter,
+          onDayMouseLeave: onDayMouseLeave,
+          onDayClick: onDayClick,
+          renderDayContents: renderDayContents,
+          phrases: phrases,
+          modifiers: modifiers[(0, _toISODateString["default"])(day)],
+          ariaLabelFormat: dayAriaLabelFormat
+        });
+      }));
+    }))));
+  };
+  return CalendarMonth;
+}(_react["default"].PureComponent || _react["default"].Component, !_react["default"].PureComponent && "shouldComponentUpdate");
+CalendarMonth.propTypes = process.env.NODE_ENV !== "production" ? propTypes : {};
+CalendarMonth.defaultProps = defaultProps;
+var _default = exports["default"] = (0, _reactWithStyles.withStyles)(function (_ref3) {
+  var _ref3$reactDates = _ref3.reactDates,
+    color = _ref3$reactDates.color,
+    font = _ref3$reactDates.font,
+    spacing = _ref3$reactDates.spacing;
+  return {
+    CalendarMonth: {
+      background: color.background,
+      textAlign: 'center',
+      verticalAlign: 'top',
+      userSelect: 'none'
+    },
+    CalendarMonth_table: {
+      borderCollapse: 'collapse',
+      borderSpacing: 0
+    },
+    CalendarMonth_verticalSpacing: {
+      borderCollapse: 'separate'
+    },
+    CalendarMonth_caption: {
+      color: color.text,
+      fontSize: font.captionSize,
+      textAlign: 'center',
+      paddingTop: spacing.captionPaddingTop,
+      paddingBottom: spacing.captionPaddingBottom,
+      captionSide: 'initial'
+    },
+    CalendarMonth_caption__verticalScrollable: {
+      paddingTop: 12,
+      paddingBottom: 7
+    }
+  };
+}, {
+  pureComponent: typeof _react["default"].PureComponent !== 'undefined'
+})(CalendarMonth);

package/lib/components/CalendarMonthGrid.js

@@ -0,0 +1,372 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _enzymeShallowEqual = _interopRequireDefault(require("enzyme-shallow-equal"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _reactMomentProptypes = _interopRequireDefault(require("react-moment-proptypes"));
+var _airbnbPropTypes = require("airbnb-prop-types");
+var _reactWithStyles = require("react-with-styles");
+var _moment = _interopRequireDefault(require("moment"));
+var _consolidatedEvents = require("consolidated-events");
+var _defaultPhrases = require("../defaultPhrases");
+var _getPhrasePropTypes = _interopRequireDefault(require("../utils/getPhrasePropTypes"));
+var _noflip = _interopRequireDefault(require("../utils/noflip"));
+var _CalendarMonth = _interopRequireDefault(require("./CalendarMonth"));
+var _isTransitionEndSupported = _interopRequireDefault(require("../utils/isTransitionEndSupported"));
+var _getTransformStyles = _interopRequireDefault(require("../utils/getTransformStyles"));
+var _getCalendarMonthWidth = _interopRequireDefault(require("../utils/getCalendarMonthWidth"));
+var _toISOMonthString = _interopRequireDefault(require("../utils/toISOMonthString"));
+var _isPrevMonth = _interopRequireDefault(require("../utils/isPrevMonth"));
+var _isNextMonth = _interopRequireDefault(require("../utils/isNextMonth"));
+var _ModifiersShape = _interopRequireDefault(require("../shapes/ModifiersShape"));
+var _ScrollableOrientationShape = _interopRequireDefault(require("../shapes/ScrollableOrientationShape"));
+var _DayOfWeekShape = _interopRequireDefault(require("../shapes/DayOfWeekShape"));
+var _constants = require("../constants");
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var propTypes = process.env.NODE_ENV !== "production" ? (0, _airbnbPropTypes.forbidExtraProps)(_objectSpread(_objectSpread({}, _reactWithStyles.withStylesPropTypes), {}, {
+  enableOutsideDays: _propTypes["default"].bool,
+  firstVisibleMonthIndex: _propTypes["default"].number,
+  horizontalMonthPadding: _airbnbPropTypes.nonNegativeInteger,
+  initialMonth: _reactMomentProptypes["default"].momentObj,
+  isAnimating: _propTypes["default"].bool,
+  numberOfMonths: _propTypes["default"].number,
+  modifiers: _propTypes["default"].objectOf(_propTypes["default"].objectOf(_ModifiersShape["default"])),
+  orientation: _ScrollableOrientationShape["default"],
+  onDayClick: _propTypes["default"].func,
+  onDayMouseEnter: _propTypes["default"].func,
+  onDayMouseLeave: _propTypes["default"].func,
+  onMonthTransitionEnd: _propTypes["default"].func,
+  onMonthChange: _propTypes["default"].func,
+  onYearChange: _propTypes["default"].func,
+  renderMonthText: (0, _airbnbPropTypes.mutuallyExclusiveProps)(_propTypes["default"].func, 'renderMonthText', 'renderMonthElement'),
+  renderCalendarDay: _propTypes["default"].func,
+  renderDayContents: _propTypes["default"].func,
+  translationValue: _propTypes["default"].number,
+  renderMonthElement: (0, _airbnbPropTypes.mutuallyExclusiveProps)(_propTypes["default"].func, 'renderMonthText', 'renderMonthElement'),
+  daySize: _airbnbPropTypes.nonNegativeInteger,
+  focusedDate: _reactMomentProptypes["default"].momentObj,
+  // indicates focusable day
+  isFocused: _propTypes["default"].bool,
+  // indicates whether or not to move focus to focusable day
+  firstDayOfWeek: _DayOfWeekShape["default"],
+  setMonthTitleHeight: _propTypes["default"].func,
+  isRTL: _propTypes["default"].bool,
+  transitionDuration: _airbnbPropTypes.nonNegativeInteger,
+  verticalBorderSpacing: _airbnbPropTypes.nonNegativeInteger,
+  // i18n
+  monthFormat: _propTypes["default"].string,
+  phrases: _propTypes["default"].shape((0, _getPhrasePropTypes["default"])(_defaultPhrases.CalendarDayPhrases)),
+  dayAriaLabelFormat: _propTypes["default"].string
+})) : {};
+var defaultProps = {
+  enableOutsideDays: false,
+  firstVisibleMonthIndex: 0,
+  horizontalMonthPadding: 13,
+  initialMonth: (0, _moment["default"])(),
+  isAnimating: false,
+  numberOfMonths: 1,
+  modifiers: {},
+  orientation: _constants.HORIZONTAL_ORIENTATION,
+  onDayClick: function onDayClick() {},
+  onDayMouseEnter: function onDayMouseEnter() {},
+  onDayMouseLeave: function onDayMouseLeave() {},
+  onMonthChange: function onMonthChange() {},
+  onYearChange: function onYearChange() {},
+  onMonthTransitionEnd: function onMonthTransitionEnd() {},
+  renderMonthText: null,
+  renderCalendarDay: undefined,
+  renderDayContents: null,
+  translationValue: null,
+  renderMonthElement: null,
+  daySize: _constants.DAY_SIZE,
+  focusedDate: null,
+  isFocused: false,
+  firstDayOfWeek: null,
+  setMonthTitleHeight: null,
+  isRTL: false,
+  transitionDuration: 200,
+  verticalBorderSpacing: undefined,
+  // i18n
+  monthFormat: 'MMMM YYYY',
+  // english locale
+  phrases: _defaultPhrases.CalendarDayPhrases,
+  dayAriaLabelFormat: undefined
+};
+function getMonths(initialMonth, numberOfMonths, withoutTransitionMonths) {
+  var month = initialMonth.clone();
+  if (!withoutTransitionMonths) month = month.subtract(1, 'month');
+  var months = [];
+  for (var i = 0; i < (withoutTransitionMonths ? numberOfMonths : numberOfMonths + 2); i += 1) {
+    months.push(month);
+    month = month.clone().add(1, 'month');
+  }
+  return months;
+}
+var CalendarMonthGrid = /*#__PURE__*/function (_ref2, _ref) {
+  function CalendarMonthGrid(props) {
+    var _this;
+    _this = _ref2.call(this, props) || this;
+    var withoutTransitionMonths = props.orientation === _constants.VERTICAL_SCROLLABLE;
+    _this.state = {
+      months: getMonths(props.initialMonth, props.numberOfMonths, withoutTransitionMonths),
+      initialMonth: props.initialMonth,
+      numberOfMonths: props.numberOfMonths,
+      locale: _moment["default"].locale()
+    };
+    _this.isTransitionEndSupported = (0, _isTransitionEndSupported["default"])();
+    _this.onTransitionEnd = _this.onTransitionEnd.bind(_this);
+    _this.setContainerRef = _this.setContainerRef.bind(_this);
+    _this.onMonthSelect = _this.onMonthSelect.bind(_this);
+    _this.onYearSelect = _this.onYearSelect.bind(_this);
+    return _this;
+  }
+  (0, _inheritsLoose2["default"])(CalendarMonthGrid, _ref2);
+  var _proto = CalendarMonthGrid.prototype;
+  _proto[_ref] = function (nextProps, nextState) {
+    return !(0, _enzymeShallowEqual["default"])(this.props, nextProps) || !(0, _enzymeShallowEqual["default"])(this.state, nextState);
+  };
+  _proto.componentDidMount = function componentDidMount() {
+    this.removeEventListener = (0, _consolidatedEvents.addEventListener)(this.container, 'transitionend', this.onTransitionEnd);
+  };
+  CalendarMonthGrid.getDerivedStateFromProps = function getDerivedStateFromProps(props, state) {
+    var initialMonth = props.initialMonth,
+      numberOfMonths = props.numberOfMonths,
+      orientation = props.orientation;
+    var months = state.months,
+      prevInitialMonth = state.initialMonth,
+      prevNumberOfMonths = state.numberOfMonths,
+      prevLocale = state.locale;
+    var hasMonthChanged = !prevInitialMonth.isSame(initialMonth, 'month');
+    var hasNumberOfMonthsChanged = prevNumberOfMonths !== numberOfMonths;
+    var newMonths = months;
+    if (hasMonthChanged || hasNumberOfMonthsChanged) {
+      if (hasMonthChanged && !hasNumberOfMonthsChanged) {
+        if ((0, _isNextMonth["default"])(prevInitialMonth, initialMonth)) {
+          newMonths = months.slice(1);
+          newMonths.push(months[months.length - 1].clone().add(1, 'month'));
+        } else if ((0, _isPrevMonth["default"])(prevInitialMonth, initialMonth)) {
+          newMonths = months.slice(0, months.length - 1);
+          newMonths.unshift(months[0].clone().subtract(1, 'month'));
+        } else {
+          var withoutTransitionMonths = orientation === _constants.VERTICAL_SCROLLABLE;
+          newMonths = getMonths(initialMonth, numberOfMonths, withoutTransitionMonths);
+        }
+      }
+      if (hasNumberOfMonthsChanged) {
+        var _withoutTransitionMonths = orientation === _constants.VERTICAL_SCROLLABLE;
+        newMonths = getMonths(initialMonth, numberOfMonths, _withoutTransitionMonths);
+      }
+      var momentLocale = _moment["default"].locale();
+      var locale = prevLocale;
+      if (locale !== momentLocale) {
+        locale = momentLocale;
+        newMonths = newMonths.map(function (m) {
+          return m.locale(locale);
+        });
+      }
+      return {
+        months: newMonths,
+        initialMonth: initialMonth,
+        numberOfMonths: numberOfMonths,
+        locale: locale
+      };
+    }
+    return null;
+  };
+  _proto.componentDidUpdate = function componentDidUpdate() {
+    var _this$props = this.props,
+      isAnimating = _this$props.isAnimating,
+      transitionDuration = _this$props.transitionDuration,
+      onMonthTransitionEnd = _this$props.onMonthTransitionEnd;
+
+    // For IE9, immediately call onMonthTransitionEnd instead of
+    // waiting for the animation to complete. Similarly, if transitionDuration
+    // is set to 0, also immediately invoke the onMonthTransitionEnd callback
+    if ((!this.isTransitionEndSupported || !transitionDuration) && isAnimating) {
+      onMonthTransitionEnd();
+    }
+  };
+  _proto.componentWillUnmount = function componentWillUnmount() {
+    if (this.removeEventListener) this.removeEventListener();
+  };
+  _proto.onTransitionEnd = function onTransitionEnd() {
+    var onMonthTransitionEnd = this.props.onMonthTransitionEnd;
+    onMonthTransitionEnd();
+  };
+  _proto.onMonthSelect = function onMonthSelect(currentMonth, newMonthVal) {
+    var newMonth = currentMonth.clone();
+    var _this$props2 = this.props,
+      onMonthChange = _this$props2.onMonthChange,
+      orientation = _this$props2.orientation;
+    var months = this.state.months;
+    var withoutTransitionMonths = orientation === _constants.VERTICAL_SCROLLABLE;
+    var initialMonthSubtraction = months.indexOf(currentMonth);
+    if (!withoutTransitionMonths) {
+      initialMonthSubtraction -= 1;
+    }
+    newMonth.set('month', newMonthVal).subtract(initialMonthSubtraction, 'months');
+    onMonthChange(newMonth);
+  };
+  _proto.onYearSelect = function onYearSelect(currentMonth, newYearVal) {
+    var newMonth = currentMonth.clone();
+    var _this$props3 = this.props,
+      onYearChange = _this$props3.onYearChange,
+      orientation = _this$props3.orientation;
+    var months = this.state.months;
+    var withoutTransitionMonths = orientation === _constants.VERTICAL_SCROLLABLE;
+    var initialMonthSubtraction = months.indexOf(currentMonth);
+    if (!withoutTransitionMonths) {
+      initialMonthSubtraction -= 1;
+    }
+    newMonth.set('year', newYearVal).subtract(initialMonthSubtraction, 'months');
+    onYearChange(newMonth);
+  };
+  _proto.setContainerRef = function setContainerRef(ref) {
+    this.container = ref;
+  };
+  _proto.render = function render() {
+    var _this2 = this;
+    var _this$props4 = this.props,
+      enableOutsideDays = _this$props4.enableOutsideDays,
+      firstVisibleMonthIndex = _this$props4.firstVisibleMonthIndex,
+      horizontalMonthPadding = _this$props4.horizontalMonthPadding,
+      isAnimating = _this$props4.isAnimating,
+      modifiers = _this$props4.modifiers,
+      numberOfMonths = _this$props4.numberOfMonths,
+      monthFormat = _this$props4.monthFormat,
+      orientation = _this$props4.orientation,
+      translationValue = _this$props4.translationValue,
+      daySize = _this$props4.daySize,
+      onDayMouseEnter = _this$props4.onDayMouseEnter,
+      onDayMouseLeave = _this$props4.onDayMouseLeave,
+      onDayClick = _this$props4.onDayClick,
+      renderMonthText = _this$props4.renderMonthText,
+      renderCalendarDay = _this$props4.renderCalendarDay,
+      renderDayContents = _this$props4.renderDayContents,
+      renderMonthElement = _this$props4.renderMonthElement,
+      onMonthTransitionEnd = _this$props4.onMonthTransitionEnd,
+      firstDayOfWeek = _this$props4.firstDayOfWeek,
+      focusedDate = _this$props4.focusedDate,
+      isFocused = _this$props4.isFocused,
+      isRTL = _this$props4.isRTL,
+      css = _this$props4.css,
+      styles = _this$props4.styles,
+      phrases = _this$props4.phrases,
+      dayAriaLabelFormat = _this$props4.dayAriaLabelFormat,
+      transitionDuration = _this$props4.transitionDuration,
+      verticalBorderSpacing = _this$props4.verticalBorderSpacing,
+      setMonthTitleHeight = _this$props4.setMonthTitleHeight;
+    var months = this.state.months;
+    var isVertical = orientation === _constants.VERTICAL_ORIENTATION;
+    var isVerticalScrollable = orientation === _constants.VERTICAL_SCROLLABLE;
+    var isHorizontal = orientation === _constants.HORIZONTAL_ORIENTATION;
+    var calendarMonthWidth = (0, _getCalendarMonthWidth["default"])(daySize, horizontalMonthPadding);
+    var width = isVertical || isVerticalScrollable ? calendarMonthWidth : (numberOfMonths + 2) * calendarMonthWidth;
+    var transformType = isVertical || isVerticalScrollable ? 'translateY' : 'translateX';
+    var transformValue = "".concat(transformType, "(").concat(translationValue, "px)");
+    return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, css(styles.CalendarMonthGrid, isHorizontal && styles.CalendarMonthGrid__horizontal, isVertical && styles.CalendarMonthGrid__vertical, isVerticalScrollable && styles.CalendarMonthGrid__vertical_scrollable, isAnimating && styles.CalendarMonthGrid__animating, isAnimating && transitionDuration && {
+      transition: "transform ".concat(transitionDuration, "ms ease-in-out 0.1s")
+    }, _objectSpread(_objectSpread({}, (0, _getTransformStyles["default"])(transformValue)), {}, {
+      width: width
+    })), {
+      ref: this.setContainerRef,
+      onTransitionEnd: onMonthTransitionEnd
+    }), months.map(function (month, i) {
+      var isVisible = i >= firstVisibleMonthIndex && i < firstVisibleMonthIndex + numberOfMonths;
+      var hideForAnimation = i === 0 && !isVisible;
+      var showForAnimation = i === 0 && isAnimating && isVisible;
+      var monthString = (0, _toISOMonthString["default"])(month);
+      return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({
+        key: monthString
+      }, css(isHorizontal && styles.CalendarMonthGrid_month__horizontal, hideForAnimation && styles.CalendarMonthGrid_month__hideForAnimation, showForAnimation && !isVertical && !isRTL && {
+        position: 'absolute',
+        left: -calendarMonthWidth
+      }, showForAnimation && !isVertical && isRTL && {
+        position: 'absolute',
+        right: 0
+      }, showForAnimation && isVertical && {
+        position: 'absolute',
+        top: -translationValue
+      }, !isVisible && !isAnimating && styles.CalendarMonthGrid_month__hidden)), /*#__PURE__*/_react["default"].createElement(_CalendarMonth["default"], {
+        month: month,
+        isVisible: isVisible,
+        enableOutsideDays: enableOutsideDays,
+        modifiers: modifiers[monthString],
+        monthFormat: monthFormat,
+        orientation: orientation,
+        onDayMouseEnter: onDayMouseEnter,
+        onDayMouseLeave: onDayMouseLeave,
+        onDayClick: onDayClick,
+        onMonthSelect: _this2.onMonthSelect,
+        onYearSelect: _this2.onYearSelect,
+        renderMonthText: renderMonthText,
+        renderCalendarDay: renderCalendarDay,
+        renderDayContents: renderDayContents,
+        renderMonthElement: renderMonthElement,
+        firstDayOfWeek: firstDayOfWeek,
+        daySize: daySize,
+        focusedDate: isVisible ? focusedDate : null,
+        isFocused: isFocused,
+        phrases: phrases,
+        setMonthTitleHeight: setMonthTitleHeight,
+        dayAriaLabelFormat: dayAriaLabelFormat,
+        verticalBorderSpacing: verticalBorderSpacing,
+        horizontalMonthPadding: horizontalMonthPadding
+      }));
+    }));
+  };
+  return CalendarMonthGrid;
+}(_react["default"].PureComponent || _react["default"].Component, !_react["default"].PureComponent && "shouldComponentUpdate");
+CalendarMonthGrid.propTypes = process.env.NODE_ENV !== "production" ? propTypes : {};
+CalendarMonthGrid.defaultProps = defaultProps;
+var _default = exports["default"] = (0, _reactWithStyles.withStyles)(function (_ref3) {
+  var _ref3$reactDates = _ref3.reactDates,
+    color = _ref3$reactDates.color,
+    spacing = _ref3$reactDates.spacing,
+    zIndex = _ref3$reactDates.zIndex;
+  return {
+    CalendarMonthGrid: {
+      background: color.background,
+      textAlign: (0, _noflip["default"])('left'),
+      zIndex: zIndex
+    },
+    CalendarMonthGrid__animating: {
+      zIndex: zIndex + 1
+    },
+    CalendarMonthGrid__horizontal: {
+      position: 'absolute',
+      left: (0, _noflip["default"])(spacing.dayPickerHorizontalPadding)
+    },
+    CalendarMonthGrid__vertical: {
+      margin: '0 auto'
+    },
+    CalendarMonthGrid__vertical_scrollable: {
+      margin: '0 auto'
+    },
+    CalendarMonthGrid_month__horizontal: {
+      display: 'inline-block',
+      verticalAlign: 'top',
+      minHeight: '100%'
+    },
+    CalendarMonthGrid_month__hideForAnimation: {
+      position: 'absolute',
+      zIndex: zIndex - 1,
+      opacity: 0,
+      pointerEvents: 'none'
+    },
+    CalendarMonthGrid_month__hidden: {
+      visibility: 'hidden'
+    }
+  };
+}, {
+  pureComponent: typeof _react["default"].PureComponent !== 'undefined'
+})(CalendarMonthGrid);

package/lib/components/CalendarWeek.js

@@ -0,0 +1,18 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = CalendarWeek;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _airbnbPropTypes = require("airbnb-prop-types");
+var propTypes = process.env.NODE_ENV !== "production" ? (0, _airbnbPropTypes.forbidExtraProps)({
+  children: _propTypes["default"].node.isRequired
+}) : {};
+function CalendarWeek(_ref) {
+  var children = _ref.children;
+  return /*#__PURE__*/_react["default"].createElement("tr", null, children);
+}
+CalendarWeek.propTypes = process.env.NODE_ENV !== "production" ? propTypes : {};

package/lib/components/ChevronDown.js

@@ -0,0 +1,18 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _react = _interopRequireDefault(require("react"));
+var ChevronDown = function ChevronDown(props) {
+  return /*#__PURE__*/_react["default"].createElement("svg", props, /*#__PURE__*/_react["default"].createElement("path", {
+    d: "M968 289L514 741c-11 11-21 11-32 0L29 289c-4-5-6-11-6-16 0-13 10-23 23-23 6 0 11 2 15 7l437 436 438-436c4-5 9-7 16-7 6 0 11 2 16 7 9 10 9 21 0 32z"
+  }));
+};
+ChevronDown.defaultProps = {
+  focusable: "false",
+  viewBox: "0 0 1000 1000"
+};
+var _default = exports["default"] = ChevronDown;