From f2c157af476a74e85f43d12cc815cec2deaf978d Mon Sep 17 00:00:00 2001
From: Website Deployment Script <reactjs-bot@users.noreply.github.com>
Date: Sun, 16 Feb 2020 01:18:35 +0000
Subject: [PATCH] Deploy website

Deploy website version based on 7985a601d972dfba5ed0e816c8b9ba711d40c1a5
---
 docs/next/switch.html       | 33 ++++++++++++++++++++++-----------
 docs/next/switch/index.html | 33 ++++++++++++++++++++++-----------
 2 files changed, 44 insertions(+), 22 deletions(-)

diff --git a/docs/next/switch.html b/docs/next/switch.html
index 4babd6554b6..a8da886414c 100644
--- a/docs/next/switch.html
+++ b/docs/next/switch.html
@@ -70,26 +70,37 @@
             });
         </script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/docs/switch.md" target="_blank" rel="noreferrer noopener">Edit</a><h1 id="__docusaurus" class="postHeaderTitle">Switch</h1></header><article><div><span><p>Renders a boolean input.</p>
 <p>This is a controlled component that requires an <code>onValueChange</code> callback that updates the <code>value</code> prop in order for the component to reflect user actions. If the <code>value</code> prop is not updated, the component will continue to render the supplied <code>value</code> prop instead of the expected result of any user actions.</p>
-<div class="snack-player"><div class="mobile-friendly-snack" style="display: none"><pre><code class="hljs css javascript"><span class="hljs-keyword">import</span> React, { useState } <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
-<span class="hljs-keyword">import</span> { Text, View, Switch } <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
+<div class="snack-player"><div class="mobile-friendly-snack" style="display: none"><pre><code class="hljs css javascript"><span class="hljs-keyword">import</span> React, { useState } <span class="hljs-keyword">from</span> <span class="hljs-string">"react"</span>;
+<span class="hljs-keyword">import</span> { View, Switch, StyleSheet } <span class="hljs-keyword">from</span> <span class="hljs-string">"react-native"</span>;
 
 <span class="hljs-keyword">export</span> <span class="hljs-keyword">default</span> <span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">App</span>(<span class="hljs-params"></span>) </span>{
-  <span class="hljs-keyword">const</span> [value, setValue] = useState(<span class="hljs-literal">false</span>);
+  <span class="hljs-keyword">const</span> [isEnabled, setIsEnabled] = useState(<span class="hljs-literal">false</span>);
+  <span class="hljs-keyword">const</span> toggleSwitch = <span class="hljs-function"><span class="hljs-params">()</span> =&gt;</span> setIsEnabled(<span class="hljs-function"><span class="hljs-params">previousState</span> =&gt;</span> !previousState);
+
   <span class="hljs-keyword">return</span> (
-    <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">View</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{{</span> <span class="hljs-attr">flex:</span> <span class="hljs-attr">1</span>, <span class="hljs-attr">justifyContent:</span> '<span class="hljs-attr">center</span>', <span class="hljs-attr">alignItems:</span> '<span class="hljs-attr">center</span>' }}&gt;</span>
+    <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">View</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{styles.container}</span>&gt;</span>
       <span class="hljs-tag">&lt;<span class="hljs-name">Switch</span>
-        <span class="hljs-attr">value</span>=<span class="hljs-string">{value}</span>
-        <span class="hljs-attr">onValueChange</span>=<span class="hljs-string">{v</span> =&gt;</span> {
-          setValue(v);
-        }}
-      /&gt;
+        <span class="hljs-attr">trackColor</span>=<span class="hljs-string">{{</span> <span class="hljs-attr">false:</span> "#<span class="hljs-attr">767577</span>", <span class="hljs-attr">true:</span> "#<span class="hljs-attr">81b0ff</span>" }}
+        <span class="hljs-attr">thumbColor</span>=<span class="hljs-string">{isEnabled</span> ? "#<span class="hljs-attr">f5dd4b</span>" <span class="hljs-attr">:</span> "#<span class="hljs-attr">f4f3f4</span>"}
+        <span class="hljs-attr">ios_backgroundColor</span>=<span class="hljs-string">"#3e3e3e"</span>
+        <span class="hljs-attr">onValueChange</span>=<span class="hljs-string">{toggleSwitch}</span>
+        <span class="hljs-attr">value</span>=<span class="hljs-string">{isEnabled}</span>
+      /&gt;</span>
     <span class="hljs-tag">&lt;/<span class="hljs-name">View</span>&gt;</span>
   );
 }
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center"
+  }
+});
 </span></code></pre></div><div class="desktop-friendly-snack" style="margin-top: 15px; margin-bottom: 15px"><div
-        data-snack-name="switch"
+        data-snack-name="Switch"
         data-snack-description="Example usage"
-        data-snack-code="import%20React%2C%20%7B%20useState%20%7D%20from%20'react'%3B%0Aimport%20%7B%20Text%2C%20View%2C%20Switch%20%7D%20from%20'react-native'%3B%0A%0Aexport%20default%20function%20App()%20%7B%0A%20%20const%20%5Bvalue%2C%20setValue%5D%20%3D%20useState(false)%3B%0A%20%20return%20(%0A%20%20%20%20%3CView%20style%3D%7B%7B%20flex%3A%201%2C%20justifyContent%3A%20'center'%2C%20alignItems%3A%20'center'%20%7D%7D%3E%0A%20%20%20%20%20%20%3CSwitch%0A%20%20%20%20%20%20%20%20value%3D%7Bvalue%7D%0A%20%20%20%20%20%20%20%20onValueChange%3D%7Bv%20%3D%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20setValue(v)%3B%0A%20%20%20%20%20%20%20%20%7D%7D%0A%20%20%20%20%20%20%2F%3E%0A%20%20%20%20%3C%2FView%3E%0A%20%20)%3B%0A%7D%0A"
+        data-snack-code="import%20React%2C%20%7B%20useState%20%7D%20from%20%22react%22%3B%0Aimport%20%7B%20View%2C%20Switch%2C%20StyleSheet%20%7D%20from%20%22react-native%22%3B%0A%0Aexport%20default%20function%20App()%20%7B%0A%20%20const%20%5BisEnabled%2C%20setIsEnabled%5D%20%3D%20useState(false)%3B%0A%20%20const%20toggleSwitch%20%3D%20()%20%3D%3E%20setIsEnabled(previousState%20%3D%3E%20!previousState)%3B%0A%0A%20%20return%20(%0A%20%20%20%20%3CView%20style%3D%7Bstyles.container%7D%3E%0A%20%20%20%20%20%20%3CSwitch%0A%20%20%20%20%20%20%20%20trackColor%3D%7B%7B%20false%3A%20%22%23767577%22%2C%20true%3A%20%22%2381b0ff%22%20%7D%7D%0A%20%20%20%20%20%20%20%20thumbColor%3D%7BisEnabled%20%3F%20%22%23f5dd4b%22%20%3A%20%22%23f4f3f4%22%7D%0A%20%20%20%20%20%20%20%20ios_backgroundColor%3D%22%233e3e3e%22%0A%20%20%20%20%20%20%20%20onValueChange%3D%7BtoggleSwitch%7D%0A%20%20%20%20%20%20%20%20value%3D%7BisEnabled%7D%0A%20%20%20%20%20%20%2F%3E%0A%20%20%20%20%3C%2FView%3E%0A%20%20)%3B%0A%7D%0A%0Aconst%20styles%20%3D%20StyleSheet.create(%7B%0A%20%20container%3A%20%7B%0A%20%20%20%20flex%3A%201%2C%0A%20%20%20%20alignItems%3A%20%22center%22%2C%0A%20%20%20%20justifyContent%3A%20%22center%22%0A%20%20%7D%0A%7D)%3B%0A"
         data-snack-platform="web"
         data-snack-supported-platforms=ios,android,web
         data-snack-preview="true"
diff --git a/docs/next/switch/index.html b/docs/next/switch/index.html
index 4babd6554b6..a8da886414c 100644
--- a/docs/next/switch/index.html
+++ b/docs/next/switch/index.html
@@ -70,26 +70,37 @@
             });
         </script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/docs/switch.md" target="_blank" rel="noreferrer noopener">Edit</a><h1 id="__docusaurus" class="postHeaderTitle">Switch</h1></header><article><div><span><p>Renders a boolean input.</p>
 <p>This is a controlled component that requires an <code>onValueChange</code> callback that updates the <code>value</code> prop in order for the component to reflect user actions. If the <code>value</code> prop is not updated, the component will continue to render the supplied <code>value</code> prop instead of the expected result of any user actions.</p>
-<div class="snack-player"><div class="mobile-friendly-snack" style="display: none"><pre><code class="hljs css javascript"><span class="hljs-keyword">import</span> React, { useState } <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
-<span class="hljs-keyword">import</span> { Text, View, Switch } <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
+<div class="snack-player"><div class="mobile-friendly-snack" style="display: none"><pre><code class="hljs css javascript"><span class="hljs-keyword">import</span> React, { useState } <span class="hljs-keyword">from</span> <span class="hljs-string">"react"</span>;
+<span class="hljs-keyword">import</span> { View, Switch, StyleSheet } <span class="hljs-keyword">from</span> <span class="hljs-string">"react-native"</span>;
 
 <span class="hljs-keyword">export</span> <span class="hljs-keyword">default</span> <span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">App</span>(<span class="hljs-params"></span>) </span>{
-  <span class="hljs-keyword">const</span> [value, setValue] = useState(<span class="hljs-literal">false</span>);
+  <span class="hljs-keyword">const</span> [isEnabled, setIsEnabled] = useState(<span class="hljs-literal">false</span>);
+  <span class="hljs-keyword">const</span> toggleSwitch = <span class="hljs-function"><span class="hljs-params">()</span> =&gt;</span> setIsEnabled(<span class="hljs-function"><span class="hljs-params">previousState</span> =&gt;</span> !previousState);
+
   <span class="hljs-keyword">return</span> (
-    <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">View</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{{</span> <span class="hljs-attr">flex:</span> <span class="hljs-attr">1</span>, <span class="hljs-attr">justifyContent:</span> '<span class="hljs-attr">center</span>', <span class="hljs-attr">alignItems:</span> '<span class="hljs-attr">center</span>' }}&gt;</span>
+    <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">View</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{styles.container}</span>&gt;</span>
       <span class="hljs-tag">&lt;<span class="hljs-name">Switch</span>
-        <span class="hljs-attr">value</span>=<span class="hljs-string">{value}</span>
-        <span class="hljs-attr">onValueChange</span>=<span class="hljs-string">{v</span> =&gt;</span> {
-          setValue(v);
-        }}
-      /&gt;
+        <span class="hljs-attr">trackColor</span>=<span class="hljs-string">{{</span> <span class="hljs-attr">false:</span> "#<span class="hljs-attr">767577</span>", <span class="hljs-attr">true:</span> "#<span class="hljs-attr">81b0ff</span>" }}
+        <span class="hljs-attr">thumbColor</span>=<span class="hljs-string">{isEnabled</span> ? "#<span class="hljs-attr">f5dd4b</span>" <span class="hljs-attr">:</span> "#<span class="hljs-attr">f4f3f4</span>"}
+        <span class="hljs-attr">ios_backgroundColor</span>=<span class="hljs-string">"#3e3e3e"</span>
+        <span class="hljs-attr">onValueChange</span>=<span class="hljs-string">{toggleSwitch}</span>
+        <span class="hljs-attr">value</span>=<span class="hljs-string">{isEnabled}</span>
+      /&gt;</span>
     <span class="hljs-tag">&lt;/<span class="hljs-name">View</span>&gt;</span>
   );
 }
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center"
+  }
+});
 </span></code></pre></div><div class="desktop-friendly-snack" style="margin-top: 15px; margin-bottom: 15px"><div
-        data-snack-name="switch"
+        data-snack-name="Switch"
         data-snack-description="Example usage"
-        data-snack-code="import%20React%2C%20%7B%20useState%20%7D%20from%20'react'%3B%0Aimport%20%7B%20Text%2C%20View%2C%20Switch%20%7D%20from%20'react-native'%3B%0A%0Aexport%20default%20function%20App()%20%7B%0A%20%20const%20%5Bvalue%2C%20setValue%5D%20%3D%20useState(false)%3B%0A%20%20return%20(%0A%20%20%20%20%3CView%20style%3D%7B%7B%20flex%3A%201%2C%20justifyContent%3A%20'center'%2C%20alignItems%3A%20'center'%20%7D%7D%3E%0A%20%20%20%20%20%20%3CSwitch%0A%20%20%20%20%20%20%20%20value%3D%7Bvalue%7D%0A%20%20%20%20%20%20%20%20onValueChange%3D%7Bv%20%3D%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20setValue(v)%3B%0A%20%20%20%20%20%20%20%20%7D%7D%0A%20%20%20%20%20%20%2F%3E%0A%20%20%20%20%3C%2FView%3E%0A%20%20)%3B%0A%7D%0A"
+        data-snack-code="import%20React%2C%20%7B%20useState%20%7D%20from%20%22react%22%3B%0Aimport%20%7B%20View%2C%20Switch%2C%20StyleSheet%20%7D%20from%20%22react-native%22%3B%0A%0Aexport%20default%20function%20App()%20%7B%0A%20%20const%20%5BisEnabled%2C%20setIsEnabled%5D%20%3D%20useState(false)%3B%0A%20%20const%20toggleSwitch%20%3D%20()%20%3D%3E%20setIsEnabled(previousState%20%3D%3E%20!previousState)%3B%0A%0A%20%20return%20(%0A%20%20%20%20%3CView%20style%3D%7Bstyles.container%7D%3E%0A%20%20%20%20%20%20%3CSwitch%0A%20%20%20%20%20%20%20%20trackColor%3D%7B%7B%20false%3A%20%22%23767577%22%2C%20true%3A%20%22%2381b0ff%22%20%7D%7D%0A%20%20%20%20%20%20%20%20thumbColor%3D%7BisEnabled%20%3F%20%22%23f5dd4b%22%20%3A%20%22%23f4f3f4%22%7D%0A%20%20%20%20%20%20%20%20ios_backgroundColor%3D%22%233e3e3e%22%0A%20%20%20%20%20%20%20%20onValueChange%3D%7BtoggleSwitch%7D%0A%20%20%20%20%20%20%20%20value%3D%7BisEnabled%7D%0A%20%20%20%20%20%20%2F%3E%0A%20%20%20%20%3C%2FView%3E%0A%20%20)%3B%0A%7D%0A%0Aconst%20styles%20%3D%20StyleSheet.create(%7B%0A%20%20container%3A%20%7B%0A%20%20%20%20flex%3A%201%2C%0A%20%20%20%20alignItems%3A%20%22center%22%2C%0A%20%20%20%20justifyContent%3A%20%22center%22%0A%20%20%7D%0A%7D)%3B%0A"
         data-snack-platform="web"
         data-snack-supported-platforms=ios,android,web
         data-snack-preview="true"