fix: linter

taiga-family · Nov 3, 2024 · 4383a77 · 4383a77
1 parent 3446afd
commit 4383a77
Show file tree

Hide file tree

Showing 5 changed files with 93 additions and 81 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/projects/addon-doc/components/navigation/navigation.component.ts b/projects/addon-doc/components/navigation/navigation.component.ts
@@ -56,8 +56,12 @@ export class TuiDocNavigationComponent {
 
     readonly search = new FormControl('');
 
+    readonly isOpened$ = tuiControlValue<string>(this.search).pipe(
+        map(val => this.isValidSearch(val)),
+    );
+
     readonly filtered$ = tuiControlValue<string>(this.search).pipe(
-        filter(search => search.trim().length > 2),
+        filter(val => this.isValidSearch(val)),
         map(search => this.filterItems(this.flattenSubPages(this.items), search)),
     );
 
@@ -109,14 +113,14 @@ export class TuiDocNavigationComponent {
             .subscribe(anchor => this.navigateToAnchorLink(anchor));
     }
 
-    get canOpen(): boolean {
-        return (this.search.value?.length ?? 0) > 2;
-    }
-
     get itemsWithoutSections(): TuiDocPages {
         return this.items[this.items.length - 1];
     }
 
+    isValidSearch(search: string): boolean {
+        return search.trim().length > 2;
+    }
+
     $pages(pages: any): readonly TuiDocPage[] {
         return pages as TuiDocPage[];
     }

diff --git a/projects/addon-doc/components/navigation/navigation.template.html b/projects/addon-doc/components/navigation/navigation.template.html
@@ -3,25 +3,43 @@
     tuiTextfieldSize="m"
     class="t-input"
     [formControl]="search"
+    [isOpened]="isOpened$ | async"
     [tuiAutoFocus]="!!sidebar"
     [tuiTextfieldCleaner]="true"
     [tuiTextfieldIconLeft]="docIcons.search"
     [tuiTextfieldLabelOutside]="true"
 >
     {{ searchText }}
-    <ng-container *ngIf="canOpen">
-        <tui-data-list *tuiDataList>
-            <tui-opt-group
-                *ngFor="let group of filtered$ | async; let index = index"
-                [label]="labels[index] || ''"
-            >
-                <ng-container *ngFor="let item of group">
+
+    <tui-data-list *tuiDataList>
+        <tui-opt-group
+            *ngFor="let group of filtered$ | async; let index = index"
+            [label]="labels[index] || ''"
+        >
+            <ng-container *ngFor="let item of group">
+                <a
+                    *ngIf="item.route.includes('://'); else internal"
+                    tuiOption
+                    [attr.rel]="item.rel"
+                    [href]="item.route"
+                    [target]="item.target || '_self'"
+                >
+                    {{ item.title }}
+                    <tui-svg
+                        *polymorpheusOutlet="item.icon as icon"
+                        class="t-icon"
+                        [src]="icon"
+                    ></tui-svg>
+                </a>
+
+                <ng-template #internal>
                     <a
-                        *ngIf="item.route.includes('://'); else internal"
                         tuiOption
                         [attr.rel]="item.rel"
-                        [href]="item.route"
+                        [fragment]="item.fragment"
+                        [routerLink]="item.route"
                         [target]="item.target || '_self'"
+                        (click)="onClick(input)"
                     >
                         {{ item.title }}
                         <tui-svg
@@ -30,28 +48,10 @@
                             [src]="icon"
                         ></tui-svg>
                     </a>
-
-                    <ng-template #internal>
-                        <a
-                            tuiOption
-                            [attr.rel]="item.rel"
-                            [fragment]="item.fragment"
-                            [routerLink]="item.route"
-                            [target]="item.target || '_self'"
-                            (click)="onClick(input)"
-                        >
-                            {{ item.title }}
-                            <tui-svg
-                                *polymorpheusOutlet="item.icon as icon"
-                                class="t-icon"
-                                [src]="icon"
-                            ></tui-svg>
-                        </a>
-                    </ng-template>
-                </ng-container>
-            </tui-opt-group>
-        </tui-data-list>
-    </ng-container>
+                </ng-template>
+            </ng-container>
+        </tui-opt-group>
+    </tui-data-list>
 </tui-input>
 
 <nav class="t-navigation">

diff --git a/projects/kit/components/input/input.component.ts b/projects/kit/components/input/input.component.ts
@@ -5,6 +5,7 @@ import {
     ContentChild,
     HostBinding,
     Inject,
+    Input,
     Optional,
     Self,
     TemplateRef,
@@ -66,6 +67,15 @@ export class TuiInputComponent
         TuiContextWithImplicit<TuiActiveZoneDirective>
     >;
 
+    @Input()
+    set isOpened(value: boolean | null) {
+        if (value !== null) {
+            this.open = value;
+            this.openedExternally = true;
+        }
+    }
+
+    openedExternally = false;
     open = false;
 
     constructor(
@@ -101,13 +111,12 @@ export class TuiInputComponent
         );
     }
 
-    get canOpen(): boolean {
-        return this.interactive && !!this.datalist;
-    }
-
     onValueChange(value: string): void {
+        if (!this.openedExternally) {
+            this.open = true;
+        }
+
         this.value = value;
-        this.open = true;
     }
 
     onActiveZone(active: boolean): void {
@@ -118,7 +127,6 @@ export class TuiInputComponent
         this.setNativeValue(String(item));
         this.focusInput();
         this.value = String(item);
-        this.open = false;
     }
 
     protected getFallbackValue(): string {

diff --git a/projects/kit/components/input/input.template.html b/projects/kit/components/input/input.template.html
@@ -1,6 +1,5 @@
 <tui-hosted-dropdown
     class="t-hosted"
-    [canOpen]="canOpen"
     [content]="datalist || ''"
     [(open)]="open"
     (tuiActiveZoneChange)="onActiveZone($event)"