nestjs_boilerpalte/client/app/component/ui/input.tsx
2024-12-13 09:36:41 +01:00

25 lines
727 B
TypeScript

interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
label?: string;
error?: string;
}
export function Input({ label, error, ...props }: InputProps) {
return (
<div className="space-y-2">
{label && (
<label className="text-sm font-medium text-gray-700 dark:text-gray-300">
{label}
</label>
)}
<input
{...props}
className={`w-full px-3 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500
dark:bg-gray-800 dark:border-gray-700 dark:text-white ${
error ? "border-red-500" : "border-gray-300"
}`}
/>
{error && <p className="text-sm text-red-500">{error}</p>}
</div>
);
}