import { Badge } from 'terra-button-group/package.json?dev-site-package';

<Badge />

# Terra Button Group Upgrade Guide

## Changes from 2 to 3

### Changes to CSS Custom Properties

#### Renamed

| Previous | Updated |
|-|-|
|--terra-button-group-button-active-and-hover-background-color| --terra-button-group-button-selected-and-hover-background-color |
|--terra-button-group-button-active-and-hover-border-color| --terra-button-group-button-selected-and-hover-border-color |
|--terra-button-group-button-active-and-hover-color| --terra-button-group-button-selected-and-hover-color |
|--terra-button-group-button-active-and-focus-background-color| --terra-button-group-button-selected-and-focus-background-color |
|--terra-button-group-button-active-and-focus-border-color| --terra-button-group-button-selected-and-focus-border-color |
| --terra-button-group-button-active-and-focus-box-shadow | --terra-button-group-button-selected-and-focus-box-shadow |
|--terra-button-group-button-active-and-focus-color| --terra-button-group-button-selected-and-focus-color |

### Added
* --terra-button-group-button-selected-and-hover-box-shadow
* --terra-button-group-button-selected-background-color
* --terra-button-group-button-selected-border-color
* --terra-button-group-button-selected-box-shadow
* --terra-button-group-button-selected-color
* --terra-button-group-button-active-box-shadow