@eifi1/ui-kit 0.33.0 → 0.34.0

package/dist/components/chart-zoom.d.ts

@@ -1,205 +1,39 @@
-import * as react from 'react';
-import { ReactNode, ComponentType } from 'react';
-import { InverseScaleFunction } from 'recharts';
-import { SeriesChartLabels } from './series-chart-labels.js';
-
-/** The y axis a series lands on when it names none — the single shared scale most
- *  charts have. `SeriesChart` and the fit below agree on it by importing this. */
-declare const DEFAULT_Y_AXIS = "y";
-/**
- * How square a selection has to be before it counts as a box: the shorter side
- * against the longer, both as fractions of the plot. At 0.5 a selection twice as wide
- * as it is tall is still a box and one three times as wide is a band.
- */
-declare const ZOOM_SQUARE_ENOUGH = 0.5;
-/** Below this a drag is a click that moved, not a selection. In fractions of the plot,
- *  so it is the same gesture on a phone and on a wall display. */
-declare const ZOOM_MIN_DRAG = 0.02;
-type ZoomAxes = "both" | "x" | "y";
-/** Which axes a drag zooms — or `null` for a drag too small to mean one, or a plot
- *  that has not been laid out yet. Direction does not matter; proportion does. */
-declare function zoomAxesFor(dx: number, dy: number, width: number, height: number, threshold?: number, 
-/** A chart that zooms ONE axis only (see {@link ZoomTarget.zoomAxes}): every drag is
- *  a band along it, however it was drawn, and a drag with no extent along it is
- *  nothing — a tall narrow drag over a bar chart names no stretch of the abscissa. */
-only?: "x" | "y"): ZoomAxes | null;
-/** What a drag chose, in DATA coordinates, and which axes it actually named — the
- *  caller needs the second to know which of the two it may derive from the other. */
-interface ZoomSelection {
-    which: ZoomAxes;
-    x?: [number, number];
-    /** One window per y axis, keyed by axis id: they are in different units. */
-    y: Record<string, [number, number]>;
-}
-/** A drag, in the chart's own pixel coordinates. */
-interface ZoomDrag {
-    fromX: number;
-    fromY: number;
-    toX: number;
-    toY: number;
-}
-/**
- * A finished drag as a selection, or `null` when it selects nothing.
- *
- * `xInverse` and `yInverse(axisId)` are recharts' pixel→value functions; an axis whose
- * function is missing, or whose ends come back non-finite, is left out rather than
- * handed a NaN window.
- */
-declare function selectionFromDrag(drag: ZoomDrag, plot: {
-    width: number;
-    height: number;
-}, xInverse: InverseScaleFunction | undefined, yInverse: (axisId: string) => InverseScaleFunction | undefined, axisIds: readonly string[], only?: "x" | "y"): ZoomSelection | null;
-/** One row of a zoomable chart. Loose on purpose: a row also carries what the chart
- *  does not plot — keksdose's `rawPeriod` for a drilldown, a label for a category axis —
- *  and only the finite NUMBERS in it are ever read as samples. */
-type ZoomRow = Readonly<Record<string, unknown>>;
-/** A series as the fit sees it. `stack` groups bars/areas drawn on top of each other
- *  (recharts' `stackId`), whose extent is their SUM, not any one of them. */
-interface ZoomFitSeries {
-    key: string;
-    axis?: string;
-    stack?: string;
-    /** Only `"line"` matters here: recharts cannot stack a line, so a line's `stack` is
-     *  ignored rather than summed into a height nothing on the chart reaches. */
-    type?: string;
-}
-/** What a band refit needs to know about the chart — a subset of `SeriesChart`'s own
- *  props, so a chart hands its data straight over. */
-interface ZoomFitSource {
-    rows: readonly ZoomRow[];
-    series: readonly ZoomFitSeries[];
-    axes: readonly {
-        id: string;
-    }[];
-    xKey: string;
-}
-/**
- * The lowest and highest value an axis DRAWS over the rows whose abscissa is inside
- * `window` (every row when there is none) — `undefined` when it draws nothing finite.
- *
- * Stack-aware, and that is why it exists: a stack of three bars reaches the SUM of
- * them, and fitting the axis to the tallest single layer (what fitting on values did)
- * cuts the top two thirds of every stack off. Positive and negative layers are summed
- * apart, as recharts draws them under `stackOffset="sign"` — a month with 900 income
- * and −300 expense stacks up to 900 and down to −300, not to 600. A stacked extent
- * therefore always contains the zero its layers stand on.
- *
- * `SeriesChart` fits its axes with this and the zoom refits them with it, so the two
- * cannot disagree about how tall a stack is.
- */
-declare function axisExtent(source: ZoomFitSource, axisId: string, window?: readonly [number, number]): [number, number] | undefined;
-/**
- * Each y axis fitted to the samples inside an x window — what a band across x leaves
- * the axes nobody dragged showing. Zoom into a tenth of a sweep and a y axis still
- * scaled to the whole run draws that tenth as a flat line, which is the one thing the
- * zoom was for; so the unnamed axes are refitted, which is what "zoom" means everywhere
- * else.
- *
- * An axis with nothing inside the window is left OUT rather than collapsed: a window
- * between two samples is one where the chart should keep drawing the line across.
- */
-declare function fitYToX(source: ZoomFitSource, window: readonly [number, number]): Record<string, [number, number]>;
-/**
- * The x window that holds every sample inside a set of y windows — the other direction
- * of the same idea. A channel crossing its band once gives a tight window; one that
- * oscillates through it gives back most of the sweep, which is the truthful answer.
- * `undefined` when no sample qualifies, rather than a guess.
- */
-declare function fitXToY(source: ZoomFitSource, windows: Readonly<Record<string, readonly [number, number]>>): [number, number] | undefined;
-/**
- * What a chart remembers about its zoom: the x window, and the y windows the reader
- * DRAGGED. `y: null` means "derive y from x" — the split is the whole design: what was
- * dragged is kept, and what follows from it is recomputed on every render, so a band
- * across x refits y here and in every chart sharing the window.
- */
-interface ZoomState {
-    x?: [number, number];
-    y: Record<string, [number, number]> | null;
-}
-declare const NO_ZOOM: ZoomState;
-/**
- * The state after a selection. Two band drags COMPOSE rather than the second undoing
- * the first: a band down y keeps the x window when the band holds no samples, and
- * otherwise pulls x in to where they are.
- */
-declare function zoomAfter(state: ZoomState, selection: ZoomSelection, source: ZoomFitSource): ZoomState;
-/** The domains a chart draws for a state: the x window as is, and each y axis either
- *  as dragged or fitted to the x window. `{}` means "fit your own data". */
-declare function zoomDomains(state: ZoomState, source: ZoomFitSource): {
-    xDomain?: [number, number];
-    yDomains: Record<string, [number, number]>;
-};
-/** What the wrapped chart is handed. It applies the domains to its own axes and renders
- *  `layer` INSIDE the recharts chart, where recharts' hooks answer. */
-interface ZoomBinding {
-    xDomain?: [number, number];
-    yDomains: Record<string, [number, number]>;
-    layer: ReactNode;
-}
-/**
- * Which axes a chart lets a drag zoom. `"none"` draws no drag layer and no reset.
- * A drag on a one-axis chart is always a band along that axis (see {@link zoomAxesFor}).
- */
-type ZoomAxesSetting = ZoomAxes | "none";
-/**
- * The zoom a chart gets when it does not say, read off what its series ARE.
- *
- * - Only lines: `"both"` — lenkbank's measurement plots, unchanged.
- * - Any area: `"x"`. An area's height is a length from zero, and a y window that cuts
- *   the baseline off draws a band of 40 as three times one of 20 — so its y axis refits
- *   to the x window (still from zero), and a drag never names a y range.
- * - Any bar: `"none"`. A bar chart is a handful of periods read one bar at a time, and
- *   in keksdose every one of them is CLICKED — to drill into a payee, a month, a budget
- *   line — which a drag layer over the plot would swallow. A chart of many bars opts
- *   back in with `zoomAxes: "x"`; a click then reports the period, not the bar.
- */
-declare function defaultZoomAxes(series: readonly {
-    type?: string;
-}[] | undefined): ZoomAxesSetting;
-/** The props `withChartZoom` reads off the chart it wraps. */
-interface ZoomTarget {
-    /** Default: the single axis {@link DEFAULT_Y_AXIS}. */
-    axes?: readonly {
-        id: string;
-        hide?: boolean;
-    }[];
-    /** The chart's own data, so a band can refit the axis it did not name. Optional: a
-     *  chart with nothing plotted has nothing to fit to. */
-    rows?: readonly ZoomRow[];
-    series?: readonly ZoomFitSeries[];
-    x?: {
-        key?: string;
-    };
-    zoom?: ZoomBinding;
-    labels?: Partial<SeriesChartLabels>;
-    /** Which axes a drag may zoom. Default: {@link defaultZoomAxes} of `series`. */
-    zoomAxes?: ZoomAxesSetting;
-}
-/**
- * One x window for several charts.
- *
- * A column of charts over one abscissa is one picture, and zooming one of them and not
- * the rest turns it into several pictures of different things. Every zoomable chart
- * inside this shares the x window: any drag in any of them moves all of them.
- *
- * **Only x.** The y axes stay each chart's own — they are in different units — and
- * each refits its own y to what is inside the shared window.
- */
-declare function SharedXZoom({ children }: {
-    children: ReactNode;
-}): react.JSX.Element;
-/**
- * Wrap a chart in drag-to-zoom.
- *
- * The chart receives a `zoom` binding: it applies `xDomain`/`yDomains` to its axes
- * (with `allowDataOverflow`, so recharts clips to the window instead of widening it
- * back out) and renders `layer` as a child of its recharts chart. A reset button
- * appears over the chart's top end corner while it is zoomed — a real button, so the
- * keyboard can undo what the pointer did.
- */
-declare function withChartZoom<P extends ZoomTarget>(Chart: ComponentType<P>): {
-    (props: P): react.JSX.Element;
-    displayName: string;
-};
-
-export { DEFAULT_Y_AXIS, NO_ZOOM, SharedXZoom, ZOOM_MIN_DRAG, ZOOM_SQUARE_ENOUGH, type ZoomAxes, type ZoomAxesSetting, type ZoomBinding, type ZoomDrag, type ZoomFitSeries, type ZoomFitSource, type ZoomRow, type ZoomSelection, type ZoomState, type ZoomTarget, axisExtent, defaultZoomAxes, fitXToY, fitYToX, selectionFromDrag, withChartZoom, zoomAfter, zoomAxesFor, zoomDomains };
+import * as core from "./chart-zoom-core.js";
+export { SharedXZoom } from "./chart-zoom-core.js";
+export type { ZoomAxes, ZoomAxesSetting, ZoomBinding, ZoomDrag, ZoomFitSeries, ZoomFitSource, ZoomRow, ZoomSelection, ZoomState, ZoomTarget, } from "./chart-zoom-core.js";
+/** @deprecated 0.34 — a series without `axis` is on the chart's single y axis, `"y"`;
+ *  removed in 0.35 (API-6b). */
+export declare const DEFAULT_Y_AXIS = "y";
+/** @deprecated 0.34 — SeriesChart's zoom, which reads it; removed in 0.35 (API-6b). */
+export declare const ZOOM_SQUARE_ENOUGH = 0.5;
+/** @deprecated 0.34 — SeriesChart's zoom, which reads it; removed in 0.35 (API-6b). */
+export declare const ZOOM_MIN_DRAG = 0.02;
+/** @deprecated 0.34 — SeriesChart's zoom, which reads a drag this way; removed in 0.35
+ *  (API-6b). */
+export declare const zoomAxesFor: typeof core.zoomAxesFor;
+/** @deprecated 0.34 — SeriesChart's zoom, which reads a drag this way; removed in 0.35
+ *  (API-6b). */
+export declare const selectionFromDrag: typeof core.selectionFromDrag;
+/** @deprecated 0.34 — SeriesChart fits its axes with it; removed in 0.35 (API-6b). */
+export declare const axisExtent: typeof core.axisExtent;
+/** @deprecated 0.34 — SeriesChart's zoom, which refits the axes a drag did not name;
+ *  removed in 0.35 (API-6b). */
+export declare const fitYToX: typeof core.fitYToX;
+/** @deprecated 0.34 — SeriesChart's zoom, which refits the axes a drag did not name;
+ *  removed in 0.35 (API-6b). */
+export declare const fitXToY: typeof core.fitXToY;
+/** @deprecated 0.34 — SeriesChart's zoom, which keeps its own state; removed in 0.35
+ *  (API-6b). */
+export declare const NO_ZOOM: core.ZoomState;
+/** @deprecated 0.34 — SeriesChart's zoom, which keeps its own state; removed in 0.35
+ *  (API-6b). */
+export declare const zoomAfter: typeof core.zoomAfter;
+/** @deprecated 0.34 — SeriesChart's zoom, which keeps its own state; removed in 0.35
+ *  (API-6b). */
+export declare const zoomDomains: typeof core.zoomDomains;
+/** @deprecated 0.34 — SeriesChart's `zoomAxes` prop, which says what its default is;
+ *  removed in 0.35 (API-6b). */
+export declare const defaultZoomAxes: typeof core.defaultZoomAxes;
+/** @deprecated 0.34 — SeriesChart, which is a chart wrapped in it, and SharedXZoom;
+ *  removed in 0.35 (API-6b). */
+export declare const withChartZoom: typeof core.withChartZoom;

package/dist/components/chart-zoom.js

@@ -1,320 +1,19 @@
 "use client";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { createContext, useContext, useEffect, useRef, useState } from "react";
-import {
-  usePlotArea,
-  useXAxisInverseScale,
-  useYAxisInverseScale
-} from "recharts";
-import { X } from "lucide-react";
-import { cn } from "../lib/cn.js";
-import { FOCUS_RING } from "./focus-ring.js";
-import { useKitLabels } from "../i18n/kit-labels.js";
-import { DEFAULT_SERIES_CHART_LABELS } from "./series-chart-labels.js";
-const DEFAULT_Y_AXIS = "y";
-const ZOOM_SQUARE_ENOUGH = 0.5;
-const ZOOM_MIN_DRAG = 0.02;
-function zoomAxesFor(dx, dy, width, height, threshold = ZOOM_SQUARE_ENOUGH, only) {
-  if (!(width > 0) || !(height > 0)) return null;
-  const across = Math.abs(dx) / width;
-  const down = Math.abs(dy) / height;
-  if (only === "x") return across < ZOOM_MIN_DRAG ? null : "x";
-  if (only === "y") return down < ZOOM_MIN_DRAG ? null : "y";
-  if (across < ZOOM_MIN_DRAG && down < ZOOM_MIN_DRAG) return null;
-  const longer = Math.max(across, down);
-  const shorter = Math.min(across, down);
-  if (shorter / longer >= threshold) return "both";
-  return across > down ? "x" : "y";
-}
-function ordered(a, b) {
-  return a <= b ? [a, b] : [b, a];
-}
-function selectionFromDrag(drag, plot, xInverse, yInverse, axisIds, only) {
-  const which = zoomAxesFor(
-    drag.toX - drag.fromX,
-    drag.toY - drag.fromY,
-    plot.width,
-    plot.height,
-    ZOOM_SQUARE_ENOUGH,
-    only
-  );
-  if (!which) return null;
-  const next = { which, y: {} };
-  if (which !== "y" && xInverse) {
-    const from = Number(xInverse(drag.fromX));
-    const to = Number(xInverse(drag.toX));
-    if (Number.isFinite(from) && Number.isFinite(to)) next.x = ordered(from, to);
-  }
-  if (which !== "x") {
-    for (const id of axisIds) {
-      const inverse = yInverse(id);
-      if (!inverse) continue;
-      const from = Number(inverse(drag.fromY));
-      const to = Number(inverse(drag.toY));
-      if (Number.isFinite(from) && Number.isFinite(to)) next.y[id] = ordered(from, to);
-    }
-  }
-  return next.x || Object.keys(next.y).length ? next : null;
-}
-const FIT_AIR = 0.05;
-function airy(low, high) {
-  const span = high - low;
-  const air = span > 0 ? span * FIT_AIR : Math.max(Math.abs(high), 1) * FIT_AIR;
-  return [low - air, high + air];
-}
-function widen(span, value) {
-  if (typeof value !== "number" || !Number.isFinite(value)) return span;
-  if (!span) return [value, value];
-  if (value < span[0]) span[0] = value;
-  else if (value > span[1]) span[1] = value;
-  return span;
-}
-function keysOn(source, axisId) {
-  return source.series.filter((entry) => (entry.axis ?? DEFAULT_Y_AXIS) === axisId).map((entry) => entry.key);
-}
-const layer = (value) => typeof value === "number" && Number.isFinite(value) ? value : 0;
-function axisExtent(source, axisId, window) {
-  const mine = source.series.filter((entry) => (entry.axis ?? DEFAULT_Y_AXIS) === axisId);
-  const loose = [];
-  const stacks = /* @__PURE__ */ new Map();
-  for (const entry of mine) {
-    if (entry.stack === void 0 || entry.type === "line" || entry.type === void 0) {
-      loose.push(entry.key);
-    } else {
-      stacks.set(entry.stack, [...stacks.get(entry.stack) ?? [], entry.key]);
-    }
-  }
-  let span;
-  for (const row of source.rows) {
-    if (window) {
-      const at = row[source.xKey];
-      if (typeof at !== "number" || !(at >= window[0] && at <= window[1])) continue;
-    }
-    for (const key of loose) span = widen(span, row[key]);
-    for (const keys of stacks.values()) {
-      let up = 0;
-      let down = 0;
-      let any = false;
-      for (const key of keys) {
-        const value = layer(row[key]);
-        any ||= typeof row[key] === "number" && Number.isFinite(row[key]);
-        if (value >= 0) up += value;
-        else down += value;
-      }
-      if (!any) continue;
-      span = widen(widen(span, down), up);
-    }
-  }
-  return span;
-}
-function fitYToX(source, window) {
-  const fitted = {};
-  for (const axis of source.axes) {
-    const span = axisExtent(source, axis.id, window);
-    if (span) fitted[axis.id] = airy(span[0], span[1]);
-  }
-  return fitted;
-}
-function fitXToY(source, windows) {
-  let hits;
-  for (const [axisId, [low, high]] of Object.entries(windows)) {
-    for (const key of keysOn(source, axisId)) {
-      for (const row of source.rows) {
-        const value = row[key];
-        if (typeof value === "number" && Number.isFinite(value) && value >= low && value <= high) {
-          hits = widen(hits, row[source.xKey]);
-        }
-      }
-    }
-  }
-  return hits ? airy(hits[0], hits[1]) : void 0;
-}
-const NO_ZOOM = { x: void 0, y: null };
-function zoomAfter(state, selection, source) {
-  if (selection.which === "both") return { x: selection.x, y: selection.y };
-  if (selection.which === "x") return { x: selection.x, y: null };
-  return { x: fitXToY(source, selection.y) ?? state.x, y: selection.y };
-}
-function zoomDomains(state, source) {
-  return {
-    xDomain: state.x,
-    yDomains: state.y ?? (state.x ? fitYToX(source, state.x) : {})
-  };
-}
-function defaultZoomAxes(series) {
-  if (series?.some((entry) => entry.type === "bar")) return "none";
-  if (series?.some((entry) => entry.type === "area")) return "x";
-  return "both";
-}
-const SharedX = createContext(null);
-function SharedXZoom({ children }) {
-  const [window, set] = useState(void 0);
-  return /* @__PURE__ */ jsx(SharedX.Provider, { value: { window, set }, children });
-}
-function withChartZoom(Chart) {
-  function Zoomable(props) {
-    const labels = useKitLabels("seriesChart", DEFAULT_SERIES_CHART_LABELS, props.labels);
-    const group = useContext(SharedX);
-    const [ownX, setOwnX] = useState(void 0);
-    const [ownY, setOwnY] = useState(null);
-    const xWindow = group ? group.window : ownX;
-    const setXWindow = group ? group.set : setOwnX;
-    const axes = props.axes ?? [{ id: DEFAULT_Y_AXIS }];
-    const setting = props.zoomAxes ?? defaultZoomAxes(props.series);
-    const only = setting === "x" || setting === "y" ? setting : void 0;
-    const source = {
-      rows: props.rows ?? [],
-      series: [...props.series ?? []],
-      axes: [...axes],
-      xKey: props.x?.key ?? "x"
-    };
-    const state = { x: xWindow, y: ownY };
-    const zoomed = xWindow !== void 0 || ownY !== null;
-    const empty = props.rows?.length === 0 || props.series?.length === 0;
-    const clear = () => {
-      setXWindow(void 0);
-      setOwnY(null);
-    };
-    if (setting === "none") {
-      return /* @__PURE__ */ jsx("div", { className: "relative", children: /* @__PURE__ */ jsx(Chart, { ...props, zoom: { yDomains: {}, layer: null } }) });
-    }
-    const binding = {
-      ...zoomDomains(state, source),
-      layer: /* @__PURE__ */ jsx(
-        ZoomLayer,
-        {
-          axisIds: axes.map((axis) => axis.id),
-          only,
-          label: labels.zoomHint,
-          onZoom: (selection) => {
-            const next = zoomAfter(state, selection, source);
-            if (next.x !== xWindow) setXWindow(next.x);
-            setOwnY(next.y);
-          },
-          onReset: clear
-        }
-      )
-    };
-    return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-      /* @__PURE__ */ jsx(Chart, { ...props, zoom: binding }),
-      zoomed && !empty && /* @__PURE__ */ jsxs(
-        "button",
-        {
-          type: "button",
-          onClick: clear,
-          className: cn(
-            "absolute end-1 top-1 z-10 inline-flex items-center gap-1 rounded border border-[var(--border)] bg-[var(--bg-surface)]/90 px-1.5 py-0.5 text-micro text-[var(--text-muted)] backdrop-blur transition-colors hover:text-[var(--text-primary)]",
-            FOCUS_RING
-          ),
-          children: [
-            /* @__PURE__ */ jsx(X, { "aria-hidden": true, className: "size-3" }),
-            " ",
-            labels.resetZoom
-          ]
-        }
-      )
-    ] });
-  }
-  Zoomable.displayName = `withChartZoom(${Chart.displayName ?? Chart.name ?? "Chart"})`;
-  return Zoomable;
-}
-function ZoomLayer({
-  axisIds,
-  only,
-  label,
-  onZoom,
-  onReset
-}) {
-  const plot = usePlotArea();
-  const xInverse = useXAxisInverseScale();
-  const [scales] = useState(() => /* @__PURE__ */ new Map());
-  const [drag, setDrag] = useState(null);
-  const draggedRef = useRef(false);
-  if (!plot || plot.width <= 0 || plot.height <= 0) return null;
-  const at = (event) => {
-    const box = event.currentTarget.getBoundingClientRect();
-    return { x: event.clientX - box.left + plot.x, y: event.clientY - box.top + plot.y };
-  };
-  const finish = () => {
-    if (!drag) return;
-    setDrag(null);
-    const selection = selectionFromDrag(drag, plot, xInverse, (id) => scales.get(id), axisIds, only);
-    draggedRef.current = selection !== null;
-    if (selection) onZoom(selection);
-  };
-  const which = drag ? zoomAxesFor(
-    drag.toX - drag.fromX,
-    drag.toY - drag.fromY,
-    plot.width,
-    plot.height,
-    ZOOM_SQUARE_ENOUGH,
-    only
-  ) : null;
-  return /* @__PURE__ */ jsxs("g", { children: [
-    axisIds.map((id) => /* @__PURE__ */ jsx(AxisProbe, { axisId: id, scales }, id)),
-    drag && which && /* @__PURE__ */ jsx(
-      "rect",
-      {
-        x: which === "y" ? plot.x : Math.min(drag.fromX, drag.toX),
-        y: which === "x" ? plot.y : Math.min(drag.fromY, drag.toY),
-        width: which === "y" ? plot.width : Math.abs(drag.toX - drag.fromX),
-        height: which === "x" ? plot.height : Math.abs(drag.toY - drag.fromY),
-        className: "fill-[var(--brand)]/15 stroke-[var(--brand)]",
-        strokeDasharray: "4 3",
-        pointerEvents: "none"
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      "rect",
-      {
-        x: plot.x,
-        y: plot.y,
-        width: plot.width,
-        height: plot.height,
-        fill: "transparent",
-        role: "application",
-        "aria-label": label,
-        style: { cursor: "crosshair" },
-        onPointerDown: (event) => {
-          if (event.button !== 0) return;
-          draggedRef.current = false;
-          const point = at(event);
-          try {
-            event.currentTarget.setPointerCapture(event.pointerId);
-          } catch {
-          }
-          setDrag({ fromX: point.x, fromY: point.y, toX: point.x, toY: point.y });
-        },
-        onPointerMove: (event) => {
-          if (!drag) return;
-          const point = at(event);
-          setDrag({ ...drag, toX: point.x, toY: point.y });
-        },
-        onPointerUp: finish,
-        onPointerCancel: () => setDrag(null),
-        onClick: (event) => {
-          if (!draggedRef.current) return;
-          draggedRef.current = false;
-          event.stopPropagation();
-        },
-        onDoubleClick: onReset
-      }
-    )
-  ] });
-}
-function AxisProbe({
-  axisId,
-  scales
-}) {
-  const inverse = useYAxisInverseScale(axisId);
-  useEffect(() => {
-    scales.set(axisId, inverse);
-    return () => {
-      scales.delete(axisId);
-    };
-  }, [axisId, inverse, scales]);
-  return null;
-}
+import * as core from "./chart-zoom-core.js";
+import { SharedXZoom } from "./chart-zoom-core.js";
+const DEFAULT_Y_AXIS = core.DEFAULT_Y_AXIS;
+const ZOOM_SQUARE_ENOUGH = core.ZOOM_SQUARE_ENOUGH;
+const ZOOM_MIN_DRAG = core.ZOOM_MIN_DRAG;
+const zoomAxesFor = core.zoomAxesFor;
+const selectionFromDrag = core.selectionFromDrag;
+const axisExtent = core.axisExtent;
+const fitYToX = core.fitYToX;
+const fitXToY = core.fitXToY;
+const NO_ZOOM = core.NO_ZOOM;
+const zoomAfter = core.zoomAfter;
+const zoomDomains = core.zoomDomains;
+const defaultZoomAxes = core.defaultZoomAxes;
+const withChartZoom = core.withChartZoom;
 export {
   DEFAULT_Y_AXIS,
   NO_ZOOM,