Tooltip

A short hint shown next to its trigger.

TooltipProps packages/core/src/popups.ts:143 ↗

Import

import { Tooltip } from "@tarve/core";

Usage

Tooltip.tsx

import { Button, Tooltip } from "@tarve/core";

let open = false;

<Tooltip
  id="save-tip"
  open={open}
  side="top"
  trigger={<Button>Save</Button>}
  content="Save (Ctrl+S)"
  onOpenChange={(next) => {
    open = next;
  }}
/>

Props

Prop	Type	Default
`content` required	`Child`	—
`id` required	`string`	—
`open` required	`boolean`	—
`trigger` required	`Child`	—
`contentStyle`	`Style`	—
`label`	`string`	—
`onOpenChange`	`(open: boolean) => void`	—
`side`	`PopupSide`	`"top"`

Common props

Shared by every component. See descriptions →

childrenhighlightkeymotionFromonHighlightonPasteonTransitionEndrovingGroupstyle

Types

PopupSide

type PopupSide = "top" | "right" | "bottom" | "left";