32 lines
833 B
TypeScript
32 lines
833 B
TypeScript
import { forwardRef, useRef } from 'react';
|
|
|
|
interface InputProps {
|
|
value: string;
|
|
onChange: (value: string) => void;
|
|
onKeyDown?: React.KeyboardEventHandler<HTMLInputElement>;
|
|
placeholder?: string;
|
|
disabled?: boolean;
|
|
className?: string;
|
|
}
|
|
|
|
export const Input = forwardRef<HTMLInputElement, InputProps>(
|
|
({ value, onChange, onKeyDown, placeholder, disabled, className = '' }, ref) => {
|
|
const innerRef = useRef<HTMLInputElement>(null);
|
|
const combinedRef = ref || innerRef;
|
|
|
|
return (
|
|
<input
|
|
ref={combinedRef}
|
|
type="text"
|
|
className={`search-input ${className}`}
|
|
value={value}
|
|
onChange={(e) => onChange(e.target.value)}
|
|
onKeyDown={onKeyDown}
|
|
placeholder={placeholder}
|
|
disabled={disabled}
|
|
/>
|
|
);
|
|
},
|
|
);
|
|
|
|
Input.displayName = 'Input'; |