Datos
Pro
Rejilla de actividad
Rejilla de actividad de 52 semanas que se llena día por día con una escala de color; el cursor muestra la fecha y la cifra de cada día.
- Plan
- Pro · licencia comercial
- Dependencias
- Solo React
- Props
- 7 (6 ajustables)
1,253 aportes en el último año
octnovdicenefebmarabrmayjunjulagoseplunmiévie
Instalación
1. Configura el registro Pro una sola vez
Los componentes Pro no están en npm ni en el registro público de shadcn: se instalan con tu licencia desde el registro privado de Furin.
Usar mi licencia2. Instala Rejilla de actividad
npx shadcn@latest add @furin-pro/contribution-gridProps
| Prop | Tipo | Por defecto | Descripción |
|---|---|---|---|
| data | number[] | "actividad de ejemplo" | Aportes por día, 7 por semana empezando en domingo (si no pasas ninguno se usa un ejemplo). |
| weeks | number | 52 | Cuántas semanas muestra la rejilla. |
| endDate | string | "2026-09-30" | Fecha del último día, en formato AAAA-MM-DD. |
| color | string | "#4ade80" | Color del nivel más intenso de la escala. |
| labels | boolean | true | Muestra las etiquetas de mes y de día y la leyenda. |
| duration | number | 2.6 | Segundos que tarda en llenarse la rejilla. |
| replayEvery | number | 0 | Segundos entre rellenados (0 la deja quieta). |
Sigue explorando
Anillo de progreso con degradado, punta luminosa que lo encabeza y un número que cuenta; con un clic se llena de nuevo.
Datos
Barras que compiten ronda tras ronda: crecen con resorte y las filas se reordenan cuando alguien rebasa a otro.
Datos