Набор полей формы нити или повторитель не отображаются должным образом во всю ширину в форме нити Laravel ⇐ Php

[Anonymous]

Я работаю над проектом Laravel, используя Filament для создания формы, и у меня возникли проблемы с расположением повторителя внутри раздела. Несмотря на настройку columns(4) и явное определение интервалов столбцов для каждого поля, поля не отображаются подряд и не занимают всю ширину страницы.
Вот упрощенная версия моего кода:

Код: Выделить всё

\Filament\Forms\Components\Section::make()
->heading('اطلاعات شغلی')
->columns(4) // Section uses a 4-column grid
->schema([
Repeater::make('interests')
->relationship('interests')
->label('علاقه‌مندی‌ها')
->schema([
Select::make('interest_id')
->label('نوع اشتغال')
->options(Interest::pluck('title', 'id')->toArray())
->required()
->searchable()
->columnSpan(2),

Select::make('state_id')
->label('استان محل اشتغال')
->getSearchResultsUsing(fn(string $search): array => State::query()
->where('name', 'like', "%{$search}%")
->limit(10)
->pluck('name', 'id')
->toArray())
->getOptionLabelUsing(fn($value): ?string => State::find($value)?->name)
->required()
->searchable()
->columnSpan(1),

Select::make('city_id')
->label('شهر محل اشتغال')
->required()
->getSearchResultsUsing(fn(string $search, Get $get): array => City::query()
->whereRelation('state', 'id', '=', $get('state_id'))
->where('name', 'like', "%{$search}%")
->limit(10)
->pluck('name', 'id')
->toArray())
->getOptionLabelUsing(fn($value): ?string => City::find($value)?->name)
->placeholder('انتخاب کنید')
->searchable()
->visible(fn(Get $get) => !empty($get('state_id')))
->columnSpan(1),

Select::make('university_id')
->label('دانشگاه محل فعالیت فعلی')
->getSearchResultsUsing(fn(string $search, Get $get): array => University::query()
->whereRelation('state', 'id', '=', $get('state_id'))
->where('name', 'like', "%{$search}%")
->limit(10)
->pluck('name', 'id')
->toArray())
->getOptionLabelUsing(fn($value): ?string => University::find($value)?->name)
->placeholder('انتخاب کنید')
->required()
->searchable()
->columnSpan(2),

TextInput::make('activity_place')
->label('محل فعالیت')
->nullable()
->columnSpan(4), // Full row
])
->columns(4) // Repeater uses a 4-column grid
->label('اطلاعات شغلی')
->required(),
]),

Но теперь проблема:
Поля в повторителе не отображаются в правильной строке или во всю ширину. макет.
Несмотря на то, что я установил columns(4) как для раздела, так и для повторителя, элементы формы кажутся ограниченными более узкую ширину, чем ожидалось.
columnsSpan для каждого поля (например, columnsSpan(2) или columnsSpan(4)) не влияет на макет должным образом.
Результат:


Что я попробовал:

• Явно установить columns() как для раздела, так и для повторителя.
• Настройка значения columnsSpan, чтобы обеспечить правильное выравнивание полей.

Ожидаемое поведение:
Поля в повторителе следует:

• Отображать правильно размещать строки в соответствии со значениями columnsSpan.
• Занимайте всю ширину страницы, соблюдая сетку из 4 столбцов
  макет .

Итак, как я могу гарантировать, что поля повторителя в разделе будут использоваться полную ширину страницы?
Я что-то упускаю в конфигурации, или это может быть связано с CSS/JS Filament?
Будем очень благодарны за любую помощь! Заранее спасибо.
Laravel: 10.x
Filament: 3.x
PHP: 8.1

Подробнее здесь: https://stackoverflow.com/questions/792 ... in-laravel