{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "cta-1",
  "title": "CTA 1: framed call to action",
  "author": "Ballmac <https://ui.ballmac.com>",
  "description": "A closing call-to-action panel: large heading, one line of reassurance and two buttons, over a softly lit animated grid.",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "utils",
    "https://ui.ballmac.com/r/animated-grid.json",
    "https://ui.ballmac.com/r/button.json"
  ],
  "files": [
    {
      "path": "registry/ballmac/components/blocks/cta-1/cta-1.tsx",
      "content": "// Ballmac UI: CTA 1. https://ui.ballmac.com/blocks/cta-1\nimport * as React from \"react\"\nimport { ArrowRight } from \"lucide-react\"\n\nimport { AnimatedGrid } from \"@/components/ballmac/animated-grid\"\nimport { buttonVariants } from \"@/components/ballmac/button\"\nimport { cn } from \"@/lib/utils\"\n\ntype Cta1Props = Omit<React.ComponentProps<\"section\">, \"title\"> & {\n  /** The heading. */\n  title?: string\n  /** One sentence under the heading. */\n  description?: string\n  /** Main call to action. */\n  primaryAction?: { label: string; href: string }\n  /** Secondary call to action. */\n  secondaryAction?: { label: string; href: string }\n}\n\nfunction Cta1({\n  title = \"Ready when you are.\",\n  description = \"Set up your first project in under a minute. No credit card required.\",\n  primaryAction = { label: \"Get started\", href: \"#\" },\n  secondaryAction = { label: \"Talk to sales\", href: \"#\" },\n  className,\n  ...props\n}: Cta1Props) {\n  return (\n    <section data-slot=\"cta-1\" className={cn(\"mx-auto max-w-6xl px-4 py-20 sm:px-6\", className)} {...props}>\n      <div className=\"relative isolate overflow-hidden rounded-3xl border bg-card px-6 py-16 text-center sm:px-12 md:py-24\">\n        <AnimatedGrid className=\"absolute inset-0 -z-10 [mask-image:radial-gradient(ellipse_60%_70%_at_50%_50%,#000_20%,transparent_75%)]\" />\n        <h2 className=\"mx-auto max-w-2xl text-3xl font-semibold tracking-[-0.035em] text-balance sm:text-5xl\">{title}</h2>\n        <p className=\"mx-auto mt-4 max-w-xl text-lg text-muted-foreground\">{description}</p>\n        <div className=\"mt-8 flex flex-wrap justify-center gap-3\">\n          <a className={buttonVariants({ size: \"lg\", shape: \"pill\" })} href={primaryAction.href}>\n            {primaryAction.label} <ArrowRight  className=\"rtl:rotate-180\"/>\n          </a>\n          <a className={buttonVariants({ variant: \"outline\", size: \"lg\", shape: \"pill\" })} href={secondaryAction.href}>{secondaryAction.label}</a>\n        </div>\n      </div>\n    </section>\n  )\n}\n\nexport { Cta1, type Cta1Props }\n",
      "type": "registry:component",
      "target": "@components/ballmac/blocks/cta-1/cta-1.tsx"
    }
  ],
  "meta": {
    "schema": 1,
    "tier": "free",
    "tags": [
      "cta",
      "call to action",
      "signup",
      "landing"
    ],
    "version": "1.0.0",
    "updated": "2026-09-28",
    "ai": {
      "summary": "The last section before the footer: one decisive action. Edit title, description and the two actions.",
      "whenToUse": [
        "End of landing and pricing pages",
        "Between long content sections to prompt sign-up"
      ],
      "whenNotToUse": [
        "Top of the page (use a hero)"
      ],
      "composesWith": [
        "footer-1",
        "faq-1"
      ],
      "a11y": [],
      "customization": [
        "title, description, primaryAction, secondaryAction props"
      ]
    },
    "examples": [
      "cta-1-demo"
    ],
    "url": "https://ui.ballmac.com/components/cta-1"
  },
  "categories": [
    "blocks",
    "cta"
  ],
  "type": "registry:block"
}