Hey all,
Been building a birthdate field for a signup form and hit the usual wall: Bubble’s date picker opens a calendar grid, which is fine on desktop but feels wrong on mobile if you’re picking something like a birthdate — you end up clicking “previous month” forty times to get from today back to 1996.
What I actually wanted was the wheel picker — the one iOS has used forever, where you just scroll day, month, year like a slot machine. Couldn’t find one for Bubble that wasn’t either a paid third-party library wrapper or broken on mobile, so I built it myself. Same engine as the time picker I made a couple weeks back (thanks to everyone who tried that one, by the way — helped a lot working out the scroll/snap kinks).
The annoying part turned out to be the day column. Scroll from January to February on a leap year and suddenly there’s a 29th, scroll to April and the 31st has to go. Getting that to update without the whole picker jumping around or losing your place in the other columns took longer than I expected. Also apparently 1900 wasn’t a leap year but 2000 was, which I did not have memorized and had to look up like everyone else.
What it does:
- Three columns, day/month/year, native momentum scroll (no JS library faking the physics)
- Handles leap years properly, including the century rule
- Month names can be short, long, or numeric, and they’re pulled from the browser’s own locale — not a hardcoded English array
- Day/month order is a toggle, so it works for both “March 5” and “5 March” people
- Transparent by default so it drops into whatever popup or group you’re already using
Demo: https://apple-date-picker.bubbleapps.io/version-test
Marketplace: https://bubble.io/plugin/apple-date-picker-1789050549408x885664422971048000
If anyone’s tried building something similar and hit a different snag than the leap year thing, curious what it was — feels like the kind of component where everyone finds a different edge case first.