feat(SW-3219): Move accordion to design-system * Inline types * Move Accordion to design-system Approved-by: Bianca Widstam
31 lines
775 B
TypeScript
31 lines
775 B
TypeScript
import { Children, cloneElement, isValidElement } from 'react'
|
|
|
|
import { accordionVariants } from './variants'
|
|
|
|
import type { VariantProps } from 'class-variance-authority'
|
|
|
|
import type { AccordionItemProps } from './AccordionItem'
|
|
|
|
interface AccordionProps
|
|
extends React.HtmlHTMLAttributes<HTMLUListElement>,
|
|
VariantProps<typeof accordionVariants> {}
|
|
|
|
export default function Accordion({
|
|
children,
|
|
className,
|
|
theme,
|
|
variant,
|
|
}: AccordionProps) {
|
|
return (
|
|
<ul className={accordionVariants({ className, variant, theme })}>
|
|
{Children.map(children, (child) => {
|
|
if (isValidElement<AccordionItemProps>(child)) {
|
|
return cloneElement(child, { variant, theme })
|
|
} else {
|
|
return child
|
|
}
|
|
})}
|
|
</ul>
|
|
)
|
|
}
|