@twick/2d 0.14.0 → 1.14.3
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/LICENSE +21 -21
- package/editor/editor/tsconfig.build.tsbuildinfo +1 -1
- package/lib/components/Audio.d.ts.map +1 -1
- package/lib/components/Audio.js +33 -3
- package/lib/components/CodeBlock.d.ts +1 -1
- package/lib/components/Img.js +23 -23
- package/lib/components/Line.js +31 -31
- package/lib/components/Media.d.ts +6 -0
- package/lib/components/Media.d.ts.map +1 -1
- package/lib/components/Media.js +277 -61
- package/lib/components/Node.d.ts +1 -1
- package/lib/components/Path.d.ts +1 -1
- package/lib/components/SVG.d.ts +1 -1
- package/lib/components/Shape.d.ts +1 -1
- package/lib/components/Spline.js +25 -25
- package/lib/components/Video.d.ts +0 -1
- package/lib/components/Video.d.ts.map +1 -1
- package/lib/components/Video.js +70 -65
- package/lib/tsconfig.build.tsbuildinfo +1 -1
- package/package.json +4 -5
- package/src/editor/NodeInspectorConfig.tsx +76 -76
- package/src/editor/PreviewOverlayConfig.tsx +67 -67
- package/src/editor/Provider.tsx +93 -93
- package/src/editor/SceneGraphTabConfig.tsx +81 -81
- package/src/editor/icons/CircleIcon.tsx +7 -7
- package/src/editor/icons/CodeBlockIcon.tsx +8 -8
- package/src/editor/icons/CurveIcon.tsx +7 -7
- package/src/editor/icons/GridIcon.tsx +7 -7
- package/src/editor/icons/IconMap.ts +35 -35
- package/src/editor/icons/ImgIcon.tsx +8 -8
- package/src/editor/icons/LayoutIcon.tsx +9 -9
- package/src/editor/icons/LineIcon.tsx +7 -7
- package/src/editor/icons/NodeIcon.tsx +7 -7
- package/src/editor/icons/RayIcon.tsx +7 -7
- package/src/editor/icons/RectIcon.tsx +7 -7
- package/src/editor/icons/ShapeIcon.tsx +7 -7
- package/src/editor/icons/TxtIcon.tsx +8 -8
- package/src/editor/icons/VideoIcon.tsx +7 -7
- package/src/editor/icons/View2DIcon.tsx +10 -10
- package/src/editor/index.ts +17 -17
- package/src/editor/tree/DetachedRoot.tsx +23 -23
- package/src/editor/tree/NodeElement.tsx +74 -74
- package/src/editor/tree/TreeElement.tsx +72 -72
- package/src/editor/tree/TreeRoot.tsx +10 -10
- package/src/editor/tree/ViewRoot.tsx +20 -20
- package/src/editor/tree/index.module.scss +38 -38
- package/src/editor/tree/index.ts +3 -3
- package/src/editor/tsconfig.build.json +5 -5
- package/src/editor/tsconfig.json +12 -12
- package/src/editor/tsdoc.json +4 -4
- package/src/editor/vite-env.d.ts +1 -1
- package/src/lib/code/CodeCursor.ts +445 -445
- package/src/lib/code/CodeDiffer.ts +78 -78
- package/src/lib/code/CodeFragment.ts +97 -97
- package/src/lib/code/CodeHighlighter.ts +75 -75
- package/src/lib/code/CodeMetrics.ts +47 -47
- package/src/lib/code/CodeRange.test.ts +74 -74
- package/src/lib/code/CodeRange.ts +216 -216
- package/src/lib/code/CodeScope.ts +101 -101
- package/src/lib/code/CodeSelection.ts +24 -24
- package/src/lib/code/CodeSignal.ts +327 -327
- package/src/lib/code/CodeTokenizer.ts +54 -54
- package/src/lib/code/DefaultHighlightStyle.ts +98 -98
- package/src/lib/code/LezerHighlighter.ts +113 -113
- package/src/lib/code/diff.test.ts +311 -311
- package/src/lib/code/diff.ts +319 -319
- package/src/lib/code/extractRange.ts +126 -126
- package/src/lib/code/index.ts +13 -13
- package/src/lib/components/Audio.ts +168 -131
- package/src/lib/components/Bezier.ts +105 -105
- package/src/lib/components/Circle.ts +266 -266
- package/src/lib/components/Code.ts +526 -526
- package/src/lib/components/CodeBlock.ts +576 -576
- package/src/lib/components/CubicBezier.ts +112 -112
- package/src/lib/components/Curve.ts +455 -455
- package/src/lib/components/Grid.ts +135 -135
- package/src/lib/components/Icon.ts +96 -96
- package/src/lib/components/Img.ts +319 -319
- package/src/lib/components/Knot.ts +157 -157
- package/src/lib/components/Latex.ts +122 -122
- package/src/lib/components/Layout.ts +1092 -1092
- package/src/lib/components/Line.ts +429 -429
- package/src/lib/components/Media.ts +576 -346
- package/src/lib/components/Node.ts +1940 -1940
- package/src/lib/components/Path.ts +137 -137
- package/src/lib/components/Polygon.ts +171 -171
- package/src/lib/components/QuadBezier.ts +100 -100
- package/src/lib/components/Ray.ts +125 -125
- package/src/lib/components/Rect.ts +187 -187
- package/src/lib/components/Rive.ts +156 -156
- package/src/lib/components/SVG.ts +797 -797
- package/src/lib/components/Shape.ts +143 -143
- package/src/lib/components/Spline.ts +344 -344
- package/src/lib/components/Txt.test.tsx +81 -81
- package/src/lib/components/Txt.ts +203 -203
- package/src/lib/components/TxtLeaf.ts +205 -205
- package/src/lib/components/Video.ts +461 -462
- package/src/lib/components/View2D.ts +98 -98
- package/src/lib/components/__tests__/children.test.tsx +142 -142
- package/src/lib/components/__tests__/clone.test.tsx +126 -126
- package/src/lib/components/__tests__/generatorTest.ts +28 -28
- package/src/lib/components/__tests__/mockScene2D.ts +45 -45
- package/src/lib/components/__tests__/query.test.tsx +122 -122
- package/src/lib/components/__tests__/state.test.tsx +60 -60
- package/src/lib/components/index.ts +28 -28
- package/src/lib/components/types.ts +35 -35
- package/src/lib/curves/ArcSegment.ts +159 -159
- package/src/lib/curves/CircleSegment.ts +77 -77
- package/src/lib/curves/CubicBezierSegment.ts +78 -78
- package/src/lib/curves/CurveDrawingInfo.ts +11 -11
- package/src/lib/curves/CurvePoint.ts +15 -15
- package/src/lib/curves/CurveProfile.ts +7 -7
- package/src/lib/curves/KnotInfo.ts +10 -10
- package/src/lib/curves/LineSegment.ts +62 -62
- package/src/lib/curves/Polynomial.ts +355 -355
- package/src/lib/curves/Polynomial2D.ts +62 -62
- package/src/lib/curves/PolynomialSegment.ts +124 -124
- package/src/lib/curves/QuadBezierSegment.ts +64 -64
- package/src/lib/curves/Segment.ts +17 -17
- package/src/lib/curves/UniformPolynomialCurveSampler.ts +94 -94
- package/src/lib/curves/createCurveProfileLerp.ts +471 -471
- package/src/lib/curves/getBezierSplineProfile.ts +223 -223
- package/src/lib/curves/getCircleProfile.ts +86 -86
- package/src/lib/curves/getPathProfile.ts +178 -178
- package/src/lib/curves/getPointAtDistance.ts +21 -21
- package/src/lib/curves/getPolylineProfile.test.ts +21 -21
- package/src/lib/curves/getPolylineProfile.ts +89 -89
- package/src/lib/curves/getRectProfile.ts +139 -139
- package/src/lib/curves/index.ts +16 -16
- package/src/lib/decorators/canvasStyleSignal.ts +16 -16
- package/src/lib/decorators/colorSignal.ts +9 -9
- package/src/lib/decorators/compound.ts +72 -72
- package/src/lib/decorators/computed.ts +18 -18
- package/src/lib/decorators/defaultStyle.ts +18 -18
- package/src/lib/decorators/filtersSignal.ts +136 -136
- package/src/lib/decorators/index.ts +10 -10
- package/src/lib/decorators/initializers.ts +32 -32
- package/src/lib/decorators/nodeName.ts +13 -13
- package/src/lib/decorators/signal.test.ts +90 -90
- package/src/lib/decorators/signal.ts +345 -345
- package/src/lib/decorators/spacingSignal.ts +15 -15
- package/src/lib/decorators/vector2Signal.ts +30 -30
- package/src/lib/globals.d.ts +2 -2
- package/src/lib/index.ts +8 -8
- package/src/lib/jsx-dev-runtime.ts +2 -2
- package/src/lib/jsx-runtime.ts +46 -46
- package/src/lib/parse-svg-path.d.ts +14 -14
- package/src/lib/partials/Filter.ts +180 -180
- package/src/lib/partials/Gradient.ts +102 -102
- package/src/lib/partials/Pattern.ts +34 -34
- package/src/lib/partials/ShaderConfig.ts +117 -117
- package/src/lib/partials/index.ts +4 -4
- package/src/lib/partials/types.ts +58 -58
- package/src/lib/scenes/Scene2D.ts +242 -242
- package/src/lib/scenes/index.ts +3 -3
- package/src/lib/scenes/makeScene2D.ts +16 -16
- package/src/lib/scenes/useScene2D.ts +6 -6
- package/src/lib/tsconfig.build.json +5 -5
- package/src/lib/tsconfig.json +10 -10
- package/src/lib/tsdoc.json +4 -4
- package/src/lib/utils/CanvasUtils.ts +306 -306
- package/src/lib/utils/diff.test.ts +453 -453
- package/src/lib/utils/diff.ts +148 -148
- package/src/lib/utils/index.ts +2 -2
- package/src/lib/utils/is.ts +11 -11
- package/src/lib/utils/makeSignalExtensions.ts +30 -30
- package/src/lib/utils/video/declarations.d.ts +1 -1
- package/src/lib/utils/video/ffmpeg-client.ts +50 -50
- package/src/lib/utils/video/mp4-parser-manager.ts +72 -72
- package/src/lib/utils/video/parser/index.ts +1 -1
- package/src/lib/utils/video/parser/parser.ts +257 -257
- package/src/lib/utils/video/parser/sampler.ts +72 -72
- package/src/lib/utils/video/parser/segment.ts +302 -302
- package/src/lib/utils/video/parser/sink.ts +29 -29
- package/src/lib/utils/video/parser/utils.ts +31 -31
- package/src/tsconfig.base.json +19 -19
- package/src/tsconfig.build.json +8 -8
- package/src/tsconfig.json +5 -5
- package/tsconfig.project.json +7 -7
- package/lib/components/utils/waitUntil.d.ts +0 -7
- package/lib/components/utils/waitUntil.d.ts.map +0 -1
- package/lib/components/utils/waitUntil.js +0 -15
- package/lib/utils/waitUntil.d.ts +0 -7
- package/lib/utils/waitUntil.d.ts.map +0 -1
- package/lib/utils/waitUntil.js +0 -15
- package/src/lib/utils/waitUntil.ts +0 -18
|
@@ -1,345 +1,345 @@
|
|
|
1
|
-
import type {
|
|
2
|
-
InterpolationFunction,
|
|
3
|
-
SignalValue,
|
|
4
|
-
TimingFunction,
|
|
5
|
-
} from '@twick/core';
|
|
6
|
-
import {capitalize, deepLerp, SignalContext, useLogger} from '@twick/core';
|
|
7
|
-
import {makeSignalExtensions} from '../utils/makeSignalExtensions';
|
|
8
|
-
import {addInitializer, initialize} from './initializers';
|
|
9
|
-
|
|
10
|
-
export interface PropertyMetadata<T> {
|
|
11
|
-
default?: T;
|
|
12
|
-
interpolationFunction?: InterpolationFunction<T>;
|
|
13
|
-
parser?: (value: any) => T;
|
|
14
|
-
getter?: () => T;
|
|
15
|
-
setter?: (value: any) => void;
|
|
16
|
-
tweener?: (
|
|
17
|
-
value: T,
|
|
18
|
-
duration: number,
|
|
19
|
-
timingFunction: TimingFunction,
|
|
20
|
-
interpolationFunction: InterpolationFunction<T>,
|
|
21
|
-
) => void;
|
|
22
|
-
cloneable?: boolean;
|
|
23
|
-
inspectable?: boolean;
|
|
24
|
-
compoundParent?: string;
|
|
25
|
-
compound?: boolean;
|
|
26
|
-
compoundEntries: [string, string][];
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
const PROPERTIES = Symbol.for('@twick/2d/decorators/properties');
|
|
30
|
-
|
|
31
|
-
export function getPropertyMeta<T>(
|
|
32
|
-
object: any,
|
|
33
|
-
key: string | symbol,
|
|
34
|
-
): PropertyMetadata<T> | null {
|
|
35
|
-
return object[PROPERTIES]?.[key] ?? null;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
export function getPropertyMetaOrCreate<T>(
|
|
39
|
-
object: any,
|
|
40
|
-
key: string | symbol,
|
|
41
|
-
): PropertyMetadata<T> {
|
|
42
|
-
let lookup: Record<string | symbol, PropertyMetadata<T>>;
|
|
43
|
-
if (!object[PROPERTIES]) {
|
|
44
|
-
object[PROPERTIES] = lookup = {};
|
|
45
|
-
} else if (
|
|
46
|
-
object[PROPERTIES] &&
|
|
47
|
-
!Object.prototype.hasOwnProperty.call(object, PROPERTIES)
|
|
48
|
-
) {
|
|
49
|
-
object[PROPERTIES] = lookup = Object.fromEntries<PropertyMetadata<T>>(
|
|
50
|
-
Object.entries(
|
|
51
|
-
<Record<string | symbol, PropertyMetadata<T>>>object[PROPERTIES],
|
|
52
|
-
).map(([key, meta]) => [key, {...meta}]),
|
|
53
|
-
);
|
|
54
|
-
} else {
|
|
55
|
-
lookup = object[PROPERTIES];
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
lookup[key] ??= {
|
|
59
|
-
cloneable: true,
|
|
60
|
-
inspectable: true,
|
|
61
|
-
compoundEntries: [],
|
|
62
|
-
};
|
|
63
|
-
return lookup[key];
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
export function getPropertiesOf(
|
|
67
|
-
value: any,
|
|
68
|
-
): Record<string, PropertyMetadata<any>> {
|
|
69
|
-
if (value && typeof value === 'object') {
|
|
70
|
-
return value[PROPERTIES] ?? {};
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
return {};
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
export function initializeSignals(instance: any, props: Record<string, any>) {
|
|
77
|
-
initialize(instance);
|
|
78
|
-
for (const [key, meta] of Object.entries(getPropertiesOf(instance))) {
|
|
79
|
-
const signal = instance[key];
|
|
80
|
-
signal.reset();
|
|
81
|
-
if (props[key] !== undefined) {
|
|
82
|
-
signal(props[key]);
|
|
83
|
-
}
|
|
84
|
-
if (meta.compoundEntries !== undefined) {
|
|
85
|
-
for (const [key, property] of meta.compoundEntries) {
|
|
86
|
-
if (property in props) {
|
|
87
|
-
signal[key](props[property]);
|
|
88
|
-
}
|
|
89
|
-
}
|
|
90
|
-
}
|
|
91
|
-
}
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
/**
|
|
95
|
-
* Create a signal decorator.
|
|
96
|
-
*
|
|
97
|
-
* @remarks
|
|
98
|
-
* This decorator turns the given property into a signal.
|
|
99
|
-
*
|
|
100
|
-
* The class using this decorator can implement the following methods:
|
|
101
|
-
* - `get[PropertyName]` - A property getter.
|
|
102
|
-
* - `get[PropertyName]` - A property setter.
|
|
103
|
-
* - `tween[PropertyName]` - A tween provider.
|
|
104
|
-
*
|
|
105
|
-
* @example
|
|
106
|
-
* ```ts
|
|
107
|
-
* class Example {
|
|
108
|
-
* \@property()
|
|
109
|
-
* public declare length: Signal<number, this>;
|
|
110
|
-
* }
|
|
111
|
-
* ```
|
|
112
|
-
*/
|
|
113
|
-
export function signal<T>(): PropertyDecorator {
|
|
114
|
-
return (target: any, key) => {
|
|
115
|
-
// FIXME property metadata is not inherited
|
|
116
|
-
// Consider retrieving it inside the initializer using the instance and not
|
|
117
|
-
// the class.
|
|
118
|
-
const meta = getPropertyMetaOrCreate<T>(target, key);
|
|
119
|
-
addInitializer(target, (instance: any) => {
|
|
120
|
-
let initial: SignalValue<T> = meta.default!;
|
|
121
|
-
const defaultMethod = instance[`getDefault${capitalize(key as string)}`];
|
|
122
|
-
if (defaultMethod) {
|
|
123
|
-
initial = () => defaultMethod.call(instance, meta.default);
|
|
124
|
-
}
|
|
125
|
-
|
|
126
|
-
const signal = new SignalContext<T, T, any>(
|
|
127
|
-
initial,
|
|
128
|
-
meta.interpolationFunction ?? deepLerp,
|
|
129
|
-
instance,
|
|
130
|
-
meta.parser?.bind(instance),
|
|
131
|
-
makeSignalExtensions(meta, instance, <string>key),
|
|
132
|
-
);
|
|
133
|
-
instance[key] = signal.toSignal();
|
|
134
|
-
});
|
|
135
|
-
};
|
|
136
|
-
}
|
|
137
|
-
|
|
138
|
-
/**
|
|
139
|
-
* Create an initial signal value decorator.
|
|
140
|
-
*
|
|
141
|
-
* @remarks
|
|
142
|
-
* This decorator specifies the initial value of a property.
|
|
143
|
-
*
|
|
144
|
-
* Must be specified before the {@link signal} decorator.
|
|
145
|
-
*
|
|
146
|
-
* @example
|
|
147
|
-
* ```ts
|
|
148
|
-
* class Example {
|
|
149
|
-
* \@initial(1)
|
|
150
|
-
* \@property()
|
|
151
|
-
* public declare length: Signal<number, this>;
|
|
152
|
-
* }
|
|
153
|
-
* ```
|
|
154
|
-
*
|
|
155
|
-
* @param value - The initial value of the property.
|
|
156
|
-
*/
|
|
157
|
-
export function initial<T>(value: T): PropertyDecorator {
|
|
158
|
-
return (target: any, key) => {
|
|
159
|
-
const meta = getPropertyMeta<T>(target, key);
|
|
160
|
-
if (!meta) {
|
|
161
|
-
useLogger().error(`Missing property decorator for "${key.toString()}"`);
|
|
162
|
-
return;
|
|
163
|
-
}
|
|
164
|
-
meta.default = value;
|
|
165
|
-
};
|
|
166
|
-
}
|
|
167
|
-
|
|
168
|
-
/**
|
|
169
|
-
* Create a signal interpolation function decorator.
|
|
170
|
-
*
|
|
171
|
-
* @remarks
|
|
172
|
-
* This decorator specifies the interpolation function of a property.
|
|
173
|
-
* The interpolation function is used when tweening between different values.
|
|
174
|
-
*
|
|
175
|
-
* Must be specified before the {@link signal} decorator.
|
|
176
|
-
*
|
|
177
|
-
* @example
|
|
178
|
-
* ```ts
|
|
179
|
-
* class Example {
|
|
180
|
-
* \@interpolation(textLerp)
|
|
181
|
-
* \@property()
|
|
182
|
-
* public declare text: Signal<string, this>;
|
|
183
|
-
* }
|
|
184
|
-
* ```
|
|
185
|
-
*
|
|
186
|
-
* @param value - The interpolation function for the property.
|
|
187
|
-
*/
|
|
188
|
-
export function interpolation<T>(
|
|
189
|
-
value: InterpolationFunction<T>,
|
|
190
|
-
): PropertyDecorator {
|
|
191
|
-
return (target: any, key) => {
|
|
192
|
-
const meta = getPropertyMeta<T>(target, key);
|
|
193
|
-
if (!meta) {
|
|
194
|
-
useLogger().error(`Missing property decorator for "${key.toString()}"`);
|
|
195
|
-
return;
|
|
196
|
-
}
|
|
197
|
-
meta.interpolationFunction = value;
|
|
198
|
-
};
|
|
199
|
-
}
|
|
200
|
-
|
|
201
|
-
/**
|
|
202
|
-
* Create a signal parser decorator.
|
|
203
|
-
*
|
|
204
|
-
* @remarks
|
|
205
|
-
* This decorator specifies the parser of a property.
|
|
206
|
-
* Instead of returning the raw value, its passed as the first parameter to the
|
|
207
|
-
* parser and the resulting value is returned.
|
|
208
|
-
*
|
|
209
|
-
* If the wrapper class has a method called `lerp` it will be set as the
|
|
210
|
-
* default interpolation function for the property.
|
|
211
|
-
*
|
|
212
|
-
* Must be specified before the {@link signal} decorator.
|
|
213
|
-
*
|
|
214
|
-
* @example
|
|
215
|
-
* ```ts
|
|
216
|
-
* class Example {
|
|
217
|
-
* \@wrapper(Vector2)
|
|
218
|
-
* \@property()
|
|
219
|
-
* public declare offset: Signal<Vector2, this>;
|
|
220
|
-
* }
|
|
221
|
-
* ```
|
|
222
|
-
*
|
|
223
|
-
* @param value - The wrapper class for the property.
|
|
224
|
-
*/
|
|
225
|
-
export function parser<T>(value: (value: any) => T): PropertyDecorator {
|
|
226
|
-
return (target: any, key) => {
|
|
227
|
-
const meta = getPropertyMeta<T>(target, key);
|
|
228
|
-
if (!meta) {
|
|
229
|
-
useLogger().error(`Missing property decorator for "${key.toString()}"`);
|
|
230
|
-
return;
|
|
231
|
-
}
|
|
232
|
-
meta.parser = value;
|
|
233
|
-
};
|
|
234
|
-
}
|
|
235
|
-
|
|
236
|
-
/**
|
|
237
|
-
* Create a signal wrapper decorator.
|
|
238
|
-
*
|
|
239
|
-
* @remarks
|
|
240
|
-
* This is a shortcut decorator for setting both the {@link parser} and
|
|
241
|
-
* {@link interpolation}.
|
|
242
|
-
*
|
|
243
|
-
* The interpolation function will be set only if the wrapper class has a method
|
|
244
|
-
* called `lerp`, which will be used as said function.
|
|
245
|
-
*
|
|
246
|
-
* Must be specified before the {@link signal} decorator.
|
|
247
|
-
*
|
|
248
|
-
* @example
|
|
249
|
-
* ```ts
|
|
250
|
-
* class Example {
|
|
251
|
-
* \@wrapper(Vector2)
|
|
252
|
-
* \@property()
|
|
253
|
-
* public declare offset: Signal<Vector2, this>;
|
|
254
|
-
*
|
|
255
|
-
* // same as:
|
|
256
|
-
* \@parser(value => new Vector2(value))
|
|
257
|
-
* \@interpolation(Vector2.lerp)
|
|
258
|
-
* \@property()
|
|
259
|
-
* public declare offset: Signal<Vector2, this>;
|
|
260
|
-
* }
|
|
261
|
-
* ```
|
|
262
|
-
*
|
|
263
|
-
* @param value - The wrapper class for the property.
|
|
264
|
-
*/
|
|
265
|
-
export function wrapper<T>(
|
|
266
|
-
value: (new (value: any) => T) & {lerp?: InterpolationFunction<T>},
|
|
267
|
-
): PropertyDecorator {
|
|
268
|
-
return (target: any, key) => {
|
|
269
|
-
const meta = getPropertyMeta<T>(target, key);
|
|
270
|
-
if (!meta) {
|
|
271
|
-
useLogger().error(`Missing property decorator for "${key.toString()}"`);
|
|
272
|
-
return;
|
|
273
|
-
}
|
|
274
|
-
meta.parser = raw => new value(raw);
|
|
275
|
-
if ('lerp' in value) {
|
|
276
|
-
meta.interpolationFunction ??= value.lerp;
|
|
277
|
-
}
|
|
278
|
-
};
|
|
279
|
-
}
|
|
280
|
-
|
|
281
|
-
/**
|
|
282
|
-
* Create a cloneable property decorator.
|
|
283
|
-
*
|
|
284
|
-
* @remarks
|
|
285
|
-
* This decorator specifies whether the property should be copied over when
|
|
286
|
-
* cloning the node.
|
|
287
|
-
*
|
|
288
|
-
* By default, any property is cloneable.
|
|
289
|
-
*
|
|
290
|
-
* Must be specified before the {@link signal} decorator.
|
|
291
|
-
*
|
|
292
|
-
* @example
|
|
293
|
-
* ```ts
|
|
294
|
-
* class Example {
|
|
295
|
-
* \@clone(false)
|
|
296
|
-
* \@property()
|
|
297
|
-
* public declare length: Signal<number, this>;
|
|
298
|
-
* }
|
|
299
|
-
* ```
|
|
300
|
-
*
|
|
301
|
-
* @param value - Whether the property should be cloneable.
|
|
302
|
-
*/
|
|
303
|
-
export function cloneable<T>(value = true): PropertyDecorator {
|
|
304
|
-
return (target: any, key) => {
|
|
305
|
-
const meta = getPropertyMeta<T>(target, key);
|
|
306
|
-
if (!meta) {
|
|
307
|
-
useLogger().error(`Missing property decorator for "${key.toString()}"`);
|
|
308
|
-
return;
|
|
309
|
-
}
|
|
310
|
-
meta.cloneable = value;
|
|
311
|
-
};
|
|
312
|
-
}
|
|
313
|
-
|
|
314
|
-
/**
|
|
315
|
-
* Create an inspectable property decorator.
|
|
316
|
-
*
|
|
317
|
-
* @remarks
|
|
318
|
-
* This decorator specifies whether the property should be visible in the
|
|
319
|
-
* inspector.
|
|
320
|
-
*
|
|
321
|
-
* By default, any property is inspectable.
|
|
322
|
-
*
|
|
323
|
-
* Must be specified before the {@link signal} decorator.
|
|
324
|
-
*
|
|
325
|
-
* @example
|
|
326
|
-
* ```ts
|
|
327
|
-
* class Example {
|
|
328
|
-
* \@inspectable(false)
|
|
329
|
-
* \@property()
|
|
330
|
-
* public declare hiddenLength: Signal<number, this>;
|
|
331
|
-
* }
|
|
332
|
-
* ```
|
|
333
|
-
*
|
|
334
|
-
* @param value - Whether the property should be inspectable.
|
|
335
|
-
*/
|
|
336
|
-
export function inspectable<T>(value = true): PropertyDecorator {
|
|
337
|
-
return (target: any, key) => {
|
|
338
|
-
const meta = getPropertyMeta<T>(target, key);
|
|
339
|
-
if (!meta) {
|
|
340
|
-
useLogger().error(`Missing property decorator for "${key.toString()}"`);
|
|
341
|
-
return;
|
|
342
|
-
}
|
|
343
|
-
meta.inspectable = value;
|
|
344
|
-
};
|
|
345
|
-
}
|
|
1
|
+
import type {
|
|
2
|
+
InterpolationFunction,
|
|
3
|
+
SignalValue,
|
|
4
|
+
TimingFunction,
|
|
5
|
+
} from '@twick/core';
|
|
6
|
+
import {capitalize, deepLerp, SignalContext, useLogger} from '@twick/core';
|
|
7
|
+
import {makeSignalExtensions} from '../utils/makeSignalExtensions';
|
|
8
|
+
import {addInitializer, initialize} from './initializers';
|
|
9
|
+
|
|
10
|
+
export interface PropertyMetadata<T> {
|
|
11
|
+
default?: T;
|
|
12
|
+
interpolationFunction?: InterpolationFunction<T>;
|
|
13
|
+
parser?: (value: any) => T;
|
|
14
|
+
getter?: () => T;
|
|
15
|
+
setter?: (value: any) => void;
|
|
16
|
+
tweener?: (
|
|
17
|
+
value: T,
|
|
18
|
+
duration: number,
|
|
19
|
+
timingFunction: TimingFunction,
|
|
20
|
+
interpolationFunction: InterpolationFunction<T>,
|
|
21
|
+
) => void;
|
|
22
|
+
cloneable?: boolean;
|
|
23
|
+
inspectable?: boolean;
|
|
24
|
+
compoundParent?: string;
|
|
25
|
+
compound?: boolean;
|
|
26
|
+
compoundEntries: [string, string][];
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
const PROPERTIES = Symbol.for('@twick/2d/decorators/properties');
|
|
30
|
+
|
|
31
|
+
export function getPropertyMeta<T>(
|
|
32
|
+
object: any,
|
|
33
|
+
key: string | symbol,
|
|
34
|
+
): PropertyMetadata<T> | null {
|
|
35
|
+
return object[PROPERTIES]?.[key] ?? null;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
export function getPropertyMetaOrCreate<T>(
|
|
39
|
+
object: any,
|
|
40
|
+
key: string | symbol,
|
|
41
|
+
): PropertyMetadata<T> {
|
|
42
|
+
let lookup: Record<string | symbol, PropertyMetadata<T>>;
|
|
43
|
+
if (!object[PROPERTIES]) {
|
|
44
|
+
object[PROPERTIES] = lookup = {};
|
|
45
|
+
} else if (
|
|
46
|
+
object[PROPERTIES] &&
|
|
47
|
+
!Object.prototype.hasOwnProperty.call(object, PROPERTIES)
|
|
48
|
+
) {
|
|
49
|
+
object[PROPERTIES] = lookup = Object.fromEntries<PropertyMetadata<T>>(
|
|
50
|
+
Object.entries(
|
|
51
|
+
<Record<string | symbol, PropertyMetadata<T>>>object[PROPERTIES],
|
|
52
|
+
).map(([key, meta]) => [key, {...meta}]),
|
|
53
|
+
);
|
|
54
|
+
} else {
|
|
55
|
+
lookup = object[PROPERTIES];
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
lookup[key] ??= {
|
|
59
|
+
cloneable: true,
|
|
60
|
+
inspectable: true,
|
|
61
|
+
compoundEntries: [],
|
|
62
|
+
};
|
|
63
|
+
return lookup[key];
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
export function getPropertiesOf(
|
|
67
|
+
value: any,
|
|
68
|
+
): Record<string, PropertyMetadata<any>> {
|
|
69
|
+
if (value && typeof value === 'object') {
|
|
70
|
+
return value[PROPERTIES] ?? {};
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
return {};
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
export function initializeSignals(instance: any, props: Record<string, any>) {
|
|
77
|
+
initialize(instance);
|
|
78
|
+
for (const [key, meta] of Object.entries(getPropertiesOf(instance))) {
|
|
79
|
+
const signal = instance[key];
|
|
80
|
+
signal.reset();
|
|
81
|
+
if (props[key] !== undefined) {
|
|
82
|
+
signal(props[key]);
|
|
83
|
+
}
|
|
84
|
+
if (meta.compoundEntries !== undefined) {
|
|
85
|
+
for (const [key, property] of meta.compoundEntries) {
|
|
86
|
+
if (property in props) {
|
|
87
|
+
signal[key](props[property]);
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
/**
|
|
95
|
+
* Create a signal decorator.
|
|
96
|
+
*
|
|
97
|
+
* @remarks
|
|
98
|
+
* This decorator turns the given property into a signal.
|
|
99
|
+
*
|
|
100
|
+
* The class using this decorator can implement the following methods:
|
|
101
|
+
* - `get[PropertyName]` - A property getter.
|
|
102
|
+
* - `get[PropertyName]` - A property setter.
|
|
103
|
+
* - `tween[PropertyName]` - A tween provider.
|
|
104
|
+
*
|
|
105
|
+
* @example
|
|
106
|
+
* ```ts
|
|
107
|
+
* class Example {
|
|
108
|
+
* \@property()
|
|
109
|
+
* public declare length: Signal<number, this>;
|
|
110
|
+
* }
|
|
111
|
+
* ```
|
|
112
|
+
*/
|
|
113
|
+
export function signal<T>(): PropertyDecorator {
|
|
114
|
+
return (target: any, key) => {
|
|
115
|
+
// FIXME property metadata is not inherited
|
|
116
|
+
// Consider retrieving it inside the initializer using the instance and not
|
|
117
|
+
// the class.
|
|
118
|
+
const meta = getPropertyMetaOrCreate<T>(target, key);
|
|
119
|
+
addInitializer(target, (instance: any) => {
|
|
120
|
+
let initial: SignalValue<T> = meta.default!;
|
|
121
|
+
const defaultMethod = instance[`getDefault${capitalize(key as string)}`];
|
|
122
|
+
if (defaultMethod) {
|
|
123
|
+
initial = () => defaultMethod.call(instance, meta.default);
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
const signal = new SignalContext<T, T, any>(
|
|
127
|
+
initial,
|
|
128
|
+
meta.interpolationFunction ?? deepLerp,
|
|
129
|
+
instance,
|
|
130
|
+
meta.parser?.bind(instance),
|
|
131
|
+
makeSignalExtensions(meta, instance, <string>key),
|
|
132
|
+
);
|
|
133
|
+
instance[key] = signal.toSignal();
|
|
134
|
+
});
|
|
135
|
+
};
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
/**
|
|
139
|
+
* Create an initial signal value decorator.
|
|
140
|
+
*
|
|
141
|
+
* @remarks
|
|
142
|
+
* This decorator specifies the initial value of a property.
|
|
143
|
+
*
|
|
144
|
+
* Must be specified before the {@link signal} decorator.
|
|
145
|
+
*
|
|
146
|
+
* @example
|
|
147
|
+
* ```ts
|
|
148
|
+
* class Example {
|
|
149
|
+
* \@initial(1)
|
|
150
|
+
* \@property()
|
|
151
|
+
* public declare length: Signal<number, this>;
|
|
152
|
+
* }
|
|
153
|
+
* ```
|
|
154
|
+
*
|
|
155
|
+
* @param value - The initial value of the property.
|
|
156
|
+
*/
|
|
157
|
+
export function initial<T>(value: T): PropertyDecorator {
|
|
158
|
+
return (target: any, key) => {
|
|
159
|
+
const meta = getPropertyMeta<T>(target, key);
|
|
160
|
+
if (!meta) {
|
|
161
|
+
useLogger().error(`Missing property decorator for "${key.toString()}"`);
|
|
162
|
+
return;
|
|
163
|
+
}
|
|
164
|
+
meta.default = value;
|
|
165
|
+
};
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
/**
|
|
169
|
+
* Create a signal interpolation function decorator.
|
|
170
|
+
*
|
|
171
|
+
* @remarks
|
|
172
|
+
* This decorator specifies the interpolation function of a property.
|
|
173
|
+
* The interpolation function is used when tweening between different values.
|
|
174
|
+
*
|
|
175
|
+
* Must be specified before the {@link signal} decorator.
|
|
176
|
+
*
|
|
177
|
+
* @example
|
|
178
|
+
* ```ts
|
|
179
|
+
* class Example {
|
|
180
|
+
* \@interpolation(textLerp)
|
|
181
|
+
* \@property()
|
|
182
|
+
* public declare text: Signal<string, this>;
|
|
183
|
+
* }
|
|
184
|
+
* ```
|
|
185
|
+
*
|
|
186
|
+
* @param value - The interpolation function for the property.
|
|
187
|
+
*/
|
|
188
|
+
export function interpolation<T>(
|
|
189
|
+
value: InterpolationFunction<T>,
|
|
190
|
+
): PropertyDecorator {
|
|
191
|
+
return (target: any, key) => {
|
|
192
|
+
const meta = getPropertyMeta<T>(target, key);
|
|
193
|
+
if (!meta) {
|
|
194
|
+
useLogger().error(`Missing property decorator for "${key.toString()}"`);
|
|
195
|
+
return;
|
|
196
|
+
}
|
|
197
|
+
meta.interpolationFunction = value;
|
|
198
|
+
};
|
|
199
|
+
}
|
|
200
|
+
|
|
201
|
+
/**
|
|
202
|
+
* Create a signal parser decorator.
|
|
203
|
+
*
|
|
204
|
+
* @remarks
|
|
205
|
+
* This decorator specifies the parser of a property.
|
|
206
|
+
* Instead of returning the raw value, its passed as the first parameter to the
|
|
207
|
+
* parser and the resulting value is returned.
|
|
208
|
+
*
|
|
209
|
+
* If the wrapper class has a method called `lerp` it will be set as the
|
|
210
|
+
* default interpolation function for the property.
|
|
211
|
+
*
|
|
212
|
+
* Must be specified before the {@link signal} decorator.
|
|
213
|
+
*
|
|
214
|
+
* @example
|
|
215
|
+
* ```ts
|
|
216
|
+
* class Example {
|
|
217
|
+
* \@wrapper(Vector2)
|
|
218
|
+
* \@property()
|
|
219
|
+
* public declare offset: Signal<Vector2, this>;
|
|
220
|
+
* }
|
|
221
|
+
* ```
|
|
222
|
+
*
|
|
223
|
+
* @param value - The wrapper class for the property.
|
|
224
|
+
*/
|
|
225
|
+
export function parser<T>(value: (value: any) => T): PropertyDecorator {
|
|
226
|
+
return (target: any, key) => {
|
|
227
|
+
const meta = getPropertyMeta<T>(target, key);
|
|
228
|
+
if (!meta) {
|
|
229
|
+
useLogger().error(`Missing property decorator for "${key.toString()}"`);
|
|
230
|
+
return;
|
|
231
|
+
}
|
|
232
|
+
meta.parser = value;
|
|
233
|
+
};
|
|
234
|
+
}
|
|
235
|
+
|
|
236
|
+
/**
|
|
237
|
+
* Create a signal wrapper decorator.
|
|
238
|
+
*
|
|
239
|
+
* @remarks
|
|
240
|
+
* This is a shortcut decorator for setting both the {@link parser} and
|
|
241
|
+
* {@link interpolation}.
|
|
242
|
+
*
|
|
243
|
+
* The interpolation function will be set only if the wrapper class has a method
|
|
244
|
+
* called `lerp`, which will be used as said function.
|
|
245
|
+
*
|
|
246
|
+
* Must be specified before the {@link signal} decorator.
|
|
247
|
+
*
|
|
248
|
+
* @example
|
|
249
|
+
* ```ts
|
|
250
|
+
* class Example {
|
|
251
|
+
* \@wrapper(Vector2)
|
|
252
|
+
* \@property()
|
|
253
|
+
* public declare offset: Signal<Vector2, this>;
|
|
254
|
+
*
|
|
255
|
+
* // same as:
|
|
256
|
+
* \@parser(value => new Vector2(value))
|
|
257
|
+
* \@interpolation(Vector2.lerp)
|
|
258
|
+
* \@property()
|
|
259
|
+
* public declare offset: Signal<Vector2, this>;
|
|
260
|
+
* }
|
|
261
|
+
* ```
|
|
262
|
+
*
|
|
263
|
+
* @param value - The wrapper class for the property.
|
|
264
|
+
*/
|
|
265
|
+
export function wrapper<T>(
|
|
266
|
+
value: (new (value: any) => T) & {lerp?: InterpolationFunction<T>},
|
|
267
|
+
): PropertyDecorator {
|
|
268
|
+
return (target: any, key) => {
|
|
269
|
+
const meta = getPropertyMeta<T>(target, key);
|
|
270
|
+
if (!meta) {
|
|
271
|
+
useLogger().error(`Missing property decorator for "${key.toString()}"`);
|
|
272
|
+
return;
|
|
273
|
+
}
|
|
274
|
+
meta.parser = raw => new value(raw);
|
|
275
|
+
if ('lerp' in value) {
|
|
276
|
+
meta.interpolationFunction ??= value.lerp;
|
|
277
|
+
}
|
|
278
|
+
};
|
|
279
|
+
}
|
|
280
|
+
|
|
281
|
+
/**
|
|
282
|
+
* Create a cloneable property decorator.
|
|
283
|
+
*
|
|
284
|
+
* @remarks
|
|
285
|
+
* This decorator specifies whether the property should be copied over when
|
|
286
|
+
* cloning the node.
|
|
287
|
+
*
|
|
288
|
+
* By default, any property is cloneable.
|
|
289
|
+
*
|
|
290
|
+
* Must be specified before the {@link signal} decorator.
|
|
291
|
+
*
|
|
292
|
+
* @example
|
|
293
|
+
* ```ts
|
|
294
|
+
* class Example {
|
|
295
|
+
* \@clone(false)
|
|
296
|
+
* \@property()
|
|
297
|
+
* public declare length: Signal<number, this>;
|
|
298
|
+
* }
|
|
299
|
+
* ```
|
|
300
|
+
*
|
|
301
|
+
* @param value - Whether the property should be cloneable.
|
|
302
|
+
*/
|
|
303
|
+
export function cloneable<T>(value = true): PropertyDecorator {
|
|
304
|
+
return (target: any, key) => {
|
|
305
|
+
const meta = getPropertyMeta<T>(target, key);
|
|
306
|
+
if (!meta) {
|
|
307
|
+
useLogger().error(`Missing property decorator for "${key.toString()}"`);
|
|
308
|
+
return;
|
|
309
|
+
}
|
|
310
|
+
meta.cloneable = value;
|
|
311
|
+
};
|
|
312
|
+
}
|
|
313
|
+
|
|
314
|
+
/**
|
|
315
|
+
* Create an inspectable property decorator.
|
|
316
|
+
*
|
|
317
|
+
* @remarks
|
|
318
|
+
* This decorator specifies whether the property should be visible in the
|
|
319
|
+
* inspector.
|
|
320
|
+
*
|
|
321
|
+
* By default, any property is inspectable.
|
|
322
|
+
*
|
|
323
|
+
* Must be specified before the {@link signal} decorator.
|
|
324
|
+
*
|
|
325
|
+
* @example
|
|
326
|
+
* ```ts
|
|
327
|
+
* class Example {
|
|
328
|
+
* \@inspectable(false)
|
|
329
|
+
* \@property()
|
|
330
|
+
* public declare hiddenLength: Signal<number, this>;
|
|
331
|
+
* }
|
|
332
|
+
* ```
|
|
333
|
+
*
|
|
334
|
+
* @param value - Whether the property should be inspectable.
|
|
335
|
+
*/
|
|
336
|
+
export function inspectable<T>(value = true): PropertyDecorator {
|
|
337
|
+
return (target: any, key) => {
|
|
338
|
+
const meta = getPropertyMeta<T>(target, key);
|
|
339
|
+
if (!meta) {
|
|
340
|
+
useLogger().error(`Missing property decorator for "${key.toString()}"`);
|
|
341
|
+
return;
|
|
342
|
+
}
|
|
343
|
+
meta.inspectable = value;
|
|
344
|
+
};
|
|
345
|
+
}
|