@tmagic/editor 1.3.16 → 1.4.0-beta.2

package/types/services/dataSource.d.ts

@@ -1,7 +1,8 @@
+import { Writable } from 'type-fest';
 import type { EventOption } from '@tmagic/core';
 import type { FormConfig } from '@tmagic/form';
 import type { DataSourceSchema } from '@tmagic/schema';
-import type { DatasourceTypeOption } from '../type';
+import type { DatasourceTypeOption, SyncHookPlugin } from '../type';
 import BaseService from './BaseService';
 interface State {
     datasourceTypeList: DatasourceTypeOption[];
@@ -13,6 +14,11 @@ interface State {
     methods: Record<string, EventOption[]>;
 }
 type StateKey = keyof State;
+declare const canUsePluginMethods: {
+    async: never[];
+    sync: readonly ["getFormConfig", "setFormConfig", "getFormValue", "setFormValue", "getFormEvent", "setFormEvent", "getFormMethod", "setFormMethod", "add", "update", "remove", "createId"];
+};
+type SyncMethodName = Writable<(typeof canUsePluginMethods)['sync']>;
 declare class DataSource extends BaseService {
     private state;
     constructor();
@@ -38,10 +44,11 @@ declare class DataSource extends BaseService {
     };
     update(config: DataSourceSchema): DataSourceSchema;
     remove(id: string): void;
+    createId(): string;
     getDataSourceById(id: string): DataSourceSchema | undefined;
     resetState(): void;
     destroy(): void;
-    private createId;
+    usePlugin(options: SyncHookPlugin<SyncMethodName, DataSource>): void;
 }
 export type DataSourceService = DataSource;
 declare const _default: DataSource;

package/types/services/editor.d.ts

@@ -1,7 +1,13 @@
+import { Writable } from 'type-fest';
 import type { Id, MContainer, MNode } from '@tmagic/schema';
 import BaseService from '../services/BaseService';
-import type { AddMNode, EditorNodeInfo, PastePosition, StepValue, StoreState, StoreStateKey } from '../type';
+import type { AddMNode, AsyncHookPlugin, EditorNodeInfo, PastePosition, StepValue, StoreState, StoreStateKey } from '../type';
 import { LayerOffset, Layout } from '../type';
+declare const canUsePluginMethods: {
+    async: readonly ["getLayout", "highlight", "select", "multiSelect", "doAdd", "add", "doRemove", "remove", "doUpdate", "update", "sort", "copy", "paste", "doPaste", "doAlignCenter", "alignCenter", "moveLayer", "moveToContainer", "dragTo", "undo", "redo", "move"];
+    sync: never[];
+};
+type AsyncMethodName = Writable<(typeof canUsePluginMethods)['async']>;
 declare class Editor extends BaseService {
     state: StoreState;
     private isHistoryStateChange;
@@ -144,6 +150,7 @@ declare class Editor extends BaseService {
     resetState(): void;
     destroy(): void;
     resetModifiedNodeId(): void;
+    usePlugin(options: AsyncHookPlugin<AsyncMethodName, Editor>): void;
     private addModifiedNodeId;
     private pushHistoryState;
     private changeHistoryState;

package/types/services/props.d.ts

@@ -1,27 +1,19 @@
+import { Writable } from 'type-fest';
 import type { FormConfig } from '@tmagic/form';
 import type { MNode } from '@tmagic/schema';
+import type { AsyncHookPlugin, SyncHookPlugin } from '../type';
 import BaseService from './BaseService';
+declare const canUsePluginMethods: {
+    async: readonly ["setPropsConfig", "getPropsConfig", "setPropsValue", "getPropsValue", "fillConfig", "getDefaultPropsValue"];
+    sync: readonly ["createId", "setNewItemId"];
+};
+type AsyncMethodName = Writable<(typeof canUsePluginMethods)['async']>;
+type SyncMethodName = Writable<(typeof canUsePluginMethods)['sync']>;
 declare class Props extends BaseService {
     private state;
     constructor();
     setPropsConfigs(configs: Record<string, FormConfig>): void;
-    fillConfig(config: FormConfig): Promise<{
-        type: string;
-        items: {
-            [x: string]: any;
-            status?: string | undefined;
-            title: string;
-            lazy?: boolean | undefined;
-            labelWidth?: string | undefined;
-            items: FormConfig;
-            onTabClick?: ((mForm: import("@tmagic/form").FormState | undefined, tab: any, data: any) => void) | undefined;
-        }[];
-    }[]>;
-    /**
-     * 为指定类型组件设置组件属性表单配置
-     * @param type 组件类型
-     * @param config 组件属性表单配置
-     */
+    fillConfig(config: FormConfig, labelWidth?: string): Promise<FormConfig>;
     setPropsConfig(type: string, config: FormConfig): Promise<void>;
     /**
      * 获取指点类型的组件属性表单配置
@@ -41,21 +33,21 @@ declare class Props extends BaseService {
      * @param type 组件类型
      * @returns 组件初始值
      */
-    getPropsValue(type: string, { inputEvent, ...defaultValue }?: Record<string, any>): Promise<any>;
-    createId(type: string | number): Promise<string>;
+    getPropsValue(componentType: string, { inputEvent, ...defaultValue }?: Record<string, any>): Promise<any>;
+    createId(type: string | number): string;
     /**
      * 将组件与组件的子元素配置中的id都设置成一个新的ID
      * 如果没有相同ID并且force为false则保持不变
      * @param {Object} config 组件配置
      * @param {Boolean} force 是否强制设置新的ID
      */
-    setNewItemId(config: MNode, force?: boolean): Promise<MNode>;
+    setNewItemId(config: MNode, force?: boolean): MNode;
     /**
      * 获取默认属性配置
      * @param type 组件类型
      * @returns Object
      */
-    getDefaultPropsValue(type: string): Promise<{
+    getDefaultPropsValue(type: string): {
         type: string;
         layout: string;
         style: {};
@@ -67,7 +59,7 @@ declare class Props extends BaseService {
         name: string;
         layout?: undefined;
         items?: undefined;
-    }>;
+    };
     resetState(): void;
     /**
      * 替换关联ID
@@ -80,6 +72,7 @@ declare class Props extends BaseService {
      */
     clearRelateId(): void;
     destroy(): void;
+    usePlugin(options: AsyncHookPlugin<AsyncMethodName, Props> & SyncHookPlugin<SyncMethodName, Props>): void;
     /**
      * 获取setNewItemId前后映射关系
      * @param oldId 原组件ID

package/types/services/stageOverlay.d.ts

@@ -1,15 +1,22 @@
+import type { Writable } from 'type-fest';
 import StageCore from '@tmagic/stage';
 import BaseService from '../services/BaseService';
-import type { StageOptions, StageOverlayState } from '../type';
+import type { StageOptions, StageOverlayState, SyncHookPlugin } from '../type';
+declare const canUsePluginMethods: {
+    async: never[];
+    sync: readonly ["openOverlay", "closeOverlay", "updateOverlay", "createStage"];
+};
+type SyncMethodName = Writable<(typeof canUsePluginMethods)['sync']>;
 declare class StageOverlay extends BaseService {
     private state;
     constructor();
     get<K extends keyof StageOverlayState>(name: K): StageOverlayState[K];
     set<K extends keyof StageOverlayState, T extends StageOverlayState[K]>(name: K, value: T): void;
-    openOverlay(el: HTMLElement | undefined | null): void;
+    openOverlay(el: HTMLElement | null): void;
     closeOverlay(): void;
     updateOverlay(): void;
     createStage(stageOptions?: StageOptions): StageCore;
+    usePlugin(options: SyncHookPlugin<SyncMethodName, StageOverlay>): void;
     private createContentEl;
     private copyDocumentElement;
     private render;

package/types/services/storage.d.ts

@@ -1,3 +1,5 @@
+import type { Writable } from 'type-fest';
+import type { SyncHookPlugin } from '../type';
 import BaseService from './BaseService';
 interface Options {
     namespace?: string;
@@ -10,6 +12,11 @@ export declare enum Protocol {
     NUMBER = "number",
     BOOLEAN = "boolean"
 }
+declare const canUsePluginMethods: {
+    async: never[];
+    sync: readonly ["getStorage", "getNamespace", "clear", "getItem", "removeItem", "setItem"];
+};
+type SyncMethodName = Writable<(typeof canUsePluginMethods)['sync']>;
 /**
  * 数据存储服务
  */
@@ -50,6 +57,7 @@ export declare class WebStorage extends BaseService {
      */
     setItem(key: string, value: any, options?: Options): void;
     destroy(): void;
+    usePlugin(options: SyncHookPlugin<SyncMethodName, WebStorage>): void;
     private getValueAndProtocol;
 }
 export type StorageService = WebStorage;

package/types/services/ui.d.ts

@@ -1,5 +1,11 @@
-import type { UiState } from '../type';
+import type { Writable } from 'type-fest';
+import type { AsyncHookPlugin, UiState } from '../type';
 import BaseService from './BaseService';
+declare const canUsePluginMethods: {
+    async: readonly ["zoom", "calcZoom"];
+    sync: readonly [];
+};
+type AsyncMethodName = Writable<(typeof canUsePluginMethods)['async']>;
 declare class Ui extends BaseService {
     constructor();
     set<K extends keyof UiState, T extends UiState[K]>(name: K, value: T): void;
@@ -22,21 +28,27 @@ declare class Ui extends BaseService {
         };
         showGuides: boolean;
         showRule: boolean;
-        propsPanelSize: "default" | "small" | "large";
+        propsPanelSize: "small" | "large" | "default";
         showAddPageButton: boolean;
-        floatBox: Map<string, {
-            status: boolean;
-            zIndex: number;
+        hideSlideBar: boolean;
+        navMenuRect: {
+            left: number;
             top: number;
+            width: number;
+            height: number;
+        };
+        frameworkRect: {
             left: number;
-        }>;
-        hideSlideBar: boolean;
+            top: number;
+            width: number;
+            height: number;
+        };
     }[K];
     zoom(zoom: number): Promise<void>;
     calcZoom(): Promise<number>;
-    setFloatBox(keys: string[]): Promise<void>;
     resetState(): void;
     destroy(): void;
+    usePlugin(options: AsyncHookPlugin<AsyncMethodName, Ui>): void;
     private setStageRect;
 }
 export type UiService = Ui;

package/types/type.d.ts

@@ -1,6 +1,7 @@
 import type { Component } from 'vue';
-import type { ColumnConfig, FilterFunction, FormConfig, FormItem } from '@tmagic/form';
-import type { CodeBlockContent, CodeBlockDSL, Id, MApp, MContainer, MNode, MPage, MPageFragment } from '@tmagic/schema';
+import type { PascalCasedProperties } from 'type-fest';
+import type { ChildConfig, ColumnConfig, FilterFunction, FormConfig, FormItem, Input } from '@tmagic/form';
+import type { CodeBlockContent, CodeBlockDSL, DataSourceFieldType, Id, MApp, MContainer, MNode, MPage, MPageFragment } from '@tmagic/schema';
 import type StageCore from '@tmagic/stage';
 import type { ContainerHighlightType, CustomizeMoveableOptionsCallbackConfig, GuidesOptions, MoveableOptions, RenderType, UpdateDragEl } from '@tmagic/stage';
 import type { CodeBlockService } from './services/codeBlock';
@@ -191,15 +192,20 @@ export interface UiState {
     propsPanelSize: 'large' | 'default' | 'small';
     /** 是否显示新增页面按钮 */
     showAddPageButton: boolean;
-    /** slide 拖拽悬浮窗 state */
-    floatBox: Map<string, {
-        status: boolean;
-        zIndex: number;
-        top: number;
-        left: number;
-    }>;
     /** 是否隐藏侧边栏 */
     hideSlideBar: boolean;
+    navMenuRect: {
+        left: number;
+        top: number;
+        width: number;
+        height: number;
+    };
+    frameworkRect: {
+        left: number;
+        top: number;
+        width: number;
+        height: number;
+    };
 }
 export interface EditorNodeInfo {
     node: MNode | null;
@@ -506,39 +512,40 @@ export interface KeyBindingCacheItem {
     eventType: 'keyup' | 'keydown';
     bound: boolean;
 }
-export interface CodeSelectColConfig {
+export interface CodeSelectColConfig extends FormItem {
     type: 'code-select-col';
-    name: string;
-    text: string;
-    labelWidth?: number | string;
-    disabled?: boolean | FilterFunction;
+    /** 是否可以编辑代码块，disable表示的是是否可以选择代码块 */
     notEditable?: boolean | FilterFunction;
-    display?: boolean | FilterFunction;
 }
-export interface PageFragmentSelectConfig {
+export interface PageFragmentSelectConfig extends FormItem {
     type: 'page-fragment-select';
-    name: string;
-    text: string;
-    labelWidth?: number | string;
-    disabled?: boolean | FilterFunction;
-    display?: boolean | FilterFunction;
 }
-export interface DataSourceMethodSelectConfig {
+export interface DataSourceSelect extends FormItem, Input {
+    type: 'data-source-select';
+    /** 数据源类型: base、http... */
+    dataSourceType?: string;
+    /** 是否要编译成数据源的data。
+     * id: 不编译，就是要数据源id;
+     * value: 要编译（数据源data）
+     * */
+    value?: 'id' | 'value';
+}
+export interface DataSourceMethodSelectConfig extends FormItem {
     type: 'data-source-method-select';
-    name: string;
-    text: string;
-    labelWidth?: number | string;
-    disabled?: boolean | FilterFunction;
+    /** 是否可以编辑数据源，disable表示的是是否可以选择数据源 */
     notEditable?: boolean | FilterFunction;
-    display?: boolean | FilterFunction;
 }
-export interface DataSourceFieldSelectConfig {
+export interface DataSourceFieldSelectConfig extends FormItem {
     type: 'data-source-field-select';
-    name: string;
+    /** 是否要编译成数据源的data。
+     * key: 不编译，就是要数据源id和field name;
+     * value: 要编译（数据源data[`${filed}`]）
+     * */
     value?: 'key' | 'value';
-    labelWidth?: number | string;
-    disabled?: boolean | FilterFunction;
-    display?: boolean | FilterFunction;
+    /** 是否严格的遵守父子节点不互相关联 */
+    checkStrictly?: boolean;
+    dataSourceFieldType?: DataSourceFieldType[];
+    fieldConfig?: ChildConfig;
 }
 /** 可新增的数据源类型选项 */
 export interface DatasourceTypeOption {
@@ -573,3 +580,20 @@ export interface TreeNodeData {
     items?: TreeNodeData[];
     [key: string]: any;
 }
+export type AsyncBeforeHook<Value extends Array<string>, C extends Record<Value[number], (...args: any) => any>> = {
+    [K in Value[number]]?: (...args: Parameters<C[K]>) => Promise<Parameters<C[K]>> | Parameters<C[K]>;
+};
+export type AsyncAfterHook<Value extends Array<string>, C extends Record<Value[number], (...args: any) => any>> = {
+    [K in Value[number]]?: (result: Awaited<ReturnType<C[K]>>, ...args: Parameters<C[K]>) => ReturnType<C[K]> | Awaited<ReturnType<C[K]>>;
+};
+export type SyncBeforeHook<Value extends Array<string>, C extends Record<Value[number], (...args: any) => any>> = {
+    [K in Value[number]]?: (...args: Parameters<C[K]>) => Parameters<C[K]>;
+};
+export type SyncAfterHook<Value extends Array<string>, C extends Record<Value[number], (...args: any) => any>> = {
+    [K in Value[number]]?: (result: ReturnType<C[K]>, ...args: Parameters<C[K]>) => ReturnType<C[K]>;
+};
+export type AddPrefixToObject<T, P extends string> = {
+    [K in keyof T as K extends string ? `${P}${K}` : never]: T[K];
+};
+export type AsyncHookPlugin<T extends Array<string>, C extends Record<T[number], (...args: any) => any>> = AddPrefixToObject<PascalCasedProperties<AsyncBeforeHook<T, C>>, 'before'> & AddPrefixToObject<PascalCasedProperties<AsyncAfterHook<T, C>>, 'after'>;
+export type SyncHookPlugin<T extends Array<string>, C extends Record<T[number], (...args: any) => any>> = AddPrefixToObject<PascalCasedProperties<SyncBeforeHook<T, C>>, 'before'> & AddPrefixToObject<PascalCasedProperties<SyncAfterHook<T, C>>, 'after'>;

package/types/utils/operator.d.ts

@@ -6,7 +6,7 @@ import type { AddMNode, PastePosition } from '../type';
  * @param config 待粘贴的元素配置(复制时保存的那份配置)
  * @returns
  */
-export declare const beforePaste: (position: PastePosition, config: MNode[]) => Promise<MNode[]>;
+export declare const beforePaste: (position: PastePosition, config: MNode[]) => MNode[];
 /**
  * 将元素粘贴到容器内时，将相对于画布坐标转换为相对于容器的坐标
  * @param position PastePosition 粘贴时相对于画布的坐标

package/types/utils/props.d.ts

@@ -1,4 +1,4 @@
-import type { FormConfig, FormState, TabPaneConfig } from '@tmagic/form';
+import type { FormConfig, TabPaneConfig } from '@tmagic/form';
 export declare const styleTabConfig: TabPaneConfig;
 export declare const eventTabConfig: TabPaneConfig;
 export declare const advancedTabConfig: TabPaneConfig;
@@ -8,15 +8,4 @@ export declare const displayTabConfig: TabPaneConfig;
  * @param config 组件属性配置
  * @returns Object
  */
-export declare const fillConfig: (config?: FormConfig) => {
-    type: string;
-    items: {
-        [x: string]: any;
-        status?: string | undefined;
-        title: string;
-        lazy?: boolean | undefined;
-        labelWidth?: string | undefined;
-        items: FormConfig;
-        onTabClick?: ((mForm: FormState | undefined, tab: any, data: any) => void) | undefined;
-    }[];
-}[];
+export declare const fillConfig: (config?: FormConfig, labelWidth?: string) => FormConfig;