UNPKG

@public-ui/components

Version:

Contains all web components that belong to KoliBri - The accessible HTML-Standard.

77 lines (37 loc) 3.56 kB
# kol-drawer <!-- Auto Generated Below --> ## Properties | Property | Attribute | Description | Type | Default | | --------------------- | ------------- | ------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | | `_align` | `_align` | Defines the visual orientation of the component. | `"bottom" \| "left" \| "right" \| "top" \| undefined` | `undefined` | | `_hasCloser` | `_has-closer` | Defines whether the element can be closed. | `boolean \| undefined` | `false` | | `_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` | -- | Specifies the EventCallback function to be called when the drawer is closing. | `undefined \| ({ onCancel?: ((event: Event) => void) \| undefined; onClose?: (() => void) \| undefined; onToggle?: ((open: boolean) => void) \| undefined; })` | `undefined` | | `_open` | `_open` | Opens/expands the element when truthy, closes/collapses when falsy. | `boolean \| undefined` | `undefined` | ## Methods ### `close() => Promise<void>` Closes the drawer. #### Returns Type: `Promise<void>` ### `open() => Promise<void>` <span class="text-red-500">**[DEPRECATED]**</span> Use show() or showModal() instead.<br/><br/>Opens the drawer. #### Returns Type: `Promise<void>` ### `show(modal?: boolean) => Promise<void>` Opens the drawer. Pass true to open as a modal drawer. #### Parameters | Name | Type | Description | | ------- | --------- | ----------- | | `modal` | `boolean` | | #### Returns Type: `Promise<void>` ### `showModal() => Promise<void>` Opens the drawer as a modal. #### Returns Type: `Promise<void>` ## Slots | Slot | Description | | ---- | ---------------------- | | | The Content of drawer. | ----------------------------------------------