@use '../../../../utils/map' as *;
@use '../light/navbar' as *;

////
/// @package theming
/// @group schemas
/// @access public
////

/// Generates a base dark navbar schema.
/// @access private
/// @type Map
$dark-base-navbar: (
    _meta: (
        name: 'navbar',
        variant: 'dark',
    ),
);

/// Generates a dark material navbar schema.
/// @type Map
/// @prop {Map} background [color: ('primary', 800)] - The navbar background color.
/// @prop {Color} border-color [transparent] - The navbar border color.
/// @prop {Map} text-color [contrast-color: ('primary', 800)] - The navbar text color.
/// @requires $material-navbar
$dark-material-navbar: extend(
    $material-navbar,
    $dark-base-navbar,
    (
        background: (
            color: (
                'primary',
                800,
            ),
        ),
        text-color: (
            contrast-color: (
                'primary',
                800,
            ),
        ),
    )
);

/// Generates a dark fluent navbar schema.
/// @type Map
/// @requires $fluent-navbar
$dark-fluent-navbar: extend($fluent-navbar, $dark-base-navbar);

/// Generates a dark bootstrap navbar schema.
/// @type Map
/// @requires $bootstrap-navbar
$dark-bootstrap-navbar: extend($bootstrap-navbar, $dark-base-navbar);

/// Generates a dark indigo navbar schema.
/// @type Map
/// @prop {Map} text-color [contrast-color: ('gray', 100)] - The navbar text color.
/// @prop {Map} idle-icon-color [contrast-color: ('gray', 100, 0.8)] - The navbar idle icon color.
/// @prop {Map} hover-icon-color [contrast-color: ('gray', 100)] - The navbar hover icon color.
/// @prop {Color} border-color [color: ('primary', 200)] - The navbar border color.
/// @requires $indigo-navbar
$dark-indigo-navbar: extend(
    $indigo-navbar,
    $dark-base-navbar,
    (
        text-color: (
            contrast-color: (
                'gray',
                100,
            ),
        ),
        idle-icon-color: (
            contrast-color: (
                'gray',
                100,
                0.8,
            ),
        ),
        hover-icon-color: (
            contrast-color: (
                'gray',
                100,
            ),
        ),
        border-color: (
            color: (
                'primary',
                200,
            ),
        ),
    )
);
