@seafile/seafile-calendar 0.0.30-beta.2 → 0.0.30-beta.3

package/es/date/DateTBody.js

@@ -0,0 +1,280 @@
+import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
+import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
+import _inherits from 'babel-runtime/helpers/inherits';
+import React from 'react';
+import PropTypes from 'prop-types';
+import cx from 'classnames';
+import DateConstants from './DateConstants';
+import { getTitleString, getTodayTime } from '../util/';
+
+var DATE_ROW_COLUMN_COUNT = DateConstants.DATE_ROW_COLUMN_COUNT,
+    DAY_NAME_TO_INDEX = DateConstants.DAY_NAME_TO_INDEX;
+
+
+function isSameDay(one, two) {
+  return one && two && one.isSame(two, 'day');
+}
+
+function beforeCurrentMonthYear(current, today) {
+  if (current.year() < today.year()) {
+    return 1;
+  }
+  return current.year() === today.year() && current.month() < today.month();
+}
+
+function afterCurrentMonthYear(current, today) {
+  if (current.year() > today.year()) {
+    return 1;
+  }
+  return current.year() === today.year() && current.month() > today.month();
+}
+
+function getIdFromDate(date) {
+  return 'rc-calendar-' + date.year() + '-' + date.month() + '-' + date.date();
+}
+
+var DateTBody = function (_React$Component) {
+  _inherits(DateTBody, _React$Component);
+
+  function DateTBody() {
+    _classCallCheck(this, DateTBody);
+
+    return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));
+  }
+
+  DateTBody.prototype.render = function render() {
+    var props = this.props;
+    var contentRender = props.contentRender,
+        prefixCls = props.prefixCls,
+        selectedValue = props.selectedValue,
+        value = props.value,
+        showWeekNumber = props.showWeekNumber,
+        dateRender = props.dateRender,
+        disabledDate = props.disabledDate,
+        hoverValue = props.hoverValue,
+        firstDayOfWeek = props.firstDayOfWeek;
+
+    var iIndex = void 0;
+    var jIndex = void 0;
+    var current = void 0;
+    var dateTable = [];
+    var today = getTodayTime(value);
+    var cellClass = prefixCls + '-cell';
+    var weekNumberCellClass = prefixCls + '-week-number-cell';
+    var dateClass = prefixCls + '-date';
+    var todayClass = prefixCls + '-today';
+    var selectedClass = prefixCls + '-selected-day';
+    var selectedDateClass = prefixCls + '-selected-date'; // do not move with mouse operation
+    var selectedStartDateClass = prefixCls + '-selected-start-date';
+    var selectedEndDateClass = prefixCls + '-selected-end-date';
+    var inRangeClass = prefixCls + '-in-range-cell';
+    var lastMonthDayClass = prefixCls + '-last-month-cell';
+    var nextMonthDayClass = prefixCls + '-next-month-btn-day';
+    var disabledClass = prefixCls + '-disabled-cell';
+    var firstDisableClass = prefixCls + '-disabled-cell-first-of-row';
+    var lastDisableClass = prefixCls + '-disabled-cell-last-of-row';
+    var lastDayOfMonthClass = prefixCls + '-last-day-of-month';
+    var month1 = value.clone();
+    month1 = month1.date(1);
+    var day = month1.day();
+    var firstDayName = typeof firstDayOfWeek === 'string' ? firstDayOfWeek[0].toUpperCase() + firstDayOfWeek.slice(1) : 'Sunday';
+    var firstDayIndex = DAY_NAME_TO_INDEX[firstDayName] ? DAY_NAME_TO_INDEX[firstDayName] : 0;
+    var lastMonthDiffDay = (day + 7 - firstDayIndex) % 7;
+    // calculate last month
+    var lastMonth1 = month1.clone();
+    lastMonth1 = lastMonth1.add(0 - lastMonthDiffDay, 'days');
+    var passed = 0;
+
+    for (iIndex = 0; iIndex < DATE_ROW_COLUMN_COUNT.DATE_ROW_COUNT; iIndex++) {
+      for (jIndex = 0; jIndex < DATE_ROW_COLUMN_COUNT.DATE_COL_COUNT; jIndex++) {
+        current = lastMonth1;
+        if (passed) {
+          current = current.clone();
+          current = current.add(passed, 'days');
+        }
+        dateTable.push(current);
+        passed++;
+      }
+    }
+    var tableHtml = [];
+    passed = 0;
+
+    for (iIndex = 0; iIndex < DATE_ROW_COLUMN_COUNT.DATE_ROW_COUNT; iIndex++) {
+      var _cx;
+
+      var isCurrentWeek = void 0;
+      var weekNumberCell = void 0;
+      var isActiveWeek = false;
+      var dateCells = [];
+      if (showWeekNumber) {
+        weekNumberCell = React.createElement(
+          'td',
+          {
+            key: dateTable[passed].week(),
+            role: 'gridcell',
+            className: weekNumberCellClass
+          },
+          dateTable[passed].week()
+        );
+      }
+      for (jIndex = 0; jIndex < DATE_ROW_COLUMN_COUNT.DATE_COL_COUNT; jIndex++) {
+        var next = null;
+        var last = null;
+        current = dateTable[passed];
+        if (jIndex < DATE_ROW_COLUMN_COUNT.DATE_COL_COUNT - 1) {
+          next = dateTable[passed + 1];
+        }
+        if (jIndex > 0) {
+          last = dateTable[passed - 1];
+        }
+        var cls = cellClass;
+        var disabled = false;
+        var selected = false;
+
+        if (isSameDay(current, today)) {
+          cls += ' ' + todayClass;
+          isCurrentWeek = true;
+        }
+
+        var isBeforeCurrentMonthYear = beforeCurrentMonthYear(current, value);
+        var isAfterCurrentMonthYear = afterCurrentMonthYear(current, value);
+
+        if (selectedValue && Array.isArray(selectedValue)) {
+          var rangeValue = hoverValue.length ? hoverValue : selectedValue;
+          if (!isBeforeCurrentMonthYear && !isAfterCurrentMonthYear) {
+            var startValue = rangeValue[0];
+            var endValue = rangeValue[1];
+            if (startValue) {
+              if (isSameDay(current, startValue)) {
+                selected = true;
+                isActiveWeek = true;
+                cls += ' ' + selectedStartDateClass;
+              }
+            }
+            if (startValue || endValue) {
+              if (isSameDay(current, endValue)) {
+                selected = true;
+                isActiveWeek = true;
+                cls += ' ' + selectedEndDateClass;
+              } else if ((startValue === null || startValue === undefined) && current.isBefore(endValue, 'day')) {
+                cls += ' ' + inRangeClass;
+              } else if ((endValue === null || endValue === undefined) && current.isAfter(startValue, 'day')) {
+                cls += ' ' + inRangeClass;
+              } else if (current.isAfter(startValue, 'day') && current.isBefore(endValue, 'day')) {
+                cls += ' ' + inRangeClass;
+              }
+            }
+          }
+        } else if (isSameDay(current, value)) {
+          // keyboard change value, highlight works
+          selected = true;
+          isActiveWeek = true;
+        }
+
+        if (isSameDay(current, selectedValue)) {
+          cls += ' ' + selectedDateClass;
+        }
+
+        if (isBeforeCurrentMonthYear) {
+          cls += ' ' + lastMonthDayClass;
+        }
+
+        if (isAfterCurrentMonthYear) {
+          cls += ' ' + nextMonthDayClass;
+        }
+
+        if (current.clone().endOf('month').date() === current.date()) {
+          cls += ' ' + lastDayOfMonthClass;
+        }
+
+        if (disabledDate) {
+          if (disabledDate(current, value)) {
+            disabled = true;
+
+            if (!last || !disabledDate(last, value)) {
+              cls += ' ' + firstDisableClass;
+            }
+
+            if (!next || !disabledDate(next, value)) {
+              cls += ' ' + lastDisableClass;
+            }
+          }
+        }
+
+        if (selected) {
+          cls += ' ' + selectedClass;
+        }
+
+        if (disabled) {
+          cls += ' ' + disabledClass;
+        }
+
+        var dateHtml = void 0;
+        if (dateRender) {
+          dateHtml = dateRender(current, value);
+        } else {
+          var content = contentRender ? contentRender(current, value) : current.date();
+          dateHtml = React.createElement(
+            'div',
+            {
+              key: getIdFromDate(current),
+              className: dateClass,
+              'aria-selected': selected,
+              'aria-disabled': disabled
+            },
+            content
+          );
+        }
+
+        dateCells.push(React.createElement(
+          'td',
+          {
+            key: passed,
+            onClick: disabled ? undefined : props.onSelect.bind(null, current),
+            onMouseEnter: disabled ? undefined : props.onDayHover && props.onDayHover.bind(null, current) || undefined,
+            role: 'gridcell',
+            title: getTitleString(current),
+            className: cls
+          },
+          dateHtml
+        ));
+
+        passed++;
+      }
+
+      tableHtml.push(React.createElement(
+        'tr',
+        {
+          key: iIndex,
+          role: 'row',
+          className: cx((_cx = {}, _cx[prefixCls + '-current-week'] = isCurrentWeek, _cx[prefixCls + '-active-week'] = isActiveWeek, _cx))
+        },
+        weekNumberCell,
+        dateCells
+      ));
+    }
+    return React.createElement(
+      'tbody',
+      { className: prefixCls + '-tbody' },
+      tableHtml
+    );
+  };
+
+  return DateTBody;
+}(React.Component);
+
+DateTBody.propTypes = {
+  contentRender: PropTypes.func,
+  dateRender: PropTypes.func,
+  disabledDate: PropTypes.func,
+  prefixCls: PropTypes.string,
+  selectedValue: PropTypes.oneOfType([PropTypes.object, PropTypes.arrayOf(PropTypes.object)]),
+  value: PropTypes.object,
+  hoverValue: PropTypes.any,
+  showWeekNumber: PropTypes.bool,
+  firstDayOfWeek: PropTypes.string
+};
+DateTBody.defaultProps = {
+  hoverValue: []
+};
+export default DateTBody;

package/es/date/DateTHead.js

@@ -0,0 +1,86 @@
+import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
+import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
+import _inherits from 'babel-runtime/helpers/inherits';
+import React from 'react';
+import DateConstants from './DateConstants';
+
+var DAY_NAME_TO_INDEX = DateConstants.DAY_NAME_TO_INDEX,
+    DATE_ROW_COLUMN_COUNT = DateConstants.DATE_ROW_COLUMN_COUNT;
+
+var DateTHead = function (_React$Component) {
+  _inherits(DateTHead, _React$Component);
+
+  function DateTHead() {
+    _classCallCheck(this, DateTHead);
+
+    return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));
+  }
+
+  DateTHead.prototype.render = function render() {
+    var props = this.props;
+    var value = props.value;
+    var localeData = value.localeData();
+    var prefixCls = props.prefixCls;
+    var veryShortWeekdays = [];
+    var weekDays = [];
+
+    var allWeekdaysMin = localeData.weekdaysMin();
+    var allWeekdaysShort = localeData.weekdaysShort();
+
+    var firstDayName = typeof props.firstDayOfWeek === 'string' ? props.firstDayOfWeek[0].toUpperCase() + props.firstDayOfWeek.slice(1) : 'Sunday';
+    var firstDay = DAY_NAME_TO_INDEX[firstDayName] ? DAY_NAME_TO_INDEX[firstDayName] : 0;
+
+    var showWeekNumberEl = void 0;
+    var dateColumnCount = DATE_ROW_COLUMN_COUNT.DATE_COL_COUNT;
+    for (var dateColIndex = 0; dateColIndex < dateColumnCount; dateColIndex++) {
+      var index = (firstDay + dateColIndex) % dateColumnCount;
+      veryShortWeekdays[dateColIndex] = allWeekdaysMin[index];
+      weekDays[dateColIndex] = allWeekdaysShort[index];
+    }
+
+    if (props.showWeekNumber) {
+      showWeekNumberEl = React.createElement(
+        'th',
+        {
+          role: 'columnheader',
+          className: prefixCls + '-column-header ' + prefixCls + '-week-number-header'
+        },
+        React.createElement(
+          'span',
+          { className: prefixCls + '-column-header-inner' },
+          'x'
+        )
+      );
+    }
+    var weekDaysEls = weekDays.map(function (day, xindex) {
+      return React.createElement(
+        'th',
+        {
+          key: xindex,
+          role: 'columnheader',
+          title: day,
+          className: prefixCls + '-column-header'
+        },
+        React.createElement(
+          'span',
+          { className: prefixCls + '-column-header-inner' },
+          veryShortWeekdays[xindex]
+        )
+      );
+    });
+    return React.createElement(
+      'thead',
+      null,
+      React.createElement(
+        'tr',
+        { role: 'row' },
+        showWeekNumberEl,
+        weekDaysEls
+      )
+    );
+  };
+
+  return DateTHead;
+}(React.Component);
+
+export default DateTHead;

package/es/date/DateTable.js

@@ -0,0 +1,32 @@
+import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
+import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
+import _inherits from 'babel-runtime/helpers/inherits';
+
+import React from 'react';
+import DateTHead from './DateTHead';
+import DateTBody from './DateTBody';
+
+var DateTable = function (_React$Component) {
+  _inherits(DateTable, _React$Component);
+
+  function DateTable() {
+    _classCallCheck(this, DateTable);
+
+    return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));
+  }
+
+  DateTable.prototype.render = function render() {
+    var props = this.props;
+    var prefixCls = props.prefixCls;
+    return React.createElement(
+      'table',
+      { className: prefixCls + '-table', cellSpacing: '0', role: 'grid' },
+      React.createElement(DateTHead, props),
+      React.createElement(DateTBody, props)
+    );
+  };
+
+  return DateTable;
+}(React.Component);
+
+export default DateTable;

package/es/decade/DecadePanel.js

@@ -0,0 +1,181 @@
+import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
+import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
+import _inherits from 'babel-runtime/helpers/inherits';
+import React from 'react';
+import PropTypes from 'prop-types';
+var ROW = 4;
+var COL = 3;
+import classnames from 'classnames';
+
+function goYear(direction) {
+  var next = this.state.value.clone();
+  next = next.add(direction, 'years');
+  this.setState({
+    value: next
+  });
+}
+
+function chooseDecade(year, event) {
+  var next = this.state.value.clone();
+  next = next.year(year);
+  next = next.month(this.state.value.month());
+  this.props.onSelect(next);
+  event.preventDefault();
+}
+
+var DecadePanel = function (_React$Component) {
+  _inherits(DecadePanel, _React$Component);
+
+  function DecadePanel(props) {
+    _classCallCheck(this, DecadePanel);
+
+    var _this = _possibleConstructorReturn(this, _React$Component.call(this, props));
+
+    _this.state = {
+      value: props.value || props.defaultValue
+    };
+
+    // bind methods
+    _this.prefixCls = props.rootPrefixCls + '-decade-panel';
+    _this.nextCentury = goYear.bind(_this, 100);
+    _this.previousCentury = goYear.bind(_this, -100);
+    return _this;
+  }
+
+  DecadePanel.prototype.render = function render() {
+    var _this2 = this;
+
+    var value = this.state.value;
+    var _props = this.props,
+        locale = _props.locale,
+        renderFooter = _props.renderFooter;
+
+    var currentYear = value.year();
+    var startYear = parseInt(currentYear / 100, 10) * 100;
+    var preYear = startYear - 10;
+    var endYear = startYear + 99;
+    var decades = [];
+    var index = 0;
+    var prefixCls = this.prefixCls;
+
+    for (var rowIndex = 0; rowIndex < ROW; rowIndex++) {
+      decades[rowIndex] = [];
+      for (var colIndex = 0; colIndex < COL; colIndex++) {
+        var startDecade = preYear + index * 10;
+        var endDecade = preYear + index * 10 + 9;
+        decades[rowIndex][colIndex] = {
+          startDecade: startDecade,
+          endDecade: endDecade
+        };
+        index++;
+      }
+    }
+
+    var footer = renderFooter && renderFooter('decade');
+
+    var decadesEls = decades.map(function (row, decadeIndex) {
+      var tds = row.map(function (decadeData) {
+        var _classNameMap;
+
+        var dStartDecade = decadeData.startDecade;
+        var dEndDecade = decadeData.endDecade;
+        var isLast = dStartDecade < startYear;
+        var isNext = dEndDecade > endYear;
+        var classNameMap = (_classNameMap = {}, _classNameMap[prefixCls + '-cell'] = 1, _classNameMap[prefixCls + '-selected-cell'] = dStartDecade <= currentYear && currentYear <= dEndDecade, _classNameMap[prefixCls + '-last-century-cell'] = isLast, _classNameMap[prefixCls + '-next-century-cell'] = isNext, _classNameMap);
+        var content = dStartDecade + '-' + dEndDecade;
+        var clickHandler = void 0;
+        if (isLast) {
+          clickHandler = _this2.previousCentury;
+        } else if (isNext) {
+          clickHandler = _this2.nextCentury;
+        } else {
+          clickHandler = chooseDecade.bind(_this2, dStartDecade);
+        }
+        return React.createElement(
+          'td',
+          {
+            key: dStartDecade,
+            onClick: clickHandler,
+            role: 'gridcell',
+            className: classnames(classNameMap)
+          },
+          React.createElement(
+            'a',
+            {
+              className: prefixCls + '-decade'
+            },
+            content
+          )
+        );
+      });
+      return React.createElement(
+        'tr',
+        { key: decadeIndex, role: 'row' },
+        tds
+      );
+    });
+
+    return React.createElement(
+      'div',
+      { className: this.prefixCls },
+      React.createElement(
+        'div',
+        { className: prefixCls + '-header' },
+        React.createElement('a', {
+          className: prefixCls + '-prev-century-btn',
+          role: 'button',
+          onClick: this.previousCentury,
+          title: locale.previousCentury
+        }),
+        React.createElement(
+          'div',
+          { className: prefixCls + '-century' },
+          startYear,
+          '-',
+          endYear
+        ),
+        React.createElement('a', {
+          className: prefixCls + '-next-century-btn',
+          role: 'button',
+          onClick: this.nextCentury,
+          title: locale.nextCentury
+        })
+      ),
+      React.createElement(
+        'div',
+        { className: prefixCls + '-body' },
+        React.createElement(
+          'table',
+          { className: prefixCls + '-table', cellSpacing: '0', role: 'grid' },
+          React.createElement(
+            'tbody',
+            { className: prefixCls + '-tbody' },
+            decadesEls
+          )
+        )
+      ),
+      footer && React.createElement(
+        'div',
+        { className: prefixCls + '-footer' },
+        footer
+      )
+    );
+  };
+
+  return DecadePanel;
+}(React.Component);
+
+export default DecadePanel;
+
+
+DecadePanel.propTypes = {
+  locale: PropTypes.object,
+  value: PropTypes.object,
+  defaultValue: PropTypes.object,
+  rootPrefixCls: PropTypes.string,
+  renderFooter: PropTypes.func
+};
+
+DecadePanel.defaultProps = {
+  onSelect: function onSelect() {}
+};