@myned-ai/avatar-chat-widget 0.5.0 → 0.6.0

package/dist/avatar-chat-widget.js

@@ -1180,6 +1180,10 @@ class AudioInput {
   // 100ms at 24kHz
   async requestPermission() {
     try {
+      if (!navigator.mediaDevices || !navigator.mediaDevices.getUserMedia) {
+        log$e.error("MediaDevices API not available. Microphone requires HTTPS.");
+        throw new Error("Microphone requires a secure connection (HTTPS)");
+      }
       const stream = await navigator.mediaDevices.getUserMedia({
         audio: {
           sampleRate: CONFIG.audio.input.sampleRate,
@@ -1225,6 +1229,9 @@ class AudioInput {
    */
   async startPCM16Recording(onData) {
     try {
+      if (!navigator.mediaDevices || !navigator.mediaDevices.getUserMedia) {
+        throw new Error("Microphone requires a secure connection (HTTPS)");
+      }
       this.mediaStream = await navigator.mediaDevices.getUserMedia({
         audio: {
           channelCount: 1,
@@ -3551,6 +3558,12 @@ class VoiceInputController {
    * Start voice recording
    */
   async start() {
+    if (!navigator.mediaDevices || !navigator.mediaDevices.getUserMedia) {
+      const message = "Voice input requires a secure connection (HTTPS). Please use text input instead.";
+      log$5.warn(message);
+      alert(message);
+      return;
+    }
     try {
       log$5.info("Starting recording (PCM16 24kHz)");
       this.protocolClient.sendAudioStreamStart();
@@ -3569,7 +3582,10 @@ class VoiceInputController {
       log$5.error("Failed to start recording:", error2);
       errorBoundary.handleError(error2, "audio-input");
       this.options.onError?.(error2);
-      alert("Microphone access denied. Please enable microphone permissions.");
+      const errorMsg = error2.message || "";
+      if (errorMsg.includes("Permission denied") || errorMsg.includes("NotAllowedError")) {
+        alert("Microphone access was denied. Please allow microphone access in your browser settings to use voice input.");
+      }
     }
   }
   /**
@@ -3696,7 +3712,6 @@ class ChatManager {
       await this.protocolClient.connect();
       log$4.info("WebSocket connected");
       this.avatar.setChatState("Idle");
-      await this.audioInput.requestPermission();
     } catch (error2) {
       errorBoundary.handleError(error2, "chat-manager");
       log$4.error("Connection failed");
@@ -3788,6 +3803,9 @@ class ChatManager {
       this.useSyncPlayback = false;
       this.subtitleController.showRemaining();
       this.transcriptManager.finalizeAssistantTurn();
+      setTimeout(() => {
+        this.subtitleController.clear();
+      }, 1500);
     });
   }
   setupAutoScroll() {
@@ -4286,8 +4304,10 @@ const WIDGET_STYLES = `
 @media (max-width: 480px) {
   .widget-root {
     width: 100vw;
-    height: 100vh;
+    height: 100vh; /* Fallback for older browsers */
+    height: 100dvh; /* Dynamic viewport height - accounts for mobile browser UI */
     max-height: 100vh;
+    max-height: 100dvh;
     border-radius: 0;
     /* Let the mobile media query at the bottom handle the rest */
     padding-bottom: 90px; /* Ensure input layer space is preserved */
@@ -5336,7 +5356,8 @@ const WIDGET_STYLES = `
   
   /* Avatar-focus mode on mobile: avatar takes most of the space */
   :host(:not(.collapsed)) [data-drawer-state="avatar-focus"] {
-    --avatar-height: calc(100vh - 56px - 90px) !important; /* Full height minus header and input */
+    --avatar-height: calc(100vh - 56px - 90px) !important; /* Fallback */
+    --avatar-height: calc(100dvh - 56px - 90px) !important; /* Full height minus header and input */
     background: transparent !important; /* Let avatar stage show through */
   }
   
@@ -5381,11 +5402,13 @@ const WIDGET_STYLES = `
   
   /* Text-focus mode on mobile: chat takes most of the space, avatar in corner */
   :host(:not(.collapsed)) [data-drawer-state="text-focus"] {
-    --chat-height: calc(100vh - 70px - 90px) !important; /* Full height minus header and input */
+    --chat-height: calc(100vh - 70px - 90px) !important; /* Fallback */
+    --chat-height: calc(100dvh - 70px - 90px) !important; /* Full height minus header and input */
   }
   
   :host(:not(.collapsed)) [data-drawer-state="text-focus"] .chat-section {
-    height: calc(100vh - 70px - 90px) !important;
+    height: calc(100vh - 70px - 90px) !important; /* Fallback */
+    height: calc(100dvh - 70px - 90px) !important;
     flex: 1;
   }