@if(label) {
      <div class="w-100 d-flex justify-content-between align-items-center h-label label-mb ">
        <mat-label [class.required]="isControlRequired()">{{label}}</mat-label>
        @if(descriptionTooltip) {
            <button 
              class="action-icon-info d-flex align-items-center justify-content-center p-0 "
              matTooltipClass="custom-tooltip">
                  <lucide-angular
                    [size]="16"
                    [color]="'#5D6F85'"
                    [img]="infoCircle"
                    [kitTooltip]="''"
                    [tooltipDescription]="descriptionTooltip"
                    [tooltipPosition]="'top'">
                  </lucide-angular>
            </button>
        }
    </div>
}
<mat-form-field class="example-full-width w-100 custom-label-outside autocomplete-custom" appearance="outline" floatLabel="always">

  <input #search type="text" matInput [formControl]="control" [placeholder]="placeholderText"
    [matAutocomplete]="searchAuto" (keydown.enter)="$event.preventDefault()" />
  <mat-autocomplete #searchAuto="matAutocomplete" (optionSelected)="selectedDirection($event)">
    @if(predictionList && predictionList.length > 0){
    @for (prediction of predictionList; track prediction) {
    <mat-option [value]="prediction"> 
      <lucide-angular matPrefix class="iconMappingOption" size="16" [img]="mappin" ></lucide-angular>
      {{ prediction.description
      }}</mat-option>
    } @empty {
    @if (!control.value) {
    <mat-option>Ingrese {{placeholderText}}. Ej:Nombre comuna y N°</mat-option>
    }
    @if (control.value && control.valid && options.length === 0 ) {
    <mat-option>Intente con otra {{placeholderText}}.</mat-option>
    }
    }
    }
  </mat-autocomplete>
  <lucide-angular matPrefix color="#5D6F85" size="16" [img]="searchI" ></lucide-angular>

  @if (control?.hasError('required')) {
  <mat-error>{{label? label: 'Este campo'}} es <strong>requerido</strong></mat-error>
  }
  @if (control?.hasError('commonError')) {
  <mat-error>{{addressValidationMessage}}</mat-error>
  }
</mat-form-field>