File size: 1,170 Bytes
41a71fd |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 |
import { InputHTMLAttributes, useEffect, useRef } from 'react';
import Inputmask from 'inputmask';
import { classNames } from '@/shared/lib/classNames/classNames';
import cls from './Input.module.scss';
type HTMLInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'>;
interface InputProps extends HTMLInputProps {
className?: string;
value?: string;
onChange?: (value: string) => void;
inputRef?: (ref: any) => void;
mask?: string;
maskOptions?: any;
}
export const Input = (props: InputProps) => {
const { className, value, onChange, inputRef, mask, maskOptions, ...otherProps } = props;
const inputRefValue = useRef(null);
if (inputRefValue.current && (mask || maskOptions)) new Inputmask(mask, maskOptions).mask(inputRefValue.current);
useEffect(() => {
if (inputRef) inputRef(inputRefValue.current);
}, [inputRefValue.current]);
return (
<input
ref={inputRefValue}
className={classNames(cls.Input, {}, [className])}
value={value}
onChange={(e) => onChange?.(e.target.value)}
{...otherProps}
/>
);
};
|