@taiga-ui/kit
Version:
Taiga UI Angular main components kit
62 lines (57 loc) • 2.98 kB
JavaScript
import { __decorate, __param } from 'tslib';
import { Inject, ElementRef, HostListener, Directive, NgModule } from '@angular/core';
import { isPresent, typedFromEvent, isNativeFocusedIn, setNativeMouseFocused, TuiDestroyService } from '@taiga-ui/cdk';
import { TuiHostedDropdownComponent } from '@taiga-ui/core';
import { merge, of, timer, Observable } from 'rxjs';
import { debounceTime, map, filter, share, tap, switchMap, mapTo, debounce, distinctUntilChanged, takeUntil } from 'rxjs/operators';
let TuiDropdownHoverDirective = class TuiDropdownHoverDirective {
constructor(destroy$, { nativeElement }, dropdown) {
this.dropdown = dropdown;
const dropdown$ = dropdown.openChange.pipe(
// Give change detection time to open dropdown
debounceTime(0), map(() => dropdown.dropdown), filter(isPresent), share());
const open$ = merge(typedFromEvent(nativeElement, 'mouseenter'), typedFromEvent(nativeElement, 'click').pipe(tap(e => e.stopImmediatePropagation())), dropdown$.pipe(switchMap(element => merge(typedFromEvent(element, 'focusin'), typedFromEvent(element, 'mouseenter'))))).pipe(mapTo(true));
const close$ = merge(typedFromEvent(nativeElement, 'mouseleave'), dropdown$.pipe(switchMap(element => typedFromEvent(element, 'mouseleave').pipe(filter(() => !isNativeFocusedIn(element)))))).pipe(mapTo(false));
merge(open$, close$)
.pipe(debounce(value => (value ? of(value) : timer(300))), distinctUntilChanged(), takeUntil(destroy$))
.subscribe(open => {
dropdown.updateOpen(open);
});
}
onMouseEnter() {
const { nativeFocusableElement } = this.dropdown;
if (nativeFocusableElement) {
setNativeMouseFocused(nativeFocusableElement);
}
}
};
TuiDropdownHoverDirective.ctorParameters = () => [
{ type: Observable, decorators: [{ type: Inject, args: [TuiDestroyService,] }] },
{ type: ElementRef, decorators: [{ type: Inject, args: [ElementRef,] }] },
{ type: TuiHostedDropdownComponent, decorators: [{ type: Inject, args: [TuiHostedDropdownComponent,] }] }
];
__decorate([
HostListener('mouseenter')
], TuiDropdownHoverDirective.prototype, "onMouseEnter", null);
TuiDropdownHoverDirective = __decorate([
Directive({
selector: 'tui-hosted-dropdown[tuiDropdownHover]',
providers: [TuiDestroyService],
}),
__param(0, Inject(TuiDestroyService)),
__param(1, Inject(ElementRef)),
__param(2, Inject(TuiHostedDropdownComponent))
], TuiDropdownHoverDirective);
let TuiDropdownHoverModule = class TuiDropdownHoverModule {
};
TuiDropdownHoverModule = __decorate([
NgModule({
declarations: [TuiDropdownHoverDirective],
exports: [TuiDropdownHoverDirective],
})
], TuiDropdownHoverModule);
/**
* Generated bundle index. Do not edit.
*/
export { TuiDropdownHoverDirective, TuiDropdownHoverModule };
//# sourceMappingURL=taiga-ui-kit-directives-dropdown-hover.js.map