comparison-table/
├── ComparisonTable.tsx   # ComparisonTable component & demo data
├── index.ts              # Module entry point (re-exports)
└── block.json            # Block metadata configuration

import { ComparisonTable } from "@/components/blocks/comparison-table";
 
export default function Page() {
  return <ComparisonTable />;
}

import { ComparisonTable } from "@/components/blocks/comparison-table";
import type { ComparisonPlan, ComparisonFeature } from "@/components/blocks/comparison-table";
 
const plans: ComparisonPlan[] = [
  { id: "free",  name: "Free",  price: { monthly: 0 } },
  { id: "pro",   name: "Pro",   price: { monthly: 20, annual: 17 }, highlighted: true, badge: "Most Popular" },
  { id: "team",  name: "Team",  price: { monthly: 25, annual: 20 }, badge: "Best Value" },
];
 
const features: ComparisonFeature[] = [
  {
    category: "Usage",
    label: "Messages per day",
    values: { free: "Limited", pro: "5× Free", team: "Pooled" },
  },
  {
    category: "Usage",
    label: "Priority access",
    values: { free: false, pro: true, team: true },
  },
  {
    category: "Features",
    label: "Claude Code",
    values: { free: false, pro: true, team: true },
  },
];
 
export default function Page() {
  return (
    <ComparisonTable
      plans={plans}
      features={features}
      billingToggle
      ctaLabel="Get Started"
      onCtaClick={(planId) => console.log("Selected:", planId)}
    />
  );
}