"use client"; import { toast } from "sonner"; import { createSchema, InferType } from "@buildnbuzz/buzzform"; import { Form, FormContent, FormFields, FormSubmit, } from "@/registry/base/form"; import { Card, CardContent, CardDescription, CardHeader, CardTitle, } from "@/components/ui/card"; // Pricing plan selection with card variant const pricingSchema = createSchema([ { type: "radio", name: "plan", label: "Select your plan", required: true, options: [ { value: "free", label: "Free", description: "For personal projects and experiments", }, { value: "pro", label: "Pro", description: "For professional developers and small teams", }, { value: "enterprise", label: "Enterprise", description: "For large organizations with custom needs", }, ], ui: { variant: "card", card: { size: "md", bordered: true }, }, }, { type: "radio", name: "billing", label: "Billing cycle", required: true, options: ["Monthly", "Yearly"], defaultValue: "Monthly", ui: { direction: "horizontal" }, }, ]); type PricingSchema = InferType; export default function PricingFormCard() { const handleSubmit = async (data: PricingSchema) => { await new Promise((resolve) => setTimeout(resolve, 500)); toast("Plan selected!", { description: (

          {JSON.stringify(data, null, 2)}

), }); }; return ( Choose a Plan Select the plan that best fits your needs. ); }