Skip to main content

DyteAvatar

Avatar component which renders a participant's image or their initials.

Props​

iconPack

Icon pack

Default
defaultIconPack

participant

Participant object

Type
({ readonly id: string; readonly name: string; readonly picture: string; readonly clientSpecificId: any; readonly waitlistStatus: "accepted" | "waiting" | "rejected" | "none"; readonly preview: Pick<LocalMediaHandler, "audioTrack" | "videoTrack" | "audioEnabled" | "videoEnabled">; readonly role: any; readonly userId: string; readonly organizationId: string; readonly supportsRemoteControl: boolean; readonly device: DeviceConfig; readonly webinarStageStatus: WebinarStageStatus; readonly audioTrack: MediaStreamTrack; readonly rawAudioTrack: MediaStreamTrack; readonly addAudioMiddleware: (audioMiddleware: AudioMiddleware) => Promise<{ success: boolean; message: string; }>; readonly removeAudioMiddleware: (audioMiddleware: AudioMiddleware) => Promise<{ success: boolean; message: string; }>; readonly videoTrack: MediaStreamTrack; readonly rawVideoTrack: MediaStreamTrack; readonly addVideoMiddleware: (videoMiddleware: VideoMiddleware) => Promise<{ success: boolean; message: string; }>; readonly removeVideoMiddleware: (videoMiddleware: VideoMiddleware) => Promise<{ success: boolean; message: string; }>; readonly screenShareTracks: { audio?: MediaStreamTrack; video?: MediaStreamTrack; }; readonly audioEnabled: boolean; readonly videoEnabled: boolean; readonly screenShareEnabled: boolean; readonly mediaPermissions: { audio?: "NOT_REQUESTED" | "ACCEPTED" | "DENIED" | "SYSTEM_DENIED" | "COULD_NOT_START"; video?: "NOT_REQUESTED" | "ACCEPTED" | "DENIED" | "SYSTEM_DENIED" | "COULD_NOT_START"; screenshare?: "NOT_REQUESTED" | "ACCEPTED" | "DENIED" | "SYSTEM_DENIED" | "COULD_NOT_START"; }; readonly permissions: DytePermissionsPreset | DytePermissionsPresetV1; readonly suggestedTheme: DyteThemePreset | DyteThemePresetV1; readonly roomJoined: boolean; readonly setName: (name: string) => void; readonly setupTracks: (options?: { video?: boolean; audio?: boolean; }) => Promise<void>; readonly enableAudio: () => Promise<void>; readonly enableVideo: () => Promise<void>; readonly enableScreenShare: () => Promise<void>; readonly disableAudio: () => Promise<void>; readonly disableVideo: () => Promise<void>; readonly disableScreenShare: () => Promise<void>; readonly enablePreview: (options?: { audio?: boolean; video?: boolean; }) => Promise<void>; readonly disablePreview: (options?: { audio?: boolean; video?: boolean; }) => Promise<void>; readonly getCurrentDevices: () => { audio: MediaDeviceInfo; video: MediaDeviceInfo; speaker: MediaDeviceInfo; }; readonly getAudioDevices: () => MediaDeviceInfo[]; readonly getVideoDevices: () => MediaDeviceInfo[]; readonly getSpeakerDevices: () => MediaDeviceInfo[]; readonly getDeviceById: (deviceId: string, kind: "audio" | "video" | "speaker") => MediaDeviceInfo; readonly getAllDevices: () => MediaDeviceInfo[]; readonly setIsPinned: (isPinned: boolean, emitEvent?: boolean) => void; readonly isPinned: boolean; readonly pin: () => Promise<WebsocketMessage>; readonly unpin: () => Promise<WebsocketMessage>; readonly setDevice: (device: MediaDeviceInfo, preview?: boolean) => Promise<void>; readonly requestToJoinStage: () => Promise<void>; readonly leaveStage: () => Promise<void>; readonly joinStage: () => Promise<void>; readonly setWebinarStageStatus: (webinarStageStatus: WebinarStageStatus) => void; readonly emit: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", ...args: any[]) => boolean; readonly on: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => void) => DyteSelf; readonly addListener: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteSelf; readonly off: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteSelf; readonly once: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteSelf; readonly prependListener: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteSelf; readonly prependOnceListener: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteSelf; readonly removeListener: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteSelf; readonly removeAllListeners: (event?: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage") => DyteSelf; readonly listeners: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage") => Function[]; readonly listenerCount: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage") => number; readonly setMaxListeners: (n: number) => DyteSelf; readonly getMaxListeners: () => number; readonly rawListeners: (eventName: string | symbol) => Function[]; readonly eventNames: () => (string | symbol)[]; }) | ({ readonly id: string; readonly name: string; readonly picture: string; readonly clientSpecificId?: string; readonly userId: string; readonly supportsRemoteControl: boolean; readonly device: DeviceConfig; readonly webinarStageStatus: WebinarStageStatus; readonly audioEnabled: boolean; readonly videoEnabled: boolean; readonly screenShareEnabled: boolean; readonly disableAudio: () => Promise<void>; readonly disableVideo: () => Promise<void>; readonly setIsPinned: (isPinned: boolean, emitEvent?: boolean) => void; readonly isPinned: boolean; readonly pin: () => Promise<WebsocketMessage>; readonly unpin: () => Promise<WebsocketMessage>; readonly setWebinarStageStatus: (webinarStageStatus: WebinarStageStatus) => void; readonly emit: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", ...args: any[]) => boolean; readonly on: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => void) => DyteParticipant; readonly addListener: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteParticipant; readonly off: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteParticipant; readonly once: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteParticipant; readonly prependListener: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteParticipant; readonly prependOnceListener: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteParticipant; readonly removeListener: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteParticipant; readonly removeAllListeners: (event?: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage") => DyteParticipant; readonly listeners: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage") => Function[]; readonly listenerCount: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage") => number; readonly setMaxListeners: (n: number) => DyteParticipant; readonly getMaxListeners: () => number; readonly rawListeners: (eventName: string | symbol) => Function[]; readonly eventNames: () => (string | symbol)[]; readonly isHost: boolean; readonly flags: { [key: string]: string | boolean; }; readonly setVideoEnabled: (videoEnabled: boolean, emitEvent?: boolean) => void; readonly setAudioEnabled: (audioEnabled: boolean, emitEvent?: boolean) => void; readonly setScreenShareEnabled: (screenShareEnabled: boolean, emitEvent?: boolean) => void; readonly kick: () => Promise<void>; readonly acceptJoinStageRequest: () => Promise<void>; readonly rejectRequestToJoinStage: () => Promise<void>; readonly removeFromStage: () => Promise<void>; }) | ({ readonly id: string; readonly userId: string; readonly name: string; readonly picture: string; readonly isHost: boolean; readonly clientSpecificId?: string; readonly flags: { [key: string]: string | boolean; }; readonly device: DeviceConfig; readonly videoTrack: MediaStreamTrack; readonly audioTrack: MediaStreamTrack; readonly screenShareTracks: { audio: MediaStreamTrack; video: MediaStreamTrack; }; readonly videoEnabled: boolean; readonly audioEnabled: boolean; readonly screenShareEnabled: boolean; readonly supportsRemoteControl: boolean; readonly webinarStageStatus: WebinarStageStatus; readonly setVideoEnabled: (videoEnabled: boolean, emitEvent?: boolean) => void; readonly setAudioEnabled: (audioEnabled: boolean, emitEvent?: boolean) => void; readonly setScreenShareEnabled: (screenShareEnabled: boolean, emitEvent?: boolean) => void; readonly pin: () => Promise<WebsocketMessage>; readonly unpin: () => Promise<WebsocketMessage>; readonly setIsPinned: (isPinned: boolean, emitEvent?: boolean) => void; readonly disableAudio: () => Promise<void>; readonly kick: () => Promise<void>; readonly disableVideo: () => Promise<void>; readonly acceptJoinStageRequest: () => Promise<void>; readonly rejectRequestToJoinStage: () => Promise<void>; readonly removeFromStage: () => Promise<void>; readonly setWebinarStageStatus: (webinarStageStatus: WebinarStageStatus) => void; readonly isPinned: boolean; readonly emit: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", ...args: any[]) => boolean; readonly on: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => void) => DyteParticipant; readonly addListener: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteParticipant; readonly off: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteParticipant; readonly once: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteParticipant; readonly prependListener: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteParticipant; readonly prependOnceListener: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteParticipant; readonly removeListener: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage", callback: (...args: any[]) => any) => DyteParticipant; readonly removeAllListeners: (event?: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage") => DyteParticipant; readonly listeners: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage") => Function[]; readonly listenerCount: (event: "roomJoined" | "*" | "added" | "deleted" | "cleared" | "connected" | "disconnected" | "poorConnection" | "waitlisted" | "roomLeft" | "audioUpdate" | "videoUpdate" | "screenShareUpdate" | "previewUpdate" | "deviceUpdate" | "chatUpdate" | "pinMessage" | "unpinMessage" | "pollsUpdate" | "participantJoined" | "participantLeft" | "participantsCleared" | "participantsUpdate" | "viewModeChanged" | "pageChanged" | "activeSpeaker" | "pluginAdded" | "pluginDeleted" | "stateUpdate" | "pinned" | "unpinned" | "recordingUpdate" | "remoteRequestAdd" | "remoteRequestRemove" | "remoteUpdate" | "closed" | "ready" | "mediaPermissionError" | "broadcastedMessage" | "activeTabUpdate" | "peerRequestToJoinStage" | "peerRejectedToJoinStage" | "peerAcceptedToJoinStage" | "peerStoppedPresenting" | "peerStartedPresenting" | "joinStageRequestAccepted" | "joinStageRequestRejected" | "stageJoined" | "stageLeft" | "removedFromStage") => number; readonly setMaxListeners: (n: number) => DyteParticipant; readonly getMaxListeners: () => number; readonly rawListeners: (eventName: string | symbol) => Function[]; readonly eventNames: () => (string | symbol)[]; })

size

Size

Type
"lg" | "md" | "sm" | "xl"

variant

Avatar type

Default
'circular'
Type
"circular" | "hexagon" | "square"