@retikz/react 0.1.0-alpha.1 → 0.1.0-alpha.2

package/dist/es/index.d.ts

@@ -6,8 +6,8 @@
  *
  * 渲染管道：buildIR → compileToScene → renderPrim → SVG
  */
-export { Tikz, Node, Path, Step } from './kernel';
-export type { TikzProps, NodeProps, PathProps, StepProps } from './kernel';
+export { Tikz, Node, Path, Step, Text } from './kernel';
+export type { TikzProps, NodeProps, PathProps, StepProps, TextProps } from './kernel';
 export { Draw } from './sugar';
 export type { DrawProps } from './sugar';
 export { DrawWay } from '@retikz/core';

package/dist/es/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAClD,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAE3E,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC/B,YAAY,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAGzC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,YAAY,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAGtE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAEpE,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AACxD,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAEtF,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC/B,YAAY,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAGzC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,YAAY,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAGtE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAEpE,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC"}

package/dist/es/index.js

@@ -3,9 +3,10 @@ import { Tikz } from "./kernel/Tikz.js";
 import { Node } from "./kernel/Node.js";
 import { Path } from "./kernel/Path.js";
 import { Step } from "./kernel/Step.js";
+import { Text } from "./kernel/Text.js";
 import "./kernel/index.js";
 import { Draw } from "./sugar/Draw.js";
 import "./sugar/index.js";
 import { convertIRToReactNode } from "./kernel/_unbuilder.js";
 import { DrawWay } from "@retikz/core";
-export { Draw, DrawWay, Node, Path, Step, Tikz, convertIRToReactNode, buildIR as convertReactNodeToIR };
+export { Draw, DrawWay, Node, Path, Step, Text, Tikz, convertIRToReactNode, buildIR as convertReactNodeToIR };

package/dist/es/kernel/Node.d.ts

@@ -1,5 +1,5 @@
 import { FC, ReactNode } from 'react';
-import { IRNode, IRPosition, PolarPosition } from '@retikz/core';
+import { IRFont, IRLineSpec, IRNode, IRPosition, NodeTextAlign, PolarPosition } from '@retikz/core';
 /** <Node> 组件的 props */
 export type NodeProps = {
     /** 节点 id；其他 Path/Draw 通过这个 id 引用本节点 */
@@ -10,22 +10,73 @@ export type NodeProps = {
     position: IRPosition | PolarPosition;
     /** 旋转角度（度数，与 TikZ 一致），绕节点中心；正值顺时针 */
     rotate?: number;
-    /** 文本内容；也支持 children 形式（仅字符串） */
+    /**
+     * 文本内容（也可以用 children 写）；与 `text` 二选一，`text` 优先。
+     *
+     * children 多行写法：
+     * - `<Node>{'Line 1\nLine 2'}</Node>`（字符串内嵌 `\n`）
+     * - ``<Node>{`Line 1\nLine 2`}</Node>``（模板字面量）
+     * - `<Node>{['Line 1', 'Line 2']}</Node>`（数组）
+     * - `<Node><Text fill="red">L1</Text>L2</Node>`（混 `<Text>` 带样式行）
+     */
     children?: ReactNode;
-    /** 显式 text，优先级高于 children */
-    text?: string;
-    /** 字号；不填用默认值 */
-    fontSize?: number;
-    /** 内边距：内容到 border 的距离 */
+    /**
+     * 显式 text，优先级高于 children：
+     * - `string` — 单行
+     * - `Array<string>` — 多行无样式覆盖
+     * - `Array<string | LineSpec>` — 多行，可对单行覆盖 fill / opacity / font
+     */
+    text?: string | Array<IRLineSpec>;
+    /** 多行文本对齐：left / center（默认）/ right；只影响多行块内各行的水平对齐 */
+    align?: NodeTextAlign;
+    /** 行高（user units）；不填走 `font.size × 1.2` 默认 */
+    lineHeight?: number;
+    /** 字体规格：family / size / weight / style 全部可选；不填走渲染端默认值 */
+    font?: IRFont;
+    /** 横向内边距（text → 左右 border）；不填走 `padding` 兜底，再走默认 */
+    innerXSep?: number;
+    /** 纵向内边距（text → 上下 border）；不填走 `padding` 兜底，再走默认 */
+    innerYSep?: number;
+    /** 外边距（border → path 附着点）；不影响 border 位置；不填走 `margin` 兜底 */
+    outerSep?: number;
+    /** 内边距对称别名——等价于同时设 `innerXSep` 和 `innerYSep`；轴特化字段优先 */
     padding?: number;
-    /** 外边距：border 到 path 附着点的距离；不影响 border 位置；必须 ≥ 0 */
+    /** 外边距对称别名——等价于 `outerSep`；轴特化字段优先 */
     margin?: number;
     /** 背景色 */
     fill?: IRNode['fill'];
+    /** 填充透明度 0~1 */
+    fillOpacity?: number;
     /** 描边色 */
     stroke?: IRNode['stroke'];
+    /** 描边透明度 0~1（TikZ `draw opacity`） */
+    drawOpacity?: number;
     /** 描边宽度 */
     strokeWidth?: number;
+    /** 描边虚线预设：等价于 dashArray="4 2"；与 `dotted` / `dashArray` 优先级：dashArray > dashed > dotted */
+    dashed?: boolean;
+    /** 描边点线预设：等价于 dashArray="1 2" */
+    dotted?: boolean;
+    /** 显式 SVG stroke-dasharray 值（如 "4 2"）；优先级最高 */
+    dashArray?: string;
+    /** 圆角半径（user units）；只对 `rectangle` shape 生效 */
+    roundedCorners?: number;
+    /** 最小 border 宽度（user units）；不足时撑开 bbox */
+    minimumWidth?: number;
+    /** 最小 border 高度（user units） */
+    minimumHeight?: number;
+    /** 对称最小尺寸别名——等价于同时设 `minimumWidth` 与 `minimumHeight`；轴特化字段优先 */
+    minimumSize?: number;
+    /** 均匀缩放因子；同时影响 bbox / 字号 / padding / margin / 路径附着点（与 TikZ scale 一致） */
+    scale?: number;
+    /** 横向缩放，优先于 `scale` */
+    xScale?: number;
+    /** 纵向缩放，优先于 `scale` */
+    yScale?: number;
+    /** 文字颜色（块级默认；行级 LineSpec.fill 可覆盖）；不填走 `currentColor` */
+    textColor?: string;
+    /** 整节点透明度 0~1（同时作用于 shape 与 text） */
+    opacity?: number;
 };
 /**
  * Node 是 DSL 标记组件——本身不渲染任何 React 元素。

package/dist/es/kernel/Node.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Node.d.ts","sourceRoot":"","sources":["../../../src/kernel/Node.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAGtE,uBAAuB;AACvB,MAAM,MAAM,SAAS,GAAG;IACtB,uCAAuC;IACvC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,qDAAqD;IACrD,KAAK,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IACxB,oCAAoC;IACpC,QAAQ,EAAE,UAAU,GAAG,aAAa,CAAC;IACrC,qCAAqC;IACrC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,6BAA6B;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,gBAAgB;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,yBAAyB;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,oDAAoD;IACpD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU;IACV,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,UAAU;IACV,MAAM,CAAC,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC;IAC1B,WAAW;IACX,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAAc,CAAC"}
+{"version":3,"file":"Node.d.ts","sourceRoot":"","sources":["../../../src/kernel/Node.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAK,EACV,MAAM,EACN,UAAU,EACV,MAAM,EACN,UAAU,EACV,aAAa,EACb,aAAa,EACd,MAAM,cAAc,CAAC;AAGtB,uBAAuB;AACvB,MAAM,MAAM,SAAS,GAAG;IACtB,uCAAuC;IACvC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,qDAAqD;IACrD,KAAK,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IACxB,oCAAoC;IACpC,QAAQ,EAAE,UAAU,GAAG,aAAa,CAAC;IACrC,qCAAqC;IACrC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;;;;;;OAQG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC;IAClC,qDAAqD;IACrD,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,8CAA8C;IAC9C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,yDAAyD;IACzD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oDAAoD;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oDAAoD;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,wDAAwD;IACxD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU;IACV,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,gBAAgB;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU;IACV,MAAM,CAAC,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC;IAC1B,qCAAqC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW;IACX,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,0FAA0F;IAC1F,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,iCAAiC;IACjC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,+CAA+C;IAC/C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,0CAA0C;IAC1C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,+BAA+B;IAC/B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gEAAgE;IAChE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wEAAwE;IACxE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uBAAuB;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,uBAAuB;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qCAAqC;IACrC,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAAc,CAAC"}

package/dist/es/kernel/Text.d.ts

@@ -0,0 +1,31 @@
+import { FC } from 'react';
+import { IRFont } from '@retikz/core';
+/** <Text> 组件的 props——Node 多行文本里给某一行带覆盖样式 */
+export type TextProps = {
+    /** 行内容（必须是字符串） */
+    children: string;
+    /** 行级覆盖颜色；不填走 Node 块级默认 */
+    fill?: string;
+    /** 行级透明度 0~1；不填走 Node 块级默认 */
+    opacity?: number;
+    /** 行级字体覆盖；missing 字段继承 Node 的 `font` 块级值 */
+    font?: IRFont;
+};
+/**
+ * Text 是 Node 内的"行级"标记组件——本身不渲染，
+ * 由 buildIR 在扫描 Node children 时识别为 LineSpec。
+ *
+ * 和字符串 children 平等参与——String 按 `'\n'` 拆纯样式行；
+ * `<Text>` 一次贡献一行带样式行；保持 JSX 顺序。
+ *
+ * 用法：
+ * ```tsx
+ * <Node>
+ *   <Text fill="red" font={{ weight: 'bold' }}>Heading</Text>
+ *   body line 1
+ *   body line 2
+ * </Node>
+ * ```
+ */
+export declare const Text: FC<TextProps>;
+//# sourceMappingURL=Text.d.ts.map

package/dist/es/kernel/Text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../../src/kernel/Text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAG3C,4CAA4C;AAC5C,MAAM,MAAM,SAAS,GAAG;IACtB,kBAAkB;IAClB,QAAQ,EAAE,MAAM,CAAC;IACjB,2BAA2B;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,8BAA8B;IAC9B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,4CAA4C;IAC5C,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAAc,CAAC"}

package/dist/es/kernel/Text.js

@@ -0,0 +1,22 @@
+import { TIKZ_TEXT } from "./_displayNames.js";
+//#region src/kernel/Text.tsx
+/**
+* Text 是 Node 内的"行级"标记组件——本身不渲染，
+* 由 buildIR 在扫描 Node children 时识别为 LineSpec。
+*
+* 和字符串 children 平等参与——String 按 `'\n'` 拆纯样式行；
+* `<Text>` 一次贡献一行带样式行；保持 JSX 顺序。
+*
+* 用法：
+* ```tsx
+* <Node>
+*   <Text fill="red" font={{ weight: 'bold' }}>Heading</Text>
+*   body line 1
+*   body line 2
+* </Node>
+* ```
+*/
+var Text = () => null;
+Text.displayName = TIKZ_TEXT;
+//#endregion
+export { Text };

package/dist/es/kernel/_builder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"_builder.d.ts","sourceRoot":"","sources":["../../../src/kernel/_builder.ts"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,SAAS,EAAkB,MAAM,OAAO,CAAC;AACpF,OAAO,KAAK,EAAE,EAAE,EAA2B,MAAM,cAAc,CAAC;AAoIhE;;;GAGG;AACH,eAAO,MAAM,OAAO,GAAI,UAAU,SAAS,KAAG,EAI5C,CAAC"}
+{"version":3,"file":"_builder.d.ts","sourceRoot":"","sources":["../../../src/kernel/_builder.ts"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,SAAS,EAAkB,MAAM,OAAO,CAAC;AACpF,OAAO,KAAK,EAAE,EAAE,EAA+C,MAAM,cAAc,CAAC;AA6NpF;;;GAGG;AACH,eAAO,MAAM,OAAO,GAAI,UAAU,SAAS,KAAG,EAI5C,CAAC"}

package/dist/es/kernel/_builder.js

@@ -8,24 +8,102 @@ var getDisplayName = (el) => {
 	if (typeof t === "string") return t;
 	return t.displayName;
 };
-/** 把 <Node> props 翻成 IRChild；text 优先取 props.text，其次取字符串 children */
-var buildNode = (props) => {
-	const text = typeof props.text === "string" ? props.text : typeof props.children === "string" ? props.children : void 0;
+/**
+* 把 <Text> 元素的 props + children 串解析为 IRLineSpec 对象形式。
+* children 必须是 string；非字符串 children 静默跳过此 <Text> 元素。
+*/
+var textElementToLineSpec = (el) => {
+	const props = el.props;
+	if (typeof props.children !== "string") return void 0;
+	if (props.fill === void 0 && props.opacity === void 0 && props.font === void 0) return props.children;
 	return {
-		type: "node",
-		id: props.id,
-		shape: props.shape,
-		position: props.position,
-		rotate: props.rotate,
-		text,
+		text: props.children,
 		fill: props.fill,
-		stroke: props.stroke,
-		strokeWidth: props.strokeWidth,
-		padding: props.padding,
-		margin: props.margin,
-		fontSize: props.fontSize
+		opacity: props.opacity,
+		font: props.font
+	};
+};
+/**
+* 递归收集 Node children 中的行：
+* - 字符串按 `'\n'` 拆行（每段 → 字符串 LineSpec）
+* - 数组（JSX 多 child 自动展平）逐项递归
+* - <Text> 元素 → 对象 LineSpec（带覆盖样式）
+* - 其它类型（其它 React 元素 / null / 数字等）忽略——附带让 `<br/>` 当软分段
+*
+* 顺序保留——按 JSX 写的顺序行就是 IR 行顺序。
+*/
+var collectChildLines = (children) => {
+	const out = [];
+	const visit = (node) => {
+		if (typeof node === "string") {
+			for (const part of node.split("\n")) out.push(part);
+			return;
+		}
+		if (Array.isArray(node)) {
+			for (const c of node) visit(c);
+			return;
+		}
+		if (isValidElement(node) && getDisplayName(node) === "@retikz/Text") {
+			const spec = textElementToLineSpec(node);
+			if (spec !== void 0) out.push(spec);
+		}
 	};
+	visit(children);
+	return out;
+};
+/**
+* Node 文本读取顺序：
+* 1. `props.text`（string / string[] / LineSpec[]）— 显式优先，直接透传到 IR
+* 2. `props.children` — 字符串按 `'\n'` 拆行；`<Text>` 元素带样式贡献一行；保持 JSX 顺序
+*
+* 用 children 写多行的几种姿势：
+* - 字符串带换行：`<Node>{'Line 1\nLine 2'}</Node>`
+* - 模板字面量：``<Node>{`Line 1\nLine 2`}</Node>``
+* - 数组：`<Node>{['Line 1', 'Line 2']}</Node>`
+* - <Text>（带样式）：`<Node><Text fill="red">Heading</Text>body</Node>`
+*/
+var readNodeText = (props) => {
+	if (typeof props.text === "string") return props.text;
+	if (Array.isArray(props.text)) return props.text;
+	const lines = collectChildLines(props.children);
+	if (lines.length === 0) return void 0;
+	if (lines.length === 1 && typeof lines[0] === "string") return lines[0];
+	return lines;
 };
+/** 把 <Node> props 翻成 IRChild；text 优先取 props.text，其次取字符串 children */
+var buildNode = (props) => ({
+	type: "node",
+	id: props.id,
+	shape: props.shape,
+	position: props.position,
+	rotate: props.rotate,
+	text: readNodeText(props),
+	align: props.align,
+	lineHeight: props.lineHeight,
+	fill: props.fill,
+	fillOpacity: props.fillOpacity,
+	stroke: props.stroke,
+	drawOpacity: props.drawOpacity,
+	strokeWidth: props.strokeWidth,
+	dashed: props.dashed,
+	dotted: props.dotted,
+	dashArray: props.dashArray,
+	roundedCorners: props.roundedCorners,
+	minimumWidth: props.minimumWidth,
+	minimumHeight: props.minimumHeight,
+	minimumSize: props.minimumSize,
+	scale: props.scale,
+	xScale: props.xScale,
+	yScale: props.yScale,
+	textColor: props.textColor,
+	opacity: props.opacity,
+	innerXSep: props.innerXSep,
+	innerYSep: props.innerYSep,
+	outerSep: props.outerSep,
+	padding: props.padding,
+	margin: props.margin,
+	font: props.font
+});
 /**
 * 扫描 <Path> children 收集 <Step> 序列。
 * 至少 2 段；首段不是 move 时强制改为 move（与 SVG path 的 "M …" 语义对齐）；

package/dist/es/kernel/_displayNames.d.ts

@@ -4,4 +4,6 @@ export declare const TIKZ_NODE = "@retikz/Node";
 export declare const TIKZ_PATH = "@retikz/Path";
 /** <Step> 组件的 displayName */
 export declare const TIKZ_STEP = "@retikz/Step";
+/** <Text> 组件的 displayName（Node 内多行文本带样式） */
+export declare const TIKZ_TEXT = "@retikz/Text";
 //# sourceMappingURL=_displayNames.d.ts.map

package/dist/es/kernel/_displayNames.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"_displayNames.d.ts","sourceRoot":"","sources":["../../../src/kernel/_displayNames.ts"],"names":[],"mappings":"AAKA,6BAA6B;AAC7B,eAAO,MAAM,SAAS,iBAAiB,CAAC;AAExC,6BAA6B;AAC7B,eAAO,MAAM,SAAS,iBAAiB,CAAC;AAExC,6BAA6B;AAC7B,eAAO,MAAM,SAAS,iBAAiB,CAAC"}
+{"version":3,"file":"_displayNames.d.ts","sourceRoot":"","sources":["../../../src/kernel/_displayNames.ts"],"names":[],"mappings":"AAKA,6BAA6B;AAC7B,eAAO,MAAM,SAAS,iBAAiB,CAAC;AAExC,6BAA6B;AAC7B,eAAO,MAAM,SAAS,iBAAiB,CAAC;AAExC,6BAA6B;AAC7B,eAAO,MAAM,SAAS,iBAAiB,CAAC;AAExC,4CAA4C;AAC5C,eAAO,MAAM,SAAS,iBAAiB,CAAC"}

package/dist/es/kernel/_displayNames.js

@@ -5,5 +5,7 @@ var TIKZ_NODE = "@retikz/Node";
 var TIKZ_PATH = "@retikz/Path";
 /** <Step> 组件的 displayName */
 var TIKZ_STEP = "@retikz/Step";
+/** <Text> 组件的 displayName（Node 内多行文本带样式） */
+var TIKZ_TEXT = "@retikz/Text";
 //#endregion
-export { TIKZ_NODE, TIKZ_PATH, TIKZ_STEP };
+export { TIKZ_NODE, TIKZ_PATH, TIKZ_STEP, TIKZ_TEXT };

package/dist/es/kernel/_unbuilder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"_unbuilder.d.ts","sourceRoot":"","sources":["../../../src/kernel/_unbuilder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAiB,MAAM,OAAO,CAAC;AACtD,OAAO,KAAK,EAAE,EAAE,EAA2B,MAAM,cAAc,CAAC;AA2DhE;;;;;;GAMG;AACH,eAAO,MAAM,oBAAoB,GAAI,IAAI,EAAE,KAAG,SACW,CAAC"}
+{"version":3,"file":"_unbuilder.d.ts","sourceRoot":"","sources":["../../../src/kernel/_unbuilder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAiB,MAAM,OAAO,CAAC;AACtD,OAAO,KAAK,EAAE,EAAE,EAA2B,MAAM,cAAc,CAAC;AA8EhE;;;;;;GAMG;AACH,eAAO,MAAM,oBAAoB,GAAI,IAAI,EAAE,KAAG,SACW,CAAC"}

package/dist/es/kernel/_unbuilder.js

@@ -10,12 +10,31 @@ var nodePropsFromIR = (n) => {
 	if (n.shape !== void 0) props.shape = n.shape;
 	if (n.rotate !== void 0) props.rotate = n.rotate;
 	if (n.text !== void 0) props.text = n.text;
-	if (n.fontSize !== void 0) props.fontSize = n.fontSize;
+	if (n.align !== void 0) props.align = n.align;
+	if (n.lineHeight !== void 0) props.lineHeight = n.lineHeight;
+	if (n.font !== void 0) props.font = n.font;
+	if (n.innerXSep !== void 0) props.innerXSep = n.innerXSep;
+	if (n.innerYSep !== void 0) props.innerYSep = n.innerYSep;
+	if (n.outerSep !== void 0) props.outerSep = n.outerSep;
 	if (n.padding !== void 0) props.padding = n.padding;
 	if (n.margin !== void 0) props.margin = n.margin;
 	if (n.fill !== void 0) props.fill = n.fill;
+	if (n.fillOpacity !== void 0) props.fillOpacity = n.fillOpacity;
 	if (n.stroke !== void 0) props.stroke = n.stroke;
+	if (n.drawOpacity !== void 0) props.drawOpacity = n.drawOpacity;
 	if (n.strokeWidth !== void 0) props.strokeWidth = n.strokeWidth;
+	if (n.dashed !== void 0) props.dashed = n.dashed;
+	if (n.dotted !== void 0) props.dotted = n.dotted;
+	if (n.dashArray !== void 0) props.dashArray = n.dashArray;
+	if (n.roundedCorners !== void 0) props.roundedCorners = n.roundedCorners;
+	if (n.minimumWidth !== void 0) props.minimumWidth = n.minimumWidth;
+	if (n.minimumHeight !== void 0) props.minimumHeight = n.minimumHeight;
+	if (n.minimumSize !== void 0) props.minimumSize = n.minimumSize;
+	if (n.scale !== void 0) props.scale = n.scale;
+	if (n.xScale !== void 0) props.xScale = n.xScale;
+	if (n.yScale !== void 0) props.yScale = n.yScale;
+	if (n.textColor !== void 0) props.textColor = n.textColor;
+	if (n.opacity !== void 0) props.opacity = n.opacity;
 	return props;
 };
 /** 单个 IRStep → <Step /> element */

package/dist/es/kernel/index.d.ts

@@ -2,4 +2,5 @@ export * from './Tikz';
 export * from './Node';
 export * from './Path';
 export * from './Step';
+export * from './Text';
 //# sourceMappingURL=index.d.ts.map

package/dist/es/kernel/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/kernel/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/kernel/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC"}

package/dist/es/kernel/index.js

@@ -2,3 +2,4 @@ import "./Tikz.js";
 import "./Node.js";
 import "./Path.js";
 import "./Step.js";
+import "./Text.js";

package/dist/es/render/renderPrim.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"renderPrim.d.ts","sourceRoot":"","sources":["../../../src/render/renderPrim.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AA6B/D;;;GAGG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B,iDAAiD;IACjD,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,MAAM,CAAC;CAClD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,UAAU,GACrB,GAAG,cAAc,EACjB,KAAK,GAAG,EACR,MAAK,aAAkB,KACtB,YAsFF,CAAC"}
+{"version":3,"file":"renderPrim.d.ts","sourceRoot":"","sources":["../../../src/render/renderPrim.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AA6B/D;;;GAGG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B,iDAAiD;IACjD,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,MAAM,CAAC;CAClD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,UAAU,GACrB,GAAG,cAAc,EACjB,KAAK,GAAG,EACR,MAAK,aAAkB,KACtB,YAqHF,CAAC"}

package/dist/es/render/renderPrim.js

@@ -25,6 +25,7 @@ var renderPrim = (p, key, ctx = {}) => {
 			fill: p.fill,
 			fillOpacity: p.fillOpacity,
 			stroke: p.stroke,
+			strokeOpacity: p.strokeOpacity,
 			strokeWidth: p.strokeWidth,
 			strokeDasharray: p.strokeDasharray,
 			rx: p.cornerRadius,
@@ -42,32 +43,49 @@ var renderPrim = (p, key, ctx = {}) => {
 				fill: p.fill,
 				fillOpacity: p.fillOpacity,
 				stroke: p.stroke,
+				strokeOpacity: p.strokeOpacity,
 				strokeWidth: p.strokeWidth,
 				strokeDasharray: p.strokeDasharray,
 				opacity: p.opacity
 			}, key);
 		}
-		case "text": return /* @__PURE__ */ jsx("text", {
-			x: p.x,
-			y: p.y,
-			fontSize: p.fontSize,
-			fontFamily: p.fontFamily,
-			fontWeight: p.fontWeight,
-			fontStyle: p.fontStyle,
-			textAnchor: alignToAnchor(p.align),
-			dominantBaseline: baselineToDominant(p.baseline),
-			fill: p.fill,
-			opacity: p.opacity,
-			children: p.content
-		}, key);
+		case "text": {
+			const n = p.lines.length;
+			const firstDy = p.baseline === "middle" ? -(n - 1) / 2 * p.lineHeight : p.baseline === "bottom" ? -(n - 1) * p.lineHeight : 0;
+			return /* @__PURE__ */ jsx("text", {
+				x: p.x,
+				y: p.y,
+				fontSize: p.fontSize,
+				fontFamily: p.fontFamily,
+				fontWeight: p.fontWeight,
+				fontStyle: p.fontStyle,
+				textAnchor: alignToAnchor(p.align),
+				dominantBaseline: baselineToDominant(p.baseline),
+				fill: p.fill,
+				opacity: p.opacity,
+				children: p.lines.map((line, i) => /* @__PURE__ */ jsx("tspan", {
+					x: p.x,
+					dy: i === 0 ? firstDy : p.lineHeight,
+					fill: line.fill,
+					opacity: line.opacity,
+					fontSize: line.fontSize,
+					fontFamily: line.fontFamily,
+					fontWeight: line.fontWeight,
+					fontStyle: line.fontStyle,
+					children: line.text
+				}, i))
+			}, key);
+		}
 		case "path": {
 			const startId = p.arrowStart && ctx.arrowMarkerIdFor ? ctx.arrowMarkerIdFor(p.arrowStart) : void 0;
 			const endId = p.arrowEnd && ctx.arrowMarkerIdFor ? ctx.arrowMarkerIdFor(p.arrowEnd) : void 0;
 			return /* @__PURE__ */ jsx("path", {
 				d: p.d,
 				fill: p.fill,
+				fillOpacity: p.fillOpacity,
 				fillRule: p.fillRule,
 				stroke: p.stroke,
+				strokeOpacity: p.strokeOpacity,
 				strokeWidth: p.strokeWidth,
 				strokeDasharray: p.strokeDasharray,
 				strokeLinecap: p.strokeLinecap,

package/dist/lib/index.cjs

@@ -4,6 +4,7 @@ const require_Tikz = require("./kernel/Tikz.cjs");
 const require_Node = require("./kernel/Node.cjs");
 const require_Path = require("./kernel/Path.cjs");
 const require_Step = require("./kernel/Step.cjs");
+const require_Text = require("./kernel/Text.cjs");
 require("./kernel/index.cjs");
 const require_Draw = require("./sugar/Draw.cjs");
 require("./sugar/index.cjs");
@@ -19,6 +20,7 @@ Object.defineProperty(exports, "DrawWay", {
 exports.Node = require_Node.Node;
 exports.Path = require_Path.Path;
 exports.Step = require_Step.Step;
+exports.Text = require_Text.Text;
 exports.Tikz = require_Tikz.Tikz;
 exports.convertIRToReactNode = require__unbuilder.convertIRToReactNode;
 exports.convertReactNodeToIR = require__builder.buildIR;

package/dist/lib/index.d.ts

@@ -6,8 +6,8 @@
  *
  * 渲染管道：buildIR → compileToScene → renderPrim → SVG
  */
-export { Tikz, Node, Path, Step } from './kernel';
-export type { TikzProps, NodeProps, PathProps, StepProps } from './kernel';
+export { Tikz, Node, Path, Step, Text } from './kernel';
+export type { TikzProps, NodeProps, PathProps, StepProps, TextProps } from './kernel';
 export { Draw } from './sugar';
 export type { DrawProps } from './sugar';
 export { DrawWay } from '@retikz/core';

package/dist/lib/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAClD,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAE3E,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC/B,YAAY,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAGzC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,YAAY,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAGtE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAEpE,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AACxD,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAEtF,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC/B,YAAY,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAGzC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,YAAY,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAGtE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAEpE,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC"}

package/dist/lib/kernel/Node.d.ts

@@ -1,5 +1,5 @@
 import { FC, ReactNode } from 'react';
-import { IRNode, IRPosition, PolarPosition } from '@retikz/core';
+import { IRFont, IRLineSpec, IRNode, IRPosition, NodeTextAlign, PolarPosition } from '@retikz/core';
 /** <Node> 组件的 props */
 export type NodeProps = {
     /** 节点 id；其他 Path/Draw 通过这个 id 引用本节点 */
@@ -10,22 +10,73 @@ export type NodeProps = {
     position: IRPosition | PolarPosition;
     /** 旋转角度（度数，与 TikZ 一致），绕节点中心；正值顺时针 */
     rotate?: number;
-    /** 文本内容；也支持 children 形式（仅字符串） */
+    /**
+     * 文本内容（也可以用 children 写）；与 `text` 二选一，`text` 优先。
+     *
+     * children 多行写法：
+     * - `<Node>{'Line 1\nLine 2'}</Node>`（字符串内嵌 `\n`）
+     * - ``<Node>{`Line 1\nLine 2`}</Node>``（模板字面量）
+     * - `<Node>{['Line 1', 'Line 2']}</Node>`（数组）
+     * - `<Node><Text fill="red">L1</Text>L2</Node>`（混 `<Text>` 带样式行）
+     */
     children?: ReactNode;
-    /** 显式 text，优先级高于 children */
-    text?: string;
-    /** 字号；不填用默认值 */
-    fontSize?: number;
-    /** 内边距：内容到 border 的距离 */
+    /**
+     * 显式 text，优先级高于 children：
+     * - `string` — 单行
+     * - `Array<string>` — 多行无样式覆盖
+     * - `Array<string | LineSpec>` — 多行，可对单行覆盖 fill / opacity / font
+     */
+    text?: string | Array<IRLineSpec>;
+    /** 多行文本对齐：left / center（默认）/ right；只影响多行块内各行的水平对齐 */
+    align?: NodeTextAlign;
+    /** 行高（user units）；不填走 `font.size × 1.2` 默认 */
+    lineHeight?: number;
+    /** 字体规格：family / size / weight / style 全部可选；不填走渲染端默认值 */
+    font?: IRFont;
+    /** 横向内边距（text → 左右 border）；不填走 `padding` 兜底，再走默认 */
+    innerXSep?: number;
+    /** 纵向内边距（text → 上下 border）；不填走 `padding` 兜底，再走默认 */
+    innerYSep?: number;
+    /** 外边距（border → path 附着点）；不影响 border 位置；不填走 `margin` 兜底 */
+    outerSep?: number;
+    /** 内边距对称别名——等价于同时设 `innerXSep` 和 `innerYSep`；轴特化字段优先 */
     padding?: number;
-    /** 外边距：border 到 path 附着点的距离；不影响 border 位置；必须 ≥ 0 */
+    /** 外边距对称别名——等价于 `outerSep`；轴特化字段优先 */
     margin?: number;
     /** 背景色 */
     fill?: IRNode['fill'];
+    /** 填充透明度 0~1 */
+    fillOpacity?: number;
     /** 描边色 */
     stroke?: IRNode['stroke'];
+    /** 描边透明度 0~1（TikZ `draw opacity`） */
+    drawOpacity?: number;
     /** 描边宽度 */
     strokeWidth?: number;
+    /** 描边虚线预设：等价于 dashArray="4 2"；与 `dotted` / `dashArray` 优先级：dashArray > dashed > dotted */
+    dashed?: boolean;
+    /** 描边点线预设：等价于 dashArray="1 2" */
+    dotted?: boolean;
+    /** 显式 SVG stroke-dasharray 值（如 "4 2"）；优先级最高 */
+    dashArray?: string;
+    /** 圆角半径（user units）；只对 `rectangle` shape 生效 */
+    roundedCorners?: number;
+    /** 最小 border 宽度（user units）；不足时撑开 bbox */
+    minimumWidth?: number;
+    /** 最小 border 高度（user units） */
+    minimumHeight?: number;
+    /** 对称最小尺寸别名——等价于同时设 `minimumWidth` 与 `minimumHeight`；轴特化字段优先 */
+    minimumSize?: number;
+    /** 均匀缩放因子；同时影响 bbox / 字号 / padding / margin / 路径附着点（与 TikZ scale 一致） */
+    scale?: number;
+    /** 横向缩放，优先于 `scale` */
+    xScale?: number;
+    /** 纵向缩放，优先于 `scale` */
+    yScale?: number;
+    /** 文字颜色（块级默认；行级 LineSpec.fill 可覆盖）；不填走 `currentColor` */
+    textColor?: string;
+    /** 整节点透明度 0~1（同时作用于 shape 与 text） */
+    opacity?: number;
 };
 /**
  * Node 是 DSL 标记组件——本身不渲染任何 React 元素。

package/dist/lib/kernel/Node.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Node.d.ts","sourceRoot":"","sources":["../../../src/kernel/Node.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAGtE,uBAAuB;AACvB,MAAM,MAAM,SAAS,GAAG;IACtB,uCAAuC;IACvC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,qDAAqD;IACrD,KAAK,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IACxB,oCAAoC;IACpC,QAAQ,EAAE,UAAU,GAAG,aAAa,CAAC;IACrC,qCAAqC;IACrC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,6BAA6B;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,gBAAgB;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,yBAAyB;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,oDAAoD;IACpD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU;IACV,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,UAAU;IACV,MAAM,CAAC,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC;IAC1B,WAAW;IACX,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAAc,CAAC"}
+{"version":3,"file":"Node.d.ts","sourceRoot":"","sources":["../../../src/kernel/Node.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAK,EACV,MAAM,EACN,UAAU,EACV,MAAM,EACN,UAAU,EACV,aAAa,EACb,aAAa,EACd,MAAM,cAAc,CAAC;AAGtB,uBAAuB;AACvB,MAAM,MAAM,SAAS,GAAG;IACtB,uCAAuC;IACvC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,qDAAqD;IACrD,KAAK,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IACxB,oCAAoC;IACpC,QAAQ,EAAE,UAAU,GAAG,aAAa,CAAC;IACrC,qCAAqC;IACrC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;;;;;;OAQG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC;IAClC,qDAAqD;IACrD,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,8CAA8C;IAC9C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,yDAAyD;IACzD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oDAAoD;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oDAAoD;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,wDAAwD;IACxD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU;IACV,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,gBAAgB;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU;IACV,MAAM,CAAC,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC;IAC1B,qCAAqC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW;IACX,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,0FAA0F;IAC1F,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,iCAAiC;IACjC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,+CAA+C;IAC/C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,0CAA0C;IAC1C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,+BAA+B;IAC/B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gEAAgE;IAChE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wEAAwE;IACxE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uBAAuB;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,uBAAuB;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qCAAqC;IACrC,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAAc,CAAC"}

package/dist/lib/kernel/Text.cjs

@@ -0,0 +1,22 @@
+const require__displayNames = require("./_displayNames.cjs");
+//#region src/kernel/Text.tsx
+/**
+* Text 是 Node 内的"行级"标记组件——本身不渲染，
+* 由 buildIR 在扫描 Node children 时识别为 LineSpec。
+*
+* 和字符串 children 平等参与——String 按 `'\n'` 拆纯样式行；
+* `<Text>` 一次贡献一行带样式行；保持 JSX 顺序。
+*
+* 用法：
+* ```tsx
+* <Node>
+*   <Text fill="red" font={{ weight: 'bold' }}>Heading</Text>
+*   body line 1
+*   body line 2
+* </Node>
+* ```
+*/
+var Text = () => null;
+Text.displayName = require__displayNames.TIKZ_TEXT;
+//#endregion
+exports.Text = Text;

package/dist/lib/kernel/Text.d.ts

@@ -0,0 +1,31 @@
+import { FC } from 'react';
+import { IRFont } from '@retikz/core';
+/** <Text> 组件的 props——Node 多行文本里给某一行带覆盖样式 */
+export type TextProps = {
+    /** 行内容（必须是字符串） */
+    children: string;
+    /** 行级覆盖颜色；不填走 Node 块级默认 */
+    fill?: string;
+    /** 行级透明度 0~1；不填走 Node 块级默认 */
+    opacity?: number;
+    /** 行级字体覆盖；missing 字段继承 Node 的 `font` 块级值 */
+    font?: IRFont;
+};
+/**
+ * Text 是 Node 内的"行级"标记组件——本身不渲染，
+ * 由 buildIR 在扫描 Node children 时识别为 LineSpec。
+ *
+ * 和字符串 children 平等参与——String 按 `'\n'` 拆纯样式行；
+ * `<Text>` 一次贡献一行带样式行；保持 JSX 顺序。
+ *
+ * 用法：
+ * ```tsx
+ * <Node>
+ *   <Text fill="red" font={{ weight: 'bold' }}>Heading</Text>
+ *   body line 1
+ *   body line 2
+ * </Node>
+ * ```
+ */
+export declare const Text: FC<TextProps>;
+//# sourceMappingURL=Text.d.ts.map

package/dist/lib/kernel/Text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../../src/kernel/Text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAG3C,4CAA4C;AAC5C,MAAM,MAAM,SAAS,GAAG;IACtB,kBAAkB;IAClB,QAAQ,EAAE,MAAM,CAAC;IACjB,2BAA2B;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,8BAA8B;IAC9B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,4CAA4C;IAC5C,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAAc,CAAC"}

package/dist/lib/kernel/_builder.cjs

@@ -8,24 +8,102 @@ var getDisplayName = (el) => {
 	if (typeof t === "string") return t;
 	return t.displayName;
 };
-/** 把 <Node> props 翻成 IRChild；text 优先取 props.text，其次取字符串 children */
-var buildNode = (props) => {
-	const text = typeof props.text === "string" ? props.text : typeof props.children === "string" ? props.children : void 0;
+/**
+* 把 <Text> 元素的 props + children 串解析为 IRLineSpec 对象形式。
+* children 必须是 string；非字符串 children 静默跳过此 <Text> 元素。
+*/
+var textElementToLineSpec = (el) => {
+	const props = el.props;
+	if (typeof props.children !== "string") return void 0;
+	if (props.fill === void 0 && props.opacity === void 0 && props.font === void 0) return props.children;
 	return {
-		type: "node",
-		id: props.id,
-		shape: props.shape,
-		position: props.position,
-		rotate: props.rotate,
-		text,
+		text: props.children,
 		fill: props.fill,
-		stroke: props.stroke,
-		strokeWidth: props.strokeWidth,
-		padding: props.padding,
-		margin: props.margin,
-		fontSize: props.fontSize
+		opacity: props.opacity,
+		font: props.font
+	};
+};
+/**
+* 递归收集 Node children 中的行：
+* - 字符串按 `'\n'` 拆行（每段 → 字符串 LineSpec）
+* - 数组（JSX 多 child 自动展平）逐项递归
+* - <Text> 元素 → 对象 LineSpec（带覆盖样式）
+* - 其它类型（其它 React 元素 / null / 数字等）忽略——附带让 `<br/>` 当软分段
+*
+* 顺序保留——按 JSX 写的顺序行就是 IR 行顺序。
+*/
+var collectChildLines = (children) => {
+	const out = [];
+	const visit = (node) => {
+		if (typeof node === "string") {
+			for (const part of node.split("\n")) out.push(part);
+			return;
+		}
+		if (Array.isArray(node)) {
+			for (const c of node) visit(c);
+			return;
+		}
+		if ((0, react.isValidElement)(node) && getDisplayName(node) === "@retikz/Text") {
+			const spec = textElementToLineSpec(node);
+			if (spec !== void 0) out.push(spec);
+		}
 	};
+	visit(children);
+	return out;
+};
+/**
+* Node 文本读取顺序：
+* 1. `props.text`（string / string[] / LineSpec[]）— 显式优先，直接透传到 IR
+* 2. `props.children` — 字符串按 `'\n'` 拆行；`<Text>` 元素带样式贡献一行；保持 JSX 顺序
+*
+* 用 children 写多行的几种姿势：
+* - 字符串带换行：`<Node>{'Line 1\nLine 2'}</Node>`
+* - 模板字面量：``<Node>{`Line 1\nLine 2`}</Node>``
+* - 数组：`<Node>{['Line 1', 'Line 2']}</Node>`
+* - <Text>（带样式）：`<Node><Text fill="red">Heading</Text>body</Node>`
+*/
+var readNodeText = (props) => {
+	if (typeof props.text === "string") return props.text;
+	if (Array.isArray(props.text)) return props.text;
+	const lines = collectChildLines(props.children);
+	if (lines.length === 0) return void 0;
+	if (lines.length === 1 && typeof lines[0] === "string") return lines[0];
+	return lines;
 };
+/** 把 <Node> props 翻成 IRChild；text 优先取 props.text，其次取字符串 children */
+var buildNode = (props) => ({
+	type: "node",
+	id: props.id,
+	shape: props.shape,
+	position: props.position,
+	rotate: props.rotate,
+	text: readNodeText(props),
+	align: props.align,
+	lineHeight: props.lineHeight,
+	fill: props.fill,
+	fillOpacity: props.fillOpacity,
+	stroke: props.stroke,
+	drawOpacity: props.drawOpacity,
+	strokeWidth: props.strokeWidth,
+	dashed: props.dashed,
+	dotted: props.dotted,
+	dashArray: props.dashArray,
+	roundedCorners: props.roundedCorners,
+	minimumWidth: props.minimumWidth,
+	minimumHeight: props.minimumHeight,
+	minimumSize: props.minimumSize,
+	scale: props.scale,
+	xScale: props.xScale,
+	yScale: props.yScale,
+	textColor: props.textColor,
+	opacity: props.opacity,
+	innerXSep: props.innerXSep,
+	innerYSep: props.innerYSep,
+	outerSep: props.outerSep,
+	padding: props.padding,
+	margin: props.margin,
+	font: props.font
+});
 /**
 * 扫描 <Path> children 收集 <Step> 序列。
 * 至少 2 段；首段不是 move 时强制改为 move（与 SVG path 的 "M …" 语义对齐）；

package/dist/lib/kernel/_builder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"_builder.d.ts","sourceRoot":"","sources":["../../../src/kernel/_builder.ts"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,SAAS,EAAkB,MAAM,OAAO,CAAC;AACpF,OAAO,KAAK,EAAE,EAAE,EAA2B,MAAM,cAAc,CAAC;AAoIhE;;;GAGG;AACH,eAAO,MAAM,OAAO,GAAI,UAAU,SAAS,KAAG,EAI5C,CAAC"}
+{"version":3,"file":"_builder.d.ts","sourceRoot":"","sources":["../../../src/kernel/_builder.ts"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,SAAS,EAAkB,MAAM,OAAO,CAAC;AACpF,OAAO,KAAK,EAAE,EAAE,EAA+C,MAAM,cAAc,CAAC;AA6NpF;;;GAGG;AACH,eAAO,MAAM,OAAO,GAAI,UAAU,SAAS,KAAG,EAI5C,CAAC"}

package/dist/lib/kernel/_displayNames.cjs

@@ -5,7 +5,10 @@ var TIKZ_NODE = "@retikz/Node";
 var TIKZ_PATH = "@retikz/Path";
 /** <Step> 组件的 displayName */
 var TIKZ_STEP = "@retikz/Step";
+/** <Text> 组件的 displayName（Node 内多行文本带样式） */
+var TIKZ_TEXT = "@retikz/Text";
 //#endregion
 exports.TIKZ_NODE = TIKZ_NODE;
 exports.TIKZ_PATH = TIKZ_PATH;
 exports.TIKZ_STEP = TIKZ_STEP;
+exports.TIKZ_TEXT = TIKZ_TEXT;

package/dist/lib/kernel/_displayNames.d.ts

@@ -4,4 +4,6 @@ export declare const TIKZ_NODE = "@retikz/Node";
 export declare const TIKZ_PATH = "@retikz/Path";
 /** <Step> 组件的 displayName */
 export declare const TIKZ_STEP = "@retikz/Step";
+/** <Text> 组件的 displayName（Node 内多行文本带样式） */
+export declare const TIKZ_TEXT = "@retikz/Text";
 //# sourceMappingURL=_displayNames.d.ts.map

package/dist/lib/kernel/_displayNames.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"_displayNames.d.ts","sourceRoot":"","sources":["../../../src/kernel/_displayNames.ts"],"names":[],"mappings":"AAKA,6BAA6B;AAC7B,eAAO,MAAM,SAAS,iBAAiB,CAAC;AAExC,6BAA6B;AAC7B,eAAO,MAAM,SAAS,iBAAiB,CAAC;AAExC,6BAA6B;AAC7B,eAAO,MAAM,SAAS,iBAAiB,CAAC"}
+{"version":3,"file":"_displayNames.d.ts","sourceRoot":"","sources":["../../../src/kernel/_displayNames.ts"],"names":[],"mappings":"AAKA,6BAA6B;AAC7B,eAAO,MAAM,SAAS,iBAAiB,CAAC;AAExC,6BAA6B;AAC7B,eAAO,MAAM,SAAS,iBAAiB,CAAC;AAExC,6BAA6B;AAC7B,eAAO,MAAM,SAAS,iBAAiB,CAAC;AAExC,4CAA4C;AAC5C,eAAO,MAAM,SAAS,iBAAiB,CAAC"}

package/dist/lib/kernel/_unbuilder.cjs

@@ -10,12 +10,31 @@ var nodePropsFromIR = (n) => {
 	if (n.shape !== void 0) props.shape = n.shape;
 	if (n.rotate !== void 0) props.rotate = n.rotate;
 	if (n.text !== void 0) props.text = n.text;
-	if (n.fontSize !== void 0) props.fontSize = n.fontSize;
+	if (n.align !== void 0) props.align = n.align;
+	if (n.lineHeight !== void 0) props.lineHeight = n.lineHeight;
+	if (n.font !== void 0) props.font = n.font;
+	if (n.innerXSep !== void 0) props.innerXSep = n.innerXSep;
+	if (n.innerYSep !== void 0) props.innerYSep = n.innerYSep;
+	if (n.outerSep !== void 0) props.outerSep = n.outerSep;
 	if (n.padding !== void 0) props.padding = n.padding;
 	if (n.margin !== void 0) props.margin = n.margin;
 	if (n.fill !== void 0) props.fill = n.fill;
+	if (n.fillOpacity !== void 0) props.fillOpacity = n.fillOpacity;
 	if (n.stroke !== void 0) props.stroke = n.stroke;
+	if (n.drawOpacity !== void 0) props.drawOpacity = n.drawOpacity;
 	if (n.strokeWidth !== void 0) props.strokeWidth = n.strokeWidth;
+	if (n.dashed !== void 0) props.dashed = n.dashed;
+	if (n.dotted !== void 0) props.dotted = n.dotted;
+	if (n.dashArray !== void 0) props.dashArray = n.dashArray;
+	if (n.roundedCorners !== void 0) props.roundedCorners = n.roundedCorners;
+	if (n.minimumWidth !== void 0) props.minimumWidth = n.minimumWidth;
+	if (n.minimumHeight !== void 0) props.minimumHeight = n.minimumHeight;
+	if (n.minimumSize !== void 0) props.minimumSize = n.minimumSize;
+	if (n.scale !== void 0) props.scale = n.scale;
+	if (n.xScale !== void 0) props.xScale = n.xScale;
+	if (n.yScale !== void 0) props.yScale = n.yScale;
+	if (n.textColor !== void 0) props.textColor = n.textColor;
+	if (n.opacity !== void 0) props.opacity = n.opacity;
 	return props;
 };
 /** 单个 IRStep → <Step /> element */

package/dist/lib/kernel/_unbuilder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"_unbuilder.d.ts","sourceRoot":"","sources":["../../../src/kernel/_unbuilder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAiB,MAAM,OAAO,CAAC;AACtD,OAAO,KAAK,EAAE,EAAE,EAA2B,MAAM,cAAc,CAAC;AA2DhE;;;;;;GAMG;AACH,eAAO,MAAM,oBAAoB,GAAI,IAAI,EAAE,KAAG,SACW,CAAC"}
+{"version":3,"file":"_unbuilder.d.ts","sourceRoot":"","sources":["../../../src/kernel/_unbuilder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAiB,MAAM,OAAO,CAAC;AACtD,OAAO,KAAK,EAAE,EAAE,EAA2B,MAAM,cAAc,CAAC;AA8EhE;;;;;;GAMG;AACH,eAAO,MAAM,oBAAoB,GAAI,IAAI,EAAE,KAAG,SACW,CAAC"}

package/dist/lib/kernel/index.cjs

@@ -2,3 +2,4 @@ require("./Tikz.cjs");
 require("./Node.cjs");
 require("./Path.cjs");
 require("./Step.cjs");
+require("./Text.cjs");

package/dist/lib/kernel/index.d.ts

@@ -2,4 +2,5 @@ export * from './Tikz';
 export * from './Node';
 export * from './Path';
 export * from './Step';
+export * from './Text';
 //# sourceMappingURL=index.d.ts.map

package/dist/lib/kernel/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/kernel/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/kernel/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC"}

package/dist/lib/render/renderPrim.cjs

@@ -25,6 +25,7 @@ var renderPrim = (p, key, ctx = {}) => {
 			fill: p.fill,
 			fillOpacity: p.fillOpacity,
 			stroke: p.stroke,
+			strokeOpacity: p.strokeOpacity,
 			strokeWidth: p.strokeWidth,
 			strokeDasharray: p.strokeDasharray,
 			rx: p.cornerRadius,
@@ -42,32 +43,49 @@ var renderPrim = (p, key, ctx = {}) => {
 				fill: p.fill,
 				fillOpacity: p.fillOpacity,
 				stroke: p.stroke,
+				strokeOpacity: p.strokeOpacity,
 				strokeWidth: p.strokeWidth,
 				strokeDasharray: p.strokeDasharray,
 				opacity: p.opacity
 			}, key);
 		}
-		case "text": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
-			x: p.x,
-			y: p.y,
-			fontSize: p.fontSize,
-			fontFamily: p.fontFamily,
-			fontWeight: p.fontWeight,
-			fontStyle: p.fontStyle,
-			textAnchor: alignToAnchor(p.align),
-			dominantBaseline: baselineToDominant(p.baseline),
-			fill: p.fill,
-			opacity: p.opacity,
-			children: p.content
-		}, key);
+		case "text": {
+			const n = p.lines.length;
+			const firstDy = p.baseline === "middle" ? -(n - 1) / 2 * p.lineHeight : p.baseline === "bottom" ? -(n - 1) * p.lineHeight : 0;
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
+				x: p.x,
+				y: p.y,
+				fontSize: p.fontSize,
+				fontFamily: p.fontFamily,
+				fontWeight: p.fontWeight,
+				fontStyle: p.fontStyle,
+				textAnchor: alignToAnchor(p.align),
+				dominantBaseline: baselineToDominant(p.baseline),
+				fill: p.fill,
+				opacity: p.opacity,
+				children: p.lines.map((line, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tspan", {
+					x: p.x,
+					dy: i === 0 ? firstDy : p.lineHeight,
+					fill: line.fill,
+					opacity: line.opacity,
+					fontSize: line.fontSize,
+					fontFamily: line.fontFamily,
+					fontWeight: line.fontWeight,
+					fontStyle: line.fontStyle,
+					children: line.text
+				}, i))
+			}, key);
+		}
 		case "path": {
 			const startId = p.arrowStart && ctx.arrowMarkerIdFor ? ctx.arrowMarkerIdFor(p.arrowStart) : void 0;
 			const endId = p.arrowEnd && ctx.arrowMarkerIdFor ? ctx.arrowMarkerIdFor(p.arrowEnd) : void 0;
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
 				d: p.d,
 				fill: p.fill,
+				fillOpacity: p.fillOpacity,
 				fillRule: p.fillRule,
 				stroke: p.stroke,
+				strokeOpacity: p.strokeOpacity,
 				strokeWidth: p.strokeWidth,
 				strokeDasharray: p.strokeDasharray,
 				strokeLinecap: p.strokeLinecap,

package/dist/lib/render/renderPrim.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"renderPrim.d.ts","sourceRoot":"","sources":["../../../src/render/renderPrim.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AA6B/D;;;GAGG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B,iDAAiD;IACjD,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,MAAM,CAAC;CAClD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,UAAU,GACrB,GAAG,cAAc,EACjB,KAAK,GAAG,EACR,MAAK,aAAkB,KACtB,YAsFF,CAAC"}
+{"version":3,"file":"renderPrim.d.ts","sourceRoot":"","sources":["../../../src/render/renderPrim.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AA6B/D;;;GAGG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B,iDAAiD;IACjD,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,MAAM,CAAC;CAClD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,UAAU,GACrB,GAAG,cAAc,EACjB,KAAK,GAAG,EACR,MAAK,aAAkB,KACtB,YAqHF,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@retikz/react",
-  "version": "0.1.0-alpha.1",
+  "version": "0.1.0-alpha.2",
   "description": "React adapter for retikz: Kernel/Sugar JSX components and SVG renderer.",
   "type": "module",
   "main": "dist/lib/index.cjs",
@@ -24,7 +24,7 @@
     "react-dom": ">=18"
   },
   "dependencies": {
-    "@retikz/core": "0.1.0-alpha.1"
+    "@retikz/core": "0.1.0-alpha.2"
   },
   "devDependencies": {
     "@types/node": "^25.6.0",