/** * @license * Copyright (c) 2021 - 2026 Vaadin Ltd. * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/ */ import { ElementMixin } from '@vaadin/component-base/src/element-mixin.js'; import { SlotStylesMixin } from '@vaadin/component-base/src/slot-styles-mixin.js'; import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js'; import { type MessageListAttachmentClickEvent, MessageListMixin } from './vaadin-message-list-mixin.js'; export { MessageAttachment, MessageAttachmentClickEvent, MessageListAttachmentClickEvent, MessageListItem, } from './vaadin-message-list-mixin.js'; export type MessageListEventMap = HTMLElementEventMap & { 'attachment-click': MessageListAttachmentClickEvent; }; /** * `` is a Web Component for showing an ordered list of messages. The messages are rendered as * * ### Example * * To create a new message list, add the component to the page: * * ```html * * ``` * * Provide the messages to the message list with the [`items`](#/elements/vaadin-message-list#property-items) property. * * ```js * document.querySelector('vaadin-message-list').items = [ * { text: 'Hello list', time: 'yesterday', userName: 'Matt Mambo', userAbbr: 'MM', userColorIndex: 1 }, * { text: 'Another message', time: 'right now', userName: 'Linsey Listy', userAbbr: 'LL', userColorIndex: 2, userImg: '/static/img/avatar.jpg' } * ]; * ``` * * ### Styling * * The following shadow DOM parts are available for styling: * * Part name | Description * ----------|---------------- * `list` | The container wrapping messages. * * See the [``](#/elements/vaadin-message) documentation for the available * state attributes and stylable shadow parts of message elements. * * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation. * * @fires {CustomEvent} attachment-click - Fired when an attachment is clicked. */ declare class MessageList extends SlotStylesMixin(MessageListMixin(ThemableMixin(ElementMixin(HTMLElement)))) { addEventListener( type: K, listener: (this: MessageList, ev: MessageListEventMap[K]) => void, options?: AddEventListenerOptions | boolean, ): void; removeEventListener( type: K, listener: (this: MessageList, ev: MessageListEventMap[K]) => void, options?: EventListenerOptions | boolean, ): void; } declare global { interface HTMLElementTagNameMap { 'vaadin-message-list': MessageList; } } export { MessageList };