"use client"; import { useMemo } from "react"; import { motion } from "framer-motion"; import { cn } from "@/lib/utils"; const seededRand = (i: number) => Math.abs(Math.sin(i * 12.9898) * 43758.5453) % 1; export function AnimatedGridPattern({ className, cols = 14, rows = 8, litCount = 10, }: { className?: string; cols?: number; rows?: number; litCount?: number; }) { const cells = useMemo(() => { const total = cols * rows; return Array.from({ length: total }, (_, i) => ({ id: i, x: i % cols, y: Math.floor(i / cols), })); }, [cols, rows]); const litCells = useMemo(() => { const total = cols * rows; const picks: { id: number; delay: number; duration: number }[] = []; for (let i = 0; i < litCount; i++) { const id = Math.floor(seededRand(i * 7 + 3) * total); picks.push({ id, delay: seededRand(i * 13 + 1) * 4, duration: 2 + seededRand(i * 17 + 5) * 2.5, }); } return picks; }, [cols, rows, litCount]); return (

Animated Grid Pattern

A quiet lattice with cells that breathe light at random, like a server room at 3am.

); } export default function Demo() { return ; }