amis-editor 5.2.0 → 5.2.1-beta.19

package/esm/renderer/DataBindingControl.js

@@ -0,0 +1,285 @@
+/**
+ * amis-editor v5.2.1-beta.19
+ * Copyright 2018-2022 @fex
+ */
+
+import { __extends, __awaiter, __generator, __decorate, __metadata } from 'tslib';
+import { PickerContainer, Spinner, InputBox, Icon, FormItem, SearchBox, CollapseGroup, Collapse } from 'amis';
+import { generateIcon, Renderer } from 'amis-core';
+import { debounce } from 'lodash';
+import React__default from 'react';
+import { autobind, DSField } from 'amis-editor-core';
+import { matchSorter } from 'match-sorter';
+import cx from 'classnames';
+import { i18n } from 'i18n-runtime';
+
+var DataBindingControl = /** @class */function (_super) {
+  __extends(DataBindingControl, _super);
+  function DataBindingControl(props) {
+    var _this = _super.call(this, props) || this;
+    _this.state = {
+      loading: false,
+      hint: undefined
+    };
+    return _this;
+  }
+  Object.defineProperty(DataBindingControl.prototype, "handleConfirm", {
+    enumerable: false,
+    configurable: true,
+    writable: true,
+    value: function (result) {
+      var _a, _b;
+      var _c = this.props,
+        manager = _c.manager,
+        data = _c.data,
+        onChange = _c.onChange,
+        onBulkChange = _c.onBulkChange,
+        onBindingChange = _c.onBindingChange;
+      if (result === null || result === void 0 ? void 0 : result.value) {
+        onChange(result.value);
+        onBulkChange && (onBindingChange === null || onBindingChange === void 0 ? void 0 : onBindingChange(result, onBulkChange));
+        (_b = (_a = manager.config) === null || _a === void 0 ? void 0 : _a.dataBindingChange) === null || _b === void 0 ? void 0 : _b.call(_a, result.value, data, manager);
+      }
+    }
+  });
+  Object.defineProperty(DataBindingControl.prototype, "handlePickerOpen", {
+    enumerable: false,
+    configurable: true,
+    writable: true,
+    value: function () {
+      return __awaiter(this, void 0, void 0, function () {
+        var _a, manager, node, schema;
+        return __generator(this, function (_b) {
+          switch (_b.label) {
+            case 0:
+              _a = this.props, manager = _a.manager, node = _a.node;
+              this.setState({
+                loading: true,
+                schema: undefined
+              });
+              _b.label = 1;
+            case 1:
+              _b.trys.push([1, 3,, 4]);
+              return [4 /*yield*/, manager.getAvailableContextFields(node)];
+            case 2:
+              schema = _b.sent();
+              return [3 /*break*/, 4];
+            case 3:
+              _b.sent();
+              this.setState({
+                loading: false,
+                hint: i18n("005c50d1af6e833d6991ab882653b7ae")
+              });
+              return [2 /*return*/];
+            case 4:
+              this.setState({
+                loading: false,
+                hint: schema ? undefined : i18n("76f47297fe988267a26073a9aaf7911f"),
+                schema: schema !== null && schema !== void 0 ? schema : undefined
+              });
+              return [2 /*return*/];
+          }
+        });
+      });
+    }
+  });
+
+  Object.defineProperty(DataBindingControl.prototype, "render", {
+    enumerable: false,
+    configurable: true,
+    writable: true,
+    value: function () {
+      var _this = this;
+      var _a = this.props,
+        className = _a.className;
+        _a.classnames;
+        var result = _a.value,
+        onChange = _a.onChange;
+        _a.multiple;
+        var disabled = _a.disabled,
+        render = _a.render;
+      var _b = this.state,
+        schema = _b.schema,
+        loading = _b.loading,
+        hint = _b.hint;
+      return React__default.createElement(PickerContainer, {
+        onPickerOpen: this.handlePickerOpen,
+        className: className,
+        title: "\u7ED1\u5B9A\u5B57\u6BB5",
+        bodyRender: function (_a) {
+          var value = _a.value,
+            isOpened = _a.isOpened,
+            onChange = _a.onChange;
+          if (!isOpened) {
+            return null;
+          }
+          if (loading) {
+            return React__default.createElement(Spinner, {
+              show: true,
+              icon: "reload",
+              spinnerClassName: "ae-DataBindingList-spinner"
+            });
+          }
+          if (hint) {
+            return React__default.createElement("p", {
+              className: "ae-DataBindingList-hint"
+            }, hint);
+          }
+          return render('content', schema, {
+            onSelect: onChange,
+            value: value ? value.value : result
+          });
+        },
+        value: result,
+        onConfirm: this.handleConfirm
+      }, function (_a) {
+        var onClick = _a.onClick;
+        return React__default.createElement(InputBox, {
+          className: "ae-InputVariable",
+          clearable: false,
+          value: result,
+          onChange: onChange,
+          disabled: disabled
+        }, React__default.createElement("span", {
+          onClick: function (e) {
+            return __awaiter(_this, void 0, void 0, function () {
+              return __generator(this, function (_a) {
+                onClick(e);
+                return [2 /*return*/];
+              });
+            });
+          }
+        }, React__default.createElement(Icon, {
+          icon: "info",
+          className: "icon cursor-pointer"
+        })));
+      });
+    }
+  });
+  var _a;
+  __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", [typeof (_a = typeof DSField !== "undefined" && DSField) === "function" ? _a : Object]), __metadata("design:returntype", void 0)], DataBindingControl.prototype, "handleConfirm", null);
+  __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", []), __metadata("design:returntype", Promise)], DataBindingControl.prototype, "handlePickerOpen", null);
+  return DataBindingControl;
+}(React__default.Component);
+/** @class */(function (_super) {
+  __extends(DataBindingControlRenderer, _super);
+  function DataBindingControlRenderer() {
+    return _super !== null && _super.apply(this, arguments) || this;
+  }
+  DataBindingControlRenderer = __decorate([FormItem({
+    type: 'ae-DataBindingControl'
+  })], DataBindingControlRenderer);
+  return DataBindingControlRenderer;
+})(DataBindingControl);
+var SimpleDataBindingControl = /** @class */function (_super) {
+  __extends(SimpleDataBindingControl, _super);
+  function SimpleDataBindingControl(props) {
+    var _this = _super.call(this, props) || this;
+    Object.defineProperty(_this, "handleSearchDebounced", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: void 0
+    });
+    _this.handleSearchDebounced = debounce(_this.handleSearch, 250, {
+      trailing: true,
+      leading: false
+    });
+    _this.state = {
+      filteredFields: props.fields
+    };
+    return _this;
+  }
+  Object.defineProperty(SimpleDataBindingControl.prototype, "handleSearch", {
+    enumerable: false,
+    configurable: true,
+    writable: true,
+    value: function (keywords) {
+      return __awaiter(this, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+          this.setState({
+            filteredFields: matchSorter(this.props.fields, keywords, {
+              keys: ['label', 'value', 'children']
+            })
+          });
+          return [2 /*return*/];
+        });
+      });
+    }
+  });
+
+  Object.defineProperty(SimpleDataBindingControl.prototype, "handleSelect", {
+    enumerable: false,
+    configurable: true,
+    writable: true,
+    value: function () {}
+  });
+  Object.defineProperty(SimpleDataBindingControl.prototype, "render", {
+    enumerable: false,
+    configurable: true,
+    writable: true,
+    value: function () {
+      var _a = this.props,
+        className = _a.className,
+        value = _a.value,
+        onSelect = _a.onSelect,
+        isSelected = _a.isSelected;
+      var filteredFields = this.state.filteredFields;
+      return React__default.createElement("div", {
+        className: cx('ae-DataBindingList', className)
+      }, React__default.createElement("div", {
+        className: cx('ae-DataBindingList-searchBox')
+      }, React__default.createElement(SearchBox, {
+        mini: false,
+        placeholder: i18n("91be693dd1ccea38f8f514318fd8a944"),
+        onSearch: this.handleSearchDebounced
+      })), React__default.createElement("div", {
+        className: cx('ae-DataBindingList-body')
+      }, React__default.createElement(CollapseGroup, {
+        className: cx('ae-DataBindingList-collapseGroup'),
+        defaultActiveKey: filteredFields.map(function (item) {
+          return item.value || item.label;
+        }),
+        expandIcon: generateIcon(cx, 'fa fa-chevron-right expandIcon', 'Icon'),
+        expandIconPosition: "right"
+      }, filteredFields.map(function (item, index) {
+        return React__default.createElement(Collapse, {
+          className: cx('ae-DataBindingList-collapse'),
+          headingClassName: cx('ae-DataBindingList-collapse-title'),
+          bodyClassName: cx('ae-DataBindingList-collapse-body'),
+          propKey: item.value || item.label,
+          key: item.value || item.label,
+          header: React__default.createElement("span", null, item.label)
+        }, Array.isArray(item.children) && item.children.length > 0 ? item.children.map(function (childItem) {
+          var checked = isSelected ? isSelected(childItem) : childItem.value === value;
+          return React__default.createElement("div", {
+            className: cx('ae-DataBindingList-item', {
+              'is-active': checked
+            }),
+            onClick: function () {
+              return onSelect(childItem);
+            },
+            key: childItem.value
+          }, childItem.label);
+        }) : React__default.createElement("p", {
+          className: cx('ae-DataBindingList-hint')
+        }, "\u6682\u65E0\u53EF\u7528\u5B57\u6BB5"));
+      }))));
+    }
+  });
+  __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", [String]), __metadata("design:returntype", Promise)], SimpleDataBindingControl.prototype, "handleSearch", null);
+  __decorate([autobind, __metadata("design:type", Function), __metadata("design:paramtypes", []), __metadata("design:returntype", void 0)], SimpleDataBindingControl.prototype, "handleSelect", null);
+  return SimpleDataBindingControl;
+}(React__default.Component);
+/** @class */(function (_super) {
+  __extends(SimpleDataBindingControlRenderer, _super);
+  function SimpleDataBindingControlRenderer() {
+    return _super !== null && _super.apply(this, arguments) || this;
+  }
+  SimpleDataBindingControlRenderer = __decorate([Renderer({
+    type: 'ae-SimpleDataBindingPanel'
+  })], SimpleDataBindingControlRenderer);
+  return SimpleDataBindingControlRenderer;
+})(SimpleDataBindingControl);
+
+export { DataBindingControl, SimpleDataBindingControl };

package/esm/renderer/DataMappingControl.d.ts

@@ -0,0 +1,11 @@
+import type { FormControlProps } from 'amis-core';
+import React from 'react';
+export interface DataMappingProps extends FormControlProps {
+    schema?: string;
+}
+export declare class DataMappingControl extends React.Component<DataMappingProps> {
+    renderValue(value: any, onChange: (value: any) => void, schema: any): JSX.Element;
+    render(): JSX.Element;
+}
+export declare class DataMappingControlRenderer extends DataMappingControl {
+}

package/esm/renderer/DataMappingControl.js

@@ -0,0 +1,75 @@
+/**
+ * amis-editor v5.2.1-beta.19
+ * Copyright 2018-2022 @fex
+ */
+
+import { __extends, __rest, __assign, __decorate, __metadata } from 'tslib';
+import { Renderer } from 'amis';
+import React__default from 'react';
+import { autobind } from 'amis-editor-core';
+
+var DataMappingControl = /** @class */ (function (_super) {
+    __extends(DataMappingControl, _super);
+    function DataMappingControl() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    Object.defineProperty(DataMappingControl.prototype, "renderValue", {
+        enumerable: false,
+        configurable: true,
+        writable: true,
+        value: function (value, onChange, schema) {
+            var render = this.props.render;
+            return render('value', {
+                type: 'ae-DataPickerControl',
+                inputOnly: true,
+                name: 'any'
+            }, {
+                value: value,
+                onChange: onChange
+            });
+        }
+    });
+    Object.defineProperty(DataMappingControl.prototype, "render", {
+        enumerable: false,
+        configurable: true,
+        writable: true,
+        value: function () {
+            var _a = this.props, schema = _a.schema, render = _a.render, name = _a.name, description = _a.description, required = _a.required, rest = __rest(_a, ["schema", "render", "name", "description", "required"]);
+            return render('inner', {
+                type: 'json-schema',
+                schema: schema,
+                name: name,
+                description: description,
+                required: required
+            }, __assign(__assign({}, rest), { renderValue: this.renderValue }));
+            // return (
+            //   <InputJSONSchema
+            //     {...rest}
+            //     schema={this.state.schema}
+            //     renderValue={this.renderValue}
+            //   />
+            // );
+        }
+    });
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Object, Function, Object]),
+        __metadata("design:returntype", void 0)
+    ], DataMappingControl.prototype, "renderValue", null);
+    return DataMappingControl;
+}(React__default.Component));
+/** @class */ ((function (_super) {
+    __extends(DataMappingControlRenderer, _super);
+    function DataMappingControlRenderer() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    DataMappingControlRenderer = __decorate([
+        Renderer({
+            type: 'ae-DataMappingControl'
+        })
+    ], DataMappingControlRenderer);
+    return DataMappingControlRenderer;
+})(DataMappingControl));
+
+export { DataMappingControl };

package/esm/renderer/DataPickerControl.d.ts

@@ -0,0 +1,13 @@
+import type { FormControlProps } from 'amis-core';
+import React from 'react';
+declare class DataPickerControl extends React.Component<FormControlProps> {
+    handleConfirm(value: string): void;
+    handlePickerOpen(): Promise<{
+        variables: any;
+        variableMode: string;
+    }>;
+    render(): JSX.Element;
+}
+export declare class DataPickerControlRenderer extends DataPickerControl {
+}
+export {};

package/esm/renderer/DataPickerControl.js

@@ -0,0 +1,92 @@
+/**
+ * amis-editor v5.2.1-beta.19
+ * Copyright 2018-2022 @fex
+ */
+
+import { __extends, __awaiter, __generator, __assign, __decorate, __metadata } from 'tslib';
+import { FormulaPicker, InputBox, Icon, FormItem } from 'amis';
+import React__default from 'react';
+import { autobind } from 'amis-editor-core';
+
+var DataPickerControl = /** @class */ (function (_super) {
+    __extends(DataPickerControl, _super);
+    function DataPickerControl() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    Object.defineProperty(DataPickerControl.prototype, "handleConfirm", {
+        enumerable: false,
+        configurable: true,
+        writable: true,
+        value: function (value) {
+            this.props.onChange(value);
+        }
+    });
+    Object.defineProperty(DataPickerControl.prototype, "handlePickerOpen", {
+        enumerable: false,
+        configurable: true,
+        writable: true,
+        value: function () {
+            var _a;
+            return __awaiter(this, void 0, void 0, function () {
+                var _b, manager, node, variables;
+                return __generator(this, function (_c) {
+                    switch (_c.label) {
+                        case 0:
+                            _b = this.props, manager = _b.manager, node = _b.node;
+                            variables = (_a = this.props.variables) !== null && _a !== void 0 ? _a : this.props.data.variables;
+                            if (!!variables) return [3 /*break*/, 2];
+                            return [4 /*yield*/, manager.getContextSchemas(node.info.id)];
+                        case 1:
+                            _c.sent();
+                            variables = manager.dataSchema.getDataPropsAsOptions();
+                            _c.label = 2;
+                        case 2: return [2 /*return*/, {
+                                variables: variables.map(function (item) { return (__assign(__assign({}, item), { selectMode: 'tree' })); }),
+                                variableMode: 'tabs'
+                            }];
+                    }
+                });
+            });
+        }
+    });
+    Object.defineProperty(DataPickerControl.prototype, "render", {
+        enumerable: false,
+        configurable: true,
+        writable: true,
+        value: function () {
+            var _a = this.props; _a.classnames; var value = _a.value, onChange = _a.onChange, disabled = _a.disabled; _a.manager; _a.node;
+            return (React__default.createElement(FormulaPicker, { onPickerOpen: this.handlePickerOpen, evalMode: false, onConfirm: this.handleConfirm, value: value, onChange: function () { }, header: '' }, function (_a) {
+                var onClick = _a.onClick;
+                return (React__default.createElement(InputBox, { className: "ae-InputVariable", clearable: false, value: value, onChange: onChange, disabled: disabled },
+                    React__default.createElement("span", { onClick: onClick },
+                        React__default.createElement(Icon, { icon: "info", className: "icon" }))));
+            }));
+        }
+    });
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [String]),
+        __metadata("design:returntype", void 0)
+    ], DataPickerControl.prototype, "handleConfirm", null);
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", []),
+        __metadata("design:returntype", Promise)
+    ], DataPickerControl.prototype, "handlePickerOpen", null);
+    return DataPickerControl;
+}(React__default.Component));
+/** @class */ ((function (_super) {
+    __extends(DataPickerControlRenderer, _super);
+    function DataPickerControlRenderer() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    DataPickerControlRenderer = __decorate([
+        FormItem({
+            type: 'ae-DataPickerControl',
+            renderLabel: false
+        })
+    ], DataPickerControlRenderer);
+    return DataPickerControlRenderer;
+})(DataPickerControl));

package/esm/renderer/DateShortCutControl.d.ts

@@ -0,0 +1,84 @@
+/**
+ * @file 时间选择器的快捷键
+ */
+import React from 'react';
+import Sortable from 'sortablejs';
+import type { FormControlProps } from 'amis-core';
+import type { BaseEventContext } from 'amis-editor-core';
+import type { Option } from 'amis';
+type $Object = {
+    [key: string]: string;
+};
+declare enum RangeType {
+    Normal = "Normal",
+    Custom = "Custom"
+}
+export interface DateShortCutControlProps extends FormControlProps {
+    className?: string;
+    /**
+     * 编辑器上下文数据，用于获取字段所在Form的其他字段
+     */
+    context: BaseEventContext;
+    normalDropDownOption: $Object;
+    customDropDownOption: $Object;
+}
+interface OptionsType {
+    label?: string;
+    value: string;
+    type: RangeType;
+    inputType?: string;
+}
+interface DateShortCutControlState {
+    options: Array<OptionsType>;
+}
+export declare class DateShortCutControl extends React.PureComponent<DateShortCutControlProps, DateShortCutControlState> {
+    sortable?: Sortable;
+    drag?: HTMLElement | null;
+    target: HTMLElement | null;
+    normalDropDownOptionArr: Array<Option>;
+    customDropDownOptionArr: Array<Option>;
+    static defaultProps: Partial<DateShortCutControlProps>;
+    constructor(props: DateShortCutControlProps);
+    dragRef(ref: any): void;
+    scrollToBottom(): void;
+    /**
+     * 初始化拖动
+     */
+    initDragging(): void;
+    /**
+     * 拖动的销毁
+     */
+    destroyDragging(): void;
+    /**
+     * 生成内容体
+     */
+    renderContent(): JSX.Element;
+    /**
+     * 生成固定跨度选项
+     */
+    renderNormalOption(option: OptionsType, index: number): JSX.Element;
+    /**
+     * 生成自定义跨度选项
+     */
+    renderCustomOption(option: OptionsType, index: number): JSX.Element;
+    /**
+     * 自定义跨度变化
+     */
+    handleCustomItemChange(value: string, index: number): void;
+    /**
+     * option添加
+     */
+    addItem(item: Option, type: RangeType): void;
+    /**
+     * 删除选项
+     */
+    handleDelete(index: number, e: React.UIEvent<any>): void;
+    /**
+     * 更新options字段的统一出口
+     */
+    onChangeOptions(): void;
+    render(): JSX.Element;
+}
+export declare class DateShortCutControlRender extends DateShortCutControl {
+}
+export {};