You can check it out here: https://loopem.tahazsh.com/
This idea had been lingering in my head for a long time. I kept thinking about the best way to turn the idea of a picker into a math problem, where I could describe the layout I want and it would just work.
By pickers, I mean something like what `<select>` does in HTML, but with more visual items, whether they are images, icons, colors, or anything that would enhance the user experience.
For example, say you have an e-commerce app that shows different color options for a product. Instead of listing blue, red, and so on, you can show the actual colors, and users can drag or flick through them.
To prove it works, and to give you usable options out of the box, I added built-in layouts: line, arc, wheel, cover flow, fan, and stack.
I also made sure it stays smooth with any number of items. It's still fast because I virtualized the list, so it only renders what's on screen.
Accessibility is on by default too. Arrow keys, Home and End, listbox roles, screen reader support. It also claims one gesture axis, so a horizontal picker never eats your vertical page scroll on mobile.
I know docs matter a lot for dev tools, so I spent a good amount of time making them clean and easy to follow. Every option has a live picker you can drag while you read about it.
It's MIT, has no dependencies, and works with React, Vue, Svelte, or no framework at all.
I'd love feedback! Thanks!