amis-editor 5.2.0 → 5.2.1-beta.19

package/src/plugin/Button.tsx

@@ -1,350 +0,0 @@
-import {registerEditorPlugin} from '../manager';
-import {
-  BaseEventContext,
-  BasePlugin,
-  BasicRendererInfo,
-  PluginInterface,
-  RendererInfoResolveEventContext
-} from '../plugin';
-import {defaultValue, getSchemaTpl} from '../component/schemaTpl';
-import {
-  BUTTON_DEFAULT_ACTION,
-  tipedLabel
-} from '../component/control/BaseControl';
-import {getEventControlConfig} from '../util';
-import {SchemaObject} from 'amis/lib/Schema';
-import {RendererAction, RendererEvent} from '../event-action';
-import {getOldActionSchema} from '../event-action/schema';
-
-export class ButtonPlugin extends BasePlugin {
-  // 关联渲染器名字
-  rendererName = 'button';
-  $schema = '/schemas/ActionSchema.json';
-
-  // 组件名称
-  name = '按钮';
-  isBaseComponent = true;
-  description =
-    '用来展示一个按钮，你可以配置不同的展示样式，配置不同的点击行为。';
-  docLink = '/amis/zh-CN/components/button';
-  tags = ['按钮'];
-  icon = 'fa fa-square';
-  scaffold: SchemaObject = {
-    type: 'button',
-    label: '按钮',
-    ...BUTTON_DEFAULT_ACTION
-  };
-  previewSchema: any = {
-    type: 'button',
-    label: '按钮'
-  };
-
-  panelTitle = '按钮';
-
-  // 事件定义
-  events: RendererEvent[] = [
-    {
-      eventName: 'click',
-      eventLabel: '点击',
-      description: '点击时触发',
-      defaultShow: true
-    },
-    {
-      eventName: 'mouseenter',
-      eventLabel: '鼠标移入',
-      description: '鼠标移入时触发'
-    },
-    {
-      eventName: 'mouseleave',
-      eventLabel: '鼠标移出',
-      description: '鼠标移出时触发'
-    }
-    // {
-    //   eventName: 'doubleClick',
-    //   eventLabel: '双击',
-    //   description: '鼠标双击事件'
-    // }
-  ];
-
-  // 动作定义
-  actions: RendererAction[] = [];
-
-  panelJustify = true;
-
-  panelBodyCreator = (context: BaseEventContext) => {
-    const isInDialog = /(?:\/|^)dialog\/.+$/.test(context.path);
-    const isInDrawer = /(?:\/|^)drawer\/.+$/.test(context.path);
-
-    // TODO: 旧方法无法判断，context 中没有 dropdown-button 的信息，临时实现
-    // const isInDropdown = /(?:\/|^)dropdown-button\/.+$/.test(context.path);
-    const isInDropdown = /^button-group\/.+$/.test(context.path);
-
-    return getSchemaTpl('tabs', [
-      {
-        title: '属性',
-        body: getSchemaTpl('collapseGroup', [
-          {
-            title: '基本',
-            body: [
-              {
-                label: '名称',
-                type: 'input-text',
-                name: 'label'
-              },
-
-              {
-                label: '类型',
-                type: 'button-group-select',
-                name: 'type',
-                size: 'sm',
-                options: [
-                  {
-                    label: '按钮',
-                    value: 'button'
-                  },
-
-                  {
-                    label: '提交',
-                    value: 'submit'
-                  },
-
-                  {
-                    label: '重置',
-                    value: 'reset'
-                  }
-                ]
-              },
-
-              getSchemaTpl('switch', {
-                name: 'close',
-                label: '是否关闭',
-                clearValueOnHidden: true,
-                labelRemark: `指定此次操作完后关闭当前 ${
-                  isInDialog ? 'dialog' : 'drawer'
-                }`,
-                hidden: !isInDialog && !isInDrawer,
-                pipeIn: defaultValue(false)
-              }),
-
-              {
-                type: 'ae-switch-more',
-                mode: 'normal',
-                formType: 'extend',
-                label: tipedLabel(
-                  '二次确认',
-                  '点击后先询问用户，由手动确认后再执行动作，避免误触。可用<code>\\${xxx}</code>取值。'
-                ),
-                form: {
-                  body: [
-                    {
-                      name: 'confirmText',
-                      type: 'input-text',
-                      label: '确认内容'
-                    }
-                  ]
-                }
-              },
-
-              {
-                type: 'ae-switch-more',
-                formType: 'extend',
-                mode: 'normal',
-                label: '气泡提示',
-                hidden: isInDropdown,
-                form: {
-                  body: [
-                    {
-                      type: 'input-text',
-                      name: 'tooltip',
-                      label: tipedLabel(
-                        '正常提示',
-                        '正常状态下的提示内容，不填则不弹出提示。可用<code>\\${xxx}</code>取值。'
-                      )
-                    },
-                    {
-                      type: 'input-text',
-                      name: 'disabledTip',
-                      label: tipedLabel(
-                        '禁用提示',
-                        '禁用状态下的提示内容，不填则弹出正常提示。可用<code>\\${xxx}</code>取值。'
-                      ),
-                      clearValueOnHidden: true,
-                      visibleOn: 'data.tooltipTrigger !== "focus"'
-                    },
-                    {
-                      type: 'button-group-select',
-                      name: 'tooltipTrigger',
-                      label: '触发方式',
-                      // visibleOn: 'data.tooltip || data.disabledTip',
-                      size: 'sm',
-                      options: [
-                        {
-                          label: '鼠标悬浮',
-                          value: 'hover'
-                        },
-                        {
-                          label: '聚焦',
-                          value: 'focus'
-                        }
-                      ],
-                      pipeIn: defaultValue('hover')
-                    },
-                    {
-                      type: 'button-group-select',
-                      name: 'tooltipPlacement',
-                      // visibleOn: 'data.tooltip || data.disabledTip',
-                      label: '提示位置',
-                      size: 'sm',
-                      options: [
-                        {
-                          label: '上',
-                          value: 'top'
-                        },
-                        {
-                          label: '右',
-                          value: 'right'
-                        },
-                        {
-                          label: '下',
-                          value: 'bottom'
-                        },
-                        {
-                          label: '左',
-                          value: 'left'
-                        }
-                      ],
-                      pipeIn: defaultValue('bottom')
-                    }
-                  ]
-                }
-              },
-
-              getSchemaTpl('icon', {
-                label: '左侧图标'
-              }),
-
-              getSchemaTpl('icon', {
-                name: 'rightIcon',
-                label: '右侧图标'
-              })
-            ]
-          },
-          getSchemaTpl('status', {
-            disabled: true
-          })
-        ])
-      },
-      {
-        title: '外观',
-        body: getSchemaTpl('collapseGroup', [
-          {
-            title: '基本',
-            body: [
-              getSchemaTpl('buttonLevel', {
-                label: '样式',
-                name: 'level',
-                hidden: isInDropdown
-              }),
-
-              getSchemaTpl('buttonLevel', {
-                label: '高亮样式',
-                name: 'activeLevel',
-                hidden: isInDropdown,
-                visibleOn: 'data.active'
-              }),
-
-              getSchemaTpl('switch', {
-                name: 'block',
-                label: '块状显示',
-                hidden: isInDropdown
-              }),
-
-              getSchemaTpl('size', {
-                label: '尺寸',
-                hidden: isInDropdown
-              })
-            ]
-          },
-          getSchemaTpl('style:classNames', {
-            isFormItem: false,
-            schema: [
-              getSchemaTpl('className', {
-                name: 'iconClassName',
-                label: '左侧图标',
-                visibleOn: 'this.icon'
-              }),
-              getSchemaTpl('className', {
-                name: 'rightIconClassName',
-                label: '右侧图标',
-                visibleOn: 'this.rightIcon'
-              })
-            ]
-          })
-        ])
-      },
-      {
-        title: '事件',
-        className: 'p-none',
-        body:
-          this.manager?.config.actionOptions?.showOldEntry !== false &&
-          (!!context.schema.actionType ||
-            ['submit', 'reset'].includes(context.schema.type))
-            ? [
-                getSchemaTpl('eventControl', {
-                  name: 'onEvent',
-                  ...getEventControlConfig(this.manager, context)
-                }),
-                getOldActionSchema(this.manager, context)
-              ]
-            : [
-                getSchemaTpl('eventControl', {
-                  name: 'onEvent',
-                  ...getEventControlConfig(this.manager, context)
-                })
-              ]
-      }
-    ]);
-  };
-
-  /**
-   * 如果禁用了没办法编辑
-   */
-  filterProps(props: any) {
-    props.disabled = false;
-    return props;
-  }
-
-  /**
-   * 如果配置里面有 rendererName 自动返回渲染器信息。
-   * @param renderer
-   */
-  getRendererInfo({
-    renderer,
-    schema
-  }: RendererInfoResolveEventContext): BasicRendererInfo | void {
-    const plugin: PluginInterface = 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
-      };
-    }
-  }
-}
-
-registerEditorPlugin(ButtonPlugin);

package/src/plugin/ButtonGroup.tsx

@@ -1,146 +0,0 @@
-import {registerEditorPlugin} from '../manager';
-import {BasePlugin, RegionConfig, BaseEventContext} from '../plugin';
-import {getSchemaTpl} from '../component/schemaTpl';
-import {
-  BUTTON_DEFAULT_ACTION,
-  formItemControl
-} from '../component/control/BaseControl';
-
-export class ButtonGroupPlugin extends BasePlugin {
-  // 关联渲染器名字
-  rendererName = 'button-group';
-  $schema = '/schemas/ButtonGroupSchema.json';
-
-  // 组件名称
-  name = '按钮组';
-  isBaseComponent = true;
-  description = '用来展示多个按钮，视觉上会作为一个整体呈现。';
-  tags = ['按钮'];
-  icon = 'fa fa-object-group';
-  docLink = '/amis/zh-CN/components/button-group';
-  scaffold = {
-    type: 'button-group',
-    buttons: [
-      {
-        type: 'button',
-        label: '按钮1',
-        ...BUTTON_DEFAULT_ACTION
-      },
-
-      {
-        type: 'button',
-        label: '按钮2',
-        ...BUTTON_DEFAULT_ACTION
-      }
-    ]
-  };
-  previewSchema = {
-    ...this.scaffold
-  };
-
-  panelTitle = '按钮组';
-
-  panelJustify = true;
-  panelBodyCreator = (context: BaseEventContext) => {
-    return formItemControl(
-      {
-        common: {
-          replace: true,
-          body: [
-            {
-              type: 'button-group-select',
-              name: 'vertical',
-              label: '布局方向',
-              value: false,
-              options: [
-                {
-                  label: '水平',
-                  value: false
-                },
-                {
-                  label: '垂直',
-                  value: true
-                }
-              ]
-            },
-            {
-              type: 'switch',
-              name: 'tiled',
-              label: '平铺模式',
-              inputClassName: 'is-inline',
-              value: false
-            }
-          ]
-        },
-        option: {
-          title: '按钮管理',
-          replace: true,
-          body: [
-            {
-              name: 'buttons',
-              mode: 'normal',
-              type: 'combo',
-              label: '',
-              multiple: true,
-              addable: true,
-              minLength: 1,
-              draggable: true,
-              draggableTip: '',
-              editable: false,
-              visibleOn: 'this.buttons && this.buttons.length',
-              items: [
-                {
-                  type: 'tpl',
-                  inline: false,
-                  tpl:
-                    '<span class="label label-default"><% if (data.type === "button-group") { %> 按钮组 <% } else { %><%= data.label %><% if (data.icon) { %><i class="<%= data.icon %>"/><% }%><% } %></span>'
-                }
-              ],
-              addButtonText: '新增按钮',
-              scaffold: {
-                type: 'button',
-                label: '按钮'
-              }
-            }
-          ]
-        },
-        status: {
-          replace: true,
-          body: [getSchemaTpl('hidden')]
-        },
-        style: {
-          replace: true,
-          body: [
-            getSchemaTpl('size'),
-
-            getSchemaTpl('className'),
-
-            getSchemaTpl('className', {
-              label: '按钮 CSS 类名',
-              name: 'btnClassName'
-            })
-          ]
-        },
-        validation: {
-          hidden: true
-        },
-        event: {
-          hidden: true
-        }
-      },
-      context
-    );
-  };
-
-  regions: Array<RegionConfig> = [
-    {
-      key: 'buttons',
-      label: '子按钮',
-      renderMethod: 'render',
-      preferTag: '按钮',
-      insertPosition: 'inner'
-    }
-  ];
-}
-
-registerEditorPlugin(ButtonGroupPlugin);

package/src/plugin/ButtonToolbar.tsx

@@ -1,81 +0,0 @@
-import {BasePlugin} from '../plugin';
-import {getSchemaTpl} from '../component/schemaTpl';
-
-export class ButtonToolbarPlugin extends BasePlugin {
-  // 关联渲染器名字
-  rendererName = 'button-toolbar';
-  $schema = '/schemas/ButtonToolbarSchema.json';
-  // 组件名称
-  name = '按钮工具栏';
-  isBaseComponent = true;
-  description = '可以用来放置多个按钮或者按钮组，按钮之间会存在一定的间隔';
-  tags = ['按钮'];
-  icon = 'fa fa-ellipsis-h';
-  /**
-   * 组件选择面板中隐藏，和ButtonGroup合并
-   */
-  disabledRendererPlugin = true;
-
-  scaffold = {
-    type: 'button-toolbar',
-    buttons: [
-      {
-        type: 'button',
-        label: '按钮1'
-      },
-      {
-        type: 'button',
-        label: '按钮2'
-      }
-    ]
-  };
-  previewSchema = {
-    ...this.scaffold
-  };
-
-  panelTitle = '按钮工具栏';
-  panelBody = [
-    getSchemaTpl('tabs', [
-      {
-        title: '常规',
-        body: [
-          {
-            name: 'buttons',
-            type: 'combo',
-            label: '按钮管理',
-            multiple: true,
-            addable: true,
-            draggable: true,
-            draggableTip: '可排序、可移除、如要编辑请在预览区选中编辑',
-            editable: false,
-            visibleOn: 'this.buttons && this.buttons.length',
-            items: [
-              {
-                type: 'tpl',
-                inline: false,
-                className: 'p-t-xs',
-                tpl:
-                  '<span class="label label-default"><% if (data.type === "button-group") { %> 按钮组 <% } else { %><%= data.label %><% if (data.icon) { %><i class="<%= data.icon %>"/><% }%><% } %></span>'
-              }
-            ],
-            addButtonText: '新增按钮',
-            scaffold: {
-              type: 'button',
-              label: '按钮'
-            }
-          }
-        ]
-      },
-      {
-        title: '外观',
-        body: [getSchemaTpl('className')]
-      },
-      {
-        title: '显隐',
-        body: [getSchemaTpl('ref'), getSchemaTpl('visible')]
-      }
-    ])
-  ];
-}
-// 和plugin/Form/ButtonToolbar.tsx的重复了
-// registerEditorPlugin(ButtonToolbarPlugin);