Files
frontend/src/components/ui/Input.tsx
pradeepkumar 0c7239d7a8 main layout
2026-01-11 22:09:41 +05:30

30 lines
880 B
TypeScript

'use client';
import { InputHTMLAttributes, ReactNode } from 'react';
interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
label?: string;
icon?: ReactNode;
}
export function Input({ label, icon, className = '', ...props }: InputProps) {
return (
<div className="flex flex-col gap-1">
{label && (
<label className="text-sm font-medium text-[#00293d]">{label}</label>
)}
<div className="relative">
{icon && (
<span className="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400">
{icon}
</span>
)}
<input
className={`w-full px-4 py-3 rounded-lg border border-gray-200 focus:border-[#00293d] focus:ring-2 focus:ring-[#00293d]/20 outline-none transition-all ${icon ? 'pl-10' : ''} ${className}`}
{...props}
/>
</div>
</div>
);
}