@nocobase/client 0.9.4-alpha.2 → 0.10.0-alpha.3

package/es/schema-settings/VariableInput/hooks/useDateVariable.js

@@ -1,129 +1,134 @@
-import { useCompile } from '../../../schema-component';
+import { useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
 export var useDateVariable = function useDateVariable(_ref) {
   var operator = _ref.operator,
     schema = _ref.schema;
-  var compile = useCompile();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
   var operatorValue = (operator === null || operator === void 0 ? void 0 : operator.value) || '';
-  if (!operator || !schema) return null;
-  var disabled = !['DatePicker', 'DatePicker.RangePicker'].includes(schema['x-component']);
+  var disabled = !['DatePicker', 'DatePicker.RangePicker'].includes(schema === null || schema === void 0 ? void 0 : schema['x-component']);
   var dateOptions = [{
     key: 'now',
     value: 'now',
-    label: "{{t(\"Now\")}}",
-    disabled: schema['x-component'] !== 'DatePicker' || operatorValue === '$dateBetween'
+    label: t('Now'),
+    disabled: (schema === null || schema === void 0 ? void 0 : schema['x-component']) !== 'DatePicker' || operatorValue === '$dateBetween'
   }, {
     key: 'yesterday',
     value: 'yesterday',
-    label: "{{t(\"Yesterday\")}}",
+    label: t('Yesterday'),
     disabled: disabled
   }, {
     key: 'today',
     value: 'today',
-    label: "{{t(\"Today\")}}",
+    label: t('Today'),
     disabled: disabled
   }, {
     key: 'tomorrow',
     value: 'tomorrow',
-    label: "{{t(\"Tomorrow\")}}",
+    label: t('Tomorrow'),
     disabled: disabled
   }, {
     key: 'lastIsoWeek',
     value: 'lastIsoWeek',
-    label: "{{t(\"Last week\")}}",
+    label: t('Last week'),
     disabled: disabled
   }, {
     key: 'thisIsoWeek',
     value: 'thisIsoWeek',
-    label: "{{t(\"This week\")}}",
+    label: t('This week'),
     disabled: disabled
   }, {
     key: 'nextIsoWeek',
     value: 'nextIsoWeek',
-    label: "{{t(\"Next week\")}}",
+    label: t('Next week'),
     disabled: disabled
   }, {
     key: 'lastMonth',
     value: 'lastMonth',
-    label: "{{t(\"Last month\")}}",
+    label: t('Last month'),
     disabled: disabled
   }, {
     key: 'thisMonth',
     value: 'thisMonth',
-    label: "{{t(\"This month\")}}",
+    label: t('This month'),
     disabled: disabled
   }, {
     key: 'nextMonth',
     value: 'nextMonth',
-    label: "{{t(\"Next month\")}}",
+    label: t('Next month'),
     disabled: disabled
   }, {
     key: 'lastQuarter',
     value: 'lastQuarter',
-    label: "{{t(\"Last quarter\")}}",
+    label: t('Last quarter'),
     disabled: disabled
   }, {
     key: 'thisQuarter',
     value: 'thisQuarter',
-    label: "{{t(\"This quarter\")}}",
+    label: t('This quarter'),
     disabled: disabled
   }, {
     key: 'nextQuarter',
     value: 'nextQuarter',
-    label: "{{t(\"Next quarter\")}}",
+    label: t('Next quarter'),
     disabled: disabled
   }, {
     key: 'lastYear',
     value: 'lastYear',
-    label: "{{t(\"Last year\")}}",
+    label: t('Last year'),
     disabled: disabled
   }, {
     key: 'thisYear',
     value: 'thisYear',
-    label: "{{t(\"This year\")}}",
+    label: t('This year'),
     disabled: disabled
   }, {
     key: 'nextYear',
     value: 'nextYear',
-    label: "{{t(\"Next year\")}}",
+    label: t('Next year'),
     disabled: disabled
   }, {
     key: 'last7Days',
     value: 'last7Days',
-    label: "{{t(\"Last 7 days\")}}",
+    label: t('Last 7 days'),
     disabled: disabled
   }, {
     key: 'next7Days',
     value: 'next7Days',
-    label: "{{t(\"Next 7 days\")}}",
+    label: t('Next 7 days'),
     disabled: disabled
   }, {
     key: 'last30Days',
     value: 'last30Days',
-    label: "{{t(\"Last 30 days\")}}",
+    label: t('Last 30 days'),
     disabled: disabled
   }, {
     key: 'next30Days',
     value: 'next30Days',
-    label: "{{t(\"Next 30 days\")}}",
+    label: t('Next 30 days'),
     disabled: disabled
   }, {
     key: 'last90Days',
     value: 'last90Days',
-    label: "{{t(\"Last 90 days\")}}",
+    label: t('Last 90 days'),
     disabled: disabled
   }, {
     key: 'next90Days',
     value: 'next90Days',
-    label: "{{t(\"Next 90 days\")}}",
+    label: t('Next 90 days'),
     disabled: disabled
   }];
-  return compile({
-    label: "{{t(\"Date variables\")}}",
-    value: '$date',
-    key: '$date',
-    disabled: dateOptions.every(function (option) {
-      return option.disabled;
-    }),
-    children: dateOptions
-  });
+  var result = useMemo(function () {
+    return {
+      label: t('Date variables'),
+      value: '$date',
+      key: '$date',
+      disabled: dateOptions.every(function (option) {
+        return option.disabled;
+      }),
+      children: dateOptions
+    };
+  }, [schema === null || schema === void 0 ? void 0 : schema['x-component']]);
+  if (!operator || !schema) return null;
+  return result;
 };

package/es/schema-settings/VariableInput/hooks/useFormVariable.d.ts

@@ -0,0 +1,19 @@
+import { Schema } from '@formily/react';
+export declare const useFormVariable: ({ blockForm, rootCollection, operator, schema, level, }: {
+    blockForm?: any;
+    rootCollection: string;
+    operator?: any;
+    schema: Schema;
+    level?: number;
+}) => {
+    label: string;
+    value: string;
+    key: string;
+    children: any[];
+    isLeaf: boolean;
+    field: {
+        target: string;
+    };
+    depth: number;
+    loadChildren: (option: any) => Promise<void>;
+};

package/es/schema-settings/VariableInput/hooks/useFormVariable.js

@@ -0,0 +1,89 @@
+import { useMemo } from 'react';
+import { useCompile, useGetFilterOptions } from '../../../schema-component';
+var getChildren = function getChildren(options, _ref) {
+  var depth = _ref.depth,
+    maxDepth = _ref.maxDepth,
+    loadChildren = _ref.loadChildren,
+    compile = _ref.compile;
+  var result = options.map(function (option) {
+    if (!option.target) {
+      return {
+        key: option.name,
+        value: option.name,
+        label: compile(option.title),
+        depth: depth
+      };
+    }
+    if (depth >= maxDepth) {
+      return null;
+    }
+    return {
+      key: option.name,
+      value: option.name,
+      label: compile(option.title),
+      children: [],
+      isLeaf: false,
+      field: option,
+      depth: depth,
+      loadChildren: loadChildren
+    };
+  }).filter(Boolean);
+  return result;
+};
+export var useFormVariable = function useFormVariable(_ref2) {
+  var blockForm = _ref2.blockForm,
+    rootCollection = _ref2.rootCollection,
+    operator = _ref2.operator,
+    schema = _ref2.schema,
+    level = _ref2.level;
+  var compile = useCompile();
+  var getFilterOptions = useGetFilterOptions();
+  var loadChildren = function loadChildren(option) {
+    var _option$field;
+    if (!((_option$field = option.field) === null || _option$field === void 0 ? void 0 : _option$field.target)) {
+      return new Promise(function (resolve) {
+        resolve(void 0);
+      });
+    }
+    var collectionName = option.field.target;
+    var fields = getFilterOptions(collectionName);
+    var allowFields = option.depth === 0 ? fields.filter(function (field) {
+      return Object.keys(blockForm.fields).some(function (name) {
+        return name.includes(".".concat(field.name));
+      });
+    }) : fields;
+    return new Promise(function (resolve) {
+      setTimeout(function () {
+        var children = getChildren(allowFields, {
+          depth: option.depth + 1,
+          maxDepth: 4,
+          loadChildren: loadChildren,
+          compile: compile
+        }) || [];
+        if (children.length === 0) {
+          option.disabled = true;
+          resolve();
+          return;
+        }
+        option.children = children;
+        resolve();
+        // 延迟 5 毫秒，防止阻塞主线程，导致 UI 卡顿
+      }, 5);
+    });
+  };
+  var result = useMemo(function () {
+    return blockForm && {
+      label: "{{t(\"Current form\")}}",
+      value: '$form',
+      key: '$form',
+      children: [],
+      isLeaf: false,
+      field: {
+        target: rootCollection
+      },
+      depth: 0,
+      loadChildren: loadChildren
+    };
+  }, [rootCollection]);
+  return result;
+};

package/es/schema-settings/VariableInput/hooks/useIterationVariable.d.ts

@@ -0,0 +1,8 @@
+export declare const useIterationVariable: ({ blockForm, collectionField, operator, schema, level, rootCollection, }: {
+    blockForm?: any;
+    collectionField: any;
+    operator?: any;
+    schema: any;
+    level?: number;
+    rootCollection?: string;
+}) => any;

package/es/schema-settings/VariableInput/hooks/useIterationVariable.js

@@ -0,0 +1,77 @@
+import { useMemo } from 'react';
+import { useCompile, useGetFilterOptions } from '../../../schema-component';
+var getChildren = function getChildren(options, _ref) {
+  var schema = _ref.schema,
+    operator = _ref.operator,
+    maxDepth = _ref.maxDepth,
+    _ref$count = _ref.count,
+    count = _ref$count === void 0 ? 1 : _ref$count,
+    getFilterOptions = _ref.getFilterOptions;
+  if (count > maxDepth) {
+    return [];
+  }
+  var result = options.map(function (option) {
+    if (option.type !== 'belongsTo' && option.type !== 'hasOne' || !option.target) {
+      return {
+        key: option.name,
+        value: option.name,
+        label: option.title,
+        // TODO: 现在是通过组件的名称来过滤能够被选择的选项，这样的坏处是不够精确，后续可以优化
+        // disabled: schema?.['x-component'] !== option.schema?.['x-component'],
+        disabled: false
+      };
+    }
+    var children = getChildren(getFilterOptions(option.target), {
+      schema: schema,
+      operator: operator,
+      maxDepth: maxDepth,
+      count: count + 1,
+      getFilterOptions: getFilterOptions
+    }) || [];
+    return {
+      key: option.name,
+      value: option.name,
+      label: option.title,
+      children: children,
+      disabled: children.every(function (child) {
+        return child.disabled;
+      })
+    };
+  });
+  return result;
+};
+export var useIterationVariable = function useIterationVariable(_ref2) {
+  var blockForm = _ref2.blockForm,
+    collectionField = _ref2.collectionField,
+    operator = _ref2.operator,
+    schema = _ref2.schema,
+    level = _ref2.level,
+    rootCollection = _ref2.rootCollection;
+  var compile = useCompile();
+  var getFilterOptions = useGetFilterOptions();
+  var fields = getFilterOptions(collectionField === null || collectionField === void 0 ? void 0 : collectionField.collectionName);
+  var children = useMemo(function () {
+    var allowFields = fields.filter(function (field) {
+      return Object.keys(blockForm.fields).some(function (name) {
+        return name.includes(field.name);
+      });
+    });
+    return getChildren(allowFields, {
+      schema: schema,
+      operator: operator,
+      maxDepth: level || 3,
+      getFilterOptions: getFilterOptions
+    }) || [];
+  }, [operator, schema, blockForm]);
+  return useMemo(function () {
+    return rootCollection !== (collectionField === null || collectionField === void 0 ? void 0 : collectionField.collectionName) && children.length > 0 ? compile({
+      label: "{{t(\"Current object\")}}",
+      value: '$iteration',
+      key: '$iteration',
+      disabled: children.every(function (option) {
+        return option.disabled;
+      }),
+      children: children
+    }) : null;
+  }, [children]);
+};

package/es/schema-settings/VariableInput/hooks/useUserVariable.d.ts

@@ -1,5 +1,5 @@
-export declare const useUserVariable: ({ operator, schema, level }: {
-    operator?: any;
+import { Option } from '../type';
+export declare const useUserVariable: ({ schema, maxDepth }: {
     schema: any;
-    level?: number;
-}) => any;
+    maxDepth?: number;
+}) => Option;

package/es/schema-settings/VariableInput/hooks/useUserVariable.js

@@ -1,68 +1,92 @@
+import { error } from '@nocobase/utils/client';
 import { useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
 import { useCompile, useGetFilterOptions } from '../../../schema-component';
 var getChildren = function getChildren(options, _ref) {
   var schema = _ref.schema,
-    operator = _ref.operator,
+    depth = _ref.depth,
     maxDepth = _ref.maxDepth,
-    _ref$count = _ref.count,
-    count = _ref$count === void 0 ? 1 : _ref$count,
-    getFilterOptions = _ref.getFilterOptions;
-  if (count > maxDepth) {
-    return [];
-  }
+    loadChildren = _ref.loadChildren,
+    compile = _ref.compile;
   var result = options.map(function (option) {
     if (!option.target) {
       var _option$schema;
       return {
         key: option.name,
         value: option.name,
-        label: option.title,
+        label: compile(option.title),
         // TODO: 现在是通过组件的名称来过滤能够被选择的选项，这样的坏处是不够精确，后续可以优化
-        disabled: (schema === null || schema === void 0 ? void 0 : schema['x-component']) !== ((_option$schema = option.schema) === null || _option$schema === void 0 ? void 0 : _option$schema['x-component'])
+        disabled: (schema === null || schema === void 0 ? void 0 : schema['x-component']) !== ((_option$schema = option.schema) === null || _option$schema === void 0 ? void 0 : _option$schema['x-component']),
+        isLeaf: true,
+        depth: depth
       };
     }
-    var children = getChildren(getFilterOptions(option.target), {
-      schema: schema,
-      operator: operator,
-      maxDepth: maxDepth,
-      count: count + 1,
-      getFilterOptions: getFilterOptions
-    }) || [];
+    if (depth >= maxDepth) {
+      return null;
+    }
     return {
       key: option.name,
       value: option.name,
-      label: option.title,
-      children: children,
-      disabled: children.every(function (child) {
-        return child.disabled;
-      })
+      label: compile(option.title),
+      children: [],
+      isLeaf: false,
+      field: option,
+      depth: depth,
+      loadChildren: loadChildren
     };
-  });
+  }).filter(Boolean);
   return result;
 };
 export var useUserVariable = function useUserVariable(_ref2) {
-  var operator = _ref2.operator,
-    schema = _ref2.schema,
-    level = _ref2.level;
+  var schema = _ref2.schema,
+    _ref2$maxDepth = _ref2.maxDepth,
+    maxDepth = _ref2$maxDepth === void 0 ? 3 : _ref2$maxDepth;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
   var compile = useCompile();
   var getFilterOptions = useGetFilterOptions();
-  var children = useMemo(function () {
-    return getChildren(getFilterOptions('users'), {
-      schema: schema,
-      operator: operator,
-      maxDepth: level || 3,
-      getFilterOptions: getFilterOptions
-    }) || [];
-  }, [operator, schema]);
-  return useMemo(function () {
-    return compile({
-      label: "{{t(\"Current user\")}}",
+  var loadChildren = function loadChildren(option) {
+    var _option$field;
+    if (!((_option$field = option.field) === null || _option$field === void 0 ? void 0 : _option$field.target)) {
+      return new Promise(function (resolve) {
+        error('Must be set field target');
+        resolve(void 0);
+      });
+    }
+    var collectionName = option.field.target;
+    return new Promise(function (resolve) {
+      setTimeout(function () {
+        var children = getChildren(getFilterOptions(collectionName), {
+          schema: schema,
+          depth: option.depth + 1,
+          maxDepth: maxDepth,
+          loadChildren: loadChildren,
+          compile: compile
+        }) || [];
+        if (children.length === 0) {
+          option.disabled = true;
+          resolve();
+          return;
+        }
+        option.children = children;
+        resolve();
+        // 延迟 5 毫秒，防止阻塞主线程，导致 UI 卡顿
+      }, 5);
+    });
+  };
+  var result = useMemo(function () {
+    return {
+      label: t('Current user'),
       value: '$user',
       key: '$user',
-      disabled: children.every(function (option) {
-        return option.disabled;
-      }),
-      children: children
-    });
-  }, [children]);
+      children: [],
+      isLeaf: false,
+      field: {
+        target: 'users'
+      },
+      depth: 0,
+      loadChildren: loadChildren
+    };
+  }, [schema === null || schema === void 0 ? void 0 : schema['x-component']]);
+  return result;
 };

package/es/schema-settings/VariableInput/hooks/useVariableOptions.d.ts

@@ -1 +1,5 @@
-export declare const useVariableOptions: () => any[];
+export declare const useVariableOptions: ({ form, collectionField, rootCollection }: {
+    form: any;
+    collectionField: any;
+    rootCollection: any;
+}) => any[];

package/es/schema-settings/VariableInput/hooks/useVariableOptions.js

@@ -1,18 +1,38 @@
+import { useMemo } from 'react';
 import { useValues } from '../../../schema-component/antd/filter/useValues';
 import { useDateVariable } from './useDateVariable';
 import { useUserVariable } from './useUserVariable';
-export var useVariableOptions = function useVariableOptions() {
+import { useFormVariable } from './useFormVariable';
+import { useIterationVariable } from './useIterationVariable';
+export var useVariableOptions = function useVariableOptions(_ref) {
+  var form = _ref.form,
+    collectionField = _ref.collectionField,
+    rootCollection = _ref.rootCollection;
   var _useValues = useValues(),
     operator = _useValues.operator,
     schema = _useValues.schema;
   var userVariable = useUserVariable({
-    operator: operator,
+    maxDepth: 3,
     schema: schema
   });
   var dateVariable = useDateVariable({
     operator: operator,
     schema: schema
   });
+  var formVariabele = useFormVariable({
+    blockForm: form,
+    rootCollection: rootCollection,
+    schema: schema
+  });
+  var iterationVariabele = useIterationVariable({
+    blockForm: form,
+    collectionField: collectionField,
+    schema: schema,
+    rootCollection: rootCollection
+  });
+  var result = useMemo(function () {
+    return [userVariable, dateVariable, formVariabele, iterationVariabele].filter(Boolean);
+  }, [dateVariable, userVariable, formVariabele, iterationVariabele]);
   if (!operator || !schema) return [];
-  return [userVariable, dateVariable];
+  return result;
 };

package/es/schema-settings/VariableInput/type.d.ts

@@ -0,0 +1,28 @@
+/// <reference types="react" />
+import { Schema } from '@formily/react';
+export interface Option {
+    key?: string | number;
+    value?: string | number;
+    label?: React.ReactNode;
+    disabled?: boolean;
+    children?: Option[];
+    isLeaf?: boolean;
+    /** 当开启异步加载时有效，用于加载当前 node 的 children */
+    loadChildren?(option: Option): Promise<void>;
+    field?: FieldOption;
+    depth?: number;
+}
+export interface FieldOption {
+    name?: string;
+    type?: string;
+    target?: string;
+    title?: string;
+    schema?: Schema;
+    operators?: Operator[];
+    children?: FieldOption[];
+}
+interface Operator {
+    label: string;
+    value: string;
+}
+export {};

package/es/schema-settings/VariableInput/type.js

@@ -0,0 +1 @@
+export {};

package/es/schema-settings/hooks/useIsShowMultipleSwitch.js

@@ -4,7 +4,7 @@ import { useCollectionManager } from '../../collection-manager';
  * 是否显示 `允许多选` 开关
  */
 export function useIsShowMultipleSwitch() {
-  var _uiSchema$xComponent;
+  var _uiSchema$xComponent, _field$componentProps;
   var field = useField();
   var fieldSchema = useFieldSchema();
   var _useCollectionManager = useCollectionManager(),
@@ -12,7 +12,8 @@ export function useIsShowMultipleSwitch() {
   var collectionField = fieldSchema['x-collection-field'] ? getCollectionField(fieldSchema['x-collection-field']) : null;
   var uiSchema = (collectionField === null || collectionField === void 0 ? void 0 : collectionField.uiSchema) || fieldSchema;
   var hasMultiple = ((_uiSchema$xComponent = uiSchema['x-component-props']) === null || _uiSchema$xComponent === void 0 ? void 0 : _uiSchema$xComponent.multiple) === true;
+  var fieldMode = field === null || field === void 0 ? void 0 : (_field$componentProps = field.componentProps) === null || _field$componentProps === void 0 ? void 0 : _field$componentProps['mode'];
   return function IsShowMultipleSwitch() {
-    return !field.readPretty && fieldSchema['x-component'] !== 'TableField' && hasMultiple;
+    return !field.readPretty && fieldSchema['x-component'] !== 'TableField' && hasMultiple && fieldMode !== 'SubTable';
   };
 }

package/es/schema-templates/BlockTemplate.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 export declare const useBlockTemplateContext: () => any;
-export declare const BlockTemplate: React.MemoExoticComponent<React.FunctionComponent<Pick<any, string | number | symbol>>>;
+export declare const BlockTemplate: React.MemoExoticComponent<import("@formily/react").ReactFC<Pick<any, string | number | symbol>>>;

package/es/schema-templates/BlockTemplate.js

@@ -21,8 +21,9 @@ export var BlockTemplate = observer(function (props) {
     return getTemplateById(templateId);
   }, [templateId]);
   var onSuccess = function onSuccess(data) {
-    var _data$data;
+    var _data$data, _data$data2;
     fieldSchema['x-linkage-rules'] = (data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data['x-linkage-rules']) || [];
+    fieldSchema.setProperties(data === null || data === void 0 ? void 0 : (_data$data2 = data.data) === null || _data$data2 === void 0 ? void 0 : _data$data2.properties);
   };
   return template ? /*#__PURE__*/React.createElement(BlockTemplateContext.Provider, {
     value: {
@@ -36,4 +37,6 @@ export var BlockTemplate = observer(function (props) {
     uid: template === null || template === void 0 ? void 0 : template.uid,
     onSuccess: onSuccess
   })) : null;
+}, {
+  displayName: 'BlockTemplate'
 });

package/es/schema-templates/BlockTemplateDetails.d.ts

@@ -1 +1,2 @@
-export declare const BlockTemplateDetails: () => JSX.Element;
+import React from 'react';
+export declare const BlockTemplateDetails: () => React.JSX.Element;