Category Grid

import { CategoryGrid } from '@/app/registry/ui/components/category-grid/category-grid';

import { CategoryGrid } from '@/app/registry/ui/components/category-grid/category-grid';
 
const products = [
  {
    id: '1',
    image: { src: '/path/to/image.jpg', alt: 'Product name' },
    title: 'Product Name',
    href: '/products/product-name', // Required for CategoryGrid
    price: { current: '29.99', old: '39.99' },
    rating: { average: 4.5, count: 123 }, // Optional, per product
    badge: { label: 'Sale', variant: 'sale' }, // Optional, per product
    variant: 'default', // Optional, per product
  },
  // ... more products
];
 
export function CategoryGridExample() {
  return (
    <CategoryGrid
      products={products}
      title="Shop by Category"
      subtitle="Discover our curated collection"
    />
  );
}