Use ReactNativeStyleAttributes to process fontFamily #823
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
Expo is moving away from using the
.expo
extension to identify "managed" apps in SDK 41, so we are patching libraries that currently depend on the extension to fork behavior.The solution used here is more generic - we use the same
process
function that is set viaStyleSheet.setStyleAttributePreprocessor
[(the method we use in Expo managed apps to scope fonts)](https://github.com/expo/expo/blob/fb198eb79ddf6a2a6f51b2ca2dfa0788c5fa769a/packages/expo/src/Expo.fx.tsx#L36-L39. In the (unlikely) case that other (non-Expo) folks are depending on this behavior it will also work out of the box in native-stack. I'm not crazy about doing a deep import into React Native like this, but there is no public API for getting StyleSheet preprocessors from React Native.An alternative approach could be to expose a font preprocessor setter for react-native-screens. We could then do something like this in the
expo
package:Changes
Deleted
FontProcessor.expo.js
and replaced with usingReactNativeStyleAttributes.fontFamily?.process
function if it's defined.Screenshots / GIFs
After deleting
FontProcessor.expo.js
After patching
FontProcessor.js
Test code and steps to reproduce
For the following app (
expo init
, blank template), copy the changes into react-native-screens in node_modules, delete the .expo.js file.Checklist