@4399ywkf/design 2.1.0 → 2.1.1

package/dist/FormRender/widgets/card/selectStatic.js

@@ -0,0 +1,290 @@
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+import { DownOutlined, SearchOutlined } from '@ant-design/icons';
+import { isValidElement, useEffect, useMemo, useRef, useState } from 'react';
+import StandardIcon from "./standardIcon";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var controlStyle = {
+  alignItems: 'center',
+  background: '#fff',
+  border: '1px solid #d9d9d9',
+  borderRadius: 6,
+  boxSizing: 'border-box',
+  cursor: 'pointer',
+  display: 'flex',
+  fontSize: 14,
+  gap: 8,
+  lineHeight: '22px',
+  minHeight: 32,
+  padding: '4px 11px',
+  transition: 'border-color 0.2s, box-shadow 0.2s'
+};
+var popupStyle = {
+  background: '#fff',
+  borderRadius: 8,
+  boxShadow: '0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05)',
+  boxSizing: 'border-box',
+  left: 0,
+  maxHeight: 256,
+  overflowY: 'auto',
+  padding: 4,
+  position: 'absolute',
+  right: 0,
+  top: 'calc(100% + 4px)',
+  zIndex: 10000
+};
+function textContent(t) {
+  var _t$content;
+  if (!t) return '';
+  return typeof t === 'string' ? t : (_t$content = t.content) !== null && _t$content !== void 0 ? _t$content : '';
+}
+function primitiveContent(t) {
+  var _t$content2;
+  if (t === undefined || t === null) return '';
+  if (typeof t === 'string' || typeof t === 'number') return String(t);
+  if ( /*#__PURE__*/isValidElement(t)) return '';
+  if (_typeof(t) === 'object' && 'content' in t) return String((_t$content2 = t.content) !== null && _t$content2 !== void 0 ? _t$content2 : '');
+  return '';
+}
+function renderTextContent(t) {
+  var _t$content3;
+  if (t === undefined || t === null) return '';
+  if (typeof t === 'string' || typeof t === 'number') return t;
+  if ( /*#__PURE__*/isValidElement(t)) return t;
+  if (_typeof(t) === 'object' && 'content' in t) return String((_t$content3 = t.content) !== null && _t$content3 !== void 0 ? _t$content3 : '');
+  return '';
+}
+function mergeProps(schemaProps, props) {
+  var result = _objectSpread({}, schemaProps);
+  Object.entries(props).forEach(function (_ref) {
+    var _ref2 = _slicedToArray(_ref, 2),
+      key = _ref2[0],
+      val = _ref2[1];
+    if (val !== undefined) {
+      result[key] = val;
+    }
+  });
+  return result;
+}
+function isSameValue(a, b) {
+  return a === b;
+}
+export default function SelectStatic(_ref3) {
+  var _schema$props, _p$multiSelect, _controlStyle$border, _selectedOptions$;
+  var disabled = _ref3.disabled,
+    multiSelect = _ref3.multiSelect,
+    onChange = _ref3.onChange,
+    directOptions = _ref3.options,
+    placeholder = _ref3.placeholder,
+    schema = _ref3.schema,
+    value = _ref3.value,
+    width = _ref3.width;
+  var rootRef = useRef(null);
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    open = _useState2[0],
+    setOpen = _useState2[1];
+  var p = mergeProps((_schema$props = schema === null || schema === void 0 ? void 0 : schema.props) !== null && _schema$props !== void 0 ? _schema$props : {}, {
+    multiSelect: multiSelect,
+    options: directOptions,
+    placeholder: placeholder,
+    width: width
+  });
+  var isMulti = (_p$multiSelect = p.multiSelect) !== null && _p$multiSelect !== void 0 ? _p$multiSelect : schema !== null && schema !== void 0 && schema.widget ? schema.widget === 'selectStaticMulti' : Array.isArray(value);
+  var selectedValues = isMulti ? Array.isArray(value) ? value : value === undefined || value === null ? [] : [value] : value;
+  var selectPlaceholder = textContent(p.placeholder);
+  var options = useMemo(function () {
+    var _p$options;
+    return ((_p$options = p.options) !== null && _p$options !== void 0 ? _p$options : []).map(function (opt) {
+      var _opt$value;
+      var text = textContent(opt.text);
+      var labelText = text || primitiveContent(opt.label);
+      var finalValue = (_opt$value = opt.value) !== null && _opt$value !== void 0 ? _opt$value : labelText;
+      var label = renderTextContent(opt.text) || renderTextContent(opt.label) || finalValue;
+      return {
+        value: finalValue,
+        label: label,
+        labelText: String(labelText || finalValue),
+        node: /*#__PURE__*/_jsxs("span", {
+          style: {
+            display: 'inline-flex',
+            alignItems: 'center',
+            gap: 6
+          },
+          children: [opt.icon ? /*#__PURE__*/_jsx(StandardIcon, {
+            value: opt.icon,
+            size: 14
+          }) : null, label]
+        })
+      };
+    });
+  }, [p.options]);
+  var selectedOptions = isMulti ? options.filter(function (opt) {
+    return selectedValues.some(function (item) {
+      return isSameValue(opt.value, item);
+    });
+  }) : options.filter(function (opt) {
+    return isSameValue(opt.value, selectedValues);
+  });
+  useEffect(function () {
+    var _rootRef$current$owne, _rootRef$current;
+    if (!open) return;
+    var ownerDocument = (_rootRef$current$owne = (_rootRef$current = rootRef.current) === null || _rootRef$current === void 0 ? void 0 : _rootRef$current.ownerDocument) !== null && _rootRef$current$owne !== void 0 ? _rootRef$current$owne : document;
+    var handleMouseDown = function handleMouseDown(event) {
+      var _rootRef$current2;
+      if (!((_rootRef$current2 = rootRef.current) !== null && _rootRef$current2 !== void 0 && _rootRef$current2.contains(event.target))) {
+        setOpen(false);
+      }
+    };
+    ownerDocument.addEventListener('mousedown', handleMouseDown);
+    return function () {
+      return ownerDocument.removeEventListener('mousedown', handleMouseDown);
+    };
+  }, [open]);
+  var toggleOption = function toggleOption(opt) {
+    if (disabled) return;
+    if (!isMulti) {
+      onChange === null || onChange === void 0 || onChange(opt.value);
+      setOpen(false);
+      return;
+    }
+    var exists = selectedValues.some(function (item) {
+      return isSameValue(opt.value, item);
+    });
+    var next = exists ? selectedValues.filter(function (item) {
+      return !isSameValue(opt.value, item);
+    }) : [].concat(_toConsumableArray(selectedValues), [opt.value]);
+    onChange === null || onChange === void 0 || onChange(next);
+  };
+  var rootWidth = p.width === 'fill' ? '100%' : p.width === 'auto' ? 'auto' : p.width || '100%';
+  return /*#__PURE__*/_jsxs("div", {
+    ref: rootRef,
+    style: {
+      opacity: disabled ? 0.55 : 1,
+      position: 'relative',
+      width: rootWidth
+    },
+    children: [/*#__PURE__*/_jsxs("div", {
+      "aria-disabled": disabled,
+      "aria-expanded": open,
+      onClick: function onClick() {
+        if (!disabled) setOpen(function (prev) {
+          return !prev;
+        });
+      },
+      onKeyDown: function onKeyDown(event) {
+        if (disabled) return;
+        if (event.key === 'Enter' || event.key === ' ') {
+          event.preventDefault();
+          setOpen(function (prev) {
+            return !prev;
+          });
+        }
+        if (event.key === 'Escape') {
+          setOpen(false);
+        }
+      },
+      role: "combobox",
+      style: _objectSpread(_objectSpread({}, controlStyle), {}, {
+        borderColor: open ? '#3370ff' : (_controlStyle$border = controlStyle.border) === null || _controlStyle$border === void 0 ? void 0 : _controlStyle$border.toString().split(' ').pop(),
+        boxShadow: open ? '0 0 0 2px rgba(51, 112, 255, 0.2)' : undefined,
+        cursor: disabled ? 'not-allowed' : 'pointer'
+      }),
+      tabIndex: disabled ? -1 : 0,
+      children: [/*#__PURE__*/_jsx("div", {
+        style: {
+          alignItems: 'center',
+          display: 'flex',
+          flex: 1,
+          flexWrap: 'wrap',
+          gap: 4,
+          minWidth: 0
+        },
+        children: selectedOptions.length > 0 ? isMulti ? selectedOptions.map(function (opt) {
+          return /*#__PURE__*/_jsx("span", {
+            style: {
+              background: '#f0f0f0',
+              borderRadius: 4,
+              lineHeight: '20px',
+              maxWidth: '100%',
+              overflow: 'hidden',
+              padding: '0 6px',
+              textOverflow: 'ellipsis',
+              whiteSpace: 'nowrap'
+            },
+            children: opt.label
+          }, String(opt.value));
+        }) : /*#__PURE__*/_jsx("span", {
+          style: {
+            minWidth: 0,
+            overflow: 'hidden',
+            textOverflow: 'ellipsis',
+            whiteSpace: 'nowrap'
+          },
+          children: (_selectedOptions$ = selectedOptions[0]) === null || _selectedOptions$ === void 0 ? void 0 : _selectedOptions$.label
+        }) : /*#__PURE__*/_jsx("span", {
+          style: {
+            color: '#bfbfbf'
+          },
+          children: selectPlaceholder
+        })
+      }), isMulti ? /*#__PURE__*/_jsx(SearchOutlined, {
+        style: {
+          color: '#bfbfbf',
+          flex: '0 0 auto'
+        }
+      }) : /*#__PURE__*/_jsx(DownOutlined, {
+        style: {
+          color: '#bfbfbf',
+          flex: '0 0 auto'
+        }
+      })]
+    }), open && /*#__PURE__*/_jsx("div", {
+      style: popupStyle,
+      children: options.length === 0 ? /*#__PURE__*/_jsx("div", {
+        style: {
+          color: '#8c8c8c',
+          padding: '6px 10px'
+        },
+        children: "\u6682\u65E0\u9009\u9879"
+      }) : options.map(function (opt) {
+        var selected = isMulti ? selectedValues.some(function (item) {
+          return isSameValue(opt.value, item);
+        }) : isSameValue(opt.value, selectedValues);
+        return /*#__PURE__*/_jsx("div", {
+          onClick: function onClick() {
+            return toggleOption(opt);
+          },
+          onMouseDown: function onMouseDown(event) {
+            return event.preventDefault();
+          },
+          style: {
+            background: selected ? '#e6f4ff' : undefined,
+            borderRadius: 4,
+            color: '#1f2329',
+            cursor: 'pointer',
+            lineHeight: '22px',
+            padding: '5px 10px'
+          },
+          title: opt.labelText,
+          children: opt.node
+        }, String(opt.value));
+      })
+    })]
+  });
+}

package/dist/FormRender/widgets/card/standardIcon.d.ts

@@ -0,0 +1,16 @@
+interface StandardIconValue {
+    tag?: string;
+    token?: string;
+}
+interface Props {
+    value?: StandardIconValue | string;
+    schema?: {
+        props?: {
+            icon?: StandardIconValue | string;
+        };
+    };
+    size?: number;
+    color?: string;
+}
+export default function StandardIcon({ value, schema, size, color }: Props): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/FormRender/widgets/card/standardIcon.js

@@ -0,0 +1,146 @@
+import React from 'react';
+import { CheckOutlined, CloseOutlined, CheckCircleFilled, FormOutlined, ExclamationCircleFilled, InfoCircleFilled, ThunderboltFilled, BellFilled, MailFilled, LikeFilled, StarFilled } from '@ant-design/icons';
+
+// Curated alias table: Feishu-style token → antd icon component + optional brand color.
+// `_colorful` 后缀的图标自带颜色（覆盖外层 color prop）；`_outlined` 跟随外层颜色。
+import { jsx as _jsx } from "react/jsx-runtime";
+var ALIAS = {
+  // colorful — 自带品牌色
+  approval_colorful: {
+    Icon: ThunderboltFilled,
+    color: '#FF811A'
+  },
+  ok_colorful: {
+    Icon: CheckCircleFilled,
+    color: '#33B86A'
+  },
+  warn_colorful: {
+    Icon: ExclamationCircleFilled,
+    color: '#FF811A'
+  },
+  info_colorful: {
+    Icon: InfoCircleFilled,
+    color: '#3370FF'
+  },
+  notification_colorful: {
+    Icon: BellFilled,
+    color: '#FFD021'
+  },
+  email_colorful: {
+    Icon: MailFilled,
+    color: '#3370FF'
+  },
+  like_colorful: {
+    Icon: LikeFilled,
+    color: '#33B86A'
+  },
+  star_colorful: {
+    Icon: StarFilled,
+    color: '#FFD021'
+  },
+  // outlined — 跟随外层 color
+  'list-check-bold_outlined': {
+    Icon: CheckOutlined
+  },
+  check_outlined: {
+    Icon: CheckOutlined
+  },
+  close_outlined: {
+    Icon: CloseOutlined
+  },
+  form_outlined: {
+    Icon: FormOutlined
+  }
+};
+export default function StandardIcon(_ref) {
+  var _schema$props;
+  var value = _ref.value,
+    schema = _ref.schema,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 16 : _ref$size,
+    color = _ref.color;
+  var raw = value !== null && value !== void 0 ? value : schema === null || schema === void 0 || (_schema$props = schema.props) === null || _schema$props === void 0 ? void 0 : _schema$props.icon;
+  var token = typeof raw === 'string' ? raw : raw === null || raw === void 0 ? void 0 : raw.token;
+  if (!token) return null;
+  var entry = ALIAS[token];
+  if (entry) {
+    var _entry$color;
+    var finalColor = (_entry$color = entry.color) !== null && _entry$color !== void 0 ? _entry$color : color;
+    return /*#__PURE__*/_jsx(entry.Icon, {
+      style: {
+        fontSize: size,
+        color: finalColor,
+        lineHeight: 1
+      }
+    });
+  }
+  // 未注册的 token → 用关键字找一个合理 emoji，避免空虚圈
+  return /*#__PURE__*/_jsx("span", {
+    style: {
+      fontSize: size,
+      lineHeight: 1,
+      display: 'inline-block'
+    },
+    title: "\u672A\u6CE8\u518C\u7684\u56FE\u6807 token: ".concat(token),
+    children: guessEmoji(token)
+  });
+}
+function guessEmoji(token) {
+  var t = token.toLowerCase();
+  // 顺序按特异性优先 — 更精确的关键字先匹配，避免 'list-check' 落到通用 'check'
+  if (t.includes('audit') || t.includes('approval')) return '📝';
+  if (t.includes('qrcode') || t.includes('qr-code') || t.includes('scan')) return '📱';
+  if (t.includes('list-check') || t.includes('checklist') || t.includes('list_check')) return '📋';
+  if (t.includes('error') || t.includes('forbid') || t.includes('forbidden')) return '⛔';
+  if (t.includes('thunder')) return '⚡';
+  if (t.includes('ok') || t.includes('check') || t.includes('success') || t.includes('done') || t.includes('succeed') || t.includes('pass')) return '✅';
+  if (t.includes('warn') || t.includes('alert')) return '⚠️';
+  if (t.includes('info') || t.includes('help')) return 'ℹ️';
+  if (t.includes('notification') || t.includes('bell')) return '🔔';
+  if (t.includes('mail') || t.includes('email')) return '✉️';
+  if (t.includes('star')) return '⭐';
+  if (t.includes('thumb') || t.includes('thumbup') || t.includes('thumbs-up') || t.includes('thumbs_up')) return '👍';
+  if (t.includes('like') || t.includes('heart') || t.includes('love') || t.includes('favor')) return '❤️';
+  if (t.includes('clock') || t.includes('watch')) return '⏰';
+  if (t.includes('calendar') || t.includes('date')) return '📅';
+  if (t.includes('time')) return '⏱️';
+  if (t.includes('location') || t.includes('place') || t.includes('map') || t.includes('pin')) return '📍';
+  if (t.includes('yen') || t.includes('cny') || t.includes('rmb')) return '¥';
+  if (t.includes('usd') || t.includes('dollar')) return '$';
+  if (t.includes('user') || t.includes('person')) return '👤';
+  if (t.includes('team') || t.includes('group') || t.includes('people')) return '👥';
+  if (t.includes('chat') || t.includes('comment') || t.includes('message')) return '💬';
+  if (t.includes('doc') || t.includes('file') || t.includes('paper')) return '📄';
+  if (t.includes('image') || t.includes('photo') || t.includes('pic')) return '🖼️';
+  if (t.includes('analytic') || t.includes('chart-bar') || t.includes('chart_bar') || t.includes('bar-chart') || t.includes('bar_chart')) return '📊';
+  if (t.includes('chart') || t.includes('graph') || t.includes('data')) return '📈';
+  if (t.includes('money') || t.includes('price') || t.includes('coin')) return '💰';
+  if (t.includes('gift')) return '🎁';
+  if (t.includes('rocket') || t.includes('launch') || t.includes('start')) return '🚀';
+  if (t.includes('cake') || t.includes('birthday')) return '🎂';
+  if (t.includes('coffee') || t.includes('tea')) return '☕';
+  if (t.includes('music') || t.includes('audio') || t.includes('sound')) return '🎵';
+  if (t.includes('idea') || t.includes('bulb') || t.includes('light')) return '💡';
+  if (t.includes('flag')) return '🚩';
+  if (t.includes('book')) return '📖';
+  if (t.includes('robot') || t.includes('bot') || t.includes('ai')) return '🤖';
+  if (t.includes('labs') || t.includes('lab') || t.includes('test') || t.includes('experiment')) return '🧪';
+  if (t.includes('efficiency') || t.includes('rank') || t.includes('todo')) return '📋';
+  if (t.includes('hot') || t.includes('fire') || t.includes('trend')) return '🔥';
+  if (t.includes('settings') || t.includes('gear') || t.includes('config')) return '⚙️';
+  if (t.includes('crown') || t.includes('vip') || t.includes('award') || t.includes('trophy')) return '🏆';
+  if (t.includes('shop') || t.includes('cart') || t.includes('buy')) return '🛒';
+  if (t.includes('plane') || t.includes('travel') || t.includes('trip')) return '✈️';
+  if (t.includes('hotel') || t.includes('home') || t.includes('house')) return '🏠';
+  if (t.includes('art') || t.includes('paint') || t.includes('design')) return '🎨';
+  if (t.includes('lock') || t.includes('safe') || t.includes('shield')) return '🔒';
+  if (t.includes('sun') || t.includes('morning') || t.includes('day')) return '🌅';
+  if (t.includes('night') || t.includes('moon')) return '🌙';
+  if (t.includes('truck') || t.includes('express') || t.includes('delivery') || t.includes('package')) return '🚚';
+  if (t.includes('apartment') || t.includes('app') || t.includes('cube') || t.includes('box')) return '📦';
+  if (t.includes('clap') || t.includes('hand')) return '👏';
+  if (t.includes('snow') || t.includes('snowflake')) return '❄️';
+  if (t.includes('fire') || t.includes('firework')) return '🎆';
+  if (t.includes('movie') || t.includes('film') || t.includes('video')) return '🎬';
+  return '✨';
+}

package/dist/FormRender/widgets/card/style.d.ts

@@ -0,0 +1,13 @@
+export declare const useCardWidgetStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
+    cardRoot: import("antd-style").SerializedStyles;
+    cardHeader: import("antd-style").SerializedStyles;
+    displayHeaderShell: import("antd-style").SerializedStyles;
+    cardHeaderTitle: import("antd-style").SerializedStyles;
+    cardHeaderSubtitle: import("antd-style").SerializedStyles;
+    markdown: import("antd-style").SerializedStyles;
+    columnSet: import("antd-style").SerializedStyles;
+    column: import("antd-style").SerializedStyles;
+    cardButton: import("antd-style").SerializedStyles;
+}>;
+export declare const HEADER_TEMPLATE_BG: Record<string, string>;
+export declare const HEADER_TEMPLATE_COLORS: Record<string, string>;

package/dist/FormRender/widgets/card/style.js

@@ -0,0 +1,47 @@
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+import { createStyles } from 'antd-style';
+export var useCardWidgetStyles = createStyles(function (_ref) {
+  var css = _ref.css,
+    token = _ref.token;
+  return {
+    cardRoot: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    width: 100%;\n    box-sizing: border-box;\n\n    /* \u89C6\u89C9 chrome \u7531\u5916\u5C42 form Wrapper \u63D0\u4F9B\u3002cardRoot widget \u4E0D\u91CD\u590D\u3002\n       \u4E0D\u7528 overflow:hidden \u5426\u5219\u9009\u4E2D\u6001 toolbar(top:-32) \u88AB\u88C1\uFF1B\n       \u4E0D\u7528 overflow-clip-margin\uFF08\u90E8\u5206\u6D4F\u89C8\u5668\u4E0D\u4E00\u81F4\uFF09\u3002\n       cardHeader \u6539\u6210 100% \u5BBD + \u4E0D\u7528\u8D1F margin\uFF0Cbody \u5143\u7D20\u901A\u8FC7\n       fr-field \u5B50\u9009\u62E9\u5668\u52A0\u6C34\u5E73 padding\uFF0C\u533A\u5206\u5BF9\u5F85\u3002 */\n\n    /* === \u5361\u7247\u6A21\u5F0F\u4E0B\u538B\u5E73 FormDesigner Wrapper \u7684\u7D2F\u52A0 padding/margin ===\n       Wrapper \u5DF2\u6539\u98DE\u4E66\u7D27\u51D1\u5E03\u5C40\uFF08padding:2 2 0 + inside 2 2 0 +\n       object paddingTop:4 + margin:0 0 2\uFF09\uFF0C\u4F46\u591A\u5C42\u5D4C\u5957\u4ECD\u4F1A\u7D2F\u52A0\u3002\n       \u5728 cardRoot \u8303\u56F4\u5185\u4E00\u5F8B\u5F52\u96F6\uFF0C\u8BA9\u6211\u4EEC widget \u81EA\u5DF1\u7684 padding/gap\n       \u63A7\u5236\u7A7A\u95F4\uFF1Bhover/select \u53CD\u9988\u8D70 Wrapper \u7684 ::after overlay \u63CF\u8FB9\uFF0C\n       \u4E0D\u4F9D\u8D56\u8FD9\u91CC\u7684 padding\uFF0C\u5F52\u96F6\u540E\u4ECD\u5B8C\u6574\u4FDD\u7559\u3002 */\n    /* reset \u6392\u9664 cardHeader \u2014 \u5426\u5219 .relative.w-100 (2 class specificity)\n       \u4F1A\u8986\u76D6 [data-widget='cardHeader'] (1 attribute) \u7684\u8D1F margin */\n    .relative.w-100:not([data-widget='cardHeader']) {\n      padding: 0 !important;\n      padding-top: 0 !important;\n      padding-bottom: 0 !important;\n      padding-left: 0 !important;\n      padding-right: 0 !important;\n      margin: 0 !important;\n    }\n    /* cardHeader \u7684 wrapper \u4E5F reset padding\uFF0C\u4F46 margin \u8BA9\u51FA\u6765\u7ED9\u8D1F\u503C\u89C4\u5219 */\n    .relative.w-100[data-widget='cardHeader'] {\n      padding: 0 !important;\n    }\n    /* ul \u81EA\u8EAB\u7684\u5DE6 padding \u4E5F\u662F Tachyons pl0=0\uFF0C\u4F46\u6D4F\u89C8\u5668\u9ED8\u8BA4 ul \u8FD8\u6709\n       margin\uFF0C\u7EDF\u4E00\u6E05\u6389\u907F\u514D\u5F71\u54CD\u5217\u8868\u5143\u7D20\u6C34\u5E73/\u5782\u76F4\u5B9A\u4F4D */\n    ul.flex.flex-wrap {\n      margin: 0 !important;\n    }\n    /* form-render \u7ED9\u6BCF\u4E2A\u5B57\u6BB5\u52A0 margin-bottom:12px\uFF0C5+ \u5B57\u6BB5\u7D2F\u52A0 60+px\n       \u591A\u4F59\u7A7A\u9699\uFF1B\u5361\u7247\u6A21\u5F0F\u4E0B\u95F4\u8DDD\u7531 cardRoot/columnSet/column \u7684 gap\n       \u63A7\u5236\uFF0C\u6240\u4EE5\u8FD9\u91CC\u4E5F\u5F52\u96F6\u3002 */\n    .fr-field {\n      margin: 0 !important;\n    }\n    /* form-render Wrapper inside object \u7C7B\u578B\u8FD8\u6709 paddingTop:12 \u5185\u8054\n       \u6837\u5F0F\uFF0C\u4E5F\u538B\u5E73 */\n    .fr-content {\n      padding: 0 !important;\n    }\n\n    /* \u4FEE\u6A2A\u6392\uFF1A\u5F53 columnSet schema \u901A\u8FC7 props.style \u7ED9\u5185\u90E8 ul \u6CE8\u5165\u4E86\n       inline flex-direction:row \u65F6\uFF0C\u8BA9\u8BE5 ul \u6A2A\u6392\u3002 */\n    ul.flex.flex-wrap[style*='row'] {\n      flex-wrap: nowrap;\n    }\n\n    /* \u98DE\u4E66\u7ED3\u6784\u662F .universal-card-body \u81EA\u8EAB\u8BBE padding:12px\uFF0C\u5B50\u5143\u7D20\u5929\u7136\n       \u7F29\u8FDB\uFF1B\u4E0D\u9760\u6BCF\u4E2A\u5B50\u5143\u7D20\u52A0 padding\u3002\u6211\u4EEC cardRoot inner div \u5DF2\u7ECF\u8BBE\n       \u4E86\u6C34\u5E73 padding\uFF08cardRoot.tsx\uFF09\uFF0C\u5B50\u5143\u7D20\u81EA\u52A8\u662F cardWidth - 24px\u3002\n\n       cardHeader \u9700\u8981\u4F8B\u5916\uFF1A\u8D34\u6EE1\u5361\u5BBD + \u7B2C\u4E00\u5F20 header \u8D34\u5361\u9876\u3002\u7528\u8D1F margin\n       \u62B5\u6D88 cardRoot inner \u7684 padding\u3002\u8FD9\u91CC\u7528 descendant \u9009\u62E9\u5668\uFF08\u4E0D\u662F\n       child combinator\uFF09\uFF0C\u4E0D\u4F9D\u8D56 form-render \u5305\u4E86\u51E0\u5C42 fr-field/fr-content\u3002 */\n    /* \u7528 .relative.w-100[data-widget='cardHeader'] \u63D0\u9AD8 specificity\n       (2 class + 1 attribute) \u9632\u6B62\u88AB tachyons .w-100 (width:100%) \u4E0E\n       fieldWrapper margin:0 reset \u53CD\u5411\u8986\u76D6\u3002width:auto \u8BA9\u8D1F margin \u771F\u6B63\n       \u6269\u51FA cardWidth \u800C\u4E0D\u662F\u505C\u7559\u5728\u7236 ul \u7684 inner width\u3002 */\n    .relative.w-100[data-widget='cardHeader'] {\n      margin-left: calc(var(--card-pad-x, 12px) * -1) !important;\n      margin-right: calc(var(--card-pad-x, 12px) * -1) !important;\n      /* flex item width:auto \u4F1A shrink-to-fit\uFF0C\u7528 calc \u663E\u5F0F\u6491\u6EE1\u7236 ul +\n         \u5DE6\u53F3\u5404\u6269 pad-x\uFF0C\u8BA9 cardHeader \u771F\u6B63\u8D34\u6EE1 cardWidth */\n      width: calc(100% + var(--card-pad-x, 12px) * 2) !important;\n      max-width: none !important;\n      flex: 0 0 auto !important;\n    }\n    ul.flex.flex-wrap > .relative.w-100[data-widget='cardHeader']:first-child {\n      margin-top: calc(var(--card-pad-top, 12px) * -1) !important;\n    }\n    /* \u5176\u4ED6 widget wrapper\uFF1Amin/max-width \u7EA6\u675F\u9632\u6B62 flex \u5B50\u9879\u6491\u7834\u5BB9\u5668 */\n    ul.flex.flex-wrap > [data-widget]:not([data-widget='cardHeader']) {\n      min-width: 0;\n      max-width: 100%;\n      box-sizing: border-box;\n    }\n  "]))),
+    /* 飞书 .universal-card-header__bg 实测: padding 12 12 12 20 + 渐变背景图。
+       不再用负 margin（会溢出 cardRoot 边界）。
+       由 cardRoot widget 把 padding 分为「全宽 header 区 + 缩进 body 区」处理。 */
+    cardHeader: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    display: flex;\n    align-items: center;\n    min-height: 48px;\n    min-width: 0;\n    box-sizing: border-box;\n    width: 100%;\n    max-width: 100%;\n    border-top-left-radius: 8px;\n    border-top-right-radius: 8px;\n    overflow: hidden;\n  "]))),
+    displayHeaderShell: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    width: 100%;\n    max-width: 100%;\n    min-width: 0;\n    overflow: hidden;\n    box-sizing: border-box;\n  "]))),
+    /* 飞书 universal-card-text 实测在 header title 用 16/24（订单卡），
+       而 14/24 是 .universal-card-header__text-title-wrapper 容器的
+       line-height（继承用），真实文字是 16px。 */
+    cardHeaderTitle: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    font-size: 16px;\n    font-weight: 400;\n    line-height: 24px;\n    color: #1f2329;\n  "]))),
+    cardHeaderSubtitle: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    font-size: 12px;\n    color: #646a73;\n    line-height: 20px;\n    margin-top: 2px;\n  "]))),
+    /* 飞书 .universal-card-markdown 实测:
+       font-size:14, font-weight:400, line-height:22, color:#1F2329 */
+    markdown: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    font-size: 14px;\n    font-weight: 400;\n    line-height: 22px;\n    color: #1f2329;\n\n    /* \u957F\u5185\u5BB9\uFF08\u542B code\u3001URL\u3001\u8FDE\u7EED\u82F1\u6587/\u6570\u5B57\uFF09\u5FC5\u987B\u5F3A\u5236\u6362\u884C\uFF0C\n       \u5426\u5219\u4F1A\u6491\u7834 cardRoot \u53F3\u8FB9\u754C\u3002pre/code \u7528 horizontal scroll\n       \u515C\u5E95\u9632\u6B62\u4EE3\u7801\u5757\u5355\u884C\u6EA2\u51FA\u3002 */\n    word-break: break-word;\n    overflow-wrap: anywhere;\n    min-width: 0;\n\n    p {\n      margin: 0;\n      word-break: break-word;\n      overflow-wrap: anywhere;\n    }\n    /* \u98DE\u4E66 <strong>/markdown bold \u5B57\u91CD 600\uFF0C\u4E0D\u662F\u6D4F\u89C8\u5668\u9ED8\u8BA4 700 */\n    strong,\n    b {\n      font-weight: 600;\n    }\n    /* \u98DE\u4E66 markdown link \u8272 = #336DF4 */\n    a {\n      color: #336df4;\n      text-decoration: none;\n    }\n    a:hover {\n      color: #5588ff;\n      text-decoration: underline;\n    }\n    /* \u98DE\u4E66 markdown \u6807\u9898\u5B57\u53F7\u68AF\u5EA6\uFF08CDP \u5B9E\u6D4B\uFF1A## = 24/36/600\uFF1B\u4E0D\u662F antd \u9ED8\u8BA4 20/28\uFF09 */\n    h1 {\n      font-size: 28px;\n      line-height: 36px;\n      font-weight: 600;\n      margin: 0;\n    }\n    h2 {\n      font-size: 24px;\n      line-height: 36px;\n      font-weight: 600;\n      margin: 0;\n    }\n    h3 {\n      font-size: 20px;\n      line-height: 28px;\n      font-weight: 600;\n      margin: 0;\n    }\n    h4 {\n      font-size: 16px;\n      line-height: 24px;\n      font-weight: 500;\n      margin: 0;\n    }\n    h5 {\n      font-size: 16px;\n      line-height: 24px;\n      font-weight: 500;\n      margin: 0;\n    }\n    h6 {\n      font-size: 14px;\n      line-height: 22px;\n      font-weight: 500;\n      margin: 0;\n    }\n    /* \u98DE\u4E66 markdown ul/ol \u5B9E\u6D4B\uFF1A\u5B9E\u5FC3\u5706\u70B9 + \u84DD\u8272 marker (#3370FF) +\n       \u7F29\u8FDB 16px (1em)\uFF1Bol \u7528\u963F\u62C9\u4F2F\u6570\u5B57\u84DD\u8272 marker */\n    ul,\n    ol {\n      margin: 0;\n      padding-left: 1em;\n    }\n    ul {\n      list-style-type: disc;\n    }\n    ol {\n      list-style-type: decimal;\n    }\n    li {\n      line-height: 22px;\n      word-break: break-word;\n      overflow-wrap: anywhere;\n    }\n    li::marker {\n      color: #3370ff;\n    }\n    code {\n      background: rgba(31, 35, 41, 0.06);\n      padding: 0 4px;\n      border-radius: 4px;\n      font-size: 13px;\n    }\n    pre code {\n      background: transparent;\n      padding: 0;\n    }\n    pre {\n      background: rgba(31, 35, 41, 0.04);\n      padding: 8px 12px;\n      border-radius: 6px;\n      overflow: auto;\n      margin: 4px 0;\n    }\n    blockquote {\n      border-left: 3px solid rgba(31, 35, 41, 0.15);\n      padding: 0 12px;\n      color: #646a73;\n      margin: 4px 0;\n    }\n    /* \u98DE\u4E66 <font color=\"grey\"> \u5B9E\u9645\u6E32\u67D3\u4E3A var(--N600) \u7070\u8272\uFF0C\u5BF9\u5E94 #646A73 */\n    font[color='grey'] {\n      color: #646a73 !important;\n    }\n    font[color] {\n      color: attr(color);\n    }\n\n    .card-person {\n      display: inline-flex;\n      align-items: center;\n      gap: 4px;\n      padding: 0 6px 0 2px;\n      border-radius: 999px;\n      background: rgba(31, 35, 41, 0.06);\n      color: #1f2329;\n      /* \u98DE\u4E66 universal-card-person--capsule \u5B9E\u6D4B: font 14, lh 22 */\n      font-size: 14px;\n      line-height: 22px;\n      vertical-align: -4px;\n    }\n    /* @mention \u80F6\u56CA\uFF1A\u98DE\u4E66 .universal-card-mention \u5B9E\u6D4B \u84DD\u5B57 + \u6D45\u84DD\u5E95 */\n    .card-mention {\n      display: inline-block;\n      padding: 0 4px;\n      border-radius: 4px;\n      background: rgba(51, 112, 255, 0.1);\n      color: #3370ff;\n      font-size: 14px;\n      line-height: 20px;\n      cursor: pointer;\n    }\n    .card-person-avatar {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      width: 16px;\n      height: 16px;\n      border-radius: 50%;\n      background: ", ";\n      font-size: 11px;\n      line-height: 1;\n      overflow: hidden;\n    }\n    .card-person-avatar img {\n      width: 100%;\n      height: 100%;\n      object-fit: cover;\n    }\n  "])), token.colorFillTertiary),
+    columnSet: css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n    display: flex;\n    align-items: stretch;\n  "]))),
+    column: css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n    display: flex;\n    flex-direction: column;\n    min-width: 0;\n  "]))),
+    cardButton: css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n  "])))
+  };
+});
+
+// 飞书 template header 实测：外层 background-color 用浅色 token
+// (--udtoken-message-card-bg-<template>)，内层叠加渐变 PNG 增加质感。
+// 不是用深色 stripe。值来自 CDP 实测各 template 的 computed background-color。
+export var HEADER_TEMPLATE_BG = {
+  default: 'transparent',
+  blue: '#DDE6FF',
+  wathet: '#D6F0FF',
+  turquoise: '#CDF1EF',
+  green: '#DBF4E5',
+  yellow: '#FFF3CD',
+  orange: '#FEE7CD',
+  red: '#FDE2E2',
+  carmine: '#FDE2E2',
+  violet: '#EADFFF',
+  purple: '#E5D7FF',
+  indigo: '#DDE3FF',
+  grey: '#EFF0F1'
+};
+// 同时保留旧名兼容（cardHeader.tsx 在用）
+export var HEADER_TEMPLATE_COLORS = HEADER_TEMPLATE_BG;

package/dist/FormRender/widgets/card/table.d.ts

@@ -0,0 +1,21 @@
+interface Column {
+    dataType: 'persons' | 'text' | 'markdown' | 'options' | 'lark_md' | 'number';
+    name: string;
+    displayName?: string;
+    horizontalAlign?: 'left' | 'center' | 'right';
+    width?: 'auto' | string;
+}
+interface Props {
+    schema?: {
+        props?: {
+            columns?: Column[];
+            rows?: Record<string, any>[];
+            pageSize?: number;
+            rowHeight?: 'low' | 'middle' | 'high' | string;
+            headerStyle?: any;
+            margin?: string;
+        };
+    };
+}
+export default function Table({ schema }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/FormRender/widgets/card/table.js

@@ -0,0 +1,93 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { Table as AntdTable } from 'antd';
+import { useContext } from 'react';
+import { MentionResolverContext } from "./markdown";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+// 内嵌一个迷你「mention 渲染器」用 Context 解析 person id 数组
+function PersonsCell(_ref) {
+  var ids = _ref.ids;
+  var resolve = useContext(MentionResolverContext);
+  return /*#__PURE__*/_jsx("span", {
+    style: {
+      display: 'inline-flex',
+      alignItems: 'center',
+      gap: 4
+    },
+    children: ids.map(function (id, i) {
+      var info = resolve(id);
+      return /*#__PURE__*/_jsxs("span", {
+        style: {
+          display: 'inline-flex',
+          alignItems: 'center',
+          gap: 4
+        },
+        children: [/*#__PURE__*/_jsx("span", {
+          style: {
+            width: 16,
+            height: 16,
+            borderRadius: '50%',
+            background: 'rgba(31,35,41,0.1)',
+            display: 'inline-flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            fontSize: 11
+          },
+          children: info.avatar || '👤'
+        }), /*#__PURE__*/_jsx("span", {
+          children: info.name
+        })]
+      }, i);
+    })
+  });
+}
+export default function Table(_ref2) {
+  var _schema$props, _sizeMap, _p$columns, _p$rows, _p$margin;
+  var schema = _ref2.schema;
+  var p = (_schema$props = schema === null || schema === void 0 ? void 0 : schema.props) !== null && _schema$props !== void 0 ? _schema$props : {};
+  var sizeMap = {
+    low: 'small',
+    middle: 'middle',
+    high: 'large'
+  };
+  var tableSize = (_sizeMap = sizeMap[p.rowHeight]) !== null && _sizeMap !== void 0 ? _sizeMap : 'small';
+  var cols = ((_p$columns = p.columns) !== null && _p$columns !== void 0 ? _p$columns : []).map(function (c) {
+    var _c$displayName, _c$horizontalAlign;
+    return {
+      title: (_c$displayName = c.displayName) !== null && _c$displayName !== void 0 ? _c$displayName : c.name,
+      dataIndex: c.name,
+      key: c.name,
+      align: (_c$horizontalAlign = c.horizontalAlign) !== null && _c$horizontalAlign !== void 0 ? _c$horizontalAlign : 'left',
+      width: c.width === 'auto' ? undefined : c.width,
+      render: function render(val) {
+        if (c.dataType === 'persons' && Array.isArray(val)) {
+          return /*#__PURE__*/_jsx(PersonsCell, {
+            ids: val
+          });
+        }
+        return String(val !== null && val !== void 0 ? val : '');
+      }
+    };
+  });
+  var data = ((_p$rows = p.rows) !== null && _p$rows !== void 0 ? _p$rows : []).map(function (r, i) {
+    return _objectSpread({
+      key: i
+    }, r);
+  });
+  return /*#__PURE__*/_jsx(AntdTable, {
+    columns: cols,
+    dataSource: data,
+    pagination: p.pageSize ? {
+      pageSize: p.pageSize
+    } : false,
+    size: tableSize,
+    style: {
+      margin: (_p$margin = p.margin) !== null && _p$margin !== void 0 ? _p$margin : 0
+    }
+  });
+}