@tmagic/editor 1.8.0-beta.19 → 1.8.0-beta.20

package/dist/es/layouts/sidebar/layer/LayerMenu.vue_vue_type_script_setup_true_lang.js

@@ -2,7 +2,7 @@ import { useServices } from "../../../hooks/use-services.js";
 import ContentMenu_default from "../../../components/ContentMenu.js";
 import FolderMinusIcon_default from "../../../icons/FolderMinusIcon.js";
 import { useCopyMenu, useDeleteMenu, useMoveToMenu, usePasteMenu } from "../../../utils/content-menu.js";
-import { isPage, isPageFragment } from "@tmagic/utils";
+import { isPageOrFragment } from "@tmagic/utils";
 import { computed, createBlock, defineComponent, markRaw, openBlock, useTemplateRef } from "vue";
 import { Files, Plus } from "@element-plus/icons-vue";
 //#region packages/editor/src/layouts/sidebar/layer/LayerMenu.vue?vue&type=script&setup=true&lang.ts
@@ -55,7 +55,7 @@ var LayerMenu_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
 				type: "button",
 				text: "全部折叠",
 				icon: FolderMinusIcon_default,
-				display: () => isPage(node.value) || isPageFragment(node.value),
+				display: () => isPageOrFragment(node.value),
 				handler: () => {
 					emit("collapse-all");
 				}

package/dist/es/layouts/sidebar/layer/use-click.js

@@ -1,6 +1,6 @@
 import { UI_SELECT_MODE_EVENT_NAME } from "../../../utils/const.js";
 import { updateStatus } from "../../../utils/tree.js";
-import { getElById, isPage, isPageFragment } from "@tmagic/utils";
+import { getElById, isPageOrFragment } from "@tmagic/utils";
 import { computed, nextTick } from "vue";
 import { throttle } from "lodash-es";
 //#region packages/editor/src/layouts/sidebar/layer/use-click.ts
@@ -16,7 +16,7 @@ var useClick = ({ editorService, stageOverlayService, uiService }, isCtrlKeyDown
 		}
 	};
 	const multiSelect = async (data) => {
-		if (isPage(data) || isPageFragment(data)) return;
+		if (isPageOrFragment(data)) return;
 		const nodes = editorService.get("nodes") || [];
 		const newNodes = [];
 		let isCancel = false;
@@ -25,7 +25,7 @@ var useClick = ({ editorService, stageOverlayService, uiService }, isCtrlKeyDown
 				isCancel = true;
 				return;
 			}
-			if (isPage(node) || isPageFragment(node)) return;
+			if (isPageOrFragment(node)) return;
 			newNodes.push(node.id);
 		});
 		if (!isCancel || newNodes.length === 0) newNodes.push(data.id);

package/dist/es/layouts/sidebar/layer/use-node-status.js

@@ -1,5 +1,5 @@
 import { updateStatus } from "../../../utils/tree.js";
-import { getNodePath, isPage, isPageFragment, traverseNode } from "@tmagic/utils";
+import { getNodePath, isPageOrFragment, traverseNode } from "@tmagic/utils";
 import { computed, onBeforeUnmount, ref, watch } from "vue";
 //#region packages/editor/src/layouts/sidebar/layer/use-node-status.ts
 var createPageNodeStatus = (page, initialLayerNodeStatus) => {
@@ -75,7 +75,7 @@ var useNodeStatus = ({ editorService }) => {
 	}, { immediate: true });
 	const addHandler = (newNodes) => {
 		newNodes.forEach((node) => {
-			if (isPage(node) || isPageFragment(node)) return;
+			if (isPageOrFragment(node)) return;
 			traverseNode(node, (node) => {
 				nodeStatusMap.value?.set(node.id, {
 					visible: true,

package/dist/es/layouts/workspace/viewer/ViewerMenu.vue_vue_type_script_setup_true_lang.js

@@ -3,7 +3,7 @@ import { useServices } from "../../../hooks/use-services.js";
 import ContentMenu_default from "../../../components/ContentMenu.js";
 import { useCopyMenu, useDeleteMenu, useMoveToMenu, usePasteMenu } from "../../../utils/content-menu.js";
 import CenterIcon_default from "../../../icons/CenterIcon.js";
-import { isPage, isPageFragment } from "@tmagic/utils";
+import { isPageOrFragment } from "@tmagic/utils";
 import { NodeType } from "@tmagic/core";
 import { computed, createBlock, defineComponent, markRaw, openBlock, ref, useTemplateRef, watch } from "vue";
 import { Bottom, Top } from "@element-plus/icons-vue";
@@ -46,14 +46,14 @@ var ViewerMenu_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 				direction: "horizontal",
 				display: () => {
 					if (!node.value) return false;
-					return !isPage(node.value) && !isPageFragment(node.value);
+					return !isPageOrFragment(node.value);
 				}
 			},
 			{
 				type: "button",
 				text: "上移一层",
 				icon: markRaw(Top),
-				display: () => !isPage(node.value) && !isPageFragment(node.value) && !props.isMultiSelect,
+				display: () => !isPageOrFragment(node.value) && !props.isMultiSelect,
 				handler: () => {
 					editorService.moveLayer(1, { historySource: "stage-contextmenu" });
 				}
@@ -62,7 +62,7 @@ var ViewerMenu_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 				type: "button",
 				text: "下移一层",
 				icon: markRaw(Bottom),
-				display: () => !isPage(node.value) && !isPageFragment(node.value) && !props.isMultiSelect,
+				display: () => !isPageOrFragment(node.value) && !props.isMultiSelect,
 				handler: () => {
 					editorService.moveLayer(-1, { historySource: "stage-contextmenu" });
 				}
@@ -71,7 +71,7 @@ var ViewerMenu_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 				type: "button",
 				text: "置顶",
 				icon: markRaw(Top),
-				display: () => !isPage(node.value) && !isPageFragment(node.value) && !props.isMultiSelect,
+				display: () => !isPageOrFragment(node.value) && !props.isMultiSelect,
 				handler: () => {
 					editorService.moveLayer(LayerOffset.TOP, { historySource: "stage-contextmenu" });
 				}
@@ -80,7 +80,7 @@ var ViewerMenu_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 				type: "button",
 				text: "置底",
 				icon: markRaw(Bottom),
-				display: () => !isPage(node.value) && !isPageFragment(node.value) && !props.isMultiSelect,
+				display: () => !isPageOrFragment(node.value) && !props.isMultiSelect,
 				handler: () => {
 					editorService.moveLayer(LayerOffset.BOTTOM, { historySource: "stage-contextmenu" });
 				}
@@ -89,7 +89,7 @@ var ViewerMenu_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 			{
 				type: "divider",
 				direction: "horizontal",
-				display: () => !isPage(node.value) && !isPageFragment(node.value) && !props.isMultiSelect
+				display: () => !isPageOrFragment(node.value) && !props.isMultiSelect
 			},
 			useDeleteMenu("stage-contextmenu"),
 			{

package/dist/es/services/dep.js

@@ -1,11 +1,10 @@
 import BaseService from "./BaseService.js";
 import { IdleTask } from "../utils/dep/idle-task.js";
-import WorkerWrapper from "../utils/dep/worker.js";
+import { CollectWorkerClient } from "../utils/dep/collect-worker-client.js";
 import { isPage } from "@tmagic/utils";
 import { DepTargetType, Watcher, traverseTarget } from "@tmagic/core";
 import { reactive, shallowReactive } from "vue";
 import { throttle } from "lodash-es";
-import serialize from "serialize-javascript";
 //#region packages/editor/src/services/dep.ts
 var Dep = class extends BaseService {
 	state = shallowReactive({
@@ -13,6 +12,7 @@ var Dep = class extends BaseService {
 		taskLength: 0
 	});
 	idleTask = new IdleTask();
+	collectWorker = new CollectWorkerClient();
 	watcher = new Watcher({ initialTargets: reactive({}) });
 	waitingWorker;
 	resolveWaitingWorker;
@@ -65,6 +65,14 @@ var Dep = class extends BaseService {
 		this.emit("collected", nodes, deep);
 		this.emit("ds-collected", nodes, deep);
 	}
+	/**
+	* 空闲收集依赖
+	*
+	* 遍历匹配是整个收集过程中最耗时的部分（要深度遍历节点树并对每个属性做 target 匹配），
+	* 节点/数据源多时在主线程执行会长时间卡死页面，因此优先交给 worker 执行，主线程只负责把结果写回 target。
+	* 自定义 target 的 isTarget 是无法跨线程传递的闭包函数（没有 descriptor），仍走主线程空闲队列；
+	* worker 不可用（如 SSR）或执行失败时也会回退到主线程空闲队列。
+	*/
 	async collectIdle(nodes, depExtendedData = {}, deep = false, type) {
 		if (this.waitingWorker) await this.waitingWorker;
 		const batch = {
@@ -74,11 +82,13 @@ var Dep = class extends BaseService {
 			dsPending: 0,
 			collectedEmitted: false,
 			dsSettled: false,
+			aborted: false,
 			resolve: () => {}
 		};
-		this.watcher.collectByCallback(nodes, type, ({ node, target }) => {
-			this.enqueueTask(node, target, depExtendedData, deep, batch);
-		});
+		const workerTargets = [];
+		for (const target of this.watcher.getCollectableTargets(type)) if (target.descriptor && this.collectWorker.isSupported) workerTargets.push(target);
+		else this.enqueueTasks(nodes, target, depExtendedData, deep, batch);
+		if (workerTargets.length && nodes.length) this.collectByCollectWorker(nodes, workerTargets, depExtendedData, deep, batch);
 		if (batch.pending === 0) {
 			this.emit("collected", nodes, deep);
 			this.updateCollectingState();
@@ -97,16 +107,8 @@ var Dep = class extends BaseService {
 		const { promise, resolve: waitingResolve } = Promise.withResolvers();
 		this.waitingWorker = promise;
 		this.resolveWaitingWorker = waitingResolve;
-		return new Promise((resolve) => {
-			const worker = new WorkerWrapper();
-			worker.postMessage({ dsl: serialize(dsl) });
-			worker.onmessage = (e) => {
-				resolve(e.data);
-			};
-			worker.onerror = () => {
-				resolve({});
-			};
-		}).then((depsData) => {
+		return this.collectWorker.collectDsl(dsl).then((deps) => {
+			const depsData = deps || {};
 			if (generation !== this.workerGeneration) {
 				waitingResolve();
 				return depsData;
@@ -132,7 +134,8 @@ var Dep = class extends BaseService {
 	}
 	collectNode(node, target, depExtendedData = {}, deep = false) {
 		if (isPage(node)) this.removePageDep(target, depExtendedData);
-		else this.watcher.removeTargetDep(target, node);
+		else if (deep) this.watcher.removeTargetDep(target, node);
+		else target.removeDep(node.id);
 		this.watcher.collectItem(node, target, depExtendedData, deep);
 	}
 	clear(nodes) {
@@ -150,6 +153,7 @@ var Dep = class extends BaseService {
 	clearIdleTasks() {
 		this.abortActiveBatches();
 		this.idleTask.clearTasks();
+		this.collectWorker.abort();
 	}
 	on(eventName, listener) {
 		return super.on(eventName, listener);
@@ -164,6 +168,7 @@ var Dep = class extends BaseService {
 		this.resolveWaitingWorker = void 0;
 		this.waitingWorker = void 0;
 		this.idleTask.clearTasks();
+		this.collectWorker.abort();
 		for (const type of Object.keys(this.watcher.getTargetsList())) this.removeTargets(type);
 		this.set("collecting", false);
 	}
@@ -173,6 +178,7 @@ var Dep = class extends BaseService {
 		this.reset();
 		this.removeAllPlugins();
 		this.idleTask.removeAllListeners();
+		this.collectWorker.terminate();
 	}
 	emit(eventName, ...args) {
 		return super.emit(eventName, ...args);
@@ -187,26 +193,73 @@ var Dep = class extends BaseService {
 			if (dep.data?.pageId && dep.data.pageId === depExtendedData.pageId) delete target.deps[depKey];
 		}
 	}
+	/**
+	* 把遍历匹配交给 worker，结果回来后按 target 分片写回主线程
+	*/
+	collectByCollectWorker(nodes, targets, depExtendedData, deep, batch) {
+		const hasDataSource = targets.some((target) => target.type === DepTargetType.DATA_SOURCE);
+		this.beginBatchTask(batch, hasDataSource);
+		this.collectWorker.collect({
+			nodes,
+			targets: targets.map((target) => target.descriptor),
+			depExtendedData,
+			deep
+		}).then((result) => {
+			if (batch.aborted) return;
+			for (const target of targets) if (result) this.enqueueApplyTask(target, result.deps[target.type]?.[target.id] || {}, result.nodeIds, batch, {
+				nodes,
+				depExtendedData,
+				deep
+			});
+			else this.enqueueTasks(nodes, target, depExtendedData, deep, batch);
+		}).finally(() => {
+			this.onBatchTaskDone(batch, hasDataSource);
+		});
+	}
+	/**
+	* 用 worker 的收集结果替换 target 上这批节点的依赖
+	*/
+	enqueueApplyTask(target, deps, nodeIds, batch, { nodes, depExtendedData, deep }) {
+		const isDataSource = target.type === DepTargetType.DATA_SOURCE;
+		this.beginBatchTask(batch, isDataSource);
+		this.idleTask.enqueueTask(() => {
+			try {
+				const current = this.watcher.getTarget(target.id, target.type);
+				if (current !== target) {
+					if (current) this.enqueueTasks(nodes, current, depExtendedData, deep, batch);
+					return;
+				}
+				if (nodes.some((node) => isPage(node))) this.removePageDep(target, depExtendedData);
+				for (const id of nodeIds) target.removeDep(id);
+				for (const [id, dep] of Object.entries(deps)) target.deps[id] = dep;
+			} finally {
+				this.onBatchTaskDone(batch, isDataSource);
+			}
+		}, void 0, isDataSource);
+	}
+	enqueueTasks(nodes, target, depExtendedData, deep, batch) {
+		for (const node of nodes) this.enqueueTask(node, target, depExtendedData, deep, batch);
+	}
 	enqueueTask(node, target, depExtendedData, deep, batch) {
 		const isDataSource = target.type === DepTargetType.DATA_SOURCE;
-		batch.pending += 1;
-		if (isDataSource) batch.dsPending += 1;
-		this.idleTask.enqueueTask(({ node, deep, target }) => {
+		this.beginBatchTask(batch, isDataSource);
+		this.idleTask.enqueueTask(() => {
 			try {
-				this.collectNode(node, target, depExtendedData, deep);
+				this.collectNode(node, target, depExtendedData);
 			} finally {
 				this.onBatchTaskDone(batch, isDataSource);
 			}
-		}, {
-			node,
-			deep: false,
-			target
-		}, isDataSource);
+		}, void 0, isDataSource);
 		if (deep && Array.isArray(node.items) && node.items.length) node.items.forEach((item) => {
 			this.enqueueTask(item, target, depExtendedData, deep, batch);
 		});
 	}
+	beginBatchTask(batch, isDataSource) {
+		batch.pending += 1;
+		if (isDataSource) batch.dsPending += 1;
+	}
 	onBatchTaskDone(batch, isDataSource) {
+		if (batch.aborted) return;
 		if (isDataSource) {
 			batch.dsPending -= 1;
 			if (batch.dsPending === 0) this.settleBatchDs(batch);
@@ -238,7 +291,10 @@ var Dep = class extends BaseService {
 		if (!this.activeBatches.size) return;
 		const batches = [...this.activeBatches];
 		this.activeBatches.clear();
-		for (const batch of batches) batch.resolve(false);
+		for (const batch of batches) {
+			batch.aborted = true;
+			batch.resolve(false);
+		}
 		this.updateCollectingState();
 	}
 	updateCollectingState() {

package/dist/es/services/editor.js

@@ -7,9 +7,9 @@ import storage_default, { Protocol } from "./storage.js";
 import { COPY_STORAGE_KEY, calcAlignCenterStyle, calcLayerTargetIndex, calcMoveStyle, classifyDragSources, collectRelatedNodes, describeStepForRevert, editorNodeMergeCustomizer, fixNodePosition, getInitPositionStyle, getNodeIndex, getPageFragmentList, getPageList, moveItemsInContainer, resolveSelectedNode, setChildrenLayout, setLayout, toggleFixedPosition } from "../utils/editor.js";
 import { beforePaste, getAddParent } from "../utils/operator.js";
 import { isFixed } from "@tmagic/stage";
-import { getNodeInfo, getNodePath, getValueByKeyPath, guid, isPage, isPageFragment, setValueByKeyPath, traverseNode } from "@tmagic/utils";
+import { getNodeInfo, getNodePath, getValueByKeyPath, guid, isPage, isPageFragment, isPageOrFragment, setValueByKeyPath, traverseNode } from "@tmagic/utils";
 import { NodeType } from "@tmagic/core";
-import { reactive, toRaw } from "vue";
+import { nextTick, reactive, toRaw } from "vue";
 import { cloneDeep as cloneDeep$1, isEmpty, isEqual, isObject, mergeWith, uniq } from "lodash-es";
 //#region packages/editor/src/services/editor.ts
 /**
@@ -159,7 +159,7 @@ var Editor = class extends BaseService {
 	isOnDifferentPage(node) {
 		const currentPageId = this.get("page")?.id;
 		if (currentPageId === void 0 || currentPageId === null) return false;
-		if (isPage(node) || isPageFragment(node)) return `${node.id}` !== `${currentPageId}`;
+		if (isPageOrFragment(node)) return `${node.id}` !== `${currentPageId}`;
 		const nodePage = this.getNodeInfo(node.id, false).page;
 		if (!nodePage) return false;
 		return `${nodePage.id}` !== `${currentPageId}`;
@@ -252,8 +252,8 @@ var Editor = class extends BaseService {
 		const curNode = this.get("node");
 		const stage = this.get("stage");
 		if (!curNode) throw new Error("当前选中节点为空");
-		if ((parent.type === NodeType.ROOT || curNode?.type === NodeType.ROOT) && !(isPage(node) || isPageFragment(node))) throw new Error("app下不能添加组件");
-		if (parent.id !== curNode.id && !(isPage(node) || isPageFragment(node))) {
+		if ((parent.type === NodeType.ROOT || curNode?.type === NodeType.ROOT) && !isPageOrFragment(node)) throw new Error("app下不能添加组件");
+		if (parent.id !== curNode.id && !isPageOrFragment(node)) {
 			const index = parent.items.indexOf(curNode);
 			parent.items?.splice(index + 1, 0, node);
 		} else parent.items?.push(node);
@@ -298,7 +298,7 @@ var Editor = class extends BaseService {
 		} else addNodes.push(...addNode);
 		const newNodes = await Promise.all(addNodes.map((node) => {
 			const root = this.get("root");
-			if ((isPage(node) || isPageFragment(node)) && root) return this.doAdd(node, root);
+			if (isPageOrFragment(node) && root) return this.doAdd(node, root);
 			const parentNode = parent ?? getAddParent(node);
 			if (!parentNode) throw new Error("未找到父元素");
 			return this.doAdd(node, parentNode);
@@ -318,7 +318,7 @@ var Editor = class extends BaseService {
 			else if (isPageFragment(newNodes[0])) this.state.pageFragmentLength += 1;
 			else if (!skipSelect) stage?.select(newNodes[0].id);
 		}
-		if (!(isPage(newNodes[0]) || isPageFragment(newNodes[0]))) {
+		if (!isPageOrFragment(newNodes[0])) {
 			const pageForOp = this.getNodeInfo(newNodes[0].id, false).page;
 			if (!doNotPushHistory) {
 				const parentId = (this.getParentById(newNodes[0].id, false) ?? this.get("root")).id;
@@ -351,7 +351,7 @@ var Editor = class extends BaseService {
 			historySource,
 			doNotPushHistory
 		});
-		const addedPages = newNodes.filter((node) => isPage(node) || isPageFragment(node));
+		const addedPages = newNodes.filter((node) => isPageOrFragment(node));
 		if (addedPages.length) history_default.notifyPageStructureChange({
 			add: addedPages,
 			remove: []
@@ -365,13 +365,10 @@ var Editor = class extends BaseService {
 		if (!parent || !curNode) throw new Error("找不要删除的节点");
 		const index = getNodeIndex(curNode.id, parent);
 		if (typeof index !== "number" || index === -1) throw new Error("找不要删除的节点");
-		parent.items?.splice(index, 1);
 		const stage = this.get("stage");
-		stage?.remove({
-			id: node.id,
-			parentId: parent.id,
-			root: cloneDeep$1(root)
-		});
+		const currentPage = this.get("page");
+		const isDeletingCurrentPage = isPageOrFragment(node) && !!currentPage && `${currentPage.id}` === `${node.id}`;
+		parent.items?.splice(index, 1);
 		const selectedNodes = this.get("nodes");
 		const removedSelectedIndex = selectedNodes.findIndex((n) => `${n.id}` === `${node.id}`);
 		if (removedSelectedIndex !== -1) {
@@ -379,24 +376,29 @@ var Editor = class extends BaseService {
 			nextSelected.splice(removedSelectedIndex, 1);
 			this.set("nodes", nextSelected);
 		}
-		if (isPage(node) || isPageFragment(node)) {
-			const currentPage = this.get("page");
-			if (currentPage && `${currentPage.id}` === `${node.id}`) this.set("page", null);
-		}
-		const selectDefault = async (pages) => {
-			if (pages[0]) {
-				await this.select(pages[0]);
-				stage?.select(pages[0].id);
-			} else this.selectRoot();
+		const removeData = {
+			id: node.id,
+			parentId: parent.id,
+			root: cloneDeep$1(root)
 		};
 		const rootItems = root.items || [];
-		if (isPage(node)) {
-			this.state.pageLength -= 1;
-			if (!doNotSelect && !doNotSwitchPage) await selectDefault(rootItems);
-		} else if (isPageFragment(node)) {
-			this.state.pageFragmentLength -= 1;
-			if (!doNotSelect && !doNotSwitchPage) await selectDefault(rootItems);
+		const shouldReselect = isDeletingCurrentPage && !doNotSelect && !doNotSwitchPage;
+		const shouldSwitchPage = shouldReselect && rootItems.length > 0;
+		if (isPageOrFragment(node)) {
+			if (isPage(node)) this.state.pageLength -= 1;
+			else this.state.pageFragmentLength -= 1;
+			if (shouldSwitchPage) {
+				await this.select(rootItems[0]);
+				stage?.select(rootItems[0].id);
+				await nextTick();
+				stage?.remove(removeData);
+			} else {
+				stage?.remove(removeData);
+				if (shouldReselect) this.selectRoot();
+				else if (isDeletingCurrentPage) this.set("page", null);
+			}
 		} else {
+			stage?.remove(removeData);
 			if (!doNotSelect) {
 				await this.select(parent);
 				stage?.select(parent.id);
@@ -425,7 +427,7 @@ var Editor = class extends BaseService {
 		}));
 		const removedItems = [];
 		let pageForOp = null;
-		if (!(isPage(nodes[0]) || isPageFragment(nodes[0]))) for (const n of nodes) {
+		if (!isPageOrFragment(nodes[0])) for (const n of nodes) {
 			const { parent, node: curNode, page } = this.getNodeInfo(n.id, false);
 			if (parent && curNode) {
 				if (!pageForOp && page) pageForOp = {
@@ -459,7 +461,7 @@ var Editor = class extends BaseService {
 			historySource,
 			doNotPushHistory
 		});
-		const removedPages = nodes.filter((node) => isPage(node) || isPageFragment(node));
+		const removedPages = nodes.filter((node) => isPageOrFragment(node));
 		if (removedPages.length) history_default.notifyPageStructureChange({
 			add: [],
 			remove: removedPages
@@ -497,7 +499,7 @@ var Editor = class extends BaseService {
 			selectedNodes.splice(targetIndex, 1, newConfig);
 			this.set("nodes", [...selectedNodes]);
 		}
-		if (isPage(newConfig) || isPageFragment(newConfig)) {
+		if (isPageOrFragment(newConfig)) {
 			const currentPage = this.get("page");
 			if (currentPage && `${currentPage.id}` === `${newConfig.id}`) this.set("page", newConfig);
 		}
@@ -751,7 +753,7 @@ var Editor = class extends BaseService {
 	*/
 	async moveToContainer(config, targetId, { doNotSelect = false, doNotSwitchPage = false, doNotPushHistory = false, historyDescription, historySource } = {}) {
 		const isBatch = Array.isArray(config);
-		const configs = (isBatch ? config : [config]).filter((item) => !(isPage(item) || isPageFragment(item)));
+		const configs = (isBatch ? config : [config]).filter((item) => !isPageOrFragment(item));
 		if (configs.length === 0) throw new Error("没有可移动的节点");
 		this.captureSelectionBeforeOp();
 		const target = this.getNodeById(targetId, false);
@@ -1225,7 +1227,7 @@ var Editor = class extends BaseService {
 	getPageOfNode(id) {
 		const { node, page } = this.getNodeInfo(id, false);
 		if (page) return page;
-		if (node && (isPage(node) || isPageFragment(node))) return node;
+		if (node && isPageOrFragment(node)) return node;
 		return null;
 	}
 	captureSelectionBeforeOp() {

package/dist/es/services/history.js

@@ -247,7 +247,7 @@ var History = class extends BaseService {
 	* 派发「页面 / 页面片结构变更」事件（`page-structure-change`）。
 	*
 	* 常规 `editorService.add` / `remove` 页面节点不会写入 `page` 历史栈（见 editor.add / remove 中
-	* 对 isPage / isPageFragment 的分支），因此不会产生任何 historyService 事件。该方法用于在这些
+	* 对 isPageOrFragment 的分支），因此不会产生任何 historyService 事件。该方法用于在这些
 	* 场景（以及 setRoot 整体替换 DSL 增删页面）下，向外统一通知页面结构的增删变化，供业务方感知。
 	*
 	* 一次操作涉及多个页面时，调用方应把本次增删的页面**合并为一个 change 一次性传入**，

package/dist/es/services/keybinding.js

@@ -2,7 +2,7 @@ import { KeyBindingCommand } from "../type.js";
 import BaseService from "./BaseService.js";
 import editor_default from "./editor.js";
 import ui_default from "./ui.js";
-import { isPage, isPageFragment } from "@tmagic/utils";
+import { isPageOrFragment } from "@tmagic/utils";
 import KeyController from "keycon";
 //#region packages/editor/src/services/keybinding.ts
 var Keybinding = class extends BaseService {
@@ -12,7 +12,7 @@ var Keybinding = class extends BaseService {
 	commands = {
 		[KeyBindingCommand.DELETE_NODE]: () => {
 			const nodes = editor_default.get("nodes");
-			if (!nodes || isPage(nodes[0]) || isPageFragment(nodes[0])) return;
+			if (!nodes || isPageOrFragment(nodes[0])) return;
 			editor_default.remove(nodes, { historySource: "shortcut" });
 		},
 		[KeyBindingCommand.COPY_NODE]: () => {
@@ -21,7 +21,7 @@ var Keybinding = class extends BaseService {
 		},
 		[KeyBindingCommand.CUT_NODE]: () => {
 			const nodes = editor_default.get("nodes");
-			if (!nodes || isPage(nodes[0]) || isPageFragment(nodes[0])) return;
+			if (!nodes || isPageOrFragment(nodes[0])) return;
 			editor_default.copy(nodes);
 			editor_default.remove(nodes, { historySource: "shortcut" });
 		},

package/dist/es/utils/content-menu.js

@@ -1,5 +1,5 @@
 import { COPY_STORAGE_KEY } from "./editor.js";
-import { calcValueByFontsize, isPage, isPageFragment } from "@tmagic/utils";
+import { calcValueByFontsize, isPage, isPageOrFragment } from "@tmagic/utils";
 import { NodeType, cloneDeep } from "@tmagic/core";
 import { computed, markRaw } from "vue";
 import { CopyDocument, Delete, DocumentCopy } from "@element-plus/icons-vue";
@@ -15,7 +15,7 @@ var useDeleteMenu = (historySource) => ({
 	icon: Delete,
 	display: ({ editorService }) => {
 		const node = editorService.get("node");
-		return node?.type !== NodeType.ROOT && !isPage(node) && !isPageFragment(node);
+		return node?.type !== NodeType.ROOT && !isPageOrFragment(node);
 	},
 	handler: ({ editorService }) => {
 		const nodes = editorService.get("nodes");

package/dist/es/utils/dep/collect-worker-client.js

@@ -0,0 +1,114 @@
+import { error } from "../logger.js";
+import WorkerWrapper from "./worker.js";
+import serialize from "serialize-javascript";
+//#region packages/editor/src/utils/dep/collect-worker-client.ts
+/**
+* 依赖收集 worker 的主线程客户端
+*
+* 依赖收集需要深度遍历整棵节点树并对每个属性做匹配，节点/数据源多时会长时间占用主线程导致页面卡死，
+* 这里把遍历匹配放到 worker 中执行，主线程只负责把结果写回 target。
+*
+* 全量收集与增量收集共用一个常驻 worker：增量收集调用频繁（每次节点更新都会触发），
+* 按次创建 worker 的启动开销无法接受，也容易漏掉销毁导致线程泄漏。
+*/
+var CollectWorkerClient = class {
+	worker = null;
+	seed = 0;
+	pending = /* @__PURE__ */ new Map();
+	get isSupported() {
+		return typeof Worker !== "undefined";
+	}
+	/**
+	* 在 worker 中全量收集整个 DSL 的依赖，target 由 worker 根据 DSL 重建
+	* @returns 收集结果，返回 null 表示 worker 不可用或执行失败
+	*/
+	collectDsl(dsl) {
+		return this.request((id) => ({
+			id,
+			dsl: serialize(dsl)
+		})).then((response) => response?.deps || null);
+	}
+	/**
+	* 在 worker 中增量收集指定节点的依赖，target 以可序列化描述的形式传入
+	* @returns 收集结果，返回 null 表示 worker 不可用或执行失败，调用方需要回退到主线程收集
+	*/
+	collect(payload) {
+		return this.request((id) => ({
+			id,
+			payload: serialize(payload)
+		})).then((response) => response ? {
+			deps: response.deps || {},
+			nodeIds: response.nodeIds || []
+		} : null);
+	}
+	terminate() {
+		this.worker?.terminate();
+		this.worker = null;
+		this.settleAllPending();
+	}
+	/**
+	* 丢弃在途请求并重建 worker
+	* clearIdleTasks / reset 中断收集时调用，避免已 abort 的长任务继续占着常驻 worker 拖慢后续收集
+	*/
+	abort() {
+		this.terminate();
+	}
+	/**
+	* worker 按收到的顺序逐个处理请求，因此请求间不会互相打断，用 id 把结果分发回各自的调用方
+	*/
+	request(createRequest) {
+		const worker = this.getWorker();
+		if (!worker) return Promise.resolve(null);
+		this.seed += 1;
+		const id = this.seed;
+		return new Promise((resolve) => {
+			this.pending.set(id, resolve);
+			try {
+				worker.postMessage(createRequest(id));
+			} catch (e) {
+				error("magic editor: 依赖收集 worker 通信失败", e);
+				this.pending.delete(id);
+				resolve(null);
+			}
+		});
+	}
+	getWorker() {
+		if (!this.isSupported) return null;
+		if (this.worker) return this.worker;
+		try {
+			const worker = new WorkerWrapper();
+			worker.onmessage = (e) => {
+				this.handleResponse(e.data);
+			};
+			worker.onerror = () => {
+				this.handleFatalError();
+			};
+			worker.onmessageerror = () => {
+				this.handleFatalError();
+			};
+			this.worker = worker;
+		} catch (e) {
+			error("magic editor: 依赖收集 worker 创建失败", e);
+			return null;
+		}
+		return this.worker;
+	}
+	handleResponse(response) {
+		const resolve = this.pending.get(response?.id);
+		if (!resolve) return;
+		this.pending.delete(response.id);
+		resolve(response.failed ? null : response);
+	}
+	handleFatalError() {
+		this.worker?.terminate();
+		this.worker = null;
+		this.settleAllPending();
+	}
+	settleAllPending() {
+		const resolvers = [...this.pending.values()];
+		this.pending.clear();
+		for (const resolve of resolvers) resolve(null);
+	}
+};
+//#endregion
+export { CollectWorkerClient };