// #region Imports
import { html } from '../../../../Dom/Html';
import { Icons } from '../../../../Resources/Icons';
import { repeat } from '../../../Directives/Directives';
// #endregion
/**
 * Renders slots for all collected events.
 * These slots are re-projected into the active view.
 *
 * @private
 */
function renderEventSlots(e) {
    return html `
        ${repeat(e.collectedEvents, (ev) => ev.eventKey, (ev) => html `
            <slot name="event-${ev.eventKey}" slot="event-${ev.eventKey}"></slot>
        `)}
        ${repeat(e.collectedEvents.filter((ev) => ev.allDay), (ev) => `allday-${ev.eventKey}`, (ev) => html `
            <slot name="allday-${ev.eventKey}" slot="allday-${ev.eventKey}"></slot>
        `)}
    `;
}
/**
 * Renders the time grid view.
 *
 * @private
 */
function renderTimeGridView(e) {
    return html `
        <mosaik-scheduler-time-grid-view part="time-grid-view"
                                         .lang="${e.lang}"
                                         .dir="${e.dir}"
                                         .startDate="${e.startDate}"
                                         .locale="${e.locale}"
                                         .firstDayOfWeek="${e.firstDayOfWeek}"
                                         .blackoutDates="${e.blackoutDates}"
                                         .specialDates="${e.specialDates}"
                                         .isTodayHighlighted="${e.isTodayHighlighted}"
                                         .isWeekendHighlighted="${e.isWeekendHighlighted}"
                                         .days="${e.days}"
                                         .hourStart="${e.hourStart}"
                                         .hourEnd="${e.hourEnd}"
                                         .stepMinutes="${e.stepMinutes}"
                                         .allDayVisibility="${e.allDayVisibility}"
                                         .collectedEvents="${e.collectedEvents}"
                                         .intl="${e.intl}"
                                         .weekdayFormat="${e.weekdayFormat}"
                                         .dayFormat="${e.dayFormat}"
                                         .timeFormat="${e.timeFormat}"
                                         .monthDayFormat="${e.monthDayFormat}"
                                         @schedulerBeforeEventActivate="${(ev) => e.schedulerBeforeEventActivate.emit(ev.detail)}"
                                         @schedulerEventActivate="${(ev) => e.schedulerEventActivate.emit(ev.detail)}"
                                         @schedulerBeforeSelectRange="${(ev) => e.schedulerBeforeSelectRange.emit(ev.detail)}"
                                         @schedulerSelectRange="${(ev) => e.schedulerSelectRange.emit(ev.detail)}">
            ${renderEventSlots(e)}
        </mosaik-scheduler-time-grid-view>
    `;
}
/**
 * Renders the month view content.
 *
 * @private
 */
function renderMonthView(e) {
    return html `
        <mosaik-scheduler-month-view part="month-view"
                                     .lang="${e.lang}"
                                     .dir="${e.dir}"
                                     .startDate="${e.startDate}"
                                     .locale="${e.locale}"
                                     .firstDayOfWeek="${e.firstDayOfWeek}"
                                     .blackoutDates="${e.blackoutDates}"
                                     .specialDates="${e.specialDates}"
                                     .isTodayHighlighted="${e.isTodayHighlighted}"
                                     .isWeekendHighlighted="${e.isWeekendHighlighted}"
                                     .showWeekNumbers="${e.showWeekNumbers}"
                                     .showAdjacent="${e.showAdjacent}"
                                     .collectedEvents="${e.collectedEvents}"
                                     .intl="${e.intl}"
                                     .weekdayFormat="${e.weekdayFormat}"
                                     .dayFormat="${e.dayFormat}"
                                     .timeFormat="${e.timeFormat}"
                                     .monthDayFormat="${e.monthDayFormat}"
                                     @schedulerBeforeEventActivate="${(ev) => e.schedulerBeforeEventActivate.emit(ev.detail)}"
                                     @schedulerEventActivate="${(ev) => e.schedulerEventActivate.emit(ev.detail)}"
                                     @schedulerBeforeSelectRange="${(ev) => e.schedulerBeforeSelectRange.emit(ev.detail)}"
                                     @schedulerSelectRange="${(ev) => e.schedulerSelectRange.emit(ev.detail)}">
            ${renderEventSlots(e)}
        </mosaik-scheduler-month-view>
    `;
}
/**
 * Renders the agenda view content.
 *
 * @private
 */
function renderAgendaView(e) {
    return html `
        <mosaik-scheduler-agenda-view part="agenda-view"
                                      .lang="${e.lang}"
                                      .dir="${e.dir}"
                                      .startDate="${e.startDate}"
                                      .locale="${e.locale}"
                                      .firstDayOfWeek="${e.firstDayOfWeek}"
                                      .blackoutDates="${e.blackoutDates}"
                                      .specialDates="${e.specialDates}"
                                      .isTodayHighlighted="${e.isTodayHighlighted}"
                                      .isWeekendHighlighted="${e.isWeekendHighlighted}"
                                      .daysAhead="${e.daysAhead}"
                                      .collectedEvents="${e.collectedEvents}"
                                      .intl="${e.intl}"
                                      .weekdayFormat="${e.weekdayFormat}"
                                      .dayFormat="${e.dayFormat}"
                                      .timeFormat="${e.timeFormat}"
                                      .monthDayFormat="${e.monthDayFormat}"
                                      @schedulerBeforeEventActivate="${(ev) => e.schedulerBeforeEventActivate.emit(ev.detail)}"
                                      @schedulerEventActivate="${(ev) => e.schedulerEventActivate.emit(ev.detail)}"
                                      @schedulerBeforeSelectRange="${(ev) => e.schedulerBeforeSelectRange.emit(ev.detail)}"
                                      @schedulerSelectRange="${(ev) => e.schedulerSelectRange.emit(ev.detail)}">
            ${renderEventSlots(e)}
        </mosaik-scheduler-agenda-view>
    `;
}
/**
 * The template function for the `SchedulerElement`.
 *
 * @internal
 */
export function schedulerElementTemplate(e) {
    return html `
        <div part="container">
            <mosaik-toolbar part="toolbar"
                            .dir="${e.dir}"
                            .lang="${e.lang}"
                            .appearance="${'plain'}">
                <mosaik-button-group slot="start"
                                     .dir="${e.dir}"
                                     .lang="${e.lang}"
                                     .appearance="${e.appearance}"
                                     .variant="${e.variant}">
                    <mosaik-button part="previous-day"
                                   aria-label="Previous day"
                                   .icon="${Icons.caretLeft}"
                                   @click="${() => e.navigatePrevious()}"></mosaik-button>
                    <mosaik-button part="today"
                                   aria-label="Today"
                                   .icon="${Icons.today}"
                                   .label="${e.intl.todayLabel}"
                                   @click="${() => e.navigateToday()}"></mosaik-button>
                    <mosaik-button part="next-day"
                                   aria-label="Next day"
                                   .icon="${Icons.caretRight}"
                                   @click="${() => e.navigateNext()}"></mosaik-button>
                </mosaik-button-group>
                <slot name="toolbar"></slot>
            </mosaik-toolbar>
            ${e.view === 'timeGrid' ? renderTimeGridView(e) : null}
            ${e.view === 'month' ? renderMonthView(e) : null}
            ${e.view === 'agenda' ? renderAgendaView(e) : null}
        </div>
        <div part="events-slot" hidden>
            <slot @slotchange="${(ev) => e.onDefaultSlotChange(ev)}"></slot>
        </div>
    `;
}
//# sourceMappingURL=SchedulerElementTemplate.js.map