@zeniai/web-components 3.16.44 → 3.16.45

package/dist/ChargeCardListPage-CqtXskKE.js

@@ -1,1775 +0,0 @@
-import { j as t, g as Xn, aJ as Qn, m as Vn, C as eo, F as to, u as tn } from "./vendor-.pnpm-BZbZ6JJC.js";
-import { useState as U, useEffect as ue, useCallback as pe, useMemo as te, useRef as Ot } from "react";
-import { css as lt, keyframes as no } from "@emotion/react";
-import o from "@emotion/styled";
-import { hasChargeCardAdminLevelAccess as oo, anyCardOnHold as so, dateNow as _t, zeniDate as ao, getNextNthWorkingDay as ro } from "@zeniai/client-epic-state";
-import { G as se, u as we, j as dt, a as Fe, S as n, R as W, fZ as co, C as m, V as io, E as pt, J as mt, p as lo, H as po, b5 as mo, W as uo, D, ia as ho, B as zt, a5 as he, eY as fo, dB as go, aD as z, dz as xo, i1 as So, ea as G, aE as yo, hs as ne, t as F, Z as rt, dK as ct, av as Co, K as bo, X as $o, ax as nn, ag as vo, P as ko } from "./index-oyJQP6ol.js";
-import { B as jo } from "./BusyIndication-ozy3ruPL.js";
-import { S as Io } from "./SpendManagementSection-DKoZ8jPg.js";
-import { A as oe, C as Ro, a as Bo } from "./ChargeCardListTable-CdrJvEmJ.js";
-import { ChargeCardPromoUserContent as Po } from "./ChargeCardPromoPage-Bg8O8yuc.js";
-import { P as To, M as Mo } from "./PromoBaseCards-7Yr8HpIs.js";
-import { C as Ut, L as Ht, R as wo, U as Fo } from "./LockCardPage-k_Ov4sL8.js";
-import { S as Lo, a as No } from "./graphic-no-data-net-burn-l-CzmycA0m.js";
-import { S as Oo, a as _o } from "./arrow-south-east-round-PEovUgvH.js";
-const ut = {
-  infoSubheadingTextMarginTop: new W(D[0], D[0]),
-  cardsMinWidth: new W(343, 353)
-}, Dt = Fe.getLocalizedStrings().spendManagement.chargeCard.chargeCardsPromo.listPage, At = ({
-  cardPromoType: e,
-  cardText: l,
-  header: p,
-  title: i,
-  subTitle: r,
-  slidingTextList: u,
-  onClick: P
-}) => {
-  const N = we();
-  return /* @__PURE__ */ t.jsxs(
-    Uo,
-    {
-      windowSize: N,
-      cardPromoType: e,
-      "data-testid": dt("list-page-promo-card", e),
-      onClick: () => P(e),
-      children: [
-        /* @__PURE__ */ t.jsxs(on, { children: [
-          /* @__PURE__ */ t.jsxs(an, { children: [
-            /* @__PURE__ */ t.jsx(sn, { children: p }),
-            /* @__PURE__ */ t.jsx(Ao, { children: i }),
-            /* @__PURE__ */ t.jsx(Yo, { children: r })
-          ] }),
-          /* @__PURE__ */ t.jsxs(Eo, { children: [
-            /* @__PURE__ */ t.jsx(Ko, {}),
-            u.length > 0 && /* @__PURE__ */ t.jsx(it, { slideUpCount: u.length, children: u.map((A, O) => /* @__PURE__ */ t.jsx(rn, { children: A }, `card-promo-${O.toString()}`)) }),
-            /* @__PURE__ */ t.jsx(Jo, {})
-          ] })
-        ] }),
-        /* @__PURE__ */ t.jsx(qo, { children: /* @__PURE__ */ t.jsx(
-          To,
-          {
-            cardPromoType: e,
-            cardText: l,
-            shouldAnimate: !1,
-            forDashboard: !1,
-            showChip: !1,
-            forListPage: !0
-          }
-        ) }),
-        /* @__PURE__ */ t.jsx(Zo, { children: /* @__PURE__ */ t.jsx(
-          Mo,
-          {
-            cardPromoType: e,
-            cardText: l,
-            shouldAnimate: !1,
-            forDashboard: !1,
-            showChip: !1,
-            forListPage: !0
-          }
-        ) })
-      ]
-    }
-  );
-}, Gt = ({
-  cardType: e,
-  header: l,
-  title: p,
-  creditLimit: i,
-  onCreateNowClick: r
-}) => {
-  const u = we();
-  return /* @__PURE__ */ t.jsx(Ho, { windowSize: u, cardType: e, children: /* @__PURE__ */ t.jsxs(Do, { children: [
-    /* @__PURE__ */ t.jsxs(an, { children: [
-      /* @__PURE__ */ t.jsx(sn, { children: l }),
-      /* @__PURE__ */ t.jsx(Wo, { children: /* @__PURE__ */ t.jsx(Go, { children: p }) }),
-      /* @__PURE__ */ t.jsx(Xo, { windowSize: u, children: /* @__PURE__ */ t.jsxs(
-        Qo,
-        {
-          windowSize: u,
-          onClick: () => r(e),
-          "data-testid": dt("total-cashback-info"),
-          children: [
-            /* @__PURE__ */ t.jsx(rn, { children: Dt.createNow }),
-            /* @__PURE__ */ t.jsx(Vo, {})
-          ]
-        }
-      ) })
-    ] }),
-    e === "creditCard" ? /* @__PURE__ */ t.jsxs(es, { children: [
-      /* @__PURE__ */ t.jsx(ts, { children: Dt.creditLimit }),
-      /* @__PURE__ */ t.jsx(ns, { children: i })
-    ] }) : null
-  ] }) });
-}, zo = (e) => {
-  const l = e - 1;
-  let p = `
-    0% {
-      transform: translateY(0);
-    }
-  `;
-  const i = l * 3.5, r = 0.5, u = 3;
-  for (let P = 1; P < l; P++) {
-    const N = P * (u + r) * 100 / i, A = N - r * 100 / i, O = -21 * P;
-    p += `
-    ${A}% {
-      transform: translateY(${O + 21}px); 
-    }
-    ${N}% {
-      transform: translateY(${O}px);
-    }
-    `;
-  }
-  return p += `
-  ${((l - 1) * (u + r) + u) * 100 / i}% {
-    transform: translateY(${-21 * (l - 1)}px);
-  }
-  99.99% {
-    transform: translateY(${-21 * l}px);
-  }
-  100% {
-      transform: translateY(0);
-  }
-  `, no`${p}`;
-}, Uo = o.div`
-  display: flex;
-  flex-direction: ${(e) => e.windowSize === "small" ? "column" : "row"};
-  align-items: center;
-  gap: ${n.sp3};
-  background-color: ${(e) => e.cardPromoType === "debit" ? e.theme.colors.brandColorOnyx : e.theme.colors.brandColorSapphireDark};
-  border-radius: 12px;
-  padding: ${n.sp4};
-  color: white;
-  min-width: ${(e) => ut.cardsMinWidth.valuePx(e.windowSize)};
-  height: 188px;
-  box-sizing: border-box;
-  position: relative;
-  overflow: hidden;
-  cursor: pointer;
-  flex-grow: 1;
-  flex-basis: 33.33%;
-  border: 1px solid ${(e) => e.theme.colors.grey3};
-  box-shadow: ${(e) => e.theme.colors.elevation1};
-  ${(e) => e.cardPromoType === "debit" ? lt`
-          background-image: url(https://storage.googleapis.com/zeni-apis.appspot.com/images/MetalCardPattern.svg);
-          background-repeat: no-repeat;
-          background-position-x: -120px;
-          background-position-y: -54px;
-        ` : null}
-`, Ho = o.div`
-  background-color: ${(e) => e.cardType === "debitCard" ? e.theme.colors.brandColorOnyx : e.theme.colors.brandColorSapphire};
-  border-radius: 12px;
-  padding: ${n.sp4};
-  color: white;
-  box-sizing: border-box;
-  position: relative;
-  overflow: hidden;
-  min-width: ${(e) => ut.cardsMinWidth.valuePx(e.windowSize)};
-  height: 188px;
-  box-sizing: border-box;
-  background-image: url(https://storage.googleapis.com/zeni-apis.appspot.com/images/promo-list-pattern.svg);
-  background-repeat: no-repeat;
-  background-position: bottom right;
-  align-self: stretch;
-  flex-grow: 1;
-  flex-basis: 33.33%;
-  border: 1px solid ${(e) => e.theme.colors.grey3};
-  box-shadow: ${(e) => e.theme.colors.elevation1};
-`, on = o.div`
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  gap: ${n.sp5};
-`, Do = o(on)`
-  flex-direction: row;
-  justify-content: space-between;
-`, sn = o(co)`
-  color: ${(e) => e.theme.colors.brandColorGold};
-`, Ao = o(po)`
-  color: ${(e) => e.theme.colors.brandColorJade};
-`, Go = o(io)`
-  color: ${m.neutralGrey5Light};
-  white-space: pre-line;
-`, Wo = o.div`
-  width: auto;
-  text-align: left;
-`, Yo = o(se)`
-  color: ${(e) => e.theme.colors.brandColorJade};
-`, Eo = o.div`
-  display: flex;
-  align-items: center;
-  gap: ${n.sp2};
-  height: 21px;
-  overflow: hidden;
-`, it = o(se)`
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  position: relative;
-  overflow: hidden;
-  align-self: baseline;
-  width: 224px;
-  ${(e) => lt`
-    animation: ${zo(e.slideUpCount)}
-      ${(e.slideUpCount - 1) * 3.5}s ease-out infinite;
-  `}
-`, an = o.div`
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-`, Ko = o(mo)`
-  width: ${n.sp3};
-  height: ${n.sp3};
-  color: ${m.success};
-  border-radius: 50%;
-`, Jo = o(uo)`
-  width: ${n.sp4};
-  height: ${n.sp4};
-  color: ${(e) => e.theme.colors.brandColorJade};
-  margin-left: ${n.sp3};
-`, qo = o.div`
-  position: absolute;
-  top: ${n.sp2};
-  right: -29px;
-`, Zo = o.div`
-  position: absolute;
-  top: 37px;
-  right: -46px;
-`, rn = o.div``, Xo = o.div`
-  border: 1px solid ${m.neutralGrey5Light};
-  border-radius: ${n.sp12};
-  width: fit-content;
-  justify-self: ${(e) => e.windowSize === "small" ? "flex-start" : "flex-end"};
-  margin-top: ${n.sp1};
-  padding: ${n.sp0} ${n.sp2};
-`, Qo = o(pt)`
-  color: ${m.neutralGrey5Light};
-  margin-top: ${(e) => ut.infoSubheadingTextMarginTop.valuePx(e.windowSize)};
-  gap: ${n.sp1};
-  display: flex;
-  align-items: center;
-  cursor: pointer;
-`, Vo = o(mt)`
-  color: ${m.neutralGrey5Light};
-  width: ${n.sp2};
-  height: ${n.sp2};
-`, es = o.div`
-  display: flex;
-  flex-direction: column;
-  align-items: flex-end;
-`, ts = o(pt)`
-  color: ${m.neutralGrey5Light};
-`, ns = o(lo)`
-  color: ${m.neutralGrey5Light};
-`, me = "spendLimit", Y = Fe.getLocalizedStrings().spendManagement.chargeCard.updateSpendLimitPopup;
-function os({
-  currentSpentAmount: e,
-  hasCreditCard: l,
-  hasDebitCard: p,
-  maxLimitAmountForCreditCard: i,
-  maxLimitAmountForDebitCard: r,
-  isDisabled: u,
-  updateLimitFetchState: P,
-  onCancelClick: N,
-  onSubmitClick: A
-}) {
-  const O = we(), ae = "SpendLimitForm", E = Xn({
-    mode: "onBlur",
-    reValidateMode: "onBlur",
-    defaultValues: { [me]: void 0 }
-  }), {
-    control: Le,
-    formState: { errors: Ne }
-  } = E, [Oe, _e] = U(
-    void 0
-  ), g = Qn({
-    control: Le,
-    name: me
-  }), y = () => {
-    N();
-  }, k = E.handleSubmit(() => {
-    const C = E.getValues(me);
-    C != null && A(C);
-  }), j = Vn(Ne, me), ge = Fe.getLocalizedStrings().common, K = Me.largeLabelWidth.value(O);
-  return ue(() => {
-    _e(
-      ss(
-        e,
-        l,
-        p,
-        i,
-        r,
-        g
-      )
-    );
-  }, [
-    g,
-    e,
-    i,
-    r,
-    l,
-    p
-  ]), /* @__PURE__ */ t.jsx(as, { windowSize: O, role: "presentation", children: /* @__PURE__ */ t.jsx(eo, { onClickAway: () => N(), children: /* @__PURE__ */ t.jsxs(rs, { windowSize: O, children: [
-    /* @__PURE__ */ t.jsx(to, { ...E, children: /* @__PURE__ */ t.jsxs(
-      ms,
-      {
-        id: ae,
-        onSubmit: (C) => {
-          C.preventDefault(), k();
-        },
-        children: [
-          /* @__PURE__ */ t.jsx(cs, { windowSize: O, children: Y.heading }),
-          /* @__PURE__ */ t.jsx(ps, { hasError: j, children: /* @__PURE__ */ t.jsx(
-            ho,
-            {
-              label: {
-                label: Y.newLimit,
-                width: K
-              },
-              showAdditionalInfoLabel: j,
-              additionalInfoLabel: Oe,
-              formattedTextField: {
-                type: "number",
-                name: me,
-                defaultValue: void 0,
-                placeholder: Y.placeholder,
-                returnValueType: "floatValue",
-                prefix: "$",
-                allowNegative: !0,
-                isNumericString: !1,
-                registerOptions: {
-                  required: !0,
-                  validate: (C) => {
-                    if (!C || C <= 0 || C <= e.amount)
-                      return !1;
-                    if (p && l && r != null && i != null) {
-                      const I = Math.min(
-                        r.amount,
-                        i.amount
-                      );
-                      if (C > I)
-                        return !1;
-                    } else {
-                      if (p && r != null && C > r.amount)
-                        return !1;
-                      if (l && i != null && C > i.amount)
-                        return !1;
-                    }
-                    return !0;
-                  }
-                },
-                autoComplete: "off",
-                decimalSeparator: ".",
-                decimalScale: 2,
-                fixedDecimalScale: !1,
-                thousandSeparator: !0
-              },
-              style: {
-                width: "auto"
-              },
-              showOutlineOnFocus: !1
-            }
-          ) })
-        ]
-      }
-    ) }),
-    /* @__PURE__ */ t.jsx(ds, { children: /* @__PURE__ */ t.jsxs(is, { children: [
-      /* @__PURE__ */ t.jsx(
-        zt,
-        {
-          label: ge.cancel,
-          onClick: y,
-          style: { width: 84 }
-        }
-      ),
-      /* @__PURE__ */ t.jsx(ls, {}),
-      /* @__PURE__ */ t.jsx(
-        zt,
-        {
-          variant: "primary",
-          label: ge.texts.update,
-          style: { width: 84, whiteSpace: "nowrap" },
-          loading: P === "In-Progress",
-          type: "submit",
-          form: ae,
-          disabled: u
-        }
-      )
-    ] }) })
-  ] }) }) });
-}
-const ss = (e, l, p, i, r, u) => {
-  if (u != null) {
-    if (u <= e.amount)
-      return Y.amountBelowErrorBulk;
-    if (p && l && r != null && i != null) {
-      const P = Math.min(
-        r.amount,
-        i.amount
-      );
-      if (u > P) {
-        const N = r.amount < i.amount ? "debit" : "credit", A = r.amount < i.amount ? r : i;
-        return Y.maxLimitForCardTypeError.replace("_card_type_", N).replace("_amount_", he("0,0.[00]", A));
-      }
-    } else {
-      if (p && r != null && u > r.amount)
-        return Y.maxLimitForCardTypeError.replace("_card_type_", "debit").replace(
-          "_amount_",
-          he("0,0.[00]", r)
-        );
-      if (l && i != null && u > i.amount)
-        return Y.maxLimitForCardTypeError.replace("_card_type_", "credit").replace(
-          "_amount_",
-          he("0,0.[00]", i)
-        );
-    }
-  }
-}, Me = {
-  width: new W(343, 500, 500),
-  largeLabelWidth: new W(108, 108, 108),
-  popupLeftRightPadding: new W(D[5], D[6]),
-  popupTopBottomPadding: new W(D[5], D[5])
-}, as = o.div`
-  position: fixed;
-  top: ${n.sp0};
-  left: ${n.sp0};
-  width: 100%;
-  z-index: 100;
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  background: ${m.overlayDark};
-`, rs = o.div`
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  flex-wrap: wrap;
-  align-items: center;
-  text-align: center;
-  background: ${(e) => e.theme.colors.grey4};
-  border-radius: ${n.sp2};
-  position: relative;
-  margin: auto;
-  width: ${(e) => Me.width.valuePx(e.windowSize)};
-  padding: ${(e) => `${Me.popupTopBottomPadding.valuePx(e.windowSize)} ${Me.popupLeftRightPadding.valuePx(e.windowSize)}`};
-  box-sizing: border-box;
-`, cs = o(fo)`
-  color: ${(e) => e.theme.colors.primary};
-  margin-bottom: ${n.sp3};
-`, is = o.div`
-  display: flex;
-  justify-content: center;
-  padding-top: ${n.sp4};
-`, ls = o.div`
-  width: ${n.sp3};
-`, ds = o.div`
-  display: flex;
-  flex-direction: column;
-`, ps = o.div`
-  border: ${(e) => `1px solid ${e.theme.colors.grey3}`};
-  box-shadow: ${(e) => `${n.sp0} 1px 2px ${n.sp0} ${e.theme.colors.issueChargeCardBackgroundShadow}`};
-  border-radius: ${n.sp2};
-  background-color: ${(e) => e.theme.colors.grey5};
-  width: 100%;
-  :hover {
-    border: ${(e) => `1px solid ${e.theme.colors.primary}`};
-    input {
-      background-color: ${(e) => e.hasError ? m.importantLight : e.theme.colors.background} !important;
-    }
-  }
-`, ms = o.form`
-  display: contents;
-`, fe = {
-  contentContainerMargin: new W(D[3], D[4], D[8]),
-  infoSubheadingTextMarginTop: new W(D[0], D[0]),
-  cardsMinWidth: new W(343, 353)
-}, us = {
-  remainingText: new Co("largeRegular", "largeRegular")
-}, {
-  spendManagement: {
-    chargeCard: {
-      payEarly: S,
-      cardList: H,
-      chargeCardsPromo: x
-    }
-  },
-  common: L,
-  dateFormat: Pe
-} = Fe.getLocalizedStrings(), sa = ({
-  chargeCardListView: e,
-  searchText: l,
-  admins: p,
-  companyLegalName: i,
-  onFetchChargeCardsRecurringExpenses: r,
-  onFetchDepositAccountLimit: u,
-  onCloseChargeCard: P,
-  onCloseChargeCardList: N,
-  onLockChargeCard: A,
-  onLockChargeCardList: O,
-  onUnlockChargeCardList: ae,
-  updateChargeCardListSpendLimit: E,
-  onUpdateSpendLimit: Le,
-  isCardControlsEnabled: Ne,
-  isCashbackFeatureEnabled: Oe,
-  creditCardPayNowThreshold: _e,
-  isChargeCardFeatureEnabled: g,
-  isDebitCardFeatureEnabled: y,
-  isDebitCardSetupEnabled: k,
-  isChargeCardSetupEnabled: j,
-  companyChargeCardInfoCreditAccountLimit: ge,
-  controllerEmails: K,
-  onRevokeChargeCardList: C,
-  depositAccountListWithDebitCardIssued: I,
-  chargeCardCashbackDetailState: b,
-  uiState: dn,
-  signedInUser: ze,
-  creditLimit: xe,
-  cashbackRate: Ue,
-  onSearchTextChanged: pn,
-  onClickSetupIcon: mn,
-  isEarlyPayEnabled: re,
-  onClickStatementsIcon: un,
-  onChargeCardRowClick: hn,
-  updateChargeCardName: fn,
-  onChargeCardResendInviteClick: gn,
-  onChargeCardRevokeInviteClick: ht,
-  onUnlockChargeCard: ft,
-  onIssueCardClick: xn,
-  onBackClick: Sn,
-  onReloadCards: yn,
-  onTotalCashbackClick: Cn,
-  onColumnSortConfigChanged: bn,
-  onClickMenuIcon: $n,
-  onPromoCardClick: gt,
-  onCreateNowClick: xt,
-  showPayNowInfoTooltip: vn,
-  navigateToCreditCardPaymentPage: Se,
-  shouldShowPayNowInfoTooltip: He,
-  rowActionView: s,
-  bulkActionView: d,
-  onSetRowActionCardId: De,
-  onSetBulkActionCardIds: $
-}) => {
-  const ye = go().analytics, [St, kn] = U(!1), [Ae, Ce] = U(!1), [Ge, be] = U(!1), [jn, J] = U(!1), [In, q] = U(!1), [Rn, $e] = U(!1), [We, Ye] = U(!1), [Ee, Ke] = U(!1), [Je, yt] = U(void 0), Bn = d.chargeCards[0]?.status.code, { creditAccount: f, creditAccountRepayment: R } = e, B = pe(() => {
-    De(void 0), yt(void 0);
-  }, [De]), T = d.chargeCards, Pn = te(() => T.length === 0 ? void 0 : T.reduce(
-    (c, w) => w.balance.amount > c.balance.amount ? w : c,
-    T[0]
-  ).balance, [T]), Tn = te(() => {
-    const a = T.filter(
-      (_) => _.type.code.includes("debit")
-    );
-    if (a.length === 0)
-      return;
-    const c = a.map((_) => I.depositAccounts.find(
-      (Zn) => Zn.id === _.connectedAccountId
-    )?.cardLimits.dailyCardTransactionLimit).filter((_) => _ !== void 0);
-    return c.length === 0 ? void 0 : c.reduce(
-      (_, de) => de.amount < _.amount ? de : _
-    );
-  }, [
-    T,
-    I.depositAccounts
-  ]), Ct = z(
-    e.unlockChargeCardsFetchState.fetchState
-  ), bt = z(
-    e.revokeChargeCardsInviteFetchState.fetchState
-  ), $t = z(
-    e.lockChargeCardsFetchState.fetchState
-  ), vt = z(
-    e.closeChargeCardsFetchState.fetchState
-  ), kt = z(
-    e.updateChargeCardsSpendLimitFetchState.fetchState
-  );
-  ue(() => {
-    const a = Ct === "In-Progress" && e.unlockChargeCardsFetchState.fetchState === "Completed", c = bt === "In-Progress" && e.revokeChargeCardsInviteFetchState.fetchState === "Completed", w = $t === "In-Progress" && e.lockChargeCardsFetchState.fetchState === "Completed", _ = vt === "In-Progress" && e.closeChargeCardsFetchState.fetchState === "Completed", de = kt === "In-Progress" && e.updateChargeCardsSpendLimitFetchState.fetchState === "Completed";
-    (a || c) && $([]), w && (J(!1), $([])), _ && (q(!1), $([])), de && ($e(!1), $([]));
-  }, [
-    e.unlockChargeCardsFetchState.fetchState,
-    e.revokeChargeCardsInviteFetchState.fetchState,
-    e.lockChargeCardsFetchState.fetchState,
-    e.closeChargeCardsFetchState.fetchState,
-    e.updateChargeCardsSpendLimitFetchState.fetchState,
-    Ct,
-    bt,
-    $t,
-    vt,
-    kt,
-    $
-  ]);
-  const Z = s.cardId != null ? s.unlockChargeCardsFetchState.fetchState : void 0, jt = z(
-    Z
-  ), qe = s.cardId != null ? s.updateChargeCardLimitFetchState.fetchState : void 0, It = z(
-    qe
-  ), Ze = s.cardId != null ? s.updateChargeCardNameFetchState.fetchState : void 0, Rt = z(
-    Ze
-  ), Xe = s.cardId != null ? s.lockChargeCardsFetchState.fetchState : void 0, Bt = z(
-    Xe
-  ), Qe = s.cardId != null ? s.closeChargeCardsFetchState.fetchState : void 0, Pt = z(
-    Qe
-  ), X = s.cardId != null ? s.revokeChargeCardFetchState.fetchState : void 0, Tt = z(
-    X
-  );
-  ue(() => {
-    s.cardId != null && jt === "In-Progress" && Z === "Completed" ? B() : s.cardId != null && It === "In-Progress" && qe === "Completed" ? (Ke(!1), B()) : s.cardId != null && Rt === "In-Progress" && Ze === "Completed" ? (Ye(!1), B()) : s.cardId != null && Bt === "In-Progress" && Xe === "Completed" ? (Ce(!1), B()) : s.cardId != null && Pt === "In-Progress" && Qe === "Completed" ? (be(!1), B()) : s.cardId != null && Tt === "In-Progress" && X === "Completed" && B();
-  }, [
-    s.cardId,
-    Z,
-    qe,
-    Ze,
-    Xe,
-    Qe,
-    X,
-    jt,
-    Rt,
-    It,
-    Bt,
-    Pt,
-    Tt,
-    B
-  ]);
-  const Mn = pe(
-    (a) => {
-      switch (a) {
-        case "close":
-          r(d.bulkActionCardIds), q(!0);
-          break;
-        case "lock":
-          r(d.bulkActionCardIds), J(!0);
-          break;
-        case "unlock":
-          ae(d.bulkActionCardIds);
-          break;
-        case "update_limit":
-          $e(!0);
-          break;
-        case "revoke_invite":
-          C(d.bulkActionCardIds);
-          break;
-      }
-    },
-    [
-      d.bulkActionCardIds,
-      r,
-      C,
-      ae
-    ]
-  ), h = s.chargeCard;
-  ue(() => {
-    if (!(Je === void 0 || s.cardId === void 0 || h === void 0))
-      switch (Je) {
-        case oe.CLOSE:
-          Ge || (r([s.cardId]), be(!0));
-          break;
-        case oe.LOCK:
-          Ae || (r([s.cardId]), Ce(!0));
-          break;
-        case oe.UNLOCK:
-          Z !== "In-Progress" && Z !== "Completed" && ft(s.cardId);
-          break;
-        case oe.REVOKE_INVITE:
-          X !== "In-Progress" && X !== "Completed" && ht(s.cardId);
-          break;
-        case oe.RENAME:
-          We || Ye(!0);
-          break;
-        case oe.UPDATE_SPEND_LIMIT:
-          Ee || (h.type.code.includes("debit") && s.depositAccountLimitFetchState.fetchState !== "Completed" && u(
-            h.connectedAccountId,
-            s.cardId
-          ), Ke(!0));
-          break;
-      }
-  }, [
-    Je,
-    s.cardId,
-    // selectedCardForRowAction is intentionally excluded from dependencies
-    // to prevent re-triggering when cards list updates after operations complete
-    // showChangeSpendLimitPopup, showRenamePopup, showCloseDrawer, showLockDrawer are used as guards to prevent reopening
-    Ee,
-    We,
-    Ge,
-    Ae,
-    Z,
-    X,
-    r,
-    u,
-    ft,
-    ht
-  ]);
-  const Ve = xo(), Q = !!Ve.loggedInUserRole.includes("charge_card_user"), ve = So(Ve), v = oo(
-    Ve.loggedInUserRoleMap
-  ), V = te(
-    () => v === !0 ? {
-      creditCardCashbackOffer: `${b.cashbackAnalytics.creditCardCashbackOffer}%`,
-      debitCardCashbackOffer: `${b.cashbackAnalytics.debitCardCashbackOffer}%`,
-      totalEarnedCashback: G(
-        b.cashbackSummary.cashbackEarned.amount
-      ),
-      redeemedCashback: G(
-        b.cashbackSummary.cashbackRedeemed.amount
-      ),
-      availableCashback: G(
-        b.cashbackSummary.cashbackAvailable.amount
-      ),
-      creditCardCashbackRedemptionMode: b.cashbackAnalytics.creditCardCashbackRedemptionMode,
-      debitCardCashbackRedemptionMode: b.cashbackAnalytics.debitCardCashbackRedemptionMode
-    } : void 0,
-    [
-      v,
-      b.cashbackAnalytics.creditCardCashbackOffer,
-      b.cashbackAnalytics.debitCardCashbackOffer,
-      b.cashbackSummary.cashbackEarned.amount,
-      b.cashbackSummary.cashbackRedeemed.amount,
-      b.cashbackSummary.cashbackAvailable.amount,
-      b.cashbackAnalytics.creditCardCashbackRedemptionMode,
-      b.cashbackAnalytics.debitCardCashbackRedemptionMode
-    ]
-  ), ke = te(
-    () => g && j && v === !0 ? {
-      creditAccountId: f.id,
-      creditAccountLimit: G(
-        f.limit.amount
-      ),
-      creditAccountAvailableAmount: G(
-        f.available.amount
-      ),
-      creditAccountSpentAmount: G(
-        f.balance.amount + f.hold.amount
-      ),
-      creditAccountStatus: f.status,
-      outstandingBalance: G(
-        R.remainingAmountDue.amount
-      )
-    } : void 0,
-    [
-      g,
-      j,
-      v,
-      f.id,
-      f.limit.amount,
-      f.available.amount,
-      f.balance.amount,
-      f.hold.amount,
-      f.status,
-      R.remainingAmountDue.amount
-    ]
-  ), je = te(
-    () => y && k ? {
-      debitAccountId: I.depositAccounts.map(
-        (a) => a.id
-      ),
-      debitAccountName: I.depositAccounts.map(
-        (a) => a.accountName
-      ),
-      debitAccountBalance: I.depositAccounts.map(
-        (a) => G(a.accountBalance.available.amount)
-      ),
-      debitCardsSpend: G(
-        e.debitCardSummary?.currentMonthSpends?.amount ?? 0
-      ),
-      debitAccountStatus: I.depositAccounts.map(
-        (a) => a.accountStatus
-      )
-    } : void 0,
-    [
-      y,
-      k,
-      I.depositAccounts,
-      e.debitCardSummary?.currentMonthSpends?.amount
-    ]
-  ), Ie = {
-    isCreditCardOffered: g,
-    isDebitCardOffered: y,
-    isDebitCardEnabled: k,
-    isCreditCardEnabled: j
-  }, wn = (a) => {
-    kn(a), a === !0 && (ye.trackCardsListPageClicked("search"), (!g || f.fetchState === "Completed" && R.fetchState === "Completed") && (!(y && k) || I.fetchState === "Completed") && V != null && ye.trackCardsCardListSearchClick(
-      K,
-      Ie,
-      V,
-      ke,
-      je
-    ));
-  }, M = we(), Mt = ve && !v, wt = e.creditAccount.balance.amount + e.creditAccount.hold.amount, ce = {
-    amount: wt,
-    currencyCode: e.creditAccount.balance.currencyCode,
-    currencySymbol: e.creditAccount.balance.currencySymbol
-  }, et = Math.round(
-    ce.amount * 100 / e.creditAccount.limit.amount
-  ), Fn = isNaN(et) ? 0 : wt !== 0 && et === 0 ? 1 : et, ie = e.chargeCardConfig.rePaymentInfo?.cardLimitResetDate, tt = v && ce.amount > _e * e.creditAccount.limit.amount / 100, le = ie != null && R.initiatedRepayments.amount > 0, Ln = {
-    entity: "charge_cards",
-    showNewButtonOnNavbar: v,
-    showEntityEmailInfoIconOnNavbar: !1,
-    newButtonLabel: v ? H.newBtnLabel : L.strings.empty,
-    hideSearchBtn: Q,
-    searchTextBoxStyle: {
-      right: Mt ? n.sp4 : "96px"
-    },
-    moreIconContainerStyle: {
-      paddingRight: Mt ? n.sp0 : n.sp4
-    },
-    isSearchOpen: St,
-    searchPlaceHolder: H.searchPlaceHolder,
-    searchText: l,
-    //show more button in navbar only when user is not charge card user
-    showSettingsIcon: !Q,
-    //show settings icon in more button only when user is charge card admin
-    showSettingsIconOnNavbar: v,
-    showStatementButtonOnNavbar: g && j,
-    showPayEarlyButtonOnNavbar: re && v && ce.amount > 0 && !le && !tt,
-    showDownloadButtonOnNavbar: !1,
-    disableDownloadButton: !0,
-    analytics: ye,
-    onSearchOpen: wn,
-    onSearchTextChanged: pn,
-    onClickSetupIcon: mn,
-    onClickStatementsIcon: un,
-    downloadState: "Not-Started",
-    onNewButtonClick: xn,
-    onClickPayEarlyIcon: () => Se("More Button", "Pay Early"),
-    onMenuOpen: () => {
-      (!g || f.fetchState === "Completed" && R.fetchState === "Completed") && (!(y && k) || I.fetchState === "Completed") && V != null && ye.trackCardsCardListMoreMenuClick(
-        K,
-        Ie,
-        V,
-        ke,
-        je
-      );
-    },
-    filters: {
-      categoryCombinationOperator: "AND",
-      categories: []
-    }
-  }, Nn = /* @__PURE__ */ t.jsx(
-    Io,
-    {
-      spendManagementSectionProps: Ln
-    }
-  ), On = e.cards.length === 0 ? !1 : Q && so(e.cards), _n = e.fetchState === "Completed" ? bs({
-    isChargeCardFeatureEnabled: g,
-    isChargeCardSetupEnabled: j,
-    isDebitCardFeatureEnabled: y,
-    isDebitCardSetupEnabled: k
-  }) : "", Re = e.debitCardSummary != null ? e.debitCardSummary.currentMonthSpends.amount - e.debitCardSummary.lastCompletedMonthSpends.amount : 0, zn = g && j && e.hasCreditCard, Un = y && k && e.hasDebitCard, Hn = g && j && ve && !v, Dn = y && k && ve && !v, Be = e.chargeCardConfig.rePaymentInfo?.rePaymentDueDate?.diff(
-    _t(),
-    "days"
-  ) ?? 0, nt = [
-    S.payNow,
-    Be > 0 && Be < 11 ? `${S.billDueIn} ${Be} ${Be === 1 ? L.timeStrings.day : L.timeStrings.days}` : S.creditLimitLow,
-    S.payNow
-  ], Ft = R.initiatedRepayments.amount === f.balance.amount + f.hold.amount, ot = [
-    S.paymentInitiated,
-    `${H.header.limit} ${Ft ? L.resets : L.updates} ${L.by} ${ao(
-      ro(
-        R.initiatedRepaymentDate?.toDate() ?? _t().toDate(),
-        [0, 6],
-        3
-      ).toDateString()
-    ).format(Pe.visual.MMMDFormat)}`,
-    S.paymentInitiated
-  ], st = Ot(null), at = Ot(null), An = tn(), [
-    Gn,
-    Lt
-  ] = U(!0);
-  ue(() => {
-    const a = () => {
-      at.current && (at.current.getBoundingClientRect().top < (M === "small" ? 68 : 40) ? Lt(!1) : Lt(!0));
-    };
-    a();
-    const c = () => {
-      a();
-    }, w = st.current;
-    return w && w.addEventListener("scroll", c), window.addEventListener("scroll", c), () => {
-      w && w.removeEventListener("scroll", c), window.removeEventListener("scroll", c);
-    };
-  }, [M]);
-  const Wn = (a) => {
-    const c = a.reasonType === "other" ? a.reason : a.reasonType;
-    s.cardId != null && P(s.cardId, c);
-  }, Yn = (a) => {
-    const c = a.reasonType === "other" ? a.reason : a.reasonType;
-    s.cardId != null && A(s.cardId, c);
-  }, En = (a) => {
-    const c = a.reasonType === "other" ? a.reason : a.reasonType;
-    N(d.bulkActionCardIds, c);
-  }, Kn = (a) => {
-    const c = a.reasonType === "other" ? a.reason : a.reasonType;
-    O(d.bulkActionCardIds, c);
-  }, ee = te(() => {
-    const a = {};
-    return d.chargeCards.forEach((c) => {
-      a[c.id] = c;
-    }), {
-      chargeCardsByCardId: a,
-      cardRecurringExpensesByCardId: d.recurringExpensesByCardId,
-      fetchState: d.recurringExpensesFetchState.fetchState
-    };
-  }, [d]), Jn = pe(() => {
-    r(d.bulkActionCardIds), J(!0);
-  }, [d.bulkActionCardIds, r]), qn = pe(() => {
-    r(d.bulkActionCardIds), q(!0);
-  }, [d.bulkActionCardIds, r]), Nt = pe(
-    (a) => {
-      const c = d.bulkActionCardIds.filter(
-        (w) => w !== a
-      );
-      $(c), c.length === 0 && (J(!1), q(!1));
-    },
-    [d.bulkActionCardIds, $]
-  );
-  return /* @__PURE__ */ t.jsxs(Ps, { ref: st, children: [
-    /* @__PURE__ */ t.jsx(
-      yo,
-      {
-        title: _n,
-        showBackButton: !0,
-        showMenuIcon: M === "medium-compact" || M === "small",
-        onClickMenuIcon: $n,
-        style: { zIndex: 3 },
-        onBackClick: Sn,
-        rightSideComponent: Nn,
-        isSearchOpen: St,
-        hideSearchBtn: Q,
-        scrollableContent: st,
-        source: "ChargeCardListPage",
-        backgroundColor: An.colors.grey4
-      }
-    ),
-    e.fetchState === "Not-Started" || e.fetchState === "In-Progress" ? /* @__PURE__ */ t.jsx(
-      jo,
-      {
-        fetchState: e.fetchState,
-        styles: { margin: "auto" }
-      }
-    ) : /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      Q ? null : /* @__PURE__ */ t.jsxs(Ts, { windowSize: M, children: [
-        zn || Hn ? /* @__PURE__ */ t.jsxs(Jt, { windowSize: M, children: [
-          /* @__PURE__ */ t.jsxs(Qt, { children: [
-            /* @__PURE__ */ t.jsxs(Vt, { children: [
-              /* @__PURE__ */ t.jsxs(en, { children: [
-                /* @__PURE__ */ t.jsx(Zt, { children: H.creditCardBalance }),
-                /* @__PURE__ */ t.jsx(
-                  ne,
-                  {
-                    amount: ce,
-                    integerStyles: {
-                      ...F.h5Regular.cssObject
-                    },
-                    decimalStyles: {
-                      ...F.largeSemiBold.cssObject
-                    }
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ t.jsxs(js, { children: [
-                /* @__PURE__ */ t.jsx(Te, { style: { textAlign: "end" }, children: L.texts.limit }),
-                /* @__PURE__ */ t.jsx(
-                  ne,
-                  {
-                    amount: e.creditAccount.limit,
-                    style: {
-                      justifyContent: "end"
-                    },
-                    integerStyles: F.largeRegular.cssObject,
-                    decimalStyles: F.smallRegular.cssObject
-                  }
-                )
-              ] })
-            ] }),
-            /* @__PURE__ */ t.jsx(_s, { children: /* @__PURE__ */ t.jsx(
-              zs,
-              {
-                style: {
-                  width: `${Fn}%`,
-                  borderRadius: n.sp1
-                }
-              }
-            ) }),
-            tt && !le && re ? /* @__PURE__ */ t.jsx(
-              rt,
-              {
-                placement: "bottom",
-                style: {
-                  color: m.heroDark,
-                  padding: `12px ${n.sp3}`
-                },
-                title: /* @__PURE__ */ t.jsx(ys, { children: S.creditLimitIsRunningLow }),
-                children: /* @__PURE__ */ t.jsxs(qt, { children: [
-                  /* @__PURE__ */ t.jsx(
-                    ne,
-                    {
-                      amount: e.creditAccount.available,
-                      integerStyles: F.largeMedium.cssObject,
-                      decimalStyles: F.smallMedium.cssObject
-                    }
-                  ),
-                  /* @__PURE__ */ t.jsx(Xt, { windowSize: M, children: L.texts.remaining }),
-                  /* @__PURE__ */ t.jsx(Cs, { children: /* @__PURE__ */ t.jsx(Ss, {}) })
-                ] })
-              }
-            ) : /* @__PURE__ */ t.jsxs(qt, { children: [
-              /* @__PURE__ */ t.jsx(
-                ne,
-                {
-                  amount: e.creditAccount.available,
-                  integerStyles: F.largeMedium.cssObject,
-                  decimalStyles: F.smallMedium.cssObject
-                }
-              ),
-              /* @__PURE__ */ t.jsx(Xt, { windowSize: M, children: L.texts.remaining })
-            ] })
-          ] }),
-          /* @__PURE__ */ t.jsxs(
-            Is,
-            {
-              showPaymentInitiatedInfo: le,
-              isEarlyPayEnabled: re,
-              children: [
-                le && re ? null : /* @__PURE__ */ t.jsx(Te, { children: `${L.texts.limitReset} ${ie != null ? ie.format(
-                  Pe.visual.MMMDFormat
-                ) : null}` }),
-                v && re && (le ? /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-                  rt,
-                  {
-                    maxWidth: "242px",
-                    style: {
-                      padding: `12px ${n.sp3}`
-                    },
-                    title: /* @__PURE__ */ t.jsxs($s, { children: [
-                      /* @__PURE__ */ t.jsx(Kt, { children: `${S.paymentOf} ${he(
-                        "0,0.[00]",
-                        {
-                          amount: R.initiatedRepayments.amount,
-                          currencyCode: R.initiatedRepayments.currencyCode,
-                          currencySymbol: R.initiatedRepayments.currencySymbol
-                        }
-                      )} ${S.madeOn} ` }),
-                      /* @__PURE__ */ t.jsx(vs, { children: R.initiatedRepaymentDate?.format(
-                        Pe.visual.MMMDFormat
-                      ) }),
-                      L.strings.space,
-                      /* @__PURE__ */ t.jsx(Kt, { children: Ft ? S.isProcessingAndWillResetTheCreditLimitIn23BusinessDays : S.isProcessingAndWillUpdateTheCreditLimitIn23BusinessDays })
-                    ] }),
-                    placement: "bottom",
-                    children: /* @__PURE__ */ t.jsxs(Wt, { hasPointer: !1, children: [
-                      ot.length > 0 && /* @__PURE__ */ t.jsx(
-                        it,
-                        {
-                          slideUpCount: ot.length,
-                          style: {
-                            alignItems: "flex-end",
-                            width: "auto"
-                          },
-                          children: ot.map(
-                            (a, c) => /* @__PURE__ */ t.jsx(
-                              fs,
-                              {
-                                children: a
-                              },
-                              `card-payment-initiated-${c.toString()}`
-                            )
-                          )
-                        }
-                      ),
-                      /* @__PURE__ */ t.jsx(xs, {})
-                    ] })
-                  }
-                ) }) : tt ? /* @__PURE__ */ t.jsx(
-                  rt,
-                  {
-                    variant: "informative",
-                    arrow: !0,
-                    style: {
-                      top: n.sp2,
-                      left: "22px",
-                      position: "relative"
-                    },
-                    data: {
-                      preHeading: "URGENT",
-                      heading: S.creditLimitIsLow,
-                      description: S.transactionsMayBeDeclinedBecauseTheCreditLimitIsRunningLow,
-                      buttonText: S.payNow,
-                      tooltipContentStyle: {
-                        width: "240px",
-                        boxSizing: "content-box",
-                        gap: n.sp0
-                      },
-                      tooltipIntroductionStyle: {
-                        color: m.important
-                      },
-                      buttonStyle: {
-                        width: "31%"
-                      },
-                      onButtonClick: () => {
-                        He(!1), Se(
-                          "Toast Button",
-                          "Pay Now"
-                        );
-                      },
-                      showCloseButton: !0,
-                      onClose: (a) => {
-                        a.preventDefault(), a.stopPropagation(), He(!1);
-                      }
-                    },
-                    title: "informative",
-                    placement: "bottom-end",
-                    open: vn && // only show the tooltip if the Pay Now SlidingTextContainer is visible
-                    // this is to avoid the tooltip from being shown when the container is scrolled and positioned below the navbar
-                    Gn,
-                    children: /* @__PURE__ */ t.jsxs(
-                      Wt,
-                      {
-                        ref: at,
-                        onClick: () => {
-                          He(!1), Se(
-                            "Text Button",
-                            "Pay Now"
-                          );
-                        },
-                        hasPointer: !0,
-                        children: [
-                          nt.length > 0 && /* @__PURE__ */ t.jsx(
-                            it,
-                            {
-                              slideUpCount: nt.length,
-                              style: {
-                                alignItems: "flex-end",
-                                width: "auto"
-                              },
-                              children: nt.map((a, c) => /* @__PURE__ */ t.jsx(
-                                hs,
-                                {
-                                  isImportant: c === 1,
-                                  children: a
-                                },
-                                `card-pay-now-${c.toString()}`
-                              ))
-                            }
-                          ),
-                          /* @__PURE__ */ t.jsx(Yt, {})
-                        ]
-                      }
-                    )
-                  }
-                ) : ce.amount > 0 ? /* @__PURE__ */ t.jsxs(
-                  gs,
-                  {
-                    onClick: () => Se(
-                      "Text Button",
-                      "Pay Early"
-                    ),
-                    children: [
-                      S.payEarly,
-                      /* @__PURE__ */ t.jsx(Yt, {})
-                    ]
-                  }
-                ) : null)
-              ]
-            }
-          )
-        ] }) : g && j ? /* @__PURE__ */ t.jsx(
-          Gt,
-          {
-            cardType: "creditCard",
-            header: x.listPage.spendSmarter,
-            title: x.listPage.setUpText.replace(
-              "__cardType__",
-              x.listPage.credit
-            ),
-            creditLimit: ct(
-              "0,0",
-              xe.amount,
-              xe.currencySymbol
-            ),
-            onCreateNowClick: xt
-          }
-        ) : g ? /* @__PURE__ */ t.jsx(
-          At,
-          {
-            cardPromoType: "credit",
-            cardText: x.listPage.creditCards,
-            header: x.listPage.getAccessTo,
-            title: x.listPage.creditCards,
-            subTitle: x.listPage.promoSubText.credit,
-            slidingTextList: Et(
-              "credit",
-              Ue,
-              {
-                amount: ge,
-                currencyCode: xe.currencyCode,
-                currencySymbol: xe.currencySymbol
-              }
-            ),
-            onClick: gt
-          }
-        ) : null,
-        Un || Dn ? /* @__PURE__ */ t.jsxs(Jt, { windowSize: M, children: [
-          /* @__PURE__ */ t.jsxs(Qt, { children: [
-            /* @__PURE__ */ t.jsx(Vt, { children: /* @__PURE__ */ t.jsxs(en, { children: [
-              /* @__PURE__ */ t.jsx(Zt, { children: H.debitCardSpend }),
-              /* @__PURE__ */ t.jsx(
-                ne,
-                {
-                  amount: e.debitCardSummary?.currentMonthSpends,
-                  integerStyles: {
-                    ...F.h5Regular.cssObject
-                  },
-                  decimalStyles: {
-                    ...F.largeSemiBold.cssObject
-                  }
-                }
-              )
-            ] }) }),
-            /* @__PURE__ */ t.jsx(ws, { children: Re !== 0 ? /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-              Re < 0 ? /* @__PURE__ */ t.jsx(Ls, {}) : /* @__PURE__ */ t.jsx(Ns, {}),
-              /* @__PURE__ */ t.jsx(
-                Fs,
-                {
-                  hasNegativeValue: Re < 0,
-                  children: ct(
-                    "0,0.00",
-                    Re,
-                    e.debitCardSummary?.currentMonthSpends.currencySymbol
-                  )
-                }
-              ),
-              /* @__PURE__ */ t.jsx(ln, { children: H.compareToLastMonth })
-            ] }) : null })
-          ] }),
-          /* @__PURE__ */ t.jsx(cn, { children: /* @__PURE__ */ t.jsx(Te, { children: `${L.texts.limitReset} ${ie != null ? ie.format(
-            Pe.visual.MMMDFormat
-          ) : null}` }) })
-        ] }) : y && k ? /* @__PURE__ */ t.jsx(
-          Gt,
-          {
-            cardType: "debitCard",
-            header: x.listPage.spendSmarter,
-            title: x.listPage.setUpText.replace(
-              "__cardType__",
-              x.listPage.debit
-            ),
-            onCreateNowClick: xt
-          }
-        ) : y ? /* @__PURE__ */ t.jsx(
-          At,
-          {
-            cardPromoType: "debit",
-            cardText: x.listPage.debitCards,
-            header: x.listPage.getAccessTo,
-            title: x.listPage.debitCards,
-            subTitle: x.listPage.promoSubText.debit,
-            slidingTextList: Et(
-              "debit",
-              Ue
-            ),
-            onClick: gt
-          }
-        ) : null,
-        /* @__PURE__ */ t.jsxs(Ms, { windowSize: M, children: [
-          Oe ? /* @__PURE__ */ t.jsxs(ks, { children: [
-            /* @__PURE__ */ t.jsx(Te, { style: { textAlign: "start" }, children: H.totalCashback }),
-            /* @__PURE__ */ t.jsx(
-              ne,
-              {
-                amount: e.totalCashback,
-                style: {
-                  justifyContent: "flex-start"
-                },
-                integerStyles: F.h5Regular.cssObject,
-                decimalStyles: F.smallSemiBold.cssObject
-              }
-            ),
-            e.totalCashback.amount > 0 ? /* @__PURE__ */ t.jsx(Bs, { windowSize: M, children: /* @__PURE__ */ t.jsxs(
-              Os,
-              {
-                windowSize: M,
-                onClick: Cn,
-                "data-testid": dt(
-                  "total-cashback-info"
-                ),
-                children: [
-                  /* @__PURE__ */ t.jsx(Rs, { children: H.overview }),
-                  /* @__PURE__ */ t.jsx(Us, {})
-                ]
-              }
-            ) }) : null
-          ] }) : null,
-          /* @__PURE__ */ t.jsx(Ds, { children: /* @__PURE__ */ t.jsx(As, {}) })
-        ] })
-      ] }),
-      e.cards.length === 0 && Q === !0 || On ? /* @__PURE__ */ t.jsx(Hs, { children: /* @__PURE__ */ t.jsx(
-        Po,
-        {
-          companyLegalName: i,
-          cards: e.cards,
-          admins: p,
-          hasZeniFinopsRoles: ve,
-          cashbackRate: Ue
-        }
-      ) }) : /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-        Ge && s.cardId != null && h && /* @__PURE__ */ t.jsx(
-          Ut,
-          {
-            showCloseCardDrawer: !0,
-            onCloseCloseCardDrawer: () => {
-              be(!1), B();
-            },
-            isChargeCardAdmin: !0,
-            chargeCardsByCardId: {
-              [s.cardId]: h
-            },
-            cardRecurringExpensesByCardId: {
-              [s.cardId]: s.recurringExpenses
-            },
-            cardRecurringExpenseFetchState: s.recurringExpensesFetchState.fetchState,
-            closeCardFetchState: s.closeChargeCardsFetchState.fetchState,
-            onConfirmClick: Wn,
-            onDismissClick: () => {
-              be(!1), B();
-            },
-            onRemoveCardClick: () => {
-            }
-          }
-        ),
-        Ae && s.cardId != null && h && /* @__PURE__ */ t.jsx(
-          Ht,
-          {
-            showLockCardDrawer: !0,
-            onCloseLockCardDrawer: () => {
-              Ce(!1), B();
-            },
-            isChargeCardAdmin: !0,
-            chargeCardsByCardId: {
-              [s.cardId]: h
-            },
-            cardRecurringExpensesByCardId: {
-              [s.cardId]: s.recurringExpenses
-            },
-            cardRecurringExpenseFetchState: s.recurringExpensesFetchState.fetchState,
-            lockCardFetchState: s.lockChargeCardsFetchState.fetchState,
-            onConfirmClick: Yn,
-            onDismissClick: () => {
-              Ce(!1), B();
-            },
-            onRemoveCardClick: () => {
-            }
-          }
-        ),
-        In && d.bulkActionCardIds.length > 0 && /* @__PURE__ */ t.jsx(
-          Ut,
-          {
-            showCloseCardDrawer: !0,
-            onCloseCloseCardDrawer: () => {
-              q(!1), $([]);
-            },
-            isChargeCardAdmin: !0,
-            chargeCardsByCardId: ee.chargeCardsByCardId,
-            cardRecurringExpensesByCardId: ee.cardRecurringExpensesByCardId,
-            cardRecurringExpenseFetchState: ee.fetchState,
-            closeCardFetchState: e.closeChargeCardsFetchState.fetchState,
-            onConfirmClick: En,
-            onDismissClick: () => {
-              q(!1), $([]);
-            },
-            onRemoveCardClick: Nt
-          }
-        ),
-        jn && d.bulkActionCardIds.length > 0 && /* @__PURE__ */ t.jsx(
-          Ht,
-          {
-            showLockCardDrawer: !0,
-            onCloseLockCardDrawer: () => {
-              J(!1), $([]);
-            },
-            isChargeCardAdmin: !0,
-            chargeCardsByCardId: ee.chargeCardsByCardId,
-            cardRecurringExpensesByCardId: ee.cardRecurringExpensesByCardId,
-            cardRecurringExpenseFetchState: ee.fetchState,
-            lockCardFetchState: e.lockChargeCardsFetchState.fetchState,
-            onConfirmClick: Kn,
-            onDismissClick: () => {
-              J(!1), $([]);
-            },
-            onRemoveCardClick: Nt
-          }
-        ),
-        We && s.cardId != null && h && /* @__PURE__ */ t.jsx(
-          wo,
-          {
-            currentCardName: h.cardName,
-            renameFetchState: s.updateChargeCardNameFetchState.fetchState,
-            onCancelClick: () => {
-              Ye(!1), B();
-            },
-            onSubmitClick: (a) => {
-              s.cardId != null && fn(s.cardId, a);
-            }
-          }
-        ),
-        Ee && s.cardId != null && h && /* @__PURE__ */ t.jsx(
-          Fo,
-          {
-            controllerEmails: K,
-            isChargeCardFeatureEnabled: g,
-            isDebitCardFeatureEnabled: y,
-            isDebitCardSetupEnabled: k,
-            isChargeCardSetupEnabled: j,
-            productInformation: Ie,
-            cashbackInformation: V,
-            creditAccountInformation: ke,
-            debitAccountInformation: je,
-            cardDetail: h,
-            depositAccountLimitFetchState: s.depositAccountLimitFetchState.fetchState,
-            creditAccount: f,
-            creditAccountRepayment: R,
-            signedInUser: ze,
-            isDebitCard: h.type.code.includes(
-              "debit"
-            ),
-            classListFetchState: "Not-Started",
-            currentLimitAmount: h.limit,
-            currentSpentAmount: h.balance,
-            maxLimitAmount: h.type.code.includes("debit") ? s.depositAccountLimit?.cardLimits.dailyCardTransactionLimit : f.limit,
-            isDisabled: h.type.code.includes("debit") && s.depositAccountLimitFetchState.fetchState !== "Completed",
-            updateLimitFetchState: s.updateChargeCardLimitFetchState.fetchState,
-            onCancelClick: () => {
-              Ke(!1), B();
-            },
-            onSubmitClick: (a) => {
-              if (s.cardId != null) {
-                const c = {
-                  amount: a,
-                  currencyCode: h.limit.currencyCode,
-                  currencySymbol: h.limit.currencySymbol
-                };
-                Le(
-                  s.cardId,
-                  c,
-                  h.creditLimitFrequency,
-                  he("0,0.[00]", c)
-                );
-              }
-            },
-            recommendations: h.recommendations
-          }
-        ),
-        Rn && T.length > 0 && /* @__PURE__ */ t.jsx(
-          os,
-          {
-            currentSpentAmount: Pn ?? {
-              amount: 0,
-              currencyCode: T[0].limit.currencyCode,
-              currencySymbol: T[0].limit.currencySymbol
-            },
-            maxLimitAmountForCreditCard: e.creditAccount.limit,
-            maxLimitAmountForDebitCard: Tn,
-            hasCreditCard: d.hasCreditCards,
-            hasDebitCard: d.hasDebitCards,
-            signedInUser: ze,
-            isDisabled: d.hasDebitCards && I.fetchState !== "Completed",
-            updateLimitFetchState: e.updateChargeCardsSpendLimitFetchState.fetchState,
-            onCancelClick: () => {
-              $e(!1), $([]);
-            },
-            onSubmitClick: (a) => {
-              const c = {
-                amount: a,
-                currencyCode: T[0].limit.currencyCode,
-                currencySymbol: T[0].limit.currencySymbol
-              };
-              E(
-                d.bulkActionCardIds,
-                c,
-                T[0].creditLimitFrequency
-              );
-            }
-          }
-        ),
-        /* @__PURE__ */ t.jsx(
-          Ro,
-          {
-            cardsSelectedForBulkAction: d.bulkActionCardIds,
-            isBulkActionAllowed: v,
-            firstSelectedCardStatus: Bn,
-            bulkSubmissionLimit: Bo,
-            removeAllCardsFromBulkActionList: () => $([]),
-            updateBulkActionList: $,
-            onProceedForBulkActionClick: Mn,
-            onBulkLockClick: Jn,
-            onBulkCloseClick: qn,
-            setShowBulkChangeSpendLimitPopup: $e,
-            depositAccountListWithDebitCardIssued: I,
-            setCardIdForRowAction: De,
-            setActionTypeForRowAction: yt,
-            cashbackInformation: V,
-            creditAccountInformation: ke,
-            debitAccountInformation: je,
-            productInformation: Ie,
-            controllerEmails: K,
-            isChargeCardFeatureEnabled: g,
-            isCardControlsEnabled: Ne,
-            isDebitCardFeatureEnabled: y,
-            isDebitCardSetupEnabled: k,
-            isChargeCardSetupEnabled: j,
-            creditAccount: f,
-            creditAccountRepayment: R,
-            cardList: e.cards,
-            showViewForCardUser: !1,
-            signedInUser: ze,
-            fetchState: e.fetchState,
-            revokeChargeCardsInviteFetchState: e.revokeChargeCardsInviteFetchState.fetchState,
-            unlockChargeCardsFetchState: e.unlockChargeCardsFetchState.fetchState,
-            onReloadCards: yn,
-            onChargeCardRowClick: hn,
-            searchText: l,
-            receiptBotEmail: e.chargeCardConfig.receiptBotEmail,
-            uiState: dn,
-            resendInviteId: e?.resendCardInvite?.cardId,
-            onColumnSortConfigChanged: bn,
-            onChargeCardResendInviteClick: gn,
-            rowActionView: s
-          }
-        )
-      ] })
-    ] })
-  ] });
-}, hs = o(nn)`
-  color: ${(e) => e.isImportant ? m.important : e.theme.colors.primary};
-  text-align: end;
-`, fs = o(nn)`
-  color: ${m.brandColorGoldDark};
-  text-align: end;
-`, Wt = o.div`
-  display: flex;
-  align-items: center;
-  gap: ${n.sp1};
-  height: 21px;
-  overflow: hidden;
-  cursor: ${(e) => e.hasPointer ? "pointer" : "default"};
-`, gs = o(se)`
-  color: ${(e) => e.theme.colors.primary};
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  gap: 2px;
-`, Yt = o(mt)`
-  color: ${(e) => e.theme.colors.primary};
-  width: 12px;
-  height: 12px;
-`, xs = o(vo)`
-  color: ${m.brandColorGoldDark};
-  width: ${n.sp3};
-  height: ${n.sp3};
-`, Ss = o($o)`
-  color: ${m.important};
-  width: ${n.sp3};
-  height: ${n.sp3};
-`, ys = o(se)`
-  color: ${m.heroDark};
-  white-space: pre-line;
-  text-align: left;
-`, Cs = o.div`
-  display: flex;
-  align-items: center;
-  justify-content: center;
-`, Et = (e, l, p) => {
-  const i = (l * 100).toFixed(2);
-  if (e === "credit") {
-    const r = x.listPage.promoMultiText.credit;
-    return p && (r[0] = r[0].replace(
-      "__creditLimit__",
-      ct(
-        "0,0",
-        p.amount,
-        p.currencySymbol
-      )
-    )), r[1] = r[1].replace("__cashBack__", i), [...r, r[0]];
-  } else if (e === "debit") {
-    const r = x.listPage.promoMultiText.debit;
-    return r[0] = r[0].replace("__cashBack__", i), [...r, r[0]];
-  }
-  return [];
-}, bs = ({
-  isChargeCardFeatureEnabled: e,
-  isChargeCardSetupEnabled: l,
-  isDebitCardFeatureEnabled: p,
-  isDebitCardSetupEnabled: i
-}) => e && l && p && i ? H.title.cards : e && l ? H.title.credit : p && i ? H.title.debit : "", $s = o.div`
-  text-align: left;
-`, Kt = o.span``, vs = o.span`
-  white-space: nowrap;
-`, ks = o.div`
-  min-width: 137px;
-  display: flex;
-  flex-direction: column;
-  justify-content: flex-start;
-`, js = o.div`
-  min-width: ${n.sp12};
-  align-self: stretch;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-`, cn = o.div`
-  min-width: ${n.sp11};
-  padding: ${n.sp2} ${n.sp4};
-  background-color: ${(e) => e.theme.colors.grey4};
-  border-bottom-left-radius: ${n.sp2};
-  border-bottom-right-radius: ${n.sp2};
-  border-top: 1px solid ${(e) => e.theme.colors.grey3};
-  display: flex;
-`, Is = o(cn)`
-  justify-content: ${(e) => e.showPaymentInitiatedInfo && e.isEarlyPayEnabled ? "flex-end" : "space-between"};
-`, Rs = o.div``, Bs = o.div`
-  border: 1px solid ${(e) => e.theme.colors.hero};
-  border-radius: ${n.sp12};
-  width: fit-content;
-  justify-self: ${(e) => e.windowSize === "small" ? "flex-start" : "flex-end"};
-  margin-top: ${n.sp1};
-  padding: ${n.sp0} ${n.sp2};
-`, Ps = o.div`
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  height: 100vh;
-  overflow: auto;
-`, Ts = o.div`
-  display: flex;
-  flex-direction: row;
-  margin-top: ${n.sp3};
-  margin-right: ${(e) => fe.contentContainerMargin.valuePx(e.windowSize)};
-  margin-bottom: ${n.sp4};
-  margin-left: ${(e) => fe.contentContainerMargin.valuePx(e.windowSize)};
-  align-items: center;
-  gap: ${n.sp3};
-  ${(e) => e.windowSize === "small" && lt`
-      overflow-x: scroll;
-      gap: ${n.sp2};
-      min-height: 190px;
-      /* Hide scrollbar for Chrome, Safari and Opera */
-      &::-webkit-scrollbar {
-        display: none;
-      }
-      /* Hide scrollbar for IE, Edge and Firefox */
-      -ms-overflow-style: none;
-      scrollbar-width: none;
-    `}
-`, Jt = o.div`
-  display: flex;
-  flex-grow: 1;
-  flex-direction: column;
-  border: 1px solid ${(e) => e.theme.colors.grey3};
-  box-shadow: ${m.Elevation1Light};
-  border-radius: ${n.sp2};
-  background-color: ${(e) => e.theme.colors.grey5};
-  min-width: ${(e) => fe.cardsMinWidth.valuePx(e.windowSize)};
-  height: 188px;
-  justify-content: space-between;
-  flex-basis: 33.33%;
-`, Ms = o.div`
-  display: flex;
-  justify-content: space-between;
-  align-self: ${(e) => e.windowSize === "small" ? "flex-start" : "center"};
-  text-align: ${(e) => e.windowSize === "small" ? "start" : "end"};
-  border: 1px solid ${(e) => e.theme.colors.grey3};
-  box-shadow: ${m.Elevation1Light};
-  border-radius: ${n.sp2};
-  background-color: ${(e) => e.theme.colors.grey5};
-  padding: ${n.sp4};
-  align-self: stretch;
-  position: relative;
-  overflow: hidden;
-  min-width: ${(e) => fe.cardsMinWidth.valuePx(e.windowSize)};
-  box-sizing: border-box;
-  background-image: url(https://storage.googleapis.com/zeni-apis.appspot.com/images/promo-list-pattern.svg);
-  background-repeat: no-repeat;
-  background-position: bottom right;
-  height: 188px;
-  flex-grow: 1;
-  flex-basis: 33.33%;
-`, qt = o.div`
-  display: flex;
-  align-items: baseline;
-  gap: ${n.sp2};
-  align-items: center;
-`, Zt = o(se)`
-  color: ${(e) => e.theme.colors.hero};
-`, Xt = o(bo)`
-  color: ${(e) => e.theme.colors.primary};
-  ${(e) => `${us.remainingText.style(e.windowSize)}`};
-`, Te = o(se)`
-  color: ${(e) => e.theme.colors.hero};
-  white-space: nowrap;
-`, ws = o.div`
-  display: flex;
-  align-items: center;
-  gap: ${n.sp1};
-  padding: 3px ${n.sp0};
-  margin-top: 20px;
-`, ln = o(ko)`
-  color: ${(e) => e.theme.colors.hero};
-`, Fs = o(ln)`
-  color: ${(e) => e.hasNegativeValue ? m.success : m.important};
-`, Ls = o(Oo)`
-  color: ${m.success};
-  width: ${n.sp3};
-  height: ${n.sp3};
-`, Ns = o(_o)`
-  color: ${m.important};
-  width: ${n.sp3};
-  height: ${n.sp3};
-`, Os = o(pt)`
-  color: ${(e) => e.theme.colors.hero};
-  margin-top: ${(e) => fe.infoSubheadingTextMarginTop.valuePx(e.windowSize)};
-  gap: ${n.sp1};
-  display: flex;
-  align-items: center;
-  cursor: pointer;
-  width: min-content;
-  &:hover {
-    color: ${(e) => e.theme.colors.primary};
-  }
-`, _s = o.div`
-  width: 100%;
-  height: ${n.sp1};
-  display: flex;
-  margin: ${n.sp2} ${n.sp0};
-  background: ${(e) => e.theme.colors.grey3};
-`, zs = o.div`
-  background: ${m.success};
-  width: 0%;
-  height: ${n.sp1};
-
-  transition: width 4s ease;
-`, Us = o(mt)`
-  color: inherit;
-  width: ${n.sp2};
-  height: ${n.sp2};
-`, Hs = o.div`
-  display: flex;
-  flex-direction: column;
-  margin: ${n.sp0} ${n.sp2} ${n.sp7} ${n.sp2};
-`, Qt = o.div`
-  padding: ${n.sp4};
-  padding-bottom: ${n.sp2};
-`, Vt = o.div`
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-`, en = o.div``, Ds = o.div`
-  height: ${n.sp10};
-  width: ${n.sp10};
-`;
-function As() {
-  switch (tn().mode) {
-    case "light":
-      return /* @__PURE__ */ t.jsx(No, {});
-    case "dark":
-    default:
-      return /* @__PURE__ */ t.jsx(Lo, {});
-  }
-}
-export {
-  sa as default,
-  Et as getPromoSlidingTextList
-};