@zeniai/web-components 3.16.43 → 3.16.45

package/dist/PromoBaseCards-DiefKKcS.js

@@ -0,0 +1,356 @@
+import { j as s } from "./vendor-.pnpm-BZbZ6JJC.js";
+import { css as a, keyframes as c } from "@emotion/react";
+import p from "@emotion/styled";
+import { u as f, f_ as b, f$ as L, g0 as S, eO as z, R as i, S as o, C as d, av as m, D as h } from "./index-CvyHeUzo.js";
+const e = {
+  plasticCardMarginLeft: new i(h[6], 120),
+  plasticCardMarginTop: new i(12, -9),
+  businessTextRight: new i(h[2], 13),
+  businessTextBottom: new i(h[8], 81),
+  chargeCardWidth: new i(240, 384),
+  chargeCardHeight: new i(153, 243),
+  styledLogoWidth: new i(47, 76),
+  styledLogoHeight: new i(46, 74),
+  styledFullLogoTop: new i(12, 28),
+  styledFullLogoRight: new i(h[2], 13),
+  styledFullLogoHeight: new i(20, 34),
+  styledFullLogoWidth: new i(88, 142),
+  chipLogoWidth: new i(31, 50),
+  chipLogoHeight: new i(h[4], 39),
+  visaLogoWidth: new i(52, 84),
+  visaLogoHeight: new i(17, 27),
+  visaLogoRight: new i(h[2], 13),
+  visaLogoBottom: new i(h[2], 13)
+}, u = {
+  businessText: new m("extraSmallRegular", "largeRegular"),
+  promoBusinessText: new m("tinyLight", "tinyLight")
+}, J = ({
+  cardText: t,
+  shouldAnimate: g,
+  showChip: x,
+  forDashboard: r,
+  forListPage: l,
+  cardPromoType: $,
+  style: w
+}) => {
+  const n = f();
+  return /* @__PURE__ */ s.jsxs(
+    R,
+    {
+      cardPromoType: $,
+      windowSize: n,
+      shouldAnimate: g,
+      forListPage: l,
+      forDashboard: r,
+      style: w,
+      children: [
+        x && /* @__PURE__ */ s.jsx(y, { windowSize: n, forDashboard: r, children: /* @__PURE__ */ s.jsx(b, {}) }),
+        /* @__PURE__ */ s.jsx(
+          T,
+          {
+            windowSize: n,
+            forDashboard: r,
+            forListPage: l,
+            children: /* @__PURE__ */ s.jsx(z, {})
+          }
+        ),
+        /* @__PURE__ */ s.jsx(
+          v,
+          {
+            windowSize: n,
+            forDashboard: r,
+            forListPage: l,
+            children: t
+          }
+        ),
+        /* @__PURE__ */ s.jsx(
+          C,
+          {
+            windowSize: n,
+            forDashboard: r,
+            forListPage: l,
+            children: /* @__PURE__ */ s.jsx(S, {})
+          }
+        )
+      ]
+    }
+  );
+}, N = ({
+  cardText: t,
+  shouldAnimate: g,
+  showChip: x,
+  forDashboard: r,
+  forListPage: l,
+  cardPromoType: $,
+  style: w
+}) => {
+  const n = f();
+  return /* @__PURE__ */ s.jsxs(
+    W,
+    {
+      cardPromoType: $,
+      windowSize: n,
+      shouldAnimate: g,
+      forListPage: l,
+      forDashboard: r,
+      style: w,
+      children: [
+        x && /* @__PURE__ */ s.jsx(y, { windowSize: n, forDashboard: r, children: /* @__PURE__ */ s.jsx(b, {}) }),
+        /* @__PURE__ */ s.jsx(
+          k,
+          {
+            windowSize: n,
+            forDashboard: r,
+            forListPage: l,
+            children: /* @__PURE__ */ s.jsx(L, {})
+          }
+        ),
+        /* @__PURE__ */ s.jsx(
+          v,
+          {
+            windowSize: n,
+            forDashboard: r,
+            forListPage: l,
+            children: t
+          }
+        ),
+        /* @__PURE__ */ s.jsx(
+          C,
+          {
+            windowSize: n,
+            forDashboard: r,
+            forListPage: l,
+            children: /* @__PURE__ */ s.jsx(S, {})
+          }
+        )
+      ]
+    }
+  );
+}, P = c`
+   0%{
+    transform: rotate(12.4deg);
+    translate: ${o.sp0} ${o.sp0};
+  }
+  14.25%{
+    transform: rotate(12.4deg);
+    translate: ${o.sp0} ${o.sp0};
+  }
+  35.75%{
+    transform: rotate(6.004deg);
+    translate: 20px ${o.sp0};
+  }
+  64.25%{
+    transform: rotate(6.004deg);
+    translate: 20px ${o.sp0};
+  }
+  85.75%{
+    transform: rotate(12.4deg);
+    translate: ${o.sp0} ${o.sp0};
+  }
+  100%{
+    transform: rotate(12.4deg);
+    translate: ${o.sp0} ${o.sp0};
+  }
+`, j = c`
+   0%{
+    transform: rotate(12.4deg);
+    translate: ${o.sp0} ${o.sp0};
+  }
+  14.25%{
+    transform: rotate(12.4deg);
+    translate: ${o.sp0} ${o.sp0};
+  }
+  35.75%{
+    transform: rotate(6.004deg);
+    translate: ${o.sp11} ${o.sp0};
+  }
+  64.25%{
+    transform: rotate(6.004deg);
+    translate: ${o.sp11} ${o.sp0};
+  }
+  85.75%{
+    transform: rotate(12.4deg);
+    translate: ${o.sp0} ${o.sp0};
+  }
+  100%{
+    transform: rotate(12.4deg);
+    translate: ${o.sp0} ${o.sp0};
+  }
+`, B = c`
+  0%{
+    transform: rotate(0);
+    transform-origin: top left;
+    box-shadow: 2px ${o.sp1} ${o.sp3} ${o.sp0} ${d.chargeCardBoxShadow2};
+  }
+  14.25%{
+    transform: rotate(0);
+    transform-origin: top left;
+    box-shadow: 2px ${o.sp1} ${o.sp3} ${o.sp0} ${d.chargeCardBoxShadow2};
+  }
+  35.75%{
+    transform: rotate(-5.31deg);
+    transform-origin: top left;
+    box-shadow: 12px 12px ${o.sp5} ${o.sp0} ${d.chargeCardBoxShadow2};
+  }
+  64.25%{
+    transform: rotate(-5.31deg);
+    transform-origin: top left;
+    box-shadow: 12px 12px ${o.sp5} ${o.sp0} ${d.chargeCardBoxShadow2};
+  }
+  85.75%{
+    transform: rotate(0);
+    transform-origin: top left;
+    box-shadow: 2px ${o.sp1} ${o.sp3} ${o.sp0} ${d.chargeCardBoxShadow2};
+  }
+  100%{
+    transform: rotate(0);
+    transform-origin: top left;
+    box-shadow: 2px ${o.sp1} ${o.sp3} ${o.sp0} ${d.chargeCardBoxShadow2};
+  }
+`, T = p.div`
+  color: ${(t) => t.theme.colors.brandColorJade};
+  width: ${(t) => e.styledLogoWidth.valuePx(t.windowSize)};
+  height: ${(t) => e.styledLogoHeight.valuePx(t.windowSize)};
+  ${(t) => t.forDashboard ? a`
+          width: 38px;
+          height: 38px;
+        ` : null}
+  ${(t) => t.forListPage ? a`
+          width: 28px;
+          height: 28px;
+        ` : null}
+`, v = p.div`
+  color: ${d.neutralGrey5Light};
+  text-align: right;
+  ${(t) => `${u.businessText.style(t.windowSize)}`};
+  text-transform: capitalize;
+  position: absolute;
+  right: ${(t) => e.businessTextRight.valuePx(t.windowSize)};
+  bottom: ${(t) => e.businessTextBottom.valuePx(t.windowSize)};
+  ${(t) => t.forDashboard ? a`
+          top: 61px;
+          ${u.promoBusinessText.style(t.windowSize)};
+          right: 6px;
+        ` : null}
+  ${(t) => t.forListPage ? a`
+          top: 53px;
+          left: 95px;
+          ${u.promoBusinessText.style(t.windowSize)};
+        ` : null}
+`, y = p.div`
+  position: absolute;
+  left: 11%;
+  bottom: 50%;
+  width: ${(t) => e.chipLogoWidth.valuePx(t.windowSize)};
+  height: ${(t) => e.chipLogoHeight.valuePx(t.windowSize)};
+  ${(t) => t.forDashboard ? a`
+          width: 20px;
+          height: ${o.sp3};
+        ` : null}
+`, C = p.div`
+  width: ${(t) => e.visaLogoWidth.valuePx(t.windowSize)};
+  height: ${(t) => e.visaLogoHeight.valuePx(t.windowSize)};
+  position: absolute;
+  right: ${(t) => e.visaLogoRight.valuePx(t.windowSize)};
+  bottom: ${(t) => e.visaLogoBottom.valuePx(t.windowSize)};
+  ${(t) => t.forDashboard ? a`
+          width: 41px;
+          height: 14px;
+          bottom: ${o.sp2};
+          right: 6px;
+        ` : null}
+  ${(t) => t.forListPage ? a`
+          width: ${o.sp5};
+          height: 10px;
+          bottom: ${o.sp1};
+        ` : null}
+`, k = p.div`
+  position: absolute;
+  right: ${(t) => e.styledFullLogoRight.valuePx(t.windowSize)};
+  top: ${(t) => e.styledFullLogoTop.valuePx(t.windowSize)};
+  height: ${(t) => e.styledFullLogoHeight.valuePx(t.windowSize)};
+  width: ${(t) => e.styledFullLogoWidth.valuePx(t.windowSize)};
+  color: ${d.neutralGrey5Light};
+  ${(t) => t.forDashboard ? a`
+          width: 70px;
+          height: ${o.sp3};
+          top: 14px;
+          right: 6px;
+        ` : null}
+  ${(t) => t.forListPage ? a`
+          width: ${o.sp7};
+          height: 12px;
+          top: 11px;
+        ` : null}
+`, R = p.div`
+  width: ${(t) => e.chargeCardWidth.valuePx(t.windowSize)};
+  height: ${(t) => e.chargeCardHeight.valuePx(t.windowSize)};
+  background: ${(t) => t.cardPromoType === "debit" ? t.theme.colors.brandColorOnyx : t.theme.colors.brandColorSapphire};
+  border-radius: ${o.sp2};
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-repeat: no-repeat;
+  background-image: url(https://storage.googleapis.com/zeni-apis.appspot.com/images/MetalCardPattern.svg);
+  transition-timing-function: ease-in-out;
+  border: 1px solid ${d.neutralGrey5Light};
+  background-position: center;
+  background-size: cover;
+  box-shadow: ${(t) => ` ${o.sp0} ${o.sp0} ${o.sp6} ${o.sp0} ${t.theme.colors.dropShadowNormal}`};
+  ${(t) => t.shouldAnimate ? a`
+          animation: ${B} 2800ms infinite;
+          z-index: 1;
+        ` : null}
+  ${(t) => t.forDashboard ? a`
+          width: 190px;
+          height: 121px;
+        ` : null}
+    ${(t) => t.forListPage ? a`
+          width: 144px;
+          height: 91px;
+          border-radius: 3px;
+          border-width: 0.1px;
+        ` : null}
+`, W = p.div`
+  width: ${(t) => e.chargeCardWidth.valuePx(t.windowSize)};
+  height: ${(t) => e.chargeCardHeight.valuePx(t.windowSize)};
+  background: ${(t) => t.cardPromoType === "debit" ? t.theme.colors.brandColorJadeDark : t.theme.colors.brandColorJade};
+  border-radius: ${o.sp2};
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-repeat: no-repeat;
+  background-position-y: bottom;
+  box-shadow: ${(t) => ` ${o.sp0} ${o.sp0} ${o.sp6} ${o.sp0} ${t.theme.colors.dropShadowNormal}`};
+  transition-timing-function: ease-in-out;
+  border: 1px solid ${d.neutralGrey5Light};
+  background-image: url(https://storage.googleapis.com/zeni-apis.appspot.com/images/PhysicalCardFrontBGPattern.svg);
+  background-size: cover;
+  ${(t) => {
+  if (t.shouldAnimate) {
+    const g = t.windowSize === "small" ? P : j;
+    return a`
+        position: absolute;
+        margin-left: ${e.plasticCardMarginLeft.valuePx(t.windowSize)};
+        margin-top: ${e.plasticCardMarginTop.valuePx(t.windowSize)};
+        transform: rotate(10.4deg);
+        animation: ${g} 2800ms infinite;
+      `;
+  }
+  return null;
+}}
+  ${(t) => t.forDashboard ? a`
+          width: 190px;
+          height: 121px;
+        ` : null}
+  ${(t) => t.forListPage ? a`
+          width: 144px;
+          height: 91px;
+          border-radius: 3px;
+          border-width: 0.1px;
+        ` : null}
+`;
+export {
+  J as M,
+  N as P
+};

package/dist/QBOConnectionDialog-CeLcUkXf.cjs

@@ -0,0 +1,51 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./vendor-.pnpm-DHyNpoQL.cjs"),t=require("@emotion/styled"),e=require("./index-8_ku3pKD.cjs"),u=require("./intuit-quick-books-logo-DkI-cY2w.cjs"),i={containerPaddingTop:new e.ResponsiveSized(e.sp[5],e.sp[7]),containerPaddingBottom:new e.ResponsiveSized(e.sp[5],e.sp[5]),containerPaddingLeftRight:new e.ResponsiveSized(e.sp[6],e.sp[11])},m=t.div`
+  border-radius: inherit;
+  max-width: 520px;
+  text-align: center;
+  background: ${n=>n.theme.colors.background};
+`,h=t.div`
+  padding-top: ${n=>i.containerPaddingTop.valuePx(n.windowSize)};
+  padding-bottom: ${n=>i.containerPaddingBottom.valuePx(n.windowSize)};
+  padding-right: ${n=>i.containerPaddingLeftRight.valuePx(n.windowSize)};
+  padding-left: ${n=>i.containerPaddingLeftRight.valuePx(n.windowSize)};
+`,j=t(e.H6Regular)`
+  color: ${n=>n.theme.colors.primary};
+  padding: ${e.Space.sp0} ${e.Space.sp0} ${e.Space.sp4};
+  min-width: 260px;
+`,S=t(e.StandardRegular)`
+  color: ${n=>n.theme.colors.hero};
+  max-width: 360px;
+`,R=t.div`
+  margin: 20px ${e.Space.sp0};
+`,$=t.div`
+  margin: 20px ${e.Space.sp0};
+`,w=t.hr`
+  width: 100%;
+  border: 0.2px solid ${n=>n.theme.colors.grey3};
+  margin-top: auto;
+  margin-bottom: 0;
+`,v=t.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: ${e.Space.sp4};
+`,y=t.div`
+  display: flex;
+  align-items: center;
+  gap: ${e.Space.sp4};
+  margin-left: ${e.Space.sp4};
+  justify-content: center;
+  padding-top: ${e.Space.sp3};
+  color: ${n=>n.theme.colors.primary};
+`,L=t(e.SvgZeniLogoFull)`
+  color: ${n=>n.theme.colors.primary};
+  height: 20px;
+  width: auto;
+`,P=t(e.SvgArrowTailRight)`
+  color: ${n=>n.theme.colors.hero};
+  height: ${e.Space.sp4};
+  width: ${e.Space.sp4};
+`,E=t(u.SvgIntuitQuickBooksLogo)`
+  height: ${e.Space.sp4};
+  color: ${n=>n.theme.colors.primary};
+`;function b({companyName:n="",isGoBackAllowed:r,isAdmin:s,saveConnectionState:a,isQBOPopupOpen:c=!0,handleOnConnectClick:p,handleGoBack:d}){const l=e.useWindowSizeContext(),x=e.appLocale.getLocalizedStrings().dashboardAccountingPage.adminInfoText.replace(n?"_company-name_":"‘_company-name_’",n),g=e.appLocale.getLocalizedStrings().dashboardAccountingPage.nonAdminInfoText.replace(n?"_company-name_":"‘_company-name_’",n);return o.jsxRuntimeExports.jsx(e.Modal,{open:c,children:o.jsxRuntimeExports.jsxs(m,{windowSize:l,children:[o.jsxRuntimeExports.jsxs(h,{children:[o.jsxRuntimeExports.jsx(j,{children:e.appLocale.getLocalizedStrings().dashboardAccountingPage.title}),o.jsxRuntimeExports.jsx(S,{children:s?x:g}),o.jsxRuntimeExports.jsxs(y,{children:[o.jsxRuntimeExports.jsx(L,{}),o.jsxRuntimeExports.jsx(P,{}),o.jsxRuntimeExports.jsx(E,{})]})]}),s||r?o.jsxRuntimeExports.jsxs(o.jsxRuntimeExports.Fragment,{children:[o.jsxRuntimeExports.jsx(w,{}),o.jsxRuntimeExports.jsxs(v,{children:[r===!0?o.jsxRuntimeExports.jsx($,{children:o.jsxRuntimeExports.jsx(e.Button,{variant:"secondary",label:e.appLocale.getLocalizedStrings().dashboardAccountingPage.goBack,onClick:d})}):null,s?o.jsxRuntimeExports.jsx(R,{children:o.jsxRuntimeExports.jsx(e.Button,{variant:"primary",label:e.appLocale.getLocalizedStrings().dashboardAccountingPage.connect,onClick:p,loading:a==="In-Progress"})}):null]})]}):null]})})}exports.default=b;

package/dist/QBOConnectionDialog-DV-xC7Yc.js

@@ -0,0 +1,115 @@
+import { j as o } from "./vendor-.pnpm-BZbZ6JJC.js";
+import t from "@emotion/styled";
+import { u as S, a, eW as w, B as l, R as d, S as e, V as j, p as f, d as P, W as v, D as i } from "./index-CvyHeUzo.js";
+import { S as y } from "./intuit-quick-books-logo-qyL3_3cm.js";
+const r = {
+  containerPaddingTop: new d(i[5], i[7]),
+  containerPaddingBottom: new d(i[5], i[5]),
+  containerPaddingLeftRight: new d(i[6], i[11])
+}, b = t.div`
+  border-radius: inherit;
+  max-width: 520px;
+  text-align: center;
+  background: ${(n) => n.theme.colors.background};
+`, B = t.div`
+  padding-top: ${(n) => r.containerPaddingTop.valuePx(n.windowSize)};
+  padding-bottom: ${(n) => r.containerPaddingBottom.valuePx(n.windowSize)};
+  padding-right: ${(n) => r.containerPaddingLeftRight.valuePx(n.windowSize)};
+  padding-left: ${(n) => r.containerPaddingLeftRight.valuePx(n.windowSize)};
+`, L = t(j)`
+  color: ${(n) => n.theme.colors.primary};
+  padding: ${e.sp0} ${e.sp0} ${e.sp4};
+  min-width: 260px;
+`, z = t(f)`
+  color: ${(n) => n.theme.colors.hero};
+  max-width: 360px;
+`, R = t.div`
+  margin: 20px ${e.sp0};
+`, T = t.div`
+  margin: 20px ${e.sp0};
+`, k = t.hr`
+  width: 100%;
+  border: 0.2px solid ${(n) => n.theme.colors.grey3};
+  margin-top: auto;
+  margin-bottom: 0;
+`, I = t.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: ${e.sp4};
+`, C = t.div`
+  display: flex;
+  align-items: center;
+  gap: ${e.sp4};
+  margin-left: ${e.sp4};
+  justify-content: center;
+  padding-top: ${e.sp3};
+  color: ${(n) => n.theme.colors.primary};
+`, _ = t(P)`
+  color: ${(n) => n.theme.colors.primary};
+  height: 20px;
+  width: auto;
+`, A = t(v)`
+  color: ${(n) => n.theme.colors.hero};
+  height: ${e.sp4};
+  width: ${e.sp4};
+`, W = t(y)`
+  height: ${e.sp4};
+  color: ${(n) => n.theme.colors.primary};
+`;
+function E({
+  companyName: n = "",
+  isGoBackAllowed: c,
+  isAdmin: s,
+  saveConnectionState: g,
+  isQBOPopupOpen: p = !0,
+  handleOnConnectClick: h,
+  handleGoBack: m
+}) {
+  const u = S(), x = a.getLocalizedStrings().dashboardAccountingPage.adminInfoText.replace(
+    n ? "_company-name_" : "‘_company-name_’",
+    n
+  ), $ = a.getLocalizedStrings().dashboardAccountingPage.nonAdminInfoText.replace(
+    n ? "_company-name_" : "‘_company-name_’",
+    n
+  );
+  return /* @__PURE__ */ o.jsx(w, { open: p, children: /* @__PURE__ */ o.jsxs(b, { windowSize: u, children: [
+    /* @__PURE__ */ o.jsxs(B, { children: [
+      /* @__PURE__ */ o.jsx(L, { children: a.getLocalizedStrings().dashboardAccountingPage.title }),
+      /* @__PURE__ */ o.jsx(z, { children: s ? x : $ }),
+      /* @__PURE__ */ o.jsxs(C, { children: [
+        /* @__PURE__ */ o.jsx(_, {}),
+        /* @__PURE__ */ o.jsx(A, {}),
+        /* @__PURE__ */ o.jsx(W, {})
+      ] })
+    ] }),
+    s || c ? /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+      /* @__PURE__ */ o.jsx(k, {}),
+      /* @__PURE__ */ o.jsxs(I, { children: [
+        c === !0 ? (
+          // Hide back button if user has access to only one tenant
+          /* @__PURE__ */ o.jsx(T, { children: /* @__PURE__ */ o.jsx(
+            l,
+            {
+              variant: "secondary",
+              label: a.getLocalizedStrings().dashboardAccountingPage.goBack,
+              onClick: m
+            }
+          ) })
+        ) : null,
+        s ? /* @__PURE__ */ o.jsx(R, { children: /* @__PURE__ */ o.jsx(
+          l,
+          {
+            variant: "primary",
+            label: a.getLocalizedStrings().dashboardAccountingPage.connect,
+            onClick: h,
+            loading: g === "In-Progress"
+          }
+        ) }) : null
+      ] })
+    ] }) : null
+  ] }) });
+}
+export {
+  E as default
+};

package/dist/QBOSetupSection-CI8cHWjq.js

@@ -0,0 +1,167 @@
+import { j as o, b as m } from "./vendor-.pnpm-BZbZ6JJC.js";
+import s from "@emotion/styled";
+import { u as C, a as u, B as W, S as t, R as l, C as a, hI as k, av as P, d as R, W as B, hG as E, G as $, D as n } from "./index-CvyHeUzo.js";
+import G from "./QBOConnectionDialog-DV-xC7Yc.js";
+import { S as L } from "./intuit-quick-books-logo-qyL3_3cm.js";
+const r = {
+  containerPadding: new l(n[3], n[4]),
+  sectionWidth: new l(343, 580, 726),
+  rowGap: new l(n[2], n[3]),
+  topElementsRowGap: new l(n[3], n[0]),
+  arrowIconWidthHeight: new l(n[3], n[4])
+}, D = {
+  title: new P("standardMedium", "largeMedium")
+}, te = ({
+  isAdmin: e,
+  hasError: d = !1,
+  isValid: c,
+  saveConnectionState: p,
+  isQBOPopupOpen: S,
+  companyName: y,
+  updateQBOPopupState: h,
+  handleOnConnectClick: j
+}) => {
+  const i = C(), { qbo_connection: f } = u.getLocalizedStrings().customerOnboardingPage.sections, { title: v, sucessText: b, button: z, errorText: I, requiredText: T } = f;
+  return /* @__PURE__ */ o.jsxs(Q, { windowSize: i, children: [
+    /* @__PURE__ */ o.jsxs(A, { windowSize: i, children: [
+      i === "small" ? /* @__PURE__ */ o.jsx(J, { children: c ? /* @__PURE__ */ o.jsx(K, {}) : /* @__PURE__ */ o.jsx(U, {}) }) : null,
+      /* @__PURE__ */ o.jsx(F, { windowSize: i, children: v })
+    ] }),
+    /* @__PURE__ */ o.jsxs(H, { windowSize: i, children: [
+      /* @__PURE__ */ o.jsxs(O, { windowSize: i, children: [
+        /* @__PURE__ */ o.jsxs(M, { children: [
+          /* @__PURE__ */ o.jsx(N, {}),
+          /* @__PURE__ */ o.jsx(Z, { windowSize: i }),
+          /* @__PURE__ */ o.jsx(_, {})
+        ] }),
+        c ? i !== "small" ? /* @__PURE__ */ o.jsx(x, {}) : null : /* @__PURE__ */ o.jsx(
+          W,
+          {
+            variant: "primary",
+            size: i !== "small" ? "standard" : "xs-small",
+            label: z.connect,
+            style: { width: "fit-content" },
+            onClick: () => h(!0),
+            loading: p === "In-Progress"
+          }
+        )
+      ] }),
+      c ? /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+        /* @__PURE__ */ o.jsx(q, { children: b }),
+        i === "small" ? /* @__PURE__ */ o.jsx(x, {}) : null
+      ] }) : null,
+      p === "Error" ? /* @__PURE__ */ o.jsx(g, { children: /* @__PURE__ */ o.jsx(w, { windowSize: i, children: I }) }) : null,
+      d && !c ? /* @__PURE__ */ o.jsx(g, { children: /* @__PURE__ */ o.jsx(w, { windowSize: i, children: T }) }) : null
+    ] }),
+    /* @__PURE__ */ o.jsx(
+      G,
+      {
+        isAdmin: e,
+        isGoBackAllowed: !0,
+        isQBOPopupOpen: S,
+        companyName: y,
+        saveConnectionState: p,
+        handleOnConnectClick: j,
+        handleGoBack: () => h(!1)
+      }
+    )
+  ] });
+}, x = () => {
+  const { tags: e } = u.getLocalizedStrings().customerOnboardingPage, { connected: d } = e;
+  return /* @__PURE__ */ o.jsx(
+    E,
+    {
+      style: {
+        width: "max-content",
+        padding: 0,
+        marginTop: t.sp2
+      },
+      tagTitle: d,
+      textColor: {
+        color: new m(a.successDark),
+        borderColor: new m(a.successDark)
+      }
+    }
+  );
+}, Q = s.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+`, A = s.div`
+  display: flex;
+  align-items: center;
+  padding-top: ${t.sp3};
+  padding-bottom: ${t.sp3};
+  width: ${(e) => r.sectionWidth.valuePx(e.windowSize)};
+`, F = s.div`
+  display: flex;
+  align-items: center;
+  color: ${(e) => e.theme.colors.primary};
+  ${(e) => `${D.title.style(e.windowSize)}`};
+`, H = s.div`
+  display: flex;
+  flex-direction: column;
+  width: ${(e) => r.sectionWidth.valuePx(e.windowSize)};
+  background-color: ${(e) => e.theme.colors.grey5};
+  border: 1px solid ${(e) => e.theme.colors.grey3};
+  box-shadow: ${(e) => `${t.sp0} 2px ${t.sp1} ${e.theme.colors.dropShadowNormal}`};
+  border-radius: ${t.sp2};
+  fill: ${(e) => e.theme.colors.grey1};
+  justify-content: space-between;
+  box-sizing: border-box;
+  padding: ${(e) => r.containerPadding.valuePx(e.windowSize)};
+  &:hover {
+    border: 1px solid ${(e) => e.theme.colors.primary};
+    fill: ${(e) => e.theme.colors.primary};
+  }
+`, g = s.div`
+  width: 100%;
+  display: flex;
+  margin-top: ${t.sp4};
+`, w = s($)`
+  display: flex;
+  color: ${a.important};
+`, O = s.div`
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  row-gap: ${(e) => r.topElementsRowGap.valuePx(e.windowSize)};
+  flex-direction: ${(e) => e.windowSize === "small" ? "column" : "row"};
+`, q = s($)`
+  display: flex;
+  margin-top: ${t.sp2};
+  color: ${(e) => e.theme.colors.hero};
+`, M = s.div`
+  display: flex;
+  align-items: center;
+  gap: ${t.sp4};
+  justify-content: left;
+  color: ${(e) => e.theme.colors.primary};
+`, N = s(R)`
+  height: 20px;
+  width: auto;
+  color: ${(e) => e.theme.colors.primary};
+  cursor: pointer;
+`, Z = s(B)`
+  height: ${(e) => r.arrowIconWidthHeight.valuePx(e.windowSize)};
+  width: ${(e) => r.arrowIconWidthHeight.valuePx(e.windowSize)};
+  color: ${(e) => e.theme.colors.hero};
+`, _ = s(L)`
+  height: ${t.sp4};
+  color: ${(e) => e.theme.colors.primary};
+`, J = s.div`
+  margin-right: ${t.sp2};
+`, K = s(k)`
+  width: ${t.sp3};
+  height: ${t.sp3};
+  color: ${a.success};
+`, U = s.div`
+  height: ${t.sp3};
+  width: ${t.sp3};
+  border: 1px solid ${(e) => e.theme.colors.primary};
+  border-radius: 50%;
+`;
+export {
+  te as Q
+};