React — Initialization

Install the React integration and wrap your app with the provider so all components can use Signal.

Installation

npm install @signal-js/react

@signal-js/react includes the browser SDK (@signal-js/browser). You do not need to install @signal-js/browser separately.

Provider setup

Wrap your app with SignalProvider at the root (e.g. in main.tsx or App.tsx). Pass options with your API key and project ID. The endpoint is optional and defaults to https://api.trysignal.ai/.

import { SignalProvider } from '@signal-js/react';

function App() {
  return (
    <SignalProvider
      options={{
        apiKey: 'your-api-key',
        projectId: 'your-project-id',
      }}
    >
      <YourApp />
    </SignalProvider>
  );
}

Provider props

Prop	Type	Default	Description
`options`	`SignalOptions`	required	Browser SDK config. Required: `apiKey`, `projectId`. Optional: `endpoint` (defaults to `https://api.trysignal.ai/`). See Configuration.
`autoStart`	`boolean`	`true`	Start recording when the provider mounts
`children`	`ReactNode`	required	Your app tree

Recording starts automatically when the provider mounts unless autoStart is false. Use hooks like useSignal() or useSignalCapture() inside any child component to capture events or identify users.

Getting Started

Features

Integrations

Initialization

React — Initialization

Installation

Provider setup

Provider props

Next steps

​React — Initialization

​Installation

​Provider setup

​Provider props

​Next steps

React — Initialization

Installation

Provider setup

Provider props

Next steps