amis-editor 5.4.1 → 5.5.0

package/esm/renderer/TplFormulaControl.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.4.0
+ * amis-editor v5.5.0
  * Copyright 2018-2023 @fex
  */
 
@@ -11,9 +11,9 @@ import { FormulaEditor, CodeMirrorEditor } from 'amis-ui';
 import { Icon, Button, TooltipWrapper, FormItem } from 'amis';
 import { autobind } from 'amis-core';
 import { editorFactory, FormulaPlugin } from './textarea-formula/plugin.js';
-import { getVariables } from './textarea-formula/utils.js';
 import { renderFormulaValue } from './FormulaControl.js';
 import FormulaPicker from './textarea-formula/FormulaPicker.js';
+import { getVariables } from 'amis-editor-core';
 import { i18n } from 'i18n-runtime';
 
 /**
@@ -36,77 +36,38 @@ var TplFormulaControl = /** @class */function (_super) {
       formulaPickerValue: '',
       tooltipStyle: {
         display: 'none'
-      }
+      },
+      loading: false
     };
     return _this;
   }
   TplFormulaControl.prototype.componentDidMount = function () {
     return __awaiter(this, void 0, void 0, function () {
-      var editorStore, variablesArr;
+      var editorStore;
       var _this = this;
       return __generator(this, function (_a) {
-        switch (_a.label) {
-          case 0:
-            editorStore = window.editorStore;
-            this.appLocale = editorStore === null || editorStore === void 0 ? void 0 : editorStore.appLocale;
-            this.appCorpusData = editorStore === null || editorStore === void 0 ? void 0 : editorStore.appCorpusData;
-            this.unReaction = reaction(function () {
-              return editorStore === null || editorStore === void 0 ? void 0 : editorStore.appLocaleState;
-            }, function () {
-              return __awaiter(_this, void 0, void 0, function () {
-                var variablesArr;
-                return __generator(this, function (_a) {
-                  switch (_a.label) {
-                    case 0:
-                      this.appLocale = editorStore === null || editorStore === void 0 ? void 0 : editorStore.appLocale;
-                      this.appCorpusData = editorStore === null || editorStore === void 0 ? void 0 : editorStore.appCorpusData;
-                      return [4 /*yield*/, getVariables(this)];
-                    case 1:
-                      variablesArr = _a.sent();
-                      this.setState({
-                        variables: variablesArr
-                      });
-                      return [2 /*return*/];
-                  }
-                });
-              });
+        editorStore = window.editorStore;
+        this.appLocale = editorStore === null || editorStore === void 0 ? void 0 : editorStore.appLocale;
+        this.appCorpusData = editorStore === null || editorStore === void 0 ? void 0 : editorStore.appCorpusData;
+        this.unReaction = reaction(function () {
+          return editorStore === null || editorStore === void 0 ? void 0 : editorStore.appLocaleState;
+        }, function () {
+          return __awaiter(_this, void 0, void 0, function () {
+            return __generator(this, function (_a) {
+              this.appLocale = editorStore === null || editorStore === void 0 ? void 0 : editorStore.appLocale;
+              this.appCorpusData = editorStore === null || editorStore === void 0 ? void 0 : editorStore.appCorpusData;
+              return [2 /*return*/];
             });
+          });
+        });
 
-            return [4 /*yield*/, getVariables(this)];
-          case 1:
-            variablesArr = _a.sent();
-            this.setState({
-              variables: variablesArr
-            });
-            if (this.tooltipRef.current) {
-              this.tooltipRef.current.addEventListener('mouseleave', this.hiddenToolTip);
-            }
-            if (this.wrapRef.current) {
-              this.wrapRef.current.addEventListener('keydown', this.handleKeyDown, true);
-            }
-            return [2 /*return*/];
+        if (this.tooltipRef.current) {
+          this.tooltipRef.current.addEventListener('mouseleave', this.hiddenToolTip);
         }
-      });
-    });
-  };
-
-  TplFormulaControl.prototype.componentDidUpdate = function (prevProps) {
-    return __awaiter(this, void 0, void 0, function () {
-      var variablesArr;
-      return __generator(this, function (_a) {
-        switch (_a.label) {
-          case 0:
-            if (!(this.props.data !== prevProps.data)) return [3 /*break*/, 2];
-            return [4 /*yield*/, getVariables(this)];
-          case 1:
-            variablesArr = _a.sent();
-            this.setState({
-              variables: variablesArr
-            });
-            _a.label = 2;
-          case 2:
-            return [2 /*return*/];
+        if (this.wrapRef.current) {
+          this.wrapRef.current.addEventListener('keydown', this.handleKeyDown, true);
         }
+        return [2 /*return*/];
       });
     });
   };
@@ -122,13 +83,6 @@ var TplFormulaControl = /** @class */function (_super) {
     (_a = this.editorPlugin) === null || _a === void 0 ? void 0 : _a.dispose();
     (_b = this.unReaction) === null || _b === void 0 ? void 0 : _b.call(this);
   };
-  TplFormulaControl.prototype.onExpressionClick = function (expression, brace) {
-    this.setState({
-      formulaPickerValue: expression,
-      formulaPickerOpen: true,
-      expressionBrace: brace
-    });
-  };
   TplFormulaControl.prototype.onExpressionMouseEnter = function (e, expression, brace) {
     var _a;
     var wrapperRect = (_a = this.wrapRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
@@ -240,13 +194,91 @@ var TplFormulaControl = /** @class */function (_super) {
     var _a;
     (_a = this.editorPlugin) === null || _a === void 0 ? void 0 : _a.setValue('');
   };
-  TplFormulaControl.prototype.handleFormulaClick = function () {
-    this.setState({
-      formulaPickerOpen: true,
-      formulaPickerValue: '',
-      expressionBrace: undefined
+  /**
+   * 公式编辑器打开完成一些异步任务的加载
+   */
+  TplFormulaControl.prototype.beforeFormulaEditorOpen = function () {
+    var _a;
+    return __awaiter(this, void 0, void 0, function () {
+      var _b, node, manager, data, onFormulaEditorOpen, res, variables, variables, error_1;
+      return __generator(this, function (_c) {
+        switch (_c.label) {
+          case 0:
+            _b = this.props, node = _b.node, manager = _b.manager, data = _b.data;
+            onFormulaEditorOpen = (_a = manager === null || manager === void 0 ? void 0 : manager.config) === null || _a === void 0 ? void 0 : _a.onFormulaEditorOpen;
+            this.setState({
+              loading: true
+            });
+            _c.label = 1;
+          case 1:
+            _c.trys.push([1, 8,, 9]);
+            if (!(manager && onFormulaEditorOpen && typeof onFormulaEditorOpen === 'function')) return [3 /*break*/, 5];
+            return [4 /*yield*/, onFormulaEditorOpen(node, manager, data)];
+          case 2:
+            res = _c.sent();
+            if (!(res !== false)) return [3 /*break*/, 4];
+            return [4 /*yield*/, getVariables(this)];
+          case 3:
+            variables = _c.sent();
+            this.setState({
+              variables: variables
+            });
+            _c.label = 4;
+          case 4:
+            return [3 /*break*/, 7];
+          case 5:
+            return [4 /*yield*/, getVariables(this)];
+          case 6:
+            variables = _c.sent();
+            this.setState({
+              variables: variables
+            });
+            _c.label = 7;
+          case 7:
+            return [3 /*break*/, 9];
+          case 8:
+            error_1 = _c.sent();
+            console.error('[amis-editor] onFormulaEditorOpen failed: ', error_1 === null || error_1 === void 0 ? void 0 : error_1.stack);
+            return [3 /*break*/, 9];
+          case 9:
+            this.setState({
+              loading: false
+            });
+            return [2 /*return*/];
+        }
+      });
     });
   };
+
+  TplFormulaControl.prototype.handleFormulaClick = function (e, type) {
+    return __awaiter(this, void 0, void 0, function () {
+      return __generator(this, function (_a) {
+        switch (_a.label) {
+          case 0:
+            _a.trys.push([0, 2,, 3]);
+            return [4 /*yield*/, this.beforeFormulaEditorOpen()];
+          case 1:
+            _a.sent();
+            return [3 /*break*/, 3];
+          case 2:
+            _a.sent();
+            return [3 /*break*/, 3];
+          case 3:
+            this.setState({
+              formulaPickerOpen: true
+            });
+            if (type !== 'update') {
+              this.setState({
+                formulaPickerValue: '',
+                expressionBrace: undefined
+              });
+            }
+            return [2 /*return*/];
+        }
+      });
+    });
+  };
+
   TplFormulaControl.prototype.editorFactory = function (dom, cm) {
     return editorFactory(dom, cm, this.props.value, {
       lineWrapping: false,
@@ -262,7 +294,6 @@ var TplFormulaControl = /** @class */function (_super) {
           variables: variables
         });
       },
-      onExpressionClick: this.onExpressionClick,
       onExpressionMouseEnter: this.onExpressionMouseEnter,
       showPopover: false,
       showClearIcon: true
@@ -286,7 +317,8 @@ var TplFormulaControl = /** @class */function (_super) {
       formulaPickerOpen = _b.formulaPickerOpen,
       formulaPickerValue = _b.formulaPickerValue,
       variables = _b.variables,
-      tooltipStyle = _b.tooltipStyle;
+      tooltipStyle = _b.tooltipStyle,
+      loading = _b.loading;
     var FormulaPickerCmp = customFormulaPicker !== null && customFormulaPicker !== void 0 ? customFormulaPicker : FormulaPicker;
     var highlightValue = FormulaEditor.highlightValue(formulaPickerValue, variables) || {
       html: formulaPickerValue
@@ -322,7 +354,8 @@ var TplFormulaControl = /** @class */function (_super) {
         placement: 'left',
         mouseLeaveDelay: 0
       },
-      onClick: this.handleFormulaClick
+      onClick: this.handleFormulaClick,
+      loading: loading
     }, React__default.createElement(Icon, {
       icon: "input-add-fx",
       className: cx('ae-TplFormulaControl-icon', 'icon')
@@ -342,10 +375,8 @@ var TplFormulaControl = /** @class */function (_super) {
       className: "ae-TplFormulaControl-tooltip",
       style: tooltipStyle,
       ref: this.tooltipRef,
-      onClick: function () {
-        _this.setState({
-          formulaPickerOpen: true
-        });
+      onClick: function (e) {
+        return _this.handleFormulaClick(e, 'update');
       }
     })), formulaPickerOpen ? React__default.createElement(FormulaPickerCmp, __assign({}, this.props, {
       value: formulaPickerValue,
@@ -359,11 +390,10 @@ var TplFormulaControl = /** @class */function (_super) {
     })) : null);
   };
   TplFormulaControl.defaultProps = {
-    variableMode: 'tabs',
+    variableMode: 'tree',
     requiredDataPropsVariables: false,
     placeholder: i18n("02cc4f8f5a9aefbc03c778f7a5c989c7")
   };
-  __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", [String, Array]), __metadata("design:returntype", void 0)], TplFormulaControl.prototype, "onExpressionClick", null);
   __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", [MouseEvent, String, Array]), __metadata("design:returntype", void 0)], TplFormulaControl.prototype, "onExpressionMouseEnter", null);
   __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", []), __metadata("design:returntype", void 0)], TplFormulaControl.prototype, "hiddenToolTip", null);
   __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", [Object]), __metadata("design:returntype", void 0)], TplFormulaControl.prototype, "handleKeyDown", null);
@@ -371,7 +401,8 @@ var TplFormulaControl = /** @class */function (_super) {
   __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", [Object]), __metadata("design:returntype", void 0)], TplFormulaControl.prototype, "handleConfirm", null);
   __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", [Object]), __metadata("design:returntype", void 0)], TplFormulaControl.prototype, "handleOnChange", null);
   __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", []), __metadata("design:returntype", void 0)], TplFormulaControl.prototype, "handleClear", null);
-  __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", []), __metadata("design:returntype", void 0)], TplFormulaControl.prototype, "handleFormulaClick", null);
+  __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", []), __metadata("design:returntype", Promise)], TplFormulaControl.prototype, "beforeFormulaEditorOpen", null);
+  __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", [Object, String]), __metadata("design:returntype", Promise)], TplFormulaControl.prototype, "handleFormulaClick", null);
   __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", [HTMLElement, Object]), __metadata("design:returntype", void 0)], TplFormulaControl.prototype, "editorFactory", null);
   __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", [Object, Object]), __metadata("design:returntype", void 0)], TplFormulaControl.prototype, "handleEditorMounted", null);
   __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", []), __metadata("design:returntype", void 0)], TplFormulaControl.prototype, "editorAutoMark", null);

package/esm/renderer/TransferTableControl.d.ts

@@ -98,7 +98,7 @@ export default class TransferTableOption extends React.Component<OptionControlPr
         }[];
     };
     handleChange(value: Array<Option>, type: 'options' | 'columns'): void;
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }
 declare const TransferTableControl: {
     new (props: OptionControlProps): {
@@ -169,9 +169,9 @@ declare const TransferTableControl: {
                 })[];
             };
         };
-        renderHeader(): React.JSX.Element;
+        renderHeader(): JSX.Element;
         renderApiPanel(): any;
-        render(): React.JSX.Element;
+        render(): JSX.Element;
         context: unknown;
         setState<K extends keyof OptionControlState>(state: OptionControlState | ((prevState: Readonly<OptionControlState>, props: Readonly<OptionControlProps>) => OptionControlState | Pick<OptionControlState, K> | null) | Pick<OptionControlState, K> | null, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;

package/esm/renderer/TransferTableControl.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.4.0
+ * amis-editor v5.5.0
  * Copyright 2018-2023 @fex
  */
 

package/esm/renderer/TreeOptionControl.d.ts

@@ -42,7 +42,7 @@ export default class TreeOptionControl extends React.Component<OptionControlProp
      * 切换选项类型
      */
     handleSourceChange(source: SourceType): void;
-    renderHeader(): React.JSX.Element;
+    renderHeader(): JSX.Element;
     handleEditLabelOrValue(value: string, path: string, key: string): void;
     handleDelete(pathStr: string, index: number): void;
     getNodePath(pathStr: string): {
@@ -60,13 +60,13 @@ export default class TreeOptionControl extends React.Component<OptionControlProp
     rereshBindDrag(): void;
     initDragging(): void;
     destroyDragging(destroyRoot?: boolean): void;
-    renderModal(): React.JSX.Element;
+    renderModal(): JSX.Element;
     handleAPIChange(source: SchemaApi): void;
     handleLableFieldChange(labelField: string): void;
     handleValueFieldChange(valueField: string, ...a: any): void;
     handleIconFieldChange(iconField: string): void;
     renderApiPanel(): any;
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }
 export declare class TreeOptionControlRenderer extends TreeOptionControl {
 }

package/esm/renderer/TreeOptionControl.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.4.0
+ * amis-editor v5.5.0
  * Copyright 2018-2023 @fex
  */
 

package/esm/renderer/ValidationControl.d.ts

@@ -53,13 +53,13 @@ export default class ValidationControl extends React.Component<ValidationControl
     /**
      * 添加规则下拉框
      */
-    renderDropdown(): React.JSX.Element;
+    renderDropdown(): JSX.Element;
     /**
      * 规则列表
      */
-    renderValidaton(): React.JSX.Element;
-    renderValidateApiControl(): React.JSX.Element;
-    render(): React.JSX.Element;
+    renderValidaton(): JSX.Element;
+    renderValidateApiControl(): JSX.Element;
+    render(): JSX.Element;
 }
 export declare class ValidationControlRenderer extends ValidationControl {
 }

package/esm/renderer/ValidationControl.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.4.0
+ * amis-editor v5.5.0
  * Copyright 2018-2023 @fex
  */
 

package/esm/renderer/ValidationItem.d.ts

@@ -39,8 +39,8 @@ export default class ValidationItem extends React.Component<ValidationItemProps,
     handleEdit(value: any, action: any): void;
     handleDelete(): void;
     handleSwitch(checked: boolean): void;
-    renderActions(): React.JSX.Element | null;
-    renderInputControl(): React.JSX.Element | null;
-    render(): React.JSX.Element;
+    renderActions(): JSX.Element | null;
+    renderInputControl(): JSX.Element | null;
+    render(): JSX.Element;
 }
 export {};

package/esm/renderer/ValidationItem.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.4.0
+ * amis-editor v5.5.0
  * Copyright 2018-2023 @fex
  */
 

package/esm/renderer/event-control/action-config-dialog.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.4.0
+ * amis-editor v5.5.0
  * Copyright 2018-2023 @fex
  */
 

package/esm/renderer/event-control/action-config-panel.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.4.0
+ * amis-editor v5.5.0
  * Copyright 2018-2023 @fex
  */
 

package/esm/renderer/event-control/comp-action-select.d.ts

@@ -7,5 +7,5 @@ import React from 'react';
 export declare const BASE_ACTION_PROPS: string[];
 export default class CmptActionSelect extends React.Component<RendererProps> {
     onChange(option: Option): void;
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }

package/esm/renderer/event-control/comp-action-select.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.4.0
+ * amis-editor v5.5.0
  * Copyright 2018-2023 @fex
  */
 
@@ -16,8 +16,8 @@ var BASE_ACTION_PROPS = [
     '__actionDesc',
     'preventDefault',
     'stopPropagation',
-    'expression',
-    'outputVar'
+    'expression'
+    // 'outputVar'
 ];
 var CmptActionSelect = /** @class */ (function (_super) {
     __extends(CmptActionSelect, _super);

package/esm/renderer/event-control/helper.d.ts

@@ -1,5 +1,5 @@
 import { RendererPluginAction, RendererPluginEvent } from 'amis-editor-core';
-import { ActionConfig, ComponentInfo, ContextVariables } from './types';
+import { ActionConfig, ComponentInfo } from './types';
 import CmptActionSelect from './comp-action-select';
 export declare const getArgsWrapper: (items: any, multiple?: boolean, patch?: {}) => {
     items: any[];
@@ -116,10 +116,7 @@ export declare const getEventControlConfig: (manager: EditorManager, context: Ba
     allComponents: any;
     getContextSchemas: (id?: string, withoutSuper?: boolean) => Promise<any>;
     getComponents: (action: RendererPluginAction) => any;
-    actionConfigInitFormatter: (action: ActionConfig, variables: {
-        eventVariables: ContextVariables[];
-        rawVariables: ContextVariables[];
-    }) => Promise<{
+    actionConfigInitFormatter: (action: ActionConfig) => Promise<{
         actionType: any;
         args: any;
     }>;