import {Directive, ElementRef, EventEmitter, Host, HostListener, Output} from '@angular/core';

@Directive({
  selector: '[dropdownOutsideClick]'
})
export class DropdownOutsideClickDirective {

  @Host() hs: any;
  constructor(private _elementRef: ElementRef) {
  }

  @Output('dropdownOutsideClick')
  public onDropdownOutsideClick: EventEmitter<any> = new EventEmitter();

  @HostListener('document:click', ['$event', '$event.target'])


  public onClick($event, targetElement) {
    const clickedInside = this._elementRef.nativeElement.contains(targetElement);
    if (!clickedInside) {
      this.onDropdownOutsideClick.emit({clickOutside: true});
    }
  }
}
