Skip to main content

dyte-controlbar-button

A skeleton component used for composing buttons.

<dyte-controlbar-button
  label="Flight Mode"
  icon="✈️"
  onclick="alert('flight mode toggled')"
  size="sm"
  class="dyte-el"
></dyte-controlbar-button>
<dyte-controlbar-button
  label="Flight Mode"
  icon="✈️"
  onclick="alert('flight mode toggled')"
  size="lg"
  class="dyte-el"
></dyte-controlbar-button>
<dyte-controlbar-button
  label="Flight Mode"
  icon="✈️"
  onclick="alert('flight mode toggled')"
  variant="horizontal"
  class="dyte-el"
></dyte-controlbar-button>

Props​

brandIcon

Whether icon requires brand color

Default
false
Type
boolean

disabled

Whether button is disabled

Default
false
Type
boolean

icon

Icon

Type
string

iconPack

Icon pack

Default
defaultIconPack

isLoading

Loading state Ignores current icon and shows a spinner if true

Type
boolean

label

Label of button

Type
string

showWarning

Whether to show warning icon

Default
false
Type
boolean

size

Size

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

t

Language

Default
useLanguage()

variant

Variant

Default
'button'
Type
"button" | "horizontal"