This PR rewrites input groups, replacing the .input-group
class with two new classes: .input-group-start
and .input-group-end
. Alongside that, this drops all support for multiple addons, dropdowns, button groups, and multiple inputs. Together, has the advantage of fixing our longstanding rounded corner issue with form validation.
All those variations in the component make for an immense amount of difficulty in supporting it long term, and missing important bugs like the rounded corners with form validation. By simplifying things like this with two specific class names, we gain a ton of control.
If you find yourself needing a layout that uses all these now dropped variations, a standard "inline" form layout is most likely the best option (more control over spacing, alignment, and responsive behaviors).
Still more to be done, but I'm liking this simplified direction.
This fixes #25110 (closed) and closes #30170. With the changes from #31677, this also fixes #28414.
Thoughts @twbs/css-review?