Yolo Delete ReactNativePropRegistry

Summary:
Changed StyleSheet.create to be the identity function. We no longer hide it behind an opaque number. Better for types and perf since we don't use it.

I don't really know if we have/need any safer way of rolling this out than just landing it.

It can break if the object passed to StyleSheet.create is mutated afterwards but that isn't a practice anywhere I've seen.

Reviewed By: sophiebits

Differential Revision: D7530023

fbshipit-source-id: bc1afa879c5a5d9cd95cb13bc8ff3347b3622851

Author: sebmarkbage

Libraries/Renderer/shims/ReactNativePropRegistry.js

@@ -11,14 +11,12 @@
 'use strict';
 
 const PixelRatio = require('PixelRatio');
-const ReactNativePropRegistry = require('ReactNativePropRegistry');
 const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes');
 const StyleSheetValidation = require('StyleSheetValidation');
 
 const flatten = require('flattenStyle');
 
 import type {
-  ____StyleSheetInternalStyleIdentifier_Internal as StyleSheetInternalStyleIdentifier,
   ____Styles_Internal,
   ____DangerouslyImpreciseStyle_Internal,
   ____DangerouslyImpreciseStyleProp_Internal,
@@ -171,16 +169,16 @@ if (hairlineWidth === 0) {
   hairlineWidth = 1 / PixelRatio.get();
 }
 
-const absoluteFillObject: LayoutStyle = {
+const absoluteFill: LayoutStyle = {
   position: 'absolute',
   left: 0,
   right: 0,
   top: 0,
   bottom: 0,
 };
-const absoluteFill: StyleSheetInternalStyleIdentifier = ReactNativePropRegistry.register(
-  absoluteFillObject,
-); // This also freezes it
+if (__DEV__) {
+  Object.freeze(absoluteFill);
+}
 
 /**
  * A StyleSheet is an abstraction similar to CSS StyleSheets
@@ -253,7 +251,7 @@ module.exports = {
    * so `absoluteFill` can be used for convenience and to reduce duplication of these repeated
    * styles.
    */
-  absoluteFill,
+  absoluteFill: (absoluteFill: any), // TODO: This should be updated after we fix downstream Flow sites.
 
   /**
    * Sometimes you may want `absoluteFill` but with a couple tweaks - `absoluteFillObject` can be
@@ -267,7 +265,7 @@ module.exports = {
    *     },
    *   });
    */
-  absoluteFillObject,
+  absoluteFillObject: absoluteFill,
 
   /**
    * Combines two styles such that `style2` will override any styles in `style1`.
@@ -361,14 +359,16 @@ module.exports = {
   /**
    * Creates a StyleSheet style reference from the given object.
    */
-  create<+S: ____Styles_Internal>(
-    obj: S,
-  ): $ObjMap<S, (Object) => StyleSheetInternalStyleIdentifier> {
-    const result = {};
-    for (const key in obj) {
-      StyleSheetValidation.validateStyle(key, obj);
-      result[key] = obj[key] && ReactNativePropRegistry.register(obj[key]);
+  create<+S: ____Styles_Internal>(obj: S): $ObjMap<S, (Object) => any> {
+    // TODO: This should return S as the return type. But first,
+    // we need to codemod all the callsites that are typing this
+    // return value as a number (even though it was opaque).
+    if (__DEV__) {
+      for (const key in obj) {
+        StyleSheetValidation.validateStyle(key, obj);
+        Object.freeze(obj[key]);
+      }
     }
-    return result;
+    return obj;
   },
 };

Libraries/StyleSheet/StyleSheet.js

@@ -13,8 +13,6 @@
 
 const AnimatedNode = require('AnimatedNode');
 
-export opaque type ____StyleSheetInternalStyleIdentifier_Internal: number = number;
-
 export type ColorValue = null | string;
 export type DimensionValue = null | number | string | AnimatedNode;
 
@@ -224,8 +222,6 @@ type GenericStyleProp<+T> =
   | null
   | void
   | T
-  | ____StyleSheetInternalStyleIdentifier_Internal
-  | number
   | false
   | ''
   | $ReadOnlyArray<GenericStyleProp<T>>;

Libraries/StyleSheet/StyleSheetTypes.js

@@ -150,7 +150,7 @@ describe('flattenStyle', () => {
   it('should ignore invalid class names', () => {
     var invalid = flattenStyle(1234, null);
 
-    expect(invalid).toEqual({});
+    expect(invalid).toEqual(undefined);
     // Invalid class name 1234 skipping ...
   });
 });

Libraries/StyleSheet/__tests__/flattenStyle-test.js

@@ -10,35 +10,20 @@
  */
 'use strict';
 
-var ReactNativePropRegistry;
-
 import type {
   DangerouslyImpreciseStyle,
   DangerouslyImpreciseStyleProp,
 } from 'StyleSheet';
 
-function getStyle(style) {
-  if (ReactNativePropRegistry === undefined) {
-    ReactNativePropRegistry = require('ReactNativePropRegistry');
-  }
-  if (typeof style === 'number') {
-    return ReactNativePropRegistry.getByID(style);
-  }
-  return style;
-}
-
 function flattenStyle(
   style: ?DangerouslyImpreciseStyleProp,
 ): ?DangerouslyImpreciseStyle {
-  if (style == null) {
+  if (style === null || typeof style !== 'object') {
     return undefined;
   }
 
   if (!Array.isArray(style)) {
-    /* $FlowFixMe(>=0.63.0 site=react_native_fb) This comment suppresses an
-     * error found when Flow v0.63 was deployed. To see the error delete this
-     * comment and run Flow. */
-    return getStyle(style);
+    return style;
   }
 
   var result = {};

Libraries/StyleSheet/flattenStyle.js

@@ -324,11 +324,7 @@ Object.keys(mockNativeModules).forEach(module => {
 });
 
 jest
-  .doMock('NativeModules', () => mockNativeModules)
-  .doMock('ReactNativePropRegistry', () => ({
-    register: id => id,
-    getByID: () => mockEmptyObject,
-  }));
+  .doMock('NativeModules', () => mockNativeModules);
 
 jest.doMock('requireNativeComponent', () => {
   const React = require('react');