@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>
////

/// Grid Summary Theme
///
/// PRIMARY TOKENS:
/// - `$background-color` — The summaries background color.
/// - `$label-color` — The summaries label color.
///
/// Derived colors are auto-calculated for contrast.
///
/// @param {Map} $schema [$light-material-schema] - The schema used as basis for styling the component.
/// @param {Color} $background-color [null] - The summaries background color. PRIMARY - derives label-color, result-color, border-color, pinned-border-color.
/// @param {Color} $label-color [null] - The summaries label color. PRIMARY - derives label-hover-color. Auto-derived from background-color.
/// @param {Color} $result-color [null] - The summaries value/result color. Auto-derived from background-color.
/// @param {Color} $border-color [null] - The summaries border color. Auto-derived from background-color.
/// @param {Color} $pinned-border-width [null] - The border width of the summary panel.
/// @param {Color} $pinned-border-style [null] - The border style of the summary panel.
/// @param {Color} $pinned-border-color [null] - The border color of the summary panel. Auto-derived from background-color.
/// @param {Color} $label-hover-color [null] - The summaries hover label color. Auto-derived from label-color.
/// @requires $light-material-schema
/// @example scss - Change the summaries background and labels color
///   $my-summary-theme: grid-summary-theme(
///     $background-color: black,
///     $label-color: white
///   );
///   // Pass the theme to the css-vars mixin
///   @include css-vars($my-summary-theme);
@function grid-summary-theme(
    $schema: $light-material-schema,

    $background-color: null,
    $label-color: null,
    $result-color: null,
    $border-color: null,
    $pinned-border-width: null,
    $pinned-border-style: null,
    $pinned-border-color: null,
    $label-hover-color: null
) {
    $selector: #{'.' + config.element-prefix() + '-' + 'grid-summary'};
    $grid-summary-schema: ();

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

    $theme: digest-schema($grid-summary-schema);

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

    @if not($label-hover-color) and $label-color {
        $label-hover-color: var(--label-color);
    }

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

    @if not($border-color) and $background-color {
        $border-color: hsl(from adaptive-contrast(var(--background-color)) h s l / 0.26);
    }

    @if not($pinned-border-color) and $background-color {
        $pinned-border-color: hsl(from adaptive-contrast(var(--background-color)) h s l / 0.26);
    }

    @return extend(
        $theme,
        (
            selector: $selector,
            background-color: $background-color,
            label-color: $label-color,
            result-color: $result-color,
            border-color: $border-color,
            pinned-border-width: $pinned-border-width,
            pinned-border-style: $pinned-border-style,
            pinned-border-color: $pinned-border-color,
            label-hover-color: $label-hover-color,
        )
    );
}
