LaraUI - V1.0

File

The <x-xf::file> component is a Blade wrapper for file input fields in Laravel. It simplifies file upload handling with optional labels, sizing, default attributes, and styling support. It integrates smoothly with form binding and error handling, making file inputs clean, consistent, and easy to manage in any form.

📄 <x-xf::file>

📘 Description

The <x-xf::file> component is a reusable Blade component that simplifies the creation of file input fields in Laravel forms. It supports optional labels, custom sizing, and accepts additional HTML attributes for flexibility and extended control.

This component is designed to be used within <x-xf::form file=true> to enable file uploads properly with the correct form encoding.

✅ Usage Example

<x-xf::file 
    name="document" 
    label="Upload Document" 
    size="lg" 
    :attr="['accept' => '.pdf,.docx']" 
    class="mb-4"
/>

🔑 Props

Name Type Required Default Description
name string ✅ — Name of the file input field. Required for form binding and file upload handling.
attr array ❌ [] Additional HTML attributes like accept, multiple, disabled, etc.
size string ❌ 'md' Controls the visual size of the input. Accepts sm, md, or lg.
label string|null ❌ null Optional label displayed above the file input field.
class string|null ❌ null Custom CSS class for styling the input or its wrapper.

🛡 Features

  • ✅ Clean and consistent file input
  • ✅ Optional label support
  • ✅ Size variants for UI consistency (sm, md, lg)
  • ✅ Accepts additional attributes like accept or multiple
  • ✅ Best used inside <x-xf::form file=true> for upload support