feat: widget conversation modes

Add WidgetConversationMode so a host can run the widget as voice-only,
text-only, or both. Text-only conversations connect with audio disabled and
start implicitly on the first message; voice-only drops the composer and keeps
the orb above the transcript. The demo switches modes at runtime.

Co-authored-by: Cursor <cursoragent@cursor.com>

Author: renal128

Examples/DemoApp/DemoApp/ContentView.swift

@@ -18,6 +18,7 @@ struct ContentView: View {
     /// Shared by the button and the client tool, so a tool call arriving during a
     /// search awaits that one instead of starting a second, overlapping search.
     @State private var inFlightSearch: Task<Int, Never>?
+    @State private var conversationMode: WidgetConversationMode = .voiceAndText
 
     var body: some View {
         ZStack {
@@ -33,6 +34,7 @@ struct ContentView: View {
 
             ChatWidget(
                 authProvider: { .publicAgent(id: Self.agentId) },
+                widgetConfig: ChatWidgetConfig(conversationMode: conversationMode),
                 conversationConfig: ConversationConfig(
                     agentOverrides: AgentOverrides(
                         prompt: """
@@ -110,6 +112,14 @@ struct ContentView: View {
                 .disabled(!chat.state.isConnected)
             }
             .buttonStyle(.bordered)
+
+            Picker("Mode", selection: $conversationMode) {
+                Text("Voice & text").tag(WidgetConversationMode.voiceAndText)
+                Text("Voice").tag(WidgetConversationMode.voiceOnly)
+                Text("Text").tag(WidgetConversationMode.textOnly)
+            }
+            .pickerStyle(.segmented)
+            .frame(maxWidth: 300)
         }
     }
 

Sources/ElevenLabsWidget/Configuration/ChatWidgetConfig.swift

@@ -3,6 +3,8 @@ import Foundation
 
 /// Behavior and appearance of ``ChatWidget``.
 public struct ChatWidgetConfig: Equatable, Sendable {
+    /// Whether the user talks, types, or both.
+    public var conversationMode: WidgetConversationMode
     /// Dim the host UI behind the open drawer.
     public var showBackdrop: Bool
     /// Show the microphone mute button while a conversation is live.
@@ -11,11 +13,13 @@ public struct ChatWidgetConfig: Equatable, Sendable {
     public var theme: ChatWidgetTheme
 
     public init(
+        conversationMode: WidgetConversationMode = .voiceAndText,
         showBackdrop: Bool = true,
         enableMicMuteControl: Bool = true,
         strings: ChatWidgetStrings = .default,
         theme: ChatWidgetTheme = .default
     ) {
+        self.conversationMode = conversationMode
         self.showBackdrop = showBackdrop
         self.enableMicMuteControl = enableMicMuteControl
         self.strings = strings

Sources/ElevenLabsWidget/Configuration/WidgetConversationMode.swift

@@ -0,0 +1,25 @@
+#if canImport(UIKit)
+import Foundation
+
+/// Which ways the user can talk to the agent through ``ChatWidget``.
+public enum WidgetConversationMode: String, CaseIterable, Identifiable, Sendable {
+    /// Typed messages only; the conversation runs without audio.
+    case textOnly
+    /// A voice call with no composer.
+    case voiceOnly
+    /// A voice call the user can also type into.
+    case voiceAndText
+
+    public var id: String {
+        rawValue
+    }
+
+    public var supportsVoice: Bool {
+        self != .textOnly
+    }
+
+    public var supportsTextInput: Bool {
+        self != .voiceOnly
+    }
+}
+#endif

Sources/ElevenLabsWidget/ViewModels/ChatWidgetViewModel.swift

@@ -68,7 +68,27 @@ final class ChatWidgetViewModel: ObservableObject {
     }
 
     var canToggleMicMute: Bool {
-        widgetConfig.enableMicMuteControl && conversationState.isConnected
+        widgetConfig.enableMicMuteControl && mode.supportsVoice && conversationState.isConnected
+    }
+
+    var canShowTextInput: Bool {
+        mode.supportsTextInput
+    }
+
+    var canStartVoiceConversation: Bool {
+        mode.supportsVoice && !hasActiveConversation
+    }
+
+    private var mode: WidgetConversationMode {
+        widgetConfig.conversationMode
+    }
+
+    /// Text-only widgets run the conversation without audio.
+    private var effectiveConversationConfig: ConversationConfig {
+        guard !mode.supportsVoice else { return conversationConfig }
+        var config = conversationConfig
+        config.conversationOverrides.textOnly = true
+        return config
     }
 
     var orbState: ChatOrbState {
@@ -106,7 +126,7 @@ final class ChatWidgetViewModel: ObservableObject {
 
     func startConversationAndWait() async throws {
         guard !hasActiveConversation else { return }
-        _ = try await client.startConversation(auth: authProvider(), config: conversationConfig)
+        _ = try await client.startConversation(auth: authProvider(), config: effectiveConversationConfig)
     }
 
     func endConversation() {

Sources/ElevenLabsWidget/Views/ChatInputBar.swift

@@ -17,25 +17,34 @@ struct ChatInputBar: View {
 
     var body: some View {
         VStack(spacing: 10) {
-            TextField(strings.inputPlaceholder, text: $vm.input, axis: .vertical)
-                .textFieldStyle(.plain)
-                .lineLimit(1 ... 3)
-                .padding(.horizontal, 8)
-                .frame(minHeight: 36)
-                .focused(isInputFocused)
-                .onSubmit(vm.send)
+            if vm.canShowTextInput {
+                TextField(strings.inputPlaceholder, text: $vm.input, axis: .vertical)
+                    .textFieldStyle(.plain)
+                    .lineLimit(1 ... 3)
+                    .padding(.horizontal, 8)
+                    .frame(minHeight: 36)
+                    .focused(isInputFocused)
+                    .onSubmit(vm.send)
+            }
 
             HStack(spacing: 10) {
                 if vm.canToggleMicMute {
                     ChatMicButton(vm: vm, levels: vm.audioLevels, diameter: 38, theme: theme)
                 }
+                // Without a composer there is nothing to push the call controls
+                // away from, so they sit centered instead.
                 Spacer(minLength: 0)
                 if vm.hasActiveConversation {
                     endConversationButton
-                } else {
+                } else if vm.canStartVoiceConversation {
                     startConversationButton
                 }
-                sendButton
+                if vm.canShowTextInput {
+                    sendButton
+                }
+                if !vm.canShowTextInput {
+                    Spacer(minLength: 0)
+                }
             }
         }
         .padding(.horizontal, 14)
@@ -50,7 +59,7 @@ struct ChatInputBar: View {
                 .strokeBorder(theme.border, lineWidth: 1)
         )
         .contentShape(Rectangle())
-        .onTapGesture { isInputFocused.wrappedValue = true }
+        .onTapGesture { if vm.canShowTextInput { isInputFocused.wrappedValue = true } }
     }
 
     private var startConversationButton: some View {

Sources/ElevenLabsWidget/Views/ChatPopupView.swift

@@ -19,9 +19,14 @@ struct ChatPopupView: View {
             Divider()
             if vm.messages.isEmpty {
                 Spacer(minLength: 0)
-                ChatOrbView(levels: vm.audioLevels, state: vm.orbState, size: 128, theme: vm.widgetConfig.theme)
+                orb(size: 128)
                 Spacer(minLength: 0)
             } else {
+                // A voice-only drawer has no composer to anchor it, so the orb
+                // stays visible above the transcript.
+                if !vm.canShowTextInput {
+                    orb(size: 96).padding(.vertical, 12)
+                }
                 ChatTranscriptView(vm: vm)
             }
             ChatInputBar(vm: vm, isInputFocused: $isInputFocused)
@@ -39,9 +44,13 @@ struct ChatPopupView: View {
         .padding(.bottom, 8)
     }
 
+    private func orb(size: CGFloat) -> some View {
+        ChatOrbView(levels: vm.audioLevels, state: vm.orbState, size: size, theme: vm.widgetConfig.theme)
+    }
+
     private var header: some View {
         HStack(spacing: 12) {
-            ChatOrbView(levels: vm.audioLevels, state: vm.orbState, size: 36, theme: vm.widgetConfig.theme)
+            orb(size: 36)
             Text(strings.title)
                 .font(.headline)
             Spacer(minLength: 0)