diff --git a/packages/react-navigation/README.md b/packages/react-navigation/README.md index ff015b37..d6392aa8 100644 --- a/packages/react-navigation/README.md +++ b/packages/react-navigation/README.md @@ -3,7 +3,7 @@ *Learn once, navigate anywhere.* -Browse the docs on [reactnavigation.org](https://reactnavigation.org/). +Browse the docs on [reactnavigation.org](https://reactnavigation.org/) or try it out on [our expo demo](https://exp.host/@react-navigation/NavigationPlayground). ## Motivation diff --git a/packages/react-navigation/circle.yml b/packages/react-navigation/circle.yml index 76182379..618f58c4 100644 --- a/packages/react-navigation/circle.yml +++ b/packages/react-navigation/circle.yml @@ -21,7 +21,12 @@ jobs: - deploy: command: | if [ "${CIRCLE_BRANCH}" == "master" ]; then + # deploy website cd website && yarn && cd ../ yarn run build-docs ./scripts/deploy-website.sh + + # deploy expo playground demo + yarn global add exp && exp login -u "$EXPO_USERNAME" -p "$EXPO_PASSWORD" + cd examples/ExpoNavigationPlayground && npm install && exp publish fi diff --git a/packages/react-navigation/docs/api/navigators/DrawerNavigator.md b/packages/react-navigation/docs/api/navigators/DrawerNavigator.md index b419eeec..d25c7867 100644 --- a/packages/react-navigation/docs/api/navigators/DrawerNavigator.md +++ b/packages/react-navigation/docs/api/navigators/DrawerNavigator.md @@ -1,6 +1,6 @@ # DrawerNavigator -Used to easily set up a screen with a drawer navigation. +Used to easily set up a screen with a drawer navigation. For a live example please see [our expo demo](https://exp.host/@react-navigation/NavigationPlayground). ```js class MyHomeScreen extends React.Component { diff --git a/packages/react-navigation/docs/api/navigators/StackNavigator.md b/packages/react-navigation/docs/api/navigators/StackNavigator.md index f09ac168..1f8852ec 100644 --- a/packages/react-navigation/docs/api/navigators/StackNavigator.md +++ b/packages/react-navigation/docs/api/navigators/StackNavigator.md @@ -164,3 +164,5 @@ The navigator component created by `StackNavigator(...)` takes the following pro ### Examples See the examples [SimpleStack.js](https://github.com/react-community/react-navigation/tree/master/examples/NavigationPlayground/js/SimpleStack.js) and [ModalStack.js](https://github.com/react-community/react-navigation/tree/master/examples/NavigationPlayground/js/ModalStack.js) which you can run locally as part of the [NavigationPlayground](https://github.com/react-community/react-navigation/tree/master/examples/NavigationPlayground) app. + +You can view these examples directly on your phone by visiting [our expo demo](https://exp.host/@react-navigation/NavigationPlayground). diff --git a/packages/react-navigation/docs/api/navigators/TabNavigator.md b/packages/react-navigation/docs/api/navigators/TabNavigator.md index bdde081d..d48c960e 100644 --- a/packages/react-navigation/docs/api/navigators/TabNavigator.md +++ b/packages/react-navigation/docs/api/navigators/TabNavigator.md @@ -1,6 +1,6 @@ # TabNavigator -Used to easily set up a screen with several tabs with a TabRouter. +Used to easily set up a screen with several tabs with a TabRouter. For a live example please see [our expo demo](https://exp.host/@react-navigation/NavigationPlayground). ```js class MyHomeScreen extends React.Component { diff --git a/packages/react-navigation/examples/ExpoNavigationPlayground/.babelrc b/packages/react-navigation/examples/ExpoNavigationPlayground/.babelrc new file mode 100644 index 00000000..2bcd546d --- /dev/null +++ b/packages/react-navigation/examples/ExpoNavigationPlayground/.babelrc @@ -0,0 +1,8 @@ +{ + "presets": ["babel-preset-expo"], + "env": { + "development": { + "plugins": ["transform-react-jsx-source"] + } + } +} diff --git a/packages/react-navigation/examples/ExpoNavigationPlayground/.gitignore b/packages/react-navigation/examples/ExpoNavigationPlayground/.gitignore new file mode 100644 index 00000000..9f9e17e0 --- /dev/null +++ b/packages/react-navigation/examples/ExpoNavigationPlayground/.gitignore @@ -0,0 +1,3 @@ +node_modules/**/* +.expo/* +npm-debug.* diff --git a/packages/react-navigation/examples/ExpoNavigationPlayground/.watchmanconfig b/packages/react-navigation/examples/ExpoNavigationPlayground/.watchmanconfig new file mode 100644 index 00000000..0967ef42 --- /dev/null +++ b/packages/react-navigation/examples/ExpoNavigationPlayground/.watchmanconfig @@ -0,0 +1 @@ +{} diff --git a/packages/react-navigation/examples/ExpoNavigationPlayground/assets/icons/react-navigation.png b/packages/react-navigation/examples/ExpoNavigationPlayground/assets/icons/react-navigation.png new file mode 100644 index 00000000..9f56a231 Binary files /dev/null and b/packages/react-navigation/examples/ExpoNavigationPlayground/assets/icons/react-navigation.png differ diff --git a/packages/react-navigation/examples/ExpoNavigationPlayground/exp.json b/packages/react-navigation/examples/ExpoNavigationPlayground/exp.json new file mode 100644 index 00000000..d6c76fd6 --- /dev/null +++ b/packages/react-navigation/examples/ExpoNavigationPlayground/exp.json @@ -0,0 +1,24 @@ +{ + "name": "NavigationPlayground", + "description": "Try out react-navigation now with this awesome playground", + "slug": "NavigationPlayground", + "privacy": "public", + "sdkVersion": "16.0.0", + "version": "1.0.0", + "orientation": "portrait", + "primaryColor": "#cccccc", + "icon": "./assets/icons/react-navigation.png", + "loading": { + "icon": "./assets/icons/react-navigation.png", + "hideExponentText": false + }, + "packagerOpts": { + "assetExts": [ + "ttf", + "mp4" + ] + }, + "ios": { + "supportsTablet": true + } +} diff --git a/packages/react-navigation/examples/ExpoNavigationPlayground/main.js b/packages/react-navigation/examples/ExpoNavigationPlayground/main.js new file mode 100644 index 00000000..4739b277 --- /dev/null +++ b/packages/react-navigation/examples/ExpoNavigationPlayground/main.js @@ -0,0 +1,4 @@ +import Expo from 'expo'; +import App from 'NavigationPlayground/js/App'; + +Expo.registerRootComponent(App); diff --git a/packages/react-navigation/examples/ExpoNavigationPlayground/package.json b/packages/react-navigation/examples/ExpoNavigationPlayground/package.json new file mode 100644 index 00000000..e1813dbb --- /dev/null +++ b/packages/react-navigation/examples/ExpoNavigationPlayground/package.json @@ -0,0 +1,14 @@ +{ + "name": "ExpoNavigationPlayground", + "version": "0.0.0", + "description": "Hello Expo!", + "author": null, + "private": true, + "main": "main.js", + "dependencies": { + "expo": "16.0.0", + "react": "16.0.0-alpha.6", + "react-native": "https://github.com/expo/react-native/archive/sdk-16.0.0.tar.gz", + "NavigationPlayground": "file:../NavigationPlayground" + } +} diff --git a/packages/react-navigation/examples/NavigationPlayground/README.md b/packages/react-navigation/examples/NavigationPlayground/README.md index 0627570c..584fc08c 100644 --- a/packages/react-navigation/examples/NavigationPlayground/README.md +++ b/packages/react-navigation/examples/NavigationPlayground/README.md @@ -5,3 +5,5 @@ A playground for experimenting with react-navigation in a pure-JS React Native a ## Usage Please see the [Contributors Guide](https://github.com/react-community/react-navigation/blob/master/docs/guides/Contributors.md#development) for instructions on running these example apps. + +You can view this example application directly on your phone by visiting [our expo demo](https://exp.host/@react-navigation/NavigationPlayground). diff --git a/packages/react-navigation/examples/NavigationPlayground/package.json b/packages/react-navigation/examples/NavigationPlayground/package.json index c9d56cea..a1e7f0c6 100644 --- a/packages/react-navigation/examples/NavigationPlayground/package.json +++ b/packages/react-navigation/examples/NavigationPlayground/package.json @@ -8,12 +8,12 @@ "dependencies": { "react": "16.0.0-alpha.6", "react-native": "^0.44.0", - "react-native-vector-icons": "^4.1.1" + "react-native-vector-icons": "^4.1.1", + "react-navigation": "file:../.." }, "devDependencies": { "babel-jest": "^20.0.1", "jest": "^20.0.1", - "react-navigation": "file:../..", "react-test-renderer": "^15.5.4" }, "jest": { diff --git a/packages/react-navigation/website/src/AppFrame.js b/packages/react-navigation/website/src/AppFrame.js index e976ac78..f3491ef0 100644 --- a/packages/react-navigation/website/src/AppFrame.js +++ b/packages/react-navigation/website/src/AppFrame.js @@ -21,6 +21,13 @@ const NavigationLinks = ({ navigation, className, reverse }) => { ); }), + + Demo + , + GitHub ,