{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"c-accordion-5","type":"registry:block","title":"Accordion with disabled items and highlighted state","description":"Accordion with disabled items and highlighted state","dependencies":[],"registryDependencies":["accordion"],"files":[{"path":"c-accordion-5.tsx","type":"registry:block","content":"import {\n  Accordion,\n  AccordionContent,\n  AccordionItem,\n  AccordionTrigger,\n} from \"@/components/ui/accordion\"\n\nconst items = [\n  {\n    value: \"item-1\",\n    trigger: \"Can I access my account history?\",\n    content:\n      \"Yes, you can view your complete account history including all transactions, plan changes, and support tickets in the Account History section of your dashboard.\",\n    disabled: false,\n  },\n  {\n    value: \"item-2\",\n    trigger: \"Premium feature information (Locked)\",\n    content:\n      \"This section contains information about premium features. Upgrade your plan to access this content.\",\n    disabled: true,\n  },\n  {\n    value: \"item-3\",\n    trigger: \"How do I update my email address?\",\n    content:\n      \"You can update your email address in your account settings. You'll receive a verification email at your new address to confirm the change.\",\n    disabled: false,\n  },\n]\n\nexport function Pattern() {\n  return (\n    <div className=\"mx-auto mb-auto w-full max-w-lg\">\n      <Accordion\n        multiple={false}\n        defaultValue={[\"item-1\"]}\n        className=\"border-border rounded-lg overflow-hidden border\"\n      >\n        {items.map((item) => (\n          <AccordionItem\n            key={item.value}\n            value={item.value}\n            disabled={item.disabled}\n            className=\"data-open:bg-muted/50 **:data-[slot=accordion-content]:p-0!\"\n          >\n            <AccordionTrigger className=\"px-4 py-4 hover:no-underline\">\n              {item.trigger}\n            </AccordionTrigger>\n            <AccordionContent className=\"px-4! pt-0 pb-4\">\n              {item.content}\n            </AccordionContent>\n          </AccordionItem>\n        ))}\n      </Accordion>\n    </div>\n  )\n}","target":"components/examples/c-accordion-5.tsx"}],"meta":{"order":5,"label":"Disabled Items"}}