// #region Imports
import { html } from '../../../../Dom/Html';
// #endregion
/**
 * @internal
 */
export function colorEditorShadeSliderElementTemplate(e) {
    const thumbPosition = (e.shade / 100) * 100;
    // Build gradient from current color to black
    const startColor = `hsl(${e.hue}, ${e.saturation}%, 50%)`;
    const endColor = `hsl(${e.hue}, ${e.saturation}%, 0%)`;
    return html `
        <div part="gradient"
             style="background: linear-gradient(to right, ${startColor}, ${endColor})"></div>
        <div part="thumb"
             style="left: ${thumbPosition}%"></div>
    `;
}
//# sourceMappingURL=ColorEditorShadeSliderElementTemplate.js.map