Modernize ScrollResponder.js

Reviewed By: sahrens

Differential Revision: D6661084

fbshipit-source-id: 46cef96dc86842b379728d8465ce4feb408338c7

Libraries/Components/ScrollResponder.js

@@ -11,27 +11,21 @@
  */
 'use strict';
 
-var Dimensions = require('Dimensions');
-var FrameRateLogger = require('FrameRateLogger');
-var Keyboard = require('Keyboard');
-var ReactNative = require('ReactNative');
-var Subscribable = require('Subscribable');
-var TextInputState = require('TextInputState');
-var UIManager = require('UIManager');
-
-var invariant = require('fbjs/lib/invariant');
-var nullthrows = require('fbjs/lib/nullthrows');
-/* $FlowFixMe(>=0.54.0 site=react_native_oss) This comment suppresses an error
- * found when Flow v0.54 was deployed. To see the error delete this comment and
- * run Flow. */
-var performanceNow = require('fbjs/lib/performanceNow');
-/* $FlowFixMe(>=0.54.0 site=react_native_oss) This comment suppresses an error
- * found when Flow v0.54 was deployed. To see the error delete this comment and
- * run Flow. */
-var warning = require('fbjs/lib/warning');
-
-var { ScrollViewManager } = require('NativeModules');
-var { getInstanceFromNode } = require('ReactNativeComponentTree');
+const Dimensions = require('Dimensions');
+const FrameRateLogger = require('FrameRateLogger');
+const Keyboard = require('Keyboard');
+const ReactNative = require('ReactNative');
+const Subscribable = require('Subscribable');
+const TextInputState = require('TextInputState');
+const UIManager = require('UIManager');
+
+const invariant = require('fbjs/lib/invariant');
+const nullthrows = require('fbjs/lib/nullthrows');
+const performanceNow = require('fbjs/lib/performanceNow');
+const warning = require('fbjs/lib/warning');
+
+const { ScrollViewManager } = require('NativeModules');
+const { getInstanceFromNode } = require('ReactNativeComponentTree');
 
 /**
  * Mixin that can be integrated in order to handle scrolling that plays well
@@ -111,7 +105,7 @@ var { getInstanceFromNode } = require('ReactNativeComponentTree');
  *   this.props.onKeyboardDidHide
  */
 
-var IS_ANIMATING_TOUCH_START_THRESHOLD_MS = 16;
+const IS_ANIMATING_TOUCH_START_THRESHOLD_MS = 16;
 
 type State = {
     isTouching: boolean,
@@ -123,15 +117,15 @@ type State = {
 type Event = Object;
 
 function isTagInstanceOfTextInput(tag) {
-  var instance = getInstanceFromNode(tag);
+  const instance = getInstanceFromNode(tag);
   return instance && instance.viewConfig && (
     instance.viewConfig.uiViewClassName === 'AndroidTextInput' ||
     instance.viewConfig.uiViewClassName === 'RCTMultilineTextInputView' ||
     instance.viewConfig.uiViewClassName === 'RCTSinglelineTextInputView'
   );
 }
 
-var ScrollResponderMixin = {
+const ScrollResponderMixin = {
   mixins: [Subscribable.Mixin],
   scrollResponderMixinGetInitialState: function(): State {
     return {
@@ -182,7 +176,7 @@ var ScrollResponderMixin = {
    *
    */
   scrollResponderHandleStartShouldSetResponder: function(e: Event): boolean {
-    var currentlyFocusedTextInput = TextInputState.currentlyFocusedField();
+    const currentlyFocusedTextInput = TextInputState.currentlyFocusedField();
 
     if (this.props.keyboardShouldPersistTaps === 'handled' &&
       currentlyFocusedTextInput != null &&
@@ -205,9 +199,9 @@ var ScrollResponderMixin = {
    */
   scrollResponderHandleStartShouldSetResponderCapture: function(e: Event): boolean {
     // First see if we want to eat taps while the keyboard is up
-    var currentlyFocusedTextInput = TextInputState.currentlyFocusedField();
-    var {keyboardShouldPersistTaps} = this.props;
-    var keyboardNeverPersistTaps = !keyboardShouldPersistTaps ||
+    const currentlyFocusedTextInput = TextInputState.currentlyFocusedField();
+    const {keyboardShouldPersistTaps} = this.props;
+    const keyboardNeverPersistTaps = !keyboardShouldPersistTaps ||
                                     keyboardShouldPersistTaps === 'never';
     if (keyboardNeverPersistTaps &&
       currentlyFocusedTextInput != null &&
@@ -255,7 +249,7 @@ var ScrollResponderMixin = {
    * @param {SyntheticEvent} e Event.
    */
   scrollResponderHandleTouchEnd: function(e: Event) {
-    var nativeEvent = e.nativeEvent;
+    const nativeEvent = e.nativeEvent;
     this.state.isTouching = nativeEvent.touches.length !== 0;
     this.props.onTouchEnd && this.props.onTouchEnd(e);
   },
@@ -278,7 +272,7 @@ var ScrollResponderMixin = {
 
     // By default scroll views will unfocus a textField
     // if another touch occurs outside of it
-    var currentlyFocusedTextInput = TextInputState.currentlyFocusedField();
+    const currentlyFocusedTextInput = TextInputState.currentlyFocusedField();
     if (this.props.keyboardShouldPersistTaps !== true &&
       this.props.keyboardShouldPersistTaps !== 'always' &&
       currentlyFocusedTextInput != null &&
@@ -388,9 +382,9 @@ var ScrollResponderMixin = {
    * a touch has just started or ended.
    */
   scrollResponderIsAnimating: function(): boolean {
-    var now = performanceNow();
-    var timeSinceLastMomentumScrollEnd = now - this.state.lastMomentumScrollEndTime;
-    var isAnimating = timeSinceLastMomentumScrollEnd < IS_ANIMATING_TOUCH_START_THRESHOLD_MS ||
+    const now = performanceNow();
+    const timeSinceLastMomentumScrollEnd = now - this.state.lastMomentumScrollEndTime;
+    const isAnimating = timeSinceLastMomentumScrollEnd < IS_ANIMATING_TOUCH_START_THRESHOLD_MS ||
       this.state.lastMomentumScrollEndTime < this.state.lastMomentumScrollBeginTime;
     return isAnimating;
   },
@@ -469,15 +463,13 @@ var ScrollResponderMixin = {
    * @platform ios
    */
   scrollResponderZoomTo: function(
-    rect: { x: number, y: number, width: number, height: number, animated?: boolean },
+    rect: {| x: number, y: number, width: number, height: number, animated?: boolean |},
     animated?: boolean // deprecated, put this inside the rect argument instead
   ) {
     invariant(ScrollViewManager && ScrollViewManager.zoomToRect, 'zoomToRect is not implemented');
     if ('animated' in rect) {
-      /* $FlowFixMe(>=0.60.0 site=react_native_fb) This comment suppresses an
-       * error found when Flow v0.60 was deployed. To see the error delete this
-       * comment and run Flow. */
-      var { animated, ...rect } = rect;
+      animated = rect.animated;
+      delete rect.animated;
     } else if (typeof animated !== 'undefined') {
       console.warn('`scrollResponderZoomTo` `animated` argument is deprecated. Use `options.animated` instead');
     }
@@ -527,11 +519,11 @@ var ScrollResponderMixin = {
    * @param {number} height Height of the text input.
    */
   scrollResponderInputMeasureAndScrollToKeyboard: function(left: number, top: number, width: number, height: number) {
-    var keyboardScreenY = Dimensions.get('window').height;
+    let keyboardScreenY = Dimensions.get('window').height;
     if (this.keyboardWillOpenTo) {
       keyboardScreenY = this.keyboardWillOpenTo.endCoordinates.screenY;
     }
-    var scrollOffsetY = top - keyboardScreenY + height + this.additionalScrollOffset;
+    let scrollOffsetY = top - keyboardScreenY + height + this.additionalScrollOffset;
 
     // By default, this can scroll with negative offset, pulling the content
     // down so that the target component's bottom meets the keyboard's top.
@@ -557,7 +549,7 @@ var ScrollResponderMixin = {
    * The `keyboardWillShow` is called before input focus.
    */
   componentWillMount: function() {
-    var {keyboardShouldPersistTaps} = this.props;
+    const {keyboardShouldPersistTaps} = this.props;
     warning(
       typeof keyboardShouldPersistTaps !== 'boolean',
       `'keyboardShouldPersistTaps={${keyboardShouldPersistTaps}}' is deprecated. `
@@ -626,7 +618,7 @@ var ScrollResponderMixin = {
 
 };
 
-var ScrollResponder = {
+const ScrollResponder = {
   Mixin: ScrollResponderMixin,
 };