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 unstyled plus your own text styling (or wrap Body/Heading) rather than expecting it to look like other Bauhaus text out of the box.
  • htmlFor must match the target control's id prop exactly for the accessibility association to work — a mismatched or missing id on the control silently breaks the label/control link rather than erroring.