Class Input

src/components/input/input.tsx:71–159

}

export class Input extends React.Component<IInputProps, InputState> {
    static TextArea: typeof TextArea;

    static defaultProps = {
        type: 'text',
    };

    input: HTMLInputElement | HTMLTextAreaElement | null = null;

    constructor(props: IInputProps) {
        super(props);
        const value =
            typeof props.value === 'undefined'
                ? props.defaultValue
                : props.value;

        this.state = {
            value,
            prevValue: props.value,
        };
    }

    static getDerivedStateFromProps(
        nextProps: IInputProps,
        { prevValue }: InputState
    ) {
        const newState: Partial<InputState> = { prevValue: nextProps.value };

        if (nextProps.value !== undefined || prevValue !== nextProps.value) {
            newState.value = nextProps.value;
        }
        return newState;
    }

    saveInput = (input: HTMLInputElement) => {
        this.input = input;
    };

    setValue(value: string) {
        if (this.props.value === undefined) {
            this.setState({ value });
        }
    }

    handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
        const { onChange } = this.props;

        this.setValue(e.target.value);
        if (typeof onChange === 'function')
            resolveOnChange(this.input, e, onChange);
    };

    handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
        const { onPressEnter, onKeyDown } = this.props;

        if (e.key === KeyCodes.ENTER) {
            onPressEnter?.(e);
        }