Primitive / Atomstable

Tooltip

Context hint on hover/focus using Radix tooltip primitive.

@glinui/uiComponent: tooltip

Installation

Install from the package for shared ownership or from the registry for copy-paste control.

Package Manager

pnpm add @glinui/ui @glinui/tokens

Registry

pnpm dlx @glinui/cli@latest add tooltip

Usage

TSX

1import { TooltipProvider, Tooltip, TooltipTrigger, TooltipContent, Button } from "@glinui/ui"
2
3export function Demo() {
4  return (
5    <TooltipProvider delayDuration={100}>
6      <Tooltip>
7        <TooltipTrigger asChild><Button variant="outline">Hover me</Button></TooltipTrigger>
8        <TooltipContent>Contextual help text.</TooltipContent>
9      </Tooltip>
10    </TooltipProvider>
11  )
12}

Accessibility

Built on Radix Tooltip with `role="tooltip"`.
Shows on hover and focus.
TooltipProvider wraps the usage context.

Keyboard Interactions

Key	Action
`Escape`	Dismiss the tooltip when focused.

ARIA Attributes

`role="tooltip"`
`aria-describedby` linking trigger to tooltip content

Reduced Motion

Show/hide transitions respect `prefers-reduced-motion`.

Affected properties

opacitytransform

API Reference

Prop	Type	Required	Default	Description
`sideOffset`	`number`	-	`6`	Distance from trigger in pixels.
`delayDuration`	`number`	No	`700`	Delay before showing (ms).
`side`	`"top" \| "right" \| "bottom" \| "left"`	-	`-`	Preferred tooltip position.
`defaultOpen`	`boolean`	No	`-`	Initial open state for uncontrolled usage.
`onOpenChange`	`(open: boolean) => void`	No	`-`	Callback when open state changes.
`open`	`boolean`	No	`-`	Controlled open state.

Source

Import directly from the package or browse the source on GitHub. Click any file to view it.

Import

import { Tooltip } from "@glinui/ui"

Source Files

tooltip.tsx

Dependencies

@glinui/ui

Generated API Snapshot

Beta

Auto-extracted from TypeScript source in packages/ui/src/components/tooltip.tsx. This section is in beta and may lag behind hand-curated docs. Regenerate with pnpm --filter @glinui/docs api:generate.

Generated: 2026-02-19T17:59:28.468Z · Full index: /docs/api-metadata

Primary Props Type

TooltipProps

`TooltipContentProps`

Prop	Type	Required	Default	Description
`side`	`"top" \| "right" \| "bottom" \| "left"`	No	`-`	Preferred side for tooltip content.
`sideOffset`	`number`	No	`6`	Gap in px between trigger and content.
`variant`	`"default" \| "glass" \| "frosted"`	No	`"default"`	Variant option from tooltipContentVariants.

`TooltipProps`

Prop	Type	Required	Default	Description
`defaultOpen`	`boolean`	No	`-`	Initial open state for uncontrolled usage.
`delayDuration`	`number`	No	`-`	Delay in ms before showing tooltip content.
`onOpenChange`	`(open: boolean) => void`	No	`-`	Callback when open state changes.
`open`	`boolean`	No	`-`	Controlled open state.