@event-calendar/core 5.2.2 → 5.2.4

package/dist/index.js

@@ -1,5 +1,5 @@
 /*!
- * EventCalendar v5.2.2
+ * EventCalendar v5.2.4
  * https://github.com/vkurko/calendar
  */
 import { untrack, getAbortSignal, tick, getContext, setContext, onMount, mount, unmount } from "svelte";
@@ -219,18 +219,22 @@ function copyTime(toDate, fromDate) {
 function toSeconds(duration) {
   return duration.seconds;
 }
-function nextDate(date, duration) {
+function nextDate(date, duration, hiddenDays) {
   addDuration(date, duration);
+  _skipHiddenDays(date, hiddenDays, addDay);
   return date;
 }
 function prevDate(date, duration, hiddenDays) {
   subtractDuration(date, duration);
+  _skipHiddenDays(date, hiddenDays, subtractDay);
+  return date;
+}
+function _skipHiddenDays(date, hiddenDays, dateFn) {
   if (hiddenDays.length && hiddenDays.length < 7) {
     while (hiddenDays.includes(date.getUTCDay())) {
-      subtractDay(date);
+      dateFn(date);
     }
   }
-  return date;
 }
 function getWeekNumber(date, firstDay) {
   date = cloneDate(date);
@@ -985,8 +989,11 @@ function diff(options, prevOptions) {
 function loadEvents(mainState) {
   let fetching = 0;
   return () => {
-    let { activeRange: activeRange2, fetchedRange, options: { events, eventSources, lazyFetching, loading } } = mainState;
+    let { activeRange: activeRange2, fetchedRange, viewDates: viewDates2, options: { events, eventSources, lazyFetching, loading } } = mainState;
     untrack(() => {
+      if (!viewDates2.length) {
+        return;
+      }
       if (!eventSources.length) {
         mainState.events = events;
       }
@@ -1132,17 +1139,17 @@ function activeRange(mainState) {
 }
 function filteredEvents(mainState) {
   return () => {
-    let { events, options: { eventFilter, eventOrder, filterEventsWithResources, resources } } = mainState;
+    let { events, options: { eventFilter, eventOrder, filterEventsWithResources, resources, view: view2 } } = mainState;
     let result = [...events];
     untrack(() => {
       if (isFunction(eventFilter)) {
         let events2 = events.map(toEventWithLocalDates);
-        let view2 = toViewWithLocalDates(mainState.view);
+        let view3 = toViewWithLocalDates(mainState.view);
         result = result.filter((event, index2) => eventFilter({
           event: toEventWithLocalDates(event),
           index: index2,
           events: events2,
-          view: view2
+          view: view3
         }));
       }
       if (filterEventsWithResources) {
@@ -1175,9 +1182,12 @@ function viewDates(mainState) {
         addDay(date);
       }
       if (!dates.length && hiddenDays.length && hiddenDays.length < 7) {
-        while (hiddenDays.includes(options.date.getUTCDay())) {
-          mainState.setOption("date", addDay(cloneDate(options.date)));
+        while (hiddenDays.includes(date.getUTCDay())) {
+          addDay(date);
         }
+        tick().then(() => {
+          mainState.setOption("date", date);
+        });
       }
     });
     return dates;
@@ -1408,12 +1418,12 @@ class State {
     this.#setOption(name, value, parsed);
   }
 }
-var root_2$4 = $.from_html(`<h2></h2>`);
+var root_2$5 = $.from_html(`<h2></h2>`);
 var root_4$1 = $.from_html(`<button><i></i></button>`);
 var root_6$1 = $.from_html(`<button><i></i></button>`);
-var root_8 = $.from_html(`<button> </button>`);
+var root_8$1 = $.from_html(`<button> </button>`);
 var root_10 = $.from_html(`<button></button>`);
-var root_12 = $.from_html(`<button> </button>`);
+var root_12$1 = $.from_html(`<button> </button>`);
 function Buttons($$anchor, $$props) {
   $.push($$props, true);
   let mainState = getContext("state");
@@ -1462,7 +1472,7 @@ function Buttons($$anchor, $$props) {
     mainState.setOption("date", prevDate(cloneDate($.get(date)), $.get(duration), $.get(hiddenDays)));
   }
   function next() {
-    mainState.setOption("date", nextDate(cloneDate($.get(date)), $.get(duration)));
+    mainState.setOption("date", nextDate(cloneDate($.get(date)), $.get(duration), $.get(hiddenDays)));
   }
   function setToday() {
     mainState.setOption("date", cloneDate($.get(today)));
@@ -1474,7 +1484,7 @@ function Buttons($$anchor, $$props) {
     var node_1 = $.first_child(fragment_1);
     {
       var consequent = ($$anchor3) => {
-        var h2 = root_2$4();
+        var h2 = root_2$5();
         $.attach(h2, () => contentFrom($.get(viewTitle2)));
         $.template_effect(() => $.set_class(h2, 1, $.get(theme).title));
         $.append($$anchor3, h2);
@@ -1520,7 +1530,7 @@ function Buttons($$anchor, $$props) {
                 var node_4 = $.first_child(fragment_4);
                 {
                   var consequent_3 = ($$anchor6) => {
-                    var button_3 = root_8();
+                    var button_3 = root_8$1();
                     button_3.__click = setToday;
                     var text = $.child(button_3, true);
                     $.reset(button_3);
@@ -1553,7 +1563,7 @@ function Buttons($$anchor, $$props) {
                         var node_6 = $.first_child(fragment_6);
                         {
                           var consequent_5 = ($$anchor8) => {
-                            var button_5 = root_12();
+                            var button_5 = root_12$1();
                             button_5.__click = () => mainState.setOption("view", $.get(button));
                             var text_1 = $.child(button_5, true);
                             $.reset(button_5);
@@ -1633,8 +1643,8 @@ function Buttons($$anchor, $$props) {
 }
 $.delegate(["click"]);
 var root_3$1 = $.from_html(`<div><!></div>`);
-var root_1$a = $.from_html(`<div></div>`);
-var root$e = $.from_html(`<nav></nav>`);
+var root_1$c = $.from_html(`<div></div>`);
+var root$b = $.from_html(`<nav></nav>`);
 function Toolbar($$anchor, $$props) {
   $.push($$props, true);
   let $$d = $.derived(() => getContext("state")), headerToolbar = $.derived(() => $.get($$d).options.headerToolbar), theme = $.derived(() => $.get($$d).options.theme);
@@ -1645,9 +1655,9 @@ function Toolbar($$anchor, $$props) {
     }
     return sections2;
   });
-  var nav = root$e();
+  var nav = root$b();
   $.each(nav, 21, () => keys($.get(sections)), $.index, ($$anchor2, key) => {
-    var div = root_1$a();
+    var div = root_1$c();
     $.each(div, 21, () => $.get(sections)[$.get(key)], $.index, ($$anchor3, buttons) => {
       var fragment = $.comment();
       var node = $.first_child(fragment);
@@ -1687,7 +1697,7 @@ function Toolbar($$anchor, $$props) {
   $.append($$anchor, nav);
   $.pop();
 }
-var root$d = $.from_html(`<div><!> <!> <!></div>`);
+var root$a = $.from_html(`<div><!> <!> <!></div>`);
 function Calendar($$anchor, $$props) {
   $.push($$props, true);
   let plugins = $.prop($$props, "plugins", 19, () => []), options = $.prop($$props, "options", 19, () => ({}));
@@ -1776,7 +1786,7 @@ function Calendar($$anchor, $$props) {
     return null;
   }
   function next() {
-    mainState.setOption("date", nextDate(cloneDate($.get(date)), $.get(duration)));
+    mainState.setOption("date", nextDate(cloneDate($.get(date)), $.get(duration), $.get(hiddenDays)));
     return this;
   }
   function prev() {
@@ -1798,7 +1808,7 @@ function Calendar($$anchor, $$props) {
     next,
     prev
   };
-  var div = root$d();
+  var div = root$a();
   let styles;
   var node = $.child(div);
   Toolbar(node, {});
@@ -2000,7 +2010,7 @@ let ViewState$4 = class ViewState {
     this.#popupDay = $.state(null);
   }
 };
-var root$c = $.from_html(`<div><!></div>`);
+var root$9 = $.from_html(`<div><!></div>`);
 function BaseDay($$anchor, $$props) {
   $.push($$props, true);
   let el = $.prop($$props, "el", 15), allDay = $.prop($$props, "allDay", 3, false), resource = $.prop($$props, "resource", 3, void 0), dateFromPoint = $.prop($$props, "dateFromPoint", 3, () => $$props.date), classes = $.prop($$props, "classes", 3, identity), disabled = $.prop($$props, "disabled", 3, false), highlight = $.prop($$props, "highlight", 3, false), role = $.prop($$props, "role", 3, "cell"), noIeb = $.prop($$props, "noIeb", 3, false), noBeb = $.prop($$props, "noBeb", 3, false);
@@ -2028,7 +2038,7 @@ function BaseDay($$anchor, $$props) {
     });
   });
   let onpointerdown = $.derived(() => !disabled() && $.get(action) ? (jsEvent) => $.get(action).select(jsEvent, $.get(snap2)) : void 0);
-  var div = root$c();
+  var div = root$9();
   div.__pointerdown = function(...$$args) {
     $.get(onpointerdown)?.apply(this, $$args);
   };
@@ -2044,8 +2054,8 @@ function BaseDay($$anchor, $$props) {
   $.pop();
 }
 $.delegate(["pointerdown"]);
-var root_1$9 = $.from_html(`<div></div>`);
-var root$b = $.from_html(`<article><!></article>`);
+var root_1$b = $.from_html(`<div></div>`);
+var root$8 = $.from_html(`<article><!></article>`);
 function BaseEvent($$anchor, $$props) {
   $.push($$props, true);
   let el = $.prop($$props, "el", 15), classes = $.prop($$props, "classes", 3, identity), styles = $.prop($$props, "styles", 3, identity);
@@ -2082,7 +2092,7 @@ function BaseEvent($$anchor, $$props) {
   let onkeydown = $.derived(() => $.get(onclick) && keyEnter($.get(onclick)));
   let onmouseenter = $.derived(() => createHandler($.get(eventMouseEnter), $.get(display)));
   let onmouseleave = $.derived(() => createHandler($.get(eventMouseLeave), $.get(display)));
-  var article = root$b();
+  var article = root$8();
   article.__click = function(...$$args) {
     $.get(onclick)?.apply(this, $$args);
   };
@@ -2094,7 +2104,7 @@ function BaseEvent($$anchor, $$props) {
   };
   {
     const defaultBody = ($$anchor2) => {
-      var div = root_1$9();
+      var div = root_1$b();
       $.attach(div, () => contentFrom($.get(content)));
       $.template_effect(() => $.set_class(div, 1, $.clsx($.get(theme).eventBody)));
       $.append($$anchor2, div);
@@ -2134,12 +2144,12 @@ function BaseEvent($$anchor, $$props) {
   $.pop();
 }
 $.delegate(["click", "keydown", "pointerdown"]);
-var root$a = $.from_html(`<div><!></div>`);
+var root$7 = $.from_html(`<div><!></div>`);
 function ColHead($$anchor, $$props) {
   $.push($$props, true);
   let weekday = $.prop($$props, "weekday", 3, true), colSpan = $.prop($$props, "colSpan", 3, 1), ariaHidden = $.prop($$props, "ariaHidden", 3, false), disabled = $.prop($$props, "disabled", 3, false), highlight = $.prop($$props, "highlight", 3, false);
   let $$d = $.derived(() => getContext("state")), today = $.derived(() => $.get($$d).today), theme = $.derived(() => $.get($$d).options.theme);
-  var div = root$a();
+  var div = root$7();
   var node = $.child(div);
   $.snippet(node, () => $$props.children);
   $.reset(div);
@@ -2164,12 +2174,12 @@ function ColHead($$anchor, $$props) {
   $.append($$anchor, div);
   $.pop();
 }
-var root$9 = $.from_html(`<time></time>`);
+var root$6 = $.from_html(`<time></time>`);
 function DayHeader($$anchor, $$props) {
   $.push($$props, true);
   let alPrefix = $.prop($$props, "alPrefix", 3, "");
   let $$d = $.derived(() => getContext("state")), intlDayHeader = $.derived(() => $.get($$d).intlDayHeader), intlDayHeaderAL = $.derived(() => $.get($$d).intlDayHeaderAL);
-  var time = root$9();
+  var time = root$6();
   $.attach(time, () => contentFrom($.get(intlDayHeader).format($$props.date)));
   $.template_effect(
     ($0, $1) => {
@@ -2267,10 +2277,10 @@ function InteractableEvent($$anchor, $$props) {
   }
   $.pop();
 }
-var root_2$3 = $.from_html(`<time></time>`);
+var root_2$4 = $.from_html(`<time></time>`);
 var root_3 = $.from_html(`<span></span>`);
 var root_4 = $.from_html(`<a role="button" tabindex="0" aria-haspopup="dialog"></a>`);
-var root_1$8 = $.from_html(`<div><!> <!></div> <div><!></div>`, 1);
+var root_1$a = $.from_html(`<div><!> <!></div> <div><!></div>`, 1);
 function Day$3($$anchor, $$props) {
   $.push($$props, true);
   const $firstDay = () => $.store_get($.get(firstDay), "$firstDay", $$stores);
@@ -2332,12 +2342,12 @@ function Day$3($$anchor, $$props) {
       return $$props.noBeb;
     },
     children: ($$anchor2, $$slotProps) => {
-      var fragment_1 = root_1$8();
+      var fragment_1 = root_1$a();
       var div = $.first_child(fragment_1);
       var node = $.child(div);
       {
         var consequent = ($$anchor3) => {
-          var time = root_2$3();
+          var time = root_2$4();
           $.attach(time, () => contentFrom($.get(intlDayCell).format($.get(dayStart))));
           $.template_effect(($0) => $.set_attribute(time, "datetime", $0), [() => toISOString($.get(dayStart), 10)]);
           $.append($$anchor3, time);
@@ -2496,7 +2506,7 @@ function Event$3($$anchor, $$props) {
   }
   return $.pop($$exports);
 }
-var root$8 = $.from_html(`<dialog closedby="closerequest"><header><time></time>  <a role="button" tabindex="0">&times;</a></header> <div></div></dialog>`);
+var root$5 = $.from_html(`<dialog closedby="closerequest"><header><time></time>  <a role="button" tabindex="0">&times;</a></header> <div></div></dialog>`);
 function Popup($$anchor, $$props) {
   $.push($$props, true);
   let viewState = getContext("view-state");
@@ -2566,7 +2576,7 @@ function Popup($$anchor, $$props) {
     close();
     $.get(interaction).action?.noClick();
   }
-  var dialog = root$8();
+  var dialog = root$5();
   let styles;
   var header = $.child(dialog);
   var time = $.child(header);
@@ -2612,8 +2622,8 @@ function Popup($$anchor, $$props) {
   $.pop();
 }
 $.delegate(["click", "keydown"]);
-var root_1$7 = $.from_html(`<div role="columnheader"><span></span></div>`);
-var root$7 = $.from_html(`<section><header><div role="row"></div></header> <div><div></div> <div><!> <!> <!></div></div> <!></section>`);
+var root_2$3 = $.from_html(`<div role="columnheader"><span></span></div>`);
+var root_1$9 = $.from_html(`<section><header><div role="row"></div></header> <div><div></div> <div><!> <!> <!></div></div> <!></section>`);
 function View$3($$anchor, $$props) {
   $.push($$props, true);
   let mainState = getContext("state");
@@ -2629,124 +2639,134 @@ function View$3($$anchor, $$props) {
   }
   function hide() {
     $.get(hiddenChunks).size;
-    refs.forEach((ref) => ref.hide());
+    refs.forEach((ref) => ref?.hide());
   }
   $.user_effect(reposition);
   $.user_effect(hide);
-  var section = root$7();
-  let styles;
-  var header = $.child(section);
-  var div = $.child(header);
-  $.each(div, 21, () => $.get(grid2)[0], $.index, ($$anchor2, $$item, i) => {
-    let dayStart = () => $.get($$item).dayStart;
-    var div_1 = root_1$7();
-    $.set_attribute(div_1, "aria-colindex", 1 + i);
-    var span = $.child(div_1);
-    $.attach(span, () => contentFrom($.get(intlDayHeader).format(dayStart())));
-    $.reset(div_1);
-    $.template_effect(
-      ($0, $1) => {
-        $.set_class(div_1, 1, $0);
-        $.set_attribute(span, "aria-label", $1);
-      },
-      [
-        () => $.clsx([
-          $.get(theme).colHead,
-          $.get(theme).weekdays?.[dayStart().getUTCDay()]
-        ]),
-        () => $.get(intlDayHeaderAL).format(dayStart())
-      ]
-    );
-    $.append($$anchor2, div_1);
-  });
-  $.reset(div);
-  $.reset(header);
-  var div_2 = $.sibling(header, 2);
-  var div_3 = $.child(div_2);
-  $.each(div_3, 21, () => $.get(grid2), $.index, ($$anchor2, days, i) => {
-    var fragment = $.comment();
-    var node = $.first_child(fragment);
-    $.each(node, 17, () => $.get(days), $.index, ($$anchor3, day, j) => {
-      {
-        let $0 = $.derived(() => j + 1 === $.get(days).length);
-        let $1 = $.derived(() => i + 1 === $.get(grid2).length);
-        Day$3($$anchor3, {
-          get day() {
-            return $.get(day);
-          },
-          get noIeb() {
-            return $.get($0);
+  var fragment = $.comment();
+  var node = $.first_child(fragment);
+  {
+    var consequent_1 = ($$anchor2) => {
+      var section = root_1$9();
+      let styles;
+      var header = $.child(section);
+      var div = $.child(header);
+      $.each(div, 21, () => $.get(grid2)[0], $.index, ($$anchor3, $$item, i) => {
+        let dayStart = () => $.get($$item).dayStart;
+        var div_1 = root_2$3();
+        $.set_attribute(div_1, "aria-colindex", 1 + i);
+        var span = $.child(div_1);
+        $.attach(span, () => contentFrom($.get(intlDayHeader).format(dayStart())));
+        $.reset(div_1);
+        $.template_effect(
+          ($0, $1) => {
+            $.set_class(div_1, 1, $0);
+            $.set_attribute(span, "aria-label", $1);
           },
-          get noBeb() {
-            return $.get($1);
+          [
+            () => $.clsx([
+              $.get(theme).colHead,
+              $.get(theme).weekdays?.[dayStart().getUTCDay()]
+            ]),
+            () => $.get(intlDayHeaderAL).format(dayStart())
+          ]
+        );
+        $.append($$anchor3, div_1);
+      });
+      $.reset(div);
+      $.reset(header);
+      var div_2 = $.sibling(header, 2);
+      var div_3 = $.child(div_2);
+      $.each(div_3, 21, () => $.get(grid2), $.index, ($$anchor3, days, i) => {
+        var fragment_1 = $.comment();
+        var node_1 = $.first_child(fragment_1);
+        $.each(node_1, 17, () => $.get(days), $.index, ($$anchor4, day, j) => {
+          {
+            let $0 = $.derived(() => j + 1 === $.get(days).length);
+            let $1 = $.derived(() => i + 1 === $.get(grid2).length);
+            Day$3($$anchor4, {
+              get day() {
+                return $.get(day);
+              },
+              get noIeb() {
+                return $.get($0);
+              },
+              get noBeb() {
+                return $.get($1);
+              }
+            });
           }
         });
+        $.append($$anchor3, fragment_1);
+      });
+      $.reset(div_3);
+      $.bind_this(div_3, ($$value) => viewState.gridEl = $$value, () => viewState?.gridEl);
+      var div_4 = $.sibling(div_3, 2);
+      var node_2 = $.child(div_4);
+      $.each(node_2, 19, () => $.get(chunks), (chunk) => chunk.id, ($$anchor3, chunk, i) => {
+        $.bind_this(
+          Event$3($$anchor3, {
+            get chunk() {
+              return $.get(chunk);
+            }
+          }),
+          ($$value, i2) => refs[i2] = $$value,
+          (i2) => refs?.[i2],
+          () => [$.get(i)]
+        );
+      });
+      var node_3 = $.sibling(node_2, 2);
+      $.each(node_3, 17, () => $.get(bgChunks), (chunk) => chunk.id, ($$anchor3, chunk) => {
+        Event$3($$anchor3, {
+          get chunk() {
+            return $.get(chunk);
+          }
+        });
+      });
+      var node_4 = $.sibling(node_3, 2);
+      $.each(node_4, 17, () => $.get(iChunks), $.index, ($$anchor3, chunk) => {
+        Event$3($$anchor3, {
+          get chunk() {
+            return $.get(chunk);
+          }
+        });
+      });
+      $.reset(div_4);
+      $.reset(div_2);
+      var node_5 = $.sibling(div_2, 2);
+      {
+        var consequent = ($$anchor3) => {
+          Popup($$anchor3, {});
+        };
+        $.if(node_5, ($$render) => {
+          if ($.get(popupDay)) $$render(consequent);
+        });
       }
-    });
-    $.append($$anchor2, fragment);
-  });
-  $.reset(div_3);
-  $.bind_this(div_3, ($$value) => viewState.gridEl = $$value, () => viewState?.gridEl);
-  var div_4 = $.sibling(div_3, 2);
-  var node_1 = $.child(div_4);
-  $.each(node_1, 19, () => $.get(chunks), (chunk) => chunk.id, ($$anchor2, chunk, i) => {
-    $.bind_this(
-      Event$3($$anchor2, {
-        get chunk() {
-          return $.get(chunk);
-        }
-      }),
-      ($$value, i2) => refs[i2] = $$value,
-      (i2) => refs?.[i2],
-      () => [$.get(i)]
-    );
-  });
-  var node_2 = $.sibling(node_1, 2);
-  $.each(node_2, 17, () => $.get(bgChunks), (chunk) => chunk.id, ($$anchor2, chunk) => {
-    Event$3($$anchor2, {
-      get chunk() {
-        return $.get(chunk);
-      }
-    });
-  });
-  var node_3 = $.sibling(node_2, 2);
-  $.each(node_3, 17, () => $.get(iChunks), $.index, ($$anchor2, chunk) => {
-    Event$3($$anchor2, {
-      get chunk() {
-        return $.get(chunk);
-      }
-    });
-  });
-  $.reset(div_4);
-  $.reset(div_2);
-  var node_4 = $.sibling(div_2, 2);
-  {
-    var consequent = ($$anchor2) => {
-      Popup($$anchor2, {});
+      $.reset(section);
+      $.bind_this(section, ($$value) => mainState.mainEl = $$value, () => mainState?.mainEl);
+      $.attach(section, () => resizeObserver(reposition));
+      $.template_effect(() => {
+        $.set_class(section, 1, $.clsx([
+          $.get(theme).main,
+          $.get(dayMaxEvents) === true && $.get(theme).uniform
+        ]));
+        styles = $.set_style(section, "", styles, {
+          "--ec-grid-cols": $.get(grid2)[0].length,
+          "--ec-grid-rows": $.get(grid2).length
+        });
+        $.set_class(header, 1, $.get(theme).header);
+        $.set_class(div, 1, $.get(theme).grid);
+        $.set_class(div_2, 1, $.get(theme).body);
+        $.set_class(div_3, 1, $.get(theme).grid);
+        $.set_class(div_4, 1, $.get(theme).events);
+      });
+      $.append($$anchor2, section);
     };
-    $.if(node_4, ($$render) => {
-      if ($.get(popupDay)) $$render(consequent);
+    $.if(node, ($$render) => {
+      if ($.get(grid2).length && $.get(grid2)[0].length) $$render(consequent_1);
     });
   }
-  $.reset(section);
-  $.bind_this(section, ($$value) => mainState.mainEl = $$value, () => mainState?.mainEl);
-  $.attach(section, () => resizeObserver(reposition));
-  $.template_effect(() => {
-    $.set_class(section, 1, $.clsx([
-      $.get(theme).main,
-      $.get(dayMaxEvents) === true && $.get(theme).uniform
-    ]));
-    styles = $.set_style(section, "", styles, {
-      "--ec-grid-cols": $.get(grid2)[0].length,
-      "--ec-grid-rows": $.get(grid2).length
-    });
-    $.set_class(header, 1, $.get(theme).header);
-    $.set_class(div, 1, $.get(theme).grid);
-    $.set_class(div_2, 1, $.get(theme).body);
-    $.set_class(div_3, 1, $.get(theme).grid);
-    $.set_class(div_4, 1, $.get(theme).events);
-  });
-  $.append($$anchor, section);
+  $.append($$anchor, fragment);
   $.pop();
 }
 const index$5 = {
@@ -3453,9 +3473,9 @@ function Pointer($$anchor, $$props) {
   $.event("scroll", $.window, handleScroll2);
   return $.pop($$exports);
 }
-var root_1$6 = $.from_html(`<div></div>`);
+var root_1$8 = $.from_html(`<div></div>`);
 var root_2$2 = $.from_html(`<div></div>`);
-var root$6 = $.from_html(`<!> <!> <!>`, 1);
+var root$4 = $.from_html(`<!> <!> <!>`, 1);
 function Resizer($$anchor, $$props) {
   $.push($$props, true);
   let forceDate = $.prop($$props, "forceDate", 3, void 0), forceMargin = $.prop($$props, "forceMargin", 3, void 0);
@@ -3467,11 +3487,11 @@ function Resizer($$anchor, $$props) {
   function createResizeHandler(start) {
     return (jsEvent) => $.get(action).resize($.get(event), jsEvent, start, $$props.axis, forceDate(), forceMargin(), $$props.chunk.zeroDuration, $.get(snap2));
   }
-  var fragment = root$6();
+  var fragment = root$4();
   var node = $.first_child(fragment);
   {
     var consequent = ($$anchor2) => {
-      var div = root_1$6();
+      var div = root_1$8();
       var event_handler = $.derived(() => createResizeHandler(true));
       div.__pointerdown = function(...$$args) {
         $.get(event_handler)?.apply(this, $$args);
@@ -3504,14 +3524,14 @@ function Resizer($$anchor, $$props) {
   $.pop();
 }
 $.delegate(["pointerdown"]);
-var root$5 = $.from_html(`<!> <!>`, 1);
+var root$3 = $.from_html(`<!> <!>`, 1);
 function Auxiliary($$anchor, $$props) {
   $.push($$props, true);
   let mainState = getContext("state");
   new AuxState(mainState);
   let interaction = $.derived(() => mainState.interaction), pointer = $.derived(() => mainState.options.pointer);
   $.get(interaction).resizer = Resizer;
-  var fragment = root$5();
+  var fragment = root$3();
   var node = $.first_child(fragment);
   $.bind_this(Action(node, {}), ($$value) => $.get(interaction).action = $$value, () => $.get(interaction)?.action);
   var node_1 = $.sibling(node, 2);
@@ -3595,7 +3615,7 @@ let ViewState$3 = class ViewState2 {
     this.#intlListDaySide = $.derived(intl(mainState, "listDaySideFormat"));
   }
 };
-var root_1$5 = $.from_html(`<div></div> <!>`, 1);
+var root_1$7 = $.from_html(`<div></div> <!>`, 1);
 function Event$2($$anchor, $$props) {
   $.push($$props, true);
   let $$d = $.derived(() => getContext("state")), interaction = $.derived(() => $.get($$d).interaction), theme = $.derived(() => $.get($$d).options.theme);
@@ -3606,7 +3626,7 @@ function Event$2($$anchor, $$props) {
   });
   {
     const body = ($$anchor2, defaultBody = $.noop, bgColor = $.noop, txtColor = $.noop) => {
-      var fragment_1 = root_1$5();
+      var fragment_1 = root_1$7();
       var div = $.first_child(fragment_1);
       let styles_1;
       var node = $.sibling(div, 2);
@@ -3706,8 +3726,8 @@ function Day$2($$anchor, $$props) {
   $.append($$anchor, fragment);
   $.pop();
 }
-var root_1$4 = $.from_html(`<div></div>`);
-var root$4 = $.from_html(`<section><!></section>`);
+var root_1$6 = $.from_html(`<div></div>`);
+var root$2 = $.from_html(`<section><!></section>`);
 function View$2($$anchor, $$props) {
   $.push($$props, true);
   let mainState = getContext("state");
@@ -3734,11 +3754,11 @@ function View$2($$anchor, $$props) {
       $.get(noEventsClick)({ jsEvent, view: toViewWithLocalDates($.get(view2)) });
     }
   }
-  var section = root$4();
+  var section = root$2();
   var node = $.child(section);
   {
     var consequent = ($$anchor2) => {
-      var div = root_1$4();
+      var div = root_1$6();
       div.__click = onclick;
       $.attach(div, () => contentFrom($.get(content)));
       $.template_effect(() => $.set_class(div, 1, $.get(theme).noEvents));
@@ -4219,7 +4239,7 @@ function viewResources(mainState) {
       if (filterResourcesWithEvents) {
         result = resources.filter(
           (resource) => filteredEvents2.some(
-            (event) => eventIntersects(event, activeRange2.start, activeRange2.end, resource)
+            (event) => !bgEvent(event.display) && eventIntersects(event, activeRange2.start, activeRange2.end, resource)
           )
         );
       }
@@ -4290,7 +4310,7 @@ let ViewState$1 = class ViewState4 extends RRState(TRState(TRRState())) {
     this.#grid = $.derived(grid$1(mainState, this));
   }
 };
-var root$3 = $.from_html(`<span></span>`);
+var root$1 = $.from_html(`<span></span>`);
 function Label($$anchor, $$props) {
   $.push($$props, true);
   let date = $.prop($$props, "date", 3, void 0), setLabel = $.prop($$props, "setLabel", 3, void 0);
@@ -4327,7 +4347,7 @@ function Label($$anchor, $$props) {
       });
     }
   });
-  var span = root$3();
+  var span = root$1();
   $.bind_this(span, ($$value) => $.set(el, $$value), () => $.get(el));
   $.attach(span, () => contentFrom($.get(content)));
   $.template_effect(() => $.set_attribute(span, "aria-label", $.get(ariaLabel)));
@@ -4451,7 +4471,7 @@ function AllDayEvent($$anchor, $$props) {
   });
   return $.pop($$exports);
 }
-var root_1$3 = $.from_html(`<div></div>`);
+var root_1$5 = $.from_html(`<div></div>`);
 function NowIndicator$1($$anchor, $$props) {
   $.push($$props, true);
   let span = $.prop($$props, "span", 3, 1);
@@ -4484,7 +4504,7 @@ function NowIndicator$1($$anchor, $$props) {
   var node = $.first_child(fragment);
   {
     var consequent = ($$anchor2) => {
-      var div = root_1$3();
+      var div = root_1$5();
       let styles;
       $.attach(div, () => intersectionObserver(onIntersect, $.get(observerOptions)));
       $.template_effect(() => {
@@ -4503,9 +4523,9 @@ function NowIndicator$1($$anchor, $$props) {
   $.append($$anchor, fragment);
   $.pop();
 }
-var root_5 = $.from_html(`<div><aside></aside> <div role="row"></div> <div><!> <!> <!></div></div>`);
-var root_11 = $.from_html(`<div><time></time></div>`);
-var root$2 = $.from_html(`<section><header><aside></aside> <div role="row"><!></div> <!></header> <div role="rowgroup"><aside aria-hidden="true"></aside> <div role="row"></div> <div><!> <!> <!></div></div> <!></section>`);
+var root_6 = $.from_html(`<div><aside></aside> <div role="row"></div> <div><!> <!> <!></div></div>`);
+var root_12 = $.from_html(`<div><time></time></div>`);
+var root_1$4 = $.from_html(`<section><header><aside></aside> <div role="row"><!></div> <!></header> <div role="rowgroup"><aside aria-hidden="true"></aside> <div role="row"></div> <div><!> <!> <!></div></div> <!></section>`);
 function View$1($$anchor, $$props) {
   $.push($$props, true);
   let viewState = $.prop($$props, "viewState", 7);
@@ -4519,9 +4539,10 @@ function View$1($$anchor, $$props) {
   let headerHeight = $.state(0);
   let allDayText = $.derived(() => createAllDayContent($.get(allDayContent)));
   $.user_effect(() => {
-    $.get(viewDates2);
     $.get(scrollTime);
-    tick().then(scrollToTime);
+    if ($.get(viewDates2).length) {
+      tick().then(scrollToTime);
+    }
   });
   function scrollToTime() {
     $.get(mainEl).scrollTop = ((toSeconds($.get(scrollTime)) - toSeconds($.get(slotTimeLimits2).min)) / toSeconds($.get(slotDuration)) - 0.5) * $.get(slotHeight);
@@ -4531,249 +4552,259 @@ function View$1($$anchor, $$props) {
     runReposition(refs, $.get(allDayChunks));
   }
   $.user_effect(reposition);
-  var section = root$2();
-  let styles;
-  var header_1 = $.child(section);
-  var aside = $.child(header_1);
-  var div = $.sibling(aside, 2);
-  var node = $.child(div);
+  var fragment = $.comment();
+  var node = $.first_child(fragment);
   {
-    var consequent = ($$anchor2) => {
-      var fragment = $.comment();
-      var node_1 = $.first_child(fragment);
-      $.snippet(node_1, () => $$props.header);
-      $.append($$anchor2, fragment);
-    };
-    var alternate = ($$anchor2) => {
-      var fragment_1 = $.comment();
-      var node_2 = $.first_child(fragment_1);
-      $.each(node_2, 17, () => $.get(grid2)[0], $.index, ($$anchor3, $$item, i) => {
-        let date = () => $.get($$item).dayStart;
-        let disabled = () => $.get($$item).disabled;
-        let highlight = () => $.get($$item).highlight;
-        ColHead($$anchor3, {
-          get date() {
-            return date();
-          },
-          colIndex: 1 + i,
-          get disabled() {
-            return disabled();
-          },
-          get highlight() {
-            return highlight();
-          },
-          children: ($$anchor4, $$slotProps) => {
-            DayHeader($$anchor4, {
+    var consequent_4 = ($$anchor2) => {
+      var section = root_1$4();
+      let styles;
+      var header_1 = $.child(section);
+      var aside = $.child(header_1);
+      var div = $.sibling(aside, 2);
+      var node_1 = $.child(div);
+      {
+        var consequent = ($$anchor3) => {
+          var fragment_1 = $.comment();
+          var node_2 = $.first_child(fragment_1);
+          $.snippet(node_2, () => $$props.header);
+          $.append($$anchor3, fragment_1);
+        };
+        var alternate = ($$anchor3) => {
+          var fragment_2 = $.comment();
+          var node_3 = $.first_child(fragment_2);
+          $.each(node_3, 17, () => $.get(grid2)[0], $.index, ($$anchor4, $$item, i) => {
+            let date = () => $.get($$item).dayStart;
+            let disabled = () => $.get($$item).disabled;
+            let highlight = () => $.get($$item).highlight;
+            ColHead($$anchor4, {
               get date() {
                 return date();
+              },
+              colIndex: 1 + i,
+              get disabled() {
+                return disabled();
+              },
+              get highlight() {
+                return highlight();
+              },
+              children: ($$anchor5, $$slotProps) => {
+                DayHeader($$anchor5, {
+                  get date() {
+                    return date();
+                  }
+                });
+              },
+              $$slots: { default: true }
+            });
+          });
+          $.append($$anchor3, fragment_2);
+        };
+        $.if(node_1, ($$render) => {
+          if ($$props.header) $$render(consequent);
+          else $$render(alternate, false);
+        });
+      }
+      $.reset(div);
+      var node_4 = $.sibling(div, 2);
+      {
+        var consequent_1 = ($$anchor3) => {
+          var div_1 = root_6();
+          var aside_1 = $.child(div_1);
+          $.attach(aside_1, () => contentFrom($.get(allDayText)));
+          var div_2 = $.sibling(aside_1, 2);
+          $.each(div_2, 21, () => $.get(grid2), $.index, ($$anchor4, days, i) => {
+            var fragment_5 = $.comment();
+            var node_5 = $.first_child(fragment_5);
+            $.each(node_5, 17, () => $.get(days), $.index, ($$anchor5, day, j) => {
+              {
+                let $0 = $.derived(() => i + 1 === $.get(grid2).length && j + 1 === $.get(days).length);
+                Day$1($$anchor5, {
+                  get day() {
+                    return $.get(day);
+                  },
+                  allDay: true,
+                  get noIeb() {
+                    return $.get($0);
+                  }
+                });
               }
             });
-          },
-          $$slots: { default: true }
+            $.append($$anchor4, fragment_5);
+          });
+          $.reset(div_2);
+          var div_3 = $.sibling(div_2, 2);
+          var node_6 = $.child(div_3);
+          $.each(node_6, 19, () => $.get(allDayChunks), (chunk) => chunk.id, ($$anchor4, chunk, i) => {
+            $.bind_this(
+              AllDayEvent($$anchor4, {
+                get chunk() {
+                  return $.get(chunk);
+                }
+              }),
+              ($$value, i2) => refs[i2] = $$value,
+              (i2) => refs?.[i2],
+              () => [$.get(i)]
+            );
+          });
+          var node_7 = $.sibling(node_6, 2);
+          $.each(node_7, 17, () => $.get(allDayBgChunks), (chunk) => chunk.id, ($$anchor4, chunk) => {
+            AllDayEvent($$anchor4, {
+              get chunk() {
+                return $.get(chunk);
+              }
+            });
+          });
+          var node_8 = $.sibling(node_7, 2);
+          $.each(node_8, 17, () => $.get(allDayIChunks), $.index, ($$anchor4, chunk) => {
+            AllDayEvent($$anchor4, {
+              get chunk() {
+                return $.get(chunk);
+              }
+            });
+          });
+          $.reset(div_3);
+          $.reset(div_1);
+          $.template_effect(() => {
+            $.set_class(div_1, 1, $.get(theme).allDay);
+            $.set_class(aside_1, 1, $.get(theme).sidebar);
+            $.set_class(div_2, 1, $.get(theme).grid);
+            $.set_class(div_3, 1, $.get(theme).events);
+          });
+          $.append($$anchor3, div_1);
+        };
+        $.if(node_4, ($$render) => {
+          if ($.get(allDaySlot)) $$render(consequent_1);
         });
+      }
+      $.reset(header_1);
+      var div_4 = $.sibling(header_1, 2);
+      var aside_2 = $.child(div_4);
+      $.each(aside_2, 21, () => $.get(slots2), $.index, ($$anchor3, slot, i) => {
+        var div_5 = root_12();
+        let styles_1;
+        var time = $.child(div_5);
+        $.attach(time, () => contentFrom($.get(slot)[1]));
+        $.reset(div_5);
+        $.template_effect(() => {
+          $.set_class(div_5, 1, $.clsx([$.get(theme).slot, !i && $.get(theme).hidden]));
+          styles_1 = $.set_style(div_5, "", styles_1, { "--ec-slot-label-periodicity": $.get(slot)[2] });
+          $.set_attribute(time, "datetime", $.get(slot)[0]);
+        });
+        $.append($$anchor3, div_5);
       });
-      $.append($$anchor2, fragment_1);
-    };
-    $.if(node, ($$render) => {
-      if ($$props.header) $$render(consequent);
-      else $$render(alternate, false);
-    });
-  }
-  $.reset(div);
-  var node_3 = $.sibling(div, 2);
-  {
-    var consequent_1 = ($$anchor2) => {
-      var div_1 = root_5();
-      var aside_1 = $.child(div_1);
-      $.attach(aside_1, () => contentFrom($.get(allDayText)));
-      var div_2 = $.sibling(aside_1, 2);
-      $.each(div_2, 21, () => $.get(grid2), $.index, ($$anchor3, days, i) => {
-        var fragment_4 = $.comment();
-        var node_4 = $.first_child(fragment_4);
-        $.each(node_4, 17, () => $.get(days), $.index, ($$anchor4, day, j) => {
+      $.reset(aside_2);
+      var div_6 = $.sibling(aside_2, 2);
+      $.each(div_6, 21, () => $.get(grid2), $.index, ($$anchor3, days, i) => {
+        var fragment_10 = $.comment();
+        var node_9 = $.first_child(fragment_10);
+        $.each(node_9, 17, () => $.get(days), $.index, ($$anchor4, day, j) => {
           {
             let $0 = $.derived(() => i + 1 === $.get(grid2).length && j + 1 === $.get(days).length);
             Day$1($$anchor4, {
               get day() {
                 return $.get(day);
               },
-              allDay: true,
               get noIeb() {
                 return $.get($0);
-              }
+              },
+              noBeb: true
             });
           }
         });
-        $.append($$anchor3, fragment_4);
-      });
-      $.reset(div_2);
-      var div_3 = $.sibling(div_2, 2);
-      var node_5 = $.child(div_3);
-      $.each(node_5, 19, () => $.get(allDayChunks), (chunk) => chunk.id, ($$anchor3, chunk, i) => {
-        $.bind_this(
-          AllDayEvent($$anchor3, {
-            get chunk() {
-              return $.get(chunk);
-            }
-          }),
-          ($$value, i2) => refs[i2] = $$value,
-          (i2) => refs?.[i2],
-          () => [$.get(i)]
-        );
+        $.append($$anchor3, fragment_10);
       });
-      var node_6 = $.sibling(node_5, 2);
-      $.each(node_6, 17, () => $.get(allDayBgChunks), (chunk) => chunk.id, ($$anchor3, chunk) => {
-        AllDayEvent($$anchor3, {
+      $.reset(div_6);
+      var div_7 = $.sibling(div_6, 2);
+      var node_10 = $.child(div_7);
+      $.each(node_10, 17, () => $.get(chunks), (chunk) => chunk.id, ($$anchor3, chunk) => {
+        Event$1($$anchor3, {
           get chunk() {
             return $.get(chunk);
           }
         });
       });
-      var node_7 = $.sibling(node_6, 2);
-      $.each(node_7, 17, () => $.get(allDayIChunks), $.index, ($$anchor3, chunk) => {
-        AllDayEvent($$anchor3, {
+      var node_11 = $.sibling(node_10, 2);
+      $.each(node_11, 17, () => $.get(bgChunks), (chunk) => chunk.id, ($$anchor3, chunk) => {
+        Event$1($$anchor3, {
           get chunk() {
             return $.get(chunk);
           }
         });
       });
-      $.reset(div_3);
-      $.reset(div_1);
-      $.template_effect(() => {
-        $.set_class(div_1, 1, $.get(theme).allDay);
-        $.set_class(aside_1, 1, $.get(theme).sidebar);
-        $.set_class(div_2, 1, $.get(theme).grid);
-        $.set_class(div_3, 1, $.get(theme).events);
-      });
-      $.append($$anchor2, div_1);
-    };
-    $.if(node_3, ($$render) => {
-      if ($.get(allDaySlot)) $$render(consequent_1);
-    });
-  }
-  $.reset(header_1);
-  var div_4 = $.sibling(header_1, 2);
-  var aside_2 = $.child(div_4);
-  $.each(aside_2, 21, () => $.get(slots2), $.index, ($$anchor2, slot, i) => {
-    var div_5 = root_11();
-    let styles_1;
-    var time = $.child(div_5);
-    $.attach(time, () => contentFrom($.get(slot)[1]));
-    $.reset(div_5);
-    $.template_effect(() => {
-      $.set_class(div_5, 1, $.clsx([$.get(theme).slot, !i && $.get(theme).hidden]));
-      styles_1 = $.set_style(div_5, "", styles_1, { "--ec-slot-label-periodicity": $.get(slot)[2] });
-      $.set_attribute(time, "datetime", $.get(slot)[0]);
-    });
-    $.append($$anchor2, div_5);
-  });
-  $.reset(aside_2);
-  var div_6 = $.sibling(aside_2, 2);
-  $.each(div_6, 21, () => $.get(grid2), $.index, ($$anchor2, days, i) => {
-    var fragment_9 = $.comment();
-    var node_8 = $.first_child(fragment_9);
-    $.each(node_8, 17, () => $.get(days), $.index, ($$anchor3, day, j) => {
-      {
-        let $0 = $.derived(() => i + 1 === $.get(grid2).length && j + 1 === $.get(days).length);
-        Day$1($$anchor3, {
-          get day() {
-            return $.get(day);
-          },
-          get noIeb() {
-            return $.get($0);
-          },
-          noBeb: true
+      var node_12 = $.sibling(node_11, 2);
+      $.each(node_12, 17, () => $.get(iChunks), $.index, ($$anchor3, chunk) => {
+        Event$1($$anchor3, {
+          get chunk() {
+            return $.get(chunk);
+          }
         });
-      }
-    });
-    $.append($$anchor2, fragment_9);
-  });
-  $.reset(div_6);
-  var div_7 = $.sibling(div_6, 2);
-  var node_9 = $.child(div_7);
-  $.each(node_9, 17, () => $.get(chunks), (chunk) => chunk.id, ($$anchor2, chunk) => {
-    Event$1($$anchor2, {
-      get chunk() {
-        return $.get(chunk);
-      }
-    });
-  });
-  var node_10 = $.sibling(node_9, 2);
-  $.each(node_10, 17, () => $.get(bgChunks), (chunk) => chunk.id, ($$anchor2, chunk) => {
-    Event$1($$anchor2, {
-      get chunk() {
-        return $.get(chunk);
-      }
-    });
-  });
-  var node_11 = $.sibling(node_10, 2);
-  $.each(node_11, 17, () => $.get(iChunks), $.index, ($$anchor2, chunk) => {
-    Event$1($$anchor2, {
-      get chunk() {
-        return $.get(chunk);
-      }
-    });
-  });
-  $.reset(div_7);
-  $.reset(div_4);
-  var node_12 = $.sibling(div_4, 2);
-  {
-    var consequent_3 = ($$anchor2) => {
-      var fragment_14 = $.comment();
-      var node_13 = $.first_child(fragment_14);
+      });
+      $.reset(div_7);
+      $.reset(div_4);
+      var node_13 = $.sibling(div_4, 2);
       {
-        var consequent_2 = ($$anchor3) => {
+        var consequent_3 = ($$anchor3) => {
           var fragment_15 = $.comment();
           var node_14 = $.first_child(fragment_15);
-          $.snippet(node_14, () => $$props.nowIndicator);
+          {
+            var consequent_2 = ($$anchor4) => {
+              var fragment_16 = $.comment();
+              var node_15 = $.first_child(fragment_16);
+              $.snippet(node_15, () => $$props.nowIndicator);
+              $.append($$anchor4, fragment_16);
+            };
+            var alternate_1 = ($$anchor4) => {
+              NowIndicator$1($$anchor4, {
+                get days() {
+                  return $.get(grid2)[0];
+                }
+              });
+            };
+            $.if(node_14, ($$render) => {
+              if ($$props.nowIndicator) $$render(consequent_2);
+              else $$render(alternate_1, false);
+            });
+          }
           $.append($$anchor3, fragment_15);
         };
-        var alternate_1 = ($$anchor3) => {
-          NowIndicator$1($$anchor3, {
-            get days() {
-              return $.get(grid2)[0];
-            }
-          });
-        };
         $.if(node_13, ($$render) => {
-          if ($$props.nowIndicator) $$render(consequent_2);
-          else $$render(alternate_1, false);
+          if ($.get(showNowIndicator)) $$render(consequent_3);
         });
       }
-      $.append($$anchor2, fragment_14);
+      $.reset(section);
+      $.bind_this(section, ($$value) => mainState.mainEl = $$value, () => mainState?.mainEl);
+      $.attach(section, () => resizeObserver(reposition));
+      $.template_effect(() => {
+        $.set_class(section, 1, $.get(theme).main);
+        styles = $.set_style(section, "", styles, {
+          "--ec-grid-cols": $.get(grid2).length * $.get(grid2)[0].length,
+          "--ec-col-group-span": $.get(grid2)[0].length,
+          "--ec-col-width": $.get(columnWidth) ?? "minmax(0, 1fr)",
+          "--ec-slot-label-periodicity": $.get(slotLabelPeriodicity2),
+          "--ec-slot-height": `${$.get(slotHeight) ?? ""}px`,
+          "--ec-header-height": `${$.get(headerHeight) ?? ""}px`,
+          "--ec-sidebar-width": `${$.get(sidebarWidth) ?? ""}px`
+        });
+        $.set_class(header_1, 1, $.get(theme).header);
+        $.set_class(aside, 1, $.get(theme).sidebar);
+        $.set_class(div, 1, $.get(theme).grid);
+        $.set_class(div_4, 1, $.get(theme).body);
+        $.set_class(aside_2, 1, $.get(theme).sidebar);
+        $.set_class(div_6, 1, $.get(theme).grid);
+        $.set_class(div_7, 1, $.get(theme).events);
+      });
+      $.bind_element_size(aside, "offsetWidth", ($$value) => viewState().sidebarWidth = $$value);
+      $.bind_element_size(header_1, "offsetHeight", ($$value) => $.set(headerHeight, $$value));
+      $.append($$anchor2, section);
     };
-    $.if(node_12, ($$render) => {
-      if ($.get(showNowIndicator)) $$render(consequent_3);
+    $.if(node, ($$render) => {
+      if ($.get(grid2).length && $.get(grid2)[0].length) $$render(consequent_4);
     });
   }
-  $.reset(section);
-  $.bind_this(section, ($$value) => mainState.mainEl = $$value, () => mainState?.mainEl);
-  $.attach(section, () => resizeObserver(reposition));
-  $.template_effect(() => {
-    $.set_class(section, 1, $.get(theme).main);
-    styles = $.set_style(section, "", styles, {
-      "--ec-grid-cols": $.get(grid2).length * $.get(grid2)[0].length,
-      "--ec-col-group-span": $.get(grid2)[0].length,
-      "--ec-col-width": $.get(columnWidth) ?? "minmax(0, 1fr)",
-      "--ec-slot-label-periodicity": $.get(slotLabelPeriodicity2),
-      "--ec-slot-height": `${$.get(slotHeight) ?? ""}px`,
-      "--ec-header-height": `${$.get(headerHeight) ?? ""}px`,
-      "--ec-sidebar-width": `${$.get(sidebarWidth) ?? ""}px`
-    });
-    $.set_class(header_1, 1, $.get(theme).header);
-    $.set_class(aside, 1, $.get(theme).sidebar);
-    $.set_class(div, 1, $.get(theme).grid);
-    $.set_class(div_4, 1, $.get(theme).body);
-    $.set_class(aside_2, 1, $.get(theme).sidebar);
-    $.set_class(div_6, 1, $.get(theme).grid);
-    $.set_class(div_7, 1, $.get(theme).events);
-  });
-  $.bind_element_size(aside, "offsetWidth", ($$value) => viewState().sidebarWidth = $$value);
-  $.bind_element_size(header_1, "offsetHeight", ($$value) => $.set(headerHeight, $$value));
-  $.append($$anchor, section);
+  $.append($$anchor, fragment);
   $.pop();
 }
-var root_1$2 = $.from_html(`<!> <!>`, 1);
+var root_1$3 = $.from_html(`<!> <!>`, 1);
 function View_1($$anchor, $$props) {
   $.push($$props, true);
   let mainState = getContext("state");
@@ -4801,7 +4832,7 @@ function View_1($$anchor, $$props) {
   }
   {
     const header = ($$anchor2) => {
-      var fragment_1 = root_1$2();
+      var fragment_1 = root_1$3();
       var node = $.first_child(fragment_1);
       $.each(node, 17, () => $.get(grid2), $.index, ($$anchor3, days, i) => {
         const computed_const = $.derived(() => {
@@ -5112,7 +5143,7 @@ function prepareChunks(chunks) {
   }
 }
 function repositionEvent(chunk, height2, monthView2) {
-  let top = 0;
+  let top = 1;
   let bottom = top + height2;
   let dayChunks = chunk.day;
   dayChunks.sort((a, b) => (a.top ?? Number.POSITIVE_INFINITY) - (b.top ?? Number.POSITIVE_INFINITY));
@@ -5382,7 +5413,7 @@ function Event($$anchor, $$props) {
   let $$d = $.derived(() => getContext("state")), slotDuration = $.derived(() => $.get($$d).options.slotDuration), slotWidth = $.derived(() => $.get($$d).options.slotWidth);
   let $$d_1 = $.derived(() => getContext("view-state")), monthView2 = $.derived(() => $.get($$d_1).monthView);
   let el = $.state(void 0);
-  let margin = $.state(0);
+  let margin = $.state(1);
   let event = $.derived(() => $$props.chunk.event);
   let styles = $.derived(() => (style) => {
     style["grid-column"] = `${$$props.chunk.gridColumn} / span ${$$props.chunk.dates.length}`;
@@ -5429,9 +5460,9 @@ function Event($$anchor, $$props) {
   }
   return $.pop($$exports);
 }
-var root_1$1 = $.from_html(`<span></span>`);
+var root_1$2 = $.from_html(`<span></span>`);
 var root_2 = $.from_html(`<button><!></button>`);
-var root$1 = $.from_html(`<!> <span><!></span>`, 1);
+var root = $.from_html(`<!> <span><!></span>`, 1);
 function Expander($$anchor, $$props) {
   $.push($$props, true);
   let $$d = $.derived(() => getContext("state")), options = $.derived(() => $.get($$d).options);
@@ -5457,10 +5488,10 @@ function Expander($$anchor, $$props) {
       }
     }
   }
-  var fragment = root$1();
+  var fragment = root();
   var node = $.first_child(fragment);
   $.each(node, 17, () => Array($.get(payload).level), $.index, ($$anchor2, level) => {
-    var span = root_1$1();
+    var span = root_1$2();
     $.template_effect(() => $.set_class(span, 1, $.get(theme).expander));
     $.append($$anchor2, span);
   });
@@ -5499,7 +5530,7 @@ function Expander($$anchor, $$props) {
   $.pop();
 }
 $.delegate(["click"]);
-var root_1 = $.from_html(`<div></div>`);
+var root_1$1 = $.from_html(`<div></div>`);
 function NowIndicator($$anchor, $$props) {
   $.push($$props, true);
   let $$d = $.derived(() => getContext("state")), mainEl = $.derived(() => $.get($$d).mainEl), now = $.derived(() => $.get($$d).now), today = $.derived(() => $.get($$d).today), slotDuration = $.derived(() => $.get($$d).options.slotDuration), slotWidth = $.derived(() => $.get($$d).options.slotWidth), theme = $.derived(() => $.get($$d).options.theme);
@@ -5531,7 +5562,7 @@ function NowIndicator($$anchor, $$props) {
   var node = $.first_child(fragment);
   {
     var consequent = ($$anchor2) => {
-      var div = root_1();
+      var div = root_1$1();
       let styles;
       $.attach(div, () => intersectionObserver(onIntersect, $.get(observerOptions)));
       $.template_effect(() => {
@@ -5551,9 +5582,9 @@ function NowIndicator($$anchor, $$props) {
   $.append($$anchor, fragment);
   $.pop();
 }
-var root_6 = $.from_html(`<div><time></time></div>`);
-var root_7 = $.from_html(`<div role="rowheader"><!> <!></div>`);
-var root = $.from_html(`<section><header><aside></aside> <div role="row"><!> <!></div></header> <div role="rowgroup"><aside></aside> <div role="row"></div> <div><!> <!> <!></div></div> <!></section>`);
+var root_7 = $.from_html(`<div><time></time></div>`);
+var root_8 = $.from_html(`<div role="rowheader"><!> <!></div>`);
+var root_1 = $.from_html(`<section><header><aside></aside> <div role="row"><!> <!></div></header> <div role="rowgroup"><aside></aside> <div role="row"></div> <div><!> <!> <!></div></div> <!></section>`);
 function View($$anchor, $$props) {
   $.push($$props, true);
   let mainState = getContext("state");
@@ -5563,9 +5594,10 @@ function View($$anchor, $$props) {
   let chunks = $.derived(() => viewState.chunks), bgChunks = $.derived(() => viewState.bgChunks), iChunks = $.derived(() => viewState.iChunks), daySlots2 = $.derived(() => viewState.daySlots), dayTimeLimits2 = $.derived(() => viewState.dayTimeLimits), grid2 = $.derived(() => viewState.grid), monthView2 = $.derived(() => viewState.monthView), nestedResources2 = $.derived(() => viewState.nestedResources), sidebarWidth = $.derived(() => viewState.sidebarWidth), slotLabelPeriodicity2 = $.derived(() => viewState.slotLabelPeriodicity), viewResources2 = $.derived(() => viewState.viewResources);
   let headerHeight = $.state(0);
   $.user_effect(() => {
-    $.get(viewDates2);
     $.get(scrollTime);
-    tick().then(scrollToTime);
+    if ($.get(viewDates2).length) {
+      tick().then(scrollToTime);
+    }
   });
   function scrollToTime() {
     let scrollLeft = 0;
@@ -5598,43 +5630,17 @@ function View($$anchor, $$props) {
     runReposition(refs, $.get(chunks));
   }
   $.user_effect(reposition);
-  var section = root();
-  let styles;
-  var header = $.child(section);
-  var aside = $.child(header);
-  var div = $.sibling(aside, 2);
-  var node = $.child(div);
-  $.each(node, 17, () => $.get(grid2)[0], $.index, ($$anchor2, $$item, i) => {
-    let date = () => $.get($$item).dayStart;
-    let disabled = () => $.get($$item).disabled;
-    let highlight = () => $.get($$item).highlight;
-    ColHead($$anchor2, {
-      get date() {
-        return date();
-      },
-      colIndex: 1 + i,
-      get disabled() {
-        return disabled();
-      },
-      get highlight() {
-        return highlight();
-      },
-      children: ($$anchor3, $$slotProps) => {
-        DayHeader($$anchor3, {
-          get date() {
-            return date();
-          }
-        });
-      },
-      $$slots: { default: true }
-    });
-  });
-  var node_1 = $.sibling(node, 2);
+  var fragment = $.comment();
+  var node = $.first_child(fragment);
   {
-    var consequent = ($$anchor2) => {
-      var fragment_2 = $.comment();
-      var node_2 = $.first_child(fragment_2);
-      $.each(node_2, 17, () => $.get(grid2)[0], $.index, ($$anchor3, $$item) => {
+    var consequent_3 = ($$anchor2) => {
+      var section = root_1();
+      let styles;
+      var header = $.child(section);
+      var aside = $.child(header);
+      var div = $.sibling(aside, 2);
+      var node_1 = $.child(div);
+      $.each(node_1, 17, () => $.get(grid2)[0], $.index, ($$anchor3, $$item, i) => {
         let date = () => $.get($$item).dayStart;
         let disabled = () => $.get($$item).disabled;
         let highlight = () => $.get($$item).highlight;
@@ -5642,164 +5648,200 @@ function View($$anchor, $$props) {
           get date() {
             return date();
           },
-          get className() {
-            return $.get(theme).slots;
-          },
+          colIndex: 1 + i,
           get disabled() {
             return disabled();
           },
           get highlight() {
             return highlight();
           },
-          ariaHidden: true,
           children: ($$anchor4, $$slotProps) => {
-            var fragment_4 = $.comment();
-            var node_3 = $.first_child(fragment_4);
-            $.each(node_3, 17, () => $.get(daySlots2)[date().getTime()], $.index, ($$anchor5, slot) => {
-              var div_1 = root_6();
-              let styles_1;
-              var time = $.child(div_1);
-              $.attach(time, () => contentFrom($.get(slot)[1]));
-              $.reset(div_1);
-              $.template_effect(() => {
-                $.set_class(div_1, 1, $.get(theme).slot);
-                styles_1 = $.set_style(div_1, "", styles_1, { "--ec-slot-label-periodicity": $.get(slot)[2] });
-                $.set_attribute(time, "datetime", $.get(slot)[0]);
-              });
-              $.append($$anchor5, div_1);
+            DayHeader($$anchor4, {
+              get date() {
+                return date();
+              }
             });
-            $.append($$anchor4, fragment_4);
           },
           $$slots: { default: true }
         });
       });
-      $.append($$anchor2, fragment_2);
-    };
-    $.if(node_1, ($$render) => {
-      if (!$.get(monthView2)) $$render(consequent);
-    });
-  }
-  $.reset(div);
-  $.reset(header);
-  var div_2 = $.sibling(header, 2);
-  var aside_1 = $.child(div_2);
-  $.each(aside_1, 21, () => $.get(viewResources2), $.index, ($$anchor2, resource) => {
-    var div_3 = root_7();
-    var node_4 = $.child(div_3);
-    {
-      var consequent_1 = ($$anchor3) => {
-        Expander($$anchor3, {
+      var node_2 = $.sibling(node_1, 2);
+      {
+        var consequent = ($$anchor3) => {
+          var fragment_3 = $.comment();
+          var node_3 = $.first_child(fragment_3);
+          $.each(node_3, 17, () => $.get(grid2)[0], $.index, ($$anchor4, $$item) => {
+            let date = () => $.get($$item).dayStart;
+            let disabled = () => $.get($$item).disabled;
+            let highlight = () => $.get($$item).highlight;
+            ColHead($$anchor4, {
+              get date() {
+                return date();
+              },
+              get className() {
+                return $.get(theme).slots;
+              },
+              get disabled() {
+                return disabled();
+              },
+              get highlight() {
+                return highlight();
+              },
+              ariaHidden: true,
+              children: ($$anchor5, $$slotProps) => {
+                var fragment_5 = $.comment();
+                var node_4 = $.first_child(fragment_5);
+                $.each(node_4, 17, () => $.get(daySlots2)[date().getTime()], $.index, ($$anchor6, slot) => {
+                  var div_1 = root_7();
+                  let styles_1;
+                  var time = $.child(div_1);
+                  $.attach(time, () => contentFrom($.get(slot)[1]));
+                  $.reset(div_1);
+                  $.template_effect(() => {
+                    $.set_class(div_1, 1, $.get(theme).slot);
+                    styles_1 = $.set_style(div_1, "", styles_1, { "--ec-slot-label-periodicity": $.get(slot)[2] });
+                    $.set_attribute(time, "datetime", $.get(slot)[0]);
+                  });
+                  $.append($$anchor6, div_1);
+                });
+                $.append($$anchor5, fragment_5);
+              },
+              $$slots: { default: true }
+            });
+          });
+          $.append($$anchor3, fragment_3);
+        };
+        $.if(node_2, ($$render) => {
+          if (!$.get(monthView2)) $$render(consequent);
+        });
+      }
+      $.reset(div);
+      $.reset(header);
+      var div_2 = $.sibling(header, 2);
+      var aside_1 = $.child(div_2);
+      $.each(aside_1, 21, () => $.get(viewResources2), $.index, ($$anchor3, resource) => {
+        var div_3 = root_8();
+        var node_5 = $.child(div_3);
+        {
+          var consequent_1 = ($$anchor4) => {
+            Expander($$anchor4, {
+              get resource() {
+                return $.get(resource);
+              }
+            });
+          };
+          $.if(node_5, ($$render) => {
+            if ($.get(nestedResources2)) $$render(consequent_1);
+          });
+        }
+        var node_6 = $.sibling(node_5, 2);
+        Label(node_6, {
           get resource() {
             return $.get(resource);
           }
         });
-      };
-      $.if(node_4, ($$render) => {
-        if ($.get(nestedResources2)) $$render(consequent_1);
+        $.reset(div_3);
+        $.template_effect(() => $.set_class(div_3, 1, $.get(theme).rowHead));
+        $.append($$anchor3, div_3);
       });
-    }
-    var node_5 = $.sibling(node_4, 2);
-    Label(node_5, {
-      get resource() {
-        return $.get(resource);
-      }
-    });
-    $.reset(div_3);
-    $.template_effect(() => $.set_class(div_3, 1, $.get(theme).rowHead));
-    $.append($$anchor2, div_3);
-  });
-  $.reset(aside_1);
-  var div_4 = $.sibling(aside_1, 2);
-  $.each(div_4, 21, () => $.get(grid2), $.index, ($$anchor2, days, i) => {
-    var fragment_6 = $.comment();
-    var node_6 = $.first_child(fragment_6);
-    $.each(node_6, 17, () => $.get(days), $.index, ($$anchor3, day, j) => {
-      {
-        let $0 = $.derived(() => j + 1 === $.get(days).length);
-        let $1 = $.derived(() => i + 1 === $.get(grid2).length);
-        Day($$anchor3, {
-          get day() {
-            return $.get(day);
-          },
-          get noIeb() {
-            return $.get($0);
-          },
-          get noBeb() {
-            return $.get($1);
+      $.reset(aside_1);
+      var div_4 = $.sibling(aside_1, 2);
+      $.each(div_4, 21, () => $.get(grid2), $.index, ($$anchor3, days, i) => {
+        var fragment_7 = $.comment();
+        var node_7 = $.first_child(fragment_7);
+        $.each(node_7, 17, () => $.get(days), $.index, ($$anchor4, day, j) => {
+          {
+            let $0 = $.derived(() => j + 1 === $.get(days).length);
+            let $1 = $.derived(() => i + 1 === $.get(grid2).length);
+            Day($$anchor4, {
+              get day() {
+                return $.get(day);
+              },
+              get noIeb() {
+                return $.get($0);
+              },
+              get noBeb() {
+                return $.get($1);
+              }
+            });
           }
         });
+        $.append($$anchor3, fragment_7);
+      });
+      $.reset(div_4);
+      var div_5 = $.sibling(div_4, 2);
+      var node_8 = $.child(div_5);
+      $.each(node_8, 19, () => $.get(chunks), (chunk) => chunk.id, ($$anchor3, chunk, i) => {
+        $.bind_this(
+          Event($$anchor3, {
+            get chunk() {
+              return $.get(chunk);
+            }
+          }),
+          ($$value, i2) => refs[i2] = $$value,
+          (i2) => refs?.[i2],
+          () => [$.get(i)]
+        );
+      });
+      var node_9 = $.sibling(node_8, 2);
+      $.each(node_9, 17, () => $.get(bgChunks), (chunk) => chunk.id, ($$anchor3, chunk) => {
+        Event($$anchor3, {
+          get chunk() {
+            return $.get(chunk);
+          }
+        });
+      });
+      var node_10 = $.sibling(node_9, 2);
+      $.each(node_10, 17, () => $.get(iChunks), $.index, ($$anchor3, chunk) => {
+        Event($$anchor3, {
+          get chunk() {
+            return $.get(chunk);
+          }
+        });
+      });
+      $.reset(div_5);
+      $.reset(div_2);
+      var node_11 = $.sibling(div_2, 2);
+      {
+        var consequent_2 = ($$anchor3) => {
+          NowIndicator($$anchor3, {});
+        };
+        $.if(node_11, ($$render) => {
+          if ($.get(nowIndicator) && !$.get(monthView2)) $$render(consequent_2);
+        });
       }
-    });
-    $.append($$anchor2, fragment_6);
-  });
-  $.reset(div_4);
-  var div_5 = $.sibling(div_4, 2);
-  var node_7 = $.child(div_5);
-  $.each(node_7, 19, () => $.get(chunks), (chunk) => chunk.id, ($$anchor2, chunk, i) => {
-    $.bind_this(
-      Event($$anchor2, {
-        get chunk() {
-          return $.get(chunk);
-        }
-      }),
-      ($$value, i2) => refs[i2] = $$value,
-      (i2) => refs?.[i2],
-      () => [$.get(i)]
-    );
-  });
-  var node_8 = $.sibling(node_7, 2);
-  $.each(node_8, 17, () => $.get(bgChunks), (chunk) => chunk.id, ($$anchor2, chunk) => {
-    Event($$anchor2, {
-      get chunk() {
-        return $.get(chunk);
-      }
-    });
-  });
-  var node_9 = $.sibling(node_8, 2);
-  $.each(node_9, 17, () => $.get(iChunks), $.index, ($$anchor2, chunk) => {
-    Event($$anchor2, {
-      get chunk() {
-        return $.get(chunk);
-      }
-    });
-  });
-  $.reset(div_5);
-  $.reset(div_2);
-  var node_10 = $.sibling(div_2, 2);
-  {
-    var consequent_2 = ($$anchor2) => {
-      NowIndicator($$anchor2, {});
+      $.reset(section);
+      $.bind_this(section, ($$value) => mainState.mainEl = $$value, () => mainState?.mainEl);
+      $.attach(section, () => resizeObserver(reposition));
+      $.template_effect(() => {
+        $.set_class(section, 1, $.get(theme).main);
+        styles = $.set_style(section, "", styles, {
+          "--ec-grid-cols": $.get(grid2)[0].length,
+          "--ec-grid-rows": `${$.get(grid2).length > 1 ? `repeat(${$.get(grid2).length - 1}, auto)` : ""} 1fr`,
+          "--ec-col-width": $.get(columnWidth) ?? "minmax(4em, 1fr)",
+          "--ec-slot-label-periodicity": $.get(slotLabelPeriodicity2),
+          "--ec-slot-height": `${$.get(slotHeight) ?? ""}px`,
+          "--ec-slot-width": `${$.get(slotWidth) ?? ""}px`,
+          "--ec-header-height": `${$.get(headerHeight) ?? ""}px`,
+          "--ec-sidebar-width": `${$.get(sidebarWidth) ?? ""}px`
+        });
+        $.set_class(header, 1, $.get(theme).header);
+        $.set_class(aside, 1, $.get(theme).sidebar);
+        $.set_class(div, 1, $.get(theme).grid);
+        $.set_class(div_2, 1, $.get(theme).body);
+        $.set_class(aside_1, 1, $.get(theme).sidebar);
+        $.set_class(div_4, 1, $.get(theme).grid);
+        $.set_class(div_5, 1, $.get(theme).events);
+      });
+      $.bind_element_size(aside, "offsetWidth", ($$value) => viewState.sidebarWidth = $$value);
+      $.bind_element_size(header, "offsetHeight", ($$value) => $.set(headerHeight, $$value));
+      $.append($$anchor2, section);
     };
-    $.if(node_10, ($$render) => {
-      if ($.get(nowIndicator) && !$.get(monthView2)) $$render(consequent_2);
+    $.if(node, ($$render) => {
+      if ($.get(grid2).length && $.get(grid2)[0].length) $$render(consequent_3);
     });
   }
-  $.reset(section);
-  $.bind_this(section, ($$value) => mainState.mainEl = $$value, () => mainState?.mainEl);
-  $.attach(section, () => resizeObserver(reposition));
-  $.template_effect(() => {
-    $.set_class(section, 1, $.get(theme).main);
-    styles = $.set_style(section, "", styles, {
-      "--ec-grid-cols": $.get(grid2)[0].length,
-      "--ec-grid-rows": `${$.get(grid2).length > 1 ? `repeat(${$.get(grid2).length - 1}, auto)` : ""} 1fr`,
-      "--ec-col-width": $.get(columnWidth) ?? "minmax(4em, 1fr)",
-      "--ec-slot-label-periodicity": $.get(slotLabelPeriodicity2),
-      "--ec-slot-height": `${$.get(slotHeight) ?? ""}px`,
-      "--ec-slot-width": `${$.get(slotWidth) ?? ""}px`,
-      "--ec-header-height": `${$.get(headerHeight) ?? ""}px`,
-      "--ec-sidebar-width": `${$.get(sidebarWidth) ?? ""}px`
-    });
-    $.set_class(header, 1, $.get(theme).header);
-    $.set_class(aside, 1, $.get(theme).sidebar);
-    $.set_class(div, 1, $.get(theme).grid);
-    $.set_class(div_2, 1, $.get(theme).body);
-    $.set_class(aside_1, 1, $.get(theme).sidebar);
-    $.set_class(div_4, 1, $.get(theme).grid);
-    $.set_class(div_5, 1, $.get(theme).events);
-  });
-  $.bind_element_size(aside, "offsetWidth", ($$value) => viewState.sidebarWidth = $$value);
-  $.bind_element_size(header, "offsetHeight", ($$value) => $.set(headerHeight, $$value));
-  $.append($$anchor, section);
+  $.append($$anchor, fragment);
   $.pop();
 }
 const index$1 = {