@pond-ts/charts 0.53.0 → 0.53.1

package/CHANGELOG.md

@@ -8,7 +8,8 @@ The `@pond-ts` packages — `pond-ts`, `@pond-ts/react`, `@pond-ts/charts`,
 tag, so this file covers them all. Pre-1.0: minor bumps may include new features
 and type-level changes; patch bumps are strictly additive.
 
-[Unreleased]: https://github.com/pond-ts/pond/compare/v0.53.0...HEAD
+[Unreleased]: https://github.com/pond-ts/pond/compare/v0.53.1...HEAD
+[0.53.1]: https://github.com/pond-ts/pond/compare/v0.53.0...v0.53.1
 [0.53.0]: https://github.com/pond-ts/pond/compare/v0.52.0...v0.53.0
 [0.52.0]: https://github.com/pond-ts/pond/compare/v0.51.0...v0.52.0
 [0.51.0]: https://github.com/pond-ts/pond/compare/v0.50.0...v0.51.0
@@ -53,6 +54,41 @@ and type-level changes; patch bumps are strictly additive.
 
 ## [Unreleased]
 
+## [0.53.1] — 2026-07-25
+
+### Fixed
+
+- **charts:** **An `<XAxis format>` again owns its own cursor / marker pills**
+  under a container with `origin` set. The elapsed axis supplies a _default_
+  finer readout (`00:05:12` under `00:05` ticks), but it was being delivered
+  through the same frame field as an explicit `cursorFormat` — so it outranked
+  an axis-level `format`, inverting the documented pill precedence
+  (`cursorFormat → axis format → container`). The visible symptom was the
+  two-strip pattern the docs recommend: a wall-clock strip declared as
+  `<XAxis format="%H:%M">` labelled its ticks `11:33` and pilled them
+  `00:05:12`. A real `cursorFormat` still outranks an axis `format`, unchanged.
+  A container **`timeFormat`** was inverted the same way one rung down — its
+  documented back-compat is to shape the readout when no `cursorFormat` is set,
+  and the elapsed default was overruling it. Fixed with the same precedence.
+
+- **charts:** **A duration axis no longer stacks ticks on one pixel across a
+  collapsed session.** The duration ladder strides in wall-clock time, so on a
+  trading axis several ticks could land inside closed time — where the scale
+  maps all of them to the same seam pixel, stroking labels over labels and
+  gridlines over gridlines. Coinciding ticks are now dropped, so a seam shows
+  one label rather than four — and the one kept is the **last** of the group,
+  the session open that genuinely sits on that pixel (`1d 00:00`), rather than
+  the first, which falls inside the collapsed night (`12:00` = 21:30, market
+  shut). Continuous axes are unaffected (their ticks are tens of pixels apart
+  by construction).
+
+Both found by an adversarial review of the v0.53.0 duration axis
+([#540](https://github.com/pond-ts/pond/issues/540)), which also corrected the
+duration-axis docs: the trading-calendar caveat described uneven spacing where
+the real behaviour is thinning around seams, a far-off `origin` (`origin={0}`
+on a 2026 axis ⇒ `20468d 10:00` on every tick) was undocumented, and one row of
+the label-shape table quoted a sample spacing where it meant a tick step.
+
 ## [0.53.0] — 2026-07-25
 
 ### Changed

package/dist/ChartContainer.js

@@ -510,7 +510,14 @@ export function ChartContainer({ range, width, rowGap = 0, showAxis = true, trac
                 })
                 : cursorFormat !== undefined
                     ? resolveTimeFormat(e, xTickCount, cursorFormat)
-                    : fine;
+                    : // A container `timeFormat` shapes the readout too when no
+                        // `cursorFormat` is set — its documented back-compat behaviour,
+                        // and the same inversion as the `<XAxis format>` one a rung down:
+                        // a custom format that owns the labels must own the pill rather
+                        // than watch the elapsed default overrule it (PR #541 review).
+                        timeFormat !== undefined
+                            ? labels
+                            : fine;
             return { xScale: e, formatTime: labels, formatReadout: readout };
         };
         if (xDiscontinuities !== undefined) {
@@ -688,6 +695,7 @@ export function ChartContainer({ range, width, rowGap = 0, showAxis = true, trac
         formatTime,
         formatReadout,
         xFormatCustom: timeFormat !== undefined,
+        xReadoutCustom: cursorFormat !== undefined,
         xTickCount,
         registerTrackerSource,
         unregisterTrackerSource,
@@ -749,6 +757,7 @@ export function ChartContainer({ range, width, rowGap = 0, showAxis = true, trac
         formatTime,
         formatReadout,
         timeFormat,
+        cursorFormat,
         xTickCount,
         registerTrackerSource,
         unregisterTrackerSource,

package/dist/XAxis.js

@@ -165,7 +165,19 @@ export function XAxis({ format, label, side = 'bottom', height, ticks: customTic
     // own channel, so precise-pill-over-terse-ticks works on any axis kind. A
     // `transform`ed axis is exempt — its pill speaks the derived unit, which a
     // data-unit `cursorFormat` can't address.
-    const readoutFmt = transform === undefined ? (container.formatReadout ?? fmt) : fmt;
+    //
+    // The middle rung is why `xReadoutCustom` exists: `formatReadout` carries
+    // either a real `cursorFormat` (which outranks this axis's `format`) or the
+    // axis kind's own default readout (which does not — an elapsed container's
+    // finer `00:05:12`). Reading the field alone can't tell them apart, so a
+    // wall-clock strip declared as `<XAxis format="%H:%M">` under an elapsed
+    // container used to label its ticks `11:33` and pill them `00:05:12`
+    // (issue #540).
+    const readoutFmt = transform !== undefined
+        ? fmt
+        : format !== undefined && !container.xReadoutCustom
+            ? fmt
+            : (container.formatReadout ?? fmt);
     // Marker annotations that opted into an axis indicator (`<Marker indicator>`)
     // pin their **time** to this shared x-axis — a pill at `at`, in the annotation
     // colour, reading like a tick. An indicator always shows the axis coordinate

package/dist/context.d.ts

@@ -163,6 +163,17 @@ export interface ContainerFrame {
      *  x axis suppresses its boundary (second) label row when it's set — a
      *  custom format owns the whole label, so the ladder mustn't second-line it. */
     readonly xFormatCustom: boolean;
+    /**
+     * Whether an explicit container `cursorFormat` shaped {@link formatReadout} —
+     * as opposed to the axis kind supplying its own default readout (the elapsed
+     * axis's finer duration). The two are indistinguishable from the field alone,
+     * and `<XAxis>` must tell them apart to honour the documented pill precedence
+     * `cursorFormat → axis format → container`: a **`cursorFormat`** outranks an
+     * explicit `<XAxis format>`, a **default** does not. Without this the elapsed
+     * default silently occupied the `cursorFormat` slot and a wall-clock strip's
+     * pill read durations (issue #540, finding 2).
+     */
+    readonly xReadoutCustom: boolean;
     /**
      * The shared **x-side tick count** — the `count` every x-side `ticks()` /
      * `tickFormat()` call passes (`<XAxis>` labels, the canvas x gridlines and

package/dist/elapsed.js

@@ -94,6 +94,10 @@ export function durationStep(span, count) {
 /** Backstop against a pathological (step, domain) pair flooding the axis; the
  *  step is derived from the domain span, so a real axis never comes close. */
 const MAX_TICKS = 10_000;
+/** Closest two ticks may sit in pixels before the second is dropped as a
+ *  duplicate. Only ever fires where a discontinuous base scale collapses a span
+ *  to a point — a continuous axis spaces its ticks tens of px apart. */
+const MIN_TICK_PX = 1;
 /**
  * Tick values in **absolute axis units** at `origin + k·step`, covering
  * `domain` — the anchored walk that makes `00:05` land exactly five minutes
@@ -214,6 +218,44 @@ export function scaleElapsed(base, options) {
             : s.tickFormat(count);
         return (v) => f(v - origin);
     };
+    /**
+     * Drop ticks that land on a pixel another tick already claimed. The walk is in
+     * **wall-clock** ms, but the base scale need not be continuous: on a trading
+     * axis every instant inside a collapsed session maps to the one seam pixel, so
+     * a duration ladder striding through a closed market emits several ticks at
+     * the *same* x — labels stacked on labels, gridlines stroked on gridlines
+     * (issue #540, finding 1). A plain axis is untouched: its ticks are ~65px
+     * apart by construction, so nothing is ever within the gap.
+     *
+     * The survivor is the **last** tick of each pixel group, not the first. Ticks
+     * ascend, so a group spans a collapsed gap and ends at the first instant the
+     * axis actually draws — the session open. Keeping the first would label the
+     * seam with a moment the market was shut: on three 09:30–16:00 sessions the
+     * pixel would read `12:00` (21:30 that night) instead of `1d 00:00`, the
+     * Tuesday open that genuinely sits there (PR #541 review).
+     */
+    const dedupeByPixel = (values) => {
+        const r = base.range();
+        // Pre-layout the whole range is one pixel wide; nothing is visible, and
+        // deduping there would collapse the axis to a single tick.
+        if (!(Math.abs(Number(r[1] ?? 0) - Number(r[0] ?? 0)) > 0))
+            return [...values];
+        const out = [];
+        let lastPx = 0;
+        for (const v of values) {
+            const px = base(v);
+            if (!Number.isFinite(px))
+                continue;
+            if (out.length > 0 && Math.abs(px - lastPx) < MIN_TICK_PX) {
+                out[out.length - 1] = v; // same pixel — the later instant wins
+                lastPx = px;
+                continue;
+            }
+            out.push(v);
+            lastPx = px;
+        }
+        return out;
+    };
     const scale = ((value) => base(value));
     Object.assign(scale, {
         origin,
@@ -223,7 +265,7 @@ export function scaleElapsed(base, options) {
             const r = base.range();
             return [Number(r[0] ?? 0), Number(r[1] ?? 0)];
         },
-        ticks: (count = DEFAULT_COUNT) => originTicks(bounds(), origin, stepFor(count)),
+        ticks: (count = DEFAULT_COUNT) => dedupeByPixel(originTicks(bounds(), origin, stepFor(count))),
         tickFormat: (count = DEFAULT_COUNT, specifier) => {
             if (kind === 'value')
                 return offsetFormat(count, specifier);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pond-ts/charts",
-  "version": "0.53.0",
+  "version": "0.53.1",
   "private": false,
   "description": "Canvas-rendered, streaming-first time-series charts for pond-ts",
   "license": "MIT",