npm - @event-calendar/core - Versions diffs - 5.2.3 → 5.3.0 - Mend

@event-calendar/core 5.2.3 → 5.3.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.

Files changed (24) hide show

package/README.md +133 -14
package/dist/index.css +1 -1
package/dist/index.js +792 -660
package/package.json +2 -2
package/src/Calendar.svelte +6 -1
package/src/lib/chunks.js +6 -3
package/src/lib/components/BaseEvent.svelte +11 -5
package/src/lib/dom.js +9 -0
package/src/lib/range.js +0 -10
package/src/lib/resources.js +9 -8
package/src/lib/utils.js +8 -9
package/src/plugins/day-grid/View.svelte +50 -48
package/src/plugins/list/View.svelte +2 -2
package/src/plugins/resource-time-grid/View.svelte +10 -10
package/src/plugins/resource-time-grid/derived.js +3 -3
package/src/plugins/resource-timeline/View.svelte +80 -75
package/src/plugins/resource-timeline/derived.js +1 -1
package/src/plugins/resource-timeline/lib.js +7 -4
package/src/plugins/time-grid/View.svelte +91 -88
package/src/plugins/time-grid/lib.js +1 -0
package/src/storage/derived.js +5 -4
package/src/storage/effects.js +126 -74
package/src/storage/options.svelte.js +6 -5
package/src/storage/state.svelte.js +8 -3

package/dist/index.js CHANGED Viewed

@@ -1,8 +1,8 @@
 /*!
- * EventCalendar v5.2.3
+ * EventCalendar v5.3.0
  * https://github.com/vkurko/calendar
  */
-import { untrack, getAbortSignal, tick, getContext, setContext, onMount, mount, unmount } from "svelte";
+import { untrack, tick, getAbortSignal, getContext, setContext, onMount, mount, unmount } from "svelte";
 import * as $ from "svelte/internal/client";
 import "svelte/internal/disclose-version";
 import { SvelteMap } from "svelte/reactivity";
@@ -87,6 +87,12 @@ function max(...args) {
 function symbol() {
   return /* @__PURE__ */ Symbol("ec");
 }
+function length(array) {
+  return array.length;
+}
+function empty(array) {
+  return !length(array);
+}
 function isArray(value) {
   return Array.isArray(value);
 }
@@ -112,14 +118,6 @@ function runAll(fns) {
 function noop() {
 }
 const identity = (x) => x;
-function stopPropagation(fn, _this = void 0) {
-  return function(event) {
-    event.stopPropagation();
-    if (fn) {
-      fn.call(_this, event);
-    }
-  };
-}
 function isRtl() {
   return window.getComputedStyle(document.documentElement).direction === "rtl";
 }
@@ -323,6 +321,14 @@ function listen(node, event, handler, options) {
   node.addEventListener(event, handler, options);
   return () => node.removeEventListener(event, handler, options);
 }
+function stopPropagation(fn, _this = void 0) {
+  return function(jsEvent) {
+    jsEvent.stopPropagation();
+    if (fn) {
+      fn.call(_this, jsEvent);
+    }
+  };
+}
 function createView(view2, _viewTitle, _currentRange, _activeRange) {
   return {
     type: view2,
@@ -492,19 +498,21 @@ function createAllDayChunks(event, days, withId = true) {
   let lastEnd;
   let gridColumn;
   let gridRow;
-  for (let { gridColumn: column, gridRow: row, resource, dayStart, dayEnd, disabled } of days) {
-    if (!disabled && eventIntersects(event, dayStart, dayEnd, resource)) {
+  let resource;
+  for (let { gridColumn: column, gridRow: row, resource: dayResource, dayStart, dayEnd, disabled } of days) {
+    if (!disabled && eventIntersects(event, dayStart, dayEnd, dayResource)) {
       dates.push(dayStart);
       lastEnd = dayEnd;
       if (!gridColumn) {
         gridColumn = column;
         gridRow = row;
+        resource = dayResource;
       }
     }
   }
   if (dates.length) {
     let chunk = createEventChunk(event, dates[0], lastEnd);
-    assign(chunk, { gridColumn, gridRow, dates });
+    assign(chunk, { gridColumn, gridRow, resource, dates });
     if (withId) {
       assignChunkId(chunk);
     }
@@ -694,19 +702,19 @@ function createResource(input) {
   return {
     id: String(input.id),
     title: input.title || "",
-    eventBackgroundColor: input.eventBackgroundColor,
-    eventTextColor: input.eventTextColor,
+    eventBackgroundColor: eventBackgroundColor(input),
+    eventTextColor: eventTextColor(input),
     extendedProps: input.extendedProps ?? {}
   };
 }
-function resourceBackgroundColor(event, resources) {
-  return findResource(event, resources)?.eventBackgroundColor;
+function eventBackgroundColor(resource) {
+  return resource?.eventBackgroundColor;
 }
-function resourceTextColor(event, resources) {
-  return findResource(event, resources)?.eventTextColor;
+function eventTextColor(resource) {
+  return resource?.eventTextColor;
 }
-function findResource(event, resources) {
-  return resources.find((resource) => event.resourceIds.includes(resource.id));
+function findFirstResource(event, resources) {
+  return empty(event.resourceIds) ? void 0 : resources.find((resource) => event.resourceIds.includes(resource.id));
 }
 function createSlots(date, slotDuration, slotLabelPeriodicity2, slotTimeLimits2, intlSlotLabel) {
   let slots2 = [];
@@ -800,6 +808,7 @@ function createOptions(plugins) {
     lazyFetching: true,
     loading: void 0,
     locale: void 0,
+    refetchResourcesOnNavigate: false,
     resources: [],
     selectable: false,
     theme: {
@@ -857,13 +866,13 @@ function createOptions(plugins) {
 }
 function createParsers(plugins) {
   let parsers = {
-    date: (date) => setMidnight(createDate(date)),
+    date: (input) => setMidnight(createDate(input)),
     duration: createDuration,
     events: createEvents,
     eventSources: createEventSources,
-    hiddenDays: (days) => [...new Set(days)],
-    highlightedDates: (dates) => dates.map((date) => setMidnight(createDate(date))),
-    resources: createResources,
+    hiddenDays: (input) => [...new Set(input)],
+    highlightedDates: (input) => input.map((item) => setMidnight(createDate(item))),
+    resources: (input) => isArray(input) ? createResources(input) : input,
     validRange: createDateRange
   };
   for (let plugin of plugins) {
@@ -986,68 +995,121 @@ function diff(options, prevOptions) {
   }
   return diff2;
 }
-function loadEvents(mainState) {
-  let fetching = 0;
+function loadEvents(mainState, loadingInvoker) {
   return () => {
-    let { activeRange: activeRange2, fetchedRange, options: { events, eventSources, lazyFetching, loading } } = mainState;
+    let {
+      activeRange: activeRange2,
+      fetchedRange: { events: fetchedRange },
+      viewDates: viewDates2,
+      options: { events, eventSources, lazyFetching }
+    } = mainState;
     untrack(() => {
-      if (!eventSources.length) {
-        mainState.events = events;
-      }
-      if (!fetchedRange.start || fetchedRange.start > activeRange2.start || fetchedRange.end < activeRange2.end || !lazyFetching) {
-        if (isFunction(loading) && !fetching) {
-          loading(true);
+      load(
+        eventSources.map((source) => isFunction(source.events) ? source.events : source),
+        events,
+        createEvents,
+        (result) => mainState.events = result,
+        activeRange2,
+        fetchedRange,
+        viewDates2,
+        true,
+        lazyFetching,
+        loadingInvoker
+      );
+    });
+  };
+}
+function loadResources(mainState, loadingInvoker) {
+  return () => {
+    let {
+      activeRange: activeRange2,
+      fetchedRange: { resources: fetchedRange },
+      viewDates: viewDates2,
+      options: { lazyFetching, refetchResourcesOnNavigate, resources }
+    } = mainState;
+    untrack(() => {
+      load(
+        isArray(resources) ? [] : [resources],
+        resources,
+        createResources,
+        (result) => mainState.resources = result,
+        activeRange2,
+        fetchedRange,
+        viewDates2,
+        refetchResourcesOnNavigate,
+        lazyFetching,
+        loadingInvoker
+      );
+    });
+  };
+}
+function load(sources, defaultResult, parseResult, applyResult, activeRange2, fetchedRange, viewDates2, refetchOnNavigate, lazyFetching, loading) {
+  if (empty(viewDates2)) {
+    return;
+  }
+  if (empty(sources)) {
+    applyResult(defaultResult);
+    return;
+  }
+  if ((refetchOnNavigate || !fetchedRange.start) && (!lazyFetching || !fetchedRange.start || fetchedRange.start > activeRange2.start || fetchedRange.end < activeRange2.end)) {
+    let result = [];
+    let failure = (e) => loading.stop();
+    let success = (data) => {
+      result = result.concat(parseResult(data));
+      applyResult(result);
+      loading.stop();
+    };
+    let startStr = toISOString(activeRange2.start);
+    let endStr = toISOString(activeRange2.end);
+    for (let source of sources) {
+      loading.start();
+      if (isFunction(source)) {
+        let result2 = source(refetchOnNavigate ? {
+          start: toLocalDate(activeRange2.start),
+          end: toLocalDate(activeRange2.end),
+          startStr,
+          endStr
+        } : {}, success, failure);
+        if (result2 !== void 0) {
+          Promise.resolve(result2).then(success, failure);
         }
-        let stopLoading = () => {
-          if (--fetching === 0 && isFunction(loading)) {
-            loading(false);
-          }
-        };
-        let events2 = [];
-        let failure = (e) => stopLoading();
-        let success = (data) => {
-          events2 = events2.concat(createEvents(data));
-          mainState.events = events2;
-          stopLoading();
-        };
-        let startStr = toISOString(activeRange2.start);
-        let endStr = toISOString(activeRange2.end);
-        for (let source of eventSources) {
-          if (isFunction(source.events)) {
-            let result = source.events({
-              start: toLocalDate(activeRange2.start),
-              end: toLocalDate(activeRange2.end),
-              startStr,
-              endStr
-            }, success, failure);
-            if (result !== void 0) {
-              Promise.resolve(result).then(success, failure);
-            }
-          } else {
-            let params = isFunction(source.extraParams) ? source.extraParams() : assign({}, source.extraParams);
-            params.start = startStr;
-            params.end = endStr;
-            params = new URLSearchParams(params);
-            let url = source.url, headers = {}, body;
-            if (["GET", "HEAD"].includes(source.method)) {
-              url += (url.includes("?") ? "&" : "?") + params;
-            } else {
-              headers["content-type"] = "application/x-www-form-urlencoded;charset=UTF-8";
-              body = String(params);
-            }
-            fetch(url, {
-              method: source.method,
-              headers,
-              body,
-              signal: getAbortSignal(),
-              credentials: "same-origin"
-            }).then((response) => response.json()).then(success).catch(failure);
-          }
-          ++fetching;
+      } else {
+        let params = isFunction(source.extraParams) ? source.extraParams() : assign({}, source.extraParams);
+        if (refetchOnNavigate) {
+          params.start = startStr;
+          params.end = endStr;
+        }
+        params = new URLSearchParams(params);
+        let url = source.url, headers = {}, body;
+        if (["GET", "HEAD"].includes(source.method)) {
+          url += (url.includes("?") ? "&" : "?") + params;
+        } else {
+          headers["content-type"] = "application/x-www-form-urlencoded;charset=UTF-8";
+          body = String(params);
         }
-        assign(fetchedRange, activeRange2);
+        fetch(url, {
+          method: source.method,
+          headers,
+          body,
+          signal: getAbortSignal(),
+          credentials: "same-origin"
+        }).then((response) => response.json()).then(success).catch(failure);
       }
-    });
+    }
+    assign(fetchedRange, activeRange2);
+  }
+}
+function createLoadingInvoker(options) {
+  let counter = 0;
+  function invoke(value) {
+    let { loading } = options;
+    if (isFunction(loading)) {
+      loading(value);
+    }
+  }
+  return {
+    start: () => ++counter === 1 && invoke(true),
+    stop: () => --counter === 0 && invoke(false)
   };
 }
 function setNowAndToday(mainState) {
@@ -1136,17 +1198,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) {
@@ -1170,8 +1232,8 @@ function viewDates(mainState) {
     let { hiddenDays } = options;
     let dates = [];
     untrack(() => {
-      let date = cloneDate(activeRange2.start);
-      let end = cloneDate(activeRange2.end);
+      let date = setMidnight(cloneDate(activeRange2.start));
+      let end = setMidnight(cloneDate(activeRange2.end));
       while (date < end) {
         if (!hiddenDays.includes(date.getUTCDay())) {
           dates.push(cloneDate(date));
@@ -1237,7 +1299,7 @@ class State {
     return $.get(this.#fetchedRange);
   }
   set fetchedRange(value) {
-    $.set(this.#fetchedRange, value);
+    $.set(this.#fetchedRange, value, true);
   }
   #events;
   get events() {
@@ -1267,6 +1329,13 @@ class State {
   set now(value) {
     $.set(this.#now, value, true);
   }
+  #resources;
+  get resources() {
+    return $.get(this.#resources);
+  }
+  set resources(value) {
+    $.set(this.#resources, value);
+  }
   #today;
   get today() {
     return $.get(this.#today);
@@ -1373,11 +1442,12 @@ class State {
     this.#auxComponents = $.state($.proxy([]));
     this.#currentRange = $.derived(currentRange(this));
     this.#activeRange = $.derived(activeRange(this));
-    this.#fetchedRange = $.state({ start: void 0, end: void 0 });
+    this.#fetchedRange = $.state($.proxy({ events: {}, resources: {} }));
     this.#events = $.state([]);
     this.#filteredEvents = $.derived(filteredEvents(this));
     this.#mainEl = $.state();
     this.#now = $.state($.proxy(createDate()));
+    this.#resources = $.state([]);
     this.#today = $.state($.proxy(setMidnight(createDate())));
     this.#intlEventTime = $.derived(intlRange(this, "eventTimeFormat"));
     this.#intlDayHeader = $.derived(intl(this, "dayHeaderFormat"));
@@ -1400,8 +1470,10 @@ class State {
     this.#initEffects();
   }
   #initEffects() {
+    let loading = createLoadingInvoker(this.options);
     $.user_pre_effect(setNowAndToday(this));
-    $.user_effect(loadEvents(this));
+    $.user_effect(loadEvents(this, loading));
+    $.user_effect(loadResources(this, loading));
     $.user_effect(runDatesSet(this));
     $.user_effect(runEventAllUpdated(this));
     $.user_effect(runViewDidMount(this));
@@ -1415,12 +1487,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");
@@ -1481,7 +1553,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);
@@ -1527,7 +1599,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);
@@ -1560,7 +1632,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);
@@ -1640,8 +1712,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);
@@ -1652,9 +1724,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);
@@ -1694,7 +1766,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, () => ({}));
@@ -1724,8 +1796,12 @@ function Calendar($$anchor, $$props) {
     let value = mainState.options[name];
     return isDate(value) ? toLocalDate(value) : value;
   }
+  function refetchResources() {
+    mainState.fetchedRange.resources = {};
+    return this;
+  }
   function refetchEvents() {
-    mainState.fetchedRange = { start: void 0, end: void 0 };
+    mainState.fetchedRange.events = {};
     return this;
   }
   function getEvents() {
@@ -1793,6 +1869,7 @@ function Calendar($$anchor, $$props) {
   var $$exports = {
     setOption,
     getOption,
+    refetchResources,
     refetchEvents,
     getEvents,
     getEventById,
@@ -1805,7 +1882,7 @@ function Calendar($$anchor, $$props) {
     next,
     prev
   };
-  var div = root$d();
+  var div = root$a();
   let styles;
   var node = $.child(div);
   Toolbar(node, {});
@@ -2007,7 +2084,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);
@@ -2035,7 +2112,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);
   };
@@ -2051,16 +2128,16 @@ 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);
-  let $$d = $.derived(() => getContext("state")), intlEventTime = $.derived(() => $.get($$d).intlEventTime), view2 = $.derived(() => $.get($$d).view), displayEventEnd = $.derived(() => $.get($$d).options.displayEventEnd), eventBackgroundColor = $.derived(() => $.get($$d).options.eventBackgroundColor), eventColor = $.derived(() => $.get($$d).options.eventColor), eventContent = $.derived(() => $.get($$d).options.eventContent), eventClick = $.derived(() => $.get($$d).options.eventClick), eventDidMount = $.derived(() => $.get($$d).options.eventDidMount), eventClassNames = $.derived(() => $.get($$d).options.eventClassNames), eventMouseEnter = $.derived(() => $.get($$d).options.eventMouseEnter), eventMouseLeave = $.derived(() => $.get($$d).options.eventMouseLeave), eventTextColor = $.derived(() => $.get($$d).options.eventTextColor), resources = $.derived(() => $.get($$d).options.resources), theme = $.derived(() => $.get($$d).options.theme);
+  let $$d = $.derived(() => getContext("state")), intlEventTime = $.derived(() => $.get($$d).intlEventTime), resources = $.derived(() => $.get($$d).resources), view2 = $.derived(() => $.get($$d).view), displayEventEnd = $.derived(() => $.get($$d).options.displayEventEnd), eventBackgroundColor$1 = $.derived(() => $.get($$d).options.eventBackgroundColor), eventColor = $.derived(() => $.get($$d).options.eventColor), eventContent = $.derived(() => $.get($$d).options.eventContent), eventClick = $.derived(() => $.get($$d).options.eventClick), eventDidMount = $.derived(() => $.get($$d).options.eventDidMount), eventClassNames = $.derived(() => $.get($$d).options.eventClassNames), eventMouseEnter = $.derived(() => $.get($$d).options.eventMouseEnter), eventMouseLeave = $.derived(() => $.get($$d).options.eventMouseLeave), eventTextColor$1 = $.derived(() => $.get($$d).options.eventTextColor), theme = $.derived(() => $.get($$d).options.theme);
   let event = $.derived(() => $$props.chunk.event);
   let display = $.derived(() => $$props.chunk.event.display);
-  let bgColor = $.derived(() => $.get(event).backgroundColor ?? resourceBackgroundColor($.get(event), $.get(resources)) ?? $.get(eventBackgroundColor) ?? $.get(eventColor));
-  let txtColor = $.derived(() => $.get(event).textColor ?? resourceTextColor($.get(event), $.get(resources)) ?? $.get(eventTextColor));
+  let bgColor = $.derived(() => $.get(event).backgroundColor ?? eventBackgroundColor($$props.chunk.resource ?? findFirstResource($.get(event), $.get(resources))) ?? $.get(eventBackgroundColor$1) ?? $.get(eventColor));
+  let txtColor = $.derived(() => $.get(event).textColor ?? eventTextColor($$props.chunk.resource ?? findFirstResource($.get(event), $.get(resources))) ?? $.get(eventTextColor$1));
   let style = $.derived(() => entries(styles()({ "background-color": $.get(bgColor), "color": $.get(txtColor) })).map((entry) => `${entry[0]}:${entry[1]}`).concat($.get(event).styles).join(";"));
   let classNames = $.derived(() => classes()([
     bgEvent($.get(display)) ? $.get(theme).bgEvent : $.get(theme).event,
@@ -2089,7 +2166,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);
   };
@@ -2101,7 +2178,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);
@@ -2141,12 +2218,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);
@@ -2171,12 +2248,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) => {
@@ -2274,10 +2351,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);
@@ -2339,12 +2416,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);
@@ -2503,7 +2580,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");
@@ -2573,7 +2650,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);
@@ -2619,8 +2696,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");
@@ -2636,124 +2713,139 @@ 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 === length($.get(days)));
+            let $1 = $.derived(() => i + 1 === length($.get(grid2)));
+            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(
+        ($0) => {
+          $.set_class(section, 1, $.clsx([
+            $.get(theme).main,
+            $.get(dayMaxEvents) === true && $.get(theme).uniform
+          ]));
+          styles = $.set_style(section, "", styles, $0);
+          $.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);
+        },
+        [
+          () => ({
+            "--ec-grid-cols": length($.get(grid2)[0]),
+            "--ec-grid-rows": length($.get(grid2))
+          })
+        ]
+      );
+      $.append($$anchor2, section);
     };
-    $.if(node_4, ($$render) => {
-      if ($.get(popupDay)) $$render(consequent);
+    $.if(node, ($$render) => {
+      if (!empty($.get(grid2)) && !empty($.get(grid2)[0])) $$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 = {
@@ -3460,9 +3552,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);
@@ -3474,11 +3566,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);
@@ -3511,14 +3603,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);
@@ -3602,7 +3694,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);
@@ -3613,7 +3705,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);
@@ -3713,8 +3805,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");
@@ -3723,7 +3815,7 @@ function View$2($$anchor, $$props) {
   let filteredEvents2 = $.derived(() => mainState.filteredEvents), view2 = $.derived(() => mainState.view), viewDates2 = $.derived(() => mainState.viewDates), noEventsClick = $.derived(() => mainState.options.noEventsClick), noEventsContent = $.derived(() => mainState.options.noEventsContent), theme = $.derived(() => mainState.options.theme);
   let noEvents = $.derived(() => {
     let noEvents2 = true;
-    if ($.get(viewDates2).length) {
+    if (!empty($.get(viewDates2))) {
       let start = $.get(viewDates2)[0];
       let end = addDay(cloneDate($.get(viewDates2).at(-1)));
       for (let event of $.get(filteredEvents2)) {
@@ -3741,11 +3833,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));
@@ -3837,6 +3929,7 @@ function createChunks$1(event, days, withId = true) {
       assign(chunk, {
         gridColumn,
         gridRow,
+        resource,
         top: (chunk.start - start) / 1e3,
         height: (chunk.end - chunk.start) / 1e3,
         maxHeight: (end - chunk.start) / 1e3
@@ -4218,7 +4311,8 @@ function viewResources(mainState) {
     let {
       activeRange: activeRange2,
       filteredEvents: filteredEvents2,
-      options: { filterResourcesWithEvents, resources },
+      resources,
+      options: { filterResourcesWithEvents },
       extensions: { viewResources: viewResources2 }
     } = mainState;
     let result = viewResources2 ? viewResources2(resources) : resources;
@@ -4226,7 +4320,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)
           )
         );
       }
@@ -4297,7 +4391,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);
@@ -4334,7 +4428,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)));
@@ -4458,7 +4552,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);
@@ -4491,7 +4585,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(() => {
@@ -4510,9 +4604,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);
@@ -4526,9 +4620,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 (!empty($.get(viewDates2))) {
+      tick().then(scrollToTime);
+    }
   });
   function scrollToTime() {
     $.get(mainEl).scrollTop = ((toSeconds($.get(scrollTime)) - toSeconds($.get(slotTimeLimits2).min)) / toSeconds($.get(slotDuration)) - 0.5) * $.get(slotHeight);
@@ -4538,249 +4633,264 @@ 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 === length($.get(grid2)) && j + 1 === length($.get(days)));
+                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);
+            let $0 = $.derived(() => i + 1 === length($.get(grid2)) && j + 1 === length($.get(days)));
             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(
+        ($0) => {
+          $.set_class(section, 1, $.get(theme).main);
+          styles = $.set_style(section, "", styles, $0);
+          $.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);
+        },
+        [
+          () => ({
+            "--ec-grid-cols": length($.get(grid2)) * length($.get(grid2)[0]),
+            "--ec-col-group-span": length($.get(grid2)[0]),
+            "--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`
+          })
+        ]
+      );
+      $.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 (!empty($.get(grid2)) && !empty($.get(grid2)[0])) $$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");
@@ -4800,7 +4910,7 @@ function View_1($$anchor, $$props) {
       for (let days of $.get(grid2)) {
         let day = days[0];
         if (datesEqual(day.dayStart, $.get(today))) {
-          $.get(mainEl).scrollLeft = ($.get(mainEl).scrollWidth - $.get(sidebarWidth)) / ($.get(grid2).length * days.length) * (day.gridColumn - 1) * (isRtl() ? -1 : 1);
+          $.get(mainEl).scrollLeft = ($.get(mainEl).scrollWidth - $.get(sidebarWidth)) / (length($.get(grid2)) * length(days)) * (day.gridColumn - 1) * (isRtl() ? -1 : 1);
           break;
         }
       }
@@ -4808,7 +4918,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(() => {
@@ -4816,10 +4926,11 @@ function View_1($$anchor, $$props) {
           return { date, resource, disabled, highlight };
         });
         {
-          let $0 = $.derived(() => $.get(grid2)[0].length > 1 ? $.get(theme).colGroup : void 0);
-          let $1 = $.derived(() => 1 + i * $.get(days).length);
-          let $2 = $.derived(() => $.get(datesAboveResources) && $.get(computed_const).disabled);
-          let $3 = $.derived(() => $.get(datesAboveResources) && $.get(computed_const).highlight);
+          let $0 = $.derived(() => length($.get(grid2)[0]) > 1 ? $.get(theme).colGroup : void 0);
+          let $1 = $.derived(() => length($.get(days)));
+          let $2 = $.derived(() => 1 + i * length($.get(days)));
+          let $3 = $.derived(() => $.get(datesAboveResources) && $.get(computed_const).disabled);
+          let $4 = $.derived(() => $.get(datesAboveResources) && $.get(computed_const).highlight);
           ColHead($$anchor3, {
             get date() {
               return $.get(computed_const).date;
@@ -4831,16 +4942,16 @@ function View_1($$anchor, $$props) {
               return $.get(datesAboveResources);
             },
             get colSpan() {
-              return $.get(days).length;
+              return $.get($1);
             },
             get colIndex() {
-              return $.get($1);
+              return $.get($2);
             },
             get disabled() {
-              return $.get($2);
+              return $.get($3);
             },
             get highlight() {
-              return $.get($3);
+              return $.get($4);
             },
             children: ($$anchor4, $$slotProps) => {
               var fragment_3 = $.comment();
@@ -4886,7 +4997,7 @@ function View_1($$anchor, $$props) {
                 return { date, resource, disabled, highlight };
               });
               {
-                let $0 = $.derived(() => 1 + j + i * $.get(days).length);
+                let $0 = $.derived(() => 1 + j + i * length($.get(days)));
                 ColHead($$anchor5, {
                   get date() {
                     return $.get(computed_const_1).date;
@@ -4940,7 +5051,7 @@ function View_1($$anchor, $$props) {
           $.append($$anchor3, fragment_6);
         };
         $.if(node_2, ($$render) => {
-          if ($.get(grid2)[0].length > 1) $$render(consequent_2);
+          if (length($.get(grid2)[0]) > 1) $$render(consequent_2);
         });
       }
       $.append($$anchor2, fragment_1);
@@ -4952,12 +5063,13 @@ function View_1($$anchor, $$props) {
         var consequent_3 = ($$anchor3) => {
           {
             let $0 = $.derived(() => $.get(grid2).flat());
+            let $1 = $.derived(() => length($.get(grid2)[0]));
             NowIndicator$1($$anchor3, {
               get days() {
                 return $.get($0);
               },
               get span() {
-                return $.get(grid2)[0].length;
+                return $.get($1);
               }
             });
           }
@@ -4981,18 +5093,19 @@ function View_1($$anchor, $$props) {
             var alternate_2 = ($$anchor4) => {
               {
                 let $0 = $.derived(() => $.get(grid2).flat());
+                let $1 = $.derived(() => length($.get(grid2)));
                 NowIndicator$1($$anchor4, {
                   get days() {
                     return $.get($0);
                   },
                   get span() {
-                    return $.get(grid2).length;
+                    return $.get($1);
                   }
                 });
               }
             };
             $.if(node_7, ($$render) => {
-              if ($.get(grid2)[0].length > 1) $$render(consequent_4);
+              if (length($.get(grid2)[0]) > 1) $$render(consequent_4);
               else $$render(alternate_2, false);
             });
           }
@@ -5063,26 +5176,29 @@ function createChunks(event, days, monthView2, withId = true) {
   let lastEnd;
   let gridColumn;
   let gridRow;
+  let resource;
   let left;
   let width = 0;
-  for (let { gridColumn: column, gridRow: row, resource, dayStart, dayEnd, start, end, disabled } of days) {
+  for (let { gridColumn: column, gridRow: row, resource: dayResource, dayStart, dayEnd, start, end, disabled } of days) {
     if (!disabled) {
       if (monthView2) {
-        if (eventIntersects(event, dayStart, dayEnd, resource)) {
+        if (eventIntersects(event, dayStart, dayEnd, dayResource)) {
           if (!dates.length) {
             firstStart = dayStart;
             gridColumn = column;
             gridRow = row;
+            resource = dayResource;
           }
           dates.push(dayStart);
           lastEnd = end;
         }
       } else {
-        if (eventIntersects(event, start, end, resource)) {
+        if (eventIntersects(event, start, end, dayResource)) {
           if (!dates.length) {
             firstStart = start;
             gridColumn = column;
             gridRow = row;
+            resource = dayResource;
             left = max(event.start - start, 0) / 1e3;
           }
           dates.push(dayStart);
@@ -5094,7 +5210,7 @@ function createChunks(event, days, monthView2, withId = true) {
   }
   if (dates.length) {
     let chunk = createEventChunk(event, firstStart, lastEnd);
-    assign(chunk, { gridColumn, gridRow, dates, left, width });
+    assign(chunk, { gridColumn, gridRow, resource, dates, left, width });
     if (withId) {
       assignChunkId(chunk);
     }
@@ -5246,7 +5362,7 @@ function daySlots(mainState, viewState) {
 }
 function nestedResources(mainState) {
   return () => {
-    let { options: { resources } } = mainState;
+    let { resources } = mainState;
     let nested;
     untrack(() => {
       nested = resources.some((resource) => getPayload(resource).children.length);
@@ -5436,9 +5552,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);
@@ -5464,10 +5580,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);
   });
@@ -5506,7 +5622,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);
@@ -5538,7 +5654,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(() => {
@@ -5558,9 +5674,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");
@@ -5570,9 +5686,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 (!empty($.get(viewDates2))) {
+      tick().then(scrollToTime);
+    }
   });
   function scrollToTime() {
     let scrollLeft = 0;
@@ -5582,7 +5699,7 @@ function View($$anchor, $$props) {
         let days = $.get(grid2)[0];
         for (let day of days) {
           if (datesEqual(day.dayStart, $.get(today))) {
-            $.get(mainEl).scrollLeft = ($.get(mainEl).scrollWidth - $.get(sidebarWidth)) / days.length * (day.gridColumn - 1) * (isRtl() ? -1 : 1);
+            $.get(mainEl).scrollLeft = ($.get(mainEl).scrollWidth - $.get(sidebarWidth)) / length(days) * (day.gridColumn - 1) * (isRtl() ? -1 : 1);
             break;
           }
         }
@@ -5605,43 +5722,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;
@@ -5649,164 +5740,205 @@ 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 === length($.get(days)));
+            let $1 = $.derived(() => i + 1 === length($.get(grid2)));
+            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(
+        ($0) => {
+          $.set_class(section, 1, $.get(theme).main);
+          styles = $.set_style(section, "", styles, $0);
+          $.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);
+        },
+        [
+          () => ({
+            "--ec-grid-cols": length($.get(grid2)[0]),
+            "--ec-grid-rows": `${length($.get(grid2)) > 1 ? `repeat(${length($.get(grid2)) - 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`
+          })
+        ]
+      );
+      $.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 (!empty($.get(grid2)) && !empty($.get(grid2)[0])) $$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 = {