// #region Imports
import { html } from '../../../../Dom/Html';
import { when } from '../../../Directives/Directives';
import { partMap } from '../../../Directives/part-map/PartMapDirective';
import { ResizeDirection } from '../../../Types/ResizeDirection';
// #endregion
/**
 * The template of the `ResizeElement`.
 *
 * @public
 */
export function resizeElementTemplate(e) {
    return html `
        <div part=${partMap({
        root: true,
        active: e.hasPointer || e.active
    })}>
            <slot></slot>
            ${when(e.active, () => html `
            <mosaik-thumb part="thumb ${ResizeDirection.North}"
                          .lang="${e.lang}"
                          .dir="${e.dir}"
                          .edge="${'horizontal'}"></mosaik-thumb>
            <mosaik-thumb part="thumb ${ResizeDirection.NorthEast}"
                          .lang="${e.lang}"
                          .dir="${e.dir}"
                          .edge="${'corner'}"></mosaik-thumb>
            <mosaik-thumb part="thumb ${ResizeDirection.East}"
                          .lang="${e.lang}"
                          .dir="${e.dir}"
                          .edge="${'vertical'}"></mosaik-thumb>
            <mosaik-thumb part="thumb ${ResizeDirection.SouthEast}"
                          .lang="${e.lang}"
                          .dir="${e.dir}"
                          .edge="${'corner'}"></mosaik-thumb>
            <mosaik-thumb part="thumb ${ResizeDirection.South}"
                          .lang="${e.lang}"
                          .dir="${e.dir}"
                          .edge="${'horizontal'}"></mosaik-thumb>
            <mosaik-thumb part="thumb ${ResizeDirection.SouthWest}"
                          .lang="${e.lang}"
                          .dir="${e.dir}"
                          .edge="${'corner'}"></mosaik-thumb>
            <mosaik-thumb part="thumb ${ResizeDirection.West}"
                          .lang="${e.lang}"
                          .dir="${e.dir}"
                          .edge="${'vertical'}"></mosaik-thumb>
            <mosaik-thumb part="thumb ${ResizeDirection.NorthWest}"
                          .lang="${e.lang}"
                          .dir="${e.dir}"
                          .edge="${'corner'}"></mosaik-thumb>
            `)}
        </div>
    `;
}
//# sourceMappingURL=ResizeElementTemplate.js.map