React components
Product activity
A GitHub-style contribution heatmap visualization.
Overview
The ProductActivity component generates a randomized heatmap grid (like GitHub contributions) to visualize user activity density over time.
Usage
import { ProductActivity } from '@/components/core/features/product-activity';
function UserStats() {
return <ProductActivity count={30} />;
}Props
| Prop | Type | Default | Description |
|---|---|---|---|
seed? | number | 320 | Seed for the random position generator to ensure consistency. |
count? | number | 24 | Number of active (filled) cells to generate. |
cols? | number | 15 | Number of columns in the grid. |
rows? | number | 4 | Number of rows in the grid. |
className? | string | - | Optional CSS class names. |