fix: pass modal bindings to teleport target
continuous-integration/drone/pr Build is failing Details

This commit is contained in:
Dominik Pschenitschni 2022-07-09 21:01:09 +02:00
parent 990639dd24
commit a413b87199
Signed by: dpschen
GPG Key ID: B257AC0149F43A77
1 changed files with 14 additions and 4 deletions

View File

@ -6,10 +6,11 @@
v-if="enabled"
class="modal-mask"
:class="[
{ 'has-overflow': overflow },
variant,
]"
{ 'has-overflow': overflow },
variant,
]"
ref="modal"
v-bind="attrs"
>
<div
class="modal-container"
@ -62,11 +63,18 @@
</Teleport>
</template>
<script lang="ts">
export default {
inheritAttrs: false,
}
</script>
<script lang="ts" setup>
import BaseButton from '@/components/base/BaseButton.vue'
import {onUnmounted, ref, watch} from 'vue'
import {onUnmounted, ref, useAttrs, watch} from 'vue'
import {useScrollLock} from '@vueuse/core'
const props = withDefaults(defineProps<{
enabled?: boolean,
overflow?: boolean,
@ -81,6 +89,8 @@ const props = withDefaults(defineProps<{
defineEmits(['close', 'submit'])
const attrs = useAttrs();
const modal = ref<HTMLElement | null>(null)
const scrollLock = useScrollLock(modal)