@nightshadeui/canvas 2.12.0 → 2.12.2
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/canvas.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer nightshade-components{.CanvasBoxSelect[data-v-9e8905e1]{--CanvasBoxSelect-color:var(--canvas-box-select-color,var(--color-primary-500));--CanvasBoxSelect-opacity:var(--canvas-box-select-opacity,.1);z-index:20;pointer-events:none;position:absolute;inset:0}.Box[data-v-9e8905e1]{border:1px solid var(--CanvasBoxSelect-color);position:absolute}.Box[data-v-9e8905e1]:before{content:"";background:var(--CanvasBoxSelect-color);opacity:var(--CanvasBoxSelect-opacity);position:absolute;inset:0}.ResizeHandle[data-v-c83350e5]{--canvas-resize-handle-size:var(--sp2);--canvas-resize-handle-offset:calc(-.5 * var(--canvas-resize-handle-size));z-index:3;position:absolute}.ResizeHandle-n[data-v-c83350e5]{top:var(--canvas-resize-handle-offset);left:var(--canvas-resize-handle-offset);right:var(--canvas-resize-handle-offset);height:var(--canvas-resize-handle-size);cursor:ns-resize}.ResizeHandle-ne[data-v-c83350e5]{top:var(--canvas-resize-handle-offset);right:var(--canvas-resize-handle-offset);width:var(--canvas-resize-handle-size);height:var(--canvas-resize-handle-size);cursor:nesw-resize;z-index:4}.ResizeHandle-e[data-v-c83350e5]{top:var(--canvas-resize-handle-offset);bottom:var(--canvas-resize-handle-offset);right:var(--canvas-resize-handle-offset);width:var(--canvas-resize-handle-size);cursor:ew-resize}.ResizeHandle-se[data-v-c83350e5]{bottom:var(--canvas-resize-handle-offset);right:var(--canvas-resize-handle-offset);width:var(--canvas-resize-handle-size);height:var(--canvas-resize-handle-size);cursor:nwse-resize;z-index:4}.ResizeHandle-s[data-v-c83350e5]{bottom:var(--canvas-resize-handle-offset);left:var(--canvas-resize-handle-offset);right:var(--canvas-resize-handle-offset);height:var(--canvas-resize-handle-size);cursor:ns-resize}.ResizeHandle-sw[data-v-c83350e5]{bottom:var(--canvas-resize-handle-offset);left:var(--canvas-resize-handle-offset);width:var(--canvas-resize-handle-size);height:var(--canvas-resize-handle-size);cursor:nesw-resize;z-index:4}.ResizeHandle-w[data-v-c83350e5]{top:var(--canvas-resize-handle-offset);bottom:var(--canvas-resize-handle-offset);left:var(--canvas-resize-handle-offset);width:var(--canvas-resize-handle-size);cursor:ew-resize}.ResizeHandle-nw[data-v-c83350e5]{top:var(--canvas-resize-handle-offset);left:var(--canvas-resize-handle-offset);width:var(--canvas-resize-handle-size);height:var(--canvas-resize-handle-size);cursor:nwse-resize;z-index:4}.CanvasView[data-v-52407cb1]{-webkit-user-select:none;user-select:none;display:flex;position:relative}.Viewport[data-v-52407cb1]{z-index:1;cursor:crosshair;flex:1;position:relative;overflow:auto}.Sizer[data-v-52407cb1]{z-index:0;position:relative}.Canvas[data-v-52407cb1]{position:absolute;top:0;left:0;overflow:hidden}.Origin[data-v-52407cb1]{position:absolute;transform:translate(-50%,-50%)}
|
|
1
|
+
@layer nightshade-components{.CanvasBoxSelect[data-v-9e8905e1]{--CanvasBoxSelect-color:var(--canvas-box-select-color,var(--color-primary-500));--CanvasBoxSelect-opacity:var(--canvas-box-select-opacity,.1);z-index:20;pointer-events:none;position:absolute;inset:0}.Box[data-v-9e8905e1]{border:1px solid var(--CanvasBoxSelect-color);position:absolute}.Box[data-v-9e8905e1]:before{content:"";background:var(--CanvasBoxSelect-color);opacity:var(--CanvasBoxSelect-opacity);position:absolute;inset:0}.CanvasDebugCoords[data-v-ad9df38b]{z-index:10;margin:var(--sp);padding:var(--sp);pointer-events:none;font-family:var(--font-monospace);font-size:var(--font-size-s);border:var(--input-border-size) solid var(--color-base-200);border-radius:var(--border-radius);background:var(--color-base-0);position:absolute;top:0;left:0}.Row[data-v-ad9df38b]{white-space:nowrap}.ResizeHandle[data-v-c83350e5]{--canvas-resize-handle-size:var(--sp2);--canvas-resize-handle-offset:calc(-.5 * var(--canvas-resize-handle-size));z-index:3;position:absolute}.ResizeHandle-n[data-v-c83350e5]{top:var(--canvas-resize-handle-offset);left:var(--canvas-resize-handle-offset);right:var(--canvas-resize-handle-offset);height:var(--canvas-resize-handle-size);cursor:ns-resize}.ResizeHandle-ne[data-v-c83350e5]{top:var(--canvas-resize-handle-offset);right:var(--canvas-resize-handle-offset);width:var(--canvas-resize-handle-size);height:var(--canvas-resize-handle-size);cursor:nesw-resize;z-index:4}.ResizeHandle-e[data-v-c83350e5]{top:var(--canvas-resize-handle-offset);bottom:var(--canvas-resize-handle-offset);right:var(--canvas-resize-handle-offset);width:var(--canvas-resize-handle-size);cursor:ew-resize}.ResizeHandle-se[data-v-c83350e5]{bottom:var(--canvas-resize-handle-offset);right:var(--canvas-resize-handle-offset);width:var(--canvas-resize-handle-size);height:var(--canvas-resize-handle-size);cursor:nwse-resize;z-index:4}.ResizeHandle-s[data-v-c83350e5]{bottom:var(--canvas-resize-handle-offset);left:var(--canvas-resize-handle-offset);right:var(--canvas-resize-handle-offset);height:var(--canvas-resize-handle-size);cursor:ns-resize}.ResizeHandle-sw[data-v-c83350e5]{bottom:var(--canvas-resize-handle-offset);left:var(--canvas-resize-handle-offset);width:var(--canvas-resize-handle-size);height:var(--canvas-resize-handle-size);cursor:nesw-resize;z-index:4}.ResizeHandle-w[data-v-c83350e5]{top:var(--canvas-resize-handle-offset);bottom:var(--canvas-resize-handle-offset);left:var(--canvas-resize-handle-offset);width:var(--canvas-resize-handle-size);cursor:ew-resize}.ResizeHandle-nw[data-v-c83350e5]{top:var(--canvas-resize-handle-offset);left:var(--canvas-resize-handle-offset);width:var(--canvas-resize-handle-size);height:var(--canvas-resize-handle-size);cursor:nwse-resize;z-index:4}.CanvasView[data-v-52407cb1]{-webkit-user-select:none;user-select:none;display:flex;position:relative}.Viewport[data-v-52407cb1]{z-index:1;cursor:crosshair;flex:1;position:relative;overflow:auto}.Sizer[data-v-52407cb1]{z-index:0;position:relative}.Canvas[data-v-52407cb1]{position:absolute;top:0;left:0;overflow:hidden}.Origin[data-v-52407cb1]{position:absolute;transform:translate(-50%,-50%)}}
|
package/dist/canvas.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { openBlock as V, createElementBlock as q, createElementVNode as j, normalizeStyle as Z, createCommentVNode as Pt,
|
|
1
|
+
import { openBlock as V, createElementBlock as q, createElementVNode as j, normalizeStyle as Z, createCommentVNode as Pt, resolveComponent as oe, createBlock as Xe, withCtx as G, createVNode as K, toDisplayString as X, withModifiers as U, normalizeClass as _t, renderSlot as re, normalizeProps as jt, guardReactiveProps as Ct, Fragment as Et, renderList as It, reactive as Tt } from "vue";
|
|
2
2
|
const te = (o, e) => {
|
|
3
3
|
const t = o.__vccOpts || o;
|
|
4
4
|
for (const [n, r] of e)
|
|
@@ -20,7 +20,77 @@ function Rt(o, e, t, n, r, c) {
|
|
|
20
20
|
}, null, 4)
|
|
21
21
|
])) : Pt("", !0);
|
|
22
22
|
}
|
|
23
|
-
const kt = /* @__PURE__ */ te(zt, [["render", Rt], ["__scopeId", "data-v-9e8905e1"]])
|
|
23
|
+
const kt = /* @__PURE__ */ te(zt, [["render", Rt], ["__scopeId", "data-v-9e8905e1"]]), Bt = {
|
|
24
|
+
props: {
|
|
25
|
+
canvas: { type: Object, required: !0 }
|
|
26
|
+
},
|
|
27
|
+
computed: {
|
|
28
|
+
pagePos() {
|
|
29
|
+
return this.canvas.inputState.lastMousePos;
|
|
30
|
+
},
|
|
31
|
+
viewportPos() {
|
|
32
|
+
return this.canvas.space.pageToViewport(this.page);
|
|
33
|
+
},
|
|
34
|
+
canvasPos() {
|
|
35
|
+
return this.canvas.space.pageToCanvas(this.page);
|
|
36
|
+
},
|
|
37
|
+
localPos() {
|
|
38
|
+
return this.canvas.space.pageToLocal(this.page);
|
|
39
|
+
}
|
|
40
|
+
},
|
|
41
|
+
methods: {
|
|
42
|
+
format(o) {
|
|
43
|
+
return `(${o.x.toFixed(2)}, ${o.y.toFixed(2)})`;
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
};
|
|
47
|
+
function Ut(o, e, t, n, r, c) {
|
|
48
|
+
const p = oe("HGroup"), y = oe("VGroup");
|
|
49
|
+
return V(), Xe(y, {
|
|
50
|
+
class: "CanvasDebugCoords",
|
|
51
|
+
gap: "s"
|
|
52
|
+
}, {
|
|
53
|
+
default: G(() => [
|
|
54
|
+
K(p, { class: "Row" }, {
|
|
55
|
+
default: G(() => [
|
|
56
|
+
e[0] || (e[0] = j("strong", null, "page", -1)),
|
|
57
|
+
j("span", null, X(c.format(c.pagePos)), 1)
|
|
58
|
+
]),
|
|
59
|
+
_: 1
|
|
60
|
+
}),
|
|
61
|
+
K(p, { class: "Row" }, {
|
|
62
|
+
default: G(() => [
|
|
63
|
+
e[1] || (e[1] = j("strong", null, "viewport", -1)),
|
|
64
|
+
j("span", null, X(c.format(c.viewportPos)), 1)
|
|
65
|
+
]),
|
|
66
|
+
_: 1
|
|
67
|
+
}),
|
|
68
|
+
K(p, { class: "Row" }, {
|
|
69
|
+
default: G(() => [
|
|
70
|
+
e[2] || (e[2] = j("strong", null, "canvas", -1)),
|
|
71
|
+
j("span", null, X(c.format(c.canvasPos)), 1)
|
|
72
|
+
]),
|
|
73
|
+
_: 1
|
|
74
|
+
}),
|
|
75
|
+
K(p, { class: "Row" }, {
|
|
76
|
+
default: G(() => [
|
|
77
|
+
e[3] || (e[3] = j("strong", null, "local", -1)),
|
|
78
|
+
j("span", null, X(c.format(c.localPos)), 1)
|
|
79
|
+
]),
|
|
80
|
+
_: 1
|
|
81
|
+
}),
|
|
82
|
+
K(p, { class: "Row" }, {
|
|
83
|
+
default: G(() => [
|
|
84
|
+
e[4] || (e[4] = j("strong", null, "zoom", -1)),
|
|
85
|
+
j("span", null, X(t.canvas.space.zoom.toFixed(2)), 1)
|
|
86
|
+
]),
|
|
87
|
+
_: 1
|
|
88
|
+
})
|
|
89
|
+
]),
|
|
90
|
+
_: 1
|
|
91
|
+
});
|
|
92
|
+
}
|
|
93
|
+
const Ms = /* @__PURE__ */ te(Bt, [["render", Ut], ["__scopeId", "data-v-ad9df38b"]]);
|
|
24
94
|
function z(o, e, t) {
|
|
25
95
|
return Math.max(e, Math.min(t, o));
|
|
26
96
|
}
|
|
@@ -38,7 +108,7 @@ function Le(o, e) {
|
|
|
38
108
|
const t = o[1].x >= e[0].x && e[1].x >= o[0].x, n = o[1].y >= e[0].y && e[1].y >= o[0].y;
|
|
39
109
|
return t && n;
|
|
40
110
|
}
|
|
41
|
-
function
|
|
111
|
+
function Vt(o) {
|
|
42
112
|
const [e, t] = o;
|
|
43
113
|
return {
|
|
44
114
|
x: (t.x - e.x) * 0.5 + e.x,
|
|
@@ -72,8 +142,8 @@ class ue {
|
|
|
72
142
|
this.entries = [];
|
|
73
143
|
}
|
|
74
144
|
}
|
|
75
|
-
function
|
|
76
|
-
const p = [0,
|
|
145
|
+
function Lt(o, e, t, n = 2, r, c = 1) {
|
|
146
|
+
const p = [0, ...$t(o, e), o], y = [0, o], S = [
|
|
77
147
|
`<svg xmlns="http://www.w3.org/2000/svg"
|
|
78
148
|
width="${o}"
|
|
79
149
|
height="${o}"
|
|
@@ -93,7 +163,7 @@ function Ut(o, e, t, n = 2, r, c = 1) {
|
|
|
93
163
|
);
|
|
94
164
|
return S.push("</svg>"), S.join("");
|
|
95
165
|
}
|
|
96
|
-
function
|
|
166
|
+
function $t(o, e) {
|
|
97
167
|
const t = [], n = Math.round(o / e);
|
|
98
168
|
for (let r = 1; r < e; r++)
|
|
99
169
|
t.push(n * r);
|
|
@@ -101,7 +171,7 @@ function Vt(o, e) {
|
|
|
101
171
|
}
|
|
102
172
|
var Ae = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {}, Ge = {};
|
|
103
173
|
var Fe;
|
|
104
|
-
function
|
|
174
|
+
function At() {
|
|
105
175
|
if (Fe) return Ge;
|
|
106
176
|
Fe = 1;
|
|
107
177
|
var o;
|
|
@@ -902,13 +972,13 @@ function Lt() {
|
|
|
902
972
|
});
|
|
903
973
|
})(o || (o = {})), Ge;
|
|
904
974
|
}
|
|
905
|
-
|
|
975
|
+
At();
|
|
906
976
|
class qe extends Error {
|
|
907
977
|
constructor() {
|
|
908
978
|
super(...arguments), this.name = this.constructor.name;
|
|
909
979
|
}
|
|
910
980
|
}
|
|
911
|
-
class
|
|
981
|
+
class Gt extends qe {
|
|
912
982
|
constructor(e, t) {
|
|
913
983
|
super(`"${t}" not found in Mesh "${e}"`);
|
|
914
984
|
}
|
|
@@ -921,11 +991,11 @@ class Ke extends qe {
|
|
|
921
991
|
function D(o) {
|
|
922
992
|
return typeof o == "string" ? o : o.name;
|
|
923
993
|
}
|
|
924
|
-
function
|
|
994
|
+
function Ft(o) {
|
|
925
995
|
return typeof o == "function" && o.prototype != null;
|
|
926
996
|
}
|
|
927
|
-
function
|
|
928
|
-
return
|
|
997
|
+
function Kt(o, ...e) {
|
|
998
|
+
return Ft(o) ? new o(...e) : o(...e);
|
|
929
999
|
}
|
|
930
1000
|
const Je = /* @__PURE__ */ Symbol.for("MESH_REF");
|
|
931
1001
|
class ae {
|
|
@@ -978,7 +1048,7 @@ class ae {
|
|
|
978
1048
|
const n = this.tryResolve(e, t);
|
|
979
1049
|
if (n === void 0) {
|
|
980
1050
|
const r = D(e);
|
|
981
|
-
throw new
|
|
1051
|
+
throw new Gt(this.name, r);
|
|
982
1052
|
}
|
|
983
1053
|
return n;
|
|
984
1054
|
}
|
|
@@ -1013,7 +1083,7 @@ class ae {
|
|
|
1013
1083
|
t.type === "service" && (yield* this.traverseClassDeps(t.class, e));
|
|
1014
1084
|
}
|
|
1015
1085
|
*traverseClassDeps(e, t = /* @__PURE__ */ new Set()) {
|
|
1016
|
-
const n =
|
|
1086
|
+
const n = Yt(e);
|
|
1017
1087
|
for (const r of n) {
|
|
1018
1088
|
if (t.has(r.key))
|
|
1019
1089
|
continue;
|
|
@@ -1034,7 +1104,7 @@ class ae {
|
|
|
1034
1104
|
case "constant":
|
|
1035
1105
|
return e.value;
|
|
1036
1106
|
case "scope":
|
|
1037
|
-
return (n) =>
|
|
1107
|
+
return (n) => Kt(e.factory, n ?? this);
|
|
1038
1108
|
}
|
|
1039
1109
|
}
|
|
1040
1110
|
applyMiddleware(e) {
|
|
@@ -1051,21 +1121,21 @@ class ae {
|
|
|
1051
1121
|
});
|
|
1052
1122
|
}
|
|
1053
1123
|
}
|
|
1054
|
-
const
|
|
1055
|
-
function
|
|
1124
|
+
const Nt = [];
|
|
1125
|
+
function Yt(o) {
|
|
1056
1126
|
const e = [];
|
|
1057
1127
|
let t = o;
|
|
1058
1128
|
for (; t !== Object.prototype; ) {
|
|
1059
|
-
const n =
|
|
1129
|
+
const n = Nt.filter((r) => r.class === t);
|
|
1060
1130
|
e.push(...n), t = Object.getPrototypeOf(t);
|
|
1061
1131
|
}
|
|
1062
1132
|
return e;
|
|
1063
1133
|
}
|
|
1064
|
-
const
|
|
1134
|
+
const Ht = Object.getOwnPropertyNames(Reflect);
|
|
1065
1135
|
function b(o, e, t = !0) {
|
|
1066
1136
|
let n;
|
|
1067
1137
|
const r = {};
|
|
1068
|
-
for (const c of
|
|
1138
|
+
for (const c of Ht)
|
|
1069
1139
|
r[c] = function(p, ...y) {
|
|
1070
1140
|
let S = n;
|
|
1071
1141
|
return S || (S = o[Je].resolve(e)), t && (n = S), Reflect[c](S, ...y);
|
|
@@ -1113,7 +1183,7 @@ class k {
|
|
|
1113
1183
|
}
|
|
1114
1184
|
}
|
|
1115
1185
|
const we = /* @__PURE__ */ new Map();
|
|
1116
|
-
function
|
|
1186
|
+
function Xt(o) {
|
|
1117
1187
|
return function(t) {
|
|
1118
1188
|
return (n, r) => {
|
|
1119
1189
|
const c = we.get(o) || [];
|
|
@@ -1125,11 +1195,11 @@ function Yt(o) {
|
|
|
1125
1195
|
};
|
|
1126
1196
|
};
|
|
1127
1197
|
}
|
|
1128
|
-
function
|
|
1198
|
+
function Wt(o) {
|
|
1129
1199
|
return we.get(o) || [];
|
|
1130
1200
|
}
|
|
1131
|
-
function
|
|
1132
|
-
const n = [], r =
|
|
1201
|
+
function Zt(o, e, t = !0) {
|
|
1202
|
+
const n = [], r = Wt(o), c = t ? e.allBindings() : e.bindings.entries();
|
|
1133
1203
|
for (const [p, y] of c)
|
|
1134
1204
|
if (y.type === "service")
|
|
1135
1205
|
for (const { target: S, memberName: C, metadata: E } of r)
|
|
@@ -1140,12 +1210,12 @@ function Xt(o, e, t = !0) {
|
|
|
1140
1210
|
});
|
|
1141
1211
|
return n;
|
|
1142
1212
|
}
|
|
1143
|
-
function
|
|
1144
|
-
return
|
|
1213
|
+
function qt(o, e, t = !0, ...n) {
|
|
1214
|
+
return Zt(o, e, t).map((p) => p.target[p.memberName](...n));
|
|
1145
1215
|
}
|
|
1146
|
-
const he =
|
|
1216
|
+
const he = Xt("init");
|
|
1147
1217
|
async function Ne(o, e = !0) {
|
|
1148
|
-
const t =
|
|
1218
|
+
const t = qt("init", o, e);
|
|
1149
1219
|
await Promise.all(t);
|
|
1150
1220
|
}
|
|
1151
1221
|
class ce {
|
|
@@ -1287,14 +1357,14 @@ class L {
|
|
|
1287
1357
|
return this.canvasToLocal(this.pageToCanvas(e));
|
|
1288
1358
|
}
|
|
1289
1359
|
getViewportCenterInLocal() {
|
|
1290
|
-
const e =
|
|
1360
|
+
const e = Vt(this.viewportBox), t = this.pageToViewport(e);
|
|
1291
1361
|
return this.viewportToLocal(t);
|
|
1292
1362
|
}
|
|
1293
1363
|
}
|
|
1294
|
-
var
|
|
1295
|
-
for (var r =
|
|
1364
|
+
var Jt = Object.defineProperty, Qt = Object.getOwnPropertyDescriptor, es = (o, e, t, n) => {
|
|
1365
|
+
for (var r = Qt(e, t), c = o.length - 1, p; c >= 0; c--)
|
|
1296
1366
|
(p = o[c]) && (r = p(e, t, r) || r);
|
|
1297
|
-
return r &&
|
|
1367
|
+
return r && Jt(e, t, r), r;
|
|
1298
1368
|
};
|
|
1299
1369
|
class xe {
|
|
1300
1370
|
constructor() {
|
|
@@ -1324,10 +1394,10 @@ class xe {
|
|
|
1324
1394
|
this.movingIds.clear(), this.moveOriginPos = null;
|
|
1325
1395
|
}
|
|
1326
1396
|
}
|
|
1327
|
-
|
|
1397
|
+
es([
|
|
1328
1398
|
he()
|
|
1329
1399
|
], xe.prototype, "init");
|
|
1330
|
-
class
|
|
1400
|
+
class ts {
|
|
1331
1401
|
constructor(e) {
|
|
1332
1402
|
this.config = b(this, J), this.events = b(this, k), this.selection = b(this, Q), this.move = b(this, xe), this.space = b(this, L), this.element = null, this.selectable = !0, this.movable = !0, this.snapToGrid = !0, this.resizable = "none", this.bounds = [{ x: 1, y: 1 }, { x: 10, y: 10 }], this.pos = { x: 0, y: 0 }, this.localPos = { x: 0, y: 0, w: 1, h: 1 }, this.prevLocalPos = { x: 0, y: 0, w: 1, h: 1 }, this.resizingDirection = null, this.resizingBounds = [{ x: 0, y: 0 }, { x: 0, y: 0 }], this.objectId = e;
|
|
1333
1403
|
}
|
|
@@ -1558,13 +1628,13 @@ class Qt {
|
|
|
1558
1628
|
}
|
|
1559
1629
|
}
|
|
1560
1630
|
}
|
|
1561
|
-
const
|
|
1631
|
+
const ss = {
|
|
1562
1632
|
props: {
|
|
1563
1633
|
canvasObject: { type: Object, required: !0 },
|
|
1564
1634
|
direction: { type: String, required: !0 }
|
|
1565
1635
|
}
|
|
1566
1636
|
};
|
|
1567
|
-
function
|
|
1637
|
+
function ns(o, e, t, n, r, c) {
|
|
1568
1638
|
return V(), q("div", {
|
|
1569
1639
|
class: _t(["ResizeHandle", `ResizeHandle-${t.direction}`]),
|
|
1570
1640
|
onUidragstart: e[0] || (e[0] = U((p) => t.canvasObject.startResizing(t.direction), ["stop", "prevent"])),
|
|
@@ -1572,9 +1642,9 @@ function ts(o, e, t, n, r, c) {
|
|
|
1572
1642
|
onUidragend: e[2] || (e[2] = U((...p) => t.canvasObject.onResizeEnd && t.canvasObject.onResizeEnd(...p), ["stop", "prevent"]))
|
|
1573
1643
|
}, null, 34);
|
|
1574
1644
|
}
|
|
1575
|
-
const
|
|
1645
|
+
const is = /* @__PURE__ */ te(ss, [["render", ns], ["__scopeId", "data-v-c83350e5"]]), rs = {
|
|
1576
1646
|
components: {
|
|
1577
|
-
CanvasObjectResize:
|
|
1647
|
+
CanvasObjectResize: is
|
|
1578
1648
|
},
|
|
1579
1649
|
props: {
|
|
1580
1650
|
canvas: { type: Object, required: !0 },
|
|
@@ -1637,7 +1707,7 @@ const ss = /* @__PURE__ */ te(es, [["render", ts], ["__scopeId", "data-v-c83350e
|
|
|
1637
1707
|
}
|
|
1638
1708
|
},
|
|
1639
1709
|
created() {
|
|
1640
|
-
this.canvasObject = new
|
|
1710
|
+
this.canvasObject = new ts(this.objectId), this.canvas.mesh.connect(this.canvasObject), this.canvas.events.objectPosUpdated.on(({ objectId: o, pos: e }) => {
|
|
1641
1711
|
o === this.objectId && this.$emit("update:pos", e);
|
|
1642
1712
|
}, this), this.canvas.events.selectionChanged.on((o) => {
|
|
1643
1713
|
const e = o.includes(this.objectId);
|
|
@@ -1652,7 +1722,7 @@ const ss = /* @__PURE__ */ te(es, [["render", ts], ["__scopeId", "data-v-c83350e
|
|
|
1652
1722
|
this.canvas.objectRegistry.unregister(this.objectId), this.canvasObject.setElement(null), this.canvas.selection.removeFromSelection(this.objectId), this.canvas.events.objectPosUpdated.removeAll(this), this.canvas.events.selectionChanged.removeAll(this);
|
|
1653
1723
|
}
|
|
1654
1724
|
};
|
|
1655
|
-
function
|
|
1725
|
+
function os(o, e, t, n, r, c) {
|
|
1656
1726
|
const p = oe("CanvasObjectResize");
|
|
1657
1727
|
return V(), q("div", {
|
|
1658
1728
|
ref: "rootEl",
|
|
@@ -1671,7 +1741,7 @@ function is(o, e, t, n, r, c) {
|
|
|
1671
1741
|
}, null, 8, ["canvasObject", "direction"]))), 128))
|
|
1672
1742
|
], 36);
|
|
1673
1743
|
}
|
|
1674
|
-
const
|
|
1744
|
+
const Os = /* @__PURE__ */ te(rs, [["render", os]]), as = {
|
|
1675
1745
|
components: {
|
|
1676
1746
|
CanvasBoxSelect: kt
|
|
1677
1747
|
},
|
|
@@ -1689,10 +1759,10 @@ const Ms = /* @__PURE__ */ te(ns, [["render", is]]), rs = {
|
|
|
1689
1759
|
this.canvas.selection.deselectAll();
|
|
1690
1760
|
}
|
|
1691
1761
|
}
|
|
1692
|
-
},
|
|
1693
|
-
function
|
|
1762
|
+
}, cs = { class: "CanvasView" };
|
|
1763
|
+
function ls(o, e, t, n, r, c) {
|
|
1694
1764
|
const p = oe("CanvasBoxSelect");
|
|
1695
|
-
return V(), q("div",
|
|
1765
|
+
return V(), q("div", cs, [
|
|
1696
1766
|
j("div", {
|
|
1697
1767
|
ref: "viewport",
|
|
1698
1768
|
class: "Viewport",
|
|
@@ -1725,77 +1795,7 @@ function as(o, e, t, n, r, c) {
|
|
|
1725
1795
|
re(o.$slots, "overlays", {}, void 0, !0)
|
|
1726
1796
|
]);
|
|
1727
1797
|
}
|
|
1728
|
-
const
|
|
1729
|
-
props: {
|
|
1730
|
-
controller: { type: Object, required: !0 }
|
|
1731
|
-
},
|
|
1732
|
-
computed: {
|
|
1733
|
-
page() {
|
|
1734
|
-
return this.controller.inputState.lastMousePos;
|
|
1735
|
-
},
|
|
1736
|
-
viewport() {
|
|
1737
|
-
return this.controller.space.pageToViewport(this.page);
|
|
1738
|
-
},
|
|
1739
|
-
canvas() {
|
|
1740
|
-
return this.controller.space.pageToCanvas(this.page);
|
|
1741
|
-
},
|
|
1742
|
-
local() {
|
|
1743
|
-
return this.controller.space.pageToLocal(this.page);
|
|
1744
|
-
}
|
|
1745
|
-
},
|
|
1746
|
-
methods: {
|
|
1747
|
-
format(o) {
|
|
1748
|
-
return `(${o.x.toFixed(2)}, ${o.y.toFixed(2)})`;
|
|
1749
|
-
}
|
|
1750
|
-
}
|
|
1751
|
-
};
|
|
1752
|
-
function ls(o, e, t, n, r, c) {
|
|
1753
|
-
const p = oe("HGroup"), y = oe("VGroup");
|
|
1754
|
-
return V(), Xe(y, {
|
|
1755
|
-
class: "DebugCoords",
|
|
1756
|
-
gap: "s"
|
|
1757
|
-
}, {
|
|
1758
|
-
default: G(() => [
|
|
1759
|
-
K(p, { class: "Row" }, {
|
|
1760
|
-
default: G(() => [
|
|
1761
|
-
e[0] || (e[0] = j("strong", null, "page", -1)),
|
|
1762
|
-
j("span", null, X(c.format(c.page)), 1)
|
|
1763
|
-
]),
|
|
1764
|
-
_: 1
|
|
1765
|
-
}),
|
|
1766
|
-
K(p, { class: "Row" }, {
|
|
1767
|
-
default: G(() => [
|
|
1768
|
-
e[1] || (e[1] = j("strong", null, "viewport", -1)),
|
|
1769
|
-
j("span", null, X(c.format(c.viewport)), 1)
|
|
1770
|
-
]),
|
|
1771
|
-
_: 1
|
|
1772
|
-
}),
|
|
1773
|
-
K(p, { class: "Row" }, {
|
|
1774
|
-
default: G(() => [
|
|
1775
|
-
e[2] || (e[2] = j("strong", null, "canvas", -1)),
|
|
1776
|
-
j("span", null, X(c.format(c.canvas)), 1)
|
|
1777
|
-
]),
|
|
1778
|
-
_: 1
|
|
1779
|
-
}),
|
|
1780
|
-
K(p, { class: "Row" }, {
|
|
1781
|
-
default: G(() => [
|
|
1782
|
-
e[3] || (e[3] = j("strong", null, "local", -1)),
|
|
1783
|
-
j("span", null, X(c.format(c.local)), 1)
|
|
1784
|
-
]),
|
|
1785
|
-
_: 1
|
|
1786
|
-
}),
|
|
1787
|
-
K(p, { class: "Row" }, {
|
|
1788
|
-
default: G(() => [
|
|
1789
|
-
e[4] || (e[4] = j("strong", null, "zoom", -1)),
|
|
1790
|
-
j("span", null, X(t.controller.space.zoom.toFixed(2)), 1)
|
|
1791
|
-
]),
|
|
1792
|
-
_: 1
|
|
1793
|
-
})
|
|
1794
|
-
]),
|
|
1795
|
-
_: 1
|
|
1796
|
-
});
|
|
1797
|
-
}
|
|
1798
|
-
const Ps = /* @__PURE__ */ te(cs, [["render", ls], ["__scopeId", "data-v-54d4bb42"]]);
|
|
1798
|
+
const Ps = /* @__PURE__ */ te(as, [["render", ls], ["__scopeId", "data-v-52407cb1"]]);
|
|
1799
1799
|
var us = Object.defineProperty, hs = Object.getOwnPropertyDescriptor, ds = (o, e, t, n) => {
|
|
1800
1800
|
for (var r = hs(e, t), c = o.length - 1, p; c >= 0; c--)
|
|
1801
1801
|
(p = o[c]) && (r = p(e, t, r) || r);
|
|
@@ -1916,7 +1916,7 @@ class le {
|
|
|
1916
1916
|
this.windowEvents.removeAll(), this.viewportEl = null, this.space.viewportBox = [{ x: 0, y: 0 }, { x: 0, y: 0 }];
|
|
1917
1917
|
}
|
|
1918
1918
|
getCanvasStyle() {
|
|
1919
|
-
const e = $e(this.viewportEl, "--canvas-grid-major-color", "#ddd"), t = $e(this.viewportEl, "--canvas-grid-minor-color", "#eee"), n = W(this.viewportEl, "--canvas-grid-subdivisions", 4), r = W(this.viewportEl, "--canvas-grid-major-radius", 2), c = W(this.viewportEl, "--canvas-grid-minor-radius", 1), p =
|
|
1919
|
+
const e = $e(this.viewportEl, "--canvas-grid-major-color", "#ddd"), t = $e(this.viewportEl, "--canvas-grid-minor-color", "#eee"), n = W(this.viewportEl, "--canvas-grid-subdivisions", 4), r = W(this.viewportEl, "--canvas-grid-major-radius", 2), c = W(this.viewportEl, "--canvas-grid-minor-radius", 1), p = Lt(
|
|
1920
1920
|
this.space.cellSize,
|
|
1921
1921
|
n,
|
|
1922
1922
|
e,
|
|
@@ -2155,17 +2155,17 @@ export {
|
|
|
2155
2155
|
kt as CanvasBoxSelect,
|
|
2156
2156
|
J as CanvasConfig,
|
|
2157
2157
|
_s as CanvasController,
|
|
2158
|
+
Ms as CanvasDebugCoords,
|
|
2158
2159
|
k as CanvasEvents,
|
|
2159
2160
|
ee as CanvasInputState,
|
|
2160
|
-
|
|
2161
|
-
|
|
2161
|
+
Os as CanvasObject,
|
|
2162
|
+
ts as CanvasObjectController,
|
|
2162
2163
|
ce as CanvasObjectRegistry,
|
|
2163
2164
|
me as CanvasPan,
|
|
2164
2165
|
Q as CanvasSelection,
|
|
2165
2166
|
L as CanvasSpace,
|
|
2166
2167
|
be as CanvasUiEvents,
|
|
2167
|
-
|
|
2168
|
+
Ps as CanvasView,
|
|
2168
2169
|
le as CanvasViewport,
|
|
2169
|
-
He as CanvasZoom
|
|
2170
|
-
Ps as DebugCoords
|
|
2170
|
+
He as CanvasZoom
|
|
2171
2171
|
};
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
|
|
2
|
-
|
|
2
|
+
canvas: {
|
|
3
3
|
type: ObjectConstructor;
|
|
4
4
|
required: true;
|
|
5
5
|
};
|
|
6
6
|
}>, {}, {}, {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
7
|
+
pagePos(): any;
|
|
8
|
+
viewportPos(): any;
|
|
9
|
+
canvasPos(): any;
|
|
10
|
+
localPos(): any;
|
|
11
11
|
}, {
|
|
12
12
|
format(pos: any): string;
|
|
13
13
|
}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
|
|
14
|
-
|
|
14
|
+
canvas: {
|
|
15
15
|
type: ObjectConstructor;
|
|
16
16
|
required: true;
|
|
17
17
|
};
|
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { default as CanvasBoxSelect } from './components/CanvasBoxSelect.vue';
|
|
2
|
+
import { default as CanvasDebugCoords } from './components/CanvasDebugCoords.vue';
|
|
2
3
|
import { default as CanvasObject } from './components/CanvasObject.vue';
|
|
3
4
|
import { default as CanvasView } from './components/CanvasView.vue';
|
|
4
|
-
import { default as DebugCoords } from './components/DebugCoords.vue';
|
|
5
5
|
export * from './CanvasBoxSelect.js';
|
|
6
6
|
export * from './CanvasConfig.js';
|
|
7
7
|
export * from './CanvasController.js';
|
|
@@ -15,4 +15,4 @@ export * from './CanvasSpace.js';
|
|
|
15
15
|
export * from './CanvasUiEvents.js';
|
|
16
16
|
export * from './CanvasViewport.js';
|
|
17
17
|
export * from './CanvasZoom.js';
|
|
18
|
-
export { CanvasBoxSelect, CanvasObject, CanvasView,
|
|
18
|
+
export { CanvasBoxSelect, CanvasDebugCoords, CanvasObject, CanvasView, };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nightshadeui/canvas",
|
|
3
|
-
"version": "2.12.
|
|
3
|
+
"version": "2.12.2",
|
|
4
4
|
"description": "Nightshade canvas viewport primitives",
|
|
5
5
|
"author": "Boris Okunskiy",
|
|
6
6
|
"license": "ISC",
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
"vue": "^3.5.22"
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"@nightshadeui/util": "2.12.
|
|
26
|
+
"@nightshadeui/util": "2.12.2",
|
|
27
27
|
"@luminable/init-decorator": "^1.3.5",
|
|
28
28
|
"mesh-ioc": "^4.3.1",
|
|
29
29
|
"nanoevent": "^1.0.0"
|