calendarkit-pro 1.3.0 → 1.3.1

package/dist/index.mjs

@@ -94,7 +94,8 @@ var CalendarHeader = ({
       variant: "ghost",
       size: "icon",
       className: "text-muted-foreground hover:text-foreground hover:bg-accent/80 rounded-xl h-10 w-10 hidden md:inline-flex transition-all duration-200",
-      onClick: onMenuClick
+      onClick: onMenuClick,
+      "aria-label": translations.toggleSidebar
     },
     /* @__PURE__ */ React2.createElement(Menu, { className: "h-5 w-5" })
   ), /* @__PURE__ */ React2.createElement(
@@ -111,7 +112,8 @@ var CalendarHeader = ({
       variant: "ghost",
       size: "icon",
       onClick: onPrev,
-      className: "rounded-lg h-8 w-8 hover:bg-background/80 transition-all duration-200"
+      className: "rounded-lg h-8 w-8 hover:bg-background/80 transition-all duration-200",
+      "aria-label": translations.previous
     },
     /* @__PURE__ */ React2.createElement(ChevronLeft, { className: "h-4 w-4 text-muted-foreground" })
   ), /* @__PURE__ */ React2.createElement(
@@ -120,7 +122,8 @@ var CalendarHeader = ({
       variant: "ghost",
       size: "icon",
       onClick: onNext,
-      className: "rounded-lg h-8 w-8 hover:bg-background/80 transition-all duration-200"
+      className: "rounded-lg h-8 w-8 hover:bg-background/80 transition-all duration-200",
+      "aria-label": translations.next
     },
     /* @__PURE__ */ React2.createElement(ChevronRight, { className: "h-4 w-4 text-muted-foreground" })
   )), /* @__PURE__ */ React2.createElement("div", { className: "ml-2 md:ml-4" }, /* @__PURE__ */ React2.createElement("h2", { className: "text-lg md:text-xl font-semibold text-foreground whitespace-nowrap capitalize tracking-tight" }, format(currentDate, "MMMM yyyy", { locale }))))), /* @__PURE__ */ React2.createElement("div", { className: "flex items-center gap-2 md:gap-3 w-full md:w-auto justify-end" }, onLanguageChange && language && /* @__PURE__ */ React2.createElement(
@@ -129,6 +132,7 @@ var CalendarHeader = ({
       variant: "ghost",
       size: "sm",
       onClick: () => onLanguageChange(language === "en" ? "fr" : "en"),
+      "aria-label": translations.switchLanguage,
       className: "h-9 px-3 rounded-xl text-xs font-semibold text-muted-foreground hover:text-foreground hover:bg-accent/80 transition-all duration-200 uppercase tracking-wider"
     },
     language
@@ -138,7 +142,8 @@ var CalendarHeader = ({
       variant: "ghost",
       size: "icon",
       className: "rounded-xl h-9 w-9 hover:bg-accent/80 transition-all duration-200",
-      onClick: onThemeToggle
+      onClick: onThemeToggle,
+      "aria-label": translations.toggleTheme
     },
     isDarkMode ? /* @__PURE__ */ React2.createElement(Sun, { className: "h-4 w-4 text-amber-500" }) : /* @__PURE__ */ React2.createElement(Moon, { className: "h-4 w-4 text-muted-foreground" })
   ), !hideViewSwitcher && /* @__PURE__ */ React2.createElement("div", { className: "flex items-center bg-muted/50 backdrop-blur-sm rounded-xl p-1" }, viewConfig.map(({ key, icon: Icon }) => /* @__PURE__ */ React2.createElement(
@@ -148,6 +153,8 @@ var CalendarHeader = ({
       variant: "ghost",
       size: "sm",
       onClick: () => onViewChange(key),
+      "aria-pressed": view === key,
+      "aria-label": translations[key],
       className: cn(
         "h-8 px-3 text-xs rounded-lg transition-all duration-200 gap-1.5",
         view === key ? "bg-background shadow-sm text-foreground font-medium border-[0.5px] border-border/50" : "text-muted-foreground hover:text-foreground hover:bg-background/50"
@@ -192,7 +199,8 @@ var MiniCalendar = ({
   onDateChange,
   onViewChange,
   className,
-  locale
+  locale,
+  labels
 }) => {
   const [viewDate, setViewDate] = React3.useState(currentDate);
   React3.useEffect(() => {
@@ -230,7 +238,7 @@ var MiniCalendar = ({
       size: "icon",
       className: "h-7 w-7 rounded-md hover:bg-background/80 transition-all",
       onClick: handlePrev,
-      "aria-label": "Previous month"
+      "aria-label": labels?.previousMonth || "Previous month"
     },
     /* @__PURE__ */ React3.createElement(ChevronLeft2, { className: "h-4 w-4" })
   ), /* @__PURE__ */ React3.createElement(
@@ -240,7 +248,7 @@ var MiniCalendar = ({
       size: "icon",
       className: "h-7 w-7 rounded-md hover:bg-background/80 transition-all",
       onClick: handleNext,
-      "aria-label": "Next month"
+      "aria-label": labels?.nextMonth || "Next month"
     },
     /* @__PURE__ */ React3.createElement(ChevronRight2, { className: "h-4 w-4" })
   ))), /* @__PURE__ */ React3.createElement("div", { className: "grid grid-cols-7 gap-y-2 text-center mb-2" }, weekDays.map((day, i) => /* @__PURE__ */ React3.createElement("div", { key: `${day}-${i}`, className: "text-[10px] text-muted-foreground/70 font-semibold uppercase" }, day))), /* @__PURE__ */ React3.createElement("div", { className: "grid grid-cols-7 gap-y-1 text-center" }, days.map((day) => {
@@ -340,7 +348,45 @@ var en = {
   allCaughtUp: "All caught up!",
   noEventsScheduled: "No events scheduled",
   noUpcoming: "Your schedule is clear",
-  noUpcomingHint: "No upcoming events to show. Create a new event to start planning."
+  noUpcomingHint: "No upcoming events to show. Create a new event to start planning.",
+  newEvent: "New Event",
+  saveChanges: "Save Changes",
+  close: "Close",
+  noTitle: "(No title)",
+  openInMaps: "Open in maps",
+  notesLabel: "Notes",
+  addNotes: "Add description or notes...",
+  attachments: "Attachments",
+  reminders: "Reminders",
+  add: "Add",
+  calendar: "Calendar",
+  select: "Select",
+  addLocation: "Add location",
+  guestSingular: "Guest",
+  addGuestPlaceholder: "Add a guest email and press Enter",
+  invalidEmail: "Enter a valid email address",
+  removeGuest: "Remove {email}",
+  reminderAtTime: "At time of event",
+  reminderMinutes: "{n} minutes before",
+  reminderHour: "1 hour before",
+  reminderHours: "{n} hours before",
+  reminderDay: "1 day before",
+  reminderDays: "{n} days before",
+  reminderWeek: "1 week before",
+  removeReminder: "Remove reminder",
+  durationMinutes: "{n} min",
+  durationHours: "{n} hr",
+  durationHoursMinutes: "{h} hr {m} min",
+  moreEvents: "+{n} more",
+  idLabel: "ID: {id}",
+  previous: "Previous",
+  next: "Next",
+  previousMonth: "Previous month",
+  nextMonth: "Next month",
+  toggleSidebar: "Toggle sidebar",
+  toggleTheme: "Toggle dark mode",
+  switchLanguage: "Switch language",
+  eventColor: "Event color"
 };
 var fr = {
   today: "Aujourd'hui",
@@ -409,7 +455,45 @@ var fr = {
   allCaughtUp: "Tout est \xE0 jour !",
   noEventsScheduled: "Aucun \xE9v\xE9nement pr\xE9vu",
   noUpcoming: "Votre planning est libre",
-  noUpcomingHint: "Aucun \xE9v\xE9nement \xE0 venir. Cr\xE9ez un nouvel \xE9v\xE9nement pour commencer \xE0 planifier."
+  noUpcomingHint: "Aucun \xE9v\xE9nement \xE0 venir. Cr\xE9ez un nouvel \xE9v\xE9nement pour commencer \xE0 planifier.",
+  newEvent: "Nouvel \xE9v\xE9nement",
+  saveChanges: "Enregistrer",
+  close: "Fermer",
+  noTitle: "(Sans titre)",
+  openInMaps: "Ouvrir dans Maps",
+  notesLabel: "Notes",
+  addNotes: "Ajouter une description ou des notes\u2026",
+  attachments: "Pi\xE8ces jointes",
+  reminders: "Rappels",
+  add: "Ajouter",
+  calendar: "Calendrier",
+  select: "Choisir",
+  addLocation: "Ajouter un lieu",
+  guestSingular: "Invit\xE9",
+  addGuestPlaceholder: "Ajoutez l'e-mail d'un invit\xE9 puis Entr\xE9e",
+  invalidEmail: "Saisissez une adresse e-mail valide",
+  removeGuest: "Retirer {email}",
+  reminderAtTime: "Au moment de l'\xE9v\xE9nement",
+  reminderMinutes: "{n} minutes avant",
+  reminderHour: "1 heure avant",
+  reminderHours: "{n} heures avant",
+  reminderDay: "1 jour avant",
+  reminderDays: "{n} jours avant",
+  reminderWeek: "1 semaine avant",
+  removeReminder: "Supprimer le rappel",
+  durationMinutes: "{n} min",
+  durationHours: "{n} h",
+  durationHoursMinutes: "{h} h {m} min",
+  moreEvents: "+{n} de plus",
+  idLabel: "ID : {id}",
+  previous: "Pr\xE9c\xE9dent",
+  next: "Suivant",
+  previousMonth: "Mois pr\xE9c\xE9dent",
+  nextMonth: "Mois suivant",
+  toggleSidebar: "Afficher ou masquer la barre lat\xE9rale",
+  toggleTheme: "Basculer le th\xE8me sombre",
+  switchLanguage: "Changer de langue",
+  eventColor: "Couleur de l'\xE9v\xE9nement"
 };
 
 // src/core/format.ts
@@ -452,7 +536,18 @@ function timeZoneAbbreviation(date, timeZone) {
   }
 }
 function resolveTranslations(language, overrides) {
-  return { ...language === "fr" ? fr : en, ...overrides };
+  const defined = Object.fromEntries(Object.entries(overrides ?? {}).filter(([, value]) => value !== void 0));
+  return { ...language === "fr" ? fr : en, ...defined };
+}
+function interpolate(template, values) {
+  return template.replace(/\{(\w+)\}/g, (match, key) => key in values ? String(values[key]) : match);
+}
+
+// src/core/color.ts
+var SAFE_COLOR = /^[#\w\s%.,/()+-]+$/;
+var FORBIDDEN = /url\(|expression\(/i;
+function safeColor(value, fallback) {
+  return value && SAFE_COLOR.test(value.trim()) && !FORBIDDEN.test(value) ? value.trim() : fallback;
 }
 
 // src/components/Sidebar.tsx
@@ -480,12 +575,6 @@ var Sidebar = ({
     const timer = setInterval(() => setNow(/* @__PURE__ */ new Date()), 6e4);
     return () => clearInterval(timer);
   }, []);
-  const defaultCalendars = [
-    { id: "1", label: "My Calendar", color: "#3b82f6", active: true },
-    { id: "2", label: "Birthdays", color: "#10b981", active: true },
-    { id: "3", label: "Tasks", color: "#6366f1", active: true }
-  ];
-  const displayCalendars = calendars || defaultCalendars;
   const getAcronym = (tz) => !tz || !now ? "LOC" : timeZoneAbbreviation(now, tz);
   const timezones = [
     { value: "", label: translations?.localTime || "Local Time", acronym: "LOC" },
@@ -535,7 +624,16 @@ var Sidebar = ({
     },
     /* @__PURE__ */ React4.createElement(Plus, { className: "w-5 h-5" }),
     /* @__PURE__ */ React4.createElement("span", { className: "text-sm" }, translations?.create || "Create")
-  )), /* @__PURE__ */ React4.createElement(MiniCalendar, { currentDate, onDateChange, onViewChange, locale }), /* @__PURE__ */ React4.createElement("div", { className: "flex-1 px-4 space-y-5 mt-5" }, /* @__PURE__ */ React4.createElement("div", { className: "bg-muted/20 rounded-2xl p-3 border-[0px] border-border/30" }, /* @__PURE__ */ React4.createElement(
+  )), /* @__PURE__ */ React4.createElement(
+    MiniCalendar,
+    {
+      currentDate,
+      onDateChange,
+      onViewChange,
+      locale,
+      labels: { previousMonth: translations?.previousMonth, nextMonth: translations?.nextMonth }
+    }
+  ), /* @__PURE__ */ React4.createElement("div", { className: "flex-1 px-4 space-y-5 mt-5" }, calendars && calendars.length > 0 && /* @__PURE__ */ React4.createElement("div", { className: "bg-muted/20 rounded-2xl p-3 border-[0px] border-border/30" }, /* @__PURE__ */ React4.createElement(
     "div",
     {
       className: "flex items-center justify-between cursor-pointer hover:bg-accent/50 p-2 -m-1 rounded-xl mb-2 transition-all duration-200",
@@ -543,41 +641,40 @@ var Sidebar = ({
     },
     /* @__PURE__ */ React4.createElement("span", { className: "text-sm font-semibold text-foreground" }, translations?.calendars || "Calendars"),
     /* @__PURE__ */ React4.createElement(ChevronDown, { className: cn("w-4 h-4 text-muted-foreground transition-transform duration-200", calendarsOpen && "rotate-180") })
-  ), calendarsOpen && /* @__PURE__ */ React4.createElement("div", { className: "space-y-1" }, displayCalendars.map((cal) => /* @__PURE__ */ React4.createElement(
+  ), calendarsOpen && /* @__PURE__ */ React4.createElement("div", { className: "space-y-1" }, calendars.map((cal) => /* @__PURE__ */ React4.createElement(
     "div",
     {
       key: cal.id,
       className: "flex items-center gap-3 py-2 px-2 hover:bg-accent/60 rounded-xl cursor-pointer group transition-all duration-200",
       onClick: () => onCalendarToggle?.(cal.id, !(cal.active ?? true))
     },
-    /* @__PURE__ */ React4.createElement("div", { className: "relative flex items-center justify-center" }, /* @__PURE__ */ React4.createElement(
-      "input",
+    /* @__PURE__ */ React4.createElement(
+      "div",
       {
-        type: "checkbox",
-        checked: cal.active ?? true,
-        onChange: (e) => {
-          e.stopPropagation();
-          onCalendarToggle?.(cal.id, e.target.checked);
-        },
-        className: "peer h-5 w-5 rounded-md border-2 border-border/60 cursor-pointer appearance-none checked:border-transparent transition-all duration-200",
-        style: { "--primary-color": cal.color },
-        "data-cal-id": cal.id
-      }
-    ), /* @__PURE__ */ React4.createElement("div", { className: "absolute inset-0 flex items-center justify-center pointer-events-none opacity-0 peer-checked:opacity-100 transition-opacity" }, /* @__PURE__ */ React4.createElement("svg", { className: "w-3.5 h-3.5 text-white", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 3 }, /* @__PURE__ */ React4.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M5 13l4 4L19 7" }))), /* @__PURE__ */ React4.createElement("style", null, `
-                      input[type="checkbox"][data-cal-id="${cal.id}"]:checked {
-                        background-color: ${cal.color} !important;
-                        border-color: ${cal.color} !important;
-                      }
-                      input[type="checkbox"][data-cal-id="${cal.id}"]:focus {
-                        --tw-ring-color: ${cal.color}40 !important;
-                      }
-                    `)),
+        className: "relative flex items-center justify-center",
+        style: { "--cal-color": safeColor(cal.color, "hsl(var(--primary))") }
+      },
+      /* @__PURE__ */ React4.createElement(
+        "input",
+        {
+          type: "checkbox",
+          checked: cal.active ?? true,
+          onChange: (e) => {
+            e.stopPropagation();
+            onCalendarToggle?.(cal.id, e.target.checked);
+          },
+          "aria-label": cal.label,
+          className: "peer h-5 w-5 rounded-md border-2 border-border/60 cursor-pointer appearance-none checked:border-transparent checked:bg-[var(--cal-color)] focus:ring-2 focus:ring-[var(--cal-color)] transition-all duration-200"
+        }
+      ),
+      /* @__PURE__ */ React4.createElement("div", { className: "absolute inset-0 flex items-center justify-center pointer-events-none opacity-0 peer-checked:opacity-100 transition-opacity" }, /* @__PURE__ */ React4.createElement("svg", { className: "w-3.5 h-3.5 text-white", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 3 }, /* @__PURE__ */ React4.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M5 13l4 4L19 7" })))
+    ),
     /* @__PURE__ */ React4.createElement("div", { className: "flex items-center gap-2 flex-1 min-w-0" }, /* @__PURE__ */ React4.createElement("span", { className: "text-sm text-foreground/90 truncate font-medium" }, cal.label)),
     /* @__PURE__ */ React4.createElement(
       "div",
       {
         className: "w-2 h-2 rounded-full opacity-60 group-hover:opacity-100 transition-opacity",
-        style: { backgroundColor: cal.color }
+        style: { backgroundColor: safeColor(cal.color, "hsl(var(--primary))") }
       }
     )
   ))))), /* @__PURE__ */ React4.createElement("div", { className: "mt-auto px-4 pt-5" }, /* @__PURE__ */ React4.createElement("div", { className: "bg-muted/20 rounded-2xl p-3" }, /* @__PURE__ */ React4.createElement("div", { className: "flex items-center gap-2 mb-3" }, /* @__PURE__ */ React4.createElement("div", { className: "p-1.5 bg-primary/10 rounded-lg" }, /* @__PURE__ */ React4.createElement(Globe, { className: "w-4 h-4 text-primary" })), /* @__PURE__ */ React4.createElement("span", { className: "text-sm font-semibold text-foreground" }, translations?.timezone || "Timezone")), /* @__PURE__ */ React4.createElement("div", { className: "relative" }, /* @__PURE__ */ React4.createElement(
@@ -864,7 +961,7 @@ var DroppableCell = React6.memo(
 );
 
 // src/views/MonthView.tsx
-var EventItem = React7.memo(({ event, onEventClick }) => /* @__PURE__ */ React7.createElement(DraggableEvent, { event }, /* @__PURE__ */ React7.createElement(
+var EventItem = React7.memo(({ event, onEventClick, onEventContextMenu }) => /* @__PURE__ */ React7.createElement(DraggableEvent, { event }, /* @__PURE__ */ React7.createElement(
   "div",
   {
     className: cn(
@@ -880,7 +977,8 @@ var EventItem = React7.memo(({ event, onEventClick }) => /* @__PURE__ */ React7.
     onClick: (e) => {
       e.stopPropagation();
       onEventClick?.(event);
-    }
+    },
+    onContextMenu: onEventContextMenu ? (e) => onEventContextMenu(event, e) : void 0
   },
   /* @__PURE__ */ React7.createElement("span", { className: "font-medium" }, event.title)
 )));
@@ -891,7 +989,9 @@ var MonthView = ({
   onEventClick,
   onDateClick,
   timezone,
-  locale
+  locale,
+  translations,
+  onEventContextMenu
 }) => {
   const weekStartsOn = resolveWeekStartsOn(locale, 1);
   const days = useMemo(() => getMonthGrid(currentDate, weekStartsOn), [currentDate, weekStartsOn]);
@@ -927,7 +1027,19 @@ var MonthView = ({
         "text-sm font-semibold w-7 h-7 flex items-center justify-center rounded-full transition-all duration-200",
         isSameDay3(day, today) ? "bg-primary text-primary-foreground shadow-md shadow-primary/30" : "group-hover:bg-accent"
       ) }, format7(day, "d", { locale })), dayEvents.length > 0 && /* @__PURE__ */ React7.createElement("div", { className: "text-[10px] font-medium text-muted-foreground/60 bg-muted/50 px-1.5 py-0.5 rounded-full" }, dayEvents.length)),
-      /* @__PURE__ */ React7.createElement("div", { className: "flex-1 flex flex-col gap-1 scrollbar-hide overflow-y-auto overflow-x-hidden" }, dayEvents.slice(0, 4).map((event) => /* @__PURE__ */ React7.createElement(EventItem, { key: `${event.id}-${dayKey2}`, event, onEventClick })), dayEvents.length > 4 && /* @__PURE__ */ React7.createElement("div", { className: "text-[10px] text-primary font-semibold text-center py-1 px-2 rounded-md bg-primary/5 hover:bg-primary/10 cursor-pointer transition-colors" }, "+", dayEvents.length - 4, " more"))
+      /* @__PURE__ */ React7.createElement("div", { className: "flex-1 flex flex-col gap-1 scrollbar-hide overflow-y-auto overflow-x-hidden" }, dayEvents.slice(0, 4).map((event) => /* @__PURE__ */ React7.createElement(EventItem, { key: `${event.id}-${dayKey2}`, event, onEventClick, onEventContextMenu })), dayEvents.length > 4 && // U7: "+N more" opens the day instead of doing nothing.
+      /* @__PURE__ */ React7.createElement(
+        "button",
+        {
+          type: "button",
+          className: "text-[10px] text-primary font-semibold text-center py-1 px-2 rounded-md bg-primary/5 hover:bg-primary/10 cursor-pointer transition-colors",
+          onClick: (e) => {
+            e.stopPropagation();
+            onDateClick?.(day);
+          }
+        },
+        interpolate(translations?.moreEvents || "+{n} more", { n: dayEvents.length - 4 })
+      ))
     );
   }))));
 };
@@ -1110,7 +1222,8 @@ var WeekViewImpl = ({
   onEventResize,
   timezone,
   locale,
-  readonly
+  readonly,
+  onEventContextMenu
 }) => {
   const weekDays = React9.useMemo(
     () => getWeekDays(currentDate, resolveWeekStartsOn(locale, 1)),
@@ -1260,6 +1373,7 @@ var WeekViewImpl = ({
                     e.stopPropagation();
                     onEventClick?.(event);
                   },
+                  onContextMenu: onEventContextMenu ? (e) => onEventContextMenu(event, e) : void 0,
                   title: columns > 1 ? `${event.title} (${column + 1}/${columns})` : void 0
                 },
                 /* @__PURE__ */ React9.createElement("div", { className: "flex flex-col h-full overflow-hidden w-full" }, /* @__PURE__ */ React9.createElement("div", { className: cn(
@@ -1304,7 +1418,9 @@ var DayViewImpl = ({
   onEventResize,
   timezone,
   locale,
-  readonly
+  readonly,
+  onEventContextMenu,
+  translations
 }) => {
   const visibleRange = React10.useMemo(() => {
     const start = startOfDay3(currentDate);
@@ -1328,7 +1444,7 @@ var DayViewImpl = ({
   const zonedNow = toDisplay(now, timezone);
   const nowTop = minutesSinceDisplayMidnight(now, timezone) / 60 * HOUR_HEIGHT2;
   const formats = timeFormats(locale);
-  return /* @__PURE__ */ React10.createElement("div", { className: "flex flex-col h-full bg-background border-[0.5px] border-border/50 rounded-2xl overflow-hidden shadow-sm" }, /* @__PURE__ */ React10.createElement("div", { className: "px-6 py-4 border-b-[0.5px] border-border/50 bg-gradient-to-r from-muted/20 via-background to-muted/20 text-center shrink-0" }, /* @__PURE__ */ React10.createElement("div", { className: "flex items-center justify-center gap-3" }, /* @__PURE__ */ React10.createElement("h2", { className: "text-xl font-semibold capitalize text-foreground" }, format9(currentDate, "EEEE, MMMM d, yyyy", { locale })), isToday2 && /* @__PURE__ */ React10.createElement("span", { className: "text-xs font-semibold bg-primary text-primary-foreground px-3 py-1 rounded-full shadow-md shadow-primary/20" }, "Today"))), /* @__PURE__ */ React10.createElement("div", { ref: scrollContainerRef, className: "flex-1 overflow-y-auto relative" }, /* @__PURE__ */ React10.createElement("div", { className: "flex relative", style: { height: HOURS2.length * HOUR_HEIGHT2 } }, /* @__PURE__ */ React10.createElement("div", { className: "w-20 bg-muted/5 border-r-[0.5px] border-border/30 relative" }, HOURS2.map((hour) => /* @__PURE__ */ React10.createElement(
+  return /* @__PURE__ */ React10.createElement("div", { className: "flex flex-col h-full bg-background border-[0.5px] border-border/50 rounded-2xl overflow-hidden shadow-sm" }, /* @__PURE__ */ React10.createElement("div", { className: "px-6 py-4 border-b-[0.5px] border-border/50 bg-gradient-to-r from-muted/20 via-background to-muted/20 text-center shrink-0" }, /* @__PURE__ */ React10.createElement("div", { className: "flex items-center justify-center gap-3" }, /* @__PURE__ */ React10.createElement("h2", { className: "text-xl font-semibold capitalize text-foreground" }, format9(currentDate, "EEEE, MMMM d, yyyy", { locale })), isToday2 && /* @__PURE__ */ React10.createElement("span", { className: "text-xs font-semibold bg-primary text-primary-foreground px-3 py-1 rounded-full shadow-md shadow-primary/20" }, translations?.today || "Today"))), /* @__PURE__ */ React10.createElement("div", { ref: scrollContainerRef, className: "flex-1 overflow-y-auto relative" }, /* @__PURE__ */ React10.createElement("div", { className: "flex relative", style: { height: HOURS2.length * HOUR_HEIGHT2 } }, /* @__PURE__ */ React10.createElement("div", { className: "w-20 bg-muted/5 border-r-[0.5px] border-border/30 relative" }, HOURS2.map((hour) => /* @__PURE__ */ React10.createElement(
     "div",
     {
       key: hour,
@@ -1425,6 +1541,7 @@ var DayViewImpl = ({
               e.stopPropagation();
               onEventClick?.(event);
             },
+            onContextMenu: onEventContextMenu ? (e) => onEventContextMenu(event, e) : void 0,
             title: columns > 1 ? `${event.title} (${column + 1}/${columns})` : void 0
           },
           /* @__PURE__ */ React10.createElement("div", { className: "flex flex-col h-full overflow-hidden w-full" }, /* @__PURE__ */ React10.createElement("div", { className: cn(
@@ -1487,7 +1604,8 @@ var AgendaView = ({
   onCreateEvent,
   locale,
   translations,
-  timezone
+  timezone,
+  onEventContextMenu
 }) => {
   const is24h = uses24HourClock(locale);
   const { time: timePattern, compact: compactTimePattern } = timeFormats(locale);
@@ -1544,6 +1662,7 @@ var AgendaView = ({
         {
           key: event.id,
           onClick: () => onEventClick?.(event),
+          onContextMenu: onEventContextMenu ? (e) => onEventContextMenu(event, e) : void 0,
           className: cn(
             "group relative flex gap-4 p-4 rounded-2xl border border-border/40",
             "hover:border-primary/40 hover:shadow-lg hover:shadow-primary/5",
@@ -1584,7 +1703,9 @@ var ResourceView = ({
   onEventClick,
   onTimeSlotClick,
   locale,
-  timezone
+  timezone,
+  translations,
+  onEventContextMenu
 }) => {
   const containerRef = useRef2(null);
   const hours = Array.from({ length: 24 }, (_, i) => i);
@@ -1604,7 +1725,7 @@ var ResourceView = ({
       // Min width for visibility
     };
   };
-  return /* @__PURE__ */ React13.createElement("div", { className: "flex flex-col h-full bg-background overflow-hidden" }, /* @__PURE__ */ React13.createElement("div", { className: "flex border-b border-border bg-muted/20" }, /* @__PURE__ */ React13.createElement("div", { className: "w-48 shrink-0 border-r border-border p-4 font-semibold text-sm bg-background sticky left-0 z-20" }, "Resources"), /* @__PURE__ */ React13.createElement("div", { className: "flex overflow-hidden" }, /* @__PURE__ */ React13.createElement("div", { className: "flex relative", style: { width: hours.length * hourWidth } }, hours.map((hour) => /* @__PURE__ */ React13.createElement(
+  return /* @__PURE__ */ React13.createElement("div", { className: "flex flex-col h-full bg-background overflow-hidden" }, /* @__PURE__ */ React13.createElement("div", { className: "flex border-b border-border bg-muted/20" }, /* @__PURE__ */ React13.createElement("div", { className: "w-48 shrink-0 border-r border-border p-4 font-semibold text-sm bg-background sticky left-0 z-20" }, translations?.resource || "Resources"), /* @__PURE__ */ React13.createElement("div", { className: "flex overflow-hidden" }, /* @__PURE__ */ React13.createElement("div", { className: "flex relative", style: { width: hours.length * hourWidth } }, hours.map((hour) => /* @__PURE__ */ React13.createElement(
     "div",
     {
       key: hour,
@@ -1616,7 +1737,7 @@ var ResourceView = ({
     const resourceEvents = events.filter(
       (e) => e.resourceId === resource.id && isSameDisplayDay(e.start, currentDate, timezone)
     );
-    return /* @__PURE__ */ React13.createElement("div", { key: resource.id, className: "flex border-b border-border min-h-[100px]" }, /* @__PURE__ */ React13.createElement("div", { className: "w-48 shrink-0 border-r border-border p-4 bg-background sticky left-0 z-10 flex items-center gap-3" }, resource.avatar ? /* @__PURE__ */ React13.createElement("img", { src: resource.avatar, alt: resource.label, className: "w-8 h-8 rounded-full object-cover" }) : /* @__PURE__ */ React13.createElement("div", { className: "w-8 h-8 rounded-full bg-primary/10 flex items-center justify-center text-xs font-bold text-primary" }, resource.label.substring(0, 2).toUpperCase()), /* @__PURE__ */ React13.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React13.createElement("span", { className: "text-sm font-medium" }, resource.label), /* @__PURE__ */ React13.createElement("span", { className: "text-xs text-muted-foreground" }, "ID: ", resource.id))), /* @__PURE__ */ React13.createElement("div", { className: "relative flex", style: { width: hours.length * hourWidth } }, hours.map((hour) => /* @__PURE__ */ React13.createElement(
+    return /* @__PURE__ */ React13.createElement("div", { key: resource.id, className: "flex border-b border-border min-h-[100px]" }, /* @__PURE__ */ React13.createElement("div", { className: "w-48 shrink-0 border-r border-border p-4 bg-background sticky left-0 z-10 flex items-center gap-3" }, resource.avatar ? /* @__PURE__ */ React13.createElement("img", { src: resource.avatar, alt: resource.label, className: "w-8 h-8 rounded-full object-cover" }) : /* @__PURE__ */ React13.createElement("div", { className: "w-8 h-8 rounded-full bg-primary/10 flex items-center justify-center text-xs font-bold text-primary" }, resource.label.substring(0, 2).toUpperCase()), /* @__PURE__ */ React13.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React13.createElement("span", { className: "text-sm font-medium" }, resource.label), /* @__PURE__ */ React13.createElement("span", { className: "text-xs text-muted-foreground" }, interpolate(translations?.idLabel || "ID: {id}", { id: resource.id })))), /* @__PURE__ */ React13.createElement("div", { className: "relative flex", style: { width: hours.length * hourWidth } }, hours.map((hour) => /* @__PURE__ */ React13.createElement(
       "div",
       {
         key: hour,
@@ -1648,6 +1769,7 @@ var ResourceView = ({
           e.stopPropagation();
           onEventClick?.(event);
         },
+        onContextMenu: onEventContextMenu ? (e) => onEventContextMenu(event, e) : void 0,
         className: "absolute top-2 bottom-2 rounded-md px-2 py-1 text-xs font-medium border shadow-sm cursor-pointer overflow-hidden hover:brightness-95 transition-all z-10",
         style: {
           ...getEventStyle(event),
@@ -1662,7 +1784,7 @@ var ResourceView = ({
 };
 
 // src/components/EventModal.tsx
-import React15, { useState as useState3, useEffect as useEffect3 } from "react";
+import React15, { useState as useState3, useEffect as useEffect3, useInsertionEffect, useRef as useRef4 } from "react";
 
 // src/components/ui/Modal.tsx
 import React14, { useEffect as useEffect2, useRef as useRef3 } from "react";
@@ -1673,7 +1795,8 @@ var Modal = ({
   title,
   children,
   className,
-  hideHeader = false
+  hideHeader = false,
+  closeLabel = "Close"
 }) => {
   const overlayRef = useRef3(null);
   useEffect2(() => {
@@ -1714,7 +1837,7 @@ var Modal = ({
         className: "h-9 w-9 p-0 rounded-xl hover:bg-accent/80 transition-all duration-200"
       },
       /* @__PURE__ */ React14.createElement(X, { className: "h-4 w-4" }),
-      /* @__PURE__ */ React14.createElement("span", { className: "sr-only" }, "Close")
+      /* @__PURE__ */ React14.createElement("span", { className: "sr-only" }, closeLabel)
     )),
     /* @__PURE__ */ React14.createElement("div", { className: cn("overflow-y-auto flex-1", !hideHeader && "p-6") }, children)
   ));
@@ -1744,18 +1867,7 @@ import {
   Tag,
   ExternalLink
 } from "lucide-react";
-var REMINDER_OPTIONS = [
-  { value: 0, label: "At time of event" },
-  { value: 5, label: "5 minutes before" },
-  { value: 10, label: "10 minutes before" },
-  { value: 15, label: "15 minutes before" },
-  { value: 30, label: "30 minutes before" },
-  { value: 60, label: "1 hour before" },
-  { value: 120, label: "2 hours before" },
-  { value: 1440, label: "1 day before" },
-  { value: 2880, label: "2 days before" },
-  { value: 10080, label: "1 week before" }
-];
+var REMINDER_OPTIONS = [0, 5, 10, 15, 30, 60, 120, 1440, 2880, 10080];
 var COLOR_PALETTE = [
   "#3b82f6",
   // Blue
@@ -1778,6 +1890,30 @@ var COLOR_PALETTE = [
   "#6366f1"
   // Indigo
 ];
+var EMAIL = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+var mergeGuests = (current, added) => {
+  const seen = new Set(current.map((email) => email.toLowerCase()));
+  const merged = [...current];
+  for (const email of added) {
+    if (!seen.has(email.toLowerCase())) {
+      seen.add(email.toLowerCase());
+      merged.push(email);
+    }
+  }
+  return merged;
+};
+var reminderLabel = (minutes, t) => {
+  if (minutes === 0) return t.reminderAtTime;
+  if (minutes === 10080) return t.reminderWeek;
+  if (minutes === 1440) return t.reminderDay;
+  if (minutes % 1440 === 0) return interpolate(t.reminderDays, { n: minutes / 1440 });
+  if (minutes === 60) return t.reminderHour;
+  if (minutes % 60 === 0) return interpolate(t.reminderHours, { n: minutes / 60 });
+  return interpolate(t.reminderMinutes, { n: minutes });
+};
+var avatarHue = (email) => [...email].reduce((hash, char) => (hash * 31 + char.charCodeAt(0)) % 360, 7);
+var mapsUrl = (location) => `https://www.google.com/maps/search/?api=1&query=${encodeURIComponent(location)}`;
+var isSafeUrl = (url) => /^(https?:|mailto:|blob:|\/|\.\/|\.\.\/|[^:]*$)/i.test(url.trim());
 var EventModal = ({
   isOpen,
   onClose,
@@ -1785,9 +1921,15 @@ var EventModal = ({
   initialDate,
   onSave,
   onDelete,
-  calendars
+  calendars,
+  translations: t,
+  locale
 }) => {
   const [mode, setMode] = useState3("create");
+  const translationsRef = useRef4(t);
+  useInsertionEffect(() => {
+    translationsRef.current = t;
+  });
   const [formData, setFormData] = useState3({
     title: "",
     description: "",
@@ -1800,22 +1942,18 @@ var EventModal = ({
     type: void 0,
     recurrence: void 0,
     attachments: [],
-    reminders: [{ id: "1", type: "notification", time: 30, label: "30 minutes before" }]
+    reminders: []
   });
   const [isCalendarDropdownOpen, setIsCalendarDropdownOpen] = useState3(false);
   const [isColorPickerOpen, setIsColorPickerOpen] = useState3(false);
   const [isReminderDropdownOpen, setIsReminderDropdownOpen] = useState3(false);
-  const [isGuestsDropdownOpen, setIsGuestsDropdownOpen] = useState3(false);
-  const fakeGuests = [
-    "alice@example.com",
-    "bob@example.com",
-    "charlie@example.com",
-    "diana@example.com",
-    "evan@example.com"
-  ];
-  const [selectedGuests, setSelectedGuests] = useState3([]);
+  const [guestInput, setGuestInput] = useState3("");
+  const [guestError, setGuestError] = useState3(false);
   useEffect3(() => {
+    const defaultReminders = () => [{ id: "1", type: "notification", time: 30, label: reminderLabel(30, translationsRef.current) }];
     if (isOpen) {
+      setGuestInput("");
+      setGuestError(false);
       if (event) {
         setMode("view");
         setFormData({
@@ -1823,9 +1961,9 @@ var EventModal = ({
           start: new Date(event.start),
           end: new Date(event.end),
           attachments: event.attachments || [],
-          reminders: event.reminders || [{ id: "1", type: "notification", time: 30, label: "30 minutes before" }]
+          reminders: event.reminders || defaultReminders(),
+          guests: event.guests || []
         });
-        setSelectedGuests(event.guests || []);
       } else {
         setMode("create");
         const start = initialDate || /* @__PURE__ */ new Date();
@@ -1841,21 +1979,34 @@ var EventModal = ({
           color: "#3b82f6",
           calendarId: calendars?.[0]?.id,
           attachments: [],
-          reminders: [{ id: "1", type: "notification", time: 30, label: "30 minutes before" }]
+          reminders: defaultReminders(),
+          guests: []
         });
-        setSelectedGuests([]);
       }
     }
   }, [isOpen, event, initialDate, calendars]);
-  const toggleGuest = (email) => {
-    setSelectedGuests((prev) => {
-      const newGuests = prev.includes(email) ? prev.filter((e) => e !== email) : [...prev, email];
-      setFormData((curr) => ({ ...curr, guests: newGuests }));
-      return newGuests;
-    });
+  const guests = formData.guests || [];
+  const addGuests = (raw) => {
+    const entries = raw.split(/[\s,;]+/).filter(Boolean);
+    const valid = entries.filter((entry) => EMAIL.test(entry));
+    const invalid = entries.filter((entry) => !EMAIL.test(entry));
+    if (valid.length > 0) {
+      setFormData((prev) => ({ ...prev, guests: mergeGuests(prev.guests || [], valid) }));
+    }
+    setGuestInput(invalid.join(", "));
+    setGuestError(invalid.length > 0);
+    return invalid.length === 0;
+  };
+  const removeGuest = (email) => {
+    setFormData((prev) => ({ ...prev, guests: (prev.guests || []).filter((g) => g !== email) }));
   };
   const handleSubmit = (e) => {
     e.preventDefault();
+    const pending = guestInput.split(/[\s,;]+/).filter(Boolean);
+    if (pending.some((entry) => !EMAIL.test(entry))) {
+      addGuests(guestInput);
+      return;
+    }
     let eventColor = formData.color;
     if (formData.calendarId && calendars) {
       const selectedCal = calendars.find((c) => c.id === formData.calendarId);
@@ -1863,8 +2014,10 @@ var EventModal = ({
         eventColor = selectedCal.color;
       }
     }
+    const finalGuests = mergeGuests(guests, pending);
     onSave({
       ...formData,
+      guests: finalGuests,
       color: eventColor,
       id: event?.id
     });
@@ -1898,12 +2051,12 @@ var EventModal = ({
       }
     }
   };
-  const addReminder = (minutes, label) => {
+  const addReminder = (minutes) => {
     const newReminder = {
-      id: Math.random().toString(36).substr(2, 9),
+      id: Math.random().toString(36).slice(2, 11),
       type: "notification",
       time: minutes,
-      label
+      label: reminderLabel(minutes, t)
     };
     setFormData((prev) => ({
       ...prev,
@@ -1917,23 +2070,20 @@ var EventModal = ({
       reminders: prev.reminders?.filter((r) => r.id !== id)
     }));
   };
-  const handleDownload = (attachment) => {
-    const element = document.createElement("a");
-    const file = new Blob(["Dummy content for " + attachment.name], { type: "text/plain" });
-    element.href = URL.createObjectURL(file);
-    element.download = attachment.name;
-    document.body.appendChild(element);
-    element.click();
-    document.body.removeChild(element);
-  };
   const getDurationText = () => {
     if (!formData.start || !formData.end) return "";
     const mins = differenceInMinutes5(formData.end, formData.start);
-    if (mins < 60) return `${mins} min`;
+    if (mins < 60) return interpolate(t.durationMinutes, { n: mins });
     const hours = Math.floor(mins / 60);
     const remainingMins = mins % 60;
-    if (remainingMins === 0) return `${hours} hr`;
-    return `${hours} hr ${remainingMins} min`;
+    if (remainingMins === 0) return interpolate(t.durationHours, { n: hours });
+    return interpolate(t.durationHoursMinutes, { h: hours, m: remainingMins });
+  };
+  const { time: timeFormat } = timeFormats(locale);
+  const renderAttachment = (att) => {
+    const content = /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement("div", { className: "p-2 bg-primary/10 rounded-lg" }, /* @__PURE__ */ React15.createElement(File, { className: "w-4 h-4 text-primary" })), /* @__PURE__ */ React15.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React15.createElement("p", { className: "text-sm font-medium text-foreground truncate" }, att.name), /* @__PURE__ */ React15.createElement("p", { className: "text-xs text-muted-foreground" }, att.size)), att.url && /* @__PURE__ */ React15.createElement(Download, { className: "w-4 h-4 text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity" }));
+    const className = "flex items-center gap-3 p-3 rounded-xl border border-border/30 bg-muted/20 transition-all group";
+    return att.url && isSafeUrl(att.url) ? /* @__PURE__ */ React15.createElement("a", { key: att.id, href: att.url, target: "_blank", rel: "noopener noreferrer", download: att.name, className: cn(className, "hover:bg-muted/40 cursor-pointer") }, content) : /* @__PURE__ */ React15.createElement("div", { key: att.id, className }, content);
   };
   const renderViewMode = () => /* @__PURE__ */ React15.createElement("div", { className: "flex flex-col bg-background overflow-hidden w-full max-h-[90vh]" }, /* @__PURE__ */ React15.createElement(
     "div",
@@ -1949,12 +2099,13 @@ var EventModal = ({
         className: "w-3 h-3 rounded-full",
         style: { backgroundColor: event?.color || "#3b82f6" }
       }
-    ), /* @__PURE__ */ React15.createElement("span", { className: "text-xs font-medium text-muted-foreground uppercase tracking-wider" }, calendars?.find((c) => c.id === event?.calendarId)?.label || "Event")), /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-1" }, /* @__PURE__ */ React15.createElement(
+    ), /* @__PURE__ */ React15.createElement("span", { className: "text-xs font-medium text-muted-foreground uppercase tracking-wider" }, calendars?.find((c) => c.id === event?.calendarId)?.label || t.event)), /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-1" }, /* @__PURE__ */ React15.createElement(
       "button",
       {
         onClick: () => setMode("edit"),
         className: "p-2 hover:bg-background/80 rounded-lg transition-all text-muted-foreground hover:text-foreground",
-        title: "Edit"
+        title: t.edit,
+        "aria-label": t.edit
       },
       /* @__PURE__ */ React15.createElement(Edit2, { className: "w-4 h-4" })
     ), /* @__PURE__ */ React15.createElement(
@@ -1962,7 +2113,8 @@ var EventModal = ({
       {
         onClick: handleDelete,
         className: "p-2 hover:bg-destructive/10 rounded-lg transition-all text-muted-foreground hover:text-destructive",
-        title: "Delete"
+        title: t.delete,
+        "aria-label": t.delete
       },
       /* @__PURE__ */ React15.createElement(Trash2, { className: "w-4 h-4" })
     ), /* @__PURE__ */ React15.createElement(
@@ -1970,21 +2122,25 @@ var EventModal = ({
       {
         onClick: onClose,
         className: "p-2 hover:bg-background/80 rounded-lg transition-all text-muted-foreground hover:text-foreground",
-        title: "Close"
+        title: t.close,
+        "aria-label": t.close
       },
       /* @__PURE__ */ React15.createElement(X2, { className: "w-4 h-4" })
     ))),
-    /* @__PURE__ */ React15.createElement("h1", { className: "text-2xl font-bold text-foreground mb-3 leading-tight" }, event?.title || "(No title)"),
-    /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-3 text-sm" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2 px-3 py-1.5 bg-background/60 backdrop-blur-sm rounded-lg border border-border/30" }, /* @__PURE__ */ React15.createElement(Calendar2, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("span", { className: "font-medium" }, event?.start && format12(new Date(event.start), "EEE, MMM d"))), /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2 px-3 py-1.5 bg-background/60 backdrop-blur-sm rounded-lg border border-border/30" }, /* @__PURE__ */ React15.createElement(Clock2, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("span", { className: "font-medium" }, event?.start && format12(new Date(event.start), "h:mm a"), " \u2013 ", event?.end && format12(new Date(event.end), "h:mm a"))))
+    /* @__PURE__ */ React15.createElement("h1", { className: "text-2xl font-bold text-foreground mb-3 leading-tight" }, event?.title || t.noTitle),
+    /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-3 text-sm" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2 px-3 py-1.5 bg-background/60 backdrop-blur-sm rounded-lg border border-border/30" }, /* @__PURE__ */ React15.createElement(Calendar2, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("span", { className: "font-medium" }, event?.start && format12(new Date(event.start), "EEE, MMM d", { locale }))), /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2 px-3 py-1.5 bg-background/60 backdrop-blur-sm rounded-lg border border-border/30" }, /* @__PURE__ */ React15.createElement(Clock2, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("span", { className: "font-medium" }, event?.start && format12(new Date(event.start), timeFormat, { locale }), " \u2013 ", event?.end && format12(new Date(event.end), timeFormat, { locale }))))
   ), /* @__PURE__ */ React15.createElement("div", { className: "px-6 pb-6 space-y-4 overflow-y-auto flex-1" }, event?.location && /* @__PURE__ */ React15.createElement(
-    motion2.div,
+    motion2.a,
     {
+      href: mapsUrl(event.location),
+      target: "_blank",
+      rel: "noopener noreferrer",
       initial: { opacity: 0, y: 10 },
       animate: { opacity: 1, y: 0 },
       className: "flex items-start gap-3 p-4 rounded-2xl bg-muted/30 border border-border/30 group hover:bg-muted/50 transition-all cursor-pointer"
     },
     /* @__PURE__ */ React15.createElement("div", { className: "p-2 bg-primary/10 rounded-xl" }, /* @__PURE__ */ React15.createElement(MapPin, { className: "w-5 h-5 text-primary" })),
-    /* @__PURE__ */ React15.createElement("div", { className: "flex-1" }, /* @__PURE__ */ React15.createElement("p", { className: "text-sm font-medium text-foreground" }, event.location), /* @__PURE__ */ React15.createElement("p", { className: "text-xs text-muted-foreground mt-0.5" }, "Click to open in maps")),
+    /* @__PURE__ */ React15.createElement("div", { className: "flex-1" }, /* @__PURE__ */ React15.createElement("p", { className: "text-sm font-medium text-foreground" }, event.location), /* @__PURE__ */ React15.createElement("p", { className: "text-xs text-muted-foreground mt-0.5" }, t.openInMaps)),
     /* @__PURE__ */ React15.createElement(ExternalLink, { className: "w-4 h-4 text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity" })
   ), event?.guests && event.guests.length > 0 && /* @__PURE__ */ React15.createElement(
     motion2.div,
@@ -1994,18 +2150,18 @@ var EventModal = ({
       transition: { delay: 0.05 },
       className: "space-y-3"
     },
-    /* @__PURE__ */ React15.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(Users2, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("span", { className: "text-sm font-medium text-foreground" }, event.guests.length, " ", event.guests.length > 1 ? "Guests" : "Guest"))),
-    /* @__PURE__ */ React15.createElement("div", { className: "flex flex-wrap gap-2" }, event.guests.map((email, index) => /* @__PURE__ */ React15.createElement(
+    /* @__PURE__ */ React15.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(Users2, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("span", { className: "text-sm font-medium text-foreground" }, event.guests.length, " ", event.guests.length > 1 ? t.guests : t.guestSingular))),
+    /* @__PURE__ */ React15.createElement("div", { className: "flex flex-wrap gap-2" }, event.guests.map((email) => /* @__PURE__ */ React15.createElement(
       "div",
       {
-        key: index,
-        className: "flex items-center gap-2 px-3 py-2 rounded-xl bg-muted/30 border border-border/30 hover:bg-muted/50 transition-all cursor-pointer group"
+        key: email,
+        className: "flex items-center gap-2 px-3 py-2 rounded-xl bg-muted/30 border border-border/30"
       },
       /* @__PURE__ */ React15.createElement(
         "div",
         {
           className: "w-8 h-8 rounded-full flex items-center justify-center text-sm font-semibold text-white",
-          style: { backgroundColor: `hsl(${index * 60}, 70%, 50%)` }
+          style: { backgroundColor: `hsl(${avatarHue(email)}, 70%, 50%)` }
         },
         email[0].toUpperCase()
       ),
@@ -2026,7 +2182,7 @@ var EventModal = ({
         key: reminder.id,
         className: "text-xs font-medium px-2.5 py-1 rounded-full bg-amber-500/10 text-amber-600 dark:text-amber-400"
       },
-      reminder.label || `${reminder.time} min before`
+      reminder.label || reminderLabel(reminder.time, t)
     )))
   ), event?.description && /* @__PURE__ */ React15.createElement(
     motion2.div,
@@ -2036,7 +2192,7 @@ var EventModal = ({
       transition: { delay: 0.15 },
       className: "space-y-2"
     },
-    /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(AlignLeft, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("span", { className: "text-sm font-medium text-foreground" }, "Notes")),
+    /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(AlignLeft, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("span", { className: "text-sm font-medium text-foreground" }, t.notesLabel)),
     /* @__PURE__ */ React15.createElement("div", { className: "text-sm text-foreground/80 whitespace-pre-wrap leading-relaxed pl-6 p-3 rounded-xl bg-muted/20 border border-border/30" }, event.description)
   ), event?.attachments && event.attachments.length > 0 && /* @__PURE__ */ React15.createElement(
     motion2.div,
@@ -2046,25 +2202,16 @@ var EventModal = ({
       transition: { delay: 0.2 },
       className: "space-y-2"
     },
-    /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(Paperclip2, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("span", { className: "text-sm font-medium text-foreground" }, "Attachments")),
-    /* @__PURE__ */ React15.createElement("div", { className: "grid gap-2" }, event.attachments.map((att) => /* @__PURE__ */ React15.createElement(
-      "div",
-      {
-        key: att.id,
-        onClick: () => handleDownload(att),
-        className: "flex items-center gap-3 p-3 rounded-xl border border-border/30 bg-muted/20 hover:bg-muted/40 transition-all cursor-pointer group"
-      },
-      /* @__PURE__ */ React15.createElement("div", { className: "p-2 bg-primary/10 rounded-lg" }, /* @__PURE__ */ React15.createElement(File, { className: "w-4 h-4 text-primary" })),
-      /* @__PURE__ */ React15.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React15.createElement("p", { className: "text-sm font-medium text-foreground truncate" }, att.name), /* @__PURE__ */ React15.createElement("p", { className: "text-xs text-muted-foreground" }, att.size)),
-      /* @__PURE__ */ React15.createElement(Download, { className: "w-4 h-4 text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity" })
-    )))
+    /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(Paperclip2, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("span", { className: "text-sm font-medium text-foreground" }, t.attachments)),
+    /* @__PURE__ */ React15.createElement("div", { className: "grid gap-2" }, event.attachments.map(renderAttachment))
   )));
   const renderEditMode = () => /* @__PURE__ */ React15.createElement("form", { onSubmit: handleSubmit, className: "flex flex-col bg-background overflow-hidden w-full max-h-[85vh]" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center justify-between px-5 py-4 border-b border-border/50 shrink-0" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React15.createElement(
     "button",
     {
       type: "button",
       onClick: () => setIsColorPickerOpen(!isColorPickerOpen),
-      className: "relative p-1"
+      className: "relative p-1",
+      "aria-label": t.eventColor
     },
     /* @__PURE__ */ React15.createElement(
       "div",
@@ -2081,6 +2228,7 @@ var EventModal = ({
       {
         key: color,
         type: "button",
+        "aria-label": color,
         onClick: () => {
           setFormData((prev) => ({ ...prev, color }));
           setIsColorPickerOpen(false);
@@ -2092,12 +2240,13 @@ var EventModal = ({
         style: { backgroundColor: color, color }
       }
     )))
-  ), /* @__PURE__ */ React15.createElement("h2", { className: "text-lg font-semibold text-foreground" }, mode === "edit" ? "Edit Event" : "New Event")), /* @__PURE__ */ React15.createElement(
+  ), /* @__PURE__ */ React15.createElement("h2", { className: "text-lg font-semibold text-foreground" }, mode === "edit" ? t.editEvent : t.newEvent)), /* @__PURE__ */ React15.createElement(
     "button",
     {
       type: "button",
       onClick: onClose,
-      className: "p-2 hover:bg-accent rounded-xl transition-all text-muted-foreground hover:text-foreground"
+      className: "p-2 hover:bg-accent rounded-xl transition-all text-muted-foreground hover:text-foreground",
+      "aria-label": t.close
     },
     /* @__PURE__ */ React15.createElement(X2, { className: "w-4 h-4" })
   )), /* @__PURE__ */ React15.createElement("div", { className: "flex-1 overflow-y-auto" }, /* @__PURE__ */ React15.createElement("div", { className: "px-5 py-4 space-y-5" }, /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement(
@@ -2109,25 +2258,28 @@ var EventModal = ({
       className: "w-full text-xl font-semibold border-0 border-b-2 border-transparent focus:border-primary bg-transparent px-0 py-2 placeholder-muted-foreground/50 transition-all text-foreground focus:outline-none",
       value: formData.title,
       onChange: (e) => setFormData({ ...formData, title: e.target.value }),
-      placeholder: "Add title"
+      placeholder: t.title,
+      "aria-label": t.title
     }
-  )), /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-3 p-4 rounded-2xl bg-muted/20 border border-border/30" }, /* @__PURE__ */ React15.createElement("div", { className: "p-2 bg-primary/10 rounded-xl shrink-0" }, /* @__PURE__ */ React15.createElement(Clock2, { className: "w-5 h-5 text-primary" })), /* @__PURE__ */ React15.createElement("div", { className: "flex-1 grid grid-cols-2 gap-3" }, /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("label", { className: "text-[10px] font-semibold text-muted-foreground uppercase tracking-wider mb-1 block" }, "Start"), /* @__PURE__ */ React15.createElement(
+  )), /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-3 p-4 rounded-2xl bg-muted/20 border border-border/30" }, /* @__PURE__ */ React15.createElement("div", { className: "p-2 bg-primary/10 rounded-xl shrink-0" }, /* @__PURE__ */ React15.createElement(Clock2, { className: "w-5 h-5 text-primary" })), /* @__PURE__ */ React15.createElement("div", { className: "flex-1 grid grid-cols-2 gap-3" }, /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("label", { htmlFor: "calendarkit-event-start", className: "text-[10px] font-semibold text-muted-foreground uppercase tracking-wider mb-1 block" }, t.start), /* @__PURE__ */ React15.createElement(
     "input",
     {
+      id: "calendarkit-event-start",
       type: "datetime-local",
       className: "w-full bg-background border border-border/50 rounded-xl px-3 py-2 text-sm font-medium text-foreground focus:border-primary focus:ring-2 focus:ring-primary/20 transition-all",
       value: formatDateForInput(formData.start),
       onChange: (e) => handleDateChange("start", e.target.value)
     }
-  )), /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("label", { className: "text-[10px] font-semibold text-muted-foreground uppercase tracking-wider mb-1 block" }, "End"), /* @__PURE__ */ React15.createElement(
+  )), /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("label", { htmlFor: "calendarkit-event-end", className: "text-[10px] font-semibold text-muted-foreground uppercase tracking-wider mb-1 block" }, t.end), /* @__PURE__ */ React15.createElement(
     "input",
     {
+      id: "calendarkit-event-end",
       type: "datetime-local",
       className: "w-full bg-background border border-border/50 rounded-xl px-3 py-2 text-sm font-medium text-foreground focus:border-primary focus:ring-2 focus:ring-primary/20 transition-all",
       value: formatDateForInput(formData.end),
       onChange: (e) => handleDateChange("end", e.target.value)
     }
-  )))), getDurationText() && /* @__PURE__ */ React15.createElement("div", { className: "flex justify-center" }, /* @__PURE__ */ React15.createElement("span", { className: "text-xs font-medium px-3 py-1 rounded-full bg-primary/10 text-primary" }, getDurationText())), /* @__PURE__ */ React15.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(Bell2, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("span", { className: "text-sm font-medium text-foreground" }, "Reminders")), /* @__PURE__ */ React15.createElement("div", { className: "relative" }, /* @__PURE__ */ React15.createElement(
+  )))), getDurationText() && /* @__PURE__ */ React15.createElement("div", { className: "flex justify-center" }, /* @__PURE__ */ React15.createElement("span", { className: "text-xs font-medium px-3 py-1 rounded-full bg-primary/10 text-primary" }, getDurationText())), /* @__PURE__ */ React15.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(Bell2, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("span", { className: "text-sm font-medium text-foreground" }, t.reminders)), /* @__PURE__ */ React15.createElement("div", { className: "relative" }, /* @__PURE__ */ React15.createElement(
     "button",
     {
       type: "button",
@@ -2135,16 +2287,16 @@ var EventModal = ({
       className: "flex items-center gap-1 text-xs font-medium text-primary hover:text-primary/80 transition-colors"
     },
     /* @__PURE__ */ React15.createElement(Plus3, { className: "w-3.5 h-3.5" }),
-    "Add"
-  ), isReminderDropdownOpen && /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement("div", { className: "fixed inset-0 z-40", onClick: () => setIsReminderDropdownOpen(false) }), /* @__PURE__ */ React15.createElement("div", { className: "absolute right-0 top-full mt-1 w-48 bg-background border border-border rounded-xl shadow-xl z-50 py-1 max-h-60 overflow-y-auto" }, REMINDER_OPTIONS.map((option) => /* @__PURE__ */ React15.createElement(
+    t.add
+  ), isReminderDropdownOpen && /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement("div", { className: "fixed inset-0 z-40", onClick: () => setIsReminderDropdownOpen(false) }), /* @__PURE__ */ React15.createElement("div", { className: "absolute right-0 top-full mt-1 w-48 bg-background border border-border rounded-xl shadow-xl z-50 py-1 max-h-60 overflow-y-auto" }, REMINDER_OPTIONS.map((minutes) => /* @__PURE__ */ React15.createElement(
     "button",
     {
-      key: option.value,
+      key: minutes,
       type: "button",
-      onClick: () => addReminder(option.value, option.label),
+      onClick: () => addReminder(minutes),
       className: "w-full px-3 py-2 text-left text-sm hover:bg-accent transition-colors"
     },
-    option.label
+    reminderLabel(minutes, t)
   )))))), formData.reminders && formData.reminders.length > 0 && /* @__PURE__ */ React15.createElement("div", { className: "flex flex-wrap gap-2" }, formData.reminders.map((reminder) => /* @__PURE__ */ React15.createElement(
     "div",
     {
@@ -2152,45 +2304,44 @@ var EventModal = ({
       className: "flex items-center gap-2 px-3 py-1.5 rounded-full bg-amber-500/10 border border-amber-500/20"
     },
     /* @__PURE__ */ React15.createElement(BellRing, { className: "w-3.5 h-3.5 text-amber-500" }),
-    /* @__PURE__ */ React15.createElement("span", { className: "text-xs font-medium text-amber-600 dark:text-amber-400" }, reminder.label),
+    /* @__PURE__ */ React15.createElement("span", { className: "text-xs font-medium text-amber-600 dark:text-amber-400" }, reminder.label || reminderLabel(reminder.time, t)),
     /* @__PURE__ */ React15.createElement(
       "button",
       {
         type: "button",
         onClick: () => removeReminder(reminder.id),
-        className: "p-0.5 hover:bg-amber-500/20 rounded-full transition-colors"
+        className: "p-0.5 hover:bg-amber-500/20 rounded-full transition-colors",
+        "aria-label": t.removeReminder
       },
       /* @__PURE__ */ React15.createElement(X2, { className: "w-3 h-3 text-amber-500" })
     )
-  )))), /* @__PURE__ */ React15.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(Users2, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("span", { className: "text-sm font-medium text-foreground" }, "Guests")), /* @__PURE__ */ React15.createElement("div", { className: "relative" }, /* @__PURE__ */ React15.createElement(
-    "button",
-    {
-      type: "button",
-      onClick: () => setIsGuestsDropdownOpen(!isGuestsDropdownOpen),
-      className: "w-full flex items-center justify-between px-4 py-3 bg-muted/20 border border-border/30 rounded-xl text-sm text-left hover:bg-muted/30 transition-all"
-    },
-    /* @__PURE__ */ React15.createElement("span", { className: selectedGuests.length > 0 ? "text-foreground font-medium" : "text-muted-foreground" }, selectedGuests.length > 0 ? `${selectedGuests.length} guest${selectedGuests.length > 1 ? "s" : ""} added` : "Add guests"),
-    /* @__PURE__ */ React15.createElement(ChevronDown2, { className: cn("w-4 h-4 text-muted-foreground transition-transform", isGuestsDropdownOpen && "rotate-180") })
-  ), isGuestsDropdownOpen && /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement("div", { className: "fixed inset-0 z-40", onClick: () => setIsGuestsDropdownOpen(false) }), /* @__PURE__ */ React15.createElement("div", { className: "absolute z-50 w-full mt-2 bg-background border border-border rounded-xl shadow-xl max-h-48 overflow-y-auto" }, fakeGuests.map((email) => /* @__PURE__ */ React15.createElement(
-    "div",
+  )))), /* @__PURE__ */ React15.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(Users2, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("label", { htmlFor: "calendarkit-event-guest", className: "text-sm font-medium text-foreground" }, t.guests)), /* @__PURE__ */ React15.createElement(
+    "input",
     {
-      key: email,
-      className: "px-4 py-3 hover:bg-accent cursor-pointer flex items-center gap-3 transition-colors",
-      onClick: () => toggleGuest(email)
-    },
-    /* @__PURE__ */ React15.createElement("div", { className: cn(
-      "w-5 h-5 rounded-md border-2 flex items-center justify-center transition-all",
-      selectedGuests.includes(email) ? "bg-primary border-primary" : "border-border"
-    ) }, selectedGuests.includes(email) && /* @__PURE__ */ React15.createElement(Check, { className: "w-3 h-3 text-primary-foreground" })),
-    /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(
-      "div",
-      {
-        className: "w-7 h-7 rounded-full flex items-center justify-center text-xs font-semibold text-white",
-        style: { backgroundColor: `hsl(${fakeGuests.indexOf(email) * 60}, 70%, 50%)` }
+      id: "calendarkit-event-guest",
+      type: "text",
+      inputMode: "email",
+      autoComplete: "email",
+      value: guestInput,
+      onChange: (e) => {
+        setGuestInput(e.target.value);
+        setGuestError(false);
       },
-      email[0].toUpperCase()
-    ), /* @__PURE__ */ React15.createElement("span", { className: "text-sm" }, email))
-  ))))), selectedGuests.length > 0 && /* @__PURE__ */ React15.createElement("div", { className: "flex flex-wrap gap-2 mt-2" }, selectedGuests.map((email) => /* @__PURE__ */ React15.createElement(
+      onKeyDown: (e) => {
+        if (e.key === "Enter" || e.key === ",") {
+          e.preventDefault();
+          addGuests(guestInput);
+        }
+      },
+      onBlur: () => guestInput.trim() && addGuests(guestInput),
+      placeholder: t.addGuestPlaceholder,
+      "aria-invalid": guestError,
+      className: cn(
+        "w-full px-4 py-3 bg-muted/20 border rounded-xl text-sm text-foreground placeholder-muted-foreground focus:outline-none focus:border-primary transition-all",
+        guestError ? "border-destructive" : "border-border/30"
+      )
+    }
+  ), guestError && /* @__PURE__ */ React15.createElement("p", { role: "alert", className: "text-xs text-destructive" }, t.invalidEmail), guests.length > 0 && /* @__PURE__ */ React15.createElement("div", { className: "flex flex-wrap gap-2 mt-2" }, guests.map((email) => /* @__PURE__ */ React15.createElement(
     "div",
     {
       key: email,
@@ -2200,17 +2351,18 @@ var EventModal = ({
       "div",
       {
         className: "w-6 h-6 rounded-full flex items-center justify-center text-xs font-semibold text-white",
-        style: { backgroundColor: `hsl(${fakeGuests.indexOf(email) * 60}, 70%, 50%)` }
+        style: { backgroundColor: `hsl(${avatarHue(email)}, 70%, 50%)` }
       },
       email[0].toUpperCase()
     ),
-    /* @__PURE__ */ React15.createElement("span", { className: "text-xs font-medium text-foreground" }, email.split("@")[0]),
+    /* @__PURE__ */ React15.createElement("span", { className: "text-xs font-medium text-foreground" }, email),
     /* @__PURE__ */ React15.createElement(
       "button",
       {
         type: "button",
-        onClick: () => toggleGuest(email),
-        className: "p-0.5 hover:bg-destructive/10 rounded-full transition-colors"
+        onClick: () => removeGuest(email),
+        className: "p-0.5 hover:bg-destructive/10 rounded-full transition-colors",
+        "aria-label": interpolate(t.removeGuest, { email })
       },
       /* @__PURE__ */ React15.createElement(X2, { className: "w-3 h-3 text-muted-foreground" })
     )
@@ -2219,15 +2371,17 @@ var EventModal = ({
     {
       type: "text",
       className: "flex-1 bg-transparent text-sm text-foreground placeholder-muted-foreground focus:outline-none",
-      placeholder: "Add location",
+      placeholder: t.addLocation,
+      "aria-label": t.addLocation,
       value: formData.location || "",
       onChange: (e) => setFormData({ ...formData, location: e.target.value })
     }
-  )), /* @__PURE__ */ React15.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(AlignLeft, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("span", { className: "text-sm font-medium text-foreground" }, "Notes")), /* @__PURE__ */ React15.createElement(
+  )), /* @__PURE__ */ React15.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(AlignLeft, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("span", { className: "text-sm font-medium text-foreground" }, t.notesLabel)), /* @__PURE__ */ React15.createElement(
     "textarea",
     {
       className: "w-full bg-muted/20 border border-border/30 rounded-xl px-4 py-3 text-sm min-h-[100px] resize-none text-foreground placeholder-muted-foreground focus:border-primary focus:ring-2 focus:ring-primary/20 transition-all",
-      placeholder: "Add description or notes...",
+      placeholder: t.addNotes,
+      "aria-label": t.notesLabel,
       value: formData.description || "",
       onChange: (e) => setFormData({ ...formData, description: e.target.value })
     }
@@ -2235,6 +2389,7 @@ var EventModal = ({
     "select",
     {
       className: "flex-1 bg-transparent text-sm text-foreground focus:outline-none cursor-pointer",
+      "aria-label": t.repeat,
       value: formData.recurrence?.freq || "",
       onChange: (e) => {
         if (e.target.value === "") {
@@ -2250,12 +2405,12 @@ var EventModal = ({
         }
       }
     },
-    /* @__PURE__ */ React15.createElement("option", { value: "" }, "Does not repeat"),
-    /* @__PURE__ */ React15.createElement("option", { value: "DAILY" }, "Daily"),
-    /* @__PURE__ */ React15.createElement("option", { value: "WEEKLY" }, "Weekly"),
-    /* @__PURE__ */ React15.createElement("option", { value: "MONTHLY" }, "Monthly"),
-    /* @__PURE__ */ React15.createElement("option", { value: "YEARLY" }, "Yearly")
-  )), /* @__PURE__ */ React15.createElement("div", { className: "flex items-center justify-between p-3 rounded-xl bg-muted/20 border border-border/30" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(Tag, { className: "w-5 h-5 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("span", { className: "text-sm text-foreground" }, "Calendar")), /* @__PURE__ */ React15.createElement("div", { className: "relative" }, /* @__PURE__ */ React15.createElement(
+    /* @__PURE__ */ React15.createElement("option", { value: "" }, t.doesNotRepeat),
+    /* @__PURE__ */ React15.createElement("option", { value: "DAILY" }, t.daily),
+    /* @__PURE__ */ React15.createElement("option", { value: "WEEKLY" }, t.weekly),
+    /* @__PURE__ */ React15.createElement("option", { value: "MONTHLY" }, t.monthly),
+    /* @__PURE__ */ React15.createElement("option", { value: "YEARLY" }, t.yearly)
+  )), calendars && calendars.length > 0 && /* @__PURE__ */ React15.createElement("div", { className: "flex items-center justify-between p-3 rounded-xl bg-muted/20 border border-border/30" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(Tag, { className: "w-5 h-5 text-muted-foreground" }), /* @__PURE__ */ React15.createElement("span", { className: "text-sm text-foreground" }, t.calendar)), /* @__PURE__ */ React15.createElement("div", { className: "relative" }, /* @__PURE__ */ React15.createElement(
     "button",
     {
       type: "button",
@@ -2266,12 +2421,12 @@ var EventModal = ({
       "div",
       {
         className: "w-3 h-3 rounded-full",
-        style: { backgroundColor: calendars?.find((c) => c.id === formData.calendarId)?.color || "#3b82f6" }
+        style: { backgroundColor: calendars.find((c) => c.id === formData.calendarId)?.color || "#3b82f6" }
       }
     ),
-    /* @__PURE__ */ React15.createElement("span", { className: "font-medium" }, calendars?.find((c) => c.id === formData.calendarId)?.label || "Select"),
+    /* @__PURE__ */ React15.createElement("span", { className: "font-medium" }, calendars.find((c) => c.id === formData.calendarId)?.label || t.select),
     /* @__PURE__ */ React15.createElement(ChevronDown2, { className: "w-3.5 h-3.5 text-muted-foreground" })
-  ), isCalendarDropdownOpen && /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement("div", { className: "fixed inset-0 z-40", onClick: () => setIsCalendarDropdownOpen(false) }), /* @__PURE__ */ React15.createElement("div", { className: "absolute right-0 bottom-full mb-2 w-48 bg-background border border-border rounded-xl shadow-xl z-50 py-1" }, calendars?.map((cal) => /* @__PURE__ */ React15.createElement(
+  ), isCalendarDropdownOpen && /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement("div", { className: "fixed inset-0 z-40", onClick: () => setIsCalendarDropdownOpen(false) }), /* @__PURE__ */ React15.createElement("div", { className: "absolute right-0 bottom-full mb-2 w-48 bg-background border border-border rounded-xl shadow-xl z-50 py-1" }, calendars.map((cal) => /* @__PURE__ */ React15.createElement(
     "button",
     {
       key: cal.id,
@@ -2297,7 +2452,7 @@ var EventModal = ({
       className: "flex items-center gap-2 px-4 py-2 text-destructive hover:bg-destructive/10 rounded-xl transition-all text-sm font-medium"
     },
     /* @__PURE__ */ React15.createElement(Trash2, { className: "w-4 h-4" }),
-    "Delete"
+    t.delete
   ), mode === "create" && /* @__PURE__ */ React15.createElement("div", null), /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(
     "button",
     {
@@ -2305,14 +2460,14 @@ var EventModal = ({
       onClick: onClose,
       className: "px-4 py-2.5 text-muted-foreground hover:text-foreground font-medium text-sm rounded-xl transition-all hover:bg-accent"
     },
-    "Cancel"
+    t.cancel
   ), /* @__PURE__ */ React15.createElement(
     "button",
     {
       type: "submit",
       className: "px-6 py-2.5 bg-primary hover:bg-primary/90 text-primary-foreground font-semibold text-sm rounded-xl shadow-md transition-all hover:shadow-lg hover:shadow-primary/20 active:scale-95"
     },
-    mode === "edit" ? "Save Changes" : "Create Event"
+    mode === "edit" ? t.saveChanges : t.createEvent
   ))));
   return /* @__PURE__ */ React15.createElement(Modal, { isOpen, onClose, hideHeader: true, className: "p-0 overflow-hidden max-w-lg rounded-2xl shadow-2xl" }, /* @__PURE__ */ React15.createElement(AnimatePresence, { mode: "wait" }, mode === "view" && event ? /* @__PURE__ */ React15.createElement(
     motion2.div,
@@ -2340,7 +2495,7 @@ var EventModal = ({
 // src/components/Skeleton.tsx
 import React16 from "react";
 var Skeleton = ({ className, style }) => /* @__PURE__ */ React16.createElement("div", { className: cn("animate-pulse bg-muted/40 rounded", className), style });
-var MonthViewSkeleton = () => /* @__PURE__ */ React16.createElement("div", { className: "h-full bg-background border border-border/50 rounded-2xl overflow-hidden" }, /* @__PURE__ */ React16.createElement("div", { className: "grid grid-cols-7 border-b border-border/50 bg-muted/10" }, Array.from({ length: 7 }).map((_, i) => /* @__PURE__ */ React16.createElement("div", { key: i, className: "py-3 px-2 text-center border-r border-border/30 last:border-r-0" }, /* @__PURE__ */ React16.createElement(Skeleton, { className: "h-4 w-8 mx-auto" })))), /* @__PURE__ */ React16.createElement("div", { className: "grid grid-cols-7 flex-1" }, Array.from({ length: 35 }).map((_, i) => /* @__PURE__ */ React16.createElement("div", { key: i, className: "min-h-[120px] border-r border-b border-border/30 p-2" }, /* @__PURE__ */ React16.createElement(Skeleton, { className: "h-4 w-6 mb-2" }), /* @__PURE__ */ React16.createElement("div", { className: "space-y-1" }, Math.random() > 0.5 && /* @__PURE__ */ React16.createElement(Skeleton, { className: "h-5 w-full rounded-md" }), Math.random() > 0.7 && /* @__PURE__ */ React16.createElement(Skeleton, { className: "h-5 w-3/4 rounded-md" }))))));
+var MonthViewSkeleton = () => /* @__PURE__ */ React16.createElement("div", { className: "h-full bg-background border border-border/50 rounded-2xl overflow-hidden" }, /* @__PURE__ */ React16.createElement("div", { className: "grid grid-cols-7 border-b border-border/50 bg-muted/10" }, Array.from({ length: 7 }).map((_, i) => /* @__PURE__ */ React16.createElement("div", { key: i, className: "py-3 px-2 text-center border-r border-border/30 last:border-r-0" }, /* @__PURE__ */ React16.createElement(Skeleton, { className: "h-4 w-8 mx-auto" })))), /* @__PURE__ */ React16.createElement("div", { className: "grid grid-cols-7 flex-1" }, Array.from({ length: 35 }).map((_, i) => /* @__PURE__ */ React16.createElement("div", { key: i, className: "min-h-[120px] border-r border-b border-border/30 p-2" }, /* @__PURE__ */ React16.createElement(Skeleton, { className: "h-4 w-6 mb-2" }), /* @__PURE__ */ React16.createElement("div", { className: "space-y-1" }, i * 7 % 10 > 4 && /* @__PURE__ */ React16.createElement(Skeleton, { className: "h-5 w-full rounded-md" }), i * 3 % 10 > 6 && /* @__PURE__ */ React16.createElement(Skeleton, { className: "h-5 w-3/4 rounded-md" }))))));
 var WeekViewSkeleton = () => /* @__PURE__ */ React16.createElement("div", { className: "h-full bg-background border border-border/50 rounded-2xl overflow-hidden" }, /* @__PURE__ */ React16.createElement("div", { className: "flex border-b border-border/50 bg-muted/10" }, /* @__PURE__ */ React16.createElement("div", { className: "w-16 p-3 border-r border-border/30" }, /* @__PURE__ */ React16.createElement(Skeleton, { className: "h-8 w-10 mx-auto" })), /* @__PURE__ */ React16.createElement("div", { className: "flex-1 grid grid-cols-7" }, Array.from({ length: 7 }).map((_, i) => /* @__PURE__ */ React16.createElement("div", { key: i, className: "py-3 px-2 text-center border-r border-border/30 last:border-r-0" }, /* @__PURE__ */ React16.createElement(Skeleton, { className: "h-3 w-8 mx-auto mb-1" }), /* @__PURE__ */ React16.createElement(Skeleton, { className: "h-8 w-8 mx-auto rounded-xl" }))))), /* @__PURE__ */ React16.createElement("div", { className: "flex flex-1", style: { height: "600px" } }, /* @__PURE__ */ React16.createElement("div", { className: "w-16 border-r border-border/30" }, Array.from({ length: 10 }).map((_, i) => /* @__PURE__ */ React16.createElement("div", { key: i, className: "h-[60px] relative" }, /* @__PURE__ */ React16.createElement(Skeleton, { className: "h-4 w-10 absolute right-2 -translate-y-1/2" })))), /* @__PURE__ */ React16.createElement("div", { className: "flex-1 grid grid-cols-7 relative" }, Array.from({ length: 7 }).map((_, colIdx) => /* @__PURE__ */ React16.createElement("div", { key: colIdx, className: "relative border-r border-border/30 last:border-r-0" }, Array.from({ length: 10 }).map((_2, rowIdx) => /* @__PURE__ */ React16.createElement("div", { key: rowIdx, className: "h-[60px] border-b border-dashed border-border/20" })), Math.random() > 0.3 && /* @__PURE__ */ React16.createElement(
   Skeleton,
   {
@@ -2369,7 +2524,7 @@ var DayViewSkeleton = () => /* @__PURE__ */ React16.createElement("div", { class
 var AgendaViewSkeleton = () => /* @__PURE__ */ React16.createElement("div", { className: "h-full bg-background border border-border/50 rounded-2xl overflow-hidden p-6" }, /* @__PURE__ */ React16.createElement("div", { className: "space-y-6" }, Array.from({ length: 4 }).map((_, dayIdx) => /* @__PURE__ */ React16.createElement("div", { key: dayIdx }, /* @__PURE__ */ React16.createElement(Skeleton, { className: "h-5 w-40 mb-4" }), /* @__PURE__ */ React16.createElement("div", { className: "space-y-3" }, Array.from({ length: 2 + Math.floor(Math.random() * 3) }).map((_2, eventIdx) => /* @__PURE__ */ React16.createElement("div", { key: eventIdx, className: "flex items-center gap-4 p-3 rounded-xl bg-muted/10" }, /* @__PURE__ */ React16.createElement(Skeleton, { className: "h-10 w-10 rounded-lg" }), /* @__PURE__ */ React16.createElement("div", { className: "flex-1 space-y-2" }, /* @__PURE__ */ React16.createElement(Skeleton, { className: "h-4 w-3/4" }), /* @__PURE__ */ React16.createElement(Skeleton, { className: "h-3 w-1/2" })))))))));
 
 // src/components/ContextMenu.tsx
-import React17, { useState as useState4, useCallback as useCallback2, useEffect as useEffect4, useRef as useRef4 } from "react";
+import React17, { useState as useState4, useCallback as useCallback2, useEffect as useEffect4, useRef as useRef5 } from "react";
 import { Edit3, Trash2 as Trash22, Copy } from "lucide-react";
 import { AnimatePresence as AnimatePresence2, motion as motion3 } from "framer-motion";
 var EventContextMenu = ({
@@ -2382,7 +2537,7 @@ var EventContextMenu = ({
   customActions = [],
   translations
 }) => {
-  const menuRef = useRef4(null);
+  const menuRef = useRef5(null);
   useEffect4(() => {
     const handleKeyDown = (e) => {
       if (e.key === "Escape") {
@@ -2673,13 +2828,14 @@ function cachedMonth(event, monthStart, tz) {
 }
 function expandRecurrences(events, range, anchorTz) {
   const result = [];
-  const firstMonth = startOfMonth2(toDisplay(range.start, anchorTz));
   const lastMonth = startOfMonth2(toDisplay(range.end, anchorTz));
   for (const event of events) {
     if (!event.recurrence) {
       result.push(event);
       continue;
     }
+    const duration = event.end.getTime() - event.start.getTime();
+    const firstMonth = startOfMonth2(toDisplay(new Date(range.start.getTime() - duration), anchorTz));
     try {
       for (let month = firstMonth; month <= lastMonth; month = addMonths2(month, 1)) {
         for (const occurrence of cachedMonth(event, fromDisplay(month, anchorTz), anchorTz)) {
@@ -2710,6 +2866,7 @@ function shiftSeries(master, occurrence, newStart, newEnd, anchorTz) {
   const recurrence = master.recurrence && {
     ...master.recurrence,
     byweekday: master.recurrence.byweekday && dayDelta % 7 !== 0 ? master.recurrence.byweekday.map((d) => ((d + dayDelta) % 7 + 7) % 7) : master.recurrence.byweekday,
+    until: master.recurrence.until && shiftFloating(master.recurrence.until, deltaMs, anchorTz),
     exdates: master.recurrence.exdates?.map((d) => shiftFloating(d, deltaMs, anchorTz))
   };
   return stripOccurrenceFields({ ...master, start, end, recurrence });
@@ -2720,10 +2877,12 @@ function excludeOccurrence(master, occurrenceStart) {
 }
 
 // src/hooks/useStableCallback.ts
-import { useCallback as useCallback3, useRef as useRef5 } from "react";
+import { useCallback as useCallback3, useInsertionEffect as useInsertionEffect2, useRef as useRef6 } from "react";
 function useStableCallback(fn) {
-  const ref = useRef5(fn);
-  ref.current = fn;
+  const ref = useRef6(fn);
+  useInsertionEffect2(() => {
+    ref.current = fn;
+  });
   return useCallback3((...args) => ref.current(...args), []);
 }
 
@@ -2904,6 +3063,7 @@ var useCalendarLogic = ({
     return { original: master, updated: shiftSeries(master, event, start, end, timezone) };
   };
   const handleDragEnd = useStableCallback((dragEvent) => {
+    if (readOnly) return;
     const { active, over } = dragEvent;
     if (!over) return;
     const dragged = active.data.current?.event;
@@ -2960,10 +3120,10 @@ var useCalendarLogic = ({
 };
 
 // src/index.tsx
-import { differenceInMinutes as differenceInMinutes6, format as format14 } from "date-fns";
+import { differenceInMinutes as differenceInMinutes6, format as format14, startOfWeek as startOfWeek3 } from "date-fns";
 
 // src/hooks/useSwipeGesture.ts
-import { useRef as useRef6, useCallback as useCallback4, useEffect as useEffect5 } from "react";
+import { useRef as useRef7, useCallback as useCallback4, useEffect as useEffect5 } from "react";
 var useSwipeGesture = (options) => {
   const {
     onSwipeLeft,
@@ -2975,8 +3135,8 @@ var useSwipeGesture = (options) => {
     allowedTime = 500,
     enabled = true
   } = options;
-  const touchInfoRef = useRef6(null);
-  const elementRef = useRef6(null);
+  const touchInfoRef = useRef7(null);
+  const elementRef = useRef7(null);
   const handleTouchStart = useCallback4((e) => {
     if (!enabled) return;
     const touch = e.touches[0];
@@ -3072,6 +3232,7 @@ var Scheduler = ({
   const {
     contextMenuEvent,
     contextMenuPosition,
+    openContextMenu,
     closeContextMenu
   } = useEventContextMenu();
   const {
@@ -3159,14 +3320,15 @@ var Scheduler = ({
     }
     return "150px";
   };
+  const activeCalendarKey = calendars ? calendars.filter((c) => c.active !== false).map((c) => c.id).join("\0") : null;
   const filteredEvents = useMemo4(() => {
-    if (!calendars) return expandedEvents;
-    const activeCalendarIds = calendars.filter((c) => c.active !== false).map((c) => c.id);
-    return expandedEvents.filter((e) => {
-      if (!e.calendarId) return true;
-      return activeCalendarIds.includes(e.calendarId);
-    });
-  }, [expandedEvents, calendars]);
+    if (activeCalendarKey === null) return expandedEvents;
+    const activeCalendarIds = new Set(activeCalendarKey.split("\0"));
+    return expandedEvents.filter((e) => !e.calendarId || activeCalendarIds.has(String(e.calendarId)));
+  }, [expandedEvents, activeCalendarKey]);
+  const periodKey = view === "month" ? format14(currentDate, "yyyy-MM") : view === "week" ? format14(startOfWeek3(currentDate, { weekStartsOn: resolveWeekStartsOn(locale, 1) }), "yyyy-MM-dd") : format14(currentDate, "yyyy-MM-dd");
+  const slotClickHandler = readOnly ? void 0 : handleTimeSlotClick;
+  const contextMenuHandler = readOnly ? void 0 : openContextMenu;
   return /* @__PURE__ */ React18.createElement(
     DndContext,
     {
@@ -3237,7 +3399,7 @@ var Scheduler = ({
       ), /* @__PURE__ */ React18.createElement("div", { className: "flex-1 flex flex-col overflow-hidden relative" }, isLoading ? /* @__PURE__ */ React18.createElement("div", { className: "flex-1 overflow-auto p-0 md:p-4" }, /* @__PURE__ */ React18.createElement("div", { className: "h-full min-w-full" }, view === "month" && /* @__PURE__ */ React18.createElement(MonthViewSkeleton, null), view === "week" && /* @__PURE__ */ React18.createElement(WeekViewSkeleton, null), view === "day" && /* @__PURE__ */ React18.createElement(DayViewSkeleton, null), view === "agenda" && /* @__PURE__ */ React18.createElement(AgendaViewSkeleton, null), view === "resource" && /* @__PURE__ */ React18.createElement(WeekViewSkeleton, null))) : /* @__PURE__ */ React18.createElement("div", { ref: swipeRef, className: "flex-1 overflow-auto p-0 md:p-4 touch-pan-y" }, /* @__PURE__ */ React18.createElement("div", { className: "h-full min-w-full" }, /* @__PURE__ */ React18.createElement(AnimatePresence3, { mode: "wait", initial: false }, /* @__PURE__ */ React18.createElement(
         motion4.div,
         {
-          key: `${view}-${currentDate.toISOString()}-${timezone || "local"}`,
+          key: `${view}-${periodKey}-${timezone || "local"}`,
           initial: { opacity: 0, scale: 0.98, y: 15 },
           animate: {
             opacity: 1,
@@ -3267,7 +3429,9 @@ var Scheduler = ({
             onEventClick: handleEventClickInternal,
             onDateClick: handleDateClick,
             timezone,
-            locale
+            locale,
+            translations: t,
+            onEventContextMenu: contextMenuHandler
           }
         ),
         view === "week" && /* @__PURE__ */ React18.createElement(
@@ -3276,11 +3440,12 @@ var Scheduler = ({
             currentDate,
             events: filteredEvents,
             onEventClick: handleEventClickInternal,
-            onTimeSlotClick: handleTimeSlotClick,
+            onTimeSlotClick: slotClickHandler,
             onEventResize: handleEventResize,
             timezone,
             locale,
-            readonly: readOnly
+            readonly: readOnly,
+            onEventContextMenu: contextMenuHandler
           }
         ),
         view === "day" && /* @__PURE__ */ React18.createElement(
@@ -3289,11 +3454,13 @@ var Scheduler = ({
             currentDate,
             events: filteredEvents,
             onEventClick: handleEventClickInternal,
-            onTimeSlotClick: handleTimeSlotClick,
+            onTimeSlotClick: slotClickHandler,
             onEventResize: handleEventResize,
             timezone,
             locale,
-            readonly: readOnly
+            readonly: readOnly,
+            translations: t,
+            onEventContextMenu: contextMenuHandler
           }
         ),
         view === "agenda" && /* @__PURE__ */ React18.createElement(
@@ -3305,7 +3472,8 @@ var Scheduler = ({
             onCreateEvent: handleCreateEvent,
             locale,
             translations: t,
-            timezone
+            timezone,
+            onEventContextMenu: contextMenuHandler
           }
         ),
         view === "resource" && resources && /* @__PURE__ */ React18.createElement(
@@ -3315,15 +3483,18 @@ var Scheduler = ({
             events: filteredEvents,
             resources,
             onEventClick: handleEventClickInternal,
-            onTimeSlotClick: handleTimeSlotClick,
+            onTimeSlotClick: slotClickHandler,
             locale,
-            timezone
+            timezone,
+            translations: t,
+            onEventContextMenu: contextMenuHandler
           }
         )
-      )))), /* @__PURE__ */ React18.createElement("div", { className: "md:hidden absolute bottom-6 right-6 z-50" }, /* @__PURE__ */ React18.createElement(
+      )))), !readOnly && /* @__PURE__ */ React18.createElement("div", { className: "md:hidden absolute bottom-6 right-6 z-50" }, /* @__PURE__ */ React18.createElement(
         "button",
         {
           onClick: handleCreateEvent,
+          "aria-label": t.createEvent,
           className: "w-14 h-14 bg-blue-600 rounded-full shadow-lg flex items-center justify-center text-white active:scale-90 transition-transform"
         },
         /* @__PURE__ */ React18.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React18.createElement("path", { d: "M5 12h14" }), /* @__PURE__ */ React18.createElement("path", { d: "M12 5v14" }))
@@ -3346,7 +3517,8 @@ var Scheduler = ({
           onDelete: handleModalDelete,
           calendars,
           eventTypes,
-          translations: t
+          translations: t,
+          locale
         }
       ),
       /* @__PURE__ */ React18.createElement(
@@ -3398,7 +3570,7 @@ var Scheduler = ({
             className: "absolute left-0 top-0 bottom-0 w-1 rounded-l-lg",
             style: { backgroundColor: activeDragEvent.color || "var(--primary)" }
           }
-        ), /* @__PURE__ */ React18.createElement("div", { className: "pl-2" }, /* @__PURE__ */ React18.createElement("div", { className: "font-semibold truncate text-sm" }, activeDragEvent.title), (view === "week" || view === "day") && getDragHeight() && getDragHeight() > 40 && /* @__PURE__ */ React18.createElement("div", { className: "text-xs opacity-80 mt-0.5 flex items-center gap-1" }, /* @__PURE__ */ React18.createElement("svg", { className: "w-3 h-3", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ React18.createElement("circle", { cx: "12", cy: "12", r: "10" }), /* @__PURE__ */ React18.createElement("path", { d: "M12 6v6l4 2" })), format14(activeDragEvent.start, overlayTimeFormat, { locale }), " - ", format14(activeDragEvent.end, overlayTimeFormat, { locale }))), /* @__PURE__ */ React18.createElement("div", { className: "absolute bottom-1.5 right-1.5 opacity-60" }, /* @__PURE__ */ React18.createElement("svg", { className: "w-4 h-4", viewBox: "0 0 24 24", fill: "currentColor" }, /* @__PURE__ */ React18.createElement("circle", { cx: "9", cy: "5", r: "1.5" }), /* @__PURE__ */ React18.createElement("circle", { cx: "15", cy: "5", r: "1.5" }), /* @__PURE__ */ React18.createElement("circle", { cx: "9", cy: "12", r: "1.5" }), /* @__PURE__ */ React18.createElement("circle", { cx: "15", cy: "12", r: "1.5" }), /* @__PURE__ */ React18.createElement("circle", { cx: "9", cy: "19", r: "1.5" }), /* @__PURE__ */ React18.createElement("circle", { cx: "15", cy: "19", r: "1.5" }))))
+        ), /* @__PURE__ */ React18.createElement("div", { className: "pl-2" }, /* @__PURE__ */ React18.createElement("div", { className: "font-semibold truncate text-sm" }, activeDragEvent.title), (view === "week" || view === "day") && getDragHeight() && getDragHeight() > 40 && /* @__PURE__ */ React18.createElement("div", { className: "text-xs opacity-80 mt-0.5 flex items-center gap-1" }, /* @__PURE__ */ React18.createElement("svg", { className: "w-3 h-3", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ React18.createElement("circle", { cx: "12", cy: "12", r: "10" }), /* @__PURE__ */ React18.createElement("path", { d: "M12 6v6l4 2" })), format14(toDisplay(activeDragEvent.start, timezone), overlayTimeFormat, { locale }), " - ", format14(toDisplay(activeDragEvent.end, timezone), overlayTimeFormat, { locale }))), /* @__PURE__ */ React18.createElement("div", { className: "absolute bottom-1.5 right-1.5 opacity-60" }, /* @__PURE__ */ React18.createElement("svg", { className: "w-4 h-4", viewBox: "0 0 24 24", fill: "currentColor" }, /* @__PURE__ */ React18.createElement("circle", { cx: "9", cy: "5", r: "1.5" }), /* @__PURE__ */ React18.createElement("circle", { cx: "15", cy: "5", r: "1.5" }), /* @__PURE__ */ React18.createElement("circle", { cx: "9", cy: "12", r: "1.5" }), /* @__PURE__ */ React18.createElement("circle", { cx: "15", cy: "12", r: "1.5" }), /* @__PURE__ */ React18.createElement("circle", { cx: "9", cy: "19", r: "1.5" }), /* @__PURE__ */ React18.createElement("circle", { cx: "15", cy: "19", r: "1.5" }))))
       ) : null)
     )
   );