@stfrigerio/sito-template 0.1.72 → 0.1.74

package/dist/index.js

@@ -3046,7 +3046,7 @@ function StreamConsole({ stream, onCancel, onDismiss, hideDismiss = false, runni
                     }), stream.status === 'error' && stream.errorMessage && (jsxRuntime.jsxs("p", { className: styles$b.line, "data-type": "error", children: [jsxRuntime.jsx("span", { className: styles$b.linePrefix, children: "!" }), jsxRuntime.jsx("span", { className: styles$b.lineText, children: stream.errorMessage })] }))] })] }));
 }
 
-var styles$a = {"calendar":"Calendar-module_calendar__3mIJS","loading":"Calendar-module_loading__59Z9-","loadingSpinner":"Calendar-module_loadingSpinner__7MXqV","header":"Calendar-module_header__cZHNA","navigation":"Calendar-module_navigation__PGkpY","navButton":"Calendar-module_navButton__kOe-w","title":"Calendar-module_title__oJZ7m","controls":"Calendar-module_controls__i1Z38","exportDropdown":"Calendar-module_exportDropdown__yQX4q","exportButton":"Calendar-module_exportButton__dx7--","exportMenu":"Calendar-module_exportMenu__-lZ-8","exportMenuItem":"Calendar-module_exportMenuItem__D9MdL","todayButton":"Calendar-module_todayButton__Ac9zc","viewToggle":"Calendar-module_viewToggle__Fhg2t","viewButton":"Calendar-module_viewButton__J2WY6","active":"Calendar-module_active__lIqH-","filterBar":"Calendar-module_filterBar__ZD-lX","filterPill":"Calendar-module_filterPill__f7S8p","filterPillActive":"Calendar-module_filterPillActive__9Wtm9","filterDot":"Calendar-module_filterDot__E1Hp8","weekDays":"Calendar-module_weekDays__4J-8f","withWeekNumbers":"Calendar-module_withWeekNumbers__qbnUY","weekNumberHeader":"Calendar-module_weekNumberHeader__xhKbB","weekDay":"Calendar-module_weekDay__cg8Gr","daysGrid":"Calendar-module_daysGrid__ER0GM","dayCell":"Calendar-module_dayCell__TV-HR","dayNumber":"Calendar-module_dayNumber__ICH-X","today":"Calendar-module_today__eGuUU","events":"Calendar-module_events__qdbs7","event":"Calendar-module_event__Q1Zq3","eventTitle":"Calendar-module_eventTitle__XU7Wd","eventTime":"Calendar-module_eventTime__pMGEB","otherMonth":"Calendar-module_otherMonth__r6VJK","selected":"Calendar-module_selected__5e6h0","compact":"Calendar-module_compact__i0SF3","dots":"Calendar-module_dots__1Q7QR","dot":"Calendar-module_dot__tsCR1","dotMore":"Calendar-module_dotMore__emasD","weekNumberCell":"Calendar-module_weekNumberCell__bydCw","completed":"Calendar-module_completed__B-SHI","completedIcon":"Calendar-module_completedIcon__-oDZ9","moreEvents":"Calendar-module_moreEvents__TIKaT","emptyState":"Calendar-module_emptyState__2fcj7","dayView":"Calendar-module_dayView__PCIos","dayViewHeader":"Calendar-module_dayViewHeader__Gvxx2","timeColumnHeader":"Calendar-module_timeColumnHeader__B0btR","dayColumnHeader":"Calendar-module_dayColumnHeader__Rjqwg","allDayStrip":"Calendar-module_allDayStrip__VOqbV","allDayLabel":"Calendar-module_allDayLabel__2AmyT","allDayList":"Calendar-module_allDayList__6hFSb","dayViewScrollContainer":"Calendar-module_dayViewScrollContainer__84Byq","dayTimelineGrid":"Calendar-module_dayTimelineGrid__r1BNI","hourRow":"Calendar-module_hourRow__U-YN-","hourLabel":"Calendar-module_hourLabel__im84k","hourSlots":"Calendar-module_hourSlots__vbtYy","halfHourSlot":"Calendar-module_halfHourSlot__UWIri","halfHourSlotBottom":"Calendar-module_halfHourSlotBottom__aE5Mo","dayEventAnchor":"Calendar-module_dayEventAnchor__oryAi","weekTimeline":"Calendar-module_weekTimeline__q75EF","weekTimelineHeader":"Calendar-module_weekTimelineHeader__n5i06","weekDayColumnHeader":"Calendar-module_weekDayColumnHeader__u2ghX","weekDayLabel":"Calendar-module_weekDayLabel__i8Rm9","weekDayNumber":"Calendar-module_weekDayNumber__tqFKO","weekTimelineScroll":"Calendar-module_weekTimelineScroll__jesa0","weekTimelineGrid":"Calendar-module_weekTimelineGrid__MxIHF","weekTimeColumn":"Calendar-module_weekTimeColumn__rK4ZV","weekTimeSlot":"Calendar-module_weekTimeSlot__IFPUz","weekHourLabel":"Calendar-module_weekHourLabel__0ANmg","weekDayColumns":"Calendar-module_weekDayColumns__soiyU","weekDayColumn":"Calendar-module_weekDayColumn__sXVu0","weekHourRow":"Calendar-module_weekHourRow__FHcB2","weekEventAnchor":"Calendar-module_weekEventAnchor__nhG4x","currentTimeIndicator":"Calendar-module_currentTimeIndicator__GntOZ"};
+var styles$a = {"calendar":"Calendar-module_calendar__3mIJS","loading":"Calendar-module_loading__59Z9-","loadingSpinner":"Calendar-module_loadingSpinner__7MXqV","header":"Calendar-module_header__cZHNA","navigation":"Calendar-module_navigation__PGkpY","navButton":"Calendar-module_navButton__kOe-w","title":"Calendar-module_title__oJZ7m","controls":"Calendar-module_controls__i1Z38","exportDropdown":"Calendar-module_exportDropdown__yQX4q","exportButton":"Calendar-module_exportButton__dx7--","nightToggle":"Calendar-module_nightToggle__JGvmM","exportMenu":"Calendar-module_exportMenu__-lZ-8","exportMenuItem":"Calendar-module_exportMenuItem__D9MdL","todayButton":"Calendar-module_todayButton__Ac9zc","viewToggle":"Calendar-module_viewToggle__Fhg2t","viewButton":"Calendar-module_viewButton__J2WY6","active":"Calendar-module_active__lIqH-","filterBar":"Calendar-module_filterBar__ZD-lX","filterPill":"Calendar-module_filterPill__f7S8p","filterPillActive":"Calendar-module_filterPillActive__9Wtm9","filterDot":"Calendar-module_filterDot__E1Hp8","weekDays":"Calendar-module_weekDays__4J-8f","withWeekNumbers":"Calendar-module_withWeekNumbers__qbnUY","weekNumberHeader":"Calendar-module_weekNumberHeader__xhKbB","weekDay":"Calendar-module_weekDay__cg8Gr","daysGrid":"Calendar-module_daysGrid__ER0GM","dayCell":"Calendar-module_dayCell__TV-HR","dayNumber":"Calendar-module_dayNumber__ICH-X","today":"Calendar-module_today__eGuUU","events":"Calendar-module_events__qdbs7","event":"Calendar-module_event__Q1Zq3","eventTitle":"Calendar-module_eventTitle__XU7Wd","eventTime":"Calendar-module_eventTime__pMGEB","otherMonth":"Calendar-module_otherMonth__r6VJK","selected":"Calendar-module_selected__5e6h0","compact":"Calendar-module_compact__i0SF3","dots":"Calendar-module_dots__1Q7QR","dot":"Calendar-module_dot__tsCR1","dotMore":"Calendar-module_dotMore__emasD","weekNumberCell":"Calendar-module_weekNumberCell__bydCw","completed":"Calendar-module_completed__B-SHI","completedIcon":"Calendar-module_completedIcon__-oDZ9","moreEvents":"Calendar-module_moreEvents__TIKaT","emptyState":"Calendar-module_emptyState__2fcj7","dayView":"Calendar-module_dayView__PCIos","dayViewHeader":"Calendar-module_dayViewHeader__Gvxx2","timeColumnHeader":"Calendar-module_timeColumnHeader__B0btR","dayColumnHeader":"Calendar-module_dayColumnHeader__Rjqwg","allDayStrip":"Calendar-module_allDayStrip__VOqbV","allDayLabel":"Calendar-module_allDayLabel__2AmyT","allDayList":"Calendar-module_allDayList__6hFSb","dayViewScrollContainer":"Calendar-module_dayViewScrollContainer__84Byq","dayTimelineGrid":"Calendar-module_dayTimelineGrid__r1BNI","hourRow":"Calendar-module_hourRow__U-YN-","hourLabel":"Calendar-module_hourLabel__im84k","hourSlots":"Calendar-module_hourSlots__vbtYy","halfHourSlot":"Calendar-module_halfHourSlot__UWIri","halfHourSlotBottom":"Calendar-module_halfHourSlotBottom__aE5Mo","dayEventAnchor":"Calendar-module_dayEventAnchor__oryAi","weekTimeline":"Calendar-module_weekTimeline__q75EF","weekTimelineHeader":"Calendar-module_weekTimelineHeader__n5i06","weekDayColumnHeader":"Calendar-module_weekDayColumnHeader__u2ghX","weekDayLabel":"Calendar-module_weekDayLabel__i8Rm9","weekDayNumber":"Calendar-module_weekDayNumber__tqFKO","weekTimelineScroll":"Calendar-module_weekTimelineScroll__jesa0","weekTimelineGrid":"Calendar-module_weekTimelineGrid__MxIHF","weekTimeColumn":"Calendar-module_weekTimeColumn__rK4ZV","weekTimeSlot":"Calendar-module_weekTimeSlot__IFPUz","weekHourLabel":"Calendar-module_weekHourLabel__0ANmg","weekDayColumns":"Calendar-module_weekDayColumns__soiyU","weekDayColumn":"Calendar-module_weekDayColumn__sXVu0","weekHourRow":"Calendar-module_weekHourRow__FHcB2","weekEventAnchor":"Calendar-module_weekEventAnchor__nhG4x","currentTimeIndicator":"Calendar-module_currentTimeIndicator__GntOZ"};
 
 var styles$9 = {"wrapper":"DayEventCard-module_wrapper__qvRgl","deleteUnderlay":"DayEventCard-module_deleteUnderlay__fTtuX","card":"DayEventCard-module_card__V9xTi","dragging":"DayEventCard-module_dragging__q19ID","completed":"DayEventCard-module_completed__tq8ol","text":"DayEventCard-module_text__3dWF7","grip":"DayEventCard-module_grip__tmim4","checkIcon":"DayEventCard-module_checkIcon__Ki67j","time":"DayEventCard-module_time__Ojdye","editButton":"DayEventCard-module_editButton__nDi-e"};
 
@@ -3236,6 +3236,7 @@ const downloadEvents = (events, format, filename) => {
 function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDateClickByView, onTimeSlotClick, onEventDrop, onEventComplete, onEventDelete, onEventEdit, viewMode = 'month', initialDate = new Date(), config = {}, className = '', style = {}, loading = false, emptyState, hideHeader = false, compact = false, selectedDate, selectedCategoryId, onCategoryChange, exportFormats }) {
     const [currentDate, setCurrentDate] = React.useState(initialDate);
     const [currentViewMode, setCurrentViewMode] = React.useState(viewMode);
+    const [hideNightHours, setHideNightHours] = React.useState(false);
     const [internalCategoryId, setInternalCategoryId] = React.useState(null);
     const isCategoryControlled = selectedCategoryId !== undefined;
     const activeCategoryId = isCategoryControlled ? selectedCategoryId ?? null : internalCategoryId;
@@ -3259,7 +3260,10 @@ function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDat
         document.addEventListener('mousedown', handler);
         return () => document.removeEventListener('mousedown', handler);
     }, [exportOpen]);
-    const { eventColors = {}, iconRenderer, maxEventsPerDay = 3, mondayStart = false, showWeekNumbers = false, dateFormat = { month: 'long', year: 'numeric' }, locale = 'en-US', dayLabels, monthNames, startHour = 0, endHour = 24, hourHeight = 60, halfHourSlots = false, categories } = config;
+    const { eventColors = {}, iconRenderer, maxEventsPerDay = 3, mondayStart = false, showWeekNumbers = false, dateFormat = { month: 'long', year: 'numeric' }, locale = 'en-US', dayLabels, monthNames, startHour: configStartHour = 0, endHour = 24, hourHeight = 60, halfHourSlots = false, categories } = config;
+    // Effective start hour — when the user toggles "hide night hours", collapse
+    // the pre-8am range in day/week timelines.
+    const startHour = hideNightHours ? Math.max(configStartHour, 8) : configStartHour;
     const filteredEvents = React.useMemo(() => {
         if (!categories || categories.length === 0 || activeCategoryId === null)
             return events;
@@ -3270,7 +3274,7 @@ function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDat
         : ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
     const finalDayLabels = dayLabels || defaultDayLabels;
     const timelineHourHeight = config?.hourHeight ?? 60;
-    const timelineStartHour = config?.startHour ?? 0;
+    const timelineStartHour = startHour;
     const calendarData = React.useMemo(() => {
         const year = currentDate.getFullYear();
         const month = currentDate.getMonth();
@@ -3331,45 +3335,111 @@ function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDat
         }
         return { days, displayTitle };
     }, [currentDate, currentViewMode, mondayStart, locale, dateFormat, monthNames]);
-    // Auto-scroll to current time in day/week views
+    // Auto-scroll to current time in day/week views. Only re-fires when the
+    // user changes view mode or navigates to a different date — not on every
+    // re-render (e.g. after dropping an event), which would snap the scroll.
+    const lastScrollKeyRef = React.useRef('');
     React.useEffect(() => {
-        const targetRef = currentViewMode === 'day' ? dayViewScrollRef :
-            currentViewMode === 'week' ? weekViewScrollRef :
-                null;
-        if (!targetRef?.current)
+        if (currentViewMode !== 'day' && currentViewMode !== 'week')
+            return;
+        const targetRef = currentViewMode === 'day' ? dayViewScrollRef : weekViewScrollRef;
+        if (!targetRef.current)
             return;
         const now = new Date();
-        const isTodayOnScreen = currentViewMode === 'day'
-            ? currentDate.toDateString() === now.toDateString()
-            : calendarData.days.some(d => d.toDateString() === now.toDateString());
+        const isTodayOnScreen = (() => {
+            if (currentViewMode === 'day') {
+                return currentDate.toDateString() === now.toDateString();
+            }
+            const weekStart = new Date(currentDate);
+            const day = weekStart.getDay();
+            const offset = mondayStart ? (day === 0 ? -6 : 1 - day) : -day;
+            weekStart.setDate(weekStart.getDate() + offset);
+            weekStart.setHours(0, 0, 0, 0);
+            const weekEnd = new Date(weekStart);
+            weekEnd.setDate(weekStart.getDate() + 7);
+            return now >= weekStart && now < weekEnd;
+        })();
         if (!isTodayOnScreen)
             return;
+        const key = `${currentViewMode}-${currentDate.toDateString()}`;
+        if (lastScrollKeyRef.current === key)
+            return;
+        lastScrollKeyRef.current = key;
         const minutesFromStart = (now.getHours() - timelineStartHour) * 60 + now.getMinutes();
         const scrollPosition = Math.max(0, (minutesFromStart / 60) * timelineHourHeight - 100);
         setTimeout(() => {
             if (targetRef.current)
                 targetRef.current.scrollTop = scrollPosition;
         }, 0);
-    }, [currentViewMode, currentDate, timelineStartHour, timelineHourHeight, calendarData]);
+    }, [currentViewMode, currentDate, timelineStartHour, timelineHourHeight, mondayStart]);
     const getDayEvents = (day) => {
         const dayEvents = filteredEvents.filter(event => {
             const eventDate = new Date(event.date);
             return eventDate.toDateString() === day.toDateString();
         });
-        // Sort events by time in week view
-        if (currentViewMode === 'week') {
-            return dayEvents.sort((a, b) => {
-                const timeA = a.time ? convertTimeToMinutes(a.time) : 999999;
-                const timeB = b.time ? convertTimeToMinutes(b.time) : 999999;
-                return timeA - timeB;
-            });
-        }
-        return dayEvents;
+        return dayEvents.sort((a, b) => {
+            const timeA = a.time ? convertTimeToMinutes(a.time) : 999999;
+            const timeB = b.time ? convertTimeToMinutes(b.time) : 999999;
+            return timeA - timeB;
+        });
     };
     const convertTimeToMinutes = (time) => {
         const [hours, minutes] = time.split(':').map(Number);
         return hours * 60 + minutes;
     };
+    // Compute side-by-side column layout for events that overlap in time.
+    // Returns a map: eventId -> { col, totalCols } where totalCols is the width
+    // of the group (so a 3-way overlap yields totalCols=3 and col in {0,1,2}).
+    const layoutOverlappingEvents = (events) => {
+        const result = new Map();
+        const timed = events.filter(e => e.time).map(e => {
+            const start = convertTimeToMinutes(e.time);
+            const end = e.endTime ? convertTimeToMinutes(e.endTime) : start + 30;
+            return { event: e, start, end: Math.max(end, start + 1) };
+        });
+        timed.sort((a, b) => a.start - b.start || a.end - b.end);
+        let cluster = [];
+        let clusterEnd = -1;
+        const flushCluster = () => {
+            if (cluster.length === 0)
+                return;
+            const cols = []; // cols[i] = end time of last event in col i
+            const assigned = [];
+            for (const item of cluster) {
+                let placed = false;
+                for (let i = 0; i < cols.length; i++) {
+                    if (cols[i] <= item.start) {
+                        cols[i] = item.end;
+                        assigned.push({ id: item.event.id, col: i });
+                        placed = true;
+                        break;
+                    }
+                }
+                if (!placed) {
+                    cols.push(item.end);
+                    assigned.push({ id: item.event.id, col: cols.length - 1 });
+                }
+            }
+            const totalCols = cols.length;
+            for (const a of assigned)
+                result.set(a.id, { col: a.col, totalCols });
+            cluster = [];
+            clusterEnd = -1;
+        };
+        for (const item of timed) {
+            if (cluster.length === 0 || item.start < clusterEnd) {
+                cluster.push(item);
+                clusterEnd = Math.max(clusterEnd, item.end);
+            }
+            else {
+                flushCluster();
+                cluster.push(item);
+                clusterEnd = item.end;
+            }
+        }
+        flushCluster();
+        return result;
+    };
     const handlePrevious = () => {
         const newDate = new Date(currentDate);
         if (currentViewMode === 'week') {
@@ -3474,7 +3544,7 @@ function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDat
                             })] })), jsxRuntime.jsxs("div", { className: styles$a.controls, children: [exportFormats && exportFormats.length > 0 && (jsxRuntime.jsxs("div", { className: styles$a.exportDropdown, ref: exportRef, children: [jsxRuntime.jsx("button", { type: "button", className: styles$a.exportButton, onClick: () => setExportOpen(v => !v), "aria-haspopup": "menu", "aria-expanded": exportOpen, "aria-label": "Export events", title: "Export events", children: jsxRuntime.jsx(lucideReact.Download, { size: 16 }) }), exportOpen && (jsxRuntime.jsx("div", { className: styles$a.exportMenu, role: "menu", children: exportFormats.map(format => (jsxRuntime.jsx("button", { type: "button", role: "menuitem", className: styles$a.exportMenuItem, onClick: () => {
                                                 downloadEvents(filteredEvents, format);
                                                 setExportOpen(false);
-                                            }, children: format.toUpperCase() }, format))) }))] })), jsxRuntime.jsx("button", { onClick: handleToday, className: styles$a.todayButton, children: "Today" }), jsxRuntime.jsxs("div", { className: styles$a.viewToggle, children: [jsxRuntime.jsx("button", { className: `${styles$a.viewButton} ${currentViewMode === 'month' ? styles$a.active : ''}`, onClick: () => setCurrentViewMode('month'), children: "Month" }), jsxRuntime.jsx("button", { className: `${styles$a.viewButton} ${currentViewMode === 'week' ? styles$a.active : ''}`, onClick: () => setCurrentViewMode('week'), children: "Week" }), jsxRuntime.jsx("button", { className: `${styles$a.viewButton} ${currentViewMode === 'day' ? styles$a.active : ''}`, onClick: () => setCurrentViewMode('day'), children: "Day" })] })] })] })), currentViewMode === 'month' && (jsxRuntime.jsxs("div", { className: `${styles$a.weekDays} ${showWeekNumbers ? styles$a.withWeekNumbers : ''}`, children: [showWeekNumbers && jsxRuntime.jsx("div", { className: styles$a.weekNumberHeader, children: "Wk" }), finalDayLabels.map((day) => (jsxRuntime.jsx("div", { className: styles$a.weekDay, children: day }, day)))] })), currentViewMode === 'day' ? (
+                                            }, children: format.toUpperCase() }, format))) }))] })), (currentViewMode === 'day' || currentViewMode === 'week') && (jsxRuntime.jsx("button", { type: "button", className: styles$a.nightToggle, onClick: () => setHideNightHours(v => !v), "aria-pressed": hideNightHours, title: hideNightHours ? 'Show night hours' : 'Hide night hours (00:00–08:00)', "aria-label": hideNightHours ? 'Show night hours' : 'Hide night hours', children: hideNightHours ? jsxRuntime.jsx(lucideReact.Sun, { size: 16 }) : jsxRuntime.jsx(lucideReact.Moon, { size: 16 }) })), jsxRuntime.jsx("button", { onClick: handleToday, className: styles$a.todayButton, children: "Today" }), jsxRuntime.jsxs("div", { className: styles$a.viewToggle, children: [jsxRuntime.jsx("button", { className: `${styles$a.viewButton} ${currentViewMode === 'month' ? styles$a.active : ''}`, onClick: () => setCurrentViewMode('month'), children: "Month" }), jsxRuntime.jsx("button", { className: `${styles$a.viewButton} ${currentViewMode === 'week' ? styles$a.active : ''}`, onClick: () => setCurrentViewMode('week'), children: "Week" }), jsxRuntime.jsx("button", { className: `${styles$a.viewButton} ${currentViewMode === 'day' ? styles$a.active : ''}`, onClick: () => setCurrentViewMode('day'), children: "Day" })] })] })] })), currentViewMode === 'month' && (jsxRuntime.jsxs("div", { className: `${styles$a.weekDays} ${showWeekNumbers ? styles$a.withWeekNumbers : ''}`, children: [showWeekNumbers && jsxRuntime.jsx("div", { className: styles$a.weekNumberHeader, children: "Wk" }), finalDayLabels.map((day) => (jsxRuntime.jsx("div", { className: styles$a.weekDay, children: day }, day)))] })), currentViewMode === 'day' ? (
             // Day view layout — positioned events with duration, all-day strip, now-line
             (() => {
                 const dayEvents = getDayEvents(currentDate);
@@ -3497,6 +3567,7 @@ function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDat
                     const d = eventMinutes(event.endTime) - eventMinutes(event.time);
                     return d > 0 ? d : 30;
                 };
+                const dayLayout = layoutOverlappingEvents(scheduled);
                 const handleSlotClick = (hour, minute) => {
                     if (onTimeSlotClick) {
                         const slotDate = new Date(currentDate);
@@ -3528,7 +3599,15 @@ function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDat
                                         const top = (h - startHour) * hourHeight + (m / 60) * hourHeight;
                                         const duration = eventDuration(event);
                                         const height = Math.max(24, (duration / 60) * hourHeight - 2);
-                                        return (jsxRuntime.jsx("div", { className: styles$a.dayEventAnchor, style: { top, height }, onClick: (e) => e.stopPropagation(), children: jsxRuntime.jsx(DayEventCard, { event: event, color: getEventColor(event), textColor: getEventTextColor(event), onComplete: onEventComplete ?? (onEventClick ? handleEventClick : undefined), onEdit: onEventEdit, onDelete: onEventDelete, onDragEnd: onEventDrop ? (clientY) => handleEventDragEnd(event, clientY) : undefined }) }, event.id));
+                                        const lane = dayLayout.get(event.id);
+                                        const totalCols = lane?.totalCols ?? 1;
+                                        const col = lane?.col ?? 0;
+                                        return (jsxRuntime.jsx("div", { className: styles$a.dayEventAnchor, style: {
+                                                top,
+                                                height,
+                                                '--lane-col': col,
+                                                '--lane-total': totalCols,
+                                            }, onClick: (e) => e.stopPropagation(), children: jsxRuntime.jsx(DayEventCard, { event: event, color: getEventColor(event), textColor: getEventTextColor(event), onComplete: onEventComplete ?? (onEventClick ? handleEventClick : undefined), onEdit: onEventEdit, onDelete: onEventDelete, onDragEnd: onEventDrop ? (clientY) => handleEventDragEnd(event, clientY) : undefined }) }, event.id));
                                     }), showNow && (jsxRuntime.jsx("div", { className: styles$a.currentTimeIndicator, style: { top: `${nowOffset}px` } }))] }) })] }));
             })()) : currentViewMode === 'week' ? (
             // Week view layout — 7 side-by-side day timelines. Drag events across
@@ -3588,12 +3667,21 @@ function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDat
                                 })] }), jsxRuntime.jsx("div", { className: styles$a.weekTimelineScroll, ref: weekViewScrollRef, children: jsxRuntime.jsxs("div", { className: styles$a.weekTimelineGrid, style: { height: timelineHeight }, children: [jsxRuntime.jsx("div", { className: styles$a.weekTimeColumn, children: hours.map(hour => (jsxRuntime.jsx("div", { className: styles$a.weekTimeSlot, style: { height: hourHeight }, children: jsxRuntime.jsxs("span", { className: styles$a.weekHourLabel, children: [hour.toString().padStart(2, '0'), ":00"] }) }, hour))) }), jsxRuntime.jsx("div", { className: styles$a.weekDayColumns, children: days.map(day => {
                                             const dayEvents = getDayEvents(day).filter(e => !e.allDay && e.time);
                                             const dayIsToday = day.toDateString() === now.toDateString();
+                                            const dayLayout = layoutOverlappingEvents(dayEvents);
                                             return (jsxRuntime.jsxs("div", { className: styles$a.weekDayColumn, children: [hours.map(hour => (jsxRuntime.jsx("div", { className: styles$a.weekHourRow, style: { height: hourHeight }, children: halfHourSlots ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: styles$a.halfHourSlot, onClick: () => handleWeekSlotClick(day, hour, 0) }), jsxRuntime.jsx("div", { className: `${styles$a.halfHourSlot} ${styles$a.halfHourSlotBottom}`, onClick: () => handleWeekSlotClick(day, hour, 30) })] })) : (jsxRuntime.jsx("div", { className: styles$a.halfHourSlot, onClick: () => handleWeekSlotClick(day, hour, 0) })) }, hour))), dayEvents.map(event => {
                                                         const [h, m] = event.time.split(':').map(Number);
                                                         const top = (h - startHour) * hourHeight + (m / 60) * hourHeight;
                                                         const duration = eventDuration(event);
                                                         const height = Math.max(24, (duration / 60) * hourHeight - 2);
-                                                        return (jsxRuntime.jsx("div", { className: styles$a.weekEventAnchor, style: { top, height }, onClick: (e) => e.stopPropagation(), children: jsxRuntime.jsx(DayEventCard, { event: event, color: getEventColor(event), textColor: getEventTextColor(event), onComplete: onEventComplete ?? (onEventClick ? handleEventClick : undefined), onEdit: onEventEdit, onDelete: onEventDelete, onDragEnd: onEventDrop ? (cy, cx) => handleWeekDragEnd(event, cy, cx) : undefined }) }, event.id));
+                                                        const lane = dayLayout.get(event.id);
+                                                        const totalCols = lane?.totalCols ?? 1;
+                                                        const col = lane?.col ?? 0;
+                                                        return (jsxRuntime.jsx("div", { className: styles$a.weekEventAnchor, style: {
+                                                                top,
+                                                                height,
+                                                                '--lane-col': col,
+                                                                '--lane-total': totalCols,
+                                                            }, onClick: (e) => e.stopPropagation(), children: jsxRuntime.jsx(DayEventCard, { event: event, color: getEventColor(event), textColor: getEventTextColor(event), onComplete: onEventComplete ?? (onEventClick ? handleEventClick : undefined), onEdit: onEventEdit, onDelete: onEventDelete, onDragEnd: onEventDrop ? (cy, cx) => handleWeekDragEnd(event, cy, cx) : undefined }) }, event.id));
                                                     }), dayIsToday && showNow && (jsxRuntime.jsx("div", { className: styles$a.currentTimeIndicator, style: { top: `${nowOffset}px`, left: 0 } }))] }, day.toISOString()));
                                         }) })] }) })] }));
             })()) : ((() => {