@tmagic/editor 1.3.6 → 1.3.7

package/types/layouts/sidebar/layer/use-click.d.ts

@@ -5,17 +5,26 @@ export declare const useClick: (services: Services | undefined, isCtrlKeyDown: R
     menu: Ref<({
         $: import("vue").ComponentInternalInstance;
         $data: {};
-        $props: Partial<{}> & Omit<{
+        $props: Partial<{
+            layerContentMenu: (import("../../../type").MenuButton | import("../../../type").MenuComponent)[];
+            customContentMenu: (menus: (import("../../../type").MenuButton | import("../../../type").MenuComponent)[], type: string) => (import("../../../type").MenuButton | import("../../../type").MenuComponent)[];
+        }> & Omit<{
             readonly layerContentMenu: (import("../../../type").MenuButton | import("../../../type").MenuComponent)[];
+            readonly customContentMenu: (menus: (import("../../../type").MenuButton | import("../../../type").MenuComponent)[], type: string) => (import("../../../type").MenuButton | import("../../../type").MenuComponent)[];
             "onCollapse-all"?: (() => any) | undefined;
         } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & Readonly<import("vue").ExtractPropTypes<{
             layerContentMenu: {
                 type: import("vue").PropType<(import("../../../type").MenuButton | import("../../../type").MenuComponent)[]>;
                 required: true;
+                default: () => never[];
+            };
+            customContentMenu: {
+                type: import("vue").PropType<(menus: (import("../../../type").MenuButton | import("../../../type").MenuComponent)[], type: string) => (import("../../../type").MenuButton | import("../../../type").MenuComponent)[]>;
+                default: (menus: (import("../../../type").MenuButton | import("../../../type").MenuComponent)[]) => (import("../../../type").MenuButton | import("../../../type").MenuComponent)[];
             };
         }>> & {
             "onCollapse-all"?: (() => any) | undefined;
-        }, never>;
+        }, "layerContentMenu" | "customContentMenu">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -33,6 +42,11 @@ export declare const useClick: (services: Services | undefined, isCtrlKeyDown: R
             layerContentMenu: {
                 type: import("vue").PropType<(import("../../../type").MenuButton | import("../../../type").MenuComponent)[]>;
                 required: true;
+                default: () => never[];
+            };
+            customContentMenu: {
+                type: import("vue").PropType<(menus: (import("../../../type").MenuButton | import("../../../type").MenuComponent)[], type: string) => (import("../../../type").MenuButton | import("../../../type").MenuComponent)[]>;
+                default: (menus: (import("../../../type").MenuButton | import("../../../type").MenuComponent)[]) => (import("../../../type").MenuButton | import("../../../type").MenuComponent)[];
             };
         }>> & {
             "onCollapse-all"?: (() => any) | undefined;
@@ -40,7 +54,10 @@ export declare const useClick: (services: Services | undefined, isCtrlKeyDown: R
             show: (e: MouseEvent) => void;
         }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
             "collapse-all": () => void;
-        }, string, {}, {}, string, {}> & {
+        }, string, {
+            layerContentMenu: (import("../../../type").MenuButton | import("../../../type").MenuComponent)[];
+            customContentMenu: (menus: (import("../../../type").MenuButton | import("../../../type").MenuComponent)[], type: string) => (import("../../../type").MenuButton | import("../../../type").MenuComponent)[];
+        }, {}, string, {}> & {
             beforeCreate?: ((() => void) | (() => void)[]) | undefined;
             created?: ((() => void) | (() => void)[]) | undefined;
             beforeMount?: ((() => void) | (() => void)[]) | undefined;
@@ -64,6 +81,11 @@ export declare const useClick: (services: Services | undefined, isCtrlKeyDown: R
         layerContentMenu: {
             type: import("vue").PropType<(import("../../../type").MenuButton | import("../../../type").MenuComponent)[]>;
             required: true;
+            default: () => never[];
+        };
+        customContentMenu: {
+            type: import("vue").PropType<(menus: (import("../../../type").MenuButton | import("../../../type").MenuComponent)[], type: string) => (import("../../../type").MenuButton | import("../../../type").MenuComponent)[]>;
+            default: (menus: (import("../../../type").MenuButton | import("../../../type").MenuComponent)[]) => (import("../../../type").MenuButton | import("../../../type").MenuComponent)[];
         };
     }>> & {
         "onCollapse-all"?: (() => any) | undefined;

package/types/layouts/sidebar/layer/use-keybinding.d.ts

@@ -1,6 +1,6 @@
 import { type Ref } from 'vue';
 import Tree from '../../../components/Tree.vue';
 import type { Services } from '../../../type';
-export declare const useKeybinding: (services: Services | undefined, contianer: Ref<InstanceType<typeof Tree> | undefined>) => {
+export declare const useKeybinding: (services: Services | undefined, container: Ref<InstanceType<typeof Tree> | undefined>) => {
     isCtrlKeyDown: Ref<boolean>;
 };

package/types/layouts/workspace/Workspace.vue.d.ts

@@ -1,8 +1,10 @@
 import type { MenuButton, MenuComponent, WorkspaceSlots } from '../../type';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_TypePropsToRuntimeProps<{
     stageContentMenu: (MenuButton | MenuComponent)[];
+    customContentMenu?: ((menus: (MenuButton | MenuComponent)[], type: string) => (MenuButton | MenuComponent)[]) | undefined;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
     stageContentMenu: (MenuButton | MenuComponent)[];
+    customContentMenu?: ((menus: (MenuButton | MenuComponent)[], type: string) => (MenuButton | MenuComponent)[]) | undefined;
 }>>>, {}, {}>, Readonly<WorkspaceSlots>>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;

package/types/layouts/workspace/viewer/Stage.vue.d.ts

@@ -1,8 +1,10 @@
 import { type MenuButton, type MenuComponent } from '../../../type';
 declare const _default: import("vue").DefineComponent<__VLS_TypePropsToRuntimeProps<{
     stageContentMenu: (MenuButton | MenuComponent)[];
+    customContentMenu?: ((menus: (MenuButton | MenuComponent)[], type: string) => (MenuButton | MenuComponent)[]) | undefined;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
     stageContentMenu: (MenuButton | MenuComponent)[];
+    customContentMenu?: ((menus: (MenuButton | MenuComponent)[], type: string) => (MenuButton | MenuComponent)[]) | undefined;
 }>>>, {}, {}>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;

package/types/layouts/workspace/viewer/ViewerMenu.vue.d.ts

@@ -2,17 +2,25 @@ import { MenuButton, MenuComponent } from '../../../type';
 declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     isMultiSelect?: boolean | undefined;
     stageContentMenu: (MenuButton | MenuComponent)[];
+    customContentMenu?: ((menus: (MenuButton | MenuComponent)[], type: string) => (MenuButton | MenuComponent)[]) | undefined;
 }>, {
     isMultiSelect: boolean;
+    stageContentMenu: () => never[];
+    customContentMenu: (menus: (MenuButton | MenuComponent)[]) => (MenuButton | MenuComponent)[];
 }>, {
     show: (e: MouseEvent) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     isMultiSelect?: boolean | undefined;
     stageContentMenu: (MenuButton | MenuComponent)[];
+    customContentMenu?: ((menus: (MenuButton | MenuComponent)[], type: string) => (MenuButton | MenuComponent)[]) | undefined;
 }>, {
     isMultiSelect: boolean;
+    stageContentMenu: () => never[];
+    customContentMenu: (menus: (MenuButton | MenuComponent)[]) => (MenuButton | MenuComponent)[];
 }>>>, {
+    customContentMenu: (menus: (MenuButton | MenuComponent)[], type: string) => (MenuButton | MenuComponent)[];
     isMultiSelect: boolean;
+    stageContentMenu: (MenuButton | MenuComponent)[];
 }, {}>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;

package/types/services/dataSource.d.ts

@@ -33,6 +33,7 @@ declare class DataSource extends BaseService {
         fields: import("@tmagic/schema").DataSchema[];
         methods: import("@tmagic/schema").CodeBlockContent[];
         mocks?: import("@tmagic/schema").MockSchema[] | undefined;
+        disabledInitInJsEngine?: string[] | undefined;
     };
     update(config: DataSourceSchema): DataSourceSchema;
     remove(id: string): void;

package/types/services/editor.d.ts

@@ -8,13 +8,13 @@ declare class Editor extends BaseService {
     constructor();
     /**
      * 设置当前指点节点配置
-     * @param name 'root' | 'page' | 'parent' | 'node' | 'highlightNode' | 'nodes' | 'stage' | 'modifiedNodeIds' | 'pageLength'
+     * @param name 'root' | 'page' | 'parent' | 'node' | 'highlightNode' | 'nodes' | 'stage' | 'modifiedNodeIds' | 'pageLength' | 'pageFragmentLength
      * @param value MNode
      */
     set<K extends StoreStateKey, T extends StoreState[K]>(name: K, value: T): void;
     /**
      * 获取当前指点节点配置
-     * @param name  'root' | 'page' | 'parent' | 'node' | 'highlightNode' | 'nodes' | 'stage' | 'modifiedNodeIds' | 'pageLength'
+     * @param name  'root' | 'page' | 'parent' | 'node' | 'highlightNode' | 'nodes' | 'stage' | 'modifiedNodeIds' | 'pageLength' | 'pageFragmentLength'
      * @returns MNode
      */
     get<K extends StoreStateKey>(name: K): StoreState[K];
@@ -63,6 +63,7 @@ declare class Editor extends BaseService {
      * @returns 加入多选的节点配置
      */
     multiSelect(ids: Id[]): void;
+    selectRoot(): void;
     doAdd(node: MNode, parent: MContainer): Promise<MNode>;
     /**
      * 向指点容器添加组件节点

package/types/services/history.d.ts

@@ -1,4 +1,4 @@
-import type { MPage } from '@tmagic/schema';
+import type { MPage, MPageFragment } from '@tmagic/schema';
 import type { StepValue } from '../type';
 import { UndoRedo } from '../utils/undo-redo';
 import BaseService from './BaseService';
@@ -11,7 +11,8 @@ declare class History extends BaseService {
     };
     constructor();
     reset(): void;
-    changePage(page: MPage): void;
+    resetPage(): void;
+    changePage(page: MPage | MPageFragment): void;
     resetState(): void;
     push(state: StepValue): StepValue | null;
     undo(): StepValue | null;

package/types/services/keybinding.d.ts

@@ -5,11 +5,31 @@ declare class Keybinding extends BaseService {
     private controllers;
     private bindingList;
     private commands;
+    registerCommand(command: string, handler: (e: KeyboardEvent) => void | Promise<void>): void;
+    /**
+     * @deprecated
+     */
     registeCommand(command: string, handler: (e: KeyboardEvent) => void | Promise<void>): void;
+    unregisterCommand(command: string): void;
+    /**
+     * @deprecated
+     */
     unregisteCommand(command: string): void;
+    registerEl(name: string, el?: HTMLElement): void;
+    /**
+     * @deprecated
+     */
     registeEl(name: string, el?: HTMLElement): void;
+    unregisterEl(name: string): void;
+    /**
+     * @deprecated
+     */
     unregisteEl(name: string): void;
-    registe(maps: KeyBindingItem[]): void;
+    register(maps: KeyBindingItem[]): void;
+    /**
+     * @deprecated
+     */
+    registe(map: KeyBindingItem[]): void;
     reset(): void;
     destroy(): void;
     private bind;

package/types/type.d.ts

@@ -1,8 +1,8 @@
 import type { Component } from 'vue';
 import type { ColumnConfig, FilterFunction, FormConfig, FormItem } from '@tmagic/form';
-import type { CodeBlockContent, CodeBlockDSL, Id, MApp, MContainer, MNode, MPage } from '@tmagic/schema';
+import type { CodeBlockContent, CodeBlockDSL, Id, MApp, MContainer, MNode, MPage, MPageFragment } from '@tmagic/schema';
 import type StageCore from '@tmagic/stage';
-import type { ContainerHighlightType, CustomizeMoveableOptionsCallbackConfig, MoveableOptions, RenderType, UpdateDragEl } from '@tmagic/stage';
+import type { ContainerHighlightType, CustomizeMoveableOptionsCallbackConfig, GuidesOptions, MoveableOptions, RenderType, UpdateDragEl } from '@tmagic/stage';
 import type { CodeBlockService } from './services/codeBlock';
 import type { ComponentListService } from './services/componentList';
 import type { DataSourceService } from './services/dataSource';
@@ -26,17 +26,17 @@ export interface FrameworkSlots {
     workspace(props: {}): any;
     'props-panel'(props: {}): any;
     'footer'(props: {}): any;
-}
-export interface WorkspaceSlots {
-    stage(props: {}): any;
-    'workspace-content'(props: {}): any;
     'page-bar-title'(props: {
-        page: MPage;
+        page: MPage | MPageFragment;
     }): any;
     'page-bar-popover'(props: {
-        page: MPage;
+        page: MPage | MPageFragment;
     }): any;
 }
+export interface WorkspaceSlots {
+    stage(props: {}): any;
+    'workspace-content'(props: {}): any;
+}
 export interface ComponentListPanelSlots {
     'component-list-panel-header'(props: {}): any;
     'component-list-item'(props: {
@@ -108,17 +108,22 @@ export interface StageOptions {
     isContainer: (el: HTMLElement) => boolean | Promise<boolean>;
     updateDragEl: UpdateDragEl;
     renderType: RenderType;
+    guidesOptions: Partial<GuidesOptions>;
+    disabledMultiSelect?: boolean;
 }
 export interface StoreState {
     root: MApp | null;
-    page: MPage | null;
+    page: MPage | MPageFragment | null;
     parent: MContainer | null;
     node: MNode | null;
     highlightNode: MNode | null;
     nodes: MNode[];
     stage: StageCore | null;
+    stageLoading: boolean;
     modifiedNodeIds: Map<Id, Id>;
     pageLength: number;
+    pageFragmentLength: number;
+    disabledMultiSelect: boolean;
 }
 export type StoreStateKey = keyof StoreState;
 export interface PropsState {
@@ -185,7 +190,7 @@ export interface UiState {
 export interface EditorNodeInfo {
     node: MNode | null;
     parent: MContainer | null;
-    page: MPage | null;
+    page: MPage | MPageFragment | null;
 }
 export interface AddMNode {
     type: string;
@@ -407,7 +412,7 @@ export interface CodeParamStatement {
     [key: string]: any;
 }
 export interface StepValue {
-    data: MPage;
+    data: MPage | MPageFragment;
     modifiedNodeIds: Map<Id, Id>;
     nodeId: Id;
 }
@@ -485,7 +490,7 @@ export interface KeyBindingCacheItem {
     command: KeyBindingCommand | string;
     keybinding?: string | string[];
     eventType: 'keyup' | 'keydown';
-    binded: boolean;
+    bound: boolean;
 }
 export interface CodeSelectColConfig {
     type: 'code-select-col';
@@ -495,6 +500,14 @@ export interface CodeSelectColConfig {
     disabled?: boolean | FilterFunction;
     display?: boolean | FilterFunction;
 }
+export interface PageFragmentSelectConfig {
+    type: 'page-fragment-select';
+    name: string;
+    text: string;
+    labelWidth?: number | string;
+    disabled?: boolean | FilterFunction;
+    display?: boolean | FilterFunction;
+}
 export interface DataSourceMethodSelectConfig {
     type: 'data-source-method-select';
     name: string;

package/types/utils/editor.d.ts

@@ -1,31 +1,33 @@
-import type { Id, MApp, MContainer, MNode, MPage } from '@tmagic/schema';
+import type { Id, MApp, MContainer, MNode, MPage, MPageFragment } from '@tmagic/schema';
+import { NodeType } from '@tmagic/schema';
 import type StageCore from '@tmagic/stage';
 import { Layout } from '../type';
 export declare const COPY_STORAGE_KEY = "$MagicEditorCopyData";
 /**
  * 获取所有页面配置
- * @param app DSL跟节点
+ * @param root DSL跟节点
  * @returns 所有页面配置
  */
-export declare const getPageList: (app: MApp) => MPage[];
+export declare const getPageList: (root?: MApp | null) => MPage[];
+export declare const getPageFragmentList: (root?: MApp | null) => MPageFragment[];
 /**
  * 获取所有页面名称
  * @param pages 所有页面配置
  * @returns 所有页面名称
  */
-export declare const getPageNameList: (pages: MPage[]) => string[];
+export declare const getPageNameList: (pages: (MPage | MPageFragment)[]) => string[];
 /**
  * 新增页面时，生成页面名称
  * @param {Object} pageNameList 所有页面名称
  * @returns {string}
  */
-export declare const generatePageName: (pageNameList: string[]) => string;
+export declare const generatePageName: (pageNameList: string[], type: NodeType.PAGE | NodeType.PAGE_FRAGMENT) => string;
 /**
  * 新增页面时，生成页面名称
  * @param {Object} app 所有页面配置
  * @returns {string}
  */
-export declare const generatePageNameByApp: (app: MApp) => string;
+export declare const generatePageNameByApp: (app: MApp, type: NodeType.PAGE | NodeType.PAGE_FRAGMENT) => string;
 /**
  * @param {Object} node
  * @returns {boolean}
@@ -34,7 +36,7 @@ export declare const isFixed: (node: MNode) => boolean;
 export declare const getNodeIndex: (id: Id, parent: MContainer | MApp) => number;
 export declare const getRelativeStyle: (style?: Record<string, any>) => Record<string, any>;
 export declare const getInitPositionStyle: (style: Record<string, any> | undefined, layout: Layout) => Record<string, any>;
-export declare const setChilrenLayout: (node: MContainer, layout: Layout) => MContainer;
+export declare const setChildrenLayout: (node: MContainer, layout: Layout) => MContainer;
 export declare const setLayout: (node: MNode, layout: Layout) => import("@tmagic/schema").MComponent | undefined;
 export declare const change2Fixed: (node: MNode, root: MApp) => {
     left: number;

package/src/layouts/workspace/PageBar.vue

@@ -1,87 +0,0 @@
-<template>
-  <PageBarScrollContainer>
-    <div
-      v-for="item in (root && root.items) || []"
-      class="m-editor-page-bar-item"
-      :key="item.key"
-      :class="{ active: page?.id === item.id }"
-      @click="switchPage(item)"
-    >
-      <div class="m-editor-page-bar-title">
-        <slot name="page-bar-title" :page="item">
-          <TMagicTooltip effect="dark" placement="top-start" :content="item.name">
-            <span>{{ item.name || item.id }}</span>
-          </TMagicTooltip>
-        </slot>
-      </div>
-
-      <TMagicPopover popper-class="page-bar-popover" placement="top" :width="160" trigger="hover">
-        <div>
-          <slot name="page-bar-popover" :page="item">
-            <ToolButton
-              :data="{
-                type: 'button',
-                text: '复制',
-                icon: DocumentCopy,
-                handler: () => copy(item),
-              }"
-            ></ToolButton>
-            <ToolButton
-              :data="{
-                type: 'button',
-                text: '删除',
-                icon: Delete,
-                handler: () => remove(item),
-              }"
-            ></ToolButton>
-          </slot>
-        </div>
-        <template #reference>
-          <TMagicIcon class="m-editor-page-bar-menu-icon">
-            <CaretBottom></CaretBottom>
-          </TMagicIcon>
-        </template>
-      </TMagicPopover>
-    </div>
-  </PageBarScrollContainer>
-</template>
-
-<script lang="ts" setup>
-import { computed, inject } from 'vue';
-import { CaretBottom, Delete, DocumentCopy } from '@element-plus/icons-vue';
-
-import { TMagicIcon, TMagicPopover, TMagicTooltip } from '@tmagic/design';
-import type { MPage } from '@tmagic/schema';
-
-import ToolButton from '@editor/components/ToolButton.vue';
-import type { Services } from '@editor/type';
-
-import PageBarScrollContainer from './PageBarScrollContainer.vue';
-
-defineOptions({
-  name: 'MEditorPageBar',
-});
-
-const services = inject<Services>('services');
-const editorService = services?.editorService;
-
-const root = computed(() => editorService?.get('root'));
-
-const page = computed(() => editorService?.get('page'));
-
-const switchPage = (page: MPage) => {
-  editorService?.select(page);
-};
-
-const copy = (node: MPage) => {
-  node && editorService?.copy(node);
-  editorService?.paste({
-    left: 0,
-    top: 0,
-  });
-};
-
-const remove = (node: MPage) => {
-  editorService?.remove(node);
-};
-</script>

package/types/layouts/workspace/PageBar.vue.d.ts

@@ -1,15 +0,0 @@
-import type { MPage } from '@tmagic/schema';
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>, {
-    "page-bar-title"?(_: {
-        page: MPage;
-    }): any;
-    "page-bar-popover"?(_: {
-        page: MPage;
-    }): any;
-}>;
-export default _default;
-type __VLS_WithTemplateSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/types/layouts/workspace/PageBarScrollContainer.vue.d.ts

@@ -1,9 +0,0 @@
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>, {
-    default?(_: {}): any;
-}>;
-export default _default;
-type __VLS_WithTemplateSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};