Accordion - edithspace/ui

Stay updated about new components on Twitter

Preview

Installation

bash

npx edithspace-ui add accordion

tsx

import { Accordion, AccordionHeader, AccordionContent, AccordionProvider } from "@/components/edithspace-ui/Accordion";

Basic Usage

import {
  Accordion,
  AccordionContent,
  AccordionHeader,
  AccordionProvider,
} from "@/components/edithspace-ui/Accordion";

export const MyComponent = () => {
  return (
    <AccordionProvider allowMultiple>

With Custom Icon

import { FiInfo } from "react-icons/fi";

<Accordion icon={<FiInfo />}>
  <AccordionHeader>With Custom Icon</AccordionHeader>
  <AccordionContent>
    This accordion has a custom icon in the header.
  </AccordionContent>
</Accordion>

Props Reference

Prop Name

Type

Default

Description

Prop Name	Type	Default	Description