@tmagic/stage 1.4.4 → 1.4.5
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/tmagic-stage.js +2 -10
- package/dist/tmagic-stage.umd.cjs +6 -15
- package/package.json +11 -8
- package/src/DragResizeHelper.ts +3 -1
- package/src/util.ts +0 -11
- package/types/util.d.ts +0 -1
package/dist/tmagic-stage.js
CHANGED
|
@@ -2,7 +2,7 @@ import EventEmitter, { EventEmitter as EventEmitter$1 } from 'events';
|
|
|
2
2
|
import KeyController from 'keycon';
|
|
3
3
|
import { merge, throttle } from 'lodash-es';
|
|
4
4
|
import { Env } from '@tmagic/core';
|
|
5
|
-
import { removeClassName, guid, addClassName, removeClassNameByClassName, getDocument, createDiv, injectStyle, isSameDomain, getHost } from '@tmagic/utils';
|
|
5
|
+
import { removeClassName, guid, calcValueByFontsize, addClassName, removeClassNameByClassName, getDocument, createDiv, injectStyle, isSameDomain, getHost } from '@tmagic/utils';
|
|
6
6
|
import MoveableHelper from 'moveable-helper';
|
|
7
7
|
import Moveable from 'moveable';
|
|
8
8
|
import Guides from '@scena/guides';
|
|
@@ -181,14 +181,6 @@ const addSelectedClassName = (el, doc) => {
|
|
|
181
181
|
item.classList.add(`${SELECTED_CLASS}-parents`);
|
|
182
182
|
});
|
|
183
183
|
};
|
|
184
|
-
const calcValueByFontsize = (doc, value) => {
|
|
185
|
-
const { fontSize } = doc.documentElement.style;
|
|
186
|
-
if (fontSize) {
|
|
187
|
-
const times = globalThis.parseFloat(fontSize) / 100;
|
|
188
|
-
return Number((value / times).toFixed(2));
|
|
189
|
-
}
|
|
190
|
-
return value;
|
|
191
|
-
};
|
|
192
184
|
const down = (deltaTop, target) => {
|
|
193
185
|
let swapIndex = 0;
|
|
194
186
|
let addUpH = target.clientHeight;
|
|
@@ -2790,4 +2782,4 @@ class StageCore extends EventEmitter$1 {
|
|
|
2790
2782
|
}
|
|
2791
2783
|
}
|
|
2792
2784
|
|
|
2793
|
-
export { AbleActionEventType, CONTAINER_HIGHLIGHT_CLASS_NAME, ContainerHighlightType, DEFAULT_ZOOM, DRAG_EL_ID_PREFIX, GHOST_EL_ID_PREFIX, GuidesType, HIGHLIGHT_EL_ID_PREFIX, Mode, MouseButton, PAGE_CLASS, RenderType, SELECTED_CLASS, SelectStatus, StageDragResize, StageDragStatus, StageMask, StageRender, ZIndex, addSelectedClassName,
|
|
2785
|
+
export { AbleActionEventType, CONTAINER_HIGHLIGHT_CLASS_NAME, ContainerHighlightType, DEFAULT_ZOOM, DRAG_EL_ID_PREFIX, GHOST_EL_ID_PREFIX, GuidesType, HIGHLIGHT_EL_ID_PREFIX, Mode, MouseButton, PAGE_CLASS, RenderType, SELECTED_CLASS, SelectStatus, StageDragResize, StageDragStatus, StageMask, StageRender, ZIndex, addSelectedClassName, StageCore as default, down, getAbsolutePosition, getBorderWidth, getMarginValue, getMode, getOffset, getScrollParent, getTargetElStyle, isAbsolute, isFixed, isFixedParent, isMoveableButton, isRelative, isStatic, removeSelectedClassName, up };
|
|
@@ -178,14 +178,6 @@
|
|
|
178
178
|
item.classList.add(`${SELECTED_CLASS}-parents`);
|
|
179
179
|
});
|
|
180
180
|
};
|
|
181
|
-
const calcValueByFontsize = (doc, value) => {
|
|
182
|
-
const { fontSize } = doc.documentElement.style;
|
|
183
|
-
if (fontSize) {
|
|
184
|
-
const times = globalThis.parseFloat(fontSize) / 100;
|
|
185
|
-
return Number((value / times).toFixed(2));
|
|
186
|
-
}
|
|
187
|
-
return value;
|
|
188
|
-
};
|
|
189
181
|
const down = (deltaTop, target) => {
|
|
190
182
|
let swapIndex = 0;
|
|
191
183
|
let addUpH = target.clientHeight;
|
|
@@ -549,11 +541,11 @@
|
|
|
549
541
|
getUpdatedElRect(el, parentEl, doc) {
|
|
550
542
|
const offset = this.mode === Mode.SORTABLE ? { left: 0, top: 0 } : { left: el.offsetLeft, top: el.offsetTop };
|
|
551
543
|
const { marginLeft, marginTop } = getMarginValue(el);
|
|
552
|
-
let left = calcValueByFontsize(doc, offset.left) - marginLeft;
|
|
553
|
-
let top = calcValueByFontsize(doc, offset.top) - marginTop;
|
|
544
|
+
let left = utils.calcValueByFontsize(doc, offset.left) - marginLeft;
|
|
545
|
+
let top = utils.calcValueByFontsize(doc, offset.top) - marginTop;
|
|
554
546
|
const { borderLeftWidth, borderRightWidth, borderTopWidth, borderBottomWidth } = getBorderWidth(el);
|
|
555
|
-
const width = calcValueByFontsize(doc, el.clientWidth + borderLeftWidth + borderRightWidth);
|
|
556
|
-
const height = calcValueByFontsize(doc, el.clientHeight + borderTopWidth + borderBottomWidth);
|
|
547
|
+
const width = utils.calcValueByFontsize(doc, el.clientWidth + borderLeftWidth + borderRightWidth);
|
|
548
|
+
const height = utils.calcValueByFontsize(doc, el.clientHeight + borderTopWidth + borderBottomWidth);
|
|
557
549
|
let shadowEl = this.getShadowEl();
|
|
558
550
|
const shadowEls = this.getShadowEls();
|
|
559
551
|
if (shadowEls.length) {
|
|
@@ -566,8 +558,8 @@
|
|
|
566
558
|
const frame = this.getFrame(shadowEl);
|
|
567
559
|
const [translateX, translateY] = frame?.properties.transform.translate.value;
|
|
568
560
|
const { left: parentLeft, top: parentTop } = getOffset(parentEl);
|
|
569
|
-
left = calcValueByFontsize(doc, targetShadowElOffsetLeft) + parseFloat(translateX) - calcValueByFontsize(doc, parentLeft);
|
|
570
|
-
top = calcValueByFontsize(doc, targetShadowElOffsetTop) + parseFloat(translateY) - calcValueByFontsize(doc, parentTop);
|
|
561
|
+
left = utils.calcValueByFontsize(doc, targetShadowElOffsetLeft) + parseFloat(translateX) - utils.calcValueByFontsize(doc, parentLeft);
|
|
562
|
+
top = utils.calcValueByFontsize(doc, targetShadowElOffsetTop) + parseFloat(translateY) - utils.calcValueByFontsize(doc, parentTop);
|
|
571
563
|
}
|
|
572
564
|
return { width, height, left, top };
|
|
573
565
|
}
|
|
@@ -2807,7 +2799,6 @@
|
|
|
2807
2799
|
exports.StageRender = StageRender;
|
|
2808
2800
|
exports.ZIndex = ZIndex;
|
|
2809
2801
|
exports.addSelectedClassName = addSelectedClassName;
|
|
2810
|
-
exports.calcValueByFontsize = calcValueByFontsize;
|
|
2811
2802
|
exports.default = StageCore;
|
|
2812
2803
|
exports.down = down;
|
|
2813
2804
|
exports.getAbsolutePosition = getAbsolutePosition;
|
package/package.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"version": "1.4.
|
|
2
|
+
"version": "1.4.5",
|
|
3
3
|
"name": "@tmagic/stage",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"sideEffects": [
|
|
@@ -26,27 +26,30 @@
|
|
|
26
26
|
},
|
|
27
27
|
"dependencies": {
|
|
28
28
|
"@scena/guides": "^0.29.2",
|
|
29
|
-
"@tmagic/core": "1.4.4",
|
|
30
|
-
"@tmagic/schema": "1.4.4",
|
|
31
|
-
"@tmagic/utils": "1.4.4",
|
|
32
29
|
"events": "^3.3.0",
|
|
33
30
|
"keycon": "^1.4.0",
|
|
34
31
|
"lodash-es": "^4.17.21",
|
|
35
|
-
"moveable": "^0.
|
|
32
|
+
"moveable": "^0.53.0",
|
|
36
33
|
"moveable-helper": "^0.4.0"
|
|
37
34
|
},
|
|
35
|
+
"peerDependencies": {
|
|
36
|
+
"@tmagic/core": "1.4.5",
|
|
37
|
+
"@tmagic/schema": "1.4.5",
|
|
38
|
+
"@tmagic/utils": "1.4.5"
|
|
39
|
+
},
|
|
38
40
|
"devDependencies": {
|
|
39
41
|
"@types/events": "^3.0.0",
|
|
40
42
|
"@types/lodash-es": "^4.17.4",
|
|
41
43
|
"@types/node": "^18.19.0",
|
|
42
44
|
"rimraf": "^3.0.2",
|
|
43
|
-
"sass": "^1.
|
|
45
|
+
"sass": "^1.77.0",
|
|
44
46
|
"typescript": "^5.4.2",
|
|
45
|
-
"vite": "^5.
|
|
47
|
+
"vite": "^5.2.11"
|
|
46
48
|
},
|
|
47
49
|
"scripts": {
|
|
48
50
|
"build": "npm run build:type && vite build",
|
|
49
51
|
"build:type": "npm run clear:type && tsc --declaration --emitDeclarationOnly --project tsconfig.build.json",
|
|
50
|
-
"clear:type": "rimraf ./types"
|
|
52
|
+
"clear:type": "rimraf ./types",
|
|
53
|
+
"check:type": "tsc --noEmit --project tsconfig.build.json"
|
|
51
54
|
}
|
|
52
55
|
}
|
package/src/DragResizeHelper.ts
CHANGED
|
@@ -32,10 +32,12 @@ import type {
|
|
|
32
32
|
} from 'moveable';
|
|
33
33
|
import MoveableHelper from 'moveable-helper';
|
|
34
34
|
|
|
35
|
+
import { calcValueByFontsize } from '@tmagic/utils';
|
|
36
|
+
|
|
35
37
|
import { DRAG_EL_ID_PREFIX, GHOST_EL_ID_PREFIX, Mode, ZIndex } from './const';
|
|
36
38
|
import TargetShadow from './TargetShadow';
|
|
37
39
|
import type { DragResizeHelperConfig, Rect, TargetElement } from './types';
|
|
38
|
-
import {
|
|
40
|
+
import { getAbsolutePosition, getBorderWidth, getMarginValue, getOffset } from './util';
|
|
39
41
|
|
|
40
42
|
/**
|
|
41
43
|
* 拖拽/改变大小等操作发生时,moveable会抛出各种状态事件,DragResizeHelper负责响应这些事件,对目标节点target和拖拽节点targetShadow进行修改;
|
package/src/util.ts
CHANGED
|
@@ -161,17 +161,6 @@ export const addSelectedClassName = (el: Element, doc: Document) => {
|
|
|
161
161
|
});
|
|
162
162
|
};
|
|
163
163
|
|
|
164
|
-
export const calcValueByFontsize = (doc: Document, value: number) => {
|
|
165
|
-
const { fontSize } = doc.documentElement.style;
|
|
166
|
-
|
|
167
|
-
if (fontSize) {
|
|
168
|
-
const times = globalThis.parseFloat(fontSize) / 100;
|
|
169
|
-
return Number((value / times).toFixed(2));
|
|
170
|
-
}
|
|
171
|
-
|
|
172
|
-
return value;
|
|
173
|
-
};
|
|
174
|
-
|
|
175
164
|
/**
|
|
176
165
|
* 下移组件位置
|
|
177
166
|
* @param {number} deltaTop 偏移量
|
package/types/util.d.ts
CHANGED
|
@@ -15,7 +15,6 @@ export declare const getMode: (el: Element) => Mode;
|
|
|
15
15
|
export declare const getScrollParent: (element: HTMLElement, includeHidden?: boolean) => HTMLElement | null;
|
|
16
16
|
export declare const removeSelectedClassName: (doc: Document) => void;
|
|
17
17
|
export declare const addSelectedClassName: (el: Element, doc: Document) => void;
|
|
18
|
-
export declare const calcValueByFontsize: (doc: Document, value: number) => number;
|
|
19
18
|
/**
|
|
20
19
|
* 下移组件位置
|
|
21
20
|
* @param {number} deltaTop 偏移量
|