@zeniai/web-components 3.17.22 → 3.17.23

package/dist/SignIn-CE6gxhI3.js

@@ -1,1155 +0,0 @@
-import { j as o, aj as fo, C as wo, g as $o, ak as Pe, F as yo, al as Co } from "./vendor-.pnpm-UYinI_7q.js";
-import * as $ from "react";
-import So, { useState as j, useEffect as F } from "react";
-import i from "@emotion/styled";
-import { toZeniUrl as se } from "@zeniai/client-epic-state";
-import { u as q, A as jo, S as n, v as vo, ay as Io, a as I, F as ae, ax as bo, en as ko, t as N, ek as ce, C as m, B as K, R as v, V as Eo, eo as zo, af as Ye, o as eo, ep as Lo, el as Mo, aL as B, eq as To, er as _e, j as Po, aw as Be, J as de, ai as _o, es as Bo, E as ge, aq as Fo, D as z } from "./index-mRSIAtAd.js";
-import { Z as Ro } from "./ZeniCopyright-2oeOVh0P.js";
-import { P as Do } from "./ProductsCarousel-DzOaqLVq.js";
-import { css as oo, keyframes as no } from "@emotion/react";
-import { S as Ao } from "./handshake-BPg58FML.js";
-const Vo = (e = 0.68, l = 1.3, c = 1440, g = 2560) => {
-  const [d, s] = j(
-    () => typeof window < "u" ? window.innerWidth : c
-  );
-  return F(() => {
-    const h = () => {
-      s(window.innerWidth);
-    };
-    return window.addEventListener("resize", h), () => window.removeEventListener("resize", h);
-  }, []), No(d, e, l, c, g);
-}, No = (e, l, c, g, d) => {
-  const s = Math.max(g, Math.min(d, e)), h = c - l, p = d - g, x = p > 0 ? (s - g) / p : 0;
-  return l + h * x;
-}, io = (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" })), to = (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" })), Ho = I.getLocalizedStrings(), Zo = i.div`
-  margin-left: ${n.sp3};
-  color: ${(e) => e.theme.colors.primary};
-  font-family: ${ko.Roboto};
-  ${(e) => {
-  const l = e.windowSize === "small" ? N.standardMedium : N.largeMedium;
-  return `
-      font-size: ${l.fontSize};
-      font-weight: ${l.fontWeight};
-      line-height: ${l.lineHeight};
-    `;
-}}
-`, Oo = i.img`
-  height: ${n.sp4};
-  width: ${n.sp4};
-  border-radius: 50%;
-  justify-content: center;
-  color: ${(e) => e.theme.colors.hero};
-`, Go = i.div`
-  display: flex;
-  align-items: center;
-  column-gap: ${n.sp1};
-`, Wo = i(bo)`
-  height: 12px;
-  width: 12px;
-  color: ${(e) => e.theme.colors.hero};
-`, Uo = i.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  justify-content: center;
-  width: ${(e) => e.windowSize === "small" ? "100%" : "264px"};
-  ${(e) => e.setWidth === !1 ? oo`
-          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};
-  }
-`, Jo = i.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-`, qo = i(io)`
-  height: ${n.sp3};
-  width: ${n.sp3};
-`, Ko = i(io)`
-  height: ${n.sp4};
-  width: ${n.sp4};
-`, Xo = i(to)`
-  height: ${n.sp4};
-  width: ${n.sp4};
-`, Qo = i(to)`
-  height: ${n.sp3};
-  width: ${n.sp3};
-`, Yo = i(Io)`
-  color: ${(e) => e.theme.colors.primary};
-`, en = i(ae)`
-  color: ${(e) => e.theme.colors.primary};
-`, on = i.div`
-  padding: ${n.sp2} 12px;
-  display: flex;
-  align-items: center;
-  width: 100%;
-  justify-content: space-between;
-  column-gap: ${n.sp3};
-`, nn = i.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  column-gap: ${n.sp2};
-`, tn = i.div`
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  justify-content: center;
-`, rn = ({
-  type: e,
-  titleText: l
-}) => {
-  const c = q();
-  return /* @__PURE__ */ o.jsxs(Jo, { children: [
-    e === "Google" ? /* @__PURE__ */ o.jsx(qo, {}) : /* @__PURE__ */ o.jsx(Qo, {}),
-    /* @__PURE__ */ o.jsx(Zo, { windowSize: c, children: l })
-  ] });
-}, sn = ({
-  type: e,
-  email: l,
-  firstName: c,
-  photo: g
-}) => /* @__PURE__ */ o.jsxs(on, { children: [
-  /* @__PURE__ */ o.jsxs(nn, { children: [
-    /* @__PURE__ */ o.jsx(
-      Oo,
-      {
-        src: g?.href,
-        alt: l,
-        onError: ({ currentTarget: d }) => {
-          d.onerror = null, d.src = vo;
-        },
-        loading: "lazy"
-      }
-    ),
-    /* @__PURE__ */ o.jsxs(tn, { children: [
-      /* @__PURE__ */ o.jsxs(Yo, { children: [
-        Ho.signIn.continueAs,
-        " ",
-        c ?? ""
-      ] }),
-      /* @__PURE__ */ o.jsxs(Go, { children: [
-        /* @__PURE__ */ o.jsx(en, { children: l }),
-        /* @__PURE__ */ o.jsx(Wo, {})
-      ] })
-    ] })
-  ] }),
-  e === "Google" ? /* @__PURE__ */ o.jsx(Ko, {}) : /* @__PURE__ */ o.jsx(Xo, {})
-] });
-function le({
-  type: e,
-  titleText: l,
-  disabled: c,
-  loadingIndication: g,
-  email: d,
-  firstName: s,
-  photo: h,
-  onClick: p
-}) {
-  const x = q();
-  return /* @__PURE__ */ o.jsx(
-    Uo,
-    {
-      setWidth: d == null,
-      windowSize: x,
-      disabled: c === !0,
-      onClick: c === !0 ? void 0 : p,
-      children: g === !0 ? /* @__PURE__ */ o.jsx(jo, { size: "Standard", start: g === !0 }) : /* @__PURE__ */ o.jsx(o.Fragment, { children: d != null ? /* @__PURE__ */ o.jsx(
-        sn,
-        {
-          type: e,
-          email: d,
-          firstName: s,
-          photo: h
-        }
-      ) : /* @__PURE__ */ o.jsx(rn, { type: e, titleText: l }) })
-    }
-  );
-}
-const Fe = ({
-  inProgress: e,
-  disabled: l,
-  onSuccess: c,
-  onSignedInCallback: g,
-  getSignedInUser: d,
-  onError: s,
-  email: h,
-  firstName: p,
-  photo: x
-}) => {
-  const { analytics: b } = ce(), S = fo({
-    onSuccess: c,
-    flow: "auth-code",
-    onError: s
-  }), y = () => {
-    if (d() != null) {
-      g();
-      return;
-    }
-    b.trackSignInClick("google"), S();
-  };
-  return /* @__PURE__ */ o.jsx(
-    le,
-    {
-      onClick: y,
-      disabled: l,
-      type: "Google",
-      titleText: I.getLocalizedStrings().signIn.signInGoogleButton,
-      loadingIndication: e,
-      email: h,
-      firstName: p,
-      photo: x
-    }
-  );
-}, Re = (e) => {
-  const {
-    clientId: l,
-    scopes: c,
-    getSignedInUser: g,
-    onSignedInCallback: d,
-    render: s,
-    onSuccess: h,
-    onFailure: p,
-    disabled: x
-  } = e, { analytics: b } = ce();
-  let { responseType: S, responseMode: y, prompt: P, redirectUri: k } = e, a, E;
-  const R = "https://login.microsoftonline.com/common/oauth2/v2.0/authorize", X = ["openid", "profile"];
-  S = S ?? "code", y = y ?? "fragment", P = P ?? "consent", So.useEffect(() => {
-    const f = se(
-      window.location[y === "fragment" ? "hash" : "search"],
-      !0
-    ).query;
-    (window.location.search || window.location.hash) && (f.code != null || f.access_token != null || f.error != null) && D();
-  }, []);
-  const _ = () => {
-    const f = encodeURIComponent(
-      (c ?? X).join(" ")
-    );
-    return k = k ?? window.location.origin + window.location.pathname, `${R}?client_id=${l}&response_type=${S}&redirect_uri=${encodeURIComponent(k)}&scope=${f}&prompt=${P}&response_mode=${y}`;
-  }, D = () => {
-    window.opener?.authScope.authCompletedCB(
-      se(
-        window.location[y === "fragment" ? "hash" : "search"],
-        !0
-      ).query
-    ), window.close();
-  };
-  return s({ onClick: () => {
-    if (g() != null) {
-      d();
-      return;
-    }
-    b.trackSignInClick("microsoft"), a = !1;
-    const f = (u, H) => {
-      const O = window.screen.width / 2 - 287.5, G = window.screen.height / 2 - 600 / 2, L = window.open(
-        u,
-        H,
-        `toolbar=0,status=0, width=575, height=600, top=${G}, left=${O}`
-      );
-      E = setInterval(() => {
-        L.closed && !a && (p({
-          error: I.getLocalizedStrings().signIn.signInError,
-          errorDetail: { reason: "Signin popup window was closed" }
-        }), clearInterval(E));
-      }, 500);
-    };
-    window.authScope = {
-      authCompletedCB: (u) => {
-        a = !0, clearInterval(E), S === "code" && u.code ? h({ code: u.code }) : S === "token" && u.access_token ? h({
-          accessToken: u.access_token,
-          tokenType: u.token_type,
-          scope: u.scope
-        }) : u.error === "access_denied" ? p({
-          error: I.getLocalizedStrings().signIn.signInAuthError,
-          errorDetail: u
-        }) : p({
-          error: I.getLocalizedStrings().signIn.signInError,
-          errorDetail: u
-        });
-      }
-    }, f(_(), "Microsoft Sign In");
-  }, disabled: x });
-}, J = {
-  width: new v(343, 572, 572),
-  containerTop: new v(17, 25, 25)
-}, {
-  signIn: { emailNotFoundPopup: U },
-  common: { gotIt: ln }
-} = I.getLocalizedStrings();
-function an({ signInError: e, onClose: l }) {
-  const c = q(), [g, d] = j(!1), s = e?.email;
-  return /* @__PURE__ */ o.jsx(
-    cn,
-    {
-      windowSize: c,
-      role: "presentation",
-      style: { background: m.overlayDark },
-      children: /* @__PURE__ */ o.jsx(
-        wo,
-        {
-          onClickAway: () => {
-            d(!0), l();
-          },
-          children: /* @__PURE__ */ o.jsxs(
-            pn,
-            {
-              windowSize: c,
-              className: g ? "containerClass fade" : "containerClass",
-              fade: g,
-              children: [
-                /* @__PURE__ */ o.jsxs(hn, { children: [
-                  U.title,
-                  /* @__PURE__ */ o.jsx(fn, { children: s })
-                ] }),
-                /* @__PURE__ */ o.jsxs(wn, { children: [
-                  /* @__PURE__ */ o.jsxs(re, { children: [
-                    /* @__PURE__ */ o.jsx(ie, { children: /* @__PURE__ */ o.jsx(mn, {}) }),
-                    /* @__PURE__ */ o.jsx(te, { windowSize: c, children: U.confirmEmail })
-                  ] }),
-                  /* @__PURE__ */ o.jsxs(re, { children: [
-                    /* @__PURE__ */ o.jsx(ie, { children: /* @__PURE__ */ o.jsx(xn, {}) }),
-                    /* @__PURE__ */ o.jsx(te, { windowSize: c, children: U.checkAccess })
-                  ] }),
-                  /* @__PURE__ */ o.jsxs(re, { children: [
-                    /* @__PURE__ */ o.jsx(ie, { children: /* @__PURE__ */ o.jsx(un, {}) }),
-                    /* @__PURE__ */ o.jsx(te, { windowSize: c, children: U.contactZeni })
-                  ] })
-                ] }),
-                /* @__PURE__ */ o.jsx(
-                  K,
-                  {
-                    label: ln,
-                    variant: "primary",
-                    onClick: () => {
-                      d(!0), l();
-                    }
-                  }
-                )
-              ]
-            }
-          )
-        }
-      )
-    }
-  );
-}
-const cn = i.div`
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  z-index: 10;
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  background: ${m.overlayDark};
-  .fade {
-    animation: ${(e) => gn(e)} 0.25s linear;
-  }
-`, dn = ({ windowSize: e }) => no`
-  0% {
-    top: 100%;
-  }
-  100% {
-    top: ${J.containerTop.valuePercentage(e)};
-  }
-`, gn = ({ windowSize: e }) => no`
-  0% {
-    top: ${J.containerTop.valuePercentage(e)};
-  }
-  100% {
-    top: 100%;
-  }
-`, pn = 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) => dn(e)} 0.25s linear;
-  box-shadow: ${m.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%"};
-  }
-`, hn = i(Eo)`
-  margin-bottom: ${n.sp6};
-  color: ${m.important};
-  padding: ${n.sp0} ${n.sp6};
-`, ie = i.div`
-  margin-right: 12px;
-  height: ${n.sp7};
-  width: ${n.sp7};
-  background-color: ${(e) => e.theme.mode === "dark" ? m.brandColorJadeDark : m.brandColorJadeLight};
-  border-radius: ${n.sp4};
-  display: flex;
-  align-items: center;
-  justify-content: center;
-`, te = i(eo)`
-  width: calc(100% - 120px);
-  color: ${(e) => e.theme.colors.primary};
-  text-align: start;
-`, re = i.div`
-  display: flex;
-  align-items: center;
-  margin-bottom: ${n.sp5};
-`, pe = (e) => oo`
-  width: ${n.sp4};
-  height: ${n.sp4};
-  color: ${e.theme.colors.primary};
-`, mn = i(Ye)`
-  ${pe};
-`, un = i(Ao)`
-  ${pe};
-`, xn = i(Lo)`
-  ${pe};
-`, fn = i(zo)`
-  word-break: break-all;
-`, wn = i.div`
-  padding: ${n.sp0} ${n.sp6};
-`, r = I.getLocalizedStrings(), he = {
-  signInHeading: new Be("h5Regular", "h2Regular"),
-  signInMessage: new Be("standardRegular", "h6Regular")
-}, T = {
-  ZeniLogoContainerLeftMargin: new v(z[0], z[5]),
-  ZeniLogoContainerTopMargin: new v(12, z[3]),
-  SignInHeadingMarginBottom: new v(z[2], z[3]),
-  headingContainerTopMargin: new v(36, 10),
-  signInContainerPaddingTop: new v(z[12], z[4]),
-  emailInputFontSize: new v(
-    N.standardRegular.fontSizeValue,
-    N.extraLargeRegular.fontSizeValue
-  ),
-  emailInputVerticalPadding: new v(z[3], 12)
-}, $n = 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%;
-`, De = i.div`
-  width: ${(e) => e.windowSize === "small" ? "118px" : "247px"};
-  height: 1px;
-  background-color: ${(e) => e.theme.colors.grey2};
-  flex-shrink: 0;
-`, yn = i(eo)`
-  text-transform: capitalize;
-  color: ${(e) => e.theme.colors.hero};
-  flex-shrink: 0;
-`, Cn = i.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: ${n.sp2};
-  width: 100%;
-`, Sn = i.button`
-  background: none;
-  border: none;
-  padding: 0;
-  cursor: pointer;
-  display: inline-block;
-  position: relative;
-  color: ${(e) => e.theme.colors.hero};
-  text-decoration: none;
-  ${N.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;
-  }
-`, jn = i(ge)`
-  color: ${(e) => e.theme.colors.hero};
-  text-align: center;
-  visibility: ${(e) => e.isVisible ? "visible" : "hidden"};
-`, vn = i.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 1px;
-`, In = 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;
-`, bn = 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};
-`, Ae = i(de)`
-  ${(e) => `${he.signInHeading.style(e.windowSize)}`};
-  color: ${(e) => e.theme.colors.primary};
-  text-align: center;
-`, Ve = i(de)`
-  ${(e) => `${he.signInMessage.style(e.windowSize)}`};
-  color: ${(e) => e.theme.colors.champion};
-  text-align: center;
-`, Ne = i(ge)`
-  margin: ${n.sp0} ${n.sp0} ${n.sp0} ${n.sp0};
-  color: ${(e) => e.theme.colors.grey1};
-`, He = i(ge)`
-  margin: ${n.sp1} ${n.sp0} ${n.sp1} ${n.sp0};
-  color: ${(e) => e.theme.colors.hero};
-  text-decoration: none;
-`, kn = i(Fo)`
-  color: ${m.important};
-  text-align: center;
-  white-space: pre;
-`, En = i.div`
-  display: flex;
-  flex-direction: column;
-  row-gap: ${n.sp2};
-  flex-shrink: 0;
-  position: relative;
-  width: ${(e) => e.windowSize === "small" ? "100%" : "unset"};
-`, zn = i.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  background-color: ${(e) => e.theme.colors.grey5};
-  border: 1px solid
-    ${(e) => e.hasError ? m.important : e.theme.colors.grey1};
-  border-radius: ${n.sp2};
-  padding-top: ${(e) => T.emailInputVerticalPadding.valuePx(e.windowSize)};
-  padding-bottom: ${(e) => T.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 ? m.important : e.theme.colors.primary};
-  }
-`, Ln = i(Co, {
-  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) => T.emailInputFontSize.valuePx(e.windowSize)};
-    color: ${(e) => e.isValid ? e.theme.colors.primary : m.important};
-    height: auto;
-
-    &::placeholder {
-      color: ${(e) => e.theme.colors.grey1};
-      opacity: 1;
-    }
-  }
-`, Mn = i(ae)`
-  color: ${m.important};
-  text-align: center;
-  width: 100%;
-`, Ze = i.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: ${n.sp3};
-  width: 100%;
-`, Oe = i.div`
-  display: flex;
-  align-items: center;
-  gap: ${n.sp3};
-  background-color: ${(e) => e.isDarkTheme ? m.neutralGrey5Dark : m.brandColorJadeLight}80;
-  border-radius: 50px;
-  padding: 12px ${n.sp4};
-  box-sizing: border-box;
-`, Tn = i(Ye)`
-  width: ${n.sp3};
-  height: ${n.sp3};
-  color: ${(e) => e.theme.colors.brandColorSapphire};
-  flex-shrink: 0;
-`, Pn = i.div`
-  width: ${n.sp4};
-  height: ${n.sp4};
-  background-color: ${m.neutralGrey5Light};
-  border: 1px solid ${(e) => e.theme.colors.brandColorJade};
-  border-radius: 50%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-shrink: 0;
-`, Ge = i(_o)`
-  color: ${(e) => e.isDarkTheme ? m.brandColorJadeLight : e.theme.colors.brandColorSapphire};
-  flex: 1;
-`, We = i(Bo)`
-  color: ${(e) => e.theme.colors.primary};
-`, Ue = i.span``, Je = i(ae)`
-  color: ${(e) => e.theme.colors.hero};
-  text-align: center;
-`, qe = i.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  width: ${(e) => e.windowSize === "small" ? "100%" : "unset"};
-  margin-top: ${(e) => T.signInContainerPaddingTop.valuePx(e.windowSize)};
-`, _n = 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%;
-`, Bn = 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%;
-`, Fn = i.div`
-  width: 100%;
-`, Ke = i.div`
-  margin-top: ${(e) => T.headingContainerTopMargin.valuePx(e.windowSize)};
-  row-gap: ${(e) => e.isMagicLinkSent ? e.windowSize === "small" ? "150px" : n.sp4 : n.sp2};
-  flex-direction: column;
-`, Rn = i.div`
-  display: flex;
-  flex-direction: column;
-  display: flex;
-  width: 100%;
-  margin-left: ${(e) => T.ZeniLogoContainerLeftMargin.valuePx(e.windowSize)};
-  margin-top: ${(e) => T.ZeniLogoContainerTopMargin.valuePx(e.windowSize)};
-  justify-content: ${(e) => e.windowSize === "small" ? "center" : "start"};
-
-  .zeni-logo {
-    align-self: ${(e) => e.windowSize === "small" ? "center" : "self-start"};
-  }
-`, Dn = i(Po)`
-  color: ${(e) => e.theme.colors.primary};
-  height: ${n.sp4};
-`, An = i.div`
-  width: 100%;
-`, Vn = i.div`
-  width: 1167px;
-  height: 384px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  overflow: visible;
-`, Nn = i.form``, Hn = i(K)`
-  padding: ${n.sp2} ${n.sp3};
-`, Zn = i(K)`
-  &:disabled {
-    border-color: ${(e) => e.theme.colors.grey2};
-  }
-`;
-function Xe({
-  resendCountdown: e,
-  onClick: l
-}) {
-  return /* @__PURE__ */ o.jsx(
-    Zn,
-    {
-      variant: "primary",
-      label: e > 0 ? r.signIn.magicLinkSent.resendLinkCountdown.replace(
-        "__seconds__",
-        String(e)
-      ) : r.signIn.magicLinkSent.resendLink,
-      disabled: e > 0,
-      onClick: l
-    }
-  );
-}
-const On = i.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  gap: ${n.sp4};
-  flex: 1;
-`, Gn = i(de)`
-  ${(e) => `${he.signInHeading.style(e.windowSize)}`};
-  color: ${(e) => e.theme.colors.primary};
-  text-align: center;
-`, Qe = 45;
-function oi({
-  googleClientId: e,
-  microsoftClientId: l,
-  fetchState: c,
-  signInError: g = {},
-  showEmailLogin: d = !1,
-  sendMagicLinkStatus: s,
-  magicLinkExpired: h,
-  magicLinkExpiredEmail: p,
-  getSignedInUser: x,
-  onSignedInCallback: b,
-  clearSignInError: S,
-  onOAuthSuccess: y,
-  onOAuthError: P,
-  sendMagicLink: k
-}) {
-  const a = q(), { dark: E } = Mo(), { analytics: R } = ce(), X = Vo(0.68, 1.3, 1440, 2560), _ = c === "In-Progress", D = c === "Error", [Q, f] = j(void 0), [u, H] = j(""), [Z, Y] = j(!1), [O, G] = j(!1), [L, ro] = j(void 0), [w, me] = j(!1), ue = c === "In-Progress" && u === "google", xe = c === "In-Progress" && u === "microsoft", fe = $o({
-    mode: "onSubmit",
-    defaultValues: {
-      email: ""
-    }
-  }), {
-    register: so,
-    handleSubmit: lo,
-    formState: { errors: we },
-    setValue: $e,
-    watch: ao,
-    clearErrors: co
-  } = fe, W = s.fetchState === "Error" && s.error?.error?.type === "email_not_found", ye = s.fetchState === "Error" && s.error?.details?.application_error_code !== "LOGIN_VIA_EMAIL_LOCKED" && !W, A = ao("email"), Ce = !!we.email || O || ye, Se = !!we.email;
-  F(() => {
-    h === !0 && p != null && p.trim() !== "" && $e("email", p);
-  }, [h, p, $e]), F(() => {
-    d && s.fetchState === "Error" && s.error?.details?.application_error_code === "LOGIN_VIA_MAGIC_LINK_RESTRICTED" && (me(!1), ro(() => {
-      const t = s.error?.details?.domain_type;
-      if (t === "google" || t === "microsoft")
-        return t;
-    }));
-  }, [
-    s.error?.details,
-    s.fetchState,
-    d
-  ]);
-  const go = (t) => {
-    G(!1), t.email.trim() && (R.trackSignInClick("email"), k?.(t.email));
-  }, po = () => {
-    G(!1), co("email");
-  }, je = D && g.type === "email_not_found";
-  F(() => {
-    (je || W) && Y(!0);
-  }, [W, je]);
-  const ve = (t) => {
-    console.log(JSON.stringify(t)), f(void 0), y(t.code, "google"), H("google");
-  }, Ie = (t) => {
-    const M = "Error = " + t?.error + " Error Description = " + t?.error_description;
-    f(M), P?.(JSON.stringify(t), "google");
-  }, be = (t) => {
-    console.log(JSON.stringify(t)), f(void 0), y(t.code, "microsoft"), H("microsoft");
-  }, ke = (t) => {
-    console.log(JSON.stringify(t)), f(t.error ?? "Microsoft authorization failed."), P?.(JSON.stringify(t), "microsoft");
-  }, ho = () => {
-    let t = "";
-    return (D || Q != null) && Z === !1 && (t = Q ?? r.signIn.signInAuthError), t;
-  }, Ee = s.fetchState === "Completed" ? r.signIn.confirmationLinkSent : r.signIn.heading, ze = L != null ? r.signIn.signInSecurelyMessage : r.signIn.message, C = s.fetchState === "Completed", mo = h === !0 && !C, uo = () => {
-    p != null && p.trim() !== "" && k?.(p);
-  }, [V, ee] = j(0);
-  F(() => {
-    C && ee(Qe);
-  }, [C]), F(() => {
-    if (V <= 0)
-      return;
-    const t = setTimeout(
-      () => ee(V - 1),
-      1e3
-    );
-    return () => clearTimeout(t);
-  }, [V]);
-  const Le = () => {
-    k?.(A), ee(Qe);
-  }, xo = W && s.error?.error ? s.error.error : g, oe = s.error?.details?.user, Me = oe?.first_name ?? void 0, Te = oe?.photo?.original != null ? se(oe.photo.original) : void 0;
-  return /* @__PURE__ */ o.jsxs(In, { windowSize: a, children: [
-    /* @__PURE__ */ o.jsxs(bn, { windowSize: a, children: [
-      /* @__PURE__ */ o.jsxs(An, { children: [
-        /* @__PURE__ */ o.jsx(Rn, { windowSize: a, children: /* @__PURE__ */ o.jsx(Dn, { className: "zeni-logo" }) }),
-        mo ? /* @__PURE__ */ o.jsx(qe, { windowSize: a, style: { flex: 1 }, children: /* @__PURE__ */ o.jsxs(On, { children: [
-          /* @__PURE__ */ o.jsx(Gn, { windowSize: a, children: r.signIn.magicLinkExpiredHeading }),
-          /* @__PURE__ */ o.jsx(
-            K,
-            {
-              variant: "primary",
-              label: r.signIn.requestNewLink,
-              onClick: uo,
-              loading: s.fetchState === "In-Progress"
-            }
-          )
-        ] }) }) : /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
-          /* @__PURE__ */ o.jsxs(
-            Ke,
-            {
-              isMagicLinkSent: C,
-              windowSize: a,
-              style: { display: a === "small" ? "flex" : "none" },
-              children: [
-                /* @__PURE__ */ o.jsx(Ae, { windowSize: a, children: Ee }),
-                /* @__PURE__ */ o.jsx(B, { controller: !C, children: /* @__PURE__ */ o.jsx(Ve, { windowSize: a, children: ze }) }),
-                /* @__PURE__ */ o.jsx(B, { controller: C, children: /* @__PURE__ */ o.jsxs(Ze, { children: [
-                  /* @__PURE__ */ o.jsx(Oe, { isDarkTheme: E, children: /* @__PURE__ */ o.jsx(Ge, { isDarkTheme: E, children: I.getLocalizedStrings().signIn.magicLinkSent.primaryMessage.split(
-                    "__email__"
-                  ).map((t, M, ne) => /* @__PURE__ */ o.jsxs(Ue, { children: [
-                    t,
-                    M < ne.length - 1 && /* @__PURE__ */ o.jsx(We, { children: A })
-                  ] }, M)) }) }),
-                  /* @__PURE__ */ o.jsx(Je, { children: r.signIn.magicLinkSent.secondaryMessage }),
-                  /* @__PURE__ */ o.jsx(
-                    Xe,
-                    {
-                      resendCountdown: V,
-                      onClick: Le
-                    }
-                  )
-                ] }) })
-              ]
-            }
-          ),
-          /* @__PURE__ */ o.jsxs(
-            Ke,
-            {
-              isMagicLinkSent: C,
-              windowSize: a,
-              style: {
-                display: a === "small" ? "none" : "flex"
-              },
-              children: [
-                /* @__PURE__ */ o.jsx(Ae, { windowSize: a, children: Ee }),
-                /* @__PURE__ */ o.jsx(B, { controller: !C, children: /* @__PURE__ */ o.jsx(Ve, { windowSize: a, children: ze }) }),
-                /* @__PURE__ */ o.jsx(B, { controller: C, children: /* @__PURE__ */ o.jsxs(Ze, { children: [
-                  /* @__PURE__ */ o.jsxs(Oe, { isDarkTheme: E, children: [
-                    /* @__PURE__ */ o.jsx(Pn, { children: /* @__PURE__ */ o.jsx(Tn, {}) }),
-                    /* @__PURE__ */ o.jsx(Ge, { isDarkTheme: E, children: I.getLocalizedStrings().signIn.magicLinkSent.primaryMessage.split(
-                      "__email__"
-                    ).map((t, M, ne) => /* @__PURE__ */ o.jsxs(Ue, { children: [
-                      t,
-                      M < ne.length - 1 && /* @__PURE__ */ o.jsx(We, { children: A })
-                    ] }, M)) })
-                  ] }),
-                  /* @__PURE__ */ o.jsx(Je, { children: r.signIn.magicLinkSent.secondaryMessage }),
-                  /* @__PURE__ */ o.jsx(
-                    Xe,
-                    {
-                      resendCountdown: V,
-                      onClick: Le
-                    }
-                  )
-                ] }) })
-              ]
-            }
-          ),
-          /* @__PURE__ */ o.jsx(B, { controller: !C, children: /* @__PURE__ */ o.jsxs(qe, { windowSize: a, children: [
-            /* @__PURE__ */ o.jsxs(
-              _n,
-              {
-                showEmailError: Ce,
-                showEmailForm: w,
-                children: [
-                  !w && !L && /* @__PURE__ */ o.jsxs(Bn, { windowSize: a, children: [
-                    /* @__PURE__ */ o.jsx(Pe, { clientId: e, children: /* @__PURE__ */ o.jsx(
-                      Fe,
-                      {
-                        disabled: _,
-                        inProgress: ue,
-                        getSignedInUser: x,
-                        onSuccess: ve,
-                        onSignedInCallback: b,
-                        onError: Ie
-                      }
-                    ) }),
-                    /* @__PURE__ */ o.jsx(
-                      Re,
-                      {
-                        clientId: l,
-                        scopes: [
-                          "openid",
-                          "profile",
-                          "email",
-                          "offline_access",
-                          "User.Read"
-                        ],
-                        getSignedInUser: x,
-                        prompt: "select_account",
-                        responseType: "code",
-                        responseMode: "query",
-                        render: (t) => /* @__PURE__ */ o.jsx(
-                          le,
-                          {
-                            onClick: t.onClick,
-                            disabled: _ || t.disabled,
-                            type: "Microsoft",
-                            titleText: r.signIn.signInMicrosoftButton,
-                            loadingIndication: xe
-                          }
-                        ),
-                        onSignedInCallback: b,
-                        onSuccess: be,
-                        onFailure: ke
-                      }
-                    )
-                  ] }),
-                  !w && L === "google" && /* @__PURE__ */ o.jsx(Pe, { clientId: e, children: /* @__PURE__ */ o.jsx(
-                    Fe,
-                    {
-                      disabled: _,
-                      inProgress: ue,
-                      email: A,
-                      firstName: Me,
-                      photo: Te,
-                      getSignedInUser: x,
-                      onSuccess: ve,
-                      onSignedInCallback: b,
-                      onError: Ie
-                    }
-                  ) }),
-                  !w && L === "microsoft" && /* @__PURE__ */ o.jsx(
-                    Re,
-                    {
-                      clientId: l,
-                      scopes: [
-                        "openid",
-                        "profile",
-                        "email",
-                        "offline_access",
-                        "User.Read"
-                      ],
-                      getSignedInUser: x,
-                      prompt: "select_account",
-                      responseType: "code",
-                      responseMode: "query",
-                      render: (t) => /* @__PURE__ */ o.jsx(
-                        le,
-                        {
-                          onClick: t.onClick,
-                          disabled: _ || t.disabled,
-                          type: "Microsoft",
-                          titleText: r.signIn.signInMicrosoftButton,
-                          loadingIndication: xe,
-                          email: A,
-                          firstName: Me,
-                          photo: Te
-                        }
-                      ),
-                      onSignedInCallback: b,
-                      onSuccess: be,
-                      onFailure: ke
-                    }
-                  ),
-                  d && w && /* @__PURE__ */ o.jsx(yo, { ...fe, children: /* @__PURE__ */ o.jsxs(En, { windowSize: a, children: [
-                    /* @__PURE__ */ o.jsx(Nn, { onSubmit: lo(go), children: /* @__PURE__ */ o.jsxs(
-                      zn,
-                      {
-                        windowSize: a,
-                        hasError: Se,
-                        children: [
-                          /* @__PURE__ */ o.jsx(
-                            Ln,
-                            {
-                              windowSize: a,
-                              type: "text",
-                              placeholder: r.signIn.workEmailExample,
-                              variant: "outlined",
-                              fullWidth: !0,
-                              isValid: !Se,
-                              autoComplete: "off",
-                              ...so("email", {
-                                required: r.signIn.invalidEmailMessage,
-                                pattern: {
-                                  value: To,
-                                  message: r.signIn.invalidEmailMessage
-                                },
-                                onChange: po
-                              })
-                            }
-                          ),
-                          /* @__PURE__ */ o.jsx(
-                            Hn,
-                            {
-                              variant: "primary",
-                              type: "submit",
-                              label: r.signIn.signInButton,
-                              loading: s.fetchState === "In-Progress"
-                            }
-                          )
-                        ]
-                      }
-                    ) }),
-                    Ce && /* @__PURE__ */ o.jsx(Mn, { children: O ? r.signIn.magicLinkExpired : ye ? r.common.errorMessage.somethingWentWrongPleaseTryAgain : r.signIn.invalidEmailMessage })
-                  ] }) }),
-                  d && !L && /* @__PURE__ */ o.jsxs(Cn, { children: [
-                    /* @__PURE__ */ o.jsxs(
-                      $n,
-                      {
-                        showEmailForm: w,
-                        windowSize: a,
-                        children: [
-                          /* @__PURE__ */ o.jsx(
-                            De,
-                            {
-                              showEmailForm: w,
-                              windowSize: a
-                            }
-                          ),
-                          /* @__PURE__ */ o.jsx(yn, { children: r.common.texts.or.toUpperCase() }),
-                          /* @__PURE__ */ o.jsx(
-                            De,
-                            {
-                              showEmailForm: w,
-                              windowSize: a
-                            }
-                          )
-                        ]
-                      }
-                    ),
-                    /* @__PURE__ */ o.jsxs(vn, { children: [
-                      /* @__PURE__ */ o.jsx(
-                        Sn,
-                        {
-                          onClick: () => {
-                            w ? R.trackSignInViaGoogleMicrosoft() : R.trackSignInViaEmail(), me(!w);
-                          },
-                          children: w ? r.signIn.googleOrMicrosoftLink : r.signIn.workEmailLink
-                        }
-                      ),
-                      /* @__PURE__ */ o.jsx(jn, { isVisible: !w, children: r.signIn.workEmailSubText })
-                    ] })
-                  ] })
-                ]
-              }
-            ),
-            Z === !1 && D && /* @__PURE__ */ o.jsx(Fn, { children: /* @__PURE__ */ o.jsx(kn, { children: ho() }) })
-          ] }) })
-        ] })
-      ] }),
-      /* @__PURE__ */ o.jsx(B, { controller: a !== "small", children: /* @__PURE__ */ o.jsx(Vn, { children: /* @__PURE__ */ o.jsx(Do, { scale: X }) }) }),
-      /* @__PURE__ */ o.jsx(
-        Ne,
-        {
-          style: {
-            maxWidth: "100%",
-            textAlign: "center",
-            marginBottom: a === "small" ? n.sp5 : n.sp1
-          },
-          children: /* @__PURE__ */ o.jsxs(Ne, { children: [
-            /* @__PURE__ */ o.jsxs(He, { children: [
-              r.signIn.termsPrivacyFinePrintPart,
-              r.signIn.agreeWith,
-              /* @__PURE__ */ o.jsx(
-                _e,
-                {
-                  href: r.signIn.termsUrl,
-                  target: "_Blank",
-                  rel: "noopener noreferrer",
-                  linkText: r.signIn.termsOfService
-                }
-              ),
-              " ",
-              r.signIn.and,
-              " ",
-              /* @__PURE__ */ o.jsx(
-                _e,
-                {
-                  href: r.signIn.privacyPolicyUrl,
-                  target: "_Blank",
-                  rel: "noopener noreferrer",
-                  linkText: r.signIn.privacyPolicy
-                }
-              ),
-              "."
-            ] }),
-            /* @__PURE__ */ o.jsx(He, { children: /* @__PURE__ */ o.jsx(Ro, {}) })
-          ] })
-        }
-      )
-    ] }),
-    Z && /* @__PURE__ */ o.jsx(
-      an,
-      {
-        signInError: xo,
-        onClose: () => {
-          S(), Y(!1);
-        }
-      }
-    )
-  ] });
-}
-export {
-  oi as default
-};