@nocobase/client 0.9.3-alpha.1 → 0.9.4-alpha.2

package/es/schema-component/antd/grid-card/GridCard.js

@@ -0,0 +1,103 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+var _templateObject;
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _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(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(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+import React, { useCallback, useState } from 'react';
+import { RecursionField, Schema, useField, useFieldSchema } from '@formily/react';
+import { css, cx } from '@emotion/css';
+import { List as AntdList, Col } from 'antd';
+import { useGridCardActionBarProps } from './hooks';
+import { SortableItem } from '../../common';
+import { SchemaComponentOptions } from '../../core';
+import { useDesigner } from '../../hooks';
+import { GridCardItem } from './GridCard.Item';
+import { useGridCardBlockContext, useGridCardItemProps, GridCardBlockProvider } from './GridCard.Decorator';
+import { GridCardDesigner } from './GridCard.Designer';
+import { defaultColumnCount, pageSizeOptions } from './options';
+var rowGutter = {
+  md: 16,
+  sm: 8,
+  xs: 8
+};
+var designerCss = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  width: 100%;\n  &:hover {\n    > .general-schema-designer {\n      display: block;\n    }\n  }\n\n  > .general-schema-designer {\n    position: absolute;\n    z-index: 999;\n    top: 0;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    display: none;\n    background: rgba(241, 139, 98, 0.06);\n    border: 0;\n    pointer-events: none;\n    > .general-schema-designer-icons {\n      position: absolute;\n      right: 2px;\n      top: 2px;\n      line-height: 16px;\n      pointer-events: all;\n      .ant-space-item {\n        background-color: #f18b62;\n        color: #fff;\n        line-height: 16px;\n        width: 16px;\n        padding-left: 1px;\n      }\n    }\n  }\n"])));
+var InternalGridCard = function InternalGridCard(props) {
+  var _service$data;
+  var _useGridCardBlockCont = useGridCardBlockContext(),
+    service = _useGridCardBlockCont.service,
+    _useGridCardBlockCont2 = _useGridCardBlockCont.columnCount,
+    columnCount = _useGridCardBlockCont2 === void 0 ? defaultColumnCount : _useGridCardBlockCont2;
+  var run = service.run,
+    params = service.params;
+  var meta = service === null || service === void 0 ? void 0 : (_service$data = service.data) === null || _service$data === void 0 ? void 0 : _service$data.meta;
+  var fieldSchema = useFieldSchema();
+  var field = useField();
+  var Designer = useDesigner();
+  var _useState = useState(new Map()),
+    _useState2 = _slicedToArray(_useState, 1),
+    schemaMap = _useState2[0];
+  var getSchema = useCallback(function (key) {
+    if (!schemaMap.has(key)) {
+      schemaMap.set(key, new Schema({
+        type: 'object',
+        properties: _defineProperty({}, key, fieldSchema.properties['item'])
+      }));
+    }
+    return schemaMap.get(key);
+  }, [fieldSchema.properties, schemaMap]);
+  var onPaginationChange = useCallback(function (page, pageSize) {
+    run(_objectSpread(_objectSpread({}, params === null || params === void 0 ? void 0 : params[0]), {}, {
+      page: page,
+      pageSize: pageSize
+    }));
+  }, [run, params]);
+  return /*#__PURE__*/React.createElement(SchemaComponentOptions, {
+    scope: {
+      useGridCardItemProps: useGridCardItemProps,
+      useGridCardActionBarProps: useGridCardActionBarProps
+    }
+  }, /*#__PURE__*/React.createElement(SortableItem, {
+    className: cx('nb-card-list', designerCss)
+  }, /*#__PURE__*/React.createElement(AntdList, {
+    pagination: !meta || meta.count <= meta.pageSize ? false : {
+      onChange: onPaginationChange,
+      total: (meta === null || meta === void 0 ? void 0 : meta.count) || 0,
+      pageSize: (meta === null || meta === void 0 ? void 0 : meta.pageSize) || 10,
+      current: (meta === null || meta === void 0 ? void 0 : meta.page) || 1,
+      pageSizeOptions: pageSizeOptions
+    },
+    dataSource: field.value,
+    grid: _objectSpread(_objectSpread({}, columnCount), {}, {
+      sm: columnCount.xs,
+      xl: columnCount.lg,
+      gutter: [rowGutter, rowGutter]
+    }),
+    renderItem: function renderItem(item, index) {
+      return /*#__PURE__*/React.createElement(Col, {
+        style: {
+          height: '100%'
+        }
+      }, /*#__PURE__*/React.createElement(RecursionField, {
+        key: index,
+        basePath: field.address,
+        name: index,
+        onlyRenderProperties: true,
+        schema: getSchema(index)
+      }));
+    },
+    loading: service === null || service === void 0 ? void 0 : service.loading
+  }), /*#__PURE__*/React.createElement(Designer, null)));
+};
+export var GridCard = InternalGridCard;
+GridCard.Item = GridCardItem;
+GridCard.Designer = GridCardDesigner;
+GridCard.Decorator = GridCardBlockProvider;

package/es/schema-component/antd/grid-card/hooks.d.ts

@@ -0,0 +1,4 @@
+import { SpaceProps } from 'antd';
+export declare const useGridCardActionBarProps: () => {
+    spaceProps: SpaceProps;
+};

package/es/schema-component/antd/grid-card/hooks.js

@@ -0,0 +1,9 @@
+var spaceProps = {
+  size: ['large', 'small'],
+  wrap: true
+};
+export var useGridCardActionBarProps = function useGridCardActionBarProps() {
+  return {
+    spaceProps: spaceProps
+  };
+};

package/es/schema-component/antd/grid-card/index.d.ts

@@ -0,0 +1 @@
+export * from './GridCard';

package/es/schema-component/antd/grid-card/index.js

@@ -0,0 +1 @@
+export * from './GridCard';

package/es/schema-component/antd/grid-card/options.d.ts

@@ -0,0 +1,20 @@
+export declare const pageSizeOptions: number[];
+export declare const gridSizes: string[];
+export declare const screenSizeTitleMaps: {
+    xs: string;
+    md: string;
+    lg: string;
+    xxl: string;
+};
+export declare const screenSizeMaps: {
+    xs: string;
+    md: string;
+    lg: string;
+    xxl: string;
+};
+export declare const defaultColumnCount: {
+    xs: number;
+    md: number;
+    lg: number;
+    xxl: number;
+};

package/es/schema-component/antd/grid-card/options.js

@@ -0,0 +1,20 @@
+export var pageSizeOptions = [12, 24, 60, 96, 120];
+export var gridSizes = ['xs', 'md', 'lg', 'xxl'];
+export var screenSizeTitleMaps = {
+  xs: 'Phone device',
+  md: 'Tablet device',
+  lg: 'Desktop device',
+  xxl: 'Large screen device'
+};
+export var screenSizeMaps = {
+  xs: '< 768',
+  md: '≥ 768',
+  lg: '≥ 992',
+  xxl: '≥ 1600'
+};
+export var defaultColumnCount = {
+  xs: 1,
+  md: 2,
+  lg: 3,
+  xxl: 4
+};

package/es/schema-component/antd/icon-picker/IconPicker.js

@@ -37,8 +37,8 @@ function IconField(props) {
     compact: true
   }, /*#__PURE__*/React.createElement(Popover, {
     placement: 'bottom',
-    visible: visible,
-    onVisibleChange: function onVisibleChange(val) {
+    open: visible,
+    onOpenChange: function onOpenChange(val) {
       if (disabled) {
         return;
       }

package/es/schema-component/antd/index.d.ts

@@ -19,10 +19,12 @@ export * from './form-v2';
 export * from './g2plot';
 export * from './gantt';
 export * from './grid';
+export * from './grid-card';
 export * from './icon-picker';
 export * from './input';
 export * from './input-number';
 export * from './kanban';
+export * from './list';
 export * from './markdown';
 export * from './menu';
 export * from './page';

package/es/schema-component/antd/index.js

@@ -19,10 +19,12 @@ export * from './form-v2';
 export * from './g2plot';
 export * from './gantt';
 export * from './grid';
+export * from './grid-card';
 export * from './icon-picker';
 export * from './input';
 export * from './input-number';
 export * from './kanban';
+export * from './list';
 export * from './markdown';
 export * from './menu';
 export * from './page';

package/es/schema-component/antd/input/EllipsisWithTooltip.js

@@ -53,8 +53,8 @@ export var EllipsisWithTooltip = /*#__PURE__*/forwardRef(function (props, ref) {
     return contentWidth > offsetWidth;
   };
   return /*#__PURE__*/React.createElement(Popover, {
-    visible: ellipsis && visible,
-    onVisibleChange: function onVisibleChange(visible) {
+    open: ellipsis && visible,
+    onOpenChange: function onOpenChange(visible) {
       setVisible(ellipsis && visible);
     },
     content: /*#__PURE__*/React.createElement("div", {

package/es/schema-component/antd/list/List.Decorator.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export declare const ListBlockContext: React.Context<any>;
+export declare const ListBlockProvider: (props: any) => JSX.Element;
+export declare const useListBlockContext: () => any;
+export declare const useListItemProps: () => {};

package/es/schema-component/antd/list/List.Decorator.js

@@ -0,0 +1,59 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+import { createForm } from '@formily/core';
+import { FormContext, useField } from '@formily/react';
+import React, { createContext, useContext, useEffect, useMemo } from 'react';
+import { FormLayout } from '@formily/antd';
+import { useAssociationNames } from '../../../block-provider/hooks';
+import { BlockProvider, useBlockRequestContext } from '../../../block-provider';
+export var ListBlockContext = /*#__PURE__*/createContext({});
+var InternalListBlockProvider = function InternalListBlockProvider(props) {
+  var _service$data2;
+  var _useBlockRequestConte = useBlockRequestContext(),
+    resource = _useBlockRequestConte.resource,
+    service = _useBlockRequestConte.service;
+  var field = useField();
+  var form = useMemo(function () {
+    return createForm({
+      readPretty: true
+    });
+  }, []);
+  useEffect(function () {
+    if (!(service === null || service === void 0 ? void 0 : service.loading)) {
+      var _service$data;
+      form.setValuesIn(field.address.concat('list').toString(), service === null || service === void 0 ? void 0 : (_service$data = service.data) === null || _service$data === void 0 ? void 0 : _service$data.data);
+    }
+  }, [service === null || service === void 0 ? void 0 : (_service$data2 = service.data) === null || _service$data2 === void 0 ? void 0 : _service$data2.data, service === null || service === void 0 ? void 0 : service.loading]);
+  return /*#__PURE__*/React.createElement(ListBlockContext.Provider, {
+    value: {
+      service: service,
+      resource: resource
+    }
+  }, /*#__PURE__*/React.createElement(FormContext.Provider, {
+    value: form
+  }, /*#__PURE__*/React.createElement(FormLayout, {
+    layout: 'vertical'
+  }, props.children)));
+};
+export var ListBlockProvider = function ListBlockProvider(props) {
+  var params = _objectSpread({}, props.params);
+  var collection = props.collection;
+  var _useAssociationNames = useAssociationNames(collection),
+    appends = _useAssociationNames.appends;
+  if (!Object.keys(params).includes('appends')) {
+    params['appends'] = appends;
+  }
+  return /*#__PURE__*/React.createElement(BlockProvider, _objectSpread(_objectSpread({}, props), {}, {
+    params: params
+  }), /*#__PURE__*/React.createElement(InternalListBlockProvider, _objectSpread({}, props)));
+};
+export var useListBlockContext = function useListBlockContext() {
+  return useContext(ListBlockContext);
+};
+export var useListItemProps = function useListItemProps() {
+  return {};
+};

package/es/schema-component/antd/list/List.Designer.d.ts

@@ -0,0 +1 @@
+export declare const ListDesigner: () => JSX.Element;

package/es/schema-component/antd/list/List.Designer.js

@@ -0,0 +1,205 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+import { useFieldSchema, useField } from '@formily/react';
+import React from 'react';
+import { ArrayItems } from '@formily/antd';
+import { useListBlockContext } from './List.Decorator';
+import _ from 'lodash';
+import { useTranslation } from 'react-i18next';
+import { useCollection, useCollectionFilterOptions, useSortFields } from '../../../collection-manager';
+import { GeneralSchemaDesigner, SchemaSettings } from '../../../schema-settings';
+import { useSchemaTemplate } from '../../../schema-templates';
+import { useDesignable } from '../../hooks';
+import { removeNullCondition } from '../filter';
+import { FilterDynamicComponent } from '../table-v2/FilterDynamicComponent';
+export var ListDesigner = function ListDesigner() {
+  var _fieldSchema$xDecora, _fieldSchema$xDecora$, _fieldSchema$xDecora2, _fieldSchema$xDecora3, _fieldSchema$xDecora4, _field$decoratorProps, _field$decoratorProps2;
+  var _useCollection = useCollection(),
+    name = _useCollection.name,
+    title = _useCollection.title;
+  var template = useSchemaTemplate();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var fieldSchema = useFieldSchema();
+  var field = useField();
+  var dataSource = useCollectionFilterOptions(name);
+  var _useListBlockContext = useListBlockContext(),
+    service = _useListBlockContext.service;
+  var _useDesignable = useDesignable(),
+    dn = _useDesignable.dn;
+  var sortFields = useSortFields(name);
+  var defaultFilter = (fieldSchema === null || fieldSchema === void 0 ? void 0 : (_fieldSchema$xDecora = fieldSchema['x-decorator-props']) === null || _fieldSchema$xDecora === void 0 ? void 0 : (_fieldSchema$xDecora$ = _fieldSchema$xDecora.params) === null || _fieldSchema$xDecora$ === void 0 ? void 0 : _fieldSchema$xDecora$.filter) || {};
+  var defaultSort = (fieldSchema === null || fieldSchema === void 0 ? void 0 : (_fieldSchema$xDecora2 = fieldSchema['x-decorator-props']) === null || _fieldSchema$xDecora2 === void 0 ? void 0 : (_fieldSchema$xDecora3 = _fieldSchema$xDecora2.params) === null || _fieldSchema$xDecora3 === void 0 ? void 0 : _fieldSchema$xDecora3.sort) || [];
+  var defaultResource = fieldSchema === null || fieldSchema === void 0 ? void 0 : (_fieldSchema$xDecora4 = fieldSchema['x-decorator-props']) === null || _fieldSchema$xDecora4 === void 0 ? void 0 : _fieldSchema$xDecora4.resource;
+  var sort = defaultSort === null || defaultSort === void 0 ? void 0 : defaultSort.map(function (item) {
+    return item.startsWith('-') ? {
+      field: item.substring(1),
+      direction: 'desc'
+    } : {
+      field: item,
+      direction: 'asc'
+    };
+  });
+  return /*#__PURE__*/React.createElement(GeneralSchemaDesigner, {
+    template: template,
+    title: title || name
+  }, /*#__PURE__*/React.createElement(SchemaSettings.BlockTitleItem, null), /*#__PURE__*/React.createElement(SchemaSettings.ModalItem, {
+    title: t('Set the data scope'),
+    schema: {
+      type: 'object',
+      title: t('Set the data scope'),
+      properties: {
+        filter: {
+          default: defaultFilter,
+          // title: '数据范围',
+          enum: dataSource,
+          'x-component': 'Filter',
+          'x-component-props': {
+            dynamicComponent: function dynamicComponent(props) {
+              return FilterDynamicComponent(_objectSpread({}, props));
+            }
+          }
+        }
+      }
+    },
+    onSubmit: function onSubmit(_ref) {
+      var _schema;
+      var filter = _ref.filter;
+      filter = removeNullCondition(filter);
+      _.set(fieldSchema, 'x-decorator-props.params.filter', filter);
+      field.decoratorProps.params = _objectSpread(_objectSpread({}, fieldSchema['x-decorator-props'].params), {}, {
+        page: 1
+      });
+      dn.emit('patch', {
+        schema: (_schema = {}, _defineProperty(_schema, 'x-uid', fieldSchema['x-uid']), _defineProperty(_schema, 'x-decorator-props', fieldSchema['x-decorator-props']), _schema)
+      });
+    }
+  }), /*#__PURE__*/React.createElement(SchemaSettings.ModalItem, {
+    title: t('Set default sorting rules'),
+    components: {
+      ArrayItems: ArrayItems
+    },
+    schema: {
+      type: 'object',
+      title: t('Set default sorting rules'),
+      properties: {
+        sort: {
+          type: 'array',
+          default: sort,
+          'x-component': 'ArrayItems',
+          'x-decorator': 'FormItem',
+          items: {
+            type: 'object',
+            properties: {
+              space: {
+                type: 'void',
+                'x-component': 'Space',
+                properties: {
+                  sort: {
+                    type: 'void',
+                    'x-decorator': 'FormItem',
+                    'x-component': 'ArrayItems.SortHandle'
+                  },
+                  field: {
+                    type: 'string',
+                    enum: sortFields,
+                    'x-decorator': 'FormItem',
+                    'x-component': 'Select',
+                    'x-component-props': {
+                      style: {
+                        width: 260
+                      }
+                    }
+                  },
+                  direction: {
+                    type: 'string',
+                    'x-decorator': 'FormItem',
+                    'x-component': 'Radio.Group',
+                    'x-component-props': {
+                      optionType: 'button'
+                    },
+                    enum: [{
+                      label: t('ASC'),
+                      value: 'asc'
+                    }, {
+                      label: t('DESC'),
+                      value: 'desc'
+                    }]
+                  },
+                  remove: {
+                    type: 'void',
+                    'x-decorator': 'FormItem',
+                    'x-component': 'ArrayItems.Remove'
+                  }
+                }
+              }
+            }
+          },
+          properties: {
+            add: {
+              type: 'void',
+              title: t('Add sort field'),
+              'x-component': 'ArrayItems.Addition'
+            }
+          }
+        }
+      }
+    },
+    onSubmit: function onSubmit(_ref2) {
+      var _schema2;
+      var sort = _ref2.sort;
+      var sortArr = sort.map(function (item) {
+        return item.direction === 'desc' ? "-".concat(item.field) : item.field;
+      });
+      _.set(fieldSchema, 'x-decorator-props.params.sort', sortArr);
+      field.decoratorProps.params = _objectSpread(_objectSpread({}, fieldSchema['x-decorator-props'].params), {}, {
+        page: 1
+      });
+      dn.emit('patch', {
+        schema: (_schema2 = {}, _defineProperty(_schema2, 'x-uid', fieldSchema['x-uid']), _defineProperty(_schema2, 'x-decorator-props', fieldSchema['x-decorator-props']), _schema2)
+      });
+    }
+  }), /*#__PURE__*/React.createElement(SchemaSettings.SelectItem, {
+    title: t('Records per page'),
+    value: ((_field$decoratorProps = field.decoratorProps) === null || _field$decoratorProps === void 0 ? void 0 : (_field$decoratorProps2 = _field$decoratorProps.params) === null || _field$decoratorProps2 === void 0 ? void 0 : _field$decoratorProps2.pageSize) || 20,
+    options: [{
+      label: '10',
+      value: 10
+    }, {
+      label: '20',
+      value: 20
+    }, {
+      label: '50',
+      value: 50
+    }, {
+      label: '80',
+      value: 80
+    }, {
+      label: '100',
+      value: 100
+    }],
+    onChange: function onChange(pageSize) {
+      var _schema3;
+      _.set(fieldSchema, 'x-decorator-props.params.pageSize', pageSize);
+      field.decoratorProps.params = _objectSpread(_objectSpread({}, fieldSchema['x-decorator-props'].params), {}, {
+        page: 1
+      });
+      dn.emit('patch', {
+        schema: (_schema3 = {}, _defineProperty(_schema3, 'x-uid', fieldSchema['x-uid']), _defineProperty(_schema3, 'x-decorator-props', fieldSchema['x-decorator-props']), _schema3)
+      });
+    }
+  }), /*#__PURE__*/React.createElement(SchemaSettings.Template, {
+    componentName: 'List',
+    collectionName: name,
+    resourceName: defaultResource
+  }), /*#__PURE__*/React.createElement(SchemaSettings.Divider, null), /*#__PURE__*/React.createElement(SchemaSettings.Remove, {
+    removeParentsIfNoChildren: true,
+    breakRemoveOn: {
+      'x-component': 'Grid'
+    }
+  }));
+};

package/es/schema-component/antd/list/List.Item.d.ts

@@ -0,0 +1 @@
+export declare const ListItem: (props: any) => JSX.Element;

package/es/schema-component/antd/list/List.Item.js

@@ -0,0 +1,15 @@
+var _templateObject;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+import React from 'react';
+import { css } from '@emotion/css';
+import { useField } from '@formily/react';
+import { RecordSimpleProvider } from '../../../record-provider';
+var itemCss = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  flex-direction: column;\n  gap: 8px;\n  padding: 12px 0;\n  border-bottom: 1px solid #f0f0f0;\n"])));
+export var ListItem = function ListItem(props) {
+  var field = useField();
+  return /*#__PURE__*/React.createElement("div", {
+    className: itemCss
+  }, /*#__PURE__*/React.createElement(RecordSimpleProvider, {
+    value: field.value
+  }, props.children));
+};

package/es/schema-component/antd/list/List.d.ts

@@ -0,0 +1,8 @@
+import { ListDesigner } from './List.Designer';
+import { ListBlockProvider } from './List.Decorator';
+import { ListItem } from './List.Item';
+export declare const List: ((props: any) => JSX.Element) & {
+    Item: typeof ListItem;
+    Designer: typeof ListDesigner;
+    Decorator: typeof ListBlockProvider;
+};

package/es/schema-component/antd/list/List.js

@@ -0,0 +1,83 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+var _templateObject;
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _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(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(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+import { ListDesigner } from './List.Designer';
+import { ListBlockProvider, useListBlockContext, useListItemProps } from './List.Decorator';
+import React, { useCallback, useState } from 'react';
+import { RecursionField, Schema, useField, useFieldSchema } from '@formily/react';
+import { css, cx } from '@emotion/css';
+import { List as AntdList } from 'antd';
+import { useListActionBarProps } from './hooks';
+import { SortableItem } from '../../common';
+import { SchemaComponentOptions } from '../../core';
+import { useDesigner } from '../../hooks';
+import { ListItem } from './List.Item';
+var designerCss = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  width: 100%;\n  margin-bottom: var(--nb-spacing);\n  &:hover {\n    > .general-schema-designer {\n      display: block;\n    }\n  }\n\n  > .general-schema-designer {\n    position: absolute;\n    z-index: 999;\n    top: 0;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    display: none;\n    background: rgba(241, 139, 98, 0.06);\n    border: 0;\n    pointer-events: none;\n    > .general-schema-designer-icons {\n      position: absolute;\n      right: 2px;\n      top: 2px;\n      line-height: 16px;\n      pointer-events: all;\n      .ant-space-item {\n        background-color: #f18b62;\n        color: #fff;\n        line-height: 16px;\n        width: 16px;\n        padding-left: 1px;\n      }\n    }\n  }\n"])));
+var InternalList = function InternalList(props) {
+  var _service$data, _field$value;
+  var _useListBlockContext = useListBlockContext(),
+    service = _useListBlockContext.service;
+  var run = service.run,
+    params = service.params;
+  var fieldSchema = useFieldSchema();
+  var Designer = useDesigner();
+  var meta = service === null || service === void 0 ? void 0 : (_service$data = service.data) === null || _service$data === void 0 ? void 0 : _service$data.meta;
+  var field = useField();
+  var _useState = useState(new Map()),
+    _useState2 = _slicedToArray(_useState, 1),
+    schemaMap = _useState2[0];
+  var getSchema = useCallback(function (key) {
+    if (!schemaMap.has(key)) {
+      schemaMap.set(key, new Schema({
+        type: 'object',
+        properties: _defineProperty({}, key, fieldSchema.properties['item'])
+      }));
+    }
+    return schemaMap.get(key);
+  }, [fieldSchema.properties, schemaMap]);
+  var onPaginationChange = useCallback(function (page, pageSize) {
+    run(_objectSpread(_objectSpread({}, params === null || params === void 0 ? void 0 : params[0]), {}, {
+      page: page,
+      pageSize: pageSize
+    }));
+  }, [run, params]);
+  return /*#__PURE__*/React.createElement(SchemaComponentOptions, {
+    scope: {
+      useListItemProps: useListItemProps,
+      useListActionBarProps: useListActionBarProps
+    }
+  }, /*#__PURE__*/React.createElement(SortableItem, {
+    className: cx('nb-list', designerCss)
+  }, /*#__PURE__*/React.createElement(AntdList, {
+    pagination: !meta || meta.count <= meta.pageSize ? false : {
+      onChange: onPaginationChange,
+      total: (meta === null || meta === void 0 ? void 0 : meta.count) || 0,
+      pageSize: (meta === null || meta === void 0 ? void 0 : meta.pageSize) || 10,
+      current: (meta === null || meta === void 0 ? void 0 : meta.page) || 1
+    },
+    loading: service === null || service === void 0 ? void 0 : service.loading
+  }, (_field$value = field.value) === null || _field$value === void 0 ? void 0 : _field$value.map(function (item, index) {
+    return /*#__PURE__*/React.createElement(RecursionField, {
+      basePath: field.address,
+      key: index,
+      name: index,
+      onlyRenderProperties: true,
+      schema: getSchema(index)
+    });
+  })), /*#__PURE__*/React.createElement(Designer, null)));
+};
+export var List = InternalList;
+List.Item = ListItem;
+List.Designer = ListDesigner;
+List.Decorator = ListBlockProvider;

package/es/schema-component/antd/list/hooks.d.ts

@@ -0,0 +1,4 @@
+import { SpaceProps } from 'antd';
+export declare const useListActionBarProps: () => {
+    spaceProps: SpaceProps;
+};

package/es/schema-component/antd/list/hooks.js

@@ -0,0 +1,9 @@
+var spaceProps = {
+  size: ['large', 'small'],
+  wrap: true
+};
+export var useListActionBarProps = function useListActionBarProps() {
+  return {
+    spaceProps: spaceProps
+  };
+};

package/es/schema-component/antd/list/index.d.ts

@@ -0,0 +1 @@
+export * from './List';

package/es/schema-component/antd/list/index.js

@@ -0,0 +1 @@
+export * from './List';