el.xwx.moe/components/TextInput.tsx

36 lines
866 B
TypeScript
Raw Normal View History

2023-08-17 15:05:44 -05:00
import { ChangeEventHandler, KeyboardEventHandler } from "react";
type Props = {
autoFocus?: boolean;
value?: string;
type?: string;
placeholder?: string;
onChange: ChangeEventHandler<HTMLInputElement>;
onKeyDown?: KeyboardEventHandler<HTMLInputElement> | undefined;
className?: string;
};
export default function TextInput({
autoFocus,
value,
type,
placeholder,
onChange,
onKeyDown,
className,
}: Props) {
return (
<input
autoFocus={autoFocus}
type={type ? type : "text"}
placeholder={placeholder}
value={value}
onChange={onChange}
onKeyDown={onKeyDown}
className={`w-full rounded-md p-2 border-neutral-content bg-gray-100 dark:bg-neutral-950 border-solid border outline-none focus:border-sky-300 focus:dark:border-sky-600 duration-100 ${
2023-10-28 11:50:11 -05:00
className || ""
}`}
2023-08-17 15:05:44 -05:00
/>
);
}