How ice450028456/react-heat-map works
This repository is a React calendar heatmap component: callers supply date/count values and display options, and it renders an SVG calendar with day cells, weekday/month labels, and an optional color legend. The website demonstrates the component and embeds runnable README examples. Edges reflect calls and imports visible in the excerpts or README; the styling file and other unsampled implementation details are represented only where their paths are evident.
Main entry points: SVG.tsx Calendar SVG · App.tsx Documentation app · index.tsx HeatMap API · LabelsMonth.tsx Month labels
Components 15
Heatmap API
- HeatMap API
src/index.tsx - Component styles
src/style/index.less
SVG Rendering
- Calendar SVG
src/SVG.tsx - Date data utilities
src/utils.ts - Day rectangles
src/Rect.tsx - Week labels
src/LabelsWeek.tsx - Month labels
src/LabelsMonth.tsx - Color legend
src/Legend.tsx
Demo Website
- Website entry
website/index.tsx - Documentation app
website/App.tsx - Interactive demo
website/Example.tsx - Code examples
website/Code.tsx - Usage documentation
README.md
Other components
- Component caller
- Example hosting
Connections 17
- Component caller → HeatMap API: provides values
README.md - HeatMap API → Calendar SVG: renders
src/index.tsx - HeatMap API → Component styles: loads styles
src/index.tsx - Calendar SVG → Date data utilities: formats dates
src/SVG.tsx - Calendar SVG → Day rectangles: renders cells
src/SVG.tsx - Calendar SVG → Week labels: renders labels
src/SVG.tsx - Calendar SVG → Month labels: renders labels
src/SVG.tsx - Calendar SVG → Color legend: renders legend
src/SVG.tsx - Month labels → Date data utilities: uses day length
src/LabelsMonth.tsx - Color legend → Day rectangles: renders rectangles
src/Legend.tsx - Website entry → Documentation app: mounts
website/index.tsx - Documentation app → Interactive demo: renders demo
website/App.tsx - Documentation app → HeatMap API: supplies component
website/App.tsx - Documentation app → Usage documentation: renders markdown
website/App.tsx - Documentation app → Code examples: renders previews
website/App.tsx - Code examples → Example hosting: exports examples
website/Code.tsx - Interactive demo → HeatMap API: configures
website/Example.tsx