@zeniai/web-components 3.16.84 → 3.16.85

package/dist/AccountRow-BL5koYgc.js

@@ -1,1012 +0,0 @@
-import { j as e, b as x, u as I } from "./vendor-.pnpm-DtFedGku.js";
-import { useState as rt } from "react";
-import { css as ct } from "@emotion/react";
-import s from "@emotion/styled";
-import { S as o, J as lt, bd as dt, aq as ut, j, D as h, a as xt, a5 as E, Z as f, aL as ht, bb as pt, p as w, C as m, gm as Z, gn as K, w as mt, G as X, u as gt, B as ft, E as T, ag as yt, gh as jt } from "./index-ZNEZeera.js";
-import { S as wt } from "./clock-CJkylEKt.js";
-const Ct = s.div`
-  position: relative;
-  ${(t) => t.showTreeLine === !0 && t.collapsed !== !0 ? `&::after {
-      content: "";
-      position: absolute;
-      top: 25px;
-      left: 12px;
-      border-left: 1px dotted ${t.theme.colors.grey1};
-      height: 12px;
-    ` : ""};
-`, $t = s.div`
-  display: flex;
-  min-width: ${o.sp4};
-  width: ${o.sp4};
-  height: ${o.sp4};
-  border-style: solid;
-  border-width: 1px;
-  border-radius: 12px;
-  text-align: center;
-  align-items: center;
-  justify-content: center;
-  color: ${(t) => t.colour.toString()};
-`, St = s(ut)`
-  text-align: center;
-  color: ${(t) => t.colour.toString()};
-`, bt = s.div`
-  svg {
-    path {
-      stroke-width: 2;
-    }
-  }
-`, vt = s(dt)`
-  margin-top: 6px;
-  width: 12px;
-  height: 12px;
-`, kt = s(lt)`
-  margin-top: ${o.sp1};
-  margin-left: 2px;
-  width: 12px;
-  height: 12px;
-`;
-function Bt({
-  firstLetter: t,
-  color: n,
-  showIcon: a,
-  showCollapsedIcon: i,
-  showTreeLine: l = !1,
-  className: d
-}) {
-  return /* @__PURE__ */ e.jsx(Ct, { showTreeLine: l, collapsed: i, children: /* @__PURE__ */ e.jsx($t, { colour: n, className: d, children: /* @__PURE__ */ e.jsx(bt, { children: a === !0 ? i === !0 ? /* @__PURE__ */ e.jsx(kt, {}) : /* @__PURE__ */ e.jsx(vt, {}) : /* @__PURE__ */ e.jsx(St, { colour: n, className: d, children: t }) }) }) });
-}
-const Et = s.div`
-  display: flex;
-  flex: 1 1 auto;
-  max-height: 1px;
-  background-color: ${(t) => t.isScrolling ? "transparent" : t.theme.colors.hero};
-`, It = s.div`
-  display: flex;
-  flex: 1 1 auto;
-  height: 1px;
-  width: 100%;
-`, Tt = s.div`
-  flex: 1 1 auto;
-  height: 1px;
-  width: 100%;
-`;
-function Wt({
-  kind: t,
-  isScrolling: n
-}) {
-  switch (t) {
-    case "section_separator":
-      return /* @__PURE__ */ e.jsx(Et, { isScrolling: n });
-    case "account_separator":
-      return /* @__PURE__ */ e.jsx(
-        Pt,
-        {
-          "data-testid": j("account-separator", t)
-        }
-      );
-  }
-}
-const Pt = () => /* @__PURE__ */ e.jsx(It, { children: /* @__PURE__ */ e.jsx(Tt, { className: "part-separator" }) }), u = {
-  timeframeHeight: h[10],
-  leftHeadingWidth: 386,
-  leftTimeframeWidth: 161,
-  leftLabelWidth: 190,
-  bankBalanceWidth: 128,
-  bankBalanceTimeframeWidth: 126,
-  bankBalanceRightWidth: h[4],
-  bankBalanceRightTimeframeWidth: h[4],
-  clearedBalanceWidth: 144,
-  clearedBalanceTimeframeWidth: 142,
-  varianceWidth: 193,
-  varianceTimeframeWidth: 180,
-  varianceNumberWidth: 112,
-  varianceNumberLoadingWidth: 130,
-  variancePercentageWidth: h[10],
-  statusWidth: 144,
-  statusTimeframeWidth: 142,
-  tickLeftMargin: h[4],
-  circleRadius: h[4],
-  spacerLineWidth: h[5],
-  wrapperPadding: h[8]
-};
-function Ne(t) {
-  switch (t) {
-    case "timeframe_headers":
-      return h[12];
-    case "title_string_only":
-      return h[8];
-    case "ac_group_report":
-      return h[8];
-    case "total":
-      return h[8];
-    case "section":
-      return h[0];
-    case "loading_in_progress":
-      return h[8];
-    default:
-      return h[0];
-  }
-}
-function De() {
-  return !0;
-}
-const _t = s.div`
-  display: flex;
-  flex-direction: column;
-  height: ${(t) => t.heightValue}px;
-  justify-content: flex-start;
-  align-items: center;
-  padding-right: ${u.wrapperPadding}px;
-  cursor: pointer;
-  .part-separator {
-    background-color: ${(t) => t.isLastRow ? t.theme.colors.hero : t.isSelectedRow ? t.theme.colors.primary : t.theme.colors.grey3};
-  }
-  .any-text-container {
-    ${(t) => t.isSelectedRow ? ct`
-            color: ${t.theme.colors.primary};
-          ` : null}
-  }
-
-  .bank-icon-container {
-    display: none;
-  }
-
-  &:hover {
-    .part-separator {
-      background-color: ${(t) => t.theme.colors.primary};
-    }
-    .any-text-container {
-      color: ${(t) => t.theme.colors.primary};
-    }
-    .bank-icon-container {
-      display: flex;
-    }
-  }
-`, Lt = s.div`
-  height: ${o.sp8};
-`, Nt = s.div`
-  width: 100%;
-  height: ${(t) => t.heightValue - 1}px;
-  user-select: none;
-  display: flex;
-  flex: 1 1 auto;
-  flex-flow: row;
-  justify-content: flex-start;
-  align-items: center;
-`, Dt = s.div`
-  display: flex;
-  flex: 1 1 auto;
-  justify-content: flex-start;
-  align-items: center;
-  gap: ${o.sp2};
-  margin-left: ${o.sp4};
-`, Rt = s.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  gap: ${o.sp1};
-  margin-top: ${o.sp1};
-`, At = s(w)`
-  user-select: none;
-  clear: both;
-  display: inline-block;
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  text-align: left;
-  color: ${(t) => t.theme.colors.hero};
-  width: ${u.leftLabelWidth}px;
-  min-width: ${u.leftLabelWidth}px;
-`, Vt = s.div`
-  display: flex;
-  flex: 1 1 auto;
-  justify-content: flex-end;
-  align-items: center;
-  color: ${(t) => t.theme.colors.hero};
-`, Ht = s(w)`
-  width: ${u.bankBalanceWidth}px;
-  min-width: ${u.bankBalanceWidth}px;
-  text-align: right;
-`, Ft = s.div`
-  width: ${u.bankBalanceRightWidth}px;
-  min-width: ${u.bankBalanceRightWidth}px;
-`, Mt = s(w)`
-  width: ${u.clearedBalanceWidth}px;
-  min-width: ${u.clearedBalanceWidth}px;
-  text-align: right;
-`, Ot = s(w)`
-  width: ${u.statusWidth}px;
-  min-width: ${u.statusWidth}px;
-  height: 1px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  height: 100%;
-`, Ut = s.div`
-  display: flex;
-  flex-direction: row;
-  min-width: ${u.spacerLineWidth}px;
-  width: ${u.spacerLineWidth}px;
-  align-items: center;
-`, Qt = s.div`
-  width: 1px;
-  margin-left: ${o.sp3};
-  height: ${(t) => t.heightValue}px;
-  background-color: ${(t) => t.theme.colors.grey3};
-`, zt = s.div`
-  display: flex;
-  flex-shrink: 0;
-  width: ${u.varianceTimeframeWidth}px;
-  min-width: ${u.varianceTimeframeWidth}px;
-  flex-direction: row;
-  justify-content: flex-end;
-  align-items: center;
-  text-align: center;
-  gap: ${o.sp2};
-  margin-left: ${u.tickLeftMargin}px;
-`, qt = s(w)`
-  border-radius: ${o.sp1};
-  color: ${(t) => t.textColor.hex()};
-  min-width: ${u.varianceNumberWidth}px;
-  text-align: right;
-`, Gt = s(w)`
-  border-radius: ${o.sp1};
-  padding: ${o.sp0} ${o.sp1};
-  justify-content: center;
-  text-align: center;
-  color: ${(t) => t.textColor.hex()};
-  background-color: ${(t) => t.bgColor.hex()};
-  min-width: ${u.variancePercentageWidth}px;
-`, Jt = s.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-`, Zt = s.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-`, Kt = s.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  gap: ${o.sp1};
-`, Xt = s(T)`
-  color: ${m.success};
-`, G = s(T)`
-  color: ${m.success};
-`, Yt = s(jt)`
-  width: ${o.sp3};
-  height: ${o.sp3};
-  color: ${m.success};
-`, v = s(w)`
-  text-align: right;
-`, te = s.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  justify-content: flex-end;
-`, ee = s(mt)`
-  width: ${o.sp3};
-  height: ${o.sp3};
-`, ne = s(w)`
-  text-align: right;
-  color: ${m.important};
-  cursor: pointer;
-  text-decoration: underline;
-`, oe = s.div`
-  display: flex;
-  flex-direction: column;
-  align-items: flex-end;
-  justify-content: flex-start;
-`, se = s.div`
-  display: flex;
-  flex-direction: row;
-  gap: ${o.sp1};
-  align-items: center;
-`, ae = s.div`
-  padding-top: ${o.sp1};
-  &:hover {
-    color: ${(t) => t.theme.colors.primary};
-  }
-`, ie = s(wt)`
-  width: ${o.sp3};
-  height: ${o.sp3};
-`, A = s(yt)`
-  width: 12px;
-  height: 12px;
-  color: ${(t) => t.iconColor.hex()};
-  margin-top: ${o.sp1};
-`, C = s.div`
-  display: flex;
-  gap: ${o.sp1};
-`, V = s.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-`, J = s(w)`
-  color: ${(t) => t.theme.colors.hero};
-`, H = s.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  gap: ${o.sp1};
-`, F = s(T)`
-  color: ${(t) => t.textColor.hex()};
-`, M = s(T)`
-  color: ${(t) => t.textColor.hex()};
-`, O = s.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-`, U = s.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-`, k = s(T)`
-  color: ${(t) => t.textColor.hex()};
-`, re = s.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-`, ce = s(X)`
-  color: ${(t) => t.theme.colors.hero};
-`, le = s(X)`
-  color: ${m.brandColorPearl};
-`, de = s.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  justify-content: center;
-`, ue = s(Z)`
-  width: ${o.sp3};
-  height: ${o.sp3};
-  margin-top: 2px;
-`, xe = s(Z)`
-  width: ${o.sp3};
-  height: ${o.sp3};
-`, he = s(K)`
-  width: ${o.sp3};
-  height: ${o.sp3};
-  margin-top: 2px;
-`, pe = s(K)`
-  width: ${o.sp3};
-  height: ${o.sp3};
-  margin-top: 2px;
-`, {
-  expenseAutomation: {
-    accountRecon: { reconciliation: r }
-  },
-  common: {
-    strings: { hyphen: p, percentage: me }
-  }
-} = xt.getLocalizedStrings();
-function Re({
-  height: t,
-  accountRecon: n,
-  isLastRow: a,
-  isSelectedRow: i,
-  onReviewClicked: l,
-  onOpenDrawerClicked: d,
-  onConnectClicked: c,
-  onReconnectClicked: g,
-  onStatementAddClicked: S
-}) {
-  const L = gt(), W = I(), b = n.accountReconEntity.account.accountName, y = n.accountReconEntity.balance, N = n.accountReconEntity.clearedBalance, et = n.accountReconEntity.variance, nt = n.accountReconEntity.variancePercentage, ot = () => {
-    c?.(n.accountReconEntity.account.accountId);
-  }, st = () => {
-    g?.(n.accountReconEntity.account.accountId);
-  }, at = () => {
-    S?.(n.accountReconEntity.account.accountId);
-  }, Q = () => {
-    l?.(n.accountReconEntity.account.accountId);
-  }, [it, D] = rt(!1), z = n.accountConnectionStatus === "connected" || n.connectionInProgress === !0 ? "plaid" : n.accountReconEntity.statementStatus?.code === "uploaded" || n.statementParseInProgress === !0 ? "bank_statement" : "plaid", B = z === "plaid" ? n.accountReconEntity.balanceDataStatus?.code === "in_progress" || n.connectionInProgress === !0 : n.accountReconEntity.statementDataStatus?.code === "parsing" || n.statementParseInProgress === !0;
-  let q = t;
-  return a && (q = t + h[8]), /* @__PURE__ */ e.jsxs(
-    _t,
-    {
-      "data-testid": j(
-        "account-recon-row-root-container",
-        n.accountReconEntity.account.accountName
-      ),
-      heightValue: q,
-      isLastRow: a,
-      windowSize: L,
-      isSelectedRow: i,
-      onClick: () => {
-        it !== !0 && d?.(
-          n.accountReconEntity.account.accountId
-        );
-      },
-      children: [
-        /* @__PURE__ */ e.jsxs(
-          Nt,
-          {
-            isClickable: !0,
-            "data-testid": j("total-row-container"),
-            heightValue: t,
-            children: [
-              /* @__PURE__ */ e.jsxs(Dt, { children: [
-                /* @__PURE__ */ e.jsx(
-                  Bt,
-                  {
-                    firstLetter: b.charAt(0),
-                    color: new x(W.colors.hero),
-                    showIcon: !1,
-                    showCollapsedIcon: !1,
-                    className: "any-text-container"
-                  }
-                ),
-                /* @__PURE__ */ e.jsx(Rt, { children: /* @__PURE__ */ e.jsx(
-                  f,
-                  {
-                    enterDelay: 600,
-                    title: b,
-                    style: { padding: `${o.sp1} ${o.sp2}` },
-                    placement: "bottom",
-                    children: /* @__PURE__ */ e.jsx(At, { className: "any-text-container", children: b })
-                  }
-                ) })
-              ] }),
-              /* @__PURE__ */ e.jsxs(Vt, { children: [
-                /* @__PURE__ */ e.jsx(Ht, { children: /* @__PURE__ */ e.jsx(
-                  we,
-                  {
-                    lastUpdatedAt: n.accountReconEntity.reconciliationId != null ? n.accountReconEntity.reconUpdatedAt : n.accountReconEntity.accountUpdatedAt,
-                    setIsHovering: D,
-                    statementStatus: n.accountReconEntity.statementStatus.code,
-                    accountId: n.accountReconEntity.account.accountId,
-                    bankBalance: y,
-                    bankConnection: n.accountConnectionStatus,
-                    onConnectClicked: ot,
-                    onStatementAddClicked: at,
-                    isLoading: B,
-                    onReconnectClicked: st
-                  }
-                ) }),
-                /* @__PURE__ */ e.jsx(Ft, { children: /* @__PURE__ */ e.jsx(
-                  ke,
-                  {
-                    statementStatus: n.accountReconEntity.statementStatus.code,
-                    statementParseInProgress: n.statementParseInProgress,
-                    connectionInProgress: n.connectionInProgress,
-                    bankStatusCode: n.accountConnectionStatus
-                  }
-                ) }),
-                /* @__PURE__ */ e.jsx(Mt, { children: /* @__PURE__ */ e.jsx(
-                  Ce,
-                  {
-                    clearedBalance: N,
-                    isLoading: B
-                  }
-                ) }),
-                /* @__PURE__ */ e.jsx(
-                  ge,
-                  {
-                    isLoading: B,
-                    variance: et,
-                    variancePercentage: nt,
-                    reconciliationStatusCode: n.accountReconEntity.reconciliationStatus?.code
-                  }
-                ),
-                /* @__PURE__ */ e.jsx(Ut, { children: /* @__PURE__ */ e.jsx(Qt, { heightValue: t }) }),
-                /* @__PURE__ */ e.jsx(
-                  Ot,
-                  {
-                    onMouseEnter: () => {
-                      D(!0);
-                    },
-                    onMouseLeave: () => {
-                      D(!1);
-                    },
-                    children: z === "plaid" ? /* @__PURE__ */ e.jsx(
-                      ye,
-                      {
-                        accountRecon: n,
-                        isLoading: B,
-                        onReviewClicked: Q
-                      }
-                    ) : /* @__PURE__ */ e.jsx(
-                      je,
-                      {
-                        accountRecon: n,
-                        isLoading: B,
-                        onReviewClicked: Q
-                      }
-                    )
-                  }
-                )
-              ] })
-            ]
-          }
-        ),
-        /* @__PURE__ */ e.jsx(Wt, { kind: "account_separator", isScrolling: !1 }),
-        a ? /* @__PURE__ */ e.jsx(Lt, {}) : null
-      ]
-    }
-  );
-}
-const ge = ({
-  variance: t,
-  variancePercentage: n,
-  reconciliationStatusCode: a,
-  isLoading: i
-}) => {
-  const l = I(), {
-    varianceColor: d,
-    variancePercentageColor: c,
-    variancePercentageContainerColor: g
-  } = fe(l, t, a), S = i ? p : t != null && t.amount === 0 ? "0%" : n != null ? n === 0 ? "0%" : `${n.toFixed(2)}${me}` : p;
-  return /* @__PURE__ */ e.jsxs(zt, { children: [
-    /* @__PURE__ */ e.jsx(qt, { textColor: d, className: "any-text-container", children: t == null || i ? p : E("0,0", t) }),
-    /* @__PURE__ */ e.jsx(
-      Gt,
-      {
-        textColor: c,
-        bgColor: g,
-        className: "any-text-container",
-        children: S
-      }
-    )
-  ] });
-}, fe = (t, n, a, i) => {
-  let l, d, c;
-  return n != null && n.amount === 0 && a != null && a === "reconciled" ? (l = new x(m.success), d = new x(m.success), c = new x(m.successLight)) : i === !0 ? (l = new x(t.colors.primary), d = new x(t.colors.primary), c = new x(t.colors.grey2)) : (l = new x(t.colors.hero), d = new x(t.colors.hero), c = new x(t.colors.background)), {
-    varianceColor: l,
-    variancePercentageColor: d,
-    variancePercentageContainerColor: c
-  };
-}, ye = ({
-  accountRecon: t,
-  isLoading: n,
-  onReviewClicked: a
-}) => {
-  const i = t.accountReconEntity.reconciliationStatus, l = t.accountConnectionStatus, d = t.accountReconEntity.reconciliationId != null ? t.accountReconEntity.reconUpdatedAt : t.accountReconEntity.accountUpdatedAt, c = d != null ? `${d.utc(!0).fromNow().toLowerCase()}` : p;
-  if (n)
-    return /* @__PURE__ */ e.jsx(Se, {});
-  if (t.accountReconEntity.balanceDataStatus?.code === "not_found") {
-    let g = "";
-    return t.accountReconEntity.balance == null && t.accountReconEntity.clearedBalance == null ? g = r.status.balanceNotFound : t.accountReconEntity.balance == null ? g = r.status.bankBalanceNotFound : g = r.status.clearedBalanceNotFound, /* @__PURE__ */ e.jsx($e, { status: g, tooltipText: c });
-  }
-  if (l === "reconnect" || l === "not_connected")
-    return /* @__PURE__ */ e.jsx(
-      R,
-      {
-        tooltipText: c,
-        showTooltip: d != null
-      }
-    );
-  if (i == null && l === "connected" && t.accountReconEntity.balance != null && t.accountReconEntity.clearedBalance != null)
-    return /* @__PURE__ */ e.jsx(
-      P,
-      {
-        buttonLabel: r.status.review,
-        isDisabled: !1,
-        dataTestId: j(
-          "status-button",
-          t.accountReconEntity.account.accountId
-        ),
-        tooltipText: c,
-        onClick: a
-      }
-    );
-  if (i != null)
-    switch (i.code) {
-      case "save_for_later":
-      case "pending":
-        return /* @__PURE__ */ e.jsx(
-          P,
-          {
-            buttonLabel: r.status.review,
-            isDisabled: !1,
-            dataTestId: j(
-              "status-button",
-              t.accountReconEntity.account.accountId
-            ),
-            tooltipText: c,
-            onClick: a
-          }
-        );
-      case "reconciled":
-        return /* @__PURE__ */ e.jsx(
-          _,
-          {
-            isQBO: !1,
-            user: t.accountReconEntity.user,
-            tooltipText: c
-          }
-        );
-      case "in_progress":
-        return /* @__PURE__ */ e.jsx(tt, { tooltipText: c });
-      case "failed":
-        return /* @__PURE__ */ e.jsx(Y, { tooltipText: c });
-      case "reconciled_on_qbo":
-        return /* @__PURE__ */ e.jsx(_, { isQBO: !0, tooltipText: c });
-      default:
-        return null;
-    }
-  else
-    return /* @__PURE__ */ e.jsx(
-      R,
-      {
-        showTooltip: d != null,
-        tooltipText: c
-      }
-    );
-}, je = ({
-  accountRecon: t,
-  isLoading: n,
-  onReviewClicked: a
-}) => {
-  const i = t.accountReconEntity.reconciliationStatus, l = t.accountReconEntity.statementDataStatus?.code === "validated" || t.accountReconEntity.statementDataStatus?.code === "processed", d = t.accountReconEntity.reconUpdatedAt, c = d != null ? `${d.utc(!0).fromNow().toLowerCase()}` : p;
-  if (t.accountReconEntity.statementDataStatus?.code === "parsing_failed" || t.accountReconEntity.statementDataStatus?.code === "validation_failed" || t.accountReconEntity.statementDataStatus?.code === "processing_failed")
-    return /* @__PURE__ */ e.jsx(
-      ve,
-      {
-        code: t.accountReconEntity.statementDataStatus?.code,
-        tooltipText: c,
-        errorMessage: t.accountReconEntity.errorMessage?.errorShort
-      }
-    );
-  if (n)
-    return /* @__PURE__ */ e.jsx(be, {});
-  if (i == null && l && t.accountReconEntity.balance != null && t.accountReconEntity.clearedBalance != null)
-    return /* @__PURE__ */ e.jsx(
-      P,
-      {
-        buttonLabel: r.status.review,
-        isDisabled: !1,
-        dataTestId: j(
-          "status-button",
-          t.accountReconEntity.account.accountId
-        ),
-        tooltipText: c,
-        onClick: a
-      }
-    );
-  if (i != null)
-    switch (i.code) {
-      case "save_for_later":
-      case "pending":
-        return /* @__PURE__ */ e.jsx(
-          P,
-          {
-            buttonLabel: r.status.review,
-            isDisabled: !1,
-            dataTestId: j(
-              "status-button",
-              t.accountReconEntity.account.accountId
-            ),
-            tooltipText: c,
-            onClick: a
-          }
-        );
-      case "reconciled":
-        return /* @__PURE__ */ e.jsx(
-          _,
-          {
-            isQBO: !1,
-            user: t.accountReconEntity.user,
-            tooltipText: c
-          }
-        );
-      case "reconciled_on_qbo":
-        return /* @__PURE__ */ e.jsx(_, { isQBO: !0, tooltipText: c });
-      case "in_progress":
-        return /* @__PURE__ */ e.jsx(tt, { tooltipText: c });
-      case "failed":
-        return /* @__PURE__ */ e.jsx(Y, { tooltipText: c });
-      default:
-        return null;
-    }
-  else
-    return /* @__PURE__ */ e.jsx(
-      R,
-      {
-        showTooltip: d != null,
-        tooltipText: c
-      }
-    );
-}, P = ({
-  buttonLabel: t,
-  isDisabled: n,
-  tooltipText: a,
-  dataTestId: i,
-  onClick: l
-}) => /* @__PURE__ */ e.jsx(
-  f,
-  {
-    title: /* @__PURE__ */ e.jsx($, { tooltipText: a }),
-    style: { padding: `${o.sp1} ${o.sp2}` },
-    maxWidth: "105px",
-    placement: "bottom",
-    children: /* @__PURE__ */ e.jsx(Jt, { children: /* @__PURE__ */ e.jsx(
-      ft,
-      {
-        label: t,
-        size: "standard",
-        variant: "secondary",
-        style: { padding: `${o.sp1} 12px` },
-        disabled: n,
-        "data-testid": i,
-        onClick: (d) => {
-          d.stopPropagation(), l();
-        }
-      }
-    ) })
-  }
-), _ = ({
-  user: t,
-  isQBO: n,
-  tooltipText: a
-}) => /* @__PURE__ */ e.jsx(
-  f,
-  {
-    title: /* @__PURE__ */ e.jsx($, { tooltipText: a }),
-    style: { padding: `${o.sp1} ${o.sp2}` },
-    maxWidth: "105px",
-    placement: "bottom",
-    children: /* @__PURE__ */ e.jsxs(Zt, { children: [
-      /* @__PURE__ */ e.jsxs(Kt, { children: [
-        /* @__PURE__ */ e.jsx(Yt, {}),
-        /* @__PURE__ */ e.jsx(Xt, { children: n ? r.status.reconciledVia : r.status.reconciledBy })
-      ] }),
-      n ? /* @__PURE__ */ e.jsx(G, { children: r.status.QBOUser }) : t && /* @__PURE__ */ e.jsxs(G, { children: [
-        t.firstName,
-        " ",
-        t.lastName
-      ] })
-    ] })
-  }
-), we = ({
-  bankBalance: t,
-  bankConnection: n,
-  statementStatus: a,
-  lastUpdatedAt: i,
-  fromDrawer: l = !1,
-  onConnectClicked: d,
-  onReconnectClicked: c,
-  isLoading: g,
-  accountId: S,
-  onStatementAddClicked: L,
-  setIsHovering: W
-}) => {
-  const b = Be();
-  if (l === !0)
-    return /* @__PURE__ */ e.jsx(v, { className: "any-text-container", children: E("0,0", t) ?? p });
-  if (g === !0)
-    return /* @__PURE__ */ e.jsx(v, { className: "any-text-container", children: p });
-  if (n === "reconnect") {
-    const y = i != null ? `${i.utc(!0).fromNow()}` : p;
-    return /* @__PURE__ */ e.jsxs(oe, { children: [
-      /* @__PURE__ */ e.jsxs(se, { children: [
-        /* @__PURE__ */ e.jsx(ae, { children: /* @__PURE__ */ e.jsx(
-          f,
-          {
-            title: /* @__PURE__ */ e.jsx($, { tooltipText: y }),
-            placement: "bottom",
-            style: { padding: `2px ${o.sp2}` },
-            children: /* @__PURE__ */ e.jsx(ie, {})
-          }
-        ) }),
-        /* @__PURE__ */ e.jsx(v, { className: "any-text-container", children: t != null ? E("0,0", t) : p })
-      ] }),
-      /* @__PURE__ */ e.jsx(
-        ne,
-        {
-          "data-testid": j(
-            "account-reconciliation-reconnect-button",
-            S
-          ),
-          onClick: (N) => {
-            N.stopPropagation(), c?.();
-          },
-          children: r.connect.reconnnect
-        }
-      )
-    ] });
-  } else return n === "connected" || a === "uploaded" ? /* @__PURE__ */ e.jsx(v, { className: "any-text-container", children: E("0,0", t) ?? p }) : /* @__PURE__ */ e.jsx(
-    te,
-    {
-      "data-testid": j(
-        "account-reconciliation-connect-button",
-        S
-      ),
-      onMouseEnter: () => {
-        W(!0);
-      },
-      onMouseLeave: () => {
-        W(!1);
-      },
-      children: /* @__PURE__ */ e.jsx(ht, { controller: b.length > 0, children: /* @__PURE__ */ e.jsx(
-        f,
-        {
-          title: r.tooltips.selectSource,
-          style: { padding: `${o.sp1} ${o.sp2}` },
-          maxWidth: "105px",
-          placement: "bottom",
-          children: /* @__PURE__ */ e.jsx(
-            pt,
-            {
-              moreIconType: "custom",
-              customIcon: /* @__PURE__ */ e.jsx(ee, {}),
-              options: b,
-              customStyleConfig: {
-                option: () => ({
-                  ".option-container": {
-                    justifyContent: "flex-start"
-                  }
-                }),
-                valueContainer: () => ({
-                  height: o.sp3,
-                  ".more-icon": {
-                    width: o.sp3,
-                    height: o.sp3
-                  }
-                })
-              },
-              menuPlacement: "auto",
-              onOptionSelection: (y) => {
-                y === "bank_connection" ? d?.() : y === "statement" && L?.();
-              },
-              valueToIcon: (y) => y === "bank_connection" ? /* @__PURE__ */ e.jsx(ue, {}) : y === "statement" ? /* @__PURE__ */ e.jsx(he, {}) : null
-            }
-          )
-        }
-      ) })
-    }
-  );
-}, Ce = ({
-  clearedBalance: t,
-  isLoading: n
-}) => t != null && n === !1 ? /* @__PURE__ */ e.jsx(v, { className: "any-text-container", children: E("0,0", t) ?? p }) : /* @__PURE__ */ e.jsx(v, { className: "any-text-container", children: p }), Y = ({ tooltipText: t }) => {
-  const n = new x(m.important);
-  return /* @__PURE__ */ e.jsx(
-    f,
-    {
-      title: /* @__PURE__ */ e.jsx($, { tooltipText: t }),
-      style: { padding: `${o.sp1} ${o.sp2}` },
-      maxWidth: "105px",
-      placement: "bottom",
-      children: /* @__PURE__ */ e.jsx(C, { children: /* @__PURE__ */ e.jsxs(V, { children: [
-        /* @__PURE__ */ e.jsx(A, { iconColor: n }),
-        /* @__PURE__ */ e.jsx(H, { children: /* @__PURE__ */ e.jsx(F, { textColor: n, children: r.status.reconciliationFailed }) }),
-        /* @__PURE__ */ e.jsx(O, { children: /* @__PURE__ */ e.jsx(M, { textColor: n, children: r.status.reconcileViaQBO }) })
-      ] }) })
-    }
-  );
-}, $e = ({
-  status: t,
-  tooltipText: n
-}) => {
-  const a = new x(m.brandColorGoldDark);
-  return /* @__PURE__ */ e.jsx(
-    f,
-    {
-      title: /* @__PURE__ */ e.jsx($, { tooltipText: n }),
-      style: { padding: `${o.sp1} ${o.sp2}` },
-      maxWidth: "105px",
-      placement: "bottom",
-      children: /* @__PURE__ */ e.jsxs(C, { children: [
-        /* @__PURE__ */ e.jsx(A, { iconColor: a }),
-        /* @__PURE__ */ e.jsxs(V, { children: [
-          /* @__PURE__ */ e.jsx(H, { children: /* @__PURE__ */ e.jsx(F, { textColor: a, children: t }) }),
-          /* @__PURE__ */ e.jsx(O, { children: /* @__PURE__ */ e.jsx(M, { textColor: a, children: r.status.reconcileViaQBO }) })
-        ] })
-      ] })
-    }
-  );
-}, tt = ({ tooltipText: t }) => {
-  const n = I(), a = new x(n.colors.grey1);
-  return /* @__PURE__ */ e.jsx(
-    f,
-    {
-      title: /* @__PURE__ */ e.jsx($, { tooltipText: t }),
-      style: { padding: `${o.sp1} ${o.sp2}` },
-      maxWidth: "105px",
-      placement: "bottom",
-      children: /* @__PURE__ */ e.jsx(C, { children: /* @__PURE__ */ e.jsxs(U, { children: [
-        /* @__PURE__ */ e.jsx(k, { textColor: a, children: r.status.autoReconInProgress }),
-        /* @__PURE__ */ e.jsx(k, { textColor: a, children: r.status.isInProgress })
-      ] }) })
-    }
-  );
-}, Se = () => {
-  const t = I(), n = new x(t.colors.grey1);
-  return /* @__PURE__ */ e.jsx(C, { children: /* @__PURE__ */ e.jsxs(U, { children: [
-    /* @__PURE__ */ e.jsx(k, { textColor: n, children: r.status.balanceSyncInProgress }),
-    /* @__PURE__ */ e.jsx(k, { textColor: n, children: r.status.isInProgress })
-  ] }) });
-}, be = () => {
-  const t = I(), n = new x(t.colors.grey1);
-  return /* @__PURE__ */ e.jsx(C, { children: /* @__PURE__ */ e.jsxs(U, { children: [
-    /* @__PURE__ */ e.jsx(k, { textColor: n, children: r.status.statementSyncInProgress }),
-    /* @__PURE__ */ e.jsx(k, { textColor: n, children: r.status.isInProgress })
-  ] }) });
-}, ve = ({
-  code: t,
-  tooltipText: n,
-  errorMessage: a
-}) => {
-  const i = new x(m.important), l = Ee(t, "list", a);
-  return /* @__PURE__ */ e.jsx(
-    f,
-    {
-      title: /* @__PURE__ */ e.jsx($, { tooltipText: n }),
-      style: { padding: `${o.sp1} ${o.sp2}` },
-      maxWidth: "105px",
-      placement: "bottom",
-      children: /* @__PURE__ */ e.jsxs(C, { children: [
-        /* @__PURE__ */ e.jsx(A, { iconColor: i }),
-        /* @__PURE__ */ e.jsxs(V, { children: [
-          /* @__PURE__ */ e.jsx(H, { children: /* @__PURE__ */ e.jsx(F, { textColor: i, children: l }) }),
-          /* @__PURE__ */ e.jsx(O, { children: /* @__PURE__ */ e.jsx(M, { textColor: i, children: r.status.failed }) })
-        ] })
-      ] })
-    }
-  );
-}, R = ({
-  showTooltip: t,
-  tooltipText: n
-}) => t == !1 ? /* @__PURE__ */ e.jsx(C, { children: /* @__PURE__ */ e.jsx(J, { children: p }) }) : /* @__PURE__ */ e.jsx(
-  f,
-  {
-    title: /* @__PURE__ */ e.jsx($, { tooltipText: n }),
-    style: { padding: `${o.sp1} ${o.sp2}` },
-    maxWidth: "105px",
-    placement: "bottom",
-    children: /* @__PURE__ */ e.jsx(C, { children: /* @__PURE__ */ e.jsx(J, { children: p }) })
-  }
-), $ = ({ tooltipText: t }) => /* @__PURE__ */ e.jsxs(re, { children: [
-  /* @__PURE__ */ e.jsx(ce, { children: r.tooltips.lastUpdated }),
-  /* @__PURE__ */ e.jsx(le, { children: t })
-] }), ke = ({
-  statementStatus: t,
-  statementParseInProgress: n,
-  bankStatusCode: a,
-  connectionInProgress: i
-}) => {
-  let l = t === "uploaded" || n === !0 ? /* @__PURE__ */ e.jsx(pe, {}) : null;
-  return l = a === "connected" || a === "reconnect" || i === !0 ? /* @__PURE__ */ e.jsx(xe, {}) : l, /* @__PURE__ */ e.jsx(de, { className: "bank-icon-container", children: l });
-};
-function Be() {
-  const t = [];
-  return t.push({
-    label: r.menu.bankConnection,
-    value: "bank_connection"
-  }), t.push({
-    label: r.menu.statement,
-    value: "statement"
-  }), t;
-}
-const Ee = (t, n, a) => {
-  if (a != null && n === "drawer")
-    return a;
-  let i = "";
-  switch (t) {
-    case "parsing_failed":
-      i = r.status.statementParseError;
-      break;
-    case "validation_failed":
-      i = r.status.statementValidationFailed;
-      break;
-    case "processing_failed":
-      i = r.status.statementProcessingFailed;
-      break;
-    default:
-      i = r.status.statementParseError;
-      break;
-  }
-  return n === "drawer" && (i = i + " " + r.status.failed), i;
-};
-export {
-  Re as A,
-  Bt as C,
-  we as S,
-  Ee as a,
-  Ce as b,
-  u as c,
-  fe as d,
-  Ne as g,
-  De as i
-};