@adyen/adyen-platform-experience-web 1.3.1 → 1.4.0

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

@@ -1,46 +1,46 @@
-import { jsx as t } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import { AmountSkeleton as v } from "../AmountSkeleton/AmountSkeleton.js";
+import { jsx as e } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { AmountSkeleton as d } from "../AmountSkeleton/AmountSkeleton.js";
 import { BASE_CLASS as y, BODY_CLASS as T, PLACEHOLDER_CLASS as E, LABEL_CLASS as b, AMOUNT_CLASS as B } from "./constants.js";
-import { SummaryItemLabel as h } from "./SummaryItemLabel.js";
+import { SummaryItemLabel as C } from "./SummaryItemLabel.js";
 import { Tooltip as N } from "../../../../internal/Tooltip/Tooltip.js";
-import { TypographyVariant as p } from "../../../../internal/Typography/types.js";
+import { TypographyVariant as n } from "../../../../internal/Typography/types.js";
 import O from "../../../../internal/Typography/Typography.js";
 import _ from "../../../../../core/Context/useCoreContext.js";
-import n from "classnames";
+import p from "classnames";
 import { useEffect as x, useCallback as H } from "../../../../../external/preact/hooks/dist/hooks.module.js";
 /* empty css                 */
-import { useResponsiveViewport as I, mediaQueries as w } from "../../../../../hooks/useResponsiveViewport.js";
+import { useResponsiveContainer as I, containerQueries as D } from "../../../../../hooks/useResponsiveContainer.js";
 const W = ({
   columnConfigs: i,
   isHeader: u = !1,
-  isHovered: c = !1,
+  isHovered: h = !1,
   isSkeletonVisible: l = !1,
-  isLoading: C = !1,
+  isLoading: c = !1,
   widths: m,
   onWidthsSet: L,
   isEmpty: A
 }) => {
   const { i18n: s } = _();
   x(() => {
-    const e = i.map((r) => {
+    const t = i.map((r) => {
       var a, o;
       return ((o = (a = r.ref) == null ? void 0 : a.current) == null ? void 0 : o.getBoundingClientRect().width) ?? 0;
     });
-    L(e);
+    L(t);
   }, [L]);
-  const d = (e) => ({ width: m && m[e] ? m[e] : "auto" }), S = I(w.only.xs), f = H(
-    (e, r) => e.valueHasLabelStyle ? p.CAPTION : r && !S ? p.BODY : p.TITLE,
+  const f = (t) => ({ width: m && m[t] ? m[t] : "auto" }), S = I(D.only.xs), v = H(
+    (t, r) => t.valueHasLabelStyle ? n.CAPTION : r && !S ? n.BODY : n.TITLE,
     [S]
   );
-  return /* @__PURE__ */ t("div", { className: n(y, { [T]: !u }), children: i.map((e, r) => {
-    const a = e.getValue(), o = !!a && a.length > 12;
-    return /* @__PURE__ */ t("div", { children: [
-      u && (e.tooltipLabel ? /* @__PURE__ */ t(N, { content: s.get(`${e.tooltipLabel}`), isContainerHovered: c, children: /* @__PURE__ */ t(h, { config: e, i18n: s, isSkeletonVisible: l }) }) : /* @__PURE__ */ t(h, { config: e, i18n: s, isSkeletonVisible: l })),
-      l ? /* @__PURE__ */ t(v, { isLoading: C, hasMargin: e.hasSkeletonMargin, width: e.skeletonWidth + "px" }) : A ? /* @__PURE__ */ t("span", { className: n([y, E]) }) : /* @__PURE__ */ t("div", { ref: e.ref, style: d(r), children: /* @__PURE__ */ t(
+  return /* @__PURE__ */ e("div", { className: p(y, { [T]: !u }), children: i.map((t, r) => {
+    const a = t.getValue(), o = !!a && a.length > 12;
+    return /* @__PURE__ */ e("div", { children: [
+      u && (t.tooltipLabel ? /* @__PURE__ */ e(N, { content: s.get(`${t.tooltipLabel}`), isContainerHovered: h, children: /* @__PURE__ */ e(C, { config: t, i18n: s, isSkeletonVisible: l }) }) : /* @__PURE__ */ e(C, { config: t, i18n: s, isSkeletonVisible: l })),
+      l ? /* @__PURE__ */ e(d, { isLoading: c, hasMargin: t.hasSkeletonMargin, width: t.skeletonWidth + "px" }) : A ? /* @__PURE__ */ e("span", { className: p([y, E]) }) : /* @__PURE__ */ e("div", { ref: t.ref, style: f(r), children: /* @__PURE__ */ e(
         O,
         {
-          variant: f(e, o),
-          className: n({ [b]: e.valueHasLabelStyle, [B]: !e.valueHasLabelStyle }),
+          variant: v(t, o),
+          className: p({ [b]: t.valueHasLabelStyle, [B]: !t.valueHasLabelStyle }),
           children: a
         }
       ) })

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

@@ -1,52 +1,52 @@
 import { jsx as s } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import { useCallback as u, useMemo as O } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import { useCallback as u, useMemo as S } from "../../../../../external/preact/hooks/dist/hooks.module.js";
 import { useFetch as k } from "../../../../../hooks/useFetch.js";
 import { BASE_CLASS as q, ITEM_CLASS as y } from "./constants.js";
 import { memo as L } from "../../../../../external/preact/compat/dist/compat.module.js";
-import { useResponsiveViewport as N, mediaQueries as _ } from "../../../../../hooks/useResponsiveViewport.js";
+import { useResponsiveContainer as N, containerQueries as _ } from "../../../../../hooks/useResponsiveContainer.js";
 /* empty css                       */
-import { TotalsCard as a } from "./TotalsCard.js";
+import { TotalsCard as p } from "./TotalsCard.js";
 import { Fragment as v } from "../../../../../external/preact/dist/preact.module.js";
 import { useConfigContext as B } from "../../../../../core/ConfigContext/context.js";
 import { EMPTY_OBJECT as j } from "../../../../../utils/value/constants.js";
 const Z = L(
   ({
-    availableCurrencies: i,
+    availableCurrencies: e,
     isAvailableCurrenciesFetching: F,
-    balanceAccountId: t,
+    balanceAccountId: r,
     createdSince: f,
     createdUntil: d,
     categories: l,
     statuses: c,
-    maxAmount: h,
-    minAmount: C,
+    maxAmount: C,
+    minAmount: h,
     currencies: T,
-    fullWidth: n
+    fullWidth: i
   }) => {
-    const { getTransactionTotals: r } = B().endpoints, x = u(async () => r == null ? void 0 : r(j, {
+    const { getTransactionTotals: t } = B().endpoints, x = u(async () => t == null ? void 0 : t(j, {
       query: {
         createdSince: f,
         createdUntil: d,
         categories: l,
         statuses: c,
-        maxAmount: h,
-        minAmount: C,
+        maxAmount: C,
+        minAmount: h,
         currencies: T,
-        balanceAccountId: t
+        balanceAccountId: r
       }
-    }), [t, l, f, d, T, r, h, C, c]), { data: o, isFetching: S } = k({
-      fetchOptions: O(() => ({ enabled: !!t && !!r }), [t, r]),
+    }), [r, l, f, d, T, t, C, h, c]), { data: o, isFetching: E } = k({
+      fetchOptions: S(() => ({ enabled: !!r && !!t }), [r, t]),
       queryFn: x
-    }), m = !t || S || F, p = u(() => {
-      if (!i || !o)
+    }), m = !r || E || F, a = u(() => {
+      if (!e || !o)
         return o == null ? void 0 : o.data;
-      const g = i.map((e) => o.data.find((M) => M.currency === e) || { currency: e, incomings: 0, expenses: 0 });
-      return g.concat(o.data.filter((e) => !g.includes(e)));
-    }, [i, o])() ?? [], E = N(_.only.xs);
-    return /* @__PURE__ */ s("div", { className: q, children: E ? /* @__PURE__ */ s(v, { children: [
-      /* @__PURE__ */ s("div", { className: y, children: /* @__PURE__ */ s(a, { totals: p, isLoading: m, hiddenField: "expenses", fullWidth: n }) }),
-      /* @__PURE__ */ s("div", { className: y, children: /* @__PURE__ */ s(a, { totals: p, isLoading: m, hiddenField: "incomings", fullWidth: n }) })
-    ] }) : /* @__PURE__ */ s(a, { totals: p, isLoading: m, fullWidth: n }) });
+      const g = e.map((n) => o.data.find((O) => O.currency === n) || { currency: n, incomings: 0, expenses: 0 });
+      return g.concat(o.data.filter((n) => !g.includes(n)));
+    }, [e, o])() ?? [], M = N(_.only.xs);
+    return /* @__PURE__ */ s("div", { className: q, children: M ? /* @__PURE__ */ s(v, { children: [
+      /* @__PURE__ */ s("div", { className: y, children: /* @__PURE__ */ s(p, { totals: a, isLoading: m, hiddenField: "expenses", fullWidth: i }) }),
+      /* @__PURE__ */ s("div", { className: y, children: /* @__PURE__ */ s(p, { totals: a, isLoading: m, hiddenField: "incomings", fullWidth: i }) })
+    ] }) : /* @__PURE__ */ s(p, { totals: a, isLoading: m, fullWidth: i }) });
   }
 );
 export {

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

@@ -1,210 +1,213 @@
-import { jsx as i } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { jsx as s } 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 { TransactionsTable as Ee, TRANSACTION_FIELDS as Ne } from "../TransactionsTable/TransactionsTable.js";
+import he from "../../../../../hooks/useBalanceAccountSelection.js";
+import Fe 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 Ce from "../../../../../hooks/useModalDetails/useModalDetails.js";
+import Me from "../../../../../core/Context/useCoreContext.js";
+import { useCallback as f, useMemo as c, useState as P, useEffect as h } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import { LIMIT_OPTIONS as De, DEFAULT_PAGE_LIMIT as _e } 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";
+import { Balances as Oe } from "../Balances/Balances.js";
+import Ue from "../../../../../hooks/useDefaultOverviewFilterParams.js";
+import ge from "../../hooks/useTransactionsOverviewMultiSelectionFilters.js";
+import { AmountFilter as Re } from "../../../../internal/FilterBar/filters/AmountFilter/AmountFilter.js";
+import { MAX_TRANSACTIONS_DATE_RANGE_MONTHS as be, BASE_CLASS as Le, SUMMARY_CLASS as we, SUMMARY_ITEM_CLASS as X, BASE_CLASS_DETAILS as xe } from "./constants.js";
+import { useResponsiveContainer as ye, containerQueries as ke } from "../../../../../hooks/useResponsiveContainer.js";
+import { useCustomColumnsData as ve } from "../../../../../hooks/useCustomColumnsData.js";
+import { hasCustomField as Pe } from "../../../../utils/customData/hasCustomField.js";
+import { mergeRecords as Xe } from "../../../../utils/customData/mergeRecords.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 Ge from "../../../../internal/Pagination/hooks/useCursorPaginatedRecords.js";
+import { Header as He } from "../../../../internal/Header/Header.js";
+import { useFilterBarState as We, FilterBarMobileSwitch as Ye, FilterBar as je } from "../../../../internal/FilterBar/FilterBar.js";
+import Ke 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
+import { useConfigContext as Qe } from "../../../../../core/ConfigContext/context.js";
+import { listFrom as u } from "../../../../../utils/collection/main.js";
+import { isUndefined as H, isFunction as Ze } from "../../../../../utils/value/is.js";
+const Dr = ({
+  onFiltersChanged: a,
+  balanceAccounts: F,
+  allowLimitSelection: C,
+  preferredLimit: W = _e,
+  onRecordSelection: M,
+  showDetails: D,
+  isLoadingBalanceAccount: Y,
+  onContactSupport: j,
+  hideTitle: K,
+  dataCustomization: r
 }) => {
-  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" }, {
+  var w, x, y, k;
+  const { i18n: p } = Me(), { getTransactions: A } = Qe().endpoints, { activeBalanceAccount: e, balanceAccountSelectionOptions: Q, onBalanceAccountSelection: Z } = he(F), { defaultParams: d, nowTimestamp: S, refreshNowTimestamp: T } = Ue("transactions", e), J = f(
+    async ({ balanceAccount: n, ...i }, N) => A({ signal: N, 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],
+        ...i,
+        statuses: u(i[t.STATUSES]),
+        categories: u(i[t.CATEGORIES]),
+        currencies: u(i[t.CURRENCIES]),
+        createdSince: i[t.CREATED_SINCE] ?? d.current.defaultFilterParams[t.CREATED_SINCE],
+        createdUntil: i[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)
+        minAmount: H(i.minAmount) ? void 0 : parseFloat(i.minAmount),
+        maxAmount: H(i.maxAmount) ? void 0 : parseFloat(i.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,
+    [e == null ? void 0 : e.id, d, A]
+  ), _ = We(), V = c(() => Ze(a) ? a : void 0, [a]), $ = c(() => C ? De : void 0, [C]), { canResetFilters: q, error: B, fetching: z, filters: o, limit: ee, limitOptions: re, records: I, resetFilters: Je, updateFilters: l, updateLimit: te, ...se } = Ge({
+    fetchRecords: J,
     dataField: "data",
     filterParams: d.current.defaultFilterParams,
     initialFiltersSameAsDefault: !0,
-    onFiltersChanged: Z,
-    preferredLimit: j,
+    onFiltersChanged: V,
+    preferredLimit: W,
     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(
+    enabled: !!(e != null && e.id) && !!A
+  }), [m, O] = P([]), [ne, ie] = P(!1), oe = f((n, i) => {
+    O(n), ie(i);
+  }, []), { categoriesFilter: U, currenciesFilter: g, statusesFilter: E } = ge(
     {
-      filters: n,
+      filters: o,
       updateFilters: l
     },
-    a
+    m
   );
-  I(() => {
-    L(void 0), l({
+  h(() => {
+    O(void 0), l({
       [t.BALANCE_ACCOUNT]: e == null ? void 0 : e.id,
       [t.CURRENCIES]: void 0
     });
-  }, [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(
+  }, [l, e == null ? void 0 : e.id]), h(() => {
+    T();
+  }, [o, T]), h(() => {
+    E.updateSelection({ target: { value: "Booked", name: "status" } });
+  }, [E]);
+  const R = ye(ke.down.sm), le = !!m && m.length > 1, b = c(
     () => ({
-      showDetails: U ?? !0,
-      callback: O
+      showDetails: D ?? !0,
+      callback: M
     }),
-    [U, O]
-  ), me = u(() => ({ transaction: y }), [y]), de = c(
-    ({ records: o, retrievedData: r }) => o.map((s) => ({ ...r.find((C) => C.id === s.id), ...s })),
+    [D, M]
+  ), me = c(() => ({ transaction: b }), [b]), ce = f(
+    ({ records: n, retrievedData: i }) => Xe(n, i, (N, v) => N.id === v.id),
     []
-  ), { 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({
+  ), de = c(() => {
+    var n;
+    return Pe((n = r == null ? void 0 : r.list) == null ? void 0 : n.fields, Ne);
+  }, [(w = r == null ? void 0 : r.list) == null ? void 0 : w.fields]), { customRecords: fe, loadingCustomRecords: ue } = ve({
+    records: I,
+    hasCustomColumn: de,
+    onDataRetrieve: (x = r == null ? void 0 : r.list) == null ? void 0 : x.onDataRetrieve,
+    mergeCustomData: ce
+  }), { updateDetails: L, resetDetails: ae, selectedDetail: pe } = Ce(me), Ae = f(
+    ({ id: n }) => {
+      L({
         selection: {
           type: "transaction",
-          data: o,
-          balanceAccount: e || "",
-          extraDetails: k({ id: o }) ?? He
+          data: n,
+          balanceAccount: e || ""
         },
         modalSize: "small"
-      }).callback({ id: o });
+      }).callback({ id: n });
     },
-    [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,
+    [e, L]
+  ), Se = c(() => {
+    const n = new Date(S);
+    return n.setMonth(n.getMonth() - be), n.toString();
+  }, [S]);
+  return /* @__PURE__ */ s("div", { className: Le, children: [
+    /* @__PURE__ */ s(He, { hideTitle: K, titleKey: "transactionsOverviewTitle", children: /* @__PURE__ */ s(Ye, { ..._ }) }),
+    /* @__PURE__ */ s(je, { ..._, children: [
+      /* @__PURE__ */ s(
+        Ke,
         {
           activeBalanceAccount: e,
-          balanceAccountSelectionOptions: J,
-          onBalanceAccountSelection: K
+          balanceAccountSelectionOptions: Q,
+          onBalanceAccountSelection: Z
         }
       ),
-      /* @__PURE__ */ i(
-        Ee,
+      /* @__PURE__ */ s(
+        Fe,
         {
-          canResetFilters: B,
+          canResetFilters: q,
           defaultParams: d,
-          filters: n,
-          nowTimestamp: E,
-          refreshNowTimestamp: F,
-          sinceDate: pe,
+          filters: o,
+          nowTimestamp: S,
+          refreshNowTimestamp: T,
+          sinceDate: Se,
           timezone: e == null ? void 0 : e.timeZone,
           updateFilters: l
         }
       ),
-      /* @__PURE__ */ i(G, { ...w, placeholder: A.get("filterPlaceholder.category") }),
-      /* @__PURE__ */ i(
-        Ue,
+      /* @__PURE__ */ s(G, { ...U, placeholder: p.get("filterPlaceholder.category") }),
+      /* @__PURE__ */ s(
+        Re,
         {
-          availableCurrencies: a,
-          selectedCurrencies: p(n[t.CURRENCIES]),
+          availableCurrencies: m,
+          selectedCurrencies: u(o[t.CURRENCIES]),
           name: "range",
-          label: A.get("amount"),
-          minAmount: n[t.MIN_AMOUNT],
-          maxAmount: n[t.MAX_AMOUNT],
+          label: p.get("amount"),
+          minAmount: o[t.MIN_AMOUNT],
+          maxAmount: o[t.MAX_AMOUNT],
           updateFilters: l,
           onChange: l
         }
       ),
-      /* @__PURE__ */ i(G, { ...x, placeholder: A.get("filterPlaceholder.currency") })
+      /* @__PURE__ */ s(G, { ...g, placeholder: p.get("filterPlaceholder.currency") })
     ] }),
-    /* @__PURE__ */ i("div", { className: Le, children: [
-      /* @__PURE__ */ i("div", { className: X, children: /* @__PURE__ */ i(
+    /* @__PURE__ */ s("div", { className: we, children: [
+      /* @__PURE__ */ s("div", { className: X, children: /* @__PURE__ */ s(
         Ie,
         {
-          availableCurrencies: a,
+          availableCurrencies: m,
           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,
+          statuses: E.selection,
+          categories: U.selection,
+          createdUntil: o[t.CREATED_UNTIL],
+          createdSince: o[t.CREATED_SINCE],
+          currencies: g.selection,
+          minAmount: o[t.MIN_AMOUNT] ? parseFloat(o[t.MIN_AMOUNT]) : void 0,
+          maxAmount: o[t.MAX_AMOUNT] ? parseFloat(o[t.MAX_AMOUNT]) : void 0,
           fullWidth: R
         }
       ) }),
-      /* @__PURE__ */ i("div", { className: X, children: /* @__PURE__ */ i(
-        _e,
+      /* @__PURE__ */ s("div", { className: X, children: /* @__PURE__ */ s(
+        Oe,
         {
           balanceAccountId: e == null ? void 0 : e.id,
-          onCurrenciesChange: le,
+          onCurrenciesChange: oe,
           defaultCurrencyCode: e == null ? void 0 : e.defaultCurrencyCode,
           fullWidth: R
         }
       ) })
     ] }),
-    /* @__PURE__ */ i(
+    /* @__PURE__ */ s(
       Te,
       {
-        selectedDetail: fe,
-        resetDetails: ue,
-        className: we,
-        children: /* @__PURE__ */ i(
-          Ae,
+        dataCustomization: r == null ? void 0 : r.details,
+        selectedDetail: pe,
+        resetDetails: ae,
+        className: xe,
+        children: /* @__PURE__ */ s(
+          Ee,
           {
             activeBalanceAccount: e,
-            availableCurrencies: a,
-            error: q,
-            hasMultipleCurrencies: ae,
-            limit: te,
+            availableCurrencies: m,
+            error: B,
+            hasMultipleCurrencies: le,
+            limit: ee,
             limitOptions: re,
-            loading: ee || z || !_ || ce,
-            onContactSupport: H,
-            onLimitSelection: ie,
-            onRowClick: Ce,
+            loading: z || Y || !F || ue,
+            onContactSupport: j,
+            onLimitSelection: te,
+            onRowClick: Ae,
             showPagination: !0,
-            transactions: g ? M : f,
-            customColumns: W,
-            ...oe
+            transactions: (y = r == null ? void 0 : r.list) != null && y.onDataRetrieve ? fe : I,
+            customColumns: (k = r == null ? void 0 : r.list) == null ? void 0 : k.fields,
+            ...se
           }
         )
       }
@@ -212,5 +215,5 @@ const Ft = ({
   ] });
 };
 export {
-  Ft as TransactionsOverview
+  Dr as TransactionsOverview
 };

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

@@ -1,22 +1,22 @@
 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 s from "../../../../../core/Context/useCoreContext.js";
+import { Image as m } from "../../../../internal/Image/Image.js";
 import { Tag as t } from "../../../../internal/Tag/Tag.js";
-import { TagVariant as p } from "../../../../internal/Tag/types.js";
+import { TagVariant as n } from "../../../../internal/Tag/types.js";
 import { TypographyVariant as T } from "../../../../internal/Typography/types.js";
 import f from "../../../../internal/Typography/Typography.js";
-import { useResponsiveViewport as l, mediaQueries as n } from "../../../../../hooks/useResponsiveViewport.js";
+import { useResponsiveContainer as l, containerQueries as p } from "../../../../../hooks/useResponsiveContainer.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 = ({
+import { Fragment as C } from "../../../../../external/preact/dist/preact.module.js";
+const Y = ({
   paymentMethod: r,
-  bankAccount: i
+  bankAccount: a
 }) => {
-  const { i18n: a } = m(), e = l(n.down.xs);
-  return /* @__PURE__ */ o("div", { className: g, children: r || i ? /* @__PURE__ */ o(E, { children: [
+  const { i18n: i } = s(), e = l(p.down.xs);
+  return /* @__PURE__ */ o("div", { className: g, children: r || a ? /* @__PURE__ */ o(C, { children: [
     /* @__PURE__ */ o("div", { className: N, children: /* @__PURE__ */ o(
-      s,
+      m,
       {
         name: r ? r.type : "bankTransfer",
         alt: r ? r.type : "bankTransfer",
@@ -24,9 +24,9 @@ const V = ({
         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 }) });
+    /* @__PURE__ */ o(f, { variant: T.BODY, stronger: e, children: r ? _(r) : a == null ? void 0 : a.accountNumberLastFourDigits })
+  ] }) : /* @__PURE__ */ o(t, { label: i.get("noData"), variant: n.LIGHT_WITH_OUTLINE }) });
 };
 export {
-  V as default
+  Y as default
 };