import {Component, output} from '@angular/core';
import {NzIconDirective} from "ng-zorro-antd/icon";
import {NzColDirective} from "ng-zorro-antd/grid";
import {NzFlexDirective} from "ng-zorro-antd/flex";
import {NzFormControlComponent, NzFormDirective, NzFormItemComponent} from "ng-zorro-antd/form";
import {FormControl, FormGroup, ReactiveFormsModule} from "@angular/forms";

@Component({
    selector: 'app-search',
    imports: [
        NzIconDirective,
        NzColDirective,
        NzFlexDirective,
        NzFormControlComponent,
        NzFormDirective,
        NzFormItemComponent,
        ReactiveFormsModule
    ],
    templateUrl: './search.html',
    styleUrl: './search.css',
})
export class Search {
    searchForm: FormGroup = new FormGroup({
        searchValue: new FormControl<string>(null)
    })

    searchEvent = output<string>();

    OnSearch(): void {
        const raw = this.searchForm.controls['searchValue'].value ?? '';
        const value = String(raw).trim();
        this.searchEvent.emit(value);

    }
}