Quickstart

1. Install

@parlays-live/taker ships as TypeScript source inside the parlays.live pnpm workspace (packages/taker), with the economic core in packages/sdk. Two ways to consume it:

pnpm workspace
Vendored package

If your app lives in (or joins) the parlays.live monorepo, add it as a workspace dependency:

package.json

{
  "dependencies": {
    "@parlays-live/taker": "workspace:*"
  }
}

pnpm install

Copy packages/taker and packages/sdk into your repo and register both in your pnpm-workspace.yaml:

pnpm-workspace.yaml

packages:
  - "packages/*"

Then depend on @parlays-live/taker with workspace:* as above. The package’s main points at ./src/index.ts, so your bundler (Vite, Next, etc.) compiles it alongside your app; no build step needed.

Peer dependencies for the React entry point: react >= 18, wagmi >= 2, viem >= 2, @tanstack/react-query >= 5. All of them are optional if you only use the headless core.

2. Create a client

createTakerClient binds the SDK to one deployment: a relayer, an escrow, a collateral token, and a chain. Nothing reads globals, so one bundle can serve any network.

parlays.live testnet
Dev env (HL testnet pricing)

The shared public stack: contracts on HyperEVM testnet (chain 998), priced from HL mainnet HIP-4 markets (that is where HIP-4 lives).

src/lib/taker.ts

import {createTakerClient} from "@parlays-live/taker";

export const taker = createTakerClient({
  relayerUrl: "https://sparrow-relayer.dennis-furrer.workers.dev",
  escrow: "0x77DeFc3E3B66bE01B8468Eb696Ec9F330D24332a",
  collateralToken: "0x75b69d0E8fA3CdB644b0f069E4e876B85A76E137", // test USDC, 6 decimals
  chainId: 998,
});

A private dev stack that prices from HL testnet HIP-4 markets instead. The pricing source is a relayer deployment flag, not a client option:

relayer/wrangler.toml

HL_TESTNET = "true"

The contracts and relayer must be your own deployment (or a shared dev stack configured this way); the public parlays.live relayer prices HL mainnet.

src/lib/taker.ts

import {createTakerClient} from "@parlays-live/taker";

export const taker = createTakerClient({
  relayerUrl: "https://your-relayer.example.workers.dev",
  escrow: "0xYourEscrow",
  collateralToken: "0xYourTestUsdc",
  chainId: 998,
});

All money amounts in the SDK are raw bigint USDC with 6 decimals. Use the re-exported parseUsdc("25") and formatUsdc(raw) helpers; never do float math on stakes or payouts.

3. Mount the provider

Wrap your tree once, inside your existing wagmi and react-query providers:

src/main.tsx

import {WagmiProvider} from "wagmi";
import {QueryClient, QueryClientProvider} from "@tanstack/react-query";
import {ParlayProvider} from "@parlays-live/taker/react";
import {wagmiConfig} from "./wagmi";
import {taker} from "./lib/taker";
import App from "./App";

const queryClient = new QueryClient();

<WagmiProvider config={wagmiConfig}>
  <QueryClientProvider client={queryClient}>
    <ParlayProvider client={taker}>
      <App />
    </ParlayProvider>
  </QueryClientProvider>
</WagmiProvider>;

4. First quote

Build a slip

useParlaySlip holds the picks. Feed toggle(marketId, outcome) from your market buttons (outcome 0 = NO, 1 = YES).

Submit

useSubmitParlay().submit(legs, stake) runs the whole flow: allowance check, relayer quote, taker EIP-712 signature, gasless relay.

src/FirstParlay.tsx

import {useAccount} from "wagmi";
import {parseUsdc, formatUsdc} from "@parlays-live/taker";
import {useParlaySlip, useSubmitParlay} from "@parlays-live/taker/react";

export function FirstParlay() {
  const {address} = useAccount();
  const slip = useParlaySlip();
  const {submit, status, error, result, lastQuote} = useSubmitParlay();

  return (
    <div>
      {/* Wire these to your real market cards */}
      <button onClick={() => slip.toggle(101, 1)}>BTC above $120k: YES</button>
      <button onClick={() => slip.toggle(205, 1)}>France champion: YES</button>

      <button
        disabled={!address || slip.count < 1 || status !== "idle"}
        onClick={() => submit(slip.legs, parseUsdc("25"))}
      >
        {status === "idle" ? `Place ${slip.count}-leg parlay ($25)` : status}
      </button>

      {lastQuote && <p>Payout: ${formatUsdc(BigInt(lastQuote.quote.payout))}</p>}
      {result && <p>Parlay #{result.parlayId} live: {result.txHash}</p>}
      {error && <p>{error}</p>}
    </div>
  );
}

That is the whole integration. status walks through approving -> quoting -> signing -> submitting -> done, and the taker never pays gas (the one exception: a first-time USDC approve transaction if the escrow has no allowance yet).

1. Install

2. Create a client

3. Mount the provider

4. First quote

Next steps

Configuration

Combine button + drawer

​1. Install

​2. Create a client

​3. Mount the provider

​4. First quote

​Next steps

Configuration

Combine button + drawer

1. Install

2. Create a client

3. Mount the provider

4. First quote

Next steps