From f67e217ea6575f85d86f72701d7841317136a905 Mon Sep 17 00:00:00 2001
From: Jared Palmer <jared@palmer.net>
Date: Tue, 28 Jan 2020 16:47:30 -0500
Subject: [PATCH] Add Radio Group example

---
 examples/radio-group/README.md    |  1 +
 examples/radio-group/index.js     | 39 +++++++++++++++++++++++++++++++
 examples/radio-group/package.json | 17 ++++++++++++++
 3 files changed, 57 insertions(+)
 create mode 100644 examples/radio-group/README.md
 create mode 100644 examples/radio-group/index.js
 create mode 100644 examples/radio-group/package.json

diff --git a/examples/radio-group/README.md b/examples/radio-group/README.md
new file mode 100644
index 000000000..bd588c709
--- /dev/null
+++ b/examples/radio-group/README.md
@@ -0,0 +1 @@
+# Formik Radio Group Example
diff --git a/examples/radio-group/index.js b/examples/radio-group/index.js
new file mode 100644
index 000000000..e9e6eec03
--- /dev/null
+++ b/examples/radio-group/index.js
@@ -0,0 +1,39 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import { Formik, Field, Form } from 'formik';
+
+const Example = () => (
+  <div>
+    <h1>Sign Up</h1>
+    <Formik
+      initialValues={{
+        picked: '',
+      }}
+      onSubmit={async values => {
+        await new Promise(r => setTimeout(r, 500));
+        alert(JSON.stringify(values, null, 2));
+      }}
+    >
+      {({ values }) => (
+        <Form>
+          <div id="my-radio-group">Picked</div>
+          <div role="group" aria-labeledby="my-radio-group">
+            <label>
+              <Field type="radio" name="picked" value="One" />
+              One
+            </label>
+            <label>
+              <Field type="radio" name="picked" value="Two" />
+              Two
+            </label>
+            <div>Picked: {values.picked}</div>
+          </div>
+
+          <button type="submit">Submit</button>
+        </Form>
+      )}
+    </Formik>
+  </div>
+);
+
+ReactDOM.render(<Example />, document.getElementById('root'));
diff --git a/examples/radio-group/package.json b/examples/radio-group/package.json
new file mode 100644
index 000000000..d1cb926a5
--- /dev/null
+++ b/examples/radio-group/package.json
@@ -0,0 +1,17 @@
+{
+  "name": "formik-example-radio-group",
+  "version": "0.1.0",
+  "description": "This example demonstrates how to create a radio group with Formik",
+  "main": "index.js",
+  "dependencies": {
+    "react": "^16.12.0",
+    "react-dom": "^16.12.0",
+    "react-scripts": "3.3.0",
+    "formik": "latest"
+  },
+  "prettier": {
+    "trailingComma": "es5",
+    "singleQuote": true,
+    "semi": true
+  }
+}