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

Summary:
Pull Request resolved: facebook#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/)
- Updates the current iteration of API snapshots (intended).
- Updates `react-native-codegen`'s require of processColorArray, analogous to D42346452.

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`

Reviewed By: javache

Differential Revision: D68017325

fbshipit-source-id: 3c5b94742f101db0b2914c91efab6003dba2b61a

packages/react-native-codegen/e2e/__tests__/components/__snapshots__/GenerateViewConfigJs-test.js.snap

@@ -31,7 +31,7 @@ export const __INTERNAL_VIEW_CONFIG = {
     radii: true,
 
     colors: {
-      process: require('react-native/Libraries/StyleSheet/processColorArray'),
+      process: require('react-native/Libraries/StyleSheet/processColorArray').default,
     },
 
     srcs: true,

packages/react-native-codegen/src/generators/components/GenerateViewConfigJs.js

@@ -91,7 +91,7 @@ function getReactDiffProcessValue(typeAnnotation: PropTypeAnnotation) {
         switch (typeAnnotation.elementType.name) {
           case 'ColorPrimitive':
             return j.template
-              .expression`{ process: require('react-native/Libraries/StyleSheet/processColorArray') }`;
+              .expression`{ process: require('react-native/Libraries/StyleSheet/processColorArray').default }`;
           case 'ImageSourcePrimitive':
           case 'PointPrimitive':
           case 'EdgeInsetsPrimitive':

packages/react-native-codegen/src/generators/components/__tests__/__snapshots__/GenerateViewConfigJs-test.js.snap

@@ -31,7 +31,7 @@ export const __INTERNAL_VIEW_CONFIG = {
     radii: true,
 
     colors: {
-      process: require('react-native/Libraries/StyleSheet/processColorArray'),
+      process: require('react-native/Libraries/StyleSheet/processColorArray').default,
     },
 
     srcs: true,

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');

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;

packages/react-native/Libraries/StyleSheet/__flowtests__/StyleSheet-flowtest.js

@@ -12,7 +12,8 @@
 
 import type {ImageStyleProp, TextStyleProp} from '../StyleSheet';
 
-const StyleSheet = require('../StyleSheet');
+import * as StyleSheet from '../StyleSheet';
+
 const imageStyle = {tintColor: 'rgb(0, 0, 0)'};
 const textStyle = {color: 'rgb(0, 0, 0)'};
 

packages/react-native/Libraries/StyleSheet/__tests__/normalizeColor-test.js

@@ -11,12 +11,12 @@
 'use strict';
 
 const {OS} = require('../../Utilities/Platform');
-const normalizeColor = require('../normalizeColor');
+const normalizeColor = require('../normalizeColor').default;
 
 it('forwards calls to @react-native/normalize-colors', () => {
   jest.resetModules().mock('@react-native/normalize-colors', () => jest.fn());
 
-  expect(require('../normalizeColor')('#abc')).not.toBe(null);
+  expect(require('../normalizeColor').default('#abc')).not.toBe(null);
   expect(require('@react-native/normalize-colors')).toBeCalled();
 });
 

packages/react-native/Libraries/StyleSheet/__tests__/processAspectRatio-test.js

@@ -10,7 +10,7 @@
 
 'use strict';
 
-const processAspectRatio = require('../processAspectRatio');
+import processAspectRatio from '../processAspectRatio';
 
 describe('processAspectRatio', () => {
   it('should accept numbers', () => {

packages/react-native/Libraries/StyleSheet/__tests__/processColorArray-test.js

@@ -17,7 +17,7 @@ const PlatformColorIOS =
   require('../PlatformColorValueTypes.ios').PlatformColor;
 const DynamicColorIOS =
   require('../PlatformColorValueTypesIOS.ios').DynamicColorIOS;
-const processColorArray = require('../processColorArray');
+const processColorArray = require('../processColorArray').default;
 
 const platformSpecific =
   OS === 'android'

packages/react-native/Libraries/StyleSheet/__tests__/processFontVariant-test.js

@@ -10,7 +10,7 @@
 
 'use strict';
 
-const processFontVariant = require('../processFontVariant');
+const processFontVariant = require('../processFontVariant').default;
 
 describe('processFontVariant', () => {
   it('should accept arrays', () => {

packages/react-native/Libraries/StyleSheet/__tests__/processTransform-test.js

@@ -10,7 +10,7 @@
 
 'use strict';
 
-const processTransform = require('../processTransform');
+import processTransform from '../processTransform';
 
 describe('processTransform', () => {
   describe('validation', () => {

packages/react-native/Libraries/StyleSheet/__tests__/setNormalizedColorAlpha-test.js

@@ -10,8 +10,8 @@
 
 'use strict';
 
-const normalizeColor = require('../normalizeColor');
-const setNormalizedColorAlpha = require('../setNormalizedColorAlpha');
+const normalizeColor = require('../normalizeColor').default;
+const setNormalizedColorAlpha = require('../setNormalizedColorAlpha').default;
 
 describe('setNormalizedColorAlpha', function () {
   it('should adjust the alpha of the color passed in', function () {

packages/react-native/Libraries/StyleSheet/normalizeColor.js

@@ -31,4 +31,4 @@ function normalizeColor(
   }
 }
 
-module.exports = normalizeColor;
+export default normalizeColor;

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;

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;
 

packages/react-native/Libraries/StyleSheet/processColorArray.js

@@ -32,4 +32,4 @@ function processColorElement(color: ColorValue): ProcessedColorValue {
   return value;
 }
 
-module.exports = processColorArray;
+export default processColorArray;

packages/react-native/Libraries/StyleSheet/processFontVariant.js

@@ -27,4 +27,4 @@ function processFontVariant(
   return match;
 }
 
-module.exports = processFontVariant;
+export default processFontVariant;

packages/react-native/Libraries/StyleSheet/processTransform.js

@@ -266,4 +266,4 @@ function _validateTransform(
   }
 }
 
-module.exports = processTransform;
+export default processTransform;

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;

packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap

@@ -8326,7 +8326,7 @@ exports[`public API should not change unintentionally Libraries/StyleSheet/norma
 "declare function normalizeColor(
   color: ?(ColorValue | ProcessedColorValue)
 ): ?ProcessedColorValue;
-declare module.exports: normalizeColor;
+declare export default typeof normalizeColor;
 "
 `;
 
@@ -8374,7 +8374,7 @@ exports[`public API should not change unintentionally Libraries/StyleSheet/priva
 
 exports[`public API should not change unintentionally Libraries/StyleSheet/processAspectRatio.js 1`] = `
 "declare function processAspectRatio(aspectRatio?: number | string): ?number;
-declare module.exports: processAspectRatio;
+declare export default typeof processAspectRatio;
 "
 `;
 
@@ -8424,7 +8424,7 @@ exports[`public API should not change unintentionally Libraries/StyleSheet/proce
 "declare function processColorArray(
   colors: ?$ReadOnlyArray<ColorValue>
 ): ?$ReadOnlyArray<ProcessedColorValue>;
-declare module.exports: processColorArray;
+declare export default typeof processColorArray;
 "
 `;
 
@@ -8456,15 +8456,15 @@ exports[`public API should not change unintentionally Libraries/StyleSheet/proce
 "declare function processFontVariant(
   fontVariant: ____FontVariantArray_Internal | string
 ): ?____FontVariantArray_Internal;
-declare module.exports: processFontVariant;
+declare export default typeof processFontVariant;
 "
 `;
 
 exports[`public API should not change unintentionally Libraries/StyleSheet/processTransform.js 1`] = `
 "declare function processTransform(
   transform: Array<Object> | string
 ): Array<Object> | Array<number>;
-declare module.exports: processTransform;
+declare export default typeof processTransform;
 "
 `;
 
@@ -8477,7 +8477,7 @@ exports[`public API should not change unintentionally Libraries/StyleSheet/proce
 
 exports[`public API should not change unintentionally Libraries/StyleSheet/setNormalizedColorAlpha.js 1`] = `
 "declare function setNormalizedColorAlpha(input: number, alpha: number): number;
-declare module.exports: setNormalizedColorAlpha;
+declare export default typeof setNormalizedColorAlpha;
 "
 `;