> Portal Navigation:
> 
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt

## Resource: Introduction

## Article: Introduction

## Article Link: https://dev.wix.com/docs/sdk/site-sdk/accessibility-and-devices/tabbing/introduction.md

## Article Content:

# About the Tabbing API

The Tabbing API keeps keyboard focus inside an overlay, such as a dialog, a popup, or a menu, while it's open. Use it so site visitors who move through the page with Tab and Shift+Tab can't reach controls hidden behind an overlay.

With the Tabbing API, you can:

- Trap keyboard focus in one or more containers, such as a dialog, or a menu and the button that opens it.
- Release the trap and restore the page's Tab order.

## Before you begin

It's important to note the following points before starting to code:

- There's one focus trap for the whole page, shared by every component. Each `setParentComponents()` call replaces it, and `reset()` releases it whichever component set it.

## Use cases

- [Keep keyboard focus inside an open dialog](https://dev.wix.com/docs/sdk/site-sdk/accessibility-and-devices/tabbing/sample-flows.md)
- [Keep keyboard focus in a menu and the button that opens it](https://dev.wix.com/docs/sdk/site-sdk/accessibility-and-devices/tabbing/sample-flows.md)

## Terminology

- **Focus trap**: The state in which Tab and Shift+Tab move only between elements inside specific containers, while the rest of the page is out of the Tab order.
- **Container**: An element whose `id` attribute value you specify in `setParentComponents()`.

## SDK setup

@package_metadata:@wix/site-service-tabbing

To use the API, install the `@wix/site-service-tabbing` package:

```bash
npm install @wix/site-service-tabbing
```

#### Import the package

```ts
import { TabbingDefinition } from '@wix/site-service-tabbing/definition'
```

#### Resolve the service

In a React component, resolve the service with the `useService` hook:

```tsx
import { useService } from '@wix/services-manager-react'
import { TabbingDefinition } from '@wix/site-service-tabbing/definition'

function ReleaseTrapButton() {
    const tabbingService = useService(TabbingDefinition)

    return <button onClick={() => tabbingService.reset()}>Close</button>
}
```