FilamentPHP - Layout Manager

Filament Layout Manager Allow users to create & customize their own FilamentPHP pages composed of Livewire components Demo Table of Contents Installation Usage Generate a new page Extend your page from LayoutManagerPage Remove auto-generated $view property Define your components Passing Widget Data Renaming Selection Options Multiple Layouts Customization Extend LayoutManager Update Config Saving Layouts to a Database Adding Header Actions Wrapping in a FilamentPHP page Child Component Data Stores Why is this useful? Event Hook Updating the component’s store Using the store Customizing Changelog Contributing Security Vulnerabilities Credits Open For Work License Installation You can install the package via composer: ...

February 28, 2025 · 8 min · August Sosick

FilamentPHP - Fix "bouncing table" on row selection with CSS

You can fix this issue without resorting to publishing the filament table’s vendor file! The Issue The built in table as part of FilamentPHP has a recurring issue (IMO) where selecting a row causes the table to move downwards due to the insert of a ‘selection indicator’ element above the table. This can cause grief for users who need to reposition their mouse after selecting a row. Custom CSS To fix this issue, we’re simply going to rearrange the order of some of the table components. For example, placing the selection indicator at the bottom of the table. This was my choice for a solution. ...

January 17, 2025 · 3 min · August Sosick

FilamentPHP - Apply filters from table header buttons

Desired Feature Using a header button, the ‘company’ filter is toggled on and off with a custom option (“Google”). Multiple Selection Filter Example /* Company filter is applied to the 'company' field on the Company model Table function defined in the CompanyResource.php file as created by Filament */ namespace App\Filament\Resources; public static function table(Table $table): Table { return $table ->headerActions([ Tables\Actions\Action::make('google_filter') ->badge() ->label('Google') ->icon(fn (ListRecords|TableWidget $livewire) => in_array(Companies::Google->value, Arr::get($livewire->tableFilters ?? [], 'company.values', [])) ? 'heroicon-s-funnel' : 'heroicon-o-funnel' ) ->action(fn (ListRecords|TableWidget $livewire) => self::buttonFilterApply($livewire, 'company', Companies::Google->value)), Tables\Actions\Action::make('apple_filter') ->badge() ->label('Apple') ->icon(fn (ListRecords|TableWidget $livewire) => in_array(Companies::Apple->value, Arr::get($livewire->tableFilters ?? [], 'company.values', [])) ? 'heroicon-s-funnel' : 'heroicon-o-funnel' ) ->action(fn (ListRecords|TableWidget $livewire) => self::buttonFilterApply($livewire, 'company', Companies::Apple->value)), ]) ->filters([ SelectFilter::make('company') ->multiple() ->native(false) ->options(Companies::class), ]) ->columns([ TextColumn::make('name'), TextColumn::make('job_title'), TextColumn::make('location'), TextColumn::make('company'), ]); } private static function buttonFilterApply(ListRecords|TableWidget $livewire, string $filter, string $option): void { $filter_value = (array) Arr::get($livewire->tableFilters ?? [], $filter, []); if (empty($filter_value)) { return; } if (in_array($option, $filter_value['values'])) { $livewire->tableFilters[$filter]['values'] = array_diff($filter_value['values'], [$option]); } else { $livewire->tableFilters[$filter]['values'][] = $option; } } Single Selection Filter Example ...

January 17, 2025 · 2 min · August Sosick