docs: ui.button_group (deephaven#910)

Closes deephaven#836 

Did not include alignment section, there appears to be an issue with the
`alignment` prop, more details included in this ticket:
deephaven#909

---------

Co-authored-by: margaretkennedy <82049573+margaretkennedy@users.noreply.github.com>

plugins/ui/docs/components/button_group.md

@@ -0,0 +1,121 @@
+# Button Group
+
+A button group is a UI component that groups buttons with related actions together and will automatically handle layout overflow nicely. Only buttons can be used within button groups.
+
+## Example
+
+```python
+from deephaven import ui
+
+
+my_button_group_basic = ui.button_group(
+    ui.button("Rate Now", variant="accent"),
+    ui.button("No, thanks", variant="primary", style="outline"),
+    ui.button("Remind me later", variant="primary", style="outline"),
+)
+```
+
+## UI Recommendations
+
+Recommendations for creating button groups:
+
+1. The most critical action in a button group should use an accent, or negative button style, while other actions should be primary outline buttons.
+2. Button groups should be left-aligned to follow content such as blocks of text, center-aligned in empty states, and right-aligned in container components like dialogs, popovers, or cards.
+3. Button priority should match text alignment: for left-aligned text, the most critical button is on the left; for right- or center-aligned text, the most critical button is on the right.
+4. Icons should be used for higher-priority actions if used in the button group. If the most critical action does not have an icon, avoid using icons for the other lower-priority actions.
+
+Consider using an [`action_group`](./action_group.md) to allow the user to select from a list of actions. 
+
+
+## Content
+
+A button group is used to handle button overflow and, thus, expects buttons as children. It switches to a vertical layout when horizontal space is limited.
+
+```python
+from deephaven import ui
+
+
+my_button_group_content_space_example = ui.view(
+    ui.button_group(
+        ui.button("Rate Now", variant="accent", style="outline"),
+        ui.button("Remind me later", variant="primary", style="outline"),
+        ui.button("No, thanks", variant="primary", style="outline"),
+    ),
+    width=200,
+    border_width="thin",
+    padding="size-100",
+)
+```
+
+
+## Orientation
+
+Setting the `orientation` prop to "vertical" will prevent any spacing-related dynamic orientation changes.
+
+The button group will remain in the orientation regardless of the width.
+
+```python
+from deephaven import ui
+
+
+my_button_group_orientation_example = ui.button_group(
+    ui.button("No, thanks", variant="primary", style="outline"),
+    ui.button("Remind me later", variant="primary", style="outline"),
+    ui.button("Rate Now", variant="accent"),
+    orientation="vertical",
+)
+```
+
+
+## Alignment
+
+By default, button groups are start-aligned to accord with content, but they can be set to have a different alignment using the `alignment` prop.
+
+```python
+from deephaven import ui
+
+
+@ui.component
+def ui_button_group_alignment_examples():
+    return [
+        ui.button_group(
+            ui.button("No, thanks", variant="primary", style="outline"),
+            ui.button("Remind me later", variant="primary", style="outline"),
+            ui.button("Rate Now", variant="accent"),
+            align="center",
+        ),
+        ui.button_group(
+            ui.button("No, thanks", variant="primary", style="outline"),
+            ui.button("Remind me later", variant="primary", style="outline"),
+            ui.button("Rate Now", variant="accent"),
+            align="end",
+        ),
+    ]
+
+
+my_button_group_alignment_examples = ui_button_group_alignment_examples()
+```
+
+
+## Disabled state
+
+The `is_disabled` prop disables the button group to prevent user interaction. This is useful when the button group should be visible but not available for selection.
+
+
+```python
+from deephaven import ui
+
+
+my_button_group_is_disabled_example = ui.button_group(
+    ui.button("No, thanks", variant="primary", style="outline"),
+    ui.button("Remind me later", variant="primary", style="outline"),
+    ui.button("Rate Now", variant="accent"),
+    is_disabled=True,
+)
+```
+
+## API Reference
+
+```{eval-rst}
+.. dhautofunction:: deephaven.ui.button_group
+```

plugins/ui/docs/sidebar.json

@@ -33,6 +33,10 @@
             "label": "button",
             "path": "components/button.md"
           },
+          {
+            "label": "button_group",
+            "path": "components/button_group.md"
+          },
           {
             "label": "checkbox",
             "path": "components/checkbox.md"

plugins/ui/src/deephaven/ui/components/button_group.py

@@ -91,6 +91,12 @@ def button_group(
         margin_end: The margin for the logical end side of the element, depending on layout direction.
         margin_x: The margin for the left and right sides of the element.
         margin_y: The margin for the top and bottom sides of the element.
+        width: The width of the element.
+        height: The height of the element.
+        min_width: The minimum width of the element.
+        min_height: The minimum height of the element.
+        max_width: The maximum width of the element.
+        max_height: The maximum height of the element.
         position: Specifies how the element is position.
         top: The top position of the element.
         bottom: The bottom position of the element.
@@ -104,6 +110,10 @@ def button_group(
         UNSAFE_class_name: Set the CSS className for the element. Only use as a last resort. Use style props instead.
         UNSAFE_style: Set the inline style for the element. Only use as a last resort. Use style props instead.
         key: A unique identifier used by React to render elements in a list.
+
+    Returns:
+        The rendered button group element.
+
     """
     return component_element(
         "ButtonGroup",