<!-- AUTO-GENERATED from the @riverty/web-components custom elements manifest. Do not edit by hand. -->

# r-tooltip

A floating text tooltip shown on hover or focus of the slotted trigger element. Supports configurable position and offset.

Example
```
<r-tooltip text="More information about this field" position="top">
  <r-icon-button name="info" label="Info"></r-icon-button>
</r-tooltip>
```

## class: `RTooltip`, `r-tooltip`

### Fields

| Name       | Privacy | Type                                     | Default | Description                             | Inherited From |
| ---------- | ------- | ---------------------------------------- | ------- | --------------------------------------- | -------------- |
| `offset`   |         | `number`                                 | `8`     | Specifies an offset from trigger        |                |
| `open`     |         | `boolean`                                |         | Controls if tooltip content being shown |                |
| `position` |         | `"bottom" \| "left" \| "right" \| "top"` | `'top'` | Specifies tooltip position              |                |
| `text`     |         | `string`                                 | `''`    | Tooltip display text                    |                |

### Methods

| Name       | Privacy | Description                            | Parameters | Return          | Inherited From |
| ---------- | ------- | -------------------------------------- | ---------- | --------------- | -------------- |
| `hide`     |         | Hide the tooltip.                      |            | `Promise<void>` |                |
| `setBlur`  |         | Remove focus from the trigger element. |            | `Promise<void>` |                |
| `setFocus` |         | Set focus on the trigger element.      |            | `Promise<void>` |                |
| `show`     |         | Show the tooltip.                      |            | `Promise<void>` |                |
| `toggle`   |         | Toggle the tooltip open/closed.        |            | `Promise<void>` |                |

### Events

| Name             | Type                                             | Description                                                                              | Inherited From |
| ---------------- | ------------------------------------------------ | ---------------------------------------------------------------------------------------- | -------------- |
| `rTooltipChange` | `CustomEvent<{ open: boolean; }>`                | Emitted whenever the tooltip is shown or hidden. Detail contains the current open state. |                |
| `rTooltipFocus`  | `CustomEvent<{ element: HTMLRTooltipElement; }>` | Tooltip focus event                                                                      |                |

### Attributes

| Name       | Field    | Inherited From |
| ---------- | -------- | -------------- |
| `offset`   | offset   |                |
| `open`     | open     |                |
| `position` | position |                |
| `text`     | text     |                |

### CSS Parts

| Name      | Description                            |
| --------- | -------------------------------------- |
| `trigger` | The wrapper around the trigger element |

### Slots

| Name | Description                                          |
| ---- | ---------------------------------------------------- |
|      | The element that triggers the tooltip on hover/focus |

<hr/>

## Exports

| Kind                        | Name        | Declaration | Module | Package |
| --------------------------- | ----------- | ----------- | ------ | ------- |
| `js`                        | `RTooltip`  | RTooltip    |        |         |
| `custom-element-definition` | `r-tooltip` | RTooltip    |        |         |