Typescript Version

[mgarabedian]

Thanks for your code, I've found it useful. However, in the world of typescript, using the javascript version becomes problematic. Here is a typescript version I am using, for your consideration.

import { useState, useCallback, useRef, Dispatch, SetStateAction, RefObject } from 'react';

export function useStateRef<S>(initialState: S | (() => S)): [S, Dispatch<SetStateAction<S>>, RefObject<S>];

// convenience overload when first argument is omitted
export function useStateRef<S = undefined>(): [S | undefined, Dispatch<SetStateAction<S | undefined>>, RefObject<S | undefined>];

export function useStateRef(defaultValue?: any) {
    var [state, setState] = useState(defaultValue)
    var ref = useRef(state)

    var dispatch = useCallback(function (val) {
        ref.current = typeof val === "function" ?
            val(ref.current) : val
        setState(ref.current)
    }, []);

    return [state, dispatch, ref]
}

[Aminadav]

What is the problem with typescript? You can import JS files? If there is any issue, I recommend you to just create a type definition file. Then users of both worlds can enjoy.