SigSentry Documentation

Add the SigSentry widget to any web page with a script tag — no React required in your stack

The vanilla embed bundles React internally and exposes a global SigSentry object. Use it when your app isn't a React app, or when you want a no-build script-tag integration.

Quickstart

<!-- Anywhere in your page -->
<div id="sigsentry-widget"></div>

<script src="https://embed.sigsentry.com/v1/embed.js"></script>
<script>
  SigSentry.init({
    target: '#sigsentry-widget',
    apiKey: 'ss_pub_...',
    theme: 'auto',
  });
</script>

That's the entire integration. The widget renders inside the target element, identical to the React <AnalysisWidget />.

ESM usage

If you do have a build step, you can import the embed entry directly:

import { init, destroy } from '@sigsentry/react/embed';

const instance = init({
  target: '#widget',
  apiKey: 'ss_pub_...',
});

// Later
instance.destroy();

`SigSentry.init(config)`

Returns a { destroy() } instance. Calling init() twice on the same target unmounts the previous instance first.

Option	Type	Default	Description
`target`	`string \| HTMLElement`	required	CSS selector or DOM element to mount into
`apiKey`	`string`	required	A SigSentry public client key
`baseUrl`	`string`	`https://api.sigsentry.com`	Override the API host
`theme`	`'light' \| 'dark' \| 'auto'`	`'light'`	Color theme
`mode`	`'inline' \| 'modal' \| 'slideout'`	`'inline'`	Render the widget directly, or render a trigger button
`triggerLabel`	`string`	`'Report Issue'`	Button label when `mode` is `'modal'` or `'slideout'`

Inline mode

Renders the full widget directly inside target:

<div id="diagnose"></div>
<script>
  SigSentry.init({
    target: '#diagnose',
    apiKey: 'ss_pub_...',
    mode: 'inline',
    theme: 'dark',
  });
</script>

Renders a trigger button inside target. Clicking it opens the widget in an overlay:

<div id="diagnose-trigger"></div>
<script>
  SigSentry.init({
    target: '#diagnose-trigger',
    apiKey: 'ss_pub_...',
    mode: 'slideout',
    triggerLabel: 'Diagnose Error',
  });
</script>

`SigSentry.destroy(target)`

Unmount and clean up:

<script>
  SigSentry.destroy('#sigsentry-widget');
</script>

Or use the instance returned from init():

const instance = SigSentry.init({ target: '#widget', apiKey: '...' });
instance.destroy();

When to use vanilla over React

Non-React stacks

Vue, Svelte, Rails, server-rendered PHP, plain HTML — anything that isn't a React tree.

Embed in customer-facing apps

Drop into a marketing site or status page without adopting React.

CMS / no-build sites

WordPress, Webflow, or any environment where you can paste a script tag but can't run a bundler.

Legacy apps

Older codebases where adding a peer dependency on React isn't appealing.

If your app is already a React app, use the components directly — you avoid double-bundling React.

Versioning

The script URL is versioned. Pin to a major version to avoid breaking changes:

<script src="https://embed.sigsentry.com/v1/embed.js"></script>

Newer majors will be published alongside v1 — your existing pages keep working until you upgrade.

Vanilla JS embed