konstaui / konsta

Mobile UI components made with Tailwind CSS
https://konstaui.com
MIT License
3.55k stars 131 forks source link

Swipe between tabbar / subnav pages #101

Open SaadBazaz opened 1 year ago

SaadBazaz commented 1 year ago

Clear and concise description of the problem

I see two ways to have tabs or subnavs in Konsta.

Tab Bar: https://konstaui.com/react/tabbar

"Subnav" in Navbar: https://konstaui.com/react/navbar

However, as is in many native mobile apps, there's no way to "swipe" between the pages. And by that, I mean being able to drag-and-hold and see other pages. Kind of like this:

https://user-images.githubusercontent.com/51885228/205270960-a0380463-f1b1-4dd7-993d-5cc59c749459.mp4

Suggested solution

In Navbar Component, we could have a "slideBetweenTabs" animation prop. It by either having a PageComponents prop, or by wrapping Navbar itself.

Alternative

Having to resort to other libraries to achieve this, but not very pleasant to look at.

Additional context

What it looks like right now. https://user-images.githubusercontent.com/51885228/205270756-0eff1166-eeb7-4556-8423-fd881a6f5a00.mov

Validations

Would you like to open a PR for this feature?