update website

css/react-native.css

@@ -964,6 +964,11 @@ div[data-twttr-id] iframe {
   font-size: 13px;
 }
 
+.edit-github {
+  font-size: 15px;
+  font-weight: normal;
+  float: right;
+}
 
 #content {
   display: none;

docs/appregistry.html

@@ -4,7 +4,7 @@ root components should register themselves with
 for the app and then actually run the app when it's ready by invoking
 <code>AppRegistry.runApplication</code>.</p><p><code>AppRegistry</code> should be <code>require</code>d early in the <code>require</code> sequence to make
 sure the JS execution environment is setup before other modules are
-<code>require</code>d.</p></div><span><h3><a class="anchor" name="methods"></a>Methods <a class="hash-link" href="#methods">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="registerconfig"></a><span class="propType">static </span>registerConfig<span class="propType">(config: Array&lt;AppConfig&gt;)</span> <a class="hash-link" href="#registerconfig">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="registercomponent"></a><span class="propType">static </span>registerComponent<span class="propType">(appKey: string, getComponentFunc: Function)</span> <a class="hash-link" href="#registercomponent">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="registerrunnable"></a><span class="propType">static </span>registerRunnable<span class="propType">(appKey: string, func: Function)</span> <a class="hash-link" href="#registerrunnable">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="runapplication"></a><span class="propType">static </span>runApplication<span class="propType">(appKey: string, appParameters: any)</span> <a class="hash-link" href="#runapplication">#</a></h4></div></div></span></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="appstateios.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+<code>require</code>d.</p></div><span><h3><a class="anchor" name="methods"></a>Methods <a class="hash-link" href="#methods">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="registerconfig"></a><span class="propType">static </span>registerConfig<span class="propType">(config: Array&lt;AppConfig&gt;)</span> <a class="hash-link" href="#registerconfig">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="registercomponent"></a><span class="propType">static </span>registerComponent<span class="propType">(appKey: string, getComponentFunc: Function)</span> <a class="hash-link" href="#registercomponent">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="registerrunnable"></a><span class="propType">static </span>registerRunnable<span class="propType">(appKey: string, func: Function)</span> <a class="hash-link" href="#registerrunnable">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="runapplication"></a><span class="propType">static </span>runApplication<span class="propType">(appKey: string, appParameters: any)</span> <a class="hash-link" href="#runapplication">#</a></h4></div></div></span></div><div class="docs-prevnext"><a class="docs-next" href="appstateios.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/appstateios.html

@@ -26,7 +26,7 @@ render<span class="token punctuation">:</span> <span class="token keyword">funct
 <span class="token punctuation">}</span><span class="token punctuation">,</span></div><p>This example will only ever appear to say &quot;Current state is: active&quot; because
 the app is only visible to the user when in the <code>active</code> state, and the null
 state will happen only momentarily.</p></div><span><h3><a class="anchor" name="methods"></a>Methods <a class="hash-link" href="#methods">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="addeventlistener"></a><span class="propType">static </span>addEventListener<span class="propType">(type: string, handler: Function)</span> <a class="hash-link" href="#addeventlistener">#</a></h4><div><p>Add a handler to AppState changes by listening to the <code>change</code> event type
-and providing the handler</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="removeeventlistener"></a><span class="propType">static </span>removeEventListener<span class="propType">(type: string, handler: Function)</span> <a class="hash-link" href="#removeeventlistener">#</a></h4><div><p>Remove a handler by passing the <code>change</code> event type and the handler</p></div></div></div></span></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="asyncstorage.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+and providing the handler</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="removeeventlistener"></a><span class="propType">static </span>removeEventListener<span class="propType">(type: string, handler: Function)</span> <a class="hash-link" href="#removeeventlistener">#</a></h4><div><p>Remove a handler by passing the <code>change</code> event type and the handler</p></div></div></div></span></div><div class="docs-prevnext"><a class="docs-next" href="asyncstorage.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/asyncstorage.html

@@ -9,7 +9,7 @@ don't want to call this - use removeItem or multiRemove to clear only your
 own keys instead.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="getallkeys"></a><span class="propType">static </span>getAllKeys<span class="propType">(callback: (error: ?Error) =&gt; void)</span> <a class="hash-link" href="#getallkeys">#</a></h4><div><p>Gets <em>all</em> keys known to the system, for all callers, libraries, etc.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="multiget"></a><span class="propType">static </span>multiGet<span class="propType">(keys: Array&lt;string&gt;, callback: (errors: ?Array&lt;Error&gt;, result: ?Array&lt;Array&lt;string&gt;&gt;) =&gt; void)</span> <a class="hash-link" href="#multiget">#</a></h4><div><p>multiGet invokes callback with an array of key-value pair arrays that
 matches the input format of multiSet.</p><p>  multiGet([&#x27;k1&#x27;, &#x27;k2&#x27;], cb) -&gt; cb([[&#x27;k1&#x27;, &#x27;val1&#x27;], [&#x27;k2&#x27;, &#x27;val2&#x27;]])</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="multiset"></a><span class="propType">static </span>multiSet<span class="propType">(keyValuePairs: Array&lt;Array&lt;string&gt;&gt;, callback: ?(errors: ?Array&lt;Error&gt;) =&gt; void)</span> <a class="hash-link" href="#multiset">#</a></h4><div><p>multiSet and multiMerge take arrays of key-value array pairs that match
 the output of multiGet, e.g.</p><p>  multiSet([[&#x27;k1&#x27;, &#x27;val1&#x27;], [&#x27;k2&#x27;, &#x27;val2&#x27;]], cb);</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="multiremove"></a><span class="propType">static </span>multiRemove<span class="propType">(keys: Array&lt;string&gt;, callback: ?(errors: ?Array&lt;Error&gt;) =&gt; void)</span> <a class="hash-link" href="#multiremove">#</a></h4><div><p>Delete all the keys in the <code>keys</code> array.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="multimerge"></a><span class="propType">static </span>multiMerge<span class="propType">(keyValuePairs: Array&lt;Array&lt;string&gt;&gt;, callback: ?(errors: ?Array&lt;Error&gt;) =&gt; void)</span> <a class="hash-link" href="#multimerge">#</a></h4><div><p>Merges existing values with input values, assuming they are stringified
-json.</p><p>Not supported by all native implementations.</p></div></div></div></span></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="cameraroll.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+json.</p><p>Not supported by all native implementations.</p></div></div></div></span></div><div class="docs-prevnext"><a class="docs-next" href="cameraroll.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/cameraroll.html

@@ -7,7 +7,7 @@ of patent rights can be found in the PATENTS file in the same directory.</p><p>@
  roll of the device matching shape defined by <code>getPhotosReturnChecker</code>.</p><p> @param {object} params - See <code>getPhotosParamChecker</code>.
  @param {function} callback - Invoked with arg of shape defined by
    <code>getPhotosReturnChecker</code> on success.
- @param {function} errorCallback - Invoked with error message on error.</p></div></div></div></span></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="interactionmanager.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+ @param {function} errorCallback - Invoked with error message on error.</p></div></div></div></span></div><div class="docs-prevnext"><a class="docs-next" href="interactionmanager.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/datepickerios.html

@@ -2,11 +2,11 @@
 a controlled component, so you must hook in to the <code>onDateChange</code> callback
 and update the <code>date</code> prop in order for the component to update, otherwise
 the user&#x27;s change will be reverted immediately to reflect <code>props.date</code> as the
-source of truth.</p></div><h3><a class="anchor" name="props"></a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="date"></a>date <span class="propType">Date</span> <a class="hash-link" href="#date">#</a></h4><div><p>The currently selected date.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="maximumdate"></a>maximumDate <span class="propType">Date</span> <a class="hash-link" href="#maximumdate">#</a></h4><div><p>Maximum date.</p><p>Restricts the range of possible date/time values.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="minimumdate"></a>minimumDate <span class="propType">Date</span> <a class="hash-link" href="#minimumdate">#</a></h4><div><p>Minimum date.</p><p>Restricts the range of possible date/time values.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="minuteinterval"></a>minuteInterval <span class="propType">enum(1, 2, 3, 4, 5, 6, 10, 12, 15, 20, 30)</span> <a class="hash-link" href="#minuteinterval">#</a></h4><div><p>The interval at which minutes can be selected.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="mode"></a>mode <span class="propType">enum(&#x27;date&#x27;, &#x27;time&#x27;, &#x27;datetime&#x27;)</span> <a class="hash-link" href="#mode">#</a></h4><div><p>The date picker mode.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="ondatechange"></a>onDateChange <span class="propType">function</span> <a class="hash-link" href="#ondatechange">#</a></h4><div><p>Date change handler.</p><p>This is called when the user changes the date or time in the UI.
+source of truth.</p></div><h3><a class="anchor" name="props"></a><a class="edit-github" href="https://github.com/facebook/react-native/blob/master/Libraries/Components/DatePicker/DatePickerIOS.ios.js">Edit on GitHub</a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="date"></a>date <span class="propType">Date</span> <a class="hash-link" href="#date">#</a></h4><div><p>The currently selected date.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="maximumdate"></a>maximumDate <span class="propType">Date</span> <a class="hash-link" href="#maximumdate">#</a></h4><div><p>Maximum date.</p><p>Restricts the range of possible date/time values.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="minimumdate"></a>minimumDate <span class="propType">Date</span> <a class="hash-link" href="#minimumdate">#</a></h4><div><p>Minimum date.</p><p>Restricts the range of possible date/time values.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="minuteinterval"></a>minuteInterval <span class="propType">enum(1, 2, 3, 4, 5, 6, 10, 12, 15, 20, 30)</span> <a class="hash-link" href="#minuteinterval">#</a></h4><div><p>The interval at which minutes can be selected.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="mode"></a>mode <span class="propType">enum(&#x27;date&#x27;, &#x27;time&#x27;, &#x27;datetime&#x27;)</span> <a class="hash-link" href="#mode">#</a></h4><div><p>The date picker mode.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="ondatechange"></a>onDateChange <span class="propType">function</span> <a class="hash-link" href="#ondatechange">#</a></h4><div><p>Date change handler.</p><p>This is called when the user changes the date or time in the UI.
 The first and only argument is a Date object representing the new
 date and time.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="timezoneoffsetinminutes"></a>timeZoneOffsetInMinutes <span class="propType">number</span> <a class="hash-link" href="#timezoneoffsetinminutes">#</a></h4><div><p>Timezone offset in minutes.</p><p>By default, the date picker will use the device&#x27;s timezone. With this
 parameter, it is possible to force a certain timezone offset. For
-instance, to show times in Pacific Standard Time, pass -7 * 60.</p></div></div></div></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="image.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+instance, to show times in Pacific Standard Time, pass -7 * 60.</p></div></div></div></div><div class="docs-prevnext"><a class="docs-next" href="image.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/geolocation.html

@@ -3,7 +3,7 @@ You need to add NSLocationWhenInUseUsageDescription key
 in Info.plist to enable geolocation, otherwise it's going
 to <em>fail silently</em>!
 !/           !/</p><p>Geolocation follows the MDN specification:
-<a href="https://developer.mozilla.org/en-US/docs/Web/API/Geolocation">https://developer.mozilla.org/en-US/docs/Web/API/Geolocation</a></p></div><span><h3><a class="anchor" name="methods"></a>Methods <a class="hash-link" href="#methods">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="getcurrentposition"></a><span class="propType">static </span>getCurrentPosition<span class="propType">(geo_success: Function, geo_error?: Function, geo_options?: Object)</span> <a class="hash-link" href="#getcurrentposition">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="watchposition"></a><span class="propType">static </span>watchPosition<span class="propType">(success: Function, error?: Function, options?: Object)</span> <a class="hash-link" href="#watchposition">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="clearwatch"></a><span class="propType">static </span>clearWatch<span class="propType">(watchID: number)</span> <a class="hash-link" href="#clearwatch">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="stopobserving"></a><span class="propType">static </span>stopObserving<span class="propType">()</span> <a class="hash-link" href="#stopobserving">#</a></h4></div></div></span></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="network.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+<a href="https://developer.mozilla.org/en-US/docs/Web/API/Geolocation">https://developer.mozilla.org/en-US/docs/Web/API/Geolocation</a></p></div><span><h3><a class="anchor" name="methods"></a>Methods <a class="hash-link" href="#methods">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="getcurrentposition"></a><span class="propType">static </span>getCurrentPosition<span class="propType">(geo_success: Function, geo_error?: Function, geo_options?: Object)</span> <a class="hash-link" href="#getcurrentposition">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="watchposition"></a><span class="propType">static </span>watchPosition<span class="propType">(success: Function, error?: Function, options?: Object)</span> <a class="hash-link" href="#watchposition">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="clearwatch"></a><span class="propType">static </span>clearWatch<span class="propType">(watchID: number)</span> <a class="hash-link" href="#clearwatch">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="stopobserving"></a><span class="propType">static </span>stopObserving<span class="propType">()</span> <a class="hash-link" href="#stopobserving">#</a></h4></div></div></span></div><div class="docs-prevnext"><a class="docs-next" href="network.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/image.html

@@ -13,12 +13,12 @@ images from local disk, such as the camera roll.</p><p>Example usage:</p><div cl
       <span class="token operator">/</span><span class="token operator">&gt;</span>
     &lt;<span class="token operator">/</span>View<span class="token operator">&gt;</span>
   <span class="token punctuation">)</span><span class="token punctuation">;</span>
-<span class="token punctuation">}</span><span class="token punctuation">,</span></div></div><h3><a class="anchor" name="props"></a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="accessibilitylabel"></a>accessibilityLabel <span class="propType">string</span> <a class="hash-link" href="#accessibilitylabel">#</a></h4><div><p>accessibilityLabel - Custom string to display for accessibility.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="accessible"></a>accessible <span class="propType">bool</span> <a class="hash-link" href="#accessible">#</a></h4><div><p>accessible - Whether this element should be revealed as an accessible
+<span class="token punctuation">}</span><span class="token punctuation">,</span></div></div><h3><a class="anchor" name="props"></a><a class="edit-github" href="https://github.com/facebook/react-native/blob/master/Libraries/Image/Image.ios.js">Edit on GitHub</a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="accessibilitylabel"></a>accessibilityLabel <span class="propType">string</span> <a class="hash-link" href="#accessibilitylabel">#</a></h4><div><p>accessibilityLabel - Custom string to display for accessibility.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="accessible"></a>accessible <span class="propType">bool</span> <a class="hash-link" href="#accessible">#</a></h4><div><p>accessible - Whether this element should be revealed as an accessible
 element.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="capinsets"></a>capInsets <span class="propType">{top: number, left: number, bottom: number, right: number}</span> <a class="hash-link" href="#capinsets">#</a></h4><div><p>capInsets - When the image is resized, the corners of the size specified
 by capInsets will stay a fixed size, but the center content and borders
 of the image will be stretched.  This is useful for creating resizable
 rounded buttons, shadows, and other resizable assets.  More info:</p><p>  <a href="https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIImage_Class/index.html#//apple_ref/occ/instm/UIImage/resizableImageWithCapInsets">https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIImage_Class/index.html#//apple_ref/occ/instm/UIImage/resizableImageWithCapInsets</a>:</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="source"></a>source <span class="propType">{uri: string}</span> <a class="hash-link" href="#source">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="style"></a>style <span class="propType">style</span> <a class="hash-link" href="#style">#</a></h4><div class="compactProps"><div class="prop"><h6 class="propTitle"><a href="flexbox.html#proptypes">Flexbox...</a></h6></div><div class="prop"><h6 class="propTitle">backgroundColor <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">borderColor <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">borderRadius <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">borderWidth <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">opacity <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">resizeMode <span class="propType">Object.keys(ImageResizeMode)</span></h6></div><div class="prop"><h6 class="propTitle">tintColor <span class="propType">string</span></h6></div></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="testid"></a>testID <span class="propType">string</span> <a class="hash-link" href="#testid">#</a></h4><div><p>testID - A unique identifier for this element to be used in UI Automation
-testing scripts.</p></div></div></div></div><div><p>Displaying images is a fascinating subject, React Native uses some cool tricks to make it a better experience.</p><h2><a class="anchor" name="no-automatic-sizing"></a>No Automatic Sizing <a class="hash-link" href="#no-automatic-sizing">#</a></h2><p>If you don&#x27;t give a size to an image, the browser is going to render a 0x0 element, download the image, and then render the image based with the correct size. The big issue with this behavior is that your UI is going to jump all around as images load, this makes for a very bad user experience.</p><p>In React Native, this behavior is intentionally not implemented. It is more work for the developer to know the dimensions (or just aspect ratio) of the image in advance, but we believe that it leads to a better user experience.</p><h2><a class="anchor" name="background-image-via-nesting"></a>Background Image via Nesting <a class="hash-link" href="#background-image-via-nesting">#</a></h2><p>A common feature request from developers familiar with the web is <code>background-image</code>. To handle this use case, simply create a normal <code>&lt;Image&gt;</code> component and add whatever children to it you would like to layer on top of it.</p><div class="prism language-javascript"><span class="token keyword">return</span> <span class="token punctuation">(</span>
+testing scripts.</p></div></div></div></div><div><h3><a class="anchor" name="description"></a><a class="edit-github" href="https://github.com/facebook/react-native/blob/master/docs/Image.md">Edit on GitHub</a>Description <a class="hash-link" href="#description">#</a></h3><div><p>Displaying images is a fascinating subject, React Native uses some cool tricks to make it a better experience.</p><h2><a class="anchor" name="no-automatic-sizing"></a>No Automatic Sizing <a class="hash-link" href="#no-automatic-sizing">#</a></h2><p>If you don&#x27;t give a size to an image, the browser is going to render a 0x0 element, download the image, and then render the image based with the correct size. The big issue with this behavior is that your UI is going to jump all around as images load, this makes for a very bad user experience.</p><p>In React Native, this behavior is intentionally not implemented. It is more work for the developer to know the dimensions (or just aspect ratio) of the image in advance, but we believe that it leads to a better user experience.</p><h2><a class="anchor" name="background-image-via-nesting"></a>Background Image via Nesting <a class="hash-link" href="#background-image-via-nesting">#</a></h2><p>A common feature request from developers familiar with the web is <code>background-image</code>. To handle this use case, simply create a normal <code>&lt;Image&gt;</code> component and add whatever children to it you would like to layer on top of it.</p><div class="prism language-javascript"><span class="token keyword">return</span> <span class="token punctuation">(</span>
   &lt;Image source<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token punctuation">}</span><span class="token operator">&gt;</span>
     &lt;Text<span class="token operator">&gt;</span>Inside&lt;<span class="token operator">/</span>Text<span class="token operator">&gt;</span>
   &lt;<span class="token operator">/</span>Image<span class="token operator">&gt;</span>
@@ -31,7 +31,7 @@ testing scripts.</p></div></div></div></div><div><p>Displaying images is a fasci
 <span class="token comment" spellcheck="true">
 // GOOD
 </span><span class="token keyword">var</span> icon <span class="token operator">=</span> <span class="token keyword">this</span><span class="token punctuation">.</span>props<span class="token punctuation">.</span>active <span class="token operator">?</span> <span class="token function">require<span class="token punctuation">(</span></span><span class="token string">&#x27;image!my-icon-active&#x27;</span><span class="token punctuation">)</span> <span class="token punctuation">:</span> <span class="token function">require<span class="token punctuation">(</span></span><span class="token string">&#x27;image!my-icon-inactive&#x27;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
-&lt;Image source<span class="token operator">=</span><span class="token punctuation">{</span>icon<span class="token punctuation">}</span> <span class="token operator">/</span><span class="token operator">&gt;</span></div><p>When your entire codebase respects this convention, you&#x27;re able to do interesting things like automatically packaging the assets that are being used in your app. Note that in the current form, nothing is enforced, but it will be in the future.</p><h2><a class="anchor" name="best-camera-roll-image"></a>Best Camera Roll Image <a class="hash-link" href="#best-camera-roll-image">#</a></h2><p>iOS saves multiple sizes for the same image in your Camera Roll, it is very important to pick the one that&#x27;s as close as possible for performance reasons. You wouldn&#x27;t want to use the full quality 3264x2448 image as source when displaying a 200x200 thumbnail. If there&#x27;s an exact match, React Native will pick it, otherwise it&#x27;s going to use the first one that&#x27;s at least 50% bigger in order to avoid blur when resizing from a close size. All of this is done by default so you don&#x27;t have to worry about writing the tedious (and error prone) code to do it yourself.</p><h2><a class="anchor" name="source-being-an-object"></a>Source being an object <a class="hash-link" href="#source-being-an-object">#</a></h2><p>In React Native, one interesting decision is that the <code>src</code> attribute is named <code>source</code> and doesn&#x27;t take a string but an object with an <code>uri</code> attribute.</p><div class="prism language-javascript">&lt;Image source<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>uri<span class="token punctuation">:</span> <span class="token string">&#x27;something.jpg&#x27;</span><span class="token punctuation">}</span><span class="token punctuation">}</span> <span class="token operator">/</span><span class="token operator">&gt;</span></div><p>On the infrastructure side, the reason is that it allows to attach metadata to this object. For example if you are using <code>require(&#x27;image!icon&#x27;)</code>, then we add an <code>isStatic</code> attribute to flag it as a local file (don&#x27;t rely on this fact, it&#x27;s likely to change in the future!). This is also future proofing, for example we may want to support sprites at some point, instead of outputting <code>{uri: ...}</code>, we can output <code>{uri: ..., crop: {left: 10, top: 50, width: 20, height: 40}}</code> and transparently support spriting on all the existing call sites.</p><p>On the user side, this lets you annotate the object with useful attributes such as the dimension of the image in order to compute the size it&#x27;s going to be displayed in. Feel free to use it as your data structure to store more information about your image.</p></div><div class="docs-prevnext"><a class="docs-next" href="listview.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+&lt;Image source<span class="token operator">=</span><span class="token punctuation">{</span>icon<span class="token punctuation">}</span> <span class="token operator">/</span><span class="token operator">&gt;</span></div><p>When your entire codebase respects this convention, you&#x27;re able to do interesting things like automatically packaging the assets that are being used in your app. Note that in the current form, nothing is enforced, but it will be in the future.</p><h2><a class="anchor" name="best-camera-roll-image"></a>Best Camera Roll Image <a class="hash-link" href="#best-camera-roll-image">#</a></h2><p>iOS saves multiple sizes for the same image in your Camera Roll, it is very important to pick the one that&#x27;s as close as possible for performance reasons. You wouldn&#x27;t want to use the full quality 3264x2448 image as source when displaying a 200x200 thumbnail. If there&#x27;s an exact match, React Native will pick it, otherwise it&#x27;s going to use the first one that&#x27;s at least 50% bigger in order to avoid blur when resizing from a close size. All of this is done by default so you don&#x27;t have to worry about writing the tedious (and error prone) code to do it yourself.</p><h2><a class="anchor" name="source-being-an-object"></a>Source being an object <a class="hash-link" href="#source-being-an-object">#</a></h2><p>In React Native, one interesting decision is that the <code>src</code> attribute is named <code>source</code> and doesn&#x27;t take a string but an object with an <code>uri</code> attribute.</p><div class="prism language-javascript">&lt;Image source<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>uri<span class="token punctuation">:</span> <span class="token string">&#x27;something.jpg&#x27;</span><span class="token punctuation">}</span><span class="token punctuation">}</span> <span class="token operator">/</span><span class="token operator">&gt;</span></div><p>On the infrastructure side, the reason is that it allows to attach metadata to this object. For example if you are using <code>require(&#x27;image!icon&#x27;)</code>, then we add an <code>isStatic</code> attribute to flag it as a local file (don&#x27;t rely on this fact, it&#x27;s likely to change in the future!). This is also future proofing, for example we may want to support sprites at some point, instead of outputting <code>{uri: ...}</code>, we can output <code>{uri: ..., crop: {left: 10, top: 50, width: 20, height: 40}}</code> and transparently support spriting on all the existing call sites.</p><p>On the user side, this lets you annotate the object with useful attributes such as the dimension of the image in order to compute the size it&#x27;s going to be displayed in. Feel free to use it as your data structure to store more information about your image.</p></div></div><div class="docs-prevnext"><a class="docs-next" href="listview.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/interactionmanager.html

@@ -10,7 +10,7 @@ completion:</p><div class="prism language-javascript"><span class="token keyword
 // run animation... (`runAfterInteractions` tasks are queued)
 </span><span class="token comment" spellcheck="true">// later, on animation completion:
 </span>InteractionManager<span class="token punctuation">.</span><span class="token function">clearInteractionHandle<span class="token punctuation">(</span></span>handle<span class="token punctuation">)</span><span class="token punctuation">;</span><span class="token comment" spellcheck="true">
-// queued tasks run if all handles were cleared</span></div></div><span><h3><a class="anchor" name="methods"></a>Methods <a class="hash-link" href="#methods">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="runafterinteractions"></a><span class="propType">static </span>runAfterInteractions<span class="propType">(callback: Function)</span> <a class="hash-link" href="#runafterinteractions">#</a></h4><div><p>Schedule a function to run after all interactions have completed.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="createinteractionhandle"></a><span class="propType">static </span>createInteractionHandle<span class="propType">()</span> <a class="hash-link" href="#createinteractionhandle">#</a></h4><div><p>Notify manager that an interaction has started.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="clearinteractionhandle"></a><span class="propType">static </span>clearInteractionHandle<span class="propType">(handle: number)</span> <a class="hash-link" href="#clearinteractionhandle">#</a></h4><div><p>Notify manager that an interaction has completed.</p></div></div></div></span></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="layoutanimation.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+// queued tasks run if all handles were cleared</span></div></div><span><h3><a class="anchor" name="methods"></a>Methods <a class="hash-link" href="#methods">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="runafterinteractions"></a><span class="propType">static </span>runAfterInteractions<span class="propType">(callback: Function)</span> <a class="hash-link" href="#runafterinteractions">#</a></h4><div><p>Schedule a function to run after all interactions have completed.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="createinteractionhandle"></a><span class="propType">static </span>createInteractionHandle<span class="propType">()</span> <a class="hash-link" href="#createinteractionhandle">#</a></h4><div><p>Notify manager that an interaction has started.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="clearinteractionhandle"></a><span class="propType">static </span>clearInteractionHandle<span class="propType">(handle: number)</span> <a class="hash-link" href="#clearinteractionhandle">#</a></h4><div><p>Notify manager that an interaction has completed.</p></div></div></div></span></div><div class="docs-prevnext"><a class="docs-next" href="layoutanimation.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/linkingios.html

@@ -23,7 +23,7 @@ execution you&#x27;ll need to add the following lines to you <code>*AppDelegate.
 <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></div></div><span><h3><a class="anchor" name="methods"></a>Methods <a class="hash-link" href="#methods">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="addeventlistener"></a><span class="propType">static </span>addEventListener<span class="propType">(type: string, handler: Function)</span> <a class="hash-link" href="#addeventlistener">#</a></h4><div><p>Add a handler to LinkingIOS changes by listening to the <code>url</code> event type
 and providing the handler</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="removeeventlistener"></a><span class="propType">static </span>removeEventListener<span class="propType">(type: string, handler: Function)</span> <a class="hash-link" href="#removeeventlistener">#</a></h4><div><p>Remove a handler by passing the <code>url</code> event type and the handler</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="openurl"></a><span class="propType">static </span>openURL<span class="propType">(url: string)</span> <a class="hash-link" href="#openurl">#</a></h4><div><p>Try to open the given <code>url</code> with any of the installed apps.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="canopenurl"></a><span class="propType">static </span>canOpenURL<span class="propType">(url: string, callback: Function)</span> <a class="hash-link" href="#canopenurl">#</a></h4><div><p>Determine wether or not the an installed app can handle a given <code>url</code>
 The callback function will be called with <code>bool supported</code> as the only argument</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="popinitialurl"></a><span class="propType">static </span>popInitialURL<span class="propType">()</span> <a class="hash-link" href="#popinitialurl">#</a></h4><div><p>If the app launch was triggered by an app link, it will pop the link url,
-otherwise it will return <code>null</code></p></div></div></div></span></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="netinfo.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+otherwise it will return <code>null</code></p></div></div></div></span></div><div class="docs-prevnext"><a class="docs-next" href="netinfo.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/listview.html

@@ -28,7 +28,7 @@ data source tells the ListView if it needs to re-render a row because the
 source data has changed - see ListViewDataSource for more details.</p></li><li><p>Rate-limited row rendering - By default, only one row is rendered per
 event-loop (customizable with the <code>pageSize</code> prop).  This breaks up the
 work into smaller chunks to reduce the chance of dropping frames while
-rendering rows.</p></li></ul></div><h3><a class="anchor" name="props"></a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="scrollview"></a><a href="scrollview.html#proptypes">ScrollView props...</a> <a class="hash-link" href="#scrollview">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="datasource"></a>dataSource <span class="propType">ListViewDataSource</span> <a class="hash-link" href="#datasource">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="initiallistsize"></a>initialListSize <span class="propType">number</span> <a class="hash-link" href="#initiallistsize">#</a></h4><div><p>How many rows to render on initial component mount.  Use this to make
+rendering rows.</p></li></ul></div><h3><a class="anchor" name="props"></a><a class="edit-github" href="https://github.com/facebook/react-native/blob/master/Libraries/CustomComponents/ListView/ListView.js">Edit on GitHub</a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="scrollview"></a><a href="scrollview.html#proptypes">ScrollView props...</a> <a class="hash-link" href="#scrollview">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="datasource"></a>dataSource <span class="propType">ListViewDataSource</span> <a class="hash-link" href="#datasource">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="initiallistsize"></a>initialListSize <span class="propType">number</span> <a class="hash-link" href="#initiallistsize">#</a></h4><div><p>How many rows to render on initial component mount.  Use this to make
 it so that the first screen worth of data apears at one time instead of
 over the course of multiple frames.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="onchangevisiblerows"></a>onChangeVisibleRows <span class="propType">function</span> <a class="hash-link" href="#onchangevisiblerows">#</a></h4><div><p>(visibleRows, changedRows) =&gt; void</p><p>Called when the set of visible rows changes.  <code>visibleRows</code> maps
 { sectionID: { rowID: true }} for all the visible rows, and
@@ -50,7 +50,7 @@ behavior means that it will scroll with the content at the top of the
 section until it reaches the top of the screen, at which point it will
 stick to the top until it is pushed off the screen by the next section
 header.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="scrollrenderaheaddistance"></a>scrollRenderAheadDistance <span class="propType">number</span> <a class="hash-link" href="#scrollrenderaheaddistance">#</a></h4><div><p>How early to start rendering rows before they come on screen, in
-pixels.</p></div></div></div></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="mapview.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+pixels.</p></div></div></div></div><div class="docs-prevnext"><a class="docs-next" href="mapview.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/navigator.html

@@ -33,7 +33,7 @@ function. The object has all of the navigation methods on it, as well as a
 few utilities:</p><ul><li><code>parentNavigator</code> - a refrence to the parent navigator object that was
  passed in through props.navigator</li><li><code>onWillFocus</code> - used to pass a navigation focus event up to the parent
  navigator</li><li><code>onDidFocus</code> - used to pass a navigation focus event up to the parent
- navigator</li></ul></div><h3><a class="anchor" name="props"></a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="configurescene"></a>configureScene <span class="propType">function</span> <a class="hash-link" href="#configurescene">#</a></h4><div><p>Optional function that allows configuration about scene animations and
+ navigator</li></ul></div><h3><a class="anchor" name="props"></a><a class="edit-github" href="https://github.com/facebook/react-native/blob/master/Libraries/CustomComponents/Navigator/Navigator.js">Edit on GitHub</a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="configurescene"></a>configureScene <span class="propType">function</span> <a class="hash-link" href="#configurescene">#</a></h4><div><p>Optional function that allows configuration about scene animations and
 gestures. Will be invoked with the route and should return a scene
 configuration object</p><div class="prism language-javascript"><span class="token punctuation">(</span>route<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">&gt;</span> Navigator<span class="token punctuation">.</span>SceneConfigs<span class="token punctuation">.</span>FloatFromRight</div></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="initialroute"></a>initialRoute <span class="propType">object</span> <a class="hash-link" href="#initialroute">#</a></h4><div><p>Provide a single &quot;route&quot; to start on. A route is an arbitrary object
 that the navigator will use to identify each scene before rendering.
@@ -48,7 +48,7 @@ invoked with the route, the navigator object, and a ref handler that
 will allow a ref to your scene to be provided by props.onItemRef</p><div class="prism language-javascript"><span class="token punctuation">(</span>route<span class="token punctuation">,</span> navigator<span class="token punctuation">,</span> onRef<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">&gt;</span>
   &lt;MySceneComponent title<span class="token operator">=</span><span class="token punctuation">{</span>route<span class="token punctuation">.</span>title<span class="token punctuation">}</span> ref<span class="token operator">=</span><span class="token punctuation">{</span>onRef<span class="token punctuation">}</span> <span class="token operator">/</span><span class="token operator">&gt;</span></div></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="scenestyle"></a>sceneStyle <span class="propType"><a href="view.html#style">View#style</a></span> <a class="hash-link" href="#scenestyle">#</a></h4><div><p>Styles to apply to the container of each scene</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="shouldjumponbackstackpop"></a>shouldJumpOnBackstackPop <span class="propType">bool</span> <a class="hash-link" href="#shouldjumponbackstackpop">#</a></h4><div><p>Should the backstack back button &quot;jump&quot; back instead of pop? Set to true
 if a jump forward might happen after the android back button is pressed,
-so the scenes will remain mounted</p></div></div></div></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="navigatorios.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+so the scenes will remain mounted</p></div></div></div></div><div class="docs-prevnext"><a class="docs-next" href="navigatorios.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/navigatorios.html

@@ -33,10 +33,10 @@ transitions back to it</li><li><code>resetTo(route)</code> - Replaces the top it
       initialRoute<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token punctuation">}</span>
     <span class="token operator">/</span><span class="token operator">&gt;</span>
   <span class="token punctuation">)</span><span class="token punctuation">,</span>
-<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></div></div><h3><a class="anchor" name="props"></a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="initialroute"></a>initialRoute <span class="propType">{component: function, title: string, passProps: object, backButtonTitle: string, rightButtonTitle: string, onRightButtonPress: function, wrapperStyle: [object Object]}</span> <a class="hash-link" href="#initialroute">#</a></h4><div><p>NavigatorIOS uses &quot;route&quot; objects to identify child views, their props,
+<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></div></div><h3><a class="anchor" name="props"></a><a class="edit-github" href="https://github.com/facebook/react-native/blob/master/Libraries/Components/Navigation/NavigatorIOS.ios.js">Edit on GitHub</a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="initialroute"></a>initialRoute <span class="propType">{component: function, title: string, passProps: object, backButtonTitle: string, rightButtonTitle: string, onRightButtonPress: function, wrapperStyle: [object Object]}</span> <a class="hash-link" href="#initialroute">#</a></h4><div><p>NavigatorIOS uses &quot;route&quot; objects to identify child views, their props,
 and navigation bar configuration. &quot;push&quot; and all the other navigation
 operations expect routes to be like this:</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="itemwrapperstyle"></a>itemWrapperStyle <span class="propType"><a href="view.html#style">View#style</a></span> <a class="hash-link" href="#itemwrapperstyle">#</a></h4><div><p>The default wrapper style for components in the navigator.
-A common use case is to set the backgroundColor for every page</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="tintcolor"></a>tintColor <span class="propType">string</span> <a class="hash-link" href="#tintcolor">#</a></h4><div><p>The color used for buttons in the navigation bar</p></div></div></div></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="pickerios.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+A common use case is to set the backgroundColor for every page</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="tintcolor"></a>tintColor <span class="propType">string</span> <a class="hash-link" href="#tintcolor">#</a></h4><div><p>The color used for buttons in the navigation bar</p></div></div></div></div><div class="docs-prevnext"><a class="docs-next" href="pickerios.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/netinfo.html

@@ -25,7 +25,7 @@ internet connectivity.</p><div class="prism language-javascript">NetInfo<span cl
 NetInfo<span class="token punctuation">.</span>isConnected<span class="token punctuation">.</span><span class="token function">addEventListener<span class="token punctuation">(</span></span>
   <span class="token string">&#x27;change&#x27;</span><span class="token punctuation">,</span>
   handleFirstConnectivityChange
-<span class="token punctuation">)</span><span class="token punctuation">;</span></div></div></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="panresponder.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+<span class="token punctuation">)</span><span class="token punctuation">;</span></div></div></div><div class="docs-prevnext"><a class="docs-next" href="panresponder.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/panresponder.html

@@ -52,7 +52,7 @@ as well.</p><p>Be careful with onStartShould* callbacks. They only reflect updat
 Once the node is the responder, you can rely on every start/end event
 being processed by the gesture and <code>gestureState</code> being updated
 accordingly. (numberActiveTouches) may not be totally accurate unless you
-are the responder.</p></li></ul></div></div></div></span></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="pixelratio.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+are the responder.</p></li></ul></div></div></div></span></div><div class="docs-prevnext"><a class="docs-next" href="pixelratio.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/pixelratio.html

@@ -6,7 +6,7 @@ by the pixel ratio.</p><div class="prism language-javascript"><span class="token
   width<span class="token punctuation">:</span> <span class="token number">200</span> <span class="token operator">*</span> PixelRatio<span class="token punctuation">.</span><span class="token keyword">get</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
   height<span class="token punctuation">:</span> <span class="token number">100</span> <span class="token operator">*</span> PixelRatio<span class="token punctuation">.</span><span class="token keyword">get</span><span class="token punctuation">(</span><span class="token punctuation">)</span>
 <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
-&lt;Image source<span class="token operator">=</span><span class="token punctuation">{</span>image<span class="token punctuation">}</span> style<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>width<span class="token punctuation">:</span> <span class="token number">200</span><span class="token punctuation">,</span> height<span class="token punctuation">:</span> <span class="token number">100</span><span class="token punctuation">}</span><span class="token punctuation">}</span> <span class="token operator">/</span><span class="token operator">&gt;</span></div></div><span><h3><a class="anchor" name="methods"></a>Methods <a class="hash-link" href="#methods">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="get"></a><span class="propType">static </span>get<span class="propType">()</span> <a class="hash-link" href="#get">#</a></h4><div><p>Returns the device pixel density. Some examples:</p><ul><li>PixelRatio.get() === 2<ul><li>iPhone 4, 4S</li><li>iPhone 5, 5c, 5s</li><li>iPhone 6</li></ul></li><li>PixelRatio.get() === 3<ul><li>iPhone 6 plus</li></ul></li></ul></div></div></div></span></div><div><h2><a class="anchor" name="pixel-grid-snapping"></a>Pixel Grid Snapping <a class="hash-link" href="#pixel-grid-snapping">#</a></h2><p>In iOS, you can specify positions and dimensions for elements with arbitrary precision, for example 29.674825. But, ultimately the physical display only have a fixed number of pixels, for example 640×960 for iphone 4 or 750×1334 for iphone 6. iOS tries to be as faithful as possible to the user value by spreading one original pixel into multiple ones to trick the eye. The downside of this technique is that it makes the resulting element look blurry.</p><p>In practice, we found out that developers do not want this feature and they have to work around it by doing manual rounding in order to avoid having blurry elements. In React Native, we are rounding all the pixels automatically.</p><p>We have to be careful when to do this rounding. You never want to work with rounded and unrounded values at the same time as you&#x27;re going to accumulate rounding errors. Having even one rounding error is deadly because a one pixel border may vanish or be twice as big.</p><p>In React Native, everything in JS and within the layout engine work with arbitrary precision numbers. It&#x27;s only when we set the position and dimensions of the native element on the main thread that we round. Also, rounding is done relative to the root rather than the parent, again to avoid accumulating rounding errors.</p></div><div class="docs-prevnext"><a class="docs-next" href="pushnotificationios.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+&lt;Image source<span class="token operator">=</span><span class="token punctuation">{</span>image<span class="token punctuation">}</span> style<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>width<span class="token punctuation">:</span> <span class="token number">200</span><span class="token punctuation">,</span> height<span class="token punctuation">:</span> <span class="token number">100</span><span class="token punctuation">}</span><span class="token punctuation">}</span> <span class="token operator">/</span><span class="token operator">&gt;</span></div></div><span><h3><a class="anchor" name="methods"></a>Methods <a class="hash-link" href="#methods">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="get"></a><span class="propType">static </span>get<span class="propType">()</span> <a class="hash-link" href="#get">#</a></h4><div><p>Returns the device pixel density. Some examples:</p><ul><li>PixelRatio.get() === 2<ul><li>iPhone 4, 4S</li><li>iPhone 5, 5c, 5s</li><li>iPhone 6</li></ul></li><li>PixelRatio.get() === 3<ul><li>iPhone 6 plus</li></ul></li></ul></div></div></div></span></div><div><h3><a class="anchor" name="description"></a><a class="edit-github" href="https://github.com/facebook/react-native/blob/master/docs/PixelRatio.md">Edit on GitHub</a>Description <a class="hash-link" href="#description">#</a></h3><div><h2><a class="anchor" name="pixel-grid-snapping"></a>Pixel Grid Snapping <a class="hash-link" href="#pixel-grid-snapping">#</a></h2><p>In iOS, you can specify positions and dimensions for elements with arbitrary precision, for example 29.674825. But, ultimately the physical display only have a fixed number of pixels, for example 640×960 for iphone 4 or 750×1334 for iphone 6. iOS tries to be as faithful as possible to the user value by spreading one original pixel into multiple ones to trick the eye. The downside of this technique is that it makes the resulting element look blurry.</p><p>In practice, we found out that developers do not want this feature and they have to work around it by doing manual rounding in order to avoid having blurry elements. In React Native, we are rounding all the pixels automatically.</p><p>We have to be careful when to do this rounding. You never want to work with rounded and unrounded values at the same time as you&#x27;re going to accumulate rounding errors. Having even one rounding error is deadly because a one pixel border may vanish or be twice as big.</p><p>In React Native, everything in JS and within the layout engine work with arbitrary precision numbers. It&#x27;s only when we set the position and dimensions of the native element on the main thread that we round. Also, rounding is done relative to the root rather than the parent, again to avoid accumulating rounding errors.</p></div></div><div class="docs-prevnext"><a class="docs-next" href="pushnotificationios.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/pushnotificationios.html

@@ -8,7 +8,7 @@ memory leaks</p></div></div><div class="prop"><h4 class="propTitle"><a class="an
 from a notification.</p><p>The first caller of <code>popInitialNotification</code> will get the initial
 notification object, or <code>null</code>. Subsequent invocations will return null.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="constructor"></a>constructor<span class="propType">(nativeNotif)</span> <a class="hash-link" href="#constructor">#</a></h4><div><p>You will never need to instansiate <code>PushNotificationIOS</code> yourself.
 Listening to the <code>notification</code> event and invoking
-<code>popInitialNotification</code> is sufficient</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="getmessage"></a>getMessage<span class="propType">()</span> <a class="hash-link" href="#getmessage">#</a></h4><div><p>An alias for <code>getAlert</code> to get the notification&#x27;s main message string</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="getsound"></a>getSound<span class="propType">()</span> <a class="hash-link" href="#getsound">#</a></h4><div><p>Gets the sound string from the <code>aps</code> object</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="getalert"></a>getAlert<span class="propType">()</span> <a class="hash-link" href="#getalert">#</a></h4><div><p>Gets the notification&#x27;s main message from the <code>aps</code> object</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="getbadgecount"></a>getBadgeCount<span class="propType">()</span> <a class="hash-link" href="#getbadgecount">#</a></h4><div><p>Gets the badge count number from the <code>aps</code> object</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="getdata"></a>getData<span class="propType">()</span> <a class="hash-link" href="#getdata">#</a></h4><div><p>Gets the data object on the notif</p></div></div></div></span></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="statusbarios.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+<code>popInitialNotification</code> is sufficient</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="getmessage"></a>getMessage<span class="propType">()</span> <a class="hash-link" href="#getmessage">#</a></h4><div><p>An alias for <code>getAlert</code> to get the notification&#x27;s main message string</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="getsound"></a>getSound<span class="propType">()</span> <a class="hash-link" href="#getsound">#</a></h4><div><p>Gets the sound string from the <code>aps</code> object</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="getalert"></a>getAlert<span class="propType">()</span> <a class="hash-link" href="#getalert">#</a></h4><div><p>Gets the notification&#x27;s main message from the <code>aps</code> object</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="getbadgecount"></a>getBadgeCount<span class="propType">()</span> <a class="hash-link" href="#getbadgecount">#</a></h4><div><p>Gets the badge count number from the <code>aps</code> object</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="getdata"></a>getData<span class="propType">()</span> <a class="hash-link" href="#getdata">#</a></h4><div><p>Gets the data object on the notif</p></div></div></div></span></div><div class="docs-prevnext"><a class="docs-next" href="statusbarios.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/stylesheet.html

@@ -17,7 +17,7 @@
 code easier to understand.</li><li>Naming the styles is a good way to add meaning to the low level components
 in the render function.</li></ul><p>Performance:</p><ul><li>Making a stylesheet from a style object makes it possible to refer to it
 by ID instead of creating a new style object every time.</li><li>It also allows to send the style only once through the bridge. All
-subsequent uses are going to refer an id (not implemented yet).</li></ul></div><span><h3><a class="anchor" name="methods"></a>Methods <a class="hash-link" href="#methods">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="create"></a><span class="propType">static </span>create<span class="propType">(obj: {[key: string]: any})</span> <a class="hash-link" href="#create">#</a></h4></div></div></span></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="vibrationios.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+subsequent uses are going to refer an id (not implemented yet).</li></ul></div><span><h3><a class="anchor" name="methods"></a>Methods <a class="hash-link" href="#methods">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="create"></a><span class="propType">static </span>create<span class="propType">(obj: {[key: string]: any})</span> <a class="hash-link" href="#create">#</a></h4></div></div></span></div><div class="docs-prevnext"><a class="docs-next" href="vibrationios.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/switchios.html

@@ -2,9 +2,9 @@
 a controlled component, so you must hook in to the <code>onValueChange</code> callback
 and update the <code>value</code> prop in order for the component to update, otherwise
 the user&#x27;s change will be reverted immediately to reflect <code>props.value</code> as the
-source of truth.</p></div><h3><a class="anchor" name="props"></a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="disabled"></a>disabled <span class="propType">bool</span> <a class="hash-link" href="#disabled">#</a></h4><div><p>If true the user won&#x27;t be able to toggle the switch.
+source of truth.</p></div><h3><a class="anchor" name="props"></a><a class="edit-github" href="https://github.com/facebook/react-native/blob/master/Libraries/Components/SwitchIOS/SwitchIOS.ios.js">Edit on GitHub</a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="disabled"></a>disabled <span class="propType">bool</span> <a class="hash-link" href="#disabled">#</a></h4><div><p>If true the user won&#x27;t be able to toggle the switch.
 Default value is false.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="ontintcolor"></a>onTintColor <span class="propType">string</span> <a class="hash-link" href="#ontintcolor">#</a></h4><div><p>Background color when the switch is turned on.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="onvaluechange"></a>onValueChange <span class="propType">function</span> <a class="hash-link" href="#onvaluechange">#</a></h4><div><p>Callback that is called when the user toggles the switch.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="thumbtintcolor"></a>thumbTintColor <span class="propType">string</span> <a class="hash-link" href="#thumbtintcolor">#</a></h4><div><p>Background color for the switch round button.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="tintcolor"></a>tintColor <span class="propType">string</span> <a class="hash-link" href="#tintcolor">#</a></h4><div><p>Background color when the switch is turned off.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="value"></a>value <span class="propType">bool</span> <a class="hash-link" href="#value">#</a></h4><div><p>The value of the switch, if true the switch will be turned on.
-Default value is false.</p></div></div></div></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="tabbarios.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+Default value is false.</p></div></div></div></div><div class="docs-prevnext"><a class="docs-next" href="tabbarios.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/text.html

@@ -23,12 +23,12 @@ each other on account of the literal newlines:</p><div class="prism language-jav
     fontSize<span class="token punctuation">:</span> <span class="token number">20</span><span class="token punctuation">,</span>
     fontWeight<span class="token punctuation">:</span> <span class="token string">&#x27;bold&#x27;</span><span class="token punctuation">,</span>
   <span class="token punctuation">}</span><span class="token punctuation">,</span>
-<span class="token punctuation">}</span><span class="token punctuation">;</span></div></div><h3><a class="anchor" name="props"></a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="numberoflines"></a>numberOfLines <span class="propType">number</span> <a class="hash-link" href="#numberoflines">#</a></h4><div><p>Used to truncate the text with an elipsis after computing the text
+<span class="token punctuation">}</span><span class="token punctuation">;</span></div></div><h3><a class="anchor" name="props"></a><a class="edit-github" href="https://github.com/facebook/react-native/blob/master/Libraries/Text/Text.js">Edit on GitHub</a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="numberoflines"></a>numberOfLines <span class="propType">number</span> <a class="hash-link" href="#numberoflines">#</a></h4><div><p>Used to truncate the text with an elipsis after computing the text
 layout, including line wrapping, such that the total number of lines does
 not exceed this number.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="onpress"></a>onPress <span class="propType">function</span> <a class="hash-link" href="#onpress">#</a></h4><div><p>This function is called on press.  Text intrinsically supports press
 handling with a default highlight state (which can be disabled with
 <code>suppressHighlighting</code>).</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="style"></a>style <span class="propType">style</span> <a class="hash-link" href="#style">#</a></h4><div class="compactProps"><div class="prop"><h6 class="propTitle"><a href="view.html#style">View#style...</a></h6></div><div class="prop"><h6 class="propTitle">color <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">containerBackgroundColor <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">fontFamily <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">fontSize <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">fontStyle <span class="propType">enum(&#x27;normal&#x27;, &#x27;italic&#x27;)</span></h6></div><div class="prop"><h6 class="propTitle">fontWeight <span class="propType">enum(&quot;normal&quot;, &#x27;bold&#x27;, &#x27;100&#x27;, &#x27;200&#x27;, &#x27;300&#x27;, &#x27;400&#x27;, &#x27;500&#x27;, &#x27;600&#x27;, &#x27;700&#x27;, &#x27;800&#x27;, &#x27;900&#x27;)</span></h6></div><div class="prop"><h6 class="propTitle">lineHeight <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">textAlign <span class="propType">enum(&quot;auto&quot;, &#x27;left&#x27;, &#x27;right&#x27;, &#x27;center&#x27;)</span></h6></div><div class="prop"><h6 class="propTitle">writingDirection <span class="propType">enum(&quot;auto&quot;, &#x27;ltr&#x27;, &#x27;rtl&#x27;)</span></h6></div></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="suppresshighlighting"></a>suppressHighlighting <span class="propType">bool</span> <a class="hash-link" href="#suppresshighlighting">#</a></h4><div><p>When true, no visual change is made when text is pressed down.  By
-default, a gray oval highlights the text on press down.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="testid"></a>testID <span class="propType">string</span> <a class="hash-link" href="#testid">#</a></h4><div><p>Used to locate this view in end-to-end tests.</p></div></div></div></div><div><h2><a class="anchor" name="nested-text"></a>Nested Text <a class="hash-link" href="#nested-text">#</a></h2><p>In iOS, the way to display formatted text is by using <code>NSAttributedString</code>: you give the text that you want to display and annotate ranges with some specific formatting. In practice, this is very tedious. For React Native, we decided to use web paradigm for this where you can nest text to achieve the same effect.</p><div class="prism language-javascript">&lt;Text style<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>fontWeight<span class="token punctuation">:</span> <span class="token string">&#x27;bold&#x27;</span><span class="token punctuation">}</span><span class="token punctuation">}</span><span class="token operator">&gt;</span>
+default, a gray oval highlights the text on press down.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="testid"></a>testID <span class="propType">string</span> <a class="hash-link" href="#testid">#</a></h4><div><p>Used to locate this view in end-to-end tests.</p></div></div></div></div><div><h3><a class="anchor" name="description"></a><a class="edit-github" href="https://github.com/facebook/react-native/blob/master/docs/Text.md">Edit on GitHub</a>Description <a class="hash-link" href="#description">#</a></h3><div><h2><a class="anchor" name="nested-text"></a>Nested Text <a class="hash-link" href="#nested-text">#</a></h2><p>In iOS, the way to display formatted text is by using <code>NSAttributedString</code>: you give the text that you want to display and annotate ranges with some specific formatting. In practice, this is very tedious. For React Native, we decided to use web paradigm for this where you can nest text to achieve the same effect.</p><div class="prism language-javascript">&lt;Text style<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>fontWeight<span class="token punctuation">:</span> <span class="token string">&#x27;bold&#x27;</span><span class="token punctuation">}</span><span class="token punctuation">}</span><span class="token operator">&gt;</span>
   I am bold
   &lt;Text style<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>color<span class="token punctuation">:</span> <span class="token string">&#x27;red&#x27;</span><span class="token punctuation">}</span><span class="token punctuation">}</span><span class="token operator">&gt;</span>
     and red
@@ -74,7 +74,7 @@ html <span class="token punctuation">{</span>
   &lt;Text style<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>color<span class="token punctuation">:</span> <span class="token string">&#x27;red&#x27;</span><span class="token punctuation">}</span><span class="token punctuation">}</span><span class="token operator">&gt;</span>
     and red
   &lt;<span class="token operator">/</span>Text<span class="token operator">&gt;</span>
-&lt;<span class="token operator">/</span>Text<span class="token operator">&gt;</span></div><p>We believe that this more constrained way to style text will yield better apps:</p><ul><li><p>(Developer) React components are designed with strong isolation in mind: You should be able to drop a component anywhere in your application, trusting that as long as the props are the same, it will look and behave the same way. Text properties that could inherit from outside of the props would break this isolation.</p></li><li><p>(Implementor) The implementation of React Native is also simplified. We do not need to have a <code>fontFamily</code> field on every single element, and we do not need to potentially traverse the tree up to the root every time we display a text node. The style inheritance is only encoded inside of the native Text component and doesn&#x27;t leak to other components or the system itself.</p></li></ul></div><div class="docs-prevnext"><a class="docs-next" href="textinput.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+&lt;<span class="token operator">/</span>Text<span class="token operator">&gt;</span></div><p>We believe that this more constrained way to style text will yield better apps:</p><ul><li><p>(Developer) React components are designed with strong isolation in mind: You should be able to drop a component anywhere in your application, trusting that as long as the props are the same, it will look and behave the same way. Text properties that could inherit from outside of the props would break this isolation.</p></li><li><p>(Implementor) The implementation of React Native is also simplified. We do not need to have a <code>fontFamily</code> field on every single element, and we do not need to potentially traverse the tree up to the root every time we display a text node. The style inheritance is only encoded inside of the native Text component and doesn&#x27;t leak to other components or the system itself.</p></li></ul></div></div><div class="docs-prevnext"><a class="docs-next" href="textinput.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/textinput.html

@@ -17,7 +17,7 @@ Setting <code>value</code> once is like setting the default value, but you can c
 continuously based on <code>onChangeText</code> events as well.  If you really want to
 force the component to always revert to the value you are setting, you can
 set <code>controlled={true}</code>.</p><p>The <code>multiline</code> prop is not supported in all releases, and some props are
-multiline only.</p></div><h3><a class="anchor" name="props"></a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="autocapitalize"></a>autoCapitalize <span class="propType">enum(&#x27;none&#x27;, &#x27;sentences&#x27;, &#x27;words&#x27;, &#x27;characters&#x27;)</span> <a class="hash-link" href="#autocapitalize">#</a></h4><div><p>Can tell TextInput to automatically capitalize certain characters.</p><ul><li>characters: all characters,</li><li>words: first letter of each word</li><li>sentences: first letter of each sentence (default)</li><li>none: don&#x27;t auto capitalize anything</li></ul></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="autocorrect"></a>autoCorrect <span class="propType">bool</span> <a class="hash-link" href="#autocorrect">#</a></h4><div><p>If false, disables auto-correct. Default value is true.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="autofocus"></a>autoFocus <span class="propType">bool</span> <a class="hash-link" href="#autofocus">#</a></h4><div><p>If true, focuses the input on componentDidMount. Default value is false.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="bufferdelay"></a>bufferDelay <span class="propType">number</span> <a class="hash-link" href="#bufferdelay">#</a></h4><div><p>This helps avoid drops characters due to race conditions between JS and
+multiline only.</p></div><h3><a class="anchor" name="props"></a><a class="edit-github" href="https://github.com/facebook/react-native/blob/master/Libraries/Components/TextInput/TextInput.js">Edit on GitHub</a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="autocapitalize"></a>autoCapitalize <span class="propType">enum(&#x27;none&#x27;, &#x27;sentences&#x27;, &#x27;words&#x27;, &#x27;characters&#x27;)</span> <a class="hash-link" href="#autocapitalize">#</a></h4><div><p>Can tell TextInput to automatically capitalize certain characters.</p><ul><li>characters: all characters,</li><li>words: first letter of each word</li><li>sentences: first letter of each sentence (default)</li><li>none: don&#x27;t auto capitalize anything</li></ul></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="autocorrect"></a>autoCorrect <span class="propType">bool</span> <a class="hash-link" href="#autocorrect">#</a></h4><div><p>If false, disables auto-correct. Default value is true.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="autofocus"></a>autoFocus <span class="propType">bool</span> <a class="hash-link" href="#autofocus">#</a></h4><div><p>If true, focuses the input on componentDidMount. Default value is false.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="bufferdelay"></a>bufferDelay <span class="propType">number</span> <a class="hash-link" href="#bufferdelay">#</a></h4><div><p>This helps avoid drops characters due to race conditions between JS and
 the native text input.  The default should be fine, but if you&#x27;re
 potentially doing very slow operations on every keystroke then you may
 want to try increasing this.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="clearbuttonmode"></a>clearButtonMode <span class="propType">enum(&#x27;never&#x27;, &#x27;while-editing&#x27;, &#x27;unless-editing&#x27;, &#x27;always&#x27;)</span> <a class="hash-link" href="#clearbuttonmode">#</a></h4><div><p>When the clear button should appear on the right side of the text view</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="controlled"></a>controlled <span class="propType">bool</span> <a class="hash-link" href="#controlled">#</a></h4><div><p>If you really want this to behave as a controlled component, you can set
@@ -25,7 +25,7 @@ this true, but you will probably see flickering, dropped keystrokes,
 and/or laggy typing, depending on how you process onChange events.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="editable"></a>editable <span class="propType">bool</span> <a class="hash-link" href="#editable">#</a></h4><div><p>If false, text is not editable. Default value is true.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="enablesreturnkeyautomatically"></a>enablesReturnKeyAutomatically <span class="propType">bool</span> <a class="hash-link" href="#enablesreturnkeyautomatically">#</a></h4><div><p>If true, the keyboard disables the return key when there is no text and
 automatically enables it when there is text. Default value is false.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="keyboardtype"></a>keyboardType <span class="propType">enum(&#x27;default&#x27;, &quot;ascii-capable&quot;, &#x27;numbers-and-punctuation&#x27;, &#x27;url&#x27;, &#x27;number-pad&#x27;, &#x27;phone-pad&#x27;, &#x27;name-phone-pad&#x27;, &#x27;email-address&#x27;, &#x27;decimal-pad&#x27;, &#x27;twitter&#x27;, &#x27;web-search&#x27;, &quot;numeric&quot;)</span> <a class="hash-link" href="#keyboardtype">#</a></h4><div><p>Determines which keyboard to open, e.g.<code>numeric</code>.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="multiline"></a>multiline <span class="propType">bool</span> <a class="hash-link" href="#multiline">#</a></h4><div><p>If true, the text input can be multiple lines. Default value is false.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="onblur"></a>onBlur <span class="propType">function</span> <a class="hash-link" href="#onblur">#</a></h4><div><p>Callback that is called when the text input is blurred</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="onchange"></a>onChange <span class="propType">function</span> <a class="hash-link" href="#onchange">#</a></h4><div><p>(text: string) =&gt; void</p><p>Callback that is called when the text input&#x27;s text changes.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="onchangetext"></a>onChangeText <span class="propType">function</span> <a class="hash-link" href="#onchangetext">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="onendediting"></a>onEndEditing <span class="propType">function</span> <a class="hash-link" href="#onendediting">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="onfocus"></a>onFocus <span class="propType">function</span> <a class="hash-link" href="#onfocus">#</a></h4><div><p>Callback that is called when the text input is focused</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="onsubmitediting"></a>onSubmitEditing <span class="propType">function</span> <a class="hash-link" href="#onsubmitediting">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="password"></a>password <span class="propType">bool</span> <a class="hash-link" href="#password">#</a></h4><div><p>If true, the TextInput will be a password field. Default value is false.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="placeholder"></a>placeholder <span class="propType">string</span> <a class="hash-link" href="#placeholder">#</a></h4><div><p>The string that will be rendered before text input has been entered</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="placeholdertextcolor"></a>placeholderTextColor <span class="propType">string</span> <a class="hash-link" href="#placeholdertextcolor">#</a></h4><div><p>The text color of the placeholder string</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="returnkeytype"></a>returnKeyType <span class="propType">enum(&#x27;default&#x27;, &#x27;go&#x27;, &#x27;google&#x27;, &#x27;join&#x27;, &#x27;next&#x27;, &#x27;route&#x27;, &#x27;search&#x27;, &#x27;send&#x27;, &#x27;yahoo&#x27;, &#x27;done&#x27;, &#x27;emergency-call&#x27;)</span> <a class="hash-link" href="#returnkeytype">#</a></h4><div><p>Determines how the return key should look.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="securetextentry"></a>secureTextEntry <span class="propType">bool</span> <a class="hash-link" href="#securetextentry">#</a></h4><div><p>If true, the text input obscures the text entered so that sensitive text
 like passwords stay secure. Default value is false.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="selectionstate"></a>selectionState <span class="propType">DocumentSelectionState</span> <a class="hash-link" href="#selectionstate">#</a></h4><div><p>See DocumentSelectionState.js, some state that is responsible for
-maintaining selection information for a document</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="style"></a>style <span class="propType"><a href="text.html#style">Text#style</a></span> <a class="hash-link" href="#style">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="testid"></a>testID <span class="propType">string</span> <a class="hash-link" href="#testid">#</a></h4><div><p>Used to locate this view in end-to-end tests.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="value"></a>value <span class="propType">string</span> <a class="hash-link" href="#value">#</a></h4><div><p>The default value for the text input</p></div></div></div></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="touchablehighlight.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+maintaining selection information for a document</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="style"></a>style <span class="propType"><a href="text.html#style">Text#style</a></span> <a class="hash-link" href="#style">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="testid"></a>testID <span class="propType">string</span> <a class="hash-link" href="#testid">#</a></h4><div><p>Used to locate this view in end-to-end tests.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="value"></a>value <span class="propType">string</span> <a class="hash-link" href="#value">#</a></h4><div><p>The default value for the text input</p></div></div></div></div><div class="docs-prevnext"><a class="docs-next" href="touchablehighlight.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/touchablehighlight.html

@@ -12,9 +12,9 @@ backgroundColor of the wrapped view isn't explicitly set to an opaque color
       <span class="token operator">/</span><span class="token operator">&gt;</span>
     &lt;<span class="token operator">/</span>TouchableHighlight<span class="token operator">&gt;</span>
   <span class="token punctuation">)</span><span class="token punctuation">;</span>
-<span class="token punctuation">}</span><span class="token punctuation">,</span></div></div><h3><a class="anchor" name="props"></a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="touchablewithoutfeedback"></a><a href="touchablewithoutfeedback.html#proptypes">TouchableWithoutFeedback props...</a> <a class="hash-link" href="#touchablewithoutfeedback">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="activeopacity"></a>activeOpacity <span class="propType">number</span> <a class="hash-link" href="#activeopacity">#</a></h4><div><p>Determines what the opacity of the wrapped view should be when touch is
+<span class="token punctuation">}</span><span class="token punctuation">,</span></div></div><h3><a class="anchor" name="props"></a><a class="edit-github" href="https://github.com/facebook/react-native/blob/master/Libraries/Components/Touchable/TouchableHighlight.js">Edit on GitHub</a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="touchablewithoutfeedback"></a><a href="touchablewithoutfeedback.html#proptypes">TouchableWithoutFeedback props...</a> <a class="hash-link" href="#touchablewithoutfeedback">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="activeopacity"></a>activeOpacity <span class="propType">number</span> <a class="hash-link" href="#activeopacity">#</a></h4><div><p>Determines what the opacity of the wrapped view should be when touch is
 active.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="style"></a>style <span class="propType"><a href="view.html#style">View#style</a></span> <a class="hash-link" href="#style">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="underlaycolor"></a>underlayColor <span class="propType">string</span> <a class="hash-link" href="#underlaycolor">#</a></h4><div><p>The color of the underlay that will show through when the touch is
-active.</p></div></div></div></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="touchableopacity.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+active.</p></div></div></div></div><div class="docs-prevnext"><a class="docs-next" href="touchableopacity.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/touchableopacity.html

@@ -10,8 +10,8 @@ easy to add to an app without weird side-effects.</p><p>Example:</p><div class="
       <span class="token operator">/</span><span class="token operator">&gt;</span>
     &lt;<span class="token operator">/</span>TouchableOpacity<span class="token operator">&gt;</span>
   <span class="token punctuation">)</span><span class="token punctuation">;</span>
-<span class="token punctuation">}</span><span class="token punctuation">,</span></div></div><h3><a class="anchor" name="props"></a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="touchablewithoutfeedback"></a><a href="touchablewithoutfeedback.html#proptypes">TouchableWithoutFeedback props...</a> <a class="hash-link" href="#touchablewithoutfeedback">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="activeopacity"></a>activeOpacity <span class="propType">number</span> <a class="hash-link" href="#activeopacity">#</a></h4><div><p>Determines what the opacity of the wrapped view should be when touch is
-active.</p></div></div></div></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="touchablewithoutfeedback.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+<span class="token punctuation">}</span><span class="token punctuation">,</span></div></div><h3><a class="anchor" name="props"></a><a class="edit-github" href="https://github.com/facebook/react-native/blob/master/Libraries/Components/Touchable/TouchableOpacity.js">Edit on GitHub</a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="touchablewithoutfeedback"></a><a href="touchablewithoutfeedback.html#proptypes">TouchableWithoutFeedback props...</a> <a class="hash-link" href="#touchablewithoutfeedback">#</a></h4></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="activeopacity"></a>activeOpacity <span class="propType">number</span> <a class="hash-link" href="#activeopacity">#</a></h4><div><p>Determines what the opacity of the wrapped view should be when touch is
+active.</p></div></div></div></div><div class="docs-prevnext"><a class="docs-next" href="touchablewithoutfeedback.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

docs/view.html

@@ -9,7 +9,7 @@ wraps two colored boxes and custom component in a row with padding.</p><div clas
   &lt;View style<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>backgroundColor<span class="token punctuation">:</span> <span class="token string">&#x27;red&#x27;</span><span class="token punctuation">,</span> flex<span class="token punctuation">:</span> <span class="token number">0.5</span><span class="token punctuation">}</span><span class="token punctuation">}</span> <span class="token operator">/</span><span class="token operator">&gt;</span>
   &lt;MyCustomComponent <span class="token punctuation">{</span><span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token punctuation">.</span>customProps<span class="token punctuation">}</span> <span class="token operator">/</span><span class="token operator">&gt;</span>
 &lt;<span class="token operator">/</span>View<span class="token operator">&gt;</span></div><p><code>View</code>s are designed to be used with <code>StyleSheet</code>s for clarity and
-performance, although inline styles are also supported.</p></div><h3><a class="anchor" name="props"></a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="accessibilitylabel"></a>accessibilityLabel <span class="propType">string</span> <a class="hash-link" href="#accessibilitylabel">#</a></h4><div><p>Overrides the text that&#x27;s read by the screen reader when the user interacts
+performance, although inline styles are also supported.</p></div><h3><a class="anchor" name="props"></a><a class="edit-github" href="https://github.com/facebook/react-native/blob/master/Libraries/Components/View/View.js">Edit on GitHub</a>Props <a class="hash-link" href="#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="accessibilitylabel"></a>accessibilityLabel <span class="propType">string</span> <a class="hash-link" href="#accessibilitylabel">#</a></h4><div><p>Overrides the text that&#x27;s read by the screen reader when the user interacts
 with the element. By default, the label is constructed by traversing all the
 children and accumulating all the Text nodes separated by space.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="accessible"></a>accessible <span class="propType">bool</span> <a class="hash-link" href="#accessible">#</a></h4><div><p>When true, indicates that the view is an accessibility element. By default,
 all the touchable elements are accessible.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="onmoveshouldsetresponder"></a>onMoveShouldSetResponder <span class="propType">function</span> <a class="hash-link" href="#onmoveshouldsetresponder">#</a></h4><div><p>For most touch interactions, you&#x27;ll simply want to wrap your component in
@@ -34,7 +34,7 @@ for scrolling content when there are many subviews, most of which are
 offscreen. For this property to be effective, it must be applied to a
 view that contains many subviews that extend outside its bound. The
 subviews must also have overflow: hidden, as should the containing view
-(or one of its superviews).</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="style"></a>style <span class="propType">style</span> <a class="hash-link" href="#style">#</a></h4><div class="compactProps"><div class="prop"><h6 class="propTitle"><a href="flexbox.html#proptypes">Flexbox...</a></h6></div><div class="prop"><h6 class="propTitle">backgroundColor <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">borderBottomColor <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">borderColor <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">borderLeftColor <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">borderRadius <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">borderRightColor <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">borderTopColor <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">opacity <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">overflow <span class="propType">enum(&#x27;visible&#x27;, &#x27;hidden&#x27;)</span></h6></div><div class="prop"><h6 class="propTitle">rotation <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">scaleX <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">scaleY <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">shadowColor <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">shadowOffset <span class="propType">{h: number, w: number}</span></h6></div><div class="prop"><h6 class="propTitle">shadowOpacity <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">shadowRadius <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">transformMatrix <span class="propType">[number]</span></h6></div><div class="prop"><h6 class="propTitle">translateX <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">translateY <span class="propType">number</span></h6></div></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="testid"></a>testID <span class="propType">string</span> <a class="hash-link" href="#testid">#</a></h4><div><p>Used to locate this view in end-to-end tests.</p></div></div></div></div><noscript></noscript><div class="docs-prevnext"><a class="docs-next" href="webview.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+(or one of its superviews).</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="style"></a>style <span class="propType">style</span> <a class="hash-link" href="#style">#</a></h4><div class="compactProps"><div class="prop"><h6 class="propTitle"><a href="flexbox.html#proptypes">Flexbox...</a></h6></div><div class="prop"><h6 class="propTitle">backgroundColor <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">borderBottomColor <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">borderColor <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">borderLeftColor <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">borderRadius <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">borderRightColor <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">borderTopColor <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">opacity <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">overflow <span class="propType">enum(&#x27;visible&#x27;, &#x27;hidden&#x27;)</span></h6></div><div class="prop"><h6 class="propTitle">rotation <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">scaleX <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">scaleY <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">shadowColor <span class="propType">string</span></h6></div><div class="prop"><h6 class="propTitle">shadowOffset <span class="propType">{h: number, w: number}</span></h6></div><div class="prop"><h6 class="propTitle">shadowOpacity <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">shadowRadius <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">transformMatrix <span class="propType">[number]</span></h6></div><div class="prop"><h6 class="propTitle">translateX <span class="propType">number</span></h6></div><div class="prop"><h6 class="propTitle">translateY <span class="propType">number</span></h6></div></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="testid"></a>testID <span class="propType">string</span> <a class="hash-link" href="#testid">#</a></h4><div><p>Used to locate this view in end-to-end tests.</p></div></div></div></div><div class="docs-prevnext"><a class="docs-next" href="webview.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)