@re-flex/styles/hookableStyles.js

Core Style Util Package

import { useCallback, useMemo } from "react";
import { useTheme } from "./Core";
import { css } from "./Gooberize";
import { sxPropInitializer } from "./sx";
export const makeStyles = (hookSource, sxEnable) => () => {
    const theme = useTheme();
    const styles = useMemo(() => {
        let renderHook = hookSource(theme);
        let calculatedClasses = {};
        for (const [className, classObj] of Object.entries(renderHook)) {
            let extendClassObj = classObj;
            if (sxEnable) {
                extendClassObj = sxPropInitializer(extendClassObj);
            }
            calculatedClasses[className] = css(extendClassObj);
        }
        return calculatedClasses;
    }, [theme]);
    return styles;
};
export const useThemingCss = () => {
    const theme = useTheme();
    return useCallback((rule) => {
        return css(sxPropInitializer(rule));
    }, [theme]);
};