shadcn.io is an independent project built on shadcn/ui
Installation
Overview
Show who is selling the most right now, with this creators leaderboard for Solid with Ark UI. It's the creator directory of Palettelist, an NFT showcase, and every figure is a typed sample, not market data. A Toggle Group at the header's end switches the period between 24 h, 7 d and 30 d, and the eight creators re-rank by the volume they sold in that period. Each row has the rank, an initials Avatar, the name with a role and the sales count, three greyscale sigils of their latest work (each creator draws in one of three families, so no two neighbours look alike), the volume in ETH with a signed move written as a sign, an arrow and a word, and a Toggle that follows the creator beside a quiet See collection Button. The header sentence is derived from the data: the top creator and their share of the volume shown. For marketplaces, collector apps and any page that ranks makers.
FAQ
How do I fill it with my creators?
Edit CREATORS. Each has a name, initials, a role, a sigil family and the seeds of three latest works, and three-item arrays for volume (in tenths of an ETH), the change (in tenths of a percent) and the sales count, in the order 24 h, 7 d, 30 d. The ranking, the ranks and the top share are computed from those arrays, so nothing else needs editing. In your app replace the sigils with each work's image and the arrays with your indexer's volumes per period.
How is the ranking worked out?
Creators sort by the volume of the chosen period, biggest first, and ties fall back to the name so the order never flips. The top creator's share is their volume divided by the total of the eight, rounded to a whole percent, and the sentence says "of the volume shown" because it only counts the creators in the list.
What stays local, and how do I wire it?
All of it. Follow keeps a list in the tab and says so in the status line; See collection only announces that nothing opens here. In your app send the follow to your server, make See collection a link to the creator's page, and load the volumes from your own sales data. The sigils are drawn from numbers, with no images, no wallet and no chain call.
How is the move shown?
As a sign, an arrow and a word for screen readers, never a color: a plus and an up arrow with "up", a true minus and a down arrow with "down", and a dash with "unchanged" for zero. Figures are set in tabular digits so the columns line up as the period changes.
Is it accessible from the keyboard?
Yes. The period group is one tab stop with arrow keys between 24 h, 7 d and 30 d, each Follow toggle names the creator ("Follow Orsolya Venn") and reports pressed or not, and the list is named. One polite status message says what changed after each period or follow. In the Ark group the arrow keys do not flip in right-to-left pages.
