@moontra/moonui-pro 3.4.33 → 3.4.34

package/dist/index.mjs

@@ -87501,7 +87501,7 @@ var MeteorsInternal = ({
   className,
   containerClassName,
   number = 20,
-  color = "#ffffff",
+  color,
   duration = { min: 3, max: 7 },
   size: size4 = { min: 0.5, max: 1 },
   speed = "medium",
@@ -87513,6 +87513,17 @@ var MeteorsInternal = ({
   glow = true,
   glowSize = 10
 }) => {
+  const { theme, resolvedTheme } = useTheme();
+  const [mounted, setMounted] = useState(false);
+  useEffect(() => {
+    setMounted(true);
+  }, []);
+  const currentTheme = mounted ? resolvedTheme || theme || "dark" : "dark";
+  const defaultColor = currentTheme === "dark" ? "#ffffff" : "#000000";
+  const finalColor = color || defaultColor;
+  if (!mounted) {
+    return null;
+  }
   const meteors = new Array(number).fill(true);
   const speedMultiplier = speed === "slow" ? 2 : speed === "fast" ? 0.5 : 1;
   const random = (min2, max2) => {
@@ -87554,11 +87565,11 @@ var MeteorsInternal = ({
                 top: `${initialTop}%`,
                 width: `${tailLength}px`,
                 height: `${meteorSize * 2}px`,
-                background: `linear-gradient(to right, ${color}, transparent)`,
+                background: `linear-gradient(to right, ${finalColor}, transparent)`,
                 transform: `rotate(${rotation}deg)`,
                 animation: `meteor ${animationDuration}s linear ${animationDelay}s infinite`,
                 opacity: meteorOpacity,
-                filter: glow ? `drop-shadow(0 0 ${glowSize}px ${color})` : void 0
+                filter: glow ? `drop-shadow(0 0 ${glowSize}px ${finalColor})` : void 0
               },
               children: /* @__PURE__ */ jsx(
                 "span",
@@ -87569,8 +87580,8 @@ var MeteorsInternal = ({
                     height: `${meteorSize * 4}px`,
                     borderRadius: "50%",
                     marginTop: `-${meteorSize}px`,
-                    background: color,
-                    boxShadow: glow ? `0 0 ${glowSize}px ${meteorSize}px ${color}33` : void 0
+                    background: finalColor,
+                    boxShadow: glow ? `0 0 ${glowSize}px ${meteorSize}px ${finalColor}33` : void 0
                   }
                 }
               )
@@ -87604,11 +87615,7 @@ var AuroraBackgroundInternal = ({
   children,
   className,
   containerClassName,
-  colors = {
-    primary: "#3b82f6",
-    secondary: "#8b5cf6",
-    tertiary: "#06b6d4"
-  },
+  colors,
   speed = "normal",
   opacity = 0.5,
   blur: blur2 = 80,
@@ -87619,10 +87626,38 @@ var AuroraBackgroundInternal = ({
   fixed = false,
   pauseWhenHidden = false
 }) => {
+  const { theme, resolvedTheme } = useTheme();
+  const [mounted, setMounted] = useState(false);
   const [mousePosition, setMousePosition] = useState({ x: 50, y: 50 });
   const [isVisible, setIsVisible] = useState(true);
   const containerRef = useRef(null);
   const observerTimeoutRef = useRef(null);
+  useEffect(() => {
+    setMounted(true);
+  }, []);
+  const currentTheme = mounted ? resolvedTheme || theme || "dark" : "dark";
+  const themeDefaultColors = useMemo(() => {
+    if (currentTheme === "dark") {
+      return {
+        primary: "#9D7FD1",
+        // Medium pastel purple
+        secondary: "#7B9FF0",
+        // Medium pastel blue
+        tertiary: "#6BC9D4"
+        // Medium pastel cyan
+      };
+    } else {
+      return {
+        primary: "#3D2680",
+        // Moontra dark purple
+        secondary: "#5B3FA0",
+        // Moontra medium purple
+        tertiary: "#00ACC1"
+        // Moontra cyan
+      };
+    }
+  }, [currentTheme]);
+  const finalColors = colors || themeDefaultColors;
   const duration = useMemo(() => {
     switch (speed) {
       case "slow":
@@ -87637,26 +87672,26 @@ var AuroraBackgroundInternal = ({
     switch (variant) {
       case "subtle":
         return {
-          primary: colors.primary || "#94a3b8",
-          secondary: colors.secondary || "#cbd5e1",
-          tertiary: colors.tertiary || "#e2e8f0"
+          primary: finalColors.primary || "#94a3b8",
+          secondary: finalColors.secondary || "#cbd5e1",
+          tertiary: finalColors.tertiary || "#e2e8f0"
         };
       case "vibrant":
         return {
-          primary: colors.primary || "#f97316",
-          secondary: colors.secondary || "#ec4899",
-          tertiary: colors.tertiary || "#8b5cf6"
+          primary: finalColors.primary || "#f97316",
+          secondary: finalColors.secondary || "#ec4899",
+          tertiary: finalColors.tertiary || "#8b5cf6"
         };
       case "dark":
         return {
-          primary: colors.primary || "#1e293b",
-          secondary: colors.secondary || "#334155",
-          tertiary: colors.tertiary || "#475569"
+          primary: finalColors.primary || "#1e293b",
+          secondary: finalColors.secondary || "#334155",
+          tertiary: finalColors.tertiary || "#475569"
         };
       default:
-        return colors;
+        return finalColors;
     }
-  }, [variant, colors]);
+  }, [variant, finalColors]);
   const handleMouseMove2 = useCallback((e) => {
     if (!interactive)
       return;
@@ -87728,6 +87763,9 @@ var AuroraBackgroundInternal = ({
     filter: `blur(${blur2 * 0.5}px)`,
     mixBlendMode: "overlay"
   }), [blur2]);
+  if (!mounted) {
+    return null;
+  }
   return /* @__PURE__ */ jsxs(
     "div",
     {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@moontra/moonui-pro",
-    "version": "3.4.33",
+    "version": "3.4.34",
     "description": "Premium React components for MoonUI - Advanced UI library with 50+ pro components including performance, interactive, and gesture components",
     "type": "module",
     "main": "dist/index.mjs",