// #region Imports
import { html } from '../../../../Dom/Html';
import { styleSheetVar } from '../../../Directives/StyleSheetVarDirective';
import { Orientation } from '../../../Types/Orientation';
// #endregion
/**
 * The template of the {@link CommentElement}.
 *
 * @public
 */
export function commentElementTemplate(e) {
    return html `
        <mosaik-stack .dir="${e.dir}"
                      .orientation="${Orientation.Horizontal}"
                      .gap="${styleSheetVar('--comment-gap')}">
            <div part="avatar">
                <slot name="avatar"></slot>
            </div>
            <mosaik-stack .dir="${e.dir}"
                          .orientation="${Orientation.Horizontal}"
                          .gap="${styleSheetVar('--comment-gap')}">
                <div part="inner">
                    <mosaik-stack .dir="${e.dir}"
                                  .orientation="${Orientation.Horizontal}"
                                  .gap="${styleSheetVar('--comment-inner-gap')}">
                        <slot name="author">
                            <mosaik-text part="author"
                                         .dir="${e.dir}"
                                         .text="${e.author}"
                                         .formatter="${e.formatter}"
                                         .truncate="${true}"></mosaik-text>
                        </slot>
                        <slot name="at">
                            <mosaik-text part="at"
                                         .dir="${e.dir}"
                                         .text="${e.at}"
                                         .formatter="${e.formatter}"></mosaik-text>
                        </slot>
                    </mosaik-stack>
                    <slot name="content">
                        <mosaik-text part="content"
                                     .dir="${e.dir}"
                                     .text="${e.content}"
                                     .formatter="${e.formatter}"
                                     .wrap="${true}"></mosaik-text>
                    </slot>
                    <div part="actions">
                        <slot name="actions"></slot>
                    </div>
                </div>
                <!-- <div *ngIf="actions?.length"
                    class="comment-actions">
                    <div *ngFor="let action of actions">
                        <ng-template [labsCommentActionHost]="action.content"></ng-template>
                    </div>
                </div> -->

            </mosaik-stack>
        </mosaik-stack>
        <div part="nested">
            <slot></slot>
        </div>
    `;
}
//# sourceMappingURL=CommentElementTemplate.js.map