shadcn.io is not affiliated with official shadcn/ui
Git Commit Activity Monitoring Block for Radix UI
Thirty days of one repository as lines added and removed on a shared scale or as a calendar of commit heat cells, a day cursor and a table of the six hot files with their authors and churn.
Installation
Overview
See how much a repository changed and where, with this activity panel for React with Radix UI. It is Churnwell, a repository activity monitor (made up), watching thirty days of one repository. A Toggle Group switches the stage between two readings of the same days: Lines draws lines added as columns going up and lines removed as columns going down on one shared scale, and Commits draws a calendar of heat cells, five weeks by seven weekdays, each holding its commit count, with the busiest day outlined. A range under the stage is the cursor and reads one day in either view. Under the stage six hot files show their commits, authors and a bar split into added and removed lines. The header is worked out from the data: the net change and the file touched most. Guides draw the frame and its bands; the entrance is CSS only. For engineering leads and anyone asking where the churn is.
FAQ
How do I use my own repository?
Replace the three 30-number series (COMMITS, ADDED, REMOVED) with your own, one entry per day, newest last, and the FILES list with your hot files. In the demo the series are generated from a weekly shape plus two merge days. The net change, the scale, the heat levels and the header are derived. Read the numbers from git log --numstat or your host's API on the server.
Why two views?
Lines shows how big the change was, and Commits shows how often people committed. They disagree on purpose: a merge day can be a few commits and thousands of lines. Both stay in the same cell, so the panel does not change height when you switch.
How does the day cursor work?
It is a native range named Day. It marks the column in Lines and outlines the cell in Commits, shows the day's commits and lines under it, and a polite status line speaks the same sentence about 600 ms after the last change. It starts on the busiest day.
What is real here and what is typed?
Everything is typed and nothing reads a repository. The file paths and counts are examples.