material-date-range-picker/YearSelect.js

React components, that implements material design pickers for material-ui v1

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.default = void 0;

var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));

var _react = _interopRequireWildcard(require("react"));

var _styledComponents = _interopRequireDefault(require("styled-components"));

var _dateFns = require("date-fns");

var _Components = require("./Components");

function _templateObject() {
  var data = (0, _taggedTemplateLiteralLoose2.default)(["\n  && {\n    margin-top: 8px;\n  }\n"]);

  _templateObject = function _templateObject() {
    return data;
  };

  return data;
}

var Divider = (0, _styledComponents.default)(_Components.HeaderDivider)(_templateObject());

function getSurroundingYears(date, amount, dateFormat) {
  if (amount === void 0) {
    amount = 8;
  }

  if (dateFormat === void 0) {
    dateFormat = 'YYYY';
  }

  var result = [];
  var selectedYearIndex = (0, _dateFns.getYear)(date) % amount;

  for (var year = 0; year < amount; year++) {
    var dateValue = (0, _dateFns.addYears)(date, year - selectedYearIndex);
    result.push({
      dateValue: dateValue,
      label: (0, _dateFns.format)(dateValue, dateFormat)
    });
  }

  return result;
}

function YearSelect(props) {
  var setDate = props.setDate,
      date = props.date;
  return _react.default.createElement(_react.Fragment, null, _react.default.createElement(Divider, null), _react.default.createElement(_Components.Row, null, getSurroundingYears(date).map(function (year) {
    return _react.default.createElement(_Components.SelectableCell, {
      key: year.label,
      widthPercentage: 1 / 4,
      horizontalSpacing: true,
      onClick: function onClick() {
        return setDate(year.dateValue);
      },
      isSelected: (0, _dateFns.isSameYear)(year.dateValue, date),
      isCurrent: (0, _dateFns.isThisYear)(year.dateValue)
    }, _react.default.createElement(_Components.Text, null, year.label));
  })));
}

var _default = YearSelect;
exports.default = _default;