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

# r-hint

A form hint is a small presentational components used next to some form elements.

Mainly used within design system components and not primarilly intended for end-users.

Example:
```
<r-hint>This field is required.</r-hint>
<r-hint variant="success">Email address is valid.</r-hint>
```

## class: `RHint`, `r-hint`

### Fields

| Name      | Privacy | Type                                                 | Default | Description                                                | Inherited From |
| --------- | ------- | ---------------------------------------------------- | ------- | ---------------------------------------------------------- | -------------- |
| `icon`    |         | `string`                                             |         | Allows to define custom icon to be shown next to hint text |                |
| `invalid` |         | `boolean`                                            |         | Apply validation error visual style                        |                |
| `variant` |         | `"error" \| "information" \| "success" \| "warning"` |         | Variant defines the way hint will be visually presented    |                |

### Attributes

| Name      | Field   | Inherited From |
| --------- | ------- | -------------- |
| `icon`    | icon    |                |
| `invalid` | invalid |                |
| `variant` | variant |                |

### Slots

| Name   | Description                                                                  |
| ------ | ---------------------------------------------------------------------------- |
|        | Hint message text                                                            |
| `icon` | Custom icon placed before the hint text (overrides the built-in status icon) |

<hr/>

## Exports

| Kind                        | Name     | Declaration | Module | Package |
| --------------------------- | -------- | ----------- | ------ | ------- |
| `js`                        | `RHint`  | RHint       |        |         |
| `custom-element-definition` | `r-hint` | RHint       |        |         |