Button Group
<esp-button-group>
Groups related buttons into a visually connected segmented control.
Child esp-button elements lose their individual border-radius and
merge into a continuous strip; the group container provides the outer
rounded corners and border.
Groups can also contain labelled buttons:
Buttons can be wrapped in esp-tooltip or esp-popover:
When the group has a fixed width and contains more buttons than can fit, horizontal scrolling kicks in:
Slots
<esp-button-group> has a slot:
Default
One or more esp-button, esp-tooltip, or esp-popover elements containing an esp-button.
Attributes
<esp-button-group> has the following attributes:
label
label has a default value of "".
Accessible label for the group. Screen readers announce this so users understand the purpose of the grouped buttons.
CSS Properties
<esp-button-group> has the following CSS properties:
--esp-button-group-divider
The border style between grouped buttons. Defaults to 1px dotted var(--esp-color-border).