Class useParticipant

useParticipant provides reactive access to a participant’s state, streams, controls, statistics, and related events within a meeting.

Constructors

constructor

new useParticipant(): useParticipant
Returns useParticipant

Properties

displayName

displayName: string

This represents display name of the participant.

isActiveSpeaker

isActiveSpeaker: boolean

This represents whether the participant is the active speaker.

isLocal

isLocal: boolean

This represents whether the participant is the local participant.

isMainParticipant

isMainParticipant: boolean

This represents whether the participant is the main participant.

micOn

micOn: boolean

This represents whether the participant’s microphone is enabled.

micStream

micStream: Stream

This represents the microphone audio Stream of the participant.

mode

mode: "SEND_AND_RECV" | "SIGNALLING_ONLY" | "RECV_ONLY"

This represents the current mode of the participant.

participant

participant: Participant

This represents the underlying Participant instance.

pinState

pinState: any

This represents the current pin state of the participant.

screenShareAudioOn

screenShareAudioOn: boolean

This represents whether the participant’s screen-share audio is enabled.

screenShareAudioStream

screenShareAudioStream: Stream

This represents the screen-share audio Stream of the participant.

screenShareOn

screenShareOn: boolean

This represents whether the participant is currently sharing their screen.

screenShareStream

screenShareStream: Stream

This represents the screen-share video Stream of the participant.

webcamOn

webcamOn: boolean

This represents whether the participant’s webcam is enabled.

webcamStream

webcamStream: Stream

This represents the webcam video Stream of the participant.

Methods

captureImage

captureImage(options: { height?: number; width?: number }): Promise<string>
- This method can be used to capture an image from the participant’s current video stream.
- The captured image is returned as a Base64-encoded string.
Parameters
- options: { height?: number; width?: number }
  - Optionalheight?: number
    Desired height of the captured image.
  - Optionalwidth?: number
    Desired width of the captured image.
Returns Promise<string>
A Base64-encoded string representing the captured image, or null if the image could not be captured.
Example
```
const { captureImage } = useParticipant(participantId);

const image = await captureImage({
  width: 640,
  height: 360,
});
```
- Defined in useParticipant.d.ts:225

disableMic

disableMic(): void
- This method can be used to disable the remote participant’s microphone.
Events associated with disableMic():
- All participants receive a onStreamDisabled event containing the corresponding Stream object.
Returns void
Example
```
const { disableMic } = useParticipant(participantId);

disableMic();
```
- Defined in useParticipant.d.ts:153

disableWebcam

disableWebcam(): void
- This method can be used to disable the remote participant’s webcam.
Events associated with disableWebcam():
- All participants receive a onStreamDisabled event containing the corresponding Stream object.
Returns void
Example
```
const { disableWebcam } = useParticipant(participantId);

disableWebcam();
```
- Defined in useParticipant.d.ts:187

enableMic

enableMic(): void
- This method can be used to enable the remote participant’s microphone.
Events associated with enableMic():
- The participant first receives a onMicRequested event. Once the request is accepted, the microphone is enabled.
- All participants receive a onStreamEnabled even containing the corresponding Stream object.
Returns void
Example
```
const { enableMic } = useParticipant(participantId);

enableMic();
```
- Defined in useParticipant.d.ts:137

enableWebcam

enableWebcam(): void
- This method can be used to enable the remote participant’s webcam.
Events associated with enableWebcam():
- The participant first receives a onWebcamRequestedevent. Once the request is accepted, the webcam is enabled.
- All participants receive a onStreamEnabled event containing the corresponding Stream object.
Returns void
Example
```
const { enableWebcam } = useParticipant(participantId);

enableWebcam();
```
- Defined in useParticipant.d.ts:171

getAudioStats

getAudioStats(): Promise<
    {
        bitrate: number;
        codec: string;
        jitter: number;
        network: string;
        packetsLost: number;
        rtt: number;
        totalPackets: number;
    }[],
>
- This method can be used to get detailed statistics about the participant’s audio stream.
- These metrics provide insights into stream quality, network conditions, and transmission performance at the time the method is called.
Returns Promise<
    {
        bitrate: number;
        codec: string;
        jitter: number;
        network: string;
        packetsLost: number;
        rtt: number;
        totalPackets: number;
    }[],
>
An array of objects containing the following metrics:
- jitter – Represents variation in packet arrival time (stream instability).
- bitrate – The bitrate at which the audio stream is being transmitted.
- totalPackets – Total number of packets transmitted for the stream.
- packetsLost – Total number of packets lost during transmission.
- rtt – Round-trip time (in milliseconds) between the client and server.
- codec – Codec used for encoding the audio stream.
- network – Network type used for transmitting the stream.
Info

If the rtt value exceeds 300ms, consider switching to a region closer to the user for improved performance. Learn more visit here.
Example
```
const { getAudioStats } = useParticipant(participantId);

const audioStats = await getAudioStats();
```
- Defined in useParticipant.d.ts:345

getShareAudioStats

getShareAudioStats(): Promise<
    {
        bitrate: number;
        codec: string;
        jitter: number;
        network: string;
        packetsLost: number;
        rtt: number;
        totalPackets: number;
    }[],
>
- This method can be used to get detailed statistics about the participant’s screen share audio stream.
- These metrics provide insights into stream quality, network conditions, and transmission performance at the time the method is called.
Returns Promise<
    {
        bitrate: number;
        codec: string;
        jitter: number;
        network: string;
        packetsLost: number;
        rtt: number;
        totalPackets: number;
    }[],
>
An array of objects containing the following metrics:
- jitter – Represents variation in packet arrival time (stream instability).
- bitrate – The bitrate at which the audio stream is being transmitted.
- totalPackets – Total number of packets transmitted for the stream.
- packetsLost – Total number of packets lost during transmission.
- rtt – Round-trip time (in milliseconds) between the client and server.
- codec – Codec used for encoding the audio stream.
- network – Network type used for transmitting the stream.
Info

If the rtt value exceeds 300ms, consider switching to a region closer to the user for improved performance. Learn more visit here.
Example
```
const { getShareAudioStats } = useParticipant(participantId);

const shareAudioStats = await getShareAudioStats();
```
- Defined in useParticipant.d.ts:307

getShareStats

getShareStats(): Promise<
    {
        bitrate: number;
        codec: string;
        currentSpatialLayer: number;
        currentTemporalLayer: number;
        jitter: number;
        limitation: any;
        network: string;
        packetsLost: number;
        preferredSpatialLayer: number;
        preferredTemporalLayer: number;
        rtt: number;
        size: any;
        totalPackets: number;
    }[],
>
- This method can be used to get detailed statistics about the participant’s screen share video stream.
- These metrics provide insights into stream quality, network conditions, and transmission performance at the time the method is called.
Returns Promise<
    {
        bitrate: number;
        codec: string;
        currentSpatialLayer: number;
        currentTemporalLayer: number;
        jitter: number;
        limitation: any;
        network: string;
        packetsLost: number;
        preferredSpatialLayer: number;
        preferredTemporalLayer: number;
        rtt: number;
        size: any;
        totalPackets: number;
    }[],
>
An array of objects containing the following metrics:
- jitter – Represents variation in packet arrival time (stream instability).
- bitrate – The bitrate at which the video stream is being transmitted.
- totalPackets – Total number of packets transmitted for the stream.
- packetsLost – Total number of packets lost during transmission.
- rtt – Round-trip time (in milliseconds) between the client and server.
- codec – Codec used for encoding the video stream.
- network – Network type used for transmitting the stream.
- limitation – Indicates any limitations affecting stream quality.
- size – Resolution or size information related to the stream.
Info

If the rtt value exceeds 300ms, consider switching to a region closer to the user for improved performance. Learn more visit here.
Example
```
const { getShareStats } = useParticipant(participantId);

const shareStats = await getShareStats();
```
- Defined in useParticipant.d.ts:431

getVideoStats

getVideoStats(): Promise<
    {
        bitrate: number;
        codec: string;
        currentSpatialLayer: number;
        currentTemporalLayer: number;
        jitter: number;
        limitation: any;
        network: string;
        packetsLost: number;
        preferredSpatialLayer: number;
        preferredTemporalLayer: number;
        rtt: number;
        size: any;
        totalPackets: number;
    }[],
>
- This method can be used to get detailed statistics about the participant’s video stream.
- These metrics provide insights into stream quality, network conditions, and transmission performance at the time the method is called.
Returns Promise<
    {
        bitrate: number;
        codec: string;
        currentSpatialLayer: number;
        currentTemporalLayer: number;
        jitter: number;
        limitation: any;
        network: string;
        packetsLost: number;
        preferredSpatialLayer: number;
        preferredTemporalLayer: number;
        rtt: number;
        size: any;
        totalPackets: number;
    }[],
>
An array of objects containing the following metrics:
- jitter – Represents variation in packet arrival time (stream instability).
- bitrate – The bitrate at which the video stream is being transmitted.
- totalPackets – Total number of packets transmitted for the stream.
- packetsLost – Total number of packets lost during transmission.
- rtt – Round-trip time (in milliseconds) between the client and server.
- codec – Codec used for encoding the video stream.
- network – Network type used for transmitting the stream.
- limitation – Indicates any limitations affecting stream quality.
- size – Resolution or size information related to the stream.
Info

If the rtt value exceeds 300ms, consider switching to a region closer to the user for improved performance. Learn more visit here.
Example
```
const { getVideoStats } = useParticipant(participantId);

const videoStats = await getVideoStats();
```
- Defined in useParticipant.d.ts:385

pin(type: "SHARE_AND_CAM" | "CAM" | "SHARE"): void
- This method can be used to pin the participant’s camera, screen share, or both.
- Every participant receives a onPinStateChanged event when the pin state is updated.
Parameters
- type: "SHARE_AND_CAM" | "CAM" | "SHARE"
  Specifies which stream to pin.
  
  Allowed values:
  
  "SHARE_AND_CAM" – Pins both screen share and camera streams.
  
  "CAM" – Pins only the camera stream.
  
  "SHARE" – Pins only the screen-share stream.
  Default
  SHARE_AND_CAM
Returns void
Example
```
const { pin } = useParticipant(participantId);

pin("CAM");
```
- Defined in useParticipant.d.ts:242

remove

remove(): void
- This method can be used to removes the remote participant from the meeting.
Returns void
Example
```
const { remove } = useParticipant(participantId);

remove();
```
- Defined in useParticipant.d.ts:199

setQuality

setQuality(quality: "low" | "med" | "high"): void
- This method can be used to set the incoming video quality of the remote participant.
Parameters
- quality: "low" | "med" | "high"
Returns void
Example
```
const { setQuality } = useParticipant(participantId);

setQuality("low");
```
- Defined in useParticipant.d.ts:90

setScreenShareQuality

setScreenShareQuality(quality: "low" | "med" | "high"): void
- This method can be used to set the quality of the incoming screen-share video of the remote participant.
Parameters
- quality: "low" | "med" | "high"
Returns void
Example
```
const { setScreenShareQuality } = useParticipant(participantId);

setScreenShareQuality("low");
```
- Defined in useParticipant.d.ts:102

setViewPort

setViewPort(width: number, height: number): void
- This method can be used to adjust the video quality of the remote participant based on the specified viewport dimensions.
Parameters
- width: number
  The width of the viewport used to determine the video quality.
- height: number
  The height of the viewport used to determine the video quality.
Returns void
Example
```
const { setViewPort } = useParticipant(participantId);

setViewPort(480, 360);
```
- Defined in useParticipant.d.ts:120

unpin

unpin(type: "SHARE_AND_CAM" | "CAM" | "SHARE"): void
- This method can be used to unpin the participant’s camera, screen share, or both.
- Every participant receives a onPinStateChanged event when the pin state is updated.
Parameters
- type: "SHARE_AND_CAM" | "CAM" | "SHARE"
  Specifies which stream to unpin.
  
  Allowed values:
  
  "SHARE_AND_CAM" – Unpins both screen share and camera streams.
  
  "CAM" – Unpins only the camera stream.
  
  "SHARE" – Unpins only the screen-share stream.
  Default
  "SHARE_AND_CAM"
Returns void
Example
```
const { unpin } = useParticipant(participantId);

unpin("CAM");
```
- Defined in useParticipant.d.ts:267

Events

onMediaStatusChanged

onMediaStatusChanged(
    data: {
        kind: "audio" | "video" | "share" | "shareAudio";
        newStatus: boolean;
    },
): void
Triggered when the media status of a participant changes (for example, when audio or video is enabled or disabled).
Parameters
- data: { kind: "audio" | "video" | "share" | "shareAudio"; newStatus: boolean }
  - kind: "audio" | "video" | "share" | "shareAudio"
    Type of stream whose status changed.
  - newStatus: boolean
    The updated status of the stream.
Returns void
Example
```
function onMediaStatusChanged(data) {
  const { kind, newStatus} = data;
}

const {
  displayName
  ...
} = useParticipant(participantId,{
  onMediaStatusChanged,
  ...
});
```
- Defined in useParticipant.d.ts:600

onStreamDisabled

onStreamDisabled(stream: Stream): void
Triggered when a participant’s audio, video, or screen-share stream is disabled.
Parameters
- stream: Stream
  The Stream that was disabled.
Returns void
Example
```
function onStreamDisabled(stream) {
  console.log("onStreamDisabled", stream);
}

const {
  displayName
  ...
} = useParticipant(participantId,{
  onStreamDisabled,
  ...
});
```
- Defined in useParticipant.d.ts:471

onStreamEnabled

onStreamEnabled(stream: Stream): void
Triggered when a participant’s audio, video, or screen-share stream is enabled.
Parameters
- stream: Stream
  The Stream that was enabled.
Returns void
Example
```
function onStreamEnabled(stream) {
  console.log("onStreamEnabled", stream);
}

const {
  displayName
  ...
} = useParticipant(participantId,{
  onStreamEnabled,
  ...
});
```
- Defined in useParticipant.d.ts:495

onStreamPaused

onStreamPaused(data: { kind: "video"; reason: string }): void
- Triggered when a participant’s video, audio, or screen-share stream is paused.
- This event is triggered only when the Subscription Manager is enabled by calling the enableAdaptiveSubscription() method.
Parameters
- data: { kind: "video"; reason: string }
  - kind: "video"
    Type of stream that was paused.
  - reason: string
    Reason why the stream was paused.
    
    Possible values:
    
    "muted" – Stream was paused because it was muted.
    
    "leastDominance" – Stream was paused due to bandwidth or dominance rules.
Returns void
Example
```
function onStreamPaused({ kind, reason }) {
  console.log(kind, reason);
}

const {
  displayName
  ...
} = useParticipant(participantId,{
  onStreamPaused,
  ...
});
```
- Defined in useParticipant.d.ts:533

onStreamResumed

onStreamResumed(data: { kind: "video"; reason: string }): void
- Triggered when a participant’s video, audio, or screen-share stream is resumed.
- This event is triggered only when the Subscription Manager is enabled by calling the enableAdaptiveSubscription() method.
Parameters
- data: { kind: "video"; reason: string }
  - kind: "video"
    Type of stream that was resumed.
  - reason: string
    Reason why the stream was resumed.
    
    Possible values:
    
    "adaptiveSubscriptionsDisabled" – Stream resumed after adaptive subscriptions were disabled.
    
    "networkStable" – Stream resumed due to stable network conditions.
Returns void
Example
```
function onStreamResumed({ kind, reason }) {
  console.log(kind, reason);
}

const {
  displayName
  ...
} = useParticipant(participantId,{
  onStreamResumed,
  ...
});
```
- Defined in useParticipant.d.ts:569

onVideoQualityChanged

onVideoQualityChanged(
    data: {
        currentQuality: "low" | "med" | "high";
        prevQuality: "low" | "med" | "high";
    },
): void
- Triggered when the video quality of a participant changes.
- The currentQuality and prevQuality values can be HIGH, MEDIUM, or LOW.
Parameters
- data: { currentQuality: "low" | "med" | "high"; prevQuality: "low" | "med" | "high" }
  - currentQuality: "low" | "med" | "high"
    The updated video quality level.
  - prevQuality: "low" | "med" | "high"
    The previous video quality level.
Returns void
Example
```
function onVideoQualityChanged(data) {
  const { currentQuality, prevQuality } = data;
}

const {
  displayName
  ...
} = useParticipant(participantId,{
  onVideoQualityChanged,
  ...
});
```
- Defined in useParticipant.d.ts:636

Class useParticipant

Index

Constructors

Properties

Methods

Events

Constructors

constructor

Returns useParticipant

Properties

displayName

isActiveSpeaker

isLocal

isMainParticipant

micOn

micStream

mode

participant

pinState

screenShareAudioOn

screenShareAudioStream

screenShareOn

screenShareStream

webcamOn

webcamStream

Methods

captureImage

Parameters

Optionalheight?: number

Optionalwidth?: number

Returns Promise<string>

Example

disableMic

Returns void

Example

disableWebcam

Returns void

Example

enableMic

Returns void

Example

enableWebcam

Returns void

Example

getAudioStats

Returns Promise< { bitrate: number; codec: string; jitter: number; network: string; packetsLost: number; rtt: number; totalPackets: number; }[],>

Example

getShareAudioStats

Returns Promise< { bitrate: number; codec: string; jitter: number; network: string; packetsLost: number; rtt: number; totalPackets: number; }[],>

Example

getShareStats

Returns Promise< { bitrate: number; codec: string; currentSpatialLayer: number; currentTemporalLayer: number; jitter: number; limitation: any; network: string; packetsLost: number; preferredSpatialLayer: number; preferredTemporalLayer: number; rtt: number; size: any; totalPackets: number; }[],>

Example

getVideoStats

Returns Promise< { bitrate: number; codec: string; currentSpatialLayer: number; currentTemporalLayer: number; jitter: number; limitation: any; network: string; packetsLost: number; preferredSpatialLayer: number; preferredTemporalLayer: number; rtt: number; size: any; totalPackets: number; }[],>

Example

pin

Parameters

Default

Returns void

Example

remove

Returns void

Example

setQuality

Parameters

Returns void

Example

setScreenShareQuality

Parameters

Returns void

Example

setViewPort

Parameters

Returns void

Example

unpin

Parameters

Default

Returns void

`Optional`height?: number

`Optional`width?: number

Returns Promise<
{
bitrate: number;
codec: string;
jitter: number;
network: string;
packetsLost: number;
rtt: number;
totalPackets: number;
}[],
>

Returns Promise<
{
bitrate: number;
codec: string;
jitter: number;
network: string;
packetsLost: number;
rtt: number;
totalPackets: number;
}[],
>

Returns Promise<
{
bitrate: number;
codec: string;
currentSpatialLayer: number;
currentTemporalLayer: number;
jitter: number;
limitation: any;
network: string;
packetsLost: number;
preferredSpatialLayer: number;
preferredTemporalLayer: number;
rtt: number;
size: any;
totalPackets: number;
}[],
>

Returns Promise<
{
bitrate: number;
codec: string;
currentSpatialLayer: number;
currentTemporalLayer: number;
jitter: number;
limitation: any;
network: string;
packetsLost: number;
preferredSpatialLayer: number;
preferredTemporalLayer: number;
rtt: number;
size: any;
totalPackets: number;
}[],
>