<clr-modal [(clrModalOpen)]="opened" [clrModalStaticBackdrop]="staticBackdrop" [clrModalClosable]="false">
    <h3 class="modal-title">{{'SIGN_UP.TITLE' | translate}}</h3>
    <inline-alert class="modal-title" (confirmEvt)="confirmCancel($event)"></inline-alert>
    <div class="modal-body" style="overflow-y: hidden;">
        <new-user-form isSelfRegistration="true" (valueChange)="formValueChange($event)"></new-user-form>
    </div>
    <div class="modal-footer">
        <span class="spinner spinner-inline" style="top:8px;" [hidden]="inProgress === false"> </span>
        <button type="button" class="btn btn-outline" (click)="close()">{{'BUTTON.CANCEL' | translate}}</button>
        <button type="button" class="btn btn-primary" [disabled]="!isValid || inProgress" (click)="create()">{{ 'BUTTON.SIGN_UP' | translate }}</button>
    </div>
</clr-modal>