# CallOutBanner
To implement CallOutBanner component into your project you'll need to add the import:
```jsx
import CallOutBanner from "@kiwicom/orbit-components/lib/CallOutBanner";
```
After adding import into your project you can use it simply like:
```jsx
<CallOutBanner>Hello World!</CallOutBanner>
```
## Props
Table below contains all types of the props available in the CallOutBanner component.
  
| Name          | Type                                  | Default         | Description                      |
| :------------ | :------------------------------------ | :-------------- | :------------------------------- |
| actions       | `React.Node`                          |                 | Actions - especially Buttons of the CallOutBanner that will be rendered on the bottom.
| children      | `React.Node`                          |                 | The children of the CallOutBanner.
| dataTest      | `string`                              |                 | Optional prop for testing purposes.
| description   | `Translation`                         |                 | The displayed description of the CallOutBanner.
| illustration  | `React.Element<typeof Illustration>`  |                 | The displayed Illustration of the CallOutBanner.
| onClick       | `() => void \| Promise`               |                 | Function for handling onClick callback. See [functional specs](#functional-specs).
| tabIndex      | `string`                              |                 | Specifies the tab order of an element.
| **title**     | `Translation`                         |                 | The displayed title of the CallOutBanner.

## Functional specs
* When you pass some `onClick` callback, the CallOutBanner will be actionable. That means that it will be possible to click on it and it will have proper elevation level.

* By default, the `tabIndex` is null, so it's not possible to focus it. If you either pass `onClick` or specify custom `tabIndex`, the CallOutBanner will be focus-able.