amis-editor 3.3.10 → 4.0.1-beta.16

package/dist/manager.d.ts

@@ -0,0 +1,442 @@
+/// <reference types="react" />
+/// <reference types="lodash" />
+/**
+ * @file 把一些功能性的东西放在了这个里面，辅助 compoennt/Editor.tsx 组件的。
+ * 编辑器非 UI 相关的东西应该放在这。
+ */
+import { RendererConfig, RenderOptions } from 'amis/lib/factory';
+import { PluginInterface, BasicPanelItem, RendererInfo, SubRendererInfo, PluginEvent, RegionConfig, ContextMenuItem, ContextMenuEventContext, EventContext, PluginEventFn, ScaffoldForm } from './plugin';
+import { EditorStoreType, SubEditorContext } from './store/editor';
+import { SchemaObject } from 'amis';
+import { EditorNodeType } from './store/node';
+import { EditorProps } from './component/Editor';
+import { EditorDNDManager } from './dnd';
+export interface EditorManagerConfig extends Omit<EditorProps, 'value' | 'onChange'> {
+}
+export interface PluginClass {
+    new (manager: EditorManager): PluginInterface;
+    id?: string;
+}
+/**
+ * 注册默认的插件。
+ * @param editor
+ */
+export declare function registerEditorPlugin(klass: PluginClass): void;
+/**
+ * 获取当前已经注册的插件。
+ */
+export declare function getEditorPlugins(): PluginClass[];
+/**
+ * 注销插件
+ */
+export declare function unRegisterEditorPlugin(id: string): void;
+/**
+ * 在 component/Editor.tsx 里面实例化的。
+ *
+ * 辅助 component/Editor.tsx 实现一些非 UI 相关的功能。
+ */
+export declare class EditorManager {
+    readonly config: EditorManagerConfig;
+    readonly store: EditorStoreType;
+    readonly parent?: EditorManager | undefined;
+    readonly plugins: Array<PluginInterface>;
+    readonly env: RenderOptions;
+    toDispose: Array<() => void>;
+    readonly dnd: EditorDNDManager;
+    readonly id: string;
+    disableHover: boolean;
+    private clipboardData;
+    readonly hackIn: any;
+    constructor(config: EditorManagerConfig, store: EditorStoreType, parent?: EditorManager | undefined);
+    buildEventContext(idOrNode: string | EditorNodeType): {
+        node: {
+            parentId: string;
+            parentRegion: string;
+            isCommonConfig: boolean;
+            id: string;
+            label: string;
+            regionInfo: (RegionConfig & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IMaybe<import("mobx-state-tree").IType<RegionConfig, RegionConfig, RegionConfig>>>) | undefined;
+            path: string;
+            schemaPath: string;
+            region: string;
+            preferTag: string;
+            state: any;
+            widthMutable: boolean;
+            heightMutable: boolean;
+            memberIndex: number;
+            folded: boolean;
+            patched: boolean;
+            x: number;
+            y: number;
+            w: number;
+            h: number;
+            children: import("mobx-state-tree").IMSTArray<import("mobx-state-tree").IAnyModelType> & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IArrayType<import("mobx-state-tree").IAnyModelType>, [undefined]>>;
+        } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
+            getData: import("mobx-state-tree").IType<() => any, () => any, () => any>;
+        } & {
+            readonly info: RendererInfo;
+            setInfo(value: RendererInfo): void;
+            readonly isVitualRenderer: boolean;
+            readonly clickable: boolean;
+            readonly draggable: boolean;
+            readonly moveable: boolean;
+            readonly removable: boolean;
+            readonly duplicatable: boolean;
+            readonly replaceable: boolean;
+            memberImmutable(region: string): boolean;
+            readonly isRegion: boolean;
+            readonly childRegions: any[];
+            readonly uniqueChildren: any[];
+            readonly sameIdChild: any;
+            readonly singleRegion: boolean;
+            isExists(id: string): boolean;
+            getChildById(id: string): any;
+            readonly parent: any;
+            readonly host: any;
+            readonly firstChild: any;
+            readonly index: any;
+            readonly prevSibling: any;
+            readonly nextSibling: any;
+            readonly schema: any;
+            readonly schemaParent: any;
+            readonly isSecondFactor: boolean;
+        } & {
+            updateIsCommonConfig: (value: boolean) => void;
+            addChild(props: {
+                id: string;
+                label: string;
+                path: string;
+                isCommonConfig?: boolean | undefined;
+                info?: RendererInfo | undefined;
+                region?: string | undefined;
+                getData?: (() => any) | undefined;
+                preferTag?: string | undefined;
+                schemaPath?: string | undefined;
+                regionInfo?: RegionConfig | undefined;
+                widthMutable?: boolean | undefined;
+                memberIndex?: number | undefined;
+            }): any;
+            removeChild(child: any): void;
+            toggleFold(e: import("react").MouseEvent<HTMLAnchorElement, MouseEvent>): void;
+            patch(store: any, force?: boolean): void;
+            updateSchema(value: any): void;
+            setComponent(value: any): void;
+            getComponent(): any;
+            calculateHighlightBox(root?: any): void;
+            resetHighlightBox(root: any): void;
+            updateState(state: any, replace?: boolean): void;
+            setWidthMutable(value: any): void;
+            setHeightMutable(value: any): void;
+        } & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IModelType<{
+            parentId: import("mobx-state-tree").IType<string | undefined, string, string>;
+            parentRegion: import("mobx-state-tree").IType<string | undefined, string, string>;
+            isCommonConfig: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+            id: import("mobx-state-tree").IType<string | undefined, string, string>;
+            label: import("mobx-state-tree").IType<string | undefined, string, string>;
+            regionInfo: import("mobx-state-tree").IMaybe<import("mobx-state-tree").IType<RegionConfig, RegionConfig, RegionConfig>>;
+            path: import("mobx-state-tree").IType<string | undefined, string, string>;
+            schemaPath: import("mobx-state-tree").IType<string | undefined, string, string>;
+            region: import("mobx-state-tree").IType<string | undefined, string, string>;
+            preferTag: import("mobx-state-tree").IType<string | undefined, string, string>;
+            state: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IType<any, any, any>, [undefined]>;
+            widthMutable: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+            heightMutable: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+            memberIndex: import("mobx-state-tree").IType<number | undefined, number, number>;
+            folded: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+            patched: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+            x: import("mobx-state-tree").IType<number | undefined, number, number>;
+            y: import("mobx-state-tree").IType<number | undefined, number, number>;
+            w: import("mobx-state-tree").IType<number | undefined, number, number>;
+            h: import("mobx-state-tree").IType<number | undefined, number, number>;
+            children: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IArrayType<import("mobx-state-tree").IAnyModelType>, [undefined]>;
+        }, {
+            getData: import("mobx-state-tree").IType<() => any, () => any, () => any>;
+        } & {
+            readonly info: RendererInfo;
+            setInfo(value: RendererInfo): void;
+            readonly isVitualRenderer: boolean;
+            readonly clickable: boolean;
+            readonly draggable: boolean;
+            readonly moveable: boolean;
+            readonly removable: boolean;
+            readonly duplicatable: boolean;
+            readonly replaceable: boolean;
+            memberImmutable(region: string): boolean;
+            readonly isRegion: boolean;
+            readonly childRegions: any[];
+            readonly uniqueChildren: any[];
+            readonly sameIdChild: any;
+            readonly singleRegion: boolean;
+            isExists(id: string): boolean;
+            getChildById(id: string): any;
+            readonly parent: any;
+            readonly host: any;
+            readonly firstChild: any;
+            readonly index: any;
+            readonly prevSibling: any;
+            readonly nextSibling: any;
+            readonly schema: any;
+            readonly schemaParent: any;
+            readonly isSecondFactor: boolean;
+        } & {
+            updateIsCommonConfig: (value: boolean) => void;
+            addChild(props: {
+                id: string;
+                label: string;
+                path: string;
+                isCommonConfig?: boolean | undefined;
+                info?: RendererInfo | undefined;
+                region?: string | undefined;
+                getData?: (() => any) | undefined;
+                preferTag?: string | undefined;
+                schemaPath?: string | undefined;
+                regionInfo?: RegionConfig | undefined;
+                widthMutable?: boolean | undefined;
+                memberIndex?: number | undefined;
+            }): any;
+            removeChild(child: any): void;
+            toggleFold(e: import("react").MouseEvent<HTMLAnchorElement, MouseEvent>): void;
+            patch(store: any, force?: boolean): void;
+            updateSchema(value: any): void;
+            setComponent(value: any): void;
+            getComponent(): any;
+            calculateHighlightBox(root?: any): void;
+            resetHighlightBox(root: any): void;
+            updateState(state: any, replace?: boolean): void;
+            setWidthMutable(value: any): void;
+            setHeightMutable(value: any): void;
+        }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
+        id: string;
+        info: RendererInfo;
+        path: string;
+        schemaPath: string;
+        schema: any;
+        data: string;
+    };
+    /**
+     * 构建 JSONSchema Uri，这样可以用代码模式编辑了。
+     */
+    buildJSONSchemaUri(): void;
+    buildToolbars(): void;
+    collectPanels(node: EditorNodeType, triggerEvent?: boolean, secondFactor?: boolean): BasicPanelItem[];
+    buildPanels(): void;
+    collectRenderers(region?: string, id?: string): SubRendererInfo[];
+    buildRenderers(region?: string): void;
+    rebuild(): void;
+    /**
+     * 可用组件面板里面会点进来，不同的区域可能可插入的组件不一样。
+     * @param region 区域的 key
+     */
+    switchToRegion(region: string): void;
+    /**
+     * 显示插入面板
+     * @param region
+     * @param preferTag
+     */
+    showInsertPanel(region: string, id?: string, preferTag?: string, mode?: 'insert' | 'replace', originId?: string, beforeId?: string): void;
+    /**
+     * 显示组件更换面板
+     * @param region
+     * @param preferTag
+     */
+    showReplacePanel(id: string, preferTag?: string): void;
+    readonly listeners: Array<{
+        type: string;
+        fn: PluginEventFn;
+    }>;
+    on(event: string, fn: PluginEventFn): void;
+    off(event: string, fn: PluginEventFn): void;
+    /**
+     * 派发事件。
+     * @param type
+     * @param context
+     */
+    trigger<T extends EventContext>(type: string, context: T): PluginEvent<T>;
+    /**
+     * 组件面板中的组件点选添加
+     * @param rendererId
+     */
+    addElem(rendererId: string): Promise<void>;
+    /**
+     * 给插入面板使用的，将当前选中的节点插入到当前选中的节点容器内。
+     * @param position
+     */
+    insert(): Promise<void>;
+    /**
+     * 给插入面板使用的，替换组件类型。
+     * @param position
+     */
+    replace(): Promise<void>;
+    /**
+     * 入口在 Preview 里面，用来获取渲染器对应的编辑器信息。
+     * 拿到这些信息后会在渲染原本渲染器的地方包一层，并创建高亮框在点选或者 hover 的时候显示。
+     * @param renderer  amis元素渲染器，比如 { type: 'audio', component: 'xxx渲染器'}
+     * @param path 节点路径
+     * @param schema 节点 schema 数据
+     */
+    getEditorInfo(renderer: RendererConfig, path: string, schema: any): RendererInfo | null | undefined;
+    /**
+     * 面板的配置修改方法，不直接调用 store.changeValue 的原因是，
+     * 这里面还有事件逻辑，插件里面可以写些逻辑。
+     * @param value
+     * @param diff
+     */
+    panelChangeValue(value: any, diff?: any): void;
+    /**
+     * 打开子编辑器，比如弹框什么的，没办法直接编辑器，靠弹窗个新的编辑器来编辑。
+     * @param config
+     */
+    openSubEditor(config: SubEditorContext): void;
+    /**
+     * 打开对应节点的右键菜单。
+     * @param id
+     * @param region
+     * @param info
+     */
+    openContextMenu(id: string, region: string, info: {
+        x: number;
+        y: number;
+    }): void;
+    buildContextMenus(context: ContextMenuEventContext): ContextMenuItem[];
+    closeContextMenu(): void;
+    /**
+     * 将当前选中的节点上移
+     */
+    moveUp(): void;
+    /**
+     * 将当前选中的节点下移
+     */
+    moveDown(): void;
+    /**
+     * 删除节点
+     */
+    del(ids: string | Array<string>): void;
+    /**
+     * 重复节点
+     * @param id
+     */
+    duplicate(id: string | Array<string>): void;
+    /**
+     * 复制节点配置
+     * @param id
+     */
+    copy(id: string): void;
+    /**
+     * 剪切当前节点，并复制配置到剪切板。
+     * @param id
+     */
+    cut(id: string): void;
+    /**
+     * 在节点上应用粘贴。
+     * @param id
+     * @param region
+     */
+    paste(id: string, region?: string): Promise<void>;
+    /**
+     * 清空区域
+     * @param id
+     * @param region
+     */
+    emptyRegion(id: string, region: string): void;
+    /**
+     * 添加孩子，成功后返回节点，失败后返回 null。
+     * @param id 目标组件 id
+     * @param region 目标组件区域
+     * @param json
+     * @param position
+     */
+    addChild(id: string, region: string, json: any, beforeId?: string, subRenderer?: SubRendererInfo, dragInfo?: {
+        id: string;
+        type: string;
+        data: any;
+    }): any | null;
+    /**
+     * 移动节点
+     * @param id 目标组件 id
+     * @param region 目标组件区域
+     * @param sourceId 移动的节点 id
+     * @param beforeId 移动到哪个节点前面
+     */
+    move(id: string, region: string, sourceId: string, beforeId?: string): boolean;
+    /**
+     * 替换节点。
+     * @param id
+     * @param json
+     */
+    replaceChild(id: string, json: any, subRenderer?: SubRendererInfo, region?: string): boolean;
+    setActiveId(id: string): void;
+    /**
+     * 打开某节点的编辑面板
+     * @param id
+     */
+    openConfigPanel(id: string): void;
+    /**
+     * 打开某节点的代码面板
+     * @param id
+     */
+    openCodePanel(id: string): void;
+    toggleSelection(id: string): void;
+    setSelection(selections: Array<string>, id?: string): void;
+    startDrag(id: string, e: React.DragEvent): void;
+    scaffold(form: ScaffoldForm, value: any): Promise<SchemaObject>;
+    reScaffold(id: string, form: ScaffoldForm, value: any): Promise<void>;
+    lazyPatchSchema: import("lodash").DebouncedFunc<any>;
+    patching: boolean;
+    patchSchema(force?: boolean): void;
+    /**
+     * 把设置了特殊 region 的，hack 一下。
+     */
+    hackRenderers(renderers?: RendererConfig[]): void;
+    /**
+     * 入口在 Preview，用来生成包括元素头部快捷工具栏。
+     * @param info
+     * @param render
+     */
+    makeWrapper(info: RendererInfo, render: RendererConfig): any;
+    /**
+     * 用来生成属性配置面板。
+     * @param schema
+     */
+    makeSchemaFormRender(schema: {
+        body?: Array<any>;
+        controls?: Array<any>;
+        definitions?: any;
+        api?: any;
+        submitOnChange?: boolean;
+    }): ({ value, onChange, popOverContainer, id, store, node }: import("./plugin").PanelProps) => JSX.Element;
+    onWidthChangeStart(e: MouseEvent, ctx: {
+        dom: HTMLElement;
+        node: EditorNodeType;
+        resizer: HTMLElement;
+    }): PluginEvent<{
+        nativeEvent: MouseEvent;
+        dom: HTMLElement;
+        node: EditorNodeType;
+        resizer: HTMLElement;
+    }, any>;
+    onHeightChangeStart(e: MouseEvent, ctx: {
+        dom: HTMLElement;
+        node: EditorNodeType;
+        resizer: HTMLElement;
+    }): PluginEvent<{
+        nativeEvent: MouseEvent;
+        dom: HTMLElement;
+        node: EditorNodeType;
+        resizer: HTMLElement;
+    }, any>;
+    onSizeChangeStart(e: MouseEvent, ctx: {
+        dom: HTMLElement;
+        node: EditorNodeType;
+        resizer: HTMLElement;
+    }): PluginEvent<{
+        nativeEvent: MouseEvent;
+        dom: HTMLElement;
+        node: EditorNodeType;
+        resizer: HTMLElement;
+    }, any>;
+    openNodePopOverForm(id: string | EditorNodeType): void;
+    /**
+     * 销毁函数
+     */
+    dispose(): void;
+}

package/dist/plugin/BasicToolbar.d.ts

@@ -1,6 +1,6 @@
 import { BasePlugin, BaseEventContext, BasicToolbarItem, ContextMenuItem, ContextMenuEventContext, BasicPanelItem, BuildPanelEventContext, PluginEvent, InsertEventContext } from '../plugin';
 /**
- * 用来添加一些基本的工具栏按钮。
+ * 用来给当前选中的元素添加一些基本的工具栏按钮。
  */
 export declare class BasicToolbarPlugin extends BasePlugin {
     order: number;

package/dist/plugin/Date.d.ts

@@ -8,6 +8,7 @@ export declare class DatePlugin extends BasePlugin {
     icon: string;
     scaffold: {
         type: string;
+        value: number;
     };
     previewSchema: {
         format: string;

package/dist/plugin/Datetime.d.ts

@@ -1,8 +1,10 @@
+import { BaseEventContext } from '../plugin';
 import { DatePlugin } from './Date';
 export declare class DatetimePlugin extends DatePlugin {
     rendererName: string;
     scaffold: {
         type: string;
+        value: number;
     };
     name: string;
     previewSchema: {
@@ -10,4 +12,5 @@ export declare class DatetimePlugin extends DatePlugin {
         value: number;
         type: string;
     };
+    panelBodyCreator: (context: BaseEventContext) => any[];
 }

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

@@ -0,0 +1,39 @@
+import { BasePlugin } from '../../plugin';
+export declare class CodeEditorControlPlugin extends BasePlugin {
+    rendererName: string;
+    $schema: string;
+    name: string;
+    icon: string;
+    description: string;
+    docLink: string;
+    tags: string[];
+    scaffold: {
+        type: string;
+        label: string;
+        name: string;
+    };
+    previewSchema: any;
+    panelTitle: string;
+    panelBody: ({
+        label: string;
+        name: string;
+        type: string;
+        value: string;
+        searchable: boolean;
+        options: string[];
+        size?: undefined;
+        pipeIn?: undefined;
+    } | {
+        name: string;
+        type: string;
+        size: string;
+        pipeIn: (value: any) => any;
+        label: string;
+        options: {
+            label: string;
+            value: string;
+        }[];
+        value?: undefined;
+        searchable?: undefined;
+    })[];
+}

package/dist/plugin/Form/FieldSet.d.ts

@@ -2,6 +2,7 @@ import { BaseEventContext, BasePlugin, RegionConfig } from '../../plugin';
 export declare class FieldSetControlPlugin extends BasePlugin {
     rendererName: string;
     $schema: string;
+    disabledRendererPlugin: boolean;
     name: string;
     icon: string;
     description: string;

package/dist/plugin/Form/Group.d.ts

@@ -2,6 +2,7 @@ import { BasePlugin, ContextMenuEventContext, ContextMenuItem, RegionConfig } fr
 export declare class GroupControlPlugin extends BasePlugin {
     rendererName: string;
     $schema: string;
+    disabledRendererPlugin: boolean;
     name: string;
     icon: string;
     description: string;

package/dist/plugin/Form/InputExcel.d.ts

@@ -1,5 +1,5 @@
 import { BasePlugin } from '../../plugin';
-export declare class ColorControlPlugin extends BasePlugin {
+export declare class ExcelControlPlugin extends BasePlugin {
     rendererName: string;
     $schema: string;
     name: string;
@@ -24,6 +24,7 @@ export declare class ColorControlPlugin extends BasePlugin {
         }[];
         mode?: undefined;
         className?: undefined;
+        pipeIn?: undefined;
         visibleOn?: undefined;
     } | {
         type: string;
@@ -32,6 +33,16 @@ export declare class ColorControlPlugin extends BasePlugin {
         mode: string;
         className: string;
         options?: undefined;
+        pipeIn?: undefined;
+        visibleOn?: undefined;
+    } | {
+        type: string;
+        name: string;
+        label: string;
+        pipeIn: (value: any) => any;
+        mode: string;
+        className: string;
+        options?: undefined;
         visibleOn?: undefined;
     } | {
         type: string;
@@ -41,5 +52,6 @@ export declare class ColorControlPlugin extends BasePlugin {
         visibleOn: string;
         className: string;
         options?: undefined;
+        pipeIn?: undefined;
     })[];
 }

package/dist/plugin/Form/InputGroup.d.ts

@@ -13,7 +13,6 @@ export declare class InputGroupControlPlugin extends BasePlugin {
         label: string;
         body: ({
             type: string;
-            placeholder: string;
             inputClassName: string;
             name: string;
             label?: undefined;
@@ -22,7 +21,6 @@ export declare class InputGroupControlPlugin extends BasePlugin {
             type: string;
             label: string;
             level: string;
-            placeholder?: undefined;
             inputClassName?: undefined;
             name?: undefined;
         })[];

package/dist/plugin/Form/InputKV.d.ts

@@ -0,0 +1,28 @@
+import { BasePlugin } from '../../plugin';
+export declare class KVControlPlugin extends BasePlugin {
+    rendererName: string;
+    $schema: string;
+    name: string;
+    icon: string;
+    description: string;
+    docLink: string;
+    tags: string[];
+    scaffold: {
+        type: string;
+        label: string;
+        name: string;
+    };
+    previewSchema: any;
+    panelTitle: string;
+    panelBody: ({
+        type: string;
+        name: string;
+        label: string;
+        pipeIn: (value: any) => any;
+    } | {
+        type: string;
+        name: string;
+        label: string;
+        pipeIn?: undefined;
+    })[];
+}

package/dist/plugin/Form/Item.d.ts

@@ -1,7 +1,7 @@
 import { BasePlugin, BaseEventContext, BasicPanelItem, PluginEvent, DragEventContext, ChangeEventContext, ReplaceEventContext, BuildPanelEventContext, ContextMenuEventContext, ContextMenuItem } from '../../plugin';
 export declare class ItemPlugin extends BasePlugin {
-    buildEditorPanel(context: BuildPanelEventContext, panels: Array<BasicPanelItem>): void;
     panelTitle: string;
+    buildEditorPanel(context: BuildPanelEventContext, panels: Array<BasicPanelItem>): void;
     panelBodyCreator: (context: BaseEventContext) => any[];
     onDndAccept(event: PluginEvent<DragEventContext>): false | void;
     afterUpdate(event: PluginEvent<ChangeEventContext>): void;

package/dist/plugin/Grid.d.ts

@@ -5,29 +5,26 @@ export declare class GridPlugin extends BasePlugin {
     rendererName: string;
     $schema: string;
     name: string;
+    description: string;
     tags: string[];
     icon: string;
-    scaffolds: {
-        name: string;
-        description: string;
-        scaffold: {
-            type: string;
-            columns: {
-                body: never[];
-            }[];
-        };
-        previewSchema: {
-            type: string;
-            columns: {
-                body: {
-                    type: string;
-                    tpl: string;
-                    inline: boolean;
-                    className: string;
-                }[];
+    scaffold: {
+        type: string;
+        columns: {
+            body: never[];
+        }[];
+    };
+    previewSchema: {
+        type: string;
+        columns: {
+            body: {
+                type: string;
+                tpl: string;
+                inline: boolean;
+                className: string;
             }[];
-        };
-    }[];
+        }[];
+    };
     panelTitle: string;
     panelWithOutOthers: boolean;
     panelBodyCreator(context: BaseEventContext): any[];

package/dist/plugin/HBox.d.ts

@@ -4,6 +4,7 @@ import { Schema } from 'amis/lib/types';
 export declare class HBoxPlugin extends BasePlugin {
     rendererName: string;
     $schema: string;
+    disabledRendererPlugin: boolean;
     name: string;
     icon: string;
     description: string;