@cuekit-ai/react 1.6.8 → 1.6.10

package/dist/{chunk-ZP7AXODE.mjs → chunk-XVA5MZMJ.mjs}

@@ -5901,8 +5901,8 @@ function requireEvents() {
       ReflectApply(handler, this, args);
     } else {
       var len = handler.length;
-      var listeners = arrayClone(handler, len);
-      for (var i = 0; i < len; ++i) ReflectApply(listeners[i], this, args);
+      var listeners2 = arrayClone(handler, len);
+      for (var i = 0; i < len; ++i) ReflectApply(listeners2[i], this, args);
     }
     return true;
   };
@@ -6018,7 +6018,7 @@ function requireEvents() {
   };
   EventEmitter.prototype.off = EventEmitter.prototype.removeListener;
   EventEmitter.prototype.removeAllListeners = function removeAllListeners(type) {
-    var listeners, events2, i;
+    var listeners2, events2, i;
     events2 = this._events;
     if (events2 === void 0) return this;
     if (events2.removeListener === void 0) {
@@ -6044,12 +6044,12 @@ function requireEvents() {
       this._eventsCount = 0;
       return this;
     }
-    listeners = events2[type];
-    if (typeof listeners === "function") {
-      this.removeListener(type, listeners);
-    } else if (listeners !== void 0) {
-      for (i = listeners.length - 1; i >= 0; i--) {
-        this.removeListener(type, listeners[i]);
+    listeners2 = events2[type];
+    if (typeof listeners2 === "function") {
+      this.removeListener(type, listeners2);
+    } else if (listeners2 !== void 0) {
+      for (i = listeners2.length - 1; i >= 0; i--) {
+        this.removeListener(type, listeners2[i]);
       }
     }
     return this;
@@ -6062,7 +6062,7 @@ function requireEvents() {
     if (typeof evlistener === "function") return unwrap ? [evlistener.listener || evlistener] : [evlistener];
     return unwrap ? unwrapListeners(evlistener) : arrayClone(evlistener, evlistener.length);
   }
-  EventEmitter.prototype.listeners = function listeners(type) {
+  EventEmitter.prototype.listeners = function listeners2(type) {
     return _listeners(this, type, true);
   };
   EventEmitter.prototype.rawListeners = function rawListeners(type) {
@@ -23349,7 +23349,7 @@ function normalizeToNavigationCommand(message) {
 var room = null;
 var reconnectTimeout = null;
 var serverUrl = WEBRTC_BACKEND_SERVER_URL || "https://api-webrtc.ansyr.ai";
-var callbacks = {};
+var listeners = /* @__PURE__ */ new Set();
 var audioContainerRef = null;
 var livekitUrl = null;
 var token = null;
@@ -23360,16 +23360,21 @@ function setServerUrl(url) {
 function setAudioContainer(newAudioContainerRef) {
   audioContainerRef = newAudioContainerRef;
 }
+function registerWebRTCCallbacks(callback) {
+  listeners.add(callback);
+  console.log("\u{1F4E1} WebRTC listener registered. Total listeners:", listeners.size);
+}
+function unregisterWebRTCCallbacks(callback) {
+  listeners.delete(callback);
+  console.log("\u{1F4E1} WebRTC listener unregistered. Total listeners:", listeners.size);
+}
 function setWebRTCCallbacks(newCallbacks) {
-  console.log("\u{1F4E1} setWebRTCCallbacks called with:", {
-    hasOnNavigationCommand: !!newCallbacks.onNavigationCommand,
-    hasOnConnectionStateChange: !!newCallbacks.onConnectionStateChange,
-    hasOnParticipantUpdate: !!newCallbacks.onParticipantUpdate
-  });
-  callbacks = newCallbacks;
+  console.warn("\u26A0\uFE0F setWebRTCCallbacks is deprecated. Use registerWebRTCCallbacks instead.");
+  listeners.clear();
+  listeners.add(newCallbacks);
 }
 function getCurrentCallbacks() {
-  return callbacks;
+  return Array.from(listeners)[0] || {};
 }
 async function authenticate(userIdentity, apiKey, appId, language) {
   try {
@@ -23428,7 +23433,7 @@ async function connectToRoom(newLivekitUrl, newToken) {
 function setupEventListeners() {
   if (!room) return;
   room.on(RoomEvent.ConnectionStateChanged, (state) => {
-    callbacks.onConnectionStateChange?.(state);
+    listeners.forEach((l) => l.onConnectionStateChange?.(state));
     if (state === ConnectionState.Connected) {
       setWebRTCConnectionState({ isConnected: true, isConnecting: false });
     } else if (state === ConnectionState.Disconnected) {
@@ -23449,11 +23454,17 @@ function setupEventListeners() {
           audioContainerRef.current.appendChild(element);
           if (element instanceof HTMLAudioElement) {
             const trackId = track.sid || `track_${Date.now()}_${Math.random()}`;
-            callbacks.onAISpeechStart?.(trackId);
+            listeners.forEach((l) => l.onAISpeechStart?.(trackId));
             element.play().catch((error) => {
             });
-            element.addEventListener("ended", () => callbacks.onAISpeechEnd?.(trackId));
-            element.addEventListener("pause", () => callbacks.onAISpeechEnd?.(trackId));
+            element.addEventListener(
+              "ended",
+              () => listeners.forEach((l) => l.onAISpeechEnd?.(trackId))
+            );
+            element.addEventListener(
+              "pause",
+              () => listeners.forEach((l) => l.onAISpeechEnd?.(trackId))
+            );
           }
         }
       }
@@ -23469,13 +23480,14 @@ function setupEventListeners() {
       const jsonPart = parts[1];
       console.log("\u{1F4E1} WebRTC Pipe-separated message:", { textPart, jsonPart });
       if (textPart) {
-        callbacks.onNavigationCommand?.({ type: "speech_text", data: textPart });
+        listeners.forEach((l) => l.onNavigationCommand?.({ type: "speech_text", data: textPart }));
       }
       if (jsonPart) {
         try {
           const message = JSON.parse(jsonPart);
           console.log("\u{1F4E1} WebRTC Parsed JSON message:", message);
-          callbacks.onNavigationCommand?.(normalizeToNavigationCommand(message));
+          const normalized = normalizeToNavigationCommand(message);
+          listeners.forEach((l) => l.onNavigationCommand?.(normalized));
         } catch (error) {
           console.log("\u{1F4E1} WebRTC JSON parse error for JSON part:", error, "JSON part:", jsonPart);
         }
@@ -23484,11 +23496,12 @@ function setupEventListeners() {
       try {
         const message = JSON.parse(decodedPayload);
         console.log("\u{1F4E1} WebRTC Parsed message:", message);
-        callbacks.onNavigationCommand?.(normalizeToNavigationCommand(message));
+        const normalized = normalizeToNavigationCommand(message);
+        listeners.forEach((l) => l.onNavigationCommand?.(normalized));
       } catch (error) {
         console.log("\u{1F4E1} WebRTC JSON parse error:", error, "Raw payload:", decodedPayload);
         const message = decodedPayload;
-        callbacks.onNavigationCommand?.({ type: "raw_text", data: message });
+        listeners.forEach((l) => l.onNavigationCommand?.({ type: "raw_text", data: message }));
       }
     }
   }).on(RoomEvent.Disconnected, () => {
@@ -23502,7 +23515,7 @@ function updateParticipantsList() {
     ...Array.from(room.remoteParticipants.values()).map((p) => p.identity)
   ];
   setWebRTCConnectionState({ participants });
-  callbacks.onParticipantUpdate?.(participants);
+  listeners.forEach((l) => l.onParticipantUpdate?.(participants));
 }
 async function sendData(data, reliable = true) {
   if (!room) throw new Error("Not connected to room");
@@ -23635,6 +23648,8 @@ export {
   validateDynamicElements,
   setServerUrl,
   setAudioContainer,
+  registerWebRTCCallbacks,
+  unregisterWebRTCCallbacks,
   setWebRTCCallbacks,
   getCurrentCallbacks,
   authenticate,

package/dist/cuekit.css

@@ -22,19 +22,23 @@
   --voice-border: 252 31% 91%;
   --voice-text: 222.2 84% 4.9%;
   --voice-text-muted: 252 16% 47%;
-  --voice-accent: 252 81% 60%;
+  --voice-accent: 252 78% 60%; /* #6257d9 */
+  --voice-accent-vibrant: 245 84% 77%; /* #9a92f6 */
+  --voice-accent-dark: 246 57% 54%; /* #5447cd */
   --voice-accent-light: 252 100% 96%;
-  --voice-user-bubble: 252 81% 60%;
+  --voice-user-bubble: 252 78% 60%;
   --voice-user-text: 0 0% 100%;
   --voice-ai-bubble: 0 0% 100%;
   --voice-ai-text: 222.2 84% 4.9%;
-  --indicator-bg: 252 81% 60%;
+  --indicator-bg: 252 78% 60%;
+  --voice-status-bg: 252 100% 96%;
+  --voice-status-text: 252 78% 60%;
   --voice-placeholder: 252 16% 47%;
 
   /* Gradients Light - Purple */
-  --gradient-primary: linear-gradient(135deg, hsl(252 81% 60%), hsl(252 88% 70%));
-  --gradient-surface: linear-gradient(180deg, hsl(0 0% 100%), hsl(252 40% 98%));
-  --gradient-mic-button: radial-gradient(circle at 50% 0%, hsl(252 88% 77%), hsl(252 66% 59%));
+  --gradient-primary: linear-gradient(135deg, #8177ed, #9a92f6);
+  --gradient-surface: linear-gradient(180deg, #ffffff, #f6f5ff);
+  --gradient-mic-button: radial-gradient(circle at 50% 0%, #9a92f6, #6257d9);
 
   /* Shadows Light */
   --shadow-soft: 0 4px 20px -2px hsl(252 81% 60% / 0.1);
@@ -49,18 +53,20 @@
   --voice-border: 252 31% 91%;
   --voice-text: 222.2 84% 4.9%;
   --voice-text-muted: 252 16% 47%;
-  --voice-accent: 252 81% 60%;
+  --voice-accent: 252 78% 60%;
+  --voice-accent-vibrant: 245 84% 77%;
+  --voice-accent-dark: 246 57% 54%;
   --voice-accent-light: 252 100% 96%;
-  --voice-user-bubble: 252 81% 60%;
+  --voice-user-bubble: 252 78% 60%;
   --voice-user-text: 0 0% 100%;
   --voice-ai-bubble: 0 0% 100%;
   --voice-ai-text: 222.2 84% 4.9%;
-  --indicator-bg: 252 81% 60%;
+  --indicator-bg: 252 78% 60%;
   --voice-placeholder: 252 16% 47%;
-  --gradient-primary: linear-gradient(135deg, hsl(252 81% 60%), hsl(252 88% 70%));
-  --gradient-surface: linear-gradient(180deg, hsl(0 0% 100%), hsl(252 40% 98%));
-  --gradient-mic-button: radial-gradient(circle at 50% 0%, hsl(252 88% 77%), hsl(252 66% 59%));
-  --shadow-soft: 0 4px 20px -2px hsl(252 81% 60% / 0.1);
+  --gradient-primary: linear-gradient(135deg, #8177ed, #9a92f6);
+  --gradient-surface: linear-gradient(180deg, #ffffff, #f6f5ff);
+  --gradient-mic-button: radial-gradient(circle at 50% 0%, #9a92f6, #6257d9);
+  --shadow-soft: 0 4px 20px -2px rgba(129, 119, 237, 0.1);
   --shadow-card: 0 10px 40px -10px hsl(0 0% 0% / 0.05);
 }
 
@@ -71,22 +77,26 @@
   --voice-border: 248 32% 22%;
   --voice-text: 252 40% 98%;
   --voice-text-muted: 252 20% 65%;
-  --voice-accent: 252 88% 70%;
+  --voice-accent: 245 84% 77%; /* #9a92f6 */
+  --voice-accent-vibrant: 252 88% 77%;
+  --voice-accent-dark: 246 57% 54%;
   --voice-accent-light: 252 47% 25%;
-  --voice-user-bubble: 252 88% 70%;
+  --voice-user-bubble: 245 84% 77%;
   --voice-user-text: 0 0% 100%;
   --voice-ai-bubble: 252 32% 21%;
   --voice-ai-text: 0 0% 100%;
-  --indicator-bg: 252 88% 70%;
+  --indicator-bg: 245 84% 77%;
+  --voice-status-bg: 252 47% 25%;
+  --voice-status-text: 245 84% 77%;
   --voice-placeholder: 252 20% 65%;
 
   /* Gradients Dark - Purple */
-  --gradient-primary: linear-gradient(135deg, hsl(252 88% 70%), hsl(252 88% 77%));
-  --gradient-surface: linear-gradient(180deg, hsl(248 32% 17.5%), hsl(248 35% 11%));
-  --gradient-mic-button: radial-gradient(circle at 50% 0%, hsl(252 88% 77%), hsl(252 59% 54%));
+  --gradient-primary: linear-gradient(135deg, #8177ed, #9a92f6);
+  --gradient-surface: linear-gradient(180deg, #2b2640, #1a1625);
+  --gradient-mic-button: radial-gradient(circle at 50% 0%, #9a92f6, #5447cd);
 
   /* Shadows Dark */
-  --shadow-soft: 0 4px 20px -2px hsl(252 88% 70% / 0.2);
+  --shadow-soft: 0 4px 20px -2px rgba(129, 119, 237, 0.2);
   --shadow-card: 0 10px 40px -10px hsl(0 0% 0% / 0.3);
 }
 
@@ -171,7 +181,7 @@
 
 /* Placeholder styles */
 input::placeholder {
-  color: hsl(var(--voice-placeholder));
+  color: hsl(var(--voice-text) / 0.9);
 }
 
 /* Theme toggle animations */
@@ -554,8 +564,8 @@ input::placeholder {
 }
 
 .language-tooltip-content {
-  background: oklch(0.23 0.08 252.75);
-  color: hsl(0 0% 98%);
+  background: hsl(var(--voice-accent));
+  color: #fff;
   padding: 8px 12px;
   border-radius: 8px;
   font-size: 12px;
@@ -579,7 +589,7 @@ input::placeholder {
   width: 0;
   height: 0;
   border: 4px solid transparent;
-  border-top-color: oklch(0.23 0.08 252.75);
+  border-top-color: hsl(var(--voice-accent));
 }
 
 .language-selector-content {
@@ -755,7 +765,7 @@ input::placeholder {
   align-items: center;
   gap: 12px;
   padding: 8px;
-  background: hsl(var(--voice-surface));
+  background: white; /* Force white as per user request */
   border: 1px solid hsl(var(--voice-border));
   border-radius: 32px;
   box-shadow:
@@ -786,13 +796,12 @@ input::placeholder {
   align-items: center;
   gap: 16px;
   padding: 20px;
-  background: hsl(var(--voice-surface));
+  background: white; /* Force white as per user request */
   border: 1px solid hsl(var(--voice-border));
   border-radius: 16px;
   box-shadow:
     0 20px 60px -12px hsl(0 0% 0% / 0.15),
     0 8px 32px -8px hsl(var(--voice-accent) / 0.1);
-  backdrop-filter: blur(16px);
   min-width: 280px;
   animation: voiceChatLanguageEnter 0.3s cubic-bezier(0.4, 0, 0.2, 1);
 }
@@ -887,11 +896,11 @@ input::placeholder {
 
 /* Dark theme for voice chat button: only when popup has .cuekit-dark (no media query) */
 .cuekit-voice-popup.cuekit-dark .voice-chat-main-button {
-  background: hsl(var(--voice-surface) / 0.8);
+  background: white; /* Force white in dark mode as per user request */
   border-color: hsl(var(--voice-border) / 0.5);
 }
 
 .cuekit-voice-popup.cuekit-dark .voice-chat-language-selection {
-  background: hsl(var(--voice-surface));
+  background: white; /* Force white in dark mode as per user request */
   border-color: hsl(var(--voice-border));
 }

package/dist/index.d.mts

@@ -11,8 +11,13 @@ interface DOMStructurePayload {
 }
 interface ThemeColors {
     primary: string;
-    background: string;
-    text: string;
+    primaryVibrant?: string;
+    primaryDark?: string;
+    indicator?: string;
+    statusBg?: string;
+    statusText?: string;
+    background?: string;
+    text?: string;
     surface?: string;
     border?: string;
     textMuted?: string;
@@ -22,8 +27,8 @@ interface ThemeColors {
     aiText?: string;
 }
 interface ThemeConfig {
-    light: ThemeColors;
-    dark: ThemeColors;
+    light?: Partial<ThemeColors>;
+    dark?: Partial<ThemeColors>;
 }
 
 declare global {
@@ -62,7 +67,7 @@ interface Props {
     showLogo?: boolean;
     showAIIcon?: boolean;
     showUserIcon?: boolean;
-    theme: ThemeConfig;
+    theme?: ThemeConfig;
     emptyStateMessage?: string;
 }
 declare const AnsyrProvider: React__default.FC<Props>;

package/dist/index.d.ts

@@ -11,8 +11,13 @@ interface DOMStructurePayload {
 }
 interface ThemeColors {
     primary: string;
-    background: string;
-    text: string;
+    primaryVibrant?: string;
+    primaryDark?: string;
+    indicator?: string;
+    statusBg?: string;
+    statusText?: string;
+    background?: string;
+    text?: string;
     surface?: string;
     border?: string;
     textMuted?: string;
@@ -22,8 +27,8 @@ interface ThemeColors {
     aiText?: string;
 }
 interface ThemeConfig {
-    light: ThemeColors;
-    dark: ThemeColors;
+    light?: Partial<ThemeColors>;
+    dark?: Partial<ThemeColors>;
 }
 
 declare global {
@@ -62,7 +67,7 @@ interface Props {
     showLogo?: boolean;
     showAIIcon?: boolean;
     showUserIcon?: boolean;
-    theme: ThemeConfig;
+    theme?: ThemeConfig;
     emptyStateMessage?: string;
 }
 declare const AnsyrProvider: React__default.FC<Props>;