"use client";
import { j as e } from "../../../node_modules/.pnpm/react@19.1.0/node_modules/react/jsx-runtime.mjs";
import { useState as g, useEffect as C } from "react";
import i from "../../../node_modules/.pnpm/classnames@2.5.1/node_modules/classnames/index.mjs";
import { ReactComponent as f } from "../../assets/images/HyperPlayLogoIcon.svg.mjs";
import c from "../Button/index.mjs";
import y from "../Collapse/index.mjs";
import l from "../Modal/Modal/index.mjs";
import b from "../TextInput/index.mjs";
import s from "./CheckEmail.module.scss.mjs";
const w = ({
  className: d,
  email: m,
  onResend: p,
  onReEnterEmail: u,
  codeInputProps: h,
  onClose: x,
  i18n: t = {
    title: "Check your email",
    subtitle: "We've sent a verification link to",
    clickLoginTitleOr: "Click the link to login or",
    didNotReceiveEmail: "Didn't get an email?",
    redirectNotWorking: "Redirect not working?",
    resend: "Resend email",
    retryIn: "Retry in",
    seconds: "seconds",
    reEnterEmail: "change email",
    manualCodeTitle: "Login Code",
    inputPlaceHolder: "Paste login code"
  },
  ...j
}) => {
  const [a, n] = g(0), o = a > 0, N = () => {
    o || (p(), n(15));
  };
  return C(() => {
    let r;
    return o && (r = setInterval(() => {
      n((k) => k - 1);
    }, 1e3)), () => clearInterval(r);
  }, [o]), /* @__PURE__ */ e.jsxs(l.Root, { className: i(d, s.root), ...j, children: [
    /* @__PURE__ */ e.jsx(l.CloseButton, { "aria-label": "close signup modal", onClick: x }),
    /* @__PURE__ */ e.jsx(l.HeadingIcon, { className: s.emailRoundedIcon, children: /* @__PURE__ */ e.jsx(f, { className: s.icon, width: 20, height: 20 }) }),
    /* @__PURE__ */ e.jsxs(l.Header, { children: [
      /* @__PURE__ */ e.jsx(l.Title, { children: t.title }),
      /* @__PURE__ */ e.jsxs(l.Body, { className: "body-sm", children: [
        t.subtitle,
        " ",
        /* @__PURE__ */ e.jsx("span", { className: "text--semibold", children: m }),
        ".",
        " ",
        t.clickLoginTitleOr,
        " ",
        /* @__PURE__ */ e.jsxs(
          c,
          {
            type: "link",
            className: s.reEnter,
            onClick: u,
            children: [
              t == null ? void 0 : t.reEnterEmail,
              "."
            ]
          }
        )
      ] })
    ] }),
    /* @__PURE__ */ e.jsxs("div", { className: s.copyCodeContainer, children: [
      /* @__PURE__ */ e.jsx("span", { className: "eyebrow", children: t.redirectNotWorking }),
      /* @__PURE__ */ e.jsx(
        y,
        {
          title: t.manualCodeTitle,
          classNames: {
            root: s.collapseRoot,
            content: s.collapseContent
          },
          children: /* @__PURE__ */ e.jsx(
            b,
            {
              className: s.input,
              placeholder: t.inputPlaceHolder,
              ...h
            }
          )
        }
      )
    ] }),
    /* @__PURE__ */ e.jsxs("div", { className: s.linkContainer, children: [
      /* @__PURE__ */ e.jsx("span", { className: i("caption", s.subtitle), children: t.didNotReceiveEmail }),
      " ",
      o ? /* @__PURE__ */ e.jsxs("span", { className: i("caption", s.subtitle, s.disabledText), children: [
        t.retryIn,
        " ",
        a,
        " ",
        t.seconds
      ] }) : /* @__PURE__ */ e.jsx(e.Fragment, { children: /* @__PURE__ */ e.jsx(
        c,
        {
          type: "link",
          size: "small",
          className: s.buttonLink,
          onClick: N,
          children: t.resend
        }
      ) })
    ] })
  ] });
};
export {
  w as default
};
//# sourceMappingURL=index.mjs.map
