@livelike/react-native/lib/module/hooks/useCustomFontStyle.js

LiveLike React Native package

import { useMemo } from 'react';
import { Platform, StyleSheet } from 'react-native';
import { useFonts } from './useFonts';
import { useFontFamily } from './useFontFamily';
/**
 * @description useCustomFontStyle hook returns an evaluated styles for Text based Component
 * based on fontWeight and fontStyle, these tweaked style are needed because of platform (IOS & Android)
 *  limitation for custom fonts
 * @returns styles
 */
export function useCustomFontStyle(_ref) {
  let {
    style
  } = _ref;
  const {
    fontFamily,
    fontFamilyType
  } = useFontFamily({
    style
  });
  const {
    fonts
  } = useFonts();
  const styles = useMemo(() => {
    const _styles = StyleSheet.flatten([style, {
      fontFamily
    }]);
    // Android has limitation for custom fonts where if custom font is used
    // and fontWeight/fontStyles is set, it doesn't render the expected font
    // so skipping fontWeight (& fontStyle) styles for Android platform
    // for more context refer https://stackoverflow.com/a/55717885/4317128
    const isCustomFont = !!fonts[fontFamilyType];
    if (Platform.OS === 'android' && isCustomFont) {
      const {
        fontWeight,
        fontStyle,
        ...restStyles
      } = _styles;
      return restStyles;
    }
    return _styles;
  }, [fontFamily, style, fontFamilyType]);
  return styles;
}
//# sourceMappingURL=useCustomFontStyle.js.map