Skip to content

API Reference

Catalog metadata for this block. Install copies the source into your project.

npx cronus-ui add product-grid
Skip Product Grid fields table
FieldTypeDefaultDescription
slug*
string"product-grid"Registry item id. Passed to cronus-ui add.
name*
string"Product Grid"Display name shown in the gallery.
description*
string"A digital-products storefront grid of product cards with prices and buy buttons, an empty catalog, a filter sidebar, or an editorial showcase."Short summary of what the block covers.
variants
{ id: string; name: string; description: string }[]["classic", "empty", "with-filters", "showcase"]Alternate layouts. Install a look with npx cronus-ui add <slug>--<id>. Omitted when the block has a single default.

Variants

Every published look for this block.

Skip Product Grid variants table
IdNameDescription
classicStorefront gridThree-column storefront grid with product art, pricing, and buy actions.
emptyEmptyThe same storefront grid with no listings yet.
with-filtersWith filtersCatalog layout with category, price, and color filters beside a sortable product grid.
showcaseEditorial showcaseHero product feature with an asymmetric grid and overlay shop actions.