// Client/Server Component // "use client" // uncomment when required for: hooks, event handlers, browser APIs /** * @name CTA 01 * @description A simple centered call-to-action section with heading, * description, and dual action buttons. Clean and conversion-focused. * * @slots cta, cta-container, cta-content, cta-heading, cta-description, * cta-actions, cta-primary, cta-secondary * @variant centered * * @registryDependencies button-link button * @dependencies lucide-react */ import * as React from "react" import { ArrowRight } from "lucide-react" import { cn } from "@/registry/lib/utils" import { ButtonLink } from "@/registry/ui/button-link" // ============================================================================ // TYPES // ============================================================================ interface CtaConfig { /** Button text */ text: string /** Link destination */ href: string } interface Cta01Props { /** Main heading */ heading?: string /** Supporting description */ description?: string /** Primary CTA button */ primaryCta?: CtaConfig /** Secondary CTA button */ secondaryCta?: CtaConfig /** Additional CSS classes */ className?: string } // ============================================================================ // COMPONENT // ============================================================================ function Cta01({ heading = "Ready to get started?", description = "Join thousands of satisfied customers using our platform to build amazing products.", primaryCta = { text: "Get started", href: "#" }, secondaryCta = { text: "Learn more", href: "#" }, className, }: Cta01Props) { return (

{heading}

{description && (

{description}

)}

{primaryCta && ( {primaryCta.text} )} {secondaryCta && ( {secondaryCta.text} )}

) } export default Cta01 export { Cta01, type Cta01Props, type CtaConfig }