> This page is for Afterpay Online Developer, version Main (default).
> For other versions, use one of these documentation indexes:
> - Main (default): https://developers.afterpay.com/afterpay-online-developer/main/llms.txt
> - v1: https://developers.afterpay.com/afterpay-online-developer/v-1/llms.txt
> - Chinese: https://developers.afterpay.com/afterpay-online-developer/chinese/llms.txt

> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://developers.afterpay.com/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://developers.afterpay.com/_mcp/server.

# Afterpay.js Glossary

## Constants

| `<CONSTANT_NAME>`      | Values                                                                                    |
| ---------------------- | ----------------------------------------------------------------------------------------- |
| `currency`             | `AUD`, `CAD` ,`GBP`, `NZD`, `USD`, `EUR`                                                  |
| `locale`               | `EN_AU`, `EN_CA`, `EN_GB`, `EN_NZ`, `EN_US`, `IT_IT`, `FR_FR`, `ES_ES`                    |
| `logoType`             | `BADGE`, `LOCKUP`                                                                         |
| `modalLinkStyle`       | `CIRCLED_INFO_ICON`, `LEARN_MORE_TEXT`, `MORE_INFO_TEXT`, `CIRCLED_QUESTION_ICON`, `NONE` |
| `placementTypes`       | `PRICE_TABLE`                                                                             |
| `size`                 | `XS`, `SM`, `MD`, `LG`                                                                    |
| `mobileViewLayout`     | `FOUR_BY_ONE`, `TWO_BY_TWO`                                                               |
| `theme.`**badge**      | `BLACK_ON_MINT`, `BLACK_ON_WHITE`, `MINT_ON_BLACK`, `WHITE_ON_BLACK`                      |
| `theme.`**lockup**     | `BLACK`, `WHITE`, `MINT`                                                                  |
| `theme.`**modal**      | `WHITE`                                                                                   |
| `theme.`**priceTable** | `BLACK`, `WHITE`                                                                          |

### Using Afterpay Constants

Constants are exposed to the window via the Afterpay object Afterpay.\<constant_name>.

See some examples below:

```javascript
console.log(Afterpay.locale.EN_US) //  "en_US" 
console.log(Afterpay.theme.lockup) //  "{"BLACK":"black","WHITE":"white","MINT":"mint"}"
console.log(Afterpay.theme.lockup.BLACK) //  "black"
```

## Functions

| Name                  | Description                                                                    |
| --------------------- | ------------------------------------------------------------------------------ |
| `createPlacements`    | Adds one or more placements to the page using the `targetSelector` attribute.  |
| `launchModal`         | Dynamically open the Clearpay Modal.                                           |
| `ready`               | Custom Window Event dispatched when `Afterpay.js` is successfully initialized. |
| `modalRenderComplete` | Custom Window Event dispatched when the `<afterpay-modal>` finishes rendering. |

## Window Events

| Name                  | Description                                                                    |
| --------------------- | ------------------------------------------------------------------------------ |
| `ready`               | Custom Window Event dispatched when `Afterpay.js` is successfully initialized. |
| `modalRenderComplete` | Custom Window Event dispatched when the `<afterpay-modal>` finishes rendering  |