@camada/react

React component for the camada beacon: <CamadaBeacon /> renders the first-party beacon <script> tag served by a camada backend SDK.

No hooks, no client-only APIs — it works as a React Server Component, in SSR (renderToString), and in plain client React.

Install

npm install @camada/react

Requires react >= 18 as a peer dependency.

Quickstart

import { CamadaBeacon } from '@camada/react';

export default function Layout({ children }) {
  return (
    <html>
      <body>
        {children}
        <CamadaBeacon rid={requestId} />
      </body>
    </html>
  );
}

Renders <script src="/_cam/b.js?r=<rid>" async />. The script itself is the @camada/browser self-initializing beacon, served first-party by the backend SDK: @camada/node and @camada/hono serve it at /_cam/b.js, the default here. @camada/next wraps this component in its own async <CamadaBeacon /> with the default src /api/camada/b.js and the rid read from the middleware's x-camada-rid header — use that one in a Next app rather than this component directly.

The component reports no version of its own; the beacon it loads stamps sdk: "@camada/browser/<version>" on its payload, which is what the dashboard uses to flag an outdated beacon.

Props

| Prop | Type | Default | Meaning | | ----- | ---------------- | -------------- | ---------------------------------------------------------- | | src | string | '/_cam/b.js' | Path the backend SDK serves the beacon from. | | rid | string \| null | — | Request id for this page view; appended as ?r=<rid>. |

The props type is exported as CamadaBeaconProps.

Development

npm install
npm run build   # tsup (ESM + CJS + d.ts)
npm test        # vitest (renderToString)
npm run check   # tsc --noEmit