///
//  Copyright (c) 2022 GrowStocks
//
//  Permission is hereby granted, free of charge, to any person obtaining a copy
//  of this software and associated documentation files (the "Software"), to deal
//  in the Software without restriction, including without limitation the rights
//  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
//  copies of the Software, and to permit persons to whom the Software is
//  furnished to do so, subject to the following conditions:
//
//  The above copyright notice and this permission notice shall be included in all
//  copies or substantial portions of the Software.
//
//  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
//  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
//  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
//  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
//  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
//  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
//  SOFTWARE.
///

@use '../theme';
@use '../support';

@use 'sass:map';
@use 'sass:list';
@use 'sass:string';

@use 'validators';

@mixin apply(
    $component-name,
    $color-theme: (),
    $style: 'filled',
    $is-extender: false,
    $is-stateful: false
) {
    @if not support.is-empty($color-theme) {
        @if validators.is-color-prop($color-theme) {
            $default: map.get($color-theme, 'default');
            $hover: map.get($color-theme, 'hover');
            $active: map.get($color-theme, 'active');
            $focus: map.get($color-theme, 'focus');
            $disabled: map.get($color-theme, 'disabled');
            $ink: map.get($color-theme, 'ink');

            @if $style == 'text' {
                @include _text($component-name, $default, $hover, $active, $focus, $disabled, $ink, $is-extender, $is-stateful);
            }

            @if $style == 'outlined' {
                @include _outlined($component-name, $default, $hover, $active, $focus, $disabled, $ink, $is-extender, $is-stateful);
            }

            @if $style == 'filled' {
                @include _filled($component-name, $default, $hover, $active, $focus, $disabled, $ink, $is-extender, $is-stateful);
            }
        }
    }
}

@mixin _text($component-name, $default, $hover, $active, $focus, $disabled, $ink, $is-extender: false, $is-stateful: false) {

    @if $is-extender {
        @include theme.key-bind('#{$component-name}-fill', rgba(0 0 0 / 0));
        @include theme.key-bind('#{$component-name}-ink', theme.token-switch($default));
        @include theme.key-bind('#{$component-name}-border', rgba(0 0 0 / 0));
    } @else {
        background: theme.key-create('#{$component-name}-fill', rgba(0 0 0 / 0));
        color: theme.key-create('#{$component-name}-ink', theme.token-switch($default));
        border: 1px solid theme.key-create('#{$component-name}-border', rgba(0 0 0 / 0));
    }

    @if $hover or $is-stateful {
        &:hover {
            @include theme.key-bind('#{$component-name}-fill', rgba(theme.token-get-raw($default), 20%));
            @include theme.key-bind('#{$component-name}-ink', theme.token-switch($hover));
            @include theme.key-bind('#{$component-name}-border', rgba(theme.token-get-raw($default), 2%));
        }
    }

    @if $focus or $is-stateful {
        &:focus {
            @include theme.key-bind('#{$component-name}-fill', rgba(theme.token-get-raw($default), 20%));
            @include theme.key-bind('#{$component-name}-ink', theme.token-switch($focus));
            @include theme.key-bind('#{$component-name}-border', rgba(theme.token-get-raw($default), 2%));
        }
    }

    @if $active or $is-stateful {
        &:active {
            @include theme.key-bind('#{$component-name}-fill', rgba(theme.token-get-raw($default), 33%));
            @include theme.key-bind('#{$component-name}-ink', theme.token-switch($active));
            @include theme.key-bind('#{$component-name}-border', rgba(theme.token-get-raw($default), 3.3%));
        }
    }

    @if $disabled or $is-stateful {
        &:disabled {
            @include theme.key-bind('#{$component-name}-ink', theme.token-switch($disabled));

            &:hover {
                @include theme.key-bind('#{$component-name}-fill', rgba(0 0 0 / 0));
                @include theme.key-bind('#{$component-name}-border', rgba(0 0 0 / 0));
            }
        }
    }
}

@mixin _outlined($component-name, $default, $hover, $active, $focus, $disabled, $ink, $is-extender: false, $is-stateful: false) {

    @if $is-extender {
        @include theme.key-bind('#{$component-name}-fill', rgba(0 0 0 / 0));
        @include theme.key-bind('#{$component-name}-ink', theme.token-switch($default));
        @include theme.key-bind('#{$component-name}-border', theme.token-switch($default));
    } @else {
        background: theme.key-create('#{$component-name}-fill', rgba(0 0 0 / 0));
        color: theme.key-create('#{$component-name}-ink', theme.token-switch($default));
        border: 1px solid theme.key-create('#{$component-name}-border', theme.token-switch($default));
    }

    @if $focus or $is-stateful {
        &:focus {
            @include theme.key-bind('#{$component-name}-fill', rgba(theme.token-get-raw($default), 20%));
            @include theme.key-bind('#{$component-name}-ink', theme.token-switch($focus));
            @include theme.key-bind('#{$component-name}-border', theme.token-switch($focus));
        }
    }

    @if $hover or $is-stateful {
        &:hover {
            @include theme.key-bind('#{$component-name}-fill', theme.token-switch($hover));
            @include theme.key-bind('#{$component-name}-ink', theme.token-switch($ink));
            @include theme.key-bind('#{$component-name}-border', theme.token-switch($hover));
        }
    }

    @if $active or $is-stateful {
        &:active {
            @include theme.key-bind('#{$component-name}-fill', theme.token-switch($active));
            @include theme.key-bind('#{$component-name}-ink', theme.token-switch($ink));
            @include theme.key-bind('#{$component-name}-border', theme.token-switch($active));
        }
    }

    @if $disabled or $is-stateful {
        &:disabled {
            @include theme.key-bind('#{$component-name}-ink', theme.token-switch($disabled));
            @include theme.key-bind('#{$component-name}-border', theme.token-switch($disabled));

            &:hover {
                @include theme.key-bind('#{$component-name}-fill', rgba(0 0 0 / 0));
                @include theme.key-bind('#{$component-name}-ink', theme.token-switch($disabled));
                @include theme.key-bind('#{$component-name}-border', theme.token-switch($disabled));
            }
        }
    }
}

@mixin _filled($component-name, $default, $hover, $active, $focus, $disabled, $ink, $is-extender: false, $is-stateful: false) {

    @if $is-extender {
        @include theme.key-bind('#{$component-name}-fill', theme.token-switch($default));
        @include theme.key-bind('#{$component-name}-ink', theme.token-switch($ink));
        @include theme.key-bind('#{$component-name}-border', theme.token-switch($default));
    } @else {
        background: theme.key-create('#{$component-name}-fill', theme.token-switch($default));
        color: theme.key-create('#{$component-name}-ink', theme.token-switch($ink));
        border: 1px solid theme.key-create('#{$component-name}-border', theme.token-switch($default));
    }

    @if $hover or $is-stateful {
        &:hover {
            @include theme.key-bind('#{$component-name}-fill', theme.token-switch($hover));
            @include theme.key-bind('#{$component-name}-ink', theme.token-switch($ink));
            @include theme.key-bind('#{$component-name}-border', theme.token-switch($hover));
        }
    }

    @if $focus or $is-stateful {
        &:focus {
            @include theme.key-bind('#{$component-name}-fill', theme.token-switch($focus));
            @include theme.key-bind('#{$component-name}-ink', theme.token-switch($ink));
            @include theme.key-bind('#{$component-name}-border', theme.token-switch($focus));
        }
    }

    @if $active or $is-stateful {
        &:active {
            @include theme.key-bind('#{$component-name}-fill', theme.token-switch($active));
            @include theme.key-bind('#{$component-name}-ink', theme.token-switch($ink));
            @include theme.key-bind('#{$component-name}-border', theme.token-switch($active));
        }
    }

    @if $disabled or $is-stateful {
        &:disabled {
            @include theme.key-bind('#{$component-name}-fill', theme.token-switch($disabled));
            @include theme.key-bind('#{$component-name}-ink', theme.token-switch($ink));
            @include theme.key-bind('#{$component-name}-border', theme.token-switch($disabled));

            &:hover {
                @include theme.key-bind('#{$component-name}-fill', theme.token-switch($disabled));
                @include theme.key-bind('#{$component-name}-ink', theme.token-switch($ink));
                @include theme.key-bind('#{$component-name}-border', theme.token-switch($disabled));
            }
        }
    }
}