jsp-dsv0.1

Tooltipshadcn

Names an icon button on hover and focus.

Feedback
Install
npx shadcn add tooltip
Import from
@/components/ui/tooltip
Guidance
draft · v0.1.0

Examples

As installed from shadcn – rendering in jsp-ds tokens through the bridge.

Name an icon button on hover and focus. Never put the only copy of anything in a tooltip.

Guidance

When to use

  • To name an icon button, on hover and on keyboard focus.

When not to use

  • For anything people must read to complete a task – it's invisible on touch screens.
  • For long text or interactive content – use a Popover.

Rules

  • The tooltip repeats the button's aria-label, word for word.

Install

Terminal
npx shadcn add tooltip
Import
import { Tooltip } from "@/components/ui/tooltip"

From shadcn’s own registry. Don’t edit the installed file – jsp-ds styles it through the bridge, and fixes go in styles/overrides.css with an issue.