Skip to main content

dyte-tooltip

Tooltip component which follows Dyte's Design System.

<dyte-tooltip label="Primary tooltip variant" variant="primary">
  <div>Hover over me</div>
</dyte-tooltip>

<dyte-tooltip label="Secondary tooltip variant" variant="secondary">
  <div>Hover over me</div>
</dyte-tooltip>

Props​

delay

Delay before showing the tooltip

Default
0
Type
number

disabled

Disabled

Default
false
Type
boolean

iconPack

Icon pack

Default
defaultIconPack

kind

Tooltip kind

Default
'inline'
Type
"block" | "inline"

label

Tooltip label

Default
''
Type
string

open

Open

Default
false
Type
boolean

placement

Placement of menu

Default
'top'
Type
"bottom" | "bottom-end" | "bottom-start" | "left" | "left-end" | "left-start" | "right" | "right-end" | "right-start" | "top" | "top-end" | "top-start"

size

Size

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

t

Language

Default
useLanguage()

variant

Tooltip variant

Default
'secondary'
Type
"primary" | "secondary"