@underverse-ui/underverse 0.2.110 → 0.2.112

package/dist/index.js

@@ -8040,8 +8040,10 @@ var DateTimePicker = ({
   const locale = useLocale();
   const [open, setOpen] = React26.useState(false);
   const [tempDate, setTempDate] = React26.useState(value);
+  const [calendarMonth, setCalendarMonth] = React26.useState(() => value ?? /* @__PURE__ */ new Date());
   React26.useEffect(() => {
     setTempDate(value);
+    setCalendarMonth(value ?? /* @__PURE__ */ new Date());
   }, [value, open]);
   const getTimeString = (date) => {
     if (!date) return "";
@@ -8067,6 +8069,7 @@ var DateTimePicker = ({
         }
         return newDate;
       });
+      setCalendarMonth(date);
     }
   };
   const handleTimeChange = (timeStr) => {
@@ -8190,9 +8193,8 @@ var DateTimePicker = ({
                 value: tempDate,
                 onSelect: handleDateSelect,
                 selectMode: "single",
-                month: tempDate,
-                onMonthChange: (m) => {
-                },
+                month: calendarMonth,
+                onMonthChange: setCalendarMonth,
                 minDate,
                 maxDate,
                 className: "border-0 shadow-none w-auto",
@@ -8231,7 +8233,7 @@ var DateTimePicker = ({
 };
 
 // ../../components/ui/CalendarTimeline/CalendarTimeline.tsx
-import * as React31 from "react";
+import * as React32 from "react";
 import { Plus as Plus2 } from "lucide-react";
 
 // ../../components/ui/CalendarTimeline/date.ts
@@ -8693,6 +8695,7 @@ function resourcesById(resources) {
 }
 
 // ../../components/ui/CalendarTimeline/CalendarTimelineHeader.tsx
+import * as React28 from "react";
 import { Calendar as Calendar3, CalendarDays, CalendarRange, ChevronLeft as ChevronLeft4, ChevronRight as ChevronRight5, GripVertical, Plus } from "lucide-react";
 import { jsx as jsx34, jsxs as jsxs29 } from "react/jsx-runtime";
 var VIEW_ICONS = {
@@ -8711,7 +8714,8 @@ function CalendarTimelineHeader(props) {
     activeView,
     sizeConfig,
     navigate,
-    goToday,
+    now,
+    onApplyDateTime,
     setView,
     effectiveResourceColumnWidth,
     canResizeColumn,
@@ -8719,10 +8723,68 @@ function CalendarTimelineHeader(props) {
     headerRef,
     slotHeaderNodes
   } = props;
+  const dt = useTranslations("DateTimePicker");
+  const locale = useLocale();
+  const [todayOpen, setTodayOpen] = React28.useState(false);
+  const [tempDate, setTempDate] = React28.useState(() => now);
+  const [calendarMonth, setCalendarMonth] = React28.useState(() => now);
+  React28.useEffect(() => {
+    if (!todayOpen) return;
+    setTempDate(now);
+    setCalendarMonth(now);
+  }, [now, todayOpen]);
+  const monthLabel = React28.useCallback(
+    (date) => date.toLocaleDateString(locale === "vi" ? "vi-VN" : "en-US", {
+      month: "long",
+      year: "numeric"
+    }),
+    [locale]
+  );
+  const weekdays = React28.useMemo(() => {
+    switch (locale) {
+      case "vi":
+        return ["CN", "T2", "T3", "T4", "T5", "T6", "T7"];
+      case "ko":
+        return ["\uC77C", "\uC6D4", "\uD654", "\uC218", "\uBAA9", "\uAE08", "\uD1A0"];
+      case "ja":
+        return ["\u65E5", "\u6708", "\u706B", "\u6C34", "\u6728", "\u91D1", "\u571F"];
+      default:
+        return ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
+    }
+  }, [locale]);
+  const getTimeString = React28.useCallback((date) => {
+    const h = date.getHours();
+    const m = date.getMinutes();
+    return `${h.toString().padStart(2, "0")}:${m.toString().padStart(2, "0")}`;
+  }, []);
+  const handleDateSelect = React28.useCallback((date) => {
+    if (!(date instanceof Date)) return;
+    setTempDate((prev) => {
+      const next = new Date(date);
+      next.setHours(prev.getHours(), prev.getMinutes(), prev.getSeconds());
+      return next;
+    });
+  }, []);
+  const handleTimeChange = React28.useCallback((timeStr) => {
+    if (!timeStr) return;
+    const [hStr, mStr] = timeStr.split(":");
+    const h = parseInt(hStr, 10);
+    const m = parseInt(mStr, 10);
+    if (!Number.isFinite(h) || !Number.isFinite(m)) return;
+    setTempDate((prev) => {
+      const next = new Date(prev);
+      next.setHours(h, m, prev.getSeconds());
+      return next;
+    });
+  }, []);
+  const applyDateTime = React28.useCallback(() => {
+    onApplyDateTime(tempDate);
+    setTodayOpen(false);
+  }, [onApplyDateTime, tempDate]);
   return /* @__PURE__ */ jsxs29("div", { className: "sticky top-0 z-30 bg-linear-to-b from-background via-background to-background/95 border-b border-border/40 backdrop-blur-xl", children: [
     /* @__PURE__ */ jsxs29("div", { className: cn("flex items-center justify-between gap-4", sizeConfig.headerPaddingClass), children: [
       /* @__PURE__ */ jsxs29("div", { className: "flex items-center gap-1.5 min-w-0", children: [
-        /* @__PURE__ */ jsxs29("div", { className: "flex items-center bg-muted/40 rounded-xl p-1 gap-0.5", children: [
+        /* @__PURE__ */ jsxs29("div", { className: "flex items-center bg-muted/40 rounded-full p-1 gap-0.5", children: [
           /* @__PURE__ */ jsx34(
             Button_default,
             {
@@ -8730,18 +8792,92 @@ function CalendarTimelineHeader(props) {
               size: "icon",
               onClick: () => navigate(-1),
               "aria-label": labels.prev,
-              className: cn(sizeConfig.controlButtonIconClass, "rounded-lg hover:bg-background/80 transition-all duration-200"),
+              className: cn(sizeConfig.controlButtonIconClass, "rounded-full hover:bg-background/80 transition-all duration-200"),
               children: /* @__PURE__ */ jsx34(ChevronLeft4, { className: "h-4 w-4" })
             }
           ),
           /* @__PURE__ */ jsx34(
-            Button_default,
+            Popover,
             {
-              variant: "ghost",
-              size: "sm",
-              onClick: goToday,
-              className: cn(sizeConfig.controlButtonTextClass, "rounded-lg hover:bg-background/80 font-medium transition-all duration-200"),
-              children: labels.today
+              open: todayOpen,
+              onOpenChange: setTodayOpen,
+              placement: "bottom-start",
+              trigger: /* @__PURE__ */ jsx34(
+                Button_default,
+                {
+                  variant: "ghost",
+                  size: "sm",
+                  className: cn(sizeConfig.controlButtonTextClass, "rounded-full hover:bg-background/80 font-medium transition-all duration-200"),
+                  children: labels.today
+                }
+              ),
+              contentClassName: cn(
+                "w-auto p-0 rounded-2xl md:rounded-3xl overflow-hidden"
+              ),
+              children: /* @__PURE__ */ jsxs29("div", { className: "max-w-[calc(100vw-1rem)] max-h-[calc(100vh-6rem)] overflow-auto", children: [
+                /* @__PURE__ */ jsxs29("div", { className: "flex flex-col lg:flex-row divide-y lg:divide-y-0 lg:divide-x divide-border", children: [
+                  /* @__PURE__ */ jsx34("div", { className: "p-2", children: /* @__PURE__ */ jsx34(
+                    Calendar2,
+                    {
+                      value: tempDate,
+                      onSelect: handleDateSelect,
+                      selectMode: "single",
+                      month: calendarMonth,
+                      onMonthChange: setCalendarMonth,
+                      className: "border-0 shadow-none w-auto",
+                      size: "sm",
+                      labels: {
+                        month: monthLabel,
+                        weekdays
+                      }
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsxs29("div", { className: "p-2 flex flex-col gap-3", children: [
+                    /* @__PURE__ */ jsxs29("div", { className: "flex items-center justify-between gap-2", children: [
+                      /* @__PURE__ */ jsx34("div", { className: "text-sm font-semibold text-muted-foreground", children: dt?.("time") || "Time" }),
+                      /* @__PURE__ */ jsx34(
+                        Button_default,
+                        {
+                          variant: "ghost",
+                          size: "sm",
+                          className: "rounded-full text-muted-foreground hover:text-foreground",
+                          onClick: () => setTempDate(now),
+                          children: labels.today
+                        }
+                      )
+                    ] }),
+                    /* @__PURE__ */ jsx34(
+                      TimePicker,
+                      {
+                        variant: "inline",
+                        value: getTimeString(tempDate),
+                        onChange: handleTimeChange,
+                        format: "24",
+                        includeSeconds: false,
+                        clearable: false,
+                        className: "border-0 shadow-none p-0 bg-transparent rounded-none",
+                        size: "sm"
+                      }
+                    )
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsxs29("div", { className: "p-3 border-t border-border flex justify-between items-center bg-muted/20", children: [
+                  /* @__PURE__ */ jsx34(
+                    Button_default,
+                    {
+                      variant: "ghost",
+                      size: "sm",
+                      className: "rounded-full text-muted-foreground hover:text-foreground",
+                      onClick: () => {
+                        setTempDate(now);
+                        setCalendarMonth(now);
+                      },
+                      children: labels.today
+                    }
+                  ),
+                  /* @__PURE__ */ jsx34(Button_default, { size: "sm", onClick: applyDateTime, className: "rounded-full", children: dt?.("done") || "Done" })
+                ] })
+              ] })
             }
           ),
           /* @__PURE__ */ jsx34(
@@ -8751,7 +8887,7 @@ function CalendarTimelineHeader(props) {
               size: "icon",
               onClick: () => navigate(1),
               "aria-label": labels.next,
-              className: cn(sizeConfig.controlButtonIconClass, "rounded-lg hover:bg-background/80 transition-all duration-200"),
+              className: cn(sizeConfig.controlButtonIconClass, "rounded-full hover:bg-background/80 transition-all duration-200"),
               children: /* @__PURE__ */ jsx34(ChevronRight5, { className: "h-4 w-4" })
             }
           )
@@ -8767,11 +8903,11 @@ function CalendarTimelineHeader(props) {
             icon: Plus,
             disabled: newEventDisabled,
             onClick: onNewEventClick,
-            className: cn(sizeConfig.controlButtonTextClass, "rounded-lg font-medium transition-all duration-200 gap-1.5"),
+            className: cn(sizeConfig.controlButtonTextClass, "rounded-full font-medium transition-all duration-200 gap-1.5"),
             children: /* @__PURE__ */ jsx34("span", { className: "hidden sm:inline", children: newEventLabel })
           }
         ) : null,
-        /* @__PURE__ */ jsx34("div", { className: "flex items-center bg-muted/40 rounded-xl p-1 gap-0.5", children: ["month", "week", "day"].map((v) => /* @__PURE__ */ jsxs29(
+        /* @__PURE__ */ jsx34("div", { className: "flex items-center bg-muted/40 rounded-full p-1 gap-0.5", children: ["month", "week", "day"].map((v) => /* @__PURE__ */ jsxs29(
           Button_default,
           {
             variant: activeView === v ? "default" : "ghost",
@@ -8779,7 +8915,7 @@ function CalendarTimelineHeader(props) {
             onClick: () => setView(v),
             className: cn(
               sizeConfig.controlButtonTextClass,
-              "rounded-lg font-medium transition-all duration-200 gap-1.5",
+              "rounded-full font-medium transition-all duration-200 gap-1.5",
               activeView === v ? "bg-primary text-primary-foreground shadow-sm shadow-primary/25" : "hover:bg-background/80 text-muted-foreground hover:text-foreground"
             ),
             children: [
@@ -8904,9 +9040,9 @@ function ResourceRowCell(props) {
 }
 
 // ../../components/ui/CalendarTimeline/CalendarTimelineGridOverlay.tsx
-import * as React28 from "react";
+import * as React29 from "react";
 import { jsx as jsx36, jsxs as jsxs31 } from "react/jsx-runtime";
-var CalendarTimelineGridOverlay = React28.memo(function CalendarTimelineGridOverlay2(props) {
+var CalendarTimelineGridOverlay = React29.memo(function CalendarTimelineGridOverlay2(props) {
   const { gridWidth, height, slotLefts, slotWidths, activeView, todaySlotIdx, dayAnchor, weekendSlotIdxs, visibleStartIdx, visibleEndIdx, className } = props;
   const startIdx = Math.max(0, visibleStartIdx ?? 0);
   const endIdx = Math.min(slotWidths.length, visibleEndIdx ?? slotWidths.length);
@@ -8935,19 +9071,19 @@ var CalendarTimelineGridOverlay = React28.memo(function CalendarTimelineGridOver
     slotLefts.slice(startIdx, endIdx).map((left, j) => {
       const i = startIdx + j;
       const isAnchor = dayAnchor ? Boolean(dayAnchor[i]) : true;
-      const opacityClass = activeView === "day" && dayAnchor ? isAnchor ? "bg-border/25" : "bg-border/10" : "bg-border/20";
+      const opacityClass = activeView === "day" && dayAnchor ? isAnchor ? "bg-border/35" : "bg-border/15" : "bg-border/30";
       return /* @__PURE__ */ jsx36("div", { className: cn("absolute top-0 h-full w-px", opacityClass), style: { left }, "aria-hidden": true }, i);
     })
   ] });
 });
 
 // ../../components/ui/CalendarTimeline/CalendarTimelineSlotHeaderCell.tsx
-import * as React29 from "react";
+import * as React30 from "react";
 import { Dot } from "lucide-react";
 import { jsx as jsx37, jsxs as jsxs32 } from "react/jsx-runtime";
-var CalendarTimelineSlotHeaderCell = React29.memo(function CalendarTimelineSlotHeaderCell2(props) {
+var CalendarTimelineSlotHeaderCell = React30.memo(function CalendarTimelineSlotHeaderCell2(props) {
   const { width, activeView, isToday: isToday2, label, ariaLabel, borderClassName, dayHeaderMarks, idx, className } = props;
-  const content = React29.useMemo(() => {
+  const content = React30.useMemo(() => {
     if (activeView === "day" && dayHeaderMarks) {
       if (dayHeaderMarks.showEllipsis[idx]) return /* @__PURE__ */ jsx37("span", { className: "text-xs text-muted-foreground/70 select-none", children: "\u2026" });
       if (!dayHeaderMarks.showTime[idx]) return null;
@@ -8970,7 +9106,7 @@ var CalendarTimelineSlotHeaderCell = React29.memo(function CalendarTimelineSlotH
 });
 
 // ../../components/ui/CalendarTimeline/internal-hooks.ts
-import * as React30 from "react";
+import * as React31 from "react";
 function useTimelineSlots(args) {
   const {
     activeView,
@@ -8984,7 +9120,7 @@ function useTimelineSlots(args) {
     resolvedNow,
     formatters
   } = args;
-  const { slots, range } = React30.useMemo(() => {
+  const { slots, range } = React31.useMemo(() => {
     const { start, end, slotStarts: slotStarts2 } = computeSlotStarts({
       view: activeView,
       date: activeDate,
@@ -9006,9 +9142,9 @@ function useTimelineSlots(args) {
     }));
     return { slots: slotItems, range: { start, end } };
   }, [activeView, activeDate, dayRangeMode, dayTimeStepMinutes, formatters, resolvedLocale, resolvedNow, resolvedTimeZone, weekStartsOn, workHours]);
-  const slotStarts = React30.useMemo(() => slots.map((s) => s.start), [slots]);
-  const todaySlotIdx = React30.useMemo(() => slots.findIndex((s) => s.isToday), [slots]);
-  const weekendSlotIdxs = React30.useMemo(() => {
+  const slotStarts = React31.useMemo(() => slots.map((s) => s.start), [slots]);
+  const todaySlotIdx = React31.useMemo(() => slots.findIndex((s) => s.isToday), [slots]);
+  const weekendSlotIdxs = React31.useMemo(() => {
     const out = [];
     for (let i = 0; i < slots.length; i++) if (slots[i]?.isWeekend) out.push(i);
     return out;
@@ -9017,16 +9153,16 @@ function useTimelineSlots(args) {
 }
 function useNormalizedEvents(args) {
   const { events, range, activeView, resolvedTimeZone, resources } = args;
-  const normalizedEvents = React30.useMemo(() => {
+  const normalizedEvents = React31.useMemo(() => {
     return normalizeEvents({ events, range, view: activeView, timeZone: resolvedTimeZone });
   }, [activeView, events, range, resolvedTimeZone]);
-  const eventsByResource = React30.useMemo(() => eventsByResourceId(normalizedEvents), [normalizedEvents]);
-  const resourceById = React30.useMemo(() => resourcesById(resources), [resources]);
+  const eventsByResource = React31.useMemo(() => eventsByResourceId(normalizedEvents), [normalizedEvents]);
+  const resourceById = React31.useMemo(() => resourcesById(resources), [resources]);
   return { normalizedEvents, eventsByResource, resourceById };
 }
 function useDayHeaderMarks(args) {
   const { enabled, activeView, normalizedEvents, slotStarts, slotCount } = args;
-  return React30.useMemo(() => {
+  return React31.useMemo(() => {
     if (!enabled) return null;
     if (activeView !== "day") return null;
     const n = slotCount;
@@ -9061,14 +9197,14 @@ function useSlotMetrics(args) {
     dayHeaderSmart,
     daySlotCompression
   } = args;
-  const fixedSlotWidth = React30.useMemo(() => {
+  const fixedSlotWidth = React31.useMemo(() => {
     const baseSlotWidth = activeView === "month" || activeView === "day" ? effectiveSlotMinWidth * 3 : effectiveSlotMinWidth;
     if (activeView !== "week") return baseSlotWidth;
     if (bodyClientWidth <= 0) return baseSlotWidth;
     if (slotsLength <= 0) return baseSlotWidth;
     return Math.max(baseSlotWidth, bodyClientWidth / slotsLength);
   }, [activeView, bodyClientWidth, effectiveSlotMinWidth, slotsLength]);
-  const slotMetrics = React30.useMemo(() => {
+  const slotMetrics = React31.useMemo(() => {
     const n = slotsLength;
     const widths = new Array(n).fill(fixedSlotWidth);
     const isAdaptiveView = activeView === "month" || activeView === "day";
@@ -9198,7 +9334,7 @@ function useSlotMetrics(args) {
 }
 function useLayoutsByResource(args) {
   const { eventsByResource, preview, slotStarts, slotsLength, slotLefts, getResourceRowHeight, laneGap, lanePaddingY, effectiveMaxLanesPerRow, eventHeight } = args;
-  return React30.useMemo(() => {
+  return React31.useMemo(() => {
     const map = /* @__PURE__ */ new Map();
     for (const [resourceId, list] of eventsByResource.entries()) {
       const mapped = list.map((ev) => {
@@ -9245,9 +9381,9 @@ function lowerBound2(arr, target) {
 }
 function useVisibleSlotRange(args) {
   const { enabled, overscan, scrollRef, slotLefts, slotCount } = args;
-  const [scrollLeft, setScrollLeft] = React30.useState(0);
-  const [viewportWidth, setViewportWidth] = React30.useState(0);
-  React30.useEffect(() => {
+  const [scrollLeft, setScrollLeft] = React31.useState(0);
+  const [viewportWidth, setViewportWidth] = React31.useState(0);
+  React31.useEffect(() => {
     if (!enabled) return;
     const el = scrollRef.current;
     if (!el) return;
@@ -9262,7 +9398,7 @@ function useVisibleSlotRange(args) {
       el.removeEventListener("scroll", onScroll);
     };
   }, [enabled, scrollRef]);
-  return React30.useMemo(() => {
+  return React31.useMemo(() => {
     if (!enabled) return { startIdx: 0, endIdx: slotCount };
     if (slotCount <= 0) return { startIdx: 0, endIdx: 0 };
     if (viewportWidth <= 0) return { startIdx: 0, endIdx: slotCount };
@@ -9354,14 +9490,14 @@ function CalendarTimeline({
 }) {
   const t = useTranslations("CalendarTimeline");
   const detectedLocale = useLocale();
-  const resolvedLocale = React31.useMemo(() => localeToBCP47(locale ?? detectedLocale), [locale, detectedLocale]);
-  const resolvedTimeZone = React31.useMemo(() => timeZone ?? Intl.DateTimeFormat().resolvedOptions().timeZone ?? "UTC", [timeZone]);
+  const resolvedLocale = React32.useMemo(() => localeToBCP47(locale ?? detectedLocale), [locale, detectedLocale]);
+  const resolvedTimeZone = React32.useMemo(() => timeZone ?? Intl.DateTimeFormat().resolvedOptions().timeZone ?? "UTC", [timeZone]);
   const effectiveEnableEventSheet = enableEventSheet ?? Boolean(renderEventSheet);
   const isViewOnly = interactions?.mode === "view";
   const isControlledSelectedEventId = selectedEventId !== void 0;
-  const [internalSelectedEventId, setInternalSelectedEventId] = React31.useState(defaultSelectedEventId ?? null);
+  const [internalSelectedEventId, setInternalSelectedEventId] = React32.useState(defaultSelectedEventId ?? null);
   const activeSelectedEventId = isControlledSelectedEventId ? selectedEventId : internalSelectedEventId;
-  const setSelectedEventId = React31.useCallback(
+  const setSelectedEventId = React32.useCallback(
     (next) => {
       if (!isControlledSelectedEventId) setInternalSelectedEventId(next);
       onSelectedEventIdChange?.(next);
@@ -9369,9 +9505,9 @@ function CalendarTimeline({
     [isControlledSelectedEventId, onSelectedEventIdChange]
   );
   const isControlledEventSheetOpen = eventSheetOpen !== void 0;
-  const [internalEventSheetOpen, setInternalEventSheetOpen] = React31.useState(defaultEventSheetOpen ?? false);
+  const [internalEventSheetOpen, setInternalEventSheetOpen] = React32.useState(defaultEventSheetOpen ?? false);
   const activeEventSheetOpen = isControlledEventSheetOpen ? Boolean(eventSheetOpen) : internalEventSheetOpen;
-  const setEventSheetOpen = React31.useCallback(
+  const setEventSheetOpen = React32.useCallback(
     (next) => {
       if (!isControlledEventSheetOpen) setInternalEventSheetOpen(next);
       onEventSheetOpenChange?.(next);
@@ -9379,19 +9515,19 @@ function CalendarTimeline({
     },
     [isControlledEventSheetOpen, onEventSheetOpenChange, setSelectedEventId]
   );
-  const sizeConfig = React31.useMemo(() => getSizeConfig(size), [size]);
+  const sizeConfig = React32.useMemo(() => getSizeConfig(size), [size]);
   const densityClass = sizeConfig.densityClass;
   const eventHeight = sizeConfig.eventHeight;
   const laneGap = sizeConfig.laneGap;
   const lanePaddingY = sizeConfig.lanePaddingY;
-  const canResizeColumn = React31.useMemo(() => {
+  const canResizeColumn = React32.useMemo(() => {
     const cfg = enableLayoutResize;
     if (!cfg) return false;
     if (isViewOnly) return false;
     if (cfg === true) return true;
     return cfg.column !== false;
   }, [enableLayoutResize, isViewOnly]);
-  const canResizeRow = React31.useMemo(() => {
+  const canResizeRow = React32.useMemo(() => {
     const cfg = enableLayoutResize;
     if (!cfg) return false;
     if (isViewOnly) return false;
@@ -9399,19 +9535,19 @@ function CalendarTimeline({
     return cfg.row !== false;
   }, [enableLayoutResize, isViewOnly]);
   const isControlledResourceColumnWidth = resourceColumnWidth !== void 0;
-  const [internalResourceColumnWidth, setInternalResourceColumnWidth] = React31.useState(() => {
+  const [internalResourceColumnWidth, setInternalResourceColumnWidth] = React32.useState(() => {
     const init = defaultResourceColumnWidth ?? sizeConfig.resourceColumnWidth;
     return typeof init === "number" ? init : sizeConfig.resourceColumnWidth;
   });
-  React31.useEffect(() => {
+  React32.useEffect(() => {
     if (isControlledResourceColumnWidth) return;
     if (defaultResourceColumnWidth == null) return;
     setInternalResourceColumnWidth(defaultResourceColumnWidth);
   }, [defaultResourceColumnWidth, isControlledResourceColumnWidth]);
   const effectiveResourceColumnWidth = isControlledResourceColumnWidth ? resourceColumnWidth : internalResourceColumnWidth;
   const isControlledRowHeight = rowHeight !== void 0;
-  const [internalRowHeight, setInternalRowHeight] = React31.useState(() => defaultRowHeight ?? sizeConfig.rowHeight);
-  React31.useEffect(() => {
+  const [internalRowHeight, setInternalRowHeight] = React32.useState(() => defaultRowHeight ?? sizeConfig.rowHeight);
+  React32.useEffect(() => {
     if (isControlledRowHeight) return;
     if (defaultRowHeight == null) return;
     setInternalRowHeight(defaultRowHeight);
@@ -9423,13 +9559,13 @@ function CalendarTimeline({
   const rowMin = minRowHeight ?? 36;
   const rowMax = maxRowHeight ?? 120;
   const isControlledView = view !== void 0;
-  const [internalView, setInternalView] = React31.useState(defaultView);
+  const [internalView, setInternalView] = React32.useState(defaultView);
   const activeView = isControlledView ? view : internalView;
   const isControlledDate = date !== void 0;
-  const [internalDate, setInternalDate] = React31.useState(() => defaultDate ?? /* @__PURE__ */ new Date());
+  const [internalDate, setInternalDate] = React32.useState(() => defaultDate ?? /* @__PURE__ */ new Date());
   const activeDate = isControlledDate ? date : internalDate;
-  const resolvedNow = now ?? /* @__PURE__ */ new Date();
-  const l = React31.useMemo(
+  const resolvedNow = React32.useMemo(() => now ?? /* @__PURE__ */ new Date(), [now]);
+  const l = React32.useMemo(
     () => ({
       today: labels?.today ?? t("today"),
       prev: labels?.prev ?? t("prev"),
@@ -9451,21 +9587,21 @@ function CalendarTimeline({
     }),
     [labels, t]
   );
-  const setView = React31.useCallback(
+  const setView = React32.useCallback(
     (next) => {
       if (!isControlledView) setInternalView(next);
       onViewChange?.(next);
     },
     [isControlledView, onViewChange]
   );
-  const setDate = React31.useCallback(
+  const setDate = React32.useCallback(
     (next) => {
       if (!isControlledDate) setInternalDate(next);
       onDateChange?.(next);
     },
     [isControlledDate, onDateChange]
   );
-  const navigate = React31.useCallback(
+  const navigate = React32.useCallback(
     (dir) => {
       const base = activeDate;
       if (activeView === "month") {
@@ -9480,18 +9616,17 @@ function CalendarTimeline({
     },
     [activeDate, activeView, resolvedTimeZone, setDate]
   );
-  const goToday = React31.useCallback(() => setDate(resolvedNow), [resolvedNow, setDate]);
-  const [internalCollapsed, setInternalCollapsed] = React31.useState(() => defaultGroupCollapsed ?? {});
+  const [internalCollapsed, setInternalCollapsed] = React32.useState(() => defaultGroupCollapsed ?? {});
   const collapsed = groupCollapsed ?? internalCollapsed;
-  const setCollapsed = React31.useCallback(
+  const setCollapsed = React32.useCallback(
     (next) => {
       if (!groupCollapsed) setInternalCollapsed(next);
       onGroupCollapsedChange?.(next);
     },
     [groupCollapsed, onGroupCollapsedChange]
   );
-  const rows = React31.useMemo(() => buildRows({ resources, groups, collapsed }), [resources, groups, collapsed]);
-  const groupResourceCounts = React31.useMemo(() => getGroupResourceCounts(resources), [resources]);
+  const rows = React32.useMemo(() => buildRows({ resources, groups, collapsed }), [resources, groups, collapsed]);
+  const groupResourceCounts = React32.useMemo(() => getGroupResourceCounts(resources), [resources]);
   const { slots, range, slotStarts, todaySlotIdx, weekendSlotIdxs } = useTimelineSlots({
     activeView,
     activeDate,
@@ -9504,12 +9639,12 @@ function CalendarTimeline({
     resolvedNow,
     formatters
   });
-  React31.useEffect(() => {
+  React32.useEffect(() => {
     onRangeChange?.(range);
   }, [range.start, range.end, onRangeChange]);
-  const leftRef = React31.useRef(null);
-  const bodyRef = React31.useRef(null);
-  const headerRef = React31.useRef(null);
+  const leftRef = React32.useRef(null);
+  const bodyRef = React32.useRef(null);
+  const headerRef = React32.useRef(null);
   const bodyClientWidth = useClientWidth(bodyRef);
   const { normalizedEvents, eventsByResource, resourceById } = useNormalizedEvents({
     events,
@@ -9541,16 +9676,16 @@ function CalendarTimeline({
     slotLefts,
     slotCount: slots.length
   });
-  const selectedEvent = React31.useMemo(() => {
+  const selectedEvent = React32.useMemo(() => {
     if (!activeSelectedEventId) return null;
     const found = normalizedEvents.find((e) => e.id === activeSelectedEventId);
     return found ?? null;
   }, [activeSelectedEventId, normalizedEvents]);
-  const selectedResource = React31.useMemo(() => {
+  const selectedResource = React32.useMemo(() => {
     if (!selectedEvent) return void 0;
     return resourceById.get(selectedEvent.resourceId);
   }, [resourceById, selectedEvent]);
-  const selectedTimeText = React31.useMemo(() => {
+  const selectedTimeText = React32.useMemo(() => {
     if (!selectedEvent) return "";
     return formatters?.eventTime?.({
       start: selectedEvent._start,
@@ -9560,7 +9695,7 @@ function CalendarTimeline({
       view: activeView
     }) ?? defaultEventTime({ start: selectedEvent._start, end: selectedEvent._end, locale: resolvedLocale, timeZone: resolvedTimeZone, view: activeView });
   }, [activeView, formatters, resolvedLocale, resolvedTimeZone, selectedEvent]);
-  React31.useEffect(() => {
+  React32.useEffect(() => {
     if (!effectiveEnableEventSheet) return;
     if (activeEventSheetOpen && activeSelectedEventId && !selectedEvent) {
       setEventSheetOpen(false);
@@ -9570,24 +9705,24 @@ function CalendarTimeline({
   const virt = virtualization?.enabled;
   const overscan = virtualization?.overscan ?? 8;
   const isControlledRowHeights = rowHeights !== void 0;
-  const [internalRowHeights, setInternalRowHeights] = React31.useState(() => defaultRowHeights ?? {});
-  React31.useEffect(() => {
+  const [internalRowHeights, setInternalRowHeights] = React32.useState(() => defaultRowHeights ?? {});
+  React32.useEffect(() => {
     if (isControlledRowHeights) return;
     if (!defaultRowHeights) return;
     setInternalRowHeights(defaultRowHeights);
   }, [defaultRowHeights, isControlledRowHeights]);
   const activeRowHeights = isControlledRowHeights ? rowHeights : internalRowHeights;
-  const autoRowHeightCfg = React31.useMemo(() => {
+  const autoRowHeightCfg = React32.useMemo(() => {
     if (!autoRowHeight) return null;
     return autoRowHeight === true ? {} : autoRowHeight;
   }, [autoRowHeight]);
-  const effectiveMaxLanesPerRow = React31.useMemo(() => {
+  const effectiveMaxLanesPerRow = React32.useMemo(() => {
     if (!autoRowHeightCfg) return maxLanesPerRow;
     const maxLanes = autoRowHeightCfg.maxLanesPerRow;
     if (typeof maxLanes === "number" && Number.isFinite(maxLanes) && maxLanes > 0) return Math.floor(maxLanes);
     return Number.POSITIVE_INFINITY;
   }, [autoRowHeightCfg, maxLanesPerRow]);
-  const autoRowHeightsByResource = React31.useMemo(() => {
+  const autoRowHeightsByResource = React32.useMemo(() => {
     if (!autoRowHeightCfg) return null;
     const maxRowHeight2 = autoRowHeightCfg.maxRowHeight;
     const out = /* @__PURE__ */ new Map();
@@ -9605,7 +9740,7 @@ function CalendarTimeline({
     }
     return out;
   }, [autoRowHeightCfg, eventHeight, eventsByResource, laneGap, lanePaddingY, slotStarts, slots.length, effectiveMaxLanesPerRow]);
-  const getResourceRowHeight = React31.useCallback(
+  const getResourceRowHeight = React32.useCallback(
     (resourceId) => {
       const h = activeRowHeights[resourceId];
       const base = typeof h === "number" && Number.isFinite(h) && h > 0 ? h : effectiveRowHeight;
@@ -9615,7 +9750,7 @@ function CalendarTimeline({
     },
     [activeRowHeights, autoRowHeightsByResource, effectiveRowHeight]
   );
-  const setRowHeightForResource = React31.useCallback(
+  const setRowHeightForResource = React32.useCallback(
     (resourceId, height) => {
       const clamped = clamp4(Math.round(height), rowMin, rowMax);
       onRowHeightChange?.(clamped);
@@ -9632,7 +9767,7 @@ function CalendarTimeline({
     },
     [activeRowHeights, isControlledRowHeights, onRowHeightChange, onRowHeightsChange, rowMax, rowMin]
   );
-  const rowHeightsArray = React31.useMemo(() => {
+  const rowHeightsArray = React32.useMemo(() => {
     return rows.map((r) => {
       if (r.kind === "resource") return getResourceRowHeight(r.resource.id);
       return sizeConfig.groupRowHeight;
@@ -9648,13 +9783,13 @@ function CalendarTimeline({
   const endRow = virt ? virtualResult.endIndex : rows.length;
   const topSpacer = virt ? virtualResult.topSpacer : 0;
   const bottomSpacer = virt ? virtualResult.bottomSpacer : 0;
-  const renderedRowsHeight = React31.useMemo(() => {
+  const renderedRowsHeight = React32.useMemo(() => {
     let h = 0;
     for (let i = startRow; i < endRow; i++) h += rowHeightsArray[i] ?? effectiveRowHeight;
     return h;
   }, [effectiveRowHeight, endRow, rowHeightsArray, startRow]);
-  const resizeRef = React31.useRef(null);
-  const setResourceColumnWidth = React31.useCallback(
+  const resizeRef = React32.useRef(null);
+  const setResourceColumnWidth = React32.useCallback(
     (next) => {
       const clamped = clamp4(Math.round(next), colMin, colMax);
       if (!isControlledResourceColumnWidth) setInternalResourceColumnWidth(clamped);
@@ -9662,7 +9797,7 @@ function CalendarTimeline({
     },
     [colMax, colMin, isControlledResourceColumnWidth, onResourceColumnWidthChange]
   );
-  const startResize = React31.useCallback(
+  const startResize = React32.useCallback(
     (mode, e, args) => {
       if (e.button !== 0 || e.ctrlKey) return;
       resizeRef.current = {
@@ -9705,7 +9840,7 @@ function CalendarTimeline({
     },
     [setResourceColumnWidth, setRowHeightForResource]
   );
-  React31.useEffect(() => {
+  React32.useEffect(() => {
     return () => {
       if (!resizeRef.current) return;
       resizeRef.current = null;
@@ -9713,7 +9848,7 @@ function CalendarTimeline({
       document.body.style.userSelect = "";
     };
   }, []);
-  const beginResizeColumn = React31.useCallback(
+  const beginResizeColumn = React32.useCallback(
     (e) => {
       if (!canResizeColumn) return;
       if (typeof effectiveResourceColumnWidth !== "number") return;
@@ -9721,7 +9856,7 @@ function CalendarTimeline({
     },
     [canResizeColumn, effectiveResourceColumnWidth, effectiveRowHeight, startResize]
   );
-  const beginResizeResourceRow = React31.useCallback(
+  const beginResizeResourceRow = React32.useCallback(
     (resourceId) => (e) => {
       if (!canResizeRow) return;
       startResize("row", e, {
@@ -9732,7 +9867,7 @@ function CalendarTimeline({
     },
     [canResizeRow, effectiveResourceColumnWidth, getResourceRowHeight, startResize]
   );
-  const title = React31.useMemo(() => {
+  const title = React32.useMemo(() => {
     if (activeView === "month") {
       return formatters?.monthTitle?.(activeDate, { locale: resolvedLocale, timeZone: resolvedTimeZone }) ?? defaultMonthTitle(activeDate, resolvedLocale, resolvedTimeZone);
     }
@@ -9753,11 +9888,11 @@ function CalendarTimeline({
   }, [activeDate, activeView, formatters, l.week, range.end, range.start, resolvedLocale, resolvedTimeZone]);
   const createMode = interactions?.createMode ?? "drag";
   const canCreate = !isViewOnly && (interactions?.creatable ?? false) && !!onCreateEvent;
-  const [createOpen, setCreateOpen] = React31.useState(false);
-  const [createResourceId, setCreateResourceId] = React31.useState(null);
-  const [createStartIdx, setCreateStartIdx] = React31.useState(0);
-  const [createEndIdx, setCreateEndIdx] = React31.useState(1);
-  const resourceOptions = React31.useMemo(() => {
+  const [createOpen, setCreateOpen] = React32.useState(false);
+  const [createResourceId, setCreateResourceId] = React32.useState(null);
+  const [createStartIdx, setCreateStartIdx] = React32.useState(0);
+  const [createEndIdx, setCreateEndIdx] = React32.useState(1);
+  const resourceOptions = React32.useMemo(() => {
     return resources.map((r) => ({
       label: typeof r.label === "string" ? r.label : r.id,
       value: r.id,
@@ -9765,12 +9900,12 @@ function CalendarTimeline({
       disabled: r.disabled ?? false
     }));
   }, [resources]);
-  const slotPickerLabel = React31.useMemo(() => {
+  const slotPickerLabel = React32.useMemo(() => {
     const timeFmt = getDtf(resolvedLocale, resolvedTimeZone, { hour: "2-digit", minute: "2-digit", hourCycle: "h23" });
     const dayFmt = getDtf(resolvedLocale, resolvedTimeZone, { weekday: "short", month: "short", day: "numeric" });
     return (d) => activeView === "day" ? timeFmt.format(d) : dayFmt.format(d);
   }, [activeView, resolvedLocale, resolvedTimeZone]);
-  const openCreate = React31.useCallback(() => {
+  const openCreate = React32.useCallback(() => {
     if (!canCreate) return;
     if (activeEventSheetOpen) setEventSheetOpen(false);
     const firstResource = resources.find((r) => !r.disabled)?.id ?? resources[0]?.id ?? null;
@@ -9802,13 +9937,13 @@ function CalendarTimeline({
     slotStarts,
     slots.length
   ]);
-  React31.useEffect(() => {
+  React32.useEffect(() => {
     setCreateEndIdx((prev) => Math.min(slots.length, Math.max(prev, createStartIdx + 1)));
   }, [createStartIdx, slots.length]);
-  const createStartOptions = React31.useMemo(() => {
+  const createStartOptions = React32.useMemo(() => {
     return slotStarts.map((d, idx) => ({ label: slotPickerLabel(d), value: idx }));
   }, [slotStarts, slotPickerLabel]);
-  const createEndOptions = React31.useMemo(() => {
+  const createEndOptions = React32.useMemo(() => {
     const out = [];
     for (let idx = createStartIdx + 1; idx <= slotStarts.length; idx++) {
       const boundary = idx >= slotStarts.length ? range.end : slotStarts[idx];
@@ -9816,7 +9951,7 @@ function CalendarTimeline({
     }
     return out;
   }, [createStartIdx, range.end, slotPickerLabel, slotStarts]);
-  const commitCreate = React31.useCallback(() => {
+  const commitCreate = React32.useCallback(() => {
     if (!onCreateEvent) return;
     if (!createResourceId) return;
     const start = slotStarts[clamp4(createStartIdx, 0, Math.max(0, slotStarts.length - 1))];
@@ -9827,24 +9962,24 @@ function CalendarTimeline({
     onCreateEvent({ resourceId: createResourceId, start, end: endBoundary });
     setCreateOpen(false);
   }, [createEndIdx, createResourceId, createStartIdx, onCreateEvent, range.end, slotStarts]);
-  const dragRef = React31.useRef(null);
-  const [preview, setPreview] = React31.useState(null);
-  const suppressNextEventClickRef = React31.useRef(false);
-  const [hoverCell, setHoverCell] = React31.useState(null);
-  const autoScrollStateRef = React31.useRef({
+  const dragRef = React32.useRef(null);
+  const [preview, setPreview] = React32.useState(null);
+  const suppressNextEventClickRef = React32.useRef(false);
+  const [hoverCell, setHoverCell] = React32.useState(null);
+  const autoScrollStateRef = React32.useRef({
     dir: 0,
     speed: 0,
     lastClientX: 0,
     lastClientY: 0
   });
-  const autoScrollRafRef = React31.useRef(null);
-  const stopAutoScroll = React31.useCallback(() => {
+  const autoScrollRafRef = React32.useRef(null);
+  const stopAutoScroll = React32.useCallback(() => {
     if (autoScrollRafRef.current != null) cancelAnimationFrame(autoScrollRafRef.current);
     autoScrollRafRef.current = null;
     autoScrollStateRef.current.dir = 0;
     autoScrollStateRef.current.speed = 0;
   }, []);
-  const getPointerContext = React31.useCallback(
+  const getPointerContext = React32.useCallback(
     (clientX, clientY, opts) => {
       const body = bodyRef.current;
       if (!body) return null;
@@ -9862,7 +9997,7 @@ function CalendarTimeline({
     },
     [xToSlotIdx]
   );
-  const slotToDate = React31.useCallback(
+  const slotToDate = React32.useCallback(
     (slotIdx) => {
       const start = slotStarts[clamp4(slotIdx, 0, slotStarts.length - 1)];
       if (activeView === "day") {
@@ -9873,7 +10008,7 @@ function CalendarTimeline({
     },
     [activeView, dayTimeStepMinutes, resolvedTimeZone, slotStarts]
   );
-  const updateDragPreview = React31.useCallback(
+  const updateDragPreview = React32.useCallback(
     (clientX, clientY) => {
       const drag = dragRef.current;
       if (!drag) return;
@@ -9917,7 +10052,7 @@ function CalendarTimeline({
     },
     [getPointerContext, range.end, range.start, slotToDate, slots.length]
   );
-  const autoScrollTick = React31.useCallback(() => {
+  const autoScrollTick = React32.useCallback(() => {
     const drag = dragRef.current;
     const body = bodyRef.current;
     const st = autoScrollStateRef.current;
@@ -9936,7 +10071,7 @@ function CalendarTimeline({
     updateDragPreview(st.lastClientX, st.lastClientY);
     autoScrollRafRef.current = requestAnimationFrame(autoScrollTick);
   }, [stopAutoScroll, updateDragPreview]);
-  const updateAutoScrollFromPointer = React31.useCallback(
+  const updateAutoScrollFromPointer = React32.useCallback(
     (clientX, clientY) => {
       const body = bodyRef.current;
       if (!body) return;
@@ -9967,7 +10102,7 @@ function CalendarTimeline({
     },
     [autoScrollTick, stopAutoScroll]
   );
-  React31.useEffect(() => stopAutoScroll, [stopAutoScroll]);
+  React32.useEffect(() => stopAutoScroll, [stopAutoScroll]);
   const onPointerDownEvent = (e, ev, mode) => {
     if (e.button !== 0 || e.ctrlKey) return;
     if (isViewOnly) return;
@@ -10119,7 +10254,7 @@ function CalendarTimeline({
       }
     );
   };
-  const slotHeaderNodes = React31.useMemo(() => {
+  const slotHeaderNodes = React32.useMemo(() => {
     const startIdx = colVirtEnabled ? visibleSlots.startIdx : 0;
     const endIdx = colVirtEnabled ? visibleSlots.endIdx : slots.length;
     const leftSpacer = startIdx > 0 ? slotLefts[startIdx] ?? 0 : 0;
@@ -10189,7 +10324,8 @@ function CalendarTimeline({
       activeView,
       sizeConfig,
       navigate,
-      goToday,
+      now: resolvedNow,
+      onApplyDateTime: setDate,
       setView,
       effectiveResourceColumnWidth,
       canResizeColumn,
@@ -10214,7 +10350,7 @@ function CalendarTimeline({
     "div",
     {
       className: cn(
-        "border border-border/40 rounded-2xl overflow-hidden bg-background/95 backdrop-blur-sm",
+        "border border-border/40 rounded-2xl md:rounded-3xl overflow-hidden bg-background/95 backdrop-blur-sm",
         "shadow-sm hover:shadow-md transition-shadow duration-300",
         densityClass,
         className
@@ -10356,16 +10492,19 @@ function CalendarTimeline({
                           const resource = resourceById.get(ev.resourceId);
                           const tooltipTitle = ev.title || ev.id;
                           const shouldCompact = activeView === "day" && dayEventStyle === "compact";
+                          const eventInsetX = 2;
+                          const leftInset = left + eventInsetX;
+                          const widthInset = Math.max(1, width - eventInsetX * 2);
                           const defaultMaxVisual = clamp4(Math.round(fixedSlotWidth * 1.2), 160, 360);
                           const maxVisual = clamp4(Math.round(dayEventMaxWidth ?? defaultMaxVisual), 80, 1200);
-                          const visualWidth = shouldCompact ? Math.min(width, maxVisual) : width;
-                          const isClipped = shouldCompact && width > visualWidth + 1;
+                          const visualWidth = shouldCompact ? Math.min(widthInset, maxVisual) : widthInset;
+                          const isClipped = shouldCompact && widthInset > visualWidth + 1;
                           const block = /* @__PURE__ */ jsxs33(
                             "div",
                             {
                               className: cn("absolute select-none cursor-pointer", isPreview && "z-10"),
                               "data-uv-ct-event": true,
-                              style: { left, top, width, height: layout.eventHeight },
+                              style: { left: leftInset, top, width: widthInset, height: layout.eventHeight },
                               role: "button",
                               tabIndex: 0,
                               "aria-label": aria,
@@ -10437,7 +10576,7 @@ function CalendarTimeline({
                               ]
                             }
                           );
-                          if (!enableEventTooltips) return /* @__PURE__ */ jsx38(React31.Fragment, { children: block }, ev.id);
+                          if (!enableEventTooltips) return /* @__PURE__ */ jsx38(React32.Fragment, { children: block }, ev.id);
                           const tooltipContent = /* @__PURE__ */ jsxs33("div", { className: "flex flex-col gap-0.5", children: [
                             /* @__PURE__ */ jsx38("div", { className: "font-semibold", children: tooltipTitle }),
                             /* @__PURE__ */ jsx38("div", { className: "text-xs opacity-80", children: timeText }),
@@ -10450,11 +10589,17 @@ function CalendarTimeline({
                           const endIdx = clamp4(binarySearchFirstGE(slotStarts, preview.end), startIdx + 1, slots.length);
                           const left = slotLefts[startIdx] ?? 0;
                           const width = Math.max(1, (slotLefts[endIdx] ?? 0) - (slotLefts[startIdx] ?? 0));
+                          const eventInsetX = 2;
                           return /* @__PURE__ */ jsx38(
                             "div",
                             {
                               className: "absolute rounded-lg border-2 border-dashed border-primary/60 bg-primary/10 backdrop-blur-sm animate-pulse",
-                              style: { left, top: layout.baseTop, width, height: layout.eventHeight }
+                              style: {
+                                left: left + eventInsetX,
+                                top: layout.baseTop,
+                                width: Math.max(1, width - eventInsetX * 2),
+                                height: layout.eventHeight
+                              }
                             }
                           );
                         })() : null,
@@ -10587,7 +10732,7 @@ function CalendarTimeline({
 }
 
 // ../../components/ui/MultiCombobox.tsx
-import * as React32 from "react";
+import * as React33 from "react";
 import { useId as useId5 } from "react";
 import { ChevronDown as ChevronDown3, Search as Search4, Check as Check5, SearchX as SearchX2, Loader2 as Loader24, X as X11, Sparkles as Sparkles3 } from "lucide-react";
 import { Fragment as Fragment13, jsx as jsx39, jsxs as jsxs34 } from "react/jsx-runtime";
@@ -10622,27 +10767,27 @@ var MultiCombobox = ({
   helperText,
   maxTagsVisible = 3
 }) => {
-  const [query, setQuery] = React32.useState("");
-  const [open, setOpen] = React32.useState(false);
-  const [activeIndex, setActiveIndex] = React32.useState(null);
-  const inputRef = React32.useRef(null);
-  const listRef = React32.useRef([]);
-  const triggerRef = React32.useRef(null);
+  const [query, setQuery] = React33.useState("");
+  const [open, setOpen] = React33.useState(false);
+  const [activeIndex, setActiveIndex] = React33.useState(null);
+  const inputRef = React33.useRef(null);
+  const listRef = React33.useRef([]);
+  const triggerRef = React33.useRef(null);
   useShadCNAnimations();
-  const normalizedOptions = React32.useMemo(
+  const normalizedOptions = React33.useMemo(
     () => options.map(
       (o) => typeof o === "string" ? { value: o, label: o } : { value: o.value, label: o.label, icon: o.icon, description: o.description, disabled: o.disabled, group: o.group }
     ),
     [options]
   );
   const enableSearch = normalizedOptions.length > 10;
-  const filtered = React32.useMemo(
+  const filtered = React33.useMemo(
     () => enableSearch ? normalizedOptions.filter(
       (opt) => opt.label.toLowerCase().includes(query.toLowerCase()) || opt.description?.toLowerCase().includes(query.toLowerCase())
     ) : normalizedOptions,
     [normalizedOptions, query, enableSearch]
   );
-  const groupedOptions = React32.useMemo(() => {
+  const groupedOptions = React33.useMemo(() => {
     if (!groupBy) return null;
     const groups = /* @__PURE__ */ new Map();
     filtered.forEach((opt) => {
@@ -10678,7 +10823,7 @@ var MultiCombobox = ({
   const handleClearAll = () => {
     onChange([]);
   };
-  React32.useEffect(() => {
+  React33.useEffect(() => {
     if (open && enableSearch) {
       setTimeout(() => {
         inputRef.current?.focus();
@@ -10903,7 +11048,7 @@ var MultiCombobox = ({
         /* @__PURE__ */ jsx39("div", { className: "flex items-center gap-1.5 flex-wrap min-h-6 flex-1", children: value.length > 0 ? showTags ? /* @__PURE__ */ jsxs34(Fragment13, { children: [
           visibleTags.map((option) => {
             if (renderTag) {
-              return /* @__PURE__ */ jsx39(React32.Fragment, { children: renderTag(option, () => handleRemove(option.value)) }, option.value);
+              return /* @__PURE__ */ jsx39(React33.Fragment, { children: renderTag(option, () => handleRemove(option.value)) }, option.value);
             }
             return /* @__PURE__ */ jsxs34(
               "span",
@@ -11044,17 +11189,17 @@ var MultiCombobox = ({
 };
 
 // ../../components/ui/RadioGroup.tsx
-import * as React33 from "react";
+import * as React34 from "react";
 import { jsx as jsx40, jsxs as jsxs35 } from "react/jsx-runtime";
-var RadioGroupContext = React33.createContext(void 0);
+var RadioGroupContext = React34.createContext(void 0);
 var useRadioGroup = () => {
-  const context = React33.useContext(RadioGroupContext);
+  const context = React34.useContext(RadioGroupContext);
   if (!context) {
     throw new Error("RadioGroupItem must be used within a RadioGroup");
   }
   return context;
 };
-var RadioGroup = React33.forwardRef(
+var RadioGroup = React34.forwardRef(
   ({
     value,
     defaultValue,
@@ -11070,7 +11215,7 @@ var RadioGroup = React33.forwardRef(
     error = false,
     errorMessage
   }, ref) => {
-    const [internalValue, setInternalValue] = React33.useState(defaultValue || "");
+    const [internalValue, setInternalValue] = React34.useState(defaultValue || "");
     const isControlled = value !== void 0;
     const currentValue = isControlled ? value : internalValue;
     const handleValueChange = (newValue) => {
@@ -11081,7 +11226,7 @@ var RadioGroup = React33.forwardRef(
         onValueChange?.(newValue);
       }
     };
-    const uniqueId = React33.useId();
+    const uniqueId = React34.useId();
     const radioName = name || `radio-group-${uniqueId}`;
     return /* @__PURE__ */ jsx40(
       RadioGroupContext.Provider,
@@ -11139,7 +11284,7 @@ var sizeStyles7 = {
     padding: "p-4"
   }
 };
-var RadioGroupItem = React33.forwardRef(
+var RadioGroupItem = React34.forwardRef(
   ({ value, id, disabled, className, children, label, description, icon }, ref) => {
     const { value: selectedValue, onValueChange, name, disabled: groupDisabled, size = "md", variant = "default" } = useRadioGroup();
     const isDisabled = disabled || groupDisabled;
@@ -11316,7 +11461,7 @@ var RadioGroupItem = React33.forwardRef(
 RadioGroupItem.displayName = "RadioGroupItem";
 
 // ../../components/ui/Slider.tsx
-import * as React34 from "react";
+import * as React35 from "react";
 import { Fragment as Fragment14, jsx as jsx41, jsxs as jsxs36 } from "react/jsx-runtime";
 var SIZE_STYLES = {
   sm: {
@@ -11336,7 +11481,7 @@ var SIZE_STYLES = {
   }
 };
 var clamp5 = (n, min, max) => Math.min(max, Math.max(min, n));
-var Slider = React34.forwardRef(
+var Slider = React35.forwardRef(
   ({
     className,
     mode = "single",
@@ -11368,15 +11513,15 @@ var Slider = React34.forwardRef(
     ...props
   }, ref) => {
     const isRange = mode === "range";
-    const trackRef = React34.useRef(null);
-    const [internalValue, setInternalValue] = React34.useState(defaultValue);
-    const [internalRange, setInternalRange] = React34.useState(() => {
+    const trackRef = React35.useRef(null);
+    const [internalValue, setInternalValue] = React35.useState(defaultValue);
+    const [internalRange, setInternalRange] = React35.useState(() => {
       if (defaultRangeValue) return defaultRangeValue;
       const v = clamp5(defaultValue, min, max);
       return [min, v];
     });
-    const [activeThumb, setActiveThumb] = React34.useState(null);
-    const dragRef = React34.useRef(null);
+    const [activeThumb, setActiveThumb] = React35.useState(null);
+    const dragRef = React35.useRef(null);
     const isControlled = value !== void 0;
     const currentValue = isControlled ? value : internalValue;
     const isRangeControlled = rangeValue !== void 0;
@@ -11384,7 +11529,7 @@ var Slider = React34.forwardRef(
     const rangeMin = clamp5(currentRange[0] ?? min, min, max);
     const rangeMax = clamp5(currentRange[1] ?? max, min, max);
     const normalizedRange = rangeMin <= rangeMax ? [rangeMin, rangeMax] : [rangeMax, rangeMin];
-    const handleSingleChange = React34.useCallback(
+    const handleSingleChange = React35.useCallback(
       (e) => {
         const newValue = Number(e.target.value);
         if (!isControlled) {
@@ -11395,14 +11540,14 @@ var Slider = React34.forwardRef(
       },
       [isControlled, onChange, onValueChange]
     );
-    const emitRange = React34.useCallback(
+    const emitRange = React35.useCallback(
       (next) => {
         onRangeChange?.(next);
         onRangeValueChange?.(next);
       },
       [onRangeChange, onRangeValueChange]
     );
-    const handleRangeChange = React34.useCallback(
+    const handleRangeChange = React35.useCallback(
       (thumb) => (e) => {
         const nextVal = Number(e.target.value);
         const [curMin, curMax] = normalizedRange;
@@ -11417,7 +11562,7 @@ var Slider = React34.forwardRef(
     const rangeStartPct = (normalizedRange[0] - min) / denom * 100;
     const rangeEndPct = (normalizedRange[1] - min) / denom * 100;
     const sizeStyles8 = SIZE_STYLES[size];
-    const displayValue = React34.useMemo(() => {
+    const displayValue = React35.useMemo(() => {
       if (isRange) {
         const a = formatValue ? formatValue(normalizedRange[0]) : normalizedRange[0].toString();
         const b = formatValue ? formatValue(normalizedRange[1]) : normalizedRange[1].toString();
@@ -11425,7 +11570,7 @@ var Slider = React34.forwardRef(
       }
       return formatValue ? formatValue(currentValue) : currentValue.toString();
     }, [currentValue, formatValue, isRange, normalizedRange]);
-    const quantize = React34.useCallback(
+    const quantize = React35.useCallback(
       (v) => {
         const stepped = Math.round((v - min) / step) * step + min;
         const fixed = Number(stepped.toFixed(10));
@@ -11433,7 +11578,7 @@ var Slider = React34.forwardRef(
       },
       [max, min, step]
     );
-    const valueFromClientX = React34.useCallback(
+    const valueFromClientX = React35.useCallback(
       (clientX) => {
         const el = trackRef.current;
         if (!el) return min;
@@ -11624,7 +11769,7 @@ Slider.displayName = "Slider";
 
 // ../../components/ui/OverlayControls.tsx
 import { Dot as Dot2, Maximize2, Pause, Play, RotateCcw, RotateCw, Volume2, VolumeX } from "lucide-react";
-import React35 from "react";
+import React36 from "react";
 import { Fragment as Fragment15, jsx as jsx42, jsxs as jsxs37 } from "react/jsx-runtime";
 function OverlayControls({
   mode,
@@ -11655,24 +11800,24 @@ function OverlayControls({
 }) {
   const hoverClasses = showOnHover ? "opacity-0 pointer-events-none group-hover:opacity-100 group-hover:pointer-events-auto" : "opacity-100 pointer-events-auto";
   const showControlsBar = mode === "review";
-  const [rateOpen, setRateOpen] = React35.useState(false);
-  const rateWrapRef = React35.useRef(null);
-  const [controlsVisible, setControlsVisible] = React35.useState(true);
-  const hideTimerRef = React35.useRef(null);
-  const [previewData, setPreviewData] = React35.useState(null);
-  const sliderRef = React35.useRef(null);
-  const [isDragging, setIsDragging] = React35.useState(false);
-  const [dragValue, setDragValue] = React35.useState(value);
-  React35.useEffect(() => {
+  const [rateOpen, setRateOpen] = React36.useState(false);
+  const rateWrapRef = React36.useRef(null);
+  const [controlsVisible, setControlsVisible] = React36.useState(true);
+  const hideTimerRef = React36.useRef(null);
+  const [previewData, setPreviewData] = React36.useState(null);
+  const sliderRef = React36.useRef(null);
+  const [isDragging, setIsDragging] = React36.useState(false);
+  const [dragValue, setDragValue] = React36.useState(value);
+  React36.useEffect(() => {
     if (!isDragging) {
       setDragValue(value);
     }
   }, [value, isDragging]);
-  const [keyboardFeedback, setKeyboardFeedback] = React35.useState(null);
-  const feedbackTimerRef = React35.useRef(null);
-  const seekAccumulatorRef = React35.useRef(0);
-  const seekAccumulatorTimerRef = React35.useRef(null);
-  React35.useEffect(() => {
+  const [keyboardFeedback, setKeyboardFeedback] = React36.useState(null);
+  const feedbackTimerRef = React36.useRef(null);
+  const seekAccumulatorRef = React36.useRef(0);
+  const seekAccumulatorTimerRef = React36.useRef(null);
+  React36.useEffect(() => {
     const onDocDown = (e) => {
       if (!rateOpen) return;
       const wrap = rateWrapRef.current;
@@ -11683,7 +11828,7 @@ function OverlayControls({
     document.addEventListener("mousedown", onDocDown);
     return () => document.removeEventListener("mousedown", onDocDown);
   }, [rateOpen]);
-  React35.useEffect(() => {
+  React36.useEffect(() => {
     if (!autoHide || showOnHover) return;
     const resetTimer = () => {
       if (hideTimerRef.current) clearTimeout(hideTimerRef.current);
@@ -11721,7 +11866,7 @@ function OverlayControls({
       seekAccumulatorRef.current = 0;
     }, 1e3);
   };
-  React35.useEffect(() => {
+  React36.useEffect(() => {
     if (!enableKeyboardShortcuts) return;
     const handleKeyDown = (e) => {
       if (e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement) return;
@@ -12056,7 +12201,7 @@ function OverlayControls({
 }
 
 // ../../components/ui/CategoryTreeSelect.tsx
-import { useState as useState29, useEffect as useEffect19 } from "react";
+import { useState as useState30, useEffect as useEffect20 } from "react";
 import { ChevronRight as ChevronRight6, ChevronDown as ChevronDown4, Check as Check6, FolderTree, Layers } from "lucide-react";
 import { Fragment as Fragment16, jsx as jsx43, jsxs as jsxs38 } from "react/jsx-runtime";
 var defaultLabels = {
@@ -12076,8 +12221,8 @@ function CategoryTreeSelect(props) {
     className,
     singleSelect = false
   } = props;
-  const [isOpen, setIsOpen] = useState29(false);
-  const [expandedNodes, setExpandedNodes] = useState29(/* @__PURE__ */ new Set());
+  const [isOpen, setIsOpen] = useState30(false);
+  const [expandedNodes, setExpandedNodes] = useState30(/* @__PURE__ */ new Set());
   const mergedLabels = { ...defaultLabels, ...labels };
   const valueArray = singleSelect ? props.value != null ? [props.value] : [] : props.value || [];
   const parentCategories = categories.filter((c) => !c.parent_id);
@@ -12090,7 +12235,7 @@ function CategoryTreeSelect(props) {
       childrenMap.get(cat.parent_id).push(cat);
     }
   });
-  useEffect19(() => {
+  useEffect20(() => {
     if ((viewOnly || inline) && defaultExpanded) {
       const allParentIds = categories.filter((c) => childrenMap.has(c.id)).map((c) => c.id);
       setExpandedNodes(new Set(allParentIds));
@@ -12315,7 +12460,7 @@ function CategoryTreeSelect(props) {
 }
 
 // ../../components/ui/ImageUpload.tsx
-import { useState as useState30, useRef as useRef14, useCallback as useCallback11 } from "react";
+import { useState as useState31, useRef as useRef14, useCallback as useCallback12 } from "react";
 import { Upload, X as X12, Image as ImageIcon, Loader2 as Loader25, Check as Check7 } from "lucide-react";
 import { jsx as jsx44, jsxs as jsxs39 } from "react/jsx-runtime";
 function ImageUpload({
@@ -12333,9 +12478,9 @@ function ImageUpload({
   browseText,
   supportedFormatsText
 }) {
-  const [isDragging, setIsDragging] = useState30(false);
-  const [uploading, setUploading] = useState30(false);
-  const [uploadedImages, setUploadedImages] = useState30([]);
+  const [isDragging, setIsDragging] = useState31(false);
+  const [uploading, setUploading] = useState31(false);
+  const [uploadedImages, setUploadedImages] = useState31([]);
   const fileInputRef = useRef14(null);
   const { addToast } = useToast();
   const t = useTranslations("OCR.imageUpload");
@@ -12344,7 +12489,7 @@ function ImageUpload({
     md: "w-24 h-24",
     lg: "w-32 h-32"
   };
-  const handleDragOver = useCallback11(
+  const handleDragOver = useCallback12(
     (e) => {
       e.preventDefault();
       if (!disabled) {
@@ -12353,11 +12498,11 @@ function ImageUpload({
     },
     [disabled]
   );
-  const handleDragLeave = useCallback11((e) => {
+  const handleDragLeave = useCallback12((e) => {
     e.preventDefault();
     setIsDragging(false);
   }, []);
-  const handleFiles = useCallback11(
+  const handleFiles = useCallback12(
     async (files) => {
       if (files.length === 0) return;
       const validFiles = files.filter((file) => {
@@ -12424,7 +12569,7 @@ function ImageUpload({
     },
     [maxSize, addToast, onUpload]
   );
-  const handleDrop = useCallback11(
+  const handleDrop = useCallback12(
     (e) => {
       e.preventDefault();
       setIsDragging(false);
@@ -12434,7 +12579,7 @@ function ImageUpload({
     },
     [disabled, handleFiles]
   );
-  const handleFileSelect = useCallback11(
+  const handleFileSelect = useCallback12(
     (e) => {
       const files = Array.from(e.target.files || []);
       handleFiles(files);
@@ -12537,7 +12682,7 @@ function ImageUpload({
 }
 
 // ../../components/ui/Carousel.tsx
-import * as React37 from "react";
+import * as React38 from "react";
 import { ChevronLeft as ChevronLeft5, ChevronRight as ChevronRight7 } from "lucide-react";
 import { Fragment as Fragment17, jsx as jsx45, jsxs as jsxs40 } from "react/jsx-runtime";
 function Carousel({
@@ -12560,19 +12705,19 @@ function Carousel({
   thumbnailRenderer,
   ariaLabel = "Carousel"
 }) {
-  const [currentIndex, setCurrentIndex] = React37.useState(0);
-  const [isPaused, setIsPaused] = React37.useState(false);
-  const [isDragging, setIsDragging] = React37.useState(false);
-  const [startPos, setStartPos] = React37.useState(0);
-  const [currentTranslate, setCurrentTranslate] = React37.useState(0);
-  const [prevTranslate, setPrevTranslate] = React37.useState(0);
-  const progressElRef = React37.useRef(null);
-  const carouselRef = React37.useRef(null);
-  const rafRef = React37.useRef(null);
-  const totalSlides = React37.Children.count(children);
+  const [currentIndex, setCurrentIndex] = React38.useState(0);
+  const [isPaused, setIsPaused] = React38.useState(false);
+  const [isDragging, setIsDragging] = React38.useState(false);
+  const [startPos, setStartPos] = React38.useState(0);
+  const [currentTranslate, setCurrentTranslate] = React38.useState(0);
+  const [prevTranslate, setPrevTranslate] = React38.useState(0);
+  const progressElRef = React38.useRef(null);
+  const carouselRef = React38.useRef(null);
+  const rafRef = React38.useRef(null);
+  const totalSlides = React38.Children.count(children);
   const maxIndex = Math.max(0, totalSlides - slidesToShow);
   const isHorizontal = orientation === "horizontal";
-  const scrollPrev = React37.useCallback(() => {
+  const scrollPrev = React38.useCallback(() => {
     setCurrentIndex((prev) => {
       if (prev === 0) {
         return loop ? maxIndex : 0;
@@ -12580,7 +12725,7 @@ function Carousel({
       return Math.max(0, prev - slidesToScroll);
     });
   }, [loop, maxIndex, slidesToScroll]);
-  const scrollNext = React37.useCallback(() => {
+  const scrollNext = React38.useCallback(() => {
     setCurrentIndex((prev) => {
       if (prev >= maxIndex) {
         return loop ? 0 : maxIndex;
@@ -12588,13 +12733,13 @@ function Carousel({
       return Math.min(maxIndex, prev + slidesToScroll);
     });
   }, [loop, maxIndex, slidesToScroll]);
-  const scrollTo = React37.useCallback(
+  const scrollTo = React38.useCallback(
     (index) => {
       setCurrentIndex(Math.min(maxIndex, Math.max(0, index)));
     },
     [maxIndex]
   );
-  React37.useEffect(() => {
+  React38.useEffect(() => {
     const handleKeyDown = (e) => {
       if (e.key === "ArrowLeft" || e.key === "ArrowUp") {
         e.preventDefault();
@@ -12616,7 +12761,7 @@ function Carousel({
       return () => carousel.removeEventListener("keydown", handleKeyDown);
     }
   }, [scrollPrev, scrollNext, scrollTo, maxIndex]);
-  React37.useEffect(() => {
+  React38.useEffect(() => {
     const stop = () => {
       if (rafRef.current != null) {
         cancelAnimationFrame(rafRef.current);
@@ -12675,7 +12820,7 @@ function Carousel({
     setCurrentTranslate(0);
     setPrevTranslate(0);
   };
-  React37.useEffect(() => {
+  React38.useEffect(() => {
     onSlideChange?.(currentIndex);
   }, [currentIndex, onSlideChange]);
   const getAnimationStyles2 = () => {
@@ -12728,7 +12873,7 @@ function Carousel({
             role: "group",
             "aria-atomic": "false",
             "aria-live": autoScroll ? "off" : "polite",
-            children: React37.Children.map(children, (child, idx) => /* @__PURE__ */ jsx45(
+            children: React38.Children.map(children, (child, idx) => /* @__PURE__ */ jsx45(
               "div",
               {
                 className: cn(
@@ -12818,7 +12963,7 @@ function Carousel({
               "absolute bottom-0 left-0 right-0 flex gap-2 p-4 bg-linear-to-t from-black/50 to-transparent overflow-x-auto",
               isHorizontal ? "flex-row" : "flex-col"
             ),
-            children: React37.Children.map(children, (child, idx) => /* @__PURE__ */ jsx45(
+            children: React38.Children.map(children, (child, idx) => /* @__PURE__ */ jsx45(
               "button",
               {
                 onClick: () => scrollTo(idx),
@@ -12839,7 +12984,7 @@ function Carousel({
 }
 
 // ../../components/ui/FallingIcons.tsx
-import React38 from "react";
+import React39 from "react";
 import { jsx as jsx46, jsxs as jsxs41 } from "react/jsx-runtime";
 var DEFAULT_COUNT = 24;
 var DEFAULT_SPEED_RANGE = [6, 14];
@@ -12867,10 +13012,10 @@ function FallingIcons({
   physics,
   easingFunction = "linear"
 }) {
-  const uid = React38.useId().replace(/[:]/g, "");
-  const containerRef = React38.useRef(null);
-  const [fallDist, setFallDist] = React38.useState(null);
-  const idRef = React38.useRef(1);
+  const uid = React39.useId().replace(/[:]/g, "");
+  const containerRef = React39.useRef(null);
+  const [fallDist, setFallDist] = React39.useState(null);
+  const idRef = React39.useRef(1);
   const gravity = physics?.gravity ?? 1;
   const windDirection = physics?.windDirection ?? 0;
   const windStrength = physics?.windStrength ?? 0;
@@ -12884,7 +13029,7 @@ function FallingIcons({
     bounce: "cubic-bezier(0.68, -0.55, 0.265, 1.55)",
     elastic: "cubic-bezier(0.175, 0.885, 0.32, 1.275)"
   };
-  const makeParticle = React38.useCallback(() => {
+  const makeParticle = React39.useCallback(() => {
     const rnd = (min, max) => min + Math.random() * (max - min);
     return {
       leftPct: rnd(0, 100),
@@ -12898,12 +13043,12 @@ function FallingIcons({
       key: idRef.current++
     };
   }, [sizeRange, speedRange, horizontalDrift, gravity, windDirection, windStrength]);
-  const [particles, setParticles] = React38.useState([]);
-  React38.useEffect(() => {
+  const [particles, setParticles] = React39.useState([]);
+  React39.useEffect(() => {
     const arr = Array.from({ length: Math.max(0, count) }).map(() => makeParticle());
     setParticles(arr);
   }, [count, makeParticle]);
-  React38.useEffect(() => {
+  React39.useEffect(() => {
     if (fullScreen) {
       const measure2 = () => setFallDist(window.innerHeight + 200);
       measure2();
@@ -12928,14 +13073,14 @@ function FallingIcons({
   const SpinName = `uv-spin-${uid}`;
   const PopName = `uv-pop-${uid}`;
   const PhysicsSpinName = `uv-physics-spin-${uid}`;
-  const glowStyles = React38.useMemo(() => {
+  const glowStyles = React39.useMemo(() => {
     if (!glow) return {};
     const intensity = Math.max(0, Math.min(1, glowIntensity));
     return {
       filter: `drop-shadow(0 0 ${4 * intensity}px ${glowColor}) drop-shadow(0 0 ${8 * intensity}px ${glowColor})`
     };
   }, [glow, glowColor, glowIntensity]);
-  const FallbackIcon = React38.useMemo(
+  const FallbackIcon = React39.useMemo(
     () => (props) => /* @__PURE__ */ jsx46("svg", { viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", ...props, children: /* @__PURE__ */ jsx46("circle", { cx: "12", cy: "12", r: "10" }) }),
     []
   );
@@ -12993,7 +13138,7 @@ function FallingIcons({
             });
           };
           const trailParticles = trail ? Array.from({ length: Math.min(5, Math.max(1, trailLength)) }) : [];
-          return /* @__PURE__ */ jsxs41(React38.Fragment, { children: [
+          return /* @__PURE__ */ jsxs41(React39.Fragment, { children: [
             trail && trailParticles.map((_, trailIndex) => {
               const trailDelay = p.delay - (trailIndex + 1) * 0.15;
               const trailOpacity = 1 - (trailIndex + 1) * (1 / (trailParticles.length + 1));
@@ -13111,7 +13256,7 @@ function FallingIcons({
 }
 
 // ../../components/ui/List.tsx
-import * as React39 from "react";
+import * as React40 from "react";
 import { ChevronRight as ChevronRight8 } from "lucide-react";
 import { Fragment as Fragment18, jsx as jsx47, jsxs as jsxs42 } from "react/jsx-runtime";
 var SIZE_STYLES2 = {
@@ -13137,7 +13282,7 @@ var ListItemSkeleton = ({ size }) => {
     ] })
   ] });
 };
-var ListRoot = React39.forwardRef(
+var ListRoot = React40.forwardRef(
   ({
     as = "ul",
     ordered,
@@ -13157,7 +13302,7 @@ var ListRoot = React39.forwardRef(
     ...rest
   }, ref) => {
     const Comp = ordered ? "ol" : as;
-    const childCount = React39.Children.count(children);
+    const childCount = React40.Children.count(children);
     const hasChildren = childCount > 0;
     const variantClasses2 = {
       plain: "",
@@ -13195,14 +13340,14 @@ var ListRoot = React39.forwardRef(
           className
         ),
         ...rest,
-        children: React39.Children.map(children, (child, idx) => {
-          if (!React39.isValidElement(child)) return child;
+        children: React40.Children.map(children, (child, idx) => {
+          if (!React40.isValidElement(child)) return child;
           const childClass = cn(
             child.props?.className,
             hoverable && variant !== "flush" && "hover:bg-accent/50 focus:bg-accent/60 focus:outline-none transition-colors",
             variant === "flush" && "hover:bg-accent/30"
           );
-          return React39.cloneElement(child, {
+          return React40.cloneElement(child, {
             className: childClass,
             // Pass global item class to contentClassName of ListItem
             contentClassName: cn(itemClassName, child.props?.contentClassName),
@@ -13217,7 +13362,7 @@ var ListRoot = React39.forwardRef(
   }
 );
 ListRoot.displayName = "List";
-var ListItem = React39.forwardRef(
+var ListItem = React40.forwardRef(
   ({
     as = "li",
     selected = false,
@@ -13240,7 +13385,7 @@ var ListItem = React39.forwardRef(
     children,
     ...rest
   }, ref) => {
-    const [internalExpanded, setInternalExpanded] = React39.useState(false);
+    const [internalExpanded, setInternalExpanded] = React40.useState(false);
     const isExpanded = controlledExpanded !== void 0 ? controlledExpanded : internalExpanded;
     const sizeAttr = rest["data-size"];
     const resolvedSize = sizeAttr && ["xs", "sm", "md", "lg"].includes(sizeAttr) ? sizeAttr : "md";
@@ -13308,7 +13453,7 @@ var List = Object.assign(ListRoot, { Item: ListItem });
 var List_default = List;
 
 // ../../components/ui/Watermark.tsx
-import * as React40 from "react";
+import * as React41 from "react";
 import { createPortal as createPortal5 } from "react-dom";
 import { Fragment as Fragment19, jsx as jsx48, jsxs as jsxs43 } from "react/jsx-runtime";
 var PRESETS2 = {
@@ -13320,8 +13465,8 @@ var PRESETS2 = {
   internal: { text: "INTERNAL USE ONLY", color: "rgba(156, 163, 175, 0.15)", rotate: -22, fontSize: 13, fontWeight: "600" }
 };
 function useWatermarkDataURL(opts) {
-  const [url, setUrl] = React40.useState(null);
-  React40.useEffect(() => {
+  const [url, setUrl] = React41.useState(null);
+  React41.useEffect(() => {
     let cancelled = false;
     const text = opts.text;
     const image = opts.image;
@@ -13498,9 +13643,9 @@ var Watermark = ({
   children,
   ...rest
 }) => {
-  const [visible, setVisible] = React40.useState(true);
-  const [isDark, setIsDark] = React40.useState(false);
-  React40.useEffect(() => {
+  const [visible, setVisible] = React41.useState(true);
+  const [isDark, setIsDark] = React41.useState(false);
+  React41.useEffect(() => {
     if (!darkMode) return;
     const checkDarkMode = () => {
       const isDarkMode = document.documentElement.classList.contains("dark") || window.matchMedia("(prefers-color-scheme: dark)").matches;
@@ -13602,7 +13747,7 @@ var Watermark = ({
 var Watermark_default = Watermark;
 
 // ../../components/ui/Timeline.tsx
-import * as React41 from "react";
+import * as React42 from "react";
 import { ChevronDown as ChevronDown5 } from "lucide-react";
 import { jsx as jsx49, jsxs as jsxs44 } from "react/jsx-runtime";
 var SIZE_STYLE = {
@@ -13655,7 +13800,7 @@ var STATUS_COLOR = {
   error: "bg-destructive",
   info: "bg-info"
 };
-var TimelineContext = React41.createContext(null);
+var TimelineContext = React42.createContext(null);
 var LINE_STYLE_MAP = {
   solid: "border-solid",
   dashed: "border-dashed",
@@ -13683,7 +13828,7 @@ var Marker = ({ index, last, size, color, status = "default", lineColor, lineSty
     !last && showLine && /* @__PURE__ */ jsx49("div", { className: cn("flex-1 border-l-2", LINE_STYLE_MAP[lineStyle]), style: { borderColor: lineColor || "hsl(var(--border))" } })
   ] });
 };
-var TimelineRoot = React41.forwardRef(
+var TimelineRoot = React42.forwardRef(
   ({
     align = "left",
     variant = "default",
@@ -13713,7 +13858,7 @@ var TimelineRoot = React41.forwardRef(
   }
 );
 TimelineRoot.displayName = "Timeline";
-var TimelineItem = React41.forwardRef(
+var TimelineItem = React42.forwardRef(
   ({
     title,
     description,
@@ -13732,11 +13877,11 @@ var TimelineItem = React41.forwardRef(
     children,
     ...rest
   }, ref) => {
-    const ctx = React41.useContext(TimelineContext);
+    const ctx = React42.useContext(TimelineContext);
     const idx = rest["data-index"];
     const isLast = Boolean(rest["data-last"]);
     const sz = SIZE_STYLE[ctx.size];
-    const [internalExpanded, setInternalExpanded] = React41.useState(false);
+    const [internalExpanded, setInternalExpanded] = React42.useState(false);
     const isExpanded = controlledExpanded !== void 0 ? controlledExpanded : internalExpanded;
     const toggleExpanded = () => {
       const newExpanded = !isExpanded;
@@ -13878,7 +14023,7 @@ var Timeline = Object.assign(TimelineRoot, { Item: TimelineItem });
 var Timeline_default = Timeline;
 
 // ../../components/ui/ColorPicker.tsx
-import * as React42 from "react";
+import * as React43 from "react";
 import { Pipette, X as X13, Copy, Check as Check8, Palette, History } from "lucide-react";
 import { jsx as jsx50, jsxs as jsxs45 } from "react/jsx-runtime";
 var clamp6 = (n, min, max) => Math.max(min, Math.min(max, n));
@@ -14072,12 +14217,12 @@ function ColorPicker({
 }) {
   const isControlled = value !== void 0;
   const initial = parseAnyColor(isControlled ? value : defaultValue) || { r: 79, g: 70, b: 229, a: 1 };
-  const [rgba, setRgba] = React42.useState(initial);
-  const [open, setOpen] = React42.useState(false);
-  const [text, setText] = React42.useState(() => formatOutput(initial, withAlpha, format));
-  const [copied, setCopied] = React42.useState(false);
-  const [recentColors, setRecentColors] = React42.useState([]);
-  React42.useEffect(() => {
+  const [rgba, setRgba] = React43.useState(initial);
+  const [open, setOpen] = React43.useState(false);
+  const [text, setText] = React43.useState(() => formatOutput(initial, withAlpha, format));
+  const [copied, setCopied] = React43.useState(false);
+  const [recentColors, setRecentColors] = React43.useState([]);
+  React43.useEffect(() => {
     if (isControlled) {
       const parsed = parseAnyColor(value);
       if (parsed) {
@@ -14400,7 +14545,7 @@ function ColorPicker({
 }
 
 // ../../components/ui/Grid.tsx
-import React43, { useId as useId7 } from "react";
+import React44, { useId as useId7 } from "react";
 import { Fragment as Fragment20, jsx as jsx51, jsxs as jsxs46 } from "react/jsx-runtime";
 var BP_MIN = {
   sm: 640,
@@ -14440,7 +14585,7 @@ function getVariantClasses(variant = "default", outlined) {
   };
   return variants[variant] || "";
 }
-var GridRoot = React43.forwardRef(
+var GridRoot = React44.forwardRef(
   ({
     columns,
     rows,
@@ -14524,7 +14669,7 @@ var GridRoot = React43.forwardRef(
   }
 );
 GridRoot.displayName = "Grid";
-var GridItem = React43.forwardRef(
+var GridItem = React44.forwardRef(
   ({
     colSpan,
     rowSpan,
@@ -14588,19 +14733,19 @@ var Grid = Object.assign(GridRoot, { Item: GridItem });
 var Grid_default = Grid;
 
 // ../../components/ui/LineChart.tsx
-import { useMemo as useMemo14, useState as useState37, useRef as useRef16 } from "react";
+import { useMemo as useMemo15, useState as useState38, useRef as useRef16 } from "react";
 
 // ../../components/ui/ChartTooltip.tsx
-import { useEffect as useEffect23, useState as useState36 } from "react";
+import { useEffect as useEffect24, useState as useState37 } from "react";
 import { createPortal as createPortal6 } from "react-dom";
 import { Fragment as Fragment21, jsx as jsx52, jsxs as jsxs47 } from "react/jsx-runtime";
 function ChartTooltip({ x, y, visible, label, value, color, secondaryLabel, secondaryValue, items, containerRef }) {
-  const [isMounted, setIsMounted] = useState36(false);
-  const [position, setPosition] = useState36(null);
-  useEffect23(() => {
+  const [isMounted, setIsMounted] = useState37(false);
+  const [position, setPosition] = useState37(null);
+  useEffect24(() => {
     setIsMounted(true);
   }, []);
-  useEffect23(() => {
+  useEffect24(() => {
     if (visible && containerRef?.current) {
       const rect = containerRef.current.getBoundingClientRect();
       setPosition({
@@ -14686,8 +14831,8 @@ function LineChart({
   const padding = { top: 20, right: 20, bottom: 40, left: 40 };
   const chartWidth = width - padding.left - padding.right;
   const chartHeight = height - padding.top - padding.bottom;
-  const [hoveredPoint, setHoveredPoint] = useState37(null);
-  const { minValue, maxValue, points, linePath, areaPath } = useMemo14(() => {
+  const [hoveredPoint, setHoveredPoint] = useState38(null);
+  const { minValue, maxValue, points, linePath, areaPath } = useMemo15(() => {
     if (!data.length) return { minValue: 0, maxValue: 0, points: [], linePath: "", areaPath: "" };
     const values = data.map((d) => d.value);
     const min = Math.min(...values);
@@ -14722,7 +14867,7 @@ function LineChart({
     }
     return { minValue: min, maxValue: max, points: pts, linePath: path, areaPath: area };
   }, [data, chartWidth, chartHeight, curved, padding.left, padding.top]);
-  const gridLines = useMemo14(() => {
+  const gridLines = useMemo15(() => {
     const lines = [];
     const steps = 5;
     for (let i = 0; i <= steps; i++) {
@@ -14840,7 +14985,7 @@ function LineChart({
 }
 
 // ../../components/ui/BarChart.tsx
-import { useMemo as useMemo15, useState as useState38, useRef as useRef17 } from "react";
+import { useMemo as useMemo16, useState as useState39, useRef as useRef17 } from "react";
 import { Fragment as Fragment23, jsx as jsx54, jsxs as jsxs49 } from "react/jsx-runtime";
 function BarChart({
   data,
@@ -14860,8 +15005,8 @@ function BarChart({
   const padding = horizontal ? { top: 20, right: 40, bottom: 20, left: 80 } : { top: 20, right: 20, bottom: 40, left: 40 };
   const chartWidth = width - padding.left - padding.right;
   const chartHeight = height - padding.top - padding.bottom;
-  const [hoveredBar, setHoveredBar] = useState38(null);
-  const { maxValue, bars, gridLines } = useMemo15(() => {
+  const [hoveredBar, setHoveredBar] = useState39(null);
+  const { maxValue, bars, gridLines } = useMemo16(() => {
     if (!data.length) return { maxValue: 0, bars: [], gridLines: [] };
     const max = Math.max(...data.map((d) => d.value));
     const barCount = data.length;
@@ -15022,7 +15167,7 @@ function BarChart({
 }
 
 // ../../components/ui/PieChart.tsx
-import { useMemo as useMemo16, useState as useState39, useRef as useRef18 } from "react";
+import { useMemo as useMemo17, useState as useState40, useRef as useRef18 } from "react";
 import { jsx as jsx55, jsxs as jsxs50 } from "react/jsx-runtime";
 function PieChart({
   data,
@@ -15040,7 +15185,7 @@ function PieChart({
   const center = size / 2;
   const radius = size / 2 - 10;
   const innerRadius = donut ? radius - donutWidth : 0;
-  const { segments, total } = useMemo16(() => {
+  const { segments, total } = useMemo17(() => {
     if (!data.length) return { segments: [], total: 0 };
     const sum = data.reduce((acc, d) => acc + d.value, 0);
     let currentAngle = startAngle;
@@ -15086,7 +15231,7 @@ function PieChart({
     });
     return { segments: segs, total: sum };
   }, [data, center, radius, innerRadius, donut, startAngle]);
-  const [hoveredSegment, setHoveredSegment] = useState39(null);
+  const [hoveredSegment, setHoveredSegment] = useState40(null);
   return /* @__PURE__ */ jsxs50("div", { ref: containerRef, className: `relative flex items-center gap-6 ${className}`, children: [
     /* @__PURE__ */ jsxs50("svg", { width: size + 40, height: size + 40, className: "overflow-visible", style: { fontFamily: "inherit" }, children: [
       /* @__PURE__ */ jsxs50("g", { transform: `translate(20, 20)`, children: [
@@ -15187,7 +15332,7 @@ function PieChart({
 }
 
 // ../../components/ui/AreaChart.tsx
-import { useMemo as useMemo17, useState as useState40, useRef as useRef19 } from "react";
+import { useMemo as useMemo18, useState as useState41, useRef as useRef19 } from "react";
 import { jsx as jsx56, jsxs as jsxs51 } from "react/jsx-runtime";
 function getCatmullRomSpline(points) {
   if (points.length < 2) return "";
@@ -15226,8 +15371,8 @@ function AreaChart({
   const padding = { top: 20, right: 20, bottom: 40, left: 50 };
   const chartWidth = width - padding.left - padding.right;
   const chartHeight = height - padding.top - padding.bottom;
-  const [hoveredPoint, setHoveredPoint] = useState40(null);
-  const { processedSeries, gridLines, maxValue, labels } = useMemo17(() => {
+  const [hoveredPoint, setHoveredPoint] = useState41(null);
+  const { processedSeries, gridLines, maxValue, labels } = useMemo18(() => {
     if (!series.length || !series[0]?.data?.length) {
       return { processedSeries: [], gridLines: [], maxValue: 0, labels: [] };
     }
@@ -15441,7 +15586,7 @@ function AreaChart({
 }
 
 // ../../components/ui/Sparkline.tsx
-import { useMemo as useMemo18 } from "react";
+import { useMemo as useMemo19 } from "react";
 import { jsx as jsx57, jsxs as jsxs52 } from "react/jsx-runtime";
 function getCatmullRomSpline2(points) {
   if (points.length < 2) return "";
@@ -15480,7 +15625,7 @@ function Sparkline({
   const padding = 4;
   const chartWidth = width - padding * 2;
   const chartHeight = height - padding * 2;
-  const { points, linePath, areaPath, lineLength, trend } = useMemo18(() => {
+  const { points, linePath, areaPath, lineLength, trend } = useMemo19(() => {
     const normalizedData = data.map((d) => typeof d === "number" ? d : d.value);
     if (!normalizedData.length) {
       return { points: [], linePath: "", areaPath: "", lineLength: 0, trend: 0 };
@@ -15584,7 +15729,7 @@ function Sparkline({
 }
 
 // ../../components/ui/RadarChart.tsx
-import { useMemo as useMemo19, useState as useState41, useRef as useRef20 } from "react";
+import { useMemo as useMemo20, useState as useState42, useRef as useRef20 } from "react";
 import { jsx as jsx58, jsxs as jsxs53 } from "react/jsx-runtime";
 function RadarChart({
   series,
@@ -15599,8 +15744,8 @@ function RadarChart({
   const containerRef = useRef20(null);
   const center = size / 2;
   const radius = size / 2 - 40;
-  const [hoveredPoint, setHoveredPoint] = useState41(null);
-  const { axes, processedSeries, levelPaths } = useMemo19(() => {
+  const [hoveredPoint, setHoveredPoint] = useState42(null);
+  const { axes, processedSeries, levelPaths } = useMemo20(() => {
     if (!series.length || !series[0]?.data?.length) {
       return { axes: [], processedSeries: [], levelPaths: [] };
     }
@@ -15784,7 +15929,7 @@ function RadarChart({
 }
 
 // ../../components/ui/GaugeChart.tsx
-import { useMemo as useMemo20 } from "react";
+import { useMemo as useMemo21 } from "react";
 import { jsx as jsx59, jsxs as jsxs54 } from "react/jsx-runtime";
 function GaugeChart({
   value,
@@ -15804,7 +15949,7 @@ function GaugeChart({
 }) {
   const center = size / 2;
   const radius = center - thickness / 2 - 10;
-  const { backgroundPath, valuePath, percentage, needleAngle } = useMemo20(() => {
+  const { backgroundPath, valuePath, percentage, needleAngle } = useMemo21(() => {
     const normalizedValue = Math.min(Math.max(value, min), max);
     const pct = (normalizedValue - min) / (max - min);
     const totalAngle = endAngle - startAngle;
@@ -15952,11 +16097,11 @@ function GaugeChart({
 }
 
 // ../../components/ui/ClientOnly.tsx
-import { useEffect as useEffect24, useState as useState42 } from "react";
+import { useEffect as useEffect25, useState as useState43 } from "react";
 import { Fragment as Fragment24, jsx as jsx60 } from "react/jsx-runtime";
 function ClientOnly({ children, fallback = null }) {
-  const [hasMounted, setHasMounted] = useState42(false);
-  useEffect24(() => {
+  const [hasMounted, setHasMounted] = useState43(false);
+  useEffect25(() => {
     setHasMounted(true);
   }, []);
   if (!hasMounted) {
@@ -16052,9 +16197,9 @@ var LoadingBar = ({
 };
 
 // ../../components/ui/Table.tsx
-import React52 from "react";
+import React53 from "react";
 import { jsx as jsx62, jsxs as jsxs56 } from "react/jsx-runtime";
-var Table = React52.forwardRef(({ className, containerClassName, ...props }, ref) => /* @__PURE__ */ jsx62(
+var Table = React53.forwardRef(({ className, containerClassName, ...props }, ref) => /* @__PURE__ */ jsx62(
   "div",
   {
     className: cn(
@@ -16068,16 +16213,16 @@ var Table = React52.forwardRef(({ className, containerClassName, ...props }, ref
   }
 ));
 Table.displayName = "Table";
-var TableHeader = React52.forwardRef(({ className, children, filterRow, ...props }, ref) => /* @__PURE__ */ jsxs56("thead", { ref, className: cn("[&_tr]:border-b [&_tr]:border-border", "bg-muted", className), ...props, children: [
+var TableHeader = React53.forwardRef(({ className, children, filterRow, ...props }, ref) => /* @__PURE__ */ jsxs56("thead", { ref, className: cn("[&_tr]:border-b [&_tr]:border-border", "bg-muted", className), ...props, children: [
   children,
   filterRow
 ] }));
 TableHeader.displayName = "TableHeader";
-var TableBody = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62("tbody", { ref, className: cn("[&_tr:last-child]:border-0", className), ...props }));
+var TableBody = React53.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62("tbody", { ref, className: cn("[&_tr:last-child]:border-0", className), ...props }));
 TableBody.displayName = "TableBody";
-var TableFooter = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62("tfoot", { ref, className: cn("border-t bg-muted/50 font-medium [&>tr]:last:border-b-0", className), ...props }));
+var TableFooter = React53.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62("tfoot", { ref, className: cn("border-t bg-muted/50 font-medium [&>tr]:last:border-b-0", className), ...props }));
 TableFooter.displayName = "TableFooter";
-var TableRow = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62(
+var TableRow = React53.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62(
   "tr",
   {
     ref,
@@ -16091,7 +16236,7 @@ var TableRow = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__
   }
 ));
 TableRow.displayName = "TableRow";
-var TableHead = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62(
+var TableHead = React53.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62(
   "th",
   {
     ref,
@@ -16100,14 +16245,14 @@ var TableHead = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE_
   }
 ));
 TableHead.displayName = "TableHead";
-var TableCell = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62("td", { ref, className: cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className), ...props }));
+var TableCell = React53.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62("td", { ref, className: cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className), ...props }));
 TableCell.displayName = "TableCell";
-var TableCaption = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62("caption", { ref, className: cn("mt-4 text-sm text-muted-foreground", className), ...props }));
+var TableCaption = React53.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62("caption", { ref, className: cn("mt-4 text-sm text-muted-foreground", className), ...props }));
 TableCaption.displayName = "TableCaption";
 
 // ../../components/ui/DataTable/DataTable.tsx
 import { Filter as FilterIcon } from "lucide-react";
-import React56 from "react";
+import React57 from "react";
 
 // ../../components/ui/DataTable/components/Pagination.tsx
 import { jsx as jsx63, jsxs as jsxs57 } from "react/jsx-runtime";
@@ -16381,10 +16526,10 @@ function DataTableToolbar({
 }
 
 // ../../components/ui/DataTable/hooks/useDebounced.ts
-import React53 from "react";
+import React54 from "react";
 function useDebounced(value, delay = 300) {
-  const [debounced, setDebounced] = React53.useState(value);
-  React53.useEffect(() => {
+  const [debounced, setDebounced] = React54.useState(value);
+  React54.useEffect(() => {
     const id = setTimeout(() => setDebounced(value), delay);
     return () => clearTimeout(id);
   }, [value, delay]);
@@ -16392,10 +16537,10 @@ function useDebounced(value, delay = 300) {
 }
 
 // ../../components/ui/DataTable/hooks/usePageSizeStorage.ts
-import React54 from "react";
+import React55 from "react";
 function usePageSizeStorage({ pageSize, storageKey }) {
-  const loadedFromStorage = React54.useRef(false);
-  const [curPageSize, setCurPageSize] = React54.useState(() => {
+  const loadedFromStorage = React55.useRef(false);
+  const [curPageSize, setCurPageSize] = React55.useState(() => {
     if (typeof window === "undefined" || !storageKey) return pageSize;
     try {
       const saved = localStorage.getItem(`datatable_${storageKey}_pageSize`);
@@ -16410,11 +16555,11 @@ function usePageSizeStorage({ pageSize, storageKey }) {
     }
     return pageSize;
   });
-  const hasMounted = React54.useRef(false);
-  React54.useEffect(() => {
+  const hasMounted = React55.useRef(false);
+  React55.useEffect(() => {
     hasMounted.current = true;
   }, []);
-  React54.useEffect(() => {
+  React55.useEffect(() => {
     if (typeof window === "undefined" || !storageKey) return;
     if (!hasMounted.current) return;
     try {
@@ -16422,7 +16567,7 @@ function usePageSizeStorage({ pageSize, storageKey }) {
     } catch {
     }
   }, [curPageSize, storageKey]);
-  React54.useEffect(() => {
+  React55.useEffect(() => {
     if (storageKey && loadedFromStorage.current) return;
     setCurPageSize(pageSize);
   }, [pageSize, storageKey]);
@@ -16430,7 +16575,7 @@ function usePageSizeStorage({ pageSize, storageKey }) {
 }
 
 // ../../components/ui/DataTable/hooks/useStickyColumns.ts
-import React55 from "react";
+import React56 from "react";
 
 // ../../components/ui/DataTable/utils/columns.ts
 function getColumnWidth(col, fallback = 150) {
@@ -16448,9 +16593,9 @@ function getColumnWidth(col, fallback = 150) {
 
 // ../../components/ui/DataTable/hooks/useStickyColumns.ts
 function useStickyColumns(columns, visibleKeys) {
-  const visibleColumns = React55.useMemo(() => filterVisibleColumns(columns, visibleKeys), [columns, visibleKeys]);
-  const leafColumns = React55.useMemo(() => getLeafColumnsWithFixedInheritance(visibleColumns), [visibleColumns]);
-  const stickyPositions = React55.useMemo(() => {
+  const visibleColumns = React56.useMemo(() => filterVisibleColumns(columns, visibleKeys), [columns, visibleKeys]);
+  const leafColumns = React56.useMemo(() => getLeafColumnsWithFixedInheritance(visibleColumns), [visibleColumns]);
+  const stickyPositions = React56.useMemo(() => {
     const positions = {};
     let leftOffset = 0;
     for (const col of leafColumns) {
@@ -16469,7 +16614,7 @@ function useStickyColumns(columns, visibleKeys) {
     }
     return positions;
   }, [leafColumns]);
-  const getStickyColumnStyle = React55.useCallback(
+  const getStickyColumnStyle = React56.useCallback(
     (col) => {
       if (!col.fixed) return {};
       const pos = stickyPositions[col.key];
@@ -16480,7 +16625,7 @@ function useStickyColumns(columns, visibleKeys) {
     },
     [stickyPositions]
   );
-  const getStickyHeaderClass = React55.useCallback((col) => {
+  const getStickyHeaderClass = React56.useCallback((col) => {
     if (!col.fixed) return "";
     return cn(
       "sticky",
@@ -16489,7 +16634,7 @@ function useStickyColumns(columns, visibleKeys) {
       "z-50 bg-muted!"
     );
   }, []);
-  const getStickyCellClass = React55.useCallback((col, isStripedRow) => {
+  const getStickyCellClass = React56.useCallback((col, isStripedRow) => {
     if (!col.fixed) return "";
     return cn(
       "sticky z-10",
@@ -16498,7 +16643,7 @@ function useStickyColumns(columns, visibleKeys) {
       isStripedRow ? "bg-muted!" : "bg-card!"
     );
   }, []);
-  const getStickyHeaderCellStyle = React55.useCallback(
+  const getStickyHeaderCellStyle = React56.useCallback(
     (headerCell) => {
       const col = headerCell.column;
       if (headerCell.isLeaf) {
@@ -16629,20 +16774,20 @@ function DataTable({
   labels
 }) {
   const t = useTranslations("Common");
-  const [headerAlign, setHeaderAlign] = React56.useState("left");
-  const [visibleCols, setVisibleCols] = React56.useState(() => columns.filter((c) => c.visible !== false).map((c) => c.key));
-  const [filters, setFilters] = React56.useState({});
-  const [sort, setSort] = React56.useState(null);
-  const [density, setDensity] = React56.useState("normal");
-  const [curPage, setCurPage] = React56.useState(page);
+  const [headerAlign, setHeaderAlign] = React57.useState("left");
+  const [visibleCols, setVisibleCols] = React57.useState(() => columns.filter((c) => c.visible !== false).map((c) => c.key));
+  const [filters, setFilters] = React57.useState({});
+  const [sort, setSort] = React57.useState(null);
+  const [density, setDensity] = React57.useState("normal");
+  const [curPage, setCurPage] = React57.useState(page);
   const { curPageSize, setCurPageSize } = usePageSizeStorage({ pageSize, storageKey });
-  React56.useEffect(() => {
+  React57.useEffect(() => {
     if (process.env.NODE_ENV === "development") {
       const warnings = validateColumns(columns);
       warnings.forEach((w) => console.warn(`[DataTable] ${w}`));
     }
   }, [columns]);
-  React56.useEffect(() => {
+  React57.useEffect(() => {
     const newColKeys = columns.filter((c) => c.visible !== false).map((c) => c.key);
     setVisibleCols((prev) => {
       const uniqueKeys = /* @__PURE__ */ new Set([...prev, ...newColKeys]);
@@ -16650,12 +16795,12 @@ function DataTable({
     });
   }, [columns]);
   const debouncedFilters = useDebounced(filters, 350);
-  React56.useEffect(() => {
+  React57.useEffect(() => {
     setCurPage(page);
   }, [page]);
   const isServerMode = Boolean(onQueryChange);
-  const hasEmittedQuery = React56.useRef(false);
-  React56.useEffect(() => {
+  const hasEmittedQuery = React57.useRef(false);
+  React57.useEffect(() => {
     if (!onQueryChange) return;
     if (!hasEmittedQuery.current) {
       hasEmittedQuery.current = true;
@@ -16665,14 +16810,14 @@ function DataTable({
   }, [debouncedFilters, sort, curPage, curPageSize, onQueryChange]);
   const densityRowClass = density === "compact" ? "h-9" : density === "comfortable" ? "h-14" : "h-12";
   const cellPadding = density === "compact" ? "py-1.5 px-3" : density === "comfortable" ? "py-3 px-4" : "py-2.5 px-4";
-  const visibleColsSet = React56.useMemo(() => new Set(visibleCols), [visibleCols]);
-  const visibleColumns = React56.useMemo(() => {
+  const visibleColsSet = React57.useMemo(() => new Set(visibleCols), [visibleCols]);
+  const visibleColumns = React57.useMemo(() => {
     return filterVisibleColumns(columns, visibleColsSet);
   }, [columns, visibleColsSet]);
-  const leafColumns = React56.useMemo(() => {
+  const leafColumns = React57.useMemo(() => {
     return getLeafColumns(visibleColumns);
   }, [visibleColumns]);
-  const totalColumnsWidth = React56.useMemo(() => {
+  const totalColumnsWidth = React57.useMemo(() => {
     return leafColumns.reduce((sum, col) => sum + getColumnWidth(col), 0);
   }, [leafColumns]);
   const { getStickyCellClass, getStickyColumnStyle, getStickyHeaderClass, getStickyHeaderCellStyle } = useStickyColumns(
@@ -16734,7 +16879,7 @@ function DataTable({
     }
     return null;
   };
-  const headerRows = React56.useMemo(() => buildHeaderRows(visibleColumns), [visibleColumns]);
+  const headerRows = React57.useMemo(() => buildHeaderRows(visibleColumns), [visibleColumns]);
   const renderHeaderContent = (col, isLeaf) => {
     if (!isLeaf) {
       return /* @__PURE__ */ jsx65(
@@ -16878,7 +17023,7 @@ function DataTable({
       col.key
     );
   }) }, `header-row-${rowIndex}`)) });
-  const processedData = React56.useMemo(() => {
+  const processedData = React57.useMemo(() => {
     if (isServerMode) return data;
     let result = [...data];
     if (Object.keys(filters).length > 0) {
@@ -16910,7 +17055,7 @@ function DataTable({
     return result;
   }, [data, isServerMode, filters, sort, columns]);
   const totalItems = isServerMode ? total : processedData.length;
-  const displayedData = isServerMode ? data : React56.useMemo(() => {
+  const displayedData = isServerMode ? data : React57.useMemo(() => {
     const start = (curPage - 1) * curPageSize;
     return processedData.slice(start, start + curPageSize);
   }, [processedData, curPage, curPageSize]);
@@ -17029,10 +17174,10 @@ function DataTable({
 var DataTable_default = DataTable;
 
 // ../../components/ui/Form.tsx
-import * as React57 from "react";
+import * as React58 from "react";
 import { Controller, FormProvider, useFormContext, useForm } from "react-hook-form";
 import { jsx as jsx66, jsxs as jsxs60 } from "react/jsx-runtime";
-var FormConfigContext = React57.createContext({ size: "md" });
+var FormConfigContext = React58.createContext({ size: "md" });
 var FormWrapper = ({
   children,
   onSubmit,
@@ -17045,7 +17190,7 @@ var FormWrapper = ({
   const methods = useForm({
     defaultValues: initialValues
   });
-  React57.useEffect(() => {
+  React58.useEffect(() => {
     if (initialValues) {
       methods.reset(initialValues);
     }
@@ -17054,15 +17199,15 @@ var FormWrapper = ({
   return /* @__PURE__ */ jsx66(FormProvider, { ...methods, children: /* @__PURE__ */ jsx66(FormConfigContext.Provider, { value: { size }, children: /* @__PURE__ */ jsx66("form", { onSubmit: methods.handleSubmit(onSubmit), className, ...formProps, children }) }) });
 };
 var Form = FormWrapper;
-var FormFieldContext = React57.createContext({});
+var FormFieldContext = React58.createContext({});
 var FormField = ({
   ...props
 }) => {
   return /* @__PURE__ */ jsx66(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx66(Controller, { ...props }) });
 };
 var useFormField = () => {
-  const fieldContext = React57.useContext(FormFieldContext);
-  const itemContext = React57.useContext(FormItemContext);
+  const fieldContext = React58.useContext(FormFieldContext);
+  const itemContext = React58.useContext(FormItemContext);
   const { getFieldState, formState } = useFormContext();
   if (!fieldContext) {
     try {
@@ -17083,16 +17228,16 @@ var useFormField = () => {
     ...fieldState
   };
 };
-var FormItemContext = React57.createContext({});
-var FormItem = React57.forwardRef(({ className, ...props }, ref) => {
-  const id = React57.useId();
+var FormItemContext = React58.createContext({});
+var FormItem = React58.forwardRef(({ className, ...props }, ref) => {
+  const id = React58.useId();
   return /* @__PURE__ */ jsx66(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsx66("div", { ref, className: cn("space-y-2", className), ...props }) });
 });
 FormItem.displayName = "FormItem";
-var FormLabel = React57.forwardRef(
+var FormLabel = React58.forwardRef(
   ({ className, children, required, ...props }, ref) => {
     const { error, formItemId } = useFormField();
-    const config = React57.useContext(FormConfigContext);
+    const config = React58.useContext(FormConfigContext);
     const sizeClass = config.size === "sm" ? "text-xs" : config.size === "lg" ? "text-base" : "text-sm";
     return /* @__PURE__ */ jsxs60(Label, { ref, className: cn(sizeClass, error && "text-destructive", className), htmlFor: formItemId, ...props, children: [
       children,
@@ -17101,7 +17246,7 @@ var FormLabel = React57.forwardRef(
   }
 );
 FormLabel.displayName = "FormLabel";
-var FormControl = React57.forwardRef(({ ...props }, ref) => {
+var FormControl = React58.forwardRef(({ ...props }, ref) => {
   const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
   return /* @__PURE__ */ jsx66(
     "div",
@@ -17115,12 +17260,12 @@ var FormControl = React57.forwardRef(({ ...props }, ref) => {
   );
 });
 FormControl.displayName = "FormControl";
-var FormDescription = React57.forwardRef(({ className, ...props }, ref) => {
+var FormDescription = React58.forwardRef(({ className, ...props }, ref) => {
   const { formDescriptionId } = useFormField();
   return /* @__PURE__ */ jsx66("p", { ref, id: formDescriptionId, className: cn("text-sm text-muted-foreground", className), ...props });
 });
 FormDescription.displayName = "FormDescription";
-var FormMessage = React57.forwardRef(({ className, children, ...props }, ref) => {
+var FormMessage = React58.forwardRef(({ className, children, ...props }, ref) => {
   const { error, formMessageId } = useFormField();
   const body = error ? String(error?.message) : children;
   if (!body) {
@@ -17129,7 +17274,7 @@ var FormMessage = React57.forwardRef(({ className, children, ...props }, ref) =>
   return /* @__PURE__ */ jsx66("p", { ref, id: formMessageId, className: cn("text-sm font-medium text-destructive", className), ...props, children: body });
 });
 FormMessage.displayName = "FormMessage";
-var FormInput = React57.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */ jsx66(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ jsx66(
+var FormInput = React58.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */ jsx66(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ jsx66(
   FormField,
   {
     name,
@@ -17140,7 +17285,7 @@ var FormInput = React57.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */
   }
 ) }));
 FormInput.displayName = "FormInput";
-var FormCheckbox = React57.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */ jsx66(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ jsx66(
+var FormCheckbox = React58.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */ jsx66(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ jsx66(
   FormField,
   {
     name,
@@ -17164,9 +17309,9 @@ var FormCheckbox = React57.forwardRef(({ name, ...props }, ref) => /* @__PURE__
   }
 ) }));
 FormCheckbox.displayName = "FormCheckbox";
-var FormActions = React57.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx66("div", { ref, className: cn("flex gap-2 justify-end", className), ...props }));
+var FormActions = React58.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx66("div", { ref, className: cn("flex gap-2 justify-end", className), ...props }));
 FormActions.displayName = "FormActions";
-var FormSubmitButton = React57.forwardRef(
+var FormSubmitButton = React58.forwardRef(
   ({ children, loading: loading2, ...props }, ref) => /* @__PURE__ */ jsx66(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ jsx66(Button_default, { ref, type: "submit", size: props.size ?? size, disabled: loading2, ...props, children }) })
 );
 FormSubmitButton.displayName = "FormSubmitButton";
@@ -17341,7 +17486,7 @@ function AccessDenied({
 
 // ../../components/ui/ThemeToggleHeadless.tsx
 import { Moon as Moon2, Sun as Sun2, Monitor } from "lucide-react";
-import { useEffect as useEffect26, useRef as useRef21, useState as useState43 } from "react";
+import { useEffect as useEffect27, useRef as useRef21, useState as useState44 } from "react";
 import { createPortal as createPortal7 } from "react-dom";
 import { Fragment as Fragment26, jsx as jsx70, jsxs as jsxs64 } from "react/jsx-runtime";
 function ThemeToggleHeadless({
@@ -17350,11 +17495,11 @@ function ThemeToggleHeadless({
   labels,
   className
 }) {
-  const [isOpen, setIsOpen] = useState43(false);
-  const [mounted, setMounted] = useState43(false);
+  const [isOpen, setIsOpen] = useState44(false);
+  const [mounted, setMounted] = useState44(false);
   const triggerRef = useRef21(null);
-  const [dropdownPosition, setDropdownPosition] = useState43(null);
-  useEffect26(() => setMounted(true), []);
+  const [dropdownPosition, setDropdownPosition] = useState44(null);
+  useEffect27(() => setMounted(true), []);
   const themes = [
     { value: "light", label: labels?.light ?? "Light", icon: Sun2 },
     { value: "dark", label: labels?.dark ?? "Dark", icon: Moon2 },
@@ -17443,7 +17588,7 @@ function ThemeToggleHeadless({
 }
 
 // ../../components/ui/LanguageSwitcherHeadless.tsx
-import { useRef as useRef22, useState as useState44 } from "react";
+import { useRef as useRef22, useState as useState45 } from "react";
 import { createPortal as createPortal8 } from "react-dom";
 import { Globe } from "lucide-react";
 import { Fragment as Fragment27, jsx as jsx71, jsxs as jsxs65 } from "react/jsx-runtime";
@@ -17454,8 +17599,8 @@ function LanguageSwitcherHeadless({
   labels,
   className
 }) {
-  const [isOpen, setIsOpen] = useState44(false);
-  const [dropdownPosition, setDropdownPosition] = useState44(null);
+  const [isOpen, setIsOpen] = useState45(false);
+  const [dropdownPosition, setDropdownPosition] = useState45(null);
   const triggerButtonRef = useRef22(null);
   const currentLanguage = locales.find((l) => l.code === currentLocale) || locales[0];
   const calculatePosition = () => {
@@ -17948,7 +18093,7 @@ var VARIANT_STYLES_ALERT = {
 };
 
 // src/contexts/TranslationContext.tsx
-import * as React59 from "react";
+import * as React60 from "react";
 
 // locales/en.json
 var en_default = {
@@ -18306,9 +18451,9 @@ var defaultTranslations2 = {
   ko: ko_default,
   ja: ja_default
 };
-var TranslationContext2 = React59.createContext(null);
+var TranslationContext2 = React60.createContext(null);
 var TranslationProvider = ({ children, locale = "en", translations }) => {
-  const t = React59.useCallback(
+  const t = React60.useCallback(
     (namespace) => {
       return (key) => {
         const mergedTranslations = {
@@ -18336,7 +18481,7 @@ var TranslationProvider = ({ children, locale = "en", translations }) => {
   return /* @__PURE__ */ jsx72(TranslationContext2.Provider, { value: { locale, t }, children });
 };
 var useUnderverseTranslations = (namespace) => {
-  const context = React59.useContext(TranslationContext2);
+  const context = React60.useContext(TranslationContext2);
   if (!context) {
     return (key) => {
       const parts = namespace.split(".");
@@ -18358,12 +18503,12 @@ var useUnderverseTranslations = (namespace) => {
   return context.t(namespace);
 };
 var useUnderverseLocale = () => {
-  const context = React59.useContext(TranslationContext2);
+  const context = React60.useContext(TranslationContext2);
   return context?.locale || "en";
 };
 
 // src/hooks/useSmartTranslations.tsx
-import * as React60 from "react";
+import * as React61 from "react";
 import { jsx as jsx73 } from "react/jsx-runtime";
 var nextIntlHooks = null;
 try {
@@ -18375,12 +18520,12 @@ try {
 } catch {
   nextIntlHooks = null;
 }
-var ForceInternalContext = React60.createContext(false);
+var ForceInternalContext = React61.createContext(false);
 var ForceInternalTranslationsProvider = ({ children }) => {
   return /* @__PURE__ */ jsx73(ForceInternalContext.Provider, { value: true, children });
 };
 function useSmartTranslations(namespace) {
-  const forceInternal = React60.useContext(ForceInternalContext);
+  const forceInternal = React61.useContext(ForceInternalContext);
   const internalT = useUnderverseTranslations(namespace);
   if (forceInternal || !nextIntlHooks?.useTranslations) {
     return internalT;
@@ -18393,7 +18538,7 @@ function useSmartTranslations(namespace) {
   }
 }
 function useSmartLocale() {
-  const forceInternal = React60.useContext(ForceInternalContext);
+  const forceInternal = React61.useContext(ForceInternalContext);
   const internalLocale = useUnderverseLocale();
   if (forceInternal || !nextIntlHooks?.useLocale) {
     return internalLocale;
@@ -18407,7 +18552,7 @@ function useSmartLocale() {
 }
 
 // ../../components/ui/UEditor/UEditor.tsx
-import { useEffect as useEffect31, useMemo as useMemo23 } from "react";
+import { useEffect as useEffect32, useMemo as useMemo24 } from "react";
 import { useTranslations as useTranslations7 } from "next-intl";
 import { useEditor, EditorContent } from "@tiptap/react";
 
@@ -18450,7 +18595,7 @@ import { common, createLowlight } from "lowlight";
 import { Extension } from "@tiptap/core";
 import Suggestion from "@tiptap/suggestion";
 import { ReactRenderer } from "@tiptap/react";
-import { forwardRef as forwardRef13, useEffect as useEffect27, useImperativeHandle, useRef as useRef23, useState as useState45 } from "react";
+import { forwardRef as forwardRef13, useEffect as useEffect28, useImperativeHandle, useRef as useRef23, useState as useState46 } from "react";
 import {
   FileCode,
   Heading1,
@@ -18467,12 +18612,12 @@ import {
 import tippy from "tippy.js";
 import { jsx as jsx74, jsxs as jsxs66 } from "react/jsx-runtime";
 var CommandList = forwardRef13((props, ref) => {
-  const [selectedIndex, setSelectedIndex] = useState45(0);
+  const [selectedIndex, setSelectedIndex] = useState46(0);
   const listRef = useRef23(null);
-  useEffect27(() => {
+  useEffect28(() => {
     setSelectedIndex(0);
   }, [props.items]);
-  useEffect27(() => {
+  useEffect28(() => {
     const selectedElement = listRef.current?.querySelector(`[data-index="${selectedIndex}"]`);
     selectedElement?.scrollIntoView({ block: "nearest" });
   }, [selectedIndex, props.items]);
@@ -18781,7 +18926,7 @@ var ClipboardImages = Extension2.create({
 });
 
 // ../../components/ui/UEditor/resizable-image.tsx
-import { useEffect as useEffect28, useRef as useRef24, useState as useState46 } from "react";
+import { useEffect as useEffect29, useRef as useRef24, useState as useState47 } from "react";
 import Image3 from "@tiptap/extension-image";
 import { mergeAttributes } from "@tiptap/core";
 import { NodeViewWrapper, ReactNodeViewRenderer } from "@tiptap/react";
@@ -18803,13 +18948,13 @@ function ResizableImageNodeView(props) {
   const { node, selected, updateAttributes, editor, getPos } = props;
   const wrapperRef = useRef24(null);
   const imgRef = useRef24(null);
-  const [isHovered, setIsHovered] = useState46(false);
-  const [isResizing, setIsResizing] = useState46(false);
+  const [isHovered, setIsHovered] = useState47(false);
+  const [isResizing, setIsResizing] = useState47(false);
   const widthAttr = toNullableNumber(node.attrs["width"]);
   const heightAttr = toNullableNumber(node.attrs["height"]);
   const textAlign = String(node.attrs["textAlign"] ?? "");
   const dragStateRef = useRef24(null);
-  useEffect28(() => {
+  useEffect29(() => {
     const img = imgRef.current;
     if (!img) return;
     img.style.width = widthAttr ? `${widthAttr}px` : "";
@@ -19101,7 +19246,7 @@ function buildUEditorExtensions({
 }
 
 // ../../components/ui/UEditor/toolbar.tsx
-import React65, { useRef as useRef26, useState as useState48 } from "react";
+import React66, { useRef as useRef26, useState as useState49 } from "react";
 import { useTranslations as useTranslations4 } from "next-intl";
 import {
   AlignCenter,
@@ -19139,13 +19284,13 @@ import {
 } from "lucide-react";
 
 // ../../components/ui/UEditor/colors.tsx
-import { useMemo as useMemo21 } from "react";
+import { useMemo as useMemo22 } from "react";
 import { useTranslations as useTranslations2 } from "next-intl";
 import { X as X14 } from "lucide-react";
 import { jsx as jsx76, jsxs as jsxs68 } from "react/jsx-runtime";
 var useEditorColors = () => {
   const t = useTranslations2("UEditor");
-  const textColors = useMemo21(
+  const textColors = useMemo22(
     () => [
       { name: t("colors.default"), color: "inherit", cssClass: "text-foreground" },
       { name: t("colors.muted"), color: "var(--muted-foreground)", cssClass: "text-muted-foreground" },
@@ -19158,7 +19303,7 @@ var useEditorColors = () => {
     ],
     [t]
   );
-  const highlightColors = useMemo21(
+  const highlightColors = useMemo22(
     () => [
       { name: t("colors.default"), color: "", cssClass: "" },
       { name: t("colors.muted"), color: "var(--muted)", cssClass: "bg-muted" },
@@ -19203,7 +19348,7 @@ var EditorColorPalette = ({
 ] });
 
 // ../../components/ui/UEditor/inputs.tsx
-import { useEffect as useEffect29, useRef as useRef25, useState as useState47 } from "react";
+import { useEffect as useEffect30, useRef as useRef25, useState as useState48 } from "react";
 import { useTranslations as useTranslations3 } from "next-intl";
 import { Check as Check9, X as X15 } from "lucide-react";
 import { jsx as jsx77, jsxs as jsxs69 } from "react/jsx-runtime";
@@ -19220,9 +19365,9 @@ var LinkInput = ({
   initialUrl = ""
 }) => {
   const t = useTranslations3("UEditor");
-  const [url, setUrl] = useState47(initialUrl);
+  const [url, setUrl] = useState48(initialUrl);
   const inputRef = useRef25(null);
-  useEffect29(() => {
+  useEffect30(() => {
     inputRef.current?.focus();
     inputRef.current?.select();
   }, []);
@@ -19249,10 +19394,10 @@ var LinkInput = ({
 };
 var ImageInput = ({ onSubmit, onCancel }) => {
   const t = useTranslations3("UEditor");
-  const [url, setUrl] = useState47("");
-  const [alt, setAlt] = useState47("");
+  const [url, setUrl] = useState48("");
+  const [alt, setAlt] = useState48("");
   const inputRef = useRef25(null);
-  useEffect29(() => {
+  useEffect30(() => {
     inputRef.current?.focus();
   }, []);
   const handleSubmit = (e) => {
@@ -19314,7 +19459,7 @@ function fileToDataUrl2(file) {
     reader.readAsDataURL(file);
   });
 }
-var ToolbarButton = React65.forwardRef(({ onClick, onMouseDown, active, disabled, children, title, className }, ref) => {
+var ToolbarButton = React66.forwardRef(({ onClick, onMouseDown, active, disabled, children, title, className }, ref) => {
   const button = /* @__PURE__ */ jsx78(
     "button",
     {
@@ -19352,10 +19497,10 @@ var EditorToolbar = ({
 }) => {
   const t = useTranslations4("UEditor");
   const { textColors, highlightColors } = useEditorColors();
-  const [showImageInput, setShowImageInput] = useState48(false);
+  const [showImageInput, setShowImageInput] = useState49(false);
   const fileInputRef = useRef26(null);
-  const [isUploadingImage, setIsUploadingImage] = useState48(false);
-  const [imageUploadError, setImageUploadError] = useState48(null);
+  const [isUploadingImage, setIsUploadingImage] = useState49(false);
+  const [imageUploadError, setImageUploadError] = useState49(null);
   const insertImageFiles = async (files) => {
     if (files.length === 0) return;
     setIsUploadingImage(true);
@@ -19772,7 +19917,7 @@ var EditorToolbar = ({
 };
 
 // ../../components/ui/UEditor/menus.tsx
-import { useCallback as useCallback14, useEffect as useEffect30, useMemo as useMemo22, useRef as useRef27, useState as useState49 } from "react";
+import { useCallback as useCallback15, useEffect as useEffect31, useMemo as useMemo23, useRef as useRef27, useState as useState50 } from "react";
 import { createPortal as createPortal9 } from "react-dom";
 import { useTranslations as useTranslations5 } from "next-intl";
 import {
@@ -19801,9 +19946,9 @@ import {
 import { jsx as jsx79, jsxs as jsxs71 } from "react/jsx-runtime";
 var SlashCommandMenu = ({ editor, onClose, filterText = "" }) => {
   const t = useTranslations5("UEditor");
-  const [selectedIndex, setSelectedIndex] = useState49(0);
+  const [selectedIndex, setSelectedIndex] = useState50(0);
   const menuRef = useRef27(null);
-  const allCommands = useMemo22(
+  const allCommands = useMemo23(
     () => [
       {
         icon: Type3,
@@ -19874,19 +20019,19 @@ var SlashCommandMenu = ({ editor, onClose, filterText = "" }) => {
     ],
     [editor, t]
   );
-  const commands = useMemo22(() => {
+  const commands = useMemo23(() => {
     if (!filterText) return allCommands;
     const lowerFilter = filterText.toLowerCase();
     return allCommands.filter((cmd) => cmd.label.toLowerCase().includes(lowerFilter) || cmd.description.toLowerCase().includes(lowerFilter));
   }, [allCommands, filterText]);
-  useEffect30(() => {
+  useEffect31(() => {
     setSelectedIndex(0);
   }, [filterText]);
-  useEffect30(() => {
+  useEffect31(() => {
     const selectedElement = menuRef.current?.querySelector(`[data-index="${selectedIndex}"]`);
     selectedElement?.scrollIntoView({ block: "nearest" });
   }, [selectedIndex]);
-  const selectCommand = useCallback14(
+  const selectCommand = useCallback15(
     (index) => {
       const command = commands[index];
       if (command) {
@@ -19896,7 +20041,7 @@ var SlashCommandMenu = ({ editor, onClose, filterText = "" }) => {
     },
     [commands, onClose]
   );
-  useEffect30(() => {
+  useEffect31(() => {
     const handleKeyDown = (e) => {
       if (commands.length === 0) return;
       if (e.key === "ArrowDown") {
@@ -19956,7 +20101,7 @@ var SlashCommandMenu = ({ editor, onClose, filterText = "" }) => {
 };
 var FloatingMenuContent = ({ editor }) => {
   const t = useTranslations5("UEditor");
-  const [showCommands, setShowCommands] = useState49(false);
+  const [showCommands, setShowCommands] = useState50(false);
   if (showCommands) {
     return /* @__PURE__ */ jsx79(SlashCommandMenu, { editor, onClose: () => setShowCommands(false) });
   }
@@ -19979,12 +20124,12 @@ var BubbleMenuContent = ({
 }) => {
   const t = useTranslations5("UEditor");
   const { textColors, highlightColors } = useEditorColors();
-  const [showLinkInput, setShowLinkInput] = useState49(false);
-  const [showEditorColorPalette, setShowEditorColorPalette] = useState49(false);
-  useEffect30(() => {
+  const [showLinkInput, setShowLinkInput] = useState50(false);
+  const [showEditorColorPalette, setShowEditorColorPalette] = useState50(false);
+  useEffect31(() => {
     onKeepOpenChange?.(showLinkInput);
   }, [onKeepOpenChange, showLinkInput]);
-  useEffect30(() => {
+  useEffect31(() => {
     if (!showLinkInput) return;
     const close = () => setShowLinkInput(false);
     editor.on("selectionUpdate", close);
@@ -20107,15 +20252,15 @@ var BubbleMenuContent = ({
   ] });
 };
 var CustomBubbleMenu = ({ editor }) => {
-  const [isVisible, setIsVisible] = useState49(false);
-  const [position, setPosition] = useState49({ top: 0, left: 0 });
+  const [isVisible, setIsVisible] = useState50(false);
+  const [position, setPosition] = useState50({ top: 0, left: 0 });
   const menuRef = useRef27(null);
   const keepOpenRef = useRef27(false);
-  const setKeepOpen = useCallback14((next) => {
+  const setKeepOpen = useCallback15((next) => {
     keepOpenRef.current = next;
     if (next) setIsVisible(true);
   }, []);
-  useEffect30(() => {
+  useEffect31(() => {
     const updatePosition = () => {
       const { state, view } = editor;
       const { from, to, empty } = state.selection;
@@ -20168,9 +20313,9 @@ var CustomBubbleMenu = ({ editor }) => {
   );
 };
 var CustomFloatingMenu = ({ editor }) => {
-  const [isVisible, setIsVisible] = useState49(false);
-  const [position, setPosition] = useState49({ top: 0, left: 0 });
-  useEffect30(() => {
+  const [isVisible, setIsVisible] = useState50(false);
+  const [position, setPosition] = useState50({ top: 0, left: 0 });
+  useEffect31(() => {
     const updatePosition = () => {
       const { state, view } = editor;
       const { $from, empty } = state.selection;
@@ -20266,7 +20411,7 @@ var UEditor = ({
 }) => {
   const t = useTranslations7("UEditor");
   const effectivePlaceholder = placeholder ?? t("placeholder");
-  const extensions = useMemo23(
+  const extensions = useMemo24(
     () => buildUEditorExtensions({ placeholder: effectivePlaceholder, maxCharacters, uploadImage, imageInsertMode, editable }),
     [effectivePlaceholder, maxCharacters, uploadImage, imageInsertMode, editable]
   );
@@ -20375,7 +20520,7 @@ var UEditor = ({
       onJsonChange?.(editor2.getJSON());
     }
   });
-  useEffect31(() => {
+  useEffect32(() => {
     if (editor && content !== editor.getHTML()) {
       if (editor.isEmpty && content) {
         editor.commands.setContent(content);