// #region Imports
import { html } from '../../../../Dom/Html';
import { when } from '../../../Directives/Directives';
import { CheckType } from '../../../Types/CheckType';
// #endregion
/**
 * The template of the {@link RadioElement}.
 *
 * @public
 */
export function radioElementTemplate(e) {
    return html `
        <input part="input"
               type="radio"
               id="${'radio-input'}"
               .name="${e.name}"
               ?disabled="${e.disabled}"
               ?indeterminate="${e.isThreeState}"
               ?checked="${e.isChecked}"
               ?required="${e.required}"
               aria-checked="${e.isChecked ? 'true' : 'false'}" />
        <div style="position: relative;">
            ${when(!e.disabled, () => html `
            <mosaik-focus-ring part="focusRing"
                               .variant="${e.variant}"
                               .visible="${e.isFocused}"
                               .controlled="${'manual'}"
                               .for="${'radio-input'}"></mosaik-focus-ring>
            `)}
            <slot name="checkmark">
                <mosaik-checkmark part="checkmark"
                                  .variant="${e.variant}"
                                  .appearance="${e.appearance}"
                                  .type="${CheckType.Bullet}"
                                  ?checked="${e.isChecked}"
                                  ?disabled="${e.disabled}"></mosaik-checkmark>
            </slot>
        </div>
        <slot name="label">
            <mosaik-text part="label"
                         .text="${e.label}"
                         .formatter="${e.formatter}"
                         ?disabled="${e.disabled}"
                         ?wrap="${true}"></mosaik-text>
        </slot>
    `;
}
//# sourceMappingURL=RadioElementTemplate.js.map