@yuntijs/ui 1.0.0-beta.100 → 1.0.0-beta.102

package/es/Form/collapse-list/hooks.d.ts

@@ -0,0 +1,15 @@
+import { type FormListOperation } from 'antd';
+import React from 'react';
+import type { FormCollapseListColumn } from '.';
+import { ListFieldValue } from './utils';
+export declare const useFormCollapseListHooks: (name: string, childrenColumnName: string, columns: FormCollapseListColumn[]) => {
+    expandedRowKeys: readonly React.Key[];
+    setExpandedRowKeys: React.Dispatch<React.SetStateAction<readonly React.Key[]>>;
+    fieldsToDataSource: (fields: [ListFieldValue]) => {
+        dataSource: ListFieldValue[];
+        allExpandRowKeys: React.Key[];
+    };
+    getFieldPath: (fieldKeyPath: number[], fieldName?: string) => any;
+    getFormListOperation: (operation: FormListOperation, record: ListFieldValue) => FormListOperation;
+    firstColumnFormItemName: any;
+};

package/es/Form/collapse-list/hooks.js

@@ -0,0 +1,135 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+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; }
+import { Form } from 'antd';
+import { cloneDeep } from 'lodash-es';
+import { useCallback, useMemo, useState } from 'react';
+import { FIELD_KEY_PATH, toRowKey } from "./utils";
+export var useFormCollapseListHooks = function useFormCollapseListHooks(name, childrenColumnName, columns) {
+  var _useMemo;
+  var form = Form.useFormInstance();
+  var _useState = useState([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    expandedRowKeys = _useState2[0],
+    setExpandedRowKeys = _useState2[1];
+  var firstColumnFormItemName = (_useMemo = useMemo(function () {
+    return columns.find(function (item) {
+      return !!item.name && !item.noStyle;
+    });
+  }, [columns])) === null || _useMemo === void 0 ? void 0 : _useMemo.name;
+  var fieldsToDataSource = useCallback(function (fields) {
+    var allExpandRowKeys = [];
+    var _setFieldPath = function _setFieldPath(field, index, path) {
+      var item = cloneDeep(field);
+      if (!item) {
+        item = _defineProperty({}, FIELD_KEY_PATH, []);
+      }
+      item[FIELD_KEY_PATH] = [].concat(_toConsumableArray(path), [index]);
+      if (item[childrenColumnName] && Array.isArray(item[childrenColumnName])) {
+        allExpandRowKeys.push(toRowKey(item[FIELD_KEY_PATH]));
+        item[childrenColumnName] = item[childrenColumnName].map(function (child, index) {
+          return _setFieldPath(child, index, item[FIELD_KEY_PATH]);
+        });
+      }
+      return item;
+    };
+    return {
+      dataSource: (fields === null || fields === void 0 ? void 0 : fields.map(function (field, index) {
+        return _setFieldPath(field, index, []);
+      })) || [],
+      allExpandRowKeys: allExpandRowKeys
+    };
+  }, [childrenColumnName]);
+  var getFieldPath = useCallback(function (fieldKeyPath, fieldName) {
+    var fieldPath = [];
+    var _iterator = _createForOfIteratorHelper(fieldKeyPath.entries()),
+      _step;
+    try {
+      for (_iterator.s(); !(_step = _iterator.n()).done;) {
+        var _step$value = _slicedToArray(_step.value, 2),
+          index = _step$value[0],
+          key = _step$value[1];
+        if (index === fieldKeyPath.length - 1) {
+          fieldPath.push(key);
+          if (fieldName) {
+            fieldPath.push(fieldName);
+          }
+        } else {
+          fieldPath.push(key, childrenColumnName);
+        }
+      }
+    } catch (err) {
+      _iterator.e(err);
+    } finally {
+      _iterator.f();
+    }
+    return fieldPath;
+  }, [childrenColumnName]);
+  var getFormListOperation = useCallback(function (operation, record) {
+    var fieldKeyPath = record[FIELD_KEY_PATH];
+    return {
+      add: function add(defaultValue, insertIndex) {
+        var fieldPath = getFieldPath(fieldKeyPath);
+        var fieldName = [name].concat(_toConsumableArray(fieldPath), [childrenColumnName]);
+        var fieldValue = cloneDeep(form.getFieldValue(fieldName)) || [];
+        var index = insertIndex !== null && insertIndex !== void 0 ? insertIndex : fieldValue.length;
+        fieldValue.splice(index, 0, defaultValue);
+        form.setFieldValue(fieldName, fieldValue);
+        if (firstColumnFormItemName) {
+          var fileNamePath = [].concat(_toConsumableArray(fieldName), [index, firstColumnFormItemName]);
+          // Scroll and focus new item which is just added
+          setTimeout(function () {
+            form.focusField(fileNamePath);
+          }, 200);
+        }
+        setExpandedRowKeys(_toConsumableArray(new Set([].concat(_toConsumableArray(expandedRowKeys), [toRowKey(fieldKeyPath)]))));
+      },
+      remove: function remove(index) {
+        if (fieldKeyPath.length <= 1) {
+          return operation.remove(index);
+        }
+        var fieldName = [name].concat(_toConsumableArray(getFieldPath(fieldKeyPath).slice(0, -1)));
+        var fieldValue = cloneDeep(form.getFieldValue(fieldName)) || [];
+        var indexs = [];
+        if (Array.isArray(index)) {
+          indexs.push.apply(indexs, _toConsumableArray(index));
+        } else {
+          indexs.push(index);
+        }
+        var newFieldValue = fieldValue.filter(function (_, _index) {
+          return !indexs.includes(_index);
+        });
+        form.setFieldValue(fieldName, newFieldValue.length > 0 ? newFieldValue : undefined);
+      },
+      move: function move(from, to) {
+        if (fieldKeyPath.length <= 1) {
+          return operation.move(from, to);
+        }
+        var fieldName = [name].concat(_toConsumableArray(getFieldPath(fieldKeyPath).slice(0, -1)));
+        var fieldValue = cloneDeep(form.getFieldValue(fieldName)) || [];
+        // 检查索引是否有效
+        if (from < 0 || to < 0 || from >= fieldValue.length || to >= fieldValue.length) {
+          console.warn(new Error('索引超出数组范围'));
+          return;
+        }
+        // 使用数组解构交换两个元素
+        var _ref = [fieldValue[to], fieldValue[from]];
+        fieldValue[from] = _ref[0];
+        fieldValue[to] = _ref[1];
+        form.setFieldValue(fieldName, fieldValue);
+      }
+    };
+  }, [childrenColumnName, expandedRowKeys, firstColumnFormItemName, form, getFieldPath, name]);
+  return {
+    expandedRowKeys: expandedRowKeys,
+    setExpandedRowKeys: setExpandedRowKeys,
+    fieldsToDataSource: fieldsToDataSource,
+    getFieldPath: getFieldPath,
+    getFormListOperation: getFormListOperation,
+    // 首个表单输入列 (用于新增表达后 foucs 等)
+    firstColumnFormItemName: firstColumnFormItemName
+  };
+};

package/es/Form/collapse-list/index.d.ts

@@ -1,11 +1,14 @@
-import type { FormItemProps, FormListFieldData, TableColumnProps } from 'antd';
+import type { FormItemProps, FormListOperation, TableColumnProps } from 'antd';
 import type { FormListProps as AntFormListProps } from 'antd/es/form';
 import React from 'react';
 import { CollapseGroupProps } from '../../CollapseGroup';
+import { FieldPath } from './utils';
 export interface FormCollapseListColumnItem extends Omit<FormItemProps, 'dependencies' | 'rules' | 'tooltip' | 'labelAlign' | 'labelCol' | 'colon' | 'children'> {
-    render?: (field: FormListFieldData, index: number) => React.ReactElement;
-    rules?: FormItemProps['rules'] | ((field: FormListFieldData, index: number) => FormItemProps['rules']);
-    dependencies?: FormItemProps['dependencies'] | ((field: FormListFieldData, index: number) => FormItemProps['dependencies']);
+    render?: (fieldName: number, index: number, operation: FormListOperation, 
+    /** 当前 item 的 path */
+    fieldPath: FieldPath) => React.ReactElement;
+    rules?: FormItemProps['rules'] | ((parentFieldPath: FieldPath, index: number) => FormItemProps['rules']);
+    dependencies?: FormItemProps['dependencies'] | ((parentFieldPath: FieldPath, index: number) => FormItemProps['dependencies']);
 }
 export interface FormListOperationAddParams {
     defaultValue?: any;
@@ -36,5 +39,13 @@ export interface FormCollapseListProps extends Omit<AntFormListProps, 'name' | '
     onRemove?: (values: any) => boolean | void | Promise<boolean | void>;
     /** 是否启用表单项删除按钮，默认为启用 */
     fieldRemoveButton?: boolean;
+    /** [树形数据] 初始时，是否展开所有行 */
+    defaultExpandAllRows?: boolean;
+    /** [树形数据] 每层缩进的宽度，以 px 为单位, 默认为 16 */
+    indentSize?: number;
+    /** [树形数据] 指定树形结构的列名，默认为 children */
+    childrenColumnName?: string;
+    /** 表格行是否开启 hover 交互, 默认为启用 */
+    rowHoverable?: boolean;
 }
 export declare const FormCollapseList: React.FC<FormCollapseListProps>;

package/es/Form/collapse-list/index.js

@@ -2,9 +2,9 @@ import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["extra", "expandIcon", "icon", "title", "variant", "defaultActive", "empty", "columns", "disabled", "readOnly", "addOneFieldDefault", "disableRemoveWhenOneField", "maxFileds", "name", "addParams", "className", "onRemove", "fieldRemoveButton", "style"],
-  _excluded2 = ["label", "name", "render", "dependencies", "rules", "align", "ellipsis", "fixed", "responsive", "shouldCellUpdate", "width"],
-  _excluded3 = ["key", "name"];
+var _excluded = ["extra", "expandIcon", "icon", "title", "variant", "defaultActive", "empty", "columns", "disabled", "readOnly", "addOneFieldDefault", "disableRemoveWhenOneField", "maxFileds", "name", "addParams", "className", "onRemove", "fieldRemoveButton", "style", "defaultExpandAllRows", "indentSize", "childrenColumnName", "rowHoverable"],
+  _excluded2 = ["label", "name", "render", "dependencies", "rules", "align", "ellipsis", "fixed", "responsive", "shouldCellUpdate", "width", "className"],
+  _excluded3 = ["key"];
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 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; }
@@ -12,9 +12,11 @@ import { PlusOutlined } from '@ant-design/icons';
 import { Icon } from '@lobehub/ui';
 import { Button, Flex, Form, Table, Tooltip } from 'antd';
 import { Trash2 } from 'lucide-react';
-import React, { useCallback, useEffect, useRef } from 'react';
+import React, { useCallback, useEffect, useMemo, useRef } from 'react';
 import { CollapseGroup } from "../../CollapseGroup";
+import { useFormCollapseListHooks } from "./hooks";
 import { useStyles } from "./style";
+import { FIELD_KEY_PATH, toRowKey } from "./utils";
 import { jsx as _jsx } from "react/jsx-runtime";
 export var FormCollapseList = function FormCollapseList(_ref) {
   var extra = _ref.extra,
@@ -39,12 +41,39 @@ export var FormCollapseList = function FormCollapseList(_ref) {
     _ref$fieldRemoveButto = _ref.fieldRemoveButton,
     fieldRemoveButton = _ref$fieldRemoveButto === void 0 ? true : _ref$fieldRemoveButto,
     style = _ref.style,
+    defaultExpandAllRows = _ref.defaultExpandAllRows,
+    _ref$indentSize = _ref.indentSize,
+    indentSize = _ref$indentSize === void 0 ? 16 : _ref$indentSize,
+    _ref$childrenColumnNa = _ref.childrenColumnName,
+    childrenColumnName = _ref$childrenColumnNa === void 0 ? 'children' : _ref$childrenColumnNa,
+    _ref$rowHoverable = _ref.rowHoverable,
+    rowHoverable = _ref$rowHoverable === void 0 ? true : _ref$rowHoverable,
     formListProps = _objectWithoutProperties(_ref, _excluded);
   var _useStyles = useStyles(),
+    cx = _useStyles.cx,
     styles = _useStyles.styles;
   var listAdd = useRef();
   var form = Form.useFormInstance();
   var fieldsWatch = Form.useWatch(name, form);
+  var _useFormCollapseListH = useFormCollapseListHooks(name, childrenColumnName, columns),
+    expandedRowKeys = _useFormCollapseListH.expandedRowKeys,
+    setExpandedRowKeys = _useFormCollapseListH.setExpandedRowKeys,
+    fieldsToDataSource = _useFormCollapseListH.fieldsToDataSource,
+    getFormListOperation = _useFormCollapseListH.getFormListOperation,
+    getFieldPath = _useFormCollapseListH.getFieldPath,
+    firstColumnFormItemName = _useFormCollapseListH.firstColumnFormItemName;
+  var _useMemo = useMemo(function () {
+      return fieldsToDataSource(fieldsWatch);
+    }, [fieldsWatch, fieldsToDataSource]),
+    dataSource = _useMemo.dataSource;
+  useEffect(function () {
+    var fields = form.getFieldValue(name);
+    var _fieldsToDataSource = fieldsToDataSource(fields),
+      allExpandRowKeys = _fieldsToDataSource.allExpandRowKeys;
+    if (defaultExpandAllRows) {
+      setExpandedRowKeys(allExpandRowKeys);
+    }
+  }, [defaultExpandAllRows, fieldsToDataSource, form, name, setExpandedRowKeys]);
   var getAddParams = useCallback(function () {
     if (!addParams) {
       return [];
@@ -61,8 +90,12 @@ export var FormCollapseList = function FormCollapseList(_ref) {
     if (addOneFieldDefault && (!(form !== null && form !== void 0 && form.getFieldValue(name)) || (form === null || form === void 0 || (_form$getFieldValue = form.getFieldValue(name)) === null || _form$getFieldValue === void 0 ? void 0 : _form$getFieldValue.length) === 0)) {
       var _listAdd$current;
       (_listAdd$current = listAdd.current) === null || _listAdd$current === void 0 || _listAdd$current.call.apply(_listAdd$current, [listAdd].concat(_toConsumableArray(getAddParams())));
+      // Scroll and focus new item which is just added
+      setTimeout(function () {
+        form.focusField([name, 0, firstColumnFormItemName]);
+      }, 200);
     }
-  }, [addOneFieldDefault, getAddParams, form, name]);
+  }, [addOneFieldDefault, getAddParams, form, name, firstColumnFormItemName]);
   return /*#__PURE__*/_jsx(CollapseGroup, {
     extra: extra === undefined ? name && !readOnly && /*#__PURE__*/_jsx(Tooltip, {
       title: maxFileds && "\u6700\u591A\u6DFB\u52A0 ".concat(maxFileds, " \u9879"),
@@ -73,6 +106,10 @@ export var FormCollapseList = function FormCollapseList(_ref) {
           var _listAdd$current2;
           e.stopPropagation();
           (_listAdd$current2 = listAdd.current) === null || _listAdd$current2 === void 0 || _listAdd$current2.call.apply(_listAdd$current2, [listAdd].concat(_toConsumableArray(getAddParams())));
+          // Scroll and focus new item which is just added
+          setTimeout(function () {
+            form.focusField([name, form.getFieldValue(name).length - 1, firstColumnFormItemName]);
+          }, 200);
         },
         size: "small",
         type: "text"
@@ -88,27 +125,28 @@ export var FormCollapseList = function FormCollapseList(_ref) {
     children: name ? /*#__PURE__*/_jsx(Form.List, _objectSpread(_objectSpread({
       name: name
     }, formListProps), {}, {
-      children: function children(fields, _ref2) {
-        var add = _ref2.add,
-          remove = _ref2.remove;
+      children: function children(fields, operation) {
+        var add = operation.add,
+          remove = operation.remove;
         listAdd.current = add;
 
         // @Todo: support sort
         return /*#__PURE__*/_jsx(Table, {
           className: styles.list,
-          columns: [].concat(_toConsumableArray(columns.map(function (_ref3) {
-            var label = _ref3.label,
-              itemName = _ref3.name,
-              fieldRender = _ref3.render,
-              dependencies = _ref3.dependencies,
-              rules = _ref3.rules,
-              align = _ref3.align,
-              ellipsis = _ref3.ellipsis,
-              fixed = _ref3.fixed,
-              responsive = _ref3.responsive,
-              shouldCellUpdate = _ref3.shouldCellUpdate,
-              width = _ref3.width,
-              itemProps = _objectWithoutProperties(_ref3, _excluded2);
+          columns: [].concat(_toConsumableArray(columns.map(function (_ref2) {
+            var label = _ref2.label,
+              itemName = _ref2.name,
+              fieldRender = _ref2.render,
+              dependencies = _ref2.dependencies,
+              rules = _ref2.rules,
+              align = _ref2.align,
+              ellipsis = _ref2.ellipsis,
+              fixed = _ref2.fixed,
+              responsive = _ref2.responsive,
+              shouldCellUpdate = _ref2.shouldCellUpdate,
+              width = _ref2.width,
+              className = _ref2.className,
+              itemProps = _objectWithoutProperties(_ref2, _excluded2);
             return {
               title: label,
               dataIndex: itemName,
@@ -118,23 +156,26 @@ export var FormCollapseList = function FormCollapseList(_ref) {
               responsive: responsive,
               shouldCellUpdate: shouldCellUpdate,
               width: width,
-              render: function render(_text, _record, index) {
-                var _fields$index = fields[index],
-                  key = _fields$index.key,
-                  name = _fields$index.name,
-                  restField = _objectWithoutProperties(_fields$index, _excluded3);
-                var children = fieldRender === null || fieldRender === void 0 ? void 0 : fieldRender(fields[index], index);
+              render: function render(_text, record, index) {
+                var field = fields[index] || {};
+                var fieldName = field.name;
+                var fieldKeyPath = record[FIELD_KEY_PATH];
+                var fieldPath = getFieldPath(fieldKeyPath);
+                var parentFieldPath = fieldPath.slice(0, -1);
+                var key = field.key,
+                  restField = _objectWithoutProperties(field, _excluded3);
+                var children = fieldRender === null || fieldRender === void 0 ? void 0 : fieldRender(fieldName !== null && fieldName !== void 0 ? fieldName : fieldKeyPath.at(-1), index, getFormListOperation(operation, record), fieldPath);
                 if (!children && !itemProps.noStyle) {
                   return /*#__PURE__*/_jsx(Flex, {
                     align: "center",
-                    className: styles.noFormItem,
+                    className: cx(styles.noFormItem, className),
                     children: "\u65E0\u9700\u8BBE\u7F6E"
                   });
                 }
                 if (!itemName) {
                   return /*#__PURE__*/_jsx(Flex, {
                     align: "center",
-                    className: styles.noFormItem,
+                    className: cx(styles.noFormItem, className),
                     children: children
                   });
                 }
@@ -147,10 +188,14 @@ export var FormCollapseList = function FormCollapseList(_ref) {
                   chidrenProps.variant = 'borderless';
                   chidrenProps.placeholder = '-';
                 }
-                return /*#__PURE__*/_jsx(Form.Item, _objectSpread(_objectSpread(_objectSpread({}, restField), {}, {
-                  dependencies: typeof dependencies === 'function' ? dependencies(fields[index], index) : dependencies,
-                  name: [name, itemName],
-                  rules: typeof rules === 'function' ? rules(fields[index], index) : rules
+                return /*#__PURE__*/_jsx(Form.Item, _objectSpread(_objectSpread(_objectSpread({
+                  className: className
+                }, restField), {}, {
+                  dependencies: typeof dependencies === 'function' ? dependencies(parentFieldPath, index) : dependencies,
+                  name: getFieldPath(fieldKeyPath, itemName)
+                  // label={getFieldPath(fieldKeyPath, itemName).join('/')}
+                  ,
+                  rules: typeof rules === 'function' ? rules(parentFieldPath, index) : rules
                 }, itemProps), {}, {
                   children: children && /*#__PURE__*/React.cloneElement(children, chidrenProps)
                 }), key);
@@ -160,7 +205,11 @@ export var FormCollapseList = function FormCollapseList(_ref) {
             title: '',
             dataIndex: 'del',
             render: function render(_text, _record, index) {
-              var fieldName = fields[index].name;
+              var field = fields[index];
+              if (!field) {
+                return;
+              }
+              var fieldName = field.name;
               return /*#__PURE__*/_jsx(Form.Item, {
                 children: /*#__PURE__*/_jsx(Button, {
                   disabled: disabled || disableRemoveWhenOneField && fields.length === 1,
@@ -192,12 +241,23 @@ export var FormCollapseList = function FormCollapseList(_ref) {
           }]).filter(function (c) {
             return !!c;
           }),
-          dataSource: fields,
+          dataSource: dataSource,
+          expandable: {
+            expandedRowKeys: expandedRowKeys,
+            childrenColumnName: childrenColumnName,
+            onExpandedRowsChange: function onExpandedRowsChange(expandedKeys) {
+              setExpandedRowKeys(expandedKeys);
+            }
+          },
+          indentSize: indentSize,
           locale: {
             emptyText: empty
           },
           pagination: false,
-          rowHoverable: false,
+          rowHoverable: rowHoverable,
+          rowKey: function rowKey(row) {
+            return toRowKey(row[FIELD_KEY_PATH]);
+          },
           size: "small"
         });
       }

package/es/Form/collapse-list/style.js

@@ -7,7 +7,7 @@ export var useStyles = createStyles(function (_ref) {
     prefixCls = _ref.prefixCls;
   return {
     empty: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      padding: ", "px ", "px;\n      color: ", ";\n    "])), token.paddingXS, token.paddingSM, token.colorTextTertiary),
-    list: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      &.", "-table-wrapper {\n        .", "-table {\n          &-thead {\n            & > tr > th {\n              font-weight: normal;\n              color: ", ";\n              background-color: unset;\n              &::before {\n                display: none;\n              }\n            }\n          }\n          &-tbody {\n            & > tr:last-child {\n              & > td {\n                border-bottom-color: transparent;\n              }\n            }\n          }\n          &-cell {\n            vertical-align: top;\n          }\n        }\n      }\n      .", "-form {\n        &-item {\n          margin-bottom: 0;\n        }\n      }\n    "])), prefixCls, prefixCls, token.colorTextTertiary, prefixCls),
+    list: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      &.", "-table-wrapper {\n        .", "-table {\n          &-thead {\n            & > tr > th {\n              font-weight: normal;\n              color: ", ";\n              background-color: unset;\n              &::before {\n                display: none;\n              }\n            }\n          }\n          &-tbody {\n            & > tr:last-child {\n              & > td {\n                border-bottom-color: transparent;\n              }\n            }\n          }\n          &-cell {\n            vertical-align: top;\n            .", "-table-row-expand-icon {\n              margin-top: ", "px;\n            }\n          }\n        }\n      }\n      .", "-form {\n        &-item {\n          margin-bottom: 0;\n        }\n      }\n    "])), prefixCls, prefixCls, token.colorTextTertiary, prefixCls, token.marginXS, prefixCls),
     noFormItem: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      height: ", "px;\n      color: ", ";\n    "])), token.controlHeight, token.colorTextTertiary)
   };
 });

package/es/Form/collapse-list/utils.d.ts

@@ -0,0 +1,10 @@
+import type { NamePath } from 'antd/es/form/interface';
+export declare const FIELD_KEY_PATH = "__YUNTI_FORM_COLLAPSE_LIST_FIELD_KEY_PATH";
+export type ListFieldValue<K extends string = 'children'> = {
+    [P in K]?: ListFieldValue[];
+} & {
+    [key: string]: any;
+    [FIELD_KEY_PATH]: number[];
+};
+export type FieldPath = NamePath<any>;
+export declare const toRowKey: (keyPath: number[]) => string;

package/es/Form/collapse-list/utils.js

@@ -0,0 +1,4 @@
+export var FIELD_KEY_PATH = '__YUNTI_FORM_COLLAPSE_LIST_FIELD_KEY_PATH';
+export var toRowKey = function toRowKey(keyPath) {
+  return keyPath.join('-');
+};

package/es/JsonViewer/index.d.ts

@@ -2,6 +2,7 @@ import React, { ReactNode } from 'react';
 import type { JsonViewProps } from 'react18-json-view';
 import 'react18-json-view/src/dark.css';
 import 'react18-json-view/src/style.css';
+export { stringify } from 'react18-json-view';
 export interface JsonViewerProps extends JsonViewProps {
     /**
      * @description The type of the json block

package/es/JsonViewer/index.js

@@ -16,6 +16,7 @@ import Typography from "../Typography";
 import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
+export { stringify } from 'react18-json-view';
 var Text = Typography.Text;
 export var JsonViewer = function JsonViewer(_ref) {
   var _ref$type = _ref.type,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yuntijs/ui",
-  "version": "1.0.0-beta.100",
+  "version": "1.0.0-beta.102",
   "description": "☁️ Yunti UI - an open-source UI component library for building Cloud Native web apps",
   "keywords": [
     "yuntijs",
@@ -116,13 +116,13 @@
     "@types/unist": "^3.0.3",
     "@vitest/coverage-v8": "latest",
     "@yuntijs/lint": "^1.7.0",
-    "antd": "^5.23.0",
+    "antd": "^5.23.4",
     "antd-style": "^3.7.1",
     "babel-plugin-antd-style": "latest",
     "commitlint": "^18",
     "dayjs": "^1.11.10",
-    "dumi": "^2.4.9",
-    "dumi-theme-yunti": "^1.7.1",
+    "dumi": "^2.4.17",
+    "dumi-theme-yunti": "^1.7.3",
     "eslint": "^8.56.0",
     "father": "^4.3.8",
     "husky": "^8",