README

A Laravel package for building sortable, filterable, and exportable data tables. Define the table in your controller, drop a component in your Blade view — the rest is automatic.

Features

Sortable columns with visual indicators
Smart filters in column headers (text, boolean, select, date range)
Auto-search: debounce on text, immediate on select/date
Inline boolean toggle with PATCH request
Inline select dropdown with PATCH request
Custom HTML templates per cell
Export to Excel via maatwebsite/excel (customizable export class)
Pagination with ellipsis for large datasets
SlimSelect for styled dropdowns, Flatpickr for date range picker
No CDN dependencies — all assets compiled and published locally

Requirements

PHP 8.2+
Laravel 11 / 12

Installation

composer require aler998/laravel-flux

Publish the compiled assets (required):

php artisan vendor:publish --tag=flux-assets

Publish the config file (optional):

php artisan vendor:publish --tag=flux-config

Quick Start

Controller:

use Aler998\Flux\Table\Table;
use Aler998\Flux\Table\Column;

public function index()
{
    $table = Table::make(User::class)
        ->columns([
            Column::make('id', 'ID')->sortable(),
            Column::make('name', 'Name')->sortable()->filterable(),
            Column::make('email', 'Email')->sortable()->filterable(),
            Column::make('created_at', 'Created')->date()->sortable()->filterable(),
        ])
        ->render();

    return view('users.index', compact('table'));
}

Blade:

{{-- Required in your layout for inline PATCH requests: --}}
<meta name="csrf-token" content="{{ csrf_token() }}">

{{-- In your view: --}}
{!! $table !!}

Column Types

Text (default)

Column::make('name', 'Name')->sortable()->filterable()

Link

// Placeholders resolve to the row's field values
Column::make('name', 'Name')->link('/users/{id}')
Column::make('name', 'Name')->link('/users/{id}/edit', '_blank')

Boolean toggle

Renders an on/off toggle. Sends a PATCH request on click. Reverts on failure.

Column::make('is_active', 'Active')
    ->boolean('/api/users/{id}', 'Active', 'Inactive')
    ->filterable()

Custom filter labels (independent from toggle labels):

->boolean('/api/users/{id}', 'Active', 'Inactive')
->filterLabels('Active', 'Inactive')

Patch payload: { "is_active": 1 }

Expected route:

Route::patch('/api/users/{id}', function (Request $request, $id) {
    User::findOrFail($id)->update(['is_active' => $request->boolean('is_active')]);
    return response()->json(['ok' => true]);
});

Inline select

Renders a dropdown. Sends a PATCH request on change. Reverts on failure.

Column::make('status', 'Status')
    ->select([
        'active'   => 'Active',
        'inactive' => 'Inactive',
        'pending'  => 'Pending',
    ], '/api/users/{id}')
    ->filterable()

Patch payload: { "status": "active" }

The filter automatically uses the same options. The Excel export writes the label (Active) instead of the key (active).

Custom HTML template

Renders arbitrary HTML in the cell. Use {field} placeholders — they are replaced with the row's field values. HTML is not escaped.

// Badge
Column::make('status', 'Status')
    ->template('<span class="badge badge-{status}">{status}</span>')

// Action buttons using fields from other columns
Column::make('name', 'Actions')
    ->template('<a href="/users/{id}/edit" class="btn btn-sm">Edit</a>')

// Avatar image
Column::make('avatar', 'Avatar')
    ->template('<img src="{avatar}" alt="{name}" style="width:32px;height:32px;border-radius:50%">')

Placeholders can reference any field of the row, not just the column's own field. In the Excel export, HTML tags are stripped automatically.

Date

Column::make('created_at', 'Created')->date()              // 15/01/2024
Column::make('updated_at', 'Updated')->date('d/m/Y H:i')  // 15/01/2024 10:30

Adds a Flatpickr range picker as filter (single date or range).

Hidden

Column::make('id', 'ID')->hidden()

Hidden columns are excluded from the table, the export and the SQL query.

Table Options

Table::make(User::class)
    ->columns([...])
    ->perPage(25)                      // rows per page, default 15
    ->filters([                        // pre-applied filters
        'status'           => 'active',
        'created_at__from' => '2024-01-01',
        'created_at__to'   => '2024-12-31',
    ])
    ->exportClass(MyCustomExport::class) // custom export class
    ->render()

Configuration

config/flux.php:

return [
    'route_prefix'    => 'flux',   // internal route prefix
    'middleware'      => ['web'],  // add 'auth' to protect endpoints
    'table_cache_ttl' => 120,      // minutes to cache table config
];

Filters

Filters appear automatically in the column headers when ->filterable() is set. The filter type matches the column type:

Column type	Filter	Query
`text` / `link`	Text input (400ms debounce)	`LIKE %value%`
`boolean`	Select (All / True / False)	`WHERE campo = 1/0`
`select`	Select with column options	`WHERE campo = 'value'`
`date`	Flatpickr range picker	`WHERE DATE(campo) >= from AND <= to`

The Reset button clears all filters and reloads immediately. Filters are applied to both the data view and the Excel export.

Default Filters

->filters([
    'name'             => 'Mario',      // text filter
    'is_active'        => 1,            // boolean filter
    'status'           => 'pending',    // select filter
    'created_at__from' => '2024-01-01', // date range start
    'created_at__to'   => '2024-03-31', // date range end
])

Excel Export

The Export Excel button downloads a .xlsx file that respects the currently active filters and sorting. It includes:

Bold headers with auto-sized columns
Only visible columns
Boolean columns export the label (Active / Inactive) instead of 1 / 0
Select columns export the label (Active) instead of the key (active)
Template columns export plain text (HTML tags stripped)

Custom export class

Pass any maatwebsite/excel export class. Its constructor must accept $query and $columns:

use Aler998\Flux\Exports\FluxExport;
use Maatwebsite\Excel\Concerns\WithTitle;

class UsersExport extends FluxExport implements WithTitle
{
    public function title(): string
    {
        return 'Users';
    }
}

Table::make(User::class)
    ->columns([...])
    ->exportClass(UsersExport::class)
    ->render();

Internal Endpoints

Method	URL	Description
`GET`	`/flux/table/{id}/data`	Paginated JSON data
`GET`	`/flux/table/{id}/export`	Excel file download

The /flux prefix is configurable via config('flux.route_prefix').

Building Assets

If you need to rebuild the frontend assets (after modifying the source):

cd vendor/aler998/laravel-flux
npm install && npm run build
php artisan vendor:publish --tag=flux-assets --force

License

MIT

aler998 / laravel-flux

Maintainers

Package info

Statistics

Security