Add NavigationExperimental

.flowconfig

@@ -0,0 +1,46 @@
+[ignore]
+; We fork some components by platform
+.*/*[.]android.js
+
+; Ignore "BUCK" generated dirs
+<PROJECT_ROOT>/\.buckd/
+
+; Ignore unexpected extra "@providesModule"
+.*/node_modules/.*/node_modules/fbjs/.*
+
+; Ignore duplicate module providers
+; For RN Apps installed via npm, "Libraries" folder is inside
+; "node_modules/react-native" but in the source repo it is in the root
+.*/Libraries/react-native/React.js
+.*/Libraries/react-native/ReactNative.js
+
+[include]
+
+[libs]
+node_modules/react-native/Libraries/react-native/react-native-interface.js
+node_modules/react-native/flow
+flow/
+
+[options]
+emoji=true
+
+module.system=haste
+
+experimental.strict_type_args=true
+
+munge_underscores=true
+
+module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'
+
+suppress_type=$FlowIssue
+suppress_type=$FlowFixMe
+suppress_type=$FixMe
+
+suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(3[0-8]\\|[1-2][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
+suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(3[0-8]\\|1[0-9]\\|[1-2][0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
+suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
+
+unsafe.enable_getters_and_setters=true
+
+[version]
+^0.38.0

.gitignore

@@ -0,0 +1 @@
+node_modules

README.md

@@ -13,4 +13,24 @@ Latest documentation is available here: http://facebook.github.io/react-native/r
 
 - Navigator.props.sceneStyle must be a plain object, not a stylesheet!
 
-(this breaking change is needed to avoid calling React Native's private APIs)
+(this breaking change is needed to avoid calling React Native's private APIs)
+
+### Usage
+
+Simply replace Navigator imports with the one from this package.
+
+```js
+import { Navigator } from 'react-native-deprecated-custom-components';
+```
+
+## NavigationExperimental
+
+The NavigationExperimental module will behave identically as the one in React Native 0.43.
+
+### Usage
+
+Simply replace NavigationExperimental imports with the one from this package.
+
+```js
+import { NavigationExperimental } from 'react-native-deprecated-custom-components';
+```

package.json

@@ -6,14 +6,24 @@
     "type": "git",
     "url": "[email protected]:facebookarchive/react-native-custom-components.git"
   },
+  "scripts": {
+    "flow": "flow"
+  },
   "main": "src/CustomComponents.js",
   "dependencies": {
+    "clamp": "^1.0.1",
     "fbjs": "~0.8.9",
     "immutable": "~3.7.6",
     "react-timer-mixin": "^0.13.2",
     "rebound": "^0.0.13"
   },
   "peerDependencies": {
+    "react": "*",
     "react-native": "*"
+  },
+  "devDependencies": {
+    "flow-bin": "^0.38.0",
+    "react": "~15.4.1",
+    "react-native": "^0.42.3"
   }
-}
+}

src/CustomComponents.js

@@ -22,11 +22,14 @@
  * OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THE SOFTWARE, EVEN IF
  * ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *
+ * @flow
  */
 
 
+const NavigationExperimental = require('./NavigationExperimental');
 const Navigator = require('./Navigator');
 
 module.exports = {
+  NavigationExperimental,
   Navigator,
 };

src/NavigationExperimental/NavigationAbstractPanResponder.js

@@ -0,0 +1,55 @@
+/**
+ * Copyright (c) 2013-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.
+ *
+ * @flow
+ */
+'use strict';
+
+const {PanResponder} = require('react-native');
+
+const invariant = require('fbjs/lib/invariant');
+
+import type  {
+  NavigationPanPanHandlers,
+} from './NavigationTypeDefinition';
+
+const EmptyPanHandlers = {
+  onMoveShouldSetPanResponder: null,
+  onPanResponderGrant: null,
+  onPanResponderMove: null,
+  onPanResponderRelease: null,
+  onPanResponderTerminate: null,
+};
+
+/**
+ * Abstract class that defines the common interface of PanResponder that handles
+ * the gesture actions.
+ */
+class NavigationAbstractPanResponder {
+
+  panHandlers: NavigationPanPanHandlers;
+
+  constructor() {
+    const config = {};
+    Object.keys(EmptyPanHandlers).forEach(name => {
+      const fn: any = (this: any)[name];
+
+      invariant(
+        typeof fn === 'function',
+        'subclass of `NavigationAbstractPanResponder` must implement method %s',
+        name
+      );
+
+      config[name] = fn.bind(this);
+    }, this);
+
+    this.panHandlers = PanResponder.create(config).panHandlers;
+  }
+}
+
+module.exports = NavigationAbstractPanResponder;

src/clamp.js → src/NavigationExperimental/NavigationAnimatedValueSubscription.js

@@ -22,24 +22,26 @@
  * OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THE SOFTWARE, EVEN IF
  * ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *
- * @typechecks
+ * @flow
  */
 'use strict';
 
-/**
- * @param {number} value
- * @param {number} min
- * @param {number} max
- * @return {number}
- */
-function clamp(min, value, max) {
-  if (value < min) {
-    return min;
+import type  {
+  NavigationAnimatedValue
+} from './NavigationTypeDefinition';
+
+class NavigationAnimatedValueSubscription {
+  _value: NavigationAnimatedValue;
+  _token: string;
+
+  constructor(value: NavigationAnimatedValue, callback: Function) {
+    this._value = value;
+    this._token = value.addListener(callback);
   }
-  if (value > max) {
-    return max;
+
+  remove(): void {
+    this._value.removeListener(this._token);
   }
-  return value;
 }
 
-module.exports = clamp;
+module.exports = NavigationAnimatedValueSubscription;

src/NavigationExperimental/NavigationCard.js

@@ -0,0 +1,130 @@
+/**
+ * Copyright (c) 2013-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.
+ *
+ * Facebook, Inc. ("Facebook") owns all right, title and interest, including
+ * all intellectual property and other proprietary rights, in and to the React
+ * Native CustomComponents software (the "Software").  Subject to your
+ * compliance with these terms, you are hereby granted a non-exclusive,
+ * worldwide, royalty-free copyright license to (1) use and copy the Software;
+ * and (2) reproduce and distribute the Software as part of your own software
+ * ("Your Software").  Facebook reserves all rights not expressly granted to
+ * you in this license agreement.
+ *
+ * THE SOFTWARE AND DOCUMENTATION, IF ANY, ARE PROVIDED "AS IS" AND ANY EXPRESS
+ * OR IMPLIED WARRANTIES (INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES
+ * OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE) ARE DISCLAIMED.
+ * IN NO EVENT SHALL FACEBOOK OR ITS AFFILIATES, OFFICERS, DIRECTORS OR
+ * EMPLOYEES BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
+ * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
+ * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS;
+ * OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY,
+ * WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ * OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THE SOFTWARE, EVEN IF
+ * ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ *
+ * @flow
+ */
+'use strict';
+
+const {Animated, StyleSheet} = require('react-native');
+const NavigationCardStackPanResponder = require('./NavigationCardStackPanResponder');
+const NavigationCardStackStyleInterpolator = require('./NavigationCardStackStyleInterpolator');
+const NavigationPagerPanResponder = require('./NavigationPagerPanResponder');
+const NavigationPagerStyleInterpolator = require('./NavigationPagerStyleInterpolator');
+const NavigationPointerEventsContainer = require('./NavigationPointerEventsContainer');
+const NavigationPropTypes = require('./NavigationPropTypes');
+const React = require('react');
+
+import type  {
+  NavigationPanPanHandlers,
+  NavigationSceneRenderer,
+  NavigationSceneRendererProps,
+} from './NavigationTypeDefinition';
+
+type Props = NavigationSceneRendererProps & {
+  onComponentRef: (ref: any) => void,
+  onNavigateBack: ?Function,
+  panHandlers: ?NavigationPanPanHandlers,
+  pointerEvents: string,
+  renderScene: NavigationSceneRenderer,
+  style: any,
+};
+
+const {PropTypes} = React;
+
+/**
+ * Component that renders the scene as card for the <NavigationCardStack />.
+ */
+class NavigationCard extends React.Component<any, Props, any> {
+  props: Props;
+
+  static propTypes = {
+    ...NavigationPropTypes.SceneRendererProps,
+    onComponentRef: PropTypes.func.isRequired,
+    onNavigateBack: PropTypes.func,
+    panHandlers: NavigationPropTypes.panHandlers,
+    pointerEvents: PropTypes.string.isRequired,
+    renderScene: PropTypes.func.isRequired,
+    style: PropTypes.any,
+  };
+
+  render(): React.Element<any> {
+    const {
+      panHandlers,
+      pointerEvents,
+      renderScene,
+      style,
+      ...props /* NavigationSceneRendererProps */
+    } = this.props;
+
+    const viewStyle = style === undefined ?
+      NavigationCardStackStyleInterpolator.forHorizontal(props) :
+      style;
+
+    const viewPanHandlers = panHandlers === undefined ?
+      NavigationCardStackPanResponder.forHorizontal({
+        ...props,
+        onNavigateBack: this.props.onNavigateBack,
+      }) :
+      panHandlers;
+
+    return (
+      <Animated.View
+        {...viewPanHandlers}
+        pointerEvents={pointerEvents}
+        ref={this.props.onComponentRef}
+        style={[styles.main, viewStyle]}>
+        {renderScene(props)}
+      </Animated.View>
+    );
+  }
+}
+
+const styles = StyleSheet.create({
+  main: {
+    backgroundColor: '#E9E9EF',
+    bottom: 0,
+    left: 0,
+    position: 'absolute',
+    right: 0,
+    shadowColor: 'black',
+    shadowOffset: {width: 0, height: 0},
+    shadowOpacity: 0.4,
+    shadowRadius: 10,
+    top: 0,
+  },
+});
+
+NavigationCard = NavigationPointerEventsContainer.create(NavigationCard);
+
+NavigationCard.CardStackPanResponder = NavigationCardStackPanResponder;
+NavigationCard.CardStackStyleInterpolator = NavigationCardStackStyleInterpolator;
+NavigationCard.PagerPanResponder = NavigationPagerPanResponder;
+NavigationCard.PagerStyleInterpolator = NavigationPagerStyleInterpolator;
+
+module.exports = NavigationCard;