@tmagic/editor 1.0.0-beta.8 → 1.0.0-rc.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (73) hide show
  1. package/README.md +1 -0
  2. package/dist/style.css +94 -45
  3. package/dist/tmagic-editor.es.js +1622 -2069
  4. package/dist/tmagic-editor.es.js.map +1 -1
  5. package/dist/tmagic-editor.umd.js +1621 -2071
  6. package/dist/tmagic-editor.umd.js.map +1 -1
  7. package/dist/types/src/Editor.vue.d.ts +50 -2
  8. package/dist/types/src/fields/Code.vue.d.ts +4 -4
  9. package/dist/types/src/fields/CodeLink.vue.d.ts +1 -3
  10. package/dist/types/src/index.d.ts +1 -0
  11. package/dist/types/src/layouts/CodeEditor.vue.d.ts +13 -4
  12. package/dist/types/src/layouts/Framework.vue.d.ts +15 -3
  13. package/dist/types/src/layouts/PropsPanel.vue.d.ts +4 -5
  14. package/dist/types/src/layouts/sidebar/ComponentListPanel.vue.d.ts +2 -1
  15. package/dist/types/src/layouts/sidebar/Sidebar.vue.d.ts +2 -3
  16. package/dist/types/src/layouts/sidebar/TabPane.vue.d.ts +14 -0
  17. package/dist/types/src/layouts/workspace/Workspace.vue.d.ts +5 -31
  18. package/dist/types/src/services/BaseService.d.ts +5 -2
  19. package/dist/types/src/services/editor.d.ts +16 -6
  20. package/dist/types/src/services/history.d.ts +2 -18
  21. package/dist/types/src/services/props.d.ts +8 -2
  22. package/dist/types/src/services/ui.d.ts +2 -0
  23. package/dist/types/src/type.d.ts +25 -9
  24. package/dist/types/src/utils/editor.d.ts +5 -10
  25. package/dist/types/src/utils/polyfills.d.ts +0 -0
  26. package/dist/types/src/utils/props.d.ts +8 -1
  27. package/package.json +35 -12
  28. package/src/Editor.vue +44 -9
  29. package/src/components/ContentMenu.vue +140 -0
  30. package/src/components/ScrollViewer.vue +1 -1
  31. package/src/components/ToolButton.vue +72 -31
  32. package/src/fields/UISelect.vue +14 -6
  33. package/src/index.ts +2 -0
  34. package/src/layouts/AddPageBox.vue +3 -1
  35. package/src/layouts/CodeEditor.vue +20 -13
  36. package/src/layouts/Framework.vue +20 -7
  37. package/src/layouts/PropsPanel.vue +5 -4
  38. package/src/layouts/sidebar/ComponentListPanel.vue +25 -3
  39. package/src/layouts/sidebar/LayerMenu.vue +93 -95
  40. package/src/layouts/sidebar/LayerPanel.vue +80 -59
  41. package/src/layouts/sidebar/Sidebar.vue +13 -52
  42. package/src/layouts/sidebar/TabPane.vue +68 -0
  43. package/src/layouts/workspace/PageBar.vue +145 -17
  44. package/src/layouts/workspace/Stage.vue +65 -91
  45. package/src/layouts/workspace/ViewerMenu.vue +122 -68
  46. package/src/layouts/workspace/Workspace.vue +125 -42
  47. package/src/services/BaseService.ts +71 -23
  48. package/src/services/editor.ts +231 -69
  49. package/src/services/history.ts +7 -0
  50. package/src/services/props.ts +64 -9
  51. package/src/services/ui.ts +35 -5
  52. package/src/theme/common/var.scss +3 -2
  53. package/src/theme/component-list-panel.scss +2 -0
  54. package/src/theme/content-menu.scss +33 -26
  55. package/src/theme/layer-panel.scss +10 -0
  56. package/src/theme/nav-menu.scss +6 -2
  57. package/src/theme/page-bar.scss +42 -2
  58. package/src/theme/props-panel.scss +19 -17
  59. package/src/theme/workspace.scss +4 -0
  60. package/src/type.ts +27 -9
  61. package/src/utils/editor.ts +37 -56
  62. package/src/utils/polyfills.ts +8 -0
  63. package/src/utils/props.ts +50 -8
  64. package/LICENSE +0 -5432
  65. package/dist/types/src/components/ToolButton.vue.d.ts +0 -35
  66. package/dist/types/src/fields/UISelect.vue.d.ts +0 -32
  67. package/dist/types/src/layouts/sidebar/LayerMenu.vue.d.ts +0 -31
  68. package/dist/types/src/layouts/sidebar/LayerPanel.vue.d.ts +0 -973
  69. package/dist/types/src/layouts/workspace/PageBar.vue.d.ts +0 -11
  70. package/dist/types/src/layouts/workspace/Stage.vue.d.ts +0 -192
  71. package/dist/types/src/layouts/workspace/ViewerMenu.vue.d.ts +0 -18
  72. package/tsconfig.json +0 -9
  73. package/vite.config.ts +0 -30
@@ -3,7 +3,7 @@ import type { FormConfig } from '@tmagic/form';
3
3
  import type { MApp, MNode } from '@tmagic/schema';
4
4
  import type StageCore from '@tmagic/stage';
5
5
  import type { MoveableOptions } from '@tmagic/stage';
6
- import type { ComponentGroup, MenuBarData, Services, SideBarData, StageRect } from './type';
6
+ import type { ComponentGroup, MenuBarData, MenuItem, Services, SideBarData, StageRect } from './type';
7
7
  declare const _default: DefineComponent<{
8
8
  /** 页面初始值 */
9
9
  modelValue: {
@@ -20,6 +20,14 @@ declare const _default: DefineComponent<{
20
20
  sidebar: {
21
21
  type: PropType<SideBarData>;
22
22
  };
23
+ layerContentMenu: {
24
+ type: PropType<MenuItem[]>;
25
+ default: () => never[];
26
+ };
27
+ stageContentMenu: {
28
+ type: PropType<MenuItem[]>;
29
+ default: () => never[];
30
+ };
23
31
  /** 顶部工具栏配置 */
24
32
  menu: {
25
33
  type: PropType<MenuBarData>;
@@ -34,6 +42,8 @@ declare const _default: DefineComponent<{
34
42
  };
35
43
  /** 中间工作区域中画布通过iframe渲染时的页面url */
36
44
  runtimeUrl: StringConstructor;
45
+ /** 选中时是否自动滚动到可视区域 */
46
+ autoScrollIntoView: BooleanConstructor;
37
47
  /** 组件的属性配置表单的dsl */
38
48
  propsConfigs: {
39
49
  type: PropType<Record<string, FormConfig>>;
@@ -52,6 +62,9 @@ declare const _default: DefineComponent<{
52
62
  /** 画布中组件选中框的移动范围 */
53
63
  moveableOptions: {
54
64
  type: PropType<MoveableOptions | ((core?: StageCore | undefined) => MoveableOptions)>;
65
+ default: () => (core?: StageCore | undefined) => {
66
+ container: HTMLElement | null | undefined;
67
+ };
55
68
  };
56
69
  /** 编辑器初始化时默认选中的组件ID */
57
70
  defaultSelected: {
@@ -59,10 +72,18 @@ declare const _default: DefineComponent<{
59
72
  };
60
73
  canSelect: {
61
74
  type: PropType<(el: HTMLElement) => boolean | Promise<boolean>>;
75
+ default: (el: HTMLElement) => boolean;
62
76
  };
63
77
  stageRect: {
64
78
  type: PropType<StageRect>;
65
79
  };
80
+ codeOptions: {
81
+ type: ObjectConstructor;
82
+ default: () => {};
83
+ };
84
+ updateDragEl: {
85
+ type: PropType<(el: HTMLDivElement, target: HTMLElement) => void>;
86
+ };
66
87
  }, Services, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, ("props-panel-mounted" | "update:modelValue")[], "props-panel-mounted" | "update:modelValue", VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{
67
88
  /** 页面初始值 */
68
89
  modelValue: {
@@ -79,6 +100,14 @@ declare const _default: DefineComponent<{
79
100
  sidebar: {
80
101
  type: PropType<SideBarData>;
81
102
  };
103
+ layerContentMenu: {
104
+ type: PropType<MenuItem[]>;
105
+ default: () => never[];
106
+ };
107
+ stageContentMenu: {
108
+ type: PropType<MenuItem[]>;
109
+ default: () => never[];
110
+ };
82
111
  /** 顶部工具栏配置 */
83
112
  menu: {
84
113
  type: PropType<MenuBarData>;
@@ -93,6 +122,8 @@ declare const _default: DefineComponent<{
93
122
  };
94
123
  /** 中间工作区域中画布通过iframe渲染时的页面url */
95
124
  runtimeUrl: StringConstructor;
125
+ /** 选中时是否自动滚动到可视区域 */
126
+ autoScrollIntoView: BooleanConstructor;
96
127
  /** 组件的属性配置表单的dsl */
97
128
  propsConfigs: {
98
129
  type: PropType<Record<string, FormConfig>>;
@@ -111,6 +142,9 @@ declare const _default: DefineComponent<{
111
142
  /** 画布中组件选中框的移动范围 */
112
143
  moveableOptions: {
113
144
  type: PropType<MoveableOptions | ((core?: StageCore | undefined) => MoveableOptions)>;
145
+ default: () => (core?: StageCore | undefined) => {
146
+ container: HTMLElement | null | undefined;
147
+ };
114
148
  };
115
149
  /** 编辑器初始化时默认选中的组件ID */
116
150
  defaultSelected: {
@@ -118,19 +152,33 @@ declare const _default: DefineComponent<{
118
152
  };
119
153
  canSelect: {
120
154
  type: PropType<(el: HTMLElement) => boolean | Promise<boolean>>;
155
+ default: (el: HTMLElement) => boolean;
121
156
  };
122
157
  stageRect: {
123
158
  type: PropType<StageRect>;
124
159
  };
160
+ codeOptions: {
161
+ type: ObjectConstructor;
162
+ default: () => {};
163
+ };
164
+ updateDragEl: {
165
+ type: PropType<(el: HTMLDivElement, target: HTMLElement) => void>;
166
+ };
125
167
  }>> & {
126
168
  "onProps-panel-mounted"?: ((...args: any[]) => any) | undefined;
127
169
  "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
128
170
  }, {
129
- componentGroupList: ComponentGroup[];
130
171
  menu: MenuBarData;
172
+ layerContentMenu: MenuItem[];
173
+ stageContentMenu: MenuItem[];
174
+ codeOptions: Record<string, any>;
131
175
  modelValue: MApp;
176
+ componentGroupList: ComponentGroup[];
177
+ autoScrollIntoView: boolean;
132
178
  propsConfigs: Record<string, FormConfig>;
133
179
  propsValues: Record<string, MNode>;
134
180
  eventMethodList: Record<string, any>;
181
+ moveableOptions: MoveableOptions | ((core?: StageCore | undefined) => MoveableOptions);
182
+ canSelect: (el: HTMLElement) => boolean | Promise<boolean>;
135
183
  }>;
136
184
  export default _default;
@@ -16,9 +16,9 @@ declare const _default: DefineComponent<Readonly<{
16
16
  }>>> & {
17
17
  onChange?: ((...args: any[]) => any) | undefined;
18
18
  }, {
19
- name: any;
20
- config: any;
21
- model: any;
22
- prop: any;
19
+ readonly name?: any;
20
+ readonly config?: any;
21
+ readonly model?: any;
22
+ readonly prop?: any;
23
23
  }>;
24
24
  export default _default;
@@ -20,9 +20,7 @@ declare const _default: DefineComponent<{
20
20
  };
21
21
  }, {
22
22
  modelValue: Ref<{
23
- form: {
24
- [x: string]: any;
25
- };
23
+ form: Record<string, any>;
26
24
  }>;
27
25
  formConfig: ComputedRef<{
28
26
  text: string;
@@ -13,6 +13,7 @@ export { default as uiService } from './services/ui';
13
13
  export { default as ComponentListPanel } from './layouts/sidebar/ComponentListPanel.vue';
14
14
  export { default as LayerPanel } from './layouts/sidebar/LayerPanel.vue';
15
15
  export { default as PropsPanel } from './layouts/PropsPanel.vue';
16
+ export { default as ToolButton } from './components/ToolButton.vue';
16
17
  declare const _default: {
17
18
  install: (app: App, opt?: InstallOptions | undefined) => void;
18
19
  };
@@ -8,13 +8,17 @@ declare const _default: DefineComponent<{
8
8
  type: (StringConstructor | ObjectConstructor)[];
9
9
  };
10
10
  type: {
11
- type: StringConstructor[];
11
+ type: StringConstructor;
12
12
  default: () => string;
13
13
  };
14
14
  language: {
15
- type: StringConstructor[];
15
+ type: StringConstructor;
16
16
  default: () => string;
17
17
  };
18
+ options: {
19
+ type: ObjectConstructor;
20
+ default: () => {};
21
+ };
18
22
  }, {
19
23
  values: Ref<string>;
20
24
  loading: Ref<boolean>;
@@ -30,18 +34,23 @@ declare const _default: DefineComponent<{
30
34
  type: (StringConstructor | ObjectConstructor)[];
31
35
  };
32
36
  type: {
33
- type: StringConstructor[];
37
+ type: StringConstructor;
34
38
  default: () => string;
35
39
  };
36
40
  language: {
37
- type: StringConstructor[];
41
+ type: StringConstructor;
38
42
  default: () => string;
39
43
  };
44
+ options: {
45
+ type: ObjectConstructor;
46
+ default: () => {};
47
+ };
40
48
  }>> & {
41
49
  onInitd?: ((...args: any[]) => any) | undefined;
42
50
  onSave?: ((...args: any[]) => any) | undefined;
43
51
  }, {
44
52
  type: string;
45
53
  language: string;
54
+ options: Record<string, any>;
46
55
  }>;
47
56
  export default _default;
@@ -1,11 +1,23 @@
1
- import type { DefineComponent, ComputedRef, ComponentOptionsMixin, EmitsOptions, VNodeProps, AllowedComponentProps, ComponentCustomProps, ExtractPropTypes } from 'vue';
1
+ import type { DefineComponent, ComputedRef, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, ExtractPropTypes } from 'vue';
2
2
  import type { MApp } from '@tmagic/schema';
3
3
  import { GetColumnWidth } from '../type';
4
- declare const _default: DefineComponent<{}, {
4
+ declare const _default: DefineComponent<{
5
+ codeOptions: {
6
+ type: ObjectConstructor;
7
+ default: () => {};
8
+ };
9
+ }, {
5
10
  root: ComputedRef<MApp | undefined>;
6
11
  pageLength: ComputedRef<number>;
7
12
  showSrc: ComputedRef<boolean | undefined>;
8
13
  columnWidth: ComputedRef<GetColumnWidth | undefined>;
9
14
  saveCode(value: string): void;
10
- }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, EmitsOptions, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{}>>, {}>;
15
+ }, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, Record<string, any>, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{
16
+ codeOptions: {
17
+ type: ObjectConstructor;
18
+ default: () => {};
19
+ };
20
+ }>>, {
21
+ codeOptions: Record<string, any>;
22
+ }>;
11
23
  export default _default;
@@ -1,11 +1,10 @@
1
- import type { DefineComponent, Ref, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, ExtractPropTypes } from 'vue';
1
+ import type { DefineComponent, Ref, ComputedRef, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, ExtractPropTypes } from 'vue';
2
+ import type { FormValue } from '@tmagic/form';
2
3
  declare const _default: DefineComponent<{}, {
3
- values: Ref<{
4
- [x: string]: any;
5
- [x: number]: any;
6
- }>;
4
+ values: Ref<FormValue>;
7
5
  configForm: Ref<any>;
8
6
  curFormConfig: any;
7
+ propsPanelSize: ComputedRef<unknown>;
9
8
  submit(): Promise<void>;
10
9
  }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, "mounted"[], "mounted", VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{}>> & {
11
10
  onMounted?: ((...args: any[]) => any) | undefined;
@@ -7,6 +7,7 @@ declare const _default: DefineComponent<{}, {
7
7
  items: ComponentItem[];
8
8
  title: string;
9
9
  }[] | undefined>;
10
- appendComponent({ text, type, ...config }: ComponentItem): void;
10
+ appendComponent({ text, type, data }: ComponentItem): void;
11
+ dragstartHandler({ text, type, data }: ComponentItem, e: DragEvent): void;
11
12
  }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, EmitsOptions, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{}>>, {}>;
12
13
  export default _default;
@@ -1,5 +1,5 @@
1
- import type { DefineComponent, Ref, ComputedRef, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, ExtractPropTypes, PropType } from 'vue';
2
- import { SideBarData, SideComponent } from '../../type';
1
+ import type { DefineComponent, Ref, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, ExtractPropTypes, PropType } from 'vue';
2
+ import { SideBarData } from '../../type';
3
3
  declare const _default: DefineComponent<{
4
4
  data: {
5
5
  type: PropType<SideBarData>;
@@ -11,7 +11,6 @@ declare const _default: DefineComponent<{
11
11
  };
12
12
  }, {
13
13
  activeTabName: Ref<string>;
14
- items: ComputedRef<SideComponent[] | Record<string, any>[]>;
15
14
  }, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, Record<string, any>, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{
16
15
  data: {
17
16
  type: PropType<SideBarData>;
@@ -0,0 +1,14 @@
1
+ import type { DefineComponent, ComputedRef, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, ExtractPropTypes, PropType } from 'vue';
2
+ import { SideComponent, SideItem } from '../../type';
3
+ declare const _default: DefineComponent<{
4
+ data: {
5
+ type: PropType<SideItem>;
6
+ };
7
+ }, {
8
+ config: ComputedRef<SideComponent | undefined>;
9
+ }, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, Record<string, any>, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{
10
+ data: {
11
+ type: PropType<SideItem>;
12
+ };
13
+ }>>, {}>;
14
+ export default _default;
@@ -1,33 +1,7 @@
1
- import type { DefineComponent, ComputedRef, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, ExtractPropTypes, PropType } from 'vue';
2
- import type { MComponent, MContainer, MPage } from '@tmagic/schema';
3
- import type { MoveableOptions, SortEventData } from '@tmagic/stage';
4
- import StageCore from '@tmagic/stage';
5
- declare const _default: DefineComponent<{
6
- runtimeUrl: StringConstructor;
7
- render: {
8
- type: PropType<() => HTMLDivElement>;
9
- };
10
- moveableOptions: {
11
- type: PropType<MoveableOptions | ((core?: StageCore | undefined) => MoveableOptions)>;
12
- };
13
- canSelect: {
14
- type: PropType<(el: HTMLElement) => boolean | Promise<boolean>>;
15
- };
16
- }, {
1
+ import type { DefineComponent, Ref, ComputedRef, ComponentOptionsMixin, EmitsOptions, VNodeProps, AllowedComponentProps, ComponentCustomProps, ExtractPropTypes } from 'vue';
2
+ import type { MPage } from '@tmagic/schema';
3
+ declare const _default: DefineComponent<{}, {
4
+ workspace: Ref<HTMLDivElement | undefined>;
17
5
  page: ComputedRef<MPage | undefined>;
18
- selectHandler(el: HTMLElement): void;
19
- updateNodeHandler(node: MComponent | MContainer | MPage): void;
20
- sortNodeHandler(ev: SortEventData): void;
21
- }, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, Record<string, any>, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{
22
- runtimeUrl: StringConstructor;
23
- render: {
24
- type: PropType<() => HTMLDivElement>;
25
- };
26
- moveableOptions: {
27
- type: PropType<MoveableOptions | ((core?: StageCore | undefined) => MoveableOptions)>;
28
- };
29
- canSelect: {
30
- type: PropType<(el: HTMLElement) => boolean | Promise<boolean>>;
31
- };
32
- }>>, {}>;
6
+ }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, EmitsOptions, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{}>>, {}>;
33
7
  export default _default;
@@ -27,7 +27,7 @@ import { EventEmitter } from 'events';
27
27
  * editorService.afterAdd();
28
28
  * }
29
29
  *
30
- * 调用时的参数会透传到before方法的参数中, 然后before的return 会作为原方法的参数和after的参数,after最后一个参数则是原方法的return值;
30
+ * 调用时的参数会透传到before方法的参数中, 然后before的return 会作为原方法的参数和after的参数,after第一个参数则是原方法的return值;
31
31
  * 如需终止后续方法调用可以return new Error();
32
32
  *
33
33
  * 方法2:
@@ -50,7 +50,10 @@ import { EventEmitter } from 'events';
50
50
  export default class extends EventEmitter {
51
51
  private pluginOptionsList;
52
52
  private middleware;
53
- constructor(methods: string[]);
53
+ private taskList;
54
+ private doingTask;
55
+ constructor(methods?: string[], serialMethods?: string[]);
54
56
  use(options: Record<string, Function>): void;
55
57
  usePlugin(options: Record<string, Function>): void;
58
+ private doTask;
56
59
  }
@@ -9,7 +9,7 @@ declare class Editor extends BaseService {
9
9
  constructor();
10
10
  /**
11
11
  * 设置当前指点节点配置
12
- * @param name 'root' | 'page' | 'parent' | 'node'
12
+ * @param name 'root' | 'page' | 'parent' | 'node' | 'highlightNode'
13
13
  * @param value MNode
14
14
  * @returns MNode
15
15
  */
@@ -41,20 +41,28 @@ declare class Editor extends BaseService {
41
41
  /**
42
42
  * 只有容器拥有布局
43
43
  */
44
- getLayout(node: MNode): Promise<Layout>;
44
+ getLayout(parent: MNode, node?: MNode): Promise<Layout>;
45
45
  /**
46
- * 选中指点节点(将指点节点设置成当前选中状态)
47
- * @param config 指点节点配置或者ID
46
+ * 选中指定节点(将指定节点设置成当前选中状态)
47
+ * @param config 指定节点配置或者ID
48
48
  * @returns 当前选中的节点配置
49
49
  */
50
- select(config: MNode | Id): Promise<MNode>;
50
+ select(config: MNode | Id): Promise<MNode> | never;
51
+ selectNextNode(): Promise<MNode> | never;
52
+ selectNextPage(): Promise<MNode> | never;
53
+ /**
54
+ * 高亮指定节点
55
+ * @param config 指定节点配置或者ID
56
+ * @returns 当前高亮的节点配置
57
+ */
58
+ highlight(config: MNode | Id): void;
51
59
  /**
52
60
  * 向指点容器添加组件节点
53
61
  * @param addConfig 将要添加的组件节点配置
54
62
  * @param parent 要添加到的容器组件节点配置,如果不设置,默认为当前选中的组件的父节点
55
63
  * @returns 添加后的节点
56
64
  */
57
- add({ type, ...config }: AddMNode, parent?: MContainer | null): Promise<MNode>;
65
+ add(addNode: AddMNode, parent?: MContainer | null): Promise<MNode>;
58
66
  /**
59
67
  * 删除组件
60
68
  * @param {Object} node
@@ -110,12 +118,14 @@ declare class Editor extends BaseService {
110
118
  * @returns 下一步数据
111
119
  */
112
120
  redo(): Promise<StepValue | null>;
121
+ move(left: number, top: number): Promise<void>;
113
122
  destroy(): void;
114
123
  resetModifiedNodeId(): void;
115
124
  private addModifiedNodeId;
116
125
  private pushHistoryState;
117
126
  private changeHistoryState;
118
127
  private toggleFixedPosition;
128
+ private selectedConfigExceptionHandler;
119
129
  }
120
130
  export declare type EditorService = Editor;
121
131
  declare const _default: Editor;
@@ -15,28 +15,12 @@ export interface HistoryState {
15
15
  declare class History extends BaseService {
16
16
  state: {
17
17
  pageId?: Id | undefined;
18
- pageSteps: {
19
- [x: string]: {
20
- pushElement: (element: StepValue) => void;
21
- canUndo: () => boolean;
22
- undo: () => StepValue | null;
23
- canRedo: () => boolean;
24
- redo: () => StepValue | null;
25
- getCurrentElement: () => StepValue | null;
26
- };
27
- [x: number]: {
28
- pushElement: (element: StepValue) => void;
29
- canUndo: () => boolean;
30
- undo: () => StepValue | null;
31
- canRedo: () => boolean;
32
- redo: () => StepValue | null;
33
- getCurrentElement: () => StepValue | null;
34
- };
35
- };
18
+ pageSteps: Record<Id, UndoRedo<StepValue>>;
36
19
  canRedo: boolean;
37
20
  canUndo: boolean;
38
21
  };
39
22
  constructor();
23
+ reset(): void;
40
24
  changePage(page: MPage): void;
41
25
  empty(): void;
42
26
  push(state: StepValue): StepValue | null;
@@ -1,5 +1,5 @@
1
1
  import type { FormConfig } from '@tmagic/form';
2
- import type { MComponent, MNode } from '@tmagic/schema';
2
+ import type { MNode, MPage } from '@tmagic/schema';
3
3
  import BaseService from './BaseService';
4
4
  declare class Props extends BaseService {
5
5
  private state;
@@ -29,7 +29,13 @@ declare class Props extends BaseService {
29
29
  * @param type 组件类型
30
30
  * @returns 组件初始值
31
31
  */
32
- getPropsValue(type: string): Promise<MComponent>;
32
+ getPropsValue(type: string, defaultValue?: Record<string, any>): Promise<any>;
33
+ createId(type: string | number): Promise<string>;
34
+ /**
35
+ * 将组件与组件的子元素配置中的id都设置成一个新的ID
36
+ * @param {Object} config 组件配置
37
+ */
38
+ setNewItemId(config: MNode, parent?: MPage): Promise<void>;
33
39
  }
34
40
  export declare type PropsService = Props;
35
41
  declare const _default: Props;
@@ -19,11 +19,13 @@ declare const state: {
19
19
  };
20
20
  showGuides: boolean;
21
21
  showRule: boolean;
22
+ propsPanelSize: "small" | "default" | "large";
22
23
  };
23
24
  declare class Ui extends BaseService {
24
25
  constructor();
25
26
  set<T = any>(name: keyof UiState, value: T): void;
26
27
  get<T>(name: keyof typeof state): T;
28
+ zoom(zoom: number): void;
27
29
  private setColumnWidth;
28
30
  private setStageRect;
29
31
  private calcZoom;
@@ -2,6 +2,7 @@ import type { Component } from 'vue';
2
2
  import type { FormConfig } from '@tmagic/form';
3
3
  import type { Id, MApp, MContainer, MNode, MPage } from '@tmagic/schema';
4
4
  import type StageCore from '@tmagic/stage';
5
+ import type { MoveableOptions } from '@tmagic/stage';
5
6
  import type { ComponentListService } from './services/componentList';
6
7
  import type { EditorService } from './services/editor';
7
8
  import type { EventsService } from './services/events';
@@ -21,13 +22,23 @@ export interface Services {
21
22
  componentListService: ComponentListService;
22
23
  uiService: UiService;
23
24
  }
25
+ export interface StageOptions {
26
+ runtimeUrl: string;
27
+ autoScrollIntoView: boolean;
28
+ render: () => HTMLDivElement;
29
+ moveableOptions: MoveableOptions | ((core?: StageCore) => MoveableOptions);
30
+ canSelect: (el: HTMLElement) => boolean | Promise<boolean>;
31
+ updateDragEl: (el: HTMLDivElement) => void;
32
+ }
24
33
  export interface StoreState {
25
34
  root: MApp | null;
26
35
  page: MPage | null;
27
36
  parent: MContainer | null;
28
37
  node: MNode | null;
38
+ highlightNode: MNode | null;
29
39
  stage: StageCore | null;
30
40
  modifiedNodeIds: Map<Id, Id>;
41
+ pageLength: number;
31
42
  }
32
43
  export interface PropsState {
33
44
  propsConfigMap: Record<string, FormConfig>;
@@ -67,6 +78,8 @@ export interface UiState {
67
78
  showGuides: boolean;
68
79
  /** 是否显示标尺,true: 显示,false: 不显示,默认为true */
69
80
  showRule: boolean;
81
+ /** 用于控制该属性配置表单内组件的尺寸 */
82
+ propsPanelSize: 'large' | 'default' | 'small';
70
83
  }
71
84
  export interface EditorNodeInfo {
72
85
  node?: MNode;
@@ -91,6 +104,8 @@ export interface MenuButton {
91
104
  * zoom: 放大缩小
92
105
  */
93
106
  type: 'button' | 'dropdown' | 'text' | 'divider' | 'zoom';
107
+ /** 当type为divider时有效,分割线方向, 默认vertical */
108
+ direction?: 'horizontal' | 'vertical';
94
109
  /** 展示的文案 */
95
110
  text?: string;
96
111
  /** 鼠标悬浮是显示的气泡中的文案 */
@@ -102,14 +117,9 @@ export interface MenuButton {
102
117
  /** 是否显示,默认为true */
103
118
  display?: boolean | ((data?: Services) => boolean);
104
119
  /** type为button/dropdown时点击运行的方法 */
105
- handler?: (data?: Services) => Promise<any> | any;
106
- /** type为dropdown时,下拉的菜单列表 */
107
- items?: {
108
- /** 展示的文案 */
109
- text: string;
110
- /** 点击运行的方法 */
111
- handler(data: Services): any;
112
- }[];
120
+ handler?: (data: Services, event: MouseEvent) => Promise<any> | any;
121
+ /** type为dropdown时,下拉的菜单列表, 或者有子菜单时 */
122
+ items?: MenuButton[];
113
123
  }
114
124
  export interface MenuComponent {
115
125
  type: 'component';
@@ -168,7 +178,9 @@ export interface ComponentItem {
168
178
  type: string;
169
179
  /** element-plus icon class */
170
180
  icon?: string | Component;
171
- [key: string]: any;
181
+ data?: {
182
+ [key: string]: any;
183
+ };
172
184
  }
173
185
  export interface ComponentGroup {
174
186
  /** 显示文案 */
@@ -176,6 +188,10 @@ export interface ComponentGroup {
176
188
  /** 组内列表 */
177
189
  items: ComponentItem[];
178
190
  }
191
+ export interface UpdateData {
192
+ id: Id;
193
+ [key: string]: any;
194
+ }
179
195
  export declare enum LayerOffset {
180
196
  TOP = "top",
181
197
  BOTTOM = "bottom"
@@ -1,7 +1,7 @@
1
- import { MApp, MContainer, MNode, MPage } from '@tmagic/schema';
1
+ import type { MApp, MContainer, MNode, MPage } from '@tmagic/schema';
2
+ import type StageCore from '@tmagic/stage';
2
3
  import { Layout } from '../type';
3
4
  export declare const COPY_STORAGE_KEY = "$MagicEditorCopyData";
4
- export declare const generateId: (type: string | number) => string;
5
5
  /**
6
6
  * 获取所有页面配置
7
7
  * @param app DSL跟节点
@@ -26,19 +26,14 @@ export declare const generatePageName: (pageNameList: string[]) => string;
26
26
  * @returns {string}
27
27
  */
28
28
  export declare const generatePageNameByApp: (app: MApp) => string;
29
- /**
30
- * 将组件与组件的子元素配置中的id都设置成一个新的ID
31
- * @param {Object} config 组件配置
32
- */
33
- export declare const setNewItemId: (config: MNode, parent?: MPage | undefined) => void;
34
29
  /**
35
30
  * @param {Object} node
36
31
  * @returns {boolean}
37
32
  */
38
33
  export declare const isFixed: (node: MNode) => boolean;
39
- export declare const getNodeIndex: (node: MNode, parent: MContainer) => number;
34
+ export declare const getNodeIndex: (node: MNode, parent: MContainer | MApp) => number;
40
35
  export declare const toRelative: (node: MNode) => MNode;
41
- export declare const initPosition: (node: MNode, layout: Layout) => MNode;
36
+ export declare const initPosition: (node: MNode, layout: Layout, parentNode: MNode, stage: StageCore) => MNode;
42
37
  export declare const setLayout: (node: MNode, layout: Layout) => MNode;
43
38
  export declare const change2Fixed: (node: MNode, root: MApp) => MNode;
44
- export declare const Fixed2Other: (node: MNode, root: MApp, getLayout: (node: MNode) => Promise<Layout>) => Promise<MNode>;
39
+ export declare const Fixed2Other: (node: MNode, root: MApp, getLayout: (parent: MNode, node?: MNode | undefined) => Promise<Layout>) => Promise<MNode>;
File without changes
@@ -41,9 +41,16 @@ export declare const DEFAULT_CONFIG: FormConfig;
41
41
  * @param type 组件类型
42
42
  * @returns Object
43
43
  */
44
- export declare const getDefaultPropsValue: (type: string) => {
44
+ export declare const getDefaultPropsValue: (type: string, id: string) => {
45
45
  type: string;
46
46
  id: string;
47
47
  style: {};
48
48
  name: string;
49
+ items: never[];
50
+ } | {
51
+ type: string;
52
+ id: string;
53
+ style: {};
54
+ name: string;
55
+ items?: undefined;
49
56
  };