"use client"; import { motion } from "framer-motion"; import { Button } from "@/components/ui/button"; function FloatingPaths({ position }: { position: number }) { const paths = Array.from({ length: 36 }, (_, i) => ({ id: i, d: `M-${380 - i * 5 * position} -${189 + i * 6}C-${ 380 - i * 5 * position } -${189 + i * 6} -${312 - i * 5 * position} ${216 - i * 6} ${ 152 - i * 5 * position } ${343 - i * 6}C${616 - i * 5 * position} ${470 - i * 6} ${ 684 - i * 5 * position } ${875 - i * 6} ${684 - i * 5 * position} ${875 - i * 6}`, color: `rgba(15,23,42,${0.1 + i * 0.03})`, width: 0.5 + i * 0.03, })); return (
Background Paths {paths.map((path) => ( ))}
); } export function BackgroundPaths({ title = "Background Paths", }: { title?: string; }) { const words = title.split(" "); return (

{words.map((word, wordIndex) => ( {word.split("").map((letter, letterIndex) => ( {letter} ))} ))}

); }