Product List

Table component for displaying music products with search functionality.

Installation

Install this component via the shadcn CLI.

npx shadcn@latest add https://baby-baltazar-xi.vercel.app/r/product-list.json

Or install the theme first: npx shadcn@latest add https://baby-baltazar-xi.vercel.app/r/sthlm-theme.json

Preview

Interactive component demo.

Top Products

NO
TITLE
ARTIST
RELEASE DATE
MUSICAL DETAILS
VERSIONS
EARNINGS
01
Oceans
Barfalk Featuring Honey Belle Pears-
7
4
$15,5562.04% ^

Usage

How to use this component in your code.

<ProductList
  title="Top Products"
  searchPlaceholder="SEARCH PRODUCTS..."
  onSearchChange={(value) => console.log(value)}
>
  <TableBody>
    {/* ProductCard components */}
  </TableBody>
</ProductList>