useInputValue.ts

useInputValue.ts

import { useCallback, useState } from 'react';
import { InputStatus } from '../enums';
import type { InputState } from '../types'


type callback = () => unknown

type InputReturn<T> = {
  clearAll(): void;
  clearMessage(): void;
  clearStatus(): void;
  invalidate(msg: string, cb?: callback): void;
  isInvalid: boolean;
  isValid: boolean;
  setStatus(status: InputStatus): void;
  setStatusMessage(val: string): void;
  setValue(val: T): void;
  state: InputState<T>
  validate(cb?: callback): void;
}

function useInputValue<T>(initialValue: T): InputReturn<T> {
  const [value, _setValue] = useState<T>(initialValue);
  const [message, _setMessage] = useState<string>('');
  const [status, _setStatus] = useState<InputStatus>(InputStatus.UNKNOWN);

  const clearAll = useCallback((): void => {
    _setValue(initialValue);
    _setStatus(InputStatus.UNKNOWN);
    _setMessage('');
  }, [initialValue]);

  const clearMessage = useCallback((): void => _setMessage(''), [])

  const clearStatus = useCallback(() => {
    _setStatus(InputStatus.UNKNOWN);
    _setMessage('');
  }, []);

  const invalidate = useCallback((msg?: string, cb?: callback): void => {
    _setStatus(InputStatus.INVALID);
    _setMessage(msg || '');
    if (cb) cb()
  }, []);

  const onChange = useCallback((val: T): void => {
    _setStatus(InputStatus.UNKNOWN);
    _setValue(val);
  }, []);

  const setStatus = useCallback((status: InputStatus) => _setStatus(status), [])
  const setStatusMessage = useCallback((message: InputStatus) => _setMessage(message), [])
  const setValue = useCallback((val: T) => _setValue(val), [])

  const validate = useCallback((cb?: callback): void => {
    _setStatus(InputStatus.VALID);
    _setMessage('');
    if (cb) cb()
  }, []);

  return {
    state: {
      onChange,
      statusMessage: message,
      status,
      value,
    },
    isInvalid: status === InputStatus.INVALID,
    isValid: status === InputStatus.VALID,
    setStatus,
    setStatusMessage,
    setValue,
    clearAll,
    clearStatus,
    clearMessage,
    invalidate,
    validate,
  };
}

export { InputStatus, useInputValue };
export type { InputState };