CTA 1

1import Link from "next/link";
2 
3import type { CTA_1_Block } from "~/payload-types";
4 
5import { Button } from "@/registry/ui/button";
6 
7export * from "./config";
8 
9export default function CallToAction(props: NonNullable<CTA_1_Block>) {
10	return (
11		<section className="py-16 md:py-32">
12			<div className="mx-auto max-w-5xl px-6">
13				<div className="text-center">
14					<h2 className="text-4xl font-semibold text-balance lg:text-5xl">
15						{props.header}
16					</h2>
17					<p className="mt-4">{props.subheader}</p>
18 
19					<div className="mt-12 flex flex-wrap justify-center gap-4">
20						{(props.actions ?? []).map((action, index) => {
21							return (
22								<Button
23									asChild
24									key={`CTA_1_Block-action-${index}`}
25									size="lg"
26									variant={index % 2 === 1 ? "outline" : undefined}
27								>
28									<Link href={action.href ?? "/"}>
29										<span>{action.label ?? "Get Started"}</span>
30									</Link>
31								</Button>
32							);
33						})}
34					</div>
35				</div>
36			</div>
37		</section>
38	);
39}