reflexy/styled/useFlexUtils.js

Flexbox layout react components

import { useRef } from 'react';
import { spaceToCssValue } from '../utils';
import useFlexDefaults from './useFlexDefaults';
export default function useFlexUtils() {
    const defaults = useFlexDefaults();
    const defaultsRef = useRef(defaults);
    defaultsRef.current = defaults;
    const resultRef = useRef(undefined);
    if (!resultRef.current) {
        resultRef.current = {
            spaceToCss: (space) => spaceToCssValue(space, defaultsRef.current),
            spaceToNumber: (space) => Number.parseFloat(spaceToCssValue(space, defaultsRef.current)),
        };
    }
    return resultRef.current;
}