import {
    Directive,
    ElementRef,
    Input,
    OnChanges,
} from '@angular/core';

@Directive({
    selector: '[delayedClassRemoval]',
})
export class DelayedClassRemovalDirective implements OnChanges {
    @Input('delayedClassRemoval')
    public classNameConditionMap: { [key: string]: boolean };

    constructor(
        private _elementRef: ElementRef,
    ) {}

    public ngOnChanges() {
        for (const className in this.classNameConditionMap) {
            if (this.classNameConditionMap[className]) {
                this._elementRef.nativeElement.classList.add(
                    className,
                );
            } else {
                setTimeout(() => {
                    this._elementRef.nativeElement.classList.remove(
                        className,
                    );
                });
            }
        }
    }
}