@event-calendar/core 4.3.1 → 4.4.1
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/README.md +55 -2
- package/dist/index.css +1 -1
- package/dist/index.js +61 -38
- package/package.json +1 -1
- package/src/Auxiliary.svelte +2 -2
- package/src/lib/stores.js +3 -3
- package/src/lib/times.js +2 -2
- package/src/plugins/day-grid/Body.svelte +2 -2
- package/src/plugins/day-grid/Week.svelte +3 -3
- package/src/plugins/list/Body.svelte +2 -2
- package/src/plugins/list/Day.svelte +2 -2
- package/src/plugins/resource-timeline/Body.svelte +2 -2
- package/src/plugins/resource-timeline/Days.svelte +2 -2
- package/src/plugins/resource-timeline/stores.js +3 -3
- package/src/plugins/time-grid/Day.svelte +3 -3
- package/src/plugins/time-grid/all-day/Week.svelte +2 -2
- package/src/plugins/time-grid/stores.js +1 -1
- package/src/storage/options.js +2 -1
- package/src/storage/state.js +2 -1
- package/src/storage/stores.js +23 -0
package/README.md
CHANGED
|
@@ -54,6 +54,7 @@ Inspired by [FullCalendar](https://fullcalendar.io/), it implements similar opti
|
|
|
54
54
|
</td><td>
|
|
55
55
|
|
|
56
56
|
- [eventDurationEditable](#eventdurationeditable)
|
|
57
|
+
- [eventFilter](#eventfilter)
|
|
57
58
|
- [eventLongPressDelay](#eventlongpressdelay)
|
|
58
59
|
- [eventMouseEnter](#eventmouseenter)
|
|
59
60
|
- [eventMouseLeave](#eventmouseleave)
|
|
@@ -227,8 +228,8 @@ This bundle contains a version of the calendar that includes all plugins and is
|
|
|
227
228
|
|
|
228
229
|
The first step is to include the following lines of code in the `<head>` section of your page:
|
|
229
230
|
```html
|
|
230
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@event-calendar/build@4.
|
|
231
|
-
<script src="https://cdn.jsdelivr.net/npm/@event-calendar/build@4.
|
|
231
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@event-calendar/build@4.4.1/dist/event-calendar.min.css">
|
|
232
|
+
<script src="https://cdn.jsdelivr.net/npm/@event-calendar/build@4.4.1/dist/event-calendar.min.js"></script>
|
|
232
233
|
```
|
|
233
234
|
|
|
234
235
|
<details>
|
|
@@ -1115,6 +1116,58 @@ The current [View](#view-object) object
|
|
|
1115
1116
|
|
|
1116
1117
|
Determines whether calendar events can be resized.
|
|
1117
1118
|
|
|
1119
|
+
### eventFilter
|
|
1120
|
+
- Type `function`
|
|
1121
|
+
- Default `undefined`
|
|
1122
|
+
|
|
1123
|
+
A function for filtering the array of events before displaying them in the calendar. It allows, for example, to display only specific events for each view.
|
|
1124
|
+
|
|
1125
|
+
```js
|
|
1126
|
+
function (info) {
|
|
1127
|
+
// return true to keep the event, false to exclude it
|
|
1128
|
+
}
|
|
1129
|
+
```
|
|
1130
|
+
`info` is an object with the following properties:
|
|
1131
|
+
<table>
|
|
1132
|
+
<tr>
|
|
1133
|
+
<td>
|
|
1134
|
+
|
|
1135
|
+
`event`
|
|
1136
|
+
</td>
|
|
1137
|
+
<td>
|
|
1138
|
+
|
|
1139
|
+
The current [Event](#event-object) object being processed in the array
|
|
1140
|
+
</td>
|
|
1141
|
+
</tr>
|
|
1142
|
+
<tr>
|
|
1143
|
+
<td>
|
|
1144
|
+
|
|
1145
|
+
`index`
|
|
1146
|
+
</td>
|
|
1147
|
+
<td>The index of the current event being processed in the array</td>
|
|
1148
|
+
</tr>
|
|
1149
|
+
<tr>
|
|
1150
|
+
<td>
|
|
1151
|
+
|
|
1152
|
+
`events`
|
|
1153
|
+
</td>
|
|
1154
|
+
<td>
|
|
1155
|
+
|
|
1156
|
+
The array of all events `eventFilter` was called upon
|
|
1157
|
+
</td>
|
|
1158
|
+
</tr>
|
|
1159
|
+
<tr>
|
|
1160
|
+
<td>
|
|
1161
|
+
|
|
1162
|
+
`view`
|
|
1163
|
+
</td>
|
|
1164
|
+
<td>
|
|
1165
|
+
|
|
1166
|
+
The current [View](#view-object) object
|
|
1167
|
+
</td>
|
|
1168
|
+
</tr>
|
|
1169
|
+
</table>
|
|
1170
|
+
|
|
1118
1171
|
### eventLongPressDelay
|
|
1119
1172
|
- Type `integer`
|
|
1120
1173
|
- Default `undefined`
|
package/dist/index.css
CHANGED
package/dist/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* EventCalendar v4.
|
|
2
|
+
* EventCalendar v4.4.1
|
|
3
3
|
* https://github.com/vkurko/calendar
|
|
4
4
|
*/
|
|
5
5
|
import { tick, getContext, untrack, setContext, onMount, mount, unmount } from "svelte";
|
|
@@ -720,12 +720,12 @@ function _getParts(source, parts) {
|
|
|
720
720
|
}
|
|
721
721
|
function viewResources(state) {
|
|
722
722
|
return derived(
|
|
723
|
-
[state.resources, state.filterResourcesWithEvents, state.
|
|
724
|
-
([$resources, $filterResourcesWithEvents, $
|
|
723
|
+
[state.resources, state.filterResourcesWithEvents, state._filteredEvents, state._activeRange],
|
|
724
|
+
([$resources, $filterResourcesWithEvents, $_filteredEvents, $_activeRange]) => {
|
|
725
725
|
let result = $resources.filter((resource) => !getPayload(resource).hidden);
|
|
726
726
|
if ($filterResourcesWithEvents) {
|
|
727
727
|
result = $resources.filter((resource) => {
|
|
728
|
-
for (let event of $
|
|
728
|
+
for (let event of $_filteredEvents) {
|
|
729
729
|
if (event.display !== "background" && event.resourceIds.includes(resource.id) && event.start < $_activeRange.end && event.end > $_activeRange.start) {
|
|
730
730
|
return true;
|
|
731
731
|
}
|
|
@@ -763,7 +763,7 @@ function createTimes(date, $slotDuration, $slotLabelInterval, $_slotTimeLimits,
|
|
|
763
763
|
}
|
|
764
764
|
return times2;
|
|
765
765
|
}
|
|
766
|
-
function createSlotTimeLimits($slotMinTime, $slotMaxTime, $flexibleSlotTimeLimits, $_viewDates, $
|
|
766
|
+
function createSlotTimeLimits($slotMinTime, $slotMaxTime, $flexibleSlotTimeLimits, $_viewDates, $_filteredEvents) {
|
|
767
767
|
let min$1 = createDuration($slotMinTime);
|
|
768
768
|
let max$1 = createDuration($slotMaxTime);
|
|
769
769
|
if ($flexibleSlotTimeLimits) {
|
|
@@ -775,7 +775,7 @@ function createSlotTimeLimits($slotMinTime, $slotMaxTime, $flexibleSlotTimeLimit
|
|
|
775
775
|
let end = addDuration(cloneDate(date), max$1);
|
|
776
776
|
let minStart = addDuration(cloneDate(date), minMin);
|
|
777
777
|
let maxEnd = addDuration(cloneDate(date), maxMax);
|
|
778
|
-
for (let event of $
|
|
778
|
+
for (let event of $_filteredEvents) {
|
|
779
779
|
if (!event.allDay && filter(event) && event.start < maxEnd && event.end > minStart) {
|
|
780
780
|
if (event.start < start) {
|
|
781
781
|
let seconds = max((event.start - date) / 1e3, toSeconds(minMin));
|
|
@@ -822,15 +822,17 @@ function createOptions(plugins) {
|
|
|
822
822
|
events: [],
|
|
823
823
|
eventAllUpdated: void 0,
|
|
824
824
|
eventBackgroundColor: void 0,
|
|
825
|
-
eventTextColor: void 0,
|
|
826
825
|
eventClassNames: void 0,
|
|
827
826
|
eventClick: void 0,
|
|
828
827
|
eventColor: void 0,
|
|
829
828
|
eventContent: void 0,
|
|
830
829
|
eventDidMount: void 0,
|
|
830
|
+
eventFilter: void 0,
|
|
831
|
+
// ec option
|
|
831
832
|
eventMouseEnter: void 0,
|
|
832
833
|
eventMouseLeave: void 0,
|
|
833
834
|
eventSources: [],
|
|
835
|
+
eventTextColor: void 0,
|
|
834
836
|
eventTimeFormat: {
|
|
835
837
|
hour: "numeric",
|
|
836
838
|
minute: "2-digit"
|
|
@@ -1099,6 +1101,26 @@ function events(state) {
|
|
|
1099
1101
|
).subscribe(_events.set);
|
|
1100
1102
|
return _events;
|
|
1101
1103
|
}
|
|
1104
|
+
function filteredEvents(state) {
|
|
1105
|
+
let view2;
|
|
1106
|
+
state._view.subscribe(($_view) => view2 = $_view);
|
|
1107
|
+
let debounceHandle = {};
|
|
1108
|
+
return derived(
|
|
1109
|
+
[state._events, state.eventFilter],
|
|
1110
|
+
(values, set) => debounce(() => {
|
|
1111
|
+
let [$_events, $eventFilter] = values;
|
|
1112
|
+
set(
|
|
1113
|
+
isFunction($eventFilter) ? $_events.filter((event, index2, events2) => $eventFilter({
|
|
1114
|
+
event,
|
|
1115
|
+
index: index2,
|
|
1116
|
+
events: events2,
|
|
1117
|
+
view: view2
|
|
1118
|
+
})) : $_events
|
|
1119
|
+
);
|
|
1120
|
+
}, debounceHandle, state._queue),
|
|
1121
|
+
[]
|
|
1122
|
+
);
|
|
1123
|
+
}
|
|
1102
1124
|
function now() {
|
|
1103
1125
|
return readable(createDate(), (set) => {
|
|
1104
1126
|
let interval = setInterval(() => {
|
|
@@ -1143,6 +1165,7 @@ class State {
|
|
|
1143
1165
|
this._viewDates = viewDates(this);
|
|
1144
1166
|
this._view = view(this);
|
|
1145
1167
|
this._viewComponent = writable(void 0);
|
|
1168
|
+
this._filteredEvents = filteredEvents(this);
|
|
1146
1169
|
this._interaction = writable({});
|
|
1147
1170
|
this._iEvents = writable([null, null]);
|
|
1148
1171
|
this._iClasses = writable(identity);
|
|
@@ -1531,7 +1554,7 @@ function Auxiliary$1($$anchor, $$props) {
|
|
|
1531
1554
|
const $_activeRange = () => $.store_get(_activeRange, "$_activeRange", $$stores);
|
|
1532
1555
|
const $datesSet = () => $.store_get(datesSet, "$datesSet", $$stores);
|
|
1533
1556
|
const $_view = () => $.store_get(_view, "$_view", $$stores);
|
|
1534
|
-
const $
|
|
1557
|
+
const $_filteredEvents = () => $.store_get(_filteredEvents, "$_filteredEvents", $$stores);
|
|
1535
1558
|
const $eventAllUpdated = () => $.store_get(eventAllUpdated, "$eventAllUpdated", $$stores);
|
|
1536
1559
|
const $_queue = () => $.store_get(_queue, "$_queue", $$stores);
|
|
1537
1560
|
const $_recheckScrollable = () => $.store_get(_recheckScrollable, "$_recheckScrollable", $$stores);
|
|
@@ -1542,7 +1565,7 @@ function Auxiliary$1($$anchor, $$props) {
|
|
|
1542
1565
|
eventAllUpdated,
|
|
1543
1566
|
_auxiliary,
|
|
1544
1567
|
_activeRange,
|
|
1545
|
-
|
|
1568
|
+
_filteredEvents,
|
|
1546
1569
|
_scrollable,
|
|
1547
1570
|
_bodyEl,
|
|
1548
1571
|
_tasks,
|
|
@@ -1565,7 +1588,7 @@ function Auxiliary$1($$anchor, $$props) {
|
|
|
1565
1588
|
});
|
|
1566
1589
|
});
|
|
1567
1590
|
$.user_effect(() => {
|
|
1568
|
-
$
|
|
1591
|
+
$_filteredEvents();
|
|
1569
1592
|
untrack(() => {
|
|
1570
1593
|
if (isFunction($eventAllUpdated())) {
|
|
1571
1594
|
task(() => $eventAllUpdated()({ view: toViewWithLocalDates($_view()) }), "eau", _tasks);
|
|
@@ -2576,14 +2599,14 @@ function Week$1($$anchor, $$props) {
|
|
|
2576
2599
|
$.push($$props, true);
|
|
2577
2600
|
const [$$stores, $$cleanup] = $.setup_stores();
|
|
2578
2601
|
const $validRange = () => $.store_get(validRange, "$validRange", $$stores);
|
|
2579
|
-
const $
|
|
2602
|
+
const $_filteredEvents = () => $.store_get(_filteredEvents, "$_filteredEvents", $$stores);
|
|
2580
2603
|
const $filterEventsWithResources = () => $.store_get(filterEventsWithResources, "$filterEventsWithResources", $$stores);
|
|
2581
2604
|
const $resources = () => $.store_get(resources, "$resources", $$stores);
|
|
2582
2605
|
const $hiddenDays = () => $.store_get(hiddenDays, "$hiddenDays", $$stores);
|
|
2583
2606
|
const $_iEvents = () => $.store_get(_iEvents, "$_iEvents", $$stores);
|
|
2584
2607
|
const $theme = () => $.store_get(theme, "$theme", $$stores);
|
|
2585
2608
|
let {
|
|
2586
|
-
|
|
2609
|
+
_filteredEvents,
|
|
2587
2610
|
_iEvents,
|
|
2588
2611
|
resources,
|
|
2589
2612
|
filterEventsWithResources,
|
|
@@ -2597,7 +2620,7 @@ function Week$1($$anchor, $$props) {
|
|
|
2597
2620
|
let $$d = $.derived(() => {
|
|
2598
2621
|
let chunks2 = [];
|
|
2599
2622
|
let bgChunks2 = [];
|
|
2600
|
-
for (let event of $
|
|
2623
|
+
for (let event of $_filteredEvents()) {
|
|
2601
2624
|
if (eventIntersects(event, $.get(start), $.get(end), $filterEventsWithResources() ? $resources() : void 0)) {
|
|
2602
2625
|
let chunk = createEventChunk(event, $.get(start), $.get(end));
|
|
2603
2626
|
if (bgEvent(event.display)) {
|
|
@@ -2669,13 +2692,13 @@ function Body$3($$anchor, $$props) {
|
|
|
2669
2692
|
const $_viewDates = () => $.store_get(_viewDates, "$_viewDates", $$stores);
|
|
2670
2693
|
const $dayMaxEvents = () => $.store_get(dayMaxEvents, "$dayMaxEvents", $$stores);
|
|
2671
2694
|
const $_hiddenEvents = () => $.store_get(_hiddenEvents, "$_hiddenEvents", $$stores);
|
|
2672
|
-
const $
|
|
2695
|
+
const $_filteredEvents = () => $.store_get(_filteredEvents, "$_filteredEvents", $$stores);
|
|
2673
2696
|
const $_bodyEl = () => $.store_get(_bodyEl, "$_bodyEl", $$stores);
|
|
2674
2697
|
const $theme = () => $.store_get(theme, "$theme", $$stores);
|
|
2675
2698
|
let {
|
|
2676
2699
|
_bodyEl,
|
|
2677
2700
|
_viewDates,
|
|
2678
|
-
|
|
2701
|
+
_filteredEvents,
|
|
2679
2702
|
_hiddenEvents,
|
|
2680
2703
|
_recheckScrollable,
|
|
2681
2704
|
dayMaxEvents,
|
|
@@ -2704,7 +2727,7 @@ function Body$3($$anchor, $$props) {
|
|
|
2704
2727
|
runReposition(refs, $.get(weeks));
|
|
2705
2728
|
}
|
|
2706
2729
|
$.user_effect(() => {
|
|
2707
|
-
$
|
|
2730
|
+
$_filteredEvents();
|
|
2708
2731
|
$_hiddenEvents();
|
|
2709
2732
|
$dayMaxEvents();
|
|
2710
2733
|
untrack(reposition);
|
|
@@ -3717,7 +3740,7 @@ function Day$3($$anchor, $$props) {
|
|
|
3717
3740
|
const $_today = () => $.store_get(_today, "$_today", $$stores);
|
|
3718
3741
|
const $highlightedDates = () => $.store_get(highlightedDates, "$highlightedDates", $$stores);
|
|
3719
3742
|
const $validRange = () => $.store_get(validRange, "$validRange", $$stores);
|
|
3720
|
-
const $
|
|
3743
|
+
const $_filteredEvents = () => $.store_get(_filteredEvents, "$_filteredEvents", $$stores);
|
|
3721
3744
|
const $filterEventsWithResources = () => $.store_get(filterEventsWithResources, "$filterEventsWithResources", $$stores);
|
|
3722
3745
|
const $resources = () => $.store_get(resources, "$resources", $$stores);
|
|
3723
3746
|
const $theme = () => $.store_get(theme, "$theme", $$stores);
|
|
@@ -3725,7 +3748,7 @@ function Day$3($$anchor, $$props) {
|
|
|
3725
3748
|
const $_intlListDay = () => $.store_get(_intlListDay, "$_intlListDay", $$stores);
|
|
3726
3749
|
const $_intlListDaySide = () => $.store_get(_intlListDaySide, "$_intlListDaySide", $$stores);
|
|
3727
3750
|
let {
|
|
3728
|
-
|
|
3751
|
+
_filteredEvents,
|
|
3729
3752
|
_interaction,
|
|
3730
3753
|
_intlListDay,
|
|
3731
3754
|
_intlListDaySide,
|
|
@@ -3746,7 +3769,7 @@ function Day$3($$anchor, $$props) {
|
|
|
3746
3769
|
if (!$.get(disabled)) {
|
|
3747
3770
|
let start = $$props.date;
|
|
3748
3771
|
let end = addDay(cloneDate($$props.date));
|
|
3749
|
-
for (let event of $
|
|
3772
|
+
for (let event of $_filteredEvents()) {
|
|
3750
3773
|
if (!bgEvent(event.display) && eventIntersects(event, start, end, $filterEventsWithResources() ? $resources() : void 0)) {
|
|
3751
3774
|
let chunk = createEventChunk(event, start, end);
|
|
3752
3775
|
chunks2.push(chunk);
|
|
@@ -3832,7 +3855,7 @@ function Body$2($$anchor, $$props) {
|
|
|
3832
3855
|
$.push($$props, true);
|
|
3833
3856
|
const [$$stores, $$cleanup] = $.setup_stores();
|
|
3834
3857
|
const $_viewDates = () => $.store_get(_viewDates, "$_viewDates", $$stores);
|
|
3835
|
-
const $
|
|
3858
|
+
const $_filteredEvents = () => $.store_get(_filteredEvents, "$_filteredEvents", $$stores);
|
|
3836
3859
|
const $noEventsContent = () => $.store_get(noEventsContent, "$noEventsContent", $$stores);
|
|
3837
3860
|
const $noEventsClick = () => $.store_get(noEventsClick, "$noEventsClick", $$stores);
|
|
3838
3861
|
const $_view = () => $.store_get(_view, "$_view", $$stores);
|
|
@@ -3840,7 +3863,7 @@ function Body$2($$anchor, $$props) {
|
|
|
3840
3863
|
const $theme = () => $.store_get(theme, "$theme", $$stores);
|
|
3841
3864
|
let {
|
|
3842
3865
|
_bodyEl,
|
|
3843
|
-
|
|
3866
|
+
_filteredEvents,
|
|
3844
3867
|
_view,
|
|
3845
3868
|
_viewDates,
|
|
3846
3869
|
noEventsClick,
|
|
@@ -3852,7 +3875,7 @@ function Body$2($$anchor, $$props) {
|
|
|
3852
3875
|
if ($_viewDates().length) {
|
|
3853
3876
|
let start = $_viewDates()[0];
|
|
3854
3877
|
let end = addDay(cloneDate($_viewDates().at(-1)));
|
|
3855
|
-
for (let event of $
|
|
3878
|
+
for (let event of $_filteredEvents()) {
|
|
3856
3879
|
if (!bgEvent(event.display) && event.start < end && event.end > start) {
|
|
3857
3880
|
noEvents2 = false;
|
|
3858
3881
|
break;
|
|
@@ -3963,7 +3986,7 @@ function times(state) {
|
|
|
3963
3986
|
}
|
|
3964
3987
|
function slotTimeLimits(state) {
|
|
3965
3988
|
return derived(
|
|
3966
|
-
[state.slotMinTime, state.slotMaxTime, state.flexibleSlotTimeLimits, state._viewDates, state.
|
|
3989
|
+
[state.slotMinTime, state.slotMaxTime, state.flexibleSlotTimeLimits, state._viewDates, state._filteredEvents],
|
|
3967
3990
|
(args) => createSlotTimeLimits(...args)
|
|
3968
3991
|
);
|
|
3969
3992
|
}
|
|
@@ -4244,7 +4267,7 @@ function Day$2($$anchor, $$props) {
|
|
|
4244
4267
|
const $_slotTimeLimits = () => $.store_get(_slotTimeLimits, "$_slotTimeLimits", $$stores);
|
|
4245
4268
|
const $filterEventsWithResources = () => $.store_get(filterEventsWithResources, "$filterEventsWithResources", $$stores);
|
|
4246
4269
|
const $resources = () => $.store_get(resources, "$resources", $$stores);
|
|
4247
|
-
const $
|
|
4270
|
+
const $_filteredEvents = () => $.store_get(_filteredEvents, "$_filteredEvents", $$stores);
|
|
4248
4271
|
const $_iEvents = () => $.store_get(_iEvents, "$_iEvents", $$stores);
|
|
4249
4272
|
const $slotDuration = () => $.store_get(slotDuration, "$slotDuration", $$stores);
|
|
4250
4273
|
const $slotHeight = () => $.store_get(slotHeight, "$slotHeight", $$stores);
|
|
@@ -4253,7 +4276,7 @@ function Day$2($$anchor, $$props) {
|
|
|
4253
4276
|
const $nowIndicator = () => $.store_get(nowIndicator, "$nowIndicator", $$stores);
|
|
4254
4277
|
let resource = $.prop($$props, "resource", 3, void 0);
|
|
4255
4278
|
let {
|
|
4256
|
-
|
|
4279
|
+
_filteredEvents,
|
|
4257
4280
|
_iEvents,
|
|
4258
4281
|
highlightedDates,
|
|
4259
4282
|
nowIndicator,
|
|
@@ -4280,7 +4303,7 @@ function Day$2($$anchor, $$props) {
|
|
|
4280
4303
|
}
|
|
4281
4304
|
let chunks2 = [];
|
|
4282
4305
|
let bgChunks2 = [];
|
|
4283
|
-
for (let event of $
|
|
4306
|
+
for (let event of $_filteredEvents()) {
|
|
4284
4307
|
if ((!event.allDay || bgEvent(event.display)) && eventIntersects(event, $.get(start), $.get(end), $.get(resourceFilter))) {
|
|
4285
4308
|
let chunk = createEventChunk(event, $.get(start), $.get(end));
|
|
4286
4309
|
switch (event.display) {
|
|
@@ -4606,12 +4629,12 @@ function Week($$anchor, $$props) {
|
|
|
4606
4629
|
const $validRange = () => $.store_get(validRange, "$validRange", $$stores);
|
|
4607
4630
|
const $filterEventsWithResources = () => $.store_get(filterEventsWithResources, "$filterEventsWithResources", $$stores);
|
|
4608
4631
|
const $resources = () => $.store_get(resources, "$resources", $$stores);
|
|
4609
|
-
const $
|
|
4632
|
+
const $_filteredEvents = () => $.store_get(_filteredEvents, "$_filteredEvents", $$stores);
|
|
4610
4633
|
const $hiddenDays = () => $.store_get(hiddenDays, "$hiddenDays", $$stores);
|
|
4611
4634
|
const $_iEvents = () => $.store_get(_iEvents, "$_iEvents", $$stores);
|
|
4612
4635
|
let resource = $.prop($$props, "resource", 3, void 0);
|
|
4613
4636
|
let {
|
|
4614
|
-
|
|
4637
|
+
_filteredEvents,
|
|
4615
4638
|
_iEvents,
|
|
4616
4639
|
hiddenDays,
|
|
4617
4640
|
resources,
|
|
@@ -4625,7 +4648,7 @@ function Week($$anchor, $$props) {
|
|
|
4625
4648
|
let $$d = $.derived(() => {
|
|
4626
4649
|
let chunks2 = [];
|
|
4627
4650
|
let bgChunks2 = [];
|
|
4628
|
-
for (let event of $
|
|
4651
|
+
for (let event of $_filteredEvents()) {
|
|
4629
4652
|
if (event.allDay && eventIntersects(event, $.get(start), $.get(end), $.get(resourceFilter))) {
|
|
4630
4653
|
let chunk = createEventChunk(event, $.get(start), $.get(end));
|
|
4631
4654
|
if (bgEvent(event.display)) {
|
|
@@ -5178,8 +5201,8 @@ const index$1 = {
|
|
|
5178
5201
|
};
|
|
5179
5202
|
function dayTimeLimits(state) {
|
|
5180
5203
|
return derived(
|
|
5181
|
-
[state.slotMinTime, state.slotMaxTime, state.flexibleSlotTimeLimits, state._viewDates, state.
|
|
5182
|
-
([$slotMinTime, $slotMaxTime, $flexibleSlotTimeLimits, $_viewDates, $
|
|
5204
|
+
[state.slotMinTime, state.slotMaxTime, state.flexibleSlotTimeLimits, state._viewDates, state._filteredEvents],
|
|
5205
|
+
([$slotMinTime, $slotMaxTime, $flexibleSlotTimeLimits, $_viewDates, $_filteredEvents]) => {
|
|
5183
5206
|
let dayTimeLimits2 = {};
|
|
5184
5207
|
for (let date of $_viewDates) {
|
|
5185
5208
|
dayTimeLimits2[date.getTime()] = createSlotTimeLimits(
|
|
@@ -5187,7 +5210,7 @@ function dayTimeLimits(state) {
|
|
|
5187
5210
|
$slotMaxTime,
|
|
5188
5211
|
$flexibleSlotTimeLimits,
|
|
5189
5212
|
[date],
|
|
5190
|
-
$
|
|
5213
|
+
$_filteredEvents
|
|
5191
5214
|
);
|
|
5192
5215
|
}
|
|
5193
5216
|
return dayTimeLimits2;
|
|
@@ -5861,14 +5884,14 @@ function Days($$anchor, $$props) {
|
|
|
5861
5884
|
const $_viewDates = () => $.store_get(_viewDates, "$_viewDates", $$stores);
|
|
5862
5885
|
const $validRange = () => $.store_get(validRange, "$validRange", $$stores);
|
|
5863
5886
|
const $_dayTimeLimits = () => $.store_get(_dayTimeLimits, "$_dayTimeLimits", $$stores);
|
|
5864
|
-
const $
|
|
5887
|
+
const $_filteredEvents = () => $.store_get(_filteredEvents, "$_filteredEvents", $$stores);
|
|
5865
5888
|
const $slotDuration = () => $.store_get(slotDuration, "$slotDuration", $$stores);
|
|
5866
5889
|
const $_iEvents = () => $.store_get(_iEvents, "$_iEvents", $$stores);
|
|
5867
5890
|
const $_resHs = () => $.store_get(_resHs, "$_resHs", $$stores);
|
|
5868
5891
|
const $theme = () => $.store_get(theme, "$theme", $$stores);
|
|
5869
5892
|
let {
|
|
5870
5893
|
_viewDates,
|
|
5871
|
-
|
|
5894
|
+
_filteredEvents,
|
|
5872
5895
|
_iEvents,
|
|
5873
5896
|
_resHs,
|
|
5874
5897
|
_dayTimeLimits,
|
|
@@ -5895,7 +5918,7 @@ function Days($$anchor, $$props) {
|
|
|
5895
5918
|
let chunks2 = [];
|
|
5896
5919
|
let bgChunks2 = [];
|
|
5897
5920
|
let longChunks2;
|
|
5898
|
-
for (let event of $
|
|
5921
|
+
for (let event of $_filteredEvents()) {
|
|
5899
5922
|
if (eventIntersects(event, $.get(start), $.get(end), $$props.resource)) {
|
|
5900
5923
|
let chunk = createEventChunk(event, $.get(start), $.get(end));
|
|
5901
5924
|
if (bgEvent(event.display)) {
|
|
@@ -5978,7 +6001,7 @@ function Body($$anchor, $$props) {
|
|
|
5978
6001
|
const $slotWidth = () => $.store_get(slotWidth, "$slotWidth", $$stores);
|
|
5979
6002
|
const $_resHs = () => $.store_get(_resHs, "$_resHs", $$stores);
|
|
5980
6003
|
const $_viewResources = () => $.store_get(_viewResources, "$_viewResources", $$stores);
|
|
5981
|
-
const $
|
|
6004
|
+
const $_filteredEvents = () => $.store_get(_filteredEvents, "$_filteredEvents", $$stores);
|
|
5982
6005
|
const $_headerEl = () => $.store_get(_headerEl, "$_headerEl", $$stores);
|
|
5983
6006
|
const $_sidebarEl = () => $.store_get(_sidebarEl, "$_sidebarEl", $$stores);
|
|
5984
6007
|
const $theme = () => $.store_get(theme, "$theme", $$stores);
|
|
@@ -5989,7 +6012,7 @@ function Body($$anchor, $$props) {
|
|
|
5989
6012
|
_bodyWidth,
|
|
5990
6013
|
_bodyScrollLeft,
|
|
5991
6014
|
_headerEl,
|
|
5992
|
-
|
|
6015
|
+
_filteredEvents,
|
|
5993
6016
|
_sidebarEl,
|
|
5994
6017
|
_dayTimes,
|
|
5995
6018
|
_dayTimeLimits,
|
|
@@ -6018,7 +6041,7 @@ function Body($$anchor, $$props) {
|
|
|
6018
6041
|
runReposition(refs, $_viewResources());
|
|
6019
6042
|
}
|
|
6020
6043
|
$.user_effect(() => {
|
|
6021
|
-
$
|
|
6044
|
+
$_filteredEvents();
|
|
6022
6045
|
$_viewResources();
|
|
6023
6046
|
untrack(reposition);
|
|
6024
6047
|
});
|
package/package.json
CHANGED
package/src/Auxiliary.svelte
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
} from '#lib';
|
|
6
6
|
|
|
7
7
|
let {
|
|
8
|
-
datesSet, eventAllUpdated, _auxiliary, _activeRange,
|
|
8
|
+
datesSet, eventAllUpdated, _auxiliary, _activeRange, _filteredEvents, _scrollable, _bodyEl, _tasks, _recheckScrollable,
|
|
9
9
|
_queue, _view
|
|
10
10
|
} = getContext('state');
|
|
11
11
|
|
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
|
|
28
28
|
// eventAllUpdated callback
|
|
29
29
|
$effect(() => {
|
|
30
|
-
$
|
|
30
|
+
$_filteredEvents;
|
|
31
31
|
untrack(() => {
|
|
32
32
|
if (isFunction($eventAllUpdated)) {
|
|
33
33
|
task(() => $eventAllUpdated({view: toViewWithLocalDates($_view)}), 'eau', _tasks);
|
package/src/lib/stores.js
CHANGED
|
@@ -66,13 +66,13 @@ function _getParts(source, parts) {
|
|
|
66
66
|
|
|
67
67
|
export function viewResources(state) {
|
|
68
68
|
return derived(
|
|
69
|
-
[state.resources, state.filterResourcesWithEvents, state.
|
|
70
|
-
([$resources, $filterResourcesWithEvents, $
|
|
69
|
+
[state.resources, state.filterResourcesWithEvents, state._filteredEvents, state._activeRange],
|
|
70
|
+
([$resources, $filterResourcesWithEvents, $_filteredEvents, $_activeRange]) => {
|
|
71
71
|
let result = $resources.filter(resource => !getPayload(resource).hidden);
|
|
72
72
|
|
|
73
73
|
if ($filterResourcesWithEvents) {
|
|
74
74
|
result = $resources.filter(resource => {
|
|
75
|
-
for (let event of $
|
|
75
|
+
for (let event of $_filteredEvents) {
|
|
76
76
|
if (
|
|
77
77
|
event.display !== 'background' &&
|
|
78
78
|
event.resourceIds.includes(resource.id) &&
|
package/src/lib/times.js
CHANGED
|
@@ -31,7 +31,7 @@ export function createTimes(date, $slotDuration, $slotLabelInterval, $_slotTimeL
|
|
|
31
31
|
return times;
|
|
32
32
|
}
|
|
33
33
|
|
|
34
|
-
export function createSlotTimeLimits($slotMinTime, $slotMaxTime, $flexibleSlotTimeLimits, $_viewDates, $
|
|
34
|
+
export function createSlotTimeLimits($slotMinTime, $slotMaxTime, $flexibleSlotTimeLimits, $_viewDates, $_filteredEvents) {
|
|
35
35
|
let min = createDuration($slotMinTime);
|
|
36
36
|
let max = createDuration($slotMaxTime);
|
|
37
37
|
|
|
@@ -47,7 +47,7 @@ export function createSlotTimeLimits($slotMinTime, $slotMaxTime, $flexibleSlotTi
|
|
|
47
47
|
let end = addDuration(cloneDate(date), max);
|
|
48
48
|
let minStart = addDuration(cloneDate(date), minMin);
|
|
49
49
|
let maxEnd = addDuration(cloneDate(date), maxMax);
|
|
50
|
-
for (let event of $
|
|
50
|
+
for (let event of $_filteredEvents) {
|
|
51
51
|
if (!event.allDay && filter(event) && event.start < maxEnd && event.end > minStart) {
|
|
52
52
|
if (event.start < start) {
|
|
53
53
|
let seconds = maxFn((event.start - date) / 1000, toSeconds(minMin));
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
import Week from './Week.svelte';
|
|
5
5
|
|
|
6
6
|
let {
|
|
7
|
-
_bodyEl, _viewDates,
|
|
7
|
+
_bodyEl, _viewDates, _filteredEvents, _hiddenEvents, _recheckScrollable, dayMaxEvents, hiddenDays, theme
|
|
8
8
|
} = getContext('state');
|
|
9
9
|
|
|
10
10
|
let refs = [];
|
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
runReposition(refs, weeks);
|
|
32
32
|
}
|
|
33
33
|
$effect(() => {
|
|
34
|
-
$
|
|
34
|
+
$_filteredEvents;
|
|
35
35
|
$_hiddenEvents;
|
|
36
36
|
$dayMaxEvents;
|
|
37
37
|
untrack(reposition);
|
|
@@ -8,8 +8,8 @@
|
|
|
8
8
|
|
|
9
9
|
let {dates} = $props();
|
|
10
10
|
|
|
11
|
-
let {
|
|
12
|
-
resources, filterEventsWithResources, hiddenDays, theme, validRange} = getContext('state');
|
|
11
|
+
let {_filteredEvents, _iEvents,
|
|
12
|
+
resources, filterEventsWithResources, hiddenDays, theme, validRange } = getContext('state');
|
|
13
13
|
|
|
14
14
|
let refs = [];
|
|
15
15
|
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
let [chunks, bgChunks, longChunks] = $derived.by(() => {
|
|
20
20
|
let chunks = [];
|
|
21
21
|
let bgChunks = [];
|
|
22
|
-
for (let event of $
|
|
22
|
+
for (let event of $_filteredEvents) {
|
|
23
23
|
if (eventIntersects(event, start, end, $filterEventsWithResources ? $resources : undefined)) {
|
|
24
24
|
let chunk = createEventChunk(event, start, end);
|
|
25
25
|
if (bgEvent(event.display)) {
|
|
@@ -3,14 +3,14 @@
|
|
|
3
3
|
import {addDay, cloneDate, toViewWithLocalDates, setContent, bgEvent, isFunction} from '#lib';
|
|
4
4
|
import Day from './Day.svelte';
|
|
5
5
|
|
|
6
|
-
let {_bodyEl,
|
|
6
|
+
let {_bodyEl, _filteredEvents, _view, _viewDates, noEventsClick, noEventsContent, theme} = getContext('state');
|
|
7
7
|
|
|
8
8
|
let noEvents = $derived.by(() => {
|
|
9
9
|
let noEvents = true;
|
|
10
10
|
if ($_viewDates.length) {
|
|
11
11
|
let start = $_viewDates[0];
|
|
12
12
|
let end = addDay(cloneDate($_viewDates.at(-1)));
|
|
13
|
-
for (let event of $
|
|
13
|
+
for (let event of $_filteredEvents) {
|
|
14
14
|
if (!bgEvent(event.display) && event.start < end && event.end > start) {
|
|
15
15
|
noEvents = false;
|
|
16
16
|
break;
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
|
|
9
9
|
let {date} = $props();
|
|
10
10
|
|
|
11
|
-
let {
|
|
11
|
+
let {_filteredEvents, _interaction, _intlListDay, _intlListDaySide, _today,
|
|
12
12
|
resources, filterEventsWithResources, highlightedDates, theme, validRange} = getContext('state');
|
|
13
13
|
|
|
14
14
|
let el = $state();
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
if (!disabled) {
|
|
23
23
|
let start = date;
|
|
24
24
|
let end = addDay(cloneDate(date));
|
|
25
|
-
for (let event of $
|
|
25
|
+
for (let event of $_filteredEvents) {
|
|
26
26
|
if (!bgEvent(event.display) && eventIntersects(event, start, end, $filterEventsWithResources ? $resources : undefined)) {
|
|
27
27
|
let chunk = createEventChunk(event, start, end);
|
|
28
28
|
chunks.push(chunk);
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
import {getSlotTimeLimits} from './lib.js';
|
|
5
5
|
import Days from './Days.svelte';
|
|
6
6
|
|
|
7
|
-
let {_bodyEl, _bodyHeight, _bodyWidth, _bodyScrollLeft, _headerEl,
|
|
7
|
+
let {_bodyEl, _bodyHeight, _bodyWidth, _bodyScrollLeft, _headerEl, _filteredEvents, _sidebarEl, _dayTimes, _dayTimeLimits,
|
|
8
8
|
_recheckScrollable, _resHs, _viewResources, _viewDates, scrollTime, slotDuration, slotWidth, theme} = getContext('state');
|
|
9
9
|
|
|
10
10
|
let refs = [];
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
runReposition(refs, $_viewResources);
|
|
26
26
|
}
|
|
27
27
|
$effect(() => {
|
|
28
|
-
$
|
|
28
|
+
$_filteredEvents;
|
|
29
29
|
$_viewResources;
|
|
30
30
|
untrack(reposition);
|
|
31
31
|
});
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
let {resource} = $props();
|
|
11
11
|
|
|
12
12
|
let {
|
|
13
|
-
_viewDates,
|
|
13
|
+
_viewDates, _filteredEvents, _iEvents, _resHs, _dayTimeLimits, slotDuration, theme, validRange
|
|
14
14
|
} = getContext('state');
|
|
15
15
|
|
|
16
16
|
let refs = [];
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
let chunks = [];
|
|
35
35
|
let bgChunks = [];
|
|
36
36
|
let longChunks;
|
|
37
|
-
for (let event of $
|
|
37
|
+
for (let event of $_filteredEvents) {
|
|
38
38
|
if (eventIntersects(event, start, end, resource)) {
|
|
39
39
|
let chunk = createEventChunk(event, start, end);
|
|
40
40
|
if (bgEvent(event.display)) {
|
|
@@ -4,8 +4,8 @@ import {createSlotTimeLimits, createTimes, getPayload} from '#lib';
|
|
|
4
4
|
// slotTimeLimits per day
|
|
5
5
|
export function dayTimeLimits(state) {
|
|
6
6
|
return derived(
|
|
7
|
-
[state.slotMinTime, state.slotMaxTime, state.flexibleSlotTimeLimits, state._viewDates, state.
|
|
8
|
-
([$slotMinTime, $slotMaxTime, $flexibleSlotTimeLimits, $_viewDates, $
|
|
7
|
+
[state.slotMinTime, state.slotMaxTime, state.flexibleSlotTimeLimits, state._viewDates, state._filteredEvents],
|
|
8
|
+
([$slotMinTime, $slotMaxTime, $flexibleSlotTimeLimits, $_viewDates, $_filteredEvents]) => {
|
|
9
9
|
let dayTimeLimits = {};
|
|
10
10
|
for (let date of $_viewDates) {
|
|
11
11
|
dayTimeLimits[date.getTime()] = createSlotTimeLimits(
|
|
@@ -13,7 +13,7 @@ export function dayTimeLimits(state) {
|
|
|
13
13
|
$slotMaxTime,
|
|
14
14
|
$flexibleSlotTimeLimits,
|
|
15
15
|
[date],
|
|
16
|
-
$
|
|
16
|
+
$_filteredEvents
|
|
17
17
|
);
|
|
18
18
|
}
|
|
19
19
|
|
|
@@ -10,8 +10,8 @@
|
|
|
10
10
|
|
|
11
11
|
let {date, resource = undefined} = $props();
|
|
12
12
|
|
|
13
|
-
let {
|
|
14
|
-
resources, validRange, _interaction, _today, _slotTimeLimits} = getContext('state');
|
|
13
|
+
let {_filteredEvents, _iEvents, highlightedDates, nowIndicator, slotDuration, slotHeight, filterEventsWithResources,
|
|
14
|
+
theme, resources, validRange, _interaction, _today, _slotTimeLimits} = getContext('state');
|
|
15
15
|
|
|
16
16
|
let el = $state();
|
|
17
17
|
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
}
|
|
31
31
|
let chunks = [];
|
|
32
32
|
let bgChunks = [];
|
|
33
|
-
for (let event of $
|
|
33
|
+
for (let event of $_filteredEvents) {
|
|
34
34
|
if ((!event.allDay || bgEvent(event.display)) && eventIntersects(event, start, end, resourceFilter)) {
|
|
35
35
|
let chunk = createEventChunk(event, start, end);
|
|
36
36
|
switch (event.display) {
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
|
|
8
8
|
let {dates, resource = undefined} = $props();
|
|
9
9
|
|
|
10
|
-
let {
|
|
10
|
+
let {_filteredEvents, _iEvents, hiddenDays, resources, filterEventsWithResources, validRange } = getContext('state');
|
|
11
11
|
|
|
12
12
|
let refs = [];
|
|
13
13
|
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
let [chunks, bgChunks, longChunks] = $derived.by(() => {
|
|
22
22
|
let chunks = [];
|
|
23
23
|
let bgChunks = [];
|
|
24
|
-
for (let event of $
|
|
24
|
+
for (let event of $_filteredEvents) {
|
|
25
25
|
if (event.allDay && eventIntersects(event, start, end, resourceFilter)) {
|
|
26
26
|
let chunk = createEventChunk(event, start, end);
|
|
27
27
|
if (bgEvent(event.display)) {
|
|
@@ -10,7 +10,7 @@ export function times(state) {
|
|
|
10
10
|
|
|
11
11
|
export function slotTimeLimits(state) {
|
|
12
12
|
return derived(
|
|
13
|
-
[state.slotMinTime, state.slotMaxTime, state.flexibleSlotTimeLimits, state._viewDates, state.
|
|
13
|
+
[state.slotMinTime, state.slotMaxTime, state.flexibleSlotTimeLimits, state._viewDates, state._filteredEvents],
|
|
14
14
|
args => createSlotTimeLimits(...args)
|
|
15
15
|
);
|
|
16
16
|
}
|
package/src/storage/options.js
CHANGED
|
@@ -25,15 +25,16 @@ export function createOptions(plugins) {
|
|
|
25
25
|
events: [],
|
|
26
26
|
eventAllUpdated: undefined,
|
|
27
27
|
eventBackgroundColor: undefined,
|
|
28
|
-
eventTextColor: undefined,
|
|
29
28
|
eventClassNames: undefined,
|
|
30
29
|
eventClick: undefined,
|
|
31
30
|
eventColor: undefined,
|
|
32
31
|
eventContent: undefined,
|
|
33
32
|
eventDidMount: undefined,
|
|
33
|
+
eventFilter: undefined, // ec option
|
|
34
34
|
eventMouseEnter: undefined,
|
|
35
35
|
eventMouseLeave: undefined,
|
|
36
36
|
eventSources: [],
|
|
37
|
+
eventTextColor: undefined,
|
|
37
38
|
eventTimeFormat: {
|
|
38
39
|
hour: 'numeric',
|
|
39
40
|
minute: '2-digit'
|
package/src/storage/state.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import {get, writable} from 'svelte/store';
|
|
2
2
|
import {tick} from 'svelte';
|
|
3
3
|
import {createOptions, createParsers} from './options.js';
|
|
4
|
-
import {activeRange, currentRange, dayGrid, events, now, today, view as view2, viewDates, viewTitle} from './stores.js';
|
|
4
|
+
import {activeRange, currentRange, dayGrid, events, now, today, view as view2, viewDates, viewTitle, filteredEvents} from './stores.js';
|
|
5
5
|
import {identity, intl, intlRange, isFunction, keys} from '#lib';
|
|
6
6
|
|
|
7
7
|
export default class {
|
|
@@ -44,6 +44,7 @@ export default class {
|
|
|
44
44
|
this._viewDates = viewDates(this);
|
|
45
45
|
this._view = view2(this);
|
|
46
46
|
this._viewComponent = writable(undefined);
|
|
47
|
+
this._filteredEvents = filteredEvents(this);
|
|
47
48
|
// Interaction
|
|
48
49
|
this._interaction = writable({});
|
|
49
50
|
this._iEvents = writable([null, null]); // interaction events: [drag/resize, pointer]
|
package/src/storage/stores.js
CHANGED
|
@@ -179,6 +179,29 @@ export function events(state) {
|
|
|
179
179
|
return _events;
|
|
180
180
|
}
|
|
181
181
|
|
|
182
|
+
export function filteredEvents(state){
|
|
183
|
+
let view;
|
|
184
|
+
state._view.subscribe($_view => view = $_view);
|
|
185
|
+
let debounceHandle = {};
|
|
186
|
+
return derived(
|
|
187
|
+
[state._events, state.eventFilter],
|
|
188
|
+
(values, set) => debounce(() => {
|
|
189
|
+
let [$_events, $eventFilter] = values;
|
|
190
|
+
set(
|
|
191
|
+
isFunction($eventFilter)
|
|
192
|
+
? $_events.filter((event, index, events) => $eventFilter({
|
|
193
|
+
event,
|
|
194
|
+
index,
|
|
195
|
+
events,
|
|
196
|
+
view
|
|
197
|
+
}))
|
|
198
|
+
: $_events
|
|
199
|
+
);
|
|
200
|
+
}, debounceHandle, state._queue),
|
|
201
|
+
[]
|
|
202
|
+
);
|
|
203
|
+
}
|
|
204
|
+
|
|
182
205
|
export function now() {
|
|
183
206
|
return readable(createDate(), set => {
|
|
184
207
|
let interval = setInterval(() => {
|