awcodes / filament-table-repeater

A modified version of the Filament Forms Repeater to display it as a table.
MIT License
201 stars 43 forks source link

Alignment jumping #120

Closed pepperfm closed 4 months ago

pepperfm commented 4 months ago

Filament Version

v3

Plugin Version

3.0.4

PHP Version

8.3.6

Problem description

Hello. I had an error with the alignment of the elements when I was selecting elements with a long and short name

https://github.com/awcodes/filament-table-repeater/assets/36007880/ae42dcaa-524c-4d53-b621-6d9192cb9f67

Expected behavior

Length of items should be static size

Steps to reproduce

Here is the code:

private static function ingredientTab(): \Illuminate\Contracts\Support\Htmlable
{
    return Tab::make('Ингредиенты')
        ->schema([
            Section::make()
                ->schema([
                    TableRepeater::make('productIngredients')
                        ->label('')
                        ->relationship()
                        ->headers([
                            Header::make('name'),
                            Header::make('required'),
                        ])
                        ->showLabels()
                        ->renderHeader(false)
                        ->schema([
                            Select::make('ingredient_id')
                                ->label('')
                                ->relationship('ingredient', 'name'),
                            Toggle::make('required')
                                ->label('Обязательный'),
                        ])
                        ->defaultItems(0)
                        ->addActionLabel('Добавить')
                        ->columnSpan('full'),
                ])->maxWidth('full'),
        ]);
}

Problem in alignment of Select and Toggle components

Reproduction repository

No response

Relevant log output

No response

awcodes commented 4 months ago

This is really a side effect of how tables work and the select component.

If you give the column an explicit width, this should be mitigated.