@underverse-ui/underverse 2.0.6 → 2.0.8

package/dist/index.js

@@ -4,7 +4,7 @@ import {
   extractImageSrcsFromHtml,
   normalizeImageUrl,
   prepareUEditorContentForSave
-} from "./chunk-2UQ7H5GR.js";
+} from "./chunk-XE3RJHVX.js";
 import {
   EmojiPicker_default
 } from "./chunk-A7XL4RDV.js";
@@ -16,7 +16,7 @@ import {
 import "./chunk-4TYW5K4J.js";
 import {
   Modal_default
-} from "./chunk-OZH3EDGZ.js";
+} from "./chunk-JINSMREP.js";
 import {
   DropdownMenuItem,
   DropdownMenuSeparator,
@@ -25,6 +25,7 @@ import {
   SelectDropdown,
   UnderverseConfigProvider,
   formControlFixedClass,
+  formControlLabelClass,
   formControlSizeStyles,
   formControlValueClass,
   getAnimationStyles,
@@ -34,7 +35,7 @@ import {
   shadcnAnimationStyles,
   useShadCNAnimations,
   useUnderverseUIConfig
-} from "./chunk-JXE7JBQV.js";
+} from "./chunk-TETMVVUP.js";
 import {
   ForceInternalTranslationsProvider,
   NextIntlAdapter,
@@ -591,7 +592,7 @@ var Checkbox = React3.forwardRef(
           children: isChecked && /* @__PURE__ */ jsx4(Check, { className: "w-4 h-4" })
         }
       ),
-      label && /* @__PURE__ */ jsx4("span", { className: cn("text-sm text-foreground", labelClassName), children: label })
+      label && /* @__PURE__ */ jsx4("span", { className: cn("text-sm text-foreground", formControlLabelClass, labelClassName), children: label })
     ] });
   }
 );
@@ -853,7 +854,7 @@ function useOverlayScrollbarTarget(targetRef, options = {}) {
 var OverlayScrollbarProvider_default = OverlayScrollbarProvider;
 
 // src/components/Input.tsx
-import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
 var Input = forwardRef3(
   ({
     label,
@@ -876,6 +877,7 @@ var Input = forwardRef3(
     value,
     maxLength,
     rightAddon,
+    rightSection,
     borderMode,
     ...rest
   }, ref) => {
@@ -975,7 +977,8 @@ var Input = forwardRef3(
             className: cn(
               // Label size follows input size
               sizeStyles7[size].label,
-              "font-medium transition-colors duration-200",
+              formControlLabelClass,
+              "transition-colors duration-200",
               // default color and highlight while any descendant focused
               disabled ? "text-muted-foreground" : cn("text-foreground group-focus-within:text-primary", success && "text-primary"),
               errMsg && "text-destructive",
@@ -1046,7 +1049,7 @@ var Input = forwardRef3(
               radiusClass,
               // Icon padding adjustments
               LeftIcon && "pl-10",
-              (RightIcon || showPasswordToggle || clearable || loading2 || success || errMsg) && "pr-10",
+              (RightIcon || showPasswordToggle || clearable || loading2 || success || errMsg || rightSection) && "pr-10",
               // Variant styles
               variantStyles5[variant].container,
               errMsg ? variantStyles5[variant].error : variantStyles5[variant].focus,
@@ -1059,45 +1062,57 @@ var Input = forwardRef3(
             ...restInput
           }
         ),
-        /* @__PURE__ */ jsxs5("div", { className: "absolute right-3 top-1/2 -translate-y-1/2 flex items-center gap-1", children: [
-          getStatusIcon(),
-          RightIcon && !loading2 && !success && !errMsg && /* @__PURE__ */ jsx6(RightIcon, { className: cn("text-muted-foreground", sizeStyles7[size].icon) }),
-          clearable && hasValue && !loading2 && /* @__PURE__ */ jsx6(
-            "button",
-            {
-              type: "button",
-              onClick: () => {
-                if (onClear) return onClear();
-                rest.onChange?.({ target: { value: "" } });
-              },
-              className: cn(
-                "flex items-center justify-center text-muted-foreground hover:text-foreground transition-colors rounded-md",
-                "focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1",
-                "active:bg-accent active:text-accent-foreground",
-                sizeStyles7[size].iconButton
-              ),
-              tabIndex: 0,
-              "aria-label": gi18n.clearInput ?? "Clear input",
-              children: /* @__PURE__ */ jsx6(X, { className: sizeStyles7[size].icon })
-            }
-          ),
-          showPasswordToggle && /* @__PURE__ */ jsx6(
-            "button",
-            {
-              type: "button",
-              onClick: () => setShowPassword(!showPassword),
-              className: cn(
-                "flex items-center justify-center text-muted-foreground hover:text-foreground transition-colors rounded-full",
-                "focus:outline-none focus-visible:ring-1 focus-visible:ring-ring/40",
-                "active:bg-accent/50 active:text-accent-foreground",
-                sizeStyles7[size].iconButton
-              ),
-              tabIndex: 0,
-              "aria-label": showPassword ? gi18n.hidePassword ?? "Hide password" : gi18n.showPassword ?? "Show password",
-              children: showPassword ? /* @__PURE__ */ jsx6(EyeOff, { className: sizeStyles7[size].icon }) : /* @__PURE__ */ jsx6(Eye, { className: sizeStyles7[size].icon })
-            }
-          )
-        ] }),
+        /* @__PURE__ */ jsxs5(
+          "div",
+          {
+            className: cn(
+              "absolute z-10 flex items-center gap-1",
+              rightSection ? "inset-y-0 right-0" : "right-3 top-1/2 -translate-y-1/2"
+            ),
+            children: [
+              /* @__PURE__ */ jsxs5("div", { className: cn("flex items-center gap-1", rightSection && "px-1"), children: [
+                getStatusIcon(),
+                RightIcon && !loading2 && !success && !errMsg && /* @__PURE__ */ jsx6(RightIcon, { className: cn("text-muted-foreground", sizeStyles7[size].icon) }),
+                clearable && hasValue && !loading2 && /* @__PURE__ */ jsx6(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => {
+                      if (onClear) return onClear();
+                      rest.onChange?.({ target: { value: "" } });
+                    },
+                    className: cn(
+                      "flex items-center justify-center text-muted-foreground hover:text-foreground transition-colors rounded-md",
+                      "focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1",
+                      "active:bg-accent active:text-accent-foreground",
+                      sizeStyles7[size].iconButton
+                    ),
+                    tabIndex: 0,
+                    "aria-label": gi18n.clearInput ?? "Clear input",
+                    children: /* @__PURE__ */ jsx6(X, { className: sizeStyles7[size].icon })
+                  }
+                ),
+                showPasswordToggle && /* @__PURE__ */ jsx6(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => setShowPassword(!showPassword),
+                    className: cn(
+                      "flex items-center justify-center text-muted-foreground hover:text-foreground transition-colors rounded-full",
+                      "focus:outline-none focus-visible:ring-1 focus-visible:ring-ring/40",
+                      "active:bg-accent/50 active:text-accent-foreground",
+                      sizeStyles7[size].iconButton
+                    ),
+                    tabIndex: 0,
+                    "aria-label": showPassword ? gi18n.hidePassword ?? "Hide password" : gi18n.showPassword ?? "Show password",
+                    children: showPassword ? /* @__PURE__ */ jsx6(EyeOff, { className: sizeStyles7[size].icon }) : /* @__PURE__ */ jsx6(Eye, { className: sizeStyles7[size].icon })
+                  }
+                )
+              ] }),
+              rightSection
+            ]
+          }
+        ),
         rightAddon,
         variant === "minimal" && /* @__PURE__ */ jsx6(
           "div",
@@ -1132,27 +1147,128 @@ var Input = forwardRef3(
   }
 );
 Input.displayName = "Input";
+var searchButtonWidthStyles = {
+  xs: "w-6",
+  sm: "w-8",
+  md: "w-10",
+  lg: "w-12",
+  xl: "w-14"
+};
+var searchButtonPaddingStyles = {
+  xs: "pr-14",
+  sm: "pr-18",
+  md: "pr-20",
+  lg: "pr-24",
+  xl: "pr-28"
+};
+var searchButtonRadiusStyles = {
+  none: "rounded-r-none",
+  sm: "rounded-r-sm",
+  md: "rounded-r-md",
+  lg: "rounded-r-lg",
+  xl: "rounded-r-xl",
+  "2xl": "rounded-r-2xl",
+  "3xl": "rounded-r-3xl",
+  full: "rounded-r-full",
+  daewoo: "rounded-r",
+  infiniq: "rounded-r-full"
+};
 var SearchInput = forwardRef3(
-  ({ onSearch, searchDelay = 300, placeholder = "Search\u2026", ...props }, ref) => {
-    const [searchValue, setSearchValue] = useState3(props.value || "");
+  ({
+    mode = "default",
+    onSearch,
+    searchDelay = 300,
+    searchButtonLabel = "Search",
+    placeholder = "Search\u2026",
+    value,
+    defaultValue,
+    onChange,
+    onClear,
+    onKeyDown,
+    clearable = true,
+    size = "md",
+    className,
+    disabled,
+    loading: loading2 = false,
+    rightSection,
+    borderMode,
+    ...props
+  }, ref) => {
+    const [uncontrolledValue, setUncontrolledValue] = useState3(defaultValue ?? "");
+    const isControlled = value !== void 0;
+    const searchValue = isControlled ? value : uncontrolledValue;
+    const searchText = String(searchValue ?? "");
+    const globalConfig = useUnderverseUIConfig();
+    const resolvedBorderMode = borderMode ?? globalConfig.input?.borderMode ?? globalConfig.borderMode ?? "full";
+    const searchButtonRadiusClass = searchButtonRadiusStyles[resolvedBorderMode] ?? getBorderRadiusClass(resolvedBorderMode);
+    const triggerSearch = useCallback2(() => {
+      onSearch?.(searchText);
+    }, [onSearch, searchText]);
     React5.useEffect(() => {
-      if (!onSearch) return;
+      if (!onSearch || mode !== "default") return;
       const timer = setTimeout(() => {
-        onSearch(searchValue);
+        onSearch(searchText);
       }, searchDelay);
       return () => clearTimeout(timer);
-    }, [searchValue, onSearch, searchDelay]);
+    }, [mode, onSearch, searchDelay, searchText]);
+    const searchButton = mode === "button" ? /* @__PURE__ */ jsx6(
+      "button",
+      {
+        type: "button",
+        onClick: triggerSearch,
+        disabled: disabled || loading2,
+        className: cn(
+          "flex h-full shrink-0 cursor-pointer items-center justify-center border-l border-border bg-transparent text-foreground",
+          "transition-colors hover:bg-accent hover:text-accent-foreground",
+          "focus:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring",
+          "disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:bg-transparent",
+          searchButtonWidthStyles[size],
+          searchButtonRadiusClass
+        ),
+        "aria-label": searchButtonLabel,
+        children: /* @__PURE__ */ jsx6(Search, { className: formControlSizeStyles[size].icon, "aria-hidden": "true" })
+      }
+    ) : null;
     return /* @__PURE__ */ jsx6(
       Input,
       {
         ref,
         type: "search",
-        leftIcon: Search,
+        leftIcon: mode === "default" ? Search : void 0,
         placeholder,
-        clearable: true,
+        clearable,
         value: searchValue,
-        onChange: (e) => setSearchValue(e.target.value),
-        onClear: () => setSearchValue(""),
+        onChange: (event) => {
+          if (!isControlled) setUncontrolledValue(event.target.value);
+          onChange?.(event);
+        },
+        onClear: () => {
+          if (!isControlled) {
+            setUncontrolledValue("");
+          } else if (!onClear && onChange) {
+            onChange({ target: { value: "" }, currentTarget: { value: "" } });
+          }
+          onClear?.();
+        },
+        onKeyDown: (event) => {
+          onKeyDown?.(event);
+          if (mode === "button" && event.key === "Enter" && !event.defaultPrevented && !event.nativeEvent.isComposing) {
+            triggerSearch();
+          }
+        },
+        size,
+        className: cn(
+          "[&::-webkit-search-cancel-button]:appearance-none [&::-webkit-search-decoration]:appearance-none",
+          mode === "button" && searchButtonPaddingStyles[size],
+          className
+        ),
+        disabled,
+        loading: loading2,
+        rightSection: mode === "button" ? /* @__PURE__ */ jsxs5(Fragment2, { children: [
+          rightSection,
+          searchButton
+        ] }) : rightSection,
+        borderMode,
         ...props
       }
     );
@@ -1393,7 +1509,8 @@ var Textarea = forwardRef3(
           "label",
           {
             className: cn(
-              "text-sm font-medium transition-colors duration-200",
+              "text-sm transition-colors duration-200",
+              formControlLabelClass,
               isFocused ? "text-primary" : "text-foreground",
               error && "text-destructive",
               labelClassName
@@ -2344,7 +2461,8 @@ var TagInput = forwardRef4(
         {
           htmlFor: inputId,
           className: cn(
-            "block font-medium transition-colors duration-200",
+            "block transition-colors duration-200",
+            formControlLabelClass,
             formControlSizeStyles[size].label,
             disabled ? "text-muted-foreground" : isFocused ? "text-primary" : "text-foreground",
             labelClassName
@@ -2618,7 +2736,7 @@ var Switch = ({
         ]
       }
     ),
-    label && /* @__PURE__ */ jsx10("span", { className: cn("text-sm font-medium text-foreground transition-colors", disabled && "text-muted-foreground", labelClassName), children: label })
+    label && /* @__PURE__ */ jsx10("span", { className: cn("text-sm text-foreground transition-colors", formControlLabelClass, disabled && "text-muted-foreground", labelClassName), children: label })
   ] });
 };
 Switch.displayName = "Switch";
@@ -2629,7 +2747,7 @@ import * as React10 from "react";
 import { cva } from "class-variance-authority";
 import { jsx as jsx11 } from "react/jsx-runtime";
 var labelVariants = cva(
-  "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+  `text-sm ${formControlLabelClass} leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70`
 );
 var Label = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
   "label",
@@ -2992,7 +3110,7 @@ var Skeleton_default = Skeleton;
 // src/components/Progress.tsx
 import React13 from "react";
 import { Check as Check2, X as X4, Clock } from "lucide-react";
-import { Fragment as Fragment2, jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
 var variantStyles2 = {
   default: "bg-muted-foreground",
   primary: "bg-linear-to-r from-primary via-primary/90 to-primary",
@@ -3153,7 +3271,7 @@ var CircularProgress = ({
             ]
           }
         ),
-        /* @__PURE__ */ jsx15("div", { className: "absolute inset-0 flex flex-col items-center justify-center text-center", children: children ? children : /* @__PURE__ */ jsxs11(Fragment2, { children: [
+        /* @__PURE__ */ jsx15("div", { className: "absolute inset-0 flex flex-col items-center justify-center text-center", children: children ? children : /* @__PURE__ */ jsxs11(Fragment3, { children: [
           getContentIcon(),
           showValue && !indeterminate && /* @__PURE__ */ jsx15("span", { className: cn("text-sm font-semibold", isComplete ? "text-success" : isError ? "text-destructive" : "text-foreground"), children: isComplete ? "\u2713" : isError ? "\u2717" : `${Math.round(percentage)}%` }),
           indeterminate && /* @__PURE__ */ jsx15(Clock, { className: "w-4 h-4 text-muted-foreground animate-pulse" })
@@ -4469,7 +4587,7 @@ import * as React19 from "react";
 import { useId as useId4 } from "react";
 import { useVirtualizer } from "@tanstack/react-virtual";
 import { ChevronDown, Search as Search4, SearchX, Check as Check3, X as X8 } from "lucide-react";
-import { Fragment as Fragment3, jsx as jsx22, jsxs as jsxs18 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx22, jsxs as jsxs18 } from "react/jsx-runtime";
 var getOptionLabel = (option) => {
   return typeof option === "string" ? option : option.label;
 };
@@ -4962,7 +5080,7 @@ var Combobox = ({
       className
     )
   };
-  const triggerContents = /* @__PURE__ */ jsxs18(Fragment3, { children: [
+  const triggerContents = /* @__PURE__ */ jsxs18(Fragment4, { children: [
     selectedIcon && /* @__PURE__ */ jsx22("span", { className: cn("mr-2 flex shrink-0 items-center justify-center overflow-hidden text-primary", formControlSizeStyles[size].icon), children: selectedIcon }),
     /* @__PURE__ */ jsx22("span", { className: cn(formControlValueClass, "text-left", !displayValue && "text-muted-foreground", fontBold && "font-semibold"), children: renderValue && selectedOption ? renderValue(selectedOption) : displayValue || placeholder }),
     /* @__PURE__ */ jsxs18("div", { className: "flex items-center gap-1.5 ml-2 shrink-0", children: [
@@ -5021,7 +5139,8 @@ var Combobox = ({
         onClick: () => triggerRef.current?.focus(),
         className: cn(
           labelSize,
-          "font-medium transition-colors duration-200",
+          formControlLabelClass,
+          "transition-colors duration-200",
           disabled ? "text-muted-foreground" : "text-foreground group-focus-within:text-primary",
           effectiveError && "text-destructive",
           labelClassName
@@ -5809,7 +5928,7 @@ function parseDateString(str, locale = "en") {
 import { Calendar, ChevronLeft as ChevronLeft2, ChevronRight as ChevronRight3, Sparkles, X as XIcon } from "lucide-react";
 import * as React23 from "react";
 import { useId as useId5 } from "react";
-import { Fragment as Fragment4, jsx as jsx27, jsxs as jsxs20 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx27, jsxs as jsxs20 } from "react/jsx-runtime";
 function normalizeToLocalDate(date) {
   if (!date) return null;
   return new Date(date.getFullYear(), date.getMonth(), date.getDate());
@@ -6200,7 +6319,7 @@ var DatePicker = ({
         }
       )
     ] }),
-    viewMode === "calendar" && /* @__PURE__ */ jsxs20(Fragment4, { children: [
+    viewMode === "calendar" && /* @__PURE__ */ jsxs20(Fragment5, { children: [
       /* @__PURE__ */ jsx27("div", { className: cn("grid grid-cols-7 gap-1 mb-2 px-0.5"), children: (weekdayLabels || (locale === "vi" ? ["CN", "T2", "T3", "T4", "T5", "T6", "T7"] : ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"])).map(
         (day, idx) => /* @__PURE__ */ jsx27(
           "div",
@@ -6289,7 +6408,8 @@ var DatePicker = ({
         onClick: () => inputRef.current?.focus(),
         className: cn(
           labelSize,
-          "font-semibold transition-colors duration-300 cursor-pointer",
+          formControlLabelClass,
+          "transition-colors duration-300 cursor-pointer",
           disabled ? "text-muted-foreground" : "text-foreground group-focus-within:text-primary hover:text-primary",
           effectiveError && "text-destructive",
           labelClassName
@@ -6970,7 +7090,7 @@ var DateRangePicker = ({
         }
       )
     ] }),
-    viewMode === "calendar" && /* @__PURE__ */ jsxs20(Fragment4, { children: [
+    viewMode === "calendar" && /* @__PURE__ */ jsxs20(Fragment5, { children: [
       /* @__PURE__ */ jsx27("div", { className: cn("grid grid-cols-7 gap-1 px-0.5", size === "sm" ? "mb-1" : size === "lg" ? "mb-3" : "mb-2"), children: (locale === "vi" ? ["CN", "T2", "T3", "T4", "T5", "T6", "T7"] : ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"]).map((d, idx) => /* @__PURE__ */ jsx27(
         "div",
         {
@@ -7048,7 +7168,8 @@ var DateRangePicker = ({
         onClick: () => inputRef.current?.focus(),
         className: cn(
           size === "sm" ? "text-xs" : size === "lg" ? "text-base" : "text-sm",
-          "font-medium transition-colors duration-300",
+          formControlLabelClass,
+          "transition-colors duration-300",
           disabled ? "text-muted-foreground cursor-not-allowed" : "text-foreground group-focus-within:text-primary hover:text-primary cursor-pointer",
           effectiveError && "text-destructive",
           labelClassName
@@ -7393,7 +7514,7 @@ function getLeapMonthOffset(a11, timeZone) {
 }
 
 // src/components/LunarDatePicker.tsx
-import { Fragment as Fragment5, jsx as jsx28, jsxs as jsxs21 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx28, jsxs as jsxs21 } from "react/jsx-runtime";
 function toSolarDate(value) {
   if (!value) return null;
   const solar = lunarToSolar({
@@ -7897,7 +8018,7 @@ var LunarDatePicker = ({
         }
       )
     ] }),
-    viewMode === "calendar" && /* @__PURE__ */ jsxs21(Fragment5, { children: [
+    viewMode === "calendar" && /* @__PURE__ */ jsxs21(Fragment6, { children: [
       /* @__PURE__ */ jsx28("div", { className: cn("grid grid-cols-7 gap-1 mb-2 px-0.5"), children: (weekdayLabels || (locale === "vi" ? ["CN", "T2", "T3", "T4", "T5", "T6", "T7"] : ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"])).map(
         (day, idx) => /* @__PURE__ */ jsx28(
           "div",
@@ -7986,7 +8107,8 @@ var LunarDatePicker = ({
         onClick: () => inputRef.current?.focus(),
         className: cn(
           labelSize,
-          "font-semibold transition-colors duration-300 cursor-pointer",
+          formControlLabelClass,
+          "transition-colors duration-300 cursor-pointer",
           disabled ? "text-muted-foreground" : "text-foreground group-focus-within:text-primary hover:text-primary",
           effectiveError && "text-destructive",
           labelClassName
@@ -8536,7 +8658,7 @@ var LunarDateRangePicker = ({
         }
       )
     ] }),
-    viewMode === "calendar" && /* @__PURE__ */ jsxs21(Fragment5, { children: [
+    viewMode === "calendar" && /* @__PURE__ */ jsxs21(Fragment6, { children: [
       /* @__PURE__ */ jsx28("div", { className: cn("grid grid-cols-7 gap-1 px-0.5", size === "sm" ? "mb-1" : size === "lg" ? "mb-3" : "mb-2"), children: (locale === "vi" ? ["CN", "T2", "T3", "T4", "T5", "T6", "T7"] : ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"]).map((d, idx) => /* @__PURE__ */ jsx28(
         "div",
         {
@@ -8615,7 +8737,8 @@ var LunarDateRangePicker = ({
         onClick: () => setIsOpen(true),
         className: cn(
           size === "sm" ? "text-xs" : size === "lg" ? "text-base" : "text-sm",
-          "font-medium transition-colors duration-300",
+          formControlLabelClass,
+          "transition-colors duration-300",
           disabled ? "text-muted-foreground cursor-not-allowed" : "text-foreground group-focus-within:text-primary hover:text-primary cursor-pointer",
           effectiveError && "text-destructive",
           labelClassName
@@ -9523,7 +9646,7 @@ function MonthYearPicker({
   ] });
   if (variant === "inline") {
     return /* @__PURE__ */ jsxs22("div", { className: cn("w-full", className), ...rest, children: [
-      label && /* @__PURE__ */ jsxs22("label", { className: cn(sz.label, "block mb-1.5 font-medium text-foreground/80", effectiveError && "text-destructive", labelClassName), children: [
+      label && /* @__PURE__ */ jsxs22("label", { className: cn(sz.label, "block mb-1.5 text-foreground/80", formControlLabelClass, effectiveError && "text-destructive", labelClassName), children: [
         label,
         required && /* @__PURE__ */ jsx29("span", { className: "text-destructive ml-0.5", children: "*" })
       ] }),
@@ -9560,7 +9683,7 @@ function MonthYearPicker({
     ] });
   }
   return /* @__PURE__ */ jsxs22("div", { className: cn("w-full", className), ...rest, children: [
-    label && /* @__PURE__ */ jsxs22("label", { className: cn(sz.label, "block mb-1.5 font-medium text-foreground/80", effectiveError && "text-destructive", labelClassName), children: [
+    label && /* @__PURE__ */ jsxs22("label", { className: cn(sz.label, "block mb-1.5 text-foreground/80", formControlLabelClass, effectiveError && "text-destructive", labelClassName), children: [
       label,
       required && /* @__PURE__ */ jsx29("span", { className: "text-destructive ml-0.5", children: "*" })
     ] }),
@@ -9602,7 +9725,7 @@ function MonthYearPicker({
 }
 
 // src/components/Calendar.tsx
-import { Fragment as Fragment7, jsx as jsx30, jsxs as jsxs23 } from "react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx30, jsxs as jsxs23 } from "react/jsx-runtime";
 var VIETNAM_HOLIDAYS = [
   { date: "01-01", name: "T\u1EBFt D\u01B0\u01A1ng l\u1ECBch", recurring: true },
   { date: "04-30", name: "Gi\u1EA3i ph\xF3ng mi\u1EC1n Nam", recurring: true },
@@ -10097,7 +10220,7 @@ function Calendar4({
         }
       )
     ] }),
-    display === "week" ? /* @__PURE__ */ jsxs23(Fragment7, { children: [
+    display === "week" ? /* @__PURE__ */ jsxs23(Fragment8, { children: [
       showWeekdays && /* @__PURE__ */ jsx30("div", { className: cn("grid grid-cols-7", sz.grid, "mb-1 text-center text-muted-foreground font-medium"), children: weekdays.map((w) => /* @__PURE__ */ jsx30("div", { className: cn(sz.head), children: w }, `w-${w}`)) }),
       /* @__PURE__ */ jsx30("div", { className: cn("grid grid-cols-7", sz.grid), children: weekDays.map((d, idx) => {
         const inMonth = true;
@@ -10253,7 +10376,7 @@ function Calendar4({
 // src/components/TimePicker.tsx
 import * as React27 from "react";
 import { Clock as Clock2, X as X10, Check as Check5, Sun, Moon, Sunset, Coffee } from "lucide-react";
-import { Fragment as Fragment8, jsx as jsx31, jsxs as jsxs24 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx31, jsxs as jsxs24 } from "react/jsx-runtime";
 var pad = (n) => n.toString().padStart(2, "0");
 var clamp2 = (n, min, max) => Math.min(max, Math.max(min, n));
 var WHEEL_ITEM_HEIGHT2 = {
@@ -11290,7 +11413,7 @@ function TimePicker({
           }
         );
       })(),
-      includeSeconds && /* @__PURE__ */ jsxs24(Fragment8, { children: [
+      includeSeconds && /* @__PURE__ */ jsxs24(Fragment9, { children: [
         /* @__PURE__ */ jsx31("div", { className: cn("flex flex-col items-center justify-center", panelSz.separatorPad, compactPanel && "pt-6"), children: /* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-2", children: [
           /* @__PURE__ */ jsx31("div", { className: "w-1.5 h-1.5 rounded-full bg-primary/60" }),
           /* @__PURE__ */ jsx31("div", { className: "w-1.5 h-1.5 rounded-full bg-primary/60" })
@@ -11435,7 +11558,7 @@ function TimePicker({
         "label",
         {
           id: labelId,
-          className: cn(sz.label, "font-semibold", disabled ? "text-muted-foreground" : "text-foreground", effectiveError && "text-destructive"),
+          className: cn(sz.label, formControlLabelClass, disabled ? "text-muted-foreground" : "text-foreground", effectiveError && "text-destructive"),
           children: [
             label,
             required && /* @__PURE__ */ jsx31("span", { className: "text-destructive ml-1", children: "*" })
@@ -11483,7 +11606,7 @@ function TimePicker({
         htmlFor: triggerId,
         className: cn(
           sz.label,
-          "font-semibold",
+          formControlLabelClass,
           disabled ? "text-muted-foreground" : "text-foreground",
           effectiveError && "text-destructive",
           "cursor-pointer transition-colors hover:text-primary"
@@ -11724,7 +11847,13 @@ var DateTimePicker = ({
       {
         id: labelId,
         htmlFor: triggerId,
-        className: cn(sizeStyles7[size].label, "font-medium text-foreground flex items-center gap-1", effectiveError && "text-destructive", labelClassName),
+        className: cn(
+          sizeStyles7[size].label,
+          formControlLabelClass,
+          "text-foreground flex items-center gap-1",
+          effectiveError && "text-destructive",
+          labelClassName
+        ),
         children: [
           label,
           " ",
@@ -13271,7 +13400,7 @@ function useVisibleSlotRange(args) {
 }
 
 // src/components/CalendarTimeline/CalendarTimeline.tsx
-import { Fragment as Fragment10, jsx as jsx38, jsxs as jsxs31 } from "react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx38, jsxs as jsxs31 } from "react/jsx-runtime";
 function CalendarTimeline({
   resources,
   events,
@@ -14597,7 +14726,7 @@ function CalendarTimeline({
                                     ]
                                   }
                                 ),
-                                !isViewOnly && (interactions?.resizableEvents ?? true) && ev.resizable !== false ? /* @__PURE__ */ jsxs31(Fragment10, { children: [
+                                !isViewOnly && (interactions?.resizableEvents ?? true) && ev.resizable !== false ? /* @__PURE__ */ jsxs31(Fragment11, { children: [
                                   /* @__PURE__ */ jsx38(
                                     "div",
                                     {
@@ -14777,7 +14906,7 @@ import * as React35 from "react";
 import { useId as useId10 } from "react";
 import { useVirtualizer as useVirtualizer2 } from "@tanstack/react-virtual";
 import { ChevronDown as ChevronDown4, Search as Search5, Check as Check6, SearchX as SearchX2, Loader2 as Loader23, X as X12, Sparkles as Sparkles3 } from "lucide-react";
-import { Fragment as Fragment11, jsx as jsx39, jsxs as jsxs32 } from "react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx39, jsxs as jsxs32 } from "react/jsx-runtime";
 var comboboxScrollClassName2 = [
   "scrollbar-thin",
   "[scrollbar-width:thin]",
@@ -15256,7 +15385,7 @@ var MultiCombobox = ({
         !!effectiveError && "border-destructive focus-visible:ring-destructive/30"
       ),
       children: [
-        /* @__PURE__ */ jsx39("div", { className: "flex min-h-0 min-w-0 flex-1 items-center gap-1.5 overflow-hidden", children: value.length > 0 ? showTags ? /* @__PURE__ */ jsxs32(Fragment11, { children: [
+        /* @__PURE__ */ jsx39("div", { className: "flex min-h-0 min-w-0 flex-1 items-center gap-1.5 overflow-hidden", children: value.length > 0 ? showTags ? /* @__PURE__ */ jsxs32(Fragment12, { children: [
           visibleTags.map((option) => {
             if (renderTag) {
               return /* @__PURE__ */ jsx39("span", { className: "inline-flex max-h-full min-w-0 shrink overflow-hidden", children: renderTag(option, () => handleRemove(option.value)) }, option.value);
@@ -15338,7 +15467,8 @@ var MultiCombobox = ({
       {
         className: cn(
           size === "sm" ? "text-xs" : size === "lg" ? "text-base" : "text-sm",
-          "font-medium transition-colors duration-200",
+          formControlLabelClass,
+          "transition-colors duration-200",
           disabled ? "text-muted-foreground" : "text-foreground group-focus-within:text-primary",
           effectiveError && "text-destructive",
           labelClassName
@@ -15356,7 +15486,8 @@ var MultiCombobox = ({
         onClick: () => triggerRef.current?.focus(),
         className: cn(
           labelSize,
-          "font-medium transition-colors duration-200",
+          formControlLabelClass,
+          "transition-colors duration-200",
           disabled ? "text-muted-foreground" : "text-foreground group-focus-within:text-primary",
           effectiveError && "text-destructive",
           labelClassName
@@ -15574,7 +15705,7 @@ var RadioGroupItem = React36.forwardRef(
               /* @__PURE__ */ jsxs33("div", { className: "flex-1 min-w-0", children: [
                 /* @__PURE__ */ jsxs33("div", { className: "flex items-center gap-2", children: [
                   Icon && /* @__PURE__ */ jsx40(Icon, { className: "h-4 w-4 text-foreground" }),
-                  /* @__PURE__ */ jsx40("label", { htmlFor: radioId, className: cn("font-medium text-foreground cursor-pointer", sizeStyles6[size].text, labelClassName), children: label || children })
+                  /* @__PURE__ */ jsx40("label", { htmlFor: radioId, className: cn(formControlLabelClass, "text-foreground cursor-pointer", sizeStyles6[size].text, labelClassName), children: label || children })
                 ] }),
                 description && /* @__PURE__ */ jsx40("p", { className: "text-muted-foreground mt-1 text-xs", children: description })
               ] })
@@ -15609,7 +15740,8 @@ var RadioGroupItem = React36.forwardRef(
           id: radioId,
           disabled: isDisabled,
           className: cn(
-            "inline-flex items-center justify-center gap-2 border font-medium transition-all duration-200",
+            "inline-flex items-center justify-center gap-2 border transition-all duration-200",
+            formControlLabelClass,
             getBorderRadiusClass(borderMode ?? "lg"),
             "focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
             "disabled:cursor-not-allowed disabled:opacity-50",
@@ -15667,7 +15799,8 @@ var RadioGroupItem = React36.forwardRef(
         {
           htmlFor: radioId,
           className: cn(
-            "font-medium text-foreground cursor-pointer flex-1",
+            formControlLabelClass,
+            "text-foreground cursor-pointer flex-1",
             "disabled:cursor-not-allowed disabled:opacity-50",
             sizeStyles6[size].text,
             isDisabled && "cursor-not-allowed opacity-50",
@@ -15854,7 +15987,7 @@ var ToggleGroup = (props) => {
 
 // src/components/Slider.tsx
 import * as React37 from "react";
-import { Fragment as Fragment12, jsx as jsx41, jsxs as jsxs34 } from "react/jsx-runtime";
+import { Fragment as Fragment13, jsx as jsx41, jsxs as jsxs34 } from "react/jsx-runtime";
 var SIZE_STYLES = {
   sm: {
     track: "h-1",
@@ -16072,7 +16205,7 @@ var Slider = React37.forwardRef(
     }
     return /* @__PURE__ */ jsxs34("div", { className: cn("w-full space-y-2", containerClassName), children: [
       (label || showValue) && /* @__PURE__ */ jsxs34("div", { className: "flex items-center justify-between", children: [
-        label && /* @__PURE__ */ jsx41("label", { className: cn("text-sm font-medium text-foreground", labelClassName), children: label }),
+        label && /* @__PURE__ */ jsx41("label", { className: cn("text-sm text-foreground", formControlLabelClass, labelClassName), children: label }),
         showValue && /* @__PURE__ */ jsx41("span", { className: cn("text-xs font-mono text-muted-foreground min-w-8 text-right", valueClassName), children: displayValue })
       ] }),
       /* @__PURE__ */ jsxs34(
@@ -16112,7 +16245,7 @@ var Slider = React37.forwardRef(
                 tooltipClassName
               }
             ),
-            isRange && /* @__PURE__ */ jsxs34(Fragment12, { children: [
+            isRange && /* @__PURE__ */ jsxs34(Fragment13, { children: [
               /* @__PURE__ */ jsx41(
                 SliderTooltip,
                 {
@@ -16208,7 +16341,7 @@ var Slider = React37.forwardRef(
               }
               const minZ = activeThumb === "min" ? "z-20" : "z-10";
               const maxZ = activeThumb === "max" ? "z-20" : "z-10";
-              return /* @__PURE__ */ jsxs34(Fragment12, { children: [
+              return /* @__PURE__ */ jsxs34(Fragment13, { children: [
                 /* @__PURE__ */ jsx41(
                   "div",
                   {
@@ -16271,7 +16404,7 @@ Slider.displayName = "Slider";
 // src/components/OverlayControls.tsx
 import { Dot as Dot2, Maximize2, Pause, Play, RotateCcw, RotateCw, Volume2, VolumeX } from "lucide-react";
 import React38 from "react";
-import { Fragment as Fragment13, jsx as jsx42, jsxs as jsxs35 } from "react/jsx-runtime";
+import { Fragment as Fragment14, jsx as jsx42, jsxs as jsxs35 } from "react/jsx-runtime";
 function resolveKeyboardEventElement(target) {
   if (target instanceof Element) return target;
   if (target instanceof Node) return target.parentElement;
@@ -16516,7 +16649,7 @@ function OverlayControls({
   const handleSliderMouseLeave = () => {
     setPreviewData(null);
   };
-  return /* @__PURE__ */ jsxs35(Fragment13, { children: [
+  return /* @__PURE__ */ jsxs35(Fragment14, { children: [
     keyboardFeedback && /* @__PURE__ */ jsx42(
       "div",
       {
@@ -17940,7 +18073,7 @@ import {
   Upload as Upload2
 } from "lucide-react";
 import { useCallback as useCallback16, useMemo as useMemo19, useRef as useRef19, useState as useState29 } from "react";
-import { Fragment as Fragment14, jsx as jsx45, jsxs as jsxs38 } from "react/jsx-runtime";
+import { Fragment as Fragment15, jsx as jsx45, jsxs as jsxs38 } from "react/jsx-runtime";
 var formatFileSize = (bytes) => {
   if (bytes === 0) return "0 Bytes";
   const k = 1024;
@@ -18371,7 +18504,7 @@ function FileUpload({
             ] }),
             /* @__PURE__ */ jsx45("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__ */ jsxs38(Fragment14, { children: [
+          variant === "compact" && /* @__PURE__ */ jsxs38(Fragment15, { children: [
             /* @__PURE__ */ jsx45("div", { className: cn("shrink-0 rounded-lg flex items-center justify-center", "bg-primary/10", currentSize.iconSize), children: /* @__PURE__ */ jsx45(Upload2, { className: cn("text-primary", size === "sm" ? "w-4 h-4" : "w-5 h-5") }) }),
             /* @__PURE__ */ jsxs38("div", { className: "flex-1 min-w-0", children: [
               /* @__PURE__ */ jsx45("p", { className: cn("font-medium truncate", currentSize.text), children: dragDropText || t("dragDropText") || "Drop files here or" }),
@@ -18438,7 +18571,7 @@ function FileUpload({
 // src/components/Carousel.tsx
 import * as React40 from "react";
 import { ChevronLeft as ChevronLeft6, ChevronRight as ChevronRight8 } from "lucide-react";
-import { Fragment as Fragment15, jsx as jsx46, jsxs as jsxs39 } from "react/jsx-runtime";
+import { Fragment as Fragment16, jsx as jsx46, jsxs as jsxs39 } from "react/jsx-runtime";
 function Carousel({
   children,
   autoScroll = true,
@@ -18868,7 +19001,7 @@ function Carousel({
             })
           }
         ),
-        shouldShowArrows && totalSlides > effectiveSlidesToShow && /* @__PURE__ */ jsxs39(Fragment15, { children: [
+        shouldShowArrows && totalSlides > effectiveSlidesToShow && /* @__PURE__ */ jsxs39(Fragment16, { children: [
           /* @__PURE__ */ jsx46(
             Button_default,
             {
@@ -19239,7 +19372,7 @@ function FallingIcons({
 // src/components/List.tsx
 import * as React42 from "react";
 import { ChevronRight as ChevronRight9 } from "lucide-react";
-import { Fragment as Fragment16, jsx as jsx48, jsxs as jsxs41 } from "react/jsx-runtime";
+import { Fragment as Fragment17, jsx as jsx48, jsxs as jsxs41 } 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-xs", icon: "h-4 w-4", avatar: "h-8 w-8" },
@@ -19408,7 +19541,7 @@ var ListItem = React42.forwardRef(
         }
       }
     } : {};
-    const inner = /* @__PURE__ */ jsxs41(Fragment16, { children: [
+    const inner = /* @__PURE__ */ jsxs41(Fragment17, { children: [
       /* @__PURE__ */ jsxs41("div", { className: cn("flex items-center gap-3 group/item relative max-md:gap-2.5", contentClassName), ...headerProps, children: [
         avatar && /* @__PURE__ */ jsx48("div", { className: cn("shrink-0", sz.avatar), children: typeof avatar === "string" ? /* @__PURE__ */ jsx48("img", { src: avatar, alt: "", className: cn("rounded-full object-cover", sz.avatar) }) : avatar }),
         Left && !avatar && /* @__PURE__ */ jsx48("span", { className: cn("text-muted-foreground shrink-0", sz.icon), children: /* @__PURE__ */ jsx48(Left, { className: cn(sz.icon) }) }),
@@ -19453,7 +19586,7 @@ var List_default = List;
 // src/components/Watermark.tsx
 import * as React43 from "react";
 import { createPortal as createPortal2 } from "react-dom";
-import { Fragment as Fragment17, jsx as jsx49, jsxs as jsxs42 } from "react/jsx-runtime";
+import { Fragment as Fragment18, jsx as jsx49, jsxs as jsxs42 } 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" },
@@ -19732,7 +19865,7 @@ var Watermark = ({
     }
   );
   if (fullPage) {
-    return /* @__PURE__ */ jsxs42(Fragment17, { children: [
+    return /* @__PURE__ */ jsxs42(Fragment18, { children: [
       children,
       typeof window !== "undefined" ? createPortal2(overlay, document.body) : null
     ] });
@@ -20919,7 +21052,7 @@ var MusicPlayer_default = MusicPlayer;
 
 // src/components/Grid.tsx
 import React47, { useId as useId13 } from "react";
-import { Fragment as Fragment18, jsx as jsx53, jsxs as jsxs46 } from "react/jsx-runtime";
+import { Fragment as Fragment19, jsx as jsx53, jsxs as jsxs46 } from "react/jsx-runtime";
 var BP_MIN = {
   sm: 640,
   md: 768,
@@ -21076,7 +21209,7 @@ var GridItem = React47.forwardRef(
       st.opacity = 0;
       st.animation = `uvGridItemFadeIn 0.5s ease-out forwards`;
     }
-    return /* @__PURE__ */ jsxs46(Fragment18, { children: [
+    return /* @__PURE__ */ jsxs46(Fragment19, { children: [
       animationDelay != null && /* @__PURE__ */ jsx53(
         "style",
         {
@@ -21106,13 +21239,13 @@ var Grid = Object.assign(GridRoot, { Item: GridItem });
 var Grid_default = Grid;
 
 // src/components/ClientOnly.tsx
-import { Fragment as Fragment19, jsx as jsx54 } from "react/jsx-runtime";
+import { Fragment as Fragment20, jsx as jsx54 } from "react/jsx-runtime";
 function ClientOnly({ children, fallback = null }) {
   const hasMounted = useHydrated();
   if (!hasMounted) {
-    return /* @__PURE__ */ jsx54(Fragment19, { children: fallback });
+    return /* @__PURE__ */ jsx54(Fragment20, { children: fallback });
   }
-  return /* @__PURE__ */ jsx54(Fragment19, { children });
+  return /* @__PURE__ */ jsx54(Fragment20, { children });
 }
 
 // src/components/Loading.tsx
@@ -21294,7 +21427,7 @@ import React58 from "react";
 
 // src/components/DataTable/components/DataTableBody.tsx
 import React49 from "react";
-import { Fragment as Fragment20, 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 DataTableOverflowText({
   text,
   align
@@ -21389,7 +21522,7 @@ function DataTableBodyRows({
       t("loading"),
       "\u2026"
     ] })
-  ] }) }) }) : displayedData.length === 0 ? /* @__PURE__ */ jsx57(TableRow, { className: "!border-border/10", children: /* @__PURE__ */ jsx57(TableCell, { colSpan: leafColumns.length, className: "text-center py-6 text-muted-foreground", children: labels?.noData || t("noData") }) }) : /* @__PURE__ */ jsxs49(Fragment20, { children: [
+  ] }) }) }) : displayedData.length === 0 ? /* @__PURE__ */ jsx57(TableRow, { className: "!border-border/10", children: /* @__PURE__ */ jsx57(TableCell, { colSpan: leafColumns.length, className: "text-center py-6 text-muted-foreground", children: labels?.noData || t("noData") }) }) : /* @__PURE__ */ jsxs49(Fragment21, { children: [
     virtualPaddingTop > 0 && /* @__PURE__ */ jsx57(TableRow, { "aria-hidden": "true", className: "border-0 hover:bg-transparent hover:shadow-none", children: /* @__PURE__ */ jsx57(TableCell, { colSpan: leafColumns.length, className: "p-0", style: { height: virtualPaddingTop } }) }),
     rowsToRender.map(({ row, idx, virtualRow }) => {
       const isStripedRow = striped && idx % 2 === 0;
@@ -21523,7 +21656,7 @@ function groupColumnsByColorTag(leafCols, colorGroups) {
 }
 
 // src/components/DataTable/components/DataTableHeader.tsx
-import { Fragment as Fragment21, 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 getColumnLabel(title) {
   if (typeof title === "string" || typeof title === "number") {
     return String(title).replace(/\s+/g, " ").trim();
@@ -21767,10 +21900,10 @@ function DataTableHeader({
             !isRightAlign && !isCenterAlign && "justify-start",
             useEndIcon && "w-full"
           ),
-          children: isRightAlign ? /* @__PURE__ */ jsxs50(Fragment21, { children: [
+          children: isRightAlign ? /* @__PURE__ */ jsxs50(Fragment22, { children: [
             filterContent,
             titleContent
-          ] }) : /* @__PURE__ */ jsxs50(Fragment21, { children: [
+          ] }) : /* @__PURE__ */ jsxs50(Fragment22, { children: [
             titleContent,
             filterContent
           ] })
@@ -21793,7 +21926,7 @@ function DataTableHeader({
       t
     ]
   );
-  return /* @__PURE__ */ jsx58(Fragment21, { children: headerRows.map((row, rowIndex) => /* @__PURE__ */ jsx58(TableRow, { className: "!border-border/10", children: row.map((headerCell, cellIndex) => {
+  return /* @__PURE__ */ jsx58(Fragment22, { children: headerRows.map((row, rowIndex) => /* @__PURE__ */ jsx58(TableRow, { className: "!border-border/10", children: row.map((headerCell, cellIndex) => {
     const { column: col, colSpan, rowSpan, isLeaf } = headerCell;
     const prevCell = cellIndex > 0 ? row[cellIndex - 1] : null;
     const prevCol = prevCell?.column;
@@ -23436,7 +23569,7 @@ function AccessDenied({
 import { Moon as Moon2, Sun as Sun2, Monitor } from "lucide-react";
 import { useRef as useRef23, useState as useState37 } from "react";
 import { createPortal as createPortal3 } from "react-dom";
-import { Fragment as Fragment22, jsx as jsx65, jsxs as jsxs57 } from "react/jsx-runtime";
+import { Fragment as Fragment23, jsx as jsx65, jsxs as jsxs57 } from "react/jsx-runtime";
 function ThemeToggleHeadless({
   theme,
   onChange,
@@ -23486,7 +23619,7 @@ function ThemeToggleHeadless({
         children: /* @__PURE__ */ jsx65(CurrentIcon, { className: "h-5 w-5" })
       }
     ),
-    isOpen && /* @__PURE__ */ jsxs57(Fragment22, { children: [
+    isOpen && /* @__PURE__ */ jsxs57(Fragment23, { children: [
       typeof window !== "undefined" && createPortal3(/* @__PURE__ */ jsx65("div", { className: "fixed inset-0 z-[99998]", onClick: () => setIsOpen(false) }), document.body),
       typeof window !== "undefined" && dropdownPosition && createPortal3(
         /* @__PURE__ */ jsx65(
@@ -23538,7 +23671,7 @@ function ThemeToggleHeadless({
 import { useRef as useRef24, useState as useState38 } from "react";
 import { createPortal as createPortal4 } from "react-dom";
 import { Globe } from "lucide-react";
-import { Fragment as Fragment23, jsx as jsx66, jsxs as jsxs58 } from "react/jsx-runtime";
+import { Fragment as Fragment24, jsx as jsx66, jsxs as jsxs58 } from "react/jsx-runtime";
 function LanguageSwitcherHeadless({
   locales,
   currentLocale,
@@ -23583,7 +23716,7 @@ function LanguageSwitcherHeadless({
         children: /* @__PURE__ */ jsx66(Globe, { className: "h-5 w-5" })
       }
     ),
-    isOpen && /* @__PURE__ */ jsxs58(Fragment23, { children: [
+    isOpen && /* @__PURE__ */ jsxs58(Fragment24, { children: [
       typeof window !== "undefined" && createPortal4(/* @__PURE__ */ jsx66("div", { className: "fixed inset-0 z-[99998]", onClick: () => setIsOpen(false) }), document.body),
       typeof window !== "undefined" && dropdownPosition && createPortal4(
         /* @__PURE__ */ jsx66(