[change] separate the React and React Native APIs

Fix #136

docs/components/ActivityIndicator.md

@@ -23,7 +23,8 @@ Size of the indicator. Small has a height of `20`, large has a height of `36`.
 ## Examples
 
 ```js
-import React, { ActivityIndicator, Component, StyleSheet, View } from 'react-native'
+import React, { Component } from 'react'
+import { ActivityIndicator, StyleSheet, View } from 'react-native'
 
 class ToggleAnimatingActivityIndicator extends Component {
   constructor(props) {

docs/components/Image.md

@@ -78,7 +78,8 @@ Example usage:
 
 ```js
 import placeholderAvatar from './placeholderAvatar.png'
-import React, { Component, Image, PropTypes, StyleSheet } from 'react-native'
+import React, { Component } from 'react'
+import { Image, PropTypes, StyleSheet } from 'react-native'
 
 export default class ImageExample extends Component {
   constructor(props, context) {

docs/components/ListView.md

@@ -15,7 +15,8 @@ Content to display over the image.
 ## Examples
 
 ```js
-import React, { Component, ListView, PropTypes } from 'react-native'
+import React, { Component, PropTypes } from 'react'
+import { ListView } from 'react-native'
 
 export default class ListViewExample extends Component {
   static propTypes = {}

docs/components/Portal.md

@@ -33,7 +33,8 @@ React component to render.  This same tag can later be used in `closeModal`.
 ## Examples
 
 ```js
-import React, { Portal, Text, Touchable } from 'react-native'
+import React, { Component } from 'react'
+import { Portal, Text, Touchable } from 'react-native'
 
 export default class PortalExample extends Component {
   componentWillMount() {

docs/components/ScrollView.md

@@ -83,7 +83,8 @@ Scrolls to a given `x`, `y` offset (animation is not currently supported).
 ## Examples
 
 ```js
-import React, { Component, ScrollView, StyleSheet } from 'react-native'
+import React, { Component } from 'react'
+import { ScrollView, StyleSheet } from 'react-native'
 import Item from './Item'
 
 export default class ScrollViewExample extends Component {

docs/components/Text.md

@@ -75,7 +75,8 @@ Used to locate this view in end-to-end tests.
 ## Examples
 
 ```js
-import React, { Component, PropTypes, StyleSheet, Text } from 'react-native'
+import React, { Component, PropTypes } from 'react'
+import { StyleSheet, Text } from 'react-native'
 
 export default class PrettyText extends Component {
   static propTypes = {

docs/components/TextInput.md

@@ -164,7 +164,8 @@ Focus the underlying DOM input.
 ## Examples
 
 ```js
-import React, { Component, StyleSheet, TextInput } from 'react-native'
+import React, { Component } from 'react'
+import { StyleSheet, TextInput } from 'react-native'
 
 export default class TextInputExample extends Component {
   constructor(props, context) {

docs/components/View.md

@@ -184,7 +184,8 @@ Used to locate this view in end-to-end tests.
 ## Examples
 
 ```js
-import React, { Component, PropTypes, StyleSheet, View } from 'react-native'
+import React, { Component, PropTypes } from 'react'
+import { StyleSheet, View } from 'react-native'
 
 export default class ViewExample extends Component {
   render() {

docs/guides/react-native.md

@@ -40,11 +40,7 @@ module.exports = {
 Minor platform differences can use the `Platform` module.
 
 ```js
-import { AppRegistry, Platform, StyleSheet } from 'react-native'
-
-const styles = StyleSheet.create({
-  height: (Platform.OS === 'web') ? 200 : 100
-})
+import { AppRegistry, Platform } from 'react-native'
 
 AppRegistry.registerComponent('MyApp', () => MyApp)
 

docs/guides/rendering.md

@@ -21,14 +21,15 @@ module.exports = {
 Rendering without using the `AppRegistry`:
 
 ```js
-import React from 'react-native'
+import ReactDOM from 'react-dom'
+import ReactDOMServer from 'react-dom/server'
 
 // DOM render
-React.render(<div />, document.getElementById('react-app'))
+ReactDOM.render(<div />, document.getElementById('react-app'))
 
 // Server render
-React.renderToString(<div />)
-React.renderToStaticMarkup(<div />)
+ReactDOMServer.renderToString(<div />)
+ReactDOMServer.renderToStaticMarkup(<div />)
 ```
 
 Rendering using the `AppRegistry`:
@@ -36,7 +37,7 @@ Rendering using the `AppRegistry`:
 ```js
 // App.js
 
-import React, { AppRegistry } from 'react-native'
+import React from 'react'
 
 // component that renders the app
 const AppContainer = (props) => { /* ... */ }
@@ -46,8 +47,8 @@ export default AppContainer
 ```js
 // client.js
 
-import React, { AppRegistry } from 'react-native'
 import App from './App'
+import { AppRegistry } from 'react-native'
 
 // registers the app
 AppRegistry.registerComponent('App', () => App)
@@ -62,7 +63,7 @@ rendering.
 ```js
 // AppShell.js
 
-import React from 'react-native'
+import React from 'react'
 
 const AppShell = (html, styleElement) => (
   <html>
@@ -82,9 +83,9 @@ export default AppShell
 ```js
 // server.js
 
-import React, { AppRegistry } from 'react-native'
 import App from './App'
 import AppShell from './AppShell'
+import { AppRegistry } from 'react-native'
 
 // registers the app
 AppRegistry.registerComponent('App', () => App)