@adyen/adyen-platform-experience-web 1.1.1 → 1.3.0

package/dist/es/components/external/TransactionsOverview/components/TransactionsOverview/TransactionsOverview.js

@@ -1,247 +1,216 @@
-import { DataDetailsModal as ft } from "../../../../internal/DataOverviewDisplay/DataDetailsModal.js";
-import { TransactionsTable as pt } from "../TransactionsTable/TransactionsTable.js";
-import At from "../../../../hooks/useBalanceAccountSelection.js";
-import St from "../../../../internal/FilterBar/filters/DateFilter/DateFilter.js";
-import { FilterParam as e } from "../../../../types.js";
-import Tt from "../../../../../hooks/useModalDetails/useModalDetails.js";
-import Et from "../../../../../core/Context/useCoreContext.js";
-import { useCallback as c, useMemo as m, useState as R, useEffect as E } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import { LIMIT_OPTIONS as Nt, DEFAULT_PAGE_LIMIT as Mt } from "../../../../internal/Pagination/constants.js";
-import ht from "../TransactionTotals/TransactionTotals.js";
-import { Balances as Ft } from "../Balances/Balances.js";
-import _t from "../../../../hooks/useDefaultOverviewFilterParams.js";
-import It from "../../hooks/useTransactionsOverviewMultiSelectionFilters.js";
-import { AmountFilter as Dt } from "../../../../internal/FilterBar/filters/AmountFilter/AmountFilter.js";
-import { MAX_TRANSACTIONS_DATE_RANGE_MONTHS as Ot, BASE_CLASS as Ut, SUMMARY_CLASS as gt, SUMMARY_ITEM_CLASS as v, BASE_CLASS_DETAILS as bt } from "./constants.js";
-import { useResponsiveViewport as Lt, mediaQueries as wt } from "../../../../hooks/useResponsiveViewport.js";
-import { useCustomColumnsData as Rt } from "../../../../hooks/useCustomColumnsData.js";
-import "./TransactionsOverview.scss.js";
-import { jsx as r } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import vt, { useFilterBarState as xt, FilterBarMobileSwitch as yt } from "../../../../internal/FilterBar/FilterBar.js";
-import kt from "../../../../internal/Pagination/hooks/useCursorPaginatedRecords.js";
-import { DataOverviewHeader as Pt } from "../../../../internal/DataOverviewDisplay/DataOverviewHeader/DataOverviewHeader.js";
-import Xt from "../../../../internal/FormFields/Select/BalanceAccountSelector/BalanceAccountSelector.js";
-import x from "../MultiSelectionFilter/MultiSelectionFilter.js";
-import { useAuthContext as Gt } from "../../../../../core/Auth/context.js";
-import { listFrom as u } from "../../../../../utils/collection/main.js";
-import { isUndefined as y, isFunction as zt } from "../../../../../utils/value/is.js";
-const Ae = ({
-  onFiltersChanged: C,
-  balanceAccounts: N,
-  allowLimitSelection: M,
-  preferredLimit: k = Mt,
-  onRecordSelection: h,
-  showDetails: F,
-  isLoadingBalanceAccount: P,
-  onContactSupport: X,
-  hideTitle: G,
-  columns: z,
-  onDataRetrieved: _
+import { jsx as i } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { DataDetailsModal as Te } from "../../../../internal/DataOverviewDisplay/DataDetailsModal.js";
+import { TransactionsTable as Ae } from "../TransactionsTable/TransactionsTable.js";
+import Se from "../../../../../hooks/useBalanceAccountSelection.js";
+import Ee from "../../../../internal/FilterBar/filters/DateFilter/DateFilter.js";
+import { FilterParam as t } from "../../../../types.js";
+import Fe from "../../../../../hooks/useModalDetails/useModalDetails.js";
+import Ne from "../../../../../core/Context/useCoreContext.js";
+import { useCallback as c, useMemo as u, useState as v, useEffect as I } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import { LIMIT_OPTIONS as Me, DEFAULT_PAGE_LIMIT as he } from "../../../../internal/Pagination/constants.js";
+import Ie from "../TransactionTotals/TransactionTotals.js";
+import { Balances as _e } from "../Balances/Balances.js";
+import De from "../../../../../hooks/useDefaultOverviewFilterParams.js";
+import Oe from "../../hooks/useTransactionsOverviewMultiSelectionFilters.js";
+import { AmountFilter as Ue } from "../../../../internal/FilterBar/filters/AmountFilter/AmountFilter.js";
+import { MAX_TRANSACTIONS_DATE_RANGE_MONTHS as ge, BASE_CLASS as be, SUMMARY_CLASS as Le, SUMMARY_ITEM_CLASS as X, BASE_CLASS_DETAILS as we } from "./constants.js";
+import { useResponsiveViewport as xe, mediaQueries as Re } from "../../../../../hooks/useResponsiveViewport.js";
+import { useCustomColumnsData as ye } from "../../../../../hooks/useCustomColumnsData.js";
+/* empty css                          */
+import Pe from "../../../../internal/Pagination/hooks/useCursorPaginatedRecords.js";
+import { Header as ke } from "../../../../internal/Header/Header.js";
+import { useFilterBarState as ve, FilterBarMobileSwitch as Xe, FilterBar as Ge } from "../../../../internal/FilterBar/FilterBar.js";
+import Ye from "../../../../internal/FormFields/Select/BalanceAccountSelector/BalanceAccountSelector.js";
+import G from "../MultiSelectionFilter/MultiSelectionFilter.js";
+import { useConfigContext as je } from "../../../../../core/ConfigContext/context.js";
+import { listFrom as p } from "../../../../../utils/collection/main.js";
+import { isUndefined as Y, isFunction as ze } from "../../../../../utils/value/is.js";
+import { EMPTY_OBJECT as He } from "../../../../../utils/value/constants.js";
+const Ft = ({
+  onFiltersChanged: T,
+  balanceAccounts: _,
+  allowLimitSelection: D,
+  preferredLimit: j = he,
+  onRecordSelection: O,
+  showDetails: U,
+  isLoadingBalanceAccount: z,
+  onContactSupport: H,
+  hideTitle: V,
+  columns: W,
+  onDataRetrieved: g
 }) => {
-  const {
-    i18n: f
-  } = Et(), {
-    getTransactions: p
-  } = Gt().endpoints, {
-    activeBalanceAccount: t,
-    balanceAccountSelectionOptions: H,
-    onBalanceAccountSelection: V
-  } = At(N), {
-    defaultParams: l,
-    nowTimestamp: A,
-    refreshNowTimestamp: S
-  } = _t("transactions", t), W = c(async ({
-    balanceAccount: s,
-    ...i
-  }, d) => p({
-    signal: d,
-    errorLevel: "error"
-  }, {
-    query: {
-      ...i,
-      statuses: u(i[e.STATUSES]),
-      categories: u(i[e.CATEGORIES]),
-      currencies: u(i[e.CURRENCIES]),
-      createdSince: i[e.CREATED_SINCE] ?? l.current.defaultFilterParams[e.CREATED_SINCE],
-      createdUntil: i[e.CREATED_UNTIL] ?? l.current.defaultFilterParams[e.CREATED_UNTIL],
-      sortDirection: "desc",
-      balanceAccountId: (t == null ? void 0 : t.id) ?? "",
-      minAmount: y(i.minAmount) ? void 0 : parseFloat(i.minAmount),
-      maxAmount: y(i.maxAmount) ? void 0 : parseFloat(i.maxAmount)
-    }
-  }), [t == null ? void 0 : t.id, l, p]), I = xt(), Y = m(() => zt(C) ? C : void 0, [C]), j = m(() => M ? Nt : void 0, [M]), {
-    canResetFilters: K,
-    error: Q,
-    fetching: Z,
-    filters: o,
-    limit: J,
-    limitOptions: $,
-    records: D,
-    resetFilters: Ht,
-    updateFilters: n,
-    updateLimit: q,
-    ...B
-  } = kt({
-    fetchRecords: W,
+  const { i18n: A } = Ne(), { getTransactions: S } = je().endpoints, { activeBalanceAccount: e, balanceAccountSelectionOptions: J, onBalanceAccountSelection: K } = Se(_), { defaultParams: d, nowTimestamp: E, refreshNowTimestamp: F } = De("transactions", e), Q = c(
+    async ({ balanceAccount: o, ...r }, s) => S({ signal: s, errorLevel: "error" }, {
+      query: {
+        ...r,
+        statuses: p(r[t.STATUSES]),
+        categories: p(r[t.CATEGORIES]),
+        currencies: p(r[t.CURRENCIES]),
+        createdSince: r[t.CREATED_SINCE] ?? d.current.defaultFilterParams[t.CREATED_SINCE],
+        createdUntil: r[t.CREATED_UNTIL] ?? d.current.defaultFilterParams[t.CREATED_UNTIL],
+        sortDirection: "desc",
+        balanceAccountId: (e == null ? void 0 : e.id) ?? "",
+        minAmount: Y(r.minAmount) ? void 0 : parseFloat(r.minAmount),
+        maxAmount: Y(r.maxAmount) ? void 0 : parseFloat(r.maxAmount)
+      }
+    }),
+    [e == null ? void 0 : e.id, d, S]
+  ), b = ve(), Z = u(() => ze(T) ? T : void 0, [T]), $ = u(() => D ? Me : void 0, [D]), { canResetFilters: B, error: q, fetching: ee, filters: n, limit: te, limitOptions: re, records: f, resetFilters: Ve, updateFilters: l, updateLimit: ie, ...oe } = Pe({
+    fetchRecords: Q,
     dataField: "data",
-    filterParams: l.current.defaultFilterParams,
+    filterParams: d.current.defaultFilterParams,
     initialFiltersSameAsDefault: !0,
-    onFiltersChanged: Y,
-    preferredLimit: k,
-    preferredLimitOptions: j,
-    enabled: !!(t != null && t.id) && !!p
-  }), [a, O] = R([]), [tt, et] = R(!1), rt = c((s, i) => {
-    O(s), et(i);
-  }, []), {
-    categoriesFilter: U,
-    currenciesFilter: g,
-    statusesFilter: T
-  } = It({
-    filters: o,
-    updateFilters: n
-  }, a);
-  E(() => {
-    O(void 0), n({
-      [e.BALANCE_ACCOUNT]: t == null ? void 0 : t.id,
-      [e.CURRENCIES]: void 0
-    });
-  }, [n, t == null ? void 0 : t.id]), E(() => {
-    S();
-  }, [o, S]), E(() => {
-    T.updateSelection({
-      target: {
-        value: "Booked",
-        name: "status"
-      }
+    onFiltersChanged: Z,
+    preferredLimit: j,
+    preferredLimitOptions: $,
+    enabled: !!(e != null && e.id) && !!S
+  }), [a, L] = v([]), [ne, se] = v(!1), le = c((o, r) => {
+    L(o), se(r);
+  }, []), { categoriesFilter: w, currenciesFilter: x, statusesFilter: N } = Oe(
+    {
+      filters: n,
+      updateFilters: l
+    },
+    a
+  );
+  I(() => {
+    L(void 0), l({
+      [t.BALANCE_ACCOUNT]: e == null ? void 0 : e.id,
+      [t.CURRENCIES]: void 0
     });
-  }, [T]);
-  const b = Lt(wt.down.sm), it = !!a && a.length > 1, L = m(() => ({
-    showDetails: F ?? !0,
-    callback: h
-  }), [F, h]), ot = m(() => ({
-    transaction: L
-  }), [L]), {
-    updateDetails: w,
-    resetDetails: st,
-    selectedDetail: nt
-  } = Tt(ot), at = c((s) => {
-    w({
-      selection: {
-        type: "transaction",
-        data: {
-          ...s,
-          balanceAccount: t
+  }, [l, e == null ? void 0 : e.id]), I(() => {
+    F();
+  }, [n, F]), I(() => {
+    N.updateSelection({ target: { value: "Booked", name: "status" } });
+  }, [N]);
+  const R = xe(Re.down.sm), ae = !!a && a.length > 1, y = u(
+    () => ({
+      showDetails: U ?? !0,
+      callback: O
+    }),
+    [U, O]
+  ), me = u(() => ({ transaction: y }), [y]), de = c(
+    ({ records: o, retrievedData: r }) => o.map((s) => ({ ...r.find((C) => C.id === s.id), ...s })),
+    []
+  ), { customRecords: M, loadingCustomRecords: ce } = ye({ records: f, onDataRetrieved: g, mergeCustomData: de }), { updateDetails: P, resetDetails: ue, selectedDetail: fe } = Fe(me), k = c(
+    ({ id: o }) => {
+      const r = f.find((m) => m.id === o), s = M.find((m) => m.id === o);
+      return r && s ? Object.keys(s).reduce((C, h) => (h in r || (C[h] = s[h]), C), {}) : null;
+    },
+    [f, M]
+  ), Ce = c(
+    ({ id: o }) => {
+      P({
+        selection: {
+          type: "transaction",
+          data: o,
+          balanceAccount: e || "",
+          extraDetails: k({ id: o }) ?? He
+        },
+        modalSize: "small"
+      }).callback({ id: o });
+    },
+    [e, P, k]
+  ), pe = u(() => {
+    const o = new Date(E);
+    return o.setMonth(o.getMonth() - ge), o.toString();
+  }, [E]);
+  return /* @__PURE__ */ i("div", { className: be, children: [
+    /* @__PURE__ */ i(ke, { hideTitle: V, titleKey: "transactionsOverviewTitle", children: /* @__PURE__ */ i(Xe, { ...b }) }),
+    /* @__PURE__ */ i(Ge, { ...b, children: [
+      /* @__PURE__ */ i(
+        Ye,
+        {
+          activeBalanceAccount: e,
+          balanceAccountSelectionOptions: J,
+          onBalanceAccountSelection: K
         }
-      },
-      modalSize: "small"
-    }).callback({
-      id: s.id
-    });
-  }, [w, t]), lt = m(() => {
-    const s = new Date(A);
-    return s.setMonth(s.getMonth() - Ot), s.toString();
-  }, [A]), mt = c(({
-    records: s,
-    retrievedData: i
-  }) => s.map((d) => ({
-    ...i.find((Ct) => Ct.id === d.id),
-    ...d
-  })), []), {
-    customRecords: dt,
-    loadingCustomRecords: ct
-  } = Rt({
-    records: D,
-    onDataRetrieved: _,
-    mergeCustomData: mt
-  });
-  return r("div", {
-    className: Ut,
-    children: [r(Pt, {
-      hideTitle: G,
-      titleKey: "transactionsOverviewTitle",
-      children: r(yt, {
-        ...I
-      })
-    }), r(vt, {
-      ...I,
-      children: [r(Xt, {
-        activeBalanceAccount: t,
-        balanceAccountSelectionOptions: H,
-        onBalanceAccountSelection: V
-      }), r(St, {
-        canResetFilters: K,
-        defaultParams: l,
-        filters: o,
-        nowTimestamp: A,
-        refreshNowTimestamp: S,
-        sinceDate: lt,
-        timezone: t == null ? void 0 : t.timeZone,
-        updateFilters: n
-      }), r(x, {
-        ...U,
-        placeholder: f.get("filterPlaceholder.category")
-      }), r(Dt, {
-        availableCurrencies: a,
-        selectedCurrencies: u(o[e.CURRENCIES]),
-        name: "range",
-        label: f.get("amount"),
-        minAmount: o[e.MIN_AMOUNT],
-        maxAmount: o[e.MAX_AMOUNT],
-        updateFilters: n,
-        onChange: n
-      }), r(x, {
-        ...g,
-        placeholder: f.get("filterPlaceholder.currency")
-      })]
-    }), r("div", {
-      className: gt,
-      children: [r("div", {
-        className: v,
-        children: r(ht, {
+      ),
+      /* @__PURE__ */ i(
+        Ee,
+        {
+          canResetFilters: B,
+          defaultParams: d,
+          filters: n,
+          nowTimestamp: E,
+          refreshNowTimestamp: F,
+          sinceDate: pe,
+          timezone: e == null ? void 0 : e.timeZone,
+          updateFilters: l
+        }
+      ),
+      /* @__PURE__ */ i(G, { ...w, placeholder: A.get("filterPlaceholder.category") }),
+      /* @__PURE__ */ i(
+        Ue,
+        {
           availableCurrencies: a,
-          isAvailableCurrenciesFetching: tt,
-          balanceAccountId: t == null ? void 0 : t.id,
-          statuses: T.selection,
-          categories: U.selection,
-          createdUntil: o[e.CREATED_UNTIL],
-          createdSince: o[e.CREATED_SINCE],
-          currencies: g.selection,
-          minAmount: o[e.MIN_AMOUNT] ? parseFloat(o[e.MIN_AMOUNT]) : void 0,
-          maxAmount: o[e.MAX_AMOUNT] ? parseFloat(o[e.MAX_AMOUNT]) : void 0,
-          fullWidth: b
-        })
-      }), r("div", {
-        className: v,
-        children: r(Ft, {
-          balanceAccountId: t == null ? void 0 : t.id,
-          onCurrenciesChange: rt,
-          defaultCurrencyCode: t == null ? void 0 : t.defaultCurrencyCode,
-          fullWidth: b
-        })
-      })]
-    }), r(ft, {
-      selectedDetail: nt,
-      resetDetails: st,
-      className: bt,
-      children: r(pt, {
-        activeBalanceAccount: t,
-        availableCurrencies: a,
-        error: Q,
-        hasMultipleCurrencies: it,
-        limit: J,
-        limitOptions: $,
-        loading: Z || P || !N || ct,
-        onContactSupport: X,
-        onLimitSelection: q,
-        onRowClick: at,
-        showPagination: !0,
-        transactions: _ ? dt : D,
-        customColumns: z,
-        ...B
-      })
-    })]
-  });
+          selectedCurrencies: p(n[t.CURRENCIES]),
+          name: "range",
+          label: A.get("amount"),
+          minAmount: n[t.MIN_AMOUNT],
+          maxAmount: n[t.MAX_AMOUNT],
+          updateFilters: l,
+          onChange: l
+        }
+      ),
+      /* @__PURE__ */ i(G, { ...x, placeholder: A.get("filterPlaceholder.currency") })
+    ] }),
+    /* @__PURE__ */ i("div", { className: Le, children: [
+      /* @__PURE__ */ i("div", { className: X, children: /* @__PURE__ */ i(
+        Ie,
+        {
+          availableCurrencies: a,
+          isAvailableCurrenciesFetching: ne,
+          balanceAccountId: e == null ? void 0 : e.id,
+          statuses: N.selection,
+          categories: w.selection,
+          createdUntil: n[t.CREATED_UNTIL],
+          createdSince: n[t.CREATED_SINCE],
+          currencies: x.selection,
+          minAmount: n[t.MIN_AMOUNT] ? parseFloat(n[t.MIN_AMOUNT]) : void 0,
+          maxAmount: n[t.MAX_AMOUNT] ? parseFloat(n[t.MAX_AMOUNT]) : void 0,
+          fullWidth: R
+        }
+      ) }),
+      /* @__PURE__ */ i("div", { className: X, children: /* @__PURE__ */ i(
+        _e,
+        {
+          balanceAccountId: e == null ? void 0 : e.id,
+          onCurrenciesChange: le,
+          defaultCurrencyCode: e == null ? void 0 : e.defaultCurrencyCode,
+          fullWidth: R
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ i(
+      Te,
+      {
+        selectedDetail: fe,
+        resetDetails: ue,
+        className: we,
+        children: /* @__PURE__ */ i(
+          Ae,
+          {
+            activeBalanceAccount: e,
+            availableCurrencies: a,
+            error: q,
+            hasMultipleCurrencies: ae,
+            limit: te,
+            limitOptions: re,
+            loading: ee || z || !_ || ce,
+            onContactSupport: H,
+            onLimitSelection: ie,
+            onRowClick: Ce,
+            showPagination: !0,
+            transactions: g ? M : f,
+            customColumns: W,
+            ...oe
+          }
+        )
+      }
+    )
+  ] });
 };
 export {
-  Ae as TransactionsOverview
+  Ft as TransactionsOverview
 };

package/dist/es/components/external/TransactionsOverview/components/TransactionsOverviewContainer/TransactionsOverviewContainer.js

@@ -1,29 +1,21 @@
-import c from "../../../../hooks/useBalanceAccounts.js";
+import { jsx as n } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import c from "../../../../../hooks/useBalanceAccounts.js";
 import i from "../../../../internal/DataOverviewContainer/DataOverviewContainer.js";
 import { TransactionsOverview as s } from "../TransactionsOverview/TransactionsOverview.js";
 import { BASE_CLASS as u } from "./constants.js";
-import { jsx as n } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-function f({
-  ...o
-}) {
-  const {
-    balanceAccounts: r,
-    isBalanceAccountIdWrong: a,
-    isFetching: t,
-    error: e
-  } = c(o.balanceAccountId);
-  return n(i, {
-    balanceAccountsError: e,
-    className: u,
-    errorMessage: "weCouldNotLoadTheTransactionsOverview",
-    isBalanceAccountIdWrong: a,
-    onContactSupport: o.onContactSupport,
-    children: n(s, {
-      ...o,
-      balanceAccounts: r,
-      isLoadingBalanceAccount: t
-    })
-  });
+function f({ ...o }) {
+  const { balanceAccounts: r, isBalanceAccountIdWrong: a, isFetching: t, error: e } = c(o.balanceAccountId);
+  return /* @__PURE__ */ n(
+    i,
+    {
+      balanceAccountsError: e,
+      className: u,
+      errorMessage: "weCouldNotLoadTheTransactionsOverview",
+      isBalanceAccountIdWrong: a,
+      onContactSupport: o.onContactSupport,
+      children: /* @__PURE__ */ n(s, { ...o, balanceAccounts: r, isLoadingBalanceAccount: t })
+    }
+  );
 }
 export {
   f as default

package/dist/es/components/external/TransactionsOverview/components/TransactionsTable/PaymentMethodCell.js

@@ -1,43 +1,32 @@
+import { jsx as o } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import m from "../../../../../core/Context/useCoreContext.js";
 import { Image as s } from "../../../../internal/Image/Image.js";
 import { Tag as t } from "../../../../internal/Tag/Tag.js";
-import { TagVariant as l } from "../../../../internal/Tag/types.js";
-import { TypographyVariant as p } from "../../../../internal/Typography/types.js";
+import { TagVariant as p } from "../../../../internal/Tag/types.js";
+import { TypographyVariant as T } from "../../../../internal/Typography/types.js";
 import f from "../../../../internal/Typography/Typography.js";
-import { useResponsiveViewport as T, mediaQueries as n } from "../../../../hooks/useResponsiveViewport.js";
-import { parsePaymentMethodType as g } from "../utils.js";
-import { PAYMENT_METHOD_CLASS as N, PAYMENT_METHOD_LOGO_CONTAINER_CLASS as O, PAYMENT_METHOD_LOGO_CLASS as _ } from "./constants.js";
-import { jsx as o } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import { Fragment as C } from "../../../../../external/preact/dist/preact.module.js";
-const E = ({
+import { useResponsiveViewport as l, mediaQueries as n } from "../../../../../hooks/useResponsiveViewport.js";
+import { parsePaymentMethodType as _ } from "../utils.js";
+import { PAYMENT_METHOD_CLASS as g, PAYMENT_METHOD_LOGO_CONTAINER_CLASS as N, PAYMENT_METHOD_LOGO_CLASS as O } from "./constants.js";
+import { Fragment as E } from "../../../../../external/preact/dist/preact.module.js";
+const V = ({
   paymentMethod: r,
-  bankAccount: e
+  bankAccount: i
 }) => {
-  const {
-    i18n: i
-  } = m(), a = T(n.down.xs);
-  return o("div", {
-    className: N,
-    children: r || e ? o(C, {
-      children: [o("div", {
-        className: O,
-        children: o(s, {
-          name: r ? r.type : "bankTransfer",
-          alt: r ? r.type : "bankTransfer",
-          folder: "logos/",
-          className: _
-        })
-      }), o(f, {
-        variant: p.BODY,
-        stronger: a,
-        children: r ? g(r) : e == null ? void 0 : e.accountNumberLastFourDigits
-      })]
-    }) : o(t, {
-      label: i.get("noData"),
-      variant: l.WHITE
-    })
-  });
-}, V = E;
+  const { i18n: a } = m(), e = l(n.down.xs);
+  return /* @__PURE__ */ o("div", { className: g, children: r || i ? /* @__PURE__ */ o(E, { children: [
+    /* @__PURE__ */ o("div", { className: N, children: /* @__PURE__ */ o(
+      s,
+      {
+        name: r ? r.type : "bankTransfer",
+        alt: r ? r.type : "bankTransfer",
+        folder: "logos/",
+        className: O
+      }
+    ) }),
+    /* @__PURE__ */ o(f, { variant: T.BODY, stronger: e, children: r ? _(r) : i == null ? void 0 : i.accountNumberLastFourDigits })
+  ] }) : /* @__PURE__ */ o(t, { label: a.get("noData"), variant: p.LIGHT_WITH_OUTLINE }) });
+};
 export {
   V as default
 };