introduce jsx files

components/wizard/contact.jsx

@@ -0,0 +1,85 @@
+import React, { useContext } from 'react'
+import { WizardContext } from './context/wizardStore'
+import Required from './required'
+
+export default function Contact() {
+  const { state, onChangeEvent } = useContext(WizardContext)
+
+  const { name, email, street, zip, city } = state.formData
+
+  return (
+    <>
+      <div className="fsw">
+        <div className="fs">
+          <label className="flabel">
+            Name <Required />
+          </label>
+          <input
+            type="text"
+            name="name"
+            value={name}
+            onChange={onChangeEvent}
+            required
+            className="input-text"
+          />
+        </div>
+      </div>
+      <div className="fsw">
+        <div className="fs">
+          <label className="flabel">
+            E-Mail <Required />
+          </label>
+          <input
+            type="email"
+            name="email"
+            value={email}
+            onChange={onChangeEvent}
+            required
+            className="input-text"
+          />
+        </div>
+      </div>
+      <div className="fsw">
+        <div className="fs">
+          <label className="flabel">
+            Straße <Required />
+          </label>
+          <input
+            type="text"
+            name="street"
+            value={street}
+            onChange={onChangeEvent}
+            required
+            className="input-text"
+          />
+        </div>
+      </div>
+      <div className="fsw">
+        <div className="fs">
+          <label className="flabel">
+            PLZ <Required />
+          </label>
+          <input
+            type="text"
+            name="zip"
+            value={zip}
+            onChange={onChangeEvent}
+            required
+            className="input-text"
+          />
+          <label className="flabel">
+            Stadt <Required />
+          </label>
+          <input
+            type="text"
+            name="city"
+            value={city}
+            onChange={onChangeEvent}
+            required
+            className="input-text"
+          />
+        </div>
+      </div>
+    </>
+  )
+}