@underverse-ui/underverse 0.2.88 → 0.2.90

package/dist/index.cjs

@@ -730,6 +730,7 @@ var defaultTranslations = {
       month: "Month",
       week: "Week",
       day: "Day",
+      resourcesHeader: "Resources",
       expandGroup: "Expand group",
       collapseGroup: "Collapse group",
       more: "+{n} more"
@@ -805,6 +806,7 @@ var defaultTranslations = {
       month: "Th\xE1ng",
       week: "Tu\u1EA7n",
       day: "Ng\xE0y",
+      resourcesHeader: "T\xE0i nguy\xEAn",
       expandGroup: "M\u1EDF nh\xF3m",
       collapseGroup: "Thu g\u1ECDn nh\xF3m",
       more: "+{n} th\xEAm"
@@ -880,6 +882,7 @@ var defaultTranslations = {
       month: "\uC6D4",
       week: "\uC8FC",
       day: "\uC77C",
+      resourcesHeader: "\uB9AC\uC18C\uC2A4",
       expandGroup: "\uADF8\uB8F9 \uD3BC\uCE58\uAE30",
       collapseGroup: "\uADF8\uB8F9 \uC811\uAE30",
       more: "+{n}\uAC1C \uB354"
@@ -955,6 +958,7 @@ var defaultTranslations = {
       month: "\u6708",
       week: "\u9031",
       day: "\u65E5",
+      resourcesHeader: "\u30EA\u30BD\u30FC\u30B9",
       expandGroup: "\u30B0\u30EB\u30FC\u30D7\u3092\u5C55\u958B",
       collapseGroup: "\u30B0\u30EB\u30FC\u30D7\u3092\u6298\u308A\u305F\u305F\u3080",
       more: "+{n}\u4EF6"
@@ -5755,11 +5759,6 @@ var ScrollArea = (0, import_react14.forwardRef)(
 );
 ScrollArea.displayName = "ScrollArea";
 
-// ../../components/ui/DatePicker.tsx
-var React23 = __toESM(require("react"), 1);
-var import_react15 = require("react");
-var import_lucide_react14 = require("lucide-react");
-
 // ../../lib/utils/date.ts
 function formatDateShort(date) {
   if (!date) return "";
@@ -5773,6 +5772,9 @@ function formatDateShort(date) {
 }
 
 // ../../components/ui/DatePicker.tsx
+var import_lucide_react14 = require("lucide-react");
+var React23 = __toESM(require("react"), 1);
+var import_react15 = require("react");
 var import_jsx_runtime29 = require("react/jsx-runtime");
 var DatePicker = ({
   id,
@@ -8007,6 +8009,15 @@ function CalendarTimeline({
   resources,
   events,
   size = "md",
+  enableEventSheet,
+  eventSheetSize = "md",
+  renderEventSheet,
+  selectedEventId,
+  defaultSelectedEventId,
+  onSelectedEventIdChange,
+  eventSheetOpen,
+  defaultEventSheetOpen,
+  onEventSheetOpenChange,
   view,
   defaultView = "month",
   onViewChange,
@@ -8047,6 +8058,28 @@ function CalendarTimeline({
   const detectedLocale = useLocale();
   const resolvedLocale = React28.useMemo(() => localeToBCP47(locale ?? detectedLocale), [locale, detectedLocale]);
   const resolvedTimeZone = React28.useMemo(() => timeZone ?? Intl.DateTimeFormat().resolvedOptions().timeZone ?? "UTC", [timeZone]);
+  const effectiveEnableEventSheet = enableEventSheet ?? Boolean(renderEventSheet);
+  const isControlledSelectedEventId = selectedEventId !== void 0;
+  const [internalSelectedEventId, setInternalSelectedEventId] = React28.useState(defaultSelectedEventId ?? null);
+  const activeSelectedEventId = isControlledSelectedEventId ? selectedEventId : internalSelectedEventId;
+  const setSelectedEventId = React28.useCallback(
+    (next) => {
+      if (!isControlledSelectedEventId) setInternalSelectedEventId(next);
+      onSelectedEventIdChange?.(next);
+    },
+    [isControlledSelectedEventId, onSelectedEventIdChange]
+  );
+  const isControlledEventSheetOpen = eventSheetOpen !== void 0;
+  const [internalEventSheetOpen, setInternalEventSheetOpen] = React28.useState(defaultEventSheetOpen ?? false);
+  const activeEventSheetOpen = isControlledEventSheetOpen ? Boolean(eventSheetOpen) : internalEventSheetOpen;
+  const setEventSheetOpen = React28.useCallback(
+    (next) => {
+      if (!isControlledEventSheetOpen) setInternalEventSheetOpen(next);
+      onEventSheetOpenChange?.(next);
+      if (!next) setSelectedEventId(null);
+    },
+    [isControlledEventSheetOpen, onEventSheetOpenChange, setSelectedEventId]
+  );
   const sizeConfig = React28.useMemo(() => {
     const cfgBySize = {
       sm: {
@@ -8263,6 +8296,31 @@ function CalendarTimeline({
     for (const r of resources) map.set(r.id, r);
     return map;
   }, [resources]);
+  const selectedEvent = React28.useMemo(() => {
+    if (!activeSelectedEventId) return null;
+    const found = normalizedEvents.find((e) => e.id === activeSelectedEventId);
+    return found ?? null;
+  }, [activeSelectedEventId, normalizedEvents]);
+  const selectedResource = React28.useMemo(() => {
+    if (!selectedEvent) return void 0;
+    return resourceById.get(selectedEvent.resourceId);
+  }, [resourceById, selectedEvent]);
+  const selectedTimeText = React28.useMemo(() => {
+    if (!selectedEvent) return "";
+    return formatters?.eventTime?.({
+      start: selectedEvent._start,
+      end: selectedEvent._end,
+      locale: resolvedLocale,
+      timeZone: resolvedTimeZone,
+      view: activeView
+    }) ?? defaultEventTime({ start: selectedEvent._start, end: selectedEvent._end, locale: resolvedLocale, timeZone: resolvedTimeZone, view: activeView });
+  }, [activeView, formatters, resolvedLocale, resolvedTimeZone, selectedEvent]);
+  React28.useEffect(() => {
+    if (!effectiveEnableEventSheet) return;
+    if (activeEventSheetOpen && activeSelectedEventId && !selectedEvent) {
+      setEventSheetOpen(false);
+    }
+  }, [activeEventSheetOpen, activeSelectedEventId, effectiveEnableEventSheet, selectedEvent, setEventSheetOpen]);
   const leftRef = React28.useRef(null);
   const bodyRef = React28.useRef(null);
   const headerRef = React28.useRef(null);
@@ -8731,7 +8789,13 @@ function CalendarTimeline({
                               role: "button",
                               tabIndex: 0,
                               "aria-label": aria,
-                              onClick: () => onEventClick?.(ev),
+                              onClick: () => {
+                                onEventClick?.(ev);
+                                if (effectiveEnableEventSheet) {
+                                  setSelectedEventId(ev.id);
+                                  setEventSheetOpen(true);
+                                }
+                              },
                               onDoubleClick: () => onEventDoubleClick?.(ev),
                               onPointerDown: (e) => onPointerDownEvent(e, ev, "move"),
                               children: [
@@ -8797,7 +8861,35 @@ function CalendarTimeline({
               ]
             }
           )
-        ] })
+        ] }),
+        effectiveEnableEventSheet && selectedEvent ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+          Sheet,
+          {
+            open: activeEventSheetOpen,
+            onOpenChange: setEventSheetOpen,
+            side: "right",
+            size: eventSheetSize,
+            title: selectedEvent.title ?? "Event",
+            description: selectedTimeText || void 0,
+            children: renderEventSheet ? renderEventSheet({
+              event: selectedEvent,
+              resource: selectedResource,
+              close: () => setEventSheetOpen(false),
+              locale: resolvedLocale,
+              timeZone: resolvedTimeZone,
+              view: activeView
+            }) : /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "space-y-3", children: [
+              selectedResource?.label ? /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "text-xs text-muted-foreground", children: t("resourcesHeader") }),
+                /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "font-medium", children: selectedResource.label })
+              ] }) : null,
+              /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "text-xs text-muted-foreground", children: "ID" }),
+                /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "font-mono text-xs break-all", children: selectedEvent.id })
+              ] })
+            ] })
+          }
+        ) : null
       ]
     }
   );
@@ -16051,6 +16143,7 @@ var en_default = {
     month: "Month",
     week: "Week",
     day: "Day",
+    resourcesHeader: "Resources",
     expandGroup: "Expand group",
     collapseGroup: "Collapse group",
     more: "+{n} more"
@@ -16137,6 +16230,7 @@ var vi_default = {
     month: "Th\xE1ng",
     week: "Tu\u1EA7n",
     day: "Ng\xE0y",
+    resourcesHeader: "T\xE0i nguy\xEAn",
     expandGroup: "M\u1EDF nh\xF3m",
     collapseGroup: "Thu g\u1ECDn nh\xF3m",
     more: "+{n} th\xEAm"
@@ -16223,6 +16317,7 @@ var ko_default = {
     month: "\uC6D4",
     week: "\uC8FC",
     day: "\uC77C",
+    resourcesHeader: "\uB9AC\uC18C\uC2A4",
     expandGroup: "\uADF8\uB8F9 \uD3BC\uCE58\uAE30",
     collapseGroup: "\uADF8\uB8F9 \uC811\uAE30",
     more: "+{n}\uAC1C \uB354"
@@ -16309,6 +16404,7 @@ var ja_default = {
     month: "\u6708",
     week: "\u9031",
     day: "\u65E5",
+    resourcesHeader: "\u30EA\u30BD\u30FC\u30B9",
     expandGroup: "\u30B0\u30EB\u30FC\u30D7\u3092\u5C55\u958B",
     collapseGroup: "\u30B0\u30EB\u30FC\u30D7\u3092\u6298\u308A\u305F\u305F\u3080",
     more: "+{n}\u4EF6"