@nokecy/qc-ui-components 2.0.0-beta.3 → 2.0.0-beta.4

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

@@ -128,8 +128,11 @@ var ArrayTableInner = (0, _formilyReact.observer)(function (props) {
   var _useFeedbackRows = (0, _rowFeedback.useFeedbackRows)(field, _formilyAntd.FormLayout.useFormLayout().feedbackLayout),
     feedbackRowsRef = _useFeedbackRows.rowsRef,
     feedbackSignature = _useFeedbackRows.signature;
+  // 修复：用行下标(node.rowIndex)判定出错行，而非 rowData 对象引用。
+  // formily observable 数组 slice 后，getRowHeight 拿到的 rowData 元素与 useFeedbackRows 里取到的表单值元素不是同一引用，
+  // 用对象引用 has() 会恒为 false，导致出错行不撑高、校验浮层溢出遮挡下一行/合计行。@author nokecy
   var getRowHeight = (0, _react.useCallback)(function (params) {
-    return params.data && feedbackRowsRef.current.has(params.data) ? rowHeight + _rowFeedback.ROW_FEEDBACK_EXTRA_HEIGHT : rowHeight;
+    return params.node != null && feedbackRowsRef.current.has(params.node.rowIndex) ? rowHeight + _rowFeedback.ROW_FEEDBACK_EXTRA_HEIGHT : rowHeight;
   }, [rowHeight]);
   var isAutoHeight = height === 'auto';
   var autoGridHeight = isAutoHeight ? (0, _autoHeight.calcAutoGridHeight)({

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

@@ -13,6 +13,13 @@ export declare const ROW_FEEDBACK_EXTRA_HEIGHT = 24;
  * 渲染期读它会让组件订阅字段表,每创建一个字段就重渲一次。请用 useFeedbackRows。@author nokecy
  */
 export declare const collectFeedbackRows: (arrayField: ArrayField, defaultLayout?: string) => Set<object>;
+/**
+ * 与 collectFeedbackRows 同源，但返回「有行内错误文字的行的下标」(Set<number>) 而非行对象引用。
+ * 渲染期之外读反馈会订阅整张字段表(见 collectFeedbackRows)，这里只供 useFeedbackRows 在事件驱动后重算。
+ * 用下标而非对象引用，是为了避开 formily observable 数组 slice 后元素引用不一致导致撑高判空的问题
+ * (getRowHeight 拿到的 rowData 元素与这里取到的不是同一引用)。@author nokecy
+ */
+export declare const collectFeedbackIndexes: (arrayField: ArrayField, defaultLayout?: string) => Set<number>;
 /**
  * 订阅数组下字段的校验反馈,返回「有行内错误文字的行」。
  *
@@ -21,6 +28,6 @@ export declare const collectFeedbackRows: (arrayField: ArrayField, defaultLayout
  * signature(有错误的行下标)变化时调用方让网格重算行高。@author nokecy
  */
 export declare const useFeedbackRows: (arrayField: ArrayField, defaultLayout?: string) => {
-    rowsRef: import("react").RefObject<Set<object>>;
+    rowsRef: import("react").RefObject<Set<number>>;
     signature: string;
 };

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useFeedbackRows = exports.collectFeedbackRows = exports.ROW_FEEDBACK_EXTRA_HEIGHT = void 0;
+exports.useFeedbackRows = exports.collectFeedbackRows = exports.collectFeedbackIndexes = exports.ROW_FEEDBACK_EXTRA_HEIGHT = void 0;
 var _react = require("react");
 var _formilyCore = require("@nokecy/formily-core");
 var _uniqueId = _interopRequireDefault(require("lodash/uniqueId"));
@@ -63,6 +63,42 @@ var collectFeedbackRows = exports.collectFeedbackRows = function collectFeedback
   return rows;
 };
 
+/**
+ * 与 collectFeedbackRows 同源，但返回「有行内错误文字的行的下标」(Set<number>) 而非行对象引用。
+ * 渲染期之外读反馈会订阅整张字段表(见 collectFeedbackRows)，这里只供 useFeedbackRows 在事件驱动后重算。
+ * 用下标而非对象引用，是为了避开 formily observable 数组 slice 后元素引用不一致导致撑高判空的问题
+ * (getRowHeight 拿到的 rowData 元素与这里取到的不是同一引用)。@author nokecy
+ */
+var collectFeedbackIndexes = exports.collectFeedbackIndexes = function collectFeedbackIndexes(arrayField, defaultLayout) {
+  var indexes = new Set();
+  var form = arrayField === null || arrayField === void 0 ? void 0 : arrayField.form;
+  var value = arrayField === null || arrayField === void 0 ? void 0 : arrayField.value;
+  if (!form || !Array.isArray(value)) return indexes;
+  var base = arrayField.address.toString();
+  var baseLength = arrayField.path.length;
+  var _iterator2 = _createForOfIteratorHelper(form.queryFeedbacks({
+      type: 'error',
+      address: "".concat(base, ".*")
+    })),
+    _step2;
+  try {
+    for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+      var _feedback$path$segmen2, _feedback$path4, _feedback$path5, _feedback$path5$toStr, _feedback$path6, _form$query$take$deco2, _form$query$take2;
+      var feedback = _step2.value;
+      var index = Number((_feedback$path$segmen2 = (_feedback$path4 = feedback.path) === null || _feedback$path4 === void 0 || (_feedback$path4 = _feedback$path4.segments) === null || _feedback$path4 === void 0 ? void 0 : _feedback$path4[baseLength]) !== null && _feedback$path$segmen2 !== void 0 ? _feedback$path$segmen2 : (_feedback$path5 = feedback.path) === null || _feedback$path5 === void 0 || (_feedback$path5$toStr = (_feedback$path6 = _feedback$path5).toString) === null || _feedback$path5$toStr === void 0 ? void 0 : _feedback$path5$toStr.call(_feedback$path6).split('.')[baseLength]);
+      if (!Number.isInteger(index)) continue;
+      var layout = (_form$query$take$deco2 = (_form$query$take2 = form.query(feedback.address).take()) === null || _form$query$take2 === void 0 || (_form$query$take2 = _form$query$take2.decoratorProps) === null || _form$query$take2 === void 0 ? void 0 : _form$query$take2.feedbackLayout) !== null && _form$query$take$deco2 !== void 0 ? _form$query$take$deco2 : defaultLayout;
+      if (OUT_OF_FLOW_LAYOUTS.has(layout)) continue;
+      indexes.add(index);
+    }
+  } catch (err) {
+    _iterator2.e(err);
+  } finally {
+    _iterator2.f();
+  }
+  return indexes;
+};
+
 /**
  * 订阅数组下字段的校验反馈,返回「有行内错误文字的行」。
  *
@@ -86,11 +122,13 @@ var useFeedbackRows = exports.useFeedbackRows = function useFeedbackRows(arrayFi
       if (timer !== undefined) clearTimeout(timer);
       timer = setTimeout(function () {
         timer = undefined;
-        var rows = collectFeedbackRows(arrayField, defaultLayout);
-        rowsRef.current = rows;
+        // 用下标集合(而非对象引用)判定出错行：formily observable 数组 slice 后，rowData 元素与表单值元素引用不一致，
+        // 以对象引用做 has 判定会落空，导致出错行不撑高、校验浮层溢出遮挡下一行。@author nokecy
+        var indexes = collectFeedbackIndexes(arrayField, defaultLayout);
+        rowsRef.current = indexes;
         var value = Array.isArray(arrayField.value) ? arrayField.value : [];
-        var next = value.flatMap(function (row, index) {
-          return rows.has(row) ? [index] : [];
+        var next = value.flatMap(function (_, index) {
+          return indexes.has(index) ? [index] : [];
         }).join(',');
         setSignature(function (prev) {
           return prev === next ? prev : next;

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

@@ -127,8 +127,11 @@ var ArrayTableInner = observer(function (props) {
   var _useFeedbackRows = useFeedbackRows(field, FormLayout.useFormLayout().feedbackLayout),
     feedbackRowsRef = _useFeedbackRows.rowsRef,
     feedbackSignature = _useFeedbackRows.signature;
+  // 修复：用行下标(node.rowIndex)判定出错行，而非 rowData 对象引用。
+  // formily observable 数组 slice 后，getRowHeight 拿到的 rowData 元素与 useFeedbackRows 里取到的表单值元素不是同一引用，
+  // 用对象引用 has() 会恒为 false，导致出错行不撑高、校验浮层溢出遮挡下一行/合计行。@author nokecy
   var getRowHeight = useCallback(function (params) {
-    return params.data && feedbackRowsRef.current.has(params.data) ? rowHeight + ROW_FEEDBACK_EXTRA_HEIGHT : rowHeight;
+    return params.node != null && feedbackRowsRef.current.has(params.node.rowIndex) ? rowHeight + ROW_FEEDBACK_EXTRA_HEIGHT : rowHeight;
   }, [rowHeight]);
   var isAutoHeight = height === 'auto';
   var autoGridHeight = isAutoHeight ? calcAutoGridHeight({

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

@@ -13,6 +13,13 @@ export declare const ROW_FEEDBACK_EXTRA_HEIGHT = 24;
  * 渲染期读它会让组件订阅字段表,每创建一个字段就重渲一次。请用 useFeedbackRows。@author nokecy
  */
 export declare const collectFeedbackRows: (arrayField: ArrayField, defaultLayout?: string) => Set<object>;
+/**
+ * 与 collectFeedbackRows 同源，但返回「有行内错误文字的行的下标」(Set<number>) 而非行对象引用。
+ * 渲染期之外读反馈会订阅整张字段表(见 collectFeedbackRows)，这里只供 useFeedbackRows 在事件驱动后重算。
+ * 用下标而非对象引用，是为了避开 formily observable 数组 slice 后元素引用不一致导致撑高判空的问题
+ * (getRowHeight 拿到的 rowData 元素与这里取到的不是同一引用)。@author nokecy
+ */
+export declare const collectFeedbackIndexes: (arrayField: ArrayField, defaultLayout?: string) => Set<number>;
 /**
  * 订阅数组下字段的校验反馈,返回「有行内错误文字的行」。
  *
@@ -21,6 +28,6 @@ export declare const collectFeedbackRows: (arrayField: ArrayField, defaultLayout
  * signature(有错误的行下标)变化时调用方让网格重算行高。@author nokecy
  */
 export declare const useFeedbackRows: (arrayField: ArrayField, defaultLayout?: string) => {
-    rowsRef: import("react").RefObject<Set<object>>;
+    rowsRef: import("react").RefObject<Set<number>>;
     signature: string;
 };

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

@@ -57,6 +57,42 @@ export var collectFeedbackRows = function collectFeedbackRows(arrayField, defaul
   return rows;
 };
 
+/**
+ * 与 collectFeedbackRows 同源，但返回「有行内错误文字的行的下标」(Set<number>) 而非行对象引用。
+ * 渲染期之外读反馈会订阅整张字段表(见 collectFeedbackRows)，这里只供 useFeedbackRows 在事件驱动后重算。
+ * 用下标而非对象引用，是为了避开 formily observable 数组 slice 后元素引用不一致导致撑高判空的问题
+ * (getRowHeight 拿到的 rowData 元素与这里取到的不是同一引用)。@author nokecy
+ */
+export var collectFeedbackIndexes = function collectFeedbackIndexes(arrayField, defaultLayout) {
+  var indexes = new Set();
+  var form = arrayField === null || arrayField === void 0 ? void 0 : arrayField.form;
+  var value = arrayField === null || arrayField === void 0 ? void 0 : arrayField.value;
+  if (!form || !Array.isArray(value)) return indexes;
+  var base = arrayField.address.toString();
+  var baseLength = arrayField.path.length;
+  var _iterator2 = _createForOfIteratorHelper(form.queryFeedbacks({
+      type: 'error',
+      address: "".concat(base, ".*")
+    })),
+    _step2;
+  try {
+    for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+      var _feedback$path$segmen2, _feedback$path4, _feedback$path5, _feedback$path5$toStr, _feedback$path6, _form$query$take$deco2, _form$query$take2;
+      var feedback = _step2.value;
+      var index = Number((_feedback$path$segmen2 = (_feedback$path4 = feedback.path) === null || _feedback$path4 === void 0 || (_feedback$path4 = _feedback$path4.segments) === null || _feedback$path4 === void 0 ? void 0 : _feedback$path4[baseLength]) !== null && _feedback$path$segmen2 !== void 0 ? _feedback$path$segmen2 : (_feedback$path5 = feedback.path) === null || _feedback$path5 === void 0 || (_feedback$path5$toStr = (_feedback$path6 = _feedback$path5).toString) === null || _feedback$path5$toStr === void 0 ? void 0 : _feedback$path5$toStr.call(_feedback$path6).split('.')[baseLength]);
+      if (!Number.isInteger(index)) continue;
+      var layout = (_form$query$take$deco2 = (_form$query$take2 = form.query(feedback.address).take()) === null || _form$query$take2 === void 0 || (_form$query$take2 = _form$query$take2.decoratorProps) === null || _form$query$take2 === void 0 ? void 0 : _form$query$take2.feedbackLayout) !== null && _form$query$take$deco2 !== void 0 ? _form$query$take$deco2 : defaultLayout;
+      if (OUT_OF_FLOW_LAYOUTS.has(layout)) continue;
+      indexes.add(index);
+    }
+  } catch (err) {
+    _iterator2.e(err);
+  } finally {
+    _iterator2.f();
+  }
+  return indexes;
+};
+
 /**
  * 订阅数组下字段的校验反馈,返回「有行内错误文字的行」。
  *
@@ -80,11 +116,13 @@ export var useFeedbackRows = function useFeedbackRows(arrayField, defaultLayout)
       if (timer !== undefined) clearTimeout(timer);
       timer = setTimeout(function () {
         timer = undefined;
-        var rows = collectFeedbackRows(arrayField, defaultLayout);
-        rowsRef.current = rows;
+        // 用下标集合(而非对象引用)判定出错行：formily observable 数组 slice 后，rowData 元素与表单值元素引用不一致，
+        // 以对象引用做 has 判定会落空，导致出错行不撑高、校验浮层溢出遮挡下一行。@author nokecy
+        var indexes = collectFeedbackIndexes(arrayField, defaultLayout);
+        rowsRef.current = indexes;
         var value = Array.isArray(arrayField.value) ? arrayField.value : [];
-        var next = value.flatMap(function (row, index) {
-          return rows.has(row) ? [index] : [];
+        var next = value.flatMap(function (_, index) {
+          return indexes.has(index) ? [index] : [];
         }).join(',');
         setSignature(function (prev) {
           return prev === next ? prev : next;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nokecy/qc-ui-components",
-  "version": "2.0.0-beta.3",
+  "version": "2.0.0-beta.4",
   "description": "QC_UI backend-neutral React components",
   "license": "MIT",
   "private": false,