@logicflow/extension 2.1.12 → 2.1.13
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/.turbo/turbo-build.log +7 -7
- package/CHANGELOG.md +9 -0
- package/dist/index.min.js +1 -1
- package/dist/index.min.js.map +1 -1
- package/es/components/control/index.js +3 -3
- package/es/materials/curved-edge/index.js +41 -25
- package/lib/components/control/index.js +3 -3
- package/lib/materials/curved-edge/index.js +41 -25
- package/package.json +5 -5
- package/src/components/control/index.ts +3 -3
- package/src/materials/curved-edge/index.ts +47 -30
- package/stats.html +1 -1
|
@@ -119,14 +119,14 @@ var Control = /** @class */ (function () {
|
|
|
119
119
|
text.title = item.title;
|
|
120
120
|
text.innerText = item.text;
|
|
121
121
|
itemContainer.append(icon, text);
|
|
122
|
-
switch (item.
|
|
123
|
-
case '
|
|
122
|
+
switch (item.key) {
|
|
123
|
+
case 'undo':
|
|
124
124
|
_this.lf.on('history:change', function (_a) {
|
|
125
125
|
var undoAble = _a.data.undoAble;
|
|
126
126
|
itemContainer.className = undoAble ? NORMAL : DISABLED;
|
|
127
127
|
});
|
|
128
128
|
break;
|
|
129
|
-
case '
|
|
129
|
+
case 'redo':
|
|
130
130
|
_this.lf.on('history:change', function (_a) {
|
|
131
131
|
var redoAble = _a.data.redoAble;
|
|
132
132
|
itemContainer.className = redoAble ? NORMAL : DISABLED;
|
|
@@ -127,38 +127,54 @@ function getMidPoints(cur, key, orientation, radius) {
|
|
|
127
127
|
return [];
|
|
128
128
|
}
|
|
129
129
|
}
|
|
130
|
-
|
|
130
|
+
/**
|
|
131
|
+
* 生成局部路径片段(包含圆角)
|
|
132
|
+
* - 输入为上一个顶点、当前拐点、下一个顶点,计算方向组合并选择圆弧象限
|
|
133
|
+
* - 将圆角半径限制在相邻两段长度的一半以内,避免过度弯曲
|
|
134
|
+
* @param prevPoint 上一个顶点
|
|
135
|
+
* @param cornerPoint 当前拐点(圆角所在拐点)
|
|
136
|
+
* @param nextPoint 下一个顶点
|
|
137
|
+
* @param cornerRadius 圆角半径上限
|
|
138
|
+
* @returns 局部 path 字符串(包含 L/Q 操作)
|
|
139
|
+
*/
|
|
140
|
+
function getPartialPath(prevPoint, cornerPoint, nextPoint, cornerRadius) {
|
|
131
141
|
var _a;
|
|
132
|
-
//
|
|
133
|
-
var
|
|
134
|
-
var
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
142
|
+
// 轴对齐容差(像素),用于消除微小误差
|
|
143
|
+
var epsilon = 1;
|
|
144
|
+
var resolveDir = function (a, b) {
|
|
145
|
+
var dx = b[0] - a[0];
|
|
146
|
+
var dy = b[1] - a[1];
|
|
147
|
+
var adx = Math.abs(dx);
|
|
148
|
+
var ady = Math.abs(dy);
|
|
149
|
+
if (ady <= epsilon && adx > epsilon) {
|
|
150
|
+
return dx < 0 ? 'l' : 'r';
|
|
151
|
+
}
|
|
152
|
+
if (adx <= epsilon && ady > epsilon) {
|
|
153
|
+
return dy < 0 ? 't' : 'b';
|
|
154
|
+
}
|
|
155
|
+
if (adx <= epsilon && ady <= epsilon) {
|
|
156
|
+
return '';
|
|
157
|
+
}
|
|
158
|
+
// 非严格对齐时,选择更接近的轴
|
|
159
|
+
return adx < ady ? (dx < 0 ? 'l' : 'r') : dy < 0 ? 't' : 'b';
|
|
160
|
+
};
|
|
161
|
+
var dir1 = resolveDir(prevPoint, cornerPoint);
|
|
162
|
+
var dir2 = resolveDir(cornerPoint, nextPoint);
|
|
163
|
+
var r = Math.min(Math.hypot(cornerPoint[0] - prevPoint[0], cornerPoint[1] - prevPoint[1]) /
|
|
164
|
+
2, Math.hypot(nextPoint[0] - cornerPoint[0], nextPoint[1] - cornerPoint[1]) /
|
|
165
|
+
2, cornerRadius) || (1 / 5) * cornerRadius;
|
|
151
166
|
var key = "".concat(dir1).concat(dir2);
|
|
152
167
|
var orientation = directionMap[key] || '-';
|
|
153
|
-
var path =
|
|
168
|
+
var path = '';
|
|
154
169
|
if (orientation === '-') {
|
|
155
|
-
|
|
170
|
+
// 仅移动到当前拐点,由下一次迭代决定如何从拐点继续(直线或圆角)
|
|
171
|
+
path += "L ".concat(cornerPoint[0], " ").concat(cornerPoint[1]);
|
|
156
172
|
}
|
|
157
173
|
else {
|
|
158
|
-
var _b = __read(getMidPoints(
|
|
174
|
+
var _b = __read(getMidPoints(cornerPoint, key, orientation, r), 2), mid1 = _b[0], mid2 = _b[1];
|
|
159
175
|
if (mid1 && mid2) {
|
|
160
|
-
path += "L ".concat(mid1[0], " ").concat(mid1[1], " Q ").concat(
|
|
161
|
-
_a = __read(mid2, 2),
|
|
176
|
+
path += "L ".concat(mid1[0], " ").concat(mid1[1], " Q ").concat(cornerPoint[0], " ").concat(cornerPoint[1], " ").concat(mid2[0], " ").concat(mid2[1]);
|
|
177
|
+
_a = __read(mid2, 2), cornerPoint[0] = _a[0], cornerPoint[1] = _a[1];
|
|
162
178
|
}
|
|
163
179
|
}
|
|
164
180
|
return path;
|
|
@@ -122,14 +122,14 @@ var Control = /** @class */ (function () {
|
|
|
122
122
|
text.title = item.title;
|
|
123
123
|
text.innerText = item.text;
|
|
124
124
|
itemContainer.append(icon, text);
|
|
125
|
-
switch (item.
|
|
126
|
-
case '
|
|
125
|
+
switch (item.key) {
|
|
126
|
+
case 'undo':
|
|
127
127
|
_this.lf.on('history:change', function (_a) {
|
|
128
128
|
var undoAble = _a.data.undoAble;
|
|
129
129
|
itemContainer.className = undoAble ? NORMAL : DISABLED;
|
|
130
130
|
});
|
|
131
131
|
break;
|
|
132
|
-
case '
|
|
132
|
+
case 'redo':
|
|
133
133
|
_this.lf.on('history:change', function (_a) {
|
|
134
134
|
var redoAble = _a.data.redoAble;
|
|
135
135
|
itemContainer.className = redoAble ? NORMAL : DISABLED;
|
|
@@ -130,38 +130,54 @@ function getMidPoints(cur, key, orientation, radius) {
|
|
|
130
130
|
return [];
|
|
131
131
|
}
|
|
132
132
|
}
|
|
133
|
-
|
|
133
|
+
/**
|
|
134
|
+
* 生成局部路径片段(包含圆角)
|
|
135
|
+
* - 输入为上一个顶点、当前拐点、下一个顶点,计算方向组合并选择圆弧象限
|
|
136
|
+
* - 将圆角半径限制在相邻两段长度的一半以内,避免过度弯曲
|
|
137
|
+
* @param prevPoint 上一个顶点
|
|
138
|
+
* @param cornerPoint 当前拐点(圆角所在拐点)
|
|
139
|
+
* @param nextPoint 下一个顶点
|
|
140
|
+
* @param cornerRadius 圆角半径上限
|
|
141
|
+
* @returns 局部 path 字符串(包含 L/Q 操作)
|
|
142
|
+
*/
|
|
143
|
+
function getPartialPath(prevPoint, cornerPoint, nextPoint, cornerRadius) {
|
|
134
144
|
var _a;
|
|
135
|
-
//
|
|
136
|
-
var
|
|
137
|
-
var
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
145
|
+
// 轴对齐容差(像素),用于消除微小误差
|
|
146
|
+
var epsilon = 1;
|
|
147
|
+
var resolveDir = function (a, b) {
|
|
148
|
+
var dx = b[0] - a[0];
|
|
149
|
+
var dy = b[1] - a[1];
|
|
150
|
+
var adx = Math.abs(dx);
|
|
151
|
+
var ady = Math.abs(dy);
|
|
152
|
+
if (ady <= epsilon && adx > epsilon) {
|
|
153
|
+
return dx < 0 ? 'l' : 'r';
|
|
154
|
+
}
|
|
155
|
+
if (adx <= epsilon && ady > epsilon) {
|
|
156
|
+
return dy < 0 ? 't' : 'b';
|
|
157
|
+
}
|
|
158
|
+
if (adx <= epsilon && ady <= epsilon) {
|
|
159
|
+
return '';
|
|
160
|
+
}
|
|
161
|
+
// 非严格对齐时,选择更接近的轴
|
|
162
|
+
return adx < ady ? (dx < 0 ? 'l' : 'r') : dy < 0 ? 't' : 'b';
|
|
163
|
+
};
|
|
164
|
+
var dir1 = resolveDir(prevPoint, cornerPoint);
|
|
165
|
+
var dir2 = resolveDir(cornerPoint, nextPoint);
|
|
166
|
+
var r = Math.min(Math.hypot(cornerPoint[0] - prevPoint[0], cornerPoint[1] - prevPoint[1]) /
|
|
167
|
+
2, Math.hypot(nextPoint[0] - cornerPoint[0], nextPoint[1] - cornerPoint[1]) /
|
|
168
|
+
2, cornerRadius) || (1 / 5) * cornerRadius;
|
|
154
169
|
var key = "".concat(dir1).concat(dir2);
|
|
155
170
|
var orientation = directionMap[key] || '-';
|
|
156
|
-
var path =
|
|
171
|
+
var path = '';
|
|
157
172
|
if (orientation === '-') {
|
|
158
|
-
|
|
173
|
+
// 仅移动到当前拐点,由下一次迭代决定如何从拐点继续(直线或圆角)
|
|
174
|
+
path += "L ".concat(cornerPoint[0], " ").concat(cornerPoint[1]);
|
|
159
175
|
}
|
|
160
176
|
else {
|
|
161
|
-
var _b = __read(getMidPoints(
|
|
177
|
+
var _b = __read(getMidPoints(cornerPoint, key, orientation, r), 2), mid1 = _b[0], mid2 = _b[1];
|
|
162
178
|
if (mid1 && mid2) {
|
|
163
|
-
path += "L ".concat(mid1[0], " ").concat(mid1[1], " Q ").concat(
|
|
164
|
-
_a = __read(mid2, 2),
|
|
179
|
+
path += "L ".concat(mid1[0], " ").concat(mid1[1], " Q ").concat(cornerPoint[0], " ").concat(cornerPoint[1], " ").concat(mid2[0], " ").concat(mid2[1]);
|
|
180
|
+
_a = __read(mid2, 2), cornerPoint[0] = _a[0], cornerPoint[1] = _a[1];
|
|
165
181
|
}
|
|
166
182
|
}
|
|
167
183
|
return path;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@logicflow/extension",
|
|
3
|
-
"version": "2.1.
|
|
3
|
+
"version": "2.1.13",
|
|
4
4
|
"description": "LogicFlow Extensions",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "es/index.js",
|
|
@@ -20,8 +20,8 @@
|
|
|
20
20
|
"author": "Logicflow-Team",
|
|
21
21
|
"license": "Apache-2.0",
|
|
22
22
|
"peerDependencies": {
|
|
23
|
-
"@logicflow/
|
|
24
|
-
"@logicflow/
|
|
23
|
+
"@logicflow/core": "2.1.11",
|
|
24
|
+
"@logicflow/vue-node-registry": "1.1.12"
|
|
25
25
|
},
|
|
26
26
|
"dependencies": {
|
|
27
27
|
"@antv/hierarchy": "^0.6.11",
|
|
@@ -32,8 +32,8 @@
|
|
|
32
32
|
"preact": "^10.17.1",
|
|
33
33
|
"rangy": "^1.3.1",
|
|
34
34
|
"vanilla-picker": "^2.12.3",
|
|
35
|
-
"@logicflow/
|
|
36
|
-
"@logicflow/
|
|
35
|
+
"@logicflow/core": "2.1.11",
|
|
36
|
+
"@logicflow/vue-node-registry": "1.1.12"
|
|
37
37
|
},
|
|
38
38
|
"devDependencies": {
|
|
39
39
|
"less": "^4.1.1",
|
|
@@ -116,13 +116,13 @@ export class Control {
|
|
|
116
116
|
text.title = item.title
|
|
117
117
|
text.innerText = item.text
|
|
118
118
|
itemContainer.append(icon, text)
|
|
119
|
-
switch (item.
|
|
120
|
-
case '
|
|
119
|
+
switch (item.key) {
|
|
120
|
+
case 'undo':
|
|
121
121
|
this.lf.on('history:change', ({ data: { undoAble } }: any) => {
|
|
122
122
|
itemContainer.className = undoAble ? NORMAL : DISABLED
|
|
123
123
|
})
|
|
124
124
|
break
|
|
125
|
-
case '
|
|
125
|
+
case 'redo':
|
|
126
126
|
this.lf.on('history:change', ({ data: { redoAble } }: any) => {
|
|
127
127
|
itemContainer.className = redoAble ? NORMAL : DISABLED
|
|
128
128
|
})
|
|
@@ -97,50 +97,67 @@ function getMidPoints(
|
|
|
97
97
|
}
|
|
98
98
|
}
|
|
99
99
|
|
|
100
|
+
/**
|
|
101
|
+
* 生成局部路径片段(包含圆角)
|
|
102
|
+
* - 输入为上一个顶点、当前拐点、下一个顶点,计算方向组合并选择圆弧象限
|
|
103
|
+
* - 将圆角半径限制在相邻两段长度的一半以内,避免过度弯曲
|
|
104
|
+
* @param prevPoint 上一个顶点
|
|
105
|
+
* @param cornerPoint 当前拐点(圆角所在拐点)
|
|
106
|
+
* @param nextPoint 下一个顶点
|
|
107
|
+
* @param cornerRadius 圆角半径上限
|
|
108
|
+
* @returns 局部 path 字符串(包含 L/Q 操作)
|
|
109
|
+
*/
|
|
100
110
|
function getPartialPath(
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
111
|
+
prevPoint: PointTuple,
|
|
112
|
+
cornerPoint: PointTuple,
|
|
113
|
+
nextPoint: PointTuple,
|
|
114
|
+
cornerRadius: number,
|
|
105
115
|
): string {
|
|
106
|
-
//
|
|
107
|
-
const
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
116
|
+
// 轴对齐容差(像素),用于消除微小误差
|
|
117
|
+
const epsilon = 1
|
|
118
|
+
|
|
119
|
+
const resolveDir = (a: PointTuple, b: PointTuple): DirectionType => {
|
|
120
|
+
const dx = b[0] - a[0]
|
|
121
|
+
const dy = b[1] - a[1]
|
|
122
|
+
const adx = Math.abs(dx)
|
|
123
|
+
const ady = Math.abs(dy)
|
|
124
|
+
if (ady <= epsilon && adx > epsilon) {
|
|
125
|
+
return dx < 0 ? 'l' : 'r'
|
|
126
|
+
}
|
|
127
|
+
if (adx <= epsilon && ady > epsilon) {
|
|
128
|
+
return dy < 0 ? 't' : 'b'
|
|
129
|
+
}
|
|
130
|
+
if (adx <= epsilon && ady <= epsilon) {
|
|
131
|
+
return ''
|
|
132
|
+
}
|
|
133
|
+
// 非严格对齐时,选择更接近的轴
|
|
134
|
+
return adx < ady ? (dx < 0 ? 'l' : 'r') : dy < 0 ? 't' : 'b'
|
|
118
135
|
}
|
|
119
136
|
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
} else if (Math.abs(cur[1] - next[1]) <= tolerance) {
|
|
123
|
-
dir2 = cur[0] > next[0] ? 'l' : 'r'
|
|
124
|
-
}
|
|
137
|
+
const dir1: DirectionType = resolveDir(prevPoint, cornerPoint)
|
|
138
|
+
const dir2: DirectionType = resolveDir(cornerPoint, nextPoint)
|
|
125
139
|
|
|
126
140
|
const r =
|
|
127
141
|
Math.min(
|
|
128
|
-
Math.hypot(
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
142
|
+
Math.hypot(cornerPoint[0] - prevPoint[0], cornerPoint[1] - prevPoint[1]) /
|
|
143
|
+
2,
|
|
144
|
+
Math.hypot(nextPoint[0] - cornerPoint[0], nextPoint[1] - cornerPoint[1]) /
|
|
145
|
+
2,
|
|
146
|
+
cornerRadius,
|
|
147
|
+
) || (1 / 5) * cornerRadius
|
|
132
148
|
|
|
133
149
|
const key = `${dir1}${dir2}`
|
|
134
150
|
const orientation: ArcQuadrantType = directionMap[key] || '-'
|
|
135
|
-
let path =
|
|
151
|
+
let path = ''
|
|
136
152
|
|
|
137
153
|
if (orientation === '-') {
|
|
138
|
-
|
|
154
|
+
// 仅移动到当前拐点,由下一次迭代决定如何从拐点继续(直线或圆角)
|
|
155
|
+
path += `L ${cornerPoint[0]} ${cornerPoint[1]}`
|
|
139
156
|
} else {
|
|
140
|
-
const [mid1, mid2] = getMidPoints(
|
|
157
|
+
const [mid1, mid2] = getMidPoints(cornerPoint, key, orientation, r)
|
|
141
158
|
if (mid1 && mid2) {
|
|
142
|
-
path += `L ${mid1[0]} ${mid1[1]} Q ${
|
|
143
|
-
;[
|
|
159
|
+
path += `L ${mid1[0]} ${mid1[1]} Q ${cornerPoint[0]} ${cornerPoint[1]} ${mid2[0]} ${mid2[1]}`
|
|
160
|
+
;[cornerPoint[0], cornerPoint[1]] = mid2
|
|
144
161
|
}
|
|
145
162
|
}
|
|
146
163
|
return path
|