react-big-schedule 5.4.6 → 5.4.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,697 @@
1
+ "use strict";
2
+
3
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ Object.defineProperty(exports, "AddMorePopover", {
8
+ enumerable: true,
9
+ get: function get() {
10
+ return _AddMorePopover["default"];
11
+ }
12
+ });
13
+ Object.defineProperty(exports, "CellUnit", {
14
+ enumerable: true,
15
+ get: function get() {
16
+ return _default.CellUnit;
17
+ }
18
+ });
19
+ Object.defineProperty(exports, "DATETIME_FORMAT", {
20
+ enumerable: true,
21
+ get: function get() {
22
+ return _default.DATETIME_FORMAT;
23
+ }
24
+ });
25
+ Object.defineProperty(exports, "DATE_FORMAT", {
26
+ enumerable: true,
27
+ get: function get() {
28
+ return _default.DATE_FORMAT;
29
+ }
30
+ });
31
+ Object.defineProperty(exports, "DemoData", {
32
+ enumerable: true,
33
+ get: function get() {
34
+ return _sample["default"];
35
+ }
36
+ });
37
+ Object.defineProperty(exports, "DnDContext", {
38
+ enumerable: true,
39
+ get: function get() {
40
+ return _DnDContext["default"];
41
+ }
42
+ });
43
+ Object.defineProperty(exports, "DnDSource", {
44
+ enumerable: true,
45
+ get: function get() {
46
+ return _DnDSource["default"];
47
+ }
48
+ });
49
+ exports.Scheduler = Scheduler;
50
+ Object.defineProperty(exports, "SchedulerData", {
51
+ enumerable: true,
52
+ get: function get() {
53
+ return _SchedulerData["default"];
54
+ }
55
+ });
56
+ Object.defineProperty(exports, "SummaryPos", {
57
+ enumerable: true,
58
+ get: function get() {
59
+ return _default.SummaryPos;
60
+ }
61
+ });
62
+ Object.defineProperty(exports, "ViewType", {
63
+ enumerable: true,
64
+ get: function get() {
65
+ return _default.ViewType;
66
+ }
67
+ });
68
+ Object.defineProperty(exports, "wrapperFun", {
69
+ enumerable: true,
70
+ get: function get() {
71
+ return _WrapperFun["default"];
72
+ }
73
+ });
74
+ var _propTypes = _interopRequireDefault(require("prop-types"));
75
+ var _react = require("react");
76
+ var _default = require("../config/default");
77
+ var _sample = _interopRequireDefault(require("../sample-data/sample1"));
78
+ var _AddMorePopover = _interopRequireDefault(require("./AddMorePopover"));
79
+ var _AgendaView = _interopRequireDefault(require("./AgendaView"));
80
+ var _BodyView = _interopRequireDefault(require("./BodyView"));
81
+ var _DnDContext = _interopRequireDefault(require("./DnDContext"));
82
+ var _DnDSource = _interopRequireDefault(require("./DnDSource"));
83
+ var _HeaderView = _interopRequireDefault(require("./HeaderView"));
84
+ var _ResourceEvents = _interopRequireDefault(require("./ResourceEvents"));
85
+ var _ResourceView = _interopRequireDefault(require("./ResourceView"));
86
+ var _SchedulerData = _interopRequireDefault(require("./SchedulerData"));
87
+ var _SchedulerHeader = _interopRequireDefault(require("./SchedulerHeader"));
88
+ var _WrapperFun = _interopRequireDefault(require("./WrapperFun"));
89
+ var _jsxRuntime = require("react/jsx-runtime");
90
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
91
+ 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; }
92
+ 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; }
93
+ 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; }
94
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
95
+ 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); }
96
+ function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
97
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
98
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
99
+ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
100
+ function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
101
+ function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
102
+ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
103
+ function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
104
+ function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
105
+ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; } /**
106
+ * Render the scheduler UI with resource and agenda views, responsive sizing, and drag-and-drop support.
107
+ *
108
+ * @param {object} props - Component properties.
109
+ * @param {SchedulerData} props.schedulerData - Scheduler state and configuration used to drive rendering and behavior.
110
+ * @param {Array<DnDSource>} [props.dndSources] - Additional drag-and-drop sources to merge into the
111
+ * scheduler's DnD context.
112
+ * @param {React.RefObject<HTMLElement>} [props.parentRef] - Parent element ref used when sizing
113
+ * is driven by the parent container.
114
+ * @param {function(SchedulerData):void} props.prevClick - Callback invoked to navigate to the previous range.
115
+ * @param {function(SchedulerData):void} props.nextClick - Callback invoked to navigate to the next range.
116
+ * @param {function(SchedulerData, object):void} props.onViewChange - Callback invoked when the view type,
117
+ * agenda toggle, or perspective changes.
118
+ * @param {function(SchedulerData, string|Date):void} props.onSelectDate - Callback invoked when a date is selected.
119
+ * @param {React.ReactNode} [props.leftCustomHeader] - Optional custom content rendered on the left side of the header.
120
+ * @param {React.ReactNode} [props.rightCustomHeader] - Optional custom content rendered on the
121
+ * right side of the header.
122
+ * @param {function} [props.CustomResourceHeader] - Optional component used to render the resource header cell.
123
+ * @param {object} [props.configTableHeaderStyle] - Optional inline style object applied
124
+ * to the resource header container.
125
+ * @returns {JSX.Element} The scheduler root element tree to be rendered.
126
+ */
127
+ function Scheduler(props) {
128
+ var schedulerData = props.schedulerData,
129
+ dndSources = props.dndSources,
130
+ parentRef = props.parentRef,
131
+ prevClick = props.prevClick,
132
+ nextClick = props.nextClick,
133
+ onViewChange = props.onViewChange,
134
+ onSelectDate = props.onSelectDate,
135
+ leftCustomHeader = props.leftCustomHeader,
136
+ rightCustomHeader = props.rightCustomHeader,
137
+ CustomResourceHeader = props.CustomResourceHeader,
138
+ configTableHeaderStyle = props.configTableHeaderStyle;
139
+
140
+ // Initialize DnD context
141
+ var initDndContext = function initDndContext() {
142
+ var sources = [];
143
+ sources.push(new _DnDSource["default"](function (dndProps) {
144
+ return dndProps.eventItem;
145
+ }, schedulerData.config.dragAndDropEnabled));
146
+ if (dndSources !== undefined && dndSources.length > 0) {
147
+ sources = [].concat(_toConsumableArray(sources), _toConsumableArray(dndSources));
148
+ }
149
+ return new _DnDContext["default"](sources);
150
+ };
151
+
152
+ // State initialization
153
+ var _useState = (0, _react.useState)({
154
+ dndContext: initDndContext(),
155
+ contentScrollbarHeight: 17,
156
+ contentScrollbarWidth: 17,
157
+ resourceScrollbarHeight: 17,
158
+ resourceScrollbarWidth: 17,
159
+ documentWidth: 0,
160
+ documentHeight: 0,
161
+ headerHeight: 0
162
+ }),
163
+ _useState2 = _slicedToArray(_useState, 2),
164
+ state = _useState2[0],
165
+ setState = _useState2[1];
166
+
167
+ // Refs instead of class properties
168
+ var currentAreaRef = (0, _react.useRef)(-1);
169
+ var scrollLeftRef = (0, _react.useRef)(0);
170
+ var scrollTopRef = (0, _react.useRef)(0);
171
+ var schedulerHeadRef = (0, _react.useRef)(null);
172
+ var schedulerHeaderRef = (0, _react.useRef)(null);
173
+ var schedulerResourceRef = (0, _react.useRef)(null);
174
+ var schedulerContentRef = (0, _react.useRef)(null);
175
+ var schedulerContentBgTableRef = (0, _react.useRef)(null);
176
+ var ulObserverRef = (0, _react.useRef)(null);
177
+ var headerObserverRef = (0, _react.useRef)(null);
178
+
179
+ // Window resize handler
180
+ var onWindowResize = (0, _react.useCallback)(function () {
181
+ schedulerData._setDocumentWidth(document.documentElement.clientWidth);
182
+ schedulerData._setDocumentHeight(document.documentElement.clientHeight);
183
+ setState(function (prevState) {
184
+ return _objectSpread(_objectSpread({}, prevState), {}, {
185
+ documentWidth: document.documentElement.clientWidth,
186
+ documentHeight: document.documentElement.clientHeight
187
+ });
188
+ });
189
+ }, [schedulerData]);
190
+
191
+ // Effect for window resize event
192
+ (0, _react.useEffect)(function () {
193
+ if (schedulerData.isSchedulerResponsive() && !schedulerData.config.responsiveByParent || parentRef === undefined) {
194
+ schedulerData._setDocumentWidth(document.documentElement.clientWidth);
195
+ schedulerData._setDocumentHeight(document.documentElement.clientHeight);
196
+ window.addEventListener('resize', onWindowResize);
197
+ return function () {
198
+ window.removeEventListener('resize', onWindowResize);
199
+ };
200
+ }
201
+ }, [schedulerData, parentRef, onWindowResize]);
202
+
203
+ // Effect for parent element resize observation
204
+ (0, _react.useEffect)(function () {
205
+ if (parentRef !== undefined) {
206
+ if (schedulerData.config.responsiveByParent && !!parentRef.current) {
207
+ schedulerData._setDocumentWidth(parentRef.current.offsetWidth);
208
+ ulObserverRef.current = new ResizeObserver(function () {
209
+ if (parentRef.current) {
210
+ var _width = parentRef.current.offsetWidth;
211
+ var height = parentRef.current.offsetHeight;
212
+ schedulerData._setDocumentWidth(_width);
213
+ schedulerData._setDocumentHeight(height);
214
+ setState(function (prevState) {
215
+ return _objectSpread(_objectSpread({}, prevState), {}, {
216
+ documentWidth: _width,
217
+ documentHeight: height
218
+ });
219
+ });
220
+ }
221
+ });
222
+ ulObserverRef.current.observe(parentRef.current);
223
+ return function () {
224
+ if (ulObserverRef.current && parentRef.current) {
225
+ ulObserverRef.current.unobserve(parentRef.current);
226
+ }
227
+ };
228
+ }
229
+ }
230
+ }, [parentRef, schedulerData]);
231
+
232
+ // Effect for scheduler header resize observation
233
+ (0, _react.useEffect)(function () {
234
+ if (schedulerHeaderRef !== undefined) {
235
+ if (schedulerData.config.responsiveByParent && !!schedulerHeaderRef.current) {
236
+ schedulerData._setDocumentWidth(schedulerHeaderRef.current.offsetWidth);
237
+ schedulerData._setDocumentHeight(schedulerHeaderRef.current.offsetHeight);
238
+ headerObserverRef.current = new ResizeObserver(function (entries) {
239
+ entries.forEach(function (entry) {
240
+ // Get the DOM node
241
+ var node = entry.target;
242
+ // Get the height from the bounding rect (includes padding and border)
243
+ var rect = node.getBoundingClientRect();
244
+ // Get computed styles for margins
245
+ var style = window.getComputedStyle(node);
246
+ var marginTop = parseFloat(style.marginTop) || 0;
247
+ var marginBottom = parseFloat(style.marginBottom) || 0;
248
+ // Total height including margins
249
+ var totalHeight = rect.height + marginTop + marginBottom;
250
+ schedulerData._setSchedulerHeaderHeight(totalHeight);
251
+ setState(function (prevState) {
252
+ return _objectSpread(_objectSpread({}, prevState), {}, {
253
+ headerHeight: totalHeight
254
+ });
255
+ });
256
+ });
257
+ });
258
+ headerObserverRef.current.observe(schedulerHeaderRef.current);
259
+ return function () {
260
+ if (headerObserverRef.current && schedulerHeaderRef.current) {
261
+ headerObserverRef.current.unobserve(schedulerHeaderRef.current);
262
+ }
263
+ };
264
+ }
265
+ }
266
+ }, [schedulerHeaderRef, schedulerData]);
267
+
268
+ // Resolving scrollbar sizes
269
+ var resolveScrollbarSize = (0, _react.useCallback)(function () {
270
+ var contentScrollbarHeight = 17;
271
+ var contentScrollbarWidth = 17;
272
+ var resourceScrollbarHeight = 17;
273
+ var resourceScrollbarWidth = 17;
274
+ if (schedulerContentRef.current) {
275
+ contentScrollbarHeight = schedulerContentRef.current.offsetHeight - schedulerContentRef.current.clientHeight;
276
+ contentScrollbarWidth = schedulerContentRef.current.offsetWidth - schedulerContentRef.current.clientWidth;
277
+ }
278
+ if (schedulerResourceRef.current) {
279
+ resourceScrollbarHeight = schedulerResourceRef.current.offsetHeight - schedulerResourceRef.current.clientHeight;
280
+ resourceScrollbarWidth = schedulerResourceRef.current.offsetWidth - schedulerResourceRef.current.clientWidth;
281
+ }
282
+ var needSet = false;
283
+ var tmpState = {};
284
+ if (contentScrollbarHeight !== state.contentScrollbarHeight) {
285
+ tmpState = _objectSpread(_objectSpread({}, tmpState), {}, {
286
+ contentScrollbarHeight: contentScrollbarHeight
287
+ });
288
+ needSet = true;
289
+ }
290
+ if (contentScrollbarWidth !== state.contentScrollbarWidth) {
291
+ tmpState = _objectSpread(_objectSpread({}, tmpState), {}, {
292
+ contentScrollbarWidth: contentScrollbarWidth
293
+ });
294
+ needSet = true;
295
+ }
296
+ if (resourceScrollbarHeight !== state.resourceScrollbarHeight) {
297
+ tmpState = _objectSpread(_objectSpread({}, tmpState), {}, {
298
+ resourceScrollbarHeight: resourceScrollbarHeight
299
+ });
300
+ needSet = true;
301
+ }
302
+ if (resourceScrollbarWidth !== state.resourceScrollbarWidth) {
303
+ tmpState = _objectSpread(_objectSpread({}, tmpState), {}, {
304
+ resourceScrollbarWidth: resourceScrollbarWidth
305
+ });
306
+ needSet = true;
307
+ }
308
+ if (needSet) {
309
+ setState(function (prevState) {
310
+ return _objectSpread(_objectSpread({}, prevState), tmpState);
311
+ });
312
+ }
313
+ }, [state.contentScrollbarHeight, state.contentScrollbarWidth, state.resourceScrollbarHeight, state.resourceScrollbarWidth]);
314
+
315
+ // Effect for scrollToSpecialDayjs functionality
316
+ (0, _react.useEffect)(function () {
317
+ resolveScrollbarSize();
318
+ var localeDayjs = schedulerData.localeDayjs,
319
+ behaviors = schedulerData.behaviors;
320
+ if (schedulerData.getScrollToSpecialDayjs() && !!behaviors.getScrollSpecialDayjsFunc) {
321
+ if (!!schedulerContentRef.current && schedulerContentRef.current.scrollWidth > schedulerContentRef.current.clientWidth) {
322
+ var start = localeDayjs(new Date(schedulerData.startDate)).startOf('day');
323
+ var end = localeDayjs(new Date(schedulerData.endDate)).endOf('day');
324
+ var specialDayjs = behaviors.getScrollSpecialDayjsFunc(schedulerData, start, end);
325
+ if (specialDayjs >= start && specialDayjs <= end) {
326
+ var index = 0;
327
+ schedulerData.headers.forEach(function (item) {
328
+ var header = localeDayjs(new Date(item.time));
329
+ if (specialDayjs >= header) {
330
+ index += 1;
331
+ }
332
+ });
333
+ schedulerContentRef.current.scrollLeft = (index - 1) * schedulerData.getContentCellWidth();
334
+ schedulerData.setScrollToSpecialDayjs(false);
335
+ }
336
+ }
337
+ }
338
+ }, [schedulerData, resolveScrollbarSize]);
339
+
340
+ // Mouse event handlers
341
+ var onSchedulerHeadMouseOver = (0, _react.useCallback)(function () {
342
+ currentAreaRef.current = 2;
343
+ }, []);
344
+ var onSchedulerHeadMouseOut = (0, _react.useCallback)(function () {
345
+ currentAreaRef.current = -1;
346
+ }, []);
347
+ var onSchedulerHeadScroll = (0, _react.useCallback)(function () {
348
+ if ((currentAreaRef.current === 2 || currentAreaRef.current === -1) && schedulerContentRef.current.scrollLeft !== schedulerHeadRef.current.scrollLeft) {
349
+ schedulerContentRef.current.scrollLeft = schedulerHeadRef.current.scrollLeft;
350
+ }
351
+ }, []);
352
+ var onSchedulerResourceMouseOver = (0, _react.useCallback)(function () {
353
+ currentAreaRef.current = 1;
354
+ }, []);
355
+ var onSchedulerResourceMouseOut = (0, _react.useCallback)(function () {
356
+ currentAreaRef.current = -1;
357
+ }, []);
358
+ var onSchedulerResourceScroll = (0, _react.useCallback)(function () {
359
+ if (schedulerResourceRef.current) {
360
+ if ((currentAreaRef.current === 1 || currentAreaRef.current === -1) && schedulerContentRef.current.scrollTop !== schedulerResourceRef.current.scrollTop) {
361
+ schedulerContentRef.current.scrollTop = schedulerResourceRef.current.scrollTop;
362
+ }
363
+ }
364
+ }, []);
365
+ var onSchedulerContentMouseOver = (0, _react.useCallback)(function () {
366
+ currentAreaRef.current = 0;
367
+ }, []);
368
+ var onSchedulerContentMouseOut = (0, _react.useCallback)(function () {
369
+ currentAreaRef.current = -1;
370
+ }, []);
371
+ var onSchedulerContentScroll = (0, _react.useCallback)(function () {
372
+ if (schedulerResourceRef.current) {
373
+ if (currentAreaRef.current === 0 || currentAreaRef.current === -1) {
374
+ if (schedulerHeadRef.current.scrollLeft !== schedulerContentRef.current.scrollLeft) {
375
+ schedulerHeadRef.current.scrollLeft = schedulerContentRef.current.scrollLeft;
376
+ }
377
+ if (schedulerResourceRef.current.scrollTop !== schedulerContentRef.current.scrollTop) {
378
+ schedulerResourceRef.current.scrollTop = schedulerContentRef.current.scrollTop;
379
+ }
380
+ }
381
+ }
382
+ var onScrollLeft = props.onScrollLeft,
383
+ onScrollRight = props.onScrollRight,
384
+ onScrollTop = props.onScrollTop,
385
+ onScrollBottom = props.onScrollBottom;
386
+ if (schedulerContentRef.current.scrollLeft !== scrollLeftRef.current) {
387
+ if (schedulerContentRef.current.scrollLeft === 0 && onScrollLeft !== undefined) {
388
+ onScrollLeft(schedulerData, schedulerContentRef.current, schedulerContentRef.current.scrollWidth - schedulerContentRef.current.clientWidth);
389
+ }
390
+ if (Math.round(schedulerContentRef.current.scrollLeft) === schedulerContentRef.current.scrollWidth - schedulerContentRef.current.clientWidth && onScrollRight !== undefined) {
391
+ onScrollRight(schedulerData, schedulerContentRef.current, schedulerContentRef.current.scrollWidth - schedulerContentRef.current.clientWidth);
392
+ }
393
+ } else if (schedulerContentRef.current.scrollTop !== scrollTopRef.current) {
394
+ if (schedulerContentRef.current.scrollTop === 0 && onScrollTop !== undefined) {
395
+ onScrollTop(schedulerData, schedulerContentRef.current, schedulerContentRef.current.scrollHeight - schedulerContentRef.current.clientHeight);
396
+ }
397
+ if (Math.round(schedulerContentRef.current.scrollTop) === schedulerContentRef.current.scrollHeight - schedulerContentRef.current.clientHeight && onScrollBottom !== undefined) {
398
+ onScrollBottom(schedulerData, schedulerContentRef.current, schedulerContentRef.current.scrollHeight - schedulerContentRef.current.clientHeight);
399
+ }
400
+ }
401
+ scrollLeftRef.current = schedulerContentRef.current.scrollLeft;
402
+ scrollTopRef.current = schedulerContentRef.current.scrollTop;
403
+ }, [props, schedulerData]);
404
+
405
+ // Event handlers
406
+ var handleViewChange = (0, _react.useCallback)(function (e) {
407
+ var viewType = parseInt(e.target.value.charAt(0), 10);
408
+ var showAgenda = e.target.value.charAt(1) === '1';
409
+ var isEventPerspective = e.target.value.charAt(2) === '1';
410
+ onViewChange(schedulerData, {
411
+ viewType: viewType,
412
+ showAgenda: showAgenda,
413
+ isEventPerspective: isEventPerspective
414
+ });
415
+ }, [onViewChange, schedulerData]);
416
+ var goNext = (0, _react.useCallback)(function () {
417
+ nextClick(schedulerData);
418
+ }, [nextClick, schedulerData]);
419
+ var goBack = (0, _react.useCallback)(function () {
420
+ prevClick(schedulerData);
421
+ }, [prevClick, schedulerData]);
422
+ var onSelect = (0, _react.useCallback)(function (date) {
423
+ onSelectDate(schedulerData, date);
424
+ }, [onSelectDate, schedulerData]);
425
+
426
+ // Rendering
427
+ var viewType = schedulerData.viewType,
428
+ renderData = schedulerData.renderData,
429
+ showAgenda = schedulerData.showAgenda,
430
+ config = schedulerData.config;
431
+ var width = schedulerData.getSchedulerWidth();
432
+ var contentScrollbarHeight = state.contentScrollbarHeight,
433
+ contentScrollbarWidth = state.contentScrollbarWidth,
434
+ resourceScrollbarHeight = state.resourceScrollbarHeight,
435
+ resourceScrollbarWidth = state.resourceScrollbarWidth;
436
+ var showWeekNumber = config.showWeekNumber,
437
+ weekNumberRowHeight = config.weekNumberRowHeight;
438
+ var tbodyContent = /*#__PURE__*/(0, _jsxRuntime.jsx)("tr", {});
439
+ if (showAgenda) {
440
+ tbodyContent = /*#__PURE__*/(0, _jsxRuntime.jsx)(_AgendaView["default"], _objectSpread({}, props));
441
+ } else {
442
+ var _config$headerBorderC, _config$headerBorderC2, _config$weekNumberLab, _config$headerBorderC3;
443
+ var resourceTableWidth = schedulerData.getResourceTableWidth();
444
+ var schedulerContainerWidth = width - (config.resourceViewEnabled ? resourceTableWidth : 0);
445
+ var schedulerWidth = schedulerData.getContentTableWidth() - 1;
446
+ var eventDndSource = state.dndContext.getDndSource();
447
+ var displayRenderData = renderData.filter(function (o) {
448
+ return o.render;
449
+ });
450
+ var resourceEventsList = displayRenderData.map(function (item) {
451
+ return /*#__PURE__*/(0, _react.createElement)(_ResourceEvents["default"], _objectSpread(_objectSpread({}, props), {}, {
452
+ key: item.slotId,
453
+ resourceEvents: item,
454
+ dndSource: eventDndSource,
455
+ dndContext: state.dndContext
456
+ }));
457
+ });
458
+ var contentHeight = config.schedulerContentHeight;
459
+ var resourcePaddingBottom = resourceScrollbarHeight === 0 ? contentScrollbarHeight : 0;
460
+ var contentPaddingBottom = contentScrollbarHeight === 0 ? resourceScrollbarHeight : 0;
461
+ var schedulerContentStyle = {
462
+ overflowX: viewType === _default.ViewType.Week ? 'hidden' : 'auto',
463
+ overflowY: 'auto',
464
+ margin: '0px',
465
+ position: 'relative',
466
+ height: contentHeight,
467
+ paddingBottom: contentPaddingBottom
468
+ };
469
+ var resourceContentStyle = {
470
+ height: contentHeight,
471
+ overflowX: 'auto',
472
+ overflowY: 'auto',
473
+ width: resourceTableWidth + resourceScrollbarWidth - 2,
474
+ margin: "0px -".concat(contentScrollbarWidth, "px 0px 0px")
475
+ };
476
+ if (config.schedulerMaxHeight > 0) {
477
+ var totalHeaderHeight = config.tableHeaderHeight + (showWeekNumber ? weekNumberRowHeight : 0);
478
+ schedulerContentStyle = _objectSpread(_objectSpread({}, schedulerContentStyle), {}, {
479
+ maxHeight: config.schedulerMaxHeight - totalHeaderHeight
480
+ });
481
+ resourceContentStyle = _objectSpread(_objectSpread({}, resourceContentStyle), {}, {
482
+ maxHeight: config.schedulerMaxHeight - totalHeaderHeight
483
+ });
484
+ } else if (config.responsiveByParent && schedulerData.documentHeight > 0) {
485
+ // Responsive height minus SchedulerHeader
486
+ var availableHeight = schedulerData.getSchedulerHeight();
487
+ schedulerContentStyle = _objectSpread(_objectSpread({}, schedulerContentStyle), {}, {
488
+ height: availableHeight
489
+ });
490
+ resourceContentStyle = _objectSpread(_objectSpread({}, resourceContentStyle), {}, {
491
+ height: availableHeight
492
+ });
493
+ }
494
+ var resourceName = schedulerData.isEventPerspective ? config.taskName : config.resourceName;
495
+ tbodyContent = /*#__PURE__*/(0, _jsxRuntime.jsxs)("tr", {
496
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("td", {
497
+ style: {
498
+ display: config.resourceViewEnabled ? undefined : 'none',
499
+ width: resourceTableWidth,
500
+ verticalAlign: 'top'
501
+ },
502
+ children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
503
+ className: "resource-view",
504
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
505
+ style: _objectSpread({
506
+ borderBottom: "1px solid ".concat((_config$headerBorderC = config.headerBorderColor) !== null && _config$headerBorderC !== void 0 ? _config$headerBorderC : '#e9e9e9'),
507
+ height: config.tableHeaderHeight + (showWeekNumber ? weekNumberRowHeight : 0)
508
+ }, configTableHeaderStyle),
509
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
510
+ style: {
511
+ overflowX: 'scroll',
512
+ overflowY: 'hidden',
513
+ margin: "0px 0px -".concat(contentScrollbarHeight, "px")
514
+ },
515
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("table", {
516
+ className: "resource-table",
517
+ children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("thead", {
518
+ children: [showWeekNumber && /*#__PURE__*/(0, _jsxRuntime.jsx)("tr", {
519
+ style: {
520
+ height: weekNumberRowHeight
521
+ },
522
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("th", {
523
+ style: {
524
+ borderBottom: "1px solid ".concat((_config$headerBorderC2 = config.headerBorderColor) !== null && _config$headerBorderC2 !== void 0 ? _config$headerBorderC2 : '#e9e9e9'),
525
+ fontSize: '0.85em',
526
+ opacity: 0.7,
527
+ padding: '4px 8px'
528
+ },
529
+ children: (_config$weekNumberLab = config.weekNumberLabel) !== null && _config$weekNumberLab !== void 0 ? _config$weekNumberLab : 'Week No.'
530
+ })
531
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)("tr", {
532
+ style: {
533
+ height: config.tableHeaderHeight
534
+ },
535
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("th", {
536
+ className: "header3-text",
537
+ children: CustomResourceHeader ? /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomResourceHeader, {}) : resourceName
538
+ })
539
+ })]
540
+ })
541
+ })
542
+ })
543
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
544
+ style: resourceContentStyle,
545
+ ref: schedulerResourceRef,
546
+ onMouseOver: onSchedulerResourceMouseOver,
547
+ onFocus: onSchedulerResourceMouseOver,
548
+ onMouseOut: onSchedulerResourceMouseOut,
549
+ onBlur: onSchedulerResourceMouseOut,
550
+ onScroll: onSchedulerResourceScroll,
551
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ResourceView["default"], _objectSpread(_objectSpread({}, props), {}, {
552
+ contentScrollbarHeight: resourcePaddingBottom
553
+ }))
554
+ })]
555
+ })
556
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)("td", {
557
+ children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
558
+ className: "scheduler-view",
559
+ style: {
560
+ width: schedulerContainerWidth,
561
+ verticalAlign: 'top'
562
+ },
563
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
564
+ style: {
565
+ overflow: 'hidden',
566
+ borderBottom: "1px solid ".concat((_config$headerBorderC3 = config.headerBorderColor) !== null && _config$headerBorderC3 !== void 0 ? _config$headerBorderC3 : '#e9e9e9'),
567
+ height: config.tableHeaderHeight + (showWeekNumber ? weekNumberRowHeight : 0)
568
+ },
569
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
570
+ style: {
571
+ overflowX: 'scroll',
572
+ overflowY: 'hidden',
573
+ margin: "0px 0px -".concat(contentScrollbarHeight, "px")
574
+ },
575
+ ref: schedulerHeadRef,
576
+ onMouseOver: onSchedulerHeadMouseOver,
577
+ onFocus: onSchedulerHeadMouseOver,
578
+ onMouseOut: onSchedulerHeadMouseOut,
579
+ onBlur: onSchedulerHeadMouseOut,
580
+ onScroll: onSchedulerHeadScroll,
581
+ "aria-label": "Scheduler Header",
582
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
583
+ style: {
584
+ paddingRight: "".concat(contentScrollbarWidth, "px"),
585
+ width: schedulerWidth + contentScrollbarWidth
586
+ },
587
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("table", {
588
+ className: "scheduler-bg-table",
589
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderView["default"], _objectSpread({}, props))
590
+ })
591
+ })
592
+ })
593
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
594
+ style: schedulerContentStyle,
595
+ ref: schedulerContentRef,
596
+ onMouseOver: onSchedulerContentMouseOver,
597
+ onFocus: onSchedulerContentMouseOver,
598
+ onMouseOut: onSchedulerContentMouseOut,
599
+ onBlur: onSchedulerContentMouseOut,
600
+ onScroll: onSchedulerContentScroll,
601
+ children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
602
+ style: {
603
+ width: schedulerWidth
604
+ },
605
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
606
+ className: "scheduler-content",
607
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("table", {
608
+ className: "scheduler-content-table",
609
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("tbody", {
610
+ children: resourceEventsList
611
+ })
612
+ })
613
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
614
+ className: "scheduler-bg",
615
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("table", {
616
+ className: "scheduler-bg-table",
617
+ style: {
618
+ width: schedulerWidth
619
+ },
620
+ ref: schedulerContentBgTableRef,
621
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_BodyView["default"], _objectSpread({}, props))
622
+ })
623
+ })]
624
+ })
625
+ })]
626
+ })
627
+ })]
628
+ });
629
+ }
630
+ var schedulerHeader = /*#__PURE__*/(0, _jsxRuntime.jsx)(_SchedulerHeader["default"], {
631
+ ref: schedulerHeaderRef,
632
+ style: {
633
+ display: config.headerEnabled ? undefined : 'none',
634
+ marginBottom: config.headerEnabled ? '24px' : undefined
635
+ },
636
+ onViewChange: handleViewChange,
637
+ schedulerData: schedulerData,
638
+ onSelectDate: onSelect,
639
+ goNext: goNext,
640
+ goBack: goBack,
641
+ rightCustomHeader: rightCustomHeader,
642
+ leftCustomHeader: leftCustomHeader
643
+ });
644
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)("table", {
645
+ id: "rbs-root",
646
+ className: "rbs",
647
+ style: {
648
+ width: "".concat(width, "px")
649
+ },
650
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("thead", {
651
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("tr", {
652
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("td", {
653
+ colSpan: "2",
654
+ children: schedulerHeader
655
+ })
656
+ })
657
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)("tbody", {
658
+ children: tbodyContent
659
+ })]
660
+ });
661
+ }
662
+ Scheduler.propTypes = {
663
+ parentRef: _propTypes["default"].object,
664
+ schedulerData: _propTypes["default"].object.isRequired,
665
+ prevClick: _propTypes["default"].func.isRequired,
666
+ nextClick: _propTypes["default"].func.isRequired,
667
+ onViewChange: _propTypes["default"].func.isRequired,
668
+ onSelectDate: _propTypes["default"].func.isRequired,
669
+ onSetAddMoreState: _propTypes["default"].func,
670
+ updateEventStart: _propTypes["default"].func,
671
+ updateEventEnd: _propTypes["default"].func,
672
+ moveEvent: _propTypes["default"].func,
673
+ movingEvent: _propTypes["default"].func,
674
+ leftCustomHeader: _propTypes["default"].object,
675
+ rightCustomHeader: _propTypes["default"].object,
676
+ newEvent: _propTypes["default"].func,
677
+ subtitleGetter: _propTypes["default"].func,
678
+ eventItemClick: _propTypes["default"].func,
679
+ viewEventClick: _propTypes["default"].func,
680
+ viewEventText: _propTypes["default"].string,
681
+ viewEvent2Click: _propTypes["default"].func,
682
+ viewEvent2Text: _propTypes["default"].string,
683
+ conflictOccurred: _propTypes["default"].func,
684
+ eventItemTemplateResolver: _propTypes["default"].func,
685
+ dndSources: _propTypes["default"].array,
686
+ slotClickedFunc: _propTypes["default"].func,
687
+ toggleExpandFunc: _propTypes["default"].func,
688
+ slotItemTemplateResolver: _propTypes["default"].func,
689
+ nonAgendaCellHeaderTemplateResolver: _propTypes["default"].func,
690
+ onScrollLeft: _propTypes["default"].func,
691
+ onScrollRight: _propTypes["default"].func,
692
+ onScrollTop: _propTypes["default"].func,
693
+ onScrollBottom: _propTypes["default"].func,
694
+ CustomResourceHeader: _propTypes["default"].func,
695
+ CustomResourceCell: _propTypes["default"].func,
696
+ configTableHeaderStyle: _propTypes["default"].object
697
+ };