GRV-Summit-Site/components/forms/DataConsentField.tsx
kirukib cb404ec079
Some checks failed
Deploy to Cloudflare Workers (OpenNext) / deploy (push) Has been cancelled
Align site colors with GRV brand book palette.
Centralize primary, secondary, tertiary, and neutral tokens and apply them across theme variables and UI components.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-06-04 14:45:22 +03:00

52 lines
1.3 KiB
TypeScript

"use client";
import Link from "next/link";
import { Checkbox } from "@/components/ui/checkbox";
import { Label } from "@/components/ui/label";
import { dataConsent } from "@/content/consent";
import { cn } from "@/lib/utils";
type Props = {
id: string;
checked: boolean;
onCheckedChange: (checked: boolean) => void;
/** Defaults to standard form consent; use `payment` for checkout */
variant?: "default" | "payment";
className?: string;
};
export function DataConsentField({
id,
checked,
onCheckedChange,
variant = "default",
className,
}: Props) {
const labelPrefix =
variant === "payment" ? dataConsent.paymentLabel : dataConsent.label;
return (
<div
className={cn(
"flex items-start gap-3 rounded-lg border border-border bg-muted/30 p-4",
className
)}
>
<Checkbox
id={id}
checked={checked}
onCheckedChange={(v) => onCheckedChange(v === true)}
className="mt-0.5"
required
/>
<Label htmlFor={id} className="text-sm font-normal leading-snug text-muted-foreground">
{labelPrefix}{" "}
<Link href="/privacy" className="font-medium text-[#37a47a] underline underline-offset-2">
{dataConsent.privacyLinkText}
</Link>
.
</Label>
</div>
);
}