We're glad you're here. These docs show you how to add an agent to your product that sees the page your users are on and helps them get things done, by chat or voice.
Linen blazer
$90.99
Each guide takes you through the install in less than five minutes.
A few small pieces of code tell the agent what it can do, what it can see and where to stop.
Declare what the agent can do. It decides when to call your handler based on what the user asks.
Define an intentIntents and intent states go to the widget.
“Add two of these to my cart.”
It reads the message and picks an intent.
onIntent fires in the user's browser.
The user hears back in the chat.
Want the full picture? Read the intents overview
Swap the Chat button for a robot at the bottom center of the page. Pick one to try it.
A hand-drawn outline
Create a project in the dashboard and copy its key from the Install page.
Drop in the SDK for your stack. The agent appears on your site, ready to chat or talk.
Share your routes and intents so it can move around your app and call your code.
$ npm install @vableai/react
The agent clicks buttons, fills in forms and reads what's on screen. You choose what stays off limits.
Keep controls for your usersIntents turn your functions into actions, so a request can become a real change in your app.
Define an intentPlug in your routes, and the agent takes people to the page that answers their request.
Set up routingPass an access token to greet users by name and keep conversations tied to their account.
Identify your usersYes. Add data-vable-no-op to a control, or to a parent to cover everything inside it. The agent will ask the user to do it themselves.
No, anonymous visitors can use the widget. In React and Vue, you can pass an access token to greet signed-in users by name and save their details with new conversations.
No. Actions run in the user's browser through intents, so they use the session your app already has.
No, it only learns that the intent was sent. If it needs to know the outcome, expose it with useIntentState.
Yes. In React, set your colors with theme or fix light or dark mode with presetTheme. You can also swap the Chat button for a robot, or use your own image.
Pick a guide and install VableAI in less than five minutes.
Start building