import { ComboboxButtonProps, ComboboxButton as HeadlessComboboxButton } from '@headlessui/react'; import { ChevronDownIcon } from '@heroicons/react/16/solid'; import clsx from 'clsx'; export default function ComboboxButton({ className, ...props }: ComboboxButtonProps) { return ( <HeadlessComboboxButton className={clsx( 'group absolute inset-y-0 right-0 px-2.5', 'data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50', className )} {...props} > <ChevronDownIcon className="fill-black/60 group-data-[hover]:fill-black size-5" /> </HeadlessComboboxButton> ); }