# Tooltip

### Usage

```js
import { Tooltip } from 'phoenix-components-library';

render() {
  return (
    <Tooltip
        placement="top"
        title="Our tootlip text"
        defaultVisible={true}
    />
  );
}
```

### Live Example

<!-- STORY -->

### Properties

- `placement` - to set Tooltip Placement
- `title` - To set Tooltip text
- `defaultVisible` - To set tooltip always visible

| propName       | propType | defaultValue | isRequired |
| -------------- | -------- | ------------ | ---------- |
| placement      | string   | top          |            |
| title          | string   | -            |            |
| defaultVisible | bool     | false        |            |

#### Placement Positions

| placement Positions |
| ------------------- |
| topLeft             |
| top                 |
| topRight            |
| leftTop             |
| left                |
| leftBottom          |
| rightTop            |
| right               |
| rightBottom         |
| bottomLeft          |
| bottom              |
| bottomRight         |

### Roadmap