> ## Documentation Index
> Fetch the complete documentation index at: https://docs.clickterm.com/llms.txt
> Use this file to discover all available pages before exploring further.

# ClicktermDialog

> API reference for the ClicktermDialog class — controls the clickwrap consent dialog UI.

`ClicktermDialog` controls the clickwrap consent dialog shown to end users. It provides methods to show a clickwrap for acceptance and to display previously accepted content.

## Access

```javascript theme={null}
const { ClicktermDialog } = window.Clickterm;
```

## Methods

### show

Displays a clickwrap dialog to the end user. If the user has already accepted the latest effective major version, the promise resolves immediately without showing the dialog.

```javascript theme={null}
ClicktermDialog.show(options, config?)
```

**Parameters:**

| Parameter | Type           | Required | Description                      |
| --------- | -------------- | -------- | -------------------------------- |
| `options` | `ShowOptions`  | Yes      | Dialog options (see below)       |
| `config`  | `DialogConfig` | No       | Dialog configuration (see below) |

**ShowOptions:**

| Field                  | Type     | Required | Description                                                                                              |
| ---------------------- | -------- | -------- | -------------------------------------------------------------------------------------------------------- |
| `endUserId`            | `string` | Yes      | Your identifier for the end user (max 256 chars)                                                         |
| `clickwrapTemplateId`  | `string` | Yes      | Template ID from the ClickTerm dashboard                                                                 |
| `templatePlaceholders` | `object` | No       | Structured [placeholder](/dev/guides/placeholders) object with standard fields plus `customPlaceholders` |
| `language`             | `string` | No       | Language code (e.g., `"en"`, `"de"`). Falls back to the configured default                               |

**DialogConfig:**

| Field          | Type      | Default | Description                                                |
| -------------- | --------- | ------- | ---------------------------------------------------------- |
| `disableClose` | `boolean` | `false` | Prevent the user from closing the dialog without accepting |

**Returns:** `Promise<ShowResult>`

The result object contains the Signature that should be sent to your backend for [verification](/dev/guides/verifying-signature).

**Example:**

```javascript theme={null}
ClicktermDialog.show({
  endUserId: "user-123",
  clickwrapTemplateId: "YOUR_TEMPLATE_ID",
  templatePlaceholders: {
    fullName: "Alice Example",
    email: "alice@example.com",
    company: "Acme Corp",
    customPlaceholders: {
      region: "EMEA",
    },
  },
  language: "en",
}, {
  disableClose: true,
}).then((result) => {
  // Send result.clicktermSignature (the Signature) to your backend
  console.log("Signature:", result.clicktermSignature);
}).catch((error) => {
  console.error("Error:", error);
});
```

<Info>
  Requests to show a clickwrap are **not** counted toward billing. Only the
  verification step (`POST /clickwrap/verify`) is billed.
</Info>

***

### showAcceptedContent

Displays the previously accepted clickwrap content to the user. Use this when you want to let users review what they agreed to.

```javascript theme={null}
ClicktermDialog.showAcceptedContent(options)
```

**Parameters:**

| Field                 | Type     | Required | Description             |
| --------------------- | -------- | -------- | ----------------------- |
| `endUserId`           | `string` | Yes      | The end user identifier |
| `clickwrapTemplateId` | `string` | Yes      | Template ID             |

**Returns:** `Promise<AcceptedContentResult>`

**Example:**

```javascript theme={null}
ClicktermDialog.showAcceptedContent({
  endUserId: "user-123",
  clickwrapTemplateId: "YOUR_TEMPLATE_ID",
}).then((result) => {
  console.log("Accepted content:", result);
}).catch((error) => {
  console.error("Error:", error);
});
```

<Note>
  The accepted content dialog only appears if the user has an accepted and verified event.
</Note>