pittica/gatsby-plugin-recaptcha

License Version Release GitHub package.json dependency version (dev dep on branch)

Description

ReCaptcha component for GatsbyJS.

This plugin has been developed using GatsbyJS tutorials.

Install

npm

npm install @pittica/gatsby-plugin-recaptcha

Usage

Import the component classes.

import ReCaptcha from "@pittica/gatsby-plugin-recaptcha"

Use the component in React functions.

import React, { useState } from "react"

export default function ContactPage() {
  const [submitted, setSubmitted] = useState(false)

  const submit = (token) => {}

  return (
    <div>
      <ReCaptcha
        action="homepage"
        siteKey="RECAPTCHA_PUBLIC_KEY"
        onVerify={(token) => submit(token)}
        submitted={submitted}
      />
      <button onClick={() => setSubmitted(true)}>Submit</button>
    </div>
  )
}

Attributes

The components has some attributes.

siteKey

  • Type: string
  • Required: yes

ReCaptcha public key.

action

  • Type: string
  • Required: yes
  • Default value: homepage

ReCaptcha action. Common values are homepage or login.

id

  • Type: string
  • Required: no

HTML ID for multiple ReCaptcha elements.

badge

  • Type: string
  • Required: no
  • Values: bottomright, bottomleft, inline
  • Default value: inline

Badge position and aspect.

size

  • Type: string
  • Required: no
  • Values: compact, normal, invisible
  • Default value: invisible

Badge size.

callback

  • Type: function
  • Required: no

Validation callback.

theme

  • Type: string
  • Required: no
  • Values: light, dark
  • Default value: light

(c) 2020-2021, Pittaca S.r.l.s.