@joewinke/jatui 0.40.0 → 0.41.0

package/dist/components/stats/heatmap.js

@@ -0,0 +1,151 @@
+/**
+ * ActivityHeatmap layout + keyboard math (jatui-6kitr). Pure and DOM-free.
+ *
+ * Days are local calendar dates, keyed "YYYY-MM-DD". The grid is 7 weekday
+ * ROWS × N week COLUMNS (GitHub contributions layout); `weekStart` picks the
+ * top row (0 = Sunday, 1 = Monday).
+ */
+const pad = (n) => String(n).padStart(2, '0');
+/** Local "YYYY-MM-DD". */
+export function isoDay(d) {
+    return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}`;
+}
+/** Parse a day as LOCAL noon (DST-safe arithmetic). "YYYY-MM-DD" is never read as UTC. */
+export function parseDay(input) {
+    if (input instanceof Date)
+        return new Date(input.getFullYear(), input.getMonth(), input.getDate(), 12);
+    const m = /^(\d{4})-(\d{2})-(\d{2})/.exec(input);
+    if (m)
+        return new Date(Number(m[1]), Number(m[2]) - 1, Number(m[3]), 12);
+    const d = new Date(input);
+    return new Date(d.getFullYear(), d.getMonth(), d.getDate(), 12);
+}
+export function addDays(day, n) {
+    const d = parseDay(day);
+    d.setDate(d.getDate() + n);
+    return isoDay(d);
+}
+/** Whole days from a to b (b - a). */
+export function daysBetween(a, b) {
+    return Math.round((parseDay(b).getTime() - parseDay(a).getTime()) / 86_400_000);
+}
+export function defaultLevelOf(count, max, levels) {
+    if (count <= 0 || max <= 0)
+        return 0;
+    return Math.min(levels, Math.max(1, Math.ceil((count / max) * levels)));
+}
+export function buildHeatmap(opts) {
+    const levels = Math.max(1, opts.levels ?? 4);
+    const weekStart = opts.weekStart ?? 0;
+    const levelOf = opts.levelOf ?? defaultLevelOf;
+    const end = isoDay(parseDay(opts.end ?? new Date()));
+    const start = opts.start != null ? isoDay(parseDay(opts.start)) : addDays(addDays(end, 1), -yearLength(end));
+    const counts = new Map();
+    for (const d of opts.data) {
+        const key = isoDay(parseDay(opts.getDate(d)));
+        const c = Number(opts.getCount(d)) || 0;
+        counts.set(key, (counts.get(key) ?? 0) + c);
+    }
+    const span = Math.max(0, daysBetween(start, end)) + 1;
+    const firstRow = (parseDay(start).getDay() - weekStart + 7) % 7;
+    const weeks = Math.ceil((firstRow + span) / 7);
+    const rows = Array.from({ length: 7 }, () => Array(weeks).fill(null));
+    const days = [];
+    let max = 0;
+    let total = 0;
+    let activeDays = 0;
+    const cursor = parseDay(start);
+    for (let i = 0; i < span; i++) {
+        const date = isoDay(cursor);
+        const count = counts.get(date) ?? 0;
+        if (count > max)
+            max = count;
+        total += count;
+        if (count > 0)
+            activeDays++;
+        const slot = firstRow + i;
+        const day = { date, count, level: 0, col: Math.floor(slot / 7), row: slot % 7 };
+        days.push(day);
+        rows[day.row][day.col] = day;
+        cursor.setDate(cursor.getDate() + 1);
+    }
+    for (const d of days)
+        d.level = Math.min(levels, Math.max(0, levelOf(d.count, max, levels)));
+    // Month labels: the first column whose first in-range day falls in a new month.
+    const fmt = new Intl.DateTimeFormat(opts.locale, { month: 'short' });
+    const gap = opts.monthGap ?? 3;
+    const months = [];
+    let lastMonth = -1;
+    let lastCol = -Infinity;
+    for (let col = 0; col < weeks; col++) {
+        let first = null;
+        for (let r = 0; r < 7 && !first; r++)
+            first = rows[r][col];
+        if (!first)
+            continue;
+        const d = parseDay(first.date);
+        if (d.getMonth() !== lastMonth) {
+            lastMonth = d.getMonth();
+            if (col - lastCol >= gap) {
+                months.push({ label: fmt.format(d), col });
+                lastCol = col;
+            }
+        }
+    }
+    return { days, rows, weeks, max, total, activeDays, months, start, end };
+}
+function yearLength(end) {
+    const e = parseDay(end);
+    const back = new Date(e.getFullYear() - 1, e.getMonth(), e.getDate(), 12);
+    return Math.round((e.getTime() - back.getTime()) / 86_400_000);
+}
+/**
+ * Keyboard move inside the heatmap grid. Returns the new focused day,
+ * clamped to [start, end], or null for keys it does not handle.
+ *
+ *   ArrowUp/Down     previous / next day (row)
+ *   ArrowLeft/Right  previous / next week (column)
+ *   PageUp/PageDown  four weeks back / forward
+ *   Home / End       first / last week, same weekday (row start / end)
+ *   mod+Home/End     first / last day in range
+ */
+export function moveHeatFocus(day, key, range, mod = false) {
+    let next;
+    switch (key) {
+        case 'ArrowUp':
+            next = addDays(day, -1);
+            break;
+        case 'ArrowDown':
+            next = addDays(day, 1);
+            break;
+        case 'ArrowLeft':
+            next = addDays(day, -7);
+            break;
+        case 'ArrowRight':
+            next = addDays(day, 7);
+            break;
+        case 'PageUp':
+            next = addDays(day, -28);
+            break;
+        case 'PageDown':
+            next = addDays(day, 28);
+            break;
+        case 'Home':
+            if (mod)
+                return range.start;
+            next = addDays(day, -7 * Math.floor(daysBetween(range.start, day) / 7));
+            break;
+        case 'End':
+            if (mod)
+                return range.end;
+            next = addDays(day, 7 * Math.floor(daysBetween(day, range.end) / 7));
+            break;
+        default:
+            return null;
+    }
+    if (daysBetween(range.start, next) < 0)
+        return range.start;
+    if (daysBetween(next, range.end) < 0)
+        return range.end;
+    return next;
+}