Feedback

Tooltip

A short hint pointing at what it explains.

iOSSwiftUI popoverAndroidMaterial plain tooltip (kara)Renders in a Screen or an Island

iOSSwiftUI popover

AndroidMaterial plain tooltip (kara)

Import

import {Tooltip} from '@hzblj/kara-ui'

Props

A short text tip on a native view, shown while visible — a SwiftUI popover from children on iOS, Material's plain tooltip centred above them on Android. A native atom — it renders inside <Screen> or <Island>; RnTooltip anchors to a React Native view.

Prop	Type	Description
children*	ReactNode	The anchor — a native view.
onDismiss*	() => void	The user dismissed the tip — turn `visible` off. iOS: a tap outside the popover. Android: any touch outside it, the start of a scroll included, or the anchor scrolling out of the window.
text*	string	The tip.
visible*	boolean	Shows the tip while true. Controlled: nothing opens it but this — wire a long press to it if you want one.

children*

ReactNode

The anchor — a native view.

onDismiss*

() => void

The user dismissed the tip — turn visible off. iOS: a tap outside the popover. Android: any touch outside it, the start of a scroll included, or the anchor scrolling out of the window.

text*

string

The tip.

visible*

boolean

Shows the tip while true. Controlled: nothing opens it but this — wire a long press to it if you want one.

Platform notes

Controlled on both platforms: visible shows it, onDismiss reports a dismissal — nothing else opens it, so wire a long press to visible if you want one.
Android draws Material’s plain tooltip in kara’s controlled TooltipBox, centred above the anchor and kept inside the window; any touch outside it, or the anchor scrolling away, dismisses it.