Nebular timepicker input shows 'date' instead of 'time' when the time is removed

Question

There is a strange thing happening with nebular time picker. Every time I try to remove the 'time' from the nebular time picker input, it shows date instead.

The code I have added in my files-

app.module.ts

@NgModule({
  declarations: [AppComponent],
  imports: [
    NbTimepickerModule.forRoot({
      localization: {
        hoursText: 'Hr',
        minutesText: 'Min',
        secondsText: 'Sec',
        ampmText: 'Am/Pm',
      },
    }),
  ],
  providers: [CanDeactivateGuard],
  exports: [TranslateModule],
  bootstrap: [AppComponent],
})

.html

<input
   class="mt-2 mb-1"
   nbInput fullWidth
   type="text"
   placeholder="HH:MM"
   formControlName="examTimeFb"
   required
   [status]="(myForm.controls['examTimeFb'].dirty ||
   myForm.controls['examTimeFb'].touched) ?
   (myForm.controls['examTimeFb'].invalid ?
   'danger' : 'success') : 'basic'"
   [nbTimepicker]="timepicker"/>
<nb-timepicker #timepicker twelveHoursFormat></nb-timepicker>

.ts

 this.myForm = this.fb.group({
    examTimeFb: [this.examTime ? this.examTime : '', Validators.required],
});

This is how the time looks when it is selected from the nebular input by pressing on the 'ok' button available.

But when this time is backspaced and removed, it changes to-

-->

I have even tried to change the formcontrol value to a blank string, null using -

(blur)="dateManage()"

and tried to implement with [(ngModel)], the timepicker behaves the same way in all cases. What am I doing wrong? Or what can be done to fix this issue?