import { ChevronDown, LucideProps } from "lucide-react"; import { DetailedHTMLProps, ForwardRefExoticComponent, InputHTMLAttributes, LabelHTMLAttributes, RefAttributes, RefObject, SelectHTMLAttributes, } from "react"; import { twMerge } from "tailwind-merge"; type SelectOptionObject = { title: string; value: string; default?: boolean; }; type SelectProps = DetailedHTMLProps< SelectHTMLAttributes, HTMLSelectElement > & { options: SelectOptionObject[]; label?: string; showLabel?: boolean; wrapperProps?: DetailedHTMLProps< InputHTMLAttributes, HTMLDivElement >; labelProps?: DetailedHTMLProps< LabelHTMLAttributes, HTMLLabelElement >; componentRef?: RefObject; iconProps?: LucideProps; changeHandler?: (value: SelectProps["options"][number]["value"]) => void; }; /** * # Select Element * @className twui-select-wrapper * @className twui-select * @className twui-select-dropdown-icon */ export default function Select({ label, options, componentRef, labelProps, wrapperProps, showLabel, iconProps, changeHandler, ...props }: SelectProps) { return (
{showLabel && ( )}
); }