timeline

block

A real-time axis placed inside a diagram: point items, labelled phase bands, and rich event cards pinned to ISO dates.

timeline is a real-time axis — dates are ISO strings ("2026-03-15" / "…14:30") and tick boundaries land on real calendar dates. A unit (:minutes..:years) sets granularity; omit it for auto-fit from the event span. It is a diagram shape, so it lives inside a diagram sharing its size.

Items and phases

items are point events, each { label, on } (with optional side: :near|:far). phases are labelled spans, each { label, from, to }, drawn as a band that cycles the wdoc-series-N palette. Set direction = :vertical to read top-to-bottom with items alternating sides.

diagram { width = 560  height = 220
  timeline { width = 560.0  height = 220.0
    title = "2026 roadmap"
    start = "2026-01-01"
    end   = "2026-12-31"
    unit  = :months
    items = [
      { label: "Kickoff",  on: "2026-02-20" },
      { label: "Beta",     on: "2026-05-10" },
      { label: "Release",  on: "2026-09-20", side: :far },
    ]
    phases = [
      { label: "Build",  from: "2026-02-01", to: "2026-06-15" },
      { label: "Polish", from: "2026-06-15", to: "2026-11-01" },
    ]
  }
}

Event cards

A timeline also accepts rich-text card children — each pinned to a date with on and filled with formatted wdoc content (text, lists, callouts, images). width / height size the box and side: :near|:far forces which side of the axis it sits on.

diagram { width = 720  height = 320
  timeline { width = 720.0  height = 320.0
    title = "Release timeline"
    unit  = :months
    start = "2026-01-01"
    end   = "2026-12-31"
    card { on = "2026-02-01"  title = "1.0"  width = 210.0  height = 104.0
      text { span "First " {} span "stable" { class = ["accent"] } span " release. APIs frozen." {} }
    }
  }
}

- barchart / linechart / pie_chart

- diagram