@nokecy/qc-ui-components 2.0.0-beta.0 → 2.0.0-beta.2

package/dist/esm/array-table/index.js

@@ -18,12 +18,14 @@ import { connect, mapProps, mapReadPretty } from "@nokecy/formily-react";
 import uniqueId from "lodash/uniqueId";
 import { localeText } from "../ag-grid-plus/locale";
 import { useArrayTableBatchRemove } from "./batchRemove";
-import { useAddition, buildArrayTableColumns, useArrayTableSources, useArrayTableActions, isColumnComponent, collectLazyDefaults, applyLazyDefaults } from "./utils";
+import { useAddition, buildArrayTableColumns, useArrayTableSources, useArrayTableActions, isColumnComponent, collectLazyDefaults, applyLazyDefaults, LazyReadOnlyText, findDataFieldSchema } from "./utils";
 import { groupColumnDefs } from "./columnGroup";
 import { ARRAY_TABLE_INDEX_FIELD, hasOwnIndexColumn, makeIndexColumn } from "./indexColumn";
 import { installDisplaySequenceOrder } from "../shared/gridSequence";
 import { ensureArrayTableRowIds, getArrayTableRowId } from "./rowIdentity";
-import { useCellFocus, useKeyboardNavigation, useRowDrag, suppressNativeInputKeys } from "./hooks";
+import { ARRAY_TABLE_SUMMARY_ROW, withSummaryCells } from "./summary";
+import { useCellFocus, useKeyboardNavigation, useRowDrag, suppressNativeInputKeys, createTabToNextCell, useCellEscapeRevert, focusAddedRow, focusGridCell } from "./hooks";
+import { getDefaultValue } from "./arrayAddBtn";
 import ArrayBase from "./arrayBase";
 import ArrayAddBtn from "./arrayAddBtn";
 import PreviewArrayTable from "./preview";
@@ -32,10 +34,14 @@ import Setting from "../ag-grid-plus/setting/index";
 import { flatConfigToColumnState, flatConfigToGridState } from "../ag-grid-plus/setting/columnGroupUtils";
 
 // AG-Grid v33 主题:行高、单元格居中、去聚焦/选区视觉(编辑态与阅读态共用一份,见 theme.ts)
-import { useArrayTableTheme, ARRAY_TABLE_ROW_HEIGHT, ARRAY_TABLE_FEEDBACK_CLASS } from "./theme";
+import { useArrayTableTheme, useArrayTableMetrics, ARRAY_TABLE_FEEDBACK_CLASS } from "./theme";
 import { DEFAULT_FIXED_COLUMNS_MAX_RATIO, getFixedDerivedSide, reconcileFixedColumns } from "./fixedGuard";
+import { calcAutoGridHeight } from "./autoHeight";
+import { ArrayTableTitle } from "./title";
 import { useFeedbackRows, ROW_FEEDBACK_EXTRA_HEIGHT } from "./rowFeedback";
 import { useGridSchemes } from "../ag-grid-plus/index";
+import { FormLayout, registerErrorLocator } from "@nokecy/formily-antd";
+import { createArrayTableErrorLocator } from "./errorLocator";
 
 /** Addition 配置的 defaultValue 只接受普通对象,其余形态按空对象处理。@author nokecy */
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -47,10 +53,13 @@ var additionRowDefaults = function additionRowDefaults(value) {
 
 //@ts-ignore
 var ArrayTableInner = observer(function (props) {
-  var _props$fixedColumnsMa, _ref, _addition$props$title, _addition$props, _addition$schema, _addition$props$metho, _addition$props3, _addition$props4;
+  var _props$fixedColumnsMa, _ref3, _addition$props$title, _addition$props, _addition$schema, _addition$props$metho, _addition$props3, _addition$props4;
   var height = props.height,
     gridKey = props.gridKey;
   var arrayTableTheme = useArrayTableTheme(true);
+  var _useArrayTableMetrics = useArrayTableMetrics(),
+    rowHeight = _useArrayTableMetrics.rowHeight,
+    headerHeight = _useArrayTableMetrics.headerHeight;
 
   // 【新增】运行时验证 gridKey
   if (!gridKey) {
@@ -115,18 +124,31 @@ var ArrayTableInner = observer(function (props) {
 
   // 有行内错误文字的行撑高,错误文字完整显示在输入框下方(任意行,含最后一行)。
   // 错误行集合由 Formily 事件驱动更新(不在渲染期读错误,避免订阅整张字段表);行集合变化后让 AG-Grid 重算行高。@author nokecy
-  var _useFeedbackRows = useFeedbackRows(field),
+  var _useFeedbackRows = useFeedbackRows(field, FormLayout.useFormLayout().feedbackLayout),
     feedbackRowsRef = _useFeedbackRows.rowsRef,
     feedbackSignature = _useFeedbackRows.signature;
   var getRowHeight = useCallback(function (params) {
-    return params.data && feedbackRowsRef.current.has(params.data) ? ARRAY_TABLE_ROW_HEIGHT + ROW_FEEDBACK_EXTRA_HEIGHT : ARRAY_TABLE_ROW_HEIGHT;
-  }, []);
+    return params.data && feedbackRowsRef.current.has(params.data) ? rowHeight + ROW_FEEDBACK_EXTRA_HEIGHT : rowHeight;
+  }, [rowHeight]);
+  var isAutoHeight = height === 'auto';
+  var autoGridHeight = isAutoHeight ? calcAutoGridHeight({
+    rowCount: dataSource.length,
+    rowHeight: rowHeight,
+    headerHeight: headerHeight,
+    hasSummary: !!props.summary,
+    feedbackRows: feedbackSignature ? feedbackSignature.split(',').length : 0,
+    minRows: props.minRows,
+    maxRows: props.maxRows
+  }) : undefined;
+  // 密度切换时行高基数变了，AG-Grid 不会自己重算已布局的行。
   useEffect(function () {
     gridApiState === null || gridApiState === void 0 || gridApiState.resetRowHeights();
-  }, [feedbackSignature, gridApiState]);
+  }, [feedbackSignature, gridApiState, rowHeight]);
 
   // 使用自定义 hooks
-  var _useCellFocus = useCellFocus(),
+  var _useCellFocus = useCellFocus({
+      openDateOnKeyboard: props.openDateOnKeyboard
+    }),
     focusInputInCell = _useCellFocus.focusInputInCell,
     scheduleCellFocus = _useCellFocus.scheduleCellFocus,
     beginFocusRequest = _useCellFocus.beginFocusRequest;
@@ -194,9 +216,21 @@ var ArrayTableInner = observer(function (props) {
 
   // 交给 AgGridReact 的列定义:按 x-component-props.headerGroup 把相邻同组的列合并成列组(多级表头)。
   // stableColumnDefs 保持扁平,懒列识别、列方案还原等内部逻辑仍用它;只有喂给 AG-Grid 的这一份带分组。@author nokecy
-  var gridColumnDefs = useMemo(function () {
+  var groupedColumnDefs = useMemo(function () {
     return groupColumnDefs(stableColumnDefs);
   }, [stableColumnDefs]);
+  // 合计行：渲染所需的 summary / 行数据经 ref 取最新值，列定义只在是否启用合计变化时重建。@author nokecy
+  var summaryRef = useRef(props.summary);
+  summaryRef.current = props.summary;
+  var hasSummary = !!props.summary;
+  var gridColumnDefs = useMemo(function () {
+    return hasSummary ? withSummaryCells(groupedColumnDefs, function () {
+      return summaryRef.current;
+    }, function () {
+      var _ref;
+      return (_ref = field.value) !== null && _ref !== void 0 ? _ref : [];
+    }) : groupedColumnDefs;
+  }, [groupedColumnDefs, hasSummary, field]);
 
   // 懒挂载:把激活态 Set 通过 AG-Grid context 暴露给 LazyAgField(引用稳定,原地 mutate)。@author nokecy
   var gridContext = useMemo(function () {
@@ -278,9 +312,116 @@ var ArrayTableInner = observer(function (props) {
     applyFixedGuard(gridApiState);
   }, [applyFixedGuard, gridApiState]);
 
+  // 末格 Tab 新增行：新行要等 rowData 更新进入 AG 行模型后才能聚焦，待办存在 ref 里由 onRowDataUpdated 兑现。
+  // 不能在 push 之后按定时器猜时机，也不能让同一次 Tab 的 onCellKeyDown 再发起落焦（会取消这里的请求）。@author nokecy
+  var pendingAddFocusRef = useRef(null);
+  var flushPendingAddFocus = function flushPendingAddFocus(api) {
+    var pending = pendingAddFocusRef.current;
+    if (!pending || !api) return;
+    if (focusAddedRow({
+      api: api,
+      root: ref,
+      pending: pending,
+      beginFocusRequest: beginFocusRequest,
+      focusInputInCell: focusInputInCell,
+      activateCell: activateCell
+    })) {
+      pendingAddFocusRef.current = null;
+    }
+  };
   // 键盘导航 hook 需要 activateCell(导航进懒列时先挂载再聚焦),故置于其后。@author nokecy
-  var _useKeyboardNavigatio = useKeyboardNavigation(ref, dataSource, focusInputInCell, activateCell, beginFocusRequest),
+  var _useKeyboardNavigatio = useKeyboardNavigation(ref, dataSource, focusInputInCell, activateCell, beginFocusRequest, function () {
+      return pendingAddFocusRef.current != null;
+    }),
     handleCellKeyDown = _useKeyboardNavigatio.handleCellKeyDown;
+  useCellEscapeRevert(ref);
+  // Tab 跳过序号/勾选列；开启 tabAddsRow 时，末格 Tab 新增一行并落焦到新行首个可编辑格。@author nokecy
+  var tabAddsRow = props.tabAddsRow !== false;
+  var tabAddRowRef = useRef(function () {});
+  tabAddRowRef.current = function () {
+    var _api$getAllDisplayedC, _api$getAllDisplayedC2;
+    if (field.pattern !== 'editable' || field.disabled) return;
+    var api = apiRef.current;
+    // 新行的首个可编辑格：跳过序号/勾选列、只读展示列、拖拽手柄列。
+    var colId = ((_api$getAllDisplayedC = api === null || api === void 0 || (_api$getAllDisplayedC2 = api.getAllDisplayedColumns) === null || _api$getAllDisplayedC2 === void 0 ? void 0 : _api$getAllDisplayedC2.call(api)) !== null && _api$getAllDisplayedC !== void 0 ? _api$getAllDisplayedC : []).filter(function (c) {
+      var _c$getColDef, _c$getColDef2;
+      var def = (_c$getColDef = (_c$getColDef2 = c.getColDef) === null || _c$getColDef2 === void 0 ? void 0 : _c$getColDef2.call(c)) !== null && _c$getColDef !== void 0 ? _c$getColDef : {};
+      return c.getColId() !== ARRAY_TABLE_INDEX_FIELD && c.getColId() !== 'ag-Grid-SelectionColumn' && def.cellRenderer !== LazyReadOnlyText && def.rowDrag !== true;
+    }).map(function (c) {
+      return c.getColId();
+    })[0];
+    field.push(getDefaultValue(undefined, schema));
+    var newIndex = (Array.isArray(field.value) ? field.value.length : 1) - 1;
+    addedIndexRef.current = newIndex;
+    setIsAdd(true);
+    if (!api || !colId) return;
+    var addedRow = Array.isArray(field.value) ? field.value[newIndex] : undefined;
+    if (addedRow == null || _typeof(addedRow) !== 'object') return;
+    var pending = {
+      rowId: getArrayTableRowId(addedRow, rowIdMapRef.current),
+      colId: colId
+    };
+    pendingAddFocusRef.current = pending;
+    // 兜底：行更新事件之外再试一次，并保证待办不会一直挂着屏蔽 Tab 落焦。
+    setTimeout(function () {
+      if (pendingAddFocusRef.current !== pending) return;
+      flushPendingAddFocus(apiRef.current);
+      if (pendingAddFocusRef.current === pending) pendingAddFocusRef.current = null;
+    }, 300);
+  };
+  // 提交校验失败时，把表内最靠前的错误格滚到可见、激活并聚焦（定位器注册到 form-error-focus，与表外错误一起按页面位置排序）。
+  // 定位器只注册一次，用到的最新状态经 ref 读取。@author nokecy
+  var errorLocatorColumns = function errorLocatorColumns() {
+    return sources.filter(function (s) {
+      return (!s.display || s.display === 'visible') && isColumnComponent(s.schema);
+    }).map(function (s) {
+      var _findDataFieldSchema, _s$columnProps$header2, _s$columnProps4, _s$columnProps5;
+      return {
+        colId: s.name,
+        dataName: (_findDataFieldSchema = findDataFieldSchema(s.schema, s.name)) === null || _findDataFieldSchema === void 0 ? void 0 : _findDataFieldSchema.name,
+        title: (_s$columnProps$header2 = (_s$columnProps4 = s.columnProps) === null || _s$columnProps4 === void 0 ? void 0 : _s$columnProps4.headerName) !== null && _s$columnProps$header2 !== void 0 ? _s$columnProps$header2 : (_s$columnProps5 = s.columnProps) === null || _s$columnProps5 === void 0 ? void 0 : _s$columnProps5.title
+      };
+    });
+  };
+  var errorLocatorDepsRef = useRef(null);
+  errorLocatorDepsRef.current = {
+    field: field,
+    getContainer: function getContainer() {
+      return ref.current;
+    },
+    getApi: function getApi() {
+      return apiRef.current;
+    },
+    getColumns: errorLocatorColumns,
+    getRowId: function getRowId(row) {
+      return getArrayTableRowId(row, rowIdMapRef.current);
+    },
+    focus: function focus(_ref2) {
+      var rowIndex = _ref2.rowIndex,
+        colId = _ref2.colId;
+      return apiRef.current ? focusGridCell({
+        api: apiRef.current,
+        root: ref,
+        rowIndex: rowIndex,
+        colId: colId,
+        beginFocusRequest: beginFocusRequest,
+        focusInputInCell: focusInputInCell,
+        activateCell: activateCell,
+        ensureColumnVisible: true
+      }) : Promise.resolve(undefined);
+    }
+  };
+  useEffect(function () {
+    return registerErrorLocator(function (form, root) {
+      var deps = errorLocatorDepsRef.current;
+      return deps ? createArrayTableErrorLocator(deps)(form, root) : undefined;
+    });
+  }, [field]);
+  var tabToNextCell = useMemo(function () {
+    return createTabToNextCell(tabAddsRow ? function () {
+      return tabAddRowRef.current();
+    } : undefined);
+  }, [tabAddsRow]);
 
   /**
    * 方案自动加载
@@ -361,11 +502,6 @@ var ArrayTableInner = observer(function (props) {
     }).then(function () {
       if (cancelled || !gridApiState) return;
 
-      // 3. 应用过滤器（在列状态稳定后执行）
-      if (currentScheme.filterModel) {
-        gridApiState.setFilterModel(currentScheme.filterModel);
-      }
-
       // 【关键修复】记录已应用的方案状态（ID + updatedAt）
       lastAppliedSchemeRef.current = {
         id: currentScheme.id,
@@ -386,7 +522,7 @@ var ArrayTableInner = observer(function (props) {
     children: /*#__PURE__*/_jsx("div", {
       ref: ref,
       style: {
-        height: height ? height : 400,
+        height: isAutoHeight ? undefined : height ? height : 400,
         display: 'flex',
         flexDirection: 'column'
       },
@@ -408,8 +544,10 @@ var ArrayTableInner = observer(function (props) {
             style: {
               marginBottom: 5
             },
-            children: [addition ? /*#__PURE__*/_jsx(ArrayAddBtn, _objectSpread(_objectSpread({}, addition.props), {}, {
-              title: (_ref = (_addition$props$title = (_addition$props = addition.props) === null || _addition$props === void 0 ? void 0 : _addition$props.title) !== null && _addition$props$title !== void 0 ? _addition$props$title : (_addition$schema = addition.schema) === null || _addition$schema === void 0 ? void 0 : _addition$schema.title) !== null && _ref !== void 0 ? _ref : '新增'
+            children: [props.title ? /*#__PURE__*/_jsx(ArrayTableTitle, {
+              children: props.title
+            }) : null, addition ? /*#__PURE__*/_jsx(ArrayAddBtn, _objectSpread(_objectSpread({}, addition.props), {}, {
+              title: (_ref3 = (_addition$props$title = (_addition$props = addition.props) === null || _addition$props === void 0 ? void 0 : _addition$props.title) !== null && _addition$props$title !== void 0 ? _addition$props$title : (_addition$schema = addition.schema) === null || _addition$schema === void 0 ? void 0 : _addition$schema.title) !== null && _ref3 !== void 0 ? _ref3 : '新增'
               // 新增行总是回到数组顺序，避免当前列排序把空白新行插到旧明细前面；
               // 先让表格滚到新行,再调用 Addition 节点上自己写的 onAdd,两者都生效。@author nokecy
               ,
@@ -455,7 +593,10 @@ var ArrayTableInner = observer(function (props) {
             })]
           })]
         }), /*#__PURE__*/_jsx("div", {
-          style: {
+          style: isAutoHeight ? {
+            flex: 'none',
+            height: autoGridHeight
+          } : {
             flex: 1,
             minHeight: 0
           }
@@ -504,6 +645,7 @@ var ArrayTableInner = observer(function (props) {
               maintainColumnOrder: true
             },
             onCellKeyDown: handleCellKeyDown,
+            tabToNextCell: tabToNextCell,
             onCellClicked: function onCellClicked(event) {
               var _event$column$getColI, _event$column, _event$colDef, _event$event;
               // 懒挂载:点击懒列存量格时先激活挂树,等挂载完成再聚焦进编辑;否则沿用原即时聚焦。@author nokecy
@@ -524,7 +666,7 @@ var ArrayTableInner = observer(function (props) {
                 if (event.api.getDisplayedRowAtIndex(rowIndex) !== node) return false;
                 var focused = event.api.getFocusedCell();
                 return (focused === null || focused === void 0 ? void 0 : focused.rowIndex) === rowIndex && (focused === null || focused === void 0 ? void 0 : focused.column.getColId()) === colId;
-              });
+              }, justActivated ? 'pointer-activated' : 'pointer');
             },
             onRowDragMove: handleRowDragMove,
             onRowDataUpdated: function onRowDataUpdated(e) {
@@ -544,6 +686,7 @@ var ArrayTableInner = observer(function (props) {
                 addedIndexRef.current = undefined;
                 setIsAdd(false);
               }
+              flushPendingAddFocus(e.api);
               (_props$onRowDataUpdat = props.onRowDataUpdated) === null || _props$onRowDataUpdat === void 0 || _props$onRowDataUpdat.call(props, e);
             },
             rowDragManaged: true,
@@ -567,8 +710,8 @@ var ArrayTableInner = observer(function (props) {
                 '    <span data-ref="eSortAsc" class="ag-header-icon ag-sort-ascending-icon"></span>' + '    <span data-ref="eSortDesc" class="ag-header-icon ag-sort-descending-icon"></span>' + '    <span data-ref="eSortNone" class="ag-header-icon ag-sort-none-icon"></span>' + "  </div>" + "</div>"
               }
             },
-            getRowId: function getRowId(_ref2) {
-              var data = _ref2.data;
+            getRowId: function getRowId(_ref4) {
+              var data = _ref4.data;
               return getArrayTableRowId(data, rowIdMapRef.current);
             }
             // rowDragEntireRow={true}
@@ -588,11 +731,13 @@ var ArrayTableInner = observer(function (props) {
               });
               (_props$onSortChanged = props.onSortChanged) === null || _props$onSortChanged === void 0 || _props$onSortChanged.call(props, event);
             },
-            rowHeight: ARRAY_TABLE_ROW_HEIGHT,
+            rowHeight: rowHeight,
+            headerHeight: headerHeight,
             getRowHeight: getRowHeight,
             pagination: false,
             columnDefs: gridColumnDefs,
-            rowData: dataSource
+            rowData: dataSource,
+            pinnedBottomRowData: hasSummary ? ARRAY_TABLE_SUMMARY_ROW : undefined
           })
         }), sources.map(function (column, key) {
           //专门用来承接对Column的状态管理

package/dist/esm/array-table/interface.d.ts

@@ -3,6 +3,7 @@ import { FieldDisplayTypes, GeneralField } from "@nokecy/formily-core";
 import { Schema } from "@nokecy/formily-json-schema";
 import { AgGridReactProps } from "ag-grid-react";
 import React from "react";
+import type { ArrayTableSummary } from "./summary";
 /**
  * ArrayTable.Column 的 x-component-props 里 qc-ui 自己认的扩展属性;
  * 其余属性(width、headerName、pinned 等)按 AG-Grid 列定义处理。
@@ -42,8 +43,15 @@ interface ObservableColumnSource {
 }
 /** 公共明细表格的业务属性。@author nokecy */
 export type ArrayTableProps = AgGridReactProps & {
+    /** 数字为固定高度；'auto' 按行数自适应（受 minRows / maxRows 限制），默认 400 */
     height?: number | string;
+    /** height='auto' 时至少显示的行数，默认 1 */
+    minRows?: number;
+    /** height='auto' 时最多显示的行数，超出后内部滚动，默认 10 */
+    maxRows?: number;
     gridKey: string;
+    /** 工具栏左侧的区域标题（带主色竖条），与「新增」同一行，不再另起一行占空间 */
+    title?: React.ReactNode;
     onRowDrag?: boolean;
     disabled?: boolean;
     /** 默认对配置标准删除入口的可编辑明细开放批量删除；false 可显式关闭。 */
@@ -55,6 +63,20 @@ export type ArrayTableProps = AgGridReactProps & {
      * 显式写的 pinned 不受影响。传 1 或 Infinity 关闭保护。
      */
     fixedColumnsMaxRatio?: number;
+    /**
+     * 末行最后一格按 Tab 时新增一行并把焦点落到新行首个可编辑格（规范 §7.6.3），默认 true。
+     * 传 `false` 保持旧行为（焦点离开表格）。Shift+Tab、非末格不受影响。
+     */
+    tabAddsRow?: boolean;
+    /**
+     * 键盘（Tab/Enter/方向键）到达日期格时自动展开日期面板，默认 false：与演示一致，鼠标点击展开、键盘到达保持收起。
+     */
+    openDateOnKeyboard?: boolean;
+    /**
+     * 合计行：固定在表尾，键为列的 field，值为固定内容或 `(rows) => 内容`。
+     * 明细变化时自动重算；序号、勾选列和未列出的列该格留空。
+     */
+    summary?: ArrayTableSummary;
 };
 /** ArrayTable 自己认的属性(其余按 AgGridReact 属性处理) */
 type ArrayTableOwnProps = Omit<ArrayTableProps, keyof AgGridReactProps>;

package/dist/esm/array-table/preview.js

@@ -1,16 +1,25 @@
+import { calcAutoGridHeight } from "./autoHeight";
+import { ArrayTableTitle } from "./title";
 import React from "react";
 import { useField } from "@nokecy/formily-react";
 import { buildArrayTableColumns, useArrayTableSources } from "./utils";
 import { AgGridPlus } from "../ag-grid-plus/index";
-import { useArrayTableTheme, ARRAY_TABLE_ROW_HEIGHT } from "./theme";
+import { useArrayTableTheme, useArrayTableMetrics } from "./theme";
+import { ARRAY_TABLE_SUMMARY_ROW, withSummaryCells } from "./summary";
 import { ARRAY_TABLE_INDEX_FIELD, hasOwnIndexColumn, makeIndexColumn } from "./indexColumn";
 import { installDisplaySequenceOrder } from "../shared/gridSequence";
-//@ts-ignore
+/** AgGridPlus 外层卡片的内边距与间隙（实测 24px），自适应高度要把它算进外框，否则最后一行被裁掉 */
 import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var PREVIEW_CHROME_HEIGHT = 24;
+//@ts-ignore
 var ArrayTable = function ArrayTable(props) {
   var _buildArrayTableColum;
   var height = props.height;
   var arrayTablePreviewTheme = useArrayTableTheme();
+  var _useArrayTableMetrics = useArrayTableMetrics(),
+    rowHeight = _useArrayTableMetrics.rowHeight,
+    headerHeight = _useArrayTableMetrics.headerHeight;
   var field = useField();
   var dataSource = Array.isArray(field.value) ? field.value.slice() : [];
   var sources = useArrayTableSources();
@@ -20,9 +29,17 @@ var ArrayTable = function ArrayTable(props) {
   if (showDefaultIndex) {
     columns.unshift(makeIndexColumn());
   }
-  return /*#__PURE__*/_jsx("div", {
+  var title = props.title;
+  var grid = /*#__PURE__*/_jsx("div", {
     style: {
-      height: height ? height : 400
+      height: height === 'auto' ? PREVIEW_CHROME_HEIGHT + calcAutoGridHeight({
+        rowCount: dataSource.length,
+        rowHeight: rowHeight,
+        headerHeight: headerHeight,
+        hasSummary: !!props.summary,
+        minRows: props.minRows,
+        maxRows: props.maxRows
+      }) : height ? height : 400
     },
     children: /*#__PURE__*/_jsx(AgGridPlus, {
       gridOptions: {
@@ -34,9 +51,12 @@ var ArrayTable = function ArrayTable(props) {
         return data._id || data.id;
       },
       hideTool: true,
+      hidePagination: true,
+      headerFilter: false,
       search: false,
       theme: arrayTablePreviewTheme,
-      rowHeight: ARRAY_TABLE_ROW_HEIGHT,
+      rowHeight: rowHeight,
+      headerHeight: headerHeight,
       onGridReady: function onGridReady(event) {
         var _props$onGridReady;
         installDisplaySequenceOrder(event.api);
@@ -60,9 +80,25 @@ var ArrayTable = function ArrayTable(props) {
           });
         }
       },
-      columnDefs: columns,
-      rowData: dataSource
+      columnDefs: props.summary ? withSummaryCells(columns, function () {
+        return props.summary;
+      }, function () {
+        return dataSource;
+      }) : columns,
+      rowData: dataSource,
+      pinnedBottomRowData: props.summary ? ARRAY_TABLE_SUMMARY_ROW : undefined
     })
   });
+  // 预览态没有工具栏，标题单独占一行；标题行高度不算进网格高度
+  return title ? /*#__PURE__*/_jsxs("div", {
+    children: [/*#__PURE__*/_jsx("div", {
+      style: {
+        marginBottom: 5
+      },
+      children: /*#__PURE__*/_jsx(ArrayTableTitle, {
+        children: title
+      })
+    }), grid]
+  }) : grid;
 };
 export default ArrayTable;

package/dist/esm/array-table/rowFeedback.d.ts

@@ -12,7 +12,7 @@ export declare const ROW_FEEDBACK_EXTRA_HEIGHT = 24;
  * 这里读的是整张字段表(queryFeedbacks 会遍历数组下所有字段),不要在组件渲染期间调用——
  * 渲染期读它会让组件订阅字段表,每创建一个字段就重渲一次。请用 useFeedbackRows。@author nokecy
  */
-export declare const collectFeedbackRows: (arrayField: ArrayField) => Set<object>;
+export declare const collectFeedbackRows: (arrayField: ArrayField, defaultLayout?: string) => Set<object>;
 /**
  * 订阅数组下字段的校验反馈,返回「有行内错误文字的行」。
  *
@@ -20,7 +20,7 @@ export declare const collectFeedbackRows: (arrayField: ArrayField) => Set<object
  * 合并成一次(下一个宏任务)重算;行集合变化才触发重渲。rows 供 AG-Grid 的 getRowHeight 同步读取,
  * signature(有错误的行下标)变化时调用方让网格重算行高。@author nokecy
  */
-export declare const useFeedbackRows: (arrayField: ArrayField) => {
+export declare const useFeedbackRows: (arrayField: ArrayField, defaultLayout?: string) => {
     rowsRef: import("react").RefObject<Set<object>>;
     signature: string;
 };

package/dist/esm/array-table/rowFeedback.js

@@ -16,8 +16,8 @@ import uniqueId from 'lodash/uniqueId';
  */
 export var ROW_FEEDBACK_EXTRA_HEIGHT = 24;
 
-/** 这些反馈布局的错误不占行内位置(浮层 / 不显示),不需要撑高行 */
-var OUT_OF_FLOW_LAYOUTS = new Set(['popover', 'none']);
+/** 这些反馈布局的错误不占行内位置(浮层 / 不显示 / terse 紧凑浮层),不需要撑高行 */
+var OUT_OF_FLOW_LAYOUTS = new Set(['popover', 'none', 'terse']);
 
 /**
  * 找出当前有「行内错误文字」的行:返回这些行的数据对象(与 AG-Grid rowData 里的元素同一引用)。
@@ -26,7 +26,7 @@ var OUT_OF_FLOW_LAYOUTS = new Set(['popover', 'none']);
  * 这里读的是整张字段表(queryFeedbacks 会遍历数组下所有字段),不要在组件渲染期间调用——
  * 渲染期读它会让组件订阅字段表,每创建一个字段就重渲一次。请用 useFeedbackRows。@author nokecy
  */
-export var collectFeedbackRows = function collectFeedbackRows(arrayField) {
+export var collectFeedbackRows = function collectFeedbackRows(arrayField, defaultLayout) {
   var rows = new Set();
   var form = arrayField === null || arrayField === void 0 ? void 0 : arrayField.form;
   var value = arrayField === null || arrayField === void 0 ? void 0 : arrayField.value;
@@ -40,12 +40,12 @@ export var collectFeedbackRows = function collectFeedbackRows(arrayField) {
     _step;
   try {
     for (_iterator.s(); !(_step = _iterator.n()).done;) {
-      var _feedback$path$segmen, _feedback$path, _feedback$path2, _feedback$path2$toStr, _feedback$path3, _form$query$take;
+      var _feedback$path$segmen, _feedback$path, _feedback$path2, _feedback$path2$toStr, _feedback$path3, _form$query$take$deco, _form$query$take;
       var feedback = _step.value;
       var index = Number((_feedback$path$segmen = (_feedback$path = feedback.path) === null || _feedback$path === void 0 || (_feedback$path = _feedback$path.segments) === null || _feedback$path === void 0 ? void 0 : _feedback$path[baseLength]) !== null && _feedback$path$segmen !== void 0 ? _feedback$path$segmen : (_feedback$path2 = feedback.path) === null || _feedback$path2 === void 0 || (_feedback$path2$toStr = (_feedback$path3 = _feedback$path2).toString) === null || _feedback$path2$toStr === void 0 ? void 0 : _feedback$path2$toStr.call(_feedback$path3).split('.')[baseLength]);
       var row = value[index];
       if (!Number.isInteger(index) || row == null || _typeof(row) !== 'object') continue;
-      var layout = (_form$query$take = form.query(feedback.address).take()) === null || _form$query$take === void 0 || (_form$query$take = _form$query$take.decoratorProps) === null || _form$query$take === void 0 ? void 0 : _form$query$take.feedbackLayout;
+      var layout = (_form$query$take$deco = (_form$query$take = form.query(feedback.address).take()) === null || _form$query$take === void 0 || (_form$query$take = _form$query$take.decoratorProps) === null || _form$query$take === void 0 ? void 0 : _form$query$take.feedbackLayout) !== null && _form$query$take$deco !== void 0 ? _form$query$take$deco : defaultLayout;
       if (OUT_OF_FLOW_LAYOUTS.has(layout)) continue;
       rows.add(row);
     }
@@ -64,7 +64,7 @@ export var collectFeedbackRows = function collectFeedbackRows(arrayField) {
  * 合并成一次(下一个宏任务)重算;行集合变化才触发重渲。rows 供 AG-Grid 的 getRowHeight 同步读取,
  * signature(有错误的行下标)变化时调用方让网格重算行高。@author nokecy
  */
-export var useFeedbackRows = function useFeedbackRows(arrayField) {
+export var useFeedbackRows = function useFeedbackRows(arrayField, defaultLayout) {
   var rowsRef = useRef(new Set());
   var _useState = useState(''),
     _useState2 = _slicedToArray(_useState, 2),
@@ -80,7 +80,7 @@ export var useFeedbackRows = function useFeedbackRows(arrayField) {
       if (timer !== undefined) clearTimeout(timer);
       timer = setTimeout(function () {
         timer = undefined;
-        var rows = collectFeedbackRows(arrayField);
+        var rows = collectFeedbackRows(arrayField, defaultLayout);
         rowsRef.current = rows;
         var value = Array.isArray(arrayField.value) ? arrayField.value : [];
         var next = value.flatMap(function (row, index) {
@@ -101,7 +101,7 @@ export var useFeedbackRows = function useFeedbackRows(arrayField) {
       if (timer !== undefined) clearTimeout(timer);
       form.removeEffects(id);
     };
-  }, [arrayField]);
+  }, [arrayField, defaultLayout]);
   return {
     rowsRef: rowsRef,
     signature: signature

package/dist/esm/array-table/summary.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import type { ColDef } from 'ag-grid-community';
+/**
+ * 合计行（固定在表尾，不随滚动，不参与排序、勾选、序号）。
+ * 键是列的 field（ArrayTable.Column 的 dataIndex / 内层字段名），值是固定内容，或由当前全部明细行算出内容的函数；
+ * 函数在 Observer 里执行，明细任何字段变化都会重算。没有写到的列该格留空。
+ *
+ * @author nokecy
+ */
+export type ArrayTableSummary = Record<string, React.ReactNode | ((rows: any[]) => React.ReactNode)>;
+/** 合计行的承载数据；AG-Grid 要求固定行有数据对象才会渲染单元格 */
+export declare const ARRAY_TABLE_SUMMARY_ROW: {
+    __arrayTableSummary: boolean;
+}[];
+type SummaryCellParams = {
+    colDef?: ColDef;
+    getSummary: () => ArrayTableSummary | undefined;
+    getRows: () => any[];
+};
+/**
+ * 给列定义补上「固定行用合计渲染」的选择器，普通行仍走列原有的渲染器。
+ * 用 cellRendererSelector 而不是替换 cellRenderer：列上依赖 cellRenderer 身份的逻辑（懒挂载识别等）不受影响。
+ */
+export declare const withSummaryCells: (columns: ColDef[], getSummary: SummaryCellParams['getSummary'], getRows: SummaryCellParams['getRows']) => ColDef[];
+export {};

package/dist/esm/array-table/summary.js

@@ -0,0 +1,66 @@
+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 React from 'react';
+import { Observer } from '@nokecy/formily-react';
+
+/**
+ * 合计行（固定在表尾，不随滚动，不参与排序、勾选、序号）。
+ * 键是列的 field（ArrayTable.Column 的 dataIndex / 内层字段名），值是固定内容，或由当前全部明细行算出内容的函数；
+ * 函数在 Observer 里执行，明细任何字段变化都会重算。没有写到的列该格留空。
+ *
+ * @author nokecy
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+/** 合计行的承载数据；AG-Grid 要求固定行有数据对象才会渲染单元格 */
+export var ARRAY_TABLE_SUMMARY_ROW = [{
+  __arrayTableSummary: true
+}];
+var SummaryCell = function SummaryCell(_ref) {
+  var colDef = _ref.colDef,
+    getSummary = _ref.getSummary,
+    getRows = _ref.getRows;
+  var key = colDef === null || colDef === void 0 ? void 0 : colDef.field;
+  if (!key) return null;
+  return /*#__PURE__*/_jsx(Observer, {
+    children: function children() {
+      var _getSummary;
+      var item = (_getSummary = getSummary()) === null || _getSummary === void 0 ? void 0 : _getSummary[key];
+      var content = typeof item === 'function' ? item(getRows()) : item;
+      return /*#__PURE__*/_jsx(_Fragment, {
+        children: content == null ? null : /*#__PURE__*/_jsx("span", {
+          "data-array-table-summary": key,
+          children: content
+        })
+      });
+    }
+  });
+};
+
+/**
+ * 给列定义补上「固定行用合计渲染」的选择器，普通行仍走列原有的渲染器。
+ * 用 cellRendererSelector 而不是替换 cellRenderer：列上依赖 cellRenderer 身份的逻辑（懒挂载识别等）不受影响。
+ */
+export var withSummaryCells = function withSummaryCells(columns, getSummary, getRows) {
+  return columns.map(function (col) {
+    if (Array.isArray(col.children)) return _objectSpread(_objectSpread({}, col), {}, {
+      children: withSummaryCells(col.children, getSummary, getRows)
+    });
+    return _objectSpread(_objectSpread({}, col), {}, {
+      cellRendererSelector: function cellRendererSelector(params) {
+        var _params$node, _col$cellRendererSele;
+        return (_params$node = params.node) !== null && _params$node !== void 0 && _params$node.rowPinned ? {
+          component: SummaryCell,
+          params: {
+            getSummary: getSummary,
+            getRows: getRows
+          }
+        } : (_col$cellRendererSele = col.cellRendererSelector) === null || _col$cellRendererSele === void 0 ? void 0 : _col$cellRendererSele.call(col, params);
+      }
+    });
+  });
+};