React Hooks

Wagmi-wired hooks from @0xslots/sdk/react. Requires wagmi, viem, and @tanstack/react-query as peer dependencies.

`useSlotsClient`

Creates a memoized SlotsClient from wagmi's public and wallet clients.

import { useSlotsClient } from "@0xslots/sdk/react";
 
const client = useSlotsClient();                        // connected chain
const client = useSlotsClient({ chainId: 84532 });      // override the chain
const client = useSlotsClient({ factoryAddress });      // needed for createSlot

The config is optional: factoryAddress (only createSlot and collectAll need it), offerBookAddress (defaults to the book recorded for the chain) and chainId. useCollectivesClient({ factoryAddress?, chainId? }) does the same for CollectivesClient.

`useSlotAction`

Every write, wrapped in shared pending/receipt tracking.

import { useSlotAction } from "@0xslots/sdk/react";
 
const {
  createSlot,                                        // factory
  buy, release, liquidate, liquidateAndBuy,          // occupancy
  selfAssess, topUp, withdraw, manageTerms, setOperator, // holding
  collect, collectAll, claim,                        // money out
  proposeTerms, cancelTerms, acceptFee, acceptScopes, setManager, // manager
  postOffer, cancelOffer, authorizeOfferBook, acceptOffer, // OfferBook
  client,        // the underlying SlotsClient
  exec,          // run any write with the same tracking
  preflight,     // run a read or signature, reporting failure the same way
  busy,          // isPending || isConfirming
  isPending,     // wallet interaction in progress
  isConfirming,  // waiting for on-chain confirmation
  isSuccess,
  activeAction,  // label of the current action
} = useSlotAction({
  onSuccess: (label, hash) => console.log(`${label}: ${hash}`),
  onError: (label, error) => console.error(`${label}: ${error}`),
});

Failures are reported through onError rather than thrown — a module's veto arrives with its own error name — and an action resolves to the hash, or undefined when it failed. useSlotAction also accepts the useSlotsClient config.

proposeTerms(slot, { taxRateBps?, recipient?, minRunwaySeconds?, moduleTerms? }) queues any mix of terms; cancelTerms(slot, mask?) retracts them, and its activeAction label names the term being cancelled when mask is a single TERMS bit.

Reading a slot

There is no read hook. Reads go through the client, which returns plain promises you can hand to whatever query library the app already uses.

import { useQuery } from "@tanstack/react-query";
import { useSlotsClient } from "@0xslots/sdk/react";
 
function useSlot(address: `0x${string}`) {
  const client = useSlotsClient();
  return useQuery({
    queryKey: ["slot", address],
    queryFn: () => client.slotState(address),
  });
}

slotState returns occupancy, price, deposit, tax owed, the terms, the module and the scopes this slot accepted from it, in one call.