fix: improper width for autocomplete fields in tabular inline

[tudoramariei]

What version of Unfold are you using?

0.54.0

What version of Django are you using?

5.1.8

What browser are you using?

Chrome 135.0.7049.42

Did you check the changelog/commit history, if the bug is not already fixed?

Yes, and located that the issue is on this line and caused by this commit

Did you searched other issues, if the bug is not already fixed?

Yes

Did you checked documentation?

No

Are you able to replicate the bug in the demo site?

No, because I don't think there's a TabularInline where I can create a new many-to-many object

Repository with reproduced bug

This is the inline where we have the issue
https://github.com/code4romania/redirectioneaza/blob/7bac0a30c866f612c631a0ee673fa91193cf6dcf/backend/partners/admin.py#L44

Describe your issue

I have two models, in a many-to-many relationship, connected by a through model. In the admin of the first model I have a tab with tabular inlines to create connections to the second model with an autocomplete field.
After the latest changes, all the fields are of the same (button) size, including the search field. This makes searching really difficult.

Workaround: Select an item from the list (if it's selectable) and the section resizes based on the content so that you can actually search.

Reproducing this can be done with the following code (using FirstModel and SecondModel but you can see the original code in the previous section of this issue):

class SecondModelInline(TabularInline):
    model = FirstModel.second_models.through
    extra = 1
    tab = True

    autocomplete_fields = ("second_model",)

@admin.register(FirstModel)
class FirstModelAdmin(ModelAdmin):
    ...
    inlines = (SecondModelInline,)

How this section looks in 0.53

How this section looks in 0.54

How this section looks in 0.54 with w-full added to the div's classes

[afsangujarati93]

Adding to this, I also see an issue when the text in the autocomplete is very long.

I am on version 0.55.2

Update:
Looks like w-full fixes that too.

[devxoul]

I added custom css as a workaround.

unfold-autocomplete.css

.select2 {
  min-width: 190px;
}

settings.py

UNFOLD = {
    # ...
    "STYLES": [
        lambda request: static("admin/unfold-autocomplete.css"),
    ],
    # ...
}

[lukasvinclav]

@devxoul I think, I already fixed the issue in another branch which I'm working on right now

#1234