Skip to content

Instantly share code, notes, and snippets.

@thiagobutignon
Created January 15, 2020 02:08
Show Gist options
  • Save thiagobutignon/e1dcf33d85b1f5af277fa7723e0012c8 to your computer and use it in GitHub Desktop.
Save thiagobutignon/e1dcf33d85b1f5af277fa7723e0012c8 to your computer and use it in GitHub Desktop.
Debug Formik
import React from "react";
import { FormikConsumer } from "formik";
export const Debug = () => (
<div
style={{
margin: "3rem 0",
borderRadius: 4,
background: "#f6f8fa",
boxShadow: "0 0 1px #eee inset"
}}
>
<div
style={{
textTransform: "uppercase",
fontSize: 11,
borderTopLeftRadius: 4,
borderTopRightRadius: 4,
fontWeight: 500,
padding: ".5rem",
background: "#555",
color: "#fff",
letterSpacing: "1px"
}}
>
Formik State
</div>
<FormikConsumer>
{({ validationSchema, validate, onSubmit, ...rest }) => (
<pre
style={{
fontSize: ".65rem",
padding: ".25rem .5rem",
overflowX: "scroll"
}}
>
{JSON.stringify(rest, null, 2)}
</pre>
)}
</FormikConsumer>
</div>
);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment