@open-feishu-card/renderer 0.2.6 → 0.2.8

package/dist/index.cjs

@@ -514,8 +514,6 @@ function vnodeToDom(node, doc) {
   }
   return el;
 }
-
-// src/registry.ts
 var registry = {};
 function registerComponent(tag, fn) {
   registry[tag] = fn;
@@ -563,7 +561,7 @@ function resolveTextFontToken(raw) {
 function textStyleToModifiers(textStyle) {
   if (!textStyle) return [];
   const out = [];
-  const color = textStyle.color?.trim();
+  const color = adapter.resolveTextStyleColor(textStyle) ?? textStyle?.color?.trim();
   if (color && color !== "default" && !/^(#|rgb|hsl)/i.test(color)) out.push(color);
   const attrs = textStyle.attributes || [];
   if (attrs.includes("bold")) out.push("bold");
@@ -578,11 +576,12 @@ function textStyleToStyle(textStyle) {
   if (attrs.includes("bold")) style.fontWeight = "600";
   if (attrs.includes("italic")) style.fontStyle = "italic";
   if (attrs.includes("strikethrough")) style.textDecoration = "line-through";
-  if (textStyle.color) {
-    const token = resolveTextFontToken(textStyle.color);
+  const color = adapter.resolveTextStyleColor(textStyle) ?? textStyle.color;
+  if (color) {
+    const token = resolveTextFontToken(color);
     if (token) style.color = `var(--${token})`;
     else {
-      const c = resolveColor(textStyle.color);
+      const c = resolveColor(color);
       if (c) style.color = c;
     }
   }
@@ -723,6 +722,16 @@ function bgStyleToColor(style) {
   if (v === "grey" || v === "gray" || v === "1") return "var(--bg-float-overlay)";
   return resolveColor(v) || null;
 }
+function propertyBackgroundColor(property) {
+  if (!property) return null;
+  const custom = adapter.resolveCustomBackgroundLight(property);
+  if (custom) {
+    const c = resolveColor(custom);
+    if (c) return c;
+  }
+  const p = property;
+  return bgStyleToColor(p.backgroundStyle ?? p.background_style);
+}
 
 // src/chart-hydrate.ts
 var CHART_SPEC_ATTR = "data-feishu-chart-spec";
@@ -5476,7 +5485,7 @@ function registerBuiltins() {
     }
     const mg = boxToStyle(p.margin);
     if (mg) style.margin = mg;
-    const bg = bgStyleToColor(p.backgroundStyle ?? p.background_style);
+    const bg = propertyBackgroundColor(p);
     if (bg) style.background = bg;
     const pad = boxToStyle(p.padding);
     if (pad) style.padding = pad;
@@ -5512,7 +5521,7 @@ function registerBuiltins() {
     }
     const vGap = p.verticalSpacingValue?.value ?? p.vertical_spacing;
     style.rowGap = (vGap != null ? spacingToPx(vGap) : 8) + "px";
-    const bg = bgStyleToColor(p.backgroundStyle ?? p.background_style);
+    const bg = propertyBackgroundColor(p);
     if (bg) style.background = bg;
     const pad = boxToStyle(p.padding);
     if (pad) style.padding = pad;
@@ -5685,7 +5694,7 @@ function registerBuiltins() {
     const hasBorder = borderColor != null || p.hasBorder === true;
     const cls = `${CLS}-interactive-container` + (hasBorder && !borderColor ? ` ${CLS}-interactive-container--bordered` : "") + (disabled ? ` ${CLS}-interactive-container--disabled` : "");
     const style = {};
-    const bg = bgStyleToColor(p.backgroundStyle ?? p.background_style);
+    const bg = propertyBackgroundColor(p);
     if (bg) style.background = bg;
     const pad = boxToStyle(p.padding);
     if (pad) style.padding = pad;

package/dist/index.js

@@ -1,4 +1,4 @@
-import { dslToRaw } from '@open-feishu-card/adapter';
+import { dslToRaw, resolveTextStyleColor, resolveCustomBackgroundLight } from '@open-feishu-card/adapter';
 export { dslToRaw } from '@open-feishu-card/adapter';
 
 // src/constants.ts
@@ -513,8 +513,6 @@ function vnodeToDom(node, doc) {
   }
   return el;
 }
-
-// src/registry.ts
 var registry = {};
 function registerComponent(tag, fn) {
   registry[tag] = fn;
@@ -562,7 +560,7 @@ function resolveTextFontToken(raw) {
 function textStyleToModifiers(textStyle) {
   if (!textStyle) return [];
   const out = [];
-  const color = textStyle.color?.trim();
+  const color = resolveTextStyleColor(textStyle) ?? textStyle?.color?.trim();
   if (color && color !== "default" && !/^(#|rgb|hsl)/i.test(color)) out.push(color);
   const attrs = textStyle.attributes || [];
   if (attrs.includes("bold")) out.push("bold");
@@ -577,11 +575,12 @@ function textStyleToStyle(textStyle) {
   if (attrs.includes("bold")) style.fontWeight = "600";
   if (attrs.includes("italic")) style.fontStyle = "italic";
   if (attrs.includes("strikethrough")) style.textDecoration = "line-through";
-  if (textStyle.color) {
-    const token = resolveTextFontToken(textStyle.color);
+  const color = resolveTextStyleColor(textStyle) ?? textStyle.color;
+  if (color) {
+    const token = resolveTextFontToken(color);
     if (token) style.color = `var(--${token})`;
     else {
-      const c = resolveColor(textStyle.color);
+      const c = resolveColor(color);
       if (c) style.color = c;
     }
   }
@@ -722,6 +721,16 @@ function bgStyleToColor(style) {
   if (v === "grey" || v === "gray" || v === "1") return "var(--bg-float-overlay)";
   return resolveColor(v) || null;
 }
+function propertyBackgroundColor(property) {
+  if (!property) return null;
+  const custom = resolveCustomBackgroundLight(property);
+  if (custom) {
+    const c = resolveColor(custom);
+    if (c) return c;
+  }
+  const p = property;
+  return bgStyleToColor(p.backgroundStyle ?? p.background_style);
+}
 
 // src/chart-hydrate.ts
 var CHART_SPEC_ATTR = "data-feishu-chart-spec";
@@ -5475,7 +5484,7 @@ function registerBuiltins() {
     }
     const mg = boxToStyle(p.margin);
     if (mg) style.margin = mg;
-    const bg = bgStyleToColor(p.backgroundStyle ?? p.background_style);
+    const bg = propertyBackgroundColor(p);
     if (bg) style.background = bg;
     const pad = boxToStyle(p.padding);
     if (pad) style.padding = pad;
@@ -5511,7 +5520,7 @@ function registerBuiltins() {
     }
     const vGap = p.verticalSpacingValue?.value ?? p.vertical_spacing;
     style.rowGap = (vGap != null ? spacingToPx(vGap) : 8) + "px";
-    const bg = bgStyleToColor(p.backgroundStyle ?? p.background_style);
+    const bg = propertyBackgroundColor(p);
     if (bg) style.background = bg;
     const pad = boxToStyle(p.padding);
     if (pad) style.padding = pad;
@@ -5684,7 +5693,7 @@ function registerBuiltins() {
     const hasBorder = borderColor != null || p.hasBorder === true;
     const cls = `${CLS}-interactive-container` + (hasBorder && !borderColor ? ` ${CLS}-interactive-container--bordered` : "") + (disabled ? ` ${CLS}-interactive-container--disabled` : "");
     const style = {};
-    const bg = bgStyleToColor(p.backgroundStyle ?? p.background_style);
+    const bg = propertyBackgroundColor(p);
     if (bg) style.background = bg;
     const pad = boxToStyle(p.padding);
     if (pad) style.padding = pad;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@open-feishu-card/renderer",
-  "version": "0.2.6",
+  "version": "0.2.8",
   "description": "零框架依赖的飞书卡片渲染引擎：Web / DOM / SSR，输入 RAW 或公开 DSL，输出真实 DOM 或 HTML 字符串",
   "type": "module",
   "main": "./dist/index.cjs",
@@ -28,7 +28,7 @@
     "./dist/*.cjs"
   ],
   "dependencies": {
-    "@open-feishu-card/adapter": "0.3.1"
+    "@open-feishu-card/adapter": "0.3.3"
   },
   "devDependencies": {
     "tsup": "^8.3.5",