@tokenflight/swap 0.0.3-rc.1 → 0.0.3

package/dist/tokenflight-swap.js

@@ -5172,6 +5172,15 @@ function computeExchangeRate(amountIn, decimalsIn, amountOut, decimalsOut) {
   const fracPart = rateStr.slice(rateStr.length - PRECISION).replace(/0+$/, "");
   return fracPart ? `${intPart}.${fracPart}` : intPart;
 }
+function addThousandsSeparator(value2) {
+  const parts = value2.split(".");
+  const intPart = parts[0] ?? "0";
+  const isNeg = intPart.startsWith("-");
+  const abs = isNeg ? intPart.slice(1) : intPart;
+  const grouped = abs.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+  const result = isNeg ? `-${grouped}` : grouped;
+  return parts[1] !== void 0 ? `${result}.${parts[1]}` : result;
+}
 function formatDisplayAmount(amount2, maxDecimals = 6) {
   if (!amount2 || amount2 === "0") return "0";
   const parts = amount2.split(".");
@@ -5261,7 +5270,7 @@ function toNonExponentialString(value2, digits, fixedDecimals) {
   if (value2 === 0) return "0";
   const abs = Math.abs(value2);
   const raw = abs < 1 ? value2.toPrecision(digits) : value2.toLocaleString("en-US", {
-    useGrouping: false,
+    useGrouping: true,
     maximumSignificantDigits: digits
   });
   if (!/[eE]/.test(raw)) return raw;
@@ -5481,7 +5490,7 @@ function QuotePreview(props) {
     const fromDecimals = props.fromToken.decimals ?? 18;
     const toDecimals = props.toToken.decimals ?? 18;
     const rate = computeExchangeRate(props.route.quote.amountIn, fromDecimals, props.route.quote.amountOut, toDecimals);
-    return formatDisplayAmount(rate, 4);
+    return addThousandsSeparator(formatDisplayAmount(rate, 4));
   };
   const feeDisplay = createMemo(() => formatNativeFeeDisplay(props.route.quote.estimatedGas, props.fromToken.chainId));
   const content = [(() => {
@@ -6303,7 +6312,8 @@ function OrderProgress(props) {
 }
 const page = "tf-e98a9a";
 const hero = "tf-1f9019";
-const heroIcon = "tf-73631f";
+const heroInner = "tf-fd4d56";
+const heroCheck = "tf-d3c8df";
 const title$2 = "tf-9e3a66";
 const subtitle = "tf-db06d4";
 const receivedCard = "tf-c9a5e1";
@@ -6324,7 +6334,8 @@ const primaryBtn = "tf-d7e813";
 const styles$2 = {
   page,
   hero,
-  heroIcon,
+  heroInner,
+  heroCheck,
   title: title$2,
   subtitle,
   receivedCard,
@@ -6345,7 +6356,7 @@ const styles$2 = {
   journeyLink,
   primaryBtn
 };
-var _tmpl$$6 = /* @__PURE__ */ template(`<div><div>`), _tmpl$2$5 = /* @__PURE__ */ template(`<div><span></span><span>`), _tmpl$3$4 = /* @__PURE__ */ template(`<div><span></span><a target=_blank rel="noopener noreferrer"> `), _tmpl$4$4 = /* @__PURE__ */ template(`<div>`), _tmpl$5$4 = /* @__PURE__ */ template(`<div><button><span> <span style=font-family:var(--tf-font-family-mono);font-weight:600;color:var(--tf-text)> </span> </span><span>`), _tmpl$6$4 = /* @__PURE__ */ template(`<div part=success data-testid=success-page><div><div></div></div><div data-testid=success-title></div><div></div><div><div><span></span><span></span></div></div><button data-testid=success-primary-btn>`);
+var _tmpl$$6 = /* @__PURE__ */ template(`<div><div>`), _tmpl$2$5 = /* @__PURE__ */ template(`<div><span></span><span>`), _tmpl$3$4 = /* @__PURE__ */ template(`<div><span></span><a target=_blank rel="noopener noreferrer"> `), _tmpl$4$4 = /* @__PURE__ */ template(`<div>`), _tmpl$5$4 = /* @__PURE__ */ template(`<div><button><span> <span style=font-family:var(--tf-font-family-mono);font-weight:600;color:var(--tf-text)> </span> </span><span>`), _tmpl$6$4 = /* @__PURE__ */ template(`<div part=success data-testid=success-page><div><div><div><svg width=28 height=28 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2.5 stroke-linecap=round stroke-linejoin=round><polyline points="4,12 10,18 20,6"></polyline></svg></div></div></div><div data-testid=success-title></div><div></div><div><div><span></span><span></span></div></div><button data-testid=success-primary-btn>`);
 function TransactionComplete(props) {
   const [detailsOpen, setDetailsOpen] = createSignal(false);
   const receivedAmount2 = () => {
@@ -6382,24 +6393,21 @@ function TransactionComplete(props) {
   const fromChainName = () => getChainName(props.order.fromChainId, props.chainMap);
   const buttonLabel = () => props.mode === "receive" ? t("success.newPurchase") : t("success.newSwap");
   return (() => {
-    var _el$ = _tmpl$6$4(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$2.nextSibling, _el$5 = _el$4.nextSibling, _el$6 = _el$5.nextSibling, _el$9 = _el$6.firstChild, _el$0 = _el$9.firstChild, _el$1 = _el$0.nextSibling, _el$36 = _el$6.nextSibling;
-    insert(_el$3, createComponent(AirplaneLogo, {
-      size: 28
-    }));
-    insert(_el$4, () => t("success.tokensLanded"));
-    insert(_el$5, (() => {
+    var _el$ = _tmpl$6$4(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$2.nextSibling, _el$6 = _el$5.nextSibling, _el$7 = _el$6.nextSibling, _el$0 = _el$7.firstChild, _el$1 = _el$0.firstChild, _el$10 = _el$1.nextSibling, _el$37 = _el$7.nextSibling;
+    insert(_el$5, () => t("success.tokensLanded"));
+    insert(_el$6, (() => {
       var _c$ = memo(() => elapsedSeconds() !== null);
       return () => _c$() ? t("success.deliveredIn", {
         seconds: String(elapsedSeconds())
       }) : t("success.delivered");
     })());
-    insert(_el$6, createComponent(Show, {
+    insert(_el$7, createComponent(Show, {
       get when() {
         return props.toToken;
       },
       get children() {
-        var _el$7 = _tmpl$$6(), _el$8 = _el$7.firstChild;
-        insert(_el$7, createComponent(TokenIcon, {
+        var _el$8 = _tmpl$$6(), _el$9 = _el$8.firstChild;
+        insert(_el$8, createComponent(TokenIcon, {
           get symbol() {
             return props.toToken.symbol ?? "?";
           },
@@ -6408,8 +6416,8 @@ function TransactionComplete(props) {
           get logoURI() {
             return props.toToken.logoURI;
           }
-        }), _el$8);
-        insert(_el$8, createComponent(ChainDot, {
+        }), _el$9);
+        insert(_el$9, createComponent(ChainDot, {
           color: null,
           size: 14,
           get iconUrl() {
@@ -6418,24 +6426,24 @@ function TransactionComplete(props) {
         }));
         createRenderEffect((_p$) => {
           var _v$ = styles$2.receivedIconWrap, _v$2 = styles$2.receivedChainBadge;
-          _v$ !== _p$.e && className(_el$7, _p$.e = _v$);
-          _v$2 !== _p$.t && className(_el$8, _p$.t = _v$2);
+          _v$ !== _p$.e && className(_el$8, _p$.e = _v$);
+          _v$2 !== _p$.t && className(_el$9, _p$.t = _v$2);
           return _p$;
         }, {
           e: void 0,
           t: void 0
         });
-        return _el$7;
+        return _el$8;
       }
-    }), _el$9);
-    insert(_el$9, createComponent(SignificantNumber, {
+    }), _el$0);
+    insert(_el$0, createComponent(SignificantNumber, {
       get value() {
         return receivedAmount2();
       },
       digits: 8
-    }), _el$0);
-    insert(_el$0, () => props.toToken?.symbol ?? "");
-    insert(_el$1, () => t("success.onChain", {
+    }), _el$1);
+    insert(_el$1, () => props.toToken?.symbol ?? "");
+    insert(_el$10, () => t("success.onChain", {
       chain: toChainName()
     }));
     insert(_el$, createComponent(Show, {
@@ -6443,91 +6451,91 @@ function TransactionComplete(props) {
         return props.fromToken;
       },
       get children() {
-        var _el$10 = _tmpl$5$4(), _el$11 = _el$10.firstChild, _el$12 = _el$11.firstChild, _el$13 = _el$12.firstChild, _el$14 = _el$13.nextSibling, _el$15 = _el$14.firstChild;
-        _el$14.nextSibling;
-        var _el$17 = _el$12.nextSibling;
-        addEventListener(_el$11, "click", () => setDetailsOpen(!detailsOpen()));
-        insert(_el$12, () => t("success.from"), _el$13);
-        insert(_el$14, createComponent(SignificantNumber, {
+        var _el$11 = _tmpl$5$4(), _el$12 = _el$11.firstChild, _el$13 = _el$12.firstChild, _el$14 = _el$13.firstChild, _el$15 = _el$14.nextSibling, _el$16 = _el$15.firstChild;
+        _el$15.nextSibling;
+        var _el$18 = _el$13.nextSibling;
+        addEventListener(_el$12, "click", () => setDetailsOpen(!detailsOpen()));
+        insert(_el$13, () => t("success.from"), _el$14);
+        insert(_el$15, createComponent(SignificantNumber, {
           get value() {
             return sentAmount();
           },
           digits: 6
-        }), _el$15);
-        insert(_el$14, () => props.fromToken.symbol ?? "", null);
-        insert(_el$12, () => t("success.onChain", {
+        }), _el$16);
+        insert(_el$15, () => props.fromToken.symbol ?? "", null);
+        insert(_el$13, () => t("success.onChain", {
           chain: fromChainName()
         }), null);
-        insert(_el$17, createComponent(chevron_down_default, {
+        insert(_el$18, createComponent(chevron_down_default, {
           size: 14
         }));
-        insert(_el$10, createComponent(Show, {
+        insert(_el$11, createComponent(Show, {
           get when() {
             return detailsOpen();
           },
           get children() {
-            var _el$18 = _tmpl$4$4();
-            insert(_el$18, createComponent(Show, {
+            var _el$19 = _tmpl$4$4();
+            insert(_el$19, createComponent(Show, {
               get when() {
                 return props.order.author;
               },
               get children() {
-                var _el$19 = _tmpl$2$5(), _el$20 = _el$19.firstChild, _el$21 = _el$20.nextSibling;
-                insert(_el$20, () => t("success.sender"));
-                insert(_el$21, () => truncateAddress(props.order.author));
+                var _el$20 = _tmpl$2$5(), _el$21 = _el$20.firstChild, _el$22 = _el$21.nextSibling;
+                insert(_el$21, () => t("success.sender"));
+                insert(_el$22, () => truncateAddress(props.order.author));
                 createRenderEffect((_p$) => {
                   var _v$3 = styles$2.journeyRow, _v$4 = styles$2.journeyLabel, _v$5 = styles$2.journeyValue;
-                  _v$3 !== _p$.e && className(_el$19, _p$.e = _v$3);
-                  _v$4 !== _p$.t && className(_el$20, _p$.t = _v$4);
-                  _v$5 !== _p$.a && className(_el$21, _p$.a = _v$5);
+                  _v$3 !== _p$.e && className(_el$20, _p$.e = _v$3);
+                  _v$4 !== _p$.t && className(_el$21, _p$.t = _v$4);
+                  _v$5 !== _p$.a && className(_el$22, _p$.a = _v$5);
                   return _p$;
                 }, {
                   e: void 0,
                   t: void 0,
                   a: void 0
                 });
-                return _el$19;
+                return _el$20;
               }
             }), null);
-            insert(_el$18, createComponent(Show, {
+            insert(_el$19, createComponent(Show, {
               get when() {
                 return props.order.recipient;
               },
               get children() {
-                var _el$22 = _tmpl$2$5(), _el$23 = _el$22.firstChild, _el$24 = _el$23.nextSibling;
-                insert(_el$23, () => t("success.recipient"));
-                insert(_el$24, () => truncateAddress(props.order.recipient));
+                var _el$23 = _tmpl$2$5(), _el$24 = _el$23.firstChild, _el$25 = _el$24.nextSibling;
+                insert(_el$24, () => t("success.recipient"));
+                insert(_el$25, () => truncateAddress(props.order.recipient));
                 createRenderEffect((_p$) => {
                   var _v$6 = styles$2.journeyRow, _v$7 = styles$2.journeyLabel, _v$8 = styles$2.journeyValue;
-                  _v$6 !== _p$.e && className(_el$22, _p$.e = _v$6);
-                  _v$7 !== _p$.t && className(_el$23, _p$.t = _v$7);
-                  _v$8 !== _p$.a && className(_el$24, _p$.a = _v$8);
+                  _v$6 !== _p$.e && className(_el$23, _p$.e = _v$6);
+                  _v$7 !== _p$.t && className(_el$24, _p$.t = _v$7);
+                  _v$8 !== _p$.a && className(_el$25, _p$.a = _v$8);
                   return _p$;
                 }, {
                   e: void 0,
                   t: void 0,
                   a: void 0
                 });
-                return _el$22;
+                return _el$23;
               }
             }), null);
-            insert(_el$18, createComponent(Show, {
+            insert(_el$19, createComponent(Show, {
               get when() {
                 return depositExplorerUrl();
               },
               get children() {
-                var _el$25 = _tmpl$3$4(), _el$26 = _el$25.firstChild, _el$27 = _el$26.nextSibling, _el$28 = _el$27.firstChild;
-                insert(_el$26, () => t("success.depositTx"));
-                insert(_el$27, () => t("success.viewExplorer"), _el$28);
-                insert(_el$27, createComponent(external_link_default, {
+                var _el$26 = _tmpl$3$4(), _el$27 = _el$26.firstChild, _el$28 = _el$27.nextSibling, _el$29 = _el$28.firstChild;
+                insert(_el$27, () => t("success.depositTx"));
+                insert(_el$28, () => t("success.viewExplorer"), _el$29);
+                insert(_el$28, createComponent(external_link_default, {
                   size: 10
                 }), null);
                 createRenderEffect((_p$) => {
                   var _v$9 = styles$2.journeyRow, _v$0 = styles$2.journeyLabel, _v$1 = depositExplorerUrl(), _v$10 = styles$2.journeyLink;
-                  _v$9 !== _p$.e && className(_el$25, _p$.e = _v$9);
-                  _v$0 !== _p$.t && className(_el$26, _p$.t = _v$0);
-                  _v$1 !== _p$.a && setAttribute(_el$27, "href", _p$.a = _v$1);
-                  _v$10 !== _p$.o && className(_el$27, _p$.o = _v$10);
+                  _v$9 !== _p$.e && className(_el$26, _p$.e = _v$9);
+                  _v$0 !== _p$.t && className(_el$27, _p$.t = _v$0);
+                  _v$1 !== _p$.a && setAttribute(_el$28, "href", _p$.a = _v$1);
+                  _v$10 !== _p$.o && className(_el$28, _p$.o = _v$10);
                   return _p$;
                 }, {
                   e: void 0,
@@ -6535,26 +6543,26 @@ function TransactionComplete(props) {
                   a: void 0,
                   o: void 0
                 });
-                return _el$25;
+                return _el$26;
               }
             }), null);
-            insert(_el$18, createComponent(Show, {
+            insert(_el$19, createComponent(Show, {
               get when() {
                 return fillExplorerUrl();
               },
               get children() {
-                var _el$29 = _tmpl$3$4(), _el$30 = _el$29.firstChild, _el$31 = _el$30.nextSibling, _el$32 = _el$31.firstChild;
-                insert(_el$30, () => t("success.fillTx"));
-                insert(_el$31, () => t("success.viewExplorer"), _el$32);
-                insert(_el$31, createComponent(external_link_default, {
+                var _el$30 = _tmpl$3$4(), _el$31 = _el$30.firstChild, _el$32 = _el$31.nextSibling, _el$33 = _el$32.firstChild;
+                insert(_el$31, () => t("success.fillTx"));
+                insert(_el$32, () => t("success.viewExplorer"), _el$33);
+                insert(_el$32, createComponent(external_link_default, {
                   size: 10
                 }), null);
                 createRenderEffect((_p$) => {
                   var _v$11 = styles$2.journeyRow, _v$12 = styles$2.journeyLabel, _v$13 = fillExplorerUrl(), _v$14 = styles$2.journeyLink;
-                  _v$11 !== _p$.e && className(_el$29, _p$.e = _v$11);
-                  _v$12 !== _p$.t && className(_el$30, _p$.t = _v$12);
-                  _v$13 !== _p$.a && setAttribute(_el$31, "href", _p$.a = _v$13);
-                  _v$14 !== _p$.o && className(_el$31, _p$.o = _v$14);
+                  _v$11 !== _p$.e && className(_el$30, _p$.e = _v$11);
+                  _v$12 !== _p$.t && className(_el$31, _p$.t = _v$12);
+                  _v$13 !== _p$.a && setAttribute(_el$32, "href", _p$.a = _v$13);
+                  _v$14 !== _p$.o && className(_el$32, _p$.o = _v$14);
                   return _p$;
                 }, {
                   e: void 0,
@@ -6562,63 +6570,64 @@ function TransactionComplete(props) {
                   a: void 0,
                   o: void 0
                 });
-                return _el$29;
+                return _el$30;
               }
             }), null);
-            insert(_el$18, createComponent(Show, {
+            insert(_el$19, createComponent(Show, {
               get when() {
                 return props.providerName;
               },
               get children() {
-                var _el$33 = _tmpl$2$5(), _el$34 = _el$33.firstChild, _el$35 = _el$34.nextSibling;
-                insert(_el$34, () => t("success.provider"));
-                insert(_el$35, () => props.providerName);
+                var _el$34 = _tmpl$2$5(), _el$35 = _el$34.firstChild, _el$36 = _el$35.nextSibling;
+                insert(_el$35, () => t("success.provider"));
+                insert(_el$36, () => props.providerName);
                 createRenderEffect((_p$) => {
                   var _v$15 = styles$2.journeyRow, _v$16 = styles$2.journeyLabel, _v$17 = styles$2.journeyValue;
-                  _v$15 !== _p$.e && className(_el$33, _p$.e = _v$15);
-                  _v$16 !== _p$.t && className(_el$34, _p$.t = _v$16);
-                  _v$17 !== _p$.a && className(_el$35, _p$.a = _v$17);
+                  _v$15 !== _p$.e && className(_el$34, _p$.e = _v$15);
+                  _v$16 !== _p$.t && className(_el$35, _p$.t = _v$16);
+                  _v$17 !== _p$.a && className(_el$36, _p$.a = _v$17);
                   return _p$;
                 }, {
                   e: void 0,
                   t: void 0,
                   a: void 0
                 });
-                return _el$33;
+                return _el$34;
               }
             }), null);
-            createRenderEffect(() => className(_el$18, styles$2.journeyBody));
-            return _el$18;
+            createRenderEffect(() => className(_el$19, styles$2.journeyBody));
+            return _el$19;
           }
         }), null);
         createRenderEffect((_p$) => {
           var _v$18 = styles$2.journey, _v$19 = `${styles$2.journeyToggle}${detailsOpen() ? ` ${styles$2["journeyToggle--open"]}` : ""}`, _v$20 = `${styles$2.journeyChevron}${detailsOpen() ? ` ${styles$2["journeyChevron--open"]}` : ""}`;
-          _v$18 !== _p$.e && className(_el$10, _p$.e = _v$18);
-          _v$19 !== _p$.t && className(_el$11, _p$.t = _v$19);
-          _v$20 !== _p$.a && className(_el$17, _p$.a = _v$20);
+          _v$18 !== _p$.e && className(_el$11, _p$.e = _v$18);
+          _v$19 !== _p$.t && className(_el$12, _p$.t = _v$19);
+          _v$20 !== _p$.a && className(_el$18, _p$.a = _v$20);
           return _p$;
         }, {
           e: void 0,
           t: void 0,
           a: void 0
         });
-        return _el$10;
+        return _el$11;
       }
-    }), _el$36);
-    addEventListener(_el$36, "click", props.onNewSwap);
-    insert(_el$36, buttonLabel);
+    }), _el$37);
+    addEventListener(_el$37, "click", props.onNewSwap);
+    insert(_el$37, buttonLabel);
     createRenderEffect((_p$) => {
-      var _v$21 = styles$2.page, _v$22 = styles$2.hero, _v$23 = styles$2.heroIcon, _v$24 = styles$2.title, _v$25 = styles$2.subtitle, _v$26 = styles$2.receivedCard, _v$27 = styles$2.receivedAmount, _v$28 = styles$2.receivedSymbol, _v$29 = styles$2.receivedChainName, _v$30 = styles$2.primaryBtn;
+      var _v$21 = styles$2.page, _v$22 = styles$2.hero, _v$23 = styles$2.heroInner, _v$24 = styles$2.heroCheck, _v$25 = styles$2.title, _v$26 = styles$2.subtitle, _v$27 = styles$2.receivedCard, _v$28 = styles$2.receivedAmount, _v$29 = styles$2.receivedSymbol, _v$30 = styles$2.receivedChainName, _v$31 = styles$2.primaryBtn;
       _v$21 !== _p$.e && className(_el$, _p$.e = _v$21);
       _v$22 !== _p$.t && className(_el$2, _p$.t = _v$22);
       _v$23 !== _p$.a && className(_el$3, _p$.a = _v$23);
       _v$24 !== _p$.o && className(_el$4, _p$.o = _v$24);
       _v$25 !== _p$.i && className(_el$5, _p$.i = _v$25);
       _v$26 !== _p$.n && className(_el$6, _p$.n = _v$26);
-      _v$27 !== _p$.s && className(_el$9, _p$.s = _v$27);
+      _v$27 !== _p$.s && className(_el$7, _p$.s = _v$27);
       _v$28 !== _p$.h && className(_el$0, _p$.h = _v$28);
       _v$29 !== _p$.r && className(_el$1, _p$.r = _v$29);
-      _v$30 !== _p$.d && className(_el$36, _p$.d = _v$30);
+      _v$30 !== _p$.d && className(_el$10, _p$.d = _v$30);
+      _v$31 !== _p$.l && className(_el$37, _p$.l = _v$31);
       return _p$;
     }, {
       e: void 0,
@@ -6630,7 +6639,8 @@ function TransactionComplete(props) {
       s: void 0,
       h: void 0,
       r: void 0,
-      d: void 0
+      d: void 0,
+      l: void 0
     });
     return _el$;
   })();
@@ -7527,7 +7537,7 @@ class HyperstreamApi {
       timeout: DEFAULT_TIMEOUT,
       retry: 0,
       headers: {
-        "X-TF-SDK-Version": "0.0.3-rc.1"
+        "X-TF-SDK-Version": "0.0.3"
       }
     });
   }
@@ -7928,7 +7938,7 @@ const TOKEN_LIST_SKELETON_ROWS = [0, 1, 2, 3, 4];
 function formatUsdValue(value2) {
   if (!Number.isFinite(value2) || value2 <= 0) return "$0";
   if (value2 < 0.01) return "<$0.01";
-  return `$${value2.toFixed(2).replace(/\.?0+$/, "")}`;
+  return `$${addThousandsSeparator(value2.toFixed(2).replace(/\.?0+$/, ""))}`;
 }
 function apiTokenToItem(token, chainLookup) {
   const normalizedChainId = Number(token.chainId);
@@ -7937,7 +7947,7 @@ function apiTokenToItem(token, chainLookup) {
   const decimals = typeof token.decimals === "number" && token.decimals >= 0 ? token.decimals : 18;
   const balanceRaw = token.extensions?.balance;
   const hasBalance = balanceRaw !== void 0 && balanceRaw !== "0";
-  const balance2 = balanceRaw !== void 0 ? hasBalance ? formatDisplayAmount(toDisplayAmount(balanceRaw, decimals), 2) : "0" : null;
+  const balance2 = balanceRaw !== void 0 ? hasBalance ? addThousandsSeparator(formatDisplayAmount(toDisplayAmount(balanceRaw, decimals), 2)) : "0" : null;
   const unitPrice = Number(token.extensions?.price?.usd ?? "");
   const amount2 = hasBalance ? Number(toDisplayAmount(balanceRaw, decimals)) : 0;
   const usdValue = Number.isFinite(unitPrice) && Number.isFinite(amount2) ? amount2 * unitPrice : 0;
@@ -9142,7 +9152,7 @@ function SwapComponent(props) {
     if (!from || typeof from.decimals !== "number" || !balancesQuery.data) return null;
     const match = balancesQuery.data.find((tk) => tk.address.toLowerCase() === from.address.toLowerCase() && tk.chainId === from.chainId);
     if (match?.extensions?.balance) {
-      return formatDisplayAmount(toDisplayAmount(match.extensions.balance, match.decimals), 2);
+      return addThousandsSeparator(formatDisplayAmount(toDisplayAmount(match.extensions.balance, match.decimals), 2));
     }
     return "0";
   });
@@ -9186,7 +9196,7 @@ function SwapComponent(props) {
   const formatUsd = (value2) => {
     if (!Number.isFinite(value2) || value2 <= 0) return "0";
     if (value2 < 0.01) return "<0.01";
-    return value2.toFixed(2).replace(/\.?0+$/, "");
+    return addThousandsSeparator(value2.toFixed(2).replace(/\.?0+$/, ""));
   };
   const {
     needRecipient,
@@ -11180,11 +11190,11 @@ function ReceiveComponent(props) {
       const payDecimals = tk.decimals;
       const payPrice = Number(tk.extensions?.price?.usd ?? "0");
       const balanceRawDisplay = tk.extensions?.balance ? toDisplayAmount(tk.extensions.balance, payDecimals) : "0";
-      const balance2 = formatDisplayAmount(balanceRawDisplay, 2);
+      const balance2 = addThousandsSeparator(formatDisplayAmount(balanceRawDisplay, 2));
       let balanceUsd = "";
       if (payPrice > 0 && tk.extensions?.balance) {
         const balUsd = Number(balanceRawDisplay) * payPrice;
-        balanceUsd = balUsd < 0.01 ? "<$0.01" : `$${balUsd.toFixed(2).replace(/\.?0+$/, "")}`;
+        balanceUsd = balUsd < 0.01 ? "<$0.01" : `$${addThousandsSeparator(balUsd.toFixed(2).replace(/\.?0+$/, ""))}`;
       }
       let amountIn = "";
       let amountUsd = "";
@@ -11192,10 +11202,10 @@ function ReceiveComponent(props) {
       let isBest = false;
       if (quote2) {
         const rawAmount = toDisplayAmount(quote2.route.quote.amountIn, payDecimals);
-        amountIn = formatDisplayAmount(rawAmount, 2);
+        amountIn = addThousandsSeparator(formatDisplayAmount(rawAmount, 2));
         if (payPrice > 0) {
           const usdVal = Number(rawAmount) * payPrice;
-          amountUsd = usdVal < 0.01 ? "<$0.01" : `$${usdVal.toFixed(2).replace(/\.?0+$/, "")}`;
+          amountUsd = usdVal < 0.01 ? "<$0.01" : `$${addThousandsSeparator(usdVal.toFixed(2).replace(/\.?0+$/, ""))}`;
         }
         const balanceRaw = BigInt(tk.extensions?.balance ?? "0");
         const amountInRaw = BigInt(quote2.route.quote.amountIn || "0");
@@ -11556,10 +11566,10 @@ function ReceiveComponent(props) {
                   return _el$17;
                 }
               }), null);
-              insert(_el$18, targetAmount);
+              insert(_el$18, () => addThousandsSeparator(targetAmount()));
               insert(_el$19, targetSymbol);
               insert(_el$20, () => t("swap.fiatValue", {
-                value: targetAmount()
+                value: addThousandsSeparator(targetAmount())
               }));
               createRenderEffect((_p$) => {
                 var _v$15 = styles.section, _v$16 = styles.sectionLabel, _v$17 = styles.target, _v$18 = styles.targetIcon, _v$19 = styles.amount, _v$20 = styles.symbol, _v$21 = styles.fiat;
@@ -11870,7 +11880,7 @@ const css6 = ".tf-636daf{width:100%;height:100%;background:var(--tf-bg);display:
 const css7 = ".tf-ba406b{display:inline-flex;align-items:baseline}.tf-9d81a4{font-size:.7em;line-height:1;opacity:.85}.tf-7977ef{cursor:help}";
 const css8 = "@keyframes tf-07c947{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.tf-dc5721{padding:18px 20px 0;display:flex;justify-content:space-between;align-items:center}.tf-68123c{display:flex;align-items:center;gap:7px}.tf-43dda9{visibility:hidden}.tf-532d07{width:22px;height:22px;object-fit:contain;flex-shrink:0}.tf-b7936a{font-size:var(--tf-font-xl);font-weight:600;letter-spacing:-.01em}.tf-883305{color:var(--tf-primary)}.tf-6da3db{display:flex;gap:6px;align-items:center;cursor:pointer;background:none;border:none;padding:4px 8px;border-radius:8px;font-family:inherit;transition:background .15s ease}.tf-6da3db:hover{background:var(--tf-surface-hover)}.tf-6da3db:focus-visible{outline:2px solid var(--tf-primary);outline-offset:2px}.tf-d25568{width:8px;height:8px;border-radius:50%;background:var(--tf-primary);box-shadow:0 0 8px var(--tf-primary-glow)}.tf-16ce7d{background:var(--tf-success);box-shadow:0 0 8px var(--tf-success)}.tf-11bb1d{font-size:var(--tf-font-base);color:var(--tf-text-secondary);font-family:var(--tf-font-family-mono)}.tf-98d625{padding:14px 20px 0;animation:tf-07c947 .3s ease both}.tf-8b7743{padding:0 20px;animation:tf-07c947 .35s ease both}.tf-677ece{background:var(--tf-input-bg);border-radius:14px;padding:14px 16px;border:1px solid var(--tf-border-light);transition:border-color .2s,background .25s ease,box-shadow .2s ease}.tf-635915{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.tf-b8a04a{display:inline-flex;align-items:center;gap:8px}.tf-0d1ef8{font-size:var(--tf-font-base);color:var(--tf-text-tertiary);font-weight:500;text-align:left}.tf-d04a4e{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-family:var(--tf-font-family-mono)}.tf-d7140f{display:flex;justify-content:space-between;align-items:center}.tf-dcd620{display:flex;align-items:center;gap:8px;background:var(--tf-surface);border-radius:10px;padding:6px 12px 6px 8px;height:36px;box-sizing:border-box;border:1px solid var(--tf-border);cursor:pointer;flex-shrink:0;font-family:var(--tf-font-family);transition:background .15s ease,border-color .15s ease,transform .1s ease}.tf-dcd620:hover{background:var(--tf-surface-hover);transform:scale(1.02)}.tf-e25a5c{padding:0 12px}.tf-038cf1{font-size:var(--tf-font-lg);font-weight:600;color:var(--tf-text)}.tf-33c9cb{font-size:var(--tf-font-md);font-weight:600;color:var(--tf-primary)}.tf-b1e4a6{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary)}.tf-d168ae{display:flex;justify-content:space-between;align-items:center;margin-top:6px;min-height:16px;font-size:var(--tf-font-base);line-height:100%}.tf-b2b098{margin-top:6px;min-height:16px;display:flex;align-items:center}.tf-92acfd{display:inline-block;min-height:16px;font-size:var(--tf-font-base);line-height:100%;color:var(--tf-text-tertiary)}.tf-bd2f5c{visibility:hidden}.tf-5f8805{font-size:var(--tf-font-sm);font-weight:600;color:var(--tf-primary);background:var(--tf-primary-light);border:none;padding:2px 8px;border-radius:6px;cursor:pointer;font-family:var(--tf-font-family)}.tf-5f8805:hover{opacity:.8}.tf-af41ab{display:flex;justify-content:center;margin:-6px 0;position:relative;z-index:2}.tf-18c3f4{width:36px;height:36px;padding:0;appearance:none;-webkit-appearance:none;border-radius:10px;background:var(--tf-surface);border:3px solid var(--tf-bg);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px #0000000f;font-size:var(--tf-font-lg);color:var(--tf-text-secondary);transition:transform .2s ease,background .15s ease,color .15s ease}.tf-18c3f4:hover{transform:scale(1.1);color:var(--tf-primary)}.tf-18c3f4:active{transform:scale(.95) rotate(180deg)}.tf-a04b23{position:relative;flex-shrink:0}.tf-57762e{position:absolute;bottom:-2px;right:-2px}";
 const css9 = ".tf-140273{width:100%;max-width:400px;border-radius:20px;overflow:hidden;background:var(--tf-bg);border:1px solid var(--tf-border);box-shadow:var(--tf-shadow-lg);font-family:var(--tf-font-family);color:var(--tf-text);height:100%;display:flex;flex-direction:column}.tf-45030f{padding:18px 20px 14px;flex-shrink:0}.tf-ce0622{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.tf-0c1692{font-size:var(--tf-font-xl);font-weight:600}.tf-64aa3f{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--tf-text-tertiary);font-size:var(--tf-font-2xl);font-weight:300;background:var(--tf-input-bg);border:none;font-family:var(--tf-font-family)}.tf-9819ca{display:flex;align-items:center;gap:10px;background:var(--tf-input-bg);border-radius:12px;padding:10px 14px;border:1px solid var(--tf-border-light);transition:border-color .15s}.tf-9819ca.tf-d9fcd6{border-color:var(--tf-primary)}.tf-4ad0e7{color:var(--tf-text-tertiary);font-size:var(--tf-font-lg);flex-shrink:0}.tf-9ea859{flex:1;border:none;background:none;outline:none;font-size:var(--tf-font-lg);color:var(--tf-text);font-family:var(--tf-font-family)}.tf-9ea859::placeholder{color:var(--tf-text-tertiary)}.tf-25e112{display:flex;gap:4px;margin-top:12px;overflow-x:auto;padding-bottom:2px}.tf-478cb9{display:flex;align-items:center;gap:5px;padding:4px 10px;border-radius:8px;border:none;font-size:var(--tf-font-sm);font-weight:500;cursor:pointer;white-space:nowrap;font-family:var(--tf-font-family);background:var(--tf-input-bg);color:var(--tf-text-secondary)}.tf-478cb9.tf-125be5{background:var(--tf-primary-light);color:var(--tf-primary);outline:1px solid var(--tf-primary);outline-offset:-1px}.tf-bb4fb1{height:24px;border-radius:8px;flex-shrink:0}.tf-ad5703{height:1px;background:var(--tf-border);margin:0 20px;flex-shrink:0}.tf-de9986{flex:1;min-height:0;overflow-y:auto;padding:6px 8px}.tf-7ac0fe{display:flex;flex-direction:column}.tf-c6ef08{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:12px}.tf-3643cf{display:flex;align-items:center;gap:12px}.tf-9b3d59{width:36px;height:36px;border-radius:50%}.tf-a4cc17{display:flex;flex-direction:column;gap:6px}.tf-7f1baf{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.tf-9171a2{height:10px}.tf-9171a2.tf-71ea5d{width:88px}.tf-9171a2.tf-dfb33a{width:64px}.tf-9171a2.tf-43fbf4{width:56px}.tf-9171a2.tf-61ca3c{width:44px}.tf-512365{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:12px;cursor:pointer;background:transparent;transition:background .1s;border:none;width:100%;font-family:var(--tf-font-family)}.tf-512365:hover{background:var(--tf-surface-hover)}.tf-512365.tf-9f601f{background:var(--tf-primary-light)}.tf-a0b0d9{display:flex;align-items:center;gap:12px}.tf-1e7a62{position:relative}.tf-67f18a{position:absolute;bottom:-1px;right:-1px;width:13px;height:13px;border-radius:50%;background:var(--tf-surface);border:1px solid var(--tf-border);display:flex;align-items:center;justify-content:center}.tf-cd76b9{text-align:left;display:flex;flex-direction:column;align-items:flex-start}.tf-8f4efd{font-size:var(--tf-font-lg);font-weight:600;color:var(--tf-text)}.tf-51bf2b{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary)}.tf-87740a{text-align:right}.tf-43fbf4{color:var(--tf-text);font-size:var(--tf-font-md);font-weight:500;font-family:var(--tf-font-family-mono)}.tf-43fbf4.tf-2ee375{color:var(--tf-text-tertiary)}.tf-61ca3c{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-family:var(--tf-font-family-mono)}";
-const css10 = "@keyframes tf-72a7b4{0%{transform:scale(.3);opacity:0}50%{transform:scale(1.05)}70%{transform:scale(.95)}to{transform:scale(1);opacity:1}}@keyframes tf-7ca8ca{0%{transform:translateY(0) rotate(0)}to{transform:translateY(-4px) rotate(8deg)}}@keyframes tf-2b6de5{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes tf-5b8ef8{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.tf-e98a9a{width:100%;min-width:0;padding:28px 20px 24px;display:flex;flex-direction:column;align-items:center;animation:tf-2b6de5 .35s ease both;box-sizing:border-box}.tf-1f9019{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--tf-success),#00E6A0);display:flex;align-items:center;justify-content:center;margin-bottom:16px;animation:tf-72a7b4 .6s ease both;box-shadow:0 8px 32px #00c48c40;color:var(--tf-text-on-primary)}.tf-73631f{animation:tf-7ca8ca 2s ease-in-out infinite alternate;display:flex}.tf-9e3a66{font-size:var(--tf-font-heading);font-weight:700;color:var(--tf-text);margin-bottom:4px;letter-spacing:-.01em}.tf-db06d4{font-size:var(--tf-font-md);color:var(--tf-text-secondary);margin-bottom:20px}.tf-c9a5e1{width:100%;padding:20px;border-radius:16px;background:linear-gradient(135deg,#00c48c14,#00e6a00a);border:1px solid rgba(0,196,140,.15);display:flex;flex-direction:column;align-items:center;gap:6px;margin-bottom:16px;animation:tf-2b6de5 .4s ease .2s both}.tf-7b3b5b{position:relative;width:40px;height:40px;margin-bottom:4px}.tf-651299{position:absolute;bottom:-2px;right:-2px;width:16px;height:16px;border-radius:50%;background:var(--tf-bg);display:flex;align-items:center;justify-content:center;border:1.5px solid rgba(0,196,140,.15)}.tf-f52291{font-size:var(--tf-font-amount-lg);font-weight:700;color:var(--tf-text);font-family:var(--tf-font-family-mono);letter-spacing:-.02em;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;justify-content:center}.tf-8cfc86{font-size:var(--tf-font-lg);font-weight:500;color:var(--tf-text-secondary)}.tf-5f768d{font-size:var(--tf-font-sm);font-weight:500;font-family:var(--tf-font-family);color:var(--tf-text-tertiary);letter-spacing:0}.tf-75f592{width:100%;margin-bottom:16px}.tf-73910d{width:100%;display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:var(--tf-input-bg);border:1px solid var(--tf-border-light);border-radius:10px;cursor:pointer;font-size:var(--tf-font-base);font-weight:500;color:var(--tf-text-secondary);font-family:var(--tf-font-family);transition:background .15s}.tf-73910d:hover{background:var(--tf-bg-secondary)}.tf-ae94a0{border-radius:10px 10px 0 0}.tf-1afb0a{transition:transform .2s ease;color:var(--tf-text-tertiary)}.tf-7737cf{transform:rotate(180deg)}.tf-92a530{padding:8px 14px 12px;border:1px solid var(--tf-border-light);border-top:none;border-radius:0 0 10px 10px;background:var(--tf-input-bg);animation:tf-5b8ef8 .15s ease both}.tf-6e8c3e{display:flex;justify-content:space-between;align-items:center;font-size:var(--tf-font-sm);padding:5px 0}.tf-4b5396{color:var(--tf-text-tertiary);font-weight:500}.tf-63cca1{color:var(--tf-text-secondary);font-family:var(--tf-font-family-mono);font-size:var(--tf-font-sm);display:flex;align-items:center;gap:4px}.tf-18c122{color:var(--tf-primary);text-decoration:none;font-size:var(--tf-font-sm);font-family:var(--tf-font-family-mono);display:inline-flex;align-items:center;gap:3px;transition:opacity .15s}.tf-18c122:hover{opacity:.7}.tf-d7e813{width:100%;padding:14px 0;border-radius:14px;border:none;background:var(--tf-primary);color:var(--tf-text-on-primary);font-weight:600;font-size:var(--tf-font-xl);cursor:pointer;font-family:var(--tf-font-family);box-shadow:0 4px 16px color-mix(in srgb,var(--tf-primary) 25%,transparent);transition:transform .15s ease,opacity .15s ease}.tf-d7e813:hover{opacity:.95;transform:translateY(-1px)}.tf-d7e813:active{transform:translateY(0)}";
+const css10 = '@keyframes tf-36c468{0%{transform:scale(.3);opacity:0}to{transform:scale(1);opacity:1}}@keyframes tf-dc4326{0%{stroke-dashoffset:24}to{stroke-dashoffset:0}}@keyframes tf-13e6cd{0%{transform:scale(1);opacity:.5}to{transform:scale(1.6);opacity:0}}@keyframes tf-2b6de5{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes tf-5b8ef8{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.tf-e98a9a{width:100%;min-width:0;padding:28px 20px 24px;display:flex;flex-direction:column;align-items:center;animation:tf-2b6de5 .35s ease both;box-sizing:border-box}.tf-1f9019{position:relative;width:64px;height:64px;border-radius:50%;background:linear-gradient(145deg,var(--tf-success),#00E6A0);padding:2px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;animation:tf-36c468 .5s cubic-bezier(.34,1.56,.64,1) both;box-shadow:0 2px 8px #00c48c4d,0 8px 32px #00c48c33}.tf-1f9019:before{content:"";position:absolute;inset:-2px;border-radius:50%;border:2px solid var(--tf-success);animation:tf-13e6cd 3s ease-out infinite;pointer-events:none}.tf-fd4d56{width:100%;height:100%;border-radius:50%;background:var(--tf-bg);display:flex;align-items:center;justify-content:center}.tf-d3c8df{display:flex;color:var(--tf-success)}.tf-d3c8df svg{stroke-dasharray:24;stroke-dashoffset:24;animation:tf-dc4326 .4s ease .35s forwards}.tf-9e3a66{font-size:var(--tf-font-heading);font-weight:700;color:var(--tf-text);margin-bottom:4px;letter-spacing:-.01em}.tf-db06d4{font-size:var(--tf-font-md);color:var(--tf-text-secondary);margin-bottom:20px}.tf-c9a5e1{position:relative;width:100%;padding:20px;border-radius:16px;background:linear-gradient(135deg,#00c48c14,#00e6a00a);border:1px solid rgba(0,196,140,.15);display:flex;flex-direction:column;align-items:center;gap:6px;margin-bottom:16px;animation:tf-2b6de5 .4s ease .2s both;overflow:hidden}.tf-c9a5e1:after{content:"";position:absolute;bottom:-20px;left:50%;transform:translate(-50%);width:60%;height:40px;background:radial-gradient(ellipse at center,rgba(0,196,140,.12),transparent 70%);pointer-events:none}.tf-7b3b5b{position:relative;width:40px;height:40px;margin-bottom:4px}.tf-651299{position:absolute;bottom:-2px;right:-2px;width:16px;height:16px;border-radius:50%;background:var(--tf-bg);display:flex;align-items:center;justify-content:center;border:1.5px solid rgba(0,196,140,.15)}.tf-f52291{font-size:var(--tf-font-amount-lg);font-weight:700;color:var(--tf-text);font-family:var(--tf-font-family-mono);letter-spacing:-.02em;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;justify-content:center}.tf-8cfc86{font-size:var(--tf-font-lg);font-weight:500;color:var(--tf-text-secondary)}.tf-5f768d{font-size:var(--tf-font-sm);font-weight:500;font-family:var(--tf-font-family);color:var(--tf-text-tertiary);letter-spacing:0}.tf-75f592{width:100%;margin-bottom:16px}.tf-73910d{width:100%;display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:var(--tf-input-bg);border:1px solid var(--tf-border-light);border-radius:10px;cursor:pointer;font-size:var(--tf-font-base);font-weight:500;color:var(--tf-text-secondary);font-family:var(--tf-font-family);transition:background .15s}.tf-73910d:hover{background:var(--tf-bg-secondary)}.tf-ae94a0{border-radius:10px 10px 0 0}.tf-1afb0a{transition:transform .2s ease;color:var(--tf-text-tertiary);display:flex;justify-content:center;align-items:center}.tf-7737cf{transform:rotate(180deg)}.tf-92a530{padding:8px 14px 12px;border:1px solid var(--tf-border-light);border-top:none;border-radius:0 0 10px 10px;background:var(--tf-input-bg);animation:tf-5b8ef8 .15s ease both}.tf-6e8c3e{display:flex;justify-content:space-between;align-items:center;font-size:var(--tf-font-sm);padding:5px 0}.tf-4b5396{color:var(--tf-text-tertiary);font-weight:500}.tf-63cca1{color:var(--tf-text-secondary);font-family:var(--tf-font-family-mono);font-size:var(--tf-font-sm);display:flex;align-items:center;gap:4px}.tf-18c122{color:var(--tf-primary);text-decoration:none;font-size:var(--tf-font-sm);font-family:var(--tf-font-family-mono);display:inline-flex;align-items:center;gap:3px;transition:opacity .15s}.tf-18c122:hover{opacity:.7}.tf-d7e813{width:100%;padding:14px 0;border-radius:14px;border:none;background:var(--tf-primary);color:var(--tf-text-on-primary);font-weight:600;font-size:var(--tf-font-xl);cursor:pointer;font-family:var(--tf-font-family);box-shadow:0 4px 16px color-mix(in srgb,var(--tf-primary) 25%,transparent);transition:transform .15s ease,opacity .15s ease}.tf-d7e813:hover{opacity:.95;transform:translateY(-1px)}.tf-d7e813:active{transform:translateY(0)}';
 const css11 = ".tf-c63ac0{border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--tf-text-on-primary);font-weight:700;font-family:var(--tf-font-family);flex-shrink:0;overflow:hidden}.tf-59aca7{width:100%;height:100%;object-fit:cover;border-radius:50%}.tf-dbfbb3{border-radius:50%;flex-shrink:0;overflow:hidden;display:flex;align-items:center;justify-content:center}.tf-f89395{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}.tf-cdfe94{display:flex;align-items:center;justify-content:center;gap:6px;padding:12px 0 14px;border-top:1px solid var(--tf-border-light);margin:8px 20px 0;text-decoration:none}.tf-7c0c36{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary)}.tf-26d5ea{font-size:var(--tf-font-base);line-height:1}.tf-8b1e15{font-size:var(--tf-font-sm);font-weight:600;letter-spacing:.02em;color:var(--tf-text-secondary)}.tf-3852e5,.tf-b35860{color:var(--tf-primary)}";
 const css12 = '@keyframes tf-80a677{to{transform:rotate(360deg)}}@keyframes tf-d97ff2{0%,to{opacity:1}50%{opacity:.4}}@keyframes tf-c3558b{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes tf-89a83e{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(6px)}}@keyframes tf-ca9155{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes tf-d2dbc4{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes tf-54b7e7{0%,to{border-color:var(--tf-primary)}50%{border-color:var(--tf-primary-light)}}@keyframes tf-194f18{to{transform:rotate(360deg)}}@keyframes tf-cdef4a{0%{transform:scale(.3);opacity:0}50%{transform:scale(1.05)}70%{transform:scale(.95)}to{transform:scale(1);opacity:1}}@keyframes tf-fd8795{0%{transform:translateY(0) rotate(0)}to{transform:translateY(-4px) rotate(8deg)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:host{display:block;color:var(--tf-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--tf-font-family: "DM Sans", sans-serif;--tf-font-family-mono: "JetBrains Mono", monospace;font-family:var(--tf-font-family);--tf-font-2xs: 10px;--tf-font-xs: 11px;--tf-font-sm: 12px;--tf-font-base: 13px;--tf-font-md: 14px;--tf-font-lg: 15px;--tf-font-xl: 16px;--tf-font-2xl: 17px;--tf-font-heading: 20px;--tf-font-amount: 28px;--tf-font-amount-lg: 24px;--tf-font-amount-sm: 22px}button:focus-visible,a:focus-visible{outline:2px solid var(--tf-primary);outline-offset:2px;border-radius:4px}';
 const css13 = ".tf-1ac2ef{border-radius:6px;background:var(--tf-skeleton);animation:tf-90e981 1.5s infinite}.tf-68a980{position:absolute;inset:0;border-radius:20px;display:flex;align-items:flex-start;z-index:10;overflow:hidden;animation:tf-552c66 .2s ease both}.tf-e7b9c7{width:100%;max-width:400px;min-width:360px;border-radius:20px;overflow:hidden;background:var(--tf-bg);border:1px solid var(--tf-border);box-shadow:var(--tf-shadow-lg);font-family:var(--tf-font-family);color:var(--tf-text);position:relative;transition:background .25s ease,border-color .25s ease,box-shadow .25s ease}.tf-b4f391{background:transparent}.tf-118b57{border:none;box-shadow:none}.tf-118b57 .tf-07225e{display:none}.tf-07225e{height:2px;background:linear-gradient(90deg,transparent,var(--tf-primary),transparent);opacity:.6}.tf-d01dff{padding:16px 20px 20px;animation:tf-ed0355 .3s ease .1s both}.tf-5bb68c{padding:12px 20px 0}.tf-04e1e2{margin:12px 20px 0;padding:14px;background:var(--tf-primary-light);border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;height:131px;box-sizing:border-box;animation:tf-b61e63 .25s ease both}.tf-d01908{color:var(--tf-text-tertiary);opacity:.4}.tf-1cc72b{font-size:var(--tf-font-base);color:var(--tf-text-secondary)}.tf-480f1a{padding:0 20px 16px;text-align:center}.tf-480f1a a{font-size:var(--tf-font-base);color:var(--tf-primary);text-decoration:none;font-family:var(--tf-font-family-mono)}.tf-bc7950{text-align:center;margin-top:8px;margin-bottom:10px}.tf-bc7950 a{font-size:var(--tf-font-sm);color:var(--tf-primary);text-decoration:none;font-family:var(--tf-font-family-mono)}.tf-d9b7b4{display:inline-flex;align-items:center;gap:4px;background:var(--tf-surface);border:1px solid var(--tf-border);border-radius:6px;padding:2px 8px;cursor:pointer;font-size:var(--tf-font-sm);font-family:var(--tf-font-family-mono);color:var(--tf-text-secondary);transition:background .15s,border-color .15s}.tf-d9b7b4:hover{background:var(--tf-surface-hover)}.tf-d9b7b4 svg{opacity:.4;transition:opacity .15s}.tf-d9b7b4:hover svg{opacity:.7}.tf-9398ea{border-style:dashed;border-color:var(--tf-primary)}.tf-9398ea .tf-2d9323{color:var(--tf-primary);font-style:italic;font-family:var(--tf-font-family)}.tf-4567e1{cursor:default;opacity:.8}.tf-4567e1:hover{background:var(--tf-surface)}.tf-58881e{color:var(--tf-text-tertiary);font-style:italic}";
@@ -12659,6 +12669,7 @@ export {
   TokenFlightError,
   TokenFlightReceive,
   TokenFlightSwap,
+  addThousandsSeparator,
   buildOffersForRanking,
   buildSwapOffersForRanking,
   clearTokenCache,