km-card-layout-component-miniprogram 0.1.8 → 0.1.9

package/miniprogram_dist/components/card-layout/index.wxml

@@ -9,82 +9,34 @@
           src="{{item.backgroundImage}}"
           mode="aspectFill"
         />
-        <block wx:for="{{item.nodes}}" wx:key="id">
-          <template is="render-node" data="{{node:item}}" />
+        <block wx:for="{{item.elements}}" wx:key="id">
+          <template is="render-element" data="{{el:item}}" />
         </block>
       </view>
     </view>
   </block>
 </view>
 
-<template name="render-node">
-  <block wx:if="{{node.type === 'image'}}">
-    <view class="km-node" style="{{node.wrapperStyle}}">
-      <image
-        class="km-node__image"
-        style="{{node.contentStyle}}"
-        src="{{node.src}}"
-        mode="{{node.mode || 'aspectFill'}}"
-      />
-    </view>
+<template name="render-element">
+  <block wx:if="{{el.type === 'image'}}">
+    <image-element element="{{el}}" />
   </block>
-  <block wx:elif="{{node.type === 'icon'}}">
-    <view class="km-node km-node--icon" style="{{node.wrapperStyle}}">
-      <view
-        wx:if="{{node.name === 'dot' || node.name === 'round'}}"
-        class="km-node__icon-dot"
-        style="{{node.contentStyle}}"
-      />
-      <view
-        wx:else
-        class="km-node__icon icon"
-        style="{{node.contentStyle}}"
-      >{{node.text || ''}}</view>
-    </view>
+  <block wx:elif="{{el.type === 'icon'}}">
+    <icon-element element="{{el}}" />
   </block>
-  <block wx:elif="{{node.type === 'layout-panel'}}">
-    <view class="km-node" style="{{node.wrapperStyle}}">
-      <view class="km-node__panel" style="{{node.contentStyle}}">
-        <block wx:for="{{node.children}}" wx:key="id">
-          <template is="render-node" data="{{node:item}}" />
+  <block wx:elif="{{el.type === 'layout-panel'}}">
+    <view class="km-node" style="{{el.wrapperStyle}}">
+      <view class="km-node__panel" style="{{el.contentStyle}}">
+        <block wx:for="{{el.children}}" wx:key="id">
+          <template is="render-element" data="{{el:item}}" />
         </block>
       </view>
     </view>
   </block>
-  <block wx:elif="{{node.type === 'custom'}}">
-    <view class="km-node km-node--custom" style="{{node.wrapperStyle}}">
-      <view class="km-node__custom" style="{{node.contentStyle}}">
-        <slot name="{{node.id}}"></slot>
-      </view>
-    </view>
+  <block wx:elif="{{el.type === 'custom'}}">
+    <custom-element element="{{el}}" />
   </block>
   <block wx:else>
-    <view class="km-node km-node--text" style="{{node.wrapperStyle}}">
-      <view class="km-node__text" style="{{node.contentStyle}}">
-        <block wx:if="{{node.icon && node.icon.name}}">
-          <view class="km-node__text-content">
-            <block wx:if="{{node.icon.align === 'right'}}">
-              <text class="km-node__text-value">{{node.text || ''}}</text>
-              <view style="{{node.icon.wrapperStyle}}">
-                <text
-                class="km-node__text-icon icon"
-                style="font-size: {{node.icon.size || '16px'}}; color: {{node.icon.color || ''}}; margin-right: {{node.icon.gap || ''}};">{{node.icon.text || node.icon.name || ''}}</text>
-              </view>
-            </block>
-            <block wx:else>
-              <view style="{{node.icon.wrapperStyle}}">
-                <text
-                class="km-node__text-icon icon"
-                style="font-size: {{node.icon.size || '16px'}}; color: {{node.icon.color || ''}}; margin-right: {{node.icon.gap || ''}};">{{node.icon.text || node.icon.name || ''}}</text>
-              </view>
-              <text class="km-node__text-value">{{node.text || ''}}</text>
-            </block>
-          </view>
-        </block>
-        <block wx:else>
-          <text class="km-node__text-value">{{node.text || ''}}</text>
-        </block>
-      </view>
-    </view>
+    <text-element element="{{el}}" />
   </block>
 </template>

package/miniprogram_dist/components/card-layout/index.wxss

@@ -1,9 +1,6 @@
-
-
 .km-card-layout {
   display: flex;
   flex-direction: column;
-  gap: 16rpx;
 }
 
 .km-card-layout__item {
@@ -33,76 +30,14 @@
   color: inherit;
 }
 
-.km-node--icon {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.km-node__image {
-  width: 100%;
-  height: 100%;
-  display: block;
-}
-
-.km-node__icon {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 100%;
-  height: 100%;
-  font-family: 'km-icon', 'PingFang SC', 'Microsoft Yahei', sans-serif;
-  font-style: normal;
-  font-weight: normal;
-}
-
-.km-node__icon-dot {
-  width: 100%;
-  height: 100%;
-  border-radius: 50%;
-  background-color: #999;
-}
-
 .km-node__panel {
   width: 100%;
   height: 100%;
   box-sizing: border-box;
 }
 
-.km-node__custom {
-  width: 100%;
-  height: 100%;
-  box-sizing: border-box;
-}
 
-.km-node__text {
-  width: 100%;
-  height: 100%;
-  display: block;
-  box-sizing: border-box;
-  text-align: inherit;
-}
-
-.km-node__text-content {
-  display: inline-block;
-  vertical-align: middle;
-  height: 100%;
-}
-
-.km-node__text-value {
-  display: inline-block;
-  white-space: pre-wrap;
-  word-break: break-word;
-  vertical-align: middle;
-}
-.km-node--text{
-  /* 溢出隐藏 */
-}
-.km-node--text text {
-  display: inline;
-}
 
-/* ICON */
 
 
 @font-face {

package/miniprogram_dist/utils/card-schema.js

@@ -1,10 +1,19 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.styleObjectToString = exports.resolveBindingValue = exports.normalizeLayout = exports.buildRenderResult = exports.buildRenderNodes = exports.addUnit = void 0;
+exports.styleObjectToString = exports.resolveBindingValue = exports.normalizeLayout = exports.getIconName = exports.getImageSrc = exports.getTextValue = exports.buildTextIconMeta = exports.buildImageContentStyle = exports.buildTextContentStyle = exports.buildPanelContentStyle = exports.buildBaseContentStyle = exports.buildBackgroundStyle = exports.buildCardStyle = exports.buildWrapperStyle = exports.addUnit = void 0;
 var index_1 = require("../vendor/km-card-layout-core/index");
 Object.defineProperty(exports, "addUnit", { enumerable: true, get: function () { return index_1.addUnit; } });
-Object.defineProperty(exports, "buildRenderNodes", { enumerable: true, get: function () { return index_1.buildRenderNodes; } });
-Object.defineProperty(exports, "buildRenderResult", { enumerable: true, get: function () { return index_1.buildRenderResult; } });
+Object.defineProperty(exports, "buildWrapperStyle", { enumerable: true, get: function () { return index_1.buildWrapperStyle; } });
+Object.defineProperty(exports, "buildCardStyle", { enumerable: true, get: function () { return index_1.buildCardStyle; } });
+Object.defineProperty(exports, "buildBackgroundStyle", { enumerable: true, get: function () { return index_1.buildBackgroundStyle; } });
+Object.defineProperty(exports, "buildBaseContentStyle", { enumerable: true, get: function () { return index_1.buildBaseContentStyle; } });
+Object.defineProperty(exports, "buildPanelContentStyle", { enumerable: true, get: function () { return index_1.buildPanelContentStyle; } });
+Object.defineProperty(exports, "buildTextContentStyle", { enumerable: true, get: function () { return index_1.buildTextContentStyle; } });
+Object.defineProperty(exports, "buildImageContentStyle", { enumerable: true, get: function () { return index_1.buildImageContentStyle; } });
+Object.defineProperty(exports, "buildTextIconMeta", { enumerable: true, get: function () { return index_1.buildTextIconMeta; } });
+Object.defineProperty(exports, "getTextValue", { enumerable: true, get: function () { return index_1.getTextValue; } });
+Object.defineProperty(exports, "getImageSrc", { enumerable: true, get: function () { return index_1.getImageSrc; } });
+Object.defineProperty(exports, "getIconName", { enumerable: true, get: function () { return index_1.getIconName; } });
 Object.defineProperty(exports, "normalizeLayout", { enumerable: true, get: function () { return index_1.normalizeLayout; } });
 Object.defineProperty(exports, "resolveBindingValue", { enumerable: true, get: function () { return index_1.resolveBindingValue; } });
 Object.defineProperty(exports, "styleObjectToString", { enumerable: true, get: function () { return index_1.styleObjectToString; } });

package/miniprogram_dist/vendor/km-card-layout-core/bindings.js

@@ -29,6 +29,7 @@ function applyItemCollectBindings(layouts = [], items = []) {
         }
     });
     const assignBinding = (el) => {
+        var _a;
         const meta = metaMap.get(String(el.id));
         const binding = meta && meta.bind !== undefined && meta.bind !== null
             ? meta.bind
@@ -48,6 +49,9 @@ function applyItemCollectBindings(layouts = [], items = []) {
             base.key = key;
         else
             delete base.key;
+        if (el.type === 'text' && ((_a = meta === null || meta === void 0 ? void 0 : meta.extra) === null || _a === void 0 ? void 0 : _a.icon)) {
+            base.icon = { ...(base.icon || {}), name: meta.extra.icon };
+        }
         if (el.type === 'layout-panel') {
             return {
                 ...base,

package/miniprogram_dist/vendor/km-card-layout-core/index.js

@@ -20,12 +20,30 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.updateElementsStyle = exports.applyBackground = exports.applySpecialStyle = exports.resolveSpecialStyle = exports.DEFAULT_DECOR_COLOR = exports.backgroundChange = void 0;
+exports.buildTextIconMeta = exports.getIconName = exports.getImageSrc = exports.getTextValue = exports.buildImageContentStyle = exports.buildTextContentStyle = exports.buildPanelContentStyle = exports.buildBaseContentStyle = exports.buildBackgroundStyle = exports.buildCardStyle = exports.buildWrapperStyle = exports.buildRenderData = exports.updateElementsStyle = exports.applyBackground = exports.applySpecialStyle = exports.resolveSpecialStyle = exports.DEFAULT_DECOR_COLOR = exports.backgroundChange = exports.getTemplateBackgrounds = exports.getTemplateItems = exports.applyItemCollectBindings = exports.stripLayoutBindings = exports.resolveBindingValue = exports.areChildrenEqual = exports.parseLayout = exports.normalizeId = exports.collectBindings = exports.getAbsLayout = exports.roundToInt = exports.sanitizeElement = exports.sanitizeLayout = exports.normalizeLayout = exports.isObject = exports.toNumber = exports.styleObjectToString = exports.addUnit = void 0;
 __exportStar(require("./interface/index"), exports);
-__exportStar(require("./helpers"), exports);
-__exportStar(require("./layout"), exports);
-__exportStar(require("./data"), exports);
-__exportStar(require("./bindings"), exports);
+var helpers_1 = require("./helpers");
+Object.defineProperty(exports, "addUnit", { enumerable: true, get: function () { return helpers_1.addUnit; } });
+Object.defineProperty(exports, "styleObjectToString", { enumerable: true, get: function () { return helpers_1.styleObjectToString; } });
+Object.defineProperty(exports, "toNumber", { enumerable: true, get: function () { return helpers_1.toNumber; } });
+Object.defineProperty(exports, "isObject", { enumerable: true, get: function () { return helpers_1.isObject; } });
+var layout_1 = require("./layout");
+Object.defineProperty(exports, "normalizeLayout", { enumerable: true, get: function () { return layout_1.normalizeLayout; } });
+Object.defineProperty(exports, "sanitizeLayout", { enumerable: true, get: function () { return layout_1.sanitizeLayout; } });
+Object.defineProperty(exports, "sanitizeElement", { enumerable: true, get: function () { return layout_1.sanitizeElement; } });
+Object.defineProperty(exports, "roundToInt", { enumerable: true, get: function () { return layout_1.roundToInt; } });
+Object.defineProperty(exports, "getAbsLayout", { enumerable: true, get: function () { return layout_1.getAbsLayout; } });
+Object.defineProperty(exports, "collectBindings", { enumerable: true, get: function () { return layout_1.collectBindings; } });
+Object.defineProperty(exports, "normalizeId", { enumerable: true, get: function () { return layout_1.normalizeId; } });
+Object.defineProperty(exports, "parseLayout", { enumerable: true, get: function () { return layout_1.parseLayout; } });
+Object.defineProperty(exports, "areChildrenEqual", { enumerable: true, get: function () { return layout_1.areChildrenEqual; } });
+var data_1 = require("./data");
+Object.defineProperty(exports, "resolveBindingValue", { enumerable: true, get: function () { return data_1.resolveBindingValue; } });
+var bindings_1 = require("./bindings");
+Object.defineProperty(exports, "stripLayoutBindings", { enumerable: true, get: function () { return bindings_1.stripLayoutBindings; } });
+Object.defineProperty(exports, "applyItemCollectBindings", { enumerable: true, get: function () { return bindings_1.applyItemCollectBindings; } });
+Object.defineProperty(exports, "getTemplateItems", { enumerable: true, get: function () { return bindings_1.getTemplateItems; } });
+Object.defineProperty(exports, "getTemplateBackgrounds", { enumerable: true, get: function () { return bindings_1.getTemplateBackgrounds; } });
 var changeBackground_1 = require("./ops/changeBackground");
 Object.defineProperty(exports, "backgroundChange", { enumerable: true, get: function () { return changeBackground_1.backgroundChange; } });
 Object.defineProperty(exports, "DEFAULT_DECOR_COLOR", { enumerable: true, get: function () { return changeBackground_1.DEFAULT_DECOR_COLOR; } });
@@ -33,4 +51,17 @@ Object.defineProperty(exports, "resolveSpecialStyle", { enumerable: true, get: f
 Object.defineProperty(exports, "applySpecialStyle", { enumerable: true, get: function () { return changeBackground_1.applySpecialStyle; } });
 Object.defineProperty(exports, "applyBackground", { enumerable: true, get: function () { return changeBackground_1.applyBackground; } });
 Object.defineProperty(exports, "updateElementsStyle", { enumerable: true, get: function () { return changeBackground_1.updateElementsStyle; } });
-__exportStar(require("./render/builder"), exports);
+var tool_1 = require("./render/tool");
+Object.defineProperty(exports, "buildRenderData", { enumerable: true, get: function () { return tool_1.buildRenderData; } });
+var helpers_2 = require("./render/helpers");
+Object.defineProperty(exports, "buildWrapperStyle", { enumerable: true, get: function () { return helpers_2.buildWrapperStyle; } });
+Object.defineProperty(exports, "buildCardStyle", { enumerable: true, get: function () { return helpers_2.buildCardStyle; } });
+Object.defineProperty(exports, "buildBackgroundStyle", { enumerable: true, get: function () { return helpers_2.buildBackgroundStyle; } });
+Object.defineProperty(exports, "buildBaseContentStyle", { enumerable: true, get: function () { return helpers_2.buildBaseContentStyle; } });
+Object.defineProperty(exports, "buildPanelContentStyle", { enumerable: true, get: function () { return helpers_2.buildPanelContentStyle; } });
+Object.defineProperty(exports, "buildTextContentStyle", { enumerable: true, get: function () { return helpers_2.buildTextContentStyle; } });
+Object.defineProperty(exports, "buildImageContentStyle", { enumerable: true, get: function () { return helpers_2.buildImageContentStyle; } });
+Object.defineProperty(exports, "getTextValue", { enumerable: true, get: function () { return helpers_2.getTextValue; } });
+Object.defineProperty(exports, "getImageSrc", { enumerable: true, get: function () { return helpers_2.getImageSrc; } });
+Object.defineProperty(exports, "getIconName", { enumerable: true, get: function () { return helpers_2.getIconName; } });
+Object.defineProperty(exports, "buildTextIconMeta", { enumerable: true, get: function () { return helpers_2.buildTextIconMeta; } });

package/miniprogram_dist/vendor/km-card-layout-core/interface/index.js

@@ -16,5 +16,5 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./elements"), exports);
 __exportStar(require("./layout"), exports);
-__exportStar(require("./render"), exports);
 __exportStar(require("./data/payload"), exports);
+__exportStar(require("./context"), exports);

package/miniprogram_dist/vendor/km-card-layout-core/ops/changeBackground.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.updateElementsStyle = exports.applyBackground = exports.applySpecialStyle = exports.resolveSpecialStyle = exports.DEFAULT_DECOR_COLOR = exports.backgroundChange = void 0;
+exports.setElementVisible = exports.updateElementsStyle = exports.applyBackground = exports.applySpecialStyle = exports.resolveSpecialStyle = exports.DEFAULT_DECOR_COLOR = exports.backgroundChange = void 0;
 const toNameArray = (name) => {
     if (Array.isArray(name))
         return name.filter(Boolean);
@@ -133,3 +133,10 @@ const updateElementsStyle = (layout, targetIds, updates) => {
     };
 };
 exports.updateElementsStyle = updateElementsStyle;
+const setElementVisible = (layout, key, visible) => {
+    return layout.map(la => ({
+        ...la,
+        children: la.children.map(el => (el.key === key ? { ...el, visible } : el)),
+    }));
+};
+exports.setElementVisible = setElementVisible;

package/miniprogram_dist/vendor/km-card-layout-core/render/helpers.js

@@ -0,0 +1,133 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.buildTextIconMeta = exports.getIconName = exports.getImageSrc = exports.getTextValue = exports.buildImageContentStyle = exports.buildTextContentStyle = exports.buildPanelContentStyle = exports.buildBaseContentStyle = exports.buildBackgroundStyle = exports.buildCardStyle = exports.buildWrapperStyle = void 0;
+const helpers_1 = require("../helpers");
+const layout_1 = require("../layout");
+const buildWrapperStyle = (el, unit = 'px') => {
+    const abs = (0, layout_1.getAbsLayout)(el);
+    if (!abs)
+        return {};
+    return {
+        position: 'absolute',
+        left: (0, helpers_1.addUnit)(abs.x, unit),
+        top: (0, helpers_1.addUnit)(abs.y, unit),
+        width: (0, helpers_1.addUnit)(abs.width, unit),
+        height: (0, helpers_1.addUnit)(abs.height, unit),
+        zIndex: abs.zIndex,
+        boxSizing: 'border-box',
+    };
+};
+exports.buildWrapperStyle = buildWrapperStyle;
+const buildCardStyle = (layout, unit = 'px') => ({
+    width: (0, helpers_1.addUnit)(layout.width, unit),
+    height: (0, helpers_1.addUnit)(layout.height, unit),
+    color: layout.fontColor,
+    borderRadius: layout.borderRadius !== undefined
+        ? (0, helpers_1.addUnit)(layout.borderRadius, unit)
+        : undefined,
+    padding: layout.padding !== undefined ? (0, helpers_1.addUnit)(layout.padding, unit) : undefined,
+    position: 'relative',
+    overflow: 'hidden',
+    boxSizing: 'border-box',
+    backgroundColor: 'transparent',
+});
+exports.buildCardStyle = buildCardStyle;
+const buildBackgroundStyle = (layout, unit = 'px') => ({
+    zIndex: layout.backgroundZIndex,
+    borderRadius: layout.borderRadius !== undefined
+        ? (0, helpers_1.addUnit)(layout.borderRadius, unit)
+        : undefined,
+    width: '100%',
+    height: '100%',
+    position: 'absolute',
+    left: 0,
+    top: 0,
+});
+exports.buildBackgroundStyle = buildBackgroundStyle;
+const buildBaseContentStyle = (el) => ({
+    ...(el.style || {}),
+    boxSizing: 'border-box',
+});
+exports.buildBaseContentStyle = buildBaseContentStyle;
+const buildPanelContentStyle = (el, unit = 'px') => ({
+    position: 'relative',
+    width: '100%',
+    height: '100%',
+    display: 'block',
+    boxSizing: 'border-box',
+    ...(el.style || {}),
+});
+exports.buildPanelContentStyle = buildPanelContentStyle;
+const buildTextContentStyle = (el, unit = 'px') => {
+    var _a, _b, _c, _d;
+    const textAlign = ((_a = el.style) === null || _a === void 0 ? void 0 : _a.textAlign) || el.align || undefined;
+    const style = {
+        ...(el.style || {}),
+        fontSize: (0, helpers_1.addUnit)((_b = el.style) === null || _b === void 0 ? void 0 : _b.fontSize, unit),
+        whiteSpace: 'pre-wrap',
+        wordBreak: 'break-word',
+        lineHeight: ((_c = el.style) === null || _c === void 0 ? void 0 : _c.lineHeight) !== undefined && ((_d = el.style) === null || _d === void 0 ? void 0 : _d.lineHeight) !== null
+            ? (0, helpers_1.addUnit)(el.style.lineHeight, unit)
+            : '1',
+    };
+    if (textAlign)
+        style.textAlign = textAlign;
+    return style;
+};
+exports.buildTextContentStyle = buildTextContentStyle;
+const buildImageContentStyle = (el) => {
+    const style = { ...(el.style || {}) };
+    const borderWidth = Number(style.borderWidth);
+    if (Number.isFinite(borderWidth) && borderWidth > 0) {
+        if (!style.borderStyle)
+            style.borderStyle = 'solid';
+        if (!style.borderColor)
+            style.borderColor = '#000000';
+    }
+    return style;
+};
+exports.buildImageContentStyle = buildImageContentStyle;
+const getTextValue = (el) => el.defaultValue !== undefined && el.defaultValue !== null
+    ? `${el.defaultValue}`
+    : '';
+exports.getTextValue = getTextValue;
+const getImageSrc = (el) => el.defaultUrl || el.defaultValue || '';
+exports.getImageSrc = getImageSrc;
+const getIconName = (el) => (el.name || el.defaultValue || '');
+exports.getIconName = getIconName;
+const buildTextIconMeta = (el, unit = 'px') => {
+    var _a, _b, _c, _d, _e, _f;
+    const icon = el.icon;
+    const enabled = (icon === null || icon === void 0 ? void 0 : icon.enable) === true;
+    if (!icon || !enabled)
+        return null;
+    const style = icon.style || 'fill';
+    const baseName = icon.name || el.key || el.binding || el.id;
+    let name;
+    if (style === 'dot')
+        name = 'round';
+    else if (style === 'line')
+        name = baseName ? `${baseName}-line` : undefined;
+    else
+        name = baseName || undefined;
+    if (!name)
+        return null;
+    const size = icon.size !== undefined && icon.size !== null
+        ? icon.size
+        : (_a = el.style) === null || _a === void 0 ? void 0 : _a.fontSize;
+    const gap = icon.gap !== undefined && icon.gap !== null ? icon.gap : 4;
+    const color = (_b = icon.color) !== null && _b !== void 0 ? _b : (typeof ((_c = el.style) === null || _c === void 0 ? void 0 : _c.color) === 'string' ? el.style.color : undefined);
+    return {
+        name: `${name}`,
+        size: (0, helpers_1.addUnit)(size, unit),
+        gap: (0, helpers_1.addUnit)(gap, unit),
+        color,
+        align: icon.align || 'left',
+        wrapperStyle: {
+            height: ((_d = el.style) === null || _d === void 0 ? void 0 : _d.lineHeight) !== undefined && ((_e = el.style) === null || _e === void 0 ? void 0 : _e.lineHeight) !== null
+                ? (0, helpers_1.addUnit)(el.style.lineHeight, unit)
+                : (_f = el.style) === null || _f === void 0 ? void 0 : _f.fontSize,
+        },
+    };
+};
+exports.buildTextIconMeta = buildTextIconMeta;

package/miniprogram_dist/vendor/km-card-layout-core/render/tool.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.buildRenderData = void 0;
+const changeBackground_1 = require("../ops/changeBackground");
+const utils_1 = require("../utils");
+function buildRenderData(layout, items, config) {
+    // 绑定数据
+    let renderLayout = (0, utils_1.applyItemCollectBindings)(layout, items);
+    // 设置显示逻辑
+    renderLayout = (0, changeBackground_1.setElementVisible)(renderLayout, 'image', config.showAvatar);
+    renderLayout = (0, changeBackground_1.setElementVisible)(renderLayout, 'logo', config.showLogo);
+    // 设置背景
+    renderLayout = renderLayout.map((la, index) => config.currentBg[index] ? (0, changeBackground_1.backgroundChange)(config.currentBg[index], la) : la);
+    return renderLayout;
+}
+exports.buildRenderData = buildRenderData;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "km-card-layout-component-miniprogram",
-  "version": "0.1.8",
+  "version": "0.1.9",
   "description": "",
   "main": "miniprogram_dist/index.js",
   "miniprogram": "miniprogram_dist",

package/script/sync-core.js

@@ -24,6 +24,9 @@ function ensureFileExists(filePath) {
 
 function syncCore() {
   ensureFileExists(coreRoot);
+  if (fs.existsSync(targetDir)) {
+    fs.rmSync(targetDir, { recursive: true, force: true });
+  }
   fs.mkdirSync(targetDir, { recursive: true });
 
   filesToCopy.forEach((fileName) => {

package/src/components/card-layout/elements/custom-element/index.json

@@ -0,0 +1,3 @@
+{
+  "component": true
+}

package/src/components/card-layout/elements/custom-element/index.ts

@@ -0,0 +1,30 @@
+import {
+  buildBaseContentStyle,
+  buildWrapperStyle,
+  styleObjectToString,
+  type CustomElement,
+} from '../../../../vendor/km-card-layout-core/index';
+
+Component({
+  options: {
+    styleIsolation: 'apply-shared',
+  },
+  properties: {
+    element: {
+      type: Object,
+      value: {},
+    },
+  },
+  data: {
+    wrapperStyle: '',
+    contentStyle: '',
+  },
+  observers: {
+    element(el: CustomElement) {
+      if (!el) return;
+      const wrapperStyle = styleObjectToString(buildWrapperStyle(el, 'rpx'), 'rpx');
+      const contentStyle = styleObjectToString(buildBaseContentStyle(el), 'rpx');
+      this.setData({ wrapperStyle, contentStyle });
+    },
+  },
+});

package/src/components/card-layout/elements/custom-element/index.wxml

@@ -0,0 +1,5 @@
+<view class="km-node km-node--custom" style="{{wrapperStyle}}">
+  <view class="km-node__custom" style="{{contentStyle}}">
+    <slot name="{{element.id}}"></slot>
+  </view>
+</view>

package/src/components/card-layout/elements/custom-element/index.wxss

@@ -0,0 +1,14 @@
+.km-node {
+  box-sizing: border-box;
+  color: inherit;
+}
+
+.km-node--custom {
+  box-sizing: border-box;
+}
+
+.km-node__custom {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+}

package/src/components/card-layout/elements/icon-element/index.json

@@ -0,0 +1,3 @@
+{
+  "component": true
+}

package/src/components/card-layout/elements/icon-element/index.ts

@@ -0,0 +1,42 @@
+import {
+  buildBaseContentStyle,
+  buildWrapperStyle,
+  getIconName,
+  styleObjectToString,
+  type IconElement,
+} from '../../../../vendor/km-card-layout-core/index';
+import { ICON_CODE_MAP } from '../../icon-map';
+
+const mapIconGlyph = (name?: string, fallback?: string) => {
+  if (!name) return fallback;
+  const glyph = ICON_CODE_MAP[name];
+  if (glyph) return String.fromCharCode(parseInt(glyph, 16));
+  return fallback || name;
+};
+
+Component({
+  options: {
+    styleIsolation: 'apply-shared',
+  },
+  properties: {
+    element: {
+      type: Object,
+      value: {},
+    },
+  },
+  data: {
+    wrapperStyle: '',
+    contentStyle: '',
+    iconText: '',
+  },
+  observers: {
+    element(el: IconElement) {
+      if (!el) return;
+      const wrapperStyle = styleObjectToString(buildWrapperStyle(el, 'rpx'), 'rpx');
+      const contentStyle = styleObjectToString(buildBaseContentStyle(el), 'rpx');
+      const name = getIconName(el);
+      const iconText = mapIconGlyph(name, name || '');
+      this.setData({ wrapperStyle, contentStyle, iconText });
+    },
+  },
+});

package/src/components/card-layout/elements/icon-element/index.wxml

@@ -0,0 +1,5 @@
+<view class="km-node km-node--icon" style="{{wrapperStyle}}">
+  <view class="km-node__icon icon" style="{{contentStyle}}">
+    {{iconText}}
+  </view>
+</view>

package/src/components/card-layout/elements/icon-element/index.wxss

@@ -0,0 +1,37 @@
+.km-node {
+  box-sizing: border-box;
+  color: inherit;
+}
+
+.km-node--icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.km-node__icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+  font-family: 'km-icon', 'PingFang SC', 'Microsoft Yahei', sans-serif;
+  font-style: normal;
+  font-weight: normal;
+}
+
+@font-face {
+  font-family: 'km-icon';
+  src: url('data:font/woff;charset=utf-8;base64,d09GRgABAAAAAEl4AA0AAAAAcmgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAABJXAAAABoAAAAcrMtJV0dERUYAAEk8AAAAHgAAAB4AKQByT1MvMgAAAaQAAABGAAAAYDw3SVljbWFwAAAC7AAAAM8AAAIW8XL3K2dhc3AAAEk0AAAACAAAAAj//wADZ2x5ZgAABJgAAEBZAABkZPJymXJoZWFkAAABMAAAADEAAAA2MtZiFmhoZWEAAAFkAAAAIAAAACQNagmCaG10eAAAAewAAAD/AAABqqs3Ii9sb2NhAAADvAAAANoAAADaKv0P7G1heHAAAAGEAAAAHwAAACABmQHEbmFtZQAARPQAAAFGAAACgl6CAQJwb3N0AABGPAAAAvUAAATh1g15W3jaY2BkYGAA4lqffPd4fpuvDNwsDCDwVIyfA0b///i/gXMWcyeQy8HABBIFAAVdCfwAAAB42mNgZGBgbvjfwBDDOfP/x///OWcxAEVQQCYAuxgH/XjaY2BkYGDIYdzBoMwAAkxAzAWEDAz/wXwGACjlAl8AeNpjYGFRYJzAwMrAwNTJdIaBgaEfQjO+ZjBi5ACKMrAyM2AFAWmuKQwHnjE+y2Ju+N/AwMB8h6ERKMyIpESBgREAenQNCwAAeNo90cErBGEYx/Hf1LMH7MVxoigHtS600pzWnMjBlt2dFAeiNuWgXLgokgslbpyE/Aduyl38J3ty4aCs7/vOk6lPv+d5531n3nfGVF5JIZlUx9fAbawnEfIFq14/YhddFPjFmynZ9n4TbYzg2tcMW6Epr4NQT3jSJ2lcW9ec1fSEAheMnVume7KKBbQwiMye+5/kEpqYwQoOY59pn1xGw3Lt8NwHS7UY35frivqbet2fNYZp+4j76vj+GpUhjZJreLfxODecay/eTzVPzmIj9uX7VLnUmfdb/2fN4trcv0kYv8Oxe/V5Rzhg7inZ8wzjN5b0f6z8PV2d/AHivi0JAHja3dBFUoVRDITR88PD3d3d3d3d3d33zQqYwwVGbIGk8qV6kK7qIN7vlIsCRdlBRT865iPsWOig318/PwOjbwYd+7mKSZAoSbIUqdKky5ApS7YcufLkK1CoSLESpcqCZ4VKVarVqFWnXoNGTZq1aNWmXYdOXbr16NWn34BBQ4aNGDVm3IRJU6bNmDVn3oJFS5atWLVm3YZNW7bt2LVn34FDR46dOHXm3IVLV67duHXn3oNHT8Hv2YtXbyFaot9HfMeMC4jztyL/vr4AXx4eawAAAAAAAAAAAACwAPIDSgQ8BLIFUgWUBcIF/gY8BpIHCgdAB3wHoAgOCHAIxgk+CV4JzAnqCkQKrgtUC8QMEAxsDNQNFA1SDegONg6qDyQPgg/CEAIQxBEwEaQSHBLYE14T4hRcFPIVTBYMFkwWqBckGGAYxhmYGegaEBpeGuIbXhvwHPQd5B62Hygf6CBeILog9CFUIbgiBCJ0ItQjbCQSJGgkuCVsJcImKib0J44ocijOKSApUCo2KmQqtituK34sJixkLMgtdC3WLpgvPC+QMBww/DGCMagyMgAA') format('woff');
+  font-weight: normal;
+  font-style: normal;
+  font-display: swap;
+}
+
+.icon {
+  font-family: 'km-icon' !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}

package/src/components/card-layout/elements/image-element/index.json

@@ -0,0 +1,3 @@
+{
+  "component": true
+}