"use client" import React from "react" import Link from "next/link" import { motion } from "motion/react" import { useTheme } from "next-themes" import { cn } from "@/lib/utils" type CtaVariant = "dark" | "light" interface CtaSectionProps { /** Override app theme when set; otherwise follows the theme toggler */ variant?: CtaVariant } const CtaSection = ({ variant }: CtaSectionProps) => { const { resolvedTheme } = useTheme() const [mounted, setMounted] = React.useState(false) React.useEffect(() => { setMounted(true) }, []) // Use resolvedTheme only after mount to avoid hydration mismatch (server has no theme) const theme = (variant ?? (mounted ? resolvedTheme : undefined) ?? "dark") as CtaVariant const isLight = theme === "light" return ( <> {/* Outer wrapper: full-width extended background (top and bottom) */}

{/* Full-width subtle grid that extends across the section */}

{/* Inner CTA container: content band with focused grid */}

{/* Subtle grid background (radial mask for content area) */}

Lightweight Analytics Built For Simplicity Track page views and visitors in real-time with a lightweight, privacy-first tool made for developers. {/* Get Started */}

) } export default CtaSection function TextGlitch({ text }: { text: string }) { return (

{text} {text} {text}

) }

Cta 01

Instalação

Dependências

Registry dependencies