## class: `WyNotificationListItem`, `wy-notification-list-item`

Notification list item used in lists or standalone toasts.

**Used sub components:**

*   [`<wy-avatar>`](./ui/wy-avatar)
*   [`<wy-item>`](./ui/wy-item)
*   [`<wy-button>`](./ui/wy-button)
*   [`<wy-icon>`](./ui/wy-icon)

### Fields

| Name             | Type               | Default | Description                                               | Inherited From |
| ---------------- | ------------------ | ------- | --------------------------------------------------------- | -------------- |
| `notificationId` | `number`           |         | Identifier of the notification being rendered.            |                |
| `selected`       | `boolean`          | `false` | Highlight the item when it matches the current selection. |                |
| `standalone`     | `boolean`          | `false` | Render as a standalone toast (enables dismiss actions).   |                |
| `notification`   | `NotificationType` |         | Notification data shown in the item.                      |                |

### Methods

| Name        | Description                                          | Parameters | Return                       | Inherited From    |
| ----------- | ---------------------------------------------------- | ---------- | ---------------------------- | ----------------- |
| `whenReady` | Resolves when the component has rendered first time. |            | `Promise<WeavySubComponent>` | WeavySubComponent |

### Events

| Name     | Type                          | Description                                              | Inherited From    |
| -------- | ----------------------------- | -------------------------------------------------------- | ----------------- |
| `select` | `NotificationSelectEventType` | Emitted when the notification is selected.               |                   |
| `mark`   | `NotificationMarkEventType`   | Emitted when the notification is marked read/unread.     |                   |
| `hide`   | `NotificationHideEventType`   | Emitted when a standalone notification should be hidden. |                   |
| `close`  | `NotificationCloseEventType`  | Emitted when a standalone notification should be closed. |                   |
| `ready`  | `CustomEvent`                 | When the component has rendered.                         | WeavySubComponent |

### Attributes

| Name             | Field          | Inherited From |
| ---------------- | -------------- | -------------- |
| `notificationId` | notificationId |                |
| `selected`       | selected       |                |
| `standalone`     | standalone     |                |

### CSS Parts

| Name                   | Description                  |
| ---------------------- | ---------------------------- |
| `wy-notification`      | Root notification container. |
| `wy-notification-text` | Notification text.           |
| `wy-meta`              | Meta/time area.              |
| `wy-quote`             | Quoted notification text.    |

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

### Fields

| Name                | Privacy | Type                                                  | Default                                                              | Description | Inherited From    |
| ------------------- | ------- | ----------------------------------------------------- | -------------------------------------------------------------------- | ----------- | ----------------- |
| `#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`                        | `WyNotificationListItem`    | WyNotificationListItem | lib/components/wy-notification-list-item.ts |         |
| `custom-element-definition` | `wy-notification-list-item` | WyNotificationListItem | lib/components/wy-notification-list-item.ts |         |
