@velora-dex/widget 0.6.1-dev.1 → 0.6.1-dev.2

package/dist/components/widget/TransactionDetails/LimitOrderDetails/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../../../../../src/components/widget/TransactionDetails/LimitOrderDetails/utils.tsx"],"sourcesContent":["import dayjs from \"dayjs\";\nimport type {\n  TransactionListItem,\n  TransactionListItemSwap,\n  TransactionListItemSwapExtra,\n} from \"../types\";\nimport type { DetailWithValue } from \"../../Details/types\";\nimport type { PayReceiveInfoProps } from \"../../PayReceiveInfo/types\";\nimport { Rate, StatusBadge } from \"../TransactionListItem\";\nimport { formatTokenAmount } from \"@/lib/utils/formatTokenBalance\";\nimport { getTxStatus } from \"@/transactions/status\";\nimport type { TokenBadgeProps } from \"../../TokenBadge/types\";\n\nexport function constructSubmitDateDetail({\n  timestamp,\n}: {\n  timestamp: string | number;\n}): DetailWithValue {\n  return {\n    title: \"Submit Date\",\n    value: dayjs(timestamp).format(\"DD MMM YYYY h:mm A\"),\n  };\n}\n\nconst rateClasses = {\n  left: \"dark:text-contrast-6\",\n  right: \"dark:text-contrast-6\",\n};\n\nexport function constructTxRateDetail({\n  extra,\n}: {\n  extra: TransactionListItemSwap[\"extra\"];\n}): DetailWithValue {\n  return {\n    title: \"Order Rate\",\n    value: <Rate extra={extra} classes={rateClasses} />,\n  };\n}\n\nexport function constructTxStatusDetail(\n  tx: TransactionListItem\n): DetailWithValue {\n  return {\n    title: \"Order Status\",\n    value: <StatusBadge status={getTxStatus(tx)} />,\n  };\n}\n\nexport function constructOrderTypeDetail(): DetailWithValue {\n  return { title: \"Order Type\", value: \"SWAP\" };\n}\n\nconst tokenBadgeClasses = {\n  amount: \"dark:text-contrast-9\",\n  symbol: \"dark:text-contrast-9\",\n  logo: \"size-[18px]\",\n};\n\nexport function constructPayReceiveInfoProps({\n  extra,\n}: {\n  extra: TransactionListItemSwapExtra;\n}): PayReceiveInfoProps {\n  const { srcToken, destToken, srcAmountUnit, destAmountUnit } = extra;\n\n  const formattedSrcAmount = formatTokenAmount(srcAmountUnit);\n  const formattedDestAmount = formatTokenAmount(destAmountUnit);\n\n  const topTokenBadgeProps: TokenBadgeProps = {\n    address: srcToken.address,\n    symbol: srcToken.symbol,\n    chainId: srcToken.network,\n    img: srcToken.img,\n    amount: formattedSrcAmount,\n    amountPosition: \"right\" as const,\n    classes: tokenBadgeClasses,\n    showNetworkIcon: true,\n  };\n\n  const bottomTokenBadgeProps: TokenBadgeProps = {\n    address: destToken.address,\n    symbol: destToken.symbol,\n    chainId: destToken.network,\n    img: destToken.img,\n    amount: formattedDestAmount,\n    amountPosition: \"right\" as const,\n    classes: tokenBadgeClasses,\n    showNetworkIcon: true,\n  };\n\n  return {\n    topToken: {\n      tokenBadgeProps: topTokenBadgeProps,\n      label: \"Pay\",\n    },\n    bottomToken: {\n      tokenBadgeProps: bottomTokenBadgeProps,\n      label: \"Receive\",\n    },\n  };\n}\n"],"names":["constructSubmitDateDetail","timestamp","title","value","dayjs","format","rateClasses","left","right","constructTxRateDetail","extra","constructTxStatusDetail","tx","getTxStatus","constructOrderTypeDetail","tokenBadgeClasses","amount","symbol","logo","constructPayReceiveInfoProps","srcToken","destToken","srcAmountUnit","destAmountUnit","formattedSrcAmount","formatTokenAmount","formattedDestAmount","topTokenBadgeProps","address","chainId","network","img","amountPosition","classes","showNetworkIcon","bottomTokenBadgeProps","topToken","tokenBadgeProps","label","bottomToken"],"mappings":";;;;;;AAaO,SAASA,yBAAAA,CAA0B;AAAA,EACxCC;AAGF,CAAA,EAAoB;AAClB,EAAA,OAAO;AAAA,IACLC,KAAAA,EAAO,aAAA;AAAA,IACPC,KAAAA,EAAOC,KAAAA,CAAMH,SAAS,CAAA,CAAEI,OAAO,oBAAoB;AAAA,GACrD;AACF;AAEA,MAAMC,WAAAA,GAAc;AAAA,EAClBC,IAAAA,EAAM,sBAAA;AAAA,EACNC,KAAAA,EAAO;AACT,CAAA;AAEO,SAASC,qBAAAA,CAAsB;AAAA,EACpCC;AAGF,CAAA,EAAoB;AAClB,EAAA,OAAO;AAAA,IACLR,KAAAA,EAAO,YAAA;AAAA,IACPC,KAAAA,kBAAO,GAAA,CAAC,IAAA,EAAA,EAAK,KAAA,EAAc,SAASG,WAAAA,EAAY;AAAA,GAClD;AACF;AAEO,SAASK,wBACdC,EAAAA,EACiB;AACjB,EAAA,OAAO;AAAA,IACLV,KAAAA,EAAO,cAAA;AAAA,IACPC,uBAAO,GAAA,CAAC,WAAA,EAAA,EAAY,MAAA,EAAQU,WAAAA,CAAYD,EAAE,CAAA,EAAE;AAAA,GAC9C;AACF;AAEO,SAASE,wBAAAA,GAA4C;AAC1D,EAAA,OAAO;AAAA,IAAEZ,KAAAA,EAAO,YAAA;AAAA,IAAcC,KAAAA,EAAO;AAAA,GAAO;AAC9C;AAEA,MAAMY,iBAAAA,GAAoB;AAAA,EACxBC,MAAAA,EAAQ,sBAAA;AAAA,EACRC,MAAAA,EAAQ,sBAAA;AAAA,EACRC,IAAAA,EAAM;AACR,CAAA;AAEO,SAASC,4BAAAA,CAA6B;AAAA,EAC3CT;AAGF,CAAA,EAAwB;AACtB,EAAA,MAAM;AAAA,IAAEU,QAAAA;AAAAA,IAAUC,SAAAA;AAAAA,IAAWC,aAAAA;AAAAA,IAAeC;AAAAA,GAAe,GAAIb,KAAAA;AAE/D,EAAA,MAAMc,kBAAAA,GAAqBC,kBAAkBH,aAAa,CAAA;AAC1D,EAAA,MAAMI,mBAAAA,GAAsBD,kBAAkBF,cAAc,CAAA;AAE5D,EAAA,MAAMI,kBAAAA,GAAsC;AAAA,IAC1CC,SAASR,QAAAA,CAASQ,OAAAA;AAAAA,IAClBX,QAAQG,QAAAA,CAASH,MAAAA;AAAAA,IACjBY,SAAST,QAAAA,CAASU,OAAAA;AAAAA,IAClBC,KAAKX,QAAAA,CAASW,GAAAA;AAAAA,IACdf,MAAAA,EAAQQ,kBAAAA;AAAAA,IACRQ,cAAAA,EAAgB,OAAA;AAAA,IAChBC,OAAAA,EAASlB,iBAAAA;AAAAA,IACTmB,eAAAA,EAAiB;AAAA,GACnB;AAEA,EAAA,MAAMC,qBAAAA,GAAyC;AAAA,IAC7CP,SAASP,SAAAA,CAAUO,OAAAA;AAAAA,IACnBX,QAAQI,SAAAA,CAAUJ,MAAAA;AAAAA,IAClBY,SAASR,SAAAA,CAAUS,OAAAA;AAAAA,IACnBC,KAAKV,SAAAA,CAAUU,GAAAA;AAAAA,IACff,MAAAA,EAAQU,mBAAAA;AAAAA,IACRM,cAAAA,EAAgB,OAAA;AAAA,IAChBC,OAAAA,EAASlB,iBAAAA;AAAAA,IACTmB,eAAAA,EAAiB;AAAA,GACnB;AAEA,EAAA,OAAO;AAAA,IACLE,QAAAA,EAAU;AAAA,MACRC,eAAAA,EAAiBV,kBAAAA;AAAAA,MACjBW,KAAAA,EAAO;AAAA,KACT;AAAA,IACAC,WAAAA,EAAa;AAAA,MACXF,eAAAA,EAAiBF,qBAAAA;AAAAA,MACjBG,KAAAA,EAAO;AAAA;AACT,GACF;AACF;;;;"}
+{"version":3,"file":"utils.js","names":["dayjs","TransactionListItem","TransactionListItemSwap","TransactionListItemSwapExtra","DetailWithValue","PayReceiveInfoProps","Rate","StatusBadge","formatTokenAmount","getTxStatus","TokenBadgeProps","constructSubmitDateDetail","timestamp","title","value","format","rateClasses","left","right","constructTxRateDetail","extra","constructTxStatusDetail","tx","constructOrderTypeDetail","tokenBadgeClasses","amount","symbol","logo","constructPayReceiveInfoProps","srcToken","destToken","srcAmountUnit","destAmountUnit","formattedSrcAmount","formattedDestAmount","topTokenBadgeProps","address","chainId","network","img","amountPosition","const","classes","showNetworkIcon","bottomTokenBadgeProps","topToken","tokenBadgeProps","label","bottomToken"],"sources":["../../../../../src/components/widget/TransactionDetails/LimitOrderDetails/utils.tsx"],"sourcesContent":["import dayjs from \"dayjs\";\nimport type {\n  TransactionListItem,\n  TransactionListItemSwap,\n  TransactionListItemSwapExtra,\n} from \"../types\";\nimport type { DetailWithValue } from \"../../Details/types\";\nimport type { PayReceiveInfoProps } from \"../../PayReceiveInfo/types\";\nimport { Rate, StatusBadge } from \"../TransactionListItem\";\nimport { formatTokenAmount } from \"@/lib/utils/formatTokenBalance\";\nimport { getTxStatus } from \"@/transactions/status\";\nimport type { TokenBadgeProps } from \"../../TokenBadge/types\";\n\nexport function constructSubmitDateDetail({\n  timestamp,\n}: {\n  timestamp: string | number;\n}): DetailWithValue {\n  return {\n    title: \"Submit Date\",\n    value: dayjs(timestamp).format(\"DD MMM YYYY h:mm A\"),\n  };\n}\n\nconst rateClasses = {\n  left: \"dark:text-contrast-6\",\n  right: \"dark:text-contrast-6\",\n};\n\nexport function constructTxRateDetail({\n  extra,\n}: {\n  extra: TransactionListItemSwap[\"extra\"];\n}): DetailWithValue {\n  return {\n    title: \"Order Rate\",\n    value: <Rate extra={extra} classes={rateClasses} />,\n  };\n}\n\nexport function constructTxStatusDetail(\n  tx: TransactionListItem\n): DetailWithValue {\n  return {\n    title: \"Order Status\",\n    value: <StatusBadge status={getTxStatus(tx)} />,\n  };\n}\n\nexport function constructOrderTypeDetail(): DetailWithValue {\n  return { title: \"Order Type\", value: \"SWAP\" };\n}\n\nconst tokenBadgeClasses = {\n  amount: \"dark:text-contrast-9\",\n  symbol: \"dark:text-contrast-9\",\n  logo: \"size-[18px]\",\n};\n\nexport function constructPayReceiveInfoProps({\n  extra,\n}: {\n  extra: TransactionListItemSwapExtra;\n}): PayReceiveInfoProps {\n  const { srcToken, destToken, srcAmountUnit, destAmountUnit } = extra;\n\n  const formattedSrcAmount = formatTokenAmount(srcAmountUnit);\n  const formattedDestAmount = formatTokenAmount(destAmountUnit);\n\n  const topTokenBadgeProps: TokenBadgeProps = {\n    address: srcToken.address,\n    symbol: srcToken.symbol,\n    chainId: srcToken.network,\n    img: srcToken.img,\n    amount: formattedSrcAmount,\n    amountPosition: \"right\" as const,\n    classes: tokenBadgeClasses,\n    showNetworkIcon: true,\n  };\n\n  const bottomTokenBadgeProps: TokenBadgeProps = {\n    address: destToken.address,\n    symbol: destToken.symbol,\n    chainId: destToken.network,\n    img: destToken.img,\n    amount: formattedDestAmount,\n    amountPosition: \"right\" as const,\n    classes: tokenBadgeClasses,\n    showNetworkIcon: true,\n  };\n\n  return {\n    topToken: {\n      tokenBadgeProps: topTokenBadgeProps,\n      label: \"Pay\",\n    },\n    bottomToken: {\n      tokenBadgeProps: bottomTokenBadgeProps,\n      label: \"Receive\",\n    },\n  };\n}\n"],"mappings":";;;;;;AAaA,SAAgBW,EAA0B,EACxCC,gBAGkB;AAClB,QAAO;EACLC,OAAO;EACPC,OAAOd,EAAMY,EAAU,CAACG,OAAO,qBAAoB;EACpD;;AAGH,IAAMC,IAAc;CAClBC,MAAM;CACNC,OAAO;CACR;AAED,SAAgBC,EAAsB,EACpCC,YAGkB;AAClB,QAAO;EACLP,OAAO;EACPC,OAAO,kBAAC,GAAD;GAAaM;GAAO,SAASJ;GAAY,CAAA;EACjD;;AAGH,SAAgBK,EACdC,GACiB;AACjB,QAAO;EACLT,OAAO;EACPC,OAAO,kBAAC,GAAD,EAAa,QAAQL,EAAYa,EAAG,EAAC,CAAA;EAC7C;;AAGH,SAAgBC,IAA4C;AAC1D,QAAO;EAAEV,OAAO;EAAcC,OAAO;EAAQ;;AAG/C,IAAMU,IAAoB;CACxBC,QAAQ;CACRC,QAAQ;CACRC,MAAM;CACP;AAED,SAAgBC,EAA6B,EAC3CR,YAGsB;CACtB,IAAM,EAAES,aAAUC,cAAWC,kBAAeC,sBAAmBZ,GAEzDa,IAAqBzB,EAAkBuB,EAAc,EACrDG,IAAsB1B,EAAkBwB,EAAe,EAEvDG,IAAsC;EAC1CC,SAASP,EAASO;EAClBV,QAAQG,EAASH;EACjBW,SAASR,EAASS;EAClBC,KAAKV,EAASU;EACdd,QAAQQ;EACRO,gBAAgB;EAChBE,SAASlB;EACTmB,iBAAiB;EAClB,EAEKC,IAAyC;EAC7CR,SAASN,EAAUM;EACnBV,QAAQI,EAAUJ;EAClBW,SAASP,EAAUQ;EACnBC,KAAKT,EAAUS;EACfd,QAAQS;EACRM,gBAAgB;EAChBE,SAASlB;EACTmB,iBAAiB;EAClB;AAED,QAAO;EACLE,UAAU;GACRC,iBAAiBX;GACjBY,OAAO;GACR;EACDC,aAAa;GACXF,iBAAiBF;GACjBG,OAAO;GACT;EACD"}

package/dist/components/widget/TransactionDetails/TransactionListItem.js

@@ -1,387 +1,174 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { d as distExports } from '../../../_virtual/index.js';
-import { TokenBadge } from '../TokenBadge/TokenBadge.js';
-import { NetworkWithIcon } from '../NetworkWithIcon/NetworkWithIcon.js';
-import { formatTokenAmount } from '../../../lib/utils/formatTokenBalance.js';
-import { calcRate } from '../../../lib/utils/rate.js';
-import { cn, replaceUnderscoresWithSpaces } from '../../../lib/utils/index.js';
-import { getTxStatus } from '../../../transactions/status.js';
-
-const missingContent = "-";
-const TransactionListItemComp = (t0) => {
-  const $ = distExports.c(10);
-  const {
-    txItem,
-    onClick
-  } = t0;
-  let t1;
-  if ($[0] !== onClick || $[1] !== txItem) {
-    t1 = () => onClick(txItem);
-    $[0] = onClick;
-    $[1] = txItem;
-    $[2] = t1;
-  } else {
-    t1 = $[2];
-  }
-  let t2;
-  let t3;
-  if ($[3] !== txItem) {
-    t2 = /* @__PURE__ */ jsx(TradeAndNetwork, { ...txItem });
-    t3 = /* @__PURE__ */ jsx(RateAndStatus, { ...txItem });
-    $[3] = txItem;
-    $[4] = t2;
-    $[5] = t3;
-  } else {
-    t2 = $[4];
-    t3 = $[5];
-  }
-  let t4;
-  if ($[6] !== t1 || $[7] !== t2 || $[8] !== t3) {
-    t4 = /* @__PURE__ */ jsxs("div", { className: "bg-white dark:bg-contrast-3 p-4 rounded-sm cursor-pointer", onClick: t1, children: [
-      t2,
-      t3
-    ] });
-    $[6] = t1;
-    $[7] = t2;
-    $[8] = t3;
-    $[9] = t4;
-  } else {
-    t4 = $[9];
-  }
-  return t4;
-};
-const srcTokenBadgeClasses = {
-  logo: "size-[16px]",
-  root: "z-1"
-};
-const destTokenBadgeClasses = {
-  logo: "size-[16px]",
-  root: "-ml-1"
-};
-const networkIconClasses = {
-  root: "gap-2",
-  name: "dark:text-contrast-7"
-};
-const TradeAndNetwork = (t0) => {
-  const $ = distExports.c(7);
-  const {
-    extra,
-    chainId
-  } = t0;
-  let t1;
-  if ($[0] !== extra) {
-    t1 = /* @__PURE__ */ jsx(Trade, { ...extra });
-    $[0] = extra;
-    $[1] = t1;
-  } else {
-    t1 = $[1];
-  }
-  let t2;
-  if ($[2] !== chainId) {
-    t2 = /* @__PURE__ */ jsx(NetworkWithIcon, { networkId: chainId, classes: networkIconClasses });
-    $[2] = chainId;
-    $[3] = t2;
-  } else {
-    t2 = $[3];
-  }
-  let t3;
-  if ($[4] !== t1 || $[5] !== t2) {
-    t3 = /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between pb-4", children: [
-      t1,
-      t2
-    ] });
-    $[4] = t1;
-    $[5] = t2;
-    $[6] = t3;
-  } else {
-    t3 = $[6];
-  }
-  return t3;
-};
-const Trade = (t0) => {
-  const $ = distExports.c(25);
-  const {
-    srcToken,
-    destToken,
-    srcAmountUnit,
-    destAmountUnit
-  } = t0;
-  if (!srcToken || !destToken || !srcAmountUnit || !destAmountUnit) {
-    return missingContent;
-  }
-  let t1;
-  if ($[0] !== srcAmountUnit) {
-    t1 = formatTokenAmount(srcAmountUnit);
-    $[0] = srcAmountUnit;
-    $[1] = t1;
-  } else {
-    t1 = $[1];
-  }
-  const formattedSrcAmount = t1;
-  let t2;
-  if ($[2] !== destAmountUnit) {
-    t2 = formatTokenAmount(destAmountUnit);
-    $[2] = destAmountUnit;
-    $[3] = t2;
-  } else {
-    t2 = $[3];
-  }
-  const formattedDestAmount = t2;
-  let t3;
-  if ($[4] !== srcToken.address || $[5] !== srcToken.img || $[6] !== srcToken.network) {
-    t3 = /* @__PURE__ */ jsx(TokenBadge, { address: srcToken.address, chainId: srcToken.network, img: srcToken.img, classes: srcTokenBadgeClasses });
-    $[4] = srcToken.address;
-    $[5] = srcToken.img;
-    $[6] = srcToken.network;
-    $[7] = t3;
-  } else {
-    t3 = $[7];
-  }
-  let t4;
-  if ($[8] !== destToken.address || $[9] !== destToken.img || $[10] !== destToken.network) {
-    t4 = /* @__PURE__ */ jsx(TokenBadge, { address: destToken.address, img: destToken.img, chainId: destToken.network, classes: destTokenBadgeClasses });
-    $[8] = destToken.address;
-    $[9] = destToken.img;
-    $[10] = destToken.network;
-    $[11] = t4;
-  } else {
-    t4 = $[11];
-  }
-  let t5;
-  if ($[12] !== t3 || $[13] !== t4) {
-    t5 = /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
-      t3,
-      t4
-    ] });
-    $[12] = t3;
-    $[13] = t4;
-    $[14] = t5;
-  } else {
-    t5 = $[14];
-  }
-  const icons = t5;
-  let t6;
-  if ($[15] === Symbol.for("react.memo_cache_sentinel")) {
-    t6 = /* @__PURE__ */ jsx("div", { className: "text-xs font-medium text-contrast-5", children: "Swap" });
-    $[15] = t6;
-  } else {
-    t6 = $[15];
-  }
-  let t7;
-  if ($[16] === Symbol.for("react.memo_cache_sentinel")) {
-    t7 = /* @__PURE__ */ jsx("span", { className: "mx-1", children: "→" });
-    $[16] = t7;
-  } else {
-    t7 = $[16];
-  }
-  let t8;
-  if ($[17] !== destToken.symbol || $[18] !== formattedDestAmount || $[19] !== formattedSrcAmount || $[20] !== srcToken.symbol) {
-    t8 = /* @__PURE__ */ jsxs("div", { className: "ml-2 flex flex-col", children: [
-      t6,
-      /* @__PURE__ */ jsxs("div", { className: "text-sm font-medium dark:text-contrast-9", children: [
-        srcToken.symbol,
-        " ",
-        formattedSrcAmount,
-        t7,
-        destToken.symbol,
-        " ",
-        formattedDestAmount
-      ] })
-    ] });
-    $[17] = destToken.symbol;
-    $[18] = formattedDestAmount;
-    $[19] = formattedSrcAmount;
-    $[20] = srcToken.symbol;
-    $[21] = t8;
-  } else {
-    t8 = $[21];
-  }
-  const typeAndAmounts = t8;
-  let t9;
-  if ($[22] !== icons || $[23] !== typeAndAmounts) {
-    t9 = /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
-      icons,
-      typeAndAmounts
-    ] });
-    $[22] = icons;
-    $[23] = typeAndAmounts;
-    $[24] = t9;
-  } else {
-    t9 = $[24];
-  }
-  return t9;
-};
-const Rate = (t0) => {
-  const $ = distExports.c(16);
-  const {
-    extra,
-    classes
-  } = t0;
-  const {
-    srcToken,
-    destToken,
-    srcAmountUnit,
-    destAmountUnit
-  } = extra;
-  if (!srcToken || !destToken || !srcAmountUnit || !destAmountUnit) {
-    return missingContent;
-  }
-  let t1;
-  let t2;
-  if ($[0] !== destAmountUnit || $[1] !== srcAmountUnit) {
-    t2 = Symbol.for("react.early_return_sentinel");
-    bb0: {
-      const rateFormatted = calcRate(srcAmountUnit, destAmountUnit)?.rateFormatted;
-      if (!rateFormatted) {
-        t2 = missingContent;
-        break bb0;
-      }
-      t1 = formatTokenAmount(rateFormatted);
-    }
-    $[0] = destAmountUnit;
-    $[1] = srcAmountUnit;
-    $[2] = t1;
-    $[3] = t2;
-  } else {
-    t1 = $[2];
-    t2 = $[3];
-  }
-  if (t2 !== Symbol.for("react.early_return_sentinel")) {
-    return t2;
-  }
-  const left = `${t1} ${destToken.symbol}`;
-  const right = `per ${srcToken.symbol}`;
-  const t3 = classes?.root;
-  let t4;
-  if ($[4] !== t3) {
-    t4 = cn("text-xs", t3);
-    $[4] = t3;
-    $[5] = t4;
-  } else {
-    t4 = $[5];
-  }
-  const t5 = classes?.left;
-  let t6;
-  if ($[6] !== left || $[7] !== t5) {
-    t6 = /* @__PURE__ */ jsx("span", { className: t5, children: left });
-    $[6] = left;
-    $[7] = t5;
-    $[8] = t6;
-  } else {
-    t6 = $[8];
-  }
-  const t7 = classes?.right;
-  let t8;
-  if ($[9] !== right || $[10] !== t7) {
-    t8 = /* @__PURE__ */ jsx("span", { className: t7, children: right });
-    $[9] = right;
-    $[10] = t7;
-    $[11] = t8;
-  } else {
-    t8 = $[11];
-  }
-  let t9;
-  if ($[12] !== t4 || $[13] !== t6 || $[14] !== t8) {
-    t9 = /* @__PURE__ */ jsxs("div", { className: t4, children: [
-      t6,
-      " ",
-      t8
-    ] });
-    $[12] = t4;
-    $[13] = t6;
-    $[14] = t8;
-    $[15] = t9;
-  } else {
-    t9 = $[15];
-  }
-  return t9;
-};
-const StatusBadge = (t0) => {
-  const $ = distExports.c(9);
-  const {
-    status
-  } = t0;
-  const t1 = status === "success";
-  const t2 = status === "reverted" || status === "cancelled";
-  const t3 = status === "pending";
-  let t4;
-  if ($[0] !== t1 || $[1] !== t2 || $[2] !== t3) {
-    t4 = cn("text-[10px] p-0.5 px-2 rounded-lg w-max uppercase", {
-      "text-secondary-shamrock-green-2 bg-[#00976733]": t1,
-      "text-secondary-radical-red-1 bg-[#FF3B301A]": t2,
-      "text-secondary-orange-peel-1 bg-[#FF950033]": t3
-    });
-    $[0] = t1;
-    $[1] = t2;
-    $[2] = t3;
-    $[3] = t4;
-  } else {
-    t4 = $[3];
-  }
-  let t5;
-  if ($[4] !== status) {
-    t5 = replaceUnderscoresWithSpaces(status);
-    $[4] = status;
-    $[5] = t5;
-  } else {
-    t5 = $[5];
-  }
-  let t6;
-  if ($[6] !== t4 || $[7] !== t5) {
-    t6 = /* @__PURE__ */ jsx("div", { className: t4, children: t5 });
-    $[6] = t4;
-    $[7] = t5;
-    $[8] = t6;
-  } else {
-    t6 = $[8];
-  }
-  return t6;
-};
-const rateClasses = {
-  left: "dark:text-contrast-7",
-  right: "text-contrast-5"
-};
-const RateAndStatus = (tx) => {
-  const $ = distExports.c(9);
-  let t0;
-  if ($[0] !== tx) {
-    t0 = getTxStatus(tx);
-    $[0] = tx;
-    $[1] = t0;
-  } else {
-    t0 = $[1];
-  }
-  const txStatus = t0;
-  let t1;
-  if ($[2] !== tx.extra) {
-    t1 = /* @__PURE__ */ jsx(Rate, { extra: tx.extra, classes: rateClasses });
-    $[2] = tx.extra;
-    $[3] = t1;
-  } else {
-    t1 = $[3];
-  }
-  let t2;
-  if ($[4] !== txStatus) {
-    t2 = /* @__PURE__ */ jsx(StatusBadge, { status: txStatus });
-    $[4] = txStatus;
-    $[5] = t2;
-  } else {
-    t2 = $[5];
-  }
-  let t3;
-  if ($[6] !== t1 || $[7] !== t2) {
-    t3 = /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
-      t1,
-      t2
-    ] });
-    $[6] = t1;
-    $[7] = t2;
-    $[8] = t3;
-  } else {
-    t3 = $[8];
-  }
-  return t3;
+import { cn as e, replaceUnderscoresWithSpaces as t } from "../../../lib/utils/index.js";
+import { NetworkWithIcon as n } from "../NetworkWithIcon/NetworkWithIcon.js";
+import { TokenBadge as r } from "../TokenBadge/TokenBadge.js";
+import { calcRate as i } from "../../../lib/utils/rate.js";
+import { formatTokenAmount as a } from "../../../lib/utils/formatTokenBalance.js";
+import { getTxStatus as o } from "../../../transactions/status.js";
+import { c as s } from "react-compiler-runtime";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+//#region src/components/widget/TransactionDetails/TransactionListItem.tsx
+var u = "-", d = (e) => {
+	let t = s(10), { txItem: n, onClick: r } = e, i;
+	t[0] !== r || t[1] !== n ? (i = () => r(n), t[0] = r, t[1] = n, t[2] = i) : i = t[2];
+	let a, o;
+	t[3] === n ? (a = t[4], o = t[5]) : (a = /* @__PURE__ */ c(h, { ...n }), o = /* @__PURE__ */ c(b, { ...n }), t[3] = n, t[4] = a, t[5] = o);
+	let u;
+	return t[6] !== i || t[7] !== a || t[8] !== o ? (u = /* @__PURE__ */ l("div", {
+		className: "bg-white dark:bg-contrast-3 p-4 rounded-sm cursor-pointer",
+		onClick: i,
+		children: [a, o]
+	}), t[6] = i, t[7] = a, t[8] = o, t[9] = u) : u = t[9], u;
+}, f = {
+	logo: "size-[16px]",
+	root: "z-1"
+}, p = {
+	logo: "size-[16px]",
+	root: "-ml-1"
+}, m = {
+	root: "gap-2",
+	name: "dark:text-contrast-7"
+}, h = (e) => {
+	let t = s(7), { extra: r, chainId: i } = e, a;
+	t[0] === r ? a = t[1] : (a = /* @__PURE__ */ c(g, { ...r }), t[0] = r, t[1] = a);
+	let o;
+	t[2] === i ? o = t[3] : (o = /* @__PURE__ */ c(n, {
+		networkId: i,
+		classes: m
+	}), t[2] = i, t[3] = o);
+	let u;
+	return t[4] !== a || t[5] !== o ? (u = /* @__PURE__ */ l("div", {
+		className: "flex items-center justify-between pb-4",
+		children: [a, o]
+	}), t[4] = a, t[5] = o, t[6] = u) : u = t[6], u;
+}, g = (e) => {
+	let t = s(25), { srcToken: n, destToken: i, srcAmountUnit: o, destAmountUnit: d } = e;
+	if (!n || !i || !o || !d) return u;
+	let m;
+	t[0] === o ? m = t[1] : (m = a(o), t[0] = o, t[1] = m);
+	let h = m, g;
+	t[2] === d ? g = t[3] : (g = a(d), t[2] = d, t[3] = g);
+	let _ = g, v;
+	t[4] !== n.address || t[5] !== n.img || t[6] !== n.network ? (v = /* @__PURE__ */ c(r, {
+		address: n.address,
+		chainId: n.network,
+		img: n.img,
+		classes: f
+	}), t[4] = n.address, t[5] = n.img, t[6] = n.network, t[7] = v) : v = t[7];
+	let y;
+	t[8] !== i.address || t[9] !== i.img || t[10] !== i.network ? (y = /* @__PURE__ */ c(r, {
+		address: i.address,
+		img: i.img,
+		chainId: i.network,
+		classes: p
+	}), t[8] = i.address, t[9] = i.img, t[10] = i.network, t[11] = y) : y = t[11];
+	let b;
+	t[12] !== v || t[13] !== y ? (b = /* @__PURE__ */ l("div", {
+		className: "flex items-center",
+		children: [v, y]
+	}), t[12] = v, t[13] = y, t[14] = b) : b = t[14];
+	let x = b, S;
+	t[15] === Symbol.for("react.memo_cache_sentinel") ? (S = /* @__PURE__ */ c("div", {
+		className: "text-xs font-medium text-contrast-5",
+		children: "Swap"
+	}), t[15] = S) : S = t[15];
+	let C;
+	t[16] === Symbol.for("react.memo_cache_sentinel") ? (C = /* @__PURE__ */ c("span", {
+		className: "mx-1",
+		children: "→"
+	}), t[16] = C) : C = t[16];
+	let w;
+	t[17] !== i.symbol || t[18] !== _ || t[19] !== h || t[20] !== n.symbol ? (w = /* @__PURE__ */ l("div", {
+		className: "ml-2 flex flex-col",
+		children: [S, /* @__PURE__ */ l("div", {
+			className: "text-sm font-medium dark:text-contrast-9",
+			children: [
+				n.symbol,
+				" ",
+				h,
+				C,
+				i.symbol,
+				" ",
+				_
+			]
+		})]
+	}), t[17] = i.symbol, t[18] = _, t[19] = h, t[20] = n.symbol, t[21] = w) : w = t[21];
+	let T = w, E;
+	return t[22] !== x || t[23] !== T ? (E = /* @__PURE__ */ l("div", {
+		className: "flex items-center",
+		children: [x, T]
+	}), t[22] = x, t[23] = T, t[24] = E) : E = t[24], E;
+}, _ = (t) => {
+	let n = s(16), { extra: r, classes: o } = t, { srcToken: d, destToken: f, srcAmountUnit: p, destAmountUnit: m } = r;
+	if (!d || !f || !p || !m) return u;
+	let h, g;
+	if (n[0] !== m || n[1] !== p) {
+		g = Symbol.for("react.early_return_sentinel");
+		bb0: {
+			let e = i(p, m)?.rateFormatted;
+			if (!e) {
+				g = u;
+				break bb0;
+			}
+			h = a(e);
+		}
+		n[0] = m, n[1] = p, n[2] = h, n[3] = g;
+	} else h = n[2], g = n[3];
+	if (g !== Symbol.for("react.early_return_sentinel")) return g;
+	let _ = `${h} ${f.symbol}`, v = `per ${d.symbol}`, y = o?.root, b;
+	n[4] === y ? b = n[5] : (b = e("text-xs", y), n[4] = y, n[5] = b);
+	let x = o?.left, S;
+	n[6] !== _ || n[7] !== x ? (S = /* @__PURE__ */ c("span", {
+		className: x,
+		children: _
+	}), n[6] = _, n[7] = x, n[8] = S) : S = n[8];
+	let C = o?.right, w;
+	n[9] !== v || n[10] !== C ? (w = /* @__PURE__ */ c("span", {
+		className: C,
+		children: v
+	}), n[9] = v, n[10] = C, n[11] = w) : w = n[11];
+	let T;
+	return n[12] !== b || n[13] !== S || n[14] !== w ? (T = /* @__PURE__ */ l("div", {
+		className: b,
+		children: [
+			S,
+			" ",
+			w
+		]
+	}), n[12] = b, n[13] = S, n[14] = w, n[15] = T) : T = n[15], T;
+}, v = (n) => {
+	let r = s(9), { status: i } = n, a = i === "success", o = i === "reverted" || i === "cancelled", l = i === "pending", u;
+	r[0] !== a || r[1] !== o || r[2] !== l ? (u = e("text-[10px] p-0.5 px-2 rounded-lg w-max uppercase", {
+		"text-secondary-shamrock-green-2 bg-[#00976733]": a,
+		"text-secondary-radical-red-1 bg-[#FF3B301A]": o,
+		"text-secondary-orange-peel-1 bg-[#FF950033]": l
+	}), r[0] = a, r[1] = o, r[2] = l, r[3] = u) : u = r[3];
+	let d;
+	r[4] === i ? d = r[5] : (d = t(i), r[4] = i, r[5] = d);
+	let f;
+	return r[6] !== u || r[7] !== d ? (f = /* @__PURE__ */ c("div", {
+		className: u,
+		children: d
+	}), r[6] = u, r[7] = d, r[8] = f) : f = r[8], f;
+}, y = {
+	left: "dark:text-contrast-7",
+	right: "text-contrast-5"
+}, b = (e) => {
+	let t = s(9), n;
+	t[0] === e ? n = t[1] : (n = o(e), t[0] = e, t[1] = n);
+	let r = n, i;
+	t[2] === e.extra ? i = t[3] : (i = /* @__PURE__ */ c(_, {
+		extra: e.extra,
+		classes: y
+	}), t[2] = e.extra, t[3] = i);
+	let a;
+	t[4] === r ? a = t[5] : (a = /* @__PURE__ */ c(v, { status: r }), t[4] = r, t[5] = a);
+	let u;
+	return t[6] !== i || t[7] !== a ? (u = /* @__PURE__ */ l("div", {
+		className: "flex items-center justify-between",
+		children: [i, a]
+	}), t[6] = i, t[7] = a, t[8] = u) : u = t[8], u;
 };
+//#endregion
+export { _ as Rate, v as StatusBadge, d as TransactionListItemComp };
 
-export { Rate, StatusBadge, TradeAndNetwork, TransactionListItemComp };
-//# sourceMappingURL=TransactionListItem.js.map
+//# sourceMappingURL=TransactionListItem.js.map