@functionspace/ui

Pre-built React widgets for embedding FunctionSpace prediction-market trading. Drop-in components (TradePanel, ConsensusChart, MarketStats, and more) with a 30-token theming system.

Install

npm install @functionspace/ui @functionspace/react @functionspace/core

This package has @functionspace/core and @functionspace/react as dependencies, and React plus Recharts as peer dependencies.

Recharts 2.x is required (recharts@^2.10.0). Recharts 3.x is not yet supported, because the chart widgets rely on recharts 2.x internal DOM classes.

Quick start

import '@functionspace/ui/styles.css';
import { FunctionSpaceProvider } from '@functionspace/react';
import { ConsensusChart, TradePanel, PasswordlessAuthWidget } from '@functionspace/ui';

const config = { baseUrl: 'https://fs-engine-api.onrender.com' };

export default function App() {
  return (
    <FunctionSpaceProvider config={config} theme="fs-dark">
      <PasswordlessAuthWidget />
      <ConsensusChart marketId={1} />
      <TradePanel marketId={1} />
    </FunctionSpaceProvider>
  );
}

Styles

Import the stylesheet once, at your app entry point:

import '@functionspace/ui/styles.css';

Without this import the widgets render unstyled. This is a one-time import; you do not need it per widget.

For AI agents and LLMs

This package is part of the FunctionSpace Trading SDK. Full LLM-targeted reference docs:

• Index: https://docs.functionspace.dev/llms.txt
• This package: https://docs.functionspace.dev/ui.txt

Docs

https://docs.functionspace.dev

License

MIT