@speechos/client 0.2.4 → 0.2.6

package/dist/index.iife.js

@@ -28518,6 +28518,10 @@
   	}
   	handleIntermediateTranscription(message) {
   		const config = getConfig();
+  		events.emit("transcription:interim", {
+  			transcript: message.transcript,
+  			isFinal: message.is_final
+  		});
   		if (config.debug) console.log("[SpeechOS] Intermediate transcription:", message.transcript, "final:", message.is_final);
   	}
   	handleFinalTranscript(message) {
@@ -30508,7 +30512,8 @@
           this.activeAction = null;
           this.editPreviewText = "";
           this.errorMessage = null;
-          this.commandFeedback = null;
+          this.actionFeedback = null;
+          this.showNoAudioWarning = false;
       }
       static { this.styles = [
           themeStyles,
@@ -31098,8 +31103,9 @@
         background-position: center;
       }
 
-      /* Command feedback badge - no match state (neutral gray) */
-      .status-label.command-none {
+      /* Command/edit feedback badge - no match/empty state (neutral gray) */
+      .status-label.command-none,
+      .status-label.edit-empty {
         background: #4b5563;
         box-shadow: 0 4px 12px rgba(75, 85, 99, 0.3);
         animation: command-feedback-in 0.3s cubic-bezier(0.34, 1.56, 0.64, 1)
@@ -31256,6 +31262,60 @@
         border-color: rgba(255, 255, 255, 0.5);
       }
 
+      /* No audio warning banner */
+      .no-audio-warning {
+        position: absolute;
+        bottom: 120px; /* Above button and waveform visualizer */
+        left: 50%;
+        transform: translateX(-50%) translateY(8px);
+        display: flex;
+        align-items: center;
+        gap: 8px;
+        padding: 10px 14px;
+        border-radius: 12px;
+        background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
+        box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3);
+        transition: all 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);
+        pointer-events: none;
+        opacity: 0;
+        white-space: nowrap;
+      }
+
+      .no-audio-warning.visible {
+        opacity: 1;
+        transform: translateX(-50%) translateY(0);
+        pointer-events: auto;
+      }
+
+      .no-audio-warning .warning-icon {
+        flex-shrink: 0;
+        color: white;
+      }
+
+      .no-audio-warning .warning-text {
+        font-size: 13px;
+        font-weight: 500;
+        color: white;
+      }
+
+      .no-audio-warning .settings-link {
+        background: rgba(255, 255, 255, 0.2);
+        border: 1px solid rgba(255, 255, 255, 0.3);
+        border-radius: 6px;
+        padding: 4px 10px;
+        font-size: 12px;
+        font-weight: 600;
+        color: white;
+        cursor: pointer;
+        transition: all 0.15s;
+        white-space: nowrap;
+      }
+
+      .no-audio-warning .settings-link:hover {
+        background: rgba(255, 255, 255, 0.3);
+        border-color: rgba(255, 255, 255, 0.5);
+      }
+
       /* Mobile styles - 30% larger */
       @media (max-width: 768px) and (hover: none) {
         .mic-button {
@@ -31385,6 +31445,21 @@
           padding: 8px 14px;
           font-size: 14px;
         }
+
+        .no-audio-warning {
+          padding: 12px 16px;
+          gap: 10px;
+          bottom: 145px; /* Above button and waveform on mobile */
+        }
+
+        .no-audio-warning .warning-text {
+          font-size: 15px;
+        }
+
+        .no-audio-warning .settings-link {
+          padding: 6px 12px;
+          font-size: 14px;
+        }
       }
     `,
       ]; }
@@ -31442,6 +31517,14 @@
               composed: true,
           }));
       }
+      handleOpenSettings(e) {
+          e.stopPropagation();
+          e.preventDefault();
+          this.dispatchEvent(new CustomEvent("open-settings", {
+              bubbles: true,
+              composed: true,
+          }));
+      }
       getButtonClass() {
           const classes = ["mic-button"];
           if (this.expanded && this.recordingState === "idle") {
@@ -31526,13 +31609,16 @@
           }
           return this.recordingState;
       }
-      getCommandFeedbackLabel() {
-          if (this.commandFeedback === "success") {
+      getActionFeedbackLabel() {
+          if (this.actionFeedback === "command-success") {
               return "Got it!";
           }
-          if (this.commandFeedback === "none") {
+          if (this.actionFeedback === "command-none") {
               return "No command matched";
           }
+          if (this.actionFeedback === "edit-empty") {
+              return "Couldn't understand edit";
+          }
           return "";
       }
       render() {
@@ -31542,9 +31628,9 @@
           const showSiriEdit = this.recordingState === "processing" && this.activeAction === "edit";
           const statusLabel = this.getStatusLabel();
           const showVisualizer = this.shouldShowVisualizer();
-          // Show status label during recording (either visualizer or edit text) OR command feedback
-          const showCommandFeedback = this.recordingState === "idle" && this.commandFeedback !== null;
-          const showStatus = this.recordingState === "recording" || showCommandFeedback;
+          // Show status label during recording (either visualizer or edit text) OR action feedback
+          const showActionFeedback = this.recordingState === "idle" && this.actionFeedback !== null;
+          const showStatus = this.recordingState === "recording" || showActionFeedback;
           const showCancel = this.recordingState === "connecting" ||
               this.recordingState === "recording" ||
               this.recordingState === "processing";
@@ -31583,6 +31669,35 @@
             `
             : ""}
 
+        <div
+          class="no-audio-warning ${this.showNoAudioWarning &&
+            this.recordingState === "recording"
+            ? "visible"
+            : ""}"
+        >
+          <svg
+            class="warning-icon"
+            width="16"
+            height="16"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            stroke-width="2"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+          >
+            <path
+              d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"
+            />
+            <line x1="12" y1="9" x2="12" y2="13" />
+            <line x1="12" y1="17" x2="12.01" y2="17" />
+          </svg>
+          <span class="warning-text">We're not hearing anything</span>
+          <button class="settings-link" @click="${this.handleOpenSettings}">
+            Check Settings
+          </button>
+        </div>
+
         <button
           class="${this.getButtonClass()}"
           @click="${this.handleClick}"
@@ -31595,14 +31710,14 @@
         </button>
 
         <span
-          class="status-label ${showStatus ? "visible" : ""} ${showCommandFeedback
-            ? `command-${this.commandFeedback}`
+          class="status-label ${showStatus ? "visible" : ""} ${showActionFeedback
+            ? this.actionFeedback
             : showVisualizer
                 ? "visualizer"
                 : this.getStatusClass()}"
         >
-          ${showCommandFeedback
-            ? this.getCommandFeedbackLabel()
+          ${showActionFeedback
+            ? this.getActionFeedbackLabel()
             : showVisualizer
                 ? b `<speechos-audio-visualizer
                   ?active="${showVisualizer}"
@@ -31650,7 +31765,10 @@
   ], SpeechOSMicButton.prototype, "errorMessage", void 0);
   __decorate([
       n({ type: String })
-  ], SpeechOSMicButton.prototype, "commandFeedback", void 0);
+  ], SpeechOSMicButton.prototype, "actionFeedback", void 0);
+  __decorate([
+      n({ type: Boolean })
+  ], SpeechOSMicButton.prototype, "showNoAudioWarning", void 0);
   SpeechOSMicButton = __decorate([
       t$1("speechos-mic-button")
   ], SpeechOSMicButton);
@@ -35024,15 +35142,27 @@
    * duration so users can see the visual feedback before transitioning to recording.
    */
   const MIN_CONNECTING_ANIMATION_MS = 200;
+  /**
+   * Time to wait for a transcription event before showing the "no audio" warning (in milliseconds).
+   * If no transcription:interim event is received within this time during recording,
+   * it indicates the server isn't receiving/processing audio.
+   */
+  const NO_AUDIO_WARNING_TIMEOUT_MS = 5000;
+  /**
+   * Number of consecutive actions with empty results before showing warning on next action.
+   */
+  const CONSECUTIVE_NO_AUDIO_THRESHOLD = 2;
   let SpeechOSWidget = class SpeechOSWidget extends i$1 {
       constructor() {
           super(...arguments);
           this.widgetState = state.getState();
           this.settingsOpen = false;
+          this.settingsOpenFromWarning = false;
           this.dictationModalOpen = false;
           this.dictationModalText = "";
           this.editHelpModalOpen = false;
-          this.commandFeedback = null;
+          this.actionFeedback = null;
+          this.showNoAudioWarning = false;
           this.dictationTargetElement = null;
           this.editTargetElement = null;
           this.dictationCursorStart = null;
@@ -35044,7 +35174,7 @@
           this.modalElement = null;
           this.dictationModalElement = null;
           this.editHelpModalElement = null;
-          this.commandFeedbackTimeout = null;
+          this.actionFeedbackTimeout = null;
           this.customPosition = null;
           this.isDragging = false;
           this.dragStartPos = null;
@@ -35054,6 +35184,11 @@
           this.suppressNextClick = false;
           this.boundViewportResizeHandler = null;
           this.boundScrollHandler = null;
+          // No-audio warning state tracking
+          this.consecutiveNoAudioActions = 0;
+          this.transcriptionReceived = false;
+          this.noAudioWarningTimeout = null;
+          this.transcriptionInterimUnsubscribe = null;
       }
       static { SpeechOSWidget_1 = this; }
       static { this.styles = [
@@ -35136,6 +35271,7 @@
           this.modalElement = document.createElement("speechos-settings-modal");
           this.modalElement.addEventListener("modal-close", () => {
               this.settingsOpen = false;
+              this.settingsOpenFromWarning = false;
           });
           document.body.appendChild(this.modalElement);
           // Mount dictation output modal
@@ -35151,7 +35287,17 @@
           });
           document.body.appendChild(this.editHelpModalElement);
           this.stateUnsubscribe = state.subscribe((newState) => {
-              if (!newState.isVisible || !newState.isExpanded) {
+              if (!newState.isVisible) {
+                  if (getConfig().debug && this.settingsOpen) {
+                      console.log("[SpeechOS] Closing settings modal: widget hidden");
+                  }
+                  this.settingsOpen = false;
+                  this.settingsOpenFromWarning = false;
+              }
+              else if (!newState.isExpanded && !this.settingsOpenFromWarning) {
+                  if (getConfig().debug && this.settingsOpen) {
+                      console.log("[SpeechOS] Closing settings modal: widget collapsed");
+                  }
                   this.settingsOpen = false;
               }
               // Clear custom position when focused element changes (re-anchor to new element)
@@ -35197,9 +35343,9 @@
               this.editHelpModalElement.remove();
               this.editHelpModalElement = null;
           }
-          if (this.commandFeedbackTimeout) {
-              clearTimeout(this.commandFeedbackTimeout);
-              this.commandFeedbackTimeout = null;
+          if (this.actionFeedbackTimeout) {
+              clearTimeout(this.actionFeedbackTimeout);
+              this.actionFeedbackTimeout = null;
           }
           if (this.stateUnsubscribe) {
               this.stateUnsubscribe();
@@ -35227,6 +35373,7 @@
               window.removeEventListener("scroll", this.boundScrollHandler);
               this.boundScrollHandler = null;
           }
+          this.cleanupNoAudioWarningTracking();
       }
       updated(changedProperties) {
           if (changedProperties.has("settingsOpen") && this.modalElement) {
@@ -35403,7 +35550,7 @@
           }
           if (this.widgetState.recordingState === "idle") {
               // Clear command feedback on any mic click
-              this.clearCommandFeedback();
+              this.clearActionFeedback();
               // If we're expanding, prefetch the token to reduce latency when user selects an action
               if (!this.widgetState.isExpanded) {
                   // Fire and forget - we don't need to wait for this (LiveKit only)
@@ -35420,6 +35567,8 @@
           }
       }
       async handleStopRecording() {
+          // Clean up no-audio warning tracking
+          this.cleanupNoAudioWarningTracking();
           if (this.widgetState.activeAction === "edit") {
               await this.handleStopEdit();
           }
@@ -35431,6 +35580,8 @@
               const backend = getBackend();
               try {
                   const transcription = await this.withMinDisplayTime(backend.stopVoiceSession(), 300);
+                  // Track result for consecutive failure detection
+                  this.trackActionResult(!!transcription);
                   if (transcription) {
                       // Check if we have a target element to insert into
                       if (this.dictationTargetElement) {
@@ -35450,6 +35601,8 @@
                   backend.startAutoRefresh?.();
               }
               catch (error) {
+                  // Track as failed result
+                  this.trackActionResult(false);
                   const errorMessage = error instanceof Error ? error.message : "Failed to transcribe audio";
                   if (errorMessage !== "Disconnected") {
                       state.setError(errorMessage);
@@ -35459,6 +35612,8 @@
           }
       }
       async handleCancelOperation() {
+          // Clean up no-audio warning tracking
+          this.cleanupNoAudioWarningTracking();
           await getBackend().disconnect();
           if (this.widgetState.recordingState === "error") {
               state.clearError();
@@ -35488,7 +35643,7 @@
           }
       }
       handleCloseWidget() {
-          this.clearCommandFeedback();
+          this.clearActionFeedback();
           state.hide();
       }
       handleSettingsClick() {
@@ -35616,7 +35771,7 @@
       handleActionSelect(event) {
           const { action } = event.detail;
           // Clear any existing command feedback when a new action is selected
-          this.clearCommandFeedback();
+          this.clearActionFeedback();
           state.setActiveAction(action);
           if (action === "dictate") {
               this.startDictation();
@@ -35679,10 +35834,12 @@
                       if (remainingDelay > 0) {
                           setTimeout(() => {
                               state.setRecordingState("recording");
+                              this.startNoAudioWarningTracking();
                           }, remainingDelay);
                       }
                       else {
                           state.setRecordingState("recording");
+                          this.startNoAudioWarningTracking();
                       }
                   },
               });
@@ -35690,7 +35847,10 @@
           catch (error) {
               const errorMessage = error instanceof Error ? error.message : "Connection failed";
               if (errorMessage !== "Disconnected") {
-                  state.setError(`Failed to connect: ${errorMessage}`);
+                  // Only set error if not already in error state (error event may have already set it)
+                  if (this.widgetState.recordingState !== "error") {
+                      state.setError(`Failed to connect: ${errorMessage}`);
+                  }
                   await backend.disconnect();
               }
           }
@@ -35745,10 +35905,12 @@
                       if (remainingDelay > 0) {
                           setTimeout(() => {
                               state.setRecordingState("recording");
+                              this.startNoAudioWarningTracking();
                           }, remainingDelay);
                       }
                       else {
                           state.setRecordingState("recording");
+                          this.startNoAudioWarningTracking();
                       }
                   },
               });
@@ -35756,7 +35918,10 @@
           catch (error) {
               const errorMessage = error instanceof Error ? error.message : "Connection failed";
               if (errorMessage !== "Disconnected") {
-                  state.setError(`Failed to connect: ${errorMessage}`);
+                  // Only set error if not already in error state (error event may have already set it)
+                  if (this.widgetState.recordingState !== "error") {
+                      state.setError(`Failed to connect: ${errorMessage}`);
+                  }
                   await backend.disconnect();
               }
           }
@@ -35767,12 +35932,30 @@
           const backend = getBackend();
           try {
               const editedText = await this.withMinDisplayTime(backend.requestEditText(originalContent), 300);
+              // Check if server returned no change (couldn't understand edit)
+              const noChange = editedText.trim() === originalContent.trim();
+              if (noChange) {
+                  this.trackActionResult(false);
+                  this.showActionFeedback("edit-empty");
+                  state.completeRecording();
+                  this.editTargetElement = null;
+                  this.editSelectionStart = null;
+                  this.editSelectionEnd = null;
+                  this.editSelectedText = "";
+                  backend.disconnect().catch(() => { });
+                  backend.startAutoRefresh?.();
+                  return;
+              }
+              // Track result - got a meaningful change
+              this.trackActionResult(true);
               this.applyEdit(editedText);
               backend.disconnect().catch(() => { });
               // Start auto-refresh to keep token fresh for subsequent commands (LiveKit only)
               backend.startAutoRefresh?.();
           }
           catch (error) {
+              // Track as failed result
+              this.trackActionResult(false);
               const errorMessage = error instanceof Error ? error.message : "Failed to apply edit";
               if (errorMessage !== "Disconnected") {
                   state.setError(errorMessage);
@@ -35798,10 +35981,12 @@
                       if (remainingDelay > 0) {
                           setTimeout(() => {
                               state.setRecordingState("recording");
+                              this.startNoAudioWarningTracking();
                           }, remainingDelay);
                       }
                       else {
                           state.setRecordingState("recording");
+                          this.startNoAudioWarningTracking();
                       }
                   },
               });
@@ -35809,7 +35994,10 @@
           catch (error) {
               const errorMessage = error instanceof Error ? error.message : "Connection failed";
               if (errorMessage !== "Disconnected") {
-                  state.setError(`Failed to connect: ${errorMessage}`);
+                  // Only set error if not already in error state (error event may have already set it)
+                  if (this.widgetState.recordingState !== "error") {
+                      state.setError(`Failed to connect: ${errorMessage}`);
+                  }
                   await backend.disconnect();
               }
           }
@@ -35821,6 +36009,8 @@
           const backend = getBackend();
           try {
               const result = await this.withMinDisplayTime(backend.requestCommand(commands), 300);
+              // Track result - null result means no command matched (possibly no audio)
+              this.trackActionResult(result !== null);
               // Get input text from the backend if available
               const inputText = backend.getLastInputText?.();
               // Save to transcript store
@@ -35838,12 +36028,14 @@
               // Keep widget visible but collapsed (just mic button, no action bubbles)
               state.setState({ isExpanded: false });
               // Show command feedback
-              this.showCommandFeedback(result ? "success" : "none");
+              this.showActionFeedback(result ? "command-success" : "command-none");
               backend.disconnect().catch(() => { });
               // Start auto-refresh to keep token fresh for subsequent commands (LiveKit only)
               backend.startAutoRefresh?.();
           }
           catch (error) {
+              // Track as failed result
+              this.trackActionResult(false);
               const errorMessage = error instanceof Error ? error.message : "Failed to process command";
               if (errorMessage !== "Disconnected") {
                   state.setError(errorMessage);
@@ -35851,24 +36043,110 @@
               }
           }
       }
-      showCommandFeedback(feedback) {
-          this.commandFeedback = feedback;
+      showActionFeedback(feedback) {
+          this.actionFeedback = feedback;
           // Clear any existing timeout
-          if (this.commandFeedbackTimeout) {
-              clearTimeout(this.commandFeedbackTimeout);
+          if (this.actionFeedbackTimeout) {
+              clearTimeout(this.actionFeedbackTimeout);
           }
           // Auto-dismiss after 4 seconds
-          this.commandFeedbackTimeout = window.setTimeout(() => {
-              this.commandFeedback = null;
-              this.commandFeedbackTimeout = null;
+          this.actionFeedbackTimeout = window.setTimeout(() => {
+              this.actionFeedback = null;
+              this.actionFeedbackTimeout = null;
           }, 4000);
       }
-      clearCommandFeedback() {
-          if (this.commandFeedbackTimeout) {
-              clearTimeout(this.commandFeedbackTimeout);
-              this.commandFeedbackTimeout = null;
+      clearActionFeedback() {
+          if (this.actionFeedbackTimeout) {
+              clearTimeout(this.actionFeedbackTimeout);
+              this.actionFeedbackTimeout = null;
           }
-          this.commandFeedback = null;
+          this.actionFeedback = null;
+      }
+      /**
+       * Start tracking for no-audio warning when recording begins.
+       */
+      startNoAudioWarningTracking() {
+          this.transcriptionReceived = false;
+          this.showNoAudioWarning = false;
+          // If we had consecutive failures, show warning immediately
+          if (this.consecutiveNoAudioActions >= CONSECUTIVE_NO_AUDIO_THRESHOLD) {
+              this.showNoAudioWarning = true;
+          }
+          // Start timeout - if no transcription within 5s, show warning
+          this.noAudioWarningTimeout = window.setTimeout(() => {
+              if (!this.transcriptionReceived &&
+                  this.widgetState.recordingState === "recording") {
+                  this.showNoAudioWarning = true;
+              }
+          }, NO_AUDIO_WARNING_TIMEOUT_MS);
+          // Subscribe to transcription:interim events
+          this.transcriptionInterimUnsubscribe = events.on("transcription:interim", () => {
+              this.transcriptionReceived = true;
+              if (this.showNoAudioWarning) {
+                  this.showNoAudioWarning = false;
+              }
+          });
+      }
+      /**
+       * Clean up no-audio warning tracking when recording stops.
+       */
+      cleanupNoAudioWarningTracking() {
+          if (this.noAudioWarningTimeout !== null) {
+              clearTimeout(this.noAudioWarningTimeout);
+              this.noAudioWarningTimeout = null;
+          }
+          if (this.transcriptionInterimUnsubscribe) {
+              this.transcriptionInterimUnsubscribe();
+              this.transcriptionInterimUnsubscribe = null;
+          }
+          this.showNoAudioWarning = false;
+      }
+      /**
+       * Track the result of an action for consecutive failure detection.
+       */
+      trackActionResult(hasContent) {
+          if (hasContent) {
+              this.consecutiveNoAudioActions = 0;
+          }
+          else {
+              this.consecutiveNoAudioActions++;
+          }
+      }
+      /**
+       * Handle opening settings from the no-audio warning.
+       * Stops the current dictation session immediately, then opens settings.
+       */
+      async handleOpenSettingsFromWarning() {
+          if (getConfig().debug) {
+              console.log("[SpeechOS] No-audio settings link clicked");
+          }
+          // Clean up no-audio warning tracking first
+          this.cleanupNoAudioWarningTracking();
+          // Keep settings open even if widget collapses
+          this.settingsOpenFromWarning = true;
+          // Stop audio capture and disconnect immediately (don't wait for transcription)
+          // Kick this off before opening settings so audio stops fast, but don't block UI.
+          const disconnectPromise = getBackend().disconnect().catch((error) => {
+              if (getConfig().debug) {
+                  console.log("[SpeechOS] Disconnect failed while opening settings", error);
+              }
+          });
+          // Update UI state to idle
+          state.cancelRecording();
+          // Clear target elements
+          this.dictationTargetElement = null;
+          this.editTargetElement = null;
+          this.dictationCursorStart = null;
+          this.dictationCursorEnd = null;
+          this.editSelectionStart = null;
+          this.editSelectionEnd = null;
+          this.editSelectedText = "";
+          // Open settings modal
+          this.settingsOpen = true;
+          if (getConfig().debug) {
+              console.log("[SpeechOS] Settings modal opened from no-audio warning");
+          }
+          await disconnectPromise;
       }
       supportsSelection(element) {
           if (element.tagName.toLowerCase() === "textarea") {
@@ -35987,12 +36265,14 @@
             activeAction="${this.widgetState.activeAction || ""}"
             editPreviewText="${this.editSelectedText}"
             errorMessage="${this.widgetState.errorMessage || ""}"
-            .commandFeedback="${this.commandFeedback}"
+            .actionFeedback="${this.actionFeedback}"
+            ?showNoAudioWarning="${this.showNoAudioWarning}"
             @mic-click="${this.handleMicClick}"
             @stop-recording="${this.handleStopRecording}"
             @cancel-operation="${this.handleCancelOperation}"
             @retry-connection="${this.handleRetryConnection}"
             @close-widget="${this.handleCloseWidget}"
+            @open-settings="${this.handleOpenSettingsFromWarning}"
           ></speechos-mic-button>
         </div>
       </div>
@@ -36016,7 +36296,10 @@
   ], SpeechOSWidget.prototype, "editHelpModalOpen", void 0);
   __decorate([
       r()
-  ], SpeechOSWidget.prototype, "commandFeedback", void 0);
+  ], SpeechOSWidget.prototype, "actionFeedback", void 0);
+  __decorate([
+      r()
+  ], SpeechOSWidget.prototype, "showNoAudioWarning", void 0);
   SpeechOSWidget = SpeechOSWidget_1 = __decorate([
       t$1("speechos-widget")
   ], SpeechOSWidget);