SiliconJungles/react-native-fontweight

Small fix for React Native

Opened this issue ยท 0 comments

Hi! ๐Ÿ‘‹

Firstly, thanks for your work on this project! ๐Ÿ™‚

Today I used patch-package to patch react-native-font-weight@0.1.5-alpha for the project I'm working on.

Here is the diff that solved my problem:

diff --git a/node_modules/react-native-font-weight/src/FontManager.ts b/node_modules/react-native-font-weight/src/FontManager.ts
index 11a0ab8..749dde4 100644
--- a/node_modules/react-native-font-weight/src/FontManager.ts
+++ b/node_modules/react-native-font-weight/src/FontManager.ts
@@ -1,5 +1,5 @@
 import {Platform, StyleSheet, Text} from 'react-native'
-import React from 'react'
+import React, {ReactNode} from 'react'
 
 type FontStyle = 'normal' | 'italic' | 'oblique'
 type FontWeight =
@@ -41,7 +41,7 @@ function font_style_generator(
 	font_family: string,
 	font_weight: FontWeight,
 	font_style: FontStyle,
-): {fontFamily?: string; fontWeight: string} {
+): { fontFamily?: string; fontWeight: string } {
 	let fontFamily = `${font_family}-`
 
 	switch (font_weight) {
@@ -90,7 +90,7 @@ function font_style_generator(
 		fontFamily += 'Italic'
 	}
 
-	return  { ...font_family && {fontFamily: fontFamily}, fontWeight: 'normal' };
+	return {...font_family && {fontFamily: fontFamily}, fontWeight: '400'};
 }
 
 const oldRender = (Text as any).render
@@ -110,39 +110,52 @@ class FontManager {
      *   Therefore swapped it to function instead of arrow to remove global scope
      */
 		const origin = oldRender.call(this, ...args)
-
 		if (Platform.OS === 'android') {
-			if (origin.props.style) {
-				const style = StyleSheet.flatten([origin.props.style])
-
-				if(!this.customFonts?.includes(style.fontFamily)){
+			let originStyle = origin.props?.style
+			if (typeof origin.props.children.props?.style != 'undefined') {
+				originStyle = origin.props.children.props?.style
+			}
+			if (originStyle) {
+				const style = StyleSheet.flatten([originStyle])
+				if (!this.customFonts?.includes(style.fontFamily)) {
 					return origin
 				}
-
 				const fontWeight: FontWeight = style.fontWeight ? style.fontWeight : '400'
-
 				const fontStyle: FontStyle = style.fontStyle ? style.fontStyle : 'normal'
 				// HACK: Disabled mutation of fontStyle as is immutable in some libaries
-				// origin.props.style.fontStyle = 'normal'
 
 				const fontFamily: string = style.fontFamily
-
-				return React.cloneElement(origin, {
-					style: [{}, style, font_style_generator(fontFamily, fontWeight, fontStyle)],
-				})
+				const newProps = {style: StyleSheet.flatten([style, font_style_generator(fontFamily, fontWeight, fontStyle)])}
+				if (typeof origin.props?.children != 'undefined') {
+					return React.Children.map<ReactNode, ReactNode>(origin.props.children, child => {
+						if (React.isValidElement(child)) {
+							return React.cloneElement(child, newProps)
+						}
+					})
+				}
+				return React.cloneElement(origin, newProps)
 			}
 			return origin
 		} else {
-			if (origin.props.style) {
-				const style = StyleSheet.flatten([origin.props.style])
+			let originStyle = origin.props?.style
+			if (typeof origin.props.children.props?.style != 'undefined') {
+				originStyle = origin.props.children.props?.style
+			}
+			if (originStyle) {
+				const style = StyleSheet.flatten([originStyle])
 				if (style.fontFamily && this.customFonts?.includes(style.fontFamily)) {
 					const fontFamily: string = style.fontFamily
 					style.fontFamily = double_pascal_case_to_two_words(fontFamily)
-					origin.props.style = style
+					if (typeof origin.props.children.props?.style != 'undefined') {
+						origin.props.children.props.style = style
+					} else {
+						origin.props.style = style
+					}
 				}
 			}
 			return origin
 		}
 	}
 }
+
 export default new FontManager()

This issue body was partially generated by patch-package.