import { Meta } from '@storybook/addon-docs';

<Meta title="Components/Badge/Badge" />

# Badge

Badges are compact Box components used as filtering cues or contextual support. They should be clearly labeled and should not be used as buttons. 

This component uses [props from Theme-UI](https://theme-ui.com/sx-prop).

### Required Components

This component can be used independently, and does not require additional components.

### Accessibility

#### Keyboard Navigation

Badge itself is not focusable. However, when components are added to it, these keys provide additional functionality.

| Keys | Functions |
| ---- | --------- |
| Space or Enter | Selects the component. |
| Tab | Focuses the component and follows the page tab sequence. |