Skip to main content

Video Conference AppKit

AppKit allows you to include Video Conferences with prebuilt UI into your applications, in the form of Web Components.

Installation

npm install @signalwire/app-kit

<sw-video-conference>

This component represents a Video Conference.

Properties

PropertyAttributeTypeDescription
audioaudioMediaTrackConstraints | booleanAudio constraints to use for the devices. Set to false if you do not want to use audio devices. Default: true
chatchatbooleanSet to false to disable the chat. Default: true
devicePickerdevice-pickerbooleanSet to false to allow only default devices to be used. If false, this will disable pre-join steps for device selection and remove the ability for the user to change devices after joining the room. Default: true
memberListmember-listbooleanSet to false to disable the member list. Default: true
setupRoomSession--(roomSession: RoomSession) => voidA callback which will be invoked as soon as a RoomSession object is ready. The RoomSession.join method will be called automatically after executing this callback. Default: undefined
themetheme"auto" \| "dark" \| "light"Set a specific color scheme. Auto will use the operating system's dark-mode setting. Default: "auto"
tokentokenstringThe Video Conference token to access the room. Starts with vpt_. Default: undefined
userNameuser-namestringA custom user name for the user joining the room. Default: ""
videovideoMediaTrackConstraints | booleanVideo constraints to use for the devices. Set to false if you do not want to use video devices. Default: true
layoutslayoutsbooleanSet to false to disable the layout selection. Default: true
Using setupRoomSession

Please note that the setupRoomSession callback function must be initialized before the component is rendered to the DOM. For a use case example, see it implemented with the Video Conference AppKit in React.

Example

<sw-video-conference
token="vpt_ef2d...e1c"
user-name="guest"
chat
member-list
device-picker="false"
/>