Skip to main content

dyte-name-tag

A component which shows a participant's name.

<dyte-name-tag class="dyte-el"></dyte-meeting-title>
<dyte-name-tag class="dyte-el"></dyte-meeting-title>

<script>
  const elements = document.getElementsByClassName('dyte-el');
  for (const el of elements) {
    el.participant = meeting.self;
    el.meeting = meeting;
  }
</script>

Props​

participant

required

Participant object

iconPack

Icon pack

Default
defaultIconPack

isScreenShare

Whether it is used in a screen share view

Default
false
Type
boolean

maxLength

Maximum length of the name

Default
20
Type
number

meeting

Meeting object

size

Size

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

t

Language

Default
useLanguage()

variant

Name tag variant

Default
'default'
Type
"default" | "text"