# r-dialog A modal dialog overlay for displaying content or collecting user input. Traps focus while open and supports customizable header, body, and footer slots. Example: ```

Are you sure you want to proceed?

Confirm Cancel
``` ## class: `RDialog`, `r-dialog` ### Fields | Name | Privacy | Type | Default | Description | Inherited From | | ---------------- | ------- | -------------------------------- | ---------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------- | | `bodyHeight` | | `string` | `'auto'` | Allows to set height of the dialog body container
while the value is smaller then `max-height` of the
dialog body pre-set according to the `size` prop. | | | `bodyText` | | `string` | | Allows plain text to be provided to the body of the dialog
in cases where markup is not required. For more complex cases,
including those requiring HTML markup,
use
...
. | | | `closeAriaLabel` | | `string` | | Allows plain text to be provided to the close button of the dialog. | | | `headline` | | `string` | | Allows to provide headline text to the dialog header section. | | | `open` | | `boolean` | `false` | Define if dialog either shown or hidden. | | | `returnValue` | | `string` | | A value indicating the result of a user’s
interaction with the dialog, used to determine what action
the user took before closing the dialog.

For example, it can differentiate between whether the user
clicked a “Confirm” button or a “Cancel” button. | | | `size` | | `"large" \| "medium" \| "small"` | `'medium'` | Defines one of pre-defined sizes of the dialog. | | ### Methods | Name | Privacy | Description | Parameters | Return | Inherited From | | ----------- | ------- | ------------------------------------------------------------------------- | ---------- | --------------- | -------------- | | `close` | | Method to display a non-modal dialog | | `Promise` | | | `showModal` | | Method to display a modal dialog | | `Promise` | | | `toggle` | | Method to either show or hide dialog
depending on the current state. | | `Promise` | | ### Events | Name | Type | Description | Inherited From | | ------- | ------------------ | --------------------------------------------------------------------------------- | -------------- | | `close` | `CustomEvent` | Emitted when the dialog is closed.
Fired by close(), and by the close button. | | ### Attributes | Name | Field | Inherited From | | ------------------ | -------------- | -------------- | | `body-height` | bodyHeight | | | `body-text` | bodyText | | | `close-aria-label` | closeAriaLabel | | | `headline` | headline | | | `open` | open | | | `return-value` | returnValue | | | `size` | size | | ### Slots | Name | Description | | -------- | ------------------------------------------ | | | Default slot for the dialog body content | | `footer` | Footer content (e.g. action buttons) | | `form` | Form element placed inside the dialog body | | `header` | Dialog header content |
## Exports | Kind | Name | Declaration | Module | Package | | --------------------------- | ---------- | ----------- | ------ | ------- | | `js` | `RDialog` | RDialog | | | | `custom-element-definition` | `r-dialog` | RDialog | | |