@velora-dex/widget 0.1.0-rc.1 → 0.1.0

package/dist/core/TradeFlowButton.js

@@ -4,16 +4,23 @@ import { Button } from '../components/ui/button.js';
 import { ControlledDrawer } from '../components/widget/Drawer/index.js';
 import { useDrawerControls } from '../components/widget/Drawer/state/useDrawerControls.js';
 import { DeltaOrderTradeOverview } from '../components/widget/TradeOverview/DeltaOrderTradeOverview.js';
+import { LimitOrderTradeOverview } from '../components/widget/TradeOverview/LimitOrderTradeOverview.js';
 import { MarketSwapTradeOverview } from '../components/widget/TradeOverview/MarketSwapTradeOverview.js';
+import { OtcOrderTradeOverview } from '../components/widget/TradeOverview/OtcOrderTradeOverview.js';
+import { useOtcOrderStep } from '../hooks/otc/tradeFlow/useOtcOrderStep.js';
 import { useDeltaSwapStep } from '../hooks/swap/tradeFlow/useDeltaSwapStep.js';
+import { useLimitOrderStep } from '../hooks/swap/tradeFlow/useLimitOrderStep.js';
 import { useMarketSwapStep } from '../hooks/swap/tradeFlow/useMarketSwapStep.js';
-import { handleTxSent, handleOrderSent } from '../lib/utils/toasts.js';
+import { cn } from '../lib/utils/index.js';
+import { addDeltaOrderToast } from '../lib/utils/toasts.js';
+import { handleTxSent } from '../lib/utils/transactionHandlers.js';
 import { useState } from 'react';
 import { formatUnits } from 'viem';
 import { useAccount } from 'wagmi';
+import { useWidgetEvents } from './state/widgetEventsAtom.js';
 
-function TradeFlowButton(t0) {
-  const $ = distExports.c(22);
+function SwapTradeFlowButton(t0) {
+  const $ = distExports.c(25);
   let buttonProps;
   let deltaPrice;
   let drawerContainer;
@@ -45,8 +52,11 @@ function TradeFlowButton(t0) {
     priceMode = $[6];
   }
   const [drawerOrderProps, setDrawerOrderProps] = useState(null);
+  const {
+    onSwap
+  } = useWidgetEvents();
   let t1;
-  if ($[7] !== orderProps || $[8] !== priceMode) {
+  if ($[7] !== deltaPrice || $[8] !== marketPrice || $[9] !== onSwap || $[10] !== orderProps || $[11] !== priceMode) {
     t1 = () => {
       if (orderProps) {
         setDrawerOrderProps({
@@ -56,56 +66,82 @@ function TradeFlowButton(t0) {
           toAmount: orderProps.toAmount,
           priceMode
         });
+        if (priceMode === "market" && marketPrice) {
+          onSwap?.({
+            event: {
+              name: "Swap:click",
+              params: {
+                swapMode: priceMode,
+                price: marketPrice
+              }
+            }
+          });
+        } else {
+          if (priceMode === "delta" && deltaPrice) {
+            onSwap?.({
+              event: {
+                name: "Swap:click",
+                params: {
+                  swapMode: priceMode,
+                  price: deltaPrice
+                }
+              }
+            });
+          }
+        }
       }
     };
-    $[7] = orderProps;
-    $[8] = priceMode;
-    $[9] = t1;
+    $[7] = deltaPrice;
+    $[8] = marketPrice;
+    $[9] = onSwap;
+    $[10] = orderProps;
+    $[11] = priceMode;
+    $[12] = t1;
   } else {
-    t1 = $[9];
+    t1 = $[12];
   }
   let t2;
-  if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
+  if ($[13] === Symbol.for("react.memo_cache_sentinel")) {
     t2 = () => {
       setDrawerOrderProps(null);
     };
-    $[10] = t2;
+    $[13] = t2;
   } else {
-    t2 = $[10];
+    t2 = $[13];
   }
   let t3;
-  if ($[11] !== t1) {
+  if ($[14] !== t1) {
     t3 = {
       drawerId: "trade-flow-drawer",
       onOpen: t1,
       onClose: t2
     };
-    $[11] = t1;
-    $[12] = t3;
+    $[14] = t1;
+    $[15] = t3;
   } else {
-    t3 = $[12];
+    t3 = $[15];
   }
   const drawerControls = useDrawerControls(t3);
   const keepPriceMode = drawerOrderProps?.priceMode || priceMode;
   let t4;
-  if ($[13] !== buttonProps || $[14] !== deltaPrice || $[15] !== drawerContainer || $[16] !== drawerControls || $[17] !== drawerOrderProps || $[18] !== keepPriceMode || $[19] !== marketPrice || $[20] !== orderProps) {
+  if ($[16] !== buttonProps || $[17] !== deltaPrice || $[18] !== drawerContainer || $[19] !== drawerControls || $[20] !== drawerOrderProps || $[21] !== keepPriceMode || $[22] !== marketPrice || $[23] !== orderProps) {
     t4 = keepPriceMode === "market" ? /* @__PURE__ */ jsx(MarketSwapDrawerButton, { orderProps: drawerOrderProps || orderProps, drawerContainer, marketPrice, drawerControls, ...buttonProps }) : /* @__PURE__ */ jsx(DeltaSwapDrawerButton, { orderProps: drawerOrderProps || orderProps, drawerContainer, deltaPrice, drawerControls, ...buttonProps });
-    $[13] = buttonProps;
-    $[14] = deltaPrice;
-    $[15] = drawerContainer;
-    $[16] = drawerControls;
-    $[17] = drawerOrderProps;
-    $[18] = keepPriceMode;
-    $[19] = marketPrice;
-    $[20] = orderProps;
-    $[21] = t4;
-  } else {
-    t4 = $[21];
+    $[16] = buttonProps;
+    $[17] = deltaPrice;
+    $[18] = drawerContainer;
+    $[19] = drawerControls;
+    $[20] = drawerOrderProps;
+    $[21] = keepPriceMode;
+    $[22] = marketPrice;
+    $[23] = orderProps;
+    $[24] = t4;
+  } else {
+    t4 = $[24];
   }
   return t4;
 }
 function MarketSwapDrawerButton(t0) {
-  const $ = distExports.c(54);
+  const $ = distExports.c(58);
   let buttonProps;
   let drawerContainer;
   let drawerControls;
@@ -171,7 +207,7 @@ function MarketSwapDrawerButton(t0) {
   const {
     step,
     startMarketSwap,
-    isCancellable,
+    isFlowCancellable,
     cancelFlow,
     retryFlow,
     reset,
@@ -179,7 +215,8 @@ function MarketSwapDrawerButton(t0) {
     result,
     usedPrice,
     error,
-    erroredStep
+    erroredStep,
+    tradeFlowType
   } = useMarketSwapStep(t1);
   let t2;
   if ($[13] !== usedPrice) {
@@ -213,95 +250,105 @@ function MarketSwapDrawerButton(t0) {
   }
   const onDismiss = t4;
   let t5;
-  if ($[20] !== cancelFlow || $[21] !== error || $[22] !== erroredStep || $[23] !== explorerLink || $[24] !== getFromAmount || $[25] !== getToAmount || $[26] !== isCancellable || $[27] !== onDismiss || $[28] !== orderProps || $[29] !== result || $[30] !== retryFlow || $[31] !== step) {
-    t5 = orderProps ? /* @__PURE__ */ jsx(MarketSwapTradeOverview, { fromToken: orderProps.fromToken, toToken: orderProps.toToken, fromAmount: getFromAmount(orderProps), toAmount: getToAmount(orderProps), onDismiss, onCancel: cancelFlow, onRetry: retryFlow, activeStep: step, isCancellable, explorerLink, result, error, erroredStep }) : null;
+  if ($[20] !== cancelFlow || $[21] !== error || $[22] !== erroredStep || $[23] !== explorerLink || $[24] !== getFromAmount || $[25] !== getToAmount || $[26] !== isFlowCancellable || $[27] !== onDismiss || $[28] !== orderProps || $[29] !== result || $[30] !== retryFlow || $[31] !== step || $[32] !== tradeFlowType) {
+    t5 = orderProps ? /* @__PURE__ */ jsx(MarketSwapTradeOverview, { fromToken: orderProps.fromToken, toToken: orderProps.toToken, fromAmount: getFromAmount(orderProps), toAmount: getToAmount(orderProps), onDismiss, onCancelFlow: cancelFlow, onRetry: retryFlow, activeStep: step, isFlowCancellable, explorerLink, result, error, erroredStep, tradeFlowType }) : null;
     $[20] = cancelFlow;
     $[21] = error;
     $[22] = erroredStep;
     $[23] = explorerLink;
     $[24] = getFromAmount;
     $[25] = getToAmount;
-    $[26] = isCancellable;
+    $[26] = isFlowCancellable;
     $[27] = onDismiss;
     $[28] = orderProps;
     $[29] = result;
     $[30] = retryFlow;
     $[31] = step;
-    $[32] = t5;
+    $[32] = tradeFlowType;
+    $[33] = t5;
   } else {
-    t5 = $[32];
+    t5 = $[33];
   }
   const content = t5;
   let t6;
-  if ($[33] !== buttonProps.onClick || $[34] !== onOpen || $[35] !== orderProps || $[36] !== startMarketSwap) {
+  if ($[34] !== buttonProps.onClick || $[35] !== onOpen || $[36] !== orderProps || $[37] !== startMarketSwap) {
     t6 = orderProps ? () => {
       onOpen();
       startMarketSwap({
         onTxSent: handleTxSent
       });
     } : buttonProps.onClick;
-    $[33] = buttonProps.onClick;
-    $[34] = onOpen;
-    $[35] = orderProps;
-    $[36] = startMarketSwap;
-    $[37] = t6;
+    $[34] = buttonProps.onClick;
+    $[35] = onOpen;
+    $[36] = orderProps;
+    $[37] = startMarketSwap;
+    $[38] = t6;
   } else {
-    t6 = $[37];
+    t6 = $[38];
   }
   const onClick = t6;
-  const t7 = buttonProps.disabled || disabled;
-  const t8 = labelOverride || "Swap";
-  let t9;
-  if ($[38] !== buttonProps || $[39] !== onClick || $[40] !== t7 || $[41] !== t8) {
-    t9 = /* @__PURE__ */ jsx(Button, { className: "w-full mt-4 h-[48px] text-md", variant: "cta", radius: "lg", ...buttonProps, onClick, disabled: t7, children: t8 });
-    $[38] = buttonProps;
-    $[39] = onClick;
+  let t7;
+  if ($[39] !== buttonProps.className) {
+    t7 = cn("w-full mt-4 h-[48px] text-md", buttonProps.className);
+    $[39] = buttonProps.className;
     $[40] = t7;
-    $[41] = t8;
-    $[42] = t9;
   } else {
-    t9 = $[42];
+    t7 = $[40];
   }
+  const t8 = buttonProps.disabled || disabled;
+  const t9 = labelOverride || "Swap";
   let t10;
-  if ($[43] !== cancelFlow || $[44] !== isCancellable) {
-    t10 = () => {
-      if (isCancellable) {
+  if ($[41] !== buttonProps || $[42] !== onClick || $[43] !== t7 || $[44] !== t8 || $[45] !== t9) {
+    t10 = /* @__PURE__ */ jsx(Button, { variant: "cta", radius: "lg", ...buttonProps, className: t7, onClick, disabled: t8, children: t9 });
+    $[41] = buttonProps;
+    $[42] = onClick;
+    $[43] = t7;
+    $[44] = t8;
+    $[45] = t9;
+    $[46] = t10;
+  } else {
+    t10 = $[46];
+  }
+  let t11;
+  if ($[47] !== cancelFlow || $[48] !== isFlowCancellable) {
+    t11 = () => {
+      if (isFlowCancellable) {
         cancelFlow();
       }
     };
-    $[43] = cancelFlow;
-    $[44] = isCancellable;
-    $[45] = t10;
+    $[47] = cancelFlow;
+    $[48] = isFlowCancellable;
+    $[49] = t11;
   } else {
-    t10 = $[45];
+    t11 = $[49];
   }
-  let t11;
-  if ($[46] !== content || $[47] !== drawerContainer || $[48] !== drawerProps || $[49] !== t10) {
-    t11 = /* @__PURE__ */ jsx(ControlledDrawer, { ...drawerProps, container: drawerContainer, onClose: t10, children: content });
-    $[46] = content;
-    $[47] = drawerContainer;
-    $[48] = drawerProps;
-    $[49] = t10;
-    $[50] = t11;
+  let t12;
+  if ($[50] !== content || $[51] !== drawerContainer || $[52] !== drawerProps || $[53] !== t11) {
+    t12 = /* @__PURE__ */ jsx(ControlledDrawer, { ...drawerProps, container: drawerContainer, onClose: t11, children: content });
+    $[50] = content;
+    $[51] = drawerContainer;
+    $[52] = drawerProps;
+    $[53] = t11;
+    $[54] = t12;
   } else {
-    t11 = $[50];
+    t12 = $[54];
   }
-  let t12;
-  if ($[51] !== t11 || $[52] !== t9) {
-    t12 = /* @__PURE__ */ jsxs(Fragment, { children: [
-      t9,
-      t11
+  let t13;
+  if ($[55] !== t10 || $[56] !== t12) {
+    t13 = /* @__PURE__ */ jsxs(Fragment, { children: [
+      t10,
+      t12
     ] });
-    $[51] = t11;
-    $[52] = t9;
-    $[53] = t12;
+    $[55] = t10;
+    $[56] = t12;
+    $[57] = t13;
   } else {
-    t12 = $[53];
+    t13 = $[57];
   }
-  return t12;
+  return t13;
 }
 function DeltaSwapDrawerButton(t0) {
-  const $ = distExports.c(54);
+  const $ = distExports.c(58);
   let buttonProps;
   let deltaPrice;
   let drawerContainer;
@@ -369,13 +416,14 @@ function DeltaSwapDrawerButton(t0) {
     startDeltaSwap,
     cancelFlow,
     retryFlow,
-    isCancellable,
+    isFlowCancellable,
     reset,
     explorerLink,
     result,
     usedPrice,
     error,
-    erroredStep
+    erroredStep,
+    tradeFlowType
   } = useDeltaSwapStep(t1);
   let t2;
   if ($[13] !== usedPrice) {
@@ -388,7 +436,7 @@ function DeltaSwapDrawerButton(t0) {
   const getFromAmount = t2;
   let t3;
   if ($[15] !== usedPrice) {
-    t3 = (orderProps_1) => usedPrice ? formatUnits(BigInt(usedPrice.destAmount), orderProps_1.toToken.decimals) : orderProps_1.toAmount;
+    t3 = (orderProps_1) => usedPrice ? formatUnits(BigInt(usedPrice.receivedDestAmount), orderProps_1.toToken.decimals) : orderProps_1.toAmount;
     $[15] = usedPrice;
     $[16] = t3;
   } else {
@@ -409,94 +457,714 @@ function DeltaSwapDrawerButton(t0) {
   }
   const onDismiss = t4;
   let t5;
-  if ($[20] !== cancelFlow || $[21] !== error || $[22] !== erroredStep || $[23] !== explorerLink || $[24] !== getFromAmount || $[25] !== getToAmount || $[26] !== isCancellable || $[27] !== onDismiss || $[28] !== orderProps || $[29] !== result || $[30] !== retryFlow || $[31] !== step) {
-    t5 = orderProps ? /* @__PURE__ */ jsx(DeltaOrderTradeOverview, { fromToken: orderProps.fromToken, toToken: orderProps.toToken, fromAmount: getFromAmount(orderProps), toAmount: getToAmount(orderProps), onDismiss, onCancel: cancelFlow, onRetry: retryFlow, activeStep: step, isCancellable, explorerLink, result, error, erroredStep }) : null;
+  if ($[20] !== cancelFlow || $[21] !== error || $[22] !== erroredStep || $[23] !== explorerLink || $[24] !== getFromAmount || $[25] !== getToAmount || $[26] !== isFlowCancellable || $[27] !== onDismiss || $[28] !== orderProps || $[29] !== result || $[30] !== retryFlow || $[31] !== step || $[32] !== tradeFlowType) {
+    t5 = orderProps ? /* @__PURE__ */ jsx(DeltaOrderTradeOverview, { fromToken: orderProps.fromToken, toToken: orderProps.toToken, fromAmount: getFromAmount(orderProps), toAmount: getToAmount(orderProps), onDismiss, onCancelFlow: cancelFlow, onRetry: retryFlow, activeStep: step, isFlowCancellable, explorerLink, result, error, erroredStep, tradeFlowType }) : null;
     $[20] = cancelFlow;
     $[21] = error;
     $[22] = erroredStep;
     $[23] = explorerLink;
     $[24] = getFromAmount;
     $[25] = getToAmount;
-    $[26] = isCancellable;
+    $[26] = isFlowCancellable;
     $[27] = onDismiss;
     $[28] = orderProps;
     $[29] = result;
     $[30] = retryFlow;
     $[31] = step;
-    $[32] = t5;
+    $[32] = tradeFlowType;
+    $[33] = t5;
   } else {
-    t5 = $[32];
+    t5 = $[33];
   }
   const content = t5;
   let t6;
-  if ($[33] !== buttonProps.onClick || $[34] !== onOpen || $[35] !== orderProps || $[36] !== startDeltaSwap) {
+  if ($[34] !== buttonProps.onClick || $[35] !== onOpen || $[36] !== orderProps || $[37] !== startDeltaSwap) {
     t6 = orderProps ? () => {
       onOpen();
       startDeltaSwap({
         onTxSent: handleTxSent,
-        onOrderSent: handleOrderSent
+        onOrderSent: addDeltaOrderToast
       });
     } : buttonProps.onClick;
-    $[33] = buttonProps.onClick;
-    $[34] = onOpen;
-    $[35] = orderProps;
-    $[36] = startDeltaSwap;
-    $[37] = t6;
+    $[34] = buttonProps.onClick;
+    $[35] = onOpen;
+    $[36] = orderProps;
+    $[37] = startDeltaSwap;
+    $[38] = t6;
   } else {
-    t6 = $[37];
+    t6 = $[38];
   }
   const onClick = t6;
-  const t7 = buttonProps.disabled || disabled;
-  const t8 = labelOverride || "Swap";
-  let t9;
-  if ($[38] !== buttonProps || $[39] !== onClick || $[40] !== t7 || $[41] !== t8) {
-    t9 = /* @__PURE__ */ jsx(Button, { className: "w-full mt-4 h-[48px] text-md", variant: "cta", radius: "lg", ...buttonProps, onClick, disabled: t7, children: t8 });
-    $[38] = buttonProps;
-    $[39] = onClick;
+  let t7;
+  if ($[39] !== buttonProps.className) {
+    t7 = cn("w-full mt-4 h-[48px] text-md", buttonProps.className);
+    $[39] = buttonProps.className;
     $[40] = t7;
-    $[41] = t8;
-    $[42] = t9;
   } else {
-    t9 = $[42];
+    t7 = $[40];
   }
+  const t8 = buttonProps.disabled || disabled;
+  const t9 = labelOverride || "Swap";
   let t10;
-  if ($[43] !== cancelFlow || $[44] !== isCancellable) {
-    t10 = () => {
-      if (isCancellable) {
+  if ($[41] !== buttonProps || $[42] !== onClick || $[43] !== t7 || $[44] !== t8 || $[45] !== t9) {
+    t10 = /* @__PURE__ */ jsx(Button, { variant: "cta", radius: "lg", ...buttonProps, className: t7, onClick, disabled: t8, children: t9 });
+    $[41] = buttonProps;
+    $[42] = onClick;
+    $[43] = t7;
+    $[44] = t8;
+    $[45] = t9;
+    $[46] = t10;
+  } else {
+    t10 = $[46];
+  }
+  let t11;
+  if ($[47] !== cancelFlow || $[48] !== isFlowCancellable) {
+    t11 = () => {
+      if (isFlowCancellable) {
         cancelFlow();
       }
     };
-    $[43] = cancelFlow;
-    $[44] = isCancellable;
-    $[45] = t10;
+    $[47] = cancelFlow;
+    $[48] = isFlowCancellable;
+    $[49] = t11;
+  } else {
+    t11 = $[49];
+  }
+  let t12;
+  if ($[50] !== content || $[51] !== drawerContainer || $[52] !== drawerProps || $[53] !== t11) {
+    t12 = /* @__PURE__ */ jsx(ControlledDrawer, { ...drawerProps, container: drawerContainer, onClose: t11, children: content });
+    $[50] = content;
+    $[51] = drawerContainer;
+    $[52] = drawerProps;
+    $[53] = t11;
+    $[54] = t12;
+  } else {
+    t12 = $[54];
+  }
+  let t13;
+  if ($[55] !== t10 || $[56] !== t12) {
+    t13 = /* @__PURE__ */ jsxs(Fragment, { children: [
+      t10,
+      t12
+    ] });
+    $[55] = t10;
+    $[56] = t12;
+    $[57] = t13;
   } else {
-    t10 = $[45];
+    t13 = $[57];
+  }
+  return t13;
+}
+function LimitOrderDrawerButton(t0) {
+  const $ = distExports.c(60);
+  let buttonProps;
+  let drawerContainer;
+  let drawerControls;
+  let labelOverride;
+  let limitPrice;
+  let orderProps;
+  if ($[0] !== t0) {
+    ({
+      orderProps,
+      drawerContainer,
+      limitPrice,
+      labelOverride,
+      drawerControls,
+      ...buttonProps
+    } = t0);
+    $[0] = t0;
+    $[1] = buttonProps;
+    $[2] = drawerContainer;
+    $[3] = drawerControls;
+    $[4] = labelOverride;
+    $[5] = limitPrice;
+    $[6] = orderProps;
+  } else {
+    buttonProps = $[1];
+    drawerContainer = $[2];
+    drawerControls = $[3];
+    labelOverride = $[4];
+    limitPrice = $[5];
+    orderProps = $[6];
+  }
+  let drawerProps;
+  let onClose;
+  let onOpen;
+  if ($[7] !== drawerControls) {
+    ({
+      onOpen,
+      onClose,
+      ...drawerProps
+    } = drawerControls);
+    $[7] = drawerControls;
+    $[8] = drawerProps;
+    $[9] = onClose;
+    $[10] = onOpen;
+  } else {
+    drawerProps = $[8];
+    onClose = $[9];
+    onOpen = $[10];
+  }
+  const {
+    isConnected
+  } = useAccount();
+  const disabled = !isConnected || !orderProps || !limitPrice;
+  let t1;
+  if ($[11] !== limitPrice) {
+    t1 = {
+      limitPrice
+    };
+    $[11] = limitPrice;
+    $[12] = t1;
+  } else {
+    t1 = $[12];
+  }
+  const {
+    step,
+    orderCancellationStep,
+    startLimitOrder,
+    cancelLimitOrder,
+    cancelFlow,
+    retryFlow,
+    isFlowCancellable,
+    isOrderCancellable,
+    reset,
+    explorerLink,
+    result,
+    error,
+    erroredStep,
+    tradeFlowType
+  } = useLimitOrderStep(t1);
+  let t2;
+  if ($[13] !== limitPrice) {
+    t2 = (orderProps_0) => limitPrice ? formatUnits(BigInt(limitPrice.srcAmount), orderProps_0.fromToken.decimals) : orderProps_0.fromAmount;
+    $[13] = limitPrice;
+    $[14] = t2;
+  } else {
+    t2 = $[14];
+  }
+  const getFromAmount = t2;
+  let t3;
+  if ($[15] !== limitPrice) {
+    t3 = (orderProps_1) => limitPrice ? formatUnits(BigInt(limitPrice.destAmount), orderProps_1.toToken.decimals) : orderProps_1.toAmount;
+    $[15] = limitPrice;
+    $[16] = t3;
+  } else {
+    t3 = $[16];
+  }
+  const getToAmount = t3;
+  let t4;
+  if ($[17] !== onClose || $[18] !== reset) {
+    t4 = () => {
+      onClose();
+      reset();
+    };
+    $[17] = onClose;
+    $[18] = reset;
+    $[19] = t4;
+  } else {
+    t4 = $[19];
+  }
+  const onDismiss = t4;
+  const onCancelOrder = isOrderCancellable ? cancelLimitOrder : void 0;
+  let t5;
+  if ($[20] !== cancelFlow || $[21] !== error || $[22] !== erroredStep || $[23] !== explorerLink || $[24] !== getFromAmount || $[25] !== getToAmount || $[26] !== isFlowCancellable || $[27] !== onCancelOrder || $[28] !== onDismiss || $[29] !== orderCancellationStep || $[30] !== orderProps || $[31] !== result || $[32] !== retryFlow || $[33] !== step || $[34] !== tradeFlowType) {
+    t5 = orderProps ? /* @__PURE__ */ jsx(LimitOrderTradeOverview, { fromToken: orderProps.fromToken, toToken: orderProps.toToken, fromAmount: getFromAmount(orderProps), toAmount: getToAmount(orderProps), onDismiss, onCancelFlow: cancelFlow, onRetry: retryFlow, onCancelOrder, activeStep: step, orderCancellationStep, isFlowCancellable, explorerLink, result, error, erroredStep, tradeFlowType }) : null;
+    $[20] = cancelFlow;
+    $[21] = error;
+    $[22] = erroredStep;
+    $[23] = explorerLink;
+    $[24] = getFromAmount;
+    $[25] = getToAmount;
+    $[26] = isFlowCancellable;
+    $[27] = onCancelOrder;
+    $[28] = onDismiss;
+    $[29] = orderCancellationStep;
+    $[30] = orderProps;
+    $[31] = result;
+    $[32] = retryFlow;
+    $[33] = step;
+    $[34] = tradeFlowType;
+    $[35] = t5;
+  } else {
+    t5 = $[35];
+  }
+  const content = t5;
+  let t6;
+  if ($[36] !== buttonProps.onClick || $[37] !== onOpen || $[38] !== orderProps || $[39] !== startLimitOrder) {
+    t6 = orderProps ? () => {
+      onOpen();
+      startLimitOrder({
+        onTxSent: handleTxSent
+      });
+    } : buttonProps.onClick;
+    $[36] = buttonProps.onClick;
+    $[37] = onOpen;
+    $[38] = orderProps;
+    $[39] = startLimitOrder;
+    $[40] = t6;
+  } else {
+    t6 = $[40];
+  }
+  const onClick = t6;
+  let t7;
+  if ($[41] !== buttonProps.className) {
+    t7 = cn("w-full mt-4 h-[48px] text-md", buttonProps.className);
+    $[41] = buttonProps.className;
+    $[42] = t7;
+  } else {
+    t7 = $[42];
+  }
+  const t8 = buttonProps.disabled || disabled;
+  const t9 = labelOverride || "Review Order";
+  let t10;
+  if ($[43] !== buttonProps || $[44] !== onClick || $[45] !== t7 || $[46] !== t8 || $[47] !== t9) {
+    t10 = /* @__PURE__ */ jsx(Button, { variant: "cta", radius: "lg", ...buttonProps, className: t7, onClick, disabled: t8, children: t9 });
+    $[43] = buttonProps;
+    $[44] = onClick;
+    $[45] = t7;
+    $[46] = t8;
+    $[47] = t9;
+    $[48] = t10;
+  } else {
+    t10 = $[48];
   }
   let t11;
-  if ($[46] !== content || $[47] !== drawerContainer || $[48] !== drawerProps || $[49] !== t10) {
-    t11 = /* @__PURE__ */ jsx(ControlledDrawer, { ...drawerProps, container: drawerContainer, onClose: t10, children: content });
-    $[46] = content;
-    $[47] = drawerContainer;
-    $[48] = drawerProps;
-    $[49] = t10;
+  if ($[49] !== cancelFlow || $[50] !== isFlowCancellable) {
+    t11 = () => {
+      if (isFlowCancellable) {
+        cancelFlow();
+      }
+    };
+    $[49] = cancelFlow;
+    $[50] = isFlowCancellable;
+    $[51] = t11;
+  } else {
+    t11 = $[51];
+  }
+  let t12;
+  if ($[52] !== content || $[53] !== drawerContainer || $[54] !== drawerProps || $[55] !== t11) {
+    t12 = /* @__PURE__ */ jsx(ControlledDrawer, { ...drawerProps, container: drawerContainer, onClose: t11, children: content });
+    $[52] = content;
+    $[53] = drawerContainer;
+    $[54] = drawerProps;
+    $[55] = t11;
+    $[56] = t12;
+  } else {
+    t12 = $[56];
+  }
+  let t13;
+  if ($[57] !== t10 || $[58] !== t12) {
+    t13 = /* @__PURE__ */ jsxs(Fragment, { children: [
+      t10,
+      t12
+    ] });
+    $[57] = t10;
+    $[58] = t12;
+    $[59] = t13;
+  } else {
+    t13 = $[59];
+  }
+  return t13;
+}
+function LimitOrderTradeFlowButton(t0) {
+  const $ = distExports.c(18);
+  let buttonProps;
+  let drawerContainer;
+  let limitPrice;
+  let orderProps;
+  if ($[0] !== t0) {
+    ({
+      orderProps,
+      drawerContainer,
+      limitPrice,
+      ...buttonProps
+    } = t0);
+    $[0] = t0;
+    $[1] = buttonProps;
+    $[2] = drawerContainer;
+    $[3] = limitPrice;
+    $[4] = orderProps;
+  } else {
+    buttonProps = $[1];
+    drawerContainer = $[2];
+    limitPrice = $[3];
+    orderProps = $[4];
+  }
+  const [drawerOrderProps, setDrawerOrderProps] = useState(null);
+  const {
+    onLimitOrder
+  } = useWidgetEvents();
+  let t1;
+  if ($[5] !== limitPrice || $[6] !== onLimitOrder || $[7] !== orderProps) {
+    t1 = () => {
+      if (orderProps) {
+        setDrawerOrderProps({
+          fromToken: orderProps.fromToken,
+          toToken: orderProps.toToken,
+          fromAmount: orderProps.fromAmount,
+          toAmount: orderProps.toAmount
+        });
+        if (limitPrice) {
+          onLimitOrder?.({
+            event: {
+              name: "LimitOrder:click",
+              params: {
+                price: limitPrice
+              }
+            }
+          });
+        }
+      }
+    };
+    $[5] = limitPrice;
+    $[6] = onLimitOrder;
+    $[7] = orderProps;
+    $[8] = t1;
+  } else {
+    t1 = $[8];
+  }
+  let t2;
+  if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = () => {
+      setDrawerOrderProps(null);
+    };
+    $[9] = t2;
+  } else {
+    t2 = $[9];
+  }
+  let t3;
+  if ($[10] !== t1) {
+    t3 = {
+      drawerId: "limit-order-flow-drawer",
+      onOpen: t1,
+      onClose: t2
+    };
+    $[10] = t1;
+    $[11] = t3;
+  } else {
+    t3 = $[11];
+  }
+  const drawerControls = useDrawerControls(t3);
+  const t4 = drawerOrderProps || orderProps;
+  let t5;
+  if ($[12] !== buttonProps || $[13] !== drawerContainer || $[14] !== drawerControls || $[15] !== limitPrice || $[16] !== t4) {
+    t5 = /* @__PURE__ */ jsx(LimitOrderDrawerButton, { orderProps: t4, drawerContainer, limitPrice, drawerControls, ...buttonProps });
+    $[12] = buttonProps;
+    $[13] = drawerContainer;
+    $[14] = drawerControls;
+    $[15] = limitPrice;
+    $[16] = t4;
+    $[17] = t5;
+  } else {
+    t5 = $[17];
+  }
+  return t5;
+}
+function OtcOrderDrawerButton(t0) {
+  const $ = distExports.c(59);
+  let buttonProps;
+  let drawerContainer;
+  let drawerControls;
+  let labelOverride;
+  let orderProps;
+  let otcPrice;
+  if ($[0] !== t0) {
+    ({
+      orderProps,
+      drawerContainer,
+      otcPrice,
+      labelOverride,
+      drawerControls,
+      ...buttonProps
+    } = t0);
+    $[0] = t0;
+    $[1] = buttonProps;
+    $[2] = drawerContainer;
+    $[3] = drawerControls;
+    $[4] = labelOverride;
+    $[5] = orderProps;
+    $[6] = otcPrice;
+  } else {
+    buttonProps = $[1];
+    drawerContainer = $[2];
+    drawerControls = $[3];
+    labelOverride = $[4];
+    orderProps = $[5];
+    otcPrice = $[6];
+  }
+  let drawerProps;
+  let onClose;
+  let onOpen;
+  if ($[7] !== drawerControls) {
+    ({
+      onOpen,
+      onClose,
+      ...drawerProps
+    } = drawerControls);
+    $[7] = drawerControls;
+    $[8] = drawerProps;
+    $[9] = onClose;
+    $[10] = onOpen;
+  } else {
+    drawerProps = $[8];
+    onClose = $[9];
+    onOpen = $[10];
+  }
+  const {
+    isConnected
+  } = useAccount();
+  const disabled = !isConnected || !orderProps || !otcPrice;
+  let t1;
+  if ($[11] !== otcPrice) {
+    t1 = {
+      otcPrice
+    };
+    $[11] = otcPrice;
+    $[12] = t1;
+  } else {
+    t1 = $[12];
+  }
+  const {
+    step,
+    orderCancellationStep,
+    startOtcOrder,
+    cancelOtcOrder,
+    cancelFlow,
+    retryFlow,
+    isFlowCancellable,
+    isOrderCancellable,
+    reset,
+    result,
+    error,
+    erroredStep,
+    tradeFlowType
+  } = useOtcOrderStep(t1);
+  let t2;
+  if ($[13] !== otcPrice) {
+    t2 = (orderProps_0) => otcPrice ? formatUnits(BigInt(otcPrice.srcAmount), orderProps_0.fromToken.decimals) : orderProps_0.fromAmount;
+    $[13] = otcPrice;
+    $[14] = t2;
+  } else {
+    t2 = $[14];
+  }
+  const getFromAmount = t2;
+  let t3;
+  if ($[15] !== otcPrice) {
+    t3 = (orderProps_1) => otcPrice ? formatUnits(BigInt(otcPrice.destAmount), orderProps_1.toToken.decimals) : orderProps_1.toAmount;
+    $[15] = otcPrice;
+    $[16] = t3;
+  } else {
+    t3 = $[16];
+  }
+  const getToAmount = t3;
+  let t4;
+  if ($[17] !== onClose || $[18] !== reset) {
+    t4 = () => {
+      onClose();
+      reset();
+    };
+    $[17] = onClose;
+    $[18] = reset;
+    $[19] = t4;
+  } else {
+    t4 = $[19];
+  }
+  const onDismiss = t4;
+  const onCancelOrder = isOrderCancellable ? cancelOtcOrder : void 0;
+  let t5;
+  if ($[20] !== cancelFlow || $[21] !== error || $[22] !== erroredStep || $[23] !== getFromAmount || $[24] !== getToAmount || $[25] !== isFlowCancellable || $[26] !== onCancelOrder || $[27] !== onDismiss || $[28] !== orderCancellationStep || $[29] !== orderProps || $[30] !== result || $[31] !== retryFlow || $[32] !== step || $[33] !== tradeFlowType) {
+    t5 = orderProps ? /* @__PURE__ */ jsx(OtcOrderTradeOverview, { fromToken: orderProps.fromToken, toToken: orderProps.toToken, fromAmount: getFromAmount(orderProps), toAmount: getToAmount(orderProps), onDismiss, onCancelFlow: cancelFlow, onRetry: retryFlow, onCancelOrder, activeStep: step, orderCancellationStep, isFlowCancellable, result, error, erroredStep, tradeFlowType }) : null;
+    $[20] = cancelFlow;
+    $[21] = error;
+    $[22] = erroredStep;
+    $[23] = getFromAmount;
+    $[24] = getToAmount;
+    $[25] = isFlowCancellable;
+    $[26] = onCancelOrder;
+    $[27] = onDismiss;
+    $[28] = orderCancellationStep;
+    $[29] = orderProps;
+    $[30] = result;
+    $[31] = retryFlow;
+    $[32] = step;
+    $[33] = tradeFlowType;
+    $[34] = t5;
+  } else {
+    t5 = $[34];
+  }
+  const content = t5;
+  let t6;
+  if ($[35] !== buttonProps.onClick || $[36] !== onOpen || $[37] !== orderProps || $[38] !== startOtcOrder) {
+    t6 = orderProps ? () => {
+      onOpen();
+      startOtcOrder({
+        onTxSent: handleTxSent
+      });
+    } : buttonProps.onClick;
+    $[35] = buttonProps.onClick;
+    $[36] = onOpen;
+    $[37] = orderProps;
+    $[38] = startOtcOrder;
+    $[39] = t6;
+  } else {
+    t6 = $[39];
+  }
+  const onClick = t6;
+  let t7;
+  if ($[40] !== buttonProps.className) {
+    t7 = cn("w-full mt-4 h-[48px] text-md", buttonProps.className);
+    $[40] = buttonProps.className;
+    $[41] = t7;
+  } else {
+    t7 = $[41];
+  }
+  const t8 = buttonProps.disabled || disabled;
+  const t9 = labelOverride || "Review Order";
+  let t10;
+  if ($[42] !== buttonProps || $[43] !== onClick || $[44] !== t7 || $[45] !== t8 || $[46] !== t9) {
+    t10 = /* @__PURE__ */ jsx(Button, { variant: "cta", radius: "lg", ...buttonProps, className: t7, onClick, disabled: t8, children: t9 });
+    $[42] = buttonProps;
+    $[43] = onClick;
+    $[44] = t7;
+    $[45] = t8;
+    $[46] = t9;
+    $[47] = t10;
+  } else {
+    t10 = $[47];
+  }
+  let t11;
+  if ($[48] !== cancelFlow || $[49] !== isFlowCancellable) {
+    t11 = () => {
+      if (isFlowCancellable) {
+        cancelFlow();
+      }
+    };
+    $[48] = cancelFlow;
+    $[49] = isFlowCancellable;
     $[50] = t11;
   } else {
     t11 = $[50];
   }
   let t12;
-  if ($[51] !== t11 || $[52] !== t9) {
-    t12 = /* @__PURE__ */ jsxs(Fragment, { children: [
-      t9,
-      t11
+  if ($[51] !== content || $[52] !== drawerContainer || $[53] !== drawerProps || $[54] !== t11) {
+    t12 = /* @__PURE__ */ jsx(ControlledDrawer, { ...drawerProps, container: drawerContainer, onClose: t11, children: content });
+    $[51] = content;
+    $[52] = drawerContainer;
+    $[53] = drawerProps;
+    $[54] = t11;
+    $[55] = t12;
+  } else {
+    t12 = $[55];
+  }
+  let t13;
+  if ($[56] !== t10 || $[57] !== t12) {
+    t13 = /* @__PURE__ */ jsxs(Fragment, { children: [
+      t10,
+      t12
     ] });
-    $[51] = t11;
-    $[52] = t9;
-    $[53] = t12;
+    $[56] = t10;
+    $[57] = t12;
+    $[58] = t13;
+  } else {
+    t13 = $[58];
+  }
+  return t13;
+}
+function OtcOrderTradeFlowButton(t0) {
+  const $ = distExports.c(18);
+  let buttonProps;
+  let drawerContainer;
+  let orderProps;
+  let otcPrice;
+  if ($[0] !== t0) {
+    ({
+      orderProps,
+      drawerContainer,
+      otcPrice,
+      ...buttonProps
+    } = t0);
+    $[0] = t0;
+    $[1] = buttonProps;
+    $[2] = drawerContainer;
+    $[3] = orderProps;
+    $[4] = otcPrice;
+  } else {
+    buttonProps = $[1];
+    drawerContainer = $[2];
+    orderProps = $[3];
+    otcPrice = $[4];
+  }
+  const [drawerOrderProps, setDrawerOrderProps] = useState(null);
+  const {
+    onOTCOrder
+  } = useWidgetEvents();
+  let t1;
+  if ($[5] !== onOTCOrder || $[6] !== orderProps || $[7] !== otcPrice) {
+    t1 = () => {
+      if (orderProps) {
+        setDrawerOrderProps({
+          fromToken: orderProps.fromToken,
+          toToken: orderProps.toToken,
+          fromAmount: orderProps.fromAmount,
+          toAmount: orderProps.toAmount
+        });
+        if (otcPrice) {
+          onOTCOrder?.({
+            event: {
+              name: "OTCOrder:click",
+              params: {
+                price: otcPrice
+              }
+            }
+          });
+        }
+      }
+    };
+    $[5] = onOTCOrder;
+    $[6] = orderProps;
+    $[7] = otcPrice;
+    $[8] = t1;
+  } else {
+    t1 = $[8];
+  }
+  let t2;
+  if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = () => {
+      setDrawerOrderProps(null);
+    };
+    $[9] = t2;
+  } else {
+    t2 = $[9];
+  }
+  let t3;
+  if ($[10] !== t1) {
+    t3 = {
+      drawerId: "otc-order-flow-drawer",
+      onOpen: t1,
+      onClose: t2
+    };
+    $[10] = t1;
+    $[11] = t3;
+  } else {
+    t3 = $[11];
+  }
+  const drawerControls = useDrawerControls(t3);
+  const t4 = drawerOrderProps || orderProps;
+  let t5;
+  if ($[12] !== buttonProps || $[13] !== drawerContainer || $[14] !== drawerControls || $[15] !== otcPrice || $[16] !== t4) {
+    t5 = /* @__PURE__ */ jsx(OtcOrderDrawerButton, { orderProps: t4, drawerContainer, otcPrice, drawerControls, ...buttonProps });
+    $[12] = buttonProps;
+    $[13] = drawerContainer;
+    $[14] = drawerControls;
+    $[15] = otcPrice;
+    $[16] = t4;
+    $[17] = t5;
   } else {
-    t12 = $[53];
+    t5 = $[17];
   }
-  return t12;
+  return t5;
 }
 
-export { TradeFlowButton };
+export { LimitOrderTradeFlowButton, OtcOrderTradeFlowButton, SwapTradeFlowButton };
 //# sourceMappingURL=TradeFlowButton.js.map