import { Alert as u } from "./accelbyte-widgets123.mjs";
import { Button as v } from "./accelbyte-widgets107.mjs";
import { FormGroupError as h, FormGroup as C } from "./accelbyte-widgets263.mjs";
import { InputGroup as y } from "./accelbyte-widgets229.mjs";
import { t as g } from "./accelbyte-widgets58.mjs";
import m from "classnames";
import e from "react";
import { Trans as i } from "react-i18next";
import V from "validator/lib/isEmpty.js";
import a from "./accelbyte-widgets158.mjs";
import { validateAlphanumeric as N, ValidateAlphaNumericErrorType as l } from "./accelbyte-widgets293.mjs";
import { Validation as w } from "./accelbyte-widgets269.mjs";
import { MAX_SHORT_TEXT_LENGTH as P } from "./accelbyte-widgets339.mjs";
class B extends e.Component {
  constructor(t) {
    super(t), this.onVerificationCodeChange = (r) => {
      const n = r.target.value.toString().toUpperCase();
      this.validation.set("verificationCode", N(n)), this.setState({
        verificationCode: n
      });
    }, this.state = {
      verificationCode: ""
    }, this.validation = new w(), this.validation.listen(() => this.setState({}));
  }
  renderVerificationCodeError(t) {
    if (!t)
      return null;
    const r = {
      [l.enum.empty]: /* @__PURE__ */ e.createElement(i, { i18nKey: "EmailVerificationPage.verifyCodeForm.verifyCodeError.empty" }, "Please enter your verification code."),
      [l.enum.exceedLengthLimit]: /* @__PURE__ */ e.createElement(i, { i18nKey: "EmailVerificationPage.verifyCodeForm.verifyCodeError.ExceedLimit" }, "Verification code must not exceed ", { MAX_SHORT_TEXT_LENGTH: P }, " characters"),
      [l.enum.invalidFormat]: /* @__PURE__ */ e.createElement(i, { i18nKey: "EmailVerificationPage.verifyCodeForm.verifyCodeError.invalidFormat" }, "The verification code must be alphanumeric and cannot contain spaces or special characters.")
    };
    return /* @__PURE__ */ e.createElement(h, null, r[t]);
  }
  render() {
    const { isRequestingCode: t, isVerifying: r, onChangeEmail: n, onResend: s, onVerify: d, alert: o, onDismissAlert: f, isSuccess: E } = this.props, { verificationCode: c } = this.state, p = V(c) || r || E || !this.validation.isAllValid();
    return /* @__PURE__ */ e.createElement("div", null, /* @__PURE__ */ e.createElement("div", { className: a.title }, /* @__PURE__ */ e.createElement(i, { i18nKey: "NewEmailVerificationPage.title" }, "Verify your new email")), !!o && /* @__PURE__ */ e.createElement(u, { type: o.type, onDismiss: f, className: "mb-6" }, o.element), /* @__PURE__ */ e.createElement("div", { className: a.description }, /* @__PURE__ */ e.createElement("p", null, /* @__PURE__ */ e.createElement(i, { i18nKey: "NewEmailVerificationPage.verificationCodeForm.description" }, "A verification code has been sent to your new email address. Please enter the verification code below."))), /* @__PURE__ */ e.createElement(C, null, /* @__PURE__ */ e.createElement(
      y,
      {
        className: a.input,
        value: c || "",
        placeholder: g("NewEmailVerificationPage.placeholder.verificationCode"),
        onChange: this.onVerificationCodeChange
      }
    ), this.renderVerificationCodeError(this.validation.get("verificationCode"))), /* @__PURE__ */ e.createElement("div", { className: "mt-2 flex flex-row" }, /* @__PURE__ */ e.createElement(
      v,
      {
        loadingIndicator: "SPINNER",
        disabled: p,
        className: m(a.btnActionVerify, "btn btn-primary"),
        onClick: () => d(c),
        isLoading: r
      },
      /* @__PURE__ */ e.createElement(i, { i18nKey: "NewEmailVerificationPage.submitButton" }, "Verify")
    )), /* @__PURE__ */ e.createElement("div", { className: m(a.description, "mt-2") }, /* @__PURE__ */ e.createElement(i, { i18nKey: "NewEmailVerificationPage.sendVerificationCode.didntReceiveEmail" }, "Didn't receive the email?"), t && /* @__PURE__ */ e.createElement("span", { className: "ml-1" }, /* @__PURE__ */ e.createElement(i, { i18nKey: "NewEmailVerificationPage.sendVerificationCode.requesting" }, "Requesting...")), !t && /* @__PURE__ */ e.createElement("span", { onClick: () => s() }, /* @__PURE__ */ e.createElement(i, { i18nKey: "NewEmailVerificationPage.sendVerificationCode.click" }, " Click here to resend"))), /* @__PURE__ */ e.createElement("div", { className: m(a.description, "mt-2") }, /* @__PURE__ */ e.createElement(i, { i18nKey: "NewEmailVerificationPage.changeEmail" }, "Entered the wrong email?", /* @__PURE__ */ e.createElement("span", { onClick: () => n() }, " Click here to change"))));
  }
}
export {
  B as UpdatingEmailVerificationForm
};
