amis-editor 4.1.0-beta.28 → 5.2.0-beta.0

package/src/plugin/Date.tsx

@@ -1,81 +0,0 @@
-import {Button, SchemaObject} from 'amis';
-import React from 'react';
-import {registerEditorPlugin} from '../manager';
-import {
-  BaseEventContext,
-  BasePlugin,
-  RegionConfig,
-  RendererInfo
-} from '../plugin';
-import {defaultValue, getSchemaTpl} from '../component/schemaTpl';
-
-export class DatePlugin extends BasePlugin {
-  // 关联渲染器名字
-  rendererName = 'date';
-  $schema = '/schemas/DateSchema.json';
-
-  // 组件名称
-  name = '日期展示';
-  isBaseComponent = true;
-  description =
-    '主要用来关联字段名做日期展示，支持各种格式如：X（时间戳），YYYY-MM-DD HH:mm:ss。';
-  tags = ['展示'];
-  icon = 'fa fa-calendar';
-  scaffold = {
-    type: 'date',
-    value: Math.round(Date.now() / 1000)
-  };
-  previewSchema = {
-    ...this.scaffold,
-    format: 'YYYY-MM-DD',
-    value: Math.round(Date.now() / 1000)
-  };
-
-  panelTitle = '日期展示';
-  panelBodyCreator = (context: BaseEventContext) => {
-    return [
-      getSchemaTpl('tabs', [
-        {
-          title: '常规',
-          body: [
-            {
-              type: 'input-date',
-              name: 'value',
-              label: '日期数值'
-            },
-            {
-              type: 'input-text',
-              name: 'format',
-              label: '显示日期格式',
-              description: '请参考 moment 中的格式用法。',
-              pipeIn: defaultValue('YYYY-MM-DD')
-            },
-            {
-              type: 'input-text',
-              name: 'valueFormat',
-              label: '数据日期格式',
-              description: '请参考 moment 中的格式用法。',
-              pipeIn: defaultValue('X')
-            },
-            {
-              name: 'placeholder',
-              type: 'input-text',
-              pipeIn: defaultValue('-'),
-              label: '占位符'
-            }
-          ]
-        },
-        {
-          title: '外观',
-          body: [getSchemaTpl('className')]
-        },
-        {
-          title: '显隐',
-          body: [getSchemaTpl('ref'), getSchemaTpl('visible')]
-        }
-      ])
-    ];
-  };
-}
-
-registerEditorPlugin(DatePlugin);

package/src/plugin/Datetime.tsx

@@ -1,75 +0,0 @@
-import {Button, SchemaObject} from 'amis';
-import React from 'react';
-import {registerEditorPlugin} from '../manager';
-import {
-  BaseEventContext,
-  BasePlugin,
-  RegionConfig,
-  RendererInfo
-} from '../plugin';
-import {defaultValue, getSchemaTpl} from '../component/schemaTpl';
-import {DatePlugin} from './Date';
-
-export class DatetimePlugin extends DatePlugin {
-  // 关联渲染器名字
-  rendererName = 'datetime';
-
-  scaffold = {
-    type: 'datetime',
-    value: Math.round(Date.now() / 1000)
-  };
-
-  name = '日期时间展示';
-  isBaseComponent = true;
-  previewSchema = {
-    ...this.scaffold,
-    format: 'YYYY-MM-DD HH:mm:ss',
-    value: Math.round(Date.now() / 1000)
-  };
-  panelBodyCreator = (context: BaseEventContext) => {
-    return [
-      getSchemaTpl('tabs', [
-        {
-          title: '常规',
-          body: [
-            {
-              type: 'input-datetime',
-              name: 'value',
-              label: '日期时间数值'
-            },
-            {
-              type: 'input-text',
-              name: 'format',
-              label: '显示日期时间格式',
-              description: '请参考 moment 中的格式用法。',
-              pipeIn: defaultValue('YYYY-MM-DD HH:mm:ss')
-            },
-            {
-              type: 'input-text',
-              name: 'valueFormat',
-              label: '数据日期格式',
-              description: '请参考 moment 中的格式用法。',
-              pipeIn: defaultValue('X')
-            },
-            {
-              name: 'placeholder',
-              type: 'input-text',
-              pipeIn: defaultValue('-'),
-              label: '占位符'
-            }
-          ]
-        },
-        {
-          title: '外观',
-          body: [getSchemaTpl('className')]
-        },
-        {
-          title: '显隐',
-          body: [getSchemaTpl('ref'), getSchemaTpl('visible')]
-        }
-      ])
-    ];
-  };
-}
-
-registerEditorPlugin(DatetimePlugin);

package/src/plugin/Dialog.tsx

@@ -1,178 +0,0 @@
-import {Button, SchemaObject} from 'amis';
-import {RendererConfig} from 'amis/lib/factory';
-import React from 'react';
-import {ContainerWrapper} from '../component/ContainerWrapper';
-import {registerEditorPlugin} from '../manager';
-import {BasePlugin, RegionConfig, RendererInfo} from '../plugin';
-import {defaultValue, getSchemaTpl} from '../component/schemaTpl';
-import {isObject, noop} from '../util';
-
-export class DialogPlugin extends BasePlugin {
-  // 关联渲染器名字
-  rendererName = 'dialog';
-  $schema = '/schemas/DialogSchema.json';
-
-  // 组件名称
-  name = '弹框';
-  isBaseComponent = true;
-  wrapperProps = {
-    wrapperComponent: InlineModal,
-    onClose: noop,
-    show: true
-  };
-
-  regions: Array<RegionConfig> = [
-    {
-      key: 'body',
-      label: '内容区',
-      renderMethod: 'renderBody',
-      renderMethodOverride: (regions, insertRegion) =>
-        function (this: any, ...args: any[]) {
-          const info: RendererInfo = this.props.$$editor;
-          const dom = this.super(...args);
-
-          if (info && args[1] === 'body') {
-            return insertRegion(this, dom, regions, info, info.plugin.manager);
-          }
-
-          return dom;
-        }
-    },
-    {
-      key: 'actions',
-      label: '按钮组',
-      renderMethod: 'renderFooter',
-      wrapperResolve: dom => dom
-    }
-  ];
-
-  panelTitle = '弹框';
-  panelBody = [
-    getSchemaTpl('tabs', [
-      {
-        title: '常规',
-        body: [
-          {
-            label: '标题',
-            type: 'input-text',
-            name: 'title'
-          },
-
-          {
-            type: 'switch',
-            label: '数据映射',
-            name: 'data',
-            mode: 'inline',
-            className: 'block m-b-xs',
-            pipeIn: (value: any) => !!value,
-            pipeOut: (value: any) => (value ? {'&': '$$'} : null)
-          },
-
-          {
-            type: 'tpl',
-            visibleOn: '!this.data',
-            tpl: '<p class="text-sm text-muted">当没开启数据映射时，弹框中默认会拥有触发打开弹框按钮所在环境的所有数据。</p>'
-          },
-
-          {
-            type: 'input-kv',
-            syncDefaultValue: false,
-            name: 'data',
-            visibleOn: 'this.data',
-            descriptionClassName: 'help-block text-xs m-b-none',
-            description:
-              '<p>当开启数据映射时，弹框中的数据只会包含设置的部分，请绑定数据。如：<code>{"a": "\\${a}", "b": 2}</code></p><p>如果希望在默认的基础上定制，请先添加一个 Key 为 `&` Value 为 `\\$$` 作为第一行。</p><div>当值为 <code>__undefined</code>时，表示删除对应的字段，可以结合<code>{"&": "\\$$"}</code>来达到黑名单效果。</div>',
-            messages: {
-              validateFailed: '数据映射中存在错误，请仔细检查'
-            }
-          },
-
-          {
-            label: '按 Esc 关闭弹框',
-            type: 'switch',
-            name: 'closeOnEsc',
-            mode: 'inline',
-            className: 'block',
-            value: false
-          },
-
-          {
-            label: '点击弹框外区域关闭弹框',
-            type: 'switch',
-            name: 'closeOnOutside',
-            mode: 'inline',
-            className: 'block',
-            value: false
-          }
-        ]
-      },
-      {
-        title: '外观',
-        body: [
-          {
-            label: '尺寸',
-            type: 'button-group-select',
-            name: 'size',
-            size: 'sm',
-            className: 'block',
-            pipeIn: defaultValue(''),
-            options: [
-              {
-                label: '小',
-                value: 'sm'
-              },
-              {
-                label: '默认',
-                value: ''
-              },
-              {
-                label: '中',
-                value: 'md'
-              },
-              {
-                label: '大',
-                value: 'lg'
-              },
-              {
-                label: '超大',
-                value: 'xl'
-              }
-            ]
-          },
-
-          {
-            label: '是否显示关闭按钮',
-            type: 'switch',
-            name: 'showCloseButton',
-            mode: 'inline',
-            className: 'block',
-            value: true
-          },
-
-          getSchemaTpl('className', {
-            name: 'headerClassName',
-            label: '顶部 CSS 类名'
-          }),
-
-          getSchemaTpl('className', {
-            name: 'bodyClassName',
-            label: '内容 CSS 类名'
-          })
-        ]
-      }
-    ])
-  ];
-
-  buildSubRenderers() {}
-}
-
-registerEditorPlugin(DialogPlugin);
-
-export class InlineModal extends React.Component<any, any> {
-  componentDidMount() {}
-
-  render() {
-    const {children} = this.props;
-    return <div className="ae-InlineModel">{children}</div>;
-  }
-}

package/src/plugin/Divider.tsx

@@ -1,36 +0,0 @@
-import {registerEditorPlugin} from '../manager';
-import {BasePlugin} from '../plugin';
-import {getSchemaTpl} from '../component/schemaTpl';
-
-export class DividerPlugin extends BasePlugin {
-  // 关联渲染器名字
-  rendererName = 'divider';
-  $schema = '/schemas/DividerSchema.json';
-
-  // 组件名称
-  name = '分隔线';
-  isBaseComponent = true;
-  icon = 'fa fa-minus';
-  description = '用来展示一个分割线，可用来做视觉上的隔离。';
-  scaffold = {
-    type: 'divider'
-  };
-  previewSchema: any = {
-    type: 'divider',
-    className: 'm-t-none m-b-none'
-  };
-
-  panelTitle = '分隔线';
-  panelBody = getSchemaTpl('tabs', [
-    {
-      title: '外观',
-      body: [getSchemaTpl('className')]
-    },
-    {
-      title: '显隐',
-      body: [getSchemaTpl('ref'), getSchemaTpl('visible')]
-    }
-  ]);
-}
-
-registerEditorPlugin(DividerPlugin);

package/src/plugin/Drawer.tsx

@@ -1,217 +0,0 @@
-import {Button, SchemaObject} from 'amis';
-import {RendererConfig} from 'amis/lib/factory';
-import React from 'react';
-import {ContainerWrapper} from '../component/ContainerWrapper';
-import {registerEditorPlugin} from '../manager';
-import {BasePlugin, RegionConfig, RendererInfo} from '../plugin';
-import {defaultValue, getSchemaTpl} from '../component/schemaTpl';
-import {isObject, noop} from '../util';
-import {InlineModal} from './Dialog';
-
-export class DrawerPlugin extends BasePlugin {
-  // 关联渲染器名字
-  rendererName = 'drawer';
-  $schema = '/schemas/DrawerSchema.json';
-
-  // 组件名称
-  name = '抽屉式弹框';
-  isBaseComponent = true;
-  wrapperProps = {
-    wrapperComponent: InlineModal,
-    onClose: noop,
-    resizable: false,
-    show: true
-  };
-
-  regions: Array<RegionConfig> = [
-    {
-      key: 'body',
-      label: '内容区',
-      renderMethod: 'renderBody',
-      renderMethodOverride: (regions, insertRegion) =>
-        function (this: any, ...args: any[]) {
-          const info: RendererInfo = this.props.$$editor;
-          const dom = this.super(...args);
-
-          if (info && args[1] === 'body') {
-            return insertRegion(this, dom, regions, info, info.plugin.manager);
-          }
-
-          return dom;
-        }
-    },
-    {
-      key: 'actions',
-      label: '按钮组',
-      renderMethod: 'renderFooter',
-      wrapperResolve: dom => dom
-    }
-  ];
-
-  panelTitle = '弹框';
-  panelBody = [
-    getSchemaTpl('tabs', [
-      {
-        title: '常规',
-        body: [
-          {
-            label: '标题',
-            type: 'input-text',
-            name: 'title'
-          },
-
-          // {
-          //   children: (
-          //     <Button
-          //       size="sm"
-          //       className="m-b-sm"
-          //       level="info"
-          //       block
-          //       onClick={() => this.manager.showInsertPanel('body')}
-          //     >
-          //       新增内容
-          //     </Button>
-          //   )
-          // },
-
-          {
-            type: 'divider'
-          },
-
-          {
-            label: '位置',
-            type: 'button-group-select',
-            name: 'position',
-            value: 'right',
-            size: 'sm',
-            mode: 'inline',
-            className: 'block',
-            options: [
-              {
-                label: '左',
-                value: 'left'
-              },
-              {
-                label: '上',
-                value: 'top'
-              },
-              {
-                label: '右',
-                value: 'right'
-              },
-              {
-                label: '下',
-                value: 'bottom'
-              }
-            ],
-            description: '定义弹框从什么位置呼出'
-          },
-
-          {
-            type: 'switch',
-            label: '数据映射',
-            name: 'data',
-            mode: 'inline',
-            className: 'w-full m-b-xs',
-            pipeIn: (value: any) => !!value,
-            pipeOut: (value: any) => (value ? {'&': '$$'} : null)
-          },
-
-          {
-            type: 'tpl',
-            visibleOn: '!this.data',
-            tpl: '<p class="text-sm text-muted">当没开启数据映射时，弹框中默认会拥有触发打开弹框按钮所在环境的所有数据。</p>'
-          },
-
-          {
-            type: 'input-kv',
-            syncDefaultValue: false,
-            name: 'data',
-            visibleOn: 'this.data',
-            descriptionClassName: 'help-block text-xs m-b-none',
-            description:
-              '<p>当开启数据映射时，弹框中的数据只会包含设置的部分，请绑定数据。如：<code>{"a": "\\${a}", "b": 2}</code></p><p>如果希望在默认的基础上定制，请先添加一个 Key 为 `&` Value 为 `\\$$` 作为第一行。</p><div>当值为 <code>__undefined</code>时，表示删除对应的字段，可以结合<code>{"&": "\\$$"}</code>来达到黑名单效果。</div>'
-          },
-
-          {
-            type: 'switch',
-            name: 'closeOnOutside',
-            label: '点击外部关闭弹框',
-            mode: 'inline',
-            className: 'block'
-          },
-
-          {
-            label: '按 Esc 可关闭？',
-            type: 'switch',
-            name: 'closeOnEsc',
-            mode: 'inline',
-            className: 'block'
-          }
-        ]
-      },
-      {
-        title: '外观',
-        body: [
-          {
-            label: '尺寸',
-            type: 'button-group-select',
-            name: 'size',
-            size: 'sm',
-            mode: 'inline',
-            className: 'block',
-            options: [
-              {
-                label: '超小',
-                value: 'xs'
-              },
-              {
-                label: '小',
-                value: 'sm'
-              },
-              {
-                label: '中',
-                value: 'md'
-              },
-              {
-                label: '大',
-                value: 'lg'
-              },
-              {
-                label: '超大',
-                value: 'xl'
-              }
-            ]
-          },
-          {
-            type: 'switch',
-            name: 'overlay',
-            label: '是否显示蒙层',
-            mode: 'inline',
-            className: 'block',
-            pipeIn: defaultValue(true)
-          },
-
-          {
-            type: 'switch',
-            name: 'resizable',
-            label: '可拉拽',
-            mode: 'inline',
-            className: 'block',
-            pipeIn: defaultValue(false),
-            description: '定义弹框是否可拉拽调整大小'
-          },
-          getSchemaTpl('className'),
-          getSchemaTpl('className', {
-            label: 'bodyClassName 类名',
-            name: 'bodyClassName'
-          })
-        ]
-      }
-    ])
-  ];
-
-  buildSubRenderers() {}
-}
-
-registerEditorPlugin(DrawerPlugin);