@dongmingzhixiu/vuexir-compiler 0.7.2 → 0.7.4

package/dist/codegen/swiftui.js

@@ -463,6 +463,9 @@ function capsuleColorExpr(c) {
 }
 export function boxModifiers(props) {
     const mods = [];
+    if (props.aspectRatio !== undefined) {
+        mods.push(`.aspectRatio(${props.aspectRatio}, contentMode: .fit)`);
+    }
     if (props.gradient) {
         const a = props.gradient.angle * Math.PI / 180;
         const x = Math.sin(a) / 2, y = -Math.cos(a) / 2;
@@ -700,6 +703,9 @@ function emitNodeInner(node, ctx) {
     const size = sizeModifiers(props, axis, ctx);
     let padMods = paddingModifiers(props);
     let boxMods = boxModifiers(props);
+    if (node.type === 'image' && props.objectFit === 'cover' && !props.clip) {
+        boxMods.unshift('.clipped()');
+    }
     // R44：胶囊标签（大圆角+同色背景描边+对称 padding）→ 单次 .tagCapsule(...)
     const capsule = currentFrameShort && isCapsule(props, padMods) ? capsuleExpr(props) : undefined;
     if (capsule !== undefined) {
@@ -1258,8 +1264,6 @@ function emitNodeInner(node, ctx) {
             return line + box.map((m) => ' ' + m).join('');
         }
         case 'vector':
-            if (props.aspectRatio)
-                box.unshift(`.aspectRatio(${props.aspectRatio}, contentMode: .fit)`);
             return pad(swiftVector(props, colorExpr, (name) => swiftBoundValue(name, ctx.runtime)).split('\n').join('\n' + indent(L))) + box.map((m) => ' ' + m).join('');
         case 'image': {
             const source = props.src ?? '';

package/dist/ir/schema.js

@@ -138,11 +138,11 @@ const PROPS_VALIDATORS = {
 /** 各节点允许的 props 键（P0 最小集，防 Taro 化：未知 prop 即报错） */
 const NODE_ALLOWED_PROPS = {
     root: ['minWidth', 'minHeight', 'gradient', 'shadow', 'width', 'height', 'background'],
-    group: ['flexWrap', 'alignSelf', 'widthFraction', 'widthFractionDynamic', 'zIndex', 'widthDynamic', 'heightDynamic', 'minWidth', 'minHeight', 'gradient', 'shadow', '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: ['alignSelf', 'widthFraction', 'widthFractionDynamic', 'textRuns', 'zIndex', 'fontFamily', 'widthDynamic', 'heightDynamic', 'letterSpacing', 'minWidth', 'minHeight', 'gradient', 'shadow', 'height', 'radius', 'borderWidth', 'borderColor', 'borderSides', 'clip', 'marginBottom', 'marginRight', 'marginLeft', 'width', 'text', 'ref', 'bind', 'bindExpr', 'dynField', 'bindParts', 'fontSize', 'fontWeight', 'textAlign', 'lineHeight', 'lineHeightMultiplier', 'color', 'padding', 'background', 'colorActive', 'marginLeftAuto', 'marginTop', 'colorDynamic', 'fontSizeDynamic', 'position', 'absTop', 'absLeft', 'absRight', 'absBottom', 'transform', 'show', 'flex', 'opacity', 'onClick', 'onSet', 'fieldOf'],
+    group: ['aspectRatio', 'flexWrap', 'alignSelf', 'widthFraction', 'widthFractionDynamic', 'zIndex', 'widthDynamic', 'heightDynamic', 'minWidth', 'minHeight', 'gradient', 'shadow', '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: ['aspectRatio', 'alignSelf', 'widthFraction', 'widthFractionDynamic', 'textRuns', 'zIndex', 'fontFamily', 'widthDynamic', 'heightDynamic', 'letterSpacing', 'minWidth', 'minHeight', 'gradient', 'shadow', 'height', 'radius', 'borderWidth', 'borderColor', 'borderSides', 'clip', 'marginBottom', 'marginRight', 'marginLeft', 'width', 'text', 'ref', 'bind', 'bindExpr', 'dynField', 'bindParts', 'fontSize', 'fontWeight', 'textAlign', 'lineHeight', 'lineHeightMultiplier', 'color', 'padding', 'background', 'colorActive', 'marginLeftAuto', 'marginTop', 'colorDynamic', 'fontSizeDynamic', 'position', 'absTop', 'absLeft', 'absRight', 'absBottom', 'transform', 'show', 'flex', 'opacity', 'onClick', 'onSet', 'fieldOf'],
     vector: ['aspectRatio', 'widthFraction', 'widthFractionDynamic', 'zIndex', 'widthDynamic', 'heightDynamic', 'vector', 'width', 'height', 'flex', 'color', 'opacity', 'padding', 'marginTop', 'marginRight', 'marginBottom', 'marginLeft', 'position', 'absTop', 'absLeft', 'absRight', 'absBottom', 'transform', 'show', 'onClick'],
-    image: ['widthFraction', 'widthFractionDynamic', 'zIndex', 'widthDynamic', 'heightDynamic', 'padding', 'background', 'onClick', 'onSet', 'minWidth', 'minHeight', 'gradient', 'shadow', 'width', 'height', 'src', 'objectFit', 'radius', 'borderSides', 'borderWidth', 'borderColor', 'clip', 'flex', 'marginTop', 'marginBottom', 'marginRight', 'marginLeft', 'position', 'absTop', 'absLeft', 'absRight', 'absBottom', 'transform', 'show', 'opacity'],
-    button: ['alignSelf', 'widthFraction', 'widthFractionDynamic', 'icon', 'fontFamily', 'letterSpacing', 'zIndex', 'widthDynamic', 'heightDynamic', 'marginLeftAuto', 'minWidth', 'minHeight', 'gradient', 'shadow', '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'],
+    image: ['aspectRatio', 'widthFraction', 'widthFractionDynamic', 'zIndex', 'widthDynamic', 'heightDynamic', 'padding', 'background', 'onClick', 'onSet', 'minWidth', 'minHeight', 'gradient', 'shadow', 'width', 'height', 'src', 'objectFit', 'radius', 'borderSides', 'borderWidth', 'borderColor', 'clip', 'flex', 'marginTop', 'marginBottom', 'marginRight', 'marginLeft', 'position', 'absTop', 'absLeft', 'absRight', 'absBottom', 'transform', 'show', 'opacity'],
+    button: ['aspectRatio', 'alignSelf', 'widthFraction', 'widthFractionDynamic', 'icon', 'fontFamily', 'letterSpacing', 'zIndex', 'widthDynamic', 'heightDynamic', 'marginLeftAuto', 'minWidth', 'minHeight', 'gradient', 'shadow', '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: ['widthFraction', 'widthFractionDynamic', 'fontFamily', 'letterSpacing', 'zIndex', 'widthDynamic', 'heightDynamic', 'opacity', 'minWidth', 'minHeight', 'gradient', 'shadow', '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: ['widthFraction', 'widthFractionDynamic', 'zIndex', 'widthDynamic', 'heightDynamic', 'minWidth', 'minHeight', 'gradient', 'shadow', 'marginBottom', 'marginRight', 'marginLeft', 'marginTopAuto', 'marginLeftAuto', '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: ['borderSides', 'onSet', 'onClick', 'marginRight', 'marginBottom', 'marginLeft', 'position', 'absTop', 'absLeft', 'absRight', 'absBottom', 'clip', 'zIndex', 'widthFraction', 'widthFractionDynamic', 'widthDynamic', 'heightDynamic', 'minWidth', 'minHeight', 'gradient', 'shadow', 'width', 'height', 'flex', 'background', 'padding', 'radius', 'borderWidth', 'borderColor', 'marginTop', 'alignSelf', 'opacity'],

package/dist/transform/css.js

@@ -70,6 +70,9 @@ export function resolveCssRules(rules, element, ancestors, inline, warnings) {
     const props = {};
     for (const rule of matched)
         mergeIrProps(props, rule.props);
+    // object-fit 只影响图片内容，容器复用同一个类时不产生 IR 属性。
+    if (element.tag !== 'img')
+        delete props.objectFit;
     return props;
 }
 const px = (v) => {
@@ -118,6 +121,13 @@ function mapDeclInner(prop, value, warnings) {
     if (prop.startsWith('--'))
         return []; // 变量声明由 token 解析器处理，不是未支持的视觉属性。
     switch (prop) {
+        case 'object-fit':
+            return v === 'contain' || v === 'cover' ? [['objectFit', v]] : null;
+        case 'aspect-ratio': {
+            const parts = v.split('/').map((part) => Number(part.trim()));
+            const ratio = parts.length === 1 ? parts[0] : parts.length === 2 ? parts[0] / parts[1] : NaN;
+            return Number.isFinite(ratio) && ratio > 0 ? [['aspectRatio', ratio]] : null;
+        }
         case 'grid-template-columns': {
             // R136：CSS grid 的最小支持——`repeat(N, 1fr)` / `1fr 1fr 1fr` → 列数
             const rep = String(v).match(/repeat\(\s*(\d+)\s*,/);

package/dist/transform/vue2ir.js

@@ -2359,7 +2359,7 @@ function walkElement(node, classProps, comboRules, scopedRules, pseudoRules, war
             warnings.push(`属性 ${attrName}="${attrValue}" 暂不支持，已忽略`);
         }
     }
-    const inlineTags = new Set(['span', 'b', 'strong', 'i', 'em', 'small', 'u', 'code']);
+    const inlineTags = new Set(['span', 'b', 'strong', 'i', 'em', 'small', 'u', 'code', 'br']);
     const content = node.children.filter((c) => c.type !== NodeTypes.COMMENT && !(c.type === NodeTypes.TEXT && !c.content.trim()));
     const readable = (n) => n.type === NodeTypes.INTERPOLATION || (n.type === NodeTypes.TEXT && !!n.content.trim()) || (n.type === NodeTypes.ELEMENT && n.children.some(readable));
     const inlineConditional = content.some((c) => c.type === NodeTypes.ELEMENT && c.props.some((p) => p.type === NodeTypes.DIRECTIVE && ['if', 'else-if', 'else', 'show'].includes(p.name)));

package/package.json

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