Laravel Field Component
Free · MITA form field wrapper that provides a label, hint text, error message, and required indicator around any input.
A Field built for the TALL stack — Blade, Livewire 3 & 4, Alpine.js and Tailwind CSS 4.
Server-rendered by default, dark-mode ready, and WCAG-minded. Drop it in with a single Blade tag:
<x-aura::field>
Installation
composer require bluestarsystem/aura-uiUsage
<x-aura::field label="Username" for="username" hint="Choose a unique username.">
<input type="text" id="username" name="username" class="aura-input" />
</x-aura::field>See the full API, props and live examples in the Field documentation.
Overview
The <x-aura::field> component wraps any form input element with consistent label, hint, error, and required indicator styling. It acts as a layout primitive for building custom form fields that are not covered by the built-in form components (Input, Select, etc.), or for composing third-party inputs into the Aura design system.
Use field for:
- Wrapping custom or third-party inputs
- Building compound form fields
- Adding labels and validation messages to non-Aura inputs
- Consistent form layout structure
Props
| Prop | Type | Default | Description |
|---|---|---|---|
label |
string|null |
null |
Label text displayed above the input |
for |
string|null |
null |
ID of the associated input element (sets the label's for attribute) |
hint |
string|null |
null |
Helper text displayed below the input (hidden when error is present) |
error |
string|null |
null |
Error message displayed below the input in danger color |
required |
bool |
false |
Show a red asterisk (*) next to the label |
Slots
| Slot | Description |
|---|---|
| Default | The form input element(s) to wrap |
See more examples and every variant in the Field documentation.