Tecton

Altare's CAPTCHA library.

Install

npm install @altare/tecton

Usage

import { CaptchaProvider, SmartCaptcha } from '@altare/tecton'
import 'tecton/style.css'

export default function Example() {
  return (
    <CaptchaProvider>
      <SmartCaptcha variant="text" onSuccess={(proof) => console.log(proof)} />
    </CaptchaProvider>
  )
}

The slider is the only variant.

Server-side verification

Tecton issues a proof using HMAC-SHA256. Provide a server secret and verify on your backend.

Client:

<TextCaptcha secret={process.env.NEXT_PUBLIC_TECTON_PUBLIC || 'dev'} onSuccess={sendProof} />

Server (Node):

import { createHmac } from 'crypto'

function verify(secret: string, message: string, signatureHex: string) {
  const h = createHmac('sha256', secret)
  h.update(message)
  return h.digest('hex') === signatureHex
}

Theming

Wrap with CaptchaProvider and pass CSS variable overrides.

<CaptchaProvider theme={{ radius: '0.75rem', colors: { primary: '14 165 233' } }}>
  <SmartCaptcha />
</CaptchaProvider>

License

MIT