Migrate StyleSheet/*.js to use export statements (#48609)

Summary: Pull Request resolved: #48609 # Motivation This is an attempt at modernizing the export syntax in some of the files in `Libraries/StyleSheet/`. It will allow these files to get properly ingested by modern Flow tooling. # This diff - Migrates the use of `module.exports` into `export default` for files located in `Libraries/StyleSheet/*.js`. Some files were omitted due to ballooning complexity, but will be addressed in other Diffs. - Updating internal *require*s to use ".default", no product code seems to be affected. - Migrating `require`s into `import`s where applicable, taking into account the performance implications (context: https://fb.workplace.com/groups/react.technologies.discussions/permalink/3638114866420225/) Changelog: [General][Breaking] - Deep imports from some files in `StyleSheet/` can break when using the `require()` syntax, but can be easily fixed by appending `.default` Differential Revision: D68017325
facebook · Jan 10, 2025 · 35fcfba · 35fcfba
1 parent fd0894b
commit 35fcfba
Show file tree

Hide file tree

Showing 10 changed files with 11 additions and 10 deletions.
diff --git a/packages/react-native/Libraries/ReactNative/getNativeComponentAttributes.js b/packages/react-native/Libraries/ReactNative/getNativeComponentAttributes.js
@@ -17,7 +17,7 @@ const resolveAssetSource = require('../Image/resolveAssetSource');
 const processBackgroundImage =
   require('../StyleSheet/processBackgroundImage').default;
 const processColor = require('../StyleSheet/processColor').default;
-const processColorArray = require('../StyleSheet/processColorArray');
+const processColorArray = require('../StyleSheet/processColorArray').default;
 const processFilter = require('../StyleSheet/processFilter').default;
 const insetsDiffer = require('../Utilities/differ/insetsDiffer');
 const matricesDiffer = require('../Utilities/differ/matricesDiffer');

diff --git a/packages/react-native/Libraries/StyleSheet/PlatformColorValueTypes.ios.js b/packages/react-native/Libraries/StyleSheet/PlatformColorValueTypes.ios.js
@@ -56,7 +56,7 @@ const _normalizeColorObject = (
     // an ios semantic color
     return color;
   } else if ('dynamic' in color && color.dynamic !== undefined) {
-    const normalizeColor = require('./normalizeColor');
+    const normalizeColor = require('./normalizeColor').default;
 
     // a dynamic, appearance aware color
     const dynamic = color.dynamic;

diff --git a/packages/react-native/Libraries/StyleSheet/__flowtests__/StyleSheet-flowtest.js b/packages/react-native/Libraries/StyleSheet/__flowtests__/StyleSheet-flowtest.js
@@ -12,7 +12,8 @@
 
 import type {ImageStyleProp, TextStyleProp} from '../StyleSheet';
 
-const StyleSheet = require('../StyleSheet');
+import StyleSheet from '../StyleSheet';
+
 const imageStyle = {tintColor: 'rgb(0, 0, 0)'};
 const textStyle = {color: 'rgb(0, 0, 0)'};
 

diff --git a/packages/react-native/Libraries/StyleSheet/normalizeColor.js b/packages/react-native/Libraries/StyleSheet/normalizeColor.js
@@ -31,4 +31,4 @@ function normalizeColor(
   }
 }
 
-module.exports = normalizeColor;
+export default normalizeColor;
diff --git a/packages/react-native/Libraries/StyleSheet/processAspectRatio.js b/packages/react-native/Libraries/StyleSheet/processAspectRatio.js
@@ -60,4 +60,4 @@ function processAspectRatio(aspectRatio?: number | string): ?number {
   return Number(matches[0]);
 }
 
-module.exports = processAspectRatio;
+export default processAspectRatio;
diff --git a/packages/react-native/Libraries/StyleSheet/processColor.js b/packages/react-native/Libraries/StyleSheet/processColor.js
@@ -13,7 +13,7 @@
 import type {ColorValue, NativeColorValue} from './StyleSheet';
 
 const Platform = require('../Utilities/Platform');
-const normalizeColor = require('./normalizeColor');
+const normalizeColor = require('./normalizeColor').default;
 
 export type ProcessedColorValue = number | NativeColorValue;
 

diff --git a/packages/react-native/Libraries/StyleSheet/processColorArray.js b/packages/react-native/Libraries/StyleSheet/processColorArray.js
@@ -32,4 +32,4 @@ function processColorElement(color: ColorValue): ProcessedColorValue {
   return value;
 }
 
-module.exports = processColorArray;
+export default processColorArray;
diff --git a/packages/react-native/Libraries/StyleSheet/processFontVariant.js b/packages/react-native/Libraries/StyleSheet/processFontVariant.js
@@ -27,4 +27,4 @@ function processFontVariant(
   return match;
 }
 
-module.exports = processFontVariant;
+export default processFontVariant;
diff --git a/packages/react-native/Libraries/StyleSheet/processTransform.js b/packages/react-native/Libraries/StyleSheet/processTransform.js
@@ -266,4 +266,4 @@ function _validateTransform(
   }
 }
 
-module.exports = processTransform;
+export default processTransform;
diff --git a/packages/react-native/Libraries/StyleSheet/setNormalizedColorAlpha.js b/packages/react-native/Libraries/StyleSheet/setNormalizedColorAlpha.js
@@ -28,4 +28,4 @@ function setNormalizedColorAlpha(input: number, alpha: number): number {
   return ((input & 0xffffff00) | alpha) >>> 0;
 }
 
-module.exports = setNormalizedColorAlpha;
+export default setNormalizedColorAlpha;
-Original file line number
+Diff line change
@@ Expand Up / @@ -31,4 +31,4 @@ function normalizeColor( @@
       }
     }
-    module.exports = normalizeColor;
+    export default normalizeColor;