{{#create-account email=accountEmail disabled=submitDisabled action=(action "createAccount")}}
  {{#unless complete}}
    {{plugin-outlet name="create-account-before-modal-body"}}
    {{#d-modal-body title="create_account.title" class=(concat (if hasAtLeastOneLoginButton "has-alt-auth") " " (if userFields "has-user-fields"))}}

      {{#unless hasAuthOptions}}
        {{login-buttons externalLogin=(action "externalLogin")}}
      {{/unless}}

      {{#if showCreateForm}}
        <div class="login-form">
          <form>
            <table>
              <tbody>
                <tr class="input create-account-email">
                  <td class="label"><label for="new-account-email">{{i18n "user.email.title"}}</label></td>
                  <td>
                    {{input type="email" value=accountEmail id="new-account-email" disabled=emailValidated name="email" autofocus="autofocus"}}
                  </td>
                </tr>

                <tr class="instructions create-account-email">
                  <td></td>
                  {{input-tip validation=emailValidation id="account-email-validation"}}
                  <td><label>{{i18n "user.email.instructions"}}</label></td>
                </tr>

                {{#if usernameRequired}}
                  <tr class="input">
                    <td class="label"><label for="new-account-username">{{i18n "user.username.title"}}</label></td>
                    <td>
                      {{input value=accountUsername id="new-account-username" name="username" maxlength=maxUsernameLength autocomplete="discourse"}}
                    </td>
                  </tr>
                  <tr class="instructions">
                    <td></td>
                    {{input-tip validation=usernameValidation id="username-validation"}}
                    <td><label>{{i18n "user.username.instructions"}}</label></td>
                  </tr>
                {{/if}}

                {{#if fullnameRequired}}
                  <tr class="input">
                    <td class="label">
                      <label for="new-account-name">{{i18n "user.name.title"}}</label>
                    </td>
                    <td>
                      {{text-field value=accountName id="new-account-name"}}
                    </td>
                  </tr>
                  <tr class="instructions">
                    <td></td>
                    {{input-tip validation=nameValidation}}
                    <td><label>{{nameInstructions}}</label></td>
                  </tr>
                {{/if}}

                {{plugin-outlet
                  name="create-account-before-password"
                  noTags=true
                  args=(hash
                    accountName=accountName
                    accountUsername=accountUsername
                    accountPassword=accountPassword
                    userFields=userFields
                    authOptions=authOptions
                  )
                }}

                {{#if passwordRequired}}
                  <tr class="input">
                    <td class="label"><label for="new-account-password">{{i18n "user.password.title"}}</label></td>
                    <td>
                      {{password-field value=accountPassword type="password" id="new-account-password" capsLockOn=capsLockOn}}
                    </td>
                  </tr>
                  <tr class="instructions">
                    <td></td>
                    {{input-tip validation=passwordValidation}}
                    <td>
                      <label>{{passwordInstructions}}</label>
                      <div class="caps-lock-warning {{unless capsLockOn "hidden"}}">
                        {{d-icon "exclamation-triangle"}} {{i18n "login.caps_lock_warning"}}
                      </div>
                    </td>
                  </tr>
                {{/if}}

                <tr class="password-confirmation">
                  <td><label for="new-account-password-confirmation">{{i18n "user.password_confirmation.title"}}</label></td>
                  <td>
                    {{honeypot-input id="new-account-confirmation" autocomplete="new-password" value=accountHoneypot}}
                    {{input value=accountChallenge id="new-account-challenge"}}
                  </td>
                </tr>

                {{#if requireInviteCode }}
                  <tr class="invite-code">
                    <td><label for="invite-code">{{i18n "user.invite_code.title"}}</label></td>
                    <td>
                      {{input value=inviteCode id="inviteCode"}}
                    </td>
                    <td><label>{{i18n "user.invite_code.instructions"}}</label></td>
                  </tr>
                {{/if}}

                {{plugin-outlet
                  name="create-account-after-password"
                  noTags=true
                  args=(hash
                    accountName=accountName
                    accountUsername=accountUsername
                    accountPassword=accountPassword
                    userFields=userFields
                  )
                }}
              </tbody>
            </table>

            {{#if userFields}}
              <div class="user-fields">
                {{#each userFields as |f|}}
                  {{user-field field=f.field value=f.value}}
                {{/each}}
              </div>
            {{/if}}
          </form>
        </div>
      {{/if}}
    {{/d-modal-body}}

    {{#if showCreateForm}}
      <div class="modal-footer">
        {{d-button
          class="btn-large btn-primary"
          action=(action "createAccount")
          disabled=submitDisabled
          label="create_account.title"
        }}

        {{#conditional-loading-spinner condition=formSubmitted size="small"}}
          {{#d-button class="btn-large" id="login-link" action=(route-action "showLogin")}}
            {{i18n "log_in"}}
          {{/d-button}}
        {{/conditional-loading-spinner}}

        <div class="disclaimer">{{html-safe disclaimerHtml}}</div>
      </div>

      {{plugin-outlet name="create-account-after-modal-footer" tagName=""}}
    {{/if}}
  {{/unless}}
{{/create-account}}
