@dckj-npm/dc-material 0.1.376 → 0.1.378

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (59) hide show
  1. package/build/docs/colorful-button.html +3 -3
  2. package/build/docs/colorful-input.html +3 -3
  3. package/build/docs/custom-form/requirements.html +48 -0
  4. package/build/docs/custom-form.html +48 -0
  5. package/build/docs/index.html +3 -3
  6. package/build/docs/teletext-list.html +3 -3
  7. package/build/docs/{umi.6743fcd4.css → umi.b31e14a3.css} +1 -1
  8. package/build/docs/umi.e6e366c9.js +1 -0
  9. package/build/docs/~demos/colorful-button-demo.html +3 -3
  10. package/build/docs/~demos/colorful-input-demo.html +3 -3
  11. package/build/docs/~demos/teletext-list-demo-1.html +3 -3
  12. package/build/docs/~demos/teletext-list-demo.html +3 -3
  13. package/build/lowcode/assets-daily.json +13 -13
  14. package/build/lowcode/assets-dev.json +2 -2
  15. package/build/lowcode/assets-prod.json +13 -13
  16. package/build/lowcode/meta.design.js +1 -1
  17. package/build/lowcode/meta.js +1 -1
  18. package/build/lowcode/render/default/view.css +1 -1
  19. package/build/lowcode/render/default/view.js +1 -1
  20. package/build/lowcode/view.css +1 -1
  21. package/build/lowcode/view.js +1 -1
  22. package/dist/BizComps.css +1 -1
  23. package/dist/BizComps.js +2 -2
  24. package/dist/BizComps.js.map +1 -1
  25. package/es/components/custom-form/CUSTOM_FORM_OPERATION_MANUAL.md +284 -0
  26. package/es/components/custom-form/custom-form.d.ts +168 -2
  27. package/es/components/custom-form/custom-form.js +444 -24
  28. package/es/components/custom-form/index.d.ts +1 -1
  29. package/es/components/custom-form/index.scss +1 -1
  30. package/es/components/custom-form/schema.json +1374 -0
  31. package/es/components/teletext-list/teletext-list-item.d.ts +14 -77
  32. package/es/components/teletext-list/teletext-list-item.js +153 -165
  33. package/es/components/teletext-list/teletext-list-item.scss +53 -4
  34. package/es/components/teletext-list/teletext-list.d.ts +60 -4
  35. package/es/components/teletext-list/teletext-list.js +55 -37
  36. package/lib/components/custom-form/CUSTOM_FORM_OPERATION_MANUAL.md +284 -0
  37. package/lib/components/custom-form/custom-form.d.ts +168 -2
  38. package/lib/components/custom-form/custom-form.js +449 -29
  39. package/lib/components/custom-form/index.d.ts +1 -1
  40. package/lib/components/custom-form/index.scss +1 -1
  41. package/lib/components/custom-form/schema.json +1374 -0
  42. package/lib/components/teletext-list/teletext-list-item.d.ts +14 -77
  43. package/lib/components/teletext-list/teletext-list-item.js +153 -164
  44. package/lib/components/teletext-list/teletext-list-item.scss +53 -4
  45. package/lib/components/teletext-list/teletext-list.d.ts +60 -4
  46. package/lib/components/teletext-list/teletext-list.js +55 -37
  47. package/lowcode/custom-form/meta.ts +1500 -118
  48. package/lowcode/teletext-list/meta.ts +457 -703
  49. package/lowcode/teletext-list/meta.ts.bak +821 -0
  50. package/lowcode_es/custom-form/meta.js +1932 -144
  51. package/lowcode_es/meta.js +1 -1
  52. package/lowcode_es/teletext-list/meta.js +689 -598
  53. package/lowcode_es/teletext-list/meta.ts.bak +821 -0
  54. package/lowcode_lib/custom-form/meta.js +1932 -144
  55. package/lowcode_lib/meta.js +1 -1
  56. package/lowcode_lib/teletext-list/meta.js +689 -598
  57. package/lowcode_lib/teletext-list/meta.ts.bak +821 -0
  58. package/package.json +3 -3
  59. package/build/docs/umi.d20b1d99.js +0 -1
@@ -1,106 +1,43 @@
1
1
  import React from 'react';
2
2
  import './teletext-list-item.scss';
3
3
  import { IconListProps } from './teletext-list';
4
- /**
5
- * 数据
6
- */
7
4
  export interface TeletextListItemProps {
8
- /**
9
- * 点击事件
10
- */
11
5
  onClick?: (e: any) => void;
12
- /**
13
- * 标题
14
- */
15
6
  title?: string;
16
- /**
17
- * 图片地址
18
- */
19
7
  image?: string | string[];
20
- /**
21
- * 图片位置
22
- */
23
- imagePlacement?: 'left' | 'right' | 'top' | 'bottom' | 'left-right' | 'none';
24
- /**
25
- * 说明
26
- */
8
+ imagePlacement?: 'left' | 'right' | 'top' | 'bottom' | 'none';
27
9
  description?: string;
28
- /**
29
- * 标签列表
30
- */
31
10
  tags?: string;
32
- /**
33
- * 控件类型
34
- */
35
11
  type?: 'textAndImg' | 'imgOnly' | 'textOnly';
36
- /**
37
- * 行数
38
- */
39
12
  textLines?: number;
40
- /**
41
- * 子项列数
42
- */
43
13
  itemColumns?: number;
44
- /**
45
- * 图标列表
46
- */
47
14
  iconList?: IconListProps[];
48
- /**
49
- * 列表项内边距
50
- */
51
15
  itemPadding?: number;
52
- /**
53
- * 行数3
54
- */
55
16
  text3?: string;
56
- /**
57
- * 行数4
58
- */
59
17
  text4?: string;
60
- /**
61
- * 图片宽度
62
- */
63
18
  imgWidth?: number;
64
- /**
65
- * 图片高度
66
- */
67
19
  imgHeight?: number;
68
- /**
69
- * 背景颜色
70
- */
71
20
  itemBgColor?: string;
72
- /**
73
- * 样式
74
- */
75
21
  style?: React.CSSProperties;
76
- /**
77
- * 图文对齐方式
78
- */
79
22
  textAlign?: 'flex-start' | 'flex-end' | 'center';
80
- /**
81
- * 是否为购物车列表
82
- */
83
23
  isShoppingCart?: boolean;
84
- /**
85
- * 是否为愿望单列表
86
- */
87
24
  isWishList?: boolean;
88
- /**
89
- * 是否为用户菜单列表
90
- */
91
25
  isUserMenu?: boolean;
92
- /**
93
- * 类型
94
- */
95
26
  itemType?: string;
96
- /**
97
- * 图文间距
98
- */
99
27
  textImgGap?: number;
100
- /**
101
- * 子节点
102
- */
103
- children?: React.ReactNode;
28
+ imgBorderRadius?: number;
29
+ imgObjectFit?: 'cover' | 'contain' | 'fill' | 'none';
30
+ titleColor?: string;
31
+ titleFontSize?: number;
32
+ titleFontWeight?: 'normal' | '500' | '600' | 'bold';
33
+ titleLineClamp?: number;
34
+ descriptionColor?: string;
35
+ descriptionFontSize?: number;
36
+ descriptionFontWeight?: 'normal' | '500' | '600' | 'bold';
37
+ descriptionLineClamp?: number;
38
+ itemBorderRadius?: number;
39
+ itemBorderColor?: string;
40
+ itemBorderWidth?: number;
104
41
  }
105
42
  declare const TeletextListItem: React.FC<TeletextListItemProps>;
106
43
  export default TeletextListItem;
@@ -3,217 +3,205 @@
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
4
  exports.__esModule = true;
5
5
  exports["default"] = void 0;
6
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
7
6
  var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
7
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
8
8
  var _react = _interopRequireWildcard(require("react"));
9
9
  require("./teletext-list-item.scss");
10
- var _childrenNodeHandle = require("../../utils/children-node-handle");
11
10
  var _lowcodeMaterials = require("@alilc/lowcode-materials");
12
- var _excluded = ["onClick", "title", "image", "children", "imagePlacement", "description", "type", "textLines", "itemColumns", "itemPadding", "iconList", "tags", "text3", "text4", "imgWidth", "imgHeight", "itemBgColor", "style", "textAlign", "isShoppingCart", "isWishList", "isUserMenu", "itemType", "textImgGap"],
13
- _excluded2 = ["width", "height"];
11
+ var _excluded = ["onClick", "title", "image", "imagePlacement", "description", "type", "textLines", "itemColumns", "itemPadding", "iconList", "text3", "text4", "imgWidth", "imgHeight", "itemBgColor", "style", "textAlign", "isShoppingCart", "isWishList", "itemType", "textImgGap", "imgBorderRadius", "imgObjectFit", "titleColor", "titleFontSize", "titleFontWeight", "titleLineClamp", "descriptionColor", "descriptionFontSize", "descriptionFontWeight", "descriptionLineClamp", "itemBorderRadius", "itemBorderColor", "itemBorderWidth"];
14
12
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
15
- /**
16
- * 数据
17
- */
13
+ // ─── 图标位置计算(纯函数,无副作用) ────────────────────────────────────────────
14
+ function getIconStyle(icon) {
15
+ var base = {
16
+ position: 'absolute',
17
+ zIndex: 10
18
+ };
19
+ switch (icon.position) {
20
+ case 'leftTop':
21
+ return (0, _extends2["default"])({}, base, {
22
+ top: '0px',
23
+ left: '10px'
24
+ });
25
+ case 'leftBottom':
26
+ return (0, _extends2["default"])({}, base, {
27
+ bottom: '0px',
28
+ left: '10px'
29
+ });
30
+ case 'rightTop':
31
+ return (0, _extends2["default"])({}, base, {
32
+ top: '0px',
33
+ right: '10px'
34
+ });
35
+ case 'rightBottom':
36
+ return (0, _extends2["default"])({}, base, {
37
+ bottom: '0px',
38
+ right: '10px'
39
+ });
40
+ case 'customize':
41
+ return (0, _extends2["default"])({}, base, {
42
+ right: (icon.rightOffset || 0) + "px",
43
+ top: (icon.topOffset || 0) + "px"
44
+ });
45
+ default:
46
+ return base;
47
+ }
48
+ }
18
49
 
50
+ // ─── 文本行内容映射(纯函数) ─────────────────────────────────────────────────────
51
+ function getTextContent(index, title, description, text3, text4) {
52
+ switch (index) {
53
+ case 0:
54
+ return title || '';
55
+ case 1:
56
+ return description || '';
57
+ case 2:
58
+ return text3 || '';
59
+ case 3:
60
+ return text4 || '';
61
+ default:
62
+ return '';
63
+ }
64
+ }
19
65
  var TeletextListItem = function TeletextListItem(_ref) {
20
66
  var _ref$onClick = _ref.onClick,
21
67
  onClick = _ref$onClick === void 0 ? function () {} : _ref$onClick,
22
68
  title = _ref.title,
23
69
  image = _ref.image,
24
- children = _ref.children,
25
70
  imagePlacement = _ref.imagePlacement,
26
71
  description = _ref.description,
27
72
  type = _ref.type,
28
- textLines = _ref.textLines,
73
+ _ref$textLines = _ref.textLines,
74
+ textLines = _ref$textLines === void 0 ? 2 : _ref$textLines,
29
75
  itemColumns = _ref.itemColumns,
30
76
  itemPadding = _ref.itemPadding,
31
77
  iconList = _ref.iconList,
32
- tags = _ref.tags,
33
78
  text3 = _ref.text3,
34
79
  text4 = _ref.text4,
35
- imgWidth = _ref.imgWidth,
36
- imgHeight = _ref.imgHeight,
80
+ _ref$imgWidth = _ref.imgWidth,
81
+ imgWidth = _ref$imgWidth === void 0 ? 100 : _ref$imgWidth,
82
+ _ref$imgHeight = _ref.imgHeight,
83
+ imgHeight = _ref$imgHeight === void 0 ? 100 : _ref$imgHeight,
37
84
  itemBgColor = _ref.itemBgColor,
38
85
  style = _ref.style,
39
86
  textAlign = _ref.textAlign,
40
87
  isShoppingCart = _ref.isShoppingCart,
41
88
  isWishList = _ref.isWishList,
42
- isUserMenu = _ref.isUserMenu,
43
89
  itemType = _ref.itemType,
44
90
  _ref$textImgGap = _ref.textImgGap,
45
91
  textImgGap = _ref$textImgGap === void 0 ? 16 : _ref$textImgGap,
92
+ imgBorderRadius = _ref.imgBorderRadius,
93
+ imgObjectFit = _ref.imgObjectFit,
94
+ titleColor = _ref.titleColor,
95
+ titleFontSize = _ref.titleFontSize,
96
+ titleFontWeight = _ref.titleFontWeight,
97
+ titleLineClamp = _ref.titleLineClamp,
98
+ descriptionColor = _ref.descriptionColor,
99
+ descriptionFontSize = _ref.descriptionFontSize,
100
+ descriptionFontWeight = _ref.descriptionFontWeight,
101
+ descriptionLineClamp = _ref.descriptionLineClamp,
102
+ itemBorderRadius = _ref.itemBorderRadius,
103
+ itemBorderColor = _ref.itemBorderColor,
104
+ itemBorderWidth = _ref.itemBorderWidth,
46
105
  otherProps = (0, _objectWithoutPropertiesLoose2["default"])(_ref, _excluded);
47
- var normalizeNodeKey = function normalizeNodeKey(rawKey) {
48
- if (rawKey === undefined || rawKey === null) {
49
- return '';
50
- }
51
- return String(rawKey).replace(/^\.?\$?/, '');
52
- };
53
106
  var IconComp = _lowcodeMaterials.Icon;
54
- var resultImage = Array.isArray(image) ? image[0] || '' : image || '';
55
107
  var _otherProps = otherProps || {};
56
- var containerClass = "teletext-list__panel__item image-" + imagePlacement + " itemColumns-" + itemColumns;
57
- var childNodeList = _react["default"].Children.toArray(children);
58
- var getChildPropsByKey = function getChildPropsByKey(key) {
59
- var targetKey = normalizeNodeKey(key);
60
- var targetChild = childNodeList.find(function (child) {
61
- var _child$props;
62
- var childKey = normalizeNodeKey(child === null || child === void 0 ? void 0 : child.key);
63
- var childPropsKey = normalizeNodeKey(child === null || child === void 0 ? void 0 : (_child$props = child.props) === null || _child$props === void 0 ? void 0 : _child$props.key);
64
- return childKey === targetKey || childPropsKey === targetKey;
65
- });
66
- return (targetChild === null || targetChild === void 0 ? void 0 : targetChild.props) || {};
67
- };
68
- var imageChildProps = getChildPropsByKey('image');
69
- var imageClassName = ['teletext-list__panel__item_image', imageChildProps === null || imageChildProps === void 0 ? void 0 : imageChildProps.className].filter(Boolean).join(' ');
70
108
 
71
- // 图片尺寸策略(修复:不再写入 Image 子节点 style):
72
- // 低代码设计模式下,调用 imageChildNode.setPropValue('style', ...) 会让引擎以"节点级别"
73
- // 重渲染 Image 节点,直接使用 schema 默认 imgSrc(占位图),绕过父组件
74
- // convertChildren 注入的真实图片 URL,从而导致画布图片回退为默认图。
75
- // 因此 imgWidth / imgHeight prop 是图片尺寸的唯一响应来源:
76
- // • 优先使用 imgWidth/imgHeight prop(TeletextList 层面统一控制)
77
- // • prop 未设置,回退到子节点 style 中已有的宽高值(兼容旧页面)
78
- // • 最终默认 100px
79
- // 子节点 style 中非尺寸属性(margin、padding 等)始终保留。
80
- var childStyle = (imageChildProps === null || imageChildProps === void 0 ? void 0 : imageChildProps.style) || {};
81
- var _childW = childStyle.width,
82
- _childH = childStyle.height,
83
- childLayoutStyle = (0, _objectWithoutPropertiesLoose2["default"])(childStyle, _excluded2);
84
- var DEFAULT_IMG_SIZE = 100;
85
- var imageStyle = (0, _extends2["default"])({}, childLayoutStyle, {
86
- width: typeof imgWidth === 'number' ? imgWidth + "px" : _childW != null ? _childW : DEFAULT_IMG_SIZE + "px",
87
- height: typeof imgHeight === 'number' ? imgHeight + "px" : _childH != null ? _childH : DEFAULT_IMG_SIZE + "px"
88
- });
109
+ // 图片地址:唯一来源是 dataList[i].image prop,不依赖任何子节点 schema
110
+ var resultImage = Array.isArray(image) ? image[0] || '' : image || '';
111
+
112
+ // 图片尺寸:唯一来源是 imgWidth / imgHeight prop(由父组件 TeletextList 统一下发)
113
+ // 不读取、不写入任何子节点 style,彻底消除与低代码引擎节点级重渲染的冲突
114
+ var imageStyle = {
115
+ width: imgWidth + "px",
116
+ height: imgHeight + "px",
117
+ borderRadius: imgBorderRadius != null ? imgBorderRadius + "px" : undefined,
118
+ objectFit: imgObjectFit
119
+ };
120
+ var containerClass = "teletext-list__panel__item image-" + imagePlacement + " itemColumns-" + itemColumns;
89
121
  var containerStyle = (0, _extends2["default"])({
90
- padding: itemPadding + "px",
122
+ padding: itemPadding != null ? itemPadding + "px" : undefined,
91
123
  backgroundColor: itemBgColor,
92
124
  alignItems: textAlign,
93
- gap: textImgGap + "px"
125
+ gap: textImgGap + "px",
126
+ borderRadius: itemBorderRadius != null ? itemBorderRadius + "px" : undefined,
127
+ border: itemBorderWidth != null || itemBorderColor ? (itemBorderWidth !== null && itemBorderWidth !== void 0 ? itemBorderWidth : 1) + "px solid " + (itemBorderColor !== null && itemBorderColor !== void 0 ? itemBorderColor : 'transparent') : undefined
94
128
  }, style);
95
129
 
96
- // 生成图标样式
97
- var getIconStyle = function getIconStyle(icon) {
98
- var baseStyle = {
99
- position: 'absolute',
100
- zIndex: 10
101
- };
102
- // 默认偏移值
103
- var defaultPosition = {};
104
- switch (icon.position) {
105
- case 'leftTop':
106
- defaultPosition = {
107
- top: '0px',
108
- left: '10px'
109
- };
110
- break;
111
- case 'leftBottom':
112
- defaultPosition = {
113
- bottom: '0px',
114
- left: '10px'
115
- };
116
- break;
117
- case 'rightTop':
118
- defaultPosition = {
119
- top: '0px',
120
- right: '10px'
121
- };
122
- break;
123
- case 'rightBottom':
124
- defaultPosition = {
125
- bottom: '0px',
126
- right: '10px'
127
- };
128
- break;
129
- case 'customize':
130
- defaultPosition = {
131
- right: (icon.rightOffset || 0) + "px",
132
- top: (icon.topOffset || 0) + "px"
133
- };
134
- break;
135
- default:
136
- defaultPosition = {};
137
- break;
138
- }
139
- return (0, _extends2["default"])({}, baseStyle, defaultPosition);
140
- };
141
- return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({
142
- className: containerClass,
143
- onClick: onClick,
144
- style: containerStyle
145
- }, _otherProps), resultImage && (imagePlacement === 'left' || imagePlacement === 'top') && type !== 'textOnly' ? (0, _childrenNodeHandle.convertChildren)(children, 'image', {
146
- imgSrc: resultImage,
147
- className: imageClassName,
130
+ // ── 图片元素(原生 img,不依赖低代码 Image 组件 / convertChildren / cloneElement)
131
+ var imageEl = resultImage && type !== 'textOnly' ? /*#__PURE__*/_react["default"].createElement("img", {
132
+ src: resultImage,
133
+ alt: title || '',
134
+ className: "teletext-list__panel__item_image",
148
135
  style: imageStyle
149
- }) : null, type !== 'imgOnly' && itemType === '开关' && /*#__PURE__*/_react["default"].createElement("div", {
136
+ }) : null;
137
+
138
+ // ── 开关行(原生 CSS toggle switch;点击不冒泡到 item,状态由页面级事件控制)
139
+ var switchRow = type !== 'imgOnly' && itemType === '开关' ? /*#__PURE__*/_react["default"].createElement("div", {
150
140
  className: "teletext-list__panel__item__switch",
151
141
  style: {
152
142
  display: 'flex',
153
143
  alignItems: 'center',
154
144
  justifyContent: 'space-between'
155
145
  }
156
- }, (0, _childrenNodeHandle.convertChildren)(children, "text-1", {
157
- children: [title],
158
- className: "teletext-list__panel__item__switch__title"
159
- }), (0, _childrenNodeHandle.convertChildren)(children, "switch-1", {
160
- children: [itemType],
161
- className: "teletext-list__panel__item__switch__switch"
162
- })), type !== 'imgOnly' && itemType !== '开关' && /*#__PURE__*/_react["default"].createElement("div", {
146
+ }, /*#__PURE__*/_react["default"].createElement("span", {
147
+ className: "teletext-list__panel__item__switch__title",
148
+ style: {
149
+ color: titleColor,
150
+ fontSize: titleFontSize != null ? titleFontSize + "px" : undefined,
151
+ fontWeight: titleFontWeight,
152
+ WebkitLineClamp: titleLineClamp
153
+ }
154
+ }, title), /*#__PURE__*/_react["default"].createElement("label", {
155
+ className: "teletext-list__panel__item__switch__toggle",
156
+ onClick: function onClick(e) {
157
+ return e.stopPropagation();
158
+ }
159
+ }, /*#__PURE__*/_react["default"].createElement("input", {
160
+ type: "checkbox"
161
+ }), /*#__PURE__*/_react["default"].createElement("span", {
162
+ className: "teletext-list__panel__item__switch__slider"
163
+ }))) : null;
164
+
165
+ // ── 文本区
166
+ var textArea = type !== 'imgOnly' && itemType !== '开关' ? /*#__PURE__*/_react["default"].createElement("div", {
163
167
  className: "teletext-list__panel__item__text"
164
168
  }, Array.from({
165
169
  length: textLines
166
170
  }).map(function (_, index) {
167
- // 第一行显示标题,其余行显示描述
168
- var content = function () {
169
- switch (index) {
170
- case 0:
171
- return title;
172
- case 1:
173
- return description;
174
- case 2:
175
- return text3;
176
- case 3:
177
- return text4;
178
- default:
179
- return '';
171
+ return /*#__PURE__*/_react["default"].createElement("span", {
172
+ key: index,
173
+ className: "teletext-list__panel__item__text__" + (index === 0 ? 'title' : 'description'),
174
+ style: index === 0 ? {
175
+ color: titleColor,
176
+ fontSize: titleFontSize != null ? titleFontSize + "px" : undefined,
177
+ fontWeight: titleFontWeight,
178
+ WebkitLineClamp: titleLineClamp
179
+ } : {
180
+ color: descriptionColor,
181
+ fontSize: descriptionFontSize != null ? descriptionFontSize + "px" : undefined,
182
+ fontWeight: descriptionFontWeight,
183
+ WebkitLineClamp: descriptionLineClamp
180
184
  }
181
- }();
182
- return (0, _childrenNodeHandle.convertChildren)(children, "text-" + (index + 1), {
183
- children: [content],
184
- className: "teletext-list__panel__item__text__" + (index === 0 ? 'title' : 'description')
185
- });
185
+ }, getTextContent(index, title, description, text3, text4));
186
186
  }), isShoppingCart && /*#__PURE__*/_react["default"].createElement("div", {
187
187
  className: "shopping-cart-select"
188
188
  }, /*#__PURE__*/_react["default"].createElement("div", {
189
189
  className: "select-box"
190
- }, (0, _childrenNodeHandle.convertChildren)(children, 'select-box-1', {
191
- popType: 'dialog',
192
- selectType: 'number',
193
- value: 1,
194
- prefix: '数量',
195
- dialogTitle: '选择数量',
196
- btnText: '确定',
197
- className: 'teletext-list__panel__item__select'
198
- }), (0, _childrenNodeHandle.convertChildren)(children, 'select-box-2', {
199
- popType: 'dialog',
200
- selectType: 'string',
201
- dataList: [{
202
- label: 'M',
203
- value: 'M'
204
- }, {
205
- label: 'X',
206
- value: 'X'
207
- }, {
208
- label: 'XL',
209
- value: 'XL'
210
- }],
211
- value: 'X',
212
- prefix: '尺码',
213
- dialogTitle: '选择尺码',
214
- btnText: '确定',
215
- className: 'teletext-list__panel__item__select'
216
- })), /*#__PURE__*/_react["default"].createElement("div", {
190
+ }, /*#__PURE__*/_react["default"].createElement("select", {
191
+ className: "teletext-list__panel__item__select"
192
+ }, [1, 2, 3, 4, 5].map(function (n) {
193
+ return /*#__PURE__*/_react["default"].createElement("option", {
194
+ key: n,
195
+ value: n
196
+ }, "\u6570\u91CF: ", n);
197
+ })), /*#__PURE__*/_react["default"].createElement("select", {
198
+ className: "teletext-list__panel__item__select"
199
+ }, ['M', 'X', 'XL'].map(function (s) {
200
+ return /*#__PURE__*/_react["default"].createElement("option", {
201
+ key: s,
202
+ value: s
203
+ }, "\u5C3A\u7801: ", s);
204
+ }))), /*#__PURE__*/_react["default"].createElement("div", {
217
205
  className: "shopping-cart-select__btn"
218
206
  }, /*#__PURE__*/_react["default"].createElement("div", {
219
207
  className: "shopping-cart-select__btn__item"
@@ -241,11 +229,12 @@ var TeletextListItem = function TeletextListItem(_ref) {
241
229
  className: "shopping-cart-select-img",
242
230
  src: "https://51ymb.com/source/api/upload/1075055372064133120/2025/202502/20250207/1085235703970926592.png",
243
231
  alt: ""
244
- }), "Remove"))), resultImage && (imagePlacement === 'right' || imagePlacement === 'bottom') && type !== 'textOnly' ? (0, _childrenNodeHandle.convertChildren)(children, 'image', {
245
- imgSrc: resultImage,
246
- className: imageClassName,
247
- style: imageStyle
248
- }) : null, iconList === null || iconList === void 0 ? void 0 : iconList.map(function (icon, index) {
232
+ }), "Remove"))) : null;
233
+ return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({
234
+ className: containerClass,
235
+ onClick: onClick,
236
+ style: containerStyle
237
+ }, _otherProps), (imagePlacement === 'left' || imagePlacement === 'top') && imageEl, switchRow, textArea, (imagePlacement === 'right' || imagePlacement === 'bottom') && imageEl, iconList === null || iconList === void 0 ? void 0 : iconList.map(function (icon, index) {
249
238
  return /*#__PURE__*/_react["default"].createElement("div", {
250
239
  key: index,
251
240
  className: "teletext-list__panel__item__icon size-" + icon.size,
@@ -80,12 +80,61 @@
80
80
  display: -webkit-box;
81
81
  text-overflow: ellipsis;
82
82
  }
83
- .teletext-list__panel__item__switch__switch {
84
- font-size: 14px;
85
- font-weight: 600;
86
- color: #222222;
83
+ // ─── 原生 toggle switch ────────────────────────────────────────────────────────
84
+ .teletext-list__panel__item__switch__toggle {
85
+ position: relative;
86
+ display: inline-block;
87
+ width: 44px;
88
+ height: 24px;
89
+ flex-shrink: 0;
90
+ cursor: pointer;
91
+
92
+ input {
93
+ opacity: 0;
94
+ width: 0;
95
+ height: 0;
96
+ position: absolute;
97
+ }
98
+
99
+ .teletext-list__panel__item__switch__slider {
100
+ position: absolute;
101
+ inset: 0;
102
+ background-color: #cccccc;
103
+ border-radius: 24px;
104
+ transition: background-color 0.2s;
105
+
106
+ &::before {
107
+ content: '';
108
+ position: absolute;
109
+ width: 18px;
110
+ height: 18px;
111
+ left: 3px;
112
+ top: 3px;
113
+ background-color: #fff;
114
+ border-radius: 50%;
115
+ transition: transform 0.2s;
116
+ }
117
+ }
118
+
119
+ input:checked + .teletext-list__panel__item__switch__slider {
120
+ background-color: #4c84ff;
121
+ &::before {
122
+ transform: translateX(20px);
123
+ }
124
+ }
87
125
  }
88
126
  }
127
+ // ─── 购物车 select 下拉菜单 ──────────────────────────────────────────────────────
128
+ .teletext-list__panel__item__select {
129
+ padding: 4px 8px;
130
+ border: 1px solid #dddddd;
131
+ border-radius: 4px;
132
+ font-size: 12px;
133
+ background: #fff;
134
+ color: #333333;
135
+ outline: none;
136
+ cursor: pointer;
137
+ }
89
138
  .shopping-cart-select {
90
139
  display: flex;
91
140
  flex-direction: column;
@@ -28,6 +28,14 @@ interface DataProps {
28
28
  * 类型
29
29
  */
30
30
  itemType?: string;
31
+ /**
32
+ * 扩展文本行3(textLines >= 3 时显示)
33
+ */
34
+ text3?: string;
35
+ /**
36
+ * 扩展文本行4(textLines >= 4 时显示)
37
+ */
38
+ text4?: string;
31
39
  }
32
40
  export interface IconListProps {
33
41
  /**
@@ -65,10 +73,6 @@ export interface TeletextListProps {
65
73
  * @param e
66
74
  */
67
75
  onClick?: (e: any) => void;
68
- /**
69
- * 子节点
70
- */
71
- children?: React.ReactNode;
72
76
  /**
73
77
  * 图片位置
74
78
  */
@@ -142,6 +146,58 @@ export interface TeletextListProps {
142
146
  * 图文间距
143
147
  */
144
148
  textImgGap?: number;
149
+ /**
150
+ * 图片圆角
151
+ */
152
+ imgBorderRadius?: number;
153
+ /**
154
+ * 图片填充方式
155
+ */
156
+ imgObjectFit?: 'cover' | 'contain' | 'fill' | 'none';
157
+ /**
158
+ * 标题颜色
159
+ */
160
+ titleColor?: string;
161
+ /**
162
+ * 标题字体大小
163
+ */
164
+ titleFontSize?: number;
165
+ /**
166
+ * 标题字重
167
+ */
168
+ titleFontWeight?: 'normal' | '500' | '600' | 'bold';
169
+ /**
170
+ * 标题最大行数(超出省略)
171
+ */
172
+ titleLineClamp?: number;
173
+ /**
174
+ * 说明颜色
175
+ */
176
+ descriptionColor?: string;
177
+ /**
178
+ * 说明字体大小
179
+ */
180
+ descriptionFontSize?: number;
181
+ /**
182
+ * 说明字重
183
+ */
184
+ descriptionFontWeight?: 'normal' | '500' | '600' | 'bold';
185
+ /**
186
+ * 说明最大行数(超出省略)
187
+ */
188
+ descriptionLineClamp?: number;
189
+ /**
190
+ * 列表项圆角
191
+ */
192
+ itemBorderRadius?: number;
193
+ /**
194
+ * 列表项边框颜色
195
+ */
196
+ itemBorderColor?: string;
197
+ /**
198
+ * 列表项边框宽度
199
+ */
200
+ itemBorderWidth?: number;
145
201
  }
146
202
  declare const TeletextList: React.FC<TeletextListProps>;
147
203
  export default TeletextList;