Streamline Form Validation with Beartropy UI Inputs

Handling form validation feedback in standard Laravel Blade templates often leads to repetitive code. You usually have to manually toggle border classes and render error messages for every single input.

The Old Way

A typical input field in a TALL stack application might look like this:

 1<div>
 2    <label for="email">Email Address</label>
 3    <input
 4        type="email"
 5        id="email"
 6        wire:model="email"
 7        class="form-input @error('email') border-red-500 @enderror"
 8    >
 9    @error('email')
10        <span class="text-red-500 text-sm">{{ $message }}</span>
11    @enderror
12</div>

The Beartropy Way

With Beartropy UI, the input component is smart enough to detect validation errors automatically based on the name or wire:model attribute.

You can reduce the boilerplate above to just one line:

1<x-bt-input label="Email Address" name="email" wire:model="email" />

How it helps

1. Automatic Error Mapping: The component looks into the standard Laravel ErrorBag for the key provided in name.
2. Visual Feedback: It automatically applies the error border colors and renders the validation message below the input.
3. Cleaner Templates: Your forms become much easier to read and maintain.

Use this feature to keep your views clean and focus on the logic, not the boilerplate.