@open-feishu-card/renderer 0.2.26 → 0.2.28

package/dist/all.css

@@ -384,14 +384,9 @@
   flex-shrink: 0; height: 1.2em; color: inherit;
 }
 .universal-card-button__icon .universal-card-icon { color: inherit; }
-/* default 宽度：按内容收缩。列是 flex column（默认 align-items:stretch），
-   body 又有 > * { width:100% }，不加这两条会被撑满所在列。 */
-.universal-card-button:not(.universal-card-button--block) {
-  width: auto;
-  max-width: 100%;
-  align-self: flex-start;
-}
-/* fill（width:"fill"）：撑满所在列 */
+/* 宽度：对齐真机——body > * { width:100% }、列 flex stretch 会把按钮撑满所在行/列。
+   不再强制 width:auto（那是网页版观感；真机独立成行的按钮默认占满整行）。
+   width:"fill" 显式挂 --block，与缺省撑满同宽，并供 margin calc 识别。 */
 .universal-card-button--block { width: 100%; }
 
 /* —— outlined 描边族 —— */
@@ -413,11 +408,12 @@
 }
 .universal-card-button--danger:not(.universal-card-button--static):hover { background: #fef0f0; }
 
-/* —— text 纯文字族（无边框/无底色，按内容宽） —— */
+/* —— text 纯文字族（无边框/无底色；撑满时文字靠左，对齐真机） —— */
 .universal-card-button--text,
 .universal-card-button--primary_text,
 .universal-card-button--danger_text {
   border-color: transparent; background: transparent; padding: 4px 8px;
+  justify-content: flex-start;
 }
 .universal-card-button--text { color: #1f2329; }
 .universal-card-button--primary_text { color: #1456f0; }

package/dist/index.cjs

@@ -392,16 +392,36 @@ var TABLE_HEAD_BG = {
   default: "transparent"
 };
 var CHART_PALETTE = [
-  "#1664FF",
-  "#1AC6FF",
-  "#FF8A00",
-  "#3CC780",
-  "#7442D4",
-  "#FFC400",
-  "#304D77",
-  "#B48DEB",
-  "#009488",
-  "#FF7DDA"
+  "#4e83fd",
+  "#50cefb",
+  "#935af6",
+  "#fad355",
+  "#f76964",
+  "#ffa53d",
+  "#82a7fc",
+  "#7edafb",
+  "#ad82f7",
+  "#f7dc82",
+  "#f98e8b",
+  "#ffba6b",
+  "#3370ff",
+  "#14c0ff",
+  "#7f3bf5",
+  "#ffc60a",
+  "#f54a45",
+  "#ff8800",
+  "#bacefd",
+  "#b1e8fc",
+  "#cdb2fa",
+  "#f8e6ab",
+  "#fbbfbc",
+  "#fed4a4",
+  "#245bdb",
+  "#049fd7",
+  "#6425d0",
+  "#dc9b04",
+  "#d83931",
+  "#de7802"
 ];
 var CHART_DEFAULT_ASPECT_RATIO = "16:9";
 var CHART_MIN_HEIGHT = 150;
@@ -686,6 +706,25 @@ function personAvatarSrc(person, ctx) {
   const suffix = ctx.options.avatarURLSuffix ?? PERSON_AVATAR_SUFFIX;
   return base + person.avatar_key + suffix;
 }
+var HORIZONTAL_SPACING_PX = { small: 4, default: 8, large: 12 };
+var VERTICAL_SPACING_PX = { default: 8, medium: 12, large: 16 };
+function namedSpacingToPx(v, map) {
+  const named = map[v];
+  if (named != null) return named;
+  const m = /^(-?\d+(?:\.\d+)?)(?:px)?$/.exec(v.trim());
+  if (m) return Number(m[1]);
+  return map.default ?? 8;
+}
+function horizontalSpacingToPx(v) {
+  if (typeof v === "number") return v;
+  if (typeof v === "string") return namedSpacingToPx(v, HORIZONTAL_SPACING_PX);
+  return HORIZONTAL_SPACING_PX.default;
+}
+function verticalSpacingToPx(v) {
+  if (typeof v === "number") return v;
+  if (typeof v === "string") return namedSpacingToPx(v, VERTICAL_SPACING_PX);
+  return VERTICAL_SPACING_PX.default;
+}
 function spacingToPx(v) {
   if (typeof v === "number") return v;
   if (typeof v === "string") {
@@ -1313,14 +1352,9 @@ var BASE_STYLES_CSS = `/**
   flex-shrink: 0; height: 1.2em; color: inherit;
 }
 .universal-card-button__icon .universal-card-icon { color: inherit; }
-/* default \u5BBD\u5EA6\uFF1A\u6309\u5185\u5BB9\u6536\u7F29\u3002\u5217\u662F flex column\uFF08\u9ED8\u8BA4 align-items:stretch\uFF09\uFF0C
-   body \u53C8\u6709 > * { width:100% }\uFF0C\u4E0D\u52A0\u8FD9\u4E24\u6761\u4F1A\u88AB\u6491\u6EE1\u6240\u5728\u5217\u3002 */
-.universal-card-button:not(.universal-card-button--block) {
-  width: auto;
-  max-width: 100%;
-  align-self: flex-start;
-}
-/* fill\uFF08width:"fill"\uFF09\uFF1A\u6491\u6EE1\u6240\u5728\u5217 */
+/* \u5BBD\u5EA6\uFF1A\u5BF9\u9F50\u771F\u673A\u2014\u2014body > * { width:100% }\u3001\u5217 flex stretch \u4F1A\u628A\u6309\u94AE\u6491\u6EE1\u6240\u5728\u884C/\u5217\u3002
+   \u4E0D\u518D\u5F3A\u5236 width:auto\uFF08\u90A3\u662F\u7F51\u9875\u7248\u89C2\u611F\uFF1B\u771F\u673A\u72EC\u7ACB\u6210\u884C\u7684\u6309\u94AE\u9ED8\u8BA4\u5360\u6EE1\u6574\u884C\uFF09\u3002
+   width:"fill" \u663E\u5F0F\u6302 --block\uFF0C\u4E0E\u7F3A\u7701\u6491\u6EE1\u540C\u5BBD\uFF0C\u5E76\u4F9B margin calc \u8BC6\u522B\u3002 */
 .universal-card-button--block { width: 100%; }
 
 /* \u2014\u2014 outlined \u63CF\u8FB9\u65CF \u2014\u2014 */
@@ -1342,11 +1376,12 @@ var BASE_STYLES_CSS = `/**
 }
 .universal-card-button--danger:not(.universal-card-button--static):hover { background: #fef0f0; }
 
-/* \u2014\u2014 text \u7EAF\u6587\u5B57\u65CF\uFF08\u65E0\u8FB9\u6846/\u65E0\u5E95\u8272\uFF0C\u6309\u5185\u5BB9\u5BBD\uFF09 \u2014\u2014 */
+/* \u2014\u2014 text \u7EAF\u6587\u5B57\u65CF\uFF08\u65E0\u8FB9\u6846/\u65E0\u5E95\u8272\uFF1B\u6491\u6EE1\u65F6\u6587\u5B57\u9760\u5DE6\uFF0C\u5BF9\u9F50\u771F\u673A\uFF09 \u2014\u2014 */
 .universal-card-button--text,
 .universal-card-button--primary_text,
 .universal-card-button--danger_text {
   border-color: transparent; background: transparent; padding: 4px 8px;
+  justify-content: flex-start;
 }
 .universal-card-button--text { color: #1f2329; }
 .universal-card-button--primary_text { color: #1456f0; }
@@ -4899,7 +4934,7 @@ function parseInline(text) {
         if (attrs.show_name != null) property.showName = attrs.show_name !== "false";
         if (attrs.show_avatar != null) property.showAvatar = attrs.show_avatar !== "false";
         if (attrs.size) property.size = attrs.size;
-        if (attrs.style === "capsule") property.pillShaped = true;
+        if (attrs.style) property.style = attrs.style;
         out.push({ tag: "person_v1", property });
         i += m[0].length;
         continue;
@@ -5500,8 +5535,9 @@ function registerBuiltins() {
     const style = {};
     const pad = boxToStyle(p.padding);
     if (pad) style.padding = pad;
+    if (!pad && ctx.bodyPaddingTop != null) style.paddingTop = ctx.bodyPaddingTop + "px";
     const vGap = p.verticalSpacingValue?.value ?? p.vertical_spacing;
-    if (vGap != null) style.rowGap = spacingToPx(vGap) + "px";
+    if (vGap != null) style.rowGap = verticalSpacingToPx(vGap) + "px";
     const props = { className: `${CLS}-body` };
     if (Object.keys(style).length) props.style = style;
     return h("div", props, renderElements(getChildElements(el), ctx));
@@ -5511,7 +5547,8 @@ function registerBuiltins() {
     const tplKey = p.template || "default";
     const tpl = HEADER_TEMPLATE[tplKey] || HEADER_TEMPLATE.default;
     const tags = p.text_tag_list || p.textTagList;
-    const tagVNodes = Array.isArray(tags) && tags.length ? renderElements(tags, ctx) : [];
+    const tagCtx = { ...ctx, textMetrics: { fontSize: 16, lineHeight: 24 } };
+    const tagVNodes = Array.isArray(tags) && tags.length ? renderElements(tags.slice(0, 3), tagCtx) : [];
     const iconRaw = p.udIcon || p.icon;
     let iconVNode = null;
     if (iconRaw && iconRaw.tag) {
@@ -5521,6 +5558,21 @@ function registerBuiltins() {
       const inner = renderIcon(iconEl, ctx);
       if (inner) iconVNode = h("div", { className: `${CLS}-header__icon` }, inner);
     }
+    if (!iconVNode) {
+      const avatarEl = p.avatar;
+      const avatarSrc = avatarEl && avatarEl.property ? resolveImageSrc(avatarEl.property, ctx) : null;
+      if (avatarSrc) {
+        iconVNode = h(
+          "div",
+          { className: `${CLS}-header__icon` },
+          h("img", {
+            src: avatarSrc,
+            alt: "",
+            style: { width: "16px", height: "16px", borderRadius: "4px", objectFit: "cover" }
+          })
+        );
+      }
+    }
     const titleVNode = renderHeaderTextLeaf(p.title, ctx, `${CLS}-header__text-title`) ?? h("div", { className: `${CLS}-header__text-title` });
     const subtitleVNode = renderHeaderTextLeaf(p.subtitle, ctx, `${CLS}-header__text-subtitle`);
     const textChildren = [
@@ -5559,7 +5611,7 @@ function registerBuiltins() {
       )
     );
   });
-  registerComponent("markdown", (el, ctx) => {
+  function MarkdownComponent(el, ctx) {
     const p = el.property || {};
     const style = { ...alignToStyle(p.textAlign), ...textStyleToStyle(p.textStyle) };
     applyOuterMargin(style, p.margin);
@@ -5573,12 +5625,28 @@ function registerBuiltins() {
       style.lineHeight = lineHeight + "px";
     }
     const childCtx = { ...ctx, textMetrics: { fontSize, lineHeight } };
+    const linesStyle = lineClampStyle(p.lines ?? p.textLines);
     return h(
       "div",
       { className: `${CLS}-markdown`, style },
-      h("div", { className: `${CLS}-markdown__children` }, renderElements(p.elements, childCtx))
+      h("div", {
+        className: `${CLS}-markdown__children`,
+        style: Object.keys(linesStyle).length ? linesStyle : void 0
+      }, renderElements(p.elements, childCtx))
     );
-  });
+  }
+  registerComponent("markdown", MarkdownComponent);
+  registerComponent("markdown_v1", MarkdownComponent);
+  function lineClampStyle(lines) {
+    const n = Number(lines);
+    if (!Number.isFinite(n) || n <= 0) return {};
+    return {
+      display: "-webkit-box",
+      WebkitLineClamp: String(Math.floor(n)),
+      WebkitBoxOrient: "vertical",
+      overflow: "hidden"
+    };
+  }
   registerComponent("plain_text", (el) => {
     const p = el.property || {};
     const mods = textStyleToModifiers(p.textStyle);
@@ -5587,6 +5655,7 @@ function registerBuiltins() {
     delete style.fontWeight;
     delete style.fontStyle;
     delete style.textDecoration;
+    Object.assign(style, lineClampStyle(p.lines));
     return h("span", { className, style }, p.content != null ? String(p.content) : "");
   });
   registerComponent("br", () => h("br", {}));
@@ -5611,16 +5680,16 @@ function registerBuiltins() {
   registerComponent("column_set", (el, ctx) => {
     const p = el.property || {};
     const gapRaw = p.horizontalSpacingValue?.value ?? p.horizontal_spacing;
-    const gap = gapRaw != null ? spacingToPx(gapRaw) : 8;
+    const gap = gapRaw != null ? horizontalSpacingToPx(gapRaw) : 0;
     const flexMode = p.flexMode || p.flex_mode;
     const hAlign = p.horizontalAlign || p.horizontal_align;
     const style = {
       display: "flex",
       flexWrap: flexMode === "flow" || flexMode === "wrap" ? "wrap" : "nowrap",
-      columnGap: gap + "px",
       rowGap: "8px",
       alignItems: "stretch"
     };
+    if (gap > 0) style.columnGap = gap + "px";
     if (hAlign) {
       style.justifyContent = { left: "flex-start", center: "center", right: "flex-end" }[hAlign] || "flex-start";
     }
@@ -5638,7 +5707,8 @@ function registerBuiltins() {
       style.margin = "0";
       style.padding = "0";
     }
-    return h("div", { className: cls, style }, renderElements(p.columns, ctx));
+    const childCtx = { ...ctx, columnSet: { flexMode, gap } };
+    return h("div", { className: cls, style }, renderElements(p.columns, childCtx));
   });
   function isStateHost(el) {
     if (el.id === "card_state") return true;
@@ -5673,12 +5743,30 @@ function registerBuiltins() {
     } else {
       style.flexGrow = String(p.weight || 1);
     }
+    const cs = ctx.columnSet;
+    if (cs && cs.flexMode) {
+      const fm = String(cs.flexMode).toLowerCase();
+      const g = cs.gap || 0;
+      if (fm === "stretch") {
+        style.width = "100%";
+        style.flexGrow = "0";
+        style.flexBasis = "auto";
+      } else if (fm === "bisect") {
+        style.width = `calc(50% - ${g / 2}px)`;
+        style.flexGrow = "0";
+        style.flexBasis = "auto";
+      } else if (fm === "trisect") {
+        style.width = `calc(33.33% - ${2 * g / 3}px)`;
+        style.flexGrow = "0";
+        style.flexBasis = "auto";
+      }
+    }
     const vAlign = p.verticalAlign || p.vertical_align;
     if (vAlign) {
       style.justifyContent = { top: "flex-start", center: "center", bottom: "flex-end" }[vAlign] || "flex-start";
     }
     const vGap = p.verticalSpacingValue?.value ?? p.vertical_spacing;
-    style.rowGap = (vGap != null ? spacingToPx(vGap) : 8) + "px";
+    style.rowGap = (vGap != null ? verticalSpacingToPx(vGap) : 8) + "px";
     const bg = propertyBackgroundColor(p);
     if (bg) style.background = bg;
     const pad = boxToStyle(p.padding);
@@ -5886,7 +5974,7 @@ function registerBuiltins() {
     const radius = resolveCornerRadius(p);
     if (radius != null) style.borderRadius = radius;
     const vGap = p.verticalSpacingValue?.value ?? p.vertical_spacing;
-    if (vGap != null) style.rowGap = spacingToPx(vGap) + "px";
+    if (vGap != null) style.rowGap = verticalSpacingToPx(vGap) + "px";
     const icWv = p.widthValue;
     const icHv = p.heightValue;
     const w = resolveDimensionPx(p.width, icWv);
@@ -5988,14 +6076,13 @@ function registerBuiltins() {
     const children = iconVNode ? [iconVNode, label] : [label];
     const actionUrl = Array.isArray(p.actions) ? resolveURL(p.actions.find((a) => a.type === "open_url")?.action?.url) : "";
     const url = actionUrl || resolveURL(p.url) || p.behaviors?.[0]?.default_url?.url;
-    const isText = type === "text" || type === "primary_text" || type === "danger_text";
     const wv = p.widthValue;
     const widthTok = p.width ?? wv?.value;
-    const block = widthTok === "fill" && !isText;
+    const block = widthTok === "fill";
     const base = `${CLS}-button ${CLS}-button--${type}${block ? ` ${CLS}-button--block` : ""}`;
     const style = {};
     if (p.margin) {
-      style.width = block ? "100%" : "auto";
+      style.width = "100%";
       applyOuterMargin(style, p.margin);
     }
     const styleProp = Object.keys(style).length ? { style } : {};
@@ -6200,6 +6287,93 @@ function registerBuiltins() {
     const style = textTagStyle(p.backgroundColor || c.bg, c.text);
     return h("span", { className: `${CLS}-text-tag ${CLS}-text-tag--${colorName}`, style }, extractText(p.text));
   });
+  registerComponent("local_datetime", (el) => {
+    const p = el.property || {};
+    let ms = Number(p.milliseconds ?? p.millisecond ?? p.value ?? 0);
+    if (!Number.isFinite(ms) || ms === 0) return null;
+    if (ms < 1e12) ms = ms * 1e3;
+    const d = new Date(ms);
+    if (Number.isNaN(d.getTime())) return null;
+    const ft = String(p.formatType || p.format_type || "").toLowerCase();
+    const opts = ft.includes("time") && !ft.includes("date") ? { hour: "2-digit", minute: "2-digit", hour12: false } : ft.includes("date") && !ft.includes("time") ? { year: "numeric", month: "2-digit", day: "2-digit" } : { year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit", hour12: false };
+    let text;
+    try {
+      text = new Intl.DateTimeFormat("zh-CN", opts).format(d);
+    } catch {
+      text = d.toLocaleString();
+    }
+    return h("span", { className: `${CLS}-local-datetime` }, text);
+  });
+  registerComponent("number_tag", (el, ctx) => {
+    const p = el.property || {};
+    const raw = extractText(p.text);
+    const text = raw != null && raw !== "" ? raw : p.content != null ? String(p.content) : "";
+    if (text === "") return null;
+    const parentFs = ctx.textMetrics?.fontSize ?? BASE_FONT_SIZE;
+    const fs = Math.max(11, Math.round(parentFs * 0.85));
+    const c = TAG_COLOR.blue;
+    const style = {
+      backgroundColor: c.bg,
+      color: c.text,
+      fontSize: fs + "px",
+      lineHeight: "1.4",
+      padding: "0 4px",
+      borderRadius: "4px",
+      display: "inline-flex",
+      alignItems: "center",
+      whiteSpace: "nowrap",
+      margin: "0 2px",
+      verticalAlign: "baseline"
+    };
+    return h("span", { className: `${CLS}-number-tag`, style }, text);
+  });
+  registerComponent("vote-card-select", (el) => {
+    const p = el.property || {};
+    const text = extractText(p.text) || (p.content != null ? String(p.content) : "");
+    if (!text) return null;
+    const voted = p.voted === true || p.isVoted === true || p.selected === true;
+    const count = Number(p.count ?? p.voteCount ?? 0) || 0;
+    const total = Number(p.total ?? p.totalCount ?? 0) || 0;
+    let percent = Number(p.percent ?? p.ratio ?? NaN);
+    if (!Number.isFinite(percent)) {
+      percent = total > 0 ? Math.round(count / total * 1e3) / 10 : 0;
+    }
+    const rootCls = `${CLS}-vote-card-select` + (voted ? ` ${CLS}-vote-card-select--voted` : "");
+    const kids = [
+      h("div", { className: `${CLS}-vote-card-select-content` }, text)
+    ];
+    if (voted) {
+      kids.push(
+        h("div", {
+          className: `${CLS}-vote-card-select-result`,
+          style: { fontSize: "12px", color: "#646a73", marginTop: "2px" }
+        }, `${count} \u7968 ${percent}%`),
+        h(
+          "div",
+          {
+            className: `${CLS}-vote-card-select-progress`,
+            style: {
+              height: "4px",
+              borderRadius: "2px",
+              background: "#f2f3f5",
+              marginTop: "4px",
+              overflow: "hidden"
+            }
+          },
+          h("div", {
+            className: `${CLS}-vote-card-select-progress-bar`,
+            style: {
+              width: Math.min(100, Math.max(0, percent)) + "%",
+              height: "100%",
+              background: "#4e83fd",
+              borderRadius: "2px"
+            }
+          })
+        )
+      );
+    }
+    return h("div", { className: rootCls, style: { padding: "8px 0" } }, kids);
+  });
   const EMOJI_FONT_SIZE = Number((BASE_FONT_SIZE * BASE_LINE_HEIGHT).toFixed(2));
   registerComponent("emoji", (el, ctx) => {
     const p = el.property || {};
@@ -6849,7 +7023,12 @@ function buildCardVNode(card, options) {
   const parts = [];
   if (jc.header) parts.push(renderElement(jc.header, ctx));
   const bodyEl = jc.body || jc.newBody;
-  if (bodyEl) parts.push(renderElement(bodyEl.tag ? bodyEl : { ...bodyEl, tag: "body" }, ctx));
+  if (bodyEl) {
+    const headerTpl = jc.header?.property?.template;
+    const compactHeader = !!jc.header && (!headerTpl || headerTpl === "default" || headerTpl === "disabled");
+    const bodyCtx = compactHeader ? { ...ctx, bodyPaddingTop: 8 } : ctx;
+    parts.push(renderElement(bodyEl.tag ? bodyEl : { ...bodyEl, tag: "body" }, bodyCtx));
+  }
   return h("div", {
     className: `${CLS}-root ${CLS}`,
     style: { fontSize: BASE_FONT_SIZE + "px", lineHeight: String(BASE_LINE_HEIGHT) }

package/dist/index.d.cts

@@ -149,13 +149,14 @@ interface ElementProperty {
     emoji_type?: string;
     /** 图标名，形如 "warning_outlined"，拼成 class="ud-icon_<token>" */
     token?: string;
-    style?: {
+    style?: string | {
         color?: string;
         size?: string;
         [key: string]: unknown;
     };
     icon?: CardElement;
     udIcon?: CardElement;
+    avatar?: CardElement;
     /** VChart 规格对象（原样透传给 VChart 构造） */
     chart_spec?: Record<string, unknown>;
     chartSpec?: Record<string, unknown>;
@@ -309,6 +310,15 @@ interface RenderOptions {
      * 交互预览。默认关闭：回调按钮是不可点的 span，输入框是静态占位。
      * 打开后，回调按钮变成带 data-feishu-action 的 button，输入框/下拉框变成真实表单控件。
      * 宿主监听这些控件，自己把点击发回卡片服务。
+     *
+     * #23/D13 —— 宿主上报契约（静态渲染器不替宿主发请求）：
+     * 飞书客户端点击后组装 event_type="card.action.client_msg" 事件，并经
+     * im.v2.PutActionRequest（PUT_ACTION_V2，service id 2199）上报，信封必须自带：
+     *   - messageId / actionId / traceId（宿主从消息上下文取）
+     *   - form_value（表单控件当前值，key=字段 name）
+     *   - client_channel / value（来自 data-feishu-action 上的 action 原文）
+     * 若宿主直接复用 data-feishu-action 里的 action 原文上报，会缺上述信封字段，
+     * 须自行补齐 PUT_ACTION_V2 信封后再发。
      */
     interactive?: boolean;
 }
@@ -425,6 +435,19 @@ interface RenderContext {
         fontSize: number;
         lineHeight: number;
     };
+    /**
+     * column_set 注入给子 column 的分栏模式（#17/D7）：flexMode 为 stretch/bisect/trisect 时，
+     * 子列无视自身 weight，按客户端同款 calc 宽度（用实际 columnGap）。
+     */
+    columnSet?: {
+        flexMode?: string;
+        gap: number;
+    };
+    /**
+     * body 顶部 padding（#18/D8）：header 存在且模板为 default/disabled/空时，
+     * 客户端把 body paddingTop 从 12 改为 8。由 index.ts 在渲染 body 前注入。
+     */
+    bodyPaddingTop?: number;
 }
 /** 组件渲染函数 */
 type ComponentFn = (el: CardElement, ctx: RenderContext) => VNode | null;
@@ -577,8 +600,9 @@ declare function feishuAudioHydrateJs(): string;
  */
 
 /**
- * 图表（chart）默认序列色板。取自 VChart 官方默认主题的分类色序列，
- * 与网页版飞书卡片图表观感一致。hydrate 时若 spec 未显式给 color，注入此序列。
+ * 图表（chart）默认序列色板。#21/D11：对齐飞书卡片图表 VChart light 主题
+ * brand.light.normal 的 30 色序列（首色 #4e83fd），而非 VChart 通用默认。
+ * hydrate 时若 spec 未显式给 color，注入此序列。
  */
 declare const CHART_PALETTE: string[];
 

package/dist/index.d.ts

@@ -149,13 +149,14 @@ interface ElementProperty {
     emoji_type?: string;
     /** 图标名，形如 "warning_outlined"，拼成 class="ud-icon_<token>" */
     token?: string;
-    style?: {
+    style?: string | {
         color?: string;
         size?: string;
         [key: string]: unknown;
     };
     icon?: CardElement;
     udIcon?: CardElement;
+    avatar?: CardElement;
     /** VChart 规格对象（原样透传给 VChart 构造） */
     chart_spec?: Record<string, unknown>;
     chartSpec?: Record<string, unknown>;
@@ -309,6 +310,15 @@ interface RenderOptions {
      * 交互预览。默认关闭：回调按钮是不可点的 span，输入框是静态占位。
      * 打开后，回调按钮变成带 data-feishu-action 的 button，输入框/下拉框变成真实表单控件。
      * 宿主监听这些控件，自己把点击发回卡片服务。
+     *
+     * #23/D13 —— 宿主上报契约（静态渲染器不替宿主发请求）：
+     * 飞书客户端点击后组装 event_type="card.action.client_msg" 事件，并经
+     * im.v2.PutActionRequest（PUT_ACTION_V2，service id 2199）上报，信封必须自带：
+     *   - messageId / actionId / traceId（宿主从消息上下文取）
+     *   - form_value（表单控件当前值，key=字段 name）
+     *   - client_channel / value（来自 data-feishu-action 上的 action 原文）
+     * 若宿主直接复用 data-feishu-action 里的 action 原文上报，会缺上述信封字段，
+     * 须自行补齐 PUT_ACTION_V2 信封后再发。
      */
     interactive?: boolean;
 }
@@ -425,6 +435,19 @@ interface RenderContext {
         fontSize: number;
         lineHeight: number;
     };
+    /**
+     * column_set 注入给子 column 的分栏模式（#17/D7）：flexMode 为 stretch/bisect/trisect 时，
+     * 子列无视自身 weight，按客户端同款 calc 宽度（用实际 columnGap）。
+     */
+    columnSet?: {
+        flexMode?: string;
+        gap: number;
+    };
+    /**
+     * body 顶部 padding（#18/D8）：header 存在且模板为 default/disabled/空时，
+     * 客户端把 body paddingTop 从 12 改为 8。由 index.ts 在渲染 body 前注入。
+     */
+    bodyPaddingTop?: number;
 }
 /** 组件渲染函数 */
 type ComponentFn = (el: CardElement, ctx: RenderContext) => VNode | null;
@@ -577,8 +600,9 @@ declare function feishuAudioHydrateJs(): string;
  */
 
 /**
- * 图表（chart）默认序列色板。取自 VChart 官方默认主题的分类色序列，
- * 与网页版飞书卡片图表观感一致。hydrate 时若 spec 未显式给 color，注入此序列。
+ * 图表（chart）默认序列色板。#21/D11：对齐飞书卡片图表 VChart light 主题
+ * brand.light.normal 的 30 色序列（首色 #4e83fd），而非 VChart 通用默认。
+ * hydrate 时若 spec 未显式给 color，注入此序列。
  */
 declare const CHART_PALETTE: string[];
 

package/dist/index.js

@@ -391,16 +391,36 @@ var TABLE_HEAD_BG = {
   default: "transparent"
 };
 var CHART_PALETTE = [
-  "#1664FF",
-  "#1AC6FF",
-  "#FF8A00",
-  "#3CC780",
-  "#7442D4",
-  "#FFC400",
-  "#304D77",
-  "#B48DEB",
-  "#009488",
-  "#FF7DDA"
+  "#4e83fd",
+  "#50cefb",
+  "#935af6",
+  "#fad355",
+  "#f76964",
+  "#ffa53d",
+  "#82a7fc",
+  "#7edafb",
+  "#ad82f7",
+  "#f7dc82",
+  "#f98e8b",
+  "#ffba6b",
+  "#3370ff",
+  "#14c0ff",
+  "#7f3bf5",
+  "#ffc60a",
+  "#f54a45",
+  "#ff8800",
+  "#bacefd",
+  "#b1e8fc",
+  "#cdb2fa",
+  "#f8e6ab",
+  "#fbbfbc",
+  "#fed4a4",
+  "#245bdb",
+  "#049fd7",
+  "#6425d0",
+  "#dc9b04",
+  "#d83931",
+  "#de7802"
 ];
 var CHART_DEFAULT_ASPECT_RATIO = "16:9";
 var CHART_MIN_HEIGHT = 150;
@@ -685,6 +705,25 @@ function personAvatarSrc(person, ctx) {
   const suffix = ctx.options.avatarURLSuffix ?? PERSON_AVATAR_SUFFIX;
   return base + person.avatar_key + suffix;
 }
+var HORIZONTAL_SPACING_PX = { small: 4, default: 8, large: 12 };
+var VERTICAL_SPACING_PX = { default: 8, medium: 12, large: 16 };
+function namedSpacingToPx(v, map) {
+  const named = map[v];
+  if (named != null) return named;
+  const m = /^(-?\d+(?:\.\d+)?)(?:px)?$/.exec(v.trim());
+  if (m) return Number(m[1]);
+  return map.default ?? 8;
+}
+function horizontalSpacingToPx(v) {
+  if (typeof v === "number") return v;
+  if (typeof v === "string") return namedSpacingToPx(v, HORIZONTAL_SPACING_PX);
+  return HORIZONTAL_SPACING_PX.default;
+}
+function verticalSpacingToPx(v) {
+  if (typeof v === "number") return v;
+  if (typeof v === "string") return namedSpacingToPx(v, VERTICAL_SPACING_PX);
+  return VERTICAL_SPACING_PX.default;
+}
 function spacingToPx(v) {
   if (typeof v === "number") return v;
   if (typeof v === "string") {
@@ -1312,14 +1351,9 @@ var BASE_STYLES_CSS = `/**
   flex-shrink: 0; height: 1.2em; color: inherit;
 }
 .universal-card-button__icon .universal-card-icon { color: inherit; }
-/* default \u5BBD\u5EA6\uFF1A\u6309\u5185\u5BB9\u6536\u7F29\u3002\u5217\u662F flex column\uFF08\u9ED8\u8BA4 align-items:stretch\uFF09\uFF0C
-   body \u53C8\u6709 > * { width:100% }\uFF0C\u4E0D\u52A0\u8FD9\u4E24\u6761\u4F1A\u88AB\u6491\u6EE1\u6240\u5728\u5217\u3002 */
-.universal-card-button:not(.universal-card-button--block) {
-  width: auto;
-  max-width: 100%;
-  align-self: flex-start;
-}
-/* fill\uFF08width:"fill"\uFF09\uFF1A\u6491\u6EE1\u6240\u5728\u5217 */
+/* \u5BBD\u5EA6\uFF1A\u5BF9\u9F50\u771F\u673A\u2014\u2014body > * { width:100% }\u3001\u5217 flex stretch \u4F1A\u628A\u6309\u94AE\u6491\u6EE1\u6240\u5728\u884C/\u5217\u3002
+   \u4E0D\u518D\u5F3A\u5236 width:auto\uFF08\u90A3\u662F\u7F51\u9875\u7248\u89C2\u611F\uFF1B\u771F\u673A\u72EC\u7ACB\u6210\u884C\u7684\u6309\u94AE\u9ED8\u8BA4\u5360\u6EE1\u6574\u884C\uFF09\u3002
+   width:"fill" \u663E\u5F0F\u6302 --block\uFF0C\u4E0E\u7F3A\u7701\u6491\u6EE1\u540C\u5BBD\uFF0C\u5E76\u4F9B margin calc \u8BC6\u522B\u3002 */
 .universal-card-button--block { width: 100%; }
 
 /* \u2014\u2014 outlined \u63CF\u8FB9\u65CF \u2014\u2014 */
@@ -1341,11 +1375,12 @@ var BASE_STYLES_CSS = `/**
 }
 .universal-card-button--danger:not(.universal-card-button--static):hover { background: #fef0f0; }
 
-/* \u2014\u2014 text \u7EAF\u6587\u5B57\u65CF\uFF08\u65E0\u8FB9\u6846/\u65E0\u5E95\u8272\uFF0C\u6309\u5185\u5BB9\u5BBD\uFF09 \u2014\u2014 */
+/* \u2014\u2014 text \u7EAF\u6587\u5B57\u65CF\uFF08\u65E0\u8FB9\u6846/\u65E0\u5E95\u8272\uFF1B\u6491\u6EE1\u65F6\u6587\u5B57\u9760\u5DE6\uFF0C\u5BF9\u9F50\u771F\u673A\uFF09 \u2014\u2014 */
 .universal-card-button--text,
 .universal-card-button--primary_text,
 .universal-card-button--danger_text {
   border-color: transparent; background: transparent; padding: 4px 8px;
+  justify-content: flex-start;
 }
 .universal-card-button--text { color: #1f2329; }
 .universal-card-button--primary_text { color: #1456f0; }
@@ -4898,7 +4933,7 @@ function parseInline(text) {
         if (attrs.show_name != null) property.showName = attrs.show_name !== "false";
         if (attrs.show_avatar != null) property.showAvatar = attrs.show_avatar !== "false";
         if (attrs.size) property.size = attrs.size;
-        if (attrs.style === "capsule") property.pillShaped = true;
+        if (attrs.style) property.style = attrs.style;
         out.push({ tag: "person_v1", property });
         i += m[0].length;
         continue;
@@ -5499,8 +5534,9 @@ function registerBuiltins() {
     const style = {};
     const pad = boxToStyle(p.padding);
     if (pad) style.padding = pad;
+    if (!pad && ctx.bodyPaddingTop != null) style.paddingTop = ctx.bodyPaddingTop + "px";
     const vGap = p.verticalSpacingValue?.value ?? p.vertical_spacing;
-    if (vGap != null) style.rowGap = spacingToPx(vGap) + "px";
+    if (vGap != null) style.rowGap = verticalSpacingToPx(vGap) + "px";
     const props = { className: `${CLS}-body` };
     if (Object.keys(style).length) props.style = style;
     return h("div", props, renderElements(getChildElements(el), ctx));
@@ -5510,7 +5546,8 @@ function registerBuiltins() {
     const tplKey = p.template || "default";
     const tpl = HEADER_TEMPLATE[tplKey] || HEADER_TEMPLATE.default;
     const tags = p.text_tag_list || p.textTagList;
-    const tagVNodes = Array.isArray(tags) && tags.length ? renderElements(tags, ctx) : [];
+    const tagCtx = { ...ctx, textMetrics: { fontSize: 16, lineHeight: 24 } };
+    const tagVNodes = Array.isArray(tags) && tags.length ? renderElements(tags.slice(0, 3), tagCtx) : [];
     const iconRaw = p.udIcon || p.icon;
     let iconVNode = null;
     if (iconRaw && iconRaw.tag) {
@@ -5520,6 +5557,21 @@ function registerBuiltins() {
       const inner = renderIcon(iconEl, ctx);
       if (inner) iconVNode = h("div", { className: `${CLS}-header__icon` }, inner);
     }
+    if (!iconVNode) {
+      const avatarEl = p.avatar;
+      const avatarSrc = avatarEl && avatarEl.property ? resolveImageSrc(avatarEl.property, ctx) : null;
+      if (avatarSrc) {
+        iconVNode = h(
+          "div",
+          { className: `${CLS}-header__icon` },
+          h("img", {
+            src: avatarSrc,
+            alt: "",
+            style: { width: "16px", height: "16px", borderRadius: "4px", objectFit: "cover" }
+          })
+        );
+      }
+    }
     const titleVNode = renderHeaderTextLeaf(p.title, ctx, `${CLS}-header__text-title`) ?? h("div", { className: `${CLS}-header__text-title` });
     const subtitleVNode = renderHeaderTextLeaf(p.subtitle, ctx, `${CLS}-header__text-subtitle`);
     const textChildren = [
@@ -5558,7 +5610,7 @@ function registerBuiltins() {
       )
     );
   });
-  registerComponent("markdown", (el, ctx) => {
+  function MarkdownComponent(el, ctx) {
     const p = el.property || {};
     const style = { ...alignToStyle(p.textAlign), ...textStyleToStyle(p.textStyle) };
     applyOuterMargin(style, p.margin);
@@ -5572,12 +5624,28 @@ function registerBuiltins() {
       style.lineHeight = lineHeight + "px";
     }
     const childCtx = { ...ctx, textMetrics: { fontSize, lineHeight } };
+    const linesStyle = lineClampStyle(p.lines ?? p.textLines);
     return h(
       "div",
       { className: `${CLS}-markdown`, style },
-      h("div", { className: `${CLS}-markdown__children` }, renderElements(p.elements, childCtx))
+      h("div", {
+        className: `${CLS}-markdown__children`,
+        style: Object.keys(linesStyle).length ? linesStyle : void 0
+      }, renderElements(p.elements, childCtx))
     );
-  });
+  }
+  registerComponent("markdown", MarkdownComponent);
+  registerComponent("markdown_v1", MarkdownComponent);
+  function lineClampStyle(lines) {
+    const n = Number(lines);
+    if (!Number.isFinite(n) || n <= 0) return {};
+    return {
+      display: "-webkit-box",
+      WebkitLineClamp: String(Math.floor(n)),
+      WebkitBoxOrient: "vertical",
+      overflow: "hidden"
+    };
+  }
   registerComponent("plain_text", (el) => {
     const p = el.property || {};
     const mods = textStyleToModifiers(p.textStyle);
@@ -5586,6 +5654,7 @@ function registerBuiltins() {
     delete style.fontWeight;
     delete style.fontStyle;
     delete style.textDecoration;
+    Object.assign(style, lineClampStyle(p.lines));
     return h("span", { className, style }, p.content != null ? String(p.content) : "");
   });
   registerComponent("br", () => h("br", {}));
@@ -5610,16 +5679,16 @@ function registerBuiltins() {
   registerComponent("column_set", (el, ctx) => {
     const p = el.property || {};
     const gapRaw = p.horizontalSpacingValue?.value ?? p.horizontal_spacing;
-    const gap = gapRaw != null ? spacingToPx(gapRaw) : 8;
+    const gap = gapRaw != null ? horizontalSpacingToPx(gapRaw) : 0;
     const flexMode = p.flexMode || p.flex_mode;
     const hAlign = p.horizontalAlign || p.horizontal_align;
     const style = {
       display: "flex",
       flexWrap: flexMode === "flow" || flexMode === "wrap" ? "wrap" : "nowrap",
-      columnGap: gap + "px",
       rowGap: "8px",
       alignItems: "stretch"
     };
+    if (gap > 0) style.columnGap = gap + "px";
     if (hAlign) {
       style.justifyContent = { left: "flex-start", center: "center", right: "flex-end" }[hAlign] || "flex-start";
     }
@@ -5637,7 +5706,8 @@ function registerBuiltins() {
       style.margin = "0";
       style.padding = "0";
     }
-    return h("div", { className: cls, style }, renderElements(p.columns, ctx));
+    const childCtx = { ...ctx, columnSet: { flexMode, gap } };
+    return h("div", { className: cls, style }, renderElements(p.columns, childCtx));
   });
   function isStateHost(el) {
     if (el.id === "card_state") return true;
@@ -5672,12 +5742,30 @@ function registerBuiltins() {
     } else {
       style.flexGrow = String(p.weight || 1);
     }
+    const cs = ctx.columnSet;
+    if (cs && cs.flexMode) {
+      const fm = String(cs.flexMode).toLowerCase();
+      const g = cs.gap || 0;
+      if (fm === "stretch") {
+        style.width = "100%";
+        style.flexGrow = "0";
+        style.flexBasis = "auto";
+      } else if (fm === "bisect") {
+        style.width = `calc(50% - ${g / 2}px)`;
+        style.flexGrow = "0";
+        style.flexBasis = "auto";
+      } else if (fm === "trisect") {
+        style.width = `calc(33.33% - ${2 * g / 3}px)`;
+        style.flexGrow = "0";
+        style.flexBasis = "auto";
+      }
+    }
     const vAlign = p.verticalAlign || p.vertical_align;
     if (vAlign) {
       style.justifyContent = { top: "flex-start", center: "center", bottom: "flex-end" }[vAlign] || "flex-start";
     }
     const vGap = p.verticalSpacingValue?.value ?? p.vertical_spacing;
-    style.rowGap = (vGap != null ? spacingToPx(vGap) : 8) + "px";
+    style.rowGap = (vGap != null ? verticalSpacingToPx(vGap) : 8) + "px";
     const bg = propertyBackgroundColor(p);
     if (bg) style.background = bg;
     const pad = boxToStyle(p.padding);
@@ -5885,7 +5973,7 @@ function registerBuiltins() {
     const radius = resolveCornerRadius(p);
     if (radius != null) style.borderRadius = radius;
     const vGap = p.verticalSpacingValue?.value ?? p.vertical_spacing;
-    if (vGap != null) style.rowGap = spacingToPx(vGap) + "px";
+    if (vGap != null) style.rowGap = verticalSpacingToPx(vGap) + "px";
     const icWv = p.widthValue;
     const icHv = p.heightValue;
     const w = resolveDimensionPx(p.width, icWv);
@@ -5987,14 +6075,13 @@ function registerBuiltins() {
     const children = iconVNode ? [iconVNode, label] : [label];
     const actionUrl = Array.isArray(p.actions) ? resolveURL(p.actions.find((a) => a.type === "open_url")?.action?.url) : "";
     const url = actionUrl || resolveURL(p.url) || p.behaviors?.[0]?.default_url?.url;
-    const isText = type === "text" || type === "primary_text" || type === "danger_text";
     const wv = p.widthValue;
     const widthTok = p.width ?? wv?.value;
-    const block = widthTok === "fill" && !isText;
+    const block = widthTok === "fill";
     const base = `${CLS}-button ${CLS}-button--${type}${block ? ` ${CLS}-button--block` : ""}`;
     const style = {};
     if (p.margin) {
-      style.width = block ? "100%" : "auto";
+      style.width = "100%";
       applyOuterMargin(style, p.margin);
     }
     const styleProp = Object.keys(style).length ? { style } : {};
@@ -6199,6 +6286,93 @@ function registerBuiltins() {
     const style = textTagStyle(p.backgroundColor || c.bg, c.text);
     return h("span", { className: `${CLS}-text-tag ${CLS}-text-tag--${colorName}`, style }, extractText(p.text));
   });
+  registerComponent("local_datetime", (el) => {
+    const p = el.property || {};
+    let ms = Number(p.milliseconds ?? p.millisecond ?? p.value ?? 0);
+    if (!Number.isFinite(ms) || ms === 0) return null;
+    if (ms < 1e12) ms = ms * 1e3;
+    const d = new Date(ms);
+    if (Number.isNaN(d.getTime())) return null;
+    const ft = String(p.formatType || p.format_type || "").toLowerCase();
+    const opts = ft.includes("time") && !ft.includes("date") ? { hour: "2-digit", minute: "2-digit", hour12: false } : ft.includes("date") && !ft.includes("time") ? { year: "numeric", month: "2-digit", day: "2-digit" } : { year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit", hour12: false };
+    let text;
+    try {
+      text = new Intl.DateTimeFormat("zh-CN", opts).format(d);
+    } catch {
+      text = d.toLocaleString();
+    }
+    return h("span", { className: `${CLS}-local-datetime` }, text);
+  });
+  registerComponent("number_tag", (el, ctx) => {
+    const p = el.property || {};
+    const raw = extractText(p.text);
+    const text = raw != null && raw !== "" ? raw : p.content != null ? String(p.content) : "";
+    if (text === "") return null;
+    const parentFs = ctx.textMetrics?.fontSize ?? BASE_FONT_SIZE;
+    const fs = Math.max(11, Math.round(parentFs * 0.85));
+    const c = TAG_COLOR.blue;
+    const style = {
+      backgroundColor: c.bg,
+      color: c.text,
+      fontSize: fs + "px",
+      lineHeight: "1.4",
+      padding: "0 4px",
+      borderRadius: "4px",
+      display: "inline-flex",
+      alignItems: "center",
+      whiteSpace: "nowrap",
+      margin: "0 2px",
+      verticalAlign: "baseline"
+    };
+    return h("span", { className: `${CLS}-number-tag`, style }, text);
+  });
+  registerComponent("vote-card-select", (el) => {
+    const p = el.property || {};
+    const text = extractText(p.text) || (p.content != null ? String(p.content) : "");
+    if (!text) return null;
+    const voted = p.voted === true || p.isVoted === true || p.selected === true;
+    const count = Number(p.count ?? p.voteCount ?? 0) || 0;
+    const total = Number(p.total ?? p.totalCount ?? 0) || 0;
+    let percent = Number(p.percent ?? p.ratio ?? NaN);
+    if (!Number.isFinite(percent)) {
+      percent = total > 0 ? Math.round(count / total * 1e3) / 10 : 0;
+    }
+    const rootCls = `${CLS}-vote-card-select` + (voted ? ` ${CLS}-vote-card-select--voted` : "");
+    const kids = [
+      h("div", { className: `${CLS}-vote-card-select-content` }, text)
+    ];
+    if (voted) {
+      kids.push(
+        h("div", {
+          className: `${CLS}-vote-card-select-result`,
+          style: { fontSize: "12px", color: "#646a73", marginTop: "2px" }
+        }, `${count} \u7968 ${percent}%`),
+        h(
+          "div",
+          {
+            className: `${CLS}-vote-card-select-progress`,
+            style: {
+              height: "4px",
+              borderRadius: "2px",
+              background: "#f2f3f5",
+              marginTop: "4px",
+              overflow: "hidden"
+            }
+          },
+          h("div", {
+            className: `${CLS}-vote-card-select-progress-bar`,
+            style: {
+              width: Math.min(100, Math.max(0, percent)) + "%",
+              height: "100%",
+              background: "#4e83fd",
+              borderRadius: "2px"
+            }
+          })
+        )
+      );
+    }
+    return h("div", { className: rootCls, style: { padding: "8px 0" } }, kids);
+  });
   const EMOJI_FONT_SIZE = Number((BASE_FONT_SIZE * BASE_LINE_HEIGHT).toFixed(2));
   registerComponent("emoji", (el, ctx) => {
     const p = el.property || {};
@@ -6848,7 +7022,12 @@ function buildCardVNode(card, options) {
   const parts = [];
   if (jc.header) parts.push(renderElement(jc.header, ctx));
   const bodyEl = jc.body || jc.newBody;
-  if (bodyEl) parts.push(renderElement(bodyEl.tag ? bodyEl : { ...bodyEl, tag: "body" }, ctx));
+  if (bodyEl) {
+    const headerTpl = jc.header?.property?.template;
+    const compactHeader = !!jc.header && (!headerTpl || headerTpl === "default" || headerTpl === "disabled");
+    const bodyCtx = compactHeader ? { ...ctx, bodyPaddingTop: 8 } : ctx;
+    parts.push(renderElement(bodyEl.tag ? bodyEl : { ...bodyEl, tag: "body" }, bodyCtx));
+  }
   return h("div", {
     className: `${CLS}-root ${CLS}`,
     style: { fontSize: BASE_FONT_SIZE + "px", lineHeight: String(BASE_LINE_HEIGHT) }

package/dist/styles.css

@@ -384,14 +384,9 @@
   flex-shrink: 0; height: 1.2em; color: inherit;
 }
 .universal-card-button__icon .universal-card-icon { color: inherit; }
-/* default 宽度：按内容收缩。列是 flex column（默认 align-items:stretch），
-   body 又有 > * { width:100% }，不加这两条会被撑满所在列。 */
-.universal-card-button:not(.universal-card-button--block) {
-  width: auto;
-  max-width: 100%;
-  align-self: flex-start;
-}
-/* fill（width:"fill"）：撑满所在列 */
+/* 宽度：对齐真机——body > * { width:100% }、列 flex stretch 会把按钮撑满所在行/列。
+   不再强制 width:auto（那是网页版观感；真机独立成行的按钮默认占满整行）。
+   width:"fill" 显式挂 --block，与缺省撑满同宽，并供 margin calc 识别。 */
 .universal-card-button--block { width: 100%; }
 
 /* —— outlined 描边族 —— */
@@ -413,11 +408,12 @@
 }
 .universal-card-button--danger:not(.universal-card-button--static):hover { background: #fef0f0; }
 
-/* —— text 纯文字族（无边框/无底色，按内容宽） —— */
+/* —— text 纯文字族（无边框/无底色；撑满时文字靠左，对齐真机） —— */
 .universal-card-button--text,
 .universal-card-button--primary_text,
 .universal-card-button--danger_text {
   border-color: transparent; background: transparent; padding: 4px 8px;
+  justify-content: flex-start;
 }
 .universal-card-button--text { color: #1f2329; }
 .universal-card-button--primary_text { color: #1456f0; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@open-feishu-card/renderer",
-  "version": "0.2.26",
+  "version": "0.2.28",
   "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.17"
+    "@open-feishu-card/adapter": "0.3.18"
   },
   "devDependencies": {
     "tsup": "^8.3.5",