@moveo-ai/web-client 0.110.0-true.1 → 0.110.0-true.11

package/README.md

@@ -215,13 +215,51 @@ payload listed below.
 | `onNoUnreadMessages(cb)`   | The unread indicator clears                    | —                                               |
 | `onUserActivity(cb)`       | The visitor interacts with the widget          | —                                               |
 | `onMemberLeave(cb)`        | An agent leaves the conversation               | —                                               |
-| `onAnalyticsEvent(cb)`     | Any interaction event (see below)              | `{ timestamp, event, session_id?, properties }` |
+| `onAnalyticsEvent(cb)`     | The widget loads, and every interaction        | `{ timestamp, event, session_id?, properties }` |
 
 `onAnalyticsEvent` receives every interaction the widget tracks, identified by
 the `event` field: `session_start`, `session_end`, `message_sent` (the user sent
 a message — never carries the text), `launcher_clicked`, `rating_submitted`, and
 the rest of the `AnalyticsEvent` enum in `src/hooks/useAnalytics.ts`.
 
+It also receives one event that is not an interaction: **`widget_loaded`**,
+raised as soon as the widget renders on the page. It carries no `session_id`,
+because a session opens only when the visitor opens the chat. Register the
+callback at any time — a callback added after the widget loaded still receives
+`widget_loaded` on registration, so the event cannot be missed in the race
+between `init()` resolving and your `.then()` running.
+
+#### How the header controls end a conversation
+
+Two header controls can end a conversation, and they report differently.
+
+**The close button (X)** asks first. Once the conversation has messages, it
+opens a confirmation offering **End conversation** and **Minimize**. Ending
+runs the end-of-chat survey when the account has one. On an empty chat, or
+while a prompt or webview owns the panel, it just hides the panel. Set
+`close_minimizes_window: true` and the button always minimizes and never ends.
+
+**Restart**, in the header title menu, does not ask. It ends the conversation
+and opens the next one in place, with the panel still open, and shows no
+end-of-chat survey.
+
+During a voice call the close button ends the call, after its own confirmation.
+
+Which event to count:
+
+| Event                               | Fires when                                                 | Means the conversation ended |
+| ----------------------------------- | ---------------------------------------------------------- | ---------------------------- |
+| `close_icon_clicked`                | The visitor presses X, before they answer the confirmation | No                           |
+| `popover_end_chat_clicked`          | They confirm **End conversation**                          | Yes                          |
+| `popover_end_chat_continue_clicked` | They pick **Minimize** instead                             | No                           |
+| `restart_conversation_clicked`      | They pick **Restart** from the menu                        | Yes                          |
+
+Add `popover_end_chat_clicked` and `restart_conversation_clicked` for the
+number of conversations visitors ended themselves. `close_icon_clicked` counts
+presses, not conversations: count it as an end and you overstate your totals.
+`onSessionClosed` covers the visitor-confirmed end, and `onConversationClosed`
+covers a close that came from the agent side, so neither alone is a total.
+
 ### Forward widget events into your analytics
 
 The widget never writes into your analytics tools. If you want chat activity in
@@ -232,9 +270,17 @@ and where. With Quantum Metric, for example:
 MoveoAI.init({ integrationId: 'YOUR_INTEGRATION_ID' }).then((controller) => {
   // Event ids must exist in your Quantum Metric configuration first:
   // sendEvent() silently drops ids that are not defined for the page.
-  const QM_MOVEO_SESSION = 901; // example ids — define your own
+  const QM_MOVEO_LOADED = 900; // example ids — define your own
+  const QM_MOVEO_SESSION = 901;
   const QM_MOVEO_MESSAGE = 902;
 
+  controller.onAnalyticsEvent(({ event }) => {
+    if (event === 'widget_loaded') {
+      // Fires on every page that carries the widget, with no visitor action.
+      window.QuantumMetricAPI?.sendEvent(QM_MOVEO_LOADED, 0, '');
+    }
+  });
+
   controller.onSessionCreated(({ session_id }) => {
     // The Moveo session id becomes searchable on the QM session,
     // joining every replay to its Moveo conversation.
@@ -278,6 +324,35 @@ MoveoAI.init({
 });
 ```
 
+### Inactivity Timeout
+
+The widget opens an inactivity modal once the visitor goes quiet, and asks
+whether to keep the conversation. Set `inactivity_timeout` in minutes to change
+when it appears. Set it in the integration's configuration, or override it on
+`init()`:
+
+```javascript
+MoveoAI.init({
+  integrationId: 'YOUR_INTEGRATION_ID',
+  inactivity_timeout: 20, // minutes; 0 turns the modal off
+});
+```
+
+| Value                             | Effect                                     |
+| --------------------------------- | ------------------------------------------ |
+| `0`                               | No modal. The widget still tracks activity |
+| `3` to `30`                       | The modal opens after that many minutes    |
+| Below `3`, or above `30`          | Clamped into the 3 to 30 minute range      |
+| Absent, negative, or not a number | The default, 10 minutes                    |
+
+Below 3 minutes the modal interrupts a visitor who only stopped to read. Above
+30 it holds a dead session open for hours. A negative value falls back to the
+default rather than to `0`, so a malformed configuration cannot switch the
+modal off without anyone noticing.
+
+Only activity inside the widget counts. A visitor who scrolls your page but
+does not touch the chat is inactive.
+
 ### CSS Variables
 
 Pass any of these to `setCSSVariables()` to restyle the widget. Every value is
@@ -340,9 +415,42 @@ Every other variable in the table applies inside the widget iframe.
 `--nbg-bg` also exists, for one account's variant styling. It is not part of
 the supported surface.
 
-Colours are better set through the integration's `theme_colors` config, which
-drives the accent, background, border, text, launcher, rating, send-icon, link
-and swimmlane colours for the light and dark themes.
+#### Colours
+
+Set colours in the integration's `theme_colors` config, which carries a `light`
+and a `dark` set. Each key writes one CSS variable, so the same colours can be
+overridden at runtime through `setCSSVariables()`, which wins over the config.
+
+| `theme_colors` key     | CSS variable                        | Controls                                                    |
+| ---------------------- | ----------------------------------- | ----------------------------------------------------------- |
+| `accent_color`         | `--color-accent`                    | The accent, and the default for every colour marked below   |
+| `background_color`     | `--color-background`                | The widget surface, and the area behind the messages        |
+| `border_color`         | `--color-border`                    | Panel, composer and card borders                            |
+| `header_color`         | `--moveo-header-background`         | Header background                                           |
+| `text_color_header`    | `--moveo-header-text-color`         | Header text and icons                                       |
+| `text_color_user`      | `--color-text-primary-foreground`   | Text inside the visitor's own bubbles                       |
+| `text_color_agent`     | `--color-text-secondary-foreground` | Text inside the agent's bubbles                             |
+| `launcher_background`  | `--color-launcher-background`       | Launcher bubble; defaults to the accent                     |
+| `launcher_foreground`  | `--color-launcher-foreground`       | Launcher icon; defaults to the widget background            |
+| `link_color`           | `--color-link`                      | Links in messages; defaults to the accent                   |
+| `rating_background`    | `--color-rating-background`         | Selected rating button; defaults to the accent              |
+| `send_icon_color`      | `--color-send-icon`                 | Send icon in the composer; defaults to the accent           |
+| `swimmlane_background` | `--color-swimmlane-background`      | System message pill background                              |
+| `swimmlane_foreground` | `--color-swimmlane-foreground`      | System message pill text; defaults to the agent text colour |
+
+A colour that says "defaults to" follows `--color-accent` — or the colour named
+— until you set it. So an accent alone restyles the links, the rating, the send
+icon and the launcher, and `--color-chat-background` follows the background.
+
+Four more colours have no `theme_colors` key, so they are set through
+`setCSSVariables()` only:
+
+| Variable                     | Controls                                             |
+| ---------------------------- | ---------------------------------------------------- |
+| `--color-chat-background`    | The area behind the messages; follows the background |
+| `--color-options-background` | Quick reply button background                        |
+| `--color-options-foreground` | Quick reply button label; defaults to the accent     |
+| `--color-options-border`     | Quick reply button border; defaults to the accent    |
 
 #### Renamed variables
 

package/dist/63.min.js.LICENSE.txt

@@ -1,6 +1,6 @@
 /*!
  * 
- *   @moveo-ai/web-client v0.110.0-true.1
+ *   @moveo-ai/web-client v0.110.0-true.11
  *   Copyright (c) Moveo.ai (TM)
  *
  */

package/dist/752.min.js.LICENSE.txt

@@ -1,6 +1,6 @@
 /*!
  * 
- *   @moveo-ai/web-client v0.110.0-true.1
+ *   @moveo-ai/web-client v0.110.0-true.11
  *   Copyright (c) Moveo.ai (TM)
  *
  */

package/dist/882.min.js.LICENSE.txt

@@ -1,6 +1,6 @@
 /*!
  * 
- *   @moveo-ai/web-client v0.110.0-true.1
+ *   @moveo-ai/web-client v0.110.0-true.11
  *   Copyright (c) Moveo.ai (TM)
  *
  */

package/dist/929.min.js.LICENSE.txt

@@ -1,6 +1,6 @@
 /*!
  * 
- *   @moveo-ai/web-client v0.110.0-true.1
+ *   @moveo-ai/web-client v0.110.0-true.11
  *   Copyright (c) Moveo.ai (TM)
  *
  */