import { r as registerInstance, h as h$1 } from './index-38ad4957.js';
import { k as useState, n as h, m as useRef, f as useEffect } from './dom-context-hooks.module-50442785.js';
import { u as un, j as jn, i as isDemo, a as je, h as hn, V as Ve, b as useCallback, J, c as an, s as setUserIdentity } from './index.module-b23fdad8.js';
import { j as jsonpointer } from './jsonpointer-388a7082.js';
import { c as cjs } from './cjs-bdfb4486.js';
import { s as sanitizeUrlPath, g as getProps } from './utils-334c1e34.js';
import { c as createStyleSheet } from './JSS-67b5cff8.js';
import './mixins-f750863a.js';
import './sqm-text-span-view-72f43dff.js';
import { P as PortalForgotPasswordView, a as PortalLoginView, b as PortalRegisterView, c as PortalVerifyEmailView } from './sqm-portal-verify-email-view-c61536b7.js';
import { A as AsYouType, u as usePortalRegistrationForm } from './usePortalRegistrationForm-62de6fb1.js';
import { u as useRegistrationFormState } from './useRegistrationFormState-2c090c38.js';
import { P as PortalRegistrationFormView } from './sqm-portal-registration-form-view-79265df5.js';

function usePortalForgotPassword(props) {
  var _a, _b, _c, _d, _e, _f, _g;
  const [success, setSuccess] = useState(false);
  const [error, setError] = useState("");
  const [request, { loading, data, errors }] = un();
  const urlParams = new URLSearchParams(jn.location.search);
  const nextPage = urlParams.get("nextPage");
  const submit = async (event) => {
    var _a;
    setError("");
    setSuccess(false);
    let formData = event.detail.formData;
    formData === null || formData === void 0 ? void 0 : formData.forEach((value, key) => {
      jsonpointer.set(formData, key, value);
    });
    const urlParams = nextPage ? { nextPage } : null;
    const redirectPath = props.redirectPath;
    const variables = { email: formData.email, urlParams, redirectPath };
    const result = await request(variables);
    if (result instanceof Error) {
      if (result.message)
        setError(props.networkErrorMessage);
      return;
    }
    if ((_a = result.requestManagedIdentityPasswordResetEmail) === null || _a === void 0 ? void 0 : _a.success) {
      setSuccess(true);
    }
  };
  return {
    states: {
      loading,
      error: ((_d = (_c = (_b = (_a = errors === null || errors === void 0 ? void 0 : errors.response) === null || _a === void 0 ? void 0 : _a.errors) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.extensions) === null || _d === void 0 ? void 0 : _d.message) || ((_g = (_f = (_e = errors === null || errors === void 0 ? void 0 : errors.response) === null || _e === void 0 ? void 0 : _e.errors) === null || _f === void 0 ? void 0 : _f[0]) === null || _g === void 0 ? void 0 : _g.message) ||
        error,
      success,
      loginPath: props.loginPath,
      headerText: props.headerText,
      loginText: props.loginText,
    },
    callbacks: {
      submit,
    },
  };
}

const PortalForgotPassword = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.ignored = true;
    /**
     * Redirect participants to this page after they verify their email.
     *
     * @uiName Email redirect
     * @uiWidget pageSelect
     */
    this.redirectPath = "/resetPassword";
    /**
     * @uiName Email field label
     */
    this.emailLabel = "Email";
    /**
     * @uiName Password reset button text
     */
    this.submitLabel = "Request Password Reset";
    /**
     * @uiName Login redirect path
     * @uiWidget pageSelect
     */
    this.loginPath = "/login";
    /**
     * @uiName Header text
     * @uiWidget textArea
     */
    this.headerText = "Enter your email below to receive a password reset link.";
    /**
     * @uiName Sign in link text
     */
    this.loginText = "Sign In";
    /**
     * Displayed when the forgot password action fails due to a network error. The participant can try refreshing the page.
     * @uiName Network error message
     */
    this.networkErrorMessage = "An error occurred while loading this page. Please refresh the page.";
    /**
     * @uiName Email verification sent text
     */
    this.successAlertText = "If an account with that email exists, a password reset email will be sent.";
    /**
     * @uiName Background color
     * @uiWidget color
     */
    this.backgroundColor = "var(--sqm-portal-background, #ffffff)";
    /**
     * @uiName Border radius
     * @uiWidget number
     */
    this.borderRadius = "var(--sqm-border-radius-normal, 8px)";
    /**
     * @uiName Border style
     * @uiWidget textArea
     */
    this.border = "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color, #eaeaea)";
    h(this);
  }
  disconnectedCallback() { }
  render() {
    const { states, callbacks } = isDemo()
      ? usePortalForgotPasswordDemo(this)
      : usePortalForgotPassword(this);
    const content = {
      messageSlot: h$1("slot", { name: "messageSlot" }, this.headerText),
      emailLabel: this.emailLabel,
      submitLabel: this.submitLabel,
      successAlertText: this.successAlertText,
      loginText: this.loginText,
      backgroundColor: this.backgroundColor,
      borderRadius: this.borderRadius,
      border: this.border,
    };
    return (h$1(PortalForgotPasswordView, { states: states, callbacks: callbacks, content: content }));
  }
};
function usePortalForgotPasswordDemo(props) {
  return cjs({
    states: { error: "", loading: false, success: false },
    callbacks: {
      submit: async (_event) => { },
    },
    content: {
      secondaryButton: (h$1("sl-button", { type: "secondary", exportparts: "base: secondarybutton-base", disabled: false, onClick: () => jn.push(props.loginPath) }, props.loginText)),
      messageSlot: h$1("span", null, props.headerText),
      emailLabel: props.emailLabel,
      submitLabel: props.submitLabel,
      successAlertText: props.successAlertText,
      loginText: props.loginText,
      backgroundColor: props.backgroundColor,
      borderRadius: props.borderRadius,
      border: props.border,
    },
  }, props.demoData || {}, { arrayMerge: (_, a) => a });
}

function usePortalLogin(props) {
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
  const [request, { loading, errors, data }] = je();
  const [loginWithGoogle, { loading: gLoading, errors: gErrors }] = hn();
  const [error, setError] = useState("");
  const urlParams = new URLSearchParams(jn.location.search);
  const nextPageOverride = urlParams.get("nextPage");
  const googleSubmit = async (e) => {
    var _a, _b, _c, _d;
    if (!((_a = e.detail) === null || _a === void 0 ? void 0 : _a.credential))
      return;
    const result = await loginWithGoogle({ idToken: e.detail.credential });
    if (result instanceof Error) {
      if ((result === null || result === void 0 ? void 0 : result.message) || ((_b = result === null || result === void 0 ? void 0 : result["response"]) === null || _b === void 0 ? void 0 : _b["error"]))
        if ((_c = result === null || result === void 0 ? void 0 : result["response"]) === null || _c === void 0 ? void 0 : _c["errors"].some((error) => { var _a; return ((_a = error === null || error === void 0 ? void 0 : error["extensions"]) === null || _a === void 0 ? void 0 : _a["message"]) === "Invalid Credentials."; })) {
          setError(props.googleUserNotRegisteredError);
        }
        else {
          setError(props.networkErrorMessage);
        }
      return;
    }
    if ((_d = result.authenticateManagedIdentityWithGoogle) === null || _d === void 0 ? void 0 : _d.token) {
      urlParams.delete("nextPage");
      const url = sanitizeUrlPath(nextPageOverride || props.nextPage);
      jn.push(url.href);
    }
  };
  const submit = async (event) => {
    var _a, _b;
    setError("");
    let formData = event.detail.formData;
    formData === null || formData === void 0 ? void 0 : formData.forEach((value, key) => {
      jsonpointer.set(formData, key, value);
    });
    const variables = { email: formData.email, password: formData.password };
    const result = await request(variables);
    if (result instanceof Error) {
      if ((result === null || result === void 0 ? void 0 : result.message) || ((_a = result === null || result === void 0 ? void 0 : result["response"]) === null || _a === void 0 ? void 0 : _a["error"]))
        setError(props.networkErrorMessage);
      return;
    }
    if ((_b = result.authenticateManagedIdentityWithEmailAndPassword) === null || _b === void 0 ? void 0 : _b.token) {
      urlParams.delete("nextPage");
      const url = sanitizeUrlPath(nextPageOverride || props.nextPage);
      jn.push(url.href);
    }
  };
  const errorMessage = ((_d = (_c = (_b = (_a = errors === null || errors === void 0 ? void 0 : errors.response) === null || _a === void 0 ? void 0 : _a.errors) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.extensions) === null || _d === void 0 ? void 0 : _d.message) || ((_g = (_f = (_e = errors === null || errors === void 0 ? void 0 : errors.response) === null || _e === void 0 ? void 0 : _e.errors) === null || _f === void 0 ? void 0 : _f[0]) === null || _g === void 0 ? void 0 : _g.message) ||
    error;
  const googleErrorMessage = ((_l = (_k = (_j = (_h = gErrors === null || gErrors === void 0 ? void 0 : gErrors.response) === null || _h === void 0 ? void 0 : _h.errors) === null || _j === void 0 ? void 0 : _j[0]) === null || _k === void 0 ? void 0 : _k.extensions) === null || _l === void 0 ? void 0 : _l.message) || ((_p = (_o = (_m = gErrors === null || gErrors === void 0 ? void 0 : gErrors.response) === null || _m === void 0 ? void 0 : _m.errors) === null || _o === void 0 ? void 0 : _o[0]) === null || _p === void 0 ? void 0 : _p.message) ||
    error;
  return {
    states: {
      loading: loading || gLoading,
      error: errorMessage || googleErrorMessage,
      registerPath: props.registerPath,
      forgotPasswordPath: props.forgotPasswordPath,
    },
    callbacks: {
      googleSubmit,
      submit,
    },
  };
}

const PortalGoogleLogin = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.ignored = true;
    /**
     * Redirect participants to this page after they successfully login.
     *
     * @uiName Login redirect
     * @uiWidget pageSelect
     */
    this.nextPage = "/";
    /**
     * @uiName Email field label
     */
    this.emailLabel = "Email";
    /**
     * @uiName Password field label
     */
    this.passwordLabel = "Password";
    /**
     * @uiName Submit button text
     */
    this.submitLabel = "Sign In";
    /**
     * Redirect participants to this page to reset their password
     * @uiName Forgot password redirect
     * @uiWidget pageSelect
     */
    this.forgotPasswordPath = "/forgotPassword";
    /**
     * @uiName Forgot password text
     */
    this.forgotPasswordLabel = "Forgot Password?";
    /**
     * @uiName Register button text
     */
    this.registerLabel = "Register";
    /**
     * Redirect participants to this page to start registration.
     * @uiName Register button redirect
     * @uiWidget pageSelect
     */
    this.registerPath = "/register";
    /**
     * @uiName Heading label
     * @uiWidget textArea
     */
    this.pageLabel = "Sign in to your account";
    /**
     * @uiName Network error message
     * Displayed when the login fails due to a network error. The participant can try refreshing the page.
     */
    this.networkErrorMessage = "An error occurred while logging you in. Please refresh the page and try again.";
    /**
     * @uiName Google account error message
     * Displayed when user tries to sign in with Google account but has not registered.
     */
    this.googleUserNotRegisteredError = "Your Google account has not registered on our platform. Please complete the registration process with your Google account.";
    /**
     * @uiName Register CTA
     */
    this.registerCTA = "Don't have an account?";
    h(this);
  }
  disconnectedCallback() { }
  render() {
    const { states, callbacks } = isDemo()
      ? useLoginDemo(this)
      : usePortalLogin(this);
    const styles = {
      RegisterButton: {
        "&::part(label)": {
          padding: "0",
        },
      },
    };
    const sheet = createStyleSheet(styles);
    const styleString = sheet.toString();
    const content = {
      forgotPasswordButton: (h$1("slot", { name: "forgotPassword" }, h$1("a", { part: "forgot-password-link", onClick: () => jn.push(states.forgotPasswordPath) }, this.forgotPasswordLabel))),
      googleButton: (h$1("sqm-google-sign-in", { onInitComplete: callbacks.googleSubmit })),
      secondaryButton: (h$1("slot", { name: "secondaryButton" }, h$1("style", null, styleString), h$1("span", null, this.registerCTA, " ", h$1("sl-button", { size: "large", type: "text", disabled: states.loading, onClick: () => jn.push(states.registerPath), className: sheet.classes.RegisterButton }, this.registerLabel)))),
      emailLabel: this.emailLabel,
      passwordLabel: this.passwordLabel,
      submitLabel: this.submitLabel,
      pageLabel: this.pageLabel,
    };
    return (h$1(PortalLoginView, { states: states, callbacks: callbacks, content: content }));
  }
};
function useLoginDemo(props) {
  var _a, _b;
  return cjs({
    states: {
      error: ((_b = (_a = props.demoData) === null || _a === void 0 ? void 0 : _a.states) === null || _b === void 0 ? void 0 : _b.error) || "",
      loading: false,
      forgotPasswordPath: "/forgotPassword",
      registerPath: "/register",
      showLoginForm: "manual",
    },
    callbacks: {
      googleSubmit: async () => {
        console.log("google submit");
      },
      submit: async (_event) => {
        console.log("submit");
      },
    },
    content: {
      googleButton: null,
    },
  }, props.demoData || {}, { arrayMerge: (_, a) => a });
}

const PortalLogin = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.ignored = true;
    /**
     * Redirect participants to this page after they successfully login.
     *
     * @uiName Login redirect
     * @uiWidget pageSelect
     */
    this.nextPage = "/";
    /**
     * @uiName Email field label
     */
    this.emailLabel = "Email";
    /**
     * @uiName Password field label
     */
    this.passwordLabel = "Password";
    /**
     * @uiName Submit button text
     */
    this.submitLabel = "Sign In";
    /**
     * Redirect participants to this page to reset their password
     * @uiName Forgot password redirect
     * @uiWidget pageSelect
     */
    this.forgotPasswordPath = "/forgotPassword";
    /**
     * @uiName Forgot password text
     */
    this.forgotPasswordLabel = "Forgot Password?";
    /**
     * @uiName Register button text
     */
    this.registerLabel = "Register";
    /**
     * Redirect participants to this page to start registration.
     * @uiName Register button redirect
     * @uiWidget pageSelect
     */
    this.registerPath = "/register";
    /**
     * @uiName Heading label
     * @uiWidget textArea
     */
    this.pageLabel = "Sign in to your account";
    /**
     * Displayed when the login fails due to a network error. The participant can try refreshing the page.
     * @uiName Network error message
     */
    this.networkErrorMessage = "An error occurred while logging you in. Please refresh the page and try again.";
    h(this);
  }
  disconnectedCallback() { }
  render() {
    const { states, callbacks } = isDemo()
      ? useLoginDemo$1(this)
      : usePortalLogin(this);
    const styles = {
      RegisterButton: {
        "&::part(label)": {
          padding: "0",
        },
      },
    };
    const sheet = createStyleSheet(styles);
    const styleString = sheet.toString();
    const content = {
      forgotPasswordButton: (h$1("slot", { name: "forgotPassword" }, h$1("a", { part: "forgot-password-link", onClick: () => jn.push(states.forgotPasswordPath) }, this.forgotPasswordLabel))),
      googleButton: null,
      secondaryButton: (h$1("slot", { name: "secondaryButton" }, h$1("style", null, styleString), h$1("sl-button", { exportparts: "base: secondarybutton-base", type: "text", disabled: states.loading, onClick: () => jn.push(states.registerPath) }, this.registerLabel))),
      emailLabel: this.emailLabel,
      passwordLabel: this.passwordLabel,
      submitLabel: this.submitLabel,
      pageLabel: this.pageLabel,
    };
    return (h$1(PortalLoginView, { states: states, callbacks: callbacks, content: content }));
  }
};
function useLoginDemo$1(props) {
  return cjs({
    states: {
      error: "",
      loading: false,
      forgotPasswordPath: "/forgotPassword",
      registerPath: "/register",
      showLoginForm: "manual",
    },
    callbacks: {
      googleSubmit: async () => {
        console.log("google submit");
      },
      submit: async (_event) => {
        console.log("submit");
      },
    },
    content: {
      googleButton: null,
    },
  }, props.demoData || {}, { arrayMerge: (_, a) => a });
}

function usePortalRegister(props) {
  var _a, _b, _c, _d, _e, _f, _g, _h, _j;
  const formRef = useRef(null);
  const { registrationFormState, setRegistrationFormState } = useRegistrationFormState({});
  const [request, { loading, errors, data }] = Ve();
  useEffect(() => {
    if (!formRef.current)
      return;
    const form = formRef.current;
    form.addEventListener("sl-input", inputFunction);
    return () => {
      form.removeEventListener("sl-input", inputFunction);
    };
  }, [formRef.current]);
  const submit = async (event) => {
    var _a;
    let formControls = event.target.getFormControls();
    let formData = {};
    let validationErrors = {};
    formControls === null || formControls === void 0 ? void 0 : formControls.forEach((control) => {
      if (!control.name)
        return;
      const key = control.name;
      const value = control.value;
      jsonpointer.set(formData, key, value);
      // required validation
      if (control.required && !value) {
        jsonpointer.set(validationErrors, key, props.requiredFieldErrorMessage);
      }
      // custom validation
      if (typeof control.validationError === "function") {
        const validate = control.validationError;
        const validationError = validate({ control, key, value });
        if (validationError)
          jsonpointer.set(validationErrors, key, validationError);
      }
    });
    if ((props.confirmPassword || formData.confirmPassword) &&
      formData.password !== formData.confirmPassword) {
      validationErrors = {
        ...validationErrors,
        confirmPassword: props.passwordMismatchErrorMessage,
      };
    }
    if (Object.keys(validationErrors).length) {
      setRegistrationFormState({ loading: false, error: "", validationErrors });
      // early return for validation errors
      return;
    }
    setRegistrationFormState({
      loading: true,
      error: "",
      validationErrors: {},
    });
    const { email, password } = formData;
    delete formData.email;
    delete formData.password;
    delete formData.confirmPassword;
    formData = { ...formData };
    const redirectPath = props.redirectPath;
    const variables = {
      email,
      password,
      formData,
      redirectPath,
    };
    try {
      const result = await request(variables);
      if (result instanceof Error) {
        throw result;
      }
      setRegistrationFormState({
        loading: false,
        error: "",
        validationErrors: {},
      });
      if ((_a = result.registerManagedIdentityWithEmailAndPassword) === null || _a === void 0 ? void 0 : _a.token) {
        jn.push(props.nextPage);
      }
    }
    catch (error) {
      setRegistrationFormState({
        loading: false,
        error: props.networkErrorMessage,
        validationErrors: {},
      });
    }
  };
  const inputFunction = useCallback((e) => {
    var _a, _b;
    const name = (_b = (_a = e.target) === null || _a === void 0 ? void 0 : _a.type) === null || _b === void 0 ? void 0 : _b.toLowerCase();
    if (name !== "tel")
      return;
    const asYouType = new AsYouType("US");
    e.target.value = asYouType.input(e.target.value);
  }, []);
  let errorMessage = "";
  if ((_a = errors === null || errors === void 0 ? void 0 : errors.response) === null || _a === void 0 ? void 0 : _a["error"]) {
    errorMessage = props.networkErrorMessage;
  }
  else if ((errors === null || errors === void 0 ? void 0 : errors.message) && !((_b = errors === null || errors === void 0 ? void 0 : errors.response) === null || _b === void 0 ? void 0 : _b.errors.length)) {
    errorMessage = props.networkErrorMessage;
  }
  else {
    errorMessage =
      ((_f = (_e = (_d = (_c = errors === null || errors === void 0 ? void 0 : errors.response) === null || _c === void 0 ? void 0 : _c.errors) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.extensions) === null || _f === void 0 ? void 0 : _f.message) || ((_j = (_h = (_g = errors === null || errors === void 0 ? void 0 : errors.response) === null || _g === void 0 ? void 0 : _g.errors) === null || _h === void 0 ? void 0 : _h[0]) === null || _j === void 0 ? void 0 : _j.message) || (registrationFormState === null || registrationFormState === void 0 ? void 0 : registrationFormState.error);
  }
  return {
    states: {
      loading,
      error: errorMessage,
      registrationFormState,
      confirmPassword: props.confirmPassword,
      hideInputs: props.hideInputs,
      loginPath: props.loginPath,
      disablePasswordValidation: props.disablePasswordValidation,
    },
    callbacks: {
      submit,
      inputFunction,
    },
    refs: {
      formRef,
    },
  };
}

const PortalRegister = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.ignored = false;
    /**
     * Redirect participants to this page from their verification email
     *
     * @uiName Registration redirect
     * @uiWidget pageSelect
     */
    this.nextPage = "/";
    /**
     * The page that participants are redirected to from the verification email.
     *
     * @uiName Email verification redirect
     * @uiWidget pageSelect
     */
    this.redirectPath = "/verifyEmail";
    /**
     * @uiName Email field label
     */
    this.emailLabel = "Email";
    /**
     * @uiName Password field label
     */
    this.passwordLabel = "Password";
    /**
     * @uiName Submit button text
     */
    this.submitLabel = "Register";
    /**
     * @uiName Login button text
     */
    this.loginLabel = "Sign in";
    /**
     * @uiName Confirm password field label
     */
    this.confirmPasswordLabel = "Confirm Password";
    /**
     * @uiName Show confirm password field
     */
    this.confirmPassword = false;
    /**
     * @uiName Disable password validation
     */
    this.disablePasswordValidation = false;
    /**
     * Hides the email and password fields. Note: If you hide default inputs, you must add additional input fields. They must have the input name attributes "email" and "password" for this form to succeed.
     *
     * @uiName Hide default fields
     */
    this.hideInputs = false;
    /**
     * @uiName Header text
     */
    this.pageLabel = "Register";
    /**
     * Redirect participants to this page after clicking the login button.
     *
     * @uiName Login redirect
     * @uiWidget pageSelect
     */
    this.loginPath = "/login";
    /**
     * The message to be displayed when a required field is not filled.
     *
     * @uiName Required field message
     * @uiWidget textArea
     */
    this.requiredFieldErrorMessage = "Cannot be empty";
    /**
     * The message to be displayed when a the form submission fails unexpectedly.
     *
     * @uiName Network error message
     * @uiWidget textArea
     */
    this.networkErrorMessage = "Network request failed.";
    /**
     * The message to be displayed when password inputs do not match.
     *
     * @uiName Password mismatch message
     * @uiWidget textArea
     */
    this.passwordMismatchErrorMessage = "Passwords do not match.";
    /**
     * The message to be displayed when the email used is invalid or blocked.
     *
     * @uiName Invalid email message
     * @uiWidget textArea
     */
    this.invalidEmailErrorMessage = "Must be a valid email address";
    /**
     * @uiName Password requirement met
     */
    this.meetsRequirementsText = "Password has met all requirements";
    /**
     * @uiName Password requirement failed
     */
    this.doesNotMeetRequirementsText = "Password must meet the following requirements:";
    /**
     * @uiName Minimum length text
     */
    this.minErrorText = "be a minimum of 8 characters";
    /**
     * @uiName Missing uppercase text
     */
    this.uppercaseErrorText = "contain at least 1 uppercase character";
    /**
     * @uiName Missing lowercase text
     */
    this.lowercaseErrorText = "contain at least 1 lowercase character";
    /**
     * @uiName Missing number or symbol text
     */
    this.hasErrorText = "contain at least 1 number or symbol";
    h(this);
  }
  disconnectedCallback() { }
  render() {
    const { states, callbacks, refs } = isDemo()
      ? useRegisterDemo(this)
      : usePortalRegister(this);
    const content = {
      formData: h$1("slot", { name: "formData" }),
      secondaryButton: (h$1("slot", { name: "secondaryButton" }, h$1("sl-button", { type: "text", disabled: states.loading, onClick: () => jn.push(states.loginPath) }, this.loginLabel))),
      terms: h$1("slot", { name: "terms" }),
      emailLabel: this.emailLabel,
      passwordLabel: this.passwordLabel,
      submitLabel: this.submitLabel,
      pageLabel: this.pageLabel,
      confirmPasswordLabel: this.confirmPasswordLabel,
      invalidEmailErrorMessage: this.invalidEmailErrorMessage,
      requiredFieldErrorMessage: this.requiredFieldErrorMessage,
      meetsRequirementsText: this.meetsRequirementsText,
      doesNotMeetRequirementsText: this.doesNotMeetRequirementsText,
      minErrorText: this.minErrorText,
      uppercaseErrorText: this.uppercaseErrorText,
      lowercaseErrorText: this.lowercaseErrorText,
      hasErrorText: this.hasErrorText,
    };
    return (h$1(PortalRegisterView, { states: states, callbacks: callbacks, content: content, refs: refs }));
  }
};
function useRegisterDemo(props) {
  return cjs({
    states: {
      error: "",
      loading: false,
      confirmPassword: props.confirmPassword,
      hideInputs: props.hideInputs || false,
      customPasswordField: false,
      loginPath: props.loginPath,
      disablePasswordValidation: props.disablePasswordValidation,
    },
    callbacks: {
      submit: async (_event) => {
        console.log("submit");
      },
      inputFunction: () => { },
    },
    refs: {
      formRef: {},
    },
  }, props.demoData || {}, { arrayMerge: (_, a) => a });
}

const PortalRegistrationForm = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.ignored = true;
    /**
     * Redirect participants to this page after they successfully register.
     *
     * @uiName Registration redirect
     * @uiWidget pageSelect
     */
    this.nextPage = "/";
    /**
     * Redirect participants to this page from their verification email
     *
     * @uiName Email verification redirect
     * @uiWidget pageSelect
     */
    this.redirectPath = "/verifyEmail";
    /**
     * @uiName Email field label
     */
    this.emailLabel = "Email";
    /**
     * @uiName Password field label
     */
    this.passwordLabel = "Password";
    /**
     * @uiName Submit button text
     */
    this.submitLabel = "Register";
    /**
     * @uiName Login button text
     */
    this.loginLabel = "Sign in";
    /**
     * @uiName Confirm password field label
     */
    this.confirmPasswordLabel = "Confirm Password";
    /**
     * @uiName Show confirm password field
     */
    this.confirmPassword = false;
    /**
     * @uiName Disable password validation
     */
    this.disablePasswordValidation = false;
    /**
     * Hides the email and password fields. Note: If you hide default inputs, you must add additional input fields. They must have the input name attributes "email" and "password" for this form to succeed.
     *
     * @uiName Hide default fields
     */
    this.hideInputs = false;
    /**
     * @uiName Header text
     */
    this.pageLabel = "Register";
    /**
     * Redirect participants to this page after clicking the login button.
     *
     * @uiName Login redirect
     * @uiWidget pageSelect
     */
    this.loginPath = "/login";
    /**
     * The message to be displayed when a required field is not filled.
     *
     * @uiName Required field message
     * @uiWidget textArea
     */
    this.requiredFieldErrorMessage = "Cannot be empty";
    /**
     * The message to be displayed when a the form submission fails unexpectedly.
     *
     * @uiName Network error message
     * @uiWidget textArea
     */
    this.networkErrorMessage = "Network request failed.";
    /**
     * The message to be displayed when password inputs do not match.
     *
     * @uiName Password mismatch message
     * @uiWidget textArea
     */
    this.passwordMismatchErrorMessage = "Passwords do not match.";
    /**
     * The message to be displayed when the email used is invalid or blocked.
     *
     * @uiName Invalid email message
     * @uiWidget textArea
     */
    this.invalidEmailErrorMessage = "Must be a valid email address";
    /**
     * The message to be displayed when the registration form is disabled.
     *
     * @uiName Form disabled message
     * @uiWidget textArea
     */
    this.formDisabledErrorMessage = "The registration form is currently disabled.";
    /**
     * @uiName Password requirement met
     */
    this.meetsRequirementsText = "Password has met all requirements";
    /**
     * @uiName Password requirement failed
     */
    this.doesNotMeetRequirementsText = "Password must meet the following requirements:";
    /**
     * @uiName Minimum length text
     */
    this.minErrorText = "be a minimum of 8 characters";
    /**
     * @uiName Missing uppercase text
     */
    this.uppercaseErrorText = "contain at least 1 uppercase character";
    /**
     * @uiName Missing lowercase text
     */
    this.lowercaseErrorText = "contain at least 1 lowercase character";
    /**
     * @uiName Missing number or symbol text
     */
    this.hasErrorText = "contain at least 1 number or symbol";
    h(this);
  }
  disconnectedCallback() { }
  render() {
    const { states, callbacks, refs } = isDemo()
      ? useRegisterDemo$1(this)
      : usePortalRegistrationForm(this);
    const content = {
      formData: h$1("slot", { name: "formData" }),
      secondaryButton: (h$1("slot", { name: "secondaryButton" }, h$1("sl-button", { type: "text", disabled: states.loading, onClick: () => jn.push(states.loginPath) }, this.loginLabel))),
      terms: h$1("slot", { name: "terms" }),
      emailOptIn: h$1("slot", { name: "emailOptIn" }),
      emailLabel: this.emailLabel,
      passwordLabel: this.passwordLabel,
      submitLabel: this.submitLabel,
      pageLabel: this.pageLabel,
      confirmPasswordLabel: this.confirmPasswordLabel,
      networkErrorMessage: this.networkErrorMessage,
      passwordMismatchErrorMessage: this.passwordMismatchErrorMessage,
      invalidEmailErrorMessage: this.invalidEmailErrorMessage,
      formDisabledErrorMessage: this.formDisabledErrorMessage,
      requiredFieldErrorMessage: this.requiredFieldErrorMessage,
      meetsRequirementsText: this.meetsRequirementsText,
      doesNotMeetRequirementsText: this.doesNotMeetRequirementsText,
      minErrorText: this.minErrorText,
      uppercaseErrorText: this.uppercaseErrorText,
      lowercaseErrorText: this.lowercaseErrorText,
      hasErrorText: this.hasErrorText,
    };
    return (h$1(PortalRegistrationFormView, { states: states, callbacks: callbacks, content: content, refs: refs }));
  }
};
function useRegisterDemo$1(props) {
  return cjs({
    states: {
      error: "",
      loading: false,
      confirmPassword: props.confirmPassword,
      hideInputs: props.hideInputs || false,
      customPasswordField: false,
      loginPath: "/login",
    },
    callbacks: {
      submit: async (_event) => {
        console.log("submit");
      },
      inputFunction: () => { },
    },
    refs: {
      formRef: {},
    },
  }, props.demoData || {}, { arrayMerge: (_, a) => a });
}

let globalPromise = null;
function usePortalVerifyEmail({ nextPage, failedPage, verifySuccessText, verifyEmailText, verifyInvalidText, networkErrorMessage, continueText, }) {
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
  const [completed, setCompleted] = useState(false);
  const [successful, setSuccessful] = useState(false);
  const userIdent = J();
  const [request, { loading, data, errors }] = an();
  const urlParams = new URLSearchParams(jn.location.search);
  const oobCode = urlParams.get("oobCode");
  const oobEmail = urlParams.get("email");
  const nextPageOverride = urlParams.get("nextPage");
  // derived from useMutation in component boilerplate initialState
  const disableContinue = data === undefined && errors === undefined && !!oobCode;
  // if logged out, userIdent?.managedIdentity?.emailVerified will be falsey, even if verification was successful
  const verified = !!(((_a = userIdent === null || userIdent === void 0 ? void 0 : userIdent.managedIdentity) === null || _a === void 0 ? void 0 : _a.emailVerified) || ((_b = data === null || data === void 0 ? void 0 : data.verifyManagedIdentityEmail) === null || _b === void 0 ? void 0 : _b.success) ||
    successful);
  const validEmail = ((_c = userIdent === null || userIdent === void 0 ? void 0 : userIdent.managedIdentity) === null || _c === void 0 ? void 0 : _c.email) === oobEmail;
  const failed = () => {
    return jn.push({
      pathname: failedPage,
      search: urlParams.toString() && "?" + urlParams.toString(),
    });
  };
  const gotoNextPage = () => {
    urlParams.delete("nextPage");
    const url = sanitizeUrlPath(nextPageOverride || nextPage);
    jn.push(url.href);
  };
  const logout = () => {
    setTimeout(() => {
      setUserIdentity(undefined);
      gotoNextPage();
    }, 3000);
  };
  const login = () => {
    setTimeout(gotoNextPage, 3000);
  };
  useEffect(() => {
    const verify = async () => {
      if (!globalPromise)
        globalPromise = request({ oobCode });
      const result = await globalPromise;
      if (!(result instanceof Error) &&
        result.verifyManagedIdentityEmail.success) {
        // Needs to be explicitly updated if multiple renders have occured
        setSuccessful(true);
      }
      setCompleted(true);
    };
    verify();
  }, []);
  useEffect(() => {
    if (!completed)
      return;
    if (verified && validEmail)
      login();
    else
      logout();
  }, [completed, verified]);
  return {
    states: {
      loading: loading || !completed,
      disableContinue,
      error: ((_g = (_f = (_e = (_d = errors === null || errors === void 0 ? void 0 : errors.response) === null || _d === void 0 ? void 0 : _d.errors) === null || _e === void 0 ? void 0 : _e[0]) === null || _f === void 0 ? void 0 : _f.extensions) === null || _g === void 0 ? void 0 : _g.message) || ((_k = (_j = (_h = errors === null || errors === void 0 ? void 0 : errors.response) === null || _h === void 0 ? void 0 : _h.errors) === null || _j === void 0 ? void 0 : _j[0]) === null || _k === void 0 ? void 0 : _k.message) ||
        (((errors === null || errors === void 0 ? void 0 : errors.message) || !validEmail) && networkErrorMessage),
      success: completed && successful && (verified || validEmail),
    },
    data: {
      oobCode,
    },
    callbacks: {
      failed,
      gotoNextPage,
    },
    content: {
      verifySuccessText,
      verifyEmailText,
      verifyInvalidText,
      continueText,
    },
  };
}

const PortalVerifyEmail = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.ignored = true;
    /**
     * Redirect participants to this page when they successfully verify their email.
     *
     * @uiName Successful verification redirect
     * @uiWidget pageSelect
     */
    this.nextPage = "/";
    /**
     * Redirect participants to this page if verification fails due to an outdated verification attempt.
     *
     * @uiName Failed verification redirect
     * @uiWidget pageSelect
     */
    this.failedPage = "/";
    /**
     * @uiName Verify email text
     * @uiWidget textArea
     */
    this.verifyEmailText = "Verify your email";
    /**
     * @uiName Email verification success text
     * @uiWidget textArea
     */
    this.verifySuccessText = "Your email has been verified and you are being redirected. If you are not redirected, please click Continue.";
    /**
     * @uiName Email verification invalid text
     * @uiWidget textArea
     */
    this.verifyInvalidText = "The email verification code is invalid or has expired, please try again.";
    /**
     * @uiName Continue text
     */
    this.continueText = "Continue";
    /**
     * Displayed when the email verification fails due to a network error. The participant can try refreshing the page.
     * @uiName Network error message
     */
    this.networkErrorMessage = "An error occurred while verifying your email. Please refresh the page and try again.";
    h(this);
  }
  disconnectedCallback() { }
  render() {
    const { states, data, callbacks, content } = isDemo()
      ? usePortalVerifyEmailDemo(getProps(this))
      : usePortalVerifyEmail(getProps(this));
    return (h$1(PortalVerifyEmailView, { states: states, data: data, callbacks: callbacks, content: content }));
  }
};
function usePortalVerifyEmailDemo(props) {
  return cjs({
    states: { error: "", loading: false, success: true },
    data: {
      oobCode: "code",
    },
    callbacks: {
      failed: () => {
        console.log("failed");
      },
      gotoNextPage: () => { },
    },
    content: {
      verifySuccessText: props.verifySuccessText,
      verifyEmailText: props.verifyEmailText,
      verifyInvalidText: props.verifyInvalidText,
      continueText: props.continueText,
    },
  }, props.demoData || {}, { arrayMerge: (_, a) => a });
}

export { PortalForgotPassword as sqm_portal_forgot_password, PortalGoogleLogin as sqm_portal_google_login, PortalLogin as sqm_portal_login, PortalRegister as sqm_portal_register, PortalRegistrationForm as sqm_portal_registration_form, PortalVerifyEmail as sqm_portal_verify_email };
