Tooltip
Basic
// Package tooltip holds the site's example gsx components for ui/tooltip.
package tooltip
import (
"github.com/gsxhq/gsxui/ui"
)
// Basic shows a tooltip on hover/focus of a Button trigger.
component Basic() {
<ui.Tooltip>
<ui.Button variant="outline" data-gsxui-tooltip-trigger>Hover me</ui.Button>
<ui.TooltipContent>Add to library</ui.TooltipContent>
</ui.Tooltip>
}
Custom width
package tooltip
import (
"github.com/gsxhq/gsxui/ui"
)
// Wide overrides TooltipContent's default w-fit with a caller class,
// proving tailwind-merge wins over the base utility.
component Wide() {
<ui.Tooltip>
<ui.Button variant="outline" data-gsxui-tooltip-trigger>Info</ui.Button>
<ui.TooltipContent class="w-64 text-center">
Deploys automatically when you push to the main branch.
</ui.TooltipContent>
</ui.Tooltip>
}