form-render-v3 3.0.0-alpha.1

package/es/widgets/listSimple/index.js

@@ -0,0 +1,124 @@
+import _PlusOutlined from "@ant-design/icons/es/icons/PlusOutlined";
+import "antd/es/button/style";
+import _Button from "antd/es/button";
+import _CopyOutlined from "@ant-design/icons/es/icons/CopyOutlined";
+import _CloseOutlined from "@ant-design/icons/es/icons/CloseOutlined";
+import "antd/es/popconfirm/style";
+import _Popconfirm from "antd/es/popconfirm";
+import _ArrowDownOutlined from "@ant-design/icons/es/icons/ArrowDownOutlined";
+import _ArrowUpOutlined from "@ant-design/icons/es/icons/ArrowUpOutlined";
+import "antd/es/divider/style";
+import _Divider from "antd/es/divider";
+import "antd/es/space/style";
+import _Space from "antd/es/space";
+function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
+function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+import React from 'react';
+import classnames from 'classnames';
+import FButton from '../components/FButton';
+import "./index.css";
+var getHasBackground = function getHasBackground(fields, hasBackground) {
+  var result = hasBackground;
+  if (fields.length === 0) {
+    result = false;
+  }
+  return result;
+};
+var SimpleList = function SimpleList(props) {
+  var form = props.form,
+    _schema = props.schema,
+    fields = props.fields,
+    rootPath = props.rootPath,
+    renderCore = props.renderCore,
+    hasBackground = props.hasBackground,
+    operateBtnType = props.operateBtnType,
+    addBtnProps = props.addBtnProps,
+    delConfirmProps = props.delConfirmProps,
+    copyBtnProps = props.copyBtnProps,
+    deleteBtnProps = props.deleteBtnProps,
+    moveUpBtnProps = props.moveUpBtnProps,
+    moveDownBtnProps = props.moveDownBtnProps,
+    hideDelete = props.hideDelete,
+    hideCopy = props.hideCopy,
+    hideMove = props.hideMove,
+    hideAdd = props.hideAdd,
+    addItem = props.addItem,
+    copyItem = props.copyItem,
+    moveItem = props.moveItem,
+    removeItem = props.removeItem,
+    temporary = props.temporary;
+  var schema = Object.assign(Object.assign({}, _schema), {
+    items: Object.assign({}, _schema.items)
+  });
+  if (!schema.items.displayType) {
+    schema.items.displayType = 'inline';
+    schema.items.inlineMode = true;
+  }
+  var handleCopy = function handleCopy(name) {
+    var value = form.getFieldValue(rootPath.concat(name));
+    copyItem(value, name);
+  };
+  var isColumm = temporary.displayType === 'column';
+  return /*#__PURE__*/React.createElement("div", {
+    className: classnames('fr-list-simple', {
+      'fr-list-simple-background': getHasBackground(fields, hasBackground),
+      'fr-list-simple-column': isColumm
+    })
+  }, fields.map(function (_ref) {
+    var key = _ref.key,
+      name = _ref.name;
+    var length = fields.length;
+    return /*#__PURE__*/React.createElement("div", {
+      key: key,
+      className: 'fr-list-item'
+    }, renderCore({
+      schema: schema,
+      parentPath: [name],
+      rootPath: [].concat(_toConsumableArray(rootPath), [name])
+    }), /*#__PURE__*/React.createElement(_Space, {
+      className: classnames('fr-list-item-operate'),
+      split: operateBtnType !== 'icon' && /*#__PURE__*/React.createElement(_Divider, {
+        type: 'vertical'
+      })
+    }, !hideMove && (/*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FButton, Object.assign({
+      disabled: name === 0,
+      onClick: function onClick() {
+        return moveItem(name, name - 1);
+      },
+      icon: /*#__PURE__*/React.createElement(_ArrowUpOutlined, null)
+    }, moveUpBtnProps)), /*#__PURE__*/React.createElement(FButton, Object.assign({
+      disabled: name === length - 1,
+      onClick: function onClick() {
+        return moveItem(name, name + 1);
+      },
+      icon: /*#__PURE__*/React.createElement(_ArrowDownOutlined, null),
+      children: "\u4E0B\u79FB"
+    }, moveDownBtnProps)))), !hideDelete && (/*#__PURE__*/React.createElement(_Popconfirm, Object.assign({
+      onConfirm: function onConfirm() {
+        return removeItem(name);
+      }
+    }, delConfirmProps), /*#__PURE__*/React.createElement(FButton, Object.assign({
+      icon: /*#__PURE__*/React.createElement(_CloseOutlined, null),
+      children: "\u5220\u9664",
+      btnType: operateBtnType
+    }, deleteBtnProps)))), !hideCopy && (/*#__PURE__*/React.createElement(FButton, Object.assign({
+      onClick: function onClick() {
+        return handleCopy(name);
+      },
+      icon: /*#__PURE__*/React.createElement(_CopyOutlined, null),
+      children: "\u590D\u5236"
+    }, copyBtnProps)))));
+  }), (!schema.max || fields.length < schema.max) && !hideAdd && (/*#__PURE__*/React.createElement(_Button, Object.assign({
+    className: 'add-btn',
+    icon: /*#__PURE__*/React.createElement(_PlusOutlined, null),
+    onClick: function onClick() {
+      return addItem();
+    },
+    block: fields.length > 0 ? true : false
+  }, addBtnProps))));
+};
+export default SimpleList;

package/es/widgets/listTab/index.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import type { FormListFieldData } from 'antd';
+import './index.less';
+interface ListTabProps {
+    fields: FormListFieldData[];
+    schema: any;
+    delConfirmProps: any;
+    renderCore: any;
+    rootPath: any;
+    [key: string]: any;
+}
+declare const TabList: React.FC<ListTabProps>;
+export default TabList;

package/es/widgets/listTab/index.js

@@ -0,0 +1,113 @@
+import "antd/es/tabs/style";
+import _Tabs from "antd/es/tabs";
+import _CloseOutlined from "@ant-design/icons/es/icons/CloseOutlined";
+import "antd/es/popconfirm/style";
+import _Popconfirm from "antd/es/popconfirm";
+import "antd/es/config-provider/style";
+import _ConfigProvider from "antd/es/config-provider";
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+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(r) { if (Array.isArray(r)) return r; }
+function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
+function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+import { __rest } from "tslib";
+import React, { useState, useContext, useMemo, useEffect } from 'react';
+import { translation } from '../utils';
+import "./index.css";
+;
+var TabPaneContent = function TabPaneContent(props) {
+  var renderCore = props.renderCore,
+    name = props.name,
+    schema = props.schema,
+    rootPath = props.rootPath;
+  return useMemo(function () {
+    return /*#__PURE__*/React.createElement("div", {
+      style: {
+        flex: 1
+      }
+    }, renderCore({
+      schema: schema,
+      parentPath: [name],
+      rootPath: [].concat(_toConsumableArray(rootPath), [name])
+    }));
+  }, [JSON.stringify(props)]);
+};
+var TabList = function TabList(props) {
+  var schema = props.schema,
+    fields = props.fields,
+    rootPath = props.rootPath,
+    renderCore = props.renderCore,
+    readOnly = props.readOnly,
+    delConfirmProps = props.delConfirmProps,
+    tabName = props.tabName,
+    hideDelete = props.hideDelete,
+    hideAdd = props.hideAdd,
+    addItem = props.addItem,
+    removeItem = props.removeItem,
+    _props$tabItemProps = props.tabItemProps,
+    tabItemProps = _props$tabItemProps === void 0 ? {} : _props$tabItemProps,
+    _activeKey = props.activeKey,
+    retProps = __rest(props, ["schema", "fields", "rootPath", "renderCore", "readOnly", "delConfirmProps", "tabName", "hideDelete", "hideAdd", "addItem", "removeItem", "tabItemProps", "activeKey"]);
+  var _useState = useState('0'),
+    _useState2 = _slicedToArray(_useState, 2),
+    activeKey = _useState2[0],
+    setActiveKey = _useState2[1];
+  var configCtx = useContext(_ConfigProvider.ConfigContext);
+  var t = translation(configCtx);
+  useEffect(function () {
+    setActiveKey(_activeKey || '0');
+  }, [_activeKey]);
+  var getTabPaneName = function getTabPaneName(index) {
+    return tabName instanceof Array ? tabName[index] || index + 1 : "".concat(tabName || t('item'), " ").concat(index + 1);
+  };
+  var handleDelete = function handleDelete(targetKey) {
+    removeItem(targetKey);
+    setActiveKey("".concat(targetKey > 1 ? targetKey - 1 : 0));
+  };
+  var handleEdit = function handleEdit(_, action) {
+    if (action === 'add') {
+      if ((!schema.max || fields.length < schema.max) && !readOnly && !hideAdd) {
+        addItem();
+        var currentKey = fields.length;
+        setActiveKey("".concat(currentKey));
+      }
+    }
+  };
+  var renderClose = function renderClose(name) {
+    return !readOnly && !hideDelete ? (/*#__PURE__*/React.createElement(_Popconfirm, Object.assign({
+      onConfirm: function onConfirm() {
+        return handleDelete(name);
+      }
+    }, delConfirmProps), /*#__PURE__*/React.createElement(_CloseOutlined, null))) : /*#__PURE__*/React.createElement(React.Fragment, null);
+  };
+  return /*#__PURE__*/React.createElement(_Tabs, Object.assign({
+    className: 'fr-tab-list',
+    type: 'editable-card'
+  }, retProps, {
+    onChange: setActiveKey,
+    activeKey: "".concat(activeKey),
+    onEdit: handleEdit,
+    hideAdd: readOnly || hideAdd
+  }), fields.map(function (_ref) {
+    var key = _ref.key,
+      name = _ref.name;
+    return /*#__PURE__*/React.createElement(_Tabs.TabPane, Object.assign({
+      key: key,
+      className: 'fr-list-item'
+    }, tabItemProps, {
+      tab: getTabPaneName(name),
+      closeIcon: renderClose(name)
+    }), /*#__PURE__*/React.createElement(TabPaneContent, {
+      name: name,
+      rootPath: rootPath,
+      schema: schema,
+      renderCore: renderCore
+    }));
+  }));
+};
+export default TabList;

package/es/widgets/listTable/index.css

@@ -0,0 +1,28 @@
+.fr-table-list {
+  margin-bottom: 24px;
+}
+.fr-table-list .ant-form-item {
+  margin-bottom: 0;
+}
+.fr-table-list .ant-form-item-label {
+  display: none;
+}
+.fr-table-list .ant-form-item-explain-error {
+  display: none;
+}
+.fr-table-list .fr-list-item-operate {
+  gap: 0 !important;
+}
+.fr-popover-error .ant-popover-inner-content {
+  color: #ff4d4f !important;
+}
+.fr-table-list-no-popover .ant-table-tbody .ant-table-cell {
+  padding: 24px 8px 0px 8px !important;
+}
+.fr-table-list-no-popover .ant-form-item {
+  margin-bottom: 24px;
+}
+.fr-table-list-no-popover .ant-form-item-explain-error {
+  display: block;
+  font-size: 10px;
+}

package/es/widgets/listTable/index.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import type { FormListFieldData } from 'antd';
+import './index.less';
+interface ListTableProps {
+    fields: FormListFieldData[];
+    schema: any;
+    delConfirmProps: any;
+    renderCore: any;
+    rootPath: any;
+    hideEmptyTable?: boolean;
+    [key: string]: any;
+}
+declare const TableList: React.FC<ListTableProps>;
+export default TableList;

package/es/widgets/listTable/index.js

@@ -0,0 +1,227 @@
+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); }
+import _PlusOutlined from "@ant-design/icons/es/icons/PlusOutlined";
+import "antd/es/button/style";
+import _Button from "antd/es/button";
+import "antd/es/table/style";
+import _Table from "antd/es/table";
+import _CopyOutlined from "@ant-design/icons/es/icons/CopyOutlined";
+import _CloseOutlined from "@ant-design/icons/es/icons/CloseOutlined";
+import "antd/es/popconfirm/style";
+import _Popconfirm from "antd/es/popconfirm";
+import _ArrowDownOutlined from "@ant-design/icons/es/icons/ArrowDownOutlined";
+import _ArrowUpOutlined from "@ant-design/icons/es/icons/ArrowUpOutlined";
+import "antd/es/divider/style";
+import _Divider from "antd/es/divider";
+import "antd/es/space/style";
+import _Space from "antd/es/space";
+import "antd/es/form/style";
+import _Form from "antd/es/form";
+import _InfoCircleOutlined from "@ant-design/icons/es/icons/InfoCircleOutlined";
+import "antd/es/tooltip/style";
+import _Tooltip from "antd/es/tooltip";
+function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
+function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : 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); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+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(r) { if (Array.isArray(r)) return r; }
+import { __rest } from "tslib";
+import React from 'react';
+import classnames from 'classnames';
+import TableCell from './tableCell';
+import FButton from '../components/FButton';
+import sortProperties from '../../models/sortProperties';
+import "./index.css";
+;
+var getTooltip = function getTooltip(tooltip) {
+  if (!tooltip) {
+    return;
+  }
+  if (typeof tooltip === 'string') {
+    return {
+      title: /*#__PURE__*/React.createElement("span", {
+        dangerouslySetInnerHTML: {
+          __html: tooltip
+        }
+      })
+    };
+  }
+  return Object.assign(Object.assign({}, tooltip), {
+    title: /*#__PURE__*/React.createElement("span", {
+      dangerouslySetInnerHTML: {
+        __html: tooltip.title
+      }
+    })
+  });
+};
+var TableList = function TableList(props) {
+  var _a, _b;
+  var form = props.form,
+    schema = props.schema,
+    fields = props.fields,
+    rootPath = props.rootPath,
+    renderCore = props.renderCore,
+    readOnly = props.readOnly,
+    operateBtnType = props.operateBtnType,
+    addBtnProps = props.addBtnProps,
+    delConfirmProps = props.delConfirmProps,
+    copyBtnProps = props.copyBtnProps,
+    deleteBtnProps = props.deleteBtnProps,
+    moveUpBtnProps = props.moveUpBtnProps,
+    moveDownBtnProps = props.moveDownBtnProps,
+    actionColumnProps = props.actionColumnProps,
+    pagination = props.pagination,
+    hideDelete = props.hideDelete,
+    hideCopy = props.hideCopy,
+    hideMove = props.hideMove,
+    hideAdd = props.hideAdd,
+    hideOperate = props.hideOperate,
+    hideEmptyTable = props.hideEmptyTable,
+    addItem = props.addItem,
+    copyItem = props.copyItem,
+    moveItem = props.moveItem,
+    removeItem = props.removeItem,
+    configContext = props.configContext,
+    validatePopover = props.validatePopover,
+    retProps = __rest(props, ["form", "schema", "fields", "rootPath", "renderCore", "readOnly", "operateBtnType", "addBtnProps", "delConfirmProps", "copyBtnProps", "deleteBtnProps", "moveUpBtnProps", "moveDownBtnProps", "actionColumnProps", "pagination", "hideDelete", "hideCopy", "hideMove", "hideAdd", "hideOperate", "hideEmptyTable", "addItem", "copyItem", "moveItem", "removeItem", "configContext", "validatePopover"]);
+  var globalConfig = configContext.globalConfig;
+  var islidatePopover = (_a = validatePopover !== null && validatePopover !== void 0 ? validatePopover : globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.listValidatePopover) !== null && _a !== void 0 ? _a : true;
+  var colHeaderText = actionColumnProps.colHeaderText,
+    otherActionColumnProps = __rest(actionColumnProps, ["colHeaderText"]);
+  var itemSchema = ((_b = schema === null || schema === void 0 ? void 0 : schema.items) === null || _b === void 0 ? void 0 : _b.properties) || {};
+  var paginationConfig = Object.assign({
+    size: 'small',
+    hideOnSinglePage: true
+  }, pagination);
+  var handleCopy = function handleCopy(name) {
+    var value = form.getFieldValue(rootPath.concat(name));
+    copyItem(value, name);
+  };
+  var columns = sortProperties(Object.entries(itemSchema)).map(function (_ref) {
+    var _ref2 = _slicedToArray(_ref, 2),
+      dataIndex = _ref2[0],
+      item = _ref2[1];
+    var required = item.required,
+      title = item.title,
+      width = item.width,
+      tooltip = item.tooltip,
+      columnHidden = item.columnHidden;
+    if (columnHidden) {
+      return null;
+    }
+    var tooltipProps = getTooltip(tooltip);
+    return {
+      dataIndex: dataIndex,
+      width: width,
+      title: (/*#__PURE__*/React.createElement(React.Fragment, null, required && /*#__PURE__*/React.createElement("span", {
+        style: {
+          color: 'red',
+          marginRight: '3px'
+        }
+      }, "*"), /*#__PURE__*/React.createElement("span", null, title), tooltipProps && (/*#__PURE__*/React.createElement(_Tooltip, Object.assign({
+        placement: 'top'
+      }, tooltipProps), /*#__PURE__*/React.createElement(_InfoCircleOutlined, {
+        style: {
+          marginLeft: 6
+        }
+      }))))),
+      render: function render(_, field) {
+        var fieldSchema = {
+          type: 'object',
+          properties: _defineProperty({}, dataIndex, Object.assign(Object.assign({}, itemSchema[dataIndex]), {
+            fieldCol: 24
+          }))
+        };
+        if (!islidatePopover) {
+          return /*#__PURE__*/React.createElement("div", {
+            className: 'fr-table-cell-content'
+          }, renderCore({
+            parentPath: [field.name],
+            rootPath: [].concat(_toConsumableArray(rootPath), [field.name]),
+            schema: fieldSchema
+          }));
+        }
+        return /*#__PURE__*/React.createElement(TableCell, {
+          renderCore: renderCore,
+          schema: fieldSchema,
+          parentPath: [field.name],
+          rootPath: [].concat(_toConsumableArray(rootPath), [field.name]),
+          dataIndex: dataIndex
+        });
+      }
+    };
+  }).filter(function (item) {
+    return item;
+  });
+  if (!readOnly && !hideOperate) {
+    columns.push(Object.assign(Object.assign({
+      title: colHeaderText,
+      width: '190px',
+      fixed: 'right'
+    }, otherActionColumnProps), {
+      render: function render(_, field) {
+        return /*#__PURE__*/React.createElement(_Form.Item, null, /*#__PURE__*/React.createElement(_Space, {
+          className: 'fr-list-item-operate',
+          split: operateBtnType !== 'icon' && /*#__PURE__*/React.createElement(_Divider, {
+            type: 'vertical'
+          })
+        }, !hideMove && (/*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FButton, Object.assign({
+          disabled: field.name === 0,
+          onClick: function onClick() {
+            return moveItem(field.name, field.name - 1);
+          },
+          icon: /*#__PURE__*/React.createElement(_ArrowUpOutlined, null)
+        }, moveUpBtnProps)), /*#__PURE__*/React.createElement(FButton, Object.assign({
+          disabled: field.name === fields.length - 1,
+          onClick: function onClick() {
+            return moveItem(field.name, field.name + 1);
+          },
+          icon: /*#__PURE__*/React.createElement(_ArrowDownOutlined, null)
+        }, moveDownBtnProps)))), !hideDelete && (/*#__PURE__*/React.createElement(_Popconfirm, Object.assign({
+          onConfirm: function onConfirm() {
+            return removeItem(field.name);
+          }
+        }, delConfirmProps), /*#__PURE__*/React.createElement(FButton, Object.assign({
+          icon: /*#__PURE__*/React.createElement(_CloseOutlined, null),
+          btnType: operateBtnType
+        }, deleteBtnProps)))), !hideCopy && (/*#__PURE__*/React.createElement(FButton, Object.assign({
+          onClick: function onClick() {
+            return handleCopy(field.name);
+          },
+          icon: /*#__PURE__*/React.createElement(_CopyOutlined, null)
+        }, copyBtnProps)))));
+      }
+    }));
+  }
+  var showTable = fields.length > 0 ? true : !hideEmptyTable;
+  return /*#__PURE__*/React.createElement("div", {
+    className: classnames('fr-table-list', {
+      'fr-table-list-no-popover': !islidatePopover
+    })
+  }, showTable && (/*#__PURE__*/React.createElement(_Table, Object.assign({
+    size: 'middle',
+    scroll: {
+      x: 'max-content'
+    },
+    style: {
+      marginBottom: '12px'
+    }
+  }, retProps, {
+    columns: columns,
+    dataSource: fields,
+    pagination: paginationConfig
+  }))), (!schema.max || fields.length < schema.max) && !hideAdd && (/*#__PURE__*/React.createElement(_Button, Object.assign({
+    icon: /*#__PURE__*/React.createElement(_PlusOutlined, null),
+    onClick: function onClick() {
+      return addItem();
+    }
+  }, addBtnProps))));
+};
+export default TableList;

package/es/widgets/listTable/tableCell.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const TableCell: (props: any) => React.JSX.Element;
+export default TableCell;

package/es/widgets/listTable/tableCell.js

@@ -0,0 +1,62 @@
+import "antd/es/popover/style";
+import _Popover from "antd/es/popover";
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+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(r) { if (Array.isArray(r)) return r; }
+import { __rest } from "tslib";
+import React, { useState, useRef } from 'react';
+var TableCell = function TableCell(props) {
+  var renderCore = props.renderCore,
+    schema = props.schema,
+    dataIndex = props.dataIndex,
+    otherProps = __rest(props, ["renderCore", "schema", "dataIndex"]);
+  var _useState = useState(null),
+    _useState2 = _slicedToArray(_useState, 2),
+    errorMsg = _useState2[0],
+    setErrorMsg = _useState2[1];
+  var _useState3 = useState(),
+    _useState4 = _slicedToArray(_useState3, 2),
+    visible = _useState4[0],
+    setVisible = _useState4[1];
+  var mouseRef = useRef(null);
+  var onStatusChange = function onStatusChange(_, errors) {
+    var message = errors[0] || null;
+    setErrorMsg(message);
+    if (mouseRef.current && message) {
+      setVisible(true);
+    }
+  };
+  if (!schema.properties[dataIndex].onStatusChange) {
+    schema.properties[dataIndex].onStatusChange = onStatusChange;
+  }
+  var popoverVisible = visible && errorMsg;
+  var popoverProps = {
+    open: popoverVisible
+  };
+  if (window.antdVersion === 'v4') {
+    popoverProps = {
+      visible: popoverVisible
+    };
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    className: 'fr-table-cell-content',
+    onMouseEnter: function onMouseEnter() {
+      mouseRef.current = true;
+      setVisible(true);
+    },
+    onMouseLeave: function onMouseLeave() {
+      mouseRef.current = false;
+      setVisible(false);
+    }
+  }, /*#__PURE__*/React.createElement(_Popover, Object.assign({
+    overlayClassName: 'fr-popover-error',
+    content: errorMsg,
+    placement: 'topRight'
+  }, popoverProps), renderCore(Object.assign(Object.assign({}, otherProps), {
+    schema: schema
+  }))));
+};
+export default TableCell;

package/es/widgets/listVirtual/index.css

@@ -0,0 +1,28 @@
+.fr-virtual-list {
+  margin-bottom: 12px;
+}
+.fr-virtual-list .ant-form-item {
+  margin-bottom: 0;
+}
+.fr-virtual-list .ant-form-item-label {
+  display: none;
+}
+.fr-virtual-list .ant-form-item-explain-error {
+  display: none;
+}
+.fr-virtual-list .fr-list-item-operate {
+  gap: 0 !important;
+}
+.fr-popover-error .ant-popover-inner-content {
+  color: #ff4d4f !important;
+}
+.fr-virtual-list-no-popover .ant-table-tbody .ant-table-cell {
+  padding: 24px 8px 0px 8px !important;
+}
+.fr-virtual-list-no-popover .ant-form-item {
+  margin-bottom: 24px;
+}
+.fr-virtual-list-no-popover .ant-form-item-explain-error {
+  display: block;
+  font-size: 10px;
+}

package/es/widgets/listVirtual/index.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import type { FormListFieldData } from 'antd';
+import './index.less';
+interface ListVirtualProps {
+    fields: FormListFieldData[];
+    schema: any;
+    delConfirmProps: any;
+    renderCore: any;
+    rootPath: any;
+    hideEmptyTable?: boolean;
+    [key: string]: any;
+}
+declare const VirtualList: React.FC<ListVirtualProps>;
+export default VirtualList;