// #region Imports
import { html } from '../../../../Dom/Html';
import { repeat } from '../../../Directives/Directives';
import { createThumbnailPreviewFromFile } from '../../Primitives/Thumbnail/Previews/ThumbnailPreviewFactory';
// #endregion
/**
 * The template of the {@link ChatInputAttachmentListElement}.
 */
export function chatInputAttachmentListElementTemplate(e) {
    return html `
        ${repeat(e.files, (file) => file.name, (file) => html `
        <!-- <mosaik-chip part="attachment"
                     .closeable="${true}"
                     @closed="${() => e.removeAttachment(file)}"
                     @click="${() => window.open(URL.createObjectURL(file))}">
            <mosaik-thumbnail slot="icon"
                              .preview="${{ url: URL.createObjectURL(file), type: file.type }}"></mosaik-thumbnail>
            <mosaik-text slot="label"
                         .text="${file.name}"
                         .maxLength="${20}"
                         .truncate="${true}"></mosaik-text>
        </mosaik-chip> -->

        <mosaik-box part="attachment"
                    .cornered="${true}"
                    @click="${() => window.open(URL.createObjectURL(file))}">
            <mosaik-dismiss slot="dismiss"
                            .size="${'tiny'}"
                            @click="${(x) => e.onDismiss(x, file)}"></mosaik-dismiss>
            <mosaik-thumbnail part="thumbnail"
                              .preview="${createThumbnailPreviewFromFile(file)}"></mosaik-thumbnail>
            <div part="content">
                <mosaik-text part="label"
                             .text="${file.name}"
                             .truncate="${true}"></mosaik-text>
                <mosaik-text part="type"
                             .text="${file.type}"
                             .truncate="${true}"></mosaik-text>
            </div>
        </mosaik-box>
        `)}
    `;
}
//# sourceMappingURL=ChatInputAttachmentListElementTemplate.js.map