<mat-form-field appearance="outline" class="form-field-with-button wide">
  <mat-label>Rok URL</mat-label>
  <input matInput type="url" [formControl]="control" />
  <button
    matSuffix
    matTolltip="Choose RokURL"
    type="button"
    (click)="openChooser()"
    [disabled]="control.disabled"
  >
    <img
      *ngIf="control.enabled; else disableTpl"
      src="static/assets/browse-in-rok-blue.svg"
    />
    <ng-template #disableTpl>
      <img src="static/assets/browse-in-rok-grey.svg" />
    </ng-template>
  </button>
  <mat-error>{{ parseRokUrlError() }}</mat-error>
  <mat-hint *ngIf="control.valid && dateTime"
    >Restoring {{ snapshotType }} from {{ dateTime }}</mat-hint
  >
</mat-form-field>
