Skip to main content

​
AGG — Prediction Market Aggregator

AGG provides a suite of npm packages for integrating prediction market data into your application.

​
Packages

PackageDescriptionSize
@agg-market/sdkThin fetch client, zero runtime deps~2KB
@agg-market/hooksReact hooks wrapping the SDK~1-2KB + sdk
@agg-market/uiReady-to-use UI componentsVaries

​
Quick Start

Install the packages you need: 
npm install @agg-market/sdk @agg-market/hooks @agg-market/ui

​
Using the SDK directly

import { createAggClient } from "@agg-market/sdk";

const client = createAggClient({
  apiKey: "your-api-key",
  baseUrl: "https://api.agg.market",
});

const hello = await client.getHello();

​
Using React hooks

import "@agg-market/ui/styles.css";
import { AggProvider } from "@agg-market/hooks";
import { HelloWorld } from "@agg-market/ui/hello-world";
import { createAggClient } from "@agg-market/sdk";

const client = createAggClient({
  apiKey: "your-api-key",
  baseUrl: "https://api.agg.market",
});

function App() {
  return (
    <AggProvider
      client={client}
      config={{
        enableAnimations: true,
      }}
    >
      <HelloWorld />
    </AggProvider>
  );
}

​
Using default UI theme tokens

Import @agg-market/ui/styles.css to use AGG UI defaults out of the box.
Override theme tokens through namespaced CSS variables (for example --agg-color-primary, --agg-color-foreground, --agg-radius-md, and --agg-font-family-sans) on your .agg-root container. enableAnimations is kept as a config placeholder so you can wire your own animation behavior in UI components.