Use group utilities for fine-grained control over visually grouping buttons, form fields, and other elements.
Button Groups
Button groups allow for more flexibility in establishing gestalt and controlling information density.
Use a combination of layout utilities and color extensions to create button groups.
The utilities .rounded-left, .rounded-right,
and .not-rounded can be used to override button and form field border radii.
Normally, buttons with borders would double up when placed next to each other.
The .x-group-item utility adjusts negative margins and focus states to visually collapse borders.
Functionally, this is similar to how other frameworks handle button and form input groups,
but with more direct control over styling.
Input groups can be created by removing margins, adjusting border radii, and using the group utilities.
The .hide utility visually hides labels, while keeping them accessible to screen readers.