basalt-ui 2.3.0 → 2.5.0

package/dist/charts/DualPanel.js

@@ -7,9 +7,9 @@ import { scaleUtc } from "d3-scale";
 import { useCallback, useMemo } from "react";
 import { VX, alpha } from "../tokens/index.js";
 import { resolveContainerClass } from "../tokens/size-classes.js";
-import { defaultFormatX, defaultNumberFormat, visibleSeries } from "./compile.js";
+import { defaultFormatX, defaultNumberFormat, engineRow, seriesRow, visibleSeries } from "./compile.js";
 import { barMark, emphasis, lineMark, markersOf, thinFill } from "./marks.js";
-import { PanelRung, paneX, paneY, rowsOf } from "./panel.js";
+import { PanelRung, chartHeightOf, paneX, paneY, rowsOf } from "./panel.js";
 import { xScaleFor } from "./scales.js";
 import { rowX } from "./types.js";
 const BAR_KEY = "__bar";
@@ -60,6 +60,8 @@ function DualPanel(props) {
   );
   const all = useMemo(() => [...lines, barSeries], [lines, barSeries]);
   const topFormat = top?.format ?? defaultNumberFormat;
+  const topTooltipFormat = top?.tooltipFormat ?? topFormat;
+  const barTooltipFormat = bar.tooltipFormat ?? bar.format;
   const plan = useCallback(
     ({ hidden, highlighted }) => {
       const model = xScaleFor(data.map(x), false);
@@ -145,12 +147,20 @@ function DualPanel(props) {
           ],
           scales: {
             x: { scale: xScale(), axis: false },
-            y: paneY({ scale: topY, domain: topDomain, format: topFormat, ticks: TOP_TICKS, cls })
+            y: paneY({
+              scale: topY,
+              domain: topDomain,
+              format: topFormat,
+              ticks: TOP_TICKS,
+              cls,
+              height: chartHeightOf(h, topFraction, PANE_GAP)
+            })
           }
         };
       };
-      const barPane = ({ width }) => {
+      const barPane = ({ width, height: h }) => {
         const cls = resolveContainerClass(width);
+        const whole = chartHeightOf(h, 1 - topFraction, PANE_GAP);
         const barRows = barOn ? rowsOf(data, x, barSeries) : [];
         const dim = emphasis(highlighted, { key: BAR_KEY });
         return {
@@ -164,13 +174,14 @@ function DualPanel(props) {
             })
           ],
           scales: {
-            x: paneX({ scale: xScale(), model, format, cls }),
+            x: paneX({ scale: xScale(), model, format, cls, height: whole }),
             y: paneY({
               scale: barScale,
               domain: barDomain,
               format: bar.format,
               ticks: BAR_TICKS,
-              cls
+              cls,
+              height: whole
             })
           }
         };
@@ -186,26 +197,42 @@ function DualPanel(props) {
           for (const s of visible) {
             const v2 = s.getValue(d);
             if (s.tooltip === false || v2 === null || !Number.isFinite(v2)) continue;
-            out.push({
-              label: s.note === void 0 ? s.label : `${s.label} \xB7 ${s.note}`,
-              value: s.formatValue ? s.formatValue(v2, d) : topFormat(v2),
-              color: s.color,
-              ...highlighted === s.key && { active: true }
-            });
+            out.push(
+              seriesRow(
+                s,
+                s.formatValue ? s.formatValue(v2, d) : topTooltipFormat(v2),
+                highlighted === s.key
+              )
+            );
           }
           const v = barOn ? bar.getValue(d) : null;
           if (v !== null && Number.isFinite(v))
-            out.push({
-              label: bar.label,
-              value: bar.formatValue ? bar.formatValue(v, d) : bar.format(v),
-              color: v >= 0 ? bar.positive : bar.negative,
-              ...highlighted === BAR_KEY && { active: true }
-            });
+            out.push(
+              engineRow({
+                label: bar.label,
+                value: bar.formatValue ? bar.formatValue(v, d) : barTooltipFormat(v),
+                color: v >= 0 ? bar.positive : bar.negative,
+                active: highlighted === BAR_KEY
+              })
+            );
           return out;
         }
       };
     },
-    [data, x, lines, barSeries, top, fillBetween, bar, topFraction, topFormat, formatX]
+    [
+      data,
+      x,
+      lines,
+      barSeries,
+      top,
+      fillBetween,
+      bar,
+      topFraction,
+      topFormat,
+      topTooltipFormat,
+      barTooltipFormat,
+      formatX
+    ]
   );
   return /* @__PURE__ */ jsx(PanelRung, { ...rung, series: all, plan });
 }

package/dist/charts/Heatmap.js

@@ -9,7 +9,7 @@ import { scaleQuantize } from "d3-scale";
 import { useId, useMemo } from "react";
 import { alpha, VX } from "../tokens/index.js";
 import { resolveContainerClass } from "../tokens/size-classes.js";
-import { strideTicks } from "./compile.js";
+import { engineRow, strideTicks } from "./compile.js";
 import { ChartEngine, idPrefixOf } from "./host.js";
 import { useCoarsePointer } from "../common/use-media-query.js";
 import { HEIGHT_MAX, HEIGHT_MIN } from "./box.js";
@@ -176,7 +176,7 @@ function Heatmap(props) {
               ...point.color && { color: point.color }
             }
           ];
-          return { title: header(c), rows: [...value, ...extra] };
+          return { title: header(c), rows: [...value, ...extra].map(engineRow) };
         }
       } : false
     };

package/dist/charts/Lines.js

@@ -8,7 +8,7 @@ import { VX } from "../tokens/index.js";
 import { CartesianRung } from "./CartesianChart.js";
 import { areaGradientId } from "./compile.js";
 import { chartCurve } from "./curves.js";
-import { lineMark, markersOf, yScaleOf } from "./marks.js";
+import { drawnRows, lineMark, markersOf, yScaleOf } from "./marks.js";
 import { rowX } from "./types.js";
 const MAX_END_LABELS = 3;
 const END_LABEL_MIN_GAP = 13;
@@ -80,7 +80,7 @@ function Lines(props) {
         if (!s.area) continue;
         out.push(
           decorative(
-            areaY(plot.rows(s.key), {
+            areaY(drawnRows(plot, s), {
               id: `${s.key}-area`,
               x: rowX,
               y2: "y",

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

@@ -1 +1 @@
-{"version":3,"file":"MirroredBars.d.ts","sourceRoot":"","sources":["../../src/charts/MirroredBars.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AASzC,OAAO,KAAK,EAAE,mBAAmB,EAAE,WAAW,EAAE,MAAM,EAAW,MAAM,SAAS,CAAA;AAEhF,4BAA4B;AAC5B,MAAM,MAAM,eAAe,GAAG;IAC5B;8EAC0E;IAC1E,GAAG,EAAE,MAAM,CAAA;IACX,+FAA+F;IAC/F,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAA;IACjC,sGAAsG;IACtG,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IACjC,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC1B,2DAA2D;IAC3D,MAAM,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,CAAA;CAC9B,CAAA;AAED,oGAAoG;AACpG,MAAM,MAAM,kBAAkB,CAAC,CAAC,IAAI,IAAI,CACtC,WAAW,CAAC,CAAC,CAAC,EACd,KAAK,GAAG,OAAO,GAAG,OAAO,GAAG,UAAU,GAAG,aAAa,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAChG,CAAA;AAED,MAAM,MAAM,iBAAiB,CAAC,CAAC,EAAE,CAAC,SAAS,MAAM,GAAG,MAAM,IAAI,IAAI,CAChE,mBAAmB,CAAC,CAAC,EAAE,CAAC,CAAC,EACvB,WAAW,GACX,MAAM,GACN,GAAG,GACH,SAAS,GACT,QAAQ,GACR,QAAQ,GACR,OAAO,GACP,aAAa,GACb,SAAS,GACT,WAAW,GACX,OAAO,CACV,GAAG;IACF,qEAAqE;IACrE,MAAM,EAAE,SAAS,kBAAkB,CAAC,CAAC,CAAC,EAAE,CAAA;IACxC,gCAAgC;IAChC,EAAE,EAAE,eAAe,CAAA;IACnB,gCAAgC;IAChC,IAAI,EAAE,eAAe,CAAA;IACrB,uFAAuF;IACvF,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC/B,2FAA2F;IAC3F,iBAAiB,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,MAAM,CAAC,GAAG,SAAS,CAAA;IAClD,6FAA6F;IAC7F,aAAa,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,MAAM,CAAC,GAAG,SAAS,CAAA;IAC9C;;;OAGG;IACH,IAAI,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;QAAC,KAAK,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,KAAK,CAAC,CAAA;KAAE,GAAG,SAAS,CAAA;IAC/E,gDAAgD;IAChD,gBAAgB,CAAC,EAAE,mBAAmB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,kBAAkB,CAAC,GAAG,SAAS,CAAA;CAC7E,CAAA;AAgDD,wBAAgB,YAAY,CAAC,CAAC,EAAE,CAAC,SAAS,MAAM,GAAG,MAAM,EACvD,KAAK,EAAE,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,GAC7B,YAAY,CAuKd"}
+{"version":3,"file":"MirroredBars.d.ts","sourceRoot":"","sources":["../../src/charts/MirroredBars.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AASzC,OAAO,KAAK,EAAE,mBAAmB,EAAE,WAAW,EAAE,MAAM,EAAW,MAAM,SAAS,CAAA;AAEhF,4BAA4B;AAC5B,MAAM,MAAM,eAAe,GAAG;IAC5B;8EAC0E;IAC1E,GAAG,EAAE,MAAM,CAAA;IACX,+FAA+F;IAC/F,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAA;IACjC,sGAAsG;IACtG,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IACjC,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC1B,2DAA2D;IAC3D,MAAM,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,CAAA;CAC9B,CAAA;AAED,oGAAoG;AACpG,MAAM,MAAM,kBAAkB,CAAC,CAAC,IAAI,IAAI,CACtC,WAAW,CAAC,CAAC,CAAC,EACd,KAAK,GAAG,OAAO,GAAG,OAAO,GAAG,UAAU,GAAG,aAAa,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAChG,CAAA;AAED,MAAM,MAAM,iBAAiB,CAAC,CAAC,EAAE,CAAC,SAAS,MAAM,GAAG,MAAM,IAAI,IAAI,CAChE,mBAAmB,CAAC,CAAC,EAAE,CAAC,CAAC,EACvB,WAAW,GACX,MAAM,GACN,GAAG,GACH,SAAS,GACT,QAAQ,GACR,QAAQ,GACR,OAAO,GACP,aAAa,GACb,SAAS,GACT,WAAW,GACX,OAAO,CACV,GAAG;IACF,qEAAqE;IACrE,MAAM,EAAE,SAAS,kBAAkB,CAAC,CAAC,CAAC,EAAE,CAAA;IACxC,gCAAgC;IAChC,EAAE,EAAE,eAAe,CAAA;IACnB,gCAAgC;IAChC,IAAI,EAAE,eAAe,CAAA;IACrB,uFAAuF;IACvF,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC/B,2FAA2F;IAC3F,iBAAiB,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,MAAM,CAAC,GAAG,SAAS,CAAA;IAClD,6FAA6F;IAC7F,aAAa,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,MAAM,CAAC,GAAG,SAAS,CAAA;IAC9C;;;OAGG;IACH,IAAI,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;QAAC,KAAK,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,KAAK,CAAC,CAAA;KAAE,GAAG,SAAS,CAAA;IAC/E,gDAAgD;IAChD,gBAAgB,CAAC,EAAE,mBAAmB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,kBAAkB,CAAC,GAAG,SAAS,CAAA;CAC7E,CAAA;AAgDD,wBAAgB,YAAY,CAAC,CAAC,EAAE,CAAC,SAAS,MAAM,GAAG,MAAM,EACvD,KAAK,EAAE,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,GAC7B,YAAY,CA0Kd"}

package/dist/charts/MirroredBars.js

@@ -6,9 +6,9 @@ import { scaleLinear } from "@tanstack/charts/scales/linear";
 import { useCallback, useMemo } from "react";
 import { VX, alpha } from "../tokens/index.js";
 import { resolveContainerClass } from "../tokens/size-classes.js";
-import { defaultFormatX, defaultNumberFormat, visibleSeries } from "./compile.js";
+import { defaultFormatX, defaultNumberFormat, seriesRow, visibleSeries } from "./compile.js";
 import { barMark, emphasis } from "./marks.js";
-import { PanelRung, paneX, paneY, rowsOf } from "./panel.js";
+import { PanelRung, chartHeightOf, paneX, paneY, rowsOf } from "./panel.js";
 import { xScaleFor } from "./scales.js";
 import { rowX } from "./types.js";
 const DEFAULT_UP_FRACTION = 0.35;
@@ -69,8 +69,9 @@ function MirroredBars(props) {
       const downMax = paneMax(down, downSeries, drawn, downOn);
       const bandWidth = 2 * model.halfStep * BAND_FILL;
       const bandScale = () => xScaleFor(drawn.map(x), true).scale;
-      const pane = (side, cfg, s, on, max) => ({ width: w }) => {
+      const pane = (side, cfg, s, on, max) => ({ width: w, height: h }) => {
         const cls = resolveContainerClass(w);
+        const whole = chartHeightOf(h, side === "up" ? upFraction : 1 - upFraction, 0);
         const domain = side === "up" ? [0, max] : [max, 0];
         const rows = on ? rowsOf(drawn, x, s) : [];
         const opacity = (d) => (getBarOpacity?.(d) ?? BAR_OPACITY) * emphasis(highlighted, s);
@@ -137,13 +138,14 @@ function MirroredBars(props) {
             )
           ],
           scales: {
-            x: side === "down" ? paneX({ scale: bandScale(), model, format, cls }) : { scale: bandScale(), axis: false },
+            x: side === "down" ? paneX({ scale: bandScale(), model, format, cls, height: whole }) : { scale: bandScale(), axis: false },
             y: paneY({
               scale: scaleLinear().domain(domain),
               domain,
               format: cfg.format,
               ticks: cfg.ticks ?? DEFAULT_PANE_TICKS,
-              cls
+              cls,
+              height: whole
             }),
             zx: { channel: "x", scale: scaleLinear().domain([0, 1]), axis: false }
           }
@@ -161,12 +163,13 @@ function MirroredBars(props) {
             const v = s.getValue(d);
             if (s.tooltip === false || v === null || !Number.isFinite(v)) continue;
             const fallback = s.key === up.key ? up.format : s.key === down.key ? down.format : defaultNumberFormat;
-            out.push({
-              label: s.note === void 0 ? s.label : `${s.label} \xB7 ${s.note}`,
-              value: s.formatValue ? s.formatValue(v, d) : fallback(v),
-              color: s.color,
-              ...highlighted === s.key && { active: true }
-            });
+            out.push(
+              seriesRow(
+                s,
+                s.formatValue ? s.formatValue(v, d) : fallback(v),
+                highlighted === s.key
+              )
+            );
           }
           return out;
         }

package/dist/charts/compile.d.ts

@@ -1,7 +1,7 @@
-import type { ChartGradient, ChartPositionScaleOptions, ChartValue, ResponsiveChartDefinition } from '@tanstack/charts/types/core';
+import type { ChartGradient, ChartPositionScaleOptions, ChartTooltipRow as EngineTooltipRow, ChartValue, ResponsiveChartDefinition } from '@tanstack/charts/types/core';
 import type { ContainerClass } from '../tokens/size-classes.js';
 import type { XScaleModel } from './scales.js';
-import type { AxisConfig, CartesianChartProps, ChartSeries, ChartX, ZoneSpec } from './types.js';
+import type { AxisConfig, CartesianChartProps, ChartSeries, ChartTooltipRow, ChartX, RefLine, ZoneSpec } from './types.js';
 /**
  * The compiled definition. Annotated on purpose: TanStack's inferred definition type names internal
  * modules (`dist/scene`, `cursor-host-contract`) and fails declaration emit (TS2883 / TS4058).
@@ -35,6 +35,19 @@ export declare function utcHeaderDate(d: Date): string;
  */
 export declare function dateTicks(domain: readonly [Date, Date], count: number, stepMs: number): Date[];
 export declare function defaultFormatX(v: ChartValue): string;
+/**
+ * A tooltip swatch is the engine's `background` shorthand, so a dashed one is a gradient: a 2px
+ * dashed line across the swatch's middle, in the row color.
+ */
+export declare const dashedSwatch: (color: string) => string;
+/** A basalt tooltip row as the engine's: the swatch shape folded into the row color. */
+export declare function engineRow(row: ChartTooltipRow & {
+    active?: boolean | undefined;
+}): EngineTooltipRow;
+/** A series row of a tooltip: the label with its note, the swatch following the series' dash. */
+export declare function seriesRow(s: Pick<ChartSeries<never>, 'label' | 'note' | 'color' | 'dash'>, value: string, active: boolean): EngineTooltipRow;
+/** Legend-only entries for the reference lines that name themselves, in line order. */
+export declare function refLegendSeries<T>(refLines: readonly RefLine[] | undefined): ChartSeries<T>[];
 /** The visible series: not toggled off, and not a companion whose parent is. */
 export declare function visibleSeries<T>(series: readonly ChartSeries<T>[], hidden: ReadonlySet<string>): ChartSeries<T>[];
 type YAxis = {
@@ -47,6 +60,8 @@ export declare function yGuide<T>(opts: {
     cls: ContainerClass;
     side: 'left' | 'right';
     grid: boolean;
+    /** The whole chart's height: decides inside or gutter labels. */
+    height: number;
 }): Omit<ChartPositionScaleOptions<number>, 'scale'>;
 /**
  * Every n-th value, n the smallest stride that leaves at most the class's x tick count (the same
@@ -59,6 +74,8 @@ export declare function xGuide<X extends ChartX>(opts: {
     xTicks: number | readonly X[] | undefined;
     format: (v: ChartValue) => string;
     cls: ContainerClass;
+    /** The whole chart's height: decides whether the left margin is locked to zero. */
+    height: number;
 }): Omit<ChartPositionScaleOptions<ChartValue>, 'scale'>;
 /** Gradient resource id for a series' area fill; the host's `idPrefix` scopes it per chart. */
 export declare const areaGradientId: (index: number) => string;

package/dist/charts/compile.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"compile.d.ts","sourceRoot":"","sources":["../../src/charts/compile.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"compile.d.ts","sourceRoot":"","sources":["../../src/charts/compile.ts"],"names":[],"mappings":"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"}

package/dist/charts/compile.js

@@ -1,14 +1,16 @@
 import { crosshair } from "@tanstack/charts/crosshair";
 import { decorative } from "@tanstack/charts/mark/decorative";
 import { rect } from "@tanstack/charts/rect";
-import { ruleY } from "@tanstack/charts/rule";
+import { ruleX, ruleY } from "@tanstack/charts/rule";
 import { scaleLinear } from "@tanstack/charts/scales/linear";
 import { scaleUtc } from "d3-scale";
 import { tooltip as tooltipHost } from "@tanstack/charts/tooltip";
 import { portal } from "@tanstack/charts/tooltip/portal";
+import { SHORT_CHART_HEIGHT } from "./box.js";
 import { fmtCompact } from "../format/number.js";
 import { VX } from "../tokens/index.js";
 import { cursorBinding, sourceOnlyFocus } from "./cursor.js";
+import { cursorDots } from "./marks.js";
 import { resolveContainerClass } from "../tokens/size-classes.js";
 import { resolveYDomain, xScaleFor, xZoneFractions, yScaleFor } from "./scales.js";
 import { AXIS_LINE, CHART_THEME, CROSSHAIR, DASH, GRID_LINE } from "./theme.js";
@@ -20,6 +22,7 @@ const LADDER = {
 };
 const INSIDE_LABEL_DX = 4;
 const INSIDE_LABEL_DY = -6;
+const labelsInside = (cls, height) => cls === "compact" && height > 0 && height < SHORT_CHART_HEIGHT;
 function defaultNumberFormat(v) {
   return fmtCompact(v, { digits: Math.abs(v) >= 1e3 ? 1 : 2 });
 }
@@ -47,18 +50,65 @@ function defaultFormatX(v) {
   return String(v);
 }
 const clampTo = (v, [lo, hi]) => Math.min(Math.max(v, Math.min(lo, hi)), Math.max(lo, hi));
+const dashedSwatch = (color) => `repeating-linear-gradient(90deg, ${color} 0 2px, transparent 2px 4px) center / 100% 2px no-repeat`;
+function engineRow(row) {
+  const { label, value, color, swatch, active } = row;
+  return {
+    label,
+    value,
+    ...color !== void 0 && { color: swatch === "dashed" ? dashedSwatch(color) : color },
+    ...active && { active }
+  };
+}
+function seriesRow(s, value, active) {
+  return engineRow({
+    label: s.note === void 0 ? s.label : `${s.label} \xB7 ${s.note}`,
+    value,
+    color: s.color,
+    swatch: s.dash === "dashed" ? "dashed" : "solid",
+    active
+  });
+}
+const REF_KEY_PREFIX = "__ref-";
+const refLegendKey = (index) => `${REF_KEY_PREFIX}${index}`;
+const SWATCH_SOLID = /* @__PURE__ */ new Map([
+  [VX.goodRef, VX.goodSolid],
+  [VX.badRef, VX.badSolid],
+  [VX.warnRef, VX.warnSolid],
+  // The tinted status fills are as translucent, and a consumer may pass either as a line color.
+  [VX.good, VX.goodSolid],
+  [VX.goodSoft, VX.goodSolid],
+  [VX.bad, VX.badSolid],
+  [VX.warn, VX.warnSolid]
+]);
+function refLegendSeries(refLines) {
+  return (refLines ?? []).flatMap(
+    (r, i) => r.legend === void 0 ? [] : [
+      {
+        key: refLegendKey(i),
+        label: r.legend.label,
+        color: SWATCH_SOLID.get(r.color) ?? r.color,
+        role: "reference",
+        tooltip: false,
+        getValue: () => null,
+        ...r.legend.mark !== void 0 && { mark: r.legend.mark },
+        ...r.dashed && { dash: "dashed" }
+      }
+    ]
+  );
+}
 function visibleSeries(series, hidden) {
   return series.filter(
     (s) => !hidden.has(s.key) && !(s.parent !== void 0 && hidden.has(s.parent))
   );
 }
 function yGuide(opts) {
-  const { cfg, axis, cls, side, grid } = opts;
+  const { cfg, axis, cls, side, grid, height } = opts;
   const ladder = LADDER[cls];
   const ticks = typeof cfg?.ticks === "object" ? { values: cfg.ticks } : { count: typeof cfg?.ticks === "number" ? cfg.ticks : ladder.yTicks };
   const gridLine = grid ? { grid: GRID_LINE } : {};
   if (cls === "micro") return { ...gridLine, axis: false };
-  const inside = cls === "compact";
+  const inside = labelsInside(cls, height);
   return {
     ...gridLine,
     ...side === "right" && { side: "right" },
@@ -91,8 +141,9 @@ function strideTicks(values, cls) {
   return values.filter((_, i) => i % stride === 0);
 }
 function xGuide(opts) {
-  const { model, xTicks, format, cls } = opts;
+  const { model, xTicks, format, cls, height } = opts;
   const ladder = LADDER[cls];
+  const inside = labelsInside(cls, height);
   const ticks = xTickPolicy(model, xTicks ?? ladder.xTicks);
   return {
     axis: {
@@ -102,8 +153,8 @@ function xGuide(opts) {
         fontSize: ladder.font,
         opacity: 1,
         thin: true,
-        // A locked-zero left margin (compact) must not clip the first label.
-        ...cls === "compact" && {
+        // A locked-zero left margin (inside labels) must not clip the first label.
+        ...inside && {
           anchor: ({ index }) => index === 0 ? "start" : void 0
         }
       }
@@ -241,27 +292,73 @@ function resolveAxes(input, visible) {
     scaleId: (side) => side === "right" && hasY2 ? "y2" : "y"
   };
 }
+const edgeSides = (edge, lower, upper) => ({
+  lower: edge !== void 0 && (edge.side === lower || edge.side === "both"),
+  upper: edge !== void 0 && (edge.side === upper || edge.side === "both")
+});
+const edgePaint = (edge) => ({
+  stroke: edge.color,
+  strokeOpacity: 1,
+  strokeWidth: edge.width ?? 1,
+  ...edge.dashed && { strokeDasharray: DASH }
+});
+const edgeRule = (position, [lo, hi], make) => position !== null && position > lo && position < hi ? [make(position)] : [];
 function underlayMarks(input, model, axes) {
   const fractionRows = [{ f0: 0, f1: 1 }];
-  const zones = (input.zones ?? []).map((z, i) => {
+  const zones = (input.zones ?? []).flatMap((z, i) => {
     const domain = axes.axisOf(z.axisSide).domain;
-    return decorative(
-      rect(fractionRows, {
-        id: `zone-${i}`,
-        x1: "f0",
-        x2: "f1",
-        y1: () => clampTo(z.from, domain),
-        y2: () => clampTo(z.to, domain),
-        xScale: "zx",
-        yScale: axes.scaleId(z.axisSide),
-        fill: z.fill,
-        inset: 0
-      })
+    const [lo, hi] = [Math.min(...domain), Math.max(...domain)];
+    const rule = (value, name) => edgeRule(
+      value,
+      [lo, hi],
+      (at) => decorative(
+        ruleY([at], {
+          id: `zone-${i}-${name}`,
+          yScale: axes.scaleId(z.axisSide),
+          ...z.edge && edgePaint(z.edge)
+        })
+      )
     );
+    const sides = edgeSides(z.edge, "bottom", "top");
+    return [
+      decorative(
+        rect(fractionRows, {
+          id: `zone-${i}`,
+          x1: "f0",
+          x2: "f1",
+          y1: () => clampTo(z.from, domain),
+          y2: () => clampTo(z.to, domain),
+          xScale: "zx",
+          yScale: axes.scaleId(z.axisSide),
+          fill: z.fill,
+          inset: 0
+        })
+      ),
+      ...sides.lower ? rule(Math.min(z.from, z.to), "bottom") : [],
+      ...sides.upper ? rule(Math.max(z.from, z.to), "top") : []
+    ];
   });
   const xZones = (input.xZones ?? []).flatMap((z, i) => {
     const f = xZoneFractions(z, model);
     if (!f) return [];
+    const sides = edgeSides(z.edge, "start", "end");
+    const widen = z.align === "edge" ? model.halfStep : 0;
+    const bound = (value, sign) => {
+      const fraction = value === void 0 ? null : model.fraction(value);
+      return fraction === null ? null : fraction + sign * widen;
+    };
+    const rule = (value, sign, name) => edgeRule(
+      bound(value, sign),
+      [0, 1],
+      (at) => decorative(
+        ruleX([at], {
+          id: `xzone-${i}-${name}`,
+          x: (v) => v,
+          xScale: "zx",
+          ...z.edge && edgePaint(z.edge)
+        })
+      )
+    );
     return [
       decorative(
         rect([{ f0: f[0], f1: f[1] }], {
@@ -274,32 +371,47 @@ function underlayMarks(input, model, axes) {
           fill: z.fill,
           inset: 0
         })
-      )
+      ),
+      // An omitted bound is the plot edge: nothing to draw a rule on.
+      ...sides.lower ? rule(z.from, -1, "start") : [],
+      ...sides.upper ? rule(z.to, 1, "end") : []
     ];
   });
   return [...zones, ...xZones];
 }
-const refLineMarks = (input, axes) => (input.refLines ?? []).map(
-  (r, i) => ruleY([r.value], {
-    id: `ref-${i}`,
-    stroke: r.color,
-    strokeOpacity: 1,
-    strokeWidth: 1,
-    yScale: axes.scaleId(r.axis),
-    ...r.dashed && { strokeDasharray: DASH }
-  })
+const refLineMarks = (input, axes) => (input.refLines ?? []).flatMap(
+  (r, i) => (
+    // A line that names itself in the legend can be toggled off there.
+    input.hidden?.has(refLegendKey(i)) ? [] : [
+      ruleY([r.value], {
+        id: `ref-${i}`,
+        stroke: r.color,
+        strokeOpacity: 1,
+        strokeWidth: 1,
+        yScale: axes.scaleId(r.axis),
+        ...r.dashed && { strokeDasharray: DASH }
+      })
+    ]
+  )
 );
 function buildScales(opts) {
-  const { input, model, axes, formatX, cls, zoneScale } = opts;
+  const { input, model, axes, formatX, cls, height, zoneScale } = opts;
   const { left, right } = axes;
   return {
     x: {
       scale: model.scale,
-      ...xGuide({ model, xTicks: input.xTicks, format: formatX, cls })
+      ...xGuide({ model, xTicks: input.xTicks, format: formatX, cls, height })
     },
     y: {
       scale: yScaleFor(input.y, left.domain),
-      ...yGuide({ cfg: input.y, axis: left, cls, side: "left", grid: input.y?.grid ?? true })
+      ...yGuide({
+        cfg: input.y,
+        axis: left,
+        cls,
+        height,
+        side: "left",
+        grid: input.y?.grid ?? true
+      })
     },
     ...right && {
       y2: {
@@ -309,6 +421,7 @@ function buildScales(opts) {
           cfg: input.y2,
           axis: right,
           cls,
+          height,
           side: "right",
           grid: input.y2?.grid ?? false
         })
@@ -342,6 +455,17 @@ function rowsOf(input, visibleKeys) {
     });
   };
 }
+function cursorDotMarks(input, visible, axes) {
+  return visible.flatMap((s) => {
+    const { cursorValue } = s;
+    if (!cursorValue) return [];
+    const rows = input.data.flatMap((d) => {
+      const y = cursorValue(d);
+      return y === null || !Number.isFinite(y) ? [] : [{ x: input.x(d), y, series: s.key, datum: d }];
+    });
+    return [cursorDots(s, rows, axes.onRight(s) ? "y2" : void 0)];
+  });
+}
 function tooltipSpec(opts) {
   const { input, axes, visible, keys, visibleKeys, formatX } = opts;
   const hidden = input.series.filter((s) => !visibleKeys.has(s.key));
@@ -362,19 +486,32 @@ function tooltipSpec(opts) {
       for (const s of rowSeries) {
         const v = s.getValue(d);
         if (v === null || !Number.isFinite(v)) continue;
-        rows.push({
-          label: s.note === void 0 ? s.label : `${s.label} \xB7 ${s.note}`,
-          value: s.formatValue ? s.formatValue(v, d) : axes.axisOf(axes.onRight(s) ? "right" : "left").format(v),
-          color: s.color,
-          ...input.highlighted === s.key && { active: true }
-        });
+        rows.push(
+          seriesRow(
+            s,
+            s.formatValue ? s.formatValue(v, d) : axes.axisOf(axes.onRight(s) ? "right" : "left").format(v),
+            input.highlighted === s.key
+          )
+        );
       }
       const extra = (input.tooltip || void 0)?.rows?.(d, { visible, hidden }) ?? [];
-      return { title: tooltipHeader(input, formatX, x, d), rows: [...rows, ...extra] };
+      return {
+        title: tooltipHeader(input, formatX, x, d),
+        rows: [...rows, ...extra.map(engineRow)]
+      };
     }
   };
 }
+function guardReservedKeys(series) {
+  if (process.env.NODE_ENV === "production") return;
+  const clash = series.find((s) => s.key.startsWith(REF_KEY_PREFIX));
+  if (clash)
+    throw new Error(
+      `[basalt] CartesianChart: the series key "${clash.key}" is reserved (\`${REF_KEY_PREFIX}\` prefix names reference-line legend entries)`
+    );
+}
 function compileCartesian(input) {
+  guardReservedKeys(input.series);
   const visible = visibleSeries(input.series, input.hidden ?? /* @__PURE__ */ new Set());
   const visibleKeys = new Set(visible.map((s) => s.key));
   const keys = new Set(input.series.map((s) => s.key));
@@ -382,6 +519,7 @@ function compileCartesian(input) {
   const axes = resolveAxes(input, visible);
   const under = underlayMarks(input, model, axes);
   const over = refLineMarks(input, axes);
+  const dots = cursorDotMarks(input, visible, axes);
   const rows = rowsOf(input, visibleKeys);
   const formatX = (v) => input.formatX ? input.formatX(v) : defaultFormatX(v);
   const gradients = input.series.flatMap(
@@ -402,12 +540,20 @@ function compileCartesian(input) {
         y2Domain: axes.right?.domain
       });
       return {
-        marks: [...under, ...kindMarks, ...over, crosshair({ x: CROSSHAIR, y: false })],
-        scales: buildScales({ input, model, axes, formatX, cls, zoneScale: under.length > 0 }),
+        marks: [...under, ...kindMarks, ...dots, ...over, crosshair({ x: CROSSHAIR, y: false })],
+        scales: buildScales({
+          input,
+          model,
+          axes,
+          formatX,
+          cls,
+          height,
+          zoneScale: under.length > 0
+        }),
         theme: CHART_THEME,
         ...gradients.length > 0 && { gradients },
         clip: true,
-        ...cls === "compact" && { margin: { left: 0, ...axes.right && { right: 0 } } }
+        ...labelsInside(cls, height) && { margin: { left: 0, ...axes.right && { right: 0 } } }
       };
     },
     // Followers paint the crosshair only, unless the chart opts into following tooltips.
@@ -427,9 +573,13 @@ export {
   areaGradient,
   areaGradientId,
   compileCartesian,
+  dashedSwatch,
   dateTicks,
   defaultFormatX,
   defaultNumberFormat,
+  engineRow,
+  refLegendSeries,
+  seriesRow,
   strideTicks,
   utcAxisDate,
   utcHeaderDate,