import { Transition } from '@headlessui/react'; import classNames from 'classnames'; import React, { PropsWithChildren, useState } from 'react'; interface Props { align?: string; width?: string | number; contentClasses?: string; renderTrigger(): JSX.Element; } export default function Dropdown({ align = 'right', width = '48', contentClasses = 'py-1 bg-white dark:bg-gray-700', renderTrigger, children, }: PropsWithChildren) { const [open, setOpen] = useState(false); const widthClass = { '48': 'w-48', }[width.toString()]; const alignmentClasses = (() => { if (align === 'left') { return 'origin-top-left left-0'; } else if (align === 'right') { return 'origin-top-right right-0'; } else { return 'origin-top'; } })(); return (
setOpen(!open)}>{renderTrigger()}
{/* */}
setOpen(false)} />
setOpen(false)} >
{children}
); }