[bug]: Text selection handles on iOS are not responsive for Input components in Dialog

[olsavmic]

Describe the bug

When Text Input is used in modal Dialog, it is impossible to drag the text selection handles (left & right side, to extend / shorten the selection) on iOS.

The bug can be tested on the examples on https://ui.shadcn.com/docs/components/dialog - the "Custom close button" example contains a Share Link input where it's possible to select text by double tapping the word, but the selection cannot be customised by dragging.

I guess it has something to do with the pointer-events that dialog manipulates with, z-index of the overlay and fixed dialog positioning, but I'm unfortunately not skilled enough FE dev to find out.

Affected component/components

Dialog

How to reproduce

1. Go to https://ui.shadcn.com/docs/components/dialog
2. Open the "Custom close button" example
3. Select text by double tapping the word,
4. Try to change selection range by dragging the handles -the selection is irresponsive

Codesandbox/StackBlitz link

No response

Logs

No response

System Info

iOS 18.1

Before submitting

• I've made research efforts and searched the documentation
• I've searched for existing issues

[stas-kh]

Facing the same issue, could you guys take a look at it, please?

[wolf-joe]

Same issue, suffering.

[ishan0102]

Same issue

[f3ndot]

I found that if I stopped using the <Dialog.Overlay /> component within the annatomy, selection handles started working again! Furthermore: If I replaced that component with a simple <div> with the className styling that I want, I am able to get around this issue.

[f3ndot]

Someone also reported this bug in the actual primitives library repo: radix-ui/primitives#3331 and radix-ui/primitives#2492