Most swipe interfaces move along one axis. But what if each vertical section also contains its own horizontal collection?

Think of a portfolio with projects arranged by category, a fullscreen catalog, or a gallery where each row tells a different story.

I’m building TikiTaki , an open-source TypeScript library for this kind of navigation: swipe vertically between rows and horizontally between items.

The core has zero runtime dependencies , with separate adapters for React, Vue, Svelte, and Angular.

Try the live demo · GitHub · npm

The grid does not have to be rectangular

Rows can contain different numbers of items:

const grid = [[ ' A1 ' , ' A2 ' , ' A3 ' ], [ ' B1 ' ], [ ' C1 ' , ' C2 ' ]];

Enter fullscreen mode

Exit fullscreen mode

The navigation rules are deliberately predictable:

Swipe left or right to move within the current row.

Swipe up or down to change rows.

A successful vertical transition always opens the first item.

An unavailable transition preserves the entire current…