AccordionBorders() — ui Function Reference

Architecture documentation for the AccordionBorders() function in accordion-borders.tsx from the ui codebase.

Function tsx DocumentationAtlas SearchAPI

Entity Profile

DocumentationAtlas→ SearchAPI→ AccordionBorders() — ui Function Reference

Dependency Diagram

graph TD
  5ff9ae88_e28b_b94d_912d_546e80e8bfe6["AccordionBorders()"]
  2ace3f36_8868_f8b4_9ac8_6dc0ac855f44["accordion-borders.tsx"]
  5ff9ae88_e28b_b94d_912d_546e80e8bfe6 -->|defined in| 2ace3f36_8868_f8b4_9ac8_6dc0ac855f44
  style 5ff9ae88_e28b_b94d_912d_546e80e8bfe6 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/examples/radix/accordion-borders.tsx lines 29–49

export default function AccordionBorders() {
  return (
    <Accordion
      type="single"
      collapsible
      className="max-w-lg rounded-lg border"
      defaultValue="billing"
    >
      {items.map((item) => (
        <AccordionItem
          key={item.value}
          value={item.value}
          className="border-b px-4 last:border-b-0"
        >
          <AccordionTrigger>{item.trigger}</AccordionTrigger>
          <AccordionContent>{item.content}</AccordionContent>
        </AccordionItem>
      ))}
    </Accordion>
  )
}