emilkowalski / vaul

An unstyled drawer component for React.
https://vaul.emilkowal.ski
MIT License
6k stars 201 forks source link

Drawer breaks iOS Safari native date picker: causes Safari to crash #286

Open pingustar opened 7 months ago

pingustar commented 7 months ago

When using <input type="date" /> inside the Drawer I have discovered two issues:

  1. placement of the date picker is incorrect, the date picker appears at the top of the screen and not above/below the actual input element
  2. when using two input elements with type date, Safari will crash when tapping the other input field while the date picker is open

Link to test on your iPhone: https://7jy222-3000.csb.app/

Reproduction Sandbox: https://codesandbox.io/p/devbox/drawer-without-scale-forked-7jy222

In the video you can see how it works correctly in page.tsx and then in the drawer the placement is at the top of the screen and at the end Safari crashes when clicking in the other input element while the date picker is open:

https://github.com/emilkowalski/vaul/assets/7262066/c77ff883-acf4-4c56-bb3d-6544215b5bcb