@talend/react-components
Version:
Set of react components.
120 lines (119 loc) • 5.24 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = require("react");
var _propTypes = _interopRequireDefault(require("prop-types"));
var _designSystem = require("@talend/design-system");
var _translate = _interopRequireDefault(require("../../../translate"));
var _DatePicker = _interopRequireDefault(require("../../pickers/DatePicker"));
var _HeaderTitle = _interopRequireDefault(require("../HeaderTitle"));
var _ViewLayout = _interopRequireDefault(require("../ViewLayout"));
var _DateViewModule = _interopRequireDefault(require("./DateView.module.scss"));
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: 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); } /**
* Get the positive euclidean modulo number from a dividend and a divisor
* @param {number} dividend Dividend
* @param {number} divisor Divisor
* @return {number} The positive euclidean modulo
*/
function euclideanModulo(dividend, divisor) {
const modulo = (dividend % divisor + divisor) % divisor;
return modulo < 0 ? modulo + Math.abs(divisor) : modulo;
}
class DateView extends _react.PureComponent {
constructor(props) {
super(props);
this.goToPreviousMonth = this.incrementMonthIndex.bind(this, -1);
this.goToNextMonth = this.incrementMonthIndex.bind(this, 1);
}
incrementMonthIndex(monthIncrement, callback) {
const monthIndexIncremented = this.props.calendar.monthIndex + monthIncrement;
const newMonthIndex = euclideanModulo(monthIndexIncremented, 12);
const yearIncrement = Math.floor(monthIndexIncremented / 12);
const newYear = this.props.calendar.year + yearIncrement;
this.props.onSelectMonthYear({
monthIndex: newMonthIndex,
year: newYear
}, callback);
}
render() {
const {
t
} = this.props;
const header = {
leftElement: /*#__PURE__*/(0, _jsxRuntime.jsx)(_designSystem.ButtonIcon, {
size: "S",
icon: "arrow-left",
onClick: () => this.goToPreviousMonth(),
tabIndex: "-1",
children: t('DATEPICKER_MONTH_PREVIOUS', 'Go to previous month')
}),
middleElement: /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderTitle.default, {
monthIndex: this.props.calendar.monthIndex,
year: this.props.calendar.year,
button: {
'aria-label': t('DATEPICKER_TO_MONTH_YEAR', {
defaultValue: 'Switch to month view'
}),
onClick: this.props.onTitleClick,
tabIndex: this.props.allowFocus ? 0 : -1
},
onSelectYear: this.props.onSelectYear
}),
rightElement: /*#__PURE__*/(0, _jsxRuntime.jsx)(_designSystem.ButtonIcon, {
size: "S",
icon: "arrow-right",
onClick: () => this.goToNextMonth(),
tabIndex: "-1",
children: t('DATEPICKER_MONTH_NEXT', 'Go to next month')
})
};
const bodyElement = /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
className: _DateViewModule.default.body,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
className: _DateViewModule.default.date,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DatePicker.default, {
allowFocus: this.props.allowFocus,
calendar: this.props.calendar,
selectedDate: this.props.selectedDate,
startDate: this.props.startDate,
endDate: this.props.endDate,
onSelect: this.props.onSelectDate,
goToPreviousMonth: this.goToPreviousMonth,
goToNextMonth: this.goToNextMonth,
isDisabledChecker: this.props.isDisabledChecker
})
}, "date")
});
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ViewLayout.default, {
header: header,
bodyElement: bodyElement
});
}
}
_defineProperty(DateView, "propTypes", {
allowFocus: _propTypes.default.bool,
calendar: _propTypes.default.shape({
monthIndex: _propTypes.default.number.isRequired,
year: _propTypes.default.number.isRequired
}).isRequired,
onTitleClick: _propTypes.default.func.isRequired,
onSelectMonthYear: _propTypes.default.func.isRequired,
onSelectDate: _propTypes.default.func.isRequired,
onSelectYear: _propTypes.default.func.isRequired,
selectedDate: _propTypes.default.instanceOf(Date),
startDate: _propTypes.default.instanceOf(Date),
endDate: _propTypes.default.instanceOf(Date),
isDisabledChecker: _propTypes.default.func,
t: _propTypes.default.func
});
_defineProperty(DateView, "defaultProps", {
t: (0, _translate.default)()
});
var _default = exports.default = DateView;
//# sourceMappingURL=DateView.component.js.map