# Bubbles

Bubble blocks display content to the user — text, images, video, audio, embedded iframes, and structured cards. They have no user inputs; they only produce output in the conversation.

---

## Text

Displays a text message to the user. Supports rich text formatting, including bold, italic, lists, and links via the inline editor.

**How to use**

Drag **Text** onto the canvas, type your message in the content field, and connect it to the previous block in the group.

**Configuration**

The content field supports plain text and rich text (HTML and markdown-style formatting via the toolbar). Use `{{variable}}` syntax to insert variable values inline.

---

## Image

Displays an image in the conversation.

**How to use**

Drag **Image** onto the canvas and provide an image URL or upload a file. Optionally configure a click-through link.

**Configuration**

| Field | Description |
| --- | --- |
| URL | Direct URL to the image file. |
| Click Link URL | Optional URL the user is taken to when they click the image. |
| Alt text | Accessibility label for the image. |

---

## Video

Embeds a video player in the conversation. Supports YouTube, Vimeo, and direct video file URLs.

**How to use**

Drag **Video** onto the canvas and provide the video URL.

**Configuration**

| Field | Description |
| --- | --- |
| URL | Video URL (YouTube, Vimeo, or direct file URL). |
| Height | Player height in pixels. |
| Aspect Ratio | Aspect ratio for responsive sizing. |
| Max Width | Maximum player width. |
| Query Params | Additional query parameters appended to the video URL (e.g., autoplay settings). |

---

## Embed

Embeds an iframe (PDF, website, or other HTML-embeddable content) in the conversation.

**How to use**

Drag **Embed** onto the canvas and provide the embed URL or HTML snippet.

**Configuration**

| Field | Description |
| --- | --- |
| URL | URL or embed code to display in the iframe. |
| Height | Frame height in pixels. |
| Wait for Event | When enabled, the flow pauses until the embedded content fires a specific browser event. |
| Event Name | The event name to listen for (used when **Wait for Event** is enabled). |
| Save Data in Variable | Variable to store the event payload when **Wait for Event** fires. |

---

## Audio

Plays an audio file in the conversation.

**How to use**

Drag **Audio** onto the canvas and provide the audio URL.

**Configuration**

| Field | Description |
| --- | --- |
| URL | Direct URL to the audio file. |
| Autoplay | When enabled, the audio starts playing automatically when the block is reached. |

---

## Adaptive Card

Renders a structured Adaptive Card layout (Microsoft Adaptive Cards format) in the conversation.

**How to use**

Drag **Adaptive Card** onto the canvas and paste or write the card JSON in the content field.

**Configuration**

| Field | Description |
| --- | --- |
| Card JSON | The Adaptive Card JSON schema defining the card layout. |
| Card Title | Optional title displayed above the card. |
| Card Version | Adaptive Card schema version (e.g., `1.5`). |
| Fallback Text | Text shown in clients that do not support Adaptive Cards. |
| Variable | Variable to store the user’s response if the card contains interactive elements. |
