amis-editor 5.2.0 → 5.2.1-beta.15

package/esm/plugin/ColumnToggler.js

@@ -0,0 +1,167 @@
+/**
+ * amis-editor v5.2.1-beta.15
+ * Copyright 2018-2022 @fex
+ */
+
+import { __extends } from 'tslib';
+import { getSchemaTpl, BasePlugin, registerEditorPlugin } from 'amis-editor-core';
+import { i18n } from 'i18n-runtime';
+
+var ColumnToggler = /** @class */function (_super) {
+  __extends(ColumnToggler, _super);
+  function ColumnToggler() {
+    var _this = _super !== null && _super.apply(this, arguments) || this;
+    // 关联渲染器名字
+    Object.defineProperty(_this, "rendererName", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: 'column-toggler'
+    });
+    Object.defineProperty(_this, "$schema", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: '/schemas/ColumnToggler.json'
+    });
+    // 组件名称
+    Object.defineProperty(_this, "name", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: i18n("2816cea6c4887a53c417831deb5fbe00")
+    });
+    Object.defineProperty(_this, "isBaseComponent", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: true
+    });
+    Object.defineProperty(_this, "disabledRendererPlugin", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: true
+    });
+    Object.defineProperty(_this, "description", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: i18n("a955021cdf0249de1f3818f83cf248b7")
+    });
+    Object.defineProperty(_this, "tags", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: [i18n("2816cea6c4887a53c417831deb5fbe00")]
+    });
+    Object.defineProperty(_this, "icon", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: 'fa fa-square'
+    });
+    Object.defineProperty(_this, "panelTitle", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: i18n("2816cea6c4887a53c417831deb5fbe00")
+    });
+    Object.defineProperty(_this, "panelJustify", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: true
+    });
+    Object.defineProperty(_this, "panelBodyCreator", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: function (context) {
+        return getSchemaTpl('tabs', [{
+          title: i18n("24d67862f87f439db7ca957aecb77cce"),
+          body: getSchemaTpl('collapseGroup', [{
+            title: i18n("4092ed98e9035652d4c9ca9441701ed7"),
+            body: [{
+              label: i18n("24bdc7e8957abfc5d82f4206e92bb518"),
+              type: 'input-text',
+              name: 'label'
+            }, {
+              label: i18n("787366b0d678071a5ed98e55d31eba84"),
+              type: 'input-text',
+              name: 'tooltip'
+            }, getSchemaTpl('switch', {
+              name: 'defaultIsOpened',
+              label: i18n("6a0508144ae12bfa79001693d713c0d6")
+            }), getSchemaTpl('icon', {
+              label: i18n("ae3816c5b00fcff4111842ac19f0a706")
+            })]
+          }])
+        }, {
+          title: i18n("afcde2611bdd13c1e65b4fb6a2f13425"),
+          body: getSchemaTpl('collapseGroup', [{
+            title: i18n("4092ed98e9035652d4c9ca9441701ed7"),
+            body: [getSchemaTpl('size', {
+              label: i18n("fe805d91ae93be775670c61214dd2f28")
+            })]
+          }, {
+            title: i18n("4434b33a8731a73613ba5fa1eb984efb"),
+            body: [getSchemaTpl('className', {
+              name: 'className',
+              label: i18n("fbbbe30d78c335bad27f3dfc5efd2a5d")
+            }), getSchemaTpl('className', {
+              name: 'btnClassName',
+              label: i18n("ac3880323853de9adc4f66bc06d438ff")
+            })]
+          }])
+        }]);
+      }
+    });
+    return _this;
+  }
+  /**
+   * 如果禁用了没办法编辑
+   */
+  Object.defineProperty(ColumnToggler.prototype, "filterProps", {
+    enumerable: false,
+    configurable: true,
+    writable: true,
+    value: function (props) {
+      props.disabled = false;
+      return props;
+    }
+  });
+  /**
+   * 如果配置里面有 rendererName 自动返回渲染器信息。
+   * @param renderer
+   */
+  Object.defineProperty(ColumnToggler.prototype, "getRendererInfo", {
+    enumerable: false,
+    configurable: true,
+    writable: true,
+    value: function (_a) {
+      var renderer = _a.renderer,
+        schema = _a.schema;
+      var plugin = this;
+      if (schema.$$id && plugin.name && plugin.rendererName && plugin.rendererName === renderer.name) {
+        // 复制部分信息出去
+        return {
+          name: schema.label ? schema.label : plugin.name,
+          regions: plugin.regions,
+          patchContainers: plugin.patchContainers,
+          // wrapper: plugin.wrapper,
+          vRendererConfig: plugin.vRendererConfig,
+          wrapperProps: plugin.wrapperProps,
+          wrapperResolve: plugin.wrapperResolve,
+          filterProps: plugin.filterProps,
+          $schema: plugin.$schema,
+          renderRenderer: plugin.renderRenderer
+        };
+      }
+    }
+  });
+  return ColumnToggler;
+}(BasePlugin);
+registerEditorPlugin(ColumnToggler);
+
+export { ColumnToggler };

package/esm/plugin/Container.d.ts

@@ -0,0 +1,32 @@
+import { BasePlugin, RegionConfig } from 'amis-editor-core';
+export declare class ContainerPlugin extends BasePlugin {
+    rendererName: string;
+    $schema: string;
+    name: string;
+    isBaseComponent: boolean;
+    description: string;
+    tags: string[];
+    withDataSource: boolean;
+    icon: string;
+    pluginIcon: string;
+    scaffold: {
+        type: string;
+        body: never[];
+        style: {
+            position: string;
+            display: string;
+        };
+    };
+    previewSchema: {
+        type: string;
+        body: never[];
+        style: {
+            position: string;
+            display: string;
+        };
+    };
+    regions: Array<RegionConfig>;
+    panelTitle: string;
+    panelJustify: boolean;
+    panelBodyCreator: (context: BaseEventContext) => any;
+}

package/esm/plugin/Container.js

@@ -0,0 +1,209 @@
+/**
+ * amis-editor v5.2.1-beta.15
+ * Copyright 2018-2022 @fex
+ */
+
+import { __extends, __assign, __spreadArray } from 'tslib';
+import { getSchemaTpl, defaultValue, BasePlugin, registerEditorPlugin } from 'amis-editor-core';
+import { i18n } from 'i18n-runtime';
+
+var ContainerPlugin = /** @class */function (_super) {
+  __extends(ContainerPlugin, _super);
+  function ContainerPlugin() {
+    var _this = _super !== null && _super.apply(this, arguments) || this;
+    // 关联渲染器名字
+    Object.defineProperty(_this, "rendererName", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: 'container'
+    });
+    Object.defineProperty(_this, "$schema", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: '/schemas/ContainerSchema.json'
+    });
+    // 组件名称
+    Object.defineProperty(_this, "name", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: i18n("22c799040acdb2601b437ed5449de076")
+    });
+    Object.defineProperty(_this, "isBaseComponent", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: true
+    });
+    Object.defineProperty(_this, "description", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: i18n("ded228f9173b241dd8df2a4811ea0e98")
+    });
+    Object.defineProperty(_this, "tags", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: [i18n("22c799040acdb2601b437ed5449de076")]
+    });
+    Object.defineProperty(_this, "withDataSource", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: false
+    });
+    Object.defineProperty(_this, "icon", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: 'fa fa-square-o'
+    });
+    Object.defineProperty(_this, "pluginIcon", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: 'container-plugin'
+    });
+    Object.defineProperty(_this, "scaffold", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: {
+        type: 'container',
+        body: [],
+        style: {
+          position: 'static',
+          display: 'block'
+        }
+      }
+    });
+    Object.defineProperty(_this, "previewSchema", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: __assign({}, _this.scaffold)
+    });
+    Object.defineProperty(_this, "regions", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: [{
+        key: 'body',
+        label: i18n("132a78bdf68d6d17bde00aa807bbf032")
+      }]
+    });
+    Object.defineProperty(_this, "panelTitle", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: i18n("22c799040acdb2601b437ed5449de076")
+    });
+    Object.defineProperty(_this, "panelJustify", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: true
+    });
+    Object.defineProperty(_this, "panelBodyCreator", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: function (context) {
+        var _a, _b;
+        var curRendererSchema = context === null || context === void 0 ? void 0 : context.schema;
+        (curRendererSchema === null || curRendererSchema === void 0 ? void 0 : curRendererSchema.direction) === 'row' || (curRendererSchema === null || curRendererSchema === void 0 ? void 0 : curRendererSchema.direction) === 'row-reverse';
+        var isFlexItem = (_a = _this.manager) === null || _a === void 0 ? void 0 : _a.isFlexItem(context === null || context === void 0 ? void 0 : context.id);
+        var isFlexColumnItem = (_b = _this.manager) === null || _b === void 0 ? void 0 : _b.isFlexColumnItem(context === null || context === void 0 ? void 0 : context.id);
+        return getSchemaTpl('tabs', [{
+          title: i18n("24d67862f87f439db7ca957aecb77cce"),
+          body: getSchemaTpl('collapseGroup', [{
+            title: i18n("4092ed98e9035652d4c9ca9441701ed7"),
+            body: [{
+              name: 'wrapperComponent',
+              label: i18n("a823cfa70cfa46c788e1eedae043f6e5"),
+              type: 'input-text',
+              options: ['article', 'aside', 'code', 'div', 'footer', 'header', 'p', 'section'],
+              pipeIn: defaultValue('div'),
+              validations: {
+                isAlphanumeric: true,
+                matchRegexp: '/^(?!.*script).*$/' // 禁用一下script标签
+              },
+
+              validationErrors: {
+                isAlpha: i18n("f7d64e5e79994c3c8853f2608d7b2d25"),
+                matchRegexp: i18n("f7d64e5e79994c3c8853f2608d7b2d25")
+              },
+              validateOnChange: false
+            }]
+          }, {
+            title: i18n("5aefca559c5a41d10078e21e6d616825"),
+            body: [isFlexItem ? getSchemaTpl('layout:flex', {
+              isFlexColumnItem: isFlexColumnItem,
+              visibleOn: 'data.style && (data.style.position === "static" || data.style.position === "relative")'
+            }) : null, isFlexItem ? getSchemaTpl('layout:flex-grow', {
+              visibleOn: 'data.style && data.style.flex !== "0 0 auto" && (data.style.position === "static" || data.style.position === "relative")'
+            }) : null, isFlexItem ? getSchemaTpl('layout:flex-basis', {
+              visibleOn: 'data.style && (data.style.position === "static" || data.style.position === "relative")'
+            }) : null, getSchemaTpl('layout:position'), getSchemaTpl('layout:originPosition'), getSchemaTpl('layout:inset', {
+              mode: 'vertical'
+            }), getSchemaTpl('layout:z-index'), getSchemaTpl('layout:display'), getSchemaTpl('layout:flexDirection', {
+              visibleOn: 'data.style && data.style.display === "flex"'
+            }), getSchemaTpl('layout:justifyContent', {
+              label: i18n("dde193342b8c350ae29795117c0c5b9a"),
+              visibleOn: 'data.style && data.style.display === "flex" && data.style.flexDirection === "row" || data.style.flexDirection === "row-reverse"'
+            }), getSchemaTpl('layout:justifyContent', {
+              label: i18n("5b15af1f73b4f2d5bb152410863602f4"),
+              visibleOn: 'data.style && data.style.display === "flex" && (data.style.flexDirection === "column" || data.style.flexDirection === "column-reverse")'
+            }), getSchemaTpl('layout:alignItems', {
+              label: i18n("dde193342b8c350ae29795117c0c5b9a"),
+              visibleOn: 'data.style && data.style.display === "flex" && (data.style.flexDirection === "column" || data.style.flexDirection === "column-reverse")'
+            }), getSchemaTpl('layout:alignItems', {
+              label: i18n("5b15af1f73b4f2d5bb152410863602f4"),
+              visibleOn: 'data.style && data.style.display === "flex" && (data.style.flexDirection === "row" || data.style.flexDirection === "row-reverse")'
+            }), getSchemaTpl('layout:flex-wrap', {
+              visibleOn: 'data.style && data.style.display === "flex"'
+            }), getSchemaTpl('layout:isFixedHeight', {
+              visibleOn: "".concat(!isFlexItem || !isFlexColumnItem)
+            }), getSchemaTpl('layout:height', {
+              visibleOn: "".concat(!isFlexItem || !isFlexColumnItem)
+            }), getSchemaTpl('layout:max-height', {
+              visibleOn: "".concat(!isFlexItem || !isFlexColumnItem)
+            }), getSchemaTpl('layout:min-height', {
+              visibleOn: "".concat(!isFlexItem || !isFlexColumnItem)
+            }), getSchemaTpl('layout:overflow-y', {
+              visibleOn: "".concat(!isFlexItem || !isFlexColumnItem, " && (data.isFixedHeight || data.style && data.style.maxHeight) || (").concat(isFlexItem && isFlexColumnItem, " && data.style.flex === '0 0 auto')")
+            }), getSchemaTpl('layout:isFixedWidth', {
+              visibleOn: "".concat(!isFlexItem || isFlexColumnItem)
+            }), getSchemaTpl('layout:width', {
+              visibleOn: "".concat(!isFlexItem || isFlexColumnItem)
+            }), getSchemaTpl('layout:max-width', {
+              visibleOn: "".concat(!isFlexItem || isFlexColumnItem)
+            }), getSchemaTpl('layout:min-width', {
+              visibleOn: "".concat(!isFlexItem || isFlexColumnItem)
+            }), getSchemaTpl('layout:overflow-x', {
+              visibleOn: "".concat(!isFlexItem || isFlexColumnItem, " && (data.isFixedWidth || data.style && data.style.maxWidth) || (").concat(isFlexItem && !isFlexColumnItem, " && data.style.flex === '0 0 auto')")
+            }), !isFlexItem ? getSchemaTpl('layout:margin-center') : null]
+          }, getSchemaTpl('status')])
+        }, {
+          title: i18n("afcde2611bdd13c1e65b4fb6a2f13425"),
+          className: 'p-none',
+          body: getSchemaTpl('collapseGroup', __spreadArray(__spreadArray([], getSchemaTpl('style:common', ['layout']), true), [getSchemaTpl('style:classNames', {
+            isFormItem: false,
+            schema: [getSchemaTpl('className', {
+              name: 'bodyClassName',
+              label: i18n("132a78bdf68d6d17bde00aa807bbf032")
+            })]
+          })], false))
+        }]);
+      }
+    });
+    return _this;
+  }
+  return ContainerPlugin;
+}(BasePlugin);
+registerEditorPlugin(ContainerPlugin);
+
+export { ContainerPlugin };

package/esm/plugin/Custom.d.ts

@@ -0,0 +1,28 @@
+/**
+ * @file 自定义代码
+ */
+import { BasePlugin, BasicSubRenderInfo, RendererEventContext, SubRendererInfo } from 'amis-editor-core';
+export declare class CustomPlugin extends BasePlugin {
+    rendererName: string;
+    $schema: string;
+    name: string;
+    isBaseComponent: boolean;
+    description: string;
+    tags: string[];
+    icon: string;
+    pluginIcon: string;
+    docLink: string;
+    scaffold: {
+        type: string;
+        html: string;
+        onMount: string;
+    };
+    previewSchema: {
+        type: string;
+        html: string;
+        onMount: string;
+    };
+    panelTitle: string;
+    panelBody: any[];
+    buildSubRenderers(context: RendererEventContext, renderers: Array<SubRendererInfo>): BasicSubRenderInfo | Array<BasicSubRenderInfo> | void;
+}

package/esm/plugin/Custom.js

@@ -0,0 +1,164 @@
+/**
+ * amis-editor v5.2.1-beta.15
+ * Copyright 2018-2022 @fex
+ */
+
+import { __extends, __assign } from 'tslib';
+import { getSchemaTpl, BasePlugin, registerEditorPlugin } from 'amis-editor-core';
+import { i18n } from 'i18n-runtime';
+
+/**
+ * @file 自定义代码
+ */
+var CustomPlugin = /** @class */function (_super) {
+  __extends(CustomPlugin, _super);
+  function CustomPlugin() {
+    var _this = _super !== null && _super.apply(this, arguments) || this;
+    // 关联渲染器名字
+    Object.defineProperty(_this, "rendererName", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: 'custom'
+    });
+    Object.defineProperty(_this, "$schema", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: '/schemas/CustomSchema.json'
+    });
+    // 组件名称
+    Object.defineProperty(_this, "name", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: i18n("473d2078518479669823205110842376")
+    });
+    Object.defineProperty(_this, "isBaseComponent", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: true
+    });
+    Object.defineProperty(_this, "description", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: i18n("8b9c77fa4e646b9cb270f833252e511b")
+    });
+    Object.defineProperty(_this, "tags", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: [i18n("997c7a5d34f6fc628893f509d0df32e0")]
+    });
+    Object.defineProperty(_this, "icon", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: 'fa fa-gears'
+    });
+    Object.defineProperty(_this, "pluginIcon", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: 'custom-plugin'
+    });
+    Object.defineProperty(_this, "docLink", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: '/amis/zh-CN/components/custom'
+    });
+    Object.defineProperty(_this, "scaffold", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: {
+        type: 'custom',
+        html: '<div><h2>hello, world!</h2></div>',
+        onMount: "\n      const button = document.createElement('button');\n      button.innerText = '\u70B9\u51FB\u4FEE\u6539\u59D3\u540D';\n      button.onclick = event => {\n        event.preventDefault();\n      };\n      dom.appendChild(button);"
+      }
+    });
+    Object.defineProperty(_this, "previewSchema", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: __assign({}, _this.scaffold)
+    });
+    Object.defineProperty(_this, "panelTitle", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: i18n("473d2078518479669823205110842376")
+    });
+    Object.defineProperty(_this, "panelBody", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: [getSchemaTpl('fieldSet', {
+        title: i18n("0b13dc6251002bf556263fb3e4675b11"),
+        body: [{
+          label: i18n("0b13dc6251002bf556263fb3e4675b11"),
+          name: 'html',
+          type: 'editor',
+          allowFullscreen: true
+        }]
+      }), getSchemaTpl('fieldSet', {
+        title: 'onMount',
+        body: [{
+          name: 'onMount',
+          type: 'editor',
+          allowFullscreen: true,
+          size: 'xxl',
+          label: i18n("d6b917c76b92aa9b92b6bebdcab993f3"),
+          options: {
+            lineNumbers: 'off',
+            glyphMargin: false,
+            lineDecorationsWidth: 0,
+            lineNumbersMinChars: 0
+          }
+        }]
+      }), getSchemaTpl('fieldSet', {
+        title: 'onUpdate',
+        body: [{
+          name: 'onUpdate',
+          type: 'editor',
+          allowFullscreen: true,
+          size: 'xxl',
+          label: i18n("e64739dd24bb0bfcb6f6e1ee2cce5413")
+        }]
+      }), getSchemaTpl('fieldSet', {
+        title: 'onUnmount',
+        body: [{
+          name: 'onUnmount',
+          type: 'editor',
+          allowFullscreen: true,
+          size: 'xxl',
+          label: i18n("0601b7aa5b53cbc3616e24719bcd2aaa")
+        }]
+      })]
+    });
+    return _this;
+  }
+  Object.defineProperty(CustomPlugin.prototype, "buildSubRenderers", {
+    enumerable: false,
+    configurable: true,
+    writable: true,
+    value: function (context, renderers) {
+      var info = _super.prototype.buildSubRenderers.apply(this, arguments);
+      // 只有 form 下才调 onChange
+      // if (
+      //   context.info.renderer.name === 'form' ||
+      //   context.node.childRegions.some(i => i.region === 'body')
+      // ) {
+      info.scaffold.onMount = "\n        const button = document.createElement('button');\n        button.innerText = '\u70B9\u51FB\u4FEE\u6539\u59D3\u540Dddd';\n        button.onclick = event => {\n          onChange('new name');\n          event.preventDefault();\n        };\n        dom.appendChild(button);";
+      // }
+      return info;
+    }
+  });
+  return CustomPlugin;
+}(BasePlugin);
+registerEditorPlugin(CustomPlugin);
+
+export { CustomPlugin };

package/esm/plugin/CustomRegion.d.ts

@@ -0,0 +1,40 @@
+/**
+ * @file 自定义代码
+ */
+import { BasePlugin, BasicRendererInfo, RendererInfoResolveEventContext, RegionConfig } from 'amis-editor-core';
+export declare class CustomPlugin extends BasePlugin {
+    rendererName: string;
+    $schema: string;
+    name: string;
+    isBaseComponent: boolean;
+    disabledRendererPlugin: boolean;
+    description: string;
+    docLink: string;
+    tags: string[];
+    icon: string;
+    scaffold: {
+        type: string;
+        html: string;
+        onMount: string;
+        body: {
+            type: string;
+            tpl: string;
+        }[];
+    };
+    previewSchema: {
+        type: string;
+        html: string;
+        onMount: string;
+        body: {
+            type: string;
+            tpl: string;
+        }[];
+    };
+    regions: Array<RegionConfig>;
+    panelTitle: string;
+    panelBody: any[];
+    /**
+     * 备注: 根据当前custom组件的schema中是否有body元素来启动容器模式，用于实现custom组件实现自定义容器类型
+     */
+    getRendererInfo(context: RendererInfoResolveEventContext): BasicRendererInfo | void;
+}