import { Component } from '@angular/core';
import {
  MatFormField,
  MatLabel,
  MatHint,
  MatPrefix,
  MatSuffix,
  MatFormFieldModule,
} from '@angular/material/form-field';
import { MatInput } from '@angular/material/input';
import { MatIcon } from '@angular/material/icon';
import {
  MatButtonModule,
  MatIconAnchor,
  MatIconButton,
} from '@angular/material/button';
import { MatTooltip } from '@angular/material/tooltip';
import { RouterLink } from '@angular/router';
import { FormsModule } from '@angular/forms';
import { MatOption, MatSelect } from '@angular/material/select';

interface Food {
  value: string;
  viewValue: string;
}

@Component({
  selector: 'bgui-forms-fields',
  standalone: true,
  imports: [
    MatFormField,
    MatFormFieldModule,
    MatLabel,
    MatHint,
    MatButtonModule,
    MatInput,
    MatPrefix,
    MatSuffix,
    MatIcon,
    MatIconButton,
    MatTooltip,
    MatIconAnchor,
    RouterLink,
    FormsModule,
    MatSelect,
    MatOption,
  ],
  templateUrl: './forms-fields.component.html',
  styleUrl: './forms-fields.component.scss',
})
export class FormsFieldsComponent {
  value = 'Clear me';

  foods: Food[] = [
    { value: 'steak-0', viewValue: 'Steak' },
    { value: 'pizza-1', viewValue: 'Pizza' },
    { value: 'tacos-2', viewValue: 'Tacos' },
  ];
}