@hashiprobr/react-create-state-context/src/createStateContext.js

React function for simplifying the creation of state contexts

import React, { createContext, useState, useMemo } from 'react';

export default function createStateContext(defaultValue) {
    const Context = createContext();

    const OriginalProvider = Context.Provider;

    function Provider(props) {
        const [value, setValue] = useState(defaultValue);

        const state = useMemo(() => [value, setValue], [value]);

        return (
            <OriginalProvider
                {...props}
                value={state}
            >
                {props.children}
            </OriginalProvider>
        );
    }

    Context.Provider = Provider;

    return Context;
}