🐛 On small resolution screens Autocomplete results are wider than the input

[fraincs]

Describe the bug

When an Autocomplete field opens the result view, the list is wider than it's trigger.

Steps to reproduce

On a small screen type anything in an Autocomplete field.

Expected results

The results are the same size as the trigger.

[fraincs]

This seems to only happen on non fluid inputs, I would guess that using a fluid input on mobile is more than recommended as a default input has a fixed width and would overflow in a mobile view.

[fraincs]

@patricklafrance any thoughts on this?

[patricklafrance]

Yes of course it would only happen on non fluid inputs.

Yes I agree, in fact every input should be fluid by default on mobile.

[patricklafrance]

@fraincs If your closing this one, should there be another issue to update every Orbit's inputs component to be fluid by default for smaller breakpoints?

[fraincs]

@patricklafrance I was assuming the consumer would deal with that. As smaller breakpoints means nothing, we don't want to assume anything, a form could be in a sidebar in a wide viewport and would fail. Can't wait for container queries ;p

[patricklafrance]

The idea is usually to offer great defaults. I feel like it's kind of annoying for the consumer to have to specify the "fluid" prop for small breakpoint on and on.

I wouldn't feel this way if the inputs didn't have hardcoded min-width but since it's the case I believe a default to fluid make sense here on small breakpoints.

Furthermore, if for a 1% usecase the default is not right, the consumer could opt out be specifying fluid={false} on the input component.