Components
Tooltip
Show information when hovering over an element.
Usage
Click me!
<template>
<NXW-Tooltip>
<NXW-Button>Button</NXW-Button>
<template #tooltip> Click me! </template>
</NXW-Tooltip>
</template>
Props
bottom
boolean
Default
false
color
object
Default
{
"text": "dark:text-white text-black",
"bg": "bg-primary-800",
"bgPointer": "text-primary-800"
}
interactive
boolean
Default
false
left
boolean
Default
false
right
boolean
Default
false
rounded
boolean
|
string
Default
rounded-lg
text
string
Default
text-xs text-center
top
boolean
Default
true
transition
boolean
|
object
Default
{
"duration": "duration-300",
"ease": "ease-in-out"
}
width
string
Default
w-max
z-index
string
Default
z-10
Slots
default
Default content for the elment that will trigger the tooltip.
tooltip
Content for the tooltip itself.
Click me!
<template>
<NXW-Tooltip>
<NXW-Button>Button</NXW-Button>
<template #tooltip> Click me! </template>
</NXW-Tooltip>
</template>