shadcn.io is an independent project built on shadcn/ui
Installation
Overview
See which auctions are drawing bids, with this trending auctions panel for Vue with Ark UI. It's the trends page of Gavelhill, a fictional auction site, and it ranks eight auctions by how many bids each drew in a window. A period menu switches between the last 24 hours and the last 7 days, and the ranks re-order; Tabs narrow the rows to Illustration, Games or Collectibles, and a name search narrows them further. Each row shows its rank, a small token drawn from a seed, the creator with the word Verified or Unverified, a bar of bids, the current bid, the time left against one fixed date and how the rank moved from the window before, written as an arrow, a number and a word. Ranks are among all eight, so filtering never renumbers a row, and No auctions found is the Empty state. Bids and ranks are typed samples, not market data. For auction sites, drops and any page that ranks things by recent activity.
FAQ
What decides the rank?
Bids in the chosen window, most first. Each auction carries a typed count for the last 24 hours and for the last 7 days, and the ranking sorts on the one you picked, so an auction can climb on the weekly view and fall on the daily one. Ties keep their typed order.
How is the rank change worked out?
Each auction also has its typed rank in the window before. The change is that rank minus the current one, written as Up 2, Down 1 or Same; an auction that was not listed before reads New. The arrow, the number and the word all say it, so it never depends on color.
Do filters change the ranks?
No. Tabs and the name search only hide rows; the numbers stay the ranks among all eight, and the polite status line says how many rows show. The list sits in a region of fixed height, so filtering never moves the page.
What stays local, and how do I wire it?
All of it. The auctions, bid counts, ranks and end times are typed constants. In your app count bids per window on your server, store each window's ranking so you can show the move, and take the end time from the auction contract.
