React

The widget directly integrated as a React component.

What it is

@humaner/react wraps the same hosted widget as the embed snippet but with React props and SSR-safe loading.

Install

Terminal

npm install @humaner/react

Use it

app/page.tsx

import { HumanerChat } from '@humaner/react';

export default function Page() {
  return (
    <HumanerChat
      agentId="ag_demo123"
      position="bottom-right"
    />
  );
}

Prop	Type	What it does
agentId	string	Your public agent ID
position	"bottom-right" \| "bottom-left"	Where the bubble sits
color	string	Accent color
greeting	string	One-off greeting override for this embed
defaultOpen	boolean	Open the panel as soon as it mounts
window.Humaner.message	string \| { text }	Show a proactive teaser + badge on the closed launcher