@zeniai/web-components 3.17.10 → 3.17.11

package/dist/CustomerOnboardingNoStepsPage-BgaeCsw0.js

@@ -0,0 +1,424 @@
+import { u as be, g as xe, h as Pe, j as o, F as ke } from "./vendor-.pnpm-B2klaOGU.js";
+import d from "@emotion/styled";
+import { u as we, dD as ae, a as Ae, aD as ve, aE as Oe, S as i, e as $e, ao as je, L as Be, jl as Ie, hi as Le, dU as oe, j as Te, R as O, o as Ve, D as S, hL as Fe } from "./index-Dg4HzhKR.js";
+import { useEffect as q, useState as ze } from "react";
+import { P as De, C as _e } from "./PaymentAccountSetupBillingAddressSection-B4IAgMEq.js";
+import { a as Ee } from "./CustomerOnboardingDetailPageSkeleton-CYl8itwj.js";
+const Q = "onboardingPaymentAccountSetupSection", ie = "customerOnboardingNoStepsDetailPage", s = "onboardingSubscriptionBillingAddress", J = {
+  titleWidth: new O(343, 580, 726, 826),
+  subTitlePaddingTop: new O(S[3], S[3]),
+  subTitlePaddingBottom: new O(S[3], S[3]),
+  termsPaddingLeftRight: new O(S[0], S[3])
+}, Ne = (e) => `${e}_form`, Ue = Ae.getLocalizedStrings(), Re = ({
+  onboardingCustomerView: e,
+  connectedAccountProvider: b,
+  cardPaymentView: y,
+  stripeKey: j,
+  googleAPIKey: B,
+  signedInUser: x,
+  currentTenant: I,
+  onUpdateStep: L,
+  handleCreateCardSetupIntent: T,
+  handleConfirmCardSetupIntent: V,
+  updateCardPaymentModalState: P,
+  handleAddCardPaymentSource: F,
+  resetCardPaymentViewState: z,
+  handleResetCardPaymentErrorStatuses: D,
+  redirectToProductSuitePage: k,
+  onUpdateCustomerView: _,
+  ...E
+}) => {
+  const u = we(), N = ae(), { analytics: h } = N, {
+    onFetchLinkTokenClick: U,
+    onUpdatePaymentAccountStatus: R,
+    onUpdatePaymentAccountLoginStatus: W,
+    onEstablishConnectionClick: C,
+    onEstablishConnectionSuccess: G,
+    handleLogOutClick: H,
+    onZeniLogoClick: M,
+    onAddressEditHandler: w
+  } = E, Z = be(), r = xe({
+    mode: "onSubmit",
+    reValidateMode: "onSubmit",
+    defaultValues: $(e),
+    values: $(e),
+    shouldFocusError: !0,
+    resetOptions: {
+      keepDirtyValues: !0
+    }
+  }), {
+    companyOfficerLocalData: re,
+    saveStatus: p,
+    paymentAccount: A,
+    paymentAccountStatus: ce,
+    plaidConnectionDetails: X,
+    uiState: le,
+    allNationalityCountries: Y,
+    subscriptionBillingAddress: g
+  } = e, { customerOnboardingPage: de, common: m } = Ue, { footer: ue, steps: pe } = de, { buttons: K } = ue, ee = pe.link_payment_account, v = ve(p.fetchState), te = Object.values(re).findIndex(
+    (t) => t?.isSelectedForVerification === !0
+  ) ?? 0, ge = `Officer_${te < 0 ? 1 : te + 1}`, me = async (t, n) => {
+    if (t.includes(s) && n[s] != null) {
+      const a = r.getValues(
+        `${s}`
+      ).country;
+      let c = n[s];
+      if (t.includes(`${s}.street`) && n[s].street != null) {
+        const { addressValue: l } = n[s].street, f = Le(l?.country);
+        c = {
+          street: n[s].street ?? m.strings.empty,
+          city: l?.locality ?? m.strings.empty,
+          state: l?.administrativeAreaLevel1 ?? m.strings.empty,
+          country: f,
+          countryCode: l?.countryCode ?? m.strings.empty,
+          postalCode: l?.postalCode ?? m.strings.empty,
+          secondaryInfo: n[s].secondaryInfo,
+          suite: n[s].suite
+        }, a.selectedOption !== f.selectedOption && (c = {
+          ...c,
+          country: f
+        });
+      } else t === `${s}.country` && a.selectedOption != null ? c = {
+        ...c,
+        countryCode: oe(a.selectedOption)
+      } : a.selectedOption != null && t.includes(`${s}.street`) === !1 && (c = {
+        ...c,
+        countryCode: oe(a.selectedOption)
+      });
+      w(c);
+    }
+  };
+  q(() => {
+    const t = r.watch((n, { name: a }) => {
+      a != null && n != null && Pe(() => me(a, n));
+    });
+    return () => {
+      t.unsubscribe();
+    };
+  }), q(() => {
+    v === "In-Progress" && p.fetchState === "Completed" && r.reset($(e), {
+      keepDirtyValues: !1
+    });
+  }, [
+    r,
+    e,
+    v,
+    p.fetchState,
+    Y
+  ]);
+  const fe = () => {
+    const t = r.getValues(
+      s
+    ), n = {
+      street: t.street.addressString,
+      suite: t.suite,
+      city: t.city,
+      state: t.state,
+      postalCode: t.postalCode,
+      country: t.country.selectedOption ?? m.strings.empty,
+      secondaryInfo: t.secondaryInfo
+    };
+    h.trackOnboardingBillingAddressSave(n);
+  }, se = () => {
+    const t = Object.values(X).some(
+      (f) => f.fetchStatus.fetchState === "Completed"
+    ), n = A?.providerVerificationStatus?.code?.includes("verified") ?? !1, a = y.cardsList.length > 0, l = y.bankAccountsList[0]?.providerVerificationStatus?.code?.includes(
+      "verified"
+    ) ?? !1;
+    return t && n || !n && !A && a || !a && !A && l;
+  };
+  function ye() {
+    if (r.getFieldState(
+      s
+    ).error)
+      return !1;
+    const n = r.getValues(
+      s
+    ), a = g?.street.join("").trim(), c = g?.city, l = g?.state, f = g?.country, Ce = g?.postalCode != null && g.postalCode || n.postalCode || m.strings.empty;
+    return !!a && !!c && !!l && !!f && !!Ce;
+  }
+  const Se = async () => {
+    const t = await r.trigger(
+      s
+    ), n = await r.trigger(
+      Q
+    );
+    t && n && (fe(), L("link_payment_account"), _(ge, !1, !0));
+  };
+  q(() => {
+    v === "In-Progress" && p.fetchState === "Completed" && (r.reset($(e), {
+      keepDirtyValues: !1
+    }), k());
+  }, [
+    r,
+    e,
+    v,
+    p.fetchState,
+    Y,
+    k
+  ]);
+  const [ne, he] = ze(!1);
+  return /* @__PURE__ */ o.jsxs(We, { children: [
+    /* @__PURE__ */ o.jsxs(Ge, { windowSize: u, children: [
+      /* @__PURE__ */ o.jsx(
+        Oe,
+        {
+          title: ee.sectionTitle,
+          showBackButton: !1,
+          backgroundColor: Z.colors.grey4,
+          style: {
+            zIndex: 4
+          },
+          source: "CustomerOnboardingPaymentAddressDetailPage",
+          showLeftSection: u !== "small",
+          titleStyle: {
+            display: "flex",
+            alignItems: "center"
+          },
+          navBarContainerStyles: {
+            paddingTop: i.sp0,
+            paddingBottom: i.sp0
+          },
+          leftSideComponent: /* @__PURE__ */ o.jsx(Ke, { children: /* @__PURE__ */ o.jsx(
+            qe,
+            {
+              "data-testid": $e(
+                "zeni-logo-customer-onboarding-payment-address-detail-page"
+              ),
+              onClick: M
+            }
+          ) })
+        }
+      ),
+      /* @__PURE__ */ o.jsx(ke, { ...r, children: /* @__PURE__ */ o.jsx(Me, { id: Ne(ie), children: /* @__PURE__ */ o.jsxs(He, { children: [
+        /* @__PURE__ */ o.jsx(Je, { windowSize: u, children: ee.sectionSubTitle }),
+        /* @__PURE__ */ o.jsx(
+          De,
+          {
+            connectedAccountProvider: b,
+            paymentAccount: A,
+            accountStatus: ce,
+            plaidConnectionDetails: X,
+            subscriptionBillingAddressSectionId: s,
+            sectionId: Q,
+            analytics: h,
+            isValid: se(),
+            onFetchLinkTokenClick: U,
+            onEstablishConnectionClick: C,
+            onUpdatePaymentAccountStatus: R,
+            onUpdatePaymentAccountLoginStatus: W,
+            onEstablishConnectionSuccess: G,
+            updateCardPaymentModalState: P,
+            cardPaymentView: y,
+            resetCardPaymentViewState: z,
+            cardSetupInProgress: ne,
+            googleAPIKey: B,
+            subscriptionBillingAddress: g
+          }
+        )
+      ] }, "link_payment_account") }) }),
+      /* @__PURE__ */ o.jsx(
+        je,
+        {
+          formId: `${ie}`,
+          leftSideComponent: /* @__PURE__ */ o.jsx(Ze, { windowSize: u, children: /* @__PURE__ */ o.jsx(
+            Be,
+            {
+              signedInUser: x,
+              currentTenant: I,
+              onLogOutClick: H
+            }
+          ) }),
+          style: {
+            width: u === "small" ? "auto" : "100%",
+            padding: i.sp0,
+            rowGap: i.sp1
+          },
+          helperContainerStyle: {
+            width: "100%",
+            rowGap: i.sp1,
+            marginTop: "12px",
+            marginBottom: i.sp2
+          },
+          primaryBtn: {
+            onClick: Se,
+            label: K.submit,
+            isLoading: p.fetchState === "In-Progress",
+            isDisabled: p.fetchState === "In-Progress" || !(ye() && se())
+          },
+          containerStyle: {
+            width: "auto",
+            justifyContent: "center"
+          },
+          helperText: K.submitText.replace("__action__", K.submit),
+          helperStyle: {
+            width: "auto",
+            padding: i.sp0,
+            rowGap: i.sp0,
+            textAlign: "center"
+          }
+        }
+      )
+    ] }),
+    /* @__PURE__ */ o.jsx(
+      _e,
+      {
+        handleConfirmCardSetupIntent: V,
+        updateCardPaymentModalState: P,
+        handleCreateCardSetupIntent: T,
+        handleAddCardPaymentSource: F,
+        cardPaymentView: y,
+        stripeKey: j,
+        isCardPaymentOpen: le.isCardPaymentPopupOpen,
+        handleResetCardPaymentErrorStatuses: D,
+        cardSetupInProgress: ne,
+        setCardSetupInProgress: he
+      }
+    )
+  ] });
+}, We = d.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  min-width: 100% ${(e) => e.theme.breakpoints.down("md")} {
+    width: 100%;
+    padding-left: ${i.sp0};
+  }
+`, Ge = d.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  flex: 1;
+  width: 100%;
+  height: 100%;
+  background-image: ${(e) => `url(https://storage.googleapis.com/zeni-apis.appspot.com/images/signin-background-${e.windowSize === "small" ? "m" : "w"}-${e.theme.mode === "dark" ? "d" : "l"}.svg)`};
+  background-color: ${(e) => e.theme.colors.grey4};
+  background-size: inherit;
+  background-attachment: fixed;
+  background-position: ${(e) => e.windowSize === "small" ? "center center" : "right center"};
+  background-repeat: no-repeat;
+
+  ${(e) => e.theme.breakpoints.down("lg")} {
+    background-size: cover;
+  }
+`, He = d.div`
+  display: flex;
+  height: 100%;
+  flex-direction: column;
+  padding-bottom: ${i.sp0};
+`, Me = d.form`
+  padding-top: ${i.sp0};
+  flex: 1;
+`, Ze = d.div`
+  display: flex;
+  height: ${i.sp7};
+  left: ${i.sp4};
+  bottom: ${i.sp3};
+  position: fixed;
+  justify-content: center;
+  align-items: center;
+  cursor: default;
+`, Ke = d.div`
+  display: flex;
+`, qe = d(Te)`
+  height: ${i.sp4};
+  width: 102px;
+  color: ${(e) => e.theme.colors.primary};
+  cursor: pointer;
+  flex-shrink: 0;
+  margin-left: -${i.sp4};
+`, Je = d(Ve)`
+  color: ${(e) => e.theme.colors.hero};
+  display: flex;
+  justify-content: center;
+  width: ${(e) => J.titleWidth.valuePx(e.windowSize)};
+  padding-top: ${(e) => J.subTitlePaddingTop.valuePx(e.windowSize)};
+  padding-bottom: ${(e) => J.subTitlePaddingBottom.valuePx(e.windowSize)};
+  text-align: ${(e) => e.windowSize === "small" ? "initial" : "center"};
+  width: 100%;
+`, $ = (e) => ({
+  [Q]: {
+    account: {
+      allOptions: [],
+      selectedOption: void 0
+    }
+  },
+  [s]: Ie(
+    s,
+    e?.subscriptionBillingAddress
+  )[s]
+}), it = (e) => {
+  const {
+    onboardingCustomerView: b,
+    cardPaymentView: y,
+    signedInUser: j,
+    currentTenant: B,
+    isOnAddressPage: x,
+    stripeKey: I,
+    googleAPIKey: L,
+    meetingUrl: T,
+    onUpdateStep: V,
+    onZeniLogoClick: P,
+    handleLogOutClick: F,
+    handleCockpitClick: z,
+    handleCreateCardSetupIntent: D,
+    handleConfirmCardSetupIntent: k,
+    handleFetchPaymentSources: _,
+    updateCardPaymentModalState: E,
+    resetCardPaymentViewState: u,
+    handleResetCardPaymentErrorStatuses: N,
+    redirectToProductSuitePage: h,
+    ...U
+  } = e, { allSteps: R, currentStep: W, fetchStatus: C } = b, G = ae(), { analytics: H } = G, M = {
+    allSteps: R,
+    isOnAddressPage: x,
+    currentStep: W,
+    fetchStatus: C,
+    signedInUser: j,
+    currentTenant: B,
+    onUpdateStep: (Z) => {
+      V(Z);
+    },
+    onZeniLogoClick: P,
+    handleLogOutClick: F,
+    handleCockpitClick: z,
+    redirectToProductSuitePage: h
+  }, w = C.fetchState === "In-Progress" || C.fetchState === "Not-Started";
+  return /* @__PURE__ */ o.jsxs(Qe, { isOnAddressPage: x, children: [
+    w ? /* @__PURE__ */ o.jsx(Ee, { isNoStepsPage: !0 }) : /* @__PURE__ */ o.jsx(
+      Re,
+      {
+        ...M,
+        onboardingCustomerView: b,
+        handleCreateCardSetupIntent: D,
+        handleConfirmCardSetupIntent: k,
+        updateCardPaymentModalState: E,
+        handleFetchPaymentSources: _,
+        cardPaymentView: y,
+        resetCardPaymentViewState: u,
+        stripeKey: I,
+        googleAPIKey: L,
+        handleResetCardPaymentErrorStatuses: N,
+        redirectToProductSuitePage: h,
+        ...U
+      }
+    ),
+    w ? null : /* @__PURE__ */ o.jsx(
+      Fe,
+      {
+        isFooterRendered: !0,
+        meetingUrl: T,
+        analytics: H,
+        productType: "onboarding"
+      }
+    )
+  ] });
+}, Qe = d.div`
+  display: flex;
+  flex-direction: column;
+  width: ${(e) => e.isOnAddressPage ? "fit-content" : "100%"};
+  height: 100vh;
+`;
+export {
+  it as default
+};

package/dist/CustomerOnboardingNoStepsPage-CYQEco1C.cjs

@@ -0,0 +1,66 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("./vendor-.pnpm-D0ILHvHB.cjs"),d=require("@emotion/styled"),e=require("./index-B3k6KNNf.cjs"),v=require("react"),ne=require("./PaymentAccountSetupBillingAddressSection-C4gaQJkp.cjs"),ye=require("./CustomerOnboardingDetailPageSkeleton-B_ZVeN8o.cjs"),K="onboardingPaymentAccountSetupSection",se="customerOnboardingNoStepsDetailPage",o="onboardingSubscriptionBillingAddress",Z={titleWidth:new e.ResponsiveSized(343,580,726,826),subTitlePaddingTop:new e.ResponsiveSized(e.sp[3],e.sp[3]),subTitlePaddingBottom:new e.ResponsiveSized(e.sp[3],e.sp[3]),termsPaddingLeftRight:new e.ResponsiveSized(e.sp[0],e.sp[3])},xe=t=>`${t}_form`,he=e.appLocale.getLocalizedStrings(),Ce=({onboardingCustomerView:t,connectedAccountProvider:h,cardPaymentView:f,stripeKey:O,googleAPIKey:$,signedInUser:C,currentTenant:E,onUpdateStep:B,handleCreateCardSetupIntent:R,handleConfirmCardSetupIntent:I,updateCardPaymentModalState:b,handleAddCardPaymentSource:L,resetCardPaymentViewState:T,handleResetCardPaymentErrorStatuses:z,redirectToProductSuitePage:P,onUpdateCustomerView:V,...F})=>{const u=e.useWindowSizeContext(),_=e.useToolkitContext(),{analytics:y}=_,{onFetchLinkTokenClick:D,onUpdatePaymentAccountStatus:N,onUpdatePaymentAccountLoginStatus:q,onEstablishConnectionClick:x,onEstablishConnectionSuccess:U,handleLogOutClick:W,onZeniLogoClick:M,onAddressEditHandler:k}=F,G=n.useTheme(),a=n.useForm({mode:"onSubmit",reValidateMode:"onSubmit",defaultValues:w(t),values:w(t),shouldFocusError:!0,resetOptions:{keepDirtyValues:!0}}),{companyOfficerLocalData:oe,saveStatus:p,paymentAccount:j,paymentAccountStatus:ie,plaidConnectionDetails:J,uiState:re,allNationalityCountries:Q,subscriptionBillingAddress:g}=t,{customerOnboardingPage:ae,common:m}=he,{footer:ce,steps:le}=ae,{buttons:H}=ce,X=le.link_payment_account,A=e.usePrevious(p.fetchState),Y=Object.values(oe).findIndex(s=>s?.isSelectedForVerification===!0)??0,de=`Officer_${Y<0?1:Y+1}`,ue=async(s,i)=>{if(s.includes(o)&&i[o]!=null){const r=a.getValues(`${o}`).country;let c=i[o];if(s.includes(`${o}.street`)&&i[o].street!=null){const{addressValue:l}=i[o].street,S=e.getCountryOptions(l?.country);c={street:i[o].street??m.strings.empty,city:l?.locality??m.strings.empty,state:l?.administrativeAreaLevel1??m.strings.empty,country:S,countryCode:l?.countryCode??m.strings.empty,postalCode:l?.postalCode??m.strings.empty,secondaryInfo:i[o].secondaryInfo,suite:i[o].suite},r.selectedOption!==S.selectedOption&&(c={...c,country:S})}else s===`${o}.country`&&r.selectedOption!=null?c={...c,countryCode:e.getAlpha2(r.selectedOption)}:r.selectedOption!=null&&s.includes(`${o}.street`)===!1&&(c={...c,countryCode:e.getAlpha2(r.selectedOption)});k(c)}};v.useEffect(()=>{const s=a.watch((i,{name:r})=>{r!=null&&i!=null&&n.defer(()=>ue(r,i))});return()=>{s.unsubscribe()}}),v.useEffect(()=>{A==="In-Progress"&&p.fetchState==="Completed"&&a.reset(w(t),{keepDirtyValues:!1})},[a,t,A,p.fetchState,Q]);const pe=()=>{const s=a.getValues(o),i={street:s.street.addressString,suite:s.suite,city:s.city,state:s.state,postalCode:s.postalCode,country:s.country.selectedOption??m.strings.empty,secondaryInfo:s.secondaryInfo};y.trackOnboardingBillingAddressSave(i)},ee=()=>{const s=Object.values(J).some(S=>S.fetchStatus.fetchState==="Completed"),i=j?.providerVerificationStatus?.code?.includes("verified")??!1,r=f.cardsList.length>0,l=f.bankAccountsList[0]?.providerVerificationStatus?.code?.includes("verified")??!1;return s&&i||!i&&!j&&r||!r&&!j&&l};function ge(){if(a.getFieldState(o).error)return!1;const i=a.getValues(o),r=g?.street.join("").trim(),c=g?.city,l=g?.state,S=g?.country,fe=g?.postalCode!=null&&g.postalCode||i.postalCode||m.strings.empty;return!!r&&!!c&&!!l&&!!S&&!!fe}const me=async()=>{const s=await a.trigger(o),i=await a.trigger(K);s&&i&&(pe(),B("link_payment_account"),V(de,!1,!0))};v.useEffect(()=>{A==="In-Progress"&&p.fetchState==="Completed"&&(a.reset(w(t),{keepDirtyValues:!1}),P())},[a,t,A,p.fetchState,Q,P]);const[te,Se]=v.useState(!1);return n.jsxRuntimeExports.jsxs(be,{children:[n.jsxRuntimeExports.jsxs(Pe,{windowSize:u,children:[n.jsxRuntimeExports.jsx(e.NavBar,{title:X.sectionTitle,showBackButton:!1,backgroundColor:G.colors.grey4,style:{zIndex:4},source:"CustomerOnboardingPaymentAddressDetailPage",showLeftSection:u!=="small",titleStyle:{display:"flex",alignItems:"center"},navBarContainerStyles:{paddingTop:e.Space.sp0,paddingBottom:e.Space.sp0},leftSideComponent:n.jsxRuntimeExports.jsx(ve,{children:n.jsxRuntimeExports.jsx(we,{"data-testid":e.generateDataTestId("zeni-logo-customer-onboarding-payment-address-detail-page"),onClick:M})})}),n.jsxRuntimeExports.jsx(n.FormProvider,{...a,children:n.jsxRuntimeExports.jsx(je,{id:xe(se),children:n.jsxRuntimeExports.jsxs(ke,{children:[n.jsxRuntimeExports.jsx(Oe,{windowSize:u,children:X.sectionSubTitle}),n.jsxRuntimeExports.jsx(ne.PaymentAccountSetupBillingAddressSection,{connectedAccountProvider:h,paymentAccount:j,accountStatus:ie,plaidConnectionDetails:J,subscriptionBillingAddressSectionId:o,sectionId:K,analytics:y,isValid:ee(),onFetchLinkTokenClick:D,onEstablishConnectionClick:x,onUpdatePaymentAccountStatus:N,onUpdatePaymentAccountLoginStatus:q,onEstablishConnectionSuccess:U,updateCardPaymentModalState:b,cardPaymentView:f,resetCardPaymentViewState:T,cardSetupInProgress:te,googleAPIKey:$,subscriptionBillingAddress:g})]},"link_payment_account")})}),n.jsxRuntimeExports.jsx(e.Footer,{formId:`${se}`,leftSideComponent:n.jsxRuntimeExports.jsx(Ae,{windowSize:u,children:n.jsxRuntimeExports.jsx(e.LogoutButton,{signedInUser:C,currentTenant:E,onLogOutClick:W})}),style:{width:u==="small"?"auto":"100%",padding:e.Space.sp0,rowGap:e.Space.sp1},helperContainerStyle:{width:"100%",rowGap:e.Space.sp1,marginTop:"12px",marginBottom:e.Space.sp2},primaryBtn:{onClick:me,label:H.submit,isLoading:p.fetchState==="In-Progress",isDisabled:p.fetchState==="In-Progress"||!(ge()&&ee())},containerStyle:{width:"auto",justifyContent:"center"},helperText:H.submitText.replace("__action__",H.submit),helperStyle:{width:"auto",padding:e.Space.sp0,rowGap:e.Space.sp0,textAlign:"center"}})]}),n.jsxRuntimeExports.jsx(ne.CardPaymentModal,{handleConfirmCardSetupIntent:I,updateCardPaymentModalState:b,handleCreateCardSetupIntent:R,handleAddCardPaymentSource:L,cardPaymentView:f,stripeKey:O,isCardPaymentOpen:re.isCardPaymentPopupOpen,handleResetCardPaymentErrorStatuses:z,cardSetupInProgress:te,setCardSetupInProgress:Se})]})},be=d.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  min-width: 100% ${t=>t.theme.breakpoints.down("md")} {
+    width: 100%;
+    padding-left: ${e.Space.sp0};
+  }
+`,Pe=d.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  flex: 1;
+  width: 100%;
+  height: 100%;
+  background-image: ${t=>`url(https://storage.googleapis.com/zeni-apis.appspot.com/images/signin-background-${t.windowSize==="small"?"m":"w"}-${t.theme.mode==="dark"?"d":"l"}.svg)`};
+  background-color: ${t=>t.theme.colors.grey4};
+  background-size: inherit;
+  background-attachment: fixed;
+  background-position: ${t=>t.windowSize==="small"?"center center":"right center"};
+  background-repeat: no-repeat;
+
+  ${t=>t.theme.breakpoints.down("lg")} {
+    background-size: cover;
+  }
+`,ke=d.div`
+  display: flex;
+  height: 100%;
+  flex-direction: column;
+  padding-bottom: ${e.Space.sp0};
+`,je=d.form`
+  padding-top: ${e.Space.sp0};
+  flex: 1;
+`,Ae=d.div`
+  display: flex;
+  height: ${e.Space.sp7};
+  left: ${e.Space.sp4};
+  bottom: ${e.Space.sp3};
+  position: fixed;
+  justify-content: center;
+  align-items: center;
+  cursor: default;
+`,ve=d.div`
+  display: flex;
+`,we=d(e.SvgZeniLogoFull)`
+  height: ${e.Space.sp4};
+  width: 102px;
+  color: ${t=>t.theme.colors.primary};
+  cursor: pointer;
+  flex-shrink: 0;
+  margin-left: -${e.Space.sp4};
+`,Oe=d(e.StandardRegular)`
+  color: ${t=>t.theme.colors.hero};
+  display: flex;
+  justify-content: center;
+  width: ${t=>Z.titleWidth.valuePx(t.windowSize)};
+  padding-top: ${t=>Z.subTitlePaddingTop.valuePx(t.windowSize)};
+  padding-bottom: ${t=>Z.subTitlePaddingBottom.valuePx(t.windowSize)};
+  text-align: ${t=>t.windowSize==="small"?"initial":"center"};
+  width: 100%;
+`,w=t=>({[K]:{account:{allOptions:[],selectedOption:void 0}},[o]:e.getAddressDefaultValues(o,t?.subscriptionBillingAddress)[o]}),$e=t=>{const{onboardingCustomerView:h,cardPaymentView:f,signedInUser:O,currentTenant:$,isOnAddressPage:C,stripeKey:E,googleAPIKey:B,meetingUrl:R,onUpdateStep:I,onZeniLogoClick:b,handleLogOutClick:L,handleCockpitClick:T,handleCreateCardSetupIntent:z,handleConfirmCardSetupIntent:P,handleFetchPaymentSources:V,updateCardPaymentModalState:F,resetCardPaymentViewState:u,handleResetCardPaymentErrorStatuses:_,redirectToProductSuitePage:y,...D}=t,{allSteps:N,currentStep:q,fetchStatus:x}=h,U=e.useToolkitContext(),{analytics:W}=U,M={allSteps:N,isOnAddressPage:C,currentStep:q,fetchStatus:x,signedInUser:O,currentTenant:$,onUpdateStep:G=>{I(G)},onZeniLogoClick:b,handleLogOutClick:L,handleCockpitClick:T,redirectToProductSuitePage:y},k=x.fetchState==="In-Progress"||x.fetchState==="Not-Started";return n.jsxRuntimeExports.jsxs(Ee,{isOnAddressPage:C,children:[k?n.jsxRuntimeExports.jsx(ye.CustomerOnboardingDetailPageSkeleton,{isNoStepsPage:!0}):n.jsxRuntimeExports.jsx(Ce,{...M,onboardingCustomerView:h,handleCreateCardSetupIntent:z,handleConfirmCardSetupIntent:P,updateCardPaymentModalState:F,handleFetchPaymentSources:V,cardPaymentView:f,resetCardPaymentViewState:u,stripeKey:E,googleAPIKey:B,handleResetCardPaymentErrorStatuses:_,redirectToProductSuitePage:y,...D}),k?null:n.jsxRuntimeExports.jsx(e.HelpButton,{isFooterRendered:!0,meetingUrl:R,analytics:W,productType:"onboarding"})]})},Ee=d.div`
+  display: flex;
+  flex-direction: column;
+  width: ${t=>t.isOnAddressPage?"fit-content":"100%"};
+  height: 100vh;
+`;exports.default=$e;

package/dist/CustomerOnboardingPage-CBzlVI5A.cjs

@@ -0,0 +1,107 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./vendor-.pnpm-D0ILHvHB.cjs"),m=require("react"),O=require("@emotion/styled"),s=require("./index-B3k6KNNf.cjs"),pt=require("@emotion/react"),lt=require("@zeniai/client-analytics"),V=require("@zeniai/client-epic-state"),Ue=require("./PaymentAccountSetupBillingAddressSection-C4gaQJkp.cjs"),fe=require("./CustomerOnboardingDetailPageSkeleton-B_ZVeN8o.cjs"),ut=require("./CompanyOfficerDetailsSection-B_aQqm_1.cjs"),qt=require("./QBOSetupSection-_9T9xy-o.cjs"),Ut=({companyView:n,companyOfficerLocalData:D,allNationalityCountries:c,isVerificationPopupOpen:h,setIsVerificationPopupOpen:P,verifiedPhoneNumber:I,onPhoneVerified:x,...A})=>{const S=s.useWindowSizeContext(),l=n?.companyOfficers.slice(0,10).sort((z,ce)=>z.user.createTime?.isAfter(ce.user.createTime)===!0?1:-1)?.map(z=>z.user),{company_officer:_}=s.appLocale.getLocalizedStrings().customerOnboardingPage.sections,{title:w}=_,k=n?.company.company.featuresActivationInfo.connectedAccountProvider;return o.jsxRuntimeExports.jsx(Wt,{children:o.jsxRuntimeExports.jsx(ut.CompanyOfficerDetailsSection,{companyOfficerData:D,allOfficers:l??[],allNationalityCountries:c,sectionHeader:w,isPopupOpen:h,productType:"onboarding",connectedAccountProvider:k,showInfoTooltip:S!=="small",showCompletedIcon:S==="small",showOfficerSelect:!1,showVerificationTag:!1,verifiedPhoneNumber:I,onPhoneVerified:x,optionalFields:["dob","officerAddress","role","ssn","ownership","selectDocument","phone"],openPopup:P,...A})})},Wt=O.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+`,Ht=({fileProps:n,companyDetails:D,companyIndustries:c,sectionId:h,isCompleted:P,isDisabled:I,style:x,onCompanyAddressClick:A,onRegisteredAddressClick:S})=>{const T=s.useWindowSizeContext(),{company_details:l}=s.appLocale.getLocalizedStrings().customerOnboardingPage.sections,{title:_}=l;return o.jsxRuntimeExports.jsx(Qt,{children:o.jsxRuntimeExports.jsx(ut.CompanyDetailsSection,{fileProps:n,companyDetails:D,sectionId:h,isDisabled:I,style:x,sectionHeader:_,productType:"onboarding",showInfoTooltip:T!=="small",showCompletedIcon:T==="small",isCompleted:P,allIndustries:c,optionalFields:["companyLegalName","companyDescription","companyAddress","companyIndustry","typeOfIncorporation","incDate","certificateOfIncorporation","ein","companyPhone","primaryContactName"],onCompanyAddressClick:A,onRegisteredAddressClick:S})})},Qt=O.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+`,Mt=O.div`
+  display: flex;
+`,Yt=O.input`
+  display: none;
+`,Gt=({isValid:n,sectionId:D="onboardingQboConnection",...c})=>{const{register:h}=o.useFormContext();return o.jsxRuntimeExports.jsxs(Mt,{children:[o.jsxRuntimeExports.jsx(Yt,{type:"hidden",...h(`${D}.connected`,{validate:P=>P==="true"}),value:n?"true":"false"}),o.jsxRuntimeExports.jsx(qt.QBOSetupSection,{isValid:n,...c})]})},L="companyDetails",b="companyOfficer",ee="onboardingPaymentAccountSetupSection",dt="customerOnboardingDetailPage",y="onboardingSubscriptionBillingAddress",me="onboardingQboConnection",ye={titleWidth:new s.ResponsiveSized(343,580,726,826),topNavBarHeight:new s.ResponsiveSized(52,52,63),topNavBarLeftRightSpace:new s.ResponsiveSized(s.sp[5],s.sp[9],112),topNavBarHeaderLeftRightPadding:new s.ResponsiveSized(s.sp[4],s.sp[0]),navBarTitleMarginLeft:new s.ResponsiveSized(s.sp[3],s.sp[4]),subTitlePaddingTop:new s.ResponsiveSized(s.sp[3],s.sp[3]),subTitlePaddingBottom:new s.ResponsiveSized(s.sp[3],s.sp[3]),termsPaddingLeftRight:new s.ResponsiveSized(s.sp[0],s.sp[3])},Kt=n=>`${n}_form`,re=s.appLocale.getLocalizedStrings(),Zt=({fileProps:n,isRefreshingViewInBackground:D,isAdmin:c,onboardingCustomerView:h,companyTitles:P,connectedAccountProvider:I,analytics:x,cardPaymentView:A,stripeKey:S,googleAPIKey:T,handleCreateCardSetupIntent:l,handleConfirmCardSetupIntent:_,updateCardPaymentModalState:w,handleAddCardPaymentSource:k,resetCardPaymentViewState:z,handleResetCardPaymentErrorStatuses:ce,redirectToProductSuitePage:ge,onFormErrorsChange:R,...ve})=>{const q=s.useWindowSizeContext(),De=m.useRef(null),Pe=m.useRef(null),K=m.useRef(null),ke=m.useRef(null),[Se,U]=m.useState(!1),[W,H]=m.useState("next"),[j,he]=m.useState(!1),[le,xe]=m.useState(!1),[te,Z]=m.useState(null),{onAddressClick:ne,onCompanyDetailsChanged:Ce,onCompanyOfficerUpdated:E,onFetchLinkTokenClick:be,onUpdatePaymentAccountStatus:de,onUpdatePaymentAccountLoginStatus:se,onEstablishConnectionClick:pe,onEstablishConnectionSuccess:oe,onDeleteFile:N,onEditFileName:He,updateFilesEntity:Qe,onGetOtp:mt,onSkipSetupClick:Ne,onUpdateCustomerView:_e,updateStepHandler:Q,onVerifyOtp:ft,onResendOtp:yt,handleOnConnectClick:gt,updateQBOPopupState:St,onUpdateStep:Ee,onAddressEditHandler:ht}=ve,xt=o.useTheme(),r=o.useForm({mode:"onSubmit",reValidateMode:"onChange",defaultValues:We(h,h.allNationalityCountries),values:We(h,h.allNationalityCountries),shouldFocusError:!0,resetOptions:{keepDirtyValues:!0}}),M=m.useCallback(()=>{const e=[];return(r.getFieldState(ee).error!=null||r.getFieldState(y).error!=null)&&e.push("link_payment_account"),r.getFieldState(me).error!=null&&e.push("qbo_connection"),e},[r]);m.useEffect(()=>{const e=M();R?.(e)},[M,R]),m.useEffect(()=>{const e=r.watch((t,{name:i,type:d})=>{i!=null&&(d==="change"||d==="blur")&&o.defer(()=>{const g=M();R?.(g)})});return()=>e.unsubscribe()},[r,M,R]);const Me=e=>{Ke(e)},{companyView:ie,companyDetailsLocalData:p,companyOfficerLocalData:F,currentStep:a,completedSteps:Ye,saveStatus:v,allSteps:C,allRequiredStepsCompleted:Te,paymentAccount:Y,paymentAccountStatus:Ge,externalConnections:Re,plaidConnectionDetails:Be,uiState:we,allNationalityCountries:je,pendingSaveDetails:{companyDetails:Ct,officer:bt},subscriptionBillingAddress:J}=h,Oe=m.useRef(""),Ot=e=>{Oe.current=e;const t=Object.values(h.companyOfficerLocalData).findIndex(d=>d?.isSelectedForVerification===!0)??0,i=t<0?0:t;r.clearErrors(`${b}.${i}.phone`)},Ke=e=>{e!=null&&!o.isValidPhoneNumber(e)?r.trigger(`${b}.${X}.phone`):mt(e)},X=Object.values(F).findIndex(e=>e?.isSelectedForVerification===!0)??0,B=`Officer_${X<0?1:X+1}`,It=ie?.companyOfficers.slice(0,10).sort((e,t)=>e.user.createTime?.isAfter(t.user.createTime)===!0?1:-1),Fe=F[B]?.userId!=null?It?.find(e=>e.user.userId===F[B]?.userId)?.address:null,Ze=F[B]?.addressStatus?.addressToCreate,Ie=ie?.companyAddress,Je=p?.addressStatus?.addressToCreate,$e=ie?.registeredAddress,Xe=p?.registeredAddressStatus?.addressToCreate,{customerOnboardingPage:At,common:u}=re,{footer:vt,steps:Dt}=At,{buttons:et}=vt,tt=Dt[a],Ve=C.length,ae=s.usePrevious(v.fetchState),$=s.usePrevious(a);function Pt(){return Re?.accounting[0]?.isValid??!1}const ue=()=>{const e=Object.values(Be).some(f=>f.fetchStatus.fetchState==="Completed"),t=Y?.providerVerificationStatus?.code?.includes("verified")??!1,i=A.cardsList.length>0,g=A.bankAccountsList[0]?.providerVerificationStatus?.code?.includes("verified")??!1;return e&&t||!t&&!Y&&i||!i&&!Y&&g};function nt(){if(r.getFieldState(y).error)return!1;const t=r.getValues(y),i=J?.street.join("").trim(),d=J?.city,g=J?.state,f=J?.country,qe=J?.postalCode!=null&&J.postalCode||t.postalCode||u.strings.empty;return!!i&&!!d&&!!g&&!!f&&!!qe}const st=s.usePrevious(Y?.providerVerificationStatus?.code),kt=()=>{const e=p,t=[];return e?.companyLegalName!=null&&t.push("legal_name"),e?.companyDescription!=null&&e?.companyDescription!==u.strings.empty&&t.push("company_description"),e?.addressStatus?.addressToCreate!=null&&t.push("company_address"),e?.registeredAddressStatus?.addressToCreate!=null&&t.push("registered_address"),e?.website!=null&&t.push("website"),e?.companyIndustry!=null&&e?.companyIndustry!==u.strings.empty&&t.push("industry"),e?.typeOfIncorporation!=null&&e?.typeOfIncorporation!==u.strings.empty&&t.push("type_of_incorporation"),e?.incDate!=null&&t.push("inc_date"),e?.phone!=null&&t.push("phone"),e?.primaryContactLocalData?.firstName!=null&&e?.primaryContactLocalData?.lastName!=null&&t.push("primary_contact_name"),e?.primaryContactLocalData?.email!=null&&t.push("primary_contact_email"),e?.taxIdOrEIN!=null&&t.push("tax_id_or_ein"),e?.companyFiles.find(i=>i.documentType==="certificate_of_incorporation")!=null&&t.push("certificate_of_incorporation"),e?.companyFiles.find(i=>i.documentType==="tax_ein")!=null&&t.push("ein"),{completedFields:t,status:t.length===14?"complete":t.length>0?"partially_complete":"incomplete"}},Nt=()=>{const e=F[B],t=[];return e?.firstName!=null&&e.firstName!==u.strings.empty&&t.push("first_name"),e?.lastName!=null&&e.lastName!==u.strings.empty&&t.push("last_name"),e?.birthday!=null&&t.push("dob"),e?.nationalityCountryCode!=null&&t.push("nationality"),e?.addressStatus?.addressToCreate!=null&&t.push("address"),e?.phone!=null&&e.phone!==u.strings.empty&&e.isPhoneVerified===!0&&t.push("phone"),e?.titleAtCompany!=null&&e.titleAtCompany!==u.strings.empty&&t.push("company_role"),e?.ownershipInCompany!=null&&t.push("ownership"),e?.ssn!=null&&e.ssn!==u.strings.empty&&t.push("ssn"),e?.documentTypeSelectedForVerification!=null&&t.push("document_type"),e?.fileIds!=null&&e.fileIds.length>0&&t.push("document_uploaded"),{completedFields:t,status:t.length===11?"complete":t.length>0?"partially_complete":"incomplete"}};m.useEffect(()=>{st==="pending_manual_verification"&&Y?.providerVerificationStatus?.code==="manually_verified"&&x.trackOnboardingBankAccountVerified("manual")},[x,Y?.providerVerificationStatus?.code,st]);const _t=async(e,t)=>{if(e.includes(L))Ce?.(t[L]);else if(e.includes(b))E?.(t[b]);else if(e.includes(y)&&t[y]!=null){const i=r.getValues(`${y}`).country;let d=t[y];if(e.includes(`${y}.street`)&&t[y].street!=null){const{addressValue:g}=t[y].street,f=s.getCountryOptions(g?.country);d={street:t[y].street??u.strings.empty,city:g?.locality??u.strings.empty,state:g?.administrativeAreaLevel1??u.strings.empty,country:f,countryCode:g?.countryCode??u.strings.empty,postalCode:g?.postalCode??u.strings.empty,secondaryInfo:t[y].secondaryInfo,suite:t[y].suite},i.selectedOption!==f.selectedOption&&(d={...d,country:f})}else e===`${y}.country`&&i.selectedOption!=null?d={...d,countryCode:s.getAlpha2(i.selectedOption)}:i.selectedOption!=null&&e.includes(`${y}.street`)===!1&&(d={...d,countryCode:s.getAlpha2(i.selectedOption)});ht(d)}};m.useEffect(()=>{const e=r.watch((t,{name:i})=>{i!=null&&t!=null&&o.defer(()=>_t(i,t))});return()=>{e.unsubscribe()}}),m.useEffect(()=>{ae==="In-Progress"&&v.fetchState==="Completed"&&(r.reset(We(h,je),{keepDirtyValues:!1}),$==="company_details"&&a==="link_payment_account"&&!C.includes("qbo_connection")&&!h.qboConnected&&ge())},[r,h,ae,v.fetchState,je,$,a,C,ge]),m.useEffect(()=>{Se&&ae==="In-Progress"&&v.fetchState==="Completed"&&(Ne(),x.track(lt.Event.onboardingSkipAndSave))},[ae,Se,v.fetchState,Ne]),m.useEffect(()=>{te?.shouldNavigate===!0&&ae==="In-Progress"&&v.fetchState==="Completed"&&(Z(null),Q(te.fromStep,te.stepDirection,!0))},[te,ae,v.fetchState,Q]),m.useLayoutEffect(()=>{$!=null&&$!==a&&(C.indexOf($)===C.indexOf(a)-1||C.indexOf($)===Ve-1&&C.indexOf(a)===0?W!=="next"&&H("next"):(C.indexOf($)-1===C.indexOf(a)||C.indexOf($)===0&&C.indexOf(a)===Ve-1)&&W!=="previous"&&H("previous"))},[C,a,$,W,Ve]);const ot=()=>{const e=F[B];return!!e?.firstName||!!e?.lastName||!!e?.email||!!e?.nationalityCountryCode||!!e?.birthday||!!e?.ownershipInCompany||!!e?.phone||!!e?.ssn||!!e?.titleAtCompany||!!e?.addressStatus?.addressToCreate||e?.fileIds!=null&&e?.fileIds.length>0},Et=!o.isEqual(Ze!=null?V.getFormattedAddress(Ze):null,Fe!=null?V.getFormattedAddress(Fe):null),Tt=!o.isEqual(Je!=null?V.getFormattedAddress(Je):null,Ie!=null?V.getFormattedAddress(Ie):null),Rt=!o.isEqual(Xe!=null?V.getFormattedAddress(Xe):null,$e!=null?V.getFormattedAddress($e):null),Bt=r.getFieldState(L).isDirty||Tt||Rt||Ct,Le=r.getFieldState(b).isDirty&&ot()||Et||bt,it=r.getFieldState(`${y}`).isDirty,Ae=p?.primaryContactLocalData,wt=()=>{Q(a,"previous",!0)},jt=()=>{const e=r.getValues(y),t={street:e.street.addressString,suite:e.suite,city:e.city,state:e.state,postalCode:e.postalCode,country:e.country.selectedOption??u.strings.empty,secondaryInfo:e.secondaryInfo};x.trackOnboardingBillingAddressSave(t)},Ft=()=>{switch(xe(!1),a){case"link_payment_account":it?setTimeout(()=>{const e=M();R?.(e),nt()&&it?(jt(),_e(B,!1,!0),Z({fromStep:a,shouldNavigate:!0,stepDirection:"next"})):Q(a,"next",!0)},200):Q(a,"next",!0);break;case"qbo_connection":Q(a,"next",!0);break;case"company_officer":if(Le){const e=at();if(o.defer(()=>{const t=M();R?.(t)}),e.needsOtp&&e.phoneNumber&&o.isValidPhoneNumber(e.phoneNumber)){const i=r.formState.errors[b]?.[X<0?0:X],d=i?.phone,g=i!=null&&Object.keys(i).some(f=>f!=="phone"&&i[f]!=null);if(d!=null&&!g){Me(e.phoneNumber);return}}e.isValid&&(_e(B,!1,!1),x.trackOnboardingCompanyOfficerSave(rt(),{legalName:p?.companyLegalName},Nt()),Z({fromStep:a,shouldNavigate:!0,stepDirection:"next"}))}else Q(a,"next",!0);break;case"company_details":xe(!0);{const e=!(nt()&&ue()),t=!Pt()&&C.includes("qbo_connection");if(e||t){e&&(r.trigger(`${ee}`),r.trigger(`${y}`)),t&&r.trigger(me),o.defer(()=>{const i=M();R?.(i)}),e?Ee("link_payment_account"):t&&Ee("qbo_connection");return}}if(Bt||Le||!Ae?.email){const e=Vt(),t=Le?at():{isValid:!0};o.defer(()=>{const i=M();R?.(i)}),e&&t.isValid?(Te&&(U(!0),Lt()),_e(B,!Te,!1),x.trackOnboardingCompanyDetailsSave({companyDescription:p?.companyDescription,legalName:p?.companyLegalName,industry:p?.companyIndustry??u.strings.empty,incDate:p?.incDate?.toString(),phone:p?.phone,website:p?.website?.toString(),formattedAddress:p?.addressStatus?.addressToCreate!=null?V.getFormattedAddress(p?.addressStatus?.addressToCreate):void 0},kt(),{firstName:Ae?.firstName,lastName:Ae?.lastName,email:Ae?.email}),Z({fromStep:a,shouldNavigate:!0,stepDirection:"next"})):t.isValid||Ee("company_officer")}else Te?$t():Q(a,"next",!0);break}},$t=()=>{v.fetchState!=="In-Progress"&&(Ne(),x.track(lt.Event.onboardingSkipAndSave))},at=()=>{const e=F[B],t=e?.email??u.strings.empty,i=e?.phone??u.strings.empty,d=e?.ssn??u.strings.empty,g=e?.ownershipInCompany,f=X<0?0:X,qe=!!e?.firstName&&!!e?.lastName;let G=!0,ct=!1;return t&&!qe&&(r.trigger([`${b}.${f}.name.firstName`,`${b}.${f}.name.lastName`],{shouldFocus:a==="company_officer"}),G=!1),(!t&&ot()||s.EMAIL_PATTERN.test(t)===!1)&&(r.trigger(`${b}.${f}.email`,{shouldFocus:a==="company_officer"}),G=!1),i&&o.isValidPhoneNumber(i)===!1&&(r.trigger(`${b}.${f}.phone`,{shouldFocus:a==="company_officer"}),G=!1),i&&o.isValidPhoneNumber(i)===!0&&I==="unit"&&(Oe.current!==""&&i===Oe.current||(ct=!0,r.setError(`${b}.${f}.phone`,{type:"custom",message:re.commonSetUp.businessVerification.phoneValidationError},{shouldFocus:a==="company_officer"}),G=!1)),g!=null&&g>100&&(r.trigger(`${b}.${f}.ownership`,{shouldFocus:a==="company_officer"}),G=!1),d&&s.SSN_PATTERN.test(d)===!1&&(r.trigger(`${b}.${f}.ssn`,{shouldFocus:a==="company_officer"}),G=!1),{isValid:G,needsOtp:ct,phoneNumber:i}},Vt=()=>{const e=p?.website?.toString()??u.strings.empty,t=p?.phone??u.strings.empty,i=p?.taxIdOrEIN??u.strings.empty,g=p?.primaryContactLocalData?.email??u.strings.empty;let f=!0;return e&&s.URL_PATTERN.test(e)===!1&&(r.trigger(`${L}.companyWebsite`,{shouldFocus:a==="company_details"}),f=!1),s.URL_PATTERN.lastIndex=0,t&&o.isValidPhoneNumber(t)===!1&&(r.trigger(`${L}.companyPhone`,{shouldFocus:a==="company_details"}),f=!1),(!g||s.EMAIL_PATTERN.test(g)===!1)&&(r.trigger(`${L}.primaryContactEmail`,{shouldFocus:a==="company_details"}),f=!1),i&&s.TIN_PATTERN.test(i)===!1&&(r.trigger(`${L}.companyTaxId`,{shouldFocus:a==="company_details"}),f=!1),f},rt=()=>{const e=F[B];return{email:e?.email??u.strings.empty,birthday:e?.birthday?.toString(),companyOwnership:e?.ownershipInCompany,firstName:e?.firstName,lastName:e?.lastName,companyRole:e?.titleAtCompany,phone:e?.phone,formattedAddress:e?.addressStatus?.addressToCreate!=null?V.getFormattedAddress(e?.addressStatus?.addressToCreate):void 0,documentTypeForVerification:e?.documentTypeSelectedForVerification}},Lt=()=>{const e=p?.primaryContactLocalData;x.trackBusinessVerificationSave(rt(),{companyDescription:p?.companyDescription,legalName:p?.companyLegalName,phone:p?.phone,website:p?.website?.toString(),industry:p?.companyIndustry??u.strings.empty,formattedAddress:p?.addressStatus?.addressToCreate!=null?V.getFormattedAddress(p?.addressStatus?.addressToCreate):void 0},{firstName:e?.firstName,lastName:e?.lastName,email:e?.email},"onboarding")},[ze,zt]=m.useState(!1);return o.jsxRuntimeExports.jsxs(en,{children:[o.jsxRuntimeExports.jsxs(tn,{windowSize:q,children:[C.indexOf(a)>=0?o.jsxRuntimeExports.jsx(s.NavBar,{title:tt.sectionTitle,showBackButton:!1,backgroundColor:xt.colors.grey4,style:{zIndex:4},showLeftSection:q!=="small",titleStyle:{display:"flex",alignItems:"center"},navBarContainerStyles:{paddingTop:s.Space.sp0,paddingBottom:s.Space.sp0},source:"CustomerOnboardingDetailPage"}):o.jsxRuntimeExports.jsx(nn,{windowSize:q,children:o.jsxRuntimeExports.jsx(on,{windowSize:q,children:o.jsxRuntimeExports.jsx(sn,{})})}),o.jsxRuntimeExports.jsx(o.FormProvider,{...r,children:o.jsxRuntimeExports.jsx(rn,{id:Kt(dt),children:C.map(e=>{let t;t=o.jsxRuntimeExports.jsx(Ue.PaymentAccountSetupBillingAddressSection,{connectedAccountProvider:I,paymentAccount:Y,accountStatus:Ge,plaidConnectionDetails:Be,sectionId:ee,hasError:r.getFieldState(ee).error!=null||le&&!ue(),isValid:ue(),analytics:x,onFetchLinkTokenClick:be,onEstablishConnectionClick:pe,onUpdatePaymentAccountStatus:de,onUpdatePaymentAccountLoginStatus:se,onEstablishConnectionSuccess:oe,cardPaymentView:A,resetCardPaymentViewState:z,updateCardPaymentModalState:w,cardSetupInProgress:ze,subscriptionBillingAddressSectionId:y});let i=De;switch(e){case"link_payment_account":t=o.jsxRuntimeExports.jsx(Ue.PaymentAccountSetupBillingAddressSection,{connectedAccountProvider:I,paymentAccount:Y,accountStatus:Ge,plaidConnectionDetails:Be,subscriptionBillingAddressSectionId:y,sectionId:ee,hasError:r.getFieldState(ee).error!=null||le&&!ue(),isValid:ue(),analytics:x,onFetchLinkTokenClick:be,onEstablishConnectionClick:pe,onUpdatePaymentAccountStatus:de,onUpdatePaymentAccountLoginStatus:se,onEstablishConnectionSuccess:oe,updateCardPaymentModalState:w,cardPaymentView:A,resetCardPaymentViewState:z,cardSetupInProgress:ze,googleAPIKey:T,subscriptionBillingAddress:J});break;case"qbo_connection":t=o.jsxRuntimeExports.jsx(Gt,{sectionId:me,hasError:r.getFieldState(me).error!=null,isAdmin:c,isValid:Re?.accounting[0]?.isValid??!1,companyName:ie?.company.company.companyInfo.companyLegalName,saveConnectionState:Re?.saveConnectionState,isQBOPopupOpen:we.isQBOPopupOpen,handleOnConnectClick:gt,updateQBOPopupState:St}),i=Pe;break;case"company_officer":t=o.jsxRuntimeExports.jsx(Ut,{companyOfficerLocalData:F,allNationalityCountries:je,isCompleted:Ye.includes("company_officer"),companyView:ie,sectionId:b,filesEndPoint:n.filesEndPoint,authParams:n.authParams,isRefreshingViewInBackground:D,companyTitles:P,isVerificationPopupOpen:j,setIsVerificationPopupOpen:he,onGetOtp:Me,onVerifyOtp:ft,onResendOtp:yt,onOfficerAddressClick:d=>ne(d,Fe?.addressId),updateFilesEntity:Qe,onEditFileName:He,onDeleteFile:N,verifiedPhoneNumber:Oe.current,onPhoneVerified:Ot,isDisabled:v.fetchState==="In-Progress"?"readonly":void 0,triggerError:Ke}),i=ke;break;case"company_details":t=o.jsxRuntimeExports.jsx(Ht,{fileProps:{...n,onEditFileName:He,onDeleteFile:N,updateFilesEntity:Qe},sectionId:L,companyIndustries:h.companyIndustries,companyDetails:p,isDisabled:v.fetchState==="In-Progress"?"readonly":void 0,isCompleted:Ye.includes("company_details"),onCompanyAddressClick:d=>{const g=ie?.company.company.companyOnboardingInfo.subscriptionBillingAddressId;Ie?.addressId==null&&g!=null?ne(d,g):ne(d,Ie?.addressId)},onRegisteredAddressClick:d=>ne(d,$e?.addressId)}),i=K;break}return o.jsxRuntimeExports.jsxs(an,{ref:i,isVisible:a===e,includeAnimation:a==="link_payment_account"||a==="qbo_connection"?!we.isQBOPopupOpen:a==="company_officer"?!j:!0,paddingBottom:e==="company_details"||e==="company_officer"?s.sp[6]:s.sp[0],stepAnimationDirection:W,children:[C.indexOf(a)>=0?o.jsxRuntimeExports.jsx(cn,{windowSize:q,children:tt.sectionSubTitle}):null,t]},e)})})}),o.jsxRuntimeExports.jsx(s.Footer,{formId:`${dt}`,style:{width:q==="small"?"auto":"100%",paddingTop:s.Space.sp2,paddingBottom:s.Space.sp2},primaryBtn:{onClick:Ft,label:a==="company_details"?u.footer.submit:et.next,isLoading:v.fetchState==="In-Progress",isDisabled:v.fetchState==="In-Progress"},cancelBtn:{onClick:wt,label:et.back,isDisabled:v.fetchState==="In-Progress"||C.indexOf(a)===0},containerStyle:{width:"auto",justifyContent:"center"},showCancel:!0})]}),o.jsxRuntimeExports.jsx(Ue.CardPaymentModal,{handleConfirmCardSetupIntent:_,updateCardPaymentModalState:w,handleCreateCardSetupIntent:l,handleAddCardPaymentSource:k,cardPaymentView:A,stripeKey:S,isCardPaymentOpen:we.isCardPaymentPopupOpen,handleResetCardPaymentErrorStatuses:ce,cardSetupInProgress:ze,setCardSetupInProgress:zt})]})},Jt=pt.keyframes`
+  from {
+    transform: translateY(100%);
+    opacity: 0;
+  }
+  to {
+    transform: translateY(0);
+    opacity: 1;
+  }
+`,Xt=pt.keyframes`
+  from {
+    transform: translateY(-100%);
+    opacity: 0;
+  }
+  to {
+    transform: translateY(0);
+    opacity: 1;
+  }
+`,en=O.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  min-width: calc(100% - ${fe.DRAWER_WIDTH}px);
+  padding-left: ${fe.DRAWER_WIDTH}px;
+  flex: 1;
+
+  ${n=>n.theme.breakpoints.down("md")} {
+    width: 100%;
+    padding-left: ${s.Space.sp0};
+  }
+`,tn=O.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  flex: 1;
+  width: 100%;
+  min-height: 100vh;
+  background-image: ${n=>`url(https://storage.googleapis.com/zeni-apis.appspot.com/images/signin-background-${n.windowSize==="small"?"m":"w"}-${n.theme.mode==="dark"?"d":"l"}.svg)`};
+  background-color: ${n=>n.theme.colors.grey4};
+  background-size: inherit;
+  background-attachment: fixed;
+  background-position: ${n=>n.windowSize==="small"?"center center":"right center"};
+  background-repeat: no-repeat;
+
+  ${n=>n.theme.breakpoints.down("lg")} {
+    background-size: cover;
+  }
+`,nn=O.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+  width: ${n=>`calc(100% - ${ye.topNavBarLeftRightSpace.valuePx(n.windowSize)})`};
+`,sn=O.div``,on=O.div`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+  min-height: ${n=>ye.topNavBarHeight.valuePx(n.windowSize)};
+`,an=O.div`
+  min-height: 100%;
+  display: ${n=>n.isVisible?"flex":"none"};
+  flex-direction: column;
+  padding-bottom: ${n=>n.paddingBottom+"px"};
+  animation-name: ${n=>n.stepAnimationDirection==="next"?Jt:Xt};
+  ${n=>n.includeAnimation?`
+          animation-duration: 0.6s; 
+          animation-delay: 0s;  
+          animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); 
+          animation-fill-mode: both;
+        `:null}
+`,rn=O.form`
+  padding-top: ${s.Space.sp0};
+  flex: 1;
+`,cn=O(s.StandardRegular)`
+  color: ${n=>n.theme.colors.hero};
+  display: flex;
+  justify-content: center;
+  width: ${n=>ye.titleWidth.valuePx(n.windowSize)};
+  padding-top: ${n=>ye.subTitlePaddingTop.valuePx(n.windowSize)};
+  padding-bottom: ${n=>ye.subTitlePaddingBottom.valuePx(n.windowSize)};
+  text-align: ${n=>n.windowSize==="small"?"initial":"center"};
+  width: 100%;
+  white-space: pre-line;
+`,We=(n,D)=>{const{companyDetailsLocalData:c,companyOfficerLocalData:h,companyView:P}=n,I=re.commonSetUp.businessVerification,x=re.companyPassport,A=P?.companyOfficers!=null&&P?.companyOfficers.length>0;return{[L]:{companyDescription:c?.companyDescription??re.common.strings.empty,ein:c?.companyFiles.find(S=>S.documentType==="tax_ein"),companyId:c?.companyId,syncToken:c?.syncToken,companyLegalName:c?.companyLegalName,companyWebsite:c?.website?.toString()??re.common.strings.empty,companyAddress:c?.addressStatus?.addressToCreate,registeredAddress:c?.registeredAddressStatus?.addressToCreate,companyIndustry:{selectedOption:c?.companyIndustry,allOptions:n.companyIndustries.map(S=>S.code)},companyPhone:c?.phone,companyTaxId:c?.taxIdOrEIN,primaryContactName:{firstName:c?.primaryContactLocalData?.firstName,lastName:c?.primaryContactLocalData?.lastName},primaryContactEmail:c?.primaryContactLocalData?.email,primaryContactUserId:c?.primaryContactLocalData?.userId,primaryContactSyncToken:c?.primaryContactLocalData?.syncToken,fileIds:c?.companyFiles.map(S=>S.fileId)??[],certificateOfIncorporation:c?.companyFiles.find(S=>S.documentType==="certificate_of_incorporation"),incDate:c?.incDate?.toDate(),typeOfIncorporation:{selectedOption:c?.typeOfIncorporation,allOptions:x.companyIncInfo.allTypesOfIncorporation}},[b]:Object.values(h).map((S,T)=>{const l=S,_=s.toSelectDocumentType(l?.documentTypeSelectedForVerification);return{userId:l?.userId,officerType:l?.officerType??`Officer_${T+1}`,name:{firstName:l?.firstName,lastName:l?.lastName},email:l?.email,fileIds:l?.fileIds??[],dob:l?.birthday?.toDate(),nationalityCountryCode:s.getCountryOptions(l?.nationalityCountryCode,D.map(w=>w.countryCode)),ssn:l?.ssn,role:{selectedOption:l?.titleAtCompany,allOptions:I.allTypesOfRoles},phone:l?.phone,ownership:l?.ownershipInCompany,officerAddress:l?.addressStatus?.addressToCreate,selectDocument:{front:s.getFile(!0,l?.userFiles??[],_),back:s.getFile(!1,l?.userFiles??[],_),selectDocumentType:_},isSelectedForVerification:!A&&T===0?!0:l?.isSelectedForVerification??!1,userVerificationStatus:l?.userVerificationStatus,syncToken:l?.syncToken,isPhoneVerified:l?.isPhoneVerified,otpChallenge:l?.otpChallenge}}),[ee]:{account:{allOptions:[],selectedOption:void 0}},[y]:s.getAddressDefaultValues(y,n?.subscriptionBillingAddress)[y],[me]:{connected:n.externalConnections?.accounting[0]?.isValid??!1}}},ln=n=>{const{onboardingCustomerView:D,cardPaymentView:c,signedInUser:h,currentTenant:P,isOnAddressPage:I,stripeKey:x,googleAPIKey:A,onUpdateStep:S,onZeniLogoClick:T,handleLogOutClick:l,handleCockpitClick:_,meetingUrl:w,analytics:k,handleCreateCardSetupIntent:z,handleConfirmCardSetupIntent:ce,handleFetchPaymentSources:ge,updateCardPaymentModalState:R,resetCardPaymentViewState:ve,handleResetCardPaymentErrorStatuses:q,redirectToProductSuitePage:De,...Pe}=n,{allSteps:K,completedSteps:ke,halfCompletedSteps:Se,currentStep:U,fetchStatus:W}=D,H=m.useRef(U),j=m.useRef(K),[he,le]=m.useState(!1),[xe,te]=m.useState([]),Z={allSteps:K,isOnAddressPage:I,completedSteps:ke,halfCompletedSteps:Se,errorSteps:xe,currentStep:U,fetchStatus:W,signedInUser:h,currentTenant:P,onUpdateStep:E=>{S(E)},onZeniLogoClick:T,handleLogOutClick:l,handleCockpitClick:_,setIsStepClicked:le};m.useEffect(()=>{if(H.current!==U){const E=H.current;he===!0&&(k?.trackOnboardingCurrentStep(U,E),le(!1)),H.current=U}},[U,he,k]),m.useEffect(()=>{K.length!==j.current.length&&(j.current=K)},[K]);const ne=(E,be,de)=>{const se=j.current.length,pe=j.current.indexOf(E);switch(be){case"next":{const oe=(pe+1)%se,N=j.current[oe];H.current=N,S(N),de===!0?k.trackOnboardingNext(E,N):k.trackOnboardingCurrentStep(N,E);break}case"previous":{const oe=(pe+se-1)%se,N=j.current[oe];H.current=N,S(N),de===!0?k.trackOnboardingBack(E,N):k.trackOnboardingCurrentStep(N,E);break}}},Ce=W.fetchState==="In-Progress"||W.fetchState==="Not-Started";return o.jsxRuntimeExports.jsx(dn,{isOnAddressPage:I,children:I?o.jsxRuntimeExports.jsx(fe.CustomerOnboardingDrawer,{...Z}):o.jsxRuntimeExports.jsxs(pn,{children:[o.jsxRuntimeExports.jsx(fe.CustomerOnboardingDrawer,{...Z}),Ce?o.jsxRuntimeExports.jsx(fe.CustomerOnboardingDetailPageSkeleton,{isNoStepsPage:!1}):o.jsxRuntimeExports.jsx(Zt,{onboardingCustomerView:D,analytics:k,updateStepHandler:ne,onUpdateStep:S,handleCreateCardSetupIntent:z,handleConfirmCardSetupIntent:ce,updateCardPaymentModalState:R,handleFetchPaymentSources:ge,cardPaymentView:c,resetCardPaymentViewState:ve,stripeKey:x,googleAPIKey:A,handleResetCardPaymentErrorStatuses:q,redirectToProductSuitePage:De,onFormErrorsChange:te,...Pe}),Ce?null:o.jsxRuntimeExports.jsx(s.HelpButton,{isFooterRendered:!0,meetingUrl:w,analytics:k,productType:"onboarding"})]})})},dn=O.div`
+  display: flex;
+  flex-direction: column;
+  width: ${n=>n.isOnAddressPage?"fit-content":"100%"};
+  height: 100vh;
+`,pn=O.div`
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: 100vh;
+`;exports.default=ln;