diff --git a/projects/legacy/components/arrow/arrow.component.ts b/projects/legacy/components/arrow/arrow.component.ts index 198d217b54b0..a56222e45a07 100644 --- a/projects/legacy/components/arrow/arrow.component.ts +++ b/projects/legacy/components/arrow/arrow.component.ts @@ -1,5 +1,6 @@ import {AsyncPipe, NgIf} from '@angular/common'; -import {ChangeDetectionStrategy, Component, inject} from '@angular/core'; +import {ChangeDetectionStrategy, Component, computed, inject} from '@angular/core'; +import {toSignal} from '@angular/core/rxjs-interop'; import {TuiIcon} from '@taiga-ui/core/components/icon'; import {TuiDropdownOpen} from '@taiga-ui/core/directives/dropdown'; import {tuiSizeBigger} from '@taiga-ui/core/utils/miscellaneous'; @@ -11,6 +12,7 @@ import { PolymorpheusOutlet, PolymorpheusTemplate, } from '@taiga-ui/polymorpheus'; +import {of} from 'rxjs'; import {TUI_ARROW_OPTIONS} from './arrow.options'; @@ -25,7 +27,7 @@ import {TUI_ARROW_OPTIONS} from './arrow.options'; styleUrls: ['./arrow.style.less'], changeDetection: ChangeDetectionStrategy.OnPush, host: { - '[class._rotated]': 'rotated', + '[class._rotated]': 'rotated()', '[class._small]': 'small', }, }) @@ -33,11 +35,13 @@ export class TuiArrowComponent { private readonly control: any = inject(AbstractTuiControl, {optional: true}); private readonly textfieldSize = inject(TUI_TEXTFIELD_SIZE); private readonly options = inject(TUI_ARROW_OPTIONS); - protected readonly directive = inject(TuiDropdownOpen, {optional: true}); + protected readonly dropdownOpen = toSignal( + inject(TuiDropdownOpen, {optional: true})?.tuiDropdownOpenChange || of(false), + ); - protected get rotated(): boolean { - return this.directive?.tuiDropdownOpen || !!this.control.pseudoOpen || false; - } + protected readonly rotated = computed( + () => this.dropdownOpen() || this.control.pseudoOpen?.(), + ); protected get small(): boolean { return !tuiSizeBigger(this.textfieldSize.size); diff --git a/projects/legacy/components/arrow/arrow.template.html b/projects/legacy/components/arrow/arrow.template.html index 560a57f74c8a..8a291f72f5fd 100644 --- a/projects/legacy/components/arrow/arrow.template.html +++ b/projects/legacy/components/arrow/arrow.template.html @@ -2,4 +2,3 @@ *polymorpheusOutlet="arrowIcon as src" [icon]="src" /> - diff --git a/projects/legacy/components/input-tag/input-tag.component.ts b/projects/legacy/components/input-tag/input-tag.component.ts index 94e37c4abdca..a6007c0cf133 100644 --- a/projects/legacy/components/input-tag/input-tag.component.ts +++ b/projects/legacy/components/input-tag/input-tag.component.ts @@ -8,6 +8,7 @@ import { inject, Input, Output, + signal, TemplateRef, ViewChild, ViewChildren, @@ -159,12 +160,6 @@ export class TuiInputTagComponent @Input() public removable = true; - /** - * @deprecated hack - */ - @Input() - public pseudoOpen = false; - @Input() public disabledItemHandler: TuiBooleanHandler | string> = TUI_FALSE_HANDLER; @@ -172,6 +167,8 @@ export class TuiInputTagComponent @Output() public readonly searchChange = new EventEmitter(); + public pseudoOpen = signal(false); + @Input('pseudoFocused') public set pseudoFocusedSetter(value: boolean | null) { if (!value && !this.focused) { @@ -181,6 +178,14 @@ export class TuiInputTagComponent this.pseudoFocus = value; } + /** + * @deprecated hack + */ + @Input('pseudoOpen') + public set setPseudoOpen(value: boolean) { + this.pseudoOpen.set(value); + } + public get labelOutside(): boolean { const {size, labelOutside} = this.controller;