Holo Button Group
The <holo-button-group> component groups related buttons together with role="group" semantics and a shared visual gap. Use the orientation prop to lay buttons out horizontally or vertically, and the label prop to give the group an accessible name.
Live Previews
Section titled “Live Previews”Horizontal (default)
Section titled “Horizontal (default)”<holo-button-group label="Text formatting"> <holo-button label="Bold" variant="secondary"></holo-button> <holo-button label="Italic" variant="secondary"></holo-button> <holo-button label="Underline" variant="secondary"></holo-button></holo-button-group>Vertical
Section titled “Vertical”<holo-button-group label="Actions" orientation="vertical"> <holo-button label="Save" variant="primary"></holo-button> <holo-button label="Cancel" variant="secondary"></holo-button></holo-button-group>API Reference
Section titled “API Reference”Properties
Section titled “Properties”| Property | Attribute | Description | Type | Default |
| ------------- | ------------- | -------------------------------------------- | ---------------------------- | -------------- |
| orientation | orientation | The layout direction of the grouped buttons. | "horizontal" \| "vertical" | "horizontal" |
| label | label | Optional accessible name for the group. | string | undefined |
| Slot Name | Description |
| --------- | --------------------------------------------------- |
| (default) | holo-button/holo-icon-button elements to group. |