import React, { useState, useMemo } from "react";
import { createContext } from "use-context-selector";
import useContext from "../../../hooks/useContextSelector";
export const ActiveDispatchContext = createContext("");
export const ActiveMenuGroupIdContext = createContext("");
export const ActiveSubMenuIdContext = createContext("");
export const ActiveMenuProvider = ({ menuGroupId: initialMenuGroupId = "", subMenuId: initialSubMenuId = "", children, }) => {
    const [menuGroupId, setMenuGroupId] = useState(initialMenuGroupId);
    const [subMenuId, setSubMenuId] = useState(initialSubMenuId);
    const dispatch = useMemo(() => ({
        setMenuGroupId,
        setSubMenuId,
    }), []);
    return (React.createElement(ActiveDispatchContext.Provider, { value: dispatch },
        React.createElement(ActiveMenuGroupIdContext.Provider, { value: menuGroupId },
            React.createElement(ActiveSubMenuIdContext.Provider, { value: subMenuId }, children))));
};
export const useDispatchActive = () => useContext(ActiveDispatchContext);
export const useActiveMenuGroupId = select => useContext(ActiveMenuGroupIdContext, select);
export const useMenuGroupActive = id => useActiveMenuGroupId(state => id === state);
export const useActiveSubMenuId = select => useContext(ActiveSubMenuIdContext, select);
export const withActiveMenuGroupId = Component => props => {
    const activeMenuGroupId = useActiveMenuGroupId();
    return React.createElement(Component, Object.assign({ activeMenuGroupId: activeMenuGroupId }, props));
};
export const withActiveSubMenuId = Component => props => {
    const activeSubMenuId = useActiveSubMenuId();
    return React.createElement(Component, Object.assign({ activeSubMenuId: activeSubMenuId }, props));
};
//# sourceMappingURL=context.js.map