// #region Imports
import { html } from '../../../../Dom/Html';
import { RendererServiceLocator } from '../../../../Dom/Renderer';
// #endregion
/**
 * The template of the `ScrubSliderElement`.
 *
 * @public
 */
export function scrubSliderElementTemplate(e) {
    return html `
        <div part="root">
            <div part="surface"
                 role="slider"
                 aria-valuemin=${e.min}
                 aria-valuemax=${e.max}
                 aria-valuenow=${e.value}
                 aria-disabled=${e.disabled ? 'true' : 'false'}>
                <div part="ticks top"></div>
                <div part="center"></div>
                <div part="ticks bottom"></div>
            </div>
            <div part="labels"></div>
            <input part="input"
                   class="visually-hidden"
                   type="range"
                   .min=${e.min.toString()}
                   .max=${e.max.toString()}
                   .step=${e.step.toString()}
                   .value=${String(e.value)} />
            <div part="hint">
                <slot name="hint"
                      @slotchange="${(x) => x.target.assignedElements().map((y, i) => RendererServiceLocator.current.setStyle(y, 'order', i))}"></slot>
            </div>
        </div>
    `;
}
//# sourceMappingURL=ScrubSliderElementTemplate.js.map