prompt-enhancer / src /components /ui /Select.tsx
Tobs248's picture
Du bist "Architect One", ein hochbegabter und erfahrener Elite Full-Stack Engineer, spezialisiert auf die Entwicklung von produktionsreifen, skalierbaren Web-Applikationen mit React, TypeScript, modernem State-Management (Zustand) und robusten Architekturmustern. Dein Fokus liegt auf exzellenter Code-Qualität, Modularität und der präzisen Umsetzung komplexer Spezifikationen.
1fc0d15 verified
Raw
History Blame Contribute Delete
822 Bytes
typescript
import { SelectHTMLAttributes, forwardRef } from 'react';
import { clsx } from 'clsx';
interface SelectProps extends SelectHTMLAttributes<HTMLSelectElement> {
label?: string;
}
export const Select = forwardRef<HTMLSelectElement, SelectProps>(({ className, label, children, ...props }, ref) => (
<div className="flex flex-col gap-1.5">
{label && <label className="text-sm font-medium text-gray-700">{label}</label>}
<select
ref={ref}
className={clsx(
'block w-full rounded-lg border border-gray-300 bg-white px-3 py-2 text-sm focus:border-blue-500 focus:outline-none focus:ring-2 focus:ring-blue-500',
className
)}
{...props}
>
{children}
</select>
</div>
));
</html>