"blocking" interferes with primevue select dropdowns

[hamsterbacke23]

The default blocking option prevents selecting an item in a primevue select dropdown on touch devices.

The issue is likely that the select options are not kept in the bottomsheet DOM, but teleported outside. That could be a general issue.

What would be nice is a backdrop-only option or something which solves this problem better.

[Opekunov]

same issue

[biroplane]

As i noticed it should be a Teleports "fault". happens the same with nuxt ui. i've also created a component from scratch that, when using teleport will have same issue.
is there a way to avoid the teleport?

[megaarmos]

This may not be a teleport issue; I suspect adjusting the z-index could solve it. A minimal reproduction example would be helpful.

[Opekunov]

I solved the problem this way: I disabled props blocking, and wrapped the bottom sheet in my overlay BottomSheetOverlay. I made a teleport-to-ref(BottomSheetOverlay) in the bottom sheet. It's working fine now. In my opinion, the problem is that blocking is intercepting events outside the container.

[Opekunov]

This may not be a teleport issue; I suspect adjusting the z-index could solve it. A minimal reproduction example would be helpful.

Try PrimeVue. Component Datepicker or Multiselect.

[biroplane]

@megaarmos i've tryied adding a USelect component (from nuxtui) both with your component and and with a super basic componet made from scratch. adding it though a teleport confirms the issue. maybe is just a coincidence.