@leafer-in/editor 1.9.8 → 1.9.10
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/editor.cjs +41 -27
- package/dist/editor.esm.js +43 -29
- package/dist/editor.esm.min.js +1 -1
- package/dist/editor.esm.min.js.map +1 -1
- package/dist/editor.js +41 -26
- package/dist/editor.min.cjs +1 -1
- package/dist/editor.min.cjs.map +1 -1
- package/dist/editor.min.js +1 -1
- package/dist/editor.min.js.map +1 -1
- package/package.json +6 -6
- package/src/decorator/data.ts +13 -2
- package/src/display/EditBox.ts +10 -9
- package/src/display/EditSelect.ts +4 -2
- package/src/helper/EditDataHelper.ts +17 -14
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@leafer-in/editor",
|
|
3
|
-
"version": "1.9.
|
|
3
|
+
"version": "1.9.10",
|
|
4
4
|
"description": "@leafer-in/editor",
|
|
5
5
|
"author": "Chao (Leafer) Wan",
|
|
6
6
|
"license": "MIT",
|
|
@@ -34,10 +34,10 @@
|
|
|
34
34
|
"leaferjs"
|
|
35
35
|
],
|
|
36
36
|
"peerDependencies": {
|
|
37
|
-
"@leafer-ui/draw": "^1.9.
|
|
38
|
-
"@leafer-ui/core": "^1.9.
|
|
39
|
-
"@leafer-in/resize": "^1.9.
|
|
40
|
-
"@leafer-ui/interface": "^1.9.
|
|
41
|
-
"@leafer-in/interface": "^1.9.
|
|
37
|
+
"@leafer-ui/draw": "^1.9.10",
|
|
38
|
+
"@leafer-ui/core": "^1.9.10",
|
|
39
|
+
"@leafer-in/resize": "^1.9.10",
|
|
40
|
+
"@leafer-ui/interface": "^1.9.10",
|
|
41
|
+
"@leafer-in/interface": "^1.9.10"
|
|
42
42
|
}
|
|
43
43
|
}
|
package/src/decorator/data.ts
CHANGED
|
@@ -32,7 +32,10 @@ export function targetAttr(fn: IFunction) {
|
|
|
32
32
|
t.setBright(false)
|
|
33
33
|
|
|
34
34
|
if (isArray(value) && value.length > 1 && value[0].locked) value.splice(0, 1) // fix: 单个锁定 + shift多选
|
|
35
|
-
if (t.single)
|
|
35
|
+
if (t.single) {
|
|
36
|
+
delete t.element.syncEventer // 重置 EditBox.load() 同步事件设置
|
|
37
|
+
delete t.element.__world.ignorePixelSnap // 重置 EditBox.load() 忽略对齐像素设置
|
|
38
|
+
}
|
|
36
39
|
}
|
|
37
40
|
|
|
38
41
|
const type = isSelect ? EditorEvent.BEFORE_SELECT : EditorEvent.BEFORE_HOVER
|
|
@@ -52,7 +55,15 @@ export function mergeConfigAttr() {
|
|
|
52
55
|
defineKey(target, key, {
|
|
53
56
|
get() {
|
|
54
57
|
const { config, element, dragPoint, editBox, app } = this, mergeConfig = { ...config } // 实时合并,后期可优化
|
|
55
|
-
if (element && element.editConfig)
|
|
58
|
+
if (element && element.editConfig) {
|
|
59
|
+
let { editConfig } = element
|
|
60
|
+
if (editConfig.hover || editConfig.hoverStyle) { // 元素的hover样式,不能覆盖到总配置里
|
|
61
|
+
editConfig = { ...editConfig }
|
|
62
|
+
delete editConfig.hover
|
|
63
|
+
delete editConfig.hoverStyle
|
|
64
|
+
}
|
|
65
|
+
Object.assign(mergeConfig, editConfig) // 元素上的配置
|
|
66
|
+
}
|
|
56
67
|
if (editBox.config) Object.assign(mergeConfig, editBox.config) // EditBox 上的配置
|
|
57
68
|
if (dragPoint) {
|
|
58
69
|
if (dragPoint.editConfig) Object.assign(mergeConfig, dragPoint.editConfig)
|
package/src/display/EditBox.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { IRect, IEventListenerId, IBoundsData, IPointData, IKeyEvent, IGroup, IBox, IBoxInputData, IAlign, IUI, IEditorConfig, IEditorDragStartData, ITransformTool, IUIEvent, IEditPointInputData } from '@leafer-ui/interface'
|
|
2
|
-
import { Group, Text, AroundHelper, Direction9, ResizeEvent, BoundsHelper, isArray, isString, isNumber, getPointData } from '@leafer-ui/draw'
|
|
2
|
+
import { Group, Text, AroundHelper, Direction9, ResizeEvent, BoundsHelper, DataHelper, isArray, isString, isNumber, isNull, getPointData } from '@leafer-ui/draw'
|
|
3
3
|
import { DragEvent, PointerEvent, KeyEvent, RotateEvent, ZoomEvent, MoveEvent } from '@leafer-ui/core'
|
|
4
4
|
|
|
5
5
|
import { IEditBox, IEditor, IEditPoint, IEditPointType } from '@leafer-in/interface'
|
|
@@ -62,7 +62,7 @@ export class EditBox extends Group implements IEditBox {
|
|
|
62
62
|
public get flippedY(): boolean { return this.scaleY < 0 }
|
|
63
63
|
public get flippedOne(): boolean { return this.scaleX * this.scaleY < 0 }
|
|
64
64
|
|
|
65
|
-
public get canUse(): boolean { return (this.visible && this.view.visible) as boolean } // 编辑框是否处于激活状态
|
|
65
|
+
public get canUse(): boolean { return (this.app && this.visible && this.view.visible) as boolean } // 编辑框是否处于激活状态
|
|
66
66
|
public get canGesture(): boolean { // 是否支持手势
|
|
67
67
|
if (!this.canUse) return false
|
|
68
68
|
const { moveable, resizeable, rotateable } = this.mergeConfig
|
|
@@ -111,7 +111,7 @@ export class EditBox extends Group implements IEditBox {
|
|
|
111
111
|
|
|
112
112
|
public load(): void {
|
|
113
113
|
const { target, mergeConfig, single, rect, circle, resizePoints, resizeLines } = this
|
|
114
|
-
const { stroke, strokeWidth, resizeLine } = mergeConfig
|
|
114
|
+
const { stroke, strokeWidth, resizeLine, ignorePixelSnap } = mergeConfig
|
|
115
115
|
|
|
116
116
|
const pointsStyle = this.getPointsStyle()
|
|
117
117
|
const middlePointsStyle = this.getMiddlePointsStyle()
|
|
@@ -133,17 +133,18 @@ export class EditBox extends Group implements IEditBox {
|
|
|
133
133
|
// rect
|
|
134
134
|
rect.set({ stroke, strokeWidth, editConfig, ...(mergeConfig.rect || {}) })
|
|
135
135
|
|
|
136
|
-
const syncEventer = single && this.transformTool.editTool
|
|
137
|
-
|
|
138
136
|
// 编辑框作为底部虚拟元素, 在 unload() 中重置
|
|
139
|
-
|
|
140
|
-
rect.
|
|
137
|
+
const rectThrough = isNull(mergeConfig.rectThrough) ? single : mergeConfig.rectThrough
|
|
138
|
+
rect.hittable = !rectThrough
|
|
141
139
|
|
|
142
|
-
if (
|
|
143
|
-
target.syncEventer = rect //
|
|
140
|
+
if (rectThrough) {
|
|
141
|
+
target.syncEventer = rect // 同步给 rect 冒泡,在 target 属性装饰器中重置
|
|
144
142
|
this.app.interaction.bottomList = [{ target: rect, proxy: target }]
|
|
145
143
|
}
|
|
146
144
|
|
|
145
|
+
// 忽略元素像素对齐,在 target 属性装饰器中重置
|
|
146
|
+
if (single) DataHelper.stintSet(target.__world, 'ignorePixelSnap', ignorePixelSnap)
|
|
147
|
+
|
|
147
148
|
updateMoveCursor(this)
|
|
148
149
|
}
|
|
149
150
|
|
|
@@ -45,8 +45,10 @@ export class EditSelect extends Group implements IEditSelect {
|
|
|
45
45
|
protected onHover(): void {
|
|
46
46
|
const { editor } = this
|
|
47
47
|
if (this.running && !this.dragging && !editor.dragging) {
|
|
48
|
-
const {
|
|
49
|
-
|
|
48
|
+
const { hoverTarget, mergeConfig } = editor, config = { ...mergeConfig }
|
|
49
|
+
if (hoverTarget && hoverTarget.editConfig) Object.assign(config, hoverTarget.editConfig) // hover元素上的配置
|
|
50
|
+
const { stroke, strokeWidth, hover, hoverStyle } = config
|
|
51
|
+
this.hoverStroker.setTarget(hover ? hoverTarget : null, { stroke, strokeWidth, ...(hoverStyle || {}) })
|
|
50
52
|
} else {
|
|
51
53
|
this.hoverStroker.target = null
|
|
52
54
|
}
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
import { IBoundsData, IPointData, IAround, IAlign, IUI, ILayoutBoundsData } from '@leafer-ui/interface'
|
|
2
|
-
import { AroundHelper, MathHelper, PointHelper, Direction9,
|
|
2
|
+
import { AroundHelper, MathHelper, PointHelper, Direction9, isNumber } from '@leafer-ui/draw'
|
|
3
|
+
import { DragBoundsHelper } from '@leafer-ui/core'
|
|
3
4
|
|
|
4
5
|
import { IEditorScaleEvent, IEditorSkewEvent, IEditorRotateEvent } from '@leafer-in/interface'
|
|
5
6
|
|
|
6
7
|
|
|
7
8
|
const { topLeft, top, topRight, right, bottomRight, bottom, bottomLeft, left } = Direction9
|
|
8
|
-
const { toPoint } = AroundHelper
|
|
9
|
-
const { within, sign } = MathHelper
|
|
9
|
+
const { toPoint } = AroundHelper, { within, sign } = MathHelper, { abs } = Math
|
|
10
10
|
|
|
11
11
|
export const EditDataHelper = {
|
|
12
12
|
|
|
13
13
|
getScaleData(target: IUI, startBounds: ILayoutBoundsData, direction: Direction9, totalMoveOrScale: IPointData | number, lockRatio: boolean | 'corner', around: IAround, flipable: boolean, scaleMode: boolean): IEditorScaleEvent {
|
|
14
|
-
let align: IAlign, origin = {} as IPointData, scaleX: number = 1, scaleY: number = 1
|
|
14
|
+
let align: IAlign, origin = {} as IPointData, scaleX: number = 1, scaleY: number = 1, lockScale: number
|
|
15
15
|
|
|
16
16
|
const { boxBounds, widthRange, heightRange, dragBounds, worldBoxBounds } = target
|
|
17
17
|
const { width, height } = startBounds
|
|
@@ -86,21 +86,20 @@ export const EditDataHelper = {
|
|
|
86
86
|
if (lockRatio === 'corner' && direction % 2) {
|
|
87
87
|
lockRatio = false
|
|
88
88
|
} else {
|
|
89
|
-
let scale: number
|
|
90
89
|
switch (direction) {
|
|
91
90
|
case top:
|
|
92
91
|
case bottom:
|
|
93
|
-
|
|
92
|
+
scaleX = scaleY
|
|
94
93
|
break
|
|
95
94
|
case left:
|
|
96
95
|
case right:
|
|
97
|
-
|
|
96
|
+
scaleY = scaleX
|
|
98
97
|
break
|
|
99
98
|
default:
|
|
100
|
-
|
|
99
|
+
lockScale = Math.sqrt(abs(scaleX * scaleY))
|
|
100
|
+
scaleX = sign(scaleX) * lockScale
|
|
101
|
+
scaleY = sign(scaleY) * lockScale
|
|
101
102
|
}
|
|
102
|
-
scaleX = scaleX < 0 ? -scale : scale
|
|
103
|
-
scaleY = scaleY < 0 ? -scale : scale
|
|
104
103
|
}
|
|
105
104
|
}
|
|
106
105
|
|
|
@@ -123,7 +122,7 @@ export const EditDataHelper = {
|
|
|
123
122
|
|
|
124
123
|
if (dragBounds) {
|
|
125
124
|
const scaleData = { x: scaleX, y: scaleY }
|
|
126
|
-
DragBoundsHelper.limitScaleOf(target, origin, scaleData)
|
|
125
|
+
DragBoundsHelper.limitScaleOf(target, origin, scaleData, lockRatio as boolean)
|
|
127
126
|
scaleX = scaleData.x
|
|
128
127
|
scaleY = scaleData.y
|
|
129
128
|
}
|
|
@@ -139,10 +138,14 @@ export const EditDataHelper = {
|
|
|
139
138
|
}
|
|
140
139
|
|
|
141
140
|
// 防止小于1px
|
|
142
|
-
if (useScaleX &&
|
|
143
|
-
if (useScaleY &&
|
|
141
|
+
if (useScaleX && abs(scaleX * worldBoxBounds.width) < 1) scaleX = sign(scaleX) / worldBoxBounds.width
|
|
142
|
+
if (useScaleY && abs(scaleY * worldBoxBounds.height) < 1) scaleY = sign(scaleY) / worldBoxBounds.height
|
|
144
143
|
|
|
145
|
-
if (lockRatio && scaleX !== scaleY)
|
|
144
|
+
if (lockRatio && scaleX !== scaleY) {
|
|
145
|
+
lockScale = Math.min(abs(scaleX), abs(scaleY))
|
|
146
|
+
scaleX = sign(scaleX) * lockScale
|
|
147
|
+
scaleY = sign(scaleY) * lockScale
|
|
148
|
+
}
|
|
146
149
|
|
|
147
150
|
return { origin, scaleX, scaleY, direction, lockRatio, around }
|
|
148
151
|
},
|