From 65981bcaefcce811891887a697c496d53108fce2 Mon Sep 17 00:00:00 2001 From: Alex Inkin Date: Thu, 26 Sep 2024 17:17:20 +0400 Subject: [PATCH] fix(legacy): `Input` fix [(tuiDropdownOpen)] (#9214) --- projects/kit/components/tabs/tab.directive.ts | 9 +++++++-- .../pipes/filter-by-input/filter-by-input.pipe.ts | 15 +++++++++------ projects/legacy/components/input/input.module.ts | 8 +++++++- 3 files changed, 23 insertions(+), 9 deletions(-) diff --git a/projects/kit/components/tabs/tab.directive.ts b/projects/kit/components/tabs/tab.directive.ts index a075ea7faa9b..ef7916af3abb 100644 --- a/projects/kit/components/tabs/tab.directive.ts +++ b/projects/kit/components/tabs/tab.directive.ts @@ -7,7 +7,7 @@ import {tuiTypedFromEvent} from '@taiga-ui/cdk/observables'; import {tuiInjectElement} from '@taiga-ui/cdk/utils/dom'; import {tuiIsNativeFocused} from '@taiga-ui/cdk/utils/focus'; import {TuiWithIcons} from '@taiga-ui/core/directives/icons'; -import {EMPTY, filter, merge} from 'rxjs'; +import {EMPTY, filter, merge, switchMap} from 'rxjs'; export const TUI_TAB_ACTIVATE = 'tui-tab-activate'; @@ -32,7 +32,12 @@ export class TuiTab implements OnDestroy { protected readonly sub = merge( this.observer || EMPTY, this.rla?.isActiveChange.pipe(filter(Boolean)) || EMPTY, - this.el.matches('button') ? tuiTypedFromEvent(this.el, 'click') : EMPTY, + this.el.matches('button') + ? tuiTypedFromEvent(this.el, 'click').pipe( + // Delaying execution until after all other click callbacks + switchMap(() => tuiTypedFromEvent(this.el.parentElement!, 'click')), + ) + : EMPTY, ) .pipe(takeUntilDestroyed()) .subscribe(() => diff --git a/projects/kit/pipes/filter-by-input/filter-by-input.pipe.ts b/projects/kit/pipes/filter-by-input/filter-by-input.pipe.ts index 348355ba0f3f..572d4f0a4f00 100644 --- a/projects/kit/pipes/filter-by-input/filter-by-input.pipe.ts +++ b/projects/kit/pipes/filter-by-input/filter-by-input.pipe.ts @@ -2,7 +2,7 @@ import type {PipeTransform} from '@angular/core'; import {inject, Pipe} from '@angular/core'; import {TUI_DEFAULT_MATCHER} from '@taiga-ui/cdk/constants'; import type {TuiStringHandler, TuiStringMatcher} from '@taiga-ui/cdk/types'; -import {tuiIsPresent, tuiPure} from '@taiga-ui/cdk/utils/miscellaneous'; +import {tuiPure} from '@taiga-ui/cdk/utils/miscellaneous'; import {TUI_DATA_LIST_HOST} from '@taiga-ui/core/components/data-list'; import {TuiTextfieldComponent} from '@taiga-ui/core/components/textfield'; import {tuiIsFlat} from '@taiga-ui/kit/utils'; @@ -57,7 +57,7 @@ export class TuiFilterByInputPipe implements PipeTransform { ): readonly T[] { const match = this.getMatch(items, stringify, query); - return tuiIsPresent(match) + return match != null ? items : items.filter((item) => matcher(item, query, stringify)); } @@ -68,11 +68,9 @@ export class TuiFilterByInputPipe implements PipeTransform { stringify: TuiStringHandler, query: string, ): ReadonlyArray { - const match = items.find((item) => - tuiIsPresent(this.getMatch(item, stringify, query)), - ); + const match = items.find((item) => this.getMatch(item, stringify, query) != null); - return tuiIsPresent(match) + return match != null ? items : items.map((inner) => this.filterFlat(inner, matcher, stringify, query)); } @@ -82,6 +80,11 @@ export class TuiFilterByInputPipe implements PipeTransform { stringify: TuiStringHandler, query: string, ): T | undefined { + // TODO: Refactor when tui-textfield[multi] is ready + if ((this.host as any).tagValidator) { + return undefined; + } + return items.find( (item) => stringify(item).toLocaleLowerCase() === query.toLocaleLowerCase(), ); diff --git a/projects/legacy/components/input/input.module.ts b/projects/legacy/components/input/input.module.ts index 2d297e34e1c0..90daaf7250ae 100644 --- a/projects/legacy/components/input/input.module.ts +++ b/projects/legacy/components/input/input.module.ts @@ -5,12 +5,18 @@ import { TuiPrimitiveTextfieldModule, TuiTextfieldComponent, } from '@taiga-ui/legacy/components/primitive-textfield'; +import {TuiLegacyDropdownOpenMonitorDirective} from '@taiga-ui/legacy/directives'; import {TuiInputComponent} from './input.component'; import {TuiInputDirective} from './input.directive'; @NgModule({ - imports: [CommonModule, TuiPrimitiveTextfieldModule, ...TuiDropdown], + imports: [ + CommonModule, + TuiPrimitiveTextfieldModule, + ...TuiDropdown, + TuiLegacyDropdownOpenMonitorDirective, + ], declarations: [TuiInputComponent, TuiInputDirective], exports: [ TuiInputComponent,