@use 'sass:map';
@use '../../config';
@use '../../functions' as *;
@use '../../schemas/' as *;
@use '../../../utils/map' as *;
@use '../../../color/functions' as *;
@use '../../../elevations/' as *;

////
/// @package theming
/// @group themes
/// @access public
/// @author <a href="https://github.com/simeonoff" target="_blank">Simeon Simeonoff</a>
/// @author <a href="https://github.com/desig9stein" target="_blank">Marin Popov</a>
////

/// Slider Theme
///
/// PRIMARY TOKENS:
/// - `$track-color` — The filled track color.
/// - `$base-track-color` — The unfilled track background.
/// - `$thumb-color` — The thumb color (material).
///
/// Derived colors are auto-calculated for contrast.
///
/// @param {Map} $schema [$light-material-schema] - The schema used as basis for styling the component.
/// @param {Color} $track-color [null] - The color of the track. PRIMARY - derives hover, label, and thumb colors.
/// @param {Color} $track-step-color [null] - The color of the track steps. Auto-derived from base-track-color.
/// @param {Number} $track-step-size [null] - The size of the track steps.
/// @param {Color} $track-hover-color [null] - The color of the track on hover. Auto-derived from track-color.
/// @param {Color} $thumb-color [null] - The color of the thumb. Auto-derived from track-color (material) or set independently.
/// @param {Color} $thumb-focus-color [null] - The focus color of the thumb. Auto-derived from thumb-border-color or thumb-color.
/// @param {Color} $thumb-border-color [null] - The thumb border color. Auto-derived from track-color (fluent/indigo) or thumb-color (bootstrap).
/// @param {Color} $thumb-border-hover-color [null] - The thumb border color when hovered. Auto-derived from thumb-border-color.
/// @param {Color} $thumb-border-focus-color [null] - The thumb border color when focused.
/// @param {Color} $thumb-disabled-border-color [null] - The thumb border color when it's disabled. Auto-derived from thumb-border-color.
/// @param {Color} $disabled-thumb-color [null] - The thumb color when its disabled. Auto-derived from thumb-color.
/// @param {Color} $label-background-color [null] - The background color of the bubble label. Auto-derived from track-color or thumb-color.
/// @param {Color} $label-text-color [null] - The text color of the bubble label. Auto-derived from label-background-color.
/// @param {Color} $base-track-color [null] - The base background color of the track. PRIMARY for unfilled track. Auto-derived from track-color (material).
/// @param {Color} $base-track-hover-color [null] - The base background color of the track on hover. Auto-derived from base-track-color.
/// @param {Color} $disabled-base-track-color [null] - The base background color of the track when is disabled. Auto-derived from base-track-color.
/// @param {Color} $disabled-fill-track-color [null] - The base background color of the fill track when is disabled. Auto-derived from track-color.
/// @param {Color} $tick-label-color [null] - The color of the tick label.
/// @param {Color} $tick-color [null] - The background-color of the tick.
/// @requires $light-material-schema
/// @example scss - Set custom track and thumb on colors
///   $my-slider-theme: slider-theme($thumb-color: black, $track-color: yellow);
///   // Pass the theme to the css-vars() mixin
///   @include css-vars($my-slider-theme);
@function slider-theme(
    $schema: $light-material-schema,

    $track-color: null,
    $track-step-color: null,
    $track-step-size: null,
    $track-hover-color: null,
    $thumb-color: null,
    $thumb-focus-color: null,
    $thumb-border-color: null,
    $thumb-border-hover-color: null,
    $thumb-border-focus-color: null,
    $thumb-disabled-border-color: null,
    $disabled-thumb-color: null,
    $label-background-color: null,
    $label-text-color: null,

    $base-track-color: null,
    $base-track-hover-color: null,
    $disabled-base-track-color: null,
    $disabled-fill-track-color: null,

    $tick-label-color: null,
    $tick-color: null
) {
    $selector: #{config.element-prefix() + '-' + 'slider'};
    $slider-schema: ();

    @if map.has-key($schema, 'slider') {
        $slider-schema: map.get($schema, 'slider');
    } @else {
        $slider-schema: $schema;
    }

    $theme: digest-schema($slider-schema);
    $variant: map.get($theme, '_meta', 'theme');

    @if $variant == 'fluent' or $variant == 'indigo' {
        @if not($thumb-border-color) and $track-color {
            $thumb-border-color: var(--track-color);
        }

        @if not($track-color) and $thumb-border-color {
            $track-color: var(--thumb-border-color);
        }

        @if not($thumb-border-hover-color) and $thumb-border-color {
            $thumb-border-hover-color: dynamic-shade(var(--thumb-border-color));
        }

        @if $variant == 'fluent' {
            @if not($thumb-focus-color) and $thumb-border-color {
                $thumb-focus-color: dynamic-shade(var(--thumb-border-color), $offset: 10);
            }
        } @else {
            @if not($thumb-focus-color) and $thumb-border-color {
                $thumb-focus-color: hsl(from var(--thumb-border-color) h s l / 0.3);
            }
        }
    }

    @if $variant == 'material' {
        @if not($thumb-color) and $track-color {
            $thumb-color: var(--track-color);
        }

        @if not($track-color) and $thumb-color {
            $track-color: var(--thumb-color);
        }

        @if not($base-track-color) and $track-color {
            $base-track-color: hsl(from var(--track-color) h s l / 0.4);
        }
    }

    @if $variant == 'bootstrap' {
        @if not($thumb-border-color) and $thumb-color {
            $thumb-border-color: var(--thumb-color);
        }

        @if not($thumb-focus-color) and $thumb-color {
            $thumb-focus-color: hsl(from var(--thumb-color) h s l / 0.5);
        }
    }

    @if not($track-hover-color) and $track-color {
        $track-hover-color: dynamic-shade(var(--track-color));
    }

    @if $variant != 'bootstrap' {
        @if not($label-background-color) and $track-color {
            $label-background-color: var(--track-color);
        }
    } @else {
        @if not($label-background-color) and $thumb-color {
            $label-background-color: var(--thumb-color);
        }
    }

    @if not($label-text-color) and $label-background-color {
        $label-text-color: adaptive-contrast($label-background-color);
    }

    @if $variant != 'indigo' {
        @if not($base-track-hover-color) and $base-track-color {
            $base-track-hover-color: var(--base-track-color);
        }
    } @else {
        @if not($base-track-hover-color) and $base-track-color {
            $base-track-hover-color: dynamic-shade(var(--base-track-color), $offset: 10);
        }
    }

    @if not($track-step-color) and $base-track-color {
        $track-step-color: adaptive-contrast(var(--base-track-color));
    }

    @if not($disabled-base-track-color) and $base-track-color {
        $disabled-base-track-color: hsl(from var(--base-track-color) h s l / 0.5);
    }

    @if not($disabled-fill-track-color) and $track-color {
        $disabled-fill-track-color: hsl(from var(--track-color) h s l / 0.5);
    }

    @if not($disabled-thumb-color) and $thumb-color {
        $disabled-thumb-color: hsl(from dynamic-shade(var(--thumb-color), $offset: 10) h calc(s * 0.5) l);
    }

    @if not($thumb-disabled-border-color) and $thumb-border-color {
        $thumb-disabled-border-color: hsl(from var(--thumb-border-color) h s l / 0.5);
    }

    @return extend(
        $theme,
        (
            selector: $selector,
            track-color: $track-color,
            track-step-color: $track-step-color,
            track-step-size: $track-step-size,
            track-hover-color: $track-hover-color,
            thumb-color: $thumb-color,
            thumb-focus-color: $thumb-focus-color,
            thumb-border-color: $thumb-border-color,
            thumb-border-hover-color: $thumb-border-hover-color,
            thumb-border-focus-color: $thumb-border-focus-color,
            thumb-disabled-border-color: $thumb-disabled-border-color,
            disabled-thumb-color: $disabled-thumb-color,
            label-background-color: $label-background-color,
            label-text-color: $label-text-color,
            base-track-color: $base-track-color,
            base-track-hover-color: $base-track-hover-color,
            disabled-base-track-color: $disabled-base-track-color,
            disabled-fill-track-color: $disabled-fill-track-color,
            tick-label-color: $tick-label-color,
            tick-color: $tick-color,
        )
    );
}