'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-8277cbb3.js');
const domContextHooks_module = require('./dom-context-hooks.module-e7b6727c.js');
const index_module = require('./index.module-f8c8495f.js');
const cjs = require('./cjs-1066ec21.js');
const utils = require('./utils-6847bc06.js');
const extractProps = require('./extractProps-e9c55ba8.js');
const keys = require('./keys-cff24974.js');

const USER_LOOKUP = index_module.dist.gql `
  query checkUserVerification {
    viewer {
      ... on User {
        id
        accountId
        email
        emailVerified
        managedIdentity {
          email
          emailVerified
        }
      }
    }
  }
`;
function useWidgetVerification() {
  const userIdentity = index_module.J();
  const [showCode, setShowCode] = index_module.In({
    namespace: keys.SHOW_CODE_NAMESPACE,
    initialValue: false,
  });
  const [email, setEmail] = index_module.In({
    namespace: keys.VERIFICATION_EMAIL_NAMESPACE,
    initialValue: userIdentity === null || userIdentity === void 0 ? void 0 : userIdentity.email,
  });
  const setContext = index_module.En(keys.VERIFICATION_PARENT_NAMESPACE);
  const [loading, setLoading] = domContextHooks_module.useState(true);
  const [fetch] = index_module.Xe(USER_LOOKUP);
  domContextHooks_module.useEffect(() => {
    const checkUser = async () => {
      var _a, _b, _c;
      try {
        const res = await fetch({});
        if (!res || res instanceof Error)
          throw new Error();
        if ((_a = res === null || res === void 0 ? void 0 : res.viewer) === null || _a === void 0 ? void 0 : _a.emailVerified)
          setContext(true);
        else if ((_c = (_b = res === null || res === void 0 ? void 0 : res.viewer) === null || _b === void 0 ? void 0 : _b.managedIdentity) === null || _c === void 0 ? void 0 : _c.emailVerified)
          setContext(true);
      }
      catch (e) {
        console.error("Could not fetch user information:", e);
      }
      finally {
        setLoading(false);
      }
    };
    checkUser();
  }, []);
  const onVerification = () => {
    setContext(true);
  };
  return { showCode, onVerification, loading };
}

const WidgetVerification = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    // ! Any updated must be reflected in sqm-widget-verification-internal AND sqm-email-verification AND sqm-code-verification
    /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
                    GENERAL PROPS
      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
    /**
     * @uiName General verify widget header text
     * @uiGroup General Text
     */
    this.general_verifyEmailHeader = "Verify your email";
    /**
     * @uiName General verify widget description text
     * @uiGroup General Text
     */
    this.general_verifyEmailDescription = "To get your cash paid out directly to your bank account, please complete your account setup";
    /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
                    EMAIL STEP PROPS
      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
    /**
     * @uiName Verify email widget header text
     * @uiGroup Email Verification Step
     */
    this.emailStep_verifyEmailHeaderText = "Start by verifying your email. We’ll send you a code through our referral provider, impact.com.";
    /**
     * @uiName Send code to email alert header
     * @uiGroup Email Verification Step
     */
    this.emailStep_sendCodeErrorHeader = "There was an error sending your code.";
    /**
     * @uiName Send code to email alert description
     * @uiGroup Email Verification Step
     */
    this.emailStep_sendCodeErrorDescription = "Please try again. If this problem continues, contact our program support team.";
    /**
     * @uiName Email input label
     * @uiGroup Email Verification Step
     */
    this.emailStep_emailLabel = "Email";
    /**
     * @uiName Send code button text
     * @uiGroup Email Verification Step
     */
    this.emailStep_sendCodeText = "Send code";
    /**
     * @uiName Send code button text
     * @uiGroup Email Verification Step
     */
    this.emailStep_emailValidationErrorText = "Please enter a valid email";
    /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
                    EMAIL STEP PROPS
      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
    /**
     * @uiName Verify code widget header text
     * @uiGroup Code Verification Step
     */
    this.codeStep_verifyCodeHeaderText = "Enter the code sent to {email} from our referral provider, impact.com.";
    /**
     * @uiName Reverify code widget header text
     * @uiGroup Code Verification Step
     */
    this.codeStep_reverifyCodeHeaderText = "Enter the code sent to {email} from our referral provider, impact.com.";
    /**
     * Text displayed under verify button
     * @uiName Resend code text
     * @uiGroup Code Verification Step
     */
    this.codeStep_resendCodeText = "Didn't receive your code? {resendCodeLink}";
    /**
     * The link that appears in the resend code link
     * @uiName Resend code label
     * @uiGroup Code Verification Step
     */
    this.codeStep_resendCodeLabel = "Resend code";
    /**
     * Link text displayed under verify button
     * @uiName Resend code text
     * @uiGroup Code Verification Step
     */
    this.codeStep_codeResentSuccessfullyText = "Another code has been sent to {email}";
    /**
     * Error text displayed under verification input
     * @uiName Invalid code text
     * @uiGroup Code Verification Step
     */
    this.codeStep_invalidCodeText = "Please check your code and try again. If you’re still having trouble, try resending your code.";
    /**
     * @uiName Verify code button text
     * @uiGroup Code Verification Step
     */
    this.codeStep_verifyText = "Verify";
    /**
     * Displayed when the email verification fails due to a network error. The participant can try refreshing the page.
     * @uiName Network error message
     * @uiGroup Code Verification Step
     */
    this.codeStep_networkErrorMessage = "An error occurred while verifying your email. Please refresh the page and try again.";
    /**
     * @undocumented
     * @componentState { "title": "Step 1: Enter email", "props": { "showCode": false }, "dependencies": ["sqm-email-verification"], "uiGroup": "Email Verification Step" }
     * @componentState { "title": "Step 2: Enter code", "props": { "showCode": true }, "dependencies": ["sqm-code-verification"], "uiGroup": "Code Verification Step" }
     */
    this.stateController = "{}";
    domContextHooks_module.h$1(this);
  }
  disconnectedCallback() { }
  getStepTextProps(prefix) {
    const props = utils.getProps(this);
    return extractProps.extractProps(props, prefix);
  }
  render() {
    const props = index_module.isDemo()
      ? useDemoWidgetVerificationInternal(this)
      : useWidgetVerification();
    if (props.loading)
      return index.h("sl-spinner", null);
    const generalText = this.getStepTextProps("general_");
    return (index.h("div", null, index.h("h3", { style: { fontSize: "24px", margin: "0" } }, generalText.verifyEmailHeader), index.h("p", { style: {
        color: "var(--sl-color-neutral-500)",
        fontSize: "var(--sl-font-size-medium)",
        margin: "0",
      } }, generalText.verifyEmailDescription), props.showCode ? (index.h("sqm-code-verification", Object.assign({ onVerification: props.onVerification }, this.getStepTextProps("codeStep_"), extractProps.extractProps(props, "sqm-code-verification_")))) : (index.h("sqm-email-verification", Object.assign({}, this.getStepTextProps("emailStep_"), extractProps.extractProps(props, "sqm-email-verification_"))))));
  }
};
function useDemoWidgetVerificationInternal(props) {
  const [showCode, setShowCode] = index_module.In({
    namespace: keys.SHOW_CODE_NAMESPACE,
    initialValue: false,
  });
  const [email, setEmail] = index_module.In({
    namespace: keys.VERIFICATION_EMAIL_NAMESPACE,
    initialValue: undefined,
  });
  const setContext = index_module.En(keys.VERIFICATION_PARENT_NAMESPACE);
  const states = extractProps.parseStates(props.stateController);
  const formatted = Object.keys(states).reduce((prev, key) => key === "sqm-widget-verification"
    ? { ...prev, ...states[key] }
    : { ...prev, [`${key}_stateController`]: states[key] }, {});
  const onVerification = () => {
    setContext(true);
  };
  return cjs.cjs({ showCode, onVerification, loading: false }, formatted || {}, { arrayMerge: (_, a) => a });
}

exports.sqm_widget_verification = WidgetVerification;
