Skip to content

visibleFrom() ignored in content layout #17262

@damiandejong

Description

@damiandejong

Package

filament/filament

Package Version

v4.0.0-beta19

Laravel Version

v12.21.0

Livewire Version

v3.6.4

PHP Version

PHP 8.4

Problem description

I am using a content layout for my table to stack columns on mobile devices. I want the icon column to be visible from breakpoint md.

->columns([
                Split::make([
                        TextColumn::make('date')
                            ->dateTime(),
                        IconColumn::make('confirmed_at')
                            ->boolean()
                            ->getStateUsing(fn (Service $record) => filled($record->confirmed_at))
                            ->tooltip(fn (Service $record) => $record->confirmed_at?->translatedFormat('j M Y H:i'))
                            ->toggleable(isToggledHiddenByDefault: true)
                            ->visibleFrom('md'),
                    ]),
            ])

Expected behavior

I would expect the column to be hidden on devices smaller than md, but it is visible, probably because the order of style classes is incorrenct. Changing the breakpoint to lg or whatsoever leads to the same problem.

The md:fi-visible class is inserted, but overwritten by the classes of the content layout.

Image

Steps to reproduce

Create a table with the following columns:

->columns([
                Split::make([
                        TextColumn::make('date')
                            ->dateTime(),
                        IconColumn::make('confirmed_at')
                            ->boolean()
                            ->getStateUsing(fn (Service $record) => filled($record->confirmed_at))
                            ->tooltip(fn (Service $record) => $record->confirmed_at?->translatedFormat('j M Y H:i'))
                            ->toggleable(isToggledHiddenByDefault: true)
                            ->visibleFrom('md'),
                    ]),
            ])

Reproduction repository (issue will be closed if this is not valid)

https://github.com/damiandejong/filament-content-bug

Relevant log output

Metadata

Metadata

Assignees

No one assigned

    Type

    Projects

    Status

    Todo

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions