42 lines
1.1 KiB
TypeScript
42 lines
1.1 KiB
TypeScript
import React from 'react';
|
|
|
|
export type SetStateInputMethod<NameType> = (name: NameType, newValue: string) => void;
|
|
|
|
interface ISimpleInput<NameType> {
|
|
inputData: {
|
|
title: string;
|
|
name: string;
|
|
};
|
|
className?: string;
|
|
stateHanlder: {
|
|
state: string;
|
|
setState: SetStateInputMethod<NameType>;
|
|
};
|
|
}
|
|
|
|
export default function SimpleInput<NameType>(props: ISimpleInput<NameType>) {
|
|
const { className, inputData, stateHanlder } = props;
|
|
const { name, title } = inputData;
|
|
const { setState, state } = stateHanlder;
|
|
|
|
const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
|
const { value, name: inputName } = e.target;
|
|
setState(inputName as NameType, value);
|
|
};
|
|
|
|
return (
|
|
<div className={`flex flex-col ${className}`}>
|
|
<label className='mb-1 text-txt-second text-xs' htmlFor={title}>
|
|
{title}
|
|
</label>
|
|
<input
|
|
value={state}
|
|
onChange={handleInputChange}
|
|
name={name}
|
|
className='bg-bg-gray h-11 rounded-lg focus:outline-0 px-2 text-txt-medium w-full'
|
|
id={title}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|