[
  {
    "path": ".gitignore",
    "content": "# Logs\nlogs\n*.log\n\n# Runtime data\npids\n*.pid\n*.seed\n\n# Directory for instrumented libs generated by jscoverage/JSCover\nlib-cov\n\n# Coverage directory used by tools like istanbul\ncoverage\n\n# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)\n.grunt\n\n# node-waf configuration\n.lock-wscript\n\n# Compiled binary addons (http://nodejs.org/api/addons.html)\nbuild/Release\n\n# Dependency directory\n# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git\nnode_modules\n.gatsby-context.js\n.sass-cache/\npublic/\n.cache/\n.DS_Store\n\n# Environment variables\n.env.development\n"
  },
  {
    "path": ".travis.yml",
    "content": "# back to language cpp to try to bypass osx node failure\nlanguage: cpp\nsudo: false\nenv:\n  - export NODE_VERSION=\"0.12\"\n  - export NODE_VERSION=\"4\"\n  - export NODE_VERSION=\"5\"\nos:\n  - linux\n  - osx\n# pre-install to bring in the correct version of node via nvm\nbefore_install:\n  - git submodule update --init --recursive\n  - git clone https://github.com/creationix/nvm.git ./.nvm\n  - source ./.nvm/nvm.sh\n  - nvm install $NODE_VERSION\n  - nvm use $NODE_VERSION\n  - npm config set python `which python`\n  - if [ $TRAVIS_OS_NAME == \"linux\" ]; then\n      export CC=\"gcc-4.8\";\n      export CXX=\"g++-4.8\";\n      export LINK=\"gcc-4.8\";\n      export LINKXX=\"g++-4.8\";\n    fi\n  - gcc --version\n  - g++ --version\n# node 4 depends on gcc 4.8\naddons:\n  apt:\n    sources:\n    - ubuntu-toolchain-r-test\n    packages:\n    - g++-4.8\n    - gcc-4.8\n# script needed to test, because defaults don't work on osx\nscript:\n  - npm install\n  - npm run lint\n"
  },
  {
    "path": "LICENSE",
    "content": "The MIT License (MIT)\n\nCopyright (c) 2015 gatsbyjs\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n\n"
  },
  {
    "path": "README.md",
    "content": "# Integrating Netlify Form Handling in Gatsby\n\nExample for integrating a basic contact form with Netlify’s form handling feature (based on the [default Gatsby starter](https://github.com/gatsbyjs/gatsby-starter-default))\n\nDemo: https://gatsby-form-example.netlify.com\n\n## Deploy\n\n[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/imorente/gatsby-netlify-form-example)\n\n## reCAPTCHA\n\nThis example site uses [react-google-recaptcha](https://github.com/dozoisch/react-google-recaptcha) to render the reCAPTCHA widget.\n\nTo make the reCAPTCHA example work in your own copy of this site, you’ll need to do the following:\n1. [Sign up for a reCAPTCHA API key pair](http://www.google.com/recaptcha/admin) for your site.\n2. [Log in to your Netlify account](https://app.netlify.com), and add the following\nenvironment variables to your site’s Settings > Build & deploy > Build environment variables:\n  - `SITE_RECAPTCHA_KEY` with your reCAPTCHA site key.\n  - `SITE_RECAPTCHA_SECRET` with your reCAPTCHA secret key.\n\n**Important**: the environment variables need to be called `SITE_RECAPTCHA_KEY` and `SITE_RECAPTCHA_SECRET` for the Netlify backend to find them. If you add a `GATSBY_` prefix to the variable names, the Netlify backend won't recognize them, the reCAPTCHA verification will fail, and your form submissions won't be stored.\n\n3. Change the build command for your site to\n```\necho SITE_RECAPTCHA_KEY=$SITE_RECAPTCHA_KEY >> .env.production && gatsby build\n```\nThis will make the SITE_RECAPTCHA_KEY available to the Gatsby build in production.\n\nTo see the reCAPTCHA widget locally, add `SITE_RECAPTCHA_KEY=your-reCAPTCHA-API-site-key`\nto your local [.env.development](https://www.gatsbyjs.org/docs/environment-variables/) file.\n\n## Troubleshooting\n\n### Forms stop working after upgrading to Gatsby v2\nThis can be caused by the offline-plugin. [Workaround](https://github.com/gatsbyjs/gatsby/issues/7997#issuecomment-419749232) is to use `?no-cache=1` in the POST url to prevent the service worker from handling form submissions (Thanks to [@phmu_office](https://twitter.com/phmu_office/status/1047810173417472000) for the heads up ✨)\n"
  },
  {
    "path": "gatsby-config.js",
    "content": "\nmodule.exports = {\n  siteMetadata: {\n    title: `Gatsby Netlify Form Integration`\n  },\n  plugins: [`gatsby-plugin-react-helmet`]\n};\n"
  },
  {
    "path": "package.json",
    "content": "{\n  \"name\": \"gatsby-starter-default\",\n  \"description\": \"Gatsby default starter\",\n  \"version\": \"1.0.0\",\n  \"author\": \"Kyle Mathews <mathews.kyle@gmail.com>\",\n  \"dependencies\": {\n    \"gatsby\": \"^1.9.261\",\n    \"gatsby-link\": \"^1.0.1\",\n    \"gatsby-plugin-react-helmet\": \"^1.0.1\",\n    \"react-async-script\": \"^0.9.1\",\n    \"react-google-recaptcha\": \"^0.11.1\"\n  },\n  \"devDependencies\": {\n    \"dotenv\": \"^5.0.1\",\n    \"gh-pages\": \"^0.12.0\"\n  },\n  \"keywords\": [\n    \"gatsby\"\n  ],\n  \"license\": \"MIT\",\n  \"main\": \"n/a\",\n  \"scripts\": {\n    \"build\": \"gatsby build\",\n    \"deploy\": \"gatsby build --prefix-paths && gh-pages -d public\",\n    \"develop\": \"gatsby develop\",\n    \"format\": \"prettier --trailing-comma es5 --no-semi --single-quote --write \\\"pages/*.js\\\" \\\"utils/*.js\\\" \\\"wrappers/*.js\\\" \\\"html.js\\\"\",\n    \"test\": \"echo \\\"Error: no test specified\\\" && exit 1\"\n  }\n}\n"
  },
  {
    "path": "src/css/typography.css",
    "content": "html {\n  font-family: sans-serif;\n  -ms-text-size-adjust: 100%;\n  -webkit-text-size-adjust: 100%;\n}\nbody {\n  margin: 0;\n}\narticle,\naside,\ndetails,\nfigcaption,\nfigure,\nfooter,\nheader,\nmain,\nmenu,\nnav,\nsection,\nsummary {\n  display: block;\n}\naudio,\ncanvas,\nprogress,\nvideo {\n  display: inline-block;\n}\naudio:not([controls]) {\n  display: none;\n  height: 0;\n}\nprogress {\n  vertical-align: baseline;\n}\n[hidden],\ntemplate {\n  display: none;\n}\na {\n  background-color: transparent;\n  -webkit-text-decoration-skip: objects;\n}\na:active,\na:hover {\n  outline-width: 0;\n}\nabbr[title] {\n  border-bottom: none;\n  text-decoration: underline;\n  text-decoration: underline dotted;\n}\nb,\nstrong {\n  font-weight: inherit;\n  font-weight: bolder;\n}\ndfn {\n  font-style: italic;\n}\nh1 {\n  font-size: 2em;\n  margin: .67em 0;\n}\nmark {\n  background-color: #ff0;\n  color: #000;\n}\nsmall {\n  font-size: 80%;\n}\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\nsub {\n  bottom: -.25em;\n}\nsup {\n  top: -.5em;\n}\nimg {\n  border-style: none;\n}\nsvg:not(:root) {\n  overflow: hidden;\n}\ncode,\nkbd,\npre,\nsamp {\n  font-family: monospace, monospace;\n  font-size: 1em;\n}\nfigure {\n  margin: 1em 40px;\n}\nhr {\n  box-sizing: content-box;\n  height: 0;\n  overflow: visible;\n}\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font: inherit;\n  margin: 0;\n}\noptgroup {\n  font-weight: 700;\n}\nbutton,\ninput {\n  overflow: visible;\n}\nbutton,\nselect {\n  text-transform: none;\n}\n[type=reset],\n[type=submit],\nbutton,\nhtml [type=button] {\n  -webkit-appearance: button;\n}\n[type=button]::-moz-focus-inner,\n[type=reset]::-moz-focus-inner,\n[type=submit]::-moz-focus-inner,\nbutton::-moz-focus-inner {\n  border-style: none;\n  padding: 0;\n}\n[type=button]:-moz-focusring,\n[type=reset]:-moz-focusring,\n[type=submit]:-moz-focusring,\nbutton:-moz-focusring {\n  outline: 1px dotted ButtonText;\n}\nfieldset {\n  border: 1px solid silver;\n  margin: 0 2px;\n  padding: .35em .625em .75em;\n}\nlegend {\n  box-sizing: border-box;\n  color: inherit;\n  display: table;\n  max-width: 100%;\n  padding: 0;\n  white-space: normal;\n}\ntextarea {\n  overflow: auto;\n}\n[type=checkbox],\n[type=radio] {\n  box-sizing: border-box;\n  padding: 0;\n}\n[type=number]::-webkit-inner-spin-button,\n[type=number]::-webkit-outer-spin-button {\n  height: auto;\n}\n[type=search] {\n  -webkit-appearance: textfield;\n  outline-offset: -2px;\n}\n[type=search]::-webkit-search-cancel-button,\n[type=search]::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n::-webkit-input-placeholder {\n  color: inherit;\n  opacity: .54;\n}\n::-webkit-file-upload-button {\n  -webkit-appearance: button;\n  font: inherit;\n}\nhtml {\n  font: 112.5%/1.45em georgia, serif;\n  box-sizing: border-box;\n  overflow-y: scroll;\n}\n* {\n  box-sizing: inherit;\n}\n*:before {\n  box-sizing: inherit;\n}\n*:after {\n  box-sizing: inherit;\n}\nbody {\n  color: hsla(0, 0%, 0%, 0.8);\n  font-family: georgia, serif;\n  font-weight: normal;\n  word-wrap: break-word;\n  font-kerning: normal;\n  -moz-font-feature-settings: \"kern\", \"liga\", \"clig\", \"calt\";\n  -ms-font-feature-settings: \"kern\", \"liga\", \"clig\", \"calt\";\n  -webkit-font-feature-settings: \"kern\", \"liga\", \"clig\", \"calt\";\n  font-feature-settings: \"kern\", \"liga\", \"clig\", \"calt\";\n}\nimg {\n  max-width: 100%;\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n}\nh1 {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n  color: inherit;\n  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,\n    Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;\n  font-weight: bold;\n  text-rendering: optimizeLegibility;\n  font-size: 2.25rem;\n  line-height: 2.9rem;\n}\nh2 {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n  color: inherit;\n  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,\n    Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;\n  font-weight: bold;\n  text-rendering: optimizeLegibility;\n  font-size: 1.62671rem;\n  line-height: 2.175rem;\n}\nh3 {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n  color: inherit;\n  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,\n    Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;\n  font-weight: bold;\n  text-rendering: optimizeLegibility;\n  font-size: 1.38316rem;\n  line-height: 2.175rem;\n}\nh4 {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n  color: inherit;\n  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,\n    Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;\n  font-weight: bold;\n  text-rendering: optimizeLegibility;\n  font-size: 1rem;\n  line-height: 1.45rem;\n}\nh5 {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n  color: inherit;\n  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,\n    Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;\n  font-weight: bold;\n  text-rendering: optimizeLegibility;\n  font-size: 0.85028rem;\n  line-height: 1.45rem;\n}\nh6 {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n  color: inherit;\n  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,\n    Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;\n  font-weight: bold;\n  text-rendering: optimizeLegibility;\n  font-size: 0.78405rem;\n  line-height: 1.45rem;\n}\nhgroup {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n}\nul {\n  margin-left: 1.45rem;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n  list-style-position: outside;\n  list-style-image: none;\n}\nol {\n  margin-left: 1.45rem;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n  list-style-position: outside;\n  list-style-image: none;\n}\ndl {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n}\ndd {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n}\np {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n}\nfigure {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n}\npre {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n  font-size: 0.85rem;\n  line-height: 1.42;\n  background: hsla(0, 0%, 0%, 0.04);\n  border-radius: 3px;\n  overflow: auto;\n  word-wrap: normal;\n  padding: 1.45rem;\n}\ntable {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n  font-size: 1rem;\n  line-height: 1.45rem;\n  border-collapse: collapse;\n  width: 100%;\n}\nfieldset {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n}\nblockquote {\n  margin-left: 1.45rem;\n  margin-right: 1.45rem;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n}\nform {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n}\nnoscript {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n}\niframe {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n}\nhr {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: calc(1.45rem - 1px);\n  background: hsla(0, 0%, 0%, 0.2);\n  border: none;\n  height: 1px;\n}\naddress {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  padding-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  margin-bottom: 1.45rem;\n}\nb {\n  font-weight: bold;\n}\nstrong {\n  font-weight: bold;\n}\ndt {\n  font-weight: bold;\n}\nth {\n  font-weight: bold;\n}\nli {\n  margin-bottom: calc(1.45rem / 2);\n}\nol li {\n  padding-left: 0;\n}\nul li {\n  padding-left: 0;\n}\nli > ol {\n  margin-left: 1.45rem;\n  margin-bottom: calc(1.45rem / 2);\n  margin-top: calc(1.45rem / 2);\n}\nli > ul {\n  margin-left: 1.45rem;\n  margin-bottom: calc(1.45rem / 2);\n  margin-top: calc(1.45rem / 2);\n}\nblockquote *:last-child {\n  margin-bottom: 0;\n}\nli *:last-child {\n  margin-bottom: 0;\n}\np *:last-child {\n  margin-bottom: 0;\n}\nli > p {\n  margin-bottom: calc(1.45rem / 2);\n}\ncode {\n  font-size: 0.85rem;\n  line-height: 1.45rem;\n}\nkbd {\n  font-size: 0.85rem;\n  line-height: 1.45rem;\n}\nsamp {\n  font-size: 0.85rem;\n  line-height: 1.45rem;\n}\nabbr {\n  border-bottom: 1px dotted hsla(0, 0%, 0%, 0.5);\n  cursor: help;\n}\nacronym {\n  border-bottom: 1px dotted hsla(0, 0%, 0%, 0.5);\n  cursor: help;\n}\nabbr[title] {\n  border-bottom: 1px dotted hsla(0, 0%, 0%, 0.5);\n  cursor: help;\n  text-decoration: none;\n}\nthead {\n  text-align: left;\n}\ntd,\nth {\n  text-align: left;\n  border-bottom: 1px solid hsla(0, 0%, 0%, 0.12);\n  font-feature-settings: \"tnum\";\n  -moz-font-feature-settings: \"tnum\";\n  -ms-font-feature-settings: \"tnum\";\n  -webkit-font-feature-settings: \"tnum\";\n  padding-left: 0.96667rem;\n  padding-right: 0.96667rem;\n  padding-top: 0.725rem;\n  padding-bottom: calc(0.725rem - 1px);\n}\nth:first-child,\ntd:first-child {\n  padding-left: 0;\n}\nth:last-child,\ntd:last-child {\n  padding-right: 0;\n}\ntt,\ncode {\n  background-color: hsla(0, 0%, 0%, 0.04);\n  border-radius: 3px;\n  font-family: \"SFMono-Regular\", Consolas, \"Roboto Mono\", \"Droid Sans Mono\",\n    \"Liberation Mono\", Menlo, Courier, monospace;\n  padding: 0;\n  padding-top: 0.2em;\n  padding-bottom: 0.2em;\n}\npre code {\n  background: none;\n  line-height: 1.42;\n}\ncode:before,\ncode:after,\ntt:before,\ntt:after {\n  letter-spacing: -0.2em;\n  content: \" \";\n}\npre code:before,\npre code:after,\npre tt:before,\npre tt:after {\n  content: \"\";\n}\n@media only screen and (max-width: 480px) {\n  html {\n    font-size: 100%;\n  }\n}\n"
  },
  {
    "path": "src/html.js",
    "content": "import React from \"react\"\nimport PropTypes from \"prop-types\"\n\nconst BUILD_TIME = new Date().getTime()\n\nexport default class HTML extends React.Component {\n  static propTypes = {\n    body: PropTypes.string,\n  }\n\n  render() {\n    let css\n    if (process.env.NODE_ENV === \"production\") {\n      css = (\n        <style\n          dangerouslySetInnerHTML={{\n            __html: require(\"!raw!../public/styles.css\"),\n          }}\n        />\n      )\n    }\n\n    return (\n      <html lang=\"en\">\n        <head>\n          <meta charSet=\"utf-8\" />\n          <meta httpEquiv=\"X-UA-Compatible\" content=\"IE=edge\" />\n          <meta\n            name=\"viewport\"\n            content=\"width=device-width, initial-scale=1.0\"\n          />\n          {this.props.headComponents}\n          {css}\n        </head>\n        <body>\n          <div\n            id=\"___gatsby\"\n            dangerouslySetInnerHTML={{ __html: this.props.body }}\n          />\n          {this.props.postBodyComponents}\n        </body>\n      </html>\n    )\n  }\n}\n"
  },
  {
    "path": "src/layouts/index.js",
    "content": "import React from \"react\"\nimport PropTypes from \"prop-types\"\nimport Link from \"gatsby-link\"\nimport Helmet from \"react-helmet\"\n\nimport \"../css/typography.css\"\n\nexport default class Template extends React.Component {\n  static propTypes = {\n    children: PropTypes.func,\n  }\n\n  render() {\n    return (\n      <div>\n        <Helmet\n          title=\"Gatsby Default Starter\"\n          meta={[\n            { name: \"description\", content: \"Sample\" },\n            { name: \"keywords\", content: \"sample, something\" },\n          ]}\n        />\n        <div\n          style={{\n            background: `rebeccapurple`,\n            marginBottom: `1.45rem`,\n          }}\n        >\n          <div\n            style={{\n              margin: `0 auto`,\n              maxWidth: 960,\n              padding: `1.45rem 1.0875rem`,\n            }}\n          >\n            <h1 style={{ margin: 0 }}>\n              <Link\n                to=\"/\"\n                style={{\n                  color: \"white\",\n                  textDecoration: \"none\",\n                }}\n              >\n                Gatsby\n              </Link>\n            </h1>\n          </div>\n        </div>\n        <div\n          style={{\n            margin: `0 auto`,\n            maxWidth: 960,\n            padding: `0px 1.0875rem 1.45rem`,\n            paddingTop: 0,\n          }}\n        >\n          {this.props.children()}\n        </div>\n      </div>\n    )\n  }\n}\n"
  },
  {
    "path": "src/pages/404.js",
    "content": "import React from \"react\"\n\nexport default () =>\n  <div>\n    <h1>NOT FOUND</h1>\n    <p>You just hit a route that doesn't exist... the sadness.</p>\n  </div>\n"
  },
  {
    "path": "src/pages/contact.js",
    "content": "import React from \"react\";\nimport { navigateTo } from \"gatsby-link\";\n\nfunction encode(data) {\n  return Object.keys(data)\n    .map(key => encodeURIComponent(key) + \"=\" + encodeURIComponent(data[key]))\n    .join(\"&\");\n}\n\nexport default class Contact extends React.Component {\n  constructor(props) {\n    super(props);\n    this.state = {};\n  }\n\n  handleChange = e => {\n    this.setState({ [e.target.name]: e.target.value });\n  };\n\n  handleSubmit = e => {\n    e.preventDefault();\n    const form = e.target;\n    fetch(\"/\", {\n      method: \"POST\",\n      headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" },\n      body: encode({\n        \"form-name\": form.getAttribute(\"name\"),\n        ...this.state\n      })\n    })\n      .then(() => navigateTo(form.getAttribute(\"action\")))\n      .catch(error => alert(error));\n  };\n\n  render() {\n    return (\n      <div>\n        <h1>Contact</h1>\n        <form\n          name=\"contact\"\n          method=\"post\"\n          action=\"/thanks/\"\n          data-netlify=\"true\"\n          data-netlify-honeypot=\"bot-field\"\n          onSubmit={this.handleSubmit}\n        >\n          {/* The `form-name` hidden field is required to support form submissions without JavaScript */}\n          <input type=\"hidden\" name=\"form-name\" value=\"contact\" />\n          <p hidden>\n            <label>\n              Don’t fill this out:{\" \"}\n              <input name=\"bot-field\" onChange={this.handleChange} />\n            </label>\n          </p>\n          <p>\n            <label>\n              Your name:<br />\n              <input type=\"text\" name=\"name\" onChange={this.handleChange} />\n            </label>\n          </p>\n          <p>\n            <label>\n              Your email:<br />\n              <input type=\"email\" name=\"email\" onChange={this.handleChange} />\n            </label>\n          </p>\n          <p>\n            <label>\n              Message:<br />\n              <textarea name=\"message\" onChange={this.handleChange} />\n            </label>\n          </p>\n          <p>\n            <button type=\"submit\">Send</button>\n          </p>\n        </form>\n      </div>\n    );\n  }\n}\n"
  },
  {
    "path": "src/pages/file-upload.js",
    "content": "import React from \"react\";\nimport Link from \"gatsby-link\";\nimport Helmet from \"react-helmet\";\nimport { navigateTo } from \"gatsby-link\";\n\nfunction encode(data) {\n  const formData = new FormData();\n\n  for (const key of Object.keys(data)) {\n    formData.append(key, data[key]);\n  }\n\n  return formData;\n}\n\nexport default class Contact extends React.Component {\n  constructor(props) {\n    super(props);\n    this.state = {};\n  }\n\n  handleChange = e => {\n    this.setState({ [e.target.name]: e.target.value });\n  };\n\n  handleAttachment = e => {\n    this.setState({ [e.target.name]: e.target.files[0] });\n  };\n\n  handleSubmit = e => {\n    e.preventDefault();\n    const form = e.target;\n    fetch(\"/\", {\n      method: \"POST\",\n      body: encode({\n        \"form-name\": form.getAttribute(\"name\"),\n        ...this.state\n      })\n    })\n      .then(() => navigateTo(form.getAttribute(\"action\")))\n      .catch(error => alert(error));\n  };\n\n  render() {\n    return (\n      <div>\n        <h1>File Upload</h1>\n        <form\n          name=\"file-upload\"\n          method=\"post\"\n          action=\"/thanks/\"\n          data-netlify=\"true\"\n          data-netlify-honeypot=\"bot-field\"\n          onSubmit={this.handleSubmit}\n        >\n          {/* The `form-name` hidden field is required to support form submissions without JavaScript */}\n          <input type=\"hidden\" name=\"form-name\" value=\"file-upload\" />\n          <p hidden>\n            <label>\n              Don’t fill this out:{\" \"}\n              <input name=\"bot-field\" onChange={this.handleChange} />\n            </label>\n          </p>\n          <p>\n            <label>\n              Your name:<br />\n              <input type=\"text\" name=\"name\" onChange={this.handleChange} />\n            </label>\n          </p>\n          <p>\n            <label>\n              File:<br />\n              <input\n                type=\"file\"\n                name=\"attachment\"\n                onChange={this.handleAttachment}\n              />\n            </label>\n          </p>\n          <p>\n            <button type=\"submit\">Send</button>\n          </p>\n        </form>\n      </div>\n    );\n  }\n}\n"
  },
  {
    "path": "src/pages/index.js",
    "content": "import React from \"react\";\nimport Link from \"gatsby-link\";\nimport Helmet from \"react-helmet\";\n\nexport default class Index extends React.Component {\n  render() {\n    return (\n      <div>\n        <h1>Hi people</h1>\n        <p>\n          This is an example site integrating Netlify’s form handling with Gatsby\n        </p>\n        <ul>\n          <li><Link to=\"/contact/\">Basic contact form</Link></li>\n          <li><Link to=\"/file-upload/\">Form with file upload</Link></li>\n          <li><Link to=\"/recaptcha/\">Form with reCAPTCHA 2</Link></li>\n        </ul>\n      </div>\n    );\n  }\n}\n"
  },
  {
    "path": "src/pages/recaptcha.js",
    "content": "import React from \"react\";\nimport { navigateTo } from \"gatsby-link\";\nimport Recaptcha from \"react-google-recaptcha\";\n\nconst RECAPTCHA_KEY = process.env.SITE_RECAPTCHA_KEY;\n\nfunction encode(data) {\n  return Object.keys(data)\n    .map(key => encodeURIComponent(key) + \"=\" + encodeURIComponent(data[key]))\n    .join(\"&\");\n}\n\nexport default class Contact extends React.Component {\n  constructor(props) {\n    super(props);\n    this.state = {};\n  }\n\n  handleChange = e => {\n    this.setState({ [e.target.name]: e.target.value });\n  };\n\n  handleRecaptcha = value => {\n    this.setState({ \"g-recaptcha-response\": value });\n  };\n\n  handleSubmit = e => {\n    e.preventDefault();\n    const form = e.target;\n    fetch(\"/\", {\n      method: \"POST\",\n      headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" },\n      body: encode({\n        \"form-name\": form.getAttribute(\"name\"),\n        ...this.state\n      })\n    })\n      .then(() => navigateTo(form.getAttribute(\"action\")))\n      .catch(error => alert(error));\n  };\n\n  render() {\n    return (\n      <div>\n        <h1>reCAPTCHA 2</h1>\n        <form\n          name=\"contact-recaptcha\"\n          method=\"post\"\n          action=\"/thanks/\"\n          data-netlify=\"true\"\n          data-netlify-recaptcha=\"true\"\n          onSubmit={this.handleSubmit}\n        >\n          <noscript>\n            <p>This form won’t work with Javascript disabled</p>\n          </noscript>\n          <p>\n            <label>\n              Your name:<br />\n              <input type=\"text\" name=\"name\" onChange={this.handleChange} />\n            </label>\n          </p>\n          <p>\n            <label>\n              Your email:<br />\n              <input type=\"email\" name=\"email\" onChange={this.handleChange} />\n            </label>\n          </p>\n          <p>\n            <label>\n              Message:<br />\n              <textarea name=\"message\" onChange={this.handleChange} />\n            </label>\n          </p>\n          <Recaptcha\n            ref=\"recaptcha\"\n            sitekey={RECAPTCHA_KEY}\n            onChange={this.handleRecaptcha}\n          />\n          <p>\n            <button type=\"submit\">Send</button>\n          </p>\n        </form>\n      </div>\n    );\n  }\n}\n"
  },
  {
    "path": "src/pages/thanks.js",
    "content": "import React from \"react\";\n\nexport default () => (\n  <div>\n    <h1>Thank you!</h1>\n    <p>This is a custom thank you page for form submissions</p>\n  </div>\n);\n"
  }
]