Using multiple icons in IconColumn

[juliangums]

For tables I love how you can use multiple images in ImageColumn and stack them. Is there any way to do the same with icons?

There is a method called wrap() in the docs mentioning that you should use it to wrap multiple icons so they don't overflow. But there is no mention of how to add multiple icons. I could find an icons() method but this just evaluates different closures and ultimately returns a single icon.

Does anyone know how to do this or how to easily use the work done for ImageColumn in a custom class for icons?

[leandrocfe]

Maybe a custom column?

Tables\Columns\ViewColumn::make('icons')
->view('custom-icons')

<!-- resources/views/custom-icons.blade.php -->
<div class="flex">
    @svg('heroicon-o-archive-box-arrow-down', 'w-7 h-7')
    @svg('heroicon-o-archive-box-x-mark', 'w-7 h-7')
    @svg('heroicon-o-archive-box', 'w-7 h-7')
</div>

[juliangums]

Thanks for that. Not exactly what I was looking at. I was hoping to reuse the work that has been done for images, especially the overlapping style etc. but might be the only solution for now.

[aliaxonbaig]

I am also looking for how to put multiple icons together, i.e. attachment and comment indicator on the table, wrap function has no details -- @danharrin may extend some directions.

[Fabi0li]

@juliangums if the state of the Tables\Columns\ImageColumn is an array or collection it will automatiaclly make multiple icons. The values of the state array have to be matched with the icon funtion (https://filamentphp.com/docs/3.x/tables/columns/icon) or if the state array contains the icon strings then you can use ->icon(fn (string $state): string => $state) instead of the match function.

Tables\Columns\IconColumn::make('test')
    ->label('test icons')
    ->state(['draft', 'reviewing', 'reviewing', 'published'])
    ->icon(fn (string $state): string => match ($state) {
        'draft' => 'heroicon-o-pencil',
        'reviewing' => 'heroicon-o-clock',
        'published' => 'heroicon-o-check-circle',
    }),

[juliangums]

Ok interesting. Thanks for sharing this. I feel like this is missing in the docs.

I also wish it was easy to do the ->circular()->stacked() thing on it. Also would be good if one could do multiple icons on the text column too like in @aliaxonbaig 's example