Add a dayTintProvider plugin hook

Lets a plugin colour-code days in the Plan sidebar. trip-segments can
already announce "Kanazawa begins" in the day plan, but it can't make
day 12 look like it belongs to Kanazawa.

dayScheduleProvider can't cover this: it renders a fixed row, and it's
capped at 60 items per provider, so one item per day would tint the
first 60 days of a six-month trip and silently stop. This hook is
bounded by day count instead.

GET /api/day-tints/:tripId returns per-day tones for three regions of a
day card - the number badge (also the mobile day chip), the header row,
and the expanded activity list. `tone` is a shorthand filling every
region a contribution doesn't name; unnamed regions render as they do
today. Tones only, never hex, so the host can pick the alpha per theme
and per region.

One contribution per day, resolved whole: first entry wins within a
provider, first granted provider wins across plugins.
This commit is contained in:
Renzo Beux
2026-07-29 12:05:31 -03:00
committed by Maurice
parent 28ffc814c0
commit c89d2bf3a1
46 changed files with 664 additions and 17 deletions
+17
View File
@@ -529,6 +529,18 @@ input[type="number"], input[type="time"], input[type="date"], input[type="dateti
--accent-hover: #1f2937; /* hover state of an accent fill */
--accent-subtle: #f1f5f9; /* faint accent-tinted surface (chips, selected) */
/* Strength of a dayTintProvider plugin's colour in each region of a day card.
Per-theme because the tones are fixed hexes: the default tone #4F46E5 is itself a
dark colour, so a light theme's alpha makes it vanish against the dark sidebar,
while warn #f59e0b at the dark alpha would outshine the selected day. Per-region
because area and text density differ — the badge is a small bold pill, the
activity list is a large surface behind dense rows. Tuned so every region reads
above the hover step and below the selected one. */
--day-tint-badge: 16%;
--day-tint-header: 8%;
--day-tint-header-hover: 14%;
--day-tint-activity: 6%;
--fs-scale-title: 1;
--fs-scale-subtitle: 1;
--fs-scale-body: 1;
@@ -620,6 +632,11 @@ input[type="number"], input[type="time"], input[type="date"], input[type="dateti
--accent-hover: #d4d4d8;
--accent-subtle: rgba(255, 255, 255, 0.08);
--day-tint-badge: 24%;
--day-tint-header: 13%;
--day-tint-header-hover: 20%;
--day-tint-activity: 10%;
--success: #22c55e; --success-soft: rgba(34, 197, 94, 0.15);
--danger: #ef4444; --danger-soft: rgba(239, 68, 68, 0.15);
--warning: #f59e0b; --warning-soft: rgba(245, 158, 11, 0.15);