chitru

/* 
How to use:
m for margin: m-1, m-2, m-3, m-4, m-5
ml for margin-left: ml-1, ml-2, ml-3, ml-4, ml-5
mr from margin-right: mr-1, mr-2, mr-3, mr-4, mr-5
mt for margin-top: mt-1, mt-2, mt-3, mt-4, mt-5
mb for margin-bottom: mb-1, mb-2, mb-3, mb-4, mb-5
p for padding: p-1, p-2, p-3, p-4, p-5
pl for padding-left: pl-1, pl-2, pl-3, pl-4, pl-5
pr for padding-right: pr-1, pr-2, pr-3, pr-4, pr-5

chitru

import React from "react";

const states = [
  ["NSW", "New South Wales"],
  ["VIC", "Victoria"],
  ["WA", "Western Australia"]
];

const StateDrop = ({ label, ...others }) => (
  <>

chitru

import React from "react";

const states = [
  ["NSW", "New South Wales"],
  ["VIC", "Victoria"],
  ["WA", "Western Australia"]
];

const StateDrop = ({ label, ...others }) => (
  <>

chitru

import React from "react";

const ItemForm = ({ label, children, type = "text", ...otherProps }) => (
  <div>
    {type === "text" ? (
      <>
        <label>{label}</label>
        <input type={type} {...otherProps} />
      </>
    ) : (

chitru

import React from "react";
const Submit = ({ navigation }) => {
  const { go } = navigation;
  return (
    <div>
      <h3>Thank you for submitting. We will be in touch</h3>
      New Form -> <button onClick={() => go("names")}>New</button>
    </div>
  );
};

chitru

import React from "react";

const Review = ({ setForm, formData, navigation }) => {
  const {
    firstName,
    lastName,
    nickName,
    address,
    city,
    state,

chitru

import React from "react";

import ItemForm from "./ItemForm";

const Contact = ({ setForm, formData, navigation }) => {
  const { phone, email } = formData;

  const { previous, next } = navigation;

  return (

chitru

import React from "react";

import ItemForm from "./ItemForm";
import StateDrop from "./StateDrop";

const Address = ({ setForm, formData, navigation }) => {
  const { address, city, state, zip } = formData;

  const { previous, next } = navigation;

chitru

import React from "react";

import ItemForm from "./ItemForm";
import StateDrop from "./StateDrop";

const Address = ({ setForm, formData, navigation }) => {
  const { address, city, state, zip } = formData;

  const { previous, next } = navigation;

chitru

import React from "react";

import ItemForm from "./ItemForm";

const Names = ({ setForm, formData, navigation }) => {
  const { firstName, lastName, nickName } = formData;

  const { next } = navigation;

  return (