@event-calendar/core 4.3.0 → 4.4.0

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 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.3.0/dist/event-calendar.min.css">
231
- <script src="https://cdn.jsdelivr.net/npm/@event-calendar/build@4.3.0/dist/event-calendar.min.js"></script>
231
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@event-calendar/build@4.4.0/dist/event-calendar.min.css">
232
+ <script src="https://cdn.jsdelivr.net/npm/@event-calendar/build@4.4.0/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
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * EventCalendar v4.3.0
2
+ * EventCalendar v4.4.0
3
3
  * https://github.com/vkurko/calendar
4
4
  */
5
5
  .ec {
@@ -733,7 +733,6 @@
733
733
  border-top: var(--ec-now-indicator-color) solid 2px;
734
734
  }
735
735
  .ec-timeline .ec-now-indicator {
736
- height: 100%;
737
736
  border-left: var(--ec-now-indicator-color) solid 2px;
738
737
  will-change: transform;
739
738
  }
package/dist/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * EventCalendar v4.3.0
2
+ * EventCalendar v4.4.0
3
3
  * https://github.com/vkurko/calendar
4
4
  */
5
5
  import { tick, getContext, untrack, setContext, onMount, mount, unmount } from "svelte";
@@ -299,13 +299,14 @@ function ancestor(el, up) {
299
299
  function height(el) {
300
300
  return rect(el).height;
301
301
  }
302
- function getElementWithPayload(x, y, root2 = document) {
302
+ function getElementWithPayload(x, y, root2 = document, processed = []) {
303
+ processed.push(root2);
303
304
  for (let el of root2.elementsFromPoint(x, y)) {
304
305
  if (hasPayload(el)) {
305
306
  return el;
306
307
  }
307
- if (el.shadowRoot && el.shadowRoot !== root2) {
308
- let shadowEl = getElementWithPayload(x, y, el.shadowRoot);
308
+ if (el.shadowRoot && !processed.includes(el.shadowRoot)) {
309
+ let shadowEl = getElementWithPayload(x, y, el.shadowRoot, processed);
309
310
  if (shadowEl) {
310
311
  return shadowEl;
311
312
  }
@@ -821,15 +822,17 @@ function createOptions(plugins) {
821
822
  events: [],
822
823
  eventAllUpdated: void 0,
823
824
  eventBackgroundColor: void 0,
824
- eventTextColor: void 0,
825
825
  eventClassNames: void 0,
826
826
  eventClick: void 0,
827
827
  eventColor: void 0,
828
828
  eventContent: void 0,
829
829
  eventDidMount: void 0,
830
+ eventFilter: void 0,
831
+ // ec option
830
832
  eventMouseEnter: void 0,
831
833
  eventMouseLeave: void 0,
832
834
  eventSources: [],
835
+ eventTextColor: void 0,
833
836
  eventTimeFormat: {
834
837
  hour: "numeric",
835
838
  minute: "2-digit"
@@ -1098,6 +1101,26 @@ function events(state) {
1098
1101
  ).subscribe(_events.set);
1099
1102
  return _events;
1100
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
+ }
1101
1124
  function now() {
1102
1125
  return readable(createDate(), (set) => {
1103
1126
  let interval = setInterval(() => {
@@ -1142,6 +1165,7 @@ class State {
1142
1165
  this._viewDates = viewDates(this);
1143
1166
  this._view = view(this);
1144
1167
  this._viewComponent = writable(void 0);
1168
+ this._filteredEvents = filteredEvents(this);
1145
1169
  this._interaction = writable({});
1146
1170
  this._iEvents = writable([null, null]);
1147
1171
  this._iClasses = writable(identity);
@@ -1240,12 +1264,12 @@ function filterOpts(opts, state) {
1240
1264
  function validKey(key, state) {
1241
1265
  return state.hasOwnProperty(key) && key[0] !== "_";
1242
1266
  }
1243
- var root_2$7 = $.template(`<h2></h2>`);
1244
- var root_4$3 = $.template(`<button><i></i></button>`);
1245
- var root_6$1 = $.template(`<button><i></i></button>`);
1246
- var root_8$1 = $.template(`<button> </button>`);
1247
- var root_10$1 = $.template(`<button></button>`);
1248
- var root_12$1 = $.template(`<button> </button>`);
1267
+ var root_2$7 = $.from_html(`<h2></h2>`);
1268
+ var root_4$3 = $.from_html(`<button><i></i></button>`);
1269
+ var root_6$1 = $.from_html(`<button><i></i></button>`);
1270
+ var root_8$1 = $.from_html(`<button> </button>`);
1271
+ var root_10$1 = $.from_html(`<button></button>`);
1272
+ var root_12$1 = $.from_html(`<button> </button>`);
1249
1273
  function Buttons($$anchor, $$props) {
1250
1274
  $.push($$props, false);
1251
1275
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -1464,9 +1488,9 @@ function Buttons($$anchor, $$props) {
1464
1488
  $.pop();
1465
1489
  $$cleanup();
1466
1490
  }
1467
- var root_3$5 = $.template(`<div><!></div>`);
1468
- var root_1$d = $.template(`<div></div>`);
1469
- var root$r = $.template(`<nav></nav>`);
1491
+ var root_3$5 = $.from_html(`<div><!></div>`);
1492
+ var root_1$d = $.from_html(`<div></div>`);
1493
+ var root$r = $.from_html(`<nav></nav>`);
1470
1494
  function Toolbar($$anchor, $$props) {
1471
1495
  $.push($$props, true);
1472
1496
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -1600,7 +1624,7 @@ function Auxiliary$1($$anchor, $$props) {
1600
1624
  $.pop();
1601
1625
  $$cleanup();
1602
1626
  }
1603
- var root$q = $.template(`<div><!> <!></div> <!>`, 1);
1627
+ var root$q = $.from_html(`<div><!> <!></div> <!>`, 1);
1604
1628
  function Calendar($$anchor, $$props) {
1605
1629
  $.push($$props, true);
1606
1630
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -1772,8 +1796,8 @@ function days(state) {
1772
1796
  return days2;
1773
1797
  });
1774
1798
  }
1775
- var root_1$c = $.template(`<div role="columnheader"><span></span></div>`);
1776
- var root$p = $.template(`<div><div role="row"></div> <div></div></div>`);
1799
+ var root_1$c = $.from_html(`<div role="columnheader"><span></span></div>`);
1800
+ var root$p = $.from_html(`<div><div role="row"></div> <div></div></div>`);
1777
1801
  function Header$1($$anchor, $$props) {
1778
1802
  $.push($$props, false);
1779
1803
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -1823,8 +1847,8 @@ function Header$1($$anchor, $$props) {
1823
1847
  $.pop();
1824
1848
  $$cleanup();
1825
1849
  }
1826
- var root_1$b = $.template(`<div></div>`);
1827
- var root$o = $.template(`<article><!></article>`);
1850
+ var root_1$b = $.from_html(`<div></div>`);
1851
+ var root$o = $.from_html(`<article><!></article>`);
1828
1852
  function BaseEvent($$anchor, $$props) {
1829
1853
  $.push($$props, true);
1830
1854
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -1871,7 +1895,7 @@ function BaseEvent($$anchor, $$props) {
1871
1895
  bgEvent($.get(display)) ? $theme().bgEvent : $theme().event,
1872
1896
  ...createEventClasses($eventClassNames(), $.get(event), $_view())
1873
1897
  ]).join(" "));
1874
- let $$d = $.derived(() => createEventContent($$props.chunk, $displayEventEnd(), $eventContent(), $theme(), $_intlEventTime(), $_view())), timeText = $.derived(() => $.get($$d)[0]), content = $.derived(() => $.get($$d)[1]);
1898
+ let $$d = $.derived(() => createEventContent($$props.chunk, $displayEventEnd(), $eventContent(), $theme(), $_intlEventTime(), $_view())), $$array = $.derived(() => $.to_array($.get($$d), 2)), timeText = $.derived(() => $.get($$array)[0]), content = $.derived(() => $.get($$array)[1]);
1875
1899
  onMount(() => {
1876
1900
  if (isFunction($eventDidMount())) {
1877
1901
  $eventDidMount()({
@@ -2141,7 +2165,7 @@ function Event$4($$anchor, $$props) {
2141
2165
  $$cleanup();
2142
2166
  return $$pop;
2143
2167
  }
2144
- var root$n = $.template(`<div><div><time></time> <a role="button" tabindex="0">&times;</a></div> <div></div></div>`);
2168
+ var root$n = $.from_html(`<div><div><time></time> <a role="button" tabindex="0">&times;</a></div> <div></div></div>`);
2145
2169
  function Popup($$anchor, $$props) {
2146
2170
  $.push($$props, true);
2147
2171
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -2268,12 +2292,12 @@ function Popup($$anchor, $$props) {
2268
2292
  $$cleanup();
2269
2293
  }
2270
2294
  $.delegate(["pointerdown", "click", "keydown"]);
2271
- var root_1$a = $.template(`<span></span>`);
2272
- var root_5$1 = $.template(`<div><!></div>`);
2273
- var root_6 = $.template(`<div><!></div>`);
2274
- var root_4$2 = $.template(`<!> <!>`, 1);
2275
- var root_10 = $.template(`<a role="button" tabindex="0" aria-haspopup="true"></a>`);
2276
- var root$m = $.template(`<div role="cell"><div><time></time> <!></div> <div><!></div> <!> <div><!></div> <!> <div><!></div></div>`);
2295
+ var root_1$a = $.from_html(`<span></span>`);
2296
+ var root_5$1 = $.from_html(`<div><!></div>`);
2297
+ var root_6 = $.from_html(`<div><!></div>`);
2298
+ var root_4$2 = $.from_html(`<!> <!>`, 1);
2299
+ var root_10 = $.from_html(`<a role="button" tabindex="0" aria-haspopup="true"></a>`);
2300
+ var root$m = $.from_html(`<div role="cell"><div><time></time> <!></div> <div><!></div> <!> <div><!></div> <!> <div><!></div></div>`);
2277
2301
  function Day$4($$anchor, $$props) {
2278
2302
  $.push($$props, true);
2279
2303
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -2570,19 +2594,19 @@ function Day$4($$anchor, $$props) {
2570
2594
  return $$pop;
2571
2595
  }
2572
2596
  $.delegate(["pointerdown", "click", "keydown"]);
2573
- var root$l = $.template(`<div role="row"></div>`);
2597
+ var root$l = $.from_html(`<div role="row"></div>`);
2574
2598
  function Week$1($$anchor, $$props) {
2575
2599
  $.push($$props, true);
2576
2600
  const [$$stores, $$cleanup] = $.setup_stores();
2577
2601
  const $validRange = () => $.store_get(validRange, "$validRange", $$stores);
2578
- const $_events = () => $.store_get(_events, "$_events", $$stores);
2602
+ const $_filteredEvents = () => $.store_get(_filteredEvents, "$_filteredEvents", $$stores);
2579
2603
  const $filterEventsWithResources = () => $.store_get(filterEventsWithResources, "$filterEventsWithResources", $$stores);
2580
2604
  const $resources = () => $.store_get(resources, "$resources", $$stores);
2581
2605
  const $hiddenDays = () => $.store_get(hiddenDays, "$hiddenDays", $$stores);
2582
2606
  const $_iEvents = () => $.store_get(_iEvents, "$_iEvents", $$stores);
2583
2607
  const $theme = () => $.store_get(theme, "$theme", $$stores);
2584
2608
  let {
2585
- _events,
2609
+ _filteredEvents,
2586
2610
  _iEvents,
2587
2611
  resources,
2588
2612
  filterEventsWithResources,
@@ -2596,7 +2620,7 @@ function Week$1($$anchor, $$props) {
2596
2620
  let $$d = $.derived(() => {
2597
2621
  let chunks2 = [];
2598
2622
  let bgChunks2 = [];
2599
- for (let event of $_events()) {
2623
+ for (let event of $_filteredEvents()) {
2600
2624
  if (eventIntersects(event, $.get(start), $.get(end), $filterEventsWithResources() ? $resources() : void 0)) {
2601
2625
  let chunk = createEventChunk(event, $.get(start), $.get(end));
2602
2626
  if (bgEvent(event.display)) {
@@ -2611,7 +2635,7 @@ function Week$1($$anchor, $$props) {
2611
2635
  prepareEventChunks$1(bgChunks2, $hiddenDays());
2612
2636
  let longChunks2 = prepareEventChunks$1(chunks2, $hiddenDays());
2613
2637
  return [chunks2, bgChunks2, longChunks2];
2614
- }), chunks = $.derived(() => $.get($$d)[0]), bgChunks = $.derived(() => $.get($$d)[1]), longChunks = $.derived(() => $.get($$d)[2]);
2638
+ }), $$array = $.derived(() => $.to_array($.get($$d), 3)), chunks = $.derived(() => $.get($$array)[0]), bgChunks = $.derived(() => $.get($$array)[1]), longChunks = $.derived(() => $.get($$array)[2]);
2615
2639
  let iChunks = $.derived(() => $_iEvents().map((event) => {
2616
2640
  let chunk;
2617
2641
  if (event && eventIntersects(event, $.get(start), $.get(end))) {
@@ -2660,7 +2684,7 @@ function Week$1($$anchor, $$props) {
2660
2684
  $$cleanup();
2661
2685
  return $$pop;
2662
2686
  }
2663
- var root$k = $.template(`<div><div></div></div>`);
2687
+ var root$k = $.from_html(`<div><div></div></div>`);
2664
2688
  function Body$3($$anchor, $$props) {
2665
2689
  $.push($$props, true);
2666
2690
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -2735,7 +2759,7 @@ function Body$3($$anchor, $$props) {
2735
2759
  $.pop();
2736
2760
  $$cleanup();
2737
2761
  }
2738
- var root$j = $.template(`<!> <!>`, 1);
2762
+ var root$j = $.from_html(`<!> <!>`, 1);
2739
2763
  function View$4($$anchor) {
2740
2764
  var fragment = root$j();
2741
2765
  var node = $.first_child(fragment);
@@ -3487,9 +3511,9 @@ function Pointer($$anchor, $$props) {
3487
3511
  $$cleanup();
3488
3512
  return $$pop;
3489
3513
  }
3490
- var root_1$9 = $.template(`<div></div>`);
3491
- var root_2$6 = $.template(`<div></div>`);
3492
- var root$i = $.template(`<!> <!> <!>`, 1);
3514
+ var root_1$9 = $.from_html(`<div></div>`);
3515
+ var root_2$6 = $.from_html(`<div></div>`);
3516
+ var root$i = $.from_html(`<!> <!> <!>`, 1);
3493
3517
  function Resizer($$anchor, $$props) {
3494
3518
  $.push($$props, true);
3495
3519
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -3555,7 +3579,7 @@ function Resizer($$anchor, $$props) {
3555
3579
  $$cleanup();
3556
3580
  }
3557
3581
  $.delegate(["pointerdown"]);
3558
- var root$h = $.template(`<!> <!>`, 1);
3582
+ var root$h = $.from_html(`<!> <!>`, 1);
3559
3583
  function Auxiliary($$anchor, $$props) {
3560
3584
  $.push($$props, true);
3561
3585
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -3663,7 +3687,7 @@ const index$3 = {
3663
3687
  state._auxiliary.update(($_auxiliary) => [...$_auxiliary, Auxiliary]);
3664
3688
  }
3665
3689
  };
3666
- var root_1$8 = $.template(`<div></div> <!>`, 1);
3690
+ var root_1$8 = $.from_html(`<div></div> <!>`, 1);
3667
3691
  function Event$3($$anchor, $$props) {
3668
3692
  $.push($$props, true);
3669
3693
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -3709,14 +3733,14 @@ function Event$3($$anchor, $$props) {
3709
3733
  $.pop();
3710
3734
  $$cleanup();
3711
3735
  }
3712
- var root_1$7 = $.template(`<div role="listitem"><h4><time></time> <time></time></h4> <!></div>`);
3736
+ var root_1$7 = $.from_html(`<div role="listitem"><h4><time></time> <time></time></h4> <!></div>`);
3713
3737
  function Day$3($$anchor, $$props) {
3714
3738
  $.push($$props, true);
3715
3739
  const [$$stores, $$cleanup] = $.setup_stores();
3716
3740
  const $_today = () => $.store_get(_today, "$_today", $$stores);
3717
3741
  const $highlightedDates = () => $.store_get(highlightedDates, "$highlightedDates", $$stores);
3718
3742
  const $validRange = () => $.store_get(validRange, "$validRange", $$stores);
3719
- const $_events = () => $.store_get(_events, "$_events", $$stores);
3743
+ const $_filteredEvents = () => $.store_get(_filteredEvents, "$_filteredEvents", $$stores);
3720
3744
  const $filterEventsWithResources = () => $.store_get(filterEventsWithResources, "$filterEventsWithResources", $$stores);
3721
3745
  const $resources = () => $.store_get(resources, "$resources", $$stores);
3722
3746
  const $theme = () => $.store_get(theme, "$theme", $$stores);
@@ -3724,7 +3748,7 @@ function Day$3($$anchor, $$props) {
3724
3748
  const $_intlListDay = () => $.store_get(_intlListDay, "$_intlListDay", $$stores);
3725
3749
  const $_intlListDaySide = () => $.store_get(_intlListDaySide, "$_intlListDaySide", $$stores);
3726
3750
  let {
3727
- _events,
3751
+ _filteredEvents,
3728
3752
  _interaction,
3729
3753
  _intlListDay,
3730
3754
  _intlListDaySide,
@@ -3745,7 +3769,7 @@ function Day$3($$anchor, $$props) {
3745
3769
  if (!$.get(disabled)) {
3746
3770
  let start = $$props.date;
3747
3771
  let end = addDay(cloneDate($$props.date));
3748
- for (let event of $_events()) {
3772
+ for (let event of $_filteredEvents()) {
3749
3773
  if (!bgEvent(event.display) && eventIntersects(event, start, end, $filterEventsWithResources() ? $resources() : void 0)) {
3750
3774
  let chunk = createEventChunk(event, start, end);
3751
3775
  chunks2.push(chunk);
@@ -3825,8 +3849,8 @@ function onclick$1(jsEvent, $noEventsClick, noEventsClick, $_view, _view) {
3825
3849
  });
3826
3850
  }
3827
3851
  }
3828
- var root_1$6 = $.template(`<div></div>`);
3829
- var root$g = $.template(`<div><div><!></div></div>`);
3852
+ var root_1$6 = $.from_html(`<div></div>`);
3853
+ var root$g = $.from_html(`<div><div><!></div></div>`);
3830
3854
  function Body$2($$anchor, $$props) {
3831
3855
  $.push($$props, true);
3832
3856
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -4015,8 +4039,8 @@ function createAllDayContent(allDayContent) {
4015
4039
  }
4016
4040
  return content;
4017
4041
  }
4018
- var root_1$5 = $.template(`<time></time>`);
4019
- var root$f = $.template(`<div><div></div> <!></div> <div role="row"><div><!></div> <!></div>`, 1);
4042
+ var root_1$5 = $.from_html(`<time></time>`);
4043
+ var root$f = $.from_html(`<div><div></div> <!></div> <div role="row"><div><!></div> <!></div>`, 1);
4020
4044
  function Section($$anchor, $$props) {
4021
4045
  $.push($$props, true);
4022
4046
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -4085,8 +4109,8 @@ function Section($$anchor, $$props) {
4085
4109
  $.pop();
4086
4110
  $$cleanup();
4087
4111
  }
4088
- var root_2$5 = $.template(`<div></div>`);
4089
- var root$e = $.template(`<div><div><!></div></div>`);
4112
+ var root_2$5 = $.from_html(`<div></div>`);
4113
+ var root$e = $.from_html(`<div><div><!></div></div>`);
4090
4114
  function Body$1($$anchor, $$props) {
4091
4115
  $.push($$props, true);
4092
4116
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -4199,7 +4223,7 @@ function Event$2($$anchor, $$props) {
4199
4223
  $.pop();
4200
4224
  $$cleanup();
4201
4225
  }
4202
- var root$d = $.template(`<div></div>`);
4226
+ var root$d = $.from_html(`<div></div>`);
4203
4227
  function NowIndicator$1($$anchor, $$props) {
4204
4228
  $.push($$props, true);
4205
4229
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -4232,8 +4256,8 @@ function NowIndicator$1($$anchor, $$props) {
4232
4256
  $.pop();
4233
4257
  $$cleanup();
4234
4258
  }
4235
- var root_3$4 = $.template(`<!> <!> <!>`, 1);
4236
- var root$c = $.template(`<div role="cell"><div><!></div> <div><!></div> <div><!></div></div>`);
4259
+ var root_3$4 = $.from_html(`<!> <!> <!>`, 1);
4260
+ var root$c = $.from_html(`<div role="cell"><div><!></div> <div><!></div> <div><!></div></div>`);
4237
4261
  function Day$2($$anchor, $$props) {
4238
4262
  $.push($$props, true);
4239
4263
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -4243,7 +4267,7 @@ function Day$2($$anchor, $$props) {
4243
4267
  const $_slotTimeLimits = () => $.store_get(_slotTimeLimits, "$_slotTimeLimits", $$stores);
4244
4268
  const $filterEventsWithResources = () => $.store_get(filterEventsWithResources, "$filterEventsWithResources", $$stores);
4245
4269
  const $resources = () => $.store_get(resources, "$resources", $$stores);
4246
- const $_events = () => $.store_get(_events, "$_events", $$stores);
4270
+ const $_filteredEvents = () => $.store_get(_filteredEvents, "$_filteredEvents", $$stores);
4247
4271
  const $_iEvents = () => $.store_get(_iEvents, "$_iEvents", $$stores);
4248
4272
  const $slotDuration = () => $.store_get(slotDuration, "$slotDuration", $$stores);
4249
4273
  const $slotHeight = () => $.store_get(slotHeight, "$slotHeight", $$stores);
@@ -4252,7 +4276,7 @@ function Day$2($$anchor, $$props) {
4252
4276
  const $nowIndicator = () => $.store_get(nowIndicator, "$nowIndicator", $$stores);
4253
4277
  let resource = $.prop($$props, "resource", 3, void 0);
4254
4278
  let {
4255
- _events,
4279
+ _filteredEvents,
4256
4280
  _iEvents,
4257
4281
  highlightedDates,
4258
4282
  nowIndicator,
@@ -4279,7 +4303,7 @@ function Day$2($$anchor, $$props) {
4279
4303
  }
4280
4304
  let chunks2 = [];
4281
4305
  let bgChunks2 = [];
4282
- for (let event of $_events()) {
4306
+ for (let event of $_filteredEvents()) {
4283
4307
  if ((!event.allDay || bgEvent(event.display)) && eventIntersects(event, $.get(start), $.get(end), $.get(resourceFilter))) {
4284
4308
  let chunk = createEventChunk(event, $.get(start), $.get(end));
4285
4309
  switch (event.display) {
@@ -4293,7 +4317,7 @@ function Day$2($$anchor, $$props) {
4293
4317
  }
4294
4318
  groupEventChunks(chunks2);
4295
4319
  return [chunks2, bgChunks2];
4296
- }), chunks = $.derived(() => $.get($$d)[0]), bgChunks = $.derived(() => $.get($$d)[1]);
4320
+ }), $$array = $.derived(() => $.to_array($.get($$d), 2)), chunks = $.derived(() => $.get($$array)[0]), bgChunks = $.derived(() => $.get($$array)[1]);
4297
4321
  let iChunks = $.derived(() => {
4298
4322
  if ($.get(disabled)) {
4299
4323
  return [];
@@ -4468,8 +4492,8 @@ function Event$1($$anchor, $$props) {
4468
4492
  });
4469
4493
  return $.pop({ reposition });
4470
4494
  }
4471
- var root_3$3 = $.template(`<div><!></div>`);
4472
- var root$b = $.template(`<div role="cell"><div><!></div> <!> <div><!></div></div>`);
4495
+ var root_3$3 = $.from_html(`<div><!></div>`);
4496
+ var root$b = $.from_html(`<div role="cell"><div><!></div> <!> <div><!></div></div>`);
4473
4497
  function Day$1($$anchor, $$props) {
4474
4498
  $.push($$props, true);
4475
4499
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -4605,12 +4629,12 @@ function Week($$anchor, $$props) {
4605
4629
  const $validRange = () => $.store_get(validRange, "$validRange", $$stores);
4606
4630
  const $filterEventsWithResources = () => $.store_get(filterEventsWithResources, "$filterEventsWithResources", $$stores);
4607
4631
  const $resources = () => $.store_get(resources, "$resources", $$stores);
4608
- const $_events = () => $.store_get(_events, "$_events", $$stores);
4632
+ const $_filteredEvents = () => $.store_get(_filteredEvents, "$_filteredEvents", $$stores);
4609
4633
  const $hiddenDays = () => $.store_get(hiddenDays, "$hiddenDays", $$stores);
4610
4634
  const $_iEvents = () => $.store_get(_iEvents, "$_iEvents", $$stores);
4611
4635
  let resource = $.prop($$props, "resource", 3, void 0);
4612
4636
  let {
4613
- _events,
4637
+ _filteredEvents,
4614
4638
  _iEvents,
4615
4639
  hiddenDays,
4616
4640
  resources,
@@ -4624,7 +4648,7 @@ function Week($$anchor, $$props) {
4624
4648
  let $$d = $.derived(() => {
4625
4649
  let chunks2 = [];
4626
4650
  let bgChunks2 = [];
4627
- for (let event of $_events()) {
4651
+ for (let event of $_filteredEvents()) {
4628
4652
  if (event.allDay && eventIntersects(event, $.get(start), $.get(end), $.get(resourceFilter))) {
4629
4653
  let chunk = createEventChunk(event, $.get(start), $.get(end));
4630
4654
  if (bgEvent(event.display)) {
@@ -4637,7 +4661,7 @@ function Week($$anchor, $$props) {
4637
4661
  prepareEventChunks$1(bgChunks2, $hiddenDays());
4638
4662
  let longChunks2 = prepareEventChunks$1(chunks2, $hiddenDays());
4639
4663
  return [chunks2, bgChunks2, longChunks2];
4640
- }), chunks = $.derived(() => $.get($$d)[0]), bgChunks = $.derived(() => $.get($$d)[1]), longChunks = $.derived(() => $.get($$d)[2]);
4664
+ }), $$array = $.derived(() => $.to_array($.get($$d), 3)), chunks = $.derived(() => $.get($$array)[0]), bgChunks = $.derived(() => $.get($$array)[1]), longChunks = $.derived(() => $.get($$array)[2]);
4641
4665
  function reposition() {
4642
4666
  runReposition(refs, $$props.dates);
4643
4667
  }
@@ -4689,9 +4713,9 @@ function Week($$anchor, $$props) {
4689
4713
  $.pop();
4690
4714
  $$cleanup();
4691
4715
  }
4692
- var root_2$4 = $.template(`<div role="columnheader"><time></time></div>`);
4693
- var root_3$2 = $.template(`<div><div><!> <div></div></div></div>`);
4694
- var root$a = $.template(`<div><!> <div></div></div> <!> <!>`, 1);
4716
+ var root_2$4 = $.from_html(`<div role="columnheader"><time></time></div>`);
4717
+ var root_3$2 = $.from_html(`<div><div><!> <div></div></div></div>`);
4718
+ var root$a = $.from_html(`<div><!> <div></div></div> <!> <!>`, 1);
4695
4719
  function View$2($$anchor, $$props) {
4696
4720
  $.push($$props, false);
4697
4721
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -4826,7 +4850,7 @@ const TimeGrid = {
4826
4850
  state._times = times(state);
4827
4851
  }
4828
4852
  };
4829
- var root$9 = $.template(`<span></span>`);
4853
+ var root$9 = $.from_html(`<span></span>`);
4830
4854
  function Label$1($$anchor, $$props) {
4831
4855
  $.push($$props, true);
4832
4856
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -4879,17 +4903,17 @@ function Label$1($$anchor, $$props) {
4879
4903
  $.pop();
4880
4904
  $$cleanup();
4881
4905
  }
4882
- var root_3$1 = $.template(`<div><time></time></div>`);
4883
- var root_4$1 = $.template(`<div><!></div>`);
4884
- var root_7 = $.template(`<div role="columnheader"><!></div>`);
4885
- var root_8 = $.template(`<div role="columnheader"><time></time></div>`);
4886
- var root_5 = $.template(`<div></div>`);
4887
- var root_2$3 = $.template(`<div><!> <!></div>`);
4888
- var root_12 = $.template(`<div></div>`);
4889
- var root_15 = $.template(`<div><!></div>`);
4890
- var root_9 = $.template(`<div><div><!> <div></div></div></div>`);
4891
- var root_17 = $.template(`<div></div>`);
4892
- var root$8 = $.template(`<div><!> <div></div></div> <!> <!>`, 1);
4906
+ var root_3$1 = $.from_html(`<div><time></time></div>`);
4907
+ var root_4$1 = $.from_html(`<div><!></div>`);
4908
+ var root_7 = $.from_html(`<div role="columnheader"><!></div>`);
4909
+ var root_8 = $.from_html(`<div role="columnheader"><time></time></div>`);
4910
+ var root_5 = $.from_html(`<div></div>`);
4911
+ var root_2$3 = $.from_html(`<div><!> <!></div>`);
4912
+ var root_12 = $.from_html(`<div></div>`);
4913
+ var root_15 = $.from_html(`<div><!></div>`);
4914
+ var root_9 = $.from_html(`<div><div><!> <div></div></div></div>`);
4915
+ var root_17 = $.from_html(`<div></div>`);
4916
+ var root$8 = $.from_html(`<div><!> <div></div></div> <!> <!>`, 1);
4893
4917
  function View$1($$anchor, $$props) {
4894
4918
  $.push($$props, true);
4895
4919
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -5209,7 +5233,7 @@ function dayTimes(state) {
5209
5233
  function nestedResources(state) {
5210
5234
  return derived(state.resources, ($resources) => $resources.some((resource) => getPayload(resource).children.length));
5211
5235
  }
5212
- var root$7 = $.template(`<span></span>`);
5236
+ var root$7 = $.from_html(`<span></span>`);
5213
5237
  function Label($$anchor, $$props) {
5214
5238
  $.push($$props, true);
5215
5239
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -5250,9 +5274,9 @@ function onclick(_, expanded, payload, toggle, resources) {
5250
5274
  toggle($.get(payload).children, $.get(expanded));
5251
5275
  resources.update(identity);
5252
5276
  }
5253
- var root_1$4 = $.template(`<span></span>`);
5254
- var root_2$2 = $.template(`<button><!></button>`);
5255
- var root$6 = $.template(`<!> <span><!></span>`, 1);
5277
+ var root_1$4 = $.from_html(`<span></span>`);
5278
+ var root_2$2 = $.from_html(`<button><!></button>`);
5279
+ var root$6 = $.from_html(`<!> <span><!></span>`, 1);
5256
5280
  function Expander($$anchor, $$props) {
5257
5281
  $.push($$props, true);
5258
5282
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -5323,8 +5347,8 @@ function Expander($$anchor, $$props) {
5323
5347
  $$cleanup();
5324
5348
  }
5325
5349
  $.delegate(["click"]);
5326
- var root_1$3 = $.template(`<div role="rowheader"><!> <!></div>`);
5327
- var root$5 = $.template(`<div><div></div> <div></div></div>`);
5350
+ var root_1$3 = $.from_html(`<div role="rowheader"><!> <!></div>`);
5351
+ var root$5 = $.from_html(`<div><div></div> <div></div></div>`);
5328
5352
  function Sidebar($$anchor, $$props) {
5329
5353
  $.push($$props, false);
5330
5354
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -5399,11 +5423,11 @@ function Sidebar($$anchor, $$props) {
5399
5423
  $.pop();
5400
5424
  $$cleanup();
5401
5425
  }
5402
- var root_3 = $.template(`<div role="columnheader"><time></time></div>`);
5403
- var root_2$1 = $.template(`<div><time></time></div> <div></div>`, 1);
5404
- var root_4 = $.template(`<div role="columnheader"><time></time></div>`);
5405
- var root_1$2 = $.template(`<div><!></div>`);
5406
- var root$4 = $.template(`<div><div role="row"></div> <div></div></div>`);
5426
+ var root_3 = $.from_html(`<div role="columnheader"><time></time></div>`);
5427
+ var root_2$1 = $.from_html(`<div><time></time></div> <div></div>`, 1);
5428
+ var root_4 = $.from_html(`<div role="columnheader"><time></time></div>`);
5429
+ var root_1$2 = $.from_html(`<div><!></div>`);
5430
+ var root$4 = $.from_html(`<div><div role="row"></div> <div></div></div>`);
5407
5431
  function Header($$anchor, $$props) {
5408
5432
  $.push($$props, false);
5409
5433
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -5702,8 +5726,8 @@ function Event($$anchor, $$props) {
5702
5726
  $$cleanup();
5703
5727
  return $$pop;
5704
5728
  }
5705
- var root_1$1 = $.template(`<!> <!> <!> <!>`, 1);
5706
- var root$3 = $.template(`<div role="cell"><div><!></div></div>`);
5729
+ var root_1$1 = $.from_html(`<!> <!> <!> <!>`, 1);
5730
+ var root$3 = $.from_html(`<div role="cell"><div><!></div></div>`);
5707
5731
  function Day($$anchor, $$props) {
5708
5732
  $.push($$props, true);
5709
5733
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -5853,21 +5877,21 @@ function Day($$anchor, $$props) {
5853
5877
  return $$pop;
5854
5878
  }
5855
5879
  $.delegate(["pointerdown"]);
5856
- var root$2 = $.template(`<div role="row"></div>`);
5880
+ var root$2 = $.from_html(`<div role="row"></div>`);
5857
5881
  function Days($$anchor, $$props) {
5858
5882
  $.push($$props, true);
5859
5883
  const [$$stores, $$cleanup] = $.setup_stores();
5860
5884
  const $_viewDates = () => $.store_get(_viewDates, "$_viewDates", $$stores);
5861
5885
  const $validRange = () => $.store_get(validRange, "$validRange", $$stores);
5862
5886
  const $_dayTimeLimits = () => $.store_get(_dayTimeLimits, "$_dayTimeLimits", $$stores);
5863
- const $_events = () => $.store_get(_events, "$_events", $$stores);
5887
+ const $_filteredEvents = () => $.store_get(_filteredEvents, "$_filteredEvents", $$stores);
5864
5888
  const $slotDuration = () => $.store_get(slotDuration, "$slotDuration", $$stores);
5865
5889
  const $_iEvents = () => $.store_get(_iEvents, "$_iEvents", $$stores);
5866
5890
  const $_resHs = () => $.store_get(_resHs, "$_resHs", $$stores);
5867
5891
  const $theme = () => $.store_get(theme, "$theme", $$stores);
5868
5892
  let {
5869
5893
  _viewDates,
5870
- _events,
5894
+ _filteredEvents,
5871
5895
  _iEvents,
5872
5896
  _resHs,
5873
5897
  _dayTimeLimits,
@@ -5889,12 +5913,12 @@ function Days($$anchor, $$props) {
5889
5913
  addDay(end2);
5890
5914
  }
5891
5915
  return [start2, end2];
5892
- }), start = $.derived(() => $.get($$d)[0]), end = $.derived(() => $.get($$d)[1]);
5916
+ }), $$array = $.derived(() => $.to_array($.get($$d), 2)), start = $.derived(() => $.get($$array)[0]), end = $.derived(() => $.get($$array)[1]);
5893
5917
  let $$d_1 = $.derived(() => {
5894
5918
  let chunks2 = [];
5895
5919
  let bgChunks2 = [];
5896
5920
  let longChunks2;
5897
- for (let event of $_events()) {
5921
+ for (let event of $_filteredEvents()) {
5898
5922
  if (eventIntersects(event, $.get(start), $.get(end), $$props.resource)) {
5899
5923
  let chunk = createEventChunk(event, $.get(start), $.get(end));
5900
5924
  if (bgEvent(event.display)) {
@@ -5907,7 +5931,7 @@ function Days($$anchor, $$props) {
5907
5931
  [bgChunks2] = prepareEventChunks(bgChunks2, $_viewDates(), $_dayTimeLimits(), $slotDuration());
5908
5932
  [chunks2, longChunks2] = prepareEventChunks(chunks2, $_viewDates(), $_dayTimeLimits(), $slotDuration());
5909
5933
  return [chunks2, bgChunks2, longChunks2];
5910
- }), chunks = $.derived(() => $.get($$d_1)[0]), bgChunks = $.derived(() => $.get($$d_1)[1]), longChunks = $.derived(() => $.get($$d_1)[2]);
5934
+ }), $$array_3 = $.derived(() => $.to_array($.get($$d_1), 3)), chunks = $.derived(() => $.get($$array_3)[0]), bgChunks = $.derived(() => $.get($$array_3)[1]), longChunks = $.derived(() => $.get($$array_3)[2]);
5911
5935
  let iChunks = $.derived(() => $_iEvents().map((event) => {
5912
5936
  let chunk;
5913
5937
  if (event && eventIntersects(event, $.get(start), $.get(end), $$props.resource)) {
@@ -5964,8 +5988,8 @@ function Days($$anchor, $$props) {
5964
5988
  $$cleanup();
5965
5989
  return $$pop;
5966
5990
  }
5967
- var root_2 = $.template(`<div></div>`);
5968
- var root$1 = $.template(`<div><div><div></div> <!></div></div>`);
5991
+ var root_2 = $.from_html(`<div></div>`);
5992
+ var root$1 = $.from_html(`<div><div><div></div> <!></div></div>`);
5969
5993
  function Body($$anchor, $$props) {
5970
5994
  $.push($$props, true);
5971
5995
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -6073,7 +6097,7 @@ function Body($$anchor, $$props) {
6073
6097
  $.pop();
6074
6098
  $$cleanup();
6075
6099
  }
6076
- var root_1 = $.template(`<div></div>`);
6100
+ var root_1 = $.from_html(`<div></div>`);
6077
6101
  function NowIndicator($$anchor, $$props) {
6078
6102
  $.push($$props, true);
6079
6103
  const [$$stores, $$cleanup] = $.setup_stores();
@@ -6145,7 +6169,7 @@ function NowIndicator($$anchor, $$props) {
6145
6169
  $.pop();
6146
6170
  $$cleanup();
6147
6171
  }
6148
- var root = $.template(`<div><!> <div><!> <!> <!></div></div>`);
6172
+ var root = $.from_html(`<div><!> <div><!> <!> <!></div></div>`);
6149
6173
  function View($$anchor, $$props) {
6150
6174
  $.push($$props, false);
6151
6175
  const [$$stores, $$cleanup] = $.setup_stores();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@event-calendar/core",
3
- "version": "4.3.0",
3
+ "version": "4.4.0",
4
4
  "title": "Event Calendar Core package",
5
5
  "description": "Full-sized drag & drop event calendar with resource & timeline views",
6
6
  "keywords": [
@@ -32,6 +32,6 @@
32
32
  "#components": "./src/lib/components/index.js"
33
33
  },
34
34
  "dependencies": {
35
- "svelte": "^5.28.6"
35
+ "svelte": "^5.33.14"
36
36
  }
37
37
  }
package/src/lib/dom.js CHANGED
@@ -35,14 +35,15 @@ export function height(el) {
35
35
  return rect(el).height;
36
36
  }
37
37
 
38
- export function getElementWithPayload(x, y, root = document) {
38
+ export function getElementWithPayload(x, y, root = document, processed = []) {
39
+ processed.push(root);
39
40
  for (let el of root.elementsFromPoint(x, y)) {
40
41
  if (hasPayload(el)) {
41
42
  return el;
42
43
  }
43
44
  /** @see https://github.com/vkurko/calendar/issues/142 */
44
- if (el.shadowRoot && el.shadowRoot !== root) {
45
- let shadowEl = getElementWithPayload(x, y, el.shadowRoot);
45
+ if (el.shadowRoot && !processed.includes(el.shadowRoot)) {
46
+ let shadowEl = getElementWithPayload(x, y, el.shadowRoot, processed);
46
47
  if (shadowEl) {
47
48
  return shadowEl;
48
49
  }
@@ -8,8 +8,8 @@
8
8
 
9
9
  let {dates} = $props();
10
10
 
11
- let {_events, _iEvents,
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 $_events) {
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)) {
@@ -8,7 +8,7 @@
8
8
 
9
9
  let {date} = $props();
10
10
 
11
- let {_events, _interaction, _intlListDay, _intlListDaySide, _today,
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 $_events) {
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);
@@ -10,7 +10,7 @@
10
10
  let {resource} = $props();
11
11
 
12
12
  let {
13
- _viewDates, _events, _iEvents, _resHs, _dayTimeLimits, slotDuration, theme, validRange
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 $_events) {
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)) {
@@ -10,8 +10,8 @@
10
10
 
11
11
  let {date, resource = undefined} = $props();
12
12
 
13
- let {_events, _iEvents, highlightedDates, nowIndicator, slotDuration, slotHeight, filterEventsWithResources, theme,
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 $_events) {
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 {_events, _iEvents, hiddenDays, resources, filterEventsWithResources, validRange} = getContext('state');
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 $_events) {
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)) {
@@ -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'
@@ -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]
@@ -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(() => {
@@ -503,7 +503,6 @@
503
503
  border-top: var(--ec-now-indicator-color) solid 2px;
504
504
  }
505
505
  .ec-timeline & {
506
- height: 100%;
507
506
  border-left: var(--ec-now-indicator-color) solid 2px;
508
507
  will-change: transform;
509
508
  }