// #region Imports
import { html } from '../../../../Dom/Html';
import { when } from '../../../Directives/Directives';
// #endregion
/**
 * The template of the {@link ChatElement}.
 *
 * @public
 */
export function chatElementTemplate(e) {
    return html `
        <slot name="header"></slot>
        <div part="messagesWrapper">
            <div part="messages">
                <slot name="message"
                      @slotchange="${(x) => e.onSlotChange(x)}"></slot>
                ${when(e.scrollToEnd, () => html `
                <mosaik-back-top .to="${'bottom'}"></mosaik-back-top>
                `)}
            </div>
        </div>
        <div part="footer">
            <mosaik-chat-input part="chat-input"
                               .dir="${e.dir}"
                               .reactions="${e.reactions}"
                               .variant="${e.variant}"
                               .placeholder="${e.intl.inputPlaceholder}"
                               .allowAttachments="${e.allowAttachments}"
                               @submitted="${(x) => e.onSubmited(x)}"></mosaik-chat-input>
        </div>

        <!-- <div class="chat-container layout-column layout-fill">
            <easy-list #PART_listElement
                        class="flex"
                        [selectionMode]="'none'"
                        [emptyState]="{ isEnabled: false }"
                        (itemsChanged)="this.onListItemsChanged()">
                <easy-list-item *ngFor="let message of this.messages"
                                [value]="message">
                    <ng-container *ngTemplateOutlet="this.messageTemplate ? this.messageTemplate: defaultMessageTemplate; context: {$implicit: message}"></ng-container>
                </easy-list-item>
            </easy-list>
            <div class="layout-column">
                <div class="layout-row layout-align-start-center">
                    <easy-chat-input #PART_chatInputElement
                                    [message]="this.message"
                                    [messageTransformer]="this.messageTransformer"
                                    [reactions]="this.reactions"
                                    (beforeSended)="this.onChatInputBeforeSended($event)"
                                    (sended)="this.onChatInputSended($event)"></easy-chat-input>
                </div>
            </div>
        </div> -->
    `;
}
//# sourceMappingURL=ChatElementTemplate.js.map