arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-02-02 05:08:03 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(useOverlay)!: handle programmatic modals and slideovers (#3279)

Browse Source 
Co-authored-by: Benjamin Canac <canacb1@gmail.com>
This commit is contained in:
Eugen Istoc
2025-02-27 11:32:48 -05:00
committed by GitHub
parent 607d9a7b4e
commit 108d36fd8a
27 changed files with 422 additions and 497 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
playground/app/pages/components/modal.vue
View File

@@ -5,16 +5,18 @@ const LazyModalExample = defineAsyncComponent(() => import('../../components/Mod
const open = ref(false)
const count = ref(0)
const overlay = useOverlay()
const modal = useModal()
const modal = overlay.create(LazyModalExample, {
props: {
count: count.value
}
})
function openModal() {
count.value++
modal.open(LazyModalExample, {
description: 'And you can even provide a description!',
count: count.value
})
modal.open({ count: count.value })
}
</script>

12
playground/app/pages/components/slideover.vue
View File

@@ -5,16 +5,18 @@ const LazySlideoverExample = defineAsyncComponent(() => import('../../components
const open = ref(false)
const count = ref(0)
const overlay = useOverlay()
const slideover = useSlideover()
const slideover = overlay.create(LazySlideoverExample, {
props: {
count: count.value
}
})
function openSlideover() {
count.value++
slideover.open(LazySlideoverExample, {
title: 'Slideover',
count: count.value
})
slideover.open({ count: count.value })
}
</script>