Blocks
v1.0.0Added in 1.0.0
The Northwind Market home: a search for what and where, category tiles, a promoted rail, new listings near you, trust points and an app band.
Type what you look for in the hero search, pick the place in the location field (it filters the towns of lib/ro-locations, accents optional, and offers All locations) and press Enter or Search: onSearch gets the text and the city id, by default the page navigates to /search?q=…&loc=…. Below 768px the two fields and the button stack and the location opens a full height sheet. The popular searches under it are links (a sideways scroll on phones). The category tiles are links to /search?cat=…; arrow keys move between them, phones show the first nine and All categories below. Promoted listings is a swipeable rail (1.3 cards on a phone, 4 on a laptop) with arrow buttons in its header on fine pointers and arrow keys when it has focus; the Promoted badge opens an explanation (a popover, a bottom sheet on phones). New listings in Cluj-Napoca: the city chip opens a searchable list of places (a sheet on phones) and the grid shows the newest listings there; a city with nothing yet shows No listings in Sibiu yet with Search every location. Hearts save a listing at once, in the rail and in the grid together; a rejected onFavoriteChange rolls the heart back. See all listings opens the results. The trust tiles and the app band (bullets, App Store and Google Play buttons, a QR code to scan on desktop) close the page. Sections rise in once when the page mounts on the client; reduced motion skips it.
npx wingo-ui@latest add marketplace-home-pagePro item: the CLI needs a Pro account. See plans