Embed · Early access

Embed Tripp on your site

Tripp's real travel chat, with its flight and hotel cards, inside your website, and your customers signed in as themselves.

Tripp Partners is in early access. Keys are issued by hand. Apply and we will add your website and send you test keys. Pricing is set per partner during early access, and agreed before live keys are issued.

Quick start

You need a publishable key (starts pk_) and your website's address on Tripp's allowed list. Both come with early access.

<script src="https://heytripp.com/static/embed/v1/tripp.js"></script>
<div id="tripp" style="height:640px"></div>
<script>
  var tripp = Tripp.mount(document.getElementById('tripp'), {
    key: 'pk_test_...',
    onEvent: function (type, detail) { console.log(type, detail); }
  });
  tripp.send('Austin to Denver next weekend, 2 of us');
</script>

The chat fills the element you mount it into, so give that element a height. If your website is not on the allowed list yet, the frame shows a short "not switched on" note instead of the chat.

Embed options

`Tripp.mount(element, options)`

Option	What it does
`key`	Required. Your publishable key.
`onEvent(type, detail)`	Optional. Called for every event the chat sends.
`getUserToken()`	Optional. Returns a token, or a promise of one, from your server. See Signing customers in. Without it the traveler is a guest.

What `mount` returns

Name	What it does
`send(text)`	Puts a message in the chat as if the traveler typed it. Messages sent before the chat is ready wait and go in order.
`setUserToken(token)`	Hands the chat a fresh token yourself, for example right after your customer signs in.
`destroy()`	Removes the chat and stops listening.
`frame`	The iframe itself.

Events

Your onEvent receives these. Each comes with a detail object.

Event	When	Detail
`tripp:ready`	The chat has loaded and can take messages.	none
`tripp:signed-in`	The first token was accepted; the traveler is your signed-in customer.	none
`tripp:message`	The traveler sent a message.	`role`
`tripp:turn-started`	Tripp started working on the reply.	none
`tripp:checkout-requested`	The traveler pressed Book. Nothing is booked or charged inside the embed; take them to your own checkout or to Tripp.	`what`, `price`
`tripp:token-needed`	The token is about to run out. If you passed `getUserToken`, Tripp calls it for you.	none
`tripp:error`	Something went wrong.	`code`: `busy` (a limit was reached), `chat_failed`, or `send_not_ready`; `status` when there is one

React

The same chat as a component. It is shared on request during early access.

<TrippChat
  publishableKey="pk_test_..."
  style={{ height: 640 }}
  onEvent={(type, detail) => console.log(type, detail)}
  onCheckoutRequested={(detail) => openCheckout(detail)}
  getUserToken={() => fetch('/my-server/tripp-token').then(r => r.text())}
/>

A ref gives you ref.current.send(text).

Signing customers in

Without sign-in, travelers are guests: they get the chat and the flight and hotel cards. Signed in, they keep their trip and can use the Tune drawer to adjust results.

Your server vouches for your customer using your secret key (starts sk_). Never put the secret key in a web page; this call answers servers only.

POST https://heytripp.com/api/partner/v1/users/sessions
Authorization: Bearer sk_...
Content-Type: application/json

{ "partner_user_id": "nw_58213" }

{ "user_token": "...", "expires_in": 900 }

partner_user_id is your own id for the customer: 1 to 64 letters, digits, _, . or -. Do not use an email address or a card number.
A token lasts 15 minutes. The chat asks for a fresh one every 12 minutes through getUserToken.
A wrong secret key gets 401; a bad partner_user_id gets 422.

Limits

Early-access limits. Tell us if you need more.

Counted per	Messages
Network address (IP)	20 an hour, for everyone
Signed-in customer	30 an hour, on top of the address limit
All embedded chats together	300 a day

Price comparisons inside the cards have their own, higher allowance. When a limit is reached, your onEvent gets tripp:error with code busy.

Not in the embed yet

Booking and paying. Book sends tripp:checkout-requested and stops. Nothing is booked or charged.
Texts and emails to the traveler.
Group trips and the My Trips list.
Your own colors and logo inside the chat.
Native iPhone and Android components.

Help

Email [email protected] and a person on the Tripp team will answer.