@tmagic/editor 1.8.0-beta.6 → 1.8.0-beta.8
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.
- package/dist/es/components/CompareForm.vue_vue_type_script_setup_true_lang.js +10 -6
- package/dist/es/index.js +6 -4
- package/dist/es/layouts/NavMenu.vue_vue_type_script_setup_true_lang.js +2 -2
- package/dist/es/layouts/history-list/GroupRow.vue_vue_type_script_setup_true_lang.js +38 -26
- package/dist/es/layouts/history-list/HistoryDiffDialog.vue_vue_type_script_setup_true_lang.js +5 -1
- package/dist/es/layouts/history-list/HistoryListPanel.vue_vue_type_script_setup_true_lang.js +163 -310
- package/dist/es/layouts/history-list/composables.js +47 -128
- package/dist/es/layouts/history-list/useHistoryList.js +56 -0
- package/dist/es/layouts/history-list/useHistoryRevert.js +304 -0
- package/dist/es/layouts/sidebar/Sidebar.vue_vue_type_script_setup_true_lang.js +2 -2
- package/dist/es/layouts/sidebar/data-source/DataSourceConfigPanel.vue_vue_type_script_setup_true_lang.js +3 -3
- package/dist/es/services/codeBlock.js +32 -28
- package/dist/es/services/dataSource.js +43 -34
- package/dist/es/services/editor.js +31 -26
- package/dist/es/services/history.js +268 -384
- package/dist/es/style.css +12 -0
- package/dist/es/utils/editor.js +2 -2
- package/dist/es/utils/history.js +35 -47
- package/dist/style.css +12 -0
- package/dist/tmagic-editor.umd.cjs +3808 -3090
- package/package.json +7 -7
- package/src/components/CompareForm.vue +14 -6
- package/src/index.ts +2 -0
- package/src/layouts/NavMenu.vue +2 -2
- package/src/layouts/history-list/GroupRow.vue +10 -0
- package/src/layouts/history-list/HistoryDiffDialog.vue +6 -1
- package/src/layouts/history-list/HistoryListPanel.vue +60 -270
- package/src/layouts/history-list/PageTab.vue +4 -4
- package/src/layouts/history-list/composables.ts +82 -180
- package/src/layouts/history-list/useHistoryList.ts +60 -0
- package/src/layouts/history-list/useHistoryRevert.ts +400 -0
- package/src/layouts/sidebar/Sidebar.vue +2 -2
- package/src/layouts/sidebar/data-source/DataSourceConfigPanel.vue +5 -4
- package/src/services/codeBlock.ts +30 -29
- package/src/services/dataSource.ts +37 -37
- package/src/services/editor.ts +32 -29
- package/src/services/history.ts +340 -431
- package/src/theme/history-list-panel.scss +14 -0
- package/src/type.ts +179 -100
- package/src/utils/editor.ts +2 -2
- package/src/utils/history.ts +52 -74
- package/types/index.d.ts +435 -309
package/dist/es/style.css
CHANGED
|
@@ -839,6 +839,18 @@ fieldset.m-fieldset .m-form-tip {
|
|
|
839
839
|
white-space: nowrap;
|
|
840
840
|
font-weight: 400;
|
|
841
841
|
}
|
|
842
|
+
.m-editor-history-list-popover .m-editor-history-list-item-operator {
|
|
843
|
+
flex: 0 0 auto;
|
|
844
|
+
padding: 0 6px;
|
|
845
|
+
border: 1px solid #c6e2ff;
|
|
846
|
+
border-radius: 8px;
|
|
847
|
+
font-size: 10px;
|
|
848
|
+
line-height: 14px;
|
|
849
|
+
color: #409eff;
|
|
850
|
+
background-color: #ecf5ff;
|
|
851
|
+
white-space: nowrap;
|
|
852
|
+
font-weight: 400;
|
|
853
|
+
}
|
|
842
854
|
.m-editor-history-list-popover .m-editor-history-list-item-saved {
|
|
843
855
|
flex: 0 0 auto;
|
|
844
856
|
padding: 0 6px;
|
package/dist/es/utils/editor.js
CHANGED
|
@@ -208,8 +208,8 @@ var fixNodePosition = (config, parent, stage) => {
|
|
|
208
208
|
if (config.style?.position !== "absolute") return config.style;
|
|
209
209
|
const style = { ...config.style || {} };
|
|
210
210
|
const baseStyle = config.style || {};
|
|
211
|
-
if (
|
|
212
|
-
if ("top" in baseStyle && !("bottom" in baseStyle)) style.top = getMiddleTop(config, parent, stage);
|
|
211
|
+
if (!("right" in baseStyle)) style.left = fixNodeLeft(config, parent, stage?.renderer?.contentWindow?.document);
|
|
212
|
+
if (!("top" in baseStyle) && !("bottom" in baseStyle)) style.top = getMiddleTop(config, parent, stage);
|
|
213
213
|
return style;
|
|
214
214
|
};
|
|
215
215
|
var serializeConfig = (config) => serialize(config, {
|
package/dist/es/utils/history.js
CHANGED
|
@@ -33,7 +33,7 @@ var detectStackOpType = (oldVal, newVal) => {
|
|
|
33
33
|
*
|
|
34
34
|
* - `add`:oldValue = null;`remove`:newValue = null;`update`:两者都有,可带 changeRecords 做局部更新。
|
|
35
35
|
* - 内容会做 cloneDeep 防止后续被外部引用篡改;opType 依据 old/new 是否为 null 推断。
|
|
36
|
-
* - 仅负责构造 step 并返回,入栈与事件 emit
|
|
36
|
+
* - 仅负责构造 step 并返回,入栈与事件 emit 由统一的 history.push(stepType, step, id) 处理。
|
|
37
37
|
* - 不直接驱动业务 service,调用方负责实际写回。
|
|
38
38
|
*/
|
|
39
39
|
var createStackStep = (id, payload) => {
|
|
@@ -42,9 +42,14 @@ var createStackStep = (id, payload) => {
|
|
|
42
42
|
const newSchema = payload.newValue ? cloneDeep(payload.newValue) : null;
|
|
43
43
|
const changeRecords = payload.changeRecords?.length ? cloneDeep(payload.changeRecords) : void 0;
|
|
44
44
|
const opType = detectStackOpType(payload.oldValue, payload.newValue);
|
|
45
|
+
const schema = payload.newValue ?? payload.oldValue;
|
|
46
|
+
const name = payload.name ?? schema?.name ?? schema?.title ?? "";
|
|
45
47
|
return {
|
|
46
48
|
uuid: guid(),
|
|
47
|
-
|
|
49
|
+
data: {
|
|
50
|
+
name,
|
|
51
|
+
id
|
|
52
|
+
},
|
|
48
53
|
opType,
|
|
49
54
|
diff: [{
|
|
50
55
|
...newSchema !== null ? { newSchema } : {},
|
|
@@ -53,7 +58,10 @@ var createStackStep = (id, payload) => {
|
|
|
53
58
|
}],
|
|
54
59
|
historyDescription: payload.historyDescription,
|
|
55
60
|
source: payload.source,
|
|
56
|
-
|
|
61
|
+
operator: payload.operator,
|
|
62
|
+
rootStep: payload.rootStep,
|
|
63
|
+
timestamp: Date.now(),
|
|
64
|
+
extra: payload.extra
|
|
57
65
|
};
|
|
58
66
|
};
|
|
59
67
|
var markStackSaved = (undoRedo) => {
|
|
@@ -66,46 +74,22 @@ var markStackSaved = (undoRedo) => {
|
|
|
66
74
|
});
|
|
67
75
|
};
|
|
68
76
|
/**
|
|
69
|
-
*
|
|
70
|
-
*
|
|
77
|
+
* 把单个历史栈(页面 / 代码块 / 数据源 / 扩展类型)的步骤列表按"目标"做相邻合并:
|
|
78
|
+
* - 单实体的 'update' 按 targetId 与相邻同 targetId 的 update 合并到一个 group,组内可展开查看每步;
|
|
79
|
+
* - 'add' / 'remove' 始终独立成组(语义上是结构变更,不应被收纳进单实体修改组);
|
|
80
|
+
* - 多实体 'update'(如页面批量改属性)也独立成组(无明确单一目标,避免误合并)。
|
|
71
81
|
*
|
|
72
|
-
*
|
|
82
|
+
* 各类型行为完全一致,仅 `kind` 与 step 快照类型不同,统一由本方法处理。
|
|
73
83
|
*/
|
|
74
|
-
var
|
|
75
|
-
const currentIndex = cursor - 1;
|
|
76
|
-
return list.map((step, index) => {
|
|
77
|
-
const applied = index < cursor;
|
|
78
|
-
const isCurrent = index === currentIndex;
|
|
79
|
-
return {
|
|
80
|
-
kind,
|
|
81
|
-
id,
|
|
82
|
-
opType: step.opType,
|
|
83
|
-
steps: [{
|
|
84
|
-
step,
|
|
85
|
-
index,
|
|
86
|
-
applied,
|
|
87
|
-
isCurrent
|
|
88
|
-
}],
|
|
89
|
-
applied,
|
|
90
|
-
isCurrent
|
|
91
|
-
};
|
|
92
|
-
});
|
|
93
|
-
};
|
|
94
|
-
/**
|
|
95
|
-
* 把页面栈拆成若干 group:
|
|
96
|
-
* - 单节点的 'update' 按 targetId 与相邻同 targetId 的 update 合并到一个 group;
|
|
97
|
-
* - 'add' / 'remove' 始终独立成组(语义上是结构变更,不应被收纳进单节点修改组);
|
|
98
|
-
* - 多节点 'update'(如批量改属性)也独立成组(无明确单一目标,避免误合并)。
|
|
99
|
-
*/
|
|
100
|
-
var mergePageSteps = (pageId, list, cursor) => {
|
|
84
|
+
var mergeSteps = (kind, id, list, cursor) => {
|
|
101
85
|
const groups = [];
|
|
102
86
|
let current = null;
|
|
103
87
|
const currentIndex = cursor - 1;
|
|
104
88
|
list.forEach((step, index) => {
|
|
105
89
|
const applied = index < cursor;
|
|
106
90
|
const isCurrent = index === currentIndex;
|
|
107
|
-
const targetId =
|
|
108
|
-
const targetName =
|
|
91
|
+
const targetId = detectTargetId(step);
|
|
92
|
+
const targetName = detectTargetName(step);
|
|
109
93
|
const entry = {
|
|
110
94
|
step,
|
|
111
95
|
index,
|
|
@@ -120,8 +104,8 @@ var mergePageSteps = (pageId, list, cursor) => {
|
|
|
120
104
|
if (targetName) current.targetName = targetName;
|
|
121
105
|
} else {
|
|
122
106
|
current = {
|
|
123
|
-
kind
|
|
124
|
-
|
|
107
|
+
kind,
|
|
108
|
+
id,
|
|
125
109
|
opType: step.opType,
|
|
126
110
|
targetId: mergeable ? targetId : void 0,
|
|
127
111
|
targetName,
|
|
@@ -135,18 +119,21 @@ var mergePageSteps = (pageId, list, cursor) => {
|
|
|
135
119
|
return groups;
|
|
136
120
|
};
|
|
137
121
|
/**
|
|
138
|
-
* 解析
|
|
139
|
-
* -
|
|
140
|
-
*
|
|
122
|
+
* 解析 step 中的"目标 id"用于合并:
|
|
123
|
+
* - 单实体 update:取唯一一项 diff 的快照 id;快照无 id 时(如 CodeBlockContent)回退到 `step.data.id`
|
|
124
|
+
* (即资源 id),使代码块 / 数据源同样能按资源合并相邻 update;
|
|
125
|
+
* - 其它情形(多实体 update / add / remove):返回 undefined,表示不参与合并。
|
|
141
126
|
*/
|
|
142
|
-
var
|
|
127
|
+
var detectTargetId = (step) => {
|
|
143
128
|
if (step.opType !== "update") return void 0;
|
|
144
129
|
const items = step.diff;
|
|
145
130
|
if (items?.length !== 1) return void 0;
|
|
146
|
-
|
|
131
|
+
const newSchema = items[0].newSchema;
|
|
132
|
+
const oldSchema = items[0].oldSchema;
|
|
133
|
+
return newSchema?.id ?? oldSchema?.id ?? step.data?.id;
|
|
147
134
|
};
|
|
148
|
-
/** 解析
|
|
149
|
-
var
|
|
135
|
+
/** 解析 step 中的目标可读名(用于 UI 展示)。 */
|
|
136
|
+
var detectTargetName = (step) => {
|
|
150
137
|
const items = step.diff;
|
|
151
138
|
if (step.opType === "update") {
|
|
152
139
|
if (items?.length === 1) {
|
|
@@ -220,8 +207,9 @@ var getOrCreateStack = (stacks, id) => {
|
|
|
220
207
|
return stacks[id];
|
|
221
208
|
};
|
|
222
209
|
/**
|
|
223
|
-
*
|
|
224
|
-
*
|
|
210
|
+
* 撤销下限:当栈 index 0 是 `opType: 'initial'` 的基线 step 时为 1(基线不可被撤销),否则为 0。
|
|
211
|
+
* 适用于所有历史类型(page / codeBlock / dataSource / 扩展),把 cursor 钉在基线之上,
|
|
212
|
+
* 保证 undo / canUndo / goto 都不会越过初始基线。
|
|
225
213
|
*/
|
|
226
214
|
var undoFloor = (undoRedo) => {
|
|
227
215
|
return undoRedo.getElementList()[0]?.opType === "initial" ? 1 : 0;
|
|
@@ -229,4 +217,4 @@ var undoFloor = (undoRedo) => {
|
|
|
229
217
|
/** 将单次 push 产生的 history uuid(或 null)转为 *AndGetHistoryId 返回用的 uuid 列表。 */
|
|
230
218
|
var getLastPushedHistoryIds = (historyId) => historyId ? [historyId] : [];
|
|
231
219
|
//#endregion
|
|
232
|
-
export { createStackStep, describeRevertStep, deserializeStacks,
|
|
220
|
+
export { createStackStep, describeRevertStep, deserializeStacks, detectStackOpType, detectTargetId, detectTargetName, getLastPushedHistoryIds, getOrCreateStack, markStackSaved, mergeSteps, serializeStacks, undoFloor };
|
package/dist/style.css
CHANGED
|
@@ -839,6 +839,18 @@ fieldset.m-fieldset .m-form-tip {
|
|
|
839
839
|
white-space: nowrap;
|
|
840
840
|
font-weight: 400;
|
|
841
841
|
}
|
|
842
|
+
.m-editor-history-list-popover .m-editor-history-list-item-operator {
|
|
843
|
+
flex: 0 0 auto;
|
|
844
|
+
padding: 0 6px;
|
|
845
|
+
border: 1px solid #c6e2ff;
|
|
846
|
+
border-radius: 8px;
|
|
847
|
+
font-size: 10px;
|
|
848
|
+
line-height: 14px;
|
|
849
|
+
color: #409eff;
|
|
850
|
+
background-color: #ecf5ff;
|
|
851
|
+
white-space: nowrap;
|
|
852
|
+
font-weight: 400;
|
|
853
|
+
}
|
|
842
854
|
.m-editor-history-list-popover .m-editor-history-list-item-saved {
|
|
843
855
|
flex: 0 0 auto;
|
|
844
856
|
padding: 0 6px;
|