@pond-ts/charts 0.47.0 → 0.48.1

package/CHANGELOG.md

@@ -8,7 +8,9 @@ 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.47.0...HEAD
+[Unreleased]: https://github.com/pond-ts/pond/compare/v0.48.1...HEAD
+[0.48.1]: https://github.com/pond-ts/pond/compare/v0.48.0...v0.48.1
+[0.48.0]: https://github.com/pond-ts/pond/compare/v0.47.0...v0.48.0
 [0.47.0]: https://github.com/pond-ts/pond/compare/v0.46.0...v0.47.0
 [0.46.0]: https://github.com/pjm17971/pond-ts/compare/v0.45.0...v0.46.0
 [0.45.0]: https://github.com/pjm17971/pond-ts/compare/v0.44.1...v0.45.0
@@ -46,6 +48,48 @@ and type-level changes; patch bumps are strictly additive.
 
 ## [Unreleased]
 
+## [0.48.1] — 2026-07-19
+
+### Fixed
+
+- `smooth(column, 'loess', …)` is now numerically stable on absolute epoch-ms
+  timestamps. The local weighted regression is now conditioned on `x` centred at
+  the query point; previously the un-centred normal equations lost precision to
+  floating-point cancellation (anchors ~1.7e12 → `x²` terms ~3e24). Severity
+  scales with (anchor magnitude / window width)²: on finely-spaced series
+  (second-level cadence) the fit overshot wildly outside the data range instead
+  of smoothing, while coarser day-spaced series erred only subtly. Output is now
+  shift-invariant to the time origin. Series built from small integer anchors
+  (e.g. in unit tests) were unaffected, which is why this hid.
+
+## [0.48.0] — 2026-07-17
+
+### Added
+
+- **charts:** `<ChartContainer>` gains **`cursorFormat`** — an independent
+  format for the **cursor / marker readout** (the crosshair time pill, marker
+  axis indicators, annotation auto-labels), separate from the tick-label
+  `timeFormat` / `format`. Unlike `timeFormat` (which _owns the labels_ and so
+  opts the axis out of the `dateStyle` ladder by design), `cursorFormat` shapes
+  only the readout and **keeps the flat / stacked date style** — resolving the
+  "one knob, two concerns" bind where the only way to fix the pill was to give
+  up the styled axis. A d3 specifier **string** formats uniformly; a
+  **function** `(epochMs, { grain, defaultText }) => string` is handed the
+  axis's resolved coarse **`TimeGrain`** (`year` … `second`) and the
+  grain-aware default text, so it can branch on zoom and pass the default
+  through — no re-deriving the grain from the range. New public types
+  **`CursorFormat`** / **`TimeGrain`**; `TradingTimeScale` gains
+  `readoutFormat(count)` and `grain(count)`.
+
+### Fixed
+
+- **charts:** the cursor / marker time readout now formats at the axis's
+  **own grain** by default instead of d3's multi-scale default — a
+  day-or-coarser axis reads a **date** (`Sep 14, 2026`), a sub-day axis reads
+  date + clock. Fixes the 0.47.0 flat-axis regression where a daily bar at a
+  foreign-timezone midnight rendered as a bare time-of-day (`02 AM`) in the
+  crosshair pill (Tidal F-charts-7). Tick labels are unchanged.
+
 ## [0.47.0] — 2026-07-17
 
 ### Added

package/dist/ChartContainer.d.ts

@@ -3,7 +3,7 @@ import { type DiscontinuityProvider, type TradingCalendarLike } from './tradingT
 import { Sequence, BoundedSequence } from 'pond-ts';
 import type { TimeRange } from 'pond-ts';
 import { type AnnotationKind, type CreateSpec, type CursorMode, type SelectInfo, type TrackerInfo } from './context.js';
-import { type AxisFormat } from './format.js';
+import { type AxisFormat, type CursorFormat } from './format.js';
 import { type ChartTheme } from './theme.js';
 export interface ChartContainerProps {
     /**
@@ -290,12 +290,33 @@ export interface ChartContainerProps {
      */
     snap?: boolean;
     /**
-     * Time-axis value formatting — a d3 time specifier string (e.g. `'%H:%M'`) or a
-     * `(epochMs) => string` function ({@link AxisFormat}); applies to both the time
-     * axis labels and the cursor-time readout. **Omitted ⇒ d3's multi-scale time
-     * format** (`12 PM`, `12:10`, …).
+     * Time-axis **label** formatting — a d3 time specifier string (e.g. `'%H:%M'`)
+     * or a `(epochMs) => string` function ({@link AxisFormat}). A custom format
+     * **owns the labels**, so it opts the axis out of the `dateStyle` ladder
+     * (flat / stacked) by design. **Omitted ⇒ the flat/stacked date style.** To
+     * shape only the cursor readout while keeping a date style, use
+     * {@link cursorFormat} instead. (For back-compat this also shapes the readout
+     * when `cursorFormat` is absent.)
      */
     timeFormat?: AxisFormat;
+    /**
+     * The **cursor / marker readout** format — the crosshair time pill, marker
+     * axis indicators, and annotation auto-labels — **independent of the tick
+     * labels**, so it does **not** disqualify the `dateStyle` ladder.
+     * **Omitted ⇒ a grain-aware default**: the readout formats at the axis's own
+     * granularity, so a day-or-coarser axis reads a **date** (never a
+     * time-of-day) and a sub-day axis reads date + clock — a daily bar at a
+     * foreign-tz midnight no longer renders as `02 AM`.
+     *
+     * A d3 time-specifier **string** formats uniformly at every zoom; a
+     * **function** `(epochMs, { grain, defaultText }) => string` receives the
+     * axis's resolved coarse {@link TimeGrain} and the grain-aware default text,
+     * so it can branch on the zoom level and pass `defaultText` through for
+     * grains it doesn't override (no re-deriving the grain from the range). See
+     * {@link CursorFormat}. This is the independent readout channel;
+     * {@link timeFormat} owns the labels.
+     */
+    cursorFormat?: CursorFormat;
     /** Visual theme for all rows; defaults to {@link defaultTheme}. */
     theme?: ChartTheme;
     children?: ReactNode;
@@ -309,5 +330,5 @@ export interface ChartContainerProps {
  * {@link TimeAxis} at the bottom, aligned under the plots. Y axes are per-row
  * (`<YAxis>`).
  */
-export declare function ChartContainer({ range, width, rowGap, showAxis, trackerPosition, onTrackerChanged, selected, onSelect, hovered, onHover, panZoom, onTimeRangeChange, minDuration, cursor, cursorSequence, onRegionSelect, regionSelectModifier, cursorTime, crosshairSnap, editAnnotations, creating, onCreate, onSelectAnnotation, onHoverAnnotation, onEditAnnotation, snap, timeFormat, theme, discontinuities, calendar, spacing, grid, sessionDividers, children, }: ChartContainerProps): import("react/jsx-runtime").JSX.Element;
+export declare function ChartContainer({ range, width, rowGap, showAxis, trackerPosition, onTrackerChanged, selected, onSelect, hovered, onHover, panZoom, onTimeRangeChange, minDuration, cursor, cursorSequence, onRegionSelect, regionSelectModifier, cursorTime, crosshairSnap, editAnnotations, creating, onCreate, onSelectAnnotation, onHoverAnnotation, onEditAnnotation, snap, timeFormat, cursorFormat, theme, discontinuities, calendar, spacing, grid, sessionDividers, children, }: ChartContainerProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ChartContainer.d.ts.map

package/dist/ChartContainer.js

@@ -43,7 +43,7 @@ function normalizeRange(range) {
  * {@link TimeAxis} at the bottom, aligned under the plots. Y axes are per-row
  * (`<YAxis>`).
  */
-export function ChartContainer({ range, width, rowGap = 0, showAxis = true, trackerPosition, onTrackerChanged, selected, onSelect, hovered, onHover, panZoom = false, onTimeRangeChange, minDuration = 1, cursor = DEFAULT_CURSOR_MODE, cursorSequence, onRegionSelect, regionSelectModifier, cursorTime = false, crosshairSnap = true, editAnnotations = false, creating = null, onCreate, onSelectAnnotation, onHoverAnnotation, onEditAnnotation, snap = true, timeFormat, theme, discontinuities, calendar, spacing, grid = true, sessionDividers = 'none', children, }) {
+export function ChartContainer({ range, width, rowGap = 0, showAxis = true, trackerPosition, onTrackerChanged, selected, onSelect, hovered, onHover, panZoom = false, onTimeRangeChange, minDuration = 1, cursor = DEFAULT_CURSOR_MODE, cursorSequence, onRegionSelect, regionSelectModifier, cursorTime = false, crosshairSnap = true, editAnnotations = false, creating = null, onCreate, onSelectAnnotation, onHoverAnnotation, onEditAnnotation, snap = true, timeFormat, cursorFormat, theme, discontinuities, calendar, spacing, grid = true, sessionDividers = 'none', children, }) {
     // The explicit base domain from `range` (a tuple or a TimeRange). `undefined`
     // ⇒ auto-fit (resolved from the layers below). Pan/zoom seeds from it; `seed`
     // is the placeholder while auto-fitting.
@@ -361,6 +361,30 @@ export function ChartContainer({ range, width, rowGap = 0, showAxis = true, trac
                 formatTime: resolveAxisFormat(s, xTickCount, timeFormat),
             };
         }
+        // The cursor / marker / annotation **readout** formatter. `cursorFormat`
+        // wins (the independent readout channel — it never disqualifies the date
+        // style); else a container `timeFormat` (back-compat: shapes the readout
+        // too, and already opts labels out of the ladder); else the scale's
+        // **grain-aware** default (a day-or-coarser axis reads a date, not a
+        // time-of-day — the F-charts-7 `02 AM` fix), never d3's multi-scale default.
+        const timeReadout = (s) => {
+            // A `cursorFormat` **function** gets the axis's resolved coarse grain and
+            // the grain-aware default text per instant, so it can branch on zoom and
+            // pass the default through. A **string** formats uniformly (d3 specifier).
+            if (typeof cursorFormat === 'function') {
+                const grain = s.grain(xTickCount);
+                const def = s.readoutFormat(xTickCount);
+                return (v) => cursorFormat(v, { grain, defaultText: def(v) });
+            }
+            if (cursorFormat !== undefined) {
+                return resolveTimeFormat(s, xTickCount, cursorFormat);
+            }
+            // No cursorFormat: a container timeFormat still shapes the readout
+            // (back-compat); else the scale's grain-aware default.
+            return timeFormat !== undefined
+                ? resolveTimeFormat(s, xTickCount, timeFormat)
+                : s.readoutFormat(xTickCount);
+        };
         if (xDiscontinuities !== undefined) {
             // Trading-time axis: closed-market gaps collapse, time proportional within
             // sessions. Same tickFormat surface as scaleTime, so the readout is shared.
@@ -369,10 +393,7 @@ export function ChartContainer({ range, width, rowGap = 0, showAxis = true, trac
             const s = scaleTradingTime(xDiscontinuities)
                 .domain([d0, d1])
                 .range([0, plotWidth]);
-            return {
-                xScale: s,
-                formatTime: resolveTimeFormat(s, xTickCount, timeFormat),
-            };
+            return { xScale: s, formatTime: timeReadout(s) };
         }
         // Plain continuous time axis: the same trading-time scale over the
         // gap-free identity provider, so it runs the same logical tick ladder
@@ -383,10 +404,7 @@ export function ChartContainer({ range, width, rowGap = 0, showAxis = true, trac
         const s = scaleTradingTime(identityProvider())
             .domain([d0, d1])
             .range([0, plotWidth]);
-        return {
-            xScale: s,
-            formatTime: resolveTimeFormat(s, xTickCount, timeFormat),
-        };
+        return { xScale: s, formatTime: timeReadout(s) };
     }, [
         resolvedKind,
         categories,
@@ -394,6 +412,7 @@ export function ChartContainer({ range, width, rowGap = 0, showAxis = true, trac
         d1,
         plotWidth,
         timeFormat,
+        cursorFormat,
         xDiscontinuities,
         xTickCount,
     ]);

package/dist/format.d.ts

@@ -6,12 +6,32 @@
  * uses for the ticks), a **function** is used verbatim, and `undefined` falls
  * back to the scale's default `tickFormat`.
  */
+import type { TimeGrain } from './tickLadder.js';
 /**
  * How to format an axis's values — a d3 [format specifier]
  * (https://github.com/d3/d3-format#locale_format) string, or a custom
  * `(value) => string` function. Omit for the scale's d3 default.
  */
 export type AxisFormat = string | ((value: number) => string);
+/**
+ * How to format the **cursor / marker readout** on a time axis
+ * ({@link ChartContainerProps.cursorFormat}). Either:
+ *
+ * - a d3 time specifier **string** (e.g. `'%b %-d'`) applied uniformly at every
+ *   zoom; or
+ * - a **function** `(epochMs, ctx) => string`, where `ctx.grain` is the axis's
+ *   resolved coarse {@link TimeGrain} (`year` … `second`) and `ctx.defaultText`
+ *   is the library's grain-aware default readout for that instant — so a
+ *   consumer can branch on the zoom level (`grain === 'year' ? … : …`) and
+ *   pass `defaultText` through for the grains they don't want to override.
+ *
+ * The library hands you the grain because it already resolved it — you never
+ * re-derive it from the range.
+ */
+export type CursorFormat = string | ((epochMs: number, ctx: {
+    readonly grain: TimeGrain;
+    readonly defaultText: string;
+}) => string);
 /** The slice of a d3 scale {@link resolveAxisFormat} needs — `tickFormat` with an
  *  optional specifier. A d3 `ScaleLinear` / `ScaleTime` satisfies it. */
 interface Tickable {

package/dist/index.d.ts

@@ -31,7 +31,7 @@ export type { XAxisProps } from './XAxis.js';
 export type { AxisTransform } from './derivedTicks.js';
 export { TimeAxis } from './TimeAxis.js';
 export { CategoryAxis } from './CategoryAxis.js';
-export type { AxisFormat } from './format.js';
+export type { AxisFormat, CursorFormat } from './format.js';
 export { LineChart } from './LineChart.js';
 export type { LineChartProps } from './LineChart.js';
 export { BandChart } from './BandChart.js';
@@ -48,7 +48,7 @@ export { Candlestick } from './Candlestick.js';
 export type { CandlestickProps } from './Candlestick.js';
 export type { CandleVariant, ColorBy } from './ohlc.js';
 export { scaleTradingTime } from './tradingTimeScale.js';
-export type { TradingTimeScale, DiscontinuityProvider, } from './tradingTimeScale.js';
+export type { TradingTimeScale, DiscontinuityProvider, TimeGrain, } from './tradingTimeScale.js';
 export { scaleBand } from './bandScale.js';
 export type { ScaleBand } from './bandScale.js';
 export { Region, Baseline, Marker } from './annotations.js';

package/dist/tickLadder.d.ts

@@ -24,6 +24,16 @@ import type { DiscontinuityProvider } from './tradingTimeScale.js';
  */
 /** The calendar grain a run of tick anchors is bucketed to. */
 export type TickGranularity = 'second1' | 'second5' | 'second15' | 'second30' | 'minute1' | 'minute5' | 'minute15' | 'minute30' | 'hour1' | 'hour3' | 'hour6' | 'hour12' | 'day' | 'week' | 'month' | 'quarter' | 'year';
+/**
+ * The **coarse calendar unit** of a resolved grain — the public grain a
+ * `cursorFormat` callback branches on, with the internal 1/5/15/30 strides
+ * collapsed to their unit (`hour1|3|6|12` → `hour`). Stable across zoom steps
+ * within a unit, so a consumer's `grain === 'hour'` check doesn't churn as the
+ * stride changes.
+ */
+export type TimeGrain = 'year' | 'quarter' | 'month' | 'week' | 'day' | 'hour' | 'minute' | 'second';
+/** Collapse a {@link TickGranularity} to its coarse {@link TimeGrain} unit. */
+export declare function coarseUnitOf(g: TickGranularity): TimeGrain;
 /**
  * The local-time bucket key for `t` at grain `g` — two instants in the same
  * day / week / month / quarter / year share a key. Local time (not UTC) so it
@@ -143,6 +153,16 @@ export declare function boundaryFormatFor(g: TickGranularity): string;
  *  the next coarser unit — sub-day → day, day/week → month, month/quarter →
  *  year, year → none. */
 export declare function bandGrainFor(g: TickGranularity): TickGranularity | undefined;
+/**
+ * d3 specifier for the **cursor / marker readout** at grain `g` — a hovered
+ * instant formatted at the axis's own granularity, never finer. A day-or-coarser
+ * axis reads a **date** (no time-of-day), so a daily bar at a foreign-tz
+ * midnight can't render as `02 AM`; a sub-day axis reads date **+** clock. This
+ * is the grain-aware default that replaces d3's multi-scale default for the
+ * readout (a `cursorFormat` override, when given, wins over it). Unambiguous by
+ * design — the readout carries the year / date the terse tick labels omit.
+ */
+export declare function readoutFormatFor(g: TickGranularity): string;
 /** d3 specifier for a **band** label at band grain `g`: the date for a day band
  *  (`Jan 12`), the full month for a month band (`January`), the year for a year
  *  band (`2031`). Left-aligned in the band by the renderer. */

package/dist/tickLadder.js

@@ -1,3 +1,13 @@
+/** Collapse a {@link TickGranularity} to its coarse {@link TimeGrain} unit. */
+export function coarseUnitOf(g) {
+    if (g.startsWith('second'))
+        return 'second';
+    if (g.startsWith('minute'))
+        return 'minute';
+    if (g.startsWith('hour'))
+        return 'hour';
+    return g; // 'day' | 'week' | 'month' | 'quarter' | 'year'
+}
 const SEC_MS = 1_000;
 const MIN_MS = 60_000;
 const HOUR_MS = 3_600_000;
@@ -651,6 +661,34 @@ export function bandGrainFor(g) {
             return undefined; // year — no coarser band
     }
 }
+/**
+ * d3 specifier for the **cursor / marker readout** at grain `g` — a hovered
+ * instant formatted at the axis's own granularity, never finer. A day-or-coarser
+ * axis reads a **date** (no time-of-day), so a daily bar at a foreign-tz
+ * midnight can't render as `02 AM`; a sub-day axis reads date **+** clock. This
+ * is the grain-aware default that replaces d3's multi-scale default for the
+ * readout (a `cursorFormat` override, when given, wins over it). Unambiguous by
+ * design — the readout carries the year / date the terse tick labels omit.
+ */
+export function readoutFormatFor(g) {
+    if (g === 'second1' ||
+        g === 'second5' ||
+        g === 'second15' ||
+        g === 'second30')
+        return '%b %-d, %H:%M:%S';
+    if (isSubDay(g))
+        return '%b %-d, %H:%M';
+    switch (g) {
+        case 'day':
+        case 'week':
+            return '%b %-d, %Y';
+        case 'month':
+        case 'quarter':
+            return '%b %Y';
+        default:
+            return '%Y'; // year
+    }
+}
 /** d3 specifier for a **band** label at band grain `g`: the date for a day band
  *  (`Jan 12`), the full month for a month band (`January`), the year for a year
  *  band (`2031`). Left-aligned in the band by the renderer. */

package/dist/tradingTimeScale.d.ts

@@ -1,4 +1,4 @@
-import { type TickGranularity } from './tickLadder.js';
+import { type TickGranularity, type TimeGrain } from './tickLadder.js';
 /**
  * The structural discontinuity-provider surface `scaleTradingTime` consumes to
  * collapse closed-market time. Charts declares this **shape** itself and never
@@ -59,7 +59,8 @@ export interface TradingCalendarLike {
  * month grain) and returns the finest rung that fits `count`, and
  * `.tickFormat` labels each anchor at that grain (`%H:%M` for hours, `%b %d`
  * for days/weeks, `%b` for months/quarters, `%Y` for years) while formatting
- * any other instant (the cursor readout) with the d3 multi-scale default. The
+ * any other instant with the d3 multi-scale default (the cursor readout uses
+ * `.readoutFormat`, a grain-aware date/clock format, not this). The
  * coarser context a label drops lives on `.tickBoundaries` — the second-row
  * boundary labels of the **stacked** date style (the date over a clock axis,
  * the year over a day / week / month axis), one per boundary crossing plus the
@@ -97,10 +98,10 @@ export interface TradingTimeScale {
      * base label (bare day-of-month, month abbrev, clock time) otherwise — the
      * TradingView default axis, the alternative to the two-row {@link tickFormat}
      * + {@link tickBoundaries} stack. Same grain selection as {@link ticks} at the
-     * same `count`, so the labels sit on the tick instants. A non-tick value (the
-     * cursor readout) formats with the d3 multi-scale default, like
-     * {@link tickFormat} — so ticks read terse while the crosshair reads a full
-     * timestamp.
+     * same `count`, so the labels sit on the tick instants. A non-tick value
+     * formats with the d3 multi-scale default, like {@link tickFormat}; the
+     * cursor readout itself uses {@link readoutFormat} (grain-aware), so ticks
+     * read terse while the crosshair reads an unambiguous date/clock.
      */
     flatFormat(count?: number): (value: number) => string;
     /**
@@ -147,6 +148,24 @@ export interface TradingTimeScale {
      * band row ({@link bands}) instead of inline.
      */
     baseFormat(count?: number): (value: number) => string;
+    /**
+     * The **cursor / marker readout** formatter — a hovered instant formatted at
+     * the axis's own grain, never finer (a day-or-coarser axis reads a **date**,
+     * so a daily bar at a foreign-tz midnight never renders as a time-of-day like
+     * `02 AM`; a sub-day axis reads date **+** clock). This is the grain-aware
+     * default the crosshair pill, marker indicators, and annotation auto-labels
+     * use — replacing d3's multi-scale default, which showed local time-of-day
+     * for any off-local-midnight instant. A container `cursorFormat` overrides it.
+     */
+    readoutFormat(count?: number): (value: number) => string;
+    /**
+     * The axis's resolved **coarse grain** ({@link TimeGrain}) at `count` — the
+     * unit the ticks currently sit on (`year` … `second`), strides collapsed. A
+     * `cursorFormat` callback receives this so it can branch on the zoom level
+     * (return a year when zoomed out, a clock when zoomed in) without
+     * re-deriving the ladder the axis already ran.
+     */
+    grain(count?: number): TimeGrain;
     /**
      * The **date bands** — the segmented second row of the stacked style. One
      * entry per next-coarser calendar period touching the domain (day bands
@@ -171,7 +190,7 @@ export interface TradingTimeScale {
     copy(): TradingTimeScale;
 }
 export { coarsenCalendar } from './tickLadder.js';
-export type { TickGranularity } from './tickLadder.js';
+export type { TickGranularity, TimeGrain } from './tickLadder.js';
 /**
  * The trivial gap-free {@link DiscontinuityProvider}: live time **is** wall
  * time, and every local midnight is a "session open". Backing a plain

package/dist/tradingTimeScale.js

@@ -1,5 +1,5 @@
 import { scaleTime } from 'd3-scale';
-import { bandFormatFor, bandGrainFor, bandNext, bandShaded, bandStartOf, boundaryFormatFor, boundaryGrainFor, boundaryTicks, buildGridLevels, buildTicks, flatBaseFormatFor, flatFormats, majorFormatFor, nominalStepMs, } from './tickLadder.js';
+import { bandFormatFor, bandGrainFor, bandNext, bandShaded, bandStartOf, boundaryFormatFor, boundaryGrainFor, boundaryTicks, buildGridLevels, buildTicks, coarseUnitOf, flatBaseFormatFor, flatFormats, majorFormatFor, nominalStepMs, readoutFormatFor, } from './tickLadder.js';
 // Grain selection lives in `tickLadder.ts` (the full hour1…year ladder plus
 // the boundary-row helpers); re-exported here so existing imports keep working.
 export { coarsenCalendar } from './tickLadder.js';
@@ -140,9 +140,9 @@ export function scaleTradingTime(provider) {
         return (value) => labelled.get(value);
     };
     scale.flatFormat = (count = 10) => {
-        // A non-tick instant (the cursor readout) always uses the d3 multi-scale
-        // default — same as tickFormat, so the crosshair reads a full timestamp
-        // while the ticks read terse. Without a calendar there are no ladder
+        // A non-tick instant always uses the d3 multi-scale default — same as
+        // tickFormat. (The cursor readout doesn't route through here; it uses
+        // readoutFormat, grain-aware.) Without a calendar there are no ladder
         // anchors, so every value falls through to the default.
         const defFmt = base.tickFormat(count);
         if (!hasCalendar())
@@ -181,6 +181,14 @@ export function scaleTradingTime(provider) {
         const terse = base.tickFormat(count, flatBaseFormatFor(granularity));
         return (value) => anchors.has(value) ? terse(new Date(value)) : defFmt(new Date(value));
     };
+    scale.readoutFormat = (count = 10) => {
+        const defFmt = base.tickFormat(count);
+        if (!hasCalendar())
+            return (value) => defFmt(new Date(value));
+        const fmt = base.tickFormat(count, readoutFormatFor(resolved(count).granularity));
+        return (value) => fmt(new Date(value));
+    };
+    scale.grain = (count = 10) => hasCalendar() ? coarseUnitOf(resolved(count).granularity) : 'day';
     scale.bands = (count = 10) => {
         if (!hasCalendar())
             return [];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pond-ts/charts",
-  "version": "0.47.0",
+  "version": "0.48.1",
   "private": false,
   "description": "Canvas-rendered, streaming-first time-series charts for pond-ts",
   "license": "MIT",
@@ -38,8 +38,8 @@
     "perf": "PERF_BENCH=1 playwright test perf.spec.ts --workers=1"
   },
   "peerDependencies": {
-    "@pond-ts/react": "^0.47.0",
-    "pond-ts": "^0.47.0",
+    "@pond-ts/react": "^0.48.0",
+    "pond-ts": "^0.48.0",
     "react": "^18.0.0 || ^19.0.0"
   },
   "devDependencies": {