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

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/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,12 @@
-export declare const useVariableOptions: () => any[];
+export declare const useVariableOptions: () => ({
+    label: string;
+    value: string;
+    key: string;
+    disabled: boolean;
+    children: {
+        key: string;
+        value: string;
+        label: string;
+        disabled: boolean;
+    }[];
+} | import("../type").Option)[];

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

@@ -1,3 +1,4 @@
+import { useMemo } from 'react';
 import { useValues } from '../../../schema-component/antd/filter/useValues';
 import { useDateVariable } from './useDateVariable';
 import { useUserVariable } from './useUserVariable';
@@ -6,13 +7,16 @@ export var useVariableOptions = function useVariableOptions() {
     operator = _useValues.operator,
     schema = _useValues.schema;
   var userVariable = useUserVariable({
-    operator: operator,
+    maxDepth: 3,
     schema: schema
   });
   var dateVariable = useDateVariable({
     operator: operator,
     schema: schema
   });
+  var result = useMemo(function () {
+    return [userVariable, dateVariable];
+  }, [dateVariable, userVariable]);
   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;

package/es/schema-templates/BlockTemplateDetails.js

@@ -12,7 +12,7 @@ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefine
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { PageHeader as AntdPageHeader, Input, Spin } from 'antd';
 import React, { useContext, useState } from 'react';
-import { useHistory, useRouteMatch } from 'react-router-dom';
+import { useNavigate, useParams } from 'react-router-dom';
 import { useAPIClient, useRequest, useSchemaTemplateManager } from '..';
 import { RemoteSchemaComponent, SchemaComponentContext } from '../schema-component';
 var EditableTitle = function EditableTitle(props) {
@@ -67,10 +67,10 @@ var EditableTitle = function EditableTitle(props) {
   }, "\u672A\u547D\u540D")));
 };
 export var BlockTemplateDetails = function BlockTemplateDetails() {
-  var _match$params, _data$data, _data$data2;
-  var history = useHistory();
-  var match = useRouteMatch();
-  var key = match === null || match === void 0 ? void 0 : (_match$params = match.params) === null || _match$params === void 0 ? void 0 : _match$params.key;
+  var _data$data, _data$data2;
+  var navigate = useNavigate();
+  var params = useParams();
+  var key = params === null || params === void 0 ? void 0 : params.key;
   var value = useContext(SchemaComponentContext);
   var _useRequest2 = useRequest({
       resource: 'uiSchemaTemplates',
@@ -86,7 +86,7 @@ export var BlockTemplateDetails = function BlockTemplateDetails() {
   }
   return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(AntdPageHeader, {
     onBack: function onBack() {
-      history.push('/admin/plugins/block-templates');
+      navigate('/admin/plugins/block-templates');
     },
     ghost: false,
     title: /*#__PURE__*/React.createElement(EditableTitle, {

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

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

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

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { ReactNode } from 'react';
 export declare const SchemaTemplateManagerContext: React.Context<any>;
 export declare const SchemaTemplateManagerProvider: React.FC<any>;
 export declare const useSchemaTemplate: () => any;
@@ -14,5 +14,8 @@ export declare const useSchemaTemplateManager: () => {
     getTemplateBySchemaId(schemaId: any): any;
     getTemplateById(key: any): any;
     getTemplatesByCollection(collectionName: string, resourceName?: string): any;
+    getTemplatesByComponentName(componentName: string): Array<any>;
 };
-export declare const RemoteSchemaTemplateManagerProvider: React.FC;
+export declare const RemoteSchemaTemplateManagerProvider: React.FC<{
+    children?: ReactNode;
+}>;

package/es/schema-templates/SchemaTemplateManagerProvider.js

@@ -206,6 +206,13 @@ export var useSchemaTemplateManager = function useSchemaTemplateManager() {
         return template.collectionName === collectionName;
       });
       return items || [];
+    },
+    getTemplatesByComponentName: function getTemplatesByComponentName(componentName) {
+      var _templates$filter2;
+      var items = templates === null || templates === void 0 ? void 0 : (_templates$filter2 = templates.filter) === null || _templates$filter2 === void 0 ? void 0 : _templates$filter2.call(templates, function (template) {
+        return template.componentName === componentName;
+      });
+      return items || [];
     }
   };
 };

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

@@ -1,4 +1,3 @@
 export * from './BlockTemplateDetails';
 export * from './BlockTemplatePage';
 export * from './SchemaTemplateManagerProvider';
-export * from './SchemaTemplateShortcut';

package/es/schema-templates/index.js

@@ -1,4 +1,3 @@
 export * from './BlockTemplateDetails';
 export * from './BlockTemplatePage';
-export * from './SchemaTemplateManagerProvider';
-export * from './SchemaTemplateShortcut';
+export * from './SchemaTemplateManagerProvider';

package/es/settings-form/SettingsForm.js

@@ -81,6 +81,8 @@ export var SettingsForm = observer(function (props) {
       });
     }))
   }, /*#__PURE__*/React.createElement("a", null, "\u914D\u7F6E")))))));
+}, {
+  displayName: 'SettingsForm'
 });
 SettingsForm.Divider = function () {
   return /*#__PURE__*/React.createElement(Menu.Divider, null);
@@ -125,6 +127,8 @@ SettingsForm.Switch = observer(function () {
   }, field.title, " ", /*#__PURE__*/React.createElement(Switch, {
     checked: !!field.value
   })));
+}, {
+  displayName: 'SettingsForm'
 });
 SettingsForm.Select = observer(function (props) {
   var field = useField();
@@ -160,6 +164,8 @@ SettingsForm.Select = observer(function (props) {
     size: 'small',
     bordered: false
   })));
+}, {
+  displayName: 'SettingsForm'
 });
 SettingsForm.Modal = function () {
   var form = useForm();

package/es/system-settings/SystemSettingsProvider.d.ts

@@ -1,5 +1,7 @@
-import { Result } from 'ahooks/lib/useRequest/src/types';
-import React from 'react';
+import { Result } from 'ahooks/es/useRequest/src/types';
+import React, { ReactNode } from 'react';
 export declare const SystemSettingsContext: React.Context<Result<any, any>>;
 export declare const useSystemSettings: () => Result<any, any>;
-export declare const SystemSettingsProvider: React.FC;
+export declare const SystemSettingsProvider: React.FC<{
+    children?: ReactNode;
+}>;

package/es/system-settings/SystemSettingsShortcut.d.ts

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