import { Badge } from 'terra-toolbar/package.json?dev-site-package';
import DefaultToolbar from './example/DefaultToolbar?dev-site-example';
import PropsTable from 'terra-toolbar/lib/Toolbar?dev-site-props-table';

<Badge />

# Terra Toolbar

The terra-toolbar component is used to display bar containing items such as buttons, button groups, and links.

## Getting Started

- Install with [npmjs](https://www.npmjs.com):
  - `npm install terra-toolbar`

<!-- AUTO-GENERATED-CONTENT:START Peer Dependencies -->
## Peer Dependencies

This component requires the following peer dependencies be installed in your app for the component to properly function.

| Peer Dependency | Version |
|-|-|
| react | ^16.8.5 |
| react-dom | ^16.8.5 |

<!-- AUTO-GENERATED-CONTENT:END -->

## Usage

```jsx
import Toolbar from 'terra-toolbar';
```

## Component Features

 * [Cross-Browser Support](https://engineering.cerner.com/terra-ui/about/terra-ui/component-standards#cross-browser-support)
 * [Responsive Support](https://engineering.cerner.com/terra-ui/about/terra-ui/component-standards#responsive-support)
 * [Mobile Support](https://engineering.cerner.com/terra-ui/about/terra-ui/component-standards#mobile-support)
 * [LTR/RTL Support](https://engineering.cerner.com/terra-ui/about/terra-ui/component-standards#ltr--rtl)

 ## Examples
 <DefaultToolbar
  title="A Basic Toolbar using the aria-label and aria-controls attributes for accessibility" 
  description="For assistive technology users, this example adds the aria-label attribute to name the type of tools this 
 toolbar contains, and adds the aria-controls attribute to indicate which page region the toolbar applies to."
 />

 ## Toolbar Props
 <PropsTable />