import { html, when } from '@microsoft/fast-element';
import { backButton, organisationField, password2Field, passwordField, showPasswordsCheckbox, submitButton, usernameField, } from '../base';
export const ResetPasswordTemplate = html `
  <login-background>
    <div class="container">
      <zero-card class="card-pd">
        <div class="column-content">
          <login-logo></login-logo>
          <div class="heading2" data-test-id="heading">${(x) => x.headingText}</div>
          <div class="heading3">Enter the username registered to your account</div>
        </div>
        <form @submit=${(x) => x.onSubmit()} autocomplete="on">
          ${organisationField()} ${usernameField()}
          ${when((x) => !x.passwordResetToken, html `
              ${passwordField('Old Password')}
            `)}
          ${password2Field('new')} ${showPasswordsCheckbox()}
          <div class="form-buttons">
            ${submitButton('Change Password')} ${backButton((x) => x.onBack())}
          </div>
          <submitting-indicator is-submitting="${(x) => x.isSubmitting}"></submitting-indicator>
          <login-message
            message="${(x) => x.message}"
            non-error="${(x) => !x.hasErrors}"
          ></login-message>
        </form>
      </zero-card>
    </div>
  </login-background>
`;
//# sourceMappingURL=reset-password.template.js.map