@vapi-ai/web 2.6.2 → 2.7.0

package/dist/vapi.d.ts

@@ -23,7 +23,7 @@ export interface SayMessage {
     interruptAssistantEnabled?: boolean;
 }
 type VapiClientToServerMessage = AddMessageMessage | ControlMessages | SayMessage | EndCallMessage;
-type VapiEventNames = 'call-end' | 'call-start' | 'volume-level' | 'local-volume-level' | 'local-audio-level-observer-error' | 'speech-start' | 'speech-end' | 'message' | 'video' | 'error' | 'camera-error' | 'network-quality-change' | 'network-connection' | 'daily-participant-updated' | 'call-start-progress' | 'call-start-success' | 'call-start-failed' | 'recording-started' | 'recording-stopped' | 'recording-stats' | 'recording-error' | 'recording-upload-completed';
+type VapiEventNames = 'call-end' | 'call-start' | 'volume-level' | 'local-volume-level' | 'local-audio-level-observer-error' | 'speech-start' | 'speech-end' | 'message' | 'video' | 'audio' | 'error' | 'camera-error' | 'network-quality-change' | 'network-connection' | 'daily-participant-updated' | 'call-start-progress' | 'call-start-success' | 'call-start-failed' | 'recording-started' | 'recording-stopped' | 'recording-stats' | 'recording-error' | 'recording-upload-completed';
 interface CallStartProgressEvent {
     stage: string;
     status: 'started' | 'completed' | 'failed';
@@ -53,6 +53,7 @@ type VapiEventListeners = {
     'speech-start': () => void;
     'speech-end': () => void;
     video: (track: MediaStreamTrack) => void;
+    audio: (player: HTMLAudioElement) => void;
     message: (message: any) => void;
     error: (error: any) => void;
     'camera-error': (error: any) => void;
@@ -108,6 +109,16 @@ type WebCall = {
             provider?: string;
         };
     };
+    /**
+     * The Vapi WebCall transport. When video recording is enabled, the server
+     * sets `callToken` to a Daily meeting token that auto-starts the cloud
+     * recording on join.
+     *
+     * call.transport
+     */
+    transport?: {
+        callToken?: string;
+    };
 };
 declare class VapiEventEmitter extends EventEmitter {
     on<E extends VapiEventNames>(event: E, listener: VapiEventListeners[E]): this;
@@ -119,6 +130,11 @@ declare class VapiEventEmitter extends EventEmitter {
 export default class Vapi extends VapiEventEmitter {
     private started;
     private call;
+    private audioPlayer;
+    private desiredVolume;
+    private audioBuildSequence;
+    private pendingAudioBuilds;
+    private attachedAudioBuild;
     private speakingTimeout;
     private dailyCallConfig;
     private dailyCallObject;
@@ -155,6 +171,56 @@ export default class Vapi extends VapiEventEmitter {
      * Docs: https://docs.vapi.ai/calls/call-features
      */
     send(message: VapiClientToServerMessage): void;
+    /**
+     * The two places this class touches the DOM, behind indirections so the
+     * lifecycle logic around them is testable without a browser.
+     */
+    private audioPlayerBuild;
+    private audioPlayerDestroy;
+    /**
+     * The remembered volume, bounded, or null if there is nothing to apply.
+     * Shared by both callers so they cannot disagree: the DOM throws on a
+     * non-finite or out-of-range volume, and that throw would stall the call.
+     */
+    private desiredVolumeResolve;
+    /** Shared by the initial and reconnect paths so the two cannot drift. */
+    private handleTrackStarted;
+    /**
+     * Assigns before emitting, since emit is synchronous and a listener may call
+     * getAudioPlayer or setVolume during the event.
+     */
+    private attachAudioPlayer;
+    /**
+     * A listener that throws must not take down the caller: track-started still
+     * has to signal that playback is ready. Not routed to the `error` event,
+     * which EventEmitter throws on when nothing is listening.
+     */
+    private emitToConsumer;
+    /** Drops the reference before removing, so nothing hands out a detached element. */
+    private detachAudioPlayer;
+    /**
+     * The <audio> element playing the assistant, or null before its track has
+     * arrived. Pair with the `audio` event when you need it the moment it exists.
+     */
+    getAudioPlayer(): HTMLAudioElement | null;
+    /**
+     * Sets assistant playback volume, 0 to 1.
+     *
+     * The setting is remembered, so it can be applied before the assistant's
+     * audio track has arrived and it survives across calls and mid-call track
+     * replacement. Callers do not have to race the start of the call.
+     *
+     * Values outside 0 to 1 are clamped and non-finite values are ignored, since
+     * the DOM rejects both rather than saturating.
+     *
+     * Only volume set through this method is remembered. Writing `volume`
+     * directly on the element from getAudioPlayer() or the `audio` event applies
+     * to that element alone, and is overwritten the next time one is attached.
+     *
+     * This is playback only. It does not change what the assistant hears, and it
+     * does not affect the levels reported by the `volume-level` event.
+     */
+    setVolume(volume: number): void;
     setMuted(mute: boolean): void;
     isMuted(): boolean;
     say(message: string, endCallAfterSpoken?: boolean, interruptionsEnabled?: boolean, interruptAssistantEnabled?: boolean): void;
@@ -200,6 +266,21 @@ export default class Vapi extends VapiEventEmitter {
     isLocalAudioLevelObserverRunning(): boolean;
     startScreenSharing(displayMediaOptions?: DisplayMediaStreamOptions, screenVideoSendSettings?: DailyVideoSendSettings): void;
     stopScreenSharing(): void;
+    /**
+     * Starts (or retries) a cloud recording of the call.
+     *
+     * Recording start is asynchronous: success is signaled by the
+     * 'recording-started' event and failure by 'recording-error'. Daily does not
+     * retry automatically, so if you receive 'recording-error' (e.g. the
+     * recording start timed out), you can call this method again a few seconds
+     * later to retry.
+     */
+    startRecording(): void;
+    /**
+     * Stops the in-progress recording. Completion is signaled by the
+     * 'recording-stopped' event.
+     */
+    stopRecording(): void;
     /**
      * Reconnects to an active call.
      *

package/dist/vapi.js

@@ -66,11 +66,22 @@ async function startAudioPlayer(player, track) {
         await player.play();
     }
 }
-async function buildAudioPlayer(track, participantId) {
+async function buildAudioPlayer(track, participantId, volume) {
     const player = document.createElement('audio');
     player.dataset.participantId = participantId;
+    // Before play(), so an already-flowing track never plays at full volume first.
+    if (typeof volume === 'number') {
+        player.volume = volume;
+    }
     document.body.appendChild(player);
-    await startAudioPlayer(player, track);
+    try {
+        await startAudioPlayer(player, track);
+    }
+    catch (error) {
+        // Appended before playback was attempted, so a failure would strand it.
+        player.remove();
+        throw error;
+    }
     return player;
 }
 function destroyAudioPlayer(participantId) {
@@ -111,6 +122,15 @@ class VapiEventEmitter extends events_1.default {
 class Vapi extends VapiEventEmitter {
     started = false;
     call = null;
+    audioPlayer = null;
+    // Survives teardown so the caller's choice persists across calls.
+    desiredVolume = null;
+    // Builds are tracked individually, not by one counter: several can be in
+    // flight, they finish out of order, and a teardown must invalidate only the
+    // builds belonging to the participant that left.
+    audioBuildSequence = 0;
+    pendingAudioBuilds = new Map();
+    attachedAudioBuild = 0;
     speakingTimeout = null;
     dailyCallConfig = {};
     dailyCallObject = {};
@@ -129,6 +149,8 @@ class Vapi extends VapiEventEmitter {
             await this.call.destroy();
             this.call = null;
         }
+        this.audioPlayer = null;
+        this.pendingAudioBuilds.clear();
         this.speakingTimeout = null;
     }
     isMobileDevice() {
@@ -234,6 +256,11 @@ class Vapi extends VapiEventEmitter {
             }
             const isVideoRecordingEnabled = webCall?.artifactPlan?.videoRecordingEnabled ?? false;
             const isVideoEnabled = webCall?.assistant?.voice?.provider === 'tavus';
+            // When video recording is enabled, the server sends a Daily meeting
+            // token that auto-starts the cloud recording on join — more reliable
+            // than calling startRecording() from a weak client network. Older
+            // servers don't send one; then the client starts the recording itself.
+            const callToken = webCall?.transport?.callToken;
             // Stage 2: Create Daily call object
             this.emit('call-start-progress', {
                 stage: 'daily-call-object-creation',
@@ -291,6 +318,8 @@ class Vapi extends VapiEventEmitter {
                     this.hasEmittedCallEndedStatus = true;
                 }
                 if (isVideoRecordingEnabled) {
+                    // When using a token, the recording doesn't stop automatically on
+                    // leave, so still stop it manually to preserve existing behavior.
                     this.call?.stopRecording();
                 }
                 this.cleanup().catch(console.error);
@@ -338,24 +367,7 @@ class Vapi extends VapiEventEmitter {
                 if (event)
                     this.emit('recording-upload-completed', event);
             });
-            this.call.on('track-started', async (e) => {
-                if (!e || !e.participant) {
-                    return;
-                }
-                if (e.participant?.local) {
-                    return;
-                }
-                if (e.participant?.user_name !== 'Vapi Speaker') {
-                    return;
-                }
-                if (e.track.kind === 'video') {
-                    this.emit('video', e.track);
-                }
-                if (e.track.kind === 'audio') {
-                    await buildAudioPlayer(e.track, e.participant.session_id);
-                }
-                this.call?.sendAppMessage('playable');
-            });
+            this.call.on('track-started', (e) => this.handleTrackStarted(e));
             this.call.on('participant-joined', (e) => {
                 if (!e || !this.call)
                     return;
@@ -371,8 +383,28 @@ class Vapi extends VapiEventEmitter {
                 if (!e) {
                     return;
                 }
-                destroyAudioPlayer(e.participant.session_id);
+                this.detachAudioPlayer(e.participant.session_id);
             });
+            // Registered before join(): a token-auto-started recording can begin
+            // while join() is still in flight, so a listener added after join
+            // could miss the event.
+            let recordingRequestedTime = 0;
+            if (isVideoRecordingEnabled) {
+                this.call.once('recording-started', () => {
+                    const totalRecordingDelay = (new Date().getTime() - recordingRequestedTime) / 1000;
+                    this.emit('call-start-progress', {
+                        stage: 'video-recording-started',
+                        status: 'completed',
+                        timestamp: new Date().toISOString(),
+                        metadata: { delaySeconds: totalRecordingDelay }
+                    });
+                    this.send({
+                        type: 'control',
+                        control: 'say-first-message',
+                        videoRecordingStartDelaySeconds: totalRecordingDelay,
+                    });
+                });
+            }
             // Stage 3: Mobile device handling and permissions
             const isMobile = this.isMobileDevice();
             this.emit('call-start-progress', {
@@ -408,10 +440,14 @@ class Vapi extends VapiEventEmitter {
                 timestamp: new Date().toISOString()
             });
             const joinStartTime = Date.now();
+            recordingRequestedTime = joinStartTime;
             try {
                 await this.call.join({
                     // @ts-expect-error This exists
                     url: webCall.webCallUrl,
+                    // daily-js rejects a `token` key that is present but undefined, so
+                    // only include it when the server actually sent one.
+                    ...(callToken ? { token: callToken } : {}),
                     subscribeToTracksAutomatically: false,
                 });
                 const joinDuration = Date.now() - joinStartTime;
@@ -442,23 +478,26 @@ class Vapi extends VapiEventEmitter {
                 throw error;
             }
             // Stage 5: Video recording setup (if enabled)
-            if (isVideoRecordingEnabled) {
+            if (isVideoRecordingEnabled && callToken) {
+                // The meeting token auto-started the recording at join, so there is
+                // nothing to request from the client.
+                this.emit('call-start-progress', {
+                    stage: 'video-recording-setup',
+                    status: 'completed',
+                    timestamp: new Date().toISOString(),
+                    metadata: { action: 'auto-started-via-meeting-token' }
+                });
+            }
+            else if (isVideoRecordingEnabled) {
                 this.emit('call-start-progress', {
                     stage: 'video-recording-setup',
                     status: 'started',
                     timestamp: new Date().toISOString()
                 });
-                const recordingRequestedTime = new Date().getTime();
                 const recordingStartTime = Date.now();
                 try {
-                    this.call.startRecording({
-                        width: 1280,
-                        height: 720,
-                        backgroundColor: '#FF1F2D3D',
-                        layout: {
-                            preset: 'default',
-                        },
-                    });
+                    recordingRequestedTime = new Date().getTime();
+                    this.startRecording();
                     const recordingSetupDuration = Date.now() - recordingStartTime;
                     this.emit('call-start-progress', {
                         stage: 'video-recording-setup',
@@ -466,20 +505,6 @@ class Vapi extends VapiEventEmitter {
                         duration: recordingSetupDuration,
                         timestamp: new Date().toISOString()
                     });
-                    this.call.on('recording-started', () => {
-                        const totalRecordingDelay = (new Date().getTime() - recordingRequestedTime) / 1000;
-                        this.emit('call-start-progress', {
-                            stage: 'video-recording-started',
-                            status: 'completed',
-                            timestamp: new Date().toISOString(),
-                            metadata: { delaySeconds: totalRecordingDelay }
-                        });
-                        this.send({
-                            type: 'control',
-                            control: 'say-first-message',
-                            videoRecordingStartDelaySeconds: totalRecordingDelay,
-                        });
-                    });
                 }
                 catch (error) {
                     const recordingSetupDuration = Date.now() - recordingStartTime;
@@ -721,6 +746,8 @@ class Vapi extends VapiEventEmitter {
             await this.call.destroy();
             this.call = null;
         }
+        this.audioPlayer = null;
+        this.pendingAudioBuilds.clear();
         this.speakingTimeout = null;
     }
     /**
@@ -731,6 +758,155 @@ class Vapi extends VapiEventEmitter {
     send(message) {
         this.call?.sendAppMessage(JSON.stringify(message));
     }
+    /**
+     * The two places this class touches the DOM, behind indirections so the
+     * lifecycle logic around them is testable without a browser.
+     */
+    audioPlayerBuild(track, participantId, volume) {
+        return buildAudioPlayer(track, participantId, volume);
+    }
+    audioPlayerDestroy(participantId) {
+        destroyAudioPlayer(participantId);
+    }
+    /**
+     * The remembered volume, bounded, or null if there is nothing to apply.
+     * Shared by both callers so they cannot disagree: the DOM throws on a
+     * non-finite or out-of-range volume, and that throw would stall the call.
+     */
+    desiredVolumeResolve() {
+        if (this.desiredVolume === null || !Number.isFinite(this.desiredVolume)) {
+            return null;
+        }
+        return Math.min(1, Math.max(0, this.desiredVolume));
+    }
+    /** Shared by the initial and reconnect paths so the two cannot drift. */
+    async handleTrackStarted(e) {
+        if (!e || !e.participant) {
+            return;
+        }
+        if (e.participant?.local) {
+            return;
+        }
+        if (e.participant?.user_name !== 'Vapi Speaker') {
+            return;
+        }
+        if (e.track.kind === 'video') {
+            this.emitToConsumer('video', e.track);
+        }
+        if (e.track.kind === 'audio') {
+            // play() pends for the whole of media startup, so the call can end or
+            // the participant can leave while the player is still being built.
+            const call = this.call;
+            const build = ++this.audioBuildSequence;
+            this.pendingAudioBuilds.set(build, e.participant.session_id);
+            let player;
+            try {
+                player = await this.audioPlayerBuild(e.track, e.participant.session_id, this.desiredVolumeResolve());
+            }
+            catch (error) {
+                // Usually autoplay policy, which is recoverable, so consumers get a
+                // signal to prompt for a gesture. Safe with no 'error' listener:
+                // emitToConsumer catches EventEmitter's unlistened-'error' throw.
+                this.pendingAudioBuilds.delete(build);
+                console.error('[vapi] could not start assistant audio', error);
+                this.emitToConsumer('error', {
+                    type: 'audio-start-failed',
+                    error: serializeError(error),
+                });
+                return;
+            }
+            const stillPending = this.pendingAudioBuilds.delete(build);
+            if (!call ||
+                this.call !== call ||
+                !stillPending ||
+                build < this.attachedAudioBuild) {
+                player.remove();
+                return;
+            }
+            this.attachedAudioBuild = build;
+            this.attachAudioPlayer(player);
+        }
+        this.call?.sendAppMessage('playable');
+    }
+    /**
+     * Assigns before emitting, since emit is synchronous and a listener may call
+     * getAudioPlayer or setVolume during the event.
+     */
+    attachAudioPlayer(player) {
+        // Renegotiation reuses the participant id, so a superseded element would
+        // still match the selector teardown uses and be removed in its place.
+        if (this.audioPlayer && this.audioPlayer !== player) {
+            this.audioPlayer.remove();
+        }
+        // Reapplied in case the volume changed while the player was building.
+        const volume = this.desiredVolumeResolve();
+        if (volume !== null) {
+            player.volume = volume;
+        }
+        this.audioPlayer = player;
+        this.emitToConsumer('audio', player);
+    }
+    /**
+     * A listener that throws must not take down the caller: track-started still
+     * has to signal that playback is ready. Not routed to the `error` event,
+     * which EventEmitter throws on when nothing is listening.
+     */
+    emitToConsumer(event, ...args) {
+        try {
+            this.emit(event, ...args);
+        }
+        catch (error) {
+            console.error(`[vapi] ${event} event listener threw`, error);
+        }
+    }
+    /** Drops the reference before removing, so nothing hands out a detached element. */
+    detachAudioPlayer(participantId) {
+        if (this.audioPlayer?.dataset.participantId === participantId) {
+            this.audioPlayer = null;
+        }
+        // Scoped to this participant: the call check cannot catch these, since the
+        // call itself has not changed, and an unrelated leave must not invalidate
+        // the assistant's build.
+        for (const [build, id] of this.pendingAudioBuilds) {
+            if (id === participantId) {
+                this.pendingAudioBuilds.delete(build);
+            }
+        }
+        this.audioPlayerDestroy(participantId);
+    }
+    /**
+     * The <audio> element playing the assistant, or null before its track has
+     * arrived. Pair with the `audio` event when you need it the moment it exists.
+     */
+    getAudioPlayer() {
+        return this.audioPlayer;
+    }
+    /**
+     * Sets assistant playback volume, 0 to 1.
+     *
+     * The setting is remembered, so it can be applied before the assistant's
+     * audio track has arrived and it survives across calls and mid-call track
+     * replacement. Callers do not have to race the start of the call.
+     *
+     * Values outside 0 to 1 are clamped and non-finite values are ignored, since
+     * the DOM rejects both rather than saturating.
+     *
+     * Only volume set through this method is remembered. Writing `volume`
+     * directly on the element from getAudioPlayer() or the `audio` event applies
+     * to that element alone, and is overwritten the next time one is attached.
+     *
+     * This is playback only. It does not change what the assistant hears, and it
+     * does not affect the levels reported by the `volume-level` event.
+     */
+    setVolume(volume) {
+        if (!Number.isFinite(volume)) {
+            return;
+        }
+        this.desiredVolume = Math.min(1, Math.max(0, volume));
+        if (this.audioPlayer) {
+            this.audioPlayer.volume = this.desiredVolume;
+        }
+    }
     setMuted(mute) {
         (0, daily_guards_1.safeSetLocalAudio)(this.call, !mute);
     }
@@ -845,6 +1021,35 @@ class Vapi extends VapiEventEmitter {
     stopScreenSharing() {
         this.call?.stopScreenShare();
     }
+    /**
+     * Starts (or retries) a cloud recording of the call.
+     *
+     * Recording start is asynchronous: success is signaled by the
+     * 'recording-started' event and failure by 'recording-error'. Daily does not
+     * retry automatically, so if you receive 'recording-error' (e.g. the
+     * recording start timed out), you can call this method again a few seconds
+     * later to retry.
+     */
+    startRecording() {
+        if (!this.call) {
+            throw new Error('Call object is not available.');
+        }
+        this.call.startRecording({
+            width: 1280,
+            height: 720,
+            backgroundColor: '#FF1F2D3D',
+            layout: {
+                preset: 'default',
+            },
+        });
+    }
+    /**
+     * Stops the in-progress recording. Completion is signaled by the
+     * 'recording-stopped' event.
+     */
+    stopRecording() {
+        this.call?.stopRecording();
+    }
     /**
      * Reconnects to an active call.
      *
@@ -887,6 +1092,10 @@ class Vapi extends VapiEventEmitter {
             }
             const isVideoRecordingEnabled = webCall?.artifactPlan?.videoRecordingEnabled ?? false;
             const isVideoEnabled = webCall?.assistant?.voice?.provider === 'tavus';
+            // Same auto-start token as in start(). Rejoining with it while the
+            // recording is still running is safe; if the recording stopped when the
+            // user left, the token starts a new one.
+            const callToken = webCall?.transport?.callToken;
             // Stage 1: Create Daily call object
             this.emit('call-start-progress', {
                 stage: 'daily-call-object-creation',
@@ -925,6 +1134,8 @@ class Vapi extends VapiEventEmitter {
                     this.hasEmittedCallEndedStatus = true;
                 }
                 if (isVideoRecordingEnabled) {
+                    // When using a token, the recording doesn't stop automatically on
+                    // leave, so still stop it manually to preserve existing behavior.
                     this.call?.stopRecording();
                 }
                 this.cleanup().catch(console.error);
@@ -972,24 +1183,7 @@ class Vapi extends VapiEventEmitter {
                 if (event)
                     this.emit('recording-upload-completed', event);
             });
-            this.call.on('track-started', async (e) => {
-                if (!e || !e.participant) {
-                    return;
-                }
-                if (e.participant?.local) {
-                    return;
-                }
-                if (e.participant?.user_name !== 'Vapi Speaker') {
-                    return;
-                }
-                if (e.track.kind === 'video') {
-                    this.emit('video', e.track);
-                }
-                if (e.track.kind === 'audio') {
-                    await buildAudioPlayer(e.track, e.participant.session_id);
-                }
-                this.call?.sendAppMessage('playable');
-            });
+            this.call.on('track-started', (e) => this.handleTrackStarted(e));
             this.call.on('participant-joined', (e) => {
                 if (!e || !this.call)
                     return;
@@ -1005,7 +1199,7 @@ class Vapi extends VapiEventEmitter {
                 if (!e) {
                     return;
                 }
-                destroyAudioPlayer(e.participant.session_id);
+                this.detachAudioPlayer(e.participant.session_id);
             });
             this.call.on('remote-participants-audio-level', (e) => {
                 if (e)
@@ -1038,6 +1232,26 @@ class Vapi extends VapiEventEmitter {
                     });
                 }
             });
+            // Registered before join(): a token-auto-started recording can begin
+            // while join() is still in flight, so a listener added after join
+            // could miss the event.
+            let recordingRequestedTime = 0;
+            if (isVideoRecordingEnabled) {
+                this.call.once('recording-started', () => {
+                    const totalRecordingDelay = (new Date().getTime() - recordingRequestedTime) / 1000;
+                    this.emit('call-start-progress', {
+                        stage: 'video-recording-started',
+                        status: 'completed',
+                        timestamp: new Date().toISOString(),
+                        metadata: { delaySeconds: totalRecordingDelay }
+                    });
+                    this.send({
+                        type: 'control',
+                        control: 'say-first-message',
+                        videoRecordingStartDelaySeconds: totalRecordingDelay,
+                    });
+                });
+            }
             // Stage 2: Mobile device handling and permissions
             const isMobile = this.isMobileDevice();
             this.emit('call-start-progress', {
@@ -1073,8 +1287,12 @@ class Vapi extends VapiEventEmitter {
                 timestamp: new Date().toISOString()
             });
             const joinStartTime = Date.now();
+            recordingRequestedTime = joinStartTime;
             await this.call.join({
                 url: webCall.webCallUrl,
+                // daily-js rejects a `token` key that is present but undefined, so
+                // only include it when the server actually sent one.
+                ...(callToken ? { token: callToken } : {}),
                 subscribeToTracksAutomatically: false,
             });
             const joinDuration = Date.now() - joinStartTime;
@@ -1085,23 +1303,26 @@ class Vapi extends VapiEventEmitter {
                 timestamp: new Date().toISOString()
             });
             // Stage 4: Video recording setup (if enabled)
-            if (isVideoRecordingEnabled) {
+            if (isVideoRecordingEnabled && callToken) {
+                // The meeting token auto-started the recording at join, so there is
+                // nothing to request from the client.
+                this.emit('call-start-progress', {
+                    stage: 'video-recording-setup',
+                    status: 'completed',
+                    timestamp: new Date().toISOString(),
+                    metadata: { action: 'auto-started-via-meeting-token' }
+                });
+            }
+            else if (isVideoRecordingEnabled) {
                 this.emit('call-start-progress', {
                     stage: 'video-recording-setup',
                     status: 'started',
                     timestamp: new Date().toISOString()
                 });
                 const recordingStartTime = Date.now();
-                const recordingRequestedTime = new Date().getTime();
                 try {
-                    this.call.startRecording({
-                        width: 1280,
-                        height: 720,
-                        backgroundColor: '#FF1F2D3D',
-                        layout: {
-                            preset: 'default',
-                        },
-                    });
+                    recordingRequestedTime = new Date().getTime();
+                    this.startRecording();
                     const recordingSetupDuration = Date.now() - recordingStartTime;
                     this.emit('call-start-progress', {
                         stage: 'video-recording-setup',
@@ -1109,20 +1330,6 @@ class Vapi extends VapiEventEmitter {
                         duration: recordingSetupDuration,
                         timestamp: new Date().toISOString()
                     });
-                    this.call.on('recording-started', () => {
-                        const totalRecordingDelay = (new Date().getTime() - recordingRequestedTime) / 1000;
-                        this.emit('call-start-progress', {
-                            stage: 'video-recording-started',
-                            status: 'completed',
-                            timestamp: new Date().toISOString(),
-                            metadata: { delaySeconds: totalRecordingDelay }
-                        });
-                        this.send({
-                            type: 'control',
-                            control: 'say-first-message',
-                            videoRecordingStartDelaySeconds: totalRecordingDelay,
-                        });
-                    });
                 }
                 catch (error) {
                     const recordingSetupDuration = Date.now() - recordingStartTime;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vapi-ai/web",
-  "version": "2.6.2",
+  "version": "2.7.0",
   "description": "",
   "main": "dist/vapi.js",
   "types": "dist/vapi.d.ts",