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

package/src/vendor/km-card-layout-core/types.d.ts

@@ -6,14 +6,22 @@
 export * from './interface';
 
 import type {
-  BindingContext,
   CardElement,
   CardLayoutInput,
   CardLayoutSchema,
-  RenderNode,
-  RenderResult,
+  TemplateItem,
+  TemplateBackground
 } from './interface';
 
+export type Config = {
+  showAvatar: boolean;
+  showLogo: boolean;
+  /**
+   * 当前背景 (0 为正面背景 1 为背面背景)
+   */
+  currentBg: TemplateBackground[];
+};
+
 export function addUnit(
   value: string | number | undefined | null,
   unit: 'px' | 'rpx'
@@ -57,8 +65,7 @@ export function areChildrenEqual(
 
 export function resolveBindingValue(
   binding: string | undefined,
-  rootData: Record<string, any>,
-  context?: BindingContext
+  rootData: Record<string, any>
 ): any;
 
 export function stripLayoutBindings(
@@ -137,15 +144,67 @@ export function updateElementsStyle(
   updates: Record<string, any>
 ): CardLayoutSchema;
 
-export function buildRenderNodes(
-  children: CardElement[],
-  data: Record<string, any>,
-  unit?: 'px' | 'rpx',
-  context?: BindingContext
-): RenderNode[];
+export function buildWrapperStyle(
+  el: CardElement,
+  unit?: 'px' | 'rpx'
+): Record<string, any>;
+
+export function buildCardStyle(
+  layout: CardLayoutSchema,
+  unit?: 'px' | 'rpx'
+): Record<string, any>;
 
-export function buildRenderResult(
-  layout: CardLayoutInput,
-  data: Record<string, any>,
+export function buildBackgroundStyle(
+  layout: CardLayoutSchema,
   unit?: 'px' | 'rpx'
-): RenderResult;
+): Record<string, any>;
+
+export function buildBaseContentStyle(
+  el: CardElement
+): Record<string, any>;
+
+export function buildPanelContentStyle(
+  el: import('./interface/elements').LayoutPanelElement,
+  unit?: 'px' | 'rpx'
+): Record<string, any>;
+
+export function buildTextContentStyle(
+  el: import('./interface/elements').TextElement,
+  unit?: 'px' | 'rpx'
+): Record<string, any>;
+
+export function buildImageContentStyle(
+  el: import('./interface/elements').ImageElement
+): Record<string, any>;
+
+export function getTextValue(
+  el: import('./interface/elements').TextElement,
+  data?: Record<string, any>
+): string;
+
+export function getImageSrc(
+  el: import('./interface/elements').ImageElement,
+  data?: Record<string, any>
+): string;
+
+export function getIconName(
+  el: import('./interface/elements').IconElement
+): string;
+
+export function buildTextIconMeta(
+  el: import('./interface/elements').TextElement,
+  unit?: 'px' | 'rpx'
+): {
+  name: string;
+  size?: string;
+  gap?: string;
+  color?: string;
+  align: 'left' | 'right';
+  wrapperStyle?: Record<string, any>;
+} | null;
+
+export function buildRenderData (
+  layout: CardLayoutSchema[],
+  items: TemplateItem[],
+  config: Config
+): CardLayoutSchema[];

package/src/vendor/km-card-layout-core/utils.ts

@@ -1,3 +1,5 @@
+
+
 export * from './bindings';
 export {
   backgroundChange,
@@ -7,3 +9,5 @@ export {
   resolveSpecialStyle,
   DEFAULT_DECOR_COLOR,
 } from './ops/changeBackground';
+
+

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

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

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

@@ -1,210 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.buildRenderResult = exports.buildRenderNodes = void 0;
-const helpers_1 = require("../helpers");
-const layout_1 = require("../layout");
-const data_1 = require("../data");
-const buildCardStyle = (layout, unit) => (0, helpers_1.styleObjectToString)({
-    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',
-}, unit);
-const buildBackgroundStyle = (layout, unit) => (0, helpers_1.styleObjectToString)({
-    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,
-}, unit);
-const buildWrapperStyle = (el, unit) => {
-    const abs = (0, layout_1.getAbsLayout)(el);
-    if (!abs)
-        return '';
-    return (0, helpers_1.styleObjectToString)({
-        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',
-    }, unit);
-};
-const buildPanelContentStyle = (el, unit) => (0, helpers_1.styleObjectToString)({
-    position: 'relative',
-    width: '100%',
-    height: '100%',
-    display: 'block',
-    boxSizing: 'border-box',
-    ...(el.style || {}),
-}, unit);
-const buildTextContentStyle = (el, unit) => {
-    var _a, _b, _c;
-    const textAlign = ((_a = el.style) === null || _a === void 0 ? void 0 : _a.textAlign) || el.align || undefined;
-    const style = {
-        ...(el.style || {}),
-        whiteSpace: 'pre-wrap',
-        wordBreak: 'break-word',
-        lineHeight: ((_b = el.style) === null || _b === void 0 ? void 0 : _b.lineHeight) !== undefined && ((_c = el.style) === null || _c === void 0 ? void 0 : _c.lineHeight) !== null
-            ? el.style.lineHeight
-            : '1',
-    };
-    if (textAlign)
-        style.textAlign = textAlign;
-    return (0, helpers_1.styleObjectToString)(style, unit);
-};
-const buildBaseContentStyle = (el, unit) => (0, helpers_1.styleObjectToString)({
-    ...(el.style || {}),
-    boxSizing: 'border-box',
-}, unit);
-const buildImageContentStyle = (el, unit) => {
-    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 (0, helpers_1.styleObjectToString)(style, unit);
-};
-const buildTextIcon = (el, unit) => {
-    var _a, _b, _c, _d;
-    const icon = el.icon;
-    if (!icon || icon.enable === false)
-        return undefined;
-    const style = icon.style || 'fill';
-    const baseName = 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 undefined;
-    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}`,
-        text: `${name}`,
-        size: (0, helpers_1.addUnit)(size, unit),
-        gap: (0, helpers_1.addUnit)(gap, unit),
-        color: color,
-        align: icon.align || 'left',
-        wrapperStyle: (0, helpers_1.styleObjectToString)({
-            display: 'inline-flex',
-            alignItems: 'center',
-            height: ((_d = el.style) === null || _d === void 0 ? void 0 : _d.lineHeight) || '1',
-        }, unit),
-    };
-};
-const buildNode = (el, rootData, unit, context) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h;
-    if (!el || el.visible === false)
-        return null;
-    const wrapperStyle = buildWrapperStyle(el, unit);
-    if (el.type === 'layout-panel') {
-        return {
-            id: el.id,
-            type: el.type,
-            visible: el.visible,
-            wrapperStyle,
-            contentStyle: buildPanelContentStyle(el, unit),
-            children: (0, exports.buildRenderNodes)(el.children || [], rootData, unit, context),
-        };
-    }
-    const baseStyle = buildBaseContentStyle(el, unit);
-    if (el.type === 'text') {
-        const value = (_b = (_a = (0, data_1.resolveBindingValue)(el.binding, rootData, context)) !== null && _a !== void 0 ? _a : el.defaultValue) !== null && _b !== void 0 ? _b : '';
-        return {
-            id: el.id,
-            type: el.type,
-            wrapperStyle,
-            contentStyle: buildTextContentStyle(el, unit),
-            text: `${value}`,
-            visible: el.visible,
-            icon: buildTextIcon(el, unit),
-        };
-    }
-    if (el.type === 'image') {
-        const src = (_e = (_d = (_c = (0, data_1.resolveBindingValue)(el.binding, rootData, context)) !== null && _c !== void 0 ? _c : el.defaultUrl) !== null && _d !== void 0 ? _d : el.defaultValue) !== null && _e !== void 0 ? _e : '';
-        const mode = el.fit === 'contain' ? 'aspectFit' : 'aspectFill';
-        return {
-            id: el.id,
-            type: el.type,
-            wrapperStyle,
-            contentStyle: buildImageContentStyle(el, unit),
-            src,
-            mode,
-            visible: el.visible,
-        };
-    }
-    if (el.type === 'icon') {
-        const name = (_h = (_g = (_f = (0, data_1.resolveBindingValue)(el.binding, rootData, context)) !== null && _f !== void 0 ? _f : el.name) !== null && _g !== void 0 ? _g : el.defaultValue) !== null && _h !== void 0 ? _h : '';
-        return {
-            id: el.id,
-            type: el.type,
-            wrapperStyle,
-            contentStyle: baseStyle,
-            name: `${name}`,
-            text: `${name}`,
-            visible: el.visible,
-        };
-    }
-    if (el.type === 'custom') {
-        return {
-            id: el.id,
-            type: el.type,
-            wrapperStyle,
-            contentStyle: baseStyle,
-            visible: el.visible,
-        };
-    }
-    return null;
-};
-const buildRenderNodes = (children, rootData, unit = 'px', context = {}) => {
-    if (!Array.isArray(children))
-        return [];
-    const nodes = [];
-    children.forEach(el => {
-        if (!el || el.visible === false)
-            return;
-        const node = buildNode(el, rootData, unit, context);
-        if (node)
-            nodes.push(node);
-    });
-    return nodes;
-};
-exports.buildRenderNodes = buildRenderNodes;
-const buildRenderResult = (layoutInput, dataInput, unit = 'px') => {
-    const layouts = (0, layout_1.normalizeLayout)(layoutInput);
-    return layouts.map(layout => {
-        const cardStyle = buildCardStyle(layout, unit);
-        const bgStyle = buildBackgroundStyle(layout, unit);
-        const renderTree = (0, exports.buildRenderNodes)(layout.children || [], dataInput || {}, unit);
-        return {
-            renderTree,
-            cardStyle,
-            backgroundImage: layout.backgroundImage || '',
-            backgroundStyle: bgStyle,
-        };
-    });
-};
-exports.buildRenderResult = buildRenderResult;

package/src/vendor/km-card-layout-core/interface/render.ts

@@ -1,53 +0,0 @@
-import type { CardElementType, CardElement } from './elements';
-import type { CardLayoutInput, CardLayoutSchema } from './layout';
-
-export interface RenderNodeIcon {
-  name: string;
-  text?: string;
-  size?: string;
-  color?: string;
-  gap?: string;
-  align?: 'left' | 'right';
-  wrapperStyle?: string;
-}
-
-export interface RenderNode {
-  id: string;
-  type: CardElementType | 'text';
-  wrapperStyle: string;
-  contentStyle: string;
-  name?: string;
-  text?: string;
-  src?: string;
-  mode?: string;
-  children?: RenderNode[];
-  visible?: boolean;
-  icon?: RenderNodeIcon;
-}
-
-export interface RenderPageResult {
-  renderTree: RenderNode[];
-  cardStyle: string;
-  backgroundImage: string;
-  backgroundStyle: string;
-}
-
-export type RenderResult = RenderPageResult[];
-
-export interface BindingContext {
-  /**
-   * 当前上下文数据的绑定前缀（预留给嵌套场景）
-   */
-  contextBinding?: string;
-  /**
-   * 当前上下文数据（预留给嵌套场景）
-   */
-  contextData?: any;
-}
-
-export type {
-  CardElement,
-  CardElementType,
-  CardLayoutInput,
-  CardLayoutSchema,
-};

package/src/vendor/km-card-layout-core/render/builder.ts

@@ -1,288 +0,0 @@
-import type {
-  CardElement,
-  IconElement,
-  ImageElement,
-  LayoutPanelElement,
-  TextElement,
-} from '../interface/elements';
-import type { CardLayoutSchema, CardLayoutInput } from '../interface/layout';
-import type {
-  BindingContext,
-  RenderNode,
-  RenderResult,
-} from '../interface/render';
-import { addUnit, styleObjectToString } from '../helpers';
-import { getAbsLayout, normalizeLayout } from '../layout';
-import { resolveBindingValue } from '../data';
-
-const buildCardStyle = (layout: CardLayoutSchema, unit: 'px' | 'rpx') =>
-  styleObjectToString(
-    {
-      width: addUnit(layout.width, unit),
-      height: addUnit(layout.height, unit),
-      color: layout.fontColor,
-      borderRadius:
-        layout.borderRadius !== undefined
-          ? addUnit(layout.borderRadius, unit)
-          : undefined,
-      padding:
-        layout.padding !== undefined ? addUnit(layout.padding, unit) : undefined,
-      position: 'relative',
-      overflow: 'hidden',
-      boxSizing: 'border-box',
-      backgroundColor: 'transparent',
-    },
-    unit
-  );
-
-const buildBackgroundStyle = (layout: CardLayoutSchema, unit: 'px' | 'rpx') =>
-  styleObjectToString(
-    {
-      zIndex: layout.backgroundZIndex,
-      borderRadius:
-        layout.borderRadius !== undefined
-          ? addUnit(layout.borderRadius, unit)
-          : undefined,
-      width: '100%',
-      height: '100%',
-      position: 'absolute',
-      left: 0,
-      top: 0,
-    },
-    unit
-  );
-
-const buildWrapperStyle = (el: CardElement, unit: 'px' | 'rpx'): string => {
-  const abs = getAbsLayout(el);
-  if (!abs) return '';
-  return styleObjectToString(
-    {
-      position: 'absolute',
-      left: addUnit(abs.x, unit),
-      top: addUnit(abs.y, unit),
-      width: addUnit(abs.width, unit),
-      height: addUnit(abs.height, unit),
-      zIndex: abs.zIndex,
-      boxSizing: 'border-box',
-    },
-    unit
-  );
-};
-
-const buildPanelContentStyle = (
-  el: LayoutPanelElement,
-  unit: 'px' | 'rpx'
-) =>
-  styleObjectToString(
-    {
-      position: 'relative',
-      width: '100%',
-      height: '100%',
-      display: 'block',
-      boxSizing: 'border-box',
-      ...(el.style || {}),
-    },
-    unit
-  );
-
-const buildTextContentStyle = (el: TextElement, unit: 'px' | 'rpx') => {
-  const textAlign =
-    (el.style?.textAlign as string | undefined) || el.align || undefined;
-  const style: Record<string, any> = {
-    ...(el.style || {}),
-    whiteSpace: 'pre-wrap',
-    wordBreak: 'break-word',
-    lineHeight:
-      el.style?.lineHeight !== undefined && el.style?.lineHeight !== null
-        ? el.style.lineHeight
-        : '1',
-  };
-  if (textAlign) style.textAlign = textAlign;
-  return styleObjectToString(style, unit);
-};
-
-const buildBaseContentStyle = (el: CardElement, unit: 'px' | 'rpx') =>
-  styleObjectToString(
-    {
-      ...(el.style || {}),
-      boxSizing: 'border-box',
-    },
-    unit
-  );
-
-const buildImageContentStyle = (el: ImageElement, unit: 'px' | 'rpx') => {
-  const style: Record<string, any> = { ...(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 styleObjectToString(style, unit);
-};
-
-const buildTextIcon = (
-  el: TextElement,
-  unit: 'px' | 'rpx'
-): RenderNode['icon'] | undefined => {
-  const icon = el.icon;
-  if (!icon || icon.enable === false) return undefined;
-
-  const style = icon.style || 'fill';
-  const baseName = el.key || el.binding || el.id;
-  let name: string | undefined;
-  if (style === 'dot') name = 'round';
-  else if (style === 'line') name = baseName ? `${baseName}-line` : undefined;
-  else name = baseName || undefined;
-  if (!name) return undefined;
-
-  const size =
-    icon.size !== undefined && icon.size !== null
-      ? icon.size
-      : (el.style?.fontSize as any);
-  const gap = icon.gap !== undefined && icon.gap !== null ? icon.gap : 4;
-  const color =
-    icon.color ??
-    ((typeof el.style?.color === 'string' ? el.style.color : undefined) as
-      | string
-      | undefined);
-
-  return {
-    name: `${name}`,
-    text: `${name}`,
-    size: addUnit(size as any, unit),
-    gap: addUnit(gap as any, unit),
-    color: color as any,
-    align: icon.align || 'left',
-    wrapperStyle: styleObjectToString(
-      {
-        display: 'inline-flex',
-        alignItems: 'center',
-        height: el.style?.lineHeight || '1',
-      },
-      unit
-    ),
-  };
-};
-
-const buildNode = (
-  el: CardElement,
-  rootData: Record<string, any>,
-  unit: 'px' | 'rpx',
-  context: BindingContext
-): RenderNode | null => {
-  if (!el || el.visible === false) return null;
-  const wrapperStyle = buildWrapperStyle(el, unit);
-
-  if (el.type === 'layout-panel') {
-    return {
-      id: el.id,
-      type: el.type,
-      visible: el.visible,
-      wrapperStyle,
-      contentStyle: buildPanelContentStyle(el as LayoutPanelElement, unit),
-      children: buildRenderNodes(el.children || [], rootData, unit, context),
-    };
-  }
-
-  const baseStyle = buildBaseContentStyle(el, unit);
-  if (el.type === 'text') {
-    const value =
-      resolveBindingValue(el.binding, rootData, context) ??
-      el.defaultValue ??
-      '';
-    return {
-      id: el.id,
-      type: el.type,
-      wrapperStyle,
-      contentStyle: buildTextContentStyle(el as TextElement, unit),
-      text: `${value}`,
-      visible: el.visible,
-      icon: buildTextIcon(el as TextElement, unit),
-    };
-  }
-
-  if (el.type === 'image') {
-    const src =
-      resolveBindingValue(el.binding, rootData, context) ??
-      (el as ImageElement).defaultUrl ??
-      el.defaultValue ??
-      '';
-    const mode =
-      (el as ImageElement).fit === 'contain' ? 'aspectFit' : 'aspectFill';
-    return {
-      id: el.id,
-      type: el.type,
-      wrapperStyle,
-      contentStyle: buildImageContentStyle(el as ImageElement, unit),
-      src,
-      mode,
-      visible: el.visible,
-    };
-  }
-
-  if (el.type === 'icon') {
-    const name =
-      resolveBindingValue(el.binding, rootData, context) ??
-      (el as IconElement).name ??
-      el.defaultValue ??
-      '';
-    return {
-      id: el.id,
-      type: el.type,
-      wrapperStyle,
-      contentStyle: baseStyle,
-      name: `${name}`,
-      text: `${name}`,
-      visible: el.visible,
-    };
-  }
-
-  if (el.type === 'custom') {
-    return {
-      id: el.id,
-      type: el.type,
-      wrapperStyle,
-      contentStyle: baseStyle,
-      visible: el.visible,
-    };
-  }
-
-  return null;
-};
-
-export const buildRenderNodes = (
-  children: CardElement[],
-  rootData: Record<string, any>,
-  unit: 'px' | 'rpx' = 'px',
-  context: BindingContext = {}
-): RenderNode[] => {
-  if (!Array.isArray(children)) return [];
-
-  const nodes: RenderNode[] = [];
-  children.forEach(el => {
-    if (!el || el.visible === false) return;
-    const node = buildNode(el, rootData, unit, context);
-    if (node) nodes.push(node);
-  });
-
-  return nodes;
-};
-
-export const buildRenderResult = (
-  layoutInput: CardLayoutInput,
-  dataInput: Record<string, any>,
-  unit: 'px' | 'rpx' = 'px'
-): RenderResult => {
-  const layouts = normalizeLayout(layoutInput);
-  return layouts.map(layout => {
-    const cardStyle = buildCardStyle(layout, unit);
-    const bgStyle = buildBackgroundStyle(layout, unit);
-    const renderTree = buildRenderNodes(layout.children || [], dataInput || {}, unit);
-    return {
-      renderTree,
-      cardStyle,
-      backgroundImage: layout.backgroundImage || '',
-      backgroundStyle: bgStyle,
-    };
-  });
-};