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

/// Chat Theme
///
/// PRIMARY TOKENS:
/// - `$header-background` — The background color of the chat header.
/// - `$sent-message-background` — The background color for sent messages.
/// - `$received-message-background` — The background color for received messages.
///
/// 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 background color of the chat component.
/// @param {Color} $header-background [null] - The background color of the chat header.
/// @param {Color} $header-color [null] - The text color of the chat header. Auto-derived from header-background.
/// @param {Color} $header-border [null] - The color used for the chat header border.
/// @param {Color} $sent-message-background [null] - The background color for sent messages.
/// @param {Color} $sent-message-color [null] - The text color of the chat messages. Auto-derived from sent-message-background.
/// @param {Color} $received-message-background [null] - The background color for received messages.
/// @param {Color} $received-message-color [null] - The text color for received messages. Auto-derived from received-message-background.
/// @param {Color} $message-actions-color [null] - The icon color of the chat received message actions. Auto-derived from received-message-color.
/// @param {Number} $message-border-radius [null] - The border radius of the chat messages.
/// @param {Color} $file-background [null] - The background color of the image message container.
/// @param {Color} $file-icon-color [null] - The color of the attached file icon.
/// @param {Color} $file-icon-accent-color [null] - The accent color of the attached file icon.
/// @param {Color} $image-background [null] - The background color of the image message container.
/// @param {Color} $image-border [null] - The border color of the image message container.
/// @param {Color} $image-attachment-icon [null] - The color of the message attachment icon.
/// @param {Color} $chat-input-border [null] - The border color of the chat input area.
/// @param {Color} $progress-indicator-color [null] - The color of the progress indicator in the chat component.
/// @param {Color} $code-background [null] - The background color of the code snippets in the chat component.
/// @param {Color} $code-border [null] - The border color of the code snippets in the chat component.
/// @requires $light-material-schema
///
/// @example scss - Change background color
///   $my-chat-theme: chat-theme($background: blue);
///   // Pass the theme to the css-vars mixin
///   @include css-vars($my-chat-theme);
@function chat-theme(
    $schema: $light-material-schema,

    $background: null,

    $header-background: null,
    $header-color: null,
    $header-border: null,

    $sent-message-background: null,
    $sent-message-color: null,

    $received-message-background: null,
    $received-message-color: null,

    $message-actions-color: null,
    $message-border-radius: null,

    $file-background: null,
    $file-icon-color: null,
    $file-icon-accent-color: null,

    $image-background: null,
    $image-border: null,
    $image-attachment-icon: null,

    $chat-input-border: null,
    $progress-indicator-color: null,

    $code-background: null,
    $code-border: null
) {
    $selector: #{config.element-prefix() + '-' + 'chat'};
    $chat-schema: ();

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

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

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

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

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

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

    @return extend(
        $theme,
        (
            selector: $selector,
            background: $background,

            header-background: $header-background,
            header-color: $header-color,
            header-border: $header-border,

            sent-message-background: $sent-message-background,
            sent-message-color: $sent-message-color,

            received-message-background: $received-message-background,
            received-message-color: $received-message-color,

            message-actions-color: $message-actions-color,
            message-border-radius: $message-border-radius,

            file-background: $file-background,
            file-icon-color: $file-icon-color,
            file-icon-accent-color: $file-icon-accent-color,

            image-background: $image-background,
            image-border: $image-border,
            image-attachment-icon: $image-attachment-icon,

            chat-input-border: $chat-input-border,
            progress-indicator-color: $progress-indicator-color,

            code-background: $code-background,
            code-border: $code-border,
        )
    );
}