<!-- SELECT NORMAL -->
<mat-form-field appearance="outline" *ngIf="tag === 'select' && !multiSelect && !groupSelect">
  <mat-label>{{ label }}</mat-label>
  <mat-select
    (change)="setValue(value)"
    [disabled]=" typeForm === 'REG' ? disabled_reg : disabled_mod"
    [(value)]="value"
    [required]=" typeForm === 'REG' ? required_reg : required_mod"
    [id]="id"
    [attr.data-name]="name">
    <mat-option *ngIf="! ((typeForm === 'REG') ? required_reg : required_mod) ">-- Niniguno --</mat-option>
    <mat-option *ngFor="let dataSelect of arrDataSelect" [value]="dataSelect.valor" (click)="setValue(value)">{{ dataSelect.opcion }}</mat-option>
  </mat-select>
  <mat-icon matSuffix *ngIf="icon !== null">{{ icon }}</mat-icon>
</mat-form-field>

<!-- SELECT MULTIPLE -->
<mat-form-field appearance="outline" *ngIf="tag === 'select' && multiSelect">
  <mat-label>{{ label }}</mat-label>
  <mat-select
    (change)="setValue(value)"
    multiple
    [disabled]="typeForm === 'REG' ? disabled_reg : disabled_mod"
    [(value)]="value"
    [required]="typeForm === 'REG' ? required_reg : required_mod"
    [id]="id">
    <mat-option *ngIf="! ((typeForm === 'REG') ? required_reg : required_mod)">-- Niniguno --</mat-option>
    <mat-option *ngFor="let dataSelect of arrDataSelect" [value]="dataSelect.valor" (click)="setValue(value)">{{ dataSelect.opcion }}</mat-option>
  </mat-select>
  <mat-icon matSuffix *ngIf="icon !== null">{{ icon }}</mat-icon>
</mat-form-field>

<!-- SELECT GRUPO -->
<mat-form-field appearance="outline" *ngIf="tag === 'select' && groupSelect">
  <mat-label>{{ label }}</mat-label>
  <mat-select
    [(ngModel)]="valueData"
    (ngModelChange)="setValue($event)"
    [disabled]="typeForm === 'REG' ? disabled_reg : disabled_mod"
    [(value)]="value"
    [required]="typeForm === 'REG' ? required_reg : required_mod"
    [id]="id">
    <mat-option *ngIf="! ((typeForm === 'REG') ? required_reg : required_mod)">-- Niniguno --</mat-option>
    <mat-optgroup *ngFor="let groups of arrDataSelect" [label]="groups.grupo">
      <mat-option *ngFor="let dataGroup of groups.datos" [value]="dataGroup.valor" (click)="setValue(value)">{{ dataGroup.opcion }}</mat-option>
    </mat-optgroup>
  </mat-select>
  <mat-icon matSuffix *ngIf="icon !== null">{{ icon }}</mat-icon>
</mat-form-field>
