@use '../../../../utils/map' as *;
@use '../light/dock-manager' as *;

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

/// Generates a dark base dock-manager schema.
/// @type {Map}
/// @prop {Color} dock-background [color: ('gray', 50)] - Sets the background color of the dock manager.
/// @prop {Color} background-color [color: ('gray', 50)] - Sets the base dock manager color as well as the pane headers and tabs background colors.
/// @prop {Color} pane-header-background [color: ('gray', 50)] - Sets the background color for pane headers.
/// @prop {Color} border-color [color: ('gray', 100)] - Sets the global border color in the dock manager. Also sets the pane content background and the context menu active background colors.
/// @prop {Color} floating-pane-border-color [color: ('gray', 50)] - Sets the border color for floating panes.
/// @prop {Color} joystick-background [color: ('gray', 100)] - Sets the background color of the joystick.
/// @prop {Color} joystick-background-active [color: ('gray', 50)] - Sets the background color of the joysticks.
/// @prop {Color} joystick-border-color [color: ('gray', 200, .5)] - Sets the border color of the joystick.
/// @prop {Color} joystick-icon-color [contrast-color: 'surface'] - Sets the color for the joystick icons.
/// @prop {Color} joystick-icon-color-active [contrast-color: 'surface'] - Sets the color of the active joystick icons.
/// @prop {Color} context-menu-background-active [color: ('gray', 50)] - Sets the background color for active context menus.
/// @prop {Color} context-menu-color-active [contrast-color: ('gray', 50)] - Sets the text color for active context menus.
/// @prop {Color} context-menu-background [ color: ('gray', 100)] - Sets the background color for context menus.
/// @prop {Color} context-menu-color [contrast-color: 'surface'] - Sets the text color for context menus.
/// @prop {Color} tab-background [color: ('gray', 100, .3)] - Sets the background color for tabs.
/// @prop {Color} tab-background-active [color: ('gray', 100, .3)] - Sets the background color for active tabs.
/// @prop {Color} tab-border-color-active [color: ('gray', 100)] - Sets the border color for active tabs.
/// @prop {Color} button-text [contrast-color: 'surface'] - Sets the button text color.
/// @prop {Color} flyout-shadow-color [color: ('gray', 50, .3)] - Sets the flyout shadow color.
/// @prop {Color} drop-shadow-background [color: ('primary', 900, .3)] - Sets the drop-shadow background color.
/// @prop {Color} splitter-background [color: ('gray', 100)] - Sets the background color for the splitters.
$dark-base-dock-manager: (
    dock-background: (
        color: (
            'gray',
            50,
        ),
    ),

    background-color: (
        color: (
            'gray',
            50,
        ),
    ),

    pane-header-background: (
        color: (
            'gray',
            50,
        ),
    ),

    border-color: (
        color: (
            'gray',
            100,
        ),
    ),

    floating-pane-border-color: (
        color: (
            'gray',
            50,
        ),
    ),

    joystick-background: (
        color: (
            'gray',
            100,
        ),
    ),

    joystick-border-color: (
        color: (
            'gray',
            200,
            0.5,
        ),
    ),

    joystick-icon-color: (
        contrast-color: 'surface',
    ),

    joystick-background-active: (
        color: (
            'gray',
            50,
        ),
    ),

    context-menu-background-active: (
        color: (
            'gray',
            50,
        ),
    ),

    context-menu-color-active: (
        contrast-color: (
            'gray',
            50,
        ),
    ),

    context-menu-background: (
        color: (
            'gray',
            100,
        ),
    ),

    context-menu-color: (
        contrast-color: 'surface',
    ),

    tab-background: (
        color: (
            'gray',
            100,
            0.3,
        ),
    ),

    tab-background-active: (
        color: (
            'gray',
            100,
            0.3,
        ),
    ),

    tab-border-color-active: (
        color: (
            'gray',
            100,
        ),
    ),

    button-text: (
        contrast-color: 'surface',
    ),

    flyout-shadow-color: (
        color: (
            'gray',
            50,
            0.3,
        ),
    ),

    drop-shadow-background: (
        color: (
            'primary',
            900,
            0.3,
        ),
    ),

    splitter-background: (
        color: (
            'gray',
            100,
        ),
    ),
);

/// Generates a dark material dock-manager schema.
/// @type {Map}
/// @requires $material-dock-manager
/// @requires $dark-base-dock-manager
$dark-material-dock-manager: extend(
    $material-dock-manager,
    $dark-base-dock-manager,
    (
        _meta: (
            theme: 'material',
            variant: 'dark',
        ),
    )
);

/// Generates a dark dock-manager schema.
/// @type {Map}
/// @requires $light-dock-manager
/// @requires $dark-base-dock-manager
$dark-dock-manager: extend($light-dock-manager, $dark-base-dock-manager);

/// Generates a dark fluent dock-manager schema.
/// @type {Map}
/// @prop {Color} tab-text-active [color: ('primary', 200)] - Sets the text color for active tabs.
/// @prop {Color} floating-pane-border-color [transparent] - Sets the border color for floating panes.
/// @prop {Color} joystick-border-color [transparent] - Sets the border color of the joystick.
/// @prop {Color} splitter-handle [color: ('gray', 50)] - Sets the background color for the splitter handles.
/// @requires $fluent-dock-manager
$dark-fluent-dock-manager: extend(
    $fluent-dock-manager,
    $dark-base-dock-manager,
    (
        tab-text-active: (
            color: (
                'primary',
                200,
            ),
        ),

        floating-pane-border-color: transparent,

        joystick-border-color: transparent,

        splitter-handle: (
            color: (
                'gray',
                50,
            ),
        ),
        _meta: (
            theme: 'fluent',
            variant: 'dark',
        ),
    )
);

/// Generates a dark bootstrap dock-manager schema.
/// @type {Map}
/// @prop {Color} joystick-background [color: ('surface')] - Sets the background color of the joystick.
/// @prop {Color} joystick-background-active [color: ('gray', 50)] - Sets the background color of the joysticks.
/// @prop {Color} joystick-icon-color [contrast-color: 'surface'] - Sets the color for the joystick icons.
/// @prop {Color} joystick-icon-color-active [contrast-color: ('primary', 600)] - Sets the color of the active joystick icons.
/// @prop {Color} context-menu-background-active [color: ('gray', 50)] - Sets the background color for active context menus.
/// @prop {Color} context-menu-color-active [contrast-color: ('primary', 600),] - Sets the text color for active context menus.
/// @prop {Color} context-menu-background [color: ('gray', 500)] - Sets the background color for context menus.
/// @prop {Color} context-menu-color [contrast-color: ('gray', 500)] - Sets the text color for context menus.
/// @requires $bootstrap-dock-manager
/// @requires $dark-base-dock-manager
$dark-bootstrap-dock-manager: extend(
    $bootstrap-dock-manager,
    $dark-base-dock-manager,
    (
        joystick-background: (
            color: (
                'surface',
            ),
        ),

        joystick-background-active: (
            color: (
                'primary',
            ),
        ),

        joystick-icon-color-active: (
            contrast-color: (
                'primary',
                600,
            ),
        ),

        context-menu-background-active: (
            color: (
                'primary',
            ),
        ),

        context-menu-color-active: (
            contrast-color: (
                'primary',
                600,
            ),
        ),

        context-menu-background: (
            color: (
                'gray',
                500,
            ),
        ),

        context-menu-color: (
            contrast-color: (
                'gray',
                500,
            ),
        ),
        _meta: (
            theme: 'bootstrap',
            variant: 'dark',
        ),
    )
);

/// Generates a dark indigo dock-manager schema.
/// @type Map
/// @prop {Color} button-text [color: ('primary', 200)] - Sets the button text color.
/// @prop {Color} joystick-background [color: ('surface')] - Sets the background color of the joystick.
/// @prop {Color} joystick-background-active [color: ('primary')] - Sets the background color of the joysticks.
/// @prop {Color} joystick-border-color [color: ('gray', 100)] - Sets the border color of the joystick.
/// @prop {Color} joystick-icon-color-active [contrast-color: ('primary', 600)] - Sets the color of the active joystick icons.
/// @prop {Color} context-menu-background-active [color: ('primary')] - Sets the background color for active context menus.
/// @prop {Color} context-menu-color-active [contrast-color: ('primary', 600)] - Sets the text color for active context menus.
/// @prop {Color} context-menu-background [contrast-color: ('primary', 600)] - Sets the background color for context menus.
/// @prop {Color} context-menu-color [contrast-color: ('primary', 600)] - Sets the text color for context menus.
/// @requires $indigo-dock-manager
/// @requires $dark-base-dock-manager
$dark-indigo-dock-manager: extend(
    $indigo-dock-manager,
    $dark-base-dock-manager,
    (
        button-text: (
            color: (
                'primary',
                200,
            ),
        ),

        joystick-background: (
            color: (
                'surface',
            ),
        ),

        joystick-background-active: (
            color: (
                'primary',
            ),
        ),

        joystick-icon-color-active: (
            contrast-color: (
                'primary',
                600,
            ),
        ),

        joystick-border-color: (
            color: (
                'gray',
                100,
            ),
        ),

        context-menu-background-active: (
            color: (
                'primary',
            ),
        ),

        context-menu-color-active: (
            contrast-color: (
                'primary',
                600,
            ),
        ),

        context-menu-background: (
            color: (
                'gray',
                200,
            ),
        ),

        context-menu-color: (
            contrast-color: (
                'gray',
                500,
            ),
        ),
        _meta: (
            theme: 'indigo',
            variant: 'dark',
        ),
    )
);