{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "faq",
  "title": "FAQ section",
  "description": "A centered FAQ section — an accordion of common questions with a contact call-to-action footer.",
  "registryDependencies": [
    "accordion",
    "button"
  ],
  "files": [
    {
      "path": "registry/blocks/faq.tsx",
      "content": "import {\n  Accordion,\n  AccordionContent,\n  AccordionItem,\n  AccordionTrigger,\n} from '@/components/ui/accordion'\nimport { Button } from '@/components/ui/button'\n\nconst faqs = [\n  {\n    q: 'Can I use Quill in a commercial project?',\n    a: 'Yes. The theme, tokens, and every pattern ship under a permissive license — attribution is appreciated, never required.',\n  },\n  {\n    q: 'How do I install the theme?',\n    a: 'One command: npx shadcn add with our registry URL. Tokens, dark mode, and typography come wired together.',\n  },\n  {\n    q: 'Does dark mode come for free?',\n    a: 'Every token has a dusk counterpart, so components and patterns flip automatically when data-theme is set to dark.',\n  },\n  {\n    q: 'What about accessibility?',\n    a: 'The system targets WCAG 2.1 AA. Every Storybook story runs an enforced axe audit, and contrast decisions are documented in the foundations.',\n  },\n]\n\n/** A centered FAQ section — an accordion of common questions with a contact call-to-action footer. */\nexport function Faq() {\n  return (\n    <section className=\"flex w-[560px] flex-col gap-6\">\n      <div className=\"flex flex-col items-center gap-2 text-center\">\n        <span className=\"text-xs font-medium tracking-eyebrow uppercase text-ink-muted\">FAQ</span>\n        <h2 className=\"font-heading text-2xl text-foreground\">Common questions</h2>\n        <p className=\"text-sm text-muted-foreground\">\n          Everything else lives in the docs — or ask us directly.\n        </p>\n      </div>\n      <Accordion defaultValue={['item-0']} className=\"w-full\">\n        {faqs.map((f, i) => (\n          <AccordionItem key={i} value={`item-${i}`}>\n            <AccordionTrigger>{f.q}</AccordionTrigger>\n            <AccordionContent>{f.a}</AccordionContent>\n          </AccordionItem>\n        ))}\n      </Accordion>\n      <div className=\"flex items-center justify-center gap-3 rounded-lg bg-card p-4 ring-1 ring-foreground/10\">\n        <span className=\"text-sm text-muted-foreground\">Still curious?</span>\n        <Button variant=\"outline\" size=\"sm\">\n          Talk to the team\n        </Button>\n      </div>\n    </section>\n  )\n}\n",
      "type": "registry:component",
      "target": "components/quill/faq.tsx"
    }
  ],
  "meta": {
    "intent": [
      "content",
      "marketing"
    ],
    "use_when": "You need to answer common questions in an accordion with a contact fallback.",
    "not_for": "you need a bare accordion with no marketing framing (heading, contact footer) around it → accordion; the user needs to ask something not covered — this pattern only offers a CTA button, not the form itself → contact-form"
  },
  "docs": "A centered FAQ section — an accordion of common questions with a contact call-to-action footer. Do: Open the first question by default (defaultValue=['item-0']) so the section doesn't read as empty on load. Don't: Start every item collapsed and force a first click just to prove the section has content. Use accordion when you need a bare accordion with no marketing framing (heading, contact footer) around it. Use contact-form when the user needs to ask something not covered — this pattern only offers a CTA button, not the form itself.",
  "categories": [
    "content",
    "marketing"
  ],
  "type": "registry:block"
}