@seafile/seafile-calendar 0.0.2 → 0.0.3-Apoi0.1

package/es/Calendar.js

@@ -7,6 +7,7 @@ import ReactDOM from 'react-dom';
 import PropTypes from 'prop-types';
 import KeyCode from 'rc-util/es/KeyCode';
 import { polyfill } from 'react-lifecycles-compat';
+import dayjs from 'dayjs';
 import DateTable from './date/DateTable';
 import CalendarHeader from './calendar/CalendarHeader';
 import CalendarFooter from './calendar/CalendarFooter';
@@ -16,12 +17,17 @@ import { commonMixinWrapper, propType, defaultProp } from './mixin/CommonMixin';
 import DateInput from './date/DateInput';
 import { getTimeConfig, getTodayTime, syncTime } from './util';
 import { goStartMonth, goEndMonth, goTime } from './util/toTime';
-import moment from 'moment';
+import localeData from 'dayjs/plugin/localeData';
+import utc from 'dayjs/plugin/utc';
+import weekOfYear from 'dayjs/plugin/weekOfYear';
+dayjs.extend(utc);
+dayjs.extend(localeData);
+dayjs.extend(weekOfYear);
 
 function noop() {}
 
 var getMomentObjectIfValid = function getMomentObjectIfValid(date) {
-  if (moment.isMoment(date) && date.isValid()) {
+  if (dayjs.isDayjs(date) && date.isValid()) {
     return date;
   }
   return false;
@@ -39,7 +45,7 @@ var Calendar = function (_React$Component) {
 
     _this.state = {
       mode: _this.props.mode || 'date',
-      value: getMomentObjectIfValid(props.value) || getMomentObjectIfValid(props.defaultValue) || moment(),
+      value: getMomentObjectIfValid(props.value) || getMomentObjectIfValid(props.defaultValue) || dayjs(),
       selectedValue: props.selectedValue || props.defaultSelectedValue
     };
     return _this;
@@ -78,11 +84,14 @@ var Calendar = function (_React$Component) {
         disabledDate = props.disabledDate,
         dateInputPlaceholder = props.dateInputPlaceholder,
         timePicker = props.timePicker,
+        onClickRightPanelTime = props.onClickRightPanelTime,
         disabledTime = props.disabledTime,
         clearIcon = props.clearIcon,
         renderFooter = props.renderFooter,
         inputMode = props.inputMode,
-        showTimeAndHour = props.showTimeAndHour;
+        showHourAndMinute = props.showHourAndMinute,
+        firstDayOfWeek = props.firstDayOfWeek,
+        showWeekNumber = props.showWeekNumber;
     var value = state.value,
         selectedValue = state.selectedValue,
         mode = state.mode;
@@ -109,13 +118,14 @@ var Calendar = function (_React$Component) {
 
       timePickerEle = React.cloneElement(timePicker, timePickerProps);
     }
+    var calendarInputPlaceholder = dateInputPlaceholder || (Array.isArray(this.getFormat()) ? this.getFormat()[0] : this.getFormat());
 
     var dateInputElement = props.showDateInput ? React.createElement(DateInput, {
       format: this.getFormat(),
       key: 'date-input',
       value: value,
       locale: locale,
-      placeholder: dateInputPlaceholder,
+      placeholder: calendarInputPlaceholder,
       showClear: true,
       disabledTime: disabledTime,
       disabledDate: disabledDate,
@@ -175,7 +185,8 @@ var Calendar = function (_React$Component) {
               dateRender: props.dateRender,
               onSelect: this.onDateTableSelect,
               disabledDate: disabledDate,
-              showWeekNumber: props.showWeekNumber
+              showWeekNumber: showWeekNumber,
+              firstDayOfWeek: firstDayOfWeek
             })
           ),
           React.createElement(CalendarFooter, {
@@ -200,10 +211,14 @@ var Calendar = function (_React$Component) {
             onCloseTimePicker: this.closeTimePicker
           })
         ),
-        !showTimeAndHour && React.createElement(CalendarRightPanel, {
+        showHourAndMinute && React.createElement(CalendarRightPanel, {
           prefixCls: prefixCls,
           value: value,
-          onSelect: this.onDateTableSelect
+          locale: locale,
+          onSelect: this.onDateTableSelect,
+          onClickRightPanelTime: onClickRightPanelTime,
+          defaultMinutesTime: this.props.defaultMinutesTime,
+          format: this.getFormat()
         })
       )
     ));
@@ -231,6 +246,8 @@ Calendar.propTypes = _extends({}, calendarMixinPropTypes, propType, {
   showWeekNumber: PropTypes.bool,
   showToday: PropTypes.bool,
   showOk: PropTypes.bool,
+  showHourAndMinute: PropTypes.bool,
+  defaultMinutesTime: PropTypes.string,
   onSelect: PropTypes.func,
   onOk: PropTypes.func,
   onKeyDown: PropTypes.func,
@@ -247,15 +264,20 @@ Calendar.propTypes = _extends({}, calendarMixinPropTypes, propType, {
   clearIcon: PropTypes.node,
   focusablePanel: PropTypes.bool,
   inputMode: PropTypes.string,
-  onBlur: PropTypes.func
+  onBlur: PropTypes.func,
+  onClickRightPanelTime: PropTypes.func,
+  firstDayOfWeek: PropTypes.string
 });
 Calendar.defaultProps = _extends({}, calendarMixinDefaultProps, defaultProp, {
   showToday: true,
   showDateInput: true,
+  showHourAndMinute: false,
   timePicker: null,
   onOk: noop,
   onPanelChange: noop,
-  focusablePanel: true
+  onClickRightPanelTime: noop,
+  focusablePanel: true,
+  firstDayOfWeek: 'Sunday'
 });
 
 var _initialiseProps = function _initialiseProps() {

package/es/FullCalendar.js

@@ -10,7 +10,7 @@ import MonthTable from './month/MonthTable';
 import { calendarMixinWrapper, calendarMixinPropTypes, calendarMixinDefaultProps, getNowByCurrentStateValue } from './mixin/CalendarMixin';
 import { commonMixinWrapper, propType, defaultProp } from './mixin/CommonMixin';
 import CalendarHeader from './full-calendar/CalendarHeader';
-import moment from 'moment';
+import dayjs from './util/dayjs';
 
 var FullCalendar = function (_React$Component) {
   _inherits(FullCalendar, _React$Component);
@@ -31,7 +31,7 @@ var FullCalendar = function (_React$Component) {
 
     _this.state = {
       type: type,
-      value: props.value || props.defaultValue || moment(),
+      value: props.value || props.defaultValue || dayjs(),
       selectedValue: props.selectedValue || props.defaultSelectedValue
     };
     return _this;

package/es/MonthCalendar.js

@@ -10,7 +10,7 @@ import CalendarHeader from './calendar/CalendarHeader';
 import CalendarFooter from './calendar/CalendarFooter';
 import { calendarMixinWrapper, calendarMixinPropTypes, calendarMixinDefaultProps } from './mixin/CalendarMixin';
 import { commonMixinWrapper, propType, defaultProp } from './mixin/CommonMixin';
-import moment from 'moment';
+import dayjs from './util/dayjs';
 
 var MonthCalendar = function (_React$Component) {
   _inherits(MonthCalendar, _React$Component);
@@ -30,26 +30,26 @@ var MonthCalendar = function (_React$Component) {
       switch (keyCode) {
         case KeyCode.DOWN:
           value = stateValue.clone();
-          value.add(3, 'months');
+          value = value.add(3, 'months');
           break;
         case KeyCode.UP:
           value = stateValue.clone();
-          value.add(-3, 'months');
+          value = value.add(-3, 'months');
           break;
         case KeyCode.LEFT:
           value = stateValue.clone();
           if (ctrlKey) {
-            value.add(-1, 'years');
+            value = value.add(-1, 'years');
           } else {
-            value.add(-1, 'months');
+            value = value.add(-1, 'months');
           }
           break;
         case KeyCode.RIGHT:
           value = stateValue.clone();
           if (ctrlKey) {
-            value.add(1, 'years');
+            value = value.add(1, 'years');
           } else {
-            value.add(1, 'months');
+            value = value.add(1, 'months');
           }
           break;
         case KeyCode.ENTER:
@@ -76,7 +76,7 @@ var MonthCalendar = function (_React$Component) {
 
     _this.state = {
       mode: 'month',
-      value: props.value || props.defaultValue || moment(),
+      value: props.value || props.defaultValue || dayjs(),
       selectedValue: props.selectedValue || props.defaultSelectedValue
     };
     return _this;

package/es/RangeCalendar.js

@@ -4,7 +4,6 @@ import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructo
 import _inherits from 'babel-runtime/helpers/inherits';
 import React from 'react';
 import PropTypes from 'prop-types';
-import moment from 'moment';
 import classnames from 'classnames';
 import { polyfill } from 'react-lifecycles-compat';
 import KeyCode from 'rc-util/es/KeyCode';
@@ -15,6 +14,7 @@ import TimePickerButton from './calendar/TimePickerButton';
 import { commonMixinWrapper, propType, defaultProp } from './mixin/CommonMixin';
 import { syncTime, getTodayTime, isAllowedDate } from './util';
 import { goTime, goStartMonth, goEndMonth, includesTime } from './util/toTime';
+import dayjs from './util/dayjs';
 
 function noop() {}
 
@@ -55,7 +55,7 @@ function normalizeAnchor(props, init) {
   var selectedValue = props.selectedValue || init && props.defaultSelectedValue;
   var value = props.value || init && props.defaultValue;
   var normalizedValue = value ? getValueFromSelectedValue(value) : getValueFromSelectedValue(selectedValue);
-  return !isEmptyArray(normalizedValue) ? normalizedValue : init && [moment(), moment().add(1, 'months')];
+  return !isEmptyArray(normalizedValue) ? normalizedValue : init && [dayjs(), dayjs().add(1, 'months')];
 }
 
 function generateOptions(length, extraOptionGen) {
@@ -414,7 +414,7 @@ var _initialiseProps = function _initialiseProps() {
       var nextHoverValue = void 0;
 
       if (!firstSelectedValue) {
-        currentHoverTime = hoverValue[0] || selectedValue[0] || value[0] || moment();
+        currentHoverTime = hoverValue[0] || selectedValue[0] || value[0] || dayjs();
         nextHoverTime = func(currentHoverTime);
         nextHoverValue = [nextHoverTime];
         _this2.fireHoverValueChange(nextHoverValue);
@@ -804,7 +804,7 @@ var _initialiseProps = function _initialiseProps() {
 
     // 尚未选择过时间，直接输入的话
     if (!_this2.state.selectedValue[0] || !_this2.state.selectedValue[1]) {
-      var startValue = selectedValue[0] || moment();
+      var startValue = selectedValue[0] || dayjs();
       var endValue = selectedValue[1] || startValue.clone().add(1, 'months');
       _this2.setState({
         selectedValue: selectedValue,

package/es/calendar/CalendarHeader.js

@@ -10,13 +10,13 @@ import DecadePanel from '../decade/DecadePanel';
 
 function goMonth(direction) {
   var next = this.props.value.clone();
-  next.add(direction, 'months');
+  next = next.add(direction, 'months');
   this.props.onValueChange(next);
 }
 
 function goYear(direction) {
   var next = this.props.value.clone();
-  next.add(direction, 'years');
+  next = next.add(direction, 'years');
   this.props.onValueChange(next);
 }
 

package/es/calendar/CalendarRightPanel.js

@@ -3,7 +3,8 @@ import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructo
 import _inherits from 'babel-runtime/helpers/inherits';
 import React from 'react';
 import PropTypes from 'prop-types';
-import moment from 'moment';
+import dayjs from 'dayjs';
+import { tokenizeFormattedDate } from '../util';
 
 var CalendarRightPanel = function (_React$Component) {
   _inherits(CalendarRightPanel, _React$Component);
@@ -18,6 +19,18 @@ var CalendarRightPanel = function (_React$Component) {
         highlightTime: value
       });
       _this.props.onSelect(value);
+      _this.props.onClickRightPanelTime();
+    };
+
+    _this.getTimes = function () {
+      var times = [];
+      for (var i = 0; i < 24; i++) {
+        var str = (String(i) + ':00').padStart(5, '0');
+        var str1 = (String(i) + ':30').padStart(5, '0');
+        times.push(str);
+        times.push(str1);
+      }
+      return times;
     };
 
     _this.scrollUp = function () {
@@ -28,39 +41,45 @@ var CalendarRightPanel = function (_React$Component) {
       _this.timeRef.current.scrollBy(0, 200);
     };
 
+    var format = Array.isArray(_this.props.format) ? _this.props.format[0] : _this.props.format;
     _this.state = {
-      highlightTime: _this.props.value || null
+      highlightTime: _this.props.value || null,
+      localeFormat: format
     };
     _this.timeRef = React.createRef();
+    _this.times = _this.getTimes();
     return _this;
   }
 
+  CalendarRightPanel.prototype.componentDidMount = function componentDidMount() {
+    var defaultMinutesTime = this.props.defaultMinutesTime;
+
+    var showTimeIndex = this.times.findIndex(function (item) {
+      return item >= defaultMinutesTime;
+    });
+    var scrollTimeIndex = showTimeIndex > -1 ? showTimeIndex - 1 : 16;
+    this.timeRef.current.scrollTo(0, 34 * scrollTimeIndex);
+  };
+
   CalendarRightPanel.prototype.render = function render() {
     var _this2 = this;
 
     var _props = this.props,
         value = _props.value,
-        prefixCls = _props.prefixCls;
+        prefixCls = _props.prefixCls,
+        locale = _props.locale;
 
-    var selectedDate = value.format().slice(0, 10);
-    var times = [];
-    for (var i = 0; i < 24; i++) {
-      var str = (String(i) + ':00').padStart(5, '0');
-      var str1 = (String(i) + ':30').padStart(5, '0');
-      times.push(str);
-      times.push(str1);
-    }
+    var selectedDate = value.format().slice(0, String(value.format()).indexOf('T'));
+    var highlight = this.state.highlightTime;
+    var highlightTime = highlight ? highlight.format().slice(11, 16) : null;
+    var isZhcn = locale && locale.today === '今天';
     return React.createElement(
       'div',
       { className: prefixCls + '-right-panel' },
       React.createElement(
         'div',
         { className: prefixCls + '-right-panel-header', onClick: this.scrollUp },
-        React.createElement(
-          'span',
-          null,
-          React.createElement('i', { className: 'fas fa-chevron-up' })
-        )
+        React.createElement('span', null)
       ),
       React.createElement(
         'div',
@@ -68,15 +87,16 @@ var CalendarRightPanel = function (_React$Component) {
         React.createElement(
           'ul',
           null,
-          times.map(function (time) {
-            var current = moment(selectedDate + ' ' + time);
-            var isHightlight = current.isSame(_this2.state.highlightTime) ? 'highlight' : '';
+          this.times.map(function (time) {
+            var parts = tokenizeFormattedDate(selectedDate, _this2.state.localeFormat);
+            var current = dayjs(selectedDate + ' ' + time).year(parts[0]).month(parts[1] - 1).date(parts[2]); // eslint-disable-line max-len
+            current = isZhcn ? current.locale('zh-cn') : current.locale('en-gb');
             return React.createElement(
               'li',
               {
                 key: time,
-                onClick: _this2.onSelect.bind(null, current),
-                className: '' + isHightlight
+                onClick: _this2.onSelect.bind(_this2, current),
+                className: '' + (highlightTime === time ? prefixCls + '-selected-time' : '')
               },
               time
             );
@@ -86,11 +106,7 @@ var CalendarRightPanel = function (_React$Component) {
       React.createElement(
         'div',
         { className: prefixCls + '-right-panel-footer', onClick: this.scrollDown },
-        React.createElement(
-          'span',
-          null,
-          React.createElement('i', { className: 'fas fa-chevron-down' })
-        )
+        React.createElement('span', null)
       )
     );
   };
@@ -101,6 +117,10 @@ var CalendarRightPanel = function (_React$Component) {
 CalendarRightPanel.propTypes = {
   prefixCls: PropTypes.string,
   value: PropTypes.object,
-  onSelect: PropTypes.func
+  onSelect: PropTypes.func,
+  onClickRightPanelTime: PropTypes.func,
+  locale: PropTypes.object,
+  defaultMinutesTime: PropTypes.string,
+  format: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)])
 };
 export default CalendarRightPanel;

package/es/date/DateConstants.js

@@ -1,4 +1,19 @@
-export default {
+var DATE_ROW_COLUMN_COUNT = {
   DATE_ROW_COUNT: 6,
   DATE_COL_COUNT: 7
+};
+
+var DAY_NAME_TO_INDEX = {
+  Sunday: 0,
+  Monday: 1,
+  Tuesday: 2,
+  Wednesday: 3,
+  Thursday: 4,
+  Friday: 5,
+  Saturday: 6
+};
+
+export default {
+  DATE_ROW_COLUMN_COUNT: DATE_ROW_COLUMN_COUNT,
+  DAY_NAME_TO_INDEX: DAY_NAME_TO_INDEX
 };

package/es/date/DateInput.js

@@ -6,8 +6,11 @@ import ReactDOM from 'react-dom';
 import PropTypes from 'prop-types';
 import KeyCode from 'rc-util/es/KeyCode';
 import { polyfill } from 'react-lifecycles-compat';
-import moment from 'moment';
-import { formatDate } from '../util';
+import dayjs from 'dayjs';
+import { formatDate, initializeStr } from '../util';
+var customParseFormat = require('dayjs/plugin/customParseFormat');
+
+dayjs.extend(customParseFormat);
 
 var cachedSelectionStart = void 0;
 var cachedSelectionEnd = void 0;
@@ -27,14 +30,14 @@ var DateInput = function (_React$Component) {
 
     _this.state = {
       str: formatDate(selectedValue, _this.props.format),
-      invalid: false,
-      hasFocus: false
+      hasFocus: false,
+      localFormat: _this.props.format[0]
     };
     return _this;
   }
 
   DateInput.prototype.componentDidUpdate = function componentDidUpdate() {
-    if (dateInputInstance && this.state.hasFocus && !this.state.invalid && !(cachedSelectionStart === 0 && cachedSelectionEnd === 0)) {
+    if (dateInputInstance && this.state.hasFocus && !(cachedSelectionStart === 0 && cachedSelectionEnd === 0)) {
       dateInputInstance.setSelectionRange(cachedSelectionStart, cachedSelectionEnd);
     }
   };
@@ -49,10 +52,7 @@ var DateInput = function (_React$Component) {
     // when popup show, click body will call this, bug!
     var selectedValue = nextProps.selectedValue;
     if (!state.hasFocus) {
-      newState = {
-        str: formatDate(selectedValue, nextProps.format),
-        invalid: false
-      };
+      newState = { str: formatDate(selectedValue, nextProps.format) };
     }
 
     return newState;
@@ -64,16 +64,13 @@ var DateInput = function (_React$Component) {
 
   DateInput.prototype.render = function render() {
     var props = this.props;
-    var _state = this.state,
-        invalid = _state.invalid,
-        str = _state.str;
+    var str = this.state.str;
     var locale = props.locale,
         prefixCls = props.prefixCls,
         placeholder = props.placeholder,
         clearIcon = props.clearIcon,
         inputMode = props.inputMode;
 
-    var invalidClass = invalid ? prefixCls + '-input-invalid' : '';
     return React.createElement(
       'div',
       { className: prefixCls + '-input-wrap' },
@@ -82,7 +79,7 @@ var DateInput = function (_React$Component) {
         { className: prefixCls + '-date-input-wrap' },
         React.createElement('input', {
           ref: this.saveDateInput,
-          className: prefixCls + '-input ' + invalidClass,
+          className: prefixCls + '-input',
           value: str,
           disabled: props.disabled,
           placeholder: placeholder,
@@ -129,14 +126,13 @@ var _initialiseProps = function _initialiseProps() {
   var _this2 = this;
 
   this.onClear = function () {
-    _this2.setState({
-      str: ''
-    });
+    _this2.setState({ str: '' });
     _this2.props.onClear(null);
   };
 
   this.onInputChange = function (event) {
     var str = event.target.value;
+    var calendarStr = initializeStr(str, _this2.state.localFormat) || '';
     var _props = _this2.props,
         disabledDate = _props.disabledDate,
         format = _props.format,
@@ -145,41 +141,22 @@ var _initialiseProps = function _initialiseProps() {
 
     // 没有内容，合法并直接退出
 
-    if (!str) {
+    if (!calendarStr) {
       onChange(null);
-      _this2.setState({
-        invalid: false,
-        str: str
-      });
+      _this2.setState({ str: '' });
       return;
     }
-
-    // 不合法直接退出
-    var parsed = moment(str, format, true);
-    if (!parsed.isValid()) {
-      _this2.setState({
-        invalid: true,
-        str: str
-      });
-      return;
-    }
-
+    var parsed = dayjs(calendarStr, format[0]);
     var value = _this2.props.value.clone();
-    value.year(parsed.year()).month(parsed.month()).date(parsed.date()).hour(parsed.hour()).minute(parsed.minute()).second(parsed.second());
+    value = value.year(parsed.year()).month(parsed.month()).date(parsed.date()).hour(parsed.hour()).minute(parsed.minute()).second(parsed.second());
 
     if (!value || disabledDate && disabledDate(value)) {
-      _this2.setState({
-        invalid: true,
-        str: str
-      });
+      _this2.setState({ str: str });
       return;
     }
 
     if (selectedValue !== value || selectedValue && value && !selectedValue.isSame(value)) {
-      _this2.setState({
-        invalid: false,
-        str: str
-      });
+      _this2.setState({ str: str });
       onChange(value);
     }
   };

package/es/date/DateTBody.js

@@ -7,6 +7,10 @@ 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');
 }
@@ -47,7 +51,8 @@ var DateTBody = function (_React$Component) {
         showWeekNumber = props.showWeekNumber,
         dateRender = props.dateRender,
         disabledDate = props.disabledDate,
-        hoverValue = props.hoverValue;
+        hoverValue = props.hoverValue,
+        firstDayOfWeek = props.firstDayOfWeek;
 
     var iIndex = void 0;
     var jIndex = void 0;
@@ -70,20 +75,22 @@ var DateTBody = function (_React$Component) {
     var lastDisableClass = prefixCls + '-disabled-cell-last-of-row';
     var lastDayOfMonthClass = prefixCls + '-last-day-of-month';
     var month1 = value.clone();
-    month1.date(1);
+    month1 = month1.date(1);
     var day = month1.day();
-    var lastMonthDiffDay = (day + 7 - value.localeData().firstDayOfWeek()) % 7;
+    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.add(0 - lastMonthDiffDay, 'days');
+    lastMonth1 = lastMonth1.add(0 - lastMonthDiffDay, 'days');
     var passed = 0;
 
-    for (iIndex = 0; iIndex < DateConstants.DATE_ROW_COUNT; iIndex++) {
-      for (jIndex = 0; jIndex < DateConstants.DATE_COL_COUNT; jIndex++) {
+    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.add(passed, 'days');
+          current = current.add(passed, 'days');
         }
         dateTable.push(current);
         passed++;
@@ -92,7 +99,7 @@ var DateTBody = function (_React$Component) {
     var tableHtml = [];
     passed = 0;
 
-    for (iIndex = 0; iIndex < DateConstants.DATE_ROW_COUNT; iIndex++) {
+    for (iIndex = 0; iIndex < DATE_ROW_COLUMN_COUNT.DATE_ROW_COUNT; iIndex++) {
       var _cx;
 
       var isCurrentWeek = void 0;
@@ -110,11 +117,11 @@ var DateTBody = function (_React$Component) {
           dateTable[passed].week()
         );
       }
-      for (jIndex = 0; jIndex < DateConstants.DATE_COL_COUNT; jIndex++) {
+      for (jIndex = 0; jIndex < DATE_ROW_COLUMN_COUNT.DATE_COL_COUNT; jIndex++) {
         var next = null;
         var last = null;
         current = dateTable[passed];
-        if (jIndex < DateConstants.DATE_COL_COUNT - 1) {
+        if (jIndex < DATE_ROW_COLUMN_COUNT.DATE_COL_COUNT - 1) {
           next = dateTable[passed + 1];
         }
         if (jIndex > 0) {
@@ -264,7 +271,8 @@ DateTBody.propTypes = {
   selectedValue: PropTypes.oneOfType([PropTypes.object, PropTypes.arrayOf(PropTypes.object)]),
   value: PropTypes.object,
   hoverValue: PropTypes.any,
-  showWeekNumber: PropTypes.bool
+  showWeekNumber: PropTypes.bool,
+  firstDayOfWeek: PropTypes.string
 };
 DateTBody.defaultProps = {
   hoverValue: []

package/es/date/DateTHead.js

@@ -3,7 +3,9 @@ import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructo
 import _inherits from 'babel-runtime/helpers/inherits';
 import React from 'react';
 import DateConstants from './DateConstants';
-import moment from 'moment';
+
+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);
@@ -21,14 +23,19 @@ var DateTHead = function (_React$Component) {
     var prefixCls = props.prefixCls;
     var veryShortWeekdays = [];
     var weekDays = [];
-    var firstDayOfWeek = localeData.firstDayOfWeek();
+
+    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 now = moment();
-    for (var dateColIndex = 0; dateColIndex < DateConstants.DATE_COL_COUNT; dateColIndex++) {
-      var index = (firstDayOfWeek + dateColIndex) % DateConstants.DATE_COL_COUNT;
-      now.day(index);
-      veryShortWeekdays[dateColIndex] = localeData.weekdaysMin(now);
-      weekDays[dateColIndex] = localeData.weekdaysShort(now);
+    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) {