## class: `WyMessage`, `wy-message`

Displays a single message in a conversation.

**Used sub components:**

*   [`<wy-avatar>`](./ui/wy-avatar)
*   [`<wy-item>`](./ui/wy-item)
*   [`<wy-icon>`](./ui/wy-icon)
*   [`<wy-button>`](./ui/wy-button)
*   [`<wy-dropdown>`](./ui/wy-dropdown)
*   [`<wy-skeleton>`](./ui/wy-skeleton)
*   [`<wy-attachment-list>`](./wy-attachment)
*   [`<wy-annotation>`](./wy-annotation)
*   [`<wy-annotation-list>`](./wy-annotation)
*   [`<wy-embed>`](./wy-embed)
*   [`<wy-image-grid>`](./ui/wy-image-grid)
*   [`<wy-meeting-card>`](./wy-meeting-card)
*   [`<wy-poll>`](./wy-poll)
*   [`<wy-reactions>`](./wy-reactions)
*   [`<wy-preview>`](./wy-preview)

### Fields

| Name            | Type                            | Default | Description                                                     | Inherited From        |
| --------------- | ------------------------------- | ------- | --------------------------------------------------------------- | --------------------- |
| `conversation`  | `AppType \| undefined`          |         | App context owning the message.                                 |                       |
| `messageId`     | `number`                        |         | Unique identifier for the rendered message.                     |                       |
| `author`        | `UserOrAgentType`               |         | The author of the message.                                      |                       |
| `me`            |                                 |         | True when the message was authored by the current user.         |                       |
| `isPrivateChat` | `boolean`                       | `false` | Render the message using private-conversation layout.           |                       |
| `createdAt`     | `string`                        | `""`    | ISO timestamp when the message was created.                     |                       |
| `html`          | `string`                        | `""`    | HTML formatted message content.                                 |                       |
| `text`          | `string`                        | `""`    | Plain-text message content.                                     |                       |
| `annotations`   | `FileType[] \| undefined`       | `[]`    | Annotation files attached to the message.                       |                       |
| `attachments`   | `FileType[] \| undefined`       | `[]`    | Attachment files associated with the message.                   |                       |
| `meeting`       | `MeetingType \| undefined`      |         | Meeting information attached to the message.                    |                       |
| `pollOptions`   | `PollOptionType[] \| undefined` | `[]`    | Poll options available on the message.                          |                       |
| `embed`         | `EmbedType \| undefined`        |         | Embed metadata attached to the message.                         |                       |
| `reactions`     | `ReactableType[] \| undefined`  | `[]`    | Reactions applied to the message.                               |                       |
| `seenBy`        | `MemberDetailType[]`            | `[]`    | Members who have seen the message.                              |                       |
| `highlight`     | `boolean`                       | `false` | Highlight the message bubble when true.                         |                       |
| `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        |
| ----------- | ---------------------------------------------------- | ---------- | ---------------------------- | --------------------- |
| `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    |
| ------------------ | ------------------------- | ------------------------------------------------- | ----------------- |
| `vote`             | `PollVoteEventType`       | Emitted when a poll option is voted.              |                   |
| `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 |
| --------------- | ------------- | -------------- |
| `messageId`     | messageId     |                |
| `author`        | author        |                |
| `isPrivateChat` | isPrivateChat |                |
| `createdAt`     | createdAt     |                |
| `html`          | html          |                |
| `text`          | text          |                |
| `annotations`   | annotations   |                |
| `attachments`   | attachments   |                |
| `pollOptions`   | pollOptions   |                |
| `reactions`     | reactions     |                |
| `seenBy`        | seenBy        |                |
| `highlight`     | highlight     |                |

### CSS Parts

| Name                        | Description                                                    |
| --------------------------- | -------------------------------------------------------------- |
| `wy-message`                | Root message container.                                        |
| `wy-message-me`             | Modifier for messages from the current user.                   |
| `wy-message-agent`          | Modifier for agent messages.                                   |
| `wy-highlight`              | Modifier used when a message is highlighted.                   |
| `wy-message-author`         | Author/avatar area.                                            |
| `wy-message-content`        | Content wrapper.                                               |
| `wy-message-meta`           | Meta area (name/time).                                         |
| `wy-message-bubble`         | Message bubble.                                                |
| `wy-message-bubble-emoji`   | Bubble modifier for emoji-only messages.                       |
| `wy-message-bubble-section` | Sections inside the bubble (images, attachments, annotations). |
| `wy-content`                | HTML/text content area.                                        |
| `wy-content-emoji`          | Content modifier for emoji-only content.                       |
| `wy-message-seenby`         | Seen-by avatars area.                                          |
| `wy-annotations`            | Wrapper for annotation buttons (from wy-annotation-list).      |
| `wy-annotation`             | Annotation button (from wy-annotation).                        |
| `wy-annotation-icon`        | Icon inside an annotation button.                              |
| `wy-annotation-text`        | Text inside an annotation button.                              |

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

### Fields

| Name                        | Privacy   | Type                                                               | Default                                                                               | Description | Inherited From        |
| --------------------------- | --------- | ------------------------------------------------------------------ | ------------------------------------------------------------------------------------- | ----------- | --------------------- |
| `exportParts`               | protected |                                                                    | `new ShadowPartsController(this)`                                                     |             |                       |
| `dispatchUserAction`        | private   |                                                                    |                                                                                       |             |                       |
| `#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     |

</details>

<hr/>

## Exports

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