cant use u-avatar as triggers for u-popover

[Lionad-Morotar]

Environment

• Operating System: Darwin
• Node Version: v22.14.0
• Nuxt Version: 3.16.1
• CLI Version: 3.23.1
• Nitro Version: 2.11.7
• Package Manager: [email protected]
• Builder: -
• User Config: modules, devtools, css, routeRules, future, compatibilityDate, eslint
• Runtime Modules: @nuxt/[email protected], @nuxt/[email protected], @vueuse/[email protected]
• Build Modules: -

Is this bug related to Nuxt or Vue?

Nuxt

Version

v3

Reproduction

https://codesandbox.io/p/devbox/silent-currying-qhjsy6

Description

• 当 Avatar 有图片内容时可以作为 UPopover 的 Trigger 被触发
• 当 Avatar 展示子插槽内容，不能成功触发 UPopover

Additional context

No response

Logs

[Lionad-Morotar]

btw，如果不想等待或使用 patch 等其他方式更新依赖的开发者，可以使用组件手动管理继承的 attrs 属性来解决这个问题：

<template>
  <u-popover mode="hover" :class="ns.e('popover')">
    <p-inherit-attrs>
      <u-avatar>
        <p-slot>
          <p-icon :name="safeIcon(value)" />
        </p-slot>
      </u-avatar>
    </p-inherit-attrs>
    <template #content>
      content
    </template>
  </u-popover>
</template>

import { Fragment } from 'vue'
import { createContext } from 'reka-ui'

type InheritAttrsProps = null | Record<string, unknown>

export const [injectContext, provideContext]
  = createContext<InheritAttrsProps>('PInheritAttrs')

export default defineComponent({
  name: 'PInheritAttrs',
  inheritAttrs: false,
  setup(_, { attrs, slots }) {
    provideContext(attrs)

    return () => h(Fragment, {}, [slots.default?.()])
  },
})

import { injectContext } from "../p-inherit-attrs"
import { Slot } from 'reka-ui'

export default defineComponent({
  name: 'PSlot',
  inheritAttrs: false,
  setup(_, { attrs, slots }) {
    const inheritAttrs = injectContext(null)

    return () => h(Slot, inheritAttrs, slots)
  },
})