# Deflect SDK (Client-side)

![npm](https://img.shields.io/npm/v/@deflectbot/deflect-sdk)
![downloads](https://img.shields.io/npm/dm/@deflectbot/deflect-sdk)

[Deflect](https://deflect.bot) is an advanced antibot engine that protects your site from bots on any scale.

## Usage

See the [documentation](https://docs.deflect.bot/) for how to use this SDK with the Deflect APIs.

## Installation

#### yarn

```bash
yarn add @deflectbot/deflect-sdk
```

#### npm

```bash
npm install --save @deflectbot/deflect-sdk
```

#### CDN

Use `@deflect-sdk@latest` to always use the latest version, or specify a version with `@deflect-sdk@x.x.x`.

```html
<script src="https://cdn.jsdelivr.net/npm/@deflectbot/deflect-sdk@latest/dist/index.min.js"></script>
```

## Usage (instance-based)

The SDK uses clients so you can create multiple independent configs (one per actionId) to be called anytime.

```ts
import Deflect, { DeflectConfig } from "@deflectbot/deflect-sdk";

const client = Deflect.createClient({
  actionId: "<ACTION_ID>",
  // optional
  prefetch: true, // default
});

const token = await client.getToken();
```

### Multiple clients on the same page

```ts
const loginClient = Deflect.createClient({ actionId: "x898649/Et5d4gibx2DBQ9PG5XVPzt/740576841" });
const signupClient = Deflect.createClient({ actionId: "x898649/Et5dzgibx2DBQ9PG5VPzt/740576841" });

const loginToken = await loginClient.getToken();
const signupToken = await signupClient.getToken();
```

### Form helper with an instance

```html
<form action="/login" method="POST" onsubmit="return loginClient.injectToken(event)">
  <input name="username" />
  <input name="password" type="password" />
  <button type="submit">Login</button>
</form>

<script type="module">
  import Deflect from "https://cdn.jsdelivr.net/npm/@deflectbot/deflect-sdk@latest/dist/index.esm.js";
  const loginClient = Deflect.createClient({ actionId: "login" });
  window.loginClient = loginClient;
</script>
```

`injectToken(event)` fetches a token, injects it as a hidden `deflect_token` input, and submits the form.
