amis-editor 5.2.5-beta.7 → 5.3.0

package/esm/renderer/SwitchMoreControl.d.ts

@@ -5,9 +5,9 @@
  */
 import React from 'react';
 import type { Action } from 'amis';
-import type { SchemaCollection } from 'amis/lib/Schema';
+import type { SchemaCollection } from 'amis';
 import type { IScopedContext } from 'amis-core';
-import type { FormSchema } from 'amis/lib/schema';
+import type { FormSchema } from 'amis';
 import type { FormControlProps } from 'amis-core';
 export interface SwitchMoreProps extends FormControlProps {
     className?: string;
@@ -17,7 +17,7 @@ export interface SwitchMoreProps extends FormControlProps {
     rootClose?: boolean;
     autoFocus?: boolean;
     overlay?: boolean;
-    container?: HTMLElement | (() => HTMLElement) | Function;
+    container?: HTMLElement | (() => HTMLElement);
     target?: React.ReactNode | Function;
     trueValue?: any;
     falseValue?: any;
@@ -66,147 +66,40 @@ export default class SwitchMore extends React.Component<SwitchMoreProps, SwitchM
         itemClassName: string;
         icon: string;
         form: {
-            name?: string | undefined;
-            tabs?: any;
-            data: any;
-            horizontal: import("packages/amis-core/lib").FormHorizontal;
-            labelAlign?: import("packages/amis-core/lib/renderers/Item").LabelAlign | undefined;
-            body?: SchemaCollection | undefined;
-            title: any;
-            primaryField?: string | undefined;
-            messages?: {
-                validateFailed?: string | undefined;
-            } | undefined;
-            reload?: string | undefined;
-            actions?: import("packages/amis/lib/renderers/Action").ActionSchema[] | undefined;
-            fieldSet?: any;
-            mode: string;
-            static?: boolean | undefined;
-            staticOn?: string | undefined;
-            submitText?: string | undefined;
-            api?: string | import("packages/amis-core/lib").BaseApiObject | undefined;
-            target?: string | undefined;
-            feedback?: any;
-            staticClassName?: import("packages/amis-core/lib").SchemaClassName | undefined;
-            initFetch?: boolean | undefined;
-            interval?: number | undefined;
-            silentPolling?: boolean | undefined;
-            stopAutoRefreshWhen?: string | undefined;
-            initApi?: string | import("packages/amis-core/lib").BaseApiObject | undefined;
-            initFetchOn?: string | undefined;
-            redirect?: string | undefined;
-            affixFooter?: boolean | undefined;
-            debug?: boolean | undefined;
-            debugConfig?: {
-                levelExpand?: number | undefined;
-                enableClipboard?: boolean | undefined;
-                iconStyle?: "circle" | "square" | "triangle" | undefined;
-                quotesOnKeys?: boolean | undefined;
-                sortKeys?: boolean | undefined;
-                ellipsisThreshold?: number | false | undefined;
-            } | undefined;
-            initAsyncApi?: string | import("packages/amis-core/lib").BaseApiObject | undefined;
-            initFinishedField?: string | undefined;
-            initCheckInterval?: number | undefined;
-            persistData?: string | undefined;
-            persistDataKeys?: string[] | undefined;
-            clearPersistDataAfterSubmit?: boolean | undefined;
-            asyncApi?: string | import("packages/amis-core/lib").BaseApiObject | undefined;
-            checkInterval?: number | undefined;
-            finishedField?: string | undefined;
-            resetAfterSubmit?: boolean | undefined;
-            clearAfterSubmit?: boolean | undefined;
-            columnCount?: number | undefined;
-            autoFocus: boolean | undefined;
-            panelClassName: import("packages/amis-core/lib").ClassName;
-            submitOnChange: boolean;
-            submitOnInit?: boolean | undefined;
-            wrapWithPanel: boolean;
-            promptPageLeave?: boolean | undefined;
-            promptPageLeaveMessage?: string | undefined;
-            rules?: {
-                rule: string;
-                message: string;
-                name?: string | string[] | undefined;
-            }[] | undefined;
-            preventEnterSubmit: boolean;
-            labelWidth?: string | number | undefined;
             type: string;
+            wrapWithPanel: boolean;
+            panelClassName: string;
             actionsClassName: string;
             wrapperComponent: string;
+            mode: string;
+            horizontal: {
+                justify: boolean;
+                left: number;
+            };
+            autoFocus: boolean | undefined;
             formLazyChange: boolean;
+            preventEnterSubmit: boolean;
+            submitOnChange: boolean;
+            data: any;
+            title: any;
         };
     };
     renderForm(): {
-        name?: string | undefined;
-        tabs?: any;
-        data: any;
-        horizontal: import("packages/amis-core/lib").FormHorizontal;
-        labelAlign?: import("packages/amis-core/lib/renderers/Item").LabelAlign | undefined;
-        body?: SchemaCollection | undefined;
-        title?: string | undefined;
-        primaryField?: string | undefined;
-        messages?: {
-            validateFailed?: string | undefined;
-        } | undefined;
-        reload?: string | undefined;
-        actions?: import("packages/amis/lib/renderers/Action").ActionSchema[] | undefined;
-        fieldSet?: any;
-        mode: string;
-        static?: boolean | undefined;
-        staticOn?: string | undefined;
-        submitText?: string | undefined;
-        api?: string | import("packages/amis-core/lib").BaseApiObject | undefined;
-        target?: string | undefined;
-        feedback?: any;
-        staticClassName?: import("packages/amis-core/lib").SchemaClassName | undefined;
-        initFetch?: boolean | undefined;
-        interval?: number | undefined;
-        silentPolling?: boolean | undefined;
-        stopAutoRefreshWhen?: string | undefined;
-        initApi?: string | import("packages/amis-core/lib").BaseApiObject | undefined;
-        initFetchOn?: string | undefined;
-        redirect?: string | undefined;
-        affixFooter?: boolean | undefined;
-        debug?: boolean | undefined;
-        debugConfig?: {
-            levelExpand?: number | undefined;
-            enableClipboard?: boolean | undefined;
-            iconStyle?: "circle" | "square" | "triangle" | undefined;
-            quotesOnKeys?: boolean | undefined;
-            sortKeys?: boolean | undefined;
-            ellipsisThreshold?: number | false | undefined;
-        } | undefined;
-        initAsyncApi?: string | import("packages/amis-core/lib").BaseApiObject | undefined;
-        initFinishedField?: string | undefined;
-        initCheckInterval?: number | undefined;
-        persistData?: string | undefined;
-        persistDataKeys?: string[] | undefined;
-        clearPersistDataAfterSubmit?: boolean | undefined;
-        asyncApi?: string | import("packages/amis-core/lib").BaseApiObject | undefined;
-        checkInterval?: number | undefined;
-        finishedField?: string | undefined;
-        resetAfterSubmit?: boolean | undefined;
-        clearAfterSubmit?: boolean | undefined;
-        columnCount?: number | undefined;
-        autoFocus: boolean | undefined;
-        panelClassName: import("packages/amis-core/lib").ClassName;
-        submitOnChange: boolean;
-        submitOnInit?: boolean | undefined;
-        wrapWithPanel: boolean;
-        promptPageLeave?: boolean | undefined;
-        promptPageLeaveMessage?: string | undefined;
-        rules?: {
-            rule: string;
-            message: string;
-            name?: string | string[] | undefined;
-        }[] | undefined;
-        preventEnterSubmit: boolean;
-        labelWidth?: string | number | undefined;
         type: string;
+        wrapWithPanel: boolean;
+        panelClassName: string;
         actionsClassName: string;
         wrapperComponent: string;
+        mode: string;
+        horizontal: {
+            justify: boolean;
+            left: number;
+        };
+        autoFocus: boolean | undefined;
         formLazyChange: boolean;
+        preventEnterSubmit: boolean;
+        submitOnChange: boolean;
+        data: any;
     };
     renderMoreSection(): JSX.Element | null;
     render(): JSX.Element | null;

package/esm/renderer/SwitchMoreControl.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.5-alpha.12
+ * amis-editor v5.3.0
  * Copyright 2018-2023 @fex
  */
 

package/esm/renderer/TimelineItemControl.d.ts

@@ -4,7 +4,7 @@
 import React from 'react';
 import Sortable from 'sortablejs';
 import type { FormControlProps } from 'amis-core';
-import { SchemaApi } from 'amis/lib/Schema';
+import type { SchemaApi } from 'amis';
 type TimelineItem = {
     title: string;
     time: string;

package/esm/renderer/TimelineItemControl.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.5-alpha.12
+ * amis-editor v5.3.0
  * Copyright 2018-2023 @fex
  */
 

package/esm/renderer/TplFormulaControl.d.ts

@@ -0,0 +1,75 @@
+/**
+ * @file 长文本公式输入框
+ */
+import React from 'react';
+import type { VariableItem, CodeMirror } from 'amis-ui';
+import { FormControlProps } from 'amis-core';
+import { FormulaPlugin } from './textarea-formula/plugin';
+import { CustomFormulaPickerProps } from './textarea-formula/FormulaPicker';
+export interface TplFormulaControlProps extends FormControlProps {
+    /**
+     * 用于提示的变量集合，默认为空
+     */
+    variables?: Array<VariableItem> | Function;
+    /**
+     * 配合 variables 使用
+     * 当 props.variables 存在时， 是否再从 amis数据域中取变量集合，默认 false;
+     */
+    requiredDataPropsVariables?: boolean;
+    /**
+     * 变量展现模式，可选值：'tabs' ｜ 'tree'
+     */
+    variableMode?: 'tree' | 'tabs';
+    /**
+     * 自定义fx面板
+     */
+    customFormulaPicker?: React.FC<CustomFormulaPickerProps>;
+    /**
+     * 是否可清除
+     */
+    clearable?: boolean;
+    /**
+     * 弹窗顶部标题，默认为 "表达式"
+     */
+    header: string;
+}
+interface TplFormulaControlState {
+    value: string;
+    variables: Array<VariableItem>;
+    formulaPickerOpen: boolean;
+    formulaPickerValue: string;
+    expressionBrace?: Array<CodeMirror.Position>;
+    tooltipStyle: {
+        [key: string]: string;
+    };
+}
+export declare class TplFormulaControl extends React.Component<TplFormulaControlProps, TplFormulaControlState> {
+    static defaultProps: Partial<TplFormulaControlProps>;
+    wrapRef: React.RefObject<HTMLDivElement>;
+    tooltipRef: React.RefObject<HTMLDivElement>;
+    editorPlugin: FormulaPlugin;
+    unReaction: any;
+    appLocale: string;
+    appCorpusData: any;
+    constructor(props: TplFormulaControlProps);
+    componentDidMount(): Promise<void>;
+    componentDidUpdate(prevProps: TplFormulaControlProps): Promise<void>;
+    componentWillUnmount(): void;
+    onExpressionClick(expression: string, brace?: Array<CodeMirror.Position>): void;
+    onExpressionMouseEnter(e: MouseEvent, expression: string, brace?: Array<CodeMirror.Position>): void;
+    hiddenToolTip(): void;
+    handleKeyDown(e: any): void;
+    closeFormulaPicker(): void;
+    handleConfirm(value: any): void;
+    handleOnChange(value: any): void;
+    checkOpenFormulaPicker(value: string): void;
+    handleClear(): void;
+    handleFormulaClick(): void;
+    editorFactory(dom: HTMLElement, cm: any): any;
+    handleEditorMounted(cm: any, editor: any): void;
+    editorAutoMark(): void;
+    render(): JSX.Element;
+}
+export default class TplFormulaControlRenderer extends TplFormulaControl {
+}
+export {};

package/esm/renderer/TplFormulaControl.js

@@ -0,0 +1,391 @@
+/**
+ * amis-editor v5.3.0
+ * Copyright 2018-2023 @fex
+ */
+
+import { __extends, __awaiter, __generator, __assign, __rest, __decorate, __metadata } from 'tslib';
+import React__default from 'react';
+import cx from 'classnames';
+import { reaction } from 'mobx';
+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 { i18n } from 'i18n-runtime';
+
+/**
+ * @file 长文本公式输入框
+ */
+var preInputLocation = {
+  start: 0,
+  end: 0
+};
+var TplFormulaControl = /** @class */function (_super) {
+  __extends(TplFormulaControl, _super);
+  function TplFormulaControl(props) {
+    var _this = _super.call(this, props) || this;
+    _this.wrapRef = React__default.createRef();
+    _this.tooltipRef = React__default.createRef();
+    _this.state = {
+      value: '',
+      variables: [],
+      formulaPickerOpen: false,
+      formulaPickerValue: '',
+      tooltipStyle: {
+        display: 'none'
+      }
+    };
+    return _this;
+  }
+  TplFormulaControl.prototype.componentDidMount = function () {
+    return __awaiter(this, void 0, void 0, function () {
+      var editorStore, variablesArr;
+      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*/];
+                  }
+                });
+              });
+            });
+
+            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*/];
+        }
+      });
+    });
+  };
+
+  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*/];
+        }
+      });
+    });
+  };
+
+  TplFormulaControl.prototype.componentWillUnmount = function () {
+    var _a, _b;
+    if (this.tooltipRef.current) {
+      this.tooltipRef.current.removeEventListener('mouseleave', this.hiddenToolTip);
+    }
+    if (this.wrapRef.current) {
+      this.wrapRef.current.removeEventListener('keydown', this.handleKeyDown);
+    }
+    (_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();
+    var expressionRect = e.target.getBoundingClientRect();
+    if (!wrapperRect) {
+      return;
+    }
+    var left = expressionRect.left - wrapperRect.left;
+    this.setState({
+      tooltipStyle: {
+        left: "".concat(left, "px"),
+        width: "".concat(expressionRect.width, "px")
+      },
+      formulaPickerValue: expression,
+      expressionBrace: brace
+    });
+  };
+  TplFormulaControl.prototype.hiddenToolTip = function () {
+    this.setState({
+      tooltipStyle: {
+        display: 'none'
+      }
+    });
+  };
+  TplFormulaControl.prototype.handleKeyDown = function (e) {
+    // 组件禁止回车折行，否则会导致内容超过一行
+    if (e.key === 'Enter') {
+      e.stopPropagation();
+      e.preventDefault();
+    }
+  };
+  TplFormulaControl.prototype.closeFormulaPicker = function () {
+    this.setState({
+      formulaPickerOpen: false
+    });
+  };
+  TplFormulaControl.prototype.handleConfirm = function (value) {
+    var _a;
+    var expressionBrace = this.state.expressionBrace;
+    // 去除可能包裹的最外层的${}
+    value = value.replace(/^\$\{(.*)\}$/, function (match, p1) {
+      return p1;
+    });
+    value = value ? "${".concat(value, "}") : value;
+    value = value.replace(/\r\n|\r|\n/g, ' ');
+    (_a = this.editorPlugin) === null || _a === void 0 ? void 0 : _a.insertContent(value, 'expression', expressionBrace);
+    this.setState({
+      formulaPickerOpen: false,
+      expressionBrace: undefined
+    });
+  };
+  TplFormulaControl.prototype.handleOnChange = function (value) {
+    var _a, _b;
+    this.checkOpenFormulaPicker(value);
+    (_b = (_a = this.props).onChange) === null || _b === void 0 ? void 0 : _b.call(_a, value);
+  };
+  // 检测用户输入'${}'自动打开表达式弹窗
+  TplFormulaControl.prototype.checkOpenFormulaPicker = function (value) {
+    var _a;
+    var preLength = ((_a = this.props.value) === null || _a === void 0 ? void 0 : _a.length) || 0;
+    // 删除了文本，无需检测
+    if (value.length < preLength || value === this.props.value) {
+      return;
+    }
+    var left = 0;
+    var right = 0;
+    var length = value.length;
+    while (left < preLength && value.charAt(left) === this.props.value.charAt(left)) {
+      left++;
+    }
+    while (right < preLength && value.charAt(length - 1 - right) === this.props.value.charAt(preLength - 1 - right)) {
+      right++;
+    }
+    if ((preInputLocation === null || preInputLocation === void 0 ? void 0 : preInputLocation.end) !== left) {
+      preInputLocation = null;
+    }
+    var start = preInputLocation ? preInputLocation.start : left;
+    var end = left === length - right ? left + 1 : length - right;
+    var inputText = value.substring(start, end);
+    if (/\$|\{|\}$/.test(inputText)) {
+      if (/\$\{\}/.test(inputText)) {
+        var newValue = value.slice(0, start) + inputText.replace('${}', '') + value.slice(end);
+        this.props.onChange(newValue);
+        var corsur = this.editorPlugin.getCorsur();
+        this.setState({
+          formulaPickerOpen: true,
+          formulaPickerValue: '',
+          expressionBrace: [{
+            line: corsur === null || corsur === void 0 ? void 0 : corsur.line,
+            ch: end - 3
+          }, {
+            line: corsur === null || corsur === void 0 ? void 0 : corsur.line,
+            ch: end
+          }]
+        });
+        preInputLocation = null;
+      } else {
+        preInputLocation = __assign(__assign({
+          start: left
+        }, preInputLocation), {
+          end: end
+        });
+      }
+    } else {
+      preInputLocation = null;
+    }
+  };
+  TplFormulaControl.prototype.handleClear = function () {
+    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.editorFactory = function (dom, cm) {
+    return editorFactory(dom, cm, this.props.value, {
+      lineWrapping: false,
+      cursorHeight: 0.85
+    });
+  };
+  TplFormulaControl.prototype.handleEditorMounted = function (cm, editor) {
+    var _this = this;
+    var variables = this.props.variables || this.state.variables;
+    this.editorPlugin = new FormulaPlugin(editor, {
+      getProps: function () {
+        return __assign(__assign({}, _this.props), {
+          variables: variables
+        });
+      },
+      onExpressionClick: this.onExpressionClick,
+      onExpressionMouseEnter: this.onExpressionMouseEnter,
+      showPopover: false,
+      showClearIcon: true
+    });
+  };
+  TplFormulaControl.prototype.editorAutoMark = function () {
+    var _a;
+    (_a = this.editorPlugin) === null || _a === void 0 ? void 0 : _a.autoMark();
+  };
+  TplFormulaControl.prototype.render = function () {
+    var _this = this;
+    var _a = this.props,
+      className = _a.className,
+      header = _a.header;
+      _a.label;
+      var placeholder = _a.placeholder,
+      customFormulaPicker = _a.customFormulaPicker,
+      clearable = _a.clearable,
+      rest = __rest(_a, ["className", "header", "label", "placeholder", "customFormulaPicker", "clearable"]);
+    var _b = this.state,
+      formulaPickerOpen = _b.formulaPickerOpen,
+      formulaPickerValue = _b.formulaPickerValue,
+      variables = _b.variables,
+      tooltipStyle = _b.tooltipStyle;
+    var FormulaPickerCmp = customFormulaPicker !== null && customFormulaPicker !== void 0 ? customFormulaPicker : FormulaPicker;
+    var highlightValue = FormulaEditor.highlightValue(formulaPickerValue, variables) || {
+      html: formulaPickerValue
+    };
+    return React__default.createElement("div", {
+      className: cx('ae-TplFormulaControl', className, {
+        clearable: clearable
+      }),
+      ref: this.wrapRef
+    }, React__default.createElement("div", {
+      className: cx('ae-TplResultBox')
+    }, React__default.createElement(CodeMirrorEditor, {
+      className: "ae-TplResultBox-editor",
+      value: this.props.value,
+      onChange: this.handleOnChange,
+      editorFactory: this.editorFactory,
+      editorDidMount: this.handleEditorMounted,
+      onBlur: this.editorAutoMark
+    }), !this.props.value && React__default.createElement("div", {
+      className: "ae-TplFormulaControl-placeholder"
+    }, placeholder), clearable && this.props.value && React__default.createElement(Icon, {
+      icon: "input-clear",
+      className: "input-clear-icon",
+      iconContent: "InputText-clear",
+      onClick: this.handleClear
+    })), React__default.createElement(Button, {
+      className: "ae-TplFormulaControl-button",
+      size: "sm",
+      tooltip: {
+        enterable: false,
+        content: i18n("303efd5ba79e639001b4328cd266dddc"),
+        tooltipTheme: 'dark',
+        placement: 'left',
+        mouseLeaveDelay: 0
+      },
+      onClick: this.handleFormulaClick
+    }, React__default.createElement(Icon, {
+      icon: "input-add-fx",
+      className: cx('ae-TplFormulaControl-icon', 'icon')
+    })), React__default.createElement(TooltipWrapper, {
+      trigger: "hover",
+      placement: "top",
+      style: {
+        fontSize: '12px'
+      },
+      tooltip: {
+        tooltipTheme: 'dark',
+        children: function () {
+          return renderFormulaValue(highlightValue);
+        }
+      }
+    }, React__default.createElement("div", {
+      className: "ae-TplFormulaControl-tooltip",
+      style: tooltipStyle,
+      ref: this.tooltipRef,
+      onClick: function () {
+        _this.setState({
+          formulaPickerOpen: true
+        });
+      }
+    })), formulaPickerOpen ? React__default.createElement(FormulaPickerCmp, __assign({}, this.props, {
+      value: formulaPickerValue,
+      initable: true,
+      header: header,
+      variables: variables,
+      variableMode: rest.variableMode,
+      evalMode: true,
+      onClose: this.closeFormulaPicker,
+      onConfirm: this.handleConfirm
+    })) : null);
+  };
+  TplFormulaControl.defaultProps = {
+    variableMode: 'tabs',
+    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);
+  __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", []), __metadata("design:returntype", void 0)], TplFormulaControl.prototype, "closeFormulaPicker", null);
+  __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", [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);
+  return TplFormulaControl;
+}(React__default.Component);
+/** @class */(function (_super) {
+  __extends(TplFormulaControlRenderer, _super);
+  function TplFormulaControlRenderer() {
+    return _super !== null && _super.apply(this, arguments) || this;
+  }
+  TplFormulaControlRenderer = __decorate([FormItem({
+    type: 'ae-tplFormulaControl'
+  })], TplFormulaControlRenderer);
+  return TplFormulaControlRenderer;
+})(TplFormulaControl);
+
+export { TplFormulaControl };