////
/// @group themes
/// @access public
/// @author <a href="https://github.com/simeonoff" target="_blank">Simeon Simeonoff</a>
/// @author <a href="https://github.com/desig9stein" target="_blank">Marin Popov</a>
////

/// If you specify a background color, but do not specify colors for either the
/// button or the text, their colors will be set automatically to a contrasting color.
///
/// @param {Map} $palette [$default-palette] - The palette used as basis for styling the component.
/// @param {Map} $schema [$light-schema] - The schema used as basis for styling the component.
/// @param {Map} $elevations [$elevations] - The elevations (shadows) map to be used.
///
/// @param {Color} $background [null] - The background color used in the snackbar.
/// @param {Color} $text-color [null] - The text color used in the snackbar.
/// @param {Color} $button-color [null] - The button color used in the snackbar.
/// @param {box-shadow} $shadow [null] - Sets a shadow to be used for the snackbar.
///
/// @param {border-radius} $border-radius [null] - The border radius used for the snackbar component.
///
/// @requires $default-palette
/// @requires $light-schema
/// @requires apply-palette
/// @requires extend
/// @requires text-contrast
/// @requires igx-elevation
/// @requires $elevations
/// @requires round-borders
///
/// @example scss Set a custom background color
///   $my-snackbar-theme: igx-snackbar-theme($background: white);
///   // Pass the theme to the igx-bottom-nav component mixin
///   @include igx-snackbar($my-snackbar-theme);
@function igx-snackbar-theme(
    $palette: $default-palette,
    $schema: $light-schema,
    $elevations: $elevations,

    $border-radius: null,
    $background: null,
    $text-color: null,
    $button-color: null,
    $shadow: null
) {
    $name: 'igx-snackbar';
    $snackbar-schema: ();

    @if map-has-key($schema, $name) {
        $snackbar-schema: map-get($schema, $name);
    } @else {
        $snackbar-schema: $schema;
    }

    $theme: apply-palette($snackbar-schema, $palette);

    $border-radius: round-borders(
        if($border-radius, $border-radius, map-get($snackbar-schema, 'border-radius')), 0, 24px
    );

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

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

    @if not($shadow) {
        $elevation: map-get($snackbar-schema, 'elevation');
        $shadow: igx-elevation($elevations, $elevation);
    }

    @return extend($theme, (
        name: $name,
        palette: $palette,
        border-radius: $border-radius,
        background: $background,
        text-color: $text-color,
        button-color: $button-color,
        shadow: $shadow
    ));
}

/// @param {Map} $theme - The theme used to style the component.
/// @requires {mixin} igx-root-css-vars
/// @requires rem
/// @requires --var
@mixin igx-snackbar($theme) {
    @include igx-root-css-vars($theme);

    // @debug $theme;

    $snackbar-min-height: rem(48px);
    $snackbar-padding: rem(7px) rem(24px);
    $snackbar-button-left-margin: rem(24px);
    $snackbar-button-line-height: rem(16px);
    $snackbar-button-font-weight: 600;
    $left: if-ltr(left, right);

    %igx-snackbar-display {
        position: relative;
        display: flex;
        flex-flow: row nowrap;
        align-items: center;
        justify-content: space-between;
        min-height: $snackbar-min-height;
        padding: $snackbar-padding;
        margin: 8px;
        color: --var($theme, 'text-color');
        background: --var($theme, 'background');
        backface-visibility: hidden;
        box-shadow: --var($theme, 'shadow');
        border-radius: --var($theme, 'border-radius')
    }

    %igx-snackbar-button {
        background: transparent;
        color: --var($theme, 'button-color');
        border: 0;
        line-height: $snackbar-button-line-height;
        margin-#{$left}: $snackbar-button-left-margin;
        text-transform: uppercase;
        user-select: none;
        font-weight: $snackbar-button-font-weight;
        -webkit-tap-highlight-color: transparent;
        outline: none;
        transition: color .2s ease;
        font-size: inherit;
        font-family: inherit;
        cursor: pointer;

        &:hover {
            color: --var($theme, 'button-color');
        }
    }
}

/// Adds typography styles for the igx-snackbar component.
/// Uses the 'body-2'
/// category from the typographic scale.
/// @group typography
/// @param {Map} $type-scale - A typographic scale as produced by igx-type-scale.
/// @param {Map} $categories [(text: 'body-2')] - The categories from the typographic scale used for type styles.
/// @requires {mixin} igx-type-style
@mixin igx-snackbar-typography($type-scale, $categories: (text: 'body-2')) {
    $text: map-get($categories, 'text');

    %igx-snackbar-message {
        @include igx-type-style($type-scale, $text);
    }
}