@zeniai/web-components 3.16.99 → 3.17.1

package/dist/SignIn-A8Zghxck.js

@@ -1,1075 +0,0 @@
-import { j as o, aj as lo, C as ao, g as co, ak as ke, F as go, al as po } from "./vendor-.pnpm-B2klaOGU.js";
-import * as $ from "react";
-import ho, { useState as k, useEffect as W } from "react";
-import i from "@emotion/styled";
-import { toZeniUrl as te } from "@zeniai/client-epic-state";
-import { u as U, A as mo, S as n, v as uo, a as j, ay as xo, F as se, ax as fo, en as wo, t as D, dD as le, C as h, B as Ne, R as S, V as $o, eo as yo, af as Oe, o as Ge, ep as Co, dx as So, aL as _, eq as jo, er as Ee, j as vo, aw as ze, J as We, ai as Io, es as bo, E as ae, aq as ko, D as b } from "./index-CD9fwr4J.js";
-import { Z as Eo } from "./ZeniCopyright-CqgzrFWf.js";
-import { P as zo } from "./ProductsCarousel-Zc6csMe3.js";
-import { css as Je, keyframes as Ue } from "@emotion/react";
-import { S as Mo } from "./handshake-BPg58FML.js";
-const Lo = (e = 0.68, a = 1.3, l = 1440, g = 2560) => {
-  const [c, r] = k(
-    () => typeof window < "u" ? window.innerWidth : l
-  );
-  return W(() => {
-    const m = () => {
-      r(window.innerWidth);
-    };
-    return window.addEventListener("resize", m), () => window.removeEventListener("resize", m);
-  }, []), To(c, e, a, l, g);
-}, To = (e, a, l, g, c) => {
-  const r = Math.max(g, Math.min(c, e)), m = l - a, p = c - g, x = p > 0 ? (r - g) / p : 0;
-  return a + m * x;
-}, qe = (e) => /* @__PURE__ */ $.createElement("svg", { viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ $.createElement("path", { d: "M5.49686 0.437846C3.50884 1.1044 1.81485 2.56223 0.871312 4.40709C0.542169 5.04355 0.305187 5.71871 0.160364 6.41967C-0.199498 8.15702 0.0506501 10.0105 0.866923 11.593C1.39794 12.6251 2.16155 13.5454 3.08315 14.2636C3.95647 14.943 4.97023 15.4505 6.04982 15.73C7.41028 16.0869 8.8585 16.0783 10.2277 15.773C11.4653 15.4935 12.6371 14.9129 13.5718 14.07C14.5592 13.1799 15.2658 12.0102 15.6388 10.7502C16.047 9.37833 16.0996 7.9119 15.8451 6.50138C13.2866 6.50138 10.7236 6.50138 8.16511 6.50138C8.16511 7.54207 8.16511 8.58276 8.16511 9.62345C9.64844 9.62345 11.1318 9.62345 12.6151 9.62345C12.444 10.6211 11.8383 11.5328 10.9826 12.0962C10.4428 12.4531 9.82399 12.681 9.18326 12.7928C8.54253 12.9003 7.87546 12.9132 7.23473 12.7885C6.58084 12.6595 5.96205 12.3929 5.41787 12.0188C4.54893 11.421 3.88626 10.548 3.54834 9.56325C3.20164 8.56126 3.19725 7.44746 3.54834 6.44977C3.7941 5.74451 4.19784 5.09515 4.73325 4.56191C5.39153 3.89965 6.24731 3.42661 7.17329 3.23309C7.96323 3.06968 8.79706 3.09978 9.56945 3.3277C10.2277 3.52122 10.8334 3.87815 11.3293 4.34259C11.8296 3.85235 12.3299 3.3621 12.8302 2.87186C13.0935 2.60954 13.3699 2.35581 13.6245 2.08489C12.8653 1.39683 11.97 0.842081 10.9957 0.48945C9.24031 -0.147006 7.26545 -0.159907 5.49686 0.437846Z", fill: "white" }), /* @__PURE__ */ $.createElement("path", { d: "M5.49686 0.43784C7.26106 -0.159913 9.2403 -0.147012 10.9957 0.485144C11.97 0.837775 12.8609 1.38822 13.6245 2.08058C13.3699 2.35151 13.0935 2.60523 12.8302 2.86755C12.3299 3.3578 11.8296 3.84804 11.3293 4.33828C10.8334 3.87384 10.2277 3.52121 9.56945 3.32339C8.79706 3.09547 7.96323 3.06107 7.17329 3.22879C6.25169 3.4223 5.39592 3.89534 4.73325 4.5576C4.19784 5.08655 3.79409 5.74021 3.54833 6.44547C2.65745 5.76601 1.76657 5.09085 0.871307 4.41139C1.81485 2.56223 3.50884 1.1044 5.49686 0.43784Z", fill: "#EA4335" }), /* @__PURE__ */ $.createElement("path", { d: "M0.164771 6.41539C0.309594 5.71873 0.546576 5.03927 0.875719 4.40282C1.7666 5.08228 2.65748 5.75744 3.55274 6.4369C3.20166 7.43888 3.20166 8.55268 3.55274 9.55037C2.66186 10.2298 1.77099 10.9093 0.880107 11.5844C0.0550569 10.0062 -0.195091 8.15275 0.164771 6.41539Z", fill: "#FBBC05" }), /* @__PURE__ */ $.createElement("path", { d: "M8.16515 6.49707C10.7237 6.49707 13.2866 6.49707 15.8451 6.49707C16.0997 7.90329 16.0426 9.36972 15.6389 10.7458C15.2659 12.0059 14.5593 13.1756 13.5719 14.0657C12.7073 13.4078 11.8428 12.7498 10.9782 12.0919C11.834 11.5285 12.4396 10.6168 12.6108 9.61914C11.1274 9.61914 9.6441 9.61914 8.16077 9.61914C8.16516 8.57845 8.16515 7.53776 8.16515 6.49707Z", fill: "#4285F4" }), /* @__PURE__ */ $.createElement("path", { d: "M0.871338 11.5887C1.76222 10.9135 2.6531 10.2341 3.54397 9.55461C3.88628 10.5394 4.54457 11.4124 5.4135 12.0101C5.95769 12.3843 6.58086 12.6509 7.23037 12.7799C7.8711 12.9089 8.53377 12.8917 9.17889 12.7842C9.81962 12.6724 10.4384 12.4445 10.9782 12.0875C11.8428 12.7455 12.7073 13.4034 13.5718 14.0614C12.6371 14.9086 11.4653 15.4848 10.2278 15.7644C8.85853 16.0697 7.4103 16.0783 6.04985 15.7214C4.97026 15.4418 3.9565 14.9387 3.08317 14.2549C2.16596 13.5411 1.40235 12.6208 0.871338 11.5887Z", fill: "#34A853" })), Ke = (e) => /* @__PURE__ */ $.createElement("svg", { viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ $.createElement("path", { d: "M0 0H7.58546V7.58546H0V0Z", fill: "#F25022" }), /* @__PURE__ */ $.createElement("path", { d: "M8.37742 0H15.9629V7.58546H8.37742V0Z", fill: "#7FBA00" }), /* @__PURE__ */ $.createElement("path", { d: "M0 8.37741H7.58546V15.9629H0V8.37741Z", fill: "#00A4EF" }), /* @__PURE__ */ $.createElement("path", { d: "M8.41454 8.41454H16V16H8.41454V8.41454Z", fill: "#FFB900" })), Po = j.getLocalizedStrings(), _o = i.div`
-  margin-left: ${n.sp3};
-  color: ${(e) => e.theme.colors.primary};
-  font-family: ${wo.Roboto};
-  ${(e) => {
-  const a = e.windowSize === "small" ? D.standardMedium : D.largeMedium;
-  return `
-      font-size: ${a.fontSize};
-      font-weight: ${a.fontWeight};
-      line-height: ${a.lineHeight};
-    `;
-}}
-`, Bo = i.img`
-  height: ${n.sp4};
-  width: ${n.sp4};
-  border-radius: 50%;
-  justify-content: center;
-  color: ${(e) => e.theme.colors.hero};
-`, Fo = i.div`
-  display: flex;
-  align-items: center;
-  column-gap: ${n.sp1};
-`, Ro = i(fo)`
-  height: 12px;
-  width: 12px;
-  color: ${(e) => e.theme.colors.hero};
-`, Ao = i.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  justify-content: center;
-  width: ${(e) => e.windowSize === "small" ? "100%" : "264px"};
-  ${(e) => e.setWidth === !1 ? Je`
-          width: 100%;
-          min-width: 264px;
-        ` : null};
-  min-height: ${(e) => e.windowSize === "small" ? n.sp7 : n.sp8};
-  border: 1px solid;
-  box-sizing: border-box;
-  border-radius: ${n.sp2};
-
-  opacity: ${(e) => e.disabled ? 0.32 : 1};
-  border-color: ${(e) => e.disabled ? e.theme.colors.hero : e.theme.colors.grey1};
-  color: ${(e) => e.theme.colors.brandColorSapphireLight};
-  background-color: ${(e) => e.theme.colors.grey5};
-  cursor: ${(e) => e.disabled ? "default" : "pointer"};
-  &:hover {
-    border-color: ${(e) => e.theme.colors.primary};
-  }
-`, Do = i.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-`, Vo = i(qe)`
-  height: ${n.sp3};
-  width: ${n.sp3};
-`, Zo = i(qe)`
-  height: ${n.sp4};
-  width: ${n.sp4};
-`, Ho = i(Ke)`
-  height: ${n.sp4};
-  width: ${n.sp4};
-`, No = i(Ke)`
-  height: ${n.sp3};
-  width: ${n.sp3};
-`, Oo = i(xo)`
-  color: ${(e) => e.theme.colors.primary};
-`, Go = i(se)`
-  color: ${(e) => e.theme.colors.primary};
-`, Wo = i.div`
-  padding: ${n.sp2} 12px;
-  display: flex;
-  align-items: center;
-  width: 100%;
-  justify-content: space-between;
-  column-gap: ${n.sp3};
-`, Jo = i.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  column-gap: ${n.sp2};
-`, Uo = i.div`
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  justify-content: center;
-`, qo = ({
-  type: e,
-  titleText: a
-}) => {
-  const l = U();
-  return /* @__PURE__ */ o.jsxs(Do, { children: [
-    e === "Google" ? /* @__PURE__ */ o.jsx(Vo, {}) : /* @__PURE__ */ o.jsx(No, {}),
-    /* @__PURE__ */ o.jsx(_o, { windowSize: l, children: a })
-  ] });
-}, Ko = ({
-  type: e,
-  email: a,
-  firstName: l,
-  photo: g
-}) => /* @__PURE__ */ o.jsxs(Wo, { children: [
-  /* @__PURE__ */ o.jsxs(Jo, { children: [
-    /* @__PURE__ */ o.jsx(
-      Bo,
-      {
-        src: g?.href,
-        alt: a,
-        onError: ({ currentTarget: c }) => {
-          c.onerror = null, c.src = uo;
-        },
-        loading: "lazy"
-      }
-    ),
-    /* @__PURE__ */ o.jsxs(Uo, { children: [
-      /* @__PURE__ */ o.jsxs(Oo, { children: [
-        Po.signIn.continueAs,
-        " ",
-        l ?? ""
-      ] }),
-      /* @__PURE__ */ o.jsxs(Fo, { children: [
-        /* @__PURE__ */ o.jsx(Go, { children: a }),
-        /* @__PURE__ */ o.jsx(Ro, {})
-      ] })
-    ] })
-  ] }),
-  e === "Google" ? /* @__PURE__ */ o.jsx(Zo, {}) : /* @__PURE__ */ o.jsx(Ho, {})
-] });
-function re({
-  type: e,
-  titleText: a,
-  disabled: l,
-  loadingIndication: g,
-  email: c,
-  firstName: r,
-  photo: m,
-  onClick: p
-}) {
-  const x = U();
-  return /* @__PURE__ */ o.jsx(
-    Ao,
-    {
-      setWidth: c == null,
-      windowSize: x,
-      disabled: l === !0,
-      onClick: l === !0 ? void 0 : p,
-      children: g === !0 ? /* @__PURE__ */ o.jsx(mo, { size: "Standard", start: g === !0 }) : /* @__PURE__ */ o.jsx(o.Fragment, { children: c != null ? /* @__PURE__ */ o.jsx(
-        Ko,
-        {
-          type: e,
-          email: c,
-          firstName: r,
-          photo: m
-        }
-      ) : /* @__PURE__ */ o.jsx(qo, { type: e, titleText: a }) })
-    }
-  );
-}
-const Me = ({
-  inProgress: e,
-  disabled: a,
-  onSuccess: l,
-  onSignedInCallback: g,
-  getSignedInUser: c,
-  onError: r,
-  email: m,
-  firstName: p,
-  photo: x
-}) => {
-  const { analytics: v } = le(), C = lo({
-    onSuccess: l,
-    flow: "auth-code",
-    onError: r
-  }), y = () => {
-    if (c() != null) {
-      g();
-      return;
-    }
-    v.trackSignInClick("google"), C();
-  };
-  return /* @__PURE__ */ o.jsx(
-    re,
-    {
-      onClick: y,
-      disabled: a,
-      type: "Google",
-      titleText: j.getLocalizedStrings().signIn.signInGoogleButton,
-      loadingIndication: e,
-      email: m,
-      firstName: p,
-      photo: x
-    }
-  );
-}, Le = (e) => {
-  const {
-    clientId: a,
-    scopes: l,
-    getSignedInUser: g,
-    onSignedInCallback: c,
-    render: r,
-    onSuccess: m,
-    onFailure: p,
-    disabled: x
-  } = e, { analytics: v } = le();
-  let { responseType: C, responseMode: y, prompt: T, redirectUri: B } = e, d, I;
-  const F = "https://login.microsoftonline.com/common/oauth2/v2.0/authorize", q = ["openid", "profile"];
-  C = C ?? "code", y = y ?? "fragment", T = T ?? "consent", ho.useEffect(() => {
-    const f = te(
-      window.location[y === "fragment" ? "hash" : "search"],
-      !0
-    ).query;
-    (window.location.search || window.location.hash) && (f.code != null || f.access_token != null || f.error != null) && R();
-  }, []);
-  const P = () => {
-    const f = encodeURIComponent(
-      (l ?? q).join(" ")
-    );
-    return B = B ?? window.location.origin + window.location.pathname, `${F}?client_id=${a}&response_type=${C}&redirect_uri=${encodeURIComponent(B)}&scope=${f}&prompt=${T}&response_mode=${y}`;
-  }, R = () => {
-    window.opener?.authScope.authCompletedCB(
-      te(
-        window.location[y === "fragment" ? "hash" : "search"],
-        !0
-      ).query
-    ), window.close();
-  };
-  return r({ onClick: () => {
-    if (g() != null) {
-      c();
-      return;
-    }
-    v.trackSignInClick("microsoft"), d = !1;
-    const f = (u, V) => {
-      const H = window.screen.width / 2 - 287.5, A = window.screen.height / 2 - 600 / 2, E = window.open(
-        u,
-        V,
-        `toolbar=0,status=0, width=575, height=600, top=${A}, left=${H}`
-      );
-      I = setInterval(() => {
-        E.closed && !d && (p({
-          error: j.getLocalizedStrings().signIn.signInError,
-          errorDetail: { reason: "Signin popup window was closed" }
-        }), clearInterval(I));
-      }, 500);
-    };
-    window.authScope = {
-      authCompletedCB: (u) => {
-        d = !0, clearInterval(I), C === "code" && u.code ? m({ code: u.code }) : C === "token" && u.access_token ? m({
-          accessToken: u.access_token,
-          tokenType: u.token_type,
-          scope: u.scope
-        }) : u.error === "access_denied" ? p({
-          error: j.getLocalizedStrings().signIn.signInAuthError,
-          errorDetail: u
-        }) : p({
-          error: j.getLocalizedStrings().signIn.signInError,
-          errorDetail: u
-        });
-      }
-    }, f(P(), "Microsoft Sign In");
-  }, disabled: x });
-}, J = {
-  width: new S(343, 572, 572),
-  containerTop: new S(17, 25, 25)
-}, {
-  signIn: { emailNotFoundPopup: G },
-  common: { gotIt: Xo }
-} = j.getLocalizedStrings();
-function Qo({ signInError: e, onClose: a }) {
-  const l = U(), [g, c] = k(!1), r = e?.email;
-  return /* @__PURE__ */ o.jsx(
-    Yo,
-    {
-      windowSize: l,
-      role: "presentation",
-      style: { background: h.overlayDark },
-      children: /* @__PURE__ */ o.jsx(
-        ao,
-        {
-          onClickAway: () => {
-            c(!0), a();
-          },
-          children: /* @__PURE__ */ o.jsxs(
-            nn,
-            {
-              windowSize: l,
-              className: g ? "containerClass fade" : "containerClass",
-              fade: g,
-              children: [
-                /* @__PURE__ */ o.jsxs(tn, { children: [
-                  G.title,
-                  /* @__PURE__ */ o.jsx(an, { children: r })
-                ] }),
-                /* @__PURE__ */ o.jsxs(cn, { children: [
-                  /* @__PURE__ */ o.jsxs(ie, { children: [
-                    /* @__PURE__ */ o.jsx(oe, { children: /* @__PURE__ */ o.jsx(rn, {}) }),
-                    /* @__PURE__ */ o.jsx(ne, { windowSize: l, children: G.confirmEmail })
-                  ] }),
-                  /* @__PURE__ */ o.jsxs(ie, { children: [
-                    /* @__PURE__ */ o.jsx(oe, { children: /* @__PURE__ */ o.jsx(ln, {}) }),
-                    /* @__PURE__ */ o.jsx(ne, { windowSize: l, children: G.checkAccess })
-                  ] }),
-                  /* @__PURE__ */ o.jsxs(ie, { children: [
-                    /* @__PURE__ */ o.jsx(oe, { children: /* @__PURE__ */ o.jsx(sn, {}) }),
-                    /* @__PURE__ */ o.jsx(ne, { windowSize: l, children: G.contactZeni })
-                  ] })
-                ] }),
-                /* @__PURE__ */ o.jsx(
-                  Ne,
-                  {
-                    label: Xo,
-                    variant: "primary",
-                    onClick: () => {
-                      c(!0), a();
-                    }
-                  }
-                )
-              ]
-            }
-          )
-        }
-      )
-    }
-  );
-}
-const Yo = i.div`
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  z-index: 10;
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  background: ${h.overlayDark};
-  .fade {
-    animation: ${(e) => on(e)} 0.25s linear;
-  }
-`, en = ({ windowSize: e }) => Ue`
-  0% {
-    top: 100%;
-  }
-  100% {
-    top: ${J.containerTop.valuePercentage(e)};
-  }
-`, on = ({ windowSize: e }) => Ue`
-  0% {
-    top: ${J.containerTop.valuePercentage(e)};
-  }
-  100% {
-    top: 100%;
-  }
-`, nn = i.div`
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  align-items: center;
-  text-align: center;
-  background: ${(e) => e.theme.colors.grey5};
-  border-radius: ${n.sp2};
-  position: relative;
-  top: ${(e) => e.fade ? "100%" : J.containerTop.valuePercentage(e.windowSize)};
-  padding: ${n.sp5} ${n.sp0};
-  width: ${(e) => J.width.valuePx(e.windowSize)};
-  animation: ${(e) => en(e)} 0.25s linear;
-  box-shadow: ${h.Elevation2Dark};
-  overflow: hidden;
-  z-index: 1;
-  ::before {
-    content: "";
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    height: 100%;
-    background-image: ${(e) => e.theme.mode === "dark" ? "url(https://storage.googleapis.com/zeni-apis.appspot.com/images/infinite-pattern-dark-1.svg)" : "url(https://storage.googleapis.com/zeni-apis.appspot.com/images/infinite-pattern-light-1.svg)"};
-    z-index: -1;
-    transform: rotate(-8.9deg);
-    background-size: contain;
-    background-repeat: no-repeat;
-    scale: ${(e) => e.windowSize === "small" ? "142%" : "125%"};
-    background-position: ${(e) => e.windowSize === "small" ? "5px 100%" : "42px 180%"};
-  }
-`, tn = i($o)`
-  margin-bottom: ${n.sp6};
-  color: ${h.important};
-  padding: ${n.sp0} ${n.sp6};
-`, oe = i.div`
-  margin-right: 12px;
-  height: ${n.sp7};
-  width: ${n.sp7};
-  background-color: ${(e) => e.theme.mode === "dark" ? h.brandColorJadeDark : h.brandColorJadeLight};
-  border-radius: ${n.sp4};
-  display: flex;
-  align-items: center;
-  justify-content: center;
-`, ne = i(Ge)`
-  width: calc(100% - 120px);
-  color: ${(e) => e.theme.colors.primary};
-  text-align: start;
-`, ie = i.div`
-  display: flex;
-  align-items: center;
-  margin-bottom: ${n.sp5};
-`, ce = (e) => Je`
-  width: ${n.sp4};
-  height: ${n.sp4};
-  color: ${e.theme.colors.primary};
-`, rn = i(Oe)`
-  ${ce};
-`, sn = i(Mo)`
-  ${ce};
-`, ln = i(Co)`
-  ${ce};
-`, an = i(yo)`
-  word-break: break-all;
-`, cn = i.div`
-  padding: ${n.sp0} ${n.sp6};
-`, s = j.getLocalizedStrings(), Xe = {
-  signInHeading: new ze("h5Regular", "h2Regular"),
-  signInMessage: new ze("standardRegular", "h6Regular")
-}, L = {
-  ZeniLogoContainerLeftMargin: new S(b[0], b[5]),
-  ZeniLogoContainerTopMargin: new S(12, b[3]),
-  SignInHeadingMarginBottom: new S(b[2], b[3]),
-  headingContainerTopMargin: new S(36, 10),
-  signInContainerPaddingTop: new S(b[12], b[4]),
-  emailInputFontSize: new S(
-    D.standardRegular.fontSizeValue,
-    D.extraLargeRegular.fontSizeValue
-  ),
-  emailInputVerticalPadding: new S(b[3], 12)
-}, dn = i.div`
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: ${(e) => e.showEmailForm && e.windowSize !== "small" ? "354px" : "100%"};
-  gap: ${n.sp3};
-  max-width: 100%;
-`, Te = i.div`
-  width: ${(e) => e.windowSize === "small" ? "118px" : "247px"};
-  height: 1px;
-  background-color: ${(e) => e.theme.colors.grey2};
-  flex-shrink: 0;
-`, gn = i(Ge)`
-  text-transform: capitalize;
-  color: ${(e) => e.theme.colors.hero};
-  flex-shrink: 0;
-`, pn = i.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: ${n.sp2};
-  width: 100%;
-`, hn = i.button`
-  background: none;
-  border: none;
-  padding: 0;
-  cursor: pointer;
-  display: inline-block;
-  position: relative;
-  color: ${(e) => e.theme.colors.hero};
-  text-decoration: none;
-  ${D.smallMedium.css}
-  text-align: center;
-  &:before {
-    content: "";
-    position: absolute;
-    left: 0;
-    bottom: 0;
-    height: 1px;
-    width: 100%;
-    background: ${(e) => e.theme.colors.grey2};
-    z-index: 0;
-    pointer-events: none;
-  }
-  &:after {
-    content: "";
-    position: absolute;
-    left: 0;
-    bottom: 0;
-    height: 1px;
-    width: 0%;
-    background: ${(e) => e.theme.colors.primary};
-    transition: width 0.3s ease;
-    z-index: 1;
-    pointer-events: none;
-  }
-  &:hover {
-    color: ${(e) => e.theme.colors.primary};
-    &:after {
-      width: 100%;
-    }
-  }
-  &:focus {
-    outline: none;
-  }
-`, mn = i(ae)`
-  color: ${(e) => e.theme.colors.hero};
-  text-align: center;
-  visibility: ${(e) => e.isVisible ? "visible" : "hidden"};
-`, un = i.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 1px;
-`, xn = i.div`
-  background-image: ${(e) => `url(https://storage.googleapis.com/zeni-apis.appspot.com/images/signin-background-${e.windowSize === "small" ? "m" : "w"}-${e.theme.mode === "light" ? "l" : "d"}.svg)`};
-
-  background-color: ${(e) => e.theme.colors.background};
-  background-size: cover;
-  height: 100vh;
-  max-height: -webkit-fill-available; // fallback for older browsers
-  height: 100dvh; // using new units from google I/O 2022 https://youtu.be/Xy9ZXRRgpLk?t=982
-  display: flex;
-  flex-direction: column;
-  background-position: 50px ${n.sp0};
-  background-repeat: no-repeat;
-  overflow-x: hidden;
-`, fn = i.div`
-  display: flex;
-  flex: 1 1 auto;
-  padding: ${n.sp0} ${n.sp4} ${n.sp0} ${n.sp4};
-  flex-direction: column;
-  align-items: center;
-  text-align: center;
-  justify-content: space-between;
-  background-color: ${(e) => e.theme.colors.background};
-  background-color: transparent;
-  row-gap: ${(e) => e.windowSize === "extra-large" ? n.sp3 : n.sp5};
-`, Pe = i(We)`
-  ${(e) => `${Xe.signInHeading.style(e.windowSize)}`};
-  color: ${(e) => e.theme.colors.primary};
-  text-align: center;
-`, _e = i(We)`
-  ${(e) => `${Xe.signInMessage.style(e.windowSize)}`};
-  color: ${(e) => e.theme.colors.champion};
-  text-align: center;
-`, Be = i(ae)`
-  margin: ${n.sp0} ${n.sp0} ${n.sp0} ${n.sp0};
-  color: ${(e) => e.theme.colors.grey1};
-`, Fe = i(ae)`
-  margin: ${n.sp1} ${n.sp0} ${n.sp1} ${n.sp0};
-  color: ${(e) => e.theme.colors.hero};
-  text-decoration: none;
-`, wn = i(ko)`
-  color: ${h.important};
-  text-align: center;
-  white-space: pre;
-`, $n = i.div`
-  display: flex;
-  flex-direction: column;
-  row-gap: ${n.sp2};
-  flex-shrink: 0;
-  position: relative;
-  width: ${(e) => e.windowSize === "small" ? "100%" : "unset"};
-`, yn = i.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  background-color: ${(e) => e.theme.colors.grey5};
-  border: 1px solid
-    ${(e) => e.hasError ? h.important : e.theme.colors.grey1};
-  border-radius: ${n.sp2};
-  padding-top: ${(e) => L.emailInputVerticalPadding.valuePx(e.windowSize)};
-  padding-bottom: ${(e) => L.emailInputVerticalPadding.valuePx(e.windowSize)};
-  padding-left: ${n.sp4};
-  padding-right: ${n.sp2};
-  width: ${(e) => e.windowSize === "small" ? "100%" : "354px"};
-  max-width: 100%;
-  height: ${n.sp8};
-  box-sizing: border-box;
-  &:focus-within,
-  &:hover {
-    border: 1px solid
-      ${(e) => e.hasError ? h.important : e.theme.colors.primary};
-  }
-`, Cn = i(po, {
-  shouldForwardProp: (e) => e !== "isValid" && e !== "windowSize"
-})`
-  flex: 1;
-
-  & .MuiOutlinedInput-root {
-    border: none;
-    box-shadow: none;
-
-    &:hover .MuiOutlinedInput-notchedOutline {
-      border: none;
-    }
-
-    &.Mui-focused .MuiOutlinedInput-notchedOutline {
-      border: none;
-    }
-
-    .MuiOutlinedInput-notchedOutline {
-      border: none;
-    }
-  }
-
-  & .MuiInputBase-input {
-    padding: ${n.sp0} ${n.sp2} ${n.sp0} ${n.sp0};
-    font-size: ${(e) => L.emailInputFontSize.valuePx(e.windowSize)};
-    color: ${(e) => e.isValid ? e.theme.colors.primary : h.important};
-    height: auto;
-
-    &::placeholder {
-      color: ${(e) => e.theme.colors.grey1};
-      opacity: 1;
-    }
-  }
-`, Sn = i(se)`
-  color: ${h.important};
-  text-align: center;
-  width: 100%;
-`, Re = i.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: ${n.sp3};
-  width: 100%;
-`, Ae = i.div`
-  display: flex;
-  align-items: center;
-  gap: ${n.sp3};
-  background-color: ${(e) => e.isDarkTheme ? h.neutralGrey5Dark : h.brandColorJadeLight}80;
-  border-radius: 50px;
-  padding: 12px ${n.sp4};
-  box-sizing: border-box;
-`, jn = i(Oe)`
-  width: ${n.sp3};
-  height: ${n.sp3};
-  color: ${(e) => e.theme.colors.brandColorSapphire};
-  flex-shrink: 0;
-`, vn = i.div`
-  width: ${n.sp4};
-  height: ${n.sp4};
-  background-color: ${h.neutralGrey5Light};
-  border: 1px solid ${(e) => e.theme.colors.brandColorJade};
-  border-radius: 50%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-shrink: 0;
-`, De = i(Io)`
-  color: ${(e) => e.isDarkTheme ? h.brandColorJadeLight : e.theme.colors.brandColorSapphire};
-  flex: 1;
-`, Ve = i(bo)`
-  color: ${(e) => e.theme.colors.primary};
-`, Ze = i(se)`
-  color: ${(e) => e.theme.colors.hero};
-  text-align: center;
-`, In = i.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  width: ${(e) => e.windowSize === "small" ? "100%" : "unset"};
-  margin-top: ${(e) => L.signInContainerPaddingTop.valuePx(e.windowSize)};
-`, bn = i.div`
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  gap: ${(e) => e.showEmailError && e.showEmailForm ? n.sp1 : n.sp3};
-  max-width: 100%;
-`, kn = i.div`
-  display: flex;
-  flex-direction: ${(e) => e.windowSize === "small" ? "column" : "row"};
-  justify-content: center;
-  align-items: center;
-  gap: ${n.sp4};
-  flex-wrap: ${(e) => e.windowSize === "small" ? "wrap" : "nowrap"};
-  width: 100%;
-`, En = i.div`
-  width: 100%;
-`, He = i.div`
-  margin-top: ${(e) => L.headingContainerTopMargin.valuePx(e.windowSize)};
-  row-gap: ${(e) => e.isMagicLinkSent ? e.windowSize === "small" ? "150px" : n.sp4 : n.sp2};
-  flex-direction: column;
-`, zn = i.div`
-  display: flex;
-  flex-direction: column;
-  display: flex;
-  width: 100%;
-  margin-left: ${(e) => L.ZeniLogoContainerLeftMargin.valuePx(e.windowSize)};
-  margin-top: ${(e) => L.ZeniLogoContainerTopMargin.valuePx(e.windowSize)};
-  justify-content: ${(e) => e.windowSize === "small" ? "center" : "start"};
-
-  .zeni-logo {
-    align-self: ${(e) => e.windowSize === "small" ? "center" : "self-start"};
-  }
-`, Mn = i(vo)`
-  color: ${(e) => e.theme.colors.primary};
-  height: ${n.sp4};
-`, Ln = i.div`
-  width: 100%;
-`, Tn = i.div`
-  width: 1167px;
-  height: 384px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  overflow: visible;
-`, Pn = i(Ne)`
-  padding: ${n.sp2} ${n.sp3};
-`;
-function Nn({
-  googleClientId: e,
-  microsoftClientId: a,
-  fetchState: l,
-  signInError: g = {},
-  showEmailLogin: c = !1,
-  sendMagicLinkStatus: r,
-  magicLinkExpired: m,
-  magicLinkExpiredEmail: p,
-  getSignedInUser: x,
-  onSignedInCallback: v,
-  clearSignInError: C,
-  onOAuthSuccess: y,
-  onOAuthError: T,
-  sendMagicLink: B
-}) {
-  const d = U(), { dark: I } = So(), { analytics: F } = le(), q = Lo(0.68, 1.3, 1440, 2560), P = l === "In-Progress", R = l === "Error", [K, f] = k(void 0), [u, V] = k(""), [Z, X] = k(!1), [H, A] = k(!1), [E, Qe] = k(void 0), [w, Q] = k(!1), de = l === "In-Progress" && u === "google", ge = l === "In-Progress" && u === "microsoft", pe = co({
-    mode: "onSubmit",
-    defaultValues: {
-      email: ""
-    }
-  }), {
-    register: Ye,
-    handleSubmit: eo,
-    formState: { errors: he },
-    setValue: me,
-    watch: oo,
-    clearErrors: no
-  } = pe, N = r.fetchState === "Error" && r.error?.error?.type === "email_not_found", ue = r.fetchState === "Error" && r.error?.details?.application_error_code !== "LOGIN_VIA_EMAIL_LOCKED" && !N, O = oo("email"), xe = !!he.email || H || ue, fe = !!he.email;
-  W(() => {
-    c && m === !0 && p != null && p.trim() !== "" && (me("email", p), A(!0), Q(!0));
-  }, [c, m, p, me]), W(() => {
-    c && r.fetchState === "Error" && r.error?.details?.application_error_code === "LOGIN_VIA_MAGIC_LINK_RESTRICTED" && (Q(!1), Qe(() => {
-      const t = r.error?.details?.domain_type;
-      if (t === "google" || t === "microsoft")
-        return t;
-    }));
-  }, [
-    r.error?.details,
-    r.fetchState,
-    c
-  ]);
-  const io = (t) => {
-    A(!1), t.email.trim() && (F.trackSignInClick("email"), B(t.email));
-  }, to = () => {
-    A(!1), no("email");
-  }, we = R && g.type === "email_not_found";
-  W(() => {
-    (we || N) && X(!0);
-  }, [N, we]);
-  const $e = (t) => {
-    console.log(JSON.stringify(t)), f(void 0), y(t.code, "google"), V("google");
-  }, ye = (t) => {
-    const M = "Error = " + t?.error + " Error Description = " + t?.error_description;
-    f(M), T?.(JSON.stringify(t), "google");
-  }, Ce = (t) => {
-    console.log(JSON.stringify(t)), f(void 0), y(t.code, "microsoft"), V("microsoft");
-  }, Se = (t) => {
-    console.log(JSON.stringify(t)), f(t.error ?? "Microsoft authorization failed."), T?.(JSON.stringify(t), "microsoft");
-  }, ro = () => {
-    let t = "";
-    return (R || K != null) && Z === !1 && (t = K ?? s.signIn.signInAuthError), t;
-  }, je = r.fetchState === "Completed" ? s.signIn.confirmationLinkSent : s.signIn.heading, ve = E != null ? s.signIn.signInSecurelyMessage : s.signIn.message, z = r.fetchState === "Completed", so = N && r.error?.error ? r.error.error : g, Y = r.error?.details?.user, Ie = Y?.first_name ?? void 0, be = Y?.photo?.original != null ? te(Y.photo.original) : void 0;
-  return /* @__PURE__ */ o.jsxs(xn, { windowSize: d, children: [
-    /* @__PURE__ */ o.jsxs(fn, { windowSize: d, children: [
-      /* @__PURE__ */ o.jsxs(Ln, { children: [
-        /* @__PURE__ */ o.jsx(zn, { windowSize: d, children: /* @__PURE__ */ o.jsx(Mn, { className: "zeni-logo" }) }),
-        /* @__PURE__ */ o.jsxs(
-          He,
-          {
-            isMagicLinkSent: z,
-            windowSize: d,
-            style: { display: d === "small" ? "flex" : "none" },
-            children: [
-              /* @__PURE__ */ o.jsx(Pe, { windowSize: d, children: je }),
-              /* @__PURE__ */ o.jsx(_, { controller: !z, children: /* @__PURE__ */ o.jsx(_e, { windowSize: d, children: ve }) }),
-              /* @__PURE__ */ o.jsx(_, { controller: z, children: /* @__PURE__ */ o.jsxs(Re, { children: [
-                /* @__PURE__ */ o.jsx(Ae, { isDarkTheme: I, children: /* @__PURE__ */ o.jsx(De, { isDarkTheme: I, children: j.getLocalizedStrings().signIn.magicLinkSent.primaryMessage.split("__email__").map((t, M, ee) => /* @__PURE__ */ o.jsxs("span", { children: [
-                  t,
-                  M < ee.length - 1 && /* @__PURE__ */ o.jsx(Ve, { children: O })
-                ] }, M)) }) }),
-                /* @__PURE__ */ o.jsx(Ze, { children: s.signIn.magicLinkSent.secondaryMessage })
-              ] }) })
-            ]
-          }
-        ),
-        /* @__PURE__ */ o.jsxs(
-          He,
-          {
-            isMagicLinkSent: z,
-            windowSize: d,
-            style: {
-              display: d === "small" ? "none" : "flex"
-            },
-            children: [
-              /* @__PURE__ */ o.jsx(Pe, { windowSize: d, children: je }),
-              /* @__PURE__ */ o.jsx(_, { controller: !z, children: /* @__PURE__ */ o.jsx(_e, { windowSize: d, children: ve }) }),
-              /* @__PURE__ */ o.jsx(_, { controller: z, children: /* @__PURE__ */ o.jsxs(Re, { children: [
-                /* @__PURE__ */ o.jsxs(Ae, { isDarkTheme: I, children: [
-                  /* @__PURE__ */ o.jsx(vn, { children: /* @__PURE__ */ o.jsx(jn, {}) }),
-                  /* @__PURE__ */ o.jsx(De, { isDarkTheme: I, children: j.getLocalizedStrings().signIn.magicLinkSent.primaryMessage.split("__email__").map((t, M, ee) => /* @__PURE__ */ o.jsxs("span", { children: [
-                    t,
-                    M < ee.length - 1 && /* @__PURE__ */ o.jsx(Ve, { children: O })
-                  ] }, M)) })
-                ] }),
-                /* @__PURE__ */ o.jsx(Ze, { children: s.signIn.magicLinkSent.secondaryMessage })
-              ] }) })
-            ]
-          }
-        ),
-        /* @__PURE__ */ o.jsx(_, { controller: !z, children: /* @__PURE__ */ o.jsxs(In, { windowSize: d, children: [
-          /* @__PURE__ */ o.jsxs(
-            bn,
-            {
-              showEmailError: xe,
-              showEmailForm: w,
-              children: [
-                !w && !E && /* @__PURE__ */ o.jsxs(kn, { windowSize: d, children: [
-                  /* @__PURE__ */ o.jsx(ke, { clientId: e, children: /* @__PURE__ */ o.jsx(
-                    Me,
-                    {
-                      disabled: P,
-                      inProgress: de,
-                      getSignedInUser: x,
-                      onSuccess: $e,
-                      onSignedInCallback: v,
-                      onError: ye
-                    }
-                  ) }),
-                  /* @__PURE__ */ o.jsx(
-                    Le,
-                    {
-                      clientId: a,
-                      scopes: [
-                        "openid",
-                        "profile",
-                        "email",
-                        "offline_access",
-                        "User.Read"
-                      ],
-                      getSignedInUser: x,
-                      prompt: "select_account",
-                      responseType: "code",
-                      responseMode: "query",
-                      render: (t) => /* @__PURE__ */ o.jsx(
-                        re,
-                        {
-                          onClick: t.onClick,
-                          disabled: P || t.disabled,
-                          type: "Microsoft",
-                          titleText: s.signIn.signInMicrosoftButton,
-                          loadingIndication: ge
-                        }
-                      ),
-                      onSignedInCallback: v,
-                      onSuccess: Ce,
-                      onFailure: Se
-                    }
-                  )
-                ] }),
-                !w && E === "google" && /* @__PURE__ */ o.jsx(ke, { clientId: e, children: /* @__PURE__ */ o.jsx(
-                  Me,
-                  {
-                    disabled: P,
-                    inProgress: de,
-                    email: O,
-                    firstName: Ie,
-                    photo: be,
-                    getSignedInUser: x,
-                    onSuccess: $e,
-                    onSignedInCallback: v,
-                    onError: ye
-                  }
-                ) }),
-                !w && E === "microsoft" && /* @__PURE__ */ o.jsx(
-                  Le,
-                  {
-                    clientId: a,
-                    scopes: [
-                      "openid",
-                      "profile",
-                      "email",
-                      "offline_access",
-                      "User.Read"
-                    ],
-                    getSignedInUser: x,
-                    prompt: "select_account",
-                    responseType: "code",
-                    responseMode: "query",
-                    render: (t) => /* @__PURE__ */ o.jsx(
-                      re,
-                      {
-                        onClick: t.onClick,
-                        disabled: P || t.disabled,
-                        type: "Microsoft",
-                        titleText: s.signIn.signInMicrosoftButton,
-                        loadingIndication: ge,
-                        email: O,
-                        firstName: Ie,
-                        photo: be
-                      }
-                    ),
-                    onSignedInCallback: v,
-                    onSuccess: Ce,
-                    onFailure: Se
-                  }
-                ),
-                c && w && /* @__PURE__ */ o.jsx(go, { ...pe, children: /* @__PURE__ */ o.jsxs($n, { windowSize: d, children: [
-                  /* @__PURE__ */ o.jsx("form", { onSubmit: eo(io), children: /* @__PURE__ */ o.jsxs(
-                    yn,
-                    {
-                      windowSize: d,
-                      hasError: fe,
-                      children: [
-                        /* @__PURE__ */ o.jsx(
-                          Cn,
-                          {
-                            windowSize: d,
-                            type: "text",
-                            placeholder: s.signIn.workEmailExample,
-                            variant: "outlined",
-                            fullWidth: !0,
-                            isValid: !fe,
-                            autoComplete: "off",
-                            ...Ye("email", {
-                              required: s.signIn.invalidEmailMessage,
-                              pattern: {
-                                value: jo,
-                                message: s.signIn.invalidEmailMessage
-                              },
-                              onChange: to
-                            })
-                          }
-                        ),
-                        /* @__PURE__ */ o.jsx(
-                          Pn,
-                          {
-                            variant: "primary",
-                            type: "submit",
-                            label: s.signIn.signInButton,
-                            loading: r.fetchState === "In-Progress"
-                          }
-                        )
-                      ]
-                    }
-                  ) }),
-                  xe && /* @__PURE__ */ o.jsx(Sn, { children: H ? s.signIn.magicLinkExpired : ue ? s.common.errorMessage.somethingWentWrongPleaseTryAgain : s.signIn.invalidEmailMessage })
-                ] }) }),
-                c && !E && /* @__PURE__ */ o.jsxs(pn, { children: [
-                  /* @__PURE__ */ o.jsxs(
-                    dn,
-                    {
-                      showEmailForm: w,
-                      windowSize: d,
-                      children: [
-                        /* @__PURE__ */ o.jsx(
-                          Te,
-                          {
-                            showEmailForm: w,
-                            windowSize: d
-                          }
-                        ),
-                        /* @__PURE__ */ o.jsx(gn, { children: s.common.texts.or.toUpperCase() }),
-                        /* @__PURE__ */ o.jsx(
-                          Te,
-                          {
-                            showEmailForm: w,
-                            windowSize: d
-                          }
-                        )
-                      ]
-                    }
-                  ),
-                  /* @__PURE__ */ o.jsxs(un, { children: [
-                    /* @__PURE__ */ o.jsx(
-                      hn,
-                      {
-                        onClick: () => {
-                          w ? F.trackSignInViaGoogleMicrosoft() : F.trackSignInViaEmail(), Q(!w);
-                        },
-                        children: w ? s.signIn.googleOrMicrosoftLink : s.signIn.workEmailLink
-                      }
-                    ),
-                    /* @__PURE__ */ o.jsx(mn, { isVisible: !w, children: s.signIn.workEmailSubText })
-                  ] })
-                ] })
-              ]
-            }
-          ),
-          Z === !1 && R && /* @__PURE__ */ o.jsx(En, { children: /* @__PURE__ */ o.jsx(wn, { children: ro() }) })
-        ] }) })
-      ] }),
-      /* @__PURE__ */ o.jsx(_, { controller: d !== "small", children: /* @__PURE__ */ o.jsx(Tn, { children: /* @__PURE__ */ o.jsx(zo, { scale: q }) }) }),
-      /* @__PURE__ */ o.jsx(
-        Be,
-        {
-          style: {
-            maxWidth: "100%",
-            textAlign: "center",
-            marginBottom: d === "small" ? n.sp5 : n.sp1
-          },
-          children: /* @__PURE__ */ o.jsxs(Be, { children: [
-            /* @__PURE__ */ o.jsxs(Fe, { children: [
-              s.signIn.termsPrivacyFinePrintPart,
-              s.signIn.agreeWith,
-              /* @__PURE__ */ o.jsx(
-                Ee,
-                {
-                  href: s.signIn.termsUrl,
-                  target: "_Blank",
-                  rel: "noopener noreferrer",
-                  linkText: s.signIn.termsOfService
-                }
-              ),
-              " ",
-              s.signIn.and,
-              " ",
-              /* @__PURE__ */ o.jsx(
-                Ee,
-                {
-                  href: s.signIn.privacyPolicyUrl,
-                  target: "_Blank",
-                  rel: "noopener noreferrer",
-                  linkText: s.signIn.privacyPolicy
-                }
-              ),
-              "."
-            ] }),
-            /* @__PURE__ */ o.jsx(Fe, { children: /* @__PURE__ */ o.jsx(Eo, {}) })
-          ] })
-        }
-      )
-    ] }),
-    Z && /* @__PURE__ */ o.jsx(
-      Qo,
-      {
-        signInError: so,
-        onClose: () => {
-          C(), X(!1);
-        }
-      }
-    )
-  ] });
-}
-export {
-  Nn as default
-};