Skip to main content

By the time you embed the widget, the execution path should already exist: base URL, session headers, tools, and optional knowledge.

What this page does

The Activate Agent page is where you:
  • choose the environment
  • get the widget install snippet
  • configure widget appearance and behavior
  • write custom instructions
  • enable screen autopilot
  • turn on signed widget tokens
  • set user rate limits

Framework options

Warpy supports a plain script tag and the @warpy-ai/widget package.

Script tag

Local

<script src="http://localhost:5173/widget/agent.js"
  data-agent-id="e68149c5-d0ff-4260-8be0-a5cac56beda6"
  data-base-url="http://localhost:8000"
></script>
Paste it before the closing </body> tag.

Production

<script src="https://cdn.warpy.ai/widget.js"
  data-agent-id="YOUR_AGENT_ID"
  data-base-url="https://api.yourcompany.com"
></script>

Package manager

npm

npm install @warpy-ai/widget

Usage

import { Widget } from "@warpy-ai/widget/react"

<Widget
  agentId="YOUR_AGENT_ID"
  baseUrl="https://api.yourcompany.com"
  scriptSrc="https://cdn.warpy.ai/widget.js"
/>
The package also supports Vue, Angular, Svelte, and a vanilla mount helper.

What each install field means

FieldWhat it controls
agentIdthe Warpy agent the widget should talk to
baseUrlthe environment base URL used for backend tool execution and widget token refresh
scriptSrcwhere the widget loader script is served from
If you only use frontend actions and do not need backend tools or widget token refresh, baseUrl can be omitted.

Environment tabs

The environment selector swaps the install snippet between your saved base URLs. That is why it is important to define local and production first in API config.

The rest of the page

  1. Test on local.
  2. Validate one real backend tool and one real UI action.
  3. White-label the widget before exposing it to end users.
  4. Turn on signed widget tokens if your deployment requires it.
  5. Move to production.