@use '../../base' as *;
@use 'sass:string';

/// @access private
/// @author <a href="https://github.com/simeonoff" target="_blank">Simeon Simeonoff</a>
@mixin component {
    @include b(igx-overlay) {
        $this: bem--selector-to-string(&);
        @include register-component(
            $name: string.slice($this, 2, -1),
            $deps: ()
        );

        @extend %overlay-display !optional;

        @include e(wrapper) {
            @extend %overlay-wrapper !optional;
        }

        @include e(wrapper, $m: modal) {
            @extend %overlay-wrapper !optional;
            @extend %overlay-wrapper--modal !optional;
        }

        @include e(wrapper, $m: flex) {
            @extend %overlay-wrapper !optional;
            @extend %overlay-wrapper--flex !optional;
        }

        @include e(wrapper, $m: flex-container) {
            @extend %overlay-wrapper !optional;
            @extend %overlay-wrapper--flex-container !optional;
        }

        @include e(content) {
            @extend %overlay-content !optional;
        }

        @include e(content, $m: modal) {
            @extend %overlay-content !optional;
            @extend %overlay-content--modal !optional;
        }

        @include e(content, $m: elastic) {
            @extend %overlay-content !optional;
            @extend %overlay-content--elastic !optional;
        }

        @include e(content, $m: relative) {
            @extend %overlay-content !optional;
            @extend %overlay-content--relative !optional;
        }
    }

    @include b(igx-toggle) {
        @include m(hidden) {
            @extend %igx-toggle--hidden !optional;
        }

        @include m(hidden-webkit) {
            @extend %igx-toggle--hidden-webkit !optional;
        }
    }
}