// ============================================================================================= //
//                                             TEST                                              //
// ============================================================================================= //

@use "pkg:sass-true" as *;
@use "../functions";

@include describe("core") {
    @include describe("functions") {
        @include describe("create-name()") {
            @include it("Should return theme property name.") {
                @include assert-equal(functions.create-name("button", "text-color"), "mg-button-text-color");
            }
        }

        @include describe("validation()") {
            @include it("Should return validated theme tokens.") {
                $refs: (
                    "text-color": darkcyan,
                    "text-size": 16px
                );

                $theme: (
                    "text-color": darkorange
                );

                @include assert-equal(functions.validation($refs, $theme), $theme);
            }
        }

        @include describe("create-theme-vars()") {
            @include it("Should return a map of tokens with `var()` CSS function.") {
                $tokens: (
                    "text-color": darkcyan,
                    "text-size": 16px,
                    "padding": (
                        "top": 12px
                    )
                );

                @include assert-equal(functions.create-theme-vars($tokens, "button"), (
                    "text-color": var(--mg-button-text-color, darkcyan),
                    "text-size": var(--mg-button-text-size, 16px),
                    "padding": (
                        "top": var(--mg-button-padding-top, 12px)
                    )
                ));
            }

            @include it("Should return a map of tokens with `var()` CSS function without component name.") {
                $tokens: (
                    "text-color": darkcyan,
                    "text-size": 16px,
                    "padding": (
                        "top": 12px
                    )
                );

                @include assert-equal(functions.create-theme-vars($tokens, null), (
                    "text-color": var(--mg-text-color, darkcyan),
                    "text-size": var(--mg-text-size, 16px),
                    "padding": (
                        "top": var(--mg-padding-top, 12px)
                    )
                ));
            }
        }

        @include describe("emit-variable()") {
            @include it("Should return theme CSS variable.") {
                $tokens: (
                    "text-color": darkcyan,
                    "text-size": 16px
                );

                @include assert-equal(functions.emit-variable($tokens, "text-color", false, "button"), var(--mg-button-text-color));
            }

            @include it("Should return validated theme tokens with fallback.") {
                $tokens: (
                    "text-color": darkcyan,
                    "text-size": 16px
                );

                @include assert-equal(functions.emit-variable($tokens, "text-color", true, "button"), var(--mg-button-text-color, darkcyan));
            }
        }
    }
}