@cuekit-ai/react 1.6.3 → 1.6.5

package/dist/{chunk-A5SW5UJY.mjs → chunk-WBAYQSGF.mjs}

@@ -22994,7 +22994,7 @@ var setWebRTCConnectionState = (state) => {
 };
 
 // src/constants/index.ts
-var WEBRTC_BACKEND_SERVER_URL = "https://ansyr-interview-be-dev-nlb-adb7e355084b6bb8.elb.ap-south-1.amazonaws.com";
+var WEBRTC_BACKEND_SERVER_URL = "https://api-webrtc.ansyr.ai";
 
 // src/core/intent-store.ts
 var store = {
@@ -23660,7 +23660,7 @@ function findDOMElementById(elementId) {
 // src/utils/webrtc-service.ts
 var room = null;
 var reconnectTimeout = null;
-var serverUrl = WEBRTC_BACKEND_SERVER_URL || "https://ansyr-interview-be-dev-nlb-adb7e355084b6bb8.elb.ap-south-1.amazonaws.com";
+var serverUrl = WEBRTC_BACKEND_SERVER_URL || "https://api-webrtc.ansyr.ai";
 var callbacks = {};
 var audioContainerRef = null;
 var livekitUrl = null;

package/dist/cuekit.css

@@ -26,31 +26,26 @@
   --shadow-card: 0 10px 40px -10px hsl(0 0% 0% / 0.05);
 }
 
-/* Dark theme variables */
-@media (prefers-color-scheme: dark) {
-  :root {
-    --voice-bg: 211 32% 11%;
-    --voice-surface: 217.2 32.6% 17.5%;
-    --voice-border: 217.2 32.6% 17.5%;
-    --voice-text: 210 40% 98%;
-    --voice-text-muted: 215 20.2% 65.1%;
-    --voice-accent: 200 98% 60%;
-    --voice-accent-light: 200 98% 20%;
-    --voice-user-bubble: 200.12 80.39% 60%;
-    --voice-user-text: 0 0% 100%;
-    --voice-ai-bubble: 200.57 32.71% 20.98%;
-    --voice-ai-text: 0 0% 100%;
-    --indicator-bg: 200.12 80.39% 60%;
-    --voice-placeholder: 215 20.2% 65.1%;
-
-    /* Gradients Dark */
-    --gradient-primary: linear-gradient(135deg, hsl(200 98% 60%), hsl(200 98% 70%));
-    --gradient-surface: linear-gradient(180deg, hsl(217.2 32.6% 17.5%), hsl(211 32% 11%));
-
-    /* Shadows Dark */
-    --shadow-soft: 0 4px 20px -2px hsl(200 98% 60% / 0.2);
-    --shadow-card: 0 10px 40px -10px hsl(0 0% 0% / 0.3);
-  }
+/* Popup theme is controlled only by .cuekit-dark (and JS when defaultTheme is "system"). No @media (prefers-color-scheme) on :root. */
+
+.cuekit-voice-popup:not(.cuekit-dark) {
+  --voice-bg: 0 0% 100%;
+  --voice-surface: 0 0% 100%;
+  --voice-border: 214.3 31.8% 91.4%;
+  --voice-text: 222.2 84% 4.9%;
+  --voice-text-muted: 215.4 16.3% 46.9%;
+  --voice-accent: 200 98% 39%;
+  --voice-accent-light: 200 98% 95%;
+  --voice-user-bubble: 200 98% 39%;
+  --voice-user-text: 0 0% 100%;
+  --voice-ai-bubble: 0 0% 100%;
+  --voice-ai-text: 222.2 84% 4.9%;
+  --indicator-bg: 200 98% 39%;
+  --voice-placeholder: 215.4 16.3% 46.9%;
+  --gradient-primary: linear-gradient(135deg, hsl(200 98% 39%), hsl(200 98% 50%));
+  --gradient-surface: linear-gradient(180deg, hsl(0 0% 100%), hsl(210 40% 98%));
+  --shadow-soft: 0 4px 20px -2px hsl(200 98% 39% / 0.1);
+  --shadow-card: 0 10px 40px -10px hsl(0 0% 0% / 0.05);
 }
 
 .cuekit-voice-popup.cuekit-dark {
@@ -549,7 +544,9 @@ input::placeholder {
   font-size: 12px;
   font-weight: 500;
   white-space: normal;
-  box-shadow: 0 4px 16px -4px hsl(0 0% 0% / 0.4), 0 2px 8px -2px hsl(0 0% 0% / 0.2);
+  box-shadow:
+    0 4px 16px -4px hsl(0 0% 0% / 0.4),
+    0 2px 8px -2px hsl(0 0% 0% / 0.2);
   max-width: 400px;
   min-width: 150px;
   word-wrap: break-word;
@@ -613,7 +610,9 @@ input::placeholder {
   background: hsl(var(--voice-surface));
   border: 1px solid hsl(var(--voice-border));
   border-radius: 12px;
-  box-shadow: 0 10px 40px -10px hsl(0 0% 0% / 0.1), 0 4px 20px -2px hsl(var(--voice-accent) / 0.1);
+  box-shadow:
+    0 10px 40px -10px hsl(0 0% 0% / 0.1),
+    0 4px 20px -2px hsl(var(--voice-accent) / 0.1);
   overflow: hidden;
   animation: languageDropdownEnter 0.2s cubic-bezier(0.4, 0, 0.2, 1);
   min-width: 200px;
@@ -710,23 +709,7 @@ input::placeholder {
   flex-shrink: 0;
 }
 
-/* Dark theme adjustments for language selector */
-@media (prefers-color-scheme: dark) {
-  .language-selector-button {
-    background: hsl(var(--voice-surface));
-    border-color: hsl(var(--voice-border));
-  }
-
-  .language-selector-button:hover:not(.disabled) {
-    background: hsl(var(--voice-accent-light));
-  }
-
-  .language-dropdown {
-    background: hsl(var(--voice-surface));
-    border-color: hsl(var(--voice-border));
-  }
-}
-
+/* Dark theme for language selector: only when popup has .cuekit-dark (no media query) */
 .cuekit-voice-popup.cuekit-dark .language-selector-button {
   background: hsl(var(--voice-surface));
   border-color: hsl(var(--voice-border));
@@ -758,13 +741,17 @@ input::placeholder {
   background: hsl(var(--voice-surface));
   border: 1px solid hsl(var(--voice-border));
   border-radius: 32px;
-  box-shadow: 0 8px 32px -8px hsl(var(--voice-accent) / 0.1), 0 4px 16px -4px hsl(0 0% 0% / 0.1);
+  box-shadow:
+    0 8px 32px -8px hsl(var(--voice-accent) / 0.1),
+    0 4px 16px -4px hsl(0 0% 0% / 0.1);
   transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
 }
 
 .voice-chat-main-button:hover {
   border-color: hsl(var(--voice-border));
-  box-shadow: 0 12px 40px -8px hsl(var(--voice-accent) / 0.15), 0 6px 20px -4px hsl(0 0% 0% / 0.15);
+  box-shadow:
+    0 12px 40px -8px hsl(var(--voice-accent) / 0.15),
+    0 6px 20px -4px hsl(0 0% 0% / 0.15);
   transform: translateY(-2px);
 }
 
@@ -785,7 +772,9 @@ input::placeholder {
   background: hsl(var(--voice-surface));
   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);
+  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);
@@ -879,19 +868,7 @@ input::placeholder {
   box-shadow: 0 4px 12px -2px hsl(var(--voice-accent) / 0.3);
 }
 
-/* Dark theme adjustments for voice chat button */
-@media (prefers-color-scheme: dark) {
-  .voice-chat-main-button {
-    background: hsl(var(--voice-surface) / 0.8);
-    border-color: hsl(var(--voice-border) / 0.5);
-  }
-
-  .voice-chat-language-selection {
-    background: hsl(var(--voice-surface));
-    border-color: hsl(var(--voice-border));
-  }
-}
-
+/* 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);
   border-color: hsl(var(--voice-border) / 0.5);

package/dist/index.js

@@ -331,7 +331,7 @@ var WEBRTC_BACKEND_SERVER_URL;
 var init_constants = __esm({
   "src/constants/index.ts"() {
     "use strict";
-    WEBRTC_BACKEND_SERVER_URL = "https://ansyr-interview-be-dev-nlb-adb7e355084b6bb8.elb.ap-south-1.amazonaws.com";
+    WEBRTC_BACKEND_SERVER_URL = "https://api-webrtc.ansyr.ai";
   }
 });
 
@@ -23946,7 +23946,7 @@ var init_webrtc_service = __esm({
     init_navigation();
     room = null;
     reconnectTimeout = null;
-    serverUrl = WEBRTC_BACKEND_SERVER_URL || "https://ansyr-interview-be-dev-nlb-adb7e355084b6bb8.elb.ap-south-1.amazonaws.com";
+    serverUrl = WEBRTC_BACKEND_SERVER_URL || "https://api-webrtc.ansyr.ai";
     callbacks = {};
     audioContainerRef = null;
     livekitUrl = null;
@@ -25123,7 +25123,7 @@ function InitCuekit(config) {
     setAppId(config.appId);
   }
   const webRTCConfig = {
-    serverUrl: config.webRTC?.serverUrl || "https://ansyr-interview-be-dev-nlb-adb7e355084b6bb8.elb.ap-south-1.amazonaws.com",
+    serverUrl: config.webRTC?.serverUrl || "https://api-webrtc.ansyr.ai",
     roomName: config.webRTC?.roomName || "default-room",
     participantName: config.webRTC?.participantName || "user",
     tokenTtlSeconds: config.webRTC?.tokenTtlSeconds || 7200
@@ -42105,27 +42105,18 @@ var MicButton = ({
     appId
   });
   (0, import_react20.useEffect)(() => {
-    const checkTheme = () => {
-      if (typeof document !== "undefined") {
-        let newTheme;
-        if (defaultTheme === "system") {
-          const isDark = document.documentElement.classList.contains("dark");
-          newTheme = isDark ? "dark" : "light";
-        } else {
-          newTheme = defaultTheme;
-        }
-        setCurrentTheme(newTheme);
-      }
-    };
-    checkTheme();
-    if (defaultTheme === "system") {
-      const observer = new MutationObserver(checkTheme);
-      observer.observe(document.documentElement, {
-        attributes: true,
-        attributeFilter: ["class"]
-      });
-      return () => observer.disconnect();
+    if (defaultTheme !== "system") {
+      setCurrentTheme(defaultTheme);
+      return;
     }
+    const media = typeof window !== "undefined" ? window.matchMedia("(prefers-color-scheme: dark)") : null;
+    const applySystemTheme = () => {
+      const isDark = media?.matches ?? false;
+      setCurrentTheme(isDark ? "dark" : "light");
+    };
+    applySystemTheme();
+    media?.addEventListener("change", applySystemTheme);
+    return () => media?.removeEventListener("change", applySystemTheme);
   }, [defaultTheme]);
   const openChat = (0, import_react20.useCallback)(() => {
     setIsChatOpen(true);
@@ -42402,79 +42393,88 @@ var MicButton = ({
     }
     return baseStyle;
   };
-  return /* @__PURE__ */ import_react20.default.createElement(import_react20.default.Fragment, null, /* @__PURE__ */ import_react20.default.createElement("div", { "data-cuekit-ignore": true, style: { ...buttonStyles.container, ...getPositionStyle() } }, showLanguageSelector ? /* @__PURE__ */ import_react20.default.createElement("div", { className: "voice-chat-language-selection" }, /* @__PURE__ */ import_react20.default.createElement("div", { className: "voice-chat-language-header" }, /* @__PURE__ */ import_react20.default.createElement("div", { className: "voice-chat-language-icon" }, /* @__PURE__ */ import_react20.default.createElement(mic_default, { width: 20, height: 20 })), /* @__PURE__ */ import_react20.default.createElement("span", { className: "voice-chat-language-title" }, "Select Language")), /* @__PURE__ */ import_react20.default.createElement(
-    LanguageSelector,
-    {
-      selectedLanguage,
-      onLanguageChange: handleLanguageChange,
-      availableLanguages: DEFAULT_LANGUAGES,
-      className: "voice-chat-language-selector",
-      screenPosition
-    }
-  ), /* @__PURE__ */ import_react20.default.createElement("div", { className: "voice-chat-language-actions" }, /* @__PURE__ */ import_react20.default.createElement(
-    "button",
+  return /* @__PURE__ */ import_react20.default.createElement(import_react20.default.Fragment, null, /* @__PURE__ */ import_react20.default.createElement(
+    "div",
     {
-      className: "voice-chat-cancel-button",
-      onClick: () => setShowLanguageSelector(false)
+      "data-cuekit-ignore": true,
+      className: `cuekit-voice-popup ${currentTheme === "dark" ? "cuekit-dark" : ""}`,
+      style: { ...buttonStyles.container, ...getPositionStyle() }
     },
-    "Cancel"
-  ), /* @__PURE__ */ import_react20.default.createElement("button", { className: "voice-chat-confirm-button", onClick: handleLanguageConfirm }, "Start Voice Chat"))) : /* @__PURE__ */ import_react20.default.createElement("div", { className: "voice-chat-main-button" }, /* @__PURE__ */ import_react20.default.createElement(
-    LanguageSelector,
-    {
-      selectedLanguage,
-      onLanguageChange: handleLanguageChange,
-      availableLanguages: DEFAULT_LANGUAGES,
-      className: "voice-chat-language-preview",
-      disabled: isConnected2 || micState !== "idle",
-      tooltip: "Close the conversation to change the language",
-      screenPosition
-    }
-  ), /* @__PURE__ */ import_react20.default.createElement(
-    "button",
-    {
-      "data-testid": "ignore",
-      onClick: handleMicClick,
-      disabled: micState === "thinking" || micState === "replying",
-      style: getDynamicButtonStyle(),
-      onMouseEnter: (e3) => {
-        if (micState === "idle") {
-          e3.currentTarget.style.transform = "scale(1.05)";
-          e3.currentTarget.style.boxShadow = "0 20px 25px -5px rgba(59, 130, 246, 0.4)";
-        }
+    showLanguageSelector ? /* @__PURE__ */ import_react20.default.createElement("div", { className: "voice-chat-language-selection" }, /* @__PURE__ */ import_react20.default.createElement("div", { className: "voice-chat-language-header" }, /* @__PURE__ */ import_react20.default.createElement("div", { className: "voice-chat-language-icon" }, /* @__PURE__ */ import_react20.default.createElement(mic_default, { width: 20, height: 20 })), /* @__PURE__ */ import_react20.default.createElement("span", { className: "voice-chat-language-title" }, "Select Language")), /* @__PURE__ */ import_react20.default.createElement(
+      LanguageSelector,
+      {
+        selectedLanguage,
+        onLanguageChange: handleLanguageChange,
+        availableLanguages: DEFAULT_LANGUAGES,
+        className: "voice-chat-language-selector",
+        screenPosition
+      }
+    ), /* @__PURE__ */ import_react20.default.createElement("div", { className: "voice-chat-language-actions" }, /* @__PURE__ */ import_react20.default.createElement(
+      "button",
+      {
+        className: "voice-chat-cancel-button",
+        onClick: () => setShowLanguageSelector(false)
+      },
+      "Cancel"
+    ), /* @__PURE__ */ import_react20.default.createElement("button", { className: "voice-chat-confirm-button", onClick: handleLanguageConfirm }, "Start Voice Chat"))) : /* @__PURE__ */ import_react20.default.createElement("div", { className: "voice-chat-main-button" }, /* @__PURE__ */ import_react20.default.createElement(
+      LanguageSelector,
+      {
+        selectedLanguage,
+        onLanguageChange: handleLanguageChange,
+        availableLanguages: DEFAULT_LANGUAGES,
+        className: "voice-chat-language-preview",
+        disabled: isConnected2 || micState !== "idle",
+        tooltip: "Close the conversation to change the language",
+        screenPosition
+      }
+    ), /* @__PURE__ */ import_react20.default.createElement(
+      "button",
+      {
+        "data-testid": "ignore",
+        onClick: handleMicClick,
+        disabled: micState === "thinking" || micState === "replying",
+        style: getDynamicButtonStyle(),
+        onMouseEnter: (e3) => {
+          if (micState === "idle") {
+            e3.currentTarget.style.transform = "scale(1.05)";
+            e3.currentTarget.style.boxShadow = "0 20px 25px -5px rgba(59, 130, 246, 0.4)";
+          }
+        },
+        onMouseLeave: (e3) => {
+          if (micState === "idle") {
+            e3.currentTarget.style.transform = "scale(1)";
+            e3.currentTarget.style.boxShadow = "0 10px 15px -3px rgba(59, 130, 246, 0.3)";
+          }
+        },
+        "aria-label": micState === "thinking" ? "Processing..." : micState === "replying" ? "AI is responding..." : isListening ? "Stop listening" : "Start listening"
       },
-      onMouseLeave: (e3) => {
-        if (micState === "idle") {
-          e3.currentTarget.style.transform = "scale(1)";
-          e3.currentTarget.style.boxShadow = "0 10px 15px -3px rgba(59, 130, 246, 0.3)";
+      /* @__PURE__ */ import_react20.default.createElement("div", { style: buttonStyles.iconContainer }, getIcon())
+    )),
+    !showLanguageSelector && hasText && text7 && /* @__PURE__ */ import_react20.default.createElement(
+      "div",
+      {
+        style: {
+          fontSize: "12px",
+          color: "hsl(var(--voice-text-muted))",
+          fontWeight: "500",
+          textAlign: "center",
+          background: "hsl(var(--voice-surface) / 0.9)",
+          padding: "4px 8px",
+          borderRadius: "6px",
+          backdropFilter: "blur(8px)",
+          border: "1px solid hsl(var(--voice-accent) / 0.2)",
+          boxShadow: "var(--shadow-soft)",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          gap: "4px",
+          marginTop: "8px",
+          ...textStyle
         }
       },
-      "aria-label": micState === "thinking" ? "Processing..." : micState === "replying" ? "AI is responding..." : isListening ? "Stop listening" : "Start listening"
-    },
-    /* @__PURE__ */ import_react20.default.createElement("div", { style: buttonStyles.iconContainer }, getIcon())
-  )), !showLanguageSelector && hasText && text7 && /* @__PURE__ */ import_react20.default.createElement(
-    "div",
-    {
-      style: {
-        fontSize: "12px",
-        color: "hsl(var(--voice-text-muted))",
-        fontWeight: "500",
-        textAlign: "center",
-        background: "hsl(var(--voice-surface) / 0.9)",
-        padding: "4px 8px",
-        borderRadius: "6px",
-        backdropFilter: "blur(8px)",
-        border: "1px solid hsl(var(--voice-accent) / 0.2)",
-        boxShadow: "var(--shadow-soft)",
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "center",
-        gap: "4px",
-        marginTop: "8px",
-        ...textStyle
-      }
-    },
-    /* @__PURE__ */ import_react20.default.createElement("span", null, text7)
-  )), /* @__PURE__ */ import_react20.default.createElement(
+      /* @__PURE__ */ import_react20.default.createElement("span", null, text7)
+    )
+  ), /* @__PURE__ */ import_react20.default.createElement(
     ChatPopup,
     {
       isOpen: isChatOpen,

package/dist/index.mjs

@@ -37,7 +37,7 @@ import {
   setWebRTCCallbacks,
   setWebRTCConfig,
   validateDynamicElements
-} from "./chunk-A5SW5UJY.mjs";
+} from "./chunk-WBAYQSGF.mjs";
 
 // node_modules/inline-style-parser/index.js
 var require_inline_style_parser = __commonJS({
@@ -1175,7 +1175,7 @@ function InitCuekit(config) {
     setAppId(config.appId);
   }
   const webRTCConfig = {
-    serverUrl: config.webRTC?.serverUrl || "https://ansyr-interview-be-dev-nlb-adb7e355084b6bb8.elb.ap-south-1.amazonaws.com",
+    serverUrl: config.webRTC?.serverUrl || "https://api-webrtc.ansyr.ai",
     roomName: config.webRTC?.roomName || "default-room",
     participantName: config.webRTC?.participantName || "user",
     tokenTtlSeconds: config.webRTC?.tokenTtlSeconds || 7200
@@ -1293,7 +1293,7 @@ var AnsyrProvider = ({
     };
   }, [navigationHandler]);
   useEffect(() => {
-    import("./webrtc-service-L7VCVRGD.mjs").then(({ setWebRTCCallbacks: setWebRTCCallbacks2 }) => {
+    import("./webrtc-service-CJ34OHJN.mjs").then(({ setWebRTCCallbacks: setWebRTCCallbacks2 }) => {
       setWebRTCCallbacks2({
         onNavigationCommand: (command) => {
           if (command.data.actionType === "navigate" && command.data.routeName) {
@@ -18136,27 +18136,18 @@ var MicButton = ({
     appId
   });
   useEffect12(() => {
-    const checkTheme = () => {
-      if (typeof document !== "undefined") {
-        let newTheme;
-        if (defaultTheme === "system") {
-          const isDark = document.documentElement.classList.contains("dark");
-          newTheme = isDark ? "dark" : "light";
-        } else {
-          newTheme = defaultTheme;
-        }
-        setCurrentTheme(newTheme);
-      }
-    };
-    checkTheme();
-    if (defaultTheme === "system") {
-      const observer = new MutationObserver(checkTheme);
-      observer.observe(document.documentElement, {
-        attributes: true,
-        attributeFilter: ["class"]
-      });
-      return () => observer.disconnect();
+    if (defaultTheme !== "system") {
+      setCurrentTheme(defaultTheme);
+      return;
     }
+    const media = typeof window !== "undefined" ? window.matchMedia("(prefers-color-scheme: dark)") : null;
+    const applySystemTheme = () => {
+      const isDark = media?.matches ?? false;
+      setCurrentTheme(isDark ? "dark" : "light");
+    };
+    applySystemTheme();
+    media?.addEventListener("change", applySystemTheme);
+    return () => media?.removeEventListener("change", applySystemTheme);
   }, [defaultTheme]);
   const openChat = useCallback6(() => {
     setIsChatOpen(true);
@@ -18433,79 +18424,88 @@ var MicButton = ({
     }
     return baseStyle;
   };
-  return /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement("div", { "data-cuekit-ignore": true, style: { ...buttonStyles.container, ...getPositionStyle() } }, showLanguageSelector ? /* @__PURE__ */ React15.createElement("div", { className: "voice-chat-language-selection" }, /* @__PURE__ */ React15.createElement("div", { className: "voice-chat-language-header" }, /* @__PURE__ */ React15.createElement("div", { className: "voice-chat-language-icon" }, /* @__PURE__ */ React15.createElement(mic_default, { width: 20, height: 20 })), /* @__PURE__ */ React15.createElement("span", { className: "voice-chat-language-title" }, "Select Language")), /* @__PURE__ */ React15.createElement(
-    LanguageSelector,
-    {
-      selectedLanguage,
-      onLanguageChange: handleLanguageChange,
-      availableLanguages: DEFAULT_LANGUAGES,
-      className: "voice-chat-language-selector",
-      screenPosition
-    }
-  ), /* @__PURE__ */ React15.createElement("div", { className: "voice-chat-language-actions" }, /* @__PURE__ */ React15.createElement(
-    "button",
+  return /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement(
+    "div",
     {
-      className: "voice-chat-cancel-button",
-      onClick: () => setShowLanguageSelector(false)
+      "data-cuekit-ignore": true,
+      className: `cuekit-voice-popup ${currentTheme === "dark" ? "cuekit-dark" : ""}`,
+      style: { ...buttonStyles.container, ...getPositionStyle() }
     },
-    "Cancel"
-  ), /* @__PURE__ */ React15.createElement("button", { className: "voice-chat-confirm-button", onClick: handleLanguageConfirm }, "Start Voice Chat"))) : /* @__PURE__ */ React15.createElement("div", { className: "voice-chat-main-button" }, /* @__PURE__ */ React15.createElement(
-    LanguageSelector,
-    {
-      selectedLanguage,
-      onLanguageChange: handleLanguageChange,
-      availableLanguages: DEFAULT_LANGUAGES,
-      className: "voice-chat-language-preview",
-      disabled: isConnected || micState !== "idle",
-      tooltip: "Close the conversation to change the language",
-      screenPosition
-    }
-  ), /* @__PURE__ */ React15.createElement(
-    "button",
-    {
-      "data-testid": "ignore",
-      onClick: handleMicClick,
-      disabled: micState === "thinking" || micState === "replying",
-      style: getDynamicButtonStyle(),
-      onMouseEnter: (e2) => {
-        if (micState === "idle") {
-          e2.currentTarget.style.transform = "scale(1.05)";
-          e2.currentTarget.style.boxShadow = "0 20px 25px -5px rgba(59, 130, 246, 0.4)";
-        }
+    showLanguageSelector ? /* @__PURE__ */ React15.createElement("div", { className: "voice-chat-language-selection" }, /* @__PURE__ */ React15.createElement("div", { className: "voice-chat-language-header" }, /* @__PURE__ */ React15.createElement("div", { className: "voice-chat-language-icon" }, /* @__PURE__ */ React15.createElement(mic_default, { width: 20, height: 20 })), /* @__PURE__ */ React15.createElement("span", { className: "voice-chat-language-title" }, "Select Language")), /* @__PURE__ */ React15.createElement(
+      LanguageSelector,
+      {
+        selectedLanguage,
+        onLanguageChange: handleLanguageChange,
+        availableLanguages: DEFAULT_LANGUAGES,
+        className: "voice-chat-language-selector",
+        screenPosition
+      }
+    ), /* @__PURE__ */ React15.createElement("div", { className: "voice-chat-language-actions" }, /* @__PURE__ */ React15.createElement(
+      "button",
+      {
+        className: "voice-chat-cancel-button",
+        onClick: () => setShowLanguageSelector(false)
+      },
+      "Cancel"
+    ), /* @__PURE__ */ React15.createElement("button", { className: "voice-chat-confirm-button", onClick: handleLanguageConfirm }, "Start Voice Chat"))) : /* @__PURE__ */ React15.createElement("div", { className: "voice-chat-main-button" }, /* @__PURE__ */ React15.createElement(
+      LanguageSelector,
+      {
+        selectedLanguage,
+        onLanguageChange: handleLanguageChange,
+        availableLanguages: DEFAULT_LANGUAGES,
+        className: "voice-chat-language-preview",
+        disabled: isConnected || micState !== "idle",
+        tooltip: "Close the conversation to change the language",
+        screenPosition
+      }
+    ), /* @__PURE__ */ React15.createElement(
+      "button",
+      {
+        "data-testid": "ignore",
+        onClick: handleMicClick,
+        disabled: micState === "thinking" || micState === "replying",
+        style: getDynamicButtonStyle(),
+        onMouseEnter: (e2) => {
+          if (micState === "idle") {
+            e2.currentTarget.style.transform = "scale(1.05)";
+            e2.currentTarget.style.boxShadow = "0 20px 25px -5px rgba(59, 130, 246, 0.4)";
+          }
+        },
+        onMouseLeave: (e2) => {
+          if (micState === "idle") {
+            e2.currentTarget.style.transform = "scale(1)";
+            e2.currentTarget.style.boxShadow = "0 10px 15px -3px rgba(59, 130, 246, 0.3)";
+          }
+        },
+        "aria-label": micState === "thinking" ? "Processing..." : micState === "replying" ? "AI is responding..." : isListening ? "Stop listening" : "Start listening"
       },
-      onMouseLeave: (e2) => {
-        if (micState === "idle") {
-          e2.currentTarget.style.transform = "scale(1)";
-          e2.currentTarget.style.boxShadow = "0 10px 15px -3px rgba(59, 130, 246, 0.3)";
+      /* @__PURE__ */ React15.createElement("div", { style: buttonStyles.iconContainer }, getIcon())
+    )),
+    !showLanguageSelector && hasText && text7 && /* @__PURE__ */ React15.createElement(
+      "div",
+      {
+        style: {
+          fontSize: "12px",
+          color: "hsl(var(--voice-text-muted))",
+          fontWeight: "500",
+          textAlign: "center",
+          background: "hsl(var(--voice-surface) / 0.9)",
+          padding: "4px 8px",
+          borderRadius: "6px",
+          backdropFilter: "blur(8px)",
+          border: "1px solid hsl(var(--voice-accent) / 0.2)",
+          boxShadow: "var(--shadow-soft)",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          gap: "4px",
+          marginTop: "8px",
+          ...textStyle
         }
       },
-      "aria-label": micState === "thinking" ? "Processing..." : micState === "replying" ? "AI is responding..." : isListening ? "Stop listening" : "Start listening"
-    },
-    /* @__PURE__ */ React15.createElement("div", { style: buttonStyles.iconContainer }, getIcon())
-  )), !showLanguageSelector && hasText && text7 && /* @__PURE__ */ React15.createElement(
-    "div",
-    {
-      style: {
-        fontSize: "12px",
-        color: "hsl(var(--voice-text-muted))",
-        fontWeight: "500",
-        textAlign: "center",
-        background: "hsl(var(--voice-surface) / 0.9)",
-        padding: "4px 8px",
-        borderRadius: "6px",
-        backdropFilter: "blur(8px)",
-        border: "1px solid hsl(var(--voice-accent) / 0.2)",
-        boxShadow: "var(--shadow-soft)",
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "center",
-        gap: "4px",
-        marginTop: "8px",
-        ...textStyle
-      }
-    },
-    /* @__PURE__ */ React15.createElement("span", null, text7)
-  )), /* @__PURE__ */ React15.createElement(
+      /* @__PURE__ */ React15.createElement("span", null, text7)
+    )
+  ), /* @__PURE__ */ React15.createElement(
     ChatPopup,
     {
       isOpen: isChatOpen,

package/dist/{webrtc-service-L7VCVRGD.mjs → webrtc-service-CJ34OHJN.mjs}

@@ -15,7 +15,7 @@ import {
   setAudioContainer,
   setServerUrl,
   setWebRTCCallbacks
-} from "./chunk-A5SW5UJY.mjs";
+} from "./chunk-WBAYQSGF.mjs";
 export {
   authenticate,
   connectToRoom,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cuekit-ai/react",
-  "version": "1.6.3",
+  "version": "1.6.5",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "exports": {