@tokenflight/swap 0.0.0 → 0.0.1

package/dist/tokenflight-swap.js

@@ -8364,267 +8364,135 @@ function RecipientEditor(props) {
     return _el$;
   })();
 }
-const VALID_TRANSITIONS = {
-  idle: ["quoting", "quoted", "error"],
-  quoting: ["quoted", "error", "idle"],
-  quoted: ["building", "quoting", "idle", "error"],
-  building: ["awaiting-wallet", "error", "quoted"],
-  "awaiting-wallet": ["submitting", "error", "quoted"],
-  submitting: ["tracking", "error", "quoted"],
-  tracking: ["success", "error"],
-  success: ["idle", "error"],
-  error: ["idle", "quoting", "quoted"]
-};
-function createSwapStateMachine() {
-  const [state, setState] = createSignal({
-    phase: "idle",
-    fromToken: null,
-    toToken: null,
-    inputAmount: "",
-    outputAmount: "",
-    routes: [],
-    quoteId: null,
-    selectedRouteId: null,
-    order: null,
-    walletAddress: null,
-    isStreaming: false,
-    error: null,
-    errorCode: null,
-    recipient: null
-  });
-  function transition(nextPhase) {
-    const current = state().phase;
-    const allowed = VALID_TRANSITIONS[current];
-    if (!allowed?.includes(nextPhase)) {
-      console.warn(
-        `[TokenFlight] Invalid state transition: ${current} → ${nextPhase}`
-      );
-      return false;
-    }
-    setState((prev) => ({ ...prev, phase: nextPhase }));
-    return true;
-  }
-  function setFromToken(token) {
-    setState((prev) => ({ ...prev, fromToken: token }));
-  }
-  function setToToken(token) {
-    setState((prev) => ({ ...prev, toToken: token }));
-  }
-  function setInputAmount(amount2) {
-    setState((prev) => ({ ...prev, inputAmount: amount2 }));
-  }
-  function setOutputAmount(amount2) {
-    setState((prev) => ({ ...prev, outputAmount: amount2 }));
-  }
-  function setQuoteData(quoteId, routes, selectedRouteId) {
+function deriveSwapPhase(execPhase, error2, isFetching, routeCount, hasQuoteRequest) {
+  if (execPhase) return execPhase;
+  if (error2) return "error";
+  if (isFetching && routeCount === 0 && hasQuoteRequest) return "quoting";
+  if (routeCount > 0) return "quoted";
+  return "idle";
+}
+function deriveReceivePhase(execPhase, error2, loadingQuotes, quoteCount) {
+  if (execPhase) return execPhase;
+  if (error2) return "error";
+  if (loadingQuotes && quoteCount === 0) return "quoting";
+  if (quoteCount > 0) return "quoted";
+  return "idle";
+}
+function createSwapStore() {
+  const [fromToken, setFromToken] = createSignal(null);
+  const [toToken, setToToken] = createSignal(null);
+  const [inputAmount, setInputAmount] = createSignal("");
+  const [recipient, _setRecipient] = createSignal(null);
+  const [walletAddress2, _setWalletAddress] = createSignal(null);
+  const [execPhase, setExecPhase] = createSignal(null);
+  const [order, setOrder] = createSignal(null);
+  const [error2, setError] = createSignal(null);
+  const [errorCode, setErrorCode] = createSignal(null);
+  function setWalletAddress(addr) {
+    if (walletAddress2() === addr) return;
+    _setWalletAddress(addr);
+  }
+  function setRecipient(r) {
+    if (recipient() === r) return;
+    _setRecipient(r);
+  }
+  function clearError() {
     batch(() => {
-      setState((prev) => ({
-        ...prev,
-        quoteId,
-        routes,
-        selectedRouteId
-      }));
-    });
-  }
-  function addStreamingRoute(quoteId, route) {
-    setState((prev) => {
-      if (prev.routes.some((r) => r.routeId === route.routeId)) {
-        return { ...prev, quoteId };
-      }
-      return { ...prev, quoteId, routes: [...prev.routes, route] };
+      setError(null);
+      setErrorCode(null);
     });
   }
-  function clearRoutes() {
-    setState((prev) => ({
-      ...prev,
-      routes: [],
-      quoteId: null,
-      selectedRouteId: null
-    }));
-  }
-  function setSelectedRouteId(routeId) {
-    setState((prev) => ({ ...prev, selectedRouteId: routeId }));
-  }
-  function setStreaming(isStreaming) {
-    setState((prev) => ({ ...prev, isStreaming }));
-  }
-  function setOrder(order) {
-    setState((prev) => ({ ...prev, order }));
-  }
-  function setWalletAddress(address) {
-    if (state().walletAddress === address) return;
-    setState((prev) => ({ ...prev, walletAddress: address }));
-  }
-  function setError(error2, errorCode = null) {
-    const current = state().phase;
-    const allowed = VALID_TRANSITIONS[current];
-    if (allowed?.includes("error")) {
-      setState((prev) => ({ ...prev, error: error2, errorCode, phase: "error" }));
-    } else {
-      setState((prev) => ({ ...prev, error: error2, errorCode }));
-    }
-  }
-  function setRecipient(recipient) {
-    if (state().recipient === recipient) return;
-    setState((prev) => ({ ...prev, recipient }));
-  }
   function reset() {
-    setState((prev) => ({
-      ...prev,
-      phase: "idle",
-      inputAmount: "",
-      outputAmount: "",
-      routes: [],
-      quoteId: null,
-      selectedRouteId: null,
-      order: null,
-      isStreaming: false,
-      error: null,
-      errorCode: null
-    }));
+    batch(() => {
+      setInputAmount("");
+      setOrder(null);
+      setExecPhase(null);
+      setError(null);
+      setErrorCode(null);
+    });
   }
   return {
-    state,
-    transition,
+    // Accessors
+    fromToken,
+    toToken,
+    inputAmount,
+    recipient,
+    walletAddress: walletAddress2,
+    execPhase,
+    order,
+    error: error2,
+    errorCode,
+    // Setters
     setFromToken,
     setToToken,
     setInputAmount,
-    setOutputAmount,
-    setQuoteData,
-    addStreamingRoute,
-    clearRoutes,
-    setSelectedRouteId,
-    setStreaming,
-    setOrder,
+    setRecipient,
     setWalletAddress,
+    setExecPhase,
+    setOrder,
     setError,
-    setRecipient,
+    setErrorCode,
+    // Batch helpers
+    clearError,
     reset
   };
 }
-function createReceiveStateMachine() {
-  const [state, setState] = createSignal({
-    phase: "idle",
-    targetToken: null,
-    fromToken: null,
-    targetAmount: "",
-    paymentAmount: "",
-    routes: [],
-    quoteId: null,
-    selectedRouteId: null,
-    order: null,
-    walletAddress: null,
-    isStreaming: false,
-    error: null,
-    errorCode: null,
-    recipient: null
-  });
-  function transition(nextPhase) {
-    const current = state().phase;
-    const allowed = VALID_TRANSITIONS[current];
-    if (!allowed?.includes(nextPhase)) {
-      console.warn(
-        `[TokenFlight] Invalid state transition: ${current} → ${nextPhase}`
-      );
-      return false;
-    }
-    setState((prev) => ({ ...prev, phase: nextPhase }));
-    return true;
-  }
-  function setTargetToken(token) {
-    setState((prev) => ({ ...prev, targetToken: token }));
-  }
-  function setFromToken(token) {
-    setState((prev) => ({ ...prev, fromToken: token }));
-  }
-  function setTargetAmount(amount2) {
-    setState((prev) => ({ ...prev, targetAmount: amount2 }));
-  }
-  function setPaymentAmount(amount2) {
-    setState((prev) => ({ ...prev, paymentAmount: amount2 }));
-  }
-  function setQuoteData(quoteId, routes, selectedRouteId) {
+function createReceiveStore() {
+  const [targetToken, setTargetToken] = createSignal(null);
+  const [targetAmount, setTargetAmount] = createSignal("");
+  const [fromToken, setFromToken] = createSignal(null);
+  const [recipient, _setRecipient] = createSignal(null);
+  const [walletAddress2, _setWalletAddress] = createSignal(null);
+  const [execPhase, setExecPhase] = createSignal(null);
+  const [order, setOrder] = createSignal(null);
+  const [error2, setError] = createSignal(null);
+  const [errorCode, setErrorCode] = createSignal(null);
+  function setWalletAddress(addr) {
+    if (walletAddress2() === addr) return;
+    _setWalletAddress(addr);
+  }
+  function setRecipient(r) {
+    if (recipient() === r) return;
+    _setRecipient(r);
+  }
+  function clearError() {
     batch(() => {
-      setState((prev) => ({
-        ...prev,
-        quoteId,
-        routes,
-        selectedRouteId
-      }));
-    });
-  }
-  function addStreamingRoute(quoteId, route) {
-    setState((prev) => {
-      if (prev.routes.some((r) => r.routeId === route.routeId)) {
-        return { ...prev, quoteId };
-      }
-      return { ...prev, quoteId, routes: [...prev.routes, route] };
+      setError(null);
+      setErrorCode(null);
     });
   }
-  function clearRoutes() {
-    setState((prev) => ({
-      ...prev,
-      routes: [],
-      quoteId: null,
-      selectedRouteId: null
-    }));
-  }
-  function setSelectedRouteId(routeId) {
-    setState((prev) => ({ ...prev, selectedRouteId: routeId }));
-  }
-  function setStreaming(isStreaming) {
-    setState((prev) => ({ ...prev, isStreaming }));
-  }
-  function setOrder(order) {
-    setState((prev) => ({ ...prev, order }));
-  }
-  function setWalletAddress(address) {
-    if (state().walletAddress === address) return;
-    setState((prev) => ({ ...prev, walletAddress: address }));
-  }
-  function setRecipient(recipient) {
-    if (state().recipient === recipient) return;
-    setState((prev) => ({ ...prev, recipient }));
-  }
-  function setError(error2, errorCode = null) {
-    const current = state().phase;
-    const allowed = VALID_TRANSITIONS[current];
-    if (allowed?.includes("error")) {
-      setState((prev) => ({ ...prev, error: error2, errorCode, phase: "error" }));
-    } else {
-      setState((prev) => ({ ...prev, error: error2, errorCode }));
-    }
-  }
   function reset() {
-    setState((prev) => ({
-      ...prev,
-      phase: "idle",
-      routes: [],
-      quoteId: null,
-      selectedRouteId: null,
-      order: null,
-      error: null,
-      errorCode: null,
-      paymentAmount: "",
-      isStreaming: false
-    }));
+    batch(() => {
+      setFromToken(null);
+      setOrder(null);
+      setExecPhase(null);
+      setError(null);
+      setErrorCode(null);
+    });
   }
   return {
-    state,
-    transition,
+    // Accessors
+    targetToken,
+    targetAmount,
+    fromToken,
+    recipient,
+    walletAddress: walletAddress2,
+    execPhase,
+    order,
+    error: error2,
+    errorCode,
+    // Setters
     setTargetToken,
-    setFromToken,
     setTargetAmount,
-    setPaymentAmount,
-    setQuoteData,
-    addStreamingRoute,
-    clearRoutes,
-    setSelectedRouteId,
-    setStreaming,
-    setOrder,
-    setWalletAddress,
+    setFromToken,
     setRecipient,
+    setWalletAddress,
+    setExecPhase,
+    setOrder,
     setError,
+    setErrorCode,
+    // Batch helpers
+    clearError,
     reset
   };
 }
@@ -8820,6 +8688,320 @@ function getBestOverallRouteId(routes, tradeType) {
   const ranked = rankOffers(offers);
   return ranked[0] ?? null;
 }
+function useWalletConnection(params) {
+  const [isConnected, setIsConnected] = createSignal(false);
+  const [walletAddress2, setWalletAddress] = createSignal(null);
+  const detectChainType = () => {
+    const adapter = params.walletAdapter();
+    if (!adapter) return "evm";
+    return adapter.supportedActionTypes.some((t2) => t2.startsWith("solana_")) ? "solana" : "evm";
+  };
+  onMount(async () => {
+    const adapter = params.walletAdapter();
+    if (!adapter) return;
+    const connected = adapter.isConnected();
+    setIsConnected(connected);
+    if (connected) {
+      const addr = await adapter.getAddress();
+      setWalletAddress(addr);
+      params.onAddressChange(addr);
+      params.callbacks()?.onWalletConnected?.({
+        address: addr ?? "",
+        chainType: detectChainType()
+      });
+    }
+    const handleWalletConnect = async () => {
+      const addr = await adapter.getAddress();
+      if (isConnected() && walletAddress2() === addr) return;
+      batch(() => {
+        setIsConnected(true);
+        setWalletAddress(addr);
+        params.onAddressChange(addr);
+      });
+      params.callbacks()?.onWalletConnected?.({
+        address: addr ?? "",
+        chainType: detectChainType()
+      });
+    };
+    const handleWalletDisconnect = () => {
+      if (!isConnected()) return;
+      batch(() => {
+        setIsConnected(false);
+        setWalletAddress(null);
+        params.onAddressChange(null);
+      });
+      params.onDisconnect?.();
+    };
+    adapter.on("connect", handleWalletConnect);
+    adapter.on("disconnect", handleWalletDisconnect);
+    onCleanup(() => {
+      adapter.off("connect", handleWalletConnect);
+      adapter.off("disconnect", handleWalletDisconnect);
+    });
+  });
+  const handleConnect = async () => {
+    const adapter = params.walletAdapter();
+    if (!adapter) {
+      console.warn(
+        "[TokenFlight] No wallet adapter configured. Pass a walletAdapter to enable wallet connection.\nSee: https://embed.tokenflight.ai/guides/wallet-adapter/"
+      );
+      params.callbacks()?.onConnectWallet?.();
+      return;
+    }
+    try {
+      await adapter.connect();
+    } catch {
+      params.onConnectError?.(
+        "Failed to connect wallet",
+        ErrorCode.WALLET_CONNECTION_FAILED
+      );
+    }
+  };
+  return {
+    isConnected,
+    walletAddress: walletAddress2,
+    detectChainType,
+    handleConnect
+  };
+}
+function useQuoteCountdown(params) {
+  const interval = params.intervalSeconds ?? QUOTE_REFRESH_SECONDS;
+  const [countdownSeconds, setCountdownSeconds] = createSignal(interval);
+  createEffect(
+    on(params.phase, (p) => {
+      if (p !== "quoted") {
+        setCountdownSeconds(interval);
+        return;
+      }
+      setCountdownSeconds(interval);
+      const timer = setInterval(() => {
+        setCountdownSeconds((prev) => {
+          if (prev <= 1) {
+            params.onExpired();
+            return interval;
+          }
+          return prev - 1;
+        });
+      }, 1e3);
+      onCleanup(() => clearInterval(timer));
+    })
+  );
+  return { countdownSeconds };
+}
+function useRecipient(params) {
+  const needRecipient = createMemo(() => {
+    const from = params.fromToken();
+    const to = params.toToken();
+    if (!from || !to || !params.isConnected()) return false;
+    return isCrossChainSwap(from.chainId, to.chainId);
+  });
+  const recipientDisplay = createMemo(() => {
+    const r = params.recipient();
+    if (r) return r;
+    if (params.isConnected() && params.walletAddress() && !needRecipient())
+      return params.walletAddress();
+    return null;
+  });
+  createEffect(
+    on(needRecipient, (need) => {
+      if (need && !params.recipient() && params.walletAdapter()) {
+        const to = params.toToken();
+        if (!to) return;
+        const targetChainType = getChainType(to.chainId);
+        params.walletAdapter().getAddress(targetChainType).then((addr) => {
+          if (addr && isAddressForChainType(addr, targetChainType) && !params.recipient() && needRecipient()) {
+            params.setRecipient(addr);
+          }
+        }).catch(() => {
+        });
+      }
+    })
+  );
+  const handleRecipientChange = (value2) => {
+    params.setRecipient(value2.trim() || null);
+  };
+  return {
+    needRecipient,
+    recipientDisplay,
+    handleRecipientChange
+  };
+}
+function useOrderTracking(params) {
+  const orderQuery = createOrderQuery(
+    params.client,
+    params.walletAddress,
+    params.trackingOrderId,
+    () => params.phase() === "tracking" && !!params.trackingOrderId()
+  );
+  createEffect(
+    on(
+      () => orderQuery.data,
+      (order) => {
+        if (!order || params.execPhase() !== "tracking") return;
+        const isFilled = order.status === "filled" || order.stepsCompleted?.includes("filled");
+        const isFailed = order.status === "failed" || order.status === "refunded";
+        batch(() => {
+          params.setOrder(order);
+          if (isFilled) {
+            params.setExecPhase("success");
+            queryClient.invalidateQueries({
+              queryKey: ["tokenBalances", params.client().baseUrl]
+            });
+            params.onOrderFilled(order);
+          } else if (isFailed) {
+            queryClient.invalidateQueries({
+              queryKey: ["tokenBalances", params.client().baseUrl]
+            });
+            params.onOrderFailed(order);
+          }
+        });
+      }
+    )
+  );
+  return { orderQuery };
+}
+function useSwapExecution(params) {
+  const [trackingOrderId, setTrackingOrderId] = createSignal(
+    null
+  );
+  const [trackingProviderName, setTrackingProviderName] = createSignal(null);
+  const [trackingProviderIcon, setTrackingProviderIcon] = createSignal(null);
+  const [executionError, setExecutionError] = createSignal(null);
+  const handleConfirm = async () => {
+    const currentRoutes = params.routes();
+    const currentQuoteId = params.quoteId();
+    const selectedRoute = currentRoutes.find((r) => r.routeId === params.selectedRouteId()) ?? currentRoutes[0];
+    if (!selectedRoute || !currentQuoteId || !params.client() || !params.walletAdapter())
+      return;
+    if (params.needRecipient() && !params.recipient()) {
+      params.setError("Recipient address is required for cross-chain swaps");
+      params.setErrorCode(ErrorCode.INVALID_CONFIG);
+      return;
+    }
+    const fromChainType = getChainType(params.fromToken().chainId);
+    const addr = params.walletAddress();
+    if (!addr) {
+      params.setError("Wallet not connected");
+      params.setErrorCode(ErrorCode.WALLET_CONNECTION_FAILED);
+      return;
+    }
+    if (!isAddressForChainType(addr, fromChainType)) {
+      params.setError(t("error.walletChainMismatch"));
+      params.setErrorCode(ErrorCode.INVALID_CONFIG);
+      return;
+    }
+    setTrackingProviderName(selectedRoute.routeId ?? null);
+    const apiBase = params.apiEndpoint() ?? DEFAULT_API_ENDPOINT;
+    setTrackingProviderIcon(
+      selectedRoute.icon ? `${apiBase}${selectedRoute.icon}` : null
+    );
+    setExecutionError(null);
+    params.setExecPhase("building");
+    try {
+      const depositData = await params.client().buildDeposit({
+        from: addr,
+        quoteId: currentQuoteId,
+        routeId: selectedRoute.routeId
+      });
+      params.setExecPhase("awaiting-wallet");
+      let txHash;
+      let signedTransaction;
+      if (depositData.kind === "CONTRACT_CALL" && depositData.approvals) {
+        for (const approval of depositData.approvals) {
+          if (approval.type === "eip1193_request") {
+            const result = await params.walletAdapter().executeWalletAction({
+              type: "eip1193_request",
+              chainId: params.fromToken().chainId,
+              method: approval.request.method,
+              params: approval.request.params
+            });
+            if (!result.success) {
+              throw new TokenFlightError(
+                ErrorCode.WALLET_ACTION_FAILED,
+                result.error ?? "Wallet action failed"
+              );
+            }
+            if (approval.deposit) {
+              txHash = result.txHash ?? txHash;
+            }
+          } else if (approval.type === "solana_sendTransaction") {
+            const result = await params.walletAdapter().executeWalletAction({
+              type: "solana_signTransaction",
+              transaction: approval.transaction
+            });
+            if (!result.success) {
+              throw new TokenFlightError(
+                ErrorCode.WALLET_ACTION_FAILED,
+                result.error ?? "Wallet action failed"
+              );
+            }
+            if (approval.deposit) {
+              signedTransaction = typeof result.data === "string" ? result.data : void 0;
+            }
+          }
+        }
+      }
+      if (!txHash && !signedTransaction) {
+        throw new TokenFlightError(
+          ErrorCode.TRANSACTION_FAILED,
+          "No deposit transaction received"
+        );
+      }
+      params.setExecPhase("submitting");
+      const submitResult = await params.client().submitDeposit(
+        signedTransaction ? {
+          quoteId: currentQuoteId,
+          routeId: selectedRoute.routeId,
+          signedTransaction
+        } : {
+          quoteId: currentQuoteId,
+          routeId: selectedRoute.routeId,
+          txHash
+        }
+      );
+      params.setExecPhase("tracking");
+      setTrackingOrderId(submitResult.orderId);
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : typeof err === "string" ? err : "Transaction failed";
+      setExecutionError(errorMsg);
+      if (err instanceof TokenFlightError) {
+        params.callbacks()?.onSwapError?.({
+          code: err.code,
+          message: err.message,
+          details: err.details
+        });
+      } else {
+        params.callbacks()?.onSwapError?.({
+          code: ErrorCode.TRANSACTION_FAILED,
+          message: String(err)
+        });
+      }
+    }
+  };
+  const handleRetry = () => {
+    setExecutionError(null);
+    params.setExecPhase(null);
+  };
+  const handleNewSwap = () => {
+    params.storeReset();
+    setTrackingOrderId(null);
+    setTrackingProviderName(null);
+    setTrackingProviderIcon(null);
+    setExecutionError(null);
+    queryClient.removeQueries({ queryKey: ["quote", params.client().baseUrl] });
+    queryClient.removeQueries({ queryKey: ["order", params.client().baseUrl] });
+    params.onReset?.();
+  };
+  return {
+    trackingOrderId,
+    trackingProviderName,
+    trackingProviderIcon,
+    executionError,
+    handleConfirm,
+    handleRetry,
+    handleNewSwap
+  };
+}
 const header$1 = "tf-dc5721";
 const headerLeft = "tf-68123c";
 const headerLogoImage = "tf-532d07";
@@ -8882,23 +9064,23 @@ const swapStyles = {
 };
 var _tmpl$$3 = /* @__PURE__ */ template(`<div data-testid=selector-overlay>`), _tmpl$2$2 = /* @__PURE__ */ template(`<div>`), _tmpl$3$2 = /* @__PURE__ */ template(`<div part=container><div part=accent-line data-testid=accent-line>`), _tmpl$4$2 = /* @__PURE__ */ template(`<img width=22 height=22>`), _tmpl$5$2 = /* @__PURE__ */ template(`<button part=wallet-info><div data-testid=wallet-dot></div><span data-testid=wallet-address>`), _tmpl$6$2 = /* @__PURE__ */ template(`<div part=header><div><span data-testid=header-title>`), _tmpl$7$2 = /* @__PURE__ */ template(`<div><span part=balance data-testid=panel-balance></span><button data-testid=max-btn>`), _tmpl$8$2 = /* @__PURE__ */ template(`<button part=token-display data-testid=token-btn><div data-testid=token-icon-wrap><div data-testid=token-chain-dot></div></div><span data-testid=token-name></span><span data-testid=caret>`), _tmpl$9$2 = /* @__PURE__ */ template(`<div part=panel-from><div><div><span data-testid=panel-label></span></div><div></div><div><span data-testid=fiat>`), _tmpl$0$2 = /* @__PURE__ */ template(`<div part=swap-arrow><button type=button data-testid=swap-arrow-inner>`), _tmpl$1$2 = /* @__PURE__ */ template(`<button part=recipient-badge data-testid=recipient-badge><span>`), _tmpl$10$2 = /* @__PURE__ */ template(`<span part=amount-display data-testid=amount style=cursor:default>`), _tmpl$11$1 = /* @__PURE__ */ template(`<div part=panel-to data-testid=panel-wrapper-to><div><div><span data-testid=panel-label></span></div><div></div><div><span data-testid=fiat>`), _tmpl$12$1 = /* @__PURE__ */ template(`<div part=price-preview data-testid=quote>`), _tmpl$13 = /* @__PURE__ */ template(`<div part=no-offer><div><svg width=28 height=28 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round><circle cx=11 cy=11 r=8></circle><path d="m21 21-4.35-4.35"></path><path d="M8 11h6"></path></svg></div><span>`), _tmpl$14 = /* @__PURE__ */ template(`<div part=cta-wrapper>`), _tmpl$15 = /* @__PURE__ */ template(`<span>Flight`), _tmpl$16 = /* @__PURE__ */ template(`<button data-testid=token-btn><span data-testid=token-name></span><span data-testid=caret>`), _tmpl$17 = /* @__PURE__ */ template(`<div style=width:120px;height:28px>`);
 function SwapComponent(props) {
-  const sm = createSwapStateMachine();
+  const store = createSwapStore();
   const [selectorOpen, setSelectorOpen] = createSignal(null);
-  const [isConnected, setIsConnected] = createSignal(false);
-  const [walletAddress2, setWalletAddress] = createSignal(null);
-  const [trackingOrderId, setTrackingOrderId] = createSignal(null);
   const [recipientEditorOpen, setRecipientEditorOpen] = createSignal(false);
-  const [noRoutes, setNoRoutes] = createSignal(false);
-  const [trackingProviderName, setTrackingProviderName] = createSignal(null);
-  const [trackingProviderIcon, setTrackingProviderIcon] = createSignal(null);
-  const [executionError, setExecutionError] = createSignal(null);
+  const {
+    isConnected,
+    walletAddress: walletAddress2,
+    handleConnect
+  } = useWalletConnection({
+    walletAdapter: () => props.walletAdapter,
+    callbacks: () => props.callbacks,
+    onAddressChange: (addr) => store.setWalletAddress(addr),
+    onConnectError: (msg, code) => {
+      store.setError(msg);
+      store.setErrorCode(code);
+    }
+  });
   const [debouncedAmount, setDebouncedAmount, setDebouncedAmountImmediate] = createDebounced("", 300);
-  const phase = createMemo(() => sm.state().phase);
-  const fromToken = createMemo(() => sm.state().fromToken);
-  const toToken = createMemo(() => sm.state().toToken);
-  const inputAmount = createMemo(() => sm.state().inputAmount);
-  const outputAmount = createMemo(() => sm.state().outputAmount);
-  const recipient = createMemo(() => sm.state().recipient);
   const client = createMemo(() => {
     const endpoint = props.config.apiEndpoint ?? DEFAULT_API_ENDPOINT;
     return new HyperstreamApi({
@@ -8907,7 +9089,7 @@ function SwapComponent(props) {
   });
   const balancesQuery = createTokenBalancesQuery(client, walletAddress2, () => isConnected() && !!walletAddress2(), () => props.walletAdapter?.supportedChainIds);
   const fromBalance = createMemo(() => {
-    const from = fromToken();
+    const from = store.fromToken();
     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) {
@@ -8916,14 +9098,14 @@ function SwapComponent(props) {
     return "0";
   });
   const fromBalanceRaw = createMemo(() => {
-    const from = fromToken();
+    const from = store.fromToken();
     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);
     return match?.extensions?.balance ?? "0";
   });
   const insufficientBalance = createMemo(() => {
-    const input = inputAmount();
-    const from = fromToken();
+    const input = store.inputAmount();
+    const from = store.fromToken();
     const balRaw = fromBalanceRaw();
     if (!from || typeof from.decimals !== "number" || !balRaw || !input || input === "0" || input === "") {
       return false;
@@ -8935,7 +9117,7 @@ function SwapComponent(props) {
     }
   });
   const fromUnitPriceUsd = createMemo(() => {
-    const from = fromToken();
+    const from = store.fromToken();
     if (!from) return null;
     if (typeof from.priceUsd === "number" && Number.isFinite(from.priceUsd)) {
       return from.priceUsd;
@@ -8945,7 +9127,7 @@ function SwapComponent(props) {
     return Number.isFinite(parsed) ? parsed : null;
   });
   const toUnitPriceUsd = createMemo(() => {
-    const to = toToken();
+    const to = store.toToken();
     if (!to) return null;
     if (typeof to.priceUsd === "number" && Number.isFinite(to.priceUsd)) {
       return to.priceUsd;
@@ -8957,178 +9139,24 @@ function SwapComponent(props) {
     if (value2 < 0.01) return "<0.01";
     return value2.toFixed(2).replace(/\.?0+$/, "");
   };
-  const inputFiatText = createMemo(() => {
-    const amount2 = Number(inputAmount());
-    const price = fromUnitPriceUsd();
-    if (!Number.isFinite(amount2) || amount2 <= 0 || price === null) return null;
-    return t("swap.fiatValue", {
-      value: formatUsd(amount2 * price)
-    });
-  });
-  const outputFiatText = createMemo(() => {
-    const amount2 = Number(outputAmount() || "0");
-    const price = toUnitPriceUsd();
-    const p = phase();
-    const show = p === "quoted" || p === "building" || p === "awaiting-wallet" || p === "submitting" || p === "tracking" || p === "success";
-    if (!show || !Number.isFinite(amount2) || amount2 <= 0 || price === null) return null;
-    return t("swap.fiatValue", {
-      value: formatUsd(amount2 * price)
-    });
-  });
-  const orderQuery = createOrderQuery(client, walletAddress2, trackingOrderId, () => phase() === "tracking" && !!trackingOrderId());
-  createEffect(on(() => orderQuery.data, (order) => {
-    if (!order || sm.state().phase !== "tracking") return;
-    const isFilled = order.status === "filled" || order.stepsCompleted?.includes("filled");
-    const isFailed = order.status === "failed" || order.status === "refunded";
-    batch(() => {
-      sm.setOrder(order);
-      if (isFilled) {
-        sm.transition("success");
-        queryClient.invalidateQueries({
-          queryKey: ["tokenBalances", client().baseUrl]
-        });
-        const state2 = sm.state();
-        props.callbacks?.onSwapSuccess?.({
-          orderId: order.id,
-          fromToken: state2.fromToken.symbol ?? state2.fromToken.address,
-          toToken: state2.toToken.symbol ?? state2.toToken.address,
-          fromAmount: order.srcAmount,
-          toAmount: order.destAmount,
-          txHash: order.depositTxHash
-        });
-      } else if (isFailed) {
-        queryClient.invalidateQueries({
-          queryKey: ["tokenBalances", client().baseUrl]
-        });
-        props.callbacks?.onSwapError?.({
-          code: ErrorCode.ORDER_FAILED,
-          message: "Order " + order.status
-        });
-      }
-    });
-  }));
-  onMount(() => {
-    if (props.config.locale) {
-      setLocale(props.config.locale);
-    }
-  });
-  const chainsQuery = createChainsQuery(client, () => true);
-  const chainMap = createMemo(() => {
-    const data = chainsQuery.data;
-    return data ? buildChainMap(data) : /* @__PURE__ */ new Map();
-  });
-  onMount(async () => {
-    const c = client();
-    if (props.config.fromToken) {
-      try {
-        const target2 = parseTokenIdentifier(props.config.fromToken);
-        const resolved = await resolveToken(target2.chainId, target2.address, props.config.apiEndpoint, c);
-        if (typeof resolved.decimals !== "number") {
-          throw new TokenFlightError(ErrorCode.INVALID_TOKEN_IDENTIFIER, "Failed to resolve fromToken metadata");
-        }
-        sm.setFromToken(resolved);
-      } catch (err) {
-        props.callbacks?.onSwapError?.({
-          code: ErrorCode.INVALID_TOKEN_IDENTIFIER,
-          message: `Failed to resolve fromToken: ${err instanceof Error ? err.message : String(err)}`
-        });
-      }
-    }
-    if (props.config.toToken) {
-      try {
-        const target2 = parseTokenIdentifier(props.config.toToken);
-        const resolved = await resolveToken(target2.chainId, target2.address, props.config.apiEndpoint, c);
-        if (typeof resolved.decimals !== "number") {
-          throw new TokenFlightError(ErrorCode.INVALID_TOKEN_IDENTIFIER, "Failed to resolve toToken metadata");
-        }
-        sm.setToToken(resolved);
-      } catch (err) {
-        props.callbacks?.onSwapError?.({
-          code: ErrorCode.INVALID_TOKEN_IDENTIFIER,
-          message: `Failed to resolve toToken: ${err instanceof Error ? err.message : String(err)}`
-        });
-      }
-    }
-  });
-  const detectChainType = () => {
-    if (!props.walletAdapter) return "evm";
-    return props.walletAdapter.supportedActionTypes.some((t2) => t2.startsWith("solana_")) ? "solana" : "evm";
-  };
-  const needRecipient = createMemo(() => {
-    const from = fromToken();
-    const to = toToken();
-    if (!from || !to || !isConnected()) return false;
-    return isCrossChainSwap(from.chainId, to.chainId);
-  });
-  const recipientDisplay = createMemo(() => {
-    const r = recipient();
-    if (r) return r;
-    if (isConnected() && walletAddress2() && !needRecipient()) return walletAddress2();
-    return null;
-  });
-  onMount(() => {
-    if (props.config.recipient) {
-      sm.setRecipient(props.config.recipient);
-    }
-  });
-  const handleRecipientChange = (value2) => {
-    const trimmed = value2.trim() || null;
-    sm.setRecipient(trimmed);
-    if (!trimmed) {
-      sm.clearRoutes();
-      sm.setOutputAmount("");
-      if (sm.state().phase !== "idle") {
-        sm.transition("idle");
-      }
-    }
-  };
-  onMount(async () => {
-    if (props.walletAdapter) {
-      const connected = props.walletAdapter.isConnected();
-      setIsConnected(connected);
-      if (connected) {
-        const addr = await props.walletAdapter.getAddress();
-        setWalletAddress(addr);
-        sm.setWalletAddress(addr);
-        props.callbacks?.onWalletConnected?.({
-          address: addr ?? "",
-          chainType: detectChainType()
-        });
-      }
-      const handleWalletConnect = async () => {
-        const addr = await props.walletAdapter.getAddress();
-        if (isConnected() && walletAddress2() === addr) return;
-        batch(() => {
-          setIsConnected(true);
-          setWalletAddress(addr);
-          sm.setWalletAddress(addr);
-        });
-        props.callbacks?.onWalletConnected?.({
-          address: addr ?? "",
-          chainType: detectChainType()
-        });
-      };
-      const handleWalletDisconnect = () => {
-        if (!isConnected()) return;
-        batch(() => {
-          setIsConnected(false);
-          setWalletAddress(null);
-          sm.setWalletAddress(null);
-        });
-      };
-      props.walletAdapter.on("connect", handleWalletConnect);
-      props.walletAdapter.on("disconnect", handleWalletDisconnect);
-      onCleanup(() => {
-        props.walletAdapter.off("connect", handleWalletConnect);
-        props.walletAdapter.off("disconnect", handleWalletDisconnect);
-      });
-    }
+  const {
+    needRecipient,
+    recipientDisplay,
+    handleRecipientChange
+  } = useRecipient({
+    fromToken: store.fromToken,
+    toToken: store.toToken,
+    recipient: store.recipient,
+    isConnected,
+    walletAddress: walletAddress2,
+    walletAdapter: () => props.walletAdapter,
+    setRecipient: store.setRecipient
   });
   const quoteRequest = createMemo(() => {
     const amount2 = debouncedAmount();
-    const from = fromToken();
-    const to = toToken();
-    const r = recipient();
+    const from = store.fromToken();
+    const to = store.toToken();
+    const r = store.recipient();
     if (!amount2 || parseFloat(amount2) <= 0 || !from || typeof from.decimals !== "number" || !to || !client()) return null;
     if (needRecipient() && !r) return null;
     return {
@@ -9144,238 +9172,204 @@ function SwapComponent(props) {
       }
     };
   });
-  const quoteQueryEnabled = createMemo(() => {
+  const quoteQueryEnabled = createMemo(() => !!quoteRequest() && !store.execPhase());
+  const quoteQuery = createQuoteQuery(client, quoteRequest, quoteQueryEnabled);
+  const routes = createMemo(() => {
+    const amount2 = store.inputAmount();
+    if (!amount2 || parseFloat(amount2) <= 0) return [];
+    if (!store.fromToken() || !store.toToken()) return [];
+    return quoteQuery.data?.routes ?? [];
+  });
+  const quoteId = createMemo(() => quoteQuery.data?.quoteId ?? null);
+  const selectedRouteId = createMemo(() => {
+    const r = routes();
+    return r.length > 0 ? getBestOverallSwapRouteId(r) : null;
+  });
+  const bestRoute = createMemo(() => {
+    const r = routes();
+    const sel = selectedRouteId();
+    return r.find((rt) => rt.routeId === sel) ?? r[0] ?? null;
+  });
+  const outputAmount = createMemo(() => {
+    const route = bestRoute();
+    const to = store.toToken();
+    if (!route || !to || typeof to.decimals !== "number") return "";
+    return formatDisplayAmount(toDisplayAmount(route.quote.amountOut, to.decimals));
+  });
+  const phase = createMemo(() => deriveSwapPhase(store.execPhase(), store.error(), quoteQuery.isFetching, routes().length, !!quoteRequest()));
+  const noRoutes = createMemo(() => {
+    if (store.execPhase()) return false;
+    if (!quoteRequest()) return false;
+    return !quoteQuery.isFetching && quoteQuery.isSuccess && routes().length === 0;
+  });
+  const showQuote = createMemo(() => {
+    const p = phase();
+    return p === "quoted" || p === "building" || p === "awaiting-wallet" || p === "submitting" || p === "tracking" || p === "success";
+  });
+  const isExecuting = createMemo(() => {
     const p = phase();
-    const hasRequest = !!quoteRequest();
-    return hasRequest && (p === "idle" || p === "quoting" || p === "quoted");
+    return p === "building" || p === "awaiting-wallet" || p === "submitting" || p === "tracking";
+  });
+  const isQuoteLoading = createMemo(() => {
+    if (!store.fromToken() || !store.toToken()) return false;
+    return phase() === "quoting" && parseFloat(store.inputAmount()) > 0 && routes().length === 0;
+  });
+  const inputFiatText = createMemo(() => {
+    const amount2 = Number(store.inputAmount());
+    const price = fromUnitPriceUsd();
+    if (!Number.isFinite(amount2) || amount2 <= 0 || price === null) return null;
+    return t("swap.fiatValue", {
+      value: formatUsd(amount2 * price)
+    });
+  });
+  const outputFiatText = createMemo(() => {
+    const amount2 = Number(outputAmount() || "0");
+    const price = toUnitPriceUsd();
+    if (!showQuote() || !Number.isFinite(amount2) || amount2 <= 0 || price === null) return null;
+    return t("swap.fiatValue", {
+      value: formatUsd(amount2 * price)
+    });
+  });
+  const {
+    trackingOrderId,
+    trackingProviderName,
+    trackingProviderIcon,
+    executionError,
+    handleConfirm,
+    handleRetry,
+    handleNewSwap
+  } = useSwapExecution({
+    client,
+    walletAdapter: () => props.walletAdapter,
+    callbacks: () => props.callbacks,
+    apiEndpoint: () => props.config.apiEndpoint,
+    fromToken: store.fromToken,
+    recipient: store.recipient,
+    needRecipient,
+    walletAddress: walletAddress2,
+    routes,
+    quoteId,
+    selectedRouteId,
+    setExecPhase: store.setExecPhase,
+    setError: store.setError,
+    setErrorCode: store.setErrorCode,
+    storeReset: store.reset,
+    onReset: () => setDebouncedAmountImmediate("")
+  });
+  useOrderTracking({
+    client,
+    walletAddress: walletAddress2,
+    trackingOrderId,
+    phase,
+    execPhase: store.execPhase,
+    setOrder: store.setOrder,
+    setExecPhase: store.setExecPhase,
+    onOrderFilled: (order) => {
+      props.callbacks?.onSwapSuccess?.({
+        orderId: order.id,
+        fromToken: store.fromToken().symbol ?? store.fromToken().address,
+        toToken: store.toToken().symbol ?? store.toToken().address,
+        fromAmount: order.srcAmount,
+        toAmount: order.destAmount,
+        txHash: order.depositTxHash
+      });
+    },
+    onOrderFailed: (order) => {
+      props.callbacks?.onSwapError?.({
+        code: ErrorCode.ORDER_FAILED,
+        message: "Order " + order.status
+      });
+    }
   });
-  const quoteQuery = createQuoteQuery(client, quoteRequest, quoteQueryEnabled);
   createEffect(on(() => quoteQuery.data, (data) => {
     if (data) props.callbacks?.onQuoteReceived?.(data);
   }));
   createEffect(on(() => ({
-    data: quoteQuery.data,
-    isFetching: quoteQuery.isFetching,
     isError: quoteQuery.isError,
-    error: quoteQuery.error
+    error: quoteQuery.error,
+    data: quoteQuery.data
   }), ({
-    data,
-    isFetching,
     isError,
-    error: error2
+    error: error2,
+    data
   }) => {
-    const phase2 = sm.state().phase;
-    if (phase2 === "building" || phase2 === "awaiting-wallet" || phase2 === "submitting" || phase2 === "tracking" || phase2 === "success") return;
-    if (isFetching && !data) {
-      if (phase2 !== "quoting") {
-        sm.clearRoutes();
-        setNoRoutes(false);
-        sm.transition("quoting");
-      }
-      return;
-    }
+    if (store.execPhase()) return;
     if (isError && !data) {
       if (error2 instanceof TokenFlightError) {
-        sm.setError(error2.message, error2.code);
+        store.setError(error2.message);
+        store.setErrorCode(error2.code);
       } else {
-        sm.setError(String(error2));
-      }
-      return;
-    }
-    if (data) {
-      const toDecimals = sm.state().toToken?.decimals ?? 18;
-      const bestId = getBestOverallSwapRouteId(data.routes);
-      sm.setQuoteData(data.quoteId, data.routes, bestId);
-      if (bestId) {
-        const bestRoute2 = data.routes.find((r) => r.routeId === bestId);
-        if (bestRoute2) {
-          sm.setOutputAmount(formatDisplayAmount(toDisplayAmount(bestRoute2.quote.amountOut, toDecimals)));
-        }
-      }
-      if (data.routes.length > 0) {
-        setNoRoutes(false);
-        if (phase2 !== "quoted") sm.transition("quoted");
-      } else {
-        setNoRoutes(true);
-        if (phase2 !== "idle") sm.transition("idle");
-      }
-    }
-  }));
-  const [countdownSeconds, setCountdownSeconds] = createSignal(QUOTE_REFRESH_SECONDS);
-  createEffect(on(phase, (p) => {
-    if (p !== "quoted") {
-      setCountdownSeconds(QUOTE_REFRESH_SECONDS);
-      return;
-    }
-    setCountdownSeconds(QUOTE_REFRESH_SECONDS);
-    const timer = setInterval(() => {
-      setCountdownSeconds((prev) => {
-        if (prev <= 1) {
-          quoteQuery.refetch();
-          return QUOTE_REFRESH_SECONDS;
-        }
-        return prev - 1;
-      });
-    }, 1e3);
-    onCleanup(() => clearInterval(timer));
-  }));
-  const handleAmountChange = (amount2) => {
-    sm.setInputAmount(amount2);
-    props.callbacks?.onAmountChanged?.({
-      amount: amount2,
-      direction: "from"
-    });
-    if (!amount2 || parseFloat(amount2) <= 0) {
-      sm.clearRoutes();
-      sm.setOutputAmount("");
-      setNoRoutes(false);
-      if (sm.state().phase !== "idle") {
-        sm.transition("idle");
+        store.setError(String(error2));
+        store.setErrorCode(null);
       }
-    } else if (sm.state().phase === "error") {
-      sm.transition("idle");
-    }
-    setDebouncedAmount(amount2);
-  };
-  createEffect(on(needRecipient, (need) => {
-    if (need && !recipient() && props.walletAdapter) {
-      const to = toToken();
-      if (!to) return;
-      const targetChainType = getChainType(to.chainId);
-      props.walletAdapter.getAddress(targetChainType).then((addr) => {
-        if (addr && isAddressForChainType(addr, targetChainType) && !recipient() && needRecipient()) {
-          sm.setRecipient(addr);
-        }
-      }).catch(() => {
-      });
+    } else if (store.error() && !isError) {
+      store.clearError();
     }
   }));
-  const handleConnect = async () => {
-    if (!props.walletAdapter) {
-      console.warn("[TokenFlight] No wallet adapter configured. Pass a walletAdapter to enable wallet connection.\nSee: https://embed.tokenflight.ai/guides/wallet-adapter/");
-      props.callbacks?.onConnectWallet?.();
-      return;
-    }
-    try {
-      await props.walletAdapter.connect();
-    } catch {
-      sm.setError("Failed to connect wallet", ErrorCode.WALLET_CONNECTION_FAILED);
-    }
-  };
-  const handleConfirm = async () => {
-    const state2 = sm.state();
-    const selectedRoute = state2.routes.find((r) => r.routeId === state2.selectedRouteId) ?? state2.routes[0];
-    if (!selectedRoute || !state2.quoteId || !client() || !props.walletAdapter) return;
-    if (needRecipient() && !state2.recipient) {
-      sm.setError("Recipient address is required for cross-chain swaps", ErrorCode.INVALID_CONFIG);
-      return;
-    }
-    const fromChainType = getChainType(state2.fromToken.chainId);
-    const addr = walletAddress2();
-    if (!addr) {
-      sm.setError("Wallet not connected", ErrorCode.WALLET_CONNECTION_FAILED);
-      return;
+  const {
+    countdownSeconds
+  } = useQuoteCountdown({
+    phase,
+    onExpired: () => {
+      quoteQuery.refetch();
     }
-    if (!isAddressForChainType(addr, fromChainType)) {
-      sm.setError(t("error.walletChainMismatch"), ErrorCode.INVALID_CONFIG);
-      return;
+  });
+  onMount(() => {
+    if (props.config.locale) {
+      setLocale(props.config.locale);
     }
-    setTrackingProviderName(selectedRoute.routeId ?? null);
-    const apiBase = props.config.apiEndpoint ?? DEFAULT_API_ENDPOINT;
-    setTrackingProviderIcon(selectedRoute.icon ? `${apiBase}${selectedRoute.icon}` : null);
-    setExecutionError(null);
-    sm.transition("building");
-    try {
-      const depositData = await client().buildDeposit({
-        from: walletAddress2(),
-        quoteId: state2.quoteId,
-        routeId: selectedRoute.routeId
-      });
-      sm.transition("awaiting-wallet");
-      let txHash;
-      let signedTransaction;
-      if (depositData.kind === "CONTRACT_CALL" && depositData.approvals) {
-        for (const approval of depositData.approvals) {
-          if (approval.type === "eip1193_request") {
-            const result = await props.walletAdapter.executeWalletAction({
-              type: "eip1193_request",
-              chainId: state2.fromToken.chainId,
-              method: approval.request.method,
-              params: approval.request.params
-            });
-            if (!result.success) {
-              throw new TokenFlightError(ErrorCode.WALLET_ACTION_FAILED, result.error ?? "Wallet action failed");
-            }
-            if (approval.deposit) {
-              txHash = result.txHash ?? txHash;
-            }
-          } else if (approval.type === "solana_sendTransaction") {
-            const result = await props.walletAdapter.executeWalletAction({
-              type: "solana_signTransaction",
-              transaction: approval.transaction
-            });
-            if (!result.success) {
-              throw new TokenFlightError(ErrorCode.WALLET_ACTION_FAILED, result.error ?? "Wallet action failed");
-            }
-            if (approval.deposit) {
-              signedTransaction = typeof result.data === "string" ? result.data : void 0;
-            }
-          }
+  });
+  const chainsQuery = createChainsQuery(client, () => true);
+  const chainMap = createMemo(() => {
+    const data = chainsQuery.data;
+    return data ? buildChainMap(data) : /* @__PURE__ */ new Map();
+  });
+  onMount(async () => {
+    const c = client();
+    if (props.config.fromToken) {
+      try {
+        const target2 = parseTokenIdentifier(props.config.fromToken);
+        const resolved = await resolveToken(target2.chainId, target2.address, props.config.apiEndpoint, c);
+        if (typeof resolved.decimals !== "number") {
+          throw new TokenFlightError(ErrorCode.INVALID_TOKEN_IDENTIFIER, "Failed to resolve fromToken metadata");
         }
-      }
-      if (!txHash && !signedTransaction) {
-        throw new TokenFlightError(ErrorCode.TRANSACTION_FAILED, "No deposit transaction received");
-      }
-      sm.transition("submitting");
-      const submitResult = await client().submitDeposit(signedTransaction ? {
-        quoteId: state2.quoteId,
-        routeId: selectedRoute.routeId,
-        signedTransaction
-      } : {
-        quoteId: state2.quoteId,
-        routeId: selectedRoute.routeId,
-        txHash
-      });
-      sm.transition("tracking");
-      setTrackingOrderId(submitResult.orderId);
-    } catch (err) {
-      const errorMsg = err instanceof Error ? err.message : typeof err === "string" ? err : "Transaction failed";
-      setExecutionError(errorMsg);
-      if (err instanceof TokenFlightError) {
+        store.setFromToken(resolved);
+      } catch (err) {
         props.callbacks?.onSwapError?.({
-          code: err.code,
-          message: err.message,
-          details: err.details
+          code: ErrorCode.INVALID_TOKEN_IDENTIFIER,
+          message: `Failed to resolve fromToken: ${err instanceof Error ? err.message : String(err)}`
         });
-      } else {
+      }
+    }
+    if (props.config.toToken) {
+      try {
+        const target2 = parseTokenIdentifier(props.config.toToken);
+        const resolved = await resolveToken(target2.chainId, target2.address, props.config.apiEndpoint, c);
+        if (typeof resolved.decimals !== "number") {
+          throw new TokenFlightError(ErrorCode.INVALID_TOKEN_IDENTIFIER, "Failed to resolve toToken metadata");
+        }
+        store.setToToken(resolved);
+      } catch (err) {
         props.callbacks?.onSwapError?.({
-          code: ErrorCode.TRANSACTION_FAILED,
-          message: String(err)
+          code: ErrorCode.INVALID_TOKEN_IDENTIFIER,
+          message: `Failed to resolve toToken: ${err instanceof Error ? err.message : String(err)}`
         });
       }
     }
-  };
-  const handleRetry = () => {
-    setExecutionError(null);
-    sm.transition("quoted");
-  };
-  const handleNewSwap = () => {
-    sm.clearRoutes();
-    sm.setOutputAmount("");
-    sm.setInputAmount("");
-    sm.setOrder(null);
-    setDebouncedAmountImmediate("");
-    setTrackingOrderId(null);
-    setTrackingProviderName(null);
-    setTrackingProviderIcon(null);
-    setExecutionError(null);
-    queryClient.removeQueries({
-      queryKey: ["quote", client().baseUrl]
-    });
-    queryClient.removeQueries({
-      queryKey: ["order", client().baseUrl]
+  });
+  onMount(() => {
+    if (props.config.recipient) {
+      store.setRecipient(props.config.recipient);
+    }
+  });
+  const handleAmountChange = (amount2) => {
+    store.setInputAmount(amount2);
+    props.callbacks?.onAmountChanged?.({
+      amount: amount2,
+      direction: "from"
     });
-    sm.transition("idle");
+    if (store.error()) store.clearError();
+    setDebouncedAmount(amount2);
   };
   const handleTokenSelect = (token) => {
     const resolved = {
@@ -9388,43 +9382,29 @@ function SwapComponent(props) {
       priceUsd: token.priceUsd
     };
     if (selectorOpen() === "from") {
-      sm.setFromToken(resolved);
+      store.setFromToken(resolved);
     } else {
-      sm.setToToken(resolved);
+      store.setToToken(resolved);
     }
     setSelectorOpen(null);
-    const amount2 = sm.state().inputAmount;
-    if (!amount2 || parseFloat(amount2) <= 0) {
-      sm.clearRoutes();
-      sm.setOutputAmount("");
-      if (sm.state().phase !== "idle") {
-        sm.transition("idle");
-      }
-    }
   };
   const handleSwapTokens = () => {
-    const current = sm.state();
-    const phase2 = current.phase;
-    const isBusy = phase2 === "building" || phase2 === "awaiting-wallet" || phase2 === "submitting" || phase2 === "tracking";
-    if (isBusy || !current.fromToken || !current.toToken) return;
-    sm.setFromToken(current.toToken);
-    sm.setToToken(current.fromToken);
-    sm.clearRoutes();
-    sm.setOutputAmount("");
-    if (phase2 === "success") {
-      sm.transition("idle");
-    }
-    const amount2 = current.inputAmount;
-    if (!amount2 || parseFloat(amount2) <= 0) {
-      if (sm.state().phase !== "idle") {
-        sm.transition("idle");
-      }
-    }
+    if (isExecuting() || !store.fromToken() || !store.toToken()) return;
+    const from = store.fromToken();
+    const to = store.toToken();
+    batch(() => {
+      store.setFromToken(to);
+      store.setToToken(from);
+      if (store.execPhase() === "success") store.setExecPhase(null);
+    });
   };
   const handleMaxClick = () => {
-    const bal = fromBalance();
-    if (bal && bal !== "0") {
-      handleAmountChange(bal);
+    const from = store.fromToken();
+    const balRaw = fromBalanceRaw();
+    if (!from || typeof from.decimals !== "number" || !balRaw || balRaw === "0") return;
+    const fullPrecision = toDisplayAmount(balRaw, from.decimals);
+    if (fullPrecision && fullPrecision !== "0") {
+      handleAmountChange(fullPrecision);
     }
   };
   const handleAccountClick = async () => {
@@ -9435,20 +9415,12 @@ function SwapComponent(props) {
     }
   };
   const truncateAddress = (addr) => `${addr.slice(0, 6)}...${addr.slice(-4)}`;
-  const showQuote = () => {
-    const p = phase();
-    return p === "quoted" || p === "building" || p === "awaiting-wallet" || p === "submitting" || p === "tracking" || p === "success";
-  };
-  const isExecuting = () => {
-    const p = phase();
-    return p === "building" || p === "awaiting-wallet" || p === "submitting" || p === "tracking";
-  };
-  const state = sm.state;
-  const bestRoute = () => {
-    const s = sm.state();
-    if (s.routes.length === 0) return null;
-    return s.routes.find((r) => r.routeId === s.selectedRouteId) ?? s.routes[0] ?? null;
-  };
+  const quotePreviewRoute = createMemo(() => {
+    const route = bestRoute();
+    if (!route || !store.fromToken() || !store.toToken()) return null;
+    if (phase() === "quoting" || showQuote()) return route;
+    return null;
+  });
   const titleText = createMemo(() => {
     const raw = props.config.titleText?.trim();
     return raw && raw.length > 0 ? raw : "TokenFlight";
@@ -9461,23 +9433,11 @@ function SwapComponent(props) {
     const raw = props.config.titleImageUrl?.trim();
     return raw && raw.length > 0 ? raw : null;
   });
-  const isQuoteLoading = createMemo(() => {
-    const s = sm.state();
-    if (!s.fromToken || !s.toToken) return false;
-    return s.phase === "quoting" && parseFloat(s.inputAmount) > 0 && s.routes.length === 0;
-  });
-  const quotePreviewRoute = createMemo(() => {
-    const s = sm.state();
-    const route = bestRoute();
-    if (!route || !s.fromToken || !s.toToken) return null;
-    if (s.phase === "quoting" || showQuote()) return route;
-    return null;
-  });
   return (() => {
     var _el$ = _tmpl$3$2(), _el$2 = _el$.firstChild;
     insert(_el$, createComponent(Show, {
       get when() {
-        return memo(() => state().phase === "success")() && state().order;
+        return memo(() => phase() === "success")() && store.order();
       },
       get fallback() {
         return createComponent(Show, {
@@ -9595,7 +9555,7 @@ function SwapComponent(props) {
               }), null);
               insert(_el$17, createComponent(AmountInput, {
                 get value() {
-                  return state().inputAmount;
+                  return store.inputAmount();
                 },
                 onChange: handleAmountChange,
                 get disabled() {
@@ -9604,7 +9564,7 @@ function SwapComponent(props) {
               }), null);
               insert(_el$17, createComponent(Show, {
                 get when() {
-                  return state().fromToken;
+                  return store.fromToken();
                 },
                 get fallback() {
                   return (() => {
@@ -9633,21 +9593,21 @@ function SwapComponent(props) {
                   addEventListener(_el$18, "click", () => setSelectorOpen("from"));
                   insert(_el$19, createComponent(TokenIcon, {
                     get symbol() {
-                      return state().fromToken.symbol ?? "?";
+                      return store.fromToken().symbol ?? "?";
                     },
                     color: "#2775CA",
                     size: 24,
                     get logoURI() {
-                      return state().fromToken.logoURI;
+                      return store.fromToken().logoURI;
                     }
                   }), _el$20);
                   insert(_el$20, createComponent(ChainDot, {
                     size: 10,
                     get iconUrl() {
-                      return chainIconUrl(client().baseUrl, state().fromToken.chainId);
+                      return chainIconUrl(client().baseUrl, store.fromToken().chainId);
                     }
                   }));
-                  insert(_el$21, () => state().fromToken.symbol);
+                  insert(_el$21, () => store.fromToken().symbol);
                   insert(_el$22, createComponent(chevron_down_default, {
                     size: 14
                   }));
@@ -9713,7 +9673,7 @@ function SwapComponent(props) {
               insert(_el$30, () => t("swap.youReceive"));
               insert(_el$29, createComponent(Show, {
                 get when() {
-                  return memo(() => !!isConnected())() && state().toToken;
+                  return memo(() => !!isConnected())() && store.toToken();
                 },
                 get children() {
                   var _el$31 = _tmpl$1$2(), _el$32 = _el$31.firstChild;
@@ -9752,17 +9712,17 @@ function SwapComponent(props) {
                   var _el$34 = _tmpl$10$2();
                   insert(_el$34, createComponent(SignificantNumber, {
                     get value() {
-                      return memo(() => !!(showQuote() || state().phase === "quoting"))() ? state().outputAmount || "0" : "0";
+                      return memo(() => !!(showQuote() || phase() === "quoting"))() ? outputAmount() || "0" : "0";
                     },
                     digits: 8
                   }));
-                  createRenderEffect(() => className(_el$34, `${amountStyles.amount} ${!showQuote() && state().phase !== "quoting" ? amountStyles.muted : ""}`));
+                  createRenderEffect(() => className(_el$34, `${amountStyles.amount} ${!showQuote() && phase() !== "quoting" ? amountStyles.muted : ""}`));
                   return _el$34;
                 }
               }), null);
               insert(_el$33, createComponent(Show, {
                 get when() {
-                  return state().toToken;
+                  return store.toToken();
                 },
                 get fallback() {
                   return (() => {
@@ -9791,21 +9751,21 @@ function SwapComponent(props) {
                   addEventListener(_el$35, "click", () => setSelectorOpen("to"));
                   insert(_el$36, createComponent(TokenIcon, {
                     get symbol() {
-                      return state().toToken.symbol ?? "?";
+                      return store.toToken().symbol ?? "?";
                     },
                     color: "#0052FF",
                     size: 24,
                     get logoURI() {
-                      return state().toToken.logoURI;
+                      return store.toToken().logoURI;
                     }
                   }), _el$37);
                   insert(_el$37, createComponent(ChainDot, {
                     size: 10,
                     get iconUrl() {
-                      return chainIconUrl(client().baseUrl, state().toToken.chainId);
+                      return chainIconUrl(client().baseUrl, store.toToken().chainId);
                     }
                   }));
-                  insert(_el$38, () => state().toToken.symbol);
+                  insert(_el$38, () => store.toToken().symbol);
                   insert(_el$39, createComponent(chevron_down_default, {
                     size: 14
                   }));
@@ -9857,7 +9817,7 @@ function SwapComponent(props) {
               }
             }), createComponent(Show, {
               get when() {
-                return memo(() => !!(quotePreviewRoute() && state().fromToken))() && state().toToken;
+                return memo(() => !!(quotePreviewRoute() && store.fromToken()))() && store.toToken();
               },
               get children() {
                 var _el$42 = _tmpl$12$1();
@@ -9866,15 +9826,15 @@ function SwapComponent(props) {
                     return quotePreviewRoute();
                   },
                   get fromToken() {
-                    return state().fromToken;
+                    return store.fromToken();
                   },
                   get toToken() {
-                    return state().toToken;
+                    return store.toToken();
                   },
                   inline: true,
                   countdownSeconds,
                   countdownTotal: QUOTE_REFRESH_SECONDS,
-                  showCountdown: () => state().phase === "quoted"
+                  showCountdown: () => phase() === "quoted"
                 }));
                 createRenderEffect(() => className(_el$42, quoteStyles.quote));
                 return _el$42;
@@ -9903,7 +9863,7 @@ function SwapComponent(props) {
               var _el$46 = _tmpl$14();
               insert(_el$46, createComponent(ActionButton, {
                 get phase() {
-                  return state().phase;
+                  return phase();
                 },
                 get isConnected() {
                   return isConnected();
@@ -9915,10 +9875,10 @@ function SwapComponent(props) {
                 onConfirm: handleConfirm,
                 onRetry: handleRetry,
                 get errorLabel() {
-                  return state().error ?? void 0;
+                  return store.error() ?? void 0;
                 },
                 get needsRecipient() {
-                  return memo(() => !!needRecipient())() && !state().recipient;
+                  return memo(() => !!needRecipient())() && !store.recipient();
                 },
                 onEnterRecipient: () => setRecipientEditorOpen(true),
                 get insufficientBalance() {
@@ -9932,13 +9892,13 @@ function SwapComponent(props) {
           get children() {
             return createComponent(OrderProgress, {
               get order() {
-                return state().order;
+                return store.order();
               },
               get fromToken() {
-                return state().fromToken;
+                return store.fromToken();
               },
               get toToken() {
-                return state().toToken;
+                return store.toToken();
               },
               get providerName() {
                 return trackingProviderName();
@@ -9950,10 +9910,10 @@ function SwapComponent(props) {
                 return props.config.apiEndpoint ?? DEFAULT_API_ENDPOINT;
               },
               get inputAmount() {
-                return state().inputAmount;
+                return store.inputAmount();
               },
               get outputAmount() {
-                return state().outputAmount;
+                return outputAmount();
               },
               onNewSwap: handleNewSwap,
               onRetry: handleRetry,
@@ -9974,13 +9934,13 @@ function SwapComponent(props) {
       get children() {
         return createComponent(TransactionComplete, {
           get order() {
-            return state().order;
+            return store.order();
           },
           get fromToken() {
-            return state().fromToken;
+            return store.fromToken();
           },
           get toToken() {
-            return state().toToken;
+            return store.toToken();
           },
           onNewSwap: handleNewSwap,
           get apiEndpoint() {
@@ -10032,16 +9992,16 @@ function SwapComponent(props) {
     }), null);
     insert(_el$, createComponent(Show, {
       get when() {
-        return memo(() => !!recipientEditorOpen())() && state().toToken;
+        return memo(() => !!recipientEditorOpen())() && store.toToken();
       },
       get children() {
         var _el$4 = _tmpl$2$2();
         insert(_el$4, createComponent(RecipientEditor, {
           get initialValue() {
-            return state().recipient ?? "";
+            return store.recipient() ?? "";
           },
           get chainType() {
-            return getChainType(state().toToken.chainId);
+            return getChainType(store.toToken().chainId);
           },
           onConfirm: (addr) => {
             handleRecipientChange(addr);
@@ -10624,21 +10584,210 @@ function rankPayTokens(balances, targetSymbol, targetChainId, targetAddress, des
     if (!hasEnoughGasOnChain(t2.address, t2.chainId, nativeBalanceByChain)) {
       continue;
     }
-    const tier = getTier(
-      { symbol: t2.symbol, chainId: t2.chainId },
-      { symbol: targetSymbol, chainId: targetChainId }
-    );
-    candidates.push({
-      token: t2,
-      tier,
-      gasCostScore: getChainGasCostScore(t2.chainId)
+    const tier = getTier(
+      { symbol: t2.symbol, chainId: t2.chainId },
+      { symbol: targetSymbol, chainId: targetChainId }
+    );
+    candidates.push({
+      token: t2,
+      tier,
+      gasCostScore: getChainGasCostScore(t2.chainId)
+    });
+  }
+  candidates.sort((a, b) => {
+    if (a.tier !== b.tier) return a.tier - b.tier;
+    return a.gasCostScore - b.gasCostScore;
+  });
+  return candidates.map((c) => c.token);
+}
+function isSameToken$1(a, b) {
+  return a.chainId === b.chainId && a.address.toLowerCase() === b.address.toLowerCase();
+}
+function useReceiveExecution(params) {
+  const [trackingOrderId, setTrackingOrderId] = createSignal(
+    null
+  );
+  const [trackingProviderName, setTrackingProviderName] = createSignal(null);
+  const [trackingProviderIcon, setTrackingProviderIcon] = createSignal(null);
+  const [trackingInputAmount, setTrackingInputAmount] = createSignal(null);
+  const [executionError, setExecutionError] = createSignal(null);
+  const handleConfirm = async () => {
+    const selectedToken = params.selectedPayToken();
+    const selected2 = selectedToken ? params.payTokenQuotes().find((quote2) => isSameToken$1(quote2.token, selectedToken)) : null;
+    const addr = params.walletAddress();
+    if (!selected2 || !params.client() || !params.walletAdapter() || !addr)
+      return;
+    if (params.needRecipient() && !params.recipient()) {
+      params.setError("Recipient address is required for cross-chain swaps");
+      params.setErrorCode(ErrorCode.INVALID_CONFIG);
+      return;
+    }
+    const validBefore = selected2.route.quote.validBefore;
+    if (validBefore && Date.now() / 1e3 > validBefore) {
+      params.setLoadingQuotes(true);
+      try {
+        const target2 = params.targetToken();
+        if (!target2 || typeof target2.decimals !== "number") return;
+        const baseAmount = toBaseUnits(params.configAmount(), target2.decimals);
+        const refreshed = await params.fetchSingleQuote(
+          params.client(),
+          selected2.token,
+          baseAmount,
+          addr,
+          target2,
+          params.recipient()
+        );
+        if (refreshed) {
+          const updated = [...params.payTokenQuotes()];
+          const existingIdx = updated.findIndex(
+            (quote2) => isSameToken$1(quote2.token, selected2.token)
+          );
+          if (existingIdx >= 0) {
+            updated[existingIdx] = refreshed;
+          } else {
+            updated.push(refreshed);
+          }
+          params.setPayTokenQuotes(updated);
+        } else {
+          params.setError("Quote expired and could not be refreshed");
+          params.setErrorCode(ErrorCode.QUOTE_EXPIRED);
+          return;
+        }
+      } catch {
+        params.setError("Quote expired and could not be refreshed");
+        params.setErrorCode(ErrorCode.QUOTE_EXPIRED);
+        return;
+      } finally {
+        params.setLoadingQuotes(false);
+      }
+    }
+    const confirmedToken = params.selectedPayToken();
+    const confirmedQuote = confirmedToken ? params.payTokenQuotes().find((quote2) => isSameToken$1(quote2.token, confirmedToken)) : null;
+    if (!confirmedQuote) return;
+    params.setFromToken({
+      chainId: confirmedQuote.token.chainId,
+      address: confirmedQuote.token.address,
+      symbol: confirmedQuote.token.symbol,
+      name: confirmedQuote.token.name,
+      decimals: confirmedQuote.token.decimals,
+      logoURI: confirmedQuote.token.logoURI
+    });
+    setTrackingProviderName(confirmedQuote.route.routeId ?? null);
+    const apiBase = params.apiEndpoint() ?? DEFAULT_API_ENDPOINT;
+    setTrackingProviderIcon(
+      confirmedQuote.route.icon ? `${apiBase}${confirmedQuote.route.icon}` : null
+    );
+    setTrackingInputAmount(
+      toDisplayAmount(
+        confirmedQuote.route.quote.amountIn,
+        confirmedQuote.token.decimals
+      )
+    );
+    setExecutionError(null);
+    params.setExecPhase("building");
+    try {
+      const depositData = await params.client().buildDeposit({
+        from: addr,
+        quoteId: confirmedQuote.quoteId,
+        routeId: confirmedQuote.route.routeId
+      });
+      params.setExecPhase("awaiting-wallet");
+      let txHash;
+      if (depositData.kind === "CONTRACT_CALL" && depositData.approvals) {
+        for (const approval of depositData.approvals) {
+          if (approval.type === "eip1193_request") {
+            const result = await params.walletAdapter().executeWalletAction({
+              type: "eip1193_request",
+              chainId: confirmedQuote.token.chainId,
+              method: approval.request.method,
+              params: approval.request.params
+            });
+            if (!result.success) {
+              throw new TokenFlightError(
+                ErrorCode.WALLET_ACTION_FAILED,
+                result.error ?? "Wallet action failed"
+              );
+            }
+            if (approval.deposit) txHash = result.txHash ?? txHash;
+          } else if (approval.type === "solana_sendTransaction") {
+            const result = await params.walletAdapter().executeWalletAction({
+              type: "solana_signAndSendTransaction",
+              transaction: approval.transaction
+            });
+            if (!result.success) {
+              throw new TokenFlightError(
+                ErrorCode.WALLET_ACTION_FAILED,
+                result.error ?? "Wallet action failed"
+              );
+            }
+            if (approval.deposit) txHash = result.txHash ?? txHash;
+          }
+        }
+      }
+      if (!txHash) {
+        throw new TokenFlightError(
+          ErrorCode.TRANSACTION_FAILED,
+          "No deposit transaction hash received"
+        );
+      }
+      params.setExecPhase("submitting");
+      const submitResult = await params.client().submitDeposit({
+        quoteId: confirmedQuote.quoteId,
+        routeId: confirmedQuote.route.routeId,
+        txHash
+      });
+      params.setExecPhase("tracking");
+      setTrackingOrderId(submitResult.orderId);
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : typeof err === "string" ? err : "Transaction failed";
+      setExecutionError(errorMsg);
+      if (err instanceof TokenFlightError) {
+        params.callbacks()?.onSwapError?.({
+          code: err.code,
+          message: err.message,
+          details: err.details
+        });
+      } else {
+        params.callbacks()?.onSwapError?.({
+          code: ErrorCode.TRANSACTION_FAILED,
+          message: String(err)
+        });
+      }
+    }
+  };
+  const handleRetry = () => {
+    batch(() => {
+      setExecutionError(null);
+      params.setExecPhase(null);
+      params.storeClearError();
+      params.setPayTokenQuotes([]);
     });
-  }
-  candidates.sort((a, b) => {
-    if (a.tier !== b.tier) return a.tier - b.tier;
-    return a.gasCostScore - b.gasCostScore;
-  });
-  return candidates.map((c) => c.token);
+    params.onRetry?.();
+  };
+  const handleNewSwap = () => {
+    batch(() => {
+      params.storeReset();
+      setTrackingOrderId(null);
+      setTrackingProviderName(null);
+      setTrackingProviderIcon(null);
+      setTrackingInputAmount(null);
+      setExecutionError(null);
+      params.setPayTokenQuotes([]);
+    });
+    queryClient.removeQueries({ queryKey: ["quote", params.client().baseUrl] });
+    queryClient.removeQueries({ queryKey: ["order", params.client().baseUrl] });
+    params.onReset?.();
+  };
+  return {
+    trackingOrderId,
+    trackingProviderName,
+    trackingProviderIcon,
+    trackingInputAmount,
+    executionError,
+    handleConfirm,
+    handleRetry,
+    handleNewSwap
+  };
 }
 const header = "tf-9b71d6";
 const section = "tf-4c9136";
@@ -10661,24 +10810,40 @@ const styles = {
   fiat
 };
 var _tmpl$$1 = /* @__PURE__ */ template(`<div data-testid=selector-overlay>`), _tmpl$2 = /* @__PURE__ */ template(`<div>`), _tmpl$3 = /* @__PURE__ */ template(`<div part=container><div part=accent-line data-testid=accent-line>`), _tmpl$4 = /* @__PURE__ */ template(`<img width=22 height=22>`), _tmpl$5 = /* @__PURE__ */ template(`<button part=wallet-info><div data-testid=wallet-dot></div><span data-testid=wallet-address>`), _tmpl$6 = /* @__PURE__ */ template(`<div part=header><div><span data-testid=header-title>`), _tmpl$7 = /* @__PURE__ */ template(`<button part=recipient-badge data-testid=recipient-badge><span>`), _tmpl$8 = /* @__PURE__ */ template(`<div><div data-testid=receive-section-label style=display:flex;justify-content:space-between;align-items:center><span></span></div><div part=target-token><div data-testid=receive-target-icon></div><span data-testid=receive-amount></span><span data-testid=receive-symbol></span><span>`), _tmpl$9 = /* @__PURE__ */ template(`<div style="padding:0 20px"><div>`), _tmpl$0 = /* @__PURE__ */ template(`<div part=price-preview data-testid=quote>`), _tmpl$1 = /* @__PURE__ */ template(`<div part=cta-wrapper>`), _tmpl$10 = /* @__PURE__ */ template(`<span>Flight`), _tmpl$11 = /* @__PURE__ */ template(`<div style="padding:0 20px"><div><div><div></div><div><div></div><div></div></div></div><div><div></div><div>`), _tmpl$12 = /* @__PURE__ */ template(`<div part=no-offer><div><svg width=28 height=28 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round><circle cx=11 cy=11 r=8></circle><path d="m21 21-4.35-4.35"></path><path d="M8 11h6"></path></svg></div><span>`);
+function normalizeTokenAddress(address) {
+  if (isNativeToken(address) && (address.startsWith("0x") || address.startsWith("0X"))) {
+    return "0x0000000000000000000000000000000000000000";
+  }
+  return address.toLowerCase();
+}
 function isSameToken(a, b) {
-  return a.chainId === b.chainId && a.address.toLowerCase() === b.address.toLowerCase();
+  return a.chainId === b.chainId && normalizeTokenAddress(a.address) === normalizeTokenAddress(b.address);
 }
 function ReceiveComponent(props) {
-  const sm = createReceiveStateMachine();
+  const store = createReceiveStore();
   const [selectedPayIndex, setSelectedPayIndex] = createSignal(0);
   const [payTokenSelectorOpen, setPayTokenSelectorOpen] = createSignal(false);
   const [selectorOpen, setSelectorOpen] = createSignal(false);
-  const [isConnected, setIsConnected] = createSignal(false);
-  const [walletAddress2, setWalletAddress] = createSignal(null);
   const [payTokenQuotes, setPayTokenQuotes] = createSignal([]);
   const [loadingQuotes, setLoadingQuotes] = createSignal(false);
-  const [trackingOrderId, setTrackingOrderId] = createSignal(null);
-  const [trackingProviderName, setTrackingProviderName] = createSignal(null);
-  const [trackingProviderIcon, setTrackingProviderIcon] = createSignal(null);
-  const [trackingInputAmount, setTrackingInputAmount] = createSignal(null);
-  const [executionError, setExecutionError] = createSignal(null);
   const [selectedPayToken, setSelectedPayToken] = createSignal(null);
+  const {
+    isConnected,
+    walletAddress: walletAddress2,
+    handleConnect
+  } = useWalletConnection({
+    walletAdapter: () => props.walletAdapter,
+    callbacks: () => props.callbacks,
+    onAddressChange: (addr) => store.setWalletAddress(addr),
+    onDisconnect: () => {
+      setPayTokenQuotes([]);
+      setSelectedPayToken(null);
+    },
+    onConnectError: (msg, code) => {
+      store.setError(msg);
+      store.setErrorCode(code);
+    }
+  });
   const client = createMemo(() => {
     const endpoint = props.config.apiEndpoint ?? DEFAULT_API_ENDPOINT;
     return new HyperstreamApi({
@@ -10686,79 +10851,35 @@ function ReceiveComponent(props) {
     });
   });
   const apiBase = () => client().baseUrl;
-  const targetToken = createMemo(() => sm.state().targetToken);
-  const phase = createMemo(() => sm.state().phase);
+  const phase = createMemo(() => deriveReceivePhase(store.execPhase(), store.error(), loadingQuotes(), payTokenQuotes().length));
+  const isExecuting = createMemo(() => {
+    const p = phase();
+    return p === "building" || p === "awaiting-wallet" || p === "submitting" || p === "tracking";
+  });
   const [recipientEditorOpen, setRecipientEditorOpen] = createSignal(false);
-  const recipientR = createMemo(() => sm.state().recipient);
   const recipientLocked = createMemo(() => !!props.config.recipient);
-  const needRecipient = createMemo(() => {
-    const target2 = targetToken();
-    const from = selectedPayToken();
-    if (!target2 || !from || !isConnected()) return false;
-    return isCrossChainSwap(from.chainId, target2.chainId);
-  });
-  const recipientDisplay = createMemo(() => {
-    const r = recipientR();
-    if (r) return r;
-    if (isConnected() && walletAddress2() && !needRecipient()) return walletAddress2();
-    return null;
+  const {
+    needRecipient,
+    recipientDisplay,
+    handleRecipientChange
+  } = useRecipient({
+    fromToken: selectedPayToken,
+    toToken: store.targetToken,
+    recipient: store.recipient,
+    isConnected,
+    walletAddress: walletAddress2,
+    walletAdapter: () => props.walletAdapter,
+    setRecipient: store.setRecipient
   });
-  const handleRecipientChange = (value2) => {
-    const trimmed = value2.trim() || null;
-    sm.setRecipient(trimmed);
-  };
   const balancesQuery = createTokenBalancesQuery(client, walletAddress2, () => isConnected() && !!walletAddress2(), () => props.walletAdapter?.supportedChainIds);
-  const orderQuery = createOrderQuery(client, walletAddress2, trackingOrderId, () => phase() === "tracking" && !!trackingOrderId());
-  createEffect(on(() => orderQuery.data, (order) => {
-    if (!order || phase() !== "tracking") return;
-    sm.setOrder(order);
-    if (order.status === "failed" || order.status === "refunded") {
-      queryClient.invalidateQueries({
-        queryKey: ["tokenBalances", client().baseUrl]
-      });
-      props.callbacks?.onSwapError?.({
-        code: ErrorCode.ORDER_FAILED,
-        message: "Order " + order.status
-      });
-      return;
-    }
-    if (order.status === "filled") {
-      sm.transition("success");
-      queryClient.invalidateQueries({
-        queryKey: ["tokenBalances", client().baseUrl]
-      });
-      const selected2 = selectedPayToken();
-      props.callbacks?.onSwapSuccess?.({
-        orderId: order.id,
-        fromToken: selected2?.symbol ?? "",
-        toToken: sm.state().targetToken?.symbol ?? "",
-        fromAmount: order.srcAmount,
-        toAmount: order.destAmount,
-        txHash: order.depositTxHash
-      });
-    }
-  }));
   onMount(() => {
     if (props.config.locale) {
       setLocale(props.config.locale);
     }
     if (props.config.recipient) {
-      sm.setRecipient(props.config.recipient);
+      store.setRecipient(props.config.recipient);
     }
   });
-  createEffect(on(needRecipient, (need) => {
-    if (need && !sm.state().recipient && props.walletAdapter) {
-      const target2 = sm.state().targetToken;
-      if (!target2) return;
-      const targetChainType = getChainType(target2.chainId);
-      props.walletAdapter.getAddress(targetChainType).then((addr) => {
-        if (addr && isAddressForChainType(addr, targetChainType) && !sm.state().recipient && needRecipient()) {
-          sm.setRecipient(addr);
-        }
-      }).catch(() => {
-      });
-    }
-  }));
   const chainsQuery = createChainsQuery(client, () => true);
   const chainMap = createMemo(() => {
     const data = chainsQuery.data;
@@ -10768,18 +10889,20 @@ function ReceiveComponent(props) {
     const c = client();
     const amount2 = Number(props.config.amount);
     if (!Number.isFinite(amount2) || amount2 <= 0) {
-      sm.setError("Invalid amount: must be greater than zero", ErrorCode.INVALID_AMOUNT);
+      store.setError("Invalid amount: must be greater than zero");
+      store.setErrorCode(ErrorCode.INVALID_AMOUNT);
       return;
     }
     try {
       const target2 = parseTokenIdentifier(props.config.target);
       const resolved = await resolveToken(target2.chainId, target2.address, props.config.apiEndpoint, c);
       if (typeof resolved.decimals !== "number") {
-        sm.setError("Failed to resolve target token metadata", ErrorCode.INVALID_CONFIG);
+        store.setError("Failed to resolve target token metadata");
+        store.setErrorCode(ErrorCode.INVALID_CONFIG);
         return;
       }
-      sm.setTargetToken(resolved);
-      sm.setTargetAmount(props.config.amount);
+      store.setTargetToken(resolved);
+      store.setTargetAmount(props.config.amount);
       if (props.config.fromToken) {
         try {
           const fromTarget = parseTokenIdentifier(props.config.fromToken);
@@ -10809,60 +10932,13 @@ function ReceiveComponent(props) {
         }
       }
     } catch (err) {
-      sm.setError(err instanceof Error ? err.message : "Failed to resolve target token", ErrorCode.INVALID_CONFIG);
-    }
-  });
-  const detectChainType = () => {
-    if (!props.walletAdapter) return "evm";
-    return props.walletAdapter.supportedActionTypes.some((t2) => t2.startsWith("solana_")) ? "solana" : "evm";
-  };
-  onMount(async () => {
-    if (props.walletAdapter) {
-      const connected = props.walletAdapter.isConnected();
-      setIsConnected(connected);
-      if (connected) {
-        const addr = await props.walletAdapter.getAddress();
-        setWalletAddress(addr);
-        sm.setWalletAddress(addr);
-        props.callbacks?.onWalletConnected?.({
-          address: addr ?? "",
-          chainType: detectChainType()
-        });
-      }
-      const handleWalletConnect = async () => {
-        const addr = await props.walletAdapter.getAddress();
-        if (isConnected() && walletAddress2() === addr) return;
-        batch(() => {
-          setIsConnected(true);
-          setWalletAddress(addr);
-          sm.setWalletAddress(addr);
-        });
-        props.callbacks?.onWalletConnected?.({
-          address: addr ?? "",
-          chainType: detectChainType()
-        });
-      };
-      const handleWalletDisconnect = () => {
-        if (!isConnected()) return;
-        batch(() => {
-          setIsConnected(false);
-          setWalletAddress(null);
-          sm.setWalletAddress(null);
-        });
-        setPayTokenQuotes([]);
-        setSelectedPayToken(null);
-      };
-      props.walletAdapter.on("connect", handleWalletConnect);
-      props.walletAdapter.on("disconnect", handleWalletDisconnect);
-      onCleanup(() => {
-        props.walletAdapter.off("connect", handleWalletConnect);
-        props.walletAdapter.off("disconnect", handleWalletDisconnect);
-      });
+      store.setError(err instanceof Error ? err.message : "Failed to resolve target token");
+      store.setErrorCode(ErrorCode.INVALID_CONFIG);
     }
   });
   const balancePayTokens = createMemo(() => {
     const data = balancesQuery.data;
-    const target2 = targetToken();
+    const target2 = store.targetToken();
     if (!data || data.length === 0 || !target2) return [];
     const supported = props.walletAdapter?.supportedChainIds;
     const filtered = supported?.length ? data.filter((t2) => supported.includes(t2.chainId)) : data;
@@ -10872,7 +10948,7 @@ function ReceiveComponent(props) {
     return rankPayTokens(filtered, target2.symbol ?? "", target2.chainId, target2.address, desiredUsdAmount > 0 ? desiredUsdAmount : void 0);
   });
   createEffect(on(balancePayTokens, (tokens) => {
-    const p = sm.state().phase;
+    const p = phase();
     if (tokens.length > 0 && (p === "idle" || p === "error")) {
       fetchPayTokenQuotes(tokens);
     }
@@ -10880,9 +10956,9 @@ function ReceiveComponent(props) {
   const selectedQuoteRequest = createMemo(() => {
     const token = selectedPayToken();
     if (!token) return null;
-    const target2 = targetToken();
+    const target2 = store.targetToken();
     const addr = walletAddress2();
-    const recipient = sm.state().recipient;
+    const recipient = store.recipient();
     if (!target2 || typeof target2.decimals !== "number" || !addr) return null;
     if (needRecipient() && !recipient) return null;
     return {
@@ -10925,25 +11001,15 @@ function ReceiveComponent(props) {
       }
     }
   }));
-  const [countdownSeconds, setCountdownSeconds] = createSignal(QUOTE_REFRESH_SECONDS);
-  createEffect(() => {
-    if (phase() !== "quoted") {
-      setCountdownSeconds(QUOTE_REFRESH_SECONDS);
-      return;
+  const {
+    countdownSeconds
+  } = useQuoteCountdown({
+    phase,
+    onExpired: () => {
+      selectedQuoteQuery.refetch();
     }
-    setCountdownSeconds(QUOTE_REFRESH_SECONDS);
-    const timer = setInterval(() => {
-      setCountdownSeconds((prev) => {
-        if (prev <= 1) {
-          selectedQuoteQuery.refetch();
-          return QUOTE_REFRESH_SECONDS;
-        }
-        return prev - 1;
-      });
-    }, 1e3);
-    onCleanup(() => clearInterval(timer));
   });
-  const fetchSingleQuote = async (c, payToken, baseAmount, addr, target2, recipient) => {
+  const fetchSingleQuote = async (c, payToken, baseAmount, addr, target2, recipient, signal) => {
     try {
       const request = {
         tradeType: "EXACT_OUTPUT",
@@ -10957,9 +11023,11 @@ function ReceiveComponent(props) {
           recipient
         }
       };
-      const quoteResp = await queryClient.ensureQueryData({
+      const quoteResp = await queryClient.fetchQuery({
         queryKey: ["quote", c.baseUrl, request],
-        queryFn: () => c.getQuotes(request),
+        queryFn: ({
+          signal: querySignal
+        }) => c.getQuotes(request, signal ?? querySignal),
         staleTime: 15e3
       });
       if (quoteResp.routes.length > 0) {
@@ -10982,13 +11050,10 @@ function ReceiveComponent(props) {
   const fetchPayTokenQuotes = async (tokensToQuote) => {
     const c = client();
     const addr = walletAddress2();
-    const target2 = sm.state().targetToken;
+    const target2 = store.targetToken();
     if (!c || !addr || !target2 || typeof target2.decimals !== "number" || tokensToQuote.length === 0) return;
-    const phase2 = sm.state().phase;
-    if (phase2 === "idle" || phase2 === "quoted" || phase2 === "error") {
-      if (phase2 === "error") sm.transition("idle");
-      sm.transition("quoting");
-    }
+    if (payTokenQuotes().length > 0) setPayTokenQuotes([]);
+    if (store.error()) store.clearError();
     setLoadingQuotes(true);
     fetchAbortController?.abort();
     const abortController = new AbortController();
@@ -11000,7 +11065,7 @@ function ReceiveComponent(props) {
       const orderedTokens = preferredToken ? [preferredToken, ...tokensToQuote.filter((token) => !isSameToken(token, preferredToken))] : tokensToQuote;
       for (const payToken of orderedTokens) {
         if (abortController.signal.aborted) return;
-        const quote2 = await fetchSingleQuote(c, payToken, baseAmount, addr, target2, sm.state().recipient);
+        const quote2 = await fetchSingleQuote(c, payToken, baseAmount, addr, target2, store.recipient(), abortController.signal);
         if (abortController.signal.aborted) return;
         if (quote2) {
           setPayTokenQuotes([quote2]);
@@ -11008,18 +11073,13 @@ function ReceiveComponent(props) {
           setSelectedPayIndex(index >= 0 ? index : 0);
           setSelectedPayToken(payToken);
           setLoadingQuotes(false);
-          sm.transition("quoted");
           return;
         }
       }
       if (!abortController.signal.aborted) {
         setPayTokenQuotes([]);
-        sm.transition("idle");
       }
     } catch {
-      if (!abortController.signal.aborted) {
-        sm.transition("idle");
-      }
     } finally {
       setLoadingQuotes(false);
     }
@@ -11030,7 +11090,7 @@ function ReceiveComponent(props) {
   const paymentTokens = createMemo(() => {
     const tokens = balancePayTokens();
     const quotes = payTokenQuotes();
-    const target2 = targetToken();
+    const target2 = store.targetToken();
     const chains = chainMap();
     if (tokens.length === 0 || !target2) return [];
     const quoteMap = /* @__PURE__ */ new Map();
@@ -11110,13 +11170,81 @@ function ReceiveComponent(props) {
       logoURI: q.token.logoURI
     };
   });
+  const {
+    trackingOrderId,
+    trackingProviderName,
+    trackingProviderIcon,
+    trackingInputAmount,
+    executionError,
+    handleConfirm,
+    handleRetry,
+    handleNewSwap
+  } = useReceiveExecution({
+    client,
+    walletAdapter: () => props.walletAdapter,
+    callbacks: () => props.callbacks,
+    apiEndpoint: () => props.config.apiEndpoint,
+    recipient: store.recipient,
+    needRecipient,
+    walletAddress: walletAddress2,
+    targetToken: store.targetToken,
+    selectedPayToken,
+    payTokenQuotes,
+    setPayTokenQuotes,
+    setLoadingQuotes,
+    fetchSingleQuote,
+    configAmount: () => props.config.amount,
+    setExecPhase: store.setExecPhase,
+    setFromToken: store.setFromToken,
+    setError: store.setError,
+    setErrorCode: store.setErrorCode,
+    storeReset: store.reset,
+    storeClearError: store.clearError,
+    onRetry: () => {
+      setSelectedPayToken(null);
+      const tokens = balancePayTokens();
+      if (tokens.length > 0) fetchPayTokenQuotes(tokens);
+    },
+    onReset: () => {
+      setSelectedPayIndex(0);
+      setSelectedPayToken(null);
+      const tokens = balancePayTokens();
+      if (tokens.length > 0) fetchPayTokenQuotes(tokens);
+    }
+  });
+  useOrderTracking({
+    client,
+    walletAddress: walletAddress2,
+    trackingOrderId,
+    phase,
+    execPhase: store.execPhase,
+    setOrder: store.setOrder,
+    setExecPhase: store.setExecPhase,
+    onOrderFilled: (order) => {
+      const selected2 = selectedPayToken();
+      props.callbacks?.onSwapSuccess?.({
+        orderId: order.id,
+        fromToken: selected2?.symbol ?? "",
+        toToken: store.targetToken()?.symbol ?? "",
+        fromAmount: order.srcAmount,
+        toAmount: order.destAmount,
+        txHash: order.depositTxHash
+      });
+    },
+    onOrderFailed: (order) => {
+      props.callbacks?.onSwapError?.({
+        code: ErrorCode.ORDER_FAILED,
+        message: "Order " + order.status
+      });
+    }
+  });
   const refreshSinglePayTokenQuote = async (payToken) => {
     const c = client();
     const addr = walletAddress2();
-    const target2 = sm.state().targetToken;
+    const target2 = store.targetToken();
     if (!c || !addr || !target2 || typeof target2.decimals !== "number") return;
     const baseAmount = toBaseUnits(props.config.amount, target2.decimals);
-    const quote2 = await fetchSingleQuote(c, payToken, baseAmount, addr, target2, sm.state().recipient);
+    const quote2 = await fetchSingleQuote(c, payToken, baseAmount, addr, target2, store.recipient());
     if (quote2) {
       const existing = payTokenQuotes();
       const updated = [...existing];
@@ -11127,10 +11255,6 @@ function ReceiveComponent(props) {
         updated.push(quote2);
       }
       setPayTokenQuotes(updated);
-      if (sm.state().phase === "idle" || sm.state().phase === "quoting") {
-        if (sm.state().phase === "idle") sm.transition("quoting");
-        sm.transition("quoted");
-      }
     }
   };
   const handlePayTokenSelect = (index) => {
@@ -11143,24 +11267,12 @@ function ReceiveComponent(props) {
       void refreshSinglePayTokenQuote(payToken);
     }
   };
-  const handleConnect = async () => {
-    if (!props.walletAdapter) {
-      console.warn("[TokenFlight] No wallet adapter configured. Pass a walletAdapter to enable wallet connection.\nSee: https://embed.tokenflight.ai/guides/wallet-adapter/");
-      props.callbacks?.onConnectWallet?.();
-      return;
-    }
-    try {
-      await props.walletAdapter.connect();
-    } catch {
-      sm.setError("Failed to connect wallet", ErrorCode.WALLET_CONNECTION_FAILED);
-    }
-  };
   const handleTokenSelect = async (token) => {
     setSelectorOpen(false);
     setPayTokenSelectorOpen(false);
     const c = client();
     const addr = walletAddress2();
-    const target2 = sm.state().targetToken;
+    const target2 = store.targetToken();
     if (!c || !addr || !target2 || typeof target2.decimals !== "number" || !token.address || typeof token.decimals !== "number") return;
     setLoadingQuotes(true);
     try {
@@ -11176,7 +11288,7 @@ function ReceiveComponent(props) {
           balance: toBaseUnits(token.balance, token.decimals)
         } : void 0
       };
-      const quote2 = await fetchSingleQuote(c, payToken, baseAmount, addr, target2, sm.state().recipient);
+      const quote2 = await fetchSingleQuote(c, payToken, baseAmount, addr, target2, store.recipient());
       if (quote2) {
         const existing = payTokenQuotes();
         const idx = existing.findIndex((q) => q.token.address.toLowerCase() === token.address.toLowerCase() && q.token.chainId === token.chainId);
@@ -11193,165 +11305,12 @@ function ReceiveComponent(props) {
         if (rankedIndex >= 0) {
           setSelectedPayIndex(rankedIndex);
         }
-        if (sm.state().phase === "idle" || sm.state().phase === "quoting") {
-          if (sm.state().phase === "idle") sm.transition("quoting");
-          sm.transition("quoted");
-        }
       }
     } catch {
     } finally {
       setLoadingQuotes(false);
     }
   };
-  const handleConfirm = async () => {
-    const selectedToken = selectedPayToken();
-    const selected2 = selectedToken ? payTokenQuotes().find((quote2) => isSameToken(quote2.token, selectedToken)) : null;
-    const addr = walletAddress2();
-    if (!selected2 || !client() || !props.walletAdapter || !addr) return;
-    if (needRecipient() && !sm.state().recipient) {
-      sm.setError("Recipient address is required for cross-chain swaps", ErrorCode.INVALID_CONFIG);
-      return;
-    }
-    const validBefore = selected2.route.quote.validBefore;
-    if (validBefore && Date.now() / 1e3 > validBefore) {
-      setLoadingQuotes(true);
-      try {
-        const target2 = sm.state().targetToken;
-        if (!target2 || typeof target2.decimals !== "number") return;
-        const baseAmount = toBaseUnits(props.config.amount, target2.decimals);
-        const refreshed = await fetchSingleQuote(client(), selected2.token, baseAmount, addr, target2, sm.state().recipient);
-        if (refreshed) {
-          const updated = [...payTokenQuotes()];
-          const existingIdx = updated.findIndex((quote2) => isSameToken(quote2.token, selected2.token));
-          if (existingIdx >= 0) {
-            updated[existingIdx] = refreshed;
-          } else {
-            updated.push(refreshed);
-          }
-          setPayTokenQuotes(updated);
-        } else {
-          sm.setError("Quote expired and could not be refreshed", ErrorCode.QUOTE_EXPIRED);
-          return;
-        }
-      } catch {
-        sm.setError("Quote expired and could not be refreshed", ErrorCode.QUOTE_EXPIRED);
-        return;
-      } finally {
-        setLoadingQuotes(false);
-      }
-    }
-    const confirmedToken = selectedPayToken();
-    const confirmedQuote = confirmedToken ? payTokenQuotes().find((quote2) => isSameToken(quote2.token, confirmedToken)) : null;
-    if (!confirmedQuote) return;
-    sm.setFromToken({
-      chainId: confirmedQuote.token.chainId,
-      address: confirmedQuote.token.address,
-      symbol: confirmedQuote.token.symbol,
-      name: confirmedQuote.token.name,
-      decimals: confirmedQuote.token.decimals,
-      logoURI: confirmedQuote.token.logoURI
-    });
-    setTrackingProviderName(confirmedQuote.route.routeId ?? null);
-    const apiBase2 = props.config.apiEndpoint ?? DEFAULT_API_ENDPOINT;
-    setTrackingProviderIcon(confirmedQuote.route.icon ? `${apiBase2}${confirmedQuote.route.icon}` : null);
-    setTrackingInputAmount(toDisplayAmount(confirmedQuote.route.quote.amountIn, confirmedQuote.token.decimals));
-    setExecutionError(null);
-    sm.transition("building");
-    try {
-      const depositData = await client().buildDeposit({
-        from: addr,
-        quoteId: confirmedQuote.quoteId,
-        routeId: confirmedQuote.route.routeId
-      });
-      sm.transition("awaiting-wallet");
-      let txHash;
-      if (depositData.kind === "CONTRACT_CALL" && depositData.approvals) {
-        for (const approval of depositData.approvals) {
-          if (approval.type === "eip1193_request") {
-            const result = await props.walletAdapter.executeWalletAction({
-              type: "eip1193_request",
-              chainId: confirmedQuote.token.chainId,
-              method: approval.request.method,
-              params: approval.request.params
-            });
-            if (!result.success) {
-              throw new TokenFlightError(ErrorCode.WALLET_ACTION_FAILED, result.error ?? "Wallet action failed");
-            }
-            if (approval.deposit) txHash = result.txHash ?? txHash;
-          } else if (approval.type === "solana_sendTransaction") {
-            const result = await props.walletAdapter.executeWalletAction({
-              type: "solana_signAndSendTransaction",
-              transaction: approval.transaction
-            });
-            if (!result.success) {
-              throw new TokenFlightError(ErrorCode.WALLET_ACTION_FAILED, result.error ?? "Wallet action failed");
-            }
-            if (approval.deposit) txHash = result.txHash ?? txHash;
-          }
-        }
-      }
-      if (!txHash) {
-        throw new TokenFlightError(ErrorCode.TRANSACTION_FAILED, "No deposit transaction hash received");
-      }
-      sm.transition("submitting");
-      const submitResult = await client().submitDeposit({
-        quoteId: confirmedQuote.quoteId,
-        routeId: confirmedQuote.route.routeId,
-        txHash
-      });
-      sm.transition("tracking");
-      setTrackingOrderId(submitResult.orderId);
-    } catch (err) {
-      const errorMsg = err instanceof Error ? err.message : typeof err === "string" ? err : "Transaction failed";
-      setExecutionError(errorMsg);
-      if (err instanceof TokenFlightError) {
-        props.callbacks?.onSwapError?.({
-          code: err.code,
-          message: err.message,
-          details: err.details
-        });
-      } else {
-        props.callbacks?.onSwapError?.({
-          code: ErrorCode.TRANSACTION_FAILED,
-          message: String(err)
-        });
-      }
-    }
-  };
-  const handleRetry = () => {
-    setExecutionError(null);
-    setSelectedPayToken(null);
-    sm.transition("idle");
-    const tokens = balancePayTokens();
-    if (tokens.length > 0) {
-      fetchPayTokenQuotes(tokens);
-    }
-  };
-  const handleNewSwap = () => {
-    sm.clearRoutes();
-    sm.setPaymentAmount("");
-    sm.setFromToken(null);
-    sm.setOrder(null);
-    setSelectedPayIndex(0);
-    setSelectedPayToken(null);
-    setTrackingOrderId(null);
-    setTrackingProviderName(null);
-    setTrackingProviderIcon(null);
-    setTrackingInputAmount(null);
-    setExecutionError(null);
-    setPayTokenQuotes([]);
-    queryClient.removeQueries({
-      queryKey: ["quote", client().baseUrl]
-    });
-    queryClient.removeQueries({
-      queryKey: ["order", client().baseUrl]
-    });
-    sm.transition("idle");
-    const tokens = balancePayTokens();
-    if (tokens.length > 0) {
-      fetchPayTokenQuotes(tokens);
-    }
-  };
   const handleAccountClick = async () => {
     if (props.walletAdapter?.openAccountModal) {
       await props.walletAdapter.openAccountModal();
@@ -11360,13 +11319,8 @@ function ReceiveComponent(props) {
     }
   };
   const truncateAddress = (addr) => `${addr.slice(0, 6)}...${addr.slice(-4)}`;
-  const state = sm.state;
-  const isExecuting = () => {
-    const p = phase();
-    return p === "building" || p === "awaiting-wallet" || p === "submitting" || p === "tracking";
-  };
-  const targetSymbol = () => state().targetToken?.symbol ?? "USDC";
-  const targetAmount = () => state().targetAmount || props.config.amount;
+  const targetSymbol = () => store.targetToken()?.symbol ?? "USDC";
+  const targetAmount = () => store.targetAmount() || props.config.amount;
   const titleText = createMemo(() => {
     const raw = props.config.titleText?.trim();
     return raw && raw.length > 0 ? raw : "TokenFlight";
@@ -11383,7 +11337,7 @@ function ReceiveComponent(props) {
     var _el$ = _tmpl$3(), _el$2 = _el$.firstChild;
     insert(_el$, createComponent(Show, {
       get when() {
-        return memo(() => state().phase === "success")() && state().order;
+        return memo(() => phase() === "success")() && store.order();
       },
       get fallback() {
         return createComponent(Show, {
@@ -11516,19 +11470,19 @@ function ReceiveComponent(props) {
                 color: "#0052FF",
                 size: 32,
                 get logoURI() {
-                  return state().targetToken?.logoURI;
+                  return store.targetToken()?.logoURI;
                 }
               }), null);
               insert(_el$16, createComponent(Show, {
                 get when() {
-                  return state().targetToken?.chainId;
+                  return store.targetToken()?.chainId;
                 },
                 get children() {
                   var _el$17 = _tmpl$2();
                   insert(_el$17, createComponent(ChainDot, {
                     size: 12,
                     get iconUrl() {
-                      return chainIconUrl(apiBase(), state().targetToken.chainId);
+                      return chainIconUrl(apiBase(), store.targetToken().chainId);
                     }
                   }));
                   createRenderEffect(() => className(_el$17, styles.targetChainDot));
@@ -11631,7 +11585,7 @@ function ReceiveComponent(props) {
               }
             }), createComponent(Show, {
               get when() {
-                return memo(() => !!(selectedQuoteRoute() && selectedFromToken()))() && state().targetToken;
+                return memo(() => !!(selectedQuoteRoute() && selectedFromToken()))() && store.targetToken();
               },
               get fallback() {
                 return createComponent(Show, {
@@ -11666,7 +11620,7 @@ function ReceiveComponent(props) {
                     return selectedFromToken();
                   },
                   get toToken() {
-                    return state().targetToken;
+                    return store.targetToken();
                   },
                   inline: true,
                   countdownSeconds,
@@ -11680,7 +11634,7 @@ function ReceiveComponent(props) {
               var _el$24 = _tmpl$1();
               insert(_el$24, createComponent(ActionButton, {
                 get phase() {
-                  return state().phase;
+                  return phase();
                 },
                 get isConnected() {
                   return isConnected();
@@ -11692,7 +11646,7 @@ function ReceiveComponent(props) {
                 onConfirm: handleConfirm,
                 onRetry: handleRetry,
                 get needsRecipient() {
-                  return memo(() => !!needRecipient())() && !sm.state().recipient;
+                  return memo(() => !!needRecipient())() && !store.recipient();
                 },
                 onEnterRecipient: () => setRecipientEditorOpen(true),
                 get label() {
@@ -11709,13 +11663,13 @@ function ReceiveComponent(props) {
           get children() {
             return createComponent(OrderProgress, {
               get order() {
-                return state().order;
+                return store.order();
               },
               get fromToken() {
-                return state().fromToken;
+                return store.fromToken();
               },
               get toToken() {
-                return state().targetToken;
+                return store.targetToken();
               },
               get providerName() {
                 return trackingProviderName();
@@ -11727,10 +11681,10 @@ function ReceiveComponent(props) {
                 return props.config.apiEndpoint ?? DEFAULT_API_ENDPOINT;
               },
               get inputAmount() {
-                return trackingInputAmount() ?? state().paymentAmount;
+                return trackingInputAmount() ?? "";
               },
               get outputAmount() {
-                return state().targetAmount;
+                return store.targetAmount();
               },
               onNewSwap: handleNewSwap,
               mode: "receive",
@@ -11751,13 +11705,13 @@ function ReceiveComponent(props) {
       get children() {
         return createComponent(TransactionComplete, {
           get order() {
-            return state().order;
+            return store.order();
           },
           get fromToken() {
-            return state().fromToken;
+            return store.fromToken();
           },
           get toToken() {
-            return state().targetToken;
+            return store.targetToken();
           },
           onNewSwap: handleNewSwap,
           get apiEndpoint() {
@@ -11807,16 +11761,16 @@ function ReceiveComponent(props) {
     }), null);
     insert(_el$, createComponent(Show, {
       get when() {
-        return memo(() => !!recipientEditorOpen())() && sm.state().targetToken;
+        return memo(() => !!recipientEditorOpen())() && store.targetToken();
       },
       get children() {
         var _el$4 = _tmpl$2();
         insert(_el$4, createComponent(RecipientEditor, {
           get initialValue() {
-            return sm.state().recipient ?? "";
+            return store.recipient() ?? "";
           },
           get chainType() {
-            return getChainType(sm.state().targetToken.chainId);
+            return getChainType(store.targetToken().chainId);
           },
           onConfirm: (addr) => {
             handleRecipientChange(addr);
@@ -11854,8 +11808,8 @@ const css11 = ".tf-c63ac0{border-radius:50%;display:flex;align-items:center;just
 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;font-family:DM Sans,sans-serif;color:var(--tf-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--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:DM Sans,sans-serif;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:JetBrains Mono,monospace}.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:JetBrains Mono,monospace}.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:JetBrains Mono,monospace;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:DM Sans,sans-serif}.tf-4567e1{cursor:default;opacity:.8}.tf-4567e1:hover{background:var(--tf-surface)}.tf-58881e{color:var(--tf-text-tertiary);font-style:italic}";
 const swapCss = [css0, css1$1, css1, css3, css4, css6, css7, css8, css9, css10, css11, css12, css13].join("\n");
-const css2 = "@keyframes tf-540423{to{transform:rotate(360deg)}}.tf-d61a98{padding:0 20px}.tf-4574e9{height:162px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--tf-border) transparent}.tf-4574e9::-webkit-scrollbar{width:4px}.tf-4574e9::-webkit-scrollbar-track{background:transparent}.tf-4574e9::-webkit-scrollbar-thumb{background:var(--tf-border);border-radius:2px}.tf-2f8db2{display:flex;align-items:center;justify-content:space-between;padding:9px 11px;border-radius:11px;margin-bottom:4px;cursor:pointer;border:1px solid var(--tf-border-light);background:transparent;width:100%;font-family:DM Sans,sans-serif;transition:background .15s ease,border-color .15s ease}.tf-aaf1d0{border-color:var(--tf-primary);outline:.5px solid var(--tf-primary);outline-offset:-1px;background:var(--tf-primary-light)}.tf-328e9e{opacity:.4;cursor:not-allowed}.tf-af2c71{cursor:default;pointer-events:none}.tf-d7d776{width:32px;height:32px;border-radius:50%}.tf-c3e864{display:flex;align-items:center;padding:10px 14px;border-radius:12px;border:1px solid var(--tf-border-light);background:var(--tf-input-bg);cursor:default;pointer-events:none}.tf-44450a{display:flex;flex-direction:column;gap:6px}.tf-6c1e97{height:10px}.tf-2174f1{width:52px}.tf-2d3530{width:40px}.tf-2733a9{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.tf-54150b{width:60px}.tf-7aabe1{width:44px}.tf-c41b7c{display:flex;align-items:center;gap:9px}.tf-142024{position:relative}.tf-3b42da{position:absolute;bottom:-1px;right:-1px;width:11px;height:11px;border-radius:50%;background:var(--tf-surface);border:1px solid var(--tf-border);display:flex;align-items:center;justify-content:center}.tf-b7faa4{text-align:left}.tf-1ae7a3{display:flex;align-items:center;gap:5px}.tf-b949b8{font-size:var(--tf-font-base);font-weight:600;color:var(--tf-text)}.tf-2f811b{font-size:var(--tf-font-2xs);font-weight:700;padding:1px 4px;border-radius:3px;background:var(--tf-success-bg);color:var(--tf-success);letter-spacing:.03em}.tf-6542b9{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary)}.tf-e613ff{text-align:right}.tf-630df3{font-size:var(--tf-font-base);font-weight:600;font-family:JetBrains Mono,monospace;color:var(--tf-text)}.tf-0be2ff{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary);font-family:JetBrains Mono,monospace}.tf-dad192{font-size:var(--tf-font-base);font-weight:600;font-family:JetBrains Mono,monospace;color:var(--tf-text)}.tf-840c29{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary);font-family:JetBrains Mono,monospace}.tf-09818b{display:flex;align-items:center;padding:10px 14px;border-radius:12px;border:1px solid var(--tf-border-light);background:var(--tf-input-bg);cursor:pointer;width:100%;font-family:DM Sans,sans-serif;transition:background .15s ease,border-color .15s ease}.tf-09818b:hover{border-color:var(--tf-primary);background:var(--tf-primary-light)}.tf-c7ba0f{display:flex;align-items:center;gap:9px}.tf-dea0cb{text-align:left}.tf-41931a{display:flex;align-items:center;gap:5px}.tf-3d2f5a{margin-left:auto;text-align:right;margin-right:8px}.tf-9a379d{font-size:var(--tf-font-lg);font-weight:500;font-family:JetBrains Mono,monospace;color:var(--tf-text);letter-spacing:-.02em}.tf-c11354{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary);font-family:JetBrains Mono,monospace}.tf-864468{color:var(--tf-text-tertiary);display:flex;align-items:center;flex-shrink:0;transition:transform .2s ease}.tf-8299cf{flex:1;overflow-y:auto;padding:0 8px 8px;scrollbar-width:thin;scrollbar-color:var(--tf-border) transparent}.tf-176d77{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:DM Sans,sans-serif;color:var(--tf-text)}.tf-176d77:hover{background:var(--tf-surface-hover)}.tf-2df5d9{background:var(--tf-primary-light)}.tf-dc503e{opacity:.4;cursor:not-allowed}.tf-ebbc44{display:flex;align-items:center;gap:12px}.tf-5f455f{text-align:left}.tf-15ee78{display:flex;align-items:center;gap:6px}.tf-976d83{font-size:var(--tf-font-lg);font-weight:600;color:var(--tf-text)}.tf-ba2eec{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary)}.tf-a37921{text-align:right}.tf-cf71b6{font-size:var(--tf-font-md);font-weight:600;font-family:JetBrains Mono,monospace;color:var(--tf-text)}.tf-7474a9{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-family:JetBrains Mono,monospace}.tf-772a9c{flex-shrink:0;padding:4px 8px 12px;border-top:1px solid var(--tf-border-light)}.tf-5fb6ad{display:flex;flex-direction:column;align-items:center;justify-content:center;height:197px;gap:8px;padding:16px 20px}.tf-86e8e0{flex-direction:row;gap:10px}.tf-66007c{color:var(--tf-text-tertiary);opacity:.5}.tf-73bbbc{width:24px;height:24px;display:flex;align-items:center;justify-content:center;opacity:.6;color:var(--tf-primary);animation:tf-540423 1s linear infinite}.tf-12c6bb{font-size:var(--tf-font-md);font-weight:600;color:var(--tf-text-secondary)}.tf-7a8fe0{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);text-align:center;line-height:1.4}.tf-22f94f{display:flex;align-items:center;justify-content:center;gap:4px;padding:4px 0 2px;font-size:var(--tf-font-sm);color:var(--tf-primary);cursor:pointer;font-weight:500;background:none;border:none;width:100%;font-family:DM Sans,sans-serif}";
-const css5 = ".tf-9b71d6{padding:16px 20px 12px;display:flex;justify-content:space-between;align-items:center;gap:7px}.tf-4c9136{padding:0 20px 10px}.tf-febe61{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-weight:500;margin-bottom:6px;text-align:left}.tf-a27aab{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--tf-input-bg);border-radius:12px;border:1px solid var(--tf-border-light)}.tf-f0b3f5{position:relative;flex-shrink:0}.tf-7a6fbc{position:absolute;bottom:-1px;right:-1px;width:12px;height:12px}.tf-e9e9a1{font-size:var(--tf-font-amount-sm);font-weight:700;letter-spacing:-.02em}.tf-f3baad{font-size:var(--tf-font-lg);font-weight:500;color:var(--tf-text-secondary)}.tf-0131e4{margin-left:auto;font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-family:JetBrains Mono,monospace}";
+const css2 = "@keyframes tf-540423{to{transform:rotate(360deg)}}.tf-d61a98{padding:0 20px}.tf-4574e9{height:162px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--tf-border) transparent}.tf-4574e9::-webkit-scrollbar{width:4px}.tf-4574e9::-webkit-scrollbar-track{background:transparent}.tf-4574e9::-webkit-scrollbar-thumb{background:var(--tf-border);border-radius:2px}.tf-2f8db2{display:flex;align-items:center;justify-content:space-between;padding:9px 11px;border-radius:11px;margin-bottom:4px;cursor:pointer;border:1px solid var(--tf-border-light);background:transparent;width:100%;font-family:DM Sans,sans-serif;transition:background .15s ease,border-color .15s ease}.tf-aaf1d0{border-color:var(--tf-primary);outline:.5px solid var(--tf-primary);outline-offset:-1px;background:var(--tf-primary-light)}.tf-328e9e{opacity:.4;cursor:not-allowed}.tf-af2c71{cursor:default;pointer-events:none}.tf-d7d776{width:32px;height:32px;border-radius:50%}.tf-c3e864{display:flex;align-items:center;padding:11px 14px;border-radius:12px;border:1px solid var(--tf-border-light);background:var(--tf-input-bg);cursor:default;pointer-events:none}.tf-44450a{display:flex;flex-direction:column;gap:6px}.tf-6c1e97{height:10px}.tf-2174f1{width:52px}.tf-2d3530{width:40px}.tf-2733a9{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.tf-54150b{width:60px}.tf-7aabe1{width:44px}.tf-c41b7c{display:flex;align-items:center;gap:9px}.tf-142024{position:relative}.tf-3b42da{position:absolute;bottom:-1px;right:-1px;width:11px;height:11px;border-radius:50%;background:var(--tf-surface);border:1px solid var(--tf-border);display:flex;align-items:center;justify-content:center}.tf-b7faa4{text-align:left}.tf-1ae7a3{display:flex;align-items:center;gap:5px}.tf-b949b8{font-size:var(--tf-font-base);font-weight:600;color:var(--tf-text)}.tf-2f811b{font-size:var(--tf-font-2xs);font-weight:700;padding:1px 4px;border-radius:3px;background:var(--tf-success-bg);color:var(--tf-success);letter-spacing:.03em}.tf-6542b9{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary)}.tf-e613ff{text-align:right}.tf-630df3{font-size:var(--tf-font-base);font-weight:600;font-family:JetBrains Mono,monospace;color:var(--tf-text)}.tf-0be2ff{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary);font-family:JetBrains Mono,monospace}.tf-dad192{font-size:var(--tf-font-base);font-weight:600;font-family:JetBrains Mono,monospace;color:var(--tf-text)}.tf-840c29{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary);font-family:JetBrains Mono,monospace}.tf-09818b{display:flex;align-items:center;padding:10px 14px;border-radius:12px;border:1px solid var(--tf-border-light);background:var(--tf-input-bg);cursor:pointer;width:100%;font-family:DM Sans,sans-serif;transition:background .15s ease,border-color .15s ease}.tf-09818b:hover{border-color:var(--tf-primary);background:var(--tf-primary-light)}.tf-c7ba0f{display:flex;align-items:center;gap:9px}.tf-dea0cb{text-align:left}.tf-41931a{display:flex;align-items:center;gap:5px}.tf-3d2f5a{margin-left:auto;text-align:right;margin-right:8px}.tf-9a379d{font-size:var(--tf-font-lg);font-weight:500;font-family:JetBrains Mono,monospace;color:var(--tf-text);letter-spacing:-.02em}.tf-c11354{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary);font-family:JetBrains Mono,monospace}.tf-864468{color:var(--tf-text-tertiary);display:flex;align-items:center;flex-shrink:0;transition:transform .2s ease}.tf-8299cf{flex:1;overflow-y:auto;padding:0 8px 8px;scrollbar-width:thin;scrollbar-color:var(--tf-border) transparent}.tf-176d77{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:DM Sans,sans-serif;color:var(--tf-text)}.tf-176d77:hover{background:var(--tf-surface-hover)}.tf-2df5d9{background:var(--tf-primary-light)}.tf-dc503e{opacity:.4;cursor:not-allowed}.tf-ebbc44{display:flex;align-items:center;gap:12px}.tf-5f455f{text-align:left}.tf-15ee78{display:flex;align-items:center;gap:6px}.tf-976d83{font-size:var(--tf-font-lg);font-weight:600;color:var(--tf-text)}.tf-ba2eec{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary)}.tf-a37921{text-align:right}.tf-cf71b6{font-size:var(--tf-font-md);font-weight:600;font-family:JetBrains Mono,monospace;color:var(--tf-text)}.tf-7474a9{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-family:JetBrains Mono,monospace}.tf-772a9c{flex-shrink:0;padding:4px 8px 12px;border-top:1px solid var(--tf-border-light)}.tf-5fb6ad{display:flex;flex-direction:column;align-items:center;justify-content:center;height:197px;gap:8px;padding:16px 20px}.tf-86e8e0{flex-direction:row;gap:10px}.tf-66007c{color:var(--tf-text-tertiary);opacity:.5}.tf-73bbbc{width:24px;height:24px;display:flex;align-items:center;justify-content:center;opacity:.6;color:var(--tf-primary);animation:tf-540423 1s linear infinite}.tf-12c6bb{font-size:var(--tf-font-md);font-weight:600;color:var(--tf-text-secondary)}.tf-7a8fe0{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);text-align:center;line-height:1.4}.tf-22f94f{display:flex;align-items:center;justify-content:center;gap:4px;padding:4px 0 2px;font-size:var(--tf-font-sm);color:var(--tf-primary);cursor:pointer;font-weight:500;background:none;border:none;width:100%;font-family:DM Sans,sans-serif}";
+const css5 = ".tf-9b71d6{padding:16px 20px 12px;display:flex;justify-content:space-between;align-items:center;gap:7px}.tf-4c9136{padding:0 20px 10px}.tf-febe61{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-weight:500;margin-bottom:6px;text-align:left}.tf-a27aab{display:flex;align-items:center;gap:10px;padding:8px 14px;background:var(--tf-input-bg);border-radius:12px;border:1px solid var(--tf-border-light)}.tf-f0b3f5{position:relative;flex-shrink:0}.tf-7a6fbc{position:absolute;bottom:-1px;right:-1px;width:12px;height:12px}.tf-e9e9a1{font-size:var(--tf-font-amount-sm);font-weight:700;letter-spacing:-.02em}.tf-f3baad{font-size:var(--tf-font-lg);font-weight:500;color:var(--tf-text-secondary)}.tf-0131e4{margin-left:auto;font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-family:JetBrains Mono,monospace}";
 const receiveCss = [css0, css1, css2, css3, css4, css5, css6, css7, css8, css9, css10, css11, css12, css13].join("\n");
 const lightVars = {
   "--tf-bg": "#ffffff",
@@ -12439,14 +12393,14 @@ function parseBooleanProp(value2) {
   }
   return void 0;
 }
-let defaultWalletAdapter;
-let defaultCallbacks;
+const [defaultWalletAdapter, setDefaultWalletAdapter] = createSignal();
+const [defaultCallbacks, setDefaultCallbacks] = createSignal();
 function registerElements(options = {}) {
   if ("walletAdapter" in options) {
-    defaultWalletAdapter = options.walletAdapter;
+    setDefaultWalletAdapter(() => options.walletAdapter);
   }
   if ("callbacks" in options) {
-    defaultCallbacks = options.callbacks;
+    setDefaultCallbacks(() => options.callbacks);
   }
   if (typeof customElements === "undefined") return;
   if (!customElements.get("tokenflight-swap")) {
@@ -12496,11 +12450,6 @@ ${swapCss}`;
       });
       const elementWalletAdapter = element.__walletAdapter;
       const elementCallbacks = element.__callbacks;
-      const walletAdapter = elementWalletAdapter ?? defaultWalletAdapter;
-      const callbacks = elementCallbacks ? {
-        ...defaultCallbacks,
-        ...elementCallbacks
-      } : defaultCallbacks;
       return [(() => {
         var _el$ = _tmpl$();
         setAttribute(_el$, "nonce", nonce);
@@ -12511,8 +12460,15 @@ ${swapCss}`;
         get children() {
           return createComponent(SwapComponent, {
             config,
-            walletAdapter,
-            callbacks
+            get walletAdapter() {
+              return elementWalletAdapter ?? defaultWalletAdapter();
+            },
+            get callbacks() {
+              return elementCallbacks ? {
+                ...defaultCallbacks(),
+                ...elementCallbacks
+              } : defaultCallbacks();
+            }
           });
         }
       })];
@@ -12569,11 +12525,6 @@ ${receiveCss}`;
       });
       const elementWalletAdapter = element.__walletAdapter;
       const elementCallbacks = element.__callbacks;
-      const walletAdapter = elementWalletAdapter ?? defaultWalletAdapter;
-      const callbacks = elementCallbacks ? {
-        ...defaultCallbacks,
-        ...elementCallbacks
-      } : defaultCallbacks;
       return [(() => {
         var _el$2 = _tmpl$();
         setAttribute(_el$2, "nonce", nonce);
@@ -12584,8 +12535,15 @@ ${receiveCss}`;
         get children() {
           return createComponent(ReceiveComponent, {
             config,
-            walletAdapter,
-            callbacks
+            get walletAdapter() {
+              return elementWalletAdapter ?? defaultWalletAdapter();
+            },
+            get callbacks() {
+              return elementCallbacks ? {
+                ...defaultCallbacks(),
+                ...elementCallbacks
+              } : defaultCallbacks();
+            }
           });
         }
       })];