basalt-ui 1.41.0 → 2.0.1

package/dist/charts/kinds/Heatmap.js

@@ -1,243 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { Group } from "@visx/group";
-import { memo, useMemo } from "react";
-import { assertRequiredProps } from "../../common/validate.js";
-import {
-  ChartTooltipFloat,
-  TooltipBody,
-  TooltipHeader,
-  TooltipRow
-} from "../primitives/ChartTooltip.js";
-import { ChartFrame } from "../primitives/ChartFrame.js";
-import { useChartMetrics } from "../primitives/chart-tier.js";
-import { useDiscreteCursor } from "../hooks/use-discrete-cursor.js";
-import { maxTextWidth } from "../utils/measure-text.js";
-import { thinLabels, xLabelPxFor } from "../utils/ticks.js";
-import { VX, alpha } from "../../tokens/index.js";
-function firstSeen(data, get) {
-  const seen = /* @__PURE__ */ new Set();
-  const out = [];
-  for (const d of data) {
-    const k = get(d);
-    if (!seen.has(k)) {
-      seen.add(k);
-      out.push(k);
-    }
-  }
-  return out;
-}
-const cellKey = (row, col) => `${row}\0${col}`;
-const LABEL_FONT_FAMILY = "var(--basalt-font-mono)";
-const PAD_LEFT = 44;
-const PAD_BOTTOM = 24;
-const PAD_TOP = 8;
-const labelLineHeight = (fontPx) => Math.ceil(fontPx * 1.35);
-const LEGEND_H = 8;
-const LEGEND_LABEL_H = 16;
-function HeatmapInner(props) {
-  assertRequiredProps("Heatmap", props, ["data", "getRow", "getCol", "getValue"]);
-  const { chartId, height, aspectRatio, fill, ariaLabel, isPending, state, className, style } = props;
-  return /* @__PURE__ */ jsx(
-    ChartFrame,
-    {
-      series: [],
-      chartId,
-      legend: false,
-      ...height !== void 0 && { height },
-      ...aspectRatio !== void 0 && { aspectRatio },
-      ...fill !== void 0 && { fill },
-      ...ariaLabel !== void 0 && { ariaLabel },
-      ...isPending !== void 0 && { isPending },
-      ...state !== void 0 && { state },
-      ...className !== void 0 && { className },
-      ...style !== void 0 && { style },
-      children: (plot) => /* @__PURE__ */ jsx(HeatmapPlot, { ...props, plot })
-    }
-  );
-}
-function HeatmapPlot(props) {
-  const {
-    data,
-    plot,
-    chartId,
-    getRow,
-    getCol,
-    getValue,
-    rows: rowsProp,
-    cols: colsProp,
-    color = VX.line,
-    intensity = (value, max2) => max2 > 0 ? value / max2 : 0,
-    cellGap = 2,
-    cellRadius = 2,
-    formatValue = (v) => `${v}`,
-    rowLabel = (r) => r,
-    colLabel = (c) => c,
-    renderTooltip,
-    legend
-  } = props;
-  const { width, height } = plot;
-  const { axisFont } = useChartMetrics();
-  const rows = useMemo(() => rowsProp ?? firstSeen(data, getRow), [rowsProp, data, getRow]);
-  const cols = useMemo(() => colsProp ?? firstSeen(data, getCol), [colsProp, data, getCol]);
-  const { lookup, max } = useMemo(() => {
-    const map = /* @__PURE__ */ new Map();
-    let m = 0;
-    for (const d of data) {
-      const v = getValue(d);
-      map.set(cellKey(getRow(d), getCol(d)), v);
-      if (v > m) m = v;
-    }
-    return { lookup: map, max: m };
-  }, [data, getRow, getCol, getValue]);
-  const cellTargets = useMemo(() => {
-    const out = [];
-    for (const row of rows) {
-      for (const col of cols) out.push({ row, col, value: lookup.get(cellKey(row, col)) });
-    }
-    return out;
-  }, [rows, cols, lookup]);
-  const cursor = useDiscreteCursor({
-    targets: cellTargets,
-    getKey: (c) => cellKey(c.row, c.col),
-    columns: cols.length,
-    ariaLabel: "Heatmap cells \u2014 use arrow keys to navigate, Escape to dismiss"
-  });
-  const activeTip = cursor.tip !== null && cursor.tip.target.value !== void 0 ? {
-    anchor: cursor.tip.anchor,
-    cell: {
-      row: cursor.tip.target.row,
-      col: cursor.tip.target.col,
-      value: cursor.tip.target.value
-    }
-  } : null;
-  const rowLabels = useMemo(() => rows.map(rowLabel), [rows, rowLabel]);
-  const colLabels = useMemo(() => cols.map(colLabel), [cols, colLabel]);
-  const legendH = legend ? LEGEND_H + LEGEND_LABEL_H : 0;
-  const padRight = Math.ceil(maxTextWidth(colLabels, axisFont) / 2);
-  const gridW = Math.max(0, width - PAD_LEFT - padRight);
-  const gridH = Math.max(0, height - PAD_TOP - PAD_BOTTOM - legendH);
-  const cellW = cols.length > 0 ? gridW / cols.length : 0;
-  const cellH = rows.length > 0 ? gridH / rows.length : 0;
-  const legendGradientId = `${chartId}-heat-legend`;
-  const keptCols = useMemo(
-    () => thinLabels(colLabels, cellW, xLabelPxFor(colLabels, axisFont)),
-    [colLabels, cellW, axisFont]
-  );
-  const keptRows = useMemo(
-    () => thinLabels(rowLabels, cellH, labelLineHeight(axisFont)),
-    [rowLabels, cellH, axisFont]
-  );
-  return /* @__PURE__ */ jsxs("div", { style: { position: "relative" }, children: [
-    /* @__PURE__ */ jsxs("svg", { width, height, ...cursor.hostProps, children: [
-      /* @__PURE__ */ jsx(Group, { left: PAD_LEFT, top: PAD_TOP, children: rows.flatMap(
-        (row, ri) => cols.map((col, ci) => {
-          const value = lookup.get(cellKey(row, col));
-          const has = value !== void 0;
-          const cellFill = has ? alpha(color, intensity(value, max)) : alpha(VX.neutral, 0.04);
-          const target = { row, col, value };
-          const isActive = cursor.tip?.target.row === row && cursor.tip?.target.col === col;
-          return /* @__PURE__ */ jsx(
-            "rect",
-            {
-              id: cursor.optionId(target),
-              role: "option",
-              "aria-selected": isActive,
-              "aria-label": `${rowLabels[ri]}: ${colLabels[ci]}: ${value !== void 0 ? formatValue(value) : "no data"}`,
-              x: ci * cellW + cellGap / 2,
-              y: ri * cellH + cellGap / 2,
-              width: Math.max(0, cellW - cellGap),
-              height: Math.max(0, cellH - cellGap),
-              rx: cellRadius,
-              fill: cellFill,
-              style: { cursor: has ? "pointer" : "default" },
-              ...has ? cursor.pointerProps(target) : {}
-            },
-            cellKey(row, col)
-          );
-        })
-      ) }),
-      /* @__PURE__ */ jsx(Group, { left: 0, top: PAD_TOP, children: rows.map(
-        (row, ri) => keptRows.has(ri) ? /* @__PURE__ */ jsx(
-          "text",
-          {
-            x: PAD_LEFT - 6,
-            y: ri * cellH + cellH / 2 + 4,
-            textAnchor: "end",
-            fontSize: axisFont,
-            fontFamily: LABEL_FONT_FAMILY,
-            fill: VX.faint,
-            children: rowLabels[ri]
-          },
-          row
-        ) : null
-      ) }),
-      /* @__PURE__ */ jsx(Group, { left: PAD_LEFT, top: PAD_TOP + gridH, children: cols.map(
-        (col, ci) => keptCols.has(ci) ? /* @__PURE__ */ jsx(
-          "text",
-          {
-            x: ci * cellW + cellW / 2,
-            y: 16,
-            textAnchor: "middle",
-            fontSize: axisFont,
-            fontFamily: LABEL_FONT_FAMILY,
-            fill: VX.faint,
-            children: colLabels[ci]
-          },
-          col
-        ) : null
-      ) }),
-      legend && /* @__PURE__ */ jsxs(Group, { left: PAD_LEFT, top: PAD_TOP + gridH + PAD_BOTTOM, children: [
-        /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", { id: legendGradientId, x1: "0", x2: "1", y1: "0", y2: "0", children: [
-          /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: alpha(color, 0.08) }),
-          /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: color })
-        ] }) }),
-        /* @__PURE__ */ jsx("rect", { width: gridW, height: LEGEND_H, rx: 2, fill: `url(#${legendGradientId})` }),
-        /* @__PURE__ */ jsx(
-          "text",
-          {
-            x: 0,
-            y: LEGEND_H + 12,
-            textAnchor: "start",
-            fontSize: axisFont,
-            fontFamily: LABEL_FONT_FAMILY,
-            fill: VX.faint,
-            children: legend.min
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "text",
-          {
-            x: gridW,
-            y: LEGEND_H + 12,
-            textAnchor: "end",
-            fontSize: axisFont,
-            fontFamily: LABEL_FONT_FAMILY,
-            fill: VX.faint,
-            children: legend.max
-          }
-        )
-      ] })
-    ] }),
-    activeTip !== null && /* @__PURE__ */ jsxs(ChartTooltipFloat, { anchor: activeTip.anchor, children: [
-      /* @__PURE__ */ jsx(TooltipHeader, { date: rowLabel(activeTip.cell.row), label: colLabel(activeTip.cell.col) }),
-      /* @__PURE__ */ jsxs(TooltipBody, { children: [
-        /* @__PURE__ */ jsx(
-          TooltipRow,
-          {
-            color: alpha(color, 0.9),
-            shape: "bar",
-            label: "Value",
-            value: formatValue(activeTip.cell.value)
-          }
-        ),
-        renderTooltip?.(activeTip.cell)
-      ] })
-    ] })
-  ] });
-}
-const HeatmapMemo = memo(HeatmapInner);
-HeatmapMemo.displayName = "Heatmap";
-const Heatmap = HeatmapMemo;
-export {
-  Heatmap
-};

package/dist/charts/kinds/MirroredBars.d.ts

@@ -1,98 +0,0 @@
-import type { BasaltProps } from '../../common/props.js';
-import type { ChartMargin } from '../../tokens/index.js';
-import type { CursorResolution } from '../cursor/resolve.js';
-import type { BandFold, BandTooltipConfig } from '../hooks/useBandPlot.js';
-import type { ResponsiveChartHeight } from '../primitives/ChartFrame.js';
-import type { ChartState } from '../primitives/ChartPending.js';
-import type { ChartLegendConfig, ChartSeries } from '../series.js';
-/** One of the two panes. Each resolves its own domain — that is the whole point of the kind. */
-export type MirroredBarPane = {
-    /** Key of the `series` entry this pane draws: its colour, its legend entry, its tooltip row.
-     * A key naming no entry throws — see {@link assertPaneKey}. */
-    key: string;
-    /**
-     * The pane's upper bound. `'auto'` (default) is its own visible maximum; a number pins it.
-     *
-     * A pane has no LOWER bound to configure — a mirrored bar's length is its magnitude measured
-     * from the shared baseline, so the pane's zero IS the baseline. That is also why the two panes
-     * never share a domain: an upload an order of magnitude below its download flattens to a line
-     * along the baseline on a shared scale, and it is the half that explains a stalled call.
-     */
-    max?: number | 'auto';
-    /** When `max` is `'auto'`: floors the upper bound, so a quiet window doesn't amplify noise to
-     * full height. */
-    autoMaxFloor?: number;
-    /** Tick count for this pane's own axis. Default 3. */
-    ticks?: number;
-    /** Tick + tooltip formatter for this pane. A pane's axis is in its OWN units — one shared
-     * formatter would be wrong for at least one of them whenever the two differ. */
-    format: (v: number) => string;
-};
-export type MirroredBarsProps<T> = BasaltProps & {
-    data: readonly T[];
-    chartId: string;
-    /** Extracts the x-domain key — a slot start, hence the `'leading'` cursor default. */
-    getX: (d: T) => string;
-    /**
-     * The single source of truth for bar colours, legend entries and tooltip rows. `up.key` and
-     * `down.key` name two of these; any further entry is legend-only (give it `getValue: () => null`)
-     * — which is how ABSENCE gets named, and it has to be: a hatched bar is the one mark on this
-     * chart a reader cannot decode from either axis.
-     */
-    series: readonly ChartSeries<T>[];
-    /** The pane drawn ABOVE the baseline. */
-    up: MirroredBarPane;
-    /** The pane drawn BELOW the baseline. */
-    down: MirroredBarPane;
-    /** The up pane's share of the bar band. Default 0.35 — the mirrored pair is usually asymmetric,
-     * and splitting evenly spends most of the chart on empty space above the smaller half. */
-    upFraction?: number;
-    /**
-     * 0..1 of this bar's width no source sample covers, hatched across the FULL band height.
-     *
-     * Full height, both panes, deliberately: a hatch drawn on one pane only reads as "that half
-     * measured zero", which is the measured-and-idle state absence must stay distinguishable from.
-     */
-    getAbsentFraction?: (d: T) => number;
-    /** Per-datum bar opacity — a real but qualified measurement (a short bucket, a partial interval)
-     * drawn dimmer. Default 1. */
-    getBarOpacity?: (d: T) => number;
-    /** Height in px, or one per size step (`{ base, sm?, md?, lg? }`). Default 240. Forwarded
-     * unchanged; `ChartFrameProps.height` owns the law — steps resolve off the MEASURED width. */
-    height?: number | ResponsiveChartHeight;
-    fill?: boolean;
-    formatX?: (key: string) => string;
-    xTickValues?: (keys: readonly string[], plotWidth: number) => readonly string[];
-    fold?: BandFold<T>;
-    /** Default `'leading'` — see `BandStripProps.cursorResolution`. */
-    cursorResolution?: CursorResolution;
-    tooltip?: BandTooltipConfig<T> | false;
-    legend?: ChartLegendConfig | false;
-    /** Series key whose colour the absence hatch is drawn in. Default `VX.neutral`. A key naming no
-     * `series` entry throws rather than falling back to the unnamed default. */
-    absentState?: string;
-    margin?: Partial<ChartMargin>;
-    ariaLabel?: string;
-    isPending?: boolean;
-    /** The three "nothing to draw" states in one prop — pending → error → empty. See
-     * `ChartState`; `isPending` stays a supported alias for `state={{ pending: true }}`. */
-    state?: ChartState;
-};
-/**
- * Two bar panes over ONE x scale and one cursor, mirrored around a shared baseline, each in its
- * own independent domain.
- *
- * **Why not `DualPanel`.** `DualPanel`'s two panes are a LINE pane and a signed-histogram pane: it
- * requires `series` to be line series it draws with `LinePath`, and its bottom pane takes a single
- * signed `getBar` over one symmetric `[-maxAbs, maxAbs]` scale. Neither half fits. Two independent
- * magnitudes mirrored around a baseline are not one signed quantity — a 220 kB/s down and a 20 kB/s
- * up are two readings, not `+220` and `−20` of one — and forcing them onto one scale is exactly the
- * flattening this shape exists to avoid. Bending `DualPanel` to cover it would mean a
- * `topMark: 'line' | 'bars'` switch, a second value accessor, and a per-pane domain law that
- * contradicts its symmetric one: a fork of its internals wearing one name. It composes the same
- * `useBandPlot` choreography instead, which is where the sharing actually belongs.
- */
-declare function MirroredBarsInner<T>(props: MirroredBarsProps<T>): import("react").JSX.Element;
-export declare const MirroredBars: typeof MirroredBarsInner;
-export {};
-//# sourceMappingURL=MirroredBars.d.ts.map

package/dist/charts/kinds/MirroredBars.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"MirroredBars.d.ts","sourceRoot":"","sources":["../../../src/charts/kinds/MirroredBars.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAA;AAErD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAC/C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAA;AAEzD,OAAO,KAAK,EAAE,QAAQ,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AAIvE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAA;AAIrE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAA;AAE5D,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AAI/D,gGAAgG;AAChG,MAAM,MAAM,eAAe,GAAG;IAC5B;mEAC+D;IAC/D,GAAG,EAAE,MAAM,CAAA;IACX;;;;;;;OAOG;IACH,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACrB;sBACkB;IAClB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;oFACgF;IAChF,MAAM,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,CAAA;CAC9B,CAAA;AAED,MAAM,MAAM,iBAAiB,CAAC,CAAC,IAAI,WAAW,GAAG;IAC/C,IAAI,EAAE,SAAS,CAAC,EAAE,CAAA;IAClB,OAAO,EAAE,MAAM,CAAA;IACf,sFAAsF;IACtF,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,MAAM,CAAA;IACtB;;;;;OAKG;IACH,MAAM,EAAE,SAAS,WAAW,CAAC,CAAC,CAAC,EAAE,CAAA;IACjC,yCAAyC;IACzC,EAAE,EAAE,eAAe,CAAA;IACnB,yCAAyC;IACzC,IAAI,EAAE,eAAe,CAAA;IACrB;8FAC0F;IAC1F,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,MAAM,CAAA;IACpC;kCAC8B;IAC9B,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,MAAM,CAAA;IAChC;kGAC8F;IAC9F,MAAM,CAAC,EAAE,MAAM,GAAG,qBAAqB,CAAA;IACvC,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,MAAM,CAAA;IACjC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,MAAM,EAAE,EAAE,SAAS,EAAE,MAAM,KAAK,SAAS,MAAM,EAAE,CAAA;IAC/E,IAAI,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAA;IAClB,mEAAmE;IACnE,gBAAgB,CAAC,EAAE,gBAAgB,CAAA;IACnC,OAAO,CAAC,EAAE,iBAAiB,CAAC,CAAC,CAAC,GAAG,KAAK,CAAA;IACtC,MAAM,CAAC,EAAE,iBAAiB,GAAG,KAAK,CAAA;IAClC;gFAC4E;IAC5E,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAA;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;4FACwF;IACxF,KAAK,CAAC,EAAE,UAAU,CAAA;CACnB,CAAA;AA8BD;;;;;;;;;;;;;GAaG;AACH,iBAAS,iBAAiB,CAAC,CAAC,EAAE,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,+BAwBxD;AA+SD,eAAO,MAAM,YAAY,EAAuB,OAAO,iBAAiB,CAAA"}

package/dist/charts/kinds/MirroredBars.js

@@ -1,292 +0,0 @@
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { Group } from "@visx/group";
-import { scaleLinear } from "@visx/scale";
-import { memo, useMemo } from "react";
-import { assertRequiredProps } from "../../common/validate.js";
-import { VX, alpha } from "../../tokens/index.js";
-import { useBandPlot } from "../hooks/useBandPlot.js";
-import { probeAxisLabels } from "../layout/auto-margin.js";
-import { AxisLeftNumeric } from "../primitives/Axes.js";
-import { ChartFrame, resolveLegend } from "../primitives/ChartFrame.js";
-import { TooltipRows } from "../primitives/ChartTooltip.js";
-import { Crosshair } from "../primitives/Crosshair.js";
-import { HatchPattern, hatchFill, hatchSizeFor } from "../primitives/HatchPattern.js";
-import { deriveTooltipRows } from "../series.js";
-import { fmtAxisDate } from "../utils/format.js";
-import { BandAxisOverlay, BandTooltip, clampFraction } from "./band-chrome.js";
-const DEFAULT_UP_FRACTION = 0.35;
-const DEFAULT_PANE_TICKS = 3;
-function assertPaneKey(side, key, resolved, series) {
-  if (resolved !== void 0) return;
-  throw new Error(
-    `MirroredBars: ${side}.key "${key}" names no \`series\` entry (known: ${series.map((s) => s.key).join(", ")}) \u2014 the pane would silently vanish, which reads as a measured zero. Add the series, or point the pane at one that exists.`
-  );
-}
-function MirroredBarsInner(props) {
-  assertRequiredProps("MirroredBars", props, ["data", "getX", "series", "up", "down"]);
-  const { series, chartId, height, fill, legend, ariaLabel, isPending, state, className, style } = props;
-  return /* @__PURE__ */ jsx(
-    ChartFrame,
-    {
-      series,
-      chartId,
-      ...height !== void 0 && { height },
-      ...fill !== void 0 && { fill },
-      ...ariaLabel !== void 0 && { ariaLabel },
-      ...isPending !== void 0 && { isPending },
-      ...state !== void 0 && { state },
-      ...className !== void 0 && { className },
-      ...style !== void 0 && { style },
-      legend: resolveLegend(legend),
-      children: (plot) => /* @__PURE__ */ jsx(MirroredBarsPlot, { ...props, plot })
-    }
-  );
-}
-function MirroredBarsPlot(props) {
-  const {
-    data,
-    chartId,
-    getX,
-    series,
-    up,
-    down,
-    upFraction = DEFAULT_UP_FRACTION,
-    getAbsentFraction,
-    getBarOpacity,
-    formatX = fmtAxisDate,
-    xTickValues,
-    fold,
-    cursorResolution = "leading",
-    tooltip,
-    absentState,
-    margin: marginOverride,
-    ariaLabel,
-    plot
-  } = props;
-  const { hidden } = plot;
-  const seriesByKey = useMemo(() => new Map(series.map((s) => [s.key, s])), [series]);
-  const upSeries = seriesByKey.get(up.key);
-  const downSeries = seriesByKey.get(down.key);
-  assertPaneKey("up", up.key, upSeries, series);
-  assertPaneKey("down", down.key, downSeries, series);
-  const upVisible = upSeries !== void 0 && !hidden.has(up.key);
-  const downVisible = downSeries !== void 0 && !hidden.has(down.key);
-  const upMax = usePaneMax(data, upSeries, up, upVisible);
-  const downMax = usePaneMax(data, downSeries, down, downVisible);
-  const upTicks = up.ticks ?? DEFAULT_PANE_TICKS;
-  const downTicks = down.ticks ?? DEFAULT_PANE_TICKS;
-  const leftLabels = useMemo(() => {
-    const labels = [];
-    if (upVisible) {
-      labels.push(
-        ...probeAxisLabels({ domain: [0, upMax], ticks: upTicks, format: up.format }).labels
-      );
-    }
-    if (downVisible) {
-      labels.push(
-        ...probeAxisLabels({ domain: [0, downMax], ticks: downTicks, format: down.format }).labels
-      );
-    }
-    return labels;
-  }, [upVisible, downVisible, upMax, downMax, upTicks, downTicks, up.format, down.format]);
-  const band = useBandPlot({
-    data,
-    chartId,
-    getX,
-    formatX,
-    width: plot.width,
-    cursorResolution,
-    leftLabels,
-    ...fold !== void 0 && { fold },
-    ...xTickValues !== void 0 && { xTickValues },
-    ...marginOverride !== void 0 && { margin: marginOverride },
-    ...tooltip !== void 0 && { tooltip }
-  });
-  const { bands, margin, plotWidth, point, crosshairX, step, bandWidth } = band;
-  const barBand = Math.max(plot.height - margin.top - margin.bottom, 2);
-  const upHeight = Math.max(Math.round(barBand * upFraction), 1);
-  const downHeight = Math.max(barBand - upHeight, 1);
-  const baseline = upHeight;
-  const upScale = useMemo(
-    () => scaleLinear({ domain: [0, upMax], range: [0, upHeight] }),
-    [upMax, upHeight]
-  );
-  const downScale = useMemo(
-    () => scaleLinear({ domain: [0, downMax], range: [0, downHeight] }),
-    [downMax, downHeight]
-  );
-  const upAxisScale = useMemo(
-    () => scaleLinear({ domain: [upMax, 0], range: [0, upHeight] }),
-    [upMax, upHeight]
-  );
-  const hatchId = `${chartId}-mirrored-absent`;
-  if (absentState !== void 0 && !seriesByKey.has(absentState)) {
-    throw new Error(
-      `MirroredBars: absentState "${absentState}" names no \`series\` entry (known: ${series.map((s) => s.key).join(", ")}) \u2014 the hatch would fall back to an unnamed neutral, and a hatched bar is the one mark a reader cannot decode from either axis.`
-    );
-  }
-  const absentColor = (absentState === void 0 ? void 0 : seriesByKey.get(absentState)?.color) ?? VX.neutral;
-  const drawnUp = upVisible ? upSeries : void 0;
-  const drawnDown = downVisible ? downSeries : void 0;
-  const bars = useMemo(() => {
-    const out = [];
-    bands.forEach((d, i) => {
-      const x = i * step;
-      const absent = clampFraction(getAbsentFraction?.(d));
-      const measuredWidth = bandWidth * (1 - absent);
-      const hatchWidth = bandWidth - measuredWidth;
-      const opacity = getBarOpacity?.(d) ?? 1;
-      const upValue = finiteOrNull(drawnUp?.getValue(d));
-      const downValue = finiteOrNull(drawnDown?.getValue(d));
-      out.push(
-        /* @__PURE__ */ jsxs("g", { children: [
-          measuredWidth > 0 && drawnUp !== void 0 && upValue !== null && /* @__PURE__ */ jsx(
-            "rect",
-            {
-              x,
-              y: baseline - upScale(upValue),
-              width: measuredWidth,
-              height: Math.max(upScale(upValue), upValue > 0 ? 1 : 0),
-              fill: alpha(drawnUp.color, opacity),
-              pointerEvents: "none"
-            }
-          ),
-          measuredWidth > 0 && drawnDown !== void 0 && downValue !== null && /* @__PURE__ */ jsx(
-            "rect",
-            {
-              x,
-              y: baseline,
-              width: measuredWidth,
-              height: Math.max(downScale(downValue), downValue > 0 ? 1 : 0),
-              fill: alpha(drawnDown.color, opacity),
-              pointerEvents: "none"
-            }
-          ),
-          hatchWidth > 0 && /* @__PURE__ */ jsx(
-            "rect",
-            {
-              x: x + measuredWidth,
-              y: 0,
-              width: hatchWidth,
-              height: barBand,
-              fill: hatchFill(hatchId),
-              pointerEvents: "none"
-            }
-          )
-        ] }, getX(d))
-      );
-    });
-    return out;
-  }, [
-    bands,
-    step,
-    bandWidth,
-    barBand,
-    baseline,
-    getX,
-    getAbsentFraction,
-    getBarOpacity,
-    drawnUp,
-    drawnDown,
-    upScale,
-    downScale,
-    hatchId
-  ]);
-  if (plotWidth <= 0 || bands.length === 0) return null;
-  const visibleSeries = series.filter((s) => !hidden.has(s.key)).map((s) => {
-    if (s.formatValue !== void 0) return s;
-    if (s.key === up.key) return { ...s, formatValue: (v) => up.format(v) };
-    if (s.key === down.key) return { ...s, formatValue: (v) => down.format(v) };
-    return s;
-  });
-  const rows = point === null ? [] : deriveTooltipRows(visibleSeries, point, down.format);
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(
-      "svg",
-      {
-        ref: band.svgRef,
-        width: plot.width,
-        height: plot.height,
-        style: { touchAction: "pan-y" },
-        children: [
-          /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx(
-            HatchPattern,
-            {
-              id: hatchId,
-              color: absentColor,
-              opacity: 0.7,
-              size: hatchSizeFor(bandWidth)
-            }
-          ) }),
-          /* @__PURE__ */ jsxs(Group, { left: margin.left, top: margin.top, children: [
-            bars,
-            upVisible && band.yPlacement !== "none" && /* @__PURE__ */ jsx(
-              AxisLeftNumeric,
-              {
-                scale: upAxisScale,
-                numTicks: upTicks,
-                tickFormat: (v) => up.format(Number(v)),
-                inside: band.yPlacement === "inside"
-              }
-            ),
-            downVisible && band.yPlacement !== "none" && /* @__PURE__ */ jsx(Group, { top: baseline, children: /* @__PURE__ */ jsx(
-              AxisLeftNumeric,
-              {
-                scale: downScale,
-                numTicks: downTicks,
-                tickFormat: (v) => down.format(Number(v)),
-                inside: band.yPlacement === "inside"
-              }
-            ) }),
-            /* @__PURE__ */ jsx(
-              "line",
-              {
-                x1: 0,
-                x2: plotWidth,
-                y1: baseline,
-                y2: baseline,
-                stroke: VX.axisStroke,
-                strokeWidth: 1
-              }
-            ),
-            crosshairX !== null && /* @__PURE__ */ jsx(Crosshair, { x: crosshairX, top: 0, bottom: barBand }),
-            /* @__PURE__ */ jsx(
-              BandAxisOverlay,
-              {
-                band,
-                height: barBand,
-                getX,
-                formatX,
-                ariaLabel
-              }
-            )
-          ] })
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsx(BandTooltip, { band, tooltip, getX, hidden, children: /* @__PURE__ */ jsx(TooltipRows, { rows }) })
-  ] });
-}
-function finiteOrNull(v) {
-  return v === null || v === void 0 || Number.isNaN(v) ? null : v;
-}
-function usePaneMax(data, paneSeries, pane, visible) {
-  return useMemo(() => {
-    if (pane.max !== void 0 && pane.max !== "auto") return pane.max || 1;
-    if (!visible || paneSeries === void 0) return 1;
-    let max = 0;
-    for (const d of data) {
-      const v = paneSeries.getValue(d);
-      if (v === null || Number.isNaN(v)) continue;
-      if (v > max) max = v;
-    }
-    const floored = pane.autoMaxFloor === void 0 ? max : Math.max(max, pane.autoMaxFloor);
-    return floored || 1;
-  }, [data, paneSeries, pane.max, pane.autoMaxFloor, visible]);
-}
-const MirroredBarsMemo = memo(MirroredBarsInner);
-MirroredBarsMemo.displayName = "MirroredBars";
-const MirroredBars = MirroredBarsMemo;
-export {
-  MirroredBars
-};