Password
The <x-xf::password> component is a custom Blade input component specifically tailored for password fields. It offers a clean and consistent structure with support for label display, size variations, and extended HTML attributes — ideal for login, registration, or password update forms.
📄 <x-xf::password>
📘 Description
The <x-xf::password> component is a reusable Blade component designed to render a secure password input field. It ensures proper styling and layout for password forms, and supports optional labels, size control, and additional HTML attributes.
Common use cases include login screens, registration forms, password resets, and anywhere secure input is required.
✅ Usage Example
<x-xf::password
name="password"
label="Password"
size="lg"
:attr="['autocomplete' => 'new-password']"
class="mb-3"
/>
🔑 Props
| Name | Type | Required | Default | Description |
|---|---|---|---|---|
name |
string | ✅ | — | The name attribute of the input field, used during form submission. |
attr |
array | ❌ | [] | Additional HTML attributes (e.g., autocomplete, required, maxlength). |
size |
string | ❌ | 'md' |
Visual size of the field: sm, md, or lg. |
label |
string|null | ❌ | null | Optional label to display above the password field. |
class |
string|null | ❌ | null | Custom CSS class for styling the input or its container. |
🛡 Features
- ✅ Secure and styled password input
- ✅ Optional label and sizing support
- ✅ Fully customizable via attributes
- ✅ Compatible with Laravel validation and form model binding