Migrate files in Libraries/StyleSheet to use export syntax (#49303)

Summary:
Pull Request resolved: #49303

Changelog: [General][Breaking] Deep imports to modules inside `Libraries/StyleSheet` using `require` may need to be appended with `.default`

Reviewed By: huntie

Differential Revision: D69400980

fbshipit-source-id: 053f40a8677ac877b93c27e87422ea0ef540c272

Author: j-piasecki

packages/react-native/Libraries/Animated/__tests__/Animated-web-test.js

@@ -8,7 +8,7 @@
  * @oncall react_native
  */
 
-const StyleSheet = require('../../StyleSheet/StyleSheet');
+const StyleSheet = require('../../StyleSheet/StyleSheet').default;
 let Animated = require('../Animated').default;
 let AnimatedProps = require('../nodes/AnimatedProps').default;
 

packages/react-native/Libraries/Core/setUpReactDevTools.js

@@ -72,7 +72,7 @@ if (__DEV__) {
 
   const ReactNativeStyleAttributes =
     require('../Components/View/ReactNativeStyleAttributes').default;
-  const resolveRNStyle = require('../StyleSheet/flattenStyle');
+  const resolveRNStyle = require('../StyleSheet/flattenStyle').default;
 
   function handleReactDevToolsSettingsUpdate(settings: Object) {
     reactDevToolsSettingsManager.setGlobalHookSettings(

packages/react-native/Libraries/Lists/FlatList.js

@@ -24,7 +24,7 @@ import VirtualizedLists from '@react-native/virtualized-lists';
 import memoizeOne from 'memoize-one';
 import React from 'react';
 
-const StyleSheet = require('../StyleSheet/StyleSheet');
+const StyleSheet = require('../StyleSheet/StyleSheet').default;
 const deepDiffer = require('../Utilities/differ/deepDiffer').default;
 const Platform = require('../Utilities/Platform');
 const invariant = require('invariant');

packages/react-native/Libraries/Modal/Modal.js

@@ -25,7 +25,7 @@ const View = require('../Components/View/View').default;
 const AppContainer = require('../ReactNative/AppContainer').default;
 const I18nManager = require('../ReactNative/I18nManager').default;
 const {RootTagContext} = require('../ReactNative/RootTag');
-const StyleSheet = require('../StyleSheet/StyleSheet');
+const StyleSheet = require('../StyleSheet/StyleSheet').default;
 const Platform = require('../Utilities/Platform');
 
 const VirtualizedListContextResetter =

packages/react-native/Libraries/ReactNative/AppContainer-dev.js

@@ -33,7 +33,8 @@ const reactDevToolsHook: ReactDevToolsGlobalHook =
 // Required for React DevTools to view / edit React Native styles in Flipper.
 // Flipper doesn't inject these values when initializing DevTools.
 if (reactDevToolsHook) {
-  reactDevToolsHook.resolveRNStyle = require('../StyleSheet/flattenStyle');
+  reactDevToolsHook.resolveRNStyle =
+    require('../StyleSheet/flattenStyle').default;
   reactDevToolsHook.nativeStyleEditorValidAttributes = Object.keys(
     ReactNativeStyleAttributes,
   );

packages/react-native/Libraries/ReactPrivate/ReactNativePrivateInterface.js

@@ -74,7 +74,7 @@ module.exports = {
   get flattenStyle(): flattenStyle<DangerouslyImpreciseStyleProp> {
     // $FlowFixMe[underconstrained-implicit-instantiation]
     // $FlowFixMe[incompatible-return]
-    return require('../StyleSheet/flattenStyle');
+    return require('../StyleSheet/flattenStyle').default;
   },
   get ReactFiberErrorDialog(): ReactFiberErrorDialog {
     return require('../Core/ReactFiberErrorDialog').default;

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/StyleSheet.js

@@ -228,7 +228,7 @@ if (__DEV__) {
  *  and suggestions to help you write valid styles.
  *
  */
-module.exports = {
+export default {
   /**
    * This is defined as the width of a thin line on the platform. It can be
    * used as the thickness of a border or division between two elements.

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

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

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

@@ -8,7 +8,9 @@
  * @oncall react_native
  */
 
-import {setStyleAttributePreprocessor} from '../StyleSheet';
+import StyleSheet from '../StyleSheet';
+
+const setStyleAttributePreprocessor = StyleSheet.setStyleAttributePreprocessor;
 
 describe(setStyleAttributePreprocessor, () => {
   const originalConsoleWarn = console.warn;

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

@@ -10,8 +10,8 @@
 
 'use strict';
 
-const flattenStyle = require('../flattenStyle');
-const StyleSheet = require('../StyleSheet');
+const flattenStyle = require('../flattenStyle').default;
+const StyleSheet = require('../StyleSheet').default;
 
 function getFixture() {
   return StyleSheet.create({

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');
+const processAspectRatio = require('../processAspectRatio').default;
 
 describe('processAspectRatio', () => {
   it('should accept numbers', () => {

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');
+const processTransform = require('../processTransform').default;
 
 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/flattenStyle.js

@@ -43,4 +43,4 @@ function flattenStyle<TStyleProp: DangerouslyImpreciseStyleProp>(
   return result;
 }
 
-module.exports = flattenStyle;
+export default flattenStyle;

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/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

@@ -7083,7 +7083,7 @@ declare const absoluteFill: {
   +right: 0,
   +top: 0,
 };
-declare module.exports: {
+declare export default {
   hairlineWidth: hairlineWidth,
   absoluteFill: any,
   absoluteFillObject: absoluteFill,
@@ -7507,15 +7507,15 @@ exports[`public API should not change unintentionally Libraries/StyleSheet/flatt
 "declare function flattenStyle<TStyleProp: DangerouslyImpreciseStyleProp>(
   style: ?TStyleProp
 ): ?____FlattenStyleProp_Internal<TStyleProp>;
-declare module.exports: flattenStyle;
+declare export default typeof flattenStyle;
 "
 `;
 
 exports[`public API should not change unintentionally Libraries/StyleSheet/normalizeColor.js 1`] = `
 "declare function normalizeColor(
   color: ?(ColorValue | ProcessedColorValue)
 ): ?ProcessedColorValue;
-declare module.exports: normalizeColor;
+declare export default typeof normalizeColor;
 "
 `;
 
@@ -7563,7 +7563,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;
 "
 `;
 
@@ -7647,15 +7647,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;
 "
 `;
 
@@ -7668,7 +7668,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;
 "
 `;
 

packages/react-native/index.js

@@ -321,7 +321,7 @@ module.exports = {
     return require('./Libraries/Share/Share').default;
   },
   get StyleSheet(): StyleSheet {
-    return require('./Libraries/StyleSheet/StyleSheet');
+    return require('./Libraries/StyleSheet/StyleSheet').default;
   },
   get Systrace(): Systrace {
     return require('./Libraries/Performance/Systrace');

packages/react-native/src/private/inspector/BoxInspector.js

@@ -19,7 +19,7 @@ import type {InspectedElementFrame} from './Inspector';
 import React from 'react';
 
 const View = require('../../../Libraries/Components/View/View').default;
-const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet');
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet').default;
 const Text = require('../../../Libraries/Text/Text').default;
 const resolveBoxStyle = require('./resolveBoxStyle').default;
 

packages/react-native/src/private/inspector/ElementBox.js

@@ -16,8 +16,9 @@ import type {InspectedElementFrame} from './Inspector';
 import React from 'react';
 
 const View = require('../../../Libraries/Components/View/View').default;
-const flattenStyle = require('../../../Libraries/StyleSheet/flattenStyle');
-const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet');
+const flattenStyle =
+  require('../../../Libraries/StyleSheet/flattenStyle').default;
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet').default;
 const Dimensions = require('../../../Libraries/Utilities/Dimensions').default;
 const BorderBox = require('./BorderBox').default;
 const resolveBoxStyle = require('./resolveBoxStyle').default;

packages/react-native/src/private/inspector/ElementProperties.js

@@ -20,8 +20,9 @@ const TouchableHighlight =
 const TouchableWithoutFeedback =
   require('../../../Libraries/Components/Touchable/TouchableWithoutFeedback').default;
 const View = require('../../../Libraries/Components/View/View').default;
-const flattenStyle = require('../../../Libraries/StyleSheet/flattenStyle');
-const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet');
+const flattenStyle =
+  require('../../../Libraries/StyleSheet/flattenStyle').default;
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet').default;
 const Text = require('../../../Libraries/Text/Text').default;
 const mapWithSeparator = require('../../../Libraries/Utilities/mapWithSeparator');
 const BoxInspector = require('./BoxInspector').default;

packages/react-native/src/private/inspector/Inspector.js

@@ -26,7 +26,7 @@ const PressabilityDebug = require('../../../Libraries/Pressability/PressabilityD
 const {
   findNodeHandle,
 } = require('../../../Libraries/ReactNative/RendererProxy');
-const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet');
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet').default;
 const Dimensions = require('../../../Libraries/Utilities/Dimensions').default;
 const Platform = require('../../../Libraries/Utilities/Platform');
 const getInspectorDataForViewAtPoint =

packages/react-native/src/private/inspector/InspectorOverlay.js

@@ -16,7 +16,7 @@ import type {InspectedElement} from './Inspector';
 import React from 'react';
 
 const View = require('../../../Libraries/Components/View/View').default;
-const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet');
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet').default;
 const ElementBox = require('./ElementBox').default;
 
 type Props = $ReadOnly<{

packages/react-native/src/private/inspector/InspectorPanel.js

@@ -20,7 +20,7 @@ const ScrollView =
 const TouchableHighlight =
   require('../../../Libraries/Components/Touchable/TouchableHighlight').default;
 const View = require('../../../Libraries/Components/View/View').default;
-const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet');
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet').default;
 const Text = require('../../../Libraries/Text/Text').default;
 const ElementProperties = require('./ElementProperties').default;
 const NetworkOverlay = require('./NetworkOverlay').default;

packages/react-native/src/private/inspector/NetworkOverlay.js

@@ -20,7 +20,7 @@ const TouchableHighlight =
   require('../../../Libraries/Components/Touchable/TouchableHighlight').default;
 const View = require('../../../Libraries/Components/View/View').default;
 const FlatList = require('../../../Libraries/Lists/FlatList').default;
-const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet');
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet').default;
 const Text = require('../../../Libraries/Text/Text').default;
 const WebSocketInterceptor =
   require('../../../Libraries/WebSocket/WebSocketInterceptor').default;

packages/react-native/src/private/inspector/PerformanceOverlay.js

@@ -13,7 +13,7 @@
 import React from 'react';
 
 const View = require('../../../Libraries/Components/View/View').default;
-const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet');
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet').default;
 const Text = require('../../../Libraries/Text/Text').default;
 const PerformanceLogger = require('../../../Libraries/Utilities/GlobalPerformanceLogger');
 

packages/react-native/src/private/inspector/StyleInspector.js

@@ -16,7 +16,7 @@ import type {____FlattenStyleProp_Internal} from '../../../Libraries/StyleSheet/
 import React from 'react';
 
 const View = require('../../../Libraries/Components/View/View').default;
-const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet');
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet').default;
 const Text = require('../../../Libraries/Text/Text').default;
 
 type Props = $ReadOnly<{