@vectojs/core 1.13.0 → 1.15.0
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/{chunk-XIEQHSBB.mjs → chunk-64UFEHOJ.mjs} +7 -464
- package/dist/{chunk-2Z23LTH3.js → chunk-J6NHSFIE.js} +60 -517
- package/dist/index.d.ts +4 -12
- package/dist/index.js +183 -273
- package/dist/index.mjs +79 -169
- package/dist/layout/index.d.ts +1 -3
- package/dist/layout.js +2 -16
- package/dist/layout.mjs +2 -16
- package/dist/text/MSDFTextEntity.d.ts +1 -1
- package/dist/text/index.d.ts +1 -5
- package/dist/text.js +5 -16
- package/dist/text.mjs +6 -17
- package/dist/tree/Entity.d.ts +2 -2
- package/dist/tree/Scene.d.ts +22 -0
- package/package.json +8 -6
- package/dist/animation/drivers.d.ts +0 -48
- package/dist/animation/easing.d.ts +0 -16
- package/dist/chunk-4AR425AR.js +0 -1121
- package/dist/chunk-BA5HUUDF.js +0 -760
- package/dist/chunk-IESDTEJ4.mjs +0 -1121
- package/dist/chunk-X7I465AQ.mjs +0 -760
- package/dist/layout/LayoutEngine.d.ts +0 -289
- package/dist/layout/LayoutWorker.d.ts +0 -23
- package/dist/layout/LayoutWorkerManager.d.ts +0 -26
- package/dist/layout/LayoutWorkerSource.d.ts +0 -1
- package/dist/layout/measure.d.ts +0 -20
- package/dist/math/SpatialHashGrid.d.ts +0 -53
- package/dist/math/SpringPhysics.d.ts +0 -13
- package/dist/text/ArabicShaper.d.ts +0 -10
- package/dist/text/BidiResolver.d.ts +0 -5
- package/dist/text/MSDFFont.d.ts +0 -129
- package/dist/text/PreparedContentGrid.d.ts +0 -60
- package/dist/text/Typography.d.ts +0 -11
|
@@ -1,137 +1,9 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; } var _class; var _class2; var _class3; var _class4
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; } var _class; var _class2; var _class3; var _class4;// src/tree/Entity.ts
|
|
2
2
|
|
|
3
3
|
|
|
4
4
|
|
|
5
|
-
var _chunk4AR425ARjs = require('./chunk-4AR425AR.js');
|
|
6
5
|
|
|
7
|
-
|
|
8
|
-
var MAX_FRAME_DT = 0.25;
|
|
9
|
-
var MAX_STEP_DT = 1 / 120;
|
|
10
|
-
var SpringPhysics = (_class = class {
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
__init() {this.velocity = 0}
|
|
14
|
-
__init2() {this.stiffness = 180}
|
|
15
|
-
__init3() {this.damping = 12}
|
|
16
|
-
__init4() {this.mass = 1}
|
|
17
|
-
__init5() {this.valEpsilon = 5e-3}
|
|
18
|
-
__init6() {this.velEpsilon = 5e-3}
|
|
19
|
-
constructor(initial) {;_class.prototype.__init.call(this);_class.prototype.__init2.call(this);_class.prototype.__init3.call(this);_class.prototype.__init4.call(this);_class.prototype.__init5.call(this);_class.prototype.__init6.call(this);
|
|
20
|
-
this.value = initial;
|
|
21
|
-
this.target = initial;
|
|
22
|
-
}
|
|
23
|
-
update(dt) {
|
|
24
|
-
if (this.isAtRest()) {
|
|
25
|
-
this.value = this.target;
|
|
26
|
-
this.velocity = 0;
|
|
27
|
-
return;
|
|
28
|
-
}
|
|
29
|
-
if (!(dt > 0)) return;
|
|
30
|
-
let remaining = dt < MAX_FRAME_DT ? dt : MAX_FRAME_DT;
|
|
31
|
-
while (remaining > 0) {
|
|
32
|
-
const step = remaining < MAX_STEP_DT ? remaining : MAX_STEP_DT;
|
|
33
|
-
const forceSpring = -this.stiffness * (this.value - this.target);
|
|
34
|
-
const forceDamping = -this.damping * this.velocity;
|
|
35
|
-
const acceleration = (forceSpring + forceDamping) / this.mass;
|
|
36
|
-
this.velocity += acceleration * step;
|
|
37
|
-
this.value += this.velocity * step;
|
|
38
|
-
remaining -= step;
|
|
39
|
-
if (this.isAtRest()) {
|
|
40
|
-
this.value = this.target;
|
|
41
|
-
this.velocity = 0;
|
|
42
|
-
return;
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
isAtRest() {
|
|
47
|
-
return Math.abs(this.value - this.target) < this.valEpsilon && Math.abs(this.velocity) < this.velEpsilon;
|
|
48
|
-
}
|
|
49
|
-
}, _class);
|
|
50
|
-
|
|
51
|
-
// src/animation/easing.ts
|
|
52
|
-
var c1 = 1.70158;
|
|
53
|
-
var c3 = c1 + 1;
|
|
54
|
-
var Easing = {
|
|
55
|
-
linear: (t) => t,
|
|
56
|
-
easeInQuad: (t) => t * t,
|
|
57
|
-
easeOutQuad: (t) => t * (2 - t),
|
|
58
|
-
easeInOutQuad: (t) => t < 0.5 ? 2 * t * t : 1 - Math.pow(-2 * t + 2, 2) / 2,
|
|
59
|
-
easeInCubic: (t) => t * t * t,
|
|
60
|
-
easeOutCubic: (t) => 1 - Math.pow(1 - t, 3),
|
|
61
|
-
easeInOutCubic: (t) => t < 0.5 ? 4 * t * t * t : 1 - Math.pow(-2 * t + 2, 3) / 2,
|
|
62
|
-
easeOutBack: (t) => 1 + c3 * Math.pow(t - 1, 3) + c1 * Math.pow(t - 1, 2),
|
|
63
|
-
easeInOutBack: (t) => {
|
|
64
|
-
const c2 = c1 * 1.525;
|
|
65
|
-
return t < 0.5 ? Math.pow(2 * t, 2) * ((c2 + 1) * 2 * t - c2) / 2 : (Math.pow(2 * t - 2, 2) * ((c2 + 1) * (t * 2 - 2) + c2) + 2) / 2;
|
|
66
|
-
}
|
|
67
|
-
};
|
|
68
|
-
|
|
69
|
-
// src/animation/drivers.ts
|
|
70
|
-
function isTweenConfig(c) {
|
|
71
|
-
return typeof c === "object" && "duration" in c;
|
|
72
|
-
}
|
|
73
|
-
var TweenDriver = (_class2 = class {
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
__init7() {this.elapsed = 0}
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
constructor(from, to, cfg) {;_class2.prototype.__init7.call(this);
|
|
82
|
-
this.value = from;
|
|
83
|
-
this.from = from;
|
|
84
|
-
this.to = to;
|
|
85
|
-
this.duration = Math.max(1, cfg.duration);
|
|
86
|
-
this.delay = _nullishCoalesce(cfg.delay, () => ( 0));
|
|
87
|
-
this.ease = typeof cfg.easing === "function" ? cfg.easing : Easing[_nullishCoalesce(cfg.easing, () => ( "easeOutQuad"))];
|
|
88
|
-
}
|
|
89
|
-
get target() {
|
|
90
|
-
return this.to;
|
|
91
|
-
}
|
|
92
|
-
retarget(to) {
|
|
93
|
-
this.from = this.value;
|
|
94
|
-
this.to = to;
|
|
95
|
-
this.elapsed = 0;
|
|
96
|
-
}
|
|
97
|
-
tick(dtMs) {
|
|
98
|
-
this.elapsed += dtMs;
|
|
99
|
-
const active = this.elapsed - this.delay;
|
|
100
|
-
if (active <= 0) return;
|
|
101
|
-
const p = Math.min(active / this.duration, 1);
|
|
102
|
-
this.value = this.from + (this.to - this.from) * this.ease(p);
|
|
103
|
-
}
|
|
104
|
-
isDone() {
|
|
105
|
-
return this.elapsed - this.delay >= this.duration;
|
|
106
|
-
}
|
|
107
|
-
}, _class2);
|
|
108
|
-
var SpringDriver = class {
|
|
109
|
-
|
|
110
|
-
constructor(from, to, cfg) {
|
|
111
|
-
this.spring = new SpringPhysics(from);
|
|
112
|
-
if (cfg.stiffness !== void 0) this.spring.stiffness = cfg.stiffness;
|
|
113
|
-
if (cfg.damping !== void 0) this.spring.damping = cfg.damping;
|
|
114
|
-
if (cfg.mass !== void 0) this.spring.mass = cfg.mass;
|
|
115
|
-
this.spring.target = to;
|
|
116
|
-
}
|
|
117
|
-
get value() {
|
|
118
|
-
return this.spring.value;
|
|
119
|
-
}
|
|
120
|
-
get target() {
|
|
121
|
-
return this.spring.target;
|
|
122
|
-
}
|
|
123
|
-
retarget(to) {
|
|
124
|
-
this.spring.target = to;
|
|
125
|
-
}
|
|
126
|
-
tick(dtMs) {
|
|
127
|
-
this.spring.update(dtMs / 1e3);
|
|
128
|
-
}
|
|
129
|
-
isDone() {
|
|
130
|
-
return this.spring.isAtRest();
|
|
131
|
-
}
|
|
132
|
-
};
|
|
133
|
-
|
|
134
|
-
// src/tree/Entity.ts
|
|
6
|
+
var _animation = require('@vectojs/animation');
|
|
135
7
|
var ANIMATABLE_PROPS = /* @__PURE__ */ new Set([
|
|
136
8
|
"x",
|
|
137
9
|
"y",
|
|
@@ -140,7 +12,7 @@ var ANIMATABLE_PROPS = /* @__PURE__ */ new Set([
|
|
|
140
12
|
"rotation",
|
|
141
13
|
"opacity"
|
|
142
14
|
]);
|
|
143
|
-
var VectoJSEvent = (
|
|
15
|
+
var VectoJSEvent = (_class = class {
|
|
144
16
|
/** The event name. */
|
|
145
17
|
|
|
146
18
|
/** The entity the event originated on. */
|
|
@@ -152,9 +24,9 @@ var VectoJSEvent = (_class3 = class {
|
|
|
152
24
|
/** Whether the event bubbles past its target (capture always runs). */
|
|
153
25
|
|
|
154
26
|
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
constructor(type, target, nativeEvent, bubbles = true, scenePoint) {;
|
|
27
|
+
__init() {this.stopped = false}
|
|
28
|
+
__init2() {this.stoppedImmediate = false}
|
|
29
|
+
constructor(type, target, nativeEvent, bubbles = true, scenePoint) {;_class.prototype.__init.call(this);_class.prototype.__init2.call(this);
|
|
158
30
|
this.type = type;
|
|
159
31
|
this.target = target;
|
|
160
32
|
this.currentTarget = target;
|
|
@@ -252,11 +124,11 @@ var VectoJSEvent = (_class3 = class {
|
|
|
252
124
|
get key() {
|
|
253
125
|
return _optionalChain([this, 'access', _38 => _38.nativeEvent, 'optionalAccess', _39 => _39.key]);
|
|
254
126
|
}
|
|
255
|
-
},
|
|
256
|
-
var Entity = (
|
|
127
|
+
}, _class);
|
|
128
|
+
var Entity = (_class2 = class {
|
|
257
129
|
|
|
258
|
-
|
|
259
|
-
|
|
130
|
+
__init3() {this.children = []}
|
|
131
|
+
__init4() {this.parent = null}
|
|
260
132
|
/**
|
|
261
133
|
* Walk up the parent chain to find the scene this entity is currently attached to.
|
|
262
134
|
*/
|
|
@@ -264,18 +136,18 @@ var Entity = (_class4 = class {
|
|
|
264
136
|
if (this._scene) return this._scene;
|
|
265
137
|
return this.parent ? this.parent.scene : null;
|
|
266
138
|
}
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
139
|
+
__init5() {this._x = 0}
|
|
140
|
+
__init6() {this._y = 0}
|
|
141
|
+
__init7() {this._scaleX = 1}
|
|
142
|
+
__init8() {this._scaleY = 1}
|
|
143
|
+
__init9() {this._rotation = 0}
|
|
144
|
+
__init10() {this._opacity = 1}
|
|
273
145
|
// Fast-path flag: false for the overwhelming majority of entities (incl. the
|
|
274
146
|
// Danmaku hot loop), so a bare `entity.x = v` is one boolean check + field write.
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
147
|
+
__init11() {this._hasTransitions = false}
|
|
148
|
+
__init12() {this._transitions = null}
|
|
149
|
+
__init13() {this._drivers = /* @__PURE__ */ new Map()}
|
|
150
|
+
__init14() {this._mounted = false}
|
|
279
151
|
get x() {
|
|
280
152
|
return this._x;
|
|
281
153
|
}
|
|
@@ -318,8 +190,8 @@ var Entity = (_class4 = class {
|
|
|
318
190
|
if (this._hasTransitions) this._animateProp("opacity", v);
|
|
319
191
|
else this._opacity = v;
|
|
320
192
|
}
|
|
321
|
-
|
|
322
|
-
|
|
193
|
+
__init15() {this.isDOMPortal = false}
|
|
194
|
+
__init16() {this._interactive = false}
|
|
323
195
|
get interactive() {
|
|
324
196
|
return this._interactive;
|
|
325
197
|
}
|
|
@@ -333,10 +205,10 @@ var Entity = (_class4 = class {
|
|
|
333
205
|
}
|
|
334
206
|
}
|
|
335
207
|
}
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
208
|
+
__init17() {this.width = 0}
|
|
209
|
+
__init18() {this.height = 0}
|
|
210
|
+
__init19() {this.a11yOffsetX = 0}
|
|
211
|
+
__init20() {this.a11yOffsetY = 0}
|
|
340
212
|
/**
|
|
341
213
|
* Opt in to a viewport-filling accessibility/automation shadow node even when
|
|
342
214
|
* this entity has no intrinsic box (`width`/`height` of `0`). Use for
|
|
@@ -344,19 +216,19 @@ var Entity = (_class4 = class {
|
|
|
344
216
|
* that need global pointer events. The node is mounted behind all other shadow
|
|
345
217
|
* nodes, so on-top components stay clickable.
|
|
346
218
|
*/
|
|
347
|
-
|
|
219
|
+
__init21() {this.a11yFullViewport = false}
|
|
348
220
|
/**
|
|
349
221
|
* Clip this node's children to its local box (`[0,0]–[width,height]`) while
|
|
350
222
|
* rendering. Combined with translating a content child, this is how
|
|
351
223
|
* scroll/overflow containers (e.g. `ScrollView`) keep their content inside a
|
|
352
224
|
* fixed viewport. Off by default (children render unclipped). Canvas2D only.
|
|
353
225
|
*/
|
|
354
|
-
|
|
355
|
-
|
|
226
|
+
__init22() {this.clipChildren = false}
|
|
227
|
+
__init23() {this.listeners = /* @__PURE__ */ new Map()}
|
|
356
228
|
/** Capture-phase listeners (fired root→target before bubble). */
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
constructor(id) {;
|
|
229
|
+
__init24() {this.captureListeners = /* @__PURE__ */ new Map()}
|
|
230
|
+
__init25() {this.animations = []}
|
|
231
|
+
constructor(id) {;_class2.prototype.__init3.call(this);_class2.prototype.__init4.call(this);_class2.prototype.__init5.call(this);_class2.prototype.__init6.call(this);_class2.prototype.__init7.call(this);_class2.prototype.__init8.call(this);_class2.prototype.__init9.call(this);_class2.prototype.__init10.call(this);_class2.prototype.__init11.call(this);_class2.prototype.__init12.call(this);_class2.prototype.__init13.call(this);_class2.prototype.__init14.call(this);_class2.prototype.__init15.call(this);_class2.prototype.__init16.call(this);_class2.prototype.__init17.call(this);_class2.prototype.__init18.call(this);_class2.prototype.__init19.call(this);_class2.prototype.__init20.call(this);_class2.prototype.__init21.call(this);_class2.prototype.__init22.call(this);_class2.prototype.__init23.call(this);_class2.prototype.__init24.call(this);_class2.prototype.__init25.call(this);
|
|
360
232
|
this.id = id || `entity_${Math.random().toString(36).substring(2, 9)}`;
|
|
361
233
|
}
|
|
362
234
|
/**
|
|
@@ -546,7 +418,7 @@ var Entity = (_class4 = class {
|
|
|
546
418
|
return;
|
|
547
419
|
}
|
|
548
420
|
const from = this._currentOf(prop);
|
|
549
|
-
const driver = isTweenConfig(cfg) ? new TweenDriver(from, to, cfg) : new SpringDriver(from, to, cfg === "spring" ? {} : cfg);
|
|
421
|
+
const driver = _animation.isTweenConfig.call(void 0, cfg) ? new (0, _animation.TweenDriver)(from, to, cfg) : new (0, _animation.SpringDriver)(from, to, cfg === "spring" ? {} : cfg);
|
|
550
422
|
this._drivers.set(prop, driver);
|
|
551
423
|
_optionalChain([this, 'access', _46 => _46.scene, 'optionalAccess', _47 => _47.markDirty, 'call', _48 => _48()]);
|
|
552
424
|
}
|
|
@@ -983,132 +855,11 @@ var Entity = (_class4 = class {
|
|
|
983
855
|
hasPendingAnimations() {
|
|
984
856
|
return this.animations.length > 0 || this._drivers.size > 0;
|
|
985
857
|
}
|
|
986
|
-
},
|
|
987
|
-
|
|
988
|
-
// src/text/Typography.ts
|
|
989
|
-
var typographyContext;
|
|
990
|
-
var baselineCache = /* @__PURE__ */ new Map();
|
|
991
|
-
function cssLineBoxBaseline(font, lineHeight) {
|
|
992
|
-
if (typeof document === "undefined") return lineHeight * 0.8;
|
|
993
|
-
const key = `${font}\0${lineHeight}`;
|
|
994
|
-
const cached = baselineCache.get(key);
|
|
995
|
-
if (cached !== void 0) return cached;
|
|
996
|
-
if (typographyContext === void 0) {
|
|
997
|
-
typographyContext = document.createElement("canvas").getContext("2d");
|
|
998
|
-
}
|
|
999
|
-
if (!typographyContext) return lineHeight * 0.8;
|
|
1000
|
-
typographyContext.font = font;
|
|
1001
|
-
const metrics = typographyContext.measureText("Mg");
|
|
1002
|
-
const ascent = metrics.fontBoundingBoxAscent || metrics.actualBoundingBoxAscent;
|
|
1003
|
-
const descent = metrics.fontBoundingBoxDescent || metrics.actualBoundingBoxDescent;
|
|
1004
|
-
if (!(ascent > 0) || !(descent >= 0)) return lineHeight * 0.8;
|
|
1005
|
-
const baseline = (lineHeight - ascent - descent) / 2 + ascent;
|
|
1006
|
-
baselineCache.set(key, baseline);
|
|
1007
|
-
return baseline;
|
|
1008
|
-
}
|
|
1009
|
-
function clearCssLineBoxMetrics() {
|
|
1010
|
-
baselineCache.clear();
|
|
1011
|
-
}
|
|
1012
|
-
|
|
1013
|
-
// src/text/MSDFFont.ts
|
|
1014
|
-
function kernKey(a, b) {
|
|
1015
|
-
return a * 1114112 + b;
|
|
1016
|
-
}
|
|
1017
|
-
var MSDFFont = (_class5 = class _MSDFFont {
|
|
1018
|
-
static __initStatic() {this.idCounter = 0}
|
|
1019
|
-
|
|
1020
|
-
|
|
1021
|
-
__init33() {this.byCode = /* @__PURE__ */ new Map()}
|
|
1022
|
-
__init34() {this.kern = /* @__PURE__ */ new Map()}
|
|
1023
|
-
constructor(data) {;_class5.prototype.__init33.call(this);_class5.prototype.__init34.call(this);
|
|
1024
|
-
this.id = `font-${_MSDFFont.idCounter++}`;
|
|
1025
|
-
this.data = data;
|
|
1026
|
-
for (const g of data.glyphs) this.byCode.set(g.unicode, g);
|
|
1027
|
-
for (const k of _nullishCoalesce(data.kerning, () => ( []))) this.kern.set(kernKey(k.unicode1, k.unicode2), k.advance);
|
|
1028
|
-
}
|
|
1029
|
-
/** Parse the `msdf-atlas-gen` JSON (string or already-parsed object). */
|
|
1030
|
-
static parse(json) {
|
|
1031
|
-
return new _MSDFFont(typeof json === "string" ? JSON.parse(json) : json);
|
|
1032
|
-
}
|
|
1033
|
-
/** Get a glyph's definition by its unicode value in O(1) time. */
|
|
1034
|
-
getGlyph(unicode) {
|
|
1035
|
-
return this.byCode.get(unicode);
|
|
1036
|
-
}
|
|
1037
|
-
/** Distance field range in atlas pixels (for the shader's `u_distanceRange`). */
|
|
1038
|
-
get distanceRange() {
|
|
1039
|
-
return this.data.atlas.distanceRange;
|
|
1040
|
-
}
|
|
1041
|
-
get atlasWidth() {
|
|
1042
|
-
return this.data.atlas.width;
|
|
1043
|
-
}
|
|
1044
|
-
get atlasHeight() {
|
|
1045
|
-
return this.data.atlas.height;
|
|
1046
|
-
}
|
|
1047
|
-
/**
|
|
1048
|
-
* Lay `text` out at `fontSizePx`. Returns positioned quads (skipping glyphs the
|
|
1049
|
-
* font doesn't contain), the widest line's advance, and the total block height.
|
|
1050
|
-
* Honors `\n`, kerning pairs, and `letterSpacing`.
|
|
1051
|
-
*/
|
|
1052
|
-
layout(text, fontSizePx, opts = {}) {
|
|
1053
|
-
const { x = 0, y = 0, letterSpacing = 0 } = opts;
|
|
1054
|
-
const { width: aw, height: ah, yOrigin } = this.data.atlas;
|
|
1055
|
-
const { lineHeight, ascender } = this.data.metrics;
|
|
1056
|
-
const glyphs = [];
|
|
1057
|
-
let penX = x;
|
|
1058
|
-
let line = 0;
|
|
1059
|
-
let maxAdvance = 0;
|
|
1060
|
-
let prevCode = -1;
|
|
1061
|
-
const chars = Array.from(text);
|
|
1062
|
-
for (const char of chars) {
|
|
1063
|
-
if (char === "\n") {
|
|
1064
|
-
maxAdvance = Math.max(maxAdvance, penX - x);
|
|
1065
|
-
penX = x;
|
|
1066
|
-
line++;
|
|
1067
|
-
prevCode = -1;
|
|
1068
|
-
continue;
|
|
1069
|
-
}
|
|
1070
|
-
const code = char.codePointAt(0);
|
|
1071
|
-
const def = this.byCode.get(code);
|
|
1072
|
-
if (!def) {
|
|
1073
|
-
prevCode = -1;
|
|
1074
|
-
continue;
|
|
1075
|
-
}
|
|
1076
|
-
if (prevCode >= 0) {
|
|
1077
|
-
const k = this.kern.get(kernKey(prevCode, code));
|
|
1078
|
-
if (k) penX += k * fontSizePx;
|
|
1079
|
-
}
|
|
1080
|
-
const baseline = y + (ascender + line * lineHeight) * fontSizePx;
|
|
1081
|
-
const pb = def.planeBounds;
|
|
1082
|
-
const ab = def.atlasBounds;
|
|
1083
|
-
if (pb && ab) {
|
|
1084
|
-
const v0 = yOrigin === "bottom" ? 1 - ab.top / ah : ab.top / ah;
|
|
1085
|
-
const v1 = yOrigin === "bottom" ? 1 - ab.bottom / ah : ab.bottom / ah;
|
|
1086
|
-
glyphs.push({
|
|
1087
|
-
char,
|
|
1088
|
-
x: penX + pb.left * fontSizePx,
|
|
1089
|
-
y: baseline - pb.top * fontSizePx,
|
|
1090
|
-
w: (pb.right - pb.left) * fontSizePx,
|
|
1091
|
-
h: (pb.top - pb.bottom) * fontSizePx,
|
|
1092
|
-
u0: ab.left / aw,
|
|
1093
|
-
v0,
|
|
1094
|
-
u1: ab.right / aw,
|
|
1095
|
-
v1
|
|
1096
|
-
});
|
|
1097
|
-
}
|
|
1098
|
-
penX += def.advance * fontSizePx + letterSpacing;
|
|
1099
|
-
prevCode = code;
|
|
1100
|
-
}
|
|
1101
|
-
maxAdvance = Math.max(maxAdvance, penX - x);
|
|
1102
|
-
return {
|
|
1103
|
-
glyphs,
|
|
1104
|
-
width: maxAdvance,
|
|
1105
|
-
height: (line + 1) * lineHeight * fontSizePx
|
|
1106
|
-
};
|
|
1107
|
-
}
|
|
1108
|
-
}, _class5.__initStatic(), _class5);
|
|
858
|
+
}, _class2);
|
|
1109
859
|
|
|
1110
860
|
// src/text/MSDFTextEntity.ts
|
|
1111
|
-
var
|
|
861
|
+
var _layout = require('@vectojs/layout');
|
|
862
|
+
var MSDFTextEntity = (_class3 = class extends Entity {
|
|
1112
863
|
|
|
1113
864
|
|
|
1114
865
|
|
|
@@ -1118,13 +869,13 @@ var MSDFTextEntity = (_class6 = class extends Entity {
|
|
|
1118
869
|
|
|
1119
870
|
|
|
1120
871
|
|
|
1121
|
-
|
|
1122
|
-
|
|
1123
|
-
|
|
1124
|
-
|
|
1125
|
-
|
|
872
|
+
__init26() {this.text = ""}
|
|
873
|
+
__init27() {this.lastRenderedSeqId = 0}
|
|
874
|
+
__init28() {this.rgbColorCache = /* @__PURE__ */ new Map()}
|
|
875
|
+
__init29() {this.fontStringCache = []}
|
|
876
|
+
__init30() {this.layoutResult = null}
|
|
1126
877
|
constructor(text, options) {
|
|
1127
|
-
super();
|
|
878
|
+
super();_class3.prototype.__init26.call(this);_class3.prototype.__init27.call(this);_class3.prototype.__init28.call(this);_class3.prototype.__init29.call(this);_class3.prototype.__init30.call(this);;
|
|
1128
879
|
this.font = options.font;
|
|
1129
880
|
this.texture = options.texture;
|
|
1130
881
|
this.fallbackFont = _nullishCoalesce(options.fallbackFont, () => ( "sans-serif"));
|
|
@@ -1148,7 +899,7 @@ var MSDFTextEntity = (_class6 = class extends Entity {
|
|
|
1148
899
|
this.queueLayout();
|
|
1149
900
|
}
|
|
1150
901
|
queueLayout() {
|
|
1151
|
-
|
|
902
|
+
_layout.LayoutWorkerManager.getInstance().queueLayout(this.id, this.text, {
|
|
1152
903
|
fontId: this.font.id,
|
|
1153
904
|
fontSize: this.fontSize,
|
|
1154
905
|
maxWidth: this.maxWidth,
|
|
@@ -1265,10 +1016,10 @@ var MSDFTextEntity = (_class6 = class extends Entity {
|
|
|
1265
1016
|
}
|
|
1266
1017
|
}
|
|
1267
1018
|
destroy() {
|
|
1268
|
-
|
|
1019
|
+
_layout.LayoutWorkerManager.getInstance().cancelLayout(this.id);
|
|
1269
1020
|
super.destroy();
|
|
1270
1021
|
}
|
|
1271
|
-
},
|
|
1022
|
+
}, _class3);
|
|
1272
1023
|
|
|
1273
1024
|
// src/text/SVGEntity.ts
|
|
1274
1025
|
function isSvgWhitespace(ch) {
|
|
@@ -1301,20 +1052,20 @@ function readSvgAttribute(source, name) {
|
|
|
1301
1052
|
}
|
|
1302
1053
|
return null;
|
|
1303
1054
|
}
|
|
1304
|
-
var SVGEntity = (
|
|
1305
|
-
|
|
1306
|
-
|
|
1307
|
-
|
|
1308
|
-
|
|
1309
|
-
|
|
1310
|
-
|
|
1311
|
-
|
|
1312
|
-
|
|
1313
|
-
|
|
1314
|
-
|
|
1315
|
-
|
|
1055
|
+
var SVGEntity = (_class4 = class extends Entity {
|
|
1056
|
+
__init31() {this.svgSource = ""}
|
|
1057
|
+
__init32() {this.imageBitmap = null}
|
|
1058
|
+
__init33() {this.imageElement = null}
|
|
1059
|
+
__init34() {this.blobURL = null}
|
|
1060
|
+
__init35() {this.currentImg = null}
|
|
1061
|
+
__init36() {this.lodTimeout = null}
|
|
1062
|
+
__init37() {this.cachedDoc = null}
|
|
1063
|
+
__init38() {this.baseWidth = 100}
|
|
1064
|
+
__init39() {this.baseHeight = 100}
|
|
1065
|
+
__init40() {this.lastRasterizedScale = 1}
|
|
1066
|
+
__init41() {this.targetScale = 1}
|
|
1316
1067
|
constructor(svgSource, id) {
|
|
1317
|
-
super(id);
|
|
1068
|
+
super(id);_class4.prototype.__init31.call(this);_class4.prototype.__init32.call(this);_class4.prototype.__init33.call(this);_class4.prototype.__init34.call(this);_class4.prototype.__init35.call(this);_class4.prototype.__init36.call(this);_class4.prototype.__init37.call(this);_class4.prototype.__init38.call(this);_class4.prototype.__init39.call(this);_class4.prototype.__init40.call(this);_class4.prototype.__init41.call(this);;
|
|
1318
1069
|
this.setSVGSource(svgSource);
|
|
1319
1070
|
}
|
|
1320
1071
|
setSVGSource(svgSource) {
|
|
@@ -1503,219 +1254,11 @@ var SVGEntity = (_class7 = class extends Entity {
|
|
|
1503
1254
|
this.cachedDoc = null;
|
|
1504
1255
|
super.destroy();
|
|
1505
1256
|
}
|
|
1506
|
-
},
|
|
1507
|
-
|
|
1508
|
-
// src/text/PreparedContentGrid.ts
|
|
1509
|
-
var nextRevision = 1;
|
|
1510
|
-
var graphemeSegmenter = typeof Intl !== "undefined" && "Segmenter" in Intl ? new Intl.Segmenter(void 0, { granularity: "grapheme" }) : null;
|
|
1511
|
-
var MARK = /\p{Mark}/u;
|
|
1512
|
-
var EXTENDED_PICTOGRAPHIC = /\p{Extended_Pictographic}/u;
|
|
1513
|
-
var REGIONAL_INDICATOR = /\p{Regional_Indicator}/u;
|
|
1514
|
-
var BIDI_CONTROL = /\p{Bidi_Control}/u;
|
|
1515
|
-
var EAST_ASIAN_WIDE = /[ᄀ-ᅟ⌚-⌛⏩-⏬⏰⏳◽-◾⺀-〾ぁ-㏿㐀-䶿一-鿿ꀀ-가-힣豈-︰-﹏-⦆¢-₩]/u;
|
|
1516
|
-
function codePointAt(text, index) {
|
|
1517
|
-
const point = text.codePointAt(index);
|
|
1518
|
-
if (point === void 0) return { value: "", next: index };
|
|
1519
|
-
const value = String.fromCodePoint(point);
|
|
1520
|
-
return { value, next: index + value.length };
|
|
1521
|
-
}
|
|
1522
|
-
function fallbackGraphemes(text) {
|
|
1523
|
-
const parts = [];
|
|
1524
|
-
let index = 0;
|
|
1525
|
-
while (index < text.length) {
|
|
1526
|
-
const start = index;
|
|
1527
|
-
let current = codePointAt(text, index);
|
|
1528
|
-
let segment = current.value;
|
|
1529
|
-
index = current.next;
|
|
1530
|
-
let regionalCount = REGIONAL_INDICATOR.test(segment) ? 1 : 0;
|
|
1531
|
-
while (index < text.length) {
|
|
1532
|
-
current = codePointAt(text, index);
|
|
1533
|
-
const point = _nullishCoalesce(current.value.codePointAt(0), () => ( 0));
|
|
1534
|
-
const isVariation = point >= 65024 && point <= 65039;
|
|
1535
|
-
const isEmojiModifier = point >= 127995 && point <= 127999;
|
|
1536
|
-
const isKeycap = point === 8419;
|
|
1537
|
-
if (MARK.test(current.value) || isVariation || isEmojiModifier || isKeycap) {
|
|
1538
|
-
segment += current.value;
|
|
1539
|
-
index = current.next;
|
|
1540
|
-
continue;
|
|
1541
|
-
}
|
|
1542
|
-
if (REGIONAL_INDICATOR.test(current.value) && regionalCount === 1) {
|
|
1543
|
-
segment += current.value;
|
|
1544
|
-
index = current.next;
|
|
1545
|
-
regionalCount++;
|
|
1546
|
-
continue;
|
|
1547
|
-
}
|
|
1548
|
-
if (point === 8205) {
|
|
1549
|
-
segment += current.value;
|
|
1550
|
-
index = current.next;
|
|
1551
|
-
if (index < text.length) {
|
|
1552
|
-
current = codePointAt(text, index);
|
|
1553
|
-
segment += current.value;
|
|
1554
|
-
index = current.next;
|
|
1555
|
-
}
|
|
1556
|
-
continue;
|
|
1557
|
-
}
|
|
1558
|
-
break;
|
|
1559
|
-
}
|
|
1560
|
-
parts.push({ segment, index: start });
|
|
1561
|
-
}
|
|
1562
|
-
return parts;
|
|
1563
|
-
}
|
|
1564
|
-
function graphemes(text) {
|
|
1565
|
-
if (!graphemeSegmenter) return fallbackGraphemes(text);
|
|
1566
|
-
return Array.from(graphemeSegmenter.segment(text), (part) => ({
|
|
1567
|
-
segment: part.segment,
|
|
1568
|
-
index: part.index
|
|
1569
|
-
}));
|
|
1570
|
-
}
|
|
1571
|
-
function lowerBound(values, target) {
|
|
1572
|
-
let low = 0;
|
|
1573
|
-
let high = values.length;
|
|
1574
|
-
while (low < high) {
|
|
1575
|
-
const middle = low + high >>> 1;
|
|
1576
|
-
if (values[middle] < target) low = middle + 1;
|
|
1577
|
-
else high = middle;
|
|
1578
|
-
}
|
|
1579
|
-
return low;
|
|
1580
|
-
}
|
|
1581
|
-
function isWideCluster(cluster) {
|
|
1582
|
-
if (EXTENDED_PICTOGRAPHIC.test(cluster) || REGIONAL_INDICATOR.test(cluster)) return true;
|
|
1583
|
-
if (cluster.includes("\u20E3")) return true;
|
|
1584
|
-
if (EAST_ASIAN_WIDE.test(cluster)) return true;
|
|
1585
|
-
const point = _nullishCoalesce(cluster.codePointAt(0), () => ( 0));
|
|
1586
|
-
return point >= 131072 && point <= 262141;
|
|
1587
|
-
}
|
|
1588
|
-
function sourceLines(source) {
|
|
1589
|
-
const lines = [];
|
|
1590
|
-
let start = 0;
|
|
1591
|
-
while (true) {
|
|
1592
|
-
let end = start;
|
|
1593
|
-
while (end < source.length && source[end] !== "\r" && source[end] !== "\n") end++;
|
|
1594
|
-
if (end === source.length) {
|
|
1595
|
-
lines.push({
|
|
1596
|
-
sourceStart: start,
|
|
1597
|
-
sourceEnd: end,
|
|
1598
|
-
nextSourceStart: end,
|
|
1599
|
-
text: source.slice(start)
|
|
1600
|
-
});
|
|
1601
|
-
break;
|
|
1602
|
-
}
|
|
1603
|
-
const next = source[end] === "\r" && source[end + 1] === "\n" ? end + 2 : end + 1;
|
|
1604
|
-
lines.push({
|
|
1605
|
-
sourceStart: start,
|
|
1606
|
-
sourceEnd: end,
|
|
1607
|
-
nextSourceStart: next,
|
|
1608
|
-
text: source.slice(start, end)
|
|
1609
|
-
});
|
|
1610
|
-
start = next;
|
|
1611
|
-
if (start === source.length) {
|
|
1612
|
-
lines.push({ sourceStart: start, sourceEnd: start, nextSourceStart: start, text: "" });
|
|
1613
|
-
break;
|
|
1614
|
-
}
|
|
1615
|
-
}
|
|
1616
|
-
return lines;
|
|
1617
|
-
}
|
|
1618
|
-
function assertPositiveFinite(value, name) {
|
|
1619
|
-
if (!Number.isFinite(value) || value <= 0) {
|
|
1620
|
-
throw new RangeError(`${name} must be a positive finite number`);
|
|
1621
|
-
}
|
|
1622
|
-
}
|
|
1623
|
-
function prepareContentGrid(source, options) {
|
|
1624
|
-
assertPositiveFinite(options.cellWidth, "cellWidth");
|
|
1625
|
-
assertPositiveFinite(options.lineHeight, "lineHeight");
|
|
1626
|
-
if (!Number.isFinite(options.baseline)) throw new RangeError("baseline must be finite");
|
|
1627
|
-
const tabSize = _nullishCoalesce(options.tabSize, () => ( 4));
|
|
1628
|
-
if (!Number.isInteger(tabSize) || tabSize <= 0) {
|
|
1629
|
-
throw new RangeError("tabSize must be a positive integer");
|
|
1630
|
-
}
|
|
1631
|
-
const rawLines = sourceLines(source);
|
|
1632
|
-
const lines = [];
|
|
1633
|
-
for (let lineIndex = 0; lineIndex < rawLines.length; lineIndex++) {
|
|
1634
|
-
const sourceLine = rawLines[lineIndex];
|
|
1635
|
-
const rawLine = sourceLine.text;
|
|
1636
|
-
const { sourceStart: lineStart, sourceEnd, nextSourceStart } = sourceLine;
|
|
1637
|
-
const rawCaretBoundaries = [
|
|
1638
|
-
0,
|
|
1639
|
-
...graphemes(rawLine).map((grapheme) => grapheme.index + grapheme.segment.length)
|
|
1640
|
-
];
|
|
1641
|
-
const shaped = _chunk4AR425ARjs.ArabicShaper.shapeArabic(rawLine);
|
|
1642
|
-
const shapedParts = graphemes(shaped.shapedText);
|
|
1643
|
-
const levels = _chunk4AR425ARjs.BidiResolver.resolveLevels(shaped.shapedText);
|
|
1644
|
-
const cells = [];
|
|
1645
|
-
let column = 0;
|
|
1646
|
-
for (let index = 0; index < shapedParts.length; index++) {
|
|
1647
|
-
const part = shapedParts[index];
|
|
1648
|
-
const sourceOffset = _nullishCoalesce(shaped.indexMap[part.index], () => ( part.index));
|
|
1649
|
-
const nextPart = shapedParts[index + 1];
|
|
1650
|
-
const sourceOffsetEnd = nextPart ? _nullishCoalesce(shaped.indexMap[nextPart.index], () => ( nextPart.index)) : rawLine.length;
|
|
1651
|
-
const raw = rawLine.slice(sourceOffset, sourceOffsetEnd);
|
|
1652
|
-
const sourceCaretOffsets = [0];
|
|
1653
|
-
for (let caretIndex = lowerBound(rawCaretBoundaries, sourceOffset + 1); caretIndex < rawCaretBoundaries.length && rawCaretBoundaries[caretIndex] < sourceOffsetEnd; caretIndex++) {
|
|
1654
|
-
sourceCaretOffsets.push(rawCaretBoundaries[caretIndex] - sourceOffset);
|
|
1655
|
-
}
|
|
1656
|
-
if (sourceCaretOffsets.at(-1) !== sourceOffsetEnd - sourceOffset) {
|
|
1657
|
-
sourceCaretOffsets.push(sourceOffsetEnd - sourceOffset);
|
|
1658
|
-
}
|
|
1659
|
-
let columns;
|
|
1660
|
-
if (BIDI_CONTROL.test(raw)) columns = 0;
|
|
1661
|
-
else if (raw === " ") columns = tabSize - column % tabSize;
|
|
1662
|
-
else columns = isWideCluster(raw) ? 2 : 1;
|
|
1663
|
-
const advance = columns * options.cellWidth;
|
|
1664
|
-
cells.push({
|
|
1665
|
-
sourceStart: lineStart + sourceOffset,
|
|
1666
|
-
sourceEnd: lineStart + sourceOffsetEnd,
|
|
1667
|
-
sourceCaretOffsets: Object.freeze(sourceCaretOffsets),
|
|
1668
|
-
glyph: part.segment,
|
|
1669
|
-
x: 0,
|
|
1670
|
-
advance,
|
|
1671
|
-
level: _nullishCoalesce(levels[part.index], () => ( 0)),
|
|
1672
|
-
char: part.segment
|
|
1673
|
-
});
|
|
1674
|
-
column += columns;
|
|
1675
|
-
}
|
|
1676
|
-
const visualCells = [...cells];
|
|
1677
|
-
_chunk4AR425ARjs.BidiResolver.reorderVisual(visualCells, _chunk4AR425ARjs.BidiResolver.getBaseLevel(shaped.shapedText));
|
|
1678
|
-
let visualX = 0;
|
|
1679
|
-
for (const cell of visualCells) {
|
|
1680
|
-
cell.x = visualX;
|
|
1681
|
-
visualX += cell.advance;
|
|
1682
|
-
}
|
|
1683
|
-
const frozenCells = cells.map(({ char: _char, ...cell }) => Object.freeze(cell));
|
|
1684
|
-
lines.push(
|
|
1685
|
-
Object.freeze({
|
|
1686
|
-
sourceStart: lineStart,
|
|
1687
|
-
sourceEnd,
|
|
1688
|
-
nextSourceStart,
|
|
1689
|
-
width: visualX,
|
|
1690
|
-
cells: Object.freeze(frozenCells)
|
|
1691
|
-
})
|
|
1692
|
-
);
|
|
1693
|
-
}
|
|
1694
|
-
return Object.freeze({
|
|
1695
|
-
kind: "content-grid",
|
|
1696
|
-
revision: nextRevision++,
|
|
1697
|
-
source,
|
|
1698
|
-
font: options.font,
|
|
1699
|
-
cellWidth: options.cellWidth,
|
|
1700
|
-
lineHeight: options.lineHeight,
|
|
1701
|
-
baseline: options.baseline,
|
|
1702
|
-
tabSize,
|
|
1703
|
-
lines: Object.freeze(lines)
|
|
1704
|
-
});
|
|
1705
|
-
}
|
|
1706
|
-
|
|
1707
|
-
|
|
1708
|
-
|
|
1709
|
-
|
|
1710
|
-
|
|
1711
|
-
|
|
1712
|
-
|
|
1713
|
-
|
|
1714
|
-
|
|
1257
|
+
}, _class4);
|
|
1715
1258
|
|
|
1716
1259
|
|
|
1717
1260
|
|
|
1718
1261
|
|
|
1719
1262
|
|
|
1720
1263
|
|
|
1721
|
-
exports.
|
|
1264
|
+
exports.VectoJSEvent = VectoJSEvent; exports.Entity = Entity; exports.MSDFTextEntity = MSDFTextEntity; exports.SVGEntity = SVGEntity;
|