Skip to main content

dyte-meeting

A single component which renders an entire meeting UI.

It loads your preset and renders the UI based on it. With this component, you don't have to handle all the states, dialogs and other smaller bits of managing the application.

<dyte-meeting mode="fill" style="height: 480px; width: 100%"></dyte-meeting>

<script>
  const el = document.getElementById('dyte-el');
  el.meeting = meeting;
</script>

Props​

meeting

required

Meeting object

applyDesignSystem

Whether to apply the design system on the document root from config

Default
true
Type
boolean

config

UI Config

Default
defaultConfig

gridLayout

Grid layout

Default
'row'
Type
"column" | "row"

iconPackUrl

Icon Pack URL

Type
string

leaveOnUnmount

Whether participant should leave when this component gets unmounted

Default
false
Type
boolean

loadConfigFromPreset

Whether to load config from preset

Default
true
Type
boolean

mode

Fill type

Default
'fixed'
Type
"fill" | "fixed"

showSetupScreen

Whether to show setup screen or not

Type
boolean

size

Size

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

t

Language

Default
useLanguage()