Label
Renders an accessible label associated with controls.
Installation
uvx django_shadcn@latest add label
Usage
<c-label for="email">Email</c-label> <c-input id="email" type="email" />
The for attribute has to match the control's id. That is what lets a
click on the text focus the field, and what a screen reader announces.
Examples
With an input
<c-label for="project">Project name</c-label>
<c-input id="project" placeholder="django-shadcn" />
With a checkbox
<c-checkbox id="newsletter" />
<c-label for="newsletter">Subscribe to the newsletter</c-label>
Required
<c-label for="handle">
Handle
<span class="text-destructive" aria-hidden="true">*</span>
</c-label>
Disabled control
<c-input id="locked" class="peer" disabled />
<c-label for="locked">Locked field</c-label>
Notes
The dimmed style for a disabled control comes from peer-disabled:, so the
control needs the peer class and has to come before the label in the
markup.