@tmagic/editor 1.8.0-beta.2 → 1.8.0-beta.4

package/dist/es/layouts/history-list/HistoryListPanel.vue_vue_type_script_setup_true_lang.js

@@ -1,12 +1,11 @@
 import { useServices } from "../../hooks/use-services.js";
 import Icon_default from "../../components/Icon.js";
-import { useHistoryList } from "./composables.js";
-import CodeBlockTab_default from "./CodeBlockTab.js";
-import DataSourceTab_default from "./DataSourceTab.js";
+import { describeCodeBlockGroup, describeCodeBlockStep, describeDataSourceGroup, describeDataSourceStep, isCodeBlockStepRevertable, isDataSourceStepRevertable, useHistoryList } from "./composables.js";
+import BucketTab_default from "./BucketTab.js";
 import HistoryDiffDialog_default from "./HistoryDiffDialog.js";
 import PageTab_default from "./PageTab.js";
 import { TMagicButton, TMagicPopover, TMagicTabs, TMagicTooltip, getDesignConfig } from "@tmagic/design";
-import { Fragment, createBlock, createElementBlock, createElementVNode, createVNode, defineComponent, guardReactiveProps, inject, markRaw, normalizeProps, openBlock, ref, resolveDynamicComponent, unref, useTemplateRef, withCtx } from "vue";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, guardReactiveProps, inject, markRaw, mergeProps, normalizeProps, openBlock, ref, renderList, resolveDynamicComponent, shallowRef, toHandlers, unref, useTemplateRef, watch, withCtx } from "vue";
 import { Clock, Close } from "@element-plus/icons-vue";
 //#region packages/editor/src/layouts/history-list/HistoryListPanel.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = { class: "m-editor-history-list" };
@@ -31,7 +30,8 @@ var HistoryListPanel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 		* 此外每条 step 上提供"查看差异"入口（仅在前后值都存在的 update 步骤显示），
 		* 点击后弹出 HistoryDiffDialog，使用 CompareForm 组件以表单形式展示新旧值差异。
 		*
-		* 各 tab 的内容拆分为独立的 SFC（PageTab / DataSourceTab / CodeBlockTab），
+		* 各 tab 的内容拆分为独立的 SFC：页面用 PageTab，数据源 / 代码块复用通用的 BucketTab
+		* （通过 title / prefix / describe* / isStepDiffable 注入差异）。
 		* 共享的描述生成与折叠状态在 composables.ts 中维护。
 		*/
 		const ClockIcon = markRaw(Clock);
@@ -40,7 +40,23 @@ var HistoryListPanel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 		/** 面板显隐受控：reference 图标点击切换，右上角关闭按钮置为 false。 */
 		const visible = ref(false);
 		const tabPaneComponent = getDesignConfig("components")?.tabPane;
-		const { editorService, dataSourceService, codeBlockService, historyService } = useServices();
+		/**
+		* 业务方自定义的扩展 tab，由 Editor 顶层通过 `historyListExtraTabs` 注入。
+		* 追加在内置「页面 / 数据源 / 代码块」三个 tab 之后，未提供时为空数组。
+		*/
+		const extraTabs = inject("historyListExtraTabs", []);
+		/** label 支持字符串或函数，函数形式便于展示动态数量等内容。 */
+		const resolveTabLabel = (tab) => typeof tab.label === "function" ? tab.label() : tab.label;
+		const { editorService, dataSourceService, codeBlockService, historyService, propsService } = useServices();
+		/**
+		* 数据源 / 代码块功能可被业务方通过 `disabledDataSource` / `disabledCodeBlock` 禁用，
+		* 禁用后对应的历史记录 tab 不再展示。若当前激活的 tab 恰好被禁用，则回退到「页面」tab。
+		*/
+		const disabledDataSource = computed(() => propsService.getDisabledDataSource());
+		const disabledCodeBlock = computed(() => propsService.getDisabledCodeBlock());
+		watch([disabledDataSource, disabledCodeBlock], ([dsDisabled, cbDisabled]) => {
+			if (activeTab.value === "data-source" && dsDisabled || activeTab.value === "code-block" && cbDisabled) activeTab.value = "page";
+		});
 		/**
 		* 通过 inject 拿到 Editor 顶层注入的 `extendFormState`，转交给 HistoryDiffDialog
 		* 内部的 CompareForm，使差异对比表单的 filterFunction 能拿到完整的业务上下文。
@@ -48,6 +64,10 @@ var HistoryListPanel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 		*/
 		const extendFormState = inject("extendFormState", void 0);
 		const { expanded, toggleGroup, pageGroups, dataSourceGroups, codeBlockGroups, pageGroupsDisplay, dataSourceGroupsByTarget, codeBlockGroupsByTarget } = useHistoryList();
+		/** 数据源 step 仅 update（前后 schema 都存在）时可查看差异。 */
+		const isDataSourceStepDiffable = (step) => Boolean(step.oldSchema && step.newSchema);
+		/** 代码块 step 仅 update（前后 content 都存在）时可查看差异。 */
+		const isCodeBlockStepDiffable = (step) => Boolean(step.oldContent && step.newContent);
 		/** 把"目标 step 索引"翻译成"目标 cursor"（已应用步骤数量）。 */
 		const indexToCursor = (index) => index + 1;
 		const onPageGoto = (index) => {
@@ -72,36 +92,24 @@ var HistoryListPanel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 		const onCodeBlockGotoInitial = (id) => {
 			codeBlockService.goto(id, 0);
 		};
-		/**
-		* 「回滚」入口：把目标历史步骤的修改作为一次新操作反向应用（类 git revert），
-		* 不破坏原有栈结构。各 service 内部完成反向 + 入栈，并自带描述用于面板展示。
-		*/
-		const onPageRevert = (index) => {
-			editorService.revertPageStep(index);
-		};
-		const onDataSourceRevert = (id, index) => {
-			dataSourceService.revert(id, index);
-		};
-		const onCodeBlockRevert = (id, index) => {
-			codeBlockService.revert(id, index);
-		};
 		const diffDialogRef = useTemplateRef("diffDialog");
 		/**
-		* 页面 step 差异：仅 update 单节点修改可对比，传入旧/新节点。
+		* 构造页面 step 的差异弹窗入参：仅 update 单节点修改可对比，传入旧/新节点。
 		* 节点类型 `type` 优先取 newNode.type，再回退 oldNode.type。
 		* `currentValue` 取自 editorService 中该节点当前实际值，用于支持「与当前对比」。
+		* 无可对比内容（如多节点 / add / remove）时返回 null。
 		*/
-		const onPageDiff = (index) => {
+		const buildPageDiffPayload = (index) => {
 			const groups = historyService.getPageHistoryGroups();
 			for (const group of groups) {
 				const entry = group.steps.find((s) => s.index === index);
 				if (!entry) continue;
 				const item = entry.step.updatedItems?.[0];
-				if (!item?.oldNode || !item?.newNode) return;
+				if (!item?.oldNode || !item?.newNode) return null;
 				const type = item.newNode.type || item.oldNode.type || "";
 				const nodeId = item.newNode.id ?? item.oldNode.id;
 				const currentNode = nodeId !== void 0 ? editorService.getNodeById(nodeId) : null;
-				diffDialogRef.value?.open({
+				return {
 					category: "node",
 					type,
 					lastValue: item.oldNode,
@@ -109,50 +117,87 @@ var HistoryListPanel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 					currentValue: currentNode || null,
 					targetLabel: item.newNode.name || item.oldNode.name || type,
 					id: nodeId
-				});
-				return;
+				};
 			}
+			return null;
 		};
-		const onDataSourceDiff = (id, index) => {
-			const groups = historyService.getDataSourceHistoryGroups();
+		/**
+		* 在指定分组列表中按 id / index 查找命中的 step，命中后交由 build 构造差异弹窗入参。
+		* 用于统一数据源、代码块两类历史的查找逻辑。
+		*/
+		const findGroupStep = (groups, id, index, build) => {
 			for (const group of groups) {
 				if (group.id !== id) continue;
 				const entry = group.steps.find((s) => s.index === index);
 				if (!entry) continue;
-				const { oldSchema, newSchema } = entry.step;
-				if (!oldSchema || !newSchema) return;
-				const currentSchema = dataSourceService.getDataSourceById(`${id}`);
-				diffDialogRef.value?.open({
-					category: "data-source",
-					type: newSchema.type || oldSchema.type || "base",
-					lastValue: oldSchema,
-					value: newSchema,
-					currentValue: currentSchema || null,
-					targetLabel: newSchema.title || oldSchema.title || `${id}`,
-					id
-				});
-				return;
+				return build(entry.step);
 			}
+			return null;
+		};
+		const buildDataSourceDiffPayload = (id, index) => findGroupStep(historyService.getDataSourceHistoryGroups(), id, index, ({ oldSchema, newSchema }) => {
+			if (!oldSchema || !newSchema) return null;
+			const currentSchema = dataSourceService.getDataSourceById(`${id}`);
+			return {
+				category: "data-source",
+				type: newSchema.type || oldSchema.type || "base",
+				lastValue: oldSchema,
+				value: newSchema,
+				currentValue: currentSchema || null,
+				targetLabel: newSchema.title || oldSchema.title || `${id}`,
+				id
+			};
+		});
+		const buildCodeBlockDiffPayload = (id, index) => findGroupStep(historyService.getCodeBlockHistoryGroups(), id, index, ({ oldContent, newContent }) => {
+			if (!oldContent || !newContent) return null;
+			return {
+				category: "code-block",
+				lastValue: oldContent,
+				value: newContent,
+				currentValue: codeBlockService.getCodeContentById(id) || null,
+				targetLabel: newContent.name || oldContent.name || `${id}`,
+				id
+			};
+		});
+		const onPageDiff = (index) => {
+			const payload = buildPageDiffPayload(index);
+			if (payload) diffDialogRef.value?.open(payload);
+		};
+		const onDataSourceDiff = (id, index) => {
+			const payload = buildDataSourceDiffPayload(id, index);
+			if (payload) diffDialogRef.value?.open(payload);
 		};
 		const onCodeBlockDiff = (id, index) => {
-			const groups = historyService.getCodeBlockHistoryGroups();
-			for (const group of groups) {
-				if (group.id !== id) continue;
-				const entry = group.steps.find((s) => s.index === index);
-				if (!entry) continue;
-				const { oldContent, newContent } = entry.step;
-				if (!oldContent || !newContent) return;
-				const currentContent = codeBlockService.getCodeContentById(id);
-				diffDialogRef.value?.open({
-					category: "code-block",
-					lastValue: oldContent,
-					value: newContent,
-					currentValue: currentContent || null,
-					targetLabel: newContent.name || oldContent.name || `${id}`,
-					id
-				});
-				return;
-			}
+			const payload = buildCodeBlockDiffPayload(id, index);
+			if (payload) diffDialogRef.value?.open(payload);
+		};
+		const onConfirmRevert = shallowRef();
+		/**
+		* 「回滚」入口：把目标历史步骤的修改作为一次新操作反向应用（类 git revert），
+		* 不破坏原有栈结构。各 service 内部完成反向 + 入栈，并自带描述用于面板展示。
+		*
+		* 交互：先弹出该步骤的差异弹窗供用户确认，点击「确定回滚」后再真正执行回滚；
+		* 对没有可对比内容的步骤（如 add / remove / 多节点更新）则直接回滚。
+		*/
+		const onPageRevert = (index) => {
+			const payload = buildPageDiffPayload(index);
+			onConfirmRevert.value = () => editorService.revertPageStep(index);
+			if (payload) diffDialogRef.value?.open({ ...payload });
+			else onConfirmRevert.value();
+		};
+		const onDataSourceRevert = (id, index) => {
+			const payload = buildDataSourceDiffPayload(id, index);
+			onConfirmRevert.value = () => dataSourceService.revert(id, index);
+			if (payload) diffDialogRef.value?.open({ ...payload });
+			else onConfirmRevert.value();
+		};
+		const onCodeBlockRevert = (id, index) => {
+			const payload = buildCodeBlockDiffPayload(id, index);
+			onConfirmRevert.value = () => codeBlockService.revert(id, index);
+			if (payload) diffDialogRef.value?.open({ ...payload });
+			else onConfirmRevert.value();
+		};
+		const onDiffDialogClose = () => {
+			onConfirmRevert.value = void 0;
 		};
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock(Fragment, null, [createVNode(unref(TMagicPopover), {
@@ -217,13 +262,19 @@ var HistoryListPanel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 							])]),
 							_: 1
 						}, 16)),
-						(openBlock(), createBlock(resolveDynamicComponent(unref(tabPaneComponent)?.component || "el-tab-pane"), normalizeProps(guardReactiveProps(unref(tabPaneComponent)?.props({
+						!disabledDataSource.value ? (openBlock(), createBlock(resolveDynamicComponent(unref(tabPaneComponent)?.component || "el-tab-pane"), normalizeProps(mergeProps({ key: 0 }, unref(tabPaneComponent)?.props({
 							name: "data-source",
 							label: `数据源 (${unref(dataSourceGroups).length})`
 						}) || {})), {
-							default: withCtx(() => [createVNode(DataSourceTab_default, {
+							default: withCtx(() => [createVNode(BucketTab_default, {
+								title: "数据源",
+								prefix: "ds",
 								buckets: unref(dataSourceGroupsByTarget),
 								expanded: unref(expanded),
+								"describe-group": unref(describeDataSourceGroup),
+								"describe-step": unref(describeDataSourceStep),
+								"is-step-diffable": isDataSourceStepDiffable,
+								"is-step-revertable": unref(isDataSourceStepRevertable),
 								onToggle: unref(toggleGroup),
 								onGoto: onDataSourceGoto,
 								onGotoInitial: onDataSourceGotoInitial,
@@ -232,17 +283,26 @@ var HistoryListPanel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 							}, null, 8, [
 								"buckets",
 								"expanded",
+								"describe-group",
+								"describe-step",
+								"is-step-revertable",
 								"onToggle"
 							])]),
 							_: 1
-						}, 16)),
-						(openBlock(), createBlock(resolveDynamicComponent(unref(tabPaneComponent)?.component || "el-tab-pane"), normalizeProps(guardReactiveProps(unref(tabPaneComponent)?.props({
+						}, 16)) : createCommentVNode("v-if", true),
+						!disabledCodeBlock.value ? (openBlock(), createBlock(resolveDynamicComponent(unref(tabPaneComponent)?.component || "el-tab-pane"), normalizeProps(mergeProps({ key: 1 }, unref(tabPaneComponent)?.props({
 							name: "code-block",
 							label: `代码块 (${unref(codeBlockGroups).length})`
 						}) || {})), {
-							default: withCtx(() => [createVNode(CodeBlockTab_default, {
+							default: withCtx(() => [createVNode(BucketTab_default, {
+								title: "代码块",
+								prefix: "cb",
 								buckets: unref(codeBlockGroupsByTarget),
 								expanded: unref(expanded),
+								"describe-group": unref(describeCodeBlockGroup),
+								"describe-step": unref(describeCodeBlockStep),
+								"is-step-diffable": isCodeBlockStepDiffable,
+								"is-step-revertable": unref(isCodeBlockStepRevertable),
 								onToggle: unref(toggleGroup),
 								onGoto: onCodeBlockGoto,
 								onGotoInitial: onCodeBlockGotoInitial,
@@ -251,18 +311,32 @@ var HistoryListPanel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 							}, null, 8, [
 								"buckets",
 								"expanded",
+								"describe-group",
+								"describe-step",
+								"is-step-revertable",
 								"onToggle"
 							])]),
 							_: 1
-						}, 16))
+						}, 16)) : createCommentVNode("v-if", true),
+						(openBlock(true), createElementBlock(Fragment, null, renderList(unref(extraTabs), (tab) => {
+							return openBlock(), createBlock(resolveDynamicComponent(unref(tabPaneComponent)?.component || "el-tab-pane"), mergeProps({ key: tab.name }, { ref_for: true }, unref(tabPaneComponent)?.props({
+								name: tab.name,
+								label: resolveTabLabel(tab)
+							}) || {}), {
+								default: withCtx(() => [(openBlock(), createBlock(resolveDynamicComponent(tab.component), mergeProps({ ref_for: true }, tab.props || {}, toHandlers(tab.listeners || {})), null, 16))]),
+								_: 2
+							}, 1040);
+						}), 128))
 					]),
 					_: 1
 				}, 8, ["modelValue"])])]),
 				_: 1
 			}, 8, ["visible"]), createVNode(HistoryDiffDialog_default, {
 				ref: "diffDialog",
-				"extend-state": unref(extendFormState)
-			}, null, 8, ["extend-state"])], 64);
+				"extend-state": unref(extendFormState),
+				"on-confirm": onConfirmRevert.value,
+				onClose: onDiffDialogClose
+			}, null, 8, ["extend-state", "on-confirm"])], 64);
 		};
 	}
 });

package/dist/es/layouts/history-list/InitialRow.vue_vue_type_script_setup_true_lang.js

@@ -1,14 +1,16 @@
-import { createCommentVNode, createElementBlock, createElementVNode, defineComponent, normalizeClass, openBlock } from "vue";
+import { createCommentVNode, createElementBlock, createElementVNode, defineComponent, normalizeClass, openBlock, withModifiers } from "vue";
 //#region packages/editor/src/layouts/history-list/InitialRow.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["title"];
-var _hoisted_2 = {
-	key: 0,
-	class: "m-editor-history-list-item-current"
-};
 var InitialRow_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	name: "MEditorHistoryListInitialRow",
 	__name: "InitialRow",
-	props: { isCurrent: { type: Boolean } },
+	props: {
+		isCurrent: { type: Boolean },
+		gotoEnabled: {
+			type: Boolean,
+			default: true
+		}
+	},
 	emits: ["goto-initial"],
 	setup(__props, { emit: __emit }) {
 		/**
@@ -30,8 +32,7 @@ var InitialRow_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ def
 					"is-current": __props.isCurrent,
 					"is-clickable": !__props.isCurrent
 				}]),
-				title: __props.isCurrent ? "当前已回到未修改的初始状态" : "点击回到未修改的初始状态",
-				onClick
+				title: __props.isCurrent ? "当前已回到未修改的初始状态" : "点击回到未修改的初始状态"
 			}, [
 				_cache[0] || (_cache[0] = createElementVNode("span", {
 					class: "m-editor-history-list-item-index",
@@ -39,7 +40,12 @@ var InitialRow_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ def
 				}, "#0", -1)),
 				_cache[1] || (_cache[1] = createElementVNode("span", { class: "m-editor-history-list-item-op op-initial" }, "初始", -1)),
 				_cache[2] || (_cache[2] = createElementVNode("span", { class: "m-editor-history-list-item-desc" }, "未修改的初始状态", -1)),
-				__props.isCurrent ? (openBlock(), createElementBlock("span", _hoisted_2, "当前")) : createCommentVNode("v-if", true)
+				__props.gotoEnabled && !__props.isCurrent ? (openBlock(), createElementBlock("span", {
+					key: 0,
+					class: "m-editor-history-list-item-goto",
+					title: "回到该记录",
+					onClick: withModifiers(onClick, ["stop"])
+				}, "回到")) : createCommentVNode("v-if", true)
 			], 10, _hoisted_1);
 		};
 	}

package/dist/es/layouts/history-list/PageTab.vue_vue_type_script_setup_true_lang.js

@@ -1,4 +1,4 @@
-import { describePageGroup, describePageStep } from "./composables.js";
+import { describePageGroup, describePageStep, formatHistoryFullTime, formatHistoryTime, groupSource, groupTimestamp, isPageStepRevertable } from "./composables.js";
 import GroupRow_default from "./GroupRow.js";
 import InitialRow_default from "./InitialRow.js";
 import { TMagicScrollbar } from "@tmagic/design";
@@ -49,14 +49,17 @@ var PageTab_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ define
 				"max-height": "360px"
 			}, {
 				default: withCtx(() => [createElementVNode("ul", _hoisted_2, [
-					(openBlock(true), createElementBlock(Fragment, null, renderList(__props.list, (group, gIdx) => {
+					(openBlock(true), createElementBlock(Fragment, null, renderList(__props.list, (group) => {
 						return openBlock(), createBlock(GroupRow_default, {
-							key: `pg-${gIdx}`,
-							"group-key": `pg-${gIdx}`,
+							key: `pg-${group.steps[0]?.index}`,
+							"group-key": `pg-${group.steps[0]?.index}`,
 							applied: group.applied,
 							merged: group.steps.length > 1,
 							"op-type": group.opType,
 							desc: unref(describePageGroup)(group),
+							source: unref(groupSource)(group),
+							time: unref(formatHistoryTime)(unref(groupTimestamp)(group)),
+							"time-title": unref(formatHistoryFullTime)(unref(groupTimestamp)(group)),
 							"step-count": group.steps.length,
 							"sub-steps": group.steps.map((s) => ({
 								index: s.index,
@@ -64,10 +67,13 @@ var PageTab_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ define
 								isCurrent: s.isCurrent,
 								desc: unref(describePageStep)(s.step),
 								diffable: isPageStepDiffable(s.step),
-								revertable: s.applied
+								revertable: s.applied && unref(isPageStepRevertable)(s.step),
+								source: s.step.source,
+								time: unref(formatHistoryTime)(s.step.timestamp),
+								timeTitle: unref(formatHistoryFullTime)(s.step.timestamp)
 							})),
 							"is-current": group.isCurrent,
-							expanded: !!__props.expanded[`pg-${gIdx}`],
+							expanded: !!__props.expanded[`pg-${group.steps[0]?.index}`],
 							onToggle: _cache[0] || (_cache[0] = (key) => _ctx.$emit("toggle", key)),
 							onGoto: _cache[1] || (_cache[1] = (index) => _ctx.$emit("goto", index)),
 							onDiffStep: _cache[2] || (_cache[2] = (index) => _ctx.$emit("diff-step", index)),
@@ -78,6 +84,9 @@ var PageTab_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ define
 							"merged",
 							"op-type",
 							"desc",
+							"source",
+							"time",
+							"time-title",
 							"step-count",
 							"sub-steps",
 							"is-current",

package/dist/es/layouts/history-list/composables.js

@@ -1,4 +1,5 @@
 import { useServices } from "../../hooks/use-services.js";
+import { datetimeFormatter } from "@tmagic/form";
 import { computed, reactive } from "vue";
 //#region packages/editor/src/layouts/history-list/composables.ts
 /**
@@ -11,7 +12,10 @@ import { computed, reactive } from "vue";
 */
 var useHistoryList = () => {
 	const { historyService } = useServices();
-	/** 折叠状态：key 形如 `pg-${groupIdx}` / `ds-${id}-${groupIdx}` / `cb-${id}-${groupIdx}`。 */
+	/**
+	* 折叠状态：key 形如 `pg-${组内首步 index}` / `ds-${id}-${组内首步 index}` / `cb-${id}-${组内首步 index}`。
+	* 用组内首步的稳定 index（而非展示位置）作为 key，确保历史数据更新后已展开的分组状态保持不变。
+	*/
 	const expanded = reactive({});
 	const toggleGroup = (key) => {
 		expanded[key] = !expanded[key];
@@ -48,6 +52,20 @@ var useHistoryList = () => {
 		codeBlockGroupsByTarget: computed(() => groupByTarget(codeBlockGroups.value))
 	};
 };
+/**
+* 历史面板的时间展示：
+* - 当天的记录只显示 `HH:mm:ss`；
+* - 跨天的记录显示 `MM-DD HH:mm:ss`。
+* 无时间戳（旧数据 / 未写入）时返回空串，UI 据此不渲染时间。
+*/
+var formatHistoryTime = (timestamp) => {
+	if (!timestamp) return "";
+	return `${datetimeFormatter(new Date(timestamp), "", "YYYY-MM-DD") === datetimeFormatter(/* @__PURE__ */ new Date(), "", "YYYY-MM-DD") ? datetimeFormatter(new Date(timestamp), "", "HH:mm:ss") : datetimeFormatter(new Date(timestamp), "", "MM-DD HH:mm:ss")}`;
+};
+/** 完整时间（含年份与秒），用于 title 悬浮提示。无时间戳时返回空串。 */
+var formatHistoryFullTime = (timestamp) => timestamp ? `${datetimeFormatter(new Date(timestamp), "", "YYYY-MM-DD HH:mm:ss")}` : "";
+/** 取一组历史步骤里最后一步（最近一次）的时间戳，用于组头部展示。 */
+var groupTimestamp = (group) => group.steps[group.steps.length - 1]?.step.timestamp;
 var opLabel = (op) => {
 	switch (op) {
 		case "add": return "新增";
@@ -55,6 +73,28 @@ var opLabel = (op) => {
 		default: return "修改";
 	}
 };
+/** 内置操作途径的中文文案；自定义来源直接回显原值，未知 / 缺省返回空串（UI 据此不渲染）。 */
+var HISTORY_SOURCE_LABELS = {
+	stage: "画布",
+	tree: "树面板",
+	"component-panel": "组件面板",
+	props: "配置面板",
+	code: "源码",
+	"stage-contextmenu": "画布菜单",
+	"tree-contextmenu": "树菜单",
+	toolbar: "工具栏",
+	shortcut: "快捷键",
+	rollback: "回滚",
+	api: "接口",
+	ai: "AI",
+	unknown: "未知"
+};
+/** 操作途径文案：用于历史面板展示「画布 / 树面板 / 配置面板…」标签。 */
+var sourceLabel = (source = "unknown") => {
+	return HISTORY_SOURCE_LABELS[source] ?? `${source}`;
+};
+/** 取一组历史步骤里最后一步（最近一次）的操作途径，用于组头部展示。 */
+var groupSource = (group) => group.steps[group.steps.length - 1]?.step.source;
 var nameOf = (node) => node?.name || node?.type || `${node?.id ?? ""}`;
 /**
 * 默认描述里展示「名称 (id: xxx)」，便于区分同名实体。
@@ -150,5 +190,35 @@ var describeCodeBlockGroup = (group) => {
 	const target = labelWithId(group.steps[group.steps.length - 1].step.newContent?.name || group.steps[0].step.oldContent?.name, group.id);
 	return pathList ? `修改 ${target} · ${pathList}${paths.size > 3 ? "…" : ""}` : `修改 ${target}`;
 };
+/**
+* 页面 step 是否支持「回滚」（类 git revert）：
+* - 新增 / 删除：不依赖 changeRecords，反向应用即删除 / 加回，始终可回滚；
+* - 更新：必须每个被更新节点都带有 changeRecords，才支持按 propPath 局部反向 patch。
+*   缺失 changeRecords 的更新只能整节点替换，会冲掉该节点后续的无关变更，因此不支持回滚。
+*/
+var isPageStepRevertable = (step) => {
+	if (step.opType !== "update") return true;
+	const items = step.updatedItems ?? [];
+	if (!items.length) return false;
+	return items.every((item) => Boolean(item.changeRecords?.length));
+};
+/**
+* 数据源 step 是否支持「回滚」：
+* - 新增（oldSchema=null）/ 删除（newSchema=null）：不依赖 changeRecords，始终可回滚；
+* - 更新（前后 schema 都存在）：必须有 changeRecords 才支持局部反向 patch，否则不支持回滚。
+*/
+var isDataSourceStepRevertable = (step) => {
+	if (step.oldSchema === null || step.newSchema === null) return true;
+	return Boolean(step.changeRecords?.length);
+};
+/**
+* 代码块 step 是否支持「回滚」：
+* - 新增（oldContent=null）/ 删除（newContent=null）：不依赖 changeRecords，始终可回滚；
+* - 更新（前后 content 都存在）：必须有 changeRecords 才支持局部反向 patch，否则不支持回滚。
+*/
+var isCodeBlockStepRevertable = (step) => {
+	if (step.oldContent === null || step.newContent === null) return true;
+	return Boolean(step.changeRecords?.length);
+};
 //#endregion
-export { describeCodeBlockGroup, describeCodeBlockStep, describeDataSourceGroup, describeDataSourceStep, describePageGroup, describePageStep, opLabel, useHistoryList };
+export { describeCodeBlockGroup, describeCodeBlockStep, describeDataSourceGroup, describeDataSourceStep, describePageGroup, describePageStep, formatHistoryFullTime, formatHistoryTime, groupSource, groupTimestamp, isCodeBlockStepRevertable, isDataSourceStepRevertable, isPageStepRevertable, opLabel, sourceLabel, useHistoryList };

package/dist/es/layouts/props-panel/PropsPanel.vue_vue_type_script_setup_true_lang.js

@@ -69,7 +69,11 @@ var PropsPanel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ def
 						if (record.propPath?.startsWith("style") && record.value === "") setValueByKeyPath(record.propPath, record.value, newValue);
 					});
 				}
-				editorService.update(newValue, { changeRecords: eventData?.changeRecords });
+				const historySource = eventData ? "props" : "code";
+				editorService.update(newValue, {
+					changeRecords: eventData?.changeRecords,
+					historySource
+				});
 			} catch (e) {
 				emit("submit-error", e);
 			}

package/dist/es/layouts/sidebar/ComponentListPanel.vue_vue_type_script_setup_true_lang.js

@@ -37,7 +37,7 @@ var ComponentListPanel_vue_vue_type_script_setup_true_lang_default = /* @__PURE_
 				name: text,
 				type,
 				...data
-			});
+			}, void 0, { historySource: "component-panel" });
 		};
 		const dragstartHandler = ({ text, type, data = {} }, e) => {
 			e.dataTransfer?.setData("text/json", serialize({

package/dist/es/layouts/sidebar/code-block/CodeBlockList.vue_vue_type_script_setup_true_lang.js

@@ -78,7 +78,7 @@ var CodeBlockList_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		const editCode = (id) => {
 			emit("edit", id);
 		};
-		const deleteCode = async (id) => {
+		const deleteCode = async (id, { historySource } = {}) => {
 			const currentCode = codeList.value.find((codeItem) => codeItem.id === id);
 			const existBinds = Boolean(currentCode?.items?.length);
 			const undeleteableList = codeBlockService.getUndeletableList() || [];
@@ -88,7 +88,7 @@ var CodeBlockList_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 					cancelButtonText: "取消",
 					type: "warning"
 				});
-				emit("remove", id);
+				emit("remove", id, { historySource });
 			} else if (typeof props.customError === "function") props.customError(id, existBinds ? CodeDeleteErrorType.BIND : CodeDeleteErrorType.UNDELETEABLE);
 			else if (existBinds) tMagicMessage.error("代码块存在绑定关系，不可删除");
 			else tMagicMessage.error("代码块不可删除");
@@ -138,7 +138,7 @@ var CodeBlockList_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 						default: withCtx(() => [createVNode(Icon_default, {
 							icon: unref(Close),
 							class: "edit-icon",
-							onClick: withModifiers(($event) => deleteCode(`${data.key}`), ["stop"])
+							onClick: withModifiers(($event) => deleteCode(`${data.key}`, { historySource: "tree" }), ["stop"])
 						}, null, 8, ["icon", "onClick"])]),
 						_: 2
 					}, 1024)) : createCommentVNode("v-if", true),

package/dist/es/layouts/sidebar/code-block/CodeBlockListPanel.vue_vue_type_script_setup_true_lang.js

@@ -38,7 +38,7 @@ var CodeBlockListPanel_vue_vue_type_script_setup_true_lang_default = /* @__PURE_
 			if (codeBlockListRef.value) for (const [, status] of codeBlockListRef.value.nodeStatusMap.entries()) status.selected = false;
 		};
 		const { nodeContentMenuHandler, menuData: contentMenuData, contentMenuHideHandler } = useContentMenu((id) => {
-			codeBlockListRef.value?.deleteCode(id);
+			codeBlockListRef.value?.deleteCode(id, { historySource: "tree-contextmenu" });
 		});
 		const menuData = computed(() => props.customContentMenu(contentMenuData, "code-block"));
 		return (_ctx, _cache) => {

package/dist/es/layouts/sidebar/code-block/useContentMenu.js

@@ -26,7 +26,7 @@ var useContentMenu = (deleteCode) => {
 				const codeBlock = codeBlockService.getCodeContentById(selectId);
 				if (!codeBlock) return;
 				const newCodeId = await codeBlockService.getUniqueId();
-				codeBlockService.setCodeDslById(newCodeId, cloneDeep(codeBlock));
+				codeBlockService.setCodeDslById(newCodeId, cloneDeep(codeBlock), { historySource: "tree-contextmenu" });
 			}
 		},
 		{

package/dist/es/layouts/sidebar/data-source/DataSourceListPanel.vue_vue_type_script_setup_true_lang.js

@@ -55,7 +55,7 @@ var DataSourceListPanel_vue_vue_type_script_setup_true_lang_default = /* @__PURE
 				cancelButtonText: "取消",
 				type: "warning"
 			});
-			dataSourceService.remove(id);
+			dataSourceService.remove(id, { historySource: "tree-contextmenu" });
 		};
 		const dataSourceListRef = useTemplateRef("dataSourceList");
 		const filterTextChangeHandler = (val) => {

package/dist/es/layouts/sidebar/data-source/useContentMenu.js

@@ -25,7 +25,7 @@ var useContentMenu = () => {
 				if (!selectId) return;
 				const ds = dataSourceService.getDataSourceById(selectId);
 				if (!ds) return;
-				dataSourceService.add(cloneDeep(ds));
+				dataSourceService.add(cloneDeep(ds), { historySource: "tree-contextmenu" });
 			}
 		},
 		{

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

@@ -32,7 +32,7 @@ var LayerMenu_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
 					name: component.text,
 					type: component.type,
 					...component.data || {}
-				});
+				}, void 0, { historySource: "tree-contextmenu" });
 			}
 		}));
 		const getSubMenuData = computed(() => {
@@ -41,7 +41,7 @@ var LayerMenu_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
 				type: "button",
 				icon: Files,
 				handler: () => {
-					editorService.add({ type: "tab-pane" });
+					editorService.add({ type: "tab-pane" }, void 0, { historySource: "tree-contextmenu" });
 				}
 			}];
 			if (node.value?.items) return componentList.value.reduce((subMenuData, group, index) => subMenuData.concat(createMenuItems(group), index < componentList.value.length - 1 ? [{
@@ -68,9 +68,9 @@ var LayerMenu_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
 				items: getSubMenuData.value
 			},
 			useCopyMenu(),
-			usePasteMenu(),
-			useDeleteMenu(),
-			useMoveToMenu(services),
+			usePasteMenu("tree-contextmenu"),
+			useDeleteMenu("tree-contextmenu"),
+			useMoveToMenu(services, "tree-contextmenu"),
 			...props.layerContentMenu
 		], "layer"));
 		const show = (e) => {

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

@@ -13,7 +13,7 @@ var LayerNodeTool_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 			editorService.update({
 				id: props.data.id,
 				visible
-			});
+			}, { historySource: "tree" });
 		};
 		return (_ctx, _cache) => {
 			return __props.data.type !== "page" ? (openBlock(), createBlock(unref(TMagicButton), {