niceeval 0.12.2-canary.31 → 0.13.0

package/dist/report/definition/primitives/chart.cjs

@@ -0,0 +1,651 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Chart = exports.Series = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const series_encoding_tsx_1 = require("../../assets/series-encoding.cjs");
+const tree_ts_1 = require("../tree.cjs");
+const locale_ts_1 = require("../../model/locale.cjs");
+const format_ts_1 = require("../../model/format.cjs");
+const math_ts_1 = require("../../model/chart/math.cjs");
+const plot_ts_1 = require("../../model/chart/plot.cjs");
+const text_layout_ts_1 = require("../../model/text-layout.cjs");
+const shared_ts_1 = require("./shared.cjs");
+const dataset_ts_1 = require("../../model/dataset.cjs");
+const chart_map_ts_1 = require("./chart-map.cjs");
+const WIDTH = 760;
+const HEIGHT = 400;
+const MARGIN = { top: 28, right: 32, bottom: 48, left: 64 };
+const PLOT_W = WIDTH - MARGIN.left - MARGIN.right;
+const PLOT_H = HEIGHT - MARGIN.top - MARGIN.bottom;
+const IMPLICIT_SERIES_HANDLE = "__chartSeries";
+function cx(...parts) {
+    return parts.filter(Boolean).join(" ");
+}
+/** `pointTarget` 缺省时的目标:`targetOfRefs`,把 refs[0] 式的错误收窄成结构化的唯一规则。 */
+function resolvePointTarget(point, pointTarget) {
+    return pointTarget ? pointTarget(point) : (0, shared_ts_1.targetOfRefs)(point.refs);
+}
+function pointHref(point, ctx, pointTarget) {
+    const target = resolvePointTarget({ refs: point.refs, key: point.key }, pointTarget);
+    return target === undefined ? undefined : ctx.href(target);
+}
+function assertDataset(data) {
+    if (!(0, dataset_ts_1.isDataset)(data)) {
+        throw (0, shared_ts_1.dataShapeError)("Chart", "data", "Dataset", '"data" must be a Dataset { fields, rows }');
+    }
+    return data;
+}
+function seriesNodesOf(children) {
+    if (children === null || children === undefined || typeof children === "boolean")
+        return [];
+    const out = [];
+    const visit = (node) => {
+        if (node === null || node === undefined || typeof node === "boolean")
+            return;
+        if (Array.isArray(node)) {
+            for (const child of node)
+                visit(child);
+            return;
+        }
+        if (typeof node === "object" && node !== null && "type" in node && "props" in node) {
+            const el = node;
+            if (el.type === exports.Series)
+                out.push(el.props);
+        }
+    };
+    visit(children);
+    return out;
+}
+function validateChart(dataset, specs, x, y) {
+    if (specs.length === 0) {
+        throw new Error("Chart needs at least one <Series> child declaring mark and id.");
+    }
+    const ids = new Set();
+    for (const spec of specs) {
+        if (!spec.id || typeof spec.id !== "string") {
+            throw new Error('Each <Series> needs a non-empty string "id".');
+        }
+        if (ids.has(spec.id)) {
+            throw new Error(`Chart contains duplicate <Series id=${JSON.stringify(spec.id)}>.`);
+        }
+        ids.add(spec.id);
+    }
+    (0, chart_map_ts_1.resolveChartAxes)(dataset, x, y);
+}
+function lineDash(style) {
+    if (style === "dashed")
+        return "6 4";
+    if (style === "dotted")
+        return "2 3";
+    return undefined;
+}
+function seriesMarkChar(mark, index) {
+    if (mark === "scatter" || mark === "line")
+        return String.fromCharCode(65 + (index % 26));
+    return "█";
+}
+function chartFieldLabel(field, meta, locale) {
+    const dictionary = {
+        costUSD: "experimentList.cost",
+        passRate: "scopeSummary.passRate",
+        totalScore: "scopeSummary.totalScore",
+        durationMs: "experimentList.avgDuration",
+        tokens: "experimentList.tokens",
+    };
+    const base = dictionary[field] ? (0, locale_ts_1.localeText)(locale, dictionary[field]) : field;
+    return meta.unit ? `${base}(${meta.unit})` : base;
+}
+/** 解析点所属 series 句柄与下标;单系列隐式图不声明视觉身份。 */
+function dimensionAt(ctx, handle, index) {
+    // 语义适配:当前 tree.ts 的 WebContext.dimension 返回 unknown(呈现分配由 renderer 层
+    // 接通);这里只做防御性结构收窄,拿不到 PresentedDimension 时回退无视觉身份。
+    const value = ctx.dimension(handle);
+    if (value === undefined || value === null || typeof value !== "object")
+        return undefined;
+    const at = value.at;
+    if (typeof at !== "function")
+        return undefined;
+    return at.call(value, index);
+}
+function seriesPresentationOf(mapped, series, point, ctx) {
+    let handle;
+    let index;
+    if (series.byField !== undefined && point.seriesValue !== undefined) {
+        handle = series.byField;
+        index = (0, chart_map_ts_1.seriesDimensionValues)(mapped, series.byField).indexOf(point.seriesValue);
+    }
+    else {
+        const ids = mapped.filter((item) => !item.hidden && item.byField === undefined).map((item) => item.id);
+        if (ids.length < 2)
+            return undefined;
+        handle = IMPLICIT_SERIES_HANDLE;
+        index = ids.indexOf(series.id);
+    }
+    if (index < 0)
+        return undefined;
+    return dimensionAt(ctx, handle, index);
+}
+/** SVG 路径:只挂 series-cN 设 --series;pattern 由 fill 属性 / style 承载。 */
+function seriesColorClass(presentation) {
+    if (!presentation)
+        return "niceeval-series-none";
+    if (presentation.kind === "color")
+        return (0, series_encoding_tsx_1.seriesClassFromColorVar)(presentation.color);
+    if (presentation.kind !== "series")
+        return "niceeval-series-none";
+    // switch 按 mark 收窄;Fill 的 mark 是 "bar"|"area" 联合,if/|| 在部分 TS 版本下剔不干净。
+    switch (presentation.mark) {
+        case "bar":
+        case "area": {
+            // 只要色类,不要 HTML 专用的 fill-vN(SVG 用 url(#pattern))。
+            const classes = (0, series_encoding_tsx_1.seriesClassesFromFill)(presentation.fill).split(" ");
+            return classes.find((c) => c.startsWith("niceeval-series-c") || c === "niceeval-series-none") ?? "niceeval-series-none";
+        }
+        case "line":
+            return (0, series_encoding_tsx_1.seriesClassFromColorVar)(presentation.stroke);
+        case "scatter":
+            return (0, series_encoding_tsx_1.seriesClassFromColorVar)(presentation.marker.fill);
+    }
+}
+/** HTML 横向柱:色类 + fill-vN 图案类(CSS repeating-linear-gradient 等效 SVG pattern)。 */
+function seriesHtmlBarClass(presentation) {
+    if (!presentation)
+        return "niceeval-series-none";
+    if (presentation.kind === "series" && (presentation.mark === "bar" || presentation.mark === "area")) {
+        return (0, series_encoding_tsx_1.seriesClassesFromFill)(presentation.fill);
+    }
+    return seriesColorClass(presentation);
+}
+/**
+ * 作者在 `<Series line>` 上显式声明的 dashed/dotted **优先于** 页级 variant 的 strokeDasharray。
+ * 未声明时消费 LineSeriesPresentation / FillSeriesPresentation 的 strokeDasharray(空串 = 实线)。
+ */
+function resolveStrokeDasharray(series, presentation) {
+    if (series.line !== undefined)
+        return lineDash(series.line);
+    if (presentation?.kind === "series" && "strokeDasharray" in presentation) {
+        return presentation.strokeDasharray || undefined;
+    }
+    return undefined;
+}
+/** SVG 柱/面:pattern fill 必须用 style 压过 `.niceeval-chart-bar { fill: var(--series) }`。 */
+function seriesSvgFillStyle(presentation) {
+    if (presentation?.kind !== "series")
+        return undefined;
+    if (presentation.mark !== "bar" && presentation.mark !== "area")
+        return undefined;
+    if (!presentation.fill.startsWith("url("))
+        return undefined;
+    return { fill: presentation.fill };
+}
+function renderMarkerShape(presentation, px, py, colorClass, title) {
+    const marker = presentation?.kind === "series" && (presentation.mark === "scatter" || presentation.mark === "line")
+        ? presentation.marker
+        : undefined;
+    if (!marker) {
+        return ((0, jsx_runtime_1.jsx)("circle", { className: cx("niceeval-chart-dot", colorClass), cx: px, cy: py, r: 4.5, children: title }));
+    }
+    // path 在 0..12 viewBox;缩放到 ~9px 并居中到 (px, py)。
+    return ((0, jsx_runtime_1.jsx)("path", { className: cx("niceeval-chart-dot", colorClass), d: marker.path, transform: `translate(${px} ${py}) scale(0.75) translate(-6 -6)`, fill: marker.fill, stroke: "var(--panel)", strokeWidth: 1.6, children: title }));
+}
+function legendSwatch(presentation, mark) {
+    if (!presentation || presentation.kind !== "series") {
+        return (0, jsx_runtime_1.jsx)("span", { className: cx("niceeval-chart-legend-swatch", "niceeval-series-none") });
+    }
+    // 图例方块跟 series mark 取义:柱/面用填充图案,线用 dash+marker,散点用 marker 形状。
+    if (mark === "bar" || mark === "area") {
+        const fillClass = presentation.mark === "bar" || presentation.mark === "area"
+            ? (0, series_encoding_tsx_1.seriesClassesFromFill)(presentation.fill)
+            : seriesColorClass(presentation);
+        return (0, jsx_runtime_1.jsx)("span", { className: cx("niceeval-chart-legend-swatch", fillClass) });
+    }
+    if (mark === "line") {
+        // 线系图例需要 stroke + marker;presentation 可能是 line 或 scatter(by 切分后 mark 对齐)。
+        if (presentation.mark === "line") {
+            return ((0, jsx_runtime_1.jsxs)("svg", { className: "niceeval-chart-legend-swatch-svg", width: "16", height: "10", "aria-hidden": "true", children: [(0, jsx_runtime_1.jsx)("line", { x1: "0", y1: "5", x2: "16", y2: "5", stroke: presentation.stroke, strokeWidth: 2, strokeDasharray: presentation.strokeDasharray || undefined }), (0, jsx_runtime_1.jsx)("path", { d: presentation.marker.path, transform: "translate(8 5) scale(0.55) translate(-6 -6)", fill: presentation.marker.fill })] }));
+        }
+        if (presentation.mark === "scatter") {
+            return ((0, jsx_runtime_1.jsxs)("svg", { className: "niceeval-chart-legend-swatch-svg", width: "16", height: "10", "aria-hidden": "true", children: [(0, jsx_runtime_1.jsx)("line", { x1: "0", y1: "5", x2: "16", y2: "5", stroke: presentation.marker.fill, strokeWidth: 2 }), (0, jsx_runtime_1.jsx)("path", { d: presentation.marker.path, transform: "translate(8 5) scale(0.55) translate(-6 -6)", fill: presentation.marker.fill })] }));
+        }
+        // fill presentation 配 line mark 的退化:只画色块。
+        return (0, jsx_runtime_1.jsx)("span", { className: cx("niceeval-chart-legend-swatch", seriesColorClass(presentation)) });
+    }
+    // mark === "scatter"
+    if (presentation.mark === "scatter" || presentation.mark === "line") {
+        return ((0, jsx_runtime_1.jsx)("svg", { className: "niceeval-chart-legend-swatch-svg", width: "10", height: "10", "aria-hidden": "true", children: (0, jsx_runtime_1.jsx)("path", { d: presentation.marker.path, transform: "translate(5 5) scale(0.7) translate(-6 -6)", fill: presentation.marker.fill }) }));
+    }
+    return (0, jsx_runtime_1.jsx)("span", { className: cx("niceeval-chart-legend-swatch", seriesColorClass(presentation)) });
+}
+function metricDisplay(point, axis, meta, locale) {
+    if (meta.kind === "dimension") {
+        return axis === "x" ? (point.xLabel ?? point.pointLabel) : (point.yLabel ?? point.pointLabel);
+    }
+    const value = point[axis];
+    const cell = axis === "x" ? point.xCell : point.yCell;
+    return (0, format_ts_1.formatMetricScalar)(value, meta.unit, cell?.format, locale);
+}
+function renderLegend(mapped, visible, locale, ctx) {
+    return ((0, jsx_runtime_1.jsx)("ul", { className: "niceeval-chart-legend", children: visible.flatMap((series) => {
+            const byValues = series.byField ? (0, chart_map_ts_1.seriesDimensionValues)(mapped, series.byField) : [series.id];
+            return byValues.map((value) => {
+                const implicitIds = visible
+                    .filter((item) => item.byField === undefined)
+                    .map((item) => item.id);
+                const handle = series.byField ?? (implicitIds.length > 1 ? IMPLICIT_SERIES_HANDLE : undefined);
+                const index = series.byField
+                    ? (0, chart_map_ts_1.seriesDimensionValues)(mapped, series.byField).indexOf(value)
+                    : implicitIds.indexOf(series.id);
+                const presentation = handle ? dimensionAt(ctx, handle, index) : undefined;
+                const label = presentation?.label ?? (series.label ? (0, locale_ts_1.resolveLocalizedText)(series.label, locale) : series.id);
+                return ((0, jsx_runtime_1.jsxs)("li", { className: "niceeval-chart-legend-item", children: [legendSwatch(presentation, series.mark), label] }, `${series.id}:${value}`));
+            });
+        }) }));
+}
+function renderMissingNote(missing, locale) {
+    if (missing === undefined || missing === 0)
+        return null;
+    return ((0, jsx_runtime_1.jsx)("p", { className: "niceeval-chart-missing", title: String(missing), children: (0, locale_ts_1.countText)(locale, "pointsMissing", missing) }));
+}
+function renderHorizontalBarsWeb(mapped, visible, axes, locale, ctx, options) {
+    const entries = visible.flatMap((series) => series.points.map((point) => ({ series, point })));
+    const labels = (0, format_ts_1.shortestUniqueLabels)(entries.map(({ point }) => point.xLabel ?? point.pointLabel));
+    const values = entries.map(({ point }) => point.y);
+    const boundMax = axes.yMeta.kind === "metric" ? axes.yMeta.bounds?.max : undefined;
+    const max = boundMax !== undefined && boundMax > 0 ? boundMax : Math.max(0, ...values);
+    return ((0, jsx_runtime_1.jsxs)("figure", { className: cx("niceeval-report", "niceeval-chart", "niceeval-chart--bars-horizontal", options.className), children: [(0, jsx_runtime_1.jsx)(series_encoding_tsx_1.SeriesPatternDefs, {}), (0, jsx_runtime_1.jsx)("div", { className: "niceeval-chart-bars-heading", children: chartFieldLabel(axes.yField, axes.yMeta, locale) }), (0, jsx_runtime_1.jsx)("ol", { className: "niceeval-chart-bars", children: entries.map(({ series, point }) => {
+                    const rawLabel = point.xLabel ?? point.pointLabel;
+                    const label = labels.get(rawLabel) ?? rawLabel;
+                    const display = metricDisplay(point, "y", axes.yMeta, locale);
+                    const href = pointHref(point, ctx, options.pointTarget);
+                    const presentation = seriesPresentationOf(mapped, series, point, ctx);
+                    const colorClass = seriesHtmlBarClass(presentation);
+                    const ratio = max > 0 ? Math.max(0, Math.min(1, point.y / max)) : 0;
+                    const value = ((0, jsx_runtime_1.jsxs)("span", { className: "niceeval-chart-bar-value", children: [display, point.yCell && point.yCell.samples < point.yCell.total ? ((0, jsx_runtime_1.jsxs)("sup", { children: [point.yCell.samples, "/", point.yCell.total] })) : null] }));
+                    return ((0, jsx_runtime_1.jsxs)("li", { className: "niceeval-chart-bar-row", children: [(0, jsx_runtime_1.jsx)("span", { className: "niceeval-chart-bar-label", title: rawLabel, children: label }), (0, jsx_runtime_1.jsx)("span", { className: "niceeval-chart-bar-track", children: (0, jsx_runtime_1.jsx)("span", { className: cx("niceeval-chart-bar-fill", colorClass), style: { width: `${ratio * 100}%` }, title: `${rawLabel}\n${axes.yField}: ${display}` }) }), href ? (0, jsx_runtime_1.jsx)("a", { className: "niceeval-locator", href: href, children: value }) : value] }, `${series.id}:${point.key}`));
+                }) }), options.legend ? renderLegend(mapped, visible, locale, ctx) : null, renderMissingNote(options.missing, locale)] }));
+}
+function stackedBarBase(visible, target, x) {
+    if (target.stack === undefined)
+        return 0;
+    let total = 0;
+    for (const series of visible) {
+        if (series === target)
+            break;
+        if (series.mark !== "bar" || series.stack !== target.stack)
+            continue;
+        const point = series.points.find((item) => item.x === x);
+        if (point)
+            total += point.y;
+    }
+    return total;
+}
+function chartYValues(visible) {
+    const values = [];
+    const stacks = new Map();
+    for (const series of visible) {
+        for (const point of series.points) {
+            if (series.mark === "bar" && series.stack !== undefined) {
+                const key = `${series.stack}\0${point.x}`;
+                stacks.set(key, (stacks.get(key) ?? 0) + point.y);
+            }
+            else {
+                values.push(point.y);
+            }
+        }
+    }
+    values.push(...stacks.values());
+    return values;
+}
+function renderChartWeb(mapped, axes, locale, ctx, options) {
+    const visible = mapped.filter((s) => !s.hidden);
+    const allPoints = visible.flatMap((s) => s.points);
+    if (allPoints.length === 0) {
+        return ((0, jsx_runtime_1.jsxs)("figure", { className: cx("niceeval-report", "niceeval-chart", "niceeval-chart--scatter", options.className), children: [(0, jsx_runtime_1.jsx)("p", { className: "niceeval-chart-empty niceeval-missing", children: (0, locale_ts_1.localeText)(locale, "cell.missing") }), renderMissingNote(options.missing, locale)] }));
+    }
+    if (options.layout === "horizontal" && visible.every((series) => series.mark === "bar")) {
+        return renderHorizontalBarsWeb(mapped, visible, axes, locale, ctx, options);
+    }
+    const xBounds = axes.xMeta.kind === "metric" ? axes.xMeta.bounds : undefined;
+    const yBounds = axes.yMeta.kind === "metric" ? axes.yMeta.bounds : undefined;
+    const hasVerticalFill = visible.some((series) => series.mark === "bar" || series.mark === "area");
+    const yValues = [...chartYValues(visible), ...(hasVerticalFill ? [0] : [])];
+    const xScale = (0, math_ts_1.axisScale)(allPoints.map((p) => p.x), xBounds, MARGIN.left, MARGIN.left + PLOT_W, axes.xMeta.better === "lower");
+    const yScale = (0, math_ts_1.axisScale)(yValues, yBounds, MARGIN.top + PLOT_H, MARGIN.top, axes.yMeta.better === "lower");
+    const labelByKey = (0, format_ts_1.shortestUniqueLabels)(allPoints.map((p) => p.pointLabel));
+    const xLabel = chartFieldLabel(axes.xField, axes.xMeta, locale);
+    const yLabel = chartFieldLabel(axes.yField, axes.yMeta, locale);
+    const drawable = visible.flatMap((series) => series.points.map((point) => {
+        const presentation = seriesPresentationOf(mapped, series, point, ctx);
+        return {
+            ...point,
+            sourceSeriesId: series.id,
+            label: labelByKey.get(point.pointLabel) ?? point.pointLabel,
+            px: xScale.scale(point.x),
+            py: yScale.scale(point.y),
+            presentation,
+            seriesClass: seriesColorClass(presentation),
+        };
+    }));
+    const labels = (0, math_ts_1.placePointLabels)(drawable.map((p) => ({ cx: p.px, cy: p.py, width: p.label.length * 6.4 + 10 })), { x0: 2, y0: 2, x1: WIDTH - 2, y1: HEIGHT - 2 });
+    return ((0, jsx_runtime_1.jsxs)("figure", { className: cx("niceeval-report", "niceeval-chart", "niceeval-chart--scatter", options.className), children: [(0, jsx_runtime_1.jsx)(series_encoding_tsx_1.SeriesPatternDefs, {}), (0, jsx_runtime_1.jsxs)("svg", { className: "niceeval-chart-svg", viewBox: `0 0 ${WIDTH} ${HEIGHT}`, role: "img", "aria-label": `${axes.xField} × ${axes.yField}`, children: [options.grid !== false ? ((0, jsx_runtime_1.jsxs)("g", { className: "niceeval-chart-grid", children: [yScale.ticks.map((tick) => ((0, jsx_runtime_1.jsx)("line", { x1: MARGIN.left, x2: MARGIN.left + PLOT_W, y1: yScale.scale(tick), y2: yScale.scale(tick) }, `gy${tick}`))), xScale.ticks.map((tick) => ((0, jsx_runtime_1.jsx)("line", { y1: MARGIN.top, y2: MARGIN.top + PLOT_H, x1: xScale.scale(tick), x2: xScale.scale(tick) }, `gx${tick}`)))] })) : null, (0, jsx_runtime_1.jsx)("g", { className: "niceeval-chart-axis niceeval-chart-axis-y", children: (axes.yMeta.kind === "dimension"
+                            ? [...new Set(drawable.map((point) => point.y))]
+                            : yScale.ticks).map((tick) => ((0, jsx_runtime_1.jsx)("text", { className: "niceeval-chart-tick", x: MARGIN.left - 8, y: yScale.scale(tick) + 3, textAnchor: "end", children: axes.yMeta.kind === "dimension"
+                                ? drawable.find((point) => point.y === tick)?.yLabel
+                                : (0, format_ts_1.formatAxisTick)(tick, (0, math_ts_1.tickStepOf)(yScale.ticks), axes.yMeta.unit) }, `ay${tick}`))) }), (0, jsx_runtime_1.jsx)("g", { className: "niceeval-chart-axis niceeval-chart-axis-x", children: (axes.xMeta.kind === "dimension"
+                            ? [...new Set(drawable.map((point) => point.x))]
+                            : xScale.ticks).map((tick) => ((0, jsx_runtime_1.jsx)("text", { className: "niceeval-chart-tick", x: xScale.scale(tick), y: MARGIN.top + PLOT_H + 16, textAnchor: "middle", children: axes.xMeta.kind === "dimension"
+                                ? drawable.find((point) => point.x === tick)?.xLabel
+                                : (0, format_ts_1.formatAxisTick)(tick, (0, math_ts_1.tickStepOf)(xScale.ticks), axes.xMeta.unit) }, `ax${tick}`))) }), axes.xMeta.better !== undefined && axes.yMeta.better !== undefined ? ((0, jsx_runtime_1.jsx)("text", { className: "niceeval-chart-better-hint", x: MARGIN.left + PLOT_W - 6, y: MARGIN.top + 14, textAnchor: "end", children: (0, locale_ts_1.localeText)(locale, "scatter.betterUpperRight") })) : null, (0, jsx_runtime_1.jsx)("text", { className: "niceeval-chart-xlabel", x: MARGIN.left + PLOT_W / 2, y: HEIGHT - 8, textAnchor: "middle", children: xLabel }), (0, jsx_runtime_1.jsx)("text", { className: "niceeval-chart-ylabel", x: 14, y: MARGIN.top + PLOT_H / 2, textAnchor: "middle", transform: `rotate(-90 14 ${MARGIN.top + PLOT_H / 2})`, children: yLabel }), visible.flatMap((series) => {
+                        const values = series.byField ? (0, chart_map_ts_1.seriesDimensionValues)(mapped, series.byField) : [series.id];
+                        return values.map((value) => {
+                            const seriesPoints = drawable.filter((p) => p.sourceSeriesId === series.id &&
+                                (series.byField === undefined || p.seriesValue === value));
+                            const ordered = series.connect ? [...seriesPoints].sort((a, b) => a.x - b.x) : seriesPoints;
+                            const seriesClassName = ordered[0]?.seriesClass ?? "niceeval-series-none";
+                            const seriesPresentation = ordered[0]?.presentation;
+                            const baseline = yScale.scale(0);
+                            const barGroups = [...new Set(visible
+                                    .filter((item) => item.mark === "bar")
+                                    .map((item) => item.stack ?? `series:${item.id}`))];
+                            const barGroup = series.stack ?? `series:${series.id}`;
+                            const groupIndex = Math.max(0, barGroups.indexOf(barGroup));
+                            const totalBarWidth = Math.max(8, Math.min(48, PLOT_W / Math.max(1, allPoints.length)));
+                            const barWidth = totalBarWidth / Math.max(1, barGroups.length);
+                            const dash = resolveStrokeDasharray(series, seriesPresentation);
+                            const areaFillStyle = seriesSvgFillStyle(seriesPresentation);
+                            return ((0, jsx_runtime_1.jsxs)("g", { className: cx("niceeval-chart-series", seriesClassName), "data-series": `${series.id}:${value}`, children: [series.mark === "area" && ordered.length > 1 ? ((0, jsx_runtime_1.jsx)("polygon", { className: "niceeval-chart-area", style: areaFillStyle, points: [
+                                            `${ordered[0].px},${baseline}`,
+                                            ...ordered.map((point) => `${point.px},${point.py}`),
+                                            `${ordered[ordered.length - 1].px},${baseline}`,
+                                        ].join(" ") })) : null, (series.mark === "line" || series.mark === "area" || series.connect) && ordered.length > 1 ? ((0, jsx_runtime_1.jsx)("polyline", { className: "niceeval-chart-line", points: ordered.map((p) => `${p.px},${p.py}`).join(" "), strokeDasharray: dash })) : null, ordered.map((p) => {
+                                        const placed = labels[drawable.indexOf(p)];
+                                        const href = pointHref(p, ctx, options.pointTarget);
+                                        let shape;
+                                        if (series.mark === "bar") {
+                                            const baseValue = stackedBarBase(visible, series, p.x);
+                                            const baseY = yScale.scale(baseValue);
+                                            const topY = yScale.scale(baseValue + p.y);
+                                            shape = ((0, jsx_runtime_1.jsx)("rect", { className: cx("niceeval-chart-bar", p.seriesClass), style: seriesSvgFillStyle(p.presentation), x: p.px - totalBarWidth / 2 + groupIndex * barWidth, y: Math.min(topY, baseY), width: barWidth, height: Math.max(1, Math.abs(baseY - topY)), children: (0, jsx_runtime_1.jsx)("title", { children: `${p.pointLabel}\n${series.id}: ${metricDisplay(p, "y", axes.yMeta, locale)}` }) }));
+                                        }
+                                        else {
+                                            shape = renderMarkerShape(p.presentation, p.px, p.py, p.seriesClass, (0, jsx_runtime_1.jsx)("title", { children: `${p.pointLabel}\n${axes.xField}: ${metricDisplay(p, "x", axes.xMeta, locale)}\n${axes.yField}: ${metricDisplay(p, "y", axes.yMeta, locale)}` }));
+                                        }
+                                        return ((0, jsx_runtime_1.jsxs)("g", { className: "niceeval-chart-point", children: [href ? (0, jsx_runtime_1.jsx)("a", { href: href, children: shape }) : shape, series.mark === "scatter" && placed ? ((0, jsx_runtime_1.jsx)("text", { className: "niceeval-chart-point-label", x: placed.x, y: placed.y, textAnchor: placed.anchor, children: p.label })) : null] }, p.key));
+                                    })] }, `${series.id}:${value}`));
+                        });
+                    })] }), options.legend ? renderLegend(mapped, visible, locale, ctx) : null, renderMissingNote(options.missing, locale)] }));
+}
+function renderBarsText(visible, axes, locale, ctx) {
+    const entries = [];
+    const stacked = new Map();
+    for (const series of visible) {
+        for (const point of series.points) {
+            const rawLabel = point.xLabel ?? point.pointLabel;
+            const display = metricDisplay(point, "y", axes.yMeta, locale);
+            if (series.stack !== undefined) {
+                const key = `${series.stack}\0${point.x}`;
+                let entry = stacked.get(key);
+                if (!entry) {
+                    entry = { rawLabel, value: 0, parts: [] };
+                    stacked.set(key, entry);
+                }
+                entry.value += point.y;
+                entry.parts.push(`${series.id}=${display}`);
+            }
+            else {
+                entries.push({
+                    rawLabel,
+                    value: point.y,
+                    display: point.yCell && point.yCell.samples < point.yCell.total
+                        ? `${display} ${point.yCell.samples}/${point.yCell.total}`
+                        : display,
+                });
+            }
+        }
+    }
+    entries.push(...[...stacked.values()].map((entry) => ({
+        rawLabel: entry.rawLabel,
+        value: entry.value,
+        display: entry.parts.join(" · "),
+    })));
+    const rawLabels = entries.map((entry) => entry.rawLabel);
+    const labels = (0, format_ts_1.shortestUniqueLabels)(rawLabels);
+    const displays = entries.map((entry) => entry.display);
+    const labelWidth = Math.max(0, ...rawLabels.map((label) => (0, text_layout_ts_1.stringWidth)(labels.get(label) ?? label)));
+    const valueWidth = Math.max(0, ...displays.map(text_layout_ts_1.stringWidth));
+    const barWidth = Math.max(8, Math.min(24, ctx.width - labelWidth - valueWidth - 4));
+    const boundMax = axes.yMeta.kind === "metric" ? axes.yMeta.bounds?.max : undefined;
+    const max = boundMax !== undefined && boundMax > 0
+        ? boundMax
+        : Math.max(0, ...entries.map((entry) => entry.value));
+    const heading = chartFieldLabel(axes.yField, axes.yMeta, locale);
+    return [
+        `${(0, text_layout_ts_1.padDisplay)("", labelWidth)}  ${(0, text_layout_ts_1.padDisplay)(heading, barWidth)}  ${(0, text_layout_ts_1.padStartDisplay)("", valueWidth)}`,
+        ...entries.map((entry, index) => {
+            const rawLabel = rawLabels[index];
+            const label = labels.get(rawLabel) ?? rawLabel;
+            const ratio = max > 0 ? Math.max(0, Math.min(1, entry.value / max)) : 0;
+            return `${(0, text_layout_ts_1.padDisplay)(label, labelWidth)}  ${(0, text_layout_ts_1.textBar)(ratio, barWidth)}  ${(0, text_layout_ts_1.padStartDisplay)(displays[index], valueWidth)}`;
+        }),
+    ].join("\n");
+}
+function chartText(dataset, props, ctx) {
+    const locale = props.locale ?? ctx.locale;
+    const specs = seriesNodesOf(props.children);
+    validateChart(dataset, specs, props.x, props.y);
+    const axes = (0, chart_map_ts_1.resolveChartAxes)(dataset, props.x, props.y);
+    const { series, missing } = (0, chart_map_ts_1.mapChartSeries)(dataset, axes, specs, props.series);
+    const visible = series.filter((s) => !s.hidden);
+    const points = visible.flatMap((s) => s.points);
+    if (points.length === 0) {
+        return (0, locale_ts_1.localeText)(locale, "cell.missing");
+    }
+    if (visible.every((item) => item.mark === "bar")) {
+        const bars = renderBarsText(visible, axes, locale, ctx);
+        const missingNote = missing > 0 ? `\n${(0, locale_ts_1.countText)(locale, "pointsMissing", missing)}` : "";
+        return `${bars}${missingNote}`;
+    }
+    const xBounds = axes.xMeta.kind === "metric" ? axes.xMeta.bounds : undefined;
+    const yBounds = axes.yMeta.kind === "metric" ? axes.yMeta.bounds : undefined;
+    const xDomain = (0, math_ts_1.paddedAxisDomain)(points.map((p) => p.x), xBounds);
+    const yDomain = (0, math_ts_1.paddedAxisDomain)(points.map((p) => p.y), yBounds);
+    // 标记字母按图例顺序逐点分配:series 按显示键字典序,series 内按 x 原始值升序
+    // (docs/feature/reports/cli.md)。按 series 下标分配会让一个 series 的
+    // 全部点共用一个字母,图上读不出哪个点是哪一行。
+    const groups = legendGroups(visible);
+    const marks = new Map();
+    let letter = 0;
+    for (const group of groups) {
+        for (const point of group.points) {
+            marks.set(point.key, group.mark === "bar" ? "█" : String.fromCharCode(65 + (letter % 26)));
+            if (group.mark !== "bar")
+                letter++;
+        }
+    }
+    const lines = visible
+        .filter((s) => s.connect && (s.mark === "line" || s.mark === "scatter" || s.mark === "area"))
+        .map((s) => [...s.points].sort((a, b) => a.x - b.x).map((p) => ({ x: p.x, y: p.y })));
+    const plot = (0, plot_ts_1.renderCharPlot)({
+        width: Math.min(ctx.width, 72),
+        height: 9,
+        points: points.map((p) => ({ mark: marks.get(p.key) ?? "•", x: p.x, y: p.y })),
+        xDomain,
+        yDomain,
+        lines,
+        xLabel: axes.xField,
+        yLabel: axes.yField,
+        // 刻度精度跟随整齐步长,与 web 面同一支:传值域跨度会让 $0.35045992 这种原始值直接
+        // 印到轴上(步长的小数位数才是精度)。
+        formatX: (v) => axes.xMeta.kind === "dimension"
+            ? (points.find((point) => point.x === Math.round(v))?.xLabel ?? "")
+            : (0, format_ts_1.formatAxisTick)(v, (0, math_ts_1.tickStepOf)((0, math_ts_1.ticksInDomain)(xDomain[0], xDomain[1], 5)), axes.xMeta.unit),
+        formatY: (v) => axes.yMeta.kind === "dimension"
+            ? (points.find((point) => point.y === Math.round(v))?.yLabel ?? "")
+            : (0, format_ts_1.formatAxisTick)(v, (0, math_ts_1.tickStepOf)((0, math_ts_1.ticksInDomain)(yDomain[0], yDomain[1], 5)), axes.yMeta.unit),
+        invertX: axes.xMeta.better === "lower",
+        invertY: axes.yMeta.better === "lower",
+    });
+    const values = renderScatterValuesText(groups, marks, axes, locale);
+    const missingNote = missing > 0 ? `\n${(0, locale_ts_1.countText)(locale, "pointsMissing", missing)}` : "";
+    return `${plot}\n\n${values}${missingNote}`;
+}
+/** 显示键字典序,组内按 x 原始值升序——图例顺序即标记字母顺序,两处不各自排序。 */
+function legendGroups(visible) {
+    const byKey = new Map();
+    for (const series of visible) {
+        for (const point of series.points) {
+            const key = point.seriesValue ?? series.id;
+            let group = byKey.get(key);
+            if (group === undefined) {
+                group = { key, mark: series.mark, connect: series.connect === true, points: [] };
+                byKey.set(key, group);
+            }
+            group.points.push(point);
+        }
+    }
+    const groups = [...byKey.values()];
+    groups.sort((a, b) => a.key.localeCompare(b.key));
+    for (const group of groups)
+        group.points.sort((a, b) => a.x - b.x);
+    return groups;
+}
+/**
+ * 散点 / 折线的 text 面读值块:两轴都声明了 better 时先给一行方向提示,随后一张读值表
+ * (标记字母、系列、点名与两轴终值),最后给连线系列的位移摘要。字母、系列顺序与图上一致。
+ * 位移摘要的符号是原始差值,方向好坏由读数的 better 语义判断,摘要不替读者下结论。
+ */
+function renderScatterValuesText(groups, marks, axes, locale) {
+    const blocks = [];
+    if (axes.xMeta.better !== undefined && axes.yMeta.better !== undefined) {
+        blocks.push((0, locale_ts_1.localeText)(locale, "scatter.betterUpperRight"));
+    }
+    const multiSeries = groups.length > 1;
+    const rows = groups.flatMap((group) => group.points.map((point) => ({
+        mark: marks.get(point.key) ?? "•",
+        ...(multiSeries ? { series: group.key } : {}),
+        key: point.pointLabel,
+        x: metricDisplay(point, "x", axes.xMeta, locale),
+        y: metricDisplay(point, "y", axes.yMeta, locale),
+    })));
+    blocks.push((0, plot_ts_1.renderCoordinateTable)(rows, {
+        mark: "",
+        ...(multiSeries ? { series: (0, locale_ts_1.localeText)(locale, "chart.series") } : {}),
+        key: "key",
+        x: axes.xField,
+        y: axes.yField,
+    }));
+    const shifts = groups
+        .filter((group) => group.connect)
+        .map((group) => {
+        const summary = shiftSummary(group, axes, locale);
+        if (summary === undefined)
+            return undefined;
+        const path = group.points.map((point) => marks.get(point.key) ?? "•").join(" → ");
+        return `${group.key}   ${path}   ${summary}`;
+    })
+        .filter((line) => line !== undefined);
+    if (shifts.length > 0)
+        blocks.push(shifts.join("\n"));
+    return blocks.join("\n\n");
+}
+/** 一条线首尾两点的原始差值:`通过率 +25pt · 成本 +$0.20`。百分比读数按百分点报,不按倍数。 */
+function shiftSummary(group, axes, locale) {
+    if (group.points.length < 2)
+        return undefined;
+    const first = group.points[0];
+    const last = group.points[group.points.length - 1];
+    const parts = [];
+    for (const axis of ["y", "x"]) {
+        const meta = axis === "y" ? axes.yMeta : axes.xMeta;
+        if (meta.kind !== "metric")
+            continue;
+        const label = chartFieldLabel(axis === "y" ? axes.yField : axes.xField, meta, locale);
+        parts.push(`${label} ${signedDelta(last[axis] - first[axis], meta.unit, locale)}`);
+    }
+    return parts.length > 0 ? parts.join(" · ") : undefined;
+}
+/** 带符号的差值:百分比记百分点(`+25pt`),其余按读数自己的单位格式化。 */
+function signedDelta(delta, unit, locale) {
+    const sign = delta > 0 ? "+" : delta < 0 ? "-" : "";
+    const abs = Math.abs(delta);
+    if (unit === "%") {
+        const points = abs * 100;
+        return `${sign}${Number.isInteger(points) ? points : points.toFixed(1)}pt`;
+    }
+    return `${sign}${(0, format_ts_1.formatMetricScalar)(abs, unit, undefined, locale)}`;
+}
+exports.Series = (0, tree_ts_1.defineComponent)({
+    dimensions: () => ({}),
+    web: () => null,
+    text: () => "",
+});
+exports.Series.displayName = "Series";
+exports.Chart = (0, tree_ts_1.defineComponent)({
+    /**
+     * 与页级 presentation plan 的对接契约:
+     * - 每个声明项恰是 { dimension, encoding: { kind: "series", mark }, values } 形状,
+     *   tree.ts 的 collectPageDimensions 按此校验(names 键只在本组件内唯一,它负责拼
+     *   `${nodeIndex}\0${handle}` 的页级句柄)并交给 presentation.ts 的
+     *   allocatePageDimensions 分配 label keyset 与 series 槽位。
+     * - 渲染面查询的句柄名与这里声明的键一一对应:按 `by` 字段拆系列时用字段名,
+     *   多隐式系列(未绑 by)时用 IMPLICIT_SERIES_HANDLE("__chartSeries")。
+     * - values 顺序即 renderer 遍历顺序(seriesDimensionValues 的字典序 / 系列声明序),
+     *   与 web 面 `ctx.dimension(handle).at(index)` 的 index 一致。
+     * 消费不到任何维度时返回空对象(dimensions 由声明回答「参不参与页级身份分配」)。
+     */
+    dimensions(props) {
+        const chartProps = props;
+        const data = chartProps.data;
+        if (!data || !(0, dataset_ts_1.isDataset)(data))
+            return {};
+        const specs = seriesNodesOf(chartProps.children);
+        const axes = (0, chart_map_ts_1.resolveChartAxes)(data, chartProps.x, chartProps.y);
+        const { series } = (0, chart_map_ts_1.mapChartSeries)(data, axes, specs, chartProps.series);
+        const decls = {};
+        for (const spec of specs) {
+            if (spec.by === undefined)
+                continue;
+            const values = (0, chart_map_ts_1.seriesDimensionValues)(series, spec.by);
+            if (values.length === 0)
+                continue;
+            decls[spec.by] = {
+                dimension: spec.by,
+                // area 是 FillSeriesPresentation(填充图案),不再折叠成 line。
+                encoding: { kind: "series", mark: spec.mark },
+                values,
+            };
+        }
+        const implicit = series.filter((item) => item.byField === undefined && !item.hidden);
+        if (implicit.length > 1) {
+            decls[IMPLICIT_SERIES_HANDLE] = {
+                dimension: "series",
+                encoding: { kind: "series", mark: implicit[0].mark },
+                values: implicit.map((item) => item.id),
+            };
+        }
+        return decls;
+    },
+    web(props, ctx) {
+        const data = assertDataset(props.data);
+        const specs = seriesNodesOf(props.children);
+        validateChart(data, specs, props.x, props.y);
+        const axes = (0, chart_map_ts_1.resolveChartAxes)(data, props.x, props.y);
+        const { series, missing } = (0, chart_map_ts_1.mapChartSeries)(data, axes, specs, props.series);
+        const locale = props.locale ?? ctx.locale;
+        const node = renderChartWeb(series, axes, locale, ctx, {
+            layout: props.layout,
+            legend: props.legend,
+            grid: props.grid,
+            pointTarget: props.pointTarget,
+            className: props.className,
+            missing,
+        });
+        return node;
+    },
+    text(props, ctx) {
+        const data = assertDataset(props.data);
+        return chartText(data, props, ctx);
+    },
+});
+exports.Chart.displayName = "Chart";
+//# sourceMappingURL=chart.cjs.map