@use "sass:map";
@use "sass:meta";
@use "@angular/material" as mat;

$_ripple-opacity: 0.1;

// Applies a focus style to an mat-button element for each of the supported palettes.
@mixin _focus-overlay-color($config-or-theme, $variants) {
    $config: mat.m2-get-color-config($config-or-theme);
    @each $variant, $variant-palette in $variants {
        &.mat-#{"" + $variant} .mat-mdc-button-focus-overlay {
            background-color: mat.m2-get-color-from-palette($variant-palette);
        }
        &.mat-#{"" + $variant} .mat-mdc-button-persistent-ripple::before {
            background-color: mat.m2-get-color-from-palette($variant-palette);
        }
    }
}

@mixin _ripple-background($palette, $hue, $opacity) {
    $background-color: mat.m2-get-color-from-palette($palette, $hue, $opacity);
    background-color: $background-color;
    @if (meta.type-of($background-color) != color) {
        opacity: $opacity;
    }
}

@mixin _ripple-color($theme, $hue, $opacity, $variants) {
    @each $variant, $variant-palette in $variants {
        &.mat-#{"" + $variant} .mat-ripple-element {
            @include _ripple-background($variant-palette, $hue, $opacity);
        }
    }
}

// Applies a property to an mat-button element for each of the supported palettes.
@mixin _theme-property($theme, $property, $hue, $variants) {
    $background: map.get($theme, background);
    $foreground: map.get($theme, foreground);

    @each $variant, $variant-palette in $variants {
        &.mat-#{"" + $variant} {
            #{$property}: mat.m2-get-color-from-palette($variant-palette, $hue);
            &.mat-mdc-button-disabled {
                @if $property == "color" {
                    #{$property}: mat.m2-get-color-from-palette($foreground, disabled-button);
                } @else {
                    #{$property}: mat.m2-get-color-from-palette($background, disabled-button);
                }
            }
        }
    }
}

@mixin color($config-or-theme, $variants) {
    $config: mat.m2-get-color-config($config-or-theme);
    $foreground: map.get($config, foreground);
    $background: map.get($config, background);

    .mat-icon:not(:disabled) {
        @include _theme-property($config, "color", text, $variants);
    }

    .mdc-button:not(:disabled),
    .mat-mdc-icon-button:not(:disabled),
    .mat-mdc-stroked-button:not(:disabled) {
        @include _theme-property($config, "color", text, $variants);
        @include _focus-overlay-color($config, $variants);
    }

    .mat-mdc-flat-button:not(:disabled),
    .mat-mdc-raised-button:not(:disabled),
    .mat-mdc-unelevated-button:not(:disabled),
    .mat-mdc-fab:not(:disabled),
    .mat-mdc-mini-fab:not(:disabled) {
        @include _theme-property($config, "color", default-contrast, $variants);
        @include _theme-property($config, "background-color", default, $variants);
        @include _ripple-color($config, default-contrast, $_ripple-opacity, $variants);
    }
}