Disabling items
Accordion items can be made disabled by adding the disabled
prop. Disabled items cannot
be toggled by clicking the header and are excluded from keyboard navigation.
import { Accordion, AccordionItem } from '@szhsin/react-accordion';
export default function Example() {
return (
<Accordion>
<AccordionItem header="What is Lorem Ipsum?">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua.
</AccordionItem>
<AccordionItem header="Where does it come from?" disabled>
Quisque eget luctus mi, vehicula mollis lorem. Proin fringilla
vel erat quis sodales. Nam ex enim, eleifend venenatis lectus
vitae, accumsan auctor mi.
</AccordionItem>
<AccordionItem header="Why do we use it?">
Suspendisse massa risus, pretium id interdum in, dictum sit amet
ante. Fusce vulputate purus sed tempus feugiat.
</AccordionItem>
</Accordion>
);
}