import { AfterContentChecked, Directive, ElementRef, HostBinding } from '@angular/core';

@Directive({
    selector: '[iqserHasScrollbar]',
    exportAs: 'iqserHasScrollbar'
})
export class HasScrollbarDirective implements AfterContentChecked {
    @HostBinding('class') class = '';

    constructor(private readonly _elementRef: ElementRef) {}

    get hasScrollbar(): boolean {
        const element = this._elementRef?.nativeElement as HTMLElement;
        return element.clientHeight < element.scrollHeight;
    }

    ngAfterContentChecked(): void {
        this._process();
    }

    _process(): void {
        const newClass = this.hasScrollbar ? 'has-scrollbar' : '';
        if (this.class !== newClass) {
            this.class = newClass;
        }
    }
}