@mybricks/to-code-taro 1.1.2 → 1.1.4

package/dist/esm/handleCom.js

@@ -1,12 +1,13 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import { convertComponentStyle, convertStyleAryToCss } from "./utils/style/converter";
-import { indentation, firstCharToUpperCase, formatSlotContent, getUiComponentCode } from "./utils/templates/index";
+import { indentation, firstCharToUpperCase, getUiComponentCode } from "./utils/templates/index";
 import { genSlotRenderRef } from "./utils/templates/component";
 import { RenderManager } from "./utils/templates/renderManager";
 import handleSlot from "./handleSlot";
+import handleDom from "./handleDom";
 import { processComEvents } from "./processors/processComEvents";
 import { handleProcess } from "./utils/logic/handleProcess";
 /**
@@ -52,6 +53,11 @@ export var handleCom = function handleCom(com, config) {
     rootStyle = _prepareStyles.rootStyle;
   var accumulatedCssContent = cssContent;
 
+  // 鸿蒙化：如果存在内置子节点（child），确保容器为 relative，以便内部绝对定位生效
+  if (com.child) {
+    rootStyle.position = "relative";
+  }
+
   // 4. 处理插槽
   var _processComSlots = processComSlots(com, config, accumulatedCssContent),
     slotsCode = _processComSlots.slotsCode,
@@ -60,15 +66,28 @@ export var handleCom = function handleCom(com, config) {
     childrenResults = _processComSlots.childrenResults;
   accumulatedCssContent = slotCss;
 
-  // 5. 生成 UI 代码
-  var ui = generateUiCode(com, config, componentName, rootStyle, comEventCode, slotsCode, eventHandlers);
+  // 5. 处理组件内置子节点 (child 属性，常用于自由布局中的绝对定位包装层)
+  var childrenUi = "";
+  if (com.child) {
+    var childResult = handleDom(com.child, _objectSpread(_objectSpread({}, config), {}, {
+      depth: config.depth + 1
+    }));
+    childrenUi = childResult.ui;
+    if (childResult.cssContent) {
+      accumulatedCssContent += (accumulatedCssContent ? "\n" : "") + childResult.cssContent;
+    }
+  }
+
+  // 6. 生成 UI 代码 (支持嵌套子节点)
+  var ui = generateUiCode(com, config, componentName, rootStyle, comEventCode, slotsCode, eventHandlers, childrenUi);
+  var hasEvents = Object.keys(eventHandlers).length > 0;
   return {
     slots: [],
     scopeSlots: [],
     ui: ui,
     js: eventCode,
     cssContent: accumulatedCssContent,
-    outputsConfig: Object.keys(eventHandlers).length > 0 ? _defineProperty({}, meta.id, eventHandlers) : undefined,
+    outputsConfig: hasEvents ? _defineProperty({}, meta.id, eventHandlers) : undefined,
     childrenResults: childrenResults,
     name: meta.name,
     // 返回解析后的稳定名称
@@ -147,9 +166,12 @@ var processComSlots = function processComSlots(com, config, initialCss) {
     var _ref3 = _slicedToArray(_ref2, 2),
       slotId = _ref3[0],
       slot = _ref3[1];
-    // 鸿蒙规范：如果插槽内没有组件，跳过渲染
+    // 鸿蒙规范：如果插槽内没有组件，直接渲染空
     var children = slot.comAry || slot.children || [];
+    var isLast = index === slotEntries.length - 1;
+    var slotIndent = indentation(config.codeStyle.indent * (config.depth + 2));
     if (children.length === 0) {
+      slotsCode += "".concat(slotIndent).concat(slotId, ": {\n").concat(slotIndent, "  render: () => null\n").concat(slotIndent, "}").concat(isLast ? '' : ',', "\n");
       return;
     }
     var slotLayout = (_com$props$data = com.props.data) === null || _com$props$data === void 0 ? void 0 : _com$props$data.layout;
@@ -160,6 +182,8 @@ var processComSlots = function processComSlots(com, config, initialCss) {
       depth: 1,
       renderManager: renderManager,
       slotKey: slotId,
+      // 给 slot 根容器打标用（slot wrapper className）
+      parentComId: meta.id,
       // 鸿蒙化：传递父容器的布局配置给插槽
       layout: slotLayout
     }));
@@ -168,15 +192,16 @@ var processComSlots = function processComSlots(com, config, initialCss) {
       accumulatedCssContent += (accumulatedCssContent ? "\n" : "") + result.cssContent;
     }
     var renderId = "".concat(meta.id, "_").concat(slotId);
-    var baseIndentSize = config.codeStyle.indent;
-    var renderBodyIndent = indentation(config.codeStyle.indent * 2);
-    var formattedContent = formatSlotContent(result.ui, baseIndentSize, renderBodyIndent);
+
+    // 关键：不再预先 formatSlotContent，而是将原始 ui 传给 renderManager
+    // 这样 RenderManager 在内部进行精确字符串替换时才能匹配成功
+    var rawContent = result.ui;
 
     // 鸿蒙化处理：针对表单容器进行别名对齐
-    if (meta.def.namespace === "mybricks.taro.formContainer" && Array.isArray((_props$data2 = props.data) === null || _props$data2 === void 0 ? void 0 : _props$data2.items) && result.childrenResults) {
+    if (meta.def.namespace === "mybricks.taro.formContainer" && Array.isArray((_props$data2 = props.data) === null || _props$data2 === void 0 ? void 0 : _props$data2.items) && result.directChildren) {
       var _props$data3;
       var items = (_props$data3 = props.data) === null || _props$data3 === void 0 ? void 0 : _props$data3.items;
-      result.childrenResults.forEach(function (childRes) {
+      result.directChildren.forEach(function (childRes) {
         var itemConfig = items.find(function (it) {
           return it.id === childRes.id;
         });
@@ -192,22 +217,23 @@ var processComSlots = function processComSlots(com, config, initialCss) {
     var logicCode = buildSlotLogicCode({
       parentComId: meta.id,
       slotKey: slotId,
-      children: result.childrenResults,
+      children: result.directChildren,
       config: config
     });
 
     // 生成插槽描述注释内容
     var description = "".concat(meta.title || meta.id, "\u7684").concat(slot.title || slotId, "\u63D2\u69FD");
-    renderManager.register(renderId, formattedContent, result.childrenResults, logicCode, slot.type, slot.wrap || slot.itemWrap || ((_COM_PROTOCOL$meta$de = COM_PROTOCOL[meta.def.namespace]) === null || _COM_PROTOCOL$meta$de === void 0 ? void 0 : _COM_PROTOCOL$meta$de.useWrap), description);
+    renderManager.register(renderId, rawContent, result.directChildren,
+    // 仅传入直接子组件，避免递归替换导致的结构破坏
+    logicCode, slot.type, slot.wrap || slot.itemWrap || ((_COM_PROTOCOL$meta$de = COM_PROTOCOL[meta.def.namespace]) === null || _COM_PROTOCOL$meta$de === void 0 ? void 0 : _COM_PROTOCOL$meta$de.useWrap), description);
     if (result.childrenResults) {
       allChildrenResults = allChildrenResults.concat(result.childrenResults);
     }
-    var slotIndent = indentation(config.codeStyle.indent * (config.depth + 2));
     slotsCode += genSlotRenderRef({
       slotId: slotId,
       renderId: renderId,
       indent: slotIndent,
-      isLast: index === slotEntries.length - 1
+      isLast: isLast
     });
   });
   return {
@@ -263,7 +289,7 @@ var buildSlotLogicCode = function buildSlotLogicCode(args) {
 /**
  * 生成 UI 代码
  */
-var generateUiCode = function generateUiCode(com, config, componentName, rootStyle, comEventCode, slotsCode, eventHandlers) {
+var generateUiCode = function generateUiCode(com, config, componentName, rootStyle, comEventCode, slotsCode, eventHandlers, childrenUi) {
   var _scene$coms, _sceneCom$inputs, _sceneCom$outputs, _meta$outputs;
   var meta = com.meta,
     props = com.props;
@@ -280,7 +306,8 @@ var generateUiCode = function generateUiCode(com, config, componentName, rootSty
     componentOutputs: ((sceneCom === null || sceneCom === void 0 || (_sceneCom$outputs = sceneCom.outputs) === null || _sceneCom$outputs === void 0 ? void 0 : _sceneCom$outputs.length) || 0) > 0 ? sceneCom.outputs : (((_meta$outputs = meta.outputs) === null || _meta$outputs === void 0 ? void 0 : _meta$outputs.length) || 0) > 0 ? meta.outputs : undefined,
     comEventCode: comEventCode,
     slotsCode: slotsCode,
-    eventHandlers: eventHandlers
+    eventHandlers: eventHandlers,
+    childrenUi: childrenUi
   }, {
     codeStyle: config.codeStyle,
     depth: config.depth + 1,

package/dist/esm/handleDom.d.ts

@@ -14,6 +14,8 @@ type HandleDomResult = {
     slots: string[];
     scopeSlots: string[];
     cssContent: string;
+    directChildren?: any[];
+    childrenResults?: any[];
 };
 declare const handleDom: (dom: Dom, config: HandleDomConfig) => HandleDomResult;
 export default handleDom;

package/dist/esm/handleDom.js

@@ -1,11 +1,11 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import { indentation, convertStyleAryToCss, convertRootStyle } from "./utils";
-import { processChildren } from "./utils/logic/processChildren";
+import { normalizeChildren, processChildren } from "./utils/logic/processChildren";
 var handleDom = function handleDom(dom, config) {
   var _domProps$style;
-  var props = dom.props,
-    children = dom.children;
+  var props = dom.props;
   var domProps = props;
+  var children = normalizeChildren(dom);
   var childResults = processChildren(children, _objectSpread(_objectSpread({}, config), {}, {
     depth: config.depth + 1
   }));
@@ -18,7 +18,9 @@ var handleDom = function handleDom(dom, config) {
     js: childResults.js,
     slots: childResults.slots,
     scopeSlots: childResults.scopeSlots,
-    cssContent: cssContent
+    cssContent: cssContent,
+    directChildren: childResults.directChildren,
+    childrenResults: childResults.childrenResults
   };
 };
 export default handleDom;

package/dist/esm/handleGlobal.js

@@ -8,6 +8,7 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import { ImportManager, indentation } from "./utils";
 import { handleProcess } from "./utils/logic/handleProcess";
+import { getSafeVarName } from "./utils/common/string";
 var handleGlobal = function handleGlobal(params, config) {
   var tojson = params.tojson,
     globalFxs = params.globalFxs,
@@ -50,8 +51,9 @@ var handleGlobal = function handleGlobal(params, config) {
         return tojson.global;
       }
     }));
-    globalVarsRegisterChangeCode += "\n".concat(indent2, "this.").concat(com.title, ".registerChange((value: any) => {") + "\n".concat(res) + "\n".concat(indent2, "})");
-    globalVarsInitCode += "".concat(indent).concat(com.title, ": any = createVariable(").concat(JSON.stringify(com.model.data.initValue || {}), ")\n");
+    var varKey = getSafeVarName(com);
+    globalVarsRegisterChangeCode += "\n".concat(indent2, "this.").concat(varKey, ".registerChange((value: any) => {") + "\n".concat(res) + "\n".concat(indent2, "})");
+    globalVarsInitCode += "".concat(indent).concat(varKey, ": any = createVariable(").concat(JSON.stringify(com.model.data.initValue || {}), ")\n");
   });
   var globalFxsInitCode = "";
   globalFxs.forEach(function (event) {

package/dist/esm/handleSlot.d.ts

@@ -12,6 +12,8 @@ interface HandleSlotConfig extends BaseConfig {
     hasPopups?: boolean;
     /** handleCom 处理 slots 时的 slot key（如 item/content），用于识别 scope 入参 */
     slotKey?: string;
+    /** 父组件 id（用于给插槽根容器打标 className） */
+    parentComId?: string;
 }
 declare const handleSlot: (ui: UI, config: HandleSlotConfig) => {
     js: string;
@@ -20,6 +22,7 @@ declare const handleSlot: (ui: UI, config: HandleSlotConfig) => {
     cssContent: string;
     slots: any[];
     scopeSlots: any[];
+    directChildren: any[];
     childrenResults: any[];
 };
 export default handleSlot;

package/dist/esm/handleSlot.js

@@ -2,15 +2,15 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import { ImportManager, indentation, convertStyleAryToCss, convertRootStyle, getRootComponentClassName } from "./utils";
 import { genRootDefineCode, genSlotDefineCode, genComponentTemplate, wrapInEffect } from "./utils/templates/scene";
 import { RenderManager } from "./utils/templates/renderManager";
-import { processChildren } from "./utils/logic/processChildren";
+import { processChildren, normalizeChildren } from "./utils/logic/processChildren";
 import { processSceneLogic } from "./processors/processSceneLogic";
 var handleSlot = function handleSlot(ui, config) {
   var _meta, _props$style;
   var importManager = new ImportManager(config);
   var _ui$props = ui.props,
     props = _ui$props === void 0 ? {} : _ui$props;
-  // 支持 children 或 comAry (DSL 常用名)
-  var children = ui.children || ui.comAry || [];
+  // 使用归一化处理器
+  var children = normalizeChildren(ui);
   var isRoot = config.checkIsRoot();
   var slotId = ((_meta = ui.meta) === null || _meta === void 0 ? void 0 : _meta.id) || ui.id;
 
@@ -59,7 +59,7 @@ var handleSlot = function handleSlot(ui, config) {
   var combinedJsCode = "".concat(envDefineCode).concat(childResults.js).concat(initCode).concat(wrapInEffect(indent2, effectCode));
 
   // 5. 生成 UI 结构
-  var uiResult = generateSlotUi(ui, props, childResults.ui, config);
+  var uiResult = generateSlotUi(ui, props, childResults.ui, childResults.childrenResults, config);
 
   // 6. 如果是根场景，生成完整文件
   if (isRoot) {
@@ -73,6 +73,7 @@ var handleSlot = function handleSlot(ui, config) {
     cssContent: cssContent,
     slots: [],
     scopeSlots: [],
+    directChildren: childResults.directChildren,
     childrenResults: childResults.childrenResults
   };
 };
@@ -97,7 +98,6 @@ var setupImports = function setupImports(addImport, config, isRoot) {
     importType: "named"
   });
 
-  // SlotProvider/ScopedComContextProvider 属于 runtime 内部实现（core/utils/slots.tsx）使用，
   // 页面/插槽产物通常不直接使用，避免生成未使用的 import。
   var dependencyNames = ["WithCom", "WithWrapper"];
   if (isRoot && config.hasPopups) {
@@ -114,9 +114,14 @@ var setupImports = function setupImports(addImport, config, isRoot) {
     importType: "named"
   });
   if (isRoot) {
+    addImport({
+      packageName: "@/common/pageLife",
+      dependencyNames: ["usePageLife"],
+      importType: "named"
+    });
     if (config.hasPopups) {
       addImport({
-        packageName: "../../common/popup",
+        packageName: "@/common/popup",
         dependencyNames: ["POPUP_MAP", "POPUP_IDS"],
         importType: "named"
       });
@@ -132,19 +137,33 @@ var setupImports = function setupImports(addImport, config, isRoot) {
 /**
  * 生成 Slot 的 UI 代码
  */
-var generateSlotUi = function generateSlotUi(ui, props, childrenUi, config) {
+var generateSlotUi = function generateSlotUi(ui, props, childrenUi, childrenResults, config) {
   var indent = indentation(config.codeStyle.indent * config.depth);
+  var slotStyle = ui.style || {};
+  var propsStyle = props.style || {};
   var mergedStyle = _objectSpread(_objectSpread({
     width: "100%",
     height: "100%"
-  }, ui.style || {}), props.style || {});
+  }, slotStyle), propsStyle);
+
   // 鸿蒙化：优先使用 config 中传递的 layout（来自父容器 data.layout），否则使用 slot 自身的 layout
   var layout = config.layout || ui.layout || mergedStyle.layout;
+  var smart = isSmartLayout(layout);
+  var layoutAdjustment = smart ? {
+    position: isHasInSmartLayout(childrenResults) ? "fixed" : "relative"
+  } : hasFixedChildren(childrenResults) ? {
+    transform: "translateX(0)"
+  } : {};
   var styleCode = JSON.stringify(convertRootStyle(_objectSpread(_objectSpread({}, mergedStyle), {}, {
     layout: layout
-  })));
+  }, layoutAdjustment)));
   var rootClassName = getRootComponentClassName(config.getCurrentScene(), config.checkIsRoot());
-  var classNameAttr = rootClassName ? " className='".concat(rootClassName, "'") : "";
+  // 插槽根容器增强：加上可读的标识，便于用户定位/调试
+  // - className: slot-<parentComId>
+  var parentComId = config === null || config === void 0 ? void 0 : config.parentComId;
+  var slotMarkClass = parentComId ? "slot-".concat(parentComId) : "";
+  var classNameStr = [rootClassName, slotMarkClass].filter(Boolean).join(" ");
+  var classNameAttr = classNameStr ? " className='".concat(classNameStr, "'") : "";
   return "".concat(indent, "<View").concat(classNameAttr, " style={").concat(styleCode, "}>\n").concat(childrenUi, "\n").concat(indent, "</View>");
 };
 
@@ -172,4 +191,27 @@ var finalizeRootComponent = function finalizeRootComponent(ui, config, importMan
     name: fileName
   });
 };
+
+/**
+ * 检查子元素是否有固定定位的元素
+ */
+var hasFixedChildren = function hasFixedChildren(childrenResults) {
+  return childrenResults.some(function (item) {
+    var _item$rootStyle;
+    return (item === null || item === void 0 || (_item$rootStyle = item.rootStyle) === null || _item$rootStyle === void 0 ? void 0 : _item$rootStyle.position) === "fixed";
+  });
+};
+
+/**
+ * 检查是否是智能布局
+ */
+var isSmartLayout = function isSmartLayout(layout) {
+  return layout === "smart" || (layout === null || layout === void 0 ? void 0 : layout.position) === "smart";
+};
+var isHasInSmartLayout = function isHasInSmartLayout(childrenResults) {
+  return childrenResults.some(function (item) {
+    var _item$rootStyle2;
+    return (item === null || item === void 0 || (_item$rootStyle2 = item.rootStyle) === null || _item$rootStyle2 === void 0 ? void 0 : _item$rootStyle2.inSmartLayout) === true;
+  });
+};
 export default handleSlot;