@public-ui/components
Version:
Contains all web components that belong to KoliBri - The accessible HTML-Standard.
86 lines (40 loc) • 3.38 kB
Markdown
# kol-dialog
<!-- Auto Generated Below -->
## Properties
| Property | Attribute | Description | Type | Default |
| --------------------- | ---------- | ------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` |
| `_level` | `_level` | Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text. | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| undefined` | `0` |
| `_on` | -- | Defines the modal callback functions. | `undefined \| ({ onCancel?: ((event: Event) => void) \| undefined; onClose?: (() => void) \| undefined; onToggle?: ((open: boolean) => void) \| undefined; })` | `undefined` |
| `_variant` | `_variant` | Defines the variant of the modal. | `"blank" \| "card" \| undefined` | `'blank'` |
| `_width` | `_width` | Defines the width of the modal. (max-width: 100%) | `string \| undefined` | `'100%'` |
## Methods
### `close() => Promise<void>`
Closes the dialog.
#### Returns
Type: `Promise<void>`
### `closeModal() => Promise<void>`
<span class="text-red-500">**[DEPRECATED]**</span> Use close() instead.<br/><br/>Closes the dialog.
#### Returns
Type: `Promise<void>`
### `openModal() => Promise<void>`
<span style="color:red">**[DEPRECATED]**</span> Use showModal() instead.<br/><br/>Opens the dialog.
#### Returns
Type: `Promise<void>`
### `show(modal?: boolean) => Promise<void>`
Opens the dialog. Pass true to open as a modal dialog.
#### Parameters
| Name | Type | Description |
| ------- | --------- | ----------- |
| `modal` | `boolean` | |
#### Returns
Type: `Promise<void>`
### `showModal() => Promise<void>`
Opens the dialog as a modal.
#### Returns
Type: `Promise<void>`
## Slots
| Slot | Description |
| ---- | ---------------------- |
| | The dialog's contents. |
----------------------------------------------