Ninety Percent Muffin

    @stnew/accordion
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.2 • Public • Published

    Accordion

    The Accordion component collapses content in areas with limited space. It consists of a clickable header item and a content area that shows/hides when the header is clicked. The Accordion will render a +/- icon for close/expanded sections in the header and add a border between them, but otherwise make no assumptions about style.

    Example

    <Accordion>
      {items.map(item => {
        return <AccordionItem header={item.header} content={item.content} />
      })}
    </Accordion>

    Props

    Note: The <Accordion> wrapper will only accept <AccordionItem> components.

    By default, the first AccordionItem is toggled open.

    • collapseAll: Will default all AccordionItems to closed
    prop type
    collapseAll boolean

    AccordionItem Props

    • header: The component for the header
    • content: The component for the content that will toggle when you click on the header.
    • open: If set to true, the AccordionItem will default to expanded
    prop type
    header ReactElement
    content ReactElement
    open boolean

    Keywords

    none

    Install

    npm i @stnew/accordion

    DownloadsWeekly Downloads

    1

    Version

    1.0.2

    License

    ISC

    Unpacked Size

    25.3 kB

    Total Files

    23

    Last publish

    Collaborators

    • returningsam
    • cabe
    • ryanhefner
    • artofrawr