fix(Modal/Popover/Slideover)!: rename prevent-close to dismissible + uniformize docs

This commit is contained in:
Benjamin Canac
2024-12-16 13:11:10 +01:00
parent fdaff6630f
commit 6fb426fc17
10 changed files with 148 additions and 73 deletions

View File

@@ -252,35 +252,6 @@ slots:
:placeholder{class="h-full"}
::
### Prevent close
Use the `prevent-close` prop to prevent the Slideover from being closed when clicking outside of it.
::component-code
---
prettier: true
ignore:
- title
- preventClose
props:
preventClose: true
title: 'Slideover prevent close'
slots:
default: |
<UButton label="Open" color="neutral" variant="subtle" />
body: |
<Placeholder class="h-full" />
---
:u-button{label="Open" color="neutral" variant="subtle"}
#body
:placeholder{class="h-full"}
::
## Examples
### Control open state
@@ -301,6 +272,35 @@ In this example, leveraging [`defineShortcuts`](/composables/define-shortcuts),
This allows you to move the trigger outside of the Slideover or remove it entirely.
::
### Prevent closing
Set the `dismissible` prop to `false` to prevent the Slideover from being closed when clicking outside of it or pressing escape.
::component-code
---
prettier: true
ignore:
- title
- dismissible
props:
dismissible: false
title: 'Slideover non-dismissible'
slots:
default: |
<UButton label="Open" color="neutral" variant="subtle" />
body: |
<Placeholder class="h-full" />
---
:u-button{label="Open" color="neutral" variant="subtle"}
#body
:placeholder{class="h-full"}
::
### Programmatic usage
You can use the [`useSlideover`](/composables/use-slideover) composable to open a Slideover programatically.