npm - erp-pro-ui - Versions diffs - 0.1.1 → 0.1.2 - Mend

erp-pro-ui 0.1.1 → 0.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (400) hide show

package/dist/chunks/splash-cursor-BVSmbcIX.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"splash-cursor-BVSmbcIX.cjs","names":[],"sources":["../../src/components/effects/splash-cursor/SplashCursor.tsx"],"sourcesContent":["import { useState, useEffect, useRef, useCallback } from \"react\";\nimport { motion, AnimatePresence } from \"framer-motion\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type { SplashCursorProps, Particle } from \"./types\";\n\nconst sizeConfig = {\n sm: { base: 20, variance: 10 },\n md: { base: 40, variance: 20 },\n lg: { base: 60, variance: 30 },\n xl: { base: 100, variance: 50 },\n};\n\nconst defaultColors = [\n \"var(--ds-color-accent)\",\n \"var(--ds-color-accent-hover)\",\n \"var(--ds-color-info)\",\n \"var(--ds-color-success)\",\n \"var(--ds-color-warning)\",\n \"var(--ds-color-danger)\",\n];\n\nexport const SplashCursor = ({\n className,\n color,\n secondaryColor,\n size = \"md\",\n particleCount = 12,\n enabled = true,\n blur = 0,\n opacity = 0.6,\n duration = 800,\n smooth = true,\n smoothFactor = 0.15,\n style,\n children,\n variant = \"splash\",\n}: SplashCursorProps) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const [particles, setParticles] = useState<Particle[]>([]);\n const [mousePos, setMousePos] = useState({ x: 0, y: 0 });\n const [smoothPos, setSmoothPos] = useState({ x: 0, y: 0 });\n const [isInside, setIsInside] = useState(false);\n const particleIdRef = useRef<number>(0);\n const animationFrameRef = useRef<number | undefined>(undefined);\n\n // Smooth cursor following\n useEffect(() => {\n if (!smooth || !enabled) return;\n\n const animate = () => {\n setSmoothPos((prev) => ({\n x: prev.x + (mousePos.x - prev.x) * smoothFactor,\n y: prev.y + (mousePos.y - prev.y) * smoothFactor,\n }));\n animationFrameRef.current = requestAnimationFrame(animate);\n };\n\n animationFrameRef.current = requestAnimationFrame(animate);\n return () => {\n if (animationFrameRef.current) {\n cancelAnimationFrame(animationFrameRef.current);\n }\n };\n }, [mousePos, smooth, smoothFactor, enabled]);\n\n const getRandomColor = useCallback(() => {\n if (color && secondaryColor) {\n return Math.random() > 0.5 ? color : secondaryColor;\n }\n if (color) return color;\n return defaultColors[Math.floor(Math.random() * defaultColors.length)];\n }, [color, secondaryColor]);\n\n const createParticles = useCallback(\n (x: number, y: number) => {\n const config = sizeConfig[size];\n const newParticles: Particle[] = [];\n\n for (let i = 0; i < particleCount; i++) {\n const angle = (Math.PI * 2 * i) / particleCount;\n const distance =\n variant === \"ripple\" ? config.base : Math.random() * config.variance;\n\n newParticles.push({\n id: particleIdRef.current++,\n x: x + Math.cos(angle) * distance * (variant === \"ripple\" ? 0 : 1),\n y: y + Math.sin(angle) * distance * (variant === \"ripple\" ? 0 : 1),\n size: config.base * 0.3 + Math.random() * config.base * 0.4,\n opacity: opacity * (0.5 + Math.random() * 0.5),\n color: getRandomColor(),\n });\n }\n\n setParticles((prev) => [...prev.slice(-50), ...newParticles]);\n\n // Remove particles after animation\n setTimeout(() => {\n setParticles((prev) =>\n prev.filter((p) => !newParticles.find((np) => np.id === p.id)),\n );\n }, duration);\n },\n [size, particleCount, opacity, duration, getRandomColor, variant],\n );\n\n const handleMouseMove = useCallback(\n (e: React.MouseEvent<HTMLDivElement>) => {\n if (!enabled || !containerRef.current) return;\n\n const rect = containerRef.current.getBoundingClientRect();\n const x = e.clientX - rect.left;\n const y = e.clientY - rect.top;\n\n setMousePos({ x, y });\n\n // Create splash effect on movement\n if (variant === \"splash\" || variant === \"trail\") {\n if (Math.random() > (variant === \"trail\" ? 0.7 : 0.85)) {\n createParticles(x, y);\n }\n }\n },\n [enabled, createParticles, variant],\n );\n\n const handleClick = useCallback(\n (e: React.MouseEvent<HTMLDivElement>) => {\n if (!enabled || !containerRef.current) return;\n\n const rect = containerRef.current.getBoundingClientRect();\n const x = e.clientX - rect.left;\n const y = e.clientY - rect.top;\n\n // Create burst effect on click\n createParticles(x, y);\n if (variant === \"ripple\") {\n setTimeout(() => createParticles(x, y), 100);\n setTimeout(() => createParticles(x, y), 200);\n }\n },\n [enabled, createParticles, variant],\n );\n\n const getParticleAnimation = (particle: Particle) => {\n const config = sizeConfig[size];\n\n switch (variant) {\n case \"glow\":\n return {\n initial: { scale: 0, opacity: particle.opacity },\n animate: { scale: 2, opacity: 0 },\n exit: { scale: 3, opacity: 0 },\n };\n case \"trail\":\n return {\n initial: { scale: 1, opacity: particle.opacity, y: 0 },\n animate: { scale: 0.5, opacity: 0, y: 20 },\n exit: { scale: 0, opacity: 0 },\n };\n case \"ripple\":\n return {\n initial: { scale: 0, opacity: particle.opacity },\n animate: { scale: 4, opacity: 0 },\n exit: { scale: 5, opacity: 0 },\n };\n default: // splash\n const angle = Math.random() * Math.PI * 2;\n const distance = config.base + Math.random() * config.variance;\n return {\n initial: { scale: 0, opacity: particle.opacity, x: 0, y: 0 },\n animate: {\n scale: [0, 1.2, 0.8],\n opacity: [particle.opacity, particle.opacity * 0.8, 0],\n x: Math.cos(angle) * distance,\n y: Math.sin(angle) * distance,\n },\n exit: { scale: 0, opacity: 0 },\n };\n }\n };\n\n const cursorPos = smooth ? smoothPos : mousePos;\n const glowColor =\n color && secondaryColor\n ? `color-mix(in srgb, ${color} 60%, ${secondaryColor})`\n : color\n ? `color-mix(in srgb, ${color} 35%, transparent)`\n : \"color-mix(in srgb, var(--ds-color-accent) 35%, transparent)\";\n\n return (\n <div\n ref={containerRef}\n className={mergeClassNames(\"relative overflow-hidden\", className)}\n style={style}\n onMouseMove={handleMouseMove}\n onMouseEnter={() => setIsInside(true)}\n onMouseLeave={() => setIsInside(false)}\n onClick={handleClick}\n >\n {/* Cursor glow effect */}\n {enabled && isInside && variant === \"glow\" && (\n <motion.div\n className=\"pointer-events-none absolute z-10\"\n style={{\n left: cursorPos.x,\n top: cursorPos.y,\n width: sizeConfig[size].base * 2,\n height: sizeConfig[size].base * 2,\n transform: \"translate(-50%, -50%)\",\n background: `radial-gradient(circle, ${glowColor} 0%, transparent 70%)`,\n filter: blur ? `blur(${blur}px)` : undefined,\n }}\n initial={{ scale: 0, opacity: 0 }}\n animate={{ scale: 1, opacity: 1 }}\n exit={{ scale: 0, opacity: 0 }}\n />\n )}\n\n {/* Particles */}\n <AnimatePresence>\n {enabled &&\n particles.map((particle) => {\n const animation = getParticleAnimation(particle);\n return (\n <motion.div\n key={particle.id}\n className=\"pointer-events-none absolute rounded-full z-20\"\n style={{\n left: particle.x,\n top: particle.y,\n width: particle.size,\n height: particle.size,\n backgroundColor: particle.color,\n transform: \"translate(-50%, -50%)\",\n filter: blur ? `blur(${blur}px)` : undefined,\n }}\n {...animation}\n transition={{\n duration: duration / 1000,\n ease: \"easeOut\",\n }}\n />\n );\n })}\n </AnimatePresence>\n\n {/* Children content */}\n <div className=\"relative z-0\">{children}</div>\n </div>\n );\n};\n\nSplashCursor.displayName = \"SplashCursor\";\n\nexport default SplashCursor;\n"],"mappings":"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"}

package/dist/chunks/{splash-cursor-9BsoQZl0.mjs → splash-cursor-rSrTnawZ.mjs} RENAMED Viewed

@@ -22,12 +22,12 @@ var sizeConfig = {
 	}
 };
 var defaultColors = [
-	"#7367f0",
-	"#9b87f5",
-	"#6366f1",
-	"#8b5cf6",
-	"#a78bfa",
-	"#c4b5fd"
+	"var(--ds-color-accent)",
+	"var(--ds-color-accent-hover)",
+	"var(--ds-color-info)",
+	"var(--ds-color-success)",
+	"var(--ds-color-warning)",
+	"var(--ds-color-danger)"
 ];
 var SplashCursor = ({ className, color, secondaryColor, size = "md", particleCount = 12, enabled = true, blur = 0, opacity = .6, duration = 800, smooth = true, smoothFactor = .15, style, children, variant = "splash" }) => {
 	const containerRef = useRef(null);
@@ -205,6 +205,7 @@ var SplashCursor = ({ className, color, secondaryColor, size = "md", particleCou
 		}
 	};
 	const cursorPos = smooth ? smoothPos : mousePos;
+	const glowColor = color && secondaryColor ? `color-mix(in srgb, ${color} 60%, ${secondaryColor})` : color ? `color-mix(in srgb, ${color} 35%, transparent)` : "color-mix(in srgb, var(--ds-color-accent) 35%, transparent)";
 	return /* @__PURE__ */ jsxs("div", {
 		ref: containerRef,
 		className: mergeClassNames("relative overflow-hidden", className),
@@ -222,7 +223,7 @@ var SplashCursor = ({ className, color, secondaryColor, size = "md", particleCou
 					width: sizeConfig[size].base * 2,
 					height: sizeConfig[size].base * 2,
 					transform: "translate(-50%, -50%)",
-					background: `radial-gradient(circle, ${color || defaultColors[0]}40 0%, transparent 70%)`,
+					background: `radial-gradient(circle, ${glowColor} 0%, transparent 70%)`,
 					filter: blur ? `blur(${blur}px)` : void 0
 				},
 				initial: {
@@ -269,4 +270,4 @@ SplashCursor.displayName = "SplashCursor";
 //#endregion
 export { SplashCursor as t };
-//# sourceMappingURL=splash-cursor-9BsoQZl0.mjs.map
+//# sourceMappingURL=splash-cursor-rSrTnawZ.mjs.map

package/dist/chunks/splash-cursor-rSrTnawZ.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"splash-cursor-rSrTnawZ.mjs","names":[],"sources":["../../src/components/effects/splash-cursor/SplashCursor.tsx"],"sourcesContent":["import { useState, useEffect, useRef, useCallback } from \"react\";\nimport { motion, AnimatePresence } from \"framer-motion\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type { SplashCursorProps, Particle } from \"./types\";\n\nconst sizeConfig = {\n sm: { base: 20, variance: 10 },\n md: { base: 40, variance: 20 },\n lg: { base: 60, variance: 30 },\n xl: { base: 100, variance: 50 },\n};\n\nconst defaultColors = [\n \"var(--ds-color-accent)\",\n \"var(--ds-color-accent-hover)\",\n \"var(--ds-color-info)\",\n \"var(--ds-color-success)\",\n \"var(--ds-color-warning)\",\n \"var(--ds-color-danger)\",\n];\n\nexport const SplashCursor = ({\n className,\n color,\n secondaryColor,\n size = \"md\",\n particleCount = 12,\n enabled = true,\n blur = 0,\n opacity = 0.6,\n duration = 800,\n smooth = true,\n smoothFactor = 0.15,\n style,\n children,\n variant = \"splash\",\n}: SplashCursorProps) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const [particles, setParticles] = useState<Particle[]>([]);\n const [mousePos, setMousePos] = useState({ x: 0, y: 0 });\n const [smoothPos, setSmoothPos] = useState({ x: 0, y: 0 });\n const [isInside, setIsInside] = useState(false);\n const particleIdRef = useRef<number>(0);\n const animationFrameRef = useRef<number | undefined>(undefined);\n\n // Smooth cursor following\n useEffect(() => {\n if (!smooth || !enabled) return;\n\n const animate = () => {\n setSmoothPos((prev) => ({\n x: prev.x + (mousePos.x - prev.x) * smoothFactor,\n y: prev.y + (mousePos.y - prev.y) * smoothFactor,\n }));\n animationFrameRef.current = requestAnimationFrame(animate);\n };\n\n animationFrameRef.current = requestAnimationFrame(animate);\n return () => {\n if (animationFrameRef.current) {\n cancelAnimationFrame(animationFrameRef.current);\n }\n };\n }, [mousePos, smooth, smoothFactor, enabled]);\n\n const getRandomColor = useCallback(() => {\n if (color && secondaryColor) {\n return Math.random() > 0.5 ? color : secondaryColor;\n }\n if (color) return color;\n return defaultColors[Math.floor(Math.random() * defaultColors.length)];\n }, [color, secondaryColor]);\n\n const createParticles = useCallback(\n (x: number, y: number) => {\n const config = sizeConfig[size];\n const newParticles: Particle[] = [];\n\n for (let i = 0; i < particleCount; i++) {\n const angle = (Math.PI * 2 * i) / particleCount;\n const distance =\n variant === \"ripple\" ? config.base : Math.random() * config.variance;\n\n newParticles.push({\n id: particleIdRef.current++,\n x: x + Math.cos(angle) * distance * (variant === \"ripple\" ? 0 : 1),\n y: y + Math.sin(angle) * distance * (variant === \"ripple\" ? 0 : 1),\n size: config.base * 0.3 + Math.random() * config.base * 0.4,\n opacity: opacity * (0.5 + Math.random() * 0.5),\n color: getRandomColor(),\n });\n }\n\n setParticles((prev) => [...prev.slice(-50), ...newParticles]);\n\n // Remove particles after animation\n setTimeout(() => {\n setParticles((prev) =>\n prev.filter((p) => !newParticles.find((np) => np.id === p.id)),\n );\n }, duration);\n },\n [size, particleCount, opacity, duration, getRandomColor, variant],\n );\n\n const handleMouseMove = useCallback(\n (e: React.MouseEvent<HTMLDivElement>) => {\n if (!enabled || !containerRef.current) return;\n\n const rect = containerRef.current.getBoundingClientRect();\n const x = e.clientX - rect.left;\n const y = e.clientY - rect.top;\n\n setMousePos({ x, y });\n\n // Create splash effect on movement\n if (variant === \"splash\" || variant === \"trail\") {\n if (Math.random() > (variant === \"trail\" ? 0.7 : 0.85)) {\n createParticles(x, y);\n }\n }\n },\n [enabled, createParticles, variant],\n );\n\n const handleClick = useCallback(\n (e: React.MouseEvent<HTMLDivElement>) => {\n if (!enabled || !containerRef.current) return;\n\n const rect = containerRef.current.getBoundingClientRect();\n const x = e.clientX - rect.left;\n const y = e.clientY - rect.top;\n\n // Create burst effect on click\n createParticles(x, y);\n if (variant === \"ripple\") {\n setTimeout(() => createParticles(x, y), 100);\n setTimeout(() => createParticles(x, y), 200);\n }\n },\n [enabled, createParticles, variant],\n );\n\n const getParticleAnimation = (particle: Particle) => {\n const config = sizeConfig[size];\n\n switch (variant) {\n case \"glow\":\n return {\n initial: { scale: 0, opacity: particle.opacity },\n animate: { scale: 2, opacity: 0 },\n exit: { scale: 3, opacity: 0 },\n };\n case \"trail\":\n return {\n initial: { scale: 1, opacity: particle.opacity, y: 0 },\n animate: { scale: 0.5, opacity: 0, y: 20 },\n exit: { scale: 0, opacity: 0 },\n };\n case \"ripple\":\n return {\n initial: { scale: 0, opacity: particle.opacity },\n animate: { scale: 4, opacity: 0 },\n exit: { scale: 5, opacity: 0 },\n };\n default: // splash\n const angle = Math.random() * Math.PI * 2;\n const distance = config.base + Math.random() * config.variance;\n return {\n initial: { scale: 0, opacity: particle.opacity, x: 0, y: 0 },\n animate: {\n scale: [0, 1.2, 0.8],\n opacity: [particle.opacity, particle.opacity * 0.8, 0],\n x: Math.cos(angle) * distance,\n y: Math.sin(angle) * distance,\n },\n exit: { scale: 0, opacity: 0 },\n };\n }\n };\n\n const cursorPos = smooth ? smoothPos : mousePos;\n const glowColor =\n color && secondaryColor\n ? `color-mix(in srgb, ${color} 60%, ${secondaryColor})`\n : color\n ? `color-mix(in srgb, ${color} 35%, transparent)`\n : \"color-mix(in srgb, var(--ds-color-accent) 35%, transparent)\";\n\n return (\n <div\n ref={containerRef}\n className={mergeClassNames(\"relative overflow-hidden\", className)}\n style={style}\n onMouseMove={handleMouseMove}\n onMouseEnter={() => setIsInside(true)}\n onMouseLeave={() => setIsInside(false)}\n onClick={handleClick}\n >\n {/* Cursor glow effect */}\n {enabled && isInside && variant === \"glow\" && (\n <motion.div\n className=\"pointer-events-none absolute z-10\"\n style={{\n left: cursorPos.x,\n top: cursorPos.y,\n width: sizeConfig[size].base * 2,\n height: sizeConfig[size].base * 2,\n transform: \"translate(-50%, -50%)\",\n background: `radial-gradient(circle, ${glowColor} 0%, transparent 70%)`,\n filter: blur ? `blur(${blur}px)` : undefined,\n }}\n initial={{ scale: 0, opacity: 0 }}\n animate={{ scale: 1, opacity: 1 }}\n exit={{ scale: 0, opacity: 0 }}\n />\n )}\n\n {/* Particles */}\n <AnimatePresence>\n {enabled &&\n particles.map((particle) => {\n const animation = getParticleAnimation(particle);\n return (\n <motion.div\n key={particle.id}\n className=\"pointer-events-none absolute rounded-full z-20\"\n style={{\n left: particle.x,\n top: particle.y,\n width: particle.size,\n height: particle.size,\n backgroundColor: particle.color,\n transform: \"translate(-50%, -50%)\",\n filter: blur ? `blur(${blur}px)` : undefined,\n }}\n {...animation}\n transition={{\n duration: duration / 1000,\n ease: \"easeOut\",\n }}\n />\n );\n })}\n </AnimatePresence>\n\n {/* Children content */}\n <div className=\"relative z-0\">{children}</div>\n </div>\n );\n};\n\nSplashCursor.displayName = \"SplashCursor\";\n\nexport default SplashCursor;\n"],"mappings":"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"}

package/dist/chunks/{spotlight-card-Bl0aXnT4.mjs → spotlight-card-BpZLMOp6.mjs} RENAMED Viewed

@@ -101,4 +101,4 @@ SpotlightCard.displayName = "SpotlightCard";
 //#endregion
 export { SpotlightCard as t };
-//# sourceMappingURL=spotlight-card-Bl0aXnT4.mjs.map
+//# sourceMappingURL=spotlight-card-BpZLMOp6.mjs.map

package/dist/chunks/{spotlight-card-Bl0aXnT4.mjs.map → spotlight-card-BpZLMOp6.mjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"spotlight-card-~~Bl0aXnT4~~.mjs","names":[],"sources":["../../src/components/effects/spotlight-card/SpotlightCard.tsx"],"sourcesContent":["import { useState, useRef } from \"react\";\nimport { motion } from \"framer-motion\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type { SpotlightCardProps } from \"./types\";\n\nconst borderRadiusMap = {\n sm: \"rounded-sm\",\n md: \"rounded-md\",\n lg: \"rounded-lg\",\n xl: \"rounded-xl\",\n \"2xl\": \"rounded-2xl\",\n full: \"rounded-full\",\n};\n\nconst paddingMap = {\n none: \"\",\n sm: \"p-3\",\n md: \"p-5\",\n lg: \"p-7\",\n xl: \"p-10\",\n};\n\nconst variantStyles = {\n glass: `\n bg-white/60 dark:bg-neutral-900/50\n backdrop-blur-2xl\n border border-white/40 dark:border-white/10\n shadow-xl shadow-neutral-200/30 dark:shadow-neutral-950/50\n `,\n solid: `\n bg-white dark:bg-neutral-900\n border border-neutral-200 dark:border-neutral-800\n shadow-lg shadow-neutral-200/50 dark:shadow-neutral-950/50\n `,\n outlined: `\n bg-transparent\n border-2 border-neutral-200 dark:border-neutral-700\n `,\n};\n\nexport const SpotlightCard = ({\n children,\n className,\n spotlightColor = \"rgba(115, 103, 240, 0.15)\",\n spotlightSize = 350,\n spotlightEnabled = true,\n variant = \"glass\",\n borderRadius = \"xl\",\n padding = \"md\",\n hoverScale = true,\n style,\n onClick,\n}: SpotlightCardProps) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const [mousePosition, setMousePosition] = useState({ x: 0, y: 0 });\n const [isHovered, setIsHovered] = useState(false);\n\n const handleMouseMove = (e: React.MouseEvent<HTMLDivElement>) => {\n if (!containerRef.current \|\| !spotlightEnabled) return;\n const rect = containerRef.current.getBoundingClientRect();\n setMousePosition({\n x: e.clientX - rect.left,\n y: e.clientY - rect.top,\n });\n };\n\n const handleMouseEnter = () => {\n setIsHovered(true);\n };\n\n const handleMouseLeave = () => {\n setIsHovered(false);\n };\n\n const spotlightStyle =\n spotlightEnabled && isHovered\n ? {\n background: `radial-gradient(${spotlightSize}px circle at ${mousePosition.x}px ${mousePosition.y}px, ${spotlightColor}, transparent 80%)`,\n }\n : {};\n\n return (\n <motion.div\n ref={containerRef}\n className={mergeClassNames(\n \"relative overflow-hidden transition-all duration-300\",\n borderRadiusMap[borderRadius],\n paddingMap[padding],\n variantStyles[variant],\n onClick && \"cursor-pointer\",\n className,\n )}\n style={style}\n onMouseMove={handleMouseMove}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onClick={onClick}\n whileHover={hoverScale ? { scale: 1.02 } : undefined}\n whileTap={onClick ? { scale: 0.98 } : undefined}\n transition={{ type: \"spring\", stiffness: 400, damping: 25 }}\n >\n {/* Spotlight overlay /}\n {spotlightEnabled && (\n <motion.div\n className=\"pointer-events-none absolute inset-0 z-0\"\n style={spotlightStyle}\n initial={{ opacity: 0 }}\n animate={{ opacity: isHovered ? 1 : 0 }}\n transition={{ duration: 0.3 }}\n />\n )}\n\n {/ Border glow effect /}\n {spotlightEnabled && isHovered && (\n <motion.div\n className={mergeClassNames(\n \"pointer-events-none absolute inset-0 z-0\",\n borderRadiusMap[borderRadius],\n )}\n style={{\n background: `radial-gradient(${spotlightSize 0.6}px circle at ${mousePosition.x}px ${mousePosition.y}px, ${spotlightColor.replace(\"0.15\", \"0.3\")}, transparent 70%)`,\n filter: \"blur(20px)\",\n }}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ duration: 0.2 }}\n />\n )}\n\n {/* Content */}\n <div className=\"relative z-10\">{children}</div>\n </motion.div>\n );\n};\n\nSpotlightCard.displayName = \"SpotlightCard\";\n\nexport default SpotlightCard;\n"],"mappings":";;;;;AAKA,IAAM,kBAAkB;CACtB,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,OAAO;CACP,MAAM;CACP;AAED,IAAM,aAAa;CACjB,MAAM;CACN,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL;AAED,IAAM,gBAAgB;CACpB,OAAO;;;;;;CAMP,OAAO;;;;;CAKP,UAAU;;;;CAIX;AAED,IAAa,iBAAiB,EAC5B,UACA,WACA,iBAAiB,6BACjB,gBAAgB,KAChB,mBAAmB,MACnB,UAAU,SACV,eAAe,MACf,UAAU,MACV,aAAa,MACb,OACA,cACwB;CACxB,MAAM,eAAe,OAAuB,KAAK;CACjD,MAAM,CAAC,eAAe,oBAAoB,SAAS;EAAE,GAAG;EAAG,GAAG;EAAG,CAAC;CAClE,MAAM,CAAC,WAAW,gBAAgB,SAAS,MAAM;CAEjD,MAAM,mBAAmB,MAAwC;AAC/D,MAAI,CAAC,aAAa,WAAW,CAAC,iBAAkB;EAChD,MAAM,OAAO,aAAa,QAAQ,uBAAuB;AACzD,mBAAiB;GACf,GAAG,EAAE,UAAU,KAAK;GACpB,GAAG,EAAE,UAAU,KAAK;GACrB,CAAC;;CAGJ,MAAM,yBAAyB;AAC7B,eAAa,KAAK;;CAGpB,MAAM,yBAAyB;AAC7B,eAAa,MAAM;;CAGrB,MAAM,iBACJ,oBAAoB,YAChB,EACE,YAAY,mBAAmB,cAAc,eAAe,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,qBACvH,GACD,EAAE;AAER,QACE,qBAAC,OAAO,KAAR;EACE,KAAK;EACL,WAAW,gBACT,wDACA,gBAAgB,eAChB,WAAW,UACX,cAAc,UACd,WAAW,kBACX,UACD;EACM;EACP,aAAa;EACb,cAAc;EACd,cAAc;EACL;EACT,YAAY,aAAa,EAAE,OAAO,MAAM,GAAG,KAAA;EAC3C,UAAU,UAAU,EAAE,OAAO,KAAM,GAAG,KAAA;EACtC,YAAY;GAAE,MAAM;GAAU,WAAW;GAAK,SAAS;GAAI;YAjB7D;GAoBG,oBACC,oBAAC,OAAO,KAAR;IACE,WAAU;IACV,OAAO;IACP,SAAS,EAAE,SAAS,GAAG;IACvB,SAAS,EAAE,SAAS,YAAY,IAAI,GAAG;IACvC,YAAY,EAAE,UAAU,IAAK;IAC7B,CAAA;GAIH,oBAAoB,aACnB,oBAAC,OAAO,KAAR;IACE,WAAW,gBACT,4CACA,gBAAgB,cACjB;IACD,OAAO;KACL,YAAY,mBAAmB,gBAAgB,GAAI,eAAe,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,QAAQ,QAAQ,MAAM,CAAC;KACnJ,QAAQ;KACT;IACD,SAAS,EAAE,SAAS,GAAG;IACvB,SAAS,EAAE,SAAS,GAAG;IACvB,YAAY,EAAE,UAAU,IAAK;IAC7B,CAAA;GAIJ,oBAAC,OAAD;IAAK,WAAU;IAAiB;IAAe,CAAA;GACpC;;;AAIjB,cAAc,cAAc"}
1	+ {"version":3,"file":"spotlight-card-BpZLMOp6.mjs","names":[],"sources":["../../src/components/effects/spotlight-card/SpotlightCard.tsx"],"sourcesContent":["import { useState, useRef } from \"react\";\nimport { motion } from \"framer-motion\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type { SpotlightCardProps } from \"./types\";\n\nconst borderRadiusMap = {\n sm: \"rounded-sm\",\n md: \"rounded-md\",\n lg: \"rounded-lg\",\n xl: \"rounded-xl\",\n \"2xl\": \"rounded-2xl\",\n full: \"rounded-full\",\n};\n\nconst paddingMap = {\n none: \"\",\n sm: \"p-3\",\n md: \"p-5\",\n lg: \"p-7\",\n xl: \"p-10\",\n};\n\nconst variantStyles = {\n glass: `\n bg-white/60 dark:bg-neutral-900/50\n backdrop-blur-2xl\n border border-white/40 dark:border-white/10\n shadow-xl shadow-neutral-200/30 dark:shadow-neutral-950/50\n `,\n solid: `\n bg-white dark:bg-neutral-900\n border border-neutral-200 dark:border-neutral-800\n shadow-lg shadow-neutral-200/50 dark:shadow-neutral-950/50\n `,\n outlined: `\n bg-transparent\n border-2 border-neutral-200 dark:border-neutral-700\n `,\n};\n\nexport const SpotlightCard = ({\n children,\n className,\n spotlightColor = \"rgba(115, 103, 240, 0.15)\",\n spotlightSize = 350,\n spotlightEnabled = true,\n variant = \"glass\",\n borderRadius = \"xl\",\n padding = \"md\",\n hoverScale = true,\n style,\n onClick,\n}: SpotlightCardProps) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const [mousePosition, setMousePosition] = useState({ x: 0, y: 0 });\n const [isHovered, setIsHovered] = useState(false);\n\n const handleMouseMove = (e: React.MouseEvent<HTMLDivElement>) => {\n if (!containerRef.current \|\| !spotlightEnabled) return;\n const rect = containerRef.current.getBoundingClientRect();\n setMousePosition({\n x: e.clientX - rect.left,\n y: e.clientY - rect.top,\n });\n };\n\n const handleMouseEnter = () => {\n setIsHovered(true);\n };\n\n const handleMouseLeave = () => {\n setIsHovered(false);\n };\n\n const spotlightStyle =\n spotlightEnabled && isHovered\n ? {\n background: `radial-gradient(${spotlightSize}px circle at ${mousePosition.x}px ${mousePosition.y}px, ${spotlightColor}, transparent 80%)`,\n }\n : {};\n\n return (\n <motion.div\n ref={containerRef}\n className={mergeClassNames(\n \"relative overflow-hidden transition-all duration-300\",\n borderRadiusMap[borderRadius],\n paddingMap[padding],\n variantStyles[variant],\n onClick && \"cursor-pointer\",\n className,\n )}\n style={style}\n onMouseMove={handleMouseMove}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onClick={onClick}\n whileHover={hoverScale ? { scale: 1.02 } : undefined}\n whileTap={onClick ? { scale: 0.98 } : undefined}\n transition={{ type: \"spring\", stiffness: 400, damping: 25 }}\n >\n {/* Spotlight overlay /}\n {spotlightEnabled && (\n <motion.div\n className=\"pointer-events-none absolute inset-0 z-0\"\n style={spotlightStyle}\n initial={{ opacity: 0 }}\n animate={{ opacity: isHovered ? 1 : 0 }}\n transition={{ duration: 0.3 }}\n />\n )}\n\n {/ Border glow effect /}\n {spotlightEnabled && isHovered && (\n <motion.div\n className={mergeClassNames(\n \"pointer-events-none absolute inset-0 z-0\",\n borderRadiusMap[borderRadius],\n )}\n style={{\n background: `radial-gradient(${spotlightSize 0.6}px circle at ${mousePosition.x}px ${mousePosition.y}px, ${spotlightColor.replace(\"0.15\", \"0.3\")}, transparent 70%)`,\n filter: \"blur(20px)\",\n }}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ duration: 0.2 }}\n />\n )}\n\n {/* Content */}\n <div className=\"relative z-10\">{children}</div>\n </motion.div>\n );\n};\n\nSpotlightCard.displayName = \"SpotlightCard\";\n\nexport default SpotlightCard;\n"],"mappings":";;;;;AAKA,IAAM,kBAAkB;CACtB,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,OAAO;CACP,MAAM;CACP;AAED,IAAM,aAAa;CACjB,MAAM;CACN,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL;AAED,IAAM,gBAAgB;CACpB,OAAO;;;;;;CAMP,OAAO;;;;;CAKP,UAAU;;;;CAIX;AAED,IAAa,iBAAiB,EAC5B,UACA,WACA,iBAAiB,6BACjB,gBAAgB,KAChB,mBAAmB,MACnB,UAAU,SACV,eAAe,MACf,UAAU,MACV,aAAa,MACb,OACA,cACwB;CACxB,MAAM,eAAe,OAAuB,KAAK;CACjD,MAAM,CAAC,eAAe,oBAAoB,SAAS;EAAE,GAAG;EAAG,GAAG;EAAG,CAAC;CAClE,MAAM,CAAC,WAAW,gBAAgB,SAAS,MAAM;CAEjD,MAAM,mBAAmB,MAAwC;AAC/D,MAAI,CAAC,aAAa,WAAW,CAAC,iBAAkB;EAChD,MAAM,OAAO,aAAa,QAAQ,uBAAuB;AACzD,mBAAiB;GACf,GAAG,EAAE,UAAU,KAAK;GACpB,GAAG,EAAE,UAAU,KAAK;GACrB,CAAC;;CAGJ,MAAM,yBAAyB;AAC7B,eAAa,KAAK;;CAGpB,MAAM,yBAAyB;AAC7B,eAAa,MAAM;;CAGrB,MAAM,iBACJ,oBAAoB,YAChB,EACE,YAAY,mBAAmB,cAAc,eAAe,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,qBACvH,GACD,EAAE;AAER,QACE,qBAAC,OAAO,KAAR;EACE,KAAK;EACL,WAAW,gBACT,wDACA,gBAAgB,eAChB,WAAW,UACX,cAAc,UACd,WAAW,kBACX,UACD;EACM;EACP,aAAa;EACb,cAAc;EACd,cAAc;EACL;EACT,YAAY,aAAa,EAAE,OAAO,MAAM,GAAG,KAAA;EAC3C,UAAU,UAAU,EAAE,OAAO,KAAM,GAAG,KAAA;EACtC,YAAY;GAAE,MAAM;GAAU,WAAW;GAAK,SAAS;GAAI;YAjB7D;GAoBG,oBACC,oBAAC,OAAO,KAAR;IACE,WAAU;IACV,OAAO;IACP,SAAS,EAAE,SAAS,GAAG;IACvB,SAAS,EAAE,SAAS,YAAY,IAAI,GAAG;IACvC,YAAY,EAAE,UAAU,IAAK;IAC7B,CAAA;GAIH,oBAAoB,aACnB,oBAAC,OAAO,KAAR;IACE,WAAW,gBACT,4CACA,gBAAgB,cACjB;IACD,OAAO;KACL,YAAY,mBAAmB,gBAAgB,GAAI,eAAe,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,QAAQ,QAAQ,MAAM,CAAC;KACnJ,QAAQ;KACT;IACD,SAAS,EAAE,SAAS,GAAG;IACvB,SAAS,EAAE,SAAS,GAAG;IACvB,YAAY,EAAE,UAAU,IAAK;IAC7B,CAAA;GAIJ,oBAAC,OAAD;IAAK,WAAU;IAAiB;IAAe,CAAA;GACpC;;;AAIjB,cAAc,cAAc"}

package/dist/chunks/{spotlight-card-SUhrgstF.cjs → spotlight-card-DS1dy1W3.cjs} RENAMED Viewed

@@ -107,4 +107,4 @@ Object.defineProperty(exports, "SpotlightCard", {
 	}
 });
-//# sourceMappingURL=spotlight-card-SUhrgstF.cjs.map
+//# sourceMappingURL=spotlight-card-DS1dy1W3.cjs.map

package/dist/chunks/{spotlight-card-SUhrgstF.cjs.map → spotlight-card-DS1dy1W3.cjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"spotlight-card-~~SUhrgstF~~.cjs","names":[],"sources":["../../src/components/effects/spotlight-card/SpotlightCard.tsx"],"sourcesContent":["import { useState, useRef } from \"react\";\nimport { motion } from \"framer-motion\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type { SpotlightCardProps } from \"./types\";\n\nconst borderRadiusMap = {\n sm: \"rounded-sm\",\n md: \"rounded-md\",\n lg: \"rounded-lg\",\n xl: \"rounded-xl\",\n \"2xl\": \"rounded-2xl\",\n full: \"rounded-full\",\n};\n\nconst paddingMap = {\n none: \"\",\n sm: \"p-3\",\n md: \"p-5\",\n lg: \"p-7\",\n xl: \"p-10\",\n};\n\nconst variantStyles = {\n glass: `\n bg-white/60 dark:bg-neutral-900/50\n backdrop-blur-2xl\n border border-white/40 dark:border-white/10\n shadow-xl shadow-neutral-200/30 dark:shadow-neutral-950/50\n `,\n solid: `\n bg-white dark:bg-neutral-900\n border border-neutral-200 dark:border-neutral-800\n shadow-lg shadow-neutral-200/50 dark:shadow-neutral-950/50\n `,\n outlined: `\n bg-transparent\n border-2 border-neutral-200 dark:border-neutral-700\n `,\n};\n\nexport const SpotlightCard = ({\n children,\n className,\n spotlightColor = \"rgba(115, 103, 240, 0.15)\",\n spotlightSize = 350,\n spotlightEnabled = true,\n variant = \"glass\",\n borderRadius = \"xl\",\n padding = \"md\",\n hoverScale = true,\n style,\n onClick,\n}: SpotlightCardProps) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const [mousePosition, setMousePosition] = useState({ x: 0, y: 0 });\n const [isHovered, setIsHovered] = useState(false);\n\n const handleMouseMove = (e: React.MouseEvent<HTMLDivElement>) => {\n if (!containerRef.current \|\| !spotlightEnabled) return;\n const rect = containerRef.current.getBoundingClientRect();\n setMousePosition({\n x: e.clientX - rect.left,\n y: e.clientY - rect.top,\n });\n };\n\n const handleMouseEnter = () => {\n setIsHovered(true);\n };\n\n const handleMouseLeave = () => {\n setIsHovered(false);\n };\n\n const spotlightStyle =\n spotlightEnabled && isHovered\n ? {\n background: `radial-gradient(${spotlightSize}px circle at ${mousePosition.x}px ${mousePosition.y}px, ${spotlightColor}, transparent 80%)`,\n }\n : {};\n\n return (\n <motion.div\n ref={containerRef}\n className={mergeClassNames(\n \"relative overflow-hidden transition-all duration-300\",\n borderRadiusMap[borderRadius],\n paddingMap[padding],\n variantStyles[variant],\n onClick && \"cursor-pointer\",\n className,\n )}\n style={style}\n onMouseMove={handleMouseMove}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onClick={onClick}\n whileHover={hoverScale ? { scale: 1.02 } : undefined}\n whileTap={onClick ? { scale: 0.98 } : undefined}\n transition={{ type: \"spring\", stiffness: 400, damping: 25 }}\n >\n {/* Spotlight overlay /}\n {spotlightEnabled && (\n <motion.div\n className=\"pointer-events-none absolute inset-0 z-0\"\n style={spotlightStyle}\n initial={{ opacity: 0 }}\n animate={{ opacity: isHovered ? 1 : 0 }}\n transition={{ duration: 0.3 }}\n />\n )}\n\n {/ Border glow effect /}\n {spotlightEnabled && isHovered && (\n <motion.div\n className={mergeClassNames(\n \"pointer-events-none absolute inset-0 z-0\",\n borderRadiusMap[borderRadius],\n )}\n style={{\n background: `radial-gradient(${spotlightSize 0.6}px circle at ${mousePosition.x}px ${mousePosition.y}px, ${spotlightColor.replace(\"0.15\", \"0.3\")}, transparent 70%)`,\n filter: \"blur(20px)\",\n }}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ duration: 0.2 }}\n />\n )}\n\n {/* Content */}\n <div className=\"relative z-10\">{children}</div>\n </motion.div>\n );\n};\n\nSpotlightCard.displayName = \"SpotlightCard\";\n\nexport default SpotlightCard;\n"],"mappings":";;;;;;AAKA,IAAM,kBAAkB;CACtB,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,OAAO;CACP,MAAM;CACP;AAED,IAAM,aAAa;CACjB,MAAM;CACN,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL;AAED,IAAM,gBAAgB;CACpB,OAAO;;;;;;CAMP,OAAO;;;;;CAKP,UAAU;;;;CAIX;AAED,IAAa,iBAAiB,EAC5B,UACA,WACA,iBAAiB,6BACjB,gBAAgB,KAChB,mBAAmB,MACnB,UAAU,SACV,eAAe,MACf,UAAU,MACV,aAAa,MACb,OACA,cACwB;CACxB,MAAM,gBAAA,GAAA,MAAA,QAAsC,KAAK;CACjD,MAAM,CAAC,eAAe,qBAAA,GAAA,MAAA,UAA6B;EAAE,GAAG;EAAG,GAAG;EAAG,CAAC;CAClE,MAAM,CAAC,WAAW,iBAAA,GAAA,MAAA,UAAyB,MAAM;CAEjD,MAAM,mBAAmB,MAAwC;AAC/D,MAAI,CAAC,aAAa,WAAW,CAAC,iBAAkB;EAChD,MAAM,OAAO,aAAa,QAAQ,uBAAuB;AACzD,mBAAiB;GACf,GAAG,EAAE,UAAU,KAAK;GACpB,GAAG,EAAE,UAAU,KAAK;GACrB,CAAC;;CAGJ,MAAM,yBAAyB;AAC7B,eAAa,KAAK;;CAGpB,MAAM,yBAAyB;AAC7B,eAAa,MAAM;;CAGrB,MAAM,iBACJ,oBAAoB,YAChB,EACE,YAAY,mBAAmB,cAAc,eAAe,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,qBACvH,GACD,EAAE;AAER,QACE,iBAAA,GAAA,kBAAA,MAAC,cAAA,OAAO,KAAR;EACE,KAAK;EACL,WAAW,cAAA,gBACT,wDACA,gBAAgB,eAChB,WAAW,UACX,cAAc,UACd,WAAW,kBACX,UACD;EACM;EACP,aAAa;EACb,cAAc;EACd,cAAc;EACL;EACT,YAAY,aAAa,EAAE,OAAO,MAAM,GAAG,KAAA;EAC3C,UAAU,UAAU,EAAE,OAAO,KAAM,GAAG,KAAA;EACtC,YAAY;GAAE,MAAM;GAAU,WAAW;GAAK,SAAS;GAAI;YAjB7D;GAoBG,oBACC,iBAAA,GAAA,kBAAA,KAAC,cAAA,OAAO,KAAR;IACE,WAAU;IACV,OAAO;IACP,SAAS,EAAE,SAAS,GAAG;IACvB,SAAS,EAAE,SAAS,YAAY,IAAI,GAAG;IACvC,YAAY,EAAE,UAAU,IAAK;IAC7B,CAAA;GAIH,oBAAoB,aACnB,iBAAA,GAAA,kBAAA,KAAC,cAAA,OAAO,KAAR;IACE,WAAW,cAAA,gBACT,4CACA,gBAAgB,cACjB;IACD,OAAO;KACL,YAAY,mBAAmB,gBAAgB,GAAI,eAAe,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,QAAQ,QAAQ,MAAM,CAAC;KACnJ,QAAQ;KACT;IACD,SAAS,EAAE,SAAS,GAAG;IACvB,SAAS,EAAE,SAAS,GAAG;IACvB,YAAY,EAAE,UAAU,IAAK;IAC7B,CAAA;GAIJ,iBAAA,GAAA,kBAAA,KAAC,OAAD;IAAK,WAAU;IAAiB;IAAe,CAAA;GACpC;;;AAIjB,cAAc,cAAc"}
1	+ {"version":3,"file":"spotlight-card-DS1dy1W3.cjs","names":[],"sources":["../../src/components/effects/spotlight-card/SpotlightCard.tsx"],"sourcesContent":["import { useState, useRef } from \"react\";\nimport { motion } from \"framer-motion\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type { SpotlightCardProps } from \"./types\";\n\nconst borderRadiusMap = {\n sm: \"rounded-sm\",\n md: \"rounded-md\",\n lg: \"rounded-lg\",\n xl: \"rounded-xl\",\n \"2xl\": \"rounded-2xl\",\n full: \"rounded-full\",\n};\n\nconst paddingMap = {\n none: \"\",\n sm: \"p-3\",\n md: \"p-5\",\n lg: \"p-7\",\n xl: \"p-10\",\n};\n\nconst variantStyles = {\n glass: `\n bg-white/60 dark:bg-neutral-900/50\n backdrop-blur-2xl\n border border-white/40 dark:border-white/10\n shadow-xl shadow-neutral-200/30 dark:shadow-neutral-950/50\n `,\n solid: `\n bg-white dark:bg-neutral-900\n border border-neutral-200 dark:border-neutral-800\n shadow-lg shadow-neutral-200/50 dark:shadow-neutral-950/50\n `,\n outlined: `\n bg-transparent\n border-2 border-neutral-200 dark:border-neutral-700\n `,\n};\n\nexport const SpotlightCard = ({\n children,\n className,\n spotlightColor = \"rgba(115, 103, 240, 0.15)\",\n spotlightSize = 350,\n spotlightEnabled = true,\n variant = \"glass\",\n borderRadius = \"xl\",\n padding = \"md\",\n hoverScale = true,\n style,\n onClick,\n}: SpotlightCardProps) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const [mousePosition, setMousePosition] = useState({ x: 0, y: 0 });\n const [isHovered, setIsHovered] = useState(false);\n\n const handleMouseMove = (e: React.MouseEvent<HTMLDivElement>) => {\n if (!containerRef.current \|\| !spotlightEnabled) return;\n const rect = containerRef.current.getBoundingClientRect();\n setMousePosition({\n x: e.clientX - rect.left,\n y: e.clientY - rect.top,\n });\n };\n\n const handleMouseEnter = () => {\n setIsHovered(true);\n };\n\n const handleMouseLeave = () => {\n setIsHovered(false);\n };\n\n const spotlightStyle =\n spotlightEnabled && isHovered\n ? {\n background: `radial-gradient(${spotlightSize}px circle at ${mousePosition.x}px ${mousePosition.y}px, ${spotlightColor}, transparent 80%)`,\n }\n : {};\n\n return (\n <motion.div\n ref={containerRef}\n className={mergeClassNames(\n \"relative overflow-hidden transition-all duration-300\",\n borderRadiusMap[borderRadius],\n paddingMap[padding],\n variantStyles[variant],\n onClick && \"cursor-pointer\",\n className,\n )}\n style={style}\n onMouseMove={handleMouseMove}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onClick={onClick}\n whileHover={hoverScale ? { scale: 1.02 } : undefined}\n whileTap={onClick ? { scale: 0.98 } : undefined}\n transition={{ type: \"spring\", stiffness: 400, damping: 25 }}\n >\n {/* Spotlight overlay /}\n {spotlightEnabled && (\n <motion.div\n className=\"pointer-events-none absolute inset-0 z-0\"\n style={spotlightStyle}\n initial={{ opacity: 0 }}\n animate={{ opacity: isHovered ? 1 : 0 }}\n transition={{ duration: 0.3 }}\n />\n )}\n\n {/ Border glow effect /}\n {spotlightEnabled && isHovered && (\n <motion.div\n className={mergeClassNames(\n \"pointer-events-none absolute inset-0 z-0\",\n borderRadiusMap[borderRadius],\n )}\n style={{\n background: `radial-gradient(${spotlightSize 0.6}px circle at ${mousePosition.x}px ${mousePosition.y}px, ${spotlightColor.replace(\"0.15\", \"0.3\")}, transparent 70%)`,\n filter: \"blur(20px)\",\n }}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ duration: 0.2 }}\n />\n )}\n\n {/* Content */}\n <div className=\"relative z-10\">{children}</div>\n </motion.div>\n );\n};\n\nSpotlightCard.displayName = \"SpotlightCard\";\n\nexport default SpotlightCard;\n"],"mappings":";;;;;;AAKA,IAAM,kBAAkB;CACtB,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,OAAO;CACP,MAAM;CACP;AAED,IAAM,aAAa;CACjB,MAAM;CACN,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL;AAED,IAAM,gBAAgB;CACpB,OAAO;;;;;;CAMP,OAAO;;;;;CAKP,UAAU;;;;CAIX;AAED,IAAa,iBAAiB,EAC5B,UACA,WACA,iBAAiB,6BACjB,gBAAgB,KAChB,mBAAmB,MACnB,UAAU,SACV,eAAe,MACf,UAAU,MACV,aAAa,MACb,OACA,cACwB;CACxB,MAAM,gBAAA,GAAA,MAAA,QAAsC,KAAK;CACjD,MAAM,CAAC,eAAe,qBAAA,GAAA,MAAA,UAA6B;EAAE,GAAG;EAAG,GAAG;EAAG,CAAC;CAClE,MAAM,CAAC,WAAW,iBAAA,GAAA,MAAA,UAAyB,MAAM;CAEjD,MAAM,mBAAmB,MAAwC;AAC/D,MAAI,CAAC,aAAa,WAAW,CAAC,iBAAkB;EAChD,MAAM,OAAO,aAAa,QAAQ,uBAAuB;AACzD,mBAAiB;GACf,GAAG,EAAE,UAAU,KAAK;GACpB,GAAG,EAAE,UAAU,KAAK;GACrB,CAAC;;CAGJ,MAAM,yBAAyB;AAC7B,eAAa,KAAK;;CAGpB,MAAM,yBAAyB;AAC7B,eAAa,MAAM;;CAGrB,MAAM,iBACJ,oBAAoB,YAChB,EACE,YAAY,mBAAmB,cAAc,eAAe,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,qBACvH,GACD,EAAE;AAER,QACE,iBAAA,GAAA,kBAAA,MAAC,cAAA,OAAO,KAAR;EACE,KAAK;EACL,WAAW,cAAA,gBACT,wDACA,gBAAgB,eAChB,WAAW,UACX,cAAc,UACd,WAAW,kBACX,UACD;EACM;EACP,aAAa;EACb,cAAc;EACd,cAAc;EACL;EACT,YAAY,aAAa,EAAE,OAAO,MAAM,GAAG,KAAA;EAC3C,UAAU,UAAU,EAAE,OAAO,KAAM,GAAG,KAAA;EACtC,YAAY;GAAE,MAAM;GAAU,WAAW;GAAK,SAAS;GAAI;YAjB7D;GAoBG,oBACC,iBAAA,GAAA,kBAAA,KAAC,cAAA,OAAO,KAAR;IACE,WAAU;IACV,OAAO;IACP,SAAS,EAAE,SAAS,GAAG;IACvB,SAAS,EAAE,SAAS,YAAY,IAAI,GAAG;IACvC,YAAY,EAAE,UAAU,IAAK;IAC7B,CAAA;GAIH,oBAAoB,aACnB,iBAAA,GAAA,kBAAA,KAAC,cAAA,OAAO,KAAR;IACE,WAAW,cAAA,gBACT,4CACA,gBAAgB,cACjB;IACD,OAAO;KACL,YAAY,mBAAmB,gBAAgB,GAAI,eAAe,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,QAAQ,QAAQ,MAAM,CAAC;KACnJ,QAAQ;KACT;IACD,SAAS,EAAE,SAAS,GAAG;IACvB,SAAS,EAAE,SAAS,GAAG;IACvB,YAAY,EAAE,UAAU,IAAK;IAC7B,CAAA;GAIJ,iBAAA,GAAA,kBAAA,KAAC,OAAD;IAAK,WAAU;IAAiB;IAAe,CAAA;GACpC;;;AAIjB,cAAc,cAAc"}

package/dist/chunks/{stepper-uz8iRzlY.mjs → stepper-D4yQsQB0.mjs} RENAMED Viewed

@@ -1,5 +1,5 @@
 import { n as mergeClassNames } from "./utils-ati1KkDb.mjs";
-import { U as CloseIcon, W as CheckIcon } from "./icons-CrM6pFkv.mjs";
+import { J as CheckIcon, q as CloseIcon } from "./icons-DuumN7z-.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { AnimatePresence, motion } from "framer-motion";
 //#region src/components/navigation/stepper/Stepper.tsx
@@ -26,26 +26,26 @@ var sizeConfig = {
 var getVariantStyles = (variant, status) => {
 	return {
 		default: {
-			completed: "bg-primary text-white shadow-md shadow-primary/30",
-			current: "bg-primary text-white ring-4 ring-primary/30 shadow-lg shadow-primary/40",
+			completed: "bg-accent text-on-accent shadow-md shadow-accent/25",
+			current: "bg-accent text-on-accent ring-4 ring-focus/40 shadow-lg shadow-accent/30",
 			upcoming: "bg-neutral-200 text-neutral-500 dark:bg-neutral-700 dark:text-neutral-400",
 			error: "bg-red-500 text-white ring-4 ring-red-500/30"
 		},
 		glass: {
-			completed: "bg-primary/80 text-white backdrop-blur-xl border border-primary/30 shadow-lg shadow-primary/20",
-			current: "bg-primary/90 text-white backdrop-blur-xl border-2 border-primary ring-4 ring-primary/20 shadow-xl shadow-primary/30",
+			completed: "bg-accent/85 text-on-accent backdrop-blur-xl border border-accent/30 shadow-lg shadow-accent/20",
+			current: "bg-accent/90 text-on-accent backdrop-blur-xl border-2 border-accent ring-4 ring-focus/30 shadow-xl shadow-accent/30",
 			upcoming: "bg-white/60 text-neutral-500 backdrop-blur-xl border border-white/40 dark:bg-neutral-800/60 dark:text-neutral-400 dark:border-white/10",
 			error: "bg-red-500/80 text-white backdrop-blur-xl border border-red-400/30 ring-4 ring-red-500/20"
 		},
 		minimal: {
-			completed: "bg-primary/10 text-primary dark:bg-primary/20",
-			current: "bg-primary text-white shadow-sm",
+			completed: "bg-accent-subtle text-accent",
+			current: "bg-accent text-on-accent shadow-sm",
 			upcoming: "bg-transparent text-neutral-400 border-2 border-neutral-300 dark:border-neutral-600",
 			error: "bg-red-100 text-red-500 dark:bg-red-900/30"
 		},
 		outlined: {
-			completed: "bg-transparent text-primary border-2 border-primary",
-			current: "bg-primary text-white border-2 border-primary shadow-lg",
+			completed: "bg-transparent text-accent border-2 border-accent",
+			current: "bg-accent text-on-accent border-2 border-accent shadow-lg",
 			upcoming: "bg-transparent text-neutral-400 border-2 border-neutral-300 dark:border-neutral-600",
 			error: "bg-transparent text-red-500 border-2 border-red-500"
 		}
@@ -154,7 +154,7 @@ var Stepper = ({ steps, currentStep, onStepClick, orientation = "horizontal", si
 					height: config.connectorThickness
 				} },
 				children: animated ? /* @__PURE__ */ jsx(motion.div, {
-					className: "absolute top-0 left-0 bg-primary rounded-full",
+					className: "absolute top-0 left-0 bg-accent rounded-full",
 					initial: { [isVertical ? "height" : "width"]: 0 },
 					animate: { [isVertical ? "height" : "width"]: `${steps.length > 1 ? Math.min(currentStep, steps.length - 1) / (steps.length - 1) * 100 : 0}%` },
 					transition: {
@@ -166,7 +166,7 @@ var Stepper = ({ steps, currentStep, onStepClick, orientation = "horizontal", si
 						backgroundColor: colors?.connector || colors?.completed
 					}
 				}) : /* @__PURE__ */ jsx("div", {
-					className: "absolute top-0 left-0 bg-primary rounded-full",
+					className: "absolute top-0 left-0 bg-accent rounded-full",
 					style: {
 						...isVertical ? {
 							width: "100%",
@@ -196,7 +196,7 @@ var Stepper = ({ steps, currentStep, onStepClick, orientation = "horizontal", si
 						type: "button",
 						onClick: () => handleStepClick(index),
 						disabled: !isClickable,
-						className: mergeClassNames("relative z-10 flex-shrink-0 flex items-center justify-center bg-white dark:bg-neutral-900 rounded-full", isClickable ? "cursor-pointer" : "cursor-default", !isVertical && index === 0 && "mx-0", !isVertical && isLast && "mx-0"),
+						className: mergeClassNames("relative z-10 shrink-0 flex items-center justify-center bg-white dark:bg-neutral-900 rounded-full", isClickable ? "cursor-pointer" : "cursor-default", !isVertical && index === 0 && "mx-0", !isVertical && isLast && "mx-0"),
 						style: { padding: `${paddingValue}px` },
 						"aria-current": status === "current" ? "step" : void 0,
 						children: /* @__PURE__ */ jsx(StepIndicator, {
@@ -223,7 +223,7 @@ var Stepper = ({ steps, currentStep, onStepClick, orientation = "horizontal", si
 						} : void 0,
 						transition: { delay: index * .1 },
 						children: [/* @__PURE__ */ jsxs("p", {
-							className: mergeClassNames("font-medium transition-colors duration-200", config.text, status === "current" ? "text-primary dark:text-primary-400" : status === "completed" ? "text-neutral-700 dark:text-neutral-200" : status === "error" ? "text-red-500" : "text-neutral-500 dark:text-neutral-400"),
+							className: mergeClassNames("font-medium transition-colors duration-200", config.text, status === "current" ? "text-accent" : status === "completed" ? "text-neutral-700 dark:text-neutral-200" : status === "error" ? "text-red-500" : "text-neutral-500 dark:text-neutral-400"),
 							children: [step.title, step.optional && /* @__PURE__ */ jsx("span", {
 								className: "ml-1 text-neutral-400 dark:text-neutral-500 font-normal",
 								children: "(Optional)"
@@ -258,4 +258,4 @@ Stepper.displayName = "Stepper";
 //#endregion
 export { Stepper as t };
-//# sourceMappingURL=stepper-uz8iRzlY.mjs.map
+//# sourceMappingURL=stepper-D4yQsQB0.mjs.map

package/dist/chunks/stepper-D4yQsQB0.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"stepper-D4yQsQB0.mjs","names":[],"sources":["../../src/components/navigation/stepper/Stepper.tsx"],"sourcesContent":["import { motion, AnimatePresence } from \"framer-motion\";\n\nimport { CheckIcon, CloseIcon } from \"../../icons\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type {\n StepperProps,\n StepIndicatorProps,\n StepStatus,\n StepperSize,\n StepperVariant,\n} from \"./types\";\n\n// Size configurations for indicators and icons\nconst sizeConfig: Record<\n StepperSize,\n { indicator: string; icon: string; text: string; connectorThickness: string }\n> = {\n sm: {\n indicator: \"w-8 h-8\",\n icon: \"w-4 h-4\",\n text: \"text-xs\",\n connectorThickness: \"2px\",\n },\n md: {\n indicator: \"w-10 h-10\",\n icon: \"w-5 h-5\",\n text: \"text-sm\",\n connectorThickness: \"2px\",\n },\n lg: {\n indicator: \"w-12 h-12\",\n icon: \"w-6 h-6\",\n text: \"text-base\",\n connectorThickness: \"4px\",\n },\n};\n\n// Variant styles for the indicator\nconst getVariantStyles = (variant: StepperVariant, status: StepStatus) => {\n const baseStyles = {\n default: {\n completed: \"bg-accent text-on-accent shadow-md shadow-accent/25\",\n current:\n \"bg-accent text-on-accent ring-4 ring-focus/40 shadow-lg shadow-accent/30\",\n upcoming:\n \"bg-neutral-200 text-neutral-500 dark:bg-neutral-700 dark:text-neutral-400\",\n error: \"bg-red-500 text-white ring-4 ring-red-500/30\",\n },\n glass: {\n completed:\n \"bg-accent/85 text-on-accent backdrop-blur-xl border border-accent/30 shadow-lg shadow-accent/20\",\n current:\n \"bg-accent/90 text-on-accent backdrop-blur-xl border-2 border-accent ring-4 ring-focus/30 shadow-xl shadow-accent/30\",\n upcoming:\n \"bg-white/60 text-neutral-500 backdrop-blur-xl border border-white/40 dark:bg-neutral-800/60 dark:text-neutral-400 dark:border-white/10\",\n error:\n \"bg-red-500/80 text-white backdrop-blur-xl border border-red-400/30 ring-4 ring-red-500/20\",\n },\n minimal: {\n completed: \"bg-accent-subtle text-accent\",\n current: \"bg-accent text-on-accent shadow-sm\",\n upcoming:\n \"bg-transparent text-neutral-400 border-2 border-neutral-300 dark:border-neutral-600\",\n error: \"bg-red-100 text-red-500 dark:bg-red-900/30\",\n },\n outlined: {\n completed: \"bg-transparent text-accent border-2 border-accent\",\n current: \"bg-accent text-on-accent border-2 border-accent shadow-lg\",\n upcoming:\n \"bg-transparent text-neutral-400 border-2 border-neutral-300 dark:border-neutral-600\",\n error: \"bg-transparent text-red-500 border-2 border-red-500\",\n },\n };\n\n return baseStyles[variant][status];\n};\n\n// Step Indicator Component\nconst StepIndicator = ({\n step,\n index,\n status,\n size,\n variant,\n showNumbers,\n animated,\n colors,\n}: StepIndicatorProps) => {\n const config = sizeConfig[size];\n const variantStyles = getVariantStyles(variant, status);\n\n // Custom color overrides\n const customColorStyle = colors?.[status]\n ? { backgroundColor: colors[status], borderColor: colors[status] }\n : undefined;\n\n const renderContent = () => {\n if (step.icon) {\n return <span className={config.icon}>{step.icon}</span>;\n }\n\n if (status === \"completed\") {\n return <CheckIcon className={config.icon} aria-hidden=\"true\" />;\n }\n\n if (status === \"error\") {\n return <CloseIcon className={config.icon} aria-hidden=\"true\" />;\n }\n\n if (showNumbers) {\n return <span className=\"font-semibold\">{index + 1}</span>;\n }\n\n return (\n <span\n className={mergeClassNames(\n \"rounded-full bg-current\",\n size === \"sm\" ? \"w-2 h-2\" : \"w-3 h-3\",\n )}\n />\n );\n };\n\n return (\n <motion.div\n className={mergeClassNames(\n \"rounded-full flex items-center justify-center transition-all duration-300\",\n config.indicator,\n variantStyles,\n )}\n style={customColorStyle}\n initial={animated ? { scale: 0.8, opacity: 0 } : undefined}\n animate={animated ? { scale: 1, opacity: 1 } : undefined}\n whileHover={{ scale: 1.05 }}\n whileTap={{ scale: 0.95 }}\n transition={{ type: \"spring\", stiffness: 400, damping: 17 }}\n >\n <AnimatePresence mode=\"wait\">\n <motion.span\n key={status}\n initial={animated ? { scale: 0, rotate: -180 } : undefined}\n animate={animated ? { scale: 1, rotate: 0 } : undefined}\n exit={animated ? { scale: 0, rotate: 180 } : undefined}\n transition={{ duration: 0.2 }}\n >\n {renderContent()}\n </motion.span>\n </AnimatePresence>\n </motion.div>\n );\n};\n\n// Main Stepper Component\nexport const Stepper = ({\n steps,\n currentStep,\n onStepClick,\n orientation = \"horizontal\",\n size = \"md\",\n variant = \"glass\",\n showNumbers = true,\n clickable = true,\n showConnector = true,\n className,\n connectorClassName,\n stepClassName,\n showErrors = false,\n errorSteps = [],\n completedSteps,\n animated = true,\n colors,\n}: StepperProps) => {\n const isVertical = orientation === \"vertical\";\n const config = sizeConfig[size];\n\n const getStepStatus = (index: number): StepStatus => {\n if (showErrors && errorSteps.includes(index)) return \"error\";\n if (completedSteps) {\n if (completedSteps.includes(index)) return \"completed\";\n if (index === currentStep) return \"current\";\n return \"upcoming\";\n }\n if (index < currentStep) return \"completed\";\n if (index === currentStep) return \"current\";\n return \"upcoming\";\n };\n\n const handleStepClick = (index: number) => {\n if (!clickable || !onStepClick) return;\n const step = steps[index];\n if (step.disabled) return;\n\n // Allow clicking on completed or current steps\n const status = getStepStatus(index);\n if (status === \"completed\" || status === \"current\") {\n onStepClick(index);\n }\n };\n\n return (\n <div\n className={mergeClassNames(\n \"w-full relative\",\n isVertical ? \"flex flex-col\" : \"flex items-start justify-between\",\n className,\n )}\n >\n {/* Global Background Continuous Connector */}\n {showConnector &&\n (() => {\n const paddingValue =\n variant === \"glass\" ||\n variant === \"outlined\" ||\n variant === \"minimal\"\n ? 4\n : 2;\n return (\n <div\n className={mergeClassNames(\n \"absolute rounded-full\",\n variant === \"glass\"\n ? \"bg-white/30 dark:bg-white/10 backdrop-blur-sm\"\n : \"bg-neutral-200 dark:bg-neutral-700\",\n connectorClassName,\n )}\n style={{\n ...(isVertical\n ? {\n // Vertical background line\n top: \"0\",\n bottom: \"0\",\n left: `calc(${paddingValue}px + 1px + ${config.indicator.split(\" \")[0].replace(\"w-\", \"\")} * 0.125rem - ${config.connectorThickness} / 2)`,\n width: config.connectorThickness,\n }\n : {\n // Horizontal background line\n left: \"0\",\n right: \"0\",\n top: `calc(${paddingValue}px + 1px + ${config.indicator.split(\" \")[1].replace(\"h-\", \"\")} * 0.125rem - ${config.connectorThickness} / 2)`,\n height: config.connectorThickness,\n }),\n }}\n >\n {/* Animated fill connector */}\n {animated ? (\n <motion.div\n className=\"absolute top-0 left-0 bg-accent rounded-full\"\n initial={{ [isVertical ? \"height\" : \"width\"]: 0 }}\n animate={{\n [isVertical ? \"height\" : \"width\"]:\n `${steps.length > 1 ? (Math.min(currentStep, steps.length - 1) / (steps.length - 1)) * 100 : 0}%`,\n }}\n transition={{ duration: 0.4, ease: \"easeOut\" }}\n style={{\n ...(isVertical ? { width: \"100%\" } : { height: \"100%\" }),\n backgroundColor: colors?.connector || colors?.completed,\n }}\n />\n ) : (\n <div\n className=\"absolute top-0 left-0 bg-accent rounded-full\"\n style={{\n ...(isVertical\n ? {\n width: \"100%\",\n height: `${steps.length > 1 ? (Math.min(currentStep, steps.length - 1) / (steps.length - 1)) * 100 : 0}%`,\n }\n : {\n height: \"100%\",\n width: `${steps.length > 1 ? (Math.min(currentStep, steps.length - 1) / (steps.length - 1)) * 100 : 0}%`,\n }),\n backgroundColor: colors?.connector || colors?.completed,\n }}\n />\n )}\n </div>\n );\n })()}\n\n {steps.map((step, index) => {\n const status = getStepStatus(index);\n const isLast = index === steps.length - 1;\n const isClickable = clickable && !step.disabled; // Keep steps clickable unconditionally for navigation\n const paddingValue =\n variant === \"glass\" || variant === \"outlined\" || variant === \"minimal\"\n ? 4\n : 2;\n\n return (\n <div\n key={step.id}\n className={mergeClassNames(\n \"relative z-10\",\n isVertical\n ? \"flex gap-4 pb-8\" // spacing between vertical elements\n : \"flex flex-1 flex-col items-center\",\n !isLast && isVertical && \"mb-2\",\n isVertical && isLast && \"pb-0\",\n stepClassName,\n )}\n style={{\n // Ensure perfect horizontal distribution\n ...(!isVertical\n ? {\n flexBasis: 0,\n flexGrow: 1,\n // Keep first item aligned left, last aligned right, others centered\n alignItems:\n index === 0\n ? \"flex-start\"\n : isLast\n ? \"flex-end\"\n : \"center\",\n }\n : {}),\n }}\n >\n {/* Step Indicator */}\n <button\n type=\"button\"\n onClick={() => handleStepClick(index)}\n disabled={!isClickable}\n className={mergeClassNames(\n \"relative z-10 shrink-0 flex items-center justify-center bg-white dark:bg-neutral-900 rounded-full\", // Mask background line\n isClickable ? \"cursor-pointer\" : \"cursor-default\",\n // Horizontal offset logic for end items to align with text\n !isVertical && index === 0 && \"mx-0\",\n !isVertical && isLast && \"mx-0\",\n )}\n style={{\n // Adjust the background masking size depending on variant so the line doesn't peek through the edges\n padding: `${paddingValue}px`,\n }}\n aria-current={status === \"current\" ? \"step\" : undefined}\n >\n <StepIndicator\n step={step}\n index={index}\n status={status}\n size={size}\n variant={variant}\n showNumbers={showNumbers}\n animated={animated}\n colors={colors}\n />\n </button>\n\n {/* Step text content */}\n <motion.div\n className={mergeClassNames(\n \"mt-2\",\n isVertical ? \"flex-1 pb-6\" : \"text-center px-2\",\n !isVertical && index === 0 && \"text-left px-0\",\n !isVertical && isLast && \"text-right px-0\",\n isVertical && isLast && \"pb-0\",\n )}\n style={isVertical ? { marginTop: \"-4px\" } : undefined}\n initial={animated ? { opacity: 0, y: 10 } : undefined}\n animate={animated ? { opacity: 1, y: 0 } : undefined}\n transition={{ delay: index * 0.1 }}\n >\n <p\n className={mergeClassNames(\n \"font-medium transition-colors duration-200\",\n config.text,\n status === \"current\"\n ? \"text-accent\"\n : status === \"completed\"\n ? \"text-neutral-700 dark:text-neutral-200\"\n : status === \"error\"\n ? \"text-red-500\"\n : \"text-neutral-500 dark:text-neutral-400\",\n )}\n >\n {step.title}\n {step.optional && (\n <span className=\"ml-1 text-neutral-400 dark:text-neutral-500 font-normal\">\n (Optional)\n </span>\n )}\n </p>\n {step.description && (\n <p\n className={mergeClassNames(\n \"mt-0.5 text-neutral-500 dark:text-neutral-400\",\n size === \"sm\" ? \"text-xs\" : \"text-xs\",\n )}\n >\n {step.description}\n </p>\n )}\n </motion.div>\n\n {/* Step content (for vertical with content) */}\n {isVertical && step.content && status === \"current\" && (\n <motion.div\n initial={{ opacity: 0, height: 0 }}\n animate={{ opacity: 1, height: \"auto\" }}\n exit={{ opacity: 0, height: 0 }}\n className=\"pl-14 pb-4 w-full\"\n >\n {step.content}\n </motion.div>\n )}\n </div>\n );\n })}\n </div>\n );\n};\n\nStepper.displayName = \"Stepper\";\n\nexport default Stepper;\n"],"mappings":"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"}

package/dist/chunks/{stepper-BDz6PkjV.cjs → stepper-fY-Sx72k.cjs} RENAMED Viewed

@@ -1,6 +1,6 @@
 require("./chunk-B_GkZjkl.cjs");
 const require_utils = require("./utils-B4SmmY4J.cjs");
-const require_icons = require("./icons-DYkpqWYG.cjs");
+const require_icons = require("./icons-BxIzP2jd.cjs");
 let react_jsx_runtime = require("react/jsx-runtime");
 let framer_motion = require("framer-motion");
 //#region src/components/navigation/stepper/Stepper.tsx
@@ -27,26 +27,26 @@ var sizeConfig = {
 var getVariantStyles = (variant, status) => {
 	return {
 		default: {
-			completed: "bg-primary text-white shadow-md shadow-primary/30",
-			current: "bg-primary text-white ring-4 ring-primary/30 shadow-lg shadow-primary/40",
+			completed: "bg-accent text-on-accent shadow-md shadow-accent/25",
+			current: "bg-accent text-on-accent ring-4 ring-focus/40 shadow-lg shadow-accent/30",
 			upcoming: "bg-neutral-200 text-neutral-500 dark:bg-neutral-700 dark:text-neutral-400",
 			error: "bg-red-500 text-white ring-4 ring-red-500/30"
 		},
 		glass: {
-			completed: "bg-primary/80 text-white backdrop-blur-xl border border-primary/30 shadow-lg shadow-primary/20",
-			current: "bg-primary/90 text-white backdrop-blur-xl border-2 border-primary ring-4 ring-primary/20 shadow-xl shadow-primary/30",
+			completed: "bg-accent/85 text-on-accent backdrop-blur-xl border border-accent/30 shadow-lg shadow-accent/20",
+			current: "bg-accent/90 text-on-accent backdrop-blur-xl border-2 border-accent ring-4 ring-focus/30 shadow-xl shadow-accent/30",
 			upcoming: "bg-white/60 text-neutral-500 backdrop-blur-xl border border-white/40 dark:bg-neutral-800/60 dark:text-neutral-400 dark:border-white/10",
 			error: "bg-red-500/80 text-white backdrop-blur-xl border border-red-400/30 ring-4 ring-red-500/20"
 		},
 		minimal: {
-			completed: "bg-primary/10 text-primary dark:bg-primary/20",
-			current: "bg-primary text-white shadow-sm",
+			completed: "bg-accent-subtle text-accent",
+			current: "bg-accent text-on-accent shadow-sm",
 			upcoming: "bg-transparent text-neutral-400 border-2 border-neutral-300 dark:border-neutral-600",
 			error: "bg-red-100 text-red-500 dark:bg-red-900/30"
 		},
 		outlined: {
-			completed: "bg-transparent text-primary border-2 border-primary",
-			current: "bg-primary text-white border-2 border-primary shadow-lg",
+			completed: "bg-transparent text-accent border-2 border-accent",
+			current: "bg-accent text-on-accent border-2 border-accent shadow-lg",
 			upcoming: "bg-transparent text-neutral-400 border-2 border-neutral-300 dark:border-neutral-600",
 			error: "bg-transparent text-red-500 border-2 border-red-500"
 		}
@@ -155,7 +155,7 @@ var Stepper = ({ steps, currentStep, onStepClick, orientation = "horizontal", si
 					height: config.connectorThickness
 				} },
 				children: animated ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(framer_motion.motion.div, {
-					className: "absolute top-0 left-0 bg-primary rounded-full",
+					className: "absolute top-0 left-0 bg-accent rounded-full",
 					initial: { [isVertical ? "height" : "width"]: 0 },
 					animate: { [isVertical ? "height" : "width"]: `${steps.length > 1 ? Math.min(currentStep, steps.length - 1) / (steps.length - 1) * 100 : 0}%` },
 					transition: {
@@ -167,7 +167,7 @@ var Stepper = ({ steps, currentStep, onStepClick, orientation = "horizontal", si
 						backgroundColor: colors?.connector || colors?.completed
 					}
 				}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-					className: "absolute top-0 left-0 bg-primary rounded-full",
+					className: "absolute top-0 left-0 bg-accent rounded-full",
 					style: {
 						...isVertical ? {
 							width: "100%",
@@ -197,7 +197,7 @@ var Stepper = ({ steps, currentStep, onStepClick, orientation = "horizontal", si
 						type: "button",
 						onClick: () => handleStepClick(index),
 						disabled: !isClickable,
-						className: require_utils.mergeClassNames("relative z-10 flex-shrink-0 flex items-center justify-center bg-white dark:bg-neutral-900 rounded-full", isClickable ? "cursor-pointer" : "cursor-default", !isVertical && index === 0 && "mx-0", !isVertical && isLast && "mx-0"),
+						className: require_utils.mergeClassNames("relative z-10 shrink-0 flex items-center justify-center bg-white dark:bg-neutral-900 rounded-full", isClickable ? "cursor-pointer" : "cursor-default", !isVertical && index === 0 && "mx-0", !isVertical && isLast && "mx-0"),
 						style: { padding: `${paddingValue}px` },
 						"aria-current": status === "current" ? "step" : void 0,
 						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StepIndicator, {
@@ -224,7 +224,7 @@ var Stepper = ({ steps, currentStep, onStepClick, orientation = "horizontal", si
 						} : void 0,
 						transition: { delay: index * .1 },
 						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
-							className: require_utils.mergeClassNames("font-medium transition-colors duration-200", config.text, status === "current" ? "text-primary dark:text-primary-400" : status === "completed" ? "text-neutral-700 dark:text-neutral-200" : status === "error" ? "text-red-500" : "text-neutral-500 dark:text-neutral-400"),
+							className: require_utils.mergeClassNames("font-medium transition-colors duration-200", config.text, status === "current" ? "text-accent" : status === "completed" ? "text-neutral-700 dark:text-neutral-200" : status === "error" ? "text-red-500" : "text-neutral-500 dark:text-neutral-400"),
 							children: [step.title, step.optional && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 								className: "ml-1 text-neutral-400 dark:text-neutral-500 font-normal",
 								children: "(Optional)"
@@ -264,4 +264,4 @@ Object.defineProperty(exports, "Stepper", {
 	}
 });
-//# sourceMappingURL=stepper-BDz6PkjV.cjs.map
+//# sourceMappingURL=stepper-fY-Sx72k.cjs.map

package/dist/chunks/stepper-fY-Sx72k.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"stepper-fY-Sx72k.cjs","names":[],"sources":["../../src/components/navigation/stepper/Stepper.tsx"],"sourcesContent":["import { motion, AnimatePresence } from \"framer-motion\";\n\nimport { CheckIcon, CloseIcon } from \"../../icons\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type {\n StepperProps,\n StepIndicatorProps,\n StepStatus,\n StepperSize,\n StepperVariant,\n} from \"./types\";\n\n// Size configurations for indicators and icons\nconst sizeConfig: Record<\n StepperSize,\n { indicator: string; icon: string; text: string; connectorThickness: string }\n> = {\n sm: {\n indicator: \"w-8 h-8\",\n icon: \"w-4 h-4\",\n text: \"text-xs\",\n connectorThickness: \"2px\",\n },\n md: {\n indicator: \"w-10 h-10\",\n icon: \"w-5 h-5\",\n text: \"text-sm\",\n connectorThickness: \"2px\",\n },\n lg: {\n indicator: \"w-12 h-12\",\n icon: \"w-6 h-6\",\n text: \"text-base\",\n connectorThickness: \"4px\",\n },\n};\n\n// Variant styles for the indicator\nconst getVariantStyles = (variant: StepperVariant, status: StepStatus) => {\n const baseStyles = {\n default: {\n completed: \"bg-accent text-on-accent shadow-md shadow-accent/25\",\n current:\n \"bg-accent text-on-accent ring-4 ring-focus/40 shadow-lg shadow-accent/30\",\n upcoming:\n \"bg-neutral-200 text-neutral-500 dark:bg-neutral-700 dark:text-neutral-400\",\n error: \"bg-red-500 text-white ring-4 ring-red-500/30\",\n },\n glass: {\n completed:\n \"bg-accent/85 text-on-accent backdrop-blur-xl border border-accent/30 shadow-lg shadow-accent/20\",\n current:\n \"bg-accent/90 text-on-accent backdrop-blur-xl border-2 border-accent ring-4 ring-focus/30 shadow-xl shadow-accent/30\",\n upcoming:\n \"bg-white/60 text-neutral-500 backdrop-blur-xl border border-white/40 dark:bg-neutral-800/60 dark:text-neutral-400 dark:border-white/10\",\n error:\n \"bg-red-500/80 text-white backdrop-blur-xl border border-red-400/30 ring-4 ring-red-500/20\",\n },\n minimal: {\n completed: \"bg-accent-subtle text-accent\",\n current: \"bg-accent text-on-accent shadow-sm\",\n upcoming:\n \"bg-transparent text-neutral-400 border-2 border-neutral-300 dark:border-neutral-600\",\n error: \"bg-red-100 text-red-500 dark:bg-red-900/30\",\n },\n outlined: {\n completed: \"bg-transparent text-accent border-2 border-accent\",\n current: \"bg-accent text-on-accent border-2 border-accent shadow-lg\",\n upcoming:\n \"bg-transparent text-neutral-400 border-2 border-neutral-300 dark:border-neutral-600\",\n error: \"bg-transparent text-red-500 border-2 border-red-500\",\n },\n };\n\n return baseStyles[variant][status];\n};\n\n// Step Indicator Component\nconst StepIndicator = ({\n step,\n index,\n status,\n size,\n variant,\n showNumbers,\n animated,\n colors,\n}: StepIndicatorProps) => {\n const config = sizeConfig[size];\n const variantStyles = getVariantStyles(variant, status);\n\n // Custom color overrides\n const customColorStyle = colors?.[status]\n ? { backgroundColor: colors[status], borderColor: colors[status] }\n : undefined;\n\n const renderContent = () => {\n if (step.icon) {\n return <span className={config.icon}>{step.icon}</span>;\n }\n\n if (status === \"completed\") {\n return <CheckIcon className={config.icon} aria-hidden=\"true\" />;\n }\n\n if (status === \"error\") {\n return <CloseIcon className={config.icon} aria-hidden=\"true\" />;\n }\n\n if (showNumbers) {\n return <span className=\"font-semibold\">{index + 1}</span>;\n }\n\n return (\n <span\n className={mergeClassNames(\n \"rounded-full bg-current\",\n size === \"sm\" ? \"w-2 h-2\" : \"w-3 h-3\",\n )}\n />\n );\n };\n\n return (\n <motion.div\n className={mergeClassNames(\n \"rounded-full flex items-center justify-center transition-all duration-300\",\n config.indicator,\n variantStyles,\n )}\n style={customColorStyle}\n initial={animated ? { scale: 0.8, opacity: 0 } : undefined}\n animate={animated ? { scale: 1, opacity: 1 } : undefined}\n whileHover={{ scale: 1.05 }}\n whileTap={{ scale: 0.95 }}\n transition={{ type: \"spring\", stiffness: 400, damping: 17 }}\n >\n <AnimatePresence mode=\"wait\">\n <motion.span\n key={status}\n initial={animated ? { scale: 0, rotate: -180 } : undefined}\n animate={animated ? { scale: 1, rotate: 0 } : undefined}\n exit={animated ? { scale: 0, rotate: 180 } : undefined}\n transition={{ duration: 0.2 }}\n >\n {renderContent()}\n </motion.span>\n </AnimatePresence>\n </motion.div>\n );\n};\n\n// Main Stepper Component\nexport const Stepper = ({\n steps,\n currentStep,\n onStepClick,\n orientation = \"horizontal\",\n size = \"md\",\n variant = \"glass\",\n showNumbers = true,\n clickable = true,\n showConnector = true,\n className,\n connectorClassName,\n stepClassName,\n showErrors = false,\n errorSteps = [],\n completedSteps,\n animated = true,\n colors,\n}: StepperProps) => {\n const isVertical = orientation === \"vertical\";\n const config = sizeConfig[size];\n\n const getStepStatus = (index: number): StepStatus => {\n if (showErrors && errorSteps.includes(index)) return \"error\";\n if (completedSteps) {\n if (completedSteps.includes(index)) return \"completed\";\n if (index === currentStep) return \"current\";\n return \"upcoming\";\n }\n if (index < currentStep) return \"completed\";\n if (index === currentStep) return \"current\";\n return \"upcoming\";\n };\n\n const handleStepClick = (index: number) => {\n if (!clickable || !onStepClick) return;\n const step = steps[index];\n if (step.disabled) return;\n\n // Allow clicking on completed or current steps\n const status = getStepStatus(index);\n if (status === \"completed\" || status === \"current\") {\n onStepClick(index);\n }\n };\n\n return (\n <div\n className={mergeClassNames(\n \"w-full relative\",\n isVertical ? \"flex flex-col\" : \"flex items-start justify-between\",\n className,\n )}\n >\n {/* Global Background Continuous Connector */}\n {showConnector &&\n (() => {\n const paddingValue =\n variant === \"glass\" ||\n variant === \"outlined\" ||\n variant === \"minimal\"\n ? 4\n : 2;\n return (\n <div\n className={mergeClassNames(\n \"absolute rounded-full\",\n variant === \"glass\"\n ? \"bg-white/30 dark:bg-white/10 backdrop-blur-sm\"\n : \"bg-neutral-200 dark:bg-neutral-700\",\n connectorClassName,\n )}\n style={{\n ...(isVertical\n ? {\n // Vertical background line\n top: \"0\",\n bottom: \"0\",\n left: `calc(${paddingValue}px + 1px + ${config.indicator.split(\" \")[0].replace(\"w-\", \"\")} * 0.125rem - ${config.connectorThickness} / 2)`,\n width: config.connectorThickness,\n }\n : {\n // Horizontal background line\n left: \"0\",\n right: \"0\",\n top: `calc(${paddingValue}px + 1px + ${config.indicator.split(\" \")[1].replace(\"h-\", \"\")} * 0.125rem - ${config.connectorThickness} / 2)`,\n height: config.connectorThickness,\n }),\n }}\n >\n {/* Animated fill connector */}\n {animated ? (\n <motion.div\n className=\"absolute top-0 left-0 bg-accent rounded-full\"\n initial={{ [isVertical ? \"height\" : \"width\"]: 0 }}\n animate={{\n [isVertical ? \"height\" : \"width\"]:\n `${steps.length > 1 ? (Math.min(currentStep, steps.length - 1) / (steps.length - 1)) * 100 : 0}%`,\n }}\n transition={{ duration: 0.4, ease: \"easeOut\" }}\n style={{\n ...(isVertical ? { width: \"100%\" } : { height: \"100%\" }),\n backgroundColor: colors?.connector || colors?.completed,\n }}\n />\n ) : (\n <div\n className=\"absolute top-0 left-0 bg-accent rounded-full\"\n style={{\n ...(isVertical\n ? {\n width: \"100%\",\n height: `${steps.length > 1 ? (Math.min(currentStep, steps.length - 1) / (steps.length - 1)) * 100 : 0}%`,\n }\n : {\n height: \"100%\",\n width: `${steps.length > 1 ? (Math.min(currentStep, steps.length - 1) / (steps.length - 1)) * 100 : 0}%`,\n }),\n backgroundColor: colors?.connector || colors?.completed,\n }}\n />\n )}\n </div>\n );\n })()}\n\n {steps.map((step, index) => {\n const status = getStepStatus(index);\n const isLast = index === steps.length - 1;\n const isClickable = clickable && !step.disabled; // Keep steps clickable unconditionally for navigation\n const paddingValue =\n variant === \"glass\" || variant === \"outlined\" || variant === \"minimal\"\n ? 4\n : 2;\n\n return (\n <div\n key={step.id}\n className={mergeClassNames(\n \"relative z-10\",\n isVertical\n ? \"flex gap-4 pb-8\" // spacing between vertical elements\n : \"flex flex-1 flex-col items-center\",\n !isLast && isVertical && \"mb-2\",\n isVertical && isLast && \"pb-0\",\n stepClassName,\n )}\n style={{\n // Ensure perfect horizontal distribution\n ...(!isVertical\n ? {\n flexBasis: 0,\n flexGrow: 1,\n // Keep first item aligned left, last aligned right, others centered\n alignItems:\n index === 0\n ? \"flex-start\"\n : isLast\n ? \"flex-end\"\n : \"center\",\n }\n : {}),\n }}\n >\n {/* Step Indicator */}\n <button\n type=\"button\"\n onClick={() => handleStepClick(index)}\n disabled={!isClickable}\n className={mergeClassNames(\n \"relative z-10 shrink-0 flex items-center justify-center bg-white dark:bg-neutral-900 rounded-full\", // Mask background line\n isClickable ? \"cursor-pointer\" : \"cursor-default\",\n // Horizontal offset logic for end items to align with text\n !isVertical && index === 0 && \"mx-0\",\n !isVertical && isLast && \"mx-0\",\n )}\n style={{\n // Adjust the background masking size depending on variant so the line doesn't peek through the edges\n padding: `${paddingValue}px`,\n }}\n aria-current={status === \"current\" ? \"step\" : undefined}\n >\n <StepIndicator\n step={step}\n index={index}\n status={status}\n size={size}\n variant={variant}\n showNumbers={showNumbers}\n animated={animated}\n colors={colors}\n />\n </button>\n\n {/* Step text content */}\n <motion.div\n className={mergeClassNames(\n \"mt-2\",\n isVertical ? \"flex-1 pb-6\" : \"text-center px-2\",\n !isVertical && index === 0 && \"text-left px-0\",\n !isVertical && isLast && \"text-right px-0\",\n isVertical && isLast && \"pb-0\",\n )}\n style={isVertical ? { marginTop: \"-4px\" } : undefined}\n initial={animated ? { opacity: 0, y: 10 } : undefined}\n animate={animated ? { opacity: 1, y: 0 } : undefined}\n transition={{ delay: index * 0.1 }}\n >\n <p\n className={mergeClassNames(\n \"font-medium transition-colors duration-200\",\n config.text,\n status === \"current\"\n ? \"text-accent\"\n : status === \"completed\"\n ? \"text-neutral-700 dark:text-neutral-200\"\n : status === \"error\"\n ? \"text-red-500\"\n : \"text-neutral-500 dark:text-neutral-400\",\n )}\n >\n {step.title}\n {step.optional && (\n <span className=\"ml-1 text-neutral-400 dark:text-neutral-500 font-normal\">\n (Optional)\n </span>\n )}\n </p>\n {step.description && (\n <p\n className={mergeClassNames(\n \"mt-0.5 text-neutral-500 dark:text-neutral-400\",\n size === \"sm\" ? \"text-xs\" : \"text-xs\",\n )}\n >\n {step.description}\n </p>\n )}\n </motion.div>\n\n {/* Step content (for vertical with content) */}\n {isVertical && step.content && status === \"current\" && (\n <motion.div\n initial={{ opacity: 0, height: 0 }}\n animate={{ opacity: 1, height: \"auto\" }}\n exit={{ opacity: 0, height: 0 }}\n className=\"pl-14 pb-4 w-full\"\n >\n {step.content}\n </motion.div>\n )}\n </div>\n );\n })}\n </div>\n );\n};\n\nStepper.displayName = \"Stepper\";\n\nexport default Stepper;\n"],"mappings":"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"}

package/dist/chunks/{sun-to-moon-button-3E6qah0o.mjs → sun-to-moon-button-B2Aje05o.mjs} RENAMED Viewed

@@ -1,4 +1,4 @@
-import { n as useThemeContext } from "./theme-Bwu0HKqZ.mjs";
+import { n as useThemeContext } from "./theme-BceKeYhw.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { motion } from "framer-motion";
 //#region src/components/effects/sun-to-moon-button/SunToMoonButton.tsx
@@ -175,7 +175,7 @@ function SunToMoonButton({ showLabelAndImage = true }) {
 				]
 			}), /* @__PURE__ */ jsxs("span", {
 				className: "my-1 flex w-[150px] justify-between",
-				children: [/* @__PURE__ */ jsx("span", { className: "mb-1 w-[80px] rounded-full bg-neutral-300 p-1 dark:bg-neutral-600" }), /* @__PURE__ */ jsx("span", { className: "mb-1 w-[30px] rounded-full bg-primary p-1" })]
+				children: [/* @__PURE__ */ jsx("span", { className: "mb-1 w-[80px] rounded-full bg-neutral-300 p-1 dark:bg-neutral-600" }), /* @__PURE__ */ jsx("span", { className: "mb-1 w-[30px] rounded-full bg-accent p-1" })]
 			})]
 		})]
 	});
@@ -183,4 +183,4 @@ function SunToMoonButton({ showLabelAndImage = true }) {
 //#endregion
 export { SunToMoonButton as t };
-//# sourceMappingURL=sun-to-moon-button-3E6qah0o.mjs.map
+//# sourceMappingURL=sun-to-moon-button-B2Aje05o.mjs.map

package/dist/chunks/{sun-to-moon-button-3E6qah0o.mjs.map → sun-to-moon-button-B2Aje05o.mjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sun-to-moon-button-~~3E6qah0o~~.mjs","names":[],"sources":["../../src/components/effects/sun-to-moon-button/SunToMoonButton.tsx"],"sourcesContent":["import { useThemeContext } from \"../../../foundations/theme\";\nimport { motion } from \"framer-motion\";\n\nexport interface SunToMoonButtonProps {\n showLabelAndImage?: boolean;\n}\n\nexport default function SunToMoonButton({\n showLabelAndImage = true,\n}: SunToMoonButtonProps) {\n const { mode, toggleMode } = useThemeContext();\n\n const raysVariants = {\n hidden: {\n strokeOpacity: 0,\n transition: {\n staggerChildren: 0.05,\n staggerDirection: -1,\n },\n },\n visible: {\n strokeOpacity: 1,\n transition: {\n staggerChildren: 0.05,\n },\n },\n };\n\n const rayVariant = {\n hidden: {\n pathLength: 0,\n opacity: 0,\n // Start from center of the circle\n scale: 0,\n },\n visible: {\n pathLength: 1,\n opacity: 1,\n scale: 1,\n transition: {\n duration: 0.5,\n pathLength: { duration: 0.3 },\n opacity: { duration: 0.2 },\n scale: { duration: 0.3 },\n },\n },\n };\n\n const shineVariant = {\n hidden: {\n opacity: 0,\n scale: 2,\n strokeDasharray: \"20, 1000\",\n strokeDashoffset: 0,\n filter: \"blur(0px)\",\n },\n visible: {\n opacity: [0, 1, 0],\n strokeDashoffset: [0, -50, -100],\n filter: [\"blur(2px)\", \"blur(2px)\", \"blur(0px)\"],\n transition: {\n duration: 0.75,\n },\n },\n };\n\n const sunPath =\n \"M70 49.5C70 60.8218 60.8218 70 49.5 70C38.1782 70 29 60.8218 29 49.5C29 38.1782 38.1782 29 49.5 29C60 29 69.5 38 70 49.5Z\";\n const moonPath =\n \"M70 49.5C70 60.8218 60.8218 70 49.5 70C38.1782 70 29 60.8218 29 49.5C29 38.1782 38.1782 29 49.5 29C39 45 49.5 59.5 70 49.5Z\";\n const fallbackPath = sunPath;\n\n // Ensure we have valid paths at all times\n // Light mode = sun, Dark mode = moon\n const currentPath = mode === \"light\" ? sunPath : moonPath;\n const safeCurrentPath = currentPath \|\| fallbackPath;\n\n return (\n <button\n type=\"button\"\n className=\"flex w-full cursor-pointer flex-col items-center justify-center rounded-xl py-3 text-base font-medium transition duration-200\"\n onClick={() => toggleMode()}\n >\n <span className=\"flex items-center\">\n {showLabelAndImage && (\n <span className=\"mr-2 text-neutral-900 dark:text-white\">\n {mode === \"light\" ? \"Light\" : \"Dark\"}\n </span>\n )}\n\n <motion.svg\n strokeWidth=\"4\"\n strokeLinecap=\"round\"\n width={20}\n height={20}\n viewBox=\"0 0 100 100\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"relative\"\n >\n {/* Shine effect for moon in dark mode /}\n {moonPath && (\n <motion.path\n variants={shineVariant}\n d={moonPath}\n className=\"absolute top-0 left-0 stroke-blue-100\"\n initial=\"hidden\"\n animate={mode === \"light\" ? \"hidden\" : \"visible\"}\n />\n )}\n\n {/ Sun rays - visible in light mode /}\n <motion.g\n variants={raysVariants}\n initial=\"hidden\"\n animate={mode === \"dark\" ? \"hidden\" : \"visible\"}\n style={{\n strokeLinecap: \"round\",\n strokeWidth: 6,\n stroke: \"var(--color-yellow-500)\",\n }}\n >\n <motion.path\n className=\"origin-center\"\n variants={rayVariant}\n d=\"M50 2V11\"\n />\n <motion.path variants={rayVariant} d=\"M85 15L78 22\" />\n <motion.path variants={rayVariant} d=\"M98 50H89\" />\n <motion.path variants={rayVariant} d=\"M85 85L78 78\" />\n <motion.path variants={rayVariant} d=\"M50 98V89\" />\n <motion.path variants={rayVariant} d=\"M23 78L16 84\" />\n <motion.path variants={rayVariant} d=\"M11 50H2\" />\n <motion.path variants={rayVariant} d=\"M23 23L16 16\" />\n </motion.g>\n\n {/ Main path - Light=Sun(yellow), Dark=Moon(blue) */}\n <motion.path\n d={safeCurrentPath}\n fill=\"transparent\"\n transition={{ duration: 1, type: \"spring\" }}\n initial={false}\n animate={\n mode === \"light\"\n ? {\n d: sunPath \|\| fallbackPath,\n rotate: 0,\n scale: 1,\n stroke: \"var(--color-yellow-500)\",\n fill: \"var(--color-yellow-500)\",\n fillOpacity: 0.5,\n strokeOpacity: 1,\n }\n : {\n d: moonPath \|\| fallbackPath,\n rotate: -360,\n scale: 2,\n stroke: \"var(--color-blue-400)\",\n fill: \"var(--color-blue-400)\",\n fillOpacity: 0.35,\n strokeOpacity: 1,\n }\n }\n />\n </motion.svg>\n </span>\n {showLabelAndImage && (\n <span className=\"mt-2 flex h-[90px] w-[180px] flex-col items-center justify-center rounded-md bg-neutral-100 dark:bg-neutral-800\">\n <span className=\"my-4 flex w-[150px] flex-col rounded-md\">\n <span className=\"mb-1 w-[80px] rounded-full bg-neutral-300 p-1 dark:bg-neutral-600\"></span>\n <span className=\"mb-1 w-[100px] rounded-full bg-neutral-300 p-1 dark:bg-neutral-600\"></span>\n <span className=\"w-[150px] rounded-full bg-neutral-300 p-1 dark:bg-neutral-600\"></span>\n </span>\n <span className=\"my-1 flex w-[150px] justify-between\">\n <span className=\"mb-1 w-[80px] rounded-full bg-neutral-300 p-1 dark:bg-neutral-600\"></span>\n <span className=\"mb-1 w-[30px] rounded-full bg-~~primary~~ p-1\"></span>\n </span>\n </span>\n )}\n </button>\n );\n}\n"],"mappings":"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~~6CAAmD~~,CAAA,~~CAC9D~~;MACF;KAEF"}
1	+ {"version":3,"file":"sun-to-moon-button-B2Aje05o.mjs","names":[],"sources":["../../src/components/effects/sun-to-moon-button/SunToMoonButton.tsx"],"sourcesContent":["import { useThemeContext } from \"../../../foundations/theme\";\nimport { motion } from \"framer-motion\";\n\nexport interface SunToMoonButtonProps {\n showLabelAndImage?: boolean;\n}\n\nexport default function SunToMoonButton({\n showLabelAndImage = true,\n}: SunToMoonButtonProps) {\n const { mode, toggleMode } = useThemeContext();\n\n const raysVariants = {\n hidden: {\n strokeOpacity: 0,\n transition: {\n staggerChildren: 0.05,\n staggerDirection: -1,\n },\n },\n visible: {\n strokeOpacity: 1,\n transition: {\n staggerChildren: 0.05,\n },\n },\n };\n\n const rayVariant = {\n hidden: {\n pathLength: 0,\n opacity: 0,\n // Start from center of the circle\n scale: 0,\n },\n visible: {\n pathLength: 1,\n opacity: 1,\n scale: 1,\n transition: {\n duration: 0.5,\n pathLength: { duration: 0.3 },\n opacity: { duration: 0.2 },\n scale: { duration: 0.3 },\n },\n },\n };\n\n const shineVariant = {\n hidden: {\n opacity: 0,\n scale: 2,\n strokeDasharray: \"20, 1000\",\n strokeDashoffset: 0,\n filter: \"blur(0px)\",\n },\n visible: {\n opacity: [0, 1, 0],\n strokeDashoffset: [0, -50, -100],\n filter: [\"blur(2px)\", \"blur(2px)\", \"blur(0px)\"],\n transition: {\n duration: 0.75,\n },\n },\n };\n\n const sunPath =\n \"M70 49.5C70 60.8218 60.8218 70 49.5 70C38.1782 70 29 60.8218 29 49.5C29 38.1782 38.1782 29 49.5 29C60 29 69.5 38 70 49.5Z\";\n const moonPath =\n \"M70 49.5C70 60.8218 60.8218 70 49.5 70C38.1782 70 29 60.8218 29 49.5C29 38.1782 38.1782 29 49.5 29C39 45 49.5 59.5 70 49.5Z\";\n const fallbackPath = sunPath;\n\n // Ensure we have valid paths at all times\n // Light mode = sun, Dark mode = moon\n const currentPath = mode === \"light\" ? sunPath : moonPath;\n const safeCurrentPath = currentPath \|\| fallbackPath;\n\n return (\n <button\n type=\"button\"\n className=\"flex w-full cursor-pointer flex-col items-center justify-center rounded-xl py-3 text-base font-medium transition duration-200\"\n onClick={() => toggleMode()}\n >\n <span className=\"flex items-center\">\n {showLabelAndImage && (\n <span className=\"mr-2 text-neutral-900 dark:text-white\">\n {mode === \"light\" ? \"Light\" : \"Dark\"}\n </span>\n )}\n\n <motion.svg\n strokeWidth=\"4\"\n strokeLinecap=\"round\"\n width={20}\n height={20}\n viewBox=\"0 0 100 100\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"relative\"\n >\n {/* Shine effect for moon in dark mode /}\n {moonPath && (\n <motion.path\n variants={shineVariant}\n d={moonPath}\n className=\"absolute top-0 left-0 stroke-blue-100\"\n initial=\"hidden\"\n animate={mode === \"light\" ? \"hidden\" : \"visible\"}\n />\n )}\n\n {/ Sun rays - visible in light mode /}\n <motion.g\n variants={raysVariants}\n initial=\"hidden\"\n animate={mode === \"dark\" ? \"hidden\" : \"visible\"}\n style={{\n strokeLinecap: \"round\",\n strokeWidth: 6,\n stroke: \"var(--color-yellow-500)\",\n }}\n >\n <motion.path\n className=\"origin-center\"\n variants={rayVariant}\n d=\"M50 2V11\"\n />\n <motion.path variants={rayVariant} d=\"M85 15L78 22\" />\n <motion.path variants={rayVariant} d=\"M98 50H89\" />\n <motion.path variants={rayVariant} d=\"M85 85L78 78\" />\n <motion.path variants={rayVariant} d=\"M50 98V89\" />\n <motion.path variants={rayVariant} d=\"M23 78L16 84\" />\n <motion.path variants={rayVariant} d=\"M11 50H2\" />\n <motion.path variants={rayVariant} d=\"M23 23L16 16\" />\n </motion.g>\n\n {/ Main path - Light=Sun(yellow), Dark=Moon(blue) */}\n <motion.path\n d={safeCurrentPath}\n fill=\"transparent\"\n transition={{ duration: 1, type: \"spring\" }}\n initial={false}\n animate={\n mode === \"light\"\n ? {\n d: sunPath \|\| fallbackPath,\n rotate: 0,\n scale: 1,\n stroke: \"var(--color-yellow-500)\",\n fill: \"var(--color-yellow-500)\",\n fillOpacity: 0.5,\n strokeOpacity: 1,\n }\n : {\n d: moonPath \|\| fallbackPath,\n rotate: -360,\n scale: 2,\n stroke: \"var(--color-blue-400)\",\n fill: \"var(--color-blue-400)\",\n fillOpacity: 0.35,\n strokeOpacity: 1,\n }\n }\n />\n </motion.svg>\n </span>\n {showLabelAndImage && (\n <span className=\"mt-2 flex h-[90px] w-[180px] flex-col items-center justify-center rounded-md bg-neutral-100 dark:bg-neutral-800\">\n <span className=\"my-4 flex w-[150px] flex-col rounded-md\">\n <span className=\"mb-1 w-[80px] rounded-full bg-neutral-300 p-1 dark:bg-neutral-600\"></span>\n <span className=\"mb-1 w-[100px] rounded-full bg-neutral-300 p-1 dark:bg-neutral-600\"></span>\n <span className=\"w-[150px] rounded-full bg-neutral-300 p-1 dark:bg-neutral-600\"></span>\n </span>\n <span className=\"my-1 flex w-[150px] justify-between\">\n <span className=\"mb-1 w-[80px] rounded-full bg-neutral-300 p-1 dark:bg-neutral-600\"></span>\n <span className=\"mb-1 w-[30px] rounded-full bg-accent p-1\"></span>\n </span>\n </span>\n )}\n </button>\n );\n}\n"],"mappings":"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"}

package/dist/chunks/{sun-to-moon-button-B__3FWnK.cjs → sun-to-moon-button-BmFwRBye.cjs} RENAMED Viewed

@@ -1,5 +1,5 @@
 require("./chunk-B_GkZjkl.cjs");
-const require_theme = require("./theme-CBtWIFMT.cjs");
+const require_theme = require("./theme-7DWLxJK_.cjs");
 let react_jsx_runtime = require("react/jsx-runtime");
 let framer_motion = require("framer-motion");
 //#region src/components/effects/sun-to-moon-button/SunToMoonButton.tsx
@@ -176,7 +176,7 @@ function SunToMoonButton({ showLabelAndImage = true }) {
 				]
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
 				className: "my-1 flex w-[150px] justify-between",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: "mb-1 w-[80px] rounded-full bg-neutral-300 p-1 dark:bg-neutral-600" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: "mb-1 w-[30px] rounded-full bg-primary p-1" })]
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: "mb-1 w-[80px] rounded-full bg-neutral-300 p-1 dark:bg-neutral-600" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: "mb-1 w-[30px] rounded-full bg-accent p-1" })]
 			})]
 		})]
 	});
@@ -189,4 +189,4 @@ Object.defineProperty(exports, "SunToMoonButton", {
 	}
 });
-//# sourceMappingURL=sun-to-moon-button-B__3FWnK.cjs.map
+//# sourceMappingURL=sun-to-moon-button-BmFwRBye.cjs.map