1import { PricingCards } from "@/registry/components/pricing-cards"
2
3const plans = [
4  {
5    id: "basic",
6    name: "Basic",
7    description: "Perfect for getting started",
8    price: { monthly: 9, yearly: 90, currency: "$" },
9    features: [
10      { text: "Up to 1,000 API calls", included: true },
11      { text: "Basic support", included: true },
12      { text: "Advanced analytics", included: false },
13    ],
14    cta: { text: "Get Started" },
15  },
16  {
17    id: "pro",
18    name: "Pro",
19    description: "Best for growing businesses",
20    price: { monthly: 29, yearly: 290, currency: "$" },
21    features: [
22      { text: "Up to 10,000 API calls", included: true },
23      { text: "Priority support", included: true },
24      { text: "Advanced analytics", included: true },
25    ],
26    cta: { text: "Start Free Trial" },
27    popular: true,
28  },
29]
30
31export function Component() {
32  return (
33    <PricingCards
34      plans={plans}
35      onPlanSelect={(planId) => console.log("Selected:", planId)}
36    />
37  )
38}