Zorvia Messenger

Bring your Zorvia inbox to your website. The widget connects visitors from your website(s) to your existing workspace.

Install

npm install @zorvia/messenger

Import the Zorvia client, then initialize it with your workspace URL and public live chat key:

import Zorvia from "@zorvia/messenger";

await Zorvia.init({
  workspaceUrl: "https://your-workspace.example.com",
  livechatKey: "your-public-livechat-key",
});

The default client exposes init, open, close, getUnreadMessageCount, onUnreadMessageCountChange, setVisitor, identify, setTheme, setThemeColors, and destroy. Named function exports and TypeScript types are also available:

import { init, type ZorviaConfig } from "@zorvia/messenger";

const config = {
  workspaceUrl: "https://your-workspace.example.com",
  livechatKey: "your-public-livechat-key",
} satisfies ZorviaConfig;

await init(config);

Update visitor data after initialization with the same visitor fields accepted by init:

await Zorvia.setVisitor({
  name: "Jane Visitor",
  email: "[email protected]",
  phone: "+2348012345678",
  customFields: { accountTier: "gold" },
  customData: { plan: "pro" },
});

Read the current unread total or subscribe to future changes for a host-page badge. The listener receives the current count immediately and the returned function removes the subscription:

const currentUnreadCount = Zorvia.getUnreadMessageCount();

const unsubscribe = Zorvia.onUnreadMessageCountChange((count) => {
  document.querySelector("#support-badge")!.textContent = String(count);
});

// Call when your integration is torn down.
unsubscribe();

Match your product theme at init time or update it later without reloading the widget:

await Zorvia.init({
  workspaceUrl: "https://your-workspace.example.com",
  livechatKey: "your-public-livechat-key",
  theme: "light",
  themeColors: {
    light: { background: "#f8fafc" },
    dark: { background: "#0b1220" },
  },
});

// Sync with the host app at runtime.
Zorvia.setTheme("dark");
Zorvia.setThemeColors({
  dark: { background: "#111827" },
});

CDN

Sites without a module bundler can load the standalone browser bundle:

<script src="https://cdn.jsdelivr.net/npm/@zorvia/[email protected]/dist/widget.js"></script>
<script>
  window.zorvia.init({
    workspaceUrl: "https://your-workspace.example.com",
    livechatKey: "your-public-livechat-key",
  });
</script>

window.zorvia is provided only by the standalone CDN bundle for browser-script compatibility. npm imports use the module API.