## class: `WyConversation`, `wy-conversation`

Displays a single conversation with a message editor and an optional start avatar.

**Used sub components**

*   [`<wy-avatar>`](./ui/wy-avatar)
*   [`<wy-avatar-header>`](./ui/wy-avatar)
*   [`<wy-avatar-group>`](./ui/wy-avatar)
*   [`<wy-button>`](./ui/wy-button)
*   [`<wy-dropdown>`](./ui/wy-dropdown)
*   [`<wy-empty>`](./wy-empty)
*   [`<wy-editor-message>`](./wy-editor-message)
*   [`<wy-icon>`](./ui/wy-icon)
*   [`<wy-item>`](./ui/wy-item)
*   [`<wy-message>`](./wy-message)
*   [`<wy-message-typing>`](./wy-message-typing)
*   [`<wy-progress-circular>`](./ui/wy-progress-circular)
*   [`<wy-skeleton>`](./ui/wy-skeleton)

### Fields

| Name                | Type                       | Default | Description                                                           | Inherited From        |
| ------------------- | -------------------------- | ------- | --------------------------------------------------------------------- | --------------------- |
| `conversation`      | `AppType \| undefined`     |         | Conversation object provided to the component (overrides AppContext). |                       |
| `conversationId`    | `number \| undefined`      |         | Id of the conversation to load and display.                           |                       |
| `editMessage`       | `MessageType \| undefined` |         | Any Message to edit                                                   |                       |
| `header`            | `boolean`                  | `false` | Whether to render the header area for the conversation.               |                       |
| `agentInstructions` | `string \| undefined`      |         | Optional instructions passed to an AI agent for the conversation.     |                       |
| `placeholder`       | `string \| undefined`      |         | Placeholder text for the message editor.                              |                       |
| `app`               | `AppType \| undefined`     |         | The app data.                                                         | WeavySubAppComponent  |
| `apps`              | `AppListType \| undefined` |         | Multiple apps data.                                                   | WeavySubAppComponent  |
| `link`              | `LinkType \| undefined`    |         | Any provided link that should be loaded, shown and highlighted.       | WeavySubTypeComponent |

### Methods

| Name                       | Description                                          | Parameters              | Return                       | Inherited From        |
| -------------------------- | ---------------------------------------------------- | ----------------------- | ---------------------------- | --------------------- |
| `isPrivateChat`            |                                                      | `conversation: AppType` |                              |                       |
| `isChatRoom`               |                                                      | `conversation: AppType` |                              |                       |
| `renderConversationHeader` |                                                      |                         |                              |                       |
| `renderMessages`           |                                                      |                         |                              |                       |
| `whenApp`                  | Resolves when app data is available.                 |                         | `Promise<AppType>`           | WeavySubAppComponent  |
| `whenApps`                 | Resolves when multiple app data is available.        |                         | `Promise<AppListType>`       | WeavySubAppComponent  |
| `whenLink`                 | Resolves when a provided link is available.          |                         | `Promise<LinkType>`          | WeavySubTypeComponent |
| `whenReady`                | Resolves when the component has rendered first time. |                         | `Promise<WeavySubComponent>` | WeavySubComponent     |

### Events

| Name               | Type                      | Description                                       | Inherited From    |
| ------------------ | ------------------------- | ------------------------------------------------- | ----------------- |
| `wy-action`        | `WyActionEventType`       | Emitted when an embed action button is triggered. |                   |
| `wy-preview-open`  | `WyPreviewOpenEventType`  | Fired when a preview overlay is about to open.    |                   |
| `wy-preview-close` | `WyPreviewCloseEventType` | Fired when a preview overlay is closed.           |                   |
| `ready`            | `CustomEvent`             | When the component has rendered.                  | WeavySubComponent |

### Attributes

| Name                | Field             | Inherited From |
| ------------------- | ----------------- | -------------- |
| `conversationId`    | conversationId    |                |
| `header`            | header            |                |
| `agentInstructions` | agentInstructions |                |
| `placeholder`       | placeholder       |                |

### CSS Parts

| Name                        | Description                                         |
| --------------------------- | --------------------------------------------------- |
| `wy-pager`                  | Pager for message infinite scroll.                  |
| `wy-pager-top`              | Pager styling for top placement.                    |
| `wy-messages`               | Wrapper for the conversation messages.              |
| `wy-pane`                   | Pane for the empty state.                           |
| `wy-footerbar`              | The footerbar where the editor is placed.           |
| `wy-footerbar-sticky`       | Styles for making the footerbar sticky.             |
| `wy-footerbar-floating`     | Styles for making the footerbar floating.           |
| `wy-messages`               | Wrapper for the messages list.                      |
| `wy-message-date-separator` | Date separator shown between message days.          |
| `wy-banner`                 | Unread marker toast wrapper.                        |
| `wy-banner-action`          | Modifier part for the unread marker action.         |
| `wy-fade`                   | Modifier part used when fading the unread marker.   |
| `wy-show`                   | Modifier part used when the unread marker is shown. |

### Slots

| Name        | Description                 |
| ----------- | --------------------------- |
| `empty`     | Content in the empty state. |
| `footerbar` | Content in the footerbar.   |

<details><summary>Private API</summary>

### Fields

| Name                        | Privacy | Type                                                               | Default                                                                               | Description | Inherited From        |
| --------------------------- | ------- | ------------------------------------------------------------------ | ------------------------------------------------------------------------------------- | ----------- | --------------------- |
| `#resolveApp`               | private | `(app: AppType) => void \| undefined`                              |                                                                                       |             | WeavySubAppComponent  |
| `#whenApp`                  | private |                                                                    | `new Promise<AppType>((r) => { this.#resolveApp = r; })`                              |             | WeavySubAppComponent  |
| `#resolveApps`              | private | `(apps: AppListType) => void \| undefined`                         |                                                                                       |             | WeavySubAppComponent  |
| `#whenApps`                 | private |                                                                    | `new Promise<AppListType>((r) => { this.#resolveApps = r; })`                         |             | WeavySubAppComponent  |
| `#resolveContextDataBlobs`  | private | `(blobs: ContextDataBlobsType) => void \| undefined`               |                                                                                       |             | WeavySubTypeComponent |
| `#whenContextDataBlobs`     | private |                                                                    | `new Promise<ContextDataBlobsType>((r) => { this.#resolveContextDataBlobs = r; })`    |             | WeavySubTypeComponent |
| `#resolveComponentFeatures` | private | `(componentFeatures: ComponentFeaturePolicy) => void \| undefined` |                                                                                       |             | WeavySubTypeComponent |
| `#whenComponentFeatures`    | private |                                                                    | `new Promise<ComponentFeaturePolicy>((r) => { this.#resolveComponentFeatures = r; })` |             | WeavySubTypeComponent |
| `#resolveLink`              | private | `(link: LinkType) => void \| undefined`                            |                                                                                       |             | WeavySubTypeComponent |
| `#whenLink`                 | private |                                                                    | `new Promise<LinkType>((r) => { this.#resolveLink = r; })`                            |             | WeavySubTypeComponent |
| `#resolveSettings`          | private | `(settings: WeavyComponentSettingsType) => void \| undefined`      |                                                                                       |             | WeavySubTypeComponent |
| `#whenSettings`             | private |                                                                    | `new Promise<WeavyComponentSettingsType>((r) => { this.#resolveSettings = r; })`      |             | WeavySubTypeComponent |
| `#resolveContextId`         | private | `(contextId: ContextIdType) => void \| undefined`                  |                                                                                       |             | WeavySubComponent     |
| `#whenContextId`            | private |                                                                    | `new Promise<ContextIdType>((r) => { this.#resolveContextId = r; })`                  |             | WeavySubComponent     |
| `#resolveUser`              | private | `(user: UserType) => void \| undefined`                            |                                                                                       |             | WeavySubComponent     |
| `#whenUser`                 | private |                                                                    | `new Promise<UserType>((r) => { this.#resolveUser = r; })`                            |             | WeavySubComponent     |
| `#resolveWeavy`             | private | `(weavy: WeavyType) => void \| undefined`                          |                                                                                       |             | WeavySubComponent     |
| `#whenWeavy`                | private |                                                                    | `new Promise<WeavyType>((r) => { this.#resolveWeavy = r; })`                          |             | WeavySubComponent     |
| `#resolveReady`             | private | `(component: WeavySubComponent) => void \| undefined`              |                                                                                       |             | WeavySubComponent     |
| `#whenReady`                | private |                                                                    | `new Promise<WeavySubComponent>((r) => { this.#resolveReady = r; })`                  |             | WeavySubComponent     |

### Methods

| Name             | Privacy   | Description | Parameters        | Return | Inherited From |
| ---------------- | --------- | ----------- | ----------------- | ------ | -------------- |
| `handleEditLast` | protected |             | `_e: CustomEvent` |        |                |

</details>

<hr/>

## Exports

| Kind                        | Name              | Declaration    | Module                            | Package |
| --------------------------- | ----------------- | -------------- | --------------------------------- | ------- |
| `js`                        | `WyConversation`  | WyConversation | lib/components/wy-conversation.ts |         |
| `custom-element-definition` | `wy-conversation` | WyConversation | lib/components/wy-conversation.ts |         |
