@sessioniq/widget-sdk

v0.4.2

Published

8 months ago

SessionIQ Widget SDK

0High
0Medium
0Low

hmendes00

SessionIQ Widget SDK (`@sessioniq/widget-sdk`)

Overview

Effortlessly integrate SessionIQ's recording capabilities and agent interaction widget into any web application with just a few lines of code.

This package acts as a simple wrapper around the core @sessioniq/client-sdk and the @sessioniq/widget-vue component. It handles:

Initializing the SessionIQ client SDK.
Dynamically loading Vue 3 onto the page if it's not already present.
Mounting the SessionIQ agent widget UI component.
Providing simple controls to interact with the widget (show/hide).

Use this package if you want the quickest way to add the SessionIQ widget to a website, regardless of the framework it uses.

Installation

# Using npm
npm install @sessioniq/widget-sdk

# Using yarn
yarn add @sessioniq/widget-sdk

# Using pnpm
pnpm add @sessioniq/widget-sdk

Basic Usage

Simply import the SDK and call the setup function with your clientId.

<!DOCTYPE html>
<html>
  <head>
    <title>SessionIQ Widget Example</title>
  </head>
  <body>
    <h1>My Application</h1>
    <p>The SessionIQ widget will be loaded here.</p>

    <!-- Your application content -->

    <script type="module">
      import { SessionIQWidgetSdk } from "@sessioniq/widget-sdk";

      (async () => {
        try {
          // Initialize the SDK and widget
          const widgetControls = await SessionIQWidgetSdk.setup({
            clientId: "YOUR_CLIENT_ID", // Replace with your actual Client ID
            // Optional: Specify baseUrl if self-hosting
            // baseUrl: 'https://your-sessioniq-api.com',
            // Optional: Set log level ('debug', 'info', 'warn', 'error', 'silent')
            // logLevel: 'info',
          });

          console.log("SessionIQ Widget SDK Initialized!");

          // You can now use the controls if needed:
          // widgetControls?.openWidget();
          // widgetControls?.closeWidget();
          // widgetControls?.toggleWidget();
        } catch (error) {
          console.error("Failed to initialize SessionIQ Widget SDK:", error);
        }
      })();
    </script>
  </body>
</html>

That's it! The widget will be added to the page (initially hidden) and recording will be managed automatically based on your SessionIQ project settings.

API