@nokecy/qc-ui 1.1.52 → 1.1.53

package/dist/cjs/array-table/hooks.d.ts

@@ -23,12 +23,19 @@ export declare const useRowDrag: (field: ArrayField) => {
     handleRowDragMove: (event: any) => void;
 };
 /**
- * AG-Grid 的 suppressKeyboardEvent:单元格里的输入框按 Ctrl/Cmd+A 时,让浏览器自己全选文字。
+ * 这个按键该不该交给单元格里的输入框自己处理(浏览器原生行为),而不是当成表格的快捷键/单元格导航。
  *
- * AG-Grid 把 Ctrl+A 当成「选中所有单元格」并 preventDefault,输入框(文本框、数字框都一样)
- * 就选不中里面的文字。这里只放行这一个组合;方向键等其余按键仍归 handleCellKeyDown 做单元格导航。
+ * AG-Grid 把 Ctrl+A 当成「选中所有单元格」、Home/End 当成「跳到行首/行尾单元格」并 preventDefault;
+ * 我们的 handleCellKeyDown 又把方向键一律当成「跳到相邻单元格」——输入框里全选、用方向键移动光标、
+ * Shift+方向键扩选文字就全都做不了。规则:
+ *  - Ctrl/Cmd+A、Home/End、带 Shift/Ctrl/Alt/Cmd 的方向键、输入法组字期间的按键 -> 输入框自己处理;
+ *  - 左右方向键:光标还能动就移动光标(有选区时先收起选区),已经在最左/最右再按才跳到相邻单元格;
+ *  - 上下方向键:单行输入框没有纵向光标,照旧在行间导航;多行文本域在首行/末行才导航;
+ *  - 焦点不在输入框里(在单元格本身)、只读输入框(如下拉选择)、不支持光标的输入框:照旧导航。
  * 复制/粘贴/剪切/撤销 AG-Grid 本来就没拦,不必处理。@author nokecy
  */
-export declare const suppressSelectAllInInput: ({ event }: {
+export declare const isNativeInputKey: (event: KeyboardEvent) => boolean;
+/** AG-Grid 的 suppressKeyboardEvent:让 AG-Grid 不再拦截输入框自己处理的按键,并记下这次按键的判定 */
+export declare const suppressNativeInputKeys: ({ event }: {
     event: KeyboardEvent;
 }) => boolean;

package/dist/cjs/array-table/hooks.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useRowDrag = exports.useKeyboardNavigation = exports.useCellFocus = exports.suppressSelectAllInInput = void 0;
+exports.useRowDrag = exports.useKeyboardNavigation = exports.useCellFocus = exports.suppressNativeInputKeys = exports.isNativeInputKey = void 0;
 var _react = require("react");
 // setSelectionRange 仅 textarea 与 text/search/url/tel/password 类型 input 支持;
 // checkbox/number/date 等调用会抛 InvalidStateError,故用白名单守卫。@author nokecy
@@ -17,6 +17,12 @@ var supportsSelectionRange = function supportsSelectionRange(el) {
  */
 var useCellFocus = exports.useCellFocus = function useCellFocus() {
   var focusInputInCell = (0, _react.useCallback)(function (cell) {
+    // 焦点已经在本格的输入框里:用户直接点进去定位光标、双击选词、按住拖选,这些留下的光标/选区都是他的。
+    // 不能再 focus() 并把光标挪到末尾——那会把这些操作在 10ms 后全部抹掉。
+    // 首次点开、键盘导航进来时焦点还不在本格输入框里,不受影响。@author nokecy
+    var active = document.activeElement;
+    if (active && cell.contains(active) && active.matches('input, textarea')) return;
+
     // 首先查找Editable包装的元素
     var editableElement = cell.querySelector('.ant-formily-editable');
     if (editableElement) {
@@ -101,11 +107,15 @@ var useCellFocus = exports.useCellFocus = function useCellFocus() {
  */
 var useKeyboardNavigation = exports.useKeyboardNavigation = function useKeyboardNavigation(ref, dataSource, focusInputInCell, activateCell) {
   var handleCellKeyDown = (0, _react.useCallback)(function (event) {
+    var _nativeKeyDecisions$g;
     var keyEvent = event.event,
       node = event.node,
       colDef = event.colDef,
       api = event.api;
     if (!keyEvent) return;
+    // 输入框里移动光标/扩选/全选的按键归输入框,表格不导航(见 isNativeInputKey)。
+    // 判定用 keydown 当时记下的(见 suppressNativeInputKeys);没记过(不是 AG-Grid 触发的)才现算。
+    if ((_nativeKeyDecisions$g = nativeKeyDecisions.get(keyEvent)) !== null && _nativeKeyDecisions$g !== void 0 ? _nativeKeyDecisions$g : isNativeInputKey(keyEvent)) return;
 
     // 处理上下左右键导航
     if (keyEvent.key === 'ArrowDown' || keyEvent.key === 'ArrowUp' || keyEvent.key === 'ArrowLeft' || keyEvent.key === 'ArrowRight') {
@@ -212,16 +222,52 @@ var useRowDrag = exports.useRowDrag = function useRowDrag(field) {
 };
 
 /**
- * AG-Grid 的 suppressKeyboardEvent:单元格里的输入框按 Ctrl/Cmd+A 时,让浏览器自己全选文字。
+ * 这个按键该不该交给单元格里的输入框自己处理(浏览器原生行为),而不是当成表格的快捷键/单元格导航。
  *
- * AG-Grid 把 Ctrl+A 当成「选中所有单元格」并 preventDefault,输入框(文本框、数字框都一样)
- * 就选不中里面的文字。这里只放行这一个组合;方向键等其余按键仍归 handleCellKeyDown 做单元格导航。
+ * AG-Grid 把 Ctrl+A 当成「选中所有单元格」、Home/End 当成「跳到行首/行尾单元格」并 preventDefault;
+ * 我们的 handleCellKeyDown 又把方向键一律当成「跳到相邻单元格」——输入框里全选、用方向键移动光标、
+ * Shift+方向键扩选文字就全都做不了。规则:
+ *  - Ctrl/Cmd+A、Home/End、带 Shift/Ctrl/Alt/Cmd 的方向键、输入法组字期间的按键 -> 输入框自己处理;
+ *  - 左右方向键:光标还能动就移动光标(有选区时先收起选区),已经在最左/最右再按才跳到相邻单元格;
+ *  - 上下方向键:单行输入框没有纵向光标,照旧在行间导航;多行文本域在首行/末行才导航;
+ *  - 焦点不在输入框里(在单元格本身)、只读输入框(如下拉选择)、不支持光标的输入框:照旧导航。
  * 复制/粘贴/剪切/撤销 AG-Grid 本来就没拦,不必处理。@author nokecy
  */
-var suppressSelectAllInInput = exports.suppressSelectAllInInput = function suppressSelectAllInInput(_ref) {
+var isNativeInputKey = exports.isNativeInputKey = function isNativeInputKey(event) {
   var _target$matches;
-  var event = _ref.event;
-  if (!(event.ctrlKey || event.metaKey) || event.key.toLowerCase() !== 'a') return false;
   var target = event.target;
-  return !!(target !== null && target !== void 0 && (_target$matches = target.matches) !== null && _target$matches !== void 0 && _target$matches.call(target, 'input, textarea, [contenteditable="true"]'));
+  if (!(target !== null && target !== void 0 && (_target$matches = target.matches) !== null && _target$matches !== void 0 && _target$matches.call(target, 'input, textarea, [contenteditable="true"]'))) return false;
+  var key = event.key;
+  if (event.isComposing) return true;
+  if ((event.ctrlKey || event.metaKey) && key.toLowerCase() === 'a') return true;
+  if (key === 'Home' || key === 'End') return true;
+  if (!key.startsWith('Arrow')) return false;
+  if (event.shiftKey || event.ctrlKey || event.altKey || event.metaKey) return true;
+  var el = target;
+  var start = el.selectionStart,
+    end = el.selectionEnd,
+    value = el.value;
+  // 不支持光标的输入框(如 checkbox)、只读输入框:没有光标可动,方向键用来导航
+  if (start == null || end == null || el.readOnly || el.disabled) return false;
+  var collapsed = start === end;
+  if (key === 'ArrowLeft') return !(collapsed && start === 0);
+  if (key === 'ArrowRight') return !(collapsed && end === value.length);
+  if (el.tagName !== 'TEXTAREA') return false;
+  // 多行文本域:光标不在首行才能往上移,不在末行才能往下移
+  return key === 'ArrowUp' ? value.slice(0, start).includes('\n') : value.slice(end).includes('\n');
+};
+
+/**
+ * keydown 当时的判定。AG-Grid 的 onCellKeyDown 回调是在 setTimeout(0) 里才触发的,那时浏览器已经执行完默认动作、
+ * 光标被挪过了:光标从 1 挪到最左、选区收起到末尾之后再算,会误当成「本来就在边缘」而跳格。
+ * suppressKeyboardEvent 是 keydown 时同步调用的,状态还没变,所以在那里记下,回调里直接用。
+ */
+var nativeKeyDecisions = new WeakMap();
+
+/** AG-Grid 的 suppressKeyboardEvent:让 AG-Grid 不再拦截输入框自己处理的按键,并记下这次按键的判定 */
+var suppressNativeInputKeys = exports.suppressNativeInputKeys = function suppressNativeInputKeys(_ref) {
+  var event = _ref.event;
+  var native = isNativeInputKey(event);
+  nativeKeyDecisions.set(event, native);
+  return native;
 };

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

@@ -18,7 +18,7 @@ var _preview = _interopRequireDefault(require("./preview"));
 var _antd = require("antd");
 var _setting = _interopRequireDefault(require("../ag-grid-plus/setting"));
 var _columnGroupUtils = require("../ag-grid-plus/setting/columnGroupUtils");
-var _theme = require("../ag-grid-plus/theme");
+var _theme = require("./theme");
 var _agGridPlus = require("../ag-grid-plus");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
@@ -34,18 +34,7 @@ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructur
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } // 导入 AG-Grid v33 主题
-// array-table 派生主题:去掉单元格聚焦/选区视觉(行内编辑更干净)。
-//   focusShadow            -> 聚焦光环
-//   rangeSelectionBorder   -> 单格点击形成的 1×1 选区蓝边
-//   rangeSelectionBackground -> 选区淡蓝填充
-// 仅去视觉,不动焦点功能——键盘导航/点击进编辑仍依赖 cell focus。共用主题不受影响。@author nokecy
-var arrayTableTheme = _theme.agGridTheme.withParams({
-  focusShadow: 'none',
-  rangeSelectionBorderColor: 'transparent',
-  rangeSelectionBackgroundColor: 'transparent'
-});
-
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } // AG-Grid v33 主题:行高、单元格居中、去聚焦/选区视觉(编辑态与阅读态共用一份,见 theme.ts)
 //@ts-ignore
 var ArrayTableInner = (0, _react2.observer)(function (props) {
   var _addition$props;
@@ -341,7 +330,7 @@ var ArrayTableInner = (0, _react2.observer)(function (props) {
       minHeight: 0
     }
   }, /*#__PURE__*/_react.default.createElement(_agGridReact.AgGridReact, {
-    theme: arrayTableTheme,
+    theme: _theme.arrayTableTheme,
     context: gridContext,
     onGridReady: function onGridReady(params) {
       params.api.hidePopupMenu();
@@ -392,8 +381,8 @@ var ArrayTableInner = (0, _react2.observer)(function (props) {
     enableCellTextSelection: true,
     defaultColDef: {
       resizable: true,
-      // 输入框里的 Ctrl/Cmd+A 交给浏览器全选文字,不让 AG-Grid 当成「选中所有单元格」拦走
-      suppressKeyboardEvent: _hooks.suppressSelectAllInInput,
+      // 输入框里全选、移动光标、扩选等文字编辑按键交给输入框,不让 AG-Grid 当成表格快捷键拦走
+      suppressKeyboardEvent: _hooks.suppressNativeInputKeys,
       headerComponentParams: {
         template: '<div class="ag-cell-label-container" role="presentation">' +
         // '  <span data-ref="eMenu" class="ag-header-icon ag-header-cell-menu-button" aria-hidden="true"></span>' +
@@ -430,7 +419,7 @@ var ArrayTableInner = (0, _react2.observer)(function (props) {
     //   }
     // }}
     ,
-    rowHeight: 38,
+    rowHeight: _theme.ARRAY_TABLE_ROW_HEIGHT,
     pagination: false,
     columnDefs: gridColumnDefs,
     rowData: dataSource

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

@@ -8,6 +8,7 @@ var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@formily/react");
 var _utils = require("./utils");
 var _agGridPlus = require("../ag-grid-plus");
+var _theme = require("./theme");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 //@ts-ignore
 var ArrayTable = function ArrayTable(props) {
@@ -31,7 +32,8 @@ var ArrayTable = function ArrayTable(props) {
     },
     hideTool: true,
     search: false,
-    rowHeight: 38,
+    theme: _theme.arrayTablePreviewTheme,
+    rowHeight: _theme.ARRAY_TABLE_ROW_HEIGHT,
     pagination: false,
     columnDefs: columns,
     rowData: dataSource

package/dist/cjs/array-table/theme.d.ts

@@ -0,0 +1,16 @@
+/**
+ * 行高 38:放得下 32px 高的输入框。网格选项 rowHeight 与主题参数 rowHeight 必须同值——
+ * AG-Grid 单元格文字的行高(--ag-internal-content-line-height)是从主题的 --ag-row-height 算的,
+ * 只设网格选项会让文字的行盒仍是主题默认行高(29.6-3=26.6px),顶在 37px 的格子上方(偏上约 4.5px)。
+ */
+export declare const ARRAY_TABLE_ROW_HEIGHT = 38;
+/** 阅读态主题:共用主题 + 行高 + 单元格居中 */
+export declare const arrayTablePreviewTheme: import("ag-grid-community").Theme<import("ag-grid-community").CoreParams & import("ag-grid-community").ButtonStyleParams & import("ag-grid-community").CheckboxStyleParams & import("ag-grid-community").TabStyleParams & import("ag-grid-community").InputStyleParams & {}>;
+/**
+ * 编辑态主题:在阅读态主题上去掉单元格聚焦/选区视觉(行内编辑更干净)。
+ *   focusShadow            -> 聚焦光环
+ *   rangeSelectionBorder   -> 单格点击形成的 1×1 选区蓝边
+ *   rangeSelectionBackground -> 选区淡蓝填充
+ * 仅去视觉,不动焦点功能——键盘导航/点击进编辑仍依赖 cell focus。
+ */
+export declare const arrayTableTheme: import("ag-grid-community").Theme<import("ag-grid-community").CoreParams & import("ag-grid-community").ButtonStyleParams & import("ag-grid-community").CheckboxStyleParams & import("ag-grid-community").TabStyleParams & import("ag-grid-community").InputStyleParams & {}>;

package/dist/cjs/array-table/theme.js

@@ -0,0 +1,50 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.arrayTableTheme = exports.arrayTablePreviewTheme = exports.ARRAY_TABLE_ROW_HEIGHT = void 0;
+var _agGridCommunity = require("ag-grid-community");
+var _theme = require("../ag-grid-plus/theme");
+/**
+ * ArrayTable(明细表格)的 AG-Grid 主题:编辑态(index.tsx)与阅读态(preview.tsx)共用。
+ *
+ * @author nokecy
+ */
+
+/**
+ * 行高 38:放得下 32px 高的输入框。网格选项 rowHeight 与主题参数 rowHeight 必须同值——
+ * AG-Grid 单元格文字的行高(--ag-internal-content-line-height)是从主题的 --ag-row-height 算的,
+ * 只设网格选项会让文字的行盒仍是主题默认行高(29.6-3=26.6px),顶在 37px 的格子上方(偏上约 4.5px)。
+ */
+var ARRAY_TABLE_ROW_HEIGHT = exports.ARRAY_TABLE_ROW_HEIGHT = 38;
+
+/**
+ * 单元格里的表单项与内容区垂直居中(只对使用本主题的网格生效,共用主题不受影响):
+ *  - .ag-cell-wrapper 撑满格子,align-items:center 才起作用(默认只有内容高,贴在格子顶部);
+ *  - FormItem 默认 margin-bottom:24px(loose 反馈布局给错误文字预留的位置),会把 Editable 外壳撑到 56px、
+ *    输入框偏上、还超出 37px 的格子,归零;
+ *  - 错误提示文字移出文档流(位置仍在输入框下方),出错时输入框不会被挤得上下跳。
+ */
+var arrayTableCellFit = (0, _agGridCommunity.createPart)({
+  feature: 'arrayTableCellFit',
+  css: "\n    .ag-cell .ag-cell-wrapper { height: 100%; }\n    .ag-cell .ant-formily-item { margin-bottom: 0; }\n    .ag-cell .ant-formily-item-help { position: absolute; }\n  "
+});
+
+/** 阅读态主题:共用主题 + 行高 + 单元格居中 */
+var arrayTablePreviewTheme = exports.arrayTablePreviewTheme = _theme.agGridTheme.withParams({
+  rowHeight: ARRAY_TABLE_ROW_HEIGHT
+}).withPart(arrayTableCellFit);
+
+/**
+ * 编辑态主题:在阅读态主题上去掉单元格聚焦/选区视觉(行内编辑更干净)。
+ *   focusShadow            -> 聚焦光环
+ *   rangeSelectionBorder   -> 单格点击形成的 1×1 选区蓝边
+ *   rangeSelectionBackground -> 选区淡蓝填充
+ * 仅去视觉,不动焦点功能——键盘导航/点击进编辑仍依赖 cell focus。
+ */
+var arrayTableTheme = exports.arrayTableTheme = arrayTablePreviewTheme.withParams({
+  focusShadow: 'none',
+  rangeSelectionBorderColor: 'transparent',
+  rangeSelectionBackgroundColor: 'transparent'
+});

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

@@ -23,12 +23,19 @@ export declare const useRowDrag: (field: ArrayField) => {
     handleRowDragMove: (event: any) => void;
 };
 /**
- * AG-Grid 的 suppressKeyboardEvent:单元格里的输入框按 Ctrl/Cmd+A 时,让浏览器自己全选文字。
+ * 这个按键该不该交给单元格里的输入框自己处理(浏览器原生行为),而不是当成表格的快捷键/单元格导航。
  *
- * AG-Grid 把 Ctrl+A 当成「选中所有单元格」并 preventDefault,输入框(文本框、数字框都一样)
- * 就选不中里面的文字。这里只放行这一个组合;方向键等其余按键仍归 handleCellKeyDown 做单元格导航。
+ * AG-Grid 把 Ctrl+A 当成「选中所有单元格」、Home/End 当成「跳到行首/行尾单元格」并 preventDefault;
+ * 我们的 handleCellKeyDown 又把方向键一律当成「跳到相邻单元格」——输入框里全选、用方向键移动光标、
+ * Shift+方向键扩选文字就全都做不了。规则:
+ *  - Ctrl/Cmd+A、Home/End、带 Shift/Ctrl/Alt/Cmd 的方向键、输入法组字期间的按键 -> 输入框自己处理;
+ *  - 左右方向键:光标还能动就移动光标(有选区时先收起选区),已经在最左/最右再按才跳到相邻单元格;
+ *  - 上下方向键:单行输入框没有纵向光标,照旧在行间导航;多行文本域在首行/末行才导航;
+ *  - 焦点不在输入框里(在单元格本身)、只读输入框(如下拉选择)、不支持光标的输入框:照旧导航。
  * 复制/粘贴/剪切/撤销 AG-Grid 本来就没拦,不必处理。@author nokecy
  */
-export declare const suppressSelectAllInInput: ({ event }: {
+export declare const isNativeInputKey: (event: KeyboardEvent) => boolean;
+/** AG-Grid 的 suppressKeyboardEvent:让 AG-Grid 不再拦截输入框自己处理的按键,并记下这次按键的判定 */
+export declare const suppressNativeInputKeys: ({ event }: {
     event: KeyboardEvent;
 }) => boolean;

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

@@ -11,6 +11,12 @@ var supportsSelectionRange = function supportsSelectionRange(el) {
  */
 export var useCellFocus = function useCellFocus() {
   var focusInputInCell = useCallback(function (cell) {
+    // 焦点已经在本格的输入框里:用户直接点进去定位光标、双击选词、按住拖选,这些留下的光标/选区都是他的。
+    // 不能再 focus() 并把光标挪到末尾——那会把这些操作在 10ms 后全部抹掉。
+    // 首次点开、键盘导航进来时焦点还不在本格输入框里,不受影响。@author nokecy
+    var active = document.activeElement;
+    if (active && cell.contains(active) && active.matches('input, textarea')) return;
+
     // 首先查找Editable包装的元素
     var editableElement = cell.querySelector('.ant-formily-editable');
     if (editableElement) {
@@ -95,11 +101,15 @@ export var useCellFocus = function useCellFocus() {
  */
 export var useKeyboardNavigation = function useKeyboardNavigation(ref, dataSource, focusInputInCell, activateCell) {
   var handleCellKeyDown = useCallback(function (event) {
+    var _nativeKeyDecisions$g;
     var keyEvent = event.event,
       node = event.node,
       colDef = event.colDef,
       api = event.api;
     if (!keyEvent) return;
+    // 输入框里移动光标/扩选/全选的按键归输入框,表格不导航(见 isNativeInputKey)。
+    // 判定用 keydown 当时记下的(见 suppressNativeInputKeys);没记过(不是 AG-Grid 触发的)才现算。
+    if ((_nativeKeyDecisions$g = nativeKeyDecisions.get(keyEvent)) !== null && _nativeKeyDecisions$g !== void 0 ? _nativeKeyDecisions$g : isNativeInputKey(keyEvent)) return;
 
     // 处理上下左右键导航
     if (keyEvent.key === 'ArrowDown' || keyEvent.key === 'ArrowUp' || keyEvent.key === 'ArrowLeft' || keyEvent.key === 'ArrowRight') {
@@ -206,16 +216,52 @@ export var useRowDrag = function useRowDrag(field) {
 };
 
 /**
- * AG-Grid 的 suppressKeyboardEvent:单元格里的输入框按 Ctrl/Cmd+A 时,让浏览器自己全选文字。
+ * 这个按键该不该交给单元格里的输入框自己处理(浏览器原生行为),而不是当成表格的快捷键/单元格导航。
  *
- * AG-Grid 把 Ctrl+A 当成「选中所有单元格」并 preventDefault,输入框(文本框、数字框都一样)
- * 就选不中里面的文字。这里只放行这一个组合;方向键等其余按键仍归 handleCellKeyDown 做单元格导航。
+ * AG-Grid 把 Ctrl+A 当成「选中所有单元格」、Home/End 当成「跳到行首/行尾单元格」并 preventDefault;
+ * 我们的 handleCellKeyDown 又把方向键一律当成「跳到相邻单元格」——输入框里全选、用方向键移动光标、
+ * Shift+方向键扩选文字就全都做不了。规则:
+ *  - Ctrl/Cmd+A、Home/End、带 Shift/Ctrl/Alt/Cmd 的方向键、输入法组字期间的按键 -> 输入框自己处理;
+ *  - 左右方向键:光标还能动就移动光标(有选区时先收起选区),已经在最左/最右再按才跳到相邻单元格;
+ *  - 上下方向键:单行输入框没有纵向光标,照旧在行间导航;多行文本域在首行/末行才导航;
+ *  - 焦点不在输入框里(在单元格本身)、只读输入框(如下拉选择)、不支持光标的输入框:照旧导航。
  * 复制/粘贴/剪切/撤销 AG-Grid 本来就没拦,不必处理。@author nokecy
  */
-export var suppressSelectAllInInput = function suppressSelectAllInInput(_ref) {
+export var isNativeInputKey = function isNativeInputKey(event) {
   var _target$matches;
-  var event = _ref.event;
-  if (!(event.ctrlKey || event.metaKey) || event.key.toLowerCase() !== 'a') return false;
   var target = event.target;
-  return !!(target !== null && target !== void 0 && (_target$matches = target.matches) !== null && _target$matches !== void 0 && _target$matches.call(target, 'input, textarea, [contenteditable="true"]'));
+  if (!(target !== null && target !== void 0 && (_target$matches = target.matches) !== null && _target$matches !== void 0 && _target$matches.call(target, 'input, textarea, [contenteditable="true"]'))) return false;
+  var key = event.key;
+  if (event.isComposing) return true;
+  if ((event.ctrlKey || event.metaKey) && key.toLowerCase() === 'a') return true;
+  if (key === 'Home' || key === 'End') return true;
+  if (!key.startsWith('Arrow')) return false;
+  if (event.shiftKey || event.ctrlKey || event.altKey || event.metaKey) return true;
+  var el = target;
+  var start = el.selectionStart,
+    end = el.selectionEnd,
+    value = el.value;
+  // 不支持光标的输入框(如 checkbox)、只读输入框:没有光标可动,方向键用来导航
+  if (start == null || end == null || el.readOnly || el.disabled) return false;
+  var collapsed = start === end;
+  if (key === 'ArrowLeft') return !(collapsed && start === 0);
+  if (key === 'ArrowRight') return !(collapsed && end === value.length);
+  if (el.tagName !== 'TEXTAREA') return false;
+  // 多行文本域:光标不在首行才能往上移,不在末行才能往下移
+  return key === 'ArrowUp' ? value.slice(0, start).includes('\n') : value.slice(end).includes('\n');
+};
+
+/**
+ * keydown 当时的判定。AG-Grid 的 onCellKeyDown 回调是在 setTimeout(0) 里才触发的,那时浏览器已经执行完默认动作、
+ * 光标被挪过了:光标从 1 挪到最左、选区收起到末尾之后再算,会误当成「本来就在边缘」而跳格。
+ * suppressKeyboardEvent 是 keydown 时同步调用的,状态还没变,所以在那里记下,回调里直接用。
+ */
+var nativeKeyDecisions = new WeakMap();
+
+/** AG-Grid 的 suppressKeyboardEvent:让 AG-Grid 不再拦截输入框自己处理的按键,并记下这次按键的判定 */
+export var suppressNativeInputKeys = function suppressNativeInputKeys(_ref) {
+  var event = _ref.event;
+  var native = isNativeInputKey(event);
+  nativeKeyDecisions.set(event, native);
+  return native;
 };

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

@@ -19,7 +19,7 @@ import { connect, mapProps, mapReadPretty } from "@formily/react";
 import uniqueId from "lodash/uniqueId";
 import { useAddition, buildArrayTableColumns, useArrayTableSources, useArrayTableActions, isColumnComponent } from "./utils";
 import { groupColumnDefs } from "./columnGroup";
-import { useCellFocus, useKeyboardNavigation, useRowDrag, suppressSelectAllInInput } from "./hooks";
+import { useCellFocus, useKeyboardNavigation, useRowDrag, suppressNativeInputKeys } from "./hooks";
 import ArrayBase from "./arrayBase";
 import ArrayAddBtn from "./arrayAddBtn";
 import PreviewArrayTable from "./preview";
@@ -27,21 +27,10 @@ import { Space } from "antd";
 import Setting from "../ag-grid-plus/setting";
 import { flatConfigToColumnState, flatConfigToGridState } from "../ag-grid-plus/setting/columnGroupUtils";
 
-// 导入 AG-Grid v33 主题
-import { agGridTheme } from "../ag-grid-plus/theme";
+// AG-Grid v33 主题:行高、单元格居中、去聚焦/选区视觉(编辑态与阅读态共用一份,见 theme.ts)
+import { arrayTableTheme, ARRAY_TABLE_ROW_HEIGHT } from "./theme";
 import { useGridSchemes } from "../ag-grid-plus";
 
-// array-table 派生主题:去掉单元格聚焦/选区视觉(行内编辑更干净)。
-//   focusShadow            -> 聚焦光环
-//   rangeSelectionBorder   -> 单格点击形成的 1×1 选区蓝边
-//   rangeSelectionBackground -> 选区淡蓝填充
-// 仅去视觉,不动焦点功能——键盘导航/点击进编辑仍依赖 cell focus。共用主题不受影响。@author nokecy
-var arrayTableTheme = agGridTheme.withParams({
-  focusShadow: 'none',
-  rangeSelectionBorderColor: 'transparent',
-  rangeSelectionBackgroundColor: 'transparent'
-});
-
 //@ts-ignore
 var ArrayTableInner = observer(function (props) {
   var _addition$props;
@@ -388,8 +377,8 @@ var ArrayTableInner = observer(function (props) {
     enableCellTextSelection: true,
     defaultColDef: {
       resizable: true,
-      // 输入框里的 Ctrl/Cmd+A 交给浏览器全选文字,不让 AG-Grid 当成「选中所有单元格」拦走
-      suppressKeyboardEvent: suppressSelectAllInInput,
+      // 输入框里全选、移动光标、扩选等文字编辑按键交给输入框,不让 AG-Grid 当成表格快捷键拦走
+      suppressKeyboardEvent: suppressNativeInputKeys,
       headerComponentParams: {
         template: '<div class="ag-cell-label-container" role="presentation">' +
         // '  <span data-ref="eMenu" class="ag-header-icon ag-header-cell-menu-button" aria-hidden="true"></span>' +
@@ -426,7 +415,7 @@ var ArrayTableInner = observer(function (props) {
     //   }
     // }}
     ,
-    rowHeight: 38,
+    rowHeight: ARRAY_TABLE_ROW_HEIGHT,
     pagination: false,
     columnDefs: gridColumnDefs,
     rowData: dataSource

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

@@ -2,6 +2,7 @@ import React from "react";
 import { useField } from "@formily/react";
 import { buildArrayTableColumns, useArrayTableSources } from "./utils";
 import { AgGridPlus } from "../ag-grid-plus";
+import { arrayTablePreviewTheme, ARRAY_TABLE_ROW_HEIGHT } from "./theme";
 //@ts-ignore
 var ArrayTable = function ArrayTable(props) {
   var height = props.height;
@@ -24,7 +25,8 @@ var ArrayTable = function ArrayTable(props) {
     },
     hideTool: true,
     search: false,
-    rowHeight: 38,
+    theme: arrayTablePreviewTheme,
+    rowHeight: ARRAY_TABLE_ROW_HEIGHT,
     pagination: false,
     columnDefs: columns,
     rowData: dataSource

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

@@ -0,0 +1,16 @@
+/**
+ * 行高 38:放得下 32px 高的输入框。网格选项 rowHeight 与主题参数 rowHeight 必须同值——
+ * AG-Grid 单元格文字的行高(--ag-internal-content-line-height)是从主题的 --ag-row-height 算的,
+ * 只设网格选项会让文字的行盒仍是主题默认行高(29.6-3=26.6px),顶在 37px 的格子上方(偏上约 4.5px)。
+ */
+export declare const ARRAY_TABLE_ROW_HEIGHT = 38;
+/** 阅读态主题:共用主题 + 行高 + 单元格居中 */
+export declare const arrayTablePreviewTheme: import("ag-grid-community").Theme<import("ag-grid-community").CoreParams & import("ag-grid-community").ButtonStyleParams & import("ag-grid-community").CheckboxStyleParams & import("ag-grid-community").TabStyleParams & import("ag-grid-community").InputStyleParams & {}>;
+/**
+ * 编辑态主题:在阅读态主题上去掉单元格聚焦/选区视觉(行内编辑更干净)。
+ *   focusShadow            -> 聚焦光环
+ *   rangeSelectionBorder   -> 单格点击形成的 1×1 选区蓝边
+ *   rangeSelectionBackground -> 选区淡蓝填充
+ * 仅去视觉,不动焦点功能——键盘导航/点击进编辑仍依赖 cell focus。
+ */
+export declare const arrayTableTheme: import("ag-grid-community").Theme<import("ag-grid-community").CoreParams & import("ag-grid-community").ButtonStyleParams & import("ag-grid-community").CheckboxStyleParams & import("ag-grid-community").TabStyleParams & import("ag-grid-community").InputStyleParams & {}>;

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

@@ -0,0 +1,44 @@
+/**
+ * ArrayTable(明细表格)的 AG-Grid 主题:编辑态(index.tsx)与阅读态(preview.tsx)共用。
+ *
+ * @author nokecy
+ */
+import { createPart } from 'ag-grid-community';
+import { agGridTheme } from "../ag-grid-plus/theme";
+
+/**
+ * 行高 38:放得下 32px 高的输入框。网格选项 rowHeight 与主题参数 rowHeight 必须同值——
+ * AG-Grid 单元格文字的行高(--ag-internal-content-line-height)是从主题的 --ag-row-height 算的,
+ * 只设网格选项会让文字的行盒仍是主题默认行高(29.6-3=26.6px),顶在 37px 的格子上方(偏上约 4.5px)。
+ */
+export var ARRAY_TABLE_ROW_HEIGHT = 38;
+
+/**
+ * 单元格里的表单项与内容区垂直居中(只对使用本主题的网格生效,共用主题不受影响):
+ *  - .ag-cell-wrapper 撑满格子,align-items:center 才起作用(默认只有内容高,贴在格子顶部);
+ *  - FormItem 默认 margin-bottom:24px(loose 反馈布局给错误文字预留的位置),会把 Editable 外壳撑到 56px、
+ *    输入框偏上、还超出 37px 的格子,归零;
+ *  - 错误提示文字移出文档流(位置仍在输入框下方),出错时输入框不会被挤得上下跳。
+ */
+var arrayTableCellFit = createPart({
+  feature: 'arrayTableCellFit',
+  css: "\n    .ag-cell .ag-cell-wrapper { height: 100%; }\n    .ag-cell .ant-formily-item { margin-bottom: 0; }\n    .ag-cell .ant-formily-item-help { position: absolute; }\n  "
+});
+
+/** 阅读态主题:共用主题 + 行高 + 单元格居中 */
+export var arrayTablePreviewTheme = agGridTheme.withParams({
+  rowHeight: ARRAY_TABLE_ROW_HEIGHT
+}).withPart(arrayTableCellFit);
+
+/**
+ * 编辑态主题:在阅读态主题上去掉单元格聚焦/选区视觉(行内编辑更干净)。
+ *   focusShadow            -> 聚焦光环
+ *   rangeSelectionBorder   -> 单格点击形成的 1×1 选区蓝边
+ *   rangeSelectionBackground -> 选区淡蓝填充
+ * 仅去视觉,不动焦点功能——键盘导航/点击进编辑仍依赖 cell focus。
+ */
+export var arrayTableTheme = arrayTablePreviewTheme.withParams({
+  focusShadow: 'none',
+  rangeSelectionBorderColor: 'transparent',
+  rangeSelectionBackgroundColor: 'transparent'
+});