@stfrigerio/sito-template 0.1.33 → 0.1.34

package/dist/index.js

@@ -2690,7 +2690,7 @@ var styles$8 = {"calendar":"Calendar-module_calendar__3mIJS","loading":"Calendar
  *   onEventClick={handleEventClick}
  * />
  */
-function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDateClickByView, viewMode = 'month', initialDate = new Date(), config = {}, className = '', style = {}, loading = false, emptyState, hideHeader = false }) {
+function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDateClickByView, onTimeSlotClick, viewMode = 'month', initialDate = new Date(), config = {}, className = '', style = {}, loading = false, emptyState, hideHeader = false }) {
     const [currentDate, setCurrentDate] = React.useState(initialDate);
     const [currentViewMode, setCurrentViewMode] = React.useState(viewMode);
     const dayViewScrollRef = React.useRef(null);
@@ -2883,6 +2883,16 @@ function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDat
             onDateClick(date);
         }
     };
+    const handleTimeSlotClick = (hour) => {
+        if (onTimeSlotClick) {
+            // Create a date object with the current date and the clicked hour
+            const slotDate = new Date(currentDate);
+            slotDate.setHours(hour, 0, 0, 0);
+            // Format time as HH:00
+            const timeString = `${hour.toString().padStart(2, '0')}:00`;
+            onTimeSlotClick(slotDate, hour, timeString);
+        }
+    };
     const isToday = (date) => {
         const today = new Date();
         return date.toDateString() === today.toDateString();
@@ -2917,7 +2927,13 @@ function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDat
                                             const eventHour = parseInt(event.time.split(':')[0]);
                                             return eventHour === hour;
                                         });
-                                        return (jsxRuntime.jsxs("div", { className: styles$8.hourSlot, children: [jsxRuntime.jsx("div", { className: styles$8.hourLine }), hourEvents.map((event, eventIndex) => (jsxRuntime.jsxs(framerMotion.motion.div, { className: `${styles$8.dayEvent} ${event.status === 'completed' ? styles$8.completed : ''}`, style: {
+                                        return (jsxRuntime.jsxs("div", { className: styles$8.hourSlot, onClick: (e) => {
+                                                // Only trigger if clicking on the slot itself, not on an event
+                                                if (e.target === e.currentTarget ||
+                                                    e.target.classList.contains(styles$8.hourLine)) {
+                                                    handleTimeSlotClick(hour);
+                                                }
+                                            }, style: { cursor: 'pointer' }, children: [jsxRuntime.jsx("div", { className: styles$8.hourLine }), hourEvents.map((event, eventIndex) => (jsxRuntime.jsxs(framerMotion.motion.div, { className: `${styles$8.dayEvent} ${event.status === 'completed' ? styles$8.completed : ''}`, style: {
                                                         backgroundColor: getEventColor(event),
                                                         color: getEventTextColor(event),
                                                         opacity: event.status === 'completed' ? 0.7 : 1