import { jsx as t, jsxs as c, Fragment as V } from "react/jsx-runtime";
import { bigDecimal as O, prettifyCurrencyNumber as W, prettifyTokenAmount as _, prettifyNumber as q } from "@argent/x-shared";
import { minimumAmountOutFromTrade as H } from "@argent/x-shared/swap";
import K from "../icons/FilterSecondaryIcon.js";
import { useDisclosure as T, Flex as f, Spinner as D, Button as Q } from "@chakra-ui/react";
import { useMemo as S } from "react";
import { useTranslation as z } from "react-i18next";
import { CompoundInputDeprecated as N } from "../../components/CompoundInputDeprecated/index.js";
import { SwapDetails as P } from "./SwapDetails.js";
import { SwapSwitchDirectionButton as G } from "./SwapSwitchDirectionButton.js";
import { SwapInputError as F } from "./types.js";
import { CompoundDialogBottomSheet as v } from "../../components/CompoundDialogBottomSheet/index.js";
import { CompoundInput as x } from "../../components/CompoundInput/index.js";
import { P3 as J } from "../../components/typography.generated.js";
function me({ assetSelect: a, slippage: r, pay: m, receive: s, onSwitchTokens: B, error: y, isDisabled: M, showDetails: $, trade: e, isLoadingTrade: u, submitButton: h = { show: !0, type: "submit" } }) {
  var A;
  const { t: n } = z(), w = ((A = r.options) == null ? void 0 : A.multiplier) || 100, { isOpen: U, onOpen: k, onClose: I } = T(), { isOpen: E, onOpen: b, onClose: d } = T(), [R, l] = S(function() {
    if (e) {
      const o = O.formatUnits({
        value: BigInt(e.payAmount),
        decimals: e.payToken.decimals ?? 18
      }), i = O.formatUnits({
        value: BigInt(e.receiveAmount),
        decimals: e.receiveToken.decimals ?? 18
      }), C = W(Number(i) / Number(o));
      let p = !!(e.payAmountInCurrency && e.receiveAmountInCurrency && Number(e.payAmountInCurrency) !== 0 && Number(e.receiveAmountInCurrency) !== 0) ? (Number(e.payAmountInCurrency) - Number(e.receiveAmountInCurrency)) / Number(e.receiveAmountInCurrency) * 100 : null;
      return p = p === null || p === 0 ? p : p * -1, [C, p];
    }
    return [null, null];
  }, [e]), g = S(function() {
    var o;
    if (e) {
      const { value: i, decimals: C } = H(e, r.value);
      return _({
        amount: i,
        decimals: C,
        symbol: (o = e.receiveToken) == null ? void 0 : o.symbol
      });
    }
  }, [e, r]), j = S(function() {
    if (e) {
      const o = [
        {
          property: n("swap.swapFee"),
          value: `${e.totalFeePercentage * 100}%`
        },
        {
          property: n("swap.minReceivedInclFees"),
          value: `${g}`
        },
        {
          property: n("swap.maxSlippage"),
          value: (r.value / w).toString(),
          buttonProps: {
            icon: /* @__PURE__ */ t(K, {}),
            "aria-label": "some label",
            onClick: b
          },
          alert: r.value / w > 1 ? n("swap.yourTransactionMayBeFrontrunAndResultInAnUnfavorableTrade") : ""
        },
        {
          property: n("swap.providers"),
          value: e.route.name
        }
      ];
      return l ? o.push({
        property: n("swap.priceImpact"),
        value: `${q(l)}%`,
        alert: l && l < -1 ? n("swap.yourTradeWillHaveASignificantImpactOnThePrice") : ""
      }) : e && l === null && o.push({
        property: n("swap.priceImpact"),
        value: "",
        alert: n("swap.noPriceFoundCannotDeterminePriceImpact")
      }), o;
    }
    return [];
  }, [
    e,
    g,
    r.value,
    w,
    b,
    l,
    n
  ]);
  return /* @__PURE__ */ c(V, { children: [
    /* @__PURE__ */ t(v, { isOpen: U, onClose: () => I(), bottomSheetProps: {
      expandOnContentDrag: !0,
      snapPoints: ({ maxHeight: o }) => [
        o - (a.bottomSheetTopMargin ?? 80) / 2
      ]
    }, children: /* @__PURE__ */ t(v.SelectAsset, { loading: a.loading, tokens: a.tokens, onSelect: (o) => {
      a.onSelect(o), I();
    } }) }),
    /* @__PURE__ */ t(v, { isOpen: E, onClose: () => d(), bottomSheetProps: {
      expandOnContentDrag: !0
    }, children: /* @__PURE__ */ t(v.SlippageInput, { onSave: (o) => {
      r.onSave(o), d();
    }, value: r.value, options: r.options }) }),
    /* @__PURE__ */ c(f, { direction: "column", gap: "4", children: [
      /* @__PURE__ */ c(f, { w: "full", direction: "column", gap: "1", children: [
        /* @__PURE__ */ c(f, { pos: "relative", children: [
          /* @__PURE__ */ t(x, { amount: m.amount, token: {
            ...m.token,
            onClick: (o) => {
              var i;
              (i = m.token) == null || i.onClick(o), k();
            }
          }, isLoading: m.isLoading, children: /* @__PURE__ */ t(N.Default, { title: n("swap.pay") }) }),
          /* @__PURE__ */ t(G, { onClick: B })
        ] }),
        /* @__PURE__ */ t(x, { amount: s.amount, token: {
          ...s.token,
          onClick: (o) => {
            var i;
            (i = s.token) == null || i.onClick(o), k();
          }
        }, isLoading: s.isLoading, children: /* @__PURE__ */ t(N.Default, { title: n("swap.receive") }) })
      ] }),
      !e && u && /* @__PURE__ */ c(f, { bg: "surface-elevated", justifyContent: "space-between", alignItems: "center", p: "4", rounded: "lg", fontWeight: "500", children: [
        /* @__PURE__ */ t(J, { children: n("swap.findingTheBestRate") }),
        /* @__PURE__ */ t(D, {})
      ] }),
      $ && e && /* @__PURE__ */ t(P, { children: /* @__PURE__ */ t(P.Default, { header: {
        primary: {
          property: n("swap.bestPrice"),
          value: `1 ${e.payToken.symbol} = ${R} ${e.receiveToken.symbol}`
        },
        secondary: {
          property: n(u ? "swap.updatingQuote" : "swap.quoteUpToDate"),
          icon: u ? /* @__PURE__ */ t(D, { w: "2", h: "2" }) : void 0
        }
      }, items: j }) })
    ] }),
    h.show && /* @__PURE__ */ t(Q, { type: h.type, onClick: h.onClick, colorScheme: !u && y && ![F.NO_TOKEN, F.NO_AMOUNT].includes(y) ? "danger" : "primary", w: "full", isDisabled: M, children: n(u ? "swap.loading" : y || "swap.review") })
  ] });
}
export {
  me as Swap
};
