@coin-voyage/swapkit 0.3.0 → 0.4.0-beta.0

package/dist/components/swap-recipient.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/swap-recipient.test.js

@@ -0,0 +1,105 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// @vitest-environment jsdom
+import { ChainId, ChainType } from "@coin-voyage/shared/types";
+import { cleanup, fireEvent, render, screen } from "@testing-library/react";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { Swap } from "./swap";
+const { execute } = vi.hoisted(() => ({ execute: vi.fn() }));
+vi.mock("@coin-voyage/crypto/hooks", () => ({ useAccount: () => ({ accounts }) }));
+vi.mock("../providers/swapkit-context", () => ({ useSwapKit: () => ({ mode: "light", theme: {} }) }));
+vi.mock("../hooks/use-swap-execution", () => ({
+    useSwapExecution: () => ({ stage: { kind: "idle" }, execute, reset: vi.fn() }),
+}));
+vi.mock("../hooks/use-token-data", () => ({
+    useTokenData: () => ({
+        tokens: [{ currency: source, balance: "2" }, { currency: destination }, { currency: solana }],
+        accounts,
+        isLoading: false,
+        refreshBalances: vi.fn(),
+    }),
+}));
+vi.mock("../hooks/use-swap-quote", () => ({
+    useSwapQuote: () => ({
+        quote: {
+            input: { currency: source, amount: { raw: "1000000000000000000", ui: "1" } },
+            output: { currency: destination, amount: { raw: "1000000", ui: "1" } },
+            price_impact: 0,
+        },
+        loading: false,
+    }),
+}));
+vi.mock("./connected-wallets", () => ({ ConnectedWallets: () => null }));
+vi.mock("./token-picker", () => ({ TokenPicker: () => null }));
+vi.mock("./wallet-connector", () => ({ WalletConnector: () => null }));
+vi.mock("./execution-modal", () => ({ ExecutionModal: () => null }));
+const sender = "0x1111111111111111111111111111111111111111";
+const recipient = "0x2222222222222222222222222222222222222222";
+const accounts = [{ address: sender, chainType: ChainType.EVM }];
+const source = {
+    id: "eth",
+    chain_id: ChainId.ETH,
+    name: "Ether",
+    symbol: "ETH",
+    decimals: 18,
+};
+const destination = {
+    id: "usdc",
+    chain_id: ChainId.ETH,
+    address: "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
+    name: "USD Coin",
+    symbol: "USDC",
+    decimals: 6,
+};
+const solana = {
+    id: "sol",
+    chain_id: ChainId.SOL,
+    name: "Solana",
+    symbol: "SOL",
+    decimals: 9,
+};
+beforeEach(() => execute.mockClear());
+afterEach(cleanup);
+function renderSwap(output = destination) {
+    render(_jsx(Swap, { defaultSourceCurrency: source, defaultDestinationCurrency: output }));
+    fireEvent.change(screen.getByRole("textbox", { name: "Sell amount" }), { target: { value: "1" } });
+}
+function openRecipientModal() {
+    fireEvent.click(screen.getByRole("button", { name: /^Output wallet:/ }));
+    fireEvent.click(screen.getByRole("menuitem", { name: "Paste Address" }));
+}
+describe("Swap destination recipient", () => {
+    it("offers only a pasted address for swaps on the same chain", () => {
+        renderSwap();
+        fireEvent.click(screen.getByRole("button", { name: /^Output wallet:/ }));
+        expect(screen.getByRole("menuitem", { name: "Paste Address" })).toBeTruthy();
+        expect(screen.queryByRole("menuitem", { name: "Connect Wallet" })).toBeNull();
+        expect(screen.getAllByRole("menuitem")).toHaveLength(1);
+    });
+    it("executes a same-chain swap to the pasted recipient", () => {
+        renderSwap();
+        openRecipientModal();
+        fireEvent.change(screen.getByRole("textbox", { name: "Wallet address" }), { target: { value: recipient } });
+        fireEvent.click(screen.getByRole("button", { name: "Use address" }));
+        expect(screen.queryByRole("dialog", { name: "Paste destination address" })).toBeNull();
+        fireEvent.click(screen.getByRole("button", { name: "Swap" }));
+        expect(execute).toHaveBeenCalledWith(expect.objectContaining({
+            source: expect.objectContaining({ sender_address: sender }),
+            destination: expect.objectContaining({ recipient }),
+        }), sender);
+    });
+    it("rejects invalid same-chain destination addresses", () => {
+        renderSwap();
+        openRecipientModal();
+        fireEvent.change(screen.getByRole("textbox", { name: "Wallet address" }), { target: { value: "invalid" } });
+        fireEvent.click(screen.getByRole("button", { name: "Use address" }));
+        expect(screen.getByText("Enter a valid address for the destination network")).toBeTruthy();
+        expect(screen.getByRole("dialog", { name: "Paste destination address" })).toBeTruthy();
+        expect(execute).not.toHaveBeenCalled();
+    });
+    it("keeps both connect and paste options for cross-family swaps", () => {
+        renderSwap(solana);
+        fireEvent.click(screen.getByRole("button", { name: /^Output wallet:/ }));
+        expect(screen.getByRole("menuitem", { name: "Connect Wallet" })).toBeTruthy();
+        expect(screen.getByRole("menuitem", { name: "Paste Address" })).toBeTruthy();
+    });
+});

package/dist/components/swap.d.ts

@@ -15,7 +15,7 @@ interface CurrencyPanelProps {
     side: SwapSide;
     token?: SwapToken;
     amount: string;
-    balance?: number;
+    balance?: string;
     quoteUsd?: number | null;
     quoteLoading?: boolean;
     disabled?: boolean;

package/dist/components/swap.js

@@ -1,13 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useAccount } from "@coin-voyage/crypto/hooks";
 import { getChainTypeByChainId, isValidAddress } from "@coin-voyage/shared/chain";
+import { formatCurrencyAmount } from "@coin-voyage/shared/currency";
 import { currencyID } from "@coin-voyage/shared/types";
 import { useCallback, useEffect, useId, useMemo, useRef, useState } from "react";
 import { useSwapExecution } from "../hooks/use-swap-execution";
 import { useSwapQuote } from "../hooks/use-swap-quote";
 import { useSwapState } from "../hooks/use-swap-state";
 import { useTokenData } from "../hooks/use-token-data";
-import { isValidSwapAmountInput } from "../lib/amount-input";
+import { balanceFraction, isValidSwapAmountInput } from "../lib/amount-input";
 import { getSwapWalletRequirement, shouldShowOutputWalletSelector, shouldUseSeparateOutputWallet, } from "../lib/output-wallet";
 import { buildSwapQuoteRequest, isSameSwap, toCurrencyBase } from "../lib/quote";
 import { useSwapKit } from "../providers/swapkit-context";
@@ -119,7 +120,7 @@ function OutputWalletSelector({ label, open, onOpenChange, onConnect, onPaste, }
             document.removeEventListener("keydown", dismissOnEscape);
         };
     }, [onOpenChange, open]);
-    return (_jsxs(OutputWalletControl, { ref: controlRef, children: [_jsxs(OutputWalletTrigger, { type: "button", "aria-label": `Output wallet: ${label}`, "aria-expanded": open, onClick: () => onOpenChange(!open), children: [_jsx("span", { children: label }), _jsx(ChevronDownIcon, { size: 16, up: open })] }), open && (_jsxs(OutputWalletMenu, { role: "menu", "aria-label": "Destination wallet options", children: [_jsxs(OutputWalletOption, { type: "button", role: "menuitem", onClick: onConnect, children: [_jsx("span", { children: "Connect Wallet" }), _jsx(WalletIcon, {})] }), _jsxs(OutputWalletOption, { type: "button", role: "menuitem", onClick: onPaste, children: [_jsx("span", { children: "Paste Address" }), _jsx(PasteIcon, {})] })] }))] }));
+    return (_jsxs(OutputWalletControl, { ref: controlRef, children: [_jsxs(OutputWalletTrigger, { type: "button", "aria-label": `Output wallet: ${label}`, "aria-expanded": open, onClick: () => onOpenChange(!open), children: [_jsx("span", { children: label }), _jsx(ChevronDownIcon, { size: 16, up: open })] }), open && (_jsxs(OutputWalletMenu, { role: "menu", "aria-label": "Destination wallet options", children: [onConnect && (_jsxs(OutputWalletOption, { type: "button", role: "menuitem", onClick: onConnect, children: [_jsx("span", { children: "Connect Wallet" }), _jsx(WalletIcon, {})] })), _jsxs(OutputWalletOption, { type: "button", role: "menuitem", onClick: onPaste, children: [_jsx("span", { children: "Paste Address" }), _jsx(PasteIcon, {})] })] }))] }));
 }
 function formatUsd(value) {
     if (value === undefined || value === null || !Number.isFinite(value))
@@ -143,11 +144,6 @@ const QUICK_AMOUNTS = [
     { label: "75%", fraction: 0.75 },
     { label: "Max", fraction: 1 },
 ];
-function balanceFraction(balance, fraction, decimals) {
-    if (fraction === 1)
-        return balance.toString();
-    return Number((balance * fraction).toFixed(Math.min(Math.max(decimals, 0), 18))).toString();
-}
 export function CurrencyPanel({ side, token, amount, balance, quoteUsd, quoteLoading, disabled, onAmountChange, onSelectToken, footerAction, }) {
     const label = side === "input" ? "SELL" : "BUY";
     const showQuickAmounts = side === "input" && balance !== undefined && token !== undefined;
@@ -156,13 +152,13 @@ export function CurrencyPanel({ side, token, amount, balance, quoteUsd, quoteLoa
                         : `Use ${amountLabel} of ${token.currency.symbol} balance`, onClick: () => onAmountChange(balanceFraction(balance, fraction, token.currency.decimals)), children: amountLabel }, amountLabel))) })), _jsxs(AmountRow, { children: [quoteLoading ? (_jsx(AmountSkeleton, { role: "status", "aria-label": "Loading quoted amount" })) : (_jsx(AmountInput, { "aria-label": side === "input" ? "Sell amount" : "Buy amount", type: "text", inputMode: "decimal", autoComplete: "off", autoCorrect: "off", spellCheck: false, placeholder: "0", value: amount, disabled: disabled, onChange: (event) => {
                             if (isValidSwapAmountInput(event.target.value))
                                 onAmountChange(event.target.value);
-                        } })), _jsxs(TokenButton, { type: "button", onClick: onSelectToken, "aria-label": `Select ${side} token`, children: [token ? _jsx(TokenIcon, { currency: token.currency }) : null, _jsx("span", { children: token?.currency.symbol ?? "Select" }), _jsx(ChevronDownIcon, {})] })] }), _jsxs(CardFooter, { children: [quoteLoading ? (_jsx(QuoteValueSkeleton, { role: "status", "aria-label": "Loading quoted value" })) : (_jsx("span", { children: formatUsd(quoteUsd ?? tokenUsdValue(token, amount)) })), _jsxs(InlineActions, { children: [balance !== undefined && _jsxs("span", { children: ["Balance: ", balance.toLocaleString()] }), footerAction] })] })] }));
+                        } })), _jsxs(TokenButton, { type: "button", onClick: onSelectToken, "aria-label": `Select ${side} token`, children: [token ? _jsx(TokenIcon, { currency: token.currency }) : null, _jsx("span", { children: token?.currency.symbol ?? "Select" }), _jsx(ChevronDownIcon, {})] })] }), _jsxs(CardFooter, { children: [quoteLoading ? (_jsx(QuoteValueSkeleton, { role: "status", "aria-label": "Loading quoted value" })) : (_jsx("span", { children: formatUsd(quoteUsd ?? tokenUsdValue(token, amount)) })), _jsxs(InlineActions, { children: [balance !== undefined && _jsxs("span", { children: ["Balance: ", Number(balance).toLocaleString()] }), footerAction] })] })] }));
 }
 function ManualWalletModal({ open, chainId, initialValue, onClose, onSave, }) {
     const [value, setValue] = useState(initialValue ?? "");
     const [error, setError] = useState(null);
     const outputAddressId = useId();
-    return (_jsxs(Modal, { open: open, title: "Paste destination address", onClose: onClose, children: [_jsx(FieldLabel, { htmlFor: outputAddressId, children: "Wallet address" }), _jsx(CompactInput, { id: outputAddressId, value: value, autoComplete: "off", onChange: (event) => setValue(event.target.value.trim()) }), error && _jsx(Hint, { "$tone": "danger", children: error }), _jsx(PrimaryButton, { type: "button", onClick: () => {
+    return (_jsxs(Modal, { open: open, title: "Paste destination address", onClose: onClose, children: [_jsx(FieldLabel, { htmlFor: outputAddressId, children: "Wallet address" }), _jsx(CompactInput, { id: outputAddressId, value: value, autoComplete: "off", onChange: (event) => setValue(event.target.value.trim()) }), error && _jsx(Hint, { "$tone": "danger", children: error }), _jsx(PrimaryButton, { type: "button", style: { marginTop: 12 }, onClick: () => {
                     if (!chainId || !isValidAddress(value, chainId)) {
                         setError("Enter a valid address for the destination network");
                         return;
@@ -206,7 +202,7 @@ export function Swap({ defaultSourceCurrency, defaultDestinationCurrency, defaul
     const manualAddress = manualOutputWallet && manualOutputWallet.chainId === destinationToken?.currency.chain_id
         ? manualOutputWallet.address
         : undefined;
-    const outputAddress = separateOutputWallet ? (manualAddress ?? outputAccount?.address) : inputAccount?.address;
+    const outputAddress = manualAddress ?? (separateOutputWallet ? outputAccount?.address : inputAccount?.address);
     const walletRequirement = getSwapWalletRequirement({
         inputWalletAddress: inputAccount?.address,
         inputChainType: sourceChainType,
@@ -215,7 +211,6 @@ export function Swap({ defaultSourceCurrency, defaultDestinationCurrency, defaul
         outputChainType: destinationChainType,
     });
     const showOutputWalletSelector = shouldShowOutputWalletSelector({
-        requiresSeparateOutputWallet: separateOutputWallet,
         outputChainType: destinationChainType,
         connectionRequirement: walletRequirement,
     });
@@ -253,10 +248,14 @@ export function Swap({ defaultSourceCurrency, defaultDestinationCurrency, defaul
         onComplete,
         onError,
     });
-    const displayedInputAmount = activeSide === "output" && quoteState.quote ? quoteState.quote.input.amount.ui : inputAmount;
-    const displayedOutputAmount = activeSide === "input" && quoteState.quote ? quoteState.quote.output.amount.ui : outputAmount;
+    const displayedInputAmount = activeSide === "output" && quoteState.quote
+        ? formatCurrencyAmount(quoteState.quote.input.amount.raw, quoteState.quote.input.currency.decimals)
+        : inputAmount;
+    const displayedOutputAmount = activeSide === "input" && quoteState.quote
+        ? formatCurrencyAmount(quoteState.quote.output.amount.raw, quoteState.quote.output.currency.decimals)
+        : outputAmount;
     const sourceBalance = sourceToken?.balance;
-    const insufficientBalance = sourceBalance !== undefined && Number(displayedInputAmount) > sourceBalance;
+    const insufficientBalance = sourceBalance !== undefined && Number(displayedInputAmount) > Number(sourceBalance);
     const sameSwap = isSameSwap(sourceToken?.currency, destinationToken?.currency, inputAccount?.address, outputAddress);
     const canExecute = Boolean(quoteState.quote &&
         quoteRequest &&
@@ -300,10 +299,12 @@ export function Swap({ defaultSourceCurrency, defaultDestinationCurrency, defaul
                                 swapState.setAmount("input", value);
                             }, onSelectToken: () => setSourcePickerOpen(true) }), _jsx(SwitchButton, { type: "button", "aria-label": "Swap tokens", onClick: reverseTokens, disabled: !sourceToken || !destinationToken, children: _jsx(ArrowDownIcon, { size: 24 }) })] }), _jsx(CurrencyPanel, { side: "output", token: destinationToken, amount: displayedOutputAmount, quoteUsd: quoteState.quote?.output.amount.value_usd, quoteLoading: quoteState.loading && activeSide === "input", disabled: execution.stage.kind !== "idle", onAmountChange: (value) => {
                         swapState.setAmount("output", value);
-                    }, onSelectToken: () => setDestinationPickerOpen(true), footerAction: showOutputWalletSelector ? (_jsx(OutputWalletSelector, { label: outputAddress ? truncateAddress(outputAddress) : "Connect Wallet", open: outputWalletMenuOpen, onOpenChange: setOutputWalletMenuOpen, onConnect: () => {
-                            setOutputWalletMenuOpen(false);
-                            setConnectTarget({ open: true, chainType: destinationChainType });
-                        }, onPaste: () => {
+                    }, onSelectToken: () => setDestinationPickerOpen(true), footerAction: showOutputWalletSelector ? (_jsx(OutputWalletSelector, { label: outputAddress ? truncateAddress(outputAddress) : "Connect Wallet", open: outputWalletMenuOpen, onOpenChange: setOutputWalletMenuOpen, onConnect: separateOutputWallet
+                            ? () => {
+                                setOutputWalletMenuOpen(false);
+                                setConnectTarget({ open: true, chainType: destinationChainType });
+                            }
+                            : undefined, onPaste: () => {
                             setOutputWalletMenuOpen(false);
                             setManualWalletOpen(true);
                         } })) : undefined }), quoteState.error && _jsx(ErrorBox, { children: quoteState.error }), tokenError && _jsx(ErrorBox, { children: tokenError }), insufficientBalance && _jsxs(ErrorBox, { children: ["Insufficient ", sourceToken?.currency.symbol, " balance"] }), sameSwap && _jsx(ErrorBox, { children: "Select a different token or destination wallet" }), (quoteState.loading || quoteState.quote) && (_jsxs(BreakdownCard, { children: [_jsxs(BreakdownToggle, { type: "button", "aria-expanded": breakdownOpen, onClick: () => setBreakdownOpen((open) => !open), children: [_jsx("span", { children: quoteState.loading ? "Finding the best route…" : quoteSummary }), _jsxs(BreakdownMeta, { children: [quoteState.quote && (_jsxs(NetworkCost, { children: [_jsx(FuelIcon, {}), _jsx("span", { children: formatUsd(quoteState.quote.input.breakdown?.gas?.value_usd) })] })), _jsx(ChevronDownIcon, { size: 16, up: breakdownOpen })] })] }), breakdownOpen && (_jsxs(BreakdownBody, { children: [quoteState.quote?.output.amount_out_minimum && (_jsxs(DetailRow, { children: [_jsx("span", { children: "Receive at least" }), _jsxs("strong", { children: [quoteState.quote.output.amount_out_minimum.ui, " ", quoteState.quote.output.currency.symbol] })] })), _jsxs(DetailRow, { children: [_jsx("span", { children: "Price impact" }), _jsx("strong", { children: quoteState.quote ? formatPriceImpact(quoteState.quote.price_impact) : "—" })] }), _jsxs(DetailRow, { children: [_jsx("span", { children: "Network cost" }), _jsx("strong", { children: formatUsd(quoteState.quote?.input.breakdown?.gas?.value_usd) })] }), _jsxs(DetailRow, { children: [_jsx("span", { children: "Total fees" }), quoteState.quote?.input.breakdown?.fees?.total_fee.value_usd === 0 ? (_jsx(FreeFeeBadge, { children: "Free" })) : (_jsx("strong", { children: formatUsd(quoteState.quote?.input.breakdown?.fees?.total_fee.value_usd) }))] })] }))] })), walletRequirement.target !== "none" ? (_jsx(WalletRequirementButton, { type: "button", onClick: () => setConnectTarget({ open: true, chainType: walletRequirement.chainType }), children: walletRequirement.label })) : (_jsxs(PrimaryButton, { type: "button", disabled: !canExecute || quoteState.loading, onClick: () => void executeSwap(), children: [quoteState.loading ? _jsx(Spinner, {}) : null, isLoading ? "Loading tokens…" : quoteState.loading ? "Fetching quote…" : "Swap"] })), _jsx(TokenPicker, { open: sourcePickerOpen, title: "Select Token", tokens: tokens, selectedId: resolvedSourceId, onClose: () => setSourcePickerOpen(false), onSelect: (token) => selectToken("input", token) }), _jsx(TokenPicker, { open: destinationPickerOpen, title: "Select Token", tokens: tokens, selectedId: resolvedDestinationId, preferredChainId: sourceToken?.currency.chain_id, onClose: () => setDestinationPickerOpen(false), onSelect: (token) => selectToken("output", token) }), _jsx(WalletConnector, { open: connectTarget.open, chainType: connectTarget.chainType, onClose: () => setConnectTarget({ open: false }) }), manualWalletOpen && (_jsx(ManualWalletModal, { open: true, chainId: destinationToken?.currency.chain_id, initialValue: manualAddress, onClose: () => setManualWalletOpen(false), onSave: (address) => {

package/dist/components/swap.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/swap.test.js

@@ -0,0 +1,76 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// @vitest-environment jsdom
+import { ChainId } from "@coin-voyage/shared/types";
+import { cleanup, fireEvent, render, screen } from "@testing-library/react";
+import { afterEach, describe, expect, it, vi } from "vitest";
+import { Swap } from "./swap";
+vi.mock("@coin-voyage/crypto/hooks", () => ({ useAccount: () => ({ accounts: [] }) }));
+vi.mock("../providers/swapkit-context", () => ({ useSwapKit: () => ({ mode: "light", theme: {} }) }));
+vi.mock("../hooks/use-swap-execution", () => ({
+    useSwapExecution: () => ({ stage: { kind: "idle" }, execute: vi.fn(), reset: vi.fn() }),
+}));
+vi.mock("../hooks/use-token-data", () => ({
+    useTokenData: () => ({
+        tokens: [{ currency: source, balance: "2.345678901234567891" }, { currency: destination }],
+        accounts: [],
+        isLoading: false,
+        refreshBalances: vi.fn(),
+    }),
+}));
+vi.mock("../hooks/use-swap-quote", () => ({
+    useSwapQuote: () => ({
+        quote: {
+            input: { currency: source, amount: { raw: "1234567890123456789", ui: "1.23" } },
+            output: { currency: destination, amount: { raw: "9876543", ui: "9.88" } },
+            price_impact: 0,
+        },
+        loading: false,
+    }),
+}));
+vi.mock("./connected-wallets", () => ({ ConnectedWallets: () => null }));
+vi.mock("./token-picker", () => ({ TokenPicker: () => null }));
+vi.mock("./wallet-connector", () => ({ WalletConnector: () => null }));
+vi.mock("./execution-modal", () => ({ ExecutionModal: () => null }));
+const source = {
+    id: "eth",
+    chain_id: ChainId.ETH,
+    name: "Ether",
+    symbol: "ETH",
+    decimals: 18,
+};
+const destination = {
+    id: "usdc",
+    chain_id: ChainId.ETH,
+    address: "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
+    name: "USD Coin",
+    symbol: "USDC",
+    decimals: 6,
+};
+afterEach(cleanup);
+function renderSwap() {
+    render(_jsx(Swap, { defaultSourceCurrency: source, defaultDestinationCurrency: destination }));
+    return {
+        sell: screen.getByRole("textbox", { name: "Sell amount" }),
+        buy: screen.getByRole("textbox", { name: "Buy amount" }),
+    };
+}
+describe("Swap amount precision", () => {
+    it("shows the exact quoted buy amount while preserving the typed sell amount", () => {
+        const { sell, buy } = renderSwap();
+        fireEvent.change(sell, { target: { value: "1.234567890123456780" } });
+        expect(sell.value).toBe("1.234567890123456780");
+        expect(buy.value).toBe("9.876543");
+    });
+    it("shows the exact quoted sell amount while preserving the typed buy amount", () => {
+        const { sell, buy } = renderSwap();
+        fireEvent.change(buy, { target: { value: "9.876540" } });
+        expect(buy.value).toBe("9.876540");
+        expect(sell.value).toBe("1.234567890123456789");
+    });
+    it("fills the full balance with MAX after editing the buy amount", () => {
+        const { sell, buy } = renderSwap();
+        fireEvent.change(buy, { target: { value: "9.876543" } });
+        fireEvent.click(screen.getByRole("button", { name: "Use maximum ETH balance" }));
+        expect(sell.value).toBe("2.345678901234567891");
+    });
+});

package/dist/components/token-picker.js

@@ -74,6 +74,6 @@ export function TokenPicker({ open, title, tokens, selectedId, preferredChainId,
                             return (_jsxs(TokenOption, { type: "button", role: "option", "aria-label": `${token.currency.symbol} ${token.currency.name}`, "aria-selected": id === selectedId, onClick: () => {
                                     onSelect(token);
                                     closePicker();
-                                }, children: [_jsx(TokenIcon, { currency: token.currency, size: 40 }), _jsxs(TokenMeta, { children: [_jsx("strong", { children: token.currency.name }), _jsx("small", { children: tokenDescription(token) })] }), _jsxs(TokenBalance, { children: [_jsx("strong", { children: formatUsd(token.balanceUsd) }), _jsx("small", { children: token.balance === undefined ? "" : token.balance.toLocaleString() })] })] }, id));
+                                }, children: [_jsx(TokenIcon, { currency: token.currency, size: 40 }), _jsxs(TokenMeta, { children: [_jsx("strong", { children: token.currency.name }), _jsx("small", { children: tokenDescription(token) })] }), _jsxs(TokenBalance, { children: [_jsx("strong", { children: formatUsd(token.balanceUsd) }), _jsx("small", { children: token.balance === undefined ? "" : Number(token.balance).toLocaleString() })] })] }, id));
                         }), filtered.length === 0 && _jsx(EmptyState, { children: "No matching tokens" })] })] }) }));
 }

package/dist/components/wallet-connector.d.ts

@@ -1,4 +1,4 @@
-import type { ChainType } from "@coin-voyage/shared/types";
+import { ChainType } from "@coin-voyage/shared/types";
 interface WalletConnectorProps {
     open: boolean;
     chainType?: ChainType;

package/dist/components/wallet-connector.js

@@ -1,11 +1,20 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { createWalletConnectModalConnector } from "@coin-voyage/crypto/connectors";
 import { useInstalledWallets, useUniversalConnect } from "@coin-voyage/crypto/hooks";
-import { getErrorMessage, isWalletConnectionCancelledError } from "@coin-voyage/crypto/utils";
+import { getConnectorId, getErrorMessage, isWalletConnectionCancelledError } from "@coin-voyage/crypto/utils";
 import { getChainTypeName } from "@coin-voyage/shared/chain";
+import { ChainType } from "@coin-voyage/shared/types";
 import { useMemo, useRef, useState } from "react";
 import { EmptyState, Hint, MultichainBadge, WalletList, WalletOption, WalletOptionMeta, WalletSwitchButton, } from "./styles";
 import { Modal } from "./modal";
 import { WalletIconDisplay } from "./wallet-icon";
+const getWalletDisplayName = (wallet) => wallet.id.toLowerCase() === "walletconnect" ? "Mobile Wallets" : wallet.name;
+const addWalletConnectModalStyle = () => {
+    const style = document.createElement("style");
+    style.textContent = "w3m-modal, wcm-modal { --wcm-z-index: 2147483647; --w3m-z-index: 2147483647; }";
+    document.head.appendChild(style);
+    return style;
+};
 export function WalletConnector(props) {
     if (!props.open)
         return null;
@@ -42,14 +51,23 @@ function OpenWalletConnector({ chainType, intent = "connect", beforeConnect, onC
         pendingRef.current = true;
         setPending(true);
         setError(null);
+        let walletConnectModalStyle;
         try {
             await beforeConnect?.();
-            await connect({ walletConnector: connector });
+            const connectorId = getConnectorId(connector.connector);
+            const isWalletConnect = connectorId?.toLowerCase().includes("walletconnect");
+            if (isWalletConnect)
+                walletConnectModalStyle = addWalletConnectModalStyle();
+            const walletConnector = connector.chainType === ChainType.EVM && isWalletConnect
+                ? { ...connector, connector: await createWalletConnectModalConnector(connector.connector) }
+                : connector;
+            await connect({ walletConnector });
         }
         catch (error) {
             showError(error);
         }
         finally {
+            walletConnectModalStyle?.remove();
             const shouldUpdatePending = pendingRef.current;
             pendingRef.current = false;
             if (shouldUpdatePending)
@@ -69,14 +87,16 @@ function OpenWalletConnector({ chainType, intent = "connect", beforeConnect, onC
     return (_jsxs(Modal, { open: true, title: modalTitle, onClose: close, closeDisabled: pending, children: [selectedWallet && (_jsx(WalletSwitchButton, { type: "button", disabled: pending, onClick: () => setSelectedWallet(null), children: "Back" })), _jsx(WalletList, { "aria-busy": pending, children: selectedWallet
                     ? selectedConnectors.map((connector) => {
                         const chainName = getChainTypeName(connector.chainType);
-                        return (_jsxs(WalletOption, { type: "button", disabled: pending, "aria-label": `Connect ${selectedWallet.name} on ${chainName}`, onClick: () => void handleConnect(connector), children: [_jsx(WalletIconDisplay, { icon: selectedWallet.icon, name: chainName }), _jsxs(WalletOptionMeta, { children: [_jsx("span", { children: _jsx("strong", { children: chainName }) }), _jsxs("small", { children: [chainName, " network"] })] })] }, connector.chainType));
+                        const walletName = getWalletDisplayName(selectedWallet);
+                        return (_jsxs(WalletOption, { type: "button", disabled: pending, "aria-label": `Connect ${walletName} on ${chainName}`, onClick: () => void handleConnect(connector), children: [_jsx(WalletIconDisplay, { icon: selectedWallet.icon, name: chainName }), _jsxs(WalletOptionMeta, { children: [_jsx("span", { children: _jsx("strong", { children: chainName }) }), _jsxs("small", { children: [chainName, " network"] })] })] }, connector.chainType));
                     })
                     : wallets.map((wallet) => {
                         const connector = wallet.connectors.find((candidate) => !chainType || candidate.chainType === chainType);
                         if (!connector)
                             return null;
+                        const walletName = getWalletDisplayName(wallet);
                         const chainTypes = [...new Set(wallet.connectors.map(({ chainType }) => chainType))];
                         const capabilityLabel = chainTypes.map(getChainTypeName).join(" · ");
-                        return (_jsxs(WalletOption, { type: "button", disabled: pending, "aria-label": `${intent === "switch" ? "Switch to" : "Connect"} ${wallet.name} wallet`, onClick: () => chooseWallet(wallet), children: [_jsx(WalletIconDisplay, { icon: wallet.icon, name: wallet.name }), _jsxs(WalletOptionMeta, { children: [_jsxs("span", { children: [_jsx("strong", { children: wallet.name }), chainTypes.length > 1 && _jsx(MultichainBadge, { children: "Multichain" })] }), _jsx("small", { children: chainTypes.length > 1 ? capabilityLabel : `${capabilityLabel} wallet` })] })] }, wallet.id));
+                        return (_jsxs(WalletOption, { type: "button", disabled: pending, "aria-label": `${intent === "switch" ? "Switch to" : "Connect"} ${walletName} wallet`, onClick: () => chooseWallet(wallet), children: [_jsx(WalletIconDisplay, { icon: wallet.icon, name: walletName }), _jsxs(WalletOptionMeta, { children: [_jsxs("span", { children: [_jsx("strong", { children: walletName }), chainTypes.length > 1 && _jsx(MultichainBadge, { children: "Multichain" })] }), _jsx("small", { children: chainTypes.length > 1 ? capabilityLabel : `${capabilityLabel} wallet` })] })] }, wallet.id));
                     }) }), !selectedWallet && wallets.length === 0 && _jsx(EmptyState, { children: "No compatible installed wallets found" }), error && (_jsx(Hint, { "$tone": "danger", role: "alert", children: error }))] }));
 }

package/dist/components/wallet-connector.test.js

@@ -5,7 +5,9 @@ import { act, cleanup, render, screen, waitFor } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { afterEach, describe, expect, it, vi } from "vitest";
 import { WalletConnector } from "./wallet-connector";
+import { Overlay } from "./styles";
 const connectWallet = vi.fn();
+const createWalletConnectModalConnector = vi.fn();
 let connectErrorHandler;
 let installedWallets = [
     {
@@ -21,12 +23,16 @@ vi.mock("@coin-voyage/crypto/hooks", () => ({
         return { connect: connectWallet };
     },
 }));
+vi.mock("@coin-voyage/crypto/connectors", () => ({
+    createWalletConnectModalConnector: (...args) => createWalletConnectModalConnector(...args),
+}));
 vi.mock("./modal", () => ({
     Modal: ({ open, title, closeDisabled, children, }) => open ? (_jsx("div", { role: "dialog", "aria-label": title, "data-close-disabled": closeDisabled || undefined, children: children })) : null,
 }));
 afterEach(() => {
     cleanup();
-    connectWallet.mockClear();
+    connectWallet.mockReset();
+    createWalletConnectModalConnector.mockReset();
     connectErrorHandler = undefined;
     installedWallets = [
         {
@@ -37,6 +43,10 @@ afterEach(() => {
     ];
 });
 describe("WalletConnector", () => {
+    it("keeps the wallet selector below the WalletConnect modal layer", () => {
+        render(_jsx(Overlay, { "data-testid": "wallet-selector-overlay" }));
+        expect(Number(getComputedStyle(screen.getByTestId("wallet-selector-overlay")).zIndex)).toBeLessThan(2147483647);
+    });
     it("uses switch language when replacing a connected wallet", () => {
         render(_jsx(WalletConnector, { open: true, chainType: ChainType.SOL, intent: "switch", onClose: vi.fn() }));
         expect(screen.getByRole("dialog", { name: "Switch wallet" })).not.toBeNull();
@@ -74,6 +84,50 @@ describe("WalletConnector", () => {
         await user.click(screen.getByRole("button", { name: "Connect Phantom on Solana" }));
         expect(connectWallet).toHaveBeenCalledWith({ walletConnector: solanaConnector });
     });
+    it("opens the WalletConnect modal before connecting an EVM wallet", async () => {
+        const user = userEvent.setup();
+        const headlessConnector = { id: "walletConnect", name: "WalletConnect" };
+        const modalConnector = { id: "walletConnect", name: "WalletConnect Modal" };
+        createWalletConnectModalConnector.mockResolvedValue(modalConnector);
+        installedWallets = [
+            {
+                id: "walletconnect",
+                name: "WalletConnect",
+                connectors: [{ chainType: ChainType.EVM, connector: headlessConnector }],
+            },
+        ];
+        render(_jsx(WalletConnector, { open: true, onClose: vi.fn() }));
+        expect(screen.getByText("Mobile Wallets")).not.toBeNull();
+        await user.click(screen.getByRole("button", { name: "Connect Mobile Wallets wallet" }));
+        expect(createWalletConnectModalConnector).toHaveBeenCalledWith(headlessConnector);
+        expect(connectWallet).toHaveBeenCalledWith({
+            walletConnector: { chainType: ChainType.EVM, connector: modalConnector },
+        });
+        expect([...document.head.querySelectorAll("style")].some((style) => style.textContent?.includes("--w3m-z-index: 2147483647"))).toBe(false);
+    });
+    it("keeps the Solana WalletConnect modal above the wallet selector and cleans up after failure", async () => {
+        const user = userEvent.setup();
+        const solanaConnector = { id: "WalletConnect", name: "WalletConnect" };
+        let failConnect;
+        connectWallet.mockImplementation(() => new Promise((_resolve, reject) => {
+            failConnect = () => reject(new Error("WalletConnect failed"));
+        }));
+        installedWallets = [
+            {
+                id: "walletconnect",
+                name: "WalletConnect",
+                connectors: [{ chainType: ChainType.SOL, connector: solanaConnector }],
+            },
+        ];
+        render(_jsx(WalletConnector, { open: true, chainType: ChainType.SOL, onClose: vi.fn() }));
+        await user.click(screen.getByRole("button", { name: "Connect Mobile Wallets wallet" }));
+        expect(connectWallet).toHaveBeenCalledWith({
+            walletConnector: { chainType: ChainType.SOL, connector: solanaConnector },
+        });
+        expect([...document.head.querySelectorAll("style")].some((style) => style.textContent?.includes("--w3m-z-index: 2147483647"))).toBe(true);
+        failConnect?.();
+        await waitFor(() => expect([...document.head.querySelectorAll("style")].some((style) => style.textContent?.includes("--w3m-z-index: 2147483647"))).toBe(false));
+    });
     it("does not show viem's resource-unavailable error when the wallet prompt is closed", () => {
         render(_jsx(WalletConnector, { open: true, onClose: vi.fn() }));
         act(() => {

package/dist/hooks/use-order-status.d.ts

@@ -1,4 +1,4 @@
-import type { ApiClient } from "@coin-voyage/shared/api";
+import type { ApiClient } from "@coin-voyage/shared/api/browser";
 import type { WebhookEventPayload } from "@coin-voyage/shared/types";
 interface UseOrderStatusProps {
     api: ApiClient;

package/dist/hooks/use-token-data.d.ts

@@ -1,7 +1,7 @@
 import { type Currency } from "@coin-voyage/shared/types";
 export interface SwapToken {
     currency: Currency;
-    balance?: number;
+    balance?: string;
     balanceUsd?: number;
 }
 export declare function useTokenData(): {

package/dist/hooks/use-token-data.js

@@ -1,5 +1,5 @@
 import { useAccount } from "@coin-voyage/crypto/hooks";
-import { fetchTokenList, tokenToCurrency } from "@coin-voyage/shared/currency";
+import { fetchTokenList, formatCurrencyAmount, tokenToCurrency } from "@coin-voyage/shared/currency";
 import { currencyID } from "@coin-voyage/shared/types";
 import { useEffect, useReducer, useState } from "react";
 import { useSwapKit } from "../providers/swapkit-context";
@@ -63,7 +63,7 @@ export function useTokenData() {
                 walletKey,
                 tokens: data.portfolio.flatMap((result) => result.currencies.map(({ balance, currency }) => ({
                     currency,
-                    balance: Number(balance.ui),
+                    balance: formatCurrencyAmount(balance.raw, currency.decimals),
                     balanceUsd: balance.value_usd ?? undefined,
                 }))),
             });

package/dist/hooks/use-token-data.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/hooks/use-token-data.test.js

@@ -0,0 +1,36 @@
+// @vitest-environment jsdom
+import { ChainId, ChainType } from "@coin-voyage/shared/types";
+import { cleanup, renderHook, waitFor } from "@testing-library/react";
+import { afterEach, describe, expect, it, vi } from "vitest";
+import { useTokenData } from "./use-token-data";
+const { api } = vi.hoisted(() => ({ api: { portfolio: vi.fn() } }));
+vi.mock("@coin-voyage/crypto/hooks", () => ({
+    useAccount: () => ({ accounts: [{ address: "0x123", chainType: ChainType.EVM }] }),
+}));
+vi.mock("@coin-voyage/shared/currency", async (importOriginal) => ({
+    ...(await importOriginal()),
+    fetchTokenList: vi.fn().mockResolvedValue({ chains: [] }),
+}));
+vi.mock("../providers/swapkit-context", () => ({
+    useSwapKit: () => ({ api }),
+}));
+afterEach(() => {
+    cleanup();
+    vi.clearAllMocks();
+});
+describe("useTokenData", () => {
+    it.each([
+        { decimals: 6, raw: "1234567", ui: "1.23", expected: "1.234567" },
+        { decimals: 9, raw: "1239999999", ui: "1.24", expected: "1.239999999" },
+        { decimals: 18, raw: "1123456789012345678", ui: "1.12", expected: "1.123456789012345678" },
+        { decimals: 18, raw: "1", ui: "0.00", expected: "0.000000000000000001" },
+    ])("preserves the raw balance at $decimals decimals ($raw)", async ({ decimals, raw, ui, expected }) => {
+        const currency = { id: "eth", chain_id: ChainId.ETH, name: "Ether", symbol: "ETH", decimals };
+        api.portfolio.mockResolvedValue({
+            data: { portfolio: [{ currencies: [{ currency, balance: { raw, ui, value_usd: 12.34 } }] }] },
+        });
+        const { result } = renderHook(() => useTokenData());
+        await waitFor(() => expect(result.current.tokens).toHaveLength(1));
+        expect(result.current.tokens[0]).toEqual({ currency, balance: expected, balanceUsd: 12.34 });
+    });
+});

package/dist/lib/amount-input.d.ts

@@ -1,3 +1,4 @@
+export declare function balanceFraction(balance: string, fraction: number, decimals: number): string;
 export declare function isValidSwapAmountInput(value: string): boolean;
 export declare function toSwapAmountInputValue(amount?: string | null): string;
 export declare function shouldValidateSwapBalance(amount: string): boolean;

package/dist/lib/amount-input.js

@@ -1,4 +1,11 @@
+import { formatCurrencyAmount, parseCurrencyAmount } from "@coin-voyage/shared/currency";
 const DECIMAL_INPUT = /^(?:\d+(?:\.\d*)?|\.\d+)?$/;
+export function balanceFraction(balance, fraction, decimals) {
+    if (fraction === 1)
+        return balance;
+    const raw = BigInt(parseCurrencyAmount(balance, decimals));
+    return formatCurrencyAmount((raw * BigInt(fraction * 100)) / 100n, decimals);
+}
 export function isValidSwapAmountInput(value) {
     return DECIMAL_INPUT.test(value);
 }

package/dist/lib/amount-input.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/lib/amount-input.test.js

@@ -0,0 +1,17 @@
+import { describe, expect, it } from "vitest";
+import { balanceFraction } from "./amount-input";
+describe("balanceFraction", () => {
+    it.each(["1.239999999999999999", "0.000000000000000001", "9007199254740993.123456789012345678", "0"])("preserves the full MAX balance %s", (balance) => {
+        expect(balanceFraction(balance, 1, 18)).toBe(balance);
+    });
+    it.each([
+        [0.25, "0.309999999999999999"],
+        [0.5, "0.619999999999999999"],
+        [0.75, "0.929999999999999999"],
+    ])("floors a %s fraction to spendable base units", (fraction, expected) => {
+        expect(balanceFraction("1.239999999999999999", fraction, 18)).toBe(expected);
+    });
+    it("does not round a fraction up for indivisible tokens", () => {
+        expect(balanceFraction("3", 0.5, 0)).toBe("1");
+    });
+});

package/dist/lib/output-wallet.d.ts

@@ -15,10 +15,9 @@ interface GetSwapWalletRequirementProps {
 }
 export declare function shouldUseSeparateOutputWallet(sourceChainType: ChainType | undefined, destinationChainType: ChainType | undefined): boolean;
 interface ShouldShowOutputWalletSelectorProps {
-    requiresSeparateOutputWallet: boolean;
     outputChainType?: ChainType;
     connectionRequirement: SwapWalletRequirement;
 }
-export declare function shouldShowOutputWalletSelector({ requiresSeparateOutputWallet, outputChainType, connectionRequirement, }: ShouldShowOutputWalletSelectorProps): boolean;
+export declare function shouldShowOutputWalletSelector({ outputChainType, connectionRequirement, }: ShouldShowOutputWalletSelectorProps): boolean;
 export declare function getSwapWalletRequirement({ inputWalletAddress, inputChainType, shouldRestrictInputChainType, outputWalletAddress, outputChainType, }: GetSwapWalletRequirementProps): SwapWalletRequirement;
 export {};

package/dist/lib/output-wallet.js

@@ -2,8 +2,8 @@ import { getChainTypeName } from "@coin-voyage/shared/chain";
 export function shouldUseSeparateOutputWallet(sourceChainType, destinationChainType) {
     return Boolean(sourceChainType && destinationChainType && sourceChainType !== destinationChainType);
 }
-export function shouldShowOutputWalletSelector({ requiresSeparateOutputWallet, outputChainType, connectionRequirement, }) {
-    return Boolean(outputChainType && requiresSeparateOutputWallet && connectionRequirement.target !== "input");
+export function shouldShowOutputWalletSelector({ outputChainType, connectionRequirement, }) {
+    return Boolean(outputChainType && connectionRequirement.target !== "input");
 }
 export function getSwapWalletRequirement({ inputWalletAddress, inputChainType, shouldRestrictInputChainType = true, outputWalletAddress, outputChainType, }) {
     if (!inputWalletAddress) {

package/dist/lib/output-wallet.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/lib/output-wallet.test.js

@@ -0,0 +1,26 @@
+import { ChainType } from "@coin-voyage/shared/types";
+import { describe, expect, it } from "vitest";
+import { shouldShowOutputWalletSelector } from "./output-wallet";
+describe("shouldShowOutputWalletSelector", () => {
+    it("allows changing the recipient when the input wallet is connected", () => {
+        expect(shouldShowOutputWalletSelector({
+            outputChainType: ChainType.EVM,
+            connectionRequirement: { target: "none" },
+        })).toBe(true);
+    });
+    it("allows choosing an address when an output wallet is required", () => {
+        expect(shouldShowOutputWalletSelector({
+            outputChainType: ChainType.SOL,
+            connectionRequirement: { target: "output", label: "Connect Wallet" },
+        })).toBe(true);
+    });
+    it("hides the selector until the input wallet is connected", () => {
+        expect(shouldShowOutputWalletSelector({
+            outputChainType: ChainType.EVM,
+            connectionRequirement: { target: "input", label: "Connect Wallet" },
+        })).toBe(false);
+    });
+    it("hides the selector without a destination chain", () => {
+        expect(shouldShowOutputWalletSelector({ connectionRequirement: { target: "none" } })).toBe(false);
+    });
+});

package/dist/providers/swapkit-context.d.ts

@@ -1,4 +1,4 @@
-import type { ApiClient, APIEnvironment } from "@coin-voyage/shared/api";
+import type { ApiClient, APIEnvironment } from "@coin-voyage/shared/api/browser";
 import type { SwapKitMode, SwapKitTheme } from "../types";
 export interface SwapKitContextValue {
     api: ApiClient;

package/dist/providers/swapkit-provider.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useInWagmiContext } from "@coin-voyage/crypto/evm";
 import { useConnectCallback } from "@coin-voyage/crypto/hooks";
-import { ApiClient } from "@coin-voyage/shared/api";
+import { ApiClient } from "@coin-voyage/shared/api/browser";
 import { generateSessionId } from "@coin-voyage/shared/utils";
 import { useMemo, useState } from "react";
 import { SwapKitContext } from "./swapkit-context";

package/dist/styles/root.js

@@ -42,7 +42,7 @@ export const SwapKitRoot = styled.div `
   display: block;
   width: 100%;
   color: var(--sk-text);
-  background: var(--sk-background);
+  background: ${({ $customTheme }) => $customTheme.background ?? "transparent"};
   font-family: var(--sk-font-family);
   font-size: 16px;
   text-align: left;

package/dist/styles/theme.js

@@ -1,7 +1,7 @@
 export const lightTheme = {
     fontFamily: `Roboto, Arial, Helvetica, sans-serif`,
     background: "#f4f5f7",
-    surface: "#ffffff",
+    surface: "#f4f5f7",
     surfaceElevated: "#f7f8fa",
     border: "#e4e7ec",
     text: "#15181e",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@coin-voyage/swapkit",
   "description": "A reusable cross-chain swap component for CoinVoyage.",
-  "version": "0.3.0",
+  "version": "0.4.0-beta.0",
   "private": false,
   "sideEffects": false,
   "author": "Lars <lars@coinvoyage.io>",
@@ -22,8 +22,8 @@
     "LICENSE"
   ],
   "dependencies": {
-    "@coin-voyage/crypto": "3.5.0",
-    "@coin-voyage/shared": "3.5.0"
+    "@coin-voyage/crypto": "3.6.0-beta.0",
+    "@coin-voyage/shared": "3.6.0-beta.0"
   },
   "devDependencies": {
     "@testing-library/react": "^16.3.0",
@@ -56,14 +56,14 @@
   "scripts": {
     "watch": "tsc -w -p ./tsconfig.json",
     "build": "tsc --build --force",
-    "test": "vitest run --config ./vitest.config.ts",
-    "test:coverage": "vitest run --coverage --maxWorkers=1 --no-file-parallelism --config ./vitest.config.ts",
     "clean": "rm -rf dist tsconfig.tsbuildinfo coverage",
+    "release:build": "pnpm clean && pnpm build",
     "pre:release": "pnpm version prerelease --preid=beta",
     "pre:publish": "pnpm publish --access public --tag beta --no-git-checks",
     "pre:steps": "pnpm pre:release && pnpm pre:publish",
-    "release:build": "pnpm clean && pnpm build",
     "release": "pnpm publish --access public --no-git-checks",
-    "type-check": "tsc --noEmit"
+    "type-check": "tsc --noEmit",
+    "test": "vitest run --config ./vitest.config.ts",
+    "test:coverage": "vitest run --coverage --maxWorkers=1 --no-file-parallelism --config ./vitest.config.ts"
   }
 }