ganttToday

Why JS: a scroll box starts at its first day, and only script can scroll it to where the reader is in time.

tsx

import { ganttToday } from "@sdxc/ui/app";

2026

Billing rewrite, Feb 2, 2026 to Jun 26, 2026, 100% complete
Checkout v2, Sep 14, 2026 to Dec 11, 2026, 70% complete

2027

Design tokens, Jan 11, 2027 to Apr 30, 2027

Today: November 12, 2026

View code

tsx

// Gantt draws its today line with ganttToday() on it, so a long range opens on today.
<Gantt label="Roadmap" start="2026-01-01" end="2027-12-31" today="2026-11-12" labels={labels}>
	<Gantt.Group title="2026">
		<Gantt.Item name="Billing rewrite" start="2026-02-02" end="2026-06-26" progress={1} />
		<Gantt.Item name="Checkout v2" start="2026-09-14" end="2026-12-11" progress={0.7} />
	</Gantt.Group>
	<Gantt.Group title="2027">
		<Gantt.Item name="Design tokens" start="2027-01-11" end="2027-04-30" />
	</Gantt.Group>
</Gantt>

Usage

Applied to a marker inside a Gantt: once the chart is laid out, scrolls it sideways so today's line sits a third of the way across the axis's visible width. A Gantt chart the reader already scrolled, or one wide enough to show today, is left where it is.

Signature

typescript

ganttToday(): MixinDescriptor<HTMLElement>

Examples

tsx

<span hidden mix={[ganttToday()]} />