@pibbl/core 0.0.1 → 0.0.3-alpha.109.1

package/dist/features/viz/inspection.d.ts

@@ -0,0 +1,19 @@
+/** Optional committed-render inspection. Rendering entries do not import these algorithms. */
+export { useNumericInspection, usePointInspection, } from "./inspection/capture.js";
+export { withInspection } from "./inspection/handler.js";
+export { paintedPointAt } from "./inspection/painted-point.js";
+export { useBarInspection, paintedBarAt } from "./inspection/bar.js";
+export type { BarInspectionRef, BarRenderedSeries, PaintedBarHit, } from "./inspection/bar.js";
+export type { PaintedPointHit } from "./inspection/painted-point.js";
+export type { InspectionContext, InspectionRef } from "./inspection/handler.js";
+export type { NumericInspectionRef, PointInspectionRef, PointRenderedSeries, } from "./inspection/capture-types.js";
+export { nearestRecordedX, nearestRecordedPoint, sampleRecordedX, firstSourceObservation, lastSourceObservation, anchorInsideClips, } from "./inspection/queries.js";
+export type { NumericRenderedSeries, NumericRenderedObservation, RecordedNumericHit, NearestRecordedXHit, NearestRecordedPointHit, RecordedXSample, NumericRenderedFilter, NumericDuplicateResolver, NumericDomainInterpolation, RenderedSeriesPoint, } from "./inspection/query-types.js";
+export type { NumericRenderedSeries as RenderedSeries, InspectionCandidate, NumericRenderedAnchors, } from "./inspection/query-types.js";
+export type { NearestRecordedXOptions, NearestRecordedPointOptions, SampleRecordedXOptions, } from "./inspection/queries.js";
+export { useVolumeInspection, nearestRecordedVolumeX, paintedVolumeAt, } from "./inspection/volume.js";
+export type { VolumeObservation, VolumeInspectionCandidate, NearestVolumeHit, PaintedVolumeHit, VolumeInspectionRef, VolumeRenderedSeries, } from "./inspection/volume.js";
+export { useCandleInspection, nearestRecordedCandleX, paintedCandleAt, } from "./inspection/candle.js";
+export type { CandleObservation, CandleInspectionCandidate, NearestCandleHit, PaintedCandleHit, CandleInspectionRef, CandleRenderedSeries, } from "./inspection/candle.js";
+export { useOhlcBarInspection, nearestRecordedOhlcBarX, paintedOhlcBarAt, } from "./inspection/ohlc-bar.js";
+export type { OhlcBarObservation, OhlcBarInspectionCandidate, NearestOhlcBarHit, PaintedOhlcBarHit, OhlcBarInspectionRef, OhlcBarRenderedSeries, } from "./inspection/ohlc-bar.js";

package/dist/features/viz/inspection.js

@@ -0,0 +1,54 @@
+import {
+  useNumericInspection,
+  usePointInspection
+} from "./inspection/capture.js";
+import { withInspection } from "./inspection/handler.js";
+import { paintedPointAt } from "./inspection/painted-point.js";
+import { useBarInspection, paintedBarAt } from "./inspection/bar.js";
+import {
+  nearestRecordedX,
+  nearestRecordedPoint,
+  sampleRecordedX,
+  firstSourceObservation,
+  lastSourceObservation,
+  anchorInsideClips
+} from "./inspection/queries.js";
+import {
+  useVolumeInspection,
+  nearestRecordedVolumeX,
+  paintedVolumeAt
+} from "./inspection/volume.js";
+import {
+  useCandleInspection,
+  nearestRecordedCandleX,
+  paintedCandleAt
+} from "./inspection/candle.js";
+import {
+  useOhlcBarInspection,
+  nearestRecordedOhlcBarX,
+  paintedOhlcBarAt
+} from "./inspection/ohlc-bar.js";
+export {
+  anchorInsideClips,
+  firstSourceObservation,
+  lastSourceObservation,
+  nearestRecordedCandleX,
+  nearestRecordedOhlcBarX,
+  nearestRecordedPoint,
+  nearestRecordedVolumeX,
+  nearestRecordedX,
+  paintedBarAt,
+  paintedCandleAt,
+  paintedOhlcBarAt,
+  paintedPointAt,
+  paintedVolumeAt,
+  sampleRecordedX,
+  useBarInspection,
+  useCandleInspection,
+  useNumericInspection,
+  useOhlcBarInspection,
+  usePointInspection,
+  useVolumeInspection,
+  withInspection
+};
+//# sourceMappingURL=inspection.js.map

package/dist/features/viz/inspection.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/features/viz/inspection.ts"],
+  "sourcesContent": ["/** Optional committed-render inspection. Rendering entries do not import these algorithms. */\nexport {\n  useNumericInspection,\n  usePointInspection,\n} from \"./inspection/capture.js\";\nexport { withInspection } from \"./inspection/handler.js\";\nexport { paintedPointAt } from \"./inspection/painted-point.js\";\nexport { useBarInspection, paintedBarAt } from \"./inspection/bar.js\";\nexport type {\n  BarInspectionRef,\n  BarRenderedSeries,\n  PaintedBarHit,\n} from \"./inspection/bar.js\";\nexport type { PaintedPointHit } from \"./inspection/painted-point.js\";\nexport type { InspectionContext, InspectionRef } from \"./inspection/handler.js\";\nexport type {\n  NumericInspectionRef,\n  PointInspectionRef,\n  PointRenderedSeries,\n} from \"./inspection/capture-types.js\";\nexport {\n  nearestRecordedX,\n  nearestRecordedPoint,\n  sampleRecordedX,\n  firstSourceObservation,\n  lastSourceObservation,\n  anchorInsideClips,\n} from \"./inspection/queries.js\";\nexport type {\n  NumericRenderedSeries,\n  NumericRenderedObservation,\n  RecordedNumericHit,\n  NearestRecordedXHit,\n  NearestRecordedPointHit,\n  RecordedXSample,\n  NumericRenderedFilter,\n  NumericDuplicateResolver,\n  NumericDomainInterpolation,\n  RenderedSeriesPoint,\n} from \"./inspection/query-types.js\";\n\nexport type {\n  NumericRenderedSeries as RenderedSeries,\n  InspectionCandidate,\n  NumericRenderedAnchors,\n} from \"./inspection/query-types.js\";\nexport type {\n  NearestRecordedXOptions,\n  NearestRecordedPointOptions,\n  SampleRecordedXOptions,\n} from \"./inspection/queries.js\";\nexport {\n  useVolumeInspection,\n  nearestRecordedVolumeX,\n  paintedVolumeAt,\n} from \"./inspection/volume.js\";\nexport type {\n  VolumeObservation,\n  VolumeInspectionCandidate,\n  NearestVolumeHit,\n  PaintedVolumeHit,\n  VolumeInspectionRef,\n  VolumeRenderedSeries,\n} from \"./inspection/volume.js\";\nexport {\n  useCandleInspection,\n  nearestRecordedCandleX,\n  paintedCandleAt,\n} from \"./inspection/candle.js\";\nexport type {\n  CandleObservation,\n  CandleInspectionCandidate,\n  NearestCandleHit,\n  PaintedCandleHit,\n  CandleInspectionRef,\n  CandleRenderedSeries,\n} from \"./inspection/candle.js\";\nexport {\n  useOhlcBarInspection,\n  nearestRecordedOhlcBarX,\n  paintedOhlcBarAt,\n} from \"./inspection/ohlc-bar.js\";\nexport type {\n  OhlcBarObservation,\n  OhlcBarInspectionCandidate,\n  NearestOhlcBarHit,\n  PaintedOhlcBarHit,\n  OhlcBarInspectionRef,\n  OhlcBarRenderedSeries,\n} from \"./inspection/ohlc-bar.js\";\n"],
+  "mappings": "AACA;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,sBAAsB;AAC/B,SAAS,sBAAsB;AAC/B,SAAS,kBAAkB,oBAAoB;AAa/C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAwBP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AASP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AASP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;",
+  "names": []
+}

package/dist/features/viz/inspection.mjs

@@ -0,0 +1 @@
+export * from './inspection.js';

package/dist/features/viz/lib/area-series.d.ts

@@ -0,0 +1,62 @@
+import type { Path } from "@pibbl/core";
+import type { FillStyle, PibblEventHandlers, PibblEventParticipationOptions, SignalValue } from "@pibbl/core";
+import type { SignalStyle } from "@pibbl/core/internal";
+import type { LineAccessor, LineSeriesProps } from "./types.js";
+/**
+ * Presentation properties for an {@link AreaSeries}.
+ *
+ * @see {@link FillStyle}
+ * @see {@link AreaSeriesProps}
+ */
+export interface AreaSeriesStyle {
+    /** Paint used for the area interior. */
+    readonly fill?: FillStyle;
+    /** Opacity of the painted area, from zero through one. */
+    readonly opacity?: number;
+    /** Cursor shown while the area target owns pointer presentation. */
+    readonly cursor?: string;
+}
+/**
+ * Authored inputs for {@link AreaSeries}.
+ *
+ * The data, coordinate accessors, scales, and defined predicate use the same
+ * contract as {@link LineSeriesProps}. Each contiguous run of at least two
+ * valid observations is closed to `baseline` in data space.
+ *
+ * @see {@link LineSeriesProps}
+ * @see {@link AreaSeriesStyle}
+ */
+export interface AreaSeriesProps<D> extends PibblEventHandlers, PibblEventParticipationOptions {
+    /** Application data supplied directly or through a signal. */
+    readonly data: LineSeriesProps<D>["data"];
+    /** Property key or callback extracting the horizontal coordinate. */
+    readonly x: LineAccessor<D>;
+    /** Property key or callback extracting the vertical coordinate. */
+    readonly y: LineAccessor<D>;
+    /** Continuous scale used to map horizontal data coordinates. */
+    readonly xScale: LineSeriesProps<D>["xScale"];
+    /** Continuous scale used to map vertical data coordinates and baseline. */
+    readonly yScale: LineSeriesProps<D>["yScale"];
+    /** Selects records that participate in an observed run. */
+    readonly defined?: LineSeriesProps<D>["defined"];
+    /** Curve used to connect successive observed samples. */
+    readonly curve?: LineSeriesProps<D>["curve"];
+    /** Finite data-space value to which each observed run closes. */
+    readonly baseline: SignalValue<number>;
+    /** Shared area presentation. Individual datum styling is not supported. */
+    readonly style?: SignalValue<SignalStyle<AreaSeriesStyle>>;
+}
+/**
+ * Draws each contiguous observed run as a filled polygon closed to an explicit baseline.
+ *
+ * Missing, non-finite, and excluded coordinates split runs. A lone observation has no area.
+ * The component owns one ordinary {@link Path} target, so event participation follows the
+ * standard Path defaults; callers may wrap it in `Clip` when clipping is needed.
+ *
+ * @param props - Data, coordinate accessors, continuous scales, baseline, and presentation.
+ * @returns A Pibbl path node containing all drawable area runs.
+ * @throws When `data` is not an array, the baseline is not finite, or presentation is invalid.
+ *
+ * @see {@link AreaSeriesProps}
+ */
+export declare function AreaSeries<D>({ data: dataInput, x: xInput, y: yInput, xScale: xId, yScale: yId, baseline: baselineInput, defined, curve, style: styleInput, ...eventProps }: AreaSeriesProps<D>): import("../../../jsx-runtime.js").JSX.Element;

package/dist/features/viz/lib/area-series.js

@@ -0,0 +1,120 @@
+import { jsx } from "@pibbl/core/jsx-runtime";
+import { useNumericPosition } from "./series-position.js";
+import { Path, resolveSignalValue } from "@pibbl/core";
+import {
+  useInternalValueMemoSlot,
+  validateTexturePaint
+} from "@pibbl/core/internal";
+import {
+  appendCurveForward,
+  curveGeometry,
+  resolveSeriesCurve
+} from "./curve-definition.js";
+import { opacity } from "./paint.js";
+import { useContinuousScale } from "./use-continuous-scale.js";
+function accessor(input) {
+  return typeof input === "function" ? input : (datum) => datum[input];
+}
+function fill(value) {
+  if (typeof value === "string" || value instanceof CanvasGradient || value instanceof CanvasPattern)
+    return value;
+  try {
+    validateTexturePaint(value);
+    return value;
+  } catch {
+    throw new TypeError("AreaSeries: invalid fill.");
+  }
+}
+function AreaSeries({
+  data: dataInput,
+  x: xInput,
+  y: yInput,
+  xScale: xId,
+  yScale: yId,
+  baseline: baselineInput,
+  defined,
+  curve,
+  style: styleInput,
+  ...eventProps
+}) {
+  const xScale = useNumericPosition(xId);
+  const yScale = useContinuousScale(yId).get();
+  const curveDefinition = resolveSeriesCurve(curve);
+  const x = useInternalValueMemoSlot(
+    "vizAreaXAccessor",
+    () => accessor(xInput),
+    [xInput]
+  );
+  const y = useInternalValueMemoSlot(
+    "vizAreaYAccessor",
+    () => accessor(yInput),
+    [yInput]
+  );
+  const data = resolveSignalValue(dataInput);
+  if (!Array.isArray(data))
+    throw new TypeError(
+      "AreaSeries data must be an array or a signal containing an array."
+    );
+  const baseline = resolveSignalValue(baselineInput);
+  if (typeof baseline !== "number" || !Number.isFinite(baseline))
+    throw new RangeError("AreaSeries baseline must be finite.");
+  const baselineY = yScale.map(baseline);
+  if (!Number.isFinite(baselineY))
+    throw new RangeError(
+      "AreaSeries baseline must map to a finite coordinate."
+    );
+  const style = resolveSignalValue(styleInput) ?? {};
+  if (style === null || typeof style !== "object" || Array.isArray(style))
+    throw new TypeError("AreaSeries: style must be an object.");
+  const areaFill = fill(resolveSignalValue(style.fill) ?? "#2563eb");
+  const alpha = opacity(resolveSignalValue(style.opacity) ?? 0.2, "AreaSeries");
+  const cursor = resolveSignalValue(style.cursor);
+  if (cursor !== void 0 && typeof cursor !== "string")
+    throw new TypeError("AreaSeries: cursor must be a string.");
+  const path = new Path2D();
+  let run = [];
+  const closeRun = () => {
+    if (run.length >= 2) {
+      const first = run[0];
+      const last = run[run.length - 1];
+      const geometry = curveGeometry(curveDefinition, run);
+      path.moveTo(geometry.start[0], geometry.start[1]);
+      appendCurveForward(path, geometry);
+      path.lineTo(last[0], baselineY);
+      path.lineTo(first[0], baselineY);
+      path.closePath();
+    }
+    run = [];
+  };
+  for (let i = 0; i < data.length; i++) {
+    const datum = data[i];
+    if (defined && !defined(datum, i, data)) {
+      closeRun();
+      continue;
+    }
+    const xv = x(datum, i, data);
+    const yv = y(datum, i, data);
+    if (typeof xv !== "number" || typeof yv !== "number" || !Number.isFinite(xv) || !Number.isFinite(yv)) {
+      closeRun();
+      continue;
+    }
+    const point = [xScale.map(xv), yScale.map(yv)];
+    if (!Number.isFinite(point[0]) || !Number.isFinite(point[1])) {
+      closeRun();
+      continue;
+    }
+    run.push(point);
+  }
+  closeRun();
+  return /* @__PURE__ */ jsx(
+    Path,
+    {
+      ...eventProps,
+      style: { d: path, fill: areaFill, opacity: alpha, cursor }
+    }
+  );
+}
+export {
+  AreaSeries
+};
+//# sourceMappingURL=area-series.js.map

package/dist/features/viz/lib/area-series.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/features/viz/lib/area-series.tsx"],
+  "sourcesContent": ["import { useNumericPosition } from \"./series-position.js\";\nimport { Path, resolveSignalValue } from \"@pibbl/core\";\nimport type {\n  FillStyle,\n  PibblEventHandlers,\n  PibblEventParticipationOptions,\n  SignalValue,\n} from \"@pibbl/core\";\nimport {\n  useInternalValueMemoSlot,\n  validateTexturePaint,\n} from \"@pibbl/core/internal\";\nimport type { SignalStyle } from \"@pibbl/core/internal\";\nimport type { LineAccessor, LineCoordinate, LineSeriesProps } from \"./types.js\";\nimport {\n  appendCurveForward,\n  curveGeometry,\n  resolveSeriesCurve,\n} from \"./curve-definition.js\";\nimport { opacity } from \"./paint.js\";\nimport { useContinuousScale } from \"./use-continuous-scale.js\";\n\n/**\n * Presentation properties for an {@link AreaSeries}.\n *\n * @see {@link FillStyle}\n * @see {@link AreaSeriesProps}\n */\nexport interface AreaSeriesStyle {\n  /** Paint used for the area interior. */\n  readonly fill?: FillStyle;\n  /** Opacity of the painted area, from zero through one. */\n  readonly opacity?: number;\n  /** Cursor shown while the area target owns pointer presentation. */\n  readonly cursor?: string;\n}\n\n/**\n * Authored inputs for {@link AreaSeries}.\n *\n * The data, coordinate accessors, scales, and defined predicate use the same\n * contract as {@link LineSeriesProps}. Each contiguous run of at least two\n * valid observations is closed to `baseline` in data space.\n *\n * @see {@link LineSeriesProps}\n * @see {@link AreaSeriesStyle}\n */\nexport interface AreaSeriesProps<D>\n  extends PibblEventHandlers, PibblEventParticipationOptions {\n  /** Application data supplied directly or through a signal. */\n  readonly data: LineSeriesProps<D>[\"data\"];\n  /** Property key or callback extracting the horizontal coordinate. */\n  readonly x: LineAccessor<D>;\n  /** Property key or callback extracting the vertical coordinate. */\n  readonly y: LineAccessor<D>;\n  /** Continuous scale used to map horizontal data coordinates. */\n  readonly xScale: LineSeriesProps<D>[\"xScale\"];\n  /** Continuous scale used to map vertical data coordinates and baseline. */\n  readonly yScale: LineSeriesProps<D>[\"yScale\"];\n  /** Selects records that participate in an observed run. */\n  readonly defined?: LineSeriesProps<D>[\"defined\"];\n  /** Curve used to connect successive observed samples. */\n  readonly curve?: LineSeriesProps<D>[\"curve\"];\n  /** Finite data-space value to which each observed run closes. */\n  readonly baseline: SignalValue<number>;\n  /** Shared area presentation. Individual datum styling is not supported. */\n  readonly style?: SignalValue<SignalStyle<AreaSeriesStyle>>;\n}\n\nfunction accessor<D>(\n  input: LineAccessor<D>,\n): (datum: D, index: number, data: readonly D[]) => LineCoordinate {\n  return typeof input === \"function\"\n    ? input\n    : (datum) => datum[input] as LineCoordinate;\n}\n\nfunction fill(value: unknown): FillStyle {\n  if (\n    typeof value === \"string\" ||\n    value instanceof CanvasGradient ||\n    value instanceof CanvasPattern\n  )\n    return value;\n  try {\n    validateTexturePaint(value as never);\n    return value as FillStyle;\n  } catch {\n    throw new TypeError(\"AreaSeries: invalid fill.\");\n  }\n}\n\n/**\n * Draws each contiguous observed run as a filled polygon closed to an explicit baseline.\n *\n * Missing, non-finite, and excluded coordinates split runs. A lone observation has no area.\n * The component owns one ordinary {@link Path} target, so event participation follows the\n * standard Path defaults; callers may wrap it in `Clip` when clipping is needed.\n *\n * @param props - Data, coordinate accessors, continuous scales, baseline, and presentation.\n * @returns A Pibbl path node containing all drawable area runs.\n * @throws When `data` is not an array, the baseline is not finite, or presentation is invalid.\n *\n * @see {@link AreaSeriesProps}\n */\nexport function AreaSeries<D>({\n  data: dataInput,\n  x: xInput,\n  y: yInput,\n  xScale: xId,\n  yScale: yId,\n  baseline: baselineInput,\n  defined,\n  curve,\n  style: styleInput,\n  ...eventProps\n}: AreaSeriesProps<D>) {\n  const xScale = useNumericPosition(xId);\n  const yScale = useContinuousScale(yId).get();\n  const curveDefinition = resolveSeriesCurve(curve);\n  const x = useInternalValueMemoSlot(\n    \"vizAreaXAccessor\",\n    () => accessor(xInput),\n    [xInput],\n  );\n  const y = useInternalValueMemoSlot(\n    \"vizAreaYAccessor\",\n    () => accessor(yInput),\n    [yInput],\n  );\n  const data = resolveSignalValue(dataInput);\n  if (!Array.isArray(data))\n    throw new TypeError(\n      \"AreaSeries data must be an array or a signal containing an array.\",\n    );\n  const baseline = resolveSignalValue(baselineInput);\n  if (typeof baseline !== \"number\" || !Number.isFinite(baseline))\n    throw new RangeError(\"AreaSeries baseline must be finite.\");\n  const baselineY = yScale.map(baseline);\n  if (!Number.isFinite(baselineY))\n    throw new RangeError(\n      \"AreaSeries baseline must map to a finite coordinate.\",\n    );\n  const style = resolveSignalValue(styleInput) ?? {};\n  if (style === null || typeof style !== \"object\" || Array.isArray(style))\n    throw new TypeError(\"AreaSeries: style must be an object.\");\n  const areaFill = fill(resolveSignalValue(style.fill) ?? \"#2563eb\");\n  const alpha = opacity(resolveSignalValue(style.opacity) ?? 0.2, \"AreaSeries\");\n  const cursor = resolveSignalValue(style.cursor);\n  if (cursor !== undefined && typeof cursor !== \"string\")\n    throw new TypeError(\"AreaSeries: cursor must be a string.\");\n\n  const path = new Path2D();\n  let run: (readonly [number, number])[] = [];\n  const closeRun = () => {\n    if (run.length >= 2) {\n      const first = run[0];\n      const last = run[run.length - 1];\n      const geometry = curveGeometry(curveDefinition, run);\n      path.moveTo(geometry.start[0], geometry.start[1]);\n      appendCurveForward(path, geometry);\n      path.lineTo(last[0], baselineY);\n      path.lineTo(first[0], baselineY);\n      path.closePath();\n    }\n    run = [];\n  };\n  for (let i = 0; i < data.length; i++) {\n    const datum = data[i];\n    if (defined && !defined(datum, i, data)) {\n      closeRun();\n      continue;\n    }\n    const xv = x(datum, i, data);\n    const yv = y(datum, i, data);\n    if (\n      typeof xv !== \"number\" ||\n      typeof yv !== \"number\" ||\n      !Number.isFinite(xv) ||\n      !Number.isFinite(yv)\n    ) {\n      closeRun();\n      continue;\n    }\n    const point = [xScale.map(xv), yScale.map(yv)] as const;\n    if (!Number.isFinite(point[0]) || !Number.isFinite(point[1])) {\n      closeRun();\n      continue;\n    }\n    run.push(point);\n  }\n  closeRun();\n  return (\n    <Path\n      {...eventProps}\n      style={{ d: path, fill: areaFill, opacity: alpha, cursor }}\n    />\n  );\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/features/viz/lib/axis-labels.d.ts

@@ -0,0 +1,2 @@
+/** Fit text without changing its coordinate or the owning scale. */
+export declare function fitAxisLabel(context: Pick<CanvasRenderingContext2D, "measureText">, text: string, maxWidth: number, overflow: "allow" | "wrap" | "truncate", maxLines: number): readonly string[];

package/dist/features/viz/lib/axis-labels.js

@@ -0,0 +1,41 @@
+function fitAxisLabel(context, text, maxWidth, overflow, maxLines) {
+  if (overflow === "allow") return [text];
+  const graphemes = (value) => Array.from(new Intl.Segmenter(void 0, { granularity: "grapheme" }).segment(value), (part) => part.segment);
+  const truncate = (value, force = false) => {
+    if (!force && context.measureText(value).width <= maxWidth) return value;
+    if (context.measureText("\u2026").width > maxWidth) return "";
+    const parts = graphemes(value);
+    while (parts.length && context.measureText(parts.join("").trimEnd() + "\u2026").width > maxWidth) parts.pop();
+    return parts.join("").trimEnd() + "\u2026";
+  };
+  if (overflow === "truncate") return [truncate(text)];
+  const words = text.trim().split(/\s+/u);
+  const lines = [];
+  let line = "";
+  for (const word of words) {
+    const joined = line ? `${line} ${word}` : word;
+    if (context.measureText(joined).width <= maxWidth) {
+      line = joined;
+      continue;
+    }
+    if (line) {
+      lines.push(line);
+      line = "";
+    }
+    for (const part of graphemes(word)) {
+      if (line && context.measureText(line + part).width > maxWidth) {
+        lines.push(line);
+        line = "";
+      }
+      line += part;
+    }
+  }
+  if (line || !lines.length) lines.push(line);
+  const fitted = lines.slice(0, maxLines).map((value) => truncate(value));
+  if (lines.length > maxLines) fitted[maxLines - 1] = truncate(fitted[maxLines - 1], true);
+  return fitted;
+}
+export {
+  fitAxisLabel
+};
+//# sourceMappingURL=axis-labels.js.map

package/dist/features/viz/lib/axis-labels.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/features/viz/lib/axis-labels.ts"],
+  "sourcesContent": ["/** Fit text without changing its coordinate or the owning scale. */\nexport function fitAxisLabel(context: Pick<CanvasRenderingContext2D, \"measureText\">, text: string, maxWidth: number, overflow: \"allow\" | \"wrap\" | \"truncate\", maxLines: number): readonly string[] {\n  if (overflow === \"allow\") return [text];\n  const graphemes = (value: string) => Array.from(new Intl.Segmenter(undefined, { granularity: \"grapheme\" }).segment(value), part => part.segment);\n  const truncate = (value: string, force = false) => {\n    if (!force && context.measureText(value).width <= maxWidth) return value;\n    if (context.measureText(\"\u2026\").width > maxWidth) return \"\";\n    const parts = graphemes(value);\n    while (parts.length && context.measureText(parts.join(\"\").trimEnd() + \"\u2026\").width > maxWidth) parts.pop();\n    return parts.join(\"\").trimEnd() + \"\u2026\";\n  };\n  if (overflow === \"truncate\") return [truncate(text)];\n  const words = text.trim().split(/\\s+/u);\n  const lines: string[] = [];\n  let line = \"\";\n  for (const word of words) {\n    const joined = line ? `${line} ${word}` : word;\n    if (context.measureText(joined).width <= maxWidth) { line = joined; continue; }\n    if (line) { lines.push(line); line = \"\"; }\n    for (const part of graphemes(word)) {\n      if (line && context.measureText(line + part).width > maxWidth) { lines.push(line); line = \"\"; }\n      line += part;\n    }\n  }\n  if (line || !lines.length) lines.push(line);\n  const fitted = lines.slice(0, maxLines).map(value => truncate(value));\n  if (lines.length > maxLines) fitted[maxLines - 1] = truncate(fitted[maxLines - 1], true);\n  return fitted;\n}\n"],
+  "mappings": "AACO,SAAS,aAAa,SAAwD,MAAc,UAAkB,UAAyC,UAAqC;AACjM,MAAI,aAAa,QAAS,QAAO,CAAC,IAAI;AACtC,QAAM,YAAY,CAAC,UAAkB,MAAM,KAAK,IAAI,KAAK,UAAU,QAAW,EAAE,aAAa,WAAW,CAAC,EAAE,QAAQ,KAAK,GAAG,UAAQ,KAAK,OAAO;AAC/I,QAAM,WAAW,CAAC,OAAe,QAAQ,UAAU;AACjD,QAAI,CAAC,SAAS,QAAQ,YAAY,KAAK,EAAE,SAAS,SAAU,QAAO;AACnE,QAAI,QAAQ,YAAY,QAAG,EAAE,QAAQ,SAAU,QAAO;AACtD,UAAM,QAAQ,UAAU,KAAK;AAC7B,WAAO,MAAM,UAAU,QAAQ,YAAY,MAAM,KAAK,EAAE,EAAE,QAAQ,IAAI,QAAG,EAAE,QAAQ,SAAU,OAAM,IAAI;AACvG,WAAO,MAAM,KAAK,EAAE,EAAE,QAAQ,IAAI;AAAA,EACpC;AACA,MAAI,aAAa,WAAY,QAAO,CAAC,SAAS,IAAI,CAAC;AACnD,QAAM,QAAQ,KAAK,KAAK,EAAE,MAAM,MAAM;AACtC,QAAM,QAAkB,CAAC;AACzB,MAAI,OAAO;AACX,aAAW,QAAQ,OAAO;AACxB,UAAM,SAAS,OAAO,GAAG,IAAI,IAAI,IAAI,KAAK;AAC1C,QAAI,QAAQ,YAAY,MAAM,EAAE,SAAS,UAAU;AAAE,aAAO;AAAQ;AAAA,IAAU;AAC9E,QAAI,MAAM;AAAE,YAAM,KAAK,IAAI;AAAG,aAAO;AAAA,IAAI;AACzC,eAAW,QAAQ,UAAU,IAAI,GAAG;AAClC,UAAI,QAAQ,QAAQ,YAAY,OAAO,IAAI,EAAE,QAAQ,UAAU;AAAE,cAAM,KAAK,IAAI;AAAG,eAAO;AAAA,MAAI;AAC9F,cAAQ;AAAA,IACV;AAAA,EACF;AACA,MAAI,QAAQ,CAAC,MAAM,OAAQ,OAAM,KAAK,IAAI;AAC1C,QAAM,SAAS,MAAM,MAAM,GAAG,QAAQ,EAAE,IAAI,WAAS,SAAS,KAAK,CAAC;AACpE,MAAI,MAAM,SAAS,SAAU,QAAO,WAAW,CAAC,IAAI,SAAS,OAAO,WAAW,CAAC,GAAG,IAAI;AACvF,SAAO;AACT;",
+  "names": []
+}

package/dist/features/viz/lib/axis-title.d.ts

@@ -0,0 +1,23 @@
+import { type SignalValue } from "@pibbl/core";
+import type { SignalStyle } from "@pibbl/core/internal";
+import type { AxisProps, AxisStyle, ScaleId } from "./types.js";
+/** Scale-aligned axis text; callers reserve the margin outside the plot. See {@link AxisTitle}. */
+export interface AxisTitleProps {
+    /** Ancestor scale whose range supplies the title midpoint. */
+    readonly scale: ScaleId;
+    /** Plot edge; left/right titles rotate along the axis. */
+    readonly position: AxisProps["position"];
+    /** Single-line title. */
+    readonly label: SignalValue<string>;
+    /** Optional unit appended in parentheses; empty string omits it. */
+    readonly unit?: SignalValue<string>;
+    /** Nonnegative finite distance outside the plot edge, default 40 pixels. */
+    readonly offset?: SignalValue<number>;
+    /** Font defaults to 12px sans-serif, fill to #617783, opacity to 1. */
+    readonly style?: SignalValue<SignalStyle<Pick<AxisStyle, "font" | "fill" | "opacity">>>;
+}
+/** Paint an axis title with optional units, without allocating margins or changing ticks.
+ * @param props - Scale geometry and presentation. See {@link AxisTitleProps}.
+ * @returns Decorative chart content in the caller's coordinate space.
+ */
+export declare function AxisTitle(props: AxisTitleProps): import("../../../jsx-runtime.js").JSX.Element;

package/dist/features/viz/lib/axis-title.js

@@ -0,0 +1,24 @@
+import { jsx } from "@pibbl/core/jsx-runtime";
+import { Group, Text, resolveSignalValue } from "@pibbl/core";
+import { lookupScale } from "./scale-context.js";
+import { opacity } from "./paint.js";
+function AxisTitle(props) {
+  if (!["top", "bottom", "left", "right"].includes(props.position)) throw new TypeError("AxisTitle position must be top, bottom, left, or right.");
+  const source = lookupScale(props.scale, "AxisTitle");
+  if (!source) throw new TypeError("AxisTitle requires a scale ID.");
+  const scale = source.get(), label = resolveSignalValue(props.label), unit = resolveSignalValue(props.unit) ?? "";
+  if (typeof label !== "string" || /[\r\n]/.test(label) || typeof unit !== "string" || /[\r\n]/.test(unit))
+    throw new TypeError("AxisTitle label and unit must be single-line strings.");
+  const offset = resolveSignalValue(props.offset) ?? 40;
+  if (typeof offset !== "number" || !Number.isFinite(offset) || offset < 0) throw new RangeError("AxisTitle offset must be finite and nonnegative.");
+  const horizontal = props.position === "top" || props.position === "bottom";
+  const midpoint = scale.range[0] / 2 + scale.range[1] / 2;
+  const x = horizontal ? midpoint : props.position === "left" ? -offset : scale.frame.width + offset;
+  const y = horizontal ? props.position === "top" ? -offset : scale.frame.height + offset : midpoint;
+  const style = resolveSignalValue(props.style) ?? {};
+  return /* @__PURE__ */ jsx(Group, { style: { translateX: x, translateY: y }, children: /* @__PURE__ */ jsx(Group, { style: { rotationDegrees: horizontal ? 0 : props.position === "left" ? -90 : 90 }, children: /* @__PURE__ */ jsx(Text, { pointerEvents: "none", style: { textAlign: "center", textBaseline: "middle", font: resolveSignalValue(style.font) ?? "12px sans-serif", fill: resolveSignalValue(style.fill) ?? "#617783", opacity: opacity(resolveSignalValue(style.opacity) ?? 1, "AxisTitle") }, children: unit ? `${label} (${unit})` : label }) }) });
+}
+export {
+  AxisTitle
+};
+//# sourceMappingURL=axis-title.js.map

package/dist/features/viz/lib/axis-title.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/features/viz/lib/axis-title.tsx"],
+  "sourcesContent": ["import { Group, Text, resolveSignalValue, type SignalValue } from \"@pibbl/core\";\nimport type { SignalStyle } from \"@pibbl/core/internal\";\nimport type { AxisProps, AxisStyle, ScaleId } from \"./types.js\";\nimport { lookupScale } from \"./scale-context.js\";\nimport { opacity } from \"./paint.js\";\n/** Scale-aligned axis text; callers reserve the margin outside the plot. See {@link AxisTitle}. */\nexport interface AxisTitleProps {\n  /** Ancestor scale whose range supplies the title midpoint. */\n  readonly scale: ScaleId;\n  /** Plot edge; left/right titles rotate along the axis. */\n  readonly position: AxisProps[\"position\"];\n  /** Single-line title. */\n  readonly label: SignalValue<string>;\n  /** Optional unit appended in parentheses; empty string omits it. */\n  readonly unit?: SignalValue<string>;\n  /** Nonnegative finite distance outside the plot edge, default 40 pixels. */\n  readonly offset?: SignalValue<number>;\n  /** Font defaults to 12px sans-serif, fill to #617783, opacity to 1. */\n  readonly style?: SignalValue<SignalStyle<Pick<AxisStyle, \"font\" | \"fill\" | \"opacity\">>>;\n}\n/** Paint an axis title with optional units, without allocating margins or changing ticks.\n * @param props - Scale geometry and presentation. See {@link AxisTitleProps}.\n * @returns Decorative chart content in the caller's coordinate space.\n */\nexport function AxisTitle(props: AxisTitleProps) {\n  if (![\"top\", \"bottom\", \"left\", \"right\"].includes(props.position)) throw new TypeError(\"AxisTitle position must be top, bottom, left, or right.\");\n  const source = lookupScale(props.scale, \"AxisTitle\");\n  if (!source) throw new TypeError(\"AxisTitle requires a scale ID.\");\n  const scale = source.get(), label = resolveSignalValue(props.label), unit = resolveSignalValue(props.unit) ?? \"\";\n  if (\n    typeof label !== \"string\" ||\n    /[\\r\\n]/.test(label) ||\n    typeof unit !== \"string\" ||\n    /[\\r\\n]/.test(unit)\n  )\n    throw new TypeError(\"AxisTitle label and unit must be single-line strings.\");\n  const offset = resolveSignalValue(props.offset) ?? 40;\n  if (typeof offset !== \"number\" || !Number.isFinite(offset) || offset < 0) throw new RangeError(\"AxisTitle offset must be finite and nonnegative.\");\n  const horizontal = props.position === \"top\" || props.position === \"bottom\";\n  const midpoint = scale.range[0] / 2 + scale.range[1] / 2;\n  const x = horizontal ? midpoint : props.position === \"left\" ? -offset : scale.frame.width + offset;\n  const y = horizontal ? props.position === \"top\" ? -offset : scale.frame.height + offset : midpoint;\n  const style = resolveSignalValue(props.style) ?? {};\n  return (\n    <Group style={{ translateX: x, translateY: y }}>\n      <Group style={{ rotationDegrees: horizontal ? 0 : props.position === \"left\" ? -90 : 90 }}>\n        <Text pointerEvents=\"none\" style={{ textAlign: \"center\", textBaseline: \"middle\", font: resolveSignalValue(style.font) ?? \"12px sans-serif\", fill: resolveSignalValue(style.fill) ?? \"#617783\", opacity: opacity(resolveSignalValue(style.opacity) ?? 1, \"AxisTitle\") }}>\n          {unit ? `${label} (${unit})` : label}\n        </Text>\n      </Group>\n    </Group>\n  );\n}\n"],
+  "mappings": "AA8CQ;AA9CR,SAAS,OAAO,MAAM,0BAA4C;AAGlE,SAAS,mBAAmB;AAC5B,SAAS,eAAe;AAoBjB,SAAS,UAAU,OAAuB;AAC/C,MAAI,CAAC,CAAC,OAAO,UAAU,QAAQ,OAAO,EAAE,SAAS,MAAM,QAAQ,EAAG,OAAM,IAAI,UAAU,yDAAyD;AAC/I,QAAM,SAAS,YAAY,MAAM,OAAO,WAAW;AACnD,MAAI,CAAC,OAAQ,OAAM,IAAI,UAAU,gCAAgC;AACjE,QAAM,QAAQ,OAAO,IAAI,GAAG,QAAQ,mBAAmB,MAAM,KAAK,GAAG,OAAO,mBAAmB,MAAM,IAAI,KAAK;AAC9G,MACE,OAAO,UAAU,YACjB,SAAS,KAAK,KAAK,KACnB,OAAO,SAAS,YAChB,SAAS,KAAK,IAAI;AAElB,UAAM,IAAI,UAAU,uDAAuD;AAC7E,QAAM,SAAS,mBAAmB,MAAM,MAAM,KAAK;AACnD,MAAI,OAAO,WAAW,YAAY,CAAC,OAAO,SAAS,MAAM,KAAK,SAAS,EAAG,OAAM,IAAI,WAAW,kDAAkD;AACjJ,QAAM,aAAa,MAAM,aAAa,SAAS,MAAM,aAAa;AAClE,QAAM,WAAW,MAAM,MAAM,CAAC,IAAI,IAAI,MAAM,MAAM,CAAC,IAAI;AACvD,QAAM,IAAI,aAAa,WAAW,MAAM,aAAa,SAAS,CAAC,SAAS,MAAM,MAAM,QAAQ;AAC5F,QAAM,IAAI,aAAa,MAAM,aAAa,QAAQ,CAAC,SAAS,MAAM,MAAM,SAAS,SAAS;AAC1F,QAAM,QAAQ,mBAAmB,MAAM,KAAK,KAAK,CAAC;AAClD,SACE,oBAAC,SAAM,OAAO,EAAE,YAAY,GAAG,YAAY,EAAE,GAC3C,8BAAC,SAAM,OAAO,EAAE,iBAAiB,aAAa,IAAI,MAAM,aAAa,SAAS,MAAM,GAAG,GACrF,8BAAC,QAAK,eAAc,QAAO,OAAO,EAAE,WAAW,UAAU,cAAc,UAAU,MAAM,mBAAmB,MAAM,IAAI,KAAK,mBAAmB,MAAM,mBAAmB,MAAM,IAAI,KAAK,WAAW,SAAS,QAAQ,mBAAmB,MAAM,OAAO,KAAK,GAAG,WAAW,EAAE,GAClQ,iBAAO,GAAG,KAAK,KAAK,IAAI,MAAM,OACjC,GACF,GACF;AAEJ;",
+  "names": []
+}

package/dist/features/viz/lib/axis.d.ts

@@ -7,4 +7,4 @@ import type { AxisProps } from "./types.js";
  *
  * @see {@link AxisProps}
  */
-export declare function Axis(props: AxisProps): (import("../../../jsx-runtime.js").JSX.Element[] | import("../../../jsx-runtime.js").JSX.Element)[];
+export declare function Axis(props: AxisProps): ((import("../../../jsx-runtime.js").JSX.Element[] | null)[] | import("../../../jsx-runtime.js").JSX.Element)[];

package/dist/features/viz/lib/axis.js

@@ -1,49 +1,9 @@
 import { jsx } from "@pibbl/core/jsx-runtime";
-import { Path, Text, resolveSignalValue } from "@pibbl/core";
+import { Path, Text, resolveSignalValue, useCanvasContext } from "@pibbl/core";
 import { lookupScale } from "./scale-context.js";
 import { width, opacity } from "./paint.js";
-function ticks(scale, props) {
-  if (props.tickValues !== void 0 && props.tickCount !== void 0)
-    throw new TypeError("Axis tickValues and tickCount are mutually exclusive.");
-  const explicit = props.tickValues === void 0 ? void 0 : resolveSignalValue(props.tickValues);
-  if (explicit !== void 0) {
-    if (!Array.isArray(explicit) || explicit.length > 100)
-      throw new RangeError("Axis tickValues must be an array with at most 100 values.");
-    const seen = /* @__PURE__ */ new Set();
-    for (const value of explicit) {
-      if (seen.has(value)) throw new RangeError("Axis tickValues must not contain duplicates.");
-      seen.add(value);
-      if (scale.type === "linear") {
-        if (typeof value !== "number" || !Number.isFinite(value))
-          throw new TypeError("Axis tickValues for a linear scale must be finite numbers.");
-        const [a, b] = scale.domain;
-        if (value < Math.min(a, b) || value > Math.max(a, b))
-          throw new RangeError("Axis tickValues must be within the scale domain.");
-      } else if (typeof value !== "string" && (typeof value !== "number" || !Number.isFinite(value)) || scale.map(value) === void 0) {
-        throw new RangeError("Axis tickValues must be known band categories.");
-      }
-    }
-    return explicit;
-  }
-  const count = resolveSignalValue(props.tickCount ?? 5);
-  if (!Number.isInteger(count) || count < 0 || count > 100)
-    throw new RangeError("Axis tickCount must be an integer from 0 to 100.");
-  if (count === 0) return [];
-  if (scale.type === "linear")
-    return count === 1 ? [scale.domain[0]] : scale.ticks(count);
-  const n = scale.domain.length;
-  if (n === 0) return [];
-  if (count === 1) return [scale.domain[0]];
-  const m = Math.min(count, n);
-  if (m === 1) return [scale.domain[0]];
-  return Array.from(
-    { length: m },
-    (_, index) => scale.domain[Math.round(index * (n - 1) / (m - 1))]
-  );
-}
-function position(scale, value) {
-  return scale.type === "band" ? scale.map(value) + scale.bandwidth / 2 : scale.map(value);
-}
+import { fitAxisLabel } from "./axis-labels.js";
+import { ticks, position } from "./scale-ticks.js";
 function Axis(props) {
   if (props.position !== "bottom" && props.position !== "left" && props.position !== "top" && props.position !== "right")
     throw new TypeError("Axis position must be bottom, left, top, or right.");
@@ -60,6 +20,48 @@ function Axis(props) {
   const outward = props.position === "bottom" || props.position === "right" ? 1 : -1;
   const baseline = horizontal ? props.position === "bottom" ? scale.frame.height : 0 : props.position === "right" ? scale.frame.width : 0;
   const selected = ticks(scale, props);
+  const context = useCanvasContext();
+  const overlap = resolveSignalValue(props.labelOverlap ?? "allow");
+  const gap = resolveSignalValue(props.labelGap ?? 8);
+  if (overlap !== "allow" && overlap !== "skip") throw new TypeError("Axis labelOverlap must be allow or skip.");
+  if (!Number.isFinite(gap) || gap < 0) throw new RangeError("Axis labelGap must be finite and nonnegative.");
+  const overflow = resolveSignalValue(props.labelOverflow ?? "allow");
+  const maxWidth = props.labelMaxWidth === void 0 ? void 0 : resolveSignalValue(props.labelMaxWidth);
+  const maxLines = resolveSignalValue(props.labelMaxLines ?? 2);
+  const lineHeightInput = props.labelLineHeight === void 0 ? void 0 : resolveSignalValue(props.labelLineHeight);
+  if (!["allow", "wrap", "truncate"].includes(overflow)) throw new TypeError("Axis labelOverflow must be allow, wrap, or truncate.");
+  if (overflow !== "allow" && maxWidth === void 0 || maxWidth !== void 0 && (!Number.isFinite(maxWidth) || maxWidth <= 0)) throw new RangeError("Axis labelMaxWidth must be positive and finite for wrap/truncate.");
+  if (!Number.isInteger(maxLines) || maxLines < 1 || maxLines > 20) throw new RangeError("Axis labelMaxLines must be an integer from 1 to 20.");
+  if (lineHeightInput !== void 0 && (!Number.isFinite(lineHeightInput) || lineHeightInput <= 0)) throw new RangeError("Axis labelLineHeight must be positive and finite.");
+  let lineHeight = 0;
+  const lines = [];
+  const occupied = [];
+  const visible = /* @__PURE__ */ new Set();
+  const texts = selected.map((value, index) => {
+    const label = props.tickFormat ? props.tickFormat(value, index) : scale.type === "utc" || scale.type === "trading-time" ? scale.formatTick(value) : typeof value === "number" ? String(Number(value.toPrecision(6))) : value;
+    if (typeof label !== "string") throw new TypeError("Axis tickFormat must return a string.");
+    return label;
+  });
+  const order = selected.map((value, index) => ({ index, p: position(scale, value) })).sort((a, b) => a.p - b.p);
+  const priority = order.length > 1 ? [order[0], order[order.length - 1], ...order.slice(1, -1)] : order;
+  context.save();
+  try {
+    context.font = font;
+    const fontMetrics = context.measureText("Mg");
+    lineHeight = lineHeightInput ?? Math.ceil(fontMetrics.actualBoundingBoxAscent + fontMetrics.actualBoundingBoxDescent + 4);
+    for (const text of texts) lines.push(fitAxisLabel(context, text, maxWidth ?? Infinity, overflow, maxLines));
+    for (const { index, p } of priority) {
+      const metrics = lines[index].map((text) => context.measureText(text));
+      const size = horizontal ? Math.max(...metrics.map((m) => m.width)) : (lines[index].length - 1) * lineHeight + Math.max(...metrics.map((m) => m.actualBoundingBoxAscent + m.actualBoundingBoxDescent));
+      const interval = { start: p - size / 2, end: p + size / 2 };
+      if (overlap === "allow" || occupied.every((other) => interval.end + gap <= other.start || interval.start >= other.end + gap)) {
+        visible.add(index);
+        occupied.push(interval);
+      }
+    }
+  } finally {
+    context.restore();
+  }
   const path = new Path2D();
   if (horizontal) {
     path.moveTo(scale.range[0], baseline);
@@ -77,16 +79,14 @@ function Axis(props) {
       path.moveTo(baseline, p);
       path.lineTo(baseline + outward * 6, p);
     }
-    const label = props.tickFormat ? props.tickFormat(value, index) : typeof value === "number" ? String(Number(value.toPrecision(6))) : value;
-    if (typeof label !== "string")
-      throw new TypeError("Axis tickFormat must return a string.");
-    return /* @__PURE__ */ jsx(
+    if (!visible.has(index)) return null;
+    return lines[index].map((label, lineIndex) => /* @__PURE__ */ jsx(
       Text,
       {
         pointerEvents: "none",
         style: {
           left: horizontal ? p : baseline + outward * 10,
-          top: horizontal ? baseline + outward * 10 : p,
+          top: horizontal ? baseline + outward * 10 + (outward > 0 ? lineIndex : lineIndex - lines[index].length + 1) * lineHeight : p + (lineIndex - (lines[index].length - 1) / 2) * lineHeight,
           fill,
           font,
           opacity: alpha,
@@ -95,8 +95,8 @@ function Axis(props) {
         },
         children: label
       },
-      index
-    );
+      `${index}:${lineIndex}`
+    ));
   });
   return [
     /* @__PURE__ */ jsx(