@lvce-editor/main-area-worker 8.9.0 → 8.11.0
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/mainAreaWorkerMain.js +140 -119
- package/package.json +1 -1
|
@@ -87,17 +87,50 @@ const terminate = () => {
|
|
|
87
87
|
globalThis.close();
|
|
88
88
|
};
|
|
89
89
|
|
|
90
|
+
const getGroupIndexById = (state, groupId) => {
|
|
91
|
+
return state.layout.groups.findIndex(group => group.id === groupId);
|
|
92
|
+
};
|
|
93
|
+
|
|
94
|
+
const redistributeSizesWithRounding = groups => {
|
|
95
|
+
return groups.map(group => ({
|
|
96
|
+
...group,
|
|
97
|
+
size: Math.round(100 / groups.length)
|
|
98
|
+
}));
|
|
99
|
+
};
|
|
100
|
+
|
|
101
|
+
const withGroupsAndActiveGroup = (state, groups, activeGroupId) => {
|
|
102
|
+
return {
|
|
103
|
+
...state,
|
|
104
|
+
layout: {
|
|
105
|
+
...state.layout,
|
|
106
|
+
activeGroupId,
|
|
107
|
+
groups
|
|
108
|
+
}
|
|
109
|
+
};
|
|
110
|
+
};
|
|
111
|
+
|
|
112
|
+
const withEmptyGroups = state => {
|
|
113
|
+
return withGroupsAndActiveGroup(state, [], undefined);
|
|
114
|
+
};
|
|
115
|
+
|
|
116
|
+
const withGroups = (state, groups) => {
|
|
117
|
+
return {
|
|
118
|
+
...state,
|
|
119
|
+
layout: {
|
|
120
|
+
...state.layout,
|
|
121
|
+
groups
|
|
122
|
+
}
|
|
123
|
+
};
|
|
124
|
+
};
|
|
125
|
+
|
|
90
126
|
const closeTab = (state, groupId, tabId) => {
|
|
91
|
-
const {
|
|
92
|
-
layout
|
|
93
|
-
} = state;
|
|
94
127
|
const {
|
|
95
128
|
activeGroupId,
|
|
96
129
|
groups
|
|
97
|
-
} = layout;
|
|
130
|
+
} = state.layout;
|
|
98
131
|
|
|
99
132
|
// Find the group to close the tab from
|
|
100
|
-
const groupIndex =
|
|
133
|
+
const groupIndex = getGroupIndexById(state, groupId);
|
|
101
134
|
if (groupIndex === -1) {
|
|
102
135
|
return state;
|
|
103
136
|
}
|
|
@@ -136,48 +169,23 @@ const closeTab = (state, groupId, tabId) => {
|
|
|
136
169
|
|
|
137
170
|
// If there are remaining groups, redistribute sizes
|
|
138
171
|
if (remainingGroups.length > 0) {
|
|
139
|
-
const redistributedGroups = remainingGroups
|
|
140
|
-
...grp,
|
|
141
|
-
size: Math.round(100 / remainingGroups.length)
|
|
142
|
-
}));
|
|
172
|
+
const redistributedGroups = redistributeSizesWithRounding(remainingGroups);
|
|
143
173
|
const newActiveGroupId = activeGroupId === groupId ? remainingGroups[0]?.id : activeGroupId;
|
|
144
|
-
return
|
|
145
|
-
...state,
|
|
146
|
-
layout: {
|
|
147
|
-
...layout,
|
|
148
|
-
activeGroupId: newActiveGroupId,
|
|
149
|
-
groups: redistributedGroups
|
|
150
|
-
}
|
|
151
|
-
};
|
|
174
|
+
return withGroupsAndActiveGroup(state, redistributedGroups, newActiveGroupId);
|
|
152
175
|
}
|
|
153
176
|
|
|
154
177
|
// If no remaining groups, return empty layout
|
|
155
|
-
return
|
|
156
|
-
...state,
|
|
157
|
-
layout: {
|
|
158
|
-
...layout,
|
|
159
|
-
activeGroupId: undefined,
|
|
160
|
-
groups: []
|
|
161
|
-
}
|
|
162
|
-
};
|
|
178
|
+
return withEmptyGroups(state);
|
|
163
179
|
}
|
|
164
|
-
return
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
}
|
|
170
|
-
};
|
|
180
|
+
return withGroups(state, newGroups);
|
|
181
|
+
};
|
|
182
|
+
|
|
183
|
+
const getFocusedGroup = state => {
|
|
184
|
+
return state.layout.groups.find(group => group.focused);
|
|
171
185
|
};
|
|
172
186
|
|
|
173
187
|
const closeActiveEditor = state => {
|
|
174
|
-
const
|
|
175
|
-
layout
|
|
176
|
-
} = state;
|
|
177
|
-
const {
|
|
178
|
-
groups
|
|
179
|
-
} = layout;
|
|
180
|
-
const focusedGroup = groups.find(group => group.focused);
|
|
188
|
+
const focusedGroup = getFocusedGroup(state);
|
|
181
189
|
if (!focusedGroup) {
|
|
182
190
|
return state;
|
|
183
191
|
}
|
|
@@ -191,16 +199,12 @@ const closeActiveEditor = state => {
|
|
|
191
199
|
};
|
|
192
200
|
|
|
193
201
|
const closeAll$1 = state => {
|
|
194
|
-
return
|
|
195
|
-
...state,
|
|
196
|
-
layout: {
|
|
197
|
-
...state.layout,
|
|
198
|
-
activeGroupId: undefined,
|
|
199
|
-
groups: []
|
|
200
|
-
}
|
|
201
|
-
};
|
|
202
|
+
return withEmptyGroups(state);
|
|
202
203
|
};
|
|
203
204
|
|
|
205
|
+
const isFocused = group => {
|
|
206
|
+
return group.focused;
|
|
207
|
+
};
|
|
204
208
|
const closeFocusedTab = state => {
|
|
205
209
|
const {
|
|
206
210
|
layout
|
|
@@ -208,7 +212,7 @@ const closeFocusedTab = state => {
|
|
|
208
212
|
const {
|
|
209
213
|
groups
|
|
210
214
|
} = layout;
|
|
211
|
-
const focusedGroup = groups.find(
|
|
215
|
+
const focusedGroup = groups.find(isFocused);
|
|
212
216
|
if (!focusedGroup) {
|
|
213
217
|
return state;
|
|
214
218
|
}
|
|
@@ -264,14 +268,15 @@ const closeOtherTabs = (state, groupId) => {
|
|
|
264
268
|
};
|
|
265
269
|
};
|
|
266
270
|
|
|
271
|
+
const getGroupById = (state, groupId) => {
|
|
272
|
+
return state.layout.groups.find(group => group.id === groupId);
|
|
273
|
+
};
|
|
274
|
+
|
|
267
275
|
const closeTabsRight = (state, groupId) => {
|
|
268
|
-
const {
|
|
269
|
-
layout
|
|
270
|
-
} = state;
|
|
271
276
|
const {
|
|
272
277
|
groups
|
|
273
|
-
} = layout;
|
|
274
|
-
const group =
|
|
278
|
+
} = state.layout;
|
|
279
|
+
const group = getGroupById(state, groupId);
|
|
275
280
|
if (!group) {
|
|
276
281
|
return state;
|
|
277
282
|
}
|
|
@@ -300,13 +305,7 @@ const closeTabsRight = (state, groupId) => {
|
|
|
300
305
|
}
|
|
301
306
|
return g;
|
|
302
307
|
});
|
|
303
|
-
return
|
|
304
|
-
...state,
|
|
305
|
-
layout: {
|
|
306
|
-
...layout,
|
|
307
|
-
groups: newGroups
|
|
308
|
-
}
|
|
309
|
-
};
|
|
308
|
+
return withGroups(state, newGroups);
|
|
310
309
|
};
|
|
311
310
|
|
|
312
311
|
const None$1 = 'none';
|
|
@@ -1693,6 +1692,8 @@ const create$2 = (uid, uri, x, y, width, height, platform, assetDir, tabHeight =
|
|
|
1693
1692
|
direction: 'horizontal',
|
|
1694
1693
|
groups: []
|
|
1695
1694
|
},
|
|
1695
|
+
maxOpenEditorGroups: Number.POSITIVE_INFINITY,
|
|
1696
|
+
maxOpenEditors: Number.POSITIVE_INFINITY,
|
|
1696
1697
|
platform,
|
|
1697
1698
|
splitButtonEnabled: false,
|
|
1698
1699
|
tabHeight,
|
|
@@ -2273,34 +2274,31 @@ const handleClick = async (state, name) => {
|
|
|
2273
2274
|
return state;
|
|
2274
2275
|
};
|
|
2275
2276
|
|
|
2277
|
+
const redistributeSizesWithRemainder = groups => {
|
|
2278
|
+
const baseSize = Math.floor(100 / groups.length);
|
|
2279
|
+
const remainder = 100 % groups.length;
|
|
2280
|
+
return groups.map((group, index) => ({
|
|
2281
|
+
...group,
|
|
2282
|
+
size: baseSize + (index === groups.length - 1 ? remainder : 0)
|
|
2283
|
+
}));
|
|
2284
|
+
};
|
|
2285
|
+
|
|
2276
2286
|
const closeEditorGroup$1 = (state, groupId) => {
|
|
2277
|
-
|
|
2278
|
-
|
|
2279
|
-
}
|
|
2287
|
+
if (Number.isNaN(groupId)) {
|
|
2288
|
+
return state;
|
|
2289
|
+
}
|
|
2280
2290
|
const {
|
|
2281
2291
|
activeGroupId,
|
|
2282
2292
|
groups
|
|
2283
|
-
} = layout;
|
|
2284
|
-
const groupIndex =
|
|
2293
|
+
} = state.layout;
|
|
2294
|
+
const groupIndex = getGroupIndexById(state, groupId);
|
|
2285
2295
|
if (groupIndex === -1 || groups.length <= 1) {
|
|
2286
2296
|
return state;
|
|
2287
2297
|
}
|
|
2288
2298
|
const remainingGroups = groups.filter(group => group.id !== groupId);
|
|
2289
|
-
const
|
|
2290
|
-
const remainder = 100 % remainingGroups.length;
|
|
2291
|
-
const redistributedGroups = remainingGroups.map((group, index) => ({
|
|
2292
|
-
...group,
|
|
2293
|
-
size: baseSize + (index === remainingGroups.length - 1 ? remainder : 0)
|
|
2294
|
-
}));
|
|
2299
|
+
const redistributedGroups = redistributeSizesWithRemainder(remainingGroups);
|
|
2295
2300
|
const newActiveGroupId = activeGroupId === groupId ? remainingGroups[0].id : activeGroupId;
|
|
2296
|
-
return
|
|
2297
|
-
...state,
|
|
2298
|
-
layout: {
|
|
2299
|
-
...layout,
|
|
2300
|
-
activeGroupId: newActiveGroupId,
|
|
2301
|
-
groups: redistributedGroups
|
|
2302
|
-
}
|
|
2303
|
-
};
|
|
2301
|
+
return withGroupsAndActiveGroup(state, redistributedGroups, newActiveGroupId);
|
|
2304
2302
|
};
|
|
2305
2303
|
|
|
2306
2304
|
const getActiveGroup = (groups, activeGroupId) => {
|
|
@@ -2914,9 +2912,7 @@ const handleClickAction = async (state, action, rawGroupId) => {
|
|
|
2914
2912
|
case 'close-group':
|
|
2915
2913
|
if (rawGroupId) {
|
|
2916
2914
|
const groupId = Number.parseInt(rawGroupId, 10);
|
|
2917
|
-
|
|
2918
|
-
return closeEditorGroup$1(state, groupId);
|
|
2919
|
-
}
|
|
2915
|
+
return closeEditorGroup$1(state, groupId);
|
|
2920
2916
|
}
|
|
2921
2917
|
return state;
|
|
2922
2918
|
case 'retry-open':
|
|
@@ -3195,8 +3191,8 @@ const parse = sashId => {
|
|
|
3195
3191
|
if (!beforeRaw || !afterRaw) {
|
|
3196
3192
|
return undefined;
|
|
3197
3193
|
}
|
|
3198
|
-
const beforeGroupId = Number.
|
|
3199
|
-
const afterGroupId = Number.
|
|
3194
|
+
const beforeGroupId = Number.parseFloat(beforeRaw);
|
|
3195
|
+
const afterGroupId = Number.parseFloat(afterRaw);
|
|
3200
3196
|
if (!Number.isFinite(beforeGroupId) || !Number.isFinite(afterGroupId)) {
|
|
3201
3197
|
return undefined;
|
|
3202
3198
|
}
|
|
@@ -3206,18 +3202,22 @@ const parse = sashId => {
|
|
|
3206
3202
|
};
|
|
3207
3203
|
};
|
|
3208
3204
|
|
|
3209
|
-
const handleSashPointerDown = async (state, sashId,
|
|
3205
|
+
const handleSashPointerDown = async (state, sashId, clientX, clientY) => {
|
|
3210
3206
|
const parsed = parse(sashId);
|
|
3211
3207
|
if (!parsed) {
|
|
3212
3208
|
return state;
|
|
3213
3209
|
}
|
|
3214
|
-
const
|
|
3215
|
-
|
|
3210
|
+
const {
|
|
3211
|
+
layout
|
|
3212
|
+
} = state;
|
|
3213
|
+
const {
|
|
3214
|
+
groups
|
|
3215
|
+
} = layout;
|
|
3216
|
+
const beforeGroup = groups.find(group => group.id === parsed.beforeGroupId);
|
|
3217
|
+
const afterGroup = groups.find(group => group.id === parsed.afterGroupId);
|
|
3216
3218
|
if (!beforeGroup || !afterGroup) {
|
|
3217
3219
|
return state;
|
|
3218
3220
|
}
|
|
3219
|
-
const clientX = Number.parseFloat(clientXRaw);
|
|
3220
|
-
const clientY = Number.parseFloat(clientYRaw);
|
|
3221
3221
|
if (!Number.isFinite(clientX) || !Number.isFinite(clientY)) {
|
|
3222
3222
|
return state;
|
|
3223
3223
|
}
|
|
@@ -3242,15 +3242,13 @@ const clamp = (value, min, max) => {
|
|
|
3242
3242
|
const round = value => {
|
|
3243
3243
|
return Math.round(value * 100) / 100;
|
|
3244
3244
|
};
|
|
3245
|
-
const handleSashPointerMove = async (state,
|
|
3245
|
+
const handleSashPointerMove = async (state, clientX, clientY) => {
|
|
3246
3246
|
const {
|
|
3247
3247
|
sashDrag
|
|
3248
3248
|
} = state;
|
|
3249
3249
|
if (!sashDrag) {
|
|
3250
3250
|
return state;
|
|
3251
3251
|
}
|
|
3252
|
-
const clientX = Number.parseFloat(clientXRaw);
|
|
3253
|
-
const clientY = Number.parseFloat(clientYRaw);
|
|
3254
3252
|
if (!Number.isFinite(clientX) || !Number.isFinite(clientY)) {
|
|
3255
3253
|
return state;
|
|
3256
3254
|
}
|
|
@@ -3288,7 +3286,10 @@ const handleSashPointerMove = async (state, clientXRaw, clientYRaw) => {
|
|
|
3288
3286
|
};
|
|
3289
3287
|
|
|
3290
3288
|
const handleSashPointerUp = async state => {
|
|
3291
|
-
|
|
3289
|
+
const {
|
|
3290
|
+
sashDrag
|
|
3291
|
+
} = state;
|
|
3292
|
+
if (!sashDrag) {
|
|
3292
3293
|
return state;
|
|
3293
3294
|
}
|
|
3294
3295
|
return {
|
|
@@ -3511,14 +3512,26 @@ const getViewletModuleIds = async layout => {
|
|
|
3511
3512
|
};
|
|
3512
3513
|
|
|
3513
3514
|
const updateTabs = (state, editorUids) => {
|
|
3514
|
-
const
|
|
3515
|
+
const {
|
|
3516
|
+
layout
|
|
3517
|
+
} = state;
|
|
3518
|
+
const {
|
|
3519
|
+
groups
|
|
3520
|
+
} = layout;
|
|
3521
|
+
const updatedGroups = groups.map(group => {
|
|
3522
|
+
const {
|
|
3523
|
+
tabs
|
|
3524
|
+
} = group;
|
|
3515
3525
|
return {
|
|
3516
3526
|
...group,
|
|
3517
|
-
tabs:
|
|
3518
|
-
|
|
3527
|
+
tabs: tabs.map(tab => {
|
|
3528
|
+
const {
|
|
3529
|
+
id
|
|
3530
|
+
} = tab;
|
|
3531
|
+
if (editorUids[id]) {
|
|
3519
3532
|
return {
|
|
3520
3533
|
...tab,
|
|
3521
|
-
editorUid: editorUids[
|
|
3534
|
+
editorUid: editorUids[id]
|
|
3522
3535
|
};
|
|
3523
3536
|
}
|
|
3524
3537
|
return tab;
|
|
@@ -3528,7 +3541,7 @@ const updateTabs = (state, editorUids) => {
|
|
|
3528
3541
|
return {
|
|
3529
3542
|
...state,
|
|
3530
3543
|
layout: {
|
|
3531
|
-
...
|
|
3544
|
+
...layout,
|
|
3532
3545
|
groups: updatedGroups
|
|
3533
3546
|
}
|
|
3534
3547
|
};
|
|
@@ -4353,43 +4366,49 @@ const renderEditorGroup = (group, groupIndex, splitButtonEnabled = false, sizePr
|
|
|
4353
4366
|
};
|
|
4354
4367
|
|
|
4355
4368
|
const renderSash = (direction, sashId, style) => {
|
|
4356
|
-
return {
|
|
4369
|
+
return [{
|
|
4357
4370
|
childCount: 0,
|
|
4358
4371
|
className: direction === 'horizontal' ? 'Sash SashVertical' : 'Sash SashHorizontal',
|
|
4359
4372
|
'data-sashId': sashId,
|
|
4360
4373
|
onPointerDown: HandleSashPointerDown,
|
|
4361
|
-
onPointerMove: HandleSashPointerMove,
|
|
4362
|
-
onPointerUp: HandleSashPointerUp,
|
|
4363
4374
|
style,
|
|
4364
4375
|
type: Div
|
|
4365
|
-
};
|
|
4376
|
+
}];
|
|
4377
|
+
};
|
|
4378
|
+
|
|
4379
|
+
const renderSingleEditorGroup = (layout, splitButtonEnabled, sizeProperty) => {
|
|
4380
|
+
return [{
|
|
4381
|
+
childCount: 1,
|
|
4382
|
+
className: Main,
|
|
4383
|
+
type: Div
|
|
4384
|
+
}, ...renderEditorGroup(layout.groups[0], 0, splitButtonEnabled, sizeProperty)];
|
|
4366
4385
|
};
|
|
4367
4386
|
|
|
4368
4387
|
const getMainAreaVirtualDom = (layout, splitButtonEnabled = false) => {
|
|
4369
|
-
const
|
|
4370
|
-
|
|
4371
|
-
|
|
4372
|
-
|
|
4373
|
-
|
|
4374
|
-
|
|
4375
|
-
|
|
4388
|
+
const {
|
|
4389
|
+
direction,
|
|
4390
|
+
groups
|
|
4391
|
+
} = layout;
|
|
4392
|
+
const sizeProperty = direction === 'vertical' ? 'height' : 'width';
|
|
4393
|
+
if (groups.length === 1) {
|
|
4394
|
+
return renderSingleEditorGroup(layout, splitButtonEnabled, sizeProperty);
|
|
4376
4395
|
}
|
|
4377
4396
|
const children = [];
|
|
4378
|
-
const isSplit =
|
|
4379
|
-
const directionClassName = isSplit ?
|
|
4397
|
+
const isSplit = groups.length > 1;
|
|
4398
|
+
const directionClassName = isSplit ? direction === 'horizontal' ? EditorGroupsVertical : EditorGroupsHorizontal : '';
|
|
4380
4399
|
const editorGroupsContainerClassName = directionClassName ? `${EDITOR_GROUPS_CONTAINER} ${directionClassName}` : EDITOR_GROUPS_CONTAINER;
|
|
4381
4400
|
let sashOffset = 0;
|
|
4382
|
-
for (let i = 0; i <
|
|
4383
|
-
sashOffset +=
|
|
4401
|
+
for (let i = 0; i < groups.length; i++) {
|
|
4402
|
+
sashOffset += groups[i].size;
|
|
4384
4403
|
if (i > 0) {
|
|
4385
4404
|
// Insert sash between groups
|
|
4386
|
-
const beforeGroupId =
|
|
4387
|
-
const afterGroupId =
|
|
4405
|
+
const beforeGroupId = groups[i - 1].id;
|
|
4406
|
+
const afterGroupId = groups[i].id;
|
|
4388
4407
|
const sashId = create(beforeGroupId, afterGroupId);
|
|
4389
|
-
const style =
|
|
4390
|
-
children.push(renderSash(
|
|
4408
|
+
const style = direction === 'horizontal' ? `left:${sashOffset - groups[i].size}%;` : `top:${sashOffset - groups[i].size}%;`;
|
|
4409
|
+
children.push(...renderSash(direction, sashId, style));
|
|
4391
4410
|
}
|
|
4392
|
-
children.push(...renderEditorGroup(
|
|
4411
|
+
children.push(...renderEditorGroup(groups[i], i, splitButtonEnabled, sizeProperty));
|
|
4393
4412
|
}
|
|
4394
4413
|
return [{
|
|
4395
4414
|
childCount: 1,
|
|
@@ -4481,7 +4500,9 @@ const renderEventListeners = () => {
|
|
|
4481
4500
|
params: ['handleHeaderDoubleClick', EventTargetClassName, 'event.target.dataset.groupId']
|
|
4482
4501
|
}, {
|
|
4483
4502
|
name: HandleSashPointerDown,
|
|
4484
|
-
params: ['handleSashPointerDown', 'event.target.dataset.sashId', ClientX, ClientY]
|
|
4503
|
+
params: ['handleSashPointerDown', 'event.target.dataset.sashId', ClientX, ClientY],
|
|
4504
|
+
preventDefault: true,
|
|
4505
|
+
trackPointerEvents: [HandleSashPointerMove, HandleSashPointerUp]
|
|
4485
4506
|
}, {
|
|
4486
4507
|
name: HandleSashPointerMove,
|
|
4487
4508
|
params: ['handleSashPointerMove', ClientX, ClientY]
|