@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/desig9stein" target="_blank">Marin Popov</a>
/// @author <a href="https://github.com/simeonoff" target="_blank">Simeon Simeonoff</a>
////

/// Card Theme
///
/// PRIMARY TOKENS:
/// - `$background` — The card background 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 [null] - The card background color. PRIMARY - derives all text colors.
/// @param {Color} $outline-color [null] - The color of the outline for outlined type cards.
/// @param {Color} $header-text-color [null] - The text color of the card title. Auto-derived from background.
/// @param {Color} $subtitle-text-color [null] - The text color of the card subtitle. Auto-derived from background (muted).
/// @param {Color} $content-text-color [null] - The text color of the card content. Auto-derived from background (muted).
/// @param {Color} $actions-text-color [null] - The text color of the card buttons. Auto-derived from background.
/// @param {List} $resting-shadow [null] - The shadow of the card in its resting state.
/// @param {List} $hover-shadow [null] - The shadow of the card in its hover state.
/// @param {List} $border-radius [null] - The border radius used for card component.
///
/// @requires $light-material-schema
///
/// @example scss - Change the background and content text colors in card
///   $my-card-theme: card-theme($background: #fff);
///   // Pass the theme to the css-vars() mixin
///   @include css-vars($my-card-theme);
@function card-theme(
    $schema: $light-material-schema,

    $border-radius: null,
    $background: null,
    $outline-color: null,
    $header-text-color: null,
    $subtitle-text-color: null,
    $content-text-color: null,
    $actions-text-color: null,
    $resting-shadow: null,
    $hover-shadow: null
) {
    $selector: #{config.element-prefix() + '-' + 'card'};
    $card-schema: ();

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

    $theme: digest-schema($card-schema);

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

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

    @if not($content-text-color) and $background {
        $content-text-color: dynamic-shade(adaptive-contrast(var(--background)), $offset: 7);
    }

    @if not($subtitle-text-color) and $background {
        $subtitle-text-color: dynamic-shade(adaptive-contrast(var(--background)), $offset: 7);
    }

    @if not($resting-shadow) {
        $resting-elevation: map.get($card-schema, 'resting-elevation');
        $resting-shadow: elevation($resting-elevation);
    }

    @if not($hover-shadow) {
        $hover-elevation: map.get($card-schema, 'hover-elevation');
        $hover-shadow: elevation($hover-elevation);
    }

    @return extend(
        $theme,
        (
            selector: $selector,
            background: $background,
            outline-color: $outline-color,
            border-radius: $border-radius,
            header-text-color: $header-text-color,
            subtitle-text-color: $subtitle-text-color,
            content-text-color: $content-text-color,
            actions-text-color: $actions-text-color,
            resting-elevation: $resting-shadow,
            hover-elevation: $hover-shadow,
        )
    );
}