canvu-react 0.4.5 → 0.4.6
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/{asset-hydration-B7yMDQE-.d.cts → asset-hydration-CWhld14A.d.cts} +1 -1
- package/dist/{asset-hydration-CbwQVAwh.d.ts → asset-hydration-D35mHbUP.d.ts} +1 -1
- package/dist/chatbot.d.cts +3 -3
- package/dist/chatbot.d.ts +3 -3
- package/dist/index.d.cts +4 -4
- package/dist/index.d.ts +4 -4
- package/dist/link-item-Bg5vj0RI.d.ts +151 -0
- package/dist/link-item-D870_X6P.d.cts +151 -0
- package/dist/native.cjs +146 -144
- package/dist/native.cjs.map +1 -1
- package/dist/native.d.cts +4 -3
- package/dist/native.d.ts +4 -3
- package/dist/native.js +145 -145
- package/dist/native.js.map +1 -1
- package/dist/react.d.cts +7 -7
- package/dist/react.d.ts +7 -7
- package/dist/realtime.d.cts +4 -4
- package/dist/realtime.d.ts +4 -4
- package/dist/{shape-builders-BAWu-PxX.d.cts → shape-builders-CKEMjivV.d.cts} +42 -143
- package/dist/{shape-builders-ClKv9tz9.d.ts → shape-builders-Cyh8zvDG.d.ts} +42 -143
- package/dist/{types-BC9Xgfu6.d.cts → types-Bw1SdC9v.d.cts} +2 -2
- package/dist/{types-DlSVGX0w.d.ts → types-DeXFfs7Y.d.ts} +2 -2
- package/package.json +1 -1
- package/dist/camera-CVVG7z56.d.cts +0 -50
- package/dist/camera-CoRYN_IV.d.ts +0 -50
package/dist/native.cjs
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
var getStroke = require('perfect-freehand');
|
|
3
4
|
var reactNativeSkia = require('@shopify/react-native-skia');
|
|
4
5
|
var react = require('react');
|
|
5
|
-
var getStroke = require('perfect-freehand');
|
|
6
6
|
var jsxRuntime = require('react/jsx-runtime');
|
|
7
7
|
var reactNative = require('react-native');
|
|
8
8
|
|
|
@@ -10,7 +10,7 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
|
10
10
|
|
|
11
11
|
var getStroke__default = /*#__PURE__*/_interopDefault(getStroke);
|
|
12
12
|
|
|
13
|
-
// src/
|
|
13
|
+
// src/scene/shape-builders.ts
|
|
14
14
|
|
|
15
15
|
// src/math/rect.ts
|
|
16
16
|
function rectsIntersect(a, b) {
|
|
@@ -27,148 +27,6 @@ function normalizeRect(r) {
|
|
|
27
27
|
};
|
|
28
28
|
}
|
|
29
29
|
|
|
30
|
-
// src/math/item-transform.ts
|
|
31
|
-
function getItemRotationRad(item) {
|
|
32
|
-
return item.rotation ?? 0;
|
|
33
|
-
}
|
|
34
|
-
function itemLocalToWorld(lx, ly, itemX, itemY, w, h, rotationRad) {
|
|
35
|
-
const c = { x: w / 2, y: h / 2 };
|
|
36
|
-
const dlx = lx - c.x;
|
|
37
|
-
const dly = ly - c.y;
|
|
38
|
-
const cos = Math.cos(rotationRad);
|
|
39
|
-
const sin = Math.sin(rotationRad);
|
|
40
|
-
return {
|
|
41
|
-
x: itemX + c.x + cos * dlx - sin * dly,
|
|
42
|
-
y: itemY + c.y + sin * dlx + cos * dly
|
|
43
|
-
};
|
|
44
|
-
}
|
|
45
|
-
function worldToItemLocal(wx, wy, itemX, itemY, w, h, rotationRad) {
|
|
46
|
-
const c = { x: w / 2, y: h / 2 };
|
|
47
|
-
const vx = wx - itemX;
|
|
48
|
-
const vy = wy - itemY;
|
|
49
|
-
const dx = vx - c.x;
|
|
50
|
-
const dy = vy - c.y;
|
|
51
|
-
const cos = Math.cos(-rotationRad);
|
|
52
|
-
const sin = Math.sin(-rotationRad);
|
|
53
|
-
const lx = cos * dx - sin * dy;
|
|
54
|
-
const ly = sin * dx + cos * dy;
|
|
55
|
-
return { x: c.x + lx, y: c.y + ly };
|
|
56
|
-
}
|
|
57
|
-
function boundsAabbForRotatedItem(item) {
|
|
58
|
-
const rot = getItemRotationRad(item);
|
|
59
|
-
if (Math.abs(rot) < 1e-12 && item.bounds.width >= 0 && item.bounds.height >= 0) {
|
|
60
|
-
return item.bounds;
|
|
61
|
-
}
|
|
62
|
-
const r = normalizeRect(item.bounds);
|
|
63
|
-
if (Math.abs(rot) < 1e-12) {
|
|
64
|
-
return r;
|
|
65
|
-
}
|
|
66
|
-
const corners = [
|
|
67
|
-
[0, 0],
|
|
68
|
-
[r.width, 0],
|
|
69
|
-
[r.width, r.height],
|
|
70
|
-
[0, r.height]
|
|
71
|
-
];
|
|
72
|
-
let minX = Infinity;
|
|
73
|
-
let minY = Infinity;
|
|
74
|
-
let maxX = -Infinity;
|
|
75
|
-
let maxY = -Infinity;
|
|
76
|
-
for (const [lx, ly] of corners) {
|
|
77
|
-
const p = itemLocalToWorld(lx, ly, item.x, item.y, r.width, r.height, rot);
|
|
78
|
-
minX = Math.min(minX, p.x);
|
|
79
|
-
minY = Math.min(minY, p.y);
|
|
80
|
-
maxX = Math.max(maxX, p.x);
|
|
81
|
-
maxY = Math.max(maxY, p.y);
|
|
82
|
-
}
|
|
83
|
-
return { x: minX, y: minY, width: maxX - minX, height: maxY - minY };
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
// src/interaction/resize-handles.ts
|
|
87
|
-
function getHandleWorldPosition(bounds, id) {
|
|
88
|
-
const r = normalizeRect(bounds);
|
|
89
|
-
const cx = r.x + r.width / 2;
|
|
90
|
-
const cy = r.y + r.height / 2;
|
|
91
|
-
switch (id) {
|
|
92
|
-
case "nw":
|
|
93
|
-
return { x: r.x, y: r.y };
|
|
94
|
-
case "n":
|
|
95
|
-
return { x: cx, y: r.y };
|
|
96
|
-
case "ne":
|
|
97
|
-
return { x: r.x + r.width, y: r.y };
|
|
98
|
-
case "e":
|
|
99
|
-
return { x: r.x + r.width, y: cy };
|
|
100
|
-
case "se":
|
|
101
|
-
return { x: r.x + r.width, y: r.y + r.height };
|
|
102
|
-
case "s":
|
|
103
|
-
return { x: cx, y: r.y + r.height };
|
|
104
|
-
case "sw":
|
|
105
|
-
return { x: r.x, y: r.y + r.height };
|
|
106
|
-
case "w":
|
|
107
|
-
return { x: r.x, y: cy };
|
|
108
|
-
}
|
|
109
|
-
}
|
|
110
|
-
function getHandleWorldPositionRotated(bounds, handle, rotationRad) {
|
|
111
|
-
const r = normalizeRect(bounds);
|
|
112
|
-
const p = getHandleWorldPosition(
|
|
113
|
-
{ x: 0, y: 0, width: r.width, height: r.height },
|
|
114
|
-
handle
|
|
115
|
-
);
|
|
116
|
-
return itemLocalToWorld(p.x, p.y, r.x, r.y, r.width, r.height, rotationRad);
|
|
117
|
-
}
|
|
118
|
-
function getRotationHandleWorldPosition(bounds, rotationRad, handleOffsetWorld) {
|
|
119
|
-
const r = normalizeRect(bounds);
|
|
120
|
-
return itemLocalToWorld(
|
|
121
|
-
r.width / 2,
|
|
122
|
-
-handleOffsetWorld,
|
|
123
|
-
r.x,
|
|
124
|
-
r.y,
|
|
125
|
-
r.width,
|
|
126
|
-
r.height,
|
|
127
|
-
rotationRad
|
|
128
|
-
);
|
|
129
|
-
}
|
|
130
|
-
function rectFromCorners(a, b) {
|
|
131
|
-
const minX = Math.min(a.x, b.x);
|
|
132
|
-
const maxX = Math.max(a.x, b.x);
|
|
133
|
-
const minY = Math.min(a.y, b.y);
|
|
134
|
-
const maxY = Math.max(a.y, b.y);
|
|
135
|
-
return { x: minX, y: minY, width: maxX - minX, height: maxY - minY };
|
|
136
|
-
}
|
|
137
|
-
|
|
138
|
-
// src/scene/freehand-path.ts
|
|
139
|
-
function smoothFreehandPointsToPathD(points) {
|
|
140
|
-
const n = points.length;
|
|
141
|
-
if (n === 0) return "";
|
|
142
|
-
if (n === 1) {
|
|
143
|
-
const p = points[0];
|
|
144
|
-
if (!p) return "";
|
|
145
|
-
return `M ${p.x} ${p.y}`;
|
|
146
|
-
}
|
|
147
|
-
if (n === 2) {
|
|
148
|
-
const a = points[0];
|
|
149
|
-
const b = points[1];
|
|
150
|
-
if (!a || !b) return "";
|
|
151
|
-
return `M ${a.x} ${a.y} L ${b.x} ${b.y}`;
|
|
152
|
-
}
|
|
153
|
-
const p0 = points[0];
|
|
154
|
-
if (!p0) return "";
|
|
155
|
-
let d = `M ${p0.x} ${p0.y}`;
|
|
156
|
-
let i = 1;
|
|
157
|
-
for (; i < n - 2; i++) {
|
|
158
|
-
const pi = points[i];
|
|
159
|
-
const pi1 = points[i + 1];
|
|
160
|
-
if (!pi || !pi1) continue;
|
|
161
|
-
const xc = (pi.x + pi1.x) / 2;
|
|
162
|
-
const yc = (pi.y + pi1.y) / 2;
|
|
163
|
-
d += ` Q ${pi.x} ${pi.y} ${xc} ${yc}`;
|
|
164
|
-
}
|
|
165
|
-
const pLast = points[i];
|
|
166
|
-
const pEnd = points[i + 1];
|
|
167
|
-
if (!pLast || !pEnd) return d;
|
|
168
|
-
d += ` Q ${pLast.x} ${pLast.y} ${pEnd.x} ${pEnd.y}`;
|
|
169
|
-
return d;
|
|
170
|
-
}
|
|
171
|
-
|
|
172
30
|
// src/scene/custom-shape.ts
|
|
173
31
|
function buildCustomShapeChildrenSvg(inner, intrinsic, bounds) {
|
|
174
32
|
const b = normalizeRect(bounds);
|
|
@@ -1042,6 +900,148 @@ function buildRasterImageChildrenSvg(dataUrl, intrinsic, bounds) {
|
|
|
1042
900
|
return `<g transform="translate(${tx}, ${ty}) scale(${s})"><image href="${href}" x="0" y="0" width="${iw}" height="${ih}" /></g>`;
|
|
1043
901
|
}
|
|
1044
902
|
|
|
903
|
+
// src/math/item-transform.ts
|
|
904
|
+
function getItemRotationRad(item) {
|
|
905
|
+
return item.rotation ?? 0;
|
|
906
|
+
}
|
|
907
|
+
function itemLocalToWorld(lx, ly, itemX, itemY, w, h, rotationRad) {
|
|
908
|
+
const c = { x: w / 2, y: h / 2 };
|
|
909
|
+
const dlx = lx - c.x;
|
|
910
|
+
const dly = ly - c.y;
|
|
911
|
+
const cos = Math.cos(rotationRad);
|
|
912
|
+
const sin = Math.sin(rotationRad);
|
|
913
|
+
return {
|
|
914
|
+
x: itemX + c.x + cos * dlx - sin * dly,
|
|
915
|
+
y: itemY + c.y + sin * dlx + cos * dly
|
|
916
|
+
};
|
|
917
|
+
}
|
|
918
|
+
function worldToItemLocal(wx, wy, itemX, itemY, w, h, rotationRad) {
|
|
919
|
+
const c = { x: w / 2, y: h / 2 };
|
|
920
|
+
const vx = wx - itemX;
|
|
921
|
+
const vy = wy - itemY;
|
|
922
|
+
const dx = vx - c.x;
|
|
923
|
+
const dy = vy - c.y;
|
|
924
|
+
const cos = Math.cos(-rotationRad);
|
|
925
|
+
const sin = Math.sin(-rotationRad);
|
|
926
|
+
const lx = cos * dx - sin * dy;
|
|
927
|
+
const ly = sin * dx + cos * dy;
|
|
928
|
+
return { x: c.x + lx, y: c.y + ly };
|
|
929
|
+
}
|
|
930
|
+
function boundsAabbForRotatedItem(item) {
|
|
931
|
+
const rot = getItemRotationRad(item);
|
|
932
|
+
if (Math.abs(rot) < 1e-12 && item.bounds.width >= 0 && item.bounds.height >= 0) {
|
|
933
|
+
return item.bounds;
|
|
934
|
+
}
|
|
935
|
+
const r = normalizeRect(item.bounds);
|
|
936
|
+
if (Math.abs(rot) < 1e-12) {
|
|
937
|
+
return r;
|
|
938
|
+
}
|
|
939
|
+
const corners = [
|
|
940
|
+
[0, 0],
|
|
941
|
+
[r.width, 0],
|
|
942
|
+
[r.width, r.height],
|
|
943
|
+
[0, r.height]
|
|
944
|
+
];
|
|
945
|
+
let minX = Infinity;
|
|
946
|
+
let minY = Infinity;
|
|
947
|
+
let maxX = -Infinity;
|
|
948
|
+
let maxY = -Infinity;
|
|
949
|
+
for (const [lx, ly] of corners) {
|
|
950
|
+
const p = itemLocalToWorld(lx, ly, item.x, item.y, r.width, r.height, rot);
|
|
951
|
+
minX = Math.min(minX, p.x);
|
|
952
|
+
minY = Math.min(minY, p.y);
|
|
953
|
+
maxX = Math.max(maxX, p.x);
|
|
954
|
+
maxY = Math.max(maxY, p.y);
|
|
955
|
+
}
|
|
956
|
+
return { x: minX, y: minY, width: maxX - minX, height: maxY - minY };
|
|
957
|
+
}
|
|
958
|
+
|
|
959
|
+
// src/interaction/resize-handles.ts
|
|
960
|
+
function getHandleWorldPosition(bounds, id) {
|
|
961
|
+
const r = normalizeRect(bounds);
|
|
962
|
+
const cx = r.x + r.width / 2;
|
|
963
|
+
const cy = r.y + r.height / 2;
|
|
964
|
+
switch (id) {
|
|
965
|
+
case "nw":
|
|
966
|
+
return { x: r.x, y: r.y };
|
|
967
|
+
case "n":
|
|
968
|
+
return { x: cx, y: r.y };
|
|
969
|
+
case "ne":
|
|
970
|
+
return { x: r.x + r.width, y: r.y };
|
|
971
|
+
case "e":
|
|
972
|
+
return { x: r.x + r.width, y: cy };
|
|
973
|
+
case "se":
|
|
974
|
+
return { x: r.x + r.width, y: r.y + r.height };
|
|
975
|
+
case "s":
|
|
976
|
+
return { x: cx, y: r.y + r.height };
|
|
977
|
+
case "sw":
|
|
978
|
+
return { x: r.x, y: r.y + r.height };
|
|
979
|
+
case "w":
|
|
980
|
+
return { x: r.x, y: cy };
|
|
981
|
+
}
|
|
982
|
+
}
|
|
983
|
+
function getHandleWorldPositionRotated(bounds, handle, rotationRad) {
|
|
984
|
+
const r = normalizeRect(bounds);
|
|
985
|
+
const p = getHandleWorldPosition(
|
|
986
|
+
{ x: 0, y: 0, width: r.width, height: r.height },
|
|
987
|
+
handle
|
|
988
|
+
);
|
|
989
|
+
return itemLocalToWorld(p.x, p.y, r.x, r.y, r.width, r.height, rotationRad);
|
|
990
|
+
}
|
|
991
|
+
function getRotationHandleWorldPosition(bounds, rotationRad, handleOffsetWorld) {
|
|
992
|
+
const r = normalizeRect(bounds);
|
|
993
|
+
return itemLocalToWorld(
|
|
994
|
+
r.width / 2,
|
|
995
|
+
-handleOffsetWorld,
|
|
996
|
+
r.x,
|
|
997
|
+
r.y,
|
|
998
|
+
r.width,
|
|
999
|
+
r.height,
|
|
1000
|
+
rotationRad
|
|
1001
|
+
);
|
|
1002
|
+
}
|
|
1003
|
+
function rectFromCorners(a, b) {
|
|
1004
|
+
const minX = Math.min(a.x, b.x);
|
|
1005
|
+
const maxX = Math.max(a.x, b.x);
|
|
1006
|
+
const minY = Math.min(a.y, b.y);
|
|
1007
|
+
const maxY = Math.max(a.y, b.y);
|
|
1008
|
+
return { x: minX, y: minY, width: maxX - minX, height: maxY - minY };
|
|
1009
|
+
}
|
|
1010
|
+
|
|
1011
|
+
// src/scene/freehand-path.ts
|
|
1012
|
+
function smoothFreehandPointsToPathD(points) {
|
|
1013
|
+
const n = points.length;
|
|
1014
|
+
if (n === 0) return "";
|
|
1015
|
+
if (n === 1) {
|
|
1016
|
+
const p = points[0];
|
|
1017
|
+
if (!p) return "";
|
|
1018
|
+
return `M ${p.x} ${p.y}`;
|
|
1019
|
+
}
|
|
1020
|
+
if (n === 2) {
|
|
1021
|
+
const a = points[0];
|
|
1022
|
+
const b = points[1];
|
|
1023
|
+
if (!a || !b) return "";
|
|
1024
|
+
return `M ${a.x} ${a.y} L ${b.x} ${b.y}`;
|
|
1025
|
+
}
|
|
1026
|
+
const p0 = points[0];
|
|
1027
|
+
if (!p0) return "";
|
|
1028
|
+
let d = `M ${p0.x} ${p0.y}`;
|
|
1029
|
+
let i = 1;
|
|
1030
|
+
for (; i < n - 2; i++) {
|
|
1031
|
+
const pi = points[i];
|
|
1032
|
+
const pi1 = points[i + 1];
|
|
1033
|
+
if (!pi || !pi1) continue;
|
|
1034
|
+
const xc = (pi.x + pi1.x) / 2;
|
|
1035
|
+
const yc = (pi.y + pi1.y) / 2;
|
|
1036
|
+
d += ` Q ${pi.x} ${pi.y} ${xc} ${yc}`;
|
|
1037
|
+
}
|
|
1038
|
+
const pLast = points[i];
|
|
1039
|
+
const pEnd = points[i + 1];
|
|
1040
|
+
if (!pLast || !pEnd) return d;
|
|
1041
|
+
d += ` Q ${pLast.x} ${pLast.y} ${pEnd.x} ${pEnd.y}`;
|
|
1042
|
+
return d;
|
|
1043
|
+
}
|
|
1044
|
+
|
|
1045
1045
|
// src/native/skia-transform.ts
|
|
1046
1046
|
function parseNum(s) {
|
|
1047
1047
|
return Number(s);
|
|
@@ -3146,6 +3146,8 @@ exports.NativeSceneRenderer = NativeSceneRenderer;
|
|
|
3146
3146
|
exports.NativeShapeRenderer = NativeShapeRenderer;
|
|
3147
3147
|
exports.NativeVectorToolbar = NativeVectorToolbar;
|
|
3148
3148
|
exports.NativeVectorViewport = NativeVectorViewport;
|
|
3149
|
+
exports.createFreehandStrokeItem = createFreehandStrokeItem;
|
|
3150
|
+
exports.createShapeId = createShapeId;
|
|
3149
3151
|
exports.parseSvgFragment = parseSvgFragment;
|
|
3150
3152
|
//# sourceMappingURL=native.cjs.map
|
|
3151
3153
|
//# sourceMappingURL=native.cjs.map
|