# Widget Types

The Returning.AI app generates embed codes for each widget type. The `data-widget-id` attribute determines what widget loads - you just copy the embed code from the app.

## How It Works

Every embed script uses the same `widget-loader.js` script. The `data-widget-id` tells the loader which widget to render, and `data-widget-type="custom"` combined with `data-widget-url` points to the widget endpoint.

`embed-widget.html`

```html
<script
  src="https://prod-widgets.returning.ai/widget-loader.js"
  data-widget-id="YOUR_WIDGET_ID"
  data-widget-type="custom"
  data-container="returning-ai-widget-YOUR_WIDGET_ID"
  data-customer-id="CUST-10482"
  data-theme="dark"
  data-width="100%"
  data-height="100%"
  data-api-url="https://prod-widgets.returning.ai"
  data-widget-url="https://prod-widgets.returning.ai/custom-widget"
  data-auto-refresh="true"
  data-debug="false"
></script>
```

## Key Attributes

| Attribute | Description |
| --- | --- |
| data-widget-id | Unique ID from the app. Determines which widget loads. |
| data-widget-type | Set to `custom` for all widgets. |
| data-container | Target DOM element ID. Pattern: `returning-ai-widget-{WIDGET_ID}` |
| data-widget-url | Widget endpoint URL. Generated by the app. |
| data-theme | `dark` or `light` |
| data-auto-refresh | Enable automatic widget refresh. Boolean. |
| data-debug | Enable debug logging in the browser console. Boolean. |

> Embed code is generated by the app
>
> You don't need to manually construct these attributes. The Returning.AI app's custom widget generator produces the complete embed code with the correct `data-widget-id`, `data-widget-url`, and other attributes pre-filled. Just copy and paste.

## Available Widget Categories

The following widget categories are available in the Returning.AI app. Each generates a unique embed code with the appropriate `data-widget-id`.

### Milestones

Progress trackers showing achievement stages and unlock rewards. Display user journey through trading volume or activity milestones.

### Socials

Social media task boards where users complete platform-specific engagement tasks for loyalty rewards.

### Store

Rewards marketplace where users browse and redeem loyalty currency for products, vouchers, and experiences.

### Channel

Community hub with missions, quests, social tasks, and engagement activities.

### Currency

Loyalty points display showing balance, transaction history, and earning opportunities.

### Referral

Referral program widgets for invite links, referral rewards, and user sharing.

### Custom

Bespoke widgets built in the Returning.AI custom widget generator. The generated embed code identifies the widget, so every category above ships through the same loader.

> All widget types support attribute authentication via `data-*` attributes. See the [Auth - Attribute](https://docs.returning.ai/embed-script/auth-attribute.md) guide for details. For server-verified identity, use the [Widget SDK with Access Key Embed](https://docs.returning.ai/widget-sdk/auth-access-key.md).

All widgets should use `data-width="100%"` and be placed inside a container that controls the max width. The widget content is responsive and will adapt to the available space.