@lionad/cx-comps-tanstack-charts 0.1.0-alpha.13 → 0.1.0-alpha.15

package/dist/index.mjs

@@ -142,16 +142,20 @@ const HOST_PROP_KEYS = [
 	"className"
 ];
 /**
-* 命名数据集白名单（GenUI 数据顶层化契约）：
-* rows 恒为主数据集（流式 trigger arrayKey），nodes/links 承载关系型图双数据集；
-* 物料 data 顶层与 definition 平级的这三个数组字段分馏进 datasets 表，
-* 供 marks 内字符串引用解析。非数组值静默忽略（流式半值防御）。
+* 命名数据集分馏（GenUI 数据顶层化契约）：
+* 物料 data 顶层与 definition 平级的数组字段全量进 datasets 表——rows 恒为主
+* 数据集（流式 trigger arrayKey），其余按语义自由命名：关系型图 nodes/links、
+* geo 的 sphere/graticule/land、分层图 innerRows/outerRows、仪表 bandRows 等。
+* 非数组值静默忽略（流式半值防御）。
+* 排除集防串味：宿主 props（class/style Vue 绑定可为数组）、cx 内部键
+* （comp 运行时节点、data-* 编辑标记、_ 前缀编辑器键）不是数据集。
 */
-const DATASET_KEYS = [
-	"rows",
-	"nodes",
-	"links"
-];
+const DATASET_EXCLUDE_KEYS = /* @__PURE__ */ new Set([
+	"definition",
+	"comp",
+	"class",
+	"style"
+]);
 /**
 * 分馏 <Chart> 宿主 props：标量白名单 + class/style + ariaLabel 回退。
 *
@@ -186,9 +190,11 @@ function useChartProps(attrs) {
 		spec: computed(() => attrs.definition ?? { marks: [] }),
 		datasets: computed(() => {
 			const table = {};
-			for (const key of DATASET_KEYS) {
-				const value = attrs[key];
-				if (Array.isArray(value)) table[key] = value;
+			for (const [key, value] of Object.entries(attrs)) {
+				if (!Array.isArray(value)) continue;
+				if (DATASET_EXCLUDE_KEYS.has(key)) continue;
+				if (key.startsWith("data-") || key.startsWith("_")) continue;
+				table[key] = value;
 			}
 			return table;
 		}),
@@ -613,6 +619,21 @@ function resolveMarkData(data, datasets) {
 	if (typeof data !== "string") return data;
 	return datasets?.[data] ?? [];
 }
+/** 缺省半径像素上下界（sqrt 面积映射）：小值保可见、大值防巨泡覆盖全图 */
+const DEFAULT_R_RANGE = [2.5, 14];
+/**
+* rScale 注入：库缺省 rScale 是恒等映射（字段原始值直接当像素半径，大数据值
+* 渲染为巨泡）——r 为字段名时缺省注入 sqrt 映射（半径∝√值 ⇒ 面积∝值，气泡图
+* 感知编码约定），domain 由库从数据推断（includeZero）。数值常量 r 是显式像素
+* 意图不缩放；spec.rScale.range 覆盖缺省上下界。
+* 工厂形态（无 copy 的函数）让库推断 domain；实例形态库不推断（scale-input 契约）。
+* 返回 undefined 表示不注入（消费方判空挂 options）。
+*/
+function resolveRScaleOption(spec) {
+	if (typeof spec.r !== "string") return void 0;
+	const range = spec.rScale?.range ?? DEFAULT_R_RANGE;
+	return { scale: () => scaleSqrt().range([range[0], range[1]]) };
+}
 /** layout 声明式 → mark layout 工厂（stack/group/dodge 挂 mark.layout 字段） */
 function translateLayout(spec) {
 	switch (spec.kind) {
@@ -675,7 +696,10 @@ function translateMark(spec, datasets) {
 		if (value === void 0) continue;
 		options[key] = typeof value === "number" ? () => value : value;
 	}
+	if (options.key === void 0) options.key = (_datum, { index }) => index;
 	for (const key of CHANNEL_FLEX_KEYS) if (spec[key] !== void 0) options[key] = spec[key];
+	const rScale = resolveRScaleOption(spec);
+	if (rScale !== void 0) options.rScale = rScale;
 	for (const key of STYLE_KEYS) if (spec[key] !== void 0) options[key] = spec[key];
 	for (const key of SCALAR_KEYS) if (spec[key] !== void 0) options[key] = spec[key];
 	if (spec.id !== void 0) options.id = spec.id;
@@ -861,6 +885,15 @@ function hierarchyOptions(spec, idKey) {
 	};
 	throw new Error(`translateComposite: ${spec.type} 层级数据源必须声明 path 或 nodeId+parentId`);
 }
+/**
+* 层级布局节点的字段名通道（treemap/sunburst 的 color/z、tree 节点 dot 的 color/r）：
+* 库的 channelValues 在布局节点上平查 datum[field]，而 flatHierarchyNodeContext 把源行
+* 收纳在 data 下不展开——字段名物化为 data 取值 accessor，保持「字段名引用源数据」契约。
+* sankey 不在此列：其 marks 回调 channel 按设计锁定布局行字段（key/width 等 canonical）。
+*/
+function hierarchyFieldChannel(field) {
+	return (node) => node?.data?.[field];
+}
 /** sankey：固化 marks 回调 = link(布局连线) + rect(布局节点)，样式取自声明 */
 function translateSankey(spec, datasets) {
 	const nodes = resolveMarkData(spec.nodes, datasets);
@@ -911,8 +944,8 @@ function translateSunburst(spec, datasets) {
 		value: spec.value
 	};
 	if (spec.id !== void 0) options.id = spec.id;
-	if (spec.color !== void 0) options.color = spec.color;
-	if (spec.z !== void 0) options.z = spec.z;
+	if (spec.color !== void 0) options.color = hierarchyFieldChannel(spec.color);
+	if (spec.z !== void 0) options.z = hierarchyFieldChannel(spec.z);
 	if (spec.visibleDepth !== void 0) options.visibleDepth = spec.visibleDepth;
 	if (spec.ringPadding !== void 0) options.ringPadding = spec.ringPadding;
 	for (const key of [
@@ -942,7 +975,7 @@ function translateTreemap(spec, datasets) {
 		value: spec.value
 	};
 	if (spec.id !== void 0) options.id = spec.id;
-	if (spec.color !== void 0) options.color = spec.color;
+	if (spec.color !== void 0) options.color = hierarchyFieldChannel(spec.color);
 	if (spec.method !== void 0) options.method = spec.method;
 	if (spec.ratio !== void 0) options.ratio = spec.ratio;
 	if (spec.round !== void 0) options.round = spec.round;
@@ -968,6 +1001,7 @@ function translateTree(spec, datasets) {
 	if (spec.orientation !== void 0) options.orientation = spec.orientation;
 	if (spec.nodeSize !== void 0) options.nodeSize = spec.nodeSize;
 	const layout = treeLayout(rows, options);
+	const nodeRScale = resolveRScaleOption(spec);
 	return [looseLink(layout.links, {
 		x1: "x1",
 		y1: "y1",
@@ -981,9 +1015,10 @@ function translateTree(spec, datasets) {
 		x: "x",
 		y: "y",
 		key: "id",
-		r: spec.r ?? 4.5,
-		color: spec.color ?? void 0,
-		strokeWidth: 1.5
+		r: typeof spec.r === "string" ? hierarchyFieldChannel(spec.r) : spec.r ?? 4.5,
+		color: spec.color === void 0 ? void 0 : hierarchyFieldChannel(spec.color),
+		strokeWidth: 1.5,
+		...nodeRScale !== void 0 ? { rScale: nodeRScale } : {}
 	})];
 }
 /** 缺省力集：官方示例常规四力的常量形态（函数 accessor 不可 JSON，由库缺省接管） */
@@ -1023,6 +1058,7 @@ function translateForceGraph(spec, datasets) {
 	if (spec.iterations !== void 0) options.iterations = spec.iterations;
 	if (spec.domainPadding !== void 0) options.domainPadding = spec.domainPadding;
 	const graph = forceLayout(nodes, links, options);
+	const nodeRScale = resolveRScaleOption(spec);
 	return {
 		marks: [looseLink(graph.links, {
 			x1: "x1",
@@ -1038,7 +1074,8 @@ function translateForceGraph(spec, datasets) {
 			key: spec.nodeKey,
 			color: spec.color ?? void 0,
 			r: spec.r ?? 5,
-			strokeWidth: 1.5
+			strokeWidth: 1.5,
+			...nodeRScale !== void 0 ? { rScale: nodeRScale } : {}
 		})],
 		xDomain: [graph.xDomain[0], graph.xDomain[1]],
 		yDomain: [graph.yDomain[0], graph.yDomain[1]]
@@ -1068,6 +1105,8 @@ function translateGeoShape(spec, datasets) {
 	if (spec.key !== void 0) options.key = spec.key;
 	if (spec.color !== void 0) options.color = spec.color;
 	if (spec.r !== void 0) options.r = spec.r;
+	const rScale = resolveRScaleOption(spec);
+	if (rScale !== void 0) options.rScale = rScale;
 	for (const key of [
 		"fill",
 		"fillOpacity",
@@ -1161,6 +1200,8 @@ function translateViewGrid(spec, datasets, hooks) {
 * - transforms 管道先于 marks 执行，产物注册进数据集表副本（marks 字符串引用在此解析）
 * - polar 族（polar/pie/sunburst 全为 polar 容器且无直角 channel）未显式声明 x/y 时
 *   置 null 显式无轴（库对 polar mark 的 scale 类型为 never，缺省 axis 注入会抛错）
+* - 纯 geoShape 场景同理置 null（geo mark 不物化直角 scale channel，缺省轴只剩
+*   0-1 无意义刻度；混合直角 channel mark 时保留缺省轴）
 * - tree/forceGraph 展开为多 mark；forceGraph 回传的轴域在 x/y 未显式声明时注入
 *   linear scale 实例（仿真坐标以 0 为中心，缺省推断 domain 不包含负半轴余量）
 * - spec.views 存在时分流 viewGrid 多视图组合（views 与 marks 互斥），各子视图以
@@ -1275,6 +1316,7 @@ function buildDefinition(spec, datasets, rowsOverride, mode = "host") {
 	let derivedXDomain;
 	let derivedYDomain;
 	let polarOnly = markSpecs.length > 0;
+	let geoOnly = markSpecs.length > 0;
 	const pushMark = (specMark, runtimeMark) => {
 		marks.push(specMark.decorative === true ? decorative(runtimeMark) : runtimeMark);
 	};
@@ -1284,6 +1326,7 @@ function buildDefinition(spec, datasets, rowsOverride, mode = "host") {
 			data: "rows"
 		} : mark;
 		if (!POLAR_FAMILY_TYPES.has(bound.type)) polarOnly = false;
+		if (bound.type !== "geoShape") geoOnly = false;
 		if (bound.type === "polar") pushMark(bound, translatePolar(bound, table));
 		else if (bound.type === "pie") pushMark(bound, translatePie(bound, table));
 		else if (COMPOSITE_TYPES.has(bound.type)) {
@@ -1302,8 +1345,9 @@ function buildDefinition(spec, datasets, rowsOverride, mode = "host") {
 		marks,
 		theme
 	};
-	const xSpec = spec.x === void 0 && polarOnly ? null : spec.x;
-	const ySpec = spec.y === void 0 && polarOnly ? null : spec.y;
+	const axisless = polarOnly || geoOnly;
+	const xSpec = spec.x === void 0 && axisless ? null : spec.x;
+	const ySpec = spec.y === void 0 && axisless ? null : spec.y;
 	const x = translateAxis(xSpec ?? void 0, "point");
 	const y = translateAxis(ySpec ?? void 0, "linear");
 	if (xSpec !== null && x) definition.x = x;
@@ -2175,4 +2219,4 @@ const CxTanstackChartsBundle = {
 	materials: [...CxTanstackCharts]
 };
 //#endregion
-export { COMPOSITE_TYPES, CX_CHART_CURVE_NAMES, CxTanstackCharts, area_default as CxTanstackChartsArea, bar_default as CxTanstackChartsBar, CxTanstackChartsBundle, chart_default as CxTanstackChartsChart, dot_default as CxTanstackChartsDot, line_default as CxTanstackChartsLine, pie_default as CxTanstackChartsPie, POLAR_FAMILY_TYPES, TANSTACK_CHARTS_STREAM_TRIGGERS, applyTransforms, createTanstackChartsTriggerRegistry, mainArrayOf, resolveMarkData, translateAxis, translateChartSpec, translateCompositeMark, translateCurve, translateMark, translateOutputs, translatePie, translatePolar, translateReduce, translateScale, translateTransform };
+export { COMPOSITE_TYPES, CX_CHART_CURVE_NAMES, CxTanstackCharts, area_default as CxTanstackChartsArea, bar_default as CxTanstackChartsBar, CxTanstackChartsBundle, chart_default as CxTanstackChartsChart, dot_default as CxTanstackChartsDot, line_default as CxTanstackChartsLine, pie_default as CxTanstackChartsPie, POLAR_FAMILY_TYPES, TANSTACK_CHARTS_STREAM_TRIGGERS, applyTransforms, createTanstackChartsTriggerRegistry, mainArrayOf, resolveMarkData, resolveRScaleOption, translateAxis, translateChartSpec, translateCompositeMark, translateCurve, translateMark, translateOutputs, translatePie, translatePolar, translateReduce, translateScale, translateTransform };

package/dist/shared/translate/index.d.ts

@@ -8,7 +8,7 @@ export type { CxChartAxisSpec, CxChartCurveName, CxChartDatasets, CxChartForceSp
 export { CX_CHART_CURVE_NAMES, translateCurve } from './curve';
 export { translateScale } from './scale';
 export { translateAxis } from './axis';
-export { resolveMarkData, translateMark } from './mark';
+export { resolveMarkData, resolveRScaleOption, translateMark } from './mark';
 export { applyTransforms, translateOutputs, translateReduce, translateTransform } from './transforms';
 export { POLAR_FAMILY_TYPES, translatePie, translatePolar } from './polar';
 export { COMPOSITE_TYPES, translateCompositeMark } from './composite';

package/dist/shared/translate/mark.d.ts

@@ -7,6 +7,15 @@ import type { CxChartDatasets, CxChartMarkSpec } from './types';
  * fallback 从简」契约一致）；笔误显式化归生成期校验（spec 渲染断言门）。
  */
 export declare function resolveMarkData(data: readonly unknown[] | string | undefined, datasets: CxChartDatasets | undefined): readonly unknown[];
+/**
+ * rScale 注入：库缺省 rScale 是恒等映射（字段原始值直接当像素半径，大数据值
+ * 渲染为巨泡）——r 为字段名时缺省注入 sqrt 映射（半径∝√值 ⇒ 面积∝值，气泡图
+ * 感知编码约定），domain 由库从数据推断（includeZero）。数值常量 r 是显式像素
+ * 意图不缩放；spec.rScale.range 覆盖缺省上下界。
+ * 工厂形态（无 copy 的函数）让库推断 domain；实例形态库不推断（scale-input 契约）。
+ * 返回 undefined 表示不注入（消费方判空挂 options）。
+ */
+export declare function resolveRScaleOption(spec: CxChartMarkSpec): unknown;
 /**
  * 单 mark 声明式 → ChartMark；多余样式键对 mark 工厂无害（按名读取）。
  * polar/pie/sankey 等容器与复合 type 不在此处（polar.ts / composite.ts 分支处理）。

package/dist/shared/translate/types.d.ts

@@ -126,6 +126,15 @@ export interface CxChartMarkSpec {
     key?: string;
     text?: string;
     r?: string | number;
+    /**
+     * 半径缩放声明式（仅 r 为字段名时消费；数值常量 r 是显式像素意图，不缩放）。
+     * 库缺省 rScale 为恒等映射（原始值直接当像素半径），翻译层对字段名 r 缺省注入
+     * sqrt 面积映射（半径∝√值 ⇒ 面积∝值，气泡图感知编码约定），本字段覆盖其
+     * range 像素上下界；kind 不收（sqrt 是气泡半径的正确默认，线性半径会平方夸大差异）。
+     */
+    rScale?: {
+        range?: [number, number];
+    };
     angle?: string | number;
     radius?: string | number;
     width?: string | number;
@@ -428,7 +437,7 @@ export type CxChartTransformSpec = {
     startAngle?: number;
     endAngle?: number;
 };
-/** 命名数据集表：物料 data 顶层除 definition 外的数组字段（GenUI 契约 rows/nodes/links） */
+/** 命名数据集表：物料 data 顶层除 definition 外的数组字段全量分馏（rows 恒为主数据集，其余按语义自由命名：geo 的 sphere/land、分层图 innerRows/outerRows 等） */
 export type CxChartDatasets = Record<string, readonly unknown[] | undefined>;
 /** viewGrid 网格轨道：size 固定像素 / grow 按比例分配剩余空间（min/max 钳制） */
 export type CxChartViewTrack = {

package/dist/shared/use-chart-props.d.ts

@@ -9,7 +9,7 @@ export interface CxChartHostPartition {
 export interface CxChartPropsPartition extends CxChartHostPartition {
     /** 物料 JSON definition（声明式 spec，待翻译层组装） */
     spec: ComputedRef<CxChartSpec>;
-    /** 命名数据集表（rows/nodes/links 白名单分馏；marks 字符串引用在此解析） */
+    /** 命名数据集表（顶层数组字段全量分馏；marks 字符串引用在此解析） */
     datasets: ComputedRef<CxChartDatasets>;
 }
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lionad/cx-comps-tanstack-charts",
-  "version": "0.1.0-alpha.13",
+  "version": "0.1.0-alpha.15",
   "description": "cx material components wrapping TanStack Charts (@tanstack/charts/vue)",
   "keywords": [
     "charts",