React
@harkly/react wraps @harkly/js so identity lives in one place and the
widgets are components.
npm install @harkly/react
import { HarklyProvider, FeedbackButton, ChangelogBadge, Messenger } from "@harkly/react";
export function App({ user }) {
return (
<HarklyProvider publicKey="hk_pub_…" user={user ? { id: user.id, email: user.email, plan: user.plan } : null}>
<nav>
<FeedbackButton board="feature-requests">Send feedback</FeedbackButton>
<ChangelogBadge />
</nav>
<Messenger />
</HarklyProvider>
);
}
HarklyProvidertakes everyinitoption plususer; whenuserchanges the SDK identifies (or resets) for you.FeedbackButtonopens the post form. Give it atitleto prefill.ChangelogBadgeshows the unread count and opens the updates panel.Messengermounts the launcher and follows the workspace's settings for side, color and page rules.useHarkly()returns the client fortrack,surveys()andoutbound().
Surveys and outbound messages need nothing extra: call surveys() once on
route change and the one due survey shows itself; outbound() does the same
for banners, chats and announcements.