UNPKG

react-native-full-responsive

Version:

Create a fully responsive React Native app for all supported platforms

30 lines 1.17 kB
import { useMemo } from 'react'; import { useDevice } from './useDevice'; import { createRStyle } from '../layout'; import { useWindowDimensions } from 'react-native'; /** * A hook is provided for createRStyle to create a dynamic responsive scale. This hook generates a new style when there are changes in dimensions, the parsing method, type, or bases. * @param styles * @param deps dependency list to regenerate styles after changing them, and default is an empty array * @returns a responsive styles `object` */ export const useRStyle = function (styles) { let deps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : []; const device = useDevice(); const { width, height } = useWindowDimensions(); const dependencies = [width, height, device, ...deps]; const responsivedStyles = useMemo(() => { const passedStyles = typeof styles === 'function' ? styles() : styles; return createRStyle(passedStyles, { width, height, scaleConfig: device }); // eslint-disable-next-line react-hooks/exhaustive-deps }, dependencies); return responsivedStyles; }; //# sourceMappingURL=useRStyle.js.map