Select dropdown options being bugged when inside a repeater, after a field becomes visible then invisible.

[ChielHoogma1]

Package

filament/filament

Package Version

v3.2.96

Laravel Version

v11.18.1

Livewire Version

v3.5.4

PHP Version

8.2.15

Problem description

I have the following repeater:

 Repeater::make('repeater')
   ->collapsed()
   ->live()
   ->schema([
       Forms\Components\Select::make('Non hidden select')
          ->translateLabel()
          ->searchable()
          ->options(['test'=>'test', 'test123'=>'test123']),
       Checkbox::make('show/hide field')
         ->translateLabel()
         ->live(),
       Select::make('hidden select')
          ->translateLabel()
          ->searchable()
          ->required()
          ->options(['test'=>'test', 'test123'=>'test123'])
          ->visible(fn (Get $get) => $get('show/hide field')),
 ])->reorderable()->orderColumn('order')

As you can see the repeater has two selects (one of which is hidden) and a checkbox that functions as a toggle for the hidden field. Everything works fine until the checkbox gets clicked twice, after which the selects dropdown options are bugged in the following way: instead of the normal intended way where you can see the options:

Its the exact same for the hidden field.

Expected behavior

I expected the select field to keep showing the items after pressing the checkbox twice.

Steps to reproduce

• You go to the edit page
• Then you press the show/hide checkbox
• Then you press it again
• From now on the selects options do not go over the repeater, which often results in not showing the options.

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

https://github.com/ChielHoogma1/filament-select-overflow-in-repeater

Relevant log output

No response

Donate 💰 to fund this issue

• You can donate funding to this issue. We receive the money once the issue is completed & confirmed by you.
• 100% of the funding will be distributed between the Filament core team to run all aspects of the project.
• Thank you in advance for helping us make maintenance sustainable!

[wychoong]

this is tricky because the collapsed state of the repeater is being updated from both php and js

[ryanmortier]

It's also bugged in a modal. The regression seems to have been made in 3.2.97. I can't reproduce the issue in 3.2.96.

I will submit a gif tomorrow.

edit I just noticed that OPs issue is in v3.2.96 so perhaps I have an unrelated issue.

[zupaazhai]

I also found this issue when use Select in Repeater and in Action Modal

it happened sometimes when I open and close modal

My Environment is

Laravel: v11.19.0

Filament: v3.2.97

some my piece of code

Action::make('openFacilityModal')
    ->label('Add New Facility')
    ->fillForm(fn ($record): array => [
        'facility_id' => $record->id,
        'quantity' => $record->quantity,
        'property_id' => $record->property_id
    ])
    ->form([
        Repeater::make('propertyFacilities')
            ->relationship()
            ->label(false)
            ->grid(2)
            ->addActionLabel('Add New Facility')
            ->schema([
                Grid::make()
                    ->columns(3)
                    ->schema([
                        Select::make('facility_id')
                            ->label('Name')
                            ->options($facilities)
                            ->native(true)
                            ->selectablePlaceholder(false)
                            ->searchable()
                            ->columnSpan(2),

                        TextInput::make('quantity')
                            ->label('Quantity')
                            ->placeholder('Quantity')
                            ->numeric()
                            ->minValue(0)
                            ->default(1)
                            ->step(1),
                    ]),
            ]),
    ])

Screencast from 2024-08-06 02-24-39.webm

[ryanmortier]

Apologies for the terrible job blurring/redacting the video but you can see the same issue as above.

https://github.com/user-attachments/assets/92dcd235-1840-440f-aa75-8a6130ed72c4

The video above displays 7 attempts at the action modal and select dropdown. 1 and 7 both work while 2-6 do not.

My code:

return $table
            ->bulkActions([
                    Tables\Actions\BulkAction::make('addToCollection')
                        ->label('Add to collection')
                        ->icon('heroicon-o-plus-circle')
                        ->modalWidth(MaxWidth::Medium)
                        ->modalSubmitActionLabel('Save')
                        ->form([
                            Forms\Components\Select::make('collection')
                                ->label('Collection')
                                ->relationship(
                                    'collections',
                                    'name',
                                    fn (Builder $query): Builder => $query->ownedByCurrentUser()
                                )
                                ->searchable()
                                ->preload()
                                ->required()
                                ->exists(
                                    Collection::class,
                                    'id',
                                    fn (Exists $rule): Exists => $rule->where(
                                        'user_id',
                                        Auth::user()->id
                                    )
                                ),
                        ])
                        ->action(function (array $data, EloquentCollection $records): void {
                            $collection = Collection::findOrFail($data['collection']);
                            $chunks = $records->diff($collection->accounts)->pluck('id')->chunk(500);
                            $chunks->each(fn ($chunk) => $collection->accounts()->attach($chunk));
                        })
                        ->after(fn () => Notification::make()->success()->title('Saved')->send()),
            ]) 

[ryanmortier]

Maybe related to #13735? I'm not sure, I've been trying to look through the changelog for anything potentially affecting this.

[wychoong]

I also found this issue when use Select in Repeater and in Action Modal

it happened sometimes when I open and close modal

Maybe related to #13735? I'm not sure, I've been trying to look through the changelog for anything potentially affecting this.

both issues are not the same to this issue. this issue is alpine's collapsed state is being updated by livewire request and causing the overflow-hidden to hide the select dropdown

please open a new issue ticket with repo and pinpoint a previously working version if possible

[sezohessen]

any solution ? @danharrin