@event-calendar/core 4.5.2 → 4.7.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@event-calendar/core",
-  "version": "4.5.2",
+  "version": "4.7.0",
   "title": "Event Calendar Core package",
   "description": "Full-sized drag & drop event calendar with resource & timeline views",
   "keywords": [

package/src/lib/events.js

@@ -66,9 +66,25 @@ export function createEventChunk(event, start, end) {
     return chunk;
 }
 
-export function sortEventChunks(chunks) {
-    // Sort by start date (all-day events always on top)
-    chunks.sort((a, b) => a.start - b.start || b.event.allDay - a.event.allDay);
+export function sortEventChunks(chunks, eventOrder) {
+    if (isFunction(eventOrder)) {
+        chunks.sort((a, b) => eventOrder(
+            _toChunkWithLocalDates(a),
+            _toChunkWithLocalDates(b)
+        ));
+    } else {
+        // Sort by start date (all-day events always on top)
+        chunks.sort((a, b) => a.start - b.start || b.event.allDay - a.event.allDay);
+    }
+}
+
+function _toChunkWithLocalDates(chunk) {
+    return {
+        ...chunk,
+        start: toLocalDate(chunk.start),
+        end: toLocalDate(chunk.end),
+        event: toEventWithLocalDates(chunk.event)
+    };
 }
 
 export function createEventContent(chunk, displayEventEnd, eventContent, theme, _intlEventTime, _view) {
@@ -156,11 +172,11 @@ function _cloneEvent(event, dateFn) {
 /**
  * Prepare event chunks for month view and all-day slot in week view
  */
-export function prepareEventChunks(chunks, hiddenDays) {
+export function prepareEventChunks(chunks, hiddenDays, eventOrder) {
     let longChunks = {};
 
     if (chunks.length) {
-        sortEventChunks(chunks);
+        sortEventChunks(chunks, eventOrder);
 
         let prevChunk;
         for (let chunk of chunks) {

package/src/plugins/day-grid/Week.svelte

@@ -8,8 +8,8 @@
 
     let {dates} = $props();
 
-    let {_filteredEvents, _iEvents,
-        resources, filterEventsWithResources, hiddenDays, theme, validRange } = getContext('state');
+    let {_filteredEvents, _iEvents, resources, eventOrder, filterEventsWithResources, hiddenDays, theme,
+        validRange} = getContext('state');
 
     let refs = [];
 
@@ -31,8 +31,8 @@
                 }
             }
         }
-        prepareEventChunks(bgChunks, $hiddenDays);
-        let longChunks = prepareEventChunks(chunks, $hiddenDays);
+        prepareEventChunks(bgChunks, $hiddenDays, $eventOrder);
+        let longChunks = prepareEventChunks(chunks, $hiddenDays, $eventOrder);
         return [chunks, bgChunks, longChunks];
     });
 
@@ -40,7 +40,7 @@
         let chunk;
         if (event && eventIntersects(event, start, end)) {
             chunk = createEventChunk(event, start, end);
-            prepareEventChunks([chunk], $hiddenDays);
+            prepareEventChunks([chunk], $hiddenDays, $eventOrder);
         } else {
             chunk = null;
         }

package/src/plugins/list/Day.svelte

@@ -9,7 +9,7 @@
     let {date} = $props();
 
     let {_filteredEvents, _interaction, _intlListDay, _intlListDaySide, _today,
-        resources, filterEventsWithResources, highlightedDates, theme, validRange} = getContext('state');
+        resources, eventOrder, filterEventsWithResources, highlightedDates, theme, validRange} = getContext('state');
 
     let el = $state();
     let isToday = $derived(datesEqual(date, $_today));
@@ -28,7 +28,7 @@
                     chunks.push(chunk);
                 }
             }
-            sortEventChunks(chunks);
+            sortEventChunks(chunks, $eventOrder);
         }
         return chunks;
     });

package/src/plugins/resource-timeline/Days.svelte

@@ -9,9 +9,8 @@
 
     let {resource} = $props();
 
-    let {
-        _viewDates, _filteredEvents, _iEvents, _dayTimeLimits, _daysHs, _resHs, slotDuration, theme, validRange
-    } = getContext('state');
+    let {_viewDates, _filteredEvents, _iEvents, _dayTimeLimits, _daysHs, _resHs,
+        eventOrder, slotDuration, theme, validRange} = getContext('state');
 
     let refs = [];
 
@@ -43,8 +42,8 @@
                 }
             }
         }
-        [bgChunks] = prepareEventChunks(bgChunks, $_viewDates, $_dayTimeLimits, $slotDuration);
-        [chunks, longChunks] = prepareEventChunks(chunks, $_viewDates, $_dayTimeLimits, $slotDuration);
+        [bgChunks] = prepareEventChunks(bgChunks, $_viewDates, $_dayTimeLimits, $slotDuration, $eventOrder);
+        [chunks, longChunks] = prepareEventChunks(chunks, $_viewDates, $_dayTimeLimits, $slotDuration, $eventOrder);
         return [chunks, bgChunks, longChunks];
     });
 
@@ -52,7 +51,7 @@
         let chunk;
         if (event && eventIntersects(event, start, end, resource)) {
             chunk = createEventChunk(event, start, end);
-            [[chunk]] = prepareEventChunks([chunk], $_viewDates, $_dayTimeLimits, $slotDuration);
+            [[chunk]] = prepareEventChunks([chunk], $_viewDates, $_dayTimeLimits, $slotDuration, $eventOrder);
         } else {
             chunk = null;
         }

package/src/plugins/resource-timeline/lib.js

@@ -1,11 +1,11 @@
 import {addDay, addDuration, cloneDate, createDuration, datesEqual, sortEventChunks, toSeconds} from '#lib';
 
-export function prepareEventChunks(chunks, $_viewDates, $_dayTimeLimits, $slotDuration) {
+export function prepareEventChunks(chunks, $_viewDates, $_dayTimeLimits, $slotDuration, $eventOrder) {
     let longChunks = {};
     let filteredChunks = [];
 
     if (chunks.length) {
-        sortEventChunks(chunks);
+        sortEventChunks(chunks, $eventOrder);
 
         let step = toSeconds($slotDuration);
         let prevChunk;

package/src/plugins/time-grid/Day.svelte

@@ -11,7 +11,7 @@
     let {date, resource = undefined} = $props();
 
     let {_filteredEvents, _iEvents, highlightedDates, nowIndicator, slotDuration, slotHeight, filterEventsWithResources,
-        theme, resources, validRange, _interaction, _today, _slotTimeLimits} = getContext('state');
+        eventOrder, theme, resources, validRange, _interaction, _today, _slotTimeLimits} = getContext('state');
 
     let el = $state();
 
@@ -39,7 +39,7 @@
                 }
             }
         }
-        groupEventChunks(chunks);
+        groupEventChunks(chunks, $eventOrder);
         return [chunks, bgChunks];
     });
 

package/src/plugins/time-grid/all-day/Day.svelte

@@ -1,6 +1,6 @@
 <script>
     import {getContext, onMount} from 'svelte';
-    import {datesEqual, outsideRange, runReposition, setPayload} from '../../../lib';
+    import {datesEqual, outsideRange, runReposition, setPayload} from '#lib';
     import Event from './Event.svelte';
 
     let {date, chunks, bgChunks, longChunks, iChunks = [], resource = undefined} = $props();

package/src/plugins/time-grid/all-day/Week.svelte

@@ -2,12 +2,13 @@
     import {getContext, untrack} from 'svelte';
     import {
         addDay, bgEvent, cloneDate, createEventChunk, eventIntersects, limitToRange, prepareEventChunks, runReposition
-    } from '../../../lib';
+    } from '#lib';
     import Day from './Day.svelte';
 
     let {dates, resource = undefined} = $props();
 
-    let {_filteredEvents, _iEvents, hiddenDays, resources, filterEventsWithResources, validRange } = getContext('state');
+    let {_filteredEvents, _iEvents, eventOrder, hiddenDays, resources, filterEventsWithResources,
+        validRange} = getContext('state');
 
     let refs = [];
 
@@ -31,8 +32,8 @@
                 }
             }
         }
-        prepareEventChunks(bgChunks, $hiddenDays);
-        let longChunks = prepareEventChunks(chunks, $hiddenDays);
+        prepareEventChunks(bgChunks, $hiddenDays, $eventOrder);
+        let longChunks = prepareEventChunks(chunks, $hiddenDays, $eventOrder);
         return [chunks, bgChunks, longChunks];
     });
 
@@ -48,7 +49,7 @@
         let chunk;
         if (event && event.allDay && eventIntersects(event, start, end, resource)) {
             chunk = createEventChunk(event, start, end);
-            prepareEventChunks([chunk], $hiddenDays);
+            prepareEventChunks([chunk], $hiddenDays, $eventOrder);
         } else {
             chunk = null;
         }

package/src/plugins/time-grid/utils.js

@@ -1,11 +1,11 @@
 import {isFunction, sortEventChunks} from '#lib';
 
-export function groupEventChunks(chunks) {
+export function groupEventChunks(chunks, $eventOrder) {
     if (!chunks.length) {
         return;
     }
 
-    sortEventChunks(chunks);
+    sortEventChunks(chunks, $eventOrder);
 
     // Group
     let group = {

package/src/storage/options.js

@@ -2,6 +2,9 @@ import {
     createDate, createDuration, createEvents, createEventSources, createResources, createDateRange, keys, setMidnight
 } from '#lib';
 
+// Options where initial value is passed to the function
+export const specialOptions = ['buttonText', 'customButtons', 'theme'];
+
 export function createOptions(plugins) {
     let options = {
         allDayContent: undefined,
@@ -33,6 +36,7 @@ export function createOptions(plugins) {
         eventFilter: undefined,    // ec option
         eventMouseEnter: undefined,
         eventMouseLeave: undefined,
+        eventOrder: undefined,
         eventSources: [],
         eventTextColor: undefined,
         eventTimeFormat: {

package/src/storage/state.js

@@ -1,6 +1,6 @@
 import {get, writable} from 'svelte/store';
 import {tick} from 'svelte';
-import {createOptions, createParsers} from './options.js';
+import {createOptions, createParsers, specialOptions} from './options.js';
 import {activeRange, currentRange, dayGrid, events, now, today, view as view2, viewDates, viewTitle, filteredEvents} from './stores.js';
 import {identity, intl, intlRange, isFunction, keys, toViewWithLocalDates} from '#lib';
 
@@ -86,7 +86,7 @@ export default class {
 
                 this[key] = {
                     // Set value in all views
-                    set: ['buttonText', 'theme'].includes(key)
+                    set: specialOptions.includes(key)
                         ? value => {
                             if (isFunction(value)) {
                                 let result = value(defOpts[key]);
@@ -145,7 +145,7 @@ function mergeOpts(...args) {
     let result = {};
     for (let opts of args) {
         let override = {};
-        for (let key of ['buttonText', 'theme']) {
+        for (let key of specialOptions) {
             if (isFunction(opts[key])) {
                 override[key] = opts[key](result[key]);
             }