@saasquatch/mint-components 2.1.9-1 → 2.1.9-11

package/dist/esm/sqm-widget-verification.entry.js

@@ -1,10 +1,13 @@
-import { r as registerInstance, h as h$1 } from './index-38ad4957.js';
-import { k as useState, f as useEffect, n as h } from './dom-context-hooks.module-50442785.js';
-import { d as dist, J, I as In, q as En, X as Xe, i as isDemo } from './index.module-e266b4d7.js';
-import { c as cjs } from './cjs-bdfb4486.js';
-import { g as getProps } from './utils-334c1e34.js';
-import { e as extractProps, p as parseStates } from './extractProps-54064fb0.js';
-import { S as SHOW_CODE_NAMESPACE, V as VERIFICATION_EMAIL_NAMESPACE, a as VERIFICATION_PARENT_NAMESPACE } from './keys-406491dc.js';
+import { r as registerInstance, h as h$1 } from './index-d9876cd5.js';
+import { i as useState, j as useEffect, o as h } from './dom-context-hooks.module-8411297a.js';
+import { d as dist, J, I as In, r as En, X as Xe, i as isDemo } from './index.module-76b0705d.js';
+import './jss-preset-default.esm-c36417f8.js';
+import { c as createStyleSheet } from './JSS-8c381d8b.js';
+import { g as getProps } from './utils-61821fb1.js';
+import { c as cjs } from './cjs-e829b75b.js';
+import { S as SHOW_CODE_NAMESPACE, a as VERIFICATION_EMAIL_NAMESPACE, V as VERIFICATION_PARENT_NAMESPACE } from './keys-db1897ae.js';
+import { p as parseStates } from './parseStates-ed75e224.js';
+import { e as extractProps } from './extractProps-ae1afbb3.js';
 
 const USER_LOOKUP = dist.gql `
   query checkUserVerification {
@@ -18,6 +21,9 @@ const USER_LOOKUP = dist.gql `
           email
           emailVerified
         }
+        impactConnection {
+          connected
+        }
       }
     }
   }
@@ -38,15 +44,22 @@ function useWidgetVerification() {
   const [fetch] = Xe(USER_LOOKUP);
   useEffect(() => {
     const checkUser = async () => {
-      var _a, _b, _c;
+      var _a, _b, _c, _d, _e;
       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)
+        // Flow changed to send email -> verify code -> show early partner creation modal
+        const emailVerified = ((_a = res === null || res === void 0 ? void 0 : res.viewer) === null || _a === void 0 ? void 0 : _a.emailVerified) || ((_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);
+        const isConnected = (_e = (_d = res === null || res === void 0 ? void 0 : res.viewer) === null || _d === void 0 ? void 0 : _d.impactConnection) === null || _e === void 0 ? void 0 : _e.connected;
+        if (isConnected) {
+          // Partner already created, show widget content
           setContext(true);
+        }
+        else if (emailVerified) {
+          // Email verified but no partner yet, show partner modal
+          setShowPartnerModal(true);
+        }
       }
       catch (e) {
         console.error("Could not fetch user information:", e);
@@ -70,7 +83,7 @@ function useWidgetVerification() {
 const WidgetVerification = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    // ! Any updated must be reflected in sqm-widget-verification-internal AND sqm-email-verification AND sqm-code-verification
+    // ! Any updated must be reflected in sqm-widget-verification-internal AND sqm-email-verification AND sqm-code-verification AND sqm-partner-info-modal
     /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
                     GENERAL PROPS
       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
@@ -118,7 +131,7 @@ const WidgetVerification = class {
      */
     this.emailStep_emailValidationErrorText = "Please enter a valid email";
     /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-                    EMAIL STEP PROPS
+                    CODE STEP PROPS
       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
     /**
      * @uiName Verify code widget header text
@@ -165,10 +178,86 @@ const WidgetVerification = class {
      * @uiGroup Code Verification Step
      */
     this.codeStep_networkErrorMessage = "An error occurred while verifying your email. Please refresh the page and try again.";
+    /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+                    PARTNER CREATION STEP PROPS
+      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
+    /**
+     * @uiName New partner header
+     * @uiGroup Partner Creation Step
+     * @uiWidget textArea
+     */
+    this.createPartnerStep_modalHeader = "Let's get you ready for rewards";
+    /**
+     * @uiName Existing partner header
+     * @uiGroup Partner Creation Step
+     * @uiWidget textArea
+     */
+    this.createPartnerStep_modalHeaderExistingPartner = "We found an existing account";
+    /**
+     * @uiName New partner description
+     * @uiGroup Partner Creation Step
+     * @uiWidget textArea
+     */
+    this.createPartnerStep_descriptionNewPartner = "Confirm your country and currency now to get your future rewards faster.";
+    /**
+     * @uiName Existing partner description
+     * @uiGroup Partner Creation Step
+     * @uiWidget textArea
+     */
+    this.createPartnerStep_descriptionExistingPartner = "We found an account with this email on our referral program provider, impact.com. Please confirm your country and currency now to get your future rewards faster.";
+    /**
+     * @uiName Existing partner support description
+     * @uiGroup Partner Creation Step
+     * @uiWidget textArea
+     */
+    this.createPartnerStep_supportDescriptionExistingPartner = "If this is a mistake, please contact Support or sign up for this referral program with a different email.";
+    /**
+     * @uiName Country label
+     * @uiGroup Partner Creation Step
+     */
+    this.createPartnerStep_countryLabel = "Country";
+    /**
+     * @uiName Currency label
+     * @uiGroup Partner Creation Step
+     */
+    this.createPartnerStep_currencyLabel = "Currency";
+    /**
+     * @uiName Submit button label
+     * @uiGroup Partner Creation Step
+     */
+    this.createPartnerStep_submitButtonLabel = "Submit";
+    /**
+     * @uiName Confirm button label
+     * @uiGroup Partner Creation Step
+     */
+    this.createPartnerStep_confirmButtonLabel = "Confirm";
+    /**
+     * @uiName Search country placeholder
+     * @uiGroup Partner Creation Step
+     */
+    this.createPartnerStep_searchCountryPlaceholder = "Search for a country";
+    /**
+     * @uiName Search currency placeholder
+     * @uiGroup Partner Creation Step
+     */
+    this.createPartnerStep_searchCurrencyPlaceholder = "Search for a currency";
+    /**
+     * @uiName Network error text
+     * @uiGroup Partner Creation Step
+     * @uiWidget textArea
+     */
+    this.createPartnerStep_networkErrorText = "An error occurred. Please try again.";
+    /**
+     * @uiName Missing fields error text
+     * @uiGroup Partner Creation Step
+     * @uiWidget textArea
+     */
+    this.createPartnerStep_missingFieldsErrorText = "Please select both a country and currency.";
     /**
      * @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" }
+     * @componentState { "title": "Step 3: Create Partner", "props": { "showPartnerModal": true }, "dependencies": ["sqm-partner-info-modal"], "uiGroup": "Partner Creation Step" }
      */
     this.stateController = "{}";
     h(this);
@@ -184,15 +273,58 @@ const WidgetVerification = class {
       : useWidgetVerification();
     if (props.loading)
       return h$1("sl-spinner", null);
-    if (props.showPartnerModal) {
-      return h$1("sqm-partner-info-modal", null);
-    }
+    const style = {
+      Dialog: {
+        "&::part(panel)": {
+          maxWidth: "480px",
+        },
+        "&::part(title)": {
+          fontSize: "var(--sl-font-size-x-large)",
+          fontWeight: "600",
+          padding: "var(--sl-spacing-x-large) var(--sl-spacing-x-large) 0 var(--sl-spacing-x-large)",
+        },
+        "&::part(body)": {
+          padding: "0 var(--sl-spacing-x-large)",
+          fontSize: "var(--sl-font-size-small)",
+          overflow: "visible",
+        },
+        "&::part(footer)": {
+          display: "flex",
+          flexDirection: "column",
+          gap: "var(--sl-spacing-small)",
+        },
+        "&::part(overlay)": {
+          background: "rgba(0, 0, 0, 0.5)",
+        },
+        "&::part(close-button)": {
+          display: "none",
+        },
+      },
+    };
+    const sheet = createStyleSheet(style);
+    const styleString = sheet.toString();
     const generalText = this.getStepTextProps("general_");
-    return (h$1("div", null, h$1("h3", { style: { fontSize: "24px", margin: "0" } }, generalText.verifyEmailHeader), h$1("p", { style: {
-        color: "var(--sl-color-neutral-500)",
-        fontSize: "var(--sl-font-size-medium)",
-        margin: "0",
-      } }, generalText.verifyEmailDescription), props.showCode ? (h$1("sqm-code-verification", Object.assign({ onVerification: props.onVerification }, this.getStepTextProps("codeStep_"), extractProps(props, "sqm-code-verification_")))) : (h$1("sqm-email-verification", Object.assign({}, this.getStepTextProps("emailStep_"), extractProps(props, "sqm-email-verification_"))))));
+    const partnerText = this.getStepTextProps("createPartnerStep_");
+    const dialogLabel = props.showPartnerModal
+      ? partnerText.modalHeader
+      : generalText.verifyEmailHeader;
+    const renderStepContent = () => {
+      if (props.showPartnerModal) {
+        return (h$1("sqm-partner-info-modal", Object.assign({ embedded: true }, partnerText)));
+      }
+      if (props.showCode) {
+        return (h$1("sqm-code-verification", Object.assign({ onVerification: props.onVerification }, this.getStepTextProps("codeStep_"), extractProps(props, "sqm-code-verification_"))));
+      }
+      return (h$1("sqm-email-verification", Object.assign({}, this.getStepTextProps("emailStep_"), extractProps(props, "sqm-email-verification_"))));
+    };
+    return (h$1("div", null, h$1("style", { type: "text/css" }, styleString), h$1("sl-dialog", { class: sheet.classes.Dialog, noHeader: false, open: true, label: dialogLabel, "onSl-request-close": (e) => {
+        e.preventDefault();
+      }, "onSl-hide": (e) => {
+        var _a;
+        if (((_a = e.target) === null || _a === void 0 ? void 0 : _a.tagName) === "SL-DIALOG") {
+          e.preventDefault();
+        }
+      } }, renderStepContent())));
   }
 };
 function useDemoWidgetVerificationInternal(props) {
@@ -212,7 +344,13 @@ function useDemoWidgetVerificationInternal(props) {
   const onVerification = () => {
     setContext(true);
   };
-  return cjs({ showCode, showPartnerModal: false, onVerification, onPartnerModalComplete: () => { }, loading: false }, formatted || {}, { arrayMerge: (_, a) => a });
+  return cjs({
+    showCode,
+    showPartnerModal: false,
+    onVerification,
+    onPartnerModalComplete: () => { },
+    loading: false,
+  }, formatted || {}, { arrayMerge: (_, a) => a });
 }
 
 export { WidgetVerification as sqm_widget_verification };

package/dist/esm/{useChildElements-31ba3daf.js → useChildElements-c26d7347.js}

@@ -1,5 +1,5 @@
 import { k as useState, u as useMemo } from './dom-context-hooks.module-50442785.js';
-import { _ } from './index.module-e266b4d7.js';
+import { _ } from './index.module-cede12c6.js';
 
 function useChildElements() {
   const host = _();

package/dist/esm/{useInstantAccessRegistration-1388dace.js → useInstantAccessRegistration-e2392f42.js}

@@ -1,7 +1,7 @@
 import { k as useState } from './dom-context-hooks.module-50442785.js';
-import { L, v as vn } from './index.module-e266b4d7.js';
+import { L, v as vn } from './index.module-cede12c6.js';
 import { j as jsonpointer } from './jsonpointer-388a7082.js';
-import { u as useRegistrationFormState } from './useRegistrationFormState-0cee2d21.js';
+import { u as useRegistrationFormState } from './useRegistrationFormState-1813bdef.js';
 
 function useInstantAccessRegistration(props) {
   const locale = L();

package/dist/esm/{useLeadFormState-cec544ea.js → useLeadFormState-9099c8d4.js}

@@ -1,7 +1,7 @@
 import { h } from './index-38ad4957.js';
-import { i as intl } from './global-b2ee3a12.js';
+import { i as intl } from './global-39f55ec2.js';
 import { k as useState, y } from './dom-context-hooks.module-50442785.js';
-import { _ } from './index.module-e266b4d7.js';
+import { _ } from './index.module-cede12c6.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 
 const style = {

package/dist/esm/{usePayoutStatus-24145412.js → usePayoutStatus-fa504d49.js}

@@ -1,5 +1,5 @@
 import { k as useState, f as useEffect } from './dom-context-hooks.module-50442785.js';
-import { d as dist, J, $ as $e, g as getEnvironmentSDK, w as wn } from './index.module-e266b4d7.js';
+import { d as dist, J, $ as $e, g as getEnvironmentSDK, w as wn } from './index.module-cede12c6.js';
 import { T as TAX_FORM_UPDATED_EVENT_KEY } from './eventKeys-f76b6a03.js';
 
 var toArray = function toArray(a) {

package/dist/esm/{usePortalRegistrationForm-6d562bf8.js → usePortalRegistrationForm-5844032a.js}

@@ -1,7 +1,7 @@
 import { m as useRef, f as useEffect } from './dom-context-hooks.module-50442785.js';
-import { d as dist, L, O as Oe, w as wn, j as jn, b as useCallback } from './index.module-e266b4d7.js';
+import { d as dist, L, O as Oe, w as wn, j as jn, b as useCallback } from './index.module-cede12c6.js';
 import { j as jsonpointer } from './jsonpointer-388a7082.js';
-import { u as useRegistrationFormState } from './useRegistrationFormState-0cee2d21.js';
+import { u as useRegistrationFormState } from './useRegistrationFormState-1813bdef.js';
 
 // This file is a workaround for a bug in web browsers' "native"
 // ES6 importing system which is uncapable of importing "*.json" files.

package/dist/esm/{useReferralCodes-1ca1fda0.js → useReferralCodes-3cde72d4.js}

@@ -1,5 +1,5 @@
 import { f as useEffect } from './dom-context-hooks.module-50442785.js';
-import { d as dist, J, B, H, Q as Qe, R as Rn, I as In } from './index.module-e266b4d7.js';
+import { d as dist, J, B, H, Q as Qe, R as Rn, I as In } from './index.module-cede12c6.js';
 
 const GET_REFERRAL_CODES = dist.gql `
   query getCodes(

package/dist/esm/{useReferralTable-456931fd.js → useReferralTable-35e6d4c1.js}

@@ -1,8 +1,8 @@
 import { h } from './index-38ad4957.js';
 import { b as browser, j as useReducer, f as useEffect } from './dom-context-hooks.module-50442785.js';
-import { d as dist, J, H, L, w as wn, R as Rn } from './index.module-e266b4d7.js';
-import { u as useRerenderListener } from './re-render-4f4bd4da.js';
-import { u as useChildElements } from './useChildElements-31ba3daf.js';
+import { d as dist, J, H, L, w as wn, R as Rn } from './index.module-cede12c6.js';
+import { u as useRerenderListener } from './re-render-7a0c7976.js';
+import { u as useChildElements } from './useChildElements-c26d7347.js';
 
 const debug = browser("sq:useReferralTable");
 const CSS_NAMESPACE = "sqm-referral-table";

package/dist/esm/{useRegistrationFormState-0cee2d21.js → useRegistrationFormState-1813bdef.js}

@@ -1,5 +1,5 @@
 import { i as d, y } from './dom-context-hooks.module-50442785.js';
-import { _ } from './index.module-e266b4d7.js';
+import { _ } from './index.module-cede12c6.js';
 
 const REGISTRATION_FORM_STATE_CONTEXT = "sq:registration-form-state";
 const REGISTRATION_FORM_STATE_CONTEXT_INTERNAL = "sq:registration-form-state-internal";

package/dist/esm/{useVerificationEmail-5c6cd733.js → useVerificationEmail-cb3d51e3.js}

@@ -1,5 +1,5 @@
 import { k as useState, f as useEffect } from './dom-context-hooks.module-50442785.js';
-import { d as dist, J, X as Xe, $ as $e } from './index.module-e266b4d7.js';
+import { d as dist, J, X as Xe, $ as $e } from './index.module-cede12c6.js';
 
 const UserLookupQuery = dist.gql `
   query userLookup {

package/dist/esm/{utilities-f05633da.js → utilities-c9e730ed.js}

@@ -1,5 +1,5 @@
 import { k as useState, f as useEffect } from './dom-context-hooks.module-50442785.js';
-import { b as useCallback } from './index.module-e266b4d7.js';
+import { b as useCallback } from './index.module-cede12c6.js';
 
 // import { IntlMessageFormat } from 'intl-messageformat';
 function isMobile(breakPoint) {