@use "./naming.scss" as naming;

// @description Generate state selector
@mixin use-state-selector ($classname, $state) {
    @if $state == "default" {
        #{$classname} { @content; }
    }
    @if $state == "hover" {
        #{$classname}:hover { @content; }
    }
    @if $state == "focus" {
        #{$classname}:focus { @content; }
    }
}

// @description Generate a component selector
@mixin use-component-selector ($name) {
    #{naming.get-component-classname($name)} { @content; }
}


@use "./naming.scss" as naming;

// @description Generate state selector
@mixin use-state-selector ($classname, $state) {
    @if $state == "default" {
        #{$classname} { @content; }
    }
    @if $state == "hover" {
        #{$classname}:hover { @content; }
    }
    @if $state == "focus" {
        #{$classname}:focus { @content; }
    }
}

// @description Generate a component selector
@mixin use-component-selector ($name) {
    #{naming.get-component-classname($name)} { @content; }
}

// @description generate a variant selector
@mixin use-variant-selector ($name) {
    &#{naming.get-variant-classname($name)} { @content; }
}


Add hook for using a variant selector
Add hook for using a variant selector
