@dongmingzhixiu/vuexir-compiler 0.5.3 → 0.5.5

package/dist/codegen/compose.js

@@ -1542,9 +1542,16 @@ function parseRouter(src, dir, routerFile) {
         }
         return cands.find((c) => existsSync(c)) ?? cands[0];
     };
-    // 配平扫描所有「含 path:」的对象块
+    // 配平扫描所有「含 path:」的对象块（从 routes: [...] 数组起点开始，避免把 createRouter 顶层对象整块当路由）
     const blocks = [];
-    for (let i = 0; i < src.length; i += 1) {
+    let scanFrom = 0;
+    const routesMarker = src.indexOf('routes:');
+    if (routesMarker !== -1) {
+        const arrIdx = src.indexOf('[', routesMarker);
+        if (arrIdx !== -1)
+            scanFrom = arrIdx;
+    }
+    for (let i = scanFrom; i < src.length; i += 1) {
         if (src[i] !== '{')
             continue;
         let depth = 0;
@@ -1609,7 +1616,7 @@ function parseRouter(src, dir, routerFile) {
     }
     const hasText = (file) => {
         if (!file || !existsSync(file))
-            return true;
+            return false;
         const tpl = readFileSync(file, 'utf-8').match(/<template>([\s\S]*)<\/template>/)?.[1] ?? '';
         return tpl.replace(/<[^>]*>/g, ' ').replace(/\s+/g, ' ').trim().length > 0;
     };
@@ -1623,7 +1630,7 @@ function parseRouter(src, dir, routerFile) {
         path: r.path,
     }));
     const details = routes
-        .filter((r) => r.meta.tab !== 'true')
+        .filter((r) => r.meta.tab !== 'true' && hasText(r.file))
         .map((r) => ({ id: r.name, title: r.meta.title ?? r.name, file: r.file, path: r.path }));
     if (tabs.length === 0) {
         warnings.push('router 未解析到任何 tab 路由（routes 需含 meta: { tab: true }）');

package/dist/codegen/swiftui.d.ts

@@ -49,6 +49,7 @@ export declare function generateScreenSource(screen: IrScreen, opts?: {
         colorNames: Map<string, string>;
         fontNames: Map<string, string>;
     };
+    cssVars?: Map<string, string>;
     /** M4a 多页：页面运行时引用（默认 Runtime.shared 单例；多页传 Runtime.forPage("<id>") 隔离 JS 上下文） */
     runtime?: string;
     /** M4b Tabs：状态提升到容器（页面用 @Binding、不生成 onAppear；绑定+onMounted 由容器统一驱动） */
@@ -68,4 +69,5 @@ export declare function generateComponentSource(name: string, ui: IrNode, opts?:
         colorNames: Map<string, string>;
         fontNames: Map<string, string>;
     };
+    cssVars?: Map<string, string>;
 }): string;

package/dist/codegen/swiftui.js

@@ -22,7 +22,18 @@
  * flex 仅支持容器主轴方向的 maxHeight/maxWidth:.infinity。
  */
 /* ============ 颜色表达式 ============ */
+let currentCssVars;
 function parseColor(c) {
+    const trimmed = c.trim();
+    if (trimmed.startsWith('var(')) {
+        const m = trimmed.match(/^var\(\s*(--[\w-]+)/);
+        if (m && currentCssVars) {
+            const val = currentCssVars.get(m[1]);
+            if (val !== undefined)
+                return parseColor(val);
+        }
+        return { r: 0, g: 0, b: 0, a: 1 };
+    }
     if (c.startsWith('#')) {
         let hex = c.slice(1);
         if (hex.length === 3)
@@ -276,6 +287,7 @@ function toSwiftIdentifier(id) {
 const FW_MAP = { normal: '.regular', medium: '.medium', bold: '.bold' };
 const ALIGN_MAP = { start: '.leading', center: '.center', end: '.trailing', left: '.leading', right: '.trailing' };
 const FLEX_START_MAP = { start: '.leading', center: '.center', end: '.trailing' };
+const V_ALIGN_MAP = { start: '.top', center: '.center', end: '.bottom' };
 /** R-H：节点自身高度是否确定（数字 height / height:'fill'；或 flex 子项且父链确定） */
 function heightDefinite(props, parentDefinite) {
     // 'fill' = 撑满父高（root 高度固定，fill 仅出现在 root 内层包裹 → 高度确定链成立）
@@ -516,10 +528,15 @@ function emitNode(node, ctx) {
 }
 /** JS 条件表达式 → Swift 兼容：===/!== 为 JS 严格比较，Swift 用 ==/!=；字符串字面量单引号 → 双引号 */
 function swiftCondExpr(expr, known) {
-    // R128：下沉的条件状态 → 判真
+    // R128：下沉的条件状态 → 判真；不在已知集（组件/无状态上下文）→ true 保留内容
     const sunk = expr.match(/^__vrnCond:(\w+)$/);
-    if (sunk)
-        return `vrnTruthy(${sunk[1]})`;
+    if (sunk) {
+        const nm = sunk[1];
+        const kset = known && known.size > 0 ? known : currentStateNames;
+        if (kset && kset.size > 0 && !kset.has(nm))
+            return 'true';
+        return `vrnTruthy(${nm})`;
+    }
     // R114：条件引用原生端不存在的标识符 → true（保留内容），避免整页编译失败
     const knownSet = known && known.size > 0 ? known : currentStateNames;
     if (knownSet && knownSet.size > 0) {
@@ -735,7 +752,7 @@ function emitNodeInner(node, ctx) {
             // CSS align-items 默认 stretch（子项拉伸到容器交叉轴全宽），SwiftUI VStack 无 stretch
             // → 子项显式 .frame(maxWidth:.infinity) 实现（内容仍左对齐）
             const alignRaw = props.alignItems ?? 'stretch';
-            const align = isRow ? (ALIGN_MAP[alignRaw] ?? '.top') : (FLEX_START_MAP[alignRaw] ?? '.leading');
+            const align = isRow ? (V_ALIGN_MAP[alignRaw] ?? '.top') : (FLEX_START_MAP[alignRaw] ?? '.leading');
             const stack = hasAbsolute ? 'ZStack' : isRow ? 'HStack' : 'VStack';
             const stackAlign = hasAbsolute ? '.topLeading' : align;
             // R132：ZStack 里必须把「非绝对定位」的兄弟包成一个流式子容器，
@@ -881,7 +898,7 @@ function emitNodeInner(node, ctx) {
             // M3：onSet 内联赋值后推送 stateStore（JS 侧状态同步，供 handler 读取）
             if (props.onSet || props.onClick) {
                 // R-VFOBJ：onClick 含循环变量字段（router.push(item.path)）→ Swift 内联展开（JS 无 item 作用域）
-                const loopAction = props.onClick ? loopClickAction(props.onClick, ctx.loop) : null;
+                const loopAction = props.onClick ? loopClickAction(props.onClick, ctx.loop, ctx.runtime) : null;
                 const action = props.onSet
                     ? `action: { ${props.onSet.var} = ${props.onSet.kind === 'expr'
                         ? String(props.onSet.value)
@@ -1117,7 +1134,7 @@ function emitNodeInner(node, ctx) {
             // 需 maxWidth:.infinity 以在父容器占满宽（组件 View 默认大小=内容）——父 row/column 的
             // alignItems:stretch 语义由使用点 frame 承担；组件根自身不携带布局。
             if (props.onClick) {
-                const loopAction = loopClickAction(props.onClick, ctx.loop);
+                const loopAction = loopClickAction(props.onClick, ctx.loop, ctx.runtime);
                 const action = loopAction
                     ? `action: { ${loopAction} }`
                     : `action: { ${ctx.runtime}.invoke("${swiftStringEscape(props.onClick)}") }`;
@@ -1151,6 +1168,13 @@ function emitNodeInner(node, ctx) {
             }));
             let body;
             if (vf.listState) {
+                // 组件/无状态上下文：_vrnE# 下沉状态不可求值 → 空 ForEach（编译保底，不渲染该项）
+                const knownS = ctx.stateNames && ctx.stateNames.size > 0 ? ctx.stateNames : currentStateNames;
+                const unresolved = /^_vrnE\d+$/.test(vf.listState) && (!knownS || !knownS.has(vf.listState));
+                if (unresolved) {
+                    ctx.warnings.push(`${ctx.path}: v-for 数据源「${vf.listState}」原生端不可求值（组件内无状态上下文），该项已置空`);
+                    return 'EmptyView()';
+                }
                 // 动态列表：解码失败或空数组时保持空（ForEach 不渲染）；if 语句不能直接挂修饰符 → Group 包裹
                 body =
                     `Group {\n` +
@@ -1259,6 +1283,7 @@ export function generateScreenSource(screen, opts = {}) {
     currentColorNames = opts.theme?.colorNames;
     currentFontNames = opts.theme?.fontNames;
     currentFrameShort = opts.theme !== undefined;
+    currentCssVars = opts.cssVars;
     currentStateTypes = Object.fromEntries((screen.state ?? []).map((s) => [
         s.name,
         typeof s.init === 'string' ? 'string' : typeof s.init === 'boolean' ? 'boolean' : 'number',
@@ -1383,6 +1408,10 @@ function actionExpr(props, ctx) {
         return `{ ${props.onSet.var} = ${lit}; ${ctx.runtime}.pushState("${props.onSet.var}", ${props.onSet.var}) }`;
     }
     if (props.onClick !== undefined) {
+        // R-LOOPITEM：onTapGesture 路径同样支持循环变量（row 只在 Swift 闭包作用域）
+        const loopAction = loopClickAction(props.onClick, ctx.loop, ctx.runtime);
+        if (loopAction)
+            return `{ ${loopAction} }`;
         return `{ ${ctx.runtime}.invoke("${swiftStringEscape(props.onClick)}") }`;
     }
     return undefined;
@@ -1390,22 +1419,51 @@ function actionExpr(props, ctx) {
 /** R-VFOBJ：onClick 表达式含循环变量字段 → 返回 Swift 内联 action 体；否则 null。
  *  支持 router.push(item.path) → Runtime.routerPushHandler?(item["path"] ?? "")；
  *  其他含循环字段表达式不支持（warning 由调用方给出）。 */
-function loopClickAction(onClick, loop) {
+function loopClickAction(onClick, loop, runtime) {
     if (!loop)
         return null;
-    const re = new RegExp(`${loop.itemKey}\\.([A-Za-z_][\\w$]*)`, 'g');
+    const itemKey = loop.itemKey;
+    const re = new RegExp(`${itemKey}\\.([A-Za-z_][\\w$]*)`, 'g');
     if (!re.test(onClick))
         return null;
     const m = onClick.match(/^router\.push\((.*)\)$/s);
-    if (!m)
-        return null;
-    const arg = m[1].replace(re, `${loop.itemKey}["$1"] ?? ""`);
-    return `Runtime.routerPushHandler?(${arg})`;
+    if (m) {
+        const arg = m[1].replace(re, `${loop.itemKey}["$1"] ?? ""`);
+        return `Runtime.routerPushHandler?(${arg})`;
+    }
+    // R-LOOPITEM：非 router.push 且引用循环变量（goDetail(row.item.id)）——
+    // row 只在 Swift ForEach 闭包作用域，JS 全局不存在 → 先注入 __vrnLoop 再 invoke
+    const replaced = onClick.replace(re, '__vrnLoop.$1');
+    return `${runtime}.setLoopItem(${itemKey}); ${runtime}.invoke("${swiftStringEscape(replaced)}")`;
 }
 /** 收集组件 IR 树中所有 text ref → prop 名（组件 View 的 let 属性集合） */
+/** 表达式 → 根标识符（dialog.title → dialog；!allOpen → allOpen；__vrnField__:dialog:title → dialog；下沉条件 → ''） */
+function rootIdent(expr) {
+    const e = expr.replace(/^!/, '');
+    const f = e.match(/^__vrnField__:(\w+)/);
+    if (f)
+        return f[1];
+    if (e.startsWith('__vrnCond:') || e.startsWith('__vrnField__:'))
+        return '';
+    const id = e.match(/^([A-Za-z_$][\w$]*)/);
+    return id ? id[1] : '';
+}
 function collectRefs(node, out) {
-    if (node.type === 'text' && node.props?.ref !== undefined)
-        out.add(node.props.ref);
+    if (node.type === 'text' && node.props?.ref !== undefined) {
+        const r = rootIdent(node.props.ref);
+        if (r)
+            out.add(r);
+    }
+    if (node.condition) {
+        const r = rootIdent(node.condition);
+        if (r)
+            out.add(r);
+    }
+    if (node.type === 'for' && node.vfor?.listState && !/^_vrnE\d+$/.test(node.vfor.listState)) {
+        const r = rootIdent(node.vfor.listState);
+        if (r)
+            out.add(r);
+    }
     for (const c of node.children ?? [])
         collectRefs(c, out);
     return out;
@@ -1425,7 +1483,9 @@ export function generateComponentSource(name, ui, opts = {}) {
         currentFrameShort = true;
         currentStateTypes = {};
     }
+    currentCssVars = opts.cssVars;
     const props = collectRefs(ui, new Set());
+    currentStateNames = props; // 组件上下文：已知标识符 = props（清掉页面残留 state 名，下沉条件正确降级）
     const dataProps = [];
     const body = emitNode(ui, {
         parentAxis: 'column',
@@ -1435,6 +1495,7 @@ export function generateComponentSource(name, ui, opts = {}) {
         warnings,
         path: `${name}View.body`,
         dataProps,
+        stateNames: props, // 组件已知标识符 = props 集合（v-if/v-for 下沉状态不在内 → 降级 true）
     });
     const propDecls = [...props]
         .map((p) => `    let ${p}: String`)

package/dist/ir/schema.js

@@ -24,7 +24,8 @@ export const NODE_TYPES = [
 const HEX_COLOR = /^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/;
 const RGB_COLOR = /^rgba?\(\s*\d{1,3}\s*,\s*\d{1,3}\s*,\s*\d{1,3}(?:\s*,\s*[\d.]+)?\s*\)$/;
 function isColor(v) {
-    return typeof v === 'string' && (HEX_COLOR.test(v) || RGB_COLOR.test(v));
+    return (typeof v === 'string' &&
+        (HEX_COLOR.test(v) || RGB_COLOR.test(v) || /^var\([^)]*\)$/.test(v.trim())));
 }
 function isSize(v) {
     return v === 'fill' || v === 'auto' || (typeof v === 'number' && v >= 0 && Number.isFinite(v));
@@ -116,14 +117,14 @@ const PROPS_VALIDATORS = {
 const NODE_ALLOWED_PROPS = {
     root: ['width', 'height', 'background'],
     group: ['width', 'height', 'padding', 'gap', 'flex', 'flexDirection', 'justifyContent', 'alignItems', 'background', 'radius', 'borderWidth', 'borderColor', 'marginTopAuto', 'marginTop', 'marginLeftAuto', 'marginBottom', 'marginRight', 'marginLeft', 'borderSides', 'clip', 'onClick', 'onSet', 'position', 'absTop', 'absLeft', 'absRight', 'absBottom', 'transform', 'show', 'opacity', 'gridColumns'],
-    text: ['width', 'text', 'ref', 'bind', 'bindExpr', 'dynField', 'bindParts', 'fontSize', 'fontWeight', 'textAlign', 'lineHeight', 'color', 'padding', 'colorActive', 'marginLeftAuto', 'marginTop', 'colorDynamic', 'fontSizeDynamic', 'position', 'absTop', 'absLeft', 'absRight', 'absBottom', 'transform', 'show', 'flex', 'opacity', 'onClick', 'onSet', 'fieldOf'],
+    text: ['width', 'text', 'ref', 'bind', 'bindExpr', 'dynField', 'bindParts', 'fontSize', 'fontWeight', 'textAlign', 'lineHeight', 'color', 'padding', 'background', 'colorActive', 'marginLeftAuto', 'marginTop', 'colorDynamic', 'fontSizeDynamic', 'position', 'absTop', 'absLeft', 'absRight', 'absBottom', 'transform', 'show', 'flex', 'opacity', 'onClick', 'onSet', 'fieldOf'],
     image: ['width', 'height', 'src', 'objectFit', 'radius', 'borderSides', 'borderWidth', 'borderColor', 'clip', 'flex', 'marginTop', 'marginBottom', 'marginRight', 'marginLeft', 'position', 'absTop', 'absLeft', 'absRight', 'absBottom', 'transform', 'show', 'opacity'],
     button: ['width', 'height', 'label', 'bind', 'background', 'radius', 'borderWidth', 'borderColor', 'fontSize', 'fontWeight', 'color', 'flex', 'padding', 'marginTopAuto', 'marginTop', 'marginBottom', 'marginRight', 'marginLeft', 'borderSides', 'clip', 'onClick', 'onSet', 'colorDynamic', 'fontSizeDynamic', 'position', 'absTop', 'absLeft', 'absRight', 'absBottom', 'transform', 'show', 'pressBg', 'opacity'],
     input: ['width', 'height', 'value', 'placeholder', 'fontSize', 'color', 'background', 'padding', 'radius', 'borderWidth', 'borderColor', 'borderSides', 'clip', 'flex', 'marginTop', 'marginTopAuto', 'marginBottom', 'marginRight', 'marginLeft', 'onSet', 'colorDynamic', 'fontSizeDynamic', 'position', 'absTop', 'absLeft', 'absRight', 'absBottom', 'transform', 'show'],
-    scroll: ['width', 'height', 'padding', 'gap', 'flexDirection', 'background', 'showsIndicators', 'flex'],
-    spacer: ['width', 'height', 'flex'],
-    divider: ['width', 'height', 'background', 'borderWidth', 'borderColor', 'marginTop'],
-    component: ['name', 'attrs', 'flex', 'width', 'height', 'marginTop', 'marginTopAuto', 'marginLeftAuto', 'onClick'],
+    scroll: ['width', 'height', 'padding', 'gap', 'flexDirection', 'background', 'showsIndicators', 'flex', 'justifyContent', 'alignItems', 'radius', 'borderWidth', 'borderColor', 'marginTop', 'position', 'absTop', 'absLeft', 'absRight', 'absBottom', 'transform', 'show', 'opacity', 'borderSides', 'clip'],
+    spacer: ['width', 'height', 'flex', 'background', 'padding', 'radius', 'borderWidth', 'borderColor', 'marginTop', 'alignSelf', 'opacity'],
+    divider: ['width', 'height', 'background', 'borderWidth', 'borderColor', 'marginTop', 'marginBottom', 'marginLeft', 'marginRight', 'padding', 'radius', 'flex', 'opacity', 'position', 'absTop', 'absLeft', 'absRight', 'absBottom', 'transform', 'show'],
+    component: ['name', 'attrs', 'flex', 'width', 'height', 'marginTop', 'marginTopAuto', 'marginLeftAuto', 'marginBottom', 'marginLeft', 'marginRight', 'background', 'radius', 'borderWidth', 'borderColor', 'padding', 'position', 'absTop', 'absLeft', 'absRight', 'absBottom', 'transform', 'show', 'opacity', 'onClick'],
     for: ['flexDirection', 'gap', 'padding', 'background', 'flex', 'width', 'height', 'showsIndicators', 'borderSides', 'clip', 'position', 'absTop', 'absLeft', 'absRight', 'absBottom', 'transform', 'show'],
 };
 /** 必须有 children 的节点 */

package/dist/transform/css.js

@@ -25,6 +25,8 @@ const num = (v) => {
 /** 与 schema isColor 同源的 CSS 颜色校验：仅 #rgb / #rrggbb / rgb[a]() / hsl[a]()（named/var() 原生端不可解析，拒绝） */
 function isCssColor(v) {
     const s = v.trim();
+    if (/^var\([^)]*\)$/.test(s))
+        return true; // CSS 变量（含 fallback 形态）：值留给 codegen 按项目 tokens 解析
     if (/^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(s))
         return true;
     if (/^rgba?\(\s*[\d.]+%?\s*,\s*[\d.]+%?\s*,\s*[\d.]+%?\s*(,\s*([\d.]+%?|0))?\s*\)$/.test(s))

package/dist/transform/vue2ir.js

@@ -1747,9 +1747,15 @@ function walkElement(node, classProps, comboRules, scopedRules, pseudoRules, war
                 const expr = gm[3].trim();
                 // Vue3 语义：`v-for="i in 3"` 迭代 1..3
                 const rangeM = expr.match(/^(\d+)$/);
+                // R143：数据源可能是数组、数值（v-for="i in total" 迭代 1..N）或 props 字符串，
+                // 用运行时自适应表达式兜住全部形态
                 const sunk = addJsExprState(rangeM
                     ? `JSON.stringify(Array.from({ length: ${rangeM[1]} }, function (_, i) { return i + 1; }))`
-                    : `JSON.stringify(${expr})`);
+                    : `JSON.stringify((function (v) {` +
+                        ` if (Array.isArray(v)) return v;` +
+                        ` var n = Number(v);` +
+                        ` if (!isNaN(n) && n > 0) return Array.from({ length: n }, function (_, i) { return i + 1; });` +
+                        ` return []; })(${expr}))`);
                 vf = {
                     listState: sunk,
                     itemKey: (gm[1] ? gm[1].split(',')[0] : gm[2]).trim(),
@@ -1763,10 +1769,17 @@ function walkElement(node, classProps, comboRules, scopedRules, pseudoRules, war
         }
         // M4b：动态列表数据源必须已声明为 ref 数组状态（编译期校验，防悬空引用）
         // 表达式下沉产生的状态（_vrnE*）在 walk 之后才并入页面状态，这里放行
+        // R143：未声明的数据源（组件 props / 数值 / 未注册变量）→ 运行时自适应下沉，不再整页失败
         if (vf.listState &&
             !/^_vrnE\d+$/.test(vf.listState) &&
-            !(state && state.states.some((s) => s.name === vf.listState))) {
-            throw new VueCompileError(`v-for 动态数据源「${vf.listState}」未在 <script setup> 中声明为 ref 数组（M4b）`);
+            !(state && state.states.some((s) => s.name === vf.listState)) &&
+            propRefs === undefined // 页面模式才下沉；组件模式（Set 存在，含空）保留数据源原名
+        ) {
+            const srcName = vf.listState;
+            const sunk2 = addJsExprState(`JSON.stringify((function (v) { if (Array.isArray(v)) return v; var n = Number(v); ` +
+                `if (!isNaN(n) && n > 0) return Array.from({ length: n }, function (_, i) { return i + 1; }); return []; })(${srcName}))`);
+            warnings.push(`v-for 数据源「${srcName}」未声明为状态 → 已在运行时自适应求值（R143）`);
+            vf.listState = sunk2;
         }
         const innerNode = { ...node, props: node.props.filter((p) => !(p.type === NodeTypes.DIRECTIVE && p.name === 'for')) };
         activeLoops.push({ itemKey: vf.itemKey, indexKey: vf.indexKey });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dongmingzhixiu/vuexir-compiler",
-  "version": "0.5.3",
+  "version": "0.5.5",
   "description": "Vue SFC → IR → 原生源码（SwiftUI / Compose）编译器核心：纯函数、零 IO",
   "type": "module",
   "license": "MIT",