From a94c6f68ec1aad9268dfa2e11012e3b82bb4185b Mon Sep 17 00:00:00 2001
From: KenTandrian <kenricktan11@gmail.com>
Date: Sun, 8 Mar 2026 13:06:48 +0700
Subject: [PATCH] feat(lib): view child signal for tagInput

---
 libs/ui/src/lib/tags-selector/tags-selector.component.ts | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/libs/ui/src/lib/tags-selector/tags-selector.component.ts b/libs/ui/src/lib/tags-selector/tags-selector.component.ts
index 0f7e9cd16..a77721bd6 100644
--- a/libs/ui/src/lib/tags-selector/tags-selector.component.ts
+++ b/libs/ui/src/lib/tags-selector/tags-selector.component.ts
@@ -9,7 +9,7 @@ import {
   OnChanges,
   OnInit,
   signal,
-  ViewChild
+  viewChild
 } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import {
@@ -64,13 +64,14 @@ export class GfTagsSelectorComponent
   @Input() tags: Tag[];
   @Input() tagsAvailable: Tag[];
 
-  @ViewChild('tagInput') tagInput: ElementRef<HTMLInputElement>;
-
   public filteredOptions: Subject<Tag[]> = new BehaviorSubject([]);
   public readonly separatorKeysCodes: number[] = [COMMA, ENTER];
   public readonly tagInputControl = new FormControl('');
   public readonly tagsSelected = signal<Tag[]>([]);
 
+  private readonly tagInput =
+    viewChild.required<ElementRef<HTMLInputElement>>('tagInput');
+
   public constructor() {
     this.tagInputControl.valueChanges
       .pipe(takeUntilDestroyed())
@@ -114,7 +115,7 @@ export class GfTagsSelectorComponent
       this.onTouched();
     }
 
-    this.tagInput.nativeElement.value = '';
+    this.tagInput().nativeElement.value = '';
     this.tagInputControl.setValue(null);
   }