React
A referral panel you can drop into your app's settings page.
<ReferralPanel /> shows a customer their share link and progress. It uses your app's theme colors, so it fits in without extra styling.
Preview
Change the props below to see how the panel responds.
string
string
string
string
boolean
number
string
Install
npm install @referral-api/reactUsage
Fetch the referrer on your server, then pass the values to the panel.
import { ReferralPanel } from '@referral-api/react';
import { client } from '@/lib/referral-api';
export default async function Page() {
const referrer = await client.referrers.retrieve('ref_3kT9wQx2');
return (
<ReferralPanel
shareUrl={referrer.shareUrl}
conversions={referrer.stats.conversions}
earned="$60.00"
/>
);
}Props
Prop
Type
How is this guide?