@moontra/moonui 2.1.9 → 2.2.0

package/dist/index.js

@@ -67,7 +67,7 @@ var AccordionItem = t__namespace.forwardRef(({ className, ...props }, ref) => /*
   AccordionPrimitive__namespace.Item,
   {
     ref,
-    className: cn("border-b border-gray-200 dark:border-gray-800", className),
+    className: cn("moonui-theme", "border-b border-gray-200 dark:border-gray-800", className),
     ...props
   }
 ));
@@ -161,7 +161,7 @@ var Alert = t__namespace.forwardRef(
       {
         ref,
         role: "alert",
-        className: cn(alertVariants({ variant, size, radius, withClose: closable }), className),
+        className: cn("moonui-theme", alertVariants({ variant, size, radius, withClose: closable }), className),
         ...props,
         children: [
           !hideIcon && /* @__PURE__ */ jsxRuntime.jsx(Icon2, { className: "h-5 w-5" }),
@@ -185,7 +185,7 @@ var AlertTitle = t__namespace.forwardRef(({ className, ...props }, ref) => /* @_
   "h5",
   {
     ref,
-    className: cn("font-semibold leading-tight tracking-tight mb-1", className),
+    className: cn("moonui-theme", "font-semibold leading-tight tracking-tight mb-1", className),
     ...props
   }
 ));
@@ -194,7 +194,7 @@ var AlertDescription = t__namespace.forwardRef(({ className, ...props }, ref) =>
   "div",
   {
     ref,
-    className: cn("text-sm leading-5 text-muted-foreground", className),
+    className: cn("moonui-theme", "text-sm leading-5 text-muted-foreground", className),
     ...props
   }
 ));
@@ -226,7 +226,7 @@ var AspectRatio = t__namespace.forwardRef(({ className, variant, radius, ratio =
   "div",
   {
     ref,
-    className: cn(aspectRatioVariants({ variant, radius }), className),
+    className: cn("moonui-theme", aspectRatioVariants({ variant, radius }), className),
     style: {
       position: "relative",
       paddingBottom: `${1 / ratio * 100}%`,
@@ -259,9 +259,9 @@ var avatarVariants = classVarianceAuthority.cva(
       },
       variant: {
         default: "",
-        ring: "ring-2 ring-gray-300 dark:ring-gray-600",
-        ringOffset: "ring-2 ring-gray-300 dark:ring-gray-600 ring-offset-2 ring-offset-background dark:ring-offset-gray-950",
-        border: "border-2 border-gray-200 dark:border-gray-800"
+        ring: "ring-2 ring-border",
+        ringOffset: "ring-2 ring-border ring-offset-2 ring-offset-background",
+        border: "border-2 border-border"
       }
     },
     defaultVariants: {
@@ -275,7 +275,7 @@ var Avatar = t__namespace.forwardRef(({ className, size, radius, variant, ...pro
   AvatarPrimitive__namespace.Root,
   {
     ref,
-    className: cn(avatarVariants({ size, radius, variant }), className),
+    className: cn("moonui-theme", avatarVariants({ size, radius, variant }), className),
     ...props
   }
 ));
@@ -284,7 +284,7 @@ var AvatarImage = t__namespace.forwardRef(({ className, ...props }, ref) => /* @
   AvatarPrimitive__namespace.Image,
   {
     ref,
-    className: cn("aspect-square h-full w-full", className),
+    className: cn("moonui-theme", "aspect-square h-full w-full", className),
     ...props
   }
 ));
@@ -309,7 +309,7 @@ var AvatarGroup = t__namespace.forwardRef(
       "div",
       {
         ref,
-        className: cn("flex items-center", className),
+        className: cn("moonui-theme", "flex items-center", className),
         ...props,
         children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex", children: [
           visibleAvatars.map((avatar, index) => /* @__PURE__ */ jsxRuntime.jsx(
@@ -458,7 +458,7 @@ function Badge({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
-      className: cn(badgeVariants({ variant, size, radius }), className),
+      className: cn("moonui-theme", badgeVariants({ variant, size, radius }), className),
       "data-removable": removable ? "" : void 0,
       ...props,
       children: [
@@ -509,9 +509,9 @@ var breadcrumbVariants = classVarianceAuthority.cva(
   {
     variants: {
       variant: {
-        default: "dark:text-gray-100 transition-colors",
-        muted: "text-muted-foreground dark:text-gray-400 transition-colors",
-        ghost: "text-foreground/60 dark:text-gray-300/60 transition-colors"
+        default: "text-foreground transition-colors",
+        muted: "text-muted-foreground transition-colors",
+        ghost: "text-foreground/60 transition-colors"
       },
       size: {
         default: "text-sm",
@@ -530,7 +530,7 @@ var Breadcrumb = t__namespace.forwardRef(
     "nav",
     {
       ref,
-      className: cn(breadcrumbVariants({ variant, size }), className),
+      className: cn("moonui-theme", breadcrumbVariants({ variant, size }), className),
       "aria-label": "breadcrumb",
       ...props
     }
@@ -583,7 +583,7 @@ var BreadcrumbItem = t__namespace.forwardRef(
       "li",
       {
         ref,
-        className: cn("inline-flex items-center gap-1.5", className),
+        className: cn("moonui-theme", "inline-flex items-center gap-1.5", className),
         "aria-current": isCurrent ? "page" : void 0,
         ...props,
         children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -591,7 +591,7 @@ var BreadcrumbItem = t__namespace.forwardRef(
           {
             className: cn(
               "transition-colors duration-200 hover:text-foreground",
-              isCurrent ? "font-medium text-foreground dark:text-white dark:text-opacity-95" : "text-muted-foreground hover:text-foreground dark:text-gray-400 dark:hover:text-gray-200 dark:hover:text-opacity-95 hover:underline hover:underline-offset-4 hover:decoration-gray-300/30"
+              isCurrent ? "font-medium text-foreground" : "text-muted-foreground hover:text-foreground hover:underline hover:underline-offset-4 hover:decoration-muted-foreground/30"
             ),
             ...itemProps,
             children: props.children
@@ -611,7 +611,7 @@ var BreadcrumbSeparator = ({
   {
     role: "presentation",
     "aria-hidden": "true",
-    className: cn("text-muted-foreground dark:text-gray-500 opacity-70", className),
+    className: cn("moonui-theme", "text-muted-foreground opacity-70", className),
     ...props,
     children: children || /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-3.5 w-3.5" })
   }
@@ -625,7 +625,7 @@ var BreadcrumbEllipsis = ({
   {
     role: "presentation",
     "aria-hidden": "true",
-    className: cn("flex items-center text-muted-foreground dark:text-gray-500 dark:hover:text-gray-400 transition-colors duration-200", className),
+    className: cn("moonui-theme", "flex items-center text-muted-foreground hover:text-foreground/80 transition-colors duration-200", className),
     ...props,
     children: [
       /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MoreHorizontal, { className: "h-4 w-4" }),
@@ -641,7 +641,7 @@ var BreadcrumbLink = t__namespace.forwardRef(
       ref,
       href,
       className: cn(
-        "transition-colors duration-200 hover:text-foreground text-muted-foreground hover:underline hover:underline-offset-4 hover:decoration-gray-300/30 dark:text-gray-400 dark:hover:text-gray-200",
+        "transition-colors duration-200 hover:text-foreground text-muted-foreground hover:underline hover:underline-offset-4 hover:decoration-muted-foreground/30",
         className
       ),
       ...props
@@ -668,75 +668,71 @@ var buttonVariants = classVarianceAuthority.cva(
     "inline-flex items-center justify-center gap-2 whitespace-nowrap",
     "font-medium relative",
     "transition-all duration-200 ease-out",
-    "premium-hover",
-    /* Standart premium hover efekti */
+    "transform active:scale-[0.98]",
     "focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2",
-    "disabled:opacity-50 disabled:cursor-not-allowed disabled:pointer-events-none"
+    "disabled:opacity-50 disabled:cursor-not-allowed disabled:pointer-events-none disabled:transform-none"
   ],
   {
     variants: {
       variant: {
         primary: [
           "bg-primary text-primary-foreground",
-          "hover:bg-primary-hover dark:hover:bg-primary/90",
-          "active:bg-primary-active dark:active:bg-primary/80",
-          "shadow-sm dark:shadow-primary/20 dark:shadow-md",
-          "focus-visible:ring-primary/50 dark:focus-visible:ring-primary/30",
-          "dark:bg-primary dark:text-white",
+          "dark:bg-primary dark:text-primary-foreground",
+          "hover:bg-primary/90 dark:hover:bg-primary/90",
+          "active:bg-primary/80 dark:active:bg-primary/80",
+          "shadow-sm hover:shadow-md",
+          "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
           "transition-all duration-200"
         ],
         secondary: [
-          "bg-secondary text-secondary-foreground",
-          "hover:bg-gray-200 dark:hover:bg-gray-700/90",
-          "active:bg-gray-300 dark:active:bg-gray-600/90",
-          "border border-transparent dark:border-gray-700",
-          "focus-visible:ring-gray-400/30 dark:focus-visible:ring-gray-500/40",
-          "dark:bg-gray-800 dark:text-gray-100",
-          "dark:shadow-sm dark:shadow-gray-900/20"
+          "bg-muted text-muted-foreground",
+          "dark:bg-muted dark:text-muted-foreground",
+          "hover:bg-muted/80 dark:hover:bg-muted/80",
+          "active:bg-muted/70 dark:active:bg-muted/70",
+          "border border-input dark:border-input",
+          "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+          "shadow-sm hover:shadow-md"
         ],
         outline: [
           "bg-background text-foreground",
-          "border border-gray-300 dark:border-gray-700",
-          "hover:border-gray-400 dark:hover:border-gray-500",
-          "hover:bg-gray-50 dark:hover:bg-gray-800/80",
-          "active:bg-gray-100 dark:active:bg-gray-800/90",
-          "focus-visible:ring-gray-400/30 dark:focus-visible:ring-gray-500/40",
-          "dark:text-gray-200 dark:bg-gray-900/50",
-          "dark:shadow-sm dark:shadow-gray-950/10"
+          "dark:bg-background dark:text-foreground",
+          "border border-input dark:border-input",
+          "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent dark:hover:text-accent-foreground",
+          "active:bg-accent/80 dark:active:bg-accent/80",
+          "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+          "transition-all duration-200"
         ],
         ghost: [
           "text-foreground",
-          "hover:bg-gray-100 dark:hover:bg-gray-800/90",
-          "active:bg-gray-200 dark:active:bg-gray-700/90",
-          "focus-visible:ring-gray-400/30 dark:focus-visible:ring-gray-500/40",
-          "dark:text-gray-200",
-          "transition-colors duration-200"
+          "dark:text-foreground",
+          "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent dark:hover:text-accent-foreground",
+          "active:bg-accent/80 dark:active:bg-accent/80",
+          "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+          "transition-all duration-200"
         ],
         destructive: [
-          "bg-error text-white",
-          "hover:bg-error/90 dark:hover:bg-error/80",
-          "active:bg-error/80 dark:active:bg-error/70",
-          "shadow-sm dark:shadow-error/10 dark:shadow-md",
-          "focus-visible:ring-error/50 dark:focus-visible:ring-error/30",
-          "dark:text-white dark:border-error/20",
-          "transition-colors duration-200"
+          "bg-destructive text-destructive-foreground",
+          "dark:bg-destructive dark:text-destructive-foreground",
+          "hover:bg-destructive/90 dark:hover:bg-destructive/90",
+          "active:bg-destructive/80 dark:active:bg-destructive/80",
+          "shadow-sm hover:shadow-md",
+          "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+          "transition-all duration-200"
         ],
         success: [
-          "bg-success text-white",
-          "hover:bg-success/90 dark:hover:bg-success/80",
-          "active:bg-success/80 dark:active:bg-success/70",
-          "shadow-sm dark:shadow-success/10 dark:shadow-md",
-          "focus-visible:ring-success/50 dark:focus-visible:ring-success/30",
-          "dark:text-white dark:border-success/20",
-          "transition-colors duration-200"
+          "bg-success text-success-foreground",
+          "dark:bg-success dark:text-success-foreground",
+          "hover:bg-success/90 dark:hover:bg-success/90",
+          "active:bg-success/80 dark:active:bg-success/80",
+          "shadow-sm hover:shadow-md",
+          "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+          "transition-all duration-200"
         ],
         link: [
           "text-primary bg-transparent",
           "underline-offset-4 hover:underline",
-          "hover:text-primary-hover active:text-primary-active",
+          "hover:text-primary/80 active:text-primary/70",
           "p-0 h-auto",
-          "dark:text-blue-400 dark:hover:text-blue-300",
-          "dark:active:text-blue-500",
           "transition-colors duration-200"
         ],
         gradient: [
@@ -786,14 +782,14 @@ var buttonVariants = classVarianceAuthority.cva(
         ]
       },
       size: {
-        xs: "h-7 px-2.5 text-xs rounded",
-        sm: "h-8 px-3 text-sm rounded",
-        md: "h-10 px-4 text-base rounded-md",
+        xs: "h-7 px-2.5 text-xs rounded-md",
+        sm: "h-8 px-3 text-sm rounded-md",
+        md: "h-10 px-4 text-base rounded-lg",
         lg: "h-12 px-6 text-lg rounded-lg",
-        xl: "h-14 px-8 text-xl rounded-lg",
-        icon: "h-10 w-10 p-2 rounded-md",
-        "icon-sm": "h-8 w-8 p-1.5 rounded",
-        "icon-lg": "h-12 w-12 p-3 rounded-lg"
+        xl: "h-14 px-8 text-xl rounded-xl",
+        icon: "h-10 w-10 p-2 rounded-lg",
+        "icon-sm": "h-8 w-8 p-1.5 rounded-md",
+        "icon-lg": "h-12 w-12 p-3 rounded-xl"
       },
       rounded: {
         default: "",
@@ -831,7 +827,7 @@ var Button = t__namespace.forwardRef(
     return /* @__PURE__ */ jsxRuntime.jsxs(
       Comp,
       {
-        className: cn(buttonVariants({ variant, size, rounded, fullWidth, className })),
+        className: cn("moonui-theme", buttonVariants({ variant, size, rounded, fullWidth, className })),
         ref,
         disabled: disabled || loading,
         "data-loading": loading ? "" : void 0,
@@ -847,7 +843,7 @@ var Button = t__namespace.forwardRef(
   }
 );
 Button.displayName = "Button";
-var microInteractionVariants = classVarianceAuthority.cva("", {
+classVarianceAuthority.cva("", {
   variants: {
     hover: {
       lift: [
@@ -978,6 +974,32 @@ var tapAnimations = {
     transition: { duration: 0.1 }
   }
 };
+var pageTransitions = {
+  fadeIn: {
+    initial: { opacity: 0 },
+    animate: { opacity: 1 },
+    exit: { opacity: 0 },
+    transition: { duration: 0.3 }
+  },
+  slideUp: {
+    initial: { opacity: 0, y: 20 },
+    animate: { opacity: 1, y: 0 },
+    exit: { opacity: 0, y: -20 },
+    transition: springAnimations.smooth
+  },
+  slideRight: {
+    initial: { opacity: 0, x: -20 },
+    animate: { opacity: 1, x: 0 },
+    exit: { opacity: 0, x: 20 },
+    transition: springAnimations.smooth
+  },
+  scale: {
+    initial: { opacity: 0, scale: 0.95 },
+    animate: { opacity: 1, scale: 1 },
+    exit: { opacity: 0, scale: 1.05 },
+    transition: springAnimations.smooth
+  }
+};
 var skeletonAnimation = {
   initial: { opacity: 0.5 },
   animate: {
@@ -1037,7 +1059,7 @@ var Card = t__namespace.forwardRef(
         framerMotion.motion.div,
         {
           ref,
-          className: cn(cardVariants({ variant, size, radius, interactive, className })),
+          className: cn("moonui-theme", cardVariants({ variant, size, radius, interactive, className })),
           ...interactionProps,
           ...props
         }
@@ -1047,7 +1069,7 @@ var Card = t__namespace.forwardRef(
       "div",
       {
         ref,
-        className: cn(cardVariants({ variant, size, radius, interactive, className })),
+        className: cn("moonui-theme", cardVariants({ variant, size, radius, interactive, className })),
         ...props
       }
     );
@@ -1058,7 +1080,7 @@ var CardHeader = t__namespace.forwardRef(({ className, ...props }, ref) => /* @_
   "div",
   {
     ref,
-    className: cn("flex flex-col space-y-1.5", className),
+    className: cn("moonui-theme", "flex flex-col space-y-1.5", className),
     ...props
   }
 ));
@@ -1067,7 +1089,7 @@ var CardTitle = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__
   "h3",
   {
     ref,
-    className: cn("text-lg font-semibold leading-none tracking-tight", className),
+    className: cn("moonui-theme", "text-lg font-semibold leading-none tracking-tight", className),
     ...props
   }
 ));
@@ -1076,18 +1098,18 @@ var CardDescription = t__namespace.forwardRef(({ className, ...props }, ref) =>
   "p",
   {
     ref,
-    className: cn("text-sm text-muted-foreground", className),
+    className: cn("moonui-theme", "text-sm text-muted-foreground", className),
     ...props
   }
 ));
 CardDescription.displayName = "CardDescription";
-var CardContent = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("pt-0", className), ...props }));
+var CardContent = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("moonui-theme", "pt-0", className), ...props }));
 CardContent.displayName = "CardContent";
 var CardFooter = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
-    className: cn("flex items-center pt-4", className),
+    className: cn("moonui-theme", "flex items-center pt-4", className),
     ...props
   }
 ));
@@ -1151,7 +1173,7 @@ var Checkbox = t__namespace.forwardRef(({
     {
       ref,
       checked: effectiveChecked,
-      className: cn(checkboxVariants({ variant, size, radius, animation }), className),
+      className: cn("moonui-theme", checkboxVariants({ variant, size, radius, animation }), className),
       ...props,
       children: /* @__PURE__ */ jsxRuntime.jsx(
         CheckboxPrimitive__namespace.Indicator,
@@ -1736,7 +1758,7 @@ var CollapsibleTrigger2 = t__namespace.forwardRef(({ className, children, varian
       Trigger2,
       {
         ref,
-        className: cn(collapsibleTriggerVariants({ variant, size }), className),
+        className: cn("moonui-theme", collapsibleTriggerVariants({ variant, size }), className),
         asChild,
         ...props,
         children
@@ -1747,7 +1769,7 @@ var CollapsibleTrigger2 = t__namespace.forwardRef(({ className, children, varian
     Trigger2,
     {
       ref,
-      className: cn(collapsibleTriggerVariants({ variant, size }), className),
+      className: cn("moonui-theme", collapsibleTriggerVariants({ variant, size }), className),
       ...props,
       children: [
         children,
@@ -1783,7 +1805,7 @@ var CollapsibleContent2 = t__namespace.forwardRef(({ className, children, varian
   Content2,
   {
     ref,
-    className: cn(collapsibleContentVariants({ variant, size }), className),
+    className: cn("moonui-theme", collapsibleContentVariants({ variant, size }), className),
     ...props,
     children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4", children })
   }
@@ -1883,7 +1905,7 @@ var Input = t__namespace.forwardRef(
     const showMessage = alwaysShowMessage || error || success;
     const messageType = error ? "error" : success ? "success" : "normal";
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1.5 w-full", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn(inputWrapperVariants({ size }), wrapperClassName), children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("moonui-theme", inputWrapperVariants({ size }), wrapperClassName), children: [
         leftIcon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute left-3 text-gray-500 flex items-center justify-center pointer-events-none", children: loading ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 animate-spin" }) : leftIcon }),
         /* @__PURE__ */ jsxRuntime.jsx(
           "input",
@@ -2044,7 +2066,7 @@ var PopoverClose = PopoverPrimitive__namespace.Close;
 var PopoverSeparator = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
-    className: cn("my-2 h-px bg-border", className),
+    className: cn("moonui-theme", "my-2 h-px bg-border", className),
     ...props
   }
 );
@@ -2052,7 +2074,7 @@ PopoverSeparator.displayName = "PopoverSeparator";
 var PopoverHeader = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
-    className: cn("-mx-4 -mt-4 mb-3 px-4 pt-4 pb-3 border-b border-border", className),
+    className: cn("moonui-theme", "-mx-4 -mt-4 mb-3 px-4 pt-4 pb-3 border-b border-border", className),
     ...props
   }
 );
@@ -2060,7 +2082,7 @@ PopoverHeader.displayName = "PopoverHeader";
 var PopoverFooter = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
-    className: cn("-mx-4 -mb-4 mt-3 px-4 pt-3 pb-4 border-t border-border", className),
+    className: cn("moonui-theme", "-mx-4 -mb-4 mt-3 px-4 pt-3 pb-4 border-t border-border", className),
     ...props
   }
 );
@@ -2069,6 +2091,7 @@ var Tabs = t__namespace.forwardRef(({ vertical = false, ...props }, ref) => /* @
   TabsPrimitive__namespace.Root,
   {
     ref,
+    className: cn("moonui-theme", props.className),
     orientation: vertical ? "vertical" : "horizontal",
     ...props
   }
@@ -2104,7 +2127,7 @@ var TabsList = t__namespace.forwardRef(({ className, variant, orientation, fullW
   TabsPrimitive__namespace.List,
   {
     ref,
-    className: cn(tabsListVariants({ variant, orientation, fullWidth, className })),
+    className: cn("moonui-theme", tabsListVariants({ variant, orientation, fullWidth, className })),
     ...props
   }
 ));
@@ -2158,6 +2181,7 @@ var TabsTrigger = t__namespace.forwardRef(({
   {
     ref,
     className: cn(
+      "moonui-theme",
       tabsTriggerVariants({ variant, size, orientation, fullWidth }),
       fadeTabs && "data-[state=inactive]:opacity-60",
       className
@@ -2177,6 +2201,7 @@ var TabsContent = t__namespace.forwardRef(({ className, animated = false, ...pro
   {
     ref,
     className: cn(
+      "moonui-theme",
       "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
       animated && "data-[state=active]:animate-fadeIn data-[state=inactive]:animate-fadeOut",
       className
@@ -2367,7 +2392,7 @@ var Slider = t__namespace.forwardRef(({
     /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
-        className: cn(sliderVariants({ size }), className),
+        className: cn("moonui-theme", sliderVariants({ size }), className),
         "data-disabled": disabled ? true : void 0,
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(
@@ -2947,7 +2972,7 @@ function SimpleColorPicker({
     default: "h-8 w-8",
     lg: "h-10 w-10"
   };
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex flex-wrap gap-2", className), children: colors.map((color) => /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("moonui-theme", "flex flex-wrap gap-2", className), children: colors.map((color) => /* @__PURE__ */ jsxRuntime.jsx(
     "button",
     {
       className: cn(
@@ -2972,7 +2997,7 @@ function GradientPicker({
     setGradient(newGradient);
     onChange?.(newGradient);
   };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-4", className), children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("moonui-theme", "space-y-4", className), children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
@@ -3492,7 +3517,7 @@ var DialogOverlay = t__namespace.forwardRef(({ className, variant, animation, ..
   DialogPrimitive__namespace.Overlay,
   {
     ref,
-    className: cn(overlayVariants({ variant, animation }), className),
+    className: cn("moonui-theme", overlayVariants({ variant, animation }), className),
     ...props
   }
 ));
@@ -3688,7 +3713,7 @@ var DialogForm = t__namespace.forwardRef(({ className, ...props }, ref) => /* @_
   "form",
   {
     ref,
-    className: cn("flex flex-col gap-4", className),
+    className: cn("moonui-theme", "flex flex-col gap-4", className),
     ...props
   }
 ));
@@ -3718,7 +3743,7 @@ var Command = t__namespace.forwardRef(({ className, variant, size, ...props }, r
   _e,
   {
     ref,
-    className: cn(commandVariants({ variant, size }), className),
+    className: cn("moonui-theme", commandVariants({ variant, size }), className),
     ...props
   }
 ));
@@ -3755,7 +3780,7 @@ var CommandList = t__namespace.forwardRef(({ className, ...props }, ref) => /* @
   _e.List,
   {
     ref,
-    className: cn("max-h-[300px] overflow-y-auto overflow-x-hidden", className),
+    className: cn("moonui-theme", "max-h-[300px] overflow-y-auto overflow-x-hidden", className),
     ...props
   }
 ));
@@ -3764,7 +3789,7 @@ var CommandEmpty = t__namespace.forwardRef(({ className, ...props }, ref) => /*
   _e.Empty,
   {
     ref,
-    className: cn("py-6 text-center text-sm text-muted-foreground", className),
+    className: cn("moonui-theme", "py-6 text-center text-sm text-muted-foreground", className),
     ...props
   }
 ));
@@ -3785,7 +3810,7 @@ var CommandSeparator = t__namespace.forwardRef(({ className, ...props }, ref) =>
   _e.Separator,
   {
     ref,
-    className: cn("-mx-1 h-px bg-border", className),
+    className: cn("moonui-theme", "-mx-1 h-px bg-border", className),
     ...props
   }
 ));
@@ -6918,7 +6943,7 @@ var Table = t__namespace.forwardRef(({
   ] });
 });
 Table.displayName = "Table";
-var TableHeader = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("thead", { ref, className: cn("[&_tr]:border-b", className), ...props }));
+var TableHeader = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("thead", { ref, className: cn("moonui-theme", "[&_tr]:border-b", className), ...props }));
 TableHeader.displayName = "TableHeader";
 var TableBody = t__namespace.forwardRef(({ className, emptyContent, emptyMessage = "No data available", children, ...props }, ref) => {
   const hasChildren = t__namespace.Children.count(children) > 0;
@@ -6926,7 +6951,7 @@ var TableBody = t__namespace.forwardRef(({ className, emptyContent, emptyMessage
     "tbody",
     {
       ref,
-      className: cn("[&_tr:last-child]:border-0", className),
+      className: cn("moonui-theme", "[&_tr:last-child]:border-0", className),
       ...props,
       children: hasChildren ? children : /* @__PURE__ */ jsxRuntime.jsx("tr", { children: /* @__PURE__ */ jsxRuntime.jsx("td", { colSpan: 100, className: "h-24 text-center", children: emptyContent || /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-6 text-muted-foreground", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm", children: emptyMessage }) }) }) })
     }
@@ -6937,7 +6962,7 @@ var TableFooter = t__namespace.forwardRef(({ className, ...props }, ref) => /* @
   "tfoot",
   {
     ref,
-    className: cn("bg-primary text-primary-foreground font-medium", className),
+    className: cn("moonui-theme", "bg-primary text-primary-foreground font-medium", className),
     ...props
   }
 ));
@@ -7039,7 +7064,7 @@ var TableCell = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__
   "td",
   {
     ref,
-    className: cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className),
+    className: cn("moonui-theme", "p-4 align-middle [&:has([role=checkbox])]:pr-0", className),
     ...props
   }
 ));
@@ -7048,7 +7073,7 @@ var TableCaption = t__namespace.forwardRef(({ className, ...props }, ref) => /*
   "caption",
   {
     ref,
-    className: cn("mt-4 text-sm text-muted-foreground", className),
+    className: cn("moonui-theme", "mt-4 text-sm text-muted-foreground", className),
     ...props
   }
 ));
@@ -7166,7 +7191,7 @@ var SelectLabel = t__namespace.forwardRef(({ className, ...props }, ref) => /* @
   SelectPrimitive__namespace.Label,
   {
     ref,
-    className: cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className),
+    className: cn("moonui-theme", "py-1.5 pl-8 pr-2 text-sm font-semibold", className),
     ...props
   }
 ));
@@ -7202,7 +7227,7 @@ var SelectSeparator = t__namespace.forwardRef(({ className, ...props }, ref) =>
   SelectPrimitive__namespace.Separator,
   {
     ref,
-    className: cn("-mx-1 my-1 h-px bg-muted dark:bg-gray-700", className),
+    className: cn("moonui-theme", "-mx-1 my-1 h-px bg-muted dark:bg-gray-700", className),
     ...props
   }
 ));
@@ -7318,7 +7343,7 @@ var DropdownMenuSeparator = t__namespace.forwardRef(({ className, ...props }, re
   DropdownMenuPrimitive__namespace.Separator,
   {
     ref,
-    className: cn("-mx-1 my-1 h-px bg-muted", className),
+    className: cn("moonui-theme", "-mx-1 my-1 h-px bg-muted", className),
     ...props
   }
 ));
@@ -7330,7 +7355,7 @@ var DropdownMenuShortcut = ({
   return /* @__PURE__ */ jsxRuntime.jsx(
     "span",
     {
-      className: cn("ml-auto text-xs tracking-widest opacity-60", className),
+      className: cn("moonui-theme", "ml-auto text-xs tracking-widest opacity-60", className),
       ...props
     }
   );
@@ -7386,6 +7411,15 @@ var Skeleton = t__namespace.forwardRef(
     style,
     ...props
   }, ref) => {
+    const {
+      onDrag,
+      onDragEnd,
+      onDragStart,
+      onAnimationStart,
+      onAnimationEnd,
+      onAnimationIteration,
+      ...filteredProps
+    } = props;
     if (isLoaded && children) {
       if (useMotion) {
         return /* @__PURE__ */ jsxRuntime.jsx(
@@ -7395,13 +7429,13 @@ var Skeleton = t__namespace.forwardRef(
             initial: { opacity: 0 },
             animate: { opacity: 1 },
             transition: { duration: fadeInDuration / 1e3 },
-            className,
+            className: cn("moonui-theme", className),
             style: {
               height,
               width,
               ...style
             },
-            ...props,
+            ...filteredProps,
             children
           }
         );
@@ -7410,7 +7444,7 @@ var Skeleton = t__namespace.forwardRef(
         "div",
         {
           ref,
-          className: cn("animate-fade-in", className),
+          className: cn("moonui-theme", "animate-fade-in", className),
           style: {
             animationDuration: `${fadeInDuration}ms`,
             height,
@@ -7428,6 +7462,7 @@ var Skeleton = t__namespace.forwardRef(
       {
         ref,
         className: cn(
+          "moonui-theme",
           skeletonVariants({ variant, size, shape, animation }),
           "relative isolate",
           className
@@ -7438,7 +7473,7 @@ var Skeleton = t__namespace.forwardRef(
           ...style
         },
         ...useMotion ? skeletonAnimation : {},
-        ...props
+        ...filteredProps
       }
     );
   }
@@ -7460,7 +7495,7 @@ var SkeletonText = t__namespace.forwardRef(
       "div",
       {
         ref,
-        className: cn("flex flex-col", className),
+        className: cn("moonui-theme", "flex flex-col", className),
         style: { gap: spacing },
         ...props,
         children: Array.from({ length: lines }).map((_, i) => {
@@ -7500,7 +7535,7 @@ var SkeletonAvatar = t__namespace.forwardRef(
         variant,
         animation,
         shape: "circle",
-        className: cn("shrink-0", className),
+        className: cn("moonui-theme", "shrink-0", className),
         style: {
           height: size,
           width: size
@@ -7692,7 +7727,7 @@ function DataTable({
     return /* @__PURE__ */ jsxRuntime.jsx(DataTableLoading, {});
   }
   const selectedRows = table.getFilteredSelectedRowModel().rows;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-4", className), children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("moonui-theme", "space-y-4", className), children: [
     (title || description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
       title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-semibold", children: title }),
       description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: description })
@@ -8057,7 +8092,7 @@ function Calendar({
     return [...previousMonthDays, ...emptyCells, ...days2, ...nextMonthDays];
   };
   const days = getDaysInMonth();
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("p-0", className), children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("moonui-theme", "p-0", className), children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-6 py-4", children: [
       /* @__PURE__ */ jsxRuntime.jsx(
         "button",
@@ -8143,8 +8178,7 @@ var datePickerVariants = classVarianceAuthority.cva(
       variant: {
         default: "",
         outline: "border-2",
-        ghost: "hover:bg-accent hover:text-accent-foreground",
-        minimal: "h-auto p-0 border-0 shadow-none"
+        ghost: "hover:bg-accent hover:text-accent-foreground"
       },
       size: {
         default: "h-10 px-4 py-2",
@@ -8222,11 +8256,11 @@ function DatePicker({
   };
   const displayValue = internalDate && dateFns.isValid(internalDate) ? dateFns.format(internalDate, formatString) : null;
   const iconElement = icon || /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Calendar, { className: "h-4 w-4" });
-  return /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open, onOpenChange: setOpen, children: [
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "moonui-theme", children: /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open, onOpenChange: setOpen, children: [
     /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
       Button,
       {
-        variant: variant === "minimal" ? "ghost" : variant || "outline",
+        variant: variant === "ghost" ? "ghost" : "outline",
         className: cn(
           datePickerVariants({ variant, size, state }),
           !displayValue && "text-muted-foreground",
@@ -8305,7 +8339,7 @@ function DatePicker({
         children: /* @__PURE__ */ jsxRuntime.jsxs(
           framerMotion.motion.div,
           {
-            ...microInteractionVariants.fadeIn,
+            ...pageTransitions.fadeIn,
             className: "rounded-2xl bg-background overflow-hidden",
             children: [
               /* @__PURE__ */ jsxRuntime.jsx(
@@ -8335,7 +8369,7 @@ function DatePicker({
         )
       }
     )
-  ] });
+  ] }) });
 }
 function DateRangePicker({
   className,
@@ -8373,7 +8407,7 @@ function DateRangePicker({
     /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
       Button,
       {
-        variant: props.variant === "minimal" ? "ghost" : props.variant || "outline",
+        variant: props.variant === "ghost" ? "ghost" : "outline",
         className: cn(
           datePickerVariants({
             variant: props.variant,
@@ -8531,7 +8565,7 @@ function MonthPicker({
     /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
       Button,
       {
-        variant: props.variant || "outline",
+        variant: props.variant === "default" ? "outline" : props.variant || "outline",
         className: cn(
           datePickerVariants({
             variant: props.variant,
@@ -8573,7 +8607,7 @@ function MonthPicker({
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-3 gap-2", children: months.map((month, index) => /* @__PURE__ */ jsxRuntime.jsx(
         Button,
         {
-          variant: value && value.getMonth() === index ? "default" : "outline",
+          variant: value && value.getMonth() === index ? "primary" : "outline",
           size: "sm",
           onClick: () => handleMonthSelect(index),
           className: "h-8 text-xs",
@@ -8619,7 +8653,7 @@ function DraggableList({
   const handleDragEnd = () => {
     setDraggedIndex(null);
   };
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("space-y-2", className), children: items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("moonui-theme", "space-y-2", className), children: items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
       draggable: !disabled,
@@ -8738,7 +8772,7 @@ var Progress = t__namespace.forwardRef(({
       "div",
       {
         ref,
-        className: cn(progressVariants({ variant, size, radius, animation }), className),
+        className: cn("moonui-theme", progressVariants({ variant, size, radius, animation }), className),
         role: "progressbar",
         "aria-valuemin": 0,
         "aria-valuemax": max2,
@@ -8819,7 +8853,7 @@ var FileItem = ({
               /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-3 w-3 mr-1 animate-spin" }),
               "Uploading"
             ] }),
-            status === "success" && /* @__PURE__ */ jsxRuntime.jsxs(Badge, { variant: "default", className: "h-5 bg-green-500", children: [
+            status === "success" && /* @__PURE__ */ jsxRuntime.jsxs(Badge, { variant: "success", className: "h-5", children: [
               /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckCircle, { className: "h-3 w-3 mr-1" }),
               "Done"
             ] }),
@@ -8968,7 +9002,7 @@ var FileUpload = t__namespace.default.forwardRef(
         onRemove(fileId);
       }
     }, [onRemove]);
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: cn("space-y-4", className), ...props, children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: cn("moonui-theme", "space-y-4", className), ...props, children: [
       /* @__PURE__ */ jsxRuntime.jsxs(
         framerMotion.motion.div,
         {
@@ -9307,7 +9341,7 @@ function GitHubStarButton({
     {
       variant: "outline",
       size,
-      className: cn("group", className),
+      className: cn("moonui-theme", "group", className),
       asChild: true,
       children: /* @__PURE__ */ jsxRuntime.jsxs(
         "a",
@@ -9335,7 +9369,7 @@ function MoonLogo({
 }) {
   const logoId = t__namespace.useId();
   const gradientId = `moon-gradient-${logoId}`;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex items-center gap-2", className), children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("moonui-theme", "flex items-center gap-2", className), children: [
     /* @__PURE__ */ jsxRuntime.jsxs(
       "svg",
       {
@@ -9412,7 +9446,7 @@ var Pagination = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(
   {
     role: "navigation",
     "aria-label": "pagination",
-    className: cn("mx-auto flex w-full justify-center", className),
+    className: cn("moonui-theme", "mx-auto flex w-full justify-center", className),
     ...props
   }
 );
@@ -9421,12 +9455,12 @@ var PaginationContent = t__namespace.forwardRef(({ className, ...props }, ref) =
   "ul",
   {
     ref,
-    className: cn("flex flex-row items-center gap-1", className),
+    className: cn("moonui-theme", "flex flex-row items-center gap-1", className),
     ...props
   }
 ));
 PaginationContent.displayName = "PaginationContent";
-var PaginationItem = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("li", { ref, className: cn("", className), ...props }));
+var PaginationItem = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("li", { ref, className: cn("moonui-theme", "", className), ...props }));
 PaginationItem.displayName = "PaginationItem";
 var PaginationLink = ({
   className,
@@ -9455,8 +9489,8 @@ var PaginationPrevious = ({
   PaginationLink,
   {
     "aria-label": "Go to previous page",
-    size: "default",
-    className: cn("gap-1 pl-2.5", className),
+    size: "md",
+    className: cn("moonui-theme", "gap-1 pl-2.5", className),
     ...props,
     children: [
       /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { className: "h-4 w-4" }),
@@ -9472,8 +9506,8 @@ var PaginationNext = ({
   PaginationLink,
   {
     "aria-label": "Go to next page",
-    size: "default",
-    className: cn("gap-1 pr-2.5", className),
+    size: "md",
+    className: cn("moonui-theme", "gap-1 pr-2.5", className),
     ...props,
     children: [
       /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Next" }),
@@ -9489,7 +9523,7 @@ var PaginationEllipsis = ({
   "span",
   {
     "aria-hidden": true,
-    className: cn("flex h-9 w-9 items-center justify-center", className),
+    className: cn("moonui-theme", "flex h-9 w-9 items-center justify-center", className),
     ...props,
     children: [
       /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MoreHorizontal, { className: "h-4 w-4" }),
@@ -9528,7 +9562,7 @@ var RadioGroup2 = t__namespace.forwardRef(
       {
         ref,
         role: "radiogroup",
-        className: cn("grid gap-2", className),
+        className: cn("moonui-theme", "grid gap-2", className),
         ...props
       }
     ) });
@@ -9933,7 +9967,7 @@ var Toggle2 = t__namespace.forwardRef(({ className, variant, size, ...props }, r
   Root13,
   {
     ref,
-    className: cn(toggleVariants({ variant, size, className })),
+    className: cn("moonui-theme", toggleVariants({ variant, size, className })),
     ...props
   }
 ));
@@ -9969,7 +10003,7 @@ var TooltipArrow = t__namespace.forwardRef(({ className, ...props }, ref) => /*
   TooltipPrimitive__namespace.Arrow,
   {
     ref,
-    className: cn("fill-current", className),
+    className: cn("moonui-theme", "fill-current", className),
     ...props
   }
 ));
@@ -9979,7 +10013,7 @@ var TooltipContent = t__namespace.forwardRef(({ className, variant, size, showAr
   {
     ref,
     sideOffset,
-    className: cn(tooltipVariants({ variant, size }), className),
+    className: cn("moonui-theme", tooltipVariants({ variant, size }), className),
     ...props,
     children: [
       props.children,
@@ -9997,7 +10031,6 @@ var SimpleTooltip = t__namespace.forwardRef(
     side = "top",
     align = "center",
     delayDuration = 400,
-    skipDelayDuration = 300,
     sideOffset = 4,
     showArrow = false,
     className,
@@ -10013,7 +10046,6 @@ var SimpleTooltip = t__namespace.forwardRef(
         defaultOpen,
         onOpenChange,
         delayDuration,
-        skipDelayDuration,
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children }),
           /* @__PURE__ */ jsxRuntime.jsx(
@@ -10651,7 +10683,7 @@ var SwipeableCard = t__namespace.forwardRef(
   }
 );
 SwipeableCard.displayName = "SwipeableCard";
-var Switch = t__namespace.forwardRef(({ className, size = "md", variant = "primary", loading, leftIcon, rightIcon, description, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex items-center gap-2", children: [
+var Switch = t__namespace.forwardRef(({ className, size = "md", variant = "primary", loading, leftIcon, rightIcon, description, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "moonui-theme inline-flex items-center gap-2", children: [
   leftIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: leftIcon }),
   /* @__PURE__ */ jsxRuntime.jsxs(
     SwitchPrimitives__namespace.Root,
@@ -10716,6 +10748,7 @@ var Textarea = t__namespace.forwardRef(
       "textarea",
       {
         className: cn(
+          "moonui-theme",
           "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
           className
         ),
@@ -10761,7 +10794,7 @@ var Toast = t__namespace.forwardRef(({ className, variant, ...props }, ref) => {
     ToastPrimitives__namespace.Root,
     {
       ref,
-      className: cn(toastVariants({ variant }), className),
+      className: cn("moonui-theme", toastVariants({ variant }), className),
       ...props
     }
   );
@@ -10797,7 +10830,7 @@ var ToastTitle = t__namespace.forwardRef(({ className, ...props }, ref) => /* @_
   ToastPrimitives__namespace.Title,
   {
     ref,
-    className: cn("text-sm font-semibold [&+div]:text-xs", className),
+    className: cn("moonui-theme", "text-sm font-semibold [&+div]:text-xs", className),
     ...props
   }
 ));
@@ -10806,7 +10839,7 @@ var ToastDescription = t__namespace.forwardRef(({ className, ...props }, ref) =>
   ToastPrimitives__namespace.Description,
   {
     ref,
-    className: cn("text-sm opacity-90", className),
+    className: cn("moonui-theme", "text-sm opacity-90", className),
     ...props
   }
 ));