import { ay as validateAlphanumeric, T as Trans, az as ValidateAlphaNumericErrorType, aA as FormGroupError, a$ as MAX_SHORT_TEXT_LENGTH, aC as FormGroup, J as InputGroup, t, K as Env, aF as InputValidationHelper, aS as ValidateRegexErrorType, aR as ValidateLengthErrorType, aU as LegalHelper, b0 as LegalUtils, a as Ctx, aB as Validation, aH as ValidateableInputField, aG as PasswordConstraint, f as Button, a_ as ValidateEmailErrorType, aN as CommonValidationErrorType } from "./index.js";
import { C as Checkbox } from "./Checkbox.js";
import { I as InputGroupPassword } from "./InputPassword.js";
import React__default from "react";
class UpgradeHeadlessVerification extends React__default.Component {
  constructor(props) {
    super(props);
    this.refreshComponent = () => this.setState({});
    this.onVerificationCodeChange = (event) => {
      const verificationCode = event.target.value.toString().toUpperCase();
      const trimSpaceOnPastedVerificationCode = !this.state.isPasteVerificationCode ? verificationCode : verificationCode.replace(/\s/g, "");
      this.props.validation.set("verificationCode", validateAlphanumeric(trimSpaceOnPastedVerificationCode));
      this.props.onChangeVerificationCode(trimSpaceOnPastedVerificationCode);
      this.setState({ isPasteVerificationCode: false });
    };
    this.onPasteVerificationCode = () => {
      this.setState({ isPasteVerificationCode: true });
    };
    this.renderVerificationCodeError = (errorType) => {
      if (!errorType)
        return null;
      switch (errorType) {
        case ValidateAlphaNumericErrorType.empty:
          return /* @__PURE__ */ React__default.createElement(FormGroupError, null, /* @__PURE__ */ React__default.createElement(Trans, {
            i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.verifyCodeError.empty"
          }, "You must enter your verification code"));
        case ValidateAlphaNumericErrorType.exceedLengthLimit:
          return /* @__PURE__ */ React__default.createElement(FormGroupError, null, /* @__PURE__ */ React__default.createElement(Trans, {
            i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.verifyCodeError.ExceedLimit"
          }, "Verification code must not exceed ", { MAX_SHORT_TEXT_LENGTH }, " characters"));
        case ValidateAlphaNumericErrorType.invalidFormat:
          return /* @__PURE__ */ React__default.createElement(FormGroupError, null, /* @__PURE__ */ React__default.createElement(Trans, {
            i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.verifyCodeError.invalidFormat"
          }, "Please enter a valid verification code"));
        default:
          return /* @__PURE__ */ React__default.createElement(Trans, {
            i18nKey: "CommonError.unknownError"
          }, "Something went wrong. Please contact support for assistance.");
      }
    };
    this.state = {
      isPasteVerificationCode: false
    };
  }
  componentDidMount() {
    this.props.validation.listen(this.refreshComponent);
  }
  componentWillUnmount() {
    this.props.validation.unlisten(this.refreshComponent);
  }
  render() {
    const { isRequestingVerificationCode, onRequestVerificationCode, verificationCode, onChangePage, validation, styles } = this.props;
    return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(FormGroup, {
      className: styles.formGroup
    }, /* @__PURE__ */ React__default.createElement("div", {
      className: styles.label
    }, /* @__PURE__ */ React__default.createElement(Trans, {
      i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.verificationCode"
    }, "Verification Code")), /* @__PURE__ */ React__default.createElement(InputGroup, {
      type: "text",
      value: verificationCode || "",
      className: styles.input,
      placeholder: t("UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.placeholder.verificationCodePlaceholder"),
      onChange: this.onVerificationCodeChange,
      onPaste: this.onPasteVerificationCode
    }), this.renderVerificationCodeError(validation.get("verificationCode")), /* @__PURE__ */ React__default.createElement("div", {
      className: styles.resendCode
    }, /* @__PURE__ */ React__default.createElement(Trans, {
      i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.didntReceiveEmail"
    }, "Didn't receive the email?"), isRequestingVerificationCode && /* @__PURE__ */ React__default.createElement("span", null, /* @__PURE__ */ React__default.createElement(Trans, {
      i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.requestingCode"
    }, " Requesting...")), !isRequestingVerificationCode && /* @__PURE__ */ React__default.createElement("span", {
      onClick: () => onRequestVerificationCode && onRequestVerificationCode()
    }, /* @__PURE__ */ React__default.createElement(Trans, {
      i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.resend"
    }, "Click here to resend"))), /* @__PURE__ */ React__default.createElement("div", {
      className: styles.resendCode
    }, /* @__PURE__ */ React__default.createElement(Trans, {
      i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.enterWrongEmail"
    }, "Entered the wrong email? "), /* @__PURE__ */ React__default.createElement("span", {
      onClick: () => onChangePage && onChangePage()
    }, /* @__PURE__ */ React__default.createElement(Trans, {
      i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.clickToChange"
    }, "Click here to change")))));
  }
}
class UpgradeHeadlessAccountForm extends React__default.Component {
  constructor(props) {
    super(props);
    this.updatePolicies = () => {
      const { policies } = this.props;
      if (!policies)
        return;
      this.setState({
        requiredPolicies: policies.filter((policy) => policy.isMandatory),
        optionalPolicies: policies.filter((policy) => !policy.isMandatory)
      });
    };
    this.isDisplayNameDisabled = () => Env.IS_DISABLE_DISPLAY_NAME;
    this.isUserNameDisabled = () => Env.IS_DISABLE_USERNAME;
    this.onChangeDisplayName = (event) => {
      const displayName = event.target.value;
      const { validations } = this.props.inputValidationManager.state;
      this.validation.set("displayName", InputValidationHelper.validateDisplayName(displayName, this.isUserNameDisabled(), validations));
      this.setState({ displayName });
    };
    this.onChangeUsername = (event) => {
      const username = event.target.value;
      const { validations } = this.props.inputValidationManager.state;
      this.validation.set("username", InputValidationHelper.validateUserName(username, validations));
      this.setState({ username });
    };
    this.onPasswordChange = (event) => {
      const password = event.target.value;
      const { validations } = this.props.inputValidationManager.state;
      this.validation.set("password", InputValidationHelper.validatePassword(password, validations));
      this.setState({
        password
      });
    };
    this.onVerificationCodeChange = (verificationCode) => {
      this.setState({ verificationCode });
    };
    this.renderPasswordError = ({ min, max } = {}) => {
      const errorType = this.validation.get("password");
      if (!errorType)
        return null;
      switch (errorType) {
        case ValidateLengthErrorType.empty:
          return /* @__PURE__ */ React__default.createElement(FormGroupError, null, t("UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.form.passwordEmptyError"));
        case ValidateLengthErrorType.lessThanLengthLimit:
          return /* @__PURE__ */ React__default.createElement(FormGroupError, null, t("UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.form.passwordLessThanLengthLimit", { PASSWORD_MIN_LIMIT: min }));
        case ValidateLengthErrorType.exceedLengthLimit:
          return /* @__PURE__ */ React__default.createElement(FormGroupError, null, t("UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.form.passwordExceedLimit", { PASSWORD_MAX_LENGTH: max }));
        case ValidateRegexErrorType.invalidFormat:
          return /* @__PURE__ */ React__default.createElement(FormGroupError, null, t("UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.form.passwordInvalidFormat"));
        default:
          return t("CommonError.unknownError");
      }
    };
    this.renderMinimumAgeCheckbox = () => {
      const { reachMinimumAge } = this.state;
      const { age } = this.userManager.state.ageRestriction;
      const { styles } = this.props;
      if (!age)
        return;
      return /* @__PURE__ */ React__default.createElement("div", {
        className: styles.agreementList
      }, /* @__PURE__ */ React__default.createElement("div", {
        className: styles.agreementItem
      }, /* @__PURE__ */ React__default.createElement(Checkbox, {
        isChecked: reachMinimumAge,
        onChange: () => {
          this.setState({ reachMinimumAge: !reachMinimumAge });
        }
      }), /* @__PURE__ */ React__default.createElement("div", {
        className: styles.text
      }, /* @__PURE__ */ React__default.createElement(Trans, {
        i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.minimumAge"
      }, "I confirm that I am ", { age }, " years of age or older."))));
    };
    this.renderRequiredPolicies = () => {
      const { requiredPolicies, isRequiredPolicyAccepted } = this.state;
      const { styles } = this.props;
      if (!requiredPolicies.length)
        return;
      return /* @__PURE__ */ React__default.createElement("div", {
        className: styles.agreementList
      }, /* @__PURE__ */ React__default.createElement("div", {
        className: styles.agreementItem
      }, /* @__PURE__ */ React__default.createElement(Checkbox, {
        isChecked: isRequiredPolicyAccepted,
        onChange: () => {
          this.setState({ isRequiredPolicyAccepted: !isRequiredPolicyAccepted });
        }
      }), /* @__PURE__ */ React__default.createElement("div", {
        className: styles.text
      }, t("UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.tos.haveRead"), requiredPolicies.map((policy, index) => {
        const legalUri = LegalHelper.createLegalURL(LegalUtils.getLegalUrl(), policy.localizedPolicyVersionId);
        return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, index === requiredPolicies.length - 1 && requiredPolicies.length > 1 && t("UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.tos.and"), /* @__PURE__ */ React__default.createElement("span", {
          key: index
        }, /* @__PURE__ */ React__default.createElement("a", {
          href: legalUri,
          target: "_blank",
          rel: "noreferrer"
        }, policy.policyName)), requiredPolicies.length !== 1 && index !== requiredPolicies.length - 1 && index !== requiredPolicies.length - 2 ? ", " : " ");
      }))));
    };
    this.renderOptionalPolicies = () => {
      const { optionalPolicies, acceptedOptionalPolicyIdMap } = this.state;
      const { styles } = this.props;
      if (!optionalPolicies || !optionalPolicies.length)
        return null;
      return optionalPolicies.map((policy) => {
        const legalUri = LegalHelper.createLegalURL(LegalUtils.getLegalUrl(), policy.localizedPolicyVersionId);
        return /* @__PURE__ */ React__default.createElement("div", {
          className: styles.agreementList,
          key: policy.policyId
        }, /* @__PURE__ */ React__default.createElement("div", {
          className: styles.agreementItem
        }, /* @__PURE__ */ React__default.createElement(Checkbox, {
          isChecked: acceptedOptionalPolicyIdMap.get(policy.policyId),
          onChange: () => {
            this.onClickOptionalPolicyCheckbox(policy);
          }
        }), /* @__PURE__ */ React__default.createElement("span", {
          className: `${styles.text} ${styles.optional}`
        }, /* @__PURE__ */ React__default.createElement(Trans, {
          i18nKey: "linkPlatformAccountPage.LinkNewAccount.optional"
        }, "[Optional]")), /* @__PURE__ */ React__default.createElement("div", {
          className: styles.text
        }, policy.policyName, /* @__PURE__ */ React__default.createElement("a", {
          href: legalUri,
          target: "_blank",
          rel: "noreferrer"
        }, /* @__PURE__ */ React__default.createElement(Trans, {
          i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountPage.learnMore"
        }, "Learn more.")))));
      });
    };
    this.onClickOptionalPolicyCheckbox = (policy) => {
      const { acceptedOptionalPolicyIdMap } = this.state;
      acceptedOptionalPolicyIdMap.set(policy.policyId, !acceptedOptionalPolicyIdMap.get(policy.policyId));
      this.setState({ acceptedOptionalPolicyIdMap });
    };
    this.onClickContinue = () => {
      const { isRequiredPolicyAccepted, requiredPolicies, acceptedOptionalPolicyIdMap } = this.state;
      const acceptedPolicyIds = [];
      if (isRequiredPolicyAccepted) {
        for (const policy of requiredPolicies) {
          acceptedPolicyIds.push(policy.policyId);
        }
      }
      acceptedOptionalPolicyIdMap.forEach((value, key) => {
        if (value)
          acceptedPolicyIds.push(key);
      });
      this.props.onContinue({
        ...this.state,
        acceptedPolicyIds,
        reachMinimumAge: true
      });
    };
    this.state = {
      verificationCode: "",
      displayName: "",
      username: "",
      password: "",
      requiredPolicies: [],
      optionalPolicies: [],
      isRequiredPolicyAccepted: false,
      reachMinimumAge: false,
      acceptedOptionalPolicyIdMap: /* @__PURE__ */ new Map()
    };
    this.userManager = Ctx.getAppState().userAppManager;
    this.validation = new Validation();
    this.validation.listen(() => this.setState({}));
  }
  componentDidMount() {
    const { country } = this.props.user;
    this.userManager.getAgeRestrictionByCountry(country);
    this.updatePolicies();
  }
  componentDidUpdate(prevProps) {
    const { policies } = this.props;
    if (JSON.stringify(policies) === JSON.stringify(prevProps.policies))
      return;
    this.updatePolicies();
  }
  renderDisplayNameError(errorType, params = {}) {
    if (!errorType)
      return null;
    switch (errorType) {
      case ValidateLengthErrorType.empty:
        return /* @__PURE__ */ React__default.createElement(FormGroupError, null, t("AccountMyProfilePage.form.displayNameEmptyError"));
      case ValidateLengthErrorType.lessThanLengthLimit:
        return /* @__PURE__ */ React__default.createElement(FormGroupError, null, t("AccountMyProfilePage.form.lessThanLengthLimit", { DISPLAY_NAME_MIN_LIMIT: params.min }));
      case ValidateLengthErrorType.exceedLengthLimit:
        return /* @__PURE__ */ React__default.createElement(FormGroupError, null, t("AccountMyProfilePage.form.displayNameExceedLimit", { MAX_DISPLAY_NAME_LENGTH: params.max }));
      case ValidateRegexErrorType.invalidFormat:
        return /* @__PURE__ */ React__default.createElement(FormGroupError, null, t("AccountMyProfilePage.form.displayNameInvalidFormat"));
      default:
        return t("CommonError.unknownError");
    }
  }
  renderUserNameError(errorType, params = {}) {
    if (!errorType)
      return null;
    switch (errorType) {
      case ValidateLengthErrorType.empty:
        return /* @__PURE__ */ React__default.createElement(FormGroupError, null, /* @__PURE__ */ React__default.createElement(Trans, {
          i18nKey: "AccountMyProfilePage.form.userName.emptyError"
        }, "The username cannot be empty"));
      case ValidateLengthErrorType.lessThanLengthLimit:
        return /* @__PURE__ */ React__default.createElement(FormGroupError, null, /* @__PURE__ */ React__default.createElement(Trans, {
          i18nKey: "AccountMyProfilePage.form.userName.lessThanLengthLimit"
        }, "Your username must contain at least ", { MIN_USERNAME_LENGTH: params.min }, " characters"));
      case ValidateLengthErrorType.exceedLengthLimit:
        return /* @__PURE__ */ React__default.createElement(FormGroupError, null, /* @__PURE__ */ React__default.createElement(Trans, {
          i18nKey: "AccountMyProfilePage.form.userName.exceedLimit"
        }, "Your username must not exceed ", { MAX_USERNAME_LENGTH: params.max }, " characters"));
      case ValidateRegexErrorType.invalidFormat:
        return /* @__PURE__ */ React__default.createElement(FormGroupError, null, /* @__PURE__ */ React__default.createElement(Trans, {
          i18nKey: "AccountMyProfilePage.form.userName.invalidFormat"
        }, "Please enter a valid username format"));
      default:
        return /* @__PURE__ */ React__default.createElement(Trans, {
          i18nKey: "CommonError.unknownError"
        }, "Something went wrong. Please contact administrator.");
    }
  }
  render() {
    const { user, onChangePage, inputValidationManager, onRequestVerificationCode, isRequestingVerificationCode, isUpgradingUser, styles } = this.props;
    const { validations } = inputValidationManager.state;
    const { displayName, username, password, requiredPolicies, isRequiredPolicyAccepted, reachMinimumAge, verificationCode } = this.state;
    const { countryName, age } = this.userManager.state.ageRestriction;
    const usernameProps = InputValidationHelper.getValidationByKey(ValidateableInputField.enum.username, validations);
    const displayNameProps = InputValidationHelper.getValidationByKey(ValidateableInputField.enum.displayName, validations);
    const passwordProps = InputValidationHelper.getValidationByKey(ValidateableInputField.enum.password, validations);
    const isDisplayNameValid = this.isUserNameDisabled() ? displayName.length > 0 : true;
    const isUserNameValid = this.isUserNameDisabled() || username.length > 0;
    const isVerificationCodeNotEmpy = verificationCode.length > 0;
    const isSubmitButtonEnabled = this.validation.isAllValid() && (isRequiredPolicyAccepted || requiredPolicies.length === 0) && (reachMinimumAge || !age) && password.length > 0 && isDisplayNameValid && isUserNameValid && isVerificationCodeNotEmpy;
    if (!user)
      return;
    return /* @__PURE__ */ React__default.createElement("div", null, /* @__PURE__ */ React__default.createElement(UpgradeHeadlessVerification, {
      ...{ verificationCode, onChangePage, isRequestingVerificationCode, onRequestVerificationCode },
      onChangeVerificationCode: this.onVerificationCodeChange,
      validation: this.validation,
      styles
    }), /* @__PURE__ */ React__default.createElement("hr", null), /* @__PURE__ */ React__default.createElement(FormGroup, null, /* @__PURE__ */ React__default.createElement("div", {
      className: styles.label
    }, t("UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.country")), /* @__PURE__ */ React__default.createElement(InputGroup, {
      type: "text",
      value: countryName || user.country,
      disabled: true,
      className: styles.input
    })), !this.isUserNameDisabled() && /* @__PURE__ */ React__default.createElement(FormGroup, null, /* @__PURE__ */ React__default.createElement("div", {
      className: styles.label
    }, /* @__PURE__ */ React__default.createElement("div", null, t("UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.userName")), /* @__PURE__ */ React__default.createElement("div", null, username.length, "/", usernameProps == null ? void 0 : usernameProps.maxLength)), /* @__PURE__ */ React__default.createElement(InputGroup, {
      className: styles.input,
      value: username,
      onChange: this.onChangeUsername,
      placeholder: t("UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.placeholder.userName"),
      disabled: !!this.props.inputValidationManager.state.fetchError,
      popoverContent: /* @__PURE__ */ React__default.createElement(PasswordConstraint, {
        descriptions: InputValidationHelper.getValidationDescription(ValidateableInputField.enum.username, validations)
      }),
      maxLength: usernameProps == null ? void 0 : usernameProps.maxLength
    }), this.renderUserNameError(this.validation.get("username"), {
      min: usernameProps && usernameProps.minLength,
      max: usernameProps && usernameProps.maxLength
    })), !this.isDisplayNameDisabled() && /* @__PURE__ */ React__default.createElement(FormGroup, null, /* @__PURE__ */ React__default.createElement("div", {
      className: styles.label
    }, /* @__PURE__ */ React__default.createElement("div", null, `${t("UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.displayName")} ${t("UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.tos.optional")}`), /* @__PURE__ */ React__default.createElement("div", null, displayName.length, "/", displayNameProps == null ? void 0 : displayNameProps.maxLength)), /* @__PURE__ */ React__default.createElement(InputGroup, {
      className: styles.input,
      value: displayName,
      onChange: this.onChangeDisplayName,
      placeholder: t("UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.placeholder.displayName"),
      popoverContent: /* @__PURE__ */ React__default.createElement(PasswordConstraint, {
        descriptions: InputValidationHelper.getValidationDescription(ValidateableInputField.enum.displayName, validations)
      }),
      maxLength: displayNameProps == null ? void 0 : displayNameProps.maxLength
    }), this.renderDisplayNameError(this.validation.get("displayName"), {
      min: displayNameProps && displayNameProps.minLength,
      max: displayNameProps && displayNameProps.maxLength
    })), /* @__PURE__ */ React__default.createElement(FormGroup, null, /* @__PURE__ */ React__default.createElement("div", {
      className: styles.label
    }, /* @__PURE__ */ React__default.createElement("div", null, t("UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.password")), /* @__PURE__ */ React__default.createElement("div", null, password.length, "/", passwordProps == null ? void 0 : passwordProps.maxLength)), /* @__PURE__ */ React__default.createElement(InputGroupPassword, {
      className: styles.input,
      value: password,
      placeholder: t("UpgradeHeadlessAccountPage.UpgradeHeadlessAccountForm.placeholder.password"),
      togglePassword: true,
      onChange: this.onPasswordChange,
      popoverContent: /* @__PURE__ */ React__default.createElement(PasswordConstraint, {
        descriptions: InputValidationHelper.getValidationDescription(ValidateableInputField.enum.password, validations)
      }),
      maxLength: passwordProps == null ? void 0 : passwordProps.maxLength,
      hasStrengthMeter: !this.validation.get("password") && !!password
    }), this.renderPasswordError({
      min: passwordProps && passwordProps.minLength,
      max: passwordProps && passwordProps.maxLength
    })), /* @__PURE__ */ React__default.createElement(FormGroup, null, this.renderMinimumAgeCheckbox(), this.renderRequiredPolicies(), this.renderOptionalPolicies()), /* @__PURE__ */ React__default.createElement(Button, {
      loadingIndicator: "SPINNER",
      className: "btn btn-primary w-full uppercase",
      onClick: () => this.onClickContinue(),
      disabled: !isSubmitButtonEnabled || isUpgradingUser,
      isLoading: isUpgradingUser
    }, t("common.complete")));
  }
}
class EmailVerificationForm extends React__default.Component {
  constructor(props) {
    super(props);
    this.onEmailChange = (event) => {
      const email = event.target.value.toString().toLocaleLowerCase();
      const { validations } = this.inputValidationManager.state;
      this.validation.set("email", InputValidationHelper.validateEmail(email, validations));
      this.setState({ email });
    };
    this.onFormSubmit = (event) => {
      const { onRequestVerificationCode } = this.props;
      event.preventDefault();
      const { email } = this.state;
      if (!this.validation.get("email") && email) {
        onRequestVerificationCode(email);
      }
    };
    this.state = {
      email: ""
    };
    this.appState = Ctx.getAppState();
    this.inputValidationManager = this.appState.inputValidationAppManager;
    this.inputValidationManager.subscribe(() => this.setState({}));
    this.validation = new Validation();
    this.validation.listen(() => this.setState({}));
  }
  renderEmailError(errorType) {
    if (!errorType)
      return null;
    const { validations } = this.inputValidationManager.state;
    const emailProps = InputValidationHelper.getValidationByKey(ValidateableInputField.enum.email, validations);
    const displayNameErrorMap = {
      [ValidateEmailErrorType.empty]: /* @__PURE__ */ React__default.createElement(Trans, {
        i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountPage.emailError.empty"
      }, "You must enter a new email address"),
      [ValidateEmailErrorType.lessThanLengthLimit]: /* @__PURE__ */ React__default.createElement(Trans, {
        i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountPage.emailError.lessThanLengthLimit"
      }, "Email must not less than ", { MIN_EMAIL_LENGTH: emailProps == null ? void 0 : emailProps.minLength }, " characters"),
      [ValidateEmailErrorType.exceedLengthLimit]: /* @__PURE__ */ React__default.createElement(Trans, {
        i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountPage.emailError.ExceedLimit"
      }, "Email must not exceed ", { MAX_EMAIL_LENGTH: emailProps == null ? void 0 : emailProps.maxLength }, " characters"),
      [ValidateEmailErrorType.invalidFormat]: /* @__PURE__ */ React__default.createElement(Trans, {
        i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountPage.emailError.InvalidFormat"
      }, "Please provide a valid Email format"),
      [CommonValidationErrorType.containsForbiddenWords]: /* @__PURE__ */ React__default.createElement(Trans, {
        i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountPage.emailError.containsForbiddenWords"
      }, "Email contains prohibited word or use blocked domain")
    };
    return /* @__PURE__ */ React__default.createElement(FormGroupError, null, displayNameErrorMap[errorType]);
  }
  render() {
    const { email } = this.state;
    const { styles, isRequesting } = this.props;
    const { validations } = this.inputValidationManager.state;
    return /* @__PURE__ */ React__default.createElement("form", {
      onSubmit: this.onFormSubmit,
      noValidate: true
    }, /* @__PURE__ */ React__default.createElement(FormGroup, null, /* @__PURE__ */ React__default.createElement("div", {
      className: styles.label
    }, /* @__PURE__ */ React__default.createElement(Trans, {
      i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountPage.email"
    }, "Email")), /* @__PURE__ */ React__default.createElement(InputGroup, {
      type: "email",
      className: styles.input,
      value: email,
      placeholder: t("UpgradeHeadlessAccountPage.UpgradeHeadlessAccountPage.placeholder.email"),
      onChange: this.onEmailChange,
      popoverContent: /* @__PURE__ */ React__default.createElement(PasswordConstraint, {
        descriptions: InputValidationHelper.getValidationDescription(ValidateableInputField.enum.email, validations)
      })
    }), this.renderEmailError(this.validation.get("email"))), /* @__PURE__ */ React__default.createElement(Button, {
      loadingIndicator: "SPINNER",
      disabled: !!this.validation.get("email") || !email,
      className: "btn btn-primary w-full uppercase",
      type: "submit",
      isLoading: isRequesting
    }, /* @__PURE__ */ React__default.createElement(Trans, {
      i18nKey: "UpgradeHeadlessAccountPage.UpgradeHeadlessAccountPage.continue"
    }, "CONTINUE")));
  }
}
export { EmailVerificationForm as E, UpgradeHeadlessAccountForm as U };
