rn-css 1.6.9 → 1.6.10

package/dist/styleComponent.js

@@ -109,10 +109,8 @@ const styled = (Component) => {
                 return newProps;
             }, [finalStyle.textOverflow, onLayout, onMouseEnter, onMouseLeave, props.style, styleConvertedFromCSS]);
             react_1.default.useEffect(() => () => removeStyle(hash), [hash]);
-            // The lines below can improve perfs, but it causes the component to remount when the font size changes
-            // const currentFontSize = React.useContext(FontSizeContext)
-            // if (em !== currentFontSize) {
-            if (styleConvertedFromCSS.fontSize) {
+            // em !== parentEm alone is a bit dangerous as the component would rerender when the font size change
+            if (em !== parentEm || finalStyle.fontSize !== undefined) {
                 return react_1.default.createElement(exports.FontSizeContext.Provider, { value: em },
                     react_1.default.createElement(Component, { ref: ref, ...props, ...newProps }));
             }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rn-css",
-  "version": "1.6.9",
+  "version": "1.6.10",
   "scripts": {
     "test": "jest",
     "prepare": "tsc",

package/src/styleComponent.tsx

@@ -122,10 +122,8 @@ const styled = <Props, >(Component: React.ComponentType<Props>) => {
 
       React.useEffect(() => () => removeStyle(hash), [hash])
 
-      // The lines below can improve perfs, but it causes the component to remount when the font size changes
-      // const currentFontSize = React.useContext(FontSizeContext)
-      // if (em !== currentFontSize) {
-      if (styleConvertedFromCSS.fontSize) {
+      // em !== parentEm alone is a bit dangerous as the component would rerender when the font size change
+      if (em !== parentEm || finalStyle.fontSize !== undefined) {
         return <FontSizeContext.Provider value={em}>
           <Component ref={ref} {...props} {...newProps} />
         </FontSizeContext.Provider>