PHPackages                             leek/filament-header-filters - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. leek/filament-header-filters

ActiveLibrary[Utility & Helpers](/categories/utility)

leek/filament-header-filters
============================

Inline header filter components for Filament tables — attach any BaseFilter to a column header.

v2.0.5(1mo ago)10996↓36.9%2MITPHPPHP ^8.2CI failing

Since Apr 18Pushed 1w ago1 watchersCompare

[ Source](https://github.com/leek/filament-header-filters)[ Packagist](https://packagist.org/packages/leek/filament-header-filters)[ RSS](/packages/leek-filament-header-filters/feed)WikiDiscussions main Synced 1w ago

READMEChangelog (9)Dependencies (6)Versions (10)Used By (0)

Filament Header Filters
=======================

[](#filament-header-filters)

Inline header filters for [Filament](https://filamentphp.com/) tables. Attach any `BaseFilter` to a column header — select dropdowns, date pickers, min/max ranges, custom multi-field schemas — as a richer alternative to `searchable(isIndividual: true)`.

Screenshot
----------

[](#screenshot)

[![Header filters in action](art/screenshot.png)](art/screenshot.png)

Requirements
------------

[](#requirements)

- PHP 8.2+
- Filament v4.x or v5.x

Installation
------------

[](#installation)

```
composer require leek/filament-header-filters
```

Add the `HasHeaderFilters` trait to any Livewire component that uses `InteractsWithTable` (resource list pages, custom Livewire table components):

```
use Filament\Resources\Pages\ListRecords;
use Leek\FilamentHeaderFilters\Concerns\HasHeaderFilters;

class ListOrders extends ListRecords
{
    use HasHeaderFilters;
}
```

### Styles

[](#styles)

Add the package stylesheet to the panel theme configured with `->viteTheme(...)`. Place it after Filament's theme import so it can adjust the table and header filter styles:

```
@import '../../../../vendor/filament/filament/resources/css/theme.css';
@import '../../../../vendor/leek/filament-header-filters/resources/css/filament-header-filters.css';
```

Then rebuild your app assets:

```
npm run build
```

If you are using Vite locally, restart or keep running:

```
npm run dev
```

Usage
-----

[](#usage)

Call `->headerFilter()` on any column and pass a filter instance.

### Dropdown filter

[](#dropdown-filter)

Use `SelectFilter` for exact-match column filtering. The default placeholder is "All".

```
use App\Enums\OrderStatus;
use Filament\Tables\Columns\TextColumn;
use Filament\Tables\Filters\SelectFilter;

TextColumn::make('status')
    ->badge()
    ->headerFilter(
        SelectFilter::make('status')
            ->options(OrderStatus::class)
            ->native(false)
    )
```

### Min/max range filter

[](#minmax-range-filter)

Use a custom `Filter` with two `TextInput` fields and `->columns(2)` for a side-by-side numeric range:

```
use Filament\Forms\Components\TextInput;
use Filament\Tables\Columns\TextColumn;
use Filament\Tables\Filters\Filter;
use Illuminate\Database\Eloquent\Builder;

TextColumn::make('total_price')
    ->headerFilter(
        Filter::make('total_price_range')
            ->columns(2)
            ->schema([
                TextInput::make('min')->numeric()->placeholder('Min'),
                TextInput::make('max')->numeric()->placeholder('Max'),
            ])
            ->query(fn (Builder $query, array $data): Builder => $query
                ->when($data['min'] ?? null, fn (Builder $q, $v): Builder => $q->where('total_price', '>=', $v))
                ->when($data['max'] ?? null, fn (Builder $q, $v): Builder => $q->where('total_price', '=', $v))
                ->when($data['until'] ?? null, fn (Builder $q, $v): Builder => $q->whereDate('created_at', '