chore: set popper options in preset (#97)

Co-authored-by: Benjamin Canac <canacb1@gmail.com>
This commit is contained in:
Baptiste Leproux
2022-10-18 11:13:28 +02:00
committed by GitHub
parent c89c65bd44
commit 5039265097
7 changed files with 36 additions and 18 deletions

View File

@@ -48,7 +48,7 @@ import Avatar from '../elements/Avatar.vue'
import { classNames } from '../../utils'
import { usePopper } from '../../composables/usePopper'
import type { Avatar as AvatarType } from '../../types/avatar'
import type { PopperOptions } from './../types'
import type { PopperOptions } from '../../types'
import $ui from '#build/ui'
const props = defineProps({
@@ -132,9 +132,9 @@ const props = defineProps({
}
})
const popperOptions = computed(() => defu({}, props.popperOptions, { placement: 'bottom-end', strategy: 'fixed' }))
const popperOptions = computed(() => defu({}, props.popperOptions, $ui.dropdown.popperOptions))
const [trigger, container] = usePopper(popperOptions.value)
const [trigger, container] = usePopper(popperOptions.value as PopperOptions)
function resolveItemClass ({ active, disabled }: { active: boolean, disabled: boolean }) {
return classNames(

View File

@@ -97,7 +97,7 @@ import {
import Icon from '../elements/Icon.vue'
import { classNames } from '../../utils'
import { usePopper } from '../../composables/usePopper'
import type { PopperOptions } from './../types'
import type { PopperOptions } from '../../types'
import $ui from '#build/ui'
const props = defineProps({
@@ -263,9 +263,9 @@ const props = defineProps({
const emit = defineEmits(['update:modelValue'])
const popperOptions = computed(() => defu({}, props.popperOptions, { placement: 'bottom-end' }))
const popperOptions = computed(() => defu({}, props.popperOptions, $ui.selectCustom.popperOptions))
const [trigger, container] = usePopper(popperOptions.value)
const [trigger, container] = usePopper(popperOptions.value as PopperOptions)
const query = ref('')
const searchInput = ref<ComponentPublicInstance<HTMLElement>>()

View File

@@ -12,7 +12,7 @@
import { PropType, computed, toRef } from 'vue'
import { defu } from 'defu'
import { usePopper } from '../../composables/usePopper'
import type { PopperOptions } from './../types'
import type { PopperOptions } from '../../types'
import $ui from '#build/ui'
const props = defineProps({
@@ -63,9 +63,9 @@ const isOpen = computed({
const virtualElement = toRef(props, 'virtualElement')
const popperOptions = computed(() => defu({}, props.popperOptions, { placement: 'bottom-start', scroll: false }))
const popperOptions = computed(() => defu({}, props.popperOptions, $ui.contextMenu.popperOptions))
const [, container] = usePopper(popperOptions.value, virtualElement)
const [, container] = usePopper(popperOptions.value as PopperOptions, virtualElement)
</script>
<script lang="ts">

View File

@@ -18,11 +18,11 @@
<script setup lang="ts">
import type { Ref, PropType } from 'vue'
import { ref, computed, onMounted } from 'vue'
import { computed, ref, onMounted } from 'vue'
import { defu } from 'defu'
import { Popover, PopoverButton, PopoverPanel } from '@headlessui/vue'
import { usePopper } from '../../composables/usePopper'
import type { PopperOptions } from './../types'
import type { PopperOptions } from '../../types'
import $ui from '#build/ui'
const props = defineProps({
@@ -59,9 +59,9 @@ const props = defineProps({
}
})
const popperOptions = computed(() => defu({}, props.popperOptions, { strategy: 'fixed' }))
const popperOptions = computed(() => defu({}, props.popperOptions, $ui.popover.popperOptions))
const [trigger, container] = usePopper(popperOptions.value)
const [trigger, container] = usePopper(popperOptions.value as PopperOptions)
const popoverApi: Ref<any> = ref(null)

View File

@@ -18,10 +18,10 @@
<script setup lang="ts">
import type { PropType } from 'vue'
import { ref, computed } from 'vue'
import { computed, ref } from 'vue'
import { defu } from 'defu'
import { usePopper } from '../../composables/usePopper'
import type { PopperOptions } from './../types'
import type { PopperOptions } from '../../types'
import $ui from '#build/ui'
const props = defineProps({
@@ -55,9 +55,10 @@ const props = defineProps({
}
})
const popperOptions = computed(() => defu({}, props.popperOptions, { strategy: 'fixed' }))
const popperOptions = computed(() => defu({}, props.popperOptions, $ui.tooltip.popperOptions))
const [trigger, container] = usePopper(popperOptions.value as PopperOptions)
const [trigger, container] = usePopper(popperOptions.value)
const open = ref(false)
</script>