react-big-calendar
Advanced tools
Comparing version 0.22.1 to 0.23.0
@@ -378,3 +378,4 @@ "use strict"; | ||
| return new Date(); | ||
| } | ||
| }, | ||
| dayLayoutAlgorithm: 'overlap' | ||
| }; | ||
@@ -598,2 +599,3 @@ Calendar.propTypes = process.env.NODE_ENV !== "production" ? { | ||
| * end: Date, | ||
| * resourceId: (number|string), | ||
| * slots: Array<Date>, | ||
@@ -647,3 +649,3 @@ * action: "select" | "click" | "doubleClick", | ||
| * ```js | ||
| * (range: { start: Date, end: Date }) => ?boolean | ||
| * (range: { start: Date, end: Date, resourceId: (number|string) }) => ?boolean | ||
| * ``` | ||
@@ -1044,3 +1046,11 @@ */ | ||
| showMore: _propTypes.default.func | ||
| }) | ||
| }), | ||
| /** | ||
| * A day event layout(arrangement) algorithm. | ||
| * `overlap` allows events to be overlapped. | ||
| * `no-overlap` resizes events to avoid overlap. | ||
| * or custom `Function(events, minimumStartDifference, slotMetrics, accessors)` | ||
| */ | ||
| dayLayoutAlgorithm: _propTypes2.DayLayoutAlgorithmPropType | ||
| } : {}; | ||
@@ -1047,0 +1057,0 @@ |
@@ -42,2 +42,4 @@ "use strict"; | ||
| var _propTypes2 = require("./utils/propTypes"); | ||
| var DayColumn = | ||
@@ -72,3 +74,4 @@ /*#__PURE__*/ | ||
| step = _this$props.step, | ||
| timeslots = _this$props.timeslots; | ||
| timeslots = _this$props.timeslots, | ||
| dayLayoutAlgorithm = _this$props.dayLayoutAlgorithm; | ||
@@ -83,3 +86,4 @@ var _assertThisInitialize = (0, _assertThisInitialized2.default)(_this), | ||
| slotMetrics: slotMetrics, | ||
| minimumStartDifference: Math.ceil(step * timeslots / 2) | ||
| minimumStartDifference: Math.ceil(step * timeslots / 2), | ||
| dayLayoutAlgorithm: dayLayoutAlgorithm | ||
| }); | ||
@@ -142,3 +146,4 @@ return styledEvents.map(function (_ref, idx) { | ||
| start: start, | ||
| end: end | ||
| end: end, | ||
| resourceId: _this.props.resource | ||
| }) === false) return; | ||
@@ -316,4 +321,3 @@ } | ||
| } | ||
| }; | ||
| } | ||
| /** | ||
@@ -323,2 +327,4 @@ * @param tail {Boolean} - whether `positionTimeIndicator` call should be | ||
| */ | ||
| ; | ||
| _proto.setTimeIndicatorPositionUpdateInterval = function setTimeIndicatorPositionUpdateInterval(tail) { | ||
@@ -460,3 +466,4 @@ var _this2 = this; | ||
| dragThroughEvents: _propTypes.default.bool, | ||
| resource: _propTypes.default.any | ||
| resource: _propTypes.default.any, | ||
| dayLayoutAlgorithm: _propTypes2.DayLayoutAlgorithmPropType | ||
| } : {}; | ||
@@ -463,0 +470,0 @@ DayColumn.defaultProps = { |
@@ -42,2 +42,4 @@ "use strict"; | ||
| var _propTypes2 = require("./utils/propTypes"); | ||
| var TimeGrid = | ||
@@ -114,2 +116,3 @@ /*#__PURE__*/ | ||
| _this.contentRef = _react.default.createRef(); | ||
| _this._scrollRatio = null; | ||
| return _this; | ||
@@ -170,3 +173,4 @@ } | ||
| accessors = _this$props2.accessors, | ||
| localizer = _this$props2.localizer; | ||
| localizer = _this$props2.localizer, | ||
| dayLayoutAlgorithm = _this$props2.dayLayoutAlgorithm; | ||
| var resources = this.memoizedResources(this.props.resources, accessors); | ||
@@ -190,3 +194,4 @@ var groupedEvents = resources.groupEvents(events); | ||
| date: date, | ||
| events: daysEvents | ||
| events: daysEvents, | ||
| dayLayoutAlgorithm: dayLayoutAlgorithm | ||
| })); | ||
@@ -300,3 +305,3 @@ }); | ||
| _proto.applyScroll = function applyScroll() { | ||
| if (this._scrollRatio) { | ||
| if (this._scrollRatio != null) { | ||
| var content = this.contentRef.current; | ||
@@ -354,3 +359,4 @@ content.scrollTop = content.scrollHeight * this._scrollRatio; // Only do this once | ||
| onDrillDown: _propTypes.default.func, | ||
| getDrilldownView: _propTypes.default.func.isRequired | ||
| getDrilldownView: _propTypes.default.func.isRequired, | ||
| dayLayoutAlgorithm: _propTypes2.DayLayoutAlgorithmPropType | ||
| } : {}; | ||
@@ -357,0 +363,0 @@ TimeGrid.defaultProps = { |
@@ -14,3 +14,8 @@ "use strict"; | ||
| function stringifyPercent(v) { | ||
| return typeof v === 'string' ? v : v + '%'; | ||
| } | ||
| /* eslint-disable react/prop-types */ | ||
| function TimeGridEvent(props) { | ||
@@ -59,5 +64,4 @@ var _extends2; | ||
| style: (0, _extends3.default)({}, userProps.style, (_extends2 = { | ||
| top: top + "%", | ||
| height: height + "%" | ||
| }, _extends2[rtl ? 'right' : 'left'] = Math.max(0, xOffset) + "%", _extends2.width = width + "%", _extends2)), | ||
| top: stringifyPercent(top) | ||
| }, _extends2[rtl ? 'right' : 'left'] = stringifyPercent(xOffset), _extends2.width = stringifyPercent(width), _extends2.height = stringifyPercent(height), _extends2)), | ||
| title: tooltip ? (typeof label === 'string' ? label + ': ' : '') + tooltip : undefined, | ||
@@ -64,0 +68,0 @@ className: (0, _clsx.default)('rbc-event', className, userProps.className, { |
@@ -8,216 +8,32 @@ "use strict"; | ||
| var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass")); | ||
| var _overlap = _interopRequireDefault(require("./layout-algorithms/overlap")); | ||
| var _sortBy = _interopRequireDefault(require("lodash/sortBy")); | ||
| var _noOverlap = _interopRequireDefault(require("./layout-algorithms/no-overlap")); | ||
| var Event = | ||
| /*#__PURE__*/ | ||
| function () { | ||
| function Event(data, _ref) { | ||
| var accessors = _ref.accessors, | ||
| slotMetrics = _ref.slotMetrics; | ||
| /*eslint no-unused-vars: "off"*/ | ||
| var DefaultAlgorithms = { | ||
| overlap: _overlap.default, | ||
| 'no-overlap': _noOverlap.default | ||
| }; | ||
| var _slotMetrics$getRange = slotMetrics.getRange(accessors.start(data), accessors.end(data)), | ||
| start = _slotMetrics$getRange.start, | ||
| startDate = _slotMetrics$getRange.startDate, | ||
| end = _slotMetrics$getRange.end, | ||
| endDate = _slotMetrics$getRange.endDate, | ||
| top = _slotMetrics$getRange.top, | ||
| height = _slotMetrics$getRange.height; | ||
| function isFunction(a) { | ||
| return !!(a && a.constructor && a.call && a.apply); | ||
| } // | ||
| this.start = start; | ||
| this.end = end; | ||
| this.startMs = +startDate; | ||
| this.endMs = +endDate; | ||
| this.top = top; | ||
| this.height = height; | ||
| this.data = data; | ||
| } | ||
| /** | ||
| * The event's width without any overlap. | ||
| */ | ||
| function getStyledEvents(_ref) { | ||
| var events = _ref.events, | ||
| minimumStartDifference = _ref.minimumStartDifference, | ||
| slotMetrics = _ref.slotMetrics, | ||
| accessors = _ref.accessors, | ||
| dayLayoutAlgorithm = _ref.dayLayoutAlgorithm; | ||
| var algorithm = null; | ||
| if (dayLayoutAlgorithm in DefaultAlgorithms) algorithm = DefaultAlgorithms[dayLayoutAlgorithm]; | ||
| (0, _createClass2.default)(Event, [{ | ||
| key: "_width", | ||
| get: function get() { | ||
| // The container event's width is determined by the maximum number of | ||
| // events in any of its rows. | ||
| if (this.rows) { | ||
| var columns = this.rows.reduce(function (max, row) { | ||
| return Math.max(max, row.leaves.length + 1); | ||
| }, // add itself | ||
| 0) + 1; // add the container | ||
| return 100 / columns; | ||
| } | ||
| var availableWidth = 100 - this.container._width; // The row event's width is the space left by the container, divided | ||
| // among itself and its leaves. | ||
| if (this.leaves) { | ||
| return availableWidth / (this.leaves.length + 1); | ||
| } // The leaf event's width is determined by its row's width | ||
| return this.row._width; | ||
| } | ||
| /** | ||
| * The event's calculated width, possibly with extra width added for | ||
| * overlapping effect. | ||
| */ | ||
| }, { | ||
| key: "width", | ||
| get: function get() { | ||
| var noOverlap = this._width; | ||
| var overlap = Math.min(100, this._width * 1.7); // Containers can always grow. | ||
| if (this.rows) { | ||
| return overlap; | ||
| } // Rows can grow if they have leaves. | ||
| if (this.leaves) { | ||
| return this.leaves.length > 0 ? overlap : noOverlap; | ||
| } // Leaves can grow unless they're the last item in a row. | ||
| var leaves = this.row.leaves; | ||
| var index = leaves.indexOf(this); | ||
| return index === leaves.length - 1 ? noOverlap : overlap; | ||
| } | ||
| }, { | ||
| key: "xOffset", | ||
| get: function get() { | ||
| // Containers have no offset. | ||
| if (this.rows) return 0; // Rows always start where their container ends. | ||
| if (this.leaves) return this.container._width; // Leaves are spread out evenly on the space left by its row. | ||
| var _this$row = this.row, | ||
| leaves = _this$row.leaves, | ||
| xOffset = _this$row.xOffset, | ||
| _width = _this$row._width; | ||
| var index = leaves.indexOf(this) + 1; | ||
| return xOffset + index * _width; | ||
| } | ||
| }]); | ||
| return Event; | ||
| }(); | ||
| /** | ||
| * Return true if event a and b is considered to be on the same row. | ||
| */ | ||
| function onSameRow(a, b, minimumStartDifference) { | ||
| return (// Occupies the same start slot. | ||
| Math.abs(b.start - a.start) < minimumStartDifference || // A's start slot overlaps with b's end slot. | ||
| b.start > a.start && b.start < a.end | ||
| ); | ||
| } | ||
| function sortByRender(events) { | ||
| var sortedByTime = (0, _sortBy.default)(events, ['startMs', function (e) { | ||
| return -e.endMs; | ||
| }]); | ||
| var sorted = []; | ||
| while (sortedByTime.length > 0) { | ||
| var event = sortedByTime.shift(); | ||
| sorted.push(event); | ||
| for (var i = 0; i < sortedByTime.length; i++) { | ||
| var test = sortedByTime[i]; // Still inside this event, look for next. | ||
| if (event.endMs > test.startMs) continue; // We've found the first event of the next event group. | ||
| // If that event is not right next to our current event, we have to | ||
| // move it here. | ||
| if (i > 0) { | ||
| var _event = sortedByTime.splice(i, 1)[0]; | ||
| sorted.push(_event); | ||
| } // We've already found the next event group, so stop looking. | ||
| break; | ||
| } | ||
| if (!isFunction(algorithm)) { | ||
| // invalid algorithm | ||
| return []; | ||
| } | ||
| return sorted; | ||
| } | ||
| function getStyledEvents(_ref2) { | ||
| var events = _ref2.events, | ||
| minimumStartDifference = _ref2.minimumStartDifference, | ||
| slotMetrics = _ref2.slotMetrics, | ||
| accessors = _ref2.accessors; | ||
| // Create proxy events and order them so that we don't have | ||
| // to fiddle with z-indexes. | ||
| var proxies = events.map(function (event) { | ||
| return new Event(event, { | ||
| slotMetrics: slotMetrics, | ||
| accessors: accessors | ||
| }); | ||
| }); | ||
| var eventsInRenderOrder = sortByRender(proxies); // Group overlapping events, while keeping order. | ||
| // Every event is always one of: container, row or leaf. | ||
| // Containers can contain rows, and rows can contain leaves. | ||
| var containerEvents = []; | ||
| var _loop = function _loop(i) { | ||
| var event = eventsInRenderOrder[i]; // Check if this event can go into a container event. | ||
| var container = containerEvents.find(function (c) { | ||
| return c.end > event.start || Math.abs(event.start - c.start) < minimumStartDifference; | ||
| }); // Couldn't find a container — that means this event is a container. | ||
| if (!container) { | ||
| event.rows = []; | ||
| containerEvents.push(event); | ||
| return "continue"; | ||
| } // Found a container for the event. | ||
| event.container = container; // Check if the event can be placed in an existing row. | ||
| // Start looking from behind. | ||
| var row = null; | ||
| for (var j = container.rows.length - 1; !row && j >= 0; j--) { | ||
| if (onSameRow(container.rows[j], event, minimumStartDifference)) { | ||
| row = container.rows[j]; | ||
| } | ||
| } | ||
| if (row) { | ||
| // Found a row, so add it. | ||
| row.leaves.push(event); | ||
| event.row = row; | ||
| } else { | ||
| // Couldn't find a row – that means this event is a row. | ||
| event.leaves = []; | ||
| container.rows.push(event); | ||
| } | ||
| }; | ||
| for (var i = 0; i < eventsInRenderOrder.length; i++) { | ||
| var _ret = _loop(i); | ||
| if (_ret === "continue") continue; | ||
| } // Return the original events, along with their styles. | ||
| return eventsInRenderOrder.map(function (event) { | ||
| return { | ||
| event: event.data, | ||
| style: { | ||
| top: event.top, | ||
| height: event.height, | ||
| width: event.width, | ||
| xOffset: event.xOffset | ||
| } | ||
| }; | ||
| }); | ||
| return algorithm.apply(this, arguments); | ||
| } |
@@ -6,3 +6,3 @@ "use strict"; | ||
| exports.__esModule = true; | ||
| exports.views = exports.dateRangeFormat = exports.dateFormat = exports.accessor = void 0; | ||
| exports.DayLayoutAlgorithmPropType = exports.views = exports.dateRangeFormat = exports.dateFormat = exports.accessor = void 0; | ||
@@ -57,2 +57,6 @@ var _propTypes = _interopRequireDefault(require("prop-types")); | ||
| exports.views = views; | ||
| exports.views = views; | ||
| var DayLayoutAlgorithmPropType = _propTypes.default.oneOfType([_propTypes.default.oneOf(['overlap', 'no-overlap']), _propTypes.default.func]); | ||
| exports.DayLayoutAlgorithmPropType = DayLayoutAlgorithmPropType; |
| { | ||
| "name": "react-big-calendar", | ||
| "version": "0.22.1", | ||
| "version": "0.23.0", | ||
| "description": "Calendar! with events", | ||
@@ -151,3 +151,3 @@ "author": { | ||
| "homepage": "https://github.com/intljusticemission/react-big-calendar#readme", | ||
| "_id": "react-big-calendar@0.22.0" | ||
| "_id": "react-big-calendar@0.22.1" | ||
| } |
@@ -54,2 +54,3 @@ # react-big-calendar | ||
| endAccessor="end" | ||
| style={{height: 500}} | ||
| /> | ||
@@ -75,2 +76,3 @@ </div> | ||
| endAccessor="end" | ||
| style={{height: 500}} | ||
| /> | ||
@@ -77,0 +79,0 @@ </div> |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is too big to display
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by1.68%
1121969
- Number of package files
- increased by2.78%
74
- Lines of code
- increased by1.62%
26023
- Number of lines in readme file
- increased by2.08%
98
No dependency changes