amis-editor 4.1.0-beta.4 → 5.2.0-beta.1

package/lib/plugin/Form/Checkbox.js

@@ -0,0 +1,174 @@
+/**
+ * amis-editor v5.2.0-beta.1
+ * Copyright 2018-2022 @fex
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var AMisCodeEditor = require('amis-editor-core');
+var validator = require('../../validator.js');
+var BaseControl = require('../../component/BaseControl.js');
+var util = require('../../util.js');
+
+AMisCodeEditor.setSchemaTpl('option', {
+    name: 'option',
+    type: 'input-text',
+    label: BaseControl.tipedLabel('说明', '选项说明')
+});
+var CheckboxControlPlugin = /** @class */ (function (_super) {
+    tslib.__extends(CheckboxControlPlugin, _super);
+    function CheckboxControlPlugin() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        // 关联渲染器名字
+        _this.rendererName = 'checkbox';
+        _this.$schema = '/schemas/CheckboxControlSchema.json';
+        // 组件名称
+        _this.name = '勾选框';
+        _this.isBaseComponent = true;
+        _this.icon = 'fa fa-check-square-o';
+        _this.description = '勾选框';
+        _this.docLink = '/amis/zh-CN/components/form/checkbox';
+        _this.tags = ['表单项'];
+        _this.scaffold = {
+            type: 'checkbox',
+            option: '勾选框',
+            name: 'checkbox'
+        };
+        _this.previewSchema = {
+            type: 'form',
+            className: 'text-left',
+            wrapWithPanel: false,
+            mode: 'horizontal',
+            body: [
+                tslib.__assign(tslib.__assign({ value: true }, _this.scaffold), { label: '勾选表单' })
+            ]
+        };
+        _this.notRenderFormZone = true;
+        _this.panelTitle = '勾选框';
+        _this.panelJustify = true;
+        // 事件定义
+        _this.events = [
+            {
+                eventName: 'change',
+                eventLabel: '值变化',
+                description: '选中状态变化时触发',
+                dataSchema: [
+                    {
+                        type: 'object',
+                        properties: {
+                            'event.data.value': {
+                                type: 'string',
+                                title: '选中状态'
+                            }
+                        }
+                    }
+                ]
+            }
+        ];
+        // 动作定义
+        _this.actions = [
+            {
+                actionType: 'clear',
+                actionLabel: '清空',
+                description: '清除选中值'
+            },
+            {
+                actionType: 'reset',
+                actionLabel: '重置',
+                description: '将值重置为resetValue，若没有配置resetValue，则清空'
+            },
+            {
+                actionType: 'setValue',
+                actionLabel: '赋值',
+                description: '触发组件数据更新'
+            }
+        ];
+        _this.panelBodyCreator = function (context) {
+            return AMisCodeEditor.getSchemaTpl('tabs', [
+                {
+                    title: '属性',
+                    body: AMisCodeEditor.getSchemaTpl('collapseGroup', [
+                        {
+                            title: '基本',
+                            body: [
+                                AMisCodeEditor.getSchemaTpl('formItemName', {
+                                    required: true
+                                }),
+                                AMisCodeEditor.getSchemaTpl('label'),
+                                AMisCodeEditor.getSchemaTpl('option'),
+                                {
+                                    type: 'ae-Switch-More',
+                                    hiddenOnDefault: false,
+                                    mode: 'normal',
+                                    label: '值格式',
+                                    formType: 'extend',
+                                    form: {
+                                        body: [
+                                            {
+                                                type: 'input-text',
+                                                label: '勾选值',
+                                                name: 'trueValue',
+                                                pipeIn: AMisCodeEditor.defaultValue(true),
+                                                pipeOut: AMisCodeEditor.valuePipeOut
+                                            },
+                                            {
+                                                type: 'input-text',
+                                                label: '未勾选值',
+                                                name: 'falseValue',
+                                                pipeIn: AMisCodeEditor.defaultValue(false),
+                                                pipeOut: AMisCodeEditor.valuePipeOut
+                                            }
+                                        ]
+                                    }
+                                },
+                                AMisCodeEditor.getSchemaTpl('valueFormula', {
+                                    rendererSchema: tslib.__assign(tslib.__assign({}, context === null || context === void 0 ? void 0 : context.schema), { type: 'switch' }),
+                                    label: '默认勾选',
+                                    rendererWrapper: true,
+                                    valueType: 'boolean',
+                                    pipeIn: function (value, data) {
+                                        var _a, _b;
+                                        return value === ((_b = (_a = data === null || data === void 0 ? void 0 : data.data) === null || _a === void 0 ? void 0 : _a.trueValue) !== null && _b !== void 0 ? _b : true);
+                                    },
+                                    pipeOut: function (value, origin, data) {
+                                        var _a = data.trueValue, trueValue = _a === void 0 ? true : _a, _b = data.falseValue, falseValue = _b === void 0 ? false : _b;
+                                        return value ? trueValue : falseValue;
+                                    }
+                                }),
+                                AMisCodeEditor.getSchemaTpl('labelRemark'),
+                                AMisCodeEditor.getSchemaTpl('remark'),
+                                AMisCodeEditor.getSchemaTpl('description')
+                            ]
+                        },
+                        AMisCodeEditor.getSchemaTpl('status', { isFormItem: true }),
+                        AMisCodeEditor.getSchemaTpl('validation', { tag: validator.ValidatorTag.MultiSelect })
+                    ])
+                },
+                {
+                    title: '外观',
+                    body: [
+                        AMisCodeEditor.getSchemaTpl('collapseGroup', [
+                            AMisCodeEditor.getSchemaTpl('style:formItem', { renderer: context.info.renderer }),
+                            AMisCodeEditor.getSchemaTpl('style:classNames')
+                        ])
+                    ]
+                },
+                {
+                    title: '事件',
+                    className: 'p-none',
+                    body: [
+                        AMisCodeEditor.getSchemaTpl('eventControl', tslib.__assign({ name: 'onEvent' }, util.getEventControlConfig(_this.manager, context)))
+                    ]
+                }
+            ]);
+        };
+        return _this;
+    }
+    return CheckboxControlPlugin;
+}(AMisCodeEditor.BasePlugin));
+AMisCodeEditor.registerEditorPlugin(CheckboxControlPlugin);
+
+exports.CheckboxControlPlugin = CheckboxControlPlugin;

package/{dist → lib}/plugin/Form/Checkboxes.d.ts

@@ -1,4 +1,5 @@
-import { BasePlugin } from '../../plugin';
+import { BasePlugin, BaseEventContext } from 'amis-editor-core';
+import { RendererAction, RendererEvent } from 'amis-editor-comp/dist/renderers/event-action';
 export declare class CheckboxesControlPlugin extends BasePlugin {
     rendererName: string;
     $schema: string;
@@ -13,12 +14,17 @@ export declare class CheckboxesControlPlugin extends BasePlugin {
         type: string;
         label: string;
         name: string;
+        multiple: boolean;
         options: {
             label: string;
             value: string;
         }[];
     };
     previewSchema: any;
+    notRenderFormZone: boolean;
     panelTitle: string;
-    panelBody: any[];
+    events: RendererEvent[];
+    actions: RendererAction[];
+    panelJustify: boolean;
+    panelBodyCreator: (context: BaseEventContext) => any;
 }

package/lib/plugin/Form/Checkboxes.js

@@ -0,0 +1,213 @@
+/**
+ * amis-editor v5.2.0-beta.1
+ * Copyright 2018-2022 @fex
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var AMisCodeEditor = require('amis-editor-core');
+var validator = require('../../validator.js');
+var util = require('../../util.js');
+
+var CheckboxesControlPlugin = /** @class */ (function (_super) {
+    tslib.__extends(CheckboxesControlPlugin, _super);
+    function CheckboxesControlPlugin() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        // 关联渲染器名字
+        _this.rendererName = 'checkboxes';
+        _this.$schema = '/schemas/CheckboxesControlSchema.json';
+        _this.order = -470;
+        // 组件名称
+        _this.name = '复选框';
+        _this.isBaseComponent = true;
+        _this.icon = 'fa fa-check-square';
+        _this.description = '通过<code>options</code>配置多个勾选框，也可以通过<code>source</code>拉取选项';
+        _this.docLink = '/amis/zh-CN/components/form/checkboxes';
+        _this.tags = ['表单项'];
+        _this.scaffold = {
+            type: 'checkboxes',
+            label: '复选框',
+            name: 'checkboxes',
+            multiple: true,
+            options: [
+                {
+                    label: '选项A',
+                    value: 'A'
+                },
+                {
+                    label: '选项B',
+                    value: 'B'
+                }
+            ]
+        };
+        _this.previewSchema = {
+            type: 'form',
+            className: 'text-left',
+            mode: 'horizontal',
+            wrapWithPanel: false,
+            body: [
+                tslib.__assign({ value: 'A' }, _this.scaffold)
+            ]
+        };
+        _this.notRenderFormZone = true;
+        _this.panelTitle = '复选框';
+        // 事件定义
+        _this.events = [
+            {
+                eventName: 'change',
+                eventLabel: '值变化',
+                description: '选中值变化时触发',
+                dataSchema: [
+                    {
+                        type: 'object',
+                        properties: {
+                            'event.data.value': {
+                                type: 'string',
+                                title: '选中值'
+                            }
+                        }
+                    }
+                ]
+            }
+        ];
+        // 动作定义
+        _this.actions = [
+            {
+                actionType: 'clear',
+                actionLabel: '清空',
+                description: '清除选中值'
+            },
+            {
+                actionType: 'reset',
+                actionLabel: '重置',
+                description: '将值重置为resetValue，若没有配置resetValue，则清空'
+            },
+            {
+                actionType: 'reload',
+                actionLabel: '重新加载',
+                description: '触发组件数据刷新并重新渲染'
+            },
+            {
+                actionType: 'setValue',
+                actionLabel: '赋值',
+                description: '触发组件数据更新'
+            }
+        ];
+        _this.panelJustify = true;
+        _this.panelBodyCreator = function (context) {
+            var renderer = context.info.renderer;
+            return AMisCodeEditor.getSchemaTpl('tabs', [
+                {
+                    title: '属性',
+                    body: AMisCodeEditor.getSchemaTpl('collapseGroup', [
+                        {
+                            title: '基本',
+                            body: [
+                                AMisCodeEditor.getSchemaTpl('formItemName', {
+                                    required: true
+                                }),
+                                AMisCodeEditor.getSchemaTpl('label'),
+                                [
+                                    AMisCodeEditor.getSchemaTpl('switch', {
+                                        label: '可全选',
+                                        name: 'checkAll',
+                                        value: false,
+                                        visibleOn: 'data.multiple',
+                                        onChange: function (value, origin, item, form) {
+                                            if (!value) {
+                                                // 可全选关闭时，默认全选也需联动关闭
+                                                form.setValueByName('defaultCheckAll', false);
+                                            }
+                                        }
+                                    }),
+                                    {
+                                        type: 'container',
+                                        className: 'ae-ExtendMore mb-2',
+                                        visibleOn: 'data.checkAll',
+                                        body: [
+                                            AMisCodeEditor.getSchemaTpl('switch', {
+                                                label: '默认全选',
+                                                name: 'defaultCheckAll',
+                                                value: false
+                                            })
+                                        ]
+                                    }
+                                ],
+                                AMisCodeEditor.getSchemaTpl('valueFormula', {
+                                    rendererSchema: context === null || context === void 0 ? void 0 : context.schema,
+                                    useSelectMode: true,
+                                    visibleOn: 'this.options && this.options.length > 0'
+                                }),
+                                AMisCodeEditor.getSchemaTpl('joinValues', {
+                                    visibleOn: true
+                                }),
+                                AMisCodeEditor.getSchemaTpl('delimiter', {
+                                    visibleOn: 'data.joinValues === true'
+                                }),
+                                AMisCodeEditor.getSchemaTpl('extractValue'),
+                                AMisCodeEditor.getSchemaTpl('labelRemark'),
+                                AMisCodeEditor.getSchemaTpl('remark'),
+                                AMisCodeEditor.getSchemaTpl('description')
+                            ]
+                        },
+                        {
+                            title: '选项',
+                            body: [
+                                AMisCodeEditor.getSchemaTpl('optionControlV2', {
+                                    multiple: true
+                                }),
+                                AMisCodeEditor.getSchemaTpl('creatable', {
+                                    formType: 'extend',
+                                    hiddenOnDefault: true,
+                                    form: {
+                                        body: [AMisCodeEditor.getSchemaTpl('createBtnLabel'), AMisCodeEditor.getSchemaTpl('addApi')]
+                                    }
+                                }),
+                                AMisCodeEditor.getSchemaTpl('editable', {
+                                    formType: 'extend',
+                                    hiddenOnDefault: true,
+                                    form: {
+                                        body: [AMisCodeEditor.getSchemaTpl('editApi')]
+                                    }
+                                }),
+                                AMisCodeEditor.getSchemaTpl('removable', {
+                                    formType: 'extend',
+                                    hiddenOnDefault: true,
+                                    form: {
+                                        body: [AMisCodeEditor.getSchemaTpl('deleteApi')]
+                                    }
+                                })
+                            ]
+                        },
+                        AMisCodeEditor.getSchemaTpl('status', { isFormItem: true }),
+                        AMisCodeEditor.getSchemaTpl('validation', { tag: validator.ValidatorTag.MultiSelect })
+                    ])
+                },
+                {
+                    title: '外观',
+                    body: [
+                        AMisCodeEditor.getSchemaTpl('collapseGroup', [
+                            AMisCodeEditor.getSchemaTpl('style:formItem', { renderer: renderer }),
+                            AMisCodeEditor.getSchemaTpl('style:classNames')
+                        ])
+                    ]
+                },
+                {
+                    title: '事件',
+                    className: 'p-none',
+                    body: [
+                        AMisCodeEditor.getSchemaTpl('eventControl', tslib.__assign({ name: 'onEvent' }, util.getEventControlConfig(_this.manager, context)))
+                    ]
+                }
+            ]);
+        };
+        return _this;
+    }
+    return CheckboxesControlPlugin;
+}(AMisCodeEditor.BasePlugin));
+AMisCodeEditor.registerEditorPlugin(CheckboxesControlPlugin);
+
+exports.CheckboxesControlPlugin = CheckboxesControlPlugin;

package/lib/plugin/Form/CodeEditor.d.ts

@@ -0,0 +1,25 @@
+import { BasePlugin } from 'amis-editor-core';
+import type { BaseEventContext } from 'amis-editor-core';
+import { RendererEvent, RendererAction } from 'amis-editor-comp/dist/renderers/event-action';
+export declare class CodeEditorControlPlugin extends BasePlugin {
+    rendererName: string;
+    $schema: string;
+    name: string;
+    isBaseComponent: boolean;
+    icon: string;
+    description: string;
+    docLink: string;
+    tags: string[];
+    scaffold: {
+        type: string;
+        label: string;
+        name: string;
+    };
+    previewSchema: any;
+    events: RendererEvent[];
+    actions: RendererAction[];
+    notRenderFormZone: boolean;
+    panelTitle: string;
+    panelJustify: boolean;
+    panelBodyCreator: (context: BaseEventContext) => any;
+}

package/lib/plugin/Form/CodeEditor.js

@@ -0,0 +1,201 @@
+/**
+ * amis-editor v5.2.0-beta.1
+ * Copyright 2018-2022 @fex
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var Editor = require('amis/lib/renderers/Form/Editor');
+var AMisCodeEditor = require('amis-editor-core');
+var validator = require('../../validator.js');
+var util = require('../../util.js');
+
+var CodeEditorControlPlugin = /** @class */ (function (_super) {
+    tslib.__extends(CodeEditorControlPlugin, _super);
+    function CodeEditorControlPlugin() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        // 关联渲染器名字
+        _this.rendererName = 'editor';
+        _this.$schema = '/schemas/EditorControlSchema.json';
+        // 组件名称
+        _this.name = '代码编辑器';
+        _this.isBaseComponent = true;
+        _this.icon = 'fa fa-code';
+        _this.description = "\u4EE3\u7801\u7F16\u8F91\u5668\uFF0C\u91C7\u7528 monaco-editor \u652F\u6301\uFF1A".concat(Editor.availableLanguages
+            .slice(0, 10)
+            .join('，'), "\u7B49\u7B49");
+        _this.docLink = '/amis/zh-CN/components/form/editor';
+        _this.tags = ['表单项'];
+        _this.scaffold = {
+            type: 'editor',
+            label: '代码编辑器',
+            name: 'editor'
+        };
+        _this.previewSchema = {
+            type: 'form',
+            className: 'text-left',
+            mode: 'horizontal',
+            wrapWithPanel: false,
+            body: [
+                tslib.__assign(tslib.__assign({}, _this.scaffold), { value: 'console.log("Hello world.");' })
+            ]
+        };
+        _this.events = [
+            {
+                eventName: 'focus',
+                eventLabel: '获取焦点',
+                description: '输入框获取焦点时触发',
+                dataSchema: [
+                    {
+                        type: 'object',
+                        properties: {
+                            'event.data.value': {
+                                type: 'string',
+                                title: '当前代码'
+                            }
+                        }
+                    }
+                ]
+            },
+            {
+                eventName: 'blur',
+                eventLabel: '失去焦点',
+                description: '输入框失去焦点时触发',
+                dataSchema: [
+                    {
+                        type: 'object',
+                        properties: {
+                            'event.data.value': {
+                                type: 'string',
+                                title: '当前代码'
+                            }
+                        }
+                    }
+                ]
+            }
+        ];
+        _this.actions = [
+            {
+                actionType: 'clear',
+                actionLabel: '清空',
+                description: '清除选中值'
+            },
+            {
+                actionType: 'reset',
+                actionLabel: '重置',
+                description: '将值重置为resetValue，若没有配置resetValue，则清空'
+            },
+            {
+                actionType: 'focus',
+                actionLabel: '获取焦点',
+                description: '输入框获取焦点'
+            },
+            {
+                actionType: 'setValue',
+                actionLabel: '赋值',
+                description: '触发组件数据更新'
+            }
+        ];
+        _this.notRenderFormZone = true;
+        _this.panelTitle = 'Editor';
+        _this.panelJustify = true;
+        _this.panelBodyCreator = function (context) {
+            return AMisCodeEditor.getSchemaTpl('tabs', [
+                {
+                    title: '属性',
+                    body: AMisCodeEditor.getSchemaTpl('collapseGroup', [
+                        {
+                            title: '基本',
+                            body: [
+                                AMisCodeEditor.getSchemaTpl('formItemName', {
+                                    required: true
+                                }),
+                                AMisCodeEditor.getSchemaTpl('label'),
+                                {
+                                    label: '语言',
+                                    name: 'language',
+                                    type: 'select',
+                                    value: 'javascript',
+                                    searchable: true,
+                                    options: Editor.availableLanguages.concat()
+                                },
+                                {
+                                    type: 'textarea',
+                                    name: 'value',
+                                    label: '默认值'
+                                },
+                                AMisCodeEditor.getSchemaTpl('switch', {
+                                    label: '可全屏',
+                                    name: 'allowFullscreen',
+                                    pipeIn: AMisCodeEditor.defaultValue(true)
+                                }),
+                                AMisCodeEditor.getSchemaTpl('labelRemark'),
+                                AMisCodeEditor.getSchemaTpl('remark'),
+                                AMisCodeEditor.getSchemaTpl('description')
+                            ]
+                        },
+                        AMisCodeEditor.getSchemaTpl('status', { isFormItem: true }),
+                        AMisCodeEditor.getSchemaTpl('validation', {
+                            tag: validator.ValidatorTag.Code
+                        })
+                    ])
+                },
+                {
+                    title: '外观',
+                    body: AMisCodeEditor.getSchemaTpl('collapseGroup', [
+                        AMisCodeEditor.getSchemaTpl('style:formItem', {
+                            renderer: context.info.renderer,
+                            schema: [
+                                {
+                                    name: 'size',
+                                    type: 'select',
+                                    pipeIn: AMisCodeEditor.defaultValue(''),
+                                    pipeOut: AMisCodeEditor.undefinedPipeOut,
+                                    label: '控件尺寸',
+                                    options: [
+                                        {
+                                            label: '默认',
+                                            value: ''
+                                        },
+                                        {
+                                            label: '中',
+                                            value: 'md'
+                                        },
+                                        {
+                                            label: '大',
+                                            value: 'lg'
+                                        },
+                                        {
+                                            label: '特大',
+                                            value: 'xl'
+                                        },
+                                        {
+                                            label: '超大',
+                                            value: 'xxl'
+                                        }
+                                    ]
+                                }
+                            ]
+                        }),
+                        AMisCodeEditor.getSchemaTpl('style:classNames')
+                    ])
+                },
+                {
+                    title: '事件',
+                    className: 'p-none',
+                    body: [
+                        AMisCodeEditor.getSchemaTpl('eventControl', tslib.__assign({ name: 'onEvent' }, util.getEventControlConfig(_this.manager, context)))
+                    ]
+                }
+            ]);
+        };
+        return _this;
+    }
+    return CodeEditorControlPlugin;
+}(AMisCodeEditor.BasePlugin));
+AMisCodeEditor.registerEditorPlugin(CodeEditorControlPlugin);
+
+exports.CodeEditorControlPlugin = CodeEditorControlPlugin;

package/{dist → lib}/plugin/Form/Combo.d.ts

@@ -1,4 +1,5 @@
-import { BaseEventContext, BasePlugin, BasicToolbarItem, ContextMenuEventContext, ContextMenuItem } from '../../plugin';
+import { BaseEventContext, BasePlugin, BasicToolbarItem, ContextMenuEventContext, ContextMenuItem } from 'amis-editor-core';
+import { RendererEvent, RendererAction } from 'amis-editor-comp/dist/renderers/event-action';
 export declare class ComboControlPlugin extends BasePlugin {
     rendererName: string;
     $schema: string;
@@ -29,6 +30,8 @@ export declare class ComboControlPlugin extends BasePlugin {
         })[];
     };
     previewSchema: any;
+    events: RendererEvent[];
+    actions: RendererAction[];
     panelTitle: string;
     panelBodyCreator: (context: BaseEventContext) => any[];
     filterProps(props: any): any;