[Fix, Add] Fix New props import pattern, Added New components

injectLatestProps.js

@@ -12,7 +12,9 @@ exec(
     console.log(`stderr: ${stderr}`);
   }
 );
-exec("cp -r ./react-native-elements/website/docs/props ./src/content/Props"),
+exec(
+  "cp -r ./react-native-elements/website/docs/main/props ./src/content/Props"
+),
   (err, stdout, stderr) => {
     if (err) {
       // node couldn't execute the command

src/containers/Navigation/index.jsx

@@ -38,6 +38,7 @@ import CheckBox from "../../content/CheckBox";
 import BottomSheet from "../../content/BottomSheet";
 import ButtonGroup from "../../content/ButtonGroup";
 import Divider from "../../content/Divider";
+import SwitchComponent from "../../content/Switch";
 
 export const Components_Index = [
   {
@@ -151,6 +152,11 @@ export const Components_Index = [
     component: SocialIcon,
     path: "/social-icon",
   },
+  {
+    name: "Switch",
+    component: SwitchComponent,
+    path: "/switch",
+  },
   {
     name: "Text",
     component: Text,

src/content/AirbnbRating/index.jsx

@@ -3,7 +3,7 @@ import { importMDX } from "mdx.macro";
 
 import PropDrawer from "../../components/PropDrawer";
 
-import Playground from "./searchbar.playground.jsx";
+import Playground from "./airbnbrating.playground.jsx";
 const Content = lazy(() => importMDX("../Props/rating.md"));
 
 export default function AirbnbPlayground() {

src/content/Divider/divider.playground.jsx

@@ -1,16 +1,54 @@
 import * as React from "react";
-import { Divider } from "react-native-elements";
+import { Divider, useTheme } from "react-native-elements";
 
 import Playground from "../../components/playground";
 import { useView, PropTypes } from "react-view";
 
 const DividerPlayground = () => {
+  const { theme } = useTheme();
   const params = useView({
     componentName: "Divider",
     props: {
       style: {
         type: PropTypes.Object,
         value: `{width:"80%",margin:20}`,
+        description: "Apply style to the divider.",
+      },
+      color: {
+        type: PropTypes.String,
+        value: theme.colors.primary,
+        description: "Apply color to the divider.",
+      },
+      inset: {
+        type: PropTypes.Boolean,
+        value: false,
+        description: "Applies inset to the divider if true. Default is left.",
+      },
+      insetType: {
+        type: PropTypes.String,
+        value: "left",
+        description:
+          "Add inset to the divider in left, right, or in both direction. Choose among left, right, or middle.",
+      },
+      subHeader: {
+        type: PropTypes.String,
+        value: "React native elements",
+        description: "Adds a sub-header next to divider.",
+      },
+      subHeaderStyle: {
+        type: PropTypes.Object,
+        value: `{}`,
+        description: "Adds styles to the sub header of divider.",
+      },
+      width: {
+        type: PropTypes.Number,
+        value: 1,
+        description: "Add width to the divider.",
+      },
+      orientation: {
+        type: PropTypes.String,
+        value: "horizontal",
+        description: "Adds orientation to the divider.",
       },
     },
     scope: {

src/content/Switch/index.jsx

@@ -0,0 +1,19 @@
+import React, { lazy, Suspense } from "react";
+import { importMDX } from "mdx.macro";
+
+import PropDrawer from "../../components/PropDrawer";
+import Playground from "./switch.playground.jsx";
+const Content = lazy(() => importMDX("../Props/switch.md"));
+
+export default function SwitchPlayground() {
+  return (
+    <div>
+      <Playground />
+      <Suspense fallback={<div>Loading...</div>}>
+        <PropDrawer>
+          <Content />
+        </PropDrawer>
+      </Suspense>
+    </div>
+  );
+}

src/content/Switch/switch.playground.jsx

@@ -0,0 +1,49 @@
+import * as React from "react";
+import { Switch, useTheme } from "react-native-elements";
+import Playground from "../../components/playground";
+import { useView, PropTypes } from "react-view";
+
+const SwitchPlayground = () => {
+  const { theme } = useTheme();
+  const params = useView({
+    componentName: "Switch",
+    props: {
+      color: {
+        value: theme.colors.primary,
+        type: PropTypes.String,
+        description: "Color",
+      },
+      value: {
+        value: false,
+        type: PropTypes.Boolean,
+        description: "Value",
+        stateful: true,
+      },
+      onValueChange: {
+        value: "() => setValue(!value)",
+        propHook: {
+          what: "!value",
+          into: "value",
+        },
+        type: PropTypes.Function,
+        description: "Function called when switch state is changed.",
+      },
+    },
+    scope: {
+      Switch,
+    },
+    imports: {
+      "react-native-elements": {
+        named: ["Switch"],
+      },
+    },
+  });
+
+  return (
+    <React.Fragment>
+      <Playground params={params} />
+    </React.Fragment>
+  );
+};
+
+export default SwitchPlayground;

src/content/Text/index.jsx

@@ -2,7 +2,7 @@ import React, { lazy, Suspense } from "react";
 import { importMDX } from "mdx.macro";
 
 import PropDrawer from "../../components/PropDrawer";
-import Playground from "./tooltip.playground.jsx";
+import Playground from "./text.playground.jsx";
 
 const Content = lazy(() => importMDX("../Props/text.md"));