@nokecy/qc-ui 1.1.68 → 1.1.69

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 (26) hide show
  1. package/dist/cjs/ag-grid-plus/ag-gridPlus.js +1 -16
  2. package/dist/cjs/ag-grid-plus/setting/ColumnConfigForm.js +3 -1
  3. package/dist/cjs/ag-grid-plus/setting/ColumnConfigTable.js +7 -3
  4. package/dist/cjs/ag-grid-plus/setting/ColumnNameCellRenderer.js +9 -6
  5. package/dist/cjs/ag-grid-plus/setting/ColumnSetting.js +4 -2
  6. package/dist/cjs/ag-grid-plus/setting/MoveNodeModal.js +3 -1
  7. package/dist/cjs/ag-grid-plus/setting/NameColumnRenderer.js +6 -4
  8. package/dist/cjs/ag-grid-plus/setting/QuerySchemeManager.js +10 -8
  9. package/dist/cjs/ag-grid-plus/utils/columnProcessors.js +6 -3
  10. package/dist/cjs/array-table/readOnlyFormatters.d.ts +8 -0
  11. package/dist/cjs/array-table/readOnlyFormatters.js +23 -1
  12. package/dist/cjs/array-table/utils.js +49 -12
  13. package/dist/esm/ag-grid-plus/ag-gridPlus.js +3 -18
  14. package/dist/esm/ag-grid-plus/setting/ColumnConfigForm.js +4 -2
  15. package/dist/esm/ag-grid-plus/setting/ColumnConfigTable.js +8 -4
  16. package/dist/esm/ag-grid-plus/setting/ColumnNameCellRenderer.js +10 -7
  17. package/dist/esm/ag-grid-plus/setting/ColumnSetting.js +5 -3
  18. package/dist/esm/ag-grid-plus/setting/MoveNodeModal.js +4 -2
  19. package/dist/esm/ag-grid-plus/setting/NameColumnRenderer.js +7 -5
  20. package/dist/esm/ag-grid-plus/setting/QuerySchemeManager.js +11 -9
  21. package/dist/esm/ag-grid-plus/utils/columnProcessors.js +6 -3
  22. package/dist/esm/array-table/readOnlyFormatters.d.ts +8 -0
  23. package/dist/esm/array-table/readOnlyFormatters.js +22 -0
  24. package/dist/esm/array-table/utils.js +50 -13
  25. package/dist/umd/qc-ui.min.js +1 -1
  26. package/package.json +1 -1
@@ -20,7 +20,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
20
20
  */
21
21
 
22
22
  import React, { useCallback, useMemo, useState, useRef, useEffect } from 'react';
23
- import { Button, Select, Switch, Space, Popconfirm, message, Tag } from 'antd';
23
+ import { Button, Select, Switch, Space, Popconfirm, message, Tag, theme } from 'antd';
24
24
  import { DeleteOutlined, FolderOutlined, FolderAddOutlined, FileOutlined } from '@ant-design/icons';
25
25
  import { AgGridReact } from 'ag-grid-react';
26
26
  import { generateId, normalizeCellAlign } from "./columnGroupUtils";
@@ -239,6 +239,8 @@ var ColumnConfigTable = function ColumnConfigTable(_ref2) {
239
239
  _ref2$scrollY = _ref2.scrollY,
240
240
  scrollY = _ref2$scrollY === void 0 ? 480 : _ref2$scrollY;
241
241
  var gridTheme = useAgGridTheme();
242
+ var _theme$useToken = theme.useToken(),
243
+ token = _theme$useToken.token; // 颜色取主题 token,跟随亮/暗主题 @author nokecy
242
244
  var _useState = useState(items),
243
245
  _useState2 = _slicedToArray(_useState, 2),
244
246
  localItems = _useState2[0],
@@ -681,16 +683,18 @@ var ColumnConfigTable = function ColumnConfigTable(_ref2) {
681
683
  return localItems.filter(isNodeVisible);
682
684
  }, [localItems, expandedKeys, simple]);
683
685
 
684
- // 添加拖拽样式
686
+ // 添加拖拽样式:选择器限定在本表容器(.qc-column-config-table)内,免得弹窗打开期间染到背后列表的行;
687
+ // 拖拽幽灵挂在 body 上,只能全局。颜色取主题 token。@author nokecy
685
688
  useEffect(function () {
686
689
  var style = document.createElement('style');
687
- style.textContent = "\n /* \u62D6\u62FD\u884C\u6837\u5F0F */\n .ag-row-dragging {\n opacity: 0.5;\n transition: opacity 0.2s ease;\n }\n\n /* \u62D6\u62FD\u5E7D\u7075\u6837\u5F0F */\n .ag-dnd-ghost {\n background: #fff !important;\n border: 2px dashed #1890ff !important;\n border-radius: 4px !important;\n padding: 8px !important;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;\n opacity: 0.9 !important;\n font-size: 14px !important;\n }\n\n /* \u53EF\u653E\u7F6E\u76EE\u6807\u9AD8\u4EAE */\n .ag-row-hover.ag-row {\n background-color: #e6f7ff !important;\n transition: background-color 0.2s ease;\n }\n\n /* \u5206\u7EC4\u884C\u7279\u6B8A\u9AD8\u4EAE */\n .ag-row-hover.ag-row[row-id*=\"group\"] {\n background-color: #bae7ff !important;\n border: 2px solid #1890ff;\n transition: all 0.2s ease;\n }\n\n /* \u884C\u52A8\u753B */\n .ag-row {\n transition: transform 0.3s ease, opacity 0.3s ease;\n }\n\n /* \u62D6\u62FD\u624B\u67C4\u6837\u5F0F */\n .ag-row .ag-cell[col-id=\"type\"] {\n cursor: grab !important;\n }\n\n .ag-row-dragging .ag-cell[col-id=\"type\"] {\n cursor: grabbing !important;\n }\n ";
690
+ style.textContent = "\n /* \u62D6\u62FD\u884C\u6837\u5F0F */\n .qc-column-config-table .ag-row-dragging {\n opacity: 0.5;\n transition: opacity 0.2s ease;\n }\n\n /* \u62D6\u62FD\u5E7D\u7075\u6837\u5F0F */\n .ag-dnd-ghost {\n background: ".concat(token.colorBgElevated, " !important;\n color: ").concat(token.colorText, " !important;\n border: 2px dashed ").concat(token.colorPrimary, " !important;\n border-radius: 4px !important;\n padding: 8px !important;\n box-shadow: ").concat(token.boxShadowSecondary, " !important;\n opacity: 0.9 !important;\n font-size: 14px !important;\n }\n\n /* \u53EF\u653E\u7F6E\u76EE\u6807\u9AD8\u4EAE */\n .qc-column-config-table .ag-row-hover.ag-row {\n background-color: ").concat(token.controlItemBgHover, " !important;\n transition: background-color 0.2s ease;\n }\n\n /* \u5206\u7EC4\u884C\u7279\u6B8A\u9AD8\u4EAE */\n .qc-column-config-table .ag-row-hover.ag-row[row-id*=\"group\"] {\n background-color: ").concat(token.controlItemBgActive, " !important;\n border: 2px solid ").concat(token.colorPrimary, ";\n transition: all 0.2s ease;\n }\n\n /* \u884C\u52A8\u753B */\n .qc-column-config-table .ag-row {\n transition: transform 0.3s ease, opacity 0.3s ease;\n }\n\n /* \u62D6\u62FD\u624B\u67C4\u6837\u5F0F */\n .qc-column-config-table .ag-row .ag-cell[col-id=\"type\"] {\n cursor: grab !important;\n }\n\n .qc-column-config-table .ag-row-dragging .ag-cell[col-id=\"type\"] {\n cursor: grabbing !important;\n }\n ");
688
691
  document.head.appendChild(style);
689
692
  return function () {
690
693
  document.head.removeChild(style);
691
694
  };
692
- }, []);
695
+ }, [token]);
693
696
  return /*#__PURE__*/React.createElement("div", {
697
+ className: "qc-column-config-table",
694
698
  style: {
695
699
  width: '100%'
696
700
  }
@@ -15,7 +15,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
15
15
  */
16
16
 
17
17
  import React, { useState, useCallback, useMemo } from 'react';
18
- import { Input, Typography, Button, Tooltip } from 'antd';
18
+ import { Input, Typography, Button, Tooltip, theme } from 'antd';
19
19
  import { UndoOutlined, InfoCircleOutlined, HolderOutlined } from '@ant-design/icons';
20
20
  var Text = Typography.Text;
21
21
  /**
@@ -27,6 +27,9 @@ export var ColumnNameCellRenderer = function ColumnNameCellRenderer(props) {
27
27
  expandedKeys = props.expandedKeys,
28
28
  onToggleExpand = props.onToggleExpand,
29
29
  allItems = props.allItems;
30
+ var _theme$useToken = theme.useToken(),
31
+ token = _theme$useToken.token; // 颜色取主题 token,跟随亮/暗主题 @author nokecy
32
+
30
33
  var _useState = useState(false),
31
34
  _useState2 = _slicedToArray(_useState, 2),
32
35
  isEditing = _useState2[0],
@@ -111,7 +114,7 @@ export var ColumnNameCellRenderer = function ColumnNameCellRenderer(props) {
111
114
  width: 16,
112
115
  display: 'inline-block',
113
116
  fontSize: '12px',
114
- color: '#666'
117
+ color: token.colorTextSecondary
115
118
  }
116
119
  }, isExpanded ? '▼' : '▶') : /*#__PURE__*/React.createElement("span", {
117
120
  style: {
@@ -120,7 +123,7 @@ export var ColumnNameCellRenderer = function ColumnNameCellRenderer(props) {
120
123
  }
121
124
  }), /*#__PURE__*/React.createElement(HolderOutlined, {
122
125
  style: {
123
- color: '#999',
126
+ color: token.colorTextTertiary,
124
127
  cursor: 'grab',
125
128
  fontSize: '14px'
126
129
  }
@@ -143,7 +146,7 @@ export var ColumnNameCellRenderer = function ColumnNameCellRenderer(props) {
143
146
  type: "secondary",
144
147
  style: {
145
148
  fontSize: '11px',
146
- color: '#8c8c8c',
149
+ color: token.colorTextTertiary,
147
150
  lineHeight: '16px'
148
151
  }
149
152
  }, "\u539F\u59CB: ", item.originalHeaderName), /*#__PURE__*/React.createElement(Tooltip, {
@@ -151,7 +154,7 @@ export var ColumnNameCellRenderer = function ColumnNameCellRenderer(props) {
151
154
  }, /*#__PURE__*/React.createElement(InfoCircleOutlined, {
152
155
  style: {
153
156
  fontSize: '11px',
154
- color: '#1890ff',
157
+ color: token.colorPrimary,
155
158
  cursor: 'help'
156
159
  }
157
160
  }))), /*#__PURE__*/React.createElement("div", {
@@ -173,10 +176,10 @@ export var ColumnNameCellRenderer = function ColumnNameCellRenderer(props) {
173
176
  flex: 1,
174
177
  fontSize: '14px',
175
178
  fontWeight: item.type === 'group' ? 600 : 400,
176
- borderBottom: isEditing ? '1px solid #1890ff' : '1px solid transparent',
179
+ borderBottom: isEditing ? "1px solid ".concat(token.colorPrimary) : '1px solid transparent',
177
180
  transition: 'border-color 0.2s',
178
181
  padding: '0 4px',
179
- color: isModified ? '#1890ff' : 'rgba(0, 0, 0, 0.85)'
182
+ color: isModified ? token.colorPrimary : token.colorText
180
183
  }
181
184
  }), isModified && /*#__PURE__*/React.createElement(Tooltip, {
182
185
  title: "\u91CD\u7F6E\u4E3A\u539F\u59CB\u540D\u79F0"
@@ -25,7 +25,7 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
25
25
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
26
26
  import React, { useState, useCallback, useMemo, useEffect } from 'react';
27
27
  import { logger } from "../utils/logger";
28
- import { Modal, Tabs, Space, Button, Input, message, Popconfirm, Tag, Tooltip, Empty } from 'antd';
28
+ import { Modal, Tabs, Space, Button, Input, message, Popconfirm, Tag, Tooltip, Empty, theme } from 'antd';
29
29
  import { SaveOutlined, ReloadOutlined, EditOutlined, DeleteOutlined, StarOutlined, StarFilled, SearchOutlined,
30
30
  // 全局配置相关图标
31
31
  GlobalOutlined, RollbackOutlined, ClearOutlined, ExclamationCircleOutlined } from '@ant-design/icons';
@@ -52,6 +52,8 @@ var ColumnSetting = function ColumnSetting(_ref) {
52
52
  onSaveColumnState = _ref.onSaveColumnState,
53
53
  allColDefsProp = _ref.allColDefs;
54
54
  var gridTheme = useAgGridTheme();
55
+ var _theme$useToken = theme.useToken(),
56
+ token = _theme$useToken.token; // 颜色取主题 token,跟随亮/暗主题 @author nokecy
55
57
  // 使用新的集中式方案管理 API(包含状态数据和操作方法)
56
58
  var _useGridSchemes = useGridSchemes(),
57
59
  columnSchemes = _useGridSchemes.columnSchemes,
@@ -946,7 +948,7 @@ var ColumnSetting = function ColumnSetting(_ref) {
946
948
  title: '重置所有用户配置',
947
949
  content: /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("p", {
948
950
  style: {
949
- color: '#ff4d4f',
951
+ color: token.colorError,
950
952
  fontWeight: 'bold'
951
953
  }
952
954
  }, "\u6B64\u64CD\u4F5C\u4E0D\u53EF\u6062\u590D\uFF01"), /*#__PURE__*/React.createElement("p", null, "\u786E\u5B9A\u8981\u5220\u9664\u6240\u6709\u7528\u6237\u7684\u4E2A\u4EBA\u5217\u914D\u7F6E\u5417\uFF1F"), /*#__PURE__*/React.createElement("p", null, "\u6267\u884C\u540E\uFF0C\u6240\u6709\u7528\u6237\u5C06\u4F7F\u7528\u5168\u5C40\u9ED8\u8BA4\u914D\u7F6E\u3002")),
@@ -1177,7 +1179,7 @@ var ColumnSetting = function ColumnSetting(_ref) {
1177
1179
  marginLeft: 16,
1178
1180
  fontSize: 14,
1179
1181
  fontWeight: 'normal',
1180
- color: '#1890ff'
1182
+ color: token.colorPrimary
1181
1183
  }
1182
1184
  }, "- \u5F53\u524D\u65B9\u6848: ", currentScheme.name, isUsingGlobalFallback && currentScheme.isGlobal && /*#__PURE__*/React.createElement(Tag, {
1183
1185
  color: "orange",
@@ -4,7 +4,7 @@
4
4
  */
5
5
 
6
6
  import React, { useMemo } from 'react';
7
- import { Modal, Tree, message } from 'antd';
7
+ import { Modal, Tree, message, theme } from 'antd';
8
8
  import { FolderOutlined, FileOutlined } from '@ant-design/icons';
9
9
  import DraggableModal from "../../draggableModal";
10
10
  var MoveNodeModal = function MoveNodeModal(_ref) {
@@ -13,6 +13,8 @@ var MoveNodeModal = function MoveNodeModal(_ref) {
13
13
  allItems = _ref.allItems,
14
14
  onCancel = _ref.onCancel,
15
15
  onConfirm = _ref.onConfirm;
16
+ var _theme$useToken = theme.useToken(),
17
+ token = _theme$useToken.token; // 颜色取主题 token,跟随亮/暗主题 @author nokecy
16
18
  /**
17
19
  * 将扁平数据转换为 Tree 结构
18
20
  */
@@ -133,7 +135,7 @@ var MoveNodeModal = function MoveNodeModal(_ref) {
133
135
  }, /*#__PURE__*/React.createElement("div", {
134
136
  style: {
135
137
  marginBottom: 16,
136
- color: '#666'
138
+ color: token.colorTextSecondary
137
139
  }
138
140
  }, "\u8BF7\u9009\u62E9\u76EE\u6807\u7236\u8282\u70B9(\u53EA\u80FD\u9009\u62E9\u5206\u7EC4\u8282\u70B9):"), /*#__PURE__*/React.createElement(Tree, {
139
141
  showIcon: true,
@@ -4,7 +4,7 @@
4
4
  */
5
5
 
6
6
  import React from 'react';
7
- import { Input, Tag } from 'antd';
7
+ import { Input, Tag, theme } from 'antd';
8
8
  import { FolderOutlined, FileOutlined } from '@ant-design/icons';
9
9
  /**
10
10
  * 名称列渲染组件
@@ -18,6 +18,8 @@ var NameColumnRenderer = function NameColumnRenderer(_ref) {
18
18
  var type = record.type,
19
19
  level = record.level,
20
20
  _isNew = record._isNew;
21
+ var _theme$useToken = theme.useToken(),
22
+ token = _theme$useToken.token; // 颜色取主题 token,跟随亮/暗主题 @author nokecy
21
23
 
22
24
  // 计算缩进(每层 20px)
23
25
  var indent = level * 20;
@@ -38,12 +40,12 @@ var NameColumnRenderer = function NameColumnRenderer(_ref) {
38
40
  // 节点类型图标
39
41
  var NodeIcon = type === 'group' ? /*#__PURE__*/React.createElement(FolderOutlined, {
40
42
  style: {
41
- color: '#1890ff',
43
+ color: token.colorPrimary,
42
44
  fontSize: 14
43
45
  }
44
46
  }) : /*#__PURE__*/React.createElement(FileOutlined, {
45
47
  style: {
46
- color: '#52c41a',
48
+ color: token.colorSuccess,
47
49
  fontSize: 14
48
50
  }
49
51
  });
@@ -56,7 +58,7 @@ var NameColumnRenderer = function NameColumnRenderer(_ref) {
56
58
  }
57
59
  }, level > 0 && /*#__PURE__*/React.createElement("span", {
58
60
  style: {
59
- color: '#999',
61
+ color: token.colorTextTertiary,
60
62
  fontFamily: 'monospace',
61
63
  fontSize: 12,
62
64
  flexShrink: 0
@@ -80,7 +82,7 @@ var NameColumnRenderer = function NameColumnRenderer(_ref) {
80
82
  placeholder: type === 'group' ? '请输入分组名称' : '请输入列名称',
81
83
  style: {
82
84
  flex: 1,
83
- background: _isNew ? '#fff7e6' : 'transparent' // 新添加的节点高亮
85
+ background: _isNew ? token.colorWarningBg : 'transparent' // 新添加的节点高亮
84
86
  }
85
87
  }));
86
88
  };
@@ -25,7 +25,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
25
25
  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; } }
26
26
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
27
27
  import React, { useState, useCallback, useMemo, useRef } from 'react';
28
- import { Tabs, Button, Input, Space, message, Popconfirm, Tag, Tooltip, Switch } from 'antd';
28
+ import { Tabs, Button, Input, Space, message, Popconfirm, Tag, Tooltip, Switch, theme } from 'antd';
29
29
  import DraggableModal from "../../draggableModal";
30
30
  import { EditOutlined, DeleteOutlined, StarOutlined, StarFilled } from '@ant-design/icons';
31
31
  import { AgGridReact } from 'ag-grid-react';
@@ -51,6 +51,8 @@ var QuerySchemeManager = function QuerySchemeManager(_ref) {
51
51
  visible = _ref.visible,
52
52
  onClose = _ref.onClose;
53
53
  var gridTheme = useAgGridTheme();
54
+ var _theme$useToken = theme.useToken(),
55
+ token = _theme$useToken.token; // 颜色取主题 token,跟随亮/暗主题 @author nokecy
54
56
  // 获取方案管理 API
55
57
  var _useGridSchemes = useGridSchemes(),
56
58
  querySchemes = _useGridSchemes.querySchemes,
@@ -599,7 +601,7 @@ var QuerySchemeManager = function QuerySchemeManager(_ref) {
599
601
  }
600
602
  return /*#__PURE__*/React.createElement(Space, null, scheme.isDefault && /*#__PURE__*/React.createElement(StarFilled, {
601
603
  style: {
602
- color: '#faad14'
604
+ color: token.colorWarning
603
605
  }
604
606
  }), /*#__PURE__*/React.createElement("span", null, scheme.name), isCurrent && /*#__PURE__*/React.createElement(Tag, {
605
607
  color: "blue"
@@ -701,7 +703,7 @@ var QuerySchemeManager = function QuerySchemeManager(_ref) {
701
703
  marginLeft: 16,
702
704
  fontSize: 14,
703
705
  fontWeight: 'normal',
704
- color: '#1890ff'
706
+ color: token.colorPrimary
705
707
  }
706
708
  }, "- \u5F53\u524D\u65B9\u6848: ", currentScheme.name)),
707
709
  open: visible,
@@ -722,30 +724,30 @@ var QuerySchemeManager = function QuerySchemeManager(_ref) {
722
724
  style: {
723
725
  marginBottom: 16,
724
726
  padding: '12px 16px',
725
- background: currentScheme ? '#e6f7ff' : '#f5f5f5',
727
+ background: currentScheme ? token.colorPrimaryBg : token.colorFillTertiary,
726
728
  borderRadius: 4,
727
729
  border: '1px solid',
728
- borderColor: currentScheme ? '#91d5ff' : '#d9d9d9'
730
+ borderColor: currentScheme ? token.colorPrimaryBorder : token.colorBorder
729
731
  }
730
732
  }, currentScheme ? /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
731
733
  style: {
732
734
  fontWeight: 600,
733
735
  marginBottom: 4,
734
- color: '#1890ff'
736
+ color: token.colorPrimary
735
737
  }
736
738
  }, "\u5F53\u524D\u65B9\u6848: ", currentScheme.name), currentScheme.description && /*#__PURE__*/React.createElement("div", {
737
739
  style: {
738
740
  fontSize: 12,
739
- color: '#666'
741
+ color: token.colorTextSecondary
740
742
  }
741
743
  }, currentScheme.description)) : /*#__PURE__*/React.createElement("div", {
742
744
  style: {
743
- color: '#666'
745
+ color: token.colorTextSecondary
744
746
  }
745
747
  }, "\u672A\u9009\u62E9\u65B9\u6848 - \u4F7F\u7528\u4E34\u65F6\u914D\u7F6E")), /*#__PURE__*/React.createElement("div", {
746
748
  style: {
747
749
  marginBottom: 16,
748
- color: '#666'
750
+ color: token.colorTextSecondary
749
751
  }
750
752
  }, "\u62D6\u62FD\u4E0B\u65B9\u67E5\u8BE2\u9879\u8C03\u6574\u987A\u5E8F\uFF0C\u4F7F\u7528\u5F00\u5173\u63A7\u5236\u663E\u793A/\u9690\u85CF\uFF0C\u5B8C\u6210\u540E\u53EF\u5E94\u7528\u6216\u4FDD\u5B58\u4E3A\u65B9\u6848"), /*#__PURE__*/React.createElement("div", {
751
753
  style: {
@@ -207,6 +207,8 @@ export function processEllipsisColumn(col) {
207
207
  return col;
208
208
  }
209
209
  return _objectSpread(_objectSpread({}, col), {}, {
210
+ // 块级占满单元格,对齐继承单元格的 text-align(列方案的左/中/右对齐、数字列右对齐);
211
+ // 以前写死 flex 居中,列方案选左对齐也居中,且 flex 容器里省略号不截断。@author nokecy
210
212
  cellRenderer: function cellRenderer(_ref) {
211
213
  var value = _ref.value;
212
214
  return /*#__PURE__*/React.createElement(Text, {
@@ -214,9 +216,10 @@ export function processEllipsisColumn(col) {
214
216
  tooltip: value
215
217
  },
216
218
  style: {
217
- display: 'flex',
218
- justifyContent: 'center',
219
- alignItems: 'center'
219
+ display: 'block',
220
+ width: '100%',
221
+ color: 'inherit',
222
+ lineHeight: 'inherit'
220
223
  }
221
224
  }, value);
222
225
  }
@@ -5,6 +5,14 @@ export type ReadOnlyFormatterCtx = {
5
5
  fieldSchema: any;
6
6
  };
7
7
  export type ReadOnlyFormatter = (value: any, ctx: ReadOnlyFormatterCtx) => string;
8
+ /**
9
+ * 兜底格式化器:注册表里没有的组件(业务自定义的选择器、输入框等),可编辑列按它出懒挂载文本。
10
+ *
11
+ * 显示与控件失焦时看到的一致:原始值原样显示;labelInValue 对象 / 解构字段({value,label})显示 label,
12
+ * 没有 label 才显示 value;数组逐个显示后逗号拼接。显示需要按编码查名称等特殊逻辑的组件,
13
+ * 消费方用 registerReadOnlyFormatter 注册专用格式化器覆盖。@author nokecy
14
+ */
15
+ export declare const fallbackFormatter: ReadOnlyFormatter;
8
16
  /** 消费方扩展自定义只读列的显示逻辑 */
9
17
  export declare const registerReadOnlyFormatter: (component: string, formatter: ReadOnlyFormatter) => void;
10
18
  /**
@@ -94,6 +94,28 @@ var registry = {
94
94
  Checkbox: booleanFormatter
95
95
  };
96
96
 
97
+ /**
98
+ * 兜底格式化器:注册表里没有的组件(业务自定义的选择器、输入框等),可编辑列按它出懒挂载文本。
99
+ *
100
+ * 显示与控件失焦时看到的一致:原始值原样显示;labelInValue 对象 / 解构字段({value,label})显示 label,
101
+ * 没有 label 才显示 value;数组逐个显示后逗号拼接。显示需要按编码查名称等特殊逻辑的组件,
102
+ * 消费方用 registerReadOnlyFormatter 注册专用格式化器覆盖。@author nokecy
103
+ */
104
+ export var fallbackFormatter = function fallbackFormatter(value, ctx) {
105
+ if (value == null || value === '') return '';
106
+ if (Array.isArray(value)) return value.map(function (v) {
107
+ return fallbackFormatter(v, ctx);
108
+ }).filter(Boolean).join(', ');
109
+ if (typeof value === 'boolean') return booleanFormatter(value, ctx);
110
+ if (_typeof(value) === 'object') {
111
+ var _value$label2;
112
+ if (typeof value.format === 'function') return dateFormatter(value, ctx);
113
+ var shown = (_value$label2 = value.label) !== null && _value$label2 !== void 0 ? _value$label2 : value.value;
114
+ return shown == null ? '' : String(shown);
115
+ }
116
+ return String(value);
117
+ };
118
+
97
119
  /** 消费方扩展自定义只读列的显示逻辑 */
98
120
  export var registerReadOnlyFormatter = function registerReadOnlyFormatter(component, formatter) {
99
121
  registry[component] = formatter;
@@ -9,20 +9,20 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
9
9
  function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap; var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator.return && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, catch: function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; }
10
10
  function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
11
11
  function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
12
+ 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); }
12
13
  function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
13
14
  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."); }
14
15
  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); }
15
16
  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; }
16
17
  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; } }
17
18
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
18
- 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); }
19
19
  import React, { useReducer, useRef } from 'react';
20
20
  import { theme } from 'antd';
21
21
  import { useField, useFieldSchema, RecursionField, Observer, useExpressionScope } from '@formily/react';
22
22
  import { isArr, lazyMerge } from '@formily/shared';
23
23
  import { Schema } from '@formily/json-schema';
24
24
  import ArrayBase from "./arrayBase";
25
- import { getReadOnlyFormatter } from "./readOnlyFormatters";
25
+ import { fallbackFormatter, getReadOnlyFormatter } from "./readOnlyFormatters";
26
26
  import { markHeaderGroup } from "./columnGroup";
27
27
  import { CellFocusScope } from "./cellFocusScope";
28
28
  var isColumnComponent = function isColumnComponent(schema) {
@@ -159,6 +159,32 @@ var isSimpleFieldPath = function isSimpleFieldPath(name) {
159
159
  return !!name && /^[^.{}[\]*]+(\.[^.{}[\]*]+)*$/.test(name);
160
160
  };
161
161
 
162
+ /**
163
+ * 解析对象解构字段名 `{value:code,label:name}`(选择器 labelInValue 常用),返回 [对象键, 数据路径] 列表;
164
+ * 不是对象解构、或成员路径不是简单点号路径时返回 null(调用方回退 AgField 全树)。
165
+ * 成员可简写成 `{code}`,等同 `{code:code}`。@author nokecy
166
+ */
167
+ var parseObjectDestructure = function parseObjectDestructure(name) {
168
+ var matched = name && /^\{([^{}]+)\}$/.exec(name.trim());
169
+ if (!matched) return null;
170
+ var members = matched[1].split(',').map(function (part) {
171
+ return part.split(':').map(function (x) {
172
+ return x.trim();
173
+ });
174
+ });
175
+ if (members.some(function (m) {
176
+ return m.length > 2 || !m[0] || !isSimpleFieldPath(m[m.length - 1]);
177
+ })) return null;
178
+ return members.map(function (m) {
179
+ return [m[0], m[m.length - 1]];
180
+ });
181
+ };
182
+
183
+ /** 快路径(只读文本/懒挂载)能自己解析取值的字段名:简单点号路径或对象解构 @author nokecy */
184
+ var isFastPathFieldName = function isFastPathFieldName(name) {
185
+ return isSimpleFieldPath(name) || !!parseObjectDestructure(name);
186
+ };
187
+
162
188
  /**
163
189
  * 按 Formily 字段名从行数据取值。
164
190
  *
@@ -169,6 +195,14 @@ var isSimpleFieldPath = function isSimpleFieldPath(name) {
169
195
  */
170
196
  var readByFieldPath = function readByFieldPath(record, path) {
171
197
  if (record == null) return undefined;
198
+ // 对象解构:与 Formily 一致,按成员路径分别取值拼回 {value, label} 对象 @author nokecy
199
+ var destructure = path.startsWith('{') ? parseObjectDestructure(path) : null;
200
+ if (destructure) return Object.fromEntries(destructure.map(function (_ref3) {
201
+ var _ref4 = _slicedToArray(_ref3, 2),
202
+ key = _ref4[0],
203
+ memberPath = _ref4[1];
204
+ return [key, readByFieldPath(record, memberPath)];
205
+ }));
172
206
  if (path.indexOf('.') < 0) return record[path];
173
207
  return path.split('.').reduce(function (acc, key) {
174
208
  return acc == null ? undefined : acc[key];
@@ -328,7 +362,7 @@ var LazyAgField = function LazyAgField(params) {
328
362
 
329
363
  /** 焦点离开本格:校验通过才卸回懒挂载文本。isStale 为真说明校验期间焦点又回来了或格子已销毁 */
330
364
  var handleLeave = /*#__PURE__*/function () {
331
- var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(isStale) {
365
+ var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(isStale) {
332
366
  var _field$value$indexOf3, _field$value3, _field$value3$indexOf, _field$form;
333
367
  var index, cellField;
334
368
  return _regeneratorRuntime().wrap(function _callee$(_context) {
@@ -372,7 +406,7 @@ var LazyAgField = function LazyAgField(params) {
372
406
  }, _callee, null, [[3, 8]]);
373
407
  }));
374
408
  return function handleLeave(_x) {
375
- return _ref3.apply(this, arguments);
409
+ return _ref5.apply(this, arguments);
376
410
  };
377
411
  }();
378
412
 
@@ -542,11 +576,12 @@ var applyNumberInputDefaults = function applyNumberInputDefaults(dataField) {
542
576
  // 重命名自 useArrayTableColumns:内部无任何 Hook 调用,use 前缀违反 Hook 命名约定且曾在 useMemo 内被调用 @author nokecy
543
577
  var buildArrayTableColumns = function buildArrayTableColumns(dataSource, field, sources) {
544
578
  var arrayPattern = field === null || field === void 0 ? void 0 : field.pattern;
545
- return sources.reduce(function (buf, _ref4, key) {
546
- var name = _ref4.name,
547
- columnProps = _ref4.columnProps,
548
- schema = _ref4.schema,
549
- display = _ref4.display;
579
+ return sources.reduce(function (buf, _ref6, key) {
580
+ var _getReadOnlyFormatter;
581
+ var name = _ref6.name,
582
+ columnProps = _ref6.columnProps,
583
+ schema = _ref6.schema,
584
+ display = _ref6.display;
550
585
  if (display && display !== 'visible') return buf;
551
586
  if (!isColumnComponent(schema)) return buf;
552
587
 
@@ -585,8 +620,10 @@ var buildArrayTableColumns = function buildArrayTableColumns(dataSource, field,
585
620
  // ③ 兜底全树:其余(无格式化器/带 reactions/forceAgField/复杂字段名/只读但无格式化器) -> AgField。
586
621
  var dataField = findDataFieldSchema(schema, name);
587
622
  var component = dataField === null || dataField === void 0 ? void 0 : dataField['x-component'];
588
- var formatter = getReadOnlyFormatter(component);
589
623
  var readOnly = isColumnReadOnlyEligible(arrayPattern, dataField, columnProps);
624
+ // 可编辑的数据字段(非 void 操作按钮)即使是业务自定义组件,也按兜底格式化器出懒挂载文本,默认阅读态;
625
+ // 只读列不兜底:自定义只读组件常显示别的字段(如 SiblingText),按自身值出文本会错。@author nokecy
626
+ var formatter = (_getReadOnlyFormatter = getReadOnlyFormatter(component)) !== null && _getReadOnlyFormatter !== void 0 ? _getReadOnlyFormatter : !readOnly && component && (dataField === null || dataField === void 0 ? void 0 : dataField.type) !== 'void' ? fallbackFormatter : null;
590
627
  var hasReactions = !!(dataField && dataField['x-reactions']);
591
628
  if (!readOnly) applyNumberInputDefaults(dataField);
592
629
  var forceEager = (columnProps === null || columnProps === void 0 ? void 0 : columnProps.forceAgField) === true;
@@ -603,9 +640,9 @@ var buildArrayTableColumns = function buildArrayTableColumns(dataSource, field,
603
640
  var valueGetter = dataFieldName && dataFieldName !== name ? function (params) {
604
641
  return readByFieldPath(params === null || params === void 0 ? void 0 : params.data, dataFieldName);
605
642
  } : undefined;
606
- // 字段名是路径:`item.qty` 的值在 record.item.qty。快路径自己解析,只认点号分段;
607
- // 解构(`{value:a,label:b}`)/数组下标等复杂语法解析不了,回退全树交给 Formily。@author nokecy
608
- var canFastPath = !dataFieldName || isSimpleFieldPath(dataFieldName);
643
+ // 字段名是路径:`item.qty` 的值在 record.item.qty。快路径自己解析点号分段与对象解构(`{value:a,label:b}`);
644
+ // 数组解构/下标等其余语法解析不了,回退全树交给 Formily。@author nokecy
645
+ var canFastPath = !dataFieldName || isFastPathFieldName(dataFieldName);
609
646
 
610
647
  // ① 只读纯文本
611
648
  if (readOnly && formatter && canFastPath) {