feat(Slideover): open programmatically (#1465)

Co-authored-by: Benjamin Canac <canacb1@gmail.com>
This commit is contained in:
Eugen Istoc
2024-03-21 12:48:35 -04:00
committed by GitHub
parent b0ecac563c
commit e7697595c8
10 changed files with 173 additions and 1 deletions

View File

@@ -33,7 +33,7 @@ Set the `transition` prop to `false` to disable it.
### Prevent close
Use the `prevent-close` prop to disable the outside click alongside the `esc` keyboard shortcut. A `close-prevented` event will be emitted when the user tries to close the modal.
Use the `prevent-close` prop to disable the outside click alongside the `esc` keyboard shortcut. A `close-prevented` event will be emitted when the user tries to close the slideover.
:component-example{component="slideover-example-prevent-close"}
@@ -53,6 +53,24 @@ defineShortcuts({
</script>
```
### Control programmatically
First of all, add the `USlideovers` component to your app, preferably inside `app.vue`.
```vue [app.vue]
<template>
<div>
<UContainer>
<NuxtPage />
</UContainer>
<USlideovers />
</div>
</template>
```
Then, you can use the `useSlideover` composable to control your slideovers within your app.
:component-example{component="slideover-example-composable"}
## Props
:component-props