svelteplot 0.10.3 → 0.11.0-pr-514.0

package/dist/core/Plot.svelte

@@ -11,9 +11,11 @@
     import { setContext } from 'svelte';
     import { SvelteMap } from 'svelte/reactivity';
     import { writable } from 'svelte/store';
+    import { scaleBand } from 'd3-scale';
 
     import type {
         PlotOptions,
+        ResolvedPlotOptions,
         GenericMarkOptions,
         Mark,
         PlotScales,
@@ -27,7 +29,7 @@
     import FacetGrid from './FacetGrid.svelte';
 
     import mergeDeep from '../helpers/mergeDeep.js';
-    import { computeScales, projectXY } from '../helpers/scales.js';
+    import { computeScales, normalizeScaleFn, projectXY } from '../helpers/scales.js';
     import { CHANNEL_SCALE, SCALES } from '../constants.js';
     import { getPlotDefaults, setPlotDefaults } from '../hooks/plotDefaults.js';
     import { maybeNumber } from '../helpers/index.js';
@@ -59,6 +61,11 @@
 
     // default settings in the plot and marks can be overwritten by
     // defining the svelteplot/defaults context outside of Plot
+    const asGridDefaults = (opts: PlotDefaults['grid'] | undefined) =>
+        opts === true ? { implicit: true } : opts == null ? {} : opts;
+    const isImplicit = (opts: { implicit?: boolean } | true | undefined) =>
+        opts === true ? true : (opts?.implicit ?? false);
+
     const DEFAULTS: PlotDefaults = {
         height: 350,
         initialWidth: 500,
@@ -88,20 +95,20 @@
         axisY: {
             anchor: 'left',
             implicit: true,
-            ...USER_DEFAULTS.axis,
-            ...USER_DEFAULTS.axisY
+            ...(USER_DEFAULTS.axis as any),
+            ...(USER_DEFAULTS.axisY as any)
         },
         gridX: {
             implicit: false,
-            ...USER_DEFAULTS.grid,
-            ...USER_DEFAULTS.gridX
+            ...asGridDefaults(USER_DEFAULTS.grid),
+            ...asGridDefaults(USER_DEFAULTS.gridX)
         },
         gridY: {
             implicit: false,
-            ...USER_DEFAULTS.grid,
-            ...USER_DEFAULTS.gridY
+            ...asGridDefaults(USER_DEFAULTS.grid),
+            ...asGridDefaults(USER_DEFAULTS.gridY)
         }
-    };
+    } as PlotDefaults;
 
     let {
         header,
@@ -165,7 +172,7 @@
     );
 
     const explicitDomains = $derived(
-        new Set(SCALES.filter((scale) => !!initialOptions[scale]?.domain))
+        new Set(SCALES.filter((scale) => !!(initialOptions as any)[scale]?.domain))
     );
 
     // one-dimensional plots have different automatic margins and heights
@@ -178,7 +185,7 @@
             explicitScales,
             explicitDomains,
             hasProjection: !!initialOptions.projection,
-            margin: initialOptions.margin,
+            margin: initialOptions.margin as number | 'auto' | undefined,
             inset: initialOptions.inset
         })
     );
@@ -211,7 +218,7 @@
 
     const defaultPointScaleHeight = $derived(
         explicitScales.has('r') && plotOptions.r.range
-            ? plotOptions.r.range[1] * 2
+            ? (plotOptions.r.range[1] as number) * 2
             : DEFAULTS.pointScaleHeight
     );
 
@@ -227,8 +234,8 @@
             ? plotOptions.height(plotWidth)
             : maybeNumber(plotOptions.height) === null || plotOptions.height === 'auto'
               ? Math.round(
-                    preScales.projection && preScales.projection.aspectRatio
-                        ? ((plotWidth * preScales.projection.aspectRatio) / xFacetCount) *
+                    preScales.projection && (preScales.projection as any).aspectRatio
+                        ? ((plotWidth * (preScales.projection as any).aspectRatio) / xFacetCount) *
                               yFacetCount +
                               plotOptions.marginTop +
                               plotOptions.marginBottom
@@ -254,7 +261,7 @@
               : maybeNumber(plotOptions.height)
     );
 
-    const plotHeight = $derived(height - plotOptions.marginTop - plotOptions.marginBottom);
+    const plotHeight = $derived((height ?? 0) - plotOptions.marginTop - plotOptions.marginBottom);
 
     // TODO: check if there's still a reason to store and expose the plot body element
     let plotBody: HTMLDivElement | null = $state(null);
@@ -274,11 +281,38 @@
         const scales = computeScales(
             plotOptions,
             facetWidth || width,
-            facetHeight || height,
+            facetHeight ?? height ?? 0,
             hasFilledDotMarks,
             marks,
             DEFAULTS
         );
+        // Fix fx/fy scale ranges: computeScales creates them with empty ranges
+        // because getScaleRange has no case for fx/fy. We set the correct range
+        // here using overall plotWidth/plotHeight, matching FacetGrid's layout.
+        if (scales.fx.domain.length > 0) {
+            const fxOpts = plotOptions.fx;
+            const fxPaddingInner = fxOpts?.paddingInner ?? fxOpts?.padding ?? 0.1;
+            const fxFn = scaleBand()
+                .domain(scales.fx.domain as string[])
+                .paddingOuter(0)
+                .paddingInner(scales.fx.domain.length > 1 ? fxPaddingInner : 0)
+                .rangeRound([0, plotWidth]) as any;
+            fxFn.ticks = () => scales.fx.domain;
+            scales.fx.fn = normalizeScaleFn(fxFn);
+            scales.fx.range = fxFn.range();
+        }
+        if (scales.fy.domain.length > 0) {
+            const fyOpts = plotOptions.fy;
+            const fyPaddingInner = fyOpts?.paddingInner ?? fyOpts?.padding ?? 0.1;
+            const fyFn = scaleBand()
+                .domain(scales.fy.domain as string[])
+                .paddingOuter(0)
+                .paddingInner(scales.fy.domain.length > 1 ? fyPaddingInner : 0)
+                .rangeRound([0, plotHeight]) as any;
+            fyFn.ticks = () => scales.fy.domain;
+            scales.fy.fn = normalizeScaleFn(fyFn);
+            scales.fy.range = fyFn.range();
+        }
         const colorSymbolRedundant =
             scales.color.uniqueScaleProps?.size === 1 &&
             scales.symbol.uniqueScaleProps?.size === 1 &&
@@ -287,9 +321,9 @@
         return {
             options: plotOptions,
             width,
-            height,
-            facetWidth,
-            facetHeight,
+            height: height ?? 0,
+            facetWidth: facetWidth ?? undefined,
+            facetHeight: facetHeight ?? undefined,
             plotHeight,
             plotWidth,
             scales,
@@ -297,7 +331,7 @@
             hasFilledDotMarks,
             body: plotBody,
             css
-        };
+        } as any;
     }
 
     setContext('svelteplot', {
@@ -357,11 +391,11 @@
         const xDomainExtent =
             x.type === 'band' || x.type === 'point'
                 ? x.domain.length
-                : Math.abs(x.domain[1] - x.domain[0]);
+                : Math.abs((x.domain[1] as number) - (x.domain[0] as number));
         const yDomainExtent =
             y.type === 'band' || y.type === 'point'
                 ? y.domain.length
-                : Math.abs(y.domain[1] - y.domain[0]);
+                : Math.abs((y.domain[1] as number) - (y.domain[0] as number));
         return (
             ((plotWidth / xDomainExtent) * yDomainExtent) / aspectRatio + marginTop + marginBottom
         );
@@ -370,13 +404,13 @@
     function extendPlotOptions(
         initialOpts: Partial<PlotOptions>,
         opts: PlotOptionsParameters
-    ): PlotOptions {
+    ): ResolvedPlotOptions {
         return mergeDeep<PlotOptions>(
-            {},
-            { sortOrdinalDomains: DEFAULTS.sortOrdinalDomains },
-            smartDefaultPlotOptions(opts),
-            initialOptions
-        );
+            {} as Partial<PlotOptions>,
+            { sortOrdinalDomains: DEFAULTS.sortOrdinalDomains } as Partial<PlotOptions>,
+            smartDefaultPlotOptions(opts) as any,
+            initialOptions as any
+        ) as ResolvedPlotOptions;
     }
 
     function maybeMargin(
@@ -419,7 +453,7 @@
         explicitDomains,
         hasProjection,
         margin
-    }: PlotOptionsParameters): PlotOptions {
+    }: PlotOptionsParameters): ResolvedPlotOptions {
         const autoXAxis = explicitScales.has('x') || explicitDomains.has('x');
         const autoYAxis = explicitScales.has('y') || explicitDomains.has('y');
         const isOneDimensional = autoXAxis !== autoYAxis;
@@ -444,9 +478,9 @@
             marginTop: maybeMargin(margin, 'top', DEFAULTS.margin, autoMargins),
             marginBottom: maybeMargin(margin, 'bottom', DEFAULTS.margin, autoMargins),
             inset: isOneDimensional ? 10 : DEFAULTS.inset,
-            grid: (DEFAULTS.gridX?.implicit ?? false) && (DEFAULTS.gridY?.implicit ?? false),
+            grid: isImplicit(DEFAULTS.gridX) && isImplicit(DEFAULTS.gridY),
             axes: (DEFAULTS.axisX?.implicit ?? false) && (DEFAULTS.axisY?.implicit ?? false),
-            frame: DEFAULTS.frame?.implicit ?? false,
+            frame: isImplicit(DEFAULTS.frame),
             projection: null,
             aspectRatio: null,
             facet: {},
@@ -464,7 +498,7 @@
                 align: 0.5,
                 tickSpacing: DEFAULTS.axisX.tickSpacing ?? 80,
                 tickFormat: 'auto',
-                grid: DEFAULTS.gridX.implicit ?? false
+                grid: isImplicit(DEFAULTS.gridX)
             },
             y: {
                 type: 'auto',
@@ -479,7 +513,7 @@
                 align: 0.5,
                 tickSpacing: DEFAULTS.axisY.tickSpacing ?? 50,
                 tickFormat: 'auto',
-                grid: DEFAULTS.gridY.implicit ?? false
+                grid: isImplicit(DEFAULTS.gridY)
             },
             opacity: {
                 type: 'linear',
@@ -504,14 +538,14 @@
                 padding: 0,
                 align: 0
             },
-            color: { type: 'auto', unknown: DEFAULTS.unknown },
+            color: { type: 'auto' as any, unknown: DEFAULTS.unknown },
             length: { type: 'linear' },
             symbol: { type: 'ordinal' },
             fx: { type: 'band', axis: 'top' },
             fy: { type: 'band', axis: 'right' },
             locale: DEFAULTS.locale,
             css: DEFAULTS.css
-        };
+        } as ResolvedPlotOptions;
     }
 
     const mapXY = $derived((x: RawValue, y: RawValue) => {
@@ -542,7 +576,7 @@
                 {#if children}
                     {@render children({
                         width,
-                        height,
+                        height: height ?? 0,
                         options: plotOptions,
                         scales: plotState.scales,
                         mapXY,
@@ -558,7 +592,7 @@
         {#if overlay}<div class="plot-overlay">
                 {@render overlay?.({
                     width,
-                    height,
+                    height: height ?? 0,
                     options: plotOptions,
                     scales: plotState.scales,
                     mapXY,

package/dist/helpers/arrowPath.js

@@ -53,16 +53,21 @@ export function arrowPath(x1, y1, x2, y2, insetStart, insetEnd, headAngle, headL
             if (insetEnd) {
                 const [x, y] = circleCircleIntersect([cx, cy, r], [x2, y2, insetEnd], sign * Math.sign(insetEnd));
                 lineAngle += Math.atan2(y - cy, x - cx) - Math.atan2(y2 - cy, x2 - cx);
-                ((x2 = x), (y2 = y));
+                x2 = x;
+                y2 = y;
             }
         }
         else {
             // For inset straight arrows, offset along the straight line.
             const dx = x2 - x1, dy = y2 - y1, d = Math.hypot(dx, dy);
-            if (insetStart)
-                ((x1 += (dx / d) * insetStart), (y1 += (dy / d) * insetStart));
-            if (insetEnd)
-                ((x2 -= (dx / d) * insetEnd), (y2 -= (dy / d) * insetEnd));
+            if (insetStart) {
+                x1 += (dx / d) * insetStart;
+                y1 += (dy / d) * insetStart;
+            }
+            if (insetEnd) {
+                x2 -= (dx / d) * insetEnd;
+                y2 -= (dy / d) * insetEnd;
+            }
         }
     }
     // The angle of the arrow as it approaches the endpoint, and the

package/dist/helpers/autoScales.d.ts

@@ -1,5 +1,5 @@
 import type { ColorScaleOptions, PlotDefaults, PlotOptions, RawValue, ScaleName, ScaleOptions, ScaleType } from '../types/index.js';
-export declare function autoScale({ name, type, domain, scaleOptions, plotOptions, plotWidth, plotHeight, plotHasFilledDotMarks, plotDefaults }: {
+export declare function autoScale({ name, type, domain, scaleOptions, plotOptions, plotWidth, plotHeight, plotHasFilledDotMarks, plotDefaults: _plotDefaults }: {
     name: ScaleName;
     type: ScaleType;
     domain: RawValue[];
@@ -9,8 +9,8 @@ export declare function autoScale({ name, type, domain, scaleOptions, plotOption
     plotHeight: number;
     plotHasFilledDotMarks: boolean;
     plotDefaults: PlotDefaults;
-}): (val: any) => any;
-export declare function autoScaleColor({ type, domain, scaleOptions, plotOptions, plotWidth, plotHeight, plotHasFilledDotMarks, plotDefaults }: {
+}): any;
+export declare function autoScaleColor({ type, domain, scaleOptions, plotOptions: _plotOptions, plotWidth: _plotWidth, plotHeight: _plotHeight, plotHasFilledDotMarks: _plotHasFilledDotMarks, plotDefaults }: {
     name: ScaleName;
     type: ScaleType;
     domain: RawValue[];

package/dist/helpers/autoScales.js

@@ -41,7 +41,7 @@ const ThresholdScales = {
     quantize: scaleQuantize,
     quantile: scaleQuantile
 };
-export function autoScale({ name, type, domain, scaleOptions, plotOptions, plotWidth, plotHeight, plotHasFilledDotMarks, plotDefaults }) {
+export function autoScale({ name, type, domain, scaleOptions, plotOptions, plotWidth, plotHeight, plotHasFilledDotMarks, plotDefaults: _plotDefaults }) {
     let fn;
     let range;
     range =
@@ -55,7 +55,7 @@ export function autoScale({ name, type, domain, scaleOptions, plotOptions, plotW
     const scaleProps = {
         domain,
         range,
-        ...((type === 'linear' || type === 'log') && scaleOptions.nice
+        ...((type === 'linear' || type === 'log' || type === 'time') && scaleOptions.nice
             ? {
                 nice: scaleOptions.nice ? niceTickCount : true
             }
@@ -92,6 +92,8 @@ export function autoScale({ name, type, domain, scaleOptions, plotOptions, plotW
             }
             : {})
     };
+    // The scale function is augmented with custom ticks() methods below,
+    // so we type it broadly to allow property assignments
     fn = callWithProps(Scales[type], [], scaleProps);
     if (type === 'band' || type === 'point') {
         fn.ticks = () => domain;
@@ -102,13 +104,13 @@ export function autoScale({ name, type, domain, scaleOptions, plotOptions, plotW
     else if (type === 'symlog') {
         const maxabs = Math.max(Math.abs(domain[0]), Math.abs(domain[1]));
         fn.ticks = (count) => {
-            const ticks = getLogTicks([scaleProps.constant + 1, maxabs], count / 2);
+            const ticks = getLogTicks([(scaleProps.constant ?? 1) + 1, maxabs], count / 2);
             return [...ticks.map((t) => -t).reverse(), 0, ...ticks];
         };
     }
     return fn;
 }
-export function autoScaleColor({ type, domain, scaleOptions, plotOptions, plotWidth, plotHeight, plotHasFilledDotMarks, plotDefaults }) {
+export function autoScaleColor({ type, domain, scaleOptions, plotOptions: _plotOptions, plotWidth: _plotWidth, plotHeight: _plotHeight, plotHasFilledDotMarks: _plotHasFilledDotMarks, plotDefaults }) {
     let fn;
     let range;
     // special treatment for color scales
@@ -117,12 +119,14 @@ export function autoScaleColor({ type, domain, scaleOptions, plotOptions, plotWi
         // categorical
         let scheme_ = scheme || plotDefaults.categoricalColorScheme;
         if (isPlainObject(scheme_)) {
-            const newScheme = Object.values(scheme_);
-            const newDomain = Object.keys(scheme_);
+            const schemeObj = scheme_;
+            const newScheme = Object.values(schemeObj);
+            const newDomain = Object.keys(schemeObj);
             // for every value in domain that's not part of the scheme, map to unknown
             for (const v of domain) {
-                if (scheme_[v] == null) {
-                    newDomain.push(v);
+                const key = String(v);
+                if (schemeObj[key] == null) {
+                    newDomain.push(key);
                     newScheme.push(unknown);
                 }
             }
@@ -133,11 +137,13 @@ export function autoScaleColor({ type, domain, scaleOptions, plotOptions, plotWi
         range = Array.isArray(scheme_)
             ? scheme_
             : isCategoricalScheme(scheme_)
-                ? categoricalSchemes.get(scheme_)
+                ? (categoricalSchemes.get(scheme_) ?? [])
                 : ordinalScheme(scheme_)(domain.length);
-        fn = scaleOrdinal().domain(domain).range(range);
+        fn = scaleOrdinal()
+            .domain(domain)
+            .range(range);
     }
-    else if (!!ThresholdScales[type]) {
+    else if (ThresholdScales[type]) {
         const scheme_ = scheme || plotDefaults.colorScheme;
         range =
             Array.isArray(scheme_) && (scaleOptions.n == null || scaleOptions.n === scheme_.length)
@@ -146,7 +152,7 @@ export function autoScaleColor({ type, domain, scaleOptions, plotOptions, plotWi
                     ? // interpolate n colors from custom colors
                         d3Range(n)
                             .map((i) => i / (n - 1))
-                            .map(scaleLinear(scheme_.map((c, i) => i / (scheme_.length - 1)), scheme_).interpolate(interpolateLab))
+                            .map(scaleLinear(scheme_.map((_c, i) => i / (scheme_.length - 1)), scheme_).interpolate(interpolateLab))
                     : interpolate
                         ? d3Range(n).map((i) => interpolate(i / (n - 1)))
                         : isOrdinalScheme(scheme_)
@@ -157,11 +163,15 @@ export function autoScaleColor({ type, domain, scaleOptions, plotOptions, plotWi
         }
         if (scaleOptions.reverse)
             range = range.toReversed();
-        fn = ThresholdScales[type]().domain(domain).range(range);
+        fn = ThresholdScales[type]()
+            .domain(domain)
+            .range(range);
     }
-    else if (!!SequentialScales[type] || !!DivergingScales[type]) {
+    else if (SequentialScales[type] ||
+        DivergingScales[type]) {
         // continuous color scale
-        const scale = SequentialScales[type] || DivergingScales[type];
+        const scale = (SequentialScales[type] ||
+            DivergingScales[type]);
         const scheme_ = scheme || plotDefaults.colorScheme;
         if (interpolate) {
             // user-defined interpolation function [0, 1] -> color
@@ -172,14 +182,14 @@ export function autoScaleColor({ type, domain, scaleOptions, plotOptions, plotWi
             const step = 1 / (scheme_.length - 1);
             fn = scale(domain, (type === 'linear' ? scaleLinear : scaleLog)(d3Range(0, 1 + step / 2, step), scheme_).interpolate(interpolateLab));
         }
-        else if (!!DivergingScales[type] ||
+        else if (DivergingScales[type] ||
             (scaleOptions.type === 'auto' && isDivergingScheme(scheme_))) {
             // diverging color scheme, explicit or auto-detected
             const maxabs = Math.max(Math.abs(domain[0]), Math.abs(domain[1]));
             const domain_ = pivot != null ? [domain[0], pivot, domain[1]] : [-maxabs, 0, maxabs];
             fn = scale(domain_, quantitativeScheme(scheme_));
         }
-        else if (!!SequentialScales[type] ||
+        else if (SequentialScales[type] ||
             (scaleOptions.type === 'auto' && isQuantitativeScheme(scheme_))) {
             // sequential
             fn = scale(domain, quantitativeScheme(scheme_));
@@ -191,7 +201,7 @@ export function autoScaleColor({ type, domain, scaleOptions, plotOptions, plotWi
     if (!fn) {
         console.error('color problem', type);
         // problem
-        fn = () => 'red';
+        fn = (() => 'red');
         fn.range = () => ['red'];
     }
     return fn;

package/dist/helpers/autoTicks.js

@@ -37,6 +37,8 @@ export function autoTicks(type, ticks, interval, domain, scaleFn, count) {
         if (lo == null || hi == null)
             return [];
         const I = maybeInterval(interval);
+        if (!I)
+            return [];
         return I.range(lo, I.offset(hi)).filter((d) => d >= lo && d <= hi);
     }
     return typeof scaleFn.ticks === 'function' ? scaleFn.ticks(count) : [];

package/dist/helpers/callWithProps.d.ts

@@ -1,6 +1,5 @@
-import type { RawValue } from '../types/index.js';
 /**
  * Helper function to call a D3 "function class" while also calling
  * property setter functions on the result.
  */
-export default function <T extends object>(d3func: (...args: RawValue[]) => T, args?: RawValue[], props?: Record<string, RawValue>): T;
+export default function <T extends object>(d3func: (...args: any[]) => T, args?: any[], props?: Record<string, any>): T;

package/dist/helpers/colors.d.ts

@@ -4,10 +4,10 @@ export declare const categoricalSchemes: Map<string, readonly string[]>;
 export declare function isCategoricalScheme(scheme: string): boolean;
 type SchemeGetter = (n: number) => readonly string[];
 export declare function isOrdinalScheme(scheme: ColorScheme): boolean;
-export declare function ordinalScheme(scheme: ColorScheme | string): SchemeGetter;
-export declare function ordinalRange(scheme: ColorScheme | string, length: number): readonly string[];
-export declare function maybeBooleanRange(domain: boolean[], scheme?: ColorScheme | string): unknown[] | undefined;
+export declare function ordinalScheme(scheme: ColorScheme | (string & {})): SchemeGetter;
+export declare function ordinalRange(scheme: ColorScheme | (string & {}), length: number): readonly string[];
+export declare function maybeBooleanRange(domain: boolean[], scheme?: ColorScheme | (string & {})): unknown[] | undefined;
 export declare function isQuantitativeScheme(scheme: string): boolean;
-export declare function quantitativeScheme(scheme: ColorScheme | string): typeof interpolateBrBG | undefined;
+export declare function quantitativeScheme(scheme: ColorScheme | (string & {})): typeof interpolateBrBG | undefined;
 export declare function isDivergingScheme(scheme: string): boolean;
 export {};

package/dist/helpers/facets.d.ts

@@ -1,4 +1,4 @@
-import type { GenericMarkOptions, Mark, RawValue } from '../types/index.js';
+import type { GenericMarkOptions, Mark, PlotState, RawValue } from '../types/index.js';
 /**
  * This function tracks which facets are "empty", meaning that they don't contain
  * any "facetted" data points. This can happen when fx and fy are combined and
@@ -10,3 +10,44 @@ import type { GenericMarkOptions, Mark, RawValue } from '../types/index.js';
  * @returns
  */
 export declare function getEmptyFacets(marks: Mark<GenericMarkOptions>[], fxValues: RawValue[], fyValues: RawValue[]): Map<RawValue, Map<RawValue, boolean>>;
+/**
+ * Stable string key for a (fxValue, fyValue) pair, used as Map keys
+ * for the keyed tree map in Pointer/HTMLTooltip.
+ */
+export declare function facetKey(fxValue: RawValue | boolean, fyValue: RawValue | boolean): string;
+/**
+ * Inverts a d3 band scale: given a pixel position, returns the domain value
+ * whose band contains that position, or undefined if outside all bands.
+ *
+ * d3.scaleBand has no .invert(), so we iterate the domain (O(n), n = facet count,
+ * typically <20).
+ */
+export declare function invertBand(scale: {
+    (value: string): number | undefined;
+    bandwidth(): number;
+}, domain: readonly (string | RawValue)[], pixelPos: number): RawValue | undefined;
+/**
+ * Walk up the DOM from `target` to find the nearest `g.facet` element.
+ * Returns the facet x/y indices from `data-facet-x` and `data-facet-y`
+ * attributes, or null if no facet element is found.
+ */
+export declare function findFacetFromDOM(target: Element | null): {
+    fxIndex: number;
+    fyIndex: number;
+} | null;
+/**
+ * Detect which facet the mouse event is in and compute the pixel offset.
+ *
+ * Strategy: try DOM walk first (fast, reliable when the event target is inside
+ * a facet `<g>`). Fall back to inverting the fx/fy band scales from the mouse
+ * position (works in jsdom where getBoundingClientRect returns zeros).
+ *
+ * Returns { fxValue, fyValue, offsetX, offsetY } where offset is the pixel
+ * translation of the facet from the plot body origin.
+ */
+export declare function detectFacet(evt: MouseEvent, plot: PlotState): {
+    fxValue: RawValue | boolean;
+    fyValue: RawValue | boolean;
+    offsetX: number;
+    offsetY: number;
+};

package/dist/helpers/facets.js

@@ -46,4 +46,86 @@ export function getEmptyFacets(marks, fxValues, fyValues) {
     }
     return out;
 }
-// TODO: write unit tests
+/**
+ * Stable string key for a (fxValue, fyValue) pair, used as Map keys
+ * for the keyed tree map in Pointer/HTMLTooltip.
+ */
+export function facetKey(fxValue, fyValue) {
+    return JSON.stringify([fxValue, fyValue]);
+}
+/**
+ * Inverts a d3 band scale: given a pixel position, returns the domain value
+ * whose band contains that position, or undefined if outside all bands.
+ *
+ * d3.scaleBand has no .invert(), so we iterate the domain (O(n), n = facet count,
+ * typically <20).
+ */
+export function invertBand(scale, domain, pixelPos) {
+    const bw = scale.bandwidth();
+    for (const value of domain) {
+        const start = scale(value);
+        if (start != null && pixelPos >= start && pixelPos < start + bw) {
+            return value;
+        }
+    }
+    return undefined;
+}
+/**
+ * Walk up the DOM from `target` to find the nearest `g.facet` element.
+ * Returns the facet x/y indices from `data-facet-x` and `data-facet-y`
+ * attributes, or null if no facet element is found.
+ */
+export function findFacetFromDOM(target) {
+    let el = target;
+    while (el) {
+        if (el.classList?.contains('facet')) {
+            const fxIndex = parseInt(el.dataset?.facetX ?? '0', 10);
+            const fyIndex = parseInt(el.dataset?.facetY ?? '0', 10);
+            return { fxIndex, fyIndex };
+        }
+        el = el.parentElement;
+    }
+    return null;
+}
+/**
+ * Detect which facet the mouse event is in and compute the pixel offset.
+ *
+ * Strategy: try DOM walk first (fast, reliable when the event target is inside
+ * a facet `<g>`). Fall back to inverting the fx/fy band scales from the mouse
+ * position (works in jsdom where getBoundingClientRect returns zeros).
+ *
+ * Returns { fxValue, fyValue, offsetX, offsetY } where offset is the pixel
+ * translation of the facet from the plot body origin.
+ */
+export function detectFacet(evt, plot) {
+    const fxScale = plot.scales.fx;
+    const fyScale = plot.scales.fy;
+    const fxDomain = fxScale.domain;
+    const fyDomain = fyScale.domain;
+    const hasFx = fxDomain.length > 0;
+    const hasFy = fyDomain.length > 0;
+    // Try DOM walk
+    const facetInfo = findFacetFromDOM(evt.target);
+    if (facetInfo) {
+        const fxValue = hasFx ? fxDomain[facetInfo.fxIndex] : true;
+        const fyValue = hasFy ? fyDomain[facetInfo.fyIndex] : true;
+        return {
+            fxValue,
+            fyValue,
+            offsetX: hasFx ? (fxScale.fn(fxValue) ?? 0) : 0,
+            offsetY: hasFy ? (fyScale.fn(fyValue) ?? 0) : 0
+        };
+    }
+    // Fallback: invert mouse position against band scales
+    const bodyRect = plot.body.getBoundingClientRect();
+    const svgX = evt.clientX - bodyRect.left;
+    const svgY = evt.clientY - bodyRect.top;
+    const fxValue = hasFx ? (invertBand(fxScale.fn, fxDomain, svgX) ?? fxDomain[0]) : true;
+    const fyValue = hasFy ? (invertBand(fyScale.fn, fyDomain, svgY) ?? fyDomain[0]) : true;
+    return {
+        fxValue,
+        fyValue,
+        offsetX: hasFx ? (fxScale.fn(fxValue) ?? 0) : 0,
+        offsetY: hasFy ? (fyScale.fn(fyValue) ?? 0) : 0
+    };
+}

package/dist/helpers/index.js

@@ -12,7 +12,7 @@ export function coalesce(...args) {
     return null; // Return null if all arguments are null or undefined
 }
 export function testFilter(datum, options) {
-    return options.filter == null || resolveProp(options.filter, datum);
+    return (options.filter == null || resolveProp(options.filter, datum));
 }
 export function randomId() {
     return Math.ceil(1e9 + Math.random() * 1e9).toString(36);

package/dist/helpers/math.js

@@ -16,7 +16,7 @@ export function normdev(p) {
         return -Infinity;
     if (p == 1)
         return Infinity;
-    const a0 = 3.387132872796366608, a1 = 1.3314166789178437745e2, a2 = 1.9715909503065514427e3, a3 = 1.3731693765509461125e4, a4 = 4.5921953931549871457e4, a5 = 6.7265770927008700853e4, a6 = 3.3430575583588128105e4, a7 = 2.5090809287301226727e3, b1 = 4.2313330701600911252e1, b2 = 6.871870074920579083e2, b3 = 5.3941960214247511077e3, b4 = 2.1213794301586595867e4, b5 = 3.930789580009271061e4, b6 = 2.8729085735721942674e4, b7 = 5.226495278852854561e3, c0 = 1.42343711074968357734, c1 = 4.6303378461565452959, c2 = 5.7694972214606914055, c3 = 3.64784832476320460504, c4 = 1.27045825245236838258, c5 = 2.4178072517745061177e-1, c6 = 2.27238449892691845833e-2, c7 = 7.7454501427834140764e-4, d1 = 2.05319162663775882187, d2 = 1.6763848301838038494, d3 = 6.8976733498510000455e-1, d4 = 1.4810397642748007459e-1, d5 = 1.51986665636164571966e-2, d6 = 5.475938084995344946e-4, d7 = 1.05075007164441684324e-9, e0 = 6.6579046435011037772, e1 = 5.4637849111641143699, e2 = 1.7848265399172913358, e3 = 2.9656057182850489123e-1, e4 = 2.6532189526576123093e-2, e5 = 1.2426609473880784386e-3, e6 = 2.71155556874348757815e-5, e7 = 2.01033439929228813265e-7, f1 = 5.9983220655588793769e-1, f2 = 1.3692988092273580531e-1, f3 = 1.48753612908506148525e-2, f4 = 7.868691311456132591e-4, f5 = 1.8463183175100546818e-5, f6 = 1.4215117583164458887e-7, f7 = 2.04426310338993978564e-15;
+    const a0 = 3.3871328727963665, a1 = 133.14166789178438, a2 = 1971.5909503065513, a3 = 13731.69376550946, a4 = 45921.95393154987, a5 = 67265.7709270087, a6 = 33430.57558358813, a7 = 2509.0809287301227, b1 = 42.31333070160091, b2 = 687.1870074920579, b3 = 5394.196021424751, b4 = 21213.794301586597, b5 = 39307.89580009271, b6 = 28729.085735721943, b7 = 5226.495278852854, c0 = 1.4234371107496835, c1 = 4.630337846156546, c2 = 5.769497221460691, c3 = 3.6478483247632045, c4 = 1.2704582524523684, c5 = 0.2417807251774506, c6 = 0.022723844989269184, c7 = 0.0007745450142783414, d1 = 2.053191626637759, d2 = 1.6763848301838038, d3 = 0.6897673349851, d4 = 0.14810397642748008, d5 = 0.015198666563616457, d6 = 0.0005475938084995345, d7 = 1.0507500716444169e-9, e0 = 6.657904643501103, e1 = 5.463784911164114, e2 = 1.7848265399172913, e3 = 0.29656057182850487, e4 = 0.026532189526576124, e5 = 0.0012426609473880784, e6 = 0.000027115555687434876, e7 = 2.0103343992922881e-7, f1 = 0.599832206555888, f2 = 0.1369298809227358, f3 = 0.014875361290850615, f4 = 0.0007868691311456133, f5 = 0.000018463183175100548, f6 = 1.421511758316446e-7, f7 = 2.0442631033899397e-15;
     const q = p - 0.5;
     let r, z;
     // p close to 0.5

package/dist/helpers/mergeDeep.d.ts

@@ -1,5 +1,3 @@
-type ObjectType = {
-    [key: string]: any;
-};
+type ObjectType = Record<string, unknown>;
 export default function mergeDeep<T extends ObjectType>(target: Partial<T>, ...sources: Partial<T>[]): T;
 export {};