[Docs] Updated docs with Expressive code/info.

PiperOrigin-RevId: 788757526

Author: Material Design Team

docs/components/ButtonGroup.md

@@ -13,17 +13,13 @@ path: /catalog/buttons/
 organize buttons and add interactions between them.There are two variants of a
 button group.
 
-![2 types of button groups](assets/buttons/buttongroup_types.png)
+![2 types of button groups](assets/buttons/buttongroup-types.png)
 
 1.  Standard button group
 2.  Connected button group
 
 **Note:** Images use various dynamic color schemes.
 
-**Note:** `<Button>` is auto-inflated as
-`<com.google.android.material.button.MaterialButton>` via
-`MaterialComponentsViewInflater` when using a `Theme.Material3.*` theme.
-
 ## Design & API documentation
 
 *   [Material 3 (M3) spec](https://m3.material.io/components/button-groups/overview)
@@ -34,25 +30,27 @@ button group.
 Button groups are invisible containers that add padding between buttons and
 modify button shape. They don’t contain any buttons by default.
 
-![Anatomy of a button group](assets/buttons/buttongroup_anatomy.png)
+![Anatomy of a button group](assets/buttons/buttongroup-anatomy.png)
 
 1.  Container
 
 More details on anatomy items in the
 [component guidelines](https://m3.material.io/components/button-groups/guidelines#8fcef838-b0f2-4663-9df5-a8c140822fa6).
 
-## M3 Expressive update
+## M3 Expressive
+
+### M3 Expressive update
 
 Before you can use `Material3Expressive` component styles, follow the
 [`Material3Expressive` themes setup instructions](https://github.com/material-components/material-components-android/tree/master/docs/getting-started.md#material3expressive-themes).
 
-<img src="assets/buttons/buttongroup_expressive.png" alt="Standard button group in 3 of 5 available sizes, and segmented button group with just icon buttons and just common buttons." height="500"/>
+<img src="assets/buttons/buttongroup-expressive.png" alt="Standard button group in 3 of 5 available sizes, and segmented button group with just icon buttons and just common buttons." height="500"/>
 
 Button groups apply shape, motion, and width changes to buttons and icon buttons
 to make them more interactive.
 [More on M3 Expressive](https://m3.material.io/blog/building-with-m3-expressive)
 
-New component added to catalog.
+Button groups are new components added in Expressive.
 
 **Types and naming:**
 
@@ -65,6 +63,15 @@ New component added to catalog.
 *   Works with all button sizes: XS, S, M, L, and XL
 *   Applies default shape to all buttons: round or square
 
+### M3 Expressive styles
+
+Default styles in the expressive themes:
+
+-   Standard button group:
+    `Widget.Material3Expressive.MaterialButtonGroup`
+-   Connected button group:
+    `Widget.Material3Expressive.MaterialButtonGroup.Connected`
+
 ## Key properties
 
 ### Shape and size attributes
@@ -102,7 +109,7 @@ Element                        | Style                                  | Theme
 The standard button group contains multiple related individual buttons. The
 individual button's shape is preserved.
 
-![Examples of using standard button group](assets/buttons/standard_button_group.png)
+![Examples of using standard button group](assets/buttons/standard-button-group.png)
 
 #### Button group examples
 
@@ -154,7 +161,7 @@ In addition to standard button groups, connected button group also overrides the
 individual button's shape to make them visually more belong to a group with 2dp
 spacing, 8dp inner corners, and fully rounded outer corners.
 
-![Examples of using connected button group](assets/buttons/connected_button_group.png)
+![Examples of using connected button group](assets/buttons/connected-button-group.png)
 
 #### Connected button group examples
 
@@ -207,6 +214,10 @@ Material components for Android library. For more information, go to the
 [Getting started](https://github.com/material-components/material-components-android/tree/master/docs/getting-started.md)
 page.
 
+**Note:** `<Button>` is auto-inflated as
+`<com.google.android.material.button.MaterialButton>` via
+`MaterialComponentsViewInflater` when using a `Theme.Material3.*` theme.
+
 ### Making button groups adaptive
 
 `MaterialButtonGroup` inherits from the `LinearLayout`. It can be configured to
@@ -220,7 +231,7 @@ screens by using `layout_width` and `layout_weight`.
 When child buttons should not be adjusted while screen size changes, consider
 using `layout_width` on all buttons.
 
-![Button group with fixed arrangement](assets/buttons/group_arrangement_fixed.png)
+![Button group with fixed arrangement](assets/buttons/group-arrangement-fixed.png)
 
 ```xml
 <com.google.android.material.button.MaterialButtonGroup
@@ -265,7 +276,7 @@ using `layout_width` on all buttons.
 When all child buttons are equally important or their sizes are proportional to
 each other, consider using `layout_weight` on all buttons.
 
-![Button group with flexible arrangement](assets/buttons/group_arrangement_flexible.png)
+![Button group with flexible arrangement](assets/buttons/group-arrangement-flexible.png)
 
 ```xml
 <com.google.android.material.button.MaterialButtonGroup
@@ -313,7 +324,7 @@ each other, consider using `layout_weight` on all buttons.
 When only some buttons are flexible for different screen sizes, consider using
 `layout_weight` on these buttons but use `layout_width` on the rest as below.
 
-![Button group with mixed arrangement](assets/buttons/group_arrangement_mixed.png)
+![Button group with mixed arrangement](assets/buttons/group-arrangement-mixed.png)
 
 ```xml
 <com.google.android.material.button.MaterialButtonGroup