@underverse-ui/underverse 1.0.48 → 1.0.49

package/dist/index.js

@@ -476,18 +476,18 @@ var Card = React2.forwardRef(
               )
             }
           ),
-          (title || description) && /* @__PURE__ */ jsxs3("div", { className: cn("relative flex flex-col space-y-2 p-4 md:p-6 max-md:space-y-1.5 max-md:p-3", headerClassName), children: [
+          (title || description) && /* @__PURE__ */ jsxs3("div", { className: cn("relative flex min-w-0 flex-col space-y-2 p-4 md:p-6 max-md:space-y-1.5 max-md:p-3", headerClassName), children: [
             title && /* @__PURE__ */ jsx3(
               "h3",
               {
                 className: cn(
-                  "text-base md:text-lg font-semibold leading-none tracking-tight transition-colors duration-200 max-md:text-sm",
+                  "min-w-0 text-base md:text-lg font-semibold leading-tight tracking-tight break-words [overflow-wrap:anywhere] transition-colors duration-200 max-md:text-sm",
                   hoverable && "group-hover:text-primary"
                 ),
                 children: title
               }
             ),
-            description && /* @__PURE__ */ jsx3("p", { className: "text-sm md:text-base text-muted-foreground leading-relaxed", children: description })
+            description && /* @__PURE__ */ jsx3("p", { className: "min-w-0 text-sm md:text-base text-muted-foreground leading-relaxed break-words [overflow-wrap:anywhere]", children: description })
           ] }),
           children && /* @__PURE__ */ jsx3("div", { className: cn("relative", defaultPaddingX, defaultPaddingY, contentClassName), children }),
           footer && /* @__PURE__ */ jsx3("div", { className: cn("relative flex items-center p-4 md:p-6 pt-0 border-t border-border mt-4 max-md:mt-3 max-md:p-3 max-md:pt-0", footerClassName), children: footer })
@@ -14782,7 +14782,7 @@ function OverlayControls({
 // src/components/CategoryTreeSelect.tsx
 import { useEffect as useEffect22, useId as useId7, useMemo as useMemo17, useRef as useRef17, useState as useState29 } from "react";
 import { ChevronRight as ChevronRight6, ChevronDown as ChevronDown5, FolderTree, Layers, Search as Search5, SearchX as SearchX3, X as X13 } from "lucide-react";
-import { Fragment as Fragment16, jsx as jsx46, jsxs as jsxs38 } from "react/jsx-runtime";
+import { jsx as jsx46, jsxs as jsxs38 } from "react/jsx-runtime";
 var defaultLabels = {
   emptyText: "No categories",
   selectedText: (count) => `${count} selected`,
@@ -14827,6 +14827,7 @@ function CategoryTreeSelect(props) {
   const describedBy = errorId || helperId;
   const mergedLabels = { ...defaultLabels, ...labels };
   const valueArray = singleSelect ? props.value != null ? [props.value] : [] : props.value || [];
+  const selectedIds = useMemo17(() => new Set(valueArray), [valueArray]);
   const { parentCategories, childrenMap, byId } = useMemo17(() => {
     const byId2 = /* @__PURE__ */ new Map();
     const childrenMap2 = /* @__PURE__ */ new Map();
@@ -14941,65 +14942,80 @@ function CategoryTreeSelect(props) {
     }
   };
   const renderCategory = (category, level = 0) => {
-    const allChildren = childrenMap.get(category.id) || [];
-    const children = isSearchMode ? allChildren.filter((c) => visibleIds?.has(c.id)) : allChildren;
+    const children = effectiveChildrenMap.get(category.id) || [];
     const hasChildren = children.length > 0;
     const isExpanded = hasChildren && (isSearchMode || expandedNodes.has(category.id));
-    const isSelected = valueArray.includes(category.id);
-    const isParent = level === 0;
-    return /* @__PURE__ */ jsxs38("div", { className: "animate-in fade-in-50 duration-200", style: { animationDelay: `${level * 30}ms` }, children: [
-      /* @__PURE__ */ jsxs38(
-        "div",
-        {
-          onClick: () => !viewOnly && handleSelect(category.id, category),
-          className: cn(
-            "relative flex items-center gap-2.5 px-3 py-2.5 min-h-11 transition-all duration-200 rounded-full",
-            // Không phân biệt parent/child - đồng bộ màu
-            !viewOnly && "cursor-pointer",
-            !viewOnly && !isSelected && "hover:bg-accent/50",
-            // Selected state - đồng bộ cho tất cả
-            !viewOnly && isSelected && "bg-accent/40"
+    const isSelected = selectedIds.has(category.id);
+    return /* @__PURE__ */ jsxs38(
+      "div",
+      {
+        className: "min-w-0 animate-in fade-in-50 duration-200 [content-visibility:auto] [contain-intrinsic-size:44px]",
+        style: { animationDelay: `${level * 30}ms` },
+        children: [
+          /* @__PURE__ */ jsxs38(
+            "div",
+            {
+              onClick: () => !viewOnly && handleSelect(category.id, category),
+              className: cn(
+                "relative flex min-w-0 items-center gap-2.5 px-3 py-2.5 min-h-11 transition-all duration-200 rounded-3xl",
+                // Không phân biệt parent/child - đồng bộ màu
+                !viewOnly && "cursor-pointer",
+                !viewOnly && !isSelected && "hover:bg-accent/50",
+                // Selected state - đồng bộ cho tất cả
+                !viewOnly && isSelected && "bg-accent/40"
+              ),
+              style: { paddingLeft: `${level * 1.25 + 0.75}rem` },
+              children: [
+                hasChildren ? /* @__PURE__ */ jsx46(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: (e) => {
+                      e.stopPropagation();
+                      toggleExpand(category.id);
+                    },
+                    className: cn(
+                      "p-1.5 rounded-lg transition-all duration-200",
+                      "hover:scale-110 active:scale-95",
+                      "focus:outline-none focus-visible:ring-2 focus-visible:ring-primary/50",
+                      isExpanded && "text-primary",
+                      isSearchMode && "opacity-60 cursor-not-allowed hover:scale-100 active:scale-100"
+                    ),
+                    disabled: isSearchMode,
+                    children: /* @__PURE__ */ jsx46("div", { className: cn("transition-transform duration-200", isExpanded && "rotate-90"), children: /* @__PURE__ */ jsx46(ChevronRight6, { className: "w-4 h-4" }) })
+                  }
+                ) : /* @__PURE__ */ jsx46("span", { className: "w-7" }),
+                viewOnly ? (
+                  // View-only mode: just display the name with folder icon
+                  /* @__PURE__ */ jsxs38("div", { className: "flex min-w-0 items-center gap-2.5", children: [
+                    category.icon ? /* @__PURE__ */ jsx46("div", { className: "h-4 w-4 shrink-0 flex items-center justify-center text-muted-foreground/60", children: category.icon }) : hasChildren ? /* @__PURE__ */ jsx46(FolderTree, { className: "h-4 w-4 shrink-0 text-muted-foreground/60" }) : /* @__PURE__ */ jsx46("div", { className: "h-1.5 w-1.5 shrink-0 rounded-full bg-muted-foreground/40" }),
+                    /* @__PURE__ */ jsx46("span", { className: "min-w-0 text-sm font-medium leading-snug break-words [overflow-wrap:anywhere]", children: category.name })
+                  ] })
+                ) : (
+                  // Single/Multi select mode: icon + text + badge
+                  /* @__PURE__ */ jsxs38("div", { className: "flex min-w-0 flex-1 items-center gap-2.5 overflow-hidden", children: [
+                    category.icon && /* @__PURE__ */ jsx46("div", { className: "h-4 w-4 shrink-0 flex items-center justify-center text-current", children: category.icon }),
+                    /* @__PURE__ */ jsx46(
+                      "span",
+                      {
+                        className: cn(
+                          "min-w-0 flex-1 text-sm leading-snug break-words [overflow-wrap:anywhere] transition-all duration-200",
+                          isSelected ? "font-semibold text-primary" : "text-foreground/80"
+                        ),
+                        children: category.name
+                      }
+                    ),
+                    hasChildren && !isSelected && /* @__PURE__ */ jsx46("span", { className: "ml-auto shrink-0 text-[10px] font-medium text-muted-foreground/50 bg-muted/50 px-1.5 py-0.5 rounded-md", children: children.length })
+                  ] })
+                )
+              ]
+            }
           ),
-          style: { paddingLeft: `${level * 1.25 + 0.75}rem` },
-          children: [
-            hasChildren ? /* @__PURE__ */ jsx46(
-              "button",
-              {
-                type: "button",
-                onClick: (e) => {
-                  e.stopPropagation();
-                  toggleExpand(category.id);
-                },
-                className: cn(
-                  "p-1.5 rounded-lg transition-all duration-200",
-                  "hover:scale-110 active:scale-95",
-                  "focus:outline-none focus-visible:ring-2 focus-visible:ring-primary/50",
-                  isExpanded && "text-primary",
-                  isSearchMode && "opacity-60 cursor-not-allowed hover:scale-100 active:scale-100"
-                ),
-                disabled: isSearchMode,
-                children: /* @__PURE__ */ jsx46("div", { className: cn("transition-transform duration-200", isExpanded && "rotate-90"), children: /* @__PURE__ */ jsx46(ChevronRight6, { className: "w-4 h-4" }) })
-              }
-            ) : /* @__PURE__ */ jsx46("span", { className: "w-7" }),
-            viewOnly ? (
-              // View-only mode: just display the name with folder icon
-              /* @__PURE__ */ jsxs38("div", { className: "flex items-center gap-2.5", children: [
-                category.icon ? /* @__PURE__ */ jsx46("div", { className: "w-4 h-4 flex items-center justify-center text-muted-foreground/60", children: category.icon }) : hasChildren ? /* @__PURE__ */ jsx46(FolderTree, { className: "w-4 h-4 text-muted-foreground/60" }) : /* @__PURE__ */ jsx46("div", { className: "w-1.5 h-1.5 rounded-full bg-muted-foreground/40" }),
-                /* @__PURE__ */ jsx46("span", { className: "text-sm font-medium", children: category.name })
-              ] })
-            ) : (
-              // Single/Multi select mode: icon + text + badge
-              /* @__PURE__ */ jsxs38("div", { className: "flex items-center gap-2.5 flex-1", children: [
-                category.icon && /* @__PURE__ */ jsx46("div", { className: "w-4 h-4 flex items-center justify-center text-current", children: category.icon }),
-                /* @__PURE__ */ jsx46("span", { className: cn("text-sm transition-all duration-200", isSelected ? "font-semibold text-primary" : "text-foreground/80"), children: category.name }),
-                hasChildren && !isSelected && /* @__PURE__ */ jsx46("span", { className: "ml-auto text-[10px] font-medium text-muted-foreground/50 bg-muted/50 px-1.5 py-0.5 rounded-md", children: children.length })
-              ] })
-            )
-          ]
-        }
-      ),
-      hasChildren && isExpanded && /* @__PURE__ */ jsx46("div", { className: cn("ml-2 pl-2 border-l-2 border-dashed border-border/50", "animate-in slide-in-from-top-2 fade-in-50 duration-200"), children: children.map((child) => renderCategory(child, level + 1)) })
-    ] }, category.id);
+          hasChildren && isExpanded && /* @__PURE__ */ jsx46("div", { className: cn("ml-2 pl-2 border-l-2 border-dashed border-border/50", "animate-in slide-in-from-top-2 fade-in-50 duration-200"), children: children.map((child) => renderCategory(child, level + 1)) })
+        ]
+      },
+      category.id
+    );
   };
   const renderSearch = () => {
     if (!isSearchEnabled) return null;
@@ -15045,7 +15061,18 @@ function CategoryTreeSelect(props) {
     if (!isSearchMode) return parentCategories;
     return parentCategories.filter((c) => visibleIds?.has(c.id));
   }, [isSearchMode, parentCategories, visibleIds]);
-  const renderTreeContent = () => /* @__PURE__ */ jsx46("div", { className: "space-y-0.5", children: effectiveParentCategories.length === 0 ? /* @__PURE__ */ jsxs38("div", { className: "flex flex-col items-center justify-center py-8 text-center", children: [
+  const effectiveChildrenMap = useMemo17(() => {
+    if (!isSearchMode || !visibleIds) return childrenMap;
+    const next = /* @__PURE__ */ new Map();
+    for (const [parentId, children] of childrenMap.entries()) {
+      next.set(
+        parentId,
+        children.filter((child) => visibleIds.has(child.id))
+      );
+    }
+    return next;
+  }, [childrenMap, isSearchMode, visibleIds]);
+  const renderTreeContent = () => /* @__PURE__ */ jsx46("div", { className: "space-y-0.5 overflow-x-hidden", children: effectiveParentCategories.length === 0 ? /* @__PURE__ */ jsxs38("div", { className: "flex flex-col items-center justify-center py-8 text-center", children: [
     /* @__PURE__ */ jsx46("div", { className: "w-12 h-12 rounded-2xl bg-muted/50 flex items-center justify-center mb-3", children: isSearchMode ? /* @__PURE__ */ jsx46(SearchX3, { className: "w-6 h-6 text-muted-foreground/50" }) : /* @__PURE__ */ jsx46(Layers, { className: "w-6 h-6 text-muted-foreground/50" }) }),
     /* @__PURE__ */ jsx46("span", { className: "text-sm text-muted-foreground", children: isSearchMode ? mergedLabels.noResultsText : mergedLabels.emptyText })
   ] }) : effectiveParentCategories.map((cat) => renderCategory(cat)) });
@@ -15168,104 +15195,108 @@ function CategoryTreeSelect(props) {
       displayText = mergedLabels.selectedText(selectedCount);
     }
   }
+  const dropdownBody = /* @__PURE__ */ jsxs38(
+    "div",
+    {
+      ref: dropdownViewportRef,
+      id: `${resolvedId}-tree`,
+      className: cn("max-h-80 overflow-auto overflow-x-hidden p-2"),
+      children: [
+        renderSearch(),
+        renderTreeContent()
+      ]
+    }
+  );
   return /* @__PURE__ */ jsxs38("div", { className: cn("w-full space-y-2", className), children: [
     renderLabel(),
-    /* @__PURE__ */ jsxs38("div", { className: "relative", children: [
-      /* @__PURE__ */ jsxs38(
-        "button",
-        {
-          id: resolvedId,
-          type: "button",
-          onClick: () => !disabled && setIsOpen(!isOpen),
-          disabled,
-          role: "combobox",
-          "aria-haspopup": "tree",
-          "aria-expanded": isOpen,
-          "aria-controls": `${resolvedId}-tree`,
-          "aria-labelledby": labelId,
-          "aria-describedby": describedBy,
-          "aria-invalid": !!error,
-          className: cn(
-            "group flex w-full items-center justify-between rounded-full transition-all duration-200",
-            "backdrop-blur-sm",
-            triggerSizeStyles[size].button,
-            triggerVariantStyles[variant],
-            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50 focus-visible:ring-offset-2 focus-visible:ring-offset-background",
-            disabled && "opacity-50 cursor-not-allowed hover:transform-none hover:shadow-none",
-            isOpen && "ring-2 ring-primary/30 border-primary/50 shadow-lg shadow-primary/10",
-            error && "border-destructive focus-visible:ring-destructive/30"
-          ),
-          children: [
-            /* @__PURE__ */ jsxs38("div", { className: "flex min-w-0 flex-1 items-center gap-2.5 text-left", children: [
-              /* @__PURE__ */ jsx46(
-                "div",
-                {
-                  className: cn(
-                    "shrink-0 flex items-center justify-center rounded-lg transition-all duration-300",
-                    triggerSizeStyles[size].iconWrap,
-                    isOpen ? "bg-primary/15 text-primary" : "bg-muted/50 text-muted-foreground group-hover:bg-primary/10 group-hover:text-primary"
-                  ),
-                  children: /* @__PURE__ */ jsx46(FolderTree, { className: cn(triggerSizeStyles[size].icon, "transition-transform duration-300", isOpen && "scale-110") })
-                }
-              ),
-              /* @__PURE__ */ jsx46(
-                "span",
-                {
-                  className: cn(
-                    "min-w-0 flex-1 truncate font-medium transition-colors duration-200",
-                    triggerSizeStyles[size].text,
-                    selectedCount === 0 ? "text-muted-foreground" : "text-foreground"
-                  ),
-                  title: displayText,
-                  children: displayText
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsxs38("div", { className: "ml-2 flex shrink-0 items-center gap-1.5", children: [
-              allowClear && selectedCount > 0 && !disabled && /* @__PURE__ */ jsx46(
-                "div",
-                {
-                  role: "button",
-                  tabIndex: 0,
-                  "aria-label": "Clear selection",
-                  onClick: handleClear,
-                  onKeyDown: (event) => (event.key === "Enter" || event.key === " ") && handleClear(event),
-                  className: cn(
-                    "opacity-0 group-hover:opacity-100 transition-all duration-200",
-                    "p-1 rounded-lg hover:bg-destructive/10 text-muted-foreground hover:text-destructive",
-                    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30"
-                  ),
-                  children: /* @__PURE__ */ jsx46(X13, { className: triggerSizeStyles[size].clearIcon })
-                }
-              ),
-              selectedCount > 0 && !singleSelect && /* @__PURE__ */ jsx46("span", { className: cn("rounded-full bg-primary/15 font-bold text-primary", triggerSizeStyles[size].badge), children: selectedCount }),
-              /* @__PURE__ */ jsx46("span", { className: cn("transition-all duration-300 text-muted-foreground group-hover:text-foreground", isOpen && "rotate-180 text-primary"), children: /* @__PURE__ */ jsx46(ChevronDown5, { className: triggerSizeStyles[size].actionIcon }) })
-            ] })
-          ]
-        }
-      ),
-      isOpen && !disabled && /* @__PURE__ */ jsxs38(Fragment16, { children: [
-        /* @__PURE__ */ jsx46("div", { className: "fixed inset-0 z-10", onClick: () => setIsOpen(false) }),
-        /* @__PURE__ */ jsxs38(
-          "div",
+    /* @__PURE__ */ jsx46(
+      Popover,
+      {
+        open: isOpen,
+        onOpenChange: setIsOpen,
+        disabled,
+        placement: "bottom-start",
+        matchTriggerWidth: true,
+        className: "z-9999",
+        contentClassName: cn(
+          "p-0 overflow-hidden rounded-2xl md:rounded-3xl",
+          "border-border/40 bg-popover/95 text-popover-foreground",
+          "shadow-2xl backdrop-blur-xl"
+        ),
+        trigger: /* @__PURE__ */ jsxs38(
+          "button",
           {
-            ref: dropdownViewportRef,
-            id: `${resolvedId}-tree`,
+            id: resolvedId,
+            type: "button",
+            disabled,
+            role: "combobox",
+            "aria-haspopup": "tree",
+            "aria-controls": `${resolvedId}-tree`,
+            "aria-labelledby": labelId,
+            "aria-describedby": describedBy,
+            "aria-invalid": !!error,
             className: cn(
-              "absolute z-20 mt-2 w-full max-h-80 overflow-auto",
-              "rounded-2xl md:rounded-3xl border border-border/40 bg-popover/95 text-popover-foreground",
-              "shadow-2xl backdrop-blur-xl",
-              "p-2",
-              "animate-in fade-in-0 zoom-in-95 slide-in-from-top-2 duration-300"
+              "group flex w-full items-center justify-between rounded-full transition-all duration-200",
+              "backdrop-blur-sm",
+              triggerSizeStyles[size].button,
+              triggerVariantStyles[variant],
+              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50 focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+              disabled && "opacity-50 cursor-not-allowed hover:transform-none hover:shadow-none",
+              isOpen && "ring-2 ring-primary/30 border-primary/50 shadow-lg shadow-primary/10",
+              error && "border-destructive focus-visible:ring-destructive/30"
             ),
             children: [
-              renderSearch(),
-              renderTreeContent()
+              /* @__PURE__ */ jsxs38("div", { className: "flex min-w-0 flex-1 items-center gap-2.5 text-left", children: [
+                /* @__PURE__ */ jsx46(
+                  "div",
+                  {
+                    className: cn(
+                      "shrink-0 flex items-center justify-center rounded-lg transition-all duration-300",
+                      triggerSizeStyles[size].iconWrap,
+                      isOpen ? "bg-primary/15 text-primary" : "bg-muted/50 text-muted-foreground group-hover:bg-primary/10 group-hover:text-primary"
+                    ),
+                    children: /* @__PURE__ */ jsx46(FolderTree, { className: cn(triggerSizeStyles[size].icon, "transition-transform duration-300", isOpen && "scale-110") })
+                  }
+                ),
+                /* @__PURE__ */ jsx46(
+                  "span",
+                  {
+                    className: cn(
+                      "min-w-0 flex-1 truncate font-medium transition-colors duration-200",
+                      triggerSizeStyles[size].text,
+                      selectedCount === 0 ? "text-muted-foreground" : "text-foreground"
+                    ),
+                    title: displayText,
+                    children: displayText
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs38("div", { className: "ml-2 flex shrink-0 items-center gap-1.5", children: [
+                allowClear && selectedCount > 0 && !disabled && /* @__PURE__ */ jsx46(
+                  "div",
+                  {
+                    role: "button",
+                    tabIndex: 0,
+                    "aria-label": "Clear selection",
+                    onClick: handleClear,
+                    onKeyDown: (event) => (event.key === "Enter" || event.key === " ") && handleClear(event),
+                    className: cn(
+                      "opacity-0 group-hover:opacity-100 transition-all duration-200",
+                      "p-1 rounded-lg hover:bg-destructive/10 text-muted-foreground hover:text-destructive",
+                      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30"
+                    ),
+                    children: /* @__PURE__ */ jsx46(X13, { className: triggerSizeStyles[size].clearIcon })
+                  }
+                ),
+                selectedCount > 0 && !singleSelect && /* @__PURE__ */ jsx46("span", { className: cn("rounded-full bg-primary/15 font-bold text-primary", triggerSizeStyles[size].badge), children: selectedCount }),
+                /* @__PURE__ */ jsx46("span", { className: cn("transition-all duration-300 text-muted-foreground group-hover:text-foreground", isOpen && "rotate-180 text-primary"), children: /* @__PURE__ */ jsx46(ChevronDown5, { className: triggerSizeStyles[size].actionIcon }) })
+              ] })
             ]
           }
-        )
-      ] })
-    ] }),
+        ),
+        children: dropdownBody
+      }
+    ),
     renderAssistiveText()
   ] });
 }
@@ -15511,7 +15542,7 @@ import {
   Upload as Upload2
 } from "lucide-react";
 import { useCallback as useCallback14, useMemo as useMemo18, useRef as useRef19, useState as useState31 } from "react";
-import { Fragment as Fragment17, jsx as jsx48, jsxs as jsxs40 } from "react/jsx-runtime";
+import { Fragment as Fragment16, jsx as jsx48, jsxs as jsxs40 } from "react/jsx-runtime";
 var formatFileSize = (bytes) => {
   if (bytes === 0) return "0 Bytes";
   const k = 1024;
@@ -15944,7 +15975,7 @@ function FileUpload({
             ] }),
             /* @__PURE__ */ jsx48("p", { className: cn("text-muted-foreground", size === "lg" ? "text-sm" : "text-xs"), children: supportedFormatsText || t("supportedFormats") || `Max ${maxSize}MB per file \u2022 Up to ${maxFiles} files` })
           ] }),
-          variant === "compact" && /* @__PURE__ */ jsxs40(Fragment17, { children: [
+          variant === "compact" && /* @__PURE__ */ jsxs40(Fragment16, { children: [
             /* @__PURE__ */ jsx48("div", { className: cn("shrink-0 rounded-lg flex items-center justify-center", "bg-primary/10", currentSize.iconSize), children: /* @__PURE__ */ jsx48(Upload2, { className: cn("text-primary", size === "sm" ? "w-4 h-4" : "w-5 h-5") }) }),
             /* @__PURE__ */ jsxs40("div", { className: "flex-1 min-w-0", children: [
               /* @__PURE__ */ jsx48("p", { className: cn("font-medium truncate", currentSize.text), children: dragDropText || t("dragDropText") || "Drop files here or" }),
@@ -16011,7 +16042,7 @@ function FileUpload({
 // src/components/Carousel.tsx
 import * as React42 from "react";
 import { ChevronLeft as ChevronLeft5, ChevronRight as ChevronRight7 } from "lucide-react";
-import { Fragment as Fragment18, jsx as jsx49, jsxs as jsxs41 } from "react/jsx-runtime";
+import { Fragment as Fragment17, jsx as jsx49, jsxs as jsxs41 } from "react/jsx-runtime";
 function Carousel({
   children,
   autoScroll = true,
@@ -16223,7 +16254,7 @@ function Carousel({
             ))
           }
         ),
-        showArrows && totalSlides > slidesToShow && /* @__PURE__ */ jsxs41(Fragment18, { children: [
+        showArrows && totalSlides > slidesToShow && /* @__PURE__ */ jsxs41(Fragment17, { children: [
           /* @__PURE__ */ jsx49(
             Button_default,
             {
@@ -16585,7 +16616,7 @@ function FallingIcons({
 // src/components/List.tsx
 import * as React44 from "react";
 import { ChevronRight as ChevronRight8 } from "lucide-react";
-import { Fragment as Fragment19, jsx as jsx51, jsxs as jsxs43 } from "react/jsx-runtime";
+import { Fragment as Fragment18, jsx as jsx51, jsxs as jsxs43 } from "react/jsx-runtime";
 var SIZE_STYLES2 = {
   xs: { label: "text-xs", desc: "text-[11px]", icon: "h-3.5 w-3.5", avatar: "h-6 w-6" },
   sm: { label: "text-[13px]", desc: "text-[12px]", icon: "h-4 w-4", avatar: "h-8 w-8" },
@@ -16737,7 +16768,7 @@ var ListItem = React44.forwardRef(
         }
       }
     } : {};
-    const inner = /* @__PURE__ */ jsxs43(Fragment19, { children: [
+    const inner = /* @__PURE__ */ jsxs43(Fragment18, { children: [
       /* @__PURE__ */ jsxs43("div", { className: cn("flex items-center gap-3 group/item relative max-md:gap-2.5", contentClassName), ...headerProps, children: [
         avatar && /* @__PURE__ */ jsx51("div", { className: cn("shrink-0", sz.avatar), children: typeof avatar === "string" ? /* @__PURE__ */ jsx51("img", { src: avatar, alt: "", className: cn("rounded-full object-cover", sz.avatar) }) : avatar }),
         Left && !avatar && /* @__PURE__ */ jsx51("span", { className: cn("text-muted-foreground shrink-0", sz.icon), children: /* @__PURE__ */ jsx51(Left, { className: cn(sz.icon) }) }),
@@ -16782,7 +16813,7 @@ var List_default = List;
 // src/components/Watermark.tsx
 import * as React45 from "react";
 import { createPortal as createPortal5 } from "react-dom";
-import { Fragment as Fragment20, jsx as jsx52, jsxs as jsxs44 } from "react/jsx-runtime";
+import { Fragment as Fragment19, jsx as jsx52, jsxs as jsxs44 } from "react/jsx-runtime";
 var PRESETS2 = {
   confidential: { text: "CONFIDENTIAL", color: "rgba(220, 38, 38, 0.15)", rotate: -22, fontSize: 16, fontWeight: "bold" },
   draft: { text: "DRAFT", color: "rgba(59, 130, 246, 0.15)", rotate: -22, fontSize: 18, fontWeight: "bold" },
@@ -17061,7 +17092,7 @@ var Watermark = ({
     }
   );
   if (fullPage) {
-    return /* @__PURE__ */ jsxs44(Fragment20, { children: [
+    return /* @__PURE__ */ jsxs44(Fragment19, { children: [
       children,
       typeof window !== "undefined" ? createPortal5(overlay, document.body) : null
     ] });
@@ -18226,7 +18257,7 @@ var MusicPlayer_default = MusicPlayer;
 
 // src/components/Grid.tsx
 import React49, { useId as useId8 } from "react";
-import { Fragment as Fragment21, jsx as jsx56, jsxs as jsxs48 } from "react/jsx-runtime";
+import { Fragment as Fragment20, jsx as jsx56, jsxs as jsxs48 } from "react/jsx-runtime";
 var BP_MIN = {
   sm: 640,
   md: 768,
@@ -18383,7 +18414,7 @@ var GridItem = React49.forwardRef(
       st.opacity = 0;
       st.animation = `uvGridItemFadeIn 0.5s ease-out forwards`;
     }
-    return /* @__PURE__ */ jsxs48(Fragment21, { children: [
+    return /* @__PURE__ */ jsxs48(Fragment20, { children: [
       animationDelay != null && /* @__PURE__ */ jsx56(
         "style",
         {
@@ -18418,7 +18449,7 @@ import { useMemo as useMemo19, useState as useState39, useRef as useRef23, useCa
 // src/components/ChartTooltip.tsx
 import { useEffect as useEffect27, useState as useState38, useRef as useRef22 } from "react";
 import { createPortal as createPortal6 } from "react-dom";
-import { Fragment as Fragment22, jsx as jsx57, jsxs as jsxs49 } from "react/jsx-runtime";
+import { Fragment as Fragment21, jsx as jsx57, jsxs as jsxs49 } from "react/jsx-runtime";
 function ChartTooltip({
   x,
   y,
@@ -18488,7 +18519,7 @@ function ChartTooltip({
                   ":"
                 ] }),
                 /* @__PURE__ */ jsx57("span", { className: "font-semibold ml-auto", children: formatter ? formatter(item.value) : item.value })
-              ] }, i)) }) : /* @__PURE__ */ jsxs49(Fragment22, { children: [
+              ] }, i)) }) : /* @__PURE__ */ jsxs49(Fragment21, { children: [
                 /* @__PURE__ */ jsxs49("div", { className: "flex items-center gap-2", children: [
                   color && /* @__PURE__ */ jsx57("div", { className: "w-2 h-2 rounded-full shrink-0", style: { backgroundColor: color } }),
                   /* @__PURE__ */ jsx57("span", { className: "font-semibold", children: formatter && value != null ? formatter(value) : value })
@@ -18543,7 +18574,7 @@ function getPathLength(points) {
 }
 
 // src/components/LineChart.tsx
-import { Fragment as Fragment23, jsx as jsx58, jsxs as jsxs50 } from "react/jsx-runtime";
+import { Fragment as Fragment22, jsx as jsx58, jsxs as jsxs50 } from "react/jsx-runtime";
 function LineChart({
   data,
   series,
@@ -18623,7 +18654,7 @@ function LineChart({
     }
     return lines;
   }, [minValue, maxValue, chartHeight, padding.top]);
-  return /* @__PURE__ */ jsxs50(Fragment23, { children: [
+  return /* @__PURE__ */ jsxs50(Fragment22, { children: [
     /* @__PURE__ */ jsxs50("svg", { ref: svgRef, width, height, className: `overflow-visible ${className}`, style: { fontFamily: "inherit" }, children: [
       /* @__PURE__ */ jsx58("defs", { children: /* @__PURE__ */ jsx58("clipPath", { id: clipId, children: /* @__PURE__ */ jsx58("rect", { x: padding.left, y: padding.top, width: chartWidth, height: chartHeight }) }) }),
       showGrid && /* @__PURE__ */ jsx58("g", { className: "text-muted-foreground/20", children: gridLines.map((line, i) => /* @__PURE__ */ jsxs50("g", { children: [
@@ -18817,7 +18848,7 @@ function LineChart({
 
 // src/components/BarChart.tsx
 import { useMemo as useMemo20, useState as useState40, useRef as useRef24 } from "react";
-import { Fragment as Fragment24, jsx as jsx59, jsxs as jsxs51 } from "react/jsx-runtime";
+import { Fragment as Fragment23, jsx as jsx59, jsxs as jsxs51 } from "react/jsx-runtime";
 function BarChart({
   data,
   series,
@@ -18959,9 +18990,9 @@ function BarChart({
     }
     return { maxValue: max, barGroups: groups, gridLines: lines };
   }, [normalizedSeries, chartWidth, chartHeight, horizontal, stacked, barGap, padding, width, height]);
-  return /* @__PURE__ */ jsxs51(Fragment24, { children: [
+  return /* @__PURE__ */ jsxs51(Fragment23, { children: [
     /* @__PURE__ */ jsxs51("svg", { ref: svgRef, width, height, className: `overflow-visible ${className}`, style: { fontFamily: "inherit" }, children: [
-      showGrid && /* @__PURE__ */ jsx59("g", { className: "text-muted-foreground/20", children: gridLines.map((line, i) => /* @__PURE__ */ jsx59("g", { children: horizontal ? /* @__PURE__ */ jsxs51(Fragment24, { children: [
+      showGrid && /* @__PURE__ */ jsx59("g", { className: "text-muted-foreground/20", children: gridLines.map((line, i) => /* @__PURE__ */ jsx59("g", { children: horizontal ? /* @__PURE__ */ jsxs51(Fragment23, { children: [
         /* @__PURE__ */ jsx59("line", { x1: line.x, y1: line.y1, x2: line.x, y2: line.y2, stroke: "currentColor", strokeDasharray: "4 4" }),
         /* @__PURE__ */ jsx59(
           "text",
@@ -18975,7 +19006,7 @@ function BarChart({
             children: formatValue ? formatValue(line.value) : line.value.toFixed(0)
           }
         )
-      ] }) : /* @__PURE__ */ jsxs51(Fragment24, { children: [
+      ] }) : /* @__PURE__ */ jsxs51(Fragment23, { children: [
         /* @__PURE__ */ jsx59("line", { x1: line.x1, y1: line.y, x2: line.x2, y2: line.y, stroke: "currentColor", strokeDasharray: "4 4" }),
         /* @__PURE__ */ jsx59(
           "text",
@@ -20062,16 +20093,16 @@ function GaugeChart({
 
 // src/components/ClientOnly.tsx
 import { useEffect as useEffect28, useState as useState44 } from "react";
-import { Fragment as Fragment25, jsx as jsx65 } from "react/jsx-runtime";
+import { Fragment as Fragment24, jsx as jsx65 } from "react/jsx-runtime";
 function ClientOnly({ children, fallback = null }) {
   const [hasMounted, setHasMounted] = useState44(false);
   useEffect28(() => {
     setHasMounted(true);
   }, []);
   if (!hasMounted) {
-    return /* @__PURE__ */ jsx65(Fragment25, { children: fallback });
+    return /* @__PURE__ */ jsx65(Fragment24, { children: fallback });
   }
-  return /* @__PURE__ */ jsx65(Fragment25, { children });
+  return /* @__PURE__ */ jsx65(Fragment24, { children });
 }
 
 // src/components/Loading.tsx
@@ -20316,7 +20347,7 @@ function DataTableBodyRows({
 // src/components/DataTable/components/DataTableHeader.tsx
 import React59 from "react";
 import { Filter as FilterIcon } from "lucide-react";
-import { Fragment as Fragment26, jsx as jsx69, jsxs as jsxs60 } from "react/jsx-runtime";
+import { Fragment as Fragment25, jsx as jsx69, jsxs as jsxs60 } from "react/jsx-runtime";
 function DataTableHeader({
   headerRows,
   headerAlign,
@@ -20497,10 +20528,10 @@ function DataTableHeader({
             isCenterAlign && "justify-center",
             !isRightAlign && !isCenterAlign && "justify-start"
           ),
-          children: isRightAlign ? /* @__PURE__ */ jsxs60(Fragment26, { children: [
+          children: isRightAlign ? /* @__PURE__ */ jsxs60(Fragment25, { children: [
             filterContent,
             titleContent
-          ] }) : /* @__PURE__ */ jsxs60(Fragment26, { children: [
+          ] }) : /* @__PURE__ */ jsxs60(Fragment25, { children: [
             titleContent,
             filterContent
           ] })
@@ -20521,7 +20552,7 @@ function DataTableHeader({
       t
     ]
   );
-  return /* @__PURE__ */ jsx69(Fragment26, { children: headerRows.map((row, rowIndex) => /* @__PURE__ */ jsx69(TableRow, { children: row.map((headerCell, cellIndex) => {
+  return /* @__PURE__ */ jsx69(Fragment25, { children: headerRows.map((row, rowIndex) => /* @__PURE__ */ jsx69(TableRow, { children: row.map((headerCell, cellIndex) => {
     const { column: col, colSpan, rowSpan, isLeaf } = headerCell;
     const prevCell = cellIndex > 0 ? row[cellIndex - 1] : null;
     const prevCol = prevCell?.column;
@@ -21641,7 +21672,7 @@ function AccessDenied({
 import { Moon as Moon2, Sun as Sun2, Monitor } from "lucide-react";
 import { useEffect as useEffect30, useRef as useRef28, useState as useState45 } from "react";
 import { createPortal as createPortal7 } from "react-dom";
-import { Fragment as Fragment27, jsx as jsx76, jsxs as jsxs67 } from "react/jsx-runtime";
+import { Fragment as Fragment26, jsx as jsx76, jsxs as jsxs67 } from "react/jsx-runtime";
 function ThemeToggleHeadless({
   theme,
   onChange,
@@ -21692,7 +21723,7 @@ function ThemeToggleHeadless({
         children: /* @__PURE__ */ jsx76(CurrentIcon, { className: "h-5 w-5" })
       }
     ),
-    isOpen && /* @__PURE__ */ jsxs67(Fragment27, { children: [
+    isOpen && /* @__PURE__ */ jsxs67(Fragment26, { children: [
       typeof window !== "undefined" && createPortal7(/* @__PURE__ */ jsx76("div", { className: "fixed inset-0 z-9998", onClick: () => setIsOpen(false) }), document.body),
       typeof window !== "undefined" && dropdownPosition && createPortal7(
         /* @__PURE__ */ jsx76(
@@ -21744,7 +21775,7 @@ function ThemeToggleHeadless({
 import { useRef as useRef29, useState as useState46 } from "react";
 import { createPortal as createPortal8 } from "react-dom";
 import { Globe } from "lucide-react";
-import { Fragment as Fragment28, jsx as jsx77, jsxs as jsxs68 } from "react/jsx-runtime";
+import { Fragment as Fragment27, jsx as jsx77, jsxs as jsxs68 } from "react/jsx-runtime";
 function LanguageSwitcherHeadless({
   locales,
   currentLocale,
@@ -21789,7 +21820,7 @@ function LanguageSwitcherHeadless({
         children: /* @__PURE__ */ jsx77(Globe, { className: "h-5 w-5" })
       }
     ),
-    isOpen && /* @__PURE__ */ jsxs68(Fragment28, { children: [
+    isOpen && /* @__PURE__ */ jsxs68(Fragment27, { children: [
       typeof window !== "undefined" && createPortal8(/* @__PURE__ */ jsx77("div", { className: "fixed inset-0 z-9998", onClick: () => setIsOpen(false) }), document.body),
       typeof window !== "undefined" && dropdownPosition && createPortal8(
         /* @__PURE__ */ jsx77(
@@ -24290,7 +24321,7 @@ var EmojiPicker = ({ onSelect, onClose }) => {
 };
 
 // src/components/UEditor/toolbar.tsx
-import { Fragment as Fragment29, jsx as jsx85, jsxs as jsxs75 } from "react/jsx-runtime";
+import { Fragment as Fragment28, jsx as jsx85, jsxs as jsxs75 } from "react/jsx-runtime";
 function fileToDataUrl2(file) {
   return new Promise((resolve, reject) => {
     const reader = new FileReader();
@@ -24647,7 +24678,7 @@ var EditorToolbar = ({
             },
             onCancel: () => setShowImageInput(false)
           }
-        ) : /* @__PURE__ */ jsxs75(Fragment29, { children: [
+        ) : /* @__PURE__ */ jsxs75(Fragment28, { children: [
           /* @__PURE__ */ jsx85(DropdownMenuItem, { icon: LinkIcon, label: t("imageInput.addFromUrl"), onClick: () => setShowImageInput(true) }),
           /* @__PURE__ */ jsx85(
             DropdownMenuItem,