[UTable] Table is being vertically scrollable when using USelectMenu inside cell

SedanaYoga commented 3 months ago

Environment

Operating System: Linux
Node Version: v18.20.3
Nuxt Version: 3.12.4
CLI Version: 3.12.0
Nitro Version: 2.9.7
Package Manager: pnpm@8.15.6
Builder: -
User Config: modules, compatibilityDate
Runtime Modules: @nuxt/ui@2.18.3
Build Modules: -

Version

2.18.3

Reproduction

https://stackblitz.com/edit/nuxt-ui-fsqysa?file=app.vue

Description

I want to attach USelectMenu inside UTable cell, but the table container's width is fixed, so I need to make the table horizontally scrollable. I put overflow-x-scroll class into UTable, it is scrollable but when I click USelectMenu, the table is vertically scrollable as well (I don't want that) and the option popover is being cut off inside the table.

Expected outcome: the table is horizontally scrollable but without cutting the USelectMenu popover.

Can anybody please help me to workaround this? it's been a while for me to investigate whats the issue here. Thanks!

Additional context

Logs

No response

benjamincanac commented 3 months ago

Have you tried setting :popper="{ strategy: 'fixed' }" on the SelectMenu?

SedanaYoga commented 3 months ago

Have you tried setting :popper="{ strategy: 'fixed' }" on the SelectMenu?

Hey @benjamincanac, thanks for the reply, I added the setting you mentioned and it's still not working

nuxt / ui