Open gsabater opened 9 months ago
Hi there,
Is there any way we can invoke the sheet externally?
you can open it just like you'd open a radix-vue Dialog externally using the open
prop (and the corresponding @update:open
event)
e. g.
<script setup>
import { DialogRoot, DialogTrigger, DialogPortal, DialogOverlay, DialogContent } from 'aioli';
const modalOpen = ref(false)
</script>
<template>
<input type="checkbox" v-model="modalOpen" />
<DialogRoot v-model:open="modalOpen">
<DialogPortal>
<DialogContent>
Content
</DialogContent>
<DialogOverlay />
</DialogPortal>
</DialogRoot>
</template>
Having events to interact with it would be cool as well.
Is there anything specific you're missing? Would be happy to add some if applicable :)
The example is very useful, I will try again and see how it works.
What I found as well is that if the site don't have tailwind already, the vaul don't have any default styles to work.
I feel that the previous example and the tailwind requeriment should be on the readme.
Thanks for your amazing work
The drawer is supposed to be unstyled. Tailwind is just what I happen to be using. You should be able to achive the same with regular CSS. I plan on adding some more documentation on it some time tough.
Hello,
Is there any way we can invoke the sheet externally? For example, it would be useful to have without trigger, and call something like
this.$refs.vaul.open()
Having events to interact with it would be cool as well.
Thanks