Label

Label renders an accessible caption tied to a form control.

Installation

Nothing to add. This component ships as source in your download, so it is already in your project.

Filesrc/vui/label.tsx

Import from@viliha/vui-react/label

The exported names are at the top of that file. The import path is an alias the download's tsconfig.json points at src/vui/, so you can move that folder and change one line rather than every file that imports from it.

Usage

Associate the label with a control via htmlFor matching the control's id.

label-demo.tsx

import { Label } from "@viliha/vui-react/label";
import { Input } from "@viliha/vui-react/input";

export function Example() {
  return (
    <div className="grid gap-2">
      <Label htmlFor="email">Email</Label>
      <Input id="email" type="email" placeholder="you@company.com" />
    </div>
  );
}

API Reference

Renders a Radix Label; standard label attributes pass through.

Prop	Type	Default
htmlFor	string	—
className	string	—

Label props

It takes no props of its own. Everything you pass reaches the underlying LabelPrimitive.Root primitive, so every attribute it accepts works here unchanged and nothing is invented on top.