Label
Label is a direct re-export from @tamagui/label — there's no Hover-authored
wrapper. It associates a text label with a form control via htmlFor (matching
the control's id), the way Field and Radio use it internally.
React Native
import { Label } from '@hoverinc/design-system-react-native';
<Label htmlFor="my-input">Email address</Label>;Radio uses Label internally (unstyled) to render its own text — that's the
canonical in-package usage example if you need one:
<Label unstyled htmlFor={id}>
{children}
</Label>Common Mistakes
- This is a raw Tamagui primitive, not a Bauhaus-styled component — it carries
no Hover typography styling by default. Pass
unstyledplus your own text styling (or wrapBody/Heading) rather than expecting it to look like other Bauhaus text out of the box. htmlFormust match the target control'sidprop exactly for the accessibility association to work — a mismatched or missingidon the control silently breaks the label/control link rather than erroring.