From 60db876f666e256eba8527251ce7035cfbca6014 Mon Sep 17 00:00:00 2001 From: Nick Lockwood Date: Fri, 27 Nov 2015 05:39:00 -0800 Subject: [PATCH] Wrapped UIManager native module for better abstraction Summary: public RCTUIManager is a public module with several useful methods, however, unlike most such modules, it does not have a JS wrapper that would allow it to be required directly. Besides making it more cumbersome to use, this also makes it impossible to modify the UIManager API, or smooth over differences between platforms in the JS layer without breaking all of the call sites. This diff adds a simple JS wrapper file for the UIManager module to make it easier to work with. Reviewed By: tadeuzagallo Differential Revision: D2700348 fb-gh-sync-id: dd9030eface100b1baf756da11bae355dc0f266f --- Examples/UIExplorer/ImageEditingExample.js | 3 ++- .../DrawerAndroid/DrawerLayoutAndroid.android.js | 13 +++++++------ Libraries/Components/TextInput/TextInput.js | 8 ++++---- Libraries/Components/TextInput/TextInputState.js | 14 +++++++------- .../ToolbarAndroid/ToolbarAndroid.android.js | 4 ++-- .../Touchable/TouchableNativeFeedback.android.js | 10 +++++----- Libraries/Components/View/View.js | 4 ++-- .../ViewPager/ViewPagerAndroid.android.js | 12 +++++------- Libraries/Components/WebView/WebView.android.js | 14 +++++++------- Libraries/CustomComponents/ListView/ListView.js | 1 - Libraries/LayoutAnimation/LayoutAnimation.js | 4 ++-- Libraries/Portal/Portal.js | 6 +++--- Libraries/RKBackendNode/queryLayoutByID.js | 4 ++-- Libraries/ReactIOS/IOSNativeBridgeEventPlugin.js | 8 +++----- Libraries/ReactIOS/NativeMethodsMixin.js | 9 ++++----- Libraries/ReactIOS/requireNativeComponent.js | 8 ++++---- .../ReactNative/ReactNativeBaseComponent.js | 8 ++++---- .../ReactNative/ReactNativeDOMIDOperations.js | 6 +++--- .../ReactNativeGlobalResponderHandler.js | 6 +++--- Libraries/ReactNative/ReactNativeMount.js | 9 ++++----- .../ReactNative/ReactNativeTextComponent.js | 6 +++--- Libraries/ReactNative/UIManagerStatTracker.js | 14 +++++++------- Libraries/Utilities/Dimensions.js | 4 ++-- Libraries/Utilities/UIManager.js | 16 ++++++++++++++++ Libraries/react-native/react-native.js | 1 + 25 files changed, 102 insertions(+), 90 deletions(-) create mode 100644 Libraries/Utilities/UIManager.js diff --git a/Examples/UIExplorer/ImageEditingExample.js b/Examples/UIExplorer/ImageEditingExample.js index affd3679677..56ab1c4ba34 100644 --- a/Examples/UIExplorer/ImageEditingExample.js +++ b/Examples/UIExplorer/ImageEditingExample.js @@ -25,10 +25,11 @@ var { StyleSheet, Text, TouchableHighlight, + UIManager, View, } = React; var ImageEditingManager = NativeModules.ImageEditingManager; -var RCTScrollViewConsts = NativeModules.UIManager.RCTScrollView.Constants; +var RCTScrollViewConsts = UIManager.RCTScrollView.Constants; var PAGE_SIZE = 20; diff --git a/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js b/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js index 407f237e505..4b209bd4179 100644 --- a/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js +++ b/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js @@ -10,15 +10,16 @@ */ 'use strict'; -var DrawerConsts = require('NativeModules').UIManager.AndroidDrawerLayout.Constants; var NativeMethodsMixin = require('NativeMethodsMixin'); var React = require('React'); var ReactPropTypes = require('ReactPropTypes'); var ReactNativeViewAttributes = require('ReactNativeViewAttributes'); -var RCTUIManager = require('NativeModules').UIManager; var StyleSheet = require('StyleSheet'); +var UIManager = require('UIManager'); var View = require('View'); +var DrawerConsts = UIManager.AndroidDrawerLayout.Constants; + var dismissKeyboard = require('dismissKeyboard'); var merge = require('merge'); var requireNativeComponent = require('requireNativeComponent'); @@ -182,17 +183,17 @@ var DrawerLayoutAndroid = React.createClass({ }, openDrawer: function() { - RCTUIManager.dispatchViewManagerCommand( + UIManager.dispatchViewManagerCommand( this._getDrawerLayoutHandle(), - RCTUIManager.AndroidDrawerLayout.Commands.openDrawer, + UIManager.AndroidDrawerLayout.Commands.openDrawer, null ); }, closeDrawer: function() { - RCTUIManager.dispatchViewManagerCommand( + UIManager.dispatchViewManagerCommand( this._getDrawerLayoutHandle(), - RCTUIManager.AndroidDrawerLayout.Commands.closeDrawer, + UIManager.AndroidDrawerLayout.Commands.closeDrawer, null ); }, diff --git a/Libraries/Components/TextInput/TextInput.js b/Libraries/Components/TextInput/TextInput.js index c9728d96ab9..e7416e833bf 100644 --- a/Libraries/Components/TextInput/TextInput.js +++ b/Libraries/Components/TextInput/TextInput.js @@ -16,7 +16,6 @@ var EventEmitter = require('EventEmitter'); var NativeMethodsMixin = require('NativeMethodsMixin'); var Platform = require('Platform'); var PropTypes = require('ReactPropTypes'); -var RCTUIManager = require('NativeModules').UIManager; var React = require('React'); var ReactChildren = require('ReactChildren'); var StyleSheet = require('StyleSheet'); @@ -24,6 +23,7 @@ var Text = require('Text'); var TextInputState = require('TextInputState'); var TimerMixin = require('react-timer-mixin'); var TouchableWithoutFeedback = require('TouchableWithoutFeedback'); +var UIManager = require('UIManager'); var View = require('View'); var createReactNativeComponentClass = require('createReactNativeComponentClass'); @@ -496,11 +496,11 @@ var TextInput = React.createClass({ }, _renderAndroid: function() { - var autoCapitalize = RCTUIManager.UIText.AutocapitalizationType[this.props.autoCapitalize]; + var autoCapitalize = UIManager.UIText.AutocapitalizationType[this.props.autoCapitalize]; var textAlign = - RCTUIManager.AndroidTextInput.Constants.TextAlign[this.props.textAlign]; + UIManager.AndroidTextInput.Constants.TextAlign[this.props.textAlign]; var textAlignVertical = - RCTUIManager.AndroidTextInput.Constants.TextAlignVertical[this.props.textAlignVertical]; + UIManager.AndroidTextInput.Constants.TextAlignVertical[this.props.textAlignVertical]; var children = this.props.children; var childCount = 0; ReactChildren.forEach(children, () => ++childCount); diff --git a/Libraries/Components/TextInput/TextInputState.js b/Libraries/Components/TextInput/TextInputState.js index f3e35b78c2f..276bba0d781 100644 --- a/Libraries/Components/TextInput/TextInputState.js +++ b/Libraries/Components/TextInput/TextInputState.js @@ -16,7 +16,7 @@ 'use strict'; var Platform = require('Platform'); -var RCTUIManager = require('NativeModules').UIManager; +var UIManager = require('UIManager'); var TextInputState = { /** @@ -41,11 +41,11 @@ var TextInputState = { if (this._currentlyFocusedID !== textFieldID && textFieldID !== null) { this._currentlyFocusedID = textFieldID; if (Platform.OS === 'ios') { - RCTUIManager.focus(textFieldID); + UIManager.focus(textFieldID); } else if (Platform.OS === 'android') { - RCTUIManager.dispatchViewManagerCommand( + UIManager.dispatchViewManagerCommand( textFieldID, - RCTUIManager.AndroidTextInput.Commands.focusTextInput, + UIManager.AndroidTextInput.Commands.focusTextInput, null ); } @@ -61,11 +61,11 @@ var TextInputState = { if (this._currentlyFocusedID === textFieldID && textFieldID !== null) { this._currentlyFocusedID = null; if (Platform.OS === 'ios') { - RCTUIManager.blur(textFieldID); + UIManager.blur(textFieldID); } else if (Platform.OS === 'android') { - RCTUIManager.dispatchViewManagerCommand( + UIManager.dispatchViewManagerCommand( textFieldID, - RCTUIManager.AndroidTextInput.Commands.blurTextInput, + UIManager.AndroidTextInput.Commands.blurTextInput, null ); } diff --git a/Libraries/Components/ToolbarAndroid/ToolbarAndroid.android.js b/Libraries/Components/ToolbarAndroid/ToolbarAndroid.android.js index 774e602bee6..eb904d867af 100644 --- a/Libraries/Components/ToolbarAndroid/ToolbarAndroid.android.js +++ b/Libraries/Components/ToolbarAndroid/ToolbarAndroid.android.js @@ -13,10 +13,10 @@ var Image = require('Image'); var NativeMethodsMixin = require('NativeMethodsMixin'); -var RCTUIManager = require('NativeModules').UIManager; var React = require('React'); var ReactNativeViewAttributes = require('ReactNativeViewAttributes'); var ReactPropTypes = require('ReactPropTypes'); +var UIManager = require('UIManager'); var View = require('View'); var requireNativeComponent = require('requireNativeComponent'); @@ -154,7 +154,7 @@ var ToolbarAndroid = React.createClass({ action.icon = resolveAssetSource(action.icon); } if (action.show) { - action.show = RCTUIManager.ToolbarAndroid.Constants.ShowAsAction[action.show]; + action.show = UIManager.ToolbarAndroid.Constants.ShowAsAction[action.show]; } nativeActions.push(action); } diff --git a/Libraries/Components/Touchable/TouchableNativeFeedback.android.js b/Libraries/Components/Touchable/TouchableNativeFeedback.android.js index dd479bdfefb..bc875eda531 100644 --- a/Libraries/Components/Touchable/TouchableNativeFeedback.android.js +++ b/Libraries/Components/Touchable/TouchableNativeFeedback.android.js @@ -11,11 +11,11 @@ 'use strict'; var PropTypes = require('ReactPropTypes'); -var RCTUIManager = require('NativeModules').UIManager; var React = require('React'); var ReactNativeViewAttributes = require('ReactNativeViewAttributes'); var Touchable = require('Touchable'); var TouchableWithoutFeedback = require('TouchableWithoutFeedback'); +var UIManager = require('UIManager'); var createStrictShapeTypeChecker = require('createStrictShapeTypeChecker'); var ensurePositiveDelayProps = require('ensurePositiveDelayProps'); @@ -181,17 +181,17 @@ var TouchableNativeFeedback = React.createClass({ }, _dispatchHotspotUpdate: function(destX, destY) { - RCTUIManager.dispatchViewManagerCommand( + UIManager.dispatchViewManagerCommand( React.findNodeHandle(this), - RCTUIManager.RCTView.Commands.hotspotUpdate, + UIManager.RCTView.Commands.hotspotUpdate, [destX || 0, destY || 0] ); }, _dispatchPressedStateChange: function(pressed) { - RCTUIManager.dispatchViewManagerCommand( + UIManager.dispatchViewManagerCommand( React.findNodeHandle(this), - RCTUIManager.RCTView.Commands.setPressed, + UIManager.RCTView.Commands.setPressed, [pressed] ); }, diff --git a/Libraries/Components/View/View.js b/Libraries/Components/View/View.js index 84ab491875d..beaffb75c09 100644 --- a/Libraries/Components/View/View.js +++ b/Libraries/Components/View/View.js @@ -13,11 +13,11 @@ var NativeMethodsMixin = require('NativeMethodsMixin'); var PropTypes = require('ReactPropTypes'); -var RCTUIManager = require('NativeModules').UIManager; var React = require('React'); var ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); var ReactNativeViewAttributes = require('ReactNativeViewAttributes'); var StyleSheetPropType = require('StyleSheetPropType'); +var UIManager = require('UIManager'); var ViewStylePropTypes = require('ViewStylePropTypes'); var requireNativeComponent = require('requireNativeComponent'); @@ -327,7 +327,7 @@ var RCTView = requireNativeComponent('RCTView', View, { }); if (__DEV__) { - var viewConfig = RCTUIManager.viewConfigs && RCTUIManager.viewConfigs.RCTView || {}; + var viewConfig = UIManager.viewConfigs && UIManager.viewConfigs.RCTView || {}; for (var prop in viewConfig.nativeProps) { var viewAny: any = View; // Appease flow if (!viewAny.propTypes[prop] && !ReactNativeStyleAttributes[prop]) { diff --git a/Libraries/Components/ViewPager/ViewPagerAndroid.android.js b/Libraries/Components/ViewPager/ViewPagerAndroid.android.js index 7151917ff63..ec08841ec76 100644 --- a/Libraries/Components/ViewPager/ViewPagerAndroid.android.js +++ b/Libraries/Components/ViewPager/ViewPagerAndroid.android.js @@ -7,15 +7,13 @@ 'use strict'; var NativeMethodsMixin = require('NativeMethodsMixin'); -var NativeModules = require('NativeModules'); var React = require('React'); var ReactElement = require('ReactElement'); var ReactNativeViewAttributes = require('ReactNativeViewAttributes'); var ReactPropTypes = require('ReactPropTypes'); +var UIManager = require('UIManager'); var View = require('View'); -var RCTUIManager = NativeModules.UIManager; - var dismissKeyboard = require('dismissKeyboard'); var requireNativeComponent = require('requireNativeComponent'); @@ -157,9 +155,9 @@ var ViewPagerAndroid = React.createClass({ * The transition between pages will be animated. */ setPage: function(selectedPage: number) { - RCTUIManager.dispatchViewManagerCommand( + UIManager.dispatchViewManagerCommand( React.findNodeHandle(this), - RCTUIManager.AndroidViewPager.Commands.setPage, + UIManager.AndroidViewPager.Commands.setPage, [selectedPage], ); }, @@ -169,9 +167,9 @@ var ViewPagerAndroid = React.createClass({ * The transition between pages will be *not* be animated. */ setPageWithoutAnimation: function(selectedPage: number) { - RCTUIManager.dispatchViewManagerCommand( + UIManager.dispatchViewManagerCommand( React.findNodeHandle(this), - RCTUIManager.AndroidViewPager.Commands.setPageWithoutAnimation, + UIManager.AndroidViewPager.Commands.setPageWithoutAnimation, [selectedPage], ); }, diff --git a/Libraries/Components/WebView/WebView.android.js b/Libraries/Components/WebView/WebView.android.js index f3ce5956d80..d5569dcad39 100644 --- a/Libraries/Components/WebView/WebView.android.js +++ b/Libraries/Components/WebView/WebView.android.js @@ -14,6 +14,7 @@ var EdgeInsetsPropType = require('EdgeInsetsPropType'); var React = require('React'); var ReactNativeViewAttributes = require('ReactNativeViewAttributes'); var StyleSheet = require('StyleSheet'); +var UIManager = require('UIManager'); var View = require('View'); var keyMirror = require('keyMirror'); @@ -21,7 +22,6 @@ var merge = require('merge'); var requireNativeComponent = require('requireNativeComponent'); var PropTypes = React.PropTypes; -var RCTUIManager = require('NativeModules').UIManager; var RCT_WEBVIEW_REF = 'webview'; @@ -129,25 +129,25 @@ var WebView = React.createClass({ }, goForward: function() { - RCTUIManager.dispatchViewManagerCommand( + UIManager.dispatchViewManagerCommand( this.getWebWiewHandle(), - RCTUIManager.RCTWebView.Commands.goForward, + UIManager.RCTWebView.Commands.goForward, null ); }, goBack: function() { - RCTUIManager.dispatchViewManagerCommand( + UIManager.dispatchViewManagerCommand( this.getWebWiewHandle(), - RCTUIManager.RCTWebView.Commands.goBack, + UIManager.RCTWebView.Commands.goBack, null ); }, reload: function() { - RCTUIManager.dispatchViewManagerCommand( + UIManager.dispatchViewManagerCommand( this.getWebWiewHandle(), - RCTUIManager.RCTWebView.Commands.reload, + UIManager.RCTWebView.Commands.reload, null ); }, diff --git a/Libraries/CustomComponents/ListView/ListView.js b/Libraries/CustomComponents/ListView/ListView.js index fb99f168759..5706ff0f91b 100644 --- a/Libraries/CustomComponents/ListView/ListView.js +++ b/Libraries/CustomComponents/ListView/ListView.js @@ -28,7 +28,6 @@ var ListViewDataSource = require('ListViewDataSource'); var React = require('React'); -var RCTUIManager = require('NativeModules').UIManager; var RCTScrollViewManager = require('NativeModules').ScrollViewManager; var ScrollView = require('ScrollView'); var ScrollResponder = require('ScrollResponder'); diff --git a/Libraries/LayoutAnimation/LayoutAnimation.js b/Libraries/LayoutAnimation/LayoutAnimation.js index 881b499f2ba..140c35ff878 100644 --- a/Libraries/LayoutAnimation/LayoutAnimation.js +++ b/Libraries/LayoutAnimation/LayoutAnimation.js @@ -12,7 +12,7 @@ 'use strict'; var PropTypes = require('ReactPropTypes'); -var RCTUIManager = require('NativeModules').UIManager; +var UIManager = require('UIManager'); var createStrictShapeTypeChecker = require('createStrictShapeTypeChecker'); var keyMirror = require('keyMirror'); @@ -71,7 +71,7 @@ type Config = { function configureNext(config: Config, onAnimationDidEnd?: Function) { configChecker({config}, 'config', 'LayoutAnimation.configureNext'); - RCTUIManager.configureNextLayoutAnimation( + UIManager.configureNextLayoutAnimation( config, onAnimationDidEnd || function() {}, function() { /* unused */ } ); } diff --git a/Libraries/Portal/Portal.js b/Libraries/Portal/Portal.js index ac80e04109f..f6ed4c8f786 100644 --- a/Libraries/Portal/Portal.js +++ b/Libraries/Portal/Portal.js @@ -8,8 +8,8 @@ var Platform = require('Platform'); var React = require('React'); -var RCTUIManager = require('NativeModules').UIManager; var StyleSheet = require('StyleSheet'); +var UIManager = require('UIManager'); var View = require('View'); var _portalRef: any; @@ -135,9 +135,9 @@ var Portal = React.createClass({ // TextViews have no text set at the moment of populating event. setTimeout(() => { if (this._getOpenModals().length > 0) { - RCTUIManager.sendAccessibilityEvent( + UIManager.sendAccessibilityEvent( React.findNodeHandle(this), - RCTUIManager.AccessibilityEventTypes.typeWindowStateChanged); + UIManager.AccessibilityEventTypes.typeWindowStateChanged); } }, 0); } diff --git a/Libraries/RKBackendNode/queryLayoutByID.js b/Libraries/RKBackendNode/queryLayoutByID.js index d6492e6da48..5d038c232bb 100644 --- a/Libraries/RKBackendNode/queryLayoutByID.js +++ b/Libraries/RKBackendNode/queryLayoutByID.js @@ -12,7 +12,7 @@ 'use strict'; var ReactNativeTagHandles = require('ReactNativeTagHandles'); -var RCTUIManager = require('NativeModules').UIManager; +var UIManager = require('UIManager'); type OnSuccessCallback = ( left: number, @@ -51,7 +51,7 @@ var queryLayoutByID = function( onSuccess: OnSuccessCallback ): void { // Native bridge doesn't *yet* surface errors. - RCTUIManager.measure( + UIManager.measure( ReactNativeTagHandles.rootNodeIDToTag[rootNodeID], onSuccess ); diff --git a/Libraries/ReactIOS/IOSNativeBridgeEventPlugin.js b/Libraries/ReactIOS/IOSNativeBridgeEventPlugin.js index 55b22a95993..6c1d887e555 100644 --- a/Libraries/ReactIOS/IOSNativeBridgeEventPlugin.js +++ b/Libraries/ReactIOS/IOSNativeBridgeEventPlugin.js @@ -12,16 +12,14 @@ 'use strict'; var EventPropagators = require('EventPropagators'); -var NativeModules = require('NativeModules'); var SyntheticEvent = require('SyntheticEvent'); +var UIManager = require('UIManager'); var merge = require('merge'); var warning = require('warning'); -var RCTUIManager = NativeModules.UIManager; - -var customBubblingEventTypes = RCTUIManager.customBubblingEventTypes; -var customDirectEventTypes = RCTUIManager.customDirectEventTypes; +var customBubblingEventTypes = UIManager.customBubblingEventTypes; +var customDirectEventTypes = UIManager.customDirectEventTypes; var allTypesByEventName = {}; diff --git a/Libraries/ReactIOS/NativeMethodsMixin.js b/Libraries/ReactIOS/NativeMethodsMixin.js index b2b5ba41928..33b99994a72 100644 --- a/Libraries/ReactIOS/NativeMethodsMixin.js +++ b/Libraries/ReactIOS/NativeMethodsMixin.js @@ -11,10 +11,9 @@ */ 'use strict'; -var NativeModules = require('NativeModules'); -var RCTUIManager = NativeModules.UIManager; var ReactNativeAttributePayload = require('ReactNativeAttributePayload'); var TextInputState = require('TextInputState'); +var UIManager = require('UIManager'); var findNodeHandle = require('findNodeHandle'); var invariant = require('invariant'); @@ -78,7 +77,7 @@ var NativeMethodsMixin = { * prop](/react-native/docs/view.html#onlayout) instead. */ measure: function(callback: MeasureOnSuccessCallback) { - RCTUIManager.measure( + UIManager.measure( findNodeHandle(this), mountSafeCallback(this, callback) ); @@ -97,7 +96,7 @@ var NativeMethodsMixin = { onSuccess: MeasureLayoutOnSuccessCallback, onFail: () => void /* currently unused */ ) { - RCTUIManager.measureLayout( + UIManager.measureLayout( findNodeHandle(this), relativeToNativeNode, mountSafeCallback(this, onFail), @@ -121,7 +120,7 @@ var NativeMethodsMixin = { this.viewConfig.validAttributes ); - RCTUIManager.updateView( + UIManager.updateView( findNodeHandle(this), this.viewConfig.uiViewClassName, updatePayload diff --git a/Libraries/ReactIOS/requireNativeComponent.js b/Libraries/ReactIOS/requireNativeComponent.js index 11defc0ada1..a046fcbd149 100644 --- a/Libraries/ReactIOS/requireNativeComponent.js +++ b/Libraries/ReactIOS/requireNativeComponent.js @@ -11,8 +11,8 @@ */ 'use strict'; -var RCTUIManager = require('NativeModules').UIManager; var ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); +var UIManager = require('UIManager'); var UnimplementedView = require('UnimplementedView'); var createReactNativeComponentClass = require('createReactNativeComponentClass'); @@ -27,7 +27,7 @@ var warning = require('warning'); /** * Used to create React components that directly wrap native component * implementations. Config information is extracted from data exported from the - * RCTUIManager module. You should also wrap the native component in a + * UIManager module. You should also wrap the native component in a * hand-written component with full propTypes definitions and other * documentation - pass the hand-written component in as `componentInterface` to * verify all the native props are documented via `propTypes`. @@ -46,13 +46,13 @@ function requireNativeComponent( componentInterface?: ?ComponentInterface, extraConfig?: ?{nativeOnly?: Object}, ): Function { - var viewConfig = RCTUIManager[viewName]; + var viewConfig = UIManager[viewName]; if (!viewConfig || !viewConfig.NativeProps) { warning(false, 'Native component for "%s" does not exist', viewName); return UnimplementedView; } var nativeProps = { - ...RCTUIManager.RCTView.NativeProps, + ...UIManager.RCTView.NativeProps, ...viewConfig.NativeProps, }; viewConfig.uiViewClassName = viewName; diff --git a/Libraries/ReactNative/ReactNativeBaseComponent.js b/Libraries/ReactNative/ReactNativeBaseComponent.js index cfd3df3e832..765c0429063 100644 --- a/Libraries/ReactNative/ReactNativeBaseComponent.js +++ b/Libraries/ReactNative/ReactNativeBaseComponent.js @@ -17,7 +17,7 @@ var ReactNativeEventEmitter = require('ReactNativeEventEmitter'); var ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); var ReactNativeTagHandles = require('ReactNativeTagHandles'); var ReactMultiChild = require('ReactMultiChild'); -var RCTUIManager = require('NativeModules').UIManager; +var UIManager = require('UIManager'); var deepFreezeAndThrowOnMutationInDev = require('deepFreezeAndThrowOnMutationInDev'); var warning = require('warning'); @@ -123,7 +123,7 @@ ReactNativeBaseComponent.Mixin = { ); createdTags[i] = mountImage.tag; } - RCTUIManager + UIManager .manageChildren(containerTag, null, null, createdTags, indexes, null); } }, @@ -151,7 +151,7 @@ ReactNativeBaseComponent.Mixin = { ); if (updatePayload) { - RCTUIManager.updateView( + UIManager.updateView( ReactNativeTagHandles.mostRecentMountedNodeHandleForRootNodeID(this._rootNodeID), this.viewConfig.uiViewClassName, updatePayload @@ -216,7 +216,7 @@ ReactNativeBaseComponent.Mixin = { ); var nativeTopRootID = ReactNativeTagHandles.getNativeTopRootIDFromNodeID(rootID); - RCTUIManager.createView( + UIManager.createView( tag, this.viewConfig.uiViewClassName, nativeTopRootID ? ReactNativeTagHandles.rootNodeIDToTag[nativeTopRootID] : null, diff --git a/Libraries/ReactNative/ReactNativeDOMIDOperations.js b/Libraries/ReactNative/ReactNativeDOMIDOperations.js index af17f9e0742..fbf90db5033 100644 --- a/Libraries/ReactNative/ReactNativeDOMIDOperations.js +++ b/Libraries/ReactNative/ReactNativeDOMIDOperations.js @@ -13,8 +13,8 @@ var ReactNativeTagHandles = require('ReactNativeTagHandles'); var ReactMultiChildUpdateTypes = require('ReactMultiChildUpdateTypes'); -var RCTUIManager = require('NativeModules').UIManager; var ReactPerf = require('ReactPerf'); +var UIManager = require('UIManager'); /** * Updates a component's children by processing a series of updates. @@ -59,7 +59,7 @@ var dangerouslyProcessChildrenUpdates = function(childrenUpdates, markupList) { for (var updateParentTagString in byContainerTag) { var updateParentTagNumber = +updateParentTagString; var childUpdatesToSend = byContainerTag[updateParentTagNumber]; - RCTUIManager.manageChildren( + UIManager.manageChildren( updateParentTagNumber, childUpdatesToSend.moveFromIndices, childUpdatesToSend.moveToIndices, @@ -93,7 +93,7 @@ var ReactNativeDOMIDOperations = { 'dangerouslyReplaceNodeWithMarkupByID', function(id, mountImage) { var oldTag = ReactNativeTagHandles.mostRecentMountedNodeHandleForRootNodeID(id); - RCTUIManager.replaceExistingNonRootView(oldTag, mountImage.tag); + UIManager.replaceExistingNonRootView(oldTag, mountImage.tag); ReactNativeTagHandles.associateRootNodeIDWithMountedNodeHandle(id, mountImage.tag); } ), diff --git a/Libraries/ReactNative/ReactNativeGlobalResponderHandler.js b/Libraries/ReactNative/ReactNativeGlobalResponderHandler.js index 1f548c3ebcc..1094e60451b 100644 --- a/Libraries/ReactNative/ReactNativeGlobalResponderHandler.js +++ b/Libraries/ReactNative/ReactNativeGlobalResponderHandler.js @@ -11,18 +11,18 @@ */ 'use strict'; -var RCTUIManager = require('NativeModules').UIManager; var ReactNativeTagHandles = require('ReactNativeTagHandles'); +var UIManager = require('UIManager'); var ReactNativeGlobalResponderHandler = { onChange: function(from: string, to: string, blockNativeResponder: boolean) { if (to !== null) { - RCTUIManager.setJSResponder( + UIManager.setJSResponder( ReactNativeTagHandles.mostRecentMountedNodeHandleForRootNodeID(to), blockNativeResponder ); } else { - RCTUIManager.clearJSResponder(); + UIManager.clearJSResponder(); } } }; diff --git a/Libraries/ReactNative/ReactNativeMount.js b/Libraries/ReactNative/ReactNativeMount.js index 02dbcb40fc7..1f6dab51b8a 100644 --- a/Libraries/ReactNative/ReactNativeMount.js +++ b/Libraries/ReactNative/ReactNativeMount.js @@ -11,14 +11,13 @@ */ 'use strict'; -var RCTUIManager = require('NativeModules').UIManager; - var ReactElement = require('ReactElement'); var ReactNativeTagHandles = require('ReactNativeTagHandles'); var ReactPerf = require('ReactPerf'); var ReactReconciler = require('ReactReconciler'); var ReactUpdateQueue = require('ReactUpdateQueue'); var ReactUpdates = require('ReactUpdates'); +var UIManager = require('UIManager'); var emptyObject = require('emptyObject'); var instantiateReactComponent = require('instantiateReactComponent'); @@ -191,7 +190,7 @@ var ReactNativeMount = { ); var addChildTags = [mountImage.tag]; var addAtIndices = [0]; - RCTUIManager.manageChildren( + UIManager.manageChildren( ReactNativeTagHandles.mostRecentMountedNodeHandleForRootNodeID(containerID), null, // moveFromIndices null, // moveToIndices @@ -215,7 +214,7 @@ var ReactNativeMount = { ) { ReactNativeMount.unmountComponentAtNode(containerTag); // call back into native to remove all of the subviews from this container - RCTUIManager.removeRootView(containerTag); + UIManager.removeRootView(containerTag); }, /** @@ -256,7 +255,7 @@ var ReactNativeMount = { ReactReconciler.unmountComponent(instance); var containerTag = ReactNativeTagHandles.mostRecentMountedNodeHandleForRootNodeID(containerID); - RCTUIManager.removeSubviewsFromContainerWithID(containerTag); + UIManager.removeSubviewsFromContainerWithID(containerTag); }, getNode: function(rootNodeID: string): number { diff --git a/Libraries/ReactNative/ReactNativeTextComponent.js b/Libraries/ReactNative/ReactNativeTextComponent.js index a7694c1394c..e9f67ce59fd 100644 --- a/Libraries/ReactNative/ReactNativeTextComponent.js +++ b/Libraries/ReactNative/ReactNativeTextComponent.js @@ -12,7 +12,7 @@ 'use strict'; var ReactNativeTagHandles = require('ReactNativeTagHandles'); -var RCTUIManager = require('NativeModules').UIManager; +var UIManager = require('UIManager'); var assign = require('Object.assign'); var invariant = require('invariant'); @@ -39,7 +39,7 @@ assign(ReactNativeTextComponent.prototype, { this._rootNodeID = rootID; var tag = ReactNativeTagHandles.allocateTag(); var nativeTopRootID = ReactNativeTagHandles.getNativeTopRootIDFromNodeID(rootID); - RCTUIManager.createView( + UIManager.createView( tag, 'RCTRawText', nativeTopRootID ? ReactNativeTagHandles.rootNodeIDToTag[nativeTopRootID] : null, @@ -57,7 +57,7 @@ assign(ReactNativeTextComponent.prototype, { var nextStringText = '' + nextText; if (nextStringText !== this._stringText) { this._stringText = nextStringText; - RCTUIManager.updateView( + UIManager.updateView( ReactNativeTagHandles.mostRecentMountedNodeHandleForRootNodeID( this._rootNodeID ), diff --git a/Libraries/ReactNative/UIManagerStatTracker.js b/Libraries/ReactNative/UIManagerStatTracker.js index ef9c64b2bbb..a3b8779234f 100644 --- a/Libraries/ReactNative/UIManagerStatTracker.js +++ b/Libraries/ReactNative/UIManagerStatTracker.js @@ -11,7 +11,7 @@ */ 'use strict'; -var RCTUIManager = require('NativeModules').UIManager; +var UIManager = require('UIManager'); var installed = false; var UIManagerStatTracker = { @@ -32,20 +32,20 @@ var UIManagerStatTracker = { statLogHandle = setImmediate(printStats); } } - var createViewOrig = RCTUIManager.createView; - RCTUIManager.createView = function(tag, className, rootTag, props) { + var createViewOrig = UIManager.createView; + UIManager.createView = function(tag, className, rootTag, props) { incStat('createView', 1); incStat('setProp', Object.keys(props || []).length); createViewOrig(tag, className, rootTag, props); }; - var updateViewOrig = RCTUIManager.updateView; - RCTUIManager.updateView = function(tag, className, props) { + var updateViewOrig = UIManager.updateView; + UIManager.updateView = function(tag, className, props) { incStat('updateView', 1); incStat('setProp', Object.keys(props || []).length); updateViewOrig(tag, className, props); }; - var manageChildrenOrig = RCTUIManager.manageChildren; - RCTUIManager.manageChildren = function(tag, moveFrom, moveTo, addTags, addIndices, remove) { + var manageChildrenOrig = UIManager.manageChildren; + UIManager.manageChildren = function(tag, moveFrom, moveTo, addTags, addIndices, remove) { incStat('manageChildren', 1); incStat('move', Object.keys(moveFrom || []).length); incStat('remove', Object.keys(remove || []).length); diff --git a/Libraries/Utilities/Dimensions.js b/Libraries/Utilities/Dimensions.js index 31fa0d4dc4f..319aa84622e 100644 --- a/Libraries/Utilities/Dimensions.js +++ b/Libraries/Utilities/Dimensions.js @@ -11,11 +11,11 @@ */ 'use strict'; -var NativeModules = require('NativeModules'); +var UIManager = require('UIManager'); var invariant = require('invariant'); -var dimensions = NativeModules.UIManager.Dimensions; +var dimensions = UIManager.Dimensions; // We calculate the window dimensions in JS so that we don't encounter loss of // precision in transferring the dimensions (which could be non-integers) over diff --git a/Libraries/Utilities/UIManager.js b/Libraries/Utilities/UIManager.js new file mode 100644 index 00000000000..3cdfb2e91db --- /dev/null +++ b/Libraries/Utilities/UIManager.js @@ -0,0 +1,16 @@ +/** + * Copyright (c) 2015-present, Facebook, Inc. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. An additional grant + * of patent rights can be found in the PATENTS file in the same directory. + * + * @providesModule UIManager + * @flow + */ +'use strict'; + +var UIManager = require('NativeModules').UIManager; + +module.exports = UIManager; diff --git a/Libraries/react-native/react-native.js b/Libraries/react-native/react-native.js index 29ff9520586..2264fa5c665 100644 --- a/Libraries/react-native/react-native.js +++ b/Libraries/react-native/react-native.js @@ -78,6 +78,7 @@ var ReactNative = Object.assign(Object.create(require('React')), { Settings: require('Settings'), StatusBarIOS: require('StatusBarIOS'), StyleSheet: require('StyleSheet'), + UIManager: require('UIManager'), VibrationIOS: require('VibrationIOS'), // Plugins