Components

Headless and accessible. Pass data directly (shown here) or let them fetch via a <PredictionKitProvider>.

ProbabilityBadge

Renders a 0–1 probability as a percentage. Pure — no provider needed.

<ProbabilityBadge probability={0.72} />
ProbabilityBadge
5%25%50%72%95%

MarketCard

Title, probability, source, and status. Pass a market object or a marketId to fetch.

<MarketCard market={market} />
MarketCard

MarketList

Renders many markets. Pass an array or fetch options.

<MarketList markets={markets} />

TrendingMarkets

Fetches trending markets across all providers (requires a provider). See it running on the live demo.

<TrendingMarkets limit={10} />