Вы не можете выбрать более 25 тем Темы должны начинаться с буквы или цифры, могут содержать дефисы(-) и должны содержать не более 35 символов.
 
 
 
 

180 строки
5.5 KiB

  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
  6. var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
  7. var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
  8. var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
  9. var _createClass2 = require('babel-runtime/helpers/createClass');
  10. var _createClass3 = _interopRequireDefault(_createClass2);
  11. var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
  12. var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
  13. var _inherits2 = require('babel-runtime/helpers/inherits');
  14. var _inherits3 = _interopRequireDefault(_inherits2);
  15. var _react = require('react');
  16. var _react2 = _interopRequireDefault(_react);
  17. var _propTypes = require('prop-types');
  18. var _propTypes2 = _interopRequireDefault(_propTypes);
  19. var _IconButton = require('../IconButton');
  20. var _IconButton2 = _interopRequireDefault(_IconButton);
  21. var _chevronLeft = require('../svg-icons/navigation/chevron-left');
  22. var _chevronLeft2 = _interopRequireDefault(_chevronLeft);
  23. var _chevronRight = require('../svg-icons/navigation/chevron-right');
  24. var _chevronRight2 = _interopRequireDefault(_chevronRight);
  25. var _SlideIn = require('../internal/SlideIn');
  26. var _SlideIn2 = _interopRequireDefault(_SlideIn);
  27. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  28. var styles = {
  29. root: {
  30. display: 'flex',
  31. justifyContent: 'space-between',
  32. backgroundColor: 'inherit',
  33. height: 48
  34. },
  35. titleDiv: {
  36. fontSize: 14,
  37. fontWeight: '500',
  38. textAlign: 'center',
  39. width: '100%'
  40. },
  41. titleText: {
  42. height: 'inherit',
  43. paddingTop: 12
  44. }
  45. };
  46. var CalendarToolbar = function (_Component) {
  47. (0, _inherits3.default)(CalendarToolbar, _Component);
  48. function CalendarToolbar() {
  49. var _ref;
  50. var _temp, _this, _ret;
  51. (0, _classCallCheck3.default)(this, CalendarToolbar);
  52. for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
  53. args[_key] = arguments[_key];
  54. }
  55. return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = CalendarToolbar.__proto__ || (0, _getPrototypeOf2.default)(CalendarToolbar)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
  56. transitionDirection: 'up'
  57. }, _this.handleClickPrevMonth = function () {
  58. if (_this.props.onMonthChange) {
  59. _this.props.onMonthChange(-1);
  60. }
  61. }, _this.handleClickNextMonth = function () {
  62. if (_this.props.onMonthChange) {
  63. _this.props.onMonthChange(1);
  64. }
  65. }, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
  66. }
  67. (0, _createClass3.default)(CalendarToolbar, [{
  68. key: 'componentWillReceiveProps',
  69. value: function componentWillReceiveProps(nextProps) {
  70. if (nextProps.displayDate !== this.props.displayDate) {
  71. var nextDirection = this.context.muiTheme.isRtl ? 'right' : 'left';
  72. var prevDirection = this.context.muiTheme.isRtl ? 'left' : 'right';
  73. var direction = nextProps.displayDate > this.props.displayDate ? nextDirection : prevDirection;
  74. this.setState({
  75. transitionDirection: direction
  76. });
  77. }
  78. }
  79. }, {
  80. key: 'render',
  81. value: function render() {
  82. var _props = this.props,
  83. DateTimeFormat = _props.DateTimeFormat,
  84. locale = _props.locale,
  85. displayDate = _props.displayDate;
  86. var dateTimeFormatted = new DateTimeFormat(locale, {
  87. month: 'long',
  88. year: 'numeric'
  89. }).format(displayDate);
  90. var nextButtonIcon = this.context.muiTheme.isRtl ? _react2.default.createElement(_chevronLeft2.default, null) : _react2.default.createElement(_chevronRight2.default, null);
  91. var prevButtonIcon = this.context.muiTheme.isRtl ? _react2.default.createElement(_chevronRight2.default, null) : _react2.default.createElement(_chevronLeft2.default, null);
  92. return _react2.default.createElement(
  93. 'div',
  94. { style: styles.root },
  95. _react2.default.createElement(
  96. _IconButton2.default,
  97. {
  98. disabled: !this.props.prevMonth,
  99. onClick: this.handleClickPrevMonth
  100. },
  101. prevButtonIcon
  102. ),
  103. _react2.default.createElement(
  104. _SlideIn2.default,
  105. {
  106. direction: this.state.transitionDirection,
  107. style: styles.titleDiv
  108. },
  109. _react2.default.createElement(
  110. 'div',
  111. { key: dateTimeFormatted, style: styles.titleText },
  112. dateTimeFormatted
  113. )
  114. ),
  115. _react2.default.createElement(
  116. _IconButton2.default,
  117. {
  118. disabled: !this.props.nextMonth,
  119. onClick: this.handleClickNextMonth
  120. },
  121. nextButtonIcon
  122. )
  123. );
  124. }
  125. }]);
  126. return CalendarToolbar;
  127. }(_react.Component);
  128. CalendarToolbar.defaultProps = {
  129. nextMonth: true,
  130. prevMonth: true
  131. };
  132. CalendarToolbar.contextTypes = {
  133. muiTheme: _propTypes2.default.object.isRequired
  134. };
  135. CalendarToolbar.propTypes = process.env.NODE_ENV !== "production" ? {
  136. DateTimeFormat: _propTypes2.default.func.isRequired,
  137. displayDate: _propTypes2.default.object.isRequired,
  138. locale: _propTypes2.default.string.isRequired,
  139. nextMonth: _propTypes2.default.bool,
  140. onMonthChange: _propTypes2.default.func,
  141. prevMonth: _propTypes2.default.bool
  142. } : {};
  143. exports.default = CalendarToolbar;