<!-- AUTO-GENERATED by packages/components/bin/generate-skill-component-catalog.js. Do not edit by hand. -->

# r-toast-group

Container for managing and positioning multiple `r-toast` notifications with configurable stack direction, screen position, and maximum visible count.

Example
```
<r-toast-group position-x="right" position-y="top">
  <r-toast status="success" headline="Saved">Your changes have been saved.</r-toast>
  <r-toast status="warning" headline="Low storage">You are running low on storage.</r-toast>
</r-toast-group>
```

## class: `RToastGroup`, `r-toast-group`

### Fields

| Name        | Privacy | Type                            | Default            | Description                                                                       | Inherited From |
| ----------- | ------- | ------------------------------- | ------------------ | --------------------------------------------------------------------------------- | -------------- |
| `direction` |         | `"column" \| "column-reverse"`  | `"column-reverse"` | Controls whether the latest toast appears at the bottom or at the top of the list |                |
| `limit`     |         | `number`                        |                    | Maximum number of toasts visible simultaneously                                   |                |
| `positionX` |         | `"center" \| "left" \| "right"` | `"right"`          | Controls horizontal position of the group container                               |                |
| `positionY` |         | `"bottom" \| "top"`             | `"top"`            | Controls vertical position of the group container                                 |                |

### Methods

| Name       | Privacy | Description                                        | Parameters | Return          | Inherited From |
| ---------- | ------- | -------------------------------------------------- | ---------- | --------------- | -------------- |
| `closeAll` |         | Programmatically dismisses all toasts in the group |            | `Promise<void>` |                |

### Events

| Name               | Type                             | Description                                              | Inherited From |
| ------------------ | -------------------------------- | -------------------------------------------------------- | -------------- |
| `rToastAdded`      | `CustomEvent<HTMLRToastElement>` | Emitted when a new toast is added to the group           |                |
| `rToastGroupEmpty` | `CustomEvent<void>`              | Emitted when all toasts have been removed from the group |                |
| `rToastRemoved`    | `CustomEvent<HTMLRToastElement>` | Emitted when a toast is removed from the group           |                |

### Attributes

| Name         | Field     | Inherited From |
| ------------ | --------- | -------------- |
| `direction`  | direction |                |
| `limit`      | limit     |                |
| `position-x` | positionX |                |
| `position-y` | positionY |                |

### Slots

| Name | Description                                 |
| ---- | ------------------------------------------- |
|      | `r-toast` elements stacked inside the group |

<hr/>

## Exports

| Kind                        | Name            | Declaration | Module | Package |
| --------------------------- | --------------- | ----------- | ------ | ------- |
| `js`                        | `RToastGroup`   | RToastGroup |        |         |
| `custom-element-definition` | `r-toast-group` | RToastGroup |        |         |