@fullcalendar/list 7.0.0-beta.1 → 7.0.0-beta.3

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.
package/internal.js CHANGED
@@ -1,49 +1,29 @@
1
- import { injectStyles, BaseComponent, getUniqueDomId, getStickyHeaderDates, getDateMeta, buildNavLinkAttrs, ContentContainer, getDayClassNames, formatDayString, createFormatter, EventContainer, getEventRangeAnchorAttrs, isMultiDayRange, buildEventRangeTimeText, DateComponent, memoize, getIsHeightAuto, ViewContainer, Scroller, NowTimer, sortEventSegs, getEventRangeMeta, sliceEventStore, intersectRanges, startOfDay, addDays } from '@fullcalendar/core/internal.js';
1
+ import { BaseComponent, getStickyHeaderDates, getDateMeta, buildNavLinkAttrs, joinClassNames, ContentContainer, getDayClassName, formatDayString, createFormatter, watchWidth, setRef, getEventRangeAnchorAttrs, EventContainer, buildEventRangeTimeText, memoize, sortEventSegs, RefMap, afterSize, getEventKey, getEventRangeMeta, DateComponent, getIsHeightAuto, ViewContainer, Scroller, NowTimer, sliceEventStore, intersectRanges, startOfDay, addDays, injectStyles } from '@fullcalendar/core/internal.js';
2
2
  import { createElement, Fragment } from '@fullcalendar/core/preact.js';
3
3
 
4
- var css_248z = ":root{--fc-list-event-dot-width:10px;--fc-list-event-hover-bg-color:#f5f5f5}.fc-table{border-spacing:0;width:100%}.fc-table>*>*>*{border-color:var(--fc-border-color);border-style:solid;border-width:0 0 1px;padding:0}.fc-table>:last-child>:last-child>*{border-bottom-width:0}.fc-list-day-inner,.fc-list-event-dot-cell,.fc-list-event-time,.fc-list-event-title{padding:8px 14px}.fc-direction-ltr .fc-list-event-dot-cell{padding-right:0}.fc-direction-rtl .fc-list-event-dot-cell{padding-left:0}.fc-list-empty{align-items:center;background-color:var(--fc-neutral-bg-color);display:flex;height:100%;justify-content:center}.fc-list-empty-inner{margin:5em 0}.fc-list-day-cell-sticky{background:var(--fc-page-bg-color);position:sticky;top:0}.fc-list-day-inner{background:var(--fc-neutral-bg-color);display:flex;justify-content:space-between}.fc-list-event.fc-event-forced-url{cursor:pointer}.fc-list-event:hover td{background-color:var(--fc-list-event-hover-bg-color)}.fc-list-event-dot-cell,.fc-list-event-time{white-space:nowrap;width:1px}.fc-list-event-dot{border:calc(var(--fc-list-event-dot-width)/2) solid var(--fc-event-border-color);border-radius:calc(var(--fc-list-event-dot-width)/2);box-sizing:content-box;display:inline-block;height:0;width:0}.fc-list-event-title a{color:inherit;text-decoration:none}.fc-list-event.fc-event-forced-url:hover a{text-decoration:underline}";
5
- injectStyles(css_248z);
6
-
7
- class ListViewHeaderRow extends BaseComponent {
8
- constructor() {
9
- super(...arguments);
10
- this.state = {
11
- textId: getUniqueDomId(),
12
- };
13
- }
4
+ class ListDayHeader extends BaseComponent {
14
5
  render() {
15
- let { theme, dateEnv, options, viewApi } = this.context;
16
- let { cellId, dayDate, todayRange } = this.props;
17
- let { textId } = this.state;
6
+ let { dateEnv, options, viewApi } = this.context;
7
+ let { dayDate, todayRange } = this.props;
18
8
  let stickyHeaderDates = !this.props.forPrint && getStickyHeaderDates(options);
19
9
  let dayMeta = getDateMeta(dayDate, todayRange);
20
10
  // will ever be falsy?
21
11
  let text = options.listDayFormat ? dateEnv.format(dayDate, options.listDayFormat) : '';
22
12
  // will ever be falsy? also, BAD NAME "alt"
23
13
  let sideText = options.listDaySideFormat ? dateEnv.format(dayDate, options.listDaySideFormat) : '';
24
- let renderProps = Object.assign({ date: dateEnv.toDate(dayDate), view: viewApi, textId,
25
- text,
14
+ let renderProps = Object.assign({ date: dateEnv.toDate(dayDate), view: viewApi, text,
26
15
  sideText, navLinkAttrs: buildNavLinkAttrs(this.context, dayDate), sideNavLinkAttrs: buildNavLinkAttrs(this.context, dayDate, 'day', false) }, dayMeta);
27
16
  // TODO: make a reusable HOC for dayHeader (used in daygrid/timegrid too)
28
- return (createElement(ContentContainer, { elTag: "tr", elClasses: [
29
- 'fc-list-day',
30
- ...getDayClassNames(dayMeta, theme),
31
- ], elAttrs: {
32
- 'data-date': formatDayString(dayDate),
33
- }, renderProps: renderProps, generatorName: "dayHeaderContent", customGenerator: options.dayHeaderContent, defaultGenerator: renderInnerContent, classNameGenerator: options.dayHeaderClassNames, didMount: options.dayHeaderDidMount, willUnmount: options.dayHeaderWillUnmount }, (InnerContent) => (createElement(InnerContent, { elTag: "th", elAttrs: {
34
- id: cellId,
35
- colSpan: 3,
36
- 'aria-labelledby': textId,
37
- }, elClasses: [
38
- 'fc-list-day-cell',
39
- stickyHeaderDates ? 'fc-list-day-cell-sticky' : '',
40
- ] }))));
17
+ return (createElement("div", { className: joinClassNames('fc-list-day-outer', stickyHeaderDates && 'fc-list-day-outer-sticky') },
18
+ createElement(ContentContainer, { tag: "div", className: joinClassNames('fc-list-day', getDayClassName(dayMeta)), attrs: {
19
+ 'data-date': formatDayString(dayDate),
20
+ }, renderProps: renderProps, generatorName: "dayHeaderContent", customGenerator: options.dayHeaderContent, defaultGenerator: renderInnerContent, classNameGenerator: options.dayHeaderClassNames, didMount: options.dayHeaderDidMount, willUnmount: options.dayHeaderWillUnmount })));
41
21
  }
42
22
  }
43
23
  function renderInnerContent(props) {
44
- return (createElement("div", { className: 'fc-list-day-inner' },
24
+ return (createElement(Fragment, null,
45
25
  props.text && (createElement("a", Object.assign({ id: props.textId, className: "fc-list-day-text" }, props.navLinkAttrs), props.text)),
46
- props.sideText && ( /* not keyboard tabbable */createElement("a", Object.assign({ "aria-hidden": true, className: "fc-list-day-side-text" }, props.sideNavLinkAttrs), props.sideText))));
26
+ props.sideText && ( /* not keyboard tabbable */createElement("a", Object.assign({ className: "fc-list-day-side-text" }, props.sideNavLinkAttrs), props.sideText))));
47
27
  }
48
28
 
49
29
  const DEFAULT_TIME_FORMAT = createFormatter({
@@ -51,92 +31,131 @@ const DEFAULT_TIME_FORMAT = createFormatter({
51
31
  minute: '2-digit',
52
32
  meridiem: 'short',
53
33
  });
54
- class ListViewEventRow extends BaseComponent {
34
+ class ListEvent extends BaseComponent {
35
+ constructor() {
36
+ super(...arguments);
37
+ this.handleTitleEl = (titleEl) => {
38
+ if (this.disconnectTitleWidth) {
39
+ this.disconnectTitleWidth();
40
+ }
41
+ if (titleEl) {
42
+ this.disconnectTitleWidth = watchWidth(titleEl, (titleWidth) => {
43
+ setRef(this.props.timeWidthRef, titleWidth);
44
+ });
45
+ }
46
+ };
47
+ }
55
48
  render() {
56
49
  let { props, context } = this;
50
+ let { eventRange } = props;
57
51
  let { options } = context;
58
- let { eventRange, timeHeaderId, eventHeaderId, dateHeaderId } = props;
59
52
  let timeFormat = options.eventTimeFormat || DEFAULT_TIME_FORMAT;
60
- return (createElement(EventContainer, Object.assign({}, props, { elTag: "tr", elClasses: [
61
- 'fc-list-event',
62
- eventRange.def.url && 'fc-event-forced-url',
63
- ], defaultGenerator: () => renderEventInnerContent(eventRange, context) /* weird */, eventRange: eventRange, timeText: "", disableDragging: true, disableResizing: true }), (InnerContent, eventContentArg) => (createElement(Fragment, null,
64
- buildTimeContent(eventRange, props.isStart, props.isEnd, props.segStart, props.segEnd, timeFormat, context, timeHeaderId, dateHeaderId),
65
- createElement("td", { "aria-hidden": true, className: "fc-list-event-dot-cell" },
53
+ let anchorAttrs = getEventRangeAnchorAttrs(eventRange, context);
54
+ return (createElement(EventContainer, Object.assign({}, props, { tag: anchorAttrs ? 'a' : 'div', attrs: anchorAttrs, className: 'fc-list-event', defaultGenerator: renderEventTitleOnly, eventRange: eventRange, timeText: "", disableDragging: true, disableResizing: true }), (InnerContent, eventContentArg) => (createElement(Fragment, null,
55
+ createElement("div", { className: 'fc-list-event-time-outer', style: { width: props.timeOuterWidth } }, this.buildTimeContent(eventRange, props.slicedStart, props.slicedEnd, props.isStart, props.isEnd, timeFormat, context)),
56
+ createElement("div", { className: "fc-list-event-dot-outer" },
66
57
  createElement("span", { className: "fc-list-event-dot", style: {
67
58
  borderColor: eventContentArg.borderColor || eventContentArg.backgroundColor,
68
59
  } })),
69
- createElement(InnerContent, { elTag: "td", elClasses: ['fc-list-event-title'], elAttrs: { headers: `${eventHeaderId} ${dateHeaderId}` } })))));
60
+ createElement(InnerContent, { tag: "div", className: 'fc-list-event-title' })))));
70
61
  }
71
- }
72
- function renderEventInnerContent(eventRange, context) {
73
- let interactiveAttrs = getEventRangeAnchorAttrs(eventRange, context);
74
- return (createElement("a", Object.assign({}, interactiveAttrs), eventRange.def.title));
75
- }
76
- function buildTimeContent(eventRange, isStart, isEnd, segStart, segEnd, timeFormat, context, timeHeaderId, dateHeaderId) {
77
- let { options } = context;
78
- if (options.displayEventTime !== false) {
79
- let eventDef = eventRange.def;
80
- let eventInstance = eventRange.instance;
81
- let doAllDay = false;
82
- let timeText;
83
- if (eventDef.allDay) {
84
- doAllDay = true;
85
- }
86
- else if (isMultiDayRange(eventRange.range)) { // TODO: use (!isStart || !isEnd) instead?
87
- if (isStart) {
88
- timeText = buildEventRangeTimeText(eventRange, timeFormat, context, null, null, eventInstance.range.start, segEnd);
89
- }
90
- else if (isEnd) {
91
- timeText = buildEventRangeTimeText(eventRange, timeFormat, context, null, null, segStart, eventInstance.range.end);
62
+ buildTimeContent(eventRange, // whole-day span
63
+ slicedStart, // view-sliced whole-day span
64
+ slicedEnd, // view-sliced whole-day span
65
+ isStart, isEnd, timeFormat, context) {
66
+ let { options } = context;
67
+ if (options.displayEventTime !== false) {
68
+ if (eventRange.def.allDay || (!isStart && !isEnd)) {
69
+ let renderProps = {
70
+ text: context.options.allDayText,
71
+ view: context.viewApi,
72
+ };
73
+ return (createElement(ContentContainer, { tag: "div", className: 'fc-list-event-time', renderProps: renderProps, elRef: this.handleTitleEl, generatorName: "allDayContent", customGenerator: options.allDayContent, defaultGenerator: renderAllDayInner, classNameGenerator: options.allDayClassNames, didMount: options.allDayDidMount, willUnmount: options.allDayWillUnmount }));
92
74
  }
93
75
  else {
94
- doAllDay = true;
76
+ return (createElement("div", { className: "fc-list-event-time", ref: this.handleTitleEl }, buildEventRangeTimeText(timeFormat, eventRange, slicedStart, slicedEnd, isStart, isEnd, context)));
95
77
  }
96
78
  }
97
- else {
98
- timeText = buildEventRangeTimeText(eventRange, timeFormat, context, null, null, segStart, segEnd);
99
- }
100
- if (doAllDay) {
101
- let renderProps = {
102
- text: context.options.allDayText,
103
- view: context.viewApi,
104
- };
105
- return (createElement(ContentContainer, { elTag: "td", elClasses: ['fc-list-event-time'], elAttrs: {
106
- headers: `${timeHeaderId} ${dateHeaderId}`,
107
- }, renderProps: renderProps, generatorName: "allDayContent", customGenerator: options.allDayContent, defaultGenerator: renderAllDayInner, classNameGenerator: options.allDayClassNames, didMount: options.allDayDidMount, willUnmount: options.allDayWillUnmount }));
108
- }
109
- return (createElement("td", { className: "fc-list-event-time" }, timeText));
79
+ return null;
80
+ }
81
+ componentWillUnmount() {
82
+ setRef(this.props.timeWidthRef, null);
110
83
  }
111
- return null;
84
+ }
85
+ function renderEventTitleOnly(renderProps) {
86
+ return renderProps.event.title;
112
87
  }
113
88
  function renderAllDayInner(renderProps) {
114
89
  return renderProps.text;
115
90
  }
116
91
 
92
+ class ListDay extends BaseComponent {
93
+ constructor() {
94
+ super(...arguments);
95
+ // memo
96
+ this.sortEventSegs = memoize(sortEventSegs);
97
+ // ref
98
+ this.timeWidthRefMap = new RefMap(() => {
99
+ afterSize(this.handleTimeWidths);
100
+ });
101
+ this.handleTimeWidths = () => {
102
+ const timeWidthMap = this.timeWidthRefMap.current;
103
+ let max = 0;
104
+ for (const timeWidth of timeWidthMap.values()) {
105
+ max = Math.max(max, timeWidth);
106
+ }
107
+ setRef(this.props.timeWidthRef, max);
108
+ };
109
+ }
110
+ render() {
111
+ const { props, context, timeWidthRefMap } = this;
112
+ const { nowDate, todayRange } = props;
113
+ const { options } = context;
114
+ const segs = this.sortEventSegs(props.segs, options.eventOrder);
115
+ return (createElement("div", { className: 'fc-list-day-and-events' },
116
+ createElement(ListDayHeader, { dayDate: props.dayDate, todayRange: todayRange, forPrint: props.forPrint }),
117
+ segs.map((seg) => {
118
+ const key = getEventKey(seg);
119
+ return (createElement(ListEvent, Object.assign({ key: key, eventRange: seg.eventRange, slicedStart: seg.slicedStart, slicedEnd: seg.slicedEnd, isStart: seg.isStart, isEnd: seg.isEnd, timeWidthRef: timeWidthRefMap.createRef(key), timeOuterWidth: props.timeOuterWidth, isDragging: false, isResizing: false, isDateSelecting: false, isSelected: false }, getEventRangeMeta(seg.eventRange, todayRange, nowDate))));
120
+ })));
121
+ }
122
+ componentWillUnmount() {
123
+ setRef(this.props.timeWidthRef, null);
124
+ }
125
+ }
126
+
117
127
  /*
118
128
  Responsible for the scroller, and forwarding event-related actions into the "grid".
119
129
  */
120
130
  class ListView extends DateComponent {
121
131
  constructor() {
122
132
  super(...arguments);
133
+ // memo
123
134
  this.computeDateVars = memoize(computeDateVars);
124
135
  this.eventStoreToSegs = memoize(this._eventStoreToSegs);
125
- this.state = {
126
- timeHeaderId: getUniqueDomId(),
127
- eventHeaderId: getUniqueDomId(),
128
- dateHeaderIdRoot: getUniqueDomId(),
129
- };
136
+ // ref
137
+ this.timeWidthRefMap = new RefMap(() => {
138
+ afterSize(this.handleTimeWidths);
139
+ });
130
140
  this.setRootEl = (rootEl) => {
131
141
  if (rootEl) {
132
142
  this.context.registerInteractiveComponent(this, {
133
143
  el: rootEl,
144
+ disableHits: true, // HACK to not do date-clicking/selecting
134
145
  });
135
146
  }
136
147
  else {
137
148
  this.context.unregisterInteractiveComponent(this);
138
149
  }
139
150
  };
151
+ this.handleTimeWidths = () => {
152
+ const timeWidthMap = this.timeWidthRefMap.current;
153
+ let max = 0;
154
+ for (const timeWidth of timeWidthMap.values()) {
155
+ max = Math.max(max, timeWidth);
156
+ }
157
+ this.setState({ timeOuterWidth: max });
158
+ };
140
159
  }
141
160
  render() {
142
161
  let { props, context } = this;
@@ -144,13 +163,9 @@ class ListView extends DateComponent {
144
163
  let { dayDates, dayRanges } = this.computeDateVars(props.dateProfile);
145
164
  let eventSegs = this.eventStoreToSegs(props.eventStore, props.eventUiBases, dayRanges);
146
165
  let verticalScrolling = !props.forPrint && !getIsHeightAuto(options);
147
- return (createElement(ViewContainer, { elRef: this.setRootEl, elClasses: [
148
- 'fc-list-view',
149
- 'fc-flex-column',
150
- 'fc-border',
151
- ], viewSpec: context.viewSpec },
166
+ return (createElement(ViewContainer, { elRef: this.setRootEl, className: 'fc-list fc-flex-col fc-border', viewSpec: context.viewSpec },
152
167
  createElement(Scroller // TODO: don't need heavyweight component
153
- , { vertical: verticalScrolling, elClassNames: [verticalScrolling ? 'fc-liquid' : ''] }, eventSegs.length > 0 ?
168
+ , { vertical: verticalScrolling, className: verticalScrolling ? 'fc-liquid' : '' }, eventSegs.length > 0 ?
154
169
  this.renderSegList(eventSegs, dayDates) :
155
170
  this.renderEmptyMessage())));
156
171
  }
@@ -160,77 +175,50 @@ class ListView extends DateComponent {
160
175
  text: options.noEventsText,
161
176
  view: viewApi,
162
177
  };
163
- return (createElement(ContentContainer, { elTag: "div", elClasses: ['fc-list-empty'], renderProps: renderProps, generatorName: "noEventsContent", customGenerator: options.noEventsContent, defaultGenerator: renderNoEventsInner, classNameGenerator: options.noEventsClassNames, didMount: options.noEventsDidMount, willUnmount: options.noEventsWillUnmount }, (InnerContent) => (createElement(InnerContent, { elTag: "div", elClasses: ['fc-list-empty-inner'] }))));
178
+ return (createElement(ContentContainer, { tag: "div", className: 'fc-list-empty', renderProps: renderProps, generatorName: "noEventsContent", customGenerator: options.noEventsContent, defaultGenerator: renderNoEventsInner, classNameGenerator: options.noEventsClassNames, didMount: options.noEventsDidMount, willUnmount: options.noEventsWillUnmount }, (InnerContent) => (createElement(InnerContent, { tag: "div", className: 'fc-list-empty-inner' }))));
164
179
  }
165
180
  renderSegList(allSegs, dayDates) {
166
- let { options } = this.context;
167
- let { timeHeaderId, eventHeaderId, dateHeaderIdRoot } = this.state;
168
181
  let segsByDay = groupSegsByDay(allSegs); // sparse array
169
182
  return (createElement(NowTimer, { unit: "day" }, (nowDate, todayRange) => {
170
- let innerNodes = [];
183
+ const dayNodes = [];
171
184
  for (let dayIndex = 0; dayIndex < segsByDay.length; dayIndex += 1) {
172
185
  let daySegs = segsByDay[dayIndex];
173
186
  if (daySegs) { // sparse array, so might be undefined
174
- let dayStr = formatDayString(dayDates[dayIndex]);
175
- let dateHeaderId = dateHeaderIdRoot + '-' + dayStr;
176
- // append a day header
177
- innerNodes.push(createElement(ListViewHeaderRow, { key: dayStr, forPrint: this.props.forPrint, cellId: dateHeaderId, dayDate: dayDates[dayIndex], todayRange: todayRange }));
178
- daySegs = sortEventSegs(daySegs, options.eventOrder);
179
- for (let seg of daySegs) {
180
- innerNodes.push(createElement(ListViewEventRow, Object.assign({ key: dayStr + ':' + seg.eventRange.instance.instanceId /* are multiple segs for an instanceId */, eventRange: seg.eventRange, isStart: seg.isStart, isEnd: seg.isEnd, segStart: seg.start, segEnd: seg.end, isDragging: false, isResizing: false, isDateSelecting: false, isSelected: false, timeHeaderId: timeHeaderId, eventHeaderId: eventHeaderId, dateHeaderId: dateHeaderId }, getEventRangeMeta(seg.eventRange, todayRange, nowDate))));
181
- }
187
+ const dayDate = dayDates[dayIndex];
188
+ const key = formatDayString(dayDate);
189
+ dayNodes.push(createElement(ListDay, { key: key, dayDate: dayDate, nowDate: nowDate, todayRange: todayRange, segs: daySegs, forPrint: this.props.forPrint, timeWidthRef: this.timeWidthRefMap.createRef(key), timeOuterWidth: this.state.timeOuterWidth }));
182
190
  }
183
191
  }
184
- return (createElement("table", { className: 'fc-table' },
185
- createElement("thead", { className: 'fc-offscreen' },
186
- createElement("tr", null,
187
- createElement("th", { scope: "col", id: timeHeaderId }, options.timeHint),
188
- createElement("th", { scope: "col", "aria-hidden": true }),
189
- createElement("th", { scope: "col", id: eventHeaderId }, options.eventHint))),
190
- createElement("tbody", null, innerNodes)));
192
+ return (createElement(Fragment, null, dayNodes));
191
193
  }));
192
194
  }
193
195
  _eventStoreToSegs(eventStore, eventUiBases, dayRanges) {
194
- return this.eventRangesToSegs(sliceEventStore(eventStore, eventUiBases, this.props.dateProfile.activeRange, this.context.options.nextDayThreshold).fg, dayRanges);
196
+ return this.eventRangesToSegs(sliceEventStore(eventStore, eventUiBases,
197
+ // HACKY to reference internal state...
198
+ this.props.dateProfile.activeRange, this.context.options.nextDayThreshold).fg, dayRanges);
195
199
  }
196
- eventRangesToSegs(eventRanges, dayRanges) {
200
+ eventRangesToSegs(fullDayEventRanges, dayRanges) {
197
201
  let segs = [];
198
- for (let eventRange of eventRanges) {
199
- segs.push(...this.eventRangeToSegs(eventRange, dayRanges));
202
+ for (let fullDayEventRange of fullDayEventRanges) {
203
+ segs.push(...this.eventRangeToSegs(fullDayEventRange, dayRanges));
200
204
  }
201
205
  return segs;
202
206
  }
203
- eventRangeToSegs(eventRange, dayRanges) {
204
- let { dateEnv } = this.context;
205
- let { nextDayThreshold } = this.context.options;
206
- let range = eventRange.range;
207
- let allDay = eventRange.def.allDay;
207
+ eventRangeToSegs(fullDayEventRange, dayRanges) {
208
+ let fullDayRange = fullDayEventRange.range;
208
209
  let dayIndex;
209
- let segRange;
210
- let seg;
211
210
  let segs = [];
212
211
  for (dayIndex = 0; dayIndex < dayRanges.length; dayIndex += 1) {
213
- segRange = intersectRanges(range, dayRanges[dayIndex]);
214
- if (segRange) {
215
- seg = {
216
- eventRange,
217
- start: segRange.start,
218
- end: segRange.end,
219
- isStart: eventRange.isStart && segRange.start.valueOf() === range.start.valueOf(),
220
- isEnd: eventRange.isEnd && segRange.end.valueOf() === range.end.valueOf(),
212
+ const slicedFullDayRange = intersectRanges(fullDayRange, dayRanges[dayIndex]);
213
+ if (slicedFullDayRange) {
214
+ segs.push({
215
+ eventRange: fullDayEventRange,
216
+ slicedStart: slicedFullDayRange.start,
217
+ slicedEnd: slicedFullDayRange.end,
218
+ isStart: fullDayEventRange.isStart && fullDayRange.start.valueOf() === slicedFullDayRange.start.valueOf(),
219
+ isEnd: fullDayEventRange.isEnd && fullDayRange.end.valueOf() === slicedFullDayRange.end.valueOf(),
221
220
  dayIndex,
222
- };
223
- segs.push(seg);
224
- // detect when range won't go fully into the next day,
225
- // and mutate the latest seg to the be the end.
226
- if (!seg.isEnd && !allDay &&
227
- dayIndex + 1 < dayRanges.length &&
228
- range.end <
229
- dateEnv.add(dayRanges[dayIndex + 1].start, nextDayThreshold)) {
230
- seg.end = range.end;
231
- seg.isEnd = true;
232
- break;
233
- }
221
+ });
234
222
  }
235
223
  }
236
224
  return segs;
@@ -267,4 +255,7 @@ function groupSegsByDay(segs) {
267
255
  return segsByDay;
268
256
  }
269
257
 
258
+ var css_248z = ":root{--fc-list-event-dot-width:10px;--fc-list-event-hover-bg-color:#f5f5f5}.fc-list-day,.fc-list-event-dot-outer,.fc-list-event-time,.fc-list-event-title{padding:8px 14px}.fc-direction-ltr .fc-list-event-dot-outer{padding-right:0}.fc-direction-rtl .fc-list-event-dot-outer{padding-left:0}.fc-list-empty{align-items:center;background-color:var(--fc-neutral-bg-color);display:flex;height:100%;justify-content:center}.fc-list-empty-inner{margin:5em 0}.fc-list-day,.fc-list-event:not(.fc-list-day-and-events:last-child .fc-list-event:last-child){border-bottom:1px solid var(--fc-border-color)}.fc-list-day-outer-sticky{background:var(--fc-page-bg-color);position:sticky;top:0}.fc-list-day{background:var(--fc-neutral-bg-color);display:flex;font-weight:700;justify-content:space-between}.fc-list-event{display:flex;flex-direction:row}a.fc-list-event{color:inherit;text-decoration:none}.fc-list-event:hover{background-color:var(--fc-list-event-hover-bg-color)}.fc-list-event-time-outer{display:flex;flex-direction:row}.fc-list-event-dot-outer,.fc-list-event-time{white-space:nowrap}.fc-list-event-dot{border:calc(var(--fc-list-event-dot-width)/2) solid var(--fc-event-border-color);border-radius:calc(var(--fc-list-event-dot-width)/2);box-sizing:content-box;display:inline-block;height:0;width:0}a.fc-list-event:hover .fc-list-event-title{text-decoration:underline}";
259
+ injectStyles(css_248z);
260
+
270
261
  export { ListView };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fullcalendar/list",
3
- "version": "7.0.0-beta.1",
3
+ "version": "7.0.0-beta.3",
4
4
  "title": "FullCalendar List View Plugin",
5
5
  "description": "Display events on a calendar view that looks like a bulleted list",
6
6
  "keywords": [
@@ -12,7 +12,7 @@
12
12
  ],
13
13
  "homepage": "https://fullcalendar.io/docs/list-view",
14
14
  "peerDependencies": {
15
- "@fullcalendar/core": "7.0.0-beta.1"
15
+ "@fullcalendar/core": "7.0.0-beta.3"
16
16
  },
17
17
  "type": "module",
18
18
  "bugs": "https://fullcalendar.io/reporting-bugs",