Socket
Socket
Sign inDemoInstall

rc-calendar

Package Overview
Dependencies
Maintainers
5
Versions
239
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

rc-calendar - npm Package Compare versions

Comparing version 9.9.2 to 9.10.0

409

es/Calendar.js
import _extends from 'babel-runtime/helpers/extends';
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 ReactDOM from 'react-dom';
import createReactClass from 'create-react-class';
import PropTypes from 'prop-types';

@@ -10,185 +12,55 @@ import KeyCode from 'rc-util/es/KeyCode';

import CalendarFooter from './calendar/CalendarFooter';
import CalendarMixin from './mixin/CalendarMixin';
import CommonMixin from './mixin/CommonMixin';
import { calendarMixinWrapper, calendarMixinPropTypes, calendarMixinDefaultProps, getNowByCurrentStateValue } from './mixin/CalendarMixin';
import { commonMixinWrapper, propType, defaultProp } from './mixin/CommonMixin';
import DateInput from './date/DateInput';
import { getTimeConfig, getTodayTime, syncTime } from './util';
import { goStartMonth, goEndMonth, goTime as _goTime } from './util/toTime';
import { goStartMonth, goEndMonth, goTime } from './util/toTime';
import moment from 'moment';
function noop() {}
var Calendar = createReactClass({
displayName: 'Calendar',
var Calendar = function (_React$Component) {
_inherits(Calendar, _React$Component);
propTypes: {
prefixCls: PropTypes.string,
className: PropTypes.string,
style: PropTypes.object,
defaultValue: PropTypes.object,
value: PropTypes.object,
selectedValue: PropTypes.object,
mode: PropTypes.oneOf(['time', 'date', 'month', 'year', 'decade']),
locale: PropTypes.object,
showDateInput: PropTypes.bool,
showWeekNumber: PropTypes.bool,
showToday: PropTypes.bool,
showOk: PropTypes.bool,
onSelect: PropTypes.func,
onOk: PropTypes.func,
onKeyDown: PropTypes.func,
timePicker: PropTypes.element,
dateInputPlaceholder: PropTypes.any,
onClear: PropTypes.func,
onChange: PropTypes.func,
onPanelChange: PropTypes.func,
disabledDate: PropTypes.func,
disabledTime: PropTypes.any,
dateRender: PropTypes.func,
renderFooter: PropTypes.func,
renderSidebar: PropTypes.func,
clearIcon: PropTypes.node
},
function Calendar(props) {
_classCallCheck(this, Calendar);
mixins: [CommonMixin, CalendarMixin],
var _this = _possibleConstructorReturn(this, _React$Component.call(this, props));
getDefaultProps: function getDefaultProps() {
return {
showToday: true,
showDateInput: true,
timePicker: null,
onOk: noop,
onPanelChange: noop
_initialiseProps.call(_this);
_this.state = {
mode: _this.props.mode || 'date',
value: props.value || props.defaultValue || moment(),
selectedValue: props.selectedValue || props.defaultSelectedValue
};
},
getInitialState: function getInitialState() {
return {
mode: this.props.mode || 'date'
};
},
componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
if ('mode' in nextProps && this.state.mode !== nextProps.mode) {
this.setState({ mode: nextProps.mode });
}
},
onKeyDown: function onKeyDown(event) {
if (event.target.nodeName.toLowerCase() === 'input') {
return undefined;
}
var keyCode = event.keyCode;
// mac
var ctrlKey = event.ctrlKey || event.metaKey;
var disabledDate = this.props.disabledDate;
var value = this.state.value;
return _this;
}
switch (keyCode) {
case KeyCode.DOWN:
this.goTime(1, 'weeks');
event.preventDefault();
return 1;
case KeyCode.UP:
this.goTime(-1, 'weeks');
event.preventDefault();
return 1;
case KeyCode.LEFT:
if (ctrlKey) {
this.goTime(-1, 'years');
} else {
this.goTime(-1, 'days');
}
event.preventDefault();
return 1;
case KeyCode.RIGHT:
if (ctrlKey) {
this.goTime(1, 'years');
} else {
this.goTime(1, 'days');
}
event.preventDefault();
return 1;
case KeyCode.HOME:
this.setValue(goStartMonth(this.state.value));
event.preventDefault();
return 1;
case KeyCode.END:
this.setValue(goEndMonth(this.state.value));
event.preventDefault();
return 1;
case KeyCode.PAGE_DOWN:
this.goTime(1, 'month');
event.preventDefault();
return 1;
case KeyCode.PAGE_UP:
this.goTime(-1, 'month');
event.preventDefault();
return 1;
case KeyCode.ENTER:
if (!disabledDate || !disabledDate(value)) {
this.onSelect(value, {
source: 'keyboard'
});
}
event.preventDefault();
return 1;
default:
this.props.onKeyDown(event);
return 1;
Calendar.prototype.componentDidMount = function componentDidMount() {
if (this.props.showDateInput) {
this.saveFocusElement(DateInput.getInstance());
}
},
onClear: function onClear() {
this.onSelect(null);
this.props.onClear();
},
onOk: function onOk() {
var selectedValue = this.state.selectedValue;
};
if (this.isAllowedDate(selectedValue)) {
this.props.onOk(selectedValue);
}
},
onDateInputChange: function onDateInputChange(value) {
this.onSelect(value, {
source: 'dateInput'
});
},
onDateTableSelect: function onDateTableSelect(value) {
var timePicker = this.props.timePicker;
var selectedValue = this.state.selectedValue;
Calendar.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, state) {
var value = nextProps.value,
selectedValue = nextProps.selectedValue;
if (!selectedValue && timePicker) {
var timePickerDefaultValue = timePicker.props.defaultValue;
if (timePickerDefaultValue) {
syncTime(timePickerDefaultValue, value);
}
var newState = {};
if ('mode' in nextProps && state.mode !== nextProps.mode) {
newState = { mode: nextProps.mode };
}
this.onSelect(value);
},
onToday: function onToday() {
var value = this.state.value;
if ('value' in nextProps) {
newState.value = value || nextProps.defaultValue || getNowByCurrentStateValue(state.value);
}
if ('selectedValue' in nextProps) {
newState.selectedValue = selectedValue;
}
var now = getTodayTime(value);
this.onSelect(now, {
source: 'todayButton'
});
},
onPanelChange: function onPanelChange(value, mode) {
var props = this.props,
state = this.state;
return newState;
};
if (!('mode' in props)) {
this.setState({ mode: mode });
}
props.onPanelChange(value || state.value, mode);
},
getRootDOMNode: function getRootDOMNode() {
return ReactDOM.findDOMNode(this);
},
openTimePicker: function openTimePicker() {
this.onPanelChange(null, 'time');
},
closeTimePicker: function closeTimePicker() {
this.onPanelChange(null, 'date');
},
goTime: function goTime(direction, unit) {
this.setValue(_goTime(this.state.value, direction, unit));
},
render: function render() {
Calendar.prototype.render = function render() {
var props = this.props,

@@ -246,3 +118,8 @@ state = this.state;

}) : null;
var children = [props.renderSidebar(), React.createElement(
var children = [];
if (props.renderSidebar) {
children.push(props.renderSidebar());
}
children.push(React.createElement(
'div',

@@ -253,3 +130,6 @@ { className: prefixCls + '-panel', key: 'panel' },

'div',
{ className: prefixCls + '-date-panel' },
{
tabIndex: this.props.focusablePanel ? 0 : undefined,
className: prefixCls + '-date-panel'
},
React.createElement(CalendarHeader, {

@@ -310,3 +190,3 @@ locale: locale,

)
)];
));

@@ -317,5 +197,188 @@ return this.renderRoot({

});
}
};
return Calendar;
}(React.Component);
Calendar.propTypes = _extends({}, calendarMixinPropTypes, propType, {
prefixCls: PropTypes.string,
className: PropTypes.string,
style: PropTypes.object,
defaultValue: PropTypes.object,
value: PropTypes.object,
selectedValue: PropTypes.object,
defaultSelectedValue: PropTypes.object,
mode: PropTypes.oneOf(['time', 'date', 'month', 'year', 'decade']),
locale: PropTypes.object,
showDateInput: PropTypes.bool,
showWeekNumber: PropTypes.bool,
showToday: PropTypes.bool,
showOk: PropTypes.bool,
onSelect: PropTypes.func,
onOk: PropTypes.func,
onKeyDown: PropTypes.func,
timePicker: PropTypes.element,
dateInputPlaceholder: PropTypes.any,
onClear: PropTypes.func,
onChange: PropTypes.func,
onPanelChange: PropTypes.func,
disabledDate: PropTypes.func,
disabledTime: PropTypes.any,
dateRender: PropTypes.func,
renderFooter: PropTypes.func,
renderSidebar: PropTypes.func,
clearIcon: PropTypes.node,
focusablePanel: PropTypes.bool
});
Calendar.defaultProps = _extends({}, calendarMixinDefaultProps, defaultProp, {
showToday: true,
showDateInput: true,
timePicker: null,
onOk: noop,
onPanelChange: noop,
focusablePanel: true
});
export default Calendar;
var _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.onPanelChange = function (value, mode) {
var props = _this2.props,
state = _this2.state;
if (!('mode' in props)) {
_this2.setState({ mode: mode });
}
props.onPanelChange(value || state.value, mode);
};
this.onKeyDown = function (event) {
if (event.target.nodeName.toLowerCase() === 'input') {
return undefined;
}
var keyCode = event.keyCode;
// mac
var ctrlKey = event.ctrlKey || event.metaKey;
var disabledDate = _this2.props.disabledDate;
var value = _this2.state.value;
switch (keyCode) {
case KeyCode.DOWN:
_this2.goTime(1, 'weeks');
event.preventDefault();
return 1;
case KeyCode.UP:
_this2.goTime(-1, 'weeks');
event.preventDefault();
return 1;
case KeyCode.LEFT:
if (ctrlKey) {
_this2.goTime(-1, 'years');
} else {
_this2.goTime(-1, 'days');
}
event.preventDefault();
return 1;
case KeyCode.RIGHT:
if (ctrlKey) {
_this2.goTime(1, 'years');
} else {
_this2.goTime(1, 'days');
}
event.preventDefault();
return 1;
case KeyCode.HOME:
_this2.setValue(goStartMonth(_this2.state.value));
event.preventDefault();
return 1;
case KeyCode.END:
_this2.setValue(goEndMonth(_this2.state.value));
event.preventDefault();
return 1;
case KeyCode.PAGE_DOWN:
_this2.goTime(1, 'month');
event.preventDefault();
return 1;
case KeyCode.PAGE_UP:
_this2.goTime(-1, 'month');
event.preventDefault();
return 1;
case KeyCode.ENTER:
if (!disabledDate || !disabledDate(value)) {
_this2.onSelect(value, {
source: 'keyboard'
});
}
event.preventDefault();
return 1;
default:
_this2.props.onKeyDown(event);
return 1;
}
};
this.onClear = function () {
_this2.onSelect(null);
_this2.props.onClear();
};
this.onOk = function () {
var selectedValue = _this2.state.selectedValue;
if (_this2.isAllowedDate(selectedValue)) {
_this2.props.onOk(selectedValue);
}
};
this.onDateInputChange = function (value) {
_this2.onSelect(value, {
source: 'dateInput'
});
};
this.onDateInputChange = function (value) {
_this2.onSelect(value, {
source: 'dateInput'
});
};
this.onDateTableSelect = function (value) {
var timePicker = _this2.props.timePicker;
var selectedValue = _this2.state.selectedValue;
if (!selectedValue && timePicker) {
var timePickerDefaultValue = timePicker.props.defaultValue;
if (timePickerDefaultValue) {
syncTime(timePickerDefaultValue, value);
}
}
_this2.onSelect(value);
};
this.onToday = function () {
var value = _this2.state.value;
var now = getTodayTime(value);
_this2.onSelect(now, {
source: 'todayButton'
});
};
this.getRootDOMNode = function () {
return ReactDOM.findDOMNode(_this2);
};
this.openTimePicker = function () {
_this2.onPanelChange(null, 'time');
};
this.closeTimePicker = function () {
_this2.onPanelChange(null, 'date');
};
this.goTime = function (direction, unit) {
_this2.setValue(goTime(_this2.state.value, direction, unit));
};
};
export default calendarMixinWrapper(commonMixinWrapper(Calendar));

59

es/calendar/CalendarFooter.js
import _extends from 'babel-runtime/helpers/extends';
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 ReactDOM from 'react-dom';
import createReactClass from 'create-react-class';
import PropTypes from 'prop-types';

@@ -12,26 +14,20 @@ import toFragment from 'rc-util/es/Children/mapSelf';

var CalendarFooter = createReactClass({
displayName: 'CalendarFooter',
var CalendarFooter = function (_React$Component) {
_inherits(CalendarFooter, _React$Component);
propTypes: {
prefixCls: PropTypes.string,
showDateInput: PropTypes.bool,
disabledTime: PropTypes.any,
timePicker: PropTypes.element,
selectedValue: PropTypes.any,
showOk: PropTypes.bool,
onSelect: PropTypes.func,
value: PropTypes.object,
renderFooter: PropTypes.func,
defaultValue: PropTypes.object,
mode: PropTypes.string
},
function CalendarFooter() {
_classCallCheck(this, CalendarFooter);
onSelect: function onSelect(value) {
return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));
}
CalendarFooter.prototype.onSelect = function onSelect(value) {
this.props.onSelect(value);
},
getRootDOMNode: function getRootDOMNode() {
};
CalendarFooter.prototype.getRootDOMNode = function getRootDOMNode() {
return ReactDOM.findDOMNode(this);
},
render: function render() {
};
CalendarFooter.prototype.render = function render() {
var props = this.props;

@@ -46,3 +42,3 @@ var value = props.value,

var footerEl = null;
var extraFooter = renderFooter(mode);
var extraFooter = renderFooter && renderFooter(mode);
if (props.showToday || timePicker || extraFooter) {

@@ -81,5 +77,20 @@ var _cx;

return footerEl;
}
});
};
return CalendarFooter;
}(React.Component);
CalendarFooter.propTypes = {
prefixCls: PropTypes.string,
showDateInput: PropTypes.bool,
disabledTime: PropTypes.any,
timePicker: PropTypes.element,
selectedValue: PropTypes.any,
showOk: PropTypes.bool,
onSelect: PropTypes.func,
value: PropTypes.object,
renderFooter: PropTypes.func,
defaultValue: PropTypes.object,
mode: PropTypes.string
};
export default CalendarFooter;

255

es/calendar/CalendarHeader.js

@@ -0,3 +1,5 @@

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 createReactClass from 'create-react-class';
import PropTypes from 'prop-types';

@@ -25,119 +27,22 @@ import toFragment from 'rc-util/es/Children/mapSelf';

var CalendarHeader = createReactClass({
displayName: 'CalendarHeader',
var CalendarHeader = function (_React$Component) {
_inherits(CalendarHeader, _React$Component);
propTypes: {
prefixCls: PropTypes.string,
value: PropTypes.object,
onValueChange: PropTypes.func,
showTimePicker: PropTypes.bool,
onPanelChange: PropTypes.func,
locale: PropTypes.object,
enablePrev: PropTypes.any,
enableNext: PropTypes.any,
disabledMonth: PropTypes.func,
renderFooter: PropTypes.func
},
function CalendarHeader(props) {
_classCallCheck(this, CalendarHeader);
getDefaultProps: function getDefaultProps() {
return {
enableNext: 1,
enablePrev: 1,
onPanelChange: function onPanelChange() {},
onValueChange: function onValueChange() {}
};
},
getInitialState: function getInitialState() {
this.nextMonth = goMonth.bind(this, 1);
this.previousMonth = goMonth.bind(this, -1);
this.nextYear = goYear.bind(this, 1);
this.previousYear = goYear.bind(this, -1);
return { yearPanelReferer: null };
},
onMonthSelect: function onMonthSelect(value) {
this.props.onPanelChange(value, 'date');
if (this.props.onMonthSelect) {
this.props.onMonthSelect(value);
} else {
this.props.onValueChange(value);
}
},
onYearSelect: function onYearSelect(value) {
var referer = this.state.yearPanelReferer;
this.setState({ yearPanelReferer: null });
this.props.onPanelChange(value, referer);
this.props.onValueChange(value);
},
onDecadeSelect: function onDecadeSelect(value) {
this.props.onPanelChange(value, 'year');
this.props.onValueChange(value);
},
monthYearElement: function monthYearElement(showTimePicker) {
var _this = this;
var _this = _possibleConstructorReturn(this, _React$Component.call(this, props));
var props = this.props;
var prefixCls = props.prefixCls;
var locale = props.locale;
var value = props.value;
var localeData = value.localeData();
var monthBeforeYear = locale.monthBeforeYear;
var selectClassName = prefixCls + '-' + (monthBeforeYear ? 'my-select' : 'ym-select');
var timeClassName = showTimePicker ? ' ' + prefixCls + '-time-status' : '';
var year = React.createElement(
'a',
{
className: prefixCls + '-year-select' + timeClassName,
role: 'button',
onClick: showTimePicker ? null : function () {
return _this.showYearPanel('date');
},
title: showTimePicker ? null : locale.yearSelect
},
value.format(locale.yearFormat)
);
var month = React.createElement(
'a',
{
className: prefixCls + '-month-select' + timeClassName,
role: 'button',
onClick: showTimePicker ? null : this.showMonthPanel,
title: showTimePicker ? null : locale.monthSelect
},
locale.monthFormat ? value.format(locale.monthFormat) : localeData.monthsShort(value)
);
var day = void 0;
if (showTimePicker) {
day = React.createElement(
'a',
{
className: prefixCls + '-day-select' + timeClassName,
role: 'button'
},
value.format(locale.dayFormat)
);
}
var my = [];
if (monthBeforeYear) {
my = [month, day, year];
} else {
my = [year, month, day];
}
return React.createElement(
'span',
{ className: selectClassName },
toFragment(my)
);
},
showMonthPanel: function showMonthPanel() {
// null means that users' interaction doesn't change value
this.props.onPanelChange(null, 'month');
},
showYearPanel: function showYearPanel(referer) {
this.setState({ yearPanelReferer: referer });
this.props.onPanelChange(null, 'year');
},
showDecadePanel: function showDecadePanel() {
this.props.onPanelChange(null, 'decade');
},
render: function render() {
_initialiseProps.call(_this);
_this.nextMonth = goMonth.bind(_this, 1);
_this.previousMonth = goMonth.bind(_this, -1);
_this.nextYear = goYear.bind(_this, 1);
_this.previousYear = goYear.bind(_this, -1);
_this.state = { yearPanelReferer: null };
return _this;
}
CalendarHeader.prototype.render = function render() {
var _this2 = this;

@@ -225,5 +130,121 @@

);
}
});
};
return CalendarHeader;
}(React.Component);
CalendarHeader.propTypes = {
prefixCls: PropTypes.string,
value: PropTypes.object,
onValueChange: PropTypes.func,
showTimePicker: PropTypes.bool,
onPanelChange: PropTypes.func,
locale: PropTypes.object,
enablePrev: PropTypes.any,
enableNext: PropTypes.any,
disabledMonth: PropTypes.func,
renderFooter: PropTypes.func,
onMonthSelect: PropTypes.func
};
CalendarHeader.defaultProps = {
enableNext: 1,
enablePrev: 1,
onPanelChange: function onPanelChange() {},
onValueChange: function onValueChange() {}
};
var _initialiseProps = function _initialiseProps() {
var _this3 = this;
this.onMonthSelect = function (value) {
_this3.props.onPanelChange(value, 'date');
if (_this3.props.onMonthSelect) {
_this3.props.onMonthSelect(value);
} else {
_this3.props.onValueChange(value);
}
};
this.onYearSelect = function (value) {
var referer = _this3.state.yearPanelReferer;
_this3.setState({ yearPanelReferer: null });
_this3.props.onPanelChange(value, referer);
_this3.props.onValueChange(value);
};
this.onDecadeSelect = function (value) {
_this3.props.onPanelChange(value, 'year');
_this3.props.onValueChange(value);
};
this.monthYearElement = function (showTimePicker) {
var props = _this3.props;
var prefixCls = props.prefixCls;
var locale = props.locale;
var value = props.value;
var localeData = value.localeData();
var monthBeforeYear = locale.monthBeforeYear;
var selectClassName = prefixCls + '-' + (monthBeforeYear ? 'my-select' : 'ym-select');
var timeClassName = showTimePicker ? ' ' + prefixCls + '-time-status' : '';
var year = React.createElement(
'a',
{
className: prefixCls + '-year-select' + timeClassName,
role: 'button',
onClick: showTimePicker ? null : function () {
return _this3.showYearPanel('date');
},
title: showTimePicker ? null : locale.yearSelect
},
value.format(locale.yearFormat)
);
var month = React.createElement(
'a',
{
className: prefixCls + '-month-select' + timeClassName,
role: 'button',
onClick: showTimePicker ? null : _this3.showMonthPanel,
title: showTimePicker ? null : locale.monthSelect
},
locale.monthFormat ? value.format(locale.monthFormat) : localeData.monthsShort(value)
);
var day = void 0;
if (showTimePicker) {
day = React.createElement(
'a',
{
className: prefixCls + '-day-select' + timeClassName,
role: 'button'
},
value.format(locale.dayFormat)
);
}
var my = [];
if (monthBeforeYear) {
my = [month, day, year];
} else {
my = [year, month, day];
}
return React.createElement(
'span',
{ className: selectClassName },
toFragment(my)
);
};
this.showMonthPanel = function () {
// null means that users' interaction doesn't change value
_this3.props.onPanelChange(null, 'month');
};
this.showYearPanel = function (referer) {
_this3.setState({ yearPanelReferer: referer });
_this3.props.onPanelChange(null, 'year');
};
this.showDecadePanel = function () {
_this3.props.onPanelChange(null, 'decade');
};
};
export default CalendarHeader;

250

es/date/DateInput.js

@@ -0,4 +1,6 @@

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 ReactDOM from 'react-dom';
import createReactClass from 'create-react-class';
import PropTypes from 'prop-types';

@@ -8,49 +10,127 @@ import moment from 'moment';

var DateInput = createReactClass({
displayName: 'DateInput',
var cachedSelectionStart = void 0;
var cachedSelectionEnd = void 0;
var dateInputInstance = void 0;
propTypes: {
prefixCls: PropTypes.string,
timePicker: PropTypes.object,
value: PropTypes.object,
disabledTime: PropTypes.any,
format: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]),
locale: PropTypes.object,
disabledDate: PropTypes.func,
onChange: PropTypes.func,
onClear: PropTypes.func,
placeholder: PropTypes.string,
onSelect: PropTypes.func,
selectedValue: PropTypes.object,
clearIcon: PropTypes.node
},
var DateInput = function (_React$Component) {
_inherits(DateInput, _React$Component);
getInitialState: function getInitialState() {
var selectedValue = this.props.selectedValue;
return {
str: formatDate(selectedValue, this.props.format),
function DateInput(props) {
_classCallCheck(this, DateInput);
var _this = _possibleConstructorReturn(this, _React$Component.call(this, props));
_initialiseProps.call(_this);
var selectedValue = props.selectedValue;
_this.state = {
str: formatDate(selectedValue, _this.props.format),
invalid: false,
hasFocus: false
};
},
componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
this.cachedSelectionStart = this.dateInputInstance.selectionStart;
this.cachedSelectionEnd = this.dateInputInstance.selectionEnd;
return _this;
}
DateInput.prototype.componentDidUpdate = function componentDidUpdate() {
if (this.state.hasFocus && !this.state.invalid && !(cachedSelectionStart === 0 && cachedSelectionEnd === 0)) {
dateInputInstance.setSelectionRange(cachedSelectionStart, cachedSelectionEnd);
}
};
DateInput.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, state) {
var newState = {};
if (dateInputInstance) {
cachedSelectionStart = dateInputInstance.selectionStart;
cachedSelectionEnd = dateInputInstance.selectionEnd;
}
// when popup show, click body will call this, bug!
var selectedValue = nextProps.selectedValue;
if (!this.state.hasFocus) {
this.setState({
if (!state.hasFocus) {
newState = {
str: formatDate(selectedValue, nextProps.format),
invalid: false
});
};
}
},
componentDidUpdate: function componentDidUpdate() {
if (this.state.hasFocus && !this.state.invalid && !(this.cachedSelectionStart === 0 && this.cachedSelectionEnd === 0)) {
this.dateInputInstance.setSelectionRange(this.cachedSelectionStart, this.cachedSelectionEnd);
}
},
onInputChange: function onInputChange(event) {
return newState;
};
DateInput.getInstance = function getInstance() {
return dateInputInstance;
};
DateInput.prototype.render = function render() {
var props = this.props;
var _state = this.state,
invalid = _state.invalid,
str = _state.str;
var locale = props.locale,
prefixCls = props.prefixCls,
placeholder = props.placeholder,
clearIcon = props.clearIcon;
var invalidClass = invalid ? prefixCls + '-input-invalid' : '';
return React.createElement(
'div',
{ className: prefixCls + '-input-wrap' },
React.createElement(
'div',
{ className: prefixCls + '-date-input-wrap' },
React.createElement('input', {
ref: this.saveDateInput,
className: prefixCls + '-input ' + invalidClass,
value: str,
disabled: props.disabled,
placeholder: placeholder,
onChange: this.onInputChange,
onFocus: this.onFocus,
onBlur: this.onBlur
})
),
props.showClear ? React.createElement(
'a',
{
role: 'button',
title: locale.clear,
onClick: this.onClear
},
clearIcon || React.createElement('span', { className: prefixCls + '-clear-btn' })
) : null
);
};
return DateInput;
}(React.Component);
DateInput.propTypes = {
prefixCls: PropTypes.string,
timePicker: PropTypes.object,
value: PropTypes.object,
disabledTime: PropTypes.any,
format: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]),
locale: PropTypes.object,
disabledDate: PropTypes.func,
onChange: PropTypes.func,
onClear: PropTypes.func,
placeholder: PropTypes.string,
onSelect: PropTypes.func,
selectedValue: PropTypes.object,
clearIcon: PropTypes.node
};
var _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.onClear = function () {
_this2.setState({
str: ''
});
_this2.props.onClear(null);
};
this.onInputChange = function (event) {
var str = event.target.value;
var _props = this.props,
var _props = _this2.props,
disabledDate = _props.disabledDate,

@@ -65,3 +145,3 @@ format = _props.format,

onChange(null);
this.setState({
_this2.setState({
invalid: false,

@@ -76,3 +156,3 @@ str: str

if (!parsed.isValid()) {
this.setState({
_this2.setState({
invalid: true,

@@ -84,7 +164,7 @@ str: str

var value = this.props.value.clone();
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());
if (!value || disabledDate && disabledDate(value)) {
this.setState({
_this2.setState({
invalid: true,

@@ -97,3 +177,3 @@ str: str

if (selectedValue !== value || selectedValue && value && !selectedValue.isSame(value)) {
this.setState({
_this2.setState({
str: str

@@ -103,25 +183,10 @@ });

}
},
onClear: function onClear() {
this.setState({
str: ''
});
this.props.onClear(null);
},
getRootDOMNode: function getRootDOMNode() {
return ReactDOM.findDOMNode(this);
},
focus: function focus() {
if (this.dateInputInstance) {
this.dateInputInstance.focus();
}
},
saveDateInput: function saveDateInput(dateInput) {
this.dateInputInstance = dateInput;
},
onFocus: function onFocus() {
this.setState({ hasFocus: true });
},
onBlur: function onBlur() {
this.setState(function (prevState, prevProps) {
};
this.onFocus = function () {
_this2.setState({ hasFocus: true });
};
this.onBlur = function () {
_this2.setState(function (prevState, prevProps) {
return {

@@ -132,44 +197,19 @@ hasFocus: false,

});
},
render: function render() {
var props = this.props;
var _state = this.state,
invalid = _state.invalid,
str = _state.str;
var locale = props.locale,
prefixCls = props.prefixCls,
placeholder = props.placeholder,
clearIcon = props.clearIcon;
};
var invalidClass = invalid ? prefixCls + '-input-invalid' : '';
return React.createElement(
'div',
{ className: prefixCls + '-input-wrap' },
React.createElement(
'div',
{ className: prefixCls + '-date-input-wrap' },
React.createElement('input', {
ref: this.saveDateInput,
className: prefixCls + '-input ' + invalidClass,
value: str,
disabled: props.disabled,
placeholder: placeholder,
onChange: this.onInputChange,
onFocus: this.onFocus,
onBlur: this.onBlur
})
),
props.showClear ? React.createElement(
'a',
{
role: 'button',
title: locale.clear,
onClick: this.onClear
},
clearIcon || React.createElement('span', { className: prefixCls + '-clear-btn' })
) : null
);
}
});
this.getRootDOMNode = function () {
return ReactDOM.findDOMNode(_this2);
};
this.focus = function () {
if (dateInputInstance) {
dateInputInstance.focus();
}
};
this.saveDateInput = function (dateInput) {
dateInputInstance = dateInput;
};
};
export default DateInput;

49

es/date/DateTBody.js

@@ -0,3 +1,5 @@

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 createReactClass from 'create-react-class';
import PropTypes from 'prop-types';

@@ -30,22 +32,12 @@ import cx from 'classnames';

var DateTBody = createReactClass({
displayName: 'DateTBody',
var DateTBody = function (_React$Component) {
_inherits(DateTBody, _React$Component);
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
},
function DateTBody() {
_classCallCheck(this, DateTBody);
getDefaultProps: function getDefaultProps() {
return {
hoverValue: []
};
},
render: function render() {
return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));
}
DateTBody.prototype.render = function render() {
var props = this.props;

@@ -259,5 +251,20 @@ var contentRender = props.contentRender,

);
}
});
};
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
};
DateTBody.defaultProps = {
hoverValue: []
};
export default DateTBody;

154

es/FullCalendar.js
import _extends from 'babel-runtime/helpers/extends';
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 createReactClass from 'create-react-class';
import PropTypes from 'prop-types';
import DateTable from './date/DateTable';
import MonthTable from './month/MonthTable';
import CalendarMixin from './mixin/CalendarMixin';
import CommonMixin from './mixin/CommonMixin';
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';
var FullCalendar = createReactClass({
displayName: 'FullCalendar',
var FullCalendar = function (_React$Component) {
_inherits(FullCalendar, _React$Component);
propTypes: {
defaultType: PropTypes.string,
type: PropTypes.string,
prefixCls: PropTypes.string,
locale: PropTypes.object,
onTypeChange: PropTypes.func,
fullscreen: PropTypes.bool,
monthCellRender: PropTypes.func,
dateCellRender: PropTypes.func,
showTypeSwitch: PropTypes.bool,
Select: PropTypes.func.isRequired,
headerComponents: PropTypes.array,
headerComponent: PropTypes.object, // The whole header component
headerRender: PropTypes.func,
showHeader: PropTypes.bool,
disabledDate: PropTypes.func
},
mixins: [CommonMixin, CalendarMixin],
getDefaultProps: function getDefaultProps() {
return {
defaultType: 'date',
fullscreen: false,
showTypeSwitch: true,
showHeader: true,
onTypeChange: function onTypeChange() {}
};
},
getInitialState: function getInitialState() {
function FullCalendar(props) {
_classCallCheck(this, FullCalendar);
var _this = _possibleConstructorReturn(this, _React$Component.call(this, props));
_initialiseProps.call(_this);
var type = void 0;
if ('type' in this.props) {
type = this.props.type;
if ('type' in props) {
type = props.type;
} else {
type = this.props.defaultType;
type = props.defaultType;
}
return {
type: type
_this.state = {
type: type,
value: props.value || props.defaultValue || moment(),
selectedValue: props.selectedValue || props.defaultSelectedValue
};
},
componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
return _this;
}
FullCalendar.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, state) {
var newState = {};
var value = nextProps.value,
selectedValue = nextProps.selectedValue;
if ('type' in nextProps) {
this.setState({
newState = {
type: nextProps.type
});
};
}
},
onMonthSelect: function onMonthSelect(value) {
this.onSelect(value, {
target: 'month'
});
},
setType: function setType(type) {
if (!('type' in this.props)) {
this.setState({
type: type
});
if ('value' in nextProps) {
newState.value = value || nextProps.defaultValue || getNowByCurrentStateValue(state.value);
}
this.props.onTypeChange(type);
},
render: function render() {
if ('selectedValue' in nextProps) {
newState.selectedValue = selectedValue;
}
return newState;
};
FullCalendar.prototype.render = function render() {
var props = this.props;

@@ -138,5 +126,55 @@ var locale = props.locale,

});
}
};
return FullCalendar;
}(React.Component);
FullCalendar.propTypes = _extends({}, calendarMixinPropTypes, propType, {
defaultType: PropTypes.string,
type: PropTypes.string,
prefixCls: PropTypes.string,
locale: PropTypes.object,
onTypeChange: PropTypes.func,
fullscreen: PropTypes.bool,
monthCellRender: PropTypes.func,
dateCellRender: PropTypes.func,
showTypeSwitch: PropTypes.bool,
Select: PropTypes.func.isRequired,
headerComponents: PropTypes.array,
headerComponent: PropTypes.object, // The whole header component
headerRender: PropTypes.func,
showHeader: PropTypes.bool,
disabledDate: PropTypes.func,
value: PropTypes.object,
defaultValue: PropTypes.object,
selectedValue: PropTypes.object,
defaultSelectedValue: PropTypes.object
});
FullCalendar.defaultProps = _extends({}, calendarMixinDefaultProps, defaultProp, {
defaultType: 'date',
fullscreen: false,
showTypeSwitch: true,
showHeader: true,
onTypeChange: function onTypeChange() {}
});
export default FullCalendar;
var _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.onMonthSelect = function (value) {
_this2.onSelect(value, {
target: 'month'
});
};
this.setType = function (type) {
if (!('type' in _this2.props)) {
_this2.setState({
type: type
});
}
_this2.props.onTypeChange(type);
};
};
export default calendarMixinWrapper(commonMixinWrapper(FullCalendar));

3

es/index.js
import Calendar from './Calendar';
import { polyfill } from 'react-lifecycles-compat';
polyfill(Calendar);
export default Calendar;

170

es/mixin/CalendarMixin.js

@@ -0,1 +1,4 @@

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';

@@ -5,11 +8,7 @@ import PropTypes from 'prop-types';

import moment from 'moment';
import { isAllowedDate as _isAllowedDate, getTodayTime } from '../util/index';
import { isAllowedDate, getTodayTime } from '../util/index';
function noop() {}
function getNow() {
return moment();
}
function getNowByCurrentStateValue(value) {
export function getNowByCurrentStateValue(value) {
var ret = void 0;

@@ -19,3 +18,3 @@ if (value) {

} else {
ret = getNow();
ret = moment();
}

@@ -25,92 +24,81 @@ return ret;

var CalendarMixin = {
propTypes: {
value: PropTypes.object,
defaultValue: PropTypes.object,
onKeyDown: PropTypes.func
},
export var calendarMixinPropTypes = {
value: PropTypes.object,
defaultValue: PropTypes.object,
onKeyDown: PropTypes.func
};
getDefaultProps: function getDefaultProps() {
return {
onKeyDown: noop
};
},
getInitialState: function getInitialState() {
var props = this.props;
var value = props.value || props.defaultValue || getNow();
return {
value: value,
selectedValue: props.selectedValue || props.defaultSelectedValue
};
},
componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
var value = nextProps.value;
var selectedValue = nextProps.selectedValue;
export var calendarMixinDefaultProps = {
onKeyDown: noop
};
if ('value' in nextProps) {
value = value || nextProps.defaultValue || getNowByCurrentStateValue(this.state.value);
this.setState({
value: value
});
}
if ('selectedValue' in nextProps) {
this.setState({
selectedValue: selectedValue
});
}
},
onSelect: function onSelect(value, cause) {
if (value) {
this.setValue(value);
}
this.setSelectedValue(value, cause);
},
renderRoot: function renderRoot(newProps) {
var _className;
export var calendarMixinWrapper = function calendarMixinWrapper(ComposeComponent) {
var _class, _temp2;
var props = this.props;
var prefixCls = props.prefixCls;
return _temp2 = _class = function (_ComposeComponent) {
_inherits(_class, _ComposeComponent);
var className = (_className = {}, _className[prefixCls] = 1, _className[prefixCls + '-hidden'] = !props.visible, _className[props.className] = !!props.className, _className[newProps.className] = !!newProps.className, _className);
function _class() {
var _temp, _this, _ret;
return React.createElement(
'div',
{
ref: this.saveRoot,
className: '' + classnames(className),
style: this.props.style,
tabIndex: '0',
onKeyDown: this.onKeyDown
},
newProps.children
);
},
setSelectedValue: function setSelectedValue(selectedValue, cause) {
// if (this.isAllowedDate(selectedValue)) {
if (!('selectedValue' in this.props)) {
this.setState({
selectedValue: selectedValue
});
_classCallCheck(this, _class);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, _ComposeComponent.call.apply(_ComposeComponent, [this].concat(args))), _this), _this.onSelect = function (value, cause) {
if (value) {
_this.setValue(value);
}
_this.setSelectedValue(value, cause);
}, _this.renderRoot = function (newProps) {
var _className;
var props = _this.props;
var prefixCls = props.prefixCls;
var className = (_className = {}, _className[prefixCls] = 1, _className[prefixCls + '-hidden'] = !props.visible, _className[props.className] = !!props.className, _className[newProps.className] = !!newProps.className, _className);
return React.createElement(
'div',
{
ref: _this.saveRoot,
className: '' + classnames(className),
style: _this.props.style,
tabIndex: '0',
onKeyDown: _this.onKeyDown
},
newProps.children
);
}, _this.setSelectedValue = function (selectedValue, cause) {
// if (this.isAllowedDate(selectedValue)) {
if (!('selectedValue' in _this.props)) {
_this.setState({
selectedValue: selectedValue
});
}
if (_this.props.onSelect) {
_this.props.onSelect(selectedValue, cause);
}
// }
}, _this.setValue = function (value) {
var originalValue = _this.state.value;
if (!('value' in _this.props)) {
_this.setState({
value: value
});
}
if (originalValue && value && !originalValue.isSame(value) || !originalValue && value || originalValue && !value) {
_this.props.onChange(value);
}
}, _this.isAllowedDate = function (value) {
var disabledDate = _this.props.disabledDate;
var disabledTime = _this.props.disabledTime;
return isAllowedDate(value, disabledDate, disabledTime);
}, _temp), _possibleConstructorReturn(_this, _ret);
}
this.props.onSelect(selectedValue, cause);
// }
},
setValue: function setValue(value) {
var originalValue = this.state.value;
if (!('value' in this.props)) {
this.setState({
value: value
});
}
if (originalValue && value && !originalValue.isSame(value) || !originalValue && value || originalValue && !value) {
this.props.onChange(value);
}
},
isAllowedDate: function isAllowedDate(value) {
var disabledDate = this.props.disabledDate;
var disabledTime = this.props.disabledTime;
return _isAllowedDate(value, disabledDate, disabledTime);
}
};
export default CalendarMixin;
return _class;
}(ComposeComponent), _class.displayName = 'CalendarMixinWrapper', _temp2;
};

125

es/mixin/CommonMixin.js

@@ -0,1 +1,4 @@

import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
import PropTypes from 'prop-types';

@@ -6,58 +9,78 @@ import enUs from '../locale/en_US';

export default {
propTypes: {
className: PropTypes.string,
locale: PropTypes.object,
style: PropTypes.object,
visible: PropTypes.bool,
onSelect: PropTypes.func,
prefixCls: PropTypes.string,
onChange: PropTypes.func,
onOk: PropTypes.func
export var propType = {
className: PropTypes.string,
locale: PropTypes.object,
style: PropTypes.object,
visible: PropTypes.bool,
onSelect: PropTypes.func,
prefixCls: PropTypes.string,
onChange: PropTypes.func,
onOk: PropTypes.func
};
export var defaultProp = {
locale: enUs,
style: {},
visible: true,
prefixCls: 'rc-calendar',
className: '',
onSelect: noop,
onChange: noop,
onClear: noop,
renderFooter: function renderFooter() {
return null;
},
renderSidebar: function renderSidebar() {
return null;
}
};
getDefaultProps: function getDefaultProps() {
return {
locale: enUs,
style: {},
visible: true,
prefixCls: 'rc-calendar',
className: '',
onSelect: noop,
onChange: noop,
onClear: noop,
renderFooter: function renderFooter() {
return null;
},
renderSidebar: function renderSidebar() {
return null;
export var commonMixinWrapper = function commonMixinWrapper(ComposeComponent) {
var _class, _temp2;
return _temp2 = _class = function (_ComposeComponent) {
_inherits(_class, _ComposeComponent);
function _class() {
var _temp, _this, _ret;
_classCallCheck(this, _class);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, _ComposeComponent.call.apply(_ComposeComponent, [this].concat(args))), _this), _this.getFormat = function () {
var format = _this.props.format;
var _this$props = _this.props,
locale = _this$props.locale,
timePicker = _this$props.timePicker;
if (!format) {
if (timePicker) {
format = locale.dateTimeFormat;
} else {
format = locale.dateFormat;
}
}
return format;
}, _this.focus = function () {
if (_this.focusElement) {
_this.focusElement.focus();
} else if (_this.rootInstance) {
_this.rootInstance.focus();
}
}, _this.saveFocusElement = function (focusElement) {
_this.focusElement = focusElement;
}, _this.saveRoot = function (root) {
_this.rootInstance = root;
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_class.prototype.shouldComponentUpdate = function shouldComponentUpdate(nextProps) {
return this.props.visible || nextProps.visible;
};
},
shouldComponentUpdate: function shouldComponentUpdate(nextProps) {
return this.props.visible || nextProps.visible;
},
getFormat: function getFormat() {
var format = this.props.format;
var _props = this.props,
locale = _props.locale,
timePicker = _props.timePicker;
if (!format) {
if (timePicker) {
format = locale.dateTimeFormat;
} else {
format = locale.dateFormat;
}
}
return format;
},
focus: function focus() {
if (this.rootInstance) {
this.rootInstance.focus();
}
},
saveRoot: function saveRoot(root) {
this.rootInstance = root;
}
return _class;
}(ComposeComponent), _class.displayName = 'CommonMixinWrapper', _temp2;
};

105

es/month/MonthPanel.js

@@ -0,3 +1,5 @@

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 createReactClass from 'create-react-class';
import PropTypes from 'prop-types';

@@ -14,51 +16,51 @@ import MonthTable from './MonthTable';

var MonthPanel = createReactClass({
displayName: 'MonthPanel',
var MonthPanel = function (_React$Component) {
_inherits(MonthPanel, _React$Component);
propTypes: {
onChange: PropTypes.func,
disabledDate: PropTypes.func,
onSelect: PropTypes.func,
renderFooter: PropTypes.func
},
function MonthPanel(props) {
_classCallCheck(this, MonthPanel);
getDefaultProps: function getDefaultProps() {
return {
onChange: noop,
onSelect: noop
var _this = _possibleConstructorReturn(this, _React$Component.call(this, props));
_this.setAndChangeValue = function (value) {
_this.setValue(value);
_this.props.onChange(value);
};
},
getInitialState: function getInitialState() {
var props = this.props;
// bind methods
this.nextYear = goYear.bind(this, 1);
this.previousYear = goYear.bind(this, -1);
this.prefixCls = props.rootPrefixCls + '-month-panel';
return {
_this.setAndSelectValue = function (value) {
_this.setValue(value);
_this.props.onSelect(value);
};
_this.setValue = function (value) {
if (!('value' in _this.props)) {
_this.setState({
value: value
});
}
};
_this.nextYear = goYear.bind(_this, 1);
_this.previousYear = goYear.bind(_this, -1);
_this.prefixCls = props.rootPrefixCls + '-month-panel';
_this.state = {
value: props.value || props.defaultValue
};
},
componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
return _this;
}
MonthPanel.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps) {
var newState = {};
if ('value' in nextProps) {
this.setState({
newState = {
value: nextProps.value
});
};
}
},
setAndChangeValue: function setAndChangeValue(value) {
this.setValue(value);
this.props.onChange(value);
},
setAndSelectValue: function setAndSelectValue(value) {
this.setValue(value);
this.props.onSelect(value);
},
setValue: function setValue(value) {
if (!('value' in this.props)) {
this.setState({
value: value
});
}
},
render: function render() {
return newState;
};
MonthPanel.prototype.render = function render() {
var props = this.props;

@@ -137,5 +139,20 @@ var value = this.state.value;

);
}
});
};
return MonthPanel;
}(React.Component);
MonthPanel.propTypes = {
onChange: PropTypes.func,
disabledDate: PropTypes.func,
onSelect: PropTypes.func,
renderFooter: PropTypes.func,
rootPrefixCls: PropTypes.string,
value: PropTypes.object,
defaultValue: PropTypes.object
};
MonthPanel.defaultProps = {
onChange: noop,
onSelect: noop
};
export default MonthPanel;

154

es/MonthCalendar.js

@@ -0,3 +1,6 @@

import _extends from 'babel-runtime/helpers/extends';
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 createReactClass from 'create-react-class';
import PropTypes from 'prop-types';

@@ -7,70 +10,77 @@ import KeyCode from 'rc-util/es/KeyCode';

import CalendarFooter from './calendar/CalendarFooter';
import CalendarMixin from './mixin/CalendarMixin';
import CommonMixin from './mixin/CommonMixin';
import { calendarMixinWrapper, calendarMixinPropTypes, calendarMixinDefaultProps } from './mixin/CalendarMixin';
import { commonMixinWrapper, propType, defaultProp } from './mixin/CommonMixin';
import moment from 'moment';
var MonthCalendar = createReactClass({
displayName: 'MonthCalendar',
var MonthCalendar = function (_React$Component) {
_inherits(MonthCalendar, _React$Component);
propTypes: {
monthCellRender: PropTypes.func,
dateCellRender: PropTypes.func
},
mixins: [CommonMixin, CalendarMixin],
function MonthCalendar(props) {
_classCallCheck(this, MonthCalendar);
getInitialState: function getInitialState() {
return { mode: 'month' };
},
onKeyDown: function onKeyDown(event) {
var keyCode = event.keyCode;
var ctrlKey = event.ctrlKey || event.metaKey;
var stateValue = this.state.value;
var disabledDate = this.props.disabledDate;
var _this = _possibleConstructorReturn(this, _React$Component.call(this, props));
var value = stateValue;
switch (keyCode) {
case KeyCode.DOWN:
value = stateValue.clone();
value.add(3, 'months');
break;
case KeyCode.UP:
value = stateValue.clone();
value.add(-3, 'months');
break;
case KeyCode.LEFT:
value = stateValue.clone();
if (ctrlKey) {
value.add(-1, 'years');
} else {
value.add(-1, 'months');
}
break;
case KeyCode.RIGHT:
value = stateValue.clone();
if (ctrlKey) {
value.add(1, 'years');
} else {
value.add(1, 'months');
}
break;
case KeyCode.ENTER:
if (!disabledDate || !disabledDate(stateValue)) {
this.onSelect(stateValue);
}
_this.onKeyDown = function (event) {
var keyCode = event.keyCode;
var ctrlKey = event.ctrlKey || event.metaKey;
var stateValue = _this.state.value;
var disabledDate = _this.props.disabledDate;
var value = stateValue;
switch (keyCode) {
case KeyCode.DOWN:
value = stateValue.clone();
value.add(3, 'months');
break;
case KeyCode.UP:
value = stateValue.clone();
value.add(-3, 'months');
break;
case KeyCode.LEFT:
value = stateValue.clone();
if (ctrlKey) {
value.add(-1, 'years');
} else {
value.add(-1, 'months');
}
break;
case KeyCode.RIGHT:
value = stateValue.clone();
if (ctrlKey) {
value.add(1, 'years');
} else {
value.add(1, 'months');
}
break;
case KeyCode.ENTER:
if (!disabledDate || !disabledDate(stateValue)) {
_this.onSelect(stateValue);
}
event.preventDefault();
return 1;
default:
return undefined;
}
if (value !== stateValue) {
_this.setValue(value);
event.preventDefault();
return 1;
default:
return undefined;
}
if (value !== stateValue) {
this.setValue(value);
event.preventDefault();
return 1;
}
},
handlePanelChange: function handlePanelChange(_, mode) {
if (mode !== 'date') {
this.setState({ mode: mode });
}
},
render: function render() {
}
};
_this.handlePanelChange = function (_, mode) {
if (mode !== 'date') {
_this.setState({ mode: mode });
}
};
_this.state = {
mode: 'month',
value: props.value || props.defaultValue || moment(),
selectedValue: props.selectedValue || props.defaultSelectedValue
};
return _this;
}
MonthCalendar.prototype.render = function render() {
var props = this.props,

@@ -109,5 +119,19 @@ state = this.state;

});
}
};
return MonthCalendar;
}(React.Component);
MonthCalendar.propTypes = _extends({}, calendarMixinPropTypes, propType, {
monthCellRender: PropTypes.func,
dateCellRender: PropTypes.func,
value: PropTypes.object,
defaultValue: PropTypes.object,
selectedValue: PropTypes.object,
defaultSelectedValue: PropTypes.object,
disabledDate: PropTypes.object
});
MonthCalendar.defaultProps = _extends({}, defaultProp, calendarMixinDefaultProps);
export default MonthCalendar;
export default calendarMixinWrapper(commonMixinWrapper(MonthCalendar));

301

es/Picker.js

@@ -0,4 +1,6 @@

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 ReactDOM from 'react-dom';
import createReactClass from 'create-react-class';
import PropTypes from 'prop-types';

@@ -16,37 +18,12 @@ import createChainedFunction from 'rc-util/es/createChainedFunction';

var Picker = createReactClass({
displayName: 'Picker',
var Picker = function (_React$Component) {
_inherits(Picker, _React$Component);
propTypes: {
animation: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
disabled: PropTypes.bool,
transitionName: PropTypes.string,
onChange: PropTypes.func,
onOpenChange: PropTypes.func,
children: PropTypes.func,
getCalendarContainer: PropTypes.func,
calendar: PropTypes.element,
style: PropTypes.object,
open: PropTypes.bool,
defaultOpen: PropTypes.bool,
prefixCls: PropTypes.string,
placement: PropTypes.any,
value: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
defaultValue: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
align: PropTypes.object
},
function Picker(props) {
_classCallCheck(this, Picker);
getDefaultProps: function getDefaultProps() {
return {
prefixCls: 'rc-calendar-picker',
style: {},
align: {},
placement: 'bottomLeft',
defaultOpen: false,
onChange: noop,
onOpenChange: noop
};
},
getInitialState: function getInitialState() {
var props = this.props;
var _this = _possibleConstructorReturn(this, _React$Component.call(this, props));
_initialiseProps.call(_this);
var open = void 0;

@@ -59,24 +36,12 @@ if ('open' in props) {

var value = props.value || props.defaultValue;
this.saveCalendarRef = refFn.bind(this, 'calendarInstance');
return {
_this.saveCalendarRef = refFn.bind(_this, 'calendarInstance');
_this.state = {
open: open,
value: value
};
},
componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
var value = nextProps.value,
open = nextProps.open;
return _this;
}
if ('value' in nextProps) {
this.setState({
value: value
});
}
if (open !== undefined) {
this.setState({
open: open
});
}
},
componentDidUpdate: function componentDidUpdate(_, prevState) {
Picker.prototype.componentDidUpdate = function componentDidUpdate(_, prevState) {
if (!prevState.open && this.state.open) {

@@ -86,89 +51,27 @@ // setTimeout is for making sure saveCalendarRef happen before focusCalendar

}
},
componentWillUnmount: function componentWillUnmount() {
};
Picker.prototype.componentWillUnmount = function componentWillUnmount() {
clearTimeout(this.focusTimeout);
},
onCalendarKeyDown: function onCalendarKeyDown(event) {
if (event.keyCode === KeyCode.ESC) {
event.stopPropagation();
this.close(this.focus);
}
},
onCalendarSelect: function onCalendarSelect(value) {
var cause = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
};
var props = this.props;
if (!('value' in props)) {
this.setState({
Picker.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps) {
var newState = {};
var value = nextProps.value,
open = nextProps.open;
if ('value' in nextProps) {
newState = {
value: value
});
};
}
if (cause.source === 'keyboard' || !props.calendar.props.timePicker && cause.source !== 'dateInput' || cause.source === 'todayButton') {
this.close(this.focus);
if (open !== undefined) {
newState = {
open: open
};
}
props.onChange(value);
},
onKeyDown: function onKeyDown(event) {
if (event.keyCode === KeyCode.DOWN && !this.state.open) {
this.open();
event.preventDefault();
}
},
onCalendarOk: function onCalendarOk() {
this.close(this.focus);
},
onCalendarClear: function onCalendarClear() {
this.close(this.focus);
},
onVisibleChange: function onVisibleChange(open) {
this.setOpen(open);
},
getCalendarElement: function getCalendarElement() {
var props = this.props;
var state = this.state;
var calendarProps = props.calendar.props;
var value = state.value;
return newState;
};
var defaultValue = value;
var extraProps = {
ref: this.saveCalendarRef,
defaultValue: defaultValue || calendarProps.defaultValue,
selectedValue: value,
onKeyDown: this.onCalendarKeyDown,
onOk: createChainedFunction(calendarProps.onOk, this.onCalendarOk),
onSelect: createChainedFunction(calendarProps.onSelect, this.onCalendarSelect),
onClear: createChainedFunction(calendarProps.onClear, this.onCalendarClear)
};
return React.cloneElement(props.calendar, extraProps);
},
setOpen: function setOpen(open, callback) {
var onOpenChange = this.props.onOpenChange;
if (this.state.open !== open) {
if (!('open' in this.props)) {
this.setState({
open: open
}, callback);
}
onOpenChange(open);
}
},
open: function open(callback) {
this.setOpen(true, callback);
},
close: function close(callback) {
this.setOpen(false, callback);
},
focus: function focus() {
if (!this.state.open) {
ReactDOM.findDOMNode(this).focus();
}
},
focusCalendar: function focusCalendar() {
if (this.state.open && !!this.calendarInstance) {
this.calendarInstance.focus();
}
},
render: function render() {
Picker.prototype.render = function render() {
var props = this.props;

@@ -207,5 +110,133 @@ var prefixCls = props.prefixCls,

);
}
});
};
return Picker;
}(React.Component);
Picker.propTypes = {
animation: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
disabled: PropTypes.bool,
transitionName: PropTypes.string,
onChange: PropTypes.func,
onOpenChange: PropTypes.func,
children: PropTypes.func,
getCalendarContainer: PropTypes.func,
calendar: PropTypes.element,
style: PropTypes.object,
open: PropTypes.bool,
defaultOpen: PropTypes.bool,
prefixCls: PropTypes.string,
placement: PropTypes.any,
value: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
defaultValue: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
align: PropTypes.object
};
Picker.defaultProps = {
prefixCls: 'rc-calendar-picker',
style: {},
align: {},
placement: 'bottomLeft',
defaultOpen: false,
onChange: noop,
onOpenChange: noop
};
var _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.onCalendarKeyDown = function (event) {
if (event.keyCode === KeyCode.ESC) {
event.stopPropagation();
_this2.close(_this2.focus);
}
};
this.onCalendarSelect = function (value) {
var cause = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
var props = _this2.props;
if (!('value' in props)) {
_this2.setState({
value: value
});
}
if (cause.source === 'keyboard' || !props.calendar.props.timePicker && cause.source !== 'dateInput' || cause.source === 'todayButton') {
_this2.close(_this2.focus);
}
props.onChange(value);
};
this.onKeyDown = function (event) {
if (event.keyCode === KeyCode.DOWN && !_this2.state.open) {
_this2.open();
event.preventDefault();
}
};
this.onCalendarOk = function () {
_this2.close(_this2.focus);
};
this.onCalendarClear = function () {
_this2.close(_this2.focus);
};
this.onVisibleChange = function (open) {
_this2.setOpen(open);
};
this.getCalendarElement = function () {
var props = _this2.props;
var state = _this2.state;
var calendarProps = props.calendar.props;
var value = state.value;
var defaultValue = value;
var extraProps = {
ref: _this2.saveCalendarRef,
defaultValue: defaultValue || calendarProps.defaultValue,
selectedValue: value,
onKeyDown: _this2.onCalendarKeyDown,
onOk: createChainedFunction(calendarProps.onOk, _this2.onCalendarOk),
onSelect: createChainedFunction(calendarProps.onSelect, _this2.onCalendarSelect),
onClear: createChainedFunction(calendarProps.onClear, _this2.onCalendarClear)
};
return React.cloneElement(props.calendar, extraProps);
};
this.setOpen = function (open, callback) {
var onOpenChange = _this2.props.onOpenChange;
if (_this2.state.open !== open) {
if (!('open' in _this2.props)) {
_this2.setState({
open: open
}, callback);
}
onOpenChange(open);
}
};
this.open = function (callback) {
_this2.setOpen(true, callback);
};
this.close = function (callback) {
_this2.setOpen(false, callback);
};
this.focus = function () {
if (!_this2.state.open) {
ReactDOM.findDOMNode(_this2).focus();
}
};
this.focusCalendar = function () {
if (_this2.state.open && !!_this2.calendarInstance) {
_this2.calendarInstance.focus();
}
};
};
export default Picker;

62

es/range-calendar/CalendarPart.js
import _extends from 'babel-runtime/helpers/extends';
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 createReactClass from 'create-react-class';
import PropTypes from 'prop-types';

@@ -10,26 +12,12 @@ import CalendarHeader from '../calendar/CalendarHeader';

var CalendarPart = createReactClass({
displayName: 'CalendarPart',
var CalendarPart = function (_React$Component) {
_inherits(CalendarPart, _React$Component);
propTypes: {
prefixCls: PropTypes.string,
value: PropTypes.any,
hoverValue: PropTypes.any,
selectedValue: PropTypes.any,
direction: PropTypes.any,
locale: PropTypes.any,
showDateInput: PropTypes.bool,
showTimePicker: PropTypes.bool,
format: PropTypes.any,
placeholder: PropTypes.any,
disabledDate: PropTypes.any,
timePicker: PropTypes.any,
disabledTime: PropTypes.any,
onInputSelect: PropTypes.func,
timePickerDisabledTime: PropTypes.object,
enableNext: PropTypes.any,
enablePrev: PropTypes.any,
clearIcon: PropTypes.node
},
render: function render() {
function CalendarPart() {
_classCallCheck(this, CalendarPart);
return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));
}
CalendarPart.prototype.render = function render() {
var props = this.props;

@@ -131,5 +119,27 @@ var prefixCls = props.prefixCls,

);
}
});
};
return CalendarPart;
}(React.Component);
CalendarPart.propTypes = {
prefixCls: PropTypes.string,
value: PropTypes.any,
hoverValue: PropTypes.any,
selectedValue: PropTypes.any,
direction: PropTypes.any,
locale: PropTypes.any,
showDateInput: PropTypes.bool,
showTimePicker: PropTypes.bool,
format: PropTypes.any,
placeholder: PropTypes.any,
disabledDate: PropTypes.any,
timePicker: PropTypes.any,
disabledTime: PropTypes.any,
onInputSelect: PropTypes.func,
timePickerDisabledTime: PropTypes.object,
enableNext: PropTypes.any,
enablePrev: PropTypes.any,
clearIcon: PropTypes.node
};
export default CalendarPart;

755

es/RangeCalendar.js
import _extends from 'babel-runtime/helpers/extends';
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 createReactClass from 'create-react-class';
import PropTypes from 'prop-types';

@@ -12,3 +14,3 @@ import moment from 'moment';

import TimePickerButton from './calendar/TimePickerButton';
import CommonMixin from './mixin/CommonMixin';
import { commonMixinWrapper, propType, defaultProp } from './mixin/CommonMixin';
import { syncTime, getTodayTime, isAllowedDate } from './util';

@@ -78,56 +80,15 @@ import { goTime, goStartMonth, goEndMonth, includesTime } from './util/toTime';

var RangeCalendar = createReactClass({
displayName: 'RangeCalendar',
var RangeCalendar = function (_React$Component) {
_inherits(RangeCalendar, _React$Component);
propTypes: {
prefixCls: PropTypes.string,
dateInputPlaceholder: PropTypes.any,
seperator: PropTypes.string,
defaultValue: PropTypes.any,
value: PropTypes.any,
hoverValue: PropTypes.any,
mode: PropTypes.arrayOf(PropTypes.oneOf(['date', 'month', 'year', 'decade'])),
showDateInput: PropTypes.bool,
timePicker: PropTypes.any,
showOk: PropTypes.bool,
showToday: PropTypes.bool,
defaultSelectedValue: PropTypes.array,
selectedValue: PropTypes.array,
onOk: PropTypes.func,
showClear: PropTypes.bool,
locale: PropTypes.object,
onChange: PropTypes.func,
onSelect: PropTypes.func,
onValueChange: PropTypes.func,
onHoverChange: PropTypes.func,
onPanelChange: PropTypes.func,
format: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
onClear: PropTypes.func,
type: PropTypes.any,
disabledDate: PropTypes.func,
disabledTime: PropTypes.func,
clearIcon: PropTypes.node
},
function RangeCalendar(props) {
_classCallCheck(this, RangeCalendar);
mixins: [CommonMixin],
var _this = _possibleConstructorReturn(this, _React$Component.call(this, props));
getDefaultProps: function getDefaultProps() {
return {
type: 'both',
seperator: '~',
defaultSelectedValue: [],
onValueChange: noop,
onHoverChange: noop,
onPanelChange: noop,
disabledTime: noop,
onInputSelect: noop,
showToday: true,
showDateInput: true
};
},
getInitialState: function getInitialState() {
var props = this.props;
_initialiseProps.call(_this);
var selectedValue = props.selectedValue || props.defaultSelectedValue;
var value = normalizeAnchor(props, 1);
return {
_this.state = {
selectedValue: selectedValue,

@@ -141,13 +102,12 @@ prevSelectedValue: selectedValue,

};
},
componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
var state = this.state;
return _this;
}
RangeCalendar.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, state) {
var newState = {};
if ('value' in nextProps) {
newState.value = normalizeAnchor(nextProps, 0);
this.setState(newState);
}
if ('hoverValue' in nextProps && !isArraysEqual(state.hoverValue, nextProps.hoverValue)) {
this.setState({ hoverValue: nextProps.hoverValue });
newState.hoverValue = nextProps.hoverValue;
}

@@ -157,21 +117,236 @@ if ('selectedValue' in nextProps) {

newState.prevSelectedValue = nextProps.selectedValue;
this.setState(newState);
}
if ('mode' in nextProps && !isArraysEqual(state.mode, nextProps.mode)) {
this.setState({ mode: nextProps.mode });
newState = { mode: nextProps.mode };
}
},
onDatePanelEnter: function onDatePanelEnter() {
if (this.hasSelectedValue()) {
this.fireHoverValueChange(this.state.selectedValue.concat());
return newState;
};
// get disabled hours for second picker
RangeCalendar.prototype.render = function render() {
var _className, _classnames;
var props = this.props,
state = this.state;
var prefixCls = props.prefixCls,
dateInputPlaceholder = props.dateInputPlaceholder,
seperator = props.seperator,
timePicker = props.timePicker,
showOk = props.showOk,
locale = props.locale,
showClear = props.showClear,
showToday = props.showToday,
type = props.type,
clearIcon = props.clearIcon;
var hoverValue = state.hoverValue,
selectedValue = state.selectedValue,
mode = state.mode,
showTimePicker = state.showTimePicker;
var className = (_className = {}, _className[props.className] = !!props.className, _className[prefixCls] = 1, _className[prefixCls + '-hidden'] = !props.visible, _className[prefixCls + '-range'] = 1, _className[prefixCls + '-show-time-picker'] = showTimePicker, _className[prefixCls + '-week-number'] = props.showWeekNumber, _className);
var classes = classnames(className);
var newProps = {
selectedValue: state.selectedValue,
onSelect: this.onSelect,
onDayHover: type === 'start' && selectedValue[1] || type === 'end' && selectedValue[0] || !!hoverValue.length ? this.onDayHover : undefined
};
var placeholder1 = void 0;
var placeholder2 = void 0;
if (dateInputPlaceholder) {
if (Array.isArray(dateInputPlaceholder)) {
placeholder1 = dateInputPlaceholder[0];
placeholder2 = dateInputPlaceholder[1];
} else {
placeholder1 = placeholder2 = dateInputPlaceholder;
}
}
},
onDatePanelLeave: function onDatePanelLeave() {
if (this.hasSelectedValue()) {
this.fireHoverValueChange([]);
var showOkButton = showOk === true || showOk !== false && !!timePicker;
var cls = classnames((_classnames = {}, _classnames[prefixCls + '-footer'] = true, _classnames[prefixCls + '-range-bottom'] = true, _classnames[prefixCls + '-footer-show-ok'] = showOkButton, _classnames));
var startValue = this.getStartValue();
var endValue = this.getEndValue();
var todayTime = getTodayTime(startValue);
var thisMonth = todayTime.month();
var thisYear = todayTime.year();
var isTodayInView = startValue.year() === thisYear && startValue.month() === thisMonth || endValue.year() === thisYear && endValue.month() === thisMonth;
var nextMonthOfStart = startValue.clone().add(1, 'months');
var isClosestMonths = nextMonthOfStart.year() === endValue.year() && nextMonthOfStart.month() === endValue.month();
// console.warn('Render:', selectedValue.map(t => t.format('YYYY-MM-DD')).join(', '));
// console.log('start:', startValue.format('YYYY-MM-DD'));
// console.log('end:', endValue.format('YYYY-MM-DD'));
var extraFooter = props.renderFooter();
return React.createElement(
'div',
{
ref: this.saveRoot,
className: classes,
style: props.style,
tabIndex: '0',
onKeyDown: this.onKeyDown
},
props.renderSidebar(),
React.createElement(
'div',
{ className: prefixCls + '-panel' },
showClear && selectedValue[0] && selectedValue[1] ? React.createElement(
'a',
{
role: 'button',
title: locale.clear,
onClick: this.clear
},
clearIcon || React.createElement('span', { className: prefixCls + '-clear-btn' })
) : null,
React.createElement(
'div',
{
className: prefixCls + '-date-panel',
onMouseLeave: type !== 'both' ? this.onDatePanelLeave : undefined,
onMouseEnter: type !== 'both' ? this.onDatePanelEnter : undefined
},
React.createElement(CalendarPart, _extends({}, props, newProps, {
hoverValue: hoverValue,
direction: 'left',
disabledTime: this.disabledStartTime,
disabledMonth: this.disabledStartMonth,
format: this.getFormat(),
value: startValue,
mode: mode[0],
placeholder: placeholder1,
onInputSelect: this.onStartInputSelect,
onValueChange: this.onStartValueChange,
onPanelChange: this.onStartPanelChange,
showDateInput: this.props.showDateInput,
timePicker: timePicker,
showTimePicker: showTimePicker,
enablePrev: true,
enableNext: !isClosestMonths || this.isMonthYearPanelShow(mode[1]),
clearIcon: clearIcon
})),
React.createElement(
'span',
{ className: prefixCls + '-range-middle' },
seperator
),
React.createElement(CalendarPart, _extends({}, props, newProps, {
hoverValue: hoverValue,
direction: 'right',
format: this.getFormat(),
timePickerDisabledTime: this.getEndDisableTime(),
placeholder: placeholder2,
value: endValue,
mode: mode[1],
onInputSelect: this.onEndInputSelect,
onValueChange: this.onEndValueChange,
onPanelChange: this.onEndPanelChange,
showDateInput: this.props.showDateInput,
timePicker: timePicker,
showTimePicker: showTimePicker,
disabledTime: this.disabledEndTime,
disabledMonth: this.disabledEndMonth,
enablePrev: !isClosestMonths || this.isMonthYearPanelShow(mode[0]),
enableNext: true,
clearIcon: clearIcon
}))
),
React.createElement(
'div',
{ className: cls },
showToday || props.timePicker || showOkButton || extraFooter ? React.createElement(
'div',
{ className: prefixCls + '-footer-btn' },
extraFooter,
showToday ? React.createElement(TodayButton, _extends({}, props, {
disabled: isTodayInView,
value: state.value[0],
onToday: this.onToday,
text: locale.backToToday
})) : null,
props.timePicker ? React.createElement(TimePickerButton, _extends({}, props, {
showTimePicker: showTimePicker,
onOpenTimePicker: this.onOpenTimePicker,
onCloseTimePicker: this.onCloseTimePicker,
timePickerDisabled: !this.hasSelectedValue() || hoverValue.length
})) : null,
showOkButton ? React.createElement(OkButton, _extends({}, props, {
onOk: this.onOk,
okDisabled: !this.isAllowedDateAndTime(selectedValue) || !this.hasSelectedValue() || hoverValue.length
})) : null
) : null
)
)
);
};
return RangeCalendar;
}(React.Component);
RangeCalendar.propTypes = _extends({}, propType, {
prefixCls: PropTypes.string,
dateInputPlaceholder: PropTypes.any,
seperator: PropTypes.string,
defaultValue: PropTypes.any,
value: PropTypes.any,
hoverValue: PropTypes.any,
mode: PropTypes.arrayOf(PropTypes.oneOf(['date', 'month', 'year', 'decade'])),
showDateInput: PropTypes.bool,
timePicker: PropTypes.any,
showOk: PropTypes.bool,
showToday: PropTypes.bool,
defaultSelectedValue: PropTypes.array,
selectedValue: PropTypes.array,
onOk: PropTypes.func,
showClear: PropTypes.bool,
locale: PropTypes.object,
onChange: PropTypes.func,
onSelect: PropTypes.func,
onValueChange: PropTypes.func,
onHoverChange: PropTypes.func,
onPanelChange: PropTypes.func,
format: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
onClear: PropTypes.func,
type: PropTypes.any,
disabledDate: PropTypes.func,
disabledTime: PropTypes.func,
clearIcon: PropTypes.node,
onKeyDown: PropTypes.func
});
RangeCalendar.defaultProps = _extends({}, defaultProp, {
type: 'both',
seperator: '~',
defaultSelectedValue: [],
onValueChange: noop,
onHoverChange: noop,
onPanelChange: noop,
disabledTime: noop,
onInputSelect: noop,
showToday: true,
showDateInput: true
});
var _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.onDatePanelEnter = function () {
if (_this2.hasSelectedValue()) {
_this2.fireHoverValueChange(_this2.state.selectedValue.concat());
}
},
onSelect: function onSelect(value) {
var type = this.props.type;
var _state = this.state,
};
this.onDatePanelLeave = function () {
if (_this2.hasSelectedValue()) {
_this2.fireHoverValueChange([]);
}
};
this.onSelect = function (value) {
var type = _this2.props.type;
var _state = _this2.state,
selectedValue = _state.selectedValue,

@@ -186,3 +361,3 @@ prevSelectedValue = _state.prevSelectedValue,

nextSelectedValue = [value];
} else if (this.compare(firstSelectedValue, value) < 0) {
} else if (_this2.compare(firstSelectedValue, value) < 0) {
syncTime(prevSelectedValue[1], value);

@@ -198,7 +373,7 @@ nextSelectedValue = [firstSelectedValue, value];

var endValue = selectedValue[1];
nextSelectedValue = endValue && this.compare(endValue, value) > 0 ? [value, endValue] : [value];
nextSelectedValue = endValue && _this2.compare(endValue, value) > 0 ? [value, endValue] : [value];
} else {
// type === 'end'
var startValue = selectedValue[0];
if (startValue && this.compare(startValue, value) <= 0) {
if (startValue && _this2.compare(startValue, value) <= 0) {
syncTime(prevSelectedValue[1], value);

@@ -212,7 +387,6 @@ nextSelectedValue = [startValue, value];

this.fireSelectValueChange(nextSelectedValue);
},
onKeyDown: function onKeyDown(event) {
var _this = this;
_this2.fireSelectValueChange(nextSelectedValue);
};
this.onKeyDown = function (event) {
if (event.target.nodeName.toLowerCase() === 'input') {

@@ -226,3 +400,3 @@ return;

var _state2 = this.state,
var _state2 = _this2.state,
selectedValue = _state2.selectedValue,

@@ -232,3 +406,3 @@ hoverValue = _state2.hoverValue,

value = _state2.value;
var _props = this.props,
var _props = _this2.props,
onKeyDown = _props.onKeyDown,

@@ -249,3 +423,3 @@ disabledDate = _props.disabledDate;

nextHoverValue = [nextHoverTime];
_this.fireHoverValueChange(nextHoverValue);
_this2.fireHoverValueChange(nextHoverValue);
} else {

@@ -255,7 +429,7 @@ if (hoverValue.length === 1) {

nextHoverTime = func(currentHoverTime);
nextHoverValue = _this.onDayHover(nextHoverTime);
nextHoverValue = _this2.onDayHover(nextHoverTime);
} else {
currentHoverTime = hoverValue[0].isSame(firstSelectedValue, 'day') ? hoverValue[1] : hoverValue[0];
nextHoverTime = func(currentHoverTime);
nextHoverValue = _this.onDayHover(nextHoverTime);
nextHoverValue = _this2.onDayHover(nextHoverTime);
}

@@ -276,3 +450,3 @@ }

}
_this.fireValueChange(newValue);
_this2.fireValueChange(newValue);
}

@@ -291,3 +465,3 @@ } else if (nextHoverValue.length === 1) {

_newValue[oriValueIndex] = nextHoverTime.clone();
_this.fireValueChange(_newValue);
_this2.fireValueChange(_newValue);
}

@@ -367,3 +541,3 @@ }

if (lastValue && (!disabledDate || !disabledDate(lastValue))) {
this.onSelect(lastValue);
_this2.onSelect(lastValue);
}

@@ -378,50 +552,56 @@ event.preventDefault();

}
},
onDayHover: function onDayHover(value) {
};
this.onDayHover = function (value) {
var hoverValue = [];
var _state3 = this.state,
var _state3 = _this2.state,
selectedValue = _state3.selectedValue,
firstSelectedValue = _state3.firstSelectedValue;
var type = this.props.type;
var type = _this2.props.type;
if (type === 'start' && selectedValue[1]) {
hoverValue = this.compare(value, selectedValue[1]) < 0 ? [value, selectedValue[1]] : [value];
hoverValue = _this2.compare(value, selectedValue[1]) < 0 ? [value, selectedValue[1]] : [value];
} else if (type === 'end' && selectedValue[0]) {
hoverValue = this.compare(value, selectedValue[0]) > 0 ? [selectedValue[0], value] : [];
hoverValue = _this2.compare(value, selectedValue[0]) > 0 ? [selectedValue[0], value] : [];
} else {
if (!firstSelectedValue) {
if (this.state.hoverValue.length) {
this.setState({ hoverValue: [] });
if (_this2.state.hoverValue.length) {
_this2.setState({ hoverValue: [] });
}
return hoverValue;
}
hoverValue = this.compare(value, firstSelectedValue) < 0 ? [value, firstSelectedValue] : [firstSelectedValue, value];
hoverValue = _this2.compare(value, firstSelectedValue) < 0 ? [value, firstSelectedValue] : [firstSelectedValue, value];
}
this.fireHoverValueChange(hoverValue);
_this2.fireHoverValueChange(hoverValue);
return hoverValue;
},
onToday: function onToday() {
var startValue = getTodayTime(this.state.value[0]);
};
this.onToday = function () {
var startValue = getTodayTime(_this2.state.value[0]);
var endValue = startValue.clone().add(1, 'months');
this.setState({ value: [startValue, endValue] });
},
onOpenTimePicker: function onOpenTimePicker() {
this.setState({
_this2.setState({ value: [startValue, endValue] });
};
this.onOpenTimePicker = function () {
_this2.setState({
showTimePicker: true
});
},
onCloseTimePicker: function onCloseTimePicker() {
this.setState({
};
this.onCloseTimePicker = function () {
_this2.setState({
showTimePicker: false
});
},
onOk: function onOk() {
var selectedValue = this.state.selectedValue;
};
if (this.isAllowedDateAndTime(selectedValue)) {
this.props.onOk(this.state.selectedValue);
this.onOk = function () {
var selectedValue = _this2.state.selectedValue;
if (_this2.isAllowedDateAndTime(selectedValue)) {
_this2.props.onOk(_this2.state.selectedValue);
}
},
onStartInputSelect: function onStartInputSelect() {
};
this.onStartInputSelect = function () {
for (var _len = arguments.length, oargs = Array(_len), _key = 0; _key < _len; _key++) {

@@ -432,5 +612,6 @@ oargs[_key] = arguments[_key];

var args = ['left'].concat(oargs);
return onInputSelect.apply(this, args);
},
onEndInputSelect: function onEndInputSelect() {
return onInputSelect.apply(_this2, args);
};
this.onEndInputSelect = function () {
for (var _len2 = arguments.length, oargs = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {

@@ -441,21 +622,24 @@ oargs[_key2] = arguments[_key2];

var args = ['right'].concat(oargs);
return onInputSelect.apply(this, args);
},
onStartValueChange: function onStartValueChange(leftValue) {
var value = [].concat(this.state.value);
return onInputSelect.apply(_this2, args);
};
this.onStartValueChange = function (leftValue) {
var value = [].concat(_this2.state.value);
value[0] = leftValue;
return this.fireValueChange(value);
},
onEndValueChange: function onEndValueChange(rightValue) {
var value = [].concat(this.state.value);
return _this2.fireValueChange(value);
};
this.onEndValueChange = function (rightValue) {
var value = [].concat(_this2.state.value);
value[1] = rightValue;
return this.fireValueChange(value);
},
onStartPanelChange: function onStartPanelChange(value, mode) {
var props = this.props,
state = this.state;
return _this2.fireValueChange(value);
};
this.onStartPanelChange = function (value, mode) {
var props = _this2.props,
state = _this2.state;
var newMode = [mode, state.mode[1]];
if (!('mode' in props)) {
this.setState({
_this2.setState({
mode: newMode

@@ -466,10 +650,11 @@ });

props.onPanelChange(newValue, newMode);
},
onEndPanelChange: function onEndPanelChange(value, mode) {
var props = this.props,
state = this.state;
};
this.onEndPanelChange = function (value, mode) {
var props = _this2.props,
state = _this2.state;
var newMode = [state.mode[0], mode];
if (!('mode' in props)) {
this.setState({
_this2.setState({
mode: newMode

@@ -480,18 +665,20 @@ });

props.onPanelChange(newValue, newMode);
},
getStartValue: function getStartValue() {
var value = this.state.value[0];
var selectedValue = this.state.selectedValue;
};
this.getStartValue = function () {
var value = _this2.state.value[0];
var selectedValue = _this2.state.selectedValue;
// keep selectedTime when select date
if (selectedValue[0] && this.props.timePicker) {
if (selectedValue[0] && _this2.props.timePicker) {
value = value.clone();
syncTime(selectedValue[0], value);
}
if (this.state.showTimePicker && selectedValue[0]) {
if (_this2.state.showTimePicker && selectedValue[0]) {
return selectedValue[0];
}
return value;
},
getEndValue: function getEndValue() {
var _state4 = this.state,
};
this.getEndValue = function () {
var _state4 = _this2.state,
value = _state4.value,

@@ -503,17 +690,16 @@ selectedValue = _state4.selectedValue,

// keep selectedTime when select date
if (selectedValue[1] && this.props.timePicker) {
if (selectedValue[1] && _this2.props.timePicker) {
syncTime(selectedValue[1], endValue);
}
if (showTimePicker) {
return selectedValue[1] ? selectedValue[1] : this.getStartValue();
return selectedValue[1] ? selectedValue[1] : _this2.getStartValue();
}
return endValue;
},
};
// get disabled hours for second picker
getEndDisableTime: function getEndDisableTime() {
var _state5 = this.state,
this.getEndDisableTime = function () {
var _state5 = _this2.state,
selectedValue = _state5.selectedValue,
value = _state5.value;
var disabledTime = this.props.disabledTime;
var disabledTime = _this2.props.disabledTime;

@@ -556,24 +742,29 @@ var userSettingDisabledTime = disabledTime(selectedValue, 'end') || {};

return userSettingDisabledTime;
},
isAllowedDateAndTime: function isAllowedDateAndTime(selectedValue) {
return isAllowedDate(selectedValue[0], this.props.disabledDate, this.disabledStartTime) && isAllowedDate(selectedValue[1], this.props.disabledDate, this.disabledEndTime);
},
isMonthYearPanelShow: function isMonthYearPanelShow(mode) {
};
this.isAllowedDateAndTime = function (selectedValue) {
return isAllowedDate(selectedValue[0], _this2.props.disabledDate, _this2.disabledStartTime) && isAllowedDate(selectedValue[1], _this2.props.disabledDate, _this2.disabledEndTime);
};
this.isMonthYearPanelShow = function (mode) {
return ['month', 'year', 'decade'].indexOf(mode) > -1;
},
hasSelectedValue: function hasSelectedValue() {
var selectedValue = this.state.selectedValue;
};
this.hasSelectedValue = function () {
var selectedValue = _this2.state.selectedValue;
return !!selectedValue[1] && !!selectedValue[0];
},
compare: function compare(v1, v2) {
if (this.props.timePicker) {
};
this.compare = function (v1, v2) {
if (_this2.props.timePicker) {
return v1.diff(v2);
}
return v1.diff(v2, 'days');
},
fireSelectValueChange: function fireSelectValueChange(selectedValue, direct) {
var timePicker = this.props.timePicker;
var prevSelectedValue = this.state.prevSelectedValue;
};
this.fireSelectValueChange = function (selectedValue, direct) {
var timePicker = _this2.props.timePicker;
var prevSelectedValue = _this2.state.prevSelectedValue;
if (timePicker && timePicker.props.defaultValue) {

@@ -589,4 +780,4 @@ var timePickerDefaultValue = timePicker.props.defaultValue;

if (!('selectedValue' in this.props)) {
this.setState({
if (!('selectedValue' in _this2.props)) {
_this2.setState({
selectedValue: selectedValue

@@ -597,6 +788,6 @@ });

// 尚未选择过时间，直接输入的话
if (!this.state.selectedValue[0] || !this.state.selectedValue[1]) {
if (!_this2.state.selectedValue[0] || !_this2.state.selectedValue[1]) {
var startValue = selectedValue[0] || moment();
var endValue = selectedValue[1] || startValue.clone().add(1, 'months');
this.setState({
_this2.setState({
selectedValue: selectedValue,

@@ -608,19 +799,20 @@ value: getValueFromSelectedValue([startValue, endValue])

if (selectedValue[0] && !selectedValue[1]) {
this.setState({ firstSelectedValue: selectedValue[0] });
this.fireHoverValueChange(selectedValue.concat());
_this2.setState({ firstSelectedValue: selectedValue[0] });
_this2.fireHoverValueChange(selectedValue.concat());
}
this.props.onChange(selectedValue);
_this2.props.onChange(selectedValue);
if (direct || selectedValue[0] && selectedValue[1]) {
this.setState({
_this2.setState({
prevSelectedValue: selectedValue,
firstSelectedValue: null
});
this.fireHoverValueChange([]);
this.props.onSelect(selectedValue);
_this2.fireHoverValueChange([]);
_this2.props.onSelect(selectedValue);
}
},
fireValueChange: function fireValueChange(value) {
var props = this.props;
};
this.fireValueChange = function (value) {
var props = _this2.props;
if (!('value' in props)) {
this.setState({
_this2.setState({
value: value

@@ -630,191 +822,38 @@ });

props.onValueChange(value);
},
fireHoverValueChange: function fireHoverValueChange(hoverValue) {
var props = this.props;
};
this.fireHoverValueChange = function (hoverValue) {
var props = _this2.props;
if (!('hoverValue' in props)) {
this.setState({ hoverValue: hoverValue });
_this2.setState({ hoverValue: hoverValue });
}
props.onHoverChange(hoverValue);
},
clear: function clear() {
this.fireSelectValueChange([], true);
this.props.onClear();
},
disabledStartTime: function disabledStartTime(time) {
return this.props.disabledTime(time, 'start');
},
disabledEndTime: function disabledEndTime(time) {
return this.props.disabledTime(time, 'end');
},
disabledStartMonth: function disabledStartMonth(month) {
var value = this.state.value;
};
return month.isSameOrAfter(value[1], 'month');
},
disabledEndMonth: function disabledEndMonth(month) {
var value = this.state.value;
this.clear = function () {
_this2.fireSelectValueChange([], true);
_this2.props.onClear();
};
return month.isSameOrBefore(value[0], 'month');
},
render: function render() {
var _className, _classnames;
this.disabledStartTime = function (time) {
return _this2.props.disabledTime(time, 'start');
};
var props = this.props,
state = this.state;
var prefixCls = props.prefixCls,
dateInputPlaceholder = props.dateInputPlaceholder,
seperator = props.seperator,
timePicker = props.timePicker,
showOk = props.showOk,
locale = props.locale,
showClear = props.showClear,
showToday = props.showToday,
type = props.type,
clearIcon = props.clearIcon;
var hoverValue = state.hoverValue,
selectedValue = state.selectedValue,
mode = state.mode,
showTimePicker = state.showTimePicker;
this.disabledEndTime = function (time) {
return _this2.props.disabledTime(time, 'end');
};
var className = (_className = {}, _className[props.className] = !!props.className, _className[prefixCls] = 1, _className[prefixCls + '-hidden'] = !props.visible, _className[prefixCls + '-range'] = 1, _className[prefixCls + '-show-time-picker'] = showTimePicker, _className[prefixCls + '-week-number'] = props.showWeekNumber, _className);
var classes = classnames(className);
var newProps = {
selectedValue: state.selectedValue,
onSelect: this.onSelect,
onDayHover: type === 'start' && selectedValue[1] || type === 'end' && selectedValue[0] || !!hoverValue.length ? this.onDayHover : undefined
};
this.disabledStartMonth = function (month) {
var value = _this2.state.value;
var placeholder1 = void 0;
var placeholder2 = void 0;
return month.isSameOrAfter(value[1], 'month');
};
if (dateInputPlaceholder) {
if (Array.isArray(dateInputPlaceholder)) {
placeholder1 = dateInputPlaceholder[0];
placeholder2 = dateInputPlaceholder[1];
} else {
placeholder1 = placeholder2 = dateInputPlaceholder;
}
}
var showOkButton = showOk === true || showOk !== false && !!timePicker;
var cls = classnames((_classnames = {}, _classnames[prefixCls + '-footer'] = true, _classnames[prefixCls + '-range-bottom'] = true, _classnames[prefixCls + '-footer-show-ok'] = showOkButton, _classnames));
this.disabledEndMonth = function (month) {
var value = _this2.state.value;
var startValue = this.getStartValue();
var endValue = this.getEndValue();
var todayTime = getTodayTime(startValue);
var thisMonth = todayTime.month();
var thisYear = todayTime.year();
var isTodayInView = startValue.year() === thisYear && startValue.month() === thisMonth || endValue.year() === thisYear && endValue.month() === thisMonth;
var nextMonthOfStart = startValue.clone().add(1, 'months');
var isClosestMonths = nextMonthOfStart.year() === endValue.year() && nextMonthOfStart.month() === endValue.month();
return month.isSameOrBefore(value[0], 'month');
};
};
// console.warn('Render:', selectedValue.map(t => t.format('YYYY-MM-DD')).join(', '));
// console.log('start:', startValue.format('YYYY-MM-DD'));
// console.log('end:', endValue.format('YYYY-MM-DD'));
var extraFooter = props.renderFooter();
return React.createElement(
'div',
{
ref: this.saveRoot,
className: classes,
style: props.style,
tabIndex: '0',
onKeyDown: this.onKeyDown
},
props.renderSidebar(),
React.createElement(
'div',
{ className: prefixCls + '-panel' },
showClear && selectedValue[0] && selectedValue[1] ? React.createElement(
'a',
{
role: 'button',
title: locale.clear,
onClick: this.clear
},
clearIcon || React.createElement('span', { className: prefixCls + '-clear-btn' })
) : null,
React.createElement(
'div',
{
className: prefixCls + '-date-panel',
onMouseLeave: type !== 'both' ? this.onDatePanelLeave : undefined,
onMouseEnter: type !== 'both' ? this.onDatePanelEnter : undefined
},
React.createElement(CalendarPart, _extends({}, props, newProps, {
hoverValue: hoverValue,
direction: 'left',
disabledTime: this.disabledStartTime,
disabledMonth: this.disabledStartMonth,
format: this.getFormat(),
value: startValue,
mode: mode[0],
placeholder: placeholder1,
onInputSelect: this.onStartInputSelect,
onValueChange: this.onStartValueChange,
onPanelChange: this.onStartPanelChange,
showDateInput: this.props.showDateInput,
timePicker: timePicker,
showTimePicker: showTimePicker,
enablePrev: true,
enableNext: !isClosestMonths || this.isMonthYearPanelShow(mode[1]),
clearIcon: clearIcon
})),
React.createElement(
'span',
{ className: prefixCls + '-range-middle' },
seperator
),
React.createElement(CalendarPart, _extends({}, props, newProps, {
hoverValue: hoverValue,
direction: 'right',
format: this.getFormat(),
timePickerDisabledTime: this.getEndDisableTime(),
placeholder: placeholder2,
value: endValue,
mode: mode[1],
onInputSelect: this.onEndInputSelect,
onValueChange: this.onEndValueChange,
onPanelChange: this.onEndPanelChange,
showDateInput: this.props.showDateInput,
timePicker: timePicker,
showTimePicker: showTimePicker,
disabledTime: this.disabledEndTime,
disabledMonth: this.disabledEndMonth,
enablePrev: !isClosestMonths || this.isMonthYearPanelShow(mode[0]),
enableNext: true,
clearIcon: clearIcon
}))
),
React.createElement(
'div',
{ className: cls },
showToday || props.timePicker || showOkButton || extraFooter ? React.createElement(
'div',
{ className: prefixCls + '-footer-btn' },
extraFooter,
showToday ? React.createElement(TodayButton, _extends({}, props, {
disabled: isTodayInView,
value: state.value[0],
onToday: this.onToday,
text: locale.backToToday
})) : null,
props.timePicker ? React.createElement(TimePickerButton, _extends({}, props, {
showTimePicker: showTimePicker,
onOpenTimePicker: this.onOpenTimePicker,
onCloseTimePicker: this.onCloseTimePicker,
timePickerDisabled: !this.hasSelectedValue() || hoverValue.length
})) : null,
showOkButton ? React.createElement(OkButton, _extends({}, props, {
onOk: this.onOk,
okDisabled: !this.isAllowedDateAndTime(selectedValue) || !this.hasSelectedValue() || hoverValue.length
})) : null
) : null
)
)
);
}
});
export default RangeCalendar;
export default commonMixinWrapper(RangeCalendar);

4

HISTORY.md
# History
----
## 9.10.0 / 2019-01-02
- add `focusablePanel` prop.
## 9.9.0 / 2018-12-23

@@ -5,0 +9,0 @@

4

index.d.ts

@@ -32,4 +32,4 @@ // Type definitions for rc-calendar 9.6

onPanelChange?: (date: Moment, mode: Mode) => void;
disabledDate?: (current: Moment) => boolean;
disabledTime?: (current: Moment) => object;
disabledDate?: (current: Moment | undefined) => boolean;
disabledTime?: (current: Moment | undefined) => object;
dateRender?: (current: Moment, value: Moment) => React.ReactNode;

@@ -36,0 +36,0 @@ renderFooter?: () => React.ReactNode;

422

lib/Calendar.js

@@ -9,2 +9,14 @@ 'use strict';

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');

@@ -18,6 +30,2 @@

var _createReactClass = require('create-react-class');
var _createReactClass2 = _interopRequireDefault(_createReactClass);
var _propTypes = require('prop-types');

@@ -45,8 +53,4 @@

var _CalendarMixin2 = _interopRequireDefault(_CalendarMixin);
var _CommonMixin = require('./mixin/CommonMixin');
var _CommonMixin2 = _interopRequireDefault(_CommonMixin);
var _DateInput = require('./date/DateInput');

@@ -60,2 +64,6 @@

var _moment = require('moment');
var _moment2 = _interopRequireDefault(_moment);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

@@ -65,177 +73,46 @@

var Calendar = (0, _createReactClass2['default'])({
displayName: 'Calendar',
var Calendar = function (_React$Component) {
(0, _inherits3['default'])(Calendar, _React$Component);
propTypes: {
prefixCls: _propTypes2['default'].string,
className: _propTypes2['default'].string,
style: _propTypes2['default'].object,
defaultValue: _propTypes2['default'].object,
value: _propTypes2['default'].object,
selectedValue: _propTypes2['default'].object,
mode: _propTypes2['default'].oneOf(['time', 'date', 'month', 'year', 'decade']),
locale: _propTypes2['default'].object,
showDateInput: _propTypes2['default'].bool,
showWeekNumber: _propTypes2['default'].bool,
showToday: _propTypes2['default'].bool,
showOk: _propTypes2['default'].bool,
onSelect: _propTypes2['default'].func,
onOk: _propTypes2['default'].func,
onKeyDown: _propTypes2['default'].func,
timePicker: _propTypes2['default'].element,
dateInputPlaceholder: _propTypes2['default'].any,
onClear: _propTypes2['default'].func,
onChange: _propTypes2['default'].func,
onPanelChange: _propTypes2['default'].func,
disabledDate: _propTypes2['default'].func,
disabledTime: _propTypes2['default'].any,
dateRender: _propTypes2['default'].func,
renderFooter: _propTypes2['default'].func,
renderSidebar: _propTypes2['default'].func,
clearIcon: _propTypes2['default'].node
},
function Calendar(props) {
(0, _classCallCheck3['default'])(this, Calendar);
mixins: [_CommonMixin2['default'], _CalendarMixin2['default']],
var _this = (0, _possibleConstructorReturn3['default'])(this, _React$Component.call(this, props));
getDefaultProps: function getDefaultProps() {
return {
showToday: true,
showDateInput: true,
timePicker: null,
onOk: noop,
onPanelChange: noop
_initialiseProps.call(_this);
_this.state = {
mode: _this.props.mode || 'date',
value: props.value || props.defaultValue || (0, _moment2['default'])(),
selectedValue: props.selectedValue || props.defaultSelectedValue
};
},
getInitialState: function getInitialState() {
return {
mode: this.props.mode || 'date'
};
},
componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
if ('mode' in nextProps && this.state.mode !== nextProps.mode) {
this.setState({ mode: nextProps.mode });
}
},
onKeyDown: function onKeyDown(event) {
if (event.target.nodeName.toLowerCase() === 'input') {
return undefined;
}
var keyCode = event.keyCode;
// mac
var ctrlKey = event.ctrlKey || event.metaKey;
var disabledDate = this.props.disabledDate;
var value = this.state.value;
return _this;
}
switch (keyCode) {
case _KeyCode2['default'].DOWN:
this.goTime(1, 'weeks');
event.preventDefault();
return 1;
case _KeyCode2['default'].UP:
this.goTime(-1, 'weeks');
event.preventDefault();
return 1;
case _KeyCode2['default'].LEFT:
if (ctrlKey) {
this.goTime(-1, 'years');
} else {
this.goTime(-1, 'days');
}
event.preventDefault();
return 1;
case _KeyCode2['default'].RIGHT:
if (ctrlKey) {
this.goTime(1, 'years');
} else {
this.goTime(1, 'days');
}
event.preventDefault();
return 1;
case _KeyCode2['default'].HOME:
this.setValue((0, _toTime.goStartMonth)(this.state.value));
event.preventDefault();
return 1;
case _KeyCode2['default'].END:
this.setValue((0, _toTime.goEndMonth)(this.state.value));
event.preventDefault();
return 1;
case _KeyCode2['default'].PAGE_DOWN:
this.goTime(1, 'month');
event.preventDefault();
return 1;
case _KeyCode2['default'].PAGE_UP:
this.goTime(-1, 'month');
event.preventDefault();
return 1;
case _KeyCode2['default'].ENTER:
if (!disabledDate || !disabledDate(value)) {
this.onSelect(value, {
source: 'keyboard'
});
}
event.preventDefault();
return 1;
default:
this.props.onKeyDown(event);
return 1;
Calendar.prototype.componentDidMount = function componentDidMount() {
if (this.props.showDateInput) {
this.saveFocusElement(_DateInput2['default'].getInstance());
}
},
onClear: function onClear() {
this.onSelect(null);
this.props.onClear();
},
onOk: function onOk() {
var selectedValue = this.state.selectedValue;
};
if (this.isAllowedDate(selectedValue)) {
this.props.onOk(selectedValue);
}
},
onDateInputChange: function onDateInputChange(value) {
this.onSelect(value, {
source: 'dateInput'
});
},
onDateTableSelect: function onDateTableSelect(value) {
var timePicker = this.props.timePicker;
var selectedValue = this.state.selectedValue;
Calendar.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, state) {
var value = nextProps.value,
selectedValue = nextProps.selectedValue;
if (!selectedValue && timePicker) {
var timePickerDefaultValue = timePicker.props.defaultValue;
if (timePickerDefaultValue) {
(0, _util.syncTime)(timePickerDefaultValue, value);
}
var newState = {};
if ('mode' in nextProps && state.mode !== nextProps.mode) {
newState = { mode: nextProps.mode };
}
this.onSelect(value);
},
onToday: function onToday() {
var value = this.state.value;
if ('value' in nextProps) {
newState.value = value || nextProps.defaultValue || (0, _CalendarMixin.getNowByCurrentStateValue)(state.value);
}
if ('selectedValue' in nextProps) {
newState.selectedValue = selectedValue;
}
var now = (0, _util.getTodayTime)(value);
this.onSelect(now, {
source: 'todayButton'
});
},
onPanelChange: function onPanelChange(value, mode) {
var props = this.props,
state = this.state;
return newState;
};
if (!('mode' in props)) {
this.setState({ mode: mode });
}
props.onPanelChange(value || state.value, mode);
},
getRootDOMNode: function getRootDOMNode() {
return _reactDom2['default'].findDOMNode(this);
},
openTimePicker: function openTimePicker() {
this.onPanelChange(null, 'time');
},
closeTimePicker: function closeTimePicker() {
this.onPanelChange(null, 'date');
},
goTime: function goTime(direction, unit) {
this.setValue((0, _toTime.goTime)(this.state.value, direction, unit));
},
render: function render() {
Calendar.prototype.render = function render() {
var props = this.props,

@@ -293,3 +170,8 @@ state = this.state;

}) : null;
var children = [props.renderSidebar(), _react2['default'].createElement(
var children = [];
if (props.renderSidebar) {
children.push(props.renderSidebar());
}
children.push(_react2['default'].createElement(
'div',

@@ -300,3 +182,6 @@ { className: prefixCls + '-panel', key: 'panel' },

'div',
{ className: prefixCls + '-date-panel' },
{
tabIndex: this.props.focusablePanel ? 0 : undefined,
className: prefixCls + '-date-panel'
},
_react2['default'].createElement(_CalendarHeader2['default'], {

@@ -357,3 +242,3 @@ locale: locale,

)
)];
));

@@ -364,6 +249,189 @@ return this.renderRoot({

});
}
};
return Calendar;
}(_react2['default'].Component);
Calendar.propTypes = (0, _extends3['default'])({}, _CalendarMixin.calendarMixinPropTypes, _CommonMixin.propType, {
prefixCls: _propTypes2['default'].string,
className: _propTypes2['default'].string,
style: _propTypes2['default'].object,
defaultValue: _propTypes2['default'].object,
value: _propTypes2['default'].object,
selectedValue: _propTypes2['default'].object,
defaultSelectedValue: _propTypes2['default'].object,
mode: _propTypes2['default'].oneOf(['time', 'date', 'month', 'year', 'decade']),
locale: _propTypes2['default'].object,
showDateInput: _propTypes2['default'].bool,
showWeekNumber: _propTypes2['default'].bool,
showToday: _propTypes2['default'].bool,
showOk: _propTypes2['default'].bool,
onSelect: _propTypes2['default'].func,
onOk: _propTypes2['default'].func,
onKeyDown: _propTypes2['default'].func,
timePicker: _propTypes2['default'].element,
dateInputPlaceholder: _propTypes2['default'].any,
onClear: _propTypes2['default'].func,
onChange: _propTypes2['default'].func,
onPanelChange: _propTypes2['default'].func,
disabledDate: _propTypes2['default'].func,
disabledTime: _propTypes2['default'].any,
dateRender: _propTypes2['default'].func,
renderFooter: _propTypes2['default'].func,
renderSidebar: _propTypes2['default'].func,
clearIcon: _propTypes2['default'].node,
focusablePanel: _propTypes2['default'].bool
});
Calendar.defaultProps = (0, _extends3['default'])({}, _CalendarMixin.calendarMixinDefaultProps, _CommonMixin.defaultProp, {
showToday: true,
showDateInput: true,
timePicker: null,
onOk: noop,
onPanelChange: noop,
focusablePanel: true
});
exports['default'] = Calendar;
var _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.onPanelChange = function (value, mode) {
var props = _this2.props,
state = _this2.state;
if (!('mode' in props)) {
_this2.setState({ mode: mode });
}
props.onPanelChange(value || state.value, mode);
};
this.onKeyDown = function (event) {
if (event.target.nodeName.toLowerCase() === 'input') {
return undefined;
}
var keyCode = event.keyCode;
// mac
var ctrlKey = event.ctrlKey || event.metaKey;
var disabledDate = _this2.props.disabledDate;
var value = _this2.state.value;
switch (keyCode) {
case _KeyCode2['default'].DOWN:
_this2.goTime(1, 'weeks');
event.preventDefault();
return 1;
case _KeyCode2['default'].UP:
_this2.goTime(-1, 'weeks');
event.preventDefault();
return 1;
case _KeyCode2['default'].LEFT:
if (ctrlKey) {
_this2.goTime(-1, 'years');
} else {
_this2.goTime(-1, 'days');
}
event.preventDefault();
return 1;
case _KeyCode2['default'].RIGHT:
if (ctrlKey) {
_this2.goTime(1, 'years');
} else {
_this2.goTime(1, 'days');
}
event.preventDefault();
return 1;
case _KeyCode2['default'].HOME:
_this2.setValue((0, _toTime.goStartMonth)(_this2.state.value));
event.preventDefault();
return 1;
case _KeyCode2['default'].END:
_this2.setValue((0, _toTime.goEndMonth)(_this2.state.value));
event.preventDefault();
return 1;
case _KeyCode2['default'].PAGE_DOWN:
_this2.goTime(1, 'month');
event.preventDefault();
return 1;
case _KeyCode2['default'].PAGE_UP:
_this2.goTime(-1, 'month');
event.preventDefault();
return 1;
case _KeyCode2['default'].ENTER:
if (!disabledDate || !disabledDate(value)) {
_this2.onSelect(value, {
source: 'keyboard'
});
}
event.preventDefault();
return 1;
default:
_this2.props.onKeyDown(event);
return 1;
}
};
this.onClear = function () {
_this2.onSelect(null);
_this2.props.onClear();
};
this.onOk = function () {
var selectedValue = _this2.state.selectedValue;
if (_this2.isAllowedDate(selectedValue)) {
_this2.props.onOk(selectedValue);
}
};
this.onDateInputChange = function (value) {
_this2.onSelect(value, {
source: 'dateInput'
});
};
this.onDateInputChange = function (value) {
_this2.onSelect(value, {
source: 'dateInput'
});
};
this.onDateTableSelect = function (value) {
var timePicker = _this2.props.timePicker;
var selectedValue = _this2.state.selectedValue;
if (!selectedValue && timePicker) {
var timePickerDefaultValue = timePicker.props.defaultValue;
if (timePickerDefaultValue) {
(0, _util.syncTime)(timePickerDefaultValue, value);
}
}
_this2.onSelect(value);
};
this.onToday = function () {
var value = _this2.state.value;
var now = (0, _util.getTodayTime)(value);
_this2.onSelect(now, {
source: 'todayButton'
});
};
this.getRootDOMNode = function () {
return _reactDom2['default'].findDOMNode(_this2);
};
this.openTimePicker = function () {
_this2.onPanelChange(null, 'time');
};
this.closeTimePicker = function () {
_this2.onPanelChange(null, 'date');
};
this.goTime = function (direction, unit) {
_this2.setValue((0, _toTime.goTime)(_this2.state.value, direction, unit));
};
};
exports['default'] = (0, _CalendarMixin.calendarMixinWrapper)((0, _CommonMixin.commonMixinWrapper)(Calendar));
module.exports = exports['default'];

70

lib/calendar/CalendarFooter.js

@@ -9,2 +9,14 @@ 'use strict';

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');

@@ -18,6 +30,2 @@

var _createReactClass = require('create-react-class');
var _createReactClass2 = _interopRequireDefault(_createReactClass);
var _propTypes = require('prop-types');

@@ -49,26 +57,19 @@

var CalendarFooter = (0, _createReactClass2['default'])({
displayName: 'CalendarFooter',
var CalendarFooter = function (_React$Component) {
(0, _inherits3['default'])(CalendarFooter, _React$Component);
propTypes: {
prefixCls: _propTypes2['default'].string,
showDateInput: _propTypes2['default'].bool,
disabledTime: _propTypes2['default'].any,
timePicker: _propTypes2['default'].element,
selectedValue: _propTypes2['default'].any,
showOk: _propTypes2['default'].bool,
onSelect: _propTypes2['default'].func,
value: _propTypes2['default'].object,
renderFooter: _propTypes2['default'].func,
defaultValue: _propTypes2['default'].object,
mode: _propTypes2['default'].string
},
function CalendarFooter() {
(0, _classCallCheck3['default'])(this, CalendarFooter);
return (0, _possibleConstructorReturn3['default'])(this, _React$Component.apply(this, arguments));
}
onSelect: function onSelect(value) {
CalendarFooter.prototype.onSelect = function onSelect(value) {
this.props.onSelect(value);
},
getRootDOMNode: function getRootDOMNode() {
};
CalendarFooter.prototype.getRootDOMNode = function getRootDOMNode() {
return _reactDom2['default'].findDOMNode(this);
},
render: function render() {
};
CalendarFooter.prototype.render = function render() {
var props = this.props;

@@ -83,3 +84,3 @@ var value = props.value,

var footerEl = null;
var extraFooter = renderFooter(mode);
var extraFooter = renderFooter && renderFooter(mode);
if (props.showToday || timePicker || extraFooter) {

@@ -118,6 +119,21 @@ var _cx;

return footerEl;
}
});
};
return CalendarFooter;
}(_react2['default'].Component);
CalendarFooter.propTypes = {
prefixCls: _propTypes2['default'].string,
showDateInput: _propTypes2['default'].bool,
disabledTime: _propTypes2['default'].any,
timePicker: _propTypes2['default'].element,
selectedValue: _propTypes2['default'].any,
showOk: _propTypes2['default'].bool,
onSelect: _propTypes2['default'].func,
value: _propTypes2['default'].object,
renderFooter: _propTypes2['default'].func,
defaultValue: _propTypes2['default'].object,
mode: _propTypes2['default'].string
};
exports['default'] = CalendarFooter;
module.exports = exports['default'];

267

lib/calendar/CalendarHeader.js

@@ -5,2 +5,14 @@ 'use strict';

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');

@@ -10,6 +22,2 @@

var _createReactClass = require('create-react-class');
var _createReactClass2 = _interopRequireDefault(_createReactClass);
var _propTypes = require('prop-types');

@@ -53,119 +61,22 @@

var CalendarHeader = (0, _createReactClass2['default'])({
displayName: 'CalendarHeader',
var CalendarHeader = function (_React$Component) {
(0, _inherits3['default'])(CalendarHeader, _React$Component);
propTypes: {
prefixCls: _propTypes2['default'].string,
value: _propTypes2['default'].object,
onValueChange: _propTypes2['default'].func,
showTimePicker: _propTypes2['default'].bool,
onPanelChange: _propTypes2['default'].func,
locale: _propTypes2['default'].object,
enablePrev: _propTypes2['default'].any,
enableNext: _propTypes2['default'].any,
disabledMonth: _propTypes2['default'].func,
renderFooter: _propTypes2['default'].func
},
function CalendarHeader(props) {
(0, _classCallCheck3['default'])(this, CalendarHeader);
getDefaultProps: function getDefaultProps() {
return {
enableNext: 1,
enablePrev: 1,
onPanelChange: function onPanelChange() {},
onValueChange: function onValueChange() {}
};
},
getInitialState: function getInitialState() {
this.nextMonth = goMonth.bind(this, 1);
this.previousMonth = goMonth.bind(this, -1);
this.nextYear = goYear.bind(this, 1);
this.previousYear = goYear.bind(this, -1);
return { yearPanelReferer: null };
},
onMonthSelect: function onMonthSelect(value) {
this.props.onPanelChange(value, 'date');
if (this.props.onMonthSelect) {
this.props.onMonthSelect(value);
} else {
this.props.onValueChange(value);
}
},
onYearSelect: function onYearSelect(value) {
var referer = this.state.yearPanelReferer;
this.setState({ yearPanelReferer: null });
this.props.onPanelChange(value, referer);
this.props.onValueChange(value);
},
onDecadeSelect: function onDecadeSelect(value) {
this.props.onPanelChange(value, 'year');
this.props.onValueChange(value);
},
monthYearElement: function monthYearElement(showTimePicker) {
var _this = this;
var _this = (0, _possibleConstructorReturn3['default'])(this, _React$Component.call(this, props));
var props = this.props;
var prefixCls = props.prefixCls;
var locale = props.locale;
var value = props.value;
var localeData = value.localeData();
var monthBeforeYear = locale.monthBeforeYear;
var selectClassName = prefixCls + '-' + (monthBeforeYear ? 'my-select' : 'ym-select');
var timeClassName = showTimePicker ? ' ' + prefixCls + '-time-status' : '';
var year = _react2['default'].createElement(
'a',
{
className: prefixCls + '-year-select' + timeClassName,
role: 'button',
onClick: showTimePicker ? null : function () {
return _this.showYearPanel('date');
},
title: showTimePicker ? null : locale.yearSelect
},
value.format(locale.yearFormat)
);
var month = _react2['default'].createElement(
'a',
{
className: prefixCls + '-month-select' + timeClassName,
role: 'button',
onClick: showTimePicker ? null : this.showMonthPanel,
title: showTimePicker ? null : locale.monthSelect
},
locale.monthFormat ? value.format(locale.monthFormat) : localeData.monthsShort(value)
);
var day = void 0;
if (showTimePicker) {
day = _react2['default'].createElement(
'a',
{
className: prefixCls + '-day-select' + timeClassName,
role: 'button'
},
value.format(locale.dayFormat)
);
}
var my = [];
if (monthBeforeYear) {
my = [month, day, year];
} else {
my = [year, month, day];
}
return _react2['default'].createElement(
'span',
{ className: selectClassName },
(0, _mapSelf2['default'])(my)
);
},
showMonthPanel: function showMonthPanel() {
// null means that users' interaction doesn't change value
this.props.onPanelChange(null, 'month');
},
showYearPanel: function showYearPanel(referer) {
this.setState({ yearPanelReferer: referer });
this.props.onPanelChange(null, 'year');
},
showDecadePanel: function showDecadePanel() {
this.props.onPanelChange(null, 'decade');
},
render: function render() {
_initialiseProps.call(_this);
_this.nextMonth = goMonth.bind(_this, 1);
_this.previousMonth = goMonth.bind(_this, -1);
_this.nextYear = goYear.bind(_this, 1);
_this.previousYear = goYear.bind(_this, -1);
_this.state = { yearPanelReferer: null };
return _this;
}
CalendarHeader.prototype.render = function render() {
var _this2 = this;

@@ -253,6 +164,122 @@

);
}
});
};
return CalendarHeader;
}(_react2['default'].Component);
CalendarHeader.propTypes = {
prefixCls: _propTypes2['default'].string,
value: _propTypes2['default'].object,
onValueChange: _propTypes2['default'].func,
showTimePicker: _propTypes2['default'].bool,
onPanelChange: _propTypes2['default'].func,
locale: _propTypes2['default'].object,
enablePrev: _propTypes2['default'].any,
enableNext: _propTypes2['default'].any,
disabledMonth: _propTypes2['default'].func,
renderFooter: _propTypes2['default'].func,
onMonthSelect: _propTypes2['default'].func
};
CalendarHeader.defaultProps = {
enableNext: 1,
enablePrev: 1,
onPanelChange: function onPanelChange() {},
onValueChange: function onValueChange() {}
};
var _initialiseProps = function _initialiseProps() {
var _this3 = this;
this.onMonthSelect = function (value) {
_this3.props.onPanelChange(value, 'date');
if (_this3.props.onMonthSelect) {
_this3.props.onMonthSelect(value);
} else {
_this3.props.onValueChange(value);
}
};
this.onYearSelect = function (value) {
var referer = _this3.state.yearPanelReferer;
_this3.setState({ yearPanelReferer: null });
_this3.props.onPanelChange(value, referer);
_this3.props.onValueChange(value);
};
this.onDecadeSelect = function (value) {
_this3.props.onPanelChange(value, 'year');
_this3.props.onValueChange(value);
};
this.monthYearElement = function (showTimePicker) {
var props = _this3.props;
var prefixCls = props.prefixCls;
var locale = props.locale;
var value = props.value;
var localeData = value.localeData();
var monthBeforeYear = locale.monthBeforeYear;
var selectClassName = prefixCls + '-' + (monthBeforeYear ? 'my-select' : 'ym-select');
var timeClassName = showTimePicker ? ' ' + prefixCls + '-time-status' : '';
var year = _react2['default'].createElement(
'a',
{
className: prefixCls + '-year-select' + timeClassName,
role: 'button',
onClick: showTimePicker ? null : function () {
return _this3.showYearPanel('date');
},
title: showTimePicker ? null : locale.yearSelect
},
value.format(locale.yearFormat)
);
var month = _react2['default'].createElement(
'a',
{
className: prefixCls + '-month-select' + timeClassName,
role: 'button',
onClick: showTimePicker ? null : _this3.showMonthPanel,
title: showTimePicker ? null : locale.monthSelect
},
locale.monthFormat ? value.format(locale.monthFormat) : localeData.monthsShort(value)
);
var day = void 0;
if (showTimePicker) {
day = _react2['default'].createElement(
'a',
{
className: prefixCls + '-day-select' + timeClassName,
role: 'button'
},
value.format(locale.dayFormat)
);
}
var my = [];
if (monthBeforeYear) {
my = [month, day, year];
} else {
my = [year, month, day];
}
return _react2['default'].createElement(
'span',
{ className: selectClassName },
(0, _mapSelf2['default'])(my)
);
};
this.showMonthPanel = function () {
// null means that users' interaction doesn't change value
_this3.props.onPanelChange(null, 'month');
};
this.showYearPanel = function (referer) {
_this3.setState({ yearPanelReferer: referer });
_this3.props.onPanelChange(null, 'year');
};
this.showDecadePanel = function () {
_this3.props.onPanelChange(null, 'decade');
};
};
exports['default'] = CalendarHeader;
module.exports = exports['default'];

262

lib/date/DateInput.js

@@ -5,2 +5,14 @@ 'use strict';

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');

@@ -14,6 +26,2 @@

var _createReactClass = require('create-react-class');
var _createReactClass2 = _interopRequireDefault(_createReactClass);
var _propTypes = require('prop-types');

@@ -31,49 +39,127 @@

var DateInput = (0, _createReactClass2['default'])({
displayName: 'DateInput',
var cachedSelectionStart = void 0;
var cachedSelectionEnd = void 0;
var dateInputInstance = void 0;
propTypes: {
prefixCls: _propTypes2['default'].string,
timePicker: _propTypes2['default'].object,
value: _propTypes2['default'].object,
disabledTime: _propTypes2['default'].any,
format: _propTypes2['default'].oneOfType([_propTypes2['default'].string, _propTypes2['default'].arrayOf(_propTypes2['default'].string)]),
locale: _propTypes2['default'].object,
disabledDate: _propTypes2['default'].func,
onChange: _propTypes2['default'].func,
onClear: _propTypes2['default'].func,
placeholder: _propTypes2['default'].string,
onSelect: _propTypes2['default'].func,
selectedValue: _propTypes2['default'].object,
clearIcon: _propTypes2['default'].node
},
var DateInput = function (_React$Component) {
(0, _inherits3['default'])(DateInput, _React$Component);
getInitialState: function getInitialState() {
var selectedValue = this.props.selectedValue;
return {
str: (0, _util.formatDate)(selectedValue, this.props.format),
function DateInput(props) {
(0, _classCallCheck3['default'])(this, DateInput);
var _this = (0, _possibleConstructorReturn3['default'])(this, _React$Component.call(this, props));
_initialiseProps.call(_this);
var selectedValue = props.selectedValue;
_this.state = {
str: (0, _util.formatDate)(selectedValue, _this.props.format),
invalid: false,
hasFocus: false
};
},
componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
this.cachedSelectionStart = this.dateInputInstance.selectionStart;
this.cachedSelectionEnd = this.dateInputInstance.selectionEnd;
return _this;
}
DateInput.prototype.componentDidUpdate = function componentDidUpdate() {
if (this.state.hasFocus && !this.state.invalid && !(cachedSelectionStart === 0 && cachedSelectionEnd === 0)) {
dateInputInstance.setSelectionRange(cachedSelectionStart, cachedSelectionEnd);
}
};
DateInput.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, state) {
var newState = {};
if (dateInputInstance) {
cachedSelectionStart = dateInputInstance.selectionStart;
cachedSelectionEnd = dateInputInstance.selectionEnd;
}
// when popup show, click body will call this, bug!
var selectedValue = nextProps.selectedValue;
if (!this.state.hasFocus) {
this.setState({
if (!state.hasFocus) {
newState = {
str: (0, _util.formatDate)(selectedValue, nextProps.format),
invalid: false
});
};
}
},
componentDidUpdate: function componentDidUpdate() {
if (this.state.hasFocus && !this.state.invalid && !(this.cachedSelectionStart === 0 && this.cachedSelectionEnd === 0)) {
this.dateInputInstance.setSelectionRange(this.cachedSelectionStart, this.cachedSelectionEnd);
}
},
onInputChange: function onInputChange(event) {
return newState;
};
DateInput.getInstance = function getInstance() {
return dateInputInstance;
};
DateInput.prototype.render = function render() {
var props = this.props;
var _state = this.state,
invalid = _state.invalid,
str = _state.str;
var locale = props.locale,
prefixCls = props.prefixCls,
placeholder = props.placeholder,
clearIcon = props.clearIcon;
var invalidClass = invalid ? prefixCls + '-input-invalid' : '';
return _react2['default'].createElement(
'div',
{ className: prefixCls + '-input-wrap' },
_react2['default'].createElement(
'div',
{ className: prefixCls + '-date-input-wrap' },
_react2['default'].createElement('input', {
ref: this.saveDateInput,
className: prefixCls + '-input ' + invalidClass,
value: str,
disabled: props.disabled,
placeholder: placeholder,
onChange: this.onInputChange,
onFocus: this.onFocus,
onBlur: this.onBlur
})
),
props.showClear ? _react2['default'].createElement(
'a',
{
role: 'button',
title: locale.clear,
onClick: this.onClear
},
clearIcon || _react2['default'].createElement('span', { className: prefixCls + '-clear-btn' })
) : null
);
};
return DateInput;
}(_react2['default'].Component);
DateInput.propTypes = {
prefixCls: _propTypes2['default'].string,
timePicker: _propTypes2['default'].object,
value: _propTypes2['default'].object,
disabledTime: _propTypes2['default'].any,
format: _propTypes2['default'].oneOfType([_propTypes2['default'].string, _propTypes2['default'].arrayOf(_propTypes2['default'].string)]),
locale: _propTypes2['default'].object,
disabledDate: _propTypes2['default'].func,
onChange: _propTypes2['default'].func,
onClear: _propTypes2['default'].func,
placeholder: _propTypes2['default'].string,
onSelect: _propTypes2['default'].func,
selectedValue: _propTypes2['default'].object,
clearIcon: _propTypes2['default'].node
};
var _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.onClear = function () {
_this2.setState({
str: ''
});
_this2.props.onClear(null);
};
this.onInputChange = function (event) {
var str = event.target.value;
var _props = this.props,
var _props = _this2.props,
disabledDate = _props.disabledDate,

@@ -88,3 +174,3 @@ format = _props.format,

onChange(null);
this.setState({
_this2.setState({
invalid: false,

@@ -99,3 +185,3 @@ str: str

if (!parsed.isValid()) {
this.setState({
_this2.setState({
invalid: true,

@@ -107,7 +193,7 @@ str: str

var value = this.props.value.clone();
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());
if (!value || disabledDate && disabledDate(value)) {
this.setState({
_this2.setState({
invalid: true,

@@ -120,3 +206,3 @@ str: str

if (selectedValue !== value || selectedValue && value && !selectedValue.isSame(value)) {
this.setState({
_this2.setState({
str: str

@@ -126,25 +212,10 @@ });

}
},
onClear: function onClear() {
this.setState({
str: ''
});
this.props.onClear(null);
},
getRootDOMNode: function getRootDOMNode() {
return _reactDom2['default'].findDOMNode(this);
},
focus: function focus() {
if (this.dateInputInstance) {
this.dateInputInstance.focus();
}
},
saveDateInput: function saveDateInput(dateInput) {
this.dateInputInstance = dateInput;
},
onFocus: function onFocus() {
this.setState({ hasFocus: true });
},
onBlur: function onBlur() {
this.setState(function (prevState, prevProps) {
};
this.onFocus = function () {
_this2.setState({ hasFocus: true });
};
this.onBlur = function () {
_this2.setState(function (prevState, prevProps) {
return {

@@ -155,45 +226,20 @@ hasFocus: false,

});
},
render: function render() {
var props = this.props;
var _state = this.state,
invalid = _state.invalid,
str = _state.str;
var locale = props.locale,
prefixCls = props.prefixCls,
placeholder = props.placeholder,
clearIcon = props.clearIcon;
};
var invalidClass = invalid ? prefixCls + '-input-invalid' : '';
return _react2['default'].createElement(
'div',
{ className: prefixCls + '-input-wrap' },
_react2['default'].createElement(
'div',
{ className: prefixCls + '-date-input-wrap' },
_react2['default'].createElement('input', {
ref: this.saveDateInput,
className: prefixCls + '-input ' + invalidClass,
value: str,
disabled: props.disabled,
placeholder: placeholder,
onChange: this.onInputChange,
onFocus: this.onFocus,
onBlur: this.onBlur
})
),
props.showClear ? _react2['default'].createElement(
'a',
{
role: 'button',
title: locale.clear,
onClick: this.onClear
},
clearIcon || _react2['default'].createElement('span', { className: prefixCls + '-clear-btn' })
) : null
);
}
});
this.getRootDOMNode = function () {
return _reactDom2['default'].findDOMNode(_this2);
};
this.focus = function () {
if (dateInputInstance) {
dateInputInstance.focus();
}
};
this.saveDateInput = function (dateInput) {
dateInputInstance = dateInput;
};
};
exports['default'] = DateInput;
module.exports = exports['default'];

60

lib/date/DateTBody.js

@@ -5,2 +5,14 @@ 'use strict';

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');

@@ -10,6 +22,2 @@

var _createReactClass = require('create-react-class');
var _createReactClass2 = _interopRequireDefault(_createReactClass);
var _propTypes = require('prop-types');

@@ -53,22 +61,11 @@

var DateTBody = (0, _createReactClass2['default'])({
displayName: 'DateTBody',
var DateTBody = function (_React$Component) {
(0, _inherits3['default'])(DateTBody, _React$Component);
propTypes: {
contentRender: _propTypes2['default'].func,
dateRender: _propTypes2['default'].func,
disabledDate: _propTypes2['default'].func,
prefixCls: _propTypes2['default'].string,
selectedValue: _propTypes2['default'].oneOfType([_propTypes2['default'].object, _propTypes2['default'].arrayOf(_propTypes2['default'].object)]),
value: _propTypes2['default'].object,
hoverValue: _propTypes2['default'].any,
showWeekNumber: _propTypes2['default'].bool
},
function DateTBody() {
(0, _classCallCheck3['default'])(this, DateTBody);
return (0, _possibleConstructorReturn3['default'])(this, _React$Component.apply(this, arguments));
}
getDefaultProps: function getDefaultProps() {
return {
hoverValue: []
};
},
render: function render() {
DateTBody.prototype.render = function render() {
var props = this.props;

@@ -282,6 +279,21 @@ var contentRender = props.contentRender,

);
}
});
};
return DateTBody;
}(_react2['default'].Component);
DateTBody.propTypes = {
contentRender: _propTypes2['default'].func,
dateRender: _propTypes2['default'].func,
disabledDate: _propTypes2['default'].func,
prefixCls: _propTypes2['default'].string,
selectedValue: _propTypes2['default'].oneOfType([_propTypes2['default'].object, _propTypes2['default'].arrayOf(_propTypes2['default'].object)]),
value: _propTypes2['default'].object,
hoverValue: _propTypes2['default'].any,
showWeekNumber: _propTypes2['default'].bool
};
DateTBody.defaultProps = {
hoverValue: []
};
exports['default'] = DateTBody;
module.exports = exports['default'];

169

lib/FullCalendar.js

@@ -9,2 +9,14 @@ 'use strict';

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');

@@ -14,6 +26,2 @@

var _createReactClass = require('create-react-class');
var _createReactClass2 = _interopRequireDefault(_createReactClass);
var _propTypes = require('prop-types');

@@ -33,8 +41,4 @@

var _CalendarMixin2 = _interopRequireDefault(_CalendarMixin);
var _CommonMixin = require('./mixin/CommonMixin');
var _CommonMixin2 = _interopRequireDefault(_CommonMixin);
var _CalendarHeader = require('./full-calendar/CalendarHeader');

@@ -44,66 +48,55 @@

var _moment = require('moment');
var _moment2 = _interopRequireDefault(_moment);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var FullCalendar = (0, _createReactClass2['default'])({
displayName: 'FullCalendar',
var FullCalendar = function (_React$Component) {
(0, _inherits3['default'])(FullCalendar, _React$Component);
propTypes: {
defaultType: _propTypes2['default'].string,
type: _propTypes2['default'].string,
prefixCls: _propTypes2['default'].string,
locale: _propTypes2['default'].object,
onTypeChange: _propTypes2['default'].func,
fullscreen: _propTypes2['default'].bool,
monthCellRender: _propTypes2['default'].func,
dateCellRender: _propTypes2['default'].func,
showTypeSwitch: _propTypes2['default'].bool,
Select: _propTypes2['default'].func.isRequired,
headerComponents: _propTypes2['default'].array,
headerComponent: _propTypes2['default'].object, // The whole header component
headerRender: _propTypes2['default'].func,
showHeader: _propTypes2['default'].bool,
disabledDate: _propTypes2['default'].func
},
mixins: [_CommonMixin2['default'], _CalendarMixin2['default']],
getDefaultProps: function getDefaultProps() {
return {
defaultType: 'date',
fullscreen: false,
showTypeSwitch: true,
showHeader: true,
onTypeChange: function onTypeChange() {}
};
},
getInitialState: function getInitialState() {
function FullCalendar(props) {
(0, _classCallCheck3['default'])(this, FullCalendar);
var _this = (0, _possibleConstructorReturn3['default'])(this, _React$Component.call(this, props));
_initialiseProps.call(_this);
var type = void 0;
if ('type' in this.props) {
type = this.props.type;
if ('type' in props) {
type = props.type;
} else {
type = this.props.defaultType;
type = props.defaultType;
}
return {
type: type
_this.state = {
type: type,
value: props.value || props.defaultValue || (0, _moment2['default'])(),
selectedValue: props.selectedValue || props.defaultSelectedValue
};
},
componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
return _this;
}
FullCalendar.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, state) {
var newState = {};
var value = nextProps.value,
selectedValue = nextProps.selectedValue;
if ('type' in nextProps) {
this.setState({
newState = {
type: nextProps.type
});
};
}
},
onMonthSelect: function onMonthSelect(value) {
this.onSelect(value, {
target: 'month'
});
},
setType: function setType(type) {
if (!('type' in this.props)) {
this.setState({
type: type
});
if ('value' in nextProps) {
newState.value = value || nextProps.defaultValue || (0, _CalendarMixin.getNowByCurrentStateValue)(state.value);
}
this.props.onTypeChange(type);
},
render: function render() {
if ('selectedValue' in nextProps) {
newState.selectedValue = selectedValue;
}
return newState;
};
FullCalendar.prototype.render = function render() {
var props = this.props;

@@ -174,6 +167,56 @@ var locale = props.locale,

});
}
};
return FullCalendar;
}(_react2['default'].Component);
FullCalendar.propTypes = (0, _extends3['default'])({}, _CalendarMixin.calendarMixinPropTypes, _CommonMixin.propType, {
defaultType: _propTypes2['default'].string,
type: _propTypes2['default'].string,
prefixCls: _propTypes2['default'].string,
locale: _propTypes2['default'].object,
onTypeChange: _propTypes2['default'].func,
fullscreen: _propTypes2['default'].bool,
monthCellRender: _propTypes2['default'].func,
dateCellRender: _propTypes2['default'].func,
showTypeSwitch: _propTypes2['default'].bool,
Select: _propTypes2['default'].func.isRequired,
headerComponents: _propTypes2['default'].array,
headerComponent: _propTypes2['default'].object, // The whole header component
headerRender: _propTypes2['default'].func,
showHeader: _propTypes2['default'].bool,
disabledDate: _propTypes2['default'].func,
value: _propTypes2['default'].object,
defaultValue: _propTypes2['default'].object,
selectedValue: _propTypes2['default'].object,
defaultSelectedValue: _propTypes2['default'].object
});
FullCalendar.defaultProps = (0, _extends3['default'])({}, _CalendarMixin.calendarMixinDefaultProps, _CommonMixin.defaultProp, {
defaultType: 'date',
fullscreen: false,
showTypeSwitch: true,
showHeader: true,
onTypeChange: function onTypeChange() {}
});
exports['default'] = FullCalendar;
var _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.onMonthSelect = function (value) {
_this2.onSelect(value, {
target: 'month'
});
};
this.setType = function (type) {
if (!('type' in _this2.props)) {
_this2.setState({
type: type
});
}
_this2.props.onTypeChange(type);
};
};
exports['default'] = (0, _CalendarMixin.calendarMixinWrapper)((0, _CommonMixin.commonMixinWrapper)(FullCalendar));
module.exports = exports['default'];

4

lib/index.js

@@ -9,5 +9,9 @@ 'use strict';

var _reactLifecyclesCompat = require('react-lifecycles-compat');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
(0, _reactLifecyclesCompat.polyfill)(_Calendar2['default']);
exports['default'] = _Calendar2['default'];
module.exports = exports['default'];

179

lib/mixin/CalendarMixin.js
'use strict';
exports.__esModule = true;
exports.calendarMixinWrapper = exports.calendarMixinDefaultProps = exports.calendarMixinPropTypes = undefined;
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
exports.getNowByCurrentStateValue = getNowByCurrentStateValue;
var _react = require('react');

@@ -27,6 +42,2 @@

function getNow() {
return (0, _moment2['default'])();
}
function getNowByCurrentStateValue(value) {

@@ -37,3 +48,3 @@ var ret = void 0;

} else {
ret = getNow();
ret = (0, _moment2['default'])();
}

@@ -43,93 +54,81 @@ return ret;

var CalendarMixin = {
propTypes: {
value: _propTypes2['default'].object,
defaultValue: _propTypes2['default'].object,
onKeyDown: _propTypes2['default'].func
},
var calendarMixinPropTypes = exports.calendarMixinPropTypes = {
value: _propTypes2['default'].object,
defaultValue: _propTypes2['default'].object,
onKeyDown: _propTypes2['default'].func
};
getDefaultProps: function getDefaultProps() {
return {
onKeyDown: noop
};
},
getInitialState: function getInitialState() {
var props = this.props;
var value = props.value || props.defaultValue || getNow();
return {
value: value,
selectedValue: props.selectedValue || props.defaultSelectedValue
};
},
componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
var value = nextProps.value;
var selectedValue = nextProps.selectedValue;
var calendarMixinDefaultProps = exports.calendarMixinDefaultProps = {
onKeyDown: noop
};
if ('value' in nextProps) {
value = value || nextProps.defaultValue || getNowByCurrentStateValue(this.state.value);
this.setState({
value: value
});
}
if ('selectedValue' in nextProps) {
this.setState({
selectedValue: selectedValue
});
}
},
onSelect: function onSelect(value, cause) {
if (value) {
this.setValue(value);
}
this.setSelectedValue(value, cause);
},
renderRoot: function renderRoot(newProps) {
var _className;
var calendarMixinWrapper = exports.calendarMixinWrapper = function calendarMixinWrapper(ComposeComponent) {
var _class, _temp2;
var props = this.props;
var prefixCls = props.prefixCls;
return _temp2 = _class = function (_ComposeComponent) {
(0, _inherits3['default'])(_class, _ComposeComponent);
var className = (_className = {}, _className[prefixCls] = 1, _className[prefixCls + '-hidden'] = !props.visible, _className[props.className] = !!props.className, _className[newProps.className] = !!newProps.className, _className);
function _class() {
var _temp, _this, _ret;
return _react2['default'].createElement(
'div',
{
ref: this.saveRoot,
className: '' + (0, _classnames2['default'])(className),
style: this.props.style,
tabIndex: '0',
onKeyDown: this.onKeyDown
},
newProps.children
);
},
setSelectedValue: function setSelectedValue(selectedValue, cause) {
// if (this.isAllowedDate(selectedValue)) {
if (!('selectedValue' in this.props)) {
this.setState({
selectedValue: selectedValue
});
(0, _classCallCheck3['default'])(this, _class);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3['default'])(this, _ComposeComponent.call.apply(_ComposeComponent, [this].concat(args))), _this), _this.onSelect = function (value, cause) {
if (value) {
_this.setValue(value);
}
_this.setSelectedValue(value, cause);
}, _this.renderRoot = function (newProps) {
var _className;
var props = _this.props;
var prefixCls = props.prefixCls;
var className = (_className = {}, _className[prefixCls] = 1, _className[prefixCls + '-hidden'] = !props.visible, _className[props.className] = !!props.className, _className[newProps.className] = !!newProps.className, _className);
return _react2['default'].createElement(
'div',
{
ref: _this.saveRoot,
className: '' + (0, _classnames2['default'])(className),
style: _this.props.style,
tabIndex: '0',
onKeyDown: _this.onKeyDown
},
newProps.children
);
}, _this.setSelectedValue = function (selectedValue, cause) {
// if (this.isAllowedDate(selectedValue)) {
if (!('selectedValue' in _this.props)) {
_this.setState({
selectedValue: selectedValue
});
}
if (_this.props.onSelect) {
_this.props.onSelect(selectedValue, cause);
}
// }
}, _this.setValue = function (value) {
var originalValue = _this.state.value;
if (!('value' in _this.props)) {
_this.setState({
value: value
});
}
if (originalValue && value && !originalValue.isSame(value) || !originalValue && value || originalValue && !value) {
_this.props.onChange(value);
}
}, _this.isAllowedDate = function (value) {
var disabledDate = _this.props.disabledDate;
var disabledTime = _this.props.disabledTime;
return (0, _index.isAllowedDate)(value, disabledDate, disabledTime);
}, _temp), (0, _possibleConstructorReturn3['default'])(_this, _ret);
}
this.props.onSelect(selectedValue, cause);
// }
},
setValue: function setValue(value) {
var originalValue = this.state.value;
if (!('value' in this.props)) {
this.setState({
value: value
});
}
if (originalValue && value && !originalValue.isSame(value) || !originalValue && value || originalValue && !value) {
this.props.onChange(value);
}
},
isAllowedDate: function isAllowedDate(value) {
var disabledDate = this.props.disabledDate;
var disabledTime = this.props.disabledTime;
return (0, _index.isAllowedDate)(value, disabledDate, disabledTime);
}
};
exports['default'] = CalendarMixin;
module.exports = exports['default'];
return _class;
}(ComposeComponent), _class.displayName = 'CalendarMixinWrapper', _temp2;
};

138

lib/mixin/CommonMixin.js
'use strict';
exports.__esModule = true;
exports.commonMixinWrapper = exports.defaultProp = exports.propType = undefined;
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _propTypes = require('prop-types');

@@ -17,59 +30,78 @@

exports['default'] = {
propTypes: {
className: _propTypes2['default'].string,
locale: _propTypes2['default'].object,
style: _propTypes2['default'].object,
visible: _propTypes2['default'].bool,
onSelect: _propTypes2['default'].func,
prefixCls: _propTypes2['default'].string,
onChange: _propTypes2['default'].func,
onOk: _propTypes2['default'].func
var propType = exports.propType = {
className: _propTypes2['default'].string,
locale: _propTypes2['default'].object,
style: _propTypes2['default'].object,
visible: _propTypes2['default'].bool,
onSelect: _propTypes2['default'].func,
prefixCls: _propTypes2['default'].string,
onChange: _propTypes2['default'].func,
onOk: _propTypes2['default'].func
};
var defaultProp = exports.defaultProp = {
locale: _en_US2['default'],
style: {},
visible: true,
prefixCls: 'rc-calendar',
className: '',
onSelect: noop,
onChange: noop,
onClear: noop,
renderFooter: function renderFooter() {
return null;
},
renderSidebar: function renderSidebar() {
return null;
}
};
getDefaultProps: function getDefaultProps() {
return {
locale: _en_US2['default'],
style: {},
visible: true,
prefixCls: 'rc-calendar',
className: '',
onSelect: noop,
onChange: noop,
onClear: noop,
renderFooter: function renderFooter() {
return null;
},
renderSidebar: function renderSidebar() {
return null;
var commonMixinWrapper = exports.commonMixinWrapper = function commonMixinWrapper(ComposeComponent) {
var _class, _temp2;
return _temp2 = _class = function (_ComposeComponent) {
(0, _inherits3['default'])(_class, _ComposeComponent);
function _class() {
var _temp, _this, _ret;
(0, _classCallCheck3['default'])(this, _class);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3['default'])(this, _ComposeComponent.call.apply(_ComposeComponent, [this].concat(args))), _this), _this.getFormat = function () {
var format = _this.props.format;
var _this$props = _this.props,
locale = _this$props.locale,
timePicker = _this$props.timePicker;
if (!format) {
if (timePicker) {
format = locale.dateTimeFormat;
} else {
format = locale.dateFormat;
}
}
return format;
}, _this.focus = function () {
if (_this.focusElement) {
_this.focusElement.focus();
} else if (_this.rootInstance) {
_this.rootInstance.focus();
}
}, _this.saveFocusElement = function (focusElement) {
_this.focusElement = focusElement;
}, _this.saveRoot = function (root) {
_this.rootInstance = root;
}, _temp), (0, _possibleConstructorReturn3['default'])(_this, _ret);
}
_class.prototype.shouldComponentUpdate = function shouldComponentUpdate(nextProps) {
return this.props.visible || nextProps.visible;
};
},
shouldComponentUpdate: function shouldComponentUpdate(nextProps) {
return this.props.visible || nextProps.visible;
},
getFormat: function getFormat() {
var format = this.props.format;
var _props = this.props,
locale = _props.locale,
timePicker = _props.timePicker;
if (!format) {
if (timePicker) {
format = locale.dateTimeFormat;
} else {
format = locale.dateFormat;
}
}
return format;
},
focus: function focus() {
if (this.rootInstance) {
this.rootInstance.focus();
}
},
saveRoot: function saveRoot(root) {
this.rootInstance = root;
}
};
module.exports = exports['default'];
return _class;
}(ComposeComponent), _class.displayName = 'CommonMixinWrapper', _temp2;
};

117

lib/month/MonthPanel.js

@@ -5,2 +5,14 @@ 'use strict';

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');

@@ -10,6 +22,2 @@

var _createReactClass = require('create-react-class');
var _createReactClass2 = _interopRequireDefault(_createReactClass);
var _propTypes = require('prop-types');

@@ -33,51 +41,51 @@

var MonthPanel = (0, _createReactClass2['default'])({
displayName: 'MonthPanel',
var MonthPanel = function (_React$Component) {
(0, _inherits3['default'])(MonthPanel, _React$Component);
propTypes: {
onChange: _propTypes2['default'].func,
disabledDate: _propTypes2['default'].func,
onSelect: _propTypes2['default'].func,
renderFooter: _propTypes2['default'].func
},
function MonthPanel(props) {
(0, _classCallCheck3['default'])(this, MonthPanel);
getDefaultProps: function getDefaultProps() {
return {
onChange: noop,
onSelect: noop
var _this = (0, _possibleConstructorReturn3['default'])(this, _React$Component.call(this, props));
_this.setAndChangeValue = function (value) {
_this.setValue(value);
_this.props.onChange(value);
};
},
getInitialState: function getInitialState() {
var props = this.props;
// bind methods
this.nextYear = goYear.bind(this, 1);
this.previousYear = goYear.bind(this, -1);
this.prefixCls = props.rootPrefixCls + '-month-panel';
return {
_this.setAndSelectValue = function (value) {
_this.setValue(value);
_this.props.onSelect(value);
};
_this.setValue = function (value) {
if (!('value' in _this.props)) {
_this.setState({
value: value
});
}
};
_this.nextYear = goYear.bind(_this, 1);
_this.previousYear = goYear.bind(_this, -1);
_this.prefixCls = props.rootPrefixCls + '-month-panel';
_this.state = {
value: props.value || props.defaultValue
};
},
componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
return _this;
}
MonthPanel.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps) {
var newState = {};
if ('value' in nextProps) {
this.setState({
newState = {
value: nextProps.value
});
};
}
},
setAndChangeValue: function setAndChangeValue(value) {
this.setValue(value);
this.props.onChange(value);
},
setAndSelectValue: function setAndSelectValue(value) {
this.setValue(value);
this.props.onSelect(value);
},
setValue: function setValue(value) {
if (!('value' in this.props)) {
this.setState({
value: value
});
}
},
render: function render() {
return newState;
};
MonthPanel.prototype.render = function render() {
var props = this.props;

@@ -156,6 +164,21 @@ var value = this.state.value;

);
}
});
};
return MonthPanel;
}(_react2['default'].Component);
MonthPanel.propTypes = {
onChange: _propTypes2['default'].func,
disabledDate: _propTypes2['default'].func,
onSelect: _propTypes2['default'].func,
renderFooter: _propTypes2['default'].func,
rootPrefixCls: _propTypes2['default'].string,
value: _propTypes2['default'].object,
defaultValue: _propTypes2['default'].object
};
MonthPanel.defaultProps = {
onChange: noop,
onSelect: noop
};
exports['default'] = MonthPanel;
module.exports = exports['default'];

170

lib/MonthCalendar.js

@@ -5,2 +5,18 @@ 'use strict';

var _extends2 = require('babel-runtime/helpers/extends');
var _extends3 = _interopRequireDefault(_extends2);
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');

@@ -10,6 +26,2 @@

var _createReactClass = require('create-react-class');
var _createReactClass2 = _interopRequireDefault(_createReactClass);
var _propTypes = require('prop-types');

@@ -33,75 +45,81 @@

var _CalendarMixin2 = _interopRequireDefault(_CalendarMixin);
var _CommonMixin = require('./mixin/CommonMixin');
var _CommonMixin2 = _interopRequireDefault(_CommonMixin);
var _moment = require('moment');
var _moment2 = _interopRequireDefault(_moment);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var MonthCalendar = (0, _createReactClass2['default'])({
displayName: 'MonthCalendar',
var MonthCalendar = function (_React$Component) {
(0, _inherits3['default'])(MonthCalendar, _React$Component);
propTypes: {
monthCellRender: _propTypes2['default'].func,
dateCellRender: _propTypes2['default'].func
},
mixins: [_CommonMixin2['default'], _CalendarMixin2['default']],
function MonthCalendar(props) {
(0, _classCallCheck3['default'])(this, MonthCalendar);
getInitialState: function getInitialState() {
return { mode: 'month' };
},
onKeyDown: function onKeyDown(event) {
var keyCode = event.keyCode;
var ctrlKey = event.ctrlKey || event.metaKey;
var stateValue = this.state.value;
var disabledDate = this.props.disabledDate;
var _this = (0, _possibleConstructorReturn3['default'])(this, _React$Component.call(this, props));
var value = stateValue;
switch (keyCode) {
case _KeyCode2['default'].DOWN:
value = stateValue.clone();
value.add(3, 'months');
break;
case _KeyCode2['default'].UP:
value = stateValue.clone();
value.add(-3, 'months');
break;
case _KeyCode2['default'].LEFT:
value = stateValue.clone();
if (ctrlKey) {
value.add(-1, 'years');
} else {
value.add(-1, 'months');
}
break;
case _KeyCode2['default'].RIGHT:
value = stateValue.clone();
if (ctrlKey) {
value.add(1, 'years');
} else {
value.add(1, 'months');
}
break;
case _KeyCode2['default'].ENTER:
if (!disabledDate || !disabledDate(stateValue)) {
this.onSelect(stateValue);
}
_this.onKeyDown = function (event) {
var keyCode = event.keyCode;
var ctrlKey = event.ctrlKey || event.metaKey;
var stateValue = _this.state.value;
var disabledDate = _this.props.disabledDate;
var value = stateValue;
switch (keyCode) {
case _KeyCode2['default'].DOWN:
value = stateValue.clone();
value.add(3, 'months');
break;
case _KeyCode2['default'].UP:
value = stateValue.clone();
value.add(-3, 'months');
break;
case _KeyCode2['default'].LEFT:
value = stateValue.clone();
if (ctrlKey) {
value.add(-1, 'years');
} else {
value.add(-1, 'months');
}
break;
case _KeyCode2['default'].RIGHT:
value = stateValue.clone();
if (ctrlKey) {
value.add(1, 'years');
} else {
value.add(1, 'months');
}
break;
case _KeyCode2['default'].ENTER:
if (!disabledDate || !disabledDate(stateValue)) {
_this.onSelect(stateValue);
}
event.preventDefault();
return 1;
default:
return undefined;
}
if (value !== stateValue) {
_this.setValue(value);
event.preventDefault();
return 1;
default:
return undefined;
}
if (value !== stateValue) {
this.setValue(value);
event.preventDefault();
return 1;
}
},
handlePanelChange: function handlePanelChange(_, mode) {
if (mode !== 'date') {
this.setState({ mode: mode });
}
},
render: function render() {
}
};
_this.handlePanelChange = function (_, mode) {
if (mode !== 'date') {
_this.setState({ mode: mode });
}
};
_this.state = {
mode: 'month',
value: props.value || props.defaultValue || (0, _moment2['default'])(),
selectedValue: props.selectedValue || props.defaultSelectedValue
};
return _this;
}
MonthCalendar.prototype.render = function render() {
var props = this.props,

@@ -140,6 +158,18 @@ state = this.state;

});
}
};
return MonthCalendar;
}(_react2['default'].Component);
MonthCalendar.propTypes = (0, _extends3['default'])({}, _CalendarMixin.calendarMixinPropTypes, _CommonMixin.propType, {
monthCellRender: _propTypes2['default'].func,
dateCellRender: _propTypes2['default'].func,
value: _propTypes2['default'].object,
defaultValue: _propTypes2['default'].object,
selectedValue: _propTypes2['default'].object,
defaultSelectedValue: _propTypes2['default'].object,
disabledDate: _propTypes2['default'].object
});
exports['default'] = MonthCalendar;
MonthCalendar.defaultProps = (0, _extends3['default'])({}, _CommonMixin.defaultProp, _CalendarMixin.calendarMixinDefaultProps);
exports['default'] = (0, _CalendarMixin.calendarMixinWrapper)((0, _CommonMixin.commonMixinWrapper)(MonthCalendar));
module.exports = exports['default'];

313

lib/Picker.js

@@ -5,2 +5,14 @@ 'use strict';

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');

@@ -14,6 +26,2 @@

var _createReactClass = require('create-react-class');
var _createReactClass2 = _interopRequireDefault(_createReactClass);
var _propTypes = require('prop-types');

@@ -47,37 +55,12 @@

var Picker = (0, _createReactClass2['default'])({
displayName: 'Picker',
var Picker = function (_React$Component) {
(0, _inherits3['default'])(Picker, _React$Component);
propTypes: {
animation: _propTypes2['default'].oneOfType([_propTypes2['default'].func, _propTypes2['default'].string]),
disabled: _propTypes2['default'].bool,
transitionName: _propTypes2['default'].string,
onChange: _propTypes2['default'].func,
onOpenChange: _propTypes2['default'].func,
children: _propTypes2['default'].func,
getCalendarContainer: _propTypes2['default'].func,
calendar: _propTypes2['default'].element,
style: _propTypes2['default'].object,
open: _propTypes2['default'].bool,
defaultOpen: _propTypes2['default'].bool,
prefixCls: _propTypes2['default'].string,
placement: _propTypes2['default'].any,
value: _propTypes2['default'].oneOfType([_propTypes2['default'].object, _propTypes2['default'].array]),
defaultValue: _propTypes2['default'].oneOfType([_propTypes2['default'].object, _propTypes2['default'].array]),
align: _propTypes2['default'].object
},
function Picker(props) {
(0, _classCallCheck3['default'])(this, Picker);
getDefaultProps: function getDefaultProps() {
return {
prefixCls: 'rc-calendar-picker',
style: {},
align: {},
placement: 'bottomLeft',
defaultOpen: false,
onChange: noop,
onOpenChange: noop
};
},
getInitialState: function getInitialState() {
var props = this.props;
var _this = (0, _possibleConstructorReturn3['default'])(this, _React$Component.call(this, props));
_initialiseProps.call(_this);
var open = void 0;

@@ -90,24 +73,12 @@ if ('open' in props) {

var value = props.value || props.defaultValue;
this.saveCalendarRef = refFn.bind(this, 'calendarInstance');
return {
_this.saveCalendarRef = refFn.bind(_this, 'calendarInstance');
_this.state = {
open: open,
value: value
};
},
componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
var value = nextProps.value,
open = nextProps.open;
return _this;
}
if ('value' in nextProps) {
this.setState({
value: value
});
}
if (open !== undefined) {
this.setState({
open: open
});
}
},
componentDidUpdate: function componentDidUpdate(_, prevState) {
Picker.prototype.componentDidUpdate = function componentDidUpdate(_, prevState) {
if (!prevState.open && this.state.open) {

@@ -117,89 +88,27 @@ // setTimeout is for making sure saveCalendarRef happen before focusCalendar

}
},
componentWillUnmount: function componentWillUnmount() {
};
Picker.prototype.componentWillUnmount = function componentWillUnmount() {
clearTimeout(this.focusTimeout);
},
onCalendarKeyDown: function onCalendarKeyDown(event) {
if (event.keyCode === _KeyCode2['default'].ESC) {
event.stopPropagation();
this.close(this.focus);
}
},
onCalendarSelect: function onCalendarSelect(value) {
var cause = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
};
var props = this.props;
if (!('value' in props)) {
this.setState({
Picker.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps) {
var newState = {};
var value = nextProps.value,
open = nextProps.open;
if ('value' in nextProps) {
newState = {
value: value
});
};
}
if (cause.source === 'keyboard' || !props.calendar.props.timePicker && cause.source !== 'dateInput' || cause.source === 'todayButton') {
this.close(this.focus);
if (open !== undefined) {
newState = {
open: open
};
}
props.onChange(value);
},
onKeyDown: function onKeyDown(event) {
if (event.keyCode === _KeyCode2['default'].DOWN && !this.state.open) {
this.open();
event.preventDefault();
}
},
onCalendarOk: function onCalendarOk() {
this.close(this.focus);
},
onCalendarClear: function onCalendarClear() {
this.close(this.focus);
},
onVisibleChange: function onVisibleChange(open) {
this.setOpen(open);
},
getCalendarElement: function getCalendarElement() {
var props = this.props;
var state = this.state;
var calendarProps = props.calendar.props;
var value = state.value;
return newState;
};
var defaultValue = value;
var extraProps = {
ref: this.saveCalendarRef,
defaultValue: defaultValue || calendarProps.defaultValue,
selectedValue: value,
onKeyDown: this.onCalendarKeyDown,
onOk: (0, _createChainedFunction2['default'])(calendarProps.onOk, this.onCalendarOk),
onSelect: (0, _createChainedFunction2['default'])(calendarProps.onSelect, this.onCalendarSelect),
onClear: (0, _createChainedFunction2['default'])(calendarProps.onClear, this.onCalendarClear)
};
return _react2['default'].cloneElement(props.calendar, extraProps);
},
setOpen: function setOpen(open, callback) {
var onOpenChange = this.props.onOpenChange;
if (this.state.open !== open) {
if (!('open' in this.props)) {
this.setState({
open: open
}, callback);
}
onOpenChange(open);
}
},
open: function open(callback) {
this.setOpen(true, callback);
},
close: function close(callback) {
this.setOpen(false, callback);
},
focus: function focus() {
if (!this.state.open) {
_reactDom2['default'].findDOMNode(this).focus();
}
},
focusCalendar: function focusCalendar() {
if (this.state.open && !!this.calendarInstance) {
this.calendarInstance.focus();
}
},
render: function render() {
Picker.prototype.render = function render() {
var props = this.props;

@@ -238,6 +147,134 @@ var prefixCls = props.prefixCls,

);
}
});
};
return Picker;
}(_react2['default'].Component);
Picker.propTypes = {
animation: _propTypes2['default'].oneOfType([_propTypes2['default'].func, _propTypes2['default'].string]),
disabled: _propTypes2['default'].bool,
transitionName: _propTypes2['default'].string,
onChange: _propTypes2['default'].func,
onOpenChange: _propTypes2['default'].func,
children: _propTypes2['default'].func,
getCalendarContainer: _propTypes2['default'].func,
calendar: _propTypes2['default'].element,
style: _propTypes2['default'].object,
open: _propTypes2['default'].bool,
defaultOpen: _propTypes2['default'].bool,
prefixCls: _propTypes2['default'].string,
placement: _propTypes2['default'].any,
value: _propTypes2['default'].oneOfType([_propTypes2['default'].object, _propTypes2['default'].array]),
defaultValue: _propTypes2['default'].oneOfType([_propTypes2['default'].object, _propTypes2['default'].array]),
align: _propTypes2['default'].object
};
Picker.defaultProps = {
prefixCls: 'rc-calendar-picker',
style: {},
align: {},
placement: 'bottomLeft',
defaultOpen: false,
onChange: noop,
onOpenChange: noop
};
var _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.onCalendarKeyDown = function (event) {
if (event.keyCode === _KeyCode2['default'].ESC) {
event.stopPropagation();
_this2.close(_this2.focus);
}
};
this.onCalendarSelect = function (value) {
var cause = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
var props = _this2.props;
if (!('value' in props)) {
_this2.setState({
value: value
});
}
if (cause.source === 'keyboard' || !props.calendar.props.timePicker && cause.source !== 'dateInput' || cause.source === 'todayButton') {
_this2.close(_this2.focus);
}
props.onChange(value);
};
this.onKeyDown = function (event) {
if (event.keyCode === _KeyCode2['default'].DOWN && !_this2.state.open) {
_this2.open();
event.preventDefault();
}
};
this.onCalendarOk = function () {
_this2.close(_this2.focus);
};
this.onCalendarClear = function () {
_this2.close(_this2.focus);
};
this.onVisibleChange = function (open) {
_this2.setOpen(open);
};
this.getCalendarElement = function () {
var props = _this2.props;
var state = _this2.state;
var calendarProps = props.calendar.props;
var value = state.value;
var defaultValue = value;
var extraProps = {
ref: _this2.saveCalendarRef,
defaultValue: defaultValue || calendarProps.defaultValue,
selectedValue: value,
onKeyDown: _this2.onCalendarKeyDown,
onOk: (0, _createChainedFunction2['default'])(calendarProps.onOk, _this2.onCalendarOk),
onSelect: (0, _createChainedFunction2['default'])(calendarProps.onSelect, _this2.onCalendarSelect),
onClear: (0, _createChainedFunction2['default'])(calendarProps.onClear, _this2.onCalendarClear)
};
return _react2['default'].cloneElement(props.calendar, extraProps);
};
this.setOpen = function (open, callback) {
var onOpenChange = _this2.props.onOpenChange;
if (_this2.state.open !== open) {
if (!('open' in _this2.props)) {
_this2.setState({
open: open
}, callback);
}
onOpenChange(open);
}
};
this.open = function (callback) {
_this2.setOpen(true, callback);
};
this.close = function (callback) {
_this2.setOpen(false, callback);
};
this.focus = function () {
if (!_this2.state.open) {
_reactDom2['default'].findDOMNode(_this2).focus();
}
};
this.focusCalendar = function () {
if (_this2.state.open && !!_this2.calendarInstance) {
_this2.calendarInstance.focus();
}
};
};
exports['default'] = Picker;
module.exports = exports['default'];

73

lib/range-calendar/CalendarPart.js

@@ -9,2 +9,14 @@ 'use strict';

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');

@@ -14,6 +26,2 @@

var _createReactClass = require('create-react-class');
var _createReactClass2 = _interopRequireDefault(_createReactClass);
var _propTypes = require('prop-types');

@@ -39,26 +47,11 @@

var CalendarPart = (0, _createReactClass2['default'])({
displayName: 'CalendarPart',
var CalendarPart = function (_React$Component) {
(0, _inherits3['default'])(CalendarPart, _React$Component);
propTypes: {
prefixCls: _propTypes2['default'].string,
value: _propTypes2['default'].any,
hoverValue: _propTypes2['default'].any,
selectedValue: _propTypes2['default'].any,
direction: _propTypes2['default'].any,
locale: _propTypes2['default'].any,
showDateInput: _propTypes2['default'].bool,
showTimePicker: _propTypes2['default'].bool,
format: _propTypes2['default'].any,
placeholder: _propTypes2['default'].any,
disabledDate: _propTypes2['default'].any,
timePicker: _propTypes2['default'].any,
disabledTime: _propTypes2['default'].any,
onInputSelect: _propTypes2['default'].func,
timePickerDisabledTime: _propTypes2['default'].object,
enableNext: _propTypes2['default'].any,
enablePrev: _propTypes2['default'].any,
clearIcon: _propTypes2['default'].node
},
render: function render() {
function CalendarPart() {
(0, _classCallCheck3['default'])(this, CalendarPart);
return (0, _possibleConstructorReturn3['default'])(this, _React$Component.apply(this, arguments));
}
CalendarPart.prototype.render = function render() {
var props = this.props;

@@ -160,6 +153,28 @@ var prefixCls = props.prefixCls,

);
}
});
};
return CalendarPart;
}(_react2['default'].Component);
CalendarPart.propTypes = {
prefixCls: _propTypes2['default'].string,
value: _propTypes2['default'].any,
hoverValue: _propTypes2['default'].any,
selectedValue: _propTypes2['default'].any,
direction: _propTypes2['default'].any,
locale: _propTypes2['default'].any,
showDateInput: _propTypes2['default'].bool,
showTimePicker: _propTypes2['default'].bool,
format: _propTypes2['default'].any,
placeholder: _propTypes2['default'].any,
disabledDate: _propTypes2['default'].any,
timePicker: _propTypes2['default'].any,
disabledTime: _propTypes2['default'].any,
onInputSelect: _propTypes2['default'].func,
timePickerDisabledTime: _propTypes2['default'].object,
enableNext: _propTypes2['default'].any,
enablePrev: _propTypes2['default'].any,
clearIcon: _propTypes2['default'].node
};
exports['default'] = CalendarPart;
module.exports = exports['default'];

767

lib/RangeCalendar.js

@@ -9,2 +9,14 @@ 'use strict';

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');

@@ -14,6 +26,2 @@

var _createReactClass = require('create-react-class');
var _createReactClass2 = _interopRequireDefault(_createReactClass);
var _propTypes = require('prop-types');

@@ -53,4 +61,2 @@

var _CommonMixin2 = _interopRequireDefault(_CommonMixin);
var _util = require('./util');

@@ -123,56 +129,15 @@

var RangeCalendar = (0, _createReactClass2['default'])({
displayName: 'RangeCalendar',
var RangeCalendar = function (_React$Component) {
(0, _inherits3['default'])(RangeCalendar, _React$Component);
propTypes: {
prefixCls: _propTypes2['default'].string,
dateInputPlaceholder: _propTypes2['default'].any,
seperator: _propTypes2['default'].string,
defaultValue: _propTypes2['default'].any,
value: _propTypes2['default'].any,
hoverValue: _propTypes2['default'].any,
mode: _propTypes2['default'].arrayOf(_propTypes2['default'].oneOf(['date', 'month', 'year', 'decade'])),
showDateInput: _propTypes2['default'].bool,
timePicker: _propTypes2['default'].any,
showOk: _propTypes2['default'].bool,
showToday: _propTypes2['default'].bool,
defaultSelectedValue: _propTypes2['default'].array,
selectedValue: _propTypes2['default'].array,
onOk: _propTypes2['default'].func,
showClear: _propTypes2['default'].bool,
locale: _propTypes2['default'].object,
onChange: _propTypes2['default'].func,
onSelect: _propTypes2['default'].func,
onValueChange: _propTypes2['default'].func,
onHoverChange: _propTypes2['default'].func,
onPanelChange: _propTypes2['default'].func,
format: _propTypes2['default'].oneOfType([_propTypes2['default'].object, _propTypes2['default'].string]),
onClear: _propTypes2['default'].func,
type: _propTypes2['default'].any,
disabledDate: _propTypes2['default'].func,
disabledTime: _propTypes2['default'].func,
clearIcon: _propTypes2['default'].node
},
function RangeCalendar(props) {
(0, _classCallCheck3['default'])(this, RangeCalendar);
mixins: [_CommonMixin2['default']],
var _this = (0, _possibleConstructorReturn3['default'])(this, _React$Component.call(this, props));
getDefaultProps: function getDefaultProps() {
return {
type: 'both',
seperator: '~',
defaultSelectedValue: [],
onValueChange: noop,
onHoverChange: noop,
onPanelChange: noop,
disabledTime: noop,
onInputSelect: noop,
showToday: true,
showDateInput: true
};
},
getInitialState: function getInitialState() {
var props = this.props;
_initialiseProps.call(_this);
var selectedValue = props.selectedValue || props.defaultSelectedValue;
var value = normalizeAnchor(props, 1);
return {
_this.state = {
selectedValue: selectedValue,

@@ -186,13 +151,12 @@ prevSelectedValue: selectedValue,

};
},
componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
var state = this.state;
return _this;
}
RangeCalendar.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, state) {
var newState = {};
if ('value' in nextProps) {
newState.value = normalizeAnchor(nextProps, 0);
this.setState(newState);
}
if ('hoverValue' in nextProps && !isArraysEqual(state.hoverValue, nextProps.hoverValue)) {
this.setState({ hoverValue: nextProps.hoverValue });
newState.hoverValue = nextProps.hoverValue;
}

@@ -202,21 +166,236 @@ if ('selectedValue' in nextProps) {

newState.prevSelectedValue = nextProps.selectedValue;
this.setState(newState);
}
if ('mode' in nextProps && !isArraysEqual(state.mode, nextProps.mode)) {
this.setState({ mode: nextProps.mode });
newState = { mode: nextProps.mode };
}
},
onDatePanelEnter: function onDatePanelEnter() {
if (this.hasSelectedValue()) {
this.fireHoverValueChange(this.state.selectedValue.concat());
return newState;
};
// get disabled hours for second picker
RangeCalendar.prototype.render = function render() {
var _className, _classnames;
var props = this.props,
state = this.state;
var prefixCls = props.prefixCls,
dateInputPlaceholder = props.dateInputPlaceholder,
seperator = props.seperator,
timePicker = props.timePicker,
showOk = props.showOk,
locale = props.locale,
showClear = props.showClear,
showToday = props.showToday,
type = props.type,
clearIcon = props.clearIcon;
var hoverValue = state.hoverValue,
selectedValue = state.selectedValue,
mode = state.mode,
showTimePicker = state.showTimePicker;
var className = (_className = {}, _className[props.className] = !!props.className, _className[prefixCls] = 1, _className[prefixCls + '-hidden'] = !props.visible, _className[prefixCls + '-range'] = 1, _className[prefixCls + '-show-time-picker'] = showTimePicker, _className[prefixCls + '-week-number'] = props.showWeekNumber, _className);
var classes = (0, _classnames3['default'])(className);
var newProps = {
selectedValue: state.selectedValue,
onSelect: this.onSelect,
onDayHover: type === 'start' && selectedValue[1] || type === 'end' && selectedValue[0] || !!hoverValue.length ? this.onDayHover : undefined
};
var placeholder1 = void 0;
var placeholder2 = void 0;
if (dateInputPlaceholder) {
if (Array.isArray(dateInputPlaceholder)) {
placeholder1 = dateInputPlaceholder[0];
placeholder2 = dateInputPlaceholder[1];
} else {
placeholder1 = placeholder2 = dateInputPlaceholder;
}
}
},
onDatePanelLeave: function onDatePanelLeave() {
if (this.hasSelectedValue()) {
this.fireHoverValueChange([]);
var showOkButton = showOk === true || showOk !== false && !!timePicker;
var cls = (0, _classnames3['default'])((_classnames = {}, _classnames[prefixCls + '-footer'] = true, _classnames[prefixCls + '-range-bottom'] = true, _classnames[prefixCls + '-footer-show-ok'] = showOkButton, _classnames));
var startValue = this.getStartValue();
var endValue = this.getEndValue();
var todayTime = (0, _util.getTodayTime)(startValue);
var thisMonth = todayTime.month();
var thisYear = todayTime.year();
var isTodayInView = startValue.year() === thisYear && startValue.month() === thisMonth || endValue.year() === thisYear && endValue.month() === thisMonth;
var nextMonthOfStart = startValue.clone().add(1, 'months');
var isClosestMonths = nextMonthOfStart.year() === endValue.year() && nextMonthOfStart.month() === endValue.month();
// console.warn('Render:', selectedValue.map(t => t.format('YYYY-MM-DD')).join(', '));
// console.log('start:', startValue.format('YYYY-MM-DD'));
// console.log('end:', endValue.format('YYYY-MM-DD'));
var extraFooter = props.renderFooter();
return _react2['default'].createElement(
'div',
{
ref: this.saveRoot,
className: classes,
style: props.style,
tabIndex: '0',
onKeyDown: this.onKeyDown
},
props.renderSidebar(),
_react2['default'].createElement(
'div',
{ className: prefixCls + '-panel' },
showClear && selectedValue[0] && selectedValue[1] ? _react2['default'].createElement(
'a',
{
role: 'button',
title: locale.clear,
onClick: this.clear
},
clearIcon || _react2['default'].createElement('span', { className: prefixCls + '-clear-btn' })
) : null,
_react2['default'].createElement(
'div',
{
className: prefixCls + '-date-panel',
onMouseLeave: type !== 'both' ? this.onDatePanelLeave : undefined,
onMouseEnter: type !== 'both' ? this.onDatePanelEnter : undefined
},
_react2['default'].createElement(_CalendarPart2['default'], (0, _extends3['default'])({}, props, newProps, {
hoverValue: hoverValue,
direction: 'left',
disabledTime: this.disabledStartTime,
disabledMonth: this.disabledStartMonth,
format: this.getFormat(),
value: startValue,
mode: mode[0],
placeholder: placeholder1,
onInputSelect: this.onStartInputSelect,
onValueChange: this.onStartValueChange,
onPanelChange: this.onStartPanelChange,
showDateInput: this.props.showDateInput,
timePicker: timePicker,
showTimePicker: showTimePicker,
enablePrev: true,
enableNext: !isClosestMonths || this.isMonthYearPanelShow(mode[1]),
clearIcon: clearIcon
})),
_react2['default'].createElement(
'span',
{ className: prefixCls + '-range-middle' },
seperator
),
_react2['default'].createElement(_CalendarPart2['default'], (0, _extends3['default'])({}, props, newProps, {
hoverValue: hoverValue,
direction: 'right',
format: this.getFormat(),
timePickerDisabledTime: this.getEndDisableTime(),
placeholder: placeholder2,
value: endValue,
mode: mode[1],
onInputSelect: this.onEndInputSelect,
onValueChange: this.onEndValueChange,
onPanelChange: this.onEndPanelChange,
showDateInput: this.props.showDateInput,
timePicker: timePicker,
showTimePicker: showTimePicker,
disabledTime: this.disabledEndTime,
disabledMonth: this.disabledEndMonth,
enablePrev: !isClosestMonths || this.isMonthYearPanelShow(mode[0]),
enableNext: true,
clearIcon: clearIcon
}))
),
_react2['default'].createElement(
'div',
{ className: cls },
showToday || props.timePicker || showOkButton || extraFooter ? _react2['default'].createElement(
'div',
{ className: prefixCls + '-footer-btn' },
extraFooter,
showToday ? _react2['default'].createElement(_TodayButton2['default'], (0, _extends3['default'])({}, props, {
disabled: isTodayInView,
value: state.value[0],
onToday: this.onToday,
text: locale.backToToday
})) : null,
props.timePicker ? _react2['default'].createElement(_TimePickerButton2['default'], (0, _extends3['default'])({}, props, {
showTimePicker: showTimePicker,
onOpenTimePicker: this.onOpenTimePicker,
onCloseTimePicker: this.onCloseTimePicker,
timePickerDisabled: !this.hasSelectedValue() || hoverValue.length
})) : null,
showOkButton ? _react2['default'].createElement(_OkButton2['default'], (0, _extends3['default'])({}, props, {
onOk: this.onOk,
okDisabled: !this.isAllowedDateAndTime(selectedValue) || !this.hasSelectedValue() || hoverValue.length
})) : null
) : null
)
)
);
};
return RangeCalendar;
}(_react2['default'].Component);
RangeCalendar.propTypes = (0, _extends3['default'])({}, _CommonMixin.propType, {
prefixCls: _propTypes2['default'].string,
dateInputPlaceholder: _propTypes2['default'].any,
seperator: _propTypes2['default'].string,
defaultValue: _propTypes2['default'].any,
value: _propTypes2['default'].any,
hoverValue: _propTypes2['default'].any,
mode: _propTypes2['default'].arrayOf(_propTypes2['default'].oneOf(['date', 'month', 'year', 'decade'])),
showDateInput: _propTypes2['default'].bool,
timePicker: _propTypes2['default'].any,
showOk: _propTypes2['default'].bool,
showToday: _propTypes2['default'].bool,
defaultSelectedValue: _propTypes2['default'].array,
selectedValue: _propTypes2['default'].array,
onOk: _propTypes2['default'].func,
showClear: _propTypes2['default'].bool,
locale: _propTypes2['default'].object,
onChange: _propTypes2['default'].func,
onSelect: _propTypes2['default'].func,
onValueChange: _propTypes2['default'].func,
onHoverChange: _propTypes2['default'].func,
onPanelChange: _propTypes2['default'].func,
format: _propTypes2['default'].oneOfType([_propTypes2['default'].object, _propTypes2['default'].string]),
onClear: _propTypes2['default'].func,
type: _propTypes2['default'].any,
disabledDate: _propTypes2['default'].func,
disabledTime: _propTypes2['default'].func,
clearIcon: _propTypes2['default'].node,
onKeyDown: _propTypes2['default'].func
});
RangeCalendar.defaultProps = (0, _extends3['default'])({}, _CommonMixin.defaultProp, {
type: 'both',
seperator: '~',
defaultSelectedValue: [],
onValueChange: noop,
onHoverChange: noop,
onPanelChange: noop,
disabledTime: noop,
onInputSelect: noop,
showToday: true,
showDateInput: true
});
var _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.onDatePanelEnter = function () {
if (_this2.hasSelectedValue()) {
_this2.fireHoverValueChange(_this2.state.selectedValue.concat());
}
},
onSelect: function onSelect(value) {
var type = this.props.type;
var _state = this.state,
};
this.onDatePanelLeave = function () {
if (_this2.hasSelectedValue()) {
_this2.fireHoverValueChange([]);
}
};
this.onSelect = function (value) {
var type = _this2.props.type;
var _state = _this2.state,
selectedValue = _state.selectedValue,

@@ -231,3 +410,3 @@ prevSelectedValue = _state.prevSelectedValue,

nextSelectedValue = [value];
} else if (this.compare(firstSelectedValue, value) < 0) {
} else if (_this2.compare(firstSelectedValue, value) < 0) {
(0, _util.syncTime)(prevSelectedValue[1], value);

@@ -243,7 +422,7 @@ nextSelectedValue = [firstSelectedValue, value];

var endValue = selectedValue[1];
nextSelectedValue = endValue && this.compare(endValue, value) > 0 ? [value, endValue] : [value];
nextSelectedValue = endValue && _this2.compare(endValue, value) > 0 ? [value, endValue] : [value];
} else {
// type === 'end'
var startValue = selectedValue[0];
if (startValue && this.compare(startValue, value) <= 0) {
if (startValue && _this2.compare(startValue, value) <= 0) {
(0, _util.syncTime)(prevSelectedValue[1], value);

@@ -257,7 +436,6 @@ nextSelectedValue = [startValue, value];

this.fireSelectValueChange(nextSelectedValue);
},
onKeyDown: function onKeyDown(event) {
var _this = this;
_this2.fireSelectValueChange(nextSelectedValue);
};
this.onKeyDown = function (event) {
if (event.target.nodeName.toLowerCase() === 'input') {

@@ -271,3 +449,3 @@ return;

var _state2 = this.state,
var _state2 = _this2.state,
selectedValue = _state2.selectedValue,

@@ -277,3 +455,3 @@ hoverValue = _state2.hoverValue,

value = _state2.value;
var _props = this.props,
var _props = _this2.props,
onKeyDown = _props.onKeyDown,

@@ -294,3 +472,3 @@ disabledDate = _props.disabledDate;

nextHoverValue = [nextHoverTime];
_this.fireHoverValueChange(nextHoverValue);
_this2.fireHoverValueChange(nextHoverValue);
} else {

@@ -300,7 +478,7 @@ if (hoverValue.length === 1) {

nextHoverTime = func(currentHoverTime);
nextHoverValue = _this.onDayHover(nextHoverTime);
nextHoverValue = _this2.onDayHover(nextHoverTime);
} else {
currentHoverTime = hoverValue[0].isSame(firstSelectedValue, 'day') ? hoverValue[1] : hoverValue[0];
nextHoverTime = func(currentHoverTime);
nextHoverValue = _this.onDayHover(nextHoverTime);
nextHoverValue = _this2.onDayHover(nextHoverTime);
}

@@ -321,3 +499,3 @@ }

}
_this.fireValueChange(newValue);
_this2.fireValueChange(newValue);
}

@@ -336,3 +514,3 @@ } else if (nextHoverValue.length === 1) {

_newValue[oriValueIndex] = nextHoverTime.clone();
_this.fireValueChange(_newValue);
_this2.fireValueChange(_newValue);
}

@@ -412,3 +590,3 @@ }

if (lastValue && (!disabledDate || !disabledDate(lastValue))) {
this.onSelect(lastValue);
_this2.onSelect(lastValue);
}

@@ -423,50 +601,56 @@ event.preventDefault();

}
},
onDayHover: function onDayHover(value) {
};
this.onDayHover = function (value) {
var hoverValue = [];
var _state3 = this.state,
var _state3 = _this2.state,
selectedValue = _state3.selectedValue,
firstSelectedValue = _state3.firstSelectedValue;
var type = this.props.type;
var type = _this2.props.type;
if (type === 'start' && selectedValue[1]) {
hoverValue = this.compare(value, selectedValue[1]) < 0 ? [value, selectedValue[1]] : [value];
hoverValue = _this2.compare(value, selectedValue[1]) < 0 ? [value, selectedValue[1]] : [value];
} else if (type === 'end' && selectedValue[0]) {
hoverValue = this.compare(value, selectedValue[0]) > 0 ? [selectedValue[0], value] : [];
hoverValue = _this2.compare(value, selectedValue[0]) > 0 ? [selectedValue[0], value] : [];
} else {
if (!firstSelectedValue) {
if (this.state.hoverValue.length) {
this.setState({ hoverValue: [] });
if (_this2.state.hoverValue.length) {
_this2.setState({ hoverValue: [] });
}
return hoverValue;
}
hoverValue = this.compare(value, firstSelectedValue) < 0 ? [value, firstSelectedValue] : [firstSelectedValue, value];
hoverValue = _this2.compare(value, firstSelectedValue) < 0 ? [value, firstSelectedValue] : [firstSelectedValue, value];
}
this.fireHoverValueChange(hoverValue);
_this2.fireHoverValueChange(hoverValue);
return hoverValue;
},
onToday: function onToday() {
var startValue = (0, _util.getTodayTime)(this.state.value[0]);
};
this.onToday = function () {
var startValue = (0, _util.getTodayTime)(_this2.state.value[0]);
var endValue = startValue.clone().add(1, 'months');
this.setState({ value: [startValue, endValue] });
},
onOpenTimePicker: function onOpenTimePicker() {
this.setState({
_this2.setState({ value: [startValue, endValue] });
};
this.onOpenTimePicker = function () {
_this2.setState({
showTimePicker: true
});
},
onCloseTimePicker: function onCloseTimePicker() {
this.setState({
};
this.onCloseTimePicker = function () {
_this2.setState({
showTimePicker: false
});
},
onOk: function onOk() {
var selectedValue = this.state.selectedValue;
};
if (this.isAllowedDateAndTime(selectedValue)) {
this.props.onOk(this.state.selectedValue);
this.onOk = function () {
var selectedValue = _this2.state.selectedValue;
if (_this2.isAllowedDateAndTime(selectedValue)) {
_this2.props.onOk(_this2.state.selectedValue);
}
},
onStartInputSelect: function onStartInputSelect() {
};
this.onStartInputSelect = function () {
for (var _len = arguments.length, oargs = Array(_len), _key = 0; _key < _len; _key++) {

@@ -477,5 +661,6 @@ oargs[_key] = arguments[_key];

var args = ['left'].concat(oargs);
return onInputSelect.apply(this, args);
},
onEndInputSelect: function onEndInputSelect() {
return onInputSelect.apply(_this2, args);
};
this.onEndInputSelect = function () {
for (var _len2 = arguments.length, oargs = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {

@@ -486,21 +671,24 @@ oargs[_key2] = arguments[_key2];

var args = ['right'].concat(oargs);
return onInputSelect.apply(this, args);
},
onStartValueChange: function onStartValueChange(leftValue) {
var value = [].concat(this.state.value);
return onInputSelect.apply(_this2, args);
};
this.onStartValueChange = function (leftValue) {
var value = [].concat(_this2.state.value);
value[0] = leftValue;
return this.fireValueChange(value);
},
onEndValueChange: function onEndValueChange(rightValue) {
var value = [].concat(this.state.value);
return _this2.fireValueChange(value);
};
this.onEndValueChange = function (rightValue) {
var value = [].concat(_this2.state.value);
value[1] = rightValue;
return this.fireValueChange(value);
},
onStartPanelChange: function onStartPanelChange(value, mode) {
var props = this.props,
state = this.state;
return _this2.fireValueChange(value);
};
this.onStartPanelChange = function (value, mode) {
var props = _this2.props,
state = _this2.state;
var newMode = [mode, state.mode[1]];
if (!('mode' in props)) {
this.setState({
_this2.setState({
mode: newMode

@@ -511,10 +699,11 @@ });

props.onPanelChange(newValue, newMode);
},
onEndPanelChange: function onEndPanelChange(value, mode) {
var props = this.props,
state = this.state;
};
this.onEndPanelChange = function (value, mode) {
var props = _this2.props,
state = _this2.state;
var newMode = [state.mode[0], mode];
if (!('mode' in props)) {
this.setState({
_this2.setState({
mode: newMode

@@ -525,18 +714,20 @@ });

props.onPanelChange(newValue, newMode);
},
getStartValue: function getStartValue() {
var value = this.state.value[0];
var selectedValue = this.state.selectedValue;
};
this.getStartValue = function () {
var value = _this2.state.value[0];
var selectedValue = _this2.state.selectedValue;
// keep selectedTime when select date
if (selectedValue[0] && this.props.timePicker) {
if (selectedValue[0] && _this2.props.timePicker) {
value = value.clone();
(0, _util.syncTime)(selectedValue[0], value);
}
if (this.state.showTimePicker && selectedValue[0]) {
if (_this2.state.showTimePicker && selectedValue[0]) {
return selectedValue[0];
}
return value;
},
getEndValue: function getEndValue() {
var _state4 = this.state,
};
this.getEndValue = function () {
var _state4 = _this2.state,
value = _state4.value,

@@ -548,17 +739,16 @@ selectedValue = _state4.selectedValue,

// keep selectedTime when select date
if (selectedValue[1] && this.props.timePicker) {
if (selectedValue[1] && _this2.props.timePicker) {
(0, _util.syncTime)(selectedValue[1], endValue);
}
if (showTimePicker) {
return selectedValue[1] ? selectedValue[1] : this.getStartValue();
return selectedValue[1] ? selectedValue[1] : _this2.getStartValue();
}
return endValue;
},
};
// get disabled hours for second picker
getEndDisableTime: function getEndDisableTime() {
var _state5 = this.state,
this.getEndDisableTime = function () {
var _state5 = _this2.state,
selectedValue = _state5.selectedValue,
value = _state5.value;
var disabledTime = this.props.disabledTime;
var disabledTime = _this2.props.disabledTime;

@@ -601,24 +791,29 @@ var userSettingDisabledTime = disabledTime(selectedValue, 'end') || {};

return userSettingDisabledTime;
},
isAllowedDateAndTime: function isAllowedDateAndTime(selectedValue) {
return (0, _util.isAllowedDate)(selectedValue[0], this.props.disabledDate, this.disabledStartTime) && (0, _util.isAllowedDate)(selectedValue[1], this.props.disabledDate, this.disabledEndTime);
},
isMonthYearPanelShow: function isMonthYearPanelShow(mode) {
};
this.isAllowedDateAndTime = function (selectedValue) {
return (0, _util.isAllowedDate)(selectedValue[0], _this2.props.disabledDate, _this2.disabledStartTime) && (0, _util.isAllowedDate)(selectedValue[1], _this2.props.disabledDate, _this2.disabledEndTime);
};
this.isMonthYearPanelShow = function (mode) {
return ['month', 'year', 'decade'].indexOf(mode) > -1;
},
hasSelectedValue: function hasSelectedValue() {
var selectedValue = this.state.selectedValue;
};
this.hasSelectedValue = function () {
var selectedValue = _this2.state.selectedValue;
return !!selectedValue[1] && !!selectedValue[0];
},
compare: function compare(v1, v2) {
if (this.props.timePicker) {
};
this.compare = function (v1, v2) {
if (_this2.props.timePicker) {
return v1.diff(v2);
}
return v1.diff(v2, 'days');
},
fireSelectValueChange: function fireSelectValueChange(selectedValue, direct) {
var timePicker = this.props.timePicker;
var prevSelectedValue = this.state.prevSelectedValue;
};
this.fireSelectValueChange = function (selectedValue, direct) {
var timePicker = _this2.props.timePicker;
var prevSelectedValue = _this2.state.prevSelectedValue;
if (timePicker && timePicker.props.defaultValue) {

@@ -634,4 +829,4 @@ var timePickerDefaultValue = timePicker.props.defaultValue;

if (!('selectedValue' in this.props)) {
this.setState({
if (!('selectedValue' in _this2.props)) {
_this2.setState({
selectedValue: selectedValue

@@ -642,6 +837,6 @@ });

// 尚未选择过时间，直接输入的话
if (!this.state.selectedValue[0] || !this.state.selectedValue[1]) {
if (!_this2.state.selectedValue[0] || !_this2.state.selectedValue[1]) {
var startValue = selectedValue[0] || (0, _moment2['default'])();
var endValue = selectedValue[1] || startValue.clone().add(1, 'months');
this.setState({
_this2.setState({
selectedValue: selectedValue,

@@ -653,19 +848,20 @@ value: getValueFromSelectedValue([startValue, endValue])

if (selectedValue[0] && !selectedValue[1]) {
this.setState({ firstSelectedValue: selectedValue[0] });
this.fireHoverValueChange(selectedValue.concat());
_this2.setState({ firstSelectedValue: selectedValue[0] });
_this2.fireHoverValueChange(selectedValue.concat());
}
this.props.onChange(selectedValue);
_this2.props.onChange(selectedValue);
if (direct || selectedValue[0] && selectedValue[1]) {
this.setState({
_this2.setState({
prevSelectedValue: selectedValue,
firstSelectedValue: null
});
this.fireHoverValueChange([]);
this.props.onSelect(selectedValue);
_this2.fireHoverValueChange([]);
_this2.props.onSelect(selectedValue);
}
},
fireValueChange: function fireValueChange(value) {
var props = this.props;
};
this.fireValueChange = function (value) {
var props = _this2.props;
if (!('value' in props)) {
this.setState({
_this2.setState({
value: value

@@ -675,192 +871,39 @@ });

props.onValueChange(value);
},
fireHoverValueChange: function fireHoverValueChange(hoverValue) {
var props = this.props;
};
this.fireHoverValueChange = function (hoverValue) {
var props = _this2.props;
if (!('hoverValue' in props)) {
this.setState({ hoverValue: hoverValue });
_this2.setState({ hoverValue: hoverValue });
}
props.onHoverChange(hoverValue);
},
clear: function clear() {
this.fireSelectValueChange([], true);
this.props.onClear();
},
disabledStartTime: function disabledStartTime(time) {
return this.props.disabledTime(time, 'start');
},
disabledEndTime: function disabledEndTime(time) {
return this.props.disabledTime(time, 'end');
},
disabledStartMonth: function disabledStartMonth(month) {
var value = this.state.value;
};
return month.isSameOrAfter(value[1], 'month');
},
disabledEndMonth: function disabledEndMonth(month) {
var value = this.state.value;
this.clear = function () {
_this2.fireSelectValueChange([], true);
_this2.props.onClear();
};
return month.isSameOrBefore(value[0], 'month');
},
render: function render() {
var _className, _classnames;
this.disabledStartTime = function (time) {
return _this2.props.disabledTime(time, 'start');
};
var props = this.props,
state = this.state;
var prefixCls = props.prefixCls,
dateInputPlaceholder = props.dateInputPlaceholder,
seperator = props.seperator,
timePicker = props.timePicker,
showOk = props.showOk,
locale = props.locale,
showClear = props.showClear,
showToday = props.showToday,
type = props.type,
clearIcon = props.clearIcon;
var hoverValue = state.hoverValue,
selectedValue = state.selectedValue,
mode = state.mode,
showTimePicker = state.showTimePicker;
this.disabledEndTime = function (time) {
return _this2.props.disabledTime(time, 'end');
};
var className = (_className = {}, _className[props.className] = !!props.className, _className[prefixCls] = 1, _className[prefixCls + '-hidden'] = !props.visible, _className[prefixCls + '-range'] = 1, _className[prefixCls + '-show-time-picker'] = showTimePicker, _className[prefixCls + '-week-number'] = props.showWeekNumber, _className);
var classes = (0, _classnames3['default'])(className);
var newProps = {
selectedValue: state.selectedValue,
onSelect: this.onSelect,
onDayHover: type === 'start' && selectedValue[1] || type === 'end' && selectedValue[0] || !!hoverValue.length ? this.onDayHover : undefined
};
this.disabledStartMonth = function (month) {
var value = _this2.state.value;
var placeholder1 = void 0;
var placeholder2 = void 0;
return month.isSameOrAfter(value[1], 'month');
};
if (dateInputPlaceholder) {
if (Array.isArray(dateInputPlaceholder)) {
placeholder1 = dateInputPlaceholder[0];
placeholder2 = dateInputPlaceholder[1];
} else {
placeholder1 = placeholder2 = dateInputPlaceholder;
}
}
var showOkButton = showOk === true || showOk !== false && !!timePicker;
var cls = (0, _classnames3['default'])((_classnames = {}, _classnames[prefixCls + '-footer'] = true, _classnames[prefixCls + '-range-bottom'] = true, _classnames[prefixCls + '-footer-show-ok'] = showOkButton, _classnames));
this.disabledEndMonth = function (month) {
var value = _this2.state.value;
var startValue = this.getStartValue();
var endValue = this.getEndValue();
var todayTime = (0, _util.getTodayTime)(startValue);
var thisMonth = todayTime.month();
var thisYear = todayTime.year();
var isTodayInView = startValue.year() === thisYear && startValue.month() === thisMonth || endValue.year() === thisYear && endValue.month() === thisMonth;
var nextMonthOfStart = startValue.clone().add(1, 'months');
var isClosestMonths = nextMonthOfStart.year() === endValue.year() && nextMonthOfStart.month() === endValue.month();
return month.isSameOrBefore(value[0], 'month');
};
};
// console.warn('Render:', selectedValue.map(t => t.format('YYYY-MM-DD')).join(', '));
// console.log('start:', startValue.format('YYYY-MM-DD'));
// console.log('end:', endValue.format('YYYY-MM-DD'));
var extraFooter = props.renderFooter();
return _react2['default'].createElement(
'div',
{
ref: this.saveRoot,
className: classes,
style: props.style,
tabIndex: '0',
onKeyDown: this.onKeyDown
},
props.renderSidebar(),
_react2['default'].createElement(
'div',
{ className: prefixCls + '-panel' },
showClear && selectedValue[0] && selectedValue[1] ? _react2['default'].createElement(
'a',
{
role: 'button',
title: locale.clear,
onClick: this.clear
},
clearIcon || _react2['default'].createElement('span', { className: prefixCls + '-clear-btn' })
) : null,
_react2['default'].createElement(
'div',
{
className: prefixCls + '-date-panel',
onMouseLeave: type !== 'both' ? this.onDatePanelLeave : undefined,
onMouseEnter: type !== 'both' ? this.onDatePanelEnter : undefined
},
_react2['default'].createElement(_CalendarPart2['default'], (0, _extends3['default'])({}, props, newProps, {
hoverValue: hoverValue,
direction: 'left',
disabledTime: this.disabledStartTime,
disabledMonth: this.disabledStartMonth,
format: this.getFormat(),
value: startValue,
mode: mode[0],
placeholder: placeholder1,
onInputSelect: this.onStartInputSelect,
onValueChange: this.onStartValueChange,
onPanelChange: this.onStartPanelChange,
showDateInput: this.props.showDateInput,
timePicker: timePicker,
showTimePicker: showTimePicker,
enablePrev: true,
enableNext: !isClosestMonths || this.isMonthYearPanelShow(mode[1]),
clearIcon: clearIcon
})),
_react2['default'].createElement(
'span',
{ className: prefixCls + '-range-middle' },
seperator
),
_react2['default'].createElement(_CalendarPart2['default'], (0, _extends3['default'])({}, props, newProps, {
hoverValue: hoverValue,
direction: 'right',
format: this.getFormat(),
timePickerDisabledTime: this.getEndDisableTime(),
placeholder: placeholder2,
value: endValue,
mode: mode[1],
onInputSelect: this.onEndInputSelect,
onValueChange: this.onEndValueChange,
onPanelChange: this.onEndPanelChange,
showDateInput: this.props.showDateInput,
timePicker: timePicker,
showTimePicker: showTimePicker,
disabledTime: this.disabledEndTime,
disabledMonth: this.disabledEndMonth,
enablePrev: !isClosestMonths || this.isMonthYearPanelShow(mode[0]),
enableNext: true,
clearIcon: clearIcon
}))
),
_react2['default'].createElement(
'div',
{ className: cls },
showToday || props.timePicker || showOkButton || extraFooter ? _react2['default'].createElement(
'div',
{ className: prefixCls + '-footer-btn' },
extraFooter,
showToday ? _react2['default'].createElement(_TodayButton2['default'], (0, _extends3['default'])({}, props, {
disabled: isTodayInView,
value: state.value[0],
onToday: this.onToday,
text: locale.backToToday
})) : null,
props.timePicker ? _react2['default'].createElement(_TimePickerButton2['default'], (0, _extends3['default'])({}, props, {
showTimePicker: showTimePicker,
onOpenTimePicker: this.onOpenTimePicker,
onCloseTimePicker: this.onCloseTimePicker,
timePickerDisabled: !this.hasSelectedValue() || hoverValue.length
})) : null,
showOkButton ? _react2['default'].createElement(_OkButton2['default'], (0, _extends3['default'])({}, props, {
onOk: this.onOk,
okDisabled: !this.isAllowedDateAndTime(selectedValue) || !this.hasSelectedValue() || hoverValue.length
})) : null
) : null
)
)
);
}
});
exports['default'] = RangeCalendar;
exports['default'] = (0, _CommonMixin.commonMixinWrapper)(RangeCalendar);
module.exports = exports['default'];

10

package.json
{
"name": "rc-calendar",
"version": "9.9.2",
"version": "9.10.0",
"description": "React Calendar",

@@ -83,4 +83,4 @@ "keywords": [

"rc-tools": "^7.0.3",
"react": "^16.0.0",
"react-dom": "^16.0.0",
"react": "^16.5.2",
"react-dom": "^16.5.2",
"react-test-renderer": "^16.0.0",

@@ -96,9 +96,9 @@ "tslint": "^5.9.1",

"classnames": "2.x",
"create-react-class": "^15.5.2",
"moment": "2.x",
"prop-types": "^15.5.8",
"rc-trigger": "^2.2.0",
"rc-util": "^4.1.1"
"rc-util": "^4.1.1",
"react-lifecycles-compat": "^3.0.4"
},
"types": "index.d.ts"
}
dist/rc-calendar.js

Sorry, the diff of this file is too big to display

dist/rc-calendar.js.map

Sorry, the diff of this file is not supported yet

dist/rc-calendar.min.js

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc