Import source: src/components/ui/TextInput

Import the existing local project snapshot. This commit organizes existing files; it does not represent newly developed functionality.
This commit is contained in:
arsam
2026-09-18 23:17:32 +03:30
parent f4cdd8085c
commit 14b8e08517
+26
View File
@@ -0,0 +1,26 @@
interface Props {
label: string; optional?: boolean;
value: string; onChange: (v: string) => void;
placeholder?: string; type?: string;
}
export function TextInput({ label, optional, value, onChange, placeholder, type = 'text' }: Props) {
return (
<div className="flex flex-col gap-2">
<label className="text-[15px] font-semibold flex items-center gap-1.5" style={{ color: 'var(--text-primary)' }}>
{label}
{optional && <span className="text-[13px] font-normal" style={{ color: 'var(--text-muted)' }}>(optional)</span>}
</label>
<input
type={type} value={value} onChange={e => onChange(e.target.value)} placeholder={placeholder}
className="h-12 px-4 rounded-[11px] text-[14px] outline-none transition-all"
style={{
background: 'var(--bg-input)', border: '1px solid var(--border-sub)',
color: 'var(--text-primary)',
}}
onFocus={e => { e.currentTarget.style.borderColor = '#7C6FE0'; e.currentTarget.style.boxShadow = '0 0 0 3px rgba(124,111,224,0.12)'; }}
onBlur={e => { e.currentTarget.style.borderColor = 'var(--border-sub)'; e.currentTarget.style.boxShadow = 'none'; }}
/>
</div>
);
}