import { jsx as r } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js";
import { memo as w } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/compat/dist/compat.module.js";
import { useState as y, useMemo as t } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/hooks/dist/hooks.module.js";
import x from "../../../../internal/ExpandableCard/ExpandableCard.js";
import { BalanceItem as u } from "../BalanceItem/BalanceItem.js";
import { useMaxWidthsState as $ } from "../../hooks/useMaxWidths.js";
import C from "../../../../../core/Context/preact/useCoreContext.js";
import { Fragment as M } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/dist/preact.module.js";
import B from "../../../../../utils/random/uniqueId.js";
const q = w(({ balances: b, isLoading: n, hiddenField: l, fullWidth: f, ...I }) => {
  const { i18n: s } = C(), [c, i] = $(), [o, m] = y(!1), d = t(() => s.get("transactions.overview.balances.currency.label"), [s]), [a, ...v] = t(() => b.map((e) => ({
    ...e,
    key: e.currency,
    availableBalanceElemId: B("elem"),
    reservedBalanceElemId: B("elem")
  })), [b]), E = t(() => {
    switch (l) {
      case "available":
        return s.get("transactions.overview.balances.lists.reserved");
      case "reserved":
        return s.get("transactions.overview.balances.lists.available");
      default:
        return s.get("transactions.overview.balances.lists.default");
    }
  }, [s, l]), p = t(
    () => /* @__PURE__ */ r(
      "div",
      {
        role: "listitem",
        "aria-label": a ? `${d}: ${a.currency}` : void 0,
        "aria-describedby": a ? `${a.availableBalanceElemId} ${a.reservedBalanceElemId}` : void 0,
        children: /* @__PURE__ */ r(
          u,
          {
            showLabelUnderline: o,
            balance: a,
            hiddenField: l,
            widths: c,
            isHeader: !0,
            isSkeleton: n,
            isLoading: n,
            onWidthsSet: i,
            reservedBalanceElemId: a?.reservedBalanceElemId,
            availableBalanceElemId: a?.availableBalanceElemId
          }
        )
      }
    ),
    [o, a, l, c, n, i, d]
  ), h = t(() => !n && v.length ? /* @__PURE__ */ r(M, { children: v.map((e) => /* @__PURE__ */ r(
    "div",
    {
      role: "listitem",
      "aria-label": `${d}: ${e.currency}`,
      "aria-describedby": `${e.availableBalanceElemId} ${e.reservedBalanceElemId}`,
      children: /* @__PURE__ */ r(
        u,
        {
          showLabelUnderline: o,
          balance: e,
          hiddenField: l,
          widths: c,
          onWidthsSet: i,
          reservedBalanceElemId: e.reservedBalanceElemId,
          availableBalanceElemId: e.availableBalanceElemId
        }
      )
    },
    e.key
  )) }) : void 0, [n, v, o, l, c, i, d]);
  return /* @__PURE__ */ r(
    x,
    {
      renderContent: ({ collapsibleContent: e }) => /* @__PURE__ */ r("div", { role: "list", "aria-label": E, children: [
        p,
        e
      ] }),
      fullWidth: f,
      onMouseEnter: () => m(!0),
      onFocus: () => m(!0),
      onMouseLeave: () => m(!1),
      onBlur: () => m(!1),
      ...I,
      children: h
    }
  );
});
export {
  q as BalancesCard
};
