dash-core-components
Version:
Core component suite for Dash
132 lines (130 loc) • 7.11 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
require("react-dates/initialize");
var _reactDates = require("react-dates");
var _moment = _interopRequireDefault(require("moment"));
var _react = _interopRequireWildcard(require("react"));
var _DatePickerSingle = require("../components/DatePickerSingle.react");
var _convertToMoment2 = _interopRequireDefault(require("../utils/convertToMoment"));
var _LoadingElement = _interopRequireDefault(require("../utils/LoadingElement"));
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
class DatePickerSingle extends _react.Component {
constructor() {
super();
this.propsToState = this.propsToState.bind(this);
this.isOutsideRange = this.isOutsideRange.bind(this);
this.onDateChange = this.onDateChange.bind(this);
this.state = {
focused: false
};
}
propsToState(newProps) {
var force = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var state = {};
if (force || newProps.max_date_allowed !== this.props.max_date_allowed) {
state.max_date_allowed = (0, _convertToMoment2.default)(newProps, ['max_date_allowed']).max_date_allowed;
}
if (force || newProps.min_date_allowed !== this.props.min_date_allowed) {
state.min_date_allowed = (0, _convertToMoment2.default)(newProps, ['min_date_allowed']).min_date_allowed;
}
if (force || newProps.disabled_days !== this.props.disabled_days) {
state.disabled_days = (0, _convertToMoment2.default)(newProps, ['disabled_days']).disabled_days;
}
if (Object.keys(state).length) {
this.setState(state);
}
}
UNSAFE_componentWillReceiveProps(newProps) {
this.propsToState(newProps);
}
UNSAFE_componentWillMount() {
this.propsToState(this.props, true);
}
isOutsideRange(date) {
return this.state.min_date_allowed && date.isBefore(this.state.min_date_allowed) || this.state.max_date_allowed && date.isAfter(this.state.max_date_allowed) || this.state.disabled_days && this.state.disabled_days.some(d => date.isSame(d, 'day'));
}
onDateChange(date) {
var setProps = this.props.setProps;
var payload = {
date: date ? date.format('YYYY-MM-DD') : null
};
setProps(payload);
}
render() {
var focused = this.state.focused;
var _this$props = this.props,
calendar_orientation = _this$props.calendar_orientation,
clearable = _this$props.clearable,
day_size = _this$props.day_size,
disabled = _this$props.disabled,
display_format = _this$props.display_format,
first_day_of_week = _this$props.first_day_of_week,
is_RTL = _this$props.is_RTL,
month_format = _this$props.month_format,
number_of_months_shown = _this$props.number_of_months_shown,
placeholder = _this$props.placeholder,
reopen_calendar_on_clear = _this$props.reopen_calendar_on_clear,
show_outside_days = _this$props.show_outside_days,
stay_open_on_select = _this$props.stay_open_on_select,
with_full_screen_portal = _this$props.with_full_screen_portal,
with_portal = _this$props.with_portal,
id = _this$props.id,
style = _this$props.style,
className = _this$props.className;
var _convertToMoment = (0, _convertToMoment2.default)(this.props, ['date', 'initial_visible_month']),
date = _convertToMoment.date,
initial_visible_month = _convertToMoment.initial_visible_month;
var verticalFlag = calendar_orientation !== 'vertical';
var DatePickerWrapperStyles = _objectSpread({
position: 'relative',
display: 'inline-block'
}, style);
// the height in px of the top part of the calendar (that holds
// the name of the month)
var baselineHeight = 145;
return /*#__PURE__*/_react.default.createElement(_LoadingElement.default, {
id: id,
style: DatePickerWrapperStyles,
className: className
}, /*#__PURE__*/_react.default.createElement(_reactDates.SingleDatePicker, {
date: date,
onDateChange: this.onDateChange,
focused: focused,
onFocusChange: _ref => {
var focused = _ref.focused;
return this.setState({
focused
});
},
initialVisibleMonth: () => date || initial_visible_month || (0, _moment.default)(),
isOutsideRange: this.isOutsideRange,
numberOfMonths: number_of_months_shown,
withPortal: with_portal && verticalFlag,
withFullScreenPortal: with_full_screen_portal && verticalFlag,
firstDayOfWeek: first_day_of_week,
enableOutsideDays: show_outside_days,
monthFormat: month_format,
displayFormat: display_format,
placeholder: placeholder,
showClearDate: clearable,
disabled: disabled,
keepOpenOnDateSelect: stay_open_on_select,
reopenPickerOnClearDate: reopen_calendar_on_clear,
isRTL: is_RTL,
orientation: calendar_orientation,
daySize: day_size,
verticalHeight: baselineHeight + day_size * 6 + 'px'
}));
}
}
exports.default = DatePickerSingle;
DatePickerSingle.propTypes = _DatePickerSingle.propTypes;