AccordionDemo() — ui Function Reference

Architecture documentation for the AccordionDemo() function in accordion-demo.tsx from the ui codebase.

Function tsx DocumentationAtlas ContentSourcing

Entity Profile

DocumentationAtlas→ ContentSourcing→ AccordionDemo() — ui Function Reference

Dependency Diagram

graph TD
  a434a983_ee24_da84_2f5d_68aff0a5e3ce["AccordionDemo()"]
  8a471a45_64c3_b982_5964_c0c2a500936c["accordion-demo.tsx"]
  a434a983_ee24_da84_2f5d_68aff0a5e3ce -->|defined in| 8a471a45_64c3_b982_5964_c0c2a500936c
  style a434a983_ee24_da84_2f5d_68aff0a5e3ce fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/examples/base/accordion-demo.tsx lines 8–34

export default function AccordionDemo() {
  return (
    <Accordion defaultValue={["shipping"]} className="max-w-lg">
      <AccordionItem value="shipping">
        <AccordionTrigger>What are your shipping options?</AccordionTrigger>
        <AccordionContent>
          We offer standard (5-7 days), express (2-3 days), and overnight
          shipping. Free shipping on international orders.
        </AccordionContent>
      </AccordionItem>
      <AccordionItem value="returns">
        <AccordionTrigger>What is your return policy?</AccordionTrigger>
        <AccordionContent>
          Returns accepted within 30 days. Items must be unused and in original
          packaging. Refunds processed within 5-7 business days.
        </AccordionContent>
      </AccordionItem>
      <AccordionItem value="support">
        <AccordionTrigger>How can I contact customer support?</AccordionTrigger>
        <AccordionContent>
          Reach us via email, live chat, or phone. We respond within 24 hours
          during business days.
        </AccordionContent>
      </AccordionItem>
    </Accordion>
  )
}