UNPKG

@up-group-ui/react-controls

Version:
55 lines 3.1 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var tslib_1 = require("tslib"); var jsx_runtime_1 = require("react/jsx-runtime"); var react_1 = (0, tslib_1.__importDefault)(require("react")); var utils_1 = require("../utils"); var VerticalLines = (function (_super) { (0, tslib_1.__extends)(VerticalLines, _super); function VerticalLines() { return _super !== null && _super.apply(this, arguments) || this; } VerticalLines.prototype.shouldComponentUpdate = function (nextProps, nextState) { return !(nextProps.canvasTimeStart === this.props.canvasTimeStart && nextProps.canvasTimeEnd === this.props.canvasTimeEnd && nextProps.canvasWidth === this.props.canvasWidth && nextProps.lineHeight === this.props.lineHeight && nextProps.lineCount === this.props.lineCount && nextProps.minUnit === this.props.minUnit && nextProps.timeSteps === this.props.timeSteps && nextProps.fixedHeader === this.props.fixedHeader && nextProps.height === this.props.height && nextProps.headerHeight === this.props.headerHeight); }; VerticalLines.prototype.render = function () { var _this = this; var _a = this.props, canvasTimeStart = _a.canvasTimeStart, canvasTimeEnd = _a.canvasTimeEnd, canvasWidth = _a.canvasWidth, minUnit = _a.minUnit, timeSteps = _a.timeSteps, height = _a.height, headerHeight = _a.headerHeight; var ratio = canvasWidth / (canvasTimeEnd - canvasTimeStart); var lines = []; (0, utils_1.iterateTimes)(canvasTimeStart, canvasTimeEnd, minUnit, timeSteps, function (time, nextTime) { var left = Math.round((time.valueOf() - canvasTimeStart) * ratio); var minUnitValue = time.get(minUnit === 'day' ? 'date' : minUnit); var firstOfType = minUnitValue === (minUnit === 'day' ? 1 : 0); var lineWidth = firstOfType ? 2 : 1; var labelWidth = Math.ceil((nextTime.valueOf() - time.valueOf()) * ratio) - lineWidth; var leftPush = _this.props.fixedHeader === 'fixed' && firstOfType ? -1 : 0; var classNames = 'rct-vl' + (firstOfType ? ' rct-vl-first' : '') + (minUnit === 'day' || minUnit === 'hour' || minUnit === 'minute' ? " rct-day-" + time.day() : ''); lines.push((0, jsx_runtime_1.jsx)("div", { className: classNames, style: { top: headerHeight + "px", left: left + leftPush + "px", width: labelWidth + "px", height: height - headerHeight + "px", } }, "line-" + time.valueOf())); }); return (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: "rct-vertical-lines" }, { children: lines }), void 0); }; VerticalLines.defaultProps = { fixedHeader: 'none', dayBackground: null, }; return VerticalLines; }(react_1.default.Component)); exports.default = VerticalLines; //# sourceMappingURL=VerticalLines.js.map