diff --git a/docs/components/Playground.vue b/docs/components/Playground.vue
index 91413b4f..a7fc5c1c 100644
--- a/docs/components/Playground.vue
+++ b/docs/components/Playground.vue
@@ -1,21 +1,9 @@
-
-
-
-
-
+
+ Button
+
diff --git a/packages/anu-vue/src/components/menu/AMenu.vue b/packages/anu-vue/src/components/menu/AMenu.vue
index 6ee9c188..a58b12cb 100644
--- a/packages/anu-vue/src/components/menu/AMenu.vue
+++ b/packages/anu-vue/src/components/menu/AMenu.vue
@@ -3,7 +3,7 @@ import type { Middleware, Placement, Strategy } from '@floating-ui/dom'
import { autoUpdate, computePosition, flip, shift } from '@floating-ui/dom'
import { onClickOutside, useEventListener, useMounted } from '@vueuse/core'
import type { PropType } from 'vue'
-import { Teleport, Transition, getCurrentInstance, nextTick, onBeforeUnmount, onMounted, ref, watch } from 'vue'
+import { getCurrentInstance, nextTick, onBeforeUnmount, onMounted, ref, watch } from 'vue'
import { sameWidth as sameWidthMiddleware } from './middlewares'
import { useTeleport } from '@/composables/useTeleport'
import { useInternalBooleanState } from '@/composables/useInternalBooleanState'
@@ -101,20 +101,20 @@ const calculateFloatingPosition = async () => {
// ℹ️ For this we need need bridge to handle keep menu content open
// offset(6),
- sameWidthMiddleware(refFloating.value.$el),
+ sameWidthMiddleware(refFloating.value),
flip(),
shift({ padding: 10 }),
] as Middleware[]
- : props.middleware(refReference.value, refFloating.value.$el)
+ : props.middleware(refReference.value, refFloating.value)
// Calculate position of floating element
- const { x, y } = await computePosition(refReference.value, refFloating.value.$el, {
+ const { x, y } = await computePosition(refReference.value, refFloating.value, {
strategy: props.strategy,
placement: props.placement,
middleware: _middleware,
})
- Object.assign(refFloating.value.$el.style, {
+ Object.assign(refFloating.value.style, {
left: `${x}px`,
top: `${y}px`,
})
@@ -124,7 +124,8 @@ let floatingUiCleanup: Function
onMounted(() => {
const vm = getCurrentInstance()
- refReference.value = vm?.proxy?.$el?.parentNode
+ if (vm?.proxy?.$parent)
+ refReference.value = vm?.proxy?.$parent.$el
})
// Recalculate position if placement changes at runtime
@@ -132,7 +133,7 @@ watch(
[isMounted, () => props.placement],
() => {
nextTick(() => {
- floatingUiCleanup = autoUpdate(refReference.value, refFloating.value.$el, calculateFloatingPosition)
+ floatingUiCleanup = autoUpdate(refReference.value, refFloating.value, calculateFloatingPosition)
})
},
)
@@ -192,18 +193,16 @@ if (props.modelValue === undefined) {
>
-
+
+
+
+
-
-