@import '../shape/dialog';
@import '../elevation/dialog';

////
/// @group schemas
/// @access private
/// @author <a href="https://github.com/simeonoff" target="_blank">Simeon Simeonoff</a>
////

/// Generates a light dialog schema.
/// @type {Map}
/// @prop {Map} background [igx-color: 'surface'] - The dialog background color.
/// @prop {Map} title-color [igx-color: 'surface', text-contrast: (), rgba: .87] - The dialog title text color.
/// @prop {Map} message-color [igx-color: 'surface', text-contrast: (), rgba: .6] - The dialog message text color.
/// @prop {number} elevation [24] - The elevation level for the dialog.
/// @prop {Number} border-radius [.1] - The border radius fraction, between 0-1 to be used for dialog component.
///
/// @requires {function} extend
/// @requires {map} $_default-shape-dialog
/// @requires {map} $_default-elevation-dialog
$_light-dialog: extend(
    $_default-shape-dialog,
    $_default-elevation-dialog,
    (
        variant: 'material',
        background: (
            igx-color: 'surface'
        ),

        title-color: (
            igx-color: 'surface',
            text-contrast: (),
            rgba: .87
        ),

        message-color: (
            igx-color: 'surface',
            text-contrast: (),
            rgba: .6
        ),
    )
);

/// Generates a fluent dialog schema.
/// @type {Map}
/// @prop {Number} border-radius [2px] - The border radius fraction, between 0-1 to be used for dialog component.
///
/// @requires {function} extend
/// @requires {map} $_light-dialog
/// @requires {map} $_fluent-shape-dialog
$_fluent-dialog: extend(
    $_light-dialog,
    $_fluent-shape-dialog,
    (
        variant: 'fluent',
    )
);