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

<Badge />

# Terra Paginator Upgrade Guide

## Changes from version 1 to version 2

### Changes to CSS Custom Properties

#### Renamed
| Previous | New |
|-|-|
| --terra-paginator-nav-link-foreground-color | --terra-paginator-nav-link-color |
| --terra-paginator-nav-link-background-hover | --terra-paginator-nav-link-hover-background |
| --terra-paginator-nav-link-foreground-color-hover | --terra-paginator-nav-link-hover-color |
| --terra-paginator-nav-link-text-decoration-hover | --terra-paginator-nav-link-hover-text-decoration |
| --terra-paginator-nav-link-background-focus | --terra-paginator-nav-link-focus-background |
| --terra-paginator-nav-link-border-focus | --terra-paginator-nav-link-focus-border |
| --terra-paginator-nav-link-box-shadow-focus | --terra-paginator-nav-link-focus-box-shadow |
| --terra-paginator-nav-link-foreground-color-focus | --terra-paginator-nav-link-focus-color |
| --terra-paginator-nav-link-background-active | --terra-paginator-nav-link-active-background |
| --terra-paginator-nav-link-foreground-color-active | --terra-paginator-nav-link-active-color |
| --terra-paginator-nav-link-text-decoration-active | --terra-paginator-nav-link-active-text-decoration |
| --terra-paginator-nav-link-foreground-color-disabled | --terra-paginator-nav-link-disabled-color |
| --terra-paginator-nav-link-disabled-box-shadow-focus | --terra-paginator-nav-link-disabled-focus-box-shadow |
| --terra-paginator-nav-link-icon-previous | --terra-paginator-nav-link-icon-previous-background |
| --terra-paginator-nav-link-icon-previous-disabled | --terra-paginator-nav-link-icon-previous-disabled-background |
| --terra-paginator-nav-link-icon-next | --terra-paginator-nav-link-icon-next-background |
| --terra-paginator-nav-link-icon-next-disabled | --terra-paginator-nav-link-icon-next-disabled-background |

#### Added 2.0.0
* --terra-paginator-progressive-nav-link-previous-margin-left
* --terra-paginator-progressive-nav-link-previous-margin-right
* --terra-paginator-progressive-nav-link-next-margin-left
* --terra-paginator-progressive-nav-link-next-margin-right
* --terra-paginator-nav-link-icon-height
* --terra-paginator-nav-link-icon-width
* --terra-paginator-nav-link-icon-previous-margin-right
* --terra-paginator-nav-link-icon-next-margin-left

#### Added ~2.21.x
* --terra-paginator-nav-link-background-color
* --terra-paginator-nav-link-box-shadow
* --terra-paginator-nav-link-font-size
* --terra-paginator-nav-link-text-decoration
* --terra-paginator-nav-link-hover-background-color
* --terra-paginator-nav-link-hover-box-shadow
* --terra-paginator-nav-link-hover-border
* --terra-paginator-nav-link-active-background-color
* --terra-paginator-nav-link-active-box-shadow
* --terra-paginator-nav-link-active-border
* --terra-paginator-nav-link-disabled-background-color
* --terra-paginator-nav-link-disabled-box-shadow
* --terra-paginator-nav-link-disabled-border
* --terra-paginator-nav-link-disabled-opacity
* --terra-paginator-nav-link-previous-padding-left
* --terra-paginator-nav-link-previous-icon-only-margin-left
* --terra-paginator-nav-link-previous-icon-only-margin-right
* --terra-paginator-nav-link-next-padding-right
* --terra-paginator-nav-link-next-icon-only-margin-left
* --terra-paginator-nav-link-next-icon-only-margin-right
* --terra-paginator-nav-link-icon-previous-background-image
* --terra-paginator-nav-link-icon-previous-disabled-background-image
* --terra-paginator-nav-link-icon-next-background-image
* --terra-paginator-nav-link-icon-next-disabled-background-image

#### Removed ~2.21.x
* --terra-paginator-nav-link-background
* --terra-paginator-nav-link-hover-background
* --terra-paginator-nav-link-focus-background
* --terra-paginator-nav-link-active-background
* --terra-paginator-nav-link-disabled-background
* --terra-paginator-nav-link-icon-previous-background
* --terra-paginator-nav-link-icon-previous-disabled-background
* --terra-paginator-nav-link-icon-next-background
* --terra-paginator-nav-link-icon-next-disabled-background