Static demo data
These components are shown with mock data. Visit the live demo to see real data in action.
Full Dashboard
Complete AffiliateDashboard component
Affiliate Dashboard
Track your referrals and earnings
Total Clicks
1,247
Signups
89
Conversion Rate
7.1%
Paid Referrals
67
Earnings Summary
Total Earned
$2,847.50
Pending
$52.50
Available
$112.50
Recent Referrals
john.doe@example.com
12/1/2024
jane.smith@example.com
12/5/2024
alex.wilson@example.com
12/20/2024
sarah.johnson@example.com
12/28/2024
mike.brown@example.com
12/30/2024
Individual Components
Total Clicks
1,247
Signups
89
Total Earned
$2,847.50
Conversion Rate
7.1%
Earnings Summary
Total Earned
$2,847.50
Pending
$52.50
Available
$112.50
Recent Referrals
john.doe@example.com
12/1/2024
jane.smith@example.com
12/5/2024
alex.wilson@example.com
12/20/2024
sarah.johnson@example.com
12/28/2024
mike.brown@example.com
12/30/2024
No referrals yet. Share your link to get started!
Quick Start
Import and use in your Next.js app
import { AffiliateDashboard } from "@workspace/elements"
export default function MyAffiliatePage() {
return (
<AffiliateDashboard
affiliateLink={affiliateData}
referrals={referrals}
baseUrl="https://yourapp.com"
pendingEarnings={100}
availableForPayout={500}
/>
)
}