## Managing focus

The Pager wrapper element is part of the page tab sequence. When focused, it allows the user to press `Enter` to activate its inner navigation. Inner navigation in the component also relies on `Tab`. When focus is inside the Pager, it is trapped.

Each specific implementation of the Pager component may offer configuration option that would allow the developer to change the default (described here) behavior of the component. Such alternative behavior may be to include all Pager elements directly in the document tab sequence, or to implement arrow-based navigation among the inner Pager elements.

Important notes:

* All buttons in the Pager (including disabled ones) are always focusable.
* In scenarios when the currently focused button disappears from the Pager upon user interaction (for example the `more pages` button), focus should be moved to the button representing the currently selected page.

## Keyboard Shortcuts

### For all scenarios

| Shortcut | Behavior |
|----------|----------|
| `Home` | Loads the first page of data (if the current page is not the first one). |
| `End` | Loads the last page of data (if the current page is not the last one). |

### When wrapper is focused

| Shortcut | Behavior |
|----------|----------|
| `Enter` | Activates inner Pager navigation. |
| `Tab` | Navigates to the next focusable element on the page. |
| `Shift` + `Tab` | Navigates to the previous focusable element on the page. |
| `Left Arrow` | Loads the previous page of data, if any. |
| `Right Arrow` | Loads the next page of data, if any. |
| `Page Up` | Loads the previous page of data, if any. |
| `Page Down` | Loads the next page of data, if any. |

### When inner navigation is activated

| Shortcut | Behavior |
|----------|----------|
| `Esc` | Moves focus back to wrapper element. Deactivates inner Pager navigation. |
| `Tab` | Navigates to the next focusable element in the Pager. If current focus is on the last element, moves focus to the first focusable item in the component. |
| `Shift` + `Tab` | Navigates to the previous focusable element in the Pager. If current focus is on the first element, moves focus to the last focusable item in the component. |
| `Enter` | For button items, and Pager input executes the currently focused action (page change). |