@zeniai/web-components 3.17.12 → 3.17.13

package/dist/ChargeCardListPage-xv3ZA_Ko.js

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