@zohodesk/components
Version:
In this Package, we Provide Some Basic Components to Build Web App
290 lines (233 loc) • 13.2 kB
JavaScript
;
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = exports.Span = void 0;
var _react = _interopRequireDefault(require("react"));
var _propTypes = require("./props/propTypes");
var _defaultProps = require("./props/defaultProps");
var _Layout = require("../Layout");
var _DateTimeModule = _interopRequireDefault(require("./DateTime.module.css"));
var _common = require("../utils/datetime/common");
var _DaysRow = _interopRequireDefault(require("./DaysRow"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
/* eslint css-modules/no-unused-class: [0, { markAsUsed: ['container', 'header', 'thArrowConatainer', 'thArrow', 'thMonYear', 'days', 'daysStr', 'timesection', 'timeStr', 'dropDownContainer', 'dropDown', 'footer', 'space'] }] */
var CalendarView = /*#__PURE__*/function (_React$PureComponent) {
_inherits(CalendarView, _React$PureComponent);
var _super = _createSuper(CalendarView);
function CalendarView(props) {
var _this;
_classCallCheck(this, CalendarView);
_this = _super.call(this, props);
_this.handleSelect = _this.handleSelect.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(CalendarView, [{
key: "handleSelect",
value: function handleSelect(day, month, year, e) {
var onSelect = this.props.onSelect;
onSelect(day, month, year, e);
}
}, {
key: "render",
value: function render() {
var _this2 = this;
var _this$props = this.props,
date = _this$props.date,
year = _this$props.year,
month = _this$props.month,
dataId = _this$props.dataId,
needBorder = _this$props.needBorder,
dayNames = _this$props.dayNames,
dayNamesShort = _this$props.dayNamesShort,
todayMonth = _this$props.todayMonth,
todayDate = _this$props.todayDate,
todayYear = _this$props.todayYear,
weekStartDay = _this$props.weekStartDay,
holidays = _this$props.holidays;
var userSeeDate = new Date(year, month, 1);
var userSeeDay = (userSeeDate.getDay() - weekStartDay + dayNames.length) % dayNames.length + 1;
var userSeeYear = userSeeDate.getFullYear();
var userSeeMonth = userSeeDate.getMonth();
var monthEnd = (0, _common.getMonthEnd)(month, year);
var lastMonth = 11;
var firstMonth = 0; // let noOfRow = 5;
// if (
// (monthEnd === 31 && userSeeDay >= 6) ||
// (monthEnd === 30 && userSeeDay === 7)
// ) {
// noOfRow = 6;
// } else if (monthEnd === 28 && userSeeDay === 1) {
// noOfRow = 4;
// }
var incremday = 1;
var incremleti = 1;
var isSelectedDay = false;
var isToday = false;
var rows = function () {
var rowArr = [];
for (var j = 1; j <= 6; j++) {
var dayArr = [];
var output = null;
for (var i = 1; i < 8; i++) {
isSelectedDay = false;
var tdclass = "".concat(_DateTimeModule["default"].datesStr, " ").concat(_DateTimeModule["default"].grid);
if (holidays.includes(i - 1)) {
tdclass += " ".concat(_DateTimeModule["default"].holiday);
}
if (incremleti >= userSeeDay && incremday <= monthEnd) {
if (parseInt(date) === incremday && parseInt(month) === userSeeMonth && parseInt(year) === userSeeYear) {
isSelectedDay = true;
} else if (todayDate === incremday && todayMonth === userSeeMonth && todayYear === userSeeYear) {
isToday = true;
isSelectedDay = false;
} else {
isSelectedDay = false;
isToday = false;
}
output = /*#__PURE__*/_react["default"].createElement(Span, {
i: i,
isActive: isSelectedDay,
tdclass: tdclass,
handleSelect: _this2.handleSelect,
incremday: incremday,
userSeeMonth: userSeeMonth,
userSeeYear: userSeeYear,
dataId: isSelectedDay ? "".concat(dataId, "_dateSelected") : "".concat(dataId, "_date"),
isToday: isToday
});
incremday++;
} else if (incremleti < userSeeDay) {
var prevMonth = userSeeMonth - 1;
var prevYear = userSeeYear;
if (userSeeMonth === firstMonth) {
prevMonth = lastMonth;
prevYear = userSeeYear - 1;
}
var prevMonthEnd = (0, _common.getMonthEnd)(prevMonth, prevYear);
var prevDate = prevMonthEnd - (userSeeDay - 1) + incremleti; // isSelectedDay =
// prevDate === parseInt(date) && parseInt(month) === prevMonth && parseInt(year) === prevYear ? true : false;
// isToday = prevDate === incremday && todayMonth === userSeeMonth && todayYear === userSeeYear ? true : false;
output = /*#__PURE__*/_react["default"].createElement(Span, {
i: i //isActive={isSelectedDay}
,
tdclass: "".concat(tdclass, " ").concat(_DateTimeModule["default"].invalidDate),
handleSelect: _this2.handleSelect,
incremday: prevDate,
userSeeMonth: prevMonth,
userSeeYear: prevYear,
dataId: "".concat(dataId, "_invalidDate") // isToday={isToday}
});
} else if (incremleti > monthEnd) {
var nextMonth = userSeeMonth + 1;
var nextYear = userSeeYear;
if (userSeeMonth === lastMonth) {
nextMonth = firstMonth;
nextYear = userSeeYear + 1;
}
var nextDate = incremleti - (userSeeDay - 1) - monthEnd; // console.log('last dates',incremleti, monthEnd,'nextDate',nextDate,'monthEnd',monthEnd,'userSeeDay',userSeeDay)
// isSelectedDay =
// nextDate === parseInt(date) && parseInt(month) === nextMonth && parseInt(year) === nextYear ? true : false;
// isToday = nextDate === incremday && todayMonth === userSeeMonth && todayYear === userSeeYear ? true : false;
output = /*#__PURE__*/_react["default"].createElement(Span, {
i: i // isActive={isSelectedDay}
,
tdclass: "".concat(tdclass, " ").concat(_DateTimeModule["default"].invalidDate),
handleSelect: _this2.handleSelect,
incremday: nextDate,
userSeeMonth: nextMonth,
userSeeYear: nextYear,
dataId: "".concat(dataId, "_invalidDate") //isToday={isToday}
});
} else {
output = /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
key: i,
className: "".concat(_DateTimeModule["default"].grid)
});
}
incremleti++;
dayArr.push(output);
}
/* eslint-disable react/forbid-component-props */
rowArr.push( /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
key: j,
alignBox: "row",
align: "center",
isCover: false,
className: _DateTimeModule["default"].dateRow
}, dayArr));
}
return rowArr;
}();
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_DaysRow["default"], {
dayNames: dayNames,
dayNamesShort: dayNamesShort,
ariaLabel: dayNamesShort,
holidays: holidays
}), /*#__PURE__*/_react["default"].createElement("div", {
"data-id": "".concat(dataId, "_dateContainer"),
"data-test-id": "".concat(dataId, "_dateContainer"),
className: "".concat(_DateTimeModule["default"].dateContainer, " ").concat(needBorder ? _DateTimeModule["default"].separator : '')
}, rows));
}
}]);
return CalendarView;
}(_react["default"].PureComponent);
exports["default"] = CalendarView;
CalendarView.propTypes = _propTypes.CalendarView_propTypes;
CalendarView.defaultProps = _defaultProps.CalendarView_defaultProps;
var Span = /*#__PURE__*/function (_React$PureComponent2) {
_inherits(Span, _React$PureComponent2);
var _super2 = _createSuper(Span);
function Span(props) {
var _this3;
_classCallCheck(this, Span);
_this3 = _super2.call(this, props);
_this3.handleSelectChild = _this3.handleSelectChild.bind(_assertThisInitialized(_this3));
return _this3;
}
_createClass(Span, [{
key: "handleSelectChild",
value: function handleSelectChild(e) {
var _this$props2 = this.props,
handleSelect = _this$props2.handleSelect,
incremday = _this$props2.incremday,
userSeeMonth = _this$props2.userSeeMonth,
userSeeYear = _this$props2.userSeeYear;
handleSelect(incremday, userSeeMonth, userSeeYear, e);
}
}, {
key: "render",
value: function render() {
var _this$props3 = this.props,
tdclass = _this$props3.tdclass,
incremday = _this$props3.incremday,
i = _this$props3.i,
dataId = _this$props3.dataId,
isActive = _this$props3.isActive,
isToday = _this$props3.isToday;
return /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
dataId: dataId,
className: "".concat(tdclass, " ").concat(isActive ? _DateTimeModule["default"].active : '', " ").concat(isToday ? _DateTimeModule["default"].today : ''),
key: i,
onClick: this.handleSelectChild,
"aria-label": incremday
}, incremday);
}
}]);
return Span;
}(_react["default"].PureComponent);
exports.Span = Span;
Span.propTypes = _propTypes.Span_propTypes;
Span.defaultProps = _defaultProps.Span_defaultProps;