amis-editor 5.2.0-beta.2 → 5.2.1-beta.15

package/esm/renderer/TransferTableControl.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.0-beta.2
+ * amis-editor v5.2.1-beta.15
  * Copyright 2018-2022 @fex
  */
 
@@ -13,17 +13,23 @@ import { i18n } from 'i18n-runtime';
 /**
  * @file Transfer的表格对应选项
  */
-
 function BaseOptionControl(Cmpt) {
-  return (
-    /** @class */
-    function (_super) {
+  return (/** @class */function (_super) {
       __extends(class_1, _super);
-
       function class_1(props) {
         var _this = _super.call(this, props) || this;
-
-        _this.internalProps = ['checked', 'editing'];
+        Object.defineProperty(_this, "$comp", {
+          enumerable: true,
+          configurable: true,
+          writable: true,
+          value: void 0
+        }); // 记录一下路径，不再从外部同步内部，只从内部同步外部
+        Object.defineProperty(_this, "internalProps", {
+          enumerable: true,
+          configurable: true,
+          writable: true,
+          value: ['checked', 'editing']
+        });
         _this.state = {
           api: props.data.source,
           labelField: props.data.labelField,
@@ -40,238 +46,259 @@ function BaseOptionControl(Cmpt) {
       /**
        * 更新options字段的统一出口
        */
-
-
-      class_1.prototype.onChange = function () {
-        var source = this.state.source;
-        var onBulkChange = this.props.onBulkChange;
-        var data = {
-          source: undefined,
-          options: undefined,
-          labelField: undefined,
-          valueField: undefined
-        };
-
-        if (source === 'api') {
-          var _a = this.state,
+      Object.defineProperty(class_1.prototype, "onChange", {
+        enumerable: false,
+        configurable: true,
+        writable: true,
+        value: function () {
+          var source = this.state.source;
+          var onBulkChange = this.props.onBulkChange;
+          var data = {
+            source: undefined,
+            options: undefined,
+            labelField: undefined,
+            valueField: undefined
+          };
+          if (source === 'api') {
+            var _a = this.state,
               api = _a.api,
               labelField = _a.labelField,
               valueField = _a.valueField;
-          data.source = api;
-          data.labelField = labelField;
-          data.valueField = valueField;
+            data.source = api;
+            data.labelField = labelField;
+            data.valueField = valueField;
+          }
+          onBulkChange && onBulkChange(data);
+          return;
         }
-
-        onBulkChange && onBulkChange(data);
-        return;
-      };
+      });
       /**
        * 切换选项类型
        */
-
-
-      class_1.prototype.handleSourceChange = function (source) {
-        this.setState({
-          source: source
-        }, this.onChange);
-      };
-
-      class_1.prototype.handleAPIChange = function (source) {
-        this.setState({
-          api: source
-        }, this.onChange);
-      };
-
-      class_1.prototype.handleLableFieldChange = function (labelField) {
-        this.setState({
-          labelField: labelField
-        }, this.onChange);
-      };
-
-      class_1.prototype.handleValueFieldChange = function (valueField) {
-        this.setState({
-          valueField: valueField
-        }, this.onChange);
-      };
-
-      class_1.prototype.buildBatchAddSchema = function () {
-        return {
-          type: 'action',
-          actionType: 'dialog',
-          label: i18n("22de6ef85ed60ec54dbdc1d8583e5104"),
-          dialog: {
-            title: i18n("421252e16c6cb544fe9ce0be94a190e0"),
-            headerClassName: 'font-bold',
-            closeOnEsc: true,
-            closeOnOutside: false,
-            showCloseButton: true,
-            body: [{
-              type: 'alert',
-              level: 'warning',
-              body: [{
-                type: 'tpl',
-                tpl: i18n("c130bd5b55edefdaf8923269e9a52439")
-              }],
-              showIcon: true,
-              className: 'mb-2.5'
-            }, {
-              type: 'form',
-              wrapWithPanel: false,
-              mode: 'normal',
-              wrapperComponent: 'div',
-              resetAfterSubmit: true,
-              autoFocus: true,
-              preventEnterSubmit: true,
-              horizontal: {
-                left: 0,
-                right: 12
-              },
+      Object.defineProperty(class_1.prototype, "handleSourceChange", {
+        enumerable: false,
+        configurable: true,
+        writable: true,
+        value: function (source) {
+          this.setState({
+            source: source
+          }, this.onChange);
+        }
+      });
+      Object.defineProperty(class_1.prototype, "handleAPIChange", {
+        enumerable: false,
+        configurable: true,
+        writable: true,
+        value: function (source) {
+          this.setState({
+            api: source
+          }, this.onChange);
+        }
+      });
+      Object.defineProperty(class_1.prototype, "handleLableFieldChange", {
+        enumerable: false,
+        configurable: true,
+        writable: true,
+        value: function (labelField) {
+          this.setState({
+            labelField: labelField
+          }, this.onChange);
+        }
+      });
+      Object.defineProperty(class_1.prototype, "handleValueFieldChange", {
+        enumerable: false,
+        configurable: true,
+        writable: true,
+        value: function (valueField) {
+          this.setState({
+            valueField: valueField
+          }, this.onChange);
+        }
+      });
+      Object.defineProperty(class_1.prototype, "buildBatchAddSchema", {
+        enumerable: false,
+        configurable: true,
+        writable: true,
+        value: function () {
+          return {
+            type: 'action',
+            actionType: 'dialog',
+            label: i18n("22de6ef85ed60ec54dbdc1d8583e5104"),
+            dialog: {
+              title: i18n("421252e16c6cb544fe9ce0be94a190e0"),
+              headerClassName: 'font-bold',
+              closeOnEsc: true,
+              closeOnOutside: false,
+              showCloseButton: true,
               body: [{
-                name: 'batchOption',
-                type: 'textarea',
-                label: '',
-                placeholder: i18n("1e2f96a69fbef8caa8823a3067ebbdc7"),
-                trimContents: true,
-                minRows: 10,
-                maxRows: 50,
-                required: true
+                type: 'alert',
+                level: 'warning',
+                body: [{
+                  type: 'tpl',
+                  tpl: i18n("c130bd5b55edefdaf8923269e9a52439")
+                }],
+                showIcon: true,
+                className: 'mb-2.5'
+              }, {
+                type: 'form',
+                wrapWithPanel: false,
+                mode: 'normal',
+                wrapperComponent: 'div',
+                resetAfterSubmit: true,
+                autoFocus: true,
+                preventEnterSubmit: true,
+                horizontal: {
+                  left: 0,
+                  right: 12
+                },
+                body: [{
+                  name: 'batchOption',
+                  type: 'textarea',
+                  label: '',
+                  placeholder: i18n("1e2f96a69fbef8caa8823a3067ebbdc7"),
+                  trimContents: true,
+                  minRows: 10,
+                  maxRows: 50,
+                  required: true
+                }]
               }]
-            }]
-          }
-        };
-      };
-
-      class_1.prototype.renderHeader = function () {
-        var _this = this;
-
-        var _a;
-
-        var _b = this.props,
+            }
+          };
+        }
+      });
+      Object.defineProperty(class_1.prototype, "renderHeader", {
+        enumerable: false,
+        configurable: true,
+        writable: true,
+        value: function () {
+          var _this = this;
+          var _a;
+          var _b = this.props,
             render = _b.render,
             label = _b.label,
             labelRemark = _b.labelRemark,
             useMobileUI = _b.useMobileUI,
             env = _b.env,
             popOverContainer = _b.popOverContainer;
-        var classPrefix = (_a = env === null || env === void 0 ? void 0 : env.theme) === null || _a === void 0 ? void 0 : _a.classPrefix;
-        var source = this.state.source;
-        var optionSourceList = [{
-          label: i18n("01820262aa9ad5b130f8f5b86bfd2968"),
-          value: 'custom'
-        }, {
-          label: i18n("c8158b3cad598b0b5939788ca4efb298"),
-          value: 'api'
-        }].map(function (item) {
-          return __assign(__assign({}, item), {
-            onClick: function () {
-              return _this.handleSourceChange(item.value);
-            }
+          var classPrefix = (_a = env === null || env === void 0 ? void 0 : env.theme) === null || _a === void 0 ? void 0 : _a.classPrefix;
+          var source = this.state.source;
+          var optionSourceList = [{
+            label: i18n("01820262aa9ad5b130f8f5b86bfd2968"),
+            value: 'custom'
+          }, {
+            label: i18n("c8158b3cad598b0b5939788ca4efb298"),
+            value: 'api'
+          }].map(function (item) {
+            return __assign(__assign({}, item), {
+              onClick: function () {
+                return _this.handleSourceChange(item.value);
+              }
+            });
           });
-        });
-        return React__default.createElement("header", {
-          className: "ae-OptionControl-header"
-        }, React__default.createElement("label", {
-          className: cx("".concat(classPrefix, "Form-label"))
-        }, label || '', labelRemark ? render('label-remark', {
-          type: 'remark',
-          icon: labelRemark.icon || 'warning-mark',
-          tooltip: labelRemark,
-          className: cx("Form-lableRemark", labelRemark === null || labelRemark === void 0 ? void 0 : labelRemark.className),
-          useMobileUI: useMobileUI,
-          container: popOverContainer ? popOverContainer : env && env.getModalContainer ? env.getModalContainer : undefined
-        }) : null), React__default.createElement("div", null, render('validation-control-addBtn', {
-          type: 'dropdown-button',
-          level: 'link',
-          size: 'sm',
-          label: '${selected}',
-          align: 'right',
-          closeOnClick: true,
-          closeOnOutside: true,
-          buttons: optionSourceList
-        }, {
-          popOverContainer: null,
-          data: {
-            selected: optionSourceList.find(function (item) {
-              return item.value === source;
-            }).label
-          }
-        })));
-      };
-
-      class_1.prototype.renderApiPanel = function () {
-        var render = this.props.render;
-        var _a = this.state,
+          return React__default.createElement("header", {
+            className: "ae-OptionControl-header"
+          }, React__default.createElement("label", {
+            className: cx("".concat(classPrefix, "Form-label"))
+          }, label || '', labelRemark ? render('label-remark', {
+            type: 'remark',
+            icon: labelRemark.icon || 'warning-mark',
+            tooltip: labelRemark,
+            className: cx("Form-lableRemark", labelRemark === null || labelRemark === void 0 ? void 0 : labelRemark.className),
+            useMobileUI: useMobileUI,
+            container: popOverContainer ? popOverContainer : env && env.getModalContainer ? env.getModalContainer : undefined
+          }) : null), React__default.createElement("div", null, render('validation-control-addBtn', {
+            type: 'dropdown-button',
+            level: 'link',
+            size: 'sm',
+            label: '${selected}',
+            align: 'right',
+            closeOnClick: true,
+            closeOnOutside: true,
+            buttons: optionSourceList
+          }, {
+            popOverContainer: null,
+            data: {
+              selected: optionSourceList.find(function (item) {
+                return item.value === source;
+              }).label
+            }
+          })));
+        }
+      });
+      Object.defineProperty(class_1.prototype, "renderApiPanel", {
+        enumerable: false,
+        configurable: true,
+        writable: true,
+        value: function () {
+          var render = this.props.render;
+          var _a = this.state,
             source = _a.source,
             api = _a.api,
             labelField = _a.labelField,
             valueField = _a.valueField;
-
-        if (source !== 'api') {
-          return null;
+          if (source !== 'api') {
+            return null;
+          }
+          return render('api', getSchemaTpl('apiControl', {
+            label: i18n("54ea89b497ec3bb319c68844dfa3687f"),
+            name: 'source',
+            className: 'ae-ExtendMore',
+            visibleOn: 'data.autoComplete !== false',
+            value: api,
+            onChange: this.handleAPIChange,
+            footer: [{
+              label: tipedLabel(i18n("7e9c83e86beb612377a94e6e8d1fc644"), i18n("26ff46d82166741297ce666b2792af85")),
+              type: 'input-text',
+              name: 'labelField',
+              value: labelField,
+              placeholder: i18n("6d4ce0631f37676a887c9599691fabec"),
+              onChange: this.handleLableFieldChange
+            }, {
+              label: i18n("2e01f5f5889e33d003bec7857cd38445"),
+              type: 'input-text',
+              name: 'valueField',
+              value: valueField,
+              placeholder: i18n("959c27193eb0a41d01f4b53dcc4b9245"),
+              onChange: this.handleValueFieldChange
+            }]
+          }));
         }
-
-        return render('api', getSchemaTpl('apiControl', {
-          label: i18n("54ea89b497ec3bb319c68844dfa3687f"),
-          name: 'source',
-          className: 'ae-ExtendMore',
-          visibleOn: 'data.autoComplete !== false',
-          value: api,
-          onChange: this.handleAPIChange,
-          footer: [{
-            label: tipedLabel(i18n("7e9c83e86beb612377a94e6e8d1fc644"), i18n("26ff46d82166741297ce666b2792af85")),
-            type: 'input-text',
-            name: 'labelField',
-            value: labelField,
-            placeholder: i18n("6d4ce0631f37676a887c9599691fabec"),
-            onChange: this.handleLableFieldChange
-          }, {
-            label: i18n("2e01f5f5889e33d003bec7857cd38445"),
-            type: 'input-text',
-            name: 'valueField',
-            value: valueField,
-            placeholder: i18n("959c27193eb0a41d01f4b53dcc4b9245"),
-            onChange: this.handleValueFieldChange
-          }]
-        }));
-      };
-
-      class_1.prototype.render = function () {
-        var _a;
-
-        var _b = this.state,
+      });
+      Object.defineProperty(class_1.prototype, "render", {
+        enumerable: false,
+        configurable: true,
+        writable: true,
+        value: function () {
+          var _a;
+          var _b = this.state,
             source = _b.source,
             api = _b.api,
             labelField = _b.labelField,
             valueField = _b.valueField;
-        var className = this.props.className;
-
-        var cmptProps = __assign(__assign({}, this.props), {
-          data: __assign({
-            api: api,
-            labelField: labelField,
-            valueField: valueField
-          }, (_a = this.props) === null || _a === void 0 ? void 0 : _a.data)
-        });
-
-        return React__default.createElement("div", {
-          className: cx('ae-OptionControl', className)
-        }, this.renderHeader(), source === 'custom' ? React__default.createElement(Cmpt, __assign({}, cmptProps)) : null, this.renderApiPanel());
-      };
-
+          var className = this.props.className;
+          var cmptProps = __assign(__assign({}, this.props), {
+            data: __assign({
+              api: api,
+              labelField: labelField,
+              valueField: valueField
+            }, (_a = this.props) === null || _a === void 0 ? void 0 : _a.data)
+          });
+          return React__default.createElement("div", {
+            className: cx('ae-OptionControl', className)
+          }, this.renderHeader(), source === 'custom' ? React__default.createElement(Cmpt, __assign({}, cmptProps)) : null, this.renderApiPanel());
+        }
+      });
       return class_1;
     }(React__default.Component)
   );
 }
-
 var renderInput = function (name, placeholder, required, unique) {
   if (required === void 0) {
     required = true;
   }
-
   if (unique === void 0) {
     unique = false;
   }
-
   return {
     type: 'input-text',
     name: name,
@@ -280,203 +307,201 @@ var renderInput = function (name, placeholder, required, unique) {
     unique: unique
   };
 };
-
-var TransferTableOption =
-/** @class */
-function (_super) {
+var TransferTableOption = /** @class */function (_super) {
   __extends(TransferTableOption, _super);
-
   function TransferTableOption() {
     return _super !== null && _super.apply(this, arguments) || this;
   }
-
-  TransferTableOption.prototype.addColumns = function () {
-    var _this = this;
-
-    var _a = this.props.data.columns,
+  Object.defineProperty(TransferTableOption.prototype, "addColumns", {
+    enumerable: false,
+    configurable: true,
+    writable: true,
+    value: function () {
+      var _this = this;
+      var _a = this.props.data.columns,
         columns = _a === void 0 ? [{
-      type: 'text'
-    }] : _a;
-    return {
-      type: 'action',
-      actionType: 'dialog',
-      label: i18n("f86418b525af4b573aed36b8e3f9aeb8"),
-      level: 'enhance',
-      dialog: {
-        title: i18n("ec159d98c6c25fadd38bcd9362f6a28e"),
-        headerClassName: 'font-bold',
-        closeOnEsc: true,
-        closeOnOutside: false,
-        showCloseButton: true,
-        onConfirm: function () {
-          var args = [];
-
-          for (var _i = 0; _i < arguments.length; _i++) {
-            args[_i] = arguments[_i];
-          }
-
-          return _this.handleChange(args[2].columns, 'columns');
-        },
-        body: [{
-          name: 'columns',
-          type: 'combo',
-          multiple: true,
-          label: false,
-          strictMode: false,
-          addButtonText: i18n("0c14e431f1b5ecd163f8fa010a0654c7"),
-          draggable: false,
-          value: columns,
-          items: [{
-            type: 'input-text',
-            name: 'label',
-            placeholder: i18n("32c65d8d7431e76029678ec7bb73a5ab")
-          }, {
-            type: 'input-text',
-            name: 'name',
-            placeholder: i18n("41a344642681efaaa418c228ba7fb45c")
-          }, {
-            type: 'select',
-            name: 'type',
-            placeholder: i18n("226b0912184333c81babf2f1894ec0c1"),
-            value: 'text',
-            options: [{
-              value: 'text',
-              label: i18n("ffb01e5bcf4c00447f5150d3cba81371")
-            }, {
-              value: 'tpl',
-              label: i18n("59cf15fe6b8d659c9bd2f86143534a06")
-            }, {
-              value: 'image',
-              label: i18n("20def7942674282277c3714ed7ea6ce0")
-            }, {
-              value: 'date',
-              label: i18n("4ff1e74e43a3586339251494117185ad")
-            }, {
-              value: 'progress',
-              label: i18n("c7bff79d059a0b7ff9b02441959d8be2")
-            }, {
-              value: 'status',
-              label: i18n("3fea7ca76cdece641436d7ab0d02ab1b")
-            }, {
-              value: 'mapping',
-              label: i18n("9da188491dd34c4382a5b9f006194e41")
-            }, {
-              value: 'operation',
-              label: i18n("8abc564260a1564521e0c3a1d5419b4a")
-            }]
-          }]
-        }]
-      }
-    };
-  };
-
-  TransferTableOption.prototype.addRows = function () {
-    var _this = this;
-
-    var _a = this.props.data,
-        _b = _a.columns,
-        columns = _b === void 0 ? [] : _b,
-        _c = _a.options,
-        options = _c === void 0 ? [{}] : _c;
-    return {
-      type: 'tooltip-wrapper',
-      tooltip: i18n("f302b37cf6530d3fb39234a220d95437"),
-      tooltipTheme: 'dark',
-      placement: 'top',
-      tooltipStyle: {
-        fontSize: '12px'
-      },
-      className: 'ae-formItemControl-label-tip',
-      body: [{
+          type: 'text'
+        }] : _a;
+      return {
         type: 'action',
         actionType: 'dialog',
-        label: i18n("6090f7af1ae15892abe97409b9e557b1"),
+        label: i18n("f86418b525af4b573aed36b8e3f9aeb8"),
         level: 'enhance',
-        disabled: columns && columns.length === 0,
-        block: true,
         dialog: {
-          title: i18n("e6a10b831ae920bba1bb89a725e0fbe8"),
+          title: i18n("ec159d98c6c25fadd38bcd9362f6a28e"),
           headerClassName: 'font-bold',
           closeOnEsc: true,
           closeOnOutside: false,
           showCloseButton: true,
-          size: columns.length >= 6 ? 'md' : '',
           onConfirm: function () {
             var args = [];
-
             for (var _i = 0; _i < arguments.length; _i++) {
               args[_i] = arguments[_i];
             }
-
-            return _this.handleChange(args[2].options, 'options');
+            return _this.handleChange(args[2].columns, 'columns');
           },
           body: [{
-            type: 'form',
-            wrapWithPanel: false,
-            mode: 'normal',
-            body: [{
-              name: 'options',
-              type: 'combo',
-              multiple: true,
-              draggable: true,
-              addButtonText: i18n("66ab5e9f24c8f46012a25c89919fb191"),
-              value: options,
-              items: __spreadArray(__spreadArray([], columns.map(function (item) {
-                var _a;
-
-                return renderInput(item.name, (_a = item.label) !== null && _a !== void 0 ? _a : '', false);
-              }), true), [renderInput('value', i18n("fe7509e0ed085b86f07e3e9975cc5b3d"), true, true)], false)
+            name: 'columns',
+            type: 'combo',
+            multiple: true,
+            label: false,
+            strictMode: false,
+            addButtonText: i18n("0c14e431f1b5ecd163f8fa010a0654c7"),
+            draggable: false,
+            value: columns,
+            items: [{
+              type: 'input-text',
+              name: 'label',
+              placeholder: i18n("32c65d8d7431e76029678ec7bb73a5ab")
+            }, {
+              type: 'input-text',
+              name: 'name',
+              placeholder: i18n("41a344642681efaaa418c228ba7fb45c")
+            }, {
+              type: 'select',
+              name: 'type',
+              placeholder: i18n("226b0912184333c81babf2f1894ec0c1"),
+              value: 'text',
+              options: [{
+                value: 'text',
+                label: i18n("ffb01e5bcf4c00447f5150d3cba81371")
+              }, {
+                value: 'tpl',
+                label: i18n("59cf15fe6b8d659c9bd2f86143534a06")
+              }, {
+                value: 'image',
+                label: i18n("20def7942674282277c3714ed7ea6ce0")
+              }, {
+                value: 'date',
+                label: i18n("4ff1e74e43a3586339251494117185ad")
+              }, {
+                value: 'progress',
+                label: i18n("c7bff79d059a0b7ff9b02441959d8be2")
+              }, {
+                value: 'status',
+                label: i18n("3fea7ca76cdece641436d7ab0d02ab1b")
+              }, {
+                value: 'mapping',
+                label: i18n("9da188491dd34c4382a5b9f006194e41")
+              }, {
+                value: 'operation',
+                label: i18n("8abc564260a1564521e0c3a1d5419b4a")
+              }]
             }]
           }]
         }
-      }]
-    };
-  };
-
-  TransferTableOption.prototype.handleChange = function (value, type) {
-    var data = this.props.data;
-    var _a = this.props,
-        onBulkChange = _a.onBulkChange,
-        onValueChange = _a.onValueChange;
-    data[type] = value;
-
-    if (type === 'columns') {
-      var keys_1 = value.map(function (item) {
-        return item.name;
-      });
-      data.options = data.options.map(function (item) {
-        return __assign({}, keys_1.reduce(function (pv, cv) {
-          pv[cv] = item[cv];
-          return pv;
-        }, {
-          value: item.value
-        }));
-      });
+      };
     }
-
-    onValueChange && onValueChange(type, data, onBulkChange);
-  };
-
-  TransferTableOption.prototype.render = function () {
-    return React__default.createElement("div", {
-      className: "ae-OptionControl-footer"
-    }, render(this.addColumns()), render(this.addRows()));
-  };
-
+  });
+  Object.defineProperty(TransferTableOption.prototype, "addRows", {
+    enumerable: false,
+    configurable: true,
+    writable: true,
+    value: function () {
+      var _this = this;
+      var _a = this.props.data,
+        _b = _a.columns,
+        columns = _b === void 0 ? [] : _b,
+        _c = _a.options,
+        options = _c === void 0 ? [{}] : _c;
+      return {
+        type: 'tooltip-wrapper',
+        tooltip: i18n("f302b37cf6530d3fb39234a220d95437"),
+        tooltipTheme: 'dark',
+        placement: 'top',
+        tooltipStyle: {
+          fontSize: '12px'
+        },
+        className: 'ae-formItemControl-label-tip',
+        body: [{
+          type: 'action',
+          actionType: 'dialog',
+          label: i18n("6090f7af1ae15892abe97409b9e557b1"),
+          level: 'enhance',
+          disabled: columns && columns.length === 0,
+          block: true,
+          dialog: {
+            title: i18n("e6a10b831ae920bba1bb89a725e0fbe8"),
+            headerClassName: 'font-bold',
+            closeOnEsc: true,
+            closeOnOutside: false,
+            showCloseButton: true,
+            size: columns.length >= 6 ? 'md' : '',
+            onConfirm: function () {
+              var args = [];
+              for (var _i = 0; _i < arguments.length; _i++) {
+                args[_i] = arguments[_i];
+              }
+              return _this.handleChange(args[2].options, 'options');
+            },
+            body: [{
+              type: 'form',
+              wrapWithPanel: false,
+              mode: 'normal',
+              body: [{
+                name: 'options',
+                type: 'combo',
+                multiple: true,
+                draggable: true,
+                addButtonText: i18n("66ab5e9f24c8f46012a25c89919fb191"),
+                value: options,
+                items: __spreadArray(__spreadArray([], columns.map(function (item) {
+                  var _a;
+                  return renderInput(item.name, (_a = item.label) !== null && _a !== void 0 ? _a : '', false);
+                }), true), [renderInput('value', i18n("fe7509e0ed085b86f07e3e9975cc5b3d"), true, true)], false)
+              }]
+            }]
+          }
+        }]
+      };
+    }
+  });
+  Object.defineProperty(TransferTableOption.prototype, "handleChange", {
+    enumerable: false,
+    configurable: true,
+    writable: true,
+    value: function (value, type) {
+      var _a;
+      var data = this.props.data;
+      var _b = this.props,
+        onBulkChange = _b.onBulkChange,
+        onValueChange = _b.onValueChange;
+      data[type] = value;
+      if (type === 'columns') {
+        var keys_1 = value.map(function (item) {
+          return item.name;
+        });
+        data.options = ((_a = data.options) !== null && _a !== void 0 ? _a : []).map(function (item) {
+          return __assign({}, keys_1.reduce(function (pv, cv) {
+            pv[cv] = item[cv];
+            return pv;
+          }, {
+            value: item.value
+          }));
+        });
+      }
+      onValueChange && onValueChange(type, data, onBulkChange);
+    }
+  });
+  Object.defineProperty(TransferTableOption.prototype, "render", {
+    enumerable: false,
+    configurable: true,
+    writable: true,
+    value: function () {
+      return React__default.createElement("div", {
+        className: "ae-OptionControl-footer"
+      }, render(this.addColumns()), render(this.addRows()));
+    }
+  });
   __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", [Array, String]), __metadata("design:returntype", void 0)], TransferTableOption.prototype, "handleChange", null);
-
   return TransferTableOption;
 }(React__default.Component);
 var TransferTableControl = BaseOptionControl(TransferTableOption);
-
-/** @class */
-(function (_super) {
+/** @class */(function (_super) {
   __extends(TransferTableControlRenderer, _super);
-
   function TransferTableControlRenderer() {
     return _super !== null && _super.apply(this, arguments) || this;
   }
-
   TransferTableControlRenderer = __decorate([FormItem({
     type: 'ae-transferTableControl',
     renderLabel: false