Add iOS views to guides

Author: mattieruth

client/concepts/events-and-callbacks.mdx

@@ -18,6 +18,11 @@ You are currently viewing the JavaScript version of this page. Use the dropdown
 You are currently viewing the React Native version of this page. Use the dropdown to the right to customize this page for your client framework.
 </Callout>
 </View>
+<View title="iOS" icon="apple">
+<Callout icon="apple" color="#FFC107">
+You are currently viewing the iOS version of this page. Use the dropdown to the right to customize this page for your client framework.
+</Callout>
+</View>
 
 The Pipecat client emits events throughout the session lifecycle — when the bot connects, when the user speaks, when a transcript arrives, and more.
 
@@ -97,6 +102,36 @@ Always return a cleanup function from `useEffect` to remove the listener when th
 
 </View>
 
+<View title="iOS" icon="apple">
+
+Conform your model to `PipecatClientDelegate` and assign it as the delegate after creating the client. All delegate methods are optional — implement only what you need:
+
+```swift
+let client = PipecatClient(options: PipecatClientOptions(
+  transport: SmallWebRTCTransport(),
+  enableMic: true
+))
+client.delegate = self
+
+extension MyModel: PipecatClientDelegate {
+  func onBotReady(botReadyData: BotReadyData) {
+    Task { @MainActor in
+      print("Bot is ready")
+    }
+  }
+
+  func onUserTranscript(data: Transcript) {
+    Task { @MainActor in
+      if data.final ?? false { setTranscript(data.text) }
+    }
+  }
+}
+```
+
+Delegate callbacks arrive on a background thread — always use `Task { @MainActor in }` before updating `@Published` properties or any UI state.
+
+</View>
+
 ---
 
 ## Event reference
@@ -203,6 +238,22 @@ useEffect(() => {
 
 </View>
 
+<View title="iOS" icon="apple">
+
+```swift
+func onUserTranscript(data: Transcript) {
+  Task { @MainActor in
+    if data.final ?? false {
+      addMessage(data.text) // committed
+    } else {
+      updatePartial(data.text) // still in progress
+    }
+  }
+}
+```
+
+</View>
+
 `BotOutput` is the recommended way to display the bot's response text. It provides the best possible representation of what the bot is saying — supporting interruptions and unspoken responses. By default, Pipecat aggregates output by sentences and words (assuming your TTS supports streaming), but custom aggregation strategies are supported too - like breaking out code snippets or other structured content:
 
 <View title="React" icon="react">
@@ -248,6 +299,20 @@ useEffect(() => {
 
 </View>
 
+<View title="iOS" icon="apple">
+
+The iOS SDK exposes `onBotTranscript` for the bot's LLM text output:
+
+```swift
+func onBotTranscript(data: BotLLMText) {
+  Task { @MainActor in
+    appendSentence(data.text)
+  }
+}
+```
+
+</View>
+
 ### Errors
 
 | Event | Callback | When it fires |
@@ -306,6 +371,19 @@ useEffect(() => {
 
 </View>
 
+<View title="iOS" icon="apple">
+
+```swift
+func onError(message: RTVIMessageInbound) {
+  Task { @MainActor in
+    // message.data contains the error description string
+    showError(message.data ?? "Unknown error")
+  }
+}
+```
+
+</View>
+
 ### Devices and tracks
 
 | Event | Callback | When it fires |
@@ -375,3 +453,13 @@ For custom server\<-\>client messaging, see [Custom Messaging](/client/guides/cu
 </CardGroup>
 
 </View>
+
+<View title="iOS" icon="apple">
+
+<CardGroup cols={1}>
+  <Card title="iOS SDK Reference" icon="apple" href="/api-reference/client/ios/overview">
+    Full `PipecatClientDelegate` protocol and API reference
+  </Card>
+</CardGroup>
+
+</View>

client/concepts/media-management.mdx

@@ -18,6 +18,11 @@ You are currently viewing the JavaScript version of this page. Use the dropdown
 You are currently viewing the React Native version of this page. Use the dropdown to the right to customize this page for your client framework.
 </Callout>
 </View>
+<View title="iOS" icon="apple">
+<Callout icon="apple" color="#FFC107">
+You are currently viewing the iOS version of this page. Use the dropdown to the right to customize this page for your client framework.
+</Callout>
+</View>
 
 The Pipecat client handles media at two levels: **local devices** (the user's mic, camera, and speakers) and **media tracks** (the live audio/video streams flowing between client and bot). This page covers how to work with both.
 
@@ -79,6 +84,12 @@ const client = new PipecatClient({
 
 </View>
 
+<View title="iOS" icon="apple">
+
+Audio output is handled automatically by the SDK — no additional setup required. The bot's audio plays through the device speaker as soon as the session connects.
+
+</View>
+
 ---
 
 ## Microphone
@@ -152,6 +163,29 @@ function MicButton() {
 
 </View>
 
+<View title="iOS" icon="apple">
+
+Call `enableMic(enable:completion:)` to mute and unmute. The completion handler fires on success or failure:
+
+```swift
+func toggleMic() {
+  client.enableMic(enable: !isMicEnabled) { [weak self] result in
+    switch result {
+    case .success:
+      Task { @MainActor in
+        self?.isMicEnabled = self?.client.isMicEnabled ?? false
+      }
+    case .failure(let error):
+      print("Mic toggle error: \(error)")
+    }
+  }
+}
+```
+
+Check current state with `client.isMicEnabled`.
+
+</View>
+
 ### Switching microphones
 
 <View title="React" icon="react">
@@ -206,6 +240,27 @@ client.updateMic(mics[1].deviceId);
 
 </View>
 
+<View title="iOS" icon="apple">
+
+Enumerate available microphones with `getAllMics()` and switch with `updateMic(micId:completion:)`:
+
+```swift
+let mics = client.getAllMics() // [MediaDeviceInfo]
+client.updateMic(micId: mics[1].id, completion: nil)
+```
+
+Listen for device changes via the delegate:
+
+```swift
+func onAvailableMicsUpdated(mics: [MediaDeviceInfo]) {
+  Task { @MainActor in
+    self.availableMics = mics
+  }
+}
+```
+
+</View>
+
 ---
 
 ## Camera
@@ -281,6 +336,39 @@ Switch cameras with [`getAllCams()`](/api-reference/client/js/client-methods#get
 
 </View>
 
+<View title="iOS" icon="apple">
+
+Enable the camera via `PipecatClientOptions` and toggle it with `enableCam(enable:completion:)`:
+
+```swift
+let options = PipecatClientOptions(
+  transport: SmallWebRTCTransport(),
+  enableMic: true,
+  enableCam: true
+)
+
+client.enableCam(enable: true) { result in /* ... */ }
+let isOn = client.isCamEnabled
+```
+
+Receive track events to get the `MediaStreamTrack` for rendering:
+
+```swift
+func onTrackStarted(track: MediaStreamTrack, participant: Participant?) {
+  Task { @MainActor in
+    if track.kind == .video {
+      if participant?.local ?? true {
+        self.localCamTrackId = track.id
+      } else {
+        self.botCamTrackId = track.id
+      }
+    }
+  }
+}
+```
+
+</View>
+
 ---
 
 ## Speakers
@@ -312,6 +400,16 @@ Audio routing (speaker vs. earpiece) is managed by the platform and `DailyMediaM
 
 </View>
 
+<View title="iOS" icon="apple">
+
+Audio routing (speaker vs. earpiece) is managed by AVAudioSession. Use `AVAudioSession.sharedInstance()` to configure the output route if needed:
+
+```swift
+try AVAudioSession.sharedInstance().overrideOutputAudioPort(.speaker)
+```
+
+</View>
+
 ---
 
 ## Device initialization before connecting
@@ -391,6 +489,21 @@ useEffect(() => {
 
 </View>
 
+<View title="iOS" icon="apple">
+
+Receive `onTrackStarted` in your delegate to access tracks as they become available:
+
+```swift
+func onTrackStarted(track: MediaStreamTrack, participant: Participant?) {
+  Task { @MainActor in
+    // track.kind is .audio or .video
+    // participant?.local is true for the local participant
+  }
+}
+```
+
+</View>
+
 ---
 
 ## Audio visualization
@@ -460,6 +573,39 @@ function AudioViz() {
 
 </View>
 
+<View title="iOS" icon="apple">
+
+Receive audio level callbacks via the delegate and drive your own SwiftUI visualization:
+
+```swift
+@Published var localAudioLevel: Float = 0
+@Published var remoteAudioLevel: Float = 0
+
+func onLocalAudioLevel(level: Float) {
+  Task { @MainActor in
+    self.localAudioLevel = level
+  }
+}
+
+func onRemoteAudioLevel(level: Float, participant: Participant) {
+  Task { @MainActor in
+    self.remoteAudioLevel = level
+  }
+}
+```
+
+```swift
+// In your SwiftUI view
+GeometryReader { geo in
+  Rectangle()
+    .fill(Color.blue)
+    .frame(width: geo.size.width * CGFloat(model.localAudioLevel))
+}
+.frame(height: 8)
+```
+
+</View>
+
 ---
 
 ## API reference
@@ -499,3 +645,13 @@ function AudioViz() {
 </CardGroup>
 
 </View>
+
+<View title="iOS" icon="apple">
+
+<CardGroup cols={1}>
+  <Card title="iOS SDK Reference" icon="apple" href="/api-reference/client/ios/overview">
+    Full API reference including `PipecatClientDelegate` and device management
+  </Card>
+</CardGroup>
+
+</View>