<form *ngIf="createOptions" [formGroup]="domainForm">
  <app-form-errors #formErrors [formGroup]="domainForm"></app-form-errors>
  <div layoutDirection="column" appLayoutGap="5px">
    <mat-form-field>
      <mat-label i18n>Name</mat-label>
      <input matInput placeholder="Name" i18n-placeholder type="text" formControlName="name" required>
      <mat-error>{{fieldErrors['name']}}</mat-error>
    </mat-form-field>
    <mat-form-field>
      <mat-label i18n>Domain status</mat-label>
      <mat-select formControlName="status" placeholder="Domain status" i18n-placeholder>
        <mat-option *ngFor="let status of createOptions.statuses" [value]="status.status">
          {{ status.status_display }}
        </mat-option>
      </mat-select>
    </mat-form-field>
    <mat-form-field>
      <mat-label i18n>Registration period</mat-label>
      <input matInput id="registration_period" name="registration_period" type="number"
             placeholder="Registration period" i18n-placeholder
             required formControlName="registration_period">
      <mat-error>{{fieldErrors['registration_period']}}</mat-error>
    </mat-form-field>
  </div>
</form>
